import { h, Component, createRef } from 'preact' import htm from 'htm' import { signal } from 'preact/signals' const html = htm.bind(h) export class ChecklistGroup { static sort(a, b) {//{{{ if (a.Order < b.Order) return -1 if (a.Order > b.Order) return 1 return 0 }//}}} constructor(data) {//{{{ Object.keys(data).forEach(key => { if (key == 'Items') this.items = data[key].map(itemData => new ChecklistItem(itemData) ).sort(ChecklistItem.sort) else this[key] = data[key] }) }//}}} } export class ChecklistItem { static sort(a, b) {//{{{ if (a.Order < b.Order) return -1 if (a.Order > b.Order) return 1 return 0 }//}}} constructor(data) {//{{{ Object.keys(data).forEach(key => { this[key] = data[key] }) }//}}} } export class Checklist extends Component { render({ groups }) {//{{{ if (groups.length == 0) return groups.sort(ChecklistGroup.sort) let groupElements = groups.map(group => html`<${ChecklistGroupElement} group=${group} />`) return html`