Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/retailmenot/anchor
A design system library from RetailMeNot.
https://github.com/retailmenot/anchor
component-library design-system react ui ui-components
Last synced: 2 months ago
JSON representation
A design system library from RetailMeNot.
- Host: GitHub
- URL: https://github.com/retailmenot/anchor
- Owner: RetailMeNot
- License: other
- Created: 2019-01-23T17:04:15.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2020-09-04T00:30:51.000Z (over 4 years ago)
- Last Synced: 2024-04-26T14:21:21.974Z (9 months ago)
- Topics: component-library, design-system, react, ui, ui-components
- Language: TypeScript
- Homepage: https://anchor.retailmenot.design/
- Size: 3.82 MB
- Stars: 20
- Watchers: 18
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.md
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
A React Design System from RetailMeNot
----
Anchor is a robust yet lightweight series of UI components, utilities, and styles that form the foundation of great user experiences.
### Get Started
**NPM**
```ssh
npm i --save @retailmenot/anchor styled-components
```
**Yarn**
```ssh
yarn add @retailmenot/anchor styled-components
```
**Usage**
```jsx
// VENDOR
import { ThemeProvider } from '@xstyled/styled-components';
import { RootTheme, Typography } from '@retailmenot/anchor';
const Root = () => (
Hello World!
);
ReactDOM.render(Root, document.getElementById('app'));
```
[View our docs site for more usage guidelines](https://anchor.retailmenot.design/)
### Why Anchor?
* **Isomorphic** - We are an isomorphic-first library which doesn't require a Webpack expert
* **Convention Over Configuration** - Out of the box this library solves common challenges faced by UI engineers without a ton of configuration
* **Composability** - Rather than writing redundant overrides, we provide consistent attributes to easily change the look and feel of our components
* **Community** - We promote people-centric solutions and promote a culture of learners
* **Representational** - We try to use native DOM APIs so the better you know the DOM the easier this library is to use
### Contribute
Check out our [contributing guide](https://github.com/RetailMeNot/anchor/blob/master/CONTRIBUTING.md) until our docs site goes live with that content.