kitchen-color-studio
Version:
an open-source color editor for designing color system
40 lines • 1.14 kB
JavaScript
import { Space } from 'antd';
import { Accessibility, readable } from "../..";
import { LevaPanel, useControls, useCreateStore } from 'leva';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
export default (function () {
var store = useCreateStore();
var _useControls = useControls({
color1: '#1677FF',
color2: '#001355'
}, {
store: store
}),
color1 = _useControls.color1,
color2 = _useControls.color2;
var result = readable(color1, color2);
return /*#__PURE__*/_jsxs(Space, {
direction: "vertical",
style: {
background: 'var(--leva-colors-elevation2)',
padding: 16
},
children: [/*#__PURE__*/_jsxs(Space, {
align: "start",
children: [/*#__PURE__*/_jsx(LevaPanel, {
fill: true,
flat: true,
store: store,
titleBar: false
}), /*#__PURE__*/_jsx(Accessibility, {
color1: color1,
color2: color2
})]
}), /*#__PURE__*/_jsx("pre", {
children: /*#__PURE__*/_jsx("code", {
children: JSON.stringify(result, null, 4)
})
})]
});
});