Notably Polite Mariner

    predix-ui

    0.0.23 • Public • Published

    predix-ui

    Unoffical React components that implement Predix's Design System CSS.

    Build Status style: styled-components Dependency Status npm downloads npm version Module Formats

    For more information on Predix UI visit https://www.predix-ui.com/#/home

    Why? Well the predix-ui library is built with Polymer. This project attempts to bring those components to React.

    Usage

    To use this library simply install it with npm or yarn:

    $ npm install predix-ui

    Then import the components you want to use.

    If you're not using a module bundler or package manager we also have a global ("UMD") build hosted on the unpkg CDN. Simply add the following <script> tag to the bottom of your HTML file:

    <script src="https://unpkg.com/predix-ui/dist/predix-ui.min.js"></script>
    import { Card } from 'predix-ui';                  
    <Card headerText='My Card'>
        This is a card
    </Card>

    Theme

    The component styles are all in separate .css files or you can use the entire theme.

    <link rel='stylesheet prefetch' href='https://unpkg.com/predix-ui/dist/predix-ui.min.css'/>
    <link rel='stylesheet prefetch' href='https://unpkg.com/predix-ui/dist/px-dark-theme.min.css'/>

    Starter Project

    You can get started quickly with this starter project.

    <div class="glitch-embed-wrap" style="height: 450px; width: 100%;">
      <iframe src="https://glitch.com/embed/#!/embed/jps-react-predix-ui-starter?path=src/components/App/index.js&previewSize=100" alt="jps-react-predix-ui-starter on glitch" style="height: 100%; width: 100%; border: 0;"></iframe>
    </div>

    License

    See LICENSE for more details.

    Install

    npm i predix-ui

    DownloadsWeekly Downloads

    77

    Version

    0.0.23

    License

    none

    Unpacked Size

    6.09 MB

    Total Files

    1004

    Last publish

    Collaborators

    • jonniespratley