@tastic/shell 0.4.0 → 0.6.0

package/src/screens/LoadoutScreen.tsx

@@ -1,12 +1,12 @@
 import { defaultColors, getRgb, useAutoPaperTheme } from '@rific/auto-paper'
-import { FakeLandscapeView, getViewRotation, rotateInsets, useOrientationState } from '@tastic/core'
+import { useOrientationState } from '@tastic/core'
 import { CornerActionButtons, PressAwayOverlay, usePopoverHost } from '@tastic/hud/chrome'
 import { PlayerSetupPanel, ReadyButton, SharedActionBand } from '@tastic/hud/lobby'
 import type { Profile } from '@tastic/profile'
 import { DualZoneLayout, needsSharedNeutralZone, useDualZoneLayout } from '@tastic/split-screen'
 import { router, useFocusEffect } from 'expo-router'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
-import { Platform, type StyleProp, StyleSheet, View, type ViewStyle } from 'react-native'
+import { type StyleProp, StyleSheet, View, type ViewStyle } from 'react-native'
 import Animated from 'react-native-reanimated'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { useDispatch } from 'react-redux'
@@ -24,11 +24,11 @@ import { liveplayActions } from '../redux/liveplaySlice'
 import { playHref, PROFILES_HREF } from '../routes'
 import { humanSeatsFor, type PackGameDefinition, roundModeFor, type Seat, type SeatTwo, seatTwoFor } from '../types'
 
-// The player-panel area: whenever a real device rotation changes orientationMode or which physical
-// side P1 lands on, the panels fade out, the layout underneath swaps while invisible, then they fade
-// back in - masking what would otherwise be an instant jump-cut as panels reflow or swap sides.
-// Short and symmetric on purpose: this is masking a reflow that already happened at the OS's own
-// pace, not a deliberate reveal.
+// The player-panel area: whenever the window changes shape (a tablet turning, a browser window
+// resized) and the panels go from face to face to side by side or back, they fade out, the layout
+// underneath swaps while invisible, then they fade back in - masking what would otherwise be an
+// instant jump-cut as panels reflow. Short and symmetric on purpose: this is masking a reflow that
+// already happened at the OS's own pace, not a deliberate reveal.
 const PANEL_SWAP_FADE_MS = 180
 
 // A game that has a loadout (GameDefinition.useLoadout): the loadout route sends any other straight
@@ -53,32 +53,24 @@ export function LoadoutScreen({ game }: { game: LoadoutGame }) {
   const { openFor } = useGameGuide()
 
   const { profiles, lastSelected, selectProfile } = useProfiles()
-  // orientationMode just follows the device's current physical tilt (see @tastic/core's
-  // useOrientationState), CPU games included - how you're holding the phone right now decides the
-  // panel arrangement, not a stored per-round choice. Lock Orientation pins it app-wide by freezing
-  // the shared reading itself (RootLayout's OrientationBridge), so this read takes no `locked`
-  // argument. The OS is portrait-locked; FakeLandscapeView below fakes the rest in JS.
-  const { orientationMode, p1OnRight, upsideDown, resolved: p1OnRightResolved } = useOrientationState()
+  // The window's shape (@tastic/core's useOrientationState): side by side in a window wider than tall,
+  // face to face otherwise. The OS turns the interface; a portrait-locked phone is always face to face.
+  const { orientationMode } = useOrientationState()
 
-  // The panel area's own layout lags one fade behind the live orientation above - see
-  // useDualZoneLayout's own comment. 2 Player seats its players the way the game's own board does
-  // (GameDefinition.twoPlayerSeats): face to face however the phone is held, P1 in the bottom half
-  // and P2 in the top, flipped for an upside-down hold where the game flips too, so each player gets
-  // the same half here and in the match. On the web a game may seat them side by side instead.
-  const fixedSeats = p2IsHuman && (!!game.twoPlayerSeats?.faceToFaceOnWeb || Platform.OS !== 'web')
-  const fixedUpsideDown = !!game.twoPlayerSeats?.followUpsideDown && orientationMode === 'faceToFace' && upsideDown
-  const { panelLayout, panelFadeStyle } = useDualZoneLayout(fixedSeats ? 'faceToFace' : orientationMode, fixedSeats ? true : p1OnRight, fixedSeats || p1OnRightResolved, fixedSeats ? fixedUpsideDown : upsideDown, PANEL_SWAP_FADE_MS)
+  // The panel area's own layout lags one fade behind the window above - see useDualZoneLayout's own
+  // comment. 2 Player seats its players the way the game's own board does: face to face (P1 in the
+  // bottom half, P2 in the top) in any window, unless the game seats them side by side in a wide one
+  // (GameDefinition.sideBySideWhenWide), P1 on the left, so each player gets the same half here and
+  // in the match. With one person the panels follow the window.
+  const panelMode = p2IsHuman && !game.sideBySideWhenWide ? 'faceToFace' : orientationMode
+  const { panelLayout, panelFadeStyle } = useDualZoneLayout(panelMode, false, true, false, PANEL_SWAP_FADE_MS)
   // split-screen types the fade as a style for any component (useAnimatedStyle's DefaultStyle). An app
   // whose types widen Text's style (Expo's react-native-web types, which a generated expo-env.d.ts pulls
   // in, make its cursor any string) can't hand that to Animated.View. It only ever sets opacity.
   const playersRowFade = panelFadeStyle as unknown as StyleProp<ViewStyle>
 
   const [settingsOpen, setSettingsOpen] = useState(false)
-  // Safe-area insets are relative to the device's fixed portrait frame; rotateInsets remaps them
-  // onto whichever edge they land on once FakeLandscapeView turns the content, so `top`/`left`/
-  // `right` below always mean the screen's real, visual edges.
-  const rotation = getViewRotation(panelLayout.orientationMode, panelLayout.p1OnRight, panelLayout.upsideDown)
-  const insets = rotateInsets(useSafeAreaInsets(), rotation)
+  const insets = useSafeAreaInsets()
   const { colors: themeColors, dark } = useAutoPaperTheme()
   const { p1Color, p2Color, handleP1ColorChange, handleP2ColorChange } = useSeatColors(p2IsHuman)
   const dispatch = useDispatch<Dispatch<Action>>()
@@ -142,9 +134,9 @@ export function LoadoutScreen({ game }: { game: LoadoutGame }) {
   const showMetaInSharedBand = needsSharedNeutralZone(panelLayout.orientationMode, humanSeats.length)
 
   // Where P2's own press-away zone lives on screen - matches panelLayout (what's actually painted
-  // right now, mid-fade included). Portrait puts P2's panel in the top half; landscape on whichever
-  // side isn't P1's. Only in 2 Player - otherwise seat 2 shares seat 1's host (see p2Host below).
-  const p2ZoneStyle = p2IsHuman ? (isPortrait ? styles.p2ZoneTop : panelLayout.p1OnRight ? styles.p2ZoneLeft : styles.p2ZoneRight) : null
+  // right now, mid-fade included). Portrait puts P2's panel in the top half; landscape on the right
+  // (P1 sits on the left). Only in 2 Player - otherwise seat 2 shares seat 1's host (see p2Host below).
+  const p2ZoneStyle = p2IsHuman ? (isPortrait ? styles.p2ZoneTop : styles.p2ZoneRight) : null
 
   // With one human, the one Ready button sits under both panels instead of in each.
   const showReadyButton = p2IsHuman
@@ -167,7 +159,6 @@ export function LoadoutScreen({ game }: { game: LoadoutGame }) {
 
   const optionsRow = loadout.options({
     host: controlsHost,
-    rotation,
     accentColor: themeColors.tertiary,
     mutedColor: fgMuted,
     onAccentColor: themeColors.onTertiary,
@@ -186,7 +177,7 @@ export function LoadoutScreen({ game }: { game: LoadoutGame }) {
     optionsRow
   )
 
-  const controlLook = { accentColor: themeColors.tertiary, mutedColor: fgMuted, dark, rotation }
+  const controlLook = { accentColor: themeColors.tertiary, mutedColor: fgMuted, dark }
   const p1Control = loadout.seatControl(1, controlsHost, { ...controlLook, seatColor: p1Drawn })
   const p1Panel = <PlayerSetupPanel key={`p1-${layoutKey}`} idPrefix='p1' host={controlsHost} color={p1Color} onColorChange={handleP1ColorChange} swatches={defaultColors} takenColor={p2Exists ? p2Color : undefined} allowSwapTaken={mode === 'vsCpu'} colorCaption={pack.colorCaption} isHuman ready={ready[1]} onToggleReady={() => setReady((r) => ({ ...r, 1: !r[1] }))} dark={dark} showReadyButton={showReadyButton} secondPicker={p1Control} secondPickerId={p1Control ? 'p1-control' : undefined} profiles={profiles} selectedProfileId={lastSelected[1]} takenProfileId={p2IsHuman ? lastSelected[2] : null} guestLabel={pack.guestLabel ?? 'P1'} nullLabel={pack.nullLabel} onProfileSelect={handleP1ProfileSelect} onManageProfiles={() => router.push(PROFILES_HREF)} previewValue={seatPreview} triggerStyle={triggerStyle} useSeatPickerAlign={seatPickerAlign} />
   const p2Control = p2IsHuman ? loadout.seatControl(2, p2Host, { ...controlLook, seatColor: p2Drawn }) : undefined
@@ -195,10 +186,8 @@ export function LoadoutScreen({ game }: { game: LoadoutGame }) {
 
   return (
     <View style={[styles.container, { backgroundColor: bg }]}>
-      {/* Driven by panelLayout (the same committed, fade-masked state DualZoneLayout renders from),
-      so the rotation change and the panel swap land in the same fade-covered moment. The Settings
-      dialog stays outside: it renders through a Portal, turned by its own `rotation`. */}
-      <FakeLandscapeView orientationMode={panelLayout.orientationMode} p1OnRight={panelLayout.p1OnRight} upsideDown={panelLayout.upsideDown} style={styles.rotatable}>
+      {/* The Settings dialog stays outside this frame: it renders through a Portal. */}
+      <View style={styles.frame}>
         {/* Press-away overlays for the loadout's own menus. P1's covers the whole screen (their
         panel plus the match options read as theirs), while P2's covers only their half and, as a
         later sibling, takes priority there. P2's mounts whenever either host has a menu open, so it
@@ -225,15 +214,15 @@ export function LoadoutScreen({ game }: { game: LoadoutGame }) {
           <View style={styles.stackedZone}>
             {sharedControls}
             <Animated.View style={[styles.playersRow, anyPlayerPickerOpen && styles.playersRowOpen, playersRowFade]}>
-              {!isPortrait && panelLayout.p1OnRight ? p2Panel : p1Panel}
-              {!isPortrait && panelLayout.p1OnRight ? p1Panel : p2Panel}
+              {p1Panel}
+              {p2Panel}
             </Animated.View>
             <ReadyButton color={p1Drawn} ready={ready[1]} onToggleReady={() => setReady((r) => ({ ...r, 1: !r[1] }))} style={anyPlayerPickerOpen && styles.readyButtonHidden} />
           </View>
         )}
-      </FakeLandscapeView>
+      </View>
 
-      <SettingsDialog visible={settingsOpen} onDismiss={() => setSettingsOpen(false)} rotation={rotation} onShowHowToPlay={() => openFor(game.id)} />
+      <SettingsDialog visible={settingsOpen} onDismiss={() => setSettingsOpen(false)} onShowHowToPlay={() => openFor(game.id)} />
     </View>
   )
 }
@@ -249,12 +238,13 @@ const styles = StyleSheet.create({
   container: {
     flex: 1
   },
-  p2ZoneLeft: {
-    bottom: 0,
-    left: 0,
-    position: 'absolute',
-    top: 0,
-    width: '50%'
+  // A real full-bleed box to size the absolutely-positioned children against.
+  frame: {
+    alignItems: 'center',
+    flex: 1,
+    gap: 32,
+    justifyContent: 'center',
+    paddingHorizontal: 16
   },
   p2ZoneRight: {
     bottom: 0,
@@ -289,14 +279,6 @@ const styles = StyleSheet.create({
     opacity: 0,
     pointerEvents: 'none'
   },
-  // A real full-bleed box for FakeLandscapeView to size its absolutely-positioned children against.
-  rotatable: {
-    alignItems: 'center',
-    flex: 1,
-    gap: 32,
-    justifyContent: 'center',
-    paddingHorizontal: 16
-  },
   stackedZone: {
     alignItems: 'center',
     gap: 28

package/src/screens/ProfilesRoute.tsx

@@ -6,7 +6,7 @@ import { useProfiles } from '../hooks/useProfiles'
 import { safeBack } from '../navigation'
 import { usePack } from '../PackContext'
 
-// Widest the roster gets in the wide layout (a phone held sideways, a desktop window). Upright it's
+// Widest the roster gets in the wide layout (a landscape phone, a desktop window). Upright it's
 // never capped.
 const ROSTER_MAX_WIDTH = 640
 
@@ -14,10 +14,10 @@ const ROSTER_MAX_WIDTH = 640
 // stats and achievements in every game: each game's reducers listen for the removal (see
 // onProfileRemoved.ts).
 //
-// Turned with the phone like every other screen, in hud's RotatedFrame: ProfilesManager reads the
-// safe-area insets itself (the header's padding), so they're handed over remapped onto the frame's
-// edges (rotatedSafeArea); its delete confirm is a Paper Portal, which lands in a host inside the frame
-// and is turned with it (portalHost); and the roster's column is capped in the wide layout. Over a
+// In hud's RotatedFrame, which nothing turns since @tastic/core 0.15: ProfilesManager reads the
+// safe-area insets itself (the header's padding), handed over by rotatedSafeArea; its delete confirm is a
+// Paper Portal, which lands in a host inside the frame (portalHost); and the roster's column is capped in
+// the wide layout. Over a
 // pack's Backdrop the screen is transparent, drawn in the pack's foreground.
 // The pack's own placement for a profile's color swatch (PackDefinition.usePickerAlign), kept inside the
 // roster's capped column: the roster scrolls in it, which clips the menu at its edges. Handed to

package/src/screens/StatsScreen.tsx

@@ -34,7 +34,7 @@ const ALL_GAMES = '__all__'
 const PLAYER_PICKER_ID = 'stats-player'
 const GAME_PICKER_ID = 'stats-game'
 
-// Widest the column gets in the wide layout (a phone held sideways, a desktop window): a list of stat
+// Widest the column gets in the wide layout (a landscape phone, a desktop window): a list of stat
 // rows stretched across an 874pt-wide screen reads badly. Upright it's never capped.
 const STATS_MAX_WIDTH = 640
 
@@ -45,9 +45,8 @@ const STATS_MAX_WIDTH = 640
 // can't be told apart. A pack for one player at a time (PackDefinition.guestStats) keeps a guest's
 // stats under GUEST_PLAYER_ID, offers Guest in the picker and opens on whoever is in seat 1.
 //
-// Turned with the phone in hud's RotatedFrame: its insets remapped onto the frame's edges, the reset
-// confirm portaled into a host inside the frame (so it's turned with it, at rotation 0), and the column
-// capped in the wide layout.
+// In hud's RotatedFrame, which nothing turns since @tastic/core 0.15: it hands the screen the safe-area
+// insets, hosts the reset confirm's portal inside the frame, and caps the column in the wide layout.
 export function StatsScreen() {
   const pickerHost = usePopoverHost()
   return (
@@ -81,7 +80,7 @@ const noPickerAlign = () => undefined
 function StatsContent({ pickerHost }: { pickerHost: PopoverHost }) {
   const pack = usePack()
   const { dark, colors } = useAutoPaperTheme()
-  // Already remapped onto the turned frame's edges by RotatedFrame's rotatedSafeArea.
+  // Handed over by RotatedFrame's rotatedSafeArea.
   const insets = useSafeAreaInsets()
   const { profiles, lastSelected } = useProfiles()
   const dispatch = useDispatch()

package/src/screens/homeLayout.ts

@@ -1,20 +1,19 @@
-import { clamp, rotateInsets, useRotatedWindowDimensions, useRotation } from '@tastic/core'
+import { clamp } from '@tastic/core'
+import { useWindowDimensions } from 'react-native'
 import { type EdgeInsets, useSafeAreaInsets } from 'react-native-safe-area-context'
 
 // Home's geometry for a pack whose games have previews (GameDefinition.Preview), ported from
 // Solitaire's components/homeLayout.ts. Upright, Home is the one scrolling column every pack has: the
-// hero, seat 1's button, then a row per game, each row's preview at its start. Held sideways a phone
+// hero, seat 1's button, then a row per game, each row's preview at its start. A landscape phone
 // is only ~400pt tall, and that column would spend the whole height on the hero before showing a
-// single game, so a "wide" layout (any window whose ROTATED footprint is landscape: a phone held
-// sideways, an iPad, a desktop browser) splits it into two panes: the hero and seat 1's button on the
+// single game, so a "wide" layout (any window wider than tall: a landscape phone, a landscape iPad, a
+// desktop browser) splits it into two panes: the hero and seat 1's button on the
 // left, and a scrolling grid of game tiles on the right. The trophy (top-left) and cog (top-right)
 // corner buttons stay where they are; the right pane stops short of the cog so tiles never scroll
 // underneath it. A pack without previews keeps the column at every size.
 //
-// Everything here works in the ROTATED frame's own coordinates (Home's FakeLandscapeView): `width`/
-// `height` are the rotated footprint and `insets` are the safe-area insets already remapped onto the
-// frame's edges (rotateInsets). The rotated top/bottom insets are ~0 under a portrait-locked OS (a
-// phone held sideways only has left/right insets), so nothing here leans on them for breathing room.
+// A landscape phone's top and bottom insets are ~0 (only the sides have them), so nothing here leans
+// on them for breathing room.
 
 // Every preview's width / height: Solitaire's preview canvas (360 x 200), so its deals fit as drawn.
 export const PREVIEW_ASPECT = 360 / 200
@@ -52,15 +51,15 @@ const HOME_LEFT_PANE_BOTTOM_PADDING = 16
 const HOME_HERO_SIDE_ROOM = 16
 
 export interface HomeLayout {
-  // The rotated footprint is landscape: the two-pane layout is in effect (for a pack with previews).
+  // The window is landscape: the two-pane layout is in effect (for a pack with previews).
   isWide: boolean
-  // The window's footprint AFTER rotation.
+  // The window's size.
   windowWidth: number
   windowHeight: number
-  // Safe-area insets remapped onto the rotated frame's own edges (see @tastic/core's rotateInsets).
+  // The safe-area insets.
   insets: EdgeInsets
-  // Wide layout: padding on the two panes' row. Each side hugs ITS OWN inset (a phone held sideways
-  // has a large inset only on the island side), the trailing one also reserves the cog's gutter, and
+  // Wide layout: padding on the two panes' row. Each side hugs ITS OWN inset (a landscape phone has a
+  // large inset only on the island side), the trailing one also reserves the cog's gutter, and
   // both carry the equal margin left over once the content hits its cap. 0 upright.
   paddingLeft: number
   paddingRight: number
@@ -118,12 +117,9 @@ export function computeHomeLayout(windowWidth: number, windowHeight: number, ins
   }
 }
 
-// The live layout for the current window and rotation. Reads useRotatedWindowDimensions()/
-// rotateInsets() rather than raw useWindowDimensions()/useSafeAreaInsets(), so it describes the
-// footprint a rotated Home actually renders into (both are exact identities at 0deg).
+// The live layout for the current window.
 export function useHomeLayout(): HomeLayout {
-  const { width, height } = useRotatedWindowDimensions()
-  const rotation = useRotation()
-  const insets = rotateInsets(useSafeAreaInsets(), rotation)
+  const { width, height } = useWindowDimensions()
+  const insets = useSafeAreaInsets()
   return computeHomeLayout(width, height, insets)
 }

package/src/types.ts

@@ -1,5 +1,4 @@
 import type { ThemeAppearance, ThemeSettings } from '@rific/auto-paper'
-import type { ViewRotation } from '@tastic/core'
 import type { AlignResult, PopoverHost } from '@tastic/hud/chrome'
 import type { GuideStep } from '@tastic/hud/guide'
 import type { MenuOption } from '@tastic/hud/lobby'
@@ -39,10 +38,9 @@ export function humanSeatsFor(mode: RoundMode): Seat[] {
 }
 
 // What the loadout's match-options row is handed (see GameLoadout.options): the popover host it
-// shares with seat 1's panel, the screen's rotation, and the colors the row draws with.
+// shares with seat 1's panel, and the colors the row draws with.
 export interface LoadoutOptionsProps {
   host: PopoverHost
-  rotation: ViewRotation
   accentColor: string
   mutedColor: string
   onAccentColor: string
@@ -58,7 +56,6 @@ export interface SeatControlLook {
   seatColor: string
   mutedColor: string
   dark: boolean
-  rotation: ViewRotation
 }
 
 // One game's part of the shared loadout (shell/screens/LoadoutScreen.tsx), built by the game's
@@ -131,7 +128,7 @@ export interface PackGuide {
 }
 
 // A game's rules sheet (GameDefinition.Rules), opened from its tile's rules button on Home. It renders
-// through a Paper Portal into a host Home mounts inside its turned frame, so it's already turned with it.
+// through a Paper Portal into a host Home mounts inside its own frame.
 export interface GameRulesProps {
   visible: boolean
   onDismiss: () => void
@@ -152,11 +149,10 @@ export interface GameDefinition {
   // Seat 2's choices in this game, in menu order. 'nobody' only where the game has a solo mode.
   // Left out by a game for one player only: its loadout has no seat 2 button and every round is solo.
   seatTwo?: readonly SeatTwo[]
-  // How the 2 Player loadout seats its players, to match where the game puts them: always face
-  // to face (or only off the web, where a desktop window seats them side by side), and whether an
-  // upside-down hold swaps who is at the bottom. Only read in 2 Player, so a game without 'person'
-  // among its seatTwo choices can leave it out.
-  twoPlayerSeats?: { faceToFaceOnWeb: boolean; followUpsideDown: boolean }
+  // The 2 Player loadout seats its players side by side (P1 on the left) in a window wider than tall,
+  // to match a game whose board does the same there. Unset, they sit face to face in any window (P1 at
+  // the bottom). Only read in 2 Player, so a game without 'person' among its seatTwo choices leaves it out.
+  sideBySideWhenWide?: boolean
   // The store keys this game mounts (settings, achievements, guide), merged into the pack's store.
   reducers: Record<string, Reducer>
   // Mounted at the app root for the game's lifetime (its stats and achievements context). Left out by
@@ -172,9 +168,8 @@ export interface GameDefinition {
   // board: the shell only remembers which game it was (redux/lastActiveGameSlice.ts). A match that
   // isn't saved (liveplay) shouldn't opt in, or a relaunch would open a fresh one.
   resumable?: boolean
-  // The play screen keeps the status bar while the phone is held upright. Unset, the bar is hidden on
-  // every play screen for the whole round, whatever the angle; set, it's hidden only while the
-  // content is turned, as on every other screen.
+  // The play screen keeps the status bar. Unset, the bar is hidden on every play screen for the whole
+  // round; set, it shows as on every other screen.
   keepStatusBar?: boolean
   // The game's stats sections and its achievement list for the stats screen, for one profile
   // (null is Everyone).
@@ -313,13 +308,10 @@ export interface PackDefinition {
   useScreenOptions?: () => StackScreenOptions
   // The two sounds every button plays, in place of the shell's own.
   useFeedbackSounds?: () => FeedbackSounds
-  // The pack's own toaster, drawn in a frame turned with the phone (with the safe-area insets turned
-  // onto the frame's edges) in place of the shell's. It renders inline: the toast provider is given no
+  // The pack's own toaster, drawn in a frame over the whole app (inside the safe area) in place of the
+  // shell's. It renders inline: the toast provider is given no
   // Paper, so nothing portals it out of the frame.
   Toaster?: ComponentType
-  // Every screen reads upright while the software keyboard is up (@tastic/core's OrientationProvider),
-  // for typing a profile's name with the phone sideways.
-  portraitWhileKeyboard?: boolean
   // false leaves Edge Guard out of Settings (a pack with no edge controls and no Edge Guard plugin).
   edgeGuard?: boolean
   // The theme seat 1's color makes (a muted seed with a harmony), applied whenever the seats' colors or
@@ -352,9 +344,9 @@ export interface PackDefinition {
   newProfileColor?: string
   // Where a picker's menu opens (its alignOverride) on Home (seat 1's button), a loadout's one-human row
   // (both seat buttons; 2 Player keeps each menu in its own player's half), the stats screen (its two
-  // pickers) and Profiles (a profile's color swatch). hud's own placement measures a turned button
-  // against the upright window, so with the phone held sideways it can pick the side with no room and
-  // run the menu off the screen (Solitaire's useFrameAutoAlign places it in the turned frame instead).
+  // pickers) and Profiles (a profile's color swatch). It was added because hud's own placement measured
+  // a button in a frame turned by @tastic/core's drawn rotation against the upright window; nothing turns
+  // since core 0.15, so a pack may no longer need one.
   // `open` is whether this picker's menu is open, the size is its content's, and `maxContentWidth` is a
   // capped column's width the menu stays inside (Profiles' roster). Unset is hud's own placement.
   usePickerAlign?: PickerAlign