Orion ·

UI Components that work seamlessly in multiple UI frameworks

• HTML Components Components are based on Web Component APIs at the core. This means they are compatible with any modern browser and framework.

• React & Angular 1.x Adapters are available out of the box. This means developers will not know they are using Web Components under the hood.

• Rigorously Tested All components have unit, integration, and visual regression tests baked in. All upgrades can be done without API breaks and knowing exactly how the components have changed.

Examples

We have several examples on the website. Here is a simple example of using Orion in React.js:

import React from 'react';
import ReactDOM from 'react-dom';
import Button from '@orion-ui/react-components/lib/2016-12-01/button';

class HelloMessage extends React.Component {
  render() {
    return <div>Hello <Button>{this.props.name}</Button>;
  }
}

ReactDOM.render(
  <HelloMessage name="John" />,
  document.getElementById('container')
);

This example will render "Hello John" into the page and the button will be perfectly styled and look the same between any framework which uses an Orion button.

Installation

Orion is available in a few different packages on npm:

• @orion-ui/react-components is the react library
• @orion-ui/angular is the angular 1.x library
• @orion-ui/components is the vanilla web component library

We recommend using a bundler liked webpack or browserify to consume the orion libraries. See the sample applications on the marketing site for fully functioning integrations.

Contributing

The Orion project is meant to evolve with feedback - the project and its users greatly appreciate any thoughts on ways to improve the design or features. Read below to see how you can take part and contribute:

Code of Conduct

Autodesk has adopted a Code of Conduct that we expect everyone who participates to adhere to. Please read the full text so that you can understand all the details.

Contributing Guide

Read our guide to learn about the development process and how to work with the core team.

License

Orion is Apache-2.0 licensed