react-7-segment-display-plus/dist/esm/components/Dot.js

A react component that simulates a 7-segment display

import React from "react";
export const Dot = ({ active = false, color = "red", height = 250, skew = false, }) => {
    const style = {
        height: `${height / 12.5}px`,
        width: `${height / 12.5}px`,
        backgroundColor: color,
        filter: active
            ? "opacity(1) grayscale(0)"
            : "opacity(0.3) grayscale(0.7)",
        borderRadius: "50%",
        margin: "2px",
        transform: skew ? "rotate(45deg)" : "none",
    };
    const dotStyle = {
        display: "flex",
        flexDirection: "row",
        justifyContent: "center",
        alignItems: "end",
        height: `${height}px`,
        width: "fit-content",
        marginBottom: `${height / 12.5}px`,
    };
    return (React.createElement("div", { style: dotStyle },
        React.createElement("div", { style: style })));
};
//# sourceMappingURL=Dot.js.map