mapples 0.2.0-beta.10 → 0.2.0-beta.13

package/templates/agent/skills/mapples-design/SKILL.md

@@ -195,8 +195,8 @@ Two screens in one plan step: do them one after the other inside the step, synci
 
 ## Phase N-1 — Wiring
 
-Load `playbooks/screen-flow-wiring.md`. For every navigation the plan names, add to the source
-element's primary event both the Creator connection and the runtime handler:
+Load `playbooks/screen-flow-wiring.md`. For every navigation the plan names, add the Creator
+connection to the source element's primary event — it is also what the built app runs:
 
 ```tsx
 <Button
@@ -204,12 +204,12 @@ element's primary event both the Creator connection and the runtime handler:
   variant="filled"
   size="lg"
   fullWidth
-  onPress={() => router.push('/(main)')}
   $actions={{ onPress: { type: 'mapples:navigate', staticData: { pageUuid: '<uuid from base>' } } }}
 />
 ```
 
-(`import { router } from 'expo-router'`.) Rows and cards use their own `onPress`. Walk the golden
+No `router.push` handler next to it (the action replaces it, and the app warns about the
+duplicate). Rows and cards use their own `onPress` event. Walk the golden
 path from the entry screen; every screen reachable, every flow with an exit. Sync; the report's
 `pushedOps` must cover every action you added.
 

package/templates/agent/skills/mapples-design/reference/component-library.md

@@ -62,7 +62,7 @@ and `tone` props and the style slots — never rebuild one from Views. Array pro
 | `ChatComposer` | `placeholder`, `leadingIconName` | the chat input pinned to the bottom |
 | `SegmentedControl` | `options`, `value` | switching a view mode |
 | `Rating` | `value`, `max`, `readOnly` | stars |
-| `ChipGroup` | `options` [{label, value, iconName?}], `value`, `variant` filter\|choice, `scrollable` | filters and tags |
+| `ChipGroup` | `options` [{label, value, iconName?}], `value`, `variant` filter\|assist (filter chips toggle the selection, assist chips report a press), `scrollable` | filters and tags |
 | `Chip` | `label`, `variant` assist\|filter\|suggestion, `selected` | a single tag (content-sized; inside a row) |
 
 ### content

package/templates/agent/skills/mapples-design/reference/layout-contract.md

@@ -174,7 +174,6 @@ left visible with no binding covers the screen forever.
 
 ```tsx
 // (the CLI's `// mapples-route:` marker stays on line 1 once the file is synced)
-import { router } from 'expo-router';
 import { Container, GradientBackground, Icon, Typography, View } from '@mapples/ui';
 import { Button, Card, PageControl, TextLink } from '@mapples/components';
 import { Styler } from '@mapples/style';
@@ -183,7 +182,7 @@ export default function Welcome() {
   return (
     <Container styled={{ style: styles.root }}>
       <View styled={{ style: styles.topBar }}>
-        <TextLink label="Skip" tone="neutral" underline={false} onPress={() => router.push('/(main)')} />
+        <TextLink label="Skip" tone="neutral" underline={false} $actions={{ onPress: { type: 'mapples:navigate', staticData: { pageUuid: '<home uuid>' } } }} />
       </View>
       <View styled={{ style: styles.hero }}>
         <GradientBackground
@@ -201,7 +200,7 @@ export default function Welcome() {
       </View>
       <View styled={{ style: styles.bottom }}>
         <PageControl count={3} value={0} variant="bars" />
-        <Button label="Continue" variant="filled" size="lg" fullWidth onPress={() => router.push('/(onboarding)/features')} />
+        <Button label="Continue" variant="filled" size="lg" fullWidth $actions={{ onPress: { type: 'mapples:navigate', staticData: { pageUuid: '<features uuid>' } } }} />
       </View>
     </Container>
   );

package/templates/agent/skills/mapples-design/reference/playbooks/onboarding-flow.md

@@ -12,4 +12,4 @@ Structure per screen (root column, `justifyContent: 'space-between'`, screen pad
 
 CTA copy arc: "Continue" on middle screens; the LAST screen carries the real ask — "Get started" primary plus a `TextLink` "Sign in" row underneath for returning users.
 
-Pitfalls: no emoji heroes; one hero per screen, never hero + photo; dots and button positions must not shift between screens (same bottom block on all three); wire screen→screen and last screen→auth or home in the wiring phase (`$actions` navigate + `router.push`).
+Pitfalls: no emoji heroes; one hero per screen, never hero + photo; dots and button positions must not shift between screens (same bottom block on all three); wire screen→screen and last screen→auth or home in the wiring phase (`$actions` navigate — the app runs it).

package/templates/agent/skills/mapples-design/reference/playbooks/screen-flow-wiring.md

@@ -5,22 +5,19 @@ Wiring flows: every CTA connected, entries set, a walkable prototype.
 
 A project becomes a product when every path is walkable. After the screens exist, wire them — this is as much the design as the pixels.
 
-How a connection is written (both halves, on the element's primary event):
+How a connection is written (on the element's primary event):
 
 ```tsx
-import { router } from 'expo-router';
-// …
 <Button
   label="Add to order"
   variant="filled"
   size="lg"
   fullWidth
-  onPress={() => router.push('/(main)/cart')}
   $actions={{ onPress: { type: 'mapples:navigate', staticData: { pageUuid: '<uuid>' } } }}
 />
 ```
 
-`$actions` is the Creator connection (the storyboard arrow); `onPress` is the runtime handler. The `pageUuid` is the `uuid` field of `.mapples/base/pages/<pageId>.json`, where `<pageId>` is the key in `.mapples/pages.json` whose `file` is the target route file. Rows use `ListItem`'s `onPress`, cards `MediaCard`'s / `Card`'s `onPress`.
+`$actions` is the Creator connection (the storyboard arrow) AND the app's handler: the built app runs it the way Creator's Play does (guards, replace-on-sign-in and params included). Never add a `router.push` `onPress` next to it — the action replaces a code handler for the same event and the app warns about the duplicate. The `pageUuid` is the `uuid` field of `.mapples/base/pages/<pageId>.json`, where `<pageId>` is the key in `.mapples/pages.json` whose `file` is the target route file. Rows use `ListItem`'s `onPress`, cards `MediaCard`'s / `Card`'s `onPress`.
 
 The contract:
 - Every PRIMARY `Button` navigates to a real page: onboarding Continue → next screen, Get started → auth or home, list row / card → its detail, detail CTA → the flow it starts (cart, booking, player). No dead primary buttons, ever.

package/templates/app/_layout.tsx

@@ -1,8 +1,13 @@
 // GENERATED by Mapples — DO NOT EDIT. This layout is owned by the CLI and
 // regenerated from the navigation document on every `mapples sync`.
 // Edit navigation in Creator instead.
+import MapplesApp from '@mapples/app';
 import { Stack } from 'expo-router';
 
 export default function RootLayout() {
-  return <Stack screenOptions={{ headerShown: false }} />;
+  return (
+    <MapplesApp>
+      <Stack screenOptions={{ headerShown: false }} />
+    </MapplesApp>
+  );
 }

package/templates/gitignore

@@ -9,3 +9,5 @@ web-build/
 .mapples/secret
 # agent-session lease state — local only
 .mapples/agent.json
+# build-time secrets for the Creator API requests (EXPO_PUBLIC_MAPPLES_SECRET_*) — never commit
+.env*.local

package/templates/metro.config.js

@@ -0,0 +1,11 @@
+const { getDefaultConfig } = require('expo/metro-config');
+// Resolves the files `mapples sync` writes (mapples/theme.ts, mapples/assetMap.ts)
+// for @mapples/app — see https://www.npmjs.com/package/@mapples/app.
+const { mapplesResolver } = require('@mapples/app/expo');
+
+const config = getDefaultConfig(__dirname);
+config.resolver.resolveRequest = mapplesResolver((context, moduleName, platform) =>
+  context.resolveRequest(context, moduleName, platform),
+);
+
+module.exports = config;

package/templates/package.json

@@ -10,15 +10,19 @@
     "sync": "mapples sync"
   },
   "dependencies": {
-    "@mapples/action": "^1.1.2",
-    "@mapples/components": "^1.2.1",
-    "@mapples/form": "^1.2.0",
-    "@mapples/inlang": "^1.2.0",
-    "@mapples/render": "^1.2.0",
-    "@mapples/state": "^1.2.0",
-    "@mapples/style": "^1.2.0",
-    "@mapples/types": "^1.2.0",
-    "@mapples/ui": "^1.1.3",
+    "@mapples/action": "__MAPPLES_RUNTIME__",
+    "@mapples/app": "__MAPPLES_RUNTIME__",
+    "@mapples/components": "__MAPPLES_RUNTIME__",
+    "@mapples/fonts": "__MAPPLES_RUNTIME__",
+    "@mapples/form": "__MAPPLES_RUNTIME__",
+    "@mapples/inlang": "__MAPPLES_RUNTIME__",
+    "@mapples/navigation": "__MAPPLES_RUNTIME__",
+    "@mapples/render": "__MAPPLES_RUNTIME__",
+    "@mapples/request": "__MAPPLES_RUNTIME__",
+    "@mapples/state": "__MAPPLES_RUNTIME__",
+    "@mapples/style": "__MAPPLES_RUNTIME__",
+    "@mapples/types": "__MAPPLES_RUNTIME__",
+    "@mapples/ui": "__MAPPLES_RUNTIME__",
     "@react-native-vector-icons/ant-design": "^13.1.0",
     "@react-native-vector-icons/entypo": "^13.1.0",
     "@react-native-vector-icons/evil-icons": "^13.1.0",
@@ -37,6 +41,7 @@
     "@react-native-vector-icons/zocial": "^13.1.0",
     "expo": "~57.0.23",
     "expo-constants": "~57.0.18",
+    "expo-dev-client": "~57.0.19",
     "expo-font": "~57.0.4",
     "expo-image": "~57.0.5",
     "expo-linear-gradient": "~57.0.2",
@@ -47,6 +52,7 @@
     "expo-system-ui": "~57.0.4",
     "expo-web-browser": "~57.0.3",
     "jsbarcode": "^3.12.3",
+    "lodash": "^4.18.0",
     "react": "19.2.3",
     "react-dom": "19.2.3",
     "react-native": "0.86.3",
@@ -57,12 +63,15 @@
     "react-native-screens": "~4.26.0",
     "react-native-svg": "15.15.4",
     "react-native-web": "~0.21.0",
-    "react-native-worklets": "0.10.1"
+    "react-native-worklets": "0.10.1",
+    "rxjs": "^7.8.1",
+    "yup": "^1.6.0"
   },
   "devDependencies": {
     "@babel/core": "^7.26.0",
     "@types/react": "~19.2.2",
     "babel-plugin-mapples-sid": "__CLI_VERSION__",
+    "babel-preset-expo": "~57.0.13",
     "mapples": "__CLI_VERSION__",
     "typescript": "~6.0.3"
   },