Bosia Bosia v0.6.25

Pages — Storefront Listing

Product listing page with filters, sort and a responsive grid.

The Mercato product listing page (PLP): header, breadcrumb and sort bar, a sticky filter sidebar, and a sortable product grid wired to the shared cart.

Preview

Free carbon-neutral delivery over $50 New season just landed 30-day easy returns

General Store

8 products

Stoneware Dinner Set
New
Kitchen Stoneware Dinner Set (214) $78
Linen Table Throw
Sale
Living Linen Table Throw (88) $44 $58
Cold-Press Olive Oil
Pantry Cold-Press Olive Oil (312) $19
Hand-Thrown Mug
Kitchen Hand-Thrown Mug (156) $24
Wool Storage Basket
Home Wool Storage Basket (64) $52
Beeswax Candle, Fig
Low stock
Living Beeswax Candle, Fig (203) $28
Brass Serving Spoons
Kitchen Brass Serving Spoons (41) $36
Organic Sourdough Mix
Pantry Organic Sourdough Mix (122) $12

Install

bun x bosia@latest add page storefront/listing

Installs page.svelte plus the storefront blocks it composes.

Usage

<script lang="ts">
	import Listing from "$lib/pages/storefront/listing/page.svelte";
</script>

<Listing />

The page binds the sort bar's value and re-sorts the grid (featured, price, top rated). Filters keep their own local state — wire them to your data when you connect a real catalogue.

Source

src/lib/pages/storefront/listing/page.svelte