@redis-ui/styles 11.0.2 → 12.3.1

package/dist/commonStyles.d.ts

@@ -0,0 +1 @@
+export declare const CommonStyles: import("styled-components").GlobalStyleComponent<import("styled-components").ThemeProps<any>, import("styled-components").DefaultTheme>;

package/dist/fonts.css

@@ -1 +1,5 @@
 @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,300;0,400;0,600;0,700;1,400&family=Source+Code+Pro:wght@400;600&display=block');
+
+body {
+  font-family: 'Nunito Sans', sans-serif;
+}

package/dist/hooks/ThemeSwitch/SwitchableThemeProvider.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { Theme } from '../../themes/types';
+import { UseThemeSelectorParams } from './useThemeSelector';
+import { UseStorageParams } from './useStorage';
+export interface ThemeSwitchContextParams extends Pick<UseThemeSelectorParams, 'systemThemeName' | 'lightThemeName' | 'darkThemeName'> {
+    selectedTheme: string;
+    setSelectedTheme: (themeName: string) => void;
+}
+interface ThemeSwitchProviderProps extends ThemeSwitchContextParams {
+    children: ReactNode;
+}
+export declare const ThemeSwitchProvider: ({ children, selectedTheme, setSelectedTheme, lightThemeName, darkThemeName, systemThemeName }: ThemeSwitchProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const useThemeSwitchContext: () => ThemeSwitchContextParams;
+interface SwitchableThemeProviderProps extends Pick<UseThemeSelectorParams, 'systemThemeName' | 'initialThemeName'>, Pick<UseStorageParams, 'storageKey'> {
+    children: ReactNode;
+    lightTheme: Theme;
+    darkTheme: Theme;
+}
+export declare const SwitchableThemeProvider: ({ children, lightTheme, darkTheme, systemThemeName, initialThemeName, storageKey }: SwitchableThemeProviderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/hooks/ThemeSwitch/index.d.ts

@@ -0,0 +1,3 @@
+export * from './useThemeSelector';
+export * from './useStorage';
+export * from './SwitchableThemeProvider';

package/dist/hooks/ThemeSwitch/useStorage.d.ts

@@ -0,0 +1,9 @@
+export type UseStorageParams = {
+    storageKey: string;
+    value: string;
+    onChange: (value: string) => void;
+};
+export declare const useStorage: ({ value, ...params }: UseStorageParams) => {
+    readFromStorage: () => string;
+    saveToStorage: (newValue: string) => void;
+};

package/dist/hooks/ThemeSwitch/useThemeSelector.d.ts

@@ -0,0 +1,26 @@
+export type UseThemeSelectorParams = {
+    /**
+     * One of valid theme names, defined in other parameters: light/dark/system.
+     */
+    initialThemeName?: string;
+    /**
+     * Name of the light theme
+     */
+    lightThemeName: string;
+    /**
+     * Name of the dark theme
+     */
+    darkThemeName: string;
+    /**
+     * Optional name of the system theme.
+     * This can be any string, just to define the value for the storage and theme identifier.
+     * If it is defined, then it can be used as initialThemeName and can be selected by user.
+     * If system theme is selected, the current browser theme will be monitored and applied to the app.
+     */
+    systemThemeName?: string;
+};
+export declare const useThemeSelector: (params: UseThemeSelectorParams) => {
+    setSelectedTheme: (newSelection: string) => boolean;
+    selectedTheme: string;
+    currentTheme: string;
+};

package/dist/hooks/useTheme.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '../themes/types';
+export declare const useTheme: () => Theme;

package/dist/index.d.ts

@@ -1,8 +1,11 @@
-export { theme } from './themes/themeOld/theme';
+export { theme as themeOld } from './themes/themeOld/theme';
+export { theme } from './themes/themeLight/theme';
 export { theme as themeLight } from './themes/themeLight/theme';
 export { theme as themeDark } from './themes/themeDark/theme';
-export * from './themes/types/theme.types';
-export * from './themes/types/theme/theme.types';
-export * from './themes/hooks/useTheme';
+export * from './themes/types';
+export * from './themes/types/theme/components';
+export * from './hooks/useTheme';
 export * from './utils';
 export * from './focus-indicator';
+export * from './hooks/ThemeSwitch';
+export * from './commonStyles';