react-planner - :pencil2: A React Component for plans design

  •        679

react-planner is a React component which can be used to draw model buildings. Drag & drop from a catalog of customizable and ready-to-use objects, you can start from 2D wireframes and land on 3D models. As a developer you can provide your users with new objects by adding them to the catalog.

https://github.com/cvdlab/react-planner#readme
https://github.com/cvdlab/react-planner

Dependencies:

@mapbox/react-range : 0.0.7
area-polygon : 1.0.1
convert-units : 2.3.4
html-webpack-plugin : 3.2.0
immutable : 3.8.2
immutablediff : 0.4.4
immutablepatch : 0.4.2
polylabel : 1.0.2
prop-types : 15.6.1
react-icons : 2.2.7
react-redux : 5.0.7
react-svg-pan-zoom : 2.16.1
redux : 4.0.0
shortid : 2.2.8

Tags
Implementation
License
Platform

   




Related Projects

Storybook - Build bulletproof UI components faster in React, Vue, Angular, and more.

  •    Typescript

Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components. Storybook runs outside of your app. This allows you to develop UI components in isolation, which can improve component reuse, testability, and development speed. You can build quickly without having to worry about application-specific dependencies.

rebass - :atom_symbol: React UI component library & design system, built with styled-components and styled-system

  •    Javascript

React UI component library & design system, built with styled-system, with support for styled-components & emotion. Rebass is a library of highly-composable, primitive UI components for React, built with styled-components to keep styles isolated and reduce the need to write custom CSS in your application. Based upon a configurable design system, Rebass‘s props API makes building consistent, responsive web apps simpler and faster.

react-mt-svg-lines - A React.js wrapper component to animate the line stroke in SVGs

  •    Javascript

The component wraps your SVG and animates the stroke-dashoffset property on every path element within. To accomplish this, it injects a style tag with a generated string of CSS. For a description of the technique, see this article. Require MtSvgLines into your component (you can import it under any name)...


react-native-material-kit - Bringing Material Design to React Native

  •    Javascript

A set of UI components, in the purpose of introducing Material Design to apps built with React Native, quickly and painlessly. First, cd to your RN project directory, and install RNMK through rnpm . If you don't have rnpm, you can install RNMK from npm with the command npm i -S react-native-material-kit and link it manually (see below).

Chakra UI - Simple, Modular & Accessible UI Components for your React Applications

  •    Javascript

Chakra UI is a simple, modular and accessible component library that gives you the building blocks you need to build your React applications. It strictly follows WAI-ARIA standards for all components. It is Themeable, Composable and Optimized for multiple color modes.

react-native-material-design - React Native UI Components for Material Design

  •    Javascript

React Native components which implement Material Design. This repository has been heavily developed on top of the mrn project started by @binggg. Improvements include support for the latest React Native versions, many bug fixes, extra components, backward compatibility to Android SDK API 16 and more.

dumb-react

  •    Javascript

Dumb React is a collection of React components used to create a static (dumb) website screen. Why do this? Many React tutorials or boilerplates I've encountered are either too basic ("here's a button component!") or more often too complex ("here's a simple babel typescript redux cssmodules isometric oh god oh god oh god..."). I wanted to be able to draw a straight line from how a simple component ("atom" in atomic design speak) makes its way into a full page. There are a ton of different ways to build reusable components and put dynamic content inside them, and many teams — even ones that aren't building highly-interactive web apps that would actually benefit from a tool like React — are reaching for React to create component-driven experiences. So in that spirit, I wanted to create a demo that shows how to construct a whole screen (even if it's a dumb, static one) out of React components.

mrn - Material React Native (MRN) - A Material Design style React Native component library.

  •    Javascript

This repository is no longer maintained because there is no time to maintain. Recommend another one: React Native Material Design, which is heavily developed on top of the mrn project.

react-material - Material design components written with React.js and React Style

  •    HTML

Material design components written with React.js and React Style. Thanks to the Polymer team for providing a base set of elements that I could re-implement.

design-system-react - Salesforce Lightning Design System in React

  •    Javascript

Welcome to the project! 👋 This library is the React implementation of the Salesforce Lightning Design System. This library has a peer dependency on @salesforce-ux/design-system, react, and react-dom. It is tested with React 16 and has a stable API despite its version number. Please polyfill this library in order to meet your target environment needs. Please view Create React App Setup for more information on using this library with Create React App.

storybook - Interactive UI component dev & test: React, React Native, Vue, Angular

  •    Javascript

Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components. Storybook runs outside of your app. This allows you to develop UI components in isolation, which can improve component reuse, testability, and development speed. You can build quickly without having to worry about application-specific dependencies.

react-three-next - React Three Fiber, Nextjs, Tailwind starter

  •    Javascript

First Load JS of 74Kb. This starter will automatically pick the marked R3F components and inject them into a canvas layout so we can navigate seamlessly between the pages with some dynamic dom and canvas content without reloading or creating a new canvas every time. Inform the nextjs page that the component is a Threejs component. For that, simply add the r3f property to the parent component.

react-inlinesvg - An SVG loader component for ReactJS

  •    Javascript

But there's an alternative that sidesteps these issues: load the SVG with an XHR request and then embed it in the document. That's what this component does. The SVG <use> element can be used to achieve something similar to this component. See this article for more information and this table for browser support and caveats.

material-ui - React components that implement Google's Material Design.

  •    Javascript

React components that implement Google's Material Design. Material-UI is available as an npm package.

shards-react - ⚛️A beautiful and modern React design system.

  •    Javascript

Shards React is a free, beautiful and modern React UI kit based on Shards. Getting started with Shards React is fairly simple. You can download Shards React via the official website, here on GitHub as a release package or by using a package manager such as Yarn or NPM.






We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.