@aiaiai-pt/design-system 0.38.0 → 0.38.1

package/components/DateRangePicker.svelte.d.ts

@@ -35,7 +35,7 @@ declare const DateRangePicker: import("svelte").Component<{
     onchange?: any;
     id?: any;
     class?: string;
-} & Record<string, any>, {}, "end" | "start">;
+} & Record<string, any>, {}, "start" | "end">;
 type $$ComponentProps = {
     start?: any;
     end?: any;

package/components/EChart.svelte.d.ts

@@ -49,6 +49,7 @@ declare const EChart: import("svelte").Component<{
     labelHeader?: string;
     valueHeader?: string;
     locale?: string;
+    kind?: string;
     height?: string;
     class?: string;
 } & Record<string, any>, {}, "">;
@@ -58,6 +59,7 @@ type $$ComponentProps = {
     labelHeader?: string;
     valueHeader?: string;
     locale?: string;
+    kind?: string;
     height?: string;
     class?: string;
 } & Record<string, any>;

package/components/NotificationPrefs.svelte.d.ts

@@ -4,6 +4,7 @@ export type PrefItem = {
     label: string;
     description?: string;
     active: boolean;
+    group?: string;
 };
 type NotificationPrefs = {
     $on?(type: string, callback: (e: any) => void): () => void;
@@ -19,16 +20,18 @@ type NotificationPrefs = {
  * Toggling a row calls `onToggle(id, next)` — the consumer performs the write
  * and re-feeds `items` (or sets `busyId` while it's in flight).
  *
- * Accessibility-first: a bordered semantic list; each row pairs a real text
- * label (and optional description) with a `Toggle` (`role="switch"`,
- * `aria-checked`). The switch carries an accessible name via `aria-label` so the
- * control reads on its own. A row that's saving is `disabled` (no double-submit).
- * Consumes semantic tokens so dark / high-contrast schemes (#244) ride through.
- * Soft-empty: no items → renders the `emptyText` note (never an empty shell).
+ * Accessibility-first: a bordered semantic list inside a `<section>` region
+ * named by `label` (the visible page heading is the consumer's job — same split
+ * as RankingBoard, so one widget can own the page `<h1>`). Each row pairs a real
+ * text label (and optional description) with a `Toggle` (`role="switch"`,
+ * `aria-checked`); the switch carries its own accessible name via `aria-label`.
+ * A row that's saving is `disabled` (no double-submit). Consumes semantic tokens
+ * so dark / high-contrast schemes (#244) ride through. Soft-empty: no items →
+ * renders the `emptyText` note (never an empty shell).
  *
  * @example
  * <NotificationPrefs
- *   heading="Notifications"
+ *   label="Notifications"
  *   items={[
  *     { id: "all", label: "All updates", description: "Every proposal and phase change", active: true },
  *     { id: "sub-2", label: "Cycling lane", active: false },
@@ -39,7 +42,7 @@ type NotificationPrefs = {
  */
 declare const NotificationPrefs: import("svelte").Component<{
     items?: any[];
-    heading?: string;
+    label?: string;
     emptyText?: string;
     onToggle?: any;
     busyId?: any;
@@ -47,7 +50,7 @@ declare const NotificationPrefs: import("svelte").Component<{
 } & Record<string, any>, {}, "">;
 type $$ComponentProps = {
     items?: any[];
-    heading?: string;
+    label?: string;
     emptyText?: string;
     onToggle?: any;
     busyId?: any;

package/components/SiteHeader.svelte.d.ts

@@ -7,17 +7,36 @@ type SiteHeader = {
  * SiteHeader
  *
  * Public site banner landmark (`<header role="banner">`). Locked accessibility
- * chrome for the citizen portal: a brand area, a primary navigation slot, and
- * an actions slot (locale switch, sign-in). Structure and landmarks are fixed
- * (conformance-checkable); only brand tokens vary per tenant via `data-theme`.
+ * chrome for the citizen portal: a brand area, a primary navigation slot, an
+ * actions slot (locale switch, sign-in), and — for two-level information
+ * architectures — an optional contextual `subnav` band and a single unified
+ * mobile disclosure. Structure and landmarks are fixed (conformance-checkable);
+ * only brand tokens vary per tenant via `data-theme`.
  *
- * Icon-agnostic, per DS convention — pass icons/logo as snippets.
+ * Two tiers, one banner:
+ *  - `nav`    — the PRIMARY row (sections), a `ServiceNavigation`.
+ *  - `subnav` — an OPTIONAL second band directly beneath the primary row,
+ *               a `SectionNavigation` showing the active section's pages. It
+ *               lives inside this same sticky banner so it scrolls/sticks as one
+ *               unit and never reflows the primary row sideways.
+ *
+ * Unified mobile menu (fixes the "two hamburgers" problem): when a `menu` snippet
+ * is provided, this header renders ONE toggle below `--breakpoint` and hides the
+ * inline `nav` + `subnav`; both tiers collapse into a single hierarchical panel
+ * (the `menu` snippet) instead of each nav growing its own toggle. Consumers
+ * without a `menu` snippet keep the previous behaviour unchanged (backward
+ * compatible) — the inline `nav`'s own responsive collapse still applies.
+ *
+ * Icon-agnostic, per DS convention — pass the toggle/close icons as snippets;
+ * minimal glyphs are used as defaults.
  *
  * @example
  * <SiteHeader>
  *   {#snippet brand()}<a href="/"><Logo /> Valongo</a>{/snippet}
- *   {#snippet nav()}<ServiceNavigation items={navItems} />{/snippet}
+ *   {#snippet nav()}<ServiceNavigation items={sections} />{/snippet}
+ *   {#snippet subnav()}<SectionNavigation label={sectionName} items={pages} />{/snippet}
  *   {#snippet actions()}<LocaleSwitch /> <Button>Sign in</Button>{/snippet}
+ *   {#snippet menu()}…hierarchical sections → pages tree…{/snippet}
  * </SiteHeader>
  */
 declare const SiteHeader: import("svelte").Component<{
@@ -25,12 +44,28 @@ declare const SiteHeader: import("svelte").Component<{
     class?: string;
     brand?: any;
     nav?: any;
+    subnav?: any;
     actions?: any;
+    menu?: any;
+    menuLabel?: string;
+    menuPanelLabel?: string;
+    closeLabel?: string;
+    menuId?: string;
+    menuIcon?: any;
+    closeIcon?: any;
 } & Record<string, any>, {}, "">;
 type $$ComponentProps = {
     navLabel?: string;
     class?: string;
     brand?: any;
     nav?: any;
+    subnav?: any;
     actions?: any;
+    menu?: any;
+    menuLabel?: string;
+    menuPanelLabel?: string;
+    closeLabel?: string;
+    menuId?: string;
+    menuIcon?: any;
+    closeIcon?: any;
 } & Record<string, any>;

package/components/index.d.ts

@@ -25,6 +25,7 @@ export { default as TextSizeAdjuster } from "./TextSizeAdjuster.svelte";
 export { default as ContrastToggle } from "./ContrastToggle.svelte";
 export { default as LinkHighlightToggle } from "./LinkHighlightToggle.svelte";
 export { default as ServiceNavigation } from "./ServiceNavigation.svelte";
+export { default as SectionNavigation } from "./SectionNavigation.svelte";
 export { default as Link } from "./Link.svelte";
 export { default as Hero } from "./Hero.svelte";
 export { default as ContentBlock } from "./ContentBlock.svelte";
@@ -64,6 +65,7 @@ export { default as RecordList } from "./RecordList.svelte";
 export { default as PhaseTimeline } from "./PhaseTimeline.svelte";
 export { default as RankingBoard } from "./RankingBoard.svelte";
 export { default as ResultsChart } from "./ResultsChart.svelte";
+export { default as EChart } from "./EChart.svelte";
 export { default as NotificationPrefs } from "./NotificationPrefs.svelte";
 export { default as ConsentManager } from "./ConsentManager.svelte";
 export { default as ServiceFlow } from "./ServiceFlow.svelte";

package/components/map-utils.d.ts

@@ -116,6 +116,23 @@ export function geoStylerToFlat(style: any): OverlayLayerStyle;
  * @returns {Promise<import('ol/layer/Vector.js').default[]>}
  */
 export function createOverlayLayers(defs: OverlayLayerDef[], styles: import("./map-utils.js").MapStyles): Promise<import("ol/layer/Vector.js").default[]>;
+/**
+ * Decide the hover-tooltip text for a feature under the pointer.
+ *
+ * Markers passed via the `markers` prop go through an OL Cluster source, so
+ * each rendered feature carries a `features` collection: one entry → that
+ * marker's label; many → "N items". Features served from an overlay `layers`
+ * def (a file/WFS source) are added to a plain VectorSource and have NO
+ * `features` collection (`undefined`) — for those, fall back to the feature's
+ * own descriptive props rather than rendering the misleading "0 items".
+ *
+ * @param {{ get: (key: string) => any }} feature — an OL Feature (or any
+ *   object exposing `.get(key)`).
+ * @returns {string | null} the label to show, or null to hide the tooltip.
+ */
+export function clusterTooltipLabel(feature: {
+    get: (key: string) => any;
+}): string | null;
 /**
  * Normalises a boundary prop into polygon rings (lon/lat WGS84).
  * Accepts: raw ring `number[][]`, GeoJSON Polygon / MultiPolygon,

package/components/renderer/EChartWidget.svelte.d.ts

@@ -1,4 +1,7 @@
 import type { WidgetProps } from "./types";
-declare const EChartWidget: import("svelte").Component<WidgetProps, {}, "">;
+type $$ComponentProps = WidgetProps & {
+    kind?: "bar" | "line" | "donut";
+};
+declare const EChartWidget: import("svelte").Component<$$ComponentProps, {}, "">;
 type EChartWidget = ReturnType<typeof EChartWidget>;
 export default EChartWidget;

package/components/renderer/types.d.ts

@@ -96,6 +96,33 @@ export interface Block {
      * (set on the default block), not tenant content.
      */
     bleed?: boolean;
+    /**
+     * #176 Tier 1 (ADR 0003) — 2D grid placement on a 12-column track. A block
+     * WITH `layout` is positioned by the renderer's grid (col `x`, span `w`; row
+     * `y`, span `h`); a block WITHOUT it falls back to source order (the shipped
+     * ordered-list behaviour — fully back-compatible). This is a DESCRIPTOR field
+     * consumed by BOTH render (places the block) and authoring (drag/resize writes
+     * the coords); the DS never learns it is being edited. `x`/`y` are 0-based;
+     * `w`/`h` are 1-based spans (w clamped to 1..12).
+     */
+    layout?: BlockLayout;
+    /**
+     * #176 Tier 1 — child blocks for a future grid-IN-grid container. Reserved
+     * (single-level page grids use `layout` on flat blocks); nesting is deferred
+     * until a concrete need (ADR 0003 build-order note).
+     */
+    children?: Block[];
+}
+/** 12-column grid placement (#176 Tier 1). All fields in grid track units. */
+export interface BlockLayout {
+    /** 0-based start column (0..11). */
+    x: number;
+    /** 0-based start row. */
+    y: number;
+    /** Column span (1..12). */
+    w: number;
+    /** Row span (>=1). */
+    h: number;
 }
 export interface PageDescriptor {
     blocks: Block[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aiaiai-pt/design-system",
-  "version": "0.38.0",
+  "version": "0.38.1",
   "description": "Design system tokens and Svelte components for aiaiai products",
   "license": "MIT",
   "type": "module",
@@ -15,7 +15,7 @@
     "site"
   ],
   "scripts": {
-    "build:types": "svelte-package --input . --output dist && cp dist/components/*.d.ts components/ && cp dist/components/renderer/*.d.ts components/renderer/ && rm -rf dist",
+    "build:types": "rm -f components/*.d.ts components/renderer/*.d.ts && svelte-package --input . --output dist && cp dist/components/*.d.ts components/ && cp dist/components/renderer/*.d.ts components/renderer/ && rm -rf dist",
     "test": "vitest run",
     "prepublishOnly": "npm run build:types"
   },