A set of composable & declarative DSLs.
| Package | Intro | Version |
|---|---|---|
@composize/dom |
DSL for DOM |  |
@composize/excel |
DSL for ExcelJS |  |
☝️ Click the links above to view the README for each package.
For the full API definition, please visit https://composize.github.io/composize.
import { fragment, element, text, style, listener } from '@composize/dom';
const node = fragment(() => {
style({
'.card': {
border: '1px solid #ccc',
padding: '16px',
marginBottom: '12px',
}
});
function Card(title: string, content: string) {
element('div', { class: 'card' }, () => {
element('h2', { class: 'card-title' }, title);
element('p', content);
});
}
for (let index = 0; index < 3; index++) {
Card('Card title', 'This is a simple card.');
}
element('button', { style: { backgroundColor: 'blue' } }, () => {
text('Click me');
listener('click', () => {
console.log('Button clicked!');
});
});
});import { cell, row, workbook } from '@composize/excel';
// +--------+--------+--------+
// | | title2 |
// | title1 +--------+
// | | title3 |
// +--------+--------+--------+
// | value1 | |
// +--------+ value2 +
// | value3 | |
// +--------+-----------------+
const book = workbook(() => {
row(() => {
cell('title1', { rowSpan: 2, colSpan: 2 });
cell('title2');
});
row(() => {
cell('title3');
});
row(() => {
cell('value1');
cell('value2', { rowSpan: 2, colSpan: 2 });
})
row(() => {
cell('value3');
})
});
book.xlsx.writeFile('./sheet.xlsx');Learn about the latest improvements.
Thanks to JetBrains for supporting us free open source licenses.
