@devtron-labs/devtron-fe-common-lib 1.4.8 → 1.4.9-beta-1

package/dist/{@common-rjsf-RJZ7deME.js → @common-rjsf-BUHwKStw.js}

@@ -2,9 +2,9 @@ import { j as n, J as A } from "./@vendor-CwAQS8iU.js";
 import E, { forwardRef as $ } from "react";
 import L, { getDefaultRegistry as k } from "@rjsf/core";
 import D from "@rjsf/validator-ajv8";
-import { T as y, c as H, a as U, i as J, d as w } from "./@code-editor-Ch3gMDzD.js";
+import { T as y, c as H, a as U, i as J, d as w } from "./@code-editor-DYmu_kOK.js";
 import M, { components as O } from "react-select";
-import { getUiOptions as B, getTemplate as I, getSubmitButtonOptions as W, ADDITIONAL_PROPERTY_FLAG as P, errorId as V, englishStringTranslator as q, TranslatableString as K, titleId as Y, canExpand as z, deepEquals as G } from "@rjsf/utils";
+import { getUiOptions as B, getTemplate as I, getSubmitButtonOptions as V, ADDITIONAL_PROPERTY_FLAG as P, errorId as W, englishStringTranslator as q, TranslatableString as K, titleId as Y, canExpand as z, deepEquals as G } from "@rjsf/utils";
 import { ReactComponent as Q } from "./assets/ic-chevron-down.fc70d7a7.svg";
 import { ReactComponent as X } from "./assets/ic-add.cfaa779b.svg";
 import { ReactComponent as Z } from "./assets/ic-cross.01e03666.svg";
@@ -155,7 +155,7 @@ import './assets/@common-rjsf.css';const N = {
     }
   ) });
 }, ae = ({ icon: t, iconType: e, registry: s, uiSchema: o, ...r }) => /* @__PURE__ */ n.jsx("button", { ...r, type: "button", className: "dc__outline-none-imp p-0 dc__transparent flex cursor", title: "Remove", children: /* @__PURE__ */ n.jsx(Z, { className: "icon-dim-16 fcn-6" }) }), ie = ({ uiSchema: t }) => {
-  const { submitText: e, norender: s, props: o = {} } = W(t);
+  const { submitText: e, norender: s, props: o = {} } = V(t);
   return s ? null : /* @__PURE__ */ n.jsx("div", { className: "flexbox flex-justify-end", children: /* @__PURE__ */ n.jsx("button", { type: "submit", ...o, className: `cta ${o.className || ""}`, children: e }) });
 }, T = ({
   id: t,
@@ -214,7 +214,7 @@ import './assets/@common-rjsf.css';const N = {
     ] })
   );
 }, ce = ({ errors: t = [], idSchema: e }) => {
-  const s = V(e);
+  const s = W(e);
   return t.length > 0 && /* @__PURE__ */ n.jsx("span", { className: "display-grid rjsf-form-template__field--error dc__gap-12", id: s, children: t.filter((o) => !!o).map((o, r) => /* @__PURE__ */ n.jsxs(E.Fragment, { children: [
     /* @__PURE__ */ n.jsx("span", {}),
     /* @__PURE__ */ n.jsxs("span", { className: "form__error", children: [
@@ -240,14 +240,14 @@ import './assets/@common-rjsf.css';const N = {
     ...e,
     minHeight: "32px",
     boxShadow: "none",
-    backgroundColor: "var(--N50)",
+    backgroundColor: "var(--bg-secondary)",
     border: s.isFocused ? "1px solid var(--B500)" : "1px solid var(--N200)",
     cursor: "pointer"
   }),
   option: (e, s) => ({
     ...e,
     color: "var(--N900)",
-    backgroundColor: s.isFocused ? "var(--N100)" : "white",
+    backgroundColor: s.isFocused ? "var(--N100)" : "var(--bg-primary)",
     padding: "10px 12px",
     cursor: "pointer"
   }),
@@ -276,12 +276,24 @@ import './assets/@common-rjsf.css';const N = {
     ...e,
     border: "1px solid var(--N200)",
     borderRadius: "4px",
-    background: "white",
+    background: "var(--bg-primary)",
     height: "28px",
     marginRight: "8px",
     padding: "2px",
     fontSize: "12px"
   }),
+  singleValue: (e) => ({
+    ...e,
+    color: "var(--N900)"
+  }),
+  input: (e) => ({
+    ...e,
+    color: "var(--N900)"
+  }),
+  menu: (e) => ({
+    ...e,
+    backgroundColor: "var(--bg-menu)"
+  }),
   ...t
 }), Le = (t) => {
   try {
@@ -316,7 +328,7 @@ import './assets/@common-rjsf.css';const N = {
     return "";
   const e = t.trim();
   return e.match(/^\w+(\/\w+)*$/g) ? `/${e}` : e.match(/^\w+(\.\w+)*$/g) ? `/${e.replaceAll(/\./g, "/")}` : e;
-}, F = {
+}, C = {
   value: !1,
   path: ""
 }, me = (t) => {
@@ -326,13 +338,13 @@ import './assets/@common-rjsf.css';const N = {
   return typeof e == "string" ? {
     value: !0,
     path: v(e)
-  } : typeof e != "object" ? structuredClone(F) : Object.hasOwn(e, "condition") && "condition" in e && Object.hasOwn(e, "value") && "value" in e ? {
+  } : typeof e != "object" ? structuredClone(C) : Object.hasOwn(e, "condition") && "condition" in e && Object.hasOwn(e, "value") && "value" in e ? {
     value: e.condition,
     path: v(e.value)
   } : Object.hasOwn(e, "value") && "value" in e && Object.hasOwn(e, "path") && "path" in e ? {
     value: e.value,
     path: v(e.path)
-  } : structuredClone(F);
+  } : structuredClone(C);
 }, ue = ({
   disabled: t,
   formData: e,
@@ -485,7 +497,7 @@ import './assets/@common-rjsf.css';const N = {
     ),
     /* @__PURE__ */ n.jsx("span", { className: "dc__capitalize ml-8", children: f.toString() })
   ] });
-}, C = pe(), ge = ({ children: t, ...e }) => /* @__PURE__ */ n.jsx(O.MenuList, { ...e, children: Array.isArray(t) ? t.slice(0, 20) : t }), je = (t) => /* @__PURE__ */ n.jsx(O.DropdownIndicator, { ...t, children: /* @__PURE__ */ n.jsx(Q, { className: "icon-dim-20 icon-n5", "data-testid": "overview-project-edit-dropdown" }) }), _e = (t) => {
+}, F = pe(), ge = ({ children: t, ...e }) => /* @__PURE__ */ n.jsx(O.MenuList, { ...e, children: Array.isArray(t) ? t.slice(0, 20) : t }), je = (t) => /* @__PURE__ */ n.jsx(O.DropdownIndicator, { ...t, children: /* @__PURE__ */ n.jsx(Q, { className: "icon-dim-20 icon-n5", "data-testid": "overview-project-edit-dropdown" }) }), _e = (t) => {
   const {
     id: e,
     multiple: s = !1,
@@ -516,11 +528,11 @@ import './assets/@common-rjsf.css';const N = {
       placeholder: p || N.SELECT,
       isDisabled: a || i,
       styles: {
-        ...C,
+        ...F,
         control: (g) => ({
           ...g,
-          ...C.control,
-          backgroundColor: "var(--N50)"
+          ...F.control,
+          backgroundColor: "var(--bg-secondary)"
         })
       },
       components: {

package/dist/Common/CodeEditor/CodeEditor.reducer.d.ts

@@ -1,16 +1,16 @@
 import { MODES } from '../Constants';
-import { Action, CodeEditorInitialValueType, CodeEditorState, CodeEditorThemesKeys } from './types';
+import { Action, CodeEditorInitialValueType, CodeEditorState } from './types';
 export declare const CodeEditorReducer: (state: CodeEditorState, action: Action) => {
     mode: any;
     diffMode: boolean;
-    theme: CodeEditorThemesKeys;
+    theme: import('./types').CodeEditorThemesKeys;
     code: string;
     defaultCode: string;
     noParsing: boolean;
 } | {
     diffMode: any;
     mode: MODES;
-    theme: CodeEditorThemesKeys;
+    theme: import('./types').CodeEditorThemesKeys;
     code: string;
     defaultCode: string;
     noParsing: boolean;
@@ -25,24 +25,24 @@ export declare const CodeEditorReducer: (state: CodeEditorState, action: Action)
     code: any;
     mode: MODES;
     diffMode: boolean;
-    theme: CodeEditorThemesKeys;
+    theme: import('./types').CodeEditorThemesKeys;
     defaultCode: string;
     noParsing: boolean;
 } | {
     defaultCode: any;
     mode: MODES;
     diffMode: boolean;
-    theme: CodeEditorThemesKeys;
+    theme: import('./types').CodeEditorThemesKeys;
     code: string;
     noParsing: boolean;
 } | {
     height: any;
     mode: MODES;
     diffMode: boolean;
-    theme: CodeEditorThemesKeys;
+    theme: import('./types').CodeEditorThemesKeys;
     code: string;
     defaultCode: string;
     noParsing: boolean;
 };
 export declare const parseValueToCode: (value: string, mode: string, tabSize: number) => string;
-export declare const initialState: ({ mode, theme, value, defaultValue, diffView, noParsing, tabSize, }: CodeEditorInitialValueType) => CodeEditorState;
+export declare const initialState: ({ mode, theme, value, defaultValue, diffView, noParsing, tabSize, appTheme, }: CodeEditorInitialValueType) => CodeEditorState;

package/dist/Common/CodeEditor/types.d.ts

@@ -1,9 +1,15 @@
+import { AppThemeType } from '../../Shared/Providers';
 import { MODES } from '../Constants';
 export interface InformationBarProps {
     text: string;
     className?: string;
     children?: React.ReactNode;
 }
+export declare enum CodeEditorThemesKeys {
+    vsDarkDT = "vs-dark--dt",
+    vs = "vs",
+    networkStatusInterface = "network-status-interface"
+}
 interface CodeEditorBaseInterface {
     value?: string;
     lineDecorationsWidth?: number;
@@ -22,7 +28,7 @@ interface CodeEditorBaseInterface {
     diffView?: boolean;
     loading?: boolean;
     customLoader?: JSX.Element;
-    theme?: string;
+    theme?: CodeEditorThemesKeys;
     original?: string;
     focus?: boolean;
     validatorSchema?: any;
@@ -68,21 +74,14 @@ export interface Action {
     type: ActionTypes;
     value: any;
 }
-export declare enum CodeEditorThemesKeys {
-    vsDarkDT = "vs-dark--dt",
-    deleteDraft = "delete-draft",
-    unpublished = "unpublished",
-    vs = "vs",
-    networkStatusInterface = "network-status-interface"
-}
-export interface CodeEditorInitialValueType {
+export interface CodeEditorInitialValueType extends Pick<CodeEditorBaseInterface, 'theme'> {
     mode: string;
     diffView: boolean;
-    theme?: string;
     value: string;
     defaultValue: string;
     noParsing?: boolean;
     tabSize: number;
+    appTheme: AppThemeType;
 }
 export interface CodeEditorState {
     mode: MODES;

package/dist/Common/CodeEditor/utils.d.ts

@@ -0,0 +1,3 @@
+import { AppThemeType } from '../../Shared/Providers';
+import { CodeEditorInterface } from './types';
+export declare const getCodeEditorThemeFromAppTheme: (editorTheme: CodeEditorInterface["theme"], appTheme: AppThemeType) => CodeEditorInterface["theme"];

package/dist/Common/MultiSelectCustomization.d.ts

@@ -23,6 +23,8 @@ export declare const multiSelectStyles: {
     option: (base: any, state: any) => any;
     container: (base: any, state: any) => any;
     valueContainer: (base: any, state: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
 };
 export interface CustomSelect {
     sortSelected?: boolean;

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

@@ -13,6 +13,9 @@ export declare const getCommonSelectStyle: (styleOverrides?: {}) => {
     loadingMessage: (base: any) => any;
     noOptionsMessage: (base: any) => any;
     multiValue: (base: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
+    menu: (base: any) => any;
 };
 /**
  * Returns the redirection props for a url

package/dist/Common/SegmentedControl/SegmentedControl.component.d.ts

@@ -1,3 +1,3 @@
 import { SegmentedControlProps } from './types';
-declare const SegmentedControl: ({ tabs, initialTab, onChange, tooltips, disabled, rootClassName, name, variant, }: SegmentedControlProps) => JSX.Element;
+declare const SegmentedControl: ({ tabs, initialTab, onChange, tooltips, disabled, rootClassName, name, variant, size, }: SegmentedControlProps) => JSX.Element;
 export default SegmentedControl;

package/dist/Common/SegmentedControl/constants.d.ts

@@ -0,0 +1,2 @@
+import { SegmentedControlProps } from './types';
+export declare const SEGMENTED_CONTROL_SIZE_TO_CLASS_MAP: Record<SegmentedControlProps['size'], string>;

package/dist/Common/SegmentedControl/types.d.ts

@@ -1,10 +1,12 @@
 import { OptionType } from '../Types';
+import { ComponentSizeType } from '../../Shared/constants';
+import { ReactNode } from 'react';
 export declare enum SegmentedControlVariant {
     GRAY_ON_WHITE = "gui-yaml-switch",
     WHITE_ON_GRAY = "gui-yaml-switch-window-bg"
 }
 export interface SegmentedControlProps {
-    tabs: OptionType[];
+    tabs: OptionType<string, ReactNode>[];
     initialTab: string;
     onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
     name: string;
@@ -12,4 +14,8 @@ export interface SegmentedControlProps {
     disabled?: boolean;
     rootClassName?: string;
     variant?: SegmentedControlVariant;
+    /**
+     * @default ComponentSizeType.medium
+     */
+    size?: ComponentSizeType.medium | ComponentSizeType.large;
 }

package/dist/Shared/Components/CICDHistory/DeploymentHistoryConfigDiff/DeploymentHistoryDiffView.d.ts

@@ -1,3 +1,3 @@
 import { DeploymentTemplateHistoryType } from '../types';
-declare const DeploymentHistoryDiffView: ({ currentConfiguration, baseTemplateConfiguration, previousConfigAvailable, isUnpublished, isDeleteDraft, rootClassName, sortingConfig, codeEditorKey, }: DeploymentTemplateHistoryType) => JSX.Element;
+declare const DeploymentHistoryDiffView: ({ currentConfiguration, baseTemplateConfiguration, previousConfigAvailable, rootClassName, sortingConfig, codeEditorKey, }: DeploymentTemplateHistoryType) => JSX.Element;
 export default DeploymentHistoryDiffView;

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

@@ -11,6 +11,8 @@ export declare const FILTER_STYLE: {
     option: (base: any, state: any) => any;
     container: (base: any, state: any) => any;
     valueContainer: (base: any, state: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
 };
 export declare const GIT_BRANCH_NOT_CONFIGURED = "Not Configured";
 export declare const DEFAULT_GIT_BRANCH_VALUE = "--";

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

@@ -390,8 +390,6 @@ export interface DeploymentTemplateHistoryType {
     currentConfiguration: DeploymentHistoryDetail;
     baseTemplateConfiguration: DeploymentHistoryDetail;
     previousConfigAvailable: boolean;
-    isUnpublished?: boolean;
-    isDeleteDraft?: boolean;
     rootClassName?: string;
     codeEditorKey?: React.Key;
     sortingConfig?: {

package/dist/Shared/Components/Plugin/PluginTagSelect.d.ts

@@ -1,3 +1,3 @@
 import { PluginTagSelectProps } from './types';
-declare const PluginTagSelect: ({ availableTags, handleUpdateSelectedTags, selectedTags, isLoading, hasError, reloadTags, }: PluginTagSelectProps) => JSX.Element;
+declare const PluginTagSelect: ({ availableTags, handleUpdateSelectedTags, selectedTags, isLoading, tagsError, reloadTags, }: PluginTagSelectProps) => JSX.Element;
 export default PluginTagSelect;

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

@@ -1,5 +1,5 @@
 import { MutableRefObject } from 'react';
-import { ConsequenceType, VariableType } from '../../../Common';
+import { ConsequenceType, ServerErrors, VariableType } from '../../../Common';
 import { BaseFilterQueryParams } from '../../types';
 import { ImageWithFallbackProps } from '../ImageWithFallback';
 import { getPluginStoreData } from './service';
@@ -149,7 +149,7 @@ export interface PluginListParamsType {
 export interface PluginTagSelectProps extends Pick<BasePluginListContainerProps, 'availableTags'> {
     selectedTags: PluginListContainerProps['parentFilters']['selectedTags'];
     isLoading: boolean;
-    hasError: boolean;
+    tagsError: ServerErrors;
     reloadTags: () => void;
     handleUpdateSelectedTags: (tags: string[]) => void;
 }

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

@@ -1,21 +1,5 @@
-import { OptionProps } from 'react-select';
-import { OptionType } from '../../../Common/Types';
 import { ParentPluginDTO, PluginDataStoreType } from './types';
 export declare const parsePluginDetailsDTOIntoPluginStore: (pluginData: ParentPluginDTO[]) => PluginDataStoreType;
-export declare const pluginTagSelectStyles: {
-    option: (base: any, state: any) => any;
-    container: (base: any, state: any) => any;
-    menuList: (base: any) => any;
-    control: (base: any, state: any) => any;
-    dropdownIndicator: (base: any, state: any) => any;
-    valueContainer: (base: any) => any;
-    loadingMessage: (base: any) => any;
-    noOptionsMessage: (base: any) => any;
-    placeholder: (base: any) => any;
-    group: (base: any) => any;
-    groupHeading: (base: any) => any;
-};
-export declare const PluginTagOption: (props: OptionProps<OptionType, true>) => JSX.Element;
 /**
  * @description This method takes the initial plugin data store and updates the keys with the target parent plugin store and plugin version store
  */

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

@@ -11,4 +11,5 @@ export declare const CommonGroupedDropdownStyles: {
     multiValue: (base: any) => any;
     multiValueLabel: (base: any) => any;
     placeholder: (base: any) => any;
+    menu: (base: any) => any;
 };

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

@@ -12,6 +12,9 @@ export declare const getCommonSelectStyle: (styleOverrides?: {}) => {
     placeholder: (base: any) => any;
     group: (base: any) => any;
     groupHeading: (base: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
+    menu: (base: any) => any;
 };
 export declare const getCustomOptionSelectionStyle: (styleOverrides?: {}) => (base: any, state: any) => any;
 export declare const SelectOption: (props: any) => JSX.Element;
@@ -29,6 +32,9 @@ export declare const commonSelectStyles: {
     placeholder: (base: any) => any;
     group: (base: any) => any;
     groupHeading: (base: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
+    menu: (base: any) => any;
 };
 export declare const MenuListWithApplyButton: ({ handleApplyFilter, ...props }: MenuListProps & {
     handleApplyFilter: () => void;

package/dist/Shared/Components/Security/SecurityModal/constants.d.ts

@@ -19,35 +19,35 @@ export declare const SUB_CATEGORY_LABELS: {
 export declare const SEVERITIES: {
     readonly critical: {
         readonly label: "Critical";
-        readonly color: "#B21212";
+        readonly color: "var(--R700)";
     };
     readonly high: {
         readonly label: "High";
-        readonly color: "#F33E3E";
+        readonly color: "var(--R500)";
     };
     readonly medium: {
         readonly label: "Medium";
-        readonly color: "#FF7E5B";
+        readonly color: "var(--O500)";
     };
     readonly low: {
         readonly label: "Low";
-        readonly color: "#FFB549";
+        readonly color: "var(--Y500)";
     };
     readonly unknown: {
         readonly label: "Unknown";
-        readonly color: "#B1B7BC";
+        readonly color: "var(--N300)";
     };
     readonly fail: {
         readonly label: "Failures";
-        readonly color: "#F33E3E";
+        readonly color: "var(--R500)";
     };
     readonly success: {
         readonly label: "Successes";
-        readonly color: "#1DAD70";
+        readonly color: "var(--G500)";
     };
     readonly exceptions: {
         readonly label: "Exceptions";
-        readonly color: "#B1B7BC";
+        readonly color: "var(--N300)";
     };
 };
 export declare const ORDERED_SEVERITY_KEYS: readonly [SeveritiesDTO.CRITICAL, SeveritiesDTO.HIGH, SeveritiesDTO.MEDIUM, SeveritiesDTO.LOW, SeveritiesDTO.UNKNOWN, SeveritiesDTO.FAILURES, SeveritiesDTO.EXCEPTIONS, SeveritiesDTO.SUCCESSES];

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

@@ -1,7 +1,7 @@
 import { ScanResultDTO, SeveritiesDTO, GetResourceScanDetailsResponseType, ImageScanVulnerabilityType, ImageVulnerabilityType, VulnerabilityCountType } from './types';
 import { SEVERITIES } from './constants';
 export declare const mapSeveritiesToSegmentedBarChartEntities: (severities: Partial<Record<keyof typeof SEVERITIES, number>>) => {
-    color: "#B1B7BC" | "#B21212" | "#F33E3E" | "#FF7E5B" | "#FFB549" | "#1DAD70";
+    color: "var(--Y500)" | "var(--R500)" | "var(--G500)" | "var(--O500)" | "var(--N300)" | "var(--R700)";
     label: "Critical" | "High" | "Medium" | "Low" | "Unknown" | "Failures" | "Successes" | "Exceptions";
     value: number;
 }[];

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

@@ -43,7 +43,7 @@ import { SelectPickerProps } from './type';
  * <SelectPicker
  *      ...
  *      renderMenuListFooter={() => (
- *          <div className="px-8 py-6 dc__border-top bcn-50 cn-6">
+ *          <div className="px-8 py-6 dc__border-top bg__secondary cn-6">
  *              <div>Foot note</div>
  *          </div>
  *      )}

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

@@ -0,0 +1,3 @@
+import { ThemeSwitcherProps } from './types';
+declare const ThemeSwitcher: ({ onChange }: ThemeSwitcherProps) => JSX.Element;
+export default ThemeSwitcher;

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

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+import { ThemePreferenceType } from '@Shared/Providers/ThemeProvider/types';
+export declare const THEME_PREFERENCE_TO_ICON_MAP: Record<ThemePreferenceType, {
+    tippyContent: string;
+    icon: ReactElement;
+}>;

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

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

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

@@ -0,0 +1,3 @@
+export interface ThemeSwitcherProps {
+    onChange: () => void;
+}

package/dist/Shared/Providers/ThemeProvider/ThemeProvider.d.ts

@@ -0,0 +1,3 @@
+import { ThemeContextType, ThemeProviderProps } from './types';
+export declare const ThemeProvider: ({ children }: ThemeProviderProps) => JSX.Element;
+export declare const useTheme: () => ThemeContextType;

package/dist/Shared/Providers/ThemeProvider/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const THEME_PREFERENCE_STORAGE_KEY = "themePreference";
+export declare const DARK_COLOR_SCHEME_MATCH_QUERY = "(prefers-color-scheme: dark)";

package/dist/Shared/Providers/ThemeProvider/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ThemeProvider';
+export { AppThemeType } from './types';

package/dist/Shared/Providers/ThemeProvider/types.d.ts

@@ -0,0 +1,33 @@
+import { ReactNode } from 'react';
+export declare enum AppThemeType {
+    light = "light",
+    dark = "dark"
+}
+export declare const THEME_PREFERENCE_MAP: {
+    readonly auto: "auto";
+    readonly light: AppThemeType.light;
+    readonly dark: AppThemeType.dark;
+};
+export type ThemePreferenceType = (typeof THEME_PREFERENCE_MAP)[keyof typeof THEME_PREFERENCE_MAP];
+export interface ThemeConfigType {
+    /**
+     * Current application theme
+     *
+     * @default AppThemeType.light
+     */
+    appTheme: AppThemeType;
+    /**
+     * Preferred theme for the user (if any)
+     *
+     * @default THEME_PREFERENCE_MAP.auto
+     *
+     * Note: This shouldn't be consumed other than in ThemeSwitcher component
+     */
+    themePreference: ThemePreferenceType;
+}
+export interface ThemeContextType extends ThemeConfigType {
+    handleSelectedThemeChange: (updatedThemePreference: ThemePreferenceType) => void;
+}
+export interface ThemeProviderProps {
+    children: ReactNode;
+}

package/dist/Shared/Providers/ThemeProvider/utils.d.ts

@@ -0,0 +1,4 @@
+import { AppThemeType, ThemePreferenceType, ThemeConfigType } from './types';
+export declare const getAppThemeForAutoPreference: () => AppThemeType;
+export declare const getThemeConfigFromLocalStorage: () => ThemeConfigType;
+export declare const setThemePreferenceInLocalStorage: (themePreference: ThemePreferenceType) => void;

package/dist/Shared/Providers/index.d.ts

@@ -1,4 +1,5 @@
 export * from './MainContextProvider';
 export * from './ImageSelectionUtility';
+export * from './ThemeProvider';
 export * from './UserEmailProvider';
 export type { MainContext } from './types';