@b1dr/xip-ui/dist/source/components/button/index.jsx

A UI library for SolidJS with Themescura

import { splitProps, mergeProps } from 'solid-js';
import styles from './style.module.css';
const getVariantStyles = (variant) => ({
    '--variant-o': `var(--${variant}-o)`,
    '--variant-b': `var(--${variant}-b)`,
    '--variant-s-6': `var(--${variant}-s-6)`,
    '--variant-s-4': `var(--${variant}-s-4)`
});
export const Button = (props) => {
    const [local, rest] = splitProps(props, ['variant', 'class', 'classList', 'style']);
    const newProps = mergeProps({
        style: {
            ...(local.variant ? getVariantStyles(local.variant) : {}),
            ...local.style,
        },
        class: `${styles.button} ${local.class}`,
        classList: {
            ...local.classList,
            [styles.variant]: !!local.variant,
        }
    }, rest);
    return (<button {...newProps}/>);
};