@devtron-labs/devtron-fe-common-lib 4.0.2-beta-1 → 4.0.3

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

@@ -0,0 +1,180 @@
+import { DetailedHTMLProps, ReactElement, ReactNode } from 'react';
+import { ResizableTagTextAreaProps } from '../../../Common/CustomTagSelector';
+import { UseStateFiltersReturnType } from '../../../Common/Hooks';
+import { TooltipProps } from '../../../Common/Tooltip';
+import { FileUploadProps } from '../FileUpload';
+import { SelectPickerOptionType, SelectPickerProps, SelectPickerTextAreaProps } from '../SelectPicker';
+/**
+ * Interface representing header for a dynamic data table.
+ * @template K - A string representing the key type.
+ */
+export type DynamicDataTableHeaderType<K extends string> = {
+    /** The display label of the header, shown in the table's column header. */
+    label: string;
+    /** The unique key associated with the header, used to map the column to data fields. */
+    key: K;
+    /** The width of the column, defined as a CSS string (e.g., "100px", "10%", "1fr", or "auto"). */
+    width: string;
+    /** An optional boolean indicating whether the column is sortable. */
+    isSortable?: boolean;
+    /** An optional boolean to control the visibility of the column. */
+    isHidden?: boolean;
+    /** An optional boolean to show the column */
+    renderAdditionalContent?: () => ReactNode;
+};
+export declare enum DynamicDataTableRowDataType {
+    TEXT = "text",
+    DROPDOWN = "dropdown",
+    SELECT_TEXT = "select-text",
+    BUTTON = "button",
+    FILE_UPLOAD = "file-upload"
+}
+export type DynamicDataTableCellPropsMap = {
+    [DynamicDataTableRowDataType.TEXT]: Omit<ResizableTagTextAreaProps, 'id' | 'className' | 'minHeight' | 'maxHeight' | 'value' | 'onChange' | 'disabled' | 'disableOnBlurResizeToMinHeight' | 'refVar' | 'dependentRef' | 'dependentRefs'>;
+    [DynamicDataTableRowDataType.DROPDOWN]: Omit<SelectPickerProps<string, false>, 'inputId' | 'value' | 'onChange' | 'fullWidth' | 'isDisabled'>;
+    [DynamicDataTableRowDataType.SELECT_TEXT]: Omit<SelectPickerTextAreaProps, 'inputId' | 'value' | 'onChange' | 'fullWidth' | 'isDisabled' | 'variant' | 'formatCreateLabel' | 'minHeight' | 'maxHeight' | 'refVar' | 'dependentRefs'>;
+    [DynamicDataTableRowDataType.BUTTON]: Pick<DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, 'onClick'> & {
+        icon?: ReactNode;
+        text: string;
+    };
+    [DynamicDataTableRowDataType.FILE_UPLOAD]: Omit<FileUploadProps, 'className' | 'fileName' | 'onUpload' | 'multiple'>;
+};
+type DynamicDataTableCellData<T extends keyof DynamicDataTableCellPropsMap = keyof DynamicDataTableCellPropsMap> = T extends keyof DynamicDataTableCellPropsMap ? {
+    type: T;
+    props: DynamicDataTableCellPropsMap[T];
+} : never;
+/**
+ * Type representing a key-value row.
+ * @template K - A string representing the key type.
+ */
+export type DynamicDataTableRowType<K extends string, CustomStateType = Record<string, unknown>> = {
+    data: {
+        [key in K]: {
+            value: string;
+            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'>>;
+        } & DynamicDataTableCellData;
+    };
+    id: string | number;
+    /** */
+    customState?: CustomStateType;
+    /** An optional boolean indicating if row deletion is disabled. */
+    disableDelete?: boolean;
+};
+/**
+ * Represents the validation state of a cell in a dynamic data table.
+ */
+export type DynamicDataTableCellValidationState = {
+    isValid: boolean;
+    errorMessages: string[];
+};
+/**
+ * Defines the structure of validation errors for a cell.
+ *
+ * `K` represents the column `key` of the cell (i.e., the column identifiers).
+ */
+export type DynamicDataTableCellErrorType<K extends string> = {
+    [rowId: string | number]: Partial<Record<K, DynamicDataTableCellValidationState>>;
+};
+type DynamicDataTableCellIcon<K extends string, CustomStateType = Record<string, unknown>> = {
+    [key in K]?: (row: DynamicDataTableRowType<K, CustomStateType>) => ReactNode;
+};
+/**
+ * Interface representing the properties for the dynamic data table component.
+ * @template K - A string representing the key type.
+ */
+export type DynamicDataTableProps<K extends string, CustomStateType = Record<string, unknown>> = {
+    /**
+     * An array containing the headers for the data table. \
+     * Each header defines a column with its label, key, width, and optional settings.
+     */
+    headers: DynamicDataTableHeaderType<K>[];
+    /**
+     * An array of rows where each row contains data corresponding to the table headers.
+     */
+    rows: DynamicDataTableRowType<K, CustomStateType>[];
+    /** Optional configuration for sorting the table. */
+    sortingConfig?: Pick<UseStateFiltersReturnType<K>, 'sortBy' | 'sortOrder' | 'handleSorting'>;
+    /** Optional configuration for displaying an icon in the leading position of a cell. */
+    leadingCellIcon?: DynamicDataTableCellIcon<K, CustomStateType>;
+    /** Optional configuration for displaying an icon in the trailing position of a cell. */
+    trailingCellIcon?: DynamicDataTableCellIcon<K, CustomStateType>;
+    /** An optional function to render a custom wrapper component for the type `DynamicDataTableRowDataType.BUTTON`. */
+    buttonCellWrapComponent?: (row: DynamicDataTableRowType<K, CustomStateType>) => ReactElement;
+    /** 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;
+    /** Tooltip for add button.
+     * @default 'Add'
+     */
+    addBtnTooltip?: string;
+    /** Function to handle the addition of a new row to the table. */
+    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.
+     * @param extraData - Additional data, such as a selected value for dropdowns.
+     */
+    onRowEdit: (row: DynamicDataTableRowType<K, CustomStateType>, headerKey: K, value: string, extraData: {
+        files?: File[];
+        selectedValue?: SelectPickerOptionType<string>;
+    }) => void;
+    /**
+     * Function to handle row deletions.
+     * @param row - The row that was deleted.
+     */
+    onRowDelete: (row: DynamicDataTableRowType<K, CustomStateType>) => void;
+    /** Optional configuration for rendering a custom action button in a row. */
+    actionButtonConfig?: {
+        /**
+         * Function to render the action button.
+         * @param row - The current row being rendered.
+         * @returns A React node representing the action button.
+         */
+        renderer: (row: DynamicDataTableRowType<K, CustomStateType>) => ReactNode;
+        /**
+         * This represents under which header key the action button will be rendered.
+         */
+        key: K;
+        /**
+         * The width of the action button.
+         * @default '33px'
+         */
+        width?: string;
+        /**
+         * The position of the action button under the header key.
+         * @default 'start'
+         */
+        position?: 'start' | 'end';
+    };
+    /**
+     * Validation state for a specific cell in a dynamic data table.
+     */
+    cellError?: DynamicDataTableCellErrorType<K>;
+    /**
+     * Header key to determine which cell should be focused after row addition.
+     * @default 'first column key'
+     */
+    focusableFieldKey?: K;
+    /**
+     * When true, the table will automatically focus the first focusable cell
+     * or cell key denoted by `focusableFieldKey` when the component mounts.
+     * @default false
+     */
+    shouldAutoFocusOnMount?: boolean;
+};
+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' | 'shouldAutoFocusOnMount'> {
+}
+export {};

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

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

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

@@ -14,5 +14,5 @@ import { EditImageFormFieldProps } from './types';
  *  />
  * ```
  */
-declare const EditImageFormField: ({ defaultIcon, errorMessage, handleError, url, handleURLChange, ariaLabelPrefix, dataTestIdPrefix, altText, }: EditImageFormFieldProps) => JSX.Element;
+declare const EditImageFormField: ({ defaultIcon, errorMessage, handleError, url, handleURLChange, ariaLabelPrefix, dataTestIdPrefix, altText, }: EditImageFormFieldProps) => import("react/jsx-runtime").JSX.Element;
 export default EditImageFormField;

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

@@ -1,3 +1,3 @@
 import { EditableTextAreaProps } from './types';
-declare const EditableTextArea: (props: EditableTextAreaProps) => JSX.Element;
+declare const EditableTextArea: (props: EditableTextAreaProps) => import("react/jsx-runtime").JSX.Element;
 export default EditableTextArea;

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

@@ -10,7 +10,6 @@ interface ValidationRule<T> {
 }
 export interface EditableTextAreaProps {
     placeholder?: string;
-    rows: number;
     updateContent: (value: string) => Promise<void>;
     initialText?: string;
     validations?: {

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

@@ -1,3 +1,3 @@
 import { EnvironmentSelectorProps } from './types';
-declare const EnvironmentSelector: <T>({ handleEnvironmentChange, selectedEnvironmentsMap, isMulti, placeholder, processOptions, styles, isClearable, autoFocus, }: EnvironmentSelectorProps<T>) => JSX.Element;
+declare const EnvironmentSelector: <T>({ handleEnvironmentChange, selectedEnvironmentsMap, isMulti, placeholder, processOptions, styles, isClearable, autoFocus, }: EnvironmentSelectorProps<T>) => import("react/jsx-runtime").JSX.Element;
 export default EnvironmentSelector;

package/dist/Shared/Components/Error/ErrorBar.d.ts

@@ -1,3 +1,3 @@
 import { ErrorBarType } from './types';
-declare const ErrorBar: ({ appDetails }: ErrorBarType) => JSX.Element;
+declare const ErrorBar: ({ appDetails, useParentMargin }: ErrorBarType) => import("react/jsx-runtime").JSX.Element;
 export default ErrorBar;

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

@@ -1,6 +1,10 @@
 import { AppDetails } from '../../types';
 export interface ErrorBarType {
     appDetails: AppDetails;
+    /**
+     * @default true
+     */
+    useParentMargin?: boolean;
 }
 export declare enum AppDetailsErrorType {
     ERRIMAGEPULL = "errimagepull",

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

@@ -1,2 +1,3 @@
 import { AppDetails } from '../../types';
-export declare const renderErrorHeaderMessage: (appDetails: AppDetails, key: string, onClickActionButton?: any) => JSX.Element;
+export declare const getIsImagePullBackOff: (appDetails: AppDetails) => boolean;
+export declare const renderErrorHeaderMessage: (appDetails: AppDetails, key: string, onClickActionButton?: any) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,3 +1,3 @@
 import { ExcludedImageNodeProps } from './types';
-declare const ExcludedImageNode: ({ image }: ExcludedImageNodeProps) => JSX.Element;
+declare const ExcludedImageNode: ({ image }: ExcludedImageNodeProps) => import("react/jsx-runtime").JSX.Element;
 export default ExcludedImageNode;

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

@@ -0,0 +1,3 @@
+import { ExportToCsvProps } from './types';
+declare const ExportToCsv: <HeaderItemType extends string>({ apiPromise, fileName, triggerElementConfig, disabled, modalConfig, headers, downloadRequestId, }: ExportToCsvProps<HeaderItemType>) => import("react/jsx-runtime").JSX.Element;
+export default ExportToCsv;

package/dist/Shared/Components/ExportToCsv/ExportToCsvDialog.d.ts

@@ -0,0 +1,3 @@
+import { ExportToCsvDialogProps } from './types';
+declare const ExportToCsvDialog: ({ exportDataError, isLoading, initiateDownload, handleCancelRequest, }: ExportToCsvDialogProps) => import("react/jsx-runtime").JSX.Element;
+export default ExportToCsvDialog;

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

@@ -0,0 +1,2 @@
+export { default as ExportToCsv } from './ExportToCsv';
+export * from './types';

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

@@ -0,0 +1,65 @@
+import { JSX } from 'react';
+import { ServerErrors } from '../../../Common/ServerError';
+import { APIOptions } from '../../../Common/Types';
+import { ButtonProps } from '../Button';
+type TriggerElementConfigType = {
+    buttonProps: ButtonProps;
+    showOnlyIcon?: boolean;
+    customButton?: never;
+    isExternalTrigger?: false;
+} | {
+    customButton: {
+        content: JSX.Element;
+        className: string;
+    };
+    buttonProps?: never;
+    showOnlyIcon?: false;
+    isExternalTrigger?: false;
+} | {
+    isExternalTrigger: true;
+    showOnlyIcon?: false;
+    buttonProps?: never;
+    customButton?: never;
+} | {
+    showOnlyIcon: true;
+    buttonProps?: never;
+    customButton?: never;
+    isExternalTrigger?: false;
+};
+export interface ExportToCsvProps<HeaderItemKeyType extends string> {
+    headers: {
+        label: string;
+        key: HeaderItemKeyType;
+    }[];
+    apiPromise: ({ signal, }: Pick<APIOptions, 'signal'>) => Promise<Record<HeaderItemKeyType, string | number | boolean>[]>;
+    fileName: string;
+    /**
+     * If nothing given will render a Button with "Export CSV" text
+     */
+    triggerElementConfig?: TriggerElementConfigType;
+    /**
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * If not given would show default dialog
+     */
+    modalConfig?: {
+        hideDialog: false;
+        renderCustomModal?: (proceedWithDownload: (shouldProceed: boolean) => void) => JSX.Element;
+    } | {
+        hideDialog: true;
+        renderCustomModal?: never;
+    };
+    /**
+     * If given, would trigger export on when this changes and has some value
+     */
+    downloadRequestId?: string | number;
+}
+export interface ExportToCsvDialogProps {
+    isLoading: boolean;
+    exportDataError: ServerErrors;
+    initiateDownload: () => void;
+    handleCancelRequest: () => void;
+}
+export {};

package/dist/Shared/Components/FeatureDescription/FeatureDescriptionModal.d.ts

@@ -1,2 +1,2 @@
 import { FeatureDescriptionModalProps } from './types';
-export declare const FeatureDescriptionModal: ({ title, renderDescriptionContent, closeModalText, docLink, closeModal, imageVariant, SVGImage, imageStyles, }: FeatureDescriptionModalProps) => JSX.Element;
+export declare const FeatureDescriptionModal: ({ title, renderDescriptionContent, closeModalText, docLink, closeModal, imageVariant, SVGImage, imageStyles, tabsConfig, }: FeatureDescriptionModalProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Shared/Components/FeatureDescription/FeatureTitleWithInfo.d.ts

@@ -1,3 +1,3 @@
 import { DescriptorProps } from './types';
-declare const FeatureTitleWithInfo: ({ additionalContainerClasses, breadCrumbs, children, iconClassName, title, renderDescriptionContent, closeModalText, docLink, SVGImage, showInfoIconTippy, docLinkText, dataTestId, additionalContent, showInfoIcon, }: DescriptorProps) => JSX.Element;
+declare const FeatureTitleWithInfo: ({ additionalContainerClasses, breadCrumbs, pathPattern, children, iconClassName, title, renderDescriptionContent, closeModalText, docLink, SVGImage, showInfoIconTippy, docLinkText, dataTestId, additionalContent, showInfoIcon, tabsConfig, }: DescriptorProps) => import("react/jsx-runtime").JSX.Element;
 export default FeatureTitleWithInfo;

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

@@ -1,18 +1,45 @@
 import { default as React, ReactNode } from 'react';
 import { ImageType } from '../../../Common';
 import { Breadcrumb } from '../../../Common/BreadCrumb/Types';
-export interface FeatureDescriptionModalProps {
-    title: string;
+import { DocLinkProps } from '../DocLink';
+interface BaseFeatureDescriptionModalProps {
     renderDescriptionContent?: () => ReactNode;
-    closeModalText?: string;
-    docLink?: string;
-    closeModal?: () => void;
+    docLink?: DocLinkProps['docLinkKey'];
     imageVariant?: ImageType;
     SVGImage?: React.FunctionComponent<React.SVGProps<SVGSVGElement>>;
     imageStyles?: React.CSSProperties;
 }
-export interface DescriptorProps extends FeatureDescriptionModalProps {
-    breadCrumbs?: Breadcrumb[];
+type FeatureDescriptionModalWithTabsConfig = {
+    /**
+     * If provided, tabs are shown and have higher precedence over normal modal
+     */
+    tabsConfig: ({
+        /**
+         * Unique id of the tab
+         */
+        id: string;
+        /**
+         * Title for the tab
+         */
+        title: string;
+    } & BaseFeatureDescriptionModalProps)[];
+} & {
+    renderDescriptionContent?: never;
+    docLink?: never;
+    imageVariant?: never;
+    SVGImage?: never;
+    imageStyles?: never;
+};
+export type FeatureDescriptionModalProps = {
+    title: React.ReactNode;
+    closeModalText?: string;
+    closeModal?: () => void;
+} & ((BaseFeatureDescriptionModalProps & {
+    tabsConfig?: never;
+}) | FeatureDescriptionModalWithTabsConfig);
+export type DescriptorProps = ((Omit<FeatureDescriptionModalProps, 'tabsConfig'> & {
+    tabsConfig?: never;
+}) | (Pick<FeatureDescriptionModalProps, 'title' | 'closeModalText' | 'closeModal'> & FeatureDescriptionModalWithTabsConfig)) & {
     additionalContainerClasses?: string;
     iconClassName?: string;
     children?: React.ReactNode;
@@ -26,4 +53,11 @@ export interface DescriptorProps extends FeatureDescriptionModalProps {
      * @default false
      */
     showInfoIcon?: boolean;
-}
+} & ({
+    breadCrumbs: Breadcrumb[];
+    pathPattern: string;
+} | {
+    breadCrumbs?: never;
+    pathPattern?: never;
+});
+export {};

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

@@ -0,0 +1,2 @@
+import { FileUploadProps } from './types';
+export declare const FileUpload: ({ isLoading, label, fileName, multiple, fileTypes, onUpload, }: FileUploadProps) => import("react/jsx-runtime").JSX.Element;

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

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

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

@@ -0,0 +1,8 @@
+export interface FileUploadProps {
+    isLoading?: boolean;
+    fileName: string;
+    onUpload: (files: File[]) => void;
+    multiple?: boolean;
+    label?: string;
+    fileTypes?: string[];
+}

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

@@ -2,5 +2,5 @@ import { FilterChipsProps } from './types';
 /**
  * Component for rendering the applied filter chips
  */
-declare const FilterChips: <T = Record<string, unknown>>({ filterConfig, clearFilters, onRemoveFilter, getFormattedLabel, getFormattedValue, className, clearButtonClassName, showClearAndRemove, shouldHideLabel, }: FilterChipsProps<T>) => JSX.Element;
+declare const FilterChips: <T = Record<string, unknown>>({ filterConfig, clearFilters, onRemoveFilter, getFormattedLabel, getFormattedValue, className, clearButtonClassName, showClearAndRemove, shouldHideLabel, }: FilterChipsProps<T>) => import("react/jsx-runtime").JSX.Element;
 export default FilterChips;

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

@@ -1,4 +1,3 @@
-import { ReactNode } from 'react';
 export interface FilterChipProps {
     /**
      * Filter label
@@ -15,11 +14,11 @@ export interface FilterChipProps {
     /**
      * If passed, the label will be formatted accordingly
      */
-    getFormattedLabel?: (filterKey: string) => ReactNode;
+    getFormattedLabel?: (filterKey: string) => string;
     /**
      * If passed, the label will be formatted accordingly
      */
-    getFormattedValue?: (filterKey: string, filterValue: unknown) => ReactNode;
+    getFormattedValue?: (filterKey: string, filterValue: unknown) => string;
     showRemoveIcon: boolean;
     /**
      * If true, would hide the label

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

@@ -0,0 +1,3 @@
+import { FlagImageProps } from './types';
+declare const FlagImage: ({ country, size }: FlagImageProps) => import("react/jsx-runtime").JSX.Element;
+export default FlagImage;

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

@@ -0,0 +1 @@
+export { default as FlagImage } from './FlagImage.component';

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

@@ -0,0 +1,5 @@
+import { CountryISO2Type } from '../../types';
+export interface FlagImageProps {
+    country: CountryISO2Type;
+    size?: number;
+}

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

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { FloatingVariablesSuggestionsProps } from './types';
+declare const _default: React.MemoExoticComponent<({ appId, envId, clusterId, hideObjectVariables, showValueOnHover, isTemplateView, boundaryGap, }: FloatingVariablesSuggestionsProps) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

package/dist/Shared/Components/FloatingVariablesSuggestions/SuggestionItem.d.ts

@@ -0,0 +1,3 @@
+import { SuggestionsItemProps } from './types';
+declare const SuggestionItem: ({ variableName, description, variableValue, isRedacted, highlightText, showValueOnHover, }: SuggestionsItemProps) => import("react/jsx-runtime").JSX.Element;
+export default SuggestionItem;

package/dist/Shared/Components/FloatingVariablesSuggestions/Suggestions.d.ts

@@ -0,0 +1,3 @@
+import { SuggestionsProps } from './types';
+declare const _default: import('react').MemoExoticComponent<({ handleDeActivation, loading, variables, reloadVariables, error, showValueOnHover, }: SuggestionsProps) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

package/dist/Shared/Components/FloatingVariablesSuggestions/SuggestionsInfo.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('react').MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+export default _default;

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

@@ -0,0 +1,4 @@
+export declare const NO_DEFINED_DESCRIPTION = "No Defined Description";
+export declare const NO_DEFINED_VALUE = "No Defined Value";
+export declare const SUGGESTIONS_INFO_TITLE = "What is scoped variable?";
+export declare const DRAG_SELECTOR = "handle-drag";

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

@@ -0,0 +1 @@
+export { default as FloatingVariablesSuggestions } from './FloatingVariablesSuggestions';

package/dist/Shared/Components/FloatingVariablesSuggestions/service.d.ts

@@ -0,0 +1,4 @@
+import { FloatingVariablesSuggestionsProps, ScopedVariableType } from './types';
+export declare const getScopedVariables: (appId: FloatingVariablesSuggestionsProps["appId"], envId: FloatingVariablesSuggestionsProps["envId"], clusterId: FloatingVariablesSuggestionsProps["clusterId"], { hideObjectVariables, isTemplateView, }: Pick<FloatingVariablesSuggestionsProps, "isTemplateView"> & {
+    hideObjectVariables?: boolean;
+}) => Promise<ScopedVariableType[]>;

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

@@ -0,0 +1,38 @@
+import { DraggableWrapperProps } from '../../../Common/DraggableWrapper';
+import { AppConfigProps } from '../../../Pages/index';
+export interface ScopedVariableType {
+    variableName: string;
+    shortDescription: string | null;
+    variableValue?: {
+        value: string | number | boolean | Record<string | number, unknown>;
+    } | null;
+    isRedacted: boolean;
+}
+export interface FloatingVariablesSuggestionsProps extends Required<Pick<AppConfigProps, 'isTemplateView'>>, Pick<DraggableWrapperProps, 'boundaryGap'> {
+    appId?: string;
+    envId?: string;
+    clusterId?: string;
+    /**
+     * This will hide the variables with object/array values if set to true
+     * @default true
+     */
+    hideObjectVariables?: boolean;
+    /**
+     * @default true
+     */
+    showValueOnHover?: boolean;
+}
+export interface SuggestionsProps extends Required<Pick<FloatingVariablesSuggestionsProps, 'showValueOnHover'>> {
+    handleDeActivation: (e: React.MouseEvent<HTMLOrSVGElement>) => void;
+    loading: boolean;
+    variables: ScopedVariableType[];
+    reloadVariables: () => void;
+    error: boolean;
+}
+export interface SuggestionsItemProps extends Pick<SuggestionsProps, 'showValueOnHover'> {
+    variableName: string;
+    description: string;
+    variableValue: Required<ScopedVariableType['variableValue']['value']>;
+    isRedacted: boolean;
+    highlightText: string;
+}

package/dist/Shared/Components/FormFieldWrapper/FormFieldInfo.d.ts

@@ -0,0 +1,3 @@
+import { FormFieldInfoProps } from './types';
+declare const FormFieldInfo: ({ error, helperText, warningText, inputId }: FormFieldInfoProps) => import("react/jsx-runtime").JSX.Element;
+export default FormFieldInfo;

package/dist/Shared/Components/FormFieldWrapper/FormFieldLabel.d.ts

@@ -0,0 +1,3 @@
+import { FormFieldLabelProps } from './types';
+declare const FormFieldLabel: ({ label, inputId, required, layout, labelTooltipConfig, labelTippyCustomizedConfig, }: FormFieldLabelProps) => import("react/jsx-runtime").JSX.Element;
+export default FormFieldLabel;

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

@@ -0,0 +1,3 @@
+import { FormFieldWrapperProps } from './types';
+declare const FormFieldWrapper: ({ layout, fullWidth, label, inputId, error, helperText, warningText, required, children, labelTippyCustomizedConfig, labelTooltipConfig, hideFormFieldInfo, }: Omit<Required<FormFieldWrapperProps>, "hideFormFieldInfo"> & Pick<FormFieldWrapperProps, "hideFormFieldInfo">) => import("react/jsx-runtime").JSX.Element;
+export default FormFieldWrapper;

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

@@ -0,0 +1,4 @@
+export { default as FormFieldInfo } from './FormFieldInfo';
+export { default as FormFieldWrapper } from './FormFieldWrapper';
+export type { FormFieldWrapperProps } from './types';
+export { getFormFieldAriaAttributes } from './utils';

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

@@ -0,0 +1,71 @@
+import { ReactElement, ReactNode } from 'react';
+import { TooltipProps } from '../../../Common/Tooltip';
+import { InfoIconTippyProps } from '../../../Common/Types';
+import { BorderConfigType, ComponentLayoutType } from '../../types';
+import { IconsProps } from '../Icon';
+export type LabelOrAriaLabelType = {
+    label: ReactNode;
+    ariaLabel?: never;
+} | {
+    label?: never;
+    ariaLabel: string;
+};
+export type FormFieldLabelProps<Layout extends ComponentLayoutType = ComponentLayoutType> = LabelOrAriaLabelType & {
+    /**
+     * If true, the field is required and * is shown with the label
+     */
+    required?: boolean;
+    /**
+     * Id of the input element
+     */
+    inputId: string;
+    /**
+     * Layout of the field
+     */
+    layout?: Layout;
+} & (Layout extends 'row' ? {
+    /**
+     * Tooltip configuration for the label in row layout
+     */
+    labelTooltipConfig?: Omit<TooltipProps, 'alwaysShowTippyOnHover' | 'showOnTruncate' | 'shortcutKeyCombo'>;
+    labelTippyCustomizedConfig?: never;
+} : {
+    labelTooltipConfig?: never;
+    /**
+     * Tippy configuration for the label in column layout
+     */
+    labelTippyCustomizedConfig?: Required<Pick<InfoIconTippyProps, 'heading' | 'infoText'>> & Pick<InfoIconTippyProps, 'documentationLink' | 'documentationLinkText'>;
+});
+export interface FormFieldInfoProps extends Pick<FormFieldLabelProps, 'inputId'> {
+    /**
+     * Error message for the field
+     */
+    error?: ReactNode;
+    /**
+     * Helper text for the field
+     */
+    helperText?: ReactNode;
+    /**
+     * Warning message for the field
+     */
+    warningText?: ReactNode;
+}
+export interface FormInfoItemProps {
+    id: FormFieldLabelProps['inputId'];
+    text: FormFieldInfoProps['error'];
+    textClass: string;
+    icon: IconsProps['name'];
+}
+export interface FormFieldWrapperProps extends Pick<FormFieldLabelProps, 'label' | 'required' | 'ariaLabel' | 'layout' | 'labelTippyCustomizedConfig' | 'labelTooltipConfig'>, FormFieldInfoProps {
+    /**
+     * If true, the field takes the full width of the parent
+     */
+    fullWidth?: boolean;
+    children: ReactElement;
+    borderRadiusConfig?: BorderConfigType;
+    borderConfig?: BorderConfigType;
+    /**
+     * @default false
+     */
+    hideFormFieldInfo?: boolean;
+}