@inceptionbg/iui 2.0.7 → 2.0.10

package/src/types/ITable.ts

@@ -1,73 +1,72 @@
-import {
-  Dispatch,
-  FunctionComponent,
-  MouseEvent,
-  ReactElement,
-  ReactNode,
-  RefObject,
-  SetStateAction,
-} from 'react';
+import { Dispatch, MouseEvent, ReactElement, ReactNode, SetStateAction } from 'react';
 import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
 import { IAnyObject, ISimpleObject } from './IBasic';
 import { ITableKeyboardActionsBase } from './IKeyboard';
 
 export interface ITable {
   columns: ITableColumn[];
-  setColumns?: (data: ITableColumn[]) => void;
-  withColumnsSearch?: boolean;
+  // setColumns?: (data: ITableColumn[]) => void;
+  // withColumnsSearch?: boolean;
   customHeader?: ITableColumn[][];
   data: ITableDataItem[];
+  dataActions?: {
+    edit?: {
+      hasAccess: boolean;
+    };
+    delete?: {
+      onClick: (itemUuid: string) => void;
+      hasAccess: boolean;
+    };
+    actions?: {
+      label: string;
+      onClick: (item: ITableDataItem) => void;
+      hasAccess: boolean;
+    }[];
+  };
   sumRows?: ITableDataItem[];
   isLoading?: boolean;
-  serverSidePagination?: IServerSidePagination;
-  customPagination?: {
-    defaultLimit?: number;
-    customLimit?: number[];
-  };
-  selectedRowUuid?: string;
-  footerAction?: {
-    icon?: IconDefinition;
-    onClick: () => void;
-  };
+
   headerWrap?: boolean;
-  hideFooter?: boolean;
-  noTotalRows?: boolean;
-  showLastBorder?: boolean;
-  filterData?: ITableFilterData;
-  sortData?: ITableSortData;
-  printData?: IPrintData;
-  customPrintData?: ICustomPrintData;
-  additionsalOptions?: ReactNode;
+  selectedRowUuid?: string;
   rowSelect?: {
     selectedRows: Set<string>;
     setSelectedRows: Dispatch<SetStateAction<Set<string>>>;
     actions: ITableSelectedActions[];
   };
-  className?: string;
-  rowHeight?: 'xs' | 's' | 'm';
-  maxHeight?: string;
-  editable?: {
-    selectedItem?: any;
-    setSelectedItem?: (item: any) => void;
-    defaultDataValue?: any;
-    EditableRow?: FunctionComponent<ITableEditRow>;
-    onSubmit: (data: any, onSubmitCallback: () => void) => void;
-    addDisabled?: boolean;
-    addLabel?: string;
-    inputFocusRef?: RefObject<any>;
-    keepEditOnSubmit?: boolean;
-  };
+  filterData?: ITableFilterData;
+  sortData?: ITableSortData;
+  // printData?: IPrintData;
+  // customPrintData?: ICustomPrintData;
+  // additionsalOptions?: ReactNode;
+  editable?: ITableEdit;
   keyboard?: {
     enabled: boolean;
     actions: ITableKeyboardActionsBase;
   };
-  templates?: {
-    identifier: string;
-    data: IReportTemplateData;
-    setTemplateName?: (templateName: string) => void;
-    onClearFilters: () => void;
-    allowPublicCreate?: boolean;
+  footer?: {
+    paginationControl?: IPaginationControl;
+    customPagination?: {
+      defaultLimit?: number;
+      customLimit?: number[];
+    };
+    totalRows?: number;
+    // noTotalRows?: boolean;
+    footerAction?: {
+      icon?: IconDefinition;
+      onClick: () => void;
+    };
   };
+
+  className?: string;
+  rowHeight?: 'xs' | 's' | 'm';
+  maxHeight?: string;
+  // templates?: {
+  //   identifier: string;
+  //   data: IReportTemplateData;
+  //   setTemplateName?: (templateName: string) => void;
+  //   onClearFilters: () => void;
+  //   allowPublicCreate?: boolean;
+  // };
 }
 
 export interface ITableColumn {
@@ -88,7 +87,8 @@ export interface ITableColumn {
     desc: string;
     label: string;
   };
-  code?: string;
+  // code?: string;
+  className?: string;
 }
 
 export interface ITableDataItem {
@@ -97,42 +97,42 @@ export interface ITableDataItem {
   className?: string;
   item?: Record<string, any>;
   disableSelect?: boolean;
-  cells: {
-    [id: string]: {
-      value: any;
-      align?: ITableColumn['align'];
-      className?: string;
-      onClick?: (event?: MouseEvent<HTMLTableCellElement>) => void;
-      link?: boolean;
-      tooltip?: string;
-      span?: number;
-      unclickable?: boolean;
-      printValue?: string;
-    };
-  };
+  cells: ITableDataItemCells;
   extendable?: {
     element: ReactElement;
     isLoading?: boolean;
   };
 }
+export interface ITableDataItemCells {
+  [id: string]: {
+    value: any;
+    align?: ITableColumn['align'];
+    className?: string;
+    onClick?: (event?: MouseEvent<HTMLTableCellElement>) => void;
+    link?: boolean;
+    tooltip?: string;
+    span?: number;
+    unclickable?: boolean;
+    printValue?: string;
+  };
+}
 
 export interface ITableFilterData {
-  columns: string[];
   filters: ITableFilter;
+  customFilterIdList?: string[];
   activeFilterNo?: number;
   additionalFilters?: ReactElement;
+  defaultSearch?: IAnyObject;
   search: IAnyObject;
   searchData: IAnyObject;
   setSearchData: (search: IAnyObject) => void;
-  onSubmit: (search: IAnyObject) => void;
-  resetData?: IAnyObject;
+  onSearch: (search: IAnyObject) => void;
   excludeFromSearch?: string[];
 }
 
 export interface ITableFilterItem {
   label: string;
   field: ReactElement;
-  resetField: () => void;
 }
 export interface ITableFilter {
   [id: string]: ITableFilterItem;
@@ -146,8 +146,7 @@ export interface ITableSortData {
 }
 export interface ITableSort {
   label: string;
-  asc: string;
-  desc: string;
+  value: string;
 }
 
 export interface ITableColumnsData {
@@ -162,6 +161,22 @@ export interface ITableSelectedActions {
   disabled?: boolean;
   clearSelected?: boolean;
 }
+
+///// EDIT /////
+export interface ITableEdit<T = any> {
+  selectedItem: T | null;
+  setSelectedItem: (item: T | null) => void;
+  editData: Partial<T>;
+  setEditData: Dispatch<SetStateAction<Partial<T>>>;
+  onSubmit: (data: T, onSubmitCallback: () => void) => void;
+  cells: ITableDataItemCells;
+  defaultDataValue?: T;
+  addDisabled?: boolean;
+  addLabel?: string;
+  // inputFocusRef?: RefObject<any>;
+  keepEditOnSubmit?: boolean;
+}
+
 ///// PRINT /////
 export interface IBasePrintData {
   label: string;
@@ -194,27 +209,19 @@ export interface IPrintData extends IBasePrintData {
 }
 ///////////////
 
+///// PAGINATION /////
 export interface IPagination {
   limit: number;
   offset: number;
 }
-export interface IServerSidePagination {
+export interface IPaginationControl {
   limit: number;
   offset: number;
   setLimit: Dispatch<SetStateAction<number>>;
   setOffset: Dispatch<SetStateAction<number>>;
-  totalRows: number;
 }
 
-export interface ITableEditRow {
-  columns: ITableColumn[];
-  data: any;
-  setData: (data: any) => void;
-  item?: any;
-  clearItem: () => void;
-  defaultDataValue?: any;
-  inputFocusRef?: RefObject<any>;
-}
+///// REPORT TEMPLATE /////
 
 export interface IReportTemplate {
   uuid: string;

package/src/utils/fileUtils.ts

@@ -1,8 +1,8 @@
-import i18next from 'i18next';
+// import i18next from 'i18next';
 import { IBooleanObject } from '../types/IBasic';
-import { lsGet } from './LocalStorageHelper';
-import { convertBooleanObjectToArray } from './ObjectUtils';
-import { toastError } from './Toasts';
+import { lsGet } from './localStorageHelper';
+import { convertBooleanObjectToArray } from './objectUtils';
+import { toastError } from './toasts';
 
 export const sizeInBytesPretty = (bytes?: number) => {
   if (bytes === 0) {
@@ -72,7 +72,8 @@ export const downloadDocumentFile = (
       link.href = window.URL.createObjectURL(blob);
       link.download = `${fileName}.${type}`;
       link.click();
-    } else toastError(i18next.t('ErrorMessage'));
+    }
+    //  else toastError(i18next.t('ErrorMessage'));
   };
 
   req.send();
@@ -168,7 +169,7 @@ export function downloadFile({
     document.body.removeChild(a);
   };
   req.onloadend = function () {
-    console.log('Finished downloading file');
+    console.info('Finished downloading file');
     onSuccess?.();
     setIsLoading?.(false);
   };

package/src/utils/i18n/i18nIUICyrilic.ts

@@ -1,5 +1,7 @@
 export const i18nIUICyrilic = {
   ////// BASIC //////
+  HomePage: 'Почетна',
+
   // Accept: 'Прихвати',
   Actions: 'Акције',
   Active: 'Активан',
@@ -37,7 +39,9 @@ export const i18nIUICyrilic = {
   Columns: 'Колоне',
   DragDropListsInfo:
     'Одаберите колоне за приказивање превлачењем са једне листе на другу',
+  TableSelect: 'Акције над изабраним елементима',
   Filter: 'Филтери',
+  ApplyFilters: 'Примени филтере',
   HiddenColumns: 'Сакривене колоне',
   NoResults: 'Нема резултата',
   of: 'од',

package/src/utils/i18n/i18nIUILatin.ts

@@ -1,8 +1,8 @@
 export const i18nIUILatin = {
   ////// BASIC //////
-  // Accept: 'Prihvati',
   HomePage: 'Početna',
 
+  // Accept: 'Prihvati',
   Actions: 'Akcije',
   Active: 'Aktivan',
   AddInput: 'Unesi',
@@ -39,7 +39,9 @@ export const i18nIUILatin = {
   Columns: 'Kolone',
   DragDropListsInfo:
     'Odaberite kolone za prikazivanje prevlačenjem sa jedne liste na drugu',
+  TableSelect: 'Akcije nad izabranim elementima',
   Filter: 'Filteri',
+  ApplyFilters: 'Primeni filtere',
   HiddenColumns: 'Sakrivene kolone',
   NoResults: 'Nema rezultata',
   of: 'od',

package/src/utils/i18n/i18nIUIMe.ts

@@ -1,5 +1,7 @@
 export const i18nIUIMe = {
   ////// BASIC //////
+  HomePage: 'Početna',
+
   Actions: 'Akcije',
   Active: 'Aktivan',
   AddInput: 'Unesi',
@@ -35,7 +37,9 @@ export const i18nIUIMe = {
   allResults: 'Svi',
   Columns: 'Kolone',
   DragDropListsInfo: 'Izaberite kolone za prikaz prevlačenjem sa jedne liste na drugu',
+  TableSelect: 'Akcije nad izabranim elementima',
   Filter: 'Filteri',
+  ApplyFilters: 'Primijeni filtere',
   HiddenColumns: 'Skrivene kolone',
   NoResults: 'Nema rezultata',
   of: 'od',

package/src/utils/{ObjectUtils.ts → objectUtils.ts}

@@ -1,5 +1,7 @@
 import { IBooleanObject } from '../types/IBasic';
 
+export const hasValue = (value: any) => ![null, undefined, ''].includes(value);
+
 export const deleteProps = <T extends Record<string, any>>(
   obj: T,
   props: (keyof T)[]
@@ -25,9 +27,7 @@ export const deletePropsThatEndsWith = <T extends Record<string, any>>(
 export const deleteEmptyProps = <T extends Record<string, any>>(obj: T): T =>
   Object.entries(obj).reduce(
     (updatedObj, [key, value]) =>
-      [null, undefined, ''].includes(value)
-        ? updatedObj
-        : ((updatedObj[key as keyof T] = value), updatedObj),
+      hasValue(value) ? ((updatedObj[key as keyof T] = value), updatedObj) : updatedObj,
     {} as T
   );
 
@@ -36,7 +36,7 @@ export const deleteEmptyPropsIncludingArray = <T extends Record<string, any>>(
 ): T =>
   Object.entries(obj).reduce(
     (updatedObj, [key, value]) =>
-      [null, undefined, ''].includes(value) || (Array.isArray(value) && !value.length)
+      !hasValue(value) || (Array.isArray(value) && !value.length)
         ? updatedObj
         : ((updatedObj[key as keyof T] = value), updatedObj),
     {} as T
@@ -69,10 +69,10 @@ export const compareArrayItemsIndex = <T>(
     (comparison === 'greaterThan'
       ? index1 > index2
       : comparison === 'greaterThanOrEqualTo'
-      ? index1 >= index2
-      : comparison === 'lessThan'
-      ? index1 < index2
-      : index1 <= index2)
+        ? index1 >= index2
+        : comparison === 'lessThan'
+          ? index1 < index2
+          : index1 <= index2)
   );
 };
 

package/src/utils/popupUtils.ts

@@ -0,0 +1,82 @@
+import { KeyboardEvent } from 'react';
+import { IKeyboardAction } from '../types/IKeyboard';
+
+export const onPopupKeyDown = (
+  event: KeyboardEvent<HTMLDivElement>,
+  {
+    onClose,
+    enter,
+    search,
+    focusableElements,
+  }: {
+    onClose: () => void;
+    enter?: {
+      onAction: () => void;
+      disabled?: boolean;
+    };
+    search?: {
+      onAction: () => void;
+      disabled?: boolean;
+    };
+    focusableElements?: HTMLElement[];
+  }
+) => {
+  event.stopPropagation();
+  const actions: IKeyboardAction[] = [
+    {
+      code: 'Enter',
+      onAction: () => enter?.onAction(),
+      disabled: !enter || !!enter.disabled,
+    },
+    { code: 'Escape', onAction: onClose },
+    {
+      code: 'KeyF',
+      ctrl: true,
+      onAction: () => {
+        event.preventDefault();
+        search?.onAction();
+      },
+      disabled: !search || !!search.disabled,
+    },
+    {
+      code: 'Tab',
+      onAction: () => {
+        if (focusableElements?.length) {
+          const first = focusableElements[0];
+          const last = focusableElements[focusableElements.length - 1];
+          if (document.activeElement === last) {
+            event.preventDefault();
+            first.focus();
+          }
+        }
+      },
+      disabled: !focusableElements?.length,
+    },
+    {
+      code: 'Tab',
+      shift: true,
+      onAction: () => {
+        if (focusableElements?.length) {
+          const first = focusableElements[0];
+          const last = focusableElements[focusableElements.length - 1];
+          if (document.activeElement === first) {
+            event.preventDefault();
+            last.focus();
+          }
+        }
+      },
+      disabled: !focusableElements?.length,
+    },
+  ];
+
+  actions.forEach(item => {
+    if (
+      !item.disabled &&
+      item.code === event.code &&
+      !!item.shift === event.shiftKey &&
+      !!item.ctrl === (event.ctrlKey || event.metaKey)
+    ) {
+      item.onAction();
+    }
+  });
+};

package/src/utils/{TableUtils.ts → tableUtils.ts}

@@ -76,10 +76,10 @@ export const convertReportTemplateFilterToSearch = (
             label: template.name,
           }
         : template.type === 'ARRAY'
-        ? JSON.parse(template.value)
-        : template.type === 'BOOLEAN'
-        ? template.value === 'true'
-        : template.value;
+          ? JSON.parse(template.value)
+          : template.type === 'BOOLEAN'
+            ? template.value === 'true'
+            : template.value;
   });
   return search;
 };
@@ -97,7 +97,7 @@ export const setTemplateData = ({
 }) => {
   const newFilters =
     template.filterValues && convertReportTemplateFilterToSearch(template.filterValues);
-  newFilters && setFilters && setFilters(newFilters);
+  newFilters && setFilters?.(newFilters);
   template.columns &&
     columnsData?.setColumns(
       getVisibleColumnsFromList(columnsData.columns, template.columns)

package/src/utils/{Toasts.ts → toasts.ts}

@@ -1,6 +1,6 @@
-import { toast } from 'react-toastify';
-
-export const toastSuccess = (message: string) => toast.success(message);
-export const toastError = (message: string) => toast.error(message, { autoClose: false });
-// export const toastInfo = (message: string) => toast.info(message);
-// export const toastWarn = (message: string) => toast.warn(message);
+import { toast } from 'react-toastify';
+
+export const toastSuccess = (message: string) => toast.success(message);
+export const toastError = (message: string) => toast.error(message, { autoClose: false });
+// export const toastInfo = (message: string) => toast.info(message);
+// export const toastWarn = (message: string) => toast.warn(message);

package/src/utils/{UrlUtils.ts → urlUtils.ts}

@@ -1,4 +1,4 @@
-export const parseUrlSearch = (search: string) => {
-  const urlSearchParams = new URLSearchParams(search);
-  return Object.fromEntries(urlSearchParams.entries());
-};
+export const parseUrlSearch = (search: string) => {
+  const urlSearchParams = new URLSearchParams(search);
+  return Object.fromEntries(urlSearchParams.entries());
+};

package/dist/NoAccessPage-BozT_Suz.js

@@ -1,2 +0,0 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useTranslation as r}from"react-i18next";import{Link as i}from"react-router";import{Button as a}from"./index.js";import"@fortawesome/react-fontawesome";import"clsx";import"dayjs";import"react-beautiful-dnd";import"react-toastify";import"react";import"react-dom";import"react-calendar";import"react-select";import"react-select-async-paginate";import"react-select/async-creatable";import"i18next";const c=()=>{const{t:c}=r();return e("div",{className:"full-screen-page",children:[e("div",{id:"content",children:[t("h1",{children:c("NoAccessPage")}),t("p",{className:"subtitle",children:c("NoAccessPageInfo")})]}),t("p",{id:"img",className:"img-403",children:"403"}),t("div",{id:"actions",children:t(i,{to:"/",children:t(a,{label:c("ReturnToHomepage")})})})]})};export{c as default};
-//# sourceMappingURL=NoAccessPage-BozT_Suz.js.map