@newtonschool/grauity 3.0.23-beta.0 → 3.0.23

package/dist/index.d.ts

@@ -1051,11 +1051,6 @@ export const NS_DARK_THEME_CONFIG: {
         };
     };
 };
-enum ThemeType {
-    Light = "light",
-    Dark = "dark"
-}
-type Theme = `${ThemeType}`;
 export const NSGlobalStyle: NamedExoticComponent<any>;
 export const NS_LIGHT_THEME_CONFIG: {
     colors: {
@@ -1593,11 +1588,1076 @@ export const NS_LIGHT_THEME_CONFIG: {
  *
  * Wrap your app/components with this provider and also provide class name
  * of `'grauity-theme-light'` or `'grauity-theme-dark'` to the parent div of your app/component.
+ *
+ * @param {object} themeConfig - Configuration object for the theme
+ * @param {React.ReactNode} children - Child components
+ *
+ * @returns {React.ReactNode} - Returns the child components wrapped in the theme provider
  */
-export const GrauityThemeProvider: ({ themeConfig, children, applyTheme, }: {
-    themeConfig?: Record<string, any>;
-    children?: React.ReactNode;
-    applyTheme?: Theme;
+export const GrauityThemeProvider: ({ themeConfig, children, }: {
+    themeConfig?: {
+        light: {
+            colors: {
+                bg: {
+                    subtle: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-secondary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-tertiary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    moderate: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    emphasis: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                };
+                text: {
+                    subtle: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    moderate: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    emphasis: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        white: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                };
+                border: {
+                    subtle: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    moderate: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    emphasis: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                };
+            };
+            visibility: {
+                lightVisible: string;
+                darkVisible: string;
+            };
+            legacyColors: {
+                text: {
+                    textPrimary: string;
+                    textSecondary: string;
+                    textDisabled: string;
+                    textAction: string;
+                    textAction2: string;
+                    textBrand: string;
+                    textSuccess: string;
+                    textError: string;
+                    textWarning: string;
+                    textYellow: string;
+                    textPurple: string;
+                };
+                background: {
+                    bgPrimary: string;
+                    bgSecondary: string;
+                    bgTertiary: string;
+                    bgBrand: string;
+                    bgSuccess: string;
+                    bgError: string;
+                    bgWarning: string;
+                    bgYellow: string;
+                    bgPurple: string;
+                    bgDisabled: string;
+                    bgActionBrand: string;
+                    bgActionSuccess: string;
+                    bgActionError: string;
+                    bgActionWarning: string;
+                    bgActionYellow: string;
+                    bgActionPurple: string;
+                    bgInvertPrimary: string;
+                    bgInvertSecondary: string;
+                    bgInvertTertiary: string;
+                    bgPrimaryHover: string;
+                    bgInvertPrimaryHover: string;
+                    bgActionBrandHover: string;
+                    bgActionSuccessHover: string;
+                    bgActionErrorHover: string;
+                    bgActionWarningHover: string;
+                    bgActionYellowHover: string;
+                };
+                border: {
+                    border: string;
+                    borderBrand: string;
+                    borderSuccess: string;
+                    borderError: string;
+                    borderWarning: string;
+                    borderYellow: string;
+                    borderPurple: string;
+                    borderNeutral: string;
+                };
+            };
+        };
+        dark: {
+            colors: {
+                bg: {
+                    subtle: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-secondary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-tertiary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    moderate: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    emphasis: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                };
+                text: {
+                    subtle: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    moderate: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    emphasis: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        white: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                };
+                border: {
+                    subtle: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    moderate: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                    emphasis: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        'invert-primary': {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        tertiary: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        brand: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        success: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        error: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        warning: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        yellow: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                        purple: {
+                            default: string;
+                            hover: string;
+                            disabled: string;
+                        };
+                    };
+                };
+            };
+            visibility: {
+                lightVisible: string;
+                darkVisible: string;
+            };
+            legacyColors: {
+                text: {
+                    textPrimary: string;
+                    textSecondary: string;
+                    textDisabled: string;
+                    textAction: string;
+                    textAction2: string;
+                    textBrand: string;
+                    textSuccess: string;
+                    textError: string;
+                    textWarning: string;
+                    textYellow: string;
+                    textPurple: string;
+                };
+                background: {
+                    bgPrimary: string;
+                    bgSecondary: string;
+                    bgTertiary: string;
+                    bgBrand: string;
+                    bgSuccess: string;
+                    bgError: string;
+                    bgWarning: string;
+                    bgYellow: string;
+                    bgPurple: string;
+                    bgDisabled: string;
+                    bgActionBrand: string;
+                    bgActionSuccess: string;
+                    bgActionError: string;
+                    bgActionWarning: string;
+                    bgActionYellow: string;
+                    bgActionPurple: string;
+                    bgInvertPrimary: string;
+                    bgInvertSecondary: string;
+                    bgInvertTertiary: string;
+                    bgPrimaryHover: string;
+                    bgInvertPrimaryHover: string;
+                    bgActionBrandHover: string;
+                    bgActionSuccessHover: string;
+                    bgActionErrorHover: string;
+                    bgActionWarningHover: string;
+                    bgActionYellowHover: string;
+                };
+                border: {
+                    border: string;
+                    borderBrand: string;
+                    borderSuccess: string;
+                    borderError: string;
+                    borderWarning: string;
+                    borderYellow: string;
+                    borderPurple: string;
+                    borderNeutral: string;
+                };
+            };
+        };
+    };
+    children?: any;
 }) => JSX.Element;
 export const NSThemeContext: React.Context<any>;
 interface ThemeWrapperProps {