@orca-fe/pocket
Version:
UI components by orca-team
35 lines • 1 kB
JavaScript
import React from 'react';
import { jsxs as _jsxs } from "react/jsx-runtime";
import { jsx as _jsx } from "react/jsx-runtime";
var Ruler = props => {
var _props$size = props.size,
size = _props$size === void 0 ? 50 : _props$size,
_props$num = props.num,
num = _props$num === void 0 ? 3 : _props$num;
return /*#__PURE__*/_jsx("div", {
style: {
position: 'relative',
width: size * num,
height: size * num
},
children: new Array(num * num).fill(0).map((_, index) => {
var row = Math.floor(index / num);
var col = index % num;
return /*#__PURE__*/_jsxs("div", {
style: {
position: 'absolute',
width: size,
height: size,
top: col * size,
left: row * size,
border: '1px solid #CCCCCC',
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
},
children: [size, "px"]
}, index);
})
});
};
export default Ruler;