@salla.sa/twilight-components 1.6.3 → 1.6.5

package/dist/types/components/salla-file-upload/salla-file-upload.d.ts

@@ -0,0 +1,267 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import * as FilePond from 'filepond';
+import { ServerUrl, ProcessServerConfigFunction, RevertServerConfigFunction, RestoreServerConfigFunction, LoadServerConfigFunction, FetchServerConfigFunction, RemoveServerConfigFunction, FilePondFile, FilePondInitialFile } from './interfaces';
+export declare class SallaFileUpload {
+  /**
+   * Sets the required attribute to the output field
+   */
+  required: boolean;
+  /**
+   * Sets the disabled attribute to the output field
+   */
+  disabled: boolean;
+  /**
+   * Enable or disable drag n' drop
+   */
+  allowDrop: boolean;
+  /**
+   * Enable or disable file browser
+   */
+  allowBrowse: boolean;
+  /**
+   * Enable or disable pasting of files. Pasting files is not supported on all browesrs.
+   */
+  allowPaste: boolean;
+  /**
+   * Enable or disable adding multiple files
+   */
+  allowMultiple: boolean;
+  /**
+   * Allow drop to replace a file, only works when allowMultiple is false
+   */
+  allowReplace: boolean;
+  /**
+   * Enable or disable the revert processing button
+   */
+  allowRevert: boolean;
+  /**
+   * When set to false the remove button is hidden and disabled
+   */
+  allowRemove: boolean;
+  /**
+   * Enable or disable the process button
+   */
+  allowProcess: boolean;
+  /**
+   * Allow users to reorder files with drag and drop interaction.
+   * Note that this only works in single column mode.
+   * It also only works on browsers that support pointer events.
+   */
+  allowReorder: boolean;
+  /**
+   * Tells FilePond to store files in hidden file input elements so they can be posted along with normal form post.
+   * This only works if the browser supports the DataTransfer constructor (https://caniuse.com/mdn-api_datatransfer_datatransfer),
+   * this is the case on Firefox, Chrome, Chromium powered browsers and Safari version 14.1 and higher.
+   */
+  storeAsFile: boolean;
+  /**
+   * Set to true to require the file to be successfully reverted before continuing.
+   */
+  forceRevert: boolean;
+  /**
+   * The maximum number of files that the pond can handle
+   */
+  maxFilesCount: number;
+  /**
+   * The maxmimum number of files that can be uploaded in parallel
+   */
+  maxParallelUploads: number;
+  /**
+   * Set to true to enable custom validity messages.
+   * FilePond will throw an error when a parent form is submitted and it contains invalid files.
+   */
+  checkValidity: boolean;
+  /**
+   * Set to 'after' to add files to end of list (when dropped at the top of the list or added using browse or paste),
+   * set to 'before' to add files at start of list.
+   * Set to a compare function to automatically sort items when added
+   */
+  itemInsertLocation: 'before' | 'after' | ((a: FilePondFile, b: FilePondFile) => number);
+  /**
+   * The interval to use before showing each item being added to the list
+   */
+  itemInsertInterval: number;
+  /**
+   * Show credits at the bottom of the upload element.
+   * Structure is like [{label,url}]
+   */
+  credits?: false;
+  /**
+   * FilePond will catch all files dropped on the webpage
+   */
+  dropOnPage: boolean;
+  /**
+   * Require drop on the FilePond element itself to catch the file.
+   */
+  dropOnElement: boolean;
+  /**
+   * When enabled, files are validated before they are dropped. A file is not added when it's invalid.
+   */
+  dropValidation: boolean;
+  /**
+   * Ignored file names when handling dropped directories. Dropping directories is not supported on all browsers.
+   */
+  ignoredFiles: Array<any>;
+  /**
+   * A server configuration object describing how FilePond should interact with the server.
+   */
+  serverConfig: string | {
+    url?: string;
+    timeout?: number;
+    headers?: {
+      [key: string]: string | boolean | number;
+    };
+    process?: string | ServerUrl | ProcessServerConfigFunction | null;
+    revert?: string | ServerUrl | RevertServerConfigFunction | null;
+    restore?: string | ServerUrl | RestoreServerConfigFunction | null;
+    load?: string | ServerUrl | LoadServerConfigFunction | null;
+    fetch?: string | ServerUrl | FetchServerConfigFunction | null;
+    remove?: RemoveServerConfigFunction | null;
+  } | null;
+  /**
+   * Immediately upload new files to the server
+   */
+  instantUpload: boolean;
+  /**
+   * Enable chunked uploads, when enabled will automatically cut up files in chunkSize chunks before upload.
+   */
+  chunkUploads: boolean;
+  /**
+   * Force chunks even for files smaller than the set chunkSize
+   */
+  chunkForce: boolean;
+  /**
+   * The size of a chunk in bytes
+   */
+  chunkSize: number;
+  /**
+   * Amount of times, and delayes, between retried uploading of a chunk
+   */
+  chunkRetryDelays: Array<number>;
+  /**
+   * The decimal separator used to render numbers. By default this is determined automatically.
+   */
+  labelDecimalSeparator: string;
+  /**
+   * The thousdands separator used to render numbers. By default this is determined automatically.
+   */
+  labelThousandsSeparator: string;
+  /**
+   * Default label shown to indicate this is a drop area.
+   * FilePond will automatically bind browse file events to the element with CSS class .filepond--label-action
+   */
+  labelIdle: string;
+  /**
+   * Label shown when the field contains invalid files and is validated by the parent form.
+   */
+  labelInvalidField: string;
+  /**
+   * Label used while waiting for file size information.
+   */
+  labelFileWaitingForSize: string;
+  /**
+   * Label used when no file size information was received
+   */
+  labelFileSizeNotAvailable: string;
+  /**
+   * Label used while loading a file
+   */
+  labelFileLoading: string;
+  /**
+   * Label used when file load failed
+   */
+  labelFileLoadError: string;
+  /**
+   * Label used when uploading a file
+   */
+  labelFileProcessing: string;
+  /**
+   * Label used when file upload has completed
+   */
+  labelFileProcessingComplete: string;
+  /**
+   * Label used when upload was cancelled
+   */
+  labelFileProcessingAborted: string;
+  /**
+   * Label used when something went wrong during file upload
+   */
+  labelFileProcessingError: string;
+  /**
+   * Label used when something went wrong during reverting the file upload
+   */
+  labelFileProcessingRevertError: string;
+  /**
+   * Label used to indicate something went wrong when removing the file
+   */
+  labelFileRemoveError: string;
+  /**
+   * Label used to indicate to the user that an action can be cancelled.
+   */
+  labelTapToCancel: string;
+  /**
+   * Label used to indicate to the user that an action can be retried.
+   */
+  labelTapToRetry: string;
+  /**
+   * Label used to indicate to the user that an action can be undone.
+   */
+  labelTapToUndo: string;
+  /**
+   * Label used for remove button
+   */
+  labelButtonRemoveItem: string;
+  /**
+   * Label used for abort load button
+   */
+  labelButtonAbortItemLoad: string;
+  /**
+   * Label used for retry load button
+   */
+  labelButtonRetryItemLoad: string;
+  /**
+   * Label used for abort upload button
+   */
+  labelButtonAbortItemProcessing: string;
+  /**
+   * Label used for undo upload button
+   */
+  labelButtonUndoItemProcessing: string;
+  /**
+   * Label used for retry upload button
+   */
+  labelButtonRetryItemProcessing: string;
+  /**
+   * Label used for upload button
+   */
+  labelButtonProcessItem: string;
+  /**
+   * The icon used for remove actions
+   */
+  iconRemove: string;
+  /**
+   * The icon used for process actions
+   */
+  iconProcess: string;
+  /**
+   * The icon used for retry actions
+   */
+  iconRetry: string;
+  /**
+   * The icon used for undo actions
+   */
+  iconUndo: string;
+  pond: any;
+  /**
+   * The array of file references
+   */
+  files: FilePondInitialFile[];
+  /**
+   * Append intial file
+   */
+  appendFile(file: FilePondInitialFile): Promise<FilePondInitialFile[]>;
+  remove: EventEmitter<any>;
+  componentDidLoad(): void;
+  intiFilePond(): FilePond.FilePond;
+  render(): any;
+}

package/dist/types/components/salla-gifting/gift-schema.d.ts

@@ -0,0 +1,20 @@
+export interface GiftResponse {
+  quantity: number;
+  product: Product;
+  sender_name: string;
+  gift_images: GiftImage[];
+  gift_texts: GiftText[];
+}
+export interface Product {
+  id: number;
+  name: string;
+  type: string;
+}
+export interface GiftImage {
+  id: number;
+  url: string;
+}
+export interface GiftText {
+  id: number;
+  text: string;
+}

package/dist/types/components/salla-gifting/intefaces.d.ts

@@ -0,0 +1,18 @@
+export interface GiftToCardDTO {
+  text: string;
+  sender_name: string;
+  receiver: Receiver;
+  quantity: number;
+  deliver_at: string;
+  image_url: string;
+  time_zone?: string;
+}
+export interface Receiver {
+  name: string;
+  country_code?: string;
+  mobile: string;
+}
+export interface Phone {
+  country_code: string;
+  number: string;
+}

package/dist/types/components/salla-gifting/salla-gifting.d.ts

@@ -0,0 +1,98 @@
+import { GiftResponse, GiftImage } from './gift-schema';
+export declare class SallaGifting {
+  constructor();
+  private modal;
+  sectionTitle: string;
+  sectionSubtitle: string;
+  sectionBtnText: string;
+  giftDetails: string;
+  selectImageForYourGift: string;
+  selectImageOrUpload: string;
+  selectGiftMessage: string;
+  giftCustomText: string;
+  textId: string;
+  incorrectGiftText: string;
+  nextStep: string;
+  senderNameLabel: string;
+  receiverNameFieldLabel: string;
+  receiverMobileFieldLabel: string;
+  receiverEmailFieldLabel: string;
+  emailPlaceholder: string;
+  sendLater: string;
+  selectSendDateAndTime: string;
+  canNotEditOrderAfterSelectDate: string;
+  sendGift: string;
+  donationRequired: string;
+  step1Elems: NodeListOf<Element>;
+  step2Elems: NodeListOf<Element>;
+  stepsWrapper: HTMLElement;
+  imageCover: HTMLElement;
+  textSelect: HTMLElement;
+  customTextArea: HTMLElement;
+  calendarFormGroup: HTMLElement;
+  currentStep: number;
+  showCalendar: boolean;
+  showGiftText: boolean;
+  currentLang: string;
+  parentClass: string;
+  errors: object;
+  gift: GiftResponse;
+  selectedGiftTextOption: string;
+  showTextArea: boolean;
+  selectedImage: string;
+  uploadedImage: string;
+  selectedText: string;
+  senderName: string;
+  errorMessage: string;
+  hasError: boolean;
+  quantity: number;
+  deliveryDate: string;
+  timeZone?: string;
+  receiverName: string;
+  receiverMobile: string;
+  receiverCountryCode: string;
+  receiverEmail: string;
+  /**
+   * The product id for which the gifting system is required.
+  */
+  productId: number;
+  /**
+   * Show the gifting modal window
+   */
+  open(): Promise<any>;
+  /**
+  *
+  * Hide the gifting modal window
+  */
+  close(): Promise<HTMLElement>;
+  /**
+  *
+  * Update the modal height based on the changes on the inner elements height for a specific step OR just a pass a new fixed height
+  */
+  private setWrapperHeight;
+  private toggleCalendar;
+  private toggleGiftText;
+  /**
+  *
+  * Go to the step 2
+  */
+  goToStep2(): Promise<void>;
+  /**
+    *
+    * Go to the step 1
+    */
+  goToStep1(): void;
+  private getFilepondPlaceholder;
+  setPreview(image: GiftImage): void;
+  removePreview(): void;
+  private handleTextAreaChange;
+  private handleSenderName;
+  private handleReceiverName;
+  private handleRemoveImage;
+  private handlePhoneInputChange;
+  private handleDateTimePicker;
+  private getCalendarClasses;
+  private getServerConfig;
+  private submitForm;
+  render(): any[];
+}

package/dist/types/components/salla-localization-modal/salla-localization-modal.d.ts

@@ -13,7 +13,8 @@ export declare class SallaLocalizationModal {
   translationLoaded: boolean;
   languages: Array<any>;
   currencies: Array<any>;
-  isLoading: boolean;
+  hasError: boolean;
+  errorMessage: string;
   /**
    * Current language (existing or newly selected)
    */
@@ -26,7 +27,7 @@ export declare class SallaLocalizationModal {
   /**
    * open the component
    */
-  open(): Promise<boolean>;
+  open(): Promise<any>;
   /**
    * Hide the component
    */

package/dist/types/components/salla-login-modal/salla-login-modal.d.ts

@@ -32,16 +32,15 @@ export declare class SallaLoginModal {
   private registrationTab;
   private regTelInput;
   private regEmail;
-  private regMobileBlock;
-  private regEmailBlock;
   private loginTelInput;
   private loginEmail;
   private firstName;
   private lastName;
-  private regType;
   private smsBtn;
   private emailBtn;
   private regBtn;
+  currentTabName: string;
+  regType: 'phone' | 'email';
   translationLoaded: boolean;
   title: string;
   emailErrorMsg: string;
@@ -64,5 +63,16 @@ export declare class SallaLoginModal {
   private newUser;
   private newUserValidation;
   validateField(field: HTMLInputElement, errorMsg: string): void;
+  generateTabClasses(tabName: any): {
+    's-login-modal-tab': boolean;
+    "s-hidden": boolean;
+    "s-show": boolean;
+    's-login-modal-unactive': boolean;
+    's-login-modal-active': boolean;
+  };
+  generateRegClasses(regType: any): {
+    "mb-1.5": boolean;
+    "s-hidden": boolean;
+  };
   render(): any;
 }

package/dist/types/components/salla-loyalty/salla-loyalty-prize-item.d.ts

@@ -0,0 +1,8 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { Item } from "./loyalty-schema";
+export declare class SallaLoyaltyPrizeItem {
+  item: Item;
+  prizeItemSelected: EventEmitter<Item>;
+  onPrizeItemClick(): void;
+  render(): any;
+}

package/dist/types/components/salla-loyalty/salla-loyalty.d.ts

@@ -8,6 +8,8 @@ export declare class SallaLoyalty {
   selectedItem: Item | undefined;
   askConfirmation: boolean;
   is_loggedin: boolean;
+  hasError: boolean;
+  errorMessage: string;
   translationLoaded: boolean;
   /**
    * The exchanged prize point

package/dist/types/components/salla-offer-modal/salla-offer-modal.d.ts

@@ -12,6 +12,8 @@ export declare class SallaOfferModal {
   offer: null | Offer;
   offer_name: string;
   offer_message: string;
+  hasError: boolean;
+  errorMessage: string;
   constructor();
   translationLoaded: boolean;
   /**
@@ -23,7 +25,7 @@ export declare class SallaOfferModal {
    * Show offer details
    * @param {Offer} offer
    */
-  showOffer(offer: any): Promise<HTMLElement>;
+  showOffer(offer: any): Promise<void>;
   private rememberMe;
   private addItem;
   private defaultProductSlot;

package/dist/types/components/salla-product-size-guide/salla-product-size-guide.d.ts

@@ -7,6 +7,10 @@ export declare class SallaProductSizeGuide {
   private modal;
   guides: Array<SizeGuide> | [];
   productId: number;
+  placeholder_title: string;
+  placeholder_description: string;
+  modal_title: string;
+  hasError: boolean;
   host: HTMLElement;
   /**
    * Show the size-guide modal window

package/dist/types/components/salla-rating-modal/salla-rating-modal.d.ts

@@ -1,8 +1,9 @@
-/// <reference types="node" />
 import OrderFeedbackResponse from "./order-feedback-response";
 export declare class SallaRatingModal {
   constructor();
   order: OrderFeedbackResponse | undefined;
+  hasError: boolean;
+  errorMessage: string;
   private stepsCount;
   private nextBtn;
   private backBtn;
@@ -24,7 +25,7 @@ export declare class SallaRatingModal {
   /**
    * Show the rating modal
    */
-  open(): Promise<NodeJS.Timeout>;
+  open(): Promise<any>;
   /**
    * Show the rating modal
    */

package/dist/types/components/salla-scopes/salla-scopes.d.ts

@@ -10,6 +10,7 @@ export declare class SallaScopees {
   originalScopesList: Scope[] | ProductAvailability[];
   selected_scope: any;
   isOpenedBefore: string;
+  hasError: boolean;
   /**
    * Optionally open the modal or enforce the pop-up to the viewer
    */

package/dist/types/components/salla-select/salla-select.d.ts

@@ -0,0 +1,110 @@
+export declare class SallaSelect {
+  /**
+   * Sets label
+   */
+  label: string;
+  /**
+   * Can be an array of objects or array of strings.
+   * When using objects, will look for a text, value and disabled keys.
+   */
+  items: any[];
+  /**
+   * Set property of items’s text value
+   */
+  itemText: string;
+  /**
+   * Set property of items’s value - must be primitive.
+   * Dot notation is supported.
+   */
+  itemValue: string;
+  /**
+   * Set property of items’s disabled value
+   */
+  itemDisabled: string;
+  /**
+  * Sizing options
+  */
+  size: 'x-large' | 'large' | 'normal' | 'small' | 'x-small';
+  /**
+   * The selected value
+   */
+  value: any;
+  /**
+   * Enable autofocus
+   */
+  autofocus: boolean;
+  /**
+   * Add input clear functionality, default icon is `sicon-cancel`
+   */
+  clearable: boolean;
+  /**
+   * Applied when using clearable and the input is dirty
+   */
+  clearIcon: string;
+  /**
+   * Applies specified color to the control.
+   */
+  color: 'primary' | 'success' | 'warning' | 'danger' | 'light' | 'gray' | 'dark';
+  /**
+   * Remove elevation or box shadow.
+   */
+  flat: boolean;
+  /**
+   * Disable the input
+   */
+  disabled: boolean;
+  /**
+   * Displays linear progress bar.
+   */
+  loading: boolean;
+  /**
+   * Specifies which color is applied to the progress bar.
+   */
+  loadingColor: string;
+  /**
+   * Hint text
+   */
+  hint: string;
+  /**
+   * Forces hint to always be visible.
+   */
+  persistHint: boolean;
+  /**
+   * Sets the input’s placeholder text.
+   */
+  placeholder: string;
+  /**
+   * Enable multiple item selection
+   */
+  multiple: boolean;
+  /**
+   * Enable multiple item selection
+   */
+  autocomplete: boolean;
+  /**
+   * Enable multiple item selection
+   */
+  required: boolean;
+  /**
+   * Changes display of selections to chips
+   */
+  chips: boolean;
+  /**
+   * Define appearance of the component
+   */
+  shape: 'underline' | 'outlined';
+  /**
+   * Changes the selection behavior to return the object directly
+   * rather than the value specified with item-value
+   */
+  returnObject: boolean;
+  /**
+   * Hides hint if any
+   */
+  hideDetail: boolean;
+  private selectClass;
+  private onSelectedItemChange;
+  private generateHint;
+  private checkForSelected;
+  render(): any;
+}

package/dist/types/components/salla-tel-input/interfaces.d.ts

@@ -0,0 +1,4 @@
+export interface Phone {
+  country_code: string;
+  number: string;
+}

package/dist/types/components/salla-tel-input/salla-tel-input.d.ts

@@ -1,4 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+import { Phone } from './interfaces';
 export declare class SallaTelInput {
   constructor();
   /**
@@ -17,6 +18,7 @@ export declare class SallaTelInput {
    * Event Emitter
    */
   enterClicked: EventEmitter;
+  phoneEntered: EventEmitter<Phone>;
   host: HTMLElement;
   mobileRequired: string;
   countryCodeLabel: string;
@@ -45,6 +47,7 @@ export declare class SallaTelInput {
   isValid(): Promise<boolean>;
   private initTelInput;
   private reset;
+  private handleCountryInput;
   render(): any;
   componentDidLoad(): void;
 }