root = Card([header, threshold, searchForm, inventorySection], "card", "column", "m")
header = CardHeader("Low inventory", "Items at or below the reorder threshold")
threshold = Callout("warning", "Reorder threshold: 20 units", "Any item with 20 or fewer units remaining is flagged automatically for reordering.")
searchForm = Form("search-inventory", searchButtons, [searchField])
searchField = FormControl("Search items", searchInput, "Find by item name or SKU")
searchInput = Input("search", "e.g. Coffee, FIL-204")
searchButtons = Buttons([searchBtn])
searchBtn = Button("Search", null, "primary")
inventorySection = Card([sectionTitle, inventoryTable], "sunk", "column", "s")
sectionTitle = Heading("Items running low", "h3")
inventoryTable = Table([itemCol, skuCol, remainingCol, statusCol, actionCol])
itemCol = Col("Item", ["Colombian Coffee Beans", "Paper Filter #4", "Whole Milk 1L", "Disposable Cups 12oz", "Cup Lids"], "string")
skuCol = Col("SKU", ["COF-001", "FIL-204", "MLK-110", "CUP-312", "LID-313"], "string")
remainingCol = Col("Remaining (units)", [8, 12, 15, 19, 6], "number")
statusCol = Col("Status", ["Critical", "Low", "Low", "Low", "Critical"], "string")
actionCol = Col("", ["Reorder", "Reorder", "Reorder", "Reorder", "Reorder"], "action")