@mmapp/react 0.1.0-alpha.1

package/dist/atoms/index.d.ts

@@ -0,0 +1,424 @@
+import { FC, ReactNode } from 'react';
+
+/**
+ * Compile-Time Atom Stubs — markers for the compiler to recognize.
+ *
+ * These are NOT runtime components — they are compile-time type stubs that
+ * the @mindmatrix/react-compiler recognizes in JSX and maps to IRExperienceNode
+ * entries. At runtime, the frontend's ComponentTreeRenderer resolves the
+ * component name string to the actual registered React component.
+ *
+ * Usage in .workflow.tsx files:
+ *   import { Stack, Row, Text, Button, TextInput } from '@mindmatrix/react/atoms';
+ *
+ *   return (
+ *     <Stack gap={4}>
+ *       <Text variant="h2">Hello</Text>
+ *       <Row>
+ *         <TextInput bind="message" placeholder="Type..." />
+ *         <Button onClick={send}>Send</Button>
+ *       </Row>
+ *     </Stack>
+ *   );
+ *
+ * The compiler extracts this JSX into an IRExperienceNode tree.
+ * The CTR (ComponentTreeRenderer) renders it at runtime.
+ *
+ * ALL core atoms + sub-experience components are stubbed here,
+ * matching the frontend's component-registry.ts exactly.
+ */
+
+interface BaseAtomProps {
+    children?: ReactNode;
+    visible_when?: string;
+    'data-slot'?: string;
+    className?: string;
+    /** Style object — maps to CSS properties at runtime. */
+    sx?: Record<string, unknown>;
+    /** Common layout shortcuts — passed through to the CTR renderer. */
+    flex?: number | string;
+    width?: number | string;
+    height?: number | string;
+    minWidth?: number | string;
+    minHeight?: number | string;
+    maxWidth?: number | string;
+    maxHeight?: number | string;
+    margin?: number | string;
+    marginTop?: number | string;
+    marginBottom?: number | string;
+    marginLeft?: number | string;
+    marginRight?: number | string;
+    padding?: number | string;
+    paddingTop?: number | string;
+    paddingBottom?: number | string;
+    paddingLeft?: number | string;
+    paddingRight?: number | string;
+    overflow?: string;
+    border?: string;
+    borderTop?: string;
+    borderBottom?: string;
+    borderLeft?: string;
+    borderRight?: string;
+    borderRadius?: number | string;
+    background?: string;
+    position?: string;
+    display?: string;
+    opacity?: number;
+}
+interface StackProps extends BaseAtomProps {
+    gap?: number | string;
+    align?: 'start' | 'center' | 'end' | 'stretch';
+    justify?: 'start' | 'center' | 'end' | 'between' | 'around' | 'space-between' | 'space-around';
+}
+interface RowProps extends BaseAtomProps {
+    gap?: number | string;
+    align?: 'start' | 'center' | 'end' | 'stretch';
+    justify?: 'start' | 'center' | 'end' | 'between' | 'around' | 'space-between' | 'space-around';
+    wrap?: boolean;
+}
+interface GridProps extends BaseAtomProps {
+    columns?: number | string;
+    gap?: number | string;
+    minChildWidth?: string;
+}
+interface DividerProps extends BaseAtomProps {
+    orientation?: 'horizontal' | 'vertical';
+}
+interface SpacerProps extends BaseAtomProps {
+    size?: number | string;
+}
+interface TextProps extends BaseAtomProps {
+    variant?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'body' | 'caption' | 'code' | 'label' | 'muted';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    weight?: 'normal' | 'medium' | 'semibold' | 'bold' | string;
+    value?: string;
+    bind?: string;
+    color?: string;
+    align?: 'left' | 'center' | 'right';
+}
+interface HeadingProps extends BaseAtomProps {
+    level?: 1 | 2 | 3 | 4;
+    value?: string;
+    weight?: 'normal' | 'medium' | 'semibold' | 'bold' | string;
+}
+interface FieldProps extends BaseAtomProps {
+    name?: string;
+    bind?: string;
+    label?: string;
+    editable?: boolean;
+}
+interface ImageProps extends BaseAtomProps {
+    src?: string;
+    alt?: string;
+    width?: number | string;
+    height?: number | string;
+    bind?: string;
+}
+interface BadgeProps extends BaseAtomProps {
+    value?: string;
+    variant?: 'default' | 'success' | 'warning' | 'error' | 'info';
+    bind?: string;
+}
+interface ButtonProps extends BaseAtomProps {
+    variant?: 'default' | 'primary' | 'secondary' | 'destructive' | 'outline' | 'ghost' | 'link';
+    size?: 'sm' | 'md' | 'lg' | 'icon';
+    disabled?: boolean;
+    loading?: boolean;
+    onClick?: (() => void) | string;
+    onPress?: (() => void) | string;
+    label?: string;
+    icon?: string;
+    fullWidth?: boolean;
+}
+interface LinkProps extends BaseAtomProps {
+    href?: string;
+    to?: string;
+    target?: '_blank' | '_self';
+    bind?: string;
+}
+interface ShowProps extends BaseAtomProps {
+    when?: unknown;
+    fallback?: ReactNode;
+}
+interface EachProps<T = unknown> extends BaseAtomProps {
+    items?: T[];
+    as?: string;
+    bind?: string;
+}
+interface CardProps extends BaseAtomProps {
+    title?: string;
+    collapsible?: boolean;
+    defaultCollapsed?: boolean;
+    onClick?: (() => void) | string;
+}
+interface TabsProps extends BaseAtomProps {
+    defaultTab?: string;
+    tabs?: Array<{
+        id: string;
+        label: string;
+    }>;
+}
+interface AccordionProps extends BaseAtomProps {
+    type?: 'single' | 'multiple';
+    defaultValue?: string;
+}
+interface SectionProps extends BaseAtomProps {
+    title?: string;
+    description?: string;
+}
+interface ModalProps extends BaseAtomProps {
+    title?: string;
+    open?: boolean;
+    onClose?: (() => void) | string;
+}
+interface TextInputProps extends BaseAtomProps {
+    bind?: string;
+    value?: string;
+    onChange?: ((value: string) => void) | string;
+    placeholder?: string;
+    label?: string;
+    multiline?: boolean;
+    rows?: number;
+    maxLength?: number;
+    submitOnEnter?: boolean;
+    onSubmit?: (() => void) | string;
+    disabled?: boolean;
+}
+interface SelectProps extends BaseAtomProps {
+    bind?: string;
+    value?: string;
+    onChange?: ((value: string) => void) | string;
+    options?: Array<{
+        value: string;
+        label: string;
+    }> | string[];
+    placeholder?: string;
+    label?: string;
+    disabled?: boolean;
+}
+interface MarkdownProps extends BaseAtomProps {
+    content?: string;
+    bind?: string;
+}
+interface ScrollAreaProps extends BaseAtomProps {
+    maxHeight?: number | string;
+}
+interface Canvas3DProps extends BaseAtomProps {
+    shape?: 'cube' | 'sphere' | 'torus' | 'torusKnot';
+    color?: string;
+    wireframe?: boolean;
+    autoRotate?: boolean;
+}
+interface DataGridProps extends BaseAtomProps {
+    bind?: string;
+    /** Model definition or slug to query data from. */
+    source?: unknown;
+    columns?: Array<{
+        field: string;
+        header: string;
+        editable?: boolean;
+    }>;
+    /** Filter params for the data query. */
+    filters?: Record<string, unknown>;
+}
+interface AnimatedBoxProps extends BaseAtomProps {
+    animation?: 'pulse' | 'bounce' | 'spin' | 'slide-in' | 'fade-in' | 'scale-up' | 'glow' | 'shake' | 'flip' | 'morph';
+    duration?: number;
+}
+interface ServerGridProps extends BaseAtomProps {
+    bind?: string;
+    endpoint?: string;
+    columns?: Array<{
+        field: string;
+        header: string;
+        sortable?: boolean;
+    }>;
+    pageSize?: number;
+}
+interface ChartProps extends BaseAtomProps {
+    type?: 'bar' | 'line' | 'area' | 'pie' | 'sparkline';
+    bind?: string;
+    data?: unknown[];
+    xField?: string;
+    yField?: string;
+    color?: string;
+}
+interface MetricCardProps extends BaseAtomProps {
+    value?: number | string;
+    label?: string;
+    format?: 'currency' | 'number' | 'percentage';
+    trend?: 'up' | 'down' | 'flat';
+    sparkline?: boolean;
+    bind?: string;
+}
+interface SlotProps extends BaseAtomProps {
+    name: string;
+    fallback?: ReactNode;
+}
+interface ModuleOutletProps extends BaseAtomProps {
+    /** Module slug to render views from. */
+    module: string;
+    /** Base path for the module's routes within this outlet. */
+    basePath?: string;
+    /** Fallback content when no module route matches. */
+    fallback?: ReactNode;
+}
+interface MetricsGridProps extends BaseAtomProps {
+    bind?: string;
+}
+interface AdaptiveCardGridProps extends BaseAtomProps {
+    bind?: string;
+}
+interface AdaptiveFiltersProps extends BaseAtomProps {
+    bind?: string;
+    fields?: string[];
+}
+interface PaginationProps extends BaseAtomProps {
+    bind?: string;
+    pageSize?: number;
+}
+interface EntityHeaderProps extends BaseAtomProps {
+    bind?: string;
+}
+interface ProgressTrackerProps extends BaseAtomProps {
+    bind?: string;
+    steps?: string[];
+}
+interface RatingWidgetProps extends BaseAtomProps {
+    bind?: string;
+    max?: number;
+}
+interface FieldSectionProps extends BaseAtomProps {
+    title?: string;
+    fields?: string[];
+}
+interface TransitionActionsProps extends BaseAtomProps {
+    bind?: string;
+}
+interface ChildInstanceListProps extends BaseAtomProps {
+    bind?: string;
+}
+interface BreakdownChartsProps extends BaseAtomProps {
+    bind?: string;
+}
+interface TabbedLayoutProps extends BaseAtomProps {
+    tabs?: Array<{
+        id: string;
+        label: string;
+    }>;
+}
+interface HierarchyBreadcrumbProps extends BaseAtomProps {
+    bind?: string;
+}
+interface SearchInputProps extends BaseAtomProps {
+    bind?: string;
+    placeholder?: string;
+}
+interface SortControlProps extends BaseAtomProps {
+    bind?: string;
+    fields?: string[];
+}
+interface AggregateStatsProps extends BaseAtomProps {
+    bind?: string;
+}
+declare const Stack: FC<StackProps>;
+declare const Row: FC<RowProps>;
+declare const Column: FC<RowProps>;
+declare const Grid: FC<GridProps>;
+declare const Divider: FC<DividerProps>;
+declare const Spacer: FC<SpacerProps>;
+declare const Text: FC<TextProps>;
+declare const Heading: FC<HeadingProps>;
+declare const Field: FC<FieldProps>;
+declare const Image: FC<ImageProps>;
+declare const Badge: FC<BadgeProps>;
+declare const Icon: FC<BaseAtomProps & {
+    name?: string;
+    size?: number | string;
+    color?: string;
+}>;
+declare const Button: FC<ButtonProps>;
+declare const Link: FC<LinkProps>;
+declare const Show: FC<ShowProps>;
+declare const Each: FC<EachProps<unknown>>;
+declare const Card: FC<CardProps>;
+declare const Tabs: FC<TabsProps>;
+declare const Accordion: FC<AccordionProps>;
+declare const Section: FC<SectionProps>;
+declare const Modal: FC<ModalProps>;
+declare const TextInput: FC<TextInputProps>;
+declare const Select: FC<SelectProps>;
+declare const Markdown: FC<MarkdownProps>;
+declare const ScrollArea: FC<ScrollAreaProps>;
+declare const Canvas3D: FC<Canvas3DProps>;
+declare const DataGrid: FC<DataGridProps>;
+declare const AnimatedBox: FC<AnimatedBoxProps>;
+declare const ServerGrid: FC<ServerGridProps>;
+declare const Chart: FC<ChartProps>;
+declare const MetricCard: FC<MetricCardProps>;
+declare const Slot: FC<SlotProps>;
+declare const ModuleOutlet: FC<ModuleOutletProps>;
+declare const MetricsGrid: FC<MetricsGridProps>;
+declare const AdaptiveCardGrid: FC<AdaptiveCardGridProps>;
+declare const AdaptiveFilters: FC<AdaptiveFiltersProps>;
+declare const Pagination: FC<PaginationProps>;
+declare const EntityHeader: FC<EntityHeaderProps>;
+declare const ProgressTracker: FC<ProgressTrackerProps>;
+declare const RatingWidget: FC<RatingWidgetProps>;
+declare const FieldSection: FC<FieldSectionProps>;
+declare const TransitionActions: FC<TransitionActionsProps>;
+declare const ChildInstanceList: FC<ChildInstanceListProps>;
+declare const BreakdownCharts: FC<BreakdownChartsProps>;
+declare const TabbedLayout: FC<TabbedLayoutProps>;
+declare const HierarchyBreadcrumb: FC<HierarchyBreadcrumbProps>;
+declare const SearchInput: FC<SearchInputProps>;
+declare const SortControl: FC<SortControlProps>;
+declare const AggregateStats: FC<AggregateStatsProps>;
+interface RouterProps extends BaseAtomProps {
+    /** Base path prefix for all child routes. */
+    basePath?: string;
+    /** Default/initial route path. */
+    defaultRoute?: string;
+}
+interface RouteProps extends BaseAtomProps {
+    /** Route path pattern (e.g., '/rides/:id'). */
+    path: string;
+    /** Route guard — expression that must be truthy for route to render. */
+    guard?: string;
+    /** Redirect path if guard fails. */
+    redirect?: string;
+    /** Route metadata. */
+    meta?: Record<string, unknown>;
+    /** Whether this is a catch-all/fallback route. */
+    fallback?: boolean;
+}
+interface NavLinkProps extends BaseAtomProps {
+    /** Target route path. */
+    to: string;
+    /** Link label text. */
+    label?: string;
+    /** Icon name (lucide icon). */
+    icon?: string;
+    /** Visual variant. */
+    variant?: 'default' | 'tab' | 'pill' | string;
+    /** Route guard expression. */
+    guard?: string;
+    /** Active class name override. */
+    activeClassName?: string;
+}
+interface RoleGuardProps extends BaseAtomProps {
+    /** Role name required to render children. */
+    role: string;
+    /** Role hierarchy for comparison (highest to lowest). */
+    hierarchy?: string[];
+    /** Whether to include higher roles (default: true). */
+    includeHigher?: boolean;
+    /** Fallback content when role check fails. */
+    fallback?: ReactNode;
+}
+declare const Router: FC<RouterProps>;
+declare const Route: FC<RouteProps>;
+declare const NavLink: FC<NavLinkProps>;
+declare const RoleGuard: FC<RoleGuardProps>;
+
+export { Accordion, type AccordionProps, AdaptiveCardGrid, AdaptiveFilters, AggregateStats, AnimatedBox, type AnimatedBoxProps, Badge, type BadgeProps, type BaseAtomProps, BreakdownCharts, Button, type ButtonProps, Canvas3D, type Canvas3DProps, Card, type CardProps, Chart, type ChartProps, ChildInstanceList, Column, DataGrid, type DataGridProps, Divider, type DividerProps, Each, type EachProps, EntityHeader, Field, type FieldProps, FieldSection, Grid, type GridProps, Heading, type HeadingProps, HierarchyBreadcrumb, Icon, Image, type ImageProps, Link, type LinkProps, Markdown, type MarkdownProps, MetricCard, type MetricCardProps, MetricsGrid, Modal, type ModalProps, ModuleOutlet, type ModuleOutletProps, NavLink, type NavLinkProps, Pagination, ProgressTracker, RatingWidget, RoleGuard, type RoleGuardProps, Route, type RouteProps, Router, type RouterProps, Row, type RowProps, ScrollArea, type ScrollAreaProps, SearchInput, Section, type SectionProps, Select, type SelectProps, ServerGrid, type ServerGridProps, Show, type ShowProps, Slot, type SlotProps, SortControl, Spacer, type SpacerProps, Stack, type StackProps, TabbedLayout, Tabs, type TabsProps, Text, TextInput, type TextInputProps, type TextProps, TransitionActions };

package/dist/atoms/index.js

@@ -0,0 +1,195 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/atoms/index.ts
+var atoms_exports = {};
+__export(atoms_exports, {
+  Accordion: () => Accordion,
+  AdaptiveCardGrid: () => AdaptiveCardGrid,
+  AdaptiveFilters: () => AdaptiveFilters,
+  AggregateStats: () => AggregateStats,
+  AnimatedBox: () => AnimatedBox,
+  Badge: () => Badge,
+  BreakdownCharts: () => BreakdownCharts,
+  Button: () => Button,
+  Canvas3D: () => Canvas3D,
+  Card: () => Card,
+  Chart: () => Chart,
+  ChildInstanceList: () => ChildInstanceList,
+  Column: () => Column,
+  DataGrid: () => DataGrid,
+  Divider: () => Divider,
+  Each: () => Each,
+  EntityHeader: () => EntityHeader,
+  Field: () => Field,
+  FieldSection: () => FieldSection,
+  Grid: () => Grid,
+  Heading: () => Heading,
+  HierarchyBreadcrumb: () => HierarchyBreadcrumb,
+  Icon: () => Icon,
+  Image: () => Image,
+  Link: () => Link,
+  Markdown: () => Markdown,
+  MetricCard: () => MetricCard,
+  MetricsGrid: () => MetricsGrid,
+  Modal: () => Modal,
+  ModuleOutlet: () => ModuleOutlet,
+  NavLink: () => NavLink,
+  Pagination: () => Pagination,
+  ProgressTracker: () => ProgressTracker,
+  RatingWidget: () => RatingWidget,
+  RoleGuard: () => RoleGuard,
+  Route: () => Route,
+  Router: () => Router,
+  Row: () => Row,
+  ScrollArea: () => ScrollArea,
+  SearchInput: () => SearchInput,
+  Section: () => Section,
+  Select: () => Select,
+  ServerGrid: () => ServerGrid,
+  Show: () => Show,
+  Slot: () => Slot,
+  SortControl: () => SortControl,
+  Spacer: () => Spacer,
+  Stack: () => Stack,
+  TabbedLayout: () => TabbedLayout,
+  Tabs: () => Tabs,
+  Text: () => Text,
+  TextInput: () => TextInput,
+  TransitionActions: () => TransitionActions
+});
+module.exports = __toCommonJS(atoms_exports);
+function stub(displayName) {
+  const Component = () => {
+    throw new Error(
+      `<${displayName}> is a compile-time stub from @mindmatrix/react/atoms. It should only appear in .workflow.tsx files processed by the compiler. At runtime, use the ComponentTreeRenderer which resolves "${displayName}" from the component registry.`
+    );
+  };
+  Component.displayName = displayName;
+  return Component;
+}
+var Stack = stub("Stack");
+var Row = stub("Row");
+var Column = stub("Column");
+var Grid = stub("Grid");
+var Divider = stub("Divider");
+var Spacer = stub("Spacer");
+var Text = stub("Text");
+var Heading = stub("Heading");
+var Field = stub("Field");
+var Image = stub("Image");
+var Badge = stub("Badge");
+var Icon = stub("Icon");
+var Button = stub("Button");
+var Link = stub("Link");
+var Show = stub("Show");
+var Each = stub("Each");
+var Card = stub("Card");
+var Tabs = stub("Tabs");
+var Accordion = stub("Accordion");
+var Section = stub("Section");
+var Modal = stub("Modal");
+var TextInput = stub("TextInput");
+var Select = stub("Select");
+var Markdown = stub("Markdown");
+var ScrollArea = stub("ScrollArea");
+var Canvas3D = stub("Canvas3D");
+var DataGrid = stub("DataGrid");
+var AnimatedBox = stub("AnimatedBox");
+var ServerGrid = stub("ServerGrid");
+var Chart = stub("Chart");
+var MetricCard = stub("MetricCard");
+var Slot = stub("Slot");
+var ModuleOutlet = stub("ModuleOutlet");
+var MetricsGrid = stub("MetricsGrid");
+var AdaptiveCardGrid = stub("AdaptiveCardGrid");
+var AdaptiveFilters = stub("AdaptiveFilters");
+var Pagination = stub("Pagination");
+var EntityHeader = stub("EntityHeader");
+var ProgressTracker = stub("ProgressTracker");
+var RatingWidget = stub("RatingWidget");
+var FieldSection = stub("FieldSection");
+var TransitionActions = stub("TransitionActions");
+var ChildInstanceList = stub("ChildInstanceList");
+var BreakdownCharts = stub("BreakdownCharts");
+var TabbedLayout = stub("TabbedLayout");
+var HierarchyBreadcrumb = stub("HierarchyBreadcrumb");
+var SearchInput = stub("SearchInput");
+var SortControl = stub("SortControl");
+var AggregateStats = stub("AggregateStats");
+var Router = stub("Router");
+var Route = stub("Route");
+var NavLink = stub("NavLink");
+var RoleGuard = stub("RoleGuard");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Accordion,
+  AdaptiveCardGrid,
+  AdaptiveFilters,
+  AggregateStats,
+  AnimatedBox,
+  Badge,
+  BreakdownCharts,
+  Button,
+  Canvas3D,
+  Card,
+  Chart,
+  ChildInstanceList,
+  Column,
+  DataGrid,
+  Divider,
+  Each,
+  EntityHeader,
+  Field,
+  FieldSection,
+  Grid,
+  Heading,
+  HierarchyBreadcrumb,
+  Icon,
+  Image,
+  Link,
+  Markdown,
+  MetricCard,
+  MetricsGrid,
+  Modal,
+  ModuleOutlet,
+  NavLink,
+  Pagination,
+  ProgressTracker,
+  RatingWidget,
+  RoleGuard,
+  Route,
+  Router,
+  Row,
+  ScrollArea,
+  SearchInput,
+  Section,
+  Select,
+  ServerGrid,
+  Show,
+  Slot,
+  SortControl,
+  Spacer,
+  Stack,
+  TabbedLayout,
+  Tabs,
+  Text,
+  TextInput,
+  TransitionActions
+});