{"ast":null,"code":"import React from 'react';\nimport { NativeBaseProvider, useColorMode, Text, Button, Center, useColorModeValue } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nfunction UseColorMode() {\n  var _useColorMode = useColorMode(),\n      toggleColorMode = _useColorMode.toggleColorMode;\n\n  return _jsxs(Center, {\n    flex: \"1\",\n    bg: useColorModeValue('warmGray.50', 'coolGray.800'),\n    children: [_jsxs(Text, {\n      fontSize: \"lg\",\n      display: \"flex\",\n      mb: 20,\n      children: [\"The active color mode is\", ' ', _jsx(Text, {\n        bold: true,\n        fontSize: \"18px\",\n        children: useColorModeValue('Light', 'Dark')\n      })]\n    }), _jsx(Button, {\n      onPress: toggleColorMode,\n      children: \"Toggle\"\n    })]\n  });\n}\n\nexport var Example = function Example() {\n  return _jsx(NativeBaseProvider, {\n    children: _jsx(UseColorMode, {})\n  });\n};","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/hooks/useColorModeValue/Basic.tsx"],"names":["React","NativeBaseProvider","useColorMode","Text","Button","Center","useColorModeValue","UseColorMode","toggleColorMode","Example"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SACEC,kBADF,EAEEC,YAFF,EAGEC,IAHF,EAIEC,MAJF,EAKEC,MALF,EAMEC,iBANF;;;;AASA,SAASC,YAAT,GAAwB;AAAA,sBACML,YAAY,EADlB;AAAA,MACdM,eADc,iBACdA,eADc;;AAEtB,SACE,MAAC,MAAD;AAAQ,IAAA,IAAI,EAAC,GAAb;AAAiB,IAAA,EAAE,EAAEF,iBAAiB,CAAC,aAAD,EAAgB,cAAhB,CAAtC;AAAA,eACE,MAAC,IAAD;AAAM,MAAA,QAAQ,EAAC,IAAf;AAAoB,MAAA,OAAO,EAAC,MAA5B;AAAmC,MAAA,EAAE,EAAE,EAAvC;AAAA,6CAC2B,GAD3B,EAEE,KAAC,IAAD;AAAM,QAAA,IAAI,MAAV;AAAW,QAAA,QAAQ,EAAC,MAApB;AAAA,kBACGA,iBAAiB,CAAC,OAAD,EAAU,MAAV;AADpB,QAFF;AAAA,MADF,EAOE,KAAC,MAAD;AAAQ,MAAA,OAAO,EAAEE,eAAjB;AAAA;AAAA,MAPF;AAAA,IADF;AAWD;;AAED,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAU,GAAM;AAC3B,SACE,KAAC,kBAAD;AAAA,cACE,KAAC,YAAD;AADF,IADF;AAKD,CANM","sourcesContent":["import React from 'react';\nimport {\n  NativeBaseProvider,\n  useColorMode,\n  Text,\n  Button,\n  Center,\n  useColorModeValue,\n} from 'native-base';\n\nfunction UseColorMode() {\n  const { toggleColorMode } = useColorMode();\n  return (\n    <Center flex=\"1\" bg={useColorModeValue('warmGray.50', 'coolGray.800')}>\n      <Text fontSize=\"lg\" display=\"flex\" mb={20}>\n        The active color mode is{' '}\n        <Text bold fontSize=\"18px\">\n          {useColorModeValue('Light', 'Dark')}\n        </Text>\n      </Text>\n      <Button onPress={toggleColorMode}>Toggle</Button>\n    </Center>\n  );\n}\n\nexport const Example = () => {\n  return (\n    <NativeBaseProvider>\n      <UseColorMode />\n    </NativeBaseProvider>\n  );\n};\n"]},"metadata":{},"sourceType":"module"}