@salla.sa/twilight-components 1.0.100 → 1.0.107

package/dist/cjs/salla-offer-modal.cjs.entry.js

@@ -1,144 +0,0 @@
-/*!
- * Crafted with ❤ by Salla
- */
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-3771e52a.js');
-const Helper = require('./Helper-8ae6a805.js');
-
-const sallaOfferModalCss = "";
-
-const SallaOfferModal = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    var _a, _b;
-    this.offer = null;
-    this.offer_expires_in = salla.lang.get('pages.products.offer_expires_in');
-    this.remember_my_choice = salla.lang.get('commone.remember_my_choice');
-    this.add_to_cart = salla.lang.get('pages.cart.add_to_cart');
-    this.out_of_stock = salla.lang.get('pages.products.out_of_stock');
-    Helper.Helper.setHost(this.host);
-    salla.lang.onLoaded(() => {
-      this.offer_expires_in = salla.lang.get('pages.products.offer_expires_in');
-      this.remember_my_choice = salla.lang.get('common.elements.remember_my_choice');
-      this.add_to_cart = salla.lang.get('pages.cart.add_to_cart');
-      this.out_of_stock = salla.lang.get('pages.products.out_of_stock');
-    });
-    this.categorySlot = ((_a = Helper.Helper.getElement('[slot="category"]')) === null || _a === void 0 ? void 0 : _a.innerHTML) || '<i class="s-offer-modal-badge-icon sicon-tag"></i><span class="s-offer-modal-badge-text">{name}</span>';
-    this.productSlot = ((_b = Helper.Helper.getElement('[slot="product"]')) === null || _b === void 0 ? void 0 : _b.innerHTML) || this.defaultProductSlot();
-    salla.product.event.onOfferExisted(offer => {
-      if (salla.storage.get('remember-offer-' + offer.id)) {
-        salla.log('User selected to don\'t show this offer again.');
-        return;
-      }
-      this.open(offer.product_id);
-    });
-  }
-  /**
-   * Show the available offers for the product
-   * @param product_id
-   */
-  async open(product_id) {
-    //TODO:: make sure there is only one offer
-    return salla.product.offers(product_id)
-      .then(response => this.showOffer(response.data[0]));
-  }
-  /**
-   * Show offer details
-   * @param {Offer} offer
-   */
-  async showOffer(offer) {
-    this.offer = offer;
-    this.offer_name = offer.name;
-    this.offer_message = offer.message;
-    this.modal.setTitle(this.offer_name);
-    return this.modal.open();
-  }
-  rememberMe(event) {
-    salla.storage.set('remember-offer-' + this.offer.id, event.target.checked);
-  }
-  //todo:: pass event then use sallaButton from it
-  addItem() {
-    // this here, is sallaButton
-    this['load']();
-    return salla.cart.api
-      .quickAdd(this['dataset'].id)
-      .finally(() => this['stop']());
-  }
-  defaultProductSlot() {
-    return '<a href={url} class="s-offer-modal-product-image-wrap"><img class="s-offer-modal-product-image" src="{image}" /></a>' +
-      '<div class="s-offer-modal-product-info">' +
-      '   <a href={url} class="s-offer-modal-product-name">{name}</a>' +
-      '   <div class="s-offer-modal-product-price">{price}</div>' +
-      '</div>';
-  }
-  render() {
-    var _a, _b;
-    return index.h("salla-modal", { id: "salla-offer-modal", "sub-title-first": true, icon: "sicon-special-discount", "sub-title": this.offer_message, ref: modal => this.modal = modal, "is-loading": this.offer === null }, this.offer !== null
-      ? [index.h("div", { class: "s-offer-modal-scrolled-slider-wrap" }, index.h("div", { class: "s-offer-modal-body s-offer-modal-scrolled-slider" }, ((_a = this.offer.get.categories) === null || _a === void 0 ? void 0 : _a.length) > 0
-          ? this.offer.get.categories.map(category => index.h("a", { href: category.urls.customer, class: "s-offer-modal-badge s-offer-modal-slider-item", innerHTML: this.categorySlot
-              .replace(/\{name\}/g, category.name)
-              .replace(/\{url\}/g, category.urls.customer) }))
-          : (_b = this.offer.get.products) === null || _b === void 0 ? void 0 : _b.map(product => index.h("div", { class: { "s-offer-modal-product": true, "s-offer-modal-slider-item": true, "s-offer-modal-not-available": !product.is_available }, id: 'product_' + product.id, innerHTML: this.productSlot
-              .replace(/\{name\}/g, product.name)
-              .replace(/\{url\}/g, product.url)
-              .replace(/\{image\}/g, product.thumbnail)
-              .replace(/\{price\}/g, product.has_special_price
-              ? salla.money(product.price) + '<span class="s-offer-modal-product-old-price">' + salla.money(product.regular_price) + '</span>'
-              : salla.money(product.price)) }, index.h("div", { class: "s-offer-modal-btn-wrap" }, index.h("salla-button", { width: "wide", fill: 'outline', "data-id": product.id, disabled: !product.is_available, "loader-position": "center", onClick: this.addItem }, product.is_available ? this.add_to_cart : this.out_of_stock))))), index.h("div", { class: "s-offer-modal-slider-nav" }, index.h("button", { class: "s-offer-modal-nav-btn s-offer-modal-prev-btn" }, index.h("span", { class: "s-offer-modal-nav-btn-icon sicon-keyboard_arrow_left" })), index.h("button", { class: "s-offer-modal-nav-btn s-offer-modal-next-btn" }, index.h("span", { class: "s-offer-modal-nav-btn-icon sicon-keyboard_arrow_right" })))), index.h("div", { class: "s-offer-modal-footer", slot: "footer" }, this.offer.formatted_date ?
-          index.h("p", { class: "s-offer-modal-expiry" }, this.offer_expires_in, " ", this.offer.formatted_date)
-          : '', index.h("label", { class: "s-offer-modal-remember-label" }, index.h("input", { type: "checkbox", onChange: e => this.rememberMe(e), class: "s-offer-modal-remember-input" }), "\u00A0 ", this.remember_my_choice)),
-      ] : '');
-  }
-  componentDidRender() {
-    // Sooo mini Slider
-    if (this.offer && window.screen.width > 639) {
-      let sliderWrap = this.modal.querySelector('.s-offer-modal-scrolled-slider-wrap'), slider = this.modal.querySelector('.s-offer-modal-scrolled-slider'), navButtons = this.modal.querySelectorAll('.s-offer-modal-nav-btn'), nexBtn = this.modal.querySelector('.s-offer-modal-next-btn'), prevBtn = this.modal.querySelector('.s-offer-modal-prev-btn'), items = this.modal.querySelectorAll('.s-offer-modal-slider-item'), sliderNavMargin = 20, // space before displaying the next/prev btns.
-      current = 0, // current slide
-      slidesToScroll = 3, itemsLength = items.length;
-      console.log('items[0]:', items[0]);
-      let itemSize = items[0].offsetWidth, sliderSize = itemsLength * itemSize, sliderWrapperSize = sliderWrap.offsetWidth, sliderInvisibleSize = sliderSize - sliderWrapperSize, isRTL = document.body.classList.contains('rtl') ? true : false;
-      if (sliderInvisibleSize > sliderNavMargin)
-        nexBtn.classList.add('s-offer-modal-btn-is-active');
-      window.onresize = function () {
-        sliderWrapperSize = sliderWrap.offsetWidth;
-        sliderInvisibleSize = sliderSize - sliderWrapperSize;
-      };
-      slider.addEventListener('scroll', function () {
-        let sliderPosition = Math.abs(slider.scrollLeft);
-        let sliderEndOffset = sliderInvisibleSize - sliderNavMargin;
-        // show & hide the navigation btns depending on scroll position
-        if (sliderPosition <= sliderNavMargin) {
-          nexBtn.classList.add('s-offer-modal-btn-is-active');
-          prevBtn.classList.remove('s-offer-modal-btn-is-active');
-        }
-        else if (sliderPosition < sliderEndOffset) {
-          // show both btns in the middle
-          nexBtn.classList.add('s-offer-modal-btn-is-active');
-          prevBtn.classList.add('s-offer-modal-btn-is-active');
-        }
-        else if (sliderPosition >= sliderEndOffset) {
-          nexBtn.classList.remove('s-offer-modal-btn-is-active');
-          prevBtn.classList.add('s-offer-modal-btn-is-active');
-        }
-      });
-      // Navigation
-      navButtons.forEach(btn => {
-        btn.addEventListener('click', function () {
-          btn.classList.contains('s-offer-modal-next-btn') ? current++ : current--;
-          slider.scrollTo({
-            top: 0,
-            left: itemSize * slidesToScroll * current * (isRTL ? -1 : 1),
-            behavior: 'smooth'
-          });
-        });
-      });
-    }
-  }
-  get host() { return index.getElement(this); }
-};
-SallaOfferModal.style = sallaOfferModalCss;
-
-exports.salla_offer_modal = SallaOfferModal;

package/dist/cjs/salla-rating-modal.cjs.entry.js

@@ -1,177 +0,0 @@
-/*!
- * Crafted with ❤ by Salla
- */
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-3771e52a.js');
-const Helper = require('./Helper-8ae6a805.js');
-
-const sallaRatingModalCss = "";
-
-const SallaRatingModal = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.stepsCount = 0;
-    this.currentIndex = 0;
-    this.submitted = [];
-    /**
-     * The order id, to rate on its products & shipping
-     */
-    this.orderId = salla.config.get('page.id');
-    this.rate_the_store = salla.lang.get('pages.rating.rate_the_store');
-    this.write_store_rate = salla.lang.get('pages.rating.write_store_rate');
-    this.rate_product_stars = salla.lang.get('pages.rating.rate_product_stars');
-    this.write_product_rate = salla.lang.get('pages.rating.write_product_rate');
-    this.rate_shipping = salla.lang.get('pages.rating.rate_shipping');
-    this.write_shipping_rate = salla.lang.get('pages.rating.write_shipping_rate');
-    this.thanks = salla.lang.get('pages.rating.thanks');
-    this.back = salla.lang.get('common.elements.back');
-    this.next = salla.lang.get('common.elements.next');
-    Helper.Helper.setHost(document);
-    salla.event.on('rating::open', () => this.open());
-    salla.lang.onLoaded(() => {
-      this.rate_the_store = salla.lang.get('pages.rating.rate_the_store');
-      this.write_store_rate = salla.lang.get('pages.rating.write_store_rate');
-      this.rate_product_stars = salla.lang.get('pages.rating.rate_product_stars');
-      this.write_product_rate = salla.lang.get('pages.rating.write_product_rate');
-      this.rate_shipping = salla.lang.get('pages.rating.rate_shipping');
-      this.write_shipping_rate = salla.lang.get('pages.rating.write_shipping_rate');
-      this.thanks = salla.lang.get('pages.rating.thanks');
-      this.back = salla.lang.get('common.elements.back');
-      this.next = salla.lang.get('common.elements.next');
-    });
-  }
-  /**
-   * Show the rating modal
-   */
-  async open() {
-    return this.modal.open()
-      .then(() => this.order || salla.rating.api.order(this.orderId).then(res => this.order = res.data))
-      .then(() => this.modal.setTitle(salla.lang.get('pages.rating.rate_order') + ' <span class="unicode">(#' + this.order.id + ')</span>'))
-      .then(() => this.modal.stopLoading())
-      .then(() => this.stepsCount = [this.order.testimonials_enabled, this.order.products_enabled, this.order.shipping_enabled].filter(enabled => enabled).length)
-      .then(() => setTimeout(() => this.handleWizard(), 100));
-  }
-  /**
-   * Show the rating modal
-   */
-  async close() {
-    return this.modal.close();
-  }
-  // handle wizard
-  handleWizard() {
-    this.steps = this.modal.querySelectorAll(".s-rating-modal-step");
-    this.dots = this.modal.querySelectorAll(".s-rating-modal-step-dot");
-    this.showActiveStep();
-  }
-  showActiveStep(current = null) {
-    var _a;
-    this.currentTab = current || this.steps[this.currentIndex];
-    Helper.Helper.toggleClassIf('.s-rating-modal-step-dot', 's-rating-modal-bg-gray', 's-rating-modal-bg-primary', dot => dot != this.dots[this.currentIndex])
-      .toggleClassIf('.s-rating-modal-step', 's-rating-modal-active', 's-rating-modal-hidden', tab => tab == this.currentTab);
-    if (this.currentIndex != 0) {
-      // the animation
-      Helper.Helper.toggleElementClassIf(this.currentTab, 's-rating-modal-unactive', 's-rating-modal-hidden', () => true);
-      setTimeout(() => Helper.Helper.toggleElementClassIf(this.currentTab, 's-rating-modal-active', 's-rating-modal-unactive', () => true), 300);
-    }
-    // Btn text
-    let nextType = (_a = this.steps[this.currentIndex + 1]) === null || _a === void 0 ? void 0 : _a.dataset.type;
-    this.nextBtn.setText(nextType ? salla.lang.get('pages.rating.rate') + ' ' + salla.lang.get('pages.rating.' + nextType)
-      : salla.lang.get('pages.rating.send_ratings'));
-    setTimeout(() => { var _a; return this.body.setAttribute('style', 'height:' + ((_a = this.currentTab) === null || _a === void 0 ? void 0 : _a.scrollHeight) + 'px'); });
-  }
-  previousTab() {
-    this.currentIndex > 0 && this.currentIndex--;
-    Helper.Helper.toggleElementClassIf(this.backBtn, 's-rating-modal-unvisiable', 'block', () => this.currentIndex == 0);
-    this.showActiveStep();
-  }
-  submit() {
-    this.submittedBefore() || this.validate();
-    salla.config.canLeave = false;
-    this.nextBtn.load()
-      .then(() => this.submittedBefore() || this.sendFeedback())
-      .then(() => this.currentTab.querySelectorAll('[name],.s-rating-modal-btn-star').forEach(el => el.setAttribute('disabled', '')))
-      .then(() => this.currentIndex < this.stepsCount && this.currentIndex++)
-      .then(() => this.showActiveStep())
-      .then(() => Helper.Helper.toggleClassIf('#prev-btn', 'block', 's-rating-modal-unvisiable', () => true))
-      .finally(() => {
-      this.nextBtn.stop();
-      salla.config.canLeave = true;
-      this.currentIndex == this.stepsCount && this.showThankYou();
-      this.modal.isClosable = false;
-    });
-  }
-  submittedBefore() {
-    return this.submitted.includes(this.currentIndex);
-  }
-  validate(rating = null, type = null) {
-    if (!rating && this.currentTab.dataset.type == 'products') {
-      return this.currentTab.querySelectorAll('.rating-outer-form').forEach(rating => this.validate(rating, 'product'));
-    }
-    rating = rating || this.currentTab;
-    let stars = rating.querySelector('.rating_hidden_input').value;
-    let comment = rating.querySelector('.s-rating-modal-comment');
-    let validationMessage = rating.querySelector('.s-rating-modal-validation-msg');
-    if (stars && comment.value && comment.value.length > 3) {
-      comment.classList.remove('s-has-error');
-      validationMessage.innerHTML = '';
-      return;
-    }
-    type = type || rating['dataset'].type;
-    Helper.Helper.toggleElementClassIf(comment, 'save', 's-has-error', el => el.value.length > 3);
-    throw validationMessage.innerHTML = stars
-      ? (salla.lang.get('common.errors.not_less_than_chars', { chars: 4 }) + ' ' + comment.getAttribute('placeholder'))
-      : salla.lang.get(`pages.rating.rate_${type}_stars`).replace(' (:item)', '');
-  }
-  sendFeedback() {
-    let data = {};
-    this.currentTab.querySelectorAll('[name]').forEach((input) => {
-      //decode names like `<input name="jamal[inner]" value="hi">` to be {name:jamal, value: {inner:"hi"}}
-      let inputData = salla.helpers.inputData(input.name, input.value, data);
-      data[inputData.name] = inputData.value;
-    });
-    if (Object.keys(data).length == 0) {
-      return;
-    }
-    data['order_id'] = this.orderId;
-    data['type'] = this.currentTab.dataset.type;
-    this.submitted.push(this.currentIndex);
-    return salla.rating.api[this.currentTab.dataset.type](data);
-  }
-  showThankYou() {
-    let seconds = 10;
-    let timeToClose = setInterval(() => {
-      this.thanksTime.innerHTML = '00:0' + (seconds--);
-      if (seconds > 0) {
-        return;
-      }
-      clearInterval(timeToClose);
-      this.thanksTime.remove();
-      this.close().then(() => window.location.reload());
-    }, 1000);
-    this.modal.querySelector('.s-rating-modal-footer').classList.add('s-rating-modal-unvisiable');
-    this.showActiveStep(this.thanksTab);
-  }
-  render() {
-    return (index.h(index.Host, { id: "s-rating" }, index.h("salla-modal", { isLoading: true, width: "md", ref: modal => this.modal = modal }, this.order
-      ? [index.h("div", { class: "s-rating-modal-wrapper", ref: el => this.body = el }, this.order.testimonials_enabled ?
-          index.h("div", { class: "rating-outer-form s-rating-modal-step-wrap s-rating-modal-step s-rating-modal-hidden", "data-type": "store" }, index.h("div", { class: "s-rating-modal-rounded-icon" }, index.h("img", { src: salla.config.get('store.logo', 'https://assets.salla.sa/cp/assets/images/logo-new.png'), alt: "store name", class: "s-rating-modal-store-logo" })), index.h("h2", { class: "s-rating-modal-title" }, this.rate_the_store), index.h("div", { class: "s-rating-modal-stars-company" }, index.h("salla-rating-stars", { size: "large" })), index.h("textarea", { id: "storeReview", name: "comment", class: "s-rating-modal-comment", placeholder: this.write_store_rate }), index.h("small", { class: "s-rating-modal-validation-msg" }))
-          : '', this.order.products_enabled
-          ? index.h("section", { class: "s-rating-modal-step s-rating-modal-hidden", "data-type": "products" }, this.order.products.map((item, index$1) => index.h("div", { class: "rating-outer-form s-rating-modal-product", "data-stars-error": this.rate_product_stars }, index.h("div", { class: "s-rating-modal-product-img-wrap" }, index.h("img", { src: item.product.thumbnail, alt: item.product.name, class: "s-rating-modal-product-img" })), index.h("div", { class: "s-rating-modal-product-details" }, index.h("h3", { class: "s-rating-modal-product-title" }, " ", item.product.name), index.h("div", { class: "s-rating-modal-stars-product" }, index.h("salla-rating-stars", { size: "small", name: `products[${index$1}][rating]` })), index.h("input", { type: "hidden", name: `products[${index$1}][product_id]`, value: item.product.id }), index.h("textarea", { placeholder: this.write_product_rate, name: `products[${index$1}][comment]`, class: "s-rating-modal-comment" }), index.h("small", { class: "s-rating-modal-validation-msg" })))))
-          : '', this.order.shipping_enabled
-          ? index.h("div", { class: "rating-outer-form s-rating-modal-step-wrap s-rating-modal-step s-rating-modal-hidden", "data-type": "shipping" }, index.h("input", { type: "hidden", name: "shipping_company_id", value: this.order.shipping.company.id }), this.order.shipping.company.logo
-            ? index.h("div", { class: "s-rating-modal-rounded-icon" }, index.h("img", { src: this.order.shipping.company.logo, class: "s-rating-modal-shipping-logo", alt: this.order.shipping.company.name }))
-            : index.h("span", { class: "s-rating-modal-icon sicon-shipping-fast" }), index.h("div", { class: "s-rating-modal-title" }, " ", this.rate_shipping + ' ' + this.order.shipping.company.name), index.h("div", { class: "s-rating-modal-stars-company" }, index.h("salla-rating-stars", { size: "large" })), index.h("textarea", { name: "comment", class: "s-rating-modal-comment", placeholder: this.write_shipping_rate }), index.h("small", { class: "s-rating-modal-validation-msg" }))
-          : '', index.h("div", { class: "s-rating-modal-thanks s-rating-modal-hidden", ref: el => this.thanksTab = el }, index.h("span", { class: "s-rating-modal-icon sicon-check-circle2" }), index.h("h3", { class: "s-rating-modal-thanks-title" }, this.thanks), index.h("div", { class: "s-rating-modal-thanks-msg", innerHTML: this.order.thanks_message }), index.h("time", { class: "s-rating-modal-thanks-time", ref: el => this.thanksTime = el }))), index.h("div", { class: "s-rating-modal-footer" }, index.h("button", { ref: el => this.backBtn = el, onClick: () => this.previousTab(), class: "s-rating-modal-btn s-rating-modal-unvisiable" }, this.back), this.stepsCount > 1 ? index.h("ul", { class: "s-rating-modal-dots" }, [0, 1, 2].slice(0, this.stepsCount).map(() => index.h("li", { class: 's-rating-modal-bg-gray s-rating-modal-step-dot' }))) : '', index.h("salla-button", { "loader-position": 'center', ref: el => this.nextBtn = el, onClick: () => this.submit() }, this.next)),]
-      : '')));
-  }
-  componentDidLoad() {
-    salla.event.dispatch('rating::ready', this);
-  }
-  get host() { return index.getElement(this); }
-};
-SallaRatingModal.style = sallaRatingModalCss;
-
-exports.salla_rating_modal = SallaRatingModal;

package/dist/cjs/salla-rating-stars.cjs.entry.js

@@ -1,76 +0,0 @@
-/*!
- * Crafted with ❤ by Salla
- */
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-3771e52a.js');
-const Helper = require('./Helper-8ae6a805.js');
-
-const sallaRatingStarsCss = "";
-
-const SallaRatingStars = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.name = 'rating';
-    this.size = 'medium';
-  }
-  initiateRating() {
-    this.host.addEventListener('click', () => {
-      if (!this.startsElem)
-        return;
-      // Get the selected star - activeElement is not supported in safari
-      let activeStars = this.startsElem.querySelectorAll('.s-rating-stars-hovered');
-      let selected = activeStars[activeStars.length - 1];
-      if (!selected)
-        return;
-      let selectedIndex = selected.getAttribute('data-star');
-      this.startsElem.querySelector('.rating_hidden_input').value = selectedIndex;
-      // Loop through each star, and add or remove the `.selected` class to toggle highlighting
-      this.startsElem.querySelectorAll('.s-rating-stars-btn-star')
-        .forEach((star, index) => Helper.Helper.toggleElementClassIf(star, 's-rating-stars-selected', 's-rating-stars-unselected', () => index < parseInt(selectedIndex)));
-      // update aria-pressed attr status
-      this.startsElem.querySelectorAll('[aria-pressed]').forEach(star => star.removeAttribute('aria-pressed'));
-      selected.setAttribute('aria-pressed', 'true');
-    });
-  }
-  highlightSelectedStars() {
-    var _a, _b;
-    let hoveredClass = 's-rating-stars-hovered', stars = (_a = this.startsElem) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.s-rating-stars-btn-star');
-    stars === null || stars === void 0 ? void 0 : stars.forEach((star, index) => {
-      star.addEventListener('mouseover', () => {
-        for (let i = 0; i <= index; i++) {
-          stars[i].classList.add(hoveredClass);
-        }
-      });
-      star.addEventListener('mouseout', () => star.classList.remove(hoveredClass));
-    });
-    (_b = this.startsElem) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseout', () => stars.forEach(star => star.classList.remove(hoveredClass)));
-  }
-  createStars(n) {
-    let stars = [];
-    for (let i = 0; i < 5; i++) {
-      stars.push(index.h("span", { class: {
-          's-rating-stars-btn-star sicon-star2': true,
-          ['s-rating-stars-' + this.size]: true,
-          's-rating-stars-selected': i < n
-        } }));
-    }
-    return stars;
-  }
-  render() {
-    return (index.h(index.Host, null, this.value ?
-      index.h("div", { class: "s-rating-stars-wrapper" }, " ", this.createStars(this.value), " ")
-      :
-        index.h("div", { class: "s-rating-stars-element", ref: (el) => this.startsElem = el }, index.h("input", { type: "hidden", class: "rating_hidden_input", name: this.name, value: "" }), [1, 2, 3, 4, 5].map(star => index.h("button", { class: `s-rating-stars-btn-star s-rating-stars-` + this.size, "data-star": star }, index.h("i", { class: "sicon-star2" }))))));
-  }
-  componentDidLoad() {
-    this.initiateRating();
-    this.highlightSelectedStars();
-  }
-  get host() { return index.getElement(this); }
-};
-SallaRatingStars.style = sallaRatingStarsCss;
-
-exports.salla_rating_stars = SallaRatingStars;

package/dist/cjs/salla-verify.cjs.entry.js

@@ -1,168 +0,0 @@
-/*!
- * Crafted with ❤ by Salla
- */
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-3771e52a.js');
-const Helper = require('./Helper-8ae6a805.js');
-
-const sallaVerifyCss = "salla-verify{display:block}";
-
-const SallaVerify = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.verified = index.createEvent(this, "verified", 7);
-    this.initiated = false;
-    /**
-     * Should render component without modal
-     */
-    this.display = 'modal';
-    /**
-     * Verifying method
-     */
-    this.type = 'mobile';
-    /**
-     * should auto reloading the page after success verification
-     */
-    this.autoReload = true;
-    this.resendAfter = 30;
-    /**
-     * to use: `salla.api.auth.verify` or `salla.profile.verify`
-     */
-    this.isProfileVerify = false;
-    // Helper.setHost(this.host);
-    salla.lang.onLoaded(() => {
-      var _a, _b;
-      this.title = salla.lang.get('pages.profile.verify_title') + salla.lang.get('common.elements.' + this.type);
-      (_a = this.modal) === null || _a === void 0 ? void 0 : _a.setTitle(this.title);
-      (_b = this.btn) === null || _b === void 0 ? void 0 : _b.setText(salla.lang.get('pages.profile.verify'));
-    });
-    if (this.display == 'inline') {
-      this.modal = { open: () => '', close: () => '', setTitle: () => '' };
-      return;
-    }
-    salla.event.on('profile::verification', data => {
-      var _a;
-      this.isProfileVerify = true;
-      this.open(data);
-      this.title = salla.lang.get('pages.profile.verify_title') + salla.lang.get('common.elements.' + data.type);
-      (_a = this.modal) === null || _a === void 0 ? void 0 : _a.setTitle(this.title);
-    });
-    salla.event.on('modalClosed', () => {
-      this.resendAfter = 0;
-      this.timer.innerHTML = '30 : 00';
-    });
-  }
-  /**
-   * Get current code
-   * @return {string}
-   */
-  async getCode() {
-    return this.code.value;
-  }
-  /**
-   * Open verifying modal
-   * @param data
-   */
-  async open(data) {
-    var _a;
-    this.data = data;
-    this.data.type = this.data.type || this.type;
-    this.type = this.data.type;
-    this.resendTimer();
-    this.otpInputs = this.body.querySelectorAll('.s-verify-input');
-    if (!this.initiated) {
-      Helper.Helper.on('input', '.s-verify-input', e => salla.helpers.inputDigitsOnly(e.target));
-      Helper.Helper.onKeyUp('.s-verify-input', event => {
-        var _a, _b, _c, _d;
-        let key = event.keyCode || event.charCode;
-        if (event.target.value) {
-          (_a = event.target.nextElementSibling) === null || _a === void 0 ? void 0 : _a.focus();
-          (_b = event.target.nextElementSibling) === null || _b === void 0 ? void 0 : _b.select();
-        }
-        else if ([8, 46].includes(key)) {
-          (_c = event.target.previousElementSibling) === null || _c === void 0 ? void 0 : _c.focus();
-          (_d = event.target.previousElementSibling) === null || _d === void 0 ? void 0 : _d.select();
-        }
-        this.toggleOTPSubmit();
-      });
-      Helper.Helper.on('paste', '.s-verify-input', event => {
-        let text = salla.helpers.number(event.clipboardData.getData('text')).replace(/[^0-9.]/g, '').replace('..', '.');
-        this.otpInputs.forEach((input, i) => input.value = text[i] || '');
-        this.toggleOTPSubmit();
-        setTimeout(() => this.otpInputs[3].focus(), 100);
-      });
-      // return this.modal.open();
-      this.initiated = true;
-    }
-    this.reset();
-    this.display == 'modal' && ((_a = this.modal) === null || _a === void 0 ? void 0 : _a.setTitle(this.title));
-    this.modal.open();
-    // focus the first input after opening the modal
-    setTimeout(() => this.otpInputs[0].focus(), 100);
-  }
-  toggleOTPSubmit() {
-    let otp = [];
-    this.otpInputs.forEach(input => input.value && otp.push(input.value));
-    this.code.value = otp.join('');
-    if (otp.length === 4) {
-      this.btn.removeAttribute('disabled');
-      this.btn.click();
-      return;
-    }
-    this.btn.setAttribute('disabled', '');
-  }
-  reset() {
-    this.otpInputs.forEach((input) => input.value = '');
-    this.code.value = '';
-    this.otpInputs[0].focus();
-  }
-  resendTimer() {
-    Helper.Helper.showElement(this.resendMessage).hideElement(this.resend);
-    this.resendAfter = 30;
-    let timerId = setInterval(() => {
-      if (this.resendAfter <= 0) {
-        clearInterval(timerId);
-        Helper.Helper.hideElement(this.resendMessage).showElement(this.resend);
-      }
-      else {
-        this.timer.innerHTML = `${this.resendAfter >= 10 ? this.resendAfter : '0' + this.resendAfter} : 00`;
-        this.resendAfter--;
-      }
-    }, 1000);
-  }
-  resendCode() {
-    return this.btn.stop()
-      .then(() => this.btn.disable())
-      .then(() => {
-      this.otpInputs.forEach(input => input.value = '');
-      this.otpInputs[0].focus();
-    })
-      .then(() => salla.api.auth.resend(this.data))
-      .finally(() => this.resendTimer());
-  }
-  submit() {
-    let data = Object.assign({ code: this.code.value }, this.data);
-    return this.btn.load()
-      .then(() => this.btn.disable())
-      .then(() => this.isProfileVerify ? salla.profile.verify(data) : salla.auth.verify(data, true))
-      .then(response => this.verified.emit(response))
-      .then(() => this.btn.stop() && this.btn.disable())
-      .then(() => this.modal.close())
-      .then(() => this.autoReload && window.location.reload())
-      .catch(() => this.btn.stop() && this.btn.enable() && this.reset());
-  }
-  render() {
-    return this.display == 'inline' ? index.h(index.Host, null, this.myBody()) :
-      index.h("salla-modal", { icon: "sicon-android-phone", width: "xs", class: "s-verify", ref: modal => this.modal = modal, "modal-title": this.title }, this.myBody());
-  }
-  myBody() {
-    return (index.h("div", { class: "s-verify-body", ref: body => this.body = body }, index.h("div", { class: "s-verify-message", innerHTML: salla.lang.get('pages.profile.verify_message') }), index.h("input", { type: "hidden", name: "code", maxlength: "4", required: true, ref: code => this.code = code }), index.h("div", { class: "s-verify-codes", dir: "ltr" }, [1, 2, 3, 4].map(() => index.h("input", { type: "text", maxlength: "1", class: "s-verify-input", required: true }))), index.h("div", { slot: "footer", class: "s-verify-footer" }, index.h("salla-button", { class: "s-verify-submit", "loader-position": 'center', disabled: true, onClick: () => this.submit(), ref: b => this.btn = b }, salla.lang.get('pages.profile.verify')), index.h("p", { class: "s-verify-resend-message", ref: el => this.resendMessage = el }, salla.lang.get('blocks.header.resend_after'), index.h("b", { class: "s-verify-timer", ref: el => this.timer = el })), index.h("a", { href: "#", class: "s-verify-resend", onClick: () => this.resendCode(), ref: el => this.resend = el }, salla.lang.get('blocks.comments.submit'))), index.h("slot", { name: "after-footer" })));
-  }
-  get host() { return index.getElement(this); }
-};
-SallaVerify.style = sallaVerifyCss;
-
-exports.salla_verify = SallaVerify;

package/dist/esm/salla-branches.entry.js

@@ -1,90 +0,0 @@
-/*!
- * Crafted with ❤ by Salla
- */
-import { r as registerInstance, h, g as getElement } from './index-ee729716.js';
-
-const sallaBranchesCss = "";
-
-const SallaBranches = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.open = false;
-    this.isOpenedBefore = salla.storage.get("branch-choosed-before");
-    this.displayAs = 'default'; //todo:: change it to boolean, isPopup default false
-    this.browseProductsFrom = 'all'; //todo:: get better name
-    this.branches = [
-      { id: 1, name: 'فرع الرياض', open: true, available: true, limited: false, tag: 'متوفر' },
-      { id: 2, name: 'فرع جدة', open: false, available: false, limited: false, tag: 'غير متوفر' },
-      { id: 3, name: 'فرع مكة', open: true, available: true, limited: false, tag: 'متوفر' },
-      { id: 4, name: 'فرع المدينة', open: true, available: true, limited: false, tag: 'متوفر' },
-      { id: 5, name: 'فرع جازان', open: true, available: true, limited: true, tag: 'الكمية محدودة' }
-    ];
-    this.current = 1;
-    this.currentBranch = (prop) => {
-      return this.branches.filter((el) => el.id == this.current)[0][prop];
-    };
-    this.statusColor = (branch = null) => {
-      return branch ?
-        branch.limited ? 's-branches-color-red' : branch.available ? 's-branches-color-green' : 's-branches-color-gray'
-        :
-          this.currentBranch('limited') ? 's-branches-color-red' : this.currentBranch('available') ? 's-branches-color-green' : 's-branches-color-gray';
-    };
-    this.isChoiceable = () => {
-      return (this.browseProductsFrom !== 'all' && this.position == 'single') || this.position == 'header';
-    };
-    this.formTitle = () => {
-      return this.isChoiceable() ?
-        'توفر المنتج في الفروع الآخرى'
-        : 'التسوق من فرع آخر';
-    };
-    salla.event.on('branches::show', btn => btn.dataset.target == this.host.id && this.show());
-    salla.lang.onLoaded(() => { var _a; return (_a = this.btn) === null || _a === void 0 ? void 0 : _a.setText(salla.lang.get('common.elements.ok')); });
-  }
-  //todo:: add description for all @methods
-  async show() {
-    return this.modal.open();
-  }
-  async hide() {
-    return this.modal.close();
-  }
-  handelChange(event) {
-    this.selected = event.target.value;
-  }
-  handleSubmit() {
-    this.btn.load().then(() => {
-      setTimeout(() => location.reload(), 2000);
-    });
-    salla.storage.set("branch-choosed-before", true);
-    this.show();
-    setTimeout(() => {
-      this.current = this.selected;
-    }, 300);
-  }
-  render() {
-    return (h("salla-modal", { icon: "sicon-store-alt", "modal-title": "\u0641\u0631\u0639 \u0627\u0644\u0631\u064A\u0627\u0636", "sub-title": "\u0623\u0646\u062A \u0627\u0644\u0622\u0646 \u062A\u062A\u0635\u0641\u062D \u0627\u0644\u0645\u062A\u062C\u0631 \u0645\u0646", "sub-title-first": true, "is-closable": !this.isOpenedBefore && this.displayAs == 'popup' ? 'false' : 'true', ref: modal => this.modal = modal, width: "sm", id: "s-branches-modal", class: "s-hidden" }, h("h4", { class: "s-branches-title" }, this.formTitle()), this.branches.length <= 5 ?
-      h("div", { class: "s-branches-space-v" }, this.branches.map((branch) => h("div", { class: "s-branches-input-wrap" }, h("input", { id: this.position + '_branch_' + branch.id, disabled: !branch.open && this.isChoiceable(), name: "lang", type: "radio", value: branch.id, onChange: (event) => this.handelChange(event), class: {
-          's-branches-input': true,
-          'opacity-50': !branch.open,
-          's-hidden': !this.isChoiceable()
-        }, checked: this.current == branch.id }), h("label", { htmlFor: this.position + '_branch_' + branch.id, class: {
-          's-branches-label': true,
-          's-branches-clickable': this.isChoiceable()
-        } }, h("span", { class: { 's-branches-is-closed': !branch.open } }, branch.name), this.isChoiceable() ?
-        h("small", { class: "s-branches-closed-badge" }, branch.open ? '' : 'مُغلق')
-        :
-          h("span", { class: this.statusColor(branch) }, branch.tag)))))
-      :
-        h("select", { class: "s-branches-select", onInput: (event) => this.handelChange(event) }, this.branches.map(branch => (h("option", { value: branch.id, disabled: !branch.open, selected: this.selected == branch.id }, branch.name, " ", branch.open ? '' : '- مُغلق')))), this.isChoiceable() ?
-      h("slot", { name: "footer" }, h("salla-button", { ref: btn => this.btn = btn, onClick: () => this.handleSubmit(), class: "s-branches-submit", width: "wide" }, salla.lang.get('common.elements.ok')))
-      : ''));
-  }
-  componentDidRender() {
-    if (!this.isOpenedBefore && this.displayAs == 'popup') {
-      this.show();
-    }
-  }
-  get host() { return getElement(this); }
-};
-SallaBranches.style = sallaBranchesCss;
-
-export { SallaBranches as salla_branches };