@mapples/render 1.6.0-beta.20261005090121 → 1.6.0-beta.20261005121349

package/CHANGELOG.md

@@ -1,6 +1,6 @@
 # @mapples/render
 
-## 1.6.0-beta.20261005090121
+## 1.6.0-beta.20261005121349
 
 ### Minor Changes
 
@@ -16,6 +16,7 @@
 
 - 7339399: Designed navigator chrome. A tabs navigator's `TabBarOptions.componentUuid` and a drawer's `DrawerOptions.componentUuid` name a saved component that renders the bar or the drawer content, and `TabBarOptions.native` asks the exported app for expo-router's `NativeTabs`. `@mapples/render` carries the contract (`NavigatorChromeContext`, `useNavigatorChrome`): the navigator's routes as items with a label, an active flag and an icon renderer, plus `select`, `close` and the safe-area insets. Two new `@mapples/components` elements read it — `TabBarItems` (one tab per route, pill, labels, badges' tones) and `DrawerItems` (one row per route) — and show a notice when the component is not a navigator's design yet; `@mapples/components` now peers on `@mapples/render`. `@mapples/navigation` mounts a design through `TabBarHost` / `DrawerContentHost` (React Navigation's `tabBar` / `drawerContent`, reading only their props so an exported app uses them as-is) when `MapplesNavigation` is given the `chrome` map, and keeps `visible: false` working for a custom bar. The Creator canvas draws a designed tab bar on every screen frame with its measured height as the bottom inset, a platform-styled placeholder for a native bar, frames a chrome master on the components surface at the chrome's shape with the navigator's routes flowing in, and labels storyboard sections with their design. `create_navigator_chrome` creates and assigns a starter design; `set_navigator_options` accepts the new fields.
 - a6c5872: All `@mapples/*` runtime packages now share one version and are versioned and published together from `mapplesorg/mapples-kit`; `mapples-open-kit` is a read-only mirror of the source.
+- 9a80415: Custom and predesigned tab bars. Three new `@mapples/components` elements build a tab bar from ordinary elements: `TabTemplate` repeats its children once per tab of the navigator whose design it sits in (each copy pressable, switching to its tab), and `TabIcon` / `TabLabel` draw that tab's icon and label, with a `styleActive` slot for the active tab. `@mapples/render` scopes each copy through `NavigatorChromeItemProvider` (`useNavigatorChromeItem`), and `@mapples/state` resolves a new reserved binding root, `tab.*` (`tab.label`, `tab.active`, `tab.index`, `TAB_NAMESPACE` in `@mapples/types`), so any element inside the template can bind the tab or show only on the active one — a project whose data state has a top-level `tab` field is now shadowed inside a template. `TabBarOptions.floating` lays a designed bar over the screens instead of below them; `TabBarHost` takes the matching `floating` prop (an exported app passes it next to `Chrome`), pins the bar to the bottom edge, pads it for the home indicator and keeps reporting its height. `@mapplesorg/schematics` holds the starter designs as a registry (`CHROME_PRESETS`: Basic, Floating, Pill, Minimal and Custom tab bars, the basic drawer), replacing the canvas's two init documents. The Creator canvas edits the template in the first tab and mirrors it read-only in the others, evaluates `tab.*` conditions while designing, previews a design nobody has assigned yet against sample tabs, draws a floating bar over its screen frames, resolves a master's data bindings wherever it is rendered read-only (instances, frame chrome, Play), and gives a tab bar design its own "Tab bar" rail palette. `create_navigator_chrome` takes a `preset`; `set_navigator_options` accepts `tabBar.floating`.
 
 ## 1.3.0
 

package/dist/context/NavigatorChromeItemContext.d.ts

@@ -0,0 +1,29 @@
+import { FC, PropsWithChildren } from 'react';
+import { NavigatorChromeItem } from './NavigatorChromeContext';
+/**
+ * The one route a chrome element is repeated for: the per-item scope a
+ * container such as `TabTemplate` gives each copy of its template.
+ *
+ * @interface NavigatorChromeItemScope
+ */
+export interface NavigatorChromeItemScope {
+    /** The route this copy of the template draws. */
+    item: NavigatorChromeItem;
+    /** Position of the route in the chrome, from 0. */
+    index: number;
+    /** How many routes the chrome has. */
+    count: number;
+}
+/**
+ * Carries the {@link NavigatorChromeItemScope} down to the elements of a
+ * repeated template. `undefined` outside one.
+ */
+declare const NavigatorChromeItemContext: import("react").Context<NavigatorChromeItemScope | undefined>;
+/**
+ * Scopes a copy of a chrome template to one route: the item elements
+ * (`TabIcon`, `TabLabel`) read it through `useNavigatorChromeItem`, and any
+ * element's bindings read it as `tab.label`, `tab.active` and `tab.index`.
+ */
+export declare const NavigatorChromeItemProvider: FC<PropsWithChildren<NavigatorChromeItemScope>>;
+export default NavigatorChromeItemContext;
+//# sourceMappingURL=NavigatorChromeItemContext.d.ts.map

package/dist/context/NavigatorChromeItemContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigatorChromeItemContext.d.ts","sourceRoot":"","sources":["../../src/context/NavigatorChromeItemContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,EAAE,EAAE,iBAAiB,EAAW,MAAM,OAAO,CAAC;AAItE,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAE/D;;;;;GAKG;AACH,MAAM,WAAW,wBAAwB;IACvC,iDAAiD;IACjD,IAAI,EAAE,mBAAmB,CAAC;IAC1B,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;GAGG;AACH,QAAA,MAAM,0BAA0B,+DAEpB,CAAC;AAEb;;;;GAIG;AACH,eAAO,MAAM,2BAA2B,EAAE,EAAE,CAC1C,iBAAiB,CAAC,wBAAwB,CAAC,CAgB5C,CAAC;AAEF,eAAe,0BAA0B,CAAC"}

package/dist/context/NavigatorChromeItemContext.js

@@ -0,0 +1,22 @@
+import { createContext, useMemo } from 'react';
+import { TabScopeProvider } from '@mapples/state';
+/**
+ * Carries the {@link NavigatorChromeItemScope} down to the elements of a
+ * repeated template. `undefined` outside one.
+ */
+const NavigatorChromeItemContext = createContext(undefined);
+/**
+ * Scopes a copy of a chrome template to one route: the item elements
+ * (`TabIcon`, `TabLabel`) read it through `useNavigatorChromeItem`, and any
+ * element's bindings read it as `tab.label`, `tab.active` and `tab.index`.
+ */
+export const NavigatorChromeItemProvider = ({ item, index, count, children }) => {
+    const scope = useMemo(() => ({ item, index, count }), [item, index, count]);
+    const { routeId, label, active } = item;
+    const tab = useMemo(() => ({ routeId, label, active, index, count }), [routeId, label, active, index, count]);
+    return (<NavigatorChromeItemContext.Provider value={scope}>
+      <TabScopeProvider value={tab}>{children}</TabScopeProvider>
+    </NavigatorChromeItemContext.Provider>);
+};
+export default NavigatorChromeItemContext;
+//# sourceMappingURL=NavigatorChromeItemContext.js.map

package/dist/context/NavigatorChromeItemContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigatorChromeItemContext.js","sourceRoot":"","sources":["../../src/context/NavigatorChromeItemContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAyB,OAAO,EAAE,MAAM,OAAO,CAAC;AAEtE,OAAO,EAAY,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAmB5D;;;GAGG;AACH,MAAM,0BAA0B,GAAG,aAAa,CAE9C,SAAS,CAAC,CAAC;AAEb;;;;GAIG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAEpC,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;IACvC,MAAM,KAAK,GAAG,OAAO,CACnB,GAAG,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAC9B,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,CACrB,CAAC;IACF,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IACxC,MAAM,GAAG,GAAG,OAAO,CACjB,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAChD,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,CACvC,CAAC;IACF,OAAO,CACL,CAAC,0BAA0B,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAChD;MAAA,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,gBAAgB,CAC5D;IAAA,EAAE,0BAA0B,CAAC,QAAQ,CAAC,CACvC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,0BAA0B,CAAC"}

package/dist/context/index.d.ts

@@ -2,4 +2,6 @@ export { default as RenderContext } from './RenderContext';
 export * from './RenderContext';
 export { default as NavigatorChromeContext } from './NavigatorChromeContext';
 export * from './NavigatorChromeContext';
+export { default as NavigatorChromeItemContext } from './NavigatorChromeItemContext';
+export * from './NavigatorChromeItemContext';
 //# sourceMappingURL=index.d.ts.map

package/dist/context/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAC7E,cAAc,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAC7E,cAAc,0BAA0B,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,cAAc,8BAA8B,CAAC"}

package/dist/context/index.js

@@ -2,4 +2,6 @@ export { default as RenderContext } from './RenderContext';
 export * from './RenderContext';
 export { default as NavigatorChromeContext } from './NavigatorChromeContext';
 export * from './NavigatorChromeContext';
+export { default as NavigatorChromeItemContext } from './NavigatorChromeItemContext';
+export * from './NavigatorChromeItemContext';
 //# sourceMappingURL=index.js.map

package/dist/context/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAC7E,cAAc,0BAA0B,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAC7E,cAAc,0BAA0B,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,cAAc,8BAA8B,CAAC"}

package/dist/hooks/useNavigatorChrome.d.ts

@@ -1,10 +1,24 @@
 import { NavigatorChrome } from '../context/NavigatorChromeContext';
+import { NavigatorChromeItemScope } from '../context/NavigatorChromeItemContext';
 /**
  * The navigator chrome a host provides, or `undefined` when the component is
  * not mounted as a navigator's chrome. The library's chrome elements use this
  * to tell the designer they are not attached yet instead of failing.
  */
 export declare const useOptionalNavigatorChrome: () => NavigatorChrome | undefined;
+/**
+ * The route a chrome template copy is rendered for, or `undefined` outside a
+ * repeating container (`TabTemplate`). Item elements use this to tell the
+ * designer where they belong instead of failing.
+ */
+export declare const useOptionalNavigatorChromeItem: () => NavigatorChromeItemScope | undefined;
+/**
+ * The route a chrome template copy is rendered for.
+ *
+ * @throws When no `NavigatorChromeItemProvider` is above — the element is not
+ * inside a repeating chrome container.
+ */
+export declare const useNavigatorChromeItem: () => NavigatorChromeItemScope;
 /**
  * The navigator chrome a host provides.
  *

package/dist/hooks/useNavigatorChrome.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useNavigatorChrome.d.ts","sourceRoot":"","sources":["../../src/hooks/useNavigatorChrome.ts"],"names":[],"mappings":"AAEA,OAA+B,EAC7B,eAAe,EAChB,MAAM,mCAAmC,CAAC;AAE3C;;;;GAIG;AACH,eAAO,MAAM,0BAA0B,QAAO,eAAe,GAAG,SAC5B,CAAC;AAErC;;;;;GAKG;AACH,QAAA,MAAM,kBAAkB,QAAO,eAQ9B,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"useNavigatorChrome.d.ts","sourceRoot":"","sources":["../../src/hooks/useNavigatorChrome.ts"],"names":[],"mappings":"AAEA,OAA+B,EAC7B,eAAe,EAChB,MAAM,mCAAmC,CAAC;AAC3C,OAAmC,EACjC,wBAAwB,EACzB,MAAM,uCAAuC,CAAC;AAE/C;;;;GAIG;AACH,eAAO,MAAM,0BAA0B,QAAO,eAAe,GAAG,SAC5B,CAAC;AAErC;;;;GAIG;AACH,eAAO,MAAM,8BAA8B,QACvC,wBAAwB,GACxB,SAAmD,CAAC;AAExD;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB,QAAO,wBAQzC,CAAC;AAEF;;;;;GAKG;AACH,QAAA,MAAM,kBAAkB,QAAO,eAQ9B,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/hooks/useNavigatorChrome.js

@@ -1,11 +1,31 @@
 import { useContext } from 'react';
 import NavigatorChromeContext from '../context/NavigatorChromeContext';
+import NavigatorChromeItemContext from '../context/NavigatorChromeItemContext';
 /**
  * The navigator chrome a host provides, or `undefined` when the component is
  * not mounted as a navigator's chrome. The library's chrome elements use this
  * to tell the designer they are not attached yet instead of failing.
  */
 export const useOptionalNavigatorChrome = () => useContext(NavigatorChromeContext);
+/**
+ * The route a chrome template copy is rendered for, or `undefined` outside a
+ * repeating container (`TabTemplate`). Item elements use this to tell the
+ * designer where they belong instead of failing.
+ */
+export const useOptionalNavigatorChromeItem = () => useContext(NavigatorChromeItemContext);
+/**
+ * The route a chrome template copy is rendered for.
+ *
+ * @throws When no `NavigatorChromeItemProvider` is above — the element is not
+ * inside a repeating chrome container.
+ */
+export const useNavigatorChromeItem = () => {
+    const scope = useContext(NavigatorChromeItemContext);
+    if (!scope) {
+        throw new Error('useNavigatorChromeItem: no chrome item — the element is not inside a tab item template');
+    }
+    return scope;
+};
 /**
  * The navigator chrome a host provides.
  *

package/dist/hooks/useNavigatorChrome.js.map

@@ -1 +1 @@
-{"version":3,"file":"useNavigatorChrome.js","sourceRoot":"","sources":["../../src/hooks/useNavigatorChrome.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,sBAEN,MAAM,mCAAmC,CAAC;AAE3C;;;;GAIG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAgC,EAAE,CAC1E,UAAU,CAAC,sBAAsB,CAAC,CAAC;AAErC;;;;;GAKG;AACH,MAAM,kBAAkB,GAAG,GAAoB,EAAE;IAC/C,MAAM,MAAM,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC;IAClD,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CACb,uGAAuG,CACxG,CAAC;IACJ,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"useNavigatorChrome.js","sourceRoot":"","sources":["../../src/hooks/useNavigatorChrome.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,sBAEN,MAAM,mCAAmC,CAAC;AAC3C,OAAO,0BAEN,MAAM,uCAAuC,CAAC;AAE/C;;;;GAIG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAgC,EAAE,CAC1E,UAAU,CAAC,sBAAsB,CAAC,CAAC;AAErC;;;;GAIG;AACH,MAAM,CAAC,MAAM,8BAA8B,GAAG,GAEhC,EAAE,CAAC,UAAU,CAAC,0BAA0B,CAAC,CAAC;AAExD;;;;;GAKG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAA6B,EAAE;IACnE,MAAM,KAAK,GAAG,UAAU,CAAC,0BAA0B,CAAC,CAAC;IACrD,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CACb,wFAAwF,CACzF,CAAC;IACJ,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,kBAAkB,GAAG,GAAoB,EAAE;IAC/C,MAAM,MAAM,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC;IAClD,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CACb,uGAAuG,CACxG,CAAC;IACJ,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mapples/render",
-  "version": "1.6.0-beta.20261005090121",
+  "version": "1.6.0-beta.20261005121349",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "scripts": {