nice-ui
Version:
React design system, components, and utilities
36 lines (35 loc) • 1.04 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.Label = void 0;
const React = require("react");
const nano_theme_1 = require("nano-theme");
const blockClass = (0, nano_theme_1.rule)({
...nano_theme_1.theme.font.ui1.mid,
d: 'inline-flex',
b: 0,
mar: 0,
bd: 0,
justifyContent: 'space-between',
alignItems: 'center',
bxz: 'border-box',
pad: '.3em .5em',
bdrad: '.7em',
'&+&': {
marl: '8px',
},
});
const useBlockClass = (0, nano_theme_1.makeRule)((theme) => ({
col: theme.g(0.25),
bg: theme.g(0.96),
boxShadow: theme.isLight ? 'none' : `0 0 0 1px ${theme.g(0.1, 0.16)}`,
'&:hover': {
col: theme.g(0.25),
bg: theme.g(0.92),
boxShadow: theme.isLight ? 'none' : `0 0 0 1px ${theme.g(0.1, 0.24)}`,
},
}));
const Label = ({ children }) => {
const dynamicBlockClass = useBlockClass();
return React.createElement("span", { className: blockClass + dynamicBlockClass }, children);
};
exports.Label = Label;