@metamask/design-system-twrnc-preset/dist/hooks.mjs.map

Design System twrnc Preset

{"version":3,"file":"hooks.mjs","sourceRoot":"","sources":["../src/hooks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,cAAc;AAGnC,OAAO,EAAE,YAAY,EAAE,2BAAuB;AAE9C;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAU,EAAE;IAClC,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAC3C,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAY,EAAE;IACxC,MAAM,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACjD,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B,MAAM,EAAE,EAAE,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACxC,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC","sourcesContent":["import { useContext } from 'react';\n\nimport type { Theme } from './Theme.types';\nimport { ThemeContext } from './ThemeContext';\n\n/**\n * Hook that provides access to the current theme.\n * Use this when you need to conditionally render content based on theme.\n *\n * @returns The current theme ('light' or 'dark')\n *\n * @example\n * const theme = useTheme();\n * const inverseTheme = theme === Theme.Light ? Theme.Dark : Theme.Light;\n * return (\n *   <ThemeProvider theme={inverseTheme}>\n *     <View style={tw`bg-default`}>\n *       <Text style={tw`text-default`}>Toast message</Text>\n *     </View>\n *   </ThemeProvider>\n * );\n */\nexport const useTheme = (): Theme => {\n  const { theme } = useContext(ThemeContext);\n  return theme;\n};\n\nexport const usePureBlack = (): boolean => {\n  const { isPureBlack } = useContext(ThemeContext);\n  return isPureBlack;\n};\n\n/**\n * Hook that provides access to the tailwind utility function.\n * Use this when you only need styling capabilities.\n *\n * @returns Tailwind utility function for styling\n *\n * @example\n * const tw = useTailwind();\n * return (\n *   <View style={tw`p-4 bg-primary`}>\n *     <Text>Styled content</Text>\n *   </View>\n * );\n */\nexport const useTailwind = () => {\n  const { tw } = useContext(ThemeContext);\n  return tw;\n};\n"]}