@temboplus/frontend-react-core 0.1.3-beta.1 → 0.1.3-beta.10

package/dist/tembo-notify-h5Xn66oA.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tembo-notify-h5Xn66oA.js","sources":["../src/features/notifications/toast-config.tsx","../src/features/notifications/tembo-notify.tsx"],"sourcesContent":[null,null],"names":["buildToastConfigs","colors","constants","baseConfig","position","autoClose","hideProgressBar","closeOnClick","pauseOnHover","draggable","closeButton","style","fontFamily","typography","fontSize","borderRadius","padding","boxShadow","border","minHeight","backgroundColor","surface","elevated","color","text","primary","display","alignItems","gap","successConfig","Object","assign","icon","_jsx","CheckCircleOutlined","success","main","bg","className","errorConfig","CloseCircleOutlined","error","warningConfig","ExclamationCircleOutlined","warning","infoConfig","InfoCircleOutlined","info","loadingConfig","LoadingOutlined","FALLBACK_BASE_CONFIG","TemboNotify","init","this","configs","getConfigs","formatMessage","message","hasTitle","title","hasDescription","description","_jsxs","flexDirection","children","fontWeight","opacity","buildOptions","options","_a","duration","toastId","onClick","onClose","restOptions","__rest","effectiveBase","undefined","getSuccessConfig","_b","getErrorConfig","getWarningConfig","getInfoConfig","getLoadingConfig","content","toastOptions","toast","loading","update","id","typeConfig","type","render","isLoading","dismiss","dismissAll","isActive"],"mappings":"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"}

package/dist/theme/colors.d.ts

@@ -5,11 +5,12 @@
  * - Seed tokens (primary, action) → Map tokens (surfaces, components) → Alias tokens (text, borders)
  * - Named by purpose, not by specific color values
  * - Supports theming through consistent semantic structure
+ * - Theme-aware: neutral scale adapts to light/dark mode
  *
  * @example
  * // Usage in components
  * const { colors } = useTemboTheme();
- * style={{ color: colors.text.primary, backgroundColor: colors.surface.main }}
+ * style={{ color: colors.text.primary, backgroundColor: colors.neutral.lightest }}
  */
 export interface TemboColorPalette {
     /**
@@ -48,25 +49,54 @@ export interface TemboColorPalette {
         contrast: string;
     };
     /**
-     * Neutral color scale
+     * Absolute colors
+     * Never change regardless of theme mode - use for logos, illustrations, or specific design requirements
+     */
+    absolute: {
+        /** Pure white - always #ffffff */
+        white: string;
+        /** Pure black - always #000000 */
+        black: string;
+    };
+    /**
+     * Neutral color scale (0-10)
+     * Theme-aware: entire scale inverts in dark mode
      * Foundation for backgrounds, borders, and subtle UI elements
-     * Numbered 50-950 where 50 is lightest and 950 is darkest
+     * 0 = brightest in current theme, 10 = dimmest in current theme
      */
     neutral: {
-        /** Near white - for subtle backgrounds */
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        /** Mid-point gray - useful for borders and dividers */
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-        /** Near black - for dark backgrounds or text */
-        950: string;
+        /** Brightest tone in current theme (white in light, black in dark) */
+        0: string;
+        1: string;
+        2: string;
+        3: string;
+        4: string;
+        /** Middle gray - typically stays similar across themes */
+        5: string;
+        6: string;
+        7: string;
+        8: string;
+        9: string;
+        /** Dimmest tone in current theme (black in light, white in dark) */
+        10: string;
+        /** Brightest tone (maps to 0) */
+        brightest: string;
+        /** Near-brightest tone (maps to 1) */
+        lightest: string;
+        /** Very light tone (maps to 2) */
+        lighter: string;
+        /** Light tone (maps to 3) */
+        light: string;
+        /** Middle tone (maps to 5) */
+        medium: string;
+        /** Dark tone (maps to 7) */
+        dark: string;
+        /** Very dark tone (maps to 8) */
+        darker: string;
+        /** Near-dimmest tone (maps to 9) */
+        darkest: string;
+        /** Dimmest tone (maps to 10) */
+        dimmest: string;
     };
     /**
      * Success colors
@@ -210,11 +240,9 @@ export interface TemboColorPalette {
     };
     /**
      * Utility colors
-     * Absolute color values for special cases
+     * Special purpose color values
      */
     utility: {
-        white: string;
-        black: string;
         transparent: string;
         /** Link color (often aliases action.main) */
         link: string;
@@ -228,8 +256,11 @@ export interface TemboColorPalette {
  */
 export type TemboColorOverrides = DeepPartial<TemboColorPalette>;
 /**
- * Default Tembo color palette
- * Light theme with professional, accessible colors
+ * Theme mode
+ */
+export type ThemeMode = 'light' | 'dark';
+/**
+ * Default color palette for light theme
  */
 export declare const defaultColorPalette: TemboColorPalette;
 /**
@@ -237,9 +268,10 @@ export declare const defaultColorPalette: TemboColorPalette;
  * Performs deep merge to allow partial nested overrides
  *
  * @param overrides - Partial color palette overrides
+ * @param mode - Theme mode ('light' or 'dark')
  * @returns Complete color palette with overrides applied
  */
-export declare const buildColorPalette: (overrides?: TemboColorOverrides) => TemboColorPalette;
+export declare const buildColorPalette: (overrides?: TemboColorOverrides, mode?: ThemeMode) => TemboColorPalette;
 type DeepPartial<T> = {
     [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
 };

package/dist/theme/colors.js

@@ -0,0 +1,212 @@
+import { merge } from "lodash";
+/**
+ * Base color values for light theme
+ * These are the actual color values that get mapped to the palette
+ */
+const lightModeColors = {
+    neutral: {
+        0: '#ffffff',
+        1: '#fafafa',
+        2: '#f5f5f5',
+        3: '#f0f0f0',
+        4: '#e5e5e5',
+        5: '#d4d4d4',
+        6: '#b3b3b3',
+        7: '#999999',
+        8: '#666666',
+        9: '#1a1a1a',
+        10: '#000000',
+    },
+};
+/**
+ * Base color values for dark theme
+ * Inverted neutral scale for dark mode
+ */
+const darkModeColors = {
+    neutral: {
+        0: '#000000',
+        1: '#1a1a1a',
+        2: '#666666',
+        3: '#999999',
+        4: '#b3b3b3',
+        5: '#d4d4d4',
+        6: '#e5e5e5',
+        7: '#f0f0f0',
+        8: '#f5f5f5',
+        9: '#fafafa',
+        10: '#ffffff',
+    },
+};
+/**
+ * Build default color palette for a given theme mode
+ *
+ * @param mode - 'light' or 'dark'
+ * @returns Complete color palette with theme-aware neutral scale
+ */
+const buildDefaultPalette = (mode) => {
+    const modeColors = mode === 'light' ? lightModeColors : darkModeColors;
+    return {
+        primary: {
+            main: '#000000',
+            hover: '#1a1a1a',
+            active: '#000000',
+            light: '#666666',
+            lighter: '#999999',
+            contrast: '#FFFFFF',
+        },
+        action: {
+            main: '#1a6985',
+            hover: '#145268',
+            active: '#0f3d4f',
+            light: '#e8f2f5',
+            lighter: '#f4f9fa',
+            disabled: '#a3c9d6',
+            contrast: '#FFFFFF',
+        },
+        absolute: {
+            white: '#ffffff',
+            black: '#000000',
+        },
+        neutral: {
+            // Numeric scale (theme-aware)
+            0: modeColors.neutral[0],
+            1: modeColors.neutral[1],
+            2: modeColors.neutral[2],
+            3: modeColors.neutral[3],
+            4: modeColors.neutral[4],
+            5: modeColors.neutral[5],
+            6: modeColors.neutral[6],
+            7: modeColors.neutral[7],
+            8: modeColors.neutral[8],
+            9: modeColors.neutral[9],
+            10: modeColors.neutral[10],
+            // Convenient aliases (map to numeric scale)
+            brightest: modeColors.neutral[0],
+            lightest: modeColors.neutral[1],
+            lighter: modeColors.neutral[2],
+            light: modeColors.neutral[3],
+            medium: modeColors.neutral[5],
+            dark: modeColors.neutral[7],
+            darker: modeColors.neutral[8],
+            darkest: modeColors.neutral[9],
+            dimmest: modeColors.neutral[10],
+        },
+        success: {
+            main: '#10b981',
+            bg: '#ecfdf5',
+            border: '#a7f3d0',
+            text: '#047857',
+        },
+        error: {
+            main: '#ef4444',
+            bg: '#fef2f2',
+            border: '#fecaca',
+            text: '#dc2626',
+        },
+        warning: {
+            main: '#f59e0b',
+            bg: '#fffbeb',
+            border: '#fde68a',
+            text: '#d97706',
+        },
+        info: {
+            main: '#1a6985',
+            bg: '#e8f2f5',
+            border: '#b8d9e6',
+            text: '#0f3d4f',
+        },
+        surface: {
+            background: modeColors.neutral[0],
+            main: modeColors.neutral[0],
+            elevated: modeColors.neutral[0],
+            hover: modeColors.neutral[1],
+            subtle: modeColors.neutral[1],
+        },
+        text: {
+            primary: modeColors.neutral[10],
+            secondary: modeColors.neutral[8],
+            tertiary: modeColors.neutral[7],
+            quaternary: modeColors.neutral[6],
+            disabled: modeColors.neutral[5],
+            inverse: modeColors.neutral[0],
+        },
+        border: {
+            main: modeColors.neutral[4],
+            light: modeColors.neutral[3],
+            strong: modeColors.neutral[5],
+            divider: modeColors.neutral[4],
+        },
+        components: {
+            button: {
+                primary: {
+                    bg: '#1a6985',
+                    hover: '#145268',
+                    text: '#FFFFFF',
+                },
+                default: {
+                    bg: modeColors.neutral[0],
+                    border: modeColors.neutral[5],
+                    text: modeColors.neutral[10],
+                    hover: modeColors.neutral[1],
+                },
+            },
+            input: {
+                bg: modeColors.neutral[0],
+                border: modeColors.neutral[5],
+                borderHover: modeColors.neutral[7],
+                borderFocus: '#1a6985',
+                placeholder: modeColors.neutral[7],
+            },
+            table: {
+                bg: modeColors.neutral[0],
+                headerBg: modeColors.neutral[1],
+                headerText: modeColors.neutral[10],
+                border: modeColors.neutral[4],
+                rowHover: modeColors.neutral[1],
+            },
+            sidebar: {
+                bg: '#000000',
+                hover: 'rgba(255, 255, 255, 0.08)',
+                selected: 'rgba(255, 255, 255, 0.12)',
+                text: '#FFFFFF',
+                textSecondary: 'rgba(255, 255, 255, 0.65)',
+            },
+        },
+        utility: {
+            transparent: 'transparent',
+            link: '#1a6985',
+            linkHover: '#145268',
+            linkActive: '#0f3d4f',
+        },
+    };
+};
+/**
+ * Default color palette for light theme
+ */
+export const defaultColorPalette = buildDefaultPalette('light');
+/**
+ * Build a complete color palette by merging overrides with defaults
+ * Performs deep merge to allow partial nested overrides
+ *
+ * @param overrides - Partial color palette overrides
+ * @param mode - Theme mode ('light' or 'dark')
+ * @returns Complete color palette with overrides applied
+ */
+export const buildColorPalette = (overrides, mode = 'light') => {
+    const basePalette = buildDefaultPalette(mode);
+    if (!overrides)
+        return basePalette;
+    const merged = merge({}, basePalette, overrides);
+    // After merging, ensure neutral aliases are synced with numeric values
+    // This handles cases where overrides might change the numeric scale
+    merged.neutral.brightest = merged.neutral[0];
+    merged.neutral.lightest = merged.neutral[1];
+    merged.neutral.lighter = merged.neutral[2];
+    merged.neutral.light = merged.neutral[3];
+    merged.neutral.medium = merged.neutral[5];
+    merged.neutral.dark = merged.neutral[7];
+    merged.neutral.darker = merged.neutral[8];
+    merged.neutral.darkest = merged.neutral[9];
+    merged.neutral.dimmest = merged.neutral[10];
+    return merged;
+};

package/dist/theme/constants.js

@@ -0,0 +1,82 @@
+import { merge } from 'lodash';
+/**
+ * Default UI constants
+ * Professional, accessible defaults suitable for most applications
+ */
+export const defaultUIConstants = {
+    typography: {
+        fontFamily: "Avenir, MarkPro, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",
+        fontSize: {
+            xs: 12,
+            sm: 13,
+            base: 14,
+            lg: 16,
+            xl: 18,
+        },
+        fontWeight: {
+            normal: 400,
+            medium: 500,
+            semibold: 600,
+            bold: 700,
+        },
+        lineHeight: {
+            tight: 1.25,
+            base: 1.5715,
+            relaxed: 1.75,
+        },
+    },
+    spacing: {
+        xs: 4,
+        sm: 8,
+        md: 12,
+        lg: 16,
+        xl: 24,
+        '2xl': 32,
+        '3xl': 48,
+    },
+    radius: {
+        none: 0,
+        sm: 8,
+        base: 12,
+        md: 14,
+        lg: 16,
+        xl: 20,
+        full: 9999,
+        button: 24,
+        input: 10,
+        card: 16,
+    },
+    shadow: {
+        sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
+        base: '0 1px 3px 0 rgba(0, 0, 0, 0.08), 0 1px 2px -1px rgba(0, 0, 0, 0.08)',
+        md: '0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -2px rgba(0, 0, 0, 0.08)',
+        lg: '0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.08)',
+        xl: '0 20px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.08)',
+        card: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
+        elevated: '0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -2px rgba(0, 0, 0, 0.08)',
+        dropdown: '0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.08)',
+    },
+    zIndex: {
+        dropdown: 1000,
+        modal: 1050,
+        popover: 1060,
+        tooltip: 1070,
+        notification: 1080,
+    },
+    transition: {
+        fast: '150ms cubic-bezier(0.4, 0, 0.2, 1)',
+        base: '200ms cubic-bezier(0.4, 0, 0.2, 1)',
+        slow: '300ms cubic-bezier(0.4, 0, 0.2, 1)',
+    },
+};
+/**
+ * Build complete UI constants by merging overrides with defaults
+ *
+ * @param overrides - Partial UI constants overrides
+ * @returns Complete UI constants with overrides applied
+ */
+export const buildUIConstants = (overrides) => {
+    if (!overrides)
+        return defaultUIConstants;
+    return merge(defaultUIConstants, overrides);
+};

package/dist/theme/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../theme-provider-Dqvy24OD.js");require("react"),require("antd"),require("lodash"),exports.TemboThemeProvider=e.TemboThemeProvider,exports.buildColorPalette=e.buildColorPalette,exports.buildUIConstants=e.buildUIConstants,exports.defaultColorPalette=e.defaultColorPalette,exports.defaultUIConstants=e.defaultUIConstants,exports.useTemboTheme=e.useTemboTheme;
+"use strict";var e=require("../theme-provider-RhAw3jw_.js");require("react"),require("antd"),require("lodash"),exports.TemboThemeProvider=e.TemboThemeProvider,exports.buildColorPalette=e.buildColorPalette,exports.buildUIConstants=e.buildUIConstants,exports.defaultColorPalette=e.defaultColorPalette,exports.defaultUIConstants=e.defaultUIConstants,exports.useTemboTheme=e.useTemboTheme;
 //# sourceMappingURL=index.cjs.js.map

package/dist/theme/index.js

@@ -1,2 +1,2 @@
-export{T as TemboThemeProvider,b as buildColorPalette,c as buildUIConstants,d as defaultColorPalette,a as defaultUIConstants,u as useTemboTheme}from"../theme-provider-D_oV1J_K.js";import"react";import"antd";import"lodash";
+export{T as TemboThemeProvider,b as buildColorPalette,c as buildUIConstants,d as defaultColorPalette,a as defaultUIConstants,u as useTemboTheme}from"../theme-provider-Ca4P0Hcp.js";import"react";import"antd";import"lodash";
 //# sourceMappingURL=index.js.map

package/dist/theme/theme-provider.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { ThemeConfig } from 'antd';
-import { TemboColorPalette, TemboColorOverrides } from './colors.js';
+import { TemboColorPalette, TemboColorOverrides, ThemeMode } from './colors.js';
 import { TemboUIConstants, TemboUIConstantsOverrides } from './constants.js';
 /**
  * Shape of the theme context exposed via useTemboTheme()
@@ -8,6 +8,7 @@ import { TemboUIConstants, TemboUIConstantsOverrides } from './constants.js';
 export interface TemboThemeContextValue {
     colors: TemboColorPalette;
     constants: TemboUIConstants;
+    mode: ThemeMode;
 }
 /**
  * Props for TemboThemeProvider
@@ -19,6 +20,12 @@ export interface TemboThemeContextValue {
  * </TemboThemeProvider>
  *
  * @example
+ * // With dark mode
+ * <TemboThemeProvider mode="dark">
+ *   <App />
+ * </TemboThemeProvider>
+ *
+ * @example
  * // With color overrides
  * <TemboThemeProvider
  *   colors={{
@@ -32,6 +39,7 @@ export interface TemboThemeContextValue {
  * @example
  * // With all customizations
  * <TemboThemeProvider
+ *   mode="dark"
  *   colors={{ primary: { main: '#007bff' } }}
  *   constants={{ radius: { base: 8 } }}
  *   themeOverrides={{
@@ -45,6 +53,8 @@ export interface TemboThemeContextValue {
  */
 export interface TemboThemeProviderProps {
     children: React.ReactNode;
+    /** Theme mode - 'light' or 'dark' */
+    mode?: ThemeMode;
     /** Color palette overrides - supports deep partial overrides */
     colors?: TemboColorOverrides;
     /** UI constants overrides - supports deep partial overrides */
@@ -57,6 +67,7 @@ export interface TemboThemeProviderProps {
  *
  * Wraps your application to provide theming through React context and Ant Design's ConfigProvider.
  * Merges default colors/constants with host overrides and configures Ant Design components.
+ * Supports light and dark mode through the mode prop.
  *
  * All child components can access theme values via the useTemboTheme() hook.
  */
@@ -64,22 +75,23 @@ export declare const TemboThemeProvider: React.FC<TemboThemeProviderProps>;
 /**
  * Hook to access the active Tembo theme
  *
- * Returns the merged color palette and UI constants with any host overrides applied.
+ * Returns the merged color palette, UI constants, and current theme mode.
  * Components should always use this hook instead of importing defaults directly.
  *
- * @returns Theme context containing colors and constants
+ * @returns Theme context containing colors, constants, and mode
  *
  * @example
  * function MyComponent() {
- *   const { colors, constants } = useTemboTheme();
+ *   const { colors, constants, mode } = useTemboTheme();
  *
  *   return (
  *     <div style={{
  *       color: colors.text.primary,
  *       padding: constants.spacing.md,
- *       borderRadius: constants.radius.base
+ *       borderRadius: constants.radius.base,
+ *       backgroundColor: colors.neutral.lightest
  *     }}>
- *       Themed content
+ *       Current theme: {mode}
  *     </div>
  *   );
  * }