Useful to convert HTML attributes to CSS (to convert from chakra to styled components, for example)

html-attributes-to-css-props.js

// yarn add posthtml-parser
import parser from 'posthtml-parser'

// Paste your HTML component here
const html = `
<Box
fontSize="12px"
lineHeight="16px"
textAlign="right"
/>
`

const elements = (parser.default(html.trim()))[0].attrs

const res = Object.entries(elements)
    .reduce((res, [k, v]) => (res.concat(
        `${k.replace(/([A-Z])/g, '-$1').toLowerCase()}: ${v.replace(/[{}]/gis, '')};\n`
    )), ``)

// Output:
// font-size: 12px;
// line-height: 16px;
// text-align: right;
console.log((res))