@dreamboard-games/sdk 0.2.0

package/dist/chunk-GKKBPPSW.js

@@ -0,0 +1,598 @@
+import {
+  createDreamboardUI
+} from "./chunk-U5C6BONG.js";
+import {
+  ClientParamSchemaProvider,
+  HandStagingView,
+  HandSurfaceView,
+  dropTargetIdFor,
+  isInteractionAvailable,
+  usePluginState,
+  useResolvedCardTargetValue,
+  useZoneCards
+} from "./chunk-TDSWKVZ4.js";
+import {
+  CardFace,
+  MobileHandTrayProvider,
+  ToastProvider,
+  createResourceCounter,
+  useIsMobile,
+  useRegisterMobileHand
+} from "./chunk-WYPQ3GG5.js";
+
+// src/runtime-internal/workspace-contract.ts
+import { Fragment as ReactFragment, createElement, useMemo } from "react";
+import { clsx } from "clsx";
+var DEFAULT_ZONE_CARD_CLASS = "group relative border-0 bg-transparent p-0 transition-transform enabled:cursor-pointer enabled:hover:-translate-y-2 data-[selected=true]:-translate-y-3 disabled:cursor-not-allowed data-[eligible=false]:opacity-45 data-[eligible=false]:grayscale data-[eligible=false]:hover:translate-y-0 data-[card-available=false]:opacity-45 data-[card-available=false]:grayscale";
+function cardRenderItemToViewCard(card, cardId) {
+  if (card && typeof card === "object" && "hidden" in card && card.hidden === false) {
+    return card;
+  }
+  return {
+    id: cardId,
+    cardType: "hidden",
+    name: "Hidden card",
+    properties: {}
+  };
+}
+function CardSlotValue({
+  children
+}) {
+  const value = useResolvedCardTargetValue();
+  return createElement(ReactFragment, null, children(value));
+}
+function createWorkspaceUIContract(options) {
+  const baseUI = createDreamboardUI(options.uiContract);
+  const runtimeInteraction = baseUI.Interaction;
+  const runtimeBoard = baseUI.Board;
+  const runtimeZone = baseUI.Zone;
+  const resourceDisplayConfig = options.resourceIds.map((resource) => {
+    const presentation = options.resourcePresentationById?.[resource];
+    return {
+      type: resource,
+      label: presentation?.label ?? resource,
+      icon: presentation?.icon ?? resource
+    };
+  });
+  const resourceCounter = createResourceCounter(
+    resourceDisplayConfig
+  );
+  function InteractionRoutes({
+    routes,
+    fallback,
+    includeUnavailable
+  }) {
+    return createElement(runtimeInteraction.Routes, {
+      routes,
+      fallback,
+      includeUnavailable
+    });
+  }
+  const withInteractionRoot = (interaction, children) => createElement(runtimeInteraction.Root, {
+    interaction,
+    children
+  });
+  function createFormInputSlot(input, interaction) {
+    return {
+      Field: (props) => {
+        const field = createElement(baseUI.Interaction.Field, {
+          ...props,
+          input
+        });
+        return interaction ? withInteractionRoot(interaction, field) : field;
+      },
+      Options: () => null,
+      Value: ({
+        children
+      }) => createElement(ReactFragment, null, children(void 0)),
+      Default: ({ children }) => createElement(ReactFragment, null, children)
+    };
+  }
+  function createCardInputSlot() {
+    return {
+      Card: ({ value, ...props }) => createElement(runtimeInteraction.CardInput, {
+        ...props,
+        input: "cardId",
+        unsafeCardId: value
+      }),
+      Cards: () => null,
+      Value: ({
+        children
+      }) => createElement(CardSlotValue, { children }),
+      Default: ({ children }) => createElement(ReactFragment, null, children)
+    };
+  }
+  function createBoardTargetInputSlot(kind) {
+    const Target = ({
+      value,
+      ...props
+    }) => {
+      if (kind === "edge") {
+        return createElement(runtimeBoard.EdgeTarget, { ...props, value });
+      }
+      if (kind === "vertex") {
+        return createElement(runtimeBoard.VertexTarget, { ...props, value });
+      }
+      return createElement(runtimeBoard.SpaceTarget, { ...props, value });
+    };
+    return {
+      Target,
+      Value: ({
+        children
+      }) => createElement(ReactFragment, null, children(void 0)),
+      Default: ({ children }) => createElement(ReactFragment, null, children)
+    };
+  }
+  function useInteractionFormSurface(interaction) {
+    const validInputs = options.formInputKeysForInteraction(interaction);
+    const slot = Object.fromEntries(
+      [...validInputs].map((input) => [
+        input,
+        createFormInputSlot(input, interaction)
+      ])
+    );
+    return {
+      Root: ({ children }) => withInteractionRoot(interaction, children),
+      Form: (props) => withInteractionRoot(
+        interaction,
+        createElement(baseUI.Interaction.Form, props)
+      ),
+      Dialog: (props) => withInteractionRoot(
+        interaction,
+        createElement(baseUI.Interaction.Dialog, props)
+      ),
+      State: (props) => withInteractionRoot(
+        interaction,
+        createElement(baseUI.Interaction.State, props)
+      ),
+      Arm: (props) => withInteractionRoot(
+        interaction,
+        createElement(baseUI.Interaction.Trigger, props)
+      ),
+      Submit: (props) => withInteractionRoot(
+        interaction,
+        createElement(baseUI.Interaction.Submit, props)
+      ),
+      Field: ({ input, ...props }) => withInteractionRoot(
+        interaction,
+        createElement(baseUI.Interaction.Field, {
+          ...props,
+          input
+        })
+      ),
+      slot
+    };
+  }
+  function useBoardSurface(_name) {
+    return {
+      Root: ({ children }) => createElement(baseUI.Board.Root, { children }),
+      Space: (props) => createElement(runtimeBoard.SpaceTarget, props),
+      slot: {
+        space: createBoardTargetInputSlot("space"),
+        playerSpace: createBoardTargetInputSlot("space"),
+        edge: createBoardTargetInputSlot("edge"),
+        vertex: createBoardTargetInputSlot("vertex"),
+        tile: createBoardTargetInputSlot("tile")
+      }
+    };
+  }
+  function createZoneCardsComponent(zones) {
+    return ({
+      empty,
+      children,
+      ...props
+    }) => createElement(
+      ReactFragment,
+      null,
+      ...zones.map(
+        (zone) => createElement(baseUI.Zone.Root, {
+          key: zone,
+          zone,
+          children: createElement(runtimeZone.List, {
+            ...props,
+            empty,
+            children
+          })
+        })
+      )
+    );
+  }
+  function createHandCardsComponent(options2) {
+    return ({
+      empty,
+      children,
+      className,
+      layout,
+      mobileInteraction,
+      cardSize,
+      ariaLabel,
+      dropTargets,
+      renderDropTargets,
+      onCardIntent,
+      renderSummary,
+      renderActions,
+      onSelectionSummary,
+      ...props
+    }) => createElement(baseUI.Zone.Root, {
+      zone: options2.zone,
+      // Fill the author's container instead of shrink-wrapping to the fan's
+      // own measured width. Without a definite width here, a centering parent
+      // sizes to the cards row, the hand measures that, recomputes a new fan
+      // width, and the layout chases itself (a ResizeObserver loop). `w-full`
+      // pins the outermost hand element to the available width and breaks the
+      // cycle for every author layout.
+      className: "w-full min-w-0",
+      children: createElement(GeneratedHandCards, {
+        ...props,
+        hand: options2,
+        className,
+        empty,
+        children,
+        layout,
+        mobileInteraction,
+        cardSize,
+        ariaLabel,
+        dropTargets,
+        renderDropTargets,
+        onCardIntent,
+        renderSummary,
+        renderActions,
+        onSelectionSummary
+      })
+    });
+  }
+  function GeneratedHandCards({
+    hand,
+    empty,
+    children,
+    className,
+    sort,
+    layout,
+    mobileInteraction,
+    cardSize,
+    ariaLabel,
+    dropTargets,
+    renderDropTargets,
+    onCardIntent,
+    renderSummary,
+    renderActions,
+    onSelectionSummary
+  }) {
+    const isMobile = useIsMobile();
+    const { items, count } = useZoneCards({ sort });
+    const handClassName = clsx("min-h-[112px]", className);
+    const resolvedDropTargets = useMemo(() => {
+      if (!dropTargets || dropTargets.length === 0) return void 0;
+      return dropTargets.map((dt) => {
+        const value = dt.target.kind === "card" ? dt.target.card : dt.target.target;
+        return {
+          targetId: dropTargetIdFor(dt.target.kind, value),
+          label: dt.label,
+          render: dt.render,
+          className: dt.className,
+          role: dt.role,
+          order: dt.order
+        };
+      });
+    }, [dropTargets]);
+    const content = useMemo(
+      () => createElement(HandSurfaceView, {
+        zone: hand.zone,
+        cards: items,
+        renderCard: (card, state, _index) => children(card, state),
+        layout,
+        mobileInteraction,
+        dropTargets: resolvedDropTargets,
+        renderDropTargets,
+        cardSize,
+        renderEmpty: empty !== void 0 ? () => empty : void 0,
+        ariaLabel,
+        onIntentRouted: onCardIntent ? (intent) => onCardIntent(intent) : void 0,
+        renderSummary,
+        renderActions,
+        onSelectionSummary,
+        className: handClassName
+      }),
+      [
+        ariaLabel,
+        cardSize,
+        children,
+        empty,
+        hand.zone,
+        handClassName,
+        items,
+        layout,
+        mobileInteraction,
+        onCardIntent,
+        onSelectionSummary,
+        renderActions,
+        renderDropTargets,
+        renderSummary,
+        resolvedDropTargets
+      ]
+    );
+    const active = items.some(
+      (item) => !item.hidden && item.interactions.some(
+        (descriptor) => isInteractionAvailable(descriptor)
+      )
+    );
+    const autoOpen = items.some(
+      (item) => !item.hidden && item.interactions.some(
+        (descriptor) => isInteractionAvailable(descriptor) && descriptor.inputs.some(
+          (input) => input.domain.type === "cardTarget" && input.domain.selection?.mode === "many"
+        )
+      )
+    );
+    const version = items.map(
+      (item) => item.hidden ? `${item.id}:hidden` : `${item.id}:${item.cardType}:${JSON.stringify(item.properties)}`
+    ).join("|");
+    const registration = useMemo(
+      () => ({
+        id: `${hand.name}:${hand.zone}`,
+        zone: hand.zone,
+        label: hand.label,
+        role: hand.role,
+        order: hand.order,
+        version,
+        count,
+        active,
+        autoOpen,
+        content: createElement(baseUI.Zone.Root, {
+          zone: hand.zone,
+          children: content
+        })
+      }),
+      [
+        active,
+        autoOpen,
+        content,
+        count,
+        hand.label,
+        hand.name,
+        hand.order,
+        hand.role,
+        hand.zone,
+        version
+      ]
+    );
+    useRegisterMobileHand(registration);
+    return isMobile ? null : content;
+  }
+  function createZoneCardComponent() {
+    return ({
+      card,
+      children,
+      className,
+      ...props
+    }) => {
+      const cardId = options.cardIdFromZoneCard(card);
+      const zone = options.zoneIdFromZoneCard(card);
+      const viewCard = cardRenderItemToViewCard(card, cardId);
+      const faceDown = !!card && typeof card === "object" && "hidden" in card && card.hidden === true;
+      const renderCardFace = (state) => createElement(CardFace, {
+        card: viewCard,
+        selected: state.selected,
+        disabled: state.disabled || !state.eligible,
+        faceDown,
+        size: "sm",
+        children
+      });
+      const match = usePluginState((state) => {
+        const candidates = state.gameplay.zones[zone]?.playableByCardId[cardId] ?? [];
+        for (const descriptor of candidates) {
+          const input = descriptor.inputs.find(
+            (candidateInput) => candidateInput.domain.type === "cardTarget" && candidateInput.domain.projection === "resolved" && candidateInput.domain.eligibleTargets.includes(cardId)
+          );
+          if (input) return { descriptor, input };
+        }
+        return null;
+      });
+      if (!match) {
+        return createElement(
+          "div",
+          {
+            ...props,
+            className: clsx("relative inline-flex", className),
+            "data-dreamboard-zone-card": "",
+            "data-card-id": cardId,
+            "data-zone": zone,
+            "data-interactive": false
+          },
+          createElement(CardFace, {
+            card: viewCard,
+            faceDown,
+            size: "sm",
+            children
+          })
+        );
+      }
+      return createElement(baseUI.Zone.Root, {
+        zone,
+        children: createElement(runtimeInteraction.Root, {
+          interaction: match.descriptor.interactionKey,
+          children: createElement(runtimeInteraction.CardInput, {
+            ...props,
+            className: clsx(DEFAULT_ZONE_CARD_CLASS, className),
+            input: match.input.key,
+            unsafeCardId: cardId,
+            children: renderCardFace
+          })
+        })
+      });
+    };
+  }
+  const Board = {
+    surface(board) {
+      return { kind: "board", board };
+    },
+    useSurface: useBoardSurface,
+    HexView({ board: boardId, ...props }) {
+      return createElement(
+        baseUI.Board.HexView,
+        {
+          ...props,
+          board: options.hexStaticBoards[boardId]
+        }
+      );
+    },
+    HexGrid({ board: boardId, ...props }) {
+      return createElement(
+        baseUI.Board.HexGrid,
+        {
+          ...props,
+          board: options.hexStaticBoards[boardId]
+        }
+      );
+    }
+  };
+  function createStagingComponent(options2) {
+    return ({
+      children,
+      label,
+      renderEmptySlot,
+      cardSize,
+      ariaLabel,
+      className
+    }) => createElement(HandStagingView, {
+      zone: options2.zone,
+      renderCard: (card) => children(card),
+      renderEmptySlot,
+      label,
+      cardSize,
+      ariaLabel,
+      className
+    });
+  }
+  const Zone = {
+    hand(zone, options2) {
+      return { kind: "hand", zone, ...options2 };
+    },
+    pile(zone) {
+      return { kind: "pile", zone };
+    },
+    piles(zones) {
+      return { kind: "piles", zones };
+    },
+    collection(zones, options2 = {}) {
+      return { kind: "cardCollection", zones, mode: options2.mode };
+    },
+    useHand(_name, zoneOptions) {
+      const handComponentOptions = {
+        name: _name,
+        zone: zoneOptions.zone,
+        role: zoneOptions.role,
+        label: zoneOptions.label,
+        order: zoneOptions.order
+      };
+      return {
+        Hand: createHandCardsComponent(handComponentOptions),
+        Card: createZoneCardComponent(),
+        Staging: createStagingComponent(handComponentOptions),
+        slot: { card: createCardInputSlot() }
+      };
+    },
+    usePile(_name, zoneOptions) {
+      return {
+        Pile: createZoneCardsComponent([zoneOptions.zone]),
+        Card: createZoneCardComponent()
+      };
+    },
+    useCardCollection(_name, zoneOptions) {
+      void zoneOptions.mode;
+      return {
+        Collection: createZoneCardsComponent(zoneOptions.zones),
+        Card: createZoneCardComponent(),
+        slot: { card: createCardInputSlot() }
+      };
+    }
+  };
+  const Interaction = {
+    State: baseUI.Interaction.State,
+    Dialog: baseUI.Interaction.Dialog,
+    useForm: useInteractionFormSurface,
+    form(interaction) {
+      return { kind: "form", interaction };
+    },
+    forms(interactions) {
+      return { kind: "forms", interactions };
+    },
+    Routes: InteractionRoutes
+  };
+  function isPlainObject(value) {
+    return !!value && typeof value === "object" && !Array.isArray(value);
+  }
+  function isSurfaceDescriptor(value) {
+    return isPlainObject(value) && typeof value.kind === "string";
+  }
+  function resolveSurfaceDescriptor(name, descriptor) {
+    switch (descriptor.kind) {
+      case "board":
+        return Board.useSurface(name);
+      case "hand":
+        return Zone.useHand(name, {
+          zone: descriptor.zone,
+          role: descriptor.role,
+          label: descriptor.label,
+          order: descriptor.order
+        });
+      case "pile":
+        return Zone.usePile(name, { zone: descriptor.zone });
+      case "piles":
+        return Object.fromEntries(
+          descriptor.zones.map((zone) => [
+            zone,
+            Zone.usePile(String(zone), { zone })
+          ])
+        );
+      case "cardCollection":
+        return Zone.useCardCollection(name, {
+          zones: descriptor.zones,
+          mode: descriptor.mode
+        });
+      case "form":
+        return useInteractionFormSurface(descriptor.interaction);
+      case "forms":
+        return Object.fromEntries(
+          Object.entries(descriptor.interactions).map(([key, interaction]) => [
+            key,
+            useInteractionFormSurface(interaction)
+          ])
+        );
+    }
+  }
+  function resolveSurfaceSpec(spec) {
+    return Object.fromEntries(
+      Object.entries(spec).map(([key, value]) => [
+        key,
+        isSurfaceDescriptor(value) ? resolveSurfaceDescriptor(key, value) : resolveSurfaceSpec(value)
+      ])
+    );
+  }
+  function defineSurfaces(spec) {
+    return function useDefinedSurfaces() {
+      return resolveSurfaceSpec(spec);
+    };
+  }
+  const UI = {
+    ...baseUI,
+    Root: ({ children, ...props }) => createElement(ClientParamSchemaProvider, {
+      schemas: options.clientParamSchemasByPhase,
+      children: createElement(ToastProvider, {
+        children: createElement(MobileHandTrayProvider, {
+          children: createElement(baseUI.Root, { ...props, children })
+        })
+      })
+    }),
+    defineSurfaces,
+    Interaction,
+    Board,
+    Zone,
+    ResourceCounter: resourceCounter
+  };
+  return UI;
+}
+
+export {
+  createWorkspaceUIContract
+};
+//# sourceMappingURL=chunk-GKKBPPSW.js.map