From 869386ee234a99dd2638b7d8bac955d57dd40993 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andre=CC=81=20Abt?= Date: Mon, 1 Jul 2024 14:04:27 +0200 Subject: [PATCH 1/5] Export typescript definitions --- packages/child/index.d.ts | 7 +++---- packages/parent/index.d.ts | 17 ++++++++--------- 2 files changed, 11 insertions(+), 13 deletions(-) diff --git a/packages/child/index.d.ts b/packages/child/index.d.ts index 475a57dea..aa990dff3 100644 --- a/packages/child/index.d.ts +++ b/packages/child/index.d.ts @@ -11,7 +11,7 @@ declare module '@iframe-resizer/child' { namespace iframeResizer { // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFramePageOptions { + export interface IFramePageOptions { /** * This option allows you to restrict the domain of the parent page, * to prevent other sites mimicking your parent page. @@ -30,7 +30,7 @@ declare module '@iframe-resizer/child' { } // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFramePage { + export interface IFramePage { /** * Turn autoResizing of the iFrame on and off. Returns bool of current state. */ @@ -89,7 +89,7 @@ declare module '@iframe-resizer/child' { size(customHeight?: string, customWidth?: string): void } - interface ParentProps { + export interface ParentProps { /** * The values returned by iframe.getBoundingClientRect() */ @@ -133,5 +133,4 @@ declare module '@iframe-resizer/child' { parentIFrame: iframeResizer.IFramePage } } - } diff --git a/packages/parent/index.d.ts b/packages/parent/index.d.ts index 4348a8226..3a606766a 100644 --- a/packages/parent/index.d.ts +++ b/packages/parent/index.d.ts @@ -9,10 +9,9 @@ */ declare module '@iframe-resizer/parent' { - namespace iframeResizer { // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFrameObject { + export interface IFrameObject { close(): void moveToAnchor(anchor: string): void @@ -25,12 +24,12 @@ declare module '@iframe-resizer/parent' { } // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFrameComponent extends HTMLIFrameElement { + export interface IFrameComponent extends HTMLIFrameElement { iFrameResizer: IFrameObject } // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFrameOptions { + export interface IFrameOptions { /** * Override the body background style in the iFrame. */ @@ -139,7 +138,7 @@ declare module '@iframe-resizer/parent' { } // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFrameMouseData { + export interface IFrameMouseData { iframe: IFrameComponent height: number width: number @@ -147,7 +146,7 @@ declare module '@iframe-resizer/parent' { } // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFrameResizedData { + export interface IFrameResizedData { iframe: IFrameComponent height: number width: number @@ -155,13 +154,13 @@ declare module '@iframe-resizer/parent' { } // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFrameMessageData { + export interface IFrameMessageData { iframe: IFrameComponent message: any } // eslint-disable-next-line @typescript-eslint/naming-convention - interface IFrameScrollData { + export interface IFrameScrollData { x: number y: number } @@ -178,5 +177,5 @@ declare module '@iframe-resizer/parent' { target: string | HTMLElement, ): iframeResizer.IFrameComponent[] - export default iframeResize; + export default iframeResize } From fd4076ca5c1f9bd252bb5d5367552f83e6a903ed Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andre=CC=81=20Abt?= Date: Mon, 1 Jul 2024 20:36:27 +0200 Subject: [PATCH 2/5] Remove unused namespaces --- packages/child/index.d.ts | 220 +++++++++++++------------ packages/parent/index.d.ts | 318 ++++++++++++++++++------------------- 2 files changed, 264 insertions(+), 274 deletions(-) diff --git a/packages/child/index.d.ts b/packages/child/index.d.ts index aa990dff3..28b75aea0 100644 --- a/packages/child/index.d.ts +++ b/packages/child/index.d.ts @@ -9,121 +9,119 @@ */ declare module '@iframe-resizer/child' { - namespace iframeResizer { - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFramePageOptions { - /** - * This option allows you to restrict the domain of the parent page, - * to prevent other sites mimicking your parent page. - */ - targetOrigin?: string | undefined - - /** - * Receive message posted from the parent page with the iframe.iFrameResizer.sendMessage() method. - */ - onMessage?(message: any): void - - /** - * This function is called once iFrame-Resizer has been initialized after receiving a call from the parent page. - */ - onReady?(): void + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFramePageOptions { + /** + * This option allows you to restrict the domain of the parent page, + * to prevent other sites mimicking your parent page. + */ + targetOrigin?: string | undefined + + /** + * Receive message posted from the parent page with the iframe.iFrameResizer.sendMessage() method. + */ + onMessage?(message: any): void + + /** + * This function is called once iFrame-Resizer has been initialized after receiving a call from the parent page. + */ + onReady?(): void + } + + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFramePage { + /** + * Turn autoResizing of the iFrame on and off. Returns bool of current state. + */ + autoResize(resize?: boolean): boolean + + /** + * Remove the iFrame from the parent page. + */ + close(): void + + /** + * Returns the ID of the iFrame that the page is contained in. + */ + getId(): string + + /** + * Ask the containing page for its positioning coordinates. + * + * Your callback function will be recalled when the parent page is scrolled or resized. + * + * Pass false to disable the callback. + */ + getParentProps(callback: (data: ParentProps) => void): void + + /** + * Scroll the parent page by x and y + */ + scrollBy(x: number, y: number): void + + /** + * Scroll the parent page to the coordinates x and y + */ + scrollTo(x: number, y: number): void + + /** + * Scroll the parent page to the coordinates x and y relative to the position of the iFrame. + */ + scrollToOffset(x: number, y: number): void + + /** + * Send data to the containing page, message can be any data type that can be serialized into JSON. The `targetOrigin` + * option is used to restrict where the message is sent to; to stop an attacker mimicking your parent page. + * See the MDN documentation on postMessage for more details. + */ + sendMessage(message: any, targetOrigin?: string): void + + /** + * Set default target origin. + */ + setTargetOrigin(targetOrigin: string): void + + /** + * Manually force iFrame to resize. To use passed arguments you need first to disable the `autoResize` option to + * prevent auto resizing and enable the `sizeWidth` option if you wish to set the width. + */ + size(customHeight?: string, customWidth?: string): void + } + + export interface ParentProps { + /** + * The values returned by iframe.getBoundingClientRect() + */ + iframe: { + x: number + y: number + width: number + height: number + top: number + right: number + bottom: number + left: number } - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFramePage { - /** - * Turn autoResizing of the iFrame on and off. Returns bool of current state. - */ - autoResize(resize?: boolean): boolean - - /** - * Remove the iFrame from the parent page. - */ - close(): void - - /** - * Returns the ID of the iFrame that the page is contained in. - */ - getId(): string - - /** - * Ask the containing page for its positioning coordinates. - * - * Your callback function will be recalled when the parent page is scrolled or resized. - * - * Pass false to disable the callback. - */ - getParentProps(callback: (data: ParentProps) => void): void - - /** - * Scroll the parent page by x and y - */ - scrollBy(x: number, y: number): void - - /** - * Scroll the parent page to the coordinates x and y - */ - scrollTo(x: number, y: number): void - - /** - * Scroll the parent page to the coordinates x and y relative to the position of the iFrame. - */ - scrollToOffset(x: number, y: number): void - - /** - * Send data to the containing page, message can be any data type that can be serialized into JSON. The `targetOrigin` - * option is used to restrict where the message is sent to; to stop an attacker mimicking your parent page. - * See the MDN documentation on postMessage for more details. - */ - sendMessage(message: any, targetOrigin?: string): void - - /** - * Set default target origin. - */ - setTargetOrigin(targetOrigin: string): void - - /** - * Manually force iFrame to resize. To use passed arguments you need first to disable the `autoResize` option to - * prevent auto resizing and enable the `sizeWidth` option if you wish to set the width. - */ - size(customHeight?: string, customWidth?: string): void + /** + * The values returned by document.documentElement.scrollWidth and document.documentElement.scrollHeight + */ + document: { + scrollWidth: number + scrollHeight: number } - export interface ParentProps { - /** - * The values returned by iframe.getBoundingClientRect() - */ - iframe: { - x: number - y: number - width: number - height: number - top: number - right: number - bottom: number - left: number - } - - /** - * The values returned by document.documentElement.scrollWidth and document.documentElement.scrollHeight - */ - document: { - scrollWidth: number - scrollHeight: number - } - - /** - * The values returned by window.visualViewport - */ - viewport: { - width: number - height: number - offsetLeft: number - offsetTop: number - pageLeft: number - pageTop: number - scale: number - } + /** + * The values returned by window.visualViewport + */ + viewport: { + width: number + height: number + offsetLeft: number + offsetTop: number + pageLeft: number + pageTop: number + scale: number } } diff --git a/packages/parent/index.d.ts b/packages/parent/index.d.ts index 3a606766a..6a6e0b24e 100644 --- a/packages/parent/index.d.ts +++ b/packages/parent/index.d.ts @@ -9,173 +9,165 @@ */ declare module '@iframe-resizer/parent' { - namespace iframeResizer { - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameObject { - close(): void - - moveToAnchor(anchor: string): void - - removeListeners(): void - - resize(): void - - sendMessage(message: any, targetOrigin?: string): void - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameComponent extends HTMLIFrameElement { - iFrameResizer: IFrameObject - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameOptions { - /** - * Override the body background style in the iFrame. - */ - bodyBackground?: string | undefined - - /** - * Override the default body margin style in the iFrame. A string can be any valid value for the - * CSS margin attribute, for example '8px 3em'. A number value is converted into px. - */ - bodyMargin?: number | string | undefined - - /** - * Override the default body padding style in the iFrame. A string can be any valid value for the - * CSS margin attribute, for example '8px 3em'. A number value is converted into px. - */ - bodyPadding?: number | string | undefined - - /** - * When set to true, only allow incoming messages from the domain listed in the src property of the iFrame tag. - * If your iFrame navigates between different domains, ports or protocols; then you will need to - * provide an array of URLs or disable this option. - */ - checkOrigin?: boolean | string[] | undefined - - /** - * Set the reszing direction of the iframe. - */ - direction?: 'vertical' | 'horizontal' | 'none' | undefined - - /** - * When enabled in page linking inside the iFrame and from the iFrame to the parent page will be enabled. - */ - inPageLinks?: boolean | undefined - - /** - * Set iFrame-resizer license. - */ - license: string - /** - * Set offset height of iFrame content. - */ - offsetHeight?: number | undefined - - /** - * Set offset width of iFrame content. - */ - offsetWidth?: number | undefined - - /** - * Enable scroll bars in iFrame. - */ - scrolling?: boolean | 'auto' | undefined - - /** - * Set the number of pixels the iFrame content size has to change by, before triggering a resize of the iFrame. - */ - tolerance?: number | undefined - - waitForLoad?: boolean | undefined - - warningTimeout?: number | undefined - - /** - * Called before iFrame is closed via parentIFrame.close() or iframe.iFrameResizer.close() methods. Returning false will prevent the iFrame from closing. - */ - onClosed?(iframeId: string): void - - /** - * Called when iFrame is closed via parentIFrame.close() or iframe.iframeResizer.close() methods. - */ - onClosed?(iframeId: string): void - - /** - * Called when pointer enters the iFrame. - */ - onMouseEnter?(data: IFrameMouseData): void - - /** - * Called when pointer leaves the iFrame. - */ - onMouseLeave?(data: IFrameMouseData): void - - /** - * Initial setup callback function. - */ - onReady?(iframe: IFrameComponent): void - - /** - * Receive message posted from iFrame with the parentIFrame.sendMessage() method. - */ - onMessage?(data: IFrameMessageData): void - - /** - * Function called after iFrame resized. Passes in messageData object containing the iFrame, height, width - * and the type of event that triggered the iFrame to resize. - */ - onResized?(data: IFrameResizedData): void - - /** - * Called before the page is repositioned after a request from the iFrame, due to either an in page link, - * or a direct request from either parentIFrame.scrollTo() or parentIFrame.scrollToOffset(). - * If this callback function returns false, it will stop the library from repositioning the page, so that - * you can implement your own animated page scrolling instead. - */ - onScroll?(data: IFrameScrollData): boolean - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameMouseData { - iframe: IFrameComponent - height: number - width: number - type: string - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameResizedData { - iframe: IFrameComponent - height: number - width: number - type: string - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameMessageData { - iframe: IFrameComponent - message: any - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameScrollData { - x: number - y: number - } - - function iframeResize( - options: IFrameOptions, - target: string | HTMLElement, - ): IFrameComponent[] + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFrameObject { + close(): void + + moveToAnchor(anchor: string): void + + removeListeners(): void + + resize(): void + + sendMessage(message: any, targetOrigin?: string): void + } + + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFrameComponent extends HTMLIFrameElement { + iFrameResizer: IFrameObject + } + + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFrameOptions { + /** + * Override the body background style in the iFrame. + */ + bodyBackground?: string | undefined + + /** + * Override the default body margin style in the iFrame. A string can be any valid value for the + * CSS margin attribute, for example '8px 3em'. A number value is converted into px. + */ + bodyMargin?: number | string | undefined + + /** + * Override the default body padding style in the iFrame. A string can be any valid value for the + * CSS margin attribute, for example '8px 3em'. A number value is converted into px. + */ + bodyPadding?: number | string | undefined + + /** + * When set to true, only allow incoming messages from the domain listed in the src property of the iFrame tag. + * If your iFrame navigates between different domains, ports or protocols; then you will need to + * provide an array of URLs or disable this option. + */ + checkOrigin?: boolean | string[] | undefined + + /** + * Set the reszing direction of the iframe. + */ + direction?: 'vertical' | 'horizontal' | 'none' | undefined + + /** + * When enabled in page linking inside the iFrame and from the iFrame to the parent page will be enabled. + */ + inPageLinks?: boolean | undefined + + /** + * Set iFrame-resizer license. + */ + license: string + /** + * Set offset height of iFrame content. + */ + offsetHeight?: number | undefined + + /** + * Set offset width of iFrame content. + */ + offsetWidth?: number | undefined + + /** + * Enable scroll bars in iFrame. + */ + scrolling?: boolean | 'auto' | undefined + + /** + * Set the number of pixels the iFrame content size has to change by, before triggering a resize of the iFrame. + */ + tolerance?: number | undefined + + waitForLoad?: boolean | undefined + + warningTimeout?: number | undefined + + /** + * Called before iFrame is closed via parentIFrame.close() or iframe.iFrameResizer.close() methods. Returning false will prevent the iFrame from closing. + */ + onClosed?(iframeId: string): void + + /** + * Called when iFrame is closed via parentIFrame.close() or iframe.iframeResizer.close() methods. + */ + onClosed?(iframeId: string): void + + /** + * Called when pointer enters the iFrame. + */ + onMouseEnter?(data: IFrameMouseData): void + + /** + * Called when pointer leaves the iFrame. + */ + onMouseLeave?(data: IFrameMouseData): void + + /** + * Initial setup callback function. + */ + onReady?(iframe: IFrameComponent): void + + /** + * Receive message posted from iFrame with the parentIFrame.sendMessage() method. + */ + onMessage?(data: IFrameMessageData): void + + /** + * Function called after iFrame resized. Passes in messageData object containing the iFrame, height, width + * and the type of event that triggered the iFrame to resize. + */ + onResized?(data: IFrameResizedData): void + + /** + * Called before the page is repositioned after a request from the iFrame, due to either an in page link, + * or a direct request from either parentIFrame.scrollTo() or parentIFrame.scrollToOffset(). + * If this callback function returns false, it will stop the library from repositioning the page, so that + * you can implement your own animated page scrolling instead. + */ + onScroll?(data: IFrameScrollData): boolean + } + + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFrameMouseData { + iframe: IFrameComponent + height: number + width: number + type: string + } + + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFrameResizedData { + iframe: IFrameComponent + height: number + width: number + type: string + } + + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFrameMessageData { + iframe: IFrameComponent + message: any + } + + // eslint-disable-next-line @typescript-eslint/naming-convention + export interface IFrameScrollData { + x: number + y: number } - // leave this declaration outside the namespace so the 'require'd import is still callable function iframeResize( - options: iframeResizer.IFrameOptions, + options: IFrameOptions, target: string | HTMLElement, - ): iframeResizer.IFrameComponent[] + ): IFrameComponent[] export default iframeResize } From b4d04f94306a27a19917ecb949015f9f4e4c0eaa Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andre=CC=81=20Abt?= Date: Mon, 1 Jul 2024 21:20:28 +0200 Subject: [PATCH 3/5] Fix types --- packages/child/index.d.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/child/index.d.ts b/packages/child/index.d.ts index 28b75aea0..ae4a1453d 100644 --- a/packages/child/index.d.ts +++ b/packages/child/index.d.ts @@ -127,8 +127,8 @@ declare module '@iframe-resizer/child' { global { interface Window { - iFrameResizer: iframeResizer.IFramePageOptions - parentIFrame: iframeResizer.IFramePage + iFrameResizer: IFramePageOptions + parentIFrame: IFramePage } } } From 043d3c96c2b688bfeab0ca86a53937c75e547cab Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andre=CC=81=20Abt?= Date: Mon, 1 Jul 2024 21:23:43 +0200 Subject: [PATCH 4/5] Remove namespace for React module --- packages/react/index.d.ts | 96 +++++++++++++++++++-------------------- 1 file changed, 46 insertions(+), 50 deletions(-) diff --git a/packages/react/index.d.ts b/packages/react/index.d.ts index 985525b3c..093c25fa7 100644 --- a/packages/react/index.d.ts +++ b/packages/react/index.d.ts @@ -7,62 +7,58 @@ declare module '@iframe-resizer/react' { import * as React from 'react' - namespace IframeResizer { - type IFrameObject = { - moveToAnchor: (anchor: string) => void - resize: () => void - sendMessage: (message: string, targetOrigin?: string) => void - } - - interface IFrameComponent extends HTMLIFrameElement { - iFrameResizer: IFrameObject - } + export type IFrameObject = { + moveToAnchor: (anchor: string) => void + resize: () => void + sendMessage: (message: string, targetOrigin?: string) => void + } - type IFrameForwardRef = Omit & { - getElement: () => IFrameComponent - getRef: () => any - } + export interface IFrameComponent extends HTMLIFrameElement { + iFrameResizer: IFrameObject + } - type IframeProps = React.DetailedHTMLProps< - React.IframeHTMLAttributes, - HTMLIFrameElement - > + export type IFrameForwardRef = Omit & { + getElement: () => IFrameComponent + getRef: () => any + } - type ResizerOptions = { - bodyBackground?: string | null - bodyMargin?: string | number | null - bodyPadding?: string | number | null - checkOrigin?: boolean | string[] - direction?: 'vertical' | 'horizontal' | 'none' - forwardRef?: any - inPageLinks?: boolean - license: string - offset?: number - scrolling?: boolean | 'omit' - tolerance?: number - warningTimeout?: number - } + export type IframeProps = React.DetailedHTMLProps< + React.IframeHTMLAttributes, + HTMLIFrameElement + > - type ResizerEvents = { - onInit?: (iframe: IFrameComponent) => void - onMessage?: (ev: { iframe: IFrameComponent; message: any }) => void - onResized?: (ev: { - iframe: IFrameComponent - height: number - width: number - type: string - }) => void - onScroll?: (ev: { x: number; y: number }) => boolean - } + export type ResizerOptions = { + bodyBackground?: string | null + bodyMargin?: string | number | null + bodyPadding?: string | number | null + checkOrigin?: boolean | string[] + direction?: 'vertical' | 'horizontal' | 'none' + forwardRef?: any + inPageLinks?: boolean + license: string + offset?: number + scrolling?: boolean | 'omit' + tolerance?: number + warningTimeout?: number + } - type IframeResizerProps = Omit & - ResizerOptions & - ResizerEvents + export type ResizerEvents = { + onInit?: (iframe: IFrameComponent) => void + onMessage?: (ev: { iframe: IFrameComponent; message: any }) => void + onResized?: (ev: { + iframe: IFrameComponent + height: number + width: number + type: string + }) => void + onScroll?: (ev: { x: number; y: number }) => boolean } - function IframeResizer( - props: IframeResizer.IframeResizerProps, - ): React.ReactElement + export type IframeResizerProps = Omit & + ResizerOptions & + ResizerEvents + + function IframeResizer(props: IframeResizerProps): React.ReactElement - export = IframeResizer + export default IframeResizer } From f48823b18a5772400482d543010fdc43d9937d92 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andre=CC=81=20Abt?= Date: Wed, 3 Jul 2024 10:37:33 +0200 Subject: [PATCH 5/5] Remove unnecessary module declarations --- packages/child/index.d.ts | 230 +++++++++++++------------- packages/parent/index.d.ts | 322 ++++++++++++++++++------------------- packages/react/index.d.ts | 98 ++++++----- 3 files changed, 322 insertions(+), 328 deletions(-) diff --git a/packages/child/index.d.ts b/packages/child/index.d.ts index ae4a1453d..9371c7ae8 100644 --- a/packages/child/index.d.ts +++ b/packages/child/index.d.ts @@ -8,127 +8,125 @@ * I'm not a TypeScript dev, so please feel free to submit PRs to improve this file. */ -declare module '@iframe-resizer/child' { - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFramePageOptions { - /** - * This option allows you to restrict the domain of the parent page, - * to prevent other sites mimicking your parent page. - */ - targetOrigin?: string | undefined - - /** - * Receive message posted from the parent page with the iframe.iFrameResizer.sendMessage() method. - */ - onMessage?(message: any): void - - /** - * This function is called once iFrame-Resizer has been initialized after receiving a call from the parent page. - */ - onReady?(): void +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFramePageOptions { + /** + * This option allows you to restrict the domain of the parent page, + * to prevent other sites mimicking your parent page. + */ + targetOrigin?: string | undefined + + /** + * Receive message posted from the parent page with the iframe.iFrameResizer.sendMessage() method. + */ + onMessage?(message: any): void + + /** + * This function is called once iFrame-Resizer has been initialized after receiving a call from the parent page. + */ + onReady?(): void +} + +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFramePage { + /** + * Turn autoResizing of the iFrame on and off. Returns bool of current state. + */ + autoResize(resize?: boolean): boolean + + /** + * Remove the iFrame from the parent page. + */ + close(): void + + /** + * Returns the ID of the iFrame that the page is contained in. + */ + getId(): string + + /** + * Ask the containing page for its positioning coordinates. + * + * Your callback function will be recalled when the parent page is scrolled or resized. + * + * Pass false to disable the callback. + */ + getParentProps(callback: (data: ParentProps) => void): void + + /** + * Scroll the parent page by x and y + */ + scrollBy(x: number, y: number): void + + /** + * Scroll the parent page to the coordinates x and y + */ + scrollTo(x: number, y: number): void + + /** + * Scroll the parent page to the coordinates x and y relative to the position of the iFrame. + */ + scrollToOffset(x: number, y: number): void + + /** + * Send data to the containing page, message can be any data type that can be serialized into JSON. The `targetOrigin` + * option is used to restrict where the message is sent to; to stop an attacker mimicking your parent page. + * See the MDN documentation on postMessage for more details. + */ + sendMessage(message: any, targetOrigin?: string): void + + /** + * Set default target origin. + */ + setTargetOrigin(targetOrigin: string): void + + /** + * Manually force iFrame to resize. To use passed arguments you need first to disable the `autoResize` option to + * prevent auto resizing and enable the `sizeWidth` option if you wish to set the width. + */ + size(customHeight?: string, customWidth?: string): void +} + +export interface ParentProps { + /** + * The values returned by iframe.getBoundingClientRect() + */ + iframe: { + x: number + y: number + width: number + height: number + top: number + right: number + bottom: number + left: number } - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFramePage { - /** - * Turn autoResizing of the iFrame on and off. Returns bool of current state. - */ - autoResize(resize?: boolean): boolean - - /** - * Remove the iFrame from the parent page. - */ - close(): void - - /** - * Returns the ID of the iFrame that the page is contained in. - */ - getId(): string - - /** - * Ask the containing page for its positioning coordinates. - * - * Your callback function will be recalled when the parent page is scrolled or resized. - * - * Pass false to disable the callback. - */ - getParentProps(callback: (data: ParentProps) => void): void - - /** - * Scroll the parent page by x and y - */ - scrollBy(x: number, y: number): void - - /** - * Scroll the parent page to the coordinates x and y - */ - scrollTo(x: number, y: number): void - - /** - * Scroll the parent page to the coordinates x and y relative to the position of the iFrame. - */ - scrollToOffset(x: number, y: number): void - - /** - * Send data to the containing page, message can be any data type that can be serialized into JSON. The `targetOrigin` - * option is used to restrict where the message is sent to; to stop an attacker mimicking your parent page. - * See the MDN documentation on postMessage for more details. - */ - sendMessage(message: any, targetOrigin?: string): void - - /** - * Set default target origin. - */ - setTargetOrigin(targetOrigin: string): void - - /** - * Manually force iFrame to resize. To use passed arguments you need first to disable the `autoResize` option to - * prevent auto resizing and enable the `sizeWidth` option if you wish to set the width. - */ - size(customHeight?: string, customWidth?: string): void + /** + * The values returned by document.documentElement.scrollWidth and document.documentElement.scrollHeight + */ + document: { + scrollWidth: number + scrollHeight: number } - export interface ParentProps { - /** - * The values returned by iframe.getBoundingClientRect() - */ - iframe: { - x: number - y: number - width: number - height: number - top: number - right: number - bottom: number - left: number - } - - /** - * The values returned by document.documentElement.scrollWidth and document.documentElement.scrollHeight - */ - document: { - scrollWidth: number - scrollHeight: number - } - - /** - * The values returned by window.visualViewport - */ - viewport: { - width: number - height: number - offsetLeft: number - offsetTop: number - pageLeft: number - pageTop: number - scale: number - } + /** + * The values returned by window.visualViewport + */ + viewport: { + width: number + height: number + offsetLeft: number + offsetTop: number + pageLeft: number + pageTop: number + scale: number } +} - global { - interface Window { - iFrameResizer: IFramePageOptions - parentIFrame: IFramePage - } +declare global { + interface Window { + iFrameResizer: IFramePageOptions + parentIFrame: IFramePage } } diff --git a/packages/parent/index.d.ts b/packages/parent/index.d.ts index 6a6e0b24e..cf41a5df2 100644 --- a/packages/parent/index.d.ts +++ b/packages/parent/index.d.ts @@ -8,166 +8,164 @@ * I'm not a TypeScript dev, so please feel free to submit PRs to improve this file. */ -declare module '@iframe-resizer/parent' { - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameObject { - close(): void - - moveToAnchor(anchor: string): void - - removeListeners(): void - - resize(): void - - sendMessage(message: any, targetOrigin?: string): void - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameComponent extends HTMLIFrameElement { - iFrameResizer: IFrameObject - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameOptions { - /** - * Override the body background style in the iFrame. - */ - bodyBackground?: string | undefined - - /** - * Override the default body margin style in the iFrame. A string can be any valid value for the - * CSS margin attribute, for example '8px 3em'. A number value is converted into px. - */ - bodyMargin?: number | string | undefined - - /** - * Override the default body padding style in the iFrame. A string can be any valid value for the - * CSS margin attribute, for example '8px 3em'. A number value is converted into px. - */ - bodyPadding?: number | string | undefined - - /** - * When set to true, only allow incoming messages from the domain listed in the src property of the iFrame tag. - * If your iFrame navigates between different domains, ports or protocols; then you will need to - * provide an array of URLs or disable this option. - */ - checkOrigin?: boolean | string[] | undefined - - /** - * Set the reszing direction of the iframe. - */ - direction?: 'vertical' | 'horizontal' | 'none' | undefined - - /** - * When enabled in page linking inside the iFrame and from the iFrame to the parent page will be enabled. - */ - inPageLinks?: boolean | undefined - - /** - * Set iFrame-resizer license. - */ - license: string - /** - * Set offset height of iFrame content. - */ - offsetHeight?: number | undefined - - /** - * Set offset width of iFrame content. - */ - offsetWidth?: number | undefined - - /** - * Enable scroll bars in iFrame. - */ - scrolling?: boolean | 'auto' | undefined - - /** - * Set the number of pixels the iFrame content size has to change by, before triggering a resize of the iFrame. - */ - tolerance?: number | undefined - - waitForLoad?: boolean | undefined - - warningTimeout?: number | undefined - - /** - * Called before iFrame is closed via parentIFrame.close() or iframe.iFrameResizer.close() methods. Returning false will prevent the iFrame from closing. - */ - onClosed?(iframeId: string): void - - /** - * Called when iFrame is closed via parentIFrame.close() or iframe.iframeResizer.close() methods. - */ - onClosed?(iframeId: string): void - - /** - * Called when pointer enters the iFrame. - */ - onMouseEnter?(data: IFrameMouseData): void - - /** - * Called when pointer leaves the iFrame. - */ - onMouseLeave?(data: IFrameMouseData): void - - /** - * Initial setup callback function. - */ - onReady?(iframe: IFrameComponent): void - - /** - * Receive message posted from iFrame with the parentIFrame.sendMessage() method. - */ - onMessage?(data: IFrameMessageData): void - - /** - * Function called after iFrame resized. Passes in messageData object containing the iFrame, height, width - * and the type of event that triggered the iFrame to resize. - */ - onResized?(data: IFrameResizedData): void - - /** - * Called before the page is repositioned after a request from the iFrame, due to either an in page link, - * or a direct request from either parentIFrame.scrollTo() or parentIFrame.scrollToOffset(). - * If this callback function returns false, it will stop the library from repositioning the page, so that - * you can implement your own animated page scrolling instead. - */ - onScroll?(data: IFrameScrollData): boolean - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameMouseData { - iframe: IFrameComponent - height: number - width: number - type: string - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameResizedData { - iframe: IFrameComponent - height: number - width: number - type: string - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameMessageData { - iframe: IFrameComponent - message: any - } - - // eslint-disable-next-line @typescript-eslint/naming-convention - export interface IFrameScrollData { - x: number - y: number - } - - function iframeResize( - options: IFrameOptions, - target: string | HTMLElement, - ): IFrameComponent[] - - export default iframeResize +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFrameObject { + close(): void + + moveToAnchor(anchor: string): void + + removeListeners(): void + + resize(): void + + sendMessage(message: any, targetOrigin?: string): void +} + +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFrameComponent extends HTMLIFrameElement { + iFrameResizer: IFrameObject +} + +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFrameOptions { + /** + * Override the body background style in the iFrame. + */ + bodyBackground?: string | undefined + + /** + * Override the default body margin style in the iFrame. A string can be any valid value for the + * CSS margin attribute, for example '8px 3em'. A number value is converted into px. + */ + bodyMargin?: number | string | undefined + + /** + * Override the default body padding style in the iFrame. A string can be any valid value for the + * CSS margin attribute, for example '8px 3em'. A number value is converted into px. + */ + bodyPadding?: number | string | undefined + + /** + * When set to true, only allow incoming messages from the domain listed in the src property of the iFrame tag. + * If your iFrame navigates between different domains, ports or protocols; then you will need to + * provide an array of URLs or disable this option. + */ + checkOrigin?: boolean | string[] | undefined + + /** + * Set the reszing direction of the iframe. + */ + direction?: 'vertical' | 'horizontal' | 'none' | undefined + + /** + * When enabled in page linking inside the iFrame and from the iFrame to the parent page will be enabled. + */ + inPageLinks?: boolean | undefined + + /** + * Set iFrame-resizer license. + */ + license: string + /** + * Set offset height of iFrame content. + */ + offsetHeight?: number | undefined + + /** + * Set offset width of iFrame content. + */ + offsetWidth?: number | undefined + + /** + * Enable scroll bars in iFrame. + */ + scrolling?: boolean | 'auto' | undefined + + /** + * Set the number of pixels the iFrame content size has to change by, before triggering a resize of the iFrame. + */ + tolerance?: number | undefined + + waitForLoad?: boolean | undefined + + warningTimeout?: number | undefined + + /** + * Called before iFrame is closed via parentIFrame.close() or iframe.iFrameResizer.close() methods. Returning false will prevent the iFrame from closing. + */ + onClosed?(iframeId: string): void + + /** + * Called when iFrame is closed via parentIFrame.close() or iframe.iframeResizer.close() methods. + */ + onClosed?(iframeId: string): void + + /** + * Called when pointer enters the iFrame. + */ + onMouseEnter?(data: IFrameMouseData): void + + /** + * Called when pointer leaves the iFrame. + */ + onMouseLeave?(data: IFrameMouseData): void + + /** + * Initial setup callback function. + */ + onReady?(iframe: IFrameComponent): void + + /** + * Receive message posted from iFrame with the parentIFrame.sendMessage() method. + */ + onMessage?(data: IFrameMessageData): void + + /** + * Function called after iFrame resized. Passes in messageData object containing the iFrame, height, width + * and the type of event that triggered the iFrame to resize. + */ + onResized?(data: IFrameResizedData): void + + /** + * Called before the page is repositioned after a request from the iFrame, due to either an in page link, + * or a direct request from either parentIFrame.scrollTo() or parentIFrame.scrollToOffset(). + * If this callback function returns false, it will stop the library from repositioning the page, so that + * you can implement your own animated page scrolling instead. + */ + onScroll?(data: IFrameScrollData): boolean +} + +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFrameMouseData { + iframe: IFrameComponent + height: number + width: number + type: string +} + +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFrameResizedData { + iframe: IFrameComponent + height: number + width: number + type: string +} + +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFrameMessageData { + iframe: IFrameComponent + message: any } + +// eslint-disable-next-line @typescript-eslint/naming-convention +export interface IFrameScrollData { + x: number + y: number +} + +declare function iframeResize( + options: IFrameOptions, + target: string | HTMLElement, +): IFrameComponent[] + +export default iframeResize diff --git a/packages/react/index.d.ts b/packages/react/index.d.ts index 093c25fa7..61f83f0b3 100644 --- a/packages/react/index.d.ts +++ b/packages/react/index.d.ts @@ -4,61 +4,59 @@ * I'm not a TypeScript dev, so please feel free to submit PRs to improve this file. */ -declare module '@iframe-resizer/react' { - import * as React from 'react' +import * as React from 'react' - export type IFrameObject = { - moveToAnchor: (anchor: string) => void - resize: () => void - sendMessage: (message: string, targetOrigin?: string) => void - } - - export interface IFrameComponent extends HTMLIFrameElement { - iFrameResizer: IFrameObject - } +export type IFrameObject = { + moveToAnchor: (anchor: string) => void + resize: () => void + sendMessage: (message: string, targetOrigin?: string) => void +} - export type IFrameForwardRef = Omit & { - getElement: () => IFrameComponent - getRef: () => any - } +export interface IFrameComponent extends HTMLIFrameElement { + iFrameResizer: IFrameObject +} - export type IframeProps = React.DetailedHTMLProps< - React.IframeHTMLAttributes, - HTMLIFrameElement - > +export type IFrameForwardRef = Omit & { + getElement: () => IFrameComponent + getRef: () => any +} - export type ResizerOptions = { - bodyBackground?: string | null - bodyMargin?: string | number | null - bodyPadding?: string | number | null - checkOrigin?: boolean | string[] - direction?: 'vertical' | 'horizontal' | 'none' - forwardRef?: any - inPageLinks?: boolean - license: string - offset?: number - scrolling?: boolean | 'omit' - tolerance?: number - warningTimeout?: number - } +export type IframeProps = React.DetailedHTMLProps< + React.IframeHTMLAttributes, + HTMLIFrameElement +> + +export type ResizerOptions = { + bodyBackground?: string | null + bodyMargin?: string | number | null + bodyPadding?: string | number | null + checkOrigin?: boolean | string[] + direction?: 'vertical' | 'horizontal' | 'none' + forwardRef?: any + inPageLinks?: boolean + license: string + offset?: number + scrolling?: boolean | 'omit' + tolerance?: number + warningTimeout?: number +} - export type ResizerEvents = { - onInit?: (iframe: IFrameComponent) => void - onMessage?: (ev: { iframe: IFrameComponent; message: any }) => void - onResized?: (ev: { - iframe: IFrameComponent - height: number - width: number - type: string - }) => void - onScroll?: (ev: { x: number; y: number }) => boolean - } +export type ResizerEvents = { + onInit?: (iframe: IFrameComponent) => void + onMessage?: (ev: { iframe: IFrameComponent; message: any }) => void + onResized?: (ev: { + iframe: IFrameComponent + height: number + width: number + type: string + }) => void + onScroll?: (ev: { x: number; y: number }) => boolean +} - export type IframeResizerProps = Omit & - ResizerOptions & - ResizerEvents +export type IframeResizerProps = Omit & + ResizerOptions & + ResizerEvents - function IframeResizer(props: IframeResizerProps): React.ReactElement +declare function IframeResizer(props: IframeResizerProps): React.ReactElement - export default IframeResizer -} +export default IframeResizer