{"_id":"@carimus/react-native-theme-provider","_rev":"14-363e42af2bc83165442305521e9bc6a9","name":"@carimus/react-native-theme-provider","dist-tags":{"latest":"1.1.0"},"versions":{"1.0.0":{"name":"@carimus/react-native-theme-provider","version":"1.0.0","keywords":["react","react-native","theming"],"license":"MIT","_id":"@carimus/react-native-theme-provider@1.0.0","maintainers":[{"name":"carimus-deploy-bot","email":"carimus-deploy-bot@carimus.com"},{"name":"bericp1","email":"bericp1@gmail.com"},{"name":"nicog-carimus","email":"nicog@carimus.com"},{"name":"shugands","email":"dans@carimus.com"},{"name":"bryanmcarimus","email":"bryanm@carimus.com"},{"name":"spencerr","email":"spencerr@carimus.com"}],"homepage":"https://github.com/Carimus/react-native-theme-provider#readme","bugs":{"url":"https://github.com/Carimus/react-native-theme-provider/issues"},"dist":{"shasum":"a531c83529eb5fe99ec50f2e0321987985f9cc10","tarball":"https://registry.npmjs.org/@carimus/react-native-theme-provider/-/react-native-theme-provider-1.0.0.tgz","fileCount":9,"integrity":"sha512-tLRRYG6kREl4DqZUDdnCv0bTRC0+22Fa044DWV9qlJlZ8LnHy3rJi/Nej+Mkh9ibqwrAIAIabFHudToNpZivKQ==","signatures":[{"sig":"MEQCICbNw06kY0GVSQNMg/1cwAIAR5JFtc7B+QdK/vd87E3+AiArKN2+JosqFmjzsrSLkcfQ5WRm1S4Q+yvWhScWUeOEBg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":348667,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdi+89CRA9TVsSAnZWagAAtkgP/iZUjHPXd26PJnlPoS5U\nMAN5d/aYX4kLUwPfkdUWEQ9nYX3BGfRXdVSk56QkW0L7qliXqfHFRUlg1BIF\n2LUnYYwkYgvls+yhx392s6mwAt5995c9ofWgJU7qOQE9Y1oM4w98ETel2ex0\njr9B6uIvMRMVj3iNQBnDVTtZPFDTEERwRY3gEV8ZXgDMgjUMuKO0PNhiAiUE\naBlK4OdlGruY3GP/iyooTZbFB+uajRMlakQvrFZzGh53AyIY6iXkZX1FaXAe\nNIscrqY+PZIzGp82T7ro0de/su+lTRdETD/eULRPYZETudNQT8KjQkVnaO7g\niQRXD6SgGKLYGiZcW7mbuTXFfN9ZPu1GmxdRAQPCLuYC7+t7jgT4aXusvZCT\nIum1qgieYDr3iQ1CB7klLHxb+dfnOctnJC7+JtDL0sX0FrcSU6ROiL0dirnu\nMqmSH2DSuGG9C6vcTvwPfzIdsE3rvVnenfQuvRC+gAFnlZfLBflDX8MKxiBk\nsjDfXIRNV9WdQZZxqzMmOB+PeznDxXpeLRT/jVNg8C7vsSQmILc6rUHBBsp6\nPjFDvJI2ksFR63G7dHyxHeigZqENSWES1WznnI/W6EuBeeBPnhrohWez/44+\n6hgR8r6wpzhr8f2VnYluxe1m5rNpb7p8YbIHKgw33uNKabFumnMNPSMe9bEz\n2MUa\r\n=WbJU\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","husky":{"hooks":{"commit-msg":"commitlint -E HUSKY_GIT_PARAMS","pre-commit":"lint-staged"}},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"gitHead":"d9cc37503b27302c9275297825ae293fc1bd76bc","private":false,"scripts":{"lint":"eslint '{*,{src,docs}/**/*,__{tests,mocks}__/**/*}.{js,jsx}' || true","test":"jest --passWithNoTests","commit":"git-cz","pretty":"prettier --write '{*,{src,docs}/**/*,__{tests,mocks}__/**/*}.{json,md,yml,js,jsx}'","fixcode":"yarn run pretty","release":"yarn run semantic-release","release-ci":"echo 'unsafe-perm = true' > ./.npmrc && yarn run semantic-release && rm -rf ./.npmrc","test:watch":"jest --watch","semantic-release":"semantic-release"},"_npmUser":{"name":"bericp1","email":"bericp1@gmail.com"},"commitlint":{"extends":["@commitlint/config-conventional"]},"repository":{"url":"git+https://github.com/Carimus/react-native-theme-provider.git","type":"git"},"_npmVersion":"6.4.1","description":"A wrapper around @callstack/react-theme-provider with some RN-specific goodies.","directories":{},"lint-staged":{"{*,{src,docs}/**/*,__{tests,mocks}__/**/*}.{js,jsx}":["prettier --write","eslint","git add"],"{*,{src,docs}/**/*,__{tests,mocks}__/**/*}.{json,md,yml}":["prettier --write","git add"]},"_nodeVersion":"10.15.3","dependencies":{"hoist-non-react-statics":"^3.3.0","@callstack/react-theme-provider":"^3.0.3"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^24.9.0","husky":"^3.0.5","react":"^16.3.0","eslint":"^6.4.0","prettier":"^1.18.2","babel-jest":"^24.9.0","commitizen":"^4.0.3","lint-staged":"^9.3.0","babel-eslint":"^10.0.3","babel-loader":"^8.0.6","@babel/runtime":"^7.6.2","@commitlint/cli":"^8.2.0","semantic-release":"^15.13.24","eslint-plugin-jest":"^22.17.0","eslint-plugin-node":"^10.0.0","@babel/preset-react":"^7.0.0","eslint-plugin-babel":"^5.3.0","eslint-plugin-react":"^7.14.3","eslint-plugin-import":"^2.18.2","eslint-plugin-promise":"^4.2.1","eslint-config-prettier":"^6.3.0","eslint-config-standard":"^14.1.0","eslint-plugin-standard":"^4.0.1","cz-conventional-changelog":"^3.0.2","eslint-plugin-react-hooks":"^2.0.1","eslint-plugin-react-native":"^3.7.0","@commitlint/config-conventional":"^8.2.0"},"peerDependencies":{"react":"^16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-native-theme-provider_1.0.0_1569451837026_0.6443501479221434","host":"s3://npm-registry-packages"}},"1.1.0":{"name":"@carimus/react-native-theme-provider","version":"1.1.0","keywords":["react","react-native","theme","provider"],"license":"MIT","_id":"@carimus/react-native-theme-provider@1.1.0","maintainers":[{"name":"bericp1","email":"bericp1@gmail.com"},{"name":"bryanmcarimus","email":"bryanm@carimus.com"},{"name":"carimus-deploy-bot","email":"carimus-deploy-bot@carimus.com"},{"name":"nicog-carimus","email":"nicog@carimus.com"},{"name":"shugands","email":"dans@carimus.com"},{"name":"spencerr","email":"spencerr@carimus.com"}],"homepage":"https://github.com/Carimus/react-native-theme-provider#readme","bugs":{"url":"https://github.com/Carimus/react-native-theme-provider/issues"},"dist":{"shasum":"f001270cb57ffd3220b4f39420eb671ae38ceba7","tarball":"https://registry.npmjs.org/@carimus/react-native-theme-provider/-/react-native-theme-provider-1.1.0.tgz","fileCount":11,"integrity":"sha512-sLUaHDnSZGHCx1CoAJoX0OH5iCQ1dfuEb14zBSAZRLmulSOkVlJUZhBPRYF/NSdT3srlhlwkS0aTUCgoTsF39Q==","signatures":[{"sig":"MEUCIQCMblmKqFDspYB1wGUmQcWMxJGcGErzhM/t3Ev1e8+P3QIgaEGvszzvnHOeceE8XnYBB2XrqTrsijkOul3/sLP7hxs=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":19297,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdjO4tCRA9TVsSAnZWagAAwDoP/RrxQ8ZEG5LYMhe71B2p\nxJTFlnh+yS2LwAJRU8Or1JY0RiPhtO4BSK9Po/iFI08+i7ZOvQT17KvhIyVA\n+UqYZ37jD0c5rVUdrXn2J4I8xaVPYhg2iCBxCjvyBq5yxDUgGsDDCRnlepuA\nsKIyZZzGCsp2SS0V9SHBicp7X5ZYKTC3mZU2YIkzokzN470brsqWPRactStF\nMn4FXn+O2jvgz5jT+ljyYe6A30Ibl8/eRpQT0FnaurCxf313ERbGYlnP8oyt\nr004EfvnKO/tfEGM8v7k7GxQlHyGLZAIKkqoKMV4i4hKtCJDPJJbGQSuLmYF\naX+DFJ3nKIjXxv/pMrwfuO/E/bfIoWpw8KrQzZ0fhXphYVX3Q8vgVrT9cesJ\nKmC9LFw9B0KKO9g0lvhgYOlLsKWcwGM/m7LNlSa4BFFwwWb8yy2StsSp469W\nFjMCrtht5auIlHoD00bky+kzuaUARRAuRqSEF139fQPIs35APHisdiu/OsEn\n1lEYY9SPxWnYMixhfkO8/I8Ysd+QImOSzo33TyogUj3UJLwaZqzE/qjLP6ou\nEcAcLwoNpLUCCtLzjSrksr8/sIDs+mBCNhJw2Cbot0D9LylgWRyx4Nm7Uw6d\nyZykb9Usr37r6LIgMnBm1ba8L3oZNaVXShw8jpH5ReOY3/HTz55oS7vthiBy\n8go7\r\n=Tkep\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","husky":{"hooks":{"commit-msg":"commitlint -E HUSKY_GIT_PARAMS","pre-commit":"lint-staged"}},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"gitHead":"5be8c5ce2c2c014efd571932bd27b769d15a5369","private":false,"scripts":{"lint":"eslint '{*,{src,docs}/**/*,__{tests,mocks}__/**/*}.{js,jsx}' || true","test":"jest --passWithNoTests","commit":"git-cz","pretty":"prettier --write '{*,{src,docs}/**/*,__{tests,mocks}__/**/*}.{json,md,yml,js,jsx}'","fixcode":"yarn run pretty","release":"yarn run semantic-release","release-ci":"echo 'unsafe-perm = true' > ./.npmrc && yarn run semantic-release && rm -rf ./.npmrc","test:watch":"jest --watch","semantic-release":"semantic-release"},"_npmUser":{"name":"carimus-deploy-bot","email":"carimus-deploy-bot@carimus.com"},"commitlint":{"extends":["@commitlint/config-conventional"]},"repository":{"url":"git+https://github.com/Carimus/react-native-theme-provider.git","type":"git"},"_npmVersion":"6.11.3","description":"A wrapper around @callstack/react-theme-provider with some RN-specific goodies.","directories":{},"lint-staged":{"{*,{src,docs}/**/*,__{tests,mocks}__/**/*}.{js,jsx}":["prettier --write","eslint","git add"],"{*,{src,docs}/**/*,__{tests,mocks}__/**/*}.{json,md,yml}":["prettier --write","git add"]},"_nodeVersion":"10.16.3","dependencies":{"hoist-non-react-statics":"^3.3.0","@callstack/react-theme-provider":"^3.0.3"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^24.9.0","husky":"^3.0.5","react":"^16.3.0","eslint":"^6.4.0","prettier":"^1.18.2","babel-jest":"^24.9.0","commitizen":"^4.0.3","lint-staged":"^9.3.0","babel-eslint":"^10.0.3","babel-loader":"^8.0.6","@babel/runtime":"^7.6.2","@commitlint/cli":"^8.2.0","semantic-release":"^15.13.24","eslint-plugin-jest":"^22.17.0","eslint-plugin-node":"^10.0.0","@babel/preset-react":"^7.0.0","eslint-plugin-babel":"^5.3.0","eslint-plugin-react":"^7.14.3","eslint-plugin-import":"^2.18.2","eslint-plugin-promise":"^4.2.1","eslint-config-prettier":"^6.3.0","eslint-config-standard":"^14.1.0","eslint-plugin-standard":"^4.0.1","cz-conventional-changelog":"^3.0.2","eslint-plugin-react-hooks":"^2.0.1","eslint-plugin-react-native":"^3.7.0","@commitlint/config-conventional":"^8.2.0"},"peerDependencies":{"react":"^16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-native-theme-provider_1.1.0_1569517100560_0.716072136255874","host":"s3://npm-registry-packages"}}},"time":{"created":"2019-09-25T22:50:36.958Z","modified":"2025-05-28T17:44:16.950Z","1.0.0":"2019-09-25T22:50:37.141Z","1.1.0":"2019-09-26T16:58:20.652Z"},"bugs":{"url":"https://github.com/Carimus/react-native-theme-provider/issues"},"license":"MIT","homepage":"https://github.com/Carimus/react-native-theme-provider#readme","keywords":["react","react-native","theme","provider"],"repository":{"url":"git+https://github.com/Carimus/react-native-theme-provider.git","type":"git"},"description":"A wrapper around @callstack/react-theme-provider with some RN-specific goodies.","maintainers":[{"email":"nicog@carimus.com","name":"nicog-carimus"},{"email":"dans@carimus.com","name":"shugands"},{"email":"bryanm@carimus.com","name":"bryanmcarimus"},{"email":"carimus-deploy-bot@carimus.com","name":"carimus-deploy-bot"},{"email":"digital-security@carimus.com","name":"carimusprivate"}],"readme":"# `@carimus/react-native-theme-provider`\n\nA React Native package that wraps [`@callstack/react-theme-provider`](https://github.com/callstack/react-theme-provider)\nto add in some React Native-specific goodies.\n\nSee the `react-theme-provider`'s docs for usage details.\n\n## Additions\n\n### `withStyleSheet`\n\nWhen you call `createTheming`, the returned object will also contain a `withStyleSheet` property which creates a\nHOC when called with styles that injects a `styleSheet` into the component props.\n\nIn short this allows you to declare a component's stylesheet as a function of the theme, analogous to Material UI's\n[`withStyles`](https://material-ui.com/styles/api/#withstyles-styles-options-higher-order-component).\n\n#### Usage\n\n```\nwithStyleSheet(styles, [options]) => ((YourComponent) => ThemedComponent)\n```\n\nCalling `withStyleSheet` returns a higher order component which you call with your component in order to inject\na stylesheet based on the theme into your component.\n\n#### Arguments\n\n1. `styles` (`(function(theme: object, props?: object): object) | object`): If an object, `styles` is passed through\n `StyleSheet.create()` and given straight to the wrapped component as `styleSheet`. If it's a function, it will be\n called with the `theme` (and possibly the props as the second arg if `options.withProps` is set to `true`, **not\n the default**) and it should return an object which will be passed through `StyleSheet.create()` and given to the\n wrapped component as `styleSheet`.\n2. `options` (`object` _optional_):\n - `options.name` (`string`; _optional_): Used when generating the display name of the wrapper component, otherwise\n `YourComponent.displayName || YourComponent.name` is used.\n - `options.propName` (`string`; _optional_, defaults to `'styleSheet'`): The name of the prop to pass the\n generated and compiled stylesheet as to `YourComponent`\n - `options.forwardTheme` (`boolean`; _optional_, defaults to `true`): If `true` (the default), the theme will be\n passed into `YourComponent` on the `theme` prop.\n - `options.withProps` (`boolean`; _optional_, defaults to `false`): This has no effect if `styles` is an object.\n If `true`, the incoming props will be passed to your `styles` function as the second argument.\n **Important note:** this disables caching of the compiled stylesheet. The performance hit is marginal but if\n performance is crucial to this component, you should instead prefer to conditionally apply styles in your\n styleSheet in the render function of your component based on the props of interest, and, of course,\n appropriately implement `shouldComponentUpdate` or similar.\n - `options.propagate` (`boolean`; _optional_, defaults to `true`): If `true` (the default), will also wrap\n `YourComponent` in the `ThemeProvider` so that the final theme (i.e. including any merged in styles) will\n propagate into the subtree. This isn't strictly necessary if the theme is never modified and you have the\n `ThemeProvider` at the root of your app, but if you manually update the `theme` by providing a `theme` prop\n which will be merged into the contextual theme per the behaviour of `withTheme`, then you need to leave this\n as `true` in order for themed components in the subtree to use the same modified theme. If you don't want this\n (i.e. if you want components in the subtree to use the original theme), set this to `false`.\n\n#### Notes\n\n- The returned function is a HOC which you use to wrap your component. All props will be forwarded to your component\n with the addition of the `styleSheet` and `theme` props (both are configurable via `options`).\n- `theme` is the original theme object that was passed to `createTheming`\n- `styleSheet` is the result of `StyleSheet.create()` called on the `styles` object (or the result of calling\n `styles` if it's a function given the `theme` and optionally the `props`).\n- If `styles` is a function and `options.withProps` is false, the result of calling `styles` with a given theme\n is cached. `styles` won't be called again to generate the `styleSheet` on future renders unless the `theme` changes.\n- `withStyleSheet` implies `withTheme` so all behaviour that `withTheme` exhibits applies to `withStyleSheet` as well.\n For example, the component can be called with a `theme` prop and that `theme` will be merged into the contextual\n theme.\n\n#### Example\n\n**`theme.js`**\n\n```js\nimport { createTheming } from '@carimus/react-native-theme-provider';\n\nconst theme = {\n palette: {\n background: '#000000',\n foreground: '#FFFFFF',\n },\n};\n\nexport const {\n ThemeProvider,\n withTheme,\n useTheme,\n withStyleSheet,\n} = createTheming(theme);\n```\n\n**`FooComponent.js`**\n\n```js\nimport { View, Text } from 'react-native';\n\nimport { withStyleSheet } from './theme';\n\nconst styles = (theme) => ({\n root: {\n backgroundColor: theme.palette.background,\n },\n text: {\n color: theme.palette.foreground,\n },\n});\n\nfunction FooComponent({ styleSheet, children }) {\n return (\n \n {children}\n \n );\n}\n\nexport default withStyleSheet(styles)(FooComponent);\n```\n\n## TODO\n\n- [ ] \\[`withStyleSheet`\\] Advanced caching in order to cache compiled styleSheets even when `withProps` is `true`.\n- [ ] Some generic HOC that isn't dependent on a `theme` (i.e. isn't a result of `createTheming`) that can still\n somehow accept a theme dynamically from context and apply/merge it in to a default theme. For generic components\n to except a theme somehow but have sane defaults.\n","readmeFilename":"README.md"}