@devtron-labs/devtron-fe-common-lib 1.12.0-pre-0-beta-1 → 1.12.0-pre-1

package/dist/{@common-rjsf-CwEIGtgd.js → @common-rjsf-B7ClJqlz.js}

@@ -1,7 +1,7 @@
 import { j as n, av as y, ax as k, aw as W } from "./@vendor-SjXFleuT.js";
 import V, { forwardRef as J, useMemo as P } from "react";
 import K, { getDefaultRegistry as q } from "@rjsf/core";
-import { T as F, j as N, c as v, b as S, a as Y, i as z, d as w, e as E, S as G } from "./@code-editor-DieGT18L.js";
+import { T as F, j as N, c as v, b as S, a as Y, i as z, d as w, e as E, S as G } from "./@code-editor-zI9gkFRk.js";
 import Q, { components as D } from "react-select";
 import { ReactComponent as X } from "./assets/ic-chevron-down.fc70d7a7.svg";
 import { getUiOptions as B, getTemplate as $, getSubmitButtonOptions as Z, ADDITIONAL_PROPERTY_FLAG as L, errorId as ee, englishStringTranslator as te, TranslatableString as ne, titleId as re, canExpand as se, deepEquals as ae } from "@rjsf/utils";

package/dist/Common/CIPipeline.Types.d.ts

@@ -1,4 +1,4 @@
-import { DynamicDataTableCellValidationState } from '../Shared/Components';
+import { DynamicDataTableCellValidationState, KeyValueTableData } from '../Shared/Components';
 export interface MaterialType {
     name: string;
     type: string;
@@ -123,7 +123,7 @@ export interface PortMapType {
     portOnLocal: number;
     portOnContainer: number;
 }
-interface ConditionDetails {
+export interface ConditionDetails {
     id: number;
     conditionOnVariable: string;
     conditionOperator: string;
@@ -220,10 +220,7 @@ export declare enum WORKFLOW_CACHE_CONFIG_ENUM {
 }
 export interface FormType {
     name: string;
-    args: {
-        key: string;
-        value: string;
-    }[];
+    args: KeyValueTableData[];
     materials: MaterialType[];
     gitHost: Githost;
     webhookEvents: WebhookEvent[];
@@ -271,22 +268,26 @@ export declare enum InputOutputVariablesHeaderKeys {
     FORMAT = "format",
     VALUE = "val"
 }
-export type InputOutputVariablesErrorObj = Record<InputOutputVariablesHeaderKeys, DynamicDataTableCellValidationState>;
+export declare enum ConditionDataTableHeaderKeys {
+    VARIABLE = "variable",
+    OPERATOR = "operator",
+    VALUE = "val"
+}
+type InputOutputVariablesErrorObj = Record<InputOutputVariablesHeaderKeys, DynamicDataTableCellValidationState>;
+type ConditionDetailsErrorObj = Record<ConditionDataTableHeaderKeys, DynamicDataTableCellValidationState>;
+interface StepDetailTaskErrorObj {
+    inputVariables?: Record<number, InputOutputVariablesErrorObj>;
+    outputVariables?: Record<number, InputOutputVariablesErrorObj>;
+    isInputVariablesValid?: boolean;
+    isOutputVariablesValid?: boolean;
+    conditionDetails?: Record<number, ConditionDetailsErrorObj>;
+    isConditionDetailsValid?: boolean;
+}
 export interface TaskErrorObj {
     isValid: boolean;
     name: ErrorObj;
-    inlineStepDetail?: {
-        inputVariables?: Record<number, InputOutputVariablesErrorObj>;
-        outputVariables?: Record<number, InputOutputVariablesErrorObj>;
-        isInputVariablesValid?: boolean;
-        isOutputVariablesValid?: boolean;
-    };
-    pluginRefStepDetail?: {
-        inputVariables?: Record<number, InputOutputVariablesErrorObj>;
-        outputVariables?: Record<number, InputOutputVariablesErrorObj>;
-        isInputVariablesValid?: boolean;
-        isOutputVariablesValid?: boolean;
-    };
+    inlineStepDetail?: StepDetailTaskErrorObj;
+    pluginRefStepDetail?: StepDetailTaskErrorObj;
 }
 export interface FormErrorObjectType {
     name: ErrorObj;

package/dist/Common/Common.service.d.ts

@@ -1,6 +1,6 @@
 import { MutableRefObject } from 'react';
 import { RuntimeParamsAPIResponseType, RuntimePluginVariables } from '../Shared/types';
-import { TeamList, ResponseType, DeploymentNodeType, CDMaterialServiceEnum, CDMaterialServiceQueryParams, CDMaterialResponseType, CDMaterialFilterQuery, EnvironmentListHelmResponse, UserApprovalMetadataType, GlobalVariableOptionType, UserRole, EnvAppsMetaDTO, GetAppsInfoForEnvProps } from './Types';
+import { TeamList, ResponseType, DeploymentNodeType, CDMaterialServiceEnum, CDMaterialServiceQueryParams, CDMaterialResponseType, CDMaterialFilterQuery, EnvironmentListHelmResponse, UserApprovalMetadataType, GlobalVariableOptionType, UserRole } from './Types';
 import { ApiResourceType } from '../Pages';
 export declare const getTeamListMin: () => Promise<TeamList>;
 export declare const SourceTypeMap: {
@@ -35,4 +35,3 @@ export declare const getGlobalVariables: ({ appId, isCD, abortControllerRef, }:
     isCD?: boolean;
     abortControllerRef?: MutableRefObject<AbortController>;
 }) => Promise<GlobalVariableOptionType[]>;
-export declare const getAppsInfoForEnv: ({ envId, appIds }: GetAppsInfoForEnvProps) => Promise<EnvAppsMetaDTO>;

package/dist/Common/Constants.d.ts

@@ -133,8 +133,6 @@ export declare const ROUTES: {
     readonly ENVIRONMENT_DATA: "global/environment-variables";
     readonly DASHBOARD_EVENT: "dashboard-event";
     readonly LICENSE_DATA: "license/data";
-    readonly ENV: "env";
-    readonly APP_METADATA: "app-metadata";
 };
 export declare enum KEY_VALUE {
     KEY = "key",

package/dist/Common/Hooks/UseRegisterShortcut/utils.d.ts

@@ -1,6 +1,6 @@
 import { ShortcutType } from './types';
 export declare const preprocessKeys: (keys: ShortcutType["keys"]) => {
-    keys: ("Alt" | "F" | "E" | "R" | "K" | "X" | "A" | "Home" | "End" | "." | "Space" | "Control" | "Shift" | "Meta" | "Escape" | "Enter" | "ArrowLeft" | "ArrowRight" | "ArrowUp" | "ArrowDown" | "PageUp" | "PageDown" | "Backspace" | "Delete")[];
+    keys: ("R" | "Alt" | "F" | "E" | "K" | "X" | "A" | "Home" | "End" | "." | "Space" | "Control" | "Shift" | "Meta" | "Escape" | "Enter" | "ArrowLeft" | "ArrowRight" | "ArrowUp" | "ArrowDown" | "PageUp" | "PageDown" | "Backspace" | "Delete")[];
     id: string;
 };
 export declare const verifyCallbackStack: (stack: ShortcutType["callbackStack"]) => void;

package/dist/Common/RJSF/Form.d.ts

@@ -1,3 +1,3 @@
 import { default as RJSF } from '@rjsf/core';
 import { FormProps } from './types';
-export declare const RJSFForm: import('react').ForwardRefExoticComponent<Pick<FormProps, "children" | "id" | "className" | "disabled" | "onChange" | "name" | "target" | "onFocus" | "onBlur" | "onSubmit" | "onError" | "autoComplete" | "action" | "method" | "tagName" | "noValidate" | "readonly" | "uiSchema" | "schema" | "formContext" | "formData" | "idPrefix" | "idSeparator" | "fields" | "templates" | "widgets" | "translateString" | "acceptcharset" | "acceptCharset" | "enctype" | "customValidate" | "extraErrors" | "extraErrorsBlockSubmit" | "noHtml5Validate" | "liveValidate" | "liveOmit" | "omitExtraData" | "showErrorList" | "transformErrors" | "focusOnFirstError" | "experimental_defaultFormStateBehavior" | "_internalFormWrapper"> & import('react').RefAttributes<RJSF<any, import('./types').RJSFFormSchema, any>>>;
+export declare const RJSFForm: import('react').ForwardRefExoticComponent<Pick<FormProps, "name" | "id" | "children" | "disabled" | "className" | "onChange" | "target" | "onFocus" | "onBlur" | "onSubmit" | "onError" | "autoComplete" | "action" | "method" | "tagName" | "noValidate" | "readonly" | "uiSchema" | "schema" | "formContext" | "formData" | "idPrefix" | "idSeparator" | "fields" | "templates" | "widgets" | "translateString" | "acceptcharset" | "acceptCharset" | "enctype" | "customValidate" | "extraErrors" | "extraErrorsBlockSubmit" | "noHtml5Validate" | "liveValidate" | "liveOmit" | "omitExtraData" | "showErrorList" | "transformErrors" | "focusOnFirstError" | "experimental_defaultFormStateBehavior" | "_internalFormWrapper"> & import('react').RefAttributes<RJSF<any, import('./types').RJSFFormSchema, any>>>;

package/dist/Common/Types.d.ts

@@ -2,7 +2,7 @@ import { default as React, ReactNode, CSSProperties, ReactElement, MutableRefObj
 import { TippyProps } from '@tippyjs/react';
 import { UserGroupDTO } from '../Pages/GlobalConfigurations';
 import { ImageComment, ReleaseTag } from './ImageTags.Types';
-import { MandatoryPluginBaseStateType, RegistryType, RuntimePluginVariables, Severity, PolicyBlockInfo, TargetPlatformItemDTO, ButtonProps, ComponentLayoutType, StatusType } from '../Shared';
+import { MandatoryPluginBaseStateType, RegistryType, RuntimePluginVariables, Severity, PolicyBlockInfo, TargetPlatformItemDTO, ButtonProps, ComponentLayoutType } from '../Shared';
 import { ACTION_STATE, DEPLOYMENT_WINDOW_TYPE, DockerConfigOverrideType, RefVariableType, SortingOrder, TaskErrorObj, VariableTypeFormat } from '.';
 /**
  * Generic response type object with support for overriding the result type
@@ -949,17 +949,4 @@ export declare enum ActionTypes {
     EDIT = "edit",
     APPROVER = "approver"
 }
-export interface GetAppsInfoForEnvProps {
-    envId: number;
-    appIds?: number[];
-}
-export interface AppMeta {
-    appId: number;
-    appStatus: StatusType;
-    appName: string;
-}
-export interface EnvAppsMetaDTO {
-    appCount: number;
-    apps: AppMeta[];
-}
 export {};

package/dist/Shared/Components/CMCS/constants.d.ts

@@ -1,4 +1,4 @@
-import { CMSecretYamlData } from '../../Services';
+import { KeyValueTableData } from '../KeyValueTable';
 import { ConfigMapSecretDataTypeOptionType } from './types';
 export declare const CONFIG_MAP_SECRET_YAML_PARSE_ERROR = "Please provide valid YAML";
 export declare const SECRET_TOAST_INFO: {
@@ -10,7 +10,7 @@ export declare const SECRET_TOAST_INFO: {
     BOTH_ESO_DATA_AND_DATA_FROM_UNAVAILABLE: string;
 };
 export declare const configMapDataTypeOptions: ConfigMapSecretDataTypeOptionType[];
-export declare const CONFIG_MAP_SECRET_DEFAULT_CURRENT_DATA: CMSecretYamlData[];
+export declare const CONFIG_MAP_SECRET_DEFAULT_CURRENT_DATA: KeyValueTableData[];
 export declare const configMapSecretMountDataMap: {
     environment: {
         title: string;

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

@@ -1,8 +1,9 @@
 import { GroupBase, OptionsOrGroups } from 'react-select';
-import { CMSecretPayloadType, CMSecretYamlData, ConfigMapSecretUseFormProps, ESOSecretData, GetConfigMapSecretFormInitialValuesParamsType } from '../../Services';
+import { CMSecretPayloadType, ConfigMapSecretUseFormProps, ESOSecretData, GetConfigMapSecretFormInitialValuesParamsType } from '../../Services';
+import { KeyValueTableData } from '../KeyValueTable';
 import { ConfigMapSecretDataTypeOptionType, GetConfigMapSecretReadOnlyValuesParamsType } from './types';
 export declare const getSecretDataTypeOptions: (isJob: boolean, isHashiOrAWS: boolean) => ConfigMapSecretDataTypeOptionType[] | OptionsOrGroups<ConfigMapSecretDataTypeOptionType, GroupBase<ConfigMapSecretDataTypeOptionType>>;
-export declare const convertKeyValuePairToYAML: (currentData: CMSecretYamlData[]) => string;
+export declare const convertKeyValuePairToYAML: (currentData: KeyValueTableData[]) => string;
 export declare const getConfigMapSecretFormInitialValues: ({ isJob, configMapSecretData, cmSecretStateLabel, componentType, skipValidation, fallbackMergeStrategy, }: GetConfigMapSecretFormInitialValuesParamsType) => ConfigMapSecretUseFormProps;
 export declare const getConfigMapSecretReadOnlyValues: ({ configMapSecretData, cmSecretStateLabel, componentType, isJob, fallbackMergeStrategy, displayKeys, }: GetConfigMapSecretReadOnlyValuesParamsType) => {
     configData: {
@@ -12,6 +13,6 @@ export declare const getConfigMapSecretReadOnlyValues: ({ configMapSecretData, c
     }[];
     data: string;
 };
-export declare const convertYAMLToKeyValuePair: (yaml: string) => CMSecretYamlData[];
+export declare const convertYAMLToKeyValuePair: (yaml: string) => KeyValueTableData[];
 export declare const getESOSecretDataFromYAML: (yaml: string) => ESOSecretData;
 export declare const getConfigMapSecretPayload: ({ isSecret, external, externalType, externalSubpathValues, yaml, yamlMode, currentData, esoSecretYaml, filePermission, name, selectedType, isFilePermissionChecked, roleARN, volumeMountPath, isSubPathChecked, mergeStrategy, }: ConfigMapSecretUseFormProps) => CMSecretPayloadType;

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

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

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

@@ -112,6 +112,10 @@ export type DynamicDataTableProps<K extends string, CustomStateType = Record<str
     isDeletionNotAllowed?: boolean;
     /** When true, data add or update is disabled. */
     readOnly?: boolean;
+    /** Tooltip for add button.
+     * @default 'Add'
+     */
+    addBtnTooltip?: string;
     /** Function to handle the addition of a new row to the table. */
     onRowAdd: () => void;
     /**
@@ -163,7 +167,7 @@ export type DynamicDataTableProps<K extends string, CustomStateType = Record<str
      */
     focusableFieldKey?: K;
 };
-export interface DynamicDataTableHeaderProps<K extends string, CustomStateType = Record<string, unknown>> extends Pick<DynamicDataTableProps<K, CustomStateType>, 'headers' | 'rows' | 'headerComponent' | 'sortingConfig' | 'onRowAdd' | 'readOnly' | 'isAdditionNotAllowed' | 'isDeletionNotAllowed' | 'actionButtonConfig'> {
+export interface DynamicDataTableHeaderProps<K extends string, CustomStateType = Record<string, unknown>> extends Pick<DynamicDataTableProps<K, CustomStateType>, 'headers' | 'rows' | 'headerComponent' | 'sortingConfig' | 'addBtnTooltip' | 'onRowAdd' | 'readOnly' | 'isAdditionNotAllowed' | 'isDeletionNotAllowed' | 'actionButtonConfig'> {
 }
 export interface DynamicDataTableRowProps<K extends string, CustomStateType = Record<string, unknown>> extends Pick<DynamicDataTableProps<K, CustomStateType>, 'rows' | 'headers' | 'isAdditionNotAllowed' | 'isDeletionNotAllowed' | 'readOnly' | 'onRowEdit' | 'onRowDelete' | 'actionButtonConfig' | 'cellError' | 'leadingCellIcon' | 'trailingCellIcon' | 'buttonCellWrapComponent' | 'focusableFieldKey'> {
 }

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

@@ -56,7 +56,6 @@ export declare const iconMap: {
     'ic-google-container-registry': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-google': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-grid-view': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
-    'ic-hand-pointing': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-heart-green': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-heart-red-animated': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-heart-red': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
@@ -92,7 +91,6 @@ export declare const iconMap: {
     'ic-pencil': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-quay': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-quote': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
-    'ic-rocket-launch': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-shield-check': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-sliders-vertical': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;
     'ic-sort-ascending': import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement>>;

package/dist/Shared/Components/KeyValueTable/KeyValueTable.component.d.ts

@@ -1,2 +1,2 @@
 import { KeyValueTableProps } from './KeyValueTable.types';
-export declare const KeyValueTable: <K extends string>({ config, maskValue, isSortable, headerComponent, onChange, onDelete, placeholder, isAdditionNotAllowed, readOnly, showError, validationSchema: parentValidationSchema, errorMessages: parentErrorMessages, onError, validateDuplicateKeys, validateEmptyKeys, }: KeyValueTableProps<K>) => JSX.Element;
+export declare const KeyValueTable: ({ headerLabel, rows: initialRows, placeholder, maskValue, isSortable, headerComponent, onChange, isAdditionNotAllowed, readOnly, showError, validationSchema: parentValidationSchema, onError, validateDuplicateKeys, validateEmptyKeys, }: KeyValueTableProps) => JSX.Element;

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

@@ -1,40 +1,7 @@
-import { ReactNode } from 'react';
-import { ResizableTagTextAreaProps } from '../../../Common';
-/**
- * Interface representing a key-value header.
- * @template K - A string representing the key type.
- */
-export interface KeyValueHeader<K extends string> {
-    /** The label of the header. */
-    label: string;
-    /** The key associated with the header. */
-    key: K;
-    /** An optional class name for the header. */
-    className?: string;
-}
-/**
- * Type representing a key-value row.
- * @template K - A string representing the key type.
- */
-export type KeyValueRow<K extends string> = {
-    data: {
-        [key in K]: Pick<ResizableTagTextAreaProps, 'value' | 'disabled' | 'tabIndex'> & {
-            /** An optional boolean indicating if an asterisk should be shown. */
-            required?: boolean;
-        };
-    };
-    id: string | number;
-};
-/**
- * Interface representing the configuration for a key-value table.
- * @template K - A string representing the key type.
- */
-export interface KeyValueConfig<K extends string> {
-    /** An array containing two key-value headers. */
-    headers: [KeyValueHeader<K>, KeyValueHeader<K>];
-    /** An array of key-value rows. */
-    rows: KeyValueRow<K>[];
-}
+import { TooltipProps } from '../../../Common/Tooltip';
+import { DynamicDataTableProps } from '../DynamicDataTable';
+export type KeyValueTableDataType = 'key' | 'value';
+export type KeyValueTableInternalProps = DynamicDataTableProps<KeyValueTableDataType, never>;
 type ErrorUIProps = {
     /**
      * Indicates whether to show errors.
@@ -58,63 +25,93 @@ type ErrorUIProps = {
     validateDuplicateKeys?: never;
     validateEmptyKeys?: never;
 };
-/**
- * Type representing a mask for key-value pairs.
- * @template K - A string representing the key type.
- */
-export type KeyValueMask<K extends string> = {
+export type KeyValueHeaderLabel<K extends KeyValueTableDataType = KeyValueTableDataType> = {
+    [key in K]: string;
+};
+export type KeyValueMask<K extends KeyValueTableDataType = KeyValueTableDataType> = {
     [key in K]?: boolean;
 };
-export type KeyValuePlaceholder<K extends string> = {
+export type KeyValuePlaceholder<K extends KeyValueTableDataType = KeyValueTableDataType> = {
     [key in K]?: string;
 };
+export interface KeyValueTableRowType<K extends KeyValueTableDataType = KeyValueTableDataType> {
+    id: string | number;
+    data: {
+        [key in K]: {
+            value: string;
+            /** An optional boolean indicating if the cell should be marked as disabled. */
+            disabled?: boolean;
+            /** An optional boolean indicating if an asterisk should be shown. */
+            required?: boolean;
+            /** An optional tooltip to show when hovering over cell. */
+            tooltip?: Partial<Pick<TooltipProps, 'content' | 'className'>>;
+        };
+    };
+}
+export interface KeyValueTableData extends Pick<KeyValueTableRowType, 'id'> {
+    key: string;
+    value: string;
+}
 /**
- * Interface representing the properties for a key-value table component.
- * @template K - A string representing the key type.
+ * Props for the KeyValueTable component.
  */
-export type KeyValueTableProps<K extends string> = {
-    /** The configuration for the key-value table. */
-    config: KeyValueConfig<K>;
-    /** An optional mask for the key-value pairs. */
-    maskValue?: KeyValueMask<K>;
-    placeholder?: KeyValuePlaceholder<K>;
-    /** An optional boolean indicating if the table is sortable. */
-    isSortable?: boolean;
-    /** 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 add or update is disabled. */
-    readOnly?: boolean;
+export type KeyValueTableProps = Pick<DynamicDataTableProps<KeyValueTableDataType>, 'isAdditionNotAllowed' | 'readOnly' | 'headerComponent'> & {
     /**
-     * An optional function to handle changes in the table rows.
-     * @param rowId - The id of the row that changed.
-     * @param headerKey - The key of the header that changed.
-     * @param value - The value of the cell.
+     * The label for the table header.
      */
-    onChange?: (rowId: string | number, headerKey: K, value: string) => void;
+    headerLabel: KeyValueHeaderLabel;
     /**
-     * An optional function to handle row deletions.
-     * @param deletedRowIndex - The index of the row that was deleted.
+     * The rows of the key-value table.
      */
-    onDelete?: (deletedRowId: string | number) => void;
+    rows: KeyValueTableRowType[];
     /**
-     * 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.
+     * An optional configuration to mask values in the table.
      */
-    validationSchema?: (value: string, key: K, rowId: string | number) => boolean;
+    maskValue?: KeyValueMask;
     /**
-     * An array of error messages to be displayed in the cell error tooltip.
+     * An optional placeholder configuration for the table columns.
      */
-    errorMessages?: string[];
+    placeholder?: KeyValuePlaceholder;
+    /**
+     * An optional boolean indicating if the `key` column is sortable.
+     */
+    isSortable?: boolean;
+    /**
+     * A callback function triggered when the table rows change.
+     *
+     * @param data - The updated table data.
+     */
+    onChange: (data: KeyValueTableData[]) => void;
+    /**
+     * A function to validate the value of a cell.
+     *
+     * @param value - The value to validate.
+     * @param key - The key of the header associated with the value.
+     * @param row - The row containing the value.
+     * @returns A boolean indicating whether the value is valid. If false,
+     *          `showError` should be set to `true` and `errorMessages` should
+     *          provide an array of error messages to display.
+     */
+    validationSchema?: (value: string, key: KeyValueTableDataType, row: KeyValueTableRowType) => {
+        /** Boolean indicating if the cell data is valid or not. */
+        isValid: boolean;
+        /**
+         * An array of error messages to display in the cell error tooltip.
+         */
+        errorMessages?: string[];
+    };
     /**
-     * A callback function called when an error occurs.
-     * @param errorState - The error state, true when any cell has error, otherwise false.
+     * A callback function triggered when an error occurs in the table.
+     *
+     * @param errorState - A boolean indicating the error state. True if any
+     *                     cell has an error, otherwise false.
      */
     onError?: (errorState: boolean) => void;
 } & ErrorUIProps;
+export type KeyValueValidationSchemaProps = {
+    value: Parameters<KeyValueTableProps['validationSchema']>[0];
+    key: Parameters<KeyValueTableProps['validationSchema']>[1];
+    row: Parameters<KeyValueTableProps['validationSchema']>[2];
+    keysFrequency?: Record<string, number>;
+} & Pick<KeyValueTableProps, 'validateDuplicateKeys' | 'validateEmptyKeys' | 'validationSchema'> & Partial<Pick<KeyValueTableInternalProps, 'rows'>>;
 export {};

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

@@ -1,2 +1,2 @@
 export * from './KeyValueTable.component';
-export * from './KeyValueTable.types';
+export type { KeyValueTableData, KeyValueTableProps } from './KeyValueTable.types';

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

@@ -0,0 +1,13 @@
+import { UseStateFiltersReturnType } from '../../../Common/Hooks';
+import { KeyValueTableData, KeyValueTableDataType, KeyValueTableInternalProps, KeyValueTableProps, KeyValueValidationSchemaProps } from './KeyValueTable.types';
+export declare const getModifiedDataForOnChange: (rows: KeyValueTableInternalProps["rows"]) => KeyValueTableData[];
+export declare const getEmptyRow: (placeholder: KeyValueTableProps["placeholder"]) => KeyValueTableInternalProps["rows"][number];
+export declare const getKeyValueTableRows: ({ rows: initialRows, placeholder, maskValue, }: Required<Pick<KeyValueTableProps, "rows" | "placeholder" | "maskValue">>) => KeyValueTableInternalProps["rows"];
+export declare const getKeyValueTableSortedRows: ({ rows, sortBy, sortOrder, }: Required<Pick<UseStateFiltersReturnType<KeyValueTableDataType>, "sortBy" | "sortOrder">> & Pick<KeyValueTableInternalProps, "rows">) => import('../DynamicDataTable').DynamicDataTableRowType<KeyValueTableDataType, never>[];
+export declare const getKeyValueHeaders: ({ headerLabel, isSortable, }: Pick<KeyValueTableProps, "headerLabel" | "isSortable">) => KeyValueTableInternalProps["headers"];
+export declare const getKeyValueTableCellError: ({ validateDuplicateKeys, validateEmptyKeys, validationSchema: parentValidationSchema, rows, }: Pick<KeyValueValidationSchemaProps, "validateDuplicateKeys" | "validateEmptyKeys" | "validationSchema" | "rows"> & {
+    skipValidationIfValueIsEmpty?: boolean;
+}) => {
+    isValid: boolean;
+    updatedCellError: {};
+};

package/dist/Shared/Services/app.types.d.ts

@@ -1,3 +1,4 @@
+import { KeyValueTableData } from '../Components';
 import { TargetPlatformsDTO } from '../types';
 import { OverrideMergeStrategyType } from '../../Pages/Applications';
 import { ReleaseTag, ResponseType, UserApprovalMetadataType } from '../../Common';
@@ -185,11 +186,6 @@ export interface ConfigMapSecretDataType {
     configData: ConfigMapSecretDataConfigDatumDTO[];
     isDeletable: boolean;
 }
-export interface CMSecretYamlData {
-    k: string;
-    v: string;
-    id: string | number;
-}
 export interface ConfigMapSecretUseFormProps {
     name: string;
     isSecret: boolean;
@@ -204,7 +200,7 @@ export interface ConfigMapSecretUseFormProps {
     roleARN: string;
     yamlMode: boolean;
     yaml: string;
-    currentData: CMSecretYamlData[];
+    currentData: KeyValueTableData[];
     secretDataYaml: string;
     esoSecretYaml: string;
     hasCurrentDataErr: boolean;

package/dist/assets/ic-nav-rocket.433c9706.svg

@@ -0,0 +1,19 @@
+<!--
+  - Copyright (c) 2024. Devtron Inc.
+  -
+  - Licensed under the Apache License, Version 2.0 (the "License");
+  - you may not use this file except in compliance with the License.
+  - You may obtain a copy of the License at
+  -
+  -     http://www.apache.org/licenses/LICENSE-2.0
+  -
+  - Unless required by applicable law or agreed to in writing, software
+  - distributed under the License is distributed on an "AS IS" BASIS,
+  - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  - See the License for the specific language governing permissions and
+  - limitations under the License.
+  -->
+
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.34833 14.419C6.46444 17.0707 2.92891 17.0707 2.92891 17.0707C2.92891 17.0707 2.92891 13.5351 5.58056 12.6513M9.99998 13.5351L15.3033 8.23183C17.3114 6.2237 17.2918 4.21556 17.164 3.35914C17.1444 3.22728 17.0829 3.10522 16.9886 3.01095C16.8944 2.91668 16.7723 2.85518 16.6404 2.83553C15.784 2.70775 13.7759 2.68816 11.7677 4.6963L6.46444 9.9996M9.99998 13.5351L6.46444 9.9996M9.99998 13.5351L10.6548 16.8094C10.677 16.9203 10.7289 17.0232 10.8049 17.1069C10.881 17.1907 10.9783 17.2522 11.0866 17.285C11.1949 17.3178 11.31 17.3206 11.4197 17.2931C11.5294 17.2655 11.6296 17.2088 11.7096 17.1288L14.2363 14.6021C14.2944 14.544 14.3404 14.4751 14.3718 14.3993C14.4032 14.3235 14.4194 14.2422 14.4194 14.1601V9.11572M6.46444 9.9996L3.19017 9.34474C3.07924 9.32256 2.97642 9.27068 2.89266 9.19465C2.8089 9.11861 2.74734 9.02127 2.71456 8.913C2.68178 8.80473 2.679 8.68959 2.70651 8.57986C2.73403 8.47013 2.79081 8.36993 2.8708 8.28994L5.3975 5.76324C5.45554 5.7052 5.52444 5.65917 5.60027 5.62776C5.6761 5.59635 5.75737 5.58018 5.83944 5.58018H10.8839" stroke="#fff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>