declare class CropperCanvas extends CropperElement_2 { static $name: string; static $version: string; protected $onPointerDown: EventListener | null; protected $onPointerMove: EventListener | null; protected $onPointerUp: EventListener | null; protected $onWheel: EventListener | null; protected $wheeling: boolean; protected readonly $pointers: Map; protected $style: string; protected $action: string; background: boolean; disabled: boolean; scaleStep: number; themeColor: string; protected static get observedAttributes(): string[]; protected connectedCallback(): void; protected disconnectedCallback(): void; protected $propertyChangedCallback(name: string, oldValue: unknown, newValue: unknown): void; protected $bind(): void; protected $unbind(): void; protected $handlePointerDown(event: Event): void; protected $handlePointerMove(event: Event): void; protected $handlePointerUp(event: Event): void; protected $handleWheel(event: Event): void; /** * Changes the current action to a new one. * @param {string} action The new action. * @returns {CropperCanvas} Returns `this` for chaining. */ $setAction(action: string): this; /** * Generates a real canvas element, with the image draw into if there is one. * @param {object} [options] The available options. * @param {number} [options.width] The width of the canvas. * @param {number} [options.height] The height of the canvas. * @param {Function} [options.beforeDraw] The function called before drawing the image onto the canvas. * @returns {Promise} Returns a promise that resolves to the generated canvas element. */ $toCanvas(options?: { width?: number; height?: number; beforeDraw?: (context: CanvasRenderingContext2D, canvas: HTMLCanvasElement) => void; }): Promise; } declare class CropperElement extends HTMLElement { static $name: string; static $version: string; protected $style?: string; protected $template?: string; protected get $sharedStyle(): string; shadowRootMode: ShadowRootMode; slottable: boolean; themeColor?: string; constructor(); protected static get observedAttributes(): string[]; protected attributeChangedCallback(name: string, oldValue: string, newValue: string): void; protected $propertyChangedCallback(name: string, oldValue: unknown, newValue: unknown): void; protected connectedCallback(): void; protected disconnectedCallback(): void; protected $getTagNameOf(name: string): string; protected $setStyles(properties: Record): this; /** * Outputs the shadow root of the element. * @returns {ShadowRoot} Returns the shadow root. */ $getShadowRoot(): ShadowRoot; /** * Adds styles to the shadow root. * @param {string} styles The styles to add. * @returns {CSSStyleSheet|HTMLStyleElement} Returns the generated style sheet. */ $addStyles(styles: string): CSSStyleSheet | HTMLStyleElement; /** * Dispatches an event at the element. * @param {string} type The name of the event. * @param {*} [detail] The data passed when initializing the event. * @param {CustomEventInit} [options] The other event options. * @returns {boolean} Returns the result value. */ $emit(type: string, detail?: unknown, options?: CustomEventInit): boolean; /** * Defers the callback to be executed after the next DOM update cycle. * @param {Function} [callback] The callback to execute after the next DOM update cycle. * @returns {Promise} A promise that resolves to nothing. */ $nextTick(callback?: () => void): Promise; /** * Defines the constructor as a new custom element. * {@link https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry/define} * @param {string|object} [name] The element name. * @param {object} [options] The element definition options. */ static $define(name?: string | ElementDefinitionOptions, options?: ElementDefinitionOptions): void; } declare class CropperElement_2 extends HTMLElement { static $name: string; static $version: string; protected $style?: string; protected $template?: string; protected get $sharedStyle(): string; shadowRootMode: ShadowRootMode; slottable: boolean; themeColor?: string; constructor(); protected static get observedAttributes(): string[]; protected attributeChangedCallback(name: string, oldValue: string, newValue: string): void; protected $propertyChangedCallback(name: string, oldValue: unknown, newValue: unknown): void; protected connectedCallback(): void; protected disconnectedCallback(): void; protected $getTagNameOf(name: string): string; protected $setStyles(properties: Record): this; /** * Outputs the shadow root of the element. * @returns {ShadowRoot} Returns the shadow root. */ $getShadowRoot(): ShadowRoot; /** * Adds styles to the shadow root. * @param {string} styles The styles to add. * @returns {CSSStyleSheet|HTMLStyleElement} Returns the generated style sheet. */ $addStyles(styles: string): CSSStyleSheet | HTMLStyleElement; /** * Dispatches an event at the element. * @param {string} type The name of the event. * @param {*} [detail] The data passed when initializing the event. * @param {CustomEventInit} [options] The other event options. * @returns {boolean} Returns the result value. */ $emit(type: string, detail?: unknown, options?: CustomEventInit): boolean; /** * Defers the callback to be executed after the next DOM update cycle. * @param {Function} [callback] The callback to execute after the next DOM update cycle. * @returns {Promise} A promise that resolves to nothing. */ $nextTick(callback?: () => void): Promise; /** * Defines the constructor as a new custom element. * {@link https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry/define} * @param {string|object} [name] The element name. * @param {object} [options] The element definition options. */ static $define(name?: string | ElementDefinitionOptions, options?: ElementDefinitionOptions): void; } declare class CropperImage extends CropperElement { static $name: string; static $version: string; protected $matrix: number[]; protected $onLoad: EventListener | null; protected $onCanvasAction: EventListener | null; protected $onCanvasActionEnd: EventListener | null; protected $onCanvasActionStart: EventListener | null; protected $actionStartTarget: EventTarget | null; protected $style: string; readonly $image: HTMLImageElement; initialCenterSize: string; rotatable: boolean; scalable: boolean; skewable: boolean; slottable: boolean; translatable: boolean; alt: string; crossorigin: string; decoding: string; elementtiming: string; fetchpriority: string; loading: string; referrerpolicy: string; sizes: string; src: string; srcset: string; protected set $canvas(element: CropperCanvas); protected get $canvas(): CropperCanvas; protected static get observedAttributes(): string[]; protected attributeChangedCallback(name: string, oldValue: string, newValue: string): void; protected $propertyChangedCallback(name: string, oldValue: unknown, newValue: unknown): void; protected connectedCallback(): void; protected disconnectedCallback(): void; protected $handleLoad(): void; protected $handleAction(event: Event | CustomEvent): void; /** * Defers the callback to execute after successfully loading the image. * @param {Function} [callback] The callback to execute after successfully loading the image. * @returns {Promise} Returns a promise that resolves to the image element. */ $ready(callback?: (image: HTMLImageElement) => unknown): Promise; /** * Aligns the image to the center of its parent element. * @param {string} [size] The size of the image. * @returns {CropperImage} Returns `this` for chaining. */ $center(size?: string): this; /** * Moves the image. * @param {number} x The moving distance in the horizontal direction. * @param {number} [y] The moving distance in the vertical direction. * @returns {CropperImage} Returns `this` for chaining. */ $move(x: number, y?: number): this; /** * Moves the image to a specific position. * @param {number} x The new position in the horizontal direction. * @param {number} [y] The new position in the vertical direction. * @returns {CropperImage} Returns `this` for chaining. */ $moveTo(x: number, y?: number): this; /** * Rotates the image. * {@link https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate} * {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/rotate} * @param {number|string} angle The rotation angle (in radians). * @param {number} [x] The rotation origin in the horizontal, defaults to the center of the image. * @param {number} [y] The rotation origin in the vertical, defaults to the center of the image. * @returns {CropperImage} Returns `this` for chaining. */ $rotate(angle: number | string, x?: number, y?: number): this; /** * Zooms the image. * @param {number} scale The zoom factor. Positive numbers for zooming in, and negative numbers for zooming out. * @param {number} [x] The zoom origin in the horizontal, defaults to the center of the image. * @param {number} [y] The zoom origin in the vertical, defaults to the center of the image. * @returns {CropperImage} Returns `this` for chaining. */ $zoom(scale: number, x?: number, y?: number): this; /** * Scales the image. * {@link https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale} * {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/scale} * @param {number} x The scaling factor in the horizontal direction. * @param {number} [y] The scaling factor in the vertical direction. * @returns {CropperImage} Returns `this` for chaining. */ $scale(x: number, y?: number): this; /** * Skews the image. * {@link https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/skew} * {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/transform} * @param {number|string} x The skewing angle in the horizontal direction. * @param {number|string} [y] The skewing angle in the vertical direction. * @returns {CropperImage} Returns `this` for chaining. */ $skew(x: number | string, y?: number | string): this; /** * Translates the image. * {@link https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translate} * {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/translate} * @param {number} x The translating distance in the horizontal direction. * @param {number} [y] The translating distance in the vertical direction. * @returns {CropperImage} Returns `this` for chaining. */ $translate(x: number, y?: number): this; /** * Transforms the image. * {@link https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/matrix} * {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/transform} * @param {number} a The scaling factor in the horizontal direction. * @param {number} b The skewing angle in the vertical direction. * @param {number} c The skewing angle in the horizontal direction. * @param {number} d The scaling factor in the vertical direction. * @param {number} e The translating distance in the horizontal direction. * @param {number} f The translating distance in the vertical direction. * @returns {CropperImage} Returns `this` for chaining. */ $transform(a: number, b: number, c: number, d: number, e: number, f: number): this; /** * Resets (overrides) the current transform to the specific identity matrix. * {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setTransform} * @param {number|Array} a The scaling factor in the horizontal direction. * @param {number} b The skewing angle in the vertical direction. * @param {number} c The skewing angle in the horizontal direction. * @param {number} d The scaling factor in the vertical direction. * @param {number} e The translating distance in the horizontal direction. * @param {number} f The translating distance in the vertical direction. * @returns {CropperImage} Returns `this` for chaining. */ $setTransform(a: number | number[], b?: number, c?: number, d?: number, e?: number, f?: number): this; /** * Retrieves the current transformation matrix being applied to the element. * {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/getTransform} * @returns {Array} Returns the readonly transformation matrix. */ $getTransform(): number[]; /** * Resets the current transform to the initial identity matrix. * {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/resetTransform} * @returns {CropperImage} Returns `this` for chaining. */ $resetTransform(): this; } export default CropperImage; export { }