machinalayout 0.1.0 → 0.2.0

package/dist/react/index.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { b as ResolvedLayoutDocument, N as NodeId, R as Rect, a as ResolvedLayoutNode } from '../types-BudfpzZX.js';
+
+type MachinaSlotProps<TViewData = unknown, TNodeData = unknown> = {
+    id: NodeId;
+    rect: Rect;
+    debugLabel?: string;
+    node: ResolvedLayoutNode;
+    viewKey?: string;
+    viewData?: TViewData;
+    nodeData?: TNodeData;
+};
+type MachinaRenderLayer = {
+    z: number;
+};
+type MachinaReactViewProps = {
+    layout: ResolvedLayoutDocument;
+    views?: Record<string, React.ComponentType<MachinaSlotProps>>;
+    viewData?: Record<string, unknown>;
+    nodeData?: Record<NodeId, unknown>;
+    className?: string;
+    style?: React.CSSProperties;
+    nodeClassName?: string;
+    debug?: boolean;
+    nodeContainment?: "none" | "layout-paint" | "strict";
+    nodeContentVisibility?: "none" | "auto";
+    nodeContainIntrinsicSize?: string;
+    layers?: Record<string, MachinaRenderLayer>;
+    defaultLayer?: string;
+};
+declare function MachinaReactView(props: MachinaReactViewProps): React.JSX.Element;
+
+export { MachinaReactView, type MachinaReactViewProps, type MachinaSlotProps };

package/dist/react/index.js

@@ -0,0 +1,7 @@
+import {
+  MachinaReactView
+} from "../chunk-HU6XYOH7.js";
+import "../chunk-TR24ERZT.js";
+export {
+  MachinaReactView
+};

package/dist/react-native/index.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+import { N as NodeId, R as Rect, a as ResolvedLayoutNode, b as ResolvedLayoutDocument } from '../types-BudfpzZX.js';
+
+type MachinaNativeSlotProps<TViewData = unknown, TNodeData = unknown> = {
+    id: NodeId;
+    rect: Rect;
+    debugLabel?: string;
+    node: ResolvedLayoutNode;
+    viewKey?: string;
+    viewData?: TViewData;
+    nodeData?: TNodeData;
+};
+type MachinaReactNativeLayer = {
+    z: number;
+};
+type MachinaReactNativeViewProps = {
+    layout: ResolvedLayoutDocument;
+    views?: Record<string, React.ComponentType<MachinaNativeSlotProps>>;
+    viewData?: Record<string, unknown>;
+    nodeData?: Record<NodeId, unknown>;
+    layers?: Record<string, MachinaReactNativeLayer>;
+    defaultLayer?: string;
+    debug?: boolean;
+    style?: StyleProp<ViewStyle>;
+    nodeStyle?: StyleProp<ViewStyle>;
+};
+declare function MachinaReactNativeView(props: MachinaReactNativeViewProps): React.ReactElement;
+
+export { type MachinaNativeSlotProps, type MachinaReactNativeLayer, MachinaReactNativeView, type MachinaReactNativeViewProps };

package/dist/react-native/index.js

@@ -0,0 +1,83 @@
+import {
+  toResolvedTree
+} from "../chunk-TR24ERZT.js";
+
+// src/react-native/MachinaReactNativeView.tsx
+import React from "react";
+import { Text, View } from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+function normalizeLayerZ(value) {
+  if (value === void 0 || !Number.isFinite(value)) return 0;
+  return value;
+}
+function getLayerZ(node, layers, defaultLayer) {
+  return normalizeLayerZ(layers[node.layer ?? defaultLayer]?.z);
+}
+function renderNode(node, parentRect, props) {
+  const left = node.rect.x - parentRect.x;
+  const top = node.rect.y - parentRect.y;
+  const viewKey = node.view ?? node.slot;
+  const ViewComponent = viewKey ? props.views[viewKey] : void 0;
+  const layerZ = getLayerZ(node, props.layers, props.defaultLayer);
+  const nodeZ = node.z ?? 0;
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      testID: `machina-node-${node.id}`,
+      style: [
+        {
+          position: "absolute",
+          left,
+          top,
+          width: node.rect.width,
+          height: node.rect.height,
+          zIndex: layerZ * 100 + nodeZ
+        },
+        props.debug ? { borderWidth: 1, borderColor: "rgba(59, 130, 246, 0.9)" } : null,
+        props.nodeStyle
+      ],
+      children: [
+        props.debug ? /* @__PURE__ */ jsx(Text, { children: node.debugLabel ?? node.id }) : null,
+        ViewComponent && props.nodes[node.id] && viewKey ? React.createElement(ViewComponent, {
+          id: node.id,
+          rect: { ...node.rect },
+          debugLabel: node.debugLabel,
+          node: { ...props.nodes[node.id], rect: { ...props.nodes[node.id].rect } },
+          viewKey,
+          viewData: props.viewData?.[viewKey],
+          nodeData: props.nodeData?.[node.id]
+        }) : null,
+        [...node.children].map((child, index) => ({ child, index })).sort(
+          (a, b) => getLayerZ(a.child, props.layers, props.defaultLayer) - getLayerZ(b.child, props.layers, props.defaultLayer) || (a.child.z ?? 0) - (b.child.z ?? 0) || a.index - b.index
+        ).map(({ child }) => renderNode(child, node.rect, props))
+      ]
+    },
+    node.id
+  );
+}
+function MachinaReactNativeView(props) {
+  const tree = toResolvedTree(props.layout);
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      testID: "machina-root-wrapper",
+      style: [
+        { position: "relative", width: tree.rect.width, height: tree.rect.height },
+        props.style
+      ],
+      children: renderNode(tree, tree.rect, {
+        views: props.views ?? {},
+        viewData: props.viewData,
+        nodeData: props.nodeData,
+        nodes: props.layout.nodes,
+        layers: props.layers ?? { base: { z: 0 } },
+        defaultLayer: props.defaultLayer ?? "base",
+        debug: props.debug,
+        nodeStyle: props.nodeStyle
+      })
+    }
+  );
+}
+export {
+  MachinaReactNativeView
+};

package/dist/text/index.d.ts

@@ -0,0 +1,10 @@
+import { a as MachinaTextSource, P as ParseMachinaTextResult, d as MachinaInline, g as MachinaTextDiagnostic } from '../types-C4poVJpR.js';
+export { c as MachinaBulletItem, e as MachinaTextAlign, f as MachinaTextBlock, h as MachinaTextDiagnosticCode, i as MachinaTextDiagnosticLevel, b as MachinaTextDocument, j as MachinaTextLeading, k as MachinaTextOverflow, M as MachinaTextSpec, l as MachinaTextVariant, m as MachinaTextVerticalAlign, n as MachinaTextWrap } from '../types-C4poVJpR.js';
+
+declare function parseMachinaTextInline(text: string): {
+    inline: MachinaInline[];
+    diagnostics: MachinaTextDiagnostic[];
+};
+declare function parseMachinaText(source: MachinaTextSource | string): ParseMachinaTextResult;
+
+export { MachinaInline, MachinaTextDiagnostic, MachinaTextSource, ParseMachinaTextResult, parseMachinaText, parseMachinaTextInline };

package/dist/text/index.js

@@ -0,0 +1,9 @@
+import "../chunk-RJYRJ3LD.js";
+import {
+  parseMachinaText,
+  parseMachinaTextInline
+} from "../chunk-BJOQRPPX.js";
+export {
+  parseMachinaText,
+  parseMachinaTextInline
+};

package/dist/text/react/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { M as MachinaTextSpec, a as MachinaTextSource, b as MachinaTextDocument } from '../../types-C4poVJpR.js';
+
+type MachinaTextViewProps = {
+    text: MachinaTextSpec | MachinaTextSource | MachinaTextDocument | string;
+    className?: string;
+    style?: React.CSSProperties;
+    linkTarget?: React.HTMLAttributeAnchorTarget;
+    onLinkClick?: (href: string, event: React.MouseEvent<HTMLAnchorElement>) => void;
+    showDiagnostics?: boolean;
+};
+declare function MachinaTextView(props: MachinaTextViewProps): React.JSX.Element;
+
+export { MachinaTextView, type MachinaTextViewProps };

package/dist/text/react/index.js

@@ -0,0 +1,7 @@
+import {
+  MachinaTextView
+} from "../../chunk-KYWOCAHK.js";
+import "../../chunk-BJOQRPPX.js";
+export {
+  MachinaTextView
+};

package/dist/text/react-native/index.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { StyleProp, TextStyle, ViewStyle } from 'react-native';
+import { M as MachinaTextSpec, a as MachinaTextSource, b as MachinaTextDocument } from '../../types-C4poVJpR.js';
+
+type MachinaNativeTextViewProps = {
+    text: MachinaTextSpec | MachinaTextSource | MachinaTextDocument | string;
+    style?: StyleProp<TextStyle>;
+    contentStyle?: StyleProp<ViewStyle>;
+    linkStyle?: StyleProp<TextStyle>;
+    codeStyle?: StyleProp<TextStyle>;
+    onLinkPress?: (href: string) => void;
+    showDiagnostics?: boolean;
+};
+declare function MachinaNativeTextView(props: MachinaNativeTextViewProps): React.ReactElement;
+
+export { MachinaNativeTextView, type MachinaNativeTextViewProps };

package/dist/text/react-native/index.js

@@ -0,0 +1,155 @@
+import {
+  parseMachinaText
+} from "../../chunk-BJOQRPPX.js";
+
+// src/text/react-native/MachinaNativeTextView.tsx
+import React from "react";
+import { Text, View } from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_POLICY = {
+  variant: "body",
+  wrap: "word",
+  overflow: "clip",
+  align: "start",
+  leading: "normal",
+  blockGap: 8,
+  listGap: 2,
+  valign: "top"
+};
+var VARIANT_STYLE = {
+  body: { fontSize: 14, fontWeight: "400" },
+  label: { fontSize: 12, fontWeight: "500" },
+  caption: { fontSize: 11, fontWeight: "400", opacity: 0.8 },
+  title: { fontSize: 18, fontWeight: "700" },
+  mono: { fontSize: 12, fontFamily: "monospace" }
+};
+var isDoc = (v) => typeof v === "object" && v !== null && "blocks" in v;
+var isSpec = (v) => typeof v === "object" && v !== null && "kind" in v && v.kind === "text";
+var normalizePositive = (v, f) => typeof v === "number" && Number.isFinite(v) && v > 0 ? v : f;
+var normalizeNonNegative = (v, f) => typeof v === "number" && Number.isFinite(v) && v >= 0 ? v : f;
+function resolveLeadingMultiplier(policy) {
+  if (policy.leading === "tight") return 1.15;
+  if (policy.leading === "loose") return 1.6;
+  if (typeof policy.leading === "number") return policy.leading;
+  if (policy.variant === "body") return 1.4;
+  if (policy.variant === "label") return 1.3;
+  if (policy.variant === "caption") return 1.25;
+  if (policy.variant === "title") return 1.25;
+  return 1.35;
+}
+function normalizeLeading(value) {
+  if (value === void 0) return DEFAULT_POLICY.leading;
+  if (value === "tight" || value === "normal" || value === "loose") return value;
+  return normalizePositive(value, resolveLeadingMultiplier(DEFAULT_POLICY));
+}
+function normalizeText(text) {
+  if (isDoc(text)) return { document: text, diagnostics: [], policy: DEFAULT_POLICY };
+  if (isSpec(text)) {
+    const result2 = parseMachinaText(text.source);
+    return {
+      document: result2.document,
+      diagnostics: result2.diagnostics,
+      policy: {
+        variant: text.variant ?? DEFAULT_POLICY.variant,
+        wrap: text.wrap ?? DEFAULT_POLICY.wrap,
+        overflow: text.overflow ?? DEFAULT_POLICY.overflow,
+        align: text.align ?? DEFAULT_POLICY.align,
+        leading: normalizeLeading(text.leading),
+        blockGap: normalizeNonNegative(text.blockGap, DEFAULT_POLICY.blockGap),
+        listGap: normalizeNonNegative(text.listGap, DEFAULT_POLICY.listGap),
+        valign: text.valign ?? DEFAULT_POLICY.valign
+      }
+    };
+  }
+  const result = parseMachinaText(typeof text === "string" ? { kind: "machina-text", text } : text);
+  return { document: result.document, diagnostics: result.diagnostics, policy: DEFAULT_POLICY };
+}
+function textStyle(policy) {
+  const base = VARIANT_STYLE[policy.variant];
+  const fontSize = base.fontSize ?? 14;
+  return {
+    ...base,
+    lineHeight: fontSize * resolveLeadingMultiplier(policy),
+    textAlign: policy.align === "center" ? "center" : policy.align === "end" ? "right" : "left"
+  };
+}
+var pProps = (policy) => policy.overflow === "ellipsis" ? { numberOfLines: 1, ellipsizeMode: "tail" } : policy.wrap === "none" ? { numberOfLines: 1 } : {};
+function renderInline(inline, key, props) {
+  switch (inline.kind) {
+    case "text":
+      return /* @__PURE__ */ jsx(React.Fragment, { children: inline.text }, key);
+    case "strong":
+      return /* @__PURE__ */ jsx(Text, { style: { fontWeight: "700" }, children: inline.children.map((c, i) => renderInline(c, `${key}-s-${i}`, props)) }, key);
+    case "emphasis":
+      return /* @__PURE__ */ jsx(Text, { style: { fontStyle: "italic" }, children: inline.children.map((c, i) => renderInline(c, `${key}-e-${i}`, props)) }, key);
+    case "code":
+      return /* @__PURE__ */ jsx(Text, { style: [{ fontFamily: "monospace" }, props.codeStyle], children: inline.text }, key);
+    case "link":
+      return /* @__PURE__ */ jsx(
+        Text,
+        {
+          style: [{ textDecorationLine: "underline", color: "#2563eb" }, props.linkStyle],
+          onPress: () => props.onLinkPress?.(inline.href),
+          children: inline.children.map((c, i) => renderInline(c, `${key}-l-${i}`, props))
+        },
+        key
+      );
+  }
+}
+function renderBullet(item, path, props, policy, depth) {
+  return /* @__PURE__ */ jsxs(View, { style: { marginBottom: policy.listGap, marginLeft: depth * 12 }, children: [
+    /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", alignItems: "flex-start" }, children: [
+      /* @__PURE__ */ jsx(Text, { style: textStyle(policy), children: "\u2022 " }),
+      /* @__PURE__ */ jsx(Text, { style: [{ flexShrink: 1 }, textStyle(policy)], ...pProps(policy), children: item.inline.map((i, idx) => renderInline(i, `${path}-i-${idx}`, props)) })
+    ] }),
+    item.children?.map(
+      (child, idx) => renderBullet(child, `${path}-c-${idx}`, props, policy, depth + 1)
+    )
+  ] }, path);
+}
+function MachinaNativeTextView(props) {
+  const normalized = normalizeText(props.text);
+  const justifyContent = normalized.policy.valign === "center" ? "center" : normalized.policy.valign === "bottom" ? "flex-end" : "flex-start";
+  return /* @__PURE__ */ jsx(View, { style: [{ width: "100%", height: "100%", justifyContent }, props.contentStyle], children: /* @__PURE__ */ jsxs(View, { style: { minWidth: 0 }, children: [
+    normalized.document.blocks.map(
+      (block, idx) => block.kind === "paragraph" ? /* @__PURE__ */ jsx(
+        Text,
+        {
+          style: [
+            textStyle(normalized.policy),
+            idx === normalized.document.blocks.length - 1 ? void 0 : { marginBottom: normalized.policy.blockGap },
+            props.style
+          ],
+          ...pProps(normalized.policy),
+          children: block.inline.map((i, iIdx) => renderInline(i, `b-${idx}-${iIdx}`, props))
+        },
+        `b-${idx}`
+      ) : /* @__PURE__ */ jsx(
+        View,
+        {
+          style: idx === normalized.document.blocks.length - 1 ? void 0 : { marginBottom: normalized.policy.blockGap },
+          children: block.items.map(
+            (item, itemIdx) => renderBullet(item, `b-${idx}-item-${itemIdx}`, props, normalized.policy, 0)
+          )
+        },
+        `b-${idx}`
+      )
+    ),
+    props.showDiagnostics && normalized.diagnostics.length > 0 ? /* @__PURE__ */ jsx(
+      Text,
+      {
+        style: {
+          marginTop: normalized.policy.blockGap,
+          padding: 8,
+          fontSize: 11,
+          fontFamily: "monospace",
+          backgroundColor: "rgba(127, 127, 127, 0.12)"
+        },
+        children: normalized.diagnostics.map((d) => `${d.code} (${d.line}:${d.column}) ${d.message}`).join("\n")
+      }
+    ) : null
+  ] }) });
+}
+export {
+  MachinaNativeTextView
+};

package/dist/text/vue/index.d.ts

@@ -0,0 +1,113 @@
+import * as vue from 'vue';
+import { PropType, StyleValue } from 'vue';
+import { M as MachinaTextSpec, a as MachinaTextSource, b as MachinaTextDocument } from '../../types-C4poVJpR.js';
+
+type MachinaVueTextViewProps = {
+    text: MachinaTextSpec | MachinaTextSource | MachinaTextDocument | string;
+    rootClass?: unknown;
+    rootStyle?: StyleValue;
+    linkTarget?: string;
+    onLinkClick?: (href: string, event: MouseEvent) => void;
+    showDiagnostics?: boolean;
+    linkClass?: unknown;
+    linkStyle?: StyleValue;
+    codeClass?: unknown;
+    codeStyle?: StyleValue;
+};
+declare const MachinaVueTextView: vue.DefineComponent<vue.ExtractPropTypes<{
+    text: {
+        type: PropType<MachinaVueTextViewProps["text"]>;
+        required: true;
+    };
+    rootClass: {
+        type: PropType<unknown>;
+        default: undefined;
+    };
+    rootStyle: {
+        type: PropType<StyleValue>;
+        default: undefined;
+    };
+    linkTarget: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    onLinkClick: {
+        type: PropType<MachinaVueTextViewProps["onLinkClick"]>;
+        default: undefined;
+    };
+    showDiagnostics: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    linkClass: {
+        type: PropType<unknown>;
+        default: undefined;
+    };
+    linkStyle: {
+        type: PropType<StyleValue>;
+        default: undefined;
+    };
+    codeClass: {
+        type: PropType<unknown>;
+        default: undefined;
+    };
+    codeStyle: {
+        type: PropType<StyleValue>;
+        default: undefined;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    text: {
+        type: PropType<MachinaVueTextViewProps["text"]>;
+        required: true;
+    };
+    rootClass: {
+        type: PropType<unknown>;
+        default: undefined;
+    };
+    rootStyle: {
+        type: PropType<StyleValue>;
+        default: undefined;
+    };
+    linkTarget: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    onLinkClick: {
+        type: PropType<MachinaVueTextViewProps["onLinkClick"]>;
+        default: undefined;
+    };
+    showDiagnostics: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    linkClass: {
+        type: PropType<unknown>;
+        default: undefined;
+    };
+    linkStyle: {
+        type: PropType<StyleValue>;
+        default: undefined;
+    };
+    codeClass: {
+        type: PropType<unknown>;
+        default: undefined;
+    };
+    codeStyle: {
+        type: PropType<StyleValue>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    onLinkClick: ((href: string, event: MouseEvent) => void) | undefined;
+    rootClass: undefined;
+    rootStyle: StyleValue;
+    linkTarget: string;
+    showDiagnostics: boolean;
+    linkClass: undefined;
+    linkStyle: StyleValue;
+    codeClass: undefined;
+    codeStyle: StyleValue;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+export { MachinaVueTextView, type MachinaVueTextViewProps };