7-segment-display

1.1.5 • Public • Published

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

Package Sidebar

Install

npm i 7-segment-display

Weekly Downloads

1

Version

1.1.5

License

ISC

Unpacked Size

15.8 kB

Total Files

13

Last publish

Collaborators

  • steliosarakliotis