create-cartbase 0.1.6 → 0.1.7

package/template/app/src/app/gallery/_lib/registry.ts

@@ -1,401 +0,0 @@
-/**
- * The catalogue of everything the storefront library has, or has to have.
- *
- * This is the working board. Every entry has a permanent slug, so a component
- * has an address you can be sent to: /gallery/hero, /gallery/product-card.
- * That is the point — we pick one, open it, shape it, agree it, mark it done,
- * and move to the next.
- *
- * Groups follow the STOREFRONT, not our folder names. A merchant thinks in
- * "the product page", "the cart", "the sections I drop on the home page",
- * never in "the products family barrel".
- *
- * Status is the truth of the sweep, and `missing` entries are as important as
- * built ones: they are the sections the library still owes a merchant, and
- * they are why this board doubles as the roadmap.
- */
-
-export type Status =
-  /** Agreed with Alexander, values stripped to tokens, finished. */
-  | "done"
-  /** Code exists and renders, but we have never looked at it together. */
-  | "built"
-  /** Does not exist yet. Building it is the work. */
-  | "missing"
-
-export type Entry = {
-  slug: string
-  name: string
-  status: Status
-  /** What it is, in the words we would use talking about it. */
-  summary: string
-  /** Where it lives, for when the answer is "open the file". */
-  source?: string
-}
-
-export type Group = {
-  slug: string
-  name: string
-  blurb: string
-  entries: Entry[]
-}
-
-export const GROUPS: Group[] = [
-  {
-    slug: "sections",
-    name: "Sections",
-    blurb:
-      "The blocks a merchant arranges to build a page. None of these exist yet — this is the biggest hole in the library and the reason a fresh install still looks like a catalogue rather than a shop.",
-    entries: [
-      {
-        slug: "hero",
-        name: "Hero",
-        status: "missing",
-        summary:
-          "The first screen. Image or video, a headline, one action. Every store has one and every store's is different, so this is the hardest one to get right and the most valuable.",
-      },
-      {
-        slug: "announcement-bar",
-        name: "Announcement bar",
-        status: "missing",
-        summary: "The thin strip above the header. Shipping promise, promotion, or nothing.",
-      },
-      {
-        slug: "featured-products",
-        name: "Featured products",
-        status: "missing",
-        summary:
-          "A hand-picked or automatic row of products on a page that is not the catalogue. Needs a data source the platform may not expose yet.",
-      },
-      {
-        slug: "featured-collection",
-        name: "Featured collection",
-        status: "missing",
-        summary: "One collection presented as a block, with its own image and copy.",
-      },
-      {
-        slug: "image-with-text",
-        name: "Image with text",
-        status: "missing",
-        summary: "The workhorse editorial block. Picture one side, words the other, both orders.",
-      },
-      {
-        slug: "rich-text",
-        name: "Rich text",
-        status: "missing",
-        summary: "A block of formatted words on its own. The About paragraph, the shipping note.",
-      },
-      {
-        slug: "social-proof",
-        name: "Social proof",
-        status: "missing",
-        summary: "Review summary, star rating, press logos, customer photos.",
-      },
-      {
-        slug: "newsletter",
-        name: "Newsletter signup",
-        status: "missing",
-        summary: "Email capture. Needs a real destination, which is a platform question, not a design one.",
-      },
-      {
-        slug: "faq",
-        name: "FAQ",
-        status: "missing",
-        summary: "Questions and answers, collapsible. The accordion primitive exists; the section does not.",
-      },
-      {
-        slug: "footer",
-        name: "Footer",
-        status: "missing",
-        summary:
-          "Menus, payment badges, legal. Today the example app hand-rolls one, which means every merchant would too.",
-      },
-      {
-        slug: "header",
-        name: "Header and navigation",
-        status: "missing",
-        summary:
-          "Logo, menu, search, cart. Also hand-rolled in the example app today. Probably the second thing to build after the hero.",
-      },
-    ],
-  },
-  {
-    slug: "listing",
-    name: "Catalogue and listing",
-    blurb: "Everything between the home page and a single product.",
-    entries: [
-      {
-        slug: "product-card",
-        name: "Product card",
-        status: "built",
-        summary:
-          "The one card. Search results, collections and related rails all render it, so a mistake here is a mistake in five places.",
-        source: "products/product-preview.tsx",
-      },
-      {
-        slug: "thumbnail",
-        name: "Thumbnail",
-        status: "built",
-        summary: "Product imagery at four ratios, plus the fallback when there is no image.",
-        source: "products/thumbnail.tsx",
-      },
-      {
-        slug: "preview-price",
-        name: "Price on a card",
-        status: "built",
-        summary: "The cheapest price, and the struck-through original when reduced.",
-        source: "products/preview-price.tsx",
-      },
-      {
-        slug: "product-grid",
-        name: "Product grid",
-        status: "built",
-        summary:
-          "Not a component, an arrangement. Cards with different title lengths sitting together is the real test of the card.",
-        source: "store/store-template.tsx",
-      },
-      {
-        slug: "sort-select",
-        name: "Sort control",
-        status: "built",
-        summary: "Newest, price up, price down.",
-        source: "store/sort-select.tsx",
-      },
-      {
-        slug: "pagination",
-        name: "Pagination",
-        status: "built",
-        summary: "Page through a long catalogue.",
-        source: "store/pagination.tsx",
-      },
-      {
-        slug: "collection-page",
-        name: "Collection page",
-        status: "built",
-        summary: "A collection's own page: its title, its description, its products.",
-        source: "store/collection-template.tsx",
-      },
-      {
-        slug: "category-page",
-        name: "Category page",
-        status: "built",
-        summary: "The same for a category.",
-        source: "store/category-template.tsx",
-      },
-      {
-        slug: "grid-skeleton",
-        name: "Loading grid",
-        status: "built",
-        summary: "What the catalogue looks like before it arrives.",
-        source: "store/skeleton-product-grid.tsx",
-      },
-      {
-        slug: "filters",
-        name: "Filters",
-        status: "missing",
-        summary:
-          "Filter by size, colour, price, availability. Does not exist, and no real clothing store ships without it.",
-      },
-    ],
-  },
-  {
-    slug: "product-page",
-    name: "Product page",
-    blurb: "The page that sells. Every part of it is a separate decision.",
-    entries: [
-      {
-        slug: "product-page-template",
-        name: "The whole page",
-        status: "built",
-        summary: "The assembled product page, which is what a merchant sees first.",
-        source: "products/product-template.tsx",
-      },
-      {
-        slug: "image-gallery",
-        name: "Image gallery",
-        status: "built",
-        summary: "The image column. Has to hold one photo and eight equally well.",
-        source: "products/image-gallery.tsx",
-      },
-      {
-        slug: "product-info",
-        name: "Title and description",
-        status: "built",
-        summary: "Name, subtitle, collection, description.",
-        source: "products/product-info.tsx",
-      },
-      {
-        slug: "product-price",
-        name: "Price",
-        status: "built",
-        summary: "The price on the page itself, including the reduced state.",
-        source: "products/product-price.tsx",
-      },
-      {
-        slug: "option-select",
-        name: "Option picker",
-        status: "built",
-        summary:
-          "Size, colour, whatever the merchant defined. Breaks first when a product has twelve variants.",
-        source: "products/option-select.tsx",
-      },
-      {
-        slug: "product-actions",
-        name: "Add to cart",
-        status: "built",
-        summary: "The button that earns the money, plus its sold-out and adding states.",
-        source: "products/product-actions.tsx",
-      },
-      {
-        slug: "purchase-options",
-        name: "One-time or subscription",
-        status: "built",
-        summary: "Buy once, or on a repeating plan.",
-        source: "products/purchase-options.tsx",
-      },
-      {
-        slug: "product-tabs",
-        name: "Details tabs",
-        status: "built",
-        summary: "Materials, shipping, returns.",
-        source: "products/product-tabs.tsx",
-      },
-      {
-        slug: "mobile-actions",
-        name: "Mobile buy bar",
-        status: "built",
-        summary: "The sticky bar on a phone. Most of your traffic will see this and not the button above.",
-        source: "products/mobile-actions.tsx",
-      },
-      {
-        slug: "related-products",
-        name: "Related products",
-        status: "built",
-        summary: "The rail under the fold.",
-        source: "products/related-products.tsx",
-      },
-      {
-        slug: "stock-state",
-        name: "Availability",
-        status: "missing",
-        summary:
-          "Nothing today tells a customer a product is sold out before they press the button. Found while building the gallery.",
-      },
-    ],
-  },
-  {
-    slug: "cart",
-    name: "Cart",
-    blurb:
-      "Twenty-one pieces, the largest family in the library and the one with the most merchandising in it.",
-    entries: [
-      { slug: "cart-drawer", name: "Cart drawer", status: "built", summary: "The whole slide-out cart.", source: "cart-drawer/cart-drawer.tsx" },
-      { slug: "cart-item", name: "Cart line", status: "built", summary: "One product in the cart, with its variant and quantity.", source: "cart-drawer/item/index.tsx" },
-      { slug: "cart-empty", name: "Empty cart", status: "built", summary: "What an empty cart says. A wasted screen in most stores.", source: "cart-drawer/empty.tsx" },
-      { slug: "cart-summary", name: "Totals breakdown", status: "built", summary: "Subtotal, shipping, tax, discount, total.", source: "cart-drawer/summary-breakdown.tsx" },
-      { slug: "cart-cross-sell", name: "Cross-sell", status: "built", summary: "Carousel and sidebar variants of add-this-too.", source: "cart-drawer/cross-sell-carousel.tsx" },
-      { slug: "cart-free-gift", name: "Free gift", status: "built", summary: "The gift unlocked by spend.", source: "cart-drawer/free-gift.tsx" },
-      { slug: "cart-tiered-progress", name: "Spend progress", status: "built", summary: "Add 20 EUR more for free shipping.", source: "cart-drawer/tiered-progress.tsx" },
-      { slug: "cart-gift-wrap", name: "Gift wrap", status: "built", summary: "The paid wrapping option.", source: "cart-drawer/gift-wrap.tsx" },
-      { slug: "cart-notes", name: "Order note", status: "built", summary: "The free-text box.", source: "cart-drawer/notes.tsx" },
-      { slug: "cart-rewards", name: "Loyalty points", status: "built", summary: "Points earned on this order.", source: "cart-drawer/rewards-points.tsx" },
-      { slug: "cart-payment-badges", name: "Payment badges", status: "built", summary: "The card logos that reassure.", source: "cart-drawer/payment-badges.tsx" },
-      { slug: "cart-promo-banner", name: "Promo banner", status: "built", summary: "The message strip inside the cart.", source: "cart-drawer/promo-banner.tsx" },
-      { slug: "cart-sticky-footer", name: "Checkout bar", status: "built", summary: "The pinned total and checkout button.", source: "cart-drawer/sticky-footer.tsx" },
-    ],
-  },
-  {
-    slug: "checkout",
-    name: "Checkout",
-    blurb:
-      "Twenty pieces. Mostly locked, because this is where money moves and a merchant editing it breaks selling.",
-    entries: [
-      { slug: "checkout-page", name: "The whole checkout", status: "built", summary: "Address, delivery, payment, review.", source: "checkout/checkout-client.tsx" },
-      { slug: "address-form", name: "Address form", status: "built", summary: "The longest form in the product.", source: "checkout/address-form.tsx" },
-      { slug: "shipping-methods", name: "Delivery choices", status: "built", summary: "The rates a customer picks from.", source: "checkout/shipping-method-list.tsx" },
-      { slug: "payment-methods", name: "Payment choices", status: "built", summary: "Cards, offline tenders, and their fees.", source: "checkout/payment-method-list.tsx" },
-      { slug: "order-summary", name: "Order summary", status: "built", summary: "What you are about to buy, priced.", source: "checkout/order-summary.tsx" },
-      { slug: "discount-section", name: "Discount code", status: "built", summary: "The box, and what a wrong code says.", source: "checkout/discount-section.tsx" },
-      { slug: "gift-card-section", name: "Gift card", status: "built", summary: "Redeeming a gift card at checkout.", source: "checkout/gift-card-section.tsx" },
-      { slug: "payment-button", name: "Pay button", status: "built", summary: "The last button in the funnel.", source: "checkout/payment-button.tsx" },
-      { slug: "locker-selectors", name: "Locker and office pickers", status: "built", summary: "BoxNow and Econt pickup points, on a map.", source: "checkout/boxnow-locker-selector.tsx" },
-      { slug: "company-details", name: "Company details", status: "built", summary: "VAT number and company name for business buyers.", source: "checkout/company-details.tsx" },
-      { slug: "checkout-errors", name: "Error states", status: "built", summary: "What a declined card, a bad address and a lost session look like.", source: "checkout/error-message.tsx" },
-    ],
-  },
-  {
-    slug: "order",
-    name: "After the order",
-    blurb: "The thank-you page and the order record. The part everyone forgets to design.",
-    entries: [
-      { slug: "order-confirmation", name: "Thank-you page", status: "built", summary: "The whole confirmation screen.", source: "order/order-completed-template.tsx" },
-      { slug: "order-header", name: "Confirmation header", status: "built", summary: "Order number, date, the reassurance line.", source: "order/order-confirmation-header.tsx" },
-      { slug: "order-items", name: "What you bought", status: "built", summary: "The line items on the confirmation.", source: "order/order-items-list.tsx" },
-      { slug: "order-totals", name: "What you paid", status: "built", summary: "The money breakdown.", source: "order/order-totals.tsx" },
-      { slug: "order-address", name: "Where it goes", status: "built", summary: "Shipping and billing addresses.", source: "order/order-address-card.tsx" },
-      { slug: "order-delivery", name: "Delivery", status: "built", summary: "Carrier, tracking, expected date.", source: "order/order-delivery-card.tsx" },
-      { slug: "order-payment", name: "How you paid", status: "built", summary: "Method and status.", source: "order/order-payment-card.tsx" },
-      { slug: "order-timeline", name: "Order timeline", status: "built", summary: "What has happened to this order so far.", source: "order/order-timeline.tsx" },
-      { slug: "order-help", name: "Need help", status: "built", summary: "Contact and returns.", source: "order/order-help-section.tsx" },
-    ],
-  },
-  {
-    slug: "reviews",
-    name: "Reviews",
-    blurb: "Stars, distribution, the writing flow and the photo lightbox.",
-    entries: [
-      { slug: "review-widget", name: "Reviews block", status: "built", summary: "The whole reviews section on a product page.", source: "reviews-ui/review-widget.tsx" },
-      { slug: "star-badge", name: "Stars", status: "built", summary: "The rating badge, the star row, the distribution bars.", source: "reviews-ui/star-badge.tsx" },
-      { slug: "review-list", name: "Review list", status: "built", summary: "Written reviews, with the photo lightbox.", source: "reviews-ui/review-list.tsx" },
-      { slug: "review-wizard", name: "Write a review", status: "built", summary: "The flow a customer goes through, including photo upload.", source: "reviews-ui/review-wizard.tsx" },
-    ],
-  },
-  {
-    slug: "global",
-    name: "Global",
-    blurb: "Things that appear on every page regardless of what the page is.",
-    entries: [
-      { slug: "cart-button", name: "Cart button", status: "built", summary: "The header cart with its count.", source: "common/cart-button-client.tsx" },
-      { slug: "country-select", name: "Country picker", status: "built", summary: "Region switching.", source: "common/country-select.tsx" },
-      { slug: "language-select", name: "Language picker", status: "built", summary: "Locale switching.", source: "common/language-select.tsx" },
-      { slug: "consent-banner", name: "Cookie consent", status: "built", summary: "The banner and its settings link. Legally required, visually hated.", source: "tracking/consent-banner.tsx" },
-      { slug: "skeletons", name: "Loading states", status: "built", summary: "What every surface looks like before its data lands.", source: "common/skeleton.tsx" },
-      { slug: "search", name: "Search", status: "missing", summary: "There is a search page, but no search component a merchant can place." },
-    ],
-  },
-  {
-    slug: "primitives",
-    name: "Primitives",
-    blurb:
-      "The smallest components, the ones every other component is built from. Get the button wrong and everything above inherits the mistake. These are components, not tokens — the tokens live in the design system, which is a layer below all of this.",
-    entries: [
-      { slug: "button", name: "Button", status: "built", summary: "Every variant and size. Add-to-cart is this component.", source: "primitives/ui/button.tsx" },
-      { slug: "input", name: "Input", status: "built", summary: "Checkout is mostly this, repeated.", source: "primitives/ui/input.tsx" },
-      { slug: "select", name: "Select", status: "built", summary: "The dropdown.", source: "primitives/ui/select.tsx" },
-      { slug: "field", name: "Field", status: "built", summary: "Label, input, error, in one.", source: "primitives/field.tsx" },
-      { slug: "tabs", name: "Tabs", status: "built", summary: "Used by the product details.", source: "primitives/ui/tabs.tsx" },
-      { slug: "accordion", name: "Accordion", status: "built", summary: "Collapsible rows. The FAQ section will be built on this.", source: "primitives/ui/accordion.tsx" },
-      { slug: "dialog", name: "Dialog", status: "built", summary: "Modal windows.", source: "primitives/ui/dialog.tsx" },
-      { slug: "sheet", name: "Sheet", status: "built", summary: "The slide-in panel the cart drawer uses.", source: "primitives/ui/sheet.tsx" },
-      { slug: "popover", name: "Popover", status: "built", summary: "Small floating panels.", source: "primitives/ui/popover.tsx" },
-    ],
-  },
-]
-
-export const ALL_ENTRIES: Array<Entry & { group: Group }> = GROUPS.flatMap((group) =>
-  group.entries.map((entry) => ({ ...entry, group }))
-)
-
-export function findEntry(slug: string) {
-  return ALL_ENTRIES.find((e) => e.slug === slug) ?? null
-}
-
-export function counts() {
-  const all = ALL_ENTRIES
-  return {
-    total: all.length,
-    done: all.filter((e) => e.status === "done").length,
-    built: all.filter((e) => e.status === "built").length,
-    missing: all.filter((e) => e.status === "missing").length,
-  }
-}