From 3cf5e84efc8bc8e10e55622c9f653590f19a2835 Mon Sep 17 00:00:00 2001 From: Rafik El Hadi Houari Date: Mon, 17 May 2021 14:53:07 +0100 Subject: [PATCH 1/7] Add type Alpine The type may be helpful when building plugins in Typescript & just using `window.Alpine` in general --- src/index.ts | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/src/index.ts b/src/index.ts index 278368a..332cac9 100644 --- a/src/index.ts +++ b/src/index.ts @@ -24,6 +24,28 @@ export abstract class AlpineComponent { [key: string]: any; } +export declare type Alpine = { + version: string; + pauseMutationObserver: boolean; + magicProperties: { [name: string]: function }; + ignoreFocusedForValueBinding: boolean; + pauseMutationObserver: boolean; + onComponentInitializeds: Array; + onBeforeComponentInitializeds: Array; + onComponentInitializeds: (callback: function) => void; + onBeforeComponentInitializeds: (callback: function) => void; + listenForNewUninitializedComponentsAtRunTime: () => undefined; + discoverUninitializedComponents: ( + callback: (rootEl: HTMLElement) => void, + el?: HTMLElement = null + ) => void; + discoverComponents: (callback: (rootEl: HTMLElement) => void) => void; + start: () => void; + addMagicProperty(name: string, callback: ($el: HTMLElement) => void); + clone: (component: any, newEl: HTMLElement) => void; +}; + + export function registerComponents(components: { [name: string]: Function }): { [name: string]: ComponentConstructor } { Object.entries(components).forEach(([name, file]) => { component(name, file); From 43b0f2a715ac9d7497ac6d6ed1f604a8488b0491 Mon Sep 17 00:00:00 2001 From: Rafik El Hadi Houari Date: Mon, 17 May 2021 14:54:01 +0100 Subject: [PATCH 2/7] Remove extra whitespace I added --- src/index.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/index.ts b/src/index.ts index 332cac9..e41c933 100644 --- a/src/index.ts +++ b/src/index.ts @@ -45,7 +45,6 @@ export declare type Alpine = { clone: (component: any, newEl: HTMLElement) => void; }; - export function registerComponents(components: { [name: string]: Function }): { [name: string]: ComponentConstructor } { Object.entries(components).forEach(([name, file]) => { component(name, file); From b8f5b461bbd41f91dbb12ebeb406016f0d9cd623 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Samuel=20=C5=A0tancl?= Date: Mon, 17 May 2021 16:25:14 +0200 Subject: [PATCH 3/7] Add a catch-all to Alpine --- src/index.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/index.ts b/src/index.ts index e41c933..1b2d7d0 100644 --- a/src/index.ts +++ b/src/index.ts @@ -43,6 +43,8 @@ export declare type Alpine = { start: () => void; addMagicProperty(name: string, callback: ($el: HTMLElement) => void); clone: (component: any, newEl: HTMLElement) => void; + + [key: string]: any; }; export function registerComponents(components: { [name: string]: Function }): { [name: string]: ComponentConstructor } { From d7d4674b1742eaddb894ae3cafde04b58c24de0c Mon Sep 17 00:00:00 2001 From: Rafik El Hadi Houari Date: Mon, 17 May 2021 16:19:35 +0100 Subject: [PATCH 4/7] Change to CallableFunctions and AlpineComponent --- src/index.ts | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/src/index.ts b/src/index.ts index 1b2d7d0..91d789f 100644 --- a/src/index.ts +++ b/src/index.ts @@ -24,16 +24,16 @@ export abstract class AlpineComponent { [key: string]: any; } -export declare type Alpine = { +declare type Alpine = { version: string; pauseMutationObserver: boolean; - magicProperties: { [name: string]: function }; + magicProperties: { [name: string]: CallableFunction }; ignoreFocusedForValueBinding: boolean; pauseMutationObserver: boolean; onComponentInitializeds: Array; onBeforeComponentInitializeds: Array; - onComponentInitializeds: (callback: function) => void; - onBeforeComponentInitializeds: (callback: function) => void; + onComponentInitializeds: (callback: CallableFunction) => void; + onBeforeComponentInitializeds: (callback: CallableFunction) => void; listenForNewUninitializedComponentsAtRunTime: () => undefined; discoverUninitializedComponents: ( callback: (rootEl: HTMLElement) => void, @@ -42,9 +42,7 @@ export declare type Alpine = { discoverComponents: (callback: (rootEl: HTMLElement) => void) => void; start: () => void; addMagicProperty(name: string, callback: ($el: HTMLElement) => void); - clone: (component: any, newEl: HTMLElement) => void; - - [key: string]: any; + clone: (component: AlpineComponent, newEl: HTMLElement) => void; }; export function registerComponents(components: { [name: string]: Function }): { [name: string]: ComponentConstructor } { From 0913d1eb118f72c8fefd42591ad4a9c5287cd6ca Mon Sep 17 00:00:00 2001 From: Rafik El Hadi Houari Date: Mon, 17 May 2021 16:35:03 +0100 Subject: [PATCH 5/7] Fix typos --- src/index.ts | 13 ++++++------- 1 file changed, 6 insertions(+), 7 deletions(-) diff --git a/src/index.ts b/src/index.ts index 91d789f..290fa07 100644 --- a/src/index.ts +++ b/src/index.ts @@ -29,19 +29,18 @@ declare type Alpine = { pauseMutationObserver: boolean; magicProperties: { [name: string]: CallableFunction }; ignoreFocusedForValueBinding: boolean; - pauseMutationObserver: boolean; - onComponentInitializeds: Array; - onBeforeComponentInitializeds: Array; - onComponentInitializeds: (callback: CallableFunction) => void; - onBeforeComponentInitializeds: (callback: CallableFunction) => void; + onComponentInitializeds: Array; + onBeforeComponentInitializeds: Array; + onComponentInitialized: (callback: CallableFunction) => void; + onBeforeComponentInitialized: (callback: CallableFunction) => void; listenForNewUninitializedComponentsAtRunTime: () => undefined; discoverUninitializedComponents: ( callback: (rootEl: HTMLElement) => void, - el?: HTMLElement = null + el?: HTMLElement, ) => void; discoverComponents: (callback: (rootEl: HTMLElement) => void) => void; start: () => void; - addMagicProperty(name: string, callback: ($el: HTMLElement) => void); + addMagicProperty: (name: string, callback: ($el: HTMLElement) => void) => void; clone: (component: AlpineComponent, newEl: HTMLElement) => void; }; From 87b0feed75f1f13ed9bf45f377e9f400f2f73241 Mon Sep 17 00:00:00 2001 From: Rafik El Hadi Houari Date: Mon, 17 May 2021 16:37:05 +0100 Subject: [PATCH 6/7] Add export for Alpine --- src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.ts b/src/index.ts index 290fa07..23580eb 100644 --- a/src/index.ts +++ b/src/index.ts @@ -24,7 +24,7 @@ export abstract class AlpineComponent { [key: string]: any; } -declare type Alpine = { +export declare type Alpine = { version: string; pauseMutationObserver: boolean; magicProperties: { [name: string]: CallableFunction }; From 2cb79efc5564db392f2f5a0ccb7f3db5afe73176 Mon Sep 17 00:00:00 2001 From: Rafik El Hadi Houari Date: Mon, 17 May 2021 17:12:02 +0100 Subject: [PATCH 7/7] Type callablefunctions and turn type to interface --- src/index.ts | 24 ++++++++++++++++-------- 1 file changed, 16 insertions(+), 8 deletions(-) diff --git a/src/index.ts b/src/index.ts index 23580eb..fcea0ba 100644 --- a/src/index.ts +++ b/src/index.ts @@ -24,15 +24,19 @@ export abstract class AlpineComponent { [key: string]: any; } -export declare type Alpine = { +export interface Alpine { version: string; pauseMutationObserver: boolean; - magicProperties: { [name: string]: CallableFunction }; + magicProperties: { [name: string]: (el: HTMLElement) => void }; ignoreFocusedForValueBinding: boolean; - onComponentInitializeds: Array; - onBeforeComponentInitializeds: Array; - onComponentInitialized: (callback: CallableFunction) => void; - onBeforeComponentInitialized: (callback: CallableFunction) => void; + onComponentInitializeds: Array<(component: AlpineComponent) => void>; + onBeforeComponentInitializeds: Array<(component: AlpineComponent) => void>; + onComponentInitialized: ( + callback: (component: AlpineComponent) => void, + ) => void; + onBeforeComponentInitialized: ( + callback: (component: AlpineComponent) => void, + ) => void; listenForNewUninitializedComponentsAtRunTime: () => undefined; discoverUninitializedComponents: ( callback: (rootEl: HTMLElement) => void, @@ -40,10 +44,14 @@ export declare type Alpine = { ) => void; discoverComponents: (callback: (rootEl: HTMLElement) => void) => void; start: () => void; - addMagicProperty: (name: string, callback: ($el: HTMLElement) => void) => void; + addMagicProperty: ( + name: string, + callback: ($el: HTMLElement) => void, + ) => void; clone: (component: AlpineComponent, newEl: HTMLElement) => void; -}; + [key: string]: any; +} export function registerComponents(components: { [name: string]: Function }): { [name: string]: ComponentConstructor } { Object.entries(components).forEach(([name, file]) => { component(name, file);