@sapphire-ion/framework 1.0.11 → 1.0.13

package/lib/classes/environment.d.ts

@@ -2,6 +2,7 @@ import { Credentials } from "./credentials";
 import { ViewFiltros } from "./filters/view-filtros";
 import { PageOption } from "./page-option";
 export declare class Environment {
+    useFluentIcons: boolean;
     production: boolean;
     applicationName: string;
     apiUrl: string | null;
@@ -9,5 +10,5 @@ export declare class Environment {
     defaultPageLimits: PageOption[];
     get defaultPageLimit(): number | null;
     get defaultPaginationObject(): ViewFiltros;
-    constructor(production: boolean, applicationName: string, apiUrl: string, defaultCredentials?: Credentials, defaultPageLimits?: PageOption[]);
+    constructor(production: boolean, applicationName: string, apiUrl: string, defaultCredentials?: Credentials, defaultPageLimits?: PageOption[], useFluentIcons?: boolean);
 }

package/lib/components/default/default-view/default-view.component.d.ts

@@ -6,6 +6,7 @@ import { HttpServiceAtivo } from '../../../services/web/http.ativo.service';
 import { HttpService } from '../../../services/web/http.service';
 import { GenericService } from './../../../services/generics.service';
 import { View } from './view';
+import { InputType } from '../../inputs/input-type';
 import * as i0 from "@angular/core";
 /** Componente View Padão */
 export declare class DefaultViewComponent<T extends HttpService | HttpServiceAtivo> extends View<T> implements OnInit {
@@ -20,6 +21,7 @@ export declare class DefaultViewComponent<T extends HttpService | HttpServiceAti
     noNew: boolean;
     /** Remove os breadcrumbs da listagem */
     noBreadcrumbs: boolean;
+    InputType: typeof InputType;
     constructor(fb: FormBuilder, elementRef: ElementRef, activatedRoute: ActivatedRoute, genericService: GenericService, navController: NavController);
     static ɵfac: i0.ɵɵFactoryDeclaration<DefaultViewComponent<any>, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DefaultViewComponent<any>, "default-view", never, { "noBack": { "alias": "noBack"; "required": false; }; "noNew": { "alias": "noNew"; "required": false; }; "noBreadcrumbs": { "alias": "noBreadcrumbs"; "required": false; }; }, {}, never, never, false, never>;

package/lib/components/inputs/input-cep/input-cep.component.d.ts

@@ -0,0 +1,16 @@
+import { ElementRef } from '@angular/core';
+import { MaskitoMaskExpression, MaskitoOptions } from '@maskito/core';
+import { CustomInput } from '../custom-input';
+import * as i0 from "@angular/core";
+export declare class InputCepComponent extends CustomInput<string> {
+    protected elementRef: ElementRef<HTMLInputElement>;
+    input: ElementRef<HTMLInputElement>;
+    inputContainer: ElementRef<HTMLDivElement>;
+    focus(event: MouseEvent): void;
+    constructor(elementRef: ElementRef<HTMLInputElement>);
+    writeValue(obj: string): void | Promise<void>;
+    readonly cepMask: MaskitoMaskExpression;
+    readonly mask: MaskitoOptions;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputCepComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputCepComponent, "input-cep", never, {}, {}, never, never, false, never>;
+}

package/lib/components/inputs/input-cep/input-cep.configuration.d.ts

@@ -0,0 +1,5 @@
+export type CPFCnpj = 'CPF' | 'CNPJ' | 'CPFCNPJ';
+export declare class InputCpfCnpjConfiguration {
+    type: CPFCnpj;
+    constructor(type?: CPFCnpj);
+}

package/lib/components/inputs/input-color/input-color.component.d.ts

@@ -0,0 +1,77 @@
+import { ElementRef } from '@angular/core';
+import { CustomInput } from '../custom-input';
+import { GenericService } from '../../../services/generics.service';
+import { SIonPopoverComponent } from '../../popover/sion-popover/sion-popover.component';
+import { MaskitoOptions } from '@maskito/core';
+import * as i0 from "@angular/core";
+type RGB = {
+    r: number;
+    g: number;
+    b: number;
+};
+type HSL = {
+    h: number;
+    l: number;
+    s: number;
+};
+export declare class InputColorComponent extends CustomInput<string> {
+    private genericService;
+    input: ElementRef<HTMLInputElement>;
+    inputContainer: ElementRef<HTMLDivElement>;
+    focus(event: MouseEvent): void;
+    constructor(genericService: GenericService);
+    popover: SIonPopoverComponent;
+    rgbColor: RGB;
+    hslColor: HSL;
+    alpha: number;
+    writeValue(obj: string): void | Promise<void>;
+    SetValue(value: string): void;
+    rendering: boolean;
+    Present(event: MouseEvent): Promise<void>;
+    indicatorX: number;
+    indicatorY: number;
+    gradient: ElementRef<HTMLCanvasElement>;
+    private isGradientDragging;
+    private gradientCtx;
+    private gradientWidth;
+    private gradientHeight;
+    InitializeGradient(): void;
+    StartGradientDrag(e: MouseEvent): void;
+    GradientDrag(e: MouseEvent): void;
+    EndGradientDrag(): void;
+    HandleGradientTouch(e: TouchEvent): void;
+    HandleColorSelection(x: number, y: number): void;
+    UpdateSelectedColor(saturation?: number | null, lightness?: number | null, emitChanges?: boolean): void;
+    hueSlider: ElementRef<HTMLCanvasElement>;
+    private isHueDragging;
+    private hueCtx;
+    private hueSliderWidth;
+    private hueSliderHeight;
+    InitializeHueSlider(): void;
+    StartHueDrag(e: MouseEvent): void;
+    HueDrag(e: MouseEvent): void;
+    EndHueDrag(): void;
+    HandleHueTouch(e: TouchEvent): void;
+    HandleHueSelection(x: number): void;
+    alphaSlider: ElementRef<HTMLCanvasElement>;
+    private isAlphaDragging;
+    private alphaCtx;
+    private alphaSliderWidth;
+    private alphaSliderHeight;
+    InitializeAlphaSlider(): void;
+    StartAlphaDrag(e: MouseEvent): void;
+    AlphaDrag(e: MouseEvent): void;
+    EndAlphaDrag(): void;
+    HandleAlphaTouch(e: TouchEvent): void;
+    HandleAlphaSelection(x: number): void;
+    SetColorFromHex(hexColor: string, updateCanvas?: boolean, emitChanges?: boolean): void;
+    DrawColorGradient(): void;
+    DrawHueSlider(): void;
+    DrawAlphaSlider(): void;
+    CopyToClipboard(): Promise<void>;
+    UpdateIndicatorPositions(): void;
+    HEXMask: MaskitoOptions;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputColorComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputColorComponent, "input-color", never, {}, {}, never, never, false, never>;
+}
+export {};

package/lib/components/inputs/input-configuration.d.ts

@@ -5,4 +5,5 @@ import { InputStringConfiguration } from "./input-string/input-string.configurat
 import { InputBoolConfiguration } from "./input-bool/input-bool.configuration";
 import { InputDateConfiguration } from "./input-date/input-date.configuration";
 import { InputFileConfiguration } from "./input-file/input-file.configuration";
-export type InputConfiguration = InputFileConfiguration | InputSelectConfiguration | InputBoolConfiguration | InputDateConfiguration | InputDecimalConfiguration | InputNumberConfiguration | InputCurrencyConfiguration | InputCpfCnpjConfiguration | InputStringConfiguration | any;
+import { InputTelefoneCelularConfiguration } from "./input-telefone/input-telefone.configuration";
+export type InputConfiguration = InputBoolConfiguration | InputCpfCnpjConfiguration | InputDateConfiguration | InputDecimalConfiguration | InputCurrencyConfiguration | InputNumberConfiguration | InputFileConfiguration | InputSelectConfiguration | InputStringConfiguration | InputTelefoneCelularConfiguration | any;

package/lib/components/inputs/input-cpf-cnpj/input-cpf-cnpj.component.d.ts

@@ -11,6 +11,7 @@ export declare class InputCpfCnpjComponent extends CustomInput<string> {
     focus(event: MouseEvent): void;
     constructor(elementRef: ElementRef<HTMLInputElement>);
     writeValue(obj: string): void | Promise<void>;
+    SetValue(obj: string): void;
     readonly cpfMask: MaskitoMaskExpression;
     readonly cnpjMask: MaskitoMaskExpression;
     readonly mask: MaskitoOptions;

package/lib/components/inputs/input-icon/fluenticons.d.ts

@@ -0,0 +1 @@
+export declare const lstFluenticons: string[];

package/lib/components/inputs/input-icon/input-icon.component.d.ts

@@ -0,0 +1,20 @@
+import { ElementRef } from '@angular/core';
+import { CustomInput } from '../custom-input';
+import { EnvironmentService } from '../../../services/environment.service';
+import { InputSelectConfiguration } from '../input-select/input.select.configuration';
+import * as i0 from "@angular/core";
+export declare class InputIconComponent extends CustomInput<string> {
+    private environmentService;
+    lstIcons: {
+        name: string;
+    }[];
+    input: ElementRef<HTMLInputElement>;
+    inputContainer: ElementRef<HTMLDivElement>;
+    focus(event: MouseEvent): void;
+    config: InputSelectConfiguration;
+    constructor(environmentService: EnvironmentService);
+    writeValue(obj: string): void | Promise<void>;
+    SetValue(obj: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputIconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputIconComponent, "input-icon", never, {}, {}, never, never, false, never>;
+}

package/lib/components/inputs/input-icon/ionicons.d.ts

@@ -0,0 +1 @@
+export declare const lstIconsIonicons: string[];

package/lib/components/inputs/input-telefone/input-telefone.component.d.ts

@@ -0,0 +1,18 @@
+import { ElementRef, ModelSignal } from '@angular/core';
+import { MaskitoOptions } from '@maskito/core';
+import { InputTelefoneCelularConfiguration } from './input-telefone.configuration';
+import { CustomInput } from '../custom-input';
+import * as i0 from "@angular/core";
+export declare class InputTelefoneComponent extends CustomInput<string> {
+    protected elementRef: ElementRef<HTMLInputElement>;
+    configuration: ModelSignal<InputTelefoneCelularConfiguration>;
+    input: ElementRef<HTMLInputElement>;
+    inputContainer: ElementRef<HTMLDivElement>;
+    focus(event: MouseEvent): void;
+    constructor(elementRef: ElementRef<HTMLInputElement>);
+    writeValue(obj: string): void | Promise<void>;
+    SetValue(obj: string): void;
+    readonly mask: MaskitoOptions;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputTelefoneComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputTelefoneComponent, "input-telefone, input-celular, input-telefone-celular", never, { "configuration": { "alias": "configuration"; "required": false; "isSignal": true; }; }, { "configuration": "configurationChange"; }, never, never, false, never>;
+}

package/lib/components/inputs/input-telefone/input-telefone.configuration.d.ts

@@ -0,0 +1,9 @@
+export declare enum TelefoneCelular {
+    'Tel' = "Tel",
+    'Cel' = "Cel",
+    'TelCel' = "TelCel"
+}
+export declare class InputTelefoneCelularConfiguration {
+    type: TelefoneCelular;
+    constructor(type?: TelefoneCelular);
+}

package/lib/components/inputs/input-type.d.ts

@@ -1,16 +1,22 @@
 export declare enum InputType {
     Bool = "Bool",
-    Currency = "Currency",
+    Cep = "Cep",
+    Color = "Color",
+    CpfCnpj = "CpfCnpj",
+    Cpf = "Cpf",
+    Cnpj = "Cnpj",
     Date = "Date",
     DateTime = "DateTime",
     Time = "Time",
     Decimal = "Decimal",
+    Currency = "Currency",
     Number = "Number",
     File = "File",
-    String = "String",
-    TextArea = "TextArea",
+    Icon = "Icon",
     Select = "Select",
-    Cpf = "Cpf",
-    Cpnj = "Cnpj",
-    CpfCnpj = "CpfCnpj"
+    String = "String",
+    TelefoneCelular = "TelefoneCelular",
+    Telefone = "Telefone",
+    Celular = "Celular",
+    TextArea = "TextArea"
 }

package/lib/components/inputs/input-validators.d.ts

@@ -10,6 +10,12 @@ export declare class FormValidators {
     static CPFValidator(control: AbstractControl): ControlError | null;
     static CnpjValidator(control: AbstractControl): ControlError | null;
     static CPFCpnjValidator(control: AbstractControl): ControlError | null;
+    static readonly TelefoneError: ControlError;
+    static TelefoneValidator(control: AbstractControl): ControlError | null;
+    static readonly CelularError: ControlError;
+    static CelularValidator(control: AbstractControl): ControlError | null;
+    static readonly TelefoneCelularError: ControlError;
+    static TelefoneCelularValidator(control: AbstractControl): ControlError | null;
     static readonly PositiveNonZeroNumberError: ControlError;
     static PositiveNonZeroNumberValidator(fieldName: string): (control: AbstractControl) => ControlError | null;
     static readonly PositiveNumberError: ControlError;

package/lib/components/inputs/inputs.module.d.ts

@@ -1,26 +1,30 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./input-bool/input-bool.component";
-import * as i2 from "./input-cpf-cnpj/input-cpf-cnpj.component";
-import * as i3 from "./input-date/input-date.component";
-import * as i4 from "./input-decimal/input-decimal.component";
-import * as i5 from "./input-file/input-file.component";
-import * as i6 from "./input-select/input-select.component";
-import * as i7 from "./input-select/directives/sion-label-template.directive";
-import * as i8 from "./input-select/directives/sion-option-template.directive";
-import * as i9 from "./input-select/directives/sion-placeholder-template.directive";
-import * as i10 from "./input-string/input-string.component";
-import * as i11 from "./input-textarea/input-textarea.component";
-import * as i12 from "./input-file/download-button/download-button.component";
-import * as i13 from "@ionic/angular";
-import * as i14 from "@angular/common";
-import * as i15 from "@angular/forms";
-import * as i16 from "../image/image.component";
-import * as i17 from "@maskito/angular";
-import * as i18 from "../popover/sion-popover.module";
-import * as i19 from "../loading/loading.component";
-import * as i20 from "../../directives/ng-var.directive";
+import * as i2 from "./input-cep/input-cep.component";
+import * as i3 from "./input-color/input-color.component";
+import * as i4 from "./input-cpf-cnpj/input-cpf-cnpj.component";
+import * as i5 from "./input-date/input-date.component";
+import * as i6 from "./input-decimal/input-decimal.component";
+import * as i7 from "./input-file/input-file.component";
+import * as i8 from "./input-icon/input-icon.component";
+import * as i9 from "./input-select/input-select.component";
+import * as i10 from "./input-select/directives/sion-label-template.directive";
+import * as i11 from "./input-select/directives/sion-option-template.directive";
+import * as i12 from "./input-select/directives/sion-placeholder-template.directive";
+import * as i13 from "./input-string/input-string.component";
+import * as i14 from "./input-telefone/input-telefone.component";
+import * as i15 from "./input-textarea/input-textarea.component";
+import * as i16 from "./input-file/download-button/download-button.component";
+import * as i17 from "@ionic/angular";
+import * as i18 from "@angular/common";
+import * as i19 from "@angular/forms";
+import * as i20 from "../image/image.component";
+import * as i21 from "@maskito/angular";
+import * as i22 from "../popover/sion-popover.module";
+import * as i23 from "../loading/loading.component";
+import * as i24 from "../../directives/ng-var.directive";
 export declare class InputsModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<InputsModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<InputsModule, [typeof i1.InputBoolComponent, typeof i2.InputCpfCnpjComponent, typeof i3.InputDateComponent, typeof i4.InputDecimalComponent, typeof i5.InputFileComponent, typeof i6.InputSelectComponent, typeof i7.SIonLabelTemplateDirective, typeof i8.SIonOptionTemplateDirective, typeof i9.SIonPlaceholderTemplateDirective, typeof i10.InputStringComponent, typeof i11.InputTextareaComponent, typeof i12.DownloadButtonComponent], [typeof i13.IonicModule, typeof i14.CommonModule, typeof i15.ReactiveFormsModule, typeof i15.FormsModule, typeof i16.ImageComponent, typeof i17.MaskitoDirective, typeof i18.SIonPopoverModule, typeof i19.LoadingComponent, typeof i20.NgVarDirective], [typeof i1.InputBoolComponent, typeof i2.InputCpfCnpjComponent, typeof i3.InputDateComponent, typeof i4.InputDecimalComponent, typeof i5.InputFileComponent, typeof i6.InputSelectComponent, typeof i7.SIonLabelTemplateDirective, typeof i8.SIonOptionTemplateDirective, typeof i9.SIonPlaceholderTemplateDirective, typeof i10.InputStringComponent, typeof i11.InputTextareaComponent, typeof i12.DownloadButtonComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<InputsModule, [typeof i1.InputBoolComponent, typeof i2.InputCepComponent, typeof i3.InputColorComponent, typeof i4.InputCpfCnpjComponent, typeof i5.InputDateComponent, typeof i6.InputDecimalComponent, typeof i7.InputFileComponent, typeof i8.InputIconComponent, typeof i9.InputSelectComponent, typeof i10.SIonLabelTemplateDirective, typeof i11.SIonOptionTemplateDirective, typeof i12.SIonPlaceholderTemplateDirective, typeof i13.InputStringComponent, typeof i14.InputTelefoneComponent, typeof i15.InputTextareaComponent, typeof i16.DownloadButtonComponent], [typeof i17.IonicModule, typeof i18.CommonModule, typeof i19.ReactiveFormsModule, typeof i19.FormsModule, typeof i20.ImageComponent, typeof i21.MaskitoDirective, typeof i22.SIonPopoverModule, typeof i23.LoadingComponent, typeof i24.NgVarDirective], [typeof i1.InputBoolComponent, typeof i2.InputCepComponent, typeof i3.InputColorComponent, typeof i4.InputCpfCnpjComponent, typeof i5.InputDateComponent, typeof i6.InputDecimalComponent, typeof i7.InputFileComponent, typeof i8.InputIconComponent, typeof i9.InputSelectComponent, typeof i10.SIonLabelTemplateDirective, typeof i11.SIonOptionTemplateDirective, typeof i12.SIonPlaceholderTemplateDirective, typeof i13.InputStringComponent, typeof i14.InputTelefoneComponent, typeof i15.InputTextareaComponent, typeof i16.DownloadButtonComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<InputsModule>;
 }

package/lib/index.d.ts

@@ -54,6 +54,8 @@ export * from '../lib/components/image/image.component';
 export * from '../lib/components/info-popover/info-popover.component';
 export * from '../lib/components/inputs/input-bool/input-bool.component';
 export * from '../lib/components/inputs/input-bool/input-bool.configuration';
+export * from '../lib/components/inputs/input-cep/input-cep.component';
+export * from '../lib/components/inputs/input-color/input-color.component';
 export * from '../lib/components/inputs/input-cpf-cnpj/input-cpf-cnpj.component';
 export * from '../lib/components/inputs/input-cpf-cnpj/input-cpf-cnpj.configuration';
 export * from '../lib/components/inputs/input-date/input-date.component';
@@ -63,6 +65,7 @@ export * from '../lib/components/inputs/input-decimal/input-decimal.configuratio
 export * from '../lib/components/inputs/input-file/download-button/download-button.component';
 export * from '../lib/components/inputs/input-file/input-file.component';
 export * from '../lib/components/inputs/input-file/input-file.configuration';
+export * from '../lib/components/inputs/input-icon/input-icon.component';
 export * from '../lib/components/inputs/input-select/directives/sion-label-template.directive';
 export * from '../lib/components/inputs/input-select/directives/sion-option-template.directive';
 export * from '../lib/components/inputs/input-select/directives/sion-placeholder-template.directive';
@@ -70,6 +73,8 @@ export * from '../lib/components/inputs/input-select/input-select.component';
 export * from '../lib/components/inputs/input-select/input.select.configuration';
 export * from '../lib/components/inputs/input-string/input-string.component';
 export * from '../lib/components/inputs/input-string/input-string.configuration';
+export * from '../lib/components/inputs/input-telefone/input-telefone.component';
+export * from '../lib/components/inputs/input-telefone/input-telefone.configuration';
 export * from '../lib/components/inputs/input-textarea/input-textarea.component';
 export * from '../lib/components/inputs/input-configuration';
 export * from '../lib/components/inputs/input-default-configurations';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sapphire-ion/framework",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "private": false,
   "peerDependencies": {
     "@angular/common": "^18.2.8",
@@ -10,6 +10,7 @@
     "@maskito/angular": "^3.1.2",
     "@maskito/core": "^3.1.2",
     "@maskito/kit": "^3.1.0",
+    "@maskito/phone": "^3.1.0",
     "@ngx-translate/core": "^16.0.3",
     "jwt-decode": "^4.0.0",
     "@capawesome/capacitor-file-picker": "^7.0.1",

package/themes/compiled-styles.scss

@@ -672,6 +672,10 @@ video {
   bottom: 50%;
 }
 
+.bottom-2 {
+  bottom: 0.5rem;
+}
+
 .bottom-3 {
   bottom: 0.75rem;
 }
@@ -1039,6 +1043,11 @@ video {
   height: 1rem;
 }
 
+.size-5 {
+  width: 1.25rem;
+  height: 1.25rem;
+}
+
 .size-7 {
   width: 1.75rem;
   height: 1.75rem;
@@ -1134,10 +1143,6 @@ video {
   height: 2rem;
 }
 
-.h-\[12\.5rem\] {
-  height: 12.5rem;
-}
-
 .h-\[125\%\] {
   height: 125%;
 }
@@ -1835,10 +1840,6 @@ video {
   border-style: none;
 }
 
-.border-\[var\(--ion-color-step-250\)\] {
-  border-color: var(--ion-color-step-250);
-}
-
 .border-transparent {
   border-color: transparent;
 }
@@ -2324,10 +2325,6 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
 
-.\[--border-radius\:0rem_1rem_1rem_0rem\] {
-  --border-radius: 0rem 1rem 1rem 0rem;
-}
-
 .\[clip-path\:polygon\(0_20\%\2c _0\%_100\%\2c _80\%_100\%\)\] {
   clip-path: polygon(0 20%, 0% 100%, 80% 100%);
 }

package/themes/components/inputs/input-color/input-color.component.scss

@@ -0,0 +1,41 @@
+input:focus{
+    outline: solid 1px color-mix(in srgb, var(--ion-color-primary) 30%, transparent);
+}
+input{
+    @apply rounded h-5;
+    outline: 1px solid transparent;
+    transition-property: outline;
+    transition-duration: 0.2s;
+}
+
+.color-indicator {
+  position: absolute;
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  border: 2px solid white;
+  box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
+  transform: translate(-50%, -50%);
+  pointer-events: none;
+}
+
+.indicator {
+  position: absolute;
+  top: 50%;
+  width: 6px;
+  height: 24px;
+  background-color: white;
+  border-radius: 3px;
+  box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
+  transform: translate(-50%, -50%);
+  pointer-events: none;
+}
+
+.quick-transition{
+  transition: all 0.075s;
+}
+
+ion-popover{
+  --width: fit-content;
+  --height: fit-content;
+}

package/themes/components/_inputs_new/inputs.scss

@@ -1,15 +0,0 @@
-.input-container{
-  @apply rounded-lg flex flex-col pt-1 transition-all items-start justify-center border border-[var(--ion-color-step-250)];
-  background-color: color-mix(in srgb, var(--ion-color-dark) 3%, transparent);
-  .input-label{
-    @apply text-white text-sm mx-1.5;
-  }
-  input{
-    @apply outline-none rounded-md px-1.5;
-  }
-}
-.input-container:focus-within{
-  @apply outline outline-1;
-  outline-color: color-mix(in srgb, var(--ion-color-primary) 30%, transparent);
-  box-shadow: 0 0 1px 2px color-mix(in srgb, var(--ion-color-primary) 50%, transparent);
-}

package/themes/components/inputs_old/input-color/input-color.component.scss

@@ -1,48 +0,0 @@
-input:focus{
-    outline: solid 1px color-mix(in srgb, var(--ion-color-primary) 30%, transparent);
-}
-input{
-    @apply rounded h-5;
-    outline: 1px solid transparent;
-    transition-property: outline;
-    transition-duration: 0.2s;
-}
-input::-webkit-outer-spin-button,
-input::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-}
-input[type='number'] {
-    -moz-appearance:textfield;
-}
-
-
-.color-indicator {
-    position: absolute;
-    width: 12px;
-    height: 12px;
-    border-radius: 50%;
-    border: 2px solid white;
-    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
-    transform: translate(-50%, -50%);
-    pointer-events: none;
-}
-
-.indicator {
-    position: absolute;
-    top: 50%;
-    width: 6px;
-    height: 24px;
-    background-color: white;
-    border-radius: 3px;
-    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
-    transform: translate(-50%, -50%);
-    pointer-events: none;
-  }
-
-.quick-transition{
-    transition: all 0.075s;
-}
-ion-popover{
-  --width: fit-content;
-  --height: fit-content;
-}

package/themes/components/inputs_old/inputs.scss

@@ -1,67 +0,0 @@
-$ion-border-base     : color-mix(in srgb, var(--ion-color-medium) 30%, transparent 70%);
-$ion-border-contrast : var(--ion-color-medium);
-$ion-border-invalid  : color-mix(in srgb, var(--ion-color-danger) 75%, transparent 25%);
-
-$input-height: 58px;
-
-.on-hover{
-  background: color-mix(in srgb, var(--ion-color-light) 97%, transparent 3%);
-  &:hover{
-    @apply transition-all ease-in-out duration-300;
-    background: color-mix(in srgb, var(--ion-color-dark) 15%, transparent 93%);
-  }
-}
-
-ion-card.ion-card-input{
-  @apply rounded-2xl w-full h-full flex justify-center items-center transition-all ease-in-out duration-300 m-0 overflow-hidden shadow-none;
-  background: color-mix(in srgb, var(--ion-color-light) 97%, transparent 3%);
-  &:hover{
-      background: color-mix(in srgb, var(--ion-color-dark) 15%, transparent 93%);
-  }
-  border-bottom-color: $ion-border-contrast;
-  border-right-color : $ion-border-base;
-  border-top-color   : $ion-border-base;
-  border-left-color  : $ion-border-base;
-  
-  border-width: 1px 1px 2px 1px;
-  &.submitted.invalid{
-    border-color: $ion-border-invalid !important;
-  }
-  &.disabled{
-    background-color: color-mix(in srgb, var(--ion-color-medium) 30%, transparent 70%) !important; 
-  }
-  ion-card-content{ @apply size-full bg-transparent p-0; }
-
-  min-height: $input-height;
-  max-height: $input-height;
-  height: $input-height;
-}
-ion-item{
-  --background: transparent;
-}
-
-ion-text#label{
-  &.required{
-      &::after {
-          content: "*";
-          color: var(--ion-color-danger);
-          vertical-align: text-bottom;
-          font-size: small;
-      }
-  }
-  &:not(.required)::after{ 
-      content: var(--input-opcional-label, "(Opcional)");
-      color: var(--ion-color-medium);
-      vertical-align: text-bottom;
-      font-size: small;
-  }
-}
-
-.on-focus{
-  border-bottom-color: var(--ion-color-primary);
-}
-.focus-within\:on-focus{
-  &:focus-within{
-    border-bottom-color: var(--ion-color-primary);
-  }
-}