@rebasepro/app 0.19.1 → 0.19.2-canary.g09316f6

package/dist/debug/UIReferenceView.d.ts

@@ -1,10 +1,13 @@
 /**
  * UIReferenceView — hidden debug route at /debug/ui
  *
- * This file is a STATIC reference of the real UI patterns used across the app.
- * Markup / styles are copied from source files where a section mirrors a real
- * screen. DO NOT add invented styles — copy from actual source files, or from
- * the components in @rebasepro/ui.
+ * The design source of truth for the kit, in two halves. The SYSTEM chapters
+ * (principles, surfaces, colour, typography, shape and space, depth and icons,
+ * cards and data — `./ui-reference/SystemSections.tsx`) show the decisions in
+ * `theme.css`, `styles.ts` and `DESIGN.md` with the kit's own components. The
+ * ELEMENT chapters below mirror real screens: markup and classes are copied
+ * from the source files they name. DO NOT add invented styles here — copy from
+ * the actual component, or compose kit components.
  *
  * Sections named after a component mirror that component. Sections named after
  * a pattern (e.g. "Management Screen", "Form Dialog") are illustrative
@@ -13,8 +16,9 @@
  * Do not cite source line numbers here — they rot silently. Name the file only.
  *
  * Sources:
+ *   theme.css, styles.ts, DESIGN.md, docs/design/instatic-distilled.html,
  *   DefaultDrawer.tsx, DefaultAppBar.tsx, DrawerNavigationItem.tsx,
- *   DrawerNavigationGroup.tsx
+ *   DrawerNavigationGroup.tsx, FieldBlock.tsx
  */
 import React from "react";
 export declare function UIReferenceView(): React.JSX.Element;

package/dist/debug/ui-reference/SectionBlock.d.ts

@@ -0,0 +1,30 @@
+import React from "react";
+/**
+ * One chapter of the UI reference page.
+ *
+ * `max-w-5xl` and `border-b` cannot share an element here. Several mocks are
+ * app-scale and intrinsically wider than 64rem (the CRM dashboard reaches
+ * 1483px), so a section's own rule used to stop at 1264px while its content
+ * ran past it, and every such section read as a broken edge.
+ *
+ * Split instead: the SECTION spans the column, so its rule always reaches its
+ * own edges; the CONTENT keeps a measure, so a form column never stretches to
+ * 700px on a wide monitor. `wide` opts the app-scale mocks out of the measure;
+ * they pair it with `overflow-x-auto` so they scroll inside themselves rather
+ * than pushing the page.
+ */
+export declare function SectionBlock({ id, title, wide, children }: {
+    id: string;
+    title: string;
+    wide?: boolean;
+    children: React.ReactNode;
+}): React.JSX.Element;
+/** The small monospace caption this page uses to name a specimen. */
+export declare function SpecimenLabel({ children, className }: {
+    children: React.ReactNode;
+    className?: string;
+}): React.JSX.Element;
+/** A 6px hue dot: the product's status vocabulary. `className` carries the hue. */
+export declare function Dot({ className }: {
+    className: string;
+}): React.JSX.Element;

package/dist/debug/ui-reference/SystemSections.d.ts

@@ -0,0 +1,17 @@
+/**
+ * The system chapters of the UI reference: the decisions behind the kit,
+ * shown with the kit's own components. Sources: `packages/ui/src/theme.css`,
+ * `packages/ui/src/styles.ts`, `packages/ui/DESIGN.md`, and the reference the
+ * ladder was measured against, `docs/design/instatic-distilled.html`.
+ *
+ * Nothing here is invented markup: every specimen is a `@rebasepro/ui`
+ * component or a role token from `theme.css`. The Tailwind palette hues
+ * (`bg-green-500` and friends) appear only as dots and icons, which is the
+ * rule this page exists to show.
+ */
+import React from "react";
+export declare function PrinciplesSection(): React.JSX.Element;
+export declare function ColourSection(): React.JSX.Element;
+export declare function ShapeSpaceSection(): React.JSX.Element;
+export declare function DepthIconsSection(): React.JSX.Element;
+export declare function CardsDataSection(): React.JSX.Element;