@dreamboard-games/sdk 0.4.0-alpha.3 → 0.4.0-alpha.4

package/REFERENCE.md

@@ -47,7 +47,7 @@ _No JSDoc summary is available yet._
 
 ```ts
 const DREAMBOARD_SDK_PACKAGES: {
-  readonly "@dreamboard-games/sdk": "0.4.0-alpha.3";
+  readonly "@dreamboard-games/sdk": "0.4.0-alpha.4";
 };
 ```
 
@@ -56,7 +56,7 @@ _No JSDoc summary is available yet._
 ### DREAMBOARD_SDK_VERSION
 
 ```ts
-const DREAMBOARD_SDK_VERSION: "0.4.0-alpha.3";
+const DREAMBOARD_SDK_VERSION: "0.4.0-alpha.4";
 ```
 
 _No JSDoc summary is available yet._
@@ -95,7 +95,7 @@ _No JSDoc summary is available yet._
 
 ```ts
 const DREAMBOARD_SDK_PACKAGES: {
-  readonly "@dreamboard-games/sdk": "0.4.0-alpha.3";
+  readonly "@dreamboard-games/sdk": "0.4.0-alpha.4";
 };
 ```
 
@@ -104,7 +104,7 @@ _No JSDoc summary is available yet._
 ### DREAMBOARD_SDK_VERSION
 
 ```ts
-const DREAMBOARD_SDK_VERSION: "0.4.0-alpha.3";
+const DREAMBOARD_SDK_VERSION: "0.4.0-alpha.4";
 ```
 
 _No JSDoc summary is available yet._
@@ -11981,14 +11981,6 @@ function useIsMobile(breakpoint?: number): boolean;
 
 Hook to detect if the user is on a mobile/small screen device
 
-### useMobileHandTrayActive
-
-```ts
-function useMobileHandTrayActive(): boolean;
-```
-
-Whether the mobile hand tray is currently presenting hands — i.e. the viewport is below the mobile breakpoint and at least one primary/auxiliary hand has registered. Authors can use this to drop redundant inline hand chrome (labels, framing) that the tray already provides, instead of guessing the breakpoint with a CSS media query. Returns `false` outside `<UI.Root>`.
-
 ### useOverlayInsets
 
 ```ts
@@ -14910,14 +14902,6 @@ function useChromeSuppression(id: string, suppressed: boolean): void;
 
 _No JSDoc summary is available yet._
 
-### useMobileHandTrayActive
-
-```ts
-function useMobileHandTrayActive(): boolean;
-```
-
-Whether the mobile hand tray is currently presenting hands — i.e. the viewport is below the mobile breakpoint and at least one primary/auxiliary hand has registered. Authors can use this to drop redundant inline hand chrome (labels, framing) that the tray already provides, instead of guessing the breakpoint with a CSS media query. Returns `false` outside `<UI.Root>`.
-
 ### useOverlayInsets
 
 ```ts
@@ -16797,8 +16781,8 @@ function HandSurfaceView<Card extends ZoneCardRenderItem>({
   ariaLabel,
   onIntentRouted,
   onSelectionSummary,
-  renderSummary,
-  renderActions,
+  summarySlot,
+  actionsSlot,
   className,
 }: HandSurfaceViewProps<Card>): react_jsx_runtime.JSX.Element;
 ```

package/dist/HandView-x8MhbhFl.d.ts

@@ -0,0 +1,79 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode, CSSProperties } from 'react';
+import { ViewCard } from './types.js';
+import { J as InteractionVisualState, f as CardIntent } from './hex-board-view-BFlWDb9k.js';
+
+/**
+ * Pure layout math for the controlled `HandView`.
+ *
+ * The functions here are independent of React and DOM measurement so they can
+ * be unit-tested directly. {@link computeFanLayout} matches the algorithm
+ * documented in `docs/references/ui-sdk-mobile-hand-and-card-interactions.md`,
+ * and {@link chooseHandLayoutMode} translates a measured container width and a
+ * caller policy into the actual presentation mode the hand should render.
+ */
+type HandPresentationMode = "fan" | "compressed-fan" | "strip" | "tray";
+
+/**
+ * Deterministic pointer recognizer for the controlled hand view.
+ *
+ * The engine is independent from React: it consumes pointer events and a
+ * caller-supplied callbacks bag, and produces semantic gesture events. It
+ * owns no DOM, emits no `CardIntent`, and does not track the drag-lifecycle
+ * `phase` — that responsibility lives in `CardDragSurface`. The engine only
+ * recognizes `tap`, `previewStart`/`previewEnd`, `liftStart`/`liftMove`/
+ * `liftEnd`/`liftCancel`, and a `horizontalBrowse` informational signal.
+ *
+ * The thresholds match
+ * `docs/references/ui-sdk-mobile-hand-and-card-interactions.md`:
+ *
+ * | Threshold                 | Default     |
+ * | ------------------------- | ----------- |
+ * | Press preview delay       | `220ms`     |
+ * | Movement slop             | `8px`       |
+ * | Axis bias                 | `1.25`      |
+ * | Drag lift distance        | `28px`      |
+ *
+ * Callers wire the engine's `handlePointerDown` / `handlePointerMove` /
+ * `handlePointerUp` / `handlePointerCancel` to the matching DOM events on
+ * each interactive card.
+ */
+type HandInteractionPolicy = "direct-activate" | "drag-to-target";
+
+type HandLayoutKind = HandPresentationMode | "stack";
+interface HandLayoutPolicy {
+    desktop?: HandLayoutKind;
+    mobile?: HandLayoutKind;
+}
+interface HandViewProps<CardData extends ViewCard = ViewCard> {
+    cards: readonly CardData[];
+    /**
+     * Layout policy. Pass a single layout kind to use the same layout in every
+     * viewport, or pass `{ desktop, mobile }` for a measured-width decision.
+     * Defaults to `{ desktop: "fan", mobile: "tray" }`.
+     */
+    layout?: HandLayoutKind | HandLayoutPolicy;
+    /**
+     * Mobile interaction policy. Defaults to `direct-activate`. Use
+     * `drag-to-target` together with a surrounding `CardDragSurface` and one
+     * or more `CardDropTargetView` children.
+     */
+    mobileInteraction?: HandInteractionPolicy;
+    /** Returns the controlled visual state for a card. */
+    stateForCard?: (card: CardData, index: number) => InteractionVisualState | undefined;
+    /** Visual surface renderer. */
+    renderCard: (card: CardData, state: InteractionVisualState, index: number) => ReactNode;
+    /** Generic UI intent callback. */
+    onCardIntent?: (intent: CardIntent<CardData["id"] & string>) => void;
+    /** Card width hint for fan geometry. */
+    cardSize?: "sm" | "md" | "lg";
+    /** Slot for the empty state. Defaults to nothing rendered. */
+    renderEmpty?: () => ReactNode;
+    /** ARIA label for the hand region. */
+    "aria-label"?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+declare function HandView<CardData extends ViewCard = ViewCard>({ cards, layout, mobileInteraction, stateForCard, renderCard, onCardIntent, cardSize, renderEmpty, "aria-label": ariaLabel, className, style, }: HandViewProps<CardData>): react_jsx_runtime.JSX.Element;
+
+export { type HandInteractionPolicy as H, type HandLayoutKind as a, type HandLayoutPolicy as b, HandView as c, type HandViewProps as d };

package/dist/{ResourceCounter-BuiNstXs.d.ts → ResourceCounter-BFxJknqp.d.ts}

@@ -20,14 +20,6 @@ declare function MobileHandTrayProvider({ children }: {
     children: ReactNode;
 }): react_jsx_runtime.JSX.Element;
 declare function useRegisterMobileHand(hand: MobileHandRegistration): void;
-/**
- * Whether the mobile hand tray is currently presenting hands — i.e. the
- * viewport is below the mobile breakpoint and at least one primary/auxiliary
- * hand has registered. Authors can use this to drop redundant inline hand
- * chrome (labels, framing) that the tray already provides, instead of guessing
- * the breakpoint with a CSS media query. Returns `false` outside `<UI.Root>`.
- */
-declare function useMobileHandTrayActive(): boolean;
 declare function useOverlayInsets(): {
     bottom: number;
 };
@@ -103,4 +95,4 @@ declare const ResourceCounter: {
     Label: typeof ResourceCounterLabel;
 };
 
-export { type BoundResourceCounterRootProps as B, type HandRole as H, type MobileHandRegistration as M, ResourceCounter as R, MobileHandTrayProvider as a, type ResourceCounterComponents as b, ResourceCounterCount as c, ResourceCounterIcon as d, ResourceCounterItem as e, type ResourceCounterItemState as f, ResourceCounterLabel as g, type ResourceCounterPartProps as h, type ResourceCounterProps as i, ResourceCounterRoot as j, type ResourceCounterRootProps as k, type ResourceDisplayConfig as l, type ResourceIconProps as m, createResourceCounter as n, useOverlayInsets as o, useRegisterBottomOverlayInset as p, useRegisterMobileHand as q, useMobileHandTrayActive as u };
+export { type BoundResourceCounterRootProps as B, type HandRole as H, type MobileHandRegistration as M, ResourceCounter as R, MobileHandTrayProvider as a, type ResourceCounterComponents as b, ResourceCounterCount as c, ResourceCounterIcon as d, ResourceCounterItem as e, type ResourceCounterItemState as f, ResourceCounterLabel as g, type ResourceCounterPartProps as h, type ResourceCounterProps as i, ResourceCounterRoot as j, type ResourceCounterRootProps as k, type ResourceDisplayConfig as l, type ResourceIconProps as m, createResourceCounter as n, useRegisterBottomOverlayInset as o, useRegisterMobileHand as p, useOverlayInsets as u };

package/dist/{ThemeProvider-B1sIoBlX.d.ts → ThemeProvider-DRalAWzY.d.ts}

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { CSSProperties, ReactNode } from 'react';
-import { $ as Theme, a1 as ThemeOverride } from './hex-board-view-Kz9Q_zsv.js';
+import { a3 as Theme, a5 as ThemeOverride } from './hex-board-view-BFlWDb9k.js';
 
 /**
  * The set of preset theme ids ships in `@dreamboard-games/sdk/ui`. Authors

package/dist/authoring/index.js

@@ -1,6 +1,6 @@
 import {
   GENERATED_AUTHORING_METADATA
-} from "../chunk-DQ7GCD6C.js";
+} from "../chunk-SUMZ5OEH.js";
 import {
   AUTHORITATIVE_GENERATED_FILES,
   SEED_FILES,

package/dist/{chunk-45FI6XII.js → chunk-E3X552YM.js}

@@ -4716,9 +4716,6 @@ var MobileHandTrayContext = createContext4(
 var OverlayInsetContext = createContext4(
   null
 );
-var MobileHandTrayStateContext = createContext4({
-  active: false
-});
 var ROLE_PRIORITY = {
   task: 0,
   primary: 1,
@@ -4797,8 +4794,7 @@ function MobileHandTrayProvider({ children }) {
     [handsById]
   );
   const trayActive = isMobile && hands.length > 0;
-  const stateValue = useMemo9(() => ({ active: trayActive }), [trayActive]);
-  return /* @__PURE__ */ jsx14(MobileHandTrayContext.Provider, { value, children: /* @__PURE__ */ jsx14(OverlayInsetContext.Provider, { value: overlayValue, children: /* @__PURE__ */ jsxs6(MobileHandTrayStateContext.Provider, { value: stateValue, children: [
+  return /* @__PURE__ */ jsx14(MobileHandTrayContext.Provider, { value, children: /* @__PURE__ */ jsxs6(OverlayInsetContext.Provider, { value: overlayValue, children: [
     /* @__PURE__ */ jsx14(
       "div",
       {
@@ -4810,7 +4806,7 @@ function MobileHandTrayProvider({ children }) {
       }
     ),
     trayActive ? /* @__PURE__ */ jsx14(MobileHandTray, { hands }) : null
-  ] }) }) });
+  ] }) });
 }
 function useRegisterMobileHand(hand) {
   const context = useContext4(MobileHandTrayContext);
@@ -4821,9 +4817,6 @@ function useRegisterMobileHand(hand) {
   }
   useEffect10(() => context.registerHand(hand), [context, hand]);
 }
-function useMobileHandTrayActive() {
-  return useContext4(MobileHandTrayStateContext).active;
-}
 function useOverlayInsets() {
   const context = useContext4(OverlayInsetContext);
   return { bottom: context?.bottomInset ?? 0 };
@@ -11234,7 +11227,6 @@ export {
   HandView,
   MobileHandTrayProvider,
   useRegisterMobileHand,
-  useMobileHandTrayActive,
   useOverlayInsets,
   useRegisterBottomOverlayInset,
   PlayArea,
@@ -11313,4 +11305,4 @@ export {
   HexGrid,
   createHexBoardView
 };
-//# sourceMappingURL=chunk-45FI6XII.js.map
+//# sourceMappingURL=chunk-E3X552YM.js.map