@cedros/data-react 0.1.7 → 0.1.8

package/dist/site-templates/content-styles.css

@@ -1,35 +1,75 @@
 @import "./docs-styles.css";
+@import "./docs-layout.css";
+@import "./blog-styles.css";
 @import "./monetization-styles.css";
 
 .cedros-site__controls {
-  margin-top: 1rem;
   display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
-  gap: 0.7rem;
+  gap: 1rem;
+}
+
+.cedros-site__controls--docs {
+  padding: 1.15rem 1.2rem 1.25rem;
+}
+
+.cedros-site__controls-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 1rem;
+}
+
+.cedros-site__controls-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+  gap: 0.9rem;
   align-items: end;
 }
 
 .cedros-site__control {
   display: grid;
-  gap: 0.35rem;
-  font-size: 0.78rem;
+  gap: 0.42rem;
   color: var(--cds-muted);
 }
 
+.cedros-site__control span {
+  font-size: 0.77rem;
+  font-weight: 700;
+  letter-spacing: 0.02em;
+}
+
 .cedros-site__control input,
 .cedros-site__control select {
   width: 100%;
-  border: 1px solid var(--cds-border);
-  border-radius: calc(var(--cds-radius) - 2px);
-  background: color-mix(in srgb, var(--cds-bg) 90%, var(--cds-muted-bg) 10%);
+  min-height: 2.75rem;
+  border: 1px solid color-mix(in srgb, var(--cds-border) 88%, transparent);
+  border-radius: calc(var(--cds-radius) - 0.05rem);
+  background: color-mix(in srgb, var(--cds-panel) 86%, transparent);
   color: var(--cds-fg);
-  height: 2.25rem;
-  padding: 0 0.6rem;
+  padding: 0 0.85rem;
+  box-shadow: inset 0 1px 0 rgb(255 255 255 / 38%);
+  transition:
+    border-color 140ms ease,
+    box-shadow 140ms ease,
+    background 140ms ease;
+}
+
+.cedros-site__control input::placeholder {
+  color: color-mix(in srgb, var(--cds-muted) 74%, transparent);
+}
+
+.cedros-site__control input:focus,
+.cedros-site__control select:focus {
+  outline: none;
+  border-color: color-mix(in srgb, var(--cds-link) 48%, var(--cds-border) 52%);
+  box-shadow: 0 0 0 0.24rem color-mix(in srgb, var(--cds-link) 12%, transparent);
+  background: var(--cds-panel);
 }
 
 .cedros-site__control-actions {
   display: inline-flex;
-  gap: 0.5rem;
+  flex-wrap: wrap;
+  gap: 0.55rem;
   align-items: center;
 }
 
@@ -38,382 +78,160 @@
 }
 
 .cedros-site__content-grid {
-  margin-top: 1rem;
+  margin-top: 0;
   display: grid;
-  gap: 0.85rem;
+  gap: 1rem;
 }
 
 .cedros-site__content-grid--docs {
-  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
 }
 
 .cedros-site__entry-card {
   display: grid;
-  gap: 0.6rem;
+  gap: 0.75rem;
 }
 
 .cedros-site__entry-header {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
-  gap: 0.6rem;
+  gap: 0.75rem;
 }
 
 .cedros-site__entry-title {
   margin: 0;
-  font-size: 1rem;
+  font-size: 1.02rem;
+  line-height: 1.25;
+  letter-spacing: -0.03em;
+}
+
+.cedros-site__entry-title--docs {
+  font-size: 1.18rem;
 }
 
 .cedros-site__entry-title a {
   text-decoration: none;
+  color: var(--cds-fg);
 }
 
 .cedros-site__entry-title a:hover {
-  text-decoration: underline;
+  color: var(--cds-link-strong);
 }
 
 .cedros-site__entry-meta {
   margin: 0;
   font-size: 0.78rem;
   color: var(--cds-muted);
+  line-height: 1.6;
 }
 
 .cedros-site__tag-list {
   display: inline-flex;
   flex-wrap: wrap;
-  gap: 0.35rem;
-}
-
-.cedros-site__pagination {
-  margin-top: 0.8rem;
-  display: inline-flex;
-  flex-wrap: wrap;
-  gap: 0.45rem;
-}
-
-.cedros-site__breadcrumbs {
-  margin-top: 0.2rem;
-  display: inline-flex;
-  flex-wrap: wrap;
-  align-items: center;
   gap: 0.45rem;
-  font-size: 0.78rem;
-  color: var(--cds-muted);
 }
 
-.cedros-site__breadcrumbs a {
-  color: var(--cds-muted);
-  text-decoration: none;
-}
-
-.cedros-site__breadcrumbs a:hover {
-  color: var(--cds-fg);
-  text-decoration: underline;
+.cedros-site__tag-list .cedros-site__pill:hover {
+  border-color: color-mix(in srgb, var(--cds-link) 34%, var(--cds-border) 66%);
+  background: var(--cds-link-soft);
+  color: var(--cds-link-strong);
 }
 
-.cedros-site__docs-page {
-  margin-top: 0.85rem;
-  display: grid;
+.cedros-site__pagination {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
   gap: 1rem;
-  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
-  align-items: start;
 }
 
-.cedros-site__docs-page--article {
-  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr) minmax(220px, 260px);
-}
-
-.cedros-site__docs-main {
-  min-width: 0;
-}
-
-.cedros-site__docs-sidebar {
-  position: sticky;
-  top: 0.95rem;
-  display: grid;
-  gap: 0.75rem;
-}
-
-.cedros-site__docs-sidebar-title {
+.cedros-site__pagination-meta {
   margin: 0;
-  font-size: 0.95rem;
-}
-
-.cedros-site__docs-search {
-  display: grid;
-  gap: 0.45rem;
-}
-
-.cedros-site__docs-root-link {
   font-size: 0.8rem;
-  text-decoration: none;
   color: var(--cds-muted);
 }
 
-.cedros-site__docs-root-link:hover {
-  color: var(--cds-fg);
-  text-decoration: underline;
-}
-
-.cedros-site__docs-section {
-  display: grid;
-  gap: 0.35rem;
-}
-
-.cedros-site__docs-section-title {
-  margin: 0;
-  font-size: 0.72rem;
-  color: var(--cds-muted);
-  text-transform: uppercase;
-  letter-spacing: 0.03em;
-}
-
-.cedros-site__docs-section-links {
-  display: grid;
-  gap: 0.2rem;
-}
-
-.cedros-site__docs-item {
-  border: 1px solid transparent;
-  border-radius: calc(var(--cds-radius) - 2px);
-  padding: 0.35rem 0.48rem;
-  text-decoration: none;
-  color: var(--cds-muted);
-  font-size: 0.79rem;
+.cedros-site__pagination-links {
   display: inline-flex;
-  align-items: center;
-  justify-content: space-between;
+  flex-wrap: wrap;
   gap: 0.45rem;
 }
 
-.cedros-site__docs-item:hover {
-  color: var(--cds-fg);
-  background: var(--cds-muted-bg);
-  border-color: var(--cds-border);
-}
-
-.cedros-site__docs-item--active {
-  color: var(--cds-fg);
-  border-color: color-mix(in srgb, var(--cds-link) 50%, var(--cds-border) 50%);
-  background: color-mix(in srgb, var(--cds-link) 9%, var(--cds-muted-bg) 91%);
-}
-
-.cedros-site__docs-item--depth-0 {
-  padding-left: 0;
-}
-
-.cedros-site__docs-item--depth-1 {
-  padding-left: 0.9rem;
-}
-
-.cedros-site__docs-item--depth-2 {
-  padding-left: 1.3rem;
-}
-
-.cedros-site__docs-item-badge {
-  border: 1px solid var(--cds-border);
-  border-radius: 999px;
-  padding: 0.05rem 0.38rem;
-  font-size: 0.67rem;
-  color: var(--cds-muted);
-}
-
-.cedros-site__article-layout {
-  margin-top: 0.85rem;
-  display: grid;
-  gap: 1rem;
-  grid-template-columns: minmax(0, 1fr) minmax(220px, 270px);
-  align-items: start;
-}
-
-.cedros-site__article {
-  min-width: 0;
-}
-
-.cedros-site__article-header {
-  display: grid;
-  gap: 0.55rem;
-}
-
-.cedros-site__prose {
-  margin-top: 1rem;
-  display: grid;
-  gap: 0.85rem;
-  line-height: 1.65;
-}
-
-.cedros-site__prose :where(h2, h3, h4) {
-  margin: 1rem 0 0;
-  line-height: 1.25;
-}
-
-.cedros-site__prose p {
-  margin: 0;
-}
-
-.cedros-site__prose pre {
-  margin: 0;
-  padding: 0.9rem;
-  border-radius: calc(var(--cds-radius) - 2px);
-  border: 1px solid var(--cds-border);
-  overflow-x: auto;
-  background: color-mix(in srgb, var(--cds-muted-bg) 85%, var(--cds-bg) 15%);
-  font-size: 0.82rem;
-}
-
-.cedros-site__prose code {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
-}
-
-.cedros-site__prose :not(pre) > code {
-  border: 1px solid var(--cds-border);
-  border-radius: 0.3rem;
-  background: color-mix(in srgb, var(--cds-muted-bg) 85%, var(--cds-bg) 15%);
-  padding: 0.1rem 0.3rem;
-}
-
-.cedros-site__prose blockquote {
-  margin: 0;
-  padding: 0.6rem 0.8rem;
-  border-left: 3px solid var(--cds-border);
-  color: var(--cds-muted);
-  background: color-mix(in srgb, var(--cds-muted-bg) 72%, var(--cds-bg) 28%);
-  border-radius: calc(var(--cds-radius) - 2px);
-}
-
-.cedros-site__prose img {
-  max-width: 100%;
-  height: auto;
-  border-radius: calc(var(--cds-radius) - 2px);
-}
-
-.cedros-site__content-warning {
-  margin: 0;
+.cedros-site__breadcrumbs {
+  display: inline-flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.3rem;
+  font-size: 0.78rem;
   color: var(--cds-muted);
-  border: 1px dashed var(--cds-border);
-  border-radius: calc(var(--cds-radius) - 2px);
-  padding: 0.65rem 0.8rem;
-  background: color-mix(in srgb, var(--cds-muted-bg) 78%, var(--cds-bg) 22%);
-}
-
-.cedros-site__toc {
-  position: sticky;
-  top: 1rem;
-  display: grid;
-  gap: 0.55rem;
 }
 
-.cedros-site__toc-title {
-  margin: 0;
-  font-size: 0.9rem;
-}
-
-.cedros-site__toc-links {
-  display: grid;
-  gap: 0.35rem;
-}
-
-.cedros-site__toc-link {
-  color: var(--cds-muted);
+.cedros-site__breadcrumbs a {
+  color: inherit;
   text-decoration: none;
-  font-size: 0.8rem;
-}
-
-.cedros-site__toc-link--depth-2 {
-  padding-left: 0;
-}
-
-.cedros-site__toc-link--depth-3 {
-  padding-left: 0.65rem;
-}
-
-.cedros-site__toc-link--depth-4 {
-  padding-left: 1.3rem;
 }
 
-.cedros-site__toc-link:hover {
+.cedros-site__breadcrumbs a:hover {
   color: var(--cds-fg);
 }
 
-.cedros-site__doc-footer {
-  margin-top: 1rem;
-  padding-top: 0.9rem;
-  border-top: 1px solid var(--cds-border);
-  display: inline-flex;
-  flex-wrap: wrap;
-  gap: 0.45rem;
-}
-
-.cedros-site__empty-state {
-  margin-top: 1rem;
+.cedros-site__breadcrumbs-separator {
+  color: color-mix(in srgb, var(--cds-muted) 56%, transparent);
 }
 
-.cedros-site__pill--active {
-  background: var(--cds-link);
-  color: var(--cds-bg);
-  border-color: var(--cds-link);
-}
-
-.cedros-site__filter-dimensions {
-  display: grid;
-  gap: 0.6rem;
+.cedros-site__section-heading {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: 0.85rem;
 }
 
-.cedros-site__filter-group {
-  display: grid;
-  gap: 0.3rem;
+.cedros-site__docs-entry-card {
+  height: 100%;
+  align-content: start;
+  background:
+    linear-gradient(180deg, color-mix(in srgb, var(--cds-panel) 90%, transparent), color-mix(in srgb, var(--cds-panel) 78%, var(--cds-bg) 22%)),
+    var(--cds-panel);
+  transition:
+    transform 160ms ease,
+    border-color 160ms ease,
+    box-shadow 160ms ease;
 }
 
-.cedros-site__filter-group-label {
-  font-size: 0.72rem;
-  color: var(--cds-muted);
-  text-transform: uppercase;
-  letter-spacing: 0.03em;
+.cedros-site__docs-entry-card:hover {
+  transform: translateY(-2px);
+  border-color: color-mix(in srgb, var(--cds-link) 28%, var(--cds-border) 72%);
+  box-shadow: var(--cds-shadow-lg);
 }
 
-.cedros-site__bookmark {
-  background: none;
-  border: 1px solid var(--cds-border);
-  border-radius: calc(var(--cds-radius) - 2px);
-  padding: 0.25rem 0.4rem;
-  cursor: pointer;
-  color: var(--cds-muted);
-  display: inline-flex;
+.cedros-site__docs-entry-head {
+  display: flex;
   align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  flex-wrap: wrap;
 }
 
-.cedros-site__bookmark:hover,
-.cedros-site__bookmark[aria-pressed="true"] {
-  color: var(--cds-link);
-  border-color: var(--cds-link);
-}
-
-.cedros-site__search-input {
-  width: 100%;
+.cedros-site__docs-entry-footer {
+  margin-top: auto;
 }
 
-@media (max-width: 900px) {
-  .cedros-site__docs-page,
-  .cedros-site__docs-page--article {
-    grid-template-columns: 1fr;
-  }
-
-  .cedros-site__docs-sidebar {
-    position: static;
-  }
-
-  .cedros-site__article-layout {
-    grid-template-columns: 1fr;
+@media (max-width: 700px) {
+  .cedros-site__controls-header,
+  .cedros-site__section-heading,
+  .cedros-site__pagination,
+  .cedros-site__article-top {
+    align-items: flex-start;
+    flex-direction: column;
   }
 
-  .cedros-site__toc {
-    position: static;
+  .cedros-site__control-actions,
+  .cedros-site__pagination-links {
+    width: 100%;
   }
-}
 
-@media (max-width: 700px) {
-  .cedros-site__control-actions {
-    flex-wrap: wrap;
+  .cedros-site__control-actions .cedros-site__button,
+  .cedros-site__pagination-links .cedros-site__button {
+    flex: 1 1 auto;
   }
 }
-

package/dist/site-templates/contentIndex.d.ts

@@ -1,3 +1,4 @@
+import type { DocsEntryRecord } from "../docsContract.js";
 export interface PaginationResult<T> {
     items: T[];
     page: number;
@@ -33,22 +34,14 @@ export interface FilterDimension {
 export interface FilterDimensionValues {
     [dimensionKey: string]: string;
 }
-export interface DocsIndexEntry {
-    slug: string;
-    title: string;
-    description?: string;
-    category?: string;
-    tags?: string[];
-    lastUpdated?: string;
-    bodyMarkdown?: string;
-    bodyHtml?: string;
-    bodyText?: string;
-    searchText?: string;
+export interface DocsIndexEntry extends DocsEntryRecord {
 }
 export interface DocsIndexQuery {
     query?: string;
     category?: string;
     tag?: string;
+    productSlug?: string;
+    sectionKey?: string;
     sort?: "updated-desc" | "updated-asc" | "title-asc" | "title-desc";
     page?: number;
     pageSize?: number;

package/dist/site-templates/contentIndex.js

@@ -118,6 +118,12 @@ function matchesDocsQuery(entry, query) {
     if (query.tag && !entry.tags?.includes(query.tag)) {
         return false;
     }
+    if (query.productSlug && entry.productSlug !== query.productSlug) {
+        return false;
+    }
+    if (query.sectionKey && entry.sectionKey !== query.sectionKey) {
+        return false;
+    }
     if (!query.query) {
         return true;
     }
@@ -164,7 +170,11 @@ function buildDocsSearchText(entry) {
         entry.title,
         entry.description,
         entry.category,
+        entry.productLabel,
+        entry.sectionLabel,
         ...(entry.tags ?? []),
+        ...(entry.aliases ?? []),
+        entry.badge,
         entry.searchText,
         entry.bodyText,
         entry.bodyMarkdown,

package/dist/site-templates/contentUi.js

@@ -1,17 +1,18 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Fragment } from "react";
 import { buildContentListHref } from "./contentIndex.js";
 export function ContentPagination({ basePath, page, totalPages, query }) {
     if (totalPages <= 1) {
         return null;
     }
     const visiblePages = buildVisiblePages(page, totalPages);
-    return (_jsxs("nav", { className: "cedros-site__pagination", "aria-label": "Pagination", children: [_jsx("a", { href: buildContentListHref(basePath, { ...query, page: Math.max(1, page - 1) }), className: `cedros-site__nav-link${page === 1 ? " cedros-site__nav-link--disabled" : ""}`, "aria-disabled": page === 1 ? "true" : undefined, children: "Previous" }), visiblePages.map((entryPage) => (_jsx("a", { href: buildContentListHref(basePath, { ...query, page: entryPage }), className: `cedros-site__nav-link${entryPage === page ? " cedros-site__nav-link--active" : ""}`, "aria-current": entryPage === page ? "page" : undefined, children: entryPage }, entryPage))), _jsx("a", { href: buildContentListHref(basePath, { ...query, page: Math.min(totalPages, page + 1) }), className: `cedros-site__nav-link${page === totalPages ? " cedros-site__nav-link--disabled" : ""}`, "aria-disabled": page === totalPages ? "true" : undefined, children: "Next" })] }));
+    return (_jsxs("nav", { className: "cedros-site__pagination", "aria-label": "Pagination", children: [_jsxs("p", { className: "cedros-site__pagination-meta", children: ["Page ", page, " of ", totalPages] }), _jsxs("div", { className: "cedros-site__pagination-links", children: [_jsx("a", { href: buildContentListHref(basePath, { ...query, page: Math.max(1, page - 1) }), className: `cedros-site__button cedros-site__button--ghost${page === 1 ? " cedros-site__button--disabled" : ""}`, "aria-disabled": page === 1 ? "true" : undefined, children: "Previous" }), visiblePages.map((entryPage) => (_jsx("a", { href: buildContentListHref(basePath, { ...query, page: entryPage }), className: `cedros-site__button cedros-site__button--ghost${entryPage === page ? " cedros-site__button--active" : ""}`, "aria-current": entryPage === page ? "page" : undefined, children: entryPage }, entryPage))), _jsx("a", { href: buildContentListHref(basePath, { ...query, page: Math.min(totalPages, page + 1) }), className: `cedros-site__button cedros-site__button--ghost${page === totalPages ? " cedros-site__button--disabled" : ""}`, "aria-disabled": page === totalPages ? "true" : undefined, children: "Next" })] })] }));
 }
 export function Breadcrumbs({ trail, className = "cedros-site__breadcrumbs" }) {
     if (trail.length === 0) {
         return null;
     }
-    return (_jsx("nav", { className: className, "aria-label": "Breadcrumb", children: trail.map((entry) => (_jsx("a", { href: entry.href, children: entry.label }, entry.href))) }));
+    return (_jsx("nav", { className: className, "aria-label": "Breadcrumb", children: trail.map((entry, index) => (_jsxs(Fragment, { children: [index > 0 && (_jsx("span", { className: "cedros-site__breadcrumbs-separator", "aria-hidden": "true", children: "/" })), _jsx("a", { href: entry.href, children: entry.label })] }, entry.href))) }));
 }
 function buildVisiblePages(page, totalPages) {
     const start = Math.max(1, page - 2);