rebill-web-components-sdk 1.8.23 → 1.8.25

package/dist/cjs/rebill-container.rebill-input-checkbox.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"rebill-container.rebill-input-checkbox.entry.cjs.js","sources":["src/components/shared/layouts/generics/container.tsx","src/components/shared/inputs/input-checkbox/input-checkbox.css?tag=rebill-input-checkbox","src/components/shared/inputs/input-checkbox/input-checkbox.tsx"],"sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'rebill-container',\n  shadow: false,\n})\nexport class Container {\n  @Prop() maxWidth: string = '1200px';\n  @Prop() padding: string = '1rem';\n  @Prop() fluid: boolean = false;\n\n  render() {\n    const style = {\n      maxWidth: this.fluid ? '100%' : this.maxWidth,\n      padding: this.padding,\n      margin: '0 auto',\n      width: '100%',\n      boxSizing: 'border-box',\n    };\n\n    return (\n      <div style={style}>\n        <slot></slot>\n      </div>\n    );\n  }\n}\n","@import '../shared-input.css';\n\n.checkbox-container {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n}\n\n.checkbox-label {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n}\n\n.checkbox-label.disabled {\n  cursor: not-allowed !important;\n  opacity: 1;\n}\n\n.checkbox-element {\n  appearance: none;\n  width: 16px;\n  height: 16px;\n  border: 1.5px solid var(--rebill-color-border-primary);\n  border-radius: 4px;\n  background: var(--rebill-color-background);\n  margin-right: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition:\n    border-color 0.15s,\n    box-shadow 0.15s;\n  position: relative;\n  cursor: pointer;\n}\n\n.checkbox-element:disabled {\n  border-color: var(--rebill-color-disabled);\n  cursor: not-allowed;\n}\n\n.checkbox-element:checked {\n  background-color: var(--rebill-color-primary);\n  border-color: var(--rebill-color-primary);\n}\n\n.checkbox-element:checked:disabled {\n  background-color: var(--rebill-color-disabled);\n  border-color: var(--rebill-color-disabled);\n}\n\n.checkbox-element:checked::after {\n  content: '';\n  display: block;\n  position: absolute;\n  left: 4.5px;\n  top: 1.5px;\n  width: 2.5px;\n  height: 7px;\n  border: solid var(--rebill-color-background);\n  border-width: 0 1.5px 1.5px 0;\n  transform: rotate(45deg);\n}\n\n.checkbox-element:disabled:checked::after {\n  border-color: var(--rebill-color-background);\n}\n\n.checkbox-error {\n  border-color: var(--rebill-color-error) !important;\n}\n\n.label-text {\n  user-select: none;\n  font-weight: 400;\n}\n","import { Component, Event, EventEmitter, Listen, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'rebill-input-checkbox',\n  styleUrl: 'input-checkbox.css',\n  shadow: false,\n})\nexport class InputCheckbox {\n  /** Etiqueta que se muestra a la derecha del checkbox */\n  @Prop() label: string = '';\n  /** Estado del checkbox */\n  @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n  /** Mensaje de error */\n  @Prop() error: string = '';\n  /** ID del checkbox */\n  @Prop() id: string = '';\n  /** Estado deshabilitado */\n  @Prop() disabled: boolean = false;\n  /** Evento al cambiar el valor */\n  @Event() input: EventEmitter<{ id: string; value: boolean }>;\n\n  @Listen('change', { target: 'document' })\n  handleFormChange(event: CustomEvent) {\n    const formData = event.detail;\n    if (formData && this.id in formData) {\n      this.checked = formData[this.id];\n    }\n  }\n\n  private onCheckboxChange = (event: Event) => {\n    if (this.disabled) return;\n    const checkbox = event.target as HTMLInputElement;\n    this.checked = checkbox.checked;\n    this.input.emit({ id: this.id, value: this.checked });\n  };\n\n  render() {\n    return (\n      <div class=\"checkbox-container input-container\">\n        <label class={`checkbox-label input-label ${this.disabled ? 'disabled' : ''}`}>\n          <input\n            id={this.id}\n            type=\"checkbox\"\n            class={`checkbox-element ${this.error ? 'checkbox-error' : ''}`}\n            checked={this.checked}\n            onChange={this.onCheckboxChange}\n            disabled={this.disabled}\n          />\n          <span class=\"label-text\">{this.label}</span>\n        </label>\n        {this.error && <span class=\"error-message\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"names":["h"],"mappings":";;;;MAMa,SAAS,GAAA,MAAA;;;;IACZ,QAAQ,GAAW,QAAQ;IAC3B,OAAO,GAAW,MAAM;IACxB,KAAK,GAAY,KAAK;IAE9B,MAAM,GAAA;AACJ,QAAA,MAAM,KAAK,GAAG;AACZ,YAAA,QAAQ,EAAE,IAAI,CAAC,KAAK,GAAG,MAAM,GAAG,IAAI,CAAC,QAAQ;YAC7C,OAAO,EAAE,IAAI,CAAC,OAAO;AACrB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,SAAS,EAAE,YAAY;SACxB;QAED,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,KAAK,EAAA,EACfA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT;;;;ACvBZ,MAAM,gBAAgB,GAAG,ggFAAggF;;MCO5gF,aAAa,GAAA,MAAA;;;;;;IAEhB,KAAK,GAAW,EAAE;;IAEc,OAAO,GAAY,KAAK;;IAExD,KAAK,GAAW,EAAE;;IAElB,EAAE,GAAW,EAAE;;IAEf,QAAQ,GAAY,KAAK;;AAExB,IAAA,KAAK;AAGd,IAAA,gBAAgB,CAAC,KAAkB,EAAA;AACjC,QAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM;QAC7B,IAAI,QAAQ,IAAI,IAAI,CAAC,EAAE,IAAI,QAAQ,EAAE;YACnC,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;;;AAI5B,IAAA,gBAAgB,GAAG,CAAC,KAAY,KAAI;QAC1C,IAAI,IAAI,CAAC,QAAQ;YAAE;AACnB,QAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,MAA0B;AACjD,QAAA,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,OAAO;AAC/B,QAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC;AACvD,KAAC;IAED,MAAM,GAAA;AACJ,QAAA,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,oCAAoC,EAAA,EAC7CA,OAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAE,CAAA,2BAAA,EAA8B,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE,CAAA,EAAA,EAC3EA,OAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,CAAA,iBAAA,EAAoB,IAAI,CAAC,KAAK,GAAG,gBAAgB,GAAG,EAAE,CAAE,CAAA,EAC/D,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,CAAA,EACFA,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,CACtC,EACP,IAAI,CAAC,KAAK,IAAIA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,eAAe,EAAE,EAAA,IAAI,CAAC,KAAK,CAAQ,CAC1D;;;;;;;;"}
+{"version":3,"file":"rebill-container.rebill-input-checkbox.entry.cjs.js","sources":["src/components/shared/layouts/generics/container.tsx","src/components/shared/inputs/input-checkbox/input-checkbox.css?tag=rebill-input-checkbox","src/components/shared/inputs/input-checkbox/input-checkbox.tsx"],"sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'rebill-container',\n  shadow: false,\n})\nexport class Container {\n  @Prop() maxWidth: string = '1200px';\n  @Prop() padding: string = '1rem';\n  @Prop() fluid: boolean = false;\n\n  render() {\n    const style = {\n      maxWidth: this.fluid ? '100%' : this.maxWidth,\n      padding: this.padding,\n      margin: '0 auto',\n      width: '100%',\n      boxSizing: 'border-box',\n    };\n\n    return (\n      <div style={style}>\n        <slot></slot>\n      </div>\n    );\n  }\n}\n","@import '../shared-input.css';\n\n.checkbox-container {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n}\n\n.checkbox-label {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n}\n\n.checkbox-label.disabled {\n  cursor: not-allowed !important;\n  opacity: 1;\n}\n\n.checkbox-element {\n  appearance: none;\n  width: 16px;\n  height: 16px;\n  border: 1.5px solid var(--rebill-color-border-primary);\n  border-radius: 4px;\n  background: var(--rebill-color-background);\n  margin-right: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition:\n    border-color 0.15s,\n    box-shadow 0.15s;\n  position: relative;\n  cursor: pointer;\n}\n\n.checkbox-element:disabled {\n  border-color: var(--rebill-color-disabled);\n  cursor: not-allowed;\n}\n\n.checkbox-element:checked {\n  background-color: var(--rebill-color-primary);\n  border-color: var(--rebill-color-primary);\n}\n\n.checkbox-element:checked:disabled {\n  background-color: var(--rebill-color-disabled);\n  border-color: var(--rebill-color-disabled);\n}\n\n.checkbox-element:checked::after {\n  content: '';\n  display: block;\n  position: absolute;\n  left: 4.5px;\n  top: 1.5px;\n  width: 2.5px;\n  height: 7px;\n  border: solid var(--rebill-color-background);\n  border-width: 0 1.5px 1.5px 0;\n  transform: rotate(45deg);\n}\n\n.checkbox-element:disabled:checked::after {\n  border-color: var(--rebill-color-background);\n}\n\n.checkbox-error {\n  border-color: var(--rebill-color-error) !important;\n}\n\n.label-text {\n  user-select: none;\n  font-weight: 400;\n}\n","import { Component, Event, EventEmitter, Listen, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'rebill-input-checkbox',\n  styleUrl: 'input-checkbox.css',\n  shadow: false,\n})\nexport class InputCheckbox {\n  /** Etiqueta que se muestra a la derecha del checkbox */\n  @Prop() label: string = '';\n  /** Estado del checkbox */\n  @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n  /** Mensaje de error */\n  @Prop() error: string = '';\n  /** ID del checkbox */\n  @Prop() id: string = '';\n  /** Estado deshabilitado */\n  @Prop() disabled: boolean = false;\n  /** Evento al cambiar el valor */\n  @Event() input: EventEmitter<{ id: string; value: boolean }>;\n\n  @Listen('change', { target: 'document' })\n  handleFormChange(event: CustomEvent) {\n    const formData = event.detail;\n    if (formData && this.id in formData) {\n      this.checked = formData[this.id];\n    }\n  }\n\n  private onCheckboxChange = (event: Event) => {\n    if (this.disabled) return;\n    const checkbox = event.target as HTMLInputElement;\n    this.checked = checkbox.checked;\n    this.input.emit({ id: this.id, value: this.checked });\n  };\n\n  render() {\n    return (\n      <div class=\"checkbox-container input-container\">\n        <label class={`checkbox-label input-label ${this.disabled ? 'disabled' : ''}`}>\n          <input\n            id={this.id}\n            type=\"checkbox\"\n            class={`checkbox-element ${this.error ? 'checkbox-error' : ''}`}\n            checked={this.checked}\n            onChange={this.onCheckboxChange}\n            disabled={this.disabled}\n          />\n          <span class=\"label-text\">{this.label}</span>\n        </label>\n        {this.error && <span class=\"error-message\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"names":["h"],"mappings":";;;;MAMa,SAAS,GAAA,MAAA;;;;IACZ,QAAQ,GAAW,QAAQ;IAC3B,OAAO,GAAW,MAAM;IACxB,KAAK,GAAY,KAAK;IAE9B,MAAM,GAAA;AACJ,QAAA,MAAM,KAAK,GAAG;AACZ,YAAA,QAAQ,EAAE,IAAI,CAAC,KAAK,GAAG,MAAM,GAAG,IAAI,CAAC,QAAQ;YAC7C,OAAO,EAAE,IAAI,CAAC,OAAO;AACrB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,SAAS,EAAE,YAAY;SACxB;QAED,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,KAAK,EAAA,EACfA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT;;;;ACvBZ,MAAM,gBAAgB,GAAG,+mFAA+mF;;MCO3nF,aAAa,GAAA,MAAA;;;;;;IAEhB,KAAK,GAAW,EAAE;;IAEc,OAAO,GAAY,KAAK;;IAExD,KAAK,GAAW,EAAE;;IAElB,EAAE,GAAW,EAAE;;IAEf,QAAQ,GAAY,KAAK;;AAExB,IAAA,KAAK;AAGd,IAAA,gBAAgB,CAAC,KAAkB,EAAA;AACjC,QAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM;QAC7B,IAAI,QAAQ,IAAI,IAAI,CAAC,EAAE,IAAI,QAAQ,EAAE;YACnC,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;;;AAI5B,IAAA,gBAAgB,GAAG,CAAC,KAAY,KAAI;QAC1C,IAAI,IAAI,CAAC,QAAQ;YAAE;AACnB,QAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,MAA0B;AACjD,QAAA,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,OAAO;AAC/B,QAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC;AACvD,KAAC;IAED,MAAM,GAAA;AACJ,QAAA,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,oCAAoC,EAAA,EAC7CA,OAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAE,CAAA,2BAAA,EAA8B,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE,CAAA,EAAA,EAC3EA,OAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,CAAA,iBAAA,EAAoB,IAAI,CAAC,KAAK,GAAG,gBAAgB,GAAG,EAAE,CAAE,CAAA,EAC/D,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,CAAA,EACFA,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,CACtC,EACP,IAAI,CAAC,KAAK,IAAIA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,eAAe,EAAE,EAAA,IAAI,CAAC,KAAK,CAAQ,CAC1D;;;;;;;;"}

package/dist/cjs/rebill-container_2.cjs.entry.js

@@ -21,7 +21,7 @@ const Container = class {
     }
 };
 
-const inputCheckboxCss = ".input-container{display:flex;flex-direction:column}.input-label{font-size:0.875rem;color:var(--rebill-color-text-primary);font-weight:500;margin-bottom:0.375rem}.input-label.disabled{cursor:not-allowed}.input-element{border-radius:var(--input-group-inner-border-radius, 8px);border:1.5px solid var(--rebill-color-border);padding:10px 14px;font-size:0.875rem;color:var(--rebill-color-text-primary);outline:none;transition:border-color 0.2s;background:var(--rebill-color-background);height:38.33px;box-sizing:border-box}.input-element.input-error{border-color:var(--rebill-color-error)}.input-element:disabled{background-color:var(--rebill-color-background);border-color:var(--rebill-color-disabled);color:var(--rebill-color-text-secondary);cursor:not-allowed;opacity:0.7}select.input-element{padding:10px 30px 10px 14px;appearance:none;cursor:pointer}select.input-element:disabled{cursor:not-allowed}.input-element:focus{border-color:var(--rebill-color-primary)}.input-element:disabled:focus{border-color:var(--rebill-color-disabled)}.input-element::placeholder{color:var(--rebill-color-text-secondary-light);font-size:0.875rem;opacity:1}.select-wrapper.disabled .select-icon{color:var(--rebill-color-disabled)}.error-message{color:var(--rebill-color-error);font-size:0.75rem;margin-top:0.375rem}.checkbox-container{display:flex;flex-direction:column;gap:0.25rem}.checkbox-label{display:flex;align-items:center;cursor:pointer}.checkbox-label.disabled{cursor:not-allowed !important;opacity:1}.checkbox-element{appearance:none;width:16px;height:16px;border:1.5px solid var(--rebill-color-border-primary);border-radius:4px;background:var(--rebill-color-background);margin-right:10px;display:flex;align-items:center;justify-content:center;transition:border-color 0.15s,\n    box-shadow 0.15s;position:relative;cursor:pointer}.checkbox-element:disabled{border-color:var(--rebill-color-disabled);cursor:not-allowed}.checkbox-element:checked{background-color:var(--rebill-color-primary);border-color:var(--rebill-color-primary)}.checkbox-element:checked:disabled{background-color:var(--rebill-color-disabled);border-color:var(--rebill-color-disabled)}.checkbox-element:checked::after{content:'';display:block;position:absolute;left:4.5px;top:1.5px;width:2.5px;height:7px;border:solid var(--rebill-color-background);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}.checkbox-element:disabled:checked::after{border-color:var(--rebill-color-background)}.checkbox-error{border-color:var(--rebill-color-error) !important}.label-text{user-select:none;font-weight:400}";
+const inputCheckboxCss = ".input-container{display:flex;flex-direction:column}.input-label{font-size:0.875rem;color:var(--rebill-color-text-primary);font-weight:500;margin-bottom:0.375rem}.input-label.disabled{cursor:not-allowed}.input-element{border-radius:var(--input-group-inner-border-radius, 8px);border:1.5px solid var(--rebill-color-border);padding:10px 14px;font-size:0.875rem;color:var(--rebill-color-text-primary);outline:none;transition:border-color 0.2s;background:var(--rebill-color-background);height:38.33px;box-sizing:border-box}.input-element.input-error{border-color:var(--rebill-color-error)}.input-element:disabled{background-color:var(--rebill-color-background);border-color:var(--rebill-color-disabled);color:var(--rebill-color-text-secondary);cursor:not-allowed;opacity:0.7}select.input-element{padding:10px 30px 10px 14px;appearance:none;cursor:pointer}select.input-element:disabled{cursor:not-allowed}.input-element:focus{border-color:var(--rebill-color-primary)}.input-element:disabled:focus{border-color:var(--rebill-color-disabled)}.input-element::placeholder{color:var(--rebill-color-text-secondary-light);font-size:0.875rem;opacity:1}.select-wrapper.disabled .select-icon{color:var(--rebill-color-disabled)}.error-message{color:var(--rebill-color-error);font-size:0.75rem;margin-top:0.375rem}@media screen and (max-width: 768px){.input-element{font-size:1rem}.input-element::placeholder{font-size:1rem}}.checkbox-container{display:flex;flex-direction:column;gap:0.25rem}.checkbox-label{display:flex;align-items:center;cursor:pointer}.checkbox-label.disabled{cursor:not-allowed !important;opacity:1}.checkbox-element{appearance:none;width:16px;height:16px;border:1.5px solid var(--rebill-color-border-primary);border-radius:4px;background:var(--rebill-color-background);margin-right:10px;display:flex;align-items:center;justify-content:center;transition:border-color 0.15s,\n    box-shadow 0.15s;position:relative;cursor:pointer}.checkbox-element:disabled{border-color:var(--rebill-color-disabled);cursor:not-allowed}.checkbox-element:checked{background-color:var(--rebill-color-primary);border-color:var(--rebill-color-primary)}.checkbox-element:checked:disabled{background-color:var(--rebill-color-disabled);border-color:var(--rebill-color-disabled)}.checkbox-element:checked::after{content:'';display:block;position:absolute;left:4.5px;top:1.5px;width:2.5px;height:7px;border:solid var(--rebill-color-background);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}.checkbox-element:disabled:checked::after{border-color:var(--rebill-color-background)}.checkbox-error{border-color:var(--rebill-color-error) !important}.label-text{user-select:none;font-weight:400}";
 
 const InputCheckbox = class {
     constructor(hostRef) {

package/dist/cjs/rebill-input-select.cjs.entry.js

@@ -3,7 +3,7 @@
 var index = require('./index-C-VTnc0I.js');
 var i18n_service = require('./i18n.service-CMXo-Ku3.js');
 
-const inputSelectCss = ".input-container{display:flex;flex-direction:column}.input-label{font-size:0.875rem;color:var(--rebill-color-text-primary);font-weight:500;margin-bottom:0.375rem}.input-label.disabled{cursor:not-allowed}.input-element{border-radius:var(--input-group-inner-border-radius, 8px);border:1.5px solid var(--rebill-color-border);padding:10px 14px;font-size:0.875rem;color:var(--rebill-color-text-primary);outline:none;transition:border-color 0.2s;background:var(--rebill-color-background);height:38.33px;box-sizing:border-box}.input-element.input-error{border-color:var(--rebill-color-error)}.input-element:disabled{background-color:var(--rebill-color-background);border-color:var(--rebill-color-disabled);color:var(--rebill-color-text-secondary);cursor:not-allowed;opacity:0.7}select.input-element{padding:10px 30px 10px 14px;appearance:none;cursor:pointer}select.input-element:disabled{cursor:not-allowed}.input-element:focus{border-color:var(--rebill-color-primary)}.input-element:disabled:focus{border-color:var(--rebill-color-disabled)}.input-element::placeholder{color:var(--rebill-color-text-secondary-light);font-size:0.875rem;opacity:1}.select-wrapper.disabled .select-icon{color:var(--rebill-color-disabled)}.error-message{color:var(--rebill-color-error);font-size:0.75rem;margin-top:0.375rem}:host{display:block;width:100%;box-sizing:border-box}.select-wrapper{position:relative;width:100%;box-sizing:border-box}.select-trigger{width:100%;height:38.33px;border-radius:var(--input-group-inner-border-radius, 8px);border:1.5px solid var(--rebill-color-border);padding:10px 14px;padding-right:30px;font-size:0.875rem;font-weight:normal;color:var(--rebill-color-text-primary);outline:none;transition:border-color 0.2s;background:var(--rebill-color-background);cursor:pointer;display:flex;align-items:center;justify-content:space-between;user-select:none;box-sizing:border-box;min-width:0;}.select-trigger:focus{outline:none;border-color:var(--rebill-color-primary);box-shadow:0 0 0 2px var(--rebill-color-primary-light)}.select-trigger:hover:not(.disabled){border-color:var(--rebill-color-primary)}.select-trigger.input-error{border-color:var(--rebill-color-error) !important}.select-trigger.placeholder .select-value{color:var(--rebill-color-text-secondary-light);font-size:0.875rem}.select-wrapper.disabled .select-trigger{background-color:var(--rebill-color-background);color:var(--rebill-color-text-secondary);cursor:not-allowed;opacity:0.7}.select-value{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.icon-wrapper{position:absolute;right:0.75rem;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;height:20px;width:20px}.select-icon{color:var(--rebill-color-text-secondary);transition:transform 0.2s ease;transform-origin:50% 50%;display:block}.select-icon.rotated{transform:rotateX(180deg)}.select-wrapper.disabled .select-icon{color:var(--rebill-color-disabled)}.select-trigger.underlined{width:100%;height:38.33px;padding:10px 14px;padding-right:40px;font-size:0.875rem;font-weight:normal;color:var(--rebill-color-text-primary);outline:none;background:var(--rebill-color-background);cursor:pointer;display:flex;align-items:center;justify-content:space-between;user-select:none;min-width:0;border:none}.select-trigger.underlined:focus{border:none;box-shadow:none}.select-dropPosition.open-down{position:absolute;top:100%;left:0;right:0;z-index:1000;background-color:var(--rebill-color-background);border:1px solid var(--rebill-color-border);border-radius:0.375rem;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1),\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);margin-top:0.25rem;max-height:200px;overflow-y:auto;animation:slideDown 0.15s ease-out;box-sizing:border-box;width:100%}.select-dropPosition.open-up{position:absolute;bottom:100%;left:0;right:0;z-index:1000;background-color:var(--rebill-color-background);border:1px solid var(--rebill-color-border);border-radius:0.375rem;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1),\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);margin-bottom:0.25rem;margin-top:0;max-height:200px;overflow-y:auto;animation:slideUp 0.15s ease-out;box-sizing:border-box;width:100%}@keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.select-option{padding:0.75rem;font-size:0.875rem;color:var(--rebill-color-text-primary);cursor:pointer;border-bottom:1px solid var(--rebill-color-border);transition:background-color 0.15s ease}.select-option:last-child{border-bottom:none}.select-option:hover,.select-option.highlighted{background-color:#f0f9ff}.select-option.selected{background-color:var(--rebill-color-primary);color:white}.select-option.selected:hover,.select-option.selected.highlighted{background-color:var(--rebill-color-primary)}.select-dropdown::-webkit-scrollbar{width:6px}.select-dropdown::-webkit-scrollbar-track{background:transparent}.select-dropdown::-webkit-scrollbar-thumb{background-color:var(--rebill-color-border);border-radius:3px}.select-dropdown::-webkit-scrollbar-thumb:hover{background-color:var(--rebill-color-text-secondary)}.search-container{padding:0.75rem;border-bottom:1px solid var(--rebill-color-border);background-color:var(--rebill-color-background)}.search-input-wrapper{position:relative;display:flex;align-items:center;width:100%}.search-icon{position:absolute;left:0.75rem;color:var(--rebill-color-text-secondary);z-index:1;pointer-events:none}.search-input{width:100%;padding:0.5rem 0.75rem 0.5rem 2.5rem;border:1px solid var(--rebill-color-border);border-radius:0.375rem;font-size:0.875rem;color:var(--rebill-color-text-primary);background-color:var(--rebill-color-background);outline:none;transition:border-color 0.2s ease;box-sizing:border-box}.search-input:focus{border-color:var(--rebill-color-primary);box-shadow:0 0 0 2px var(--rebill-color-primary-light)}.search-input::placeholder{color:var(--rebill-color-text-secondary-light);font-size:0.875rem}.clear-search{position:absolute;right:0.75rem;background:none;border:none;cursor:pointer;padding:0.25rem;border-radius:0.25rem;display:flex;align-items:center;justify-content:center;color:var(--rebill-color-text-secondary);transition:background-color 0.2s ease}.clear-search:hover{background-color:var(--rebill-color-background-hover);color:var(--rebill-color-text-primary)}.no-results{padding:0.75rem;text-align:center;color:var(--rebill-color-text-secondary);font-style:italic;border-bottom:1px solid var(--rebill-color-border)}.loading-message{padding:0.75rem;text-align:center;color:var(--rebill-color-text-secondary);display:flex;align-items:center;justify-content:center;gap:0.5rem;border-bottom:1px solid var(--rebill-color-border)}.loading-message .spinner{width:14px;height:14px;border:2px solid rgba(0, 0, 0, 0.1);border-radius:50%;border-top-color:var(--rebill-color-primary, #007bff);animation:spin 1s linear infinite}.spinner{width:16px;height:16px;border:2px solid rgba(0, 0, 0, 0.1);border-radius:50%;border-top-color:var(--rebill-color-primary, #007bff);animation:spin 1s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}";
+const inputSelectCss = ".input-container{display:flex;flex-direction:column}.input-label{font-size:0.875rem;color:var(--rebill-color-text-primary);font-weight:500;margin-bottom:0.375rem}.input-label.disabled{cursor:not-allowed}.input-element{border-radius:var(--input-group-inner-border-radius, 8px);border:1.5px solid var(--rebill-color-border);padding:10px 14px;font-size:0.875rem;color:var(--rebill-color-text-primary);outline:none;transition:border-color 0.2s;background:var(--rebill-color-background);height:38.33px;box-sizing:border-box}.input-element.input-error{border-color:var(--rebill-color-error)}.input-element:disabled{background-color:var(--rebill-color-background);border-color:var(--rebill-color-disabled);color:var(--rebill-color-text-secondary);cursor:not-allowed;opacity:0.7}select.input-element{padding:10px 30px 10px 14px;appearance:none;cursor:pointer}select.input-element:disabled{cursor:not-allowed}.input-element:focus{border-color:var(--rebill-color-primary)}.input-element:disabled:focus{border-color:var(--rebill-color-disabled)}.input-element::placeholder{color:var(--rebill-color-text-secondary-light);font-size:0.875rem;opacity:1}.select-wrapper.disabled .select-icon{color:var(--rebill-color-disabled)}.error-message{color:var(--rebill-color-error);font-size:0.75rem;margin-top:0.375rem}@media screen and (max-width: 768px){.input-element{font-size:1rem}.input-element::placeholder{font-size:1rem}}:host{display:block;width:100%;box-sizing:border-box}.select-wrapper{position:relative;width:100%;box-sizing:border-box}.select-trigger{width:100%;height:38.33px;border-radius:var(--input-group-inner-border-radius, 8px);border:1.5px solid var(--rebill-color-border);padding:10px 14px;padding-right:30px;font-size:0.875rem;font-weight:normal;color:var(--rebill-color-text-primary);outline:none;transition:border-color 0.2s;background:var(--rebill-color-background);cursor:pointer;display:flex;align-items:center;justify-content:space-between;user-select:none;box-sizing:border-box;min-width:0;}.select-trigger:focus{outline:none;border-color:var(--rebill-color-primary);box-shadow:0 0 0 2px var(--rebill-color-primary-light)}.select-trigger:hover:not(.disabled){border-color:var(--rebill-color-primary)}.select-trigger.input-error{border-color:var(--rebill-color-error) !important}.select-trigger.placeholder .select-value{color:var(--rebill-color-text-secondary-light);font-size:0.875rem}.select-wrapper.disabled .select-trigger{background-color:var(--rebill-color-background);color:var(--rebill-color-text-secondary);cursor:not-allowed;opacity:0.7}.select-value{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.icon-wrapper{position:absolute;right:0.75rem;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;height:20px;width:20px}.select-icon{color:var(--rebill-color-text-secondary);transition:transform 0.2s ease;transform-origin:50% 50%;display:block}.select-icon.rotated{transform:rotateX(180deg)}.select-wrapper.disabled .select-icon{color:var(--rebill-color-disabled)}.select-trigger.underlined{width:100%;height:38.33px;padding:10px 14px;padding-right:40px;font-size:0.875rem;font-weight:normal;color:var(--rebill-color-text-primary);outline:none;background:var(--rebill-color-background);cursor:pointer;display:flex;align-items:center;justify-content:space-between;user-select:none;min-width:0;border:none}.select-trigger.underlined:focus{border:none;box-shadow:none}.select-dropPosition.open-down{position:absolute;top:100%;left:0;right:0;z-index:1000;background-color:var(--rebill-color-background);border:1px solid var(--rebill-color-border);border-radius:0.375rem;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1),\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);margin-top:0.25rem;max-height:200px;overflow-y:auto;animation:slideDown 0.15s ease-out;box-sizing:border-box;width:100%}.select-dropPosition.open-up{position:absolute;bottom:100%;left:0;right:0;z-index:1000;background-color:var(--rebill-color-background);border:1px solid var(--rebill-color-border);border-radius:0.375rem;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1),\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);margin-bottom:0.25rem;margin-top:0;max-height:200px;overflow-y:auto;animation:slideUp 0.15s ease-out;box-sizing:border-box;width:100%}@keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.select-option{padding:0.75rem;font-size:0.875rem;color:var(--rebill-color-text-primary);cursor:pointer;border-bottom:1px solid var(--rebill-color-border);transition:background-color 0.15s ease}.select-option:last-child{border-bottom:none}.select-option:hover,.select-option.highlighted{background-color:#f0f9ff}.select-option.selected{background-color:var(--rebill-color-primary);color:white}.select-option.selected:hover,.select-option.selected.highlighted{background-color:var(--rebill-color-primary)}.select-dropdown::-webkit-scrollbar{width:6px}.select-dropdown::-webkit-scrollbar-track{background:transparent}.select-dropdown::-webkit-scrollbar-thumb{background-color:var(--rebill-color-border);border-radius:3px}.select-dropdown::-webkit-scrollbar-thumb:hover{background-color:var(--rebill-color-text-secondary)}.search-container{padding:0.75rem;border-bottom:1px solid var(--rebill-color-border);background-color:var(--rebill-color-background)}.search-input-wrapper{position:relative;display:flex;align-items:center;width:100%}.search-icon{position:absolute;left:0.75rem;color:var(--rebill-color-text-secondary);z-index:1;pointer-events:none}.search-input{width:100%;padding:0.5rem 0.75rem 0.5rem 2.5rem;border:1px solid var(--rebill-color-border);border-radius:0.375rem;font-size:0.875rem;color:var(--rebill-color-text-primary);background-color:var(--rebill-color-background);outline:none;transition:border-color 0.2s ease;box-sizing:border-box}.search-input:focus{border-color:var(--rebill-color-primary);box-shadow:0 0 0 2px var(--rebill-color-primary-light)}.search-input::placeholder{color:var(--rebill-color-text-secondary-light);font-size:0.875rem}.clear-search{position:absolute;right:0.75rem;background:none;border:none;cursor:pointer;padding:0.25rem;border-radius:0.25rem;display:flex;align-items:center;justify-content:center;color:var(--rebill-color-text-secondary);transition:background-color 0.2s ease}.clear-search:hover{background-color:var(--rebill-color-background-hover);color:var(--rebill-color-text-primary)}.no-results{padding:0.75rem;text-align:center;color:var(--rebill-color-text-secondary);font-style:italic;border-bottom:1px solid var(--rebill-color-border)}.loading-message{padding:0.75rem;text-align:center;color:var(--rebill-color-text-secondary);display:flex;align-items:center;justify-content:center;gap:0.5rem;border-bottom:1px solid var(--rebill-color-border)}.loading-message .spinner{width:14px;height:14px;border:2px solid rgba(0, 0, 0, 0.1);border-radius:50%;border-top-color:var(--rebill-color-primary, #007bff);animation:spin 1s linear infinite}.spinner{width:16px;height:16px;border:2px solid rgba(0, 0, 0, 0.1);border-radius:50%;border-top-color:var(--rebill-color-primary, #007bff);animation:spin 1s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}@media screen and (max-width: 768px){.select-trigger{font-size:1rem}.select-trigger.placeholder .select-value{font-size:1rem}.select-option{font-size:1rem}.search-input{font-size:1rem}.search-input::placeholder{font-size:1rem}.loading-message{font-size:1rem}.no-results{font-size:1rem}}";
 
 const InputSelect = class {
     constructor(hostRef) {

package/dist/cjs/rebill-input-select.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"rebill-input-select.entry.cjs.js","sources":["src/components/shared/inputs/input-select/input-select.css?tag=rebill-input-select","src/components/shared/inputs/input-select/input-select.tsx"],"sourcesContent":["@import '../shared-input.css';\n\n:host {\n  display: block;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.select-wrapper {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.select-trigger {\n  width: 100%;\n  height: 38.33px;\n  border-radius: var(--input-group-inner-border-radius, 8px);\n  border: 1.5px solid var(--rebill-color-border);\n  padding: 10px 14px;\n  padding-right: 30px; /* Espacio para el icono */\n  font-size: 0.875rem;\n  font-weight: normal;\n  color: var(--rebill-color-text-primary);\n  outline: none;\n  transition: border-color 0.2s;\n  background: var(--rebill-color-background);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  user-select: none;\n  box-sizing: border-box;\n  min-width: 0; /* Allow the element to shrink below its content size */\n}\n\n.select-trigger:focus {\n  outline: none;\n  border-color: var(--rebill-color-primary);\n  box-shadow: 0 0 0 2px var(--rebill-color-primary-light);\n}\n\n.select-trigger:hover:not(.disabled) {\n  border-color: var(--rebill-color-primary);\n}\n\n.select-trigger.input-error {\n  border-color: var(--rebill-color-error) !important;\n}\n\n.select-trigger.placeholder .select-value {\n  color: var(--rebill-color-text-secondary-light);\n  font-size: 0.875rem;\n}\n\n.select-wrapper.disabled .select-trigger {\n  background-color: var(--rebill-color-background);\n  /* border-color: var(--rebill-color-disabled); */\n  color: var(--rebill-color-text-secondary);\n  cursor: not-allowed;\n  opacity: 0.7;\n}\n\n.select-value {\n  flex: 1;\n  text-align: left;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.icon-wrapper {\n  position: absolute;\n  right: 0.75rem;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 20px;\n  width: 20px;\n}\n\n.select-icon {\n  color: var(--rebill-color-text-secondary);\n  transition: transform 0.2s ease;\n  transform-origin: 50% 50%;\n  display: block;\n}\n\n.select-icon.rotated {\n  transform: rotateX(180deg);\n}\n\n.select-wrapper.disabled .select-icon {\n  color: var(--rebill-color-disabled);\n}\n\n/* Variante undelineated - sin borde */\n.select-trigger.underlined {\n  width: 100%;\n  height: 38.33px;\n  padding: 10px 14px;\n  padding-right: 40px;\n  font-size: 0.875rem;\n  font-weight: normal;\n  color: var(--rebill-color-text-primary);\n  outline: none;\n  background: var(--rebill-color-background);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  user-select: none;\n  min-width: 0;\n  border: none;\n}\n\n.select-trigger.underlined:focus {\n  border: none;\n  box-shadow: none;\n}\n\n.select-dropPosition.open-down {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  right: 0;\n  z-index: 1000;\n  background-color: var(--rebill-color-background);\n  border: 1px solid var(--rebill-color-border);\n  border-radius: 0.375rem;\n  box-shadow:\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  margin-top: 0.25rem;\n  max-height: 200px;\n  overflow-y: auto;\n  animation: slideDown 0.15s ease-out;\n  box-sizing: border-box;\n  width: 100%;\n}\n\n.select-dropPosition.open-up {\n  position: absolute;\n  bottom: 100%;\n  left: 0;\n  right: 0;\n  z-index: 1000;\n  background-color: var(--rebill-color-background);\n  border: 1px solid var(--rebill-color-border);\n  border-radius: 0.375rem;\n  box-shadow:\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  margin-bottom: 0.25rem;\n  margin-top: 0;\n  max-height: 200px;\n  overflow-y: auto;\n  animation: slideUp 0.15s ease-out;\n  box-sizing: border-box;\n  width: 100%;\n}\n\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n.select-option {\n  padding: 0.75rem;\n  font-size: 0.875rem;\n  color: var(--rebill-color-text-primary);\n  cursor: pointer;\n  border-bottom: 1px solid var(--rebill-color-border);\n  transition: background-color 0.15s ease;\n}\n\n.select-option:last-child {\n  border-bottom: none;\n}\n\n.select-option:hover,\n.select-option.highlighted {\n  background-color: #f0f9ff;\n}\n\n.select-option.selected {\n  background-color: var(--rebill-color-primary);\n  color: white;\n}\n\n.select-option.selected:hover,\n.select-option.selected.highlighted {\n  background-color: var(--rebill-color-primary);\n}\n\n/* Scrollbar styling for the dropdown */\n.select-dropdown::-webkit-scrollbar {\n  width: 6px;\n}\n\n.select-dropdown::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.select-dropdown::-webkit-scrollbar-thumb {\n  background-color: var(--rebill-color-border);\n  border-radius: 3px;\n}\n\n.select-dropdown::-webkit-scrollbar-thumb:hover {\n  background-color: var(--rebill-color-text-secondary);\n}\n\n/* Estilos para la funcionalidad de búsqueda */\n.search-container {\n  padding: 0.75rem;\n  border-bottom: 1px solid var(--rebill-color-border);\n  background-color: var(--rebill-color-background);\n}\n\n.search-input-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: 100%;\n}\n\n.search-icon {\n  position: absolute;\n  left: 0.75rem;\n  color: var(--rebill-color-text-secondary);\n  z-index: 1;\n  pointer-events: none;\n}\n\n.search-input {\n  width: 100%;\n  padding: 0.5rem 0.75rem 0.5rem 2.5rem;\n  border: 1px solid var(--rebill-color-border);\n  border-radius: 0.375rem;\n  font-size: 0.875rem;\n  color: var(--rebill-color-text-primary);\n  background-color: var(--rebill-color-background);\n  outline: none;\n  transition: border-color 0.2s ease;\n  box-sizing: border-box;\n}\n\n.search-input:focus {\n  border-color: var(--rebill-color-primary);\n  box-shadow: 0 0 0 2px var(--rebill-color-primary-light);\n}\n\n.search-input::placeholder {\n  color: var(--rebill-color-text-secondary-light);\n  font-size: 0.875rem;\n}\n\n.clear-search {\n  position: absolute;\n  right: 0.75rem;\n  background: none;\n  border: none;\n  cursor: pointer;\n  padding: 0.25rem;\n  border-radius: 0.25rem;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--rebill-color-text-secondary);\n  transition: background-color 0.2s ease;\n}\n\n.clear-search:hover {\n  background-color: var(--rebill-color-background-hover);\n  color: var(--rebill-color-text-primary);\n}\n\n.no-results {\n  padding: 0.75rem;\n  text-align: center;\n  color: var(--rebill-color-text-secondary);\n  font-style: italic;\n  border-bottom: 1px solid var(--rebill-color-border);\n}\n\n.loading-message {\n  padding: 0.75rem;\n  text-align: center;\n  color: var(--rebill-color-text-secondary);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.5rem;\n  border-bottom: 1px solid var(--rebill-color-border);\n}\n\n.loading-message .spinner {\n  width: 14px;\n  height: 14px;\n  border: 2px solid rgba(0, 0, 0, 0.1);\n  border-radius: 50%;\n  border-top-color: var(--rebill-color-primary, #007bff);\n  animation: spin 1s linear infinite;\n}\n\n/* Spinner styles */\n.spinner {\n  width: 16px;\n  height: 16px;\n  border: 2px solid rgba(0, 0, 0, 0.1);\n  border-radius: 50%;\n  border-top-color: var(--rebill-color-primary, #007bff);\n  animation: spin 1s linear infinite;\n  display: inline-block;\n}\n\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n","import { Component, Event, EventEmitter, h, Listen, Prop, State } from '@stencil/core';\nimport { I18nService } from '../../../../i18n/i18n.service';\nimport { SessionStore } from '../../../../store/session.store';\n@Component({\n  tag: 'rebill-input-select',\n  styleUrl: 'input-select.css',\n  shadow: false,\n})\nexport class InputSelect {\n  private dropdownRef?: HTMLDivElement;\n  private triggerRef?: HTMLDivElement;\n  private searchInputRef?: HTMLInputElement;\n  private unsubscribeCurrentLocaleStore?: () => void;\n\n  /** Etiqueta que se muestra arriba del select */\n  @Prop() label: string = '';\n  /** Opciones del select */\n  @Prop() options: { label: string; value: string }[] = [];\n  /** Valor seleccionado */\n  @Prop({ mutable: true, reflect: true }) value: string = '';\n  /** Mensaje de error */\n  @Prop() error: string = '';\n  /** ID del select */\n  @Prop() id: string = '';\n  /** Estado deshabilitado */\n  @Prop() disabled: boolean = false;\n  /** Placeholder text */\n  @Prop() placeholder: string = 'Selecciona una opción';\n  /** Variant input select */\n  @Prop() variant: 'outlined' | 'underlined';\n  /** Icono de flecha hacia abajo */\n  @Prop() arrowIcon: 'up-down' | 'down' = 'up-down';\n  /** Posición del dropdown */\n  @Prop() dropPosition: 'up' | 'down' = 'down';\n  /** Tamaño de la fuente */\n  @Prop() fontSize: string = '14px';\n  /** Estilos personalizados */\n  @Prop() backgroundColor: string = '';\n  /** Habilitar funcionalidad de búsqueda */\n  @Prop() searchable: boolean = false;\n  /** Placeholder del campo de búsqueda */\n  @Prop() searchPlaceholder: string = 'Search for options...';\n  /** Estado de carga */\n  @Prop() loading: boolean = false;\n  /** Estado interno para mostrar/ocultar el dropdown */\n  @State() isOpen: boolean = false;\n  /** ID único del componente */\n  @State() componentId: string = '';\n  /** Índice de la opción resaltada para navegación con teclado */\n  @State() highlightedIndex: number = -1;\n  /** Término de búsqueda */\n  @State() searchTerm: string = '';\n  /** Opciones filtradas */\n  @State() filteredOptions: { label: string; value: string }[] = [];\n  /** Estado para forzar re-render cuando cambia el idioma */\n  @State() languageUpdateTrigger: number = 0;\n  /** Evento al cambiar el valor */\n  @Event() input: EventEmitter<{ id: string; value: string; disabled?: boolean }>;\n\n  componentWillLoad() {\n    this.filteredOptions = [...this.options];\n    this.componentId = this.id || `select-${Math.random().toString(36).substr(2, 9)}`;\n  }\n\n  componentDidLoad() {\n    this.unsubscribeCurrentLocaleStore = SessionStore.onChange('currentLocale', () => {\n      this.languageUpdateTrigger++;\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.unsubscribeCurrentLocaleStore) {\n      this.unsubscribeCurrentLocaleStore();\n    }\n  }\n\n  componentWillUpdate() {\n    this.filteredOptions = [...this.options];\n\n    if (this.searchable) {\n      this.filterOptions();\n    }\n  }\n\n  @Listen('change', { target: 'document' })\n  handleFormChange(event: CustomEvent) {\n    const formData = event.detail;\n    if (formData && this.id in formData) {\n      const newValue = formData[this.id];\n      // Only update if the new value is different and ensure it's a string\n      if (newValue !== this.value && typeof newValue === 'string') {\n        this.value = newValue;\n        this.input.emit({ id: this.id, value: this.value });\n      }\n    }\n  }\n\n  @Listen('closeAllSelects', { target: 'document' })\n  handleCloseAllSelects(event: CustomEvent) {\n    if (event.detail !== this.componentId) {\n      this.closeDropdown();\n    }\n  }\n\n  @Listen('click', { target: 'document' })\n  handleDocumentClick(event: Event) {\n    if (\n      this.dropdownRef &&\n      this.triggerRef &&\n      !this.dropdownRef.contains(event.target as Node) &&\n      !this.triggerRef.contains(event.target as Node)\n    ) {\n      this.closeDropdown();\n    }\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (this.disabled) return;\n\n    if (this.searchable && this.searchInputRef && event.target === this.searchInputRef) {\n      return;\n    }\n\n    switch (event.key) {\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        if (this.isOpen && this.highlightedIndex >= 0) {\n          this.selectOption(this.filteredOptions[this.highlightedIndex]);\n        } else {\n          this.toggleDropdown();\n        }\n        break;\n      case 'Escape':\n        event.preventDefault();\n        this.closeDropdown();\n        break;\n      case 'ArrowDown':\n        event.preventDefault();\n        if (!this.isOpen) {\n          this.openDropdown();\n        } else {\n          this.highlightedIndex = Math.min(\n            this.highlightedIndex + 1,\n            this.filteredOptions.length - 1,\n          );\n        }\n        break;\n      case 'ArrowUp':\n        event.preventDefault();\n        if (this.isOpen) {\n          this.highlightedIndex = Math.max(this.highlightedIndex - 1, 0);\n        }\n        break;\n    }\n  }\n\n  private toggleDropdown = () => {\n    if (this.disabled) return;\n\n    const wasOpen = this.isOpen;\n    this.isOpen = !this.isOpen;\n\n    if (this.isOpen) {\n      if (!wasOpen) {\n        document.dispatchEvent(new CustomEvent('closeAllSelects', { detail: this.componentId }));\n      }\n\n      this.highlightedIndex = this.filteredOptions.findIndex(opt => opt.value === this.value);\n      if (this.highlightedIndex === -1) {\n        this.highlightedIndex = 0;\n      }\n\n      if (this.searchable) {\n        this.focusSearchInput();\n      }\n    } else {\n      this.searchTerm = '';\n      this.filterOptions();\n    }\n  };\n\n  private openDropdown = () => {\n    if (this.disabled) return;\n    document.dispatchEvent(new CustomEvent('closeAllSelects', { detail: this.componentId }));\n    this.isOpen = true;\n    this.highlightedIndex = this.filteredOptions.findIndex(opt => opt.value === this.value);\n    if (this.highlightedIndex === -1) {\n      this.highlightedIndex = 0;\n    }\n\n    if (this.searchable) {\n      this.focusSearchInput();\n    }\n  };\n\n  private focusSearchInput = () => {\n    const focusInput = () => {\n      if (this.searchInputRef) {\n        this.searchInputRef.focus();\n        this.searchInputRef.select();\n      }\n    };\n    focusInput();\n\n    requestAnimationFrame(() => {\n      focusInput();\n    });\n    setTimeout(() => {\n      focusInput();\n    }, 10);\n  };\n\n  private closeDropdown = () => {\n    this.isOpen = false;\n    this.highlightedIndex = -1;\n    this.searchTerm = '';\n    this.filterOptions();\n  };\n\n  private selectOption = (option: { label: string; value: string }) => {\n    if (this.disabled) return;\n    this.value = option.value;\n    this.closeDropdown();\n    this.input.emit({ id: this.id, value: this.value, disabled: this.disabled });\n  };\n\n  private getSelectedOptionLabel = (): string => {\n    const selectedOption = this.options.find(opt => opt.value === this.value);\n    return selectedOption ? selectedOption.label : this.placeholder;\n  };\n\n  private getArrowIcon = () => {\n    if (this.arrowIcon === 'up-down') return 'chevron-up-down';\n    return 'chevron-down';\n  };\n\n  private filterOptions = () => {\n    if (!this.searchTerm.trim()) {\n      this.filteredOptions = [...this.options];\n    } else {\n      this.filteredOptions = this.options.filter(option =>\n        option.label.toLowerCase().includes(this.searchTerm.toLowerCase()),\n      );\n    }\n    this.highlightedIndex = -1;\n  };\n\n  private handleSearchInput = (event: Event) => {\n    const target = event.target as HTMLInputElement;\n    this.searchTerm = target.value;\n    this.filterOptions();\n  };\n\n  private clearSearch = () => {\n    this.searchTerm = '';\n    this.filterOptions();\n  };\n\n  private handleSearchClick = (event: Event) => {\n    event.stopPropagation();\n  };\n\n  render() {\n    const selectedLabel = this.getSelectedOptionLabel();\n    const hasValue = this.value !== '';\n\n    return (\n      <div class=\"input-container\">\n        {this.label && (\n          <label class={`input-label ${this.disabled ? 'disabled' : ''}`}>{this.label}</label>\n        )}\n        <div\n          class={`select-wrapper ${this.disabled ? 'disabled' : ''} ${this.isOpen ? 'open' : ''}`}\n        >\n          <div\n            ref={el => (this.triggerRef = el)}\n            class={`input-element select-trigger ${this.error ? 'input-error' : ''} ${!hasValue ? 'placeholder' : ''} ${this.variant === 'underlined' ? 'underlined' : ''}`}\n            style={{ backgroundColor: this.backgroundColor }}\n            onClick={this.toggleDropdown}\n            tabIndex={this.disabled ? -1 : 0}\n            role=\"combobox\"\n            aria-expanded={this.isOpen.toString()}\n            aria-haspopup=\"listbox\"\n            aria-labelledby={this.label ? `${this.id}-label` : undefined}\n          >\n            <span\n              class=\"select-value\"\n              style={{ fontSize: this.fontSize }}\n              innerHTML={selectedLabel}\n            ></span>\n            <div class=\"icon-wrapper\">\n              {this.loading ? (\n                <div class=\"spinner\"></div>\n              ) : (\n                <rebill-icon\n                  name={this.getArrowIcon()}\n                  size=\"20px\"\n                  class={`select-icon ${this.isOpen && this.arrowIcon === 'down' ? 'rotated' : ''}`}\n                />\n              )}\n            </div>\n          </div>\n\n          {this.isOpen && (\n            <div\n              ref={el => (this.dropdownRef = el)}\n              class={`select-dropPosition ${this.dropPosition === 'up' ? 'open-up' : 'open-down'}`}\n              role=\"listbox\"\n            >\n              {this.searchable && (\n                <div class=\"search-container\" onClick={this.handleSearchClick}>\n                  <div class=\"search-input-wrapper\">\n                    <rebill-icon name=\"search\" size=\"16px\" class=\"search-icon\" />\n                    <input\n                      ref={el => (this.searchInputRef = el)}\n                      type=\"text\"\n                      class=\"search-input\"\n                      placeholder={this.searchPlaceholder}\n                      value={this.searchTerm}\n                      onInput={this.handleSearchInput}\n                      onClick={this.handleSearchClick}\n                      style={{ fontSize: this.fontSize }}\n                    />\n                    {this.searchTerm && (\n                      <button\n                        type=\"button\"\n                        class=\"clear-search\"\n                        onClick={event => {\n                          event.stopPropagation();\n                          this.clearSearch();\n                        }}\n                        aria-label=\"Clear search\"\n                      >\n                        <rebill-icon name=\"x\" size=\"16px\" />\n                      </button>\n                    )}\n                  </div>\n                </div>\n              )}\n              {this.loading && this.filteredOptions.length === 0 ? (\n                <div class=\"loading-message\" style={{ fontSize: this.fontSize }}>\n                  <div class=\"spinner\"></div>\n                  {I18nService.translate('common.loadingOptions')}\n                </div>\n              ) : this.filteredOptions.length > 0 ? (\n                this.filteredOptions.map((option, index) => (\n                  <div\n                    class={`select-option ${this.value === option.value ? 'selected' : ''} ${this.highlightedIndex === index ? 'highlighted' : ''}`}\n                    style={{ fontSize: this.fontSize }}\n                    onClick={() => this.selectOption(option)}\n                    role=\"option\"\n                    aria-selected={this.value === option.value ? 'true' : 'false'}\n                  >\n                    <span innerHTML={option.label}></span>\n                  </div>\n                ))\n              ) : (\n                <div class=\"no-results\" style={{ fontSize: this.fontSize }}>\n                  No se encontraron resultados\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n        {this.error && <span class=\"error-message\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"names":["SessionStore","h","I18nService","index"],"mappings":"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"}
+{"version":3,"file":"rebill-input-select.entry.cjs.js","sources":["src/components/shared/inputs/input-select/input-select.css?tag=rebill-input-select","src/components/shared/inputs/input-select/input-select.tsx"],"sourcesContent":["@import '../shared-input.css';\n\n:host {\n  display: block;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.select-wrapper {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.select-trigger {\n  width: 100%;\n  height: 38.33px;\n  border-radius: var(--input-group-inner-border-radius, 8px);\n  border: 1.5px solid var(--rebill-color-border);\n  padding: 10px 14px;\n  padding-right: 30px; /* Espacio para el icono */\n  font-size: 0.875rem;\n  font-weight: normal;\n  color: var(--rebill-color-text-primary);\n  outline: none;\n  transition: border-color 0.2s;\n  background: var(--rebill-color-background);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  user-select: none;\n  box-sizing: border-box;\n  min-width: 0; /* Allow the element to shrink below its content size */\n}\n\n.select-trigger:focus {\n  outline: none;\n  border-color: var(--rebill-color-primary);\n  box-shadow: 0 0 0 2px var(--rebill-color-primary-light);\n}\n\n.select-trigger:hover:not(.disabled) {\n  border-color: var(--rebill-color-primary);\n}\n\n.select-trigger.input-error {\n  border-color: var(--rebill-color-error) !important;\n}\n\n.select-trigger.placeholder .select-value {\n  color: var(--rebill-color-text-secondary-light);\n  font-size: 0.875rem;\n}\n\n.select-wrapper.disabled .select-trigger {\n  background-color: var(--rebill-color-background);\n  /* border-color: var(--rebill-color-disabled); */\n  color: var(--rebill-color-text-secondary);\n  cursor: not-allowed;\n  opacity: 0.7;\n}\n\n.select-value {\n  flex: 1;\n  text-align: left;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.icon-wrapper {\n  position: absolute;\n  right: 0.75rem;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 20px;\n  width: 20px;\n}\n\n.select-icon {\n  color: var(--rebill-color-text-secondary);\n  transition: transform 0.2s ease;\n  transform-origin: 50% 50%;\n  display: block;\n}\n\n.select-icon.rotated {\n  transform: rotateX(180deg);\n}\n\n.select-wrapper.disabled .select-icon {\n  color: var(--rebill-color-disabled);\n}\n\n/* Variante undelineated - sin borde */\n.select-trigger.underlined {\n  width: 100%;\n  height: 38.33px;\n  padding: 10px 14px;\n  padding-right: 40px;\n  font-size: 0.875rem;\n  font-weight: normal;\n  color: var(--rebill-color-text-primary);\n  outline: none;\n  background: var(--rebill-color-background);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  user-select: none;\n  min-width: 0;\n  border: none;\n}\n\n.select-trigger.underlined:focus {\n  border: none;\n  box-shadow: none;\n}\n\n.select-dropPosition.open-down {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  right: 0;\n  z-index: 1000;\n  background-color: var(--rebill-color-background);\n  border: 1px solid var(--rebill-color-border);\n  border-radius: 0.375rem;\n  box-shadow:\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  margin-top: 0.25rem;\n  max-height: 200px;\n  overflow-y: auto;\n  animation: slideDown 0.15s ease-out;\n  box-sizing: border-box;\n  width: 100%;\n}\n\n.select-dropPosition.open-up {\n  position: absolute;\n  bottom: 100%;\n  left: 0;\n  right: 0;\n  z-index: 1000;\n  background-color: var(--rebill-color-background);\n  border: 1px solid var(--rebill-color-border);\n  border-radius: 0.375rem;\n  box-shadow:\n    0 4px 6px -1px rgba(0, 0, 0, 0.1),\n    0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  margin-bottom: 0.25rem;\n  margin-top: 0;\n  max-height: 200px;\n  overflow-y: auto;\n  animation: slideUp 0.15s ease-out;\n  box-sizing: border-box;\n  width: 100%;\n}\n\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n.select-option {\n  padding: 0.75rem;\n  font-size: 0.875rem;\n  color: var(--rebill-color-text-primary);\n  cursor: pointer;\n  border-bottom: 1px solid var(--rebill-color-border);\n  transition: background-color 0.15s ease;\n}\n\n.select-option:last-child {\n  border-bottom: none;\n}\n\n.select-option:hover,\n.select-option.highlighted {\n  background-color: #f0f9ff;\n}\n\n.select-option.selected {\n  background-color: var(--rebill-color-primary);\n  color: white;\n}\n\n.select-option.selected:hover,\n.select-option.selected.highlighted {\n  background-color: var(--rebill-color-primary);\n}\n\n/* Scrollbar styling for the dropdown */\n.select-dropdown::-webkit-scrollbar {\n  width: 6px;\n}\n\n.select-dropdown::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.select-dropdown::-webkit-scrollbar-thumb {\n  background-color: var(--rebill-color-border);\n  border-radius: 3px;\n}\n\n.select-dropdown::-webkit-scrollbar-thumb:hover {\n  background-color: var(--rebill-color-text-secondary);\n}\n\n/* Estilos para la funcionalidad de búsqueda */\n.search-container {\n  padding: 0.75rem;\n  border-bottom: 1px solid var(--rebill-color-border);\n  background-color: var(--rebill-color-background);\n}\n\n.search-input-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: 100%;\n}\n\n.search-icon {\n  position: absolute;\n  left: 0.75rem;\n  color: var(--rebill-color-text-secondary);\n  z-index: 1;\n  pointer-events: none;\n}\n\n.search-input {\n  width: 100%;\n  padding: 0.5rem 0.75rem 0.5rem 2.5rem;\n  border: 1px solid var(--rebill-color-border);\n  border-radius: 0.375rem;\n  font-size: 0.875rem;\n  color: var(--rebill-color-text-primary);\n  background-color: var(--rebill-color-background);\n  outline: none;\n  transition: border-color 0.2s ease;\n  box-sizing: border-box;\n}\n\n.search-input:focus {\n  border-color: var(--rebill-color-primary);\n  box-shadow: 0 0 0 2px var(--rebill-color-primary-light);\n}\n\n.search-input::placeholder {\n  color: var(--rebill-color-text-secondary-light);\n  font-size: 0.875rem;\n}\n\n.clear-search {\n  position: absolute;\n  right: 0.75rem;\n  background: none;\n  border: none;\n  cursor: pointer;\n  padding: 0.25rem;\n  border-radius: 0.25rem;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--rebill-color-text-secondary);\n  transition: background-color 0.2s ease;\n}\n\n.clear-search:hover {\n  background-color: var(--rebill-color-background-hover);\n  color: var(--rebill-color-text-primary);\n}\n\n.no-results {\n  padding: 0.75rem;\n  text-align: center;\n  color: var(--rebill-color-text-secondary);\n  font-style: italic;\n  border-bottom: 1px solid var(--rebill-color-border);\n}\n\n.loading-message {\n  padding: 0.75rem;\n  text-align: center;\n  color: var(--rebill-color-text-secondary);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.5rem;\n  border-bottom: 1px solid var(--rebill-color-border);\n}\n\n.loading-message .spinner {\n  width: 14px;\n  height: 14px;\n  border: 2px solid rgba(0, 0, 0, 0.1);\n  border-radius: 50%;\n  border-top-color: var(--rebill-color-primary, #007bff);\n  animation: spin 1s linear infinite;\n}\n\n/* Spinner styles */\n.spinner {\n  width: 16px;\n  height: 16px;\n  border: 2px solid rgba(0, 0, 0, 0.1);\n  border-radius: 50%;\n  border-top-color: var(--rebill-color-primary, #007bff);\n  animation: spin 1s linear infinite;\n  display: inline-block;\n}\n\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Fix para evitar zoom en dispositivos móviles */\n@media screen and (max-width: 768px) {\n  .select-trigger {\n    font-size: 1rem;\n  }\n\n  .select-trigger.placeholder .select-value {\n    font-size: 1rem;\n  }\n\n  .select-option {\n    font-size: 1rem;\n  }\n\n  .search-input {\n    font-size: 1rem;\n  }\n\n  .search-input::placeholder {\n    font-size: 1rem;\n  }\n\n  .loading-message {\n    font-size: 1rem;\n  }\n\n  .no-results {\n    font-size: 1rem;\n  }\n}\n","import { Component, Event, EventEmitter, h, Listen, Prop, State } from '@stencil/core';\nimport { I18nService } from '../../../../i18n/i18n.service';\nimport { SessionStore } from '../../../../store/session.store';\n@Component({\n  tag: 'rebill-input-select',\n  styleUrl: 'input-select.css',\n  shadow: false,\n})\nexport class InputSelect {\n  private dropdownRef?: HTMLDivElement;\n  private triggerRef?: HTMLDivElement;\n  private searchInputRef?: HTMLInputElement;\n  private unsubscribeCurrentLocaleStore?: () => void;\n\n  /** Etiqueta que se muestra arriba del select */\n  @Prop() label: string = '';\n  /** Opciones del select */\n  @Prop() options: { label: string; value: string }[] = [];\n  /** Valor seleccionado */\n  @Prop({ mutable: true, reflect: true }) value: string = '';\n  /** Mensaje de error */\n  @Prop() error: string = '';\n  /** ID del select */\n  @Prop() id: string = '';\n  /** Estado deshabilitado */\n  @Prop() disabled: boolean = false;\n  /** Placeholder text */\n  @Prop() placeholder: string = 'Selecciona una opción';\n  /** Variant input select */\n  @Prop() variant: 'outlined' | 'underlined';\n  /** Icono de flecha hacia abajo */\n  @Prop() arrowIcon: 'up-down' | 'down' = 'up-down';\n  /** Posición del dropdown */\n  @Prop() dropPosition: 'up' | 'down' = 'down';\n  /** Tamaño de la fuente */\n  @Prop() fontSize: string = '14px';\n  /** Estilos personalizados */\n  @Prop() backgroundColor: string = '';\n  /** Habilitar funcionalidad de búsqueda */\n  @Prop() searchable: boolean = false;\n  /** Placeholder del campo de búsqueda */\n  @Prop() searchPlaceholder: string = 'Search for options...';\n  /** Estado de carga */\n  @Prop() loading: boolean = false;\n  /** Estado interno para mostrar/ocultar el dropdown */\n  @State() isOpen: boolean = false;\n  /** ID único del componente */\n  @State() componentId: string = '';\n  /** Índice de la opción resaltada para navegación con teclado */\n  @State() highlightedIndex: number = -1;\n  /** Término de búsqueda */\n  @State() searchTerm: string = '';\n  /** Opciones filtradas */\n  @State() filteredOptions: { label: string; value: string }[] = [];\n  /** Estado para forzar re-render cuando cambia el idioma */\n  @State() languageUpdateTrigger: number = 0;\n  /** Evento al cambiar el valor */\n  @Event() input: EventEmitter<{ id: string; value: string; disabled?: boolean }>;\n\n  componentWillLoad() {\n    this.filteredOptions = [...this.options];\n    this.componentId = this.id || `select-${Math.random().toString(36).substr(2, 9)}`;\n  }\n\n  componentDidLoad() {\n    this.unsubscribeCurrentLocaleStore = SessionStore.onChange('currentLocale', () => {\n      this.languageUpdateTrigger++;\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.unsubscribeCurrentLocaleStore) {\n      this.unsubscribeCurrentLocaleStore();\n    }\n  }\n\n  componentWillUpdate() {\n    this.filteredOptions = [...this.options];\n\n    if (this.searchable) {\n      this.filterOptions();\n    }\n  }\n\n  @Listen('change', { target: 'document' })\n  handleFormChange(event: CustomEvent) {\n    const formData = event.detail;\n    if (formData && this.id in formData) {\n      const newValue = formData[this.id];\n      // Only update if the new value is different and ensure it's a string\n      if (newValue !== this.value && typeof newValue === 'string') {\n        this.value = newValue;\n        this.input.emit({ id: this.id, value: this.value });\n      }\n    }\n  }\n\n  @Listen('closeAllSelects', { target: 'document' })\n  handleCloseAllSelects(event: CustomEvent) {\n    if (event.detail !== this.componentId) {\n      this.closeDropdown();\n    }\n  }\n\n  @Listen('click', { target: 'document' })\n  handleDocumentClick(event: Event) {\n    if (\n      this.dropdownRef &&\n      this.triggerRef &&\n      !this.dropdownRef.contains(event.target as Node) &&\n      !this.triggerRef.contains(event.target as Node)\n    ) {\n      this.closeDropdown();\n    }\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (this.disabled) return;\n\n    if (this.searchable && this.searchInputRef && event.target === this.searchInputRef) {\n      return;\n    }\n\n    switch (event.key) {\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        if (this.isOpen && this.highlightedIndex >= 0) {\n          this.selectOption(this.filteredOptions[this.highlightedIndex]);\n        } else {\n          this.toggleDropdown();\n        }\n        break;\n      case 'Escape':\n        event.preventDefault();\n        this.closeDropdown();\n        break;\n      case 'ArrowDown':\n        event.preventDefault();\n        if (!this.isOpen) {\n          this.openDropdown();\n        } else {\n          this.highlightedIndex = Math.min(\n            this.highlightedIndex + 1,\n            this.filteredOptions.length - 1,\n          );\n        }\n        break;\n      case 'ArrowUp':\n        event.preventDefault();\n        if (this.isOpen) {\n          this.highlightedIndex = Math.max(this.highlightedIndex - 1, 0);\n        }\n        break;\n    }\n  }\n\n  private toggleDropdown = () => {\n    if (this.disabled) return;\n\n    const wasOpen = this.isOpen;\n    this.isOpen = !this.isOpen;\n\n    if (this.isOpen) {\n      if (!wasOpen) {\n        document.dispatchEvent(new CustomEvent('closeAllSelects', { detail: this.componentId }));\n      }\n\n      this.highlightedIndex = this.filteredOptions.findIndex(opt => opt.value === this.value);\n      if (this.highlightedIndex === -1) {\n        this.highlightedIndex = 0;\n      }\n\n      if (this.searchable) {\n        this.focusSearchInput();\n      }\n    } else {\n      this.searchTerm = '';\n      this.filterOptions();\n    }\n  };\n\n  private openDropdown = () => {\n    if (this.disabled) return;\n    document.dispatchEvent(new CustomEvent('closeAllSelects', { detail: this.componentId }));\n    this.isOpen = true;\n    this.highlightedIndex = this.filteredOptions.findIndex(opt => opt.value === this.value);\n    if (this.highlightedIndex === -1) {\n      this.highlightedIndex = 0;\n    }\n\n    if (this.searchable) {\n      this.focusSearchInput();\n    }\n  };\n\n  private focusSearchInput = () => {\n    const focusInput = () => {\n      if (this.searchInputRef) {\n        this.searchInputRef.focus();\n        this.searchInputRef.select();\n      }\n    };\n    focusInput();\n\n    requestAnimationFrame(() => {\n      focusInput();\n    });\n    setTimeout(() => {\n      focusInput();\n    }, 10);\n  };\n\n  private closeDropdown = () => {\n    this.isOpen = false;\n    this.highlightedIndex = -1;\n    this.searchTerm = '';\n    this.filterOptions();\n  };\n\n  private selectOption = (option: { label: string; value: string }) => {\n    if (this.disabled) return;\n    this.value = option.value;\n    this.closeDropdown();\n    this.input.emit({ id: this.id, value: this.value, disabled: this.disabled });\n  };\n\n  private getSelectedOptionLabel = (): string => {\n    const selectedOption = this.options.find(opt => opt.value === this.value);\n    return selectedOption ? selectedOption.label : this.placeholder;\n  };\n\n  private getArrowIcon = () => {\n    if (this.arrowIcon === 'up-down') return 'chevron-up-down';\n    return 'chevron-down';\n  };\n\n  private filterOptions = () => {\n    if (!this.searchTerm.trim()) {\n      this.filteredOptions = [...this.options];\n    } else {\n      this.filteredOptions = this.options.filter(option =>\n        option.label.toLowerCase().includes(this.searchTerm.toLowerCase()),\n      );\n    }\n    this.highlightedIndex = -1;\n  };\n\n  private handleSearchInput = (event: Event) => {\n    const target = event.target as HTMLInputElement;\n    this.searchTerm = target.value;\n    this.filterOptions();\n  };\n\n  private clearSearch = () => {\n    this.searchTerm = '';\n    this.filterOptions();\n  };\n\n  private handleSearchClick = (event: Event) => {\n    event.stopPropagation();\n  };\n\n  render() {\n    const selectedLabel = this.getSelectedOptionLabel();\n    const hasValue = this.value !== '';\n\n    return (\n      <div class=\"input-container\">\n        {this.label && (\n          <label class={`input-label ${this.disabled ? 'disabled' : ''}`}>{this.label}</label>\n        )}\n        <div\n          class={`select-wrapper ${this.disabled ? 'disabled' : ''} ${this.isOpen ? 'open' : ''}`}\n        >\n          <div\n            ref={el => (this.triggerRef = el)}\n            class={`input-element select-trigger ${this.error ? 'input-error' : ''} ${!hasValue ? 'placeholder' : ''} ${this.variant === 'underlined' ? 'underlined' : ''}`}\n            style={{ backgroundColor: this.backgroundColor }}\n            onClick={this.toggleDropdown}\n            tabIndex={this.disabled ? -1 : 0}\n            role=\"combobox\"\n            aria-expanded={this.isOpen.toString()}\n            aria-haspopup=\"listbox\"\n            aria-labelledby={this.label ? `${this.id}-label` : undefined}\n          >\n            <span\n              class=\"select-value\"\n              style={{ fontSize: this.fontSize }}\n              innerHTML={selectedLabel}\n            ></span>\n            <div class=\"icon-wrapper\">\n              {this.loading ? (\n                <div class=\"spinner\"></div>\n              ) : (\n                <rebill-icon\n                  name={this.getArrowIcon()}\n                  size=\"20px\"\n                  class={`select-icon ${this.isOpen && this.arrowIcon === 'down' ? 'rotated' : ''}`}\n                />\n              )}\n            </div>\n          </div>\n\n          {this.isOpen && (\n            <div\n              ref={el => (this.dropdownRef = el)}\n              class={`select-dropPosition ${this.dropPosition === 'up' ? 'open-up' : 'open-down'}`}\n              role=\"listbox\"\n            >\n              {this.searchable && (\n                <div class=\"search-container\" onClick={this.handleSearchClick}>\n                  <div class=\"search-input-wrapper\">\n                    <rebill-icon name=\"search\" size=\"16px\" class=\"search-icon\" />\n                    <input\n                      ref={el => (this.searchInputRef = el)}\n                      type=\"text\"\n                      class=\"search-input\"\n                      placeholder={this.searchPlaceholder}\n                      value={this.searchTerm}\n                      onInput={this.handleSearchInput}\n                      onClick={this.handleSearchClick}\n                      style={{ fontSize: this.fontSize }}\n                    />\n                    {this.searchTerm && (\n                      <button\n                        type=\"button\"\n                        class=\"clear-search\"\n                        onClick={event => {\n                          event.stopPropagation();\n                          this.clearSearch();\n                        }}\n                        aria-label=\"Clear search\"\n                      >\n                        <rebill-icon name=\"x\" size=\"16px\" />\n                      </button>\n                    )}\n                  </div>\n                </div>\n              )}\n              {this.loading && this.filteredOptions.length === 0 ? (\n                <div class=\"loading-message\" style={{ fontSize: this.fontSize }}>\n                  <div class=\"spinner\"></div>\n                  {I18nService.translate('common.loadingOptions')}\n                </div>\n              ) : this.filteredOptions.length > 0 ? (\n                this.filteredOptions.map((option, index) => (\n                  <div\n                    class={`select-option ${this.value === option.value ? 'selected' : ''} ${this.highlightedIndex === index ? 'highlighted' : ''}`}\n                    style={{ fontSize: this.fontSize }}\n                    onClick={() => this.selectOption(option)}\n                    role=\"option\"\n                    aria-selected={this.value === option.value ? 'true' : 'false'}\n                  >\n                    <span innerHTML={option.label}></span>\n                  </div>\n                ))\n              ) : (\n                <div class=\"no-results\" style={{ fontSize: this.fontSize }}>\n                  No se encontraron resultados\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n        {this.error && <span class=\"error-message\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"names":["SessionStore","h","I18nService","index"],"mappings":";;;;;AAAA,MAAM,cAAc,GAAG,k1OAAk1O;;MCQ51O,WAAW,GAAA,MAAA;;;;;AACd,IAAA,WAAW;AACX,IAAA,UAAU;AACV,IAAA,cAAc;AACd,IAAA,6BAA6B;;IAG7B,KAAK,GAAW,EAAE;;IAElB,OAAO,GAAuC,EAAE;;IAEhB,KAAK,GAAW,EAAE;;IAElD,KAAK,GAAW,EAAE;;IAElB,EAAE,GAAW,EAAE;;IAEf,QAAQ,GAAY,KAAK;;IAEzB,WAAW,GAAW,uBAAuB;;AAE7C,IAAA,OAAO;;IAEP,SAAS,GAAuB,SAAS;;IAEzC,YAAY,GAAkB,MAAM;;IAEpC,QAAQ,GAAW,MAAM;;IAEzB,eAAe,GAAW,EAAE;;IAE5B,UAAU,GAAY,KAAK;;IAE3B,iBAAiB,GAAW,uBAAuB;;IAEnD,OAAO,GAAY,KAAK;;IAEvB,MAAM,GAAY,KAAK;;IAEvB,WAAW,GAAW,EAAE;;IAExB,gBAAgB,GAAW,EAAE;;IAE7B,UAAU,GAAW,EAAE;;IAEvB,eAAe,GAAuC,EAAE;;IAExD,qBAAqB,GAAW,CAAC;;AAEjC,IAAA,KAAK;IAEd,iBAAiB,GAAA;QACf,IAAI,CAAC,eAAe,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;QACxC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,IAAI,CAAA,OAAA,EAAU,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA,CAAE;;IAGnF,gBAAgB,GAAA;QACd,IAAI,CAAC,6BAA6B,GAAGA,yBAAY,CAAC,QAAQ,CAAC,eAAe,EAAE,MAAK;YAC/E,IAAI,CAAC,qBAAqB,EAAE;AAC9B,SAAC,CAAC;;IAGJ,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,6BAA6B,EAAE;YACtC,IAAI,CAAC,6BAA6B,EAAE;;;IAIxC,mBAAmB,GAAA;QACjB,IAAI,CAAC,eAAe,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;AAExC,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,IAAI,CAAC,aAAa,EAAE;;;AAKxB,IAAA,gBAAgB,CAAC,KAAkB,EAAA;AACjC,QAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM;QAC7B,IAAI,QAAQ,IAAI,IAAI,CAAC,EAAE,IAAI,QAAQ,EAAE;YACnC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;;YAElC,IAAI,QAAQ,KAAK,IAAI,CAAC,KAAK,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;AAC3D,gBAAA,IAAI,CAAC,KAAK,GAAG,QAAQ;AACrB,gBAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;;;;AAMzD,IAAA,qBAAqB,CAAC,KAAkB,EAAA;QACtC,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,WAAW,EAAE;YACrC,IAAI,CAAC,aAAa,EAAE;;;AAKxB,IAAA,mBAAmB,CAAC,KAAY,EAAA;QAC9B,IACE,IAAI,CAAC,WAAW;AAChB,YAAA,IAAI,CAAC,UAAU;YACf,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC;YAChD,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EAC/C;YACA,IAAI,CAAC,aAAa,EAAE;;;AAKxB,IAAA,aAAa,CAAC,KAAoB,EAAA;QAChC,IAAI,IAAI,CAAC,QAAQ;YAAE;AAEnB,QAAA,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,cAAc,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,cAAc,EAAE;YAClF;;AAGF,QAAA,QAAQ,KAAK,CAAC,GAAG;AACf,YAAA,KAAK,OAAO;AACZ,YAAA,KAAK,GAAG;gBACN,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,gBAAgB,IAAI,CAAC,EAAE;AAC7C,oBAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;;qBACzD;oBACL,IAAI,CAAC,cAAc,EAAE;;gBAEvB;AACF,YAAA,KAAK,QAAQ;gBACX,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,aAAa,EAAE;gBACpB;AACF,YAAA,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE;AACtB,gBAAA,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;oBAChB,IAAI,CAAC,YAAY,EAAE;;qBACd;oBACL,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,GAAG,CAC9B,IAAI,CAAC,gBAAgB,GAAG,CAAC,EACzB,IAAI,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAChC;;gBAEH;AACF,YAAA,KAAK,SAAS;gBACZ,KAAK,CAAC,cAAc,EAAE;AACtB,gBAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AACf,oBAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,GAAG,CAAC,EAAE,CAAC,CAAC;;gBAEhE;;;IAIE,cAAc,GAAG,MAAK;QAC5B,IAAI,IAAI,CAAC,QAAQ;YAAE;AAEnB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM;AAC3B,QAAA,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM;AAE1B,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,IAAI,CAAC,OAAO,EAAE;AACZ,gBAAA,QAAQ,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,iBAAiB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;;YAG1F,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,GAAG,IAAI,GAAG,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;AACvF,YAAA,IAAI,IAAI,CAAC,gBAAgB,KAAK,EAAE,EAAE;AAChC,gBAAA,IAAI,CAAC,gBAAgB,GAAG,CAAC;;AAG3B,YAAA,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,IAAI,CAAC,gBAAgB,EAAE;;;aAEpB;AACL,YAAA,IAAI,CAAC,UAAU,GAAG,EAAE;YACpB,IAAI,CAAC,aAAa,EAAE;;AAExB,KAAC;IAEO,YAAY,GAAG,MAAK;QAC1B,IAAI,IAAI,CAAC,QAAQ;YAAE;AACnB,QAAA,QAAQ,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,iBAAiB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;AACxF,QAAA,IAAI,CAAC,MAAM,GAAG,IAAI;QAClB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,GAAG,IAAI,GAAG,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;AACvF,QAAA,IAAI,IAAI,CAAC,gBAAgB,KAAK,EAAE,EAAE;AAChC,YAAA,IAAI,CAAC,gBAAgB,GAAG,CAAC;;AAG3B,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,IAAI,CAAC,gBAAgB,EAAE;;AAE3B,KAAC;IAEO,gBAAgB,GAAG,MAAK;QAC9B,MAAM,UAAU,GAAG,MAAK;AACtB,YAAA,IAAI,IAAI,CAAC,cAAc,EAAE;AACvB,gBAAA,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE;AAC3B,gBAAA,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE;;AAEhC,SAAC;AACD,QAAA,UAAU,EAAE;QAEZ,qBAAqB,CAAC,MAAK;AACzB,YAAA,UAAU,EAAE;AACd,SAAC,CAAC;QACF,UAAU,CAAC,MAAK;AACd,YAAA,UAAU,EAAE;SACb,EAAE,EAAE,CAAC;AACR,KAAC;IAEO,aAAa,GAAG,MAAK;AAC3B,QAAA,IAAI,CAAC,MAAM,GAAG,KAAK;AACnB,QAAA,IAAI,CAAC,gBAAgB,GAAG,EAAE;AAC1B,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;QACpB,IAAI,CAAC,aAAa,EAAE;AACtB,KAAC;AAEO,IAAA,YAAY,GAAG,CAAC,MAAwC,KAAI;QAClE,IAAI,IAAI,CAAC,QAAQ;YAAE;AACnB,QAAA,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK;QACzB,IAAI,CAAC,aAAa,EAAE;QACpB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;AAC9E,KAAC;IAEO,sBAAsB,GAAG,MAAa;QAC5C,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;AACzE,QAAA,OAAO,cAAc,GAAG,cAAc,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW;AACjE,KAAC;IAEO,YAAY,GAAG,MAAK;AAC1B,QAAA,IAAI,IAAI,CAAC,SAAS,KAAK,SAAS;AAAE,YAAA,OAAO,iBAAiB;AAC1D,QAAA,OAAO,cAAc;AACvB,KAAC;IAEO,aAAa,GAAG,MAAK;QAC3B,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,EAAE;YAC3B,IAAI,CAAC,eAAe,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;;aACnC;AACL,YAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,IAC/C,MAAM,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,CACnE;;AAEH,QAAA,IAAI,CAAC,gBAAgB,GAAG,EAAE;AAC5B,KAAC;AAEO,IAAA,iBAAiB,GAAG,CAAC,KAAY,KAAI;AAC3C,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B;AAC/C,QAAA,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,KAAK;QAC9B,IAAI,CAAC,aAAa,EAAE;AACtB,KAAC;IAEO,WAAW,GAAG,MAAK;AACzB,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;QACpB,IAAI,CAAC,aAAa,EAAE;AACtB,KAAC;AAEO,IAAA,iBAAiB,GAAG,CAAC,KAAY,KAAI;QAC3C,KAAK,CAAC,eAAe,EAAE;AACzB,KAAC;IAED,MAAM,GAAA;AACJ,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,sBAAsB,EAAE;AACnD,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,KAAK,EAAE;AAElC,QAAA,QACEC,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EACzB,IAAI,CAAC,KAAK,KACTA,OAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAE,CAAe,YAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE,CAAA,EAAA,EAAG,IAAI,CAAC,KAAK,CAAS,CACrF,EACDA,OACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAkB,eAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAI,CAAA,EAAA,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,EAAE,CAAE,CAAA,EAAA,EAEvFA,OACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC,EACjC,KAAK,EAAE,CAAgC,6BAAA,EAAA,IAAI,CAAC,KAAK,GAAG,aAAa,GAAG,EAAE,CAAI,CAAA,EAAA,CAAC,QAAQ,GAAG,aAAa,GAAG,EAAE,CAAI,CAAA,EAAA,IAAI,CAAC,OAAO,KAAK,YAAY,GAAG,YAAY,GAAG,EAAE,CAAE,CAAA,EAC/J,KAAK,EAAE,EAAE,eAAe,EAAE,IAAI,CAAC,eAAe,EAAE,EAChD,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAG,CAAC,EAChC,IAAI,EAAC,UAAU,EAAA,eAAA,EACA,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,EACvB,eAAA,EAAA,SAAS,EACN,iBAAA,EAAA,IAAI,CAAC,KAAK,GAAG,CAAA,EAAG,IAAI,CAAC,EAAE,CAAQ,MAAA,CAAA,GAAG,SAAS,EAAA,EAE5DA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,cAAc,EACpB,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EAClC,SAAS,EAAE,aAAa,EAClB,CAAA,EACRA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EACtB,EAAA,IAAI,CAAC,OAAO,IACXA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,SAAS,EAAA,CAAO,KAE3BA,OAAA,CAAA,aAAA,EAAA,EACE,IAAI,EAAE,IAAI,CAAC,YAAY,EAAE,EACzB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,CAAe,YAAA,EAAA,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,SAAS,KAAK,MAAM,GAAG,SAAS,GAAG,EAAE,CAAA,CAAE,EAAA,CACjF,CACH,CACG,CACF,EAEL,IAAI,CAAC,MAAM,KACVA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC,EAClC,KAAK,EAAE,CAAuB,oBAAA,EAAA,IAAI,CAAC,YAAY,KAAK,IAAI,GAAG,SAAS,GAAG,WAAW,CAAA,CAAE,EACpF,IAAI,EAAC,SAAS,EAAA,EAEb,IAAI,CAAC,UAAU,KACdA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kBAAkB,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAAA,EAC3DA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,sBAAsB,EAAA,EAC/BA,OAAa,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,aAAa,EAAG,CAAA,EAC7DA,OACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC,EACrC,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,cAAc,EACpB,WAAW,EAAE,IAAI,CAAC,iBAAiB,EACnC,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EAClC,CAAA,EACD,IAAI,CAAC,UAAU,KACdA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,cAAc,EACpB,OAAO,EAAE,KAAK,IAAG;gBACf,KAAK,CAAC,eAAe,EAAE;gBACvB,IAAI,CAAC,WAAW,EAAE;AACpB,aAAC,gBACU,cAAc,EAAA,EAEzBA,OAAA,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAa,IAAI,EAAC,GAAG,EAAC,IAAI,EAAC,MAAM,EAAA,CAAG,CAC7B,CACV,CACG,CACF,CACP,EACA,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,IAChDA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,iBAAiB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAA,EAC7DA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,SAAS,EAAO,CAAA,EAC1BC,wBAAW,CAAC,SAAS,CAAC,uBAAuB,CAAC,CAC3C,IACJ,IAAI,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,IACjC,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,EAAEC,OAAK,MACrCF,OAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE,CAAA,cAAA,EAAiB,IAAI,CAAC,KAAK,KAAK,MAAM,CAAC,KAAK,GAAG,UAAU,GAAG,EAAE,CAAI,CAAA,EAAA,IAAI,CAAC,gBAAgB,KAAKE,OAAK,GAAG,aAAa,GAAG,EAAE,CAAA,CAAE,EAC/H,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EAClC,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EACxC,IAAI,EAAC,QAAQ,EACE,eAAA,EAAA,IAAI,CAAC,KAAK,KAAK,MAAM,CAAC,KAAK,GAAG,MAAM,GAAG,OAAO,EAAA,EAE7DF,OAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,KAAK,EAAS,CAAA,CAClC,CACP,CAAC,KAEFA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAA,EAAA,8BAAA,CAEpD,CACP,CACG,CACP,CACG,EACL,IAAI,CAAC,KAAK,IAAIA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,eAAe,EAAE,EAAA,IAAI,CAAC,KAAK,CAAQ,CAC1D;;;;;;;"}

package/dist/cjs/rebill-input-text.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-C-VTnc0I.js');
 
-const inputTextCss = ".input-container{display:flex;flex-direction:column}.input-label{font-size:0.875rem;color:var(--rebill-color-text-primary);font-weight:500;margin-bottom:0.375rem}.input-label.disabled{cursor:not-allowed}.input-element{border-radius:var(--input-group-inner-border-radius, 8px);border:1.5px solid var(--rebill-color-border);padding:10px 14px;font-size:0.875rem;color:var(--rebill-color-text-primary);outline:none;transition:border-color 0.2s;background:var(--rebill-color-background);height:38.33px;box-sizing:border-box}.input-element.input-error{border-color:var(--rebill-color-error)}.input-element:disabled{background-color:var(--rebill-color-background);border-color:var(--rebill-color-disabled);color:var(--rebill-color-text-secondary);cursor:not-allowed;opacity:0.7}select.input-element{padding:10px 30px 10px 14px;appearance:none;cursor:pointer}select.input-element:disabled{cursor:not-allowed}.input-element:focus{border-color:var(--rebill-color-primary)}.input-element:disabled:focus{border-color:var(--rebill-color-disabled)}.input-element::placeholder{color:var(--rebill-color-text-secondary-light);font-size:0.875rem;opacity:1}.select-wrapper.disabled .select-icon{color:var(--rebill-color-disabled)}.error-message{color:var(--rebill-color-error);font-size:0.75rem;margin-top:0.375rem}.input-wrapper{position:relative;display:flex;align-items:center}.input-element{width:100%;box-sizing:border-box}.icon-left,.icon-right{position:absolute;display:flex;align-items:center;justify-content:center;top:50%;transform:translateY(-50%)}.icon-left{left:0.75rem;color:var(--rebill-color-text-secondary-light)}.icon-right{right:0.75rem;cursor:pointer;color:var(--rebill-color-text-secondary-light)}.input-element.input-error:focus{flex-direction:column;box-shadow:0 0 0 2px var(--rebill-color-error-light)}.floating-label{position:relative}.floating-label .input-text__input-label{position:absolute;top:50%;left:0.75rem;transform:translateY(-50%);color:var(--rebill-color-text-secondary-light);transition:all 0.1s ease-in-out;pointer-events:none}.floating-label .input-element::placeholder{color:transparent}.floating-label .input-element:focus~.input-text__input-label,.floating-label .input-element:not(:placeholder-shown)~.input-text__input-label{top:0;font-size:0.62rem;color:var(--rebill-color-text-secondary);background-color:var(--rebill-color-background);padding:0 4px;left:0.75rem}.floating-label.has-left-icon .input-text__input-label{left:2.5rem}.input-element:disabled{color:var(--rebill-color-neutrals-500)}.input-wrapper:has(.input-element:disabled) .icon-left,.input-wrapper:has(.input-element:disabled) .icon-right{color:var(--rebill-color-text-secondary-light) !important}";
+const inputTextCss = ".input-container{display:flex;flex-direction:column}.input-label{font-size:0.875rem;color:var(--rebill-color-text-primary);font-weight:500;margin-bottom:0.375rem}.input-label.disabled{cursor:not-allowed}.input-element{border-radius:var(--input-group-inner-border-radius, 8px);border:1.5px solid var(--rebill-color-border);padding:10px 14px;font-size:0.875rem;color:var(--rebill-color-text-primary);outline:none;transition:border-color 0.2s;background:var(--rebill-color-background);height:38.33px;box-sizing:border-box}.input-element.input-error{border-color:var(--rebill-color-error)}.input-element:disabled{background-color:var(--rebill-color-background);border-color:var(--rebill-color-disabled);color:var(--rebill-color-text-secondary);cursor:not-allowed;opacity:0.7}select.input-element{padding:10px 30px 10px 14px;appearance:none;cursor:pointer}select.input-element:disabled{cursor:not-allowed}.input-element:focus{border-color:var(--rebill-color-primary)}.input-element:disabled:focus{border-color:var(--rebill-color-disabled)}.input-element::placeholder{color:var(--rebill-color-text-secondary-light);font-size:0.875rem;opacity:1}.select-wrapper.disabled .select-icon{color:var(--rebill-color-disabled)}.error-message{color:var(--rebill-color-error);font-size:0.75rem;margin-top:0.375rem}@media screen and (max-width: 768px){.input-element{font-size:1rem}.input-element::placeholder{font-size:1rem}}.input-wrapper{position:relative;display:flex;align-items:center}.input-element{width:100%;box-sizing:border-box}.icon-left,.icon-right{position:absolute;display:flex;align-items:center;justify-content:center;top:50%;transform:translateY(-50%)}.icon-left{left:0.75rem;color:var(--rebill-color-text-secondary-light)}.icon-right{right:0.75rem;cursor:pointer;color:var(--rebill-color-text-secondary-light)}.input-element.input-error:focus{flex-direction:column;box-shadow:0 0 0 2px var(--rebill-color-error-light)}.floating-label{position:relative}.floating-label .input-text__input-label{position:absolute;top:50%;left:0.75rem;transform:translateY(-50%);color:var(--rebill-color-text-secondary-light);transition:all 0.1s ease-in-out;pointer-events:none}.floating-label .input-element::placeholder{color:transparent}.floating-label .input-element:focus~.input-text__input-label,.floating-label .input-element:not(:placeholder-shown)~.input-text__input-label{top:0;font-size:0.62rem;color:var(--rebill-color-text-secondary);background-color:var(--rebill-color-background);padding:0 4px;left:0.75rem}.floating-label.has-left-icon .input-text__input-label{left:2.5rem}.input-element:disabled{color:var(--rebill-color-neutrals-500)}.input-wrapper:has(.input-element:disabled) .icon-left,.input-wrapper:has(.input-element:disabled) .icon-right{color:var(--rebill-color-text-secondary-light) !important}";
 
 const InputText = class {
     constructor(hostRef) {

package/dist/cjs/rebill-input-text.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"rebill-input-text.entry.cjs.js","sources":["src/components/shared/inputs/input-text/input-text.css?tag=rebill-input-text","src/components/shared/inputs/input-text/input-text.tsx"],"sourcesContent":["@import '../shared-input.css';\n\n.input-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.input-element {\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.icon-left,\n.icon-right {\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n.icon-left {\n  left: 0.75rem;\n  color: var(--rebill-color-text-secondary-light);\n}\n\n.icon-right {\n  right: 0.75rem;\n  cursor: pointer;\n  color: var(--rebill-color-text-secondary-light);\n}\n\n.input-element.input-error:focus {\n  flex-direction: column;\n  box-shadow: 0 0 0 2px var(--rebill-color-error-light);\n}\n\n/* Floating label styles */\n.floating-label {\n  position: relative;\n}\n\n.floating-label .input-text__input-label {\n  position: absolute;\n  top: 50%;\n  left: 0.75rem;\n  transform: translateY(-50%);\n  color: var(--rebill-color-text-secondary-light);\n  transition: all 0.1s ease-in-out;\n  pointer-events: none;\n}\n\n.floating-label .input-element::placeholder {\n  color: transparent;\n}\n\n.floating-label .input-element:focus ~ .input-text__input-label,\n.floating-label .input-element:not(:placeholder-shown) ~ .input-text__input-label {\n  top: 0;\n  font-size: 0.62rem;\n  color: var(--rebill-color-text-secondary);\n  background-color: var(--rebill-color-background);\n  padding: 0 4px;\n  left: 0.75rem;\n}\n\n.floating-label.has-left-icon .input-text__input-label {\n  left: 2.5rem;\n}\n\n/* Disabled state styles */\n.input-element:disabled {\n  color: var(--rebill-color-neutrals-500);\n}\n\n.input-wrapper:has(.input-element:disabled) .icon-left,\n.input-wrapper:has(.input-element:disabled) .icon-right {\n  color: var(--rebill-color-text-secondary-light) !important;\n}\n","import { Component, Element, Event, EventEmitter, Listen, Method, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'rebill-input-text',\n  styleUrl: 'input-text.css',\n  shadow: false,\n})\nexport class InputText {\n  @Element() el: HTMLElement;\n  private inputElement: HTMLInputElement;\n\n  /** Etiqueta que se muestra arriba del input */\n  @Prop() label: string = '';\n  /** Placeholder del input */\n  @Prop() placeholder: string = '';\n  /** Valor del input */\n  @Prop({ mutable: true, reflect: true }) value: string = '';\n  /** Mensaje de error */\n  @Prop() error: string = '';\n  /** ID del input */\n  @Prop() id: string = '';\n  /** Estado deshabilitado */\n  @Prop() disabled: boolean = false;\n  /** Icono a la izquierda */\n  @Prop() leftIcon: string;\n  /** Icono a la derecha */\n  @Prop() rightIcon: string;\n  /** Permitir limpiar el input */\n  @Prop() clearable: boolean = false;\n  /** Variacion de estilo del input */\n  @Prop() variant: 'default' | 'floating' = 'default';\n  /** Convertir texto a mayúsculas automáticamente */\n  @Prop() uppercase: boolean = false;\n  /** Evento al cambiar el valor */\n  @Event() input: EventEmitter<{ id: string; value: string }>;\n  /** Evento al hacer clic en el icono derecho */\n  @Event() rightIconClick: EventEmitter<{ id: string }>;\n  /** Evento al salir del input */\n  @Event() blur: EventEmitter<{ id: string; value: string }>;\n  @Listen('change', { target: 'document' })\n  handleFormChange(event: CustomEvent) {\n    const formData = event.detail;\n    if (formData && this.id in formData) {\n      this.value = formData[this.id];\n    }\n  }\n\n  private onInput = (event: Event) => {\n    if (this.disabled) return;\n    const input = event.target as HTMLInputElement;\n    let inputValue = input.value;\n\n    if (this.id === 'email') {\n      inputValue = inputValue.toLowerCase();\n      input.value = inputValue;\n    } else if (this.uppercase) {\n      inputValue = inputValue.toUpperCase();\n      input.value = inputValue;\n    }\n\n    this.value = inputValue;\n    this.input.emit({ id: this.id, value: this.value });\n  };\n\n  private onClear = () => {\n    if (this.disabled) return;\n    this.value = '';\n    this.input.emit({ id: this.id, value: this.value });\n  };\n\n  private onRightIconClick = () => {\n    if (this.disabled) return;\n    this.rightIconClick.emit({ id: this.id });\n  };\n\n  private onBlur = () => {\n    const trimmedValue = this.value.trim();\n\n    if (trimmedValue !== this.value) {\n      this.value = trimmedValue;\n      this.input.emit({ id: this.id, value: this.value });\n    }\n\n    this.blur.emit({ id: this.id, value: this.value });\n  };\n\n  @Method()\n  async getInputElement(): Promise<HTMLInputElement | null> {\n    return this.inputElement;\n  }\n\n  render() {\n    const isFloating = this.variant === 'floating';\n\n    const inputClasses = {\n      'input-element': true,\n      'input-error': !!this.error,\n    };\n\n    const wrapperClasses = {\n      'input-wrapper': true,\n      'floating-label': isFloating,\n      'has-left-icon': !!this.leftIcon,\n      'has-right-icon': !!this.rightIcon,\n    };\n\n    return (\n      <div class=\"input-container\">\n        {!isFloating && this.label && (\n          <label class={`input-label ${this.disabled ? 'disabled' : ''}`}>{this.label}</label>\n        )}\n        <div class={wrapperClasses}>\n          {this.leftIcon && (\n            <div class=\"icon-left\">\n              <rebill-icon name={this.leftIcon}></rebill-icon>\n            </div>\n          )}\n          <input\n            ref={el => (this.inputElement = el)}\n            type=\"text\"\n            class={inputClasses}\n            placeholder={isFloating ? this.label : this.placeholder}\n            value={this.value}\n            onInput={this.onInput}\n            onBlur={this.onBlur}\n            disabled={this.disabled}\n            style={{\n              paddingLeft: this.leftIcon ? '2.5rem' : '0.75rem',\n              paddingRight: this.clearable || this.rightIcon ? '2.5rem' : '0.75rem',\n            }}\n          />\n          {isFloating && <label class=\"input-text__input-label input-label\">{this.label}</label>}\n          {this.clearable && this.value && (\n            <div class=\"icon-right\" onClick={this.onClear}>\n              <rebill-icon name=\"x\"></rebill-icon>\n            </div>\n          )}\n          {this.rightIcon && !this.clearable && (\n            <div class=\"icon-right\" onClick={this.onRightIconClick}>\n              <rebill-icon name={this.rightIcon}></rebill-icon>\n            </div>\n          )}\n        </div>\n        {this.error && <span class=\"error-message\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"names":["h"],"mappings":"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"}
+{"version":3,"file":"rebill-input-text.entry.cjs.js","sources":["src/components/shared/inputs/input-text/input-text.css?tag=rebill-input-text","src/components/shared/inputs/input-text/input-text.tsx"],"sourcesContent":["@import '../shared-input.css';\n\n.input-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.input-element {\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.icon-left,\n.icon-right {\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n.icon-left {\n  left: 0.75rem;\n  color: var(--rebill-color-text-secondary-light);\n}\n\n.icon-right {\n  right: 0.75rem;\n  cursor: pointer;\n  color: var(--rebill-color-text-secondary-light);\n}\n\n.input-element.input-error:focus {\n  flex-direction: column;\n  box-shadow: 0 0 0 2px var(--rebill-color-error-light);\n}\n\n/* Floating label styles */\n.floating-label {\n  position: relative;\n}\n\n.floating-label .input-text__input-label {\n  position: absolute;\n  top: 50%;\n  left: 0.75rem;\n  transform: translateY(-50%);\n  color: var(--rebill-color-text-secondary-light);\n  transition: all 0.1s ease-in-out;\n  pointer-events: none;\n}\n\n.floating-label .input-element::placeholder {\n  color: transparent;\n}\n\n.floating-label .input-element:focus ~ .input-text__input-label,\n.floating-label .input-element:not(:placeholder-shown) ~ .input-text__input-label {\n  top: 0;\n  font-size: 0.62rem;\n  color: var(--rebill-color-text-secondary);\n  background-color: var(--rebill-color-background);\n  padding: 0 4px;\n  left: 0.75rem;\n}\n\n.floating-label.has-left-icon .input-text__input-label {\n  left: 2.5rem;\n}\n\n/* Disabled state styles */\n.input-element:disabled {\n  color: var(--rebill-color-neutrals-500);\n}\n\n.input-wrapper:has(.input-element:disabled) .icon-left,\n.input-wrapper:has(.input-element:disabled) .icon-right {\n  color: var(--rebill-color-text-secondary-light) !important;\n}\n","import { Component, Element, Event, EventEmitter, Listen, Method, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'rebill-input-text',\n  styleUrl: 'input-text.css',\n  shadow: false,\n})\nexport class InputText {\n  @Element() el: HTMLElement;\n  private inputElement: HTMLInputElement;\n\n  /** Etiqueta que se muestra arriba del input */\n  @Prop() label: string = '';\n  /** Placeholder del input */\n  @Prop() placeholder: string = '';\n  /** Valor del input */\n  @Prop({ mutable: true, reflect: true }) value: string = '';\n  /** Mensaje de error */\n  @Prop() error: string = '';\n  /** ID del input */\n  @Prop() id: string = '';\n  /** Estado deshabilitado */\n  @Prop() disabled: boolean = false;\n  /** Icono a la izquierda */\n  @Prop() leftIcon: string;\n  /** Icono a la derecha */\n  @Prop() rightIcon: string;\n  /** Permitir limpiar el input */\n  @Prop() clearable: boolean = false;\n  /** Variacion de estilo del input */\n  @Prop() variant: 'default' | 'floating' = 'default';\n  /** Convertir texto a mayúsculas automáticamente */\n  @Prop() uppercase: boolean = false;\n  /** Evento al cambiar el valor */\n  @Event() input: EventEmitter<{ id: string; value: string }>;\n  /** Evento al hacer clic en el icono derecho */\n  @Event() rightIconClick: EventEmitter<{ id: string }>;\n  /** Evento al salir del input */\n  @Event() blur: EventEmitter<{ id: string; value: string }>;\n  @Listen('change', { target: 'document' })\n  handleFormChange(event: CustomEvent) {\n    const formData = event.detail;\n    if (formData && this.id in formData) {\n      this.value = formData[this.id];\n    }\n  }\n\n  private onInput = (event: Event) => {\n    if (this.disabled) return;\n    const input = event.target as HTMLInputElement;\n    let inputValue = input.value;\n\n    if (this.id === 'email') {\n      inputValue = inputValue.toLowerCase();\n      input.value = inputValue;\n    } else if (this.uppercase) {\n      inputValue = inputValue.toUpperCase();\n      input.value = inputValue;\n    }\n\n    this.value = inputValue;\n    this.input.emit({ id: this.id, value: this.value });\n  };\n\n  private onClear = () => {\n    if (this.disabled) return;\n    this.value = '';\n    this.input.emit({ id: this.id, value: this.value });\n  };\n\n  private onRightIconClick = () => {\n    if (this.disabled) return;\n    this.rightIconClick.emit({ id: this.id });\n  };\n\n  private onBlur = () => {\n    const trimmedValue = this.value.trim();\n\n    if (trimmedValue !== this.value) {\n      this.value = trimmedValue;\n      this.input.emit({ id: this.id, value: this.value });\n    }\n\n    this.blur.emit({ id: this.id, value: this.value });\n  };\n\n  @Method()\n  async getInputElement(): Promise<HTMLInputElement | null> {\n    return this.inputElement;\n  }\n\n  render() {\n    const isFloating = this.variant === 'floating';\n\n    const inputClasses = {\n      'input-element': true,\n      'input-error': !!this.error,\n    };\n\n    const wrapperClasses = {\n      'input-wrapper': true,\n      'floating-label': isFloating,\n      'has-left-icon': !!this.leftIcon,\n      'has-right-icon': !!this.rightIcon,\n    };\n\n    return (\n      <div class=\"input-container\">\n        {!isFloating && this.label && (\n          <label class={`input-label ${this.disabled ? 'disabled' : ''}`}>{this.label}</label>\n        )}\n        <div class={wrapperClasses}>\n          {this.leftIcon && (\n            <div class=\"icon-left\">\n              <rebill-icon name={this.leftIcon}></rebill-icon>\n            </div>\n          )}\n          <input\n            ref={el => (this.inputElement = el)}\n            type=\"text\"\n            class={inputClasses}\n            placeholder={isFloating ? this.label : this.placeholder}\n            value={this.value}\n            onInput={this.onInput}\n            onBlur={this.onBlur}\n            disabled={this.disabled}\n            style={{\n              paddingLeft: this.leftIcon ? '2.5rem' : '0.75rem',\n              paddingRight: this.clearable || this.rightIcon ? '2.5rem' : '0.75rem',\n            }}\n          />\n          {isFloating && <label class=\"input-text__input-label input-label\">{this.label}</label>}\n          {this.clearable && this.value && (\n            <div class=\"icon-right\" onClick={this.onClear}>\n              <rebill-icon name=\"x\"></rebill-icon>\n            </div>\n          )}\n          {this.rightIcon && !this.clearable && (\n            <div class=\"icon-right\" onClick={this.onRightIconClick}>\n              <rebill-icon name={this.rightIcon}></rebill-icon>\n            </div>\n          )}\n        </div>\n        {this.error && <span class=\"error-message\">{this.error}</span>}\n      </div>\n    );\n  }\n}\n"],"names":["h"],"mappings":"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"}

package/dist/collection/components/checkout/rebill-checkout.js

@@ -324,6 +324,9 @@ export class RebillCheckout {
             GoogleMapsService.loadGoogleMapsScript();
             const response = await api.data.getCountries();
             this.countries = response.data;
+            if (this.parsedCustomerInformation) {
+                SessionStore.setUserInformation(this.parsedCustomerInformation);
+            }
             this.initialData = this.getInitialData();
             this.allRequiredFields = await getAllRequiredFields();
             if (this.filteredPaymentMethods.length > 0) {
@@ -892,8 +895,8 @@ export class RebillCheckout {
             label: country.country,
             value: country.isoCountryCode,
         }));
-        const renderRebillSummary = (props = {}) => (h("rebill-summary", { key: '889ee4307f38fbed3dd973d68d4e71979519b971', totalAmount: sessionState.data.pricing.total, currency: sessionState.data.pricing.currency, itemTitle: sessionState._session?.getTitle(), itemDescription: sessionState._session?.getDescription(), itemAmount: sessionState.data.pricing.subtotal, subtotal: sessionState.data.pricing.subtotal, allowCoupon: sessionState._session?.getAllowCoupon(this.displayConfig), currentBreakpoint: this.breakpoint, planFrequency: sessionState._session?.getPlanFrequency(), planFrequencyCount: sessionState._session?.getPlanFrequencyCount(), discountType: sessionState.data.discount.discountType, discountedPercentage: sessionState.data.discount.discountedPercentage, discountDuration: sessionState.data.discount.discountDuration, discountAmount: sessionState.data.discount.discountAmount, ...props }));
-        return (sessionState.isInitialized && (h(h.Fragment, null, this.showRefreshModal && h("rebill-modal-overlay", { key: 'ab3333710743b424ad676702aba95f4c2ea83f92' }), this.displayConfig.processingPayment && (h("rebill-processing-payment", { key: '30e84979156a983056fe59ed1d684dafc0adc1d9', style: { display: this.isCardSubmitting ? 'block' : 'none' } })), this.displayConfig.successPage &&
+        const renderRebillSummary = (props = {}) => (h("rebill-summary", { key: '16fdd9759135895d7c3a64441715df1a53d1d44f', totalAmount: sessionState.data.pricing.total, currency: sessionState.data.pricing.currency, itemTitle: sessionState._session?.getTitle(), itemDescription: sessionState._session?.getDescription(), itemAmount: sessionState.data.pricing.subtotal, subtotal: sessionState.data.pricing.subtotal, allowCoupon: sessionState._session?.getAllowCoupon(this.displayConfig), currentBreakpoint: this.breakpoint, planFrequency: sessionState._session?.getPlanFrequency(), planFrequencyCount: sessionState._session?.getPlanFrequencyCount(), discountType: sessionState.data.discount.discountType, discountedPercentage: sessionState.data.discount.discountedPercentage, discountDuration: sessionState.data.discount.discountDuration, discountAmount: sessionState.data.discount.discountAmount, ...props }));
+        return (sessionState.isInitialized && (h(h.Fragment, null, this.showRefreshModal && h("rebill-modal-overlay", { key: 'a015528effd8f661aac44f6bc692da7dc25693a0' }), this.displayConfig.processingPayment && (h("rebill-processing-payment", { key: '4213db86bc17a1e06972b8dce1b5c63da815ab30', style: { display: this.isCardSubmitting ? 'block' : 'none' } })), this.displayConfig.successPage &&
             this.isPaymentApproved() &&
             sessionState.isInitialized ? (h("success-page", { typePaymentMethod: sessionState.data.paymentMethodSelected, paymentMethodName: PaymentMethodMapper.mapToAPMPaymentMethod(sessionState.data.paymentMethodSelected ||
                 sessionState.data.payment?.paymentMethodType, sessionState.data?.pricing?.country), country: sessionState.data?.pricing?.country, bank: sessionState.data.payment?.paymentMethodMetadata?.bank ||