@crowdfarming/oliva-ds 1.75.0 → 1.76.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3861,7 +3861,7 @@ class InputSearchComponent {
3861
3861
  useExisting: forwardRef(() => InputSearchComponent),
3862
3862
  multi: true,
3863
3863
  },
3864
- ], ngImport: i0, template: "<div\n class=\"c-text-input\"\n [class.c-text-input--full-width]=\"fullWidth\"\n [class.c-text-input--with-clear-button]=\"clearButton\"\n>\n <lib-input-label\n *ngIf=\"label\"\n size=\"sm\"\n [required]=\"required\"\n [text]=\"label\"\n [textOptional]=\"optionalLabel\"\n [isLoading]=\"isLoading\"\n ></lib-input-label>\n\n <div class=\"c-text-input__wrapper\">\n <input\n type=\"search\"\n enterkeyhint=\"search\"\n inputmode=\"search\"\n [value]=\"isLoading ? '' : _value\"\n [placeholder]=\"isLoading ? '' : placeholder\"\n [disabled]=\"disabled || isLoading\"\n [class]=\"inputClass.join(' ')\"\n [attr.aria-invalid]=\"error ? 'true' : null\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n [required]=\"required\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur()\"\n [attr.aria-label]=\"label ? label : 'Search input'\"\n />\n <span class=\"c-text-input__icon\">\n <lib-icon\n name=\"magnifyingglass-regular\"\n size=\"md\"\n [color]=\"\n disabled || isLoading\n ? 'textfield-content-disabled'\n : 'textfield-content-placeholder'\n \"\n ></lib-icon>\n </span>\n\n <lib-button-icon\n *ngIf=\"clearButton && _value && !isLoading\"\n variant=\"neutral\"\n size=\"sm\"\n iconName=\"x-regular\"\n class=\"c-text-input__icon c-text-input__icon--right\"\n [disabled]=\"disabled || isLoading\"\n (clicked)=\"clearInput()\"\n ariaLabel=\"Limpiar\"\n ></lib-button-icon>\n </div>\n\n <span\n *ngIf=\"helperText && !error && !success\"\n id=\"search-input-helper\"\n class=\"c-text-input__helper\"\n >\n <lib-helper-text\n [text]=\"helperText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"alertText && error\" class=\"c-text-input__alert\">\n <lib-helper-text\n variant=\"danger\"\n [text]=\"alertText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"successText && success\" class=\"c-text-input__success\">\n <lib-helper-text\n variant=\"success\"\n [text]=\"successText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n</div>\n", styles: [".c-text-input{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--space-component-gap-sm);max-width:300px}.c-text-input--full-width{max-width:100%}.c-text-input__input{--input-padding-y: var(--space-component-padding-md);--input-padding-x-right: var(--space-component-padding-sm);--input-padding-x-left: 2rem;width:100%;height:48px;box-sizing:border-box;border-radius:var(--size-textfield-border-radius);border:var(--size-textfield-border-width) solid var(--color-textfield-border-default);background:var(--color-textfield-background-default);padding:var(--input-padding-y) var(--input-padding-x-right) var(--input-padding-y) var(--input-padding-x-left);align-items:center;gap:var(--space-component-gap-sm);align-self:stretch;color:var(--color-textfield-content-default);font-family:var(--typography-label-md-default-family);font-size:var(--typography-label-md-default-size);font-style:normal;font-weight:var(--typography-label-md-default-weight);line-height:var(--typography-label-md-default-line-height);letter-spacing:var(--typography-label-md-default-letter-spacing)}.c-text-input__input::-webkit-search-decoration,.c-text-input__input::-webkit-search-cancel-button,.c-text-input__input::-webkit-search-results-button,.c-text-input__input::-webkit-search-results-decoration{appearance:none;-webkit-appearance:none}.c-text-input__input::-ms-clear,.c-text-input__input::-ms-reveal{display:none;width:0;height:0}.c-text-input__input:focus-visible{border-width:2px;border-color:var(--color-textfield-border-active);padding:calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-right) - 1px) calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-left) - 1px);box-shadow:none;outline:none}.c-text-input__input--sm{height:32px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: 2rem}.c-text-input__input--md{height:40px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: 2rem}.c-text-input__input.is-error{border-color:var(--color-textfield-border-error)}.c-text-input__input.is-success{border-color:var(--color-feedback-success-strong)}.c-text-input__input.is-disabled{background-color:var(--color-textfield-background-disabled);border-color:var(--color-textfield-border-disabled);color:var(--color-textfield-content-disabled)}.c-text-input__input.is-loading{border-color:var(--color-effect-skeleton-soft, #e5eaea);background-color:var(--color-textfield-background-default);color:transparent}.c-text-input--with-clear-button .c-text-input__input{padding-right:2.5rem}.c-text-input__alert{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-danger-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__success{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-success-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper{color:var(--color-core-content-soft);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper.is-error{color:var(--color-textfield-helper-error)}.c-text-input__helper.is-success{color:var(--color-textfield-helper-success)}.c-text-input__helper.is-default{color:var(--color-textfield-helper-default)}.c-text-input__wrapper{display:flex;position:relative;width:100%}.c-text-input__icon{position:absolute;top:50%;left:var(--space-component-padding-sm);transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.c-text-input__icon--right{left:auto;right:var(--space-component-padding-sm)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: InputLabelComponent, selector: "lib-input-label", inputs: ["text", "required", "size", "disabled", "for", "innerHTML", "isLoading", "textOptional"] }, { kind: "component", type: IconComponent, selector: "lib-icon", inputs: ["size", "icon", "disabled", "name", "color"] }, { kind: "component", type: HelperTextComponent, selector: "lib-helper-text", inputs: ["variant", "text", "extraClass", "disabled", "isLoading"] }, { kind: "component", type: ButtonIconComponent, selector: "lib-button-icon", inputs: ["ariaLabel", "variant", "size", "iconName", "disabled", "loading", "skeletonActive"], outputs: ["clicked"] }] });
3864
+ ], ngImport: i0, template: "<div\n class=\"c-text-input\"\n [class.c-text-input--full-width]=\"fullWidth\"\n [class.c-text-input--with-clear-button]=\"clearButton\"\n>\n <lib-input-label\n *ngIf=\"label\"\n size=\"sm\"\n [required]=\"required\"\n [text]=\"label\"\n [textOptional]=\"optionalLabel\"\n [isLoading]=\"isLoading\"\n ></lib-input-label>\n\n <div class=\"c-text-input__wrapper\">\n <input\n type=\"search\"\n enterkeyhint=\"search\"\n inputmode=\"search\"\n [value]=\"isLoading ? '' : _value\"\n [placeholder]=\"isLoading ? '' : placeholder\"\n [disabled]=\"disabled || isLoading\"\n [class]=\"inputClass.join(' ')\"\n [attr.aria-invalid]=\"error ? 'true' : null\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n [required]=\"required\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur()\"\n [attr.aria-label]=\"label ? label : 'Search input'\"\n />\n <span class=\"c-text-input__icon\">\n <lib-icon\n name=\"magnifyingglass-regular\"\n size=\"md\"\n [color]=\"\n disabled || isLoading\n ? 'textfield-content-disabled'\n : 'textfield-content-placeholder'\n \"\n ></lib-icon>\n </span>\n\n <lib-button-icon\n *ngIf=\"clearButton && _value && !isLoading\"\n variant=\"neutral\"\n size=\"sm\"\n iconName=\"xcircle-regular\"\n class=\"c-text-input__icon c-text-input__icon--right\"\n [disabled]=\"disabled || isLoading\"\n (clicked)=\"clearInput()\"\n ariaLabel=\"Limpiar\"\n ></lib-button-icon>\n </div>\n\n <span\n *ngIf=\"helperText && !error && !success\"\n id=\"search-input-helper\"\n class=\"c-text-input__helper\"\n >\n <lib-helper-text\n [text]=\"helperText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"alertText && error\" class=\"c-text-input__alert\">\n <lib-helper-text\n variant=\"danger\"\n [text]=\"alertText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"successText && success\" class=\"c-text-input__success\">\n <lib-helper-text\n variant=\"success\"\n [text]=\"successText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n</div>\n", styles: [".c-text-input{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--space-component-gap-sm);max-width:300px}.c-text-input--full-width{max-width:100%}.c-text-input__input{--input-padding-y: var(--space-component-padding-md);--input-padding-x-right: var(--space-component-padding-sm);--input-padding-x-left: 2rem;width:100%;height:48px;box-sizing:border-box;border-radius:var(--size-textfield-border-radius);border:var(--size-textfield-border-width) solid var(--color-textfield-border-default);background:var(--color-textfield-background-default);padding:var(--input-padding-y) var(--input-padding-x-right) var(--input-padding-y) var(--input-padding-x-left);align-items:center;gap:var(--space-component-gap-sm);align-self:stretch;color:var(--color-textfield-content-default);font-family:var(--typography-label-md-default-family);font-size:var(--typography-label-md-default-size);font-style:normal;font-weight:var(--typography-label-md-default-weight);line-height:var(--typography-label-md-default-line-height);letter-spacing:var(--typography-label-md-default-letter-spacing)}.c-text-input__input::-webkit-search-decoration,.c-text-input__input::-webkit-search-cancel-button,.c-text-input__input::-webkit-search-results-button,.c-text-input__input::-webkit-search-results-decoration{appearance:none;-webkit-appearance:none}.c-text-input__input::-ms-clear,.c-text-input__input::-ms-reveal{display:none;width:0;height:0}.c-text-input__input:focus-visible{border-width:2px;border-color:var(--color-textfield-border-active);padding:calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-right) - 1px) calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-left) - 1px);box-shadow:none;outline:none}.c-text-input__input--sm{height:32px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: 2rem}.c-text-input__input--md{height:40px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: 2rem}.c-text-input__input.is-error{border-color:var(--color-textfield-border-error)}.c-text-input__input.is-success{border-color:var(--color-feedback-success-strong)}.c-text-input__input.is-disabled{background-color:var(--color-textfield-background-disabled);border-color:var(--color-textfield-border-disabled);color:var(--color-textfield-content-disabled)}.c-text-input__input.is-loading{border-color:var(--color-effect-skeleton-soft, #e5eaea);background-color:var(--color-textfield-background-default);color:transparent}.c-text-input--with-clear-button .c-text-input__input{padding-right:2.5rem}.c-text-input__alert{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-danger-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__success{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-success-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper{color:var(--color-core-content-soft);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper.is-error{color:var(--color-textfield-helper-error)}.c-text-input__helper.is-success{color:var(--color-textfield-helper-success)}.c-text-input__helper.is-default{color:var(--color-textfield-helper-default)}.c-text-input__wrapper{display:flex;position:relative;width:100%}.c-text-input__icon{position:absolute;top:50%;left:var(--space-component-padding-sm);transform:translateY(-50%);background:none;border:none;padding:0;display:flex;align-items:center}.c-text-input__icon--right{left:auto;right:var(--space-component-padding-sm)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: InputLabelComponent, selector: "lib-input-label", inputs: ["text", "required", "size", "disabled", "for", "innerHTML", "isLoading", "textOptional"] }, { kind: "component", type: IconComponent, selector: "lib-icon", inputs: ["size", "icon", "disabled", "name", "color"] }, { kind: "component", type: HelperTextComponent, selector: "lib-helper-text", inputs: ["variant", "text", "extraClass", "disabled", "isLoading"] }, { kind: "component", type: ButtonIconComponent, selector: "lib-button-icon", inputs: ["ariaLabel", "variant", "size", "iconName", "disabled", "loading", "skeletonActive"], outputs: ["clicked"] }] });
3865
3865
  }
3866
3866
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: InputSearchComponent, decorators: [{
3867
3867
  type: Component,
@@ -3878,7 +3878,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
3878
3878
  useExisting: forwardRef(() => InputSearchComponent),
3879
3879
  multi: true,
3880
3880
  },
3881
- ], template: "<div\n class=\"c-text-input\"\n [class.c-text-input--full-width]=\"fullWidth\"\n [class.c-text-input--with-clear-button]=\"clearButton\"\n>\n <lib-input-label\n *ngIf=\"label\"\n size=\"sm\"\n [required]=\"required\"\n [text]=\"label\"\n [textOptional]=\"optionalLabel\"\n [isLoading]=\"isLoading\"\n ></lib-input-label>\n\n <div class=\"c-text-input__wrapper\">\n <input\n type=\"search\"\n enterkeyhint=\"search\"\n inputmode=\"search\"\n [value]=\"isLoading ? '' : _value\"\n [placeholder]=\"isLoading ? '' : placeholder\"\n [disabled]=\"disabled || isLoading\"\n [class]=\"inputClass.join(' ')\"\n [attr.aria-invalid]=\"error ? 'true' : null\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n [required]=\"required\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur()\"\n [attr.aria-label]=\"label ? label : 'Search input'\"\n />\n <span class=\"c-text-input__icon\">\n <lib-icon\n name=\"magnifyingglass-regular\"\n size=\"md\"\n [color]=\"\n disabled || isLoading\n ? 'textfield-content-disabled'\n : 'textfield-content-placeholder'\n \"\n ></lib-icon>\n </span>\n\n <lib-button-icon\n *ngIf=\"clearButton && _value && !isLoading\"\n variant=\"neutral\"\n size=\"sm\"\n iconName=\"x-regular\"\n class=\"c-text-input__icon c-text-input__icon--right\"\n [disabled]=\"disabled || isLoading\"\n (clicked)=\"clearInput()\"\n ariaLabel=\"Limpiar\"\n ></lib-button-icon>\n </div>\n\n <span\n *ngIf=\"helperText && !error && !success\"\n id=\"search-input-helper\"\n class=\"c-text-input__helper\"\n >\n <lib-helper-text\n [text]=\"helperText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"alertText && error\" class=\"c-text-input__alert\">\n <lib-helper-text\n variant=\"danger\"\n [text]=\"alertText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"successText && success\" class=\"c-text-input__success\">\n <lib-helper-text\n variant=\"success\"\n [text]=\"successText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n</div>\n", styles: [".c-text-input{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--space-component-gap-sm);max-width:300px}.c-text-input--full-width{max-width:100%}.c-text-input__input{--input-padding-y: var(--space-component-padding-md);--input-padding-x-right: var(--space-component-padding-sm);--input-padding-x-left: 2rem;width:100%;height:48px;box-sizing:border-box;border-radius:var(--size-textfield-border-radius);border:var(--size-textfield-border-width) solid var(--color-textfield-border-default);background:var(--color-textfield-background-default);padding:var(--input-padding-y) var(--input-padding-x-right) var(--input-padding-y) var(--input-padding-x-left);align-items:center;gap:var(--space-component-gap-sm);align-self:stretch;color:var(--color-textfield-content-default);font-family:var(--typography-label-md-default-family);font-size:var(--typography-label-md-default-size);font-style:normal;font-weight:var(--typography-label-md-default-weight);line-height:var(--typography-label-md-default-line-height);letter-spacing:var(--typography-label-md-default-letter-spacing)}.c-text-input__input::-webkit-search-decoration,.c-text-input__input::-webkit-search-cancel-button,.c-text-input__input::-webkit-search-results-button,.c-text-input__input::-webkit-search-results-decoration{appearance:none;-webkit-appearance:none}.c-text-input__input::-ms-clear,.c-text-input__input::-ms-reveal{display:none;width:0;height:0}.c-text-input__input:focus-visible{border-width:2px;border-color:var(--color-textfield-border-active);padding:calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-right) - 1px) calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-left) - 1px);box-shadow:none;outline:none}.c-text-input__input--sm{height:32px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: 2rem}.c-text-input__input--md{height:40px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: 2rem}.c-text-input__input.is-error{border-color:var(--color-textfield-border-error)}.c-text-input__input.is-success{border-color:var(--color-feedback-success-strong)}.c-text-input__input.is-disabled{background-color:var(--color-textfield-background-disabled);border-color:var(--color-textfield-border-disabled);color:var(--color-textfield-content-disabled)}.c-text-input__input.is-loading{border-color:var(--color-effect-skeleton-soft, #e5eaea);background-color:var(--color-textfield-background-default);color:transparent}.c-text-input--with-clear-button .c-text-input__input{padding-right:2.5rem}.c-text-input__alert{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-danger-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__success{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-success-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper{color:var(--color-core-content-soft);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper.is-error{color:var(--color-textfield-helper-error)}.c-text-input__helper.is-success{color:var(--color-textfield-helper-success)}.c-text-input__helper.is-default{color:var(--color-textfield-helper-default)}.c-text-input__wrapper{display:flex;position:relative;width:100%}.c-text-input__icon{position:absolute;top:50%;left:var(--space-component-padding-sm);transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.c-text-input__icon--right{left:auto;right:var(--space-component-padding-sm)}\n"] }]
3881
+ ], template: "<div\n class=\"c-text-input\"\n [class.c-text-input--full-width]=\"fullWidth\"\n [class.c-text-input--with-clear-button]=\"clearButton\"\n>\n <lib-input-label\n *ngIf=\"label\"\n size=\"sm\"\n [required]=\"required\"\n [text]=\"label\"\n [textOptional]=\"optionalLabel\"\n [isLoading]=\"isLoading\"\n ></lib-input-label>\n\n <div class=\"c-text-input__wrapper\">\n <input\n type=\"search\"\n enterkeyhint=\"search\"\n inputmode=\"search\"\n [value]=\"isLoading ? '' : _value\"\n [placeholder]=\"isLoading ? '' : placeholder\"\n [disabled]=\"disabled || isLoading\"\n [class]=\"inputClass.join(' ')\"\n [attr.aria-invalid]=\"error ? 'true' : null\"\n [attr.aria-describedby]=\"ariaDescribedBy\"\n [required]=\"required\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur()\"\n [attr.aria-label]=\"label ? label : 'Search input'\"\n />\n <span class=\"c-text-input__icon\">\n <lib-icon\n name=\"magnifyingglass-regular\"\n size=\"md\"\n [color]=\"\n disabled || isLoading\n ? 'textfield-content-disabled'\n : 'textfield-content-placeholder'\n \"\n ></lib-icon>\n </span>\n\n <lib-button-icon\n *ngIf=\"clearButton && _value && !isLoading\"\n variant=\"neutral\"\n size=\"sm\"\n iconName=\"xcircle-regular\"\n class=\"c-text-input__icon c-text-input__icon--right\"\n [disabled]=\"disabled || isLoading\"\n (clicked)=\"clearInput()\"\n ariaLabel=\"Limpiar\"\n ></lib-button-icon>\n </div>\n\n <span\n *ngIf=\"helperText && !error && !success\"\n id=\"search-input-helper\"\n class=\"c-text-input__helper\"\n >\n <lib-helper-text\n [text]=\"helperText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"alertText && error\" class=\"c-text-input__alert\">\n <lib-helper-text\n variant=\"danger\"\n [text]=\"alertText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n\n <span *ngIf=\"successText && success\" class=\"c-text-input__success\">\n <lib-helper-text\n variant=\"success\"\n [text]=\"successText\"\n [isLoading]=\"isLoading\"\n ></lib-helper-text>\n </span>\n</div>\n", styles: [".c-text-input{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--space-component-gap-sm);max-width:300px}.c-text-input--full-width{max-width:100%}.c-text-input__input{--input-padding-y: var(--space-component-padding-md);--input-padding-x-right: var(--space-component-padding-sm);--input-padding-x-left: 2rem;width:100%;height:48px;box-sizing:border-box;border-radius:var(--size-textfield-border-radius);border:var(--size-textfield-border-width) solid var(--color-textfield-border-default);background:var(--color-textfield-background-default);padding:var(--input-padding-y) var(--input-padding-x-right) var(--input-padding-y) var(--input-padding-x-left);align-items:center;gap:var(--space-component-gap-sm);align-self:stretch;color:var(--color-textfield-content-default);font-family:var(--typography-label-md-default-family);font-size:var(--typography-label-md-default-size);font-style:normal;font-weight:var(--typography-label-md-default-weight);line-height:var(--typography-label-md-default-line-height);letter-spacing:var(--typography-label-md-default-letter-spacing)}.c-text-input__input::-webkit-search-decoration,.c-text-input__input::-webkit-search-cancel-button,.c-text-input__input::-webkit-search-results-button,.c-text-input__input::-webkit-search-results-decoration{appearance:none;-webkit-appearance:none}.c-text-input__input::-ms-clear,.c-text-input__input::-ms-reveal{display:none;width:0;height:0}.c-text-input__input:focus-visible{border-width:2px;border-color:var(--color-textfield-border-active);padding:calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-right) - 1px) calc(var(--input-padding-y) - 1px) calc(var(--input-padding-x-left) - 1px);box-shadow:none;outline:none}.c-text-input__input--sm{height:32px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: 2rem}.c-text-input__input--md{height:40px;--input-padding-y: var(--space-component-padding-xs);--input-padding-x-right: var(--space-component-padding-xs);--input-padding-x-left: 2rem}.c-text-input__input.is-error{border-color:var(--color-textfield-border-error)}.c-text-input__input.is-success{border-color:var(--color-feedback-success-strong)}.c-text-input__input.is-disabled{background-color:var(--color-textfield-background-disabled);border-color:var(--color-textfield-border-disabled);color:var(--color-textfield-content-disabled)}.c-text-input__input.is-loading{border-color:var(--color-effect-skeleton-soft, #e5eaea);background-color:var(--color-textfield-background-default);color:transparent}.c-text-input--with-clear-button .c-text-input__input{padding-right:2.5rem}.c-text-input__alert{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-danger-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__success{display:flex;gap:var(--space-component-gap-sm);color:var(--color-feedback-success-default);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper{color:var(--color-core-content-soft);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-style:normal;font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-text-input__helper.is-error{color:var(--color-textfield-helper-error)}.c-text-input__helper.is-success{color:var(--color-textfield-helper-success)}.c-text-input__helper.is-default{color:var(--color-textfield-helper-default)}.c-text-input__wrapper{display:flex;position:relative;width:100%}.c-text-input__icon{position:absolute;top:50%;left:var(--space-component-padding-sm);transform:translateY(-50%);background:none;border:none;padding:0;display:flex;align-items:center}.c-text-input__icon--right{left:auto;right:var(--space-component-padding-sm)}\n"] }]
3882
3882
  }], propDecorators: { label: [{
3883
3883
  type: Input
3884
3884
  }], placeholder: [{