Function useDisplay

Returns {
    displaySize: Writable<number>;
    displaySizeDefault: number;
    homeGridColumns: Writable<number>;
    homeGridColumnsDefault: number;
    homeGridColumnsMax: number;
    homeGridColumnsMin: number;
    homeGridRows: Writable<number>;
    homeGridRowsDefault: number;
    homeGridRowsMax: number;
    homeGridRowsMin: number;
    isSizeLimited: Readable<boolean>;
    phoneBox: Readable<{ height: number; width: number }>;
    phoneScale: Readable<number>;
    setDisplaySize: (size: number) => void;
    setHomeGridSize: (columns: number, rows: number) => void;
}

• displaySize: Writable<number>

  The Display > Phone Size setting, 0-100. Writable: Settings moves it.

• displaySizeDefault: number

  Where the slider starts, so a Reset control needs no second copy of the number.

• homeGridColumns: Writable<number>

  Home Screen Grid — columns/rows, and their adjustable bounds.

• homeGridColumnsDefault: number

• homeGridColumnsMax: number

• homeGridColumnsMin: number

• homeGridRows: Writable<number>

• homeGridRowsDefault: number

• homeGridRowsMax: number

• homeGridRowsMin: number

• isSizeLimited: Readable<boolean>

  True when the window is smaller than the setting asks for, and is winning.

• phoneBox: Readable<{ height: number; width: number }>

  The rendered size in CSS pixels, for showing the player what they picked.

• phoneScale: Readable<number>

  The zoom actually applied, after fitting to the window. Read-only.

• setDisplaySize: (size: number) => void

• setHomeGridSize: (columns: number, rows: number) => void

  Applies a new grid size and reflows anything the shrink pushed out of bounds. The setter alone would leave those items structurally valid but unreachable — a shrink is the one time homeGridItems needs touching from outside homeGrid.ts itself, so this bundles the write and the reflow into one call rather than asking every caller to remember the second step.