mirror of
https://github.com/hanzoai/o11y-components.git
synced 2026-10-30 14:54:15 +00:00
* fix(package): better compatibility with cjs/esm * refactor(components): try optimize bundle output * refactor(index): use tailwind config * feat(vite): migrate from tsdown * feat(biome): migrate from eslint * fix(vite): last config to correct d.ts of cjs
28 lines
645 B
TypeScript
28 lines
645 B
TypeScript
import { getTransformedSpacingTokens } from '../utils.js';
|
|
|
|
const spacing = getTransformedSpacingTokens();
|
|
const spacingKeys = Object.keys(spacing);
|
|
|
|
function Spacing() {
|
|
return (
|
|
<div className="p-4">
|
|
<h1 className="mb-5 text-lg font-bold text-vanilla-100">Spacing Scale</h1>
|
|
|
|
{spacingKeys.map((size) => {
|
|
const value = spacing[size as keyof typeof spacing];
|
|
|
|
return (
|
|
<div key={size} className="mb-4">
|
|
<span className="text-vanilla-100">
|
|
{size} - {value}
|
|
</span>
|
|
<div className={`bg-slate-50 h-4`} style={{ width: value }}></div>
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Spacing;
|