mic-inspector
Version:
A react inspector which a most similar of Chorme DevTools inspector
37 lines (36 loc) • 1.55 kB
JavaScript
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
import React, { useState } from 'react';
import { Radix } from './types';
import { useStyles } from './use-styles';
import { PropertyValue } from '../property-value';
import { toNumberString, radixCircle } from './locale';
/**
* Number value
* @param param0 NumberValueProps
*/
export function NumberValue(_a) {
var { value, className, radix = Radix.Decimal } = _a, props = __rest(_a, ["value", "className", "radix"]);
const title = toNumberString(value, radix);
const [valueString, setValueString] = useState(title);
const [currentRadix, setCurrentRadix] = useState(radix);
const onClick = ({ altKey, metaKey }) => {
// if not press the alt key or meta key
if (!altKey && !metaKey) {
return;
}
const r = radixCircle[radixCircle.indexOf(currentRadix) + 1];
setValueString(toNumberString(value, r));
setCurrentRadix(r);
};
return (React.createElement(PropertyValue, Object.assign({ className: useStyles(className), title: title, onClick: onClick }, props), valueString));
}