primekit 1.0.10 → 1.0.12

package/src/lib/lib/atomix-table/atomix-table.component.ts

@@ -1,422 +0,0 @@
-import {
-  ChangeDetectorRef,
-  Component,
-  contentChild,
-  ContentChild,
-  EventEmitter,
-  Input,
-  OnChanges,
-  Output,
-  SimpleChanges,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-import type {
-  Table,
-  TablePageEvent,
-  TableRowReorderEvent,
-} from 'primeng/table';
-import { Column, Row, TableActionButton } from './atomix-table.models';
-import { ConfirmationService } from 'primeng/api';
-import { DatePipe } from '@angular/common';
-import { AtomixSnackbarComponent } from '../atomix-snackbar/atomix-snackbar.component';
-import { CheckboxChangeEvent } from 'primeng/checkbox';
-
-@Component({
-  selector: 'atomix-table',
-  templateUrl: './atomix-table.component.html',
-  styleUrls: ['./atomix-table.component.css'],
-})
-export class AtomixTableComponent implements OnChanges {
-  @ViewChild(AtomixSnackbarComponent)
-  atomixSnackbarComponent!: AtomixSnackbarComponent;
-  @Input() rows!: Row[];
-
-  // The selected table rows passed from primeng
-  selectedTableRows: Row[] | undefined;
-
-  @Input() cols!: Column[];
-  @Input() size: number = 25;
-  @Input() currentPage: number = 0;
-  @Input() expandedColumns: Column[] = [];
-
-  @Input() emptyExpandableRowMessage = '';
-
-  @Input() secondaryRowsKey = '';
-
-  @Input() title = '';
-
-  @Input() enablePaginator = false;
-
-  @Input() reorderableColumns = true;
-
-  @Input() enableReorderableRow = false;
-
-  // Empty state properties
-  @Input() emptyStateMessage: string = 'No records found';
-
-  // TODO: Enable checkboxes if we can use checkboxes and press anywhere on row.
-  // @Input() enableCheckboxes: boolean = false;
-
-  // Enables multiselect without checkboxes
-  @Input() enableMultiselect = false;
-
-  // Enables an expandable row that another table fits inside of
-  @Input() enableExpandableRow = false;
-
-  // Enables an selecting all rows when the rows are initialized
-  @Input() enableSelectAllOnInit = false;
-
-  // Enables each column to have a filter checkbox. Also adds a "Clear All" button to remove all filters.
-  @Input() enableColumnFilters = false;
-
-  @Input() isLoading: boolean = false;
-
-  @Input() pageSize = 25;
-
-  // Required as only used when totalRecords must be set
-  @Input() totalRecords!: number;
-
-  // Hide main row actions when the row has child rows (useful for expandable tables)
-  @Input() hideMainRowActionsWhenExpanded = false;
-
-  // Disable expand button for rows without child rows (when using secondaryRowsKey)
-  @Input() disableExpandWhenNoChildren = false;
-
-  // Emits the rows the user has selected
-  @Output() selectedRows: EventEmitter<Row[]> = new EventEmitter();
-
-  @Output() pageChange: EventEmitter<{ page: number; size: number }> =
-    new EventEmitter();
-
-  @Output() filterChange: EventEmitter<any> = new EventEmitter();
-
-  @Input() enableEditButtons = false;
-  @Input() enableDeleteButtons = false;
-  @Input() actionButtonConfig: {
-    enabled: boolean;
-    icon: string;
-    message?: string;
-    confirmation?: boolean;
-    class?: string;
-  } = {
-    enabled: false,
-    icon: '',
-    message: '',
-    confirmation: true,
-    class: 'p-button-rounded p-button-help',
-  };
-
-  @Output() editRow: EventEmitter<any> = new EventEmitter();
-  @Output() actionRow: EventEmitter<any> = new EventEmitter();
-  @Output() deleteRow: EventEmitter<any> = new EventEmitter();
-  @Output() actionButton: EventEmitter<Row> = new EventEmitter();
-  @Output() expandedRow: EventEmitter<Row> = new EventEmitter();
-  @Output() dropdownSelectionChanged: EventEmitter<{
-    field: string;
-    value: any;
-  }> = new EventEmitter();
-  @Output() rowReordered: EventEmitter<{
-    previousIndex: number;
-    currentIndex: number;
-  }> = new EventEmitter();
-  @Output() logButton: EventEmitter<any> = new EventEmitter();
-  @Output() pageDropdownChange = new EventEmitter<any>();
-  @Output() childRowAction = new EventEmitter<any>();
-  @ContentChild(TemplateRef) rowDataOutlet!: TemplateRef<any>;
-
-  // Sort Functionality
-  @Input() sortBy: string = '';
-  @Input() orderBy: string = '';
-  @Input() isEnableSorting: boolean = false;
-  @Output() sortHandler = new EventEmitter<any>();
-
-  // Pagination Functionality
-  options = [
-    { label: 10, value: 10 },
-    { label: 25, value: 25 },
-    { label: 50, value: 50 },
-    { label: 75, value: 75 },
-    { label: 100, value: 100 },
-    { label: 500, value: 500 },
-  ];
-  first2: number = 0;
-  rows2: number = 10;
-
-  page: number = 0;
-  @Input() showPagination: boolean = true;
-  @Input() childRowsActionButtonsData: TableActionButton[] = [];
-
-  // Action Column
-  @Input() showActionsColumn: boolean = false;
-  @Input() showExpandedActionsColumn: boolean = false;
-  @Input() actionButtonsData!: TableActionButton[];
-  @ViewChild('dt1') dt1!: Table;
-
-  @Input() getChipCss: (type: string) => string = () => '';
-  @Input() getChipIcon: (type: string) => string = () => '';
-  constructor(
-    private confirmationService: ConfirmationService,
-    private datePipe: DatePipe,
-    private cdr: ChangeDetectorRef
-  ) {}
-
-  onRowsInit() {
-    if (this.rows.length === 0) return;
-
-    this.selectedTableRows = this.enableSelectAllOnInit ? this.rows : undefined;
-    this.selectedRows.emit(this.selectedTableRows);
-  }
-
-  ngOnChanges(changes: SimpleChanges) {
-    this.onRowsInit();
-    // if (changes['isLoading']) {
-    //   this.cdr.detectChanges(); // Force UI update
-    // }
-  }
-
-  onRowSelect() {
-    this.selectedRows.emit(this.selectedTableRows);
-  }
-
-  onRowUnselect() {
-    this.selectedRows.emit(this.selectedTableRows);
-  }
-
-  onCheckboxSelect() {
-    this.selectedRows.emit(this.selectedTableRows);
-  }
-
-  clearFilters() {
-    if (this.dt1) {
-      this.dt1.clear();
-      this.filterChange.emit({});
-    }
-  }
-
-  onPage(event: TablePageEvent) {
-    const page = event.first === 0 ? 0 : event.first / event.rows;
-    const size = event.rows;
-    this.pageChange.emit({ page, size });
-  }
-
-  filterResults(event: any) {
-    const filteredFilters: any = {};
-    for (const field of Object?.keys(event.filters)) {
-      const filtersArray = event.filters[field];
-      const nonNullFilters = filtersArray?.filter(
-        (item: any) => item.value !== null
-      );
-
-      if (nonNullFilters?.length > 0) {
-        // Convert Date objects to formatted string for date filters
-        const processedFilters = nonNullFilters.map((item: any) => {
-          if (item.value instanceof Date) {
-            return {
-              ...item,
-              matchMode: 'equals',
-              value: this.datePipe.transform(item.value, 'yyyy-MM-dd'),
-              operator: 'and',
-            };
-          }
-          // Handle date range filters (array of dates)
-          if (
-            Array.isArray(item.value) &&
-            item.value.length === 2 &&
-            item.value.every((v: unknown) => v instanceof Date)
-          ) {
-            return {
-              ...item,
-              matchMode: 'between',
-              value: item.value.map((date: Date) =>
-                this.datePipe.transform(date, 'yyyy-MM-dd')
-              ),
-              operator: 'and',
-            };
-          }
-          // For date filter strings, also normalize to equals matchMode
-          if (item.matchMode === 'dateIs') {
-            return {
-              ...item,
-              matchMode: 'equals',
-              operator: 'and',
-            };
-          }
-          return item;
-        });
-        filteredFilters[field] = processedFilters;
-      }
-    }
-    this.filterChange.emit(filteredFilters);
-  }
-
-  deleteRowConfirmation(rowData: any) {
-    this.confirmationService.confirm({
-      message: 'Delete this item?',
-      accept: () => {
-        this.deleteRow.emit(rowData);
-      },
-    });
-  }
-
-  actionRowConfirmation(rowData: Row) {
-    if (this.actionButtonConfig.confirmation) {
-      this.confirmationService.confirm({
-        message: this.actionButtonConfig.message,
-        accept: () => {
-          this.actionButton.emit(rowData);
-        },
-      });
-    } else {
-      this.actionButton.emit(rowData);
-    }
-  }
-
-  onRowReorder(event: TableRowReorderEvent) {
-    this.rowReordered.emit({
-      previousIndex: event.dragIndex as number,
-      currentIndex: event.dropIndex as number,
-    });
-  }
-
-  getRowDataValue(rowData: any, field: string, type: string) {
-    let value = field
-      .split('.')
-      .reduce((acc, part) => acc && acc[part], rowData);
-
-    if (type === 'date') {
-      value = this.datePipe.transform(value, 'MM/dd/yyyy');
-    }
-
-    return value;
-  }
-  copyHandler(event: Event, element: any) {
-    event.stopPropagation();
-    navigator.clipboard.writeText(element);
-    this.atomixSnackbarComponent.showSnackbar(`Copied ${element} to clipboard`);
-  }
-
-  customSort(columnName: any) {
-    let direction =
-      this.sortBy !== columnName
-        ? 'asc'
-        : this.orderBy === 'asc'
-          ? 'desc'
-          : this.orderBy === 'desc'
-            ? ''
-            : 'asc';
-
-    this.sortBy = columnName;
-    this.orderBy = direction;
-    this.sortHandler.emit({ columnName, direction });
-  }
-
-  handlePageChange(event: any) {
-    this.pageChange.emit(event);
-  }
-
-  dropdownHandler(event: any) {
-    this.pageDropdownChange.emit(event?.value);
-  }
-
-  handleActionClick(action: any, rowData: any) {
-    if (action.click) {
-      action.click(rowData); // Call the passed function with the row data
-    }
-  }
-
-  handleChildActionClick(action: any, rowData: any) {
-    if (action.click) {
-      // If the action provides a custom click handler, call it
-      action.click(rowData);
-    } else {
-      // Normalize the action to a string if action.action exists
-      const actionName = action?.action || action?.tooltip || action;
-      // Emit using the expected shape: { action, childRow }
-      this.childRowAction.emit({ action: actionName, childRow: rowData });
-    }
-  }
-
-  shouldShowAction(action: any, rowData: any): boolean {
-    if (!action) return true;
-    if (action.showOnlyWhen) {
-      return Object.entries(action.showOnlyWhen).every(([key, value]) => {
-        const rowVal = (rowData?.[key] ?? '')?.toString();
-        if (!rowVal) return false;
-        return rowVal.toLowerCase() === String(value).toLowerCase();
-      });
-    }
-    return true;
-  }
-
-  @Input() isAllSelected: boolean = false;
-  @Output() headerCheckboxHandler = new EventEmitter<boolean>();
-  @Output() checkboxHandler = new EventEmitter<any>();
-  isAnyRowSelected(): boolean {
-    if (this.rows?.every((row) => row?.isSelected)) {
-      this.isAllSelected = true;
-      return false;
-    } else if (this.rows?.some((row: any) => row.isSelected)) {
-      this.isAllSelected = true;
-      return true;
-    } else {
-      this.isAllSelected = false;
-      return false;
-    }
-  }
-
-  toggleAllRows(event: CheckboxChangeEvent) {
-    this.rows?.forEach((row) => {
-      row.isSelected = this.isAllSelected;
-    });
-    this.headerCheckboxHandler.emit(this.isAllSelected);
-    this.checkboxHandler.emit();
-  }
-
-  singleCheckboxHandler(event: CheckboxChangeEvent, row: any) {
-    this.isAllSelected = true;
-    this.headerCheckboxHandler.emit(false);
-    this.checkboxHandler.emit();
-  }
-
-  isString(value: any): boolean {
-    return typeof value === 'string';
-  }
-
-  handleDateRangeFilter(
-    value: any,
-    filterCallback: (value: any) => void
-  ): void {
-    // Only apply filter when both dates are selected (array with 2 dates)
-    if (
-      Array.isArray(value) &&
-      value.length === 2 &&
-      value.every((v) => v instanceof Date)
-    ) {
-      filterCallback(value);
-    } else if (value === null) {
-      // Clear the filter when value is null (e.g., when cross icon is clicked)
-      filterCallback(null);
-    }
-  }
-
-  hasChildRows(rowData: any): boolean {
-    if (!this.secondaryRowsKey) {
-      return false;
-    }
-    const childRows = rowData[this.secondaryRowsKey];
-    return Array.isArray(childRows) && childRows.length > 0;
-  }
-
-  shouldShowActionButton(action: any, rowData: any): boolean {
-    if (this.hideMainRowActionsWhenExpanded && this.hasChildRows(rowData)) {
-      return false;
-    }
-
-    if (action.showOnlyWhenNoChildRows && this.hasChildRows(rowData)) {
-      return false;
-    }
-
-    return true;
-  }
-}

package/src/lib/lib/atomix-table/atomix-table.models.ts

@@ -1,39 +0,0 @@
-/**
- * TODO: Move this to models folder
- */
-export interface Row {
-  id: string;
-  [k: string]: unknown;
-  isSelected?: boolean;
-}
-/**
- * TODO: Move this to models folder
- */
-export interface Column {
-  name: string;
-  field: string;
-  type?: string;
-  isEditable?: boolean;
-  isRequired?: boolean;
-  filterDisabled?: boolean;
-  hideFilter?: boolean;
-  isHide?: boolean;
-  filterByDropdown?: { value: string; label: string }[];
-  filterByDate?: boolean;
-  filterByDateRange?: boolean;
-  hideAdvancedFilters?: boolean;
-  copyIcon?: boolean;
-  chip?: boolean;
-  chipIcon?: boolean;
-  progress?: boolean;
-}
-
-export type SortDirection = 'asc' | 'desc' | '';
-export interface TableActionButton {
-  icon?: string;
-  class?: string;
-  tooltip?: string;
-  click?: (event: any) => void;
-  disabled?: boolean;
-  showOnlyWhen?: { [k: string]: string };
-}

package/src/lib/lib/atomix-tag/atomix-tag.component.html

@@ -1,6 +0,0 @@
-<p-tag
-  [value]="value"
-  [rounded]="rounded"
-  [icon]="icon"
-  [styleClass]="styleClass"
-/>

package/src/lib/lib/atomix-tag/atomix-tag.component.spec.ts

@@ -1,47 +0,0 @@
-import { NO_ERRORS_SCHEMA } from '@angular/core';
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { AtomixTagComponent } from './atomix-tag.component';
-
-describe('AtomixTagComponent', () => {
-  let component: AtomixTagComponent;
-  let fixture: ComponentFixture<AtomixTagComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [AtomixTagComponent],
-      schemas: [NO_ERRORS_SCHEMA],
-    });
-    fixture = TestBed.createComponent(AtomixTagComponent);
-    component = fixture.componentInstance;
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-
-  describe('input bindings', () => {
-    it('should accept value input', () => {
-      component.value = 'Active';
-      fixture.detectChanges();
-      expect(component.value).toBe('Active');
-    });
-
-    it('should accept rounded input', () => {
-      component.rounded = true;
-      fixture.detectChanges();
-      expect(component.rounded).toBe(true);
-    });
-
-    it('should accept icon input', () => {
-      component.icon = 'pi pi-check';
-      fixture.detectChanges();
-      expect(component.icon).toBe('pi pi-check');
-    });
-
-    it('should accept styleClass input', () => {
-      component.styleClass = 'custom-tag';
-      fixture.detectChanges();
-      expect(component.styleClass).toBe('custom-tag');
-    });
-  });
-});

package/src/lib/lib/atomix-tag/atomix-tag.component.ts

@@ -1,13 +0,0 @@
-import { Component, Input } from '@angular/core';
-
-@Component({
-  selector: 'atomix-tag',
-  templateUrl: './atomix-tag.component.html',
-  styleUrls: ['./atomix-tag.component.css'],
-})
-export class AtomixTagComponent {
-  @Input() value!: string;
-  @Input() rounded!: boolean;
-  @Input() icon!: string;
-  @Input() styleClass!: string;
-}

package/src/lib/lib/utils/prime-icons.util.spec.ts

@@ -1,21 +0,0 @@
-import { getEditIcon, getTrashIcon, getPowerOffIcon } from './prime-icons.util';
-
-describe('prime-icons.util', () => {
-  describe('getEditIcon', () => {
-    it('should return the pencil icon class', () => {
-      expect(getEditIcon()).toBe('pi pi-pencil');
-    });
-  });
-
-  describe('getTrashIcon', () => {
-    it('should return the trash icon class', () => {
-      expect(getTrashIcon()).toBe('pi pi-trash');
-    });
-  });
-
-  describe('getPowerOffIcon', () => {
-    it('should return the power-off icon class', () => {
-      expect(getPowerOffIcon()).toBe('pi pi-power-off');
-    });
-  });
-});

package/src/lib/lib/utils/prime-icons.util.ts

@@ -1,11 +0,0 @@
-export function getEditIcon(): string {
-  return 'pi pi-pencil';
-}
-
-export function getTrashIcon(): string {
-  return 'pi pi-trash';
-}
-
-export function getPowerOffIcon(): string {
-  return 'pi pi-power-off';
-}

package/src/lib/primekit.component.spec.ts

@@ -1,19 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { PrimekitComponent } from './primekit.component';
-
-describe('PrimekitComponent', () => {
-  let component: PrimekitComponent;
-  let fixture: ComponentFixture<PrimekitComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      imports: [PrimekitComponent],
-    });
-    fixture = TestBed.createComponent(PrimekitComponent);
-    component = fixture.componentInstance;
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/primekit.component.ts

@@ -1,10 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'lib-primekit',
-  standalone: true,
-  imports: [],
-  template: ` <p>primekit works!</p> `,
-  styles: ``,
-})
-export class PrimekitComponent {}