@salla.sa/twilight 2.0.217 → 2.0.218

package/types/event/gift.js

@@ -0,0 +1,33 @@
+import baseEvent from './baseEvent';
+
+class GiftEvents extends baseEvent {
+    constructor(parent) {
+        super(parent);
+        this.namespace = 'gift';
+        /**
+         * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+         * it can be override by creating method like:
+         *      codeSent(response){
+         *          //your costume code
+         *          ....
+         *          //then call dispatch to emit other listeners
+         *          return this.dispatch('codeSent', ...arguments);
+         *      }
+         * 💡 namespace 'gift::' will be added dynamically,
+         * so last result will be something like: 'gift::item-added'
+         * all events will be initiated to have three functions, for ex: event "buyingSucceeded" wil be:
+         * 🔸 name: gift::buying-succeeded
+         * 🔸 fire: salla.gift.event.buyingSucceeded(...data)
+         * 🔸 listen: salla.gift.event.onBuyingSucceeded((...data) => salla.log(data))
+         * 🔸 fireWithName: salla.event.emit('gift::buying-succeeded',...data)
+         */
+        this.events = {
+          buyingSucceeded:'buying.succeeded',
+          buyingFailed:'buying.failed',
+        }
+
+        this.after_init();
+    }
+}
+
+export default GiftEvents

package/types/event/infiniteScroll.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @see https://infinite-scroll.com/events.html
+ */
+export default interface InfiniteScrollEvent {
+    onScrollThreshold: (callback: (event: Event) => void) => void;
+    onRequest: (callback: (event: Event, path: string, fetchPromise: Promise<any>) => void) => void;
+    onLoad: (callback: (event: Event, body: Body, path: string, response: Response) => void) => void;
+    onAppend: (callback: (event: Event, body: Body, path: string, items: NodeList, response: Response) => void) => void;
+    onError: (callback: (event: Event, error: Error, path: string, response: Response) => void) => void;
+    onLast: (callback: (event: Event, body: Body, path: string) => void) => void;
+    onHistory: (callback: (event: Event, title: string, path: string) => void) => void;
+}

package/types/event/loyalty.js

@@ -0,0 +1,28 @@
+import baseEvent from './baseEvent';
+
+class LoyaltyEvents extends baseEvent {
+    constructor(parent) {
+        super(parent);
+        this.namespace = 'loyalty';
+        /**
+         * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+         * it can be override by creating method like:
+         *      codeSent(response){
+         *          //your costume code
+         *          ....
+         *          //then call dispatch to emit other listeners
+         *          return this.dispatch('codeSent', ...arguments);
+         *      }
+         * 💡 namespace 'loyalty::' will be added dynamically,
+         * so last result will be something like: 'loyalty::item-added'
+         */
+        this.events = {
+          exchangeSucceeded:'exchange.succeeded',
+          exchangeFailed:'exchange.failed',
+        }
+
+        this.after_init();
+    }
+}
+
+export default LoyaltyEvents

package/types/event/offer.d.ts

@@ -0,0 +1,9 @@
+import {OfferDetailsResponse} from "../api/offer";
+import {RequestErrorEvent} from "../common";
+import {OfferSummary} from "../api/cart";
+
+export default interface OfferEvent {
+    onExisted: (callback: (offer: OfferSummary) => void) => void;
+    ondDetailsFetched: (callback: (response: OfferDetailsResponse) => void) => void;
+    onFetchDetailsFailed: RequestErrorEvent;
+}

package/types/event/product.d.ts

@@ -0,0 +1,9 @@
+import {GetPriceResponse} from "../api/product";
+import {RequestErrorEventWithData, TwilightResponse} from "../common";
+
+export default interface ProductEvent {
+    onPriceUpdated: (callback: (response: GetPriceResponse, product_id: number) => void) => void;
+    onPriceUpdateFailed: RequestErrorEventWithData</*product_id*/ number>;
+    onAvailabilitySubscribed: (callback: (response: TwilightResponse, product_id: number) => void) => void;
+    onAvailabilitySubscribeFailed: RequestErrorEventWithData</*product_id*/ number>;
+}

package/types/event/profile.d.ts

@@ -1,10 +1,7 @@
 import {UpdateProfileResponse} from "../api/profile";
-import {Nullable, RequestError} from "../common";
+import { RequestErrorEvent} from "../common";
 
 export default interface ProfileEvent {
-    updated: (response: UpdateProfileResponse) => void; //fire the event
-    updateFailed: (RequestError) => void;//fire the event
-
     onUpdated: (callback: (response: UpdateProfileResponse) => void) => void;
-    onUpdateFailed: (callback: (error: RequestError) => void) => void;
+    onUpdateFailed: RequestErrorEvent;
 }

package/types/event/scope.js

@@ -0,0 +1,14 @@
+import baseEvent from './baseEvent';
+
+class ScopeEvents extends baseEvent {
+    constructor(parent) {
+        super(parent);
+        this.namespace = 'scope';
+        this.events = {
+        }
+
+        this.after_init();
+    }
+}
+
+export default ScopeEvents

package/types/event/search.d.ts

@@ -0,0 +1,7 @@
+import {Nullable, RequestErrorEventWithData} from "../common";
+import {SearchResponse} from "../api/search";
+
+export default interface SearchEvent {
+    onFinished: (callback: (response: SearchResponse, query: Nullable<string>) => void) => void;
+    onFailed: RequestErrorEventWithData</*query*/Nullable<string>>;
+}

package/types/event/twilight.js

@@ -0,0 +1,32 @@
+import baseEvent from './baseEvent';
+
+class TwilightEvents extends baseEvent {
+    constructor(parent) {
+        super(parent);
+        this.namespace = 'twilight';
+        /**
+         * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,twilight:initiated,...}',
+         * it can be override by creating method like:
+         *      initiated(reponse){
+         *          //your costum code
+         *          ....
+         *          //then call dispatch to emit other listeners
+         *          return this.dispatch('initiated', ...arguments);
+         *      }
+         * 💡 namespace "twilight::" will be added dynamically,
+         * all events will be initiated to have three functions, for ex: event "initiated" wil be:
+         * 🔸 name: twilight::initiated
+         * 🔸 fire: salla.twilight.event.initiated(...data)
+         * 🔸 listen: salla.twilight.event.onInitiated((...data) => salla.log(data))
+         * 🔸 fireWithName: salla.event.emit('twilight::initiated',...data)
+         * 🔸 listenWithName: salla.event.on('twilight::initiated',(...data)=>salla.log(data))
+         */
+        this.events = {
+            initiated: "initiated",
+        }
+
+        this.after_init();
+    }
+}
+
+export default TwilightEvents

package/types/event/wishlist.d.ts

@@ -0,0 +1,8 @@
+import {RequestErrorEventWithData, TwilightResponse} from "../common";
+
+export default interface WishlistEvent {
+    onAdded: (callback: (response: TwilightResponse, product_id: number) => void) => void;
+    onRemoved: (callback: (response: TwilightResponse, product_id: number) => void) => void;
+    onAdditionFailed: RequestErrorEventWithData</*product_id*/number>;
+    onRemovingFailed: RequestErrorEventWithData</*product_id*/number>;
+}

package/types/helpers/app-helpers.d.ts

@@ -0,0 +1,31 @@
+import {Nullable} from "../common";
+
+type ElementOrSelector = string | HTMLElement;
+type EventTypes = 'click' | 'keyup' | 'input' | 'change' | string;
+export default interface AppHelpers {
+    toggleClassIf: (selector: string, classes1: string | Array<string>, classes2: string | Array<string>, callback: (element: HTMLElement) => boolean) => AppHelpers;
+    toggleElementClassIf: (element: HTMLElement, classes1: string | Array<string>, classes2: string | Array<string>, callback: (element: HTMLElement) => boolean) => AppHelpers;
+
+    isValidEmail: (email: string) => boolean;
+
+    element: (selector: ElementOrSelector) => Nullable<HTMLElement>;
+    watchElement: (name: string, selector: ElementOrSelector) => AppHelpers;
+    watchElements: (elements: { [key: string]: [value: ElementOrSelector] }) => AppHelpers;
+    hideElement: (element: ElementOrSelector) => AppHelpers;
+    showElement: (element: ElementOrSelector) => AppHelpers;
+    //💡 you can pass one or multi classes: this.removeClass(element, 'class_1', 'class_2', ...)
+    removeClass: (element: ElementOrSelector, ...className: string[]) => AppHelpers;
+    addClass: (element: ElementOrSelector, ...className: string[]) => AppHelpers;
+    //💡instead of: `document.querySelectorAll('.test').forEach(element=>{...})`
+    // you can use: `this.all('.test', element=>{...})`
+    all: (element: ElementOrSelector, callback: (element: HTMLElement) => void) => AppHelpers;
+
+    //💡instead of: `document.querySelectorAll('.test').forEach(el => el.addEventListener('keyup', callback));`
+    // you can use: `this.on('.test', 'keyup', callback)`
+    // or can use: `this.onKeyUp('.test', callback)`
+    on: (eventType: EventTypes, element: ElementOrSelector, callback: EventListener, options?: AddEventListenerOptions) => AppHelpers;
+    onClick: (element: ElementOrSelector, callback: EventListener) => AppHelpers;
+    onKeyUp: (element: ElementOrSelector, callback: EventListener) => AppHelpers;
+    onEnter: (element: ElementOrSelector, callback: EventListener) => AppHelpers;
+    debounce: (callback: () => unknown) => (...data: Nullable<any>) => Promise<unknown>
+}

package/types/helpers/salla-helpers.d.ts

@@ -4,7 +4,7 @@ export interface SallaHelpers {
     //Numbers helpers
     digitsOnly: (num: string | number) => number,
     inputDigitsOnly: (input: string | HTMLInputElement) => number,
-    number: () => number,
+    number: (num: number) => number | string,
     money: (num: number | Price) => string,
 
     //Nested objects helpers

package/types/index.d.ts

@@ -12,6 +12,25 @@ import OrderApi from "./api/order";
 import OrderEvent from "./event/order";
 import ProfileApi from "./api/profile";
 import ProfileEvent from "./event/profile";
+import AppHelpers from "./helpers/app-helpers";
+import CommentApi from "./api/comment";
+import CommentEvent from "./event/comment";
+import CurrencyApi from "./api/currency";
+import CurrencyEvent from "./event/currency";
+import DocumentApi from "./api/document";
+import DocumentEvent from "./event/document";
+import FeedbackEvent from "./event/feedback";
+import FeedbackApi from "./api/feedback";
+import OfferApi from "./api/offer";
+import OfferEvent from "./event/offer";
+import WishlistApi from "./api/wishlist";
+import WishlistEvent from "./event/wishlist";
+import SearchApi from "./api/search";
+import SearchEvent from "./event/search";
+import ProductEvent from "./event/product";
+import ProductApi from "./api/product";
+import InfiniteScrollEvent from "./event/infiniteScroll";
+import InfiniteScroll from "./infinite-scroll";
 
 export * from "./all";
 
@@ -22,26 +41,26 @@ export default interface Salla {
         auth: AuthApi;
         gift: any;
         order: OrderApi;
-        offer: any;
-        search: any;
+        offer: OfferApi;
+        search: SearchApi;
         coupon: CouponApi;
-        comment: any;
+        comment: CommentApi;
         loyalty: any;
-        product: any;
+        product: ProductApi;
         profile: ProfileApi;
-        currency: any;
-        document: any;
-        feedback: any;
+        currency: CurrencyApi;
+        document: DocumentApi;
+        feedback: FeedbackApi;
         twilight: any;
-        wishlist: any;
+        wishlist: WishlistApi;
         getHeaders: () => {
-            "Accept": string | 'application/json, text/plain, */*',
+            Accept: string | 'application/json, text/plain, */*',
             "X-Requested-With": 'XMLHttpRequest',
             "S-SOURCE": 'twilight',
             "Store-Identifier"?: number,
-            "currency"?: string | 'SAR',
+            currency?: string | 'SAR',
             "accept-language"?: string | 'ar',
-            "Authorization"?: string
+            Authorization?: string
         }
     };
     event: {
@@ -49,21 +68,21 @@ export default interface Salla {
         cart: CartEvent,
         gift: any;
         order: OrderEvent;
-        offer: any;
-        search: any;
+        offer: OfferEvent;
+        search: SearchEvent;
         coupon: CouponEvent;
-        comment: any;
+        comment: CommentEvent;
         loyalty: any;
-        product: any;
+        product: ProductEvent;
         profile: ProfileEvent;
-        currency: any;
-        document: any;
-        feedback: any;
+        currency: CurrencyEvent;
+        document: DocumentEvent;
+        feedback: FeedbackEvent;
         twilight: any;
-        wishlist: any;
+        wishlist: WishlistEvent;
+        infiniteScroll: InfiniteScrollEvent
 
     };
-    infiniteScroll: any;
     helpers: SallaHelpers;
     config: SallaConfig;
     storage: any;
@@ -74,25 +93,26 @@ export default interface Salla {
     auth: AuthApi & { api: AuthApi, event: AuthEvent };
     gift: { api: any, event: any };
     order: OrderApi & { api: OrderApi, event: OrderEvent };
-    offer: { api: any, event: any };
-    search: { api: any, event: any };
+    offer: OfferApi & { api: OfferApi, event: OfferEvent };
+    search: SearchApi & { api: SearchApi, event: SearchEvent };
     coupon: CouponApi & { api: CouponApi, event: CouponEvent };
-    comment: { api: any, event: any };
+    comment: CommentApi & { api: CommentApi, event: CommentEvent };
     loyalty: { api: any, event: any };
-    product: { api: any, event: any };
+    product: ProductApi & { api: ProductApi, event: ProductEvent };
     profile: ProfileApi & { api: ProfileApi, event: ProfileEvent };
-    currency: { api: any, event: any };
-    document: { api: any, event: any };
-    feedback: { api: any, event: any };
+    currency: CurrencyApi & { api: CurrencyApi, event: CurrencyEvent };
+    document: DocumentApi & { api: DocumentApi, event: DocumentEvent };
+    feedback: FeedbackApi & { api: FeedbackApi, event: FeedbackEvent };
     twilight: { api: any, event: any };
-    wishlist: { api: any, event: any };
+    wishlist: WishlistApi & { api: WishlistApi, event: WishlistEvent };
+    infiniteScroll: InfiniteScroll & { api: null, event: InfiniteScrollEvent };
 
     log: (message: string | any) => void;
     success: (message: string) => void;
     error: (message: string) => void;
     lang: any;
     onReady: any; //don't relay on it because Salla may not existed yet
-    AppHelpers: any;
+    AppHelpers: AppHelpers;
     money: (money: number | Price) => string;
 }
 

package/types/infinite-scroll.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @see https://infinite-scroll.com/options.html
+ */
+export interface InfiniteScrollOptions {
+    path: '.infinite-scroll-btn' | string;
+    history: 'push' | false;
+    status: ".infinite-scroll-status" | string;
+    append: ".list-block" | string;
+    button: ".infinite-scroll-btn" | string;
+    next_page: string;
+}
+
+/**
+ * @see https://infinite-scroll.com/api.html
+ */
+export default interface InfiniteScroll {
+    //💡 when there is no need to pass options, but there is need to change append selector, just pass it as string as second argument
+    initiate: (selector: string | HTMLElement, append?: string | InfiniteScrollOptions, customOptions?: InfiniteScrollOptions) => Object;
+}