@devtron-labs/devtron-fe-common-lib 1.1.6-beta-1 → 1.1.6-beta-2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.1.6-beta-1",
+    "version": "1.1.6-beta-2",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",
@@ -60,11 +60,8 @@
         "husky": "^7.0.4",
         "lint-staged": "^12.5.0",
         "moment": "^2.29.4",
-        "monaco-editor": "0.44.0",
-        "monaco-yaml": "5.1.1",
         "prettier": "^3.1.1",
         "react-ga4": "^1.4.1",
-        "react-mde": "^11.5.0",
         "react-toastify": "9.1.3",
         "typescript": "5.5.4",
         "vite": "5.4.11",
@@ -79,11 +76,14 @@
         "@rjsf/validator-ajv8": "^5.13.3",
         "@typeform/embed-react": "2.20.0",
         "dompurify": "^3.0.2",
+        "monaco-editor": "0.44.0",
+        "monaco-yaml": "5.1.1",
         "react": "^17.0.2",
         "react-dom": "^17.0.2",
         "react-draggable": "^4.4.5",
         "react-ga4": "^1.4.1",
         "react-mde": "^11.5.0",
+        "react-monaco-editor": "^0.54.0",
         "react-router-dom": "^5.3.0",
         "react-select": "5.8.0",
         "rxjs": "^7.8.1",
@@ -99,7 +99,6 @@
         "jsonpath-plus": "^10.0.0",
         "react-dates": "^21.8.0",
         "react-diff-viewer-continued": "^3.4.0",
-        "react-monaco-editor": "^0.54.0",
         "sass": "^1.69.7",
         "tslib": "2.7.0"
     },

package/dist/Shared/Components/DynamicDataTable/DynamicDataTable.d.ts

@@ -1,2 +0,0 @@
-import { DynamicDataTableProps } from './types';
-export declare const DynamicDataTable: <K extends string>({ headers, ...props }: DynamicDataTableProps<K>) => JSX.Element;

package/dist/Shared/Components/DynamicDataTable/DynamicDataTableHeader.d.ts

@@ -1,2 +0,0 @@
-import { DynamicDataTableHeaderProps } from './types';
-export declare const DynamicDataTableHeader: <K extends string>({ headers, rows, sortingConfig, onRowAdd, readOnly, isAdditionNotAllowed, isDeletionNotAllowed, headerComponent, actionButtonConfig, }: DynamicDataTableHeaderProps<K>) => JSX.Element;

package/dist/Shared/Components/DynamicDataTable/DynamicDataTableRow.d.ts

@@ -1,2 +0,0 @@
-import { DynamicDataTableRowProps } from './types';
-export declare const DynamicDataTableRow: <K extends string>({ rows, headers, maskValue, readOnly, isAdditionNotAllowed, isDeletionNotAllowed, validationSchema, showError, errorMessages, actionButtonConfig, onRowEdit, onRowDelete, leadingCellIcon, trailingCellIcon, }: DynamicDataTableRowProps<K>) => JSX.Element;

package/dist/Shared/Components/DynamicDataTable/index.d.ts

@@ -1,2 +0,0 @@
-export * from './DynamicDataTable';
-export * from './types';

package/dist/Shared/Components/DynamicDataTable/types.d.ts

@@ -1,161 +0,0 @@
-import { DetailedHTMLProps, ReactNode } from 'react';
-import { SortingOrder } from '../../../Common/Constants';
-import { SelectPickerOptionType, SelectPickerProps } from '../SelectPicker';
-import { MultipleResizableTextAreaProps } from '../MultipleResizableTextArea';
-import { SelectTextAreaProps } from '../SelectTextArea';
-/**
- * Interface representing a key-value header.
- * @template K - A string representing the key type.
- */
-export type DynamicDataTableHeaderType<K extends string> = {
-    /** The label of the header. */
-    label: string;
-    /** The key associated with the header. */
-    key: K;
-    /** */
-    width: string;
-    /** An optional boolean indicating if the column is sortable. */
-    isSortable?: boolean;
-    /** An optional boolean to hide the column */
-    isHidden?: boolean;
-};
-export declare enum DynamicDataTableRowDataType {
-    TEXT = "text",
-    DROPDOWN = "dropdown",
-    SELECT_TEXT = "select-text",
-    BUTTON = "button"
-}
-/**
- * Type representing a key-value row.
- * @template K - A string representing the key type.
- */
-export type DynamicDataTableRowType<K extends string> = {
-    data: {
-        [key in K]: {
-            value: string;
-            disabled?: boolean;
-            /** An optional boolean indicating if an asterisk should be shown. */
-            required?: boolean;
-        } & ({
-            type?: DynamicDataTableRowDataType.TEXT;
-            props?: Omit<MultipleResizableTextAreaProps, 'className' | 'minHeight' | 'maxHeight' | 'value' | 'onChange' | 'disabled' | 'disableOnBlurResizeToMinHeight' | 'refVar' | 'dependentRefs'>;
-        } | {
-            type?: DynamicDataTableRowDataType.DROPDOWN;
-            props?: Omit<SelectPickerProps<string, false>, 'inputId' | 'value' | 'onChange' | 'fullWidth' | 'isDisabled'>;
-        } | {
-            type?: DynamicDataTableRowDataType.SELECT_TEXT;
-            props?: Omit<SelectTextAreaProps, 'value' | 'onChange' | 'inputId' | 'isDisabled' | 'dependentRefs' | 'refVar' | 'textAreaProps'> & {
-                textAreaProps?: Omit<SelectTextAreaProps['textAreaProps'], 'className' | 'disableOnBlurResizeToMinHeight' | 'minHeight' | 'maxHeight'>;
-            };
-        } | ({
-            type?: DynamicDataTableRowDataType.BUTTON;
-            props: Pick<DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, 'onClick'> & {
-                icon?: ReactNode;
-                text: ReactNode;
-            };
-        } & ({
-            wrap: true;
-            wrapRenderer: (props: {
-                children: JSX.Element;
-                customState?: Record<string, any>;
-            }) => JSX.Element;
-        } | {
-            wrap?: false;
-            wrapRenderer?: never;
-        })));
-    };
-    id: string | number;
-    /** */
-    customState?: Record<string, any>;
-};
-/**
- * Type representing a mask for key-value pairs.
- * @template K - A string representing the key type.
- */
-type DynamicDataTableMask<K extends string> = {
-    [key in K]?: boolean;
-};
-type DynamicDataTableCellIcon<K extends string> = {
-    [key in K]?: (rowId: string | number) => ReactNode;
-};
-/**
- * Interface representing the properties for a key-value table component.
- * @template K - A string representing the key type.
- */
-export type DynamicDataTableProps<K extends string> = {
-    /** An array containing two key-value headers. */
-    headers: DynamicDataTableHeaderType<K>[];
-    /** An array of key-value rows. */
-    rows: DynamicDataTableRowType<K>[];
-    /** */
-    sortingConfig?: {
-        sortBy: K;
-        sortOrder: SortingOrder;
-        handleSorting: () => void;
-    };
-    /** An optional mask for the key-value pairs. */
-    maskValue?: DynamicDataTableMask<K>;
-    /** */
-    leadingCellIcon?: DynamicDataTableCellIcon<K>;
-    /** */
-    trailingCellIcon?: DynamicDataTableCellIcon<K>;
-    /** An optional React node for a custom header component. */
-    headerComponent?: ReactNode;
-    /** When true, data addition field will not be shown. */
-    isAdditionNotAllowed?: boolean;
-    /** When true, data addition field will not be shown. */
-    isDeletionNotAllowed?: boolean;
-    /** When true, data add or update is disabled. */
-    readOnly?: boolean;
-    /** */
-    onRowAdd: () => void;
-    /**
-     * Function to handle changes in the table rows.
-     * @param row - The row that changed.
-     * @param headerKey - The key of the header that changed.
-     * @param value - The value of the cell.
-     */
-    onRowEdit: (row: DynamicDataTableRowType<K>, headerKey: K, value: string, extraData: {
-        selectedValue?: SelectPickerOptionType<string>;
-    }) => void;
-    /**
-     * Function to handle row deletions.
-     * @param row - The row that was deleted.
-     */
-    onRowDelete: (row: DynamicDataTableRowType<K>) => void;
-    /** */
-    actionButtonConfig?: {
-        renderer: (row: DynamicDataTableRowType<K>) => ReactNode;
-        key?: K;
-        /**
-         * @default '32px'
-         */
-        width?: string;
-        /**
-         * @default 'start'
-         */
-        position?: 'start' | 'end';
-    };
-    /**
-     * Indicates whether to show errors.
-     */
-    showError?: boolean;
-    /**
-     * An array of error messages to be displayed in the cell error tooltip.
-     */
-    errorMessages?: string[];
-    /**
-     * The function to use to validate the value of the cell.
-     * @param value - The value to validate.
-     * @param key - The row key of the value.
-     * @param rowId - The id of the row.
-     * @returns Return true if the value is valid, otherwise false
-     * and set `showError` to `true` and provide errorMessages array to show error message.
-     */
-    validationSchema?: (value: string, key: K, rowId: string | number) => boolean;
-};
-export interface DynamicDataTableHeaderProps<K extends string> extends Pick<DynamicDataTableProps<K>, 'headers' | 'rows' | 'headerComponent' | 'sortingConfig' | 'onRowAdd' | 'readOnly' | 'isAdditionNotAllowed' | 'isDeletionNotAllowed' | 'actionButtonConfig'> {
-}
-export interface DynamicDataTableRowProps<K extends string> extends Pick<DynamicDataTableProps<K>, 'rows' | 'headers' | 'maskValue' | 'isAdditionNotAllowed' | 'isDeletionNotAllowed' | 'readOnly' | 'onRowEdit' | 'onRowDelete' | 'actionButtonConfig' | 'showError' | 'errorMessages' | 'validationSchema' | 'leadingCellIcon' | 'trailingCellIcon'> {
-}
-export {};

package/dist/Shared/Components/DynamicDataTable/utils.d.ts

@@ -1,5 +0,0 @@
-import { DynamicDataTableHeaderType, DynamicDataTableProps, DynamicDataTableRowDataType } from './types';
-export declare const getActionButtonPosition: <K extends string>({ headers, actionButtonConfig, }: Pick<DynamicDataTableProps<K>, "headers" | "actionButtonConfig">) => number;
-export declare const getHeaderGridTemplateColumn: <K extends string>(headers: DynamicDataTableHeaderType<K>[], actionButtonConfig: DynamicDataTableProps<K>["actionButtonConfig"], noDeleteBtn: boolean) => string;
-export declare const getRowGridTemplateColumn: <K extends string>(headers: DynamicDataTableHeaderType<K>[], actionButtonConfig: DynamicDataTableProps<K>["actionButtonConfig"], noDeleteBtn: boolean) => string;
-export declare const rowTypeHasInputField: (type: DynamicDataTableRowDataType) => boolean;

package/dist/Shared/Components/MultipleResizableTextArea/MultipleResizableTextArea.d.ts

@@ -1,2 +0,0 @@
-import { MultipleResizableTextAreaProps } from './types';
-export declare const MultipleResizableTextArea: ({ value, minHeight, maxHeight, dataTestId, onChange, onBlur, onFocus, refVar, dependentRefs, className, disableOnBlurResizeToMinHeight, ...resProps }: MultipleResizableTextAreaProps) => JSX.Element;

package/dist/Shared/Components/MultipleResizableTextArea/index.d.ts

@@ -1,2 +0,0 @@
-export * from './MultipleResizableTextArea';
-export * from './types';

package/dist/Shared/Components/MultipleResizableTextArea/types.d.ts

@@ -1,9 +0,0 @@
-import { DetailedHTMLProps, MutableRefObject, TextareaHTMLAttributes } from 'react';
-export interface MultipleResizableTextAreaProps extends DetailedHTMLProps<TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement> {
-    minHeight?: number;
-    maxHeight?: number;
-    dataTestId?: string;
-    refVar?: MutableRefObject<HTMLTextAreaElement>;
-    dependentRefs?: Record<string | number, MutableRefObject<HTMLTextAreaElement>>;
-    disableOnBlurResizeToMinHeight?: boolean;
-}

package/dist/Shared/Components/SelectTextArea/SelectTextArea.d.ts

@@ -1,2 +0,0 @@
-import { SelectTextAreaProps } from './types';
-export declare const SelectTextArea: ({ value, selectedOptionIcon: Icon, onChange, options, inputId, placeholder, refVar, dependentRefs, disabled, selectPickerProps, textAreaProps, }: SelectTextAreaProps) => JSX.Element;

package/dist/Shared/Components/SelectTextArea/index.d.ts

@@ -1,2 +0,0 @@
-export * from './SelectTextArea';
-export * from './types';

package/dist/Shared/Components/SelectTextArea/types.d.ts

@@ -1,12 +0,0 @@
-import { ReactElement } from 'react';
-import { SelectPickerOptionType, SelectPickerProps } from '../SelectPicker';
-import { MultipleResizableTextAreaProps } from '../MultipleResizableTextArea';
-export type SelectTextAreaProps = Pick<SelectPickerProps<string, false>, 'inputId' | 'options'> & Pick<MultipleResizableTextAreaProps, 'refVar' | 'dependentRefs'> & {
-    value: string;
-    selectedOptionIcon?: ReactElement;
-    onChange?: (selectedValue: SelectPickerOptionType<string>) => void;
-    disabled?: boolean;
-    placeholder?: string;
-    textAreaProps?: Omit<MultipleResizableTextAreaProps, 'refVar' | 'dependentRefs' | 'id' | 'value' | 'onChange' | 'placeholder' | 'disabled'>;
-    selectPickerProps?: Omit<SelectPickerProps<string, false>, 'inputId' | 'options' | 'isDisabled' | 'onChange' | 'variant' | 'isCreatable' | 'value' | 'placeholder' | 'fullWidth' | 'selectRef' | 'onCreateOption' | 'isMulti'>;
-};