@salla.sa/twilight-components 2.9.7 → 2.9.9

package/dist/collection/components/salla-comment-form/salla-comment-form.js

@@ -5,11 +5,11 @@ import { Component, Host, State, h, Prop } from '@stencil/core';
 export class SallaCommentForm {
   constructor() {
     /**
-     * type prop
+     * Type of entity the commment is being submitted for. Defaults to `product`
      */
     this.type = salla.url.is_page('page-single') ? 'page' : 'product';
     /**
-     * itemId prop
+     * The ID of the item(as defined in the type), where the comment is for.
      */
     this.itemId = salla.config.get('page.id');
     this.placeholder = salla.lang.get('blocks.comments.placeholder');
@@ -56,7 +56,7 @@ export class SallaCommentForm {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "type prop"
+        "text": "Type of entity the commment is being submitted for. Defaults to `product`"
       },
       "attribute": "type",
       "reflect": false,
@@ -74,7 +74,7 @@ export class SallaCommentForm {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "itemId prop"
+        "text": "The ID of the item(as defined in the type), where the comment is for."
       },
       "attribute": "item-id",
       "reflect": false,

package/dist/collection/components/salla-datetime-picker/salla-datetime-picker.js

@@ -217,17 +217,6 @@ export class SallaDatetimePicker {
       monthSelectorType: this.monthSelectorType,
       nextArrow: this.nextArrow,
       noCalendar: this.noCalendar,
-      onChange: this.onChange,
-      onClose: this.onClose,
-      onDayCreate: this.onDayCreate,
-      onDestroy: this.onDestroy,
-      onKeyDown: this.onKeyDown,
-      onMonthChange: this.onMonthChange,
-      onOpen: this.onOpen,
-      onParseConfig: this.onParseConfig,
-      onReady: this.onReady,
-      onValueUpdate: this.onValueUpdate,
-      onYearChange: this.onYearChange,
       parseDate: this.dateParser,
       position: this.position,
       positionElement: this.positionElement,
@@ -948,226 +937,6 @@ export class SallaDatetimePicker {
       "reflect": false,
       "defaultValue": "false"
     },
-    "onChange": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires when the selected dates have changed - when a date is picked or cleared, by user or programmatically."
-      }
-    },
-    "onClose": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires when the calendar is closed"
-      }
-    },
-    "onDayCreate": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires for every day cell in the calendar, where the fourth argument is the html element of the cell. \nSee https://chmln.github.io/flatpickr/events/#ondaycreate"
-      }
-    },
-    "onDestroy": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires before the calendar instance is destroyed"
-      }
-    },
-    "onKeyDown": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires when valid keyboard input for calendar is detected"
-      }
-    },
-    "onMonthChange": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires after the month has changed"
-      }
-    },
-    "onOpen": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires after the calendar is opened"
-      }
-    },
-    "onParseConfig": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires after the configuration for the calendar is parsed"
-      }
-    },
-    "onReady": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires once the calendar instance is ready"
-      }
-    },
-    "onValueUpdate": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Like onChange, but fires immediately after any date changes"
-      }
-    },
-    "onYearChange": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Hook | Hook[]",
-        "resolved": "((dates: Date[], currentDateString: string, self: any, data?: any) => void) | Hook[]",
-        "references": {
-          "Hook": {
-            "location": "import",
-            "path": "./interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Fires after the year has changed"
-      }
-    },
     "dateParser": {
       "type": "unknown",
       "mutable": false,
@@ -1363,7 +1132,7 @@ export class SallaDatetimePicker {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": ""
+        "text": "Event emitted when the file input gets changed by the user when selecting file(s)."
       },
       "complexType": {
         "original": "any",

package/dist/collection/components/salla-file-upload/salla-file-upload.js

@@ -262,8 +262,6 @@ export class SallaFileUpload {
   async appendFile(file) {
     return this.pond.files = [file];
   }
-  /// Hooks
-  /// Styles
   componentDidLoad() {
     this.pond = this.intiFilePond();
   }
@@ -1399,7 +1397,7 @@ export class SallaFileUpload {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": ""
+        "text": "Event emitted when the file is about to be removed. Returns boolean value."
       },
       "complexType": {
         "original": "any",

package/dist/collection/components/salla-gifting/salla-gifting.js

@@ -8,7 +8,6 @@ import RightArrow from '../../assets/svg/arrow-right.svg';
 import LeftArrow from '../../assets/svg/arrow-left.svg';
 import Cancel from '../../assets/svg/cancel.svg';
 import GiftSharing from '../../assets/svg/gift-sharing.svg';
-//todo:: pass to the placeholder icon sad for no gifting
 export class SallaGifting {
   constructor() {
     this.selectImageForYourGift = salla.lang.get('blocks.buy_as_gift.select_image_or_upload');
@@ -19,7 +18,6 @@ export class SallaGifting {
     this.parentClass = "is-current-step-1";
     this.errors = {};
     this.gift = undefined;
-    // @State() selectedImage: GiftImage = undefined;
     this.selectedGiftTextOption = undefined;
     this.showTextArea = false;
     /// Gift Form Data
@@ -61,7 +59,7 @@ export class SallaGifting {
     });
   }
   /**
-   * Show the gifting modal window
+   * Show / Open the gifting modal window
    */
   async open() {
     if (salla.config.isGuest()) {
@@ -83,13 +81,12 @@ export class SallaGifting {
   }
   /**
   *
-  * Hide the gifting modal window
+  * Hide / close the gifting modal window
   */
   async close() {
     return this.modal.close();
   }
   /**
-  *
   * 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
   */
   async setWrapperHeight(asStep = 1, delay = 250, additionSpace = 0, newHeight = 0) {
@@ -532,7 +529,7 @@ export class SallaGifting {
         "return": "Promise<any>"
       },
       "docs": {
-        "text": "Show the gifting modal window",
+        "text": "Show / Open the gifting modal window",
         "tags": []
       }
     },
@@ -551,7 +548,7 @@ export class SallaGifting {
         "return": "Promise<HTMLElement>"
       },
       "docs": {
-        "text": "\nHide the gifting modal window",
+        "text": "\nHide / close the gifting modal window",
         "tags": []
       }
     },

package/dist/collection/components/salla-list-tile/salla-list-tile.js

@@ -2,6 +2,12 @@
  * Crafted with ❤ by Salla
  */
 import { Component, Host, h, Prop } from '@stencil/core';
+/**
+ * @slot icon - An icon to display before the title.
+ * @slot title - The primary content of the list tile.
+ * @slot subtitle - Additional content displayed below the title.
+ * @slot action - An element to display after the title.
+ */
 export class SallaListTile {
   constructor() {
     /**

package/dist/collection/components/salla-loyalty/salla-loyalty-prize-item.js

@@ -41,7 +41,7 @@ export class SallaLoyaltyPrizeItem {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": ""
+        "text": "Prize item to be displayed in this component."
       }
     }
   }; }
@@ -53,7 +53,7 @@ export class SallaLoyaltyPrizeItem {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": ""
+        "text": "Event emmited when the user select this item."
       },
       "complexType": {
         "original": "Item",

package/dist/collection/components/salla-loyalty/salla-loyalty.js

@@ -6,6 +6,10 @@ import Star2 from '../../assets/svg/star2.svg';
 import Star3 from '../../assets/svg/star3.svg';
 import CancelIcon from '../../assets/svg/cancel.svg';
 import GiftImg from '../../assets/svg/flat.svg';
+/**
+ * @slot widget - When used, will activate the component and needs to emit `loyalty::open` event to open the modal. If not provided the default value will be used.
+ * @slot points-applied-widget -  Widget to show information about the already exchanged points. It should have it's own resetting action and call the `resetExchange` method. If not provided, it will use the default value.
+ */
 export class SallaLoyalty {
   constructor() {
     this.loyaltyProgram = undefined;

package/dist/collection/components/salla-modal/salla-modal.js

@@ -395,7 +395,7 @@ export class SallaModal {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": ""
+        "text": "Event emitted when the modal visibilty is changed."
       },
       "complexType": {
         "original": "Boolean",

package/dist/collection/components/salla-placeholder/salla-placeholder.js

@@ -3,6 +3,10 @@
  */
 import { Component, Prop, State, h, Host } from '@stencil/core';
 import Inbox from '../../assets/svg/inbox.svg';
+/**
+ * @slot title - The primary content of the placeholder.
+ * @slot description - Additional content displayed below the title.
+ */
 export class SallaPlaceholder {
   constructor() {
     this.translationLoaded = false;

package/dist/collection/components/salla-product-availability/salla-product-availability.js

@@ -128,8 +128,8 @@ export class SallaProductAvailability {
       "type": "string",
       "mutable": false,
       "complexType": {
-        "original": "'sms' | 'mobile' | 'sms,mobile'",
-        "resolved": "\"mobile\" | \"sms\" | \"sms,mobile\"",
+        "original": "'sms' | 'email' | 'sms,email'",
+        "resolved": "\"email\" | \"sms\" | \"sms,email\"",
         "references": {}
       },
       "required": false,

package/dist/collection/components/salla-product-size-guide/salla-product-size-guide.js

@@ -3,6 +3,10 @@
  */
 import { Component, State, Method, Element, h } from '@stencil/core';
 import PencilRuler from "../../assets/svg/pencil-ruler.svg";
+/**
+ * @slot header - The upper section of the component.Empty by default.
+ * @slot footer - The bottom section of the component.Empty by default.
+ */
 export class SallaProductSizeGuide {
   constructor() {
     this.hasError = false;
@@ -38,7 +42,6 @@ export class SallaProductSizeGuide {
   async close() {
     return this.modal.close();
   }
-  // !Todo - Enhance placeholder text
   showPlaceholder() {
     return h("salla-placeholder", { alignment: "center", iconSize: "xl" },
       h("div", { slot: "title" }, this.placeholder_title),

package/dist/collection/components/salla-scopes/salla-scopes.js

@@ -5,6 +5,9 @@ import { Component, h, Host, Method, Prop, State } from "@stencil/core";
 import StoreAlt from '../../assets/svg/store-alt.svg';
 import Search from '../../assets/svg/search.svg';
 import { ModeType } from './interfaces';
+/**
+ * @slot footer - The bottom section of the component, used for form action. Utilizes the `handleSubmit` method to submit the form.
+ */
 export class SallaScopees {
   constructor() {
     this.translationLoaded = false;

package/dist/collection/components/salla-select/salla-select.js

@@ -119,7 +119,6 @@ export class SallaSelect {
     }
     let selectedItem = this.items[!!this.placeholder ? selectedIndex - 1 : selectedIndex];
     this.value = this.returnObject ? selectedItem : selectedItem[this.itemValue];
-    console.log("🚀 ~ file: salla-select.tsx ~ line 153 ~ SallaSelect ~ onSelectedItemChange ~ this.value", this.value);
   }
   generateHint() {
     if (!this.persistHint && !this.value) {

package/dist/collection/components/salla-social-share/salla-social-share.js

@@ -11,6 +11,9 @@ import whatsapp from '../../assets/svg/whatsapp.svg';
 import { Socials } from './interfaces';
 import Cancel from "../../assets/svg/cancel.svg";
 import ShareAlt from "../../assets/svg/share-alt.svg";
+/**
+ * @slot widget - An action that can be used to activete or open the component by calling the `open` method.
+ */
 export class SallaSocialShare {
   constructor() {
     this.opened = false;

package/dist/collection/components/salla-swiper/salla-swiper.js

@@ -5,6 +5,9 @@ import { Component, State, Prop, h } from '@stencil/core';
 import Swiper from 'swiper';
 import ArrowRightIcon from "../../assets/svg/arrow-right.svg";
 import ArrowLeftIcon from "../../assets/svg/arrow-left.svg";
+/**
+ * @slot The default slot.
+ */
 export class SallaSwiper {
   constructor() {
     /**

package/dist/collection/components/salla-tabs/salla-tab-content.js

@@ -2,6 +2,9 @@
  * Crafted with ❤ by Salla
  */
 import { Component, Prop, State, Method, h } from '@stencil/core';
+/**
+ * @slot The default slot.
+ */
 export class SallaTabContent {
   constructor() {
     this.isSelected = false;

package/dist/collection/components/salla-tabs/salla-tab-header.js

@@ -3,6 +3,9 @@
  */
 import { Component, Prop, Event, Method, State, h } from '@stencil/core';
 import { generateRandomId } from './utils';
+/**
+ * @slot The default slot.
+ */
 export class SallaTabHeader {
   constructor() {
     this.id = generateRandomId();

package/dist/collection/components/salla-tabs/salla-tabs.js

@@ -2,6 +2,10 @@
  * Crafted with ❤ by Salla
  */
 import { Component, Element, Listen, Prop, h } from '@stencil/core';
+/**
+ * @slot header - The tab header section. `salla-tab-header` component is used for this purpose.
+ * @slot content - The active tab content section. `salla-tab-content` component is used for this purpose.
+ */
 export class SallaTabs {
   constructor() {
     /**

package/dist/collection/components/salla-tel-input/salla-tel-input.js

@@ -178,21 +178,6 @@ export class SallaTelInput {
     "errorMap": {}
   }; }
   static get events() { return [{
-      "method": "enterClicked",
-      "name": "enterClicked",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Event Emitter"
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
       "method": "phoneEntered",
       "name": "phoneEntered",
       "bubbles": true,
@@ -200,7 +185,7 @@ export class SallaTelInput {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": ""
+        "text": "Event emmitted when user enters a phone number."
       },
       "complexType": {
         "original": "Phone",

package/dist/collection/components/salla-user-settings/salla-user-settings.js

@@ -15,6 +15,9 @@ export class SallaUserSettings {
     this.warningText = salla.lang.get('pages.profile.sorry_for_leaving');
     this.keepAccount = salla.lang.get('pages.profile.keep_account');
     this.buttonLoading = false;
+    /**
+     * Value used for handling notification toggle check box.
+     */
     this.isNotifiable = false;
     salla.lang.onLoaded(() => {
       this.deactivateAccount = salla.lang.get('pages.profile.deactivate_account');
@@ -87,7 +90,7 @@ export class SallaUserSettings {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": ""
+        "text": "Value used for handling notification toggle check box."
       },
       "attribute": "is-notifiable",
       "reflect": true,