@dartech/arsenal-ui 1.3.0 → 1.3.2

package/src/lib/Sidebar/SidebarLink/SidebarLinkItem.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import type { Route } from '../../../interfaces';
+type Props = {
+    route: Route;
+    isActive: boolean;
+};
+declare const SidebarLinkItem: ({ route, isActive }: Props) => JSX.Element;
+export default SidebarLinkItem;

package/src/lib/Sidebar/SidebarLink/SidebarNestedItem.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { Route } from '../../../interfaces';
+type Props = {
+    route: Route;
+    isActive: boolean;
+    isListOpen: boolean;
+    handleClick: () => void;
+};
+declare function SidebarNestedItem({ route, isActive, isListOpen, handleClick, }: Props): JSX.Element;
+export default SidebarNestedItem;

package/src/lib/Sidebar/SidebarLink/{index.ts → index.d.ts}

@@ -1,2 +1,2 @@
-export { default } from './SidebarLink';
-export * from './MenuIcon';
+export { default } from './SidebarLink';
+export * from './MenuIcon';

package/src/lib/Sidebar/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Sidebar';
+export * from './SidebarLink/MenuIcon';

package/src/lib/Status/Status.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { StatusVariant } from '../../interfaces';
+type Props = {
+    text: string;
+    status?: StatusVariant;
+};
+export declare const Status: ({ text, status }: Props) => JSX.Element;
+export default Status;

package/src/lib/Status/{index.ts → index.d.ts}

@@ -1 +1 @@
-export * from './Status';
+export * from './Status';

package/src/lib/StepperView/StepperView.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+export type StepperDataItem = {
+    label: string | ReactNode;
+    content: ReactNode;
+};
+export type StepperData = StepperDataItem[];
+type Props = {
+    data: StepperData;
+};
+export declare const StepperView: ({ data }: Props) => JSX.Element;
+export default StepperView;

package/src/lib/StepperView/{index.ts → index.d.ts}

@@ -1 +1 @@
-export * from './StepperView';
+export * from './StepperView';

package/src/lib/Table/DataGrid/JsonTypeCell.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+declare const JsonTypeCell: ({ value, copyButton, textField, }: {
+    value: any;
+    copyButton?: boolean;
+    textField?: boolean;
+}) => JSX.Element;
+export default JsonTypeCell;

package/src/lib/Table/DataGrid/Table.d.ts

@@ -0,0 +1,49 @@
+import React from 'react';
+import { GridCellParams, GridColumns, GridFeatureMode, GridRowsProp } from '@mui/x-data-grid';
+/**
+ * This interface is referencing the [[Table]] component props.
+ * @category Common UI components
+ */
+export interface TableProps {
+    /**
+     * Data loading state
+     */
+    loading?: boolean;
+    /**
+     * Table columns
+     */
+    columns: GridColumns;
+    /**
+     * Table rows
+     */
+    rows: GridRowsProp;
+    /**
+     * Rows count to display
+     */
+    rowCount: number;
+    disableMargin?: boolean;
+    /**
+     * Data display mode.
+     * Values: `client` | `server`;
+     * Default: `server`
+     */
+    mode?: GridFeatureMode;
+    /**
+     * Page size. Default `10`
+     */
+    initialPageSize?: number;
+    /**
+     * On cell click handler function
+     * ```typescript
+     * (params: GridCellParams, event: React.MouseEvent) => void;
+     * ```
+     */
+    onCellClick?: (params: GridCellParams, event: React.MouseEvent) => void;
+    pagination?: boolean;
+}
+/**
+ * Main data display component. MUI DataGrid used
+ * @category Common UI components
+ */
+export declare const Table: ({ columns, rows, rowCount, loading, disableMargin, mode, initialPageSize, pagination, onCellClick, }: TableProps) => JSX.Element;
+export default Table;

package/src/lib/Table/DataGrid/TableAction.d.ts

@@ -0,0 +1,13 @@
+import { ReactElement } from 'react';
+type Props = {
+    icon: ReactElement;
+    onClick?: () => void;
+    label: string;
+    showInMenu?: boolean;
+    location?: {
+        pathname: string;
+        state?: Record<string, unknown>;
+    };
+};
+export declare const TableAction: ({ icon, label, showInMenu, onClick, location }: Props) => JSX.Element;
+export {};

package/src/lib/Table/DataGrid/TableColumnMenu.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const TableColumnMenu: ({ hideMenu, currentColumn, onUnsort, ...rest }: any) => JSX.Element;
+export default TableColumnMenu;

package/src/lib/Table/DataGrid/TablePagination.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const TablePagination: () => JSX.Element;
+export default TablePagination;

package/src/lib/Table/DataGrid/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Table';
+export * from './TableAction';

package/src/lib/Table/DataGrid/styles.d.ts

@@ -0,0 +1,44 @@
+export declare const styles: {
+    width: string;
+    '& .MuiDataGrid-virtualScrollerContent': {
+        height: string;
+        minHeight: string;
+    };
+    '& .MuiDataGrid-virtualScrollerRenderZone': {
+        position: string;
+    };
+    '& .MuiDataGrid-renderingZone': {
+        maxHeight: string;
+    };
+    '& .MuiDataGrid-cell': {
+        maxHeight: string;
+        lineHeight: string;
+        textOverflow: string;
+        wordBreak: string;
+        '& .MuiDataGrid-actionsCell': {
+            width: string;
+            gridGap: string;
+            flexWrap: string;
+            '& > button[aria-label="more"]': {
+                marginLeft: string;
+            };
+        };
+    };
+    '& .MuiDataGrid-row': {
+        maxHeight: string;
+    };
+    '& .Sorted': {
+        '& .MuiDataGrid-iconButtonContainer': {
+            visibility: string;
+            width: string;
+            '& svg': {
+                opacity: string;
+            };
+        };
+        '&.--desc': {
+            '& svg': {
+                transform: string;
+            };
+        };
+    };
+};

package/src/lib/Table/DataGrid/usePagination.d.ts

@@ -0,0 +1,5 @@
+declare const usePagination: (initialPageSize?: number) => {
+    pageSize: number;
+    handlePageSizeChange: (size: any) => void;
+};
+export default usePagination;

package/src/lib/Table/DataGrid/useTableQueryPagination.d.ts

@@ -0,0 +1,11 @@
+import { GridFeatureMode } from '@mui/x-data-grid';
+interface Props {
+    mode: GridFeatureMode;
+}
+export declare const useTableQueryPagination: ({ mode }: Props) => {
+    page: number;
+    size: number;
+    onPageChange: (newPage: number) => void;
+    onSizeChange: (count: number) => void;
+};
+export default useTableQueryPagination;

package/src/lib/Table/DataGrid/useTableQuerySorting.d.ts

@@ -0,0 +1,6 @@
+import { GridColumnHeaderParams, GridColumns } from '@mui/x-data-grid';
+export declare const useTableQuerySorting: () => {
+    onColumnHeaderClick: ({ field }: GridColumnHeaderParams) => void;
+    getSortedColumns: (columns: GridColumns<any>) => GridColumns<any>;
+};
+export default useTableQuerySorting;

package/src/lib/Table/SimpleTable/SimpleTable.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode, ForwardedRef } from 'react';
+import { Column, Row } from '../../../interfaces';
+interface Props<T> {
+    columns: Column<T>[];
+    rows: Row<T>[];
+    totalCount: number;
+    loading?: boolean;
+    pagination?: boolean;
+    onRowClick?: (row: Row<T>) => void;
+    children?: ReactNode;
+    verticalAlign?: 'top' | 'middle' | 'bottom' | 'sub' | 'baseline';
+}
+declare function TableInner<T>({ columns, rows, totalCount, children, pagination, loading, onRowClick, verticalAlign }: Props<T>, ref: ForwardedRef<HTMLTableElement>): JSX.Element;
+export declare const SimpleTable: <T>(props: Props<T> & {
+    ref?: ForwardedRef<HTMLTableElement>;
+}) => ReturnType<typeof TableInner>;
+export default SimpleTable;

package/src/lib/Table/SimpleTable/TableActionCell.d.ts

@@ -0,0 +1,10 @@
+import { MouseEvent } from 'react';
+type ActionItem = {
+    title: string;
+    onClick: (e?: MouseEvent<HTMLElement>) => void;
+};
+type Props = {
+    actionsList: ActionItem[];
+};
+export declare const TableActionCell: ({ actionsList }: Props) => JSX.Element;
+export {};

package/src/lib/Table/SimpleTable/index.d.ts

@@ -0,0 +1,2 @@
+export * from './SimpleTable';
+export * from './TableActionCell';

package/src/lib/Table/SimpleTable/useTablePagination.d.ts

@@ -0,0 +1,7 @@
+declare const useTablePagination: () => {
+    page: string | number;
+    size: string | number;
+    onPageChange: (newPage: number) => void;
+    onSizeChange: (newSize: number) => void;
+};
+export default useTablePagination;

package/src/lib/Table/SimpleTable/useTableSorting.d.ts

@@ -0,0 +1,6 @@
+declare const useTableSorting: () => {
+    sortParams: string[][];
+    onSortChanged: (sortKey: string) => void;
+    getColumnSorting: (sortKey: string) => string | false;
+};
+export default useTableSorting;

package/src/lib/Table/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DataGrid';
+export * from './SimpleTable';

package/src/lib/Tabs/RouteTabs.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+interface RouteTab {
+    name: string;
+    label: string;
+    component: React.ReactElement;
+}
+interface Props {
+    tabs: RouteTab[];
+}
+export declare const RouteTabs: (props: Props) => JSX.Element;
+export default RouteTabs;

package/src/lib/Tabs/TabPanel.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+/**
+ * This interface is referencing the [[TabPanel]] component props.
+ * @category Common UI components
+ */
+export interface TabPanelProps {
+    /**
+     * Active tab value
+     */
+    value: number | string;
+    /**
+     * Index of current panel
+     */
+    index: number | string;
+    /**
+     * Rendered children component
+     */
+    children: React.ReactElement;
+}
+/**
+ * Tab panel component. Used with tabs component
+ * @category Common UI components
+ */
+export declare const TabPanel: (props: TabPanelProps) => JSX.Element;
+export default TabPanel;

package/src/lib/Tabs/{index.ts → index.d.ts}

@@ -1,2 +1,2 @@
-export * from './TabPanel';
-export * from './RouteTabs';
+export * from './TabPanel';
+export * from './RouteTabs';

package/src/lib/{index.ts → index.d.ts}

@@ -1,16 +1,16 @@
-export * from './Alert';
-export * from './Forms';
-export * from './Loader';
-export * from './Table';
-export * from './Tabs';
-export * from './Modals';
-export * from './InfoItem';
-export * from './Definition';
-export * from './Property';
-export * from './Status';
-export * from './JsonView';
-export * from './JsonPathPicker';
-export * from './StepperView';
-export * from './Sidebar';
-export * from './ContentLayout';
-export * from './Breadcrumbs';
+export * from './Alert';
+export * from './Forms';
+export * from './Loader';
+export * from './Table';
+export * from './Tabs';
+export * from './Modals';
+export * from './InfoItem';
+export * from './Definition';
+export * from './Property';
+export * from './Status';
+export * from './JsonView';
+export * from './JsonPathPicker';
+export * from './StepperView';
+export * from './Sidebar';
+export * from './ContentLayout';
+export * from './Breadcrumbs';

package/src/theme/baseTheme.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@mui/material/styles").Theme;
+export default _default;

package/src/theme/index.d.ts

@@ -0,0 +1 @@
+export declare const theme: import("@mui/material/styles").Theme;

package/src/theme/inputThemeOptions.d.ts

@@ -0,0 +1,117 @@
+declare const inputThemeOptions: {
+    components: {
+        MuiButton: {
+            styleOverrides: {
+                root: {
+                    lineHeight: number;
+                };
+            };
+        };
+        MuiInputBase: {
+            styleOverrides: {
+                root: {
+                    borderRadius: string;
+                    minWidth: string;
+                    background: string;
+                };
+                input: {
+                    minWidth: string;
+                };
+            };
+        };
+        MuiSelect: {
+            styleOverrides: {
+                nativeInput: {
+                    padding: number;
+                    height: string;
+                };
+            };
+        };
+        MuiTextField: {
+            styleOverrides: {
+                root: {
+                    minWidth: string;
+                };
+            };
+        };
+        MuiInputLabel: {
+            styleOverrides: {
+                root: {
+                    position: string;
+                    overflow: string;
+                    transform: string;
+                    marginBottom: string;
+                    fontWeight: number;
+                    fontSize: string;
+                    lineHeight: string;
+                };
+            };
+        };
+        MuiOutlinedInput: {
+            styleOverrides: {
+                root: {
+                    borderRadius: string;
+                    minWidth: string;
+                };
+                notchedOutline: {
+                    top: number;
+                    '& legend': {
+                        display: string;
+                        transition: string;
+                    };
+                };
+            };
+        };
+        MuiAutocomplete: {
+            styleOverrides: {
+                paper: {
+                    marginTop: number;
+                    borderRadius: number;
+                    boxShadow: string;
+                };
+                listbox: {
+                    '::-webkit-scrollbar': {
+                        width: string;
+                        backgroundColor: string;
+                    };
+                    '::-webkit-scrollbar-thumb': {
+                        borderRadius: string;
+                        backgroundColor: string;
+                    };
+                };
+            };
+        };
+        MuiMenu: {
+            styleOverrides: {
+                list: {
+                    paddingTop: number;
+                    paddingBottom: number;
+                    background: string;
+                    '& li.Mui-selected': {
+                        background: string;
+                    };
+                };
+            };
+        };
+        MuiPopover: {
+            styleOverrides: {
+                paper: {
+                    marginTop: number;
+                    borderRadius: number;
+                    boxShadow: string;
+                };
+            };
+        };
+        MuiFormLabel: {
+            styleOverrides: {
+                asterisk: {
+                    color: string;
+                    '&$error': {
+                        color: string;
+                    };
+                };
+            };
+        };
+    };
+};
+export default inputThemeOptions;

package/src/theme/stepperThemeOptions.d.ts

@@ -0,0 +1,16 @@
+declare const stepperThemeOptions: {
+    components: {
+        MuiStepIcon: {
+            styleOverrides: {
+                root: {
+                    fontSize: string;
+                    color: string;
+                    '&.Mui-active, &.Mui-completed': {
+                        color: string;
+                    };
+                };
+            };
+        };
+    };
+};
+export default stepperThemeOptions;

package/src/theme/tableThemeOptions.d.ts

@@ -0,0 +1,47 @@
+declare const tableThemeOptions: {
+    components: {
+        MuiTableContainer: {
+            styleOverrides: {
+                root: {
+                    borderRadius: string;
+                    border: string;
+                };
+            };
+        };
+        MuiTableHead: {
+            styleOverrides: {
+                root: {
+                    backgroundColor: string;
+                };
+            };
+        };
+        MuiTableCell: {
+            styleOverrides: {
+                root: {
+                    minHeight: number;
+                    padding: string;
+                    '&:first-of-type': {
+                        paddingLeft: string;
+                    };
+                };
+                head: {
+                    maxHeight: string;
+                    padding: string;
+                    color: string;
+                };
+                body: {
+                    wordBreak: string;
+                };
+            };
+        };
+        MuiTableSortLabel: {
+            styleOverrides: {
+                root: {
+                    maxHeight: string;
+                    lineHeight: number;
+                };
+            };
+        };
+    };
+};
+export default tableThemeOptions;

package/src/theme/typographyThemeOptions.d.ts

@@ -0,0 +1,29 @@
+declare const typographyThemeOptions: {
+    components: {
+        MuiTypography: {
+            styleOverrides: {
+                h1: {
+                    [x: string]: {
+                        fontSize: string;
+                    };
+                };
+                h3: {
+                    [x: string]: string | {
+                        fontSize: string;
+                    };
+                    fontSize: string;
+                };
+                h4: {
+                    [x: string]: string | {
+                        fontSize: string;
+                    };
+                    fontSize: string;
+                };
+                subtitle2: {
+                    color: string;
+                };
+            };
+        };
+    };
+};
+export default typographyThemeOptions;

package/src/utils/common.d.ts

@@ -0,0 +1,7 @@
+export declare const removeArrayItem: (arr: Array<unknown>, index: number) => unknown[];
+export declare const validateJson: (value: string) => boolean;
+export declare function capitalize(str: string): string;
+export declare const sortArrayOfObjects: (a: Record<string, unknown>, b: Record<string, unknown>, key: string, order?: string) => 1 | -1 | 0;
+export declare const getJsonStringValue: (value: unknown) => string;
+export declare const safeParseJson: (value: string) => any;
+export declare const deepParseJson: (value: string) => any;

package/src/utils/dem.d.ts

@@ -0,0 +1,27 @@
+import { PropertyType, EntityTypeProperty, PropertiesArrayType, PropertiesObjectType, PropertyFillType } from '../interfaces';
+export declare const isPropertyValueEmpty: (value: unknown) => boolean;
+export declare const formatDefinitionData: (properties: PropertiesArrayType<unknown>, data: unknown) => {};
+export declare const propertiesArrayToObject: (properties: any, isGlobalParameter?: boolean) => PropertiesObjectType<any>;
+export declare function propertiesObjectToArray(properties: any, fields?: {
+    [key: string]: unknown;
+}): any[];
+export declare const getDemPropertyDateFormat: (defaultFormat: string, propertyFormat: string) => string;
+export declare const getEntityStarterValue: (property: EntityTypeProperty) => any;
+export declare const getMultiplePropertyFillOptions: ({ propertyType, useExpression, required, }: {
+    propertyType: PropertyType;
+    required: boolean;
+    useExpression?: boolean;
+}) => {
+    value: PropertyFillType;
+    label: string;
+    sortOrder: number;
+}[];
+export declare const getSinglePropertyFillOptions: ({ propertyType, useExpression, required, }: {
+    propertyType: PropertyType;
+    required: boolean;
+    useExpression?: boolean;
+}) => {
+    value: PropertyFillType;
+    label: string;
+    sortOrder: number;
+}[];

package/src/utils/hooks.d.ts

@@ -0,0 +1,7 @@
+export declare function useDebounce(func: (args?: any) => void, delay: number): (...args: any[]) => void;
+export declare const useToggle: () => {
+    open: boolean;
+    toggle: () => void;
+    onClose: () => void;
+    onOpen: () => void;
+};

package/src/utils/{index.ts → index.d.ts}

@@ -1,5 +1,5 @@
-export * from './common';
-export * from './ui-utils';
-export * from './hooks';
-export * from './validators';
-export * from './dem';
+export * from './common';
+export * from './ui-utils';
+export * from './hooks';
+export * from './validators';
+export * from './dem';

package/src/utils/ui-utils.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { StatusVariant, TableDataType } from '../interfaces';
+type TableFormatProps = {
+    value: any;
+    canCopy?: boolean;
+    copyValue?: string;
+    shortId?: boolean;
+    fullText?: boolean;
+    textParams?: {
+        displayAs?: TableDataType;
+        dateFormat?: string[];
+        statusVariant?: StatusVariant;
+    };
+};
+export declare const formatTableRowValue: ({ value, canCopy, copyValue, shortId, fullText, textParams, }: TableFormatProps) => JSX.Element | "";
+export {};

package/src/utils/validators.d.ts

@@ -0,0 +1,5 @@
+import { PropertyType } from '../interfaces';
+export declare const digitsOnly: RegExp;
+export declare const floatsOnly: RegExp;
+export declare const isExpression: (value: unknown) => boolean;
+export declare const isDateType: (propertyType: PropertyType) => boolean;