@hypernetlabs/web-ui
Version:
Web ui react components for hypernet protocol
73 lines • 2.59 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.GovernanceSwitch = void 0;
const react_1 = __importStar(require("react"));
const core_1 = require("@material-ui/core");
const theme_1 = require("../../theme");
const StyledSwitch = (0, core_1.withStyles)(() => (0, core_1.createStyles)({
root: {
width: 32,
height: 16,
padding: "0px 0px 2px 0px",
display: "flex",
},
switchBase: {
padding: 2,
color: theme_1.colors.GRAY500,
"&$checked": {
transform: "translateX(16px)",
color: theme_1.colors.WHITE,
"& + $track": {
opacity: 1,
backgroundColor: theme_1.colors.GREEN700,
borderColor: theme_1.colors.GREEN700,
},
},
},
thumb: {
width: 12,
height: 12,
boxShadow: "none",
},
track: {
border: `1px solid ${theme_1.colors.GRAY500}`,
borderRadius: 16 / 2,
opacity: 1,
backgroundColor: theme_1.colors.WHITE,
},
checked: {},
}))(core_1.Switch);
const GovernanceSwitch = (props) => {
const { initialValue, onChange } = props;
const [checked, setChecked] = (0, react_1.useState)(initialValue);
(0, react_1.useEffect)(() => {
setChecked(initialValue);
}, [initialValue]);
const handleToggle = (event) => {
const { checked: newChecked } = event.target;
setChecked(newChecked);
onChange(newChecked);
};
return react_1.default.createElement(StyledSwitch, { ...props, checked: checked, onChange: handleToggle });
};
exports.GovernanceSwitch = GovernanceSwitch;
//# sourceMappingURL=GovernanceSwitch.js.map