/7-segment-display

a react component for 7 segment display

Primary LanguageJavaScript

Seven Segment Display

A minimal react component for seven segment display.

Installation

npm

npm install 7-segment-display --save

yarn

yarn add 7-segment-display

Playground

Example

import React from 'react';
import SevenSegmentDisplay from "7-segment-display"

function App() {

  return (
    <div className="App">
        <SevenSegmentDisplay number={3}></SevenSegmentDisplay>
        <SevenSegmentDisplay ledColorOn={"green"} number={7}></SevenSegmentDisplay>
        <SevenSegmentDisplay ledBorder={"transparent"} ledColorOn={"black"} ledColorOff={"black"} number={3}></SevenSegmentDisplay>
    </div>
  );
}

export default App;

Notes

The component can only display 1 digit number (0 ~ 9). Anything else will display an invalid indicator ( G segment ). To-Do: A multiple digits component

Thanks :D