@impulse-ui-native/theme 1.0.7 → 1.0.8

package/dist/index.cjs.js

@@ -20,14 +20,22 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  BorderSizeTokens: () => BorderSizeTokens,
   DarkTheme: () => DarkTheme,
+  FontSizeTokens: () => FontSizeTokens,
+  FontWeightsItalic: () => FontWeightsItalic,
+  FontWeightsNormal: () => FontWeightsNormal,
   LightTheme: () => LightTheme,
+  NeutralColorTokens: () => NeutralColorTokens,
+  RadiiTokens: () => RadiiTokens,
+  SpaceTokens: () => SpaceTokens,
   StylePropsSet: () => StylePropsSet,
   ThemeProvider: () => ThemeProvider,
   createStyleKey: () => createStyleKey,
   extractStyleProps: () => extractStyleProps,
   useBorder: () => useBorder,
   useColors: () => useColors,
+  useComponentsTheme: () => useComponentsTheme,
   useRadii: () => useRadii,
   useSpace: () => useSpace,
   useStyleProps: () => useStyleProps,
@@ -112,6 +120,30 @@ var StylePropsSet = /* @__PURE__ */ new Set([
   "aspectRatio"
 ]);
 
+// src/constants/typography.constants.ts
+var FontWeightsNormal = {
+  100: "Montserrat_100Thin",
+  200: "Montserrat_200ExtraLight",
+  300: "Montserrat_300Light",
+  400: "Montserrat_400Regular",
+  500: "Montserrat_500Medium",
+  600: "Montserrat_600SemiBold",
+  700: "Montserrat_700Bold",
+  800: "Montserrat_800ExtraBold",
+  900: "Montserrat_900Black"
+};
+var FontWeightsItalic = {
+  100: "Montserrat_100Thin_Italic",
+  200: "Montserrat_200ExtraLight_Italic",
+  300: "Montserrat_300Light_Italic",
+  400: "Montserrat_400Regular_Italic",
+  500: "Montserrat_500Medium_Italic",
+  600: "Montserrat_600SemiBold_Italic",
+  700: "Montserrat_700Bold_Italic",
+  800: "Montserrat_800ExtraBold_Italic",
+  900: "Montserrat_900Black_Italic"
+};
+
 // src/hooks/use-border.hook.ts
 var import_react2 = require("react");
 
@@ -202,6 +234,10 @@ var DarkTheme = {
   },
   spacing: SpaceTokens,
   radii: RadiiTokens,
+  fontWeights: {
+    normal: FontWeightsNormal,
+    italic: FontWeightsItalic
+  },
   borderSize: BorderSizeTokens,
   fontSize: FontSizeTokens
 };
@@ -229,6 +265,10 @@ var LightTheme = {
   },
   spacing: SpaceTokens,
   radii: RadiiTokens,
+  fontWeights: {
+    normal: FontWeightsNormal,
+    italic: FontWeightsItalic
+  },
   borderSize: BorderSizeTokens,
   fontSize: FontSizeTokens
 };
@@ -260,11 +300,20 @@ var ThemeProvider = (0, import_react.memo)(function ThemeProvider2(props) {
   });
   const context = (0, import_react.useMemo)(() => {
     const baseTheme = scheme === "light" ? LightTheme : DarkTheme;
+    const customBaseTheme = props.theme?.[scheme];
+    const theme = (0, import_core.merge)(baseTheme, customBaseTheme);
+    let componentsTheme;
+    if (typeof props.components === "function") {
+      componentsTheme = props.components(theme);
+    } else {
+      componentsTheme = props.components;
+    }
     return {
       loaded,
-      theme: (0, import_core.merge)(baseTheme, props.theme?.[scheme])
+      theme,
+      components: componentsTheme
     };
-  }, [props.theme?.light, props.theme?.dark]);
+  }, [props.theme?.light, props.theme?.dark, props.components]);
   return /* @__PURE__ */ React.createElement(ThemeContext.Provider, { value: context }, props.children);
 });
 function useThemeContext() {
@@ -288,22 +337,29 @@ function useColors() {
   return (0, import_react3.useMemo)(() => context.theme.colors, [context.theme.colors]);
 }
 
-// src/hooks/use-radii.hook.ts
+// src/hooks/use-components-theme.hook.ts
 var import_react4 = require("react");
+function useComponentsTheme() {
+  const context = useThemeContext();
+  return (0, import_react4.useMemo)(() => context.components, [context.components]);
+}
+
+// src/hooks/use-radii.hook.ts
+var import_react5 = require("react");
 function useRadii() {
   const context = useThemeContext();
-  return (0, import_react4.useMemo)(() => context.theme.radii, [context.theme.radii]);
+  return (0, import_react5.useMemo)(() => context.theme.radii, [context.theme.radii]);
 }
 
 // src/hooks/use-space.hook.ts
-var import_react5 = require("react");
+var import_react6 = require("react");
 function useSpace() {
   const context = useThemeContext();
-  return (0, import_react5.useMemo)(() => context.theme.spacing, [context.theme.spacing]);
+  return (0, import_react6.useMemo)(() => context.theme.spacing, [context.theme.spacing]);
 }
 
 // src/hooks/use-style-props.hook.ts
-var import_react6 = require("react");
+var import_react7 = require("react");
 
 // src/utils/style.utils.ts
 var isStylePropKey = (k) => StylePropsSet.has(k);
@@ -329,32 +385,40 @@ var createStyleKey = (props) => {
 // src/hooks/use-style-props.hook.ts
 function useStyleProps(props) {
   const key = createStyleKey(props);
-  return (0, import_react6.useMemo)(() => extractStyleProps(props), [key]);
+  return (0, import_react7.useMemo)(() => extractStyleProps(props), [key]);
 }
 
 // src/hooks/use-theme.hook.ts
-var import_react7 = require("react");
+var import_react8 = require("react");
 function useTheme() {
   const context = useThemeContext();
-  return (0, import_react7.useMemo)(() => context.theme, [context.theme]);
+  return (0, import_react8.useMemo)(() => context.theme, [context.theme]);
 }
 
 // src/hooks/use-themed-styles.ts
-var import_react8 = require("react");
+var import_react9 = require("react");
 var useThemedStyles = (styledFunction, props) => {
   const theme = useTheme();
-  return (0, import_react8.useMemo)(() => styledFunction(theme, props), [theme, props]);
+  return (0, import_react9.useMemo)(() => styledFunction(theme, props), [theme, props]);
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  BorderSizeTokens,
   DarkTheme,
+  FontSizeTokens,
+  FontWeightsItalic,
+  FontWeightsNormal,
   LightTheme,
+  NeutralColorTokens,
+  RadiiTokens,
+  SpaceTokens,
   StylePropsSet,
   ThemeProvider,
   createStyleKey,
   extractStyleProps,
   useBorder,
   useColors,
+  useComponentsTheme,
   useRadii,
   useSpace,
   useStyleProps,

package/dist/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/constants/style.constants.ts","../src/hooks/use-border.hook.ts","../src/providers/theme.provider.tsx","../src/theme/tokens.theme.ts","../src/theme/dark.theme.ts","../src/theme/light.theme.ts","../src/hooks/use-colors.hook.ts","../src/hooks/use-radii.hook.ts","../src/hooks/use-space.hook.ts","../src/hooks/use-style-props.hook.ts","../src/utils/style.utils.ts","../src/hooks/use-theme.hook.ts","../src/hooks/use-themed-styles.ts"],"sourcesContent":["export * from './constants';\r\nexport * from './hooks';\r\nexport * from './providers';\r\nexport * from './theme';\r\nexport * from './types';\r\nexport * from './utils';\r\n","import { StyleProps } from \"../types\";\r\n\r\nexport const StylePropsSet = new Set<keyof StyleProps>([\r\n  // Spacing\r\n  \"margin\",\r\n  \"marginTop\",\r\n  \"marginBottom\",\r\n  \"marginLeft\",\r\n  \"marginRight\",\r\n  \"marginHorizontal\",\r\n  \"marginVertical\",\r\n  \"padding\",\r\n  \"paddingTop\",\r\n  \"paddingBottom\",\r\n  \"paddingLeft\",\r\n  \"paddingRight\",\r\n  \"paddingHorizontal\",\r\n  \"paddingVertical\",\r\n\r\n  // Appearance\r\n  \"color\",\r\n  \"backgroundColor\",\r\n  \"opacity\",\r\n  \"borderRadius\",\r\n  \"borderColor\",\r\n  \"borderWidth\",\r\n  \"borderStyle\",\r\n  \"shadowColor\",\r\n  \"shadowOpacity\",\r\n  \"shadowRadius\",\r\n  \"shadowOffset\",\r\n  \"elevation\",\r\n\r\n  // Typography (TextStyle)\r\n  \"fontSize\",\r\n  \"fontFamily\",\r\n  \"fontWeight\",\r\n  \"fontStyle\",\r\n  \"letterSpacing\",\r\n  \"lineHeight\",\r\n  \"textAlign\",\r\n  \"textDecorationLine\",\r\n  \"textDecorationStyle\",\r\n  \"textDecorationColor\",\r\n  \"textTransform\",\r\n  \"includeFontPadding\",\r\n  \"textAlignVertical\",\r\n  \"writingDirection\",\r\n\r\n  // Flex (ViewStyle)\r\n  \"flex\",\r\n  \"flexGrow\",\r\n  \"flexShrink\",\r\n  \"flexBasis\",\r\n  \"flexDirection\",\r\n  \"flexWrap\",\r\n  \"justifyContent\",\r\n  \"alignItems\",\r\n  \"alignSelf\",\r\n  \"alignContent\",\r\n  \"gap\",\r\n  \"rowGap\",\r\n  \"columnGap\",\r\n\r\n  // Positioning (commonly used with flex layouts)\r\n  \"position\",\r\n  \"top\",\r\n  \"right\",\r\n  \"bottom\",\r\n  \"left\",\r\n\r\n  // Dimensions (ViewStyle)\r\n  \"width\",\r\n  \"height\",\r\n  \"minWidth\",\r\n  \"maxWidth\",\r\n  \"minHeight\",\r\n  \"maxHeight\",\r\n  \"aspectRatio\",\r\n]);\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { BorderSizes } from \"../types\";\r\n\r\nexport function useBorder(): BorderSizes {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.borderSize, [context.theme.borderSize]);\r\n}\r\n","import { DeepPartial, merge } from \"@impulse-ui-native/core\";\r\nimport {\r\n  createContext,\r\n  memo,\r\n  PropsWithChildren,\r\n  useContext,\r\n  useMemo,\r\n} from \"react\";\r\nimport { DarkTheme, LightTheme } from \"../theme\";\r\nimport { AppTheme, ColorScheme, ThemeContextData } from \"../types\";\r\n\r\nimport {\r\n  Montserrat_100Thin,\r\n  Montserrat_100Thin_Italic,\r\n  Montserrat_200ExtraLight,\r\n  Montserrat_200ExtraLight_Italic,\r\n  Montserrat_300Light,\r\n  Montserrat_300Light_Italic,\r\n  Montserrat_400Regular,\r\n  Montserrat_400Regular_Italic,\r\n  Montserrat_500Medium,\r\n  Montserrat_500Medium_Italic,\r\n  Montserrat_600SemiBold,\r\n  Montserrat_600SemiBold_Italic,\r\n  Montserrat_700Bold,\r\n  Montserrat_700Bold_Italic,\r\n  Montserrat_800ExtraBold,\r\n  Montserrat_800ExtraBold_Italic,\r\n  Montserrat_900Black,\r\n  Montserrat_900Black_Italic,\r\n  useFonts,\r\n} from \"@expo-google-fonts/montserrat\";\r\n\r\nconst ThemeContext = createContext<ThemeContextData | undefined>(undefined);\r\n\r\ninterface ThemeProviderProps {\r\n  scheme: ColorScheme;\r\n  theme: {\r\n    light: AppTheme;\r\n    dark: AppTheme;\r\n  };\r\n}\r\n\r\nexport const ThemeProvider = memo(function ThemeProvider(\r\n  props: PropsWithChildren<DeepPartial<ThemeProviderProps>>\r\n) {\r\n  const scheme = props.scheme ?? \"light\";\r\n\r\n  const [loaded] = useFonts({\r\n    Montserrat_100Thin,\r\n    Montserrat_100Thin_Italic,\r\n    Montserrat_200ExtraLight,\r\n    Montserrat_200ExtraLight_Italic,\r\n    Montserrat_300Light,\r\n    Montserrat_300Light_Italic,\r\n    Montserrat_400Regular,\r\n    Montserrat_400Regular_Italic,\r\n    Montserrat_500Medium,\r\n    Montserrat_500Medium_Italic,\r\n    Montserrat_600SemiBold,\r\n    Montserrat_600SemiBold_Italic,\r\n    Montserrat_700Bold,\r\n    Montserrat_700Bold_Italic,\r\n    Montserrat_800ExtraBold,\r\n    Montserrat_800ExtraBold_Italic,\r\n    Montserrat_900Black,\r\n    Montserrat_900Black_Italic,\r\n  });\r\n\r\n  const context = useMemo<ThemeContextData>(() => {\r\n    const baseTheme = scheme === \"light\" ? LightTheme : DarkTheme;\r\n\r\n    return {\r\n      loaded,\r\n      theme: merge(baseTheme, props.theme?.[scheme]),\r\n    };\r\n  }, [props.theme?.light, props.theme?.dark]);\r\n\r\n  return (\r\n    <ThemeContext.Provider value={context}>\r\n      {props.children}\r\n    </ThemeContext.Provider>\r\n  );\r\n});\r\n\r\nexport function useThemeContext() {\r\n  const context = useContext(ThemeContext);\r\n\r\n  if (!context) {\r\n    throw new Error(\"useThemeContext must be used within a ThemeProvider\");\r\n  }\r\n\r\n  return context;\r\n}\r\n","import { BorderSizes, FontSizes, NeutralColors, Radii, Space } from \"../types\";\r\n\r\nexport const SpaceTokens: Space = {\r\n  none: 0,\r\n  auto: \"auto\",\r\n  xxs: 4,\r\n  xs: 8,\r\n  mxs: 12,\r\n  sm: 16,\r\n  msm: 24,\r\n  md: 32,\r\n  lg: 48,\r\n  xl: 64,\r\n  xxl: 96,\r\n};\r\n\r\nexport const BorderSizeTokens: BorderSizes = {\r\n  sm: 1,\r\n  md: 2,\r\n  lg: 3,\r\n  xl: 5,\r\n  xxl: 10,\r\n};\r\n\r\nexport const RadiiTokens: Radii = {\r\n  sm: 4,\r\n  md: 8,\r\n  lg: 16,\r\n  xl: 32,\r\n  xxl: 64,\r\n  xxxl: 128,\r\n  round: 100000,\r\n};\r\n\r\nexport const FontSizeTokens: FontSizes = {\r\n  xxs: 8,\r\n  xs: 12,\r\n  xsm: 14,\r\n  sm: 16,\r\n  md: 18,\r\n  lg: 20,\r\n  xl: 24,\r\n  xxl: 32,\r\n  xxxl: 40,\r\n  huge: 48,\r\n  massive: 56,\r\n};\r\n\r\nexport const NeutralColorTokens: NeutralColors = {\r\n  \"0\": \"#ffffff\",\r\n  \"1\": \"#f8f9fa\",\r\n  \"2\": \"#f1f3f5\",\r\n  \"3\": \"#e9ecef\",\r\n  \"4\": \"#dee2e6\",\r\n  \"5\": \"#ced4da\",\r\n  \"6\": \"#adb5bd\",\r\n  \"7\": \"#868e96\",\r\n  \"8\": \"#495057\",\r\n  \"9\": \"#343a40\",\r\n  \"10\": \"#212529\",\r\n  \"11\": \"#16191d\",\r\n  \"12\": \"#0d0f12\",\r\n  \"13\": \"#000000\",\r\n};\r\n","import { AppTheme } from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontSizeTokens,\r\n  NeutralColorTokens,\r\n  RadiiTokens,\r\n  SpaceTokens,\r\n} from \"./tokens.theme\";\r\n\r\nexport const DarkTheme: AppTheme = {\r\n  colors: {\r\n    primary: \"#f55d6b\",\r\n    secondary: \"#f55d6b\",\r\n    neutral: NeutralColorTokens,\r\n    white: NeutralColorTokens[\"0\"],\r\n    black: NeutralColorTokens[\"13\"],\r\n    error: \"#c92a2a\",\r\n    warning: \"#e67700\",\r\n    success: \"#7a9908\",\r\n    info: \"#1864ab\",\r\n    text: {\r\n      primary: NeutralColorTokens[\"11\"],\r\n      secondary: NeutralColorTokens[\"10\"],\r\n    },\r\n    background: {\r\n      primary: NeutralColorTokens[\"2\"],\r\n      secondary: NeutralColorTokens[\"0\"],\r\n    },\r\n  },\r\n  spacing: SpaceTokens,\r\n  radii: RadiiTokens,\r\n  borderSize: BorderSizeTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { AppTheme } from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontSizeTokens,\r\n  NeutralColorTokens,\r\n  RadiiTokens,\r\n  SpaceTokens,\r\n} from \"./tokens.theme\";\r\n\r\nexport const LightTheme: AppTheme = {\r\n  colors: {\r\n    primary: \"#f55d6b\",\r\n    secondary: \"#f55d6b\",\r\n    neutral: NeutralColorTokens,\r\n    white: NeutralColorTokens[\"0\"],\r\n    black: NeutralColorTokens[\"13\"],\r\n    error: \"#c92a2a\",\r\n    warning: \"#e67700\",\r\n    success: \"#7a9908\",\r\n    info: \"#1864ab\",\r\n    text: {\r\n      primary: NeutralColorTokens[\"11\"],\r\n      secondary: NeutralColorTokens[\"10\"],\r\n    },\r\n    background: {\r\n      primary: NeutralColorTokens[\"2\"],\r\n      secondary: NeutralColorTokens[\"0\"],\r\n    },\r\n  },\r\n  spacing: SpaceTokens,\r\n  radii: RadiiTokens,\r\n  borderSize: BorderSizeTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { ThemeColors } from \"../types\";\r\n\r\nexport function useColors(): ThemeColors {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.colors, [context.theme.colors]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { Radii } from \"../types\";\r\n\r\nexport function useRadii(): Radii {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.radii, [context.theme.radii]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { Space } from \"../types\";\r\n\r\nexport function useSpace(): Space {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.spacing, [context.theme.spacing]);\r\n}\r\n","import { useMemo } from 'react';\r\nimport { createStyleKey, extractStyleProps } from '../utils';\r\n\r\nexport function useStyleProps<Props extends object>(props: Props) {\r\n  const key = createStyleKey(props);\r\n\r\n  return useMemo(() => extractStyleProps(props), [key]);\r\n}\r\n","import { StylePropsSet } from '../constants';\r\nimport { StylePropKey, StyleProps } from '../types';\r\n\r\nconst isStylePropKey = (k: string): k is StylePropKey =>\r\n  StylePropsSet.has(k as StylePropKey);\r\n\r\nexport const extractStyleProps = <Props extends object>(\r\n  props: Props\r\n): StyleProps => {\r\n  const style: StyleProps = {};\r\n  \r\n  for (const k in props) {\r\n    if (isStylePropKey(k) && props[k] !== undefined) {\r\n      style[k] = props[k] as any;\r\n    }\r\n  }\r\n  \r\n  return style;\r\n};\r\n\r\nexport const createStyleKey = <Props extends object>(props: Props) => {\r\n  let key = '';\r\n\r\n  for (const k in props) {\r\n    if (isStylePropKey(k)) {\r\n      key += String(props[k as keyof Props]);\r\n    }\r\n  }\r\n  \r\n  return key;\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { AppTheme } from \"../types\";\r\n\r\nexport function useTheme(): AppTheme {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme, [context.theme]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { StyleSheet } from \"react-native\";\r\nimport { AppTheme } from \"../types\";\r\nimport { useTheme } from \"./use-theme.hook\";\r\n\r\ntype ThemedStyles<T extends StyleSheet.NamedStyles<T>> = T;\r\n\r\ntype StyledFunction<\r\n  Props extends object,\r\n  T extends StyleSheet.NamedStyles<T>\r\n> = (theme: AppTheme, props: Props) => ThemedStyles<T>;\r\n\r\nexport const useThemedStyles = <\r\n  Props extends object,\r\n  T extends StyleSheet.NamedStyles<T>\r\n>(\r\n  styledFunction: StyledFunction<Props, T>,\r\n  props: Props\r\n): ThemedStyles<T> => {\r\n  const theme = useTheme();\r\n\r\n  return useMemo(() => styledFunction(theme, props), [theme, props]);\r\n};\r\n"],"mappings":"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","names":["import_react","ThemeProvider","import_react","import_react","import_react","import_react","import_react","import_react"]}
+{"version":3,"sources":["../src/index.ts","../src/constants/style.constants.ts","../src/constants/typography.constants.ts","../src/hooks/use-border.hook.ts","../src/providers/theme.provider.tsx","../src/theme/tokens.theme.ts","../src/theme/dark.theme.ts","../src/theme/light.theme.ts","../src/hooks/use-colors.hook.ts","../src/hooks/use-components-theme.hook.ts","../src/hooks/use-radii.hook.ts","../src/hooks/use-space.hook.ts","../src/hooks/use-style-props.hook.ts","../src/utils/style.utils.ts","../src/hooks/use-theme.hook.ts","../src/hooks/use-themed-styles.ts"],"sourcesContent":["export * from \"./constants\";\r\nexport * from \"./hooks\";\r\nexport * from \"./providers\";\r\nexport * from \"./theme\";\r\nexport * from \"./types\";\r\nexport * from \"./utils\";\r\n","import { StyleProps } from \"../types\";\r\n\r\nexport const StylePropsSet = new Set<keyof StyleProps>([\r\n  // Spacing\r\n  \"margin\",\r\n  \"marginTop\",\r\n  \"marginBottom\",\r\n  \"marginLeft\",\r\n  \"marginRight\",\r\n  \"marginHorizontal\",\r\n  \"marginVertical\",\r\n  \"padding\",\r\n  \"paddingTop\",\r\n  \"paddingBottom\",\r\n  \"paddingLeft\",\r\n  \"paddingRight\",\r\n  \"paddingHorizontal\",\r\n  \"paddingVertical\",\r\n\r\n  // Appearance\r\n  \"color\",\r\n  \"backgroundColor\",\r\n  \"opacity\",\r\n  \"borderRadius\",\r\n  \"borderColor\",\r\n  \"borderWidth\",\r\n  \"borderStyle\",\r\n  \"shadowColor\",\r\n  \"shadowOpacity\",\r\n  \"shadowRadius\",\r\n  \"shadowOffset\",\r\n  \"elevation\",\r\n\r\n  // Typography (TextStyle)\r\n  \"fontSize\",\r\n  \"fontFamily\",\r\n  \"fontWeight\",\r\n  \"fontStyle\",\r\n  \"letterSpacing\",\r\n  \"lineHeight\",\r\n  \"textAlign\",\r\n  \"textDecorationLine\",\r\n  \"textDecorationStyle\",\r\n  \"textDecorationColor\",\r\n  \"textTransform\",\r\n  \"includeFontPadding\",\r\n  \"textAlignVertical\",\r\n  \"writingDirection\",\r\n\r\n  // Flex (ViewStyle)\r\n  \"flex\",\r\n  \"flexGrow\",\r\n  \"flexShrink\",\r\n  \"flexBasis\",\r\n  \"flexDirection\",\r\n  \"flexWrap\",\r\n  \"justifyContent\",\r\n  \"alignItems\",\r\n  \"alignSelf\",\r\n  \"alignContent\",\r\n  \"gap\",\r\n  \"rowGap\",\r\n  \"columnGap\",\r\n\r\n  // Positioning (commonly used with flex layouts)\r\n  \"position\",\r\n  \"top\",\r\n  \"right\",\r\n  \"bottom\",\r\n  \"left\",\r\n\r\n  // Dimensions (ViewStyle)\r\n  \"width\",\r\n  \"height\",\r\n  \"minWidth\",\r\n  \"maxWidth\",\r\n  \"minHeight\",\r\n  \"maxHeight\",\r\n  \"aspectRatio\",\r\n]);\r\n","import { FontWeightItalic, FontWeightKey, FontWeightNormal } from \"../types\";\r\n\r\nexport const FontWeightsNormal: Record<FontWeightKey, FontWeightNormal> = {\r\n  100: \"Montserrat_100Thin\",\r\n  200: \"Montserrat_200ExtraLight\",\r\n  300: \"Montserrat_300Light\",\r\n  400: \"Montserrat_400Regular\",\r\n  500: \"Montserrat_500Medium\",\r\n  600: \"Montserrat_600SemiBold\",\r\n  700: \"Montserrat_700Bold\",\r\n  800: \"Montserrat_800ExtraBold\",\r\n  900: \"Montserrat_900Black\",\r\n};\r\n\r\nexport const FontWeightsItalic: Record<FontWeightKey, FontWeightItalic> = {\r\n  100: \"Montserrat_100Thin_Italic\",\r\n  200: \"Montserrat_200ExtraLight_Italic\",\r\n  300: \"Montserrat_300Light_Italic\",\r\n  400: \"Montserrat_400Regular_Italic\",\r\n  500: \"Montserrat_500Medium_Italic\",\r\n  600: \"Montserrat_600SemiBold_Italic\",\r\n  700: \"Montserrat_700Bold_Italic\",\r\n  800: \"Montserrat_800ExtraBold_Italic\",\r\n  900: \"Montserrat_900Black_Italic\",\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { BorderSizes } from \"../types\";\r\n\r\nexport function useBorder(): BorderSizes {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.borderSize, [context.theme.borderSize]);\r\n}\r\n","import { DeepPartial, merge } from \"@impulse-ui-native/core\";\r\nimport {\r\n  createContext,\r\n  memo,\r\n  PropsWithChildren,\r\n  useContext,\r\n  useMemo,\r\n} from \"react\";\r\nimport { DarkTheme, LightTheme } from \"../theme\";\r\nimport {\r\n  AppTheme,\r\n  ColorScheme,\r\n  ComponentsThemes,\r\n  CustomComponentsTheme,\r\n  ThemeContextData,\r\n} from \"../types\";\r\n\r\nimport {\r\n  Montserrat_100Thin,\r\n  Montserrat_100Thin_Italic,\r\n  Montserrat_200ExtraLight,\r\n  Montserrat_200ExtraLight_Italic,\r\n  Montserrat_300Light,\r\n  Montserrat_300Light_Italic,\r\n  Montserrat_400Regular,\r\n  Montserrat_400Regular_Italic,\r\n  Montserrat_500Medium,\r\n  Montserrat_500Medium_Italic,\r\n  Montserrat_600SemiBold,\r\n  Montserrat_600SemiBold_Italic,\r\n  Montserrat_700Bold,\r\n  Montserrat_700Bold_Italic,\r\n  Montserrat_800ExtraBold,\r\n  Montserrat_800ExtraBold_Italic,\r\n  Montserrat_900Black,\r\n  Montserrat_900Black_Italic,\r\n  useFonts,\r\n} from \"@expo-google-fonts/montserrat\";\r\n\r\nconst ThemeContext = createContext<ThemeContextData | undefined>(undefined);\r\n\r\ninterface ThemeProviderProps {\r\n  scheme?: ColorScheme;\r\n  theme?: DeepPartial<{\r\n    light: AppTheme;\r\n    dark: AppTheme;\r\n  }>;\r\n  components?: CustomComponentsTheme;\r\n}\r\n\r\nexport const ThemeProvider = memo(function ThemeProvider(\r\n  props: PropsWithChildren<ThemeProviderProps>\r\n) {\r\n  const scheme = props.scheme ?? \"light\";\r\n\r\n  const [loaded] = useFonts({\r\n    Montserrat_100Thin,\r\n    Montserrat_100Thin_Italic,\r\n    Montserrat_200ExtraLight,\r\n    Montserrat_200ExtraLight_Italic,\r\n    Montserrat_300Light,\r\n    Montserrat_300Light_Italic,\r\n    Montserrat_400Regular,\r\n    Montserrat_400Regular_Italic,\r\n    Montserrat_500Medium,\r\n    Montserrat_500Medium_Italic,\r\n    Montserrat_600SemiBold,\r\n    Montserrat_600SemiBold_Italic,\r\n    Montserrat_700Bold,\r\n    Montserrat_700Bold_Italic,\r\n    Montserrat_800ExtraBold,\r\n    Montserrat_800ExtraBold_Italic,\r\n    Montserrat_900Black,\r\n    Montserrat_900Black_Italic,\r\n  });\r\n\r\n  const context = useMemo<ThemeContextData>(() => {\r\n    const baseTheme = scheme === \"light\" ? LightTheme : DarkTheme;\r\n    const customBaseTheme = props.theme?.[scheme];\r\n    const theme = merge(baseTheme, customBaseTheme);\r\n\r\n    let componentsTheme: DeepPartial<ComponentsThemes> | undefined;\r\n\r\n    if (typeof props.components === \"function\") {\r\n      componentsTheme = props.components(theme);\r\n    } else {\r\n      componentsTheme = props.components;\r\n    }\r\n\r\n    return {\r\n      loaded,\r\n      theme,\r\n      components: componentsTheme,\r\n    };\r\n  }, [props.theme?.light, props.theme?.dark, props.components]);\r\n\r\n  return (\r\n    <ThemeContext.Provider value={context}>\r\n      {props.children}\r\n    </ThemeContext.Provider>\r\n  );\r\n});\r\n\r\nexport function useThemeContext() {\r\n  const context = useContext(ThemeContext);\r\n\r\n  if (!context) {\r\n    throw new Error(\"useThemeContext must be used within a ThemeProvider\");\r\n  }\r\n\r\n  return context;\r\n}\r\n","import { BorderSizes, FontSizes, NeutralColors, Radii, Space } from \"../types\";\r\n\r\nexport const SpaceTokens: Space = {\r\n  none: 0,\r\n  auto: \"auto\",\r\n  xxs: 4,\r\n  xs: 8,\r\n  mxs: 12,\r\n  sm: 16,\r\n  msm: 24,\r\n  md: 32,\r\n  lg: 48,\r\n  xl: 64,\r\n  xxl: 96,\r\n};\r\n\r\nexport const BorderSizeTokens: BorderSizes = {\r\n  sm: 1,\r\n  md: 2,\r\n  lg: 3,\r\n  xl: 5,\r\n  xxl: 10,\r\n};\r\n\r\nexport const RadiiTokens: Radii = {\r\n  sm: 4,\r\n  md: 8,\r\n  lg: 16,\r\n  xl: 32,\r\n  xxl: 64,\r\n  xxxl: 128,\r\n  round: 100000,\r\n};\r\n\r\nexport const FontSizeTokens: FontSizes = {\r\n  xxs: 8,\r\n  xs: 12,\r\n  xsm: 14,\r\n  sm: 16,\r\n  md: 18,\r\n  lg: 20,\r\n  xl: 24,\r\n  xxl: 32,\r\n  xxxl: 40,\r\n  huge: 48,\r\n  massive: 56,\r\n};\r\n\r\nexport const NeutralColorTokens: NeutralColors = {\r\n  \"0\": \"#ffffff\",\r\n  \"1\": \"#f8f9fa\",\r\n  \"2\": \"#f1f3f5\",\r\n  \"3\": \"#e9ecef\",\r\n  \"4\": \"#dee2e6\",\r\n  \"5\": \"#ced4da\",\r\n  \"6\": \"#adb5bd\",\r\n  \"7\": \"#868e96\",\r\n  \"8\": \"#495057\",\r\n  \"9\": \"#343a40\",\r\n  \"10\": \"#212529\",\r\n  \"11\": \"#16191d\",\r\n  \"12\": \"#0d0f12\",\r\n  \"13\": \"#000000\",\r\n};\r\n","import { FontWeightsItalic, FontWeightsNormal } from \"../constants\";\r\nimport { AppTheme } from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontSizeTokens,\r\n  NeutralColorTokens,\r\n  RadiiTokens,\r\n  SpaceTokens,\r\n} from \"./tokens.theme\";\r\n\r\nexport const DarkTheme: AppTheme = {\r\n  colors: {\r\n    primary: \"#f55d6b\",\r\n    secondary: \"#f55d6b\",\r\n    neutral: NeutralColorTokens,\r\n    white: NeutralColorTokens[\"0\"],\r\n    black: NeutralColorTokens[\"13\"],\r\n    error: \"#c92a2a\",\r\n    warning: \"#e67700\",\r\n    success: \"#7a9908\",\r\n    info: \"#1864ab\",\r\n    text: {\r\n      primary: NeutralColorTokens[\"11\"],\r\n      secondary: NeutralColorTokens[\"10\"],\r\n    },\r\n    background: {\r\n      primary: NeutralColorTokens[\"2\"],\r\n      secondary: NeutralColorTokens[\"0\"],\r\n    },\r\n  },\r\n  spacing: SpaceTokens,\r\n  radii: RadiiTokens,\r\n  fontWeights: {\r\n    normal: FontWeightsNormal,\r\n    italic: FontWeightsItalic,\r\n  },\r\n  borderSize: BorderSizeTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { FontWeightsItalic, FontWeightsNormal } from \"../constants\";\r\nimport { AppTheme } from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontSizeTokens,\r\n  NeutralColorTokens,\r\n  RadiiTokens,\r\n  SpaceTokens,\r\n} from \"./tokens.theme\";\r\n\r\nexport const LightTheme: AppTheme = {\r\n  colors: {\r\n    primary: \"#f55d6b\",\r\n    secondary: \"#f55d6b\",\r\n    neutral: NeutralColorTokens,\r\n    white: NeutralColorTokens[\"0\"],\r\n    black: NeutralColorTokens[\"13\"],\r\n    error: \"#c92a2a\",\r\n    warning: \"#e67700\",\r\n    success: \"#7a9908\",\r\n    info: \"#1864ab\",\r\n    text: {\r\n      primary: NeutralColorTokens[\"11\"],\r\n      secondary: NeutralColorTokens[\"10\"],\r\n    },\r\n    background: {\r\n      primary: NeutralColorTokens[\"2\"],\r\n      secondary: NeutralColorTokens[\"0\"],\r\n    },\r\n  },\r\n  spacing: SpaceTokens,\r\n  radii: RadiiTokens,\r\n  fontWeights: {\r\n    normal: FontWeightsNormal,\r\n    italic: FontWeightsItalic,\r\n  },\r\n  borderSize: BorderSizeTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { ThemeColors } from \"../types\";\r\n\r\nexport function useColors(): ThemeColors {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.colors, [context.theme.colors]);\r\n}\r\n","import { DeepPartial } from \"@impulse-ui-native/core\";\r\nimport { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { ComponentsThemes } from \"../types\";\r\n\r\nexport function useComponentsTheme():\r\n  | DeepPartial<ComponentsThemes>\r\n  | undefined {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.components, [context.components]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { Radii } from \"../types\";\r\n\r\nexport function useRadii(): Radii {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.radii, [context.theme.radii]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { Space } from \"../types\";\r\n\r\nexport function useSpace(): Space {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.spacing, [context.theme.spacing]);\r\n}\r\n","import { useMemo } from 'react';\r\nimport { createStyleKey, extractStyleProps } from '../utils';\r\n\r\nexport function useStyleProps<Props extends object>(props: Props) {\r\n  const key = createStyleKey(props);\r\n\r\n  return useMemo(() => extractStyleProps(props), [key]);\r\n}\r\n","import { StylePropsSet } from '../constants';\r\nimport { StylePropKey, StyleProps } from '../types';\r\n\r\nconst isStylePropKey = (k: string): k is StylePropKey =>\r\n  StylePropsSet.has(k as StylePropKey);\r\n\r\nexport const extractStyleProps = <Props extends object>(\r\n  props: Props\r\n): StyleProps => {\r\n  const style: StyleProps = {};\r\n  \r\n  for (const k in props) {\r\n    if (isStylePropKey(k) && props[k] !== undefined) {\r\n      style[k] = props[k] as any;\r\n    }\r\n  }\r\n  \r\n  return style;\r\n};\r\n\r\nexport const createStyleKey = <Props extends object>(props: Props) => {\r\n  let key = '';\r\n\r\n  for (const k in props) {\r\n    if (isStylePropKey(k)) {\r\n      key += String(props[k as keyof Props]);\r\n    }\r\n  }\r\n  \r\n  return key;\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { AppTheme } from \"../types\";\r\n\r\nexport function useTheme(): AppTheme {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme, [context.theme]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { StyleSheet } from \"react-native\";\r\nimport { AppTheme } from \"../types\";\r\nimport { useTheme } from \"./use-theme.hook\";\r\n\r\ntype ThemedStyles<T extends StyleSheet.NamedStyles<T>> = T;\r\n\r\ntype StyledFunction<\r\n  Props extends object,\r\n  T extends StyleSheet.NamedStyles<T>\r\n> = (theme: AppTheme, props: Props) => ThemedStyles<T>;\r\n\r\nexport const useThemedStyles = <\r\n  Props extends object,\r\n  T extends StyleSheet.NamedStyles<T>\r\n>(\r\n  styledFunction: StyledFunction<Props, T>,\r\n  props: Props\r\n): ThemedStyles<T> => {\r\n  const theme = useTheme();\r\n\r\n  return useMemo(() => styledFunction(theme, props), [theme, props]);\r\n};\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEO,IAAM,gBAAgB,oBAAI,IAAsB;AAAA;AAAA,EAErD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;;;AC7EM,IAAM,oBAA6D;AAAA,EACxE,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACP;AAEO,IAAM,oBAA6D;AAAA,EACxE,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACP;;;ACxBA,IAAAA,gBAAwB;;;ACAxB,kBAAmC;AACnC,mBAMO;;;ACLA,IAAM,cAAqB;AAAA,EAChC,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,KAAK;AACP;AAEO,IAAM,mBAAgC;AAAA,EAC3C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,KAAK;AACP;AAEO,IAAM,cAAqB;AAAA,EAChC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,MAAM;AAAA,EACN,OAAO;AACT;AAEO,IAAM,iBAA4B;AAAA,EACvC,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AAAA,EACN,SAAS;AACX;AAEO,IAAM,qBAAoC;AAAA,EAC/C,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AACR;;;ACrDO,IAAM,YAAsB;AAAA,EACjC,QAAQ;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,IACX,SAAS;AAAA,IACT,OAAO,mBAAmB,GAAG;AAAA,IAC7B,OAAO,mBAAmB,IAAI;AAAA,IAC9B,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,MACJ,SAAS,mBAAmB,IAAI;AAAA,MAChC,WAAW,mBAAmB,IAAI;AAAA,IACpC;AAAA,IACA,YAAY;AAAA,MACV,SAAS,mBAAmB,GAAG;AAAA,MAC/B,WAAW,mBAAmB,GAAG;AAAA,IACnC;AAAA,EACF;AAAA,EACA,SAAS;AAAA,EACT,OAAO;AAAA,EACP,aAAa;AAAA,IACX,QAAQ;AAAA,IACR,QAAQ;AAAA,EACV;AAAA,EACA,YAAY;AAAA,EACZ,UAAU;AACZ;;;AC5BO,IAAM,aAAuB;AAAA,EAClC,QAAQ;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,IACX,SAAS;AAAA,IACT,OAAO,mBAAmB,GAAG;AAAA,IAC7B,OAAO,mBAAmB,IAAI;AAAA,IAC9B,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,MACJ,SAAS,mBAAmB,IAAI;AAAA,MAChC,WAAW,mBAAmB,IAAI;AAAA,IACpC;AAAA,IACA,YAAY;AAAA,MACV,SAAS,mBAAmB,GAAG;AAAA,MAC/B,WAAW,mBAAmB,GAAG;AAAA,IACnC;AAAA,EACF;AAAA,EACA,SAAS;AAAA,EACT,OAAO;AAAA,EACP,aAAa;AAAA,IACX,QAAQ;AAAA,IACR,QAAQ;AAAA,EACV;AAAA,EACA,YAAY;AAAA,EACZ,UAAU;AACZ;;;AHrBA,wBAoBO;AAEP,IAAM,mBAAe,4BAA4C,MAAS;AAWnE,IAAM,oBAAgB,mBAAK,SAASC,eACzC,OACA;AACA,QAAM,SAAS,MAAM,UAAU;AAE/B,QAAM,CAAC,MAAM,QAAI,4BAAS;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,cAAU,sBAA0B,MAAM;AAC9C,UAAM,YAAY,WAAW,UAAU,aAAa;AACpD,UAAM,kBAAkB,MAAM,QAAQ,MAAM;AAC5C,UAAM,YAAQ,mBAAM,WAAW,eAAe;AAE9C,QAAI;AAEJ,QAAI,OAAO,MAAM,eAAe,YAAY;AAC1C,wBAAkB,MAAM,WAAW,KAAK;AAAA,IAC1C,OAAO;AACL,wBAAkB,MAAM;AAAA,IAC1B;AAEA,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,YAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,MAAM,OAAO,OAAO,MAAM,OAAO,MAAM,MAAM,UAAU,CAAC;AAE5D,SACE,oCAAC,aAAa,UAAb,EAAsB,OAAO,WAC3B,MAAM,QACT;AAEJ,CAAC;AAEM,SAAS,kBAAkB;AAChC,QAAM,cAAU,yBAAW,YAAY;AAEvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AAEA,SAAO;AACT;;;AD3GO,SAAS,YAAyB;AACvC,QAAM,UAAU,gBAAgB;AAEhC,aAAO,uBAAQ,MAAM,QAAQ,MAAM,YAAY,CAAC,QAAQ,MAAM,UAAU,CAAC;AAC3E;;;AKRA,IAAAC,gBAAwB;AAIjB,SAAS,YAAyB;AACvC,QAAM,UAAU,gBAAgB;AAEhC,aAAO,uBAAQ,MAAM,QAAQ,MAAM,QAAQ,CAAC,QAAQ,MAAM,MAAM,CAAC;AACnE;;;ACPA,IAAAC,gBAAwB;AAIjB,SAAS,qBAEF;AACZ,QAAM,UAAU,gBAAgB;AAEhC,aAAO,uBAAQ,MAAM,QAAQ,YAAY,CAAC,QAAQ,UAAU,CAAC;AAC/D;;;ACXA,IAAAC,gBAAwB;AAIjB,SAAS,WAAkB;AAChC,QAAM,UAAU,gBAAgB;AAEhC,aAAO,uBAAQ,MAAM,QAAQ,MAAM,OAAO,CAAC,QAAQ,MAAM,KAAK,CAAC;AACjE;;;ACRA,IAAAC,gBAAwB;AAIjB,SAAS,WAAkB;AAChC,QAAM,UAAU,gBAAgB;AAEhC,aAAO,uBAAQ,MAAM,QAAQ,MAAM,SAAS,CAAC,QAAQ,MAAM,OAAO,CAAC;AACrE;;;ACRA,IAAAC,gBAAwB;;;ACGxB,IAAM,iBAAiB,CAAC,MACtB,cAAc,IAAI,CAAiB;AAE9B,IAAM,oBAAoB,CAC/B,UACe;AACf,QAAM,QAAoB,CAAC;AAE3B,aAAW,KAAK,OAAO;AACrB,QAAI,eAAe,CAAC,KAAK,MAAM,CAAC,MAAM,QAAW;AAC/C,YAAM,CAAC,IAAI,MAAM,CAAC;AAAA,IACpB;AAAA,EACF;AAEA,SAAO;AACT;AAEO,IAAM,iBAAiB,CAAuB,UAAiB;AACpE,MAAI,MAAM;AAEV,aAAW,KAAK,OAAO;AACrB,QAAI,eAAe,CAAC,GAAG;AACrB,aAAO,OAAO,MAAM,CAAgB,CAAC;AAAA,IACvC;AAAA,EACF;AAEA,SAAO;AACT;;;AD3BO,SAAS,cAAoC,OAAc;AAChE,QAAM,MAAM,eAAe,KAAK;AAEhC,aAAO,uBAAQ,MAAM,kBAAkB,KAAK,GAAG,CAAC,GAAG,CAAC;AACtD;;;AEPA,IAAAC,gBAAwB;AAIjB,SAAS,WAAqB;AACnC,QAAM,UAAU,gBAAgB;AAEhC,aAAO,uBAAQ,MAAM,QAAQ,OAAO,CAAC,QAAQ,KAAK,CAAC;AACrD;;;ACRA,IAAAC,gBAAwB;AAYjB,IAAM,kBAAkB,CAI7B,gBACA,UACoB;AACpB,QAAM,QAAQ,SAAS;AAEvB,aAAO,uBAAQ,MAAM,eAAe,OAAO,KAAK,GAAG,CAAC,OAAO,KAAK,CAAC;AACnE;","names":["import_react","ThemeProvider","import_react","import_react","import_react","import_react","import_react","import_react","import_react"]}

package/dist/index.d.mts

@@ -124,6 +124,7 @@ type NeutralColors = Record<NeutralColorKey, string>;
 interface ThemeContextData {
     loaded: boolean;
     theme: AppTheme;
+    components?: DeepPartial<ComponentsThemes>;
 }
 type ColorScheme = "light" | "dark";
 type ThemeColors = {
@@ -155,14 +156,20 @@ interface AppTheme {
     spacing: Space;
     radii: Radii;
     borderSize: BorderSizes;
+    fontWeights: Record<"normal" | "italic", Record<FontWeightKey, string>>;
     fontSize: FontSizes;
-    components?: DeepPartial<ComponentsThemes>;
 }
+type CustomComponentsTheme = ((theme: AppTheme) => DeepPartial<ComponentsThemes>) | DeepPartial<ComponentsThemes>;
+
+declare const FontWeightsNormal: Record<FontWeightKey, FontWeightNormal>;
+declare const FontWeightsItalic: Record<FontWeightKey, FontWeightItalic>;
 
 declare function useBorder(): BorderSizes;
 
 declare function useColors(): ThemeColors;
 
+declare function useComponentsTheme(): DeepPartial<ComponentsThemes> | undefined;
+
 declare function useRadii(): Radii;
 
 declare function useSpace(): Space;
@@ -176,20 +183,27 @@ type StyledFunction<Props extends object, T extends StyleSheet.NamedStyles<T>> =
 declare const useThemedStyles: <Props extends object, T extends StyleSheet.NamedStyles<T>>(styledFunction: StyledFunction<Props, T>, props: Props) => ThemedStyles<T>;
 
 interface ThemeProviderProps {
-    scheme: ColorScheme;
-    theme: {
+    scheme?: ColorScheme;
+    theme?: DeepPartial<{
         light: AppTheme;
         dark: AppTheme;
-    };
+    }>;
+    components?: CustomComponentsTheme;
 }
-declare const ThemeProvider: react.NamedExoticComponent<PropsWithChildren<DeepPartial<ThemeProviderProps>>>;
+declare const ThemeProvider: react.NamedExoticComponent<PropsWithChildren<ThemeProviderProps>>;
 declare function useThemeContext(): ThemeContextData;
 
 declare const DarkTheme: AppTheme;
 
 declare const LightTheme: AppTheme;
 
+declare const SpaceTokens: Space;
+declare const BorderSizeTokens: BorderSizes;
+declare const RadiiTokens: Radii;
+declare const FontSizeTokens: FontSizes;
+declare const NeutralColorTokens: NeutralColors;
+
 declare const extractStyleProps: <Props extends object>(props: Props) => StyleProps;
 declare const createStyleKey: <Props extends object>(props: Props) => string;
 
-export { type AppTheme, type BorderProps, type BorderSizeKey, type BorderSizes, type ColorProps, type ColorScheme, type ComponentSize, type ComponentsThemes, DarkTheme, type DimensionProps, type ExtendedThemeColors, type FlexProps, type FontSizes, type FontSizesKeys, type FontWeightItalic, type FontWeightKey, type FontWeightNormal, type LetterSpacingKey, type LetterSpacings, LightTheme, type LineHeightKeys, type LineHeights, type NeutralColorKey, type NeutralColors, type Radii, type RadiiBlob, type RadiiConditional, type RadiiDrawn, type RadiusBlobKey, type RadiusConditionalKey, type RadiusDrawnKey, type RadiusKey, type ShadowProps, type Space, type SpaceSizesKeys, type SpacingProps, type StylePropKey, type StyleProps, StylePropsSet, type ThemeColors, type ThemeContextData, ThemeProvider, type TypographyPresetKey, type TypographyProps, createStyleKey, extractStyleProps, useBorder, useColors, useRadii, useSpace, useStyleProps, useTheme, useThemeContext, useThemedStyles };
+export { type AppTheme, type BorderProps, type BorderSizeKey, BorderSizeTokens, type BorderSizes, type ColorProps, type ColorScheme, type ComponentSize, type ComponentsThemes, type CustomComponentsTheme, DarkTheme, type DimensionProps, type ExtendedThemeColors, type FlexProps, FontSizeTokens, type FontSizes, type FontSizesKeys, type FontWeightItalic, type FontWeightKey, type FontWeightNormal, FontWeightsItalic, FontWeightsNormal, type LetterSpacingKey, type LetterSpacings, LightTheme, type LineHeightKeys, type LineHeights, type NeutralColorKey, NeutralColorTokens, type NeutralColors, type Radii, type RadiiBlob, type RadiiConditional, type RadiiDrawn, RadiiTokens, type RadiusBlobKey, type RadiusConditionalKey, type RadiusDrawnKey, type RadiusKey, type ShadowProps, type Space, type SpaceSizesKeys, SpaceTokens, type SpacingProps, type StylePropKey, type StyleProps, StylePropsSet, type ThemeColors, type ThemeContextData, ThemeProvider, type TypographyPresetKey, type TypographyProps, createStyleKey, extractStyleProps, useBorder, useColors, useComponentsTheme, useRadii, useSpace, useStyleProps, useTheme, useThemeContext, useThemedStyles };

package/dist/index.d.ts

@@ -124,6 +124,7 @@ type NeutralColors = Record<NeutralColorKey, string>;
 interface ThemeContextData {
     loaded: boolean;
     theme: AppTheme;
+    components?: DeepPartial<ComponentsThemes>;
 }
 type ColorScheme = "light" | "dark";
 type ThemeColors = {
@@ -155,14 +156,20 @@ interface AppTheme {
     spacing: Space;
     radii: Radii;
     borderSize: BorderSizes;
+    fontWeights: Record<"normal" | "italic", Record<FontWeightKey, string>>;
     fontSize: FontSizes;
-    components?: DeepPartial<ComponentsThemes>;
 }
+type CustomComponentsTheme = ((theme: AppTheme) => DeepPartial<ComponentsThemes>) | DeepPartial<ComponentsThemes>;
+
+declare const FontWeightsNormal: Record<FontWeightKey, FontWeightNormal>;
+declare const FontWeightsItalic: Record<FontWeightKey, FontWeightItalic>;
 
 declare function useBorder(): BorderSizes;
 
 declare function useColors(): ThemeColors;
 
+declare function useComponentsTheme(): DeepPartial<ComponentsThemes> | undefined;
+
 declare function useRadii(): Radii;
 
 declare function useSpace(): Space;
@@ -176,20 +183,27 @@ type StyledFunction<Props extends object, T extends StyleSheet.NamedStyles<T>> =
 declare const useThemedStyles: <Props extends object, T extends StyleSheet.NamedStyles<T>>(styledFunction: StyledFunction<Props, T>, props: Props) => ThemedStyles<T>;
 
 interface ThemeProviderProps {
-    scheme: ColorScheme;
-    theme: {
+    scheme?: ColorScheme;
+    theme?: DeepPartial<{
         light: AppTheme;
         dark: AppTheme;
-    };
+    }>;
+    components?: CustomComponentsTheme;
 }
-declare const ThemeProvider: react.NamedExoticComponent<PropsWithChildren<DeepPartial<ThemeProviderProps>>>;
+declare const ThemeProvider: react.NamedExoticComponent<PropsWithChildren<ThemeProviderProps>>;
 declare function useThemeContext(): ThemeContextData;
 
 declare const DarkTheme: AppTheme;
 
 declare const LightTheme: AppTheme;
 
+declare const SpaceTokens: Space;
+declare const BorderSizeTokens: BorderSizes;
+declare const RadiiTokens: Radii;
+declare const FontSizeTokens: FontSizes;
+declare const NeutralColorTokens: NeutralColors;
+
 declare const extractStyleProps: <Props extends object>(props: Props) => StyleProps;
 declare const createStyleKey: <Props extends object>(props: Props) => string;
 
-export { type AppTheme, type BorderProps, type BorderSizeKey, type BorderSizes, type ColorProps, type ColorScheme, type ComponentSize, type ComponentsThemes, DarkTheme, type DimensionProps, type ExtendedThemeColors, type FlexProps, type FontSizes, type FontSizesKeys, type FontWeightItalic, type FontWeightKey, type FontWeightNormal, type LetterSpacingKey, type LetterSpacings, LightTheme, type LineHeightKeys, type LineHeights, type NeutralColorKey, type NeutralColors, type Radii, type RadiiBlob, type RadiiConditional, type RadiiDrawn, type RadiusBlobKey, type RadiusConditionalKey, type RadiusDrawnKey, type RadiusKey, type ShadowProps, type Space, type SpaceSizesKeys, type SpacingProps, type StylePropKey, type StyleProps, StylePropsSet, type ThemeColors, type ThemeContextData, ThemeProvider, type TypographyPresetKey, type TypographyProps, createStyleKey, extractStyleProps, useBorder, useColors, useRadii, useSpace, useStyleProps, useTheme, useThemeContext, useThemedStyles };
+export { type AppTheme, type BorderProps, type BorderSizeKey, BorderSizeTokens, type BorderSizes, type ColorProps, type ColorScheme, type ComponentSize, type ComponentsThemes, type CustomComponentsTheme, DarkTheme, type DimensionProps, type ExtendedThemeColors, type FlexProps, FontSizeTokens, type FontSizes, type FontSizesKeys, type FontWeightItalic, type FontWeightKey, type FontWeightNormal, FontWeightsItalic, FontWeightsNormal, type LetterSpacingKey, type LetterSpacings, LightTheme, type LineHeightKeys, type LineHeights, type NeutralColorKey, NeutralColorTokens, type NeutralColors, type Radii, type RadiiBlob, type RadiiConditional, type RadiiDrawn, RadiiTokens, type RadiusBlobKey, type RadiusConditionalKey, type RadiusDrawnKey, type RadiusKey, type ShadowProps, type Space, type SpaceSizesKeys, SpaceTokens, type SpacingProps, type StylePropKey, type StyleProps, StylePropsSet, type ThemeColors, type ThemeContextData, ThemeProvider, type TypographyPresetKey, type TypographyProps, createStyleKey, extractStyleProps, useBorder, useColors, useComponentsTheme, useRadii, useSpace, useStyleProps, useTheme, useThemeContext, useThemedStyles };

package/dist/index.esm.js

@@ -73,6 +73,30 @@ var StylePropsSet = /* @__PURE__ */ new Set([
   "aspectRatio"
 ]);
 
+// src/constants/typography.constants.ts
+var FontWeightsNormal = {
+  100: "Montserrat_100Thin",
+  200: "Montserrat_200ExtraLight",
+  300: "Montserrat_300Light",
+  400: "Montserrat_400Regular",
+  500: "Montserrat_500Medium",
+  600: "Montserrat_600SemiBold",
+  700: "Montserrat_700Bold",
+  800: "Montserrat_800ExtraBold",
+  900: "Montserrat_900Black"
+};
+var FontWeightsItalic = {
+  100: "Montserrat_100Thin_Italic",
+  200: "Montserrat_200ExtraLight_Italic",
+  300: "Montserrat_300Light_Italic",
+  400: "Montserrat_400Regular_Italic",
+  500: "Montserrat_500Medium_Italic",
+  600: "Montserrat_600SemiBold_Italic",
+  700: "Montserrat_700Bold_Italic",
+  800: "Montserrat_800ExtraBold_Italic",
+  900: "Montserrat_900Black_Italic"
+};
+
 // src/hooks/use-border.hook.ts
 import { useMemo as useMemo2 } from "react";
 
@@ -168,6 +192,10 @@ var DarkTheme = {
   },
   spacing: SpaceTokens,
   radii: RadiiTokens,
+  fontWeights: {
+    normal: FontWeightsNormal,
+    italic: FontWeightsItalic
+  },
   borderSize: BorderSizeTokens,
   fontSize: FontSizeTokens
 };
@@ -195,6 +223,10 @@ var LightTheme = {
   },
   spacing: SpaceTokens,
   radii: RadiiTokens,
+  fontWeights: {
+    normal: FontWeightsNormal,
+    italic: FontWeightsItalic
+  },
   borderSize: BorderSizeTokens,
   fontSize: FontSizeTokens
 };
@@ -246,11 +278,20 @@ var ThemeProvider = memo(function ThemeProvider2(props) {
   });
   const context = useMemo(() => {
     const baseTheme = scheme === "light" ? LightTheme : DarkTheme;
+    const customBaseTheme = props.theme?.[scheme];
+    const theme = merge(baseTheme, customBaseTheme);
+    let componentsTheme;
+    if (typeof props.components === "function") {
+      componentsTheme = props.components(theme);
+    } else {
+      componentsTheme = props.components;
+    }
     return {
       loaded,
-      theme: merge(baseTheme, props.theme?.[scheme])
+      theme,
+      components: componentsTheme
     };
-  }, [props.theme?.light, props.theme?.dark]);
+  }, [props.theme?.light, props.theme?.dark, props.components]);
   return /* @__PURE__ */ React.createElement(ThemeContext.Provider, { value: context }, props.children);
 });
 function useThemeContext() {
@@ -274,22 +315,29 @@ function useColors() {
   return useMemo3(() => context.theme.colors, [context.theme.colors]);
 }
 
-// src/hooks/use-radii.hook.ts
+// src/hooks/use-components-theme.hook.ts
 import { useMemo as useMemo4 } from "react";
+function useComponentsTheme() {
+  const context = useThemeContext();
+  return useMemo4(() => context.components, [context.components]);
+}
+
+// src/hooks/use-radii.hook.ts
+import { useMemo as useMemo5 } from "react";
 function useRadii() {
   const context = useThemeContext();
-  return useMemo4(() => context.theme.radii, [context.theme.radii]);
+  return useMemo5(() => context.theme.radii, [context.theme.radii]);
 }
 
 // src/hooks/use-space.hook.ts
-import { useMemo as useMemo5 } from "react";
+import { useMemo as useMemo6 } from "react";
 function useSpace() {
   const context = useThemeContext();
-  return useMemo5(() => context.theme.spacing, [context.theme.spacing]);
+  return useMemo6(() => context.theme.spacing, [context.theme.spacing]);
 }
 
 // src/hooks/use-style-props.hook.ts
-import { useMemo as useMemo6 } from "react";
+import { useMemo as useMemo7 } from "react";
 
 // src/utils/style.utils.ts
 var isStylePropKey = (k) => StylePropsSet.has(k);
@@ -315,31 +363,39 @@ var createStyleKey = (props) => {
 // src/hooks/use-style-props.hook.ts
 function useStyleProps(props) {
   const key = createStyleKey(props);
-  return useMemo6(() => extractStyleProps(props), [key]);
+  return useMemo7(() => extractStyleProps(props), [key]);
 }
 
 // src/hooks/use-theme.hook.ts
-import { useMemo as useMemo7 } from "react";
+import { useMemo as useMemo8 } from "react";
 function useTheme() {
   const context = useThemeContext();
-  return useMemo7(() => context.theme, [context.theme]);
+  return useMemo8(() => context.theme, [context.theme]);
 }
 
 // src/hooks/use-themed-styles.ts
-import { useMemo as useMemo8 } from "react";
+import { useMemo as useMemo9 } from "react";
 var useThemedStyles = (styledFunction, props) => {
   const theme = useTheme();
-  return useMemo8(() => styledFunction(theme, props), [theme, props]);
+  return useMemo9(() => styledFunction(theme, props), [theme, props]);
 };
 export {
+  BorderSizeTokens,
   DarkTheme,
+  FontSizeTokens,
+  FontWeightsItalic,
+  FontWeightsNormal,
   LightTheme,
+  NeutralColorTokens,
+  RadiiTokens,
+  SpaceTokens,
   StylePropsSet,
   ThemeProvider,
   createStyleKey,
   extractStyleProps,
   useBorder,
   useColors,
+  useComponentsTheme,
   useRadii,
   useSpace,
   useStyleProps,

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/constants/style.constants.ts","../src/hooks/use-border.hook.ts","../src/providers/theme.provider.tsx","../src/theme/tokens.theme.ts","../src/theme/dark.theme.ts","../src/theme/light.theme.ts","../src/hooks/use-colors.hook.ts","../src/hooks/use-radii.hook.ts","../src/hooks/use-space.hook.ts","../src/hooks/use-style-props.hook.ts","../src/utils/style.utils.ts","../src/hooks/use-theme.hook.ts","../src/hooks/use-themed-styles.ts"],"sourcesContent":["import { StyleProps } from \"../types\";\r\n\r\nexport const StylePropsSet = new Set<keyof StyleProps>([\r\n  // Spacing\r\n  \"margin\",\r\n  \"marginTop\",\r\n  \"marginBottom\",\r\n  \"marginLeft\",\r\n  \"marginRight\",\r\n  \"marginHorizontal\",\r\n  \"marginVertical\",\r\n  \"padding\",\r\n  \"paddingTop\",\r\n  \"paddingBottom\",\r\n  \"paddingLeft\",\r\n  \"paddingRight\",\r\n  \"paddingHorizontal\",\r\n  \"paddingVertical\",\r\n\r\n  // Appearance\r\n  \"color\",\r\n  \"backgroundColor\",\r\n  \"opacity\",\r\n  \"borderRadius\",\r\n  \"borderColor\",\r\n  \"borderWidth\",\r\n  \"borderStyle\",\r\n  \"shadowColor\",\r\n  \"shadowOpacity\",\r\n  \"shadowRadius\",\r\n  \"shadowOffset\",\r\n  \"elevation\",\r\n\r\n  // Typography (TextStyle)\r\n  \"fontSize\",\r\n  \"fontFamily\",\r\n  \"fontWeight\",\r\n  \"fontStyle\",\r\n  \"letterSpacing\",\r\n  \"lineHeight\",\r\n  \"textAlign\",\r\n  \"textDecorationLine\",\r\n  \"textDecorationStyle\",\r\n  \"textDecorationColor\",\r\n  \"textTransform\",\r\n  \"includeFontPadding\",\r\n  \"textAlignVertical\",\r\n  \"writingDirection\",\r\n\r\n  // Flex (ViewStyle)\r\n  \"flex\",\r\n  \"flexGrow\",\r\n  \"flexShrink\",\r\n  \"flexBasis\",\r\n  \"flexDirection\",\r\n  \"flexWrap\",\r\n  \"justifyContent\",\r\n  \"alignItems\",\r\n  \"alignSelf\",\r\n  \"alignContent\",\r\n  \"gap\",\r\n  \"rowGap\",\r\n  \"columnGap\",\r\n\r\n  // Positioning (commonly used with flex layouts)\r\n  \"position\",\r\n  \"top\",\r\n  \"right\",\r\n  \"bottom\",\r\n  \"left\",\r\n\r\n  // Dimensions (ViewStyle)\r\n  \"width\",\r\n  \"height\",\r\n  \"minWidth\",\r\n  \"maxWidth\",\r\n  \"minHeight\",\r\n  \"maxHeight\",\r\n  \"aspectRatio\",\r\n]);\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { BorderSizes } from \"../types\";\r\n\r\nexport function useBorder(): BorderSizes {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.borderSize, [context.theme.borderSize]);\r\n}\r\n","import { DeepPartial, merge } from \"@impulse-ui-native/core\";\r\nimport {\r\n  createContext,\r\n  memo,\r\n  PropsWithChildren,\r\n  useContext,\r\n  useMemo,\r\n} from \"react\";\r\nimport { DarkTheme, LightTheme } from \"../theme\";\r\nimport { AppTheme, ColorScheme, ThemeContextData } from \"../types\";\r\n\r\nimport {\r\n  Montserrat_100Thin,\r\n  Montserrat_100Thin_Italic,\r\n  Montserrat_200ExtraLight,\r\n  Montserrat_200ExtraLight_Italic,\r\n  Montserrat_300Light,\r\n  Montserrat_300Light_Italic,\r\n  Montserrat_400Regular,\r\n  Montserrat_400Regular_Italic,\r\n  Montserrat_500Medium,\r\n  Montserrat_500Medium_Italic,\r\n  Montserrat_600SemiBold,\r\n  Montserrat_600SemiBold_Italic,\r\n  Montserrat_700Bold,\r\n  Montserrat_700Bold_Italic,\r\n  Montserrat_800ExtraBold,\r\n  Montserrat_800ExtraBold_Italic,\r\n  Montserrat_900Black,\r\n  Montserrat_900Black_Italic,\r\n  useFonts,\r\n} from \"@expo-google-fonts/montserrat\";\r\n\r\nconst ThemeContext = createContext<ThemeContextData | undefined>(undefined);\r\n\r\ninterface ThemeProviderProps {\r\n  scheme: ColorScheme;\r\n  theme: {\r\n    light: AppTheme;\r\n    dark: AppTheme;\r\n  };\r\n}\r\n\r\nexport const ThemeProvider = memo(function ThemeProvider(\r\n  props: PropsWithChildren<DeepPartial<ThemeProviderProps>>\r\n) {\r\n  const scheme = props.scheme ?? \"light\";\r\n\r\n  const [loaded] = useFonts({\r\n    Montserrat_100Thin,\r\n    Montserrat_100Thin_Italic,\r\n    Montserrat_200ExtraLight,\r\n    Montserrat_200ExtraLight_Italic,\r\n    Montserrat_300Light,\r\n    Montserrat_300Light_Italic,\r\n    Montserrat_400Regular,\r\n    Montserrat_400Regular_Italic,\r\n    Montserrat_500Medium,\r\n    Montserrat_500Medium_Italic,\r\n    Montserrat_600SemiBold,\r\n    Montserrat_600SemiBold_Italic,\r\n    Montserrat_700Bold,\r\n    Montserrat_700Bold_Italic,\r\n    Montserrat_800ExtraBold,\r\n    Montserrat_800ExtraBold_Italic,\r\n    Montserrat_900Black,\r\n    Montserrat_900Black_Italic,\r\n  });\r\n\r\n  const context = useMemo<ThemeContextData>(() => {\r\n    const baseTheme = scheme === \"light\" ? LightTheme : DarkTheme;\r\n\r\n    return {\r\n      loaded,\r\n      theme: merge(baseTheme, props.theme?.[scheme]),\r\n    };\r\n  }, [props.theme?.light, props.theme?.dark]);\r\n\r\n  return (\r\n    <ThemeContext.Provider value={context}>\r\n      {props.children}\r\n    </ThemeContext.Provider>\r\n  );\r\n});\r\n\r\nexport function useThemeContext() {\r\n  const context = useContext(ThemeContext);\r\n\r\n  if (!context) {\r\n    throw new Error(\"useThemeContext must be used within a ThemeProvider\");\r\n  }\r\n\r\n  return context;\r\n}\r\n","import { BorderSizes, FontSizes, NeutralColors, Radii, Space } from \"../types\";\r\n\r\nexport const SpaceTokens: Space = {\r\n  none: 0,\r\n  auto: \"auto\",\r\n  xxs: 4,\r\n  xs: 8,\r\n  mxs: 12,\r\n  sm: 16,\r\n  msm: 24,\r\n  md: 32,\r\n  lg: 48,\r\n  xl: 64,\r\n  xxl: 96,\r\n};\r\n\r\nexport const BorderSizeTokens: BorderSizes = {\r\n  sm: 1,\r\n  md: 2,\r\n  lg: 3,\r\n  xl: 5,\r\n  xxl: 10,\r\n};\r\n\r\nexport const RadiiTokens: Radii = {\r\n  sm: 4,\r\n  md: 8,\r\n  lg: 16,\r\n  xl: 32,\r\n  xxl: 64,\r\n  xxxl: 128,\r\n  round: 100000,\r\n};\r\n\r\nexport const FontSizeTokens: FontSizes = {\r\n  xxs: 8,\r\n  xs: 12,\r\n  xsm: 14,\r\n  sm: 16,\r\n  md: 18,\r\n  lg: 20,\r\n  xl: 24,\r\n  xxl: 32,\r\n  xxxl: 40,\r\n  huge: 48,\r\n  massive: 56,\r\n};\r\n\r\nexport const NeutralColorTokens: NeutralColors = {\r\n  \"0\": \"#ffffff\",\r\n  \"1\": \"#f8f9fa\",\r\n  \"2\": \"#f1f3f5\",\r\n  \"3\": \"#e9ecef\",\r\n  \"4\": \"#dee2e6\",\r\n  \"5\": \"#ced4da\",\r\n  \"6\": \"#adb5bd\",\r\n  \"7\": \"#868e96\",\r\n  \"8\": \"#495057\",\r\n  \"9\": \"#343a40\",\r\n  \"10\": \"#212529\",\r\n  \"11\": \"#16191d\",\r\n  \"12\": \"#0d0f12\",\r\n  \"13\": \"#000000\",\r\n};\r\n","import { AppTheme } from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontSizeTokens,\r\n  NeutralColorTokens,\r\n  RadiiTokens,\r\n  SpaceTokens,\r\n} from \"./tokens.theme\";\r\n\r\nexport const DarkTheme: AppTheme = {\r\n  colors: {\r\n    primary: \"#f55d6b\",\r\n    secondary: \"#f55d6b\",\r\n    neutral: NeutralColorTokens,\r\n    white: NeutralColorTokens[\"0\"],\r\n    black: NeutralColorTokens[\"13\"],\r\n    error: \"#c92a2a\",\r\n    warning: \"#e67700\",\r\n    success: \"#7a9908\",\r\n    info: \"#1864ab\",\r\n    text: {\r\n      primary: NeutralColorTokens[\"11\"],\r\n      secondary: NeutralColorTokens[\"10\"],\r\n    },\r\n    background: {\r\n      primary: NeutralColorTokens[\"2\"],\r\n      secondary: NeutralColorTokens[\"0\"],\r\n    },\r\n  },\r\n  spacing: SpaceTokens,\r\n  radii: RadiiTokens,\r\n  borderSize: BorderSizeTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { AppTheme } from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontSizeTokens,\r\n  NeutralColorTokens,\r\n  RadiiTokens,\r\n  SpaceTokens,\r\n} from \"./tokens.theme\";\r\n\r\nexport const LightTheme: AppTheme = {\r\n  colors: {\r\n    primary: \"#f55d6b\",\r\n    secondary: \"#f55d6b\",\r\n    neutral: NeutralColorTokens,\r\n    white: NeutralColorTokens[\"0\"],\r\n    black: NeutralColorTokens[\"13\"],\r\n    error: \"#c92a2a\",\r\n    warning: \"#e67700\",\r\n    success: \"#7a9908\",\r\n    info: \"#1864ab\",\r\n    text: {\r\n      primary: NeutralColorTokens[\"11\"],\r\n      secondary: NeutralColorTokens[\"10\"],\r\n    },\r\n    background: {\r\n      primary: NeutralColorTokens[\"2\"],\r\n      secondary: NeutralColorTokens[\"0\"],\r\n    },\r\n  },\r\n  spacing: SpaceTokens,\r\n  radii: RadiiTokens,\r\n  borderSize: BorderSizeTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { ThemeColors } from \"../types\";\r\n\r\nexport function useColors(): ThemeColors {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.colors, [context.theme.colors]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { Radii } from \"../types\";\r\n\r\nexport function useRadii(): Radii {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.radii, [context.theme.radii]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { Space } from \"../types\";\r\n\r\nexport function useSpace(): Space {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.spacing, [context.theme.spacing]);\r\n}\r\n","import { useMemo } from 'react';\r\nimport { createStyleKey, extractStyleProps } from '../utils';\r\n\r\nexport function useStyleProps<Props extends object>(props: Props) {\r\n  const key = createStyleKey(props);\r\n\r\n  return useMemo(() => extractStyleProps(props), [key]);\r\n}\r\n","import { StylePropsSet } from '../constants';\r\nimport { StylePropKey, StyleProps } from '../types';\r\n\r\nconst isStylePropKey = (k: string): k is StylePropKey =>\r\n  StylePropsSet.has(k as StylePropKey);\r\n\r\nexport const extractStyleProps = <Props extends object>(\r\n  props: Props\r\n): StyleProps => {\r\n  const style: StyleProps = {};\r\n  \r\n  for (const k in props) {\r\n    if (isStylePropKey(k) && props[k] !== undefined) {\r\n      style[k] = props[k] as any;\r\n    }\r\n  }\r\n  \r\n  return style;\r\n};\r\n\r\nexport const createStyleKey = <Props extends object>(props: Props) => {\r\n  let key = '';\r\n\r\n  for (const k in props) {\r\n    if (isStylePropKey(k)) {\r\n      key += String(props[k as keyof Props]);\r\n    }\r\n  }\r\n  \r\n  return key;\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { AppTheme } from \"../types\";\r\n\r\nexport function useTheme(): AppTheme {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme, [context.theme]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { StyleSheet } from \"react-native\";\r\nimport { AppTheme } from \"../types\";\r\nimport { useTheme } from \"./use-theme.hook\";\r\n\r\ntype ThemedStyles<T extends StyleSheet.NamedStyles<T>> = T;\r\n\r\ntype StyledFunction<\r\n  Props extends object,\r\n  T extends StyleSheet.NamedStyles<T>\r\n> = (theme: AppTheme, props: Props) => ThemedStyles<T>;\r\n\r\nexport const useThemedStyles = <\r\n  Props extends object,\r\n  T extends StyleSheet.NamedStyles<T>\r\n>(\r\n  styledFunction: StyledFunction<Props, T>,\r\n  props: Props\r\n): ThemedStyles<T> => {\r\n  const theme = useTheme();\r\n\r\n  return useMemo(() => styledFunction(theme, props), [theme, props]);\r\n};\r\n"],"mappings":"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","names":["useMemo","ThemeProvider","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo"]}
+{"version":3,"sources":["../src/constants/style.constants.ts","../src/constants/typography.constants.ts","../src/hooks/use-border.hook.ts","../src/providers/theme.provider.tsx","../src/theme/tokens.theme.ts","../src/theme/dark.theme.ts","../src/theme/light.theme.ts","../src/hooks/use-colors.hook.ts","../src/hooks/use-components-theme.hook.ts","../src/hooks/use-radii.hook.ts","../src/hooks/use-space.hook.ts","../src/hooks/use-style-props.hook.ts","../src/utils/style.utils.ts","../src/hooks/use-theme.hook.ts","../src/hooks/use-themed-styles.ts"],"sourcesContent":["import { StyleProps } from \"../types\";\r\n\r\nexport const StylePropsSet = new Set<keyof StyleProps>([\r\n  // Spacing\r\n  \"margin\",\r\n  \"marginTop\",\r\n  \"marginBottom\",\r\n  \"marginLeft\",\r\n  \"marginRight\",\r\n  \"marginHorizontal\",\r\n  \"marginVertical\",\r\n  \"padding\",\r\n  \"paddingTop\",\r\n  \"paddingBottom\",\r\n  \"paddingLeft\",\r\n  \"paddingRight\",\r\n  \"paddingHorizontal\",\r\n  \"paddingVertical\",\r\n\r\n  // Appearance\r\n  \"color\",\r\n  \"backgroundColor\",\r\n  \"opacity\",\r\n  \"borderRadius\",\r\n  \"borderColor\",\r\n  \"borderWidth\",\r\n  \"borderStyle\",\r\n  \"shadowColor\",\r\n  \"shadowOpacity\",\r\n  \"shadowRadius\",\r\n  \"shadowOffset\",\r\n  \"elevation\",\r\n\r\n  // Typography (TextStyle)\r\n  \"fontSize\",\r\n  \"fontFamily\",\r\n  \"fontWeight\",\r\n  \"fontStyle\",\r\n  \"letterSpacing\",\r\n  \"lineHeight\",\r\n  \"textAlign\",\r\n  \"textDecorationLine\",\r\n  \"textDecorationStyle\",\r\n  \"textDecorationColor\",\r\n  \"textTransform\",\r\n  \"includeFontPadding\",\r\n  \"textAlignVertical\",\r\n  \"writingDirection\",\r\n\r\n  // Flex (ViewStyle)\r\n  \"flex\",\r\n  \"flexGrow\",\r\n  \"flexShrink\",\r\n  \"flexBasis\",\r\n  \"flexDirection\",\r\n  \"flexWrap\",\r\n  \"justifyContent\",\r\n  \"alignItems\",\r\n  \"alignSelf\",\r\n  \"alignContent\",\r\n  \"gap\",\r\n  \"rowGap\",\r\n  \"columnGap\",\r\n\r\n  // Positioning (commonly used with flex layouts)\r\n  \"position\",\r\n  \"top\",\r\n  \"right\",\r\n  \"bottom\",\r\n  \"left\",\r\n\r\n  // Dimensions (ViewStyle)\r\n  \"width\",\r\n  \"height\",\r\n  \"minWidth\",\r\n  \"maxWidth\",\r\n  \"minHeight\",\r\n  \"maxHeight\",\r\n  \"aspectRatio\",\r\n]);\r\n","import { FontWeightItalic, FontWeightKey, FontWeightNormal } from \"../types\";\r\n\r\nexport const FontWeightsNormal: Record<FontWeightKey, FontWeightNormal> = {\r\n  100: \"Montserrat_100Thin\",\r\n  200: \"Montserrat_200ExtraLight\",\r\n  300: \"Montserrat_300Light\",\r\n  400: \"Montserrat_400Regular\",\r\n  500: \"Montserrat_500Medium\",\r\n  600: \"Montserrat_600SemiBold\",\r\n  700: \"Montserrat_700Bold\",\r\n  800: \"Montserrat_800ExtraBold\",\r\n  900: \"Montserrat_900Black\",\r\n};\r\n\r\nexport const FontWeightsItalic: Record<FontWeightKey, FontWeightItalic> = {\r\n  100: \"Montserrat_100Thin_Italic\",\r\n  200: \"Montserrat_200ExtraLight_Italic\",\r\n  300: \"Montserrat_300Light_Italic\",\r\n  400: \"Montserrat_400Regular_Italic\",\r\n  500: \"Montserrat_500Medium_Italic\",\r\n  600: \"Montserrat_600SemiBold_Italic\",\r\n  700: \"Montserrat_700Bold_Italic\",\r\n  800: \"Montserrat_800ExtraBold_Italic\",\r\n  900: \"Montserrat_900Black_Italic\",\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { BorderSizes } from \"../types\";\r\n\r\nexport function useBorder(): BorderSizes {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.borderSize, [context.theme.borderSize]);\r\n}\r\n","import { DeepPartial, merge } from \"@impulse-ui-native/core\";\r\nimport {\r\n  createContext,\r\n  memo,\r\n  PropsWithChildren,\r\n  useContext,\r\n  useMemo,\r\n} from \"react\";\r\nimport { DarkTheme, LightTheme } from \"../theme\";\r\nimport {\r\n  AppTheme,\r\n  ColorScheme,\r\n  ComponentsThemes,\r\n  CustomComponentsTheme,\r\n  ThemeContextData,\r\n} from \"../types\";\r\n\r\nimport {\r\n  Montserrat_100Thin,\r\n  Montserrat_100Thin_Italic,\r\n  Montserrat_200ExtraLight,\r\n  Montserrat_200ExtraLight_Italic,\r\n  Montserrat_300Light,\r\n  Montserrat_300Light_Italic,\r\n  Montserrat_400Regular,\r\n  Montserrat_400Regular_Italic,\r\n  Montserrat_500Medium,\r\n  Montserrat_500Medium_Italic,\r\n  Montserrat_600SemiBold,\r\n  Montserrat_600SemiBold_Italic,\r\n  Montserrat_700Bold,\r\n  Montserrat_700Bold_Italic,\r\n  Montserrat_800ExtraBold,\r\n  Montserrat_800ExtraBold_Italic,\r\n  Montserrat_900Black,\r\n  Montserrat_900Black_Italic,\r\n  useFonts,\r\n} from \"@expo-google-fonts/montserrat\";\r\n\r\nconst ThemeContext = createContext<ThemeContextData | undefined>(undefined);\r\n\r\ninterface ThemeProviderProps {\r\n  scheme?: ColorScheme;\r\n  theme?: DeepPartial<{\r\n    light: AppTheme;\r\n    dark: AppTheme;\r\n  }>;\r\n  components?: CustomComponentsTheme;\r\n}\r\n\r\nexport const ThemeProvider = memo(function ThemeProvider(\r\n  props: PropsWithChildren<ThemeProviderProps>\r\n) {\r\n  const scheme = props.scheme ?? \"light\";\r\n\r\n  const [loaded] = useFonts({\r\n    Montserrat_100Thin,\r\n    Montserrat_100Thin_Italic,\r\n    Montserrat_200ExtraLight,\r\n    Montserrat_200ExtraLight_Italic,\r\n    Montserrat_300Light,\r\n    Montserrat_300Light_Italic,\r\n    Montserrat_400Regular,\r\n    Montserrat_400Regular_Italic,\r\n    Montserrat_500Medium,\r\n    Montserrat_500Medium_Italic,\r\n    Montserrat_600SemiBold,\r\n    Montserrat_600SemiBold_Italic,\r\n    Montserrat_700Bold,\r\n    Montserrat_700Bold_Italic,\r\n    Montserrat_800ExtraBold,\r\n    Montserrat_800ExtraBold_Italic,\r\n    Montserrat_900Black,\r\n    Montserrat_900Black_Italic,\r\n  });\r\n\r\n  const context = useMemo<ThemeContextData>(() => {\r\n    const baseTheme = scheme === \"light\" ? LightTheme : DarkTheme;\r\n    const customBaseTheme = props.theme?.[scheme];\r\n    const theme = merge(baseTheme, customBaseTheme);\r\n\r\n    let componentsTheme: DeepPartial<ComponentsThemes> | undefined;\r\n\r\n    if (typeof props.components === \"function\") {\r\n      componentsTheme = props.components(theme);\r\n    } else {\r\n      componentsTheme = props.components;\r\n    }\r\n\r\n    return {\r\n      loaded,\r\n      theme,\r\n      components: componentsTheme,\r\n    };\r\n  }, [props.theme?.light, props.theme?.dark, props.components]);\r\n\r\n  return (\r\n    <ThemeContext.Provider value={context}>\r\n      {props.children}\r\n    </ThemeContext.Provider>\r\n  );\r\n});\r\n\r\nexport function useThemeContext() {\r\n  const context = useContext(ThemeContext);\r\n\r\n  if (!context) {\r\n    throw new Error(\"useThemeContext must be used within a ThemeProvider\");\r\n  }\r\n\r\n  return context;\r\n}\r\n","import { BorderSizes, FontSizes, NeutralColors, Radii, Space } from \"../types\";\r\n\r\nexport const SpaceTokens: Space = {\r\n  none: 0,\r\n  auto: \"auto\",\r\n  xxs: 4,\r\n  xs: 8,\r\n  mxs: 12,\r\n  sm: 16,\r\n  msm: 24,\r\n  md: 32,\r\n  lg: 48,\r\n  xl: 64,\r\n  xxl: 96,\r\n};\r\n\r\nexport const BorderSizeTokens: BorderSizes = {\r\n  sm: 1,\r\n  md: 2,\r\n  lg: 3,\r\n  xl: 5,\r\n  xxl: 10,\r\n};\r\n\r\nexport const RadiiTokens: Radii = {\r\n  sm: 4,\r\n  md: 8,\r\n  lg: 16,\r\n  xl: 32,\r\n  xxl: 64,\r\n  xxxl: 128,\r\n  round: 100000,\r\n};\r\n\r\nexport const FontSizeTokens: FontSizes = {\r\n  xxs: 8,\r\n  xs: 12,\r\n  xsm: 14,\r\n  sm: 16,\r\n  md: 18,\r\n  lg: 20,\r\n  xl: 24,\r\n  xxl: 32,\r\n  xxxl: 40,\r\n  huge: 48,\r\n  massive: 56,\r\n};\r\n\r\nexport const NeutralColorTokens: NeutralColors = {\r\n  \"0\": \"#ffffff\",\r\n  \"1\": \"#f8f9fa\",\r\n  \"2\": \"#f1f3f5\",\r\n  \"3\": \"#e9ecef\",\r\n  \"4\": \"#dee2e6\",\r\n  \"5\": \"#ced4da\",\r\n  \"6\": \"#adb5bd\",\r\n  \"7\": \"#868e96\",\r\n  \"8\": \"#495057\",\r\n  \"9\": \"#343a40\",\r\n  \"10\": \"#212529\",\r\n  \"11\": \"#16191d\",\r\n  \"12\": \"#0d0f12\",\r\n  \"13\": \"#000000\",\r\n};\r\n","import { FontWeightsItalic, FontWeightsNormal } from \"../constants\";\r\nimport { AppTheme } from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontSizeTokens,\r\n  NeutralColorTokens,\r\n  RadiiTokens,\r\n  SpaceTokens,\r\n} from \"./tokens.theme\";\r\n\r\nexport const DarkTheme: AppTheme = {\r\n  colors: {\r\n    primary: \"#f55d6b\",\r\n    secondary: \"#f55d6b\",\r\n    neutral: NeutralColorTokens,\r\n    white: NeutralColorTokens[\"0\"],\r\n    black: NeutralColorTokens[\"13\"],\r\n    error: \"#c92a2a\",\r\n    warning: \"#e67700\",\r\n    success: \"#7a9908\",\r\n    info: \"#1864ab\",\r\n    text: {\r\n      primary: NeutralColorTokens[\"11\"],\r\n      secondary: NeutralColorTokens[\"10\"],\r\n    },\r\n    background: {\r\n      primary: NeutralColorTokens[\"2\"],\r\n      secondary: NeutralColorTokens[\"0\"],\r\n    },\r\n  },\r\n  spacing: SpaceTokens,\r\n  radii: RadiiTokens,\r\n  fontWeights: {\r\n    normal: FontWeightsNormal,\r\n    italic: FontWeightsItalic,\r\n  },\r\n  borderSize: BorderSizeTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { FontWeightsItalic, FontWeightsNormal } from \"../constants\";\r\nimport { AppTheme } from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontSizeTokens,\r\n  NeutralColorTokens,\r\n  RadiiTokens,\r\n  SpaceTokens,\r\n} from \"./tokens.theme\";\r\n\r\nexport const LightTheme: AppTheme = {\r\n  colors: {\r\n    primary: \"#f55d6b\",\r\n    secondary: \"#f55d6b\",\r\n    neutral: NeutralColorTokens,\r\n    white: NeutralColorTokens[\"0\"],\r\n    black: NeutralColorTokens[\"13\"],\r\n    error: \"#c92a2a\",\r\n    warning: \"#e67700\",\r\n    success: \"#7a9908\",\r\n    info: \"#1864ab\",\r\n    text: {\r\n      primary: NeutralColorTokens[\"11\"],\r\n      secondary: NeutralColorTokens[\"10\"],\r\n    },\r\n    background: {\r\n      primary: NeutralColorTokens[\"2\"],\r\n      secondary: NeutralColorTokens[\"0\"],\r\n    },\r\n  },\r\n  spacing: SpaceTokens,\r\n  radii: RadiiTokens,\r\n  fontWeights: {\r\n    normal: FontWeightsNormal,\r\n    italic: FontWeightsItalic,\r\n  },\r\n  borderSize: BorderSizeTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { ThemeColors } from \"../types\";\r\n\r\nexport function useColors(): ThemeColors {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.colors, [context.theme.colors]);\r\n}\r\n","import { DeepPartial } from \"@impulse-ui-native/core\";\r\nimport { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { ComponentsThemes } from \"../types\";\r\n\r\nexport function useComponentsTheme():\r\n  | DeepPartial<ComponentsThemes>\r\n  | undefined {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.components, [context.components]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { Radii } from \"../types\";\r\n\r\nexport function useRadii(): Radii {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.radii, [context.theme.radii]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { Space } from \"../types\";\r\n\r\nexport function useSpace(): Space {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme.spacing, [context.theme.spacing]);\r\n}\r\n","import { useMemo } from 'react';\r\nimport { createStyleKey, extractStyleProps } from '../utils';\r\n\r\nexport function useStyleProps<Props extends object>(props: Props) {\r\n  const key = createStyleKey(props);\r\n\r\n  return useMemo(() => extractStyleProps(props), [key]);\r\n}\r\n","import { StylePropsSet } from '../constants';\r\nimport { StylePropKey, StyleProps } from '../types';\r\n\r\nconst isStylePropKey = (k: string): k is StylePropKey =>\r\n  StylePropsSet.has(k as StylePropKey);\r\n\r\nexport const extractStyleProps = <Props extends object>(\r\n  props: Props\r\n): StyleProps => {\r\n  const style: StyleProps = {};\r\n  \r\n  for (const k in props) {\r\n    if (isStylePropKey(k) && props[k] !== undefined) {\r\n      style[k] = props[k] as any;\r\n    }\r\n  }\r\n  \r\n  return style;\r\n};\r\n\r\nexport const createStyleKey = <Props extends object>(props: Props) => {\r\n  let key = '';\r\n\r\n  for (const k in props) {\r\n    if (isStylePropKey(k)) {\r\n      key += String(props[k as keyof Props]);\r\n    }\r\n  }\r\n  \r\n  return key;\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { AppTheme } from \"../types\";\r\n\r\nexport function useTheme(): AppTheme {\r\n  const context = useThemeContext();\r\n\r\n  return useMemo(() => context.theme, [context.theme]);\r\n}\r\n","import { useMemo } from \"react\";\r\nimport { StyleSheet } from \"react-native\";\r\nimport { AppTheme } from \"../types\";\r\nimport { useTheme } from \"./use-theme.hook\";\r\n\r\ntype ThemedStyles<T extends StyleSheet.NamedStyles<T>> = T;\r\n\r\ntype StyledFunction<\r\n  Props extends object,\r\n  T extends StyleSheet.NamedStyles<T>\r\n> = (theme: AppTheme, props: Props) => ThemedStyles<T>;\r\n\r\nexport const useThemedStyles = <\r\n  Props extends object,\r\n  T extends StyleSheet.NamedStyles<T>\r\n>(\r\n  styledFunction: StyledFunction<Props, T>,\r\n  props: Props\r\n): ThemedStyles<T> => {\r\n  const theme = useTheme();\r\n\r\n  return useMemo(() => styledFunction(theme, props), [theme, props]);\r\n};\r\n"],"mappings":"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","names":["useMemo","ThemeProvider","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo","useMemo"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@impulse-ui-native/theme",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "source": "src/index.ts",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -22,7 +22,7 @@
   ],
   "dependencies": {
     "@expo-google-fonts/montserrat": "^0.4.1",
-    "@impulse-ui-native/core": "1.0.7"
+    "@impulse-ui-native/core": "1.0.8"
   },
   "peerDependencies": {
     "react": ">=18",

package/src/constants/index.ts

@@ -1 +1,2 @@
-export * from './style.constants'
+export * from "./style.constants";
+export * from "./typography.constants";

package/src/constants/typography.constants.ts

@@ -0,0 +1,25 @@
+import { FontWeightItalic, FontWeightKey, FontWeightNormal } from "../types";
+
+export const FontWeightsNormal: Record<FontWeightKey, FontWeightNormal> = {
+  100: "Montserrat_100Thin",
+  200: "Montserrat_200ExtraLight",
+  300: "Montserrat_300Light",
+  400: "Montserrat_400Regular",
+  500: "Montserrat_500Medium",
+  600: "Montserrat_600SemiBold",
+  700: "Montserrat_700Bold",
+  800: "Montserrat_800ExtraBold",
+  900: "Montserrat_900Black",
+};
+
+export const FontWeightsItalic: Record<FontWeightKey, FontWeightItalic> = {
+  100: "Montserrat_100Thin_Italic",
+  200: "Montserrat_200ExtraLight_Italic",
+  300: "Montserrat_300Light_Italic",
+  400: "Montserrat_400Regular_Italic",
+  500: "Montserrat_500Medium_Italic",
+  600: "Montserrat_600SemiBold_Italic",
+  700: "Montserrat_700Bold_Italic",
+  800: "Montserrat_800ExtraBold_Italic",
+  900: "Montserrat_900Black_Italic",
+};

package/src/hooks/index.ts

@@ -1,5 +1,6 @@
 export { useBorder } from "./use-border.hook";
 export { useColors } from "./use-colors.hook";
+export { useComponentsTheme } from "./use-components-theme.hook";
 export { useRadii } from "./use-radii.hook";
 export { useSpace } from "./use-space.hook";
 export { useStyleProps } from "./use-style-props.hook";

package/src/hooks/use-components-theme.hook.ts

@@ -0,0 +1,12 @@
+import { DeepPartial } from "@impulse-ui-native/core";
+import { useMemo } from "react";
+import { useThemeContext } from "../providers";
+import { ComponentsThemes } from "../types";
+
+export function useComponentsTheme():
+  | DeepPartial<ComponentsThemes>
+  | undefined {
+  const context = useThemeContext();
+
+  return useMemo(() => context.components, [context.components]);
+}

package/src/index.ts

@@ -1,6 +1,6 @@
-export * from './constants';
-export * from './hooks';
-export * from './providers';
-export * from './theme';
-export * from './types';
-export * from './utils';
+export * from "./constants";
+export * from "./hooks";
+export * from "./providers";
+export * from "./theme";
+export * from "./types";
+export * from "./utils";

package/src/providers/theme.provider.tsx

@@ -7,7 +7,13 @@ import {
   useMemo,
 } from "react";
 import { DarkTheme, LightTheme } from "../theme";
-import { AppTheme, ColorScheme, ThemeContextData } from "../types";
+import {
+  AppTheme,
+  ColorScheme,
+  ComponentsThemes,
+  CustomComponentsTheme,
+  ThemeContextData,
+} from "../types";
 
 import {
   Montserrat_100Thin,
@@ -34,15 +40,16 @@ import {
 const ThemeContext = createContext<ThemeContextData | undefined>(undefined);
 
 interface ThemeProviderProps {
-  scheme: ColorScheme;
-  theme: {
+  scheme?: ColorScheme;
+  theme?: DeepPartial<{
     light: AppTheme;
     dark: AppTheme;
-  };
+  }>;
+  components?: CustomComponentsTheme;
 }
 
 export const ThemeProvider = memo(function ThemeProvider(
-  props: PropsWithChildren<DeepPartial<ThemeProviderProps>>
+  props: PropsWithChildren<ThemeProviderProps>
 ) {
   const scheme = props.scheme ?? "light";
 
@@ -69,12 +76,23 @@ export const ThemeProvider = memo(function ThemeProvider(
 
   const context = useMemo<ThemeContextData>(() => {
     const baseTheme = scheme === "light" ? LightTheme : DarkTheme;
+    const customBaseTheme = props.theme?.[scheme];
+    const theme = merge(baseTheme, customBaseTheme);
+
+    let componentsTheme: DeepPartial<ComponentsThemes> | undefined;
+
+    if (typeof props.components === "function") {
+      componentsTheme = props.components(theme);
+    } else {
+      componentsTheme = props.components;
+    }
 
     return {
       loaded,
-      theme: merge(baseTheme, props.theme?.[scheme]),
+      theme,
+      components: componentsTheme,
     };
-  }, [props.theme?.light, props.theme?.dark]);
+  }, [props.theme?.light, props.theme?.dark, props.components]);
 
   return (
     <ThemeContext.Provider value={context}>

package/src/theme/dark.theme.ts

@@ -1,3 +1,4 @@
+import { FontWeightsItalic, FontWeightsNormal } from "../constants";
 import { AppTheme } from "../types";
 import {
   BorderSizeTokens,
@@ -29,6 +30,10 @@ export const DarkTheme: AppTheme = {
   },
   spacing: SpaceTokens,
   radii: RadiiTokens,
+  fontWeights: {
+    normal: FontWeightsNormal,
+    italic: FontWeightsItalic,
+  },
   borderSize: BorderSizeTokens,
   fontSize: FontSizeTokens,
 };

package/src/theme/index.ts

@@ -1,2 +1,3 @@
 export { DarkTheme } from "./dark.theme";
 export { LightTheme } from "./light.theme";
+export * from "./tokens.theme";

package/src/theme/light.theme.ts

@@ -1,3 +1,4 @@
+import { FontWeightsItalic, FontWeightsNormal } from "../constants";
 import { AppTheme } from "../types";
 import {
   BorderSizeTokens,
@@ -29,6 +30,10 @@ export const LightTheme: AppTheme = {
   },
   spacing: SpaceTokens,
   radii: RadiiTokens,
+  fontWeights: {
+    normal: FontWeightsNormal,
+    italic: FontWeightsItalic,
+  },
   borderSize: BorderSizeTokens,
   fontSize: FontSizeTokens,
 };

package/src/types/theme-provider.types.ts

@@ -6,11 +6,16 @@ import {
   Radii,
   Space,
 } from "./tokens.types";
-import { TypographyPresetKey, TypographyProps } from "./typography.types";
+import {
+  FontWeightKey,
+  TypographyPresetKey,
+  TypographyProps,
+} from "./typography.types";
 
 export interface ThemeContextData {
   loaded: boolean;
   theme: AppTheme;
+  components?: DeepPartial<ComponentsThemes>;
 }
 
 export type ColorScheme = "light" | "dark";
@@ -50,6 +55,10 @@ export interface AppTheme {
   spacing: Space;
   radii: Radii;
   borderSize: BorderSizes;
+  fontWeights: Record<"normal" | "italic", Record<FontWeightKey, string>>;
   fontSize: FontSizes;
-  components?: DeepPartial<ComponentsThemes>;
 }
+
+export type CustomComponentsTheme =
+  | ((theme: AppTheme) => DeepPartial<ComponentsThemes>)
+  | DeepPartial<ComponentsThemes>;