@ulu/frontend 0.1.0-beta.81 → 0.1.0-beta.83

package/types/ui/resizer.d.ts

@@ -1,3 +1,6 @@
+/**
+ * Class for creating/controlling a container size with a handle/control
+ */
 export class Resizer {
     static defaults: {
         debug: boolean;
@@ -23,33 +26,103 @@ export class Resizer {
          * - Default null
          */
         fromY: "top" | "bottom" | null;
+        /**
+         * The step in pixels for keyboard resizing with arrow keys.
+         */
+        keyboardStep: number;
+        /**
+         * Debounce time in milliseconds for ending a keyboard resize.
+         */
+        keyboardDebounceTime: number;
+        /**
+         * If true, the Resizer instance will automatically bind its own DOM event listeners
+         * (pointerdown, keydown) to the control element. If `false`, the user is
+         * responsible for calling `resizerInstance.onPointerdown(event)` and
+         * `resizerInstance.onKeydown(event)` from their own listeners.
+         * Default: true
+         */
+        manageEvents: boolean;
+        /**
+         * If true, the Resizer instance will automatically manage the `aria-label`
+         * attribute of the control element. If `false`, the user is responsible
+         * for setting this attribute.
+         * Default: false
+         */
+        manageAriaLabel: boolean;
+        /**
+         * If true, pointer events (mouse/touch) will enable resizing.
+         * Default: true
+         */
+        enablePointerResizing: boolean;
+        /**
+         * If true, keyboard events (arrow keys) will enable resizing.
+         * Default: true
+         */
+        enableKeyboardResizing: boolean;
     };
     /**
      * @param {Node} container Container to be resized
-     * @param {Node} control Resize handle element
-     * @param {Object} options Options to configure the resizer.
-     * @param {Boolean} options.debug Enable non-essential debugging logs.
-     * @param {Boolean} options.overrideMaxDimensions When script is activated by handle, remove the element's max-width/max-height and allow the resize to exceed them (default false).
-     * @param {"left"|"right"|null} [options.fromX=null] Horizontal resizing direction.
-     * @param {"top"|"bottom"|null} [options.fromY=null] Vertical resizing direction.
+     * @param {HTMLElement} control Resize handle element (should be focusable like a button)
+     * @param {Object} config Options to configure the resizer.
+     * @param {Boolean} [config.debug=false] Enable non-essential debugging logs.
+     * @param {Boolean} [config.multiplier=1] Amount to increase size by (ie. pointer movement * multiplier).
+     * @param {Boolean} [config.overrideMaxDimensions=false] When script is activated by handle, remove the element's max-width/max-height and allow the resize to exceed them.
+     * @param {"left"|"right"|null} [config.fromX=null] Horizontal resizing direction.
+     * @param {"top"|"bottom"|null} [config.fromY=null] Vertical resizing direction.
+     * @param {number} [config.keyboardStep=10] The step in pixels for keyboard resizing.
+     * @param {number} [config.keyboardDebounceTime=200] Debounce time for keyboard resize end.
+     * @param {boolean} [config.manageEvents=true] If true, the Resizer will automatically bind its own events.
+     * @param {boolean} [config.manageAriaLabel=false] If true, the Resizer will manage the control's aria-label.
+     * @param {boolean} [config.enablePointerResizing=true] If true, pointer events will enable resizing.
+     * @param {boolean} [config.enableKeyboardResizing=true] If true, keyboard events will enable resizing.
      */
-    constructor(container: Node, control: Node, options: {
-        debug: boolean;
-        overrideMaxDimensions: boolean;
+    constructor(container: Node, control: HTMLElement, config: {
+        debug?: boolean;
+        multiplier?: boolean;
+        overrideMaxDimensions?: boolean;
         fromX?: "left" | "right" | null;
         fromY?: "top" | "bottom" | null;
+        keyboardStep?: number;
+        keyboardDebounceTime?: number;
+        manageEvents?: boolean;
+        manageAriaLabel?: boolean;
+        enablePointerResizing?: boolean;
+        enableKeyboardResizing?: boolean;
     });
     options: any;
     container: Node;
-    control: Node;
+    control: HTMLElement;
     debug: any;
     resizeHorizontal: boolean;
     resizeVertical: boolean;
     /**
-     * Cleans up event listeners to prevent memory leaks.
+     * Cleans up event listeners and internal state to prevent memory leaks.
      */
     destroy(): void;
-    dispatchEvent(type: any, data: any): void;
+    /**
+     * Public handler for pointerdown events. Call this method from your own event listeners
+     * if `manageEvents` is false. Its logic will only execute if `enablePointerResizing` is true.
+     * @param {PointerEvent} e The pointerdown event.
+     */
+    onPointerdown(e: PointerEvent): void;
+    /**
+     * Public handler for keydown events. Call this method from your own event listeners
+     * if `manageEvents` is false. Its logic will only execute if `enableKeyboardResizing` is true.
+     * @param {KeyboardEvent} e The keydown event.
+     */
+    onKeydown(e: KeyboardEvent): void;
+    /**
+     * Generates an accessible label for the resize control based on its configuration.
+     * This is a convenience function that can be used by the consumer if `manageAriaLabel` is false.
+     * @returns {string} The suggested aria-label for the control.
+     */
+    getAriaLabel(): string;
+    /**
+     * Dispatches a custom event on the container element.
+     * @param {string} type The event type (e.g., "resizer:start", "resizer:update", "resizer:end").
+     * @param {Object} [data={}] Optional data to attach to the event's detail property.
+     */
+    dispatchEvent(type: string, data?: any): void;
     #private;
 }
 //# sourceMappingURL=resizer.d.ts.map

package/types/ui/resizer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"resizer.d.ts","sourceRoot":"","sources":["../../js/ui/resizer.js"],"names":[],"mappings":"AAOA;IACE;;QAEE;;WAEG;;QAEH;;WAEG;;QAEH;;;;;WAKG;eAJO,MAAM,GAAC,OAAO,GAAC,IAAI;QAM7B;;;;;WAKG;eAJO,KAAK,GAAC,QAAQ,GAAC,IAAI;MAM7B;IAKF;;;;;;;;OAQG;IACH,uBARW,IAAI,WACJ,IAAI;QAEa,KAAK;QACL,qBAAqB;QACR,KAAK,GAAnC,MAAM,GAAC,OAAO,GAAC,IAAI;QACW,KAAK,GAAnC,KAAK,GAAC,QAAQ,GAAC,IAAI;OA2C7B;IApCC,aAA2D;IAG3D,gBAA0B;IAC1B,cAAsB;IACtB,WAA+B;IAuB/B,0BAAmD;IACnD,wBAAiD;IASnD;;OAEG;IACH,gBAEC;IAmHD,0CAEC;;CACF"}
+{"version":3,"file":"resizer.d.ts","sourceRoot":"","sources":["../../js/ui/resizer.js"],"names":[],"mappings":"AAUA;;GAEG;AACH;IACE;;QAEE;;WAEG;;QAEH;;WAEG;;QAEH;;;;;WAKG;eAJO,MAAM,GAAC,OAAO,GAAC,IAAI;QAM7B;;;;;WAKG;eAJO,KAAK,GAAC,QAAQ,GAAC,IAAI;QAM7B;;WAEG;;QAEH;;WAEG;;QAEH;;;;;;WAMG;;QAEH;;;;;WAKG;;QAEH;;;WAGG;;QAEH;;;WAGG;;MAEH;IAaF;;;;;;;;;;;;;;;OAeG;IACH,uBAfW,IAAI,WACJ,WAAW;QAEM,KAAK;QACL,UAAU;QACV,qBAAqB;QACT,KAAK,GAAlC,MAAM,GAAC,OAAO,GAAC,IAAI;QACU,KAAK,GAAlC,KAAK,GAAC,QAAQ,GAAC,IAAI;QACH,YAAY,GAA5B,MAAM;QACU,oBAAoB,GAApC,MAAM;QACW,YAAY,GAA7B,OAAO;QACU,eAAe,GAAhC,OAAO;QACU,qBAAqB,GAAtC,OAAO;QACU,sBAAsB,GAAvC,OAAO;OAmDjB;IA3CC,aAAsB;IACtB,gBAA0B;IAC1B,qBAAsB;IACtB,WAA0B;IAmB1B,0BAA8C;IAC9C,wBAA4C;IAqC9C;;OAEG;IACH,gBAsBC;IAwGD;;;;OAIG;IACH,iBAFW,YAAY,QAyCtB;IAED;;;;OAIG;IACH,aAFW,aAAa,QA4DvB;IAED;;;;OAIG;IACH,gBAFa,MAAM,CAYlB;IAED;;;;OAIG;IACH,oBAHW,MAAM,oBAKhB;;CACF"}