@sapphire-ion/framework 1.0.32 → 1.0.34

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

@@ -1,6 +1,6 @@
 import { AfterViewInit, ElementRef, InputSignal, ModelSignal, Signal, TemplateRef, WritableSignal } from '@angular/core';
 import { FormControl } from '@angular/forms';
-import { IonModal } from '@ionic/angular';
+import { InfiniteScrollCustomEvent, IonContent, IonModal } from '@ionic/angular';
 import { InputSelectConfiguration } from './input.select.configuration';
 import { SIonPopoverComponent } from '../../popover/sion-popover/sion-popover.component';
 import { CustomInput } from '../custom-input';
@@ -19,6 +19,8 @@ export declare class InputSelectComponent<T = any> extends CustomInput<T | T[]>
     SetCurrentItemLabel(): void;
     lstOptionsItemValue: Signal<ItemValue<any>[]>;
     lstOptions: ItemValue<any>[];
+    infiniteScrollPage: WritableSignal<number>;
+    AddPage(event: InfiniteScrollCustomEvent): void;
     UpdateLstOptions(search: string): void;
     UpdateSelected(): void;
     labelTemplate: TemplateRef<LabelTemplateContext<T>>;
@@ -50,6 +52,7 @@ export declare class InputSelectComponent<T = any> extends CustomInput<T | T[]>
     popover: SIonPopoverComponent;
     modal: IonModal;
     floatingVisible: boolean;
+    ionContent: IonContent;
     Present(event: Event): Promise<void>;
     Dismiss(): Promise<void>;
     OnDismiss(): void;

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

@@ -28,6 +28,24 @@ export declare class InputSelectConfiguration {
     multiple: boolean;
     /** Desativa os items que estão de acordo com a função */
     disableConditional: ((obj: any) => boolean) | null;
+    static Create(options: {
+        bindLabel: string | ((obj: any) => string);
+        bindValue: string | ((obj: any) => any);
+        clearable?: boolean;
+        searcheable?: boolean;
+        loadFrom?: HttpService | Observable<ViewRetorno> | any[];
+        multiple?: boolean;
+        vFiltros?: Partial<{
+            search: string;
+            orderByProperty: string;
+            ascending: boolean;
+            filter: Comparison[];
+        }>;
+        disableConditional?: ((obj: any) => boolean);
+        useInfiniteScroll?: boolean;
+        placeholder?: string;
+        noItensFoundText?: string;
+    }): InputSelectConfiguration;
     placeholder: string;
     noItensFoundText: string;
     loader: InputSelectDataLoader;
@@ -39,6 +57,7 @@ export declare class InputSelectConfiguration {
         placement: Placement;
     };
     vFiltros: ViewFiltros | null;
+    useInfiniteScroll: boolean;
     constructor(
     /** Valor que será setado no formControl */
     bindValue?: string | ((obj: any) => any), 

package/lib/components/popover/sion-popover/sion-popover.component.d.ts

@@ -1,8 +1,8 @@
-import { ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, QueryList, TemplateRef, ViewContainerRef } from '@angular/core';
+import { ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, TemplateRef, ViewContainerRef, ViewRef } from '@angular/core';
 import { ComputePositionReturn, Placement } from '@floating-ui/dom';
 import * as i0 from "@angular/core";
 type Fill = 'solid' | 'outline' | 'blur' | 'clear';
-export declare class SIonPopoverComponent implements OnDestroy, OnInit {
+export declare class SIonPopoverComponent implements OnInit, OnDestroy {
     private viewContainerRef;
     private ngZone;
     fill: Fill;
@@ -20,21 +20,29 @@ export declare class SIonPopoverComponent implements OnDestroy, OnInit {
     popoverTemplate: TemplateRef<any>;
     contentContainer: ElementRef<HTMLDivElement>;
     arrowElement: ElementRef<HTMLElement>;
-    contentChildren: QueryList<any>;
-    isVisible: boolean;
+    ngOnInit(): void;
+    documentClickListener: (event: MouseEvent) => void;
+    viewRef?: ViewRef;
+    private _embeddedView?;
+    CreateEmbeddedView(): void;
+    private _instance?;
+    CreateInstance(): void;
+    get arrowEl(): HTMLElement | undefined;
     private cleanupAutoUpdate?;
-    private popoverInstance?;
-    isVisibleChange: EventEmitter<boolean>;
-    private lock;
+    state: POPOVER_STATE;
     present(event?: Event): Promise<void>;
-    GetComputePositionReturn(refEl: HTMLElement, popEl: HTMLElement, arrowEl: HTMLElement): Promise<ComputePositionReturn>;
-    private CreatePopoverInBody;
-    onClick(event: MouseEvent): void;
-    documentClickListener: (event: MouseEvent) => void;
-    ngOnInit(): void;
+    private update;
     dismiss(): Promise<void>;
+    HandleComputePositionReturn(computePositionReturn: ComputePositionReturn, arrowEl: HTMLElement): void;
     ngOnDestroy(): void;
+    GetComputePositionReturn(refEl: HTMLElement, popEl: HTMLElement, arrowEl: HTMLElement): Promise<ComputePositionReturn>;
     static ɵfac: i0.ɵɵFactoryDeclaration<SIonPopoverComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SIonPopoverComponent, "sion-popover", never, { "fill": { "alias": "fill"; "required": false; }; "arrow": { "alias": "arrow"; "required": false; }; "flip": { "alias": "flip"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "height": { "alias": "height"; "required": false; }; "width": { "alias": "width"; "required": false; }; "anchor": { "alias": "anchor"; "required": false; }; }, { "onWillPresent": "onWillPresent"; "onDidPresent": "onDidPresent"; "onWillDismiss": "onWillDismiss"; "onDidDismiss": "onDidDismiss"; "isVisibleChange": "isVisibleChange"; }, ["contentChildren"], ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SIonPopoverComponent, "sion-popover", never, { "fill": { "alias": "fill"; "required": false; }; "arrow": { "alias": "arrow"; "required": false; }; "flip": { "alias": "flip"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "height": { "alias": "height"; "required": false; }; "width": { "alias": "width"; "required": false; }; "anchor": { "alias": "anchor"; "required": false; }; }, { "onWillPresent": "onWillPresent"; "onDidPresent": "onDidPresent"; "onWillDismiss": "onWillDismiss"; "onDidDismiss": "onDidDismiss"; }, never, ["*"], false, never>;
+}
+declare enum POPOVER_STATE {
+    IDLE = 1,
+    PRESENTING = 2,
+    DISMISSING = 3,
+    VISIBLE = 4
 }
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sapphire-ion/framework",
-  "version": "1.0.32",
+  "version": "1.0.34",
   "private": false,
   "peerDependencies": {
     "@angular/common": "^18.2.8",

package/themes/components/popover/sion-popover/sion-popover.component.scss

@@ -3,8 +3,14 @@
   width: max-content;
   position: absolute;
   will-change: left, top, bottom, right, auto, opacity, filter;
-  transition: opacity, transform, filter 0.2s ease-in-out;
-  display: none;
+  opacity: 0;
+  transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out, filter 0.15s ease-in-out;
+  // display: none;
+  min-width: 2rem;
+  min-height: 2rem;
+
+  filter: grayscale(0.9); 
+  transform: scale(0.95);
 }
 .popover-arrow{
   @apply rounded-sm;
@@ -12,35 +18,11 @@
   transform: scale(1) rotate(var(--rotation)) !important;	
   clip-path: var(--clip-path-triangle, polygon(0% 0%,0% 100%,100% 100%));
 }
-.visible-anim {
-  animation: visible 0.2s ease-in-out forwards;
+.show {
+  filter: grayscale(0); 
+  transform: scale(1);
+  opacity: 1;
 }
-.invisible-anim {
+.popover-wrapper:not(.show) {
   pointer-events: none;
-  animation: invisible 0.2s ease-in-out forwards;
-  opacity: 0;
-}
-@keyframes visible {
-  from { 
-    opacity: 0 !important;
-    filter: grayscale(0.9);
-    transform: scale(0.95);
-  } 
-  to { 
-    opacity: 1 !important;
-    filter: grayscale(0);
-    transform: scale(1);
-  }
-}
-@keyframes invisible {
-  from { 
-    opacity: 1;
-    filter: grayscale(0);
-    transform: scale(1);
-  }
-  to { 
-    opacity: 0 !important;
-    filter: grayscale(0.9); 
-    transform: scale(0.95);
-  }
-}
+}