@salla.sa/twilight-components 1.0.18 → 1.0.19

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

@@ -0,0 +1,331 @@
+import { Component, Host, h, Prop, Watch, Element, Method } from '@stencil/core';
+import Helper from "../../Helpers/Helper";
+export class SallaProductAvailability {
+  constructor() {
+    this.isUser = Helper.isUser();
+    this.buttonText = salla.lang.get('pages.products.notify_availability');
+    this.countryCode = salla.config.country_code || 'SA';
+    this.subscribeText = salla.lang.get('common.elements.submit');
+    this.cancelText = salla.lang.get('common.elements.cancel');
+    this.subTitle = salla.lang.get('pages.products.notify_availability_subtitle');
+    this.mobileLabel = salla.lang.get('common.elements.mobile');
+    this.emailLabel = salla.lang.get('common.elements.email');
+    this.mobilePlaceholder = salla.lang.get('common.elements.mobile_placeholder');
+    this.emailPlaceholder = salla.lang.get('common.elements.email_placeholder');
+    this.productId = salla.config.page.id;
+    this.subscribedMessage = salla.lang.get('pages.products.notify_availability_success');
+    this.isSubscribed = false;
+    if (this.isUser) {
+      return;
+    }
+    this.channelsWatcher(this.channels);
+    this.title_ = this.host.title || salla.lang.get('pages.products.notify_availability_title');
+    this.host.removeAttribute('title');
+  }
+  channelsWatcher(newValue) {
+    this.channels_ = newValue.split(',');
+  }
+  async submit() {
+    if (this.isUser) {
+      return salla.api.product.availabilitySubscribe(this.productId)
+        .then(() => this.isSubscribed = true);
+    }
+    let data = { id: this.productId, country_code: this.countryCode };
+    if (this.mobile.value !== '') {
+      data['mobile'] = this.mobile.value;
+    }
+    if (this.email.value !== '') {
+      data['email'] = this.email.value;
+    }
+    return this.btn.load()
+      .then(() => this.btn.disable())
+      .then(() => salla.api.product.availabilitySubscribe(data))
+      .then(() => this.isSubscribed = true) //no need to wait until finishing alert animation
+      .then(() => this.btn.stop())
+      .then(() => this.modal.hide())
+      .catch(() => this.btn.stop() && this.btn.enable());
+  }
+  render() {
+    return (h(Host, null,
+      this.isSubscribed
+        ? h("div", { class: "s-product-availability-subscribed" }, this.subscribedMessage)
+        : h("slot", null,
+          h("salla-button", { wide: true, onClick: () => this.isUser ? this.submit() : this.modal.show() }, this.buttonText)),
+      this.isUser || this.isSubscribed ? '' : this.renderModal()));
+  }
+  renderModal() {
+    return (h("salla-modal", { ref: modal => this.modal = modal, title: this.title_, subTitle: this.subTitle, icon: "sicon-bell-ring", width: "md" },
+      h("div", { class: "s-product-availability-body" },
+        this.channels_.includes('email') ? [
+          h("label", { class: "s-product-availability-label" }, this.emailLabel),
+          h("input", { class: "s-product-availability-input", placeholder: this.emailPlaceholder, ref: el => this.email = el, type: "email" })
+        ] : '',
+        this.channels_.includes('sms') ? [
+          h("label", { class: "s-product-availability-label" }, this.mobileLabel),
+          h("input", { class: "s-product-availability-input", placeholder: this.mobilePlaceholder, ref: el => this.mobile = el, type: "text" }),
+          h("input", { type: "hidden", value: this.countryCode }),
+        ] : ''),
+      h("div", { slot: "footer", class: "s-product-availability-footer" },
+        h("salla-button", { wide: true, ref: btn => this.btn = btn, onClick: () => this.submit() }, this.subscribeText),
+        h("salla-button", { wide: true, "btn-style": "outline" }, this.cancelText))));
+  }
+  static get is() { return "salla-product-availability"; }
+  static get properties() { return {
+    "channels": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "channels",
+      "reflect": false
+    },
+    "buttonText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "button-text",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('pages.products.notify_availability')"
+    },
+    "countryCode": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "country-code",
+      "reflect": false,
+      "defaultValue": "salla.config.country_code || 'SA'"
+    },
+    "subscribeText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "subscribe-text",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('common.elements.submit')"
+    },
+    "cancelText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "cancel-text",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('common.elements.cancel')"
+    },
+    "subTitle": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "sub-title",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('pages.products.notify_availability_subtitle')"
+    },
+    "mobileLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "mobile-label",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('common.elements.mobile')"
+    },
+    "emailLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "email-label",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('common.elements.email')"
+    },
+    "mobilePlaceholder": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "mobile-placeholder",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('common.elements.mobile_placeholder')"
+    },
+    "emailPlaceholder": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "email-placeholder",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('common.elements.email_placeholder')"
+    },
+    "productId": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "number",
+        "resolved": "number",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "product-id",
+      "reflect": false,
+      "defaultValue": "salla.config.page.id"
+    },
+    "subscribedMessage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "subscribed-message",
+      "reflect": false,
+      "defaultValue": "salla.lang.get('pages.products.notify_availability_success')"
+    },
+    "isSubscribed": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "is-subscribed",
+      "reflect": false,
+      "defaultValue": "false"
+    }
+  }; }
+  static get methods() { return {
+    "submit": {
+      "complexType": {
+        "signature": "() => Promise<any>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<any>"
+      },
+      "docs": {
+        "text": "",
+        "tags": []
+      }
+    }
+  }; }
+  static get elementRef() { return "host"; }
+  static get watchers() { return [{
+      "propName": "channels",
+      "methodName": "channelsWatcher"
+    }]; }
+}

package/dist/collection/components/salla-rating/salla-rating.css

@@ -0,0 +1,7 @@
+:host {
+  display: block;
+}
+
+.unicode{
+  unicode-bidi: plaintext;
+}