react-native-roster 0.0.1 → 0.2.0

package/dist/src/core/source.d.ts

@@ -0,0 +1,4 @@
+import type { Source } from './types';
+/** Match source identity by kind and id, ignoring display metadata. */
+export declare function hasSource(sources: readonly Source[], source: Source | undefined): boolean;
+//# sourceMappingURL=source.d.ts.map

package/dist/src/core/source.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"source.d.ts","sourceRoot":"","sources":["../../../src/core/source.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEtC,uEAAuE;AACvE,wBAAgB,SAAS,CAAC,OAAO,EAAE,SAAS,MAAM,EAAE,EAAE,MAAM,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,CAKzF"}

package/dist/src/core/source.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.hasSource = hasSource;
+/** Match source identity by kind and id, ignoring display metadata. */
+function hasSource(sources, source) {
+    return (source !== undefined &&
+        sources.some((item) => item.kind === source.kind && item.id === source.id));
+}
+//# sourceMappingURL=source.js.map

package/dist/src/core/source.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"source.js","sourceRoot":"","sources":["../../../src/core/source.ts"],"names":[],"mappings":";;;AAEA,uEAAuE;AACvE,mBAA0B,OAA0B,EAAE,MAA0B;IAC9E,OAAO,CACL,MAAM,KAAK,SAAS;QACpB,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,KAAK,MAAM,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,KAAK,MAAM,CAAC,EAAE,CAAC,CAC3E,CAAC;AACJ,CAAC"}

package/dist/src/index.d.ts

@@ -1,7 +1,9 @@
 export type { GapInput, IntervalInput } from './components/layers/layers.types';
 export { RosterGap } from './components/layers/parts/gap';
 export { RosterInterval } from './components/layers/parts/interval';
+export { Portal, PortalHost } from './components/primitives/portal';
 export { Roster } from './components/roster';
+export { RosterBodyLayout } from './components/roster/body-layout';
 export { RosterLaneLabel } from './components/roster/lanes/parts/lane-label';
 export { RosterBody } from './components/roster/parts/body';
 export { RosterCorner } from './components/roster/parts/corner';
@@ -10,7 +12,10 @@ export { RosterGrid } from './components/roster/parts/grid';
 export { RosterHeader } from './components/roster/parts/header';
 export { RosterHeaderCell } from './components/roster/parts/header-cell';
 export { RosterLaneLabelColumn } from './components/roster/parts/lane-label-column';
-export type { BodyInput, GridInput, HeaderInput, LabelColumnInput, LaneLabelInput, RosterInput, RosterModel, RosterProjection, RosterProps, RosterScroll, RosterStyleProps, RosterTick, } from './components/roster/roster.types';
+export { RosterLaneList } from './components/roster/parts/lane-list';
+export type { BodyInput, GridInput, HeaderCellInput, HeaderInput, IntervalDetailInput, LabelColumnInput, LaneLabelInput, RosterInput, RosterModel, RosterProjection, RosterProps, RosterScroll, RosterStyleProps, RosterTick, } from './components/roster/roster.types';
+export { RosterSelectionPopover } from './components/roster/selection/selection-layout';
+export type { SelectionLayoutProps } from './components/roster/selection/selection-layout.types';
 export { useRoster } from './components/roster/use-roster';
 export { Schedule } from './components/schedule';
 export { ScheduleColumn } from './components/schedule/days/parts/column';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,4CAA4C,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,6CAA6C,CAAC;AACpF,YAAY,EACV,SAAS,EACT,SAAS,EACT,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,WAAW,EACX,WAAW,EACX,gBAAgB,EAChB,WAAW,EACX,YAAY,EACZ,gBAAgB,EAChB,UAAU,GACX,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAC;AACzE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6CAA6C,CAAC;AAChF,OAAO,EAAE,YAAY,EAAE,MAAM,uCAAuC,CAAC;AACrE,OAAO,EAAE,eAAe,EAAE,MAAM,2CAA2C,CAAC;AAC5E,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAC;AACjF,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAC5E,YAAY,EACV,mBAAmB,EACnB,kBAAkB,EAClB,aAAa,EACb,aAAa,EACb,kBAAkB,EAClB,aAAa,EACb,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AACnE,OAAO,EAAE,eAAe,EAAE,MAAM,4CAA4C,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAC;AACzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,6CAA6C,CAAC;AACpF,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,YAAY,EACV,SAAS,EACT,SAAS,EACT,eAAe,EACf,WAAW,EACX,mBAAmB,EACnB,gBAAgB,EAChB,cAAc,EACd,WAAW,EACX,WAAW,EACX,gBAAgB,EAChB,WAAW,EACX,YAAY,EACZ,gBAAgB,EAChB,UAAU,GACX,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,gDAAgD,CAAC;AACxF,YAAY,EAAE,oBAAoB,EAAE,MAAM,sDAAsD,CAAC;AACjG,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAC;AACzE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6CAA6C,CAAC;AAChF,OAAO,EAAE,YAAY,EAAE,MAAM,uCAAuC,CAAC;AACrE,OAAO,EAAE,eAAe,EAAE,MAAM,2CAA2C,CAAC;AAC5E,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAC;AACjF,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAC5E,YAAY,EACV,mBAAmB,EACnB,kBAAkB,EAClB,aAAa,EACb,aAAa,EACb,kBAAkB,EAClB,aAAa,EACb,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,cAAc,QAAQ,CAAC"}

package/dist/src/index.js

@@ -14,13 +14,18 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSchedule = exports.ScheduleIncomplete = exports.ScheduleGutter = exports.ScheduleTransition = exports.ScheduleSkippedDate = exports.ScheduleNowLine = exports.ScheduleGrid = exports.ScheduleDayHeader = exports.ScheduleColumn = exports.Schedule = exports.useRoster = exports.RosterLaneLabelColumn = exports.RosterHeaderCell = exports.RosterHeader = exports.RosterGrid = exports.RosterEmpty = exports.RosterCorner = exports.RosterBody = exports.RosterLaneLabel = exports.Roster = exports.RosterInterval = exports.RosterGap = void 0;
+exports.useSchedule = exports.ScheduleIncomplete = exports.ScheduleGutter = exports.ScheduleTransition = exports.ScheduleSkippedDate = exports.ScheduleNowLine = exports.ScheduleGrid = exports.ScheduleDayHeader = exports.ScheduleColumn = exports.Schedule = exports.useRoster = exports.RosterSelectionPopover = exports.RosterLaneList = exports.RosterLaneLabelColumn = exports.RosterHeaderCell = exports.RosterHeader = exports.RosterGrid = exports.RosterEmpty = exports.RosterCorner = exports.RosterBody = exports.RosterLaneLabel = exports.RosterBodyLayout = exports.Roster = exports.PortalHost = exports.Portal = exports.RosterInterval = exports.RosterGap = void 0;
 var gap_1 = require("./components/layers/parts/gap");
 Object.defineProperty(exports, "RosterGap", { enumerable: true, get: function () { return gap_1.RosterGap; } });
 var interval_1 = require("./components/layers/parts/interval");
 Object.defineProperty(exports, "RosterInterval", { enumerable: true, get: function () { return interval_1.RosterInterval; } });
+var portal_1 = require("./components/primitives/portal");
+Object.defineProperty(exports, "Portal", { enumerable: true, get: function () { return portal_1.Portal; } });
+Object.defineProperty(exports, "PortalHost", { enumerable: true, get: function () { return portal_1.PortalHost; } });
 var roster_1 = require("./components/roster");
 Object.defineProperty(exports, "Roster", { enumerable: true, get: function () { return roster_1.Roster; } });
+var body_layout_1 = require("./components/roster/body-layout");
+Object.defineProperty(exports, "RosterBodyLayout", { enumerable: true, get: function () { return body_layout_1.RosterBodyLayout; } });
 var lane_label_1 = require("./components/roster/lanes/parts/lane-label");
 Object.defineProperty(exports, "RosterLaneLabel", { enumerable: true, get: function () { return lane_label_1.RosterLaneLabel; } });
 var body_1 = require("./components/roster/parts/body");
@@ -37,6 +42,10 @@ var header_cell_1 = require("./components/roster/parts/header-cell");
 Object.defineProperty(exports, "RosterHeaderCell", { enumerable: true, get: function () { return header_cell_1.RosterHeaderCell; } });
 var lane_label_column_1 = require("./components/roster/parts/lane-label-column");
 Object.defineProperty(exports, "RosterLaneLabelColumn", { enumerable: true, get: function () { return lane_label_column_1.RosterLaneLabelColumn; } });
+var lane_list_1 = require("./components/roster/parts/lane-list");
+Object.defineProperty(exports, "RosterLaneList", { enumerable: true, get: function () { return lane_list_1.RosterLaneList; } });
+var selection_layout_1 = require("./components/roster/selection/selection-layout");
+Object.defineProperty(exports, "RosterSelectionPopover", { enumerable: true, get: function () { return selection_layout_1.RosterSelectionPopover; } });
 var use_roster_1 = require("./components/roster/use-roster");
 Object.defineProperty(exports, "useRoster", { enumerable: true, get: function () { return use_roster_1.useRoster; } });
 var schedule_1 = require("./components/schedule");

package/dist/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AACA,qDAA0D;AAAjD,gGAAA,SAAS,OAAA;AAClB,+DAAoE;AAA3D,0GAAA,cAAc,OAAA;AACvB,8CAA6C;AAApC,gGAAA,MAAM,OAAA;AACf,yEAA6E;AAApE,6GAAA,eAAe,OAAA;AACxB,uDAA4D;AAAnD,kGAAA,UAAU,OAAA;AACnB,2DAAgE;AAAvD,sGAAA,YAAY,OAAA;AACrB,yDAA8D;AAArD,oGAAA,WAAW,OAAA;AACpB,uDAA4D;AAAnD,kGAAA,UAAU,OAAA;AACnB,2DAAgE;AAAvD,sGAAA,YAAY,OAAA;AACrB,qEAAyE;AAAhE,+GAAA,gBAAgB,OAAA;AACzB,iFAAoF;AAA3E,0HAAA,qBAAqB,OAAA;AAe9B,6DAA2D;AAAlD,uGAAA,SAAS,OAAA;AAClB,kDAAiD;AAAxC,oGAAA,QAAQ,OAAA;AACjB,kEAAyE;AAAhE,wGAAA,cAAc,OAAA;AACvB,0EAAgF;AAAvE,+GAAA,iBAAiB,OAAA;AAC1B,8DAAqE;AAA5D,oGAAA,YAAY,OAAA;AACrB,sEAA4E;AAAnE,2GAAA,eAAe,OAAA;AACxB,8EAAoF;AAA3E,mHAAA,mBAAmB,OAAA;AAC5B,0EAAiF;AAAxE,gHAAA,kBAAkB,OAAA;AAC3B,6DAAoE;AAA3D,wGAAA,cAAc,OAAA;AACvB,qEAA4E;AAAnE,gHAAA,kBAAkB,OAAA;AAY3B,mEAAiE;AAAxD,2GAAA,WAAW,OAAA;AACpB,yCAAuB"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AACA,qDAA0D;AAAjD,gGAAA,SAAS,OAAA;AAClB,+DAAoE;AAA3D,0GAAA,cAAc,OAAA;AACvB,yDAAoE;AAA3D,gGAAA,MAAM,OAAA;AAAE,oGAAA,UAAU,OAAA;AAC3B,8CAA6C;AAApC,gGAAA,MAAM,OAAA;AACf,+DAAmE;AAA1D,+GAAA,gBAAgB,OAAA;AACzB,yEAA6E;AAApE,6GAAA,eAAe,OAAA;AACxB,uDAA4D;AAAnD,kGAAA,UAAU,OAAA;AACnB,2DAAgE;AAAvD,sGAAA,YAAY,OAAA;AACrB,yDAA8D;AAArD,oGAAA,WAAW,OAAA;AACpB,uDAA4D;AAAnD,kGAAA,UAAU,OAAA;AACnB,2DAAgE;AAAvD,sGAAA,YAAY,OAAA;AACrB,qEAAyE;AAAhE,+GAAA,gBAAgB,OAAA;AACzB,iFAAoF;AAA3E,0HAAA,qBAAqB,OAAA;AAC9B,iEAAqE;AAA5D,2GAAA,cAAc,OAAA;AAiBvB,mFAAwF;AAA/E,0HAAA,sBAAsB,OAAA;AAE/B,6DAA2D;AAAlD,uGAAA,SAAS,OAAA;AAClB,kDAAiD;AAAxC,oGAAA,QAAQ,OAAA;AACjB,kEAAyE;AAAhE,wGAAA,cAAc,OAAA;AACvB,0EAAgF;AAAvE,+GAAA,iBAAiB,OAAA;AAC1B,8DAAqE;AAA5D,oGAAA,YAAY,OAAA;AACrB,sEAA4E;AAAnE,2GAAA,eAAe,OAAA;AACxB,8EAAoF;AAA3E,mHAAA,mBAAmB,OAAA;AAC5B,0EAAiF;AAAxE,gHAAA,kBAAkB,OAAA;AAC3B,6DAAoE;AAA3D,wGAAA,cAAc,OAAA;AACvB,qEAA4E;AAAnE,gHAAA,kBAAkB,OAAA;AAY3B,mEAAiE;AAAxD,2GAAA,WAAW,OAAA;AACpB,yCAAuB"}

package/dist/src/nativewind/index.d.ts

@@ -8,21 +8,22 @@ type Mapping<T> = {
 /** Each class prop resolves into the style prop of the same chrome region. */
 export declare const rosterClassNames: Mapping<RosterStyleProps>;
 export declare const scheduleClassNames: Mapping<ScheduleStyleProps>;
-export declare const Roster: import("react").ComponentType<import("../components/roster/roster.types").RosterInput & RosterStyleProps & {
+export declare const Roster: import("react").ComponentType<Omit<import("../components/roster/roster.types").RosterInput, "selectable"> & RosterStyleProps & {
+    intervalDetailComponent?: import("react").ComponentType<import("../components/roster/roster.types").IntervalDetailInput>;
+    selectionLayout?: import("react").ComponentType<import("..").SelectionLayoutProps>;
+    portalHost?: string;
     incompleteLabel?: string;
     neverSetLabel?: string;
-    laneLabelZone?: (input: import("../components/roster/roster.types").LaneLabelInput) => import("react").ReactNode;
-    headerCellZone?: (input: {
-        tick: import("../components/roster/roster.types").RosterTick;
-    }) => import("react").ReactNode;
-    intervalZone?: (input: import("..").IntervalInput) => import("react").ReactNode;
-    gapZone?: (input: import("..").GapInput) => import("react").ReactNode;
-    gridZone?: (input: import("../components/roster/roster.types").GridInput) => import("react").ReactNode;
-    emptyZone?: () => import("react").ReactNode;
-    cornerZone?: () => import("react").ReactNode;
-    headerZone?: (input: import("../components/roster/roster.types").HeaderInput) => import("react").ReactNode;
-    laneLabelColumnZone?: (input: import("../components/roster/roster.types").LabelColumnInput) => import("react").ReactNode;
-    bodyZone?: (input: import("../components/roster/roster.types").BodyInput) => import("react").ReactNode;
+    laneLabelComponent?: import("react").ComponentType<import("../components/roster/roster.types").LaneLabelInput>;
+    headerCellComponent?: import("react").ComponentType<import("../components/roster/roster.types").HeaderCellInput>;
+    intervalComponent?: import("react").ComponentType<import("..").IntervalInput>;
+    gapComponent?: import("react").ComponentType<import("..").GapInput>;
+    gridComponent?: import("react").ComponentType<import("../components/roster/roster.types").GridInput>;
+    emptyZone?: import("react").ReactNode;
+    cornerZone?: import("react").ReactNode;
+    headerComponent?: import("react").ComponentType<import("../components/roster/roster.types").HeaderInput>;
+    laneLabelColumnComponent?: import("react").ComponentType<import("../components/roster/roster.types").LabelColumnInput>;
+    bodyComponent?: import("react").ComponentType<import("../components/roster/roster.types").BodyInput>;
 } & {
     bodyClassName?: string | undefined;
     className?: string | undefined;
@@ -31,26 +32,26 @@ export declare const Roster: import("react").ComponentType<import("../components
 }>;
 export declare const Schedule: import("react").ComponentType<import("../components/schedule/schedule.types").ScheduleInput & ScheduleStyleProps & {
     incompleteLabel?: string;
-    gutterZone?: (input: import("../components/schedule/schedule.types").ScheduleHoursInput) => import("react").ReactNode;
-    gridZone?: (input: import("../components/schedule/schedule.types").ScheduleHoursInput) => import("react").ReactNode;
-    dayHeaderZone?: (input: {
+    gutterComponent?: import("react").ComponentType<import("../components/schedule/schedule.types").ScheduleHoursInput>;
+    gridComponent?: import("react").ComponentType<import("../components/schedule/schedule.types").ScheduleHoursInput>;
+    dayHeaderComponent?: import("react").ComponentType<{
         day: import("..").DayColumn;
-    }) => import("react").ReactNode;
-    skippedDateZone?: (input: {
+    }>;
+    skippedDateComponent?: import("react").ComponentType<{
         localDate: string;
-    }) => import("react").ReactNode;
-    columnZone?: (input: import("../components/schedule/schedule.types").ScheduleColumnInput) => import("react").ReactNode;
-    transitionZone?: (input: import("../components/schedule/schedule.types").ScheduleTransitionInput) => import("react").ReactNode;
-    nowLineZone?: (input: {
+    }>;
+    columnComponent?: import("react").ComponentType<import("../components/schedule/schedule.types").ScheduleColumnInput>;
+    transitionComponent?: import("react").ComponentType<import("../components/schedule/schedule.types").ScheduleTransitionInput>;
+    nowLineComponent?: import("react").ComponentType<{
         y: number;
         column: number;
-    }) => import("react").ReactNode;
-    intervalZone?: (input: import("..").IntervalInput) => import("react").ReactNode;
-    gapZone?: (input: import("..").GapInput) => import("react").ReactNode;
-    incompleteZone?: (input: {
+    }>;
+    intervalComponent?: import("react").ComponentType<import("..").IntervalInput>;
+    gapComponent?: import("react").ComponentType<import("..").GapInput>;
+    incompleteComponent?: import("react").ComponentType<{
         lane: import("..").Lane;
         label: string;
-    }) => import("react").ReactNode;
+    }>;
 } & {
     className?: string | undefined;
     daysClassName?: string | undefined;

package/dist/src/nativewind/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/nativewind/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAE1E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uCAAuC,CAAC;AAEhF,KAAK,aAAa,CAAC,CAAC,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE,GAAG,MAAM,WAAW,GAAG,GAAG,MAAM,WAAW,CAAC,CAAC;AACtF,KAAK,WAAW,CAAC,CAAC,SAAS,MAAM,IAAI,CAAC,SAAS,GAAG,MAAM,MAAM,WAAW,GACrE,GAAG,MAAM,OAAO,GAChB,OAAO,CAAC;AACZ,KAAK,OAAO,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC;CAAE,CAAC;AAEhE,8EAA8E;AAC9E,eAAO,MAAM,gBAAgB,EAAE,OAAO,CAAC,gBAAgB,CAKtD,CAAC;AACF,eAAO,MAAM,kBAAkB,EAAE,OAAO,CAAC,kBAAkB,CAK1D,CAAC;AAIF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;EAA2C,CAAC;AAC/D,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA+C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/nativewind/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAE1E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uCAAuC,CAAC;AAEhF,KAAK,aAAa,CAAC,CAAC,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE,GAAG,MAAM,WAAW,GAAG,GAAG,MAAM,WAAW,CAAC,CAAC;AACtF,KAAK,WAAW,CAAC,CAAC,SAAS,MAAM,IAAI,CAAC,SAAS,GAAG,MAAM,MAAM,WAAW,GACrE,GAAG,MAAM,OAAO,GAChB,OAAO,CAAC;AACZ,KAAK,OAAO,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC;CAAE,CAAC;AAEhE,8EAA8E;AAC9E,eAAO,MAAM,gBAAgB,EAAE,OAAO,CAAC,gBAAgB,CAKtD,CAAC;AACF,eAAO,MAAM,kBAAkB,EAAE,OAAO,CAAC,kBAAkB,CAK1D,CAAC;AAIF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;EAA2C,CAAC;AAC/D,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA+C,CAAC"}

package/docs/migrations.md

@@ -0,0 +1,61 @@
+# Migrations
+
+Changes to public props that need consumer edits, by the version that ships them.
+The changelog lists every change; this page carries only the ones with a
+migration step.
+
+## 0.1.0: slot components replace render functions
+
+Every Roster and Schedule prop that used to take a render function now takes a
+component type or a node. Props ending in `Component` accept
+`ComponentType<Input>` and are mounted by React with the same input as props.
+Props ending in `Zone` accept `ReactNode`. Press callbacks (`onIntervalPress`,
+`onGapPress`, `onCellPress`, `onIntervalHover`, `onNavigate`) are unchanged.
+
+| Before (0.0.x) | After (0.1.0) | Input |
+| --- | --- | --- |
+| `emptyZone={() => <Empty />}` | `emptyZone={<Empty />}` | none |
+| `cornerZone={() => <Corner />}` | `cornerZone={<Corner />}` | none |
+| `headerZone={(input) => ...}` | `headerComponent={Header}` | `HeaderInput` |
+| `laneLabelColumnZone={(input) => ...}` | `laneLabelColumnComponent={LabelColumn}` | `LabelColumnInput` |
+| `bodyZone={(input) => ...}` | `bodyComponent={Body}` | `BodyInput` |
+| `headerCellZone={({ tick }) => ...}` | `headerCellComponent={HeaderCell}` | `HeaderCellInput` |
+| `laneLabelZone={(input) => ...}` | `laneLabelComponent={LaneLabel}` | `LaneLabelInput` |
+| `intervalZone={(input) => ...}` | `intervalComponent={Interval}` | `IntervalInput` |
+| `gapZone={(input) => ...}` | `gapComponent={Gap}` | `GapInput` |
+| `gridZone={(input) => ...}` | `gridComponent={Grid}` | `GridInput` |
+
+Schedule follows the same rule: `gutterZone`, `gridZone`, `dayHeaderZone`,
+`skippedDateZone`, `columnZone`, `transitionZone`, `nowLineZone`, `intervalZone`,
+`gapZone`, and `incompleteZone` become the matching `Component` props with the
+same inputs.
+
+Nested contracts renamed with them: `HeaderInput.headerCellZone` is now
+`headerCellComponent`, `LabelColumnInput.laneLabelZone` is now
+`laneLabelComponent`, and `BodyInput` carries `intervalComponent`,
+`gapComponent`, and `gridComponent`.
+
+Mechanical rewrite for a render function that was already a plain function of
+its input:
+
+```tsx
+// Before
+<Roster intervalZone={({ rect, layer }) => <Bar rect={rect} layer={layer} />} />
+
+// After: the same function, declared once at module scope and passed as a type
+function Interval({ rect, layer }: IntervalInput) {
+  return <Bar rect={rect} layer={layer} />;
+}
+<Roster intervalComponent={Interval} />
+```
+
+Declare slot components at module scope. An inline arrow creates a new
+component type every render, which remounts every interval and defeats the
+body's content key.
+
+The default parts are exported under their existing names (`RosterInterval`,
+`RosterGap`, `RosterLaneLabel`, `RosterHeaderCell`, `RosterGrid`, `RosterHeader`,
+`RosterLaneLabelColumn`, `RosterBody`, `RosterEmpty`, `RosterCorner`) and can be
+composed inside a replacement. `RosterBody` is now built from `RosterBodyLayout`
+(arranges `gridZone` and `listZone`) and `RosterLaneList` (owns the virtualized
+lane list); both are exported for consumers that replace the body.

package/llms.txt

@@ -144,12 +144,12 @@ show the incompleteLabel; do not describe incomplete empty time as definitive.
 
 | Import | Runtime exports and purpose |
 | --- | --- |
-| react-native-roster | Roster, Schedule, useRoster, useSchedule, default zone fillers, and core re-exports. |
+| react-native-roster | Roster, Schedule, hooks, default slot components, RosterSelectionPopover, PortalHost, Portal, and core re-exports. |
 | react-native-roster/core | layoutLane, coverageFor, flagFor, windowFor, prev, next, today, dayColumnsFor, timeAtX, timeAtY, snapToStep, byLabel, byCoverage, and core counters/caches. |
 | react-native-roster/rrule | expandRuleSet, envelopeFor, expandStats, resetExpandStats, clearExpandCache; RuleSet, RosterRule, RosterDate, ExpandOptions, ExpandResult, and ExpandStats types. |
 | react-native-roster/nativewind | Side-effect registration of Roster and Schedule with NativeWind's cssInterop, plus the registered Roster and Schedule and the rosterClassNames/scheduleClassNames mappings. Imports the optional nativewind peer. |
 
-No default exports. Root exports renderer inputs/models/zone types as well as
+No default exports. Root exports renderer inputs/models/slot input types as well as
 core types. Core imports standard JS and Intl only. Only /rrule imports
 rrule-temporal 1.6.0 and @js-temporal/polyfill 0.5.1. Those are installed runtime
 dependencies but cannot enter root/core bundles through library imports.
@@ -160,6 +160,14 @@ from dist/src; declarations use the types condition. Build before Node export
 tests. Root needs a native renderer or web bundler; direct Node use of root is
 not a substitute for a React Native app. Core and /rrule work in Node/Bun.
 
+## 0.1.0 slot prop rename
+
+0.1.0 renamed every input-bearing render-function Zone prop to a Component prop;
+use the current names below instead of the 0.0.x props. Singleton emptyZone and
+cornerZone keep their names and now take nodes. See [docs/migrations.md](./docs/migrations.md).
+Zone props are ReactNode.
+Component props are ComponentType<Input>.
+
 ## Renderer contracts
 
 Roster required props: lanes: Lane[], windowSpec: WindowSpec.
@@ -178,7 +186,7 @@ outside React state.
 
 useRoster returns window, projection, orderedLanes, coverage, laneState,
 geometryFor(lane), scroll, press(lane,x,y), ticks, contentWidth, viewport,
-onLayout, navigate, and status ('empty' or 'ready'). There is no visibleRange
+onLayout, navigate, selection, dismissSelection, and status ('empty' or 'ready'). There is no visibleRange
 field in the shipped public model. Custom layouts must wire onLayout. Custom
 bodies compute geometry only for mounted lanes, preserving virtualization.
 A zero-duration window has contentWidth=0 and renders no Roster body. Positive
@@ -198,44 +206,118 @@ The chassis measures width, reserves a 48 px gutter, and fits all actual day
 columns without horizontal scrolling; the body scrolls vertically. now updates
 every minute and is null outside the selected window.
 
-Zone props are optional render functions. Use exported fillers inside replacements
-to preserve geometry, scrolling, and interaction. Types are exported from root.
+Props ending in Component accept ComponentType<Input>, mounted as React elements.
+Props ending in Zone accept ReactNode; pass null to suppress a singleton default.
+Define component types at module scope; hooks and class components work normally.
+Use exported defaults inside replacements to preserve geometry, scrolling, and
+interaction. Input types, including HeaderCellInput, are exported from root.
+Mount a React context provider above Roster for extra consumer data, and read it with useContext in a module-scope slot component.
+Avoid inline closures or memoized factories returning a new component per render; new interval types remount every interval and defeat the body's content key.
+
+RosterBody composes the exported RosterBodyLayout (gridZone/listZone nodes with
+scroll wiring) and RosterLaneList (LegendList, geometryFor, and LaneRow mounting).
+Keep its viewport gate and measured estimatedListSize in custom compositions.
 
 ## Roster zones
 
-| Zone | Receives | Default filler and behavior |
+| Slot | Component inputs or node | Default and behavior |
 | --- | --- | --- |
-| `emptyZone` | Nothing | `RosterEmpty`: No lanes. |
-| `laneLabelZone` | `lane`, `flag`, `complete`, `viewTimezone`, localized labels | `RosterLaneLabel`: label, differing IANA zone badge, and notices. |
-| `headerCellZone` | `tick` | `RosterHeaderCell`: tick label. |
-| `intervalZone` | `rect`, `layer`, `lane`, `highlighted` | `RosterInterval`: positioned colored rect, with final inset bounds. |
-| `gapZone` | `rect`, `layer`, `lane` | `RosterGap`: no visible content; the row supplies pressable bounds. |
-| `gridZone` | `ticks`, `contentWidth` | `RosterGrid`: one hairline per tick behind every lane. |
-| `cornerZone` | Nothing | `RosterCorner`: nothing; the cell above the labels, laneLabelWidth wide. |
-| `headerZone` | `ticks`, `projection`, `scroll`, `contentWidth`, `headerCellZone` | `RosterHeader`: frozen header following horizontal offset. |
-| `laneLabelColumnZone` | `labels: LaneLabelInput[]`, `projection`, `scroll`, `laneLabelZone` | `RosterLaneLabelColumn`: frozen labels following vertical offset. |
-| `bodyZone` | Ordered `lanes`, `window`, `geometryFor`, `projection`, `scroll`, `press`, `ticks`, `viewport`, `contentWidth`, highlight/hover, incomplete label, and rect zones | `RosterBody`: virtualized lanes. |
+| `emptyZone` | `ReactNode` | `RosterEmpty`: No lanes. |
+| `laneLabelComponent` | `lane`, `flag`, `complete`, `viewTimezone`, localized labels | `RosterLaneLabel`: label, differing IANA zone badge, and notices. |
+| `headerCellComponent` | `HeaderCellInput` (`tick`) | `RosterHeaderCell`: tick label. |
+| `intervalComponent` | `rect`, `layer`, `lane`, `highlighted` | `RosterInterval`: positioned colored rect, with final inset bounds. |
+| `gapComponent` | `rect`, `layer`, `lane` | `RosterGap`: no visible content; the row supplies pressable bounds. |
+| `gridComponent` | `ticks`, `contentWidth` | `RosterGrid`: one hairline per tick behind every lane. |
+| `cornerZone` | `ReactNode` | `RosterCorner`: nothing; the cell above the labels, laneLabelWidth wide. |
+| `headerComponent` | `ticks`, `projection`, `scroll`, `contentWidth`, `headerCellComponent` | `RosterHeader`: frozen header following horizontal offset. |
+| `laneLabelColumnComponent` | `labels: LaneLabelInput[]`, `projection`, `scroll`, `laneLabelComponent` | `RosterLaneLabelColumn`: frozen labels following vertical offset. |
+| `bodyComponent` | Ordered `lanes`, `window`, `geometryFor`, `projection`, `scroll`, `press`, `ticks`, `viewport`, `contentWidth`, highlight/hover, incomplete label, and rect components | `RosterBody`: virtualized lanes. |
+
+## Selection
+
+Roster only; Schedule does not yet support selection and will gain it in a later change.
+intervalDetailComponent?: ComponentType<IntervalDetailInput> enables selection on interval
+press while preserving onIntervalPress. Absent content retains no selection.
+Pressing the selected interval again dismisses it; pressing another interval
+switches selection. Cell and gap presses dismiss selection while still firing
+`onCellPress` and `onGapPress`. These rules live in the hook and apply on native
+and web; web outside press and Escape still dismiss.
+IntervalDetailInput is IntervalInput plus absolute start and end and viewTimezone.
+useRoster owns selection: {rect,layer,lane,start,end}|null and dismissSelection(). It resolves
+current lane/layer/rect references and clears removed lane or absolute rect bounds.
+Resizing and sorting retain valid selection with current geometry; reconciliation
+uses the private reconcileSelection helper to match source identity sets and choose
+nearest bounds with a total difference of at most 1 ms for projection roundoff.
+selectable?: boolean belongs only to the hook input, RosterInput, and defaults to false.
+It is excluded from RosterProps; hook consumers pass
+selectable: true to retain selection. intervalDetailComponent, selectionLayout, and
+portalHost belong to RosterProps because the chassis mounts content and the layout.
+The chassis passes selectable: Boolean(intervalDetailComponent) to useRoster.
+Custom chassis mount their content and layout using the returned model.
+
+selectionLayout?: ComponentType<SelectionLayoutProps> defaults to the root-exported
+RosterSelectionPopover. It is the explicit naming exception to the Component suffix.
+The chassis mounts the strategy once around the body node, then passes that node
+to RosterLayout.bodyZone. SelectionLayoutProps is exported: anchorZone and contentZone
+are ReactNode; targetBounds is {x,y,width,height}|null in body-content coordinates, including
+the lane offset and interval inset; open is
+boolean; onDismiss is () => void; portalHost is string; scroll is Pick<RosterScroll, 'x' | 'y' | 'headerStyle' | 'labelStyle'>.
+Layouts receive no lane, layer, or rect. Render anchorZone once and arrange contentZone
+above or beside it. The interval-detail fixture demonstrates a runtime inspector toggle.
+
+Native selection-layout.tsx uses the root-exported PortalHost and Portal from
+components/primitives/portal.tsx, a module-level Map store with useSyncExternalStore.
+The default layout owns a host named from the roster's useId; portalHost overrides
+that name. Use distinct names for independent rosters and never mount the same host
+twice. Custom layouts may target an ancestor host they own. Caller context does not
+cross a store portal; provide context above the host or inside the portaled node.
+Native hardware back dismisses details. The detail card flips above
+when that fits, or uses the top edge when neither vertical placement fits. It clamps
+left using measured viewport and content widths. Shared x/y values position the
+overlay in viewport coordinates, never React scroll state. Selection identity
+must not enter the body content key or cause mounted rows to render. The stable press
+ref lives in use-roster-press.ts so React Compiler can retain derived body inputs in useRoster.
+
+Native has no intercepting dismissal overlay; body presses reach the hook, and the detail
+card captures its own presses. Web excludes the body wrapper from Radix outside
+dismissal, leaving body presses to the hook while preserving true outside presses and Escape.
+The hook toggles the selected interval closed, switches to another interval, and dismisses
+on cell or gap presses while preserving their callbacks. The body restores horizontal
+and vertical offsets from shared values on remount when selectionLayout changes.
+A mount effect calls the horizontal ScrollView ref's scrollTo without animation;
+native also retains contentOffset. LegendList restores initialScrollOffset through
+its own web mount effect and native initial offset.
+
+selection-layout.web.tsx uses @radix-ui/react-popover, required by the web root entry
+but an optional peer for native/core-only consumers. Source web bundlers (Vite,
+Storybook, or Metro web) require it even with selection disabled because the web
+layout is in the module graph. Install with Bun. The emitted
+browser remap must travel with the shared selection-layout.types.ts contract, just
+like press-point and interval-hover. Its zero-size, pointer-transparent anchor follows
+the shared translation; Radix's portal follows anchor movement and owns outside press,
+Escape, and collisions. The layout returns focus to the previously focused element
+only after Escape.
 
 ## Schedule zones
 
-| Zone | Receives | Default filler and behavior |
+| Slot | Component inputs or node | Default and behavior |
 | --- | --- | --- |
-| `gutterZone` | `hours`, `pxPerHour` | `ScheduleGutter`: 24 frozen hour labels. |
-| `gridZone` | `hours`, `pxPerHour` | `ScheduleGrid`: 24 bordered hour bands behind each day's rects. |
-| `dayHeaderZone` | `day` | `ScheduleDayHeader`: weekday, localDate, and transition badge. |
-| `skippedDateZone` | `localDate` | `ScheduleSkippedDate`: zero-width header marker for a wholly skipped date. |
-| `columnZone` | `day`, `rects`, `gapRects`, `lane`, `highlightSource`, `press`, interval/gap zones | `ScheduleColumn`: final rect bounds in layer order. |
-| `transitionZone` | `day`, `transition`, `y`, `dividerY`, `height`, `width` | `ScheduleTransition`: skipped-time hatch, or repeat divider and again label. |
-| `nowLineZone` | `y`, `column` | `ScheduleNowLine`: line in the current day's column, updated each minute. |
-| `intervalZone`, `gapZone` | Same inputs as Roster | Shared `RosterInterval` and `RosterGap`. |
-| `incompleteZone` | `lane`, `label` | `ScheduleIncomplete`: notice in reserved space above the grid when incomplete. |
+| `gutterComponent` | `hours`, `pxPerHour` | `ScheduleGutter`: 24 frozen hour labels. |
+| `gridComponent` | `hours`, `pxPerHour` | `ScheduleGrid`: 24 bordered hour bands behind each day's rects. |
+| `dayHeaderComponent` | `day` | `ScheduleDayHeader`: weekday, localDate, and transition badge. |
+| `skippedDateComponent` | `localDate` | `ScheduleSkippedDate`: zero-width header marker for a wholly skipped date. |
+| `columnComponent` | `day`, `rects`, `gapRects`, `lane`, `highlightSource`, `press`, interval/gap components | `ScheduleColumn`: final rect bounds in layer order. |
+| `transitionComponent` | `day`, `transition`, `y`, `dividerY`, `height`, `width` | `ScheduleTransition`: skipped-time hatch, or repeat divider and again label. |
+| `nowLineComponent` | `y`, `column` | `ScheduleNowLine`: line in the current day's column, updated each minute. |
+| `intervalComponent`, `gapComponent` | Same inputs as Roster | Shared `RosterInterval` and `RosterGap`. |
+| `incompleteComponent` | `lane`, `label` | `ScheduleIncomplete`: notice in reserved space above the grid when incomplete. |
 
 Position custom interval content at rect.x/y with width/height/z and
 pointerEvents="none". Gap content already sits in a positioned pressable.
 Column x coordinates are local; select the column through rect.column.
-Zone fillers are plain React Native views; under NativeWind they take className
+Slot components are plain React Native views; under NativeWind they take className
 directly. The default RosterLaneLabel owns its row's bottom border, so a custom
-laneLabelZone draws its own separators.
+laneLabelComponent draws its own separators.
 
 ## Navigation and zones
 
@@ -255,7 +337,7 @@ Schedule always uses 24 equal wall-hour bands. Positive deltaMinutes means a
 skipped empty region; negative means two half-height repeat regions. Rects split
 at column edges, source changes, and every scale boundary. For repeat at T with
 magnitude d, boundaries are T-d, T, and T+d. A wholly skipped date produces no
-column; skippedDateZone labels the header gap (Apia 2011-12-30).
+column; skippedDateComponent labels the header gap (Apia 2011-12-30).
 Each column spans the first instant of its date to the first instant of the next.
 Skipped wall spans belong to the date they interrupt. Its transitions include a
 skip at the exclusive end when it empties that date's final wall bands (Nuuk
@@ -457,7 +539,7 @@ W: seed 1318, 200 lanes, week, two layers, 24-lane layout batch, 15-minute ticks
 Bun 1.4.0, 2026-09-08T05:18:00Z, commit
 1c4ac0e8580b1d46c043f946aa7ebc1ee316d0fa. Median of 11 target-cold samples after
 five runtime warmups. Each timing must stay below 16 ms; CI also enforces <=1.5x
-its baseline. Size gates: core <15 kB, root <40 kB minified/uncompressed, peers
+its baseline. Size gates: core <15 kB, root <44 kB minified/uncompressed, peers
 external. Phone fps and cold-layout numbers are not yet captured; the paired
 react-big-scheduler comparison is not yet measured. Do not claim relative speed.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-roster",
-  "version": "0.0.1",
+  "version": "0.2.0",
   "description": "Layered intervals with provenance across lanes and a shared time axis for React Native.",
   "keywords": [
     "react-native",
@@ -31,7 +31,8 @@
   "types": "./dist/src/index.d.ts",
   "browser": {
     "./dist/src/components/primitives/press-point.js": "./dist/src/components/primitives/press-point.web.js",
-    "./dist/src/components/roster/lanes/interval-hover.js": "./dist/src/components/roster/lanes/interval-hover.web.js"
+    "./dist/src/components/roster/lanes/interval-hover.js": "./dist/src/components/roster/lanes/interval-hover.web.js",
+    "./dist/src/components/roster/selection/selection-layout.js": "./dist/src/components/roster/selection/selection-layout.web.js"
   },
   "exports": {
     ".": {
@@ -66,7 +67,8 @@
     "README.md",
     "LICENSE",
     "NOTICE.md",
-    "llms.txt"
+    "llms.txt",
+    "docs/migrations.md"
   ],
   "scripts": {
     "clean": "rm -rf dist",
@@ -100,7 +102,8 @@
     "nativewind": ">=4.1.0",
     "react": ">=18.2.0",
     "react-native": ">=0.74.0",
-    "react-native-reanimated": ">=3.19.0"
+    "react-native-reanimated": ">=3.19.0",
+    "@radix-ui/react-popover": "^1.1.23"
   },
   "peerDependenciesMeta": {
     "expo": {
@@ -111,6 +114,9 @@
     },
     "react-native-reanimated": {
       "optional": true
+    },
+    "@radix-ui/react-popover": {
+      "optional": true
     }
   },
   "dependencies": {
@@ -149,7 +155,8 @@
     "semantic-release": "^25.0.3",
     "semver": "^7.7.0",
     "size-limit": "^13.0.3",
-    "temporal-spec": "1.0.1"
+    "temporal-spec": "1.0.1",
+    "@radix-ui/react-popover": "1.1.23"
   },
   "publishConfig": {
     "access": "public",

package/src/components/layers/README.md

@@ -1,11 +1,15 @@
 # layers
 
 This area is about a layer; its children are intervals and gaps. Both
-projections draw the same fillers, so they live above Roster and Schedule.
+projections draw the same components, so they live above Roster and Schedule.
 
 - Root entry exports: `RosterInterval`, `RosterGap`, `IntervalInput`, `GapInput`
-- `layers.types.ts`: the filler input contract both projections pass
-- `parts/interval.tsx`, `parts/gap.tsx`: the default fillers
+- `layers.types.ts`: the component input contract both projections pass
+- `parts/interval.tsx`, `parts/gap.tsx`: the default components
 - `utils/styles.ts`: content-keyed style objects per layer
 
 Imports core only. Tests: `test/components/layers`.
+
+Both projections accept intervalComponent and gapComponent as ComponentType inputs.
+Their data-owning lane or column mounts the component with the final rect, layer,
+and lane; interval inputs also carry highlighted. No renderer calls a slot function.

package/src/components/primitives/README.md

@@ -1,7 +1,6 @@
 # primitives
 
-Hookless building blocks shared by Roster and Schedule. Nothing here is a
-public export.
+Building blocks shared by the projections, plus the native portal store for Roster selection.
 
 - `press-point.tsx`, `press-point.web.tsx`, `press-point.types.ts`: pointer
   coordinates relative to the pressed surface; the web file is selected by the
@@ -10,3 +9,15 @@ public export.
   default paint when the override carries a NativeWind class entry
 
 Tests: `test/components/primitives`.
+
+- `portal.tsx`: root-exported `PortalHost({name})` and
+  `Portal({hostName,name,children})`; a module-level Map of hosts to portal nodes,
+  subscribed through useSyncExternalStore, registered and removed through lifecycle effects
+
+Mount one host per destination name. The default Roster selection layout owns its
+per-instance host; custom layouts can target an ancestor host they own. Caller
+context does not cross the store; provide it above the host or inside the node.
+Schedule does not yet support selection.
+
+As a primitive, `Portal` takes `children` rather than a named zone; named zones belong
+to the machine and feature tiers.

package/src/components/primitives/portal.tsx

@@ -0,0 +1,48 @@
+import { Fragment, type ReactNode, useEffect, useSyncExternalStore } from 'react';
+
+const hosts = new Map<string, Map<string, ReactNode>>();
+const listeners = new Set<() => void>();
+const empty = new Map<string, ReactNode>();
+
+function subscribe(listener: () => void) {
+  listeners.add(listener);
+  return () => listeners.delete(listener);
+}
+function publish(hostName: string, nodes: Map<string, ReactNode>) {
+  if (nodes.size) hosts.set(hostName, nodes);
+  else hosts.delete(hostName);
+  for (const listener of listeners) listener();
+}
+
+/** Mount once at the destination for a named native portal. */
+export function PortalHost({ name }: { name: string }) {
+  const nodes = useSyncExternalStore(
+    subscribe,
+    () => hosts.get(name) ?? empty,
+    () => empty,
+  );
+  return Array.from(nodes, ([key, node]) => <Fragment key={key}>{node}</Fragment>);
+}
+
+/** Register content at a named native host; caller context does not cross the store. */
+export function Portal({
+  hostName,
+  name,
+  children,
+}: {
+  hostName: string;
+  name: string;
+  children: ReactNode;
+}) {
+  useEffect(() => {
+    const nodes = new Map(hosts.get(hostName));
+    nodes.set(name, children);
+    publish(hostName, nodes);
+    return () => {
+      const nodes = new Map(hosts.get(hostName));
+      nodes.delete(name);
+      publish(hostName, nodes);
+    };
+  }, [hostName, name, children]);
+  return null;
+}