@impulse-ui-native/theme 1.0.0

package/dist/index.cjs.js

@@ -0,0 +1,379 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  DarkTheme: () => DarkTheme,
+  LightTheme: () => LightTheme,
+  StylePropsSet: () => StylePropsSet,
+  ThemeProvider: () => ThemeProvider,
+  createStyleKey: () => createStyleKey,
+  extractStyleProps: () => extractStyleProps,
+  useBorder: () => useBorder,
+  useColors: () => useColors,
+  useRadii: () => useRadii,
+  useSpace: () => useSpace,
+  useStyleProps: () => useStyleProps,
+  useTheme: () => useTheme,
+  useThemeContext: () => useThemeContext,
+  useThemedStyles: () => useThemedStyles
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/constants/style.constants.ts
+var StylePropsSet = /* @__PURE__ */ new Set([
+  // Spacing
+  "margin",
+  "marginTop",
+  "marginBottom",
+  "marginLeft",
+  "marginRight",
+  "marginHorizontal",
+  "marginVertical",
+  "padding",
+  "paddingTop",
+  "paddingBottom",
+  "paddingLeft",
+  "paddingRight",
+  "paddingHorizontal",
+  "paddingVertical",
+  // Appearance
+  "color",
+  "backgroundColor",
+  "opacity",
+  "borderRadius",
+  "borderColor",
+  "borderWidth",
+  "borderStyle",
+  "shadowColor",
+  "shadowOpacity",
+  "shadowRadius",
+  "shadowOffset",
+  "elevation",
+  // Typography (TextStyle)
+  "fontSize",
+  "fontFamily",
+  "fontWeight",
+  "fontStyle",
+  "letterSpacing",
+  "lineHeight",
+  "textAlign",
+  "textDecorationLine",
+  "textDecorationStyle",
+  "textDecorationColor",
+  "textTransform",
+  "includeFontPadding",
+  "textAlignVertical",
+  "writingDirection",
+  // Flex (ViewStyle)
+  "flex",
+  "flexGrow",
+  "flexShrink",
+  "flexBasis",
+  "flexDirection",
+  "flexWrap",
+  "justifyContent",
+  "alignItems",
+  "alignSelf",
+  "alignContent",
+  "gap",
+  "rowGap",
+  "columnGap",
+  // Positioning (commonly used with flex layouts)
+  "position",
+  "top",
+  "right",
+  "bottom",
+  "left"
+]);
+
+// src/hooks/use-border.hook.ts
+var import_react2 = require("react");
+
+// src/providers/theme.provider.tsx
+var import_core = require("@impulse-ui-native/core");
+var import_react = require("react");
+
+// src/theme/tokens.theme.ts
+var SpaceTokens = {
+  none: 0,
+  auto: "auto",
+  xxs: 4,
+  xs: 8,
+  mxs: 12,
+  sm: 16,
+  msm: 24,
+  md: 32,
+  lg: 48,
+  xl: 64,
+  xxl: 96
+};
+var BorderSizeTokens = {
+  sm: 1,
+  md: 2,
+  lg: 3,
+  xl: 5,
+  xxl: 10
+};
+var RadiiTokens = {
+  sm: 4,
+  md: 8,
+  lg: 16,
+  xl: 32,
+  xxl: 64,
+  xxxl: 128,
+  round: 1e5
+};
+var FontSizeTokens = {
+  xxs: 8,
+  xs: 12,
+  xsm: 14,
+  sm: 16,
+  md: 18,
+  lg: 20,
+  xl: 24,
+  xxl: 32,
+  xxxl: 40,
+  huge: 48,
+  massive: 56
+};
+var NeutralColorTokens = {
+  "0": "#ffffff",
+  "1": "#f8f9fa",
+  "2": "#f1f3f5",
+  "3": "#e9ecef",
+  "4": "#dee2e6",
+  "5": "#ced4da",
+  "6": "#adb5bd",
+  "7": "#868e96",
+  "8": "#495057",
+  "9": "#343a40",
+  "10": "#212529",
+  "11": "#16191d",
+  "12": "#0d0f12",
+  "13": "#000000"
+};
+var FontFamilyTokens = {
+  thin: "Montserrat-Thin",
+  thinItalic: "Montserrat-ThinItalic",
+  extraLight: "Montserrat-ExtraLight",
+  extraLightItalic: "Montserrat-ExtraLightItalic",
+  light: "Montserrat-Light",
+  lightItalic: "Montserrat-LightItalic",
+  regular: "Montserrat-Regular",
+  italic: "Montserrat-Italic",
+  medium: "Montserrat-Medium",
+  mediumItalic: "Montserrat-MediumItalic",
+  semiBold: "Montserrat-SemiBold",
+  semiBoldItalic: "Montserrat-SemiBoldItalic",
+  bold: "Montserrat-Bold",
+  boldItalic: "Montserrat-BoldItalic",
+  extraBold: "Montserrat-ExtraBold",
+  extraBoldItalic: "Montserrat-ExtraBoldItalic",
+  black: "Montserrat-Black",
+  blackItalic: "Montserrat-BlackItalic"
+};
+
+// src/theme/light.theme.ts
+var LightTheme = {
+  colors: {
+    primary: "#f55d6b",
+    secondary: "#f55d6b",
+    neutral: NeutralColorTokens,
+    white: NeutralColorTokens["0"],
+    black: NeutralColorTokens["13"],
+    error: "#c92a2a",
+    warning: "#e67700",
+    success: "#7a9908",
+    info: "#1864ab",
+    text: {
+      primary: NeutralColorTokens["11"],
+      secondary: NeutralColorTokens["10"]
+    },
+    background: {
+      primary: NeutralColorTokens["2"],
+      secondary: NeutralColorTokens["0"]
+    }
+  },
+  spacing: SpaceTokens,
+  radii: RadiiTokens,
+  borderSize: BorderSizeTokens,
+  fontFamily: FontFamilyTokens,
+  fontSize: FontSizeTokens
+};
+
+// src/theme/dark.theme.ts
+var DarkTheme = {
+  colors: {
+    primary: "#f55d6b",
+    secondary: "#f55d6b",
+    neutral: NeutralColorTokens,
+    white: NeutralColorTokens["0"],
+    black: NeutralColorTokens["13"],
+    error: "#c92a2a",
+    warning: "#e67700",
+    success: "#7a9908",
+    info: "#1864ab",
+    text: {
+      primary: NeutralColorTokens["11"],
+      secondary: NeutralColorTokens["10"]
+    },
+    background: {
+      primary: NeutralColorTokens["2"],
+      secondary: NeutralColorTokens["0"]
+    }
+  },
+  spacing: SpaceTokens,
+  radii: RadiiTokens,
+  borderSize: BorderSizeTokens,
+  fontFamily: FontFamilyTokens,
+  fontSize: FontSizeTokens
+};
+
+// src/providers/theme.provider.tsx
+var import_montserrat = require("@expo-google-fonts/montserrat");
+var ThemeContext = (0, import_react.createContext)(void 0);
+var ThemeProvider = (0, import_react.memo)(function ThemeProvider2(props) {
+  const scheme = props.scheme ?? "light";
+  const [loaded] = (0, import_montserrat.useFonts)({
+    Montserrat_100Thin: import_montserrat.Montserrat_100Thin,
+    Montserrat_100Thin_Italic: import_montserrat.Montserrat_100Thin_Italic,
+    Montserrat_200ExtraLight: import_montserrat.Montserrat_200ExtraLight,
+    Montserrat_200ExtraLight_Italic: import_montserrat.Montserrat_200ExtraLight_Italic,
+    Montserrat_300Light: import_montserrat.Montserrat_300Light,
+    Montserrat_300Light_Italic: import_montserrat.Montserrat_300Light_Italic,
+    Montserrat_400Regular: import_montserrat.Montserrat_400Regular,
+    Montserrat_400Regular_Italic: import_montserrat.Montserrat_400Regular_Italic,
+    Montserrat_500Medium: import_montserrat.Montserrat_500Medium,
+    Montserrat_500Medium_Italic: import_montserrat.Montserrat_500Medium_Italic,
+    Montserrat_600SemiBold: import_montserrat.Montserrat_600SemiBold,
+    Montserrat_600SemiBold_Italic: import_montserrat.Montserrat_600SemiBold_Italic,
+    Montserrat_700Bold: import_montserrat.Montserrat_700Bold,
+    Montserrat_700Bold_Italic: import_montserrat.Montserrat_700Bold_Italic,
+    Montserrat_800ExtraBold: import_montserrat.Montserrat_800ExtraBold,
+    Montserrat_800ExtraBold_Italic: import_montserrat.Montserrat_800ExtraBold_Italic,
+    Montserrat_900Black: import_montserrat.Montserrat_900Black,
+    Montserrat_900Black_Italic: import_montserrat.Montserrat_900Black_Italic
+  });
+  const context = (0, import_react.useMemo)(() => {
+    const baseTheme = scheme === "light" ? LightTheme : DarkTheme;
+    return {
+      loaded,
+      theme: (0, import_core.merge)(baseTheme, props.theme?.[scheme])
+    };
+  }, [props.theme?.light, props.theme?.dark]);
+  return /* @__PURE__ */ React.createElement(ThemeContext.Provider, { value: context }, props.children);
+});
+function useThemeContext() {
+  const context = (0, import_react.useContext)(ThemeContext);
+  if (!context) {
+    throw new Error("useThemeContext must be used within a ThemeProvider");
+  }
+  return context;
+}
+
+// src/hooks/use-border.hook.ts
+function useBorder() {
+  const context = useThemeContext();
+  return (0, import_react2.useMemo)(() => context.theme.borderSize, [context.theme.borderSize]);
+}
+
+// src/hooks/use-colors.hook.ts
+var import_react3 = require("react");
+function useColors() {
+  const context = useThemeContext();
+  return (0, import_react3.useMemo)(() => context.theme.colors, [context.theme.colors]);
+}
+
+// src/hooks/use-radii.hook.ts
+var import_react4 = require("react");
+function useRadii() {
+  const context = useThemeContext();
+  return (0, import_react4.useMemo)(() => context.theme.radii, [context.theme.radii]);
+}
+
+// src/hooks/use-space.hook.ts
+var import_react5 = require("react");
+function useSpace() {
+  const context = useThemeContext();
+  return (0, import_react5.useMemo)(() => context.theme.spacing, [context.theme.spacing]);
+}
+
+// src/hooks/use-style-props.hook.ts
+var import_react6 = require("react");
+
+// src/utils/style.utils.ts
+var isStylePropKey = (k) => StylePropsSet.has(k);
+var extractStyleProps = (props) => {
+  const style = {};
+  for (const k in props) {
+    if (isStylePropKey(k) && props[k] !== void 0) {
+      style[k] = props[k];
+    }
+  }
+  return style;
+};
+var createStyleKey = (props) => {
+  let key = "";
+  for (const k in props) {
+    if (isStylePropKey(k)) {
+      key += String(props[k]);
+    }
+  }
+  return key;
+};
+
+// src/hooks/use-style-props.hook.ts
+function useStyleProps(props) {
+  const key = createStyleKey(props);
+  return (0, import_react6.useMemo)(() => extractStyleProps(props), [key]);
+}
+
+// src/hooks/use-theme.hook.ts
+var import_react7 = require("react");
+function useTheme() {
+  const context = useThemeContext();
+  return (0, import_react7.useMemo)(() => context.theme, [context.theme]);
+}
+
+// src/hooks/use-themed-styles.ts
+var import_react8 = require("react");
+var useThemedStyles = (styledFunction, props) => {
+  const theme = useTheme();
+  return (0, import_react8.useMemo)(() => styledFunction(theme, props), [theme, props]);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DarkTheme,
+  LightTheme,
+  StylePropsSet,
+  ThemeProvider,
+  createStyleKey,
+  extractStyleProps,
+  useBorder,
+  useColors,
+  useRadii,
+  useSpace,
+  useStyleProps,
+  useTheme,
+  useThemeContext,
+  useThemedStyles
+});
+//# sourceMappingURL=index.cjs.js.map

package/dist/index.cjs.js.map

@@ -0,0 +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/light.theme.ts","../src/theme/dark.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","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 { AppTheme, DarkTheme, LightTheme } from \"../theme\";\r\nimport { 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 {\r\n  BorderSizes,\r\n  FontFamilyMap,\r\n  FontSizes,\r\n  FontWeights,\r\n  NeutralColors,\r\n  Radii,\r\n  Space,\r\n} 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\r\nexport const FontWeightTokens: FontWeights = {\r\n  thin: \"100\",\r\n  extraLight: \"200\",\r\n  light: \"300\",\r\n  regular: \"400\",\r\n  medium: \"500\",\r\n  semiBold: \"600\",\r\n  bold: \"700\",\r\n  extraBold: \"800\",\r\n  black: \"900\",\r\n};\r\n\r\nexport const FontFamilyTokens: FontFamilyMap = {\r\n  thin: \"Montserrat-Thin\",\r\n  thinItalic: \"Montserrat-ThinItalic\",\r\n  extraLight: \"Montserrat-ExtraLight\",\r\n  extraLightItalic: \"Montserrat-ExtraLightItalic\",\r\n  light: \"Montserrat-Light\",\r\n  lightItalic: \"Montserrat-LightItalic\",\r\n  regular: \"Montserrat-Regular\",\r\n  italic: \"Montserrat-Italic\",\r\n  medium: \"Montserrat-Medium\",\r\n  mediumItalic: \"Montserrat-MediumItalic\",\r\n  semiBold: \"Montserrat-SemiBold\",\r\n  semiBoldItalic: \"Montserrat-SemiBoldItalic\",\r\n  bold: \"Montserrat-Bold\",\r\n  boldItalic: \"Montserrat-BoldItalic\",\r\n  extraBold: \"Montserrat-ExtraBold\",\r\n  extraBoldItalic: \"Montserrat-ExtraBoldItalic\",\r\n  black: \"Montserrat-Black\",\r\n  blackItalic: \"Montserrat-BlackItalic\",\r\n};\r\n","import { DeepPartial } from \"@impulse-ui-native/core\";\r\nimport {\r\n  BorderSizes,\r\n  FontFamilyMap,\r\n  FontSizes,\r\n  NeutralColors,\r\n  Radii,\r\n  Space,\r\n  TypographyPresetKey,\r\n  TypographyProps,\r\n} from \"../types\";\r\nimport {\r\n  BorderSizeTokens,\r\n  FontFamilyTokens,\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  fontFamily: FontFamilyTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n\r\nexport interface ThemeColors {\r\n  primary: string;\r\n  secondary: string;\r\n  neutral: NeutralColors;\r\n\r\n  white: string;\r\n  black: string;\r\n\r\n  error: string;\r\n  warning: string;\r\n  success: string;\r\n  info: string;\r\n\r\n  text: {\r\n    primary: string;\r\n    secondary: string;\r\n  };\r\n\r\n  background: {\r\n    primary: string;\r\n    secondary: string;\r\n  };\r\n}\r\n\r\nexport interface ComponentsThemes {\r\n  typography: Record<TypographyPresetKey, TypographyProps>;\r\n}\r\n\r\nexport interface AppTheme {\r\n  colors: ThemeColors;\r\n  spacing: Space;\r\n  radii: Radii;\r\n  borderSize: BorderSizes;\r\n  fontFamily: FontFamilyMap;\r\n  fontSize: FontSizes;\r\n  components?: DeepPartial<ComponentsThemes>;\r\n}\r\n","import { AppTheme } from './light.theme';\r\nimport {\r\n  BorderSizeTokens,\r\n  FontFamilyTokens,\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  fontFamily: FontFamilyTokens,\r\n  fontSize: FontSizeTokens,\r\n};\r\n","import { useMemo } from \"react\";\r\nimport { useThemeContext } from \"../providers\";\r\nimport { ThemeColors } from \"../theme/light.theme\";\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 \"../theme\";\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 \"../theme\";\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;;;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;AACF,CAAC;;;ACtED,IAAAA,gBAAwB;;;ACAxB,kBAAmC;AACnC,mBAMO;;;ACGA,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;AAcO,IAAM,mBAAkC;AAAA,EAC7C,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,OAAO;AAAA,EACP,aAAa;AAAA,EACb,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,iBAAiB;AAAA,EACjB,OAAO;AAAA,EACP,aAAa;AACf;;;ACpFO,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,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,UAAU;AACZ;;;ACnCO,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,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,UAAU;AACZ;;;AHxBA,wBAoBO;AAEP,IAAM,mBAAe,4BAA4C,MAAS;AAUnE,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;AAEpD,WAAO;AAAA,MACL;AAAA,MACA,WAAO,mBAAM,WAAW,MAAM,QAAQ,MAAM,CAAC;AAAA,IAC/C;AAAA,EACF,GAAG,CAAC,MAAM,OAAO,OAAO,MAAM,OAAO,IAAI,CAAC;AAE1C,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;;;ADzFO,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;;;ACRA,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"]}

package/dist/index.d.mts

@@ -0,0 +1,185 @@
+import { ViewStyle, TextStyle, DimensionValue, StyleSheet } from 'react-native';
+import { DeepPartial } from '@impulse-ui-native/core';
+import * as react from 'react';
+import { PropsWithChildren } from 'react';
+
+declare const StylePropsSet: Set<keyof SpacingProps | keyof ColorProps | keyof ShadowProps | keyof BorderProps | keyof TypographyProps | keyof FlexProps>;
+
+type BorderProps = {
+    borderRadius?: ViewStyle['borderRadius'];
+    borderColor?: ViewStyle['borderColor'];
+    borderWidth?: ViewStyle['borderWidth'];
+    borderStyle?: ViewStyle['borderStyle'];
+};
+
+type ColorProps = {
+    color?: TextStyle['color'];
+    backgroundColor?: ViewStyle['backgroundColor'];
+    opacity?: ViewStyle['opacity'];
+};
+
+type ComponentSize = "small" | "medium" | "large";
+
+type FlexProps = {
+    flex?: ViewStyle["flex"];
+    flexGrow?: ViewStyle["flexGrow"];
+    flexShrink?: ViewStyle["flexShrink"];
+    flexBasis?: ViewStyle["flexBasis"];
+    flexDirection?: ViewStyle["flexDirection"];
+    flexWrap?: ViewStyle["flexWrap"];
+    justifyContent?: ViewStyle["justifyContent"];
+    alignItems?: ViewStyle["alignItems"];
+    alignSelf?: ViewStyle["alignSelf"];
+    alignContent?: ViewStyle["alignContent"];
+    gap?: ViewStyle["gap"];
+    rowGap?: ViewStyle["rowGap"];
+    columnGap?: ViewStyle["columnGap"];
+    position?: ViewStyle["position"];
+    top?: ViewStyle["top"];
+    right?: ViewStyle["right"];
+    bottom?: ViewStyle["bottom"];
+    left?: ViewStyle["left"];
+};
+
+type ShadowProps = {
+    shadowColor?: ViewStyle['shadowColor'];
+    shadowOpacity?: ViewStyle['shadowOpacity'];
+    shadowRadius?: ViewStyle['shadowRadius'];
+    shadowOffset?: ViewStyle['shadowOffset'];
+    elevation?: ViewStyle['elevation'];
+};
+
+type SpacingProps = {
+    margin?: ViewStyle['margin'];
+    marginTop?: ViewStyle['marginTop'];
+    marginBottom?: ViewStyle['marginBottom'];
+    marginLeft?: ViewStyle['marginLeft'];
+    marginRight?: ViewStyle['marginRight'];
+    marginHorizontal?: ViewStyle['marginHorizontal'];
+    marginVertical?: ViewStyle['marginVertical'];
+    padding?: ViewStyle['padding'];
+    paddingTop?: ViewStyle['paddingTop'];
+    paddingBottom?: ViewStyle['paddingBottom'];
+    paddingLeft?: ViewStyle['paddingLeft'];
+    paddingRight?: ViewStyle['paddingRight'];
+    paddingHorizontal?: ViewStyle['paddingHorizontal'];
+    paddingVertical?: ViewStyle['paddingVertical'];
+};
+
+type TypographyProps = {
+    fontSize?: TextStyle['fontSize'];
+    fontFamily?: TextStyle['fontFamily'];
+    fontWeight?: TextStyle['fontWeight'];
+    fontStyle?: TextStyle['fontStyle'];
+    letterSpacing?: TextStyle['letterSpacing'];
+    lineHeight?: TextStyle['lineHeight'];
+    textAlign?: TextStyle['textAlign'];
+    textDecorationLine?: TextStyle['textDecorationLine'];
+    textDecorationStyle?: TextStyle['textDecorationStyle'];
+    textDecorationColor?: TextStyle['textDecorationColor'];
+    textTransform?: TextStyle['textTransform'];
+    includeFontPadding?: TextStyle['includeFontPadding'];
+    textAlignVertical?: TextStyle['textAlignVertical'];
+    writingDirection?: TextStyle['writingDirection'];
+};
+type TypographyPresetKey = 'Master' | 'DisplayLarge' | 'DisplayMedium' | 'DisplaySmall' | 'Title1' | 'Title2' | 'Title3' | 'Title4' | 'Title5' | 'Title6' | 'Subtitle1' | 'Subtitle2' | 'BodyLarge' | 'Body' | 'BodySmall' | 'Caption' | 'Label' | 'Overline' | 'Helper' | 'Code' | 'Quote' | 'Eyebrow';
+
+type StyleProps = Partial<SpacingProps & ColorProps & ShadowProps & BorderProps & TypographyProps & FlexProps>;
+type StylePropKey = keyof StyleProps;
+
+declare const LightTheme: AppTheme;
+interface ThemeColors {
+    primary: string;
+    secondary: string;
+    neutral: NeutralColors;
+    white: string;
+    black: string;
+    error: string;
+    warning: string;
+    success: string;
+    info: string;
+    text: {
+        primary: string;
+        secondary: string;
+    };
+    background: {
+        primary: string;
+        secondary: string;
+    };
+}
+interface ComponentsThemes {
+    typography: Record<TypographyPresetKey, TypographyProps>;
+}
+interface AppTheme {
+    colors: ThemeColors;
+    spacing: Space;
+    radii: Radii;
+    borderSize: BorderSizes;
+    fontFamily: FontFamilyMap;
+    fontSize: FontSizes;
+    components?: DeepPartial<ComponentsThemes>;
+}
+
+declare const DarkTheme: AppTheme;
+
+interface ThemeContextData {
+    loaded: boolean;
+    theme: AppTheme;
+}
+type ColorScheme = "light" | "dark";
+
+type SpaceSizesKeys = "none" | "auto" | "xxs" | "xs" | "mxs" | "sm" | "msm" | "md" | "lg" | "xl" | "xxl";
+type Space = Record<SpaceSizesKeys, DimensionValue>;
+type FontSizesKeys = "xxs" | "xs" | "xsm" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "huge" | "massive";
+type FontSizes = Record<FontSizesKeys, number>;
+type LineHeightKeys = "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
+type LineHeights = Record<LineHeightKeys, string>;
+type FontWeightKey = "thin" | "extraLight" | "light" | "regular" | "medium" | "semiBold" | "bold" | "extraBold" | "black";
+type FontWeights = Record<FontWeightKey, "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900">;
+type LetterSpacingKey = "tightest" | "tighter" | "tight" | "normal" | "wide" | "wider" | "widest" | "ultraWide";
+type LetterSpacings = Record<LetterSpacingKey, number>;
+type BorderSizeKey = "sm" | "md" | "lg" | "xl" | "xxl";
+type BorderSizes = Record<BorderSizeKey, number>;
+type RadiusKey = "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "round";
+type Radii = Record<RadiusKey, number>;
+type RadiusDrawnKey = "drawn1" | "drawn2" | "drawn3" | "drawn4" | "drawn5" | "drawn6";
+type RadiiDrawn = Record<RadiusDrawnKey, string>;
+type RadiusBlobKey = "blob1" | "blob2" | "blob3" | "blob4" | "blob5";
+type RadiiBlob = Record<RadiusBlobKey, string>;
+type RadiusConditionalKey = "conditional1" | "conditional2" | "conditional3" | "conditional4" | "conditional5" | "conditional6";
+type RadiiConditional = Record<RadiusConditionalKey, string>;
+type NeutralColorKey = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "13";
+type NeutralColors = Record<NeutralColorKey, string>;
+type FontFamilyKey = "thin" | "thinItalic" | "extraLight" | "extraLightItalic" | "light" | "lightItalic" | "regular" | "italic" | "medium" | "mediumItalic" | "semiBold" | "semiBoldItalic" | "bold" | "boldItalic" | "extraBold" | "extraBoldItalic" | "black" | "blackItalic";
+type FontFamilyMap = Record<FontFamilyKey, string>;
+
+declare function useBorder(): BorderSizes;
+
+declare function useColors(): ThemeColors;
+
+declare function useRadii(): Radii;
+
+declare function useSpace(): Space;
+
+declare function useStyleProps<Props extends object>(props: Props): Partial<SpacingProps & ColorProps & ShadowProps & BorderProps & TypographyProps & FlexProps>;
+
+declare function useTheme(): AppTheme;
+
+type ThemedStyles<T extends StyleSheet.NamedStyles<T>> = T;
+type StyledFunction<Props extends object, T extends StyleSheet.NamedStyles<T>> = (theme: AppTheme, props: Props) => ThemedStyles<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: {
+        light: AppTheme;
+        dark: AppTheme;
+    };
+}
+declare const ThemeProvider: react.NamedExoticComponent<PropsWithChildren<DeepPartial<ThemeProviderProps>>>;
+declare function useThemeContext(): ThemeContextData;
+
+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, DarkTheme, type FlexProps, type FontFamilyKey, type FontFamilyMap, type FontSizes, type FontSizesKeys, type FontWeightKey, type FontWeights, 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 ThemeContextData, ThemeProvider, type TypographyPresetKey, type TypographyProps, createStyleKey, extractStyleProps, useBorder, useColors, useRadii, useSpace, useStyleProps, useTheme, useThemeContext, useThemedStyles };