@salla.sa/twilight 2.0.217 → 2.0.219

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salla.sa/twilight",
-  "version": "2.0.217",
+  "version": "2.0.219",
   "description": "Salla Theme Toolkit, Webcomponents, Events, Requests, Utils",
   "main": "dist/cjs/main.js",
   "module": "dist/esm/main.js",

package/types/actions.d.ts

@@ -0,0 +1,50 @@
+import {
+    AuthApi, CartApi, CommentApi, CouponApi, CurrencyApi, DocumentApi, FeedbackApi, GiftApi, OfferApi, OrderApi,
+    ProductApi, ProfileApi, SearchApi, TwilightApi, WishlistApi
+} from "./api";
+import {
+    AuthEvent, CartEvent, CommentEvent, CouponEvent, CurrencyEvent, DocumentEvent, FeedbackEvent, GiftEvent,
+    InfiniteScrollEvent, OfferEvent, OrderEvent, ProductEvent, ProfileEvent, SearchEvent, TwilightEvent, WishlistEvent
+} from "./event";
+
+export default interface SallaActions {
+    cart: CartApi & { api: CartApi, event: CartEvent };
+    auth: AuthApi & { api: AuthApi, event: AuthEvent };
+    gift: GiftApi & { api: GiftApi, event: GiftEvent };
+    order: OrderApi & { api: OrderApi, event: OrderEvent };
+    offer: OfferApi & { api: OfferApi, event: OfferEvent };
+    search: SearchApi & { api: SearchApi, event: SearchEvent };
+    coupon: CouponApi & { api: CouponApi, event: CouponEvent };
+    comment: CommentApi & { api: CommentApi, event: CommentEvent };
+    loyalty: { api: any, event: any }; //todo:: support it
+    product: ProductApi & { api: ProductApi, event: ProductEvent };
+    profile: ProfileApi & { api: ProfileApi, event: ProfileEvent };
+    currency: CurrencyApi & { api: CurrencyApi, event: CurrencyEvent };
+    document: DocumentApi & { api: DocumentApi, event: DocumentEvent };
+    feedback: FeedbackApi & { api: FeedbackApi, event: FeedbackEvent };
+    twilight: TwilightApi & { api: TwilightApi, event: TwilightEvent };
+    wishlist: WishlistApi & { api: WishlistApi, event: WishlistEvent };
+    infiniteScroll: InfiniteScroll & { api: null, event: InfiniteScrollEvent };
+}
+
+
+/********************* Infinite Scroll *********************/
+/**
+ * @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 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;
+}

package/types/api/cart.d.ts

@@ -1,4 +1,5 @@
 import {Nullable, TwilightResponse} from "../common";
+import {ProductPayload} from "./product";
 
 export interface itemOffer {
     discount: number,
@@ -80,12 +81,9 @@ export interface CartStatusResponse extends TwilightResponse {
     }
 }
 
-export interface AddItemPayload {
-    id: number;
-    quantity: 1 | number;
-    options: Nullable<{ [key: number]: [value: number | string | Array<{ [key: number]: [value: number] }>] }>;
-    notes: Nullable<string>;
-    file: Nullable<BinaryType | string>;
+export interface AddItemPayload extends ProductPayload {
+    notes?: Nullable<string>;
+    file?: Nullable<BinaryType | string>;
 }
 
 export default interface CartApi {

package/types/api/comment.d.ts

@@ -0,0 +1,12 @@
+import {TwilightResponse} from "../common";
+
+export interface SendCommentResponse extends TwilightResponse {
+    data: {
+        case: 'success' | 'error',
+        message: string,
+    }
+}
+
+export default interface CommentApi {
+    send: (data: { id: number, comment: string, type: 'product' | 'page' }) => Promise<SendCommentResponse>;
+}

package/types/api/currency.d.ts

@@ -0,0 +1,17 @@
+import {Currency, TwilightResponse} from "../common";
+
+export interface ChangeCurrencyResponse extends TwilightResponse {
+    data: {
+        code: 'SAR' | string,
+        symbol: string,
+    }
+}
+
+export interface ListCurrenciesResponse extends TwilightResponse {
+    data: Array<Currency>
+}
+
+export default interface CurrencyApi {
+    change: (currency_code: 'SAR' | 'USD' | string) => Promise<ChangeCurrencyResponse>;
+    list: () => Promise<ListCurrenciesResponse>;
+}

package/types/api/document.d.ts

@@ -0,0 +1,3 @@
+
+export default interface DocumentApi {
+}

package/types/api/feedback.d.ts

@@ -0,0 +1,56 @@
+import {Nullable, Product, Rating, TwilightResponse} from "../common";
+
+export interface SuccessFeedbackResponse extends TwilightResponse {
+    data: {
+        case: "success";
+        message: string;
+    }
+}
+
+export interface OrderDetailsResponse extends TwilightResponse {
+    data: {
+        id: number;
+        store: Nullable<{ feedback: FeedbackContent }>;
+        shipping: Nullable<{
+            feedback: FeedbackContent;
+            company: {
+                id: number;
+                name: string;
+                logo: Nullable<string>;
+            }
+        }>;
+        products: Array<{ feedback: FeedbackContent; product: Product; }>;
+        testimonials_enabled: boolean;
+        shipping_enabled: boolean;
+        products_enabled: boolean;
+        thanks_message: string;
+    }
+}
+
+export interface FeedbackContent {
+    content: string,
+    rating: Rating;
+    status?: 'approved' | 'pending';
+}
+
+export interface FeedbackStorePayload {
+    comment: string;
+    order_id: number;
+    rating: Rating;
+}
+
+export interface FeedbackProductsPayload {
+    products: Array<{ product_id: number; comment: string; rating: Rating; }>
+    order_id: number;
+}
+
+export interface FeedbackShippingPayload extends FeedbackStorePayload {
+    shipping_company_id: number;
+}
+
+export default interface FeedbackApi {
+    order: (order_id: number) => Promise<OrderDetailsResponse>;
+    store: (data: FeedbackStorePayload) => Promise<SuccessFeedbackResponse>;
+    products: (data: FeedbackProductsPayload) => Promise<SuccessFeedbackResponse>;
+    shipping: (data: FeedbackShippingPayload) => Promise<SuccessFeedbackResponse>;
+}

package/types/api/gift.d.ts

@@ -0,0 +1,26 @@
+import {TwilightResponse} from "../common";
+
+export interface GiftPayload {
+    id: number;
+    image?: BinaryType;
+    image_url_id?: number;
+    text_id?: number;//required if text not provided
+    text?: string;//required if text_id not provided
+    sender_name?: string;
+    receiver: {
+        name: string;
+        mobile: number;
+        country_code: string | 'SA';
+        email?: string;
+    };
+    deliver_at: string | '2022-02-22 02:22 pm';
+}
+
+export interface GiftResponse extends TwilightResponse {
+    redirect: string;
+}
+
+export default interface GiftApi {
+    buy: (GiftPayload) => Promise<GiftResponse>;
+
+}

package/types/api/index.d.ts

@@ -0,0 +1,103 @@
+import {Axios} from "axios";
+import CartApi from "./cart";
+import AuthApi from "./auth";
+import GiftApi from "./gift";
+import OrderApi from "./order";
+import OfferApi from "./offer";
+import SearchApi from "./search";
+import CouponApi from "./coupon";
+import CommentApi from "./comment";
+import ProductApi from "./product";
+import ProfileApi from "./profile";
+import CurrencyApi from "./currency";
+import DocumentApi from "./document";
+import FeedbackApi from "./feedback";
+import WishlistApi from "./wishlist";
+import TwilightApi from "./twilight";
+
+export {
+    CartApi,
+    AuthApi,
+    GiftApi,
+    OrderApi,
+    OfferApi,
+    SearchApi,
+    CouponApi,
+    CommentApi,
+    ProductApi,
+    ProfileApi,
+    CurrencyApi,
+    DocumentApi,
+    TwilightApi,
+    FeedbackApi,
+    WishlistApi,
+};
+export type ApiActionName =
+    'auth.login'
+    | 'auth.resend'
+    | 'auth.verify'
+    | 'auth.register'
+    | 'auth.logout'
+    | 'auth.refresh'
+    | 'cart.latest'
+    | 'cart.details'
+    | 'cart.summary'
+    | 'cart.quickAdd'
+    | 'cart.addItem'
+    | 'cart.deleteItem'
+    | 'cart.updateItem'
+    | 'cart.deleteImage'
+    | 'cart.status'
+    | 'gift.buy'
+    | 'loyalty.exchange'
+    | 'order.cancel'
+    | 'order.reOrder'
+    | 'order.send'
+    | 'offer.increase'
+    | 'offer.details'
+    | 'search.search'
+    | 'coupon.add'
+    | 'coupon.remove'
+    | 'product.getPrice'
+    | 'product.availabilitySubscribe'
+    | 'product.purchaseNow'
+    | 'profile.update'
+    | 'comment.send'
+    | 'currency.change'
+    | 'currency.list'
+    | 'feedback.store'
+    | 'feedback.products'
+    | 'feedback.shipping'
+    | 'feedback.order'
+    | 'wishlist.add'
+    | 'wishlist.remove'
+    | 'scope.getAll'
+    | 'scope.submit';
+
+export default interface SallaApi extends Axios {
+    cart: CartApi;
+    auth: AuthApi;
+    gift: GiftApi;
+    order: OrderApi;
+    offer: OfferApi;
+    search: SearchApi;
+    coupon: CouponApi;
+    comment: CommentApi;
+    loyalty: any;//TODO::add types
+    product: ProductApi;
+    profile: ProfileApi;
+    currency: CurrencyApi;
+    document: DocumentApi;
+    feedback: FeedbackApi;
+    twilight: TwilightApi;
+    wishlist: WishlistApi;
+    getHeaders: () => {
+        Accept: string | 'application/json, text/plain, */*',
+        "X-Requested-With": 'XMLHttpRequest',
+        "S-SOURCE": 'twilight',
+        "Store-Identifier"?: number,
+        currency?: string | 'SAR',
+        "accept-language"?: string | 'ar',
+        Authorization?: string
+    }
+}

package/types/api/offer.d.ts

@@ -0,0 +1,43 @@
+import {Category, Product, TwilightResponse} from "../common";
+
+type offerType = 'buy_x_get_y' | 'percentage' | 'fixed_amount';
+type paymentMethod = {
+    id: number;
+    slug: 'bank';
+    name: 'BankTransfer';
+};
+
+export interface Offer {
+    id: number;
+    name: string;
+    message: string;
+    expiry_date: string | '2022-02-22 00:00:00';
+    formatted_date: string;
+    offer_type: offerType;
+    applied_to: 'order' | 'category' | 'product' | 'paymentMethod';
+    buy: {
+        type: 'product' | 'category';
+        quantity: number;
+        products?: Product[];
+        categories?: Category[];
+        min_amount?: number; //when offer_type != 'buy_x_get_y'
+        min_items?: number; //when offer_type != 'buy_x_get_y'
+        payment_methods: paymentMethod[];
+    },
+    get: {
+        products?: Product[];
+        categories?: Category[];
+        type: 'product' | 'category';
+        discount_type: 'free-product' | 'percentage';
+        quantity?: number;//when discount_type == 'percentage'
+        discount_amount?: number; //when offer_type != 'buy_x_get_y' or get.discount_type !='free-product'
+    }
+}
+
+export interface OfferDetailsResponse extends TwilightResponse {
+    data: Offer[] | [];
+}
+
+export default interface OfferApi {
+    details: (product_id: number) => Promise<OfferDetailsResponse>;
+}

package/types/api/product.d.ts

@@ -0,0 +1,29 @@
+import {Nullable, TwilightResponse} from "../common";
+
+type ProductOption = { [key: number]:  number | string | number[] };
+
+export interface ProductPayload {
+    id: number;
+    quantity: 1 | number;
+    options?: Nullable<ProductOption>;
+}
+
+export interface AvailabilityPayload {
+    id: number;
+    //💡 Following properties required for guests
+    email?: string;//required when request without mobile
+    country_code?: string | 'SA';//required when request without email
+    mobile?: string | '555555555';//required when request without email
+}
+
+export interface GetPriceResponse extends TwilightResponse {
+    data: {
+        price: number;
+        regular_price: number; // you can check if regular_price > price means there is a special price for this product.
+    }
+}
+
+export default interface ProductApi {
+    getPrice: (data: /*product_id*/number | ProductPayload) => Promise<GetPriceResponse>;
+    availabilitySubscribe: (product_id: number | AvailabilityPayload) => Promise<TwilightResponse>;
+}

package/types/api/search.d.ts

@@ -0,0 +1,22 @@
+import {Nullable, Product, TwilightResponse} from "../common";
+
+type SortOption = {
+    id: "ourSuggest" | "bestSell" | "topRated" | "priceFromTopToLow" | "priceFromLowToTop";
+    name: string
+};
+
+export interface SearchResponse extends TwilightResponse {
+    data: Product[];
+    cursor: {
+        current: number;
+        previous: Nullable<string>;
+        next: Nullable<string>;
+        count: number;
+    };
+    features?: { sorting?: true };
+    sort_options: SortOption[];
+}
+
+export default interface SearchApi {
+    search: (query: string) => Promise<SearchResponse>;
+}

package/types/api/twilight.d.ts

@@ -0,0 +1,6 @@
+import {TwilightConfig} from "../tiwlight-config";
+
+export default interface TwilightApi {
+    init: (config: TwilightConfig) => void;
+    api: (payload: { events: { [key: string]: any } }) => void;
+}

package/types/api/wishlist.d.ts

@@ -0,0 +1,7 @@
+import {TwilightResponse} from "../common";
+
+export default interface WishlistApi {
+    add: (product_id: number) => Promise<TwilightResponse>;
+    remove: (product_id: number) => Promise<TwilightResponse>;
+    toggle: (product_id: number) => Promise<TwilightResponse>;
+}

package/types/common.d.ts

@@ -1,3 +1,10 @@
+type Nullable<T> = T | undefined | null | '';
+type ProductType = 'product' | 'service' | 'group_products' | 'codes' | 'digital' | 'food' | 'donating';
+type Rating = 1 | 2 | 3 | 4 | 5;
+type RequestError = Error & { response: any }
+type RequestErrorEvent = (callback: (error: RequestError | string) => void) => void;
+type RequestErrorEventWithData<data> = (callback: (error: RequestError | string, data) => void) => void;
+
 export interface Price {
     amount: string;
     currency: string;
@@ -12,14 +19,45 @@ export interface TwilightResponse {
     error: Nullable<{
         message: Nullable<string | 'alert.invalid_fields'>,
         code: Nullable<any>
-        case: Nullable<string|'resend_counter'|'invalid_code'>
-        events:Nullable<string>
+        case: Nullable<string | 'resend_counter' | 'invalid_code'>
+        events: Nullable<string>
         fields: Nullable<{
             [key: string]: Array<string>
         }>
     }>
 }
 
-type Nullable<T> = T | undefined | null;
+export interface Currency {
+    code: string| 'SAR';
+    name: string;
+    symbol: string;
+    amount?: number;
+    country_code?: string;
+}
+
+export interface Product {
+    id: number;
+    name: string;
+    type: ProductType;
+    promotion: {
+        title: Nullable<string>;
+        sub_title: Nullable<string>;
+    };
+    price: Price;
+    sale_price: Nullable<Price>;
+    regular_price: Price;
+    has_special_price: boolean;
+    status: 'sale' | 'out';
+    is_available: boolean;
+    sku: Nullable<string>;
+    currency: string | 'SAR';
+    url: string;
+    thumbnail: string;
+    calories: Nullable<number>;
+}
 
-type RequestError = Error & { response: any }
+export interface Category {
+    id: number;
+    name: string;
+    url: string;
+}

package/types/event/comment.d.ts

@@ -0,0 +1,7 @@
+import {RequestError} from "../common";
+import {SendCommentResponse} from "../api/comment";
+
+export default interface CommentEvent {
+    onAdded: (callback: (response: SendCommentResponse) => void) => void;
+    onAdditionFailed: (callback: (error: RequestError) => void) => void;
+}

package/types/event/currency.d.ts

@@ -0,0 +1,9 @@
+import {ChangeCurrencyResponse, ListCurrenciesResponse} from "../api/currency";
+import {RequestErrorEvent} from "../common";
+
+export default interface CurrencyEvent {
+    changed: (callback: (response: ChangeCurrencyResponse, currency: 'SAR' | string) => void) => void;
+    fetched: (callback: (response: ListCurrenciesResponse, currency: 'SAR' | string) => void) => void,
+    failed: RequestErrorEvent,
+    failedToFetch: RequestErrorEvent,
+}

package/types/event/document.d.ts

@@ -0,0 +1,21 @@
+import {Nullable, RequestError} from "../common";
+
+export interface requestPayload {
+    namespace: string | 'cart',
+    action: string | 'latest',
+    hook: string | 'latest',
+    url: string | 'cart/latest',
+    payload: {} | { params: {} },
+    method: 'get' | 'post' | 'put' | 'delete',
+    headers: Nullable<{}>,
+}
+
+export default interface DocumentEvent {
+    onClick: (selector: string | ((event) => void), callback?: (event) => void) => void;
+    onChange: (selector: string | ((event) => void), callback?: (event) => void) => void;
+    onSubmit: (selector: string | ((event) => void), callback?: (event) => void) => void;
+    onKeyup: (selector: string | ((event) => void), callback?: (event) => void) => void;
+    onLeaving: (event: BeforeUnloadEvent) => boolean; //return false to show alert 'Changes you made may not be saved.'
+    onRequest: (payload: requestPayload) => void; //💡handy when there is need to prevent request by throwing an error `throw 'stop the request';`.
+    onRequestFailed: (payload: requestPayload, error?: RequestError) => void;
+}

package/types/event/feedback.d.ts

@@ -0,0 +1,18 @@
+import {
+    SuccessFeedbackResponse,
+    OrderDetailsResponse,
+    FeedbackStorePayload,
+    FeedbackProductsPayload, FeedbackShippingPayload
+} from "../api/feedback";
+import {RequestErrorEventWithData} from "../common";
+
+export default interface FeedbackEvent {
+    onOrderFetched: (callback: (response: OrderDetailsResponse, order_id: number) => void) => void;
+    onOrderNotFetched: RequestErrorEventWithData</*order_id*/number>;
+    onStoreRated: (callback: (response: SuccessFeedbackResponse, data: FeedbackStorePayload) => void) => void;
+    onStoreFailed: RequestErrorEventWithData</*data*/FeedbackStorePayload>;
+    onProductRated: (callback: (response: SuccessFeedbackResponse, data: FeedbackProductsPayload) => void) => void;
+    onProductFailed: RequestErrorEventWithData</*data*/FeedbackProductsPayload>;
+    onShippingRated: (callback: (response: SuccessFeedbackResponse, data: FeedbackShippingPayload) => void) => void;
+    onShippingFailed: RequestErrorEventWithData</*data*/FeedbackShippingPayload>;
+}

package/types/event/gift.d.ts

@@ -0,0 +1,7 @@
+import {Nullable, RequestErrorEventWithData} from "../common";
+import {GiftResponse} from "../api/gift";
+
+export default interface GiftEvent {
+    onBuyingSucceeded: (callback: (response: GiftResponse, product_id: number) => void) => void;
+    onBuyingFailed: RequestErrorEventWithData</*product_id*/Nullable<number>>;
+}

package/types/event/index.d.ts

@@ -0,0 +1,56 @@
+import AuthEvent from "./auth";
+import CartEvent from "./cart";
+import GiftEvent from "./gift";
+import OrderEvent from "./order";
+import OfferEvent from "./offer";
+import SearchEvent from "./search";
+import CouponEvent from "./coupon";
+import CommentEvent from "./comment";
+import ProductEvent from "./product";
+import ProfileEvent from "./profile";
+import CurrencyEvent from "./currency";
+import DocumentEvent from "./document";
+import FeedbackEvent from "./feedback";
+import WishlistEvent from "./wishlist";
+import InfiniteScrollEvent from "./infiniteScroll";
+import {EventEmitter2} from "eventemitter2";
+import TwilightEvent from "./twilight";
+
+export {
+    AuthEvent,
+    CartEvent,
+    GiftEvent,
+    OrderEvent,
+    OfferEvent,
+    SearchEvent,
+    CouponEvent,
+    CommentEvent,
+    ProductEvent,
+    ProfileEvent,
+    CurrencyEvent,
+    DocumentEvent,
+    FeedbackEvent,
+    TwilightEvent,
+    WishlistEvent,
+    InfiniteScrollEvent,
+}
+
+export default interface SallaEvent extends EventEmitter2 {
+    auth: AuthEvent,
+    cart: CartEvent,
+    gift: GiftEvent;
+    order: OrderEvent;
+    offer: OfferEvent;
+    search: SearchEvent;
+    coupon: CouponEvent;
+    comment: CommentEvent;
+    loyalty: any;//TODO::add types
+    product: ProductEvent;
+    profile: ProfileEvent;
+    currency: CurrencyEvent;
+    document: DocumentEvent;
+    feedback: FeedbackEvent;
+    twilight: TwilightEvent;
+    wishlist: WishlistEvent;
+    infiniteScroll: InfiniteScrollEvent
+}

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/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/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>>;
+}