generate-tailwind-classes.ts85 lines · main
| 1 | const fs = require('fs') |
| 2 | |
| 3 | const color = require('./../../build/css/tw-extend/color') |
| 4 | |
| 5 | /** |
| 6 | * |
| 7 | * Generates a JS file with all the custom tailwind color classes |
| 8 | * |
| 9 | * @param {string} file |
| 10 | * Name of file to be created |
| 11 | */ |
| 12 | function writeJsFile(file: string) { |
| 13 | const backgrounds = Object.keys(color).filter((x) => x.includes('background-')) |
| 14 | const borders = Object.keys(color).filter((x) => x.includes('border-')) |
| 15 | const texts = Object.keys(color).filter((x) => x.includes('foreground-')) |
| 16 | const colors = Object.keys(color).filter( |
| 17 | (x) => |
| 18 | !x.includes('foreground-') && |
| 19 | !x.includes('background-') && |
| 20 | !x.includes('border-') && |
| 21 | !x.includes('colors-') && |
| 22 | !x.includes('variables-') |
| 23 | ) |
| 24 | const palletes = Object.keys(color).filter((x) => x.includes('colors-')) |
| 25 | |
| 26 | // console.log('Example tailwind classes: ') |
| 27 | |
| 28 | function santizieDefaults(x: string) { |
| 29 | // console.log(x) |
| 30 | let value = x |
| 31 | value = value.replace('-DEFAULT', '') |
| 32 | value = value.replace('background', 'bg') |
| 33 | value = value.replace('foreground', 'text') |
| 34 | value = value.replace('colors-', 'bg-') |
| 35 | value = value.toLowerCase() |
| 36 | return value |
| 37 | } |
| 38 | |
| 39 | const result = { |
| 40 | background: [...backgrounds.map((x) => santizieDefaults(x))], |
| 41 | border: [...borders.map((x) => santizieDefaults(x))], |
| 42 | text: [...texts.map((x) => santizieDefaults(x))], |
| 43 | colors: [...colors.map((x) => `bg-${santizieDefaults(x)}`)], |
| 44 | palletes: [...palletes.map((x) => santizieDefaults(x))], |
| 45 | } |
| 46 | |
| 47 | const fileContent = `export default ${JSON.stringify(result, null, 2)};\n` |
| 48 | |
| 49 | fs.writeFileSync(file, fileContent) |
| 50 | |
| 51 | console.log('saved example color classes to : ', file) |
| 52 | } |
| 53 | |
| 54 | writeJsFile('./src/lib/tailwind-demo-classes.ts') |
| 55 | |
| 56 | // example output |
| 57 | // ./src/lib/tailwind-demo-classes.js |
| 58 | |
| 59 | // module.exports = { |
| 60 | // "background": [ |
| 61 | // "bg", |
| 62 | // "bg-selection", |
| 63 | // //.. |
| 64 | // ], |
| 65 | // "border": [ |
| 66 | // "border", |
| 67 | // "border-muted", |
| 68 | // //.. |
| 69 | // ], |
| 70 | // "text": [ |
| 71 | // "text", |
| 72 | // "text-strong", |
| 73 | // //.. |
| 74 | // ], |
| 75 | // "colors": [ |
| 76 | // "bg-destructive-200", |
| 77 | // "bg-destructive-300", |
| 78 | // //.. |
| 79 | // ], |
| 80 | // "palletes": [ |
| 81 | // "bg-black", |
| 82 | // "bg-white", |
| 83 | // //.. |
| 84 | // ] |
| 85 | // } |