Current collected state Current
Observed since 20 Oct, 21:35 UTC
No superseded metadata states collected. Unchanged observations do not create new revisions.
Back to packageRELEASE DETAILS
0.0.1
npm99blocks-ui
Test: React Native UI Toolkit For Mobile Platforms
Published14 Feb 2025
Direct dependencies39
Transitive dependenciesNot calculated
README
Current package documentation99blocks-ui
React Native Design System This documentation provides an overview of the folder structure and components of the React Native Design System. It is organized into several key folders that serve specific purposes in the development of the design system.
Folder Structure arduino Copy code src ├── components │ ├── base │ └── themed ├── config │ ├── ThemeProvider.js │ ├── withTheme.js │ └── useTheme.js ├── helpers │ ├── typography.js │ └── fonts.js └── json └── design.json
Overview of Folders
- src/components This folder contains all UI components for the design system, organized into two subfolders:
base: Components that do not rely on the system theme. These are general-purpose components that can be styled independently.
themed: Components that are designed to work with the system theme. They adapt their styles based on the current theme settings.
- src/config This folder includes configuration files related to theming and context:
ThemeProvider.js: A context provider that manages and distributes the current theme across the application.
withTheme.js: A higher-order component (HOC) for server-side rendering (SSR) that allows components to access the theme.
useTheme.js: A hook for client-side theme management, providing an easy way to access the current theme within functional components.
- src/helpers This folder contains utility files for styling:
typography.js: Contains text styles and typography-related constants, ensuring consistency in font sizes, weights, and line heights across the application.
fonts.js: Handles font application based on the platform (Android or iOS), ensuring that the correct fonts are used according to the operating system.
- src/json This folder contains design tokens:
design.json: A JSON file that defines design tokens such as colors, spacing, and other design-related variables. This file serves as a centralized source for design decisions and can be easily updated as the design evolves.
Downloads & popularity
Awaiting observationsNo metric observations yet
Download counts and popularity will appear here as the collector receives them.
Declared dependencies 66
Native requirements39 direct targetsNot calculated transitive count
| Package / target | Requirement | Relationship |
|---|---|---|
@react-native-community/blurEnvironment{
"local_name": "@react-native-community/blur",
"alias": false,
"peer_metadata": null
} | ^4.4.1 | runtime |
phosphor-react-nativeEnvironment{
"local_name": "phosphor-react-native",
"alias": false,
"peer_metadata": null
} | 2.1.2 | runtime |
react-native-gesture-handlerEnvironment{
"local_name": "react-native-gesture-handler",
"alias": false,
"peer_metadata": null
} | ^2.20.0 | runtime |
react-native-reanimatedEnvironment{
"local_name": "react-native-reanimated",
"alias": false,
"peer_metadata": null
} | ^3.15.4 | runtime |
@babel/coreEnvironment{
"local_name": "@babel/core",
"alias": false,
"peer_metadata": null
} | ^7.25.2 | development |
@babel/plugin-proposal-export-namespace-fromEnvironment{
"local_name": "@babel/plugin-proposal-export-namespace-from",
"alias": false,
"peer_metadata": null
} | ^7.18.9 | development |
@babel/preset-envEnvironment{
"local_name": "@babel/preset-env",
"alias": false,
"peer_metadata": null
} | ^7.25.4 | development |
@babel/preset-reactEnvironment{
"local_name": "@babel/preset-react",
"alias": false,
"peer_metadata": null
} | ^7.24.7 | development |
@react-native/babel-presetEnvironment{
"local_name": "@react-native/babel-preset",
"alias": false,
"peer_metadata": null
} | 0.74.87 | development |
@storybook/addon-controlsEnvironment{
"local_name": "@storybook/addon-controls",
"alias": false,
"peer_metadata": null
} | ^8.2.8 | development |
@storybook/addon-docsEnvironment{
"local_name": "@storybook/addon-docs",
"alias": false,
"peer_metadata": null
} | 8.1.1 | development |
@storybook/addon-essentialsEnvironment{
"local_name": "@storybook/addon-essentials",
"alias": false,
"peer_metadata": null
} | 8.2.9 | development |
@storybook/addon-react-native-webEnvironment{
"local_name": "@storybook/addon-react-native-web",
"alias": false,
"peer_metadata": null
} | 0.0.24 | development |
@storybook/react-webpack5Environment{
"local_name": "@storybook/react-webpack5",
"alias": false,
"peer_metadata": null
} | 8.2.8 | development |
babel-loaderEnvironment{
"local_name": "babel-loader",
"alias": false,
"peer_metadata": null
} | ^9.1.3 | development |
babel-plugin-react-native-webEnvironment{
"local_name": "babel-plugin-react-native-web",
"alias": false,
"peer_metadata": null
} | ^0.19.12 | development |
css-loaderEnvironment{
"local_name": "css-loader",
"alias": false,
"peer_metadata": null
} | ^7.1.2 | development |
file-loaderEnvironment{
"local_name": "file-loader",
"alias": false,
"peer_metadata": null
} | ^6.2.0 | development |
html-loaderEnvironment{
"local_name": "html-loader",
"alias": false,
"peer_metadata": null
} | ^5.1.0 | development |
html-webpack-pluginEnvironment{
"local_name": "html-webpack-plugin",
"alias": false,
"peer_metadata": null
} | ^5.6.0 | development |
http-serverEnvironment{
"local_name": "http-server",
"alias": false,
"peer_metadata": null
} | ^14.1.1 | development |
node-polyfill-webpack-pluginEnvironment{
"local_name": "node-polyfill-webpack-plugin",
"alias": false,
"peer_metadata": null
} | ^4.0.0 | development |
reactEnvironment{
"local_name": "react",
"alias": false,
"peer_metadata": null
} | ^18.2.0 | development |
react-domEnvironment{
"local_name": "react-dom",
"alias": false,
"peer_metadata": null
} | ^18.2.0 | development |
react-nativeEnvironment{
"local_name": "react-native",
"alias": false,
"peer_metadata": null
} | 0.71.11 | development |
react-native-builder-bobEnvironment{
"local_name": "react-native-builder-bob",
"alias": false,
"peer_metadata": null
} | ^0.37.0 | development |
react-native-gesture-handlerEnvironment{
"local_name": "react-native-gesture-handler",
"alias": false,
"peer_metadata": null
} | 2.9.0 | development |
react-native-linear-gradientEnvironment{
"local_name": "react-native-linear-gradient",
"alias": false,
"peer_metadata": null
} | 2.8.3 | development |
react-native-portalizeEnvironment{
"local_name": "react-native-portalize",
"alias": false,
"peer_metadata": null
} | ^1.0.7 | development |
react-native-svgEnvironment{
"local_name": "react-native-svg",
"alias": false,
"peer_metadata": null
} | 13.8.0 | development |
react-native-webEnvironment{
"local_name": "react-native-web",
"alias": false,
"peer_metadata": null
} | ^0.18.12 | development |
react-native-web-linear-gradientEnvironment{
"local_name": "react-native-web-linear-gradient",
"alias": false,
"peer_metadata": null
} | ^1.1.2 | development |
react-reduxEnvironment{
"local_name": "react-redux",
"alias": false,
"peer_metadata": null
} | ^7.2.1 | development |
storybookEnvironment{
"local_name": "storybook",
"alias": false,
"peer_metadata": null
} | 8.2.9 | development |
style-loaderEnvironment{
"local_name": "style-loader",
"alias": false,
"peer_metadata": null
} | ^4.0.0 | development |
webpackEnvironment{
"local_name": "webpack",
"alias": false,
"peer_metadata": null
} | ^5.94.0 | development |
webpack-bundle-analyzerEnvironment{
"local_name": "webpack-bundle-analyzer",
"alias": false,
"peer_metadata": null
} | ^4.10.2 | development |
webpack-cliEnvironment{
"local_name": "webpack-cli",
"alias": false,
"peer_metadata": null
} | ^5.1.4 | development |
webpack-dev-serverEnvironment{
"local_name": "webpack-dev-server",
"alias": false,
"peer_metadata": null
} | ^5.1.0 | development |
@babel/coreEnvironment{
"local_name": "@babel/core",
"alias": false,
"peer_metadata": null
} | * | peer |
@babel/preset-envEnvironment{
"local_name": "@babel/preset-env",
"alias": false,
"peer_metadata": null
} | * | peer |
@babel/preset-reactEnvironment{
"local_name": "@babel/preset-react",
"alias": false,
"peer_metadata": null
} | * | peer |
@nnshared/nntrackingsdkEnvironment{
"local_name": "@nnshared/nntrackingsdk",
"alias": false,
"peer_metadata": null
} | * | peer |
@storybook/addon-controlsEnvironment{
"local_name": "@storybook/addon-controls",
"alias": false,
"peer_metadata": null
} | * | peer |
@storybook/addon-docsEnvironment{
"local_name": "@storybook/addon-docs",
"alias": false,
"peer_metadata": null
} | * | peer |
babel-loaderEnvironment{
"local_name": "babel-loader",
"alias": false,
"peer_metadata": null
} | * | peer |
babel-plugin-react-native-webEnvironment{
"local_name": "babel-plugin-react-native-web",
"alias": false,
"peer_metadata": null
} | * | peer |
css-loaderEnvironment{
"local_name": "css-loader",
"alias": false,
"peer_metadata": null
} | * | peer |
file-loaderEnvironment{
"local_name": "file-loader",
"alias": false,
"peer_metadata": null
} | * | peer |
html-webpack-pluginEnvironment{
"local_name": "html-webpack-plugin",
"alias": false,
"peer_metadata": null
} | * | peer |
node-polyfill-webpack-pluginEnvironment{
"local_name": "node-polyfill-webpack-plugin",
"alias": false,
"peer_metadata": null
} | * | peer |
reactEnvironment{
"local_name": "react",
"alias": false,
"peer_metadata": null
} | * | peer |
react-domEnvironment{
"local_name": "react-dom",
"alias": false,
"peer_metadata": null
} | * | peer |
react-nativeEnvironment{
"local_name": "react-native",
"alias": false,
"peer_metadata": null
} | * | peer |
react-native-gesture-handlerEnvironment{
"local_name": "react-native-gesture-handler",
"alias": false,
"peer_metadata": null
} | * | peer |
react-native-linear-gradientEnvironment{
"local_name": "react-native-linear-gradient",
"alias": false,
"peer_metadata": null
} | * | peer |
react-native-portalizeEnvironment{
"local_name": "react-native-portalize",
"alias": false,
"peer_metadata": null
} | * | peer |
react-native-svgEnvironment{
"local_name": "react-native-svg",
"alias": false,
"peer_metadata": null
} | * | peer |
react-native-webEnvironment{
"local_name": "react-native-web",
"alias": false,
"peer_metadata": null
} | * | peer |
react-native-web-linear-gradientEnvironment{
"local_name": "react-native-web-linear-gradient",
"alias": false,
"peer_metadata": null
} | * | peer |
storybookEnvironment{
"local_name": "storybook",
"alias": false,
"peer_metadata": null
} | * | peer |
style-loaderEnvironment{
"local_name": "style-loader",
"alias": false,
"peer_metadata": null
} | * | peer |
webpackEnvironment{
"local_name": "webpack",
"alias": false,
"peer_metadata": null
} | * | peer |
webpack-bundle-analyzerEnvironment{
"local_name": "webpack-bundle-analyzer",
"alias": false,
"peer_metadata": null
} | * | peer |
webpack-cliEnvironment{
"local_name": "webpack-cli",
"alias": false,
"peer_metadata": null
} | * | peer |
webpack-dev-serverEnvironment{
"local_name": "webpack-dev-server",
"alias": false,
"peer_metadata": null
} | * | peer |
Distribution files
1 collectedDistribution 1
Source fileSource distribution
Checksums from source
{
"integrity": "sha512-Nf64uGFS6EiYo+Z84BFt1ftjsyNFRPASN825pFgMw4JvDxsg+Nj5EbQYZAd9QP9UTltdFSYsjPRB5AMeahkVyw==",
"shasum": "64b834bb5b59fe5c620b25e79c86e827396ddae2",
"tarball": "https://registry.npmjs.org/99blocks-ui/-/99blocks-ui-0.0.1.tgz",
"fileCount": 1096,
"unpackedSize": 2557338,
"signatures": [
{
"keyid": "SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U",
"sig": "MEYCIQCK4C1zFZ+zk20y+nCzAQVFK3C+9ije6ZvcJz4PJeYV8gIhAPmLO2tcc0wK0sMUAz1tQ3nUEF9wbPrgpxWk+F2YiG7U"
}
]
}Metadata history
Meaningful changesRecord identity
package_version:51c7233a6b85f8acbeb7df76ddf7dce8da52eda3ff5f06f261c35c20503f265a