All Projects → enigma-io → Boundless

enigma-io / Boundless

Licence: mit
✨ accessible, battle-tested React components with infinite composability

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Boundless

Chart Race React
📊 Seamless bar chart race component for React.
Stars: ✭ 406 (+67.77%)
Mutual labels:  ui-components, react-component
Chakra Ui
⚡️ Simple, Modular & Accessible UI Components for your React Applications
Stars: ✭ 22,745 (+9298.76%)
Mutual labels:  accessible, ui-components
react-accessible-modal
Accessible modal dialog component for React
Stars: ✭ 17 (-92.98%)
Mutual labels:  react-component, accessible
React Multi Select
A Multi Select component built with and for React
Stars: ✭ 111 (-54.13%)
Mutual labels:  ui-components, react-component
Base
React-UI-Kit - frontend library with ReactJS components
Stars: ✭ 18 (-92.56%)
Mutual labels:  ui-components, react-component
Uiw
⚛️ @uiwjs A high quality UI Toolkit, A Component Library for React 16+.
Stars: ✭ 531 (+119.42%)
Mutual labels:  ui-components, react-component
light-ui
A lightly React UI library
Stars: ✭ 38 (-84.3%)
Mutual labels:  react-component, ui-components
React S Alert
Alerts / Notifications for React with rich configuration options
Stars: ✭ 658 (+171.9%)
Mutual labels:  ui-components, react-component
Ui Box
Blazing Fast React UI Primitive
Stars: ✭ 847 (+250%)
Mutual labels:  ui-components, react-component
React Awesome Slider
React content transition slider. Awesome Slider is a 60fps, light weight, performant component that renders an animated set of production ready UI general purpose sliders with fullpage transition support for NextJS and GatsbyJS. 🖥️ 📱
Stars: ✭ 2,343 (+868.18%)
Mutual labels:  ui-components, react-component
Oui
Optimizely's Component Library
Stars: ✭ 228 (-5.79%)
Mutual labels:  ui-components
Yandex Ui
Yandex UI Kit build on React and bem-react
Stars: ✭ 229 (-5.37%)
Mutual labels:  ui-components
Magento2 Cronjobmanager
Cron Job Manager for Magento 2
Stars: ✭ 233 (-3.72%)
Mutual labels:  ui-components
Handorgel
Accessible W3C conform accordion written in ES6.
Stars: ✭ 239 (-1.24%)
Mutual labels:  accessible
Metroset Ui
Windows Forms Metro Skin Style, Make The Applications With Metro Styles. see more https://n-a-r-w-i-n.github.io/MetroSet-UI/
Stars: ✭ 228 (-5.79%)
Mutual labels:  ui-components
Pageindicator
An Instagram like page indicator compatible with RecyclerView and ViewPager.
Stars: ✭ 236 (-2.48%)
Mutual labels:  ui-components
React Kawaii
Cute SVG React Components
Stars: ✭ 2,709 (+1019.42%)
Mutual labels:  react-component
Stpopup
STPopup provides STPopupController, which works just like UINavigationController in popup style, for both iPhone and iPad. It's written in Objective-C and compatible with Swift.
Stars: ✭ 2,517 (+940.08%)
Mutual labels:  ui-components
React Native Htmlview
A React Native component which renders HTML content as native views
Stars: ✭ 2,546 (+952.07%)
Mutual labels:  react-component
Coreui React
CoreUI React.js UI Components. CoreUI for React.js replaces and extends the Bootstrap javascript. Components have been built from scratch as true React.js hook components, without jQuery and unneeded dependencies.
Stars: ✭ 239 (-1.24%)
Mutual labels:  ui-components

Boundless

NPM version Build Status codecov

Installation

# the whole library
npm i boundless --save

# or just a part of it
npm i boundless-button --save

Boundless currently supports IE10+ (needs a Promise polyfill) and all other modern browsers.

Philosophy

Boundless is a UI toolkit that was conceived to abstract away difficult interface patterns. It follows three main guidelines:

  1. Performance is mandatory, not a nice-to-have.
  2. Components should be as customizable as possible.
  3. Components should be as accessible as possible (falling back to WAI-ARIA attributes when necessary.)

The general idea of this library is to provide ready-to-go solutions for things you really wouldn't want to build yourself, not because they're hard... but because they're hard to design right. We are always open to suggestions and strive to keep Boundless as concise and useful as possible.

Reference styles

A precompiled base "skin" is available to use as a base when customizing Boundless for your own project. Some of the components do rely on the reference layout in their styles to function properly. It is designed to be very unopinionated.

You can find the compiled CSS at /public/skin.css. There is a minified version available as well: /public/skin.min.css.

The Boundless website is based on this skin with branding colors, etc.

Branding Boundless

Thanks to the modular nature of Stylus, injecting your own customization to things like accent color(s) is extremely simple.

In your own project's .styl file, define any variable overrides (see variables.styl for what variables can be overridden), then import Boundless's master styl file:

// first, pull in the variables
@require "node_modules/boundless/variables";

// do overrides as desired...
color-accent = red;

// then pull in the rest of the styles
@require "node_modules/boundless/style";

Next time your project's CSS is built, Boundless's CSS will automatically be compiled with the appropriate changes and included in your stylesheet.

Developing Boundless

git clone [email protected]:enigma-io/boundless.git boundless
cd boundless

npm i
npm start # runs the development server so you can make changes live ✨

MIT License

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].