@harmonics/lattice-ui 0.5.1 → 0.7.0

package/dist/types/boardTypes.d.ts

@@ -0,0 +1,2 @@
+/** What was done to the pieces, as a `change` says it. */
+export type BoardAction = "move" | "turn" | "glue" | "break" | "pull" | "add" | "remove";

package/dist/types/elements/board-entry.d.ts

@@ -0,0 +1,9 @@
+import { BOARD_TAG, type BoardChangeDetail, type BoardPiece, defineLatticeBoard, LatticeBoard, type LatticeBoardEventMap } from "./board";
+export type { BoardAction } from "../boardTypes";
+export type { Part, Piece } from "../hexes";
+export { BOARD_TAG, type BoardChangeDetail, type BoardPiece, defineLatticeBoard, LatticeBoard, type LatticeBoardEventMap, };
+declare global {
+    interface HTMLElementTagNameMap {
+        "lattice-board": LatticeBoard;
+    }
+}

package/dist/types/elements/board.d.ts

@@ -0,0 +1,59 @@
+import type { BoardAction } from "../boardTypes";
+import { type Part, type Piece } from "../hexes";
+import { LatticeElement } from "./host";
+export declare const BOARD_TAG = "lattice-board";
+/** A piece as a page hands it over: an id of its own (one is made if not) and its parts. */
+export interface BoardPiece {
+    id?: string;
+    parts: Part[];
+}
+export interface BoardChangeDetail {
+    /** The board's pieces now, fixed ones left out. */
+    pieces: Piece[];
+    action: BoardAction;
+    /** The piece acted on ("" when the board itself moved pieces back into view). */
+    id: string;
+}
+/** The board's own events, for `addEventListener`. */
+export interface LatticeBoardEventMap extends HTMLElementEventMap {
+    change: CustomEvent<BoardChangeDetail>;
+    catch: CustomEvent<{
+        id: string;
+    }>;
+}
+export interface LatticeBoard {
+    addEventListener<K extends keyof LatticeBoardEventMap>(type: K, listener: (this: LatticeBoard, event: LatticeBoardEventMap[K]) => unknown, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof LatticeBoardEventMap>(type: K, listener: (this: LatticeBoard, event: LatticeBoardEventMap[K]) => unknown, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+export declare class LatticeBoard extends LatticeElement {
+    static readonly observedAttributes: string[];
+    private readonly givenSignal;
+    private readonly fixedSignal;
+    private readonly traySignal;
+    private readonly scaleSignal;
+    private readonly labelSignal;
+    /** The board's pieces while it is drawn. */
+    private live;
+    private made;
+    private readonly madeId;
+    /** The pieces on the board, fixed ones left out. */
+    get pieces(): Piece[];
+    set pieces(pieces: unknown);
+    /** Pieces drawn flat and in the way, never handled. */
+    get fixed(): Piece[];
+    set fixed(pieces: unknown);
+    get tray(): boolean;
+    set tray(tray: boolean | string | null);
+    get scale(): number;
+    set scale(scale: number | string);
+    get label(): string;
+    set label(label: string);
+    attributeChangedCallback(name: string, _: string | null, value: string | null): void;
+}
+/**
+ * Register `<lattice-board>` once, or as `name` (a tag of your own, when another library holds
+ * this one); a second call, or a call on a server, does nothing.
+ */
+export declare const defineLatticeBoard: (name?: string) => void;

package/dist/types/elements/icon.d.ts

@@ -1,6 +1,6 @@
 import { LatticeElement } from "./host";
 export declare const ICON_TAG = "lattice-icon";
-export declare const ICON_NAMES: readonly ["shears", "done"];
+export declare const ICON_NAMES: readonly ["shears", "done", "note", "turn", "glue", "apart", "bin"];
 export type IconName = (typeof ICON_NAMES)[number];
 export declare class LatticeIcon extends LatticeElement {
     static readonly observedAttributes: string[];

package/dist/types/elements/index.d.ts

@@ -7,7 +7,7 @@ export { FACES } from "../faceLattice";
 export type { Part } from "../hexes";
 export { FACE_TAG, MOODS } from "./face";
 export { ICON_NAMES, ICON_TAG, type IconName } from "./icon";
-export { SHAPE_TAG } from "./shape";
+export { type LatticeShapeEventMap, type PressDetail, SHAPE_TAG } from "./shape";
 export { SHAPE_NAMES, type ShapeName, TONES } from "./shapes";
 export { SHEARS_TAG, type StrokePoint } from "./shears";
 export { SKY_TAG } from "./sky";

package/dist/types/elements/shape.d.ts

@@ -1,7 +1,22 @@
-import type { Part } from "../hexes";
+import { type Part } from "../hexes";
 import { LatticeElement } from "./host";
 import { type ShapeName } from "./shapes";
 export declare const SHAPE_TAG = "lattice-shape";
+/** What a press says: which shape, and its parts. */
+export interface PressDetail {
+    shape: ShapeName;
+    parts: Part[];
+}
+/** The shape's own events, for `addEventListener`. */
+export interface LatticeShapeEventMap extends HTMLElementEventMap {
+    press: CustomEvent<PressDetail>;
+}
+export interface LatticeShape {
+    addEventListener<K extends keyof LatticeShapeEventMap>(type: K, listener: (this: LatticeShape, event: LatticeShapeEventMap[K]) => unknown, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof LatticeShapeEventMap>(type: K, listener: (this: LatticeShape, event: LatticeShapeEventMap[K]) => unknown, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
 export declare class LatticeShape extends LatticeElement {
     static readonly observedAttributes: string[];
     private readonly shapeSignal;
@@ -10,6 +25,10 @@ export declare class LatticeShape extends LatticeElement {
     private readonly liftSignal;
     private readonly scaleSignal;
     private readonly labelSignal;
+    private readonly pressableSignal;
+    /** Unset until the page makes it a toggle: only then does it say `aria-pressed`. */
+    private readonly pressedSignal;
+    private readonly disabledSignal;
     get shape(): ShapeName;
     set shape(name: string);
     private made;
@@ -24,10 +43,23 @@ export declare class LatticeShape extends LatticeElement {
     set scale(scale: number | string);
     get label(): string;
     set label(label: string);
+    /** A button shaped like itself. Kept as the attribute too, which its look is styled by. */
+    get pressable(): boolean;
+    set pressable(pressable: boolean | string | null);
+    /** Pressed, as a toggle; false when the page has not made it one. */
+    get pressed(): boolean;
+    set pressed(pressed: boolean | string | null | undefined);
+    get disabled(): boolean;
+    set disabled(disabled: boolean | string | null);
     attributeChangedCallback(name: string, _: string | null, value: string | null): void;
+    /**
+     * As a button: its role, its place in the tab order (unless the page gave it one), its name and
+     * states, on the element itself, where a screen reader and the Tab key find them.
+     */
+    private beAButton;
 }
 /**
- * Register `<lattice-shape>` once, or as `name` (a tag of your own, when another library holds this
- * one); a second call, or a call on a server, does nothing.
+ * Register `<lattice-shape>` once, or as `name` (a tag of your own, when another library holds
+ * this one); a second call, or a call on a server, does nothing.
  */
 export declare const defineLatticeShape: (name?: string) => void;

package/dist/types/elements/solid.d.ts

@@ -1,4 +1,5 @@
-import type { HexSky, IconName, LatticeFace, LatticeIcon, LatticeShape, Part, ShapeName, ShearsPadElement, StrokeDetail, StrokeEndDetail } from "./index";
+import type { BoardChangeDetail, BoardPiece, LatticeBoard } from "./board-entry";
+import type { HexSky, IconName, LatticeFace, LatticeIcon, LatticeShape, Part, PressDetail, ShapeName, ShearsPadElement, StrokeDetail, StrokeEndDetail } from "./index";
 declare module "solid-js" {
     namespace JSX {
         interface IntrinsicElements {
@@ -25,6 +26,9 @@ declare module "solid-js" {
                 lift?: number | string;
                 scale?: number | string;
                 label?: string;
+                pressable?: boolean;
+                pressed?: boolean;
+                disabled?: boolean;
             };
             "shears-pad": JSX.HTMLAttributes<ShearsPadElement> & {
                 disabled?: boolean;
@@ -33,11 +37,23 @@ declare module "solid-js" {
                 name?: IconName;
                 label?: string;
             };
+            "lattice-board": JSX.HTMLAttributes<LatticeBoard> & {
+                tray?: boolean;
+                scale?: number | string;
+                label?: string;
+            };
         }
         interface ExplicitProperties {
             parts: Part[] | string;
+            pieces: BoardPiece[] | string;
+            fixed: BoardPiece[];
         }
         interface CustomEvents {
+            change: CustomEvent<BoardChangeDetail>;
+            catch: CustomEvent<{
+                id: string;
+            }>;
+            press: CustomEvent<PressDetail>;
             stroke: CustomEvent<StrokeDetail>;
             strokeend: CustomEvent<StrokeEndDetail>;
         }