@koalarx/ui 20.0.41 → 20.0.43

package/core/base/index.d.ts

@@ -38,6 +38,7 @@ declare abstract class HttpBase<EntityType = any, PayloadType = any, QueryType =
 
 declare abstract class ListBase<QueryType extends QueryPagination, TEntity = any> {
     protected readonly componentFilter?: Type<any> | undefined;
+    private reloading;
     protected readonly resourceRef: HttpResourceRef<GetManyResult<TEntity> | undefined>;
     protected readonly limitPage: _angular_core.WritableSignal<number>;
     protected readonly page: _angular_core.WritableSignal<number>;
@@ -47,11 +48,13 @@ declare abstract class ListBase<QueryType extends QueryPagination, TEntity = any
     protected readonly totalItems: _angular_core.WritableSignal<number>;
     protected readonly list: _angular_core.WritableSignal<TEntity[]>;
     protected readonly sortFilter: _angular_core.WritableSignal<SortFilterType | null>;
+    protected readonly withPagination: _angular_core.WritableSignal<boolean>;
     queryParams: _angular_core.Signal<QueryType>;
     reload: _angular_core.InputSignal<boolean>;
     constructor(resource: Type<HttpBase<TEntity, any, QueryType>>, componentFilter?: Type<any> | undefined);
     protected sort(sortFilter: SortFilterType): void;
     protected reloadList(): void;
+    protected loadMore(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ListBase<any, any>, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ListBase<any, any>, never, never, { "reload": { "alias": "reload"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/core/translations/index.d.ts

@@ -29,6 +29,8 @@ interface Translation {
         addFilterTooltip: string;
         reloadListTooltip: string;
         labelItemsPerPage: string;
+        loadMoreBtnLabel: string;
+        paginatorPagesFeedback: (currentPage: number, lastPage: number) => string;
     };
     feedbackRequestInterceptor: {
         '400': string;

package/fesm2022/koalarx-ui-core-base.mjs

@@ -87,6 +87,7 @@ class HttpBase {
 
 class ListBase {
     componentFilter;
+    reloading = false;
     resourceRef;
     limitPage = signal(30);
     page = signal(1);
@@ -96,6 +97,7 @@ class ListBase {
     totalItems = signal(0);
     list = signal([]);
     sortFilter = signal(null);
+    withPagination = signal(true);
     queryParams = computed(() => ({
         page: this.page(),
         limit: this.limitPage(),
@@ -112,16 +114,28 @@ class ListBase {
         this.resource = inject(resource);
         this.resourceRef = this.resource.getManyWithResource(this.queryParams);
         effect(() => {
+            const withPagination = this.withPagination();
             const result = this.resourceRef.value();
+            if (!withPagination && !this.reloading) {
+                if (result) {
+                    this.list.update((current) => [...current, ...result.items]);
+                    this.totalItemsOnPage.update((current) => current + result.items.length);
+                    this.totalItems.set(result.count);
+                }
+                this.reloading = false;
+                return;
+            }
             if (!result) {
                 this.list.set([]);
                 this.totalItemsOnPage.set(0);
                 this.totalItems.set(0);
+                this.reloading = false;
                 return;
             }
             this.list.set(result.items);
             this.totalItemsOnPage.set(result.items.length);
             this.totalItems.set(result.count);
+            this.reloading = false;
         });
         effect(() => {
             if (this.reload()) {
@@ -133,8 +147,16 @@ class ListBase {
         this.sortFilter.set(sortFilter);
     }
     reloadList() {
+        this.reloading = true;
+        this.list.set([]);
+        this.totalItemsOnPage.set(0);
+        this.totalItems.set(0);
+        this.page.set(1);
         this.resourceRef.reload();
     }
+    loadMore() {
+        this.page.update((current) => current + 1);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ListBase, deps: [{ token: i0.Type }, { token: i0.Type }], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.6", type: ListBase, isStandalone: true, inputs: { reload: { classPropertyName: "reload", publicName: "reload", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
 }

package/fesm2022/koalarx-ui-core-base.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"koalarx-ui-core-base.mjs","sources":["../../projects/koala-ui/core/base/http-base.ts","../../projects/koala-ui/core/base/list-base.ts","../../projects/koala-ui/core/base/page-base.ts","../../projects/koala-ui/core/base/koalarx-ui-core-base.ts"],"sourcesContent":["import { HttpClient, httpResource } from '@angular/common/http';\nimport { inject, Injector, Signal } from '@angular/core';\nimport { rxResource } from '@angular/core/rxjs-interop';\nimport { AppConfig } from '@koalarx/ui/core/config';\nimport { GetManyResult } from '@koalarx/ui/core/models';\nimport { AutocompleteOption } from '@koalarx/ui/shared/components/input-field/autocomplete';\nimport { SelectOption } from '@koalarx/ui/shared/components/input-field/select';\nimport { first } from 'rxjs/internal/operators/first';\nimport { map } from 'rxjs/internal/operators/map';\n\nexport interface HttpResourceRequestOptions<EntityType> {\n  debounceTime?: number;\n  endpoint?: string;\n  mapOption?: (\n    item: any\n  ) => Omit<\n    | AutocompleteOption<EntityType>\n    | SelectOption<EntityType>\n    | GetManyResult<EntityType>,\n    'data'\n  >;\n}\n\nexport abstract class HttpBase<\n  EntityType = any,\n  PayloadType = any,\n  QueryType = any\n> {\n  private readonly appConfig = inject(AppConfig);\n  protected readonly injector = inject(Injector);\n  protected readonly http = inject(HttpClient);\n  protected readonly url: string;\n  protected readonly hostApi: string;\n\n  constructor(protected readonly resource: string, hostApi?: string) {\n    this.hostApi = hostApi || this.appConfig.hostApi || '';\n    this.url = `${this.hostApi}/${this.resource}`;\n  }\n\n  post<T>(data: PayloadType, endpoint = '') {\n    return this.http.post<T>(`${this.url}${endpoint}`, data).pipe(first());\n  }\n\n  put<T>(id: string, data: PayloadType) {\n    return this.http.put<T>(`${this.url}/${id}`, data).pipe(first());\n  }\n\n  patch<T>(id: string, data: any) {\n    return this.http.patch<T>(`${this.url}/${id}`, data).pipe(first());\n  }\n\n  delete<T>(id: string) {\n    return this.http.delete<T>(`${this.url}/${id}`).pipe(first());\n  }\n\n  getMany<TResponse = EntityType>(query: QueryType, endpoint = '') {\n    return this.http.get<GetManyResult<TResponse>>(`${this.url}${endpoint}`, {\n      params: query as any,\n    });\n  }\n\n  getById<TResponse = EntityType>(id: string | null) {\n    return this.http.get<TResponse>(`${this.url}/${id}`);\n  }\n\n  getManyWithResource<TResponse = EntityType>(\n    query: Signal<QueryType>,\n    {\n      endpoint = '',\n      mapOption,\n    }: Omit<HttpResourceRequestOptions<TResponse>, 'debounceTime'> = {}\n  ) {\n    return httpResource<GetManyResult<TResponse>>(\n      () => {\n        return {\n          url: `${this.url}${endpoint}`,\n          params: query() as any,\n        };\n      },\n      {\n        parse: mapOption as (data: any) => any,\n      }\n    );\n  }\n\n  getByIdWithResource<TResponse = EntityType>(\n    id: Signal<string | null>,\n    endpoint = ':id',\n    mapResponse?: (response: TResponse) => TResponse\n  ) {\n    return httpResource<TResponse>(\n      () => {\n        const resourceId = id();\n\n        if (!resourceId) {\n          return undefined;\n        }\n\n        return `${this.url}/${endpoint.replace(':id', resourceId)}`;\n      },\n      {\n        parse: mapResponse as (resume: any) => TResponse,\n      }\n    );\n  }\n\n  getByOneWithResource<TResponse = EntityType>(\n    endpoint: Signal<string | null>,\n    params?: Signal<any>,\n    mapResponse?: (response: TResponse) => TResponse\n  ) {\n    return httpResource<TResponse>(\n      () => {\n        const resourceUrl = endpoint();\n\n        if (!resourceUrl) {\n          return undefined;\n        }\n\n        return {\n          url: `${this.url}/${resourceUrl}`,\n          params: params ? params() : undefined,\n        };\n      },\n      {\n        parse: mapResponse as (resume: any) => TResponse,\n      }\n    );\n  }\n\n  getManyForSelector<TResponse = EntityType>(\n    query: QueryType | Signal<QueryType>,\n    mapOption: (\n      item: TResponse\n    ) => Omit<AutocompleteOption<TResponse> | SelectOption<TResponse>, 'data'>\n  ) {\n    return rxResource({\n      defaultValue: [],\n      params: () => (query instanceof Function ? query() : query),\n      stream: (data) =>\n        this.getMany<TResponse>(data.params).pipe(\n          map((response) =>\n            response.items.map((item) => ({\n              ...mapOption(item),\n              data: item,\n            }))\n          )\n        ),\n    });\n  }\n}\n","import { HttpResourceRef } from '@angular/common/http';\nimport {\n  computed,\n  Directive,\n  effect,\n  inject,\n  input,\n  signal,\n  Type,\n} from '@angular/core';\nimport {\n  GetManyResult,\n  QueryPagination,\n  SortFilterType,\n} from '@koalarx/ui/core/models';\nimport { HttpBase } from './http-base';\n\n@Directive()\nexport abstract class ListBase<\n  QueryType extends QueryPagination,\n  TEntity = any\n> {\n  protected readonly resourceRef: HttpResourceRef<\n    GetManyResult<TEntity> | undefined\n  >;\n  protected readonly limitPage = signal(30);\n  protected readonly page = signal(1);\n  protected readonly filter = signal<QueryType>({} as any);\n  protected readonly resource: HttpBase<TEntity, any, QueryType>;\n  protected readonly totalItemsOnPage = signal(0);\n  protected readonly totalItems = signal(0);\n  protected readonly list = signal<TEntity[]>([]);\n  protected readonly sortFilter = signal<SortFilterType | null>(null);\n\n  queryParams = computed<QueryType>(\n    () =>\n      ({\n        page: this.page(),\n        limit: this.limitPage(),\n        ...(this.sortFilter() ?? {}),\n        ...this.filter(),\n      } as QueryType)\n  );\n  reload = input<boolean>(false);\n\n  constructor(\n    // eslint-disable-next-line @angular-eslint/prefer-inject\n    resource: Type<HttpBase<TEntity, any, QueryType>>,\n    // eslint-disable-next-line @angular-eslint/prefer-inject\n    protected readonly componentFilter?: Type<any>\n  ) {\n    this.resource = inject(resource);\n    this.resourceRef = this.resource.getManyWithResource(this.queryParams);\n\n    effect(() => {\n      const result = this.resourceRef.value();\n\n      if (!result) {\n        this.list.set([]);\n        this.totalItemsOnPage.set(0);\n        this.totalItems.set(0);\n        return;\n      }\n\n      this.list.set(result.items);\n      this.totalItemsOnPage.set(result.items.length);\n      this.totalItems.set(result.count);\n    });\n\n    effect(() => {\n      if (this.reload()) {\n        this.reloadList();\n      }\n    });\n  }\n\n  protected sort(sortFilter: SortFilterType) {\n    this.sortFilter.set(sortFilter);\n  }\n\n  protected reloadList() {\n    this.resourceRef.reload();\n  }\n}\n","import { signal } from '@angular/core';\n\nexport abstract class PageBase {\n  protected reload = signal(false);\n\n  protected reloadList() {\n    this.reload.set(true);\n    setTimeout(() => this.reload.set(false));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"koalarx-ui-core-base.mjs","sources":["../../projects/koala-ui/core/base/http-base.ts","../../projects/koala-ui/core/base/list-base.ts","../../projects/koala-ui/core/base/page-base.ts","../../projects/koala-ui/core/base/koalarx-ui-core-base.ts"],"sourcesContent":["import { HttpClient, httpResource } from '@angular/common/http';\nimport { inject, Injector, Signal } from '@angular/core';\nimport { rxResource } from '@angular/core/rxjs-interop';\nimport { AppConfig } from '@koalarx/ui/core/config';\nimport { GetManyResult } from '@koalarx/ui/core/models';\nimport { AutocompleteOption } from '@koalarx/ui/shared/components/input-field/autocomplete';\nimport { SelectOption } from '@koalarx/ui/shared/components/input-field/select';\nimport { first } from 'rxjs/internal/operators/first';\nimport { map } from 'rxjs/internal/operators/map';\n\nexport interface HttpResourceRequestOptions<EntityType> {\n  debounceTime?: number;\n  endpoint?: string;\n  mapOption?: (\n    item: any\n  ) => Omit<\n    | AutocompleteOption<EntityType>\n    | SelectOption<EntityType>\n    | GetManyResult<EntityType>,\n    'data'\n  >;\n}\n\nexport abstract class HttpBase<\n  EntityType = any,\n  PayloadType = any,\n  QueryType = any\n> {\n  private readonly appConfig = inject(AppConfig);\n  protected readonly injector = inject(Injector);\n  protected readonly http = inject(HttpClient);\n  protected readonly url: string;\n  protected readonly hostApi: string;\n\n  constructor(protected readonly resource: string, hostApi?: string) {\n    this.hostApi = hostApi || this.appConfig.hostApi || '';\n    this.url = `${this.hostApi}/${this.resource}`;\n  }\n\n  post<T>(data: PayloadType, endpoint = '') {\n    return this.http.post<T>(`${this.url}${endpoint}`, data).pipe(first());\n  }\n\n  put<T>(id: string, data: PayloadType) {\n    return this.http.put<T>(`${this.url}/${id}`, data).pipe(first());\n  }\n\n  patch<T>(id: string, data: any) {\n    return this.http.patch<T>(`${this.url}/${id}`, data).pipe(first());\n  }\n\n  delete<T>(id: string) {\n    return this.http.delete<T>(`${this.url}/${id}`).pipe(first());\n  }\n\n  getMany<TResponse = EntityType>(query: QueryType, endpoint = '') {\n    return this.http.get<GetManyResult<TResponse>>(`${this.url}${endpoint}`, {\n      params: query as any,\n    });\n  }\n\n  getById<TResponse = EntityType>(id: string | null) {\n    return this.http.get<TResponse>(`${this.url}/${id}`);\n  }\n\n  getManyWithResource<TResponse = EntityType>(\n    query: Signal<QueryType>,\n    {\n      endpoint = '',\n      mapOption,\n    }: Omit<HttpResourceRequestOptions<TResponse>, 'debounceTime'> = {}\n  ) {\n    return httpResource<GetManyResult<TResponse>>(\n      () => {\n        return {\n          url: `${this.url}${endpoint}`,\n          params: query() as any,\n        };\n      },\n      {\n        parse: mapOption as (data: any) => any,\n      }\n    );\n  }\n\n  getByIdWithResource<TResponse = EntityType>(\n    id: Signal<string | null>,\n    endpoint = ':id',\n    mapResponse?: (response: TResponse) => TResponse\n  ) {\n    return httpResource<TResponse>(\n      () => {\n        const resourceId = id();\n\n        if (!resourceId) {\n          return undefined;\n        }\n\n        return `${this.url}/${endpoint.replace(':id', resourceId)}`;\n      },\n      {\n        parse: mapResponse as (resume: any) => TResponse,\n      }\n    );\n  }\n\n  getByOneWithResource<TResponse = EntityType>(\n    endpoint: Signal<string | null>,\n    params?: Signal<any>,\n    mapResponse?: (response: TResponse) => TResponse\n  ) {\n    return httpResource<TResponse>(\n      () => {\n        const resourceUrl = endpoint();\n\n        if (!resourceUrl) {\n          return undefined;\n        }\n\n        return {\n          url: `${this.url}/${resourceUrl}`,\n          params: params ? params() : undefined,\n        };\n      },\n      {\n        parse: mapResponse as (resume: any) => TResponse,\n      }\n    );\n  }\n\n  getManyForSelector<TResponse = EntityType>(\n    query: QueryType | Signal<QueryType>,\n    mapOption: (\n      item: TResponse\n    ) => Omit<AutocompleteOption<TResponse> | SelectOption<TResponse>, 'data'>\n  ) {\n    return rxResource({\n      defaultValue: [],\n      params: () => (query instanceof Function ? query() : query),\n      stream: (data) =>\n        this.getMany<TResponse>(data.params).pipe(\n          map((response) =>\n            response.items.map((item) => ({\n              ...mapOption(item),\n              data: item,\n            }))\n          )\n        ),\n    });\n  }\n}\n","import { HttpResourceRef } from '@angular/common/http';\nimport {\n  computed,\n  Directive,\n  effect,\n  inject,\n  input,\n  signal,\n  Type,\n} from '@angular/core';\nimport {\n  GetManyResult,\n  QueryPagination,\n  SortFilterType,\n} from '@koalarx/ui/core/models';\nimport { HttpBase } from './http-base';\n\n@Directive()\nexport abstract class ListBase<\n  QueryType extends QueryPagination,\n  TEntity = any\n> {\n  private reloading = false;\n  protected readonly resourceRef: HttpResourceRef<\n    GetManyResult<TEntity> | undefined\n  >;\n  protected readonly limitPage = signal(30);\n  protected readonly page = signal(1);\n  protected readonly filter = signal<QueryType>({} as any);\n  protected readonly resource: HttpBase<TEntity, any, QueryType>;\n  protected readonly totalItemsOnPage = signal(0);\n  protected readonly totalItems = signal(0);\n  protected readonly list = signal<TEntity[]>([]);\n  protected readonly sortFilter = signal<SortFilterType | null>(null);\n  protected readonly withPagination = signal<boolean>(true);\n\n  queryParams = computed<QueryType>(\n    () =>\n      ({\n        page: this.page(),\n        limit: this.limitPage(),\n        ...(this.sortFilter() ?? {}),\n        ...this.filter(),\n      } as QueryType)\n  );\n  reload = input<boolean>(false);\n\n  constructor(\n    // eslint-disable-next-line @angular-eslint/prefer-inject\n    resource: Type<HttpBase<TEntity, any, QueryType>>,\n    // eslint-disable-next-line @angular-eslint/prefer-inject\n    protected readonly componentFilter?: Type<any>\n  ) {\n    this.resource = inject(resource);\n    this.resourceRef = this.resource.getManyWithResource(this.queryParams);\n\n    effect(() => {\n      const withPagination = this.withPagination();\n      const result = this.resourceRef.value();\n\n      if (!withPagination && !this.reloading) {\n        if (result) {\n          this.list.update((current) => [...current, ...result.items]);\n          this.totalItemsOnPage.update(\n            (current) => current + result.items.length\n          );\n          this.totalItems.set(result.count);\n        }\n        this.reloading = false;\n        return;\n      }\n\n      if (!result) {\n        this.list.set([]);\n        this.totalItemsOnPage.set(0);\n        this.totalItems.set(0);\n        this.reloading = false;\n        return;\n      }\n\n      this.list.set(result.items);\n      this.totalItemsOnPage.set(result.items.length);\n      this.totalItems.set(result.count);\n      this.reloading = false;\n    });\n\n    effect(() => {\n      if (this.reload()) {\n        this.reloadList();\n      }\n    });\n  }\n\n  protected sort(sortFilter: SortFilterType) {\n    this.sortFilter.set(sortFilter);\n  }\n\n  protected reloadList() {\n    this.reloading = true;\n    this.list.set([]);\n    this.totalItemsOnPage.set(0);\n    this.totalItems.set(0);\n    this.page.set(1);\n    this.resourceRef.reload();\n  }\n\n  protected loadMore() {\n    this.page.update((current) => current + 1);\n  }\n}\n","import { signal } from '@angular/core';\n\nexport abstract class PageBase {\n  protected reload = signal(false);\n\n  protected reloadList() {\n    this.reload.set(true);\n    setTimeout(() => this.reload.set(false));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;MAuBsB,QAAQ,CAAA;AAWG,IAAA,QAAA;AANd,IAAA,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;AAC3B,IAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;AAC3B,IAAA,IAAI,GAAG,MAAM,CAAC,UAAU,CAAC;AACzB,IAAA,GAAG;AACH,IAAA,OAAO;IAE1B,WAA+B,CAAA,QAAgB,EAAE,OAAgB,EAAA;QAAlC,IAAQ,CAAA,QAAA,GAAR,QAAQ;AACrC,QAAA,IAAI,CAAC,OAAO,GAAG,OAAO,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO,IAAI,EAAE;AACtD,QAAA,IAAI,CAAC,GAAG,GAAG,CAAA,EAAG,IAAI,CAAC,OAAO,CAAA,CAAA,EAAI,IAAI,CAAC,QAAQ,CAAA,CAAE;;AAG/C,IAAA,IAAI,CAAI,IAAiB,EAAE,QAAQ,GAAG,EAAE,EAAA;QACtC,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,CAAI,CAAA,EAAG,IAAI,CAAC,GAAG,CAAA,EAAG,QAAQ,CAAE,CAAA,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;;IAGxE,GAAG,CAAI,EAAU,EAAE,IAAiB,EAAA;QAClC,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAAI,CAAA,EAAG,IAAI,CAAC,GAAG,CAAA,CAAA,EAAI,EAAE,CAAE,CAAA,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;;IAGlE,KAAK,CAAI,EAAU,EAAE,IAAS,EAAA;QAC5B,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAI,CAAA,EAAG,IAAI,CAAC,GAAG,CAAA,CAAA,EAAI,EAAE,CAAE,CAAA,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;;AAGpE,IAAA,MAAM,CAAI,EAAU,EAAA;QAClB,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,CAAI,CAAA,EAAG,IAAI,CAAC,GAAG,IAAI,EAAE,CAAA,CAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;;AAG/D,IAAA,OAAO,CAAyB,KAAgB,EAAE,QAAQ,GAAG,EAAE,EAAA;AAC7D,QAAA,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAA2B,CAAG,EAAA,IAAI,CAAC,GAAG,CAAG,EAAA,QAAQ,EAAE,EAAE;AACvE,YAAA,MAAM,EAAE,KAAY;AACrB,SAAA,CAAC;;AAGJ,IAAA,OAAO,CAAyB,EAAiB,EAAA;AAC/C,QAAA,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAAY,CAAA,EAAG,IAAI,CAAC,GAAG,CAAA,CAAA,EAAI,EAAE,CAAA,CAAE,CAAC;;IAGtD,mBAAmB,CACjB,KAAwB,EACxB,EACE,QAAQ,GAAG,EAAE,EACb,SAAS,GAAA,GACsD,EAAE,EAAA;QAEnE,OAAO,YAAY,CACjB,MAAK;YACH,OAAO;AACL,gBAAA,GAAG,EAAE,CAAG,EAAA,IAAI,CAAC,GAAG,CAAA,EAAG,QAAQ,CAAE,CAAA;gBAC7B,MAAM,EAAE,KAAK,EAAS;aACvB;AACH,SAAC,EACD;AACE,YAAA,KAAK,EAAE,SAA+B;AACvC,SAAA,CACF;;AAGH,IAAA,mBAAmB,CACjB,EAAyB,EACzB,QAAQ,GAAG,KAAK,EAChB,WAAgD,EAAA;QAEhD,OAAO,YAAY,CACjB,MAAK;AACH,YAAA,MAAM,UAAU,GAAG,EAAE,EAAE;YAEvB,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,OAAO,SAAS;;AAGlB,YAAA,OAAO,CAAG,EAAA,IAAI,CAAC,GAAG,IAAI,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,UAAU,CAAC,EAAE;AAC7D,SAAC,EACD;AACE,YAAA,KAAK,EAAE,WAAyC;AACjD,SAAA,CACF;;AAGH,IAAA,oBAAoB,CAClB,QAA+B,EAC/B,MAAoB,EACpB,WAAgD,EAAA;QAEhD,OAAO,YAAY,CACjB,MAAK;AACH,YAAA,MAAM,WAAW,GAAG,QAAQ,EAAE;YAE9B,IAAI,CAAC,WAAW,EAAE;AAChB,gBAAA,OAAO,SAAS;;YAGlB,OAAO;AACL,gBAAA,GAAG,EAAE,CAAG,EAAA,IAAI,CAAC,GAAG,CAAA,CAAA,EAAI,WAAW,CAAE,CAAA;gBACjC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,SAAS;aACtC;AACH,SAAC,EACD;AACE,YAAA,KAAK,EAAE,WAAyC;AACjD,SAAA,CACF;;IAGH,kBAAkB,CAChB,KAAoC,EACpC,SAE0E,EAAA;AAE1E,QAAA,OAAO,UAAU,CAAC;AAChB,YAAA,YAAY,EAAE,EAAE;AAChB,YAAA,MAAM,EAAE,OAAO,KAAK,YAAY,QAAQ,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;AAC3D,YAAA,MAAM,EAAE,CAAC,IAAI,KACX,IAAI,CAAC,OAAO,CAAY,IAAI,CAAC,MAAM,CAAC,CAAC,IAAI,CACvC,GAAG,CAAC,CAAC,QAAQ,KACX,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,MAAM;gBAC5B,GAAG,SAAS,CAAC,IAAI,CAAC;AAClB,gBAAA,IAAI,EAAE,IAAI;aACX,CAAC,CAAC,CACJ,CACF;AACJ,SAAA,CAAC;;AAEL;;MCpIqB,QAAQ,CAAA;AAiCP,IAAA,eAAA;IA7Bb,SAAS,GAAG,KAAK;AACN,IAAA,WAAW;AAGX,IAAA,SAAS,GAAG,MAAM,CAAC,EAAE,CAAC;AACtB,IAAA,IAAI,GAAG,MAAM,CAAC,CAAC,CAAC;AAChB,IAAA,MAAM,GAAG,MAAM,CAAY,EAAS,CAAC;AACrC,IAAA,QAAQ;AACR,IAAA,gBAAgB,GAAG,MAAM,CAAC,CAAC,CAAC;AAC5B,IAAA,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC;AACtB,IAAA,IAAI,GAAG,MAAM,CAAY,EAAE,CAAC;AAC5B,IAAA,UAAU,GAAG,MAAM,CAAwB,IAAI,CAAC;AAChD,IAAA,cAAc,GAAG,MAAM,CAAU,IAAI,CAAC;AAEzD,IAAA,WAAW,GAAG,QAAQ,CACpB,OACG;AACC,QAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE;AACjB,QAAA,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE;AACvB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,CAAC;QAC5B,GAAG,IAAI,CAAC,MAAM,EAAE;AACH,KAAA,CAAA,CAClB;AACD,IAAA,MAAM,GAAG,KAAK,CAAU,KAAK,CAAC;AAE9B,IAAA,WAAA;;IAEE,QAAiD;;IAE9B,eAA2B,EAAA;QAA3B,IAAe,CAAA,eAAA,GAAf,eAAe;AAElC,QAAA,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;AAChC,QAAA,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC;QAEtE,MAAM,CAAC,MAAK;AACV,YAAA,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,EAAE;YAC5C,MAAM,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE;YAEvC,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;gBACtC,IAAI,MAAM,EAAE;oBACV,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,KAAK,CAAC,GAAG,OAAO,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;AAC5D,oBAAA,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAC1B,CAAC,OAAO,KAAK,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAC3C;oBACD,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC;;AAEnC,gBAAA,IAAI,CAAC,SAAS,GAAG,KAAK;gBACtB;;YAGF,IAAI,CAAC,MAAM,EAAE;AACX,gBAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;AACjB,gBAAA,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC;AAC5B,gBAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC;AACtB,gBAAA,IAAI,CAAC,SAAS,GAAG,KAAK;gBACtB;;YAGF,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC;YAC3B,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;YAC9C,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC;AACjC,YAAA,IAAI,CAAC,SAAS,GAAG,KAAK;AACxB,SAAC,CAAC;QAEF,MAAM,CAAC,MAAK;AACV,YAAA,IAAI,IAAI,CAAC,MAAM,EAAE,EAAE;gBACjB,IAAI,CAAC,UAAU,EAAE;;AAErB,SAAC,CAAC;;AAGM,IAAA,IAAI,CAAC,UAA0B,EAAA;AACvC,QAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,UAAU,CAAC;;IAGvB,UAAU,GAAA;AAClB,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI;AACrB,QAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;AACjB,QAAA,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC;AAC5B,QAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC;AACtB,QAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;AAChB,QAAA,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE;;IAGjB,QAAQ,GAAA;AAChB,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,KAAK,OAAO,GAAG,CAAC,CAAC;;uGAzFxB,QAAQ,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,IAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAR,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAR,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAD7B;;;MCfqB,QAAQ,CAAA;AAClB,IAAA,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC;IAEtB,UAAU,GAAA;AAClB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;AACrB,QAAA,UAAU,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;;AAE3C;;ACTD;;AAEG;;;;"}

package/fesm2022/koalarx-ui-core-translations.mjs

@@ -29,6 +29,8 @@ const en = {
         addFilterTooltip: 'Add filter',
         reloadListTooltip: 'Reload data',
         labelItemsPerPage: 'Items per page limit',
+        loadMoreBtnLabel: 'Load more',
+        paginatorPagesFeedback: (currentPage, lastPage) => `Page ${currentPage} of ${lastPage}`,
     },
     feedbackRequestInterceptor: {
         '400': 'An error occurred related to the submitted data',
@@ -74,6 +76,8 @@ const ptBr = {
         addFilterTooltip: 'Adicionar filtro',
         reloadListTooltip: 'Recarregar dados',
         labelItemsPerPage: 'Limite de itens por carregamento',
+        loadMoreBtnLabel: 'Carregar mais',
+        paginatorPagesFeedback: (currentPage, lastPage) => `Página ${currentPage} de ${lastPage}`,
     },
     feedbackRequestInterceptor: {
         '400': 'Ocorreu um erro relacionado aos dados enviados',

package/fesm2022/koalarx-ui-core-translations.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"koalarx-ui-core-translations.mjs","sources":["../../projects/koala-ui/core/translations/en.ts","../../projects/koala-ui/core/translations/ptbr.ts","../../projects/koala-ui/core/translations/get-translation-by-language.ts","../../projects/koala-ui/core/translations/koalarx-ui-core-translations.ts"],"sourcesContent":["import { Translation } from './translation.model';\n\nexport const en: Translation = {\n  confirm: {\n    btnLabelYes: 'Yes',\n    btnLabelNo: 'No',\n  },\n  codeViewer: {\n    copyToClipboard: 'Copy to clipboard',\n    copiedToClipboard: 'Copied to clipboard',\n  },\n  form: {\n    required: 'This field is required.',\n    invalidEmail: 'Invalid email address',\n    invalidMinLength: (minLength: number) =>\n      `The field must have at least ${minLength} characters.`,\n    invalidCPF: 'Invalid CPF',\n    invalidCNPJ: 'Invalid CNPJ',\n    invalidURL: 'Invalid URL',\n    invalidPasswordHasSpecialCharacters:\n      'The password must contain special characters.',\n    invalidPasswordHasLowercase: 'The password must contain lowercase letters.',\n    invalidPasswordHasUppercase: 'The password must contain uppercase letters.',\n    invalidPasswordHasNumber: 'The password must contain numbers.',\n    invalidConfirmPassword: 'The confirmation password does not match.',\n  },\n  onThisPage: {\n    title: 'On this page',\n  },\n  datatable: {\n    btnFilterLabel: 'Filter',\n    clearFilterTooltip: 'Clear filters',\n    addFilterTooltip: 'Add filter',\n    reloadListTooltip: 'Reload data',\n    labelItemsPerPage: 'Items per page limit',\n  },\n  feedbackRequestInterceptor: {\n    '400': 'An error occurred related to the submitted data',\n    '401': 'Unauthorized access, please log in again.',\n    '403': 'Access denied.',\n    '404': 'No record found from the provided data.',\n    '409': 'This record already exists',\n    '422': 'Validation error in the submitted data.',\n    '500': 'Please contact our support via WhatsApp.',\n    '0': 'We identified an instability in communication with our server, this may occur due to rapid internet drops, slow connection, or server overload, please try again.',\n    unknowError: 'An unknown error occurred, please try again.',\n  },\n};\n","import { Translation } from './translation.model';\n\nexport const ptBr: Translation = {\n  confirm: {\n    btnLabelYes: 'Sim',\n    btnLabelNo: 'Não',\n  },\n  codeViewer: {\n    copyToClipboard: 'Copiar',\n    copiedToClipboard: 'Copiado',\n  },\n  form: {\n    required: 'O campo é obrigatório.',\n    invalidEmail: 'E-mail inválido',\n    invalidMinLength: (minLength: number) =>\n      `O campo deve ter no mínimo ${minLength} caracteres.`,\n    invalidCPF: 'CPF inválido',\n    invalidCNPJ: 'CNPJ inválido',\n    invalidURL: 'URL inválida',\n    invalidPasswordHasSpecialCharacters:\n      'A senha deve conter caracteres especiais.',\n    invalidPasswordHasLowercase: 'A senha deve conter letras minúsculas.',\n    invalidPasswordHasUppercase: 'A senha deve conter letras maiúsculas.',\n    invalidPasswordHasNumber: 'A senha deve conter números.',\n    invalidConfirmPassword: 'A confirmação da senha não confere.',\n  },\n  onThisPage: {\n    title: 'Nesta página',\n  },\n  datatable: {\n    btnFilterLabel: 'Filtro',\n    clearFilterTooltip: 'Limpar filtros',\n    addFilterTooltip: 'Adicionar filtro',\n    reloadListTooltip: 'Recarregar dados',\n    labelItemsPerPage: 'Limite de itens por carregamento',\n  },\n  feedbackRequestInterceptor: {\n    '400': 'Ocorreu um erro relacionado aos dados enviados',\n    '401': 'Acesso não autorizado, por favor, faça login novamente.',\n    '403': 'Acesso negado.',\n    '404': 'Nenhum registro encontrado a partir dos dados informados.',\n    '409': 'Este registro já existe',\n    '422': 'Erro de validação nos dados enviados.',\n    '500': 'Entre em contato com nosso suporte pelo canal do whatsapp.',\n    '0': 'Identificamos uma instabilidade na comunicação com nosso servidor, isto pode ocorrer devido a rápidas quedas de internet, conexão lenta ou sobrecarga no servidor, por favor, tente novamente.',\n    unknowError: 'Ocorreu um erro desconhecido, por favor, tente novamente.',\n  },\n};\n","import { en } from './en';\nimport { ptBr } from './ptbr';\nimport { Translation } from './translation.model';\n\nexport type KoalaLanguage = 'en' | 'ptBr';\n\nexport function getTranslationByLanguage(language: KoalaLanguage): Translation {\n  switch (language) {\n    case 'en':\n      return en;\n    case 'ptBr':\n      return ptBr;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"koalarx-ui-core-translations.mjs","sources":["../../projects/koala-ui/core/translations/en.ts","../../projects/koala-ui/core/translations/ptbr.ts","../../projects/koala-ui/core/translations/get-translation-by-language.ts","../../projects/koala-ui/core/translations/koalarx-ui-core-translations.ts"],"sourcesContent":["import { Translation } from './translation.model';\n\nexport const en: Translation = {\n  confirm: {\n    btnLabelYes: 'Yes',\n    btnLabelNo: 'No',\n  },\n  codeViewer: {\n    copyToClipboard: 'Copy to clipboard',\n    copiedToClipboard: 'Copied to clipboard',\n  },\n  form: {\n    required: 'This field is required.',\n    invalidEmail: 'Invalid email address',\n    invalidMinLength: (minLength: number) =>\n      `The field must have at least ${minLength} characters.`,\n    invalidCPF: 'Invalid CPF',\n    invalidCNPJ: 'Invalid CNPJ',\n    invalidURL: 'Invalid URL',\n    invalidPasswordHasSpecialCharacters:\n      'The password must contain special characters.',\n    invalidPasswordHasLowercase: 'The password must contain lowercase letters.',\n    invalidPasswordHasUppercase: 'The password must contain uppercase letters.',\n    invalidPasswordHasNumber: 'The password must contain numbers.',\n    invalidConfirmPassword: 'The confirmation password does not match.',\n  },\n  onThisPage: {\n    title: 'On this page',\n  },\n  datatable: {\n    btnFilterLabel: 'Filter',\n    clearFilterTooltip: 'Clear filters',\n    addFilterTooltip: 'Add filter',\n    reloadListTooltip: 'Reload data',\n    labelItemsPerPage: 'Items per page limit',\n    loadMoreBtnLabel: 'Load more',\n    paginatorPagesFeedback: (currentPage: number, lastPage: number) =>\n      `Page ${currentPage} of ${lastPage}`,\n  },\n  feedbackRequestInterceptor: {\n    '400': 'An error occurred related to the submitted data',\n    '401': 'Unauthorized access, please log in again.',\n    '403': 'Access denied.',\n    '404': 'No record found from the provided data.',\n    '409': 'This record already exists',\n    '422': 'Validation error in the submitted data.',\n    '500': 'Please contact our support via WhatsApp.',\n    '0': 'We identified an instability in communication with our server, this may occur due to rapid internet drops, slow connection, or server overload, please try again.',\n    unknowError: 'An unknown error occurred, please try again.',\n  },\n};\n","import { Translation } from './translation.model';\n\nexport const ptBr: Translation = {\n  confirm: {\n    btnLabelYes: 'Sim',\n    btnLabelNo: 'Não',\n  },\n  codeViewer: {\n    copyToClipboard: 'Copiar',\n    copiedToClipboard: 'Copiado',\n  },\n  form: {\n    required: 'O campo é obrigatório.',\n    invalidEmail: 'E-mail inválido',\n    invalidMinLength: (minLength: number) =>\n      `O campo deve ter no mínimo ${minLength} caracteres.`,\n    invalidCPF: 'CPF inválido',\n    invalidCNPJ: 'CNPJ inválido',\n    invalidURL: 'URL inválida',\n    invalidPasswordHasSpecialCharacters:\n      'A senha deve conter caracteres especiais.',\n    invalidPasswordHasLowercase: 'A senha deve conter letras minúsculas.',\n    invalidPasswordHasUppercase: 'A senha deve conter letras maiúsculas.',\n    invalidPasswordHasNumber: 'A senha deve conter números.',\n    invalidConfirmPassword: 'A confirmação da senha não confere.',\n  },\n  onThisPage: {\n    title: 'Nesta página',\n  },\n  datatable: {\n    btnFilterLabel: 'Filtro',\n    clearFilterTooltip: 'Limpar filtros',\n    addFilterTooltip: 'Adicionar filtro',\n    reloadListTooltip: 'Recarregar dados',\n    labelItemsPerPage: 'Limite de itens por carregamento',\n    loadMoreBtnLabel: 'Carregar mais',\n    paginatorPagesFeedback: (currentPage: number, lastPage: number) =>\n      `Página ${currentPage} de ${lastPage}`,\n  },\n  feedbackRequestInterceptor: {\n    '400': 'Ocorreu um erro relacionado aos dados enviados',\n    '401': 'Acesso não autorizado, por favor, faça login novamente.',\n    '403': 'Acesso negado.',\n    '404': 'Nenhum registro encontrado a partir dos dados informados.',\n    '409': 'Este registro já existe',\n    '422': 'Erro de validação nos dados enviados.',\n    '500': 'Entre em contato com nosso suporte pelo canal do whatsapp.',\n    '0': 'Identificamos uma instabilidade na comunicação com nosso servidor, isto pode ocorrer devido a rápidas quedas de internet, conexão lenta ou sobrecarga no servidor, por favor, tente novamente.',\n    unknowError: 'Ocorreu um erro desconhecido, por favor, tente novamente.',\n  },\n};\n","import { en } from './en';\nimport { ptBr } from './ptbr';\nimport { Translation } from './translation.model';\n\nexport type KoalaLanguage = 'en' | 'ptBr';\n\nexport function getTranslationByLanguage(language: KoalaLanguage): Translation {\n  switch (language) {\n    case 'en':\n      return en;\n    case 'ptBr':\n      return ptBr;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/koalarx-ui-shared-components-datatable.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { input, output, viewChild, signal, effect, Component, inject, ElementRef, Directive, Injectable, booleanAttribute, model, computed } from '@angular/core';
-import { Tooltip } from '@koalarx/ui/shared/directives';
+import { Tooltip, Button } from '@koalarx/ui/shared/directives';
 import { AppConfig } from '@koalarx/ui/core/config';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
@@ -200,6 +200,7 @@ class Datatable {
     currentPageSize = input.required();
     isLoading = input.required();
     colspan = input.required();
+    loadMoreBtnColor = input('accent');
     componentFilter = input();
     withPaginator = input(false, { transform: booleanAttribute });
     filter = signal([]);
@@ -209,35 +210,18 @@ class Datatable {
     skeletonCols = computed(() => {
         return Array.from({ length: this.colspan() }, (_, i) => i);
     });
-    paginator = computed(() => {
+    lastPage = computed(() => {
         const isLoading = this.isLoading();
-        const paginator = [];
         if (!isLoading) {
-            const firstPage = 1;
-            const previousPage = this.currentPage() - 1;
-            const currentPage = this.currentPage();
-            const nextPage = this.currentPage() + 1;
-            const lastPage = Math.ceil(this.totalItems() / this.currentPageSize());
-            if (firstPage < currentPage) {
-                paginator.push(firstPage);
-            }
-            if (previousPage > firstPage) {
-                paginator.push(previousPage);
-            }
-            paginator.push(currentPage);
-            if (nextPage < lastPage) {
-                paginator.push(nextPage);
-            }
-            if (lastPage > currentPage) {
-                paginator.push(lastPage);
-            }
+            return Math.ceil(this.totalItems() / this.currentPageSize());
         }
-        return paginator;
+        return 1;
     });
     pageChange = output();
     pageSizeChange = output();
     filterChange = output();
     reloadList = output();
+    loadMore = output();
     constructor() {
         effect(() => this.pageSize.set(this.currentPageSize()));
         effect(() => this.pageSizeChange.emit(this.pageSize()));
@@ -257,11 +241,11 @@ class Datatable {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: Datatable, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: Datatable, isStandalone: true, selector: "kl-datatable", inputs: { currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: true, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, totalItemsOnPage: { classPropertyName: "totalItemsOnPage", publicName: "totalItemsOnPage", isSignal: true, isRequired: true, transformFunction: null }, currentPageSize: { classPropertyName: "currentPageSize", publicName: "currentPageSize", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: true, transformFunction: null }, colspan: { classPropertyName: "colspan", publicName: "colspan", isSignal: true, isRequired: true, transformFunction: null }, componentFilter: { classPropertyName: "componentFilter", publicName: "componentFilter", isSignal: true, isRequired: false, transformFunction: null }, withPaginator: { classPropertyName: "withPaginator", publicName: "withPaginator", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageSize: "pageSizeChange", pageChange: "pageChange", pageSizeChange: "pageSizeChange", filterChange: "filterChange", reloadList: "reloadList" }, ngImport: i0, template: "<div class=\"flex flex-col h-full\">\n  <div class=\"pr-8 pl-1 pt-0 pb-0 border-b border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between z-10\">\n    <div class=\"datatable-menu flex items-center p-2 opacity-80\">\n      <div class=\"addicional-options-menu flex items-center opacity-80\">\n        <ng-content select=\"[menu]\" />\n      </div>\n\n      <span class=\"datatable-separator-menu relative top-[-0.10rem] pl-3 pr-2 opacity-60\">|</span>\n\n      @if (componentFilter()) {\n        <button class=\"btn btn-ghost btn-xs text-sm font-light\"\n          (click)=\"openFilter()\">\n          <i class=\"fa-solid fa-filter text-xs\"></i>\n          {{translations.btnFilterLabel}}\n        </button>\n      }\n\n      <button class=\"btn btn-ghost btn-xs text-sm font-light\"\n        (click)=\"reloadList.emit()\">\n        <i class=\"fa-solid fa-rotate-right text-xs\"></i>\n        {{translations.reloadListTooltip}}\n      </button>\n    </div>\n\n    @if (!withPaginator()) {\n      <div class=\"flex items-center justify-end gap-3 text-sm\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-md p-0 pl-2 pr-8 h-[1.5rem] w-auto\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n    }\n  </div>\n\n  <kl-filter\n    [filter]=\"filter()\"\n    (addFilter)=\"openFilter($event)\"\n    (payload)=\"filterChange.emit($event)\"\n  />\n\n  <div class=\"overflow-x-auto h-full\">\n    <table class=\"table table-sm table-pin-rows\">\n      <thead>\n        <tr class=\"text-xs\">\n          <ng-content select=\"[head]\" />\n        </tr>\n      </thead>\n      <tbody>\n        @if (isLoading()) {\n          @for (row of skeletonRows(); track $index) {\n            <tr>\n              @for (col of skeletonCols(); track $index) {\n                <td><span class=\"block skeleton w-full h-4\"></span></td>\n              }\n            </tr>\n          }\n        } @else {\n          <ng-content select=\"[body]\" />\n        }\n      </tbody>\n    </table>\n  </div>\n\n  @if (withPaginator()) {\n    <div class=\"px-4 py-2 border-t border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between\">\n      <div class=\"flex items-center justify-end gap-3 text-xs\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-sm p-0 pl-2 pr-0 w-15 h-[1.5rem]\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n\n      <div class=\"join flex items-center\">\n        <button class=\"join-item btn btn-sm\"\n          [disabled]=\"paginator()[0] === currentPage()\"\n          (click)=\"pageChange.emit(currentPage() - 1)\">\n          \u00AB\n        </button>\n\n        @for (page of paginator(); track $index) {\n          <button class=\"join-item btn btn-sm\"\n            [class.btn-disabled]=\"page === currentPage()\"\n            (click)=\"pageChange.emit(page)\">\n            {{page}}\n          </button>\n        }\n\n        <button class=\"join-item btn btn-sm\"\n          [disabled]=\"paginator()[paginator().length - 1] === currentPage()\"\n          (click)=\"pageChange.emit(currentPage() + 1)\">\n          \u00BB\n        </button>\n      </div>\n    </div>\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Filter, selector: "kl-filter", inputs: ["filter"], outputs: ["payload", "addFilter"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: Datatable, isStandalone: true, selector: "kl-datatable", inputs: { currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: true, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, totalItemsOnPage: { classPropertyName: "totalItemsOnPage", publicName: "totalItemsOnPage", isSignal: true, isRequired: true, transformFunction: null }, currentPageSize: { classPropertyName: "currentPageSize", publicName: "currentPageSize", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: true, transformFunction: null }, colspan: { classPropertyName: "colspan", publicName: "colspan", isSignal: true, isRequired: true, transformFunction: null }, loadMoreBtnColor: { classPropertyName: "loadMoreBtnColor", publicName: "loadMoreBtnColor", isSignal: true, isRequired: false, transformFunction: null }, componentFilter: { classPropertyName: "componentFilter", publicName: "componentFilter", isSignal: true, isRequired: false, transformFunction: null }, withPaginator: { classPropertyName: "withPaginator", publicName: "withPaginator", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageSize: "pageSizeChange", pageChange: "pageChange", pageSizeChange: "pageSizeChange", filterChange: "filterChange", reloadList: "reloadList", loadMore: "loadMore" }, ngImport: i0, template: "<div class=\"flex flex-col h-full\">\n  <div class=\"pr-8 pl-1 pt-0 pb-0 border-b border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between z-10\">\n    <div class=\"datatable-menu flex items-center p-2 opacity-80 gap-2\">\n      <div class=\"addicional-options-menu flex items-center opacity-80\">\n        <ng-content select=\"[menu]\" />\n      </div>\n\n      <span class=\"datatable-separator-menu relative top-[-0.10rem] opacity-20\">|</span>\n\n      @if (componentFilter()) {\n        <button class=\"btn btn-neutral btn-xs text-sm font-light\"\n          (click)=\"openFilter()\">\n          <i class=\"fa-solid fa-filter text-xs\"></i>\n          {{translations.btnFilterLabel}}\n        </button>\n      }\n\n      <button class=\"btn btn-outline border-neutral-300 hover:border-neutral-500 dark:border-neutral-700 btn-xs text-sm font-light\"\n        (click)=\"reloadList.emit()\">\n        <i class=\"fa-solid fa-rotate-right text-xs\"></i>\n        {{translations.reloadListTooltip}}\n      </button>\n    </div>\n\n    @if (!withPaginator()) {\n      <div class=\"flex items-center justify-end gap-3 text-sm\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-md p-0 pl-2 pr-8 h-[1.5rem] w-auto\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n    }\n  </div>\n\n  <kl-filter\n    [filter]=\"filter()\"\n    (addFilter)=\"openFilter($event)\"\n    (payload)=\"filterChange.emit($event)\"\n  />\n\n  <div class=\"overflow-x-auto h-full bg-base-200\">\n    <table class=\"table table-sm table-pin-rows\">\n      <thead>\n        <tr class=\"text-xs bg-base-200\">\n          <ng-content select=\"[head]\" />\n        </tr>\n      </thead>\n      <tbody>\n        <ng-content select=\"[body]\" />\n\n        @if (!withPaginator() && !isLoading() && totalItemsOnPage() < totalItems()) {\n          <tr>\n            <td colspan=\"7\">\n              <button\n                klButton\n                outline\n                [color]=\"loadMoreBtnColor()\"\n                class=\"w-full\"\n                (click)=\"loadMore.emit()\">\n                {{translations.loadMoreBtnLabel}}\n              </button>\n            </td>\n          </tr>\n        }\n\n        @if (isLoading()) {\n          @for (row of skeletonRows(); track $index) {\n            <tr>\n              @for (col of skeletonCols(); track $index) {\n                <td><span class=\"block skeleton w-full h-4\"></span></td>\n              }\n            </tr>\n          }\n        }\n      </tbody>\n    </table>\n  </div>\n\n  @if (withPaginator()) {\n    <div class=\"px-4 py-2 bg-base-200 border-t border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between\">\n      <div class=\"flex items-center justify-end gap-3 text-xs\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-sm p-0 pl-2 pr-0 w-15 h-[1.5rem]\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n\n      <div class=\"flex items-center gap-8\">\n        <span class=\"text-xs opacity-60\">{{translations.paginatorPagesFeedback(currentPage(), lastPage())}}</span>\n\n        <div class=\"join flex items-center\">\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === 1\"\n            (click)=\"pageChange.emit(1)\">\n            <i class=\"fa-solid fa-angles-left text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === 1\"\n            (click)=\"pageChange.emit(currentPage() - 1)\">\n            <i class=\"fa-solid fa-chevron-left text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === lastPage()\"\n            (click)=\"pageChange.emit(currentPage() + 1)\">\n            <i class=\"fa-solid fa-angle-right text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === lastPage()\"\n            (click)=\"pageChange.emit(lastPage())\">\n            <i class=\"fa-solid fa-angles-right text-[0.6rem]\"></i>\n          </button>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Filter, selector: "kl-filter", inputs: ["filter"], outputs: ["payload", "addFilter"] }, { kind: "directive", type: Button, selector: "button[klButton], a[klButton]", inputs: ["color", "type", "circle", "outline", "soft", "showLoader", "disabled", "size"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: Datatable, decorators: [{
             type: Component,
-            args: [{ selector: 'kl-datatable', imports: [FormsModule, Filter], template: "<div class=\"flex flex-col h-full\">\n  <div class=\"pr-8 pl-1 pt-0 pb-0 border-b border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between z-10\">\n    <div class=\"datatable-menu flex items-center p-2 opacity-80\">\n      <div class=\"addicional-options-menu flex items-center opacity-80\">\n        <ng-content select=\"[menu]\" />\n      </div>\n\n      <span class=\"datatable-separator-menu relative top-[-0.10rem] pl-3 pr-2 opacity-60\">|</span>\n\n      @if (componentFilter()) {\n        <button class=\"btn btn-ghost btn-xs text-sm font-light\"\n          (click)=\"openFilter()\">\n          <i class=\"fa-solid fa-filter text-xs\"></i>\n          {{translations.btnFilterLabel}}\n        </button>\n      }\n\n      <button class=\"btn btn-ghost btn-xs text-sm font-light\"\n        (click)=\"reloadList.emit()\">\n        <i class=\"fa-solid fa-rotate-right text-xs\"></i>\n        {{translations.reloadListTooltip}}\n      </button>\n    </div>\n\n    @if (!withPaginator()) {\n      <div class=\"flex items-center justify-end gap-3 text-sm\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-md p-0 pl-2 pr-8 h-[1.5rem] w-auto\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n    }\n  </div>\n\n  <kl-filter\n    [filter]=\"filter()\"\n    (addFilter)=\"openFilter($event)\"\n    (payload)=\"filterChange.emit($event)\"\n  />\n\n  <div class=\"overflow-x-auto h-full\">\n    <table class=\"table table-sm table-pin-rows\">\n      <thead>\n        <tr class=\"text-xs\">\n          <ng-content select=\"[head]\" />\n        </tr>\n      </thead>\n      <tbody>\n        @if (isLoading()) {\n          @for (row of skeletonRows(); track $index) {\n            <tr>\n              @for (col of skeletonCols(); track $index) {\n                <td><span class=\"block skeleton w-full h-4\"></span></td>\n              }\n            </tr>\n          }\n        } @else {\n          <ng-content select=\"[body]\" />\n        }\n      </tbody>\n    </table>\n  </div>\n\n  @if (withPaginator()) {\n    <div class=\"px-4 py-2 border-t border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between\">\n      <div class=\"flex items-center justify-end gap-3 text-xs\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-sm p-0 pl-2 pr-0 w-15 h-[1.5rem]\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n\n      <div class=\"join flex items-center\">\n        <button class=\"join-item btn btn-sm\"\n          [disabled]=\"paginator()[0] === currentPage()\"\n          (click)=\"pageChange.emit(currentPage() - 1)\">\n          \u00AB\n        </button>\n\n        @for (page of paginator(); track $index) {\n          <button class=\"join-item btn btn-sm\"\n            [class.btn-disabled]=\"page === currentPage()\"\n            (click)=\"pageChange.emit(page)\">\n            {{page}}\n          </button>\n        }\n\n        <button class=\"join-item btn btn-sm\"\n          [disabled]=\"paginator()[paginator().length - 1] === currentPage()\"\n          (click)=\"pageChange.emit(currentPage() + 1)\">\n          \u00BB\n        </button>\n      </div>\n    </div>\n  }\n</div>\n" }]
+            args: [{ selector: 'kl-datatable', imports: [FormsModule, Filter, Button], template: "<div class=\"flex flex-col h-full\">\n  <div class=\"pr-8 pl-1 pt-0 pb-0 border-b border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between z-10\">\n    <div class=\"datatable-menu flex items-center p-2 opacity-80 gap-2\">\n      <div class=\"addicional-options-menu flex items-center opacity-80\">\n        <ng-content select=\"[menu]\" />\n      </div>\n\n      <span class=\"datatable-separator-menu relative top-[-0.10rem] opacity-20\">|</span>\n\n      @if (componentFilter()) {\n        <button class=\"btn btn-neutral btn-xs text-sm font-light\"\n          (click)=\"openFilter()\">\n          <i class=\"fa-solid fa-filter text-xs\"></i>\n          {{translations.btnFilterLabel}}\n        </button>\n      }\n\n      <button class=\"btn btn-outline border-neutral-300 hover:border-neutral-500 dark:border-neutral-700 btn-xs text-sm font-light\"\n        (click)=\"reloadList.emit()\">\n        <i class=\"fa-solid fa-rotate-right text-xs\"></i>\n        {{translations.reloadListTooltip}}\n      </button>\n    </div>\n\n    @if (!withPaginator()) {\n      <div class=\"flex items-center justify-end gap-3 text-sm\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-md p-0 pl-2 pr-8 h-[1.5rem] w-auto\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n    }\n  </div>\n\n  <kl-filter\n    [filter]=\"filter()\"\n    (addFilter)=\"openFilter($event)\"\n    (payload)=\"filterChange.emit($event)\"\n  />\n\n  <div class=\"overflow-x-auto h-full bg-base-200\">\n    <table class=\"table table-sm table-pin-rows\">\n      <thead>\n        <tr class=\"text-xs bg-base-200\">\n          <ng-content select=\"[head]\" />\n        </tr>\n      </thead>\n      <tbody>\n        <ng-content select=\"[body]\" />\n\n        @if (!withPaginator() && !isLoading() && totalItemsOnPage() < totalItems()) {\n          <tr>\n            <td colspan=\"7\">\n              <button\n                klButton\n                outline\n                [color]=\"loadMoreBtnColor()\"\n                class=\"w-full\"\n                (click)=\"loadMore.emit()\">\n                {{translations.loadMoreBtnLabel}}\n              </button>\n            </td>\n          </tr>\n        }\n\n        @if (isLoading()) {\n          @for (row of skeletonRows(); track $index) {\n            <tr>\n              @for (col of skeletonCols(); track $index) {\n                <td><span class=\"block skeleton w-full h-4\"></span></td>\n              }\n            </tr>\n          }\n        }\n      </tbody>\n    </table>\n  </div>\n\n  @if (withPaginator()) {\n    <div class=\"px-4 py-2 bg-base-200 border-t border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between\">\n      <div class=\"flex items-center justify-end gap-3 text-xs\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-sm p-0 pl-2 pr-0 w-15 h-[1.5rem]\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n\n      <div class=\"flex items-center gap-8\">\n        <span class=\"text-xs opacity-60\">{{translations.paginatorPagesFeedback(currentPage(), lastPage())}}</span>\n\n        <div class=\"join flex items-center\">\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === 1\"\n            (click)=\"pageChange.emit(1)\">\n            <i class=\"fa-solid fa-angles-left text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === 1\"\n            (click)=\"pageChange.emit(currentPage() - 1)\">\n            <i class=\"fa-solid fa-chevron-left text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === lastPage()\"\n            (click)=\"pageChange.emit(currentPage() + 1)\">\n            <i class=\"fa-solid fa-angle-right text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === lastPage()\"\n            (click)=\"pageChange.emit(lastPage())\">\n            <i class=\"fa-solid fa-angles-right text-[0.6rem]\"></i>\n          </button>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n" }]
         }], ctorParameters: () => [] });
 
 /**

package/fesm2022/koalarx-ui-shared-components-datatable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"koalarx-ui-shared-components-datatable.mjs","sources":["../../projects/koala-ui/shared/components/datatable/sort-column/ordered-column.state.ts","../../projects/koala-ui/shared/components/datatable/sort-column/sort-header-column.ts","../../projects/koala-ui/shared/components/datatable/sort-column/sort-header-column.html","../../projects/koala-ui/shared/components/datatable/sort-column/sorted-item.ts","../../projects/koala-ui/shared/components/datatable/filter/datatable-filter.ts","../../projects/koala-ui/shared/components/datatable/filter/filter-factory.ts","../../projects/koala-ui/shared/components/datatable/filter/filter.ts","../../projects/koala-ui/shared/components/datatable/filter/filter.html","../../projects/koala-ui/shared/components/datatable/datatable.ts","../../projects/koala-ui/shared/components/datatable/datatable.html","../../projects/koala-ui/shared/components/datatable/koalarx-ui-shared-components-datatable.ts"],"sourcesContent":["import { SortHeaderColumn } from './sort-header-column';\r\n\r\nexport class OrderedColumnState {\r\n  static current?: SortHeaderColumn;\r\n}\r\n","import {\n  Component,\n  effect,\n  ElementRef,\n  input,\n  output,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport {\n  QueryPaginationDirection,\n  SortFilterType,\n} from '@koalarx/ui/core/models';\nimport { OrderedColumnState } from './ordered-column.state';\n\n@Component({\n  selector: 'kl-sort-header-column',\n  templateUrl: './sort-header-column.html',\n})\nexport class SortHeaderColumn {\n  orderBy = input.required<string>();\n  style = input('');\n  defaultDirection = input<QueryPaginationDirection>();\n  sortable = output<SortFilterType>();\n  elOrderedColumn =\n    viewChild<ElementRef<HTMLTableCellElement>>('orderedColumn');\n  direction = signal<QueryPaginationDirection | null>(null);\n\n  constructor() {\n    effect(() => {\n      const defaultDirection = this.defaultDirection();\n\n      if (defaultDirection) {\n        this.direction.set(defaultDirection);\n        OrderedColumnState.current = this;\n        this.toogleColumnStateOrder('set');\n      }\n    });\n  }\n\n  sort() {\n    this.direction.update((current) => {\n      if (\n        OrderedColumnState.current &&\n        OrderedColumnState.current.orderBy !== this.orderBy\n      ) {\n        OrderedColumnState.current.direction.set(null);\n        OrderedColumnState.current.toogleColumnStateOrder('unset');\n      }\n\n      OrderedColumnState.current = this;\n\n      let direction: QueryPaginationDirection;\n\n      switch (current) {\n        case 'asc':\n          direction = 'desc';\n          break;\n        case 'desc':\n        default:\n          direction = 'asc';\n      }\n\n      this.toogleColumnStateOrder('set');\n\n      this.sortable.emit({\n        orderBy: this.orderBy(),\n        direction,\n      });\n\n      return direction;\n    });\n  }\n\n  async toogleColumnStateOrder(state: 'set' | 'unset') {\n    const columnElement = this.elOrderedColumn()?.nativeElement.parentElement;\n\n    if (!columnElement) {\n      return;\n    }\n\n    if (state === 'set') {\n      columnElement.classList.add('ordered-column');\n    } else {\n      columnElement.classList.remove('ordered-column');\n    }\n  }\n}\n","<div #orderedColumn [style]=\"style()\" class=\"flex items-center justify-start gap-1 py-2 px-3 cursor-pointer\"\n  [class.not-ordered]=\"direction() === null\"\n  [class.asc]=\"direction() === 'asc'\"\n  [class.desc]=\"direction() === 'desc'\"\n  (click)=\"sort()\">\n\n  @switch (direction()) {\n    @case ('asc') {\n      <i class=\"fa-solid fa-arrow-down-short-wide\"></i>\n    }\n    @case ('desc') {\n      <i class=\"fa-solid fa-arrow-down-wide-short\"></i>\n    }\n    @default {\n      <i class=\"fa-solid fa-sort\"></i>\n    }\n  }\n\n  <ng-content />\n</div>\n","import { Directive, effect, ElementRef, inject, input } from '@angular/core';\nimport { SortFilterType } from '@koalarx/ui/core/models';\n\n@Directive({ selector: 'td[klSortedItem]' })\nexport class SortedItem {\n  private readonly elementRef = inject<ElementRef<HTMLTableCellElement>>(\n    ElementRef<HTMLTableCellElement>\n  );\n\n  klSortedItem = input.required<SortFilterType | null>();\n  sortedPropName = input.required<string>();\n\n  constructor() {\n    effect(() => {\n      const isSorted = this.klSortedItem()?.orderBy === this.sortedPropName();\n\n      this.elementRef.nativeElement.classList.toggle('sorted', isSorted);\n\n      if (isSorted) {\n        this.elementRef.nativeElement.setAttribute('aria-sort', 'ascending');\n      } else {\n        this.elementRef.nativeElement.setAttribute('aria-sort', 'descending');\n      }\n    });\n  }\n}\n","import { effect, Injectable, signal } from '@angular/core';\n\nexport interface FilterData {\n  templateValue: string;\n  propName: string;\n  value: any;\n}\n\n@Injectable()\nexport class DatatableFilter {\n  private readonly _payload = signal<Record<string, any>>({});\n  private readonly _filters = signal<FilterData[]>([]);\n\n  constructor() {\n    effect(() => {\n      const filters = this._filters();\n\n      filters.forEach((filter) => {\n        this._payload.update((current) => {\n          return {\n            ...current,\n            [filter.propName]: filter.value,\n          };\n        });\n      });\n    });\n  }\n\n  get payload() {\n    return this._payload.asReadonly();\n  }\n\n  get filters() {\n    return this._filters.asReadonly();\n  }\n\n  setFilters(filters: FilterData[]) {\n    this._filters.set(filters);\n  }\n\n  removeFilter(propName: string) {\n    this._filters.update((current) => {\n      return current.filter((filter) => filter.propName !== propName);\n    });\n  }\n\n  clearFilters() {\n    this._filters.set([]);\n    this._payload.set({});\n  }\n}\n","import { Injectable } from '@angular/core';\nimport { FilterData } from './datatable-filter';\n\n@Injectable()\nexport class FilterFactory {\n  private readonly _filter: FilterData[] = [];\n\n  get filter() {\n    return [...this._filter];\n  }\n\n  setFilters<T>(\n    filter: T,\n    templateNameFn: (propName: keyof typeof filter, value: any) => string\n  ) {\n    const filterData = filter as Record<string, any>;\n\n    Object.keys(filterData).forEach((propName) => {\n      const value = filterData[propName];\n\n      if (value === null || value === undefined || value === '') {\n        return;\n      }\n\n      const templateValue = templateNameFn(propName as any, value);\n      this.addFilter({ templateValue, propName, value });\n    });\n\n    return this._filter;\n  }\n\n  addFilter(filter: FilterData) {\n    this._filter.push(filter);\n  }\n\n  toPayload(data: FilterData[]): Record<string, any> {\n    return data.reduce((acc, curr) => {\n      acc[curr.propName] = curr.value;\n      return acc;\n    }, {} as Record<string, any>);\n  }\n}\n","import { Component, effect, inject, input, output } from '@angular/core';\nimport { Tooltip } from '@koalarx/ui/shared/directives';\nimport { DatatableFilter, FilterData } from './datatable-filter';\nimport { AppConfig } from '@koalarx/ui/core/config';\n\n@Component({\n  selector: 'kl-filter',\n  templateUrl: './filter.html',\n  providers: [DatatableFilter],\n  imports: [Tooltip],\n})\nexport class Filter {\n  readonly translations = inject(AppConfig).translation.datatable;\n\n  datatableFilter = inject(DatatableFilter);\n  filter = input<FilterData[]>([]);\n  payload = output<Record<string, any>>();\n  addFilter = output<FilterData[]>();\n\n  constructor() {\n    effect(() => this.datatableFilter.setFilters(this.filter()));\n    effect(() => this.payload.emit(this.datatableFilter.payload()));\n  }\n\n  add() {\n    this.addFilter.emit(this.datatableFilter.filters());\n  }\n}\n","@if (datatableFilter.filters().length > 0) {\n  <div class=\"p-2 pr-8 pl-8 border-b border-neutral-200 dark:border-neutral-700 w-full flex items-center gap-3 text-neutral-500 dark:text-neutral-300\">\n\n    <button class=\"hover:cursor-pointer\"\n      [tooltip]=\"translations.clearFilterTooltip\"\n      tooltipPosition=\"right\"\n      (click)=\"datatableFilter.clearFilters()\">\n      <i class=\"fa-solid fa-filter-circle-xmark\"></i>\n    </button>\n\n    <div class=\"flex items-center gap-1\">\n      @for (item of datatableFilter.filters(); track $index) {\n        <div class=\"badge badge-ghost text-xs\">\n          <span>{{item.templateValue}}</span>\n          <button class=\"hover:cursor-pointer\" (click)=\"datatableFilter.removeFilter(item.propName)\">\n            <i class=\"fa-solid fa-xmark\"></i>\n          </button>\n        </div>\n      }\n    </div>\n\n    <button class=\"hover:cursor-pointer\"\n      [tooltip]=\"translations.addFilterTooltip\"\n      tooltipPosition=\"right\"\n      (click)=\"add()\">\n      <i class=\"fa-solid fa-circle-plus\"></i>\n    </button>\n  </div>\n}\n","import {\n  booleanAttribute,\n  Component,\n  computed,\n  effect,\n  inject,\n  input,\n  model,\n  output,\n  signal,\n  Type,\n} from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { AppConfig } from '@koalarx/ui/core/config';\nimport { SideWindow } from '@koalarx/ui/shared/components/side-window';\nimport { FilterData } from './filter/datatable-filter';\nimport { Filter } from './filter/filter';\n\n@Component({\n  selector: 'kl-datatable',\n  templateUrl: './datatable.html',\n  imports: [FormsModule, Filter],\n})\nexport class Datatable {\n  private readonly sideWindow = inject(SideWindow);\n\n  readonly translations = inject(AppConfig).translation.datatable;\n\n  currentPage = input.required<number>();\n  totalItems = input.required<number>();\n  totalItemsOnPage = input.required<number>();\n  currentPageSize = input.required<number>();\n  isLoading = input.required();\n  colspan = input.required<number>();\n  componentFilter = input<Type<any>>();\n  withPaginator = input(false, { transform: booleanAttribute });\n  filter = signal<FilterData[]>([]);\n  pageSize = model<number>(0);\n  pageSizes = [10, 20, 30, 50, 100];\n\n  skeletonRows = computed(() => [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);\n  skeletonCols = computed(() => {\n    return Array.from({ length: this.colspan() }, (_, i) => i);\n  });\n\n  paginator = computed(() => {\n    const isLoading = this.isLoading();\n    const paginator: number[] = [];\n\n    if (!isLoading) {\n      const firstPage = 1;\n      const previousPage = this.currentPage() - 1;\n      const currentPage = this.currentPage();\n      const nextPage = this.currentPage() + 1;\n      const lastPage = Math.ceil(this.totalItems() / this.currentPageSize());\n\n      if (firstPage < currentPage) {\n        paginator.push(firstPage);\n      }\n\n      if (previousPage > firstPage) {\n        paginator.push(previousPage);\n      }\n\n      paginator.push(currentPage);\n\n      if (nextPage < lastPage) {\n        paginator.push(nextPage);\n      }\n\n      if (lastPage > currentPage) {\n        paginator.push(lastPage);\n      }\n    }\n\n    return paginator;\n  });\n\n  pageChange = output<number>();\n  pageSizeChange = output<number>();\n  filterChange = output<Record<string, any>>();\n  reloadList = output<void>();\n\n  constructor() {\n    effect(() => this.pageSize.set(this.currentPageSize()));\n    effect(() => this.pageSizeChange.emit(this.pageSize()));\n    effect(() => this.pageChange.emit(this.currentPage()));\n  }\n\n  openFilter(data?: FilterData[]) {\n    const component = this.componentFilter();\n\n    if (!component) {\n      return;\n    }\n\n    this.sideWindow.open(component, {\n      data,\n      afterClosed: {\n        trigger: [],\n        callback: (filters: FilterData[]) => this.filter.set(filters),\n      },\n    });\n  }\n}\n","<div class=\"flex flex-col h-full\">\n  <div class=\"pr-8 pl-1 pt-0 pb-0 border-b border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between z-10\">\n    <div class=\"datatable-menu flex items-center p-2 opacity-80\">\n      <div class=\"addicional-options-menu flex items-center opacity-80\">\n        <ng-content select=\"[menu]\" />\n      </div>\n\n      <span class=\"datatable-separator-menu relative top-[-0.10rem] pl-3 pr-2 opacity-60\">|</span>\n\n      @if (componentFilter()) {\n        <button class=\"btn btn-ghost btn-xs text-sm font-light\"\n          (click)=\"openFilter()\">\n          <i class=\"fa-solid fa-filter text-xs\"></i>\n          {{translations.btnFilterLabel}}\n        </button>\n      }\n\n      <button class=\"btn btn-ghost btn-xs text-sm font-light\"\n        (click)=\"reloadList.emit()\">\n        <i class=\"fa-solid fa-rotate-right text-xs\"></i>\n        {{translations.reloadListTooltip}}\n      </button>\n    </div>\n\n    @if (!withPaginator()) {\n      <div class=\"flex items-center justify-end gap-3 text-sm\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-md p-0 pl-2 pr-8 h-[1.5rem] w-auto\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n    }\n  </div>\n\n  <kl-filter\n    [filter]=\"filter()\"\n    (addFilter)=\"openFilter($event)\"\n    (payload)=\"filterChange.emit($event)\"\n  />\n\n  <div class=\"overflow-x-auto h-full\">\n    <table class=\"table table-sm table-pin-rows\">\n      <thead>\n        <tr class=\"text-xs\">\n          <ng-content select=\"[head]\" />\n        </tr>\n      </thead>\n      <tbody>\n        @if (isLoading()) {\n          @for (row of skeletonRows(); track $index) {\n            <tr>\n              @for (col of skeletonCols(); track $index) {\n                <td><span class=\"block skeleton w-full h-4\"></span></td>\n              }\n            </tr>\n          }\n        } @else {\n          <ng-content select=\"[body]\" />\n        }\n      </tbody>\n    </table>\n  </div>\n\n  @if (withPaginator()) {\n    <div class=\"px-4 py-2 border-t border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between\">\n      <div class=\"flex items-center justify-end gap-3 text-xs\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-sm p-0 pl-2 pr-0 w-15 h-[1.5rem]\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n\n      <div class=\"join flex items-center\">\n        <button class=\"join-item btn btn-sm\"\n          [disabled]=\"paginator()[0] === currentPage()\"\n          (click)=\"pageChange.emit(currentPage() - 1)\">\n          «\n        </button>\n\n        @for (page of paginator(); track $index) {\n          <button class=\"join-item btn btn-sm\"\n            [class.btn-disabled]=\"page === currentPage()\"\n            (click)=\"pageChange.emit(page)\">\n            {{page}}\n          </button>\n        }\n\n        <button class=\"join-item btn btn-sm\"\n          [disabled]=\"paginator()[paginator().length - 1] === currentPage()\"\n          (click)=\"pageChange.emit(currentPage() + 1)\">\n          »\n        </button>\n      </div>\n    </div>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"koalarx-ui-shared-components-datatable.mjs","sources":["../../projects/koala-ui/shared/components/datatable/sort-column/ordered-column.state.ts","../../projects/koala-ui/shared/components/datatable/sort-column/sort-header-column.ts","../../projects/koala-ui/shared/components/datatable/sort-column/sort-header-column.html","../../projects/koala-ui/shared/components/datatable/sort-column/sorted-item.ts","../../projects/koala-ui/shared/components/datatable/filter/datatable-filter.ts","../../projects/koala-ui/shared/components/datatable/filter/filter-factory.ts","../../projects/koala-ui/shared/components/datatable/filter/filter.ts","../../projects/koala-ui/shared/components/datatable/filter/filter.html","../../projects/koala-ui/shared/components/datatable/datatable.ts","../../projects/koala-ui/shared/components/datatable/datatable.html","../../projects/koala-ui/shared/components/datatable/koalarx-ui-shared-components-datatable.ts"],"sourcesContent":["import { SortHeaderColumn } from './sort-header-column';\r\n\r\nexport class OrderedColumnState {\r\n  static current?: SortHeaderColumn;\r\n}\r\n","import {\n  Component,\n  effect,\n  ElementRef,\n  input,\n  output,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport {\n  QueryPaginationDirection,\n  SortFilterType,\n} from '@koalarx/ui/core/models';\nimport { OrderedColumnState } from './ordered-column.state';\n\n@Component({\n  selector: 'kl-sort-header-column',\n  templateUrl: './sort-header-column.html',\n})\nexport class SortHeaderColumn {\n  orderBy = input.required<string>();\n  style = input('');\n  defaultDirection = input<QueryPaginationDirection>();\n  sortable = output<SortFilterType>();\n  elOrderedColumn =\n    viewChild<ElementRef<HTMLTableCellElement>>('orderedColumn');\n  direction = signal<QueryPaginationDirection | null>(null);\n\n  constructor() {\n    effect(() => {\n      const defaultDirection = this.defaultDirection();\n\n      if (defaultDirection) {\n        this.direction.set(defaultDirection);\n        OrderedColumnState.current = this;\n        this.toogleColumnStateOrder('set');\n      }\n    });\n  }\n\n  sort() {\n    this.direction.update((current) => {\n      if (\n        OrderedColumnState.current &&\n        OrderedColumnState.current.orderBy !== this.orderBy\n      ) {\n        OrderedColumnState.current.direction.set(null);\n        OrderedColumnState.current.toogleColumnStateOrder('unset');\n      }\n\n      OrderedColumnState.current = this;\n\n      let direction: QueryPaginationDirection;\n\n      switch (current) {\n        case 'asc':\n          direction = 'desc';\n          break;\n        case 'desc':\n        default:\n          direction = 'asc';\n      }\n\n      this.toogleColumnStateOrder('set');\n\n      this.sortable.emit({\n        orderBy: this.orderBy(),\n        direction,\n      });\n\n      return direction;\n    });\n  }\n\n  async toogleColumnStateOrder(state: 'set' | 'unset') {\n    const columnElement = this.elOrderedColumn()?.nativeElement.parentElement;\n\n    if (!columnElement) {\n      return;\n    }\n\n    if (state === 'set') {\n      columnElement.classList.add('ordered-column');\n    } else {\n      columnElement.classList.remove('ordered-column');\n    }\n  }\n}\n","<div #orderedColumn [style]=\"style()\" class=\"flex items-center justify-start gap-1 py-2 px-3 cursor-pointer\"\n  [class.not-ordered]=\"direction() === null\"\n  [class.asc]=\"direction() === 'asc'\"\n  [class.desc]=\"direction() === 'desc'\"\n  (click)=\"sort()\">\n\n  @switch (direction()) {\n    @case ('asc') {\n      <i class=\"fa-solid fa-arrow-down-short-wide\"></i>\n    }\n    @case ('desc') {\n      <i class=\"fa-solid fa-arrow-down-wide-short\"></i>\n    }\n    @default {\n      <i class=\"fa-solid fa-sort\"></i>\n    }\n  }\n\n  <ng-content />\n</div>\n","import { Directive, effect, ElementRef, inject, input } from '@angular/core';\nimport { SortFilterType } from '@koalarx/ui/core/models';\n\n@Directive({ selector: 'td[klSortedItem]' })\nexport class SortedItem {\n  private readonly elementRef = inject<ElementRef<HTMLTableCellElement>>(\n    ElementRef<HTMLTableCellElement>\n  );\n\n  klSortedItem = input.required<SortFilterType | null>();\n  sortedPropName = input.required<string>();\n\n  constructor() {\n    effect(() => {\n      const isSorted = this.klSortedItem()?.orderBy === this.sortedPropName();\n\n      this.elementRef.nativeElement.classList.toggle('sorted', isSorted);\n\n      if (isSorted) {\n        this.elementRef.nativeElement.setAttribute('aria-sort', 'ascending');\n      } else {\n        this.elementRef.nativeElement.setAttribute('aria-sort', 'descending');\n      }\n    });\n  }\n}\n","import { effect, Injectable, signal } from '@angular/core';\n\nexport interface FilterData {\n  templateValue: string;\n  propName: string;\n  value: any;\n}\n\n@Injectable()\nexport class DatatableFilter {\n  private readonly _payload = signal<Record<string, any>>({});\n  private readonly _filters = signal<FilterData[]>([]);\n\n  constructor() {\n    effect(() => {\n      const filters = this._filters();\n\n      filters.forEach((filter) => {\n        this._payload.update((current) => {\n          return {\n            ...current,\n            [filter.propName]: filter.value,\n          };\n        });\n      });\n    });\n  }\n\n  get payload() {\n    return this._payload.asReadonly();\n  }\n\n  get filters() {\n    return this._filters.asReadonly();\n  }\n\n  setFilters(filters: FilterData[]) {\n    this._filters.set(filters);\n  }\n\n  removeFilter(propName: string) {\n    this._filters.update((current) => {\n      return current.filter((filter) => filter.propName !== propName);\n    });\n  }\n\n  clearFilters() {\n    this._filters.set([]);\n    this._payload.set({});\n  }\n}\n","import { Injectable } from '@angular/core';\nimport { FilterData } from './datatable-filter';\n\n@Injectable()\nexport class FilterFactory {\n  private readonly _filter: FilterData[] = [];\n\n  get filter() {\n    return [...this._filter];\n  }\n\n  setFilters<T>(\n    filter: T,\n    templateNameFn: (propName: keyof typeof filter, value: any) => string\n  ) {\n    const filterData = filter as Record<string, any>;\n\n    Object.keys(filterData).forEach((propName) => {\n      const value = filterData[propName];\n\n      if (value === null || value === undefined || value === '') {\n        return;\n      }\n\n      const templateValue = templateNameFn(propName as any, value);\n      this.addFilter({ templateValue, propName, value });\n    });\n\n    return this._filter;\n  }\n\n  addFilter(filter: FilterData) {\n    this._filter.push(filter);\n  }\n\n  toPayload(data: FilterData[]): Record<string, any> {\n    return data.reduce((acc, curr) => {\n      acc[curr.propName] = curr.value;\n      return acc;\n    }, {} as Record<string, any>);\n  }\n}\n","import { Component, effect, inject, input, output } from '@angular/core';\nimport { Tooltip } from '@koalarx/ui/shared/directives';\nimport { DatatableFilter, FilterData } from './datatable-filter';\nimport { AppConfig } from '@koalarx/ui/core/config';\n\n@Component({\n  selector: 'kl-filter',\n  templateUrl: './filter.html',\n  providers: [DatatableFilter],\n  imports: [Tooltip],\n})\nexport class Filter {\n  readonly translations = inject(AppConfig).translation.datatable;\n\n  datatableFilter = inject(DatatableFilter);\n  filter = input<FilterData[]>([]);\n  payload = output<Record<string, any>>();\n  addFilter = output<FilterData[]>();\n\n  constructor() {\n    effect(() => this.datatableFilter.setFilters(this.filter()));\n    effect(() => this.payload.emit(this.datatableFilter.payload()));\n  }\n\n  add() {\n    this.addFilter.emit(this.datatableFilter.filters());\n  }\n}\n","@if (datatableFilter.filters().length > 0) {\n  <div class=\"p-2 pr-8 pl-8 border-b border-neutral-200 dark:border-neutral-700 w-full flex items-center gap-3 text-neutral-500 dark:text-neutral-300\">\n\n    <button class=\"hover:cursor-pointer\"\n      [tooltip]=\"translations.clearFilterTooltip\"\n      tooltipPosition=\"right\"\n      (click)=\"datatableFilter.clearFilters()\">\n      <i class=\"fa-solid fa-filter-circle-xmark\"></i>\n    </button>\n\n    <div class=\"flex items-center gap-1\">\n      @for (item of datatableFilter.filters(); track $index) {\n        <div class=\"badge badge-ghost text-xs\">\n          <span>{{item.templateValue}}</span>\n          <button class=\"hover:cursor-pointer\" (click)=\"datatableFilter.removeFilter(item.propName)\">\n            <i class=\"fa-solid fa-xmark\"></i>\n          </button>\n        </div>\n      }\n    </div>\n\n    <button class=\"hover:cursor-pointer\"\n      [tooltip]=\"translations.addFilterTooltip\"\n      tooltipPosition=\"right\"\n      (click)=\"add()\">\n      <i class=\"fa-solid fa-circle-plus\"></i>\n    </button>\n  </div>\n}\n","import {\n  booleanAttribute,\n  Component,\n  computed,\n  effect,\n  inject,\n  input,\n  model,\n  output,\n  signal,\n  Type,\n} from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { AppConfig } from '@koalarx/ui/core/config';\nimport { SideWindow } from '@koalarx/ui/shared/components/side-window';\nimport { Button, ButtonColor } from '@koalarx/ui/shared/directives';\nimport { FilterData } from './filter/datatable-filter';\nimport { Filter } from './filter/filter';\n\n@Component({\n  selector: 'kl-datatable',\n  templateUrl: './datatable.html',\n  imports: [FormsModule, Filter, Button],\n})\nexport class Datatable {\n  private readonly sideWindow = inject(SideWindow);\n\n  readonly translations = inject(AppConfig).translation.datatable;\n\n  currentPage = input.required<number>();\n  totalItems = input.required<number>();\n  totalItemsOnPage = input.required<number>();\n  currentPageSize = input.required<number>();\n  isLoading = input.required();\n  colspan = input.required<number>();\n  loadMoreBtnColor = input<ButtonColor>('accent');\n  componentFilter = input<Type<any>>();\n  withPaginator = input(false, { transform: booleanAttribute });\n  filter = signal<FilterData[]>([]);\n  pageSize = model<number>(0);\n  pageSizes = [10, 20, 30, 50, 100];\n\n  skeletonRows = computed(() => [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);\n  skeletonCols = computed(() => {\n    return Array.from({ length: this.colspan() }, (_, i) => i);\n  });\n\n  lastPage = computed(() => {\n    const isLoading = this.isLoading();\n\n    if (!isLoading) {\n      return Math.ceil(this.totalItems() / this.currentPageSize());\n    }\n\n    return 1;\n  });\n\n  pageChange = output<number>();\n  pageSizeChange = output<number>();\n  filterChange = output<Record<string, any>>();\n  reloadList = output<void>();\n  loadMore = output<void>();\n\n  constructor() {\n    effect(() => this.pageSize.set(this.currentPageSize()));\n    effect(() => this.pageSizeChange.emit(this.pageSize()));\n    effect(() => this.pageChange.emit(this.currentPage()));\n  }\n\n  openFilter(data?: FilterData[]) {\n    const component = this.componentFilter();\n\n    if (!component) {\n      return;\n    }\n\n    this.sideWindow.open(component, {\n      data,\n      afterClosed: {\n        trigger: [],\n        callback: (filters: FilterData[]) => this.filter.set(filters),\n      },\n    });\n  }\n}\n","<div class=\"flex flex-col h-full\">\n  <div class=\"pr-8 pl-1 pt-0 pb-0 border-b border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between z-10\">\n    <div class=\"datatable-menu flex items-center p-2 opacity-80 gap-2\">\n      <div class=\"addicional-options-menu flex items-center opacity-80\">\n        <ng-content select=\"[menu]\" />\n      </div>\n\n      <span class=\"datatable-separator-menu relative top-[-0.10rem] opacity-20\">|</span>\n\n      @if (componentFilter()) {\n        <button class=\"btn btn-neutral btn-xs text-sm font-light\"\n          (click)=\"openFilter()\">\n          <i class=\"fa-solid fa-filter text-xs\"></i>\n          {{translations.btnFilterLabel}}\n        </button>\n      }\n\n      <button class=\"btn btn-outline border-neutral-300 hover:border-neutral-500 dark:border-neutral-700 btn-xs text-sm font-light\"\n        (click)=\"reloadList.emit()\">\n        <i class=\"fa-solid fa-rotate-right text-xs\"></i>\n        {{translations.reloadListTooltip}}\n      </button>\n    </div>\n\n    @if (!withPaginator()) {\n      <div class=\"flex items-center justify-end gap-3 text-sm\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-md p-0 pl-2 pr-8 h-[1.5rem] w-auto\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n    }\n  </div>\n\n  <kl-filter\n    [filter]=\"filter()\"\n    (addFilter)=\"openFilter($event)\"\n    (payload)=\"filterChange.emit($event)\"\n  />\n\n  <div class=\"overflow-x-auto h-full bg-base-200\">\n    <table class=\"table table-sm table-pin-rows\">\n      <thead>\n        <tr class=\"text-xs bg-base-200\">\n          <ng-content select=\"[head]\" />\n        </tr>\n      </thead>\n      <tbody>\n        <ng-content select=\"[body]\" />\n\n        @if (!withPaginator() && !isLoading() && totalItemsOnPage() < totalItems()) {\n          <tr>\n            <td colspan=\"7\">\n              <button\n                klButton\n                outline\n                [color]=\"loadMoreBtnColor()\"\n                class=\"w-full\"\n                (click)=\"loadMore.emit()\">\n                {{translations.loadMoreBtnLabel}}\n              </button>\n            </td>\n          </tr>\n        }\n\n        @if (isLoading()) {\n          @for (row of skeletonRows(); track $index) {\n            <tr>\n              @for (col of skeletonCols(); track $index) {\n                <td><span class=\"block skeleton w-full h-4\"></span></td>\n              }\n            </tr>\n          }\n        }\n      </tbody>\n    </table>\n  </div>\n\n  @if (withPaginator()) {\n    <div class=\"px-4 py-2 bg-base-200 border-t border-neutral-200 dark:border-neutral-700 w-full flex items-center justify-between\">\n      <div class=\"flex items-center justify-end gap-3 text-xs\">\n        <span class=\"flex items-center justify-end gap-1 opacity-60\">\n          <span>{{translations.labelItemsPerPage}}:</span>\n\n          <select class=\"select select-sm p-0 pl-2 pr-0 w-15 h-[1.5rem]\" [(ngModel)]=\"pageSize\">\n            @for (item of pageSizes; track $index) {\n              <option [value]=\"item\">{{ item }}</option>\n            }\n          </select>\n        </span>\n        <span class=\"opacity-60\">|</span>\n        <span class=\"opacity-60\">{{totalItemsOnPage()}} de {{totalItems()}}</span>\n      </div>\n\n      <div class=\"flex items-center gap-8\">\n        <span class=\"text-xs opacity-60\">{{translations.paginatorPagesFeedback(currentPage(), lastPage())}}</span>\n\n        <div class=\"join flex items-center\">\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === 1\"\n            (click)=\"pageChange.emit(1)\">\n            <i class=\"fa-solid fa-angles-left text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === 1\"\n            (click)=\"pageChange.emit(currentPage() - 1)\">\n            <i class=\"fa-solid fa-chevron-left text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === lastPage()\"\n            (click)=\"pageChange.emit(currentPage() + 1)\">\n            <i class=\"fa-solid fa-angle-right text-[0.6rem]\"></i>\n          </button>\n\n          <button class=\"join-item btn btn-sm\"\n            [disabled]=\"currentPage() === lastPage()\"\n            (click)=\"pageChange.emit(lastPage())\">\n            <i class=\"fa-solid fa-angles-right text-[0.6rem]\"></i>\n          </button>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/koalarx-ui.mjs

@@ -52,6 +52,8 @@ const en = {
         addFilterTooltip: 'Add filter',
         reloadListTooltip: 'Reload data',
         labelItemsPerPage: 'Items per page limit',
+        loadMoreBtnLabel: 'Load more',
+        paginatorPagesFeedback: (currentPage, lastPage) => `Page ${currentPage} of ${lastPage}`,
     },
     feedbackRequestInterceptor: {
         '400': 'An error occurred related to the submitted data',
@@ -97,6 +99,8 @@ const ptBr = {
         addFilterTooltip: 'Adicionar filtro',
         reloadListTooltip: 'Recarregar dados',
         labelItemsPerPage: 'Limite de itens por carregamento',
+        loadMoreBtnLabel: 'Carregar mais',
+        paginatorPagesFeedback: (currentPage, lastPage) => `Página ${currentPage} de ${lastPage}`,
     },
     feedbackRequestInterceptor: {
         '400': 'Ocorreu um erro relacionado aos dados enviados',

package/fesm2022/koalarx-ui.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"koalarx-ui.mjs","sources":["../../projects/koala-ui/core/interceptors/feedback-request-interceptor.ts","../../projects/koala-ui/core/translations/en.ts","../../projects/koala-ui/core/translations/ptbr.ts","../../projects/koala-ui/core/translations/get-translation-by-language.ts","../../projects/koala-ui/core/koala-provider.ts","../../projects/koala-ui/koalarx-ui.ts"],"sourcesContent":["import {\n  HttpInterceptor as AngularHttpInterceptor,\n  HttpEvent,\n  HttpHandler,\n  HttpRequest,\n} from '@angular/common/http';\nimport { inject, Injectable } from '@angular/core';\nimport { HttpErrorFeedbackAlert } from '@koalarx/ui/shared/utils';\nimport { Observable } from 'rxjs/internal/Observable';\nimport { tap } from 'rxjs/internal/operators/tap';\n\n@Injectable()\nexport class FeedbackRequestInterceptor implements AngularHttpInterceptor {\n  private readonly httpError = inject(HttpErrorFeedbackAlert);\n\n  intercept(\n    request: HttpRequest<any>,\n    next: HttpHandler\n  ): Observable<HttpEvent<any>> {\n    return next.handle(request.clone()).pipe(\n      tap({\n        error: (error) => this.httpError.tapError(error),\n      })\n    );\n  }\n}\n","import { Translation } from './translation.model';\n\nexport const en: Translation = {\n  confirm: {\n    btnLabelYes: 'Yes',\n    btnLabelNo: 'No',\n  },\n  codeViewer: {\n    copyToClipboard: 'Copy to clipboard',\n    copiedToClipboard: 'Copied to clipboard',\n  },\n  form: {\n    required: 'This field is required.',\n    invalidEmail: 'Invalid email address',\n    invalidMinLength: (minLength: number) =>\n      `The field must have at least ${minLength} characters.`,\n    invalidCPF: 'Invalid CPF',\n    invalidCNPJ: 'Invalid CNPJ',\n    invalidURL: 'Invalid URL',\n    invalidPasswordHasSpecialCharacters:\n      'The password must contain special characters.',\n    invalidPasswordHasLowercase: 'The password must contain lowercase letters.',\n    invalidPasswordHasUppercase: 'The password must contain uppercase letters.',\n    invalidPasswordHasNumber: 'The password must contain numbers.',\n    invalidConfirmPassword: 'The confirmation password does not match.',\n  },\n  onThisPage: {\n    title: 'On this page',\n  },\n  datatable: {\n    btnFilterLabel: 'Filter',\n    clearFilterTooltip: 'Clear filters',\n    addFilterTooltip: 'Add filter',\n    reloadListTooltip: 'Reload data',\n    labelItemsPerPage: 'Items per page limit',\n  },\n  feedbackRequestInterceptor: {\n    '400': 'An error occurred related to the submitted data',\n    '401': 'Unauthorized access, please log in again.',\n    '403': 'Access denied.',\n    '404': 'No record found from the provided data.',\n    '409': 'This record already exists',\n    '422': 'Validation error in the submitted data.',\n    '500': 'Please contact our support via WhatsApp.',\n    '0': 'We identified an instability in communication with our server, this may occur due to rapid internet drops, slow connection, or server overload, please try again.',\n    unknowError: 'An unknown error occurred, please try again.',\n  },\n};\n","import { Translation } from './translation.model';\n\nexport const ptBr: Translation = {\n  confirm: {\n    btnLabelYes: 'Sim',\n    btnLabelNo: 'Não',\n  },\n  codeViewer: {\n    copyToClipboard: 'Copiar',\n    copiedToClipboard: 'Copiado',\n  },\n  form: {\n    required: 'O campo é obrigatório.',\n    invalidEmail: 'E-mail inválido',\n    invalidMinLength: (minLength: number) =>\n      `O campo deve ter no mínimo ${minLength} caracteres.`,\n    invalidCPF: 'CPF inválido',\n    invalidCNPJ: 'CNPJ inválido',\n    invalidURL: 'URL inválida',\n    invalidPasswordHasSpecialCharacters:\n      'A senha deve conter caracteres especiais.',\n    invalidPasswordHasLowercase: 'A senha deve conter letras minúsculas.',\n    invalidPasswordHasUppercase: 'A senha deve conter letras maiúsculas.',\n    invalidPasswordHasNumber: 'A senha deve conter números.',\n    invalidConfirmPassword: 'A confirmação da senha não confere.',\n  },\n  onThisPage: {\n    title: 'Nesta página',\n  },\n  datatable: {\n    btnFilterLabel: 'Filtro',\n    clearFilterTooltip: 'Limpar filtros',\n    addFilterTooltip: 'Adicionar filtro',\n    reloadListTooltip: 'Recarregar dados',\n    labelItemsPerPage: 'Limite de itens por carregamento',\n  },\n  feedbackRequestInterceptor: {\n    '400': 'Ocorreu um erro relacionado aos dados enviados',\n    '401': 'Acesso não autorizado, por favor, faça login novamente.',\n    '403': 'Acesso negado.',\n    '404': 'Nenhum registro encontrado a partir dos dados informados.',\n    '409': 'Este registro já existe',\n    '422': 'Erro de validação nos dados enviados.',\n    '500': 'Entre em contato com nosso suporte pelo canal do whatsapp.',\n    '0': 'Identificamos uma instabilidade na comunicação com nosso servidor, isto pode ocorrer devido a rápidas quedas de internet, conexão lenta ou sobrecarga no servidor, por favor, tente novamente.',\n    unknowError: 'Ocorreu um erro desconhecido, por favor, tente novamente.',\n  },\n};\n","import { en } from './en';\nimport { ptBr } from './ptbr';\nimport { Translation } from './translation.model';\n\nexport type KoalaLanguage = 'en' | 'ptBr';\n\nexport function getTranslationByLanguage(language: KoalaLanguage): Translation {\n  switch (language) {\n    case 'en':\n      return en;\n    case 'ptBr':\n      return ptBr;\n  }\n}\n","import {\n  HTTP_INTERCEPTORS,\n  HttpClient,\n  provideHttpClient,\n  withInterceptorsFromDi,\n} from '@angular/common/http';\nimport { Provider } from '@angular/core';\nimport { AppConfig } from '@koalarx/ui/core/config';\nimport { HttpClientErrorsMiddleware } from '@koalarx/ui/core/middlewares';\nimport { MARKED_OPTIONS, provideMarkdown } from 'ngx-markdown';\nimport { NgxMaskConfig, provideEnvironmentNgxMask } from 'ngx-mask';\nimport { FeedbackRequestInterceptor } from './interceptors/feedback-request-interceptor';\nimport { getTranslationByLanguage, KoalaLanguage } from './translations';\n\nconst maskOptions: Partial<NgxMaskConfig> = {\n  validation: false,\n  thousandSeparator: '.',\n};\n\ninterface KoalaSettings {\n  hostApi?: string;\n  language?: KoalaLanguage;\n  httpClientErrorsMiddleware?: HttpClientErrorsMiddleware;\n}\n\nexport function provideKoala(config?: KoalaSettings): Provider {\n  const appConfig = new AppConfig();\n\n  appConfig.language = config?.language ?? 'en';\n  appConfig.translation = getTranslationByLanguage(config?.language ?? 'en');\n  appConfig.hostApi = config?.hostApi;\n  appConfig.httpClientErrorsMiddleware = config?.httpClientErrorsMiddleware;\n\n  return [\n    provideEnvironmentNgxMask(maskOptions),\n    provideHttpClient(withInterceptorsFromDi()),\n    provideMarkdown({\n      loader: HttpClient,\n      markedOptions: {\n        provide: MARKED_OPTIONS,\n        useValue: {\n          gfm: true,\n          breaks: true,\n          pedantic: false,\n        },\n      },\n    }),\n    {\n      provide: HTTP_INTERCEPTORS,\n      useClass: FeedbackRequestInterceptor,\n      multi: true,\n    },\n    {\n      provide: AppConfig,\n      useValue: appConfig,\n    },\n  ];\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"koalarx-ui.mjs","sources":["../../projects/koala-ui/core/interceptors/feedback-request-interceptor.ts","../../projects/koala-ui/core/translations/en.ts","../../projects/koala-ui/core/translations/ptbr.ts","../../projects/koala-ui/core/translations/get-translation-by-language.ts","../../projects/koala-ui/core/koala-provider.ts","../../projects/koala-ui/koalarx-ui.ts"],"sourcesContent":["import {\n  HttpInterceptor as AngularHttpInterceptor,\n  HttpEvent,\n  HttpHandler,\n  HttpRequest,\n} from '@angular/common/http';\nimport { inject, Injectable } from '@angular/core';\nimport { HttpErrorFeedbackAlert } from '@koalarx/ui/shared/utils';\nimport { Observable } from 'rxjs/internal/Observable';\nimport { tap } from 'rxjs/internal/operators/tap';\n\n@Injectable()\nexport class FeedbackRequestInterceptor implements AngularHttpInterceptor {\n  private readonly httpError = inject(HttpErrorFeedbackAlert);\n\n  intercept(\n    request: HttpRequest<any>,\n    next: HttpHandler\n  ): Observable<HttpEvent<any>> {\n    return next.handle(request.clone()).pipe(\n      tap({\n        error: (error) => this.httpError.tapError(error),\n      })\n    );\n  }\n}\n","import { Translation } from './translation.model';\n\nexport const en: Translation = {\n  confirm: {\n    btnLabelYes: 'Yes',\n    btnLabelNo: 'No',\n  },\n  codeViewer: {\n    copyToClipboard: 'Copy to clipboard',\n    copiedToClipboard: 'Copied to clipboard',\n  },\n  form: {\n    required: 'This field is required.',\n    invalidEmail: 'Invalid email address',\n    invalidMinLength: (minLength: number) =>\n      `The field must have at least ${minLength} characters.`,\n    invalidCPF: 'Invalid CPF',\n    invalidCNPJ: 'Invalid CNPJ',\n    invalidURL: 'Invalid URL',\n    invalidPasswordHasSpecialCharacters:\n      'The password must contain special characters.',\n    invalidPasswordHasLowercase: 'The password must contain lowercase letters.',\n    invalidPasswordHasUppercase: 'The password must contain uppercase letters.',\n    invalidPasswordHasNumber: 'The password must contain numbers.',\n    invalidConfirmPassword: 'The confirmation password does not match.',\n  },\n  onThisPage: {\n    title: 'On this page',\n  },\n  datatable: {\n    btnFilterLabel: 'Filter',\n    clearFilterTooltip: 'Clear filters',\n    addFilterTooltip: 'Add filter',\n    reloadListTooltip: 'Reload data',\n    labelItemsPerPage: 'Items per page limit',\n    loadMoreBtnLabel: 'Load more',\n    paginatorPagesFeedback: (currentPage: number, lastPage: number) =>\n      `Page ${currentPage} of ${lastPage}`,\n  },\n  feedbackRequestInterceptor: {\n    '400': 'An error occurred related to the submitted data',\n    '401': 'Unauthorized access, please log in again.',\n    '403': 'Access denied.',\n    '404': 'No record found from the provided data.',\n    '409': 'This record already exists',\n    '422': 'Validation error in the submitted data.',\n    '500': 'Please contact our support via WhatsApp.',\n    '0': 'We identified an instability in communication with our server, this may occur due to rapid internet drops, slow connection, or server overload, please try again.',\n    unknowError: 'An unknown error occurred, please try again.',\n  },\n};\n","import { Translation } from './translation.model';\n\nexport const ptBr: Translation = {\n  confirm: {\n    btnLabelYes: 'Sim',\n    btnLabelNo: 'Não',\n  },\n  codeViewer: {\n    copyToClipboard: 'Copiar',\n    copiedToClipboard: 'Copiado',\n  },\n  form: {\n    required: 'O campo é obrigatório.',\n    invalidEmail: 'E-mail inválido',\n    invalidMinLength: (minLength: number) =>\n      `O campo deve ter no mínimo ${minLength} caracteres.`,\n    invalidCPF: 'CPF inválido',\n    invalidCNPJ: 'CNPJ inválido',\n    invalidURL: 'URL inválida',\n    invalidPasswordHasSpecialCharacters:\n      'A senha deve conter caracteres especiais.',\n    invalidPasswordHasLowercase: 'A senha deve conter letras minúsculas.',\n    invalidPasswordHasUppercase: 'A senha deve conter letras maiúsculas.',\n    invalidPasswordHasNumber: 'A senha deve conter números.',\n    invalidConfirmPassword: 'A confirmação da senha não confere.',\n  },\n  onThisPage: {\n    title: 'Nesta página',\n  },\n  datatable: {\n    btnFilterLabel: 'Filtro',\n    clearFilterTooltip: 'Limpar filtros',\n    addFilterTooltip: 'Adicionar filtro',\n    reloadListTooltip: 'Recarregar dados',\n    labelItemsPerPage: 'Limite de itens por carregamento',\n    loadMoreBtnLabel: 'Carregar mais',\n    paginatorPagesFeedback: (currentPage: number, lastPage: number) =>\n      `Página ${currentPage} de ${lastPage}`,\n  },\n  feedbackRequestInterceptor: {\n    '400': 'Ocorreu um erro relacionado aos dados enviados',\n    '401': 'Acesso não autorizado, por favor, faça login novamente.',\n    '403': 'Acesso negado.',\n    '404': 'Nenhum registro encontrado a partir dos dados informados.',\n    '409': 'Este registro já existe',\n    '422': 'Erro de validação nos dados enviados.',\n    '500': 'Entre em contato com nosso suporte pelo canal do whatsapp.',\n    '0': 'Identificamos uma instabilidade na comunicação com nosso servidor, isto pode ocorrer devido a rápidas quedas de internet, conexão lenta ou sobrecarga no servidor, por favor, tente novamente.',\n    unknowError: 'Ocorreu um erro desconhecido, por favor, tente novamente.',\n  },\n};\n","import { en } from './en';\nimport { ptBr } from './ptbr';\nimport { Translation } from './translation.model';\n\nexport type KoalaLanguage = 'en' | 'ptBr';\n\nexport function getTranslationByLanguage(language: KoalaLanguage): Translation {\n  switch (language) {\n    case 'en':\n      return en;\n    case 'ptBr':\n      return ptBr;\n  }\n}\n","import {\n  HTTP_INTERCEPTORS,\n  HttpClient,\n  provideHttpClient,\n  withInterceptorsFromDi,\n} from '@angular/common/http';\nimport { Provider } from '@angular/core';\nimport { AppConfig } from '@koalarx/ui/core/config';\nimport { HttpClientErrorsMiddleware } from '@koalarx/ui/core/middlewares';\nimport { MARKED_OPTIONS, provideMarkdown } from 'ngx-markdown';\nimport { NgxMaskConfig, provideEnvironmentNgxMask } from 'ngx-mask';\nimport { FeedbackRequestInterceptor } from './interceptors/feedback-request-interceptor';\nimport { getTranslationByLanguage, KoalaLanguage } from './translations';\n\nconst maskOptions: Partial<NgxMaskConfig> = {\n  validation: false,\n  thousandSeparator: '.',\n};\n\ninterface KoalaSettings {\n  hostApi?: string;\n  language?: KoalaLanguage;\n  httpClientErrorsMiddleware?: HttpClientErrorsMiddleware;\n}\n\nexport function provideKoala(config?: KoalaSettings): Provider {\n  const appConfig = new AppConfig();\n\n  appConfig.language = config?.language ?? 'en';\n  appConfig.translation = getTranslationByLanguage(config?.language ?? 'en');\n  appConfig.hostApi = config?.hostApi;\n  appConfig.httpClientErrorsMiddleware = config?.httpClientErrorsMiddleware;\n\n  return [\n    provideEnvironmentNgxMask(maskOptions),\n    provideHttpClient(withInterceptorsFromDi()),\n    provideMarkdown({\n      loader: HttpClient,\n      markedOptions: {\n        provide: MARKED_OPTIONS,\n        useValue: {\n          gfm: true,\n          breaks: true,\n          pedantic: false,\n        },\n      },\n    }),\n    {\n      provide: HTTP_INTERCEPTORS,\n      useClass: FeedbackRequestInterceptor,\n      multi: true,\n    },\n    {\n      provide: AppConfig,\n      useValue: appConfig,\n    },\n  ];\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koalarx/ui",
-  "version": "20.0.41",
+  "version": "20.0.43",
   "peerDependencies": {
     "@angular/common": ">=20.0.0",
     "@angular/core": ">=20.0.0"

package/shared/components/datatable/index.d.ts

@@ -1,6 +1,7 @@
 import * as _angular_core from '@angular/core';
 import { ElementRef, Type } from '@angular/core';
 import { QueryPaginationDirection, SortFilterType } from '@koalarx/ui/core/models';
+import { ButtonColor } from '@koalarx/ui/shared/directives';
 
 declare class SortHeaderColumn {
     orderBy: _angular_core.InputSignal<string>;
@@ -64,6 +65,8 @@ declare class Filter {
         addFilterTooltip: string;
         reloadListTooltip: string;
         labelItemsPerPage: string;
+        loadMoreBtnLabel: string;
+        paginatorPagesFeedback: (currentPage: number, lastPage: number) => string;
     };
     datatableFilter: DatatableFilter;
     filter: _angular_core.InputSignal<FilterData[]>;
@@ -83,6 +86,8 @@ declare class Datatable {
         addFilterTooltip: string;
         reloadListTooltip: string;
         labelItemsPerPage: string;
+        loadMoreBtnLabel: string;
+        paginatorPagesFeedback: (currentPage: number, lastPage: number) => string;
     };
     currentPage: _angular_core.InputSignal<number>;
     totalItems: _angular_core.InputSignal<number>;
@@ -90,6 +95,7 @@ declare class Datatable {
     currentPageSize: _angular_core.InputSignal<number>;
     isLoading: _angular_core.InputSignal<unknown>;
     colspan: _angular_core.InputSignal<number>;
+    loadMoreBtnColor: _angular_core.InputSignal<ButtonColor>;
     componentFilter: _angular_core.InputSignal<Type<any> | undefined>;
     withPaginator: _angular_core.InputSignalWithTransform<boolean, unknown>;
     filter: _angular_core.WritableSignal<FilterData[]>;
@@ -97,15 +103,16 @@ declare class Datatable {
     pageSizes: number[];
     skeletonRows: _angular_core.Signal<number[]>;
     skeletonCols: _angular_core.Signal<number[]>;
-    paginator: _angular_core.Signal<number[]>;
+    lastPage: _angular_core.Signal<number>;
     pageChange: _angular_core.OutputEmitterRef<number>;
     pageSizeChange: _angular_core.OutputEmitterRef<number>;
     filterChange: _angular_core.OutputEmitterRef<Record<string, any>>;
     reloadList: _angular_core.OutputEmitterRef<void>;
+    loadMore: _angular_core.OutputEmitterRef<void>;
     constructor();
     openFilter(data?: FilterData[]): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Datatable, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Datatable, "kl-datatable", never, { "currentPage": { "alias": "currentPage"; "required": true; "isSignal": true; }; "totalItems": { "alias": "totalItems"; "required": true; "isSignal": true; }; "totalItemsOnPage": { "alias": "totalItemsOnPage"; "required": true; "isSignal": true; }; "currentPageSize": { "alias": "currentPageSize"; "required": true; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": true; "isSignal": true; }; "colspan": { "alias": "colspan"; "required": true; "isSignal": true; }; "componentFilter": { "alias": "componentFilter"; "required": false; "isSignal": true; }; "withPaginator": { "alias": "withPaginator"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; }, { "pageSize": "pageSizeChange"; "pageChange": "pageChange"; "pageSizeChange": "pageSizeChange"; "filterChange": "filterChange"; "reloadList": "reloadList"; }, never, ["[menu]", "[head]", "[body]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Datatable, "kl-datatable", never, { "currentPage": { "alias": "currentPage"; "required": true; "isSignal": true; }; "totalItems": { "alias": "totalItems"; "required": true; "isSignal": true; }; "totalItemsOnPage": { "alias": "totalItemsOnPage"; "required": true; "isSignal": true; }; "currentPageSize": { "alias": "currentPageSize"; "required": true; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": true; "isSignal": true; }; "colspan": { "alias": "colspan"; "required": true; "isSignal": true; }; "loadMoreBtnColor": { "alias": "loadMoreBtnColor"; "required": false; "isSignal": true; }; "componentFilter": { "alias": "componentFilter"; "required": false; "isSignal": true; }; "withPaginator": { "alias": "withPaginator"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; }, { "pageSize": "pageSizeChange"; "pageChange": "pageChange"; "pageSizeChange": "pageSizeChange"; "filterChange": "filterChange"; "reloadList": "reloadList"; "loadMore": "loadMore"; }, never, ["[menu]", "[head]", "[body]"], true, never>;
 }
 
 export { Datatable, DatatableFilter, Filter, FilterFactory, OrderedColumnState, SortHeaderColumn, SortedItem };

package/theme/koala.css

@@ -51,4 +51,3 @@
 @import "./snackbar.css";
 @import "./table.css";
 @import "./code-viewer.css";
-@import "./datatable.css";

package/theme/table.css

@@ -22,5 +22,11 @@ kl-sort-header-column div:not(.not-ordered) {
 
 kl-sort-header-column.ordered-column,
 kl-datatable td.sorted {
-  background-color: var(--color-base-200);
+  background-color: var(--color-base-300);
+}
+
+kl-datatable
+  .datatable-menu:has(.addicional-options-menu:empty)
+  .datatable-separator-menu {
+  display: none;
 }

package/theme/datatable.css

@@ -1,5 +0,0 @@
-kl-datatable
-  .datatable-menu:has(.addicional-options-menu:empty)
-  .datatable-separator-menu {
-  display: none;
-}