@devtron-labs/devtron-fe-common-lib 4.0.2 → 4.0.3-pre-0

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

@@ -1,5 +1,9 @@
-import { SeverityCount } from '../../types';
-import { SeveritiesDTO } from './SecurityModal/types';
-export declare const getTotalSeverityCount: (severityCount: SeverityCount) => number;
-export declare const getSeverityCountFromSummary: (scanResultSeverities: Partial<Record<SeveritiesDTO, number>>) => SeverityCount;
+import { ImageScanLicenseListType, ImageScanVulnerabilityListType, StatusType } from './SecurityModal/types';
+import { ScanResultDTO, SeveritiesDTO } from './SecurityModal';
+import { CategoriesConfig, SecurityConfigType } from './types';
 export declare const getCVEUrlFromCVEName: (cveName: string) => string;
+export declare const getTotalSeverities: (severityCount: Partial<Record<SeveritiesDTO, number>>) => number;
+export declare const getSecurityConfig: ({ imageScan, codeScan, kubernetesManifest, }: CategoriesConfig) => SecurityConfigType;
+export declare const getCompiledSecurityThreats: (scanResult: ScanResultDTO) => Partial<Record<SeveritiesDTO, number>>;
+export declare const getStatusForScanList: (scanList: ImageScanVulnerabilityListType[] | ImageScanLicenseListType[]) => StatusType["status"];
+export declare const getSecurityScanStatus: (scanResult: ScanResultDTO) => StatusType["status"];

package/dist/Shared/Components/SelectPicker/FilterSelectPicker.d.ts

@@ -1,3 +1,3 @@
 import { FilterSelectPickerProps } from './type';
-declare const FilterSelectPicker: ({ appliedFilterOptions, handleApplyFilter, options, ...props }: FilterSelectPickerProps) => JSX.Element;
-export default FilterSelectPicker;
+declare const FilterSelectPickerWrapper: (props: FilterSelectPickerProps) => import("react/jsx-runtime").JSX.Element;
+export default FilterSelectPickerWrapper;

package/dist/Shared/Components/SelectPicker/GroupedFilterSelectPicker.d.ts

@@ -0,0 +1,2 @@
+import { GroupedFilterSelectPickerProps } from './type';
+export declare const GroupedFilterSelectPicker: <T extends string | number>({ id, filterSelectPickerPropsMap, isFilterApplied, ...restProps }: GroupedFilterSelectPickerProps<T>) => import("react/jsx-runtime").JSX.Element;

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

@@ -37,16 +37,15 @@ import { SelectPickerProps } from './type';
  * <SelectPicker ... helperText="Help information" />
  * ```
  *
- * @example Menu list footer
+ * @example Menu list footer config
  * The footer is sticky by default
  * ```tsx
  * <SelectPicker
  *      ...
- *      renderMenuListFooter={() => (
- *          <div className="px-8 py-6 dc__border-top bcn-50 cn-6">
- *              <div>Foot note</div>
- *          </div>
- *      )}
+ *      menuListFooterConfig={{
+ *          type: 'text',
+ *          value: 'Info text',
+ *      }}
  * />
  * ```
  *
@@ -134,5 +133,5 @@ import { SelectPickerProps } from './type';
  * />
  * ```
  */
-declare const SelectPicker: <OptionValue, IsMulti extends boolean>({ error, icon, helperText, placeholder, label, showSelectedOptionIcon, size, disabledTippyContent, showSelectedOptionsCount, menuSize, optionListError, reloadOptionList, menuPosition, variant, disableDescriptionEllipsis, multiSelectProps, isMulti, name, classNamePrefix, shouldRenderCustomOptions, isSearchable, selectRef, shouldMenuAlignRight, fullWidth, customSelectedOptionsCount, renderMenuListFooter, inputValue, onInputChange, isCreatable, onCreateOption, closeMenuOnSelect, ...props }: SelectPickerProps<OptionValue, IsMulti>) => JSX.Element;
+declare const SelectPicker: <OptionValue, IsMulti extends boolean>({ error, icon, keyboardShortcut, helperText, placeholder, label, showSelectedOptionIcon, size, disabledTippyContent, showSelectedOptionsCount, menuSize, optionListError, reloadOptionList, menuPosition, variant, disableDescriptionEllipsis, isUserIdentifier, multiSelectProps, isMulti, name, classNamePrefix, shouldRenderCustomOptions, isSearchable, selectRef: refFromConsumer, shouldMenuAlignRight, fullWidth, customSelectedOptionsCount, menuListFooterConfig, isCreatable, onCreateOption, closeMenuOnSelect: _closeMenuOnSelect, shouldShowNoOptionsMessage, shouldRenderTextArea, onKeyDown, shouldHideMenu, warningText, layout, ariaLabel, borderConfig, borderRadiusConfig, labelTippyCustomizedConfig, labelTooltipConfig, hideFormFieldInfo, autoFocus, showCheckboxForMultiSelect, ...props }: SelectPickerProps<OptionValue, IsMulti>) => import("react/jsx-runtime").JSX.Element;
 export default SelectPicker;

package/dist/Shared/Components/SelectPicker/SelectPickerTextArea.component.d.ts

@@ -0,0 +1,2 @@
+import { SelectPickerTextAreaProps } from './type';
+export declare const SelectPickerTextArea: ({ value, options, isCreatable, onChange, minHeight, maxHeight, refVar, dependentRefs, filterOption: filterOptionProp, ...props }: SelectPickerTextAreaProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Shared/Components/SelectPicker/common.d.ts

@@ -1,12 +1,16 @@
-import { DropdownIndicatorProps, ControlProps, OptionProps, ClearIndicatorProps, ValueContainerProps, MenuListProps, MultiValueRemoveProps, MultiValueProps } from 'react-select';
+import { ClearIndicatorProps, ControlProps, DropdownIndicatorProps, InputProps, MenuListProps, MultiValueProps, OptionProps, ValueContainerProps } from 'react-select';
+import { TooltipProps } from '../../../Common/Tooltip';
 import { SelectPickerGroupHeadingProps, SelectPickerOptionType, SelectPickerProps } from './type';
-export declare const SelectPickerDropdownIndicator: <OptionValue>(props: DropdownIndicatorProps<SelectPickerOptionType<OptionValue>>) => JSX.Element;
-export declare const SelectPickerClearIndicator: <OptionValue>(props: ClearIndicatorProps<SelectPickerOptionType<OptionValue>>) => JSX.Element;
-export declare const SelectPickerControl: <OptionValue, IsMulti extends boolean>({ icon, showSelectedOptionIcon, ...props }: ControlProps<SelectPickerOptionType<OptionValue>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "icon" | "showSelectedOptionIcon">) => JSX.Element;
-export declare const SelectPickerValueContainer: <OptionValue, IsMulti extends boolean>({ showSelectedOptionsCount, customSelectedOptionsCount, ...props }: ValueContainerProps<SelectPickerOptionType<OptionValue>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "showSelectedOptionsCount" | "customSelectedOptionsCount">) => JSX.Element;
-export declare const SelectPickerLoadingIndicator: () => JSX.Element;
-export declare const SelectPickerOption: <OptionValue, IsMulti extends boolean>({ disableDescriptionEllipsis, ...props }: OptionProps<SelectPickerOptionType<OptionValue>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "disableDescriptionEllipsis">) => JSX.Element;
-export declare const SelectPickerMenuList: <OptionValue>(props: MenuListProps<SelectPickerOptionType<OptionValue>>) => JSX.Element;
-export declare const SelectPickerMultiValueLabel: <OptionValue, IsMulti extends boolean>({ getIsOptionValid, ...props }: MultiValueProps<SelectPickerOptionType<OptionValue>, true> & Pick<SelectPickerProps<OptionValue, IsMulti>["multiSelectProps"], "getIsOptionValid">) => JSX.Element;
-export declare const SelectPickerMultiValueRemove: (props: MultiValueRemoveProps) => JSX.Element;
-export declare const SelectPickerGroupHeading: <OptionValue>({ isGroupHeadingSelectable, ...props }: SelectPickerGroupHeadingProps<OptionValue>) => JSX.Element;
+export declare const getTooltipProps: (tooltipProps?: SelectPickerOptionType["tooltipProps"]) => TooltipProps;
+export declare const SelectPickerDropdownIndicator: <OptionValue>(props: DropdownIndicatorProps<SelectPickerOptionType<OptionValue>>) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerClearIndicator: <OptionValue>(props: ClearIndicatorProps<SelectPickerOptionType<OptionValue>>) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerControl: <OptionValue>(props: ControlProps<SelectPickerOptionType<OptionValue>>) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerInput: <OptionValue>(props: InputProps<SelectPickerOptionType<OptionValue>>) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerValueContainer: <OptionValue, IsMulti extends boolean>({ showSelectedOptionsCount, customSelectedOptionsCount, ...props }: ValueContainerProps<SelectPickerOptionType<OptionValue>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "showSelectedOptionsCount" | "customSelectedOptionsCount">) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerOption: <OptionValue, IsMulti extends boolean>({ disableDescriptionEllipsis, isUserIdentifier, ...props }: OptionProps<SelectPickerOptionType<OptionValue>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "disableDescriptionEllipsis" | "isUserIdentifier">) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerMenuListFooter: ({ menuListFooterConfig, }: Required<Pick<SelectPickerProps, "menuListFooterConfig">>) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerMenuList: <OptionValue>(props: MenuListProps<SelectPickerOptionType<OptionValue>>) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerMultiValue: <OptionValue, IsMulti extends boolean>({ getIsOptionValid, ...props }: MultiValueProps<SelectPickerOptionType<OptionValue>, true> & Pick<SelectPickerProps<OptionValue, IsMulti>["multiSelectProps"], "getIsOptionValid">) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectPickerGroupHeading: <OptionValue>({ isGroupHeadingSelectable, ...props }: SelectPickerGroupHeadingProps<OptionValue>) => import("react/jsx-runtime").JSX.Element;
+export declare const renderLoadingMessage: () => import("react/jsx-runtime").JSX.Element;
+export declare const ValueContainerWithLoadingShimmer: (props: ValueContainerProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,6 @@
+import { CSSProperties } from 'react';
+import { SelectPickerProps } from './type';
+export declare const SELECT_PICKER_FONT_SIZE_MAP: Record<SelectPickerProps['size'], CSSProperties['fontSize']>;
+export declare const SELECT_PICKER_ICON_SIZE_MAP: Record<SelectPickerProps['size'], Pick<CSSProperties, 'width' | 'height'>>;
+export declare const SELECT_PICKER_CONTROL_SIZE_MAP: Record<SelectPickerProps['size'], CSSProperties['minHeight']>;
+export declare const SELECT_PICKER_MULTI_VALUE_LABEL_SIZE_MAP: Record<SelectPickerProps['size'], CSSProperties['lineHeight']>;

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

@@ -1,4 +1,7 @@
-export { default as SelectPicker } from './SelectPicker.component';
+export { ValueContainerWithLoadingShimmer } from './common';
 export { default as FilterSelectPicker } from './FilterSelectPicker';
+export * from './GroupedFilterSelectPicker';
+export { default as SelectPicker } from './SelectPicker.component';
+export * from './SelectPickerTextArea.component';
 export * from './type';
-export { getSelectPickerOptionByValue } from './utils';
+export { getSelectPickerOptionByValue, getSelectPickerOptionsByValue } from './utils';

package/dist/Shared/Components/SelectPicker/type.d.ts

@@ -1,14 +1,20 @@
-import { ServerErrors } from '../../../Common/ServerError';
-import { OptionType } from '../../../Common/Types';
-import { ComponentSizeType } from '../../constants';
 import { MutableRefObject, ReactElement, ReactNode } from 'react';
 import { GroupBase, GroupHeadingProps, Props as ReactSelectProps, SelectInstance } from 'react-select';
 import { CreatableProps } from 'react-select/creatable';
-export interface SelectPickerOptionType<OptionValue = string | number> extends OptionType<OptionValue, ReactNode> {
+import { ResizableTagTextAreaProps } from '../../../Common/CustomTagSelector';
+import { ServerErrors } from '../../../Common/ServerError';
+import { TooltipProps } from '../../../Common/Tooltip';
+import { OptionType } from '../../../Common/Types';
+import { ComponentSizeType } from '../../constants';
+import { ActionMenuProps } from '../ActionMenu';
+import { ButtonComponentType, ButtonProps, ButtonVariantType } from '../Button';
+import { FormFieldWrapperProps } from '../FormFieldWrapper/types';
+import { UsePopoverProps, UsePopoverReturnType } from '../Popover';
+export interface SelectPickerOptionType<OptionValue = string | number, OptionLabel = ReactNode> extends OptionType<OptionValue, OptionLabel> {
     /**
      * Description to be displayed for the option
      */
-    description?: string;
+    description?: ReactNode;
     /**
      * Icon at the start of the option
      */
@@ -17,18 +23,40 @@ export interface SelectPickerOptionType<OptionValue = string | number> extends O
      * Icon at the end of the option
      */
     endIcon?: ReactElement;
+    /**
+     * Props passed to show the tippy on option
+     */
+    tooltipProps?: Omit<TooltipProps, 'alwaysShowTippyOnHover' | 'showOnTruncate' | 'shortcutKeyCombo'> | (Omit<TooltipProps, 'alwaysShowTippyOnHover' | 'showOnTruncate' | 'content'> & Required<Pick<TooltipProps, 'shortcutKeyCombo'>>);
 }
 type SelectProps<OptionValue, IsMulti extends boolean> = ReactSelectProps<SelectPickerOptionType<OptionValue>, IsMulti, GroupBase<SelectPickerOptionType<OptionValue>>>;
+type MenuListFooterConfigType = {
+    type: 'text';
+    /**
+     * String is preferred for text type
+     */
+    value: ReactNode;
+    buttonProps?: never;
+} | {
+    type: 'button';
+    value?: never;
+    buttonProps: {
+        variant: ButtonVariantType.primary | ButtonVariantType.borderLess;
+    } & Omit<ButtonProps<ButtonComponentType>, 'size' | 'fullWidth' | 'icon' | 'endIcon' | 'variant' | 'style'>;
+} | {
+    type: 'customNode';
+    value: ReactElement;
+    buttonProps?: never;
+};
 declare module 'react-select/base' {
     interface Props<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
         /**
-         * Render function for the footer at the bottom of menu list. It is sticky by default
+         * Config for the footer at the bottom of menu list. It is sticky by default
          */
-        renderMenuListFooter?: () => ReactNode;
+        menuListFooterConfig?: MenuListFooterConfigType;
         /**
          * If true, custom options are rendered in the menuList component of react select
          *
-         * Note: renderCustomOptions is required to be passed; renderMenuListFooter is also not called
+         * Note: renderCustomOptions is required to be passed; menuListFooterConfig is also not used
          *
          * @default false
          */
@@ -39,46 +67,69 @@ declare module 'react-select/base' {
          * Imp Note: The menu open/close needs to handled by the consumer in this case
          */
         renderCustomOptions?: () => ReactElement;
+        /**
+         * Icon to be rendered in the control
+         */
+        icon?: ReactElement;
+        /**
+         * Renders the keyboard shortcut key that opens the select picker \
+         * Shortcut key needs to be defined first in order to use it.
+         * @note This is displayed in place of the dropdown indicator
+         */
+        keyboardShortcut?: string;
+        /**
+         * If true, checkboxes are shown for options in multi-select mode.
+         * @default true
+         */
+        showCheckboxForMultiSelect?: boolean;
+        /**
+         * If true, the selected option icon is shown in the container.
+         * startIcon has higher priority than endIcon.
+         *
+         * @default 'true'
+         */
+        showSelectedOptionIcon?: boolean;
+        /**
+         * If provided, the custom display text is shown in the value container
+         *
+         * @default null
+         */
+        customDisplayText?: string;
+        /** Render function for the footer at the end of the options list. */
+        renderOptionsFooter?: () => ReactNode;
+        /**
+         * If true, the select picker will render textarea instead of input.
+         * @default false
+         */
+        shouldRenderTextArea?: boolean;
+        /**
+         * Custom prop for the value container for focussed state
+         */
+        isFocussed?: boolean;
     }
 }
 export declare enum SelectPickerVariantType {
     DEFAULT = "default",
-    BORDER_LESS = "border-less"
+    BORDER_LESS = "border-less",
+    COMPACT = "compact"
 }
-export type SelectPickerProps<OptionValue = number | string, IsMulti extends boolean = false> = Pick<SelectProps<OptionValue, IsMulti>, 'name' | 'classNamePrefix' | 'options' | 'value' | 'onChange' | 'isSearchable' | 'isClearable' | 'hideSelectedOptions' | 'controlShouldRenderValue' | 'closeMenuOnSelect' | 'isDisabled' | 'isLoading' | 'required' | 'isOptionDisabled' | 'placeholder' | 'menuPosition' | 'getOptionLabel' | 'getOptionValue' | 'isOptionSelected' | 'menuIsOpen' | 'onMenuOpen' | 'onMenuClose' | 'autoFocus' | 'onBlur' | 'onKeyDown' | 'onInputChange' | 'inputValue'> & Partial<Pick<SelectProps<OptionValue, IsMulti>, 'renderMenuListFooter' | 'shouldRenderCustomOptions' | 'renderCustomOptions'>> & Required<Pick<SelectProps<OptionValue, IsMulti>, 'inputId'>> & Partial<Pick<CreatableProps<SelectPickerOptionType<OptionValue>, IsMulti, GroupBase<SelectPickerOptionType<OptionValue>>>, 'onCreateOption'>> & {
-    /**
-     * Icon to be rendered in the control
-     */
-    icon?: ReactElement;
-    /**
-     * Error message for the select
-     */
-    error?: ReactNode;
+export type SelectPickerProps<OptionValue = number | string, IsMulti extends boolean = false> = Pick<SelectProps<OptionValue, IsMulti>, 'name' | 'classNamePrefix' | 'options' | 'value' | 'onChange' | 'isSearchable' | 'isClearable' | 'hideSelectedOptions' | 'controlShouldRenderValue' | 'closeMenuOnSelect' | 'isDisabled' | 'isLoading' | 'required' | 'isOptionDisabled' | 'placeholder' | 'menuPosition' | 'getOptionLabel' | 'getOptionValue' | 'isOptionSelected' | 'menuIsOpen' | 'onMenuOpen' | 'onMenuClose' | 'autoFocus' | 'onBlur' | 'onKeyDown' | 'formatOptionLabel' | 'onInputChange' | 'inputValue' | 'filterOption' | 'noOptionsMessage' | 'defaultMenuIsOpen' | 'onFocus'> & Partial<Pick<SelectProps<OptionValue, IsMulti>, 'shouldRenderCustomOptions' | 'renderCustomOptions' | 'icon' | 'showSelectedOptionIcon' | 'renderOptionsFooter' | 'shouldRenderTextArea' | 'keyboardShortcut' | 'showCheckboxForMultiSelect'>> & Required<Pick<SelectProps<OptionValue, IsMulti>, 'inputId'>> & Partial<Pick<CreatableProps<SelectPickerOptionType<OptionValue>, IsMulti, GroupBase<SelectPickerOptionType<OptionValue>>>, 'onCreateOption' | 'formatCreateLabel' | 'menuPortalTarget'>> & Omit<FormFieldWrapperProps, 'children'> & {
     /**
-     * Info text for the select, if any
-     */
-    helperText?: ReactNode;
-    /**
-     * Label for the select. if required is added, the corresponding * is also added
-     */
-    label?: ReactNode;
-    /**
-     * If true, the selected option icon is shown in the container.
-     * startIcon has higher priority than endIcon.
+     * Config for the footer at the bottom of menu list. It is sticky by default
      *
-     * @default 'true'
+     * Note: Re-declaring here since dynamic typing doesn't work with module augmentation
      */
-    showSelectedOptionIcon?: boolean;
+    menuListFooterConfig?: MenuListFooterConfigType;
     /**
      * Custom selected options count for use cases like filters
      */
     customSelectedOptionsCount?: number;
     /**
-     * Height of the dropdown
+     * Size of select
      *
      * @default 'ComponentSizeType.medium'
      */
-    size?: Extract<ComponentSizeType, ComponentSizeType.medium | ComponentSizeType.large>;
+    size?: Extract<ComponentSizeType, ComponentSizeType.medium | ComponentSizeType.large | ComponentSizeType.small | ComponentSizeType.xl>;
     /**
      * Content to be shown in a tippy when disabled
      */
@@ -140,9 +191,24 @@ export type SelectPickerProps<OptionValue = number | string, IsMulti extends boo
      * @default false
      */
     isCreatable?: boolean;
+    /**
+     * If false, the no options message is not shown
+     *
+     * Note: Handling for the menu distortion needs to be handled explicitly in this case
+     *
+     * @default true
+     */
+    shouldShowNoOptionsMessage?: boolean;
+    /**
+     * If true, the menu list and the dropdown indicator are hidden. Suitable for use cases like multi-inputs
+     *
+     * @default false
+     */
+    shouldHideMenu?: boolean;
 } & (IsMulti extends true ? {
     isMulti: IsMulti | boolean;
-    multiSelectProps?: {
+    isUserIdentifier?: boolean;
+    multiSelectProps?: Partial<Pick<SelectProps<OptionValue, IsMulti>, 'customDisplayText'>> & {
         /**
          * If true, the group heading can be selected
          *
@@ -159,12 +225,34 @@ export type SelectPickerProps<OptionValue = number | string, IsMulti extends boo
 } : {
     isMulti?: never;
     multiSelectProps?: never;
+    isUserIdentifier?: never;
 });
 export type SelectPickerGroupHeadingProps<OptionValue> = GroupHeadingProps<SelectPickerOptionType<OptionValue>> & {
     isGroupHeadingSelectable: boolean;
 };
-export interface FilterSelectPickerProps extends Required<Pick<SelectPickerProps<number | string, true>, 'options' | 'isDisabled' | 'placeholder' | 'isLoading'>>, Pick<SelectPickerProps<number | string, true>, 'selectRef' | 'inputId' | 'menuPosition' | 'autoFocus' | 'shouldMenuAlignRight' | 'optionListError' | 'reloadOptionList'> {
+export interface FilterSelectPickerProps extends Required<Pick<SelectPickerProps<number | string, true>, 'options' | 'isDisabled' | 'placeholder' | 'isLoading'>>, Pick<SelectPickerProps<number | string, true>, 'selectRef' | 'inputId' | 'menuPosition' | 'autoFocus' | 'shouldMenuAlignRight' | 'optionListError' | 'reloadOptionList' | 'getOptionValue' | 'isOptionDisabled' | 'onMenuClose' | 'menuIsOpen' | 'onKeyDown' | 'isUserIdentifier'> {
     appliedFilterOptions: SelectPickerOptionType[];
     handleApplyFilter: (filtersToApply: SelectPickerOptionType<number | string>[]) => void;
 }
+export type SelectPickerTextAreaProps = Omit<SelectPickerProps<string, false>, 'selectRef' | 'inputValue' | 'onInputChange' | 'controlShouldRenderValue' | 'onKeyDown' | 'onCreateOption' | 'shouldRenderTextArea'> & Pick<ResizableTagTextAreaProps, 'maxHeight' | 'minHeight' | 'refVar' | 'dependentRefs'>;
+export type FilterSelectPickerMapSelectPickerVariant = {
+    variant?: 'selectPicker';
+} & Omit<FilterSelectPickerProps, 'autoFocus' | 'menuIsOpen' | 'onMenuClose' | 'onKeyDown' | 'selectRef'>;
+type FilterSelectPickerMapPopOverVariant = {
+    variant: 'popover';
+    /**
+     * Component rendered inside the Popover.
+     * Receives `closePopover` as a prop to allow programmatic closing.
+     */
+    component: (closePopover: () => void, scrollableRef: UsePopoverReturnType['scrollableRef']) => ReactElement;
+    /**
+     * Optional positioning config forwarded to usePopover
+     */
+    popoverConfig?: Pick<UsePopoverProps, 'position' | 'alignment' | 'width'>;
+};
+export type GroupedFilterSelectPickerMapValue = FilterSelectPickerMapSelectPickerVariant | FilterSelectPickerMapPopOverVariant;
+export interface GroupedFilterSelectPickerProps<T extends string | number = string | number> extends Omit<ActionMenuProps<T>, 'onClick' | 'disableDescriptionEllipsis' | 'children' | 'buttonProps' | 'isSearchable'> {
+    isFilterApplied?: boolean;
+    filterSelectPickerPropsMap: Record<T, GroupedFilterSelectPickerMapValue>;
+}
 export {};

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

@@ -1,5 +1,5 @@
-import { CHECKBOX_VALUE } from '../../../Common/Types';
 import { GroupBase, MultiValue, OptionsOrGroups, StylesConfig } from 'react-select';
+import { CHECKBOX_VALUE } from '../../../Common/Types';
 import { SelectPickerOptionType, SelectPickerProps } from './type';
 export declare const getCommonSelectStyle: <OptionValue, IsMulti extends boolean>({ error, size, menuSize, variant, getIsOptionValid, isGroupHeadingSelectable, shouldMenuAlignRight, }: Pick<SelectPickerProps<OptionValue, IsMulti>, "error" | "size" | "menuSize" | "variant" | "shouldMenuAlignRight"> & Pick<SelectPickerProps<OptionValue, IsMulti>["multiSelectProps"], "getIsOptionValid" | "isGroupHeadingSelectable">) => StylesConfig<SelectPickerOptionType<OptionValue>>;
 export declare const getGroupCheckboxValue: <OptionValue>(groupHeadingOptions: readonly SelectPickerOptionType<OptionValue>[], selectedOptions: MultiValue<SelectPickerOptionType<OptionValue>>, getOptionValue: (option: SelectPickerOptionType<OptionValue>) => string) => CHECKBOX_VALUE.CHECKED | CHECKBOX_VALUE.INTERMEDIATE;
@@ -9,6 +9,8 @@ export declare const getGroupCheckboxValue: <OptionValue>(groupHeadingOptions: r
  * @param optionsList - The list of options or groups of options.
  * @param value - The value to compare against the options' values.
  * @param defaultOption - The default option to return if no match is found.
+ * @param getOptionValue - Override the default value for the option
  * @returns The matched option or the default option if no match is found.
  */
-export declare const getSelectPickerOptionByValue: <OptionValue>(optionsList: OptionsOrGroups<SelectPickerOptionType<OptionValue>, GroupBase<SelectPickerOptionType<OptionValue>>>, value: OptionValue, defaultOption?: SelectPickerOptionType<OptionValue>) => SelectPickerOptionType<OptionValue>;
+export declare const getSelectPickerOptionByValue: <OptionValue>(optionsList: OptionsOrGroups<SelectPickerOptionType<OptionValue>, GroupBase<SelectPickerOptionType<OptionValue>>>, value: OptionValue, defaultOption?: SelectPickerOptionType<OptionValue>, getOptionValue?: SelectPickerProps<OptionValue>["getOptionValue"]) => SelectPickerOptionType<OptionValue>;
+export declare const getSelectPickerOptionsByValue: <OptionValue>(optionsList: OptionsOrGroups<SelectPickerOptionType<OptionValue>, GroupBase<SelectPickerOptionType<OptionValue>>>, values: OptionValue[]) => SelectPickerOptionType<OptionValue>[];

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

@@ -1,6 +1,8 @@
 interface ShowMoreTextProps {
     text: string;
     textClass?: string;
+    containerClass?: string;
+    hideShowMore?: boolean;
 }
-declare const ShowMoreText: ({ text, textClass }: ShowMoreTextProps) => JSX.Element;
+declare const ShowMoreText: ({ text, textClass, containerClass, hideShowMore }: ShowMoreTextProps) => import("react/jsx-runtime").JSX.Element;
 export default ShowMoreText;

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

@@ -0,0 +1,2 @@
+import { SideNavigationProps } from './types';
+export declare const SideNavigation: ({ list }: SideNavigationProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+export * from './SideNavigation';
+export type { SideNavigationProps } from './types';

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

@@ -0,0 +1,19 @@
+import { TooltipProps } from '../../../Common/Tooltip';
+export type SideNavigationItemBase = {
+    id: string;
+    title: string;
+    dataTestId: string;
+};
+export type SideNavigationItemLink = SideNavigationItemBase & {
+    href: string;
+    items?: never;
+    tooltipProps?: TooltipProps;
+};
+export type SideNavigationItemGroup = SideNavigationItemBase & {
+    items: Omit<SideNavigationItemLink, 'items'>[];
+    href?: never;
+    tooltipProps?: never;
+};
+export interface SideNavigationProps {
+    list: (SideNavigationItemLink | SideNavigationItemGroup)[];
+}

package/dist/Shared/Components/StatusComponent/AppStatus.d.ts

@@ -0,0 +1,2 @@
+import { AppStatusProps } from './types';
+export declare const AppStatus: ({ status, isJobView, isVirtualEnv, hideMessage, ...restProps }: AppStatusProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Shared/Components/StatusComponent/DeploymentStatus.d.ts

@@ -0,0 +1,2 @@
+import { DeploymentStatusProps } from './types';
+export declare const DeploymentStatus: ({ status, ...restProps }: DeploymentStatusProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+import { StatusComponentProps } from './types';
+export declare const StatusComponent: ({ status, hideIcon, hideMessage, iconSize, showAnimatedIcon, hideIconTooltip, message, }: StatusComponentProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,7 @@
+export declare const APP_STATUS: {
+    NOT_AVAILABLE: string;
+    NOT_DEPLOYED: string;
+    NOT_DEPLOYED_NO_SPACE: string;
+    JOB_VIEW_NOT_DEPLOYED_MESSAGE: string;
+    NOT_DEPLOYED_MESSAGE: string;
+};

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

@@ -0,0 +1,5 @@
+export * from './AppStatus';
+export * from './DeploymentStatus';
+export * from './StatusComponent';
+export * from './types';
+export { getDeploymentStatusFromStatus } from './utils';

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

@@ -0,0 +1,49 @@
+import { IconsProps } from '../Icon';
+export declare enum StatusType {
+    QUEUED = "QUEUED",
+    FAILED = "FAILED",
+    ERROR = "ERROR",
+    CANCELLED = "CANCELLED",
+    ABORTED = "ABORTED",
+    HEALTHY = "HEALTHY",
+    SUCCEEDED = "SUCCEEDED",
+    DRIFTED = "DRIFTED",
+    MISSING = "MISSING",
+    UNKNOWN = "UNKNOWN",
+    NOT_DEPLOYED = "NOT-DEPLOYED",
+    SUSPENDED = "SUSPENDED",
+    DEGRADED = "DEGRADED",
+    PROGRESSING = "PROGRESSING",
+    INPROGRESS = "INPROGRESS",
+    HIBERNATING = "HIBERNATING",
+    TIMED_OUT = "TIMED_OUT",
+    DELETING = "DELETING"
+}
+export interface StatusComponentProps {
+    /** The status to display, either a predefined StatusType or a custom string. */
+    status: StatusType | string;
+    /** A custom message to display instead of the status. If not provided, the status is shown. */
+    message?: string;
+    /** If true, hides the status icon. */
+    hideIcon?: boolean;
+    /**
+     * If true, hides the status message and displays it in a tooltip instead.
+     * @default false
+     */
+    hideMessage?: boolean;
+    /** Size of the status icon. */
+    iconSize?: IconsProps['size'];
+    /** If true, displays an animated version of the icon (if available). */
+    showAnimatedIcon?: boolean;
+    /**
+     * If true, hides the tooltip on the status icon.
+     * @note Tooltip is only shown when `hideMessage` is true.
+     */
+    hideIconTooltip?: boolean;
+}
+export interface AppStatusProps extends Omit<StatusComponentProps, 'statusMessage'> {
+    isJobView?: boolean;
+    isVirtualEnv?: boolean;
+}
+export interface DeploymentStatusProps extends Omit<AppStatusProps, 'isJobView'> {
+}

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

@@ -0,0 +1,5 @@
+import { IconName, IconsProps } from '../Icon';
+export declare const getIconName: (status: string, showAnimatedIcon: boolean) => IconName;
+export declare const getIconColor: (status: string) => IconsProps["color"];
+export declare const getDeploymentStatusFromStatus: (status: string) => string;
+export declare const getJobStatusFromStatus: (status: string) => string;

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

@@ -0,0 +1,3 @@
+import { DTSwitchProps } from './types';
+declare const Switch: ({ ariaLabel, isDisabled, isLoading, isChecked, tooltipContent, shape, variant, iconColor, iconName, indeterminate, size, name, dataTestId, onChange, autoFocus, }: DTSwitchProps) => import("react/jsx-runtime").JSX.Element;
+export default Switch;

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

@@ -0,0 +1,14 @@
+import { IconBaseColorType } from '../../types';
+import { DTSwitchProps } from './types';
+export declare const ROUNDED_SWITCH_SIZE_MAP: Readonly<Record<DTSwitchProps['size'], string>>;
+export declare const SQUARE_SWITCH_SIZE_MAP: typeof ROUNDED_SWITCH_SIZE_MAP;
+export declare const SWITCH_HEIGHT_MAP: Readonly<Record<DTSwitchProps['size'], string>>;
+export declare const LOADING_COLOR_MAP: Record<DTSwitchProps['variant'], IconBaseColorType>;
+export declare const ROUNDED_SWITCH_TRACK_COLOR_MAP: Record<DTSwitchProps['variant'], string>;
+export declare const ROUNDED_SWITCH_TRACK_HOVER_COLOR_MAP: Record<DTSwitchProps['variant'], `var(--${IconBaseColorType})`>;
+export declare const SQUARE_SWITCH_TRACK_COLOR_MAP: typeof ROUNDED_SWITCH_TRACK_COLOR_MAP;
+export declare const SQUARE_SWITCH_TRACK_HOVER_COLOR_MAP: typeof ROUNDED_SWITCH_TRACK_HOVER_COLOR_MAP;
+export declare const ROUNDED_SWITCH_THUMB_SIZE_MAP: Record<DTSwitchProps['size'], string>;
+export declare const INDETERMINATE_ICON_WIDTH_MAP: Record<DTSwitchProps['size'], string>;
+export declare const SWITCH_THUMB_PADDING_MAP: Record<DTSwitchProps['size'], string>;
+export declare const THUMB_OUTER_PADDING_MAP: Record<DTSwitchProps['shape'], string>;

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

@@ -0,0 +1,2 @@
+export { default as DTSwitch } from './Switch.component';
+export type { DTSwitchProps } from './types';

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

@@ -0,0 +1,111 @@
+import { ButtonHTMLAttributes, ReactNode } from 'react';
+import { ComponentSizeType } from '../../constants';
+import { IconBaseColorType } from '../../types';
+import { IconName } from '../Icon';
+/**
+ * Represents the properties for configuring the shape and behavior of a switch component.
+ *
+ * - When `shape` is `rounded`:
+ *   - The switch will have a rounded appearance.
+ *   - `iconName`, `iconColor`, and `indeterminate` are not applicable.
+ *
+ * - When `shape` is `square`:
+ *   - The switch will have a square appearance.
+ *   - `iconName` specifies the name of the icon to display.
+ *   - `iconColor` allows customization of the icon's color in the active state.
+ *   - `indeterminate` indicates whether the switch is in an indeterminate state, typically used for checkboxes to represent a mixed state.
+ *     If `indeterminate` is true, the switch will not be fully checked or unchecked.
+ */
+type SwitchShapeProps = {
+    /**
+     * The shape of the switch. Defaults to `rounded` if not specified.
+     */
+    shape?: 'rounded';
+    /**
+     * Icon name is not applicable for the `rounded` shape.
+     */
+    iconName?: never;
+    /**
+     * Icon color is not applicable for the `rounded` shape.
+     */
+    iconColor?: never;
+    /**
+     * Indicates whether the switch is in an indeterminate state.
+     * This state is typically used for checkboxes to indicate a mixed state.
+     * If true, the switch will not be fully checked or unchecked. Due this state alone we are keeping role as `checkbox` instead of `switch`.
+     * This property is not applicable for the `square` shape.
+     * @default false
+     */
+    indeterminate?: boolean;
+} | {
+    /**
+     * The shape of the switch. Must be `square` to enable icon-related properties.
+     */
+    shape: 'square';
+    /**
+     * The name of the icon to display when the shape is `square`.
+     */
+    iconName: IconName;
+    /**
+     * The color of the icon. If provided, this will override the default color in the active state.
+     */
+    iconColor?: IconBaseColorType;
+    indeterminate?: never;
+};
+/**
+ * Represents the properties for the `Switch` component.
+ */
+export type DTSwitchProps = {
+    /**
+     * The ARIA label for the switch, used for accessibility purposes.
+     */
+    ariaLabel: string;
+    /**
+     * Used in forms to identify the switch.
+     */
+    name: string;
+    /**
+     * Provide if name generated through `getUniqueId`.
+     */
+    dataTestId?: string;
+    /**
+     * The visual variant of the switch.
+     *
+     * @default `positive`
+     */
+    variant?: 'theme' | 'positive';
+    /**
+     * The size of the switch.
+     * @default `ComponentSizeType.medium`
+     */
+    size?: Extract<ComponentSizeType, ComponentSizeType.medium | ComponentSizeType.small>;
+    /**
+     * Callback function that is called when the switch state changes.
+     * This function should handle the logic for toggling the switch.
+     */
+    onChange: ButtonHTMLAttributes<HTMLButtonElement>['onClick'];
+    /**
+     * Indicates whether the switch is disabled.
+     */
+    isDisabled?: boolean;
+    /**
+     * Indicates whether the switch is in a loading state.
+     */
+    isLoading?: boolean;
+    /**
+     * Indicates whether the switch is currently checked (on).
+     */
+    isChecked: boolean;
+    /**
+     * Optional tooltip content to display when hovering over the switch.
+     *
+     * @default undefined
+     */
+    tooltipContent?: ReactNode;
+    /**
+     * Indicates whether the switch should be focused automatically when rendered.
+     * @default false
+     */
+    autoFocus?: boolean;
+} & SwitchShapeProps;
+export {};