import { defineConfig } from 'unocss'

// https://github.com/MellowCo/unocss-preset-weapp
import presetWeapp from 'unocss-preset-weapp'
import { defaultAttributes, transformerAttributify, transformerClass } from 'unocss-preset-weapp/transformer'

const transformRules = {
    ':': '-',
    '.': '_dl_',
    '/': '_sl_',
    '%': '_pes_',
    '!': '_el_',
    '#': '_wn_',
    '(': '_lbl_',
    ')': '_lbr_',
    '[': '_lfl_',
    ']': '_lfr_',
    $: '_do_',
    ',': '_lco_',
    '=': '_eqe_',
}

export default defineConfig({
    presets: [
        // https://github.com/MellowCo/unocss-preset-weapp
        presetWeapp(),
    ],
    shortcuts: [
        {
            bg: 'bg-[#F4F5F7]',
            'border-base': 'border border-[#eee]',
            'flex-center': 'flex justify-center items-center',
            'text-c0': 'text-[#ffffff]',
            'text-c1': 'text-[#181818]',
            'text-c2': 'text-[#333333]',
            'text-c3': 'text-[#B2B2B2]',
            'text-c4': 'text-[#CCCCCC]',
        },
    ],
    transformers: [
        // https://github.com/MellowCo/unocss-preset-weapp/tree/main/src/transformer/transformerAttributify
        transformerAttributify({
            attributes: [...defaultAttributes, 'icon'],
            transformRules,
        }) as any,

        // https://github.com/MellowCo/unocss-preset-weapp/tree/main/src/transformer/transformerClass
        transformerClass({
            transformRules,
        }),
    ],
})
