@mieweb/ui 0.10.0-dev.2 → 0.10.0-dev.21

package/agent/mieweb-ui.instructions.md

@@ -168,7 +168,19 @@ Tailwind: on Tailwind 4, add an `@source` for `@mieweb/ui` so library classes ar
 
 If JSDoc, the console, or the docs mark something deprecated (`AGGrid` today), do not use it in new code and do not suppress the warning. Use the documented replacement.
 
-## Rule 14: When existing components do not meet the need
+## Rule 14: A component that renders a collection takes it through props
+
+Anything that displays a list, board, calendar, timeline or inbox of records the caller owns is a **headless module**. It receives `items` / `loading` / `error` as props, hands changes back through `on*` callbacks typed `void | Promise<void>`, and navigates through `onOpen(id)` / `getHref(id)`.
+
+Never fetch, subscribe, read a store, or import a router or app framework inside such a component — `meteor/*`, `next/*`, `react-router*`, `@tanstack/react-query` and `@fortawesome/*` are blocked by ESLint. Make it generic over the item type with accessor props (`getId`, `getStatus`, `getStart`, …), put domain rendering in `render*` slots, return a token _name_ for colour (never a class string), and make every user-facing string overridable through `labels`.
+
+Declare it with `parameters.catalog.collection: true`; `pnpm catalog:check` then requires an **Empty**, **Loading** and **Error** story. Full contract:
+[component-policy → Tier 2.5](https://github.com/mieweb/ui/blob/main/lessons/component-policy.md#tier-25-headless-modules).
+
+Wiring one to an app's data layer — accessors, awaited mutations, `onOpen` plus `getHref`, where filter state lives:
+[wiring-headless-modules.md](https://github.com/mieweb/ui/blob/main/lessons/wiring-headless-modules.md).
+
+## Rule 15: When existing components do not meet the need
 
 Before creating or materially extending a reusable component, read the
 [upstream contribution guide](https://github.com/mieweb/ui/blob/main/CONTRIBUTING.md)

package/dist/CsvBlock-FX5YNGNE.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+var chunkJELTRRR5_cjs = require('./chunk-JELTRRR5.cjs');
+require('./chunk-LFPJ3OUM.cjs');
+require('./chunk-X6A27RGO.cjs');
+require('./chunk-DXEPYK3I.cjs');
+require('./chunk-S5RVSXDV.cjs');
+require('./chunk-EUAMEVVI.cjs');
+
+
+
+Object.defineProperty(exports, "CsvBlock", {
+  enumerable: true,
+  get: function () { return chunkJELTRRR5_cjs.CsvBlock; }
+});
+//# sourceMappingURL=CsvBlock-FX5YNGNE.cjs.map
+//# sourceMappingURL=CsvBlock-FX5YNGNE.cjs.map

package/dist/{CsvBlock-ROJCKJDP.cjs.map → CsvBlock-FX5YNGNE.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"CsvBlock-ROJCKJDP.cjs"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"CsvBlock-FX5YNGNE.cjs"}

package/dist/CsvBlock-VLMG7GUO.js

@@ -0,0 +1,8 @@
+export { CsvBlock } from './chunk-R6KPWIGO.js';
+import './chunk-QOVJ6Z6R.js';
+import './chunk-7YO7DNUV.js';
+import './chunk-GVM6DTR5.js';
+import './chunk-TQONQSJO.js';
+import './chunk-PX6F3LHL.js';
+//# sourceMappingURL=CsvBlock-VLMG7GUO.js.map
+//# sourceMappingURL=CsvBlock-VLMG7GUO.js.map

package/dist/{CsvBlock-UWPMTLE2.js.map → CsvBlock-VLMG7GUO.js.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"CsvBlock-UWPMTLE2.js"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"CsvBlock-VLMG7GUO.js"}

package/dist/HtmlPreviewBlock-5JE7L3GR.js

@@ -0,0 +1,8 @@
+export { HtmlPreviewBlock } from './chunk-GVLNXPJX.js';
+import './chunk-QOVJ6Z6R.js';
+import './chunk-7YO7DNUV.js';
+import './chunk-GVM6DTR5.js';
+import './chunk-TQONQSJO.js';
+import './chunk-PX6F3LHL.js';
+//# sourceMappingURL=HtmlPreviewBlock-5JE7L3GR.js.map
+//# sourceMappingURL=HtmlPreviewBlock-5JE7L3GR.js.map

package/dist/{HtmlPreviewBlock-ME5U3XNS.js.map → HtmlPreviewBlock-5JE7L3GR.js.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"HtmlPreviewBlock-ME5U3XNS.js"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"HtmlPreviewBlock-5JE7L3GR.js"}

package/dist/HtmlPreviewBlock-UO37JQ3K.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+var chunkHIZWOAWY_cjs = require('./chunk-HIZWOAWY.cjs');
+require('./chunk-LFPJ3OUM.cjs');
+require('./chunk-X6A27RGO.cjs');
+require('./chunk-DXEPYK3I.cjs');
+require('./chunk-S5RVSXDV.cjs');
+require('./chunk-EUAMEVVI.cjs');
+
+
+
+Object.defineProperty(exports, "HtmlPreviewBlock", {
+  enumerable: true,
+  get: function () { return chunkHIZWOAWY_cjs.HtmlPreviewBlock; }
+});
+//# sourceMappingURL=HtmlPreviewBlock-UO37JQ3K.cjs.map
+//# sourceMappingURL=HtmlPreviewBlock-UO37JQ3K.cjs.map

package/dist/{HtmlPreviewBlock-DWFN6EUB.cjs.map → HtmlPreviewBlock-UO37JQ3K.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"HtmlPreviewBlock-DWFN6EUB.cjs"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"HtmlPreviewBlock-UO37JQ3K.cjs"}

package/dist/Input-yN516s5_.d.cts

@@ -0,0 +1,3 @@
+type RequiredMarkVariant = 'default' | 'warning';
+
+export type { RequiredMarkVariant as R };

package/dist/Input-yN516s5_.d.ts

@@ -0,0 +1,3 @@
+type RequiredMarkVariant = 'default' | 'warning';
+
+export type { RequiredMarkVariant as R };

package/dist/MermaidBlock-3XHFBAMV.js

@@ -0,0 +1,8 @@
+export { MermaidBlock } from './chunk-YU55JD35.js';
+import './chunk-QOVJ6Z6R.js';
+import './chunk-7YO7DNUV.js';
+import './chunk-GVM6DTR5.js';
+import './chunk-TQONQSJO.js';
+import './chunk-PX6F3LHL.js';
+//# sourceMappingURL=MermaidBlock-3XHFBAMV.js.map
+//# sourceMappingURL=MermaidBlock-3XHFBAMV.js.map

package/dist/{MermaidBlock-2B6CPD6Y.js.map → MermaidBlock-3XHFBAMV.js.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"MermaidBlock-2B6CPD6Y.js"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"MermaidBlock-3XHFBAMV.js"}

package/dist/MermaidBlock-RZ75RPZA.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+var chunkTYE5K5WV_cjs = require('./chunk-TYE5K5WV.cjs');
+require('./chunk-LFPJ3OUM.cjs');
+require('./chunk-X6A27RGO.cjs');
+require('./chunk-DXEPYK3I.cjs');
+require('./chunk-S5RVSXDV.cjs');
+require('./chunk-EUAMEVVI.cjs');
+
+
+
+Object.defineProperty(exports, "MermaidBlock", {
+  enumerable: true,
+  get: function () { return chunkTYE5K5WV_cjs.MermaidBlock; }
+});
+//# sourceMappingURL=MermaidBlock-RZ75RPZA.cjs.map
+//# sourceMappingURL=MermaidBlock-RZ75RPZA.cjs.map

package/dist/{MermaidBlock-D2UC5M55.cjs.map → MermaidBlock-RZ75RPZA.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"MermaidBlock-D2UC5M55.cjs"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"MermaidBlock-RZ75RPZA.cjs"}

package/dist/SurveyBlock-MUVJ3JUI.js

@@ -0,0 +1,8 @@
+export { SurveyBlock } from './chunk-FZURBQJ2.js';
+import './chunk-QOVJ6Z6R.js';
+import './chunk-7YO7DNUV.js';
+import './chunk-GVM6DTR5.js';
+import './chunk-TQONQSJO.js';
+import './chunk-PX6F3LHL.js';
+//# sourceMappingURL=SurveyBlock-MUVJ3JUI.js.map
+//# sourceMappingURL=SurveyBlock-MUVJ3JUI.js.map

package/dist/{SurveyBlock-4DO62RBT.js.map → SurveyBlock-MUVJ3JUI.js.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"SurveyBlock-4DO62RBT.js"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"SurveyBlock-MUVJ3JUI.js"}

package/dist/SurveyBlock-VH47YXZC.cjs

@@ -0,0 +1,17 @@
+'use strict';
+
+var chunkGYXUS65N_cjs = require('./chunk-GYXUS65N.cjs');
+require('./chunk-LFPJ3OUM.cjs');
+require('./chunk-X6A27RGO.cjs');
+require('./chunk-DXEPYK3I.cjs');
+require('./chunk-S5RVSXDV.cjs');
+require('./chunk-EUAMEVVI.cjs');
+
+
+
+Object.defineProperty(exports, "SurveyBlock", {
+  enumerable: true,
+  get: function () { return chunkGYXUS65N_cjs.SurveyBlock; }
+});
+//# sourceMappingURL=SurveyBlock-VH47YXZC.cjs.map
+//# sourceMappingURL=SurveyBlock-VH47YXZC.cjs.map

package/dist/{SurveyBlock-4CD4AYMJ.cjs.map → SurveyBlock-VH47YXZC.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"SurveyBlock-4CD4AYMJ.cjs"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"SurveyBlock-VH47YXZC.cjs"}

package/dist/ag-grid.d.cts

@@ -5,7 +5,148 @@ export { AgGridReact } from 'ag-grid-react';
 import { RowClickedEvent, RowSelectionOptions, ColDef as ColDef$1, ICellRendererParams } from 'ag-grid-community';
 export { ColDef as AGColDef, CellClickedEvent, CellValueChangedEvent, FilterChangedEvent, FirstDataRenderedEvent, GridApi, GridReadyEvent, RowClickedEvent, RowSelectedEvent, SelectionChangedEvent, SortChangedEvent } from 'ag-grid-community';
 import { VariantProps } from 'class-variance-authority';
-import { BrandConfig } from './brands/types.cjs';
+
+/**
+ * @mieweb/ui Brand System Types
+ *
+ * This module provides type definitions and utilities for brand themes.
+ * Brands define colors, typography, spacing, and other design tokens that
+ * can be applied to @mieweb/ui components.
+ */
+/**
+ * Primary color scale (50-950) following Tailwind conventions.
+ */
+interface ColorScale {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+    950: string;
+}
+/**
+ * Semantic colors for a specific color mode (light or dark).
+ */
+interface SemanticColors {
+    /** Page background color */
+    background: string;
+    /** Primary text color */
+    foreground: string;
+    /** Card/panel background */
+    card: string;
+    /** Card text color */
+    cardForeground: string;
+    /** Muted/subtle background */
+    muted: string;
+    /** Muted/secondary text */
+    mutedForeground: string;
+    /** Border color */
+    border: string;
+    /** Input border color */
+    input: string;
+    /** Focus ring color */
+    ring: string;
+    /** Destructive/error color */
+    destructive: string;
+    /** Text on destructive backgrounds */
+    destructiveForeground: string;
+    /** Success color */
+    success: string;
+    /** Text on success backgrounds */
+    successForeground: string;
+    /** Warning color */
+    warning: string;
+    /** Text on warning backgrounds */
+    warningForeground: string;
+}
+/**
+ * Complete color configuration for a brand.
+ */
+interface BrandColors {
+    /** Primary brand color scale */
+    primary: ColorScale;
+    /** Secondary color scale (optional — falls back to library defaults) */
+    secondary?: ColorScale;
+    /** Neutral / gray color scale (optional — falls back to library defaults) */
+    neutral?: ColorScale;
+    /** Destructive / error color scale (optional — falls back to library defaults) */
+    destructive?: ColorScale;
+    /** Success color scale (optional — falls back to library defaults) */
+    success?: ColorScale;
+    /** Warning color scale (optional — falls back to library defaults) */
+    warning?: ColorScale;
+    /** Info color scale (optional — falls back to library defaults) */
+    info?: ColorScale;
+    /**
+     * Brand accent (optional) — exposed as `--mieweb-accent`, `--mieweb-accent-light`
+     * and `--mieweb-accent-dark`. Components fall back to the primary scale when unset.
+     */
+    accent?: {
+        DEFAULT: string;
+        light?: string;
+        dark?: string;
+    };
+    /** Light mode semantic colors */
+    light: SemanticColors;
+    /** Dark mode semantic colors */
+    dark: SemanticColors;
+}
+/**
+ * Typography configuration for a brand.
+ */
+interface BrandTypography {
+    /** Font family stack for body text */
+    fontFamily: {
+        sans: string[];
+        mono?: string[];
+    };
+    /** Base font size (usually 16px) */
+    baseFontSize?: string;
+}
+/**
+ * Border radius configuration.
+ */
+interface BrandBorderRadius {
+    none: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+    full: string;
+}
+/**
+ * Box shadow configuration.
+ */
+interface BrandBoxShadow {
+    card: string;
+    dropdown: string;
+    modal: string;
+}
+/**
+ * Complete brand configuration.
+ */
+interface BrandConfig {
+    /** Unique identifier (lowercase, no spaces) */
+    name: string;
+    /** Human-readable display name */
+    displayName: string;
+    /** Brand description */
+    description?: string;
+    /** Color configuration */
+    colors: BrandColors;
+    /** Typography settings */
+    typography: BrandTypography;
+    /** Border radius scale */
+    borderRadius: BrandBorderRadius;
+    /** Box shadow definitions */
+    boxShadow: BrandBoxShadow;
+}
 
 declare const agGridVariants: (props?: ({
     variant?: "default" | "bordered" | "striped" | "card" | null | undefined;

package/dist/ag-grid.d.ts

@@ -5,7 +5,148 @@ export { AgGridReact } from 'ag-grid-react';
 import { RowClickedEvent, RowSelectionOptions, ColDef as ColDef$1, ICellRendererParams } from 'ag-grid-community';
 export { ColDef as AGColDef, CellClickedEvent, CellValueChangedEvent, FilterChangedEvent, FirstDataRenderedEvent, GridApi, GridReadyEvent, RowClickedEvent, RowSelectedEvent, SelectionChangedEvent, SortChangedEvent } from 'ag-grid-community';
 import { VariantProps } from 'class-variance-authority';
-import { BrandConfig } from './brands/types.js';
+
+/**
+ * @mieweb/ui Brand System Types
+ *
+ * This module provides type definitions and utilities for brand themes.
+ * Brands define colors, typography, spacing, and other design tokens that
+ * can be applied to @mieweb/ui components.
+ */
+/**
+ * Primary color scale (50-950) following Tailwind conventions.
+ */
+interface ColorScale {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+    950: string;
+}
+/**
+ * Semantic colors for a specific color mode (light or dark).
+ */
+interface SemanticColors {
+    /** Page background color */
+    background: string;
+    /** Primary text color */
+    foreground: string;
+    /** Card/panel background */
+    card: string;
+    /** Card text color */
+    cardForeground: string;
+    /** Muted/subtle background */
+    muted: string;
+    /** Muted/secondary text */
+    mutedForeground: string;
+    /** Border color */
+    border: string;
+    /** Input border color */
+    input: string;
+    /** Focus ring color */
+    ring: string;
+    /** Destructive/error color */
+    destructive: string;
+    /** Text on destructive backgrounds */
+    destructiveForeground: string;
+    /** Success color */
+    success: string;
+    /** Text on success backgrounds */
+    successForeground: string;
+    /** Warning color */
+    warning: string;
+    /** Text on warning backgrounds */
+    warningForeground: string;
+}
+/**
+ * Complete color configuration for a brand.
+ */
+interface BrandColors {
+    /** Primary brand color scale */
+    primary: ColorScale;
+    /** Secondary color scale (optional — falls back to library defaults) */
+    secondary?: ColorScale;
+    /** Neutral / gray color scale (optional — falls back to library defaults) */
+    neutral?: ColorScale;
+    /** Destructive / error color scale (optional — falls back to library defaults) */
+    destructive?: ColorScale;
+    /** Success color scale (optional — falls back to library defaults) */
+    success?: ColorScale;
+    /** Warning color scale (optional — falls back to library defaults) */
+    warning?: ColorScale;
+    /** Info color scale (optional — falls back to library defaults) */
+    info?: ColorScale;
+    /**
+     * Brand accent (optional) — exposed as `--mieweb-accent`, `--mieweb-accent-light`
+     * and `--mieweb-accent-dark`. Components fall back to the primary scale when unset.
+     */
+    accent?: {
+        DEFAULT: string;
+        light?: string;
+        dark?: string;
+    };
+    /** Light mode semantic colors */
+    light: SemanticColors;
+    /** Dark mode semantic colors */
+    dark: SemanticColors;
+}
+/**
+ * Typography configuration for a brand.
+ */
+interface BrandTypography {
+    /** Font family stack for body text */
+    fontFamily: {
+        sans: string[];
+        mono?: string[];
+    };
+    /** Base font size (usually 16px) */
+    baseFontSize?: string;
+}
+/**
+ * Border radius configuration.
+ */
+interface BrandBorderRadius {
+    none: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+    full: string;
+}
+/**
+ * Box shadow configuration.
+ */
+interface BrandBoxShadow {
+    card: string;
+    dropdown: string;
+    modal: string;
+}
+/**
+ * Complete brand configuration.
+ */
+interface BrandConfig {
+    /** Unique identifier (lowercase, no spaces) */
+    name: string;
+    /** Human-readable display name */
+    displayName: string;
+    /** Brand description */
+    description?: string;
+    /** Color configuration */
+    colors: BrandColors;
+    /** Typography settings */
+    typography: BrandTypography;
+    /** Border radius scale */
+    borderRadius: BrandBorderRadius;
+    /** Box shadow definitions */
+    boxShadow: BrandBoxShadow;
+}
 
 declare const agGridVariants: (props?: ({
     variant?: "default" | "bordered" | "striped" | "card" | null | undefined;