@caperjs/core 0.1.0

package/lib/ui/Input.d.ts

@@ -0,0 +1,384 @@
+import { Bounds, FederatedEvent, FederatedPointerEvent, Graphics, Container as PIXIContainer, Rectangle, Sprite, Text } from 'pixi.js';
+import { TextProps } from '../mixins';
+import { EaseString, Padding, PointLike } from '../utils';
+import { Container } from '../display';
+import { Signal } from '../signals';
+/**
+ * Options for styling the input background
+ * @interface BgStyleOptions
+ */
+export type BgStyleOptions = {
+    /** Border radius of the input background */
+    radius: number;
+    /** Fill style for the background */
+    fill: {
+        color?: number;
+        alpha?: number;
+    };
+    /** Stroke style for the background border */
+    stroke: {
+        width?: number;
+        color?: number;
+        alpha?: number;
+    };
+};
+/**
+ * Color configuration options
+ * @interface ColorOptions
+ */
+export type ColorOptions = {
+    /** Color in hexadecimal format */
+    color: number;
+    /** Alpha transparency value (0-1) */
+    alpha: number;
+};
+/**
+ * Placeholder text configuration
+ * @interface PlaceholderOptions
+ */
+export type PlaceholderOptions = {
+    /** Text to display as placeholder */
+    text: string;
+};
+/**
+ * Focus overlay configuration for mobile/touch interactions
+ * @interface FocusOverlayOptions
+ * @example
+ * ```typescript
+ * const overlaySettings = {
+ *   activeFilter: ['mobile', 'touch'],
+ *   marginTop: 60,
+ *   scale: 2.5,
+ *   backing: { active: true, color: 0x0 }
+ * };
+ * ```
+ */
+export type FocusOverlayOptions = {
+    /** Enable overlay for specific platforms */
+    mobile: boolean;
+    touch: boolean;
+    desktop: boolean;
+    /** Custom filter for when to show overlay */
+    activeFilter?: boolean | (() => boolean) | ('mobile' | 'touch' | 'desktop')[];
+    /** Scale factor for the overlay */
+    scale: number;
+    /** Top margin for the overlay */
+    marginTop: number;
+    /** Backing configuration */
+    backing: {
+        active: boolean;
+        options: Partial<ColorOptions>;
+    };
+};
+/**
+ * Extended placeholder options with animation and positioning
+ * @interface ExtraPlaceholderOptions
+ * @example
+ * ```typescript
+ * const placeholderConfig = {
+ *   positionOnType: 'top',
+ *   offsetOnType: { x: 0, y: -20 },
+ *   scaleOnType: { x: 0.8, y: 0.8 },
+ *   animationOnType: {
+ *     duration: 0.3,
+ *     ease: 'sine.out',
+ *     tint: 0x666666,
+ *     alpha: 0.5
+ *   }
+ * };
+ * ```
+ */
+type ExtraPlaceholderOptions = {
+    /** Position of placeholder when typing */
+    positionOnType: 'top' | 'bottom';
+    /** Offset from original position when typing */
+    offsetOnType: PointLike;
+    /** Scale factor when typing */
+    scaleOnType: PointLike;
+    /** Animation configuration when typing */
+    animationOnType: {
+        duration: number;
+        ease: EaseString;
+        tint: number;
+        alpha: number;
+    };
+};
+/**
+ * Main configuration options for the Input component
+ * @interface InputOptions
+ * @example
+ * ```typescript
+ * const input = new Input({
+ *   value: 'Initial value',
+ *   type: 'text',
+ *   minWidth: 400,
+ *   padding: [12, 15],
+ *   placeholder: {
+ *     text: 'Enter text...',
+ *     color: 0x666666
+ *   },
+ *   bg: {
+ *     radius: 10,
+ *     stroke: { width: 2, color: 0x000000 }
+ *   },
+ *   focusOverlay: {
+ *     activeFilter: ['mobile', 'touch'],
+ *     scale: 2.5
+ *   }
+ * });
+ * ```
+ */
+export interface InputOptions extends Partial<TextProps> {
+    /** Initial value of the input */
+    value: string;
+    /** Input type (text, password, number, etc.) */
+    type: 'text' | 'password' | 'number' | 'email' | 'tel' | 'url';
+    /** Whether the input width is fixed */
+    fixed: boolean;
+    /** Pattern for input validation */
+    pattern: string;
+    /** Enable debug mode */
+    debug: boolean;
+    /** Minimum width of the input */
+    minWidth: number;
+    /** Padding configuration */
+    padding: Padding;
+    /** Maximum length of input */
+    maxLength?: number;
+    /** Whether to blur on Enter key */
+    blurOnEnter: boolean;
+    /** Custom regex for validation */
+    regex?: RegExp;
+    /** Background style configuration */
+    bg: Partial<BgStyleOptions>;
+    /** Placeholder configuration */
+    placeholder: Partial<PlaceholderOptions & ColorOptions & ExtraPlaceholderOptions>;
+    /** Selection highlight configuration */
+    selection: Partial<ColorOptions>;
+    /** Caret configuration */
+    caret: Partial<ColorOptions>;
+    /** Error state styling */
+    error?: {
+        input?: {
+            fill?: number;
+        };
+        bg?: Partial<Omit<BgStyleOptions, 'stroke'>>;
+    };
+    /** Focus overlay configuration */
+    focusOverlay: Partial<FocusOverlayOptions>;
+}
+export interface InputProps extends Omit<InputOptions, 'padding'> {
+    padding: PointLike | Padding | number[] | number;
+}
+export type InputDetail = {
+    value: string;
+    input: Input;
+    domElement: HTMLInputElement;
+};
+declare const Input_base: typeof Container & import('..').Constructor<import('..').ISignalContainer> & import('..').Constructor<import('..').IInteractive> & import('..').Constructor<import('..').IFocusable>;
+/**
+ * A highly customizable input component with mobile/touch support
+ * @class Input
+ * @extends Focusable(Interactive(WithSignals(Container)))
+ *
+ * @example
+ * ```typescript
+ * // Basic text input
+ * const basicInput = new Input({
+ *   minWidth: 400,
+ *   placeholder: { text: 'Enter text' },
+ *   padding: [12, 15]
+ * });
+ *
+ * // Password input with validation
+ * const passwordInput = new Input({
+ *   type: 'password',
+ *   minWidth: 400,
+ *   placeholder: { text: 'Enter password' },
+ *   maxLength: 20,
+ *   regex: /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/
+ * });
+ *
+ * // Phone number input with validation
+ * const phoneInput = new Input({
+ *   type: 'tel',
+ *   regex: /^1?-?\(?([2-9][0-9]{2})\)?[-. ]?([2-9][0-9]{2})[-. ]?([0-9]{4})$/,
+ *   error: {
+ *     input: { fill: 0xff0000 },
+ *     bg: { fill: 0xf5e0df }
+ *   }
+ * });
+ * ```
+ */
+export declare class Input extends Input_base {
+    isClone: boolean;
+    clone: Input | null;
+    /**
+     * Emitted when the Enter key is pressed
+     * @event onEnter
+     * @type {Signal<(detail: InputDetail) => void>}
+     */
+    onEnter: Signal<(detail: InputDetail) => void>;
+    /**
+     * Emitted when the input value changes
+     * @event onChange
+     * @type {Signal<(detail: InputDetail) => void>}
+     */
+    onChange: Signal<(detail: InputDetail) => void>;
+    /**
+     * Emitted when validation fails
+     * @event onError
+     * @type {Signal<(detail: InputDetail) => void>}
+     */
+    onError: Signal<(detail: InputDetail) => void>;
+    /**
+     * Input configuration options
+     * @type {InputOptions}
+     */
+    options: InputOptions;
+    /**
+     * Background graphics container
+     * @type {Graphics}
+     */
+    bg: Graphics;
+    /**
+     * Caret (cursor) container
+     * @type {PIXIContainer}
+     */
+    caret: PIXIContainer;
+    /**
+     * Text input container
+     * @type {Text}
+     */
+    input: Text;
+    /**
+     * Placeholder text container
+     * @type {Text}
+     */
+    placeholder: Text;
+    /**
+     * Current error state
+     * @type {boolean}
+     */
+    error: boolean;
+    protected cursorAnimation: gsap.core.Tween;
+    protected domElement: HTMLInputElement;
+    protected selectionGraphics: Graphics;
+    protected cloneOverlay: Input;
+    protected overlayBacking: Sprite;
+    private _focusTimer;
+    private _pointerDownTimer;
+    private _inner;
+    private _inputContainer;
+    private _placeholderContainer;
+    private _mask;
+    private _lastWidth;
+    private _lastHeight;
+    private _placeholderPositioned;
+    private _placeholderAnimating;
+    private _caretPosition;
+    private _selectionRect;
+    private _regex;
+    private _value;
+    constructor(options: Partial<InputProps>, isClone?: boolean, clone?: Input | null);
+    /**
+     * Gets the current caret (cursor) position
+     * @readonly
+     * @returns {number} The caret position in pixels from the left
+     */
+    get caretPosition(): number;
+    /**
+     * Gets the current selection rectangle
+     * @readonly
+     * @returns {Rectangle | null} The selection rectangle or null if no selection
+     */
+    get selectionRect(): Rectangle | null;
+    /**
+     * Sets the validation regex
+     * @param {RegExp} value - The regular expression to use for validation
+     */
+    set regex(value: RegExp);
+    /**
+     * Gets whether the current input value is valid
+     * @readonly
+     * @returns {boolean} True if the input is valid
+     */
+    get isValid(): boolean;
+    /**
+     * Gets the current input value
+     * @returns {string} The current value
+     */
+    get value(): string;
+    /**
+     * Sets the input value
+     * @param {string} value - The value to set
+     */
+    set value(value: string);
+    /**
+     * Resizes the input component
+     * Updates the clone overlay position if it exists
+     */
+    resize(): void;
+    /**
+     * Redraws the background graphics
+     */
+    resetBg(): void;
+    /**
+     * Called when the component is added to the display list
+     * Shows the cursor if this is a clone
+     */
+    added(): void;
+    /**
+     * Handles click/tap events on the input
+     * Creates the DOM element and positions the caret
+     * @param {FederatedEvent} [e] - The pointer event
+     */
+    handleClick(e?: FederatedEvent): void;
+    /**
+     * Focuses the input
+     * Creates the DOM element and shows the cursor
+     */
+    focusIn(): void;
+    _focusDomElement(selection?: number): void;
+    _triggerFocusAndSelection(selection?: number): void;
+    _checkPointerDownOutside(e: FederatedPointerEvent): void;
+    /**
+     * Blurs (unfocuses) the input
+     * Removes the DOM element and hides the cursor
+     */
+    focusOut(): void;
+    update(): void;
+    drawSelection(): void;
+    drawBg(width?: number, height?: number): void;
+    destroy(): void;
+    protected addBg(): void;
+    protected addSelection(): void;
+    protected addCaret(): void;
+    protected addInput(): void;
+    protected addPlaceholder(): void;
+    protected createDomElement(selection?: number): void;
+    protected destroyDomElement(): void;
+    protected showCursor(): void;
+    protected hideCursor(): void;
+    protected blinkCaret(): void;
+    protected validate(): void;
+    private _removeDomElementListeners;
+    private _addDomElementListeners;
+    private _handleFocus;
+    private _showCloneOverlay;
+    private _positionCloneOverlay;
+    private _removeCloneOverlay;
+    private _handleDomElementFocus;
+    private _handleDomElementBlur;
+    private _handleDomElementKeyup;
+    private _handleDomElementKeydown;
+    private _updateCaretAndSelection;
+    private _handleDomElementChange;
+    /**
+     * Gets the focusable area bounds
+     * @returns {Bounds} The bounds of the input container
+     */
+    getFocusArea(): Bounds;
+}
+export {};
+//# sourceMappingURL=Input.d.ts.map

package/lib/ui/Input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/ui/Input.ts"],"names":[],"mappings":"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"}

package/lib/ui/Joystick.d.ts

@@ -0,0 +1,61 @@
+import { DestroyOptions, FederatedPointerEvent, Graphics, Point, Sprite } from 'pixi.js';
+import { Container } from '../display';
+import { JoystickDirection } from '../plugins';
+import { Signal } from '../signals';
+export interface IJoystick {
+    onChange: Signal<(detail: JoystickSignalDetail) => void>;
+    onStart: Signal<() => void>;
+    onEnd: Signal<() => void>;
+    onDestroy: Signal<() => void>;
+    settings: JoystickSettings;
+    outerRadius: number;
+    innerRadius: number;
+    outer: Sprite | Graphics;
+    inner: Sprite | Graphics;
+    dragging: boolean;
+    pointData: Point;
+    power: number;
+    startPosition: Point;
+    direction: JoystickDirection;
+}
+export interface JoystickSignalDetail {
+    angle: number;
+    direction: JoystickDirection;
+    power: number;
+}
+export interface JoystickSettings {
+    outer?: Sprite | Graphics;
+    inner?: Sprite | Graphics;
+    outerScale?: number;
+    innerScale?: number;
+    threshold?: number;
+}
+export declare class Joystick extends Container implements IJoystick {
+    onChange: Signal<(detail: JoystickSignalDetail) => void>;
+    onStart: Signal<() => void>;
+    onEnd: Signal<() => void>;
+    onDestroy: Signal<() => void>;
+    settings: JoystickSettings;
+    outerRadius: number;
+    innerRadius: number;
+    outer: Sprite | Graphics;
+    inner: Sprite | Graphics;
+    innerAlphaStandby: number;
+    dragging: boolean;
+    pointData: Point;
+    power: number;
+    startPosition: Point;
+    direction: JoystickDirection;
+    threshold: number;
+    private _pointerId?;
+    constructor(opts: Partial<JoystickSettings>);
+    initialize(): void;
+    handleDragMove(e: FederatedPointerEvent): void;
+    destroy(options?: DestroyOptions): void;
+    protected handleDragStart(e: FederatedPointerEvent): void;
+    protected handleDragEnd(e: FederatedPointerEvent | PointerEvent): void;
+    protected bindEvents(): void;
+    protected getPower(centerPoint: Point): number;
+    protected getDirection(center: Point): JoystickDirection.Left | JoystickDirection.Top | JoystickDirection.Bottom | JoystickDirection.Right | JoystickDirection.TopLeft | JoystickDirection.TopRight | JoystickDirection.BottomLeft | JoystickDirection.BottomRight;
+}
+//# sourceMappingURL=Joystick.d.ts.map

package/lib/ui/Joystick.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Joystick.d.ts","sourceRoot":"","sources":["../../src/ui/Joystick.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACzF,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAEpC,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,MAAM,CAAC,CAAC,MAAM,EAAE,oBAAoB,KAAK,IAAI,CAAC,CAAC;IACzD,OAAO,EAAE,MAAM,CAAC,MAAM,IAAI,CAAC,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC,MAAM,IAAI,CAAC,CAAC;IAC1B,SAAS,EAAE,MAAM,CAAC,MAAM,IAAI,CAAC,CAAC;IAC9B,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,GAAG,QAAQ,CAAC;IACzB,KAAK,EAAE,MAAM,GAAG,QAAQ,CAAC;IACzB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,KAAK,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,KAAK,CAAC;IACrB,SAAS,EAAE,iBAAiB,CAAC;CAC9B;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,iBAAiB,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,qBAAa,QAAS,SAAQ,SAAU,YAAW,SAAS;IAC1D,QAAQ,kBAAuB,oBAAoB,KAAK,IAAI,EAAI;IAChE,OAAO,eAAoB,IAAI,EAAI;IACnC,KAAK,eAAoB,IAAI,EAAI;IACjC,SAAS,eAAoB,IAAI,EAAI;IACrC,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,WAAW,EAAE,MAAM,CAAK;IACxB,WAAW,EAAE,MAAM,CAAK;IAExB,KAAK,EAAG,MAAM,GAAG,QAAQ,CAAC;IAC1B,KAAK,EAAG,MAAM,GAAG,QAAQ,CAAC;IAE1B,iBAAiB,SAAO;IAExB,QAAQ,EAAE,OAAO,CAAS;IAC1B,SAAS,EAAE,KAAK,CAAe;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,KAAK,CAAC;IACrB,SAAS,EAAE,iBAAiB,CAA0B;IACtD,SAAS,EAAE,MAAM,CAAC;IAElB,OAAO,CAAC,UAAU,CAAC,CAAS;gBAEhB,IAAI,EAAE,OAAO,CAAC,gBAAgB,CAAC;IA8B3C,UAAU;IAwBV,cAAc,CAAC,CAAC,EAAE,qBAAqB;IAoGvC,OAAO,CAAC,OAAO,CAAC,EAAE,cAAc;IAUhC,SAAS,CAAC,eAAe,CAAC,CAAC,EAAE,qBAAqB;IAWlD,SAAS,CAAC,aAAa,CAAC,CAAC,EAAE,qBAAqB,GAAG,YAAY;IAY/D,SAAS,CAAC,UAAU;IAUpB,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK;IAMrC,SAAS,CAAC,YAAY,CAAC,MAAM,EAAE,KAAK;CAoBrC"}

package/lib/ui/Popup.d.ts

@@ -0,0 +1,109 @@
+import { ColorSource, DestroyOptions, Container as PIXIContainer, Sprite } from 'pixi.js';
+import { IContainer, Container } from '../display/Container';
+import { ActionContext, IFocusable } from '../plugins';
+/**
+ * Interface for Popup
+ */
+export interface IPopup<T = any> extends IContainer {
+    readonly id: string | number;
+    config: PopupConfig<T>;
+    view: Container;
+    backing?: PIXIContainer;
+    isShowing: boolean;
+    firstFocusableEntity?: IFocusable;
+    data: T;
+    readonly actionContext: ActionContext | undefined;
+    close(): void;
+    initialize(): void;
+    beforeShow(): void;
+    show(): void | Promise<any>;
+    afterShow(): void;
+    beforeHide(): void;
+    hide(): void | Promise<any>;
+    start(): void | Promise<any>;
+    end(): void;
+    restoreActionContext(): void;
+}
+export type PopupConstructor<T = any> = new (id: string | number, config?: Partial<PopupConfig<T>>) => IPopup<T>;
+/**
+ * Configuration for the backing of the popup
+ */
+export type BackingConfig = {
+    color: ColorSource;
+    alpha: number;
+};
+/**
+ * Configuration for the popup
+ */
+export type PopupConfig<T = any> = {
+    id: string | number;
+    closeOnEscape: boolean;
+    closeOnPointerDownOutside: boolean;
+    backing: boolean | Partial<BackingConfig>;
+    data?: T;
+    actionContext?: ActionContext;
+};
+/**
+ * Class representing a Popup
+ */
+export declare class Popup<T = any> extends Container implements IPopup<T> {
+    readonly id: string | number;
+    isShowing: boolean;
+    firstFocusableEntity: IFocusable;
+    view: Container;
+    backing?: Sprite;
+    config: PopupConfig<T>;
+    protected _storedActionContext: ActionContext | undefined;
+    get actionContext(): ActionContext | undefined;
+    /**
+     * Create a new Popup
+     * @param id - The unique identifier for the popup
+     * @param config - The configuration for the popup. The `data` field is
+     *   narrowed to `T` when the subclass declares its generic parameter
+     *   (e.g. `class MyPopup extends Popup<MyData>`), which flows through to
+     *   the typed `app.popups.show('id', { data })` call site.
+     */
+    constructor(id: string | number, config?: Partial<PopupConfig<T>>);
+    get data(): T;
+    /**
+     * Create a backing for the popup
+     * @param config - The configuration for the backing
+     * @param size - The size of the backing
+     * @returns The backing container
+     */
+    private static makeBacking;
+    initialize(): void;
+    beforeShow(): void;
+    beforeHide(): void;
+    destroy(options?: boolean | DestroyOptions): void;
+    /**
+     * Hide the popup
+     * @returns A promise that resolves when the popup is hidden
+     */
+    hide(): void | any | Promise<any>;
+    /**
+     * Show the popup
+     * @returns A promise that resolves when the popup is shown
+     */
+    show(): void | Promise<any>;
+    /**
+     * Start the popup
+     */
+    start(): void | Promise<any>;
+    afterShow(): void;
+    /**
+     * End the popup
+     */
+    end(): void;
+    close(): void | Promise<void>;
+    resize(): void;
+    /**
+     * Initialize the popup
+     * @private
+     */
+    private _initialize;
+    protected setActionContext(): void;
+    protected storeActionContext(): void;
+    restoreActionContext(): void;
+}
+//# sourceMappingURL=Popup.d.ts.map

package/lib/ui/Popup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../src/ui/Popup.ts"],"names":[],"mappings":"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"}