@devtron-labs/devtron-fe-common-lib 0.2.7 → 0.2.9-beta-1

package/dist/Pages/CDPipeline/index.d.ts

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

package/dist/Pages/CDPipeline/types.d.ts

@@ -0,0 +1,84 @@
+import { BuildStageType, FormType } from '../../Common/CIPipeline.Types';
+import { DeploymentAppTypes } from '../../Common/Types';
+import { DeploymentStrategy } from '../../Shared/Components';
+import { EnvListMinDTO } from '../../Shared/types';
+
+interface ConfigSecretType {
+    label: string;
+    value: string;
+    type: string;
+}
+export interface Environment extends Pick<EnvListMinDTO, 'id' | 'active' | 'namespace' | 'isClusterCdActive'>, Partial<Pick<EnvListMinDTO, 'isVirtualEnvironment' | 'allowedDeploymentTypes' | 'description' | 'isDigestEnforcedForEnv'>> {
+    name: string;
+    clusterName: string;
+    clusterId: string;
+}
+export interface PipelineBuildStageType extends BuildStageType {
+    triggerType?: string;
+}
+export interface SavedDeploymentStrategy extends DeploymentStrategy {
+    isCollapsed?: boolean;
+    defaultConfig?: any;
+    yamlStr?: any;
+    jsonStr?: any;
+}
+export interface CustomTagType {
+    tagPattern: string;
+    counterX: string;
+}
+export declare enum ReleaseMode {
+    NEW_DEPLOYMENT = "create",
+    MIGRATE_HELM = "link"
+}
+export interface CDFormType {
+    name: string;
+    ciPipelineId: number;
+    environmentId: number;
+    environmentName: string;
+    namespace: string;
+    environments: Environment[];
+    deploymentAppType: string;
+    deploymentAppName?: string;
+    releaseMode: ReleaseMode;
+    triggerType: string;
+    preBuildStage?: PipelineBuildStageType;
+    postBuildStage?: PipelineBuildStageType;
+    strategies: DeploymentStrategy[];
+    savedStrategies: SavedDeploymentStrategy[];
+    preStageConfigMapSecretNames: {
+        configMaps: ConfigSecretType[];
+        secrets: ConfigSecretType[];
+    };
+    postStageConfigMapSecretNames: {
+        configMaps: ConfigSecretType[];
+        secrets: ConfigSecretType[];
+    };
+    requiredApprovals: string;
+    userApprovalConfig?: {
+        requiredCount: number;
+    };
+    isClusterCdActive: boolean;
+    deploymentAppCreated: boolean;
+    clusterId: string;
+    clusterName: string;
+    runPreStageInEnv: boolean;
+    runPostStageInEnv: boolean;
+    allowedDeploymentTypes: DeploymentAppTypes[];
+    containerRegistryName: string;
+    repoName: string;
+    selectedRegistry: any;
+    generatedHelmPushAction: string;
+}
+export interface PipelineFormType extends Partial<FormType>, Partial<CDFormType> {
+    name: string;
+    triggerType: string;
+    preBuildStage?: PipelineBuildStageType;
+    postBuildStage?: PipelineBuildStageType;
+    defaultTag?: string[];
+    customTag?: CustomTagType;
+    enableCustomTag?: boolean;
+    customTagStage?: string;
+    isDigestEnforcedForPipeline?: boolean;
+    isDigestEnforcedForEnv?: boolean;
+}
+export {};

package/dist/Pages/index.d.ts

@@ -1,2 +1,3 @@
 export * from './GlobalConfigurations';
 export * from './ResourceBrowser';
+export * from './CDPipeline';

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

@@ -524,7 +524,7 @@ export interface DeploymentHistory {
     runSource?: RunSourceType;
 }
 type DeploymentStrategyType = 'CANARY' | 'ROLLING' | 'RECREATE' | 'BLUE_GREEN';
-interface DeploymentStrategy {
+export interface DeploymentStrategy {
     deploymentTemplate: DeploymentStrategyType;
     config: any;
     default: boolean;

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

@@ -0,0 +1,4 @@
+import { FilterSelectPickerProps } from './type';
+
+declare const FilterSelectPicker: ({ appliedFilterOptions, handleApplyFilter, options, ...props }: FilterSelectPickerProps) => JSX.Element;
+export default FilterSelectPicker;

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

@@ -80,6 +80,60 @@ import { SelectPickerProps } from './type';
  * ```tsx
  * <SelectPicker ... showSelectedOptionsCount />
  * ```
+ * @example Multi Select
+ * ```tsx
+ * <SelectPicker ... isMulti />
+ * ```
+ *
+ * @example Creatable Multi Select
+ * ```tsx
+ * <SelectPicker
+ *      ...
+ *      isMulti
+ *      multiSelectProps={{
+ *          isCreatable: true
+ *      }}
+ * />
+ * ```
+ *
+ * @example Multi Select with group heading selectable
+ * ```tsx
+ * <SelectPicker
+ *      ...
+ *      isMulti
+ *      multiSelectProps={{
+ *          isGroupHeadingSelectable: true
+ *      }}
+ * />
+ * ```
+ *
+ * @example Multi Select with selected option validator
+ * ```tsx
+ * <SelectPicker
+ *      ...
+ *      isMulti
+ *      multiSelectProps={{
+ *          getIsOptionValid: (option) => boolean
+ *      }}
+ * />
+ * ```
+ *
+ * @example Custom options rendering support (menuIsOpen needs to be handled by consumer)
+ * ```tsx
+ * <SelectPicker
+ *      ...
+ *      shouldRenderCustomOptions
+ *      renderCustomOptions={() => <div />}
+ * />
+ * ```
+ *
+ * @example Align the menu at the right most end
+ * ```tsx
+ * <SelectPicker
+ *      ...
+ *      shouldMenuAlignRight
+ * />
+ * ```
  */
-declare const SelectPicker: ({ error, icon, renderMenuListFooter, helperText, placeholder, label, showSelectedOptionIcon, size, disabledTippyContent, showSelectedOptionsCount, menuSize, variant, ...props }: SelectPickerProps) => JSX.Element;
+declare const SelectPicker: <OptionValue, IsMulti extends boolean>({ error, icon, renderMenuListFooter, helperText, placeholder, label, showSelectedOptionIcon, size, disabledTippyContent, showSelectedOptionsCount, menuSize, menuPosition, variant, disableDescriptionEllipsis, multiSelectProps, isMulti, name, classNamePrefix, renderCustomOptions, shouldRenderCustomOptions, isSearchable, selectRef, shouldMenuAlignRight, fullWidth, customSelectedOptionsCount, ...props }: SelectPickerProps<OptionValue, IsMulti>) => JSX.Element;
 export default SelectPicker;

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

@@ -1,10 +1,13 @@
-import { DropdownIndicatorProps, ControlProps, OptionProps, ClearIndicatorProps, ValueContainerProps, MenuListProps } from 'react-select';
-import { SelectPickerOptionType, SelectPickerProps } from './type';
+import { DropdownIndicatorProps, ControlProps, OptionProps, ClearIndicatorProps, ValueContainerProps, MenuListProps, MultiValueRemoveProps, MultiValueProps } from 'react-select';
+import { SelectPickerGroupHeadingProps, SelectPickerOptionType, SelectPickerProps } from './type';
 
-export declare const SelectPickerDropdownIndicator: (props: DropdownIndicatorProps<SelectPickerOptionType>) => JSX.Element;
-export declare const SelectPickerClearIndicator: (props: ClearIndicatorProps<SelectPickerOptionType>) => JSX.Element;
-export declare const SelectPickerControl: ({ icon, showSelectedOptionIcon, ...props }: ControlProps<SelectPickerOptionType> & Pick<SelectPickerProps, 'icon' | 'showSelectedOptionIcon'>) => JSX.Element;
-export declare const SelectPickerValueContainer: ({ showSelectedOptionsCount, ...props }: ValueContainerProps<SelectPickerOptionType> & Pick<SelectPickerProps, 'showSelectedOptionsCount'>) => JSX.Element;
+export declare const SelectPickerDropdownIndicator: <OptionValue>(props: DropdownIndicatorProps<SelectPickerOptionType<OptionValue>, boolean, import('react-select').GroupBase<SelectPickerOptionType<OptionValue>>>) => JSX.Element;
+export declare const SelectPickerClearIndicator: <OptionValue>(props: ClearIndicatorProps<SelectPickerOptionType<OptionValue>, boolean, import('react-select').GroupBase<SelectPickerOptionType<OptionValue>>>) => JSX.Element;
+export declare const SelectPickerControl: <OptionValue, IsMulti extends boolean>({ icon, showSelectedOptionIcon, ...props }: ControlProps<SelectPickerOptionType<OptionValue>, boolean, import('react-select').GroupBase<SelectPickerOptionType<OptionValue>>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "icon" | "showSelectedOptionIcon">) => JSX.Element;
+export declare const SelectPickerValueContainer: <OptionValue, IsMulti extends boolean>({ showSelectedOptionsCount, customSelectedOptionsCount, ...props }: ValueContainerProps<SelectPickerOptionType<OptionValue>, boolean, import('react-select').GroupBase<SelectPickerOptionType<OptionValue>>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "customSelectedOptionsCount" | "showSelectedOptionsCount">) => JSX.Element;
 export declare const SelectPickerLoadingIndicator: () => JSX.Element;
-export declare const SelectPickerOption: ({ disableDescriptionEllipsis }: SelectPickerProps) => (props: OptionProps<SelectPickerOptionType>) => JSX.Element;
-export declare const SelectPickerMenuList: ({ renderMenuListFooter, ...props }: MenuListProps<SelectPickerOptionType> & Pick<SelectPickerProps, 'renderMenuListFooter'>) => JSX.Element;
+export declare const SelectPickerOption: <OptionValue, IsMulti extends boolean>({ disableDescriptionEllipsis, ...props }: OptionProps<SelectPickerOptionType<OptionValue>, boolean, import('react-select').GroupBase<SelectPickerOptionType<OptionValue>>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "disableDescriptionEllipsis">) => JSX.Element;
+export declare const SelectPickerMenuList: <OptionValue, IsMulti extends boolean>({ renderMenuListFooter, shouldRenderCustomOptions, renderCustomOptions, ...props }: MenuListProps<SelectPickerOptionType<OptionValue>, boolean, import('react-select').GroupBase<SelectPickerOptionType<OptionValue>>> & Pick<SelectPickerProps<OptionValue, IsMulti>, "renderMenuListFooter" | "shouldRenderCustomOptions" | "renderCustomOptions">) => JSX.Element;
+export declare const SelectPickerMultiValueLabel: <OptionValue, IsMulti extends boolean>({ getIsOptionValid, ...props }: MultiValueProps<SelectPickerOptionType<OptionValue>, true, import('react-select').GroupBase<SelectPickerOptionType<OptionValue>>> & 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;

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

@@ -1,3 +1,4 @@
 export { default as SelectPicker } from './SelectPicker.component';
+export { default as FilterSelectPicker } from './FilterSelectPicker';
 export * from './type';
 export { getSelectPickerOptionByValue } from './utils';

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

@@ -1,9 +1,10 @@
 import { OptionType } from '../../../Common/Types';
 import { ComponentSizeType } from '../../constants';
-import { ReactElement, ReactNode } from 'react';
-import { Props as ReactSelectProps } from 'react-select';
+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 extends OptionType<number | string, ReactNode> {
+export interface SelectPickerOptionType<OptionValue = string | number> extends OptionType<OptionValue, ReactNode> {
     /**
      * Description to be displayed for the option
      */
@@ -19,10 +20,10 @@ export interface SelectPickerOptionType extends OptionType<number | string, Reac
 }
 export declare enum SelectPickerVariantType {
     DEFAULT = "default",
-    BORDERLESS = "borderless"
+    BORDER_LESS = "border-less"
 }
-type SelectProps = ReactSelectProps<SelectPickerOptionType>;
-export interface SelectPickerProps extends Pick<SelectProps, 'options' | 'value' | 'onChange' | 'isSearchable' | 'isClearable' | 'isLoading' | 'hideSelectedOptions' | 'controlShouldRenderValue' | 'closeMenuOnSelect' | 'isDisabled' | 'isLoading' | 'required' | 'isOptionDisabled' | 'placeholder'>, Required<Pick<SelectProps, 'classNamePrefix' | 'inputId' | 'name'>> {
+type SelectProps<OptionValue, IsMulti extends boolean> = ReactSelectProps<SelectPickerOptionType<OptionValue>, IsMulti, GroupBase<SelectPickerOptionType<OptionValue>>>;
+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'> & Required<Pick<SelectProps<OptionValue, IsMulti>, 'inputId'>> & {
     /**
      * Icon to be rendered in the control
      */
@@ -34,7 +35,7 @@ export interface SelectPickerProps extends Pick<SelectProps, 'options' | 'value'
     /**
      * Render function for the footer at the bottom of menu list. It is sticky by default
      */
-    renderMenuListFooter?: () => ReactNode;
+    renderMenuListFooter?: (selectedOptions: SelectProps<OptionValue, IsMulti>['value']) => ReactNode;
     /**
      * Info text for the select, if any
      */
@@ -50,6 +51,10 @@ export interface SelectPickerProps extends Pick<SelectProps, 'options' | 'value'
      * @default 'true'
      */
     showSelectedOptionIcon?: boolean;
+    /**
+     * Custom selected options count for use cases like filters
+     */
+    customSelectedOptionsCount?: number;
     /**
      * Height of the dropdown
      *
@@ -86,5 +91,73 @@ export interface SelectPickerProps extends Pick<SelectProps, 'options' | 'value'
      * @default false
      */
     disableDescriptionEllipsis?: boolean;
+    /**
+     * Ref for the select picker
+     */
+    selectRef?: IsMulti extends true ? MutableRefObject<SelectInstance<SelectPickerOptionType<OptionValue>, true>> : MutableRefObject<SelectInstance<SelectPickerOptionType<OptionValue>>>;
+    /**
+     * If true, the menu is aligned at the right end to prevent going outside of viewport
+     * in case of menu being larger than the control
+     *
+     * @default false
+     */
+    shouldMenuAlignRight?: boolean;
+    /**
+     * If true, the select spans to the max available width
+     *
+     * @default false
+     */
+    fullWidth?: boolean;
+} & (IsMulti extends true ? {
+    isMulti: IsMulti | boolean;
+    multiSelectProps?: Pick<CreatableProps<SelectPickerOptionType<OptionValue>, true, GroupBase<SelectPickerOptionType<OptionValue>>>, 'onCreateOption'> & {
+        /**
+         * If true, the select picker creates the new option
+         * Only applicable for IsMulti: true
+         *
+         * @default false
+         */
+        isCreatable?: boolean;
+        /**
+         * If true, the group heading can be selected
+         *
+         * Only applicable for IsMulti: true
+         *
+         * @default false
+         */
+        isGroupHeadingSelectable?: boolean;
+        /**
+         * Callback handler to check if the given selection is valid or not
+         */
+        getIsOptionValid?: (option: SelectPickerOptionType<OptionValue>) => boolean;
+    };
+} : {
+    isMulti?: never;
+    multiSelectProps?: never;
+}) & ({
+    /**
+     * 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
+     *
+     * @default false
+     */
+    shouldRenderCustomOptions: boolean;
+    /**
+     * Callback handler for custom options
+     *
+     * Imp Note: The menu open/close needs to handled by the consumer in this case
+     */
+    renderCustomOptions: () => ReactElement;
+} | {
+    shouldRenderCustomOptions?: never;
+    renderCustomOptions?: 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'> {
+    appliedFilterOptions: SelectPickerProps<number | string, true>['options'];
+    handleApplyFilter: (filtersToApply: SelectPickerOptionType<number | string>[]) => void;
 }
 export {};

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

@@ -1,7 +1,9 @@
-import { GroupBase, OptionsOrGroups, StylesConfig } from 'react-select';
+import { CHECKBOX_VALUE } from '../../../Common/Types';
+import { GroupBase, MultiValue, OptionsOrGroups, StylesConfig } from 'react-select';
 import { SelectPickerOptionType, SelectPickerProps } from './type';
 
-export declare const getCommonSelectStyle: ({ error, size, menuSize, variant, }: Pick<SelectPickerProps, 'error' | 'size' | 'menuSize' | 'variant'>) => StylesConfig<SelectPickerOptionType>;
+export declare const getCommonSelectStyle: <OptionValue, IsMulti extends boolean>({ error, size, menuSize, variant, getIsOptionValid, isGroupHeadingSelectable, shouldMenuAlignRight, }: Pick<SelectPickerProps<OptionValue, IsMulti>, "error" | "size" | "shouldMenuAlignRight" | "menuSize" | "variant"> & Pick<SelectPickerProps<OptionValue, IsMulti>["multiSelectProps"], "getIsOptionValid" | "isGroupHeadingSelectable">) => StylesConfig<SelectPickerOptionType<OptionValue>, boolean, GroupBase<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;
 /**
  * Retrieves an option from the options list based on the provided value.
  *
@@ -10,4 +12,4 @@ export declare const getCommonSelectStyle: ({ error, size, menuSize, variant, }:
  * @param defaultOption - The default option to return if no match is found.
  * @returns The matched option or the default option if no match is found.
  */
-export declare const getSelectPickerOptionByValue: (optionsList: OptionsOrGroups<SelectPickerOptionType, GroupBase<SelectPickerOptionType>>, value: string | number, defaultOption?: SelectPickerOptionType) => SelectPickerOptionType;
+export declare const getSelectPickerOptionByValue: <OptionValue>(optionsList: OptionsOrGroups<SelectPickerOptionType<OptionValue>, GroupBase<SelectPickerOptionType<OptionValue>>>, value: OptionValue, defaultOption?: SelectPickerOptionType<OptionValue>) => SelectPickerOptionType<OptionValue>;

package/dist/{cssMode-48c0f680.js → cssMode-d22ec408.js}

@@ -1,7 +1,7 @@
 var Le = Object.defineProperty;
 var je = (e, n, i) => n in e ? Le(e, n, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[n] = i;
 var k = (e, n, i) => (je(e, typeof n != "symbol" ? n + "" : n, i), i);
-import { m as Ne } from "./index-55f67c02.js";
+import { m as Ne } from "./index-3202fe84.js";
 /*!-----------------------------------------------------------------------------
  * Copyright (c) Microsoft Corporation. All rights reserved.
  * Version: 0.44.0(3e047efd345ff102c8c61b5398fb30845aaac166)

package/dist/{freemarker2-abeb240d.js → freemarker2-c97960de.js}

@@ -1,4 +1,4 @@
-import { m as F } from "./index-55f67c02.js";
+import { m as F } from "./index-3202fe84.js";
 /*!-----------------------------------------------------------------------------
  * Copyright (c) Microsoft Corporation. All rights reserved.
  * Version: 0.44.0(3e047efd345ff102c8c61b5398fb30845aaac166)

package/dist/{handlebars-a1d03281.js → handlebars-28d34f7b.js}

@@ -1,4 +1,4 @@
-import { m as i } from "./index-55f67c02.js";
+import { m as i } from "./index-3202fe84.js";
 /*!-----------------------------------------------------------------------------
  * Copyright (c) Microsoft Corporation. All rights reserved.
  * Version: 0.44.0(3e047efd345ff102c8c61b5398fb30845aaac166)

package/dist/{html-b2ac7b3c.js → html-2e81eafd.js}

@@ -1,4 +1,4 @@
-import { m as d } from "./index-55f67c02.js";
+import { m as d } from "./index-3202fe84.js";
 /*!-----------------------------------------------------------------------------
  * Copyright (c) Microsoft Corporation. All rights reserved.
  * Version: 0.44.0(3e047efd345ff102c8c61b5398fb30845aaac166)

package/dist/{htmlMode-9921d4db.js → htmlMode-5bb893d3.js}

@@ -1,7 +1,7 @@
 var $e = Object.defineProperty;
 var qe = (e, n, i) => n in e ? $e(e, n, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[n] = i;
 var k = (e, n, i) => (qe(e, typeof n != "symbol" ? n + "" : n, i), i);
-import { m as Qe } from "./index-55f67c02.js";
+import { m as Qe } from "./index-3202fe84.js";
 /*!-----------------------------------------------------------------------------
  * Copyright (c) Microsoft Corporation. All rights reserved.
  * Version: 0.44.0(3e047efd345ff102c8c61b5398fb30845aaac166)