https://github.com/tetherto/pearpass-lib-ui-theme-provider
PearPass is an open-source, privacy-first password manager with peer-to-peer syncing and end-to-end encryption. This repository contains shared core components used across the PearPass apps.
https://github.com/tetherto/pearpass-lib-ui-theme-provider
Last synced: 3 months ago
JSON representation
PearPass is an open-source, privacy-first password manager with peer-to-peer syncing and end-to-end encryption. This repository contains shared core components used across the PearPass apps.
- Host: GitHub
- URL: https://github.com/tetherto/pearpass-lib-ui-theme-provider
- Owner: tetherto
- License: apache-2.0
- Created: 2025-12-09T19:15:17.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2026-02-06T08:21:53.000Z (4 months ago)
- Last Synced: 2026-02-06T16:30:55.345Z (4 months ago)
- Language: JavaScript
- Homepage: https://pass.pears.com/
- Size: 146 KB
- Stars: 0
- Watchers: 0
- Forks: 7
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Notice: NOTICE
Awesome Lists containing this project
README
# pearpass-lib-ui-theme-provider
A React theme provider library for Pearpass applications that supplies consistent colors, themes and styling capabilities across both Desktop and React Native projects.
## Table of Contents
- [Features](#features)
- [Installation](#installation)
- [Usage Examples](#usage-examples)
- [Dependencies](#dependencies)
- [Related Projects](#related-projects)
## Features
- Support for both React and React Native applications
- Easy-to-use ThemeProvider component
- Color class with multiple variant support
- Styled-components integration
## Installation
```bash
npm install pearpass-lib-ui-theme-provider
```
## Usage Examples
### React Web
```jsx
import React from 'react';
import { ThemeProvider } from 'pearpass-lib-ui-theme-provider';
import styled from 'styled-components';
const StyledComponent = styled.div`
background-color: ${props => props.theme.colors.primary400.mode1};
color: ${props => props.theme.colors.white.mode1};
`;
function App() {
return (
This component uses the theme colors
);
}
```
### React Native
```jsx
import React from 'react';
import { ThemeProvider } from 'pearpass-lib-ui-theme-provider/native';
import styled from 'styled-components/native';
const StyledComponent = styled.View`
background-color: ${props => props.theme.colors.primary400.mode1};
`;
const StyledText = styled.Text`
color: ${props => props.theme.colors.white.mode1};
`;
function App() {
return (
This component uses the theme colors
);
}
```
## Dependencies
- [styled-components](https://www.npmjs.com/package/styled-components) - peer dependency
## Depended Submodules
The following sibling submodules must be present in the workspace (they are not declared as npm dependencies):
- [`tether-dev-docs`](../tether-dev-docs)
## Related Projects
- [pearpass-app-mobile](https://github.com/tetherto/pearpass-app-mobile) - A mobile app for PearPass, a password manager
- [pearpass-app-desktop](https://github.com/tetherto/pearpass-app-desktop) - A desktop app for PearPass, a password
- [pearpass-lib-ui-react-native-components](https://github.com/tetherto/pearpass-lib-ui-react-native-components) - A library of React Native UI components for PearPass
- [pearpass-lib-ui-react-components](https://github.com/tetherto/pearpass-lib-ui-react-components) - A library of React UI components for PearPass
- [tether-dev-docs](https://github.com/tetherto/tether-dev-docs) - Documentations and guides for developers
## License
This project is licensed under the Apache License, Version 2.0. See the [LICENSE](./LICENSE) file for details.