@salla.sa/twilight-components 1.4.5 → 1.4.7

package/dist/cjs/loader.cjs.js

@@ -17,7 +17,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["salla-button_23.cjs",[[4,"salla-loyalty",{"prizePoints":[8,"prize-points"],"customerPoints":[2,"customer-points"],"prizeTitle":[1,"prize-title"],"allowEmail":[4,"allow-email"],"allowMobile":[4,"allow-mobile"],"requireEmail":[4,"require-email"],"guestMessage":[1,"guest-message"],"loyaltyProgram":[32],"buttonLoading":[32],"selectedItem":[32],"askConfirmation":[32],"is_loggedin":[32],"points":[32],"exchange_points":[32],"are_you_sure_to_exchange":[32],"for":[32],"cancel":[32],"confirm":[32],"cart_total_point_summary":[32],"cart_point_exchange_now":[32],"login_button":[32],"open":[64],"close":[64],"resetExchange":[64],"exchangeLoyaltyPoint":[64]}],[4,"salla-product-size-guide",{"guides":[32],"productId":[32],"open":[64],"close":[64]}],[4,"salla-login-modal",{"isEmailAllowed":[1028,"is-email-allowed"],"isMobileAllowed":[1028,"is-mobile-allowed"],"isEmailRequired":[1028,"is-email-required"],"title":[32],"loginTypeTitle":[32],"loginText":[32],"smsLabel":[32],"mobileLabel":[32],"emailLabel":[32],"enterText":[32],"bySMSText":[32],"byEmailText":[32],"emailErrorMsg":[32],"firstNameLabel":[32],"lastNameLabel":[32],"firstNameErrorMsg":[32],"lastNameErrorMsg":[32],"open":[64]},[[8,"verified","onVerified"]]],[4,"salla-scopes",{"position":[1],"searchFieldToggler":[2,"search-field-toggler"],"mode":[32],"current_scope":[32],"scopes":[32],"originalScopesList":[32],"branchNotFound":[32],"ourServiceIsNotFound":[32],"searchForAvailabilityInOtherBranch":[32],"shoppingFromAnotherBranch":[32],"nowBrowsingFrom":[32],"confirmButton":[32],"scopeSearchPlaceholder":[32],"selected_scope":[32],"isDefault":[32],"isOpenedBefore":[32],"close":[64],"open":[64],"handleSubmit":[64]}],[0,"salla-rating-modal",{"orderId":[2,"order-id"],"order":[32],"open":[64],"close":[64]}],[0,"salla-localization-modal",{"language":[1537],"currency":[1537],"languages":[32],"currencies":[32],"languagesTitle":[32],"currenciesTitle":[32],"isLoading":[32],"open":[64],"close":[64],"submit":[64]}],[0,"salla-offer-modal",{"offer":[32],"offer_name":[32],"offer_message":[32],"offer_expires_in":[32],"remember_my_choice":[32],"add_to_cart":[32],"out_of_stock":[32],"open":[64],"showOffer":[64]}],[0,"salla-search",{"inline":[4],"oval":[4],"height":[2],"results":[32],"placeholder":[32],"noResultsText":[32],"typing":[32],"debounce":[32],"search_term":[32]}],[4,"salla-social-share",{"url":[513],"urlName":[513,"url-name"],"platforms":[16],"opened":[32],"allPlatforms":[32],"platformIcons":[32],"open":[64]}],[4,"salla-infinite-scroll",{"nextPage":[1,"next-page"],"autoload":[1028],"container":[1],"item":[1],"loadMore":[32],"noMore":[32],"failedToLoad":[32]}],[0,"salla-product-availability",{"channels":[1],"productId":[2,"product-id"],"isSubscribed":[1028,"is-subscribed"],"subTitle":[32],"mobileLabel":[32],"emailLabel":[32],"emailPlaceholder":[32],"subscribedMessage":[32],"title_":[32],"emailErrorMsg":[32],"isVisitorSubscribed":[32]}],[4,"salla-verify",{"display":[1],"type":[1025],"autoReload":[4,"auto-reload"],"title":[32],"resendAfter":[32],"isProfileVerify":[32],"getCode":[64],"open":[64]}],[4,"salla-swiper",{"loop":[4],"speed":[2],"itemPerView":[8,"item-per-view"],"spaceBetweenItems":[2,"space-between-items"],"direction":[1],"currentIndex":[32],"isLastSlideItem":[32],"isFirstSlideItem":[32]}],[0,"salla-rating-stars",{"name":[1],"size":[1],"value":[2]}],[4,"salla-list-tile",{"href":[1],"target":[1]}],[4,"salla-tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}],[4,"salla-tab-header",{"name":[1],"activeClass":[1,"active-class"],"height":[8],"centered":[4],"isSelected":[32],"getChild":[64]}],[4,"salla-tabs",{"backgroundColor":[1,"background-color"],"vertical":[4]},[[0,"onSelect","onSelectedTab"]]],[4,"salla-placeholder",{"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"],"default_title":[32],"default_description":[32]}],[0,"salla-tel-input",{"phone":[1025],"name":[1],"countryCode":[1025,"country-code"],"mobileRequired":[32],"countryCodeLabel":[32],"mobileLabel":[32],"tooShort":[32],"tooLong":[32],"invalidCountryCode":[32],"invalidNumber":[32],"errorMap":[32],"getValues":[64],"isValid":[64]}],[4,"salla-modal",{"isClosable":[1028,"is-closable"],"width":[513],"position":[513],"visible":[516],"isLoading":[1540,"is-loading"],"subTitleFirst":[4,"sub-title-first"],"noPadding":[4,"no-padding"],"subTitle":[1,"sub-title"],"icon":[1],"iconStyle":[1,"icon-style"],"imageIcon":[1,"image-icon"],"modalTitle":[32],"open":[64],"close":[64],"setTitle":[64],"loading":[64],"stopLoading":[64]}],[4,"salla-button",{"shape":[513],"color":[513],"fill":[513],"size":[513],"width":[513],"loading":[516],"disabled":[516],"loaderPosition":[1,"loader-position"],"href":[1],"load":[64],"stop":[64],"setText":[64],"disable":[64],"enable":[64]}],[0,"salla-loading",{"size":[8],"width":[8],"color":[1],"bgColor":[1,"bg-color"]}]]],["salla-add-product-button.cjs",[[4,"salla-add-product-button",{"channels":[513],"quantity":[514],"donatingAmount":[514,"donating-amount"],"productId":[520,"product-id"],"productStatus":[513,"product-status"],"productType":[513,"product-type"]}]]],["salla-conditional-fields.cjs",[[4,"salla-conditional-fields",null,[[0,"change","changeHandler"]]]]],["salla-installment.cjs",[[0,"salla-installment",{"price":[1],"language":[1],"currency":[1],"tamaraIsActive":[32],"tabbyIsActive":[32],"spotiiIsActive":[32]}]]],["salla-quantity-input.cjs",[[4,"salla-quantity-input",{"quantity":[32],"decrease":[64],"increase":[64],"setValue":[64]}]]]], options);
+  return index.bootstrapLazy([["salla-button_23.cjs",[[4,"salla-loyalty",{"prizePoints":[8,"prize-points"],"customerPoints":[2,"customer-points"],"prizeTitle":[1,"prize-title"],"allowEmail":[4,"allow-email"],"allowMobile":[4,"allow-mobile"],"requireEmail":[4,"require-email"],"guestMessage":[1,"guest-message"],"loyaltyProgram":[32],"buttonLoading":[32],"selectedItem":[32],"askConfirmation":[32],"is_loggedin":[32],"points":[32],"exchange_points":[32],"are_you_sure_to_exchange":[32],"for":[32],"cancel":[32],"confirm":[32],"cart_total_point_summary":[32],"cart_point_exchange_now":[32],"login_button":[32],"open":[64],"close":[64],"resetExchange":[64],"exchangeLoyaltyPoint":[64]}],[4,"salla-product-size-guide",{"guides":[32],"productId":[32],"open":[64],"close":[64]}],[4,"salla-login-modal",{"isEmailAllowed":[1028,"is-email-allowed"],"isMobileAllowed":[1028,"is-mobile-allowed"],"isEmailRequired":[1028,"is-email-required"],"title":[32],"loginTypeTitle":[32],"loginText":[32],"smsLabel":[32],"mobileLabel":[32],"emailLabel":[32],"enterText":[32],"bySMSText":[32],"byEmailText":[32],"emailErrorMsg":[32],"firstNameLabel":[32],"lastNameLabel":[32],"firstNameErrorMsg":[32],"lastNameErrorMsg":[32],"open":[64]},[[8,"verified","onVerified"]]],[4,"salla-scopes",{"selection":[1],"searchDisplayLimit":[2,"search-display-limit"],"mode":[32],"current_scope":[32],"scopes":[32],"originalScopesList":[32],"branchNotFound":[32],"ourServiceIsNotFound":[32],"searchForAvailabilityInOtherBranch":[32],"shoppingFromAnotherBranch":[32],"nowBrowsingFrom":[32],"confirmButton":[32],"scopeSearchPlaceholder":[32],"selected_scope":[32],"isDefault":[32],"isOpenedBefore":[32],"close":[64],"open":[64],"handleSubmit":[64]}],[0,"salla-rating-modal",{"orderId":[2,"order-id"],"order":[32],"open":[64],"close":[64]}],[0,"salla-localization-modal",{"language":[1537],"currency":[1537],"languages":[32],"currencies":[32],"languagesTitle":[32],"currenciesTitle":[32],"isLoading":[32],"open":[64],"close":[64],"submit":[64]}],[0,"salla-offer-modal",{"offer":[32],"offer_name":[32],"offer_message":[32],"offer_expires_in":[32],"remember_my_choice":[32],"add_to_cart":[32],"out_of_stock":[32],"open":[64],"showOffer":[64]}],[0,"salla-search",{"inline":[4],"oval":[4],"height":[2],"results":[32],"placeholder":[32],"noResultsText":[32],"typing":[32],"debounce":[32],"search_term":[32]}],[4,"salla-social-share",{"url":[513],"urlName":[513,"url-name"],"platforms":[16],"opened":[32],"allPlatforms":[32],"platformIcons":[32],"open":[64]}],[4,"salla-infinite-scroll",{"nextPage":[1,"next-page"],"autoload":[1028],"container":[1],"item":[1],"loadMore":[32],"noMore":[32],"failedToLoad":[32]}],[0,"salla-product-availability",{"channels":[1],"productId":[2,"product-id"],"isSubscribed":[1028,"is-subscribed"],"subTitle":[32],"mobileLabel":[32],"emailLabel":[32],"emailPlaceholder":[32],"subscribedMessage":[32],"title_":[32],"emailErrorMsg":[32],"isVisitorSubscribed":[32]}],[4,"salla-verify",{"display":[1],"type":[1025],"autoReload":[4,"auto-reload"],"title":[32],"resendAfter":[32],"isProfileVerify":[32],"getCode":[64],"open":[64]}],[4,"salla-swiper",{"loop":[4],"speed":[2],"itemPerView":[8,"item-per-view"],"spaceBetweenItems":[2,"space-between-items"],"direction":[1],"currentIndex":[32],"isLastSlideItem":[32],"isFirstSlideItem":[32]}],[0,"salla-rating-stars",{"name":[1],"size":[1],"value":[2]}],[4,"salla-list-tile",{"href":[1],"target":[1]}],[4,"salla-tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}],[4,"salla-tab-header",{"name":[1],"activeClass":[1,"active-class"],"height":[8],"centered":[4],"isSelected":[32],"getChild":[64]}],[4,"salla-tabs",{"backgroundColor":[1,"background-color"],"vertical":[4]},[[0,"onSelect","onSelectedTab"]]],[4,"salla-placeholder",{"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"],"default_title":[32],"default_description":[32]}],[0,"salla-tel-input",{"phone":[1025],"name":[1],"countryCode":[1025,"country-code"],"mobileRequired":[32],"countryCodeLabel":[32],"mobileLabel":[32],"tooShort":[32],"tooLong":[32],"invalidCountryCode":[32],"invalidNumber":[32],"errorMap":[32],"getValues":[64],"isValid":[64]}],[4,"salla-modal",{"isClosable":[1028,"is-closable"],"width":[513],"position":[513],"visible":[516],"isLoading":[1540,"is-loading"],"subTitleFirst":[4,"sub-title-first"],"noPadding":[4,"no-padding"],"subTitle":[1,"sub-title"],"icon":[1],"iconStyle":[1,"icon-style"],"imageIcon":[1,"image-icon"],"modalTitle":[32],"open":[64],"close":[64],"setTitle":[64],"loading":[64],"stopLoading":[64]}],[4,"salla-button",{"shape":[513],"color":[513],"fill":[513],"size":[513],"width":[513],"loading":[516],"disabled":[516],"loaderPosition":[1,"loader-position"],"href":[1],"load":[64],"stop":[64],"setText":[64],"disable":[64],"enable":[64]}],[0,"salla-loading",{"size":[8],"width":[8],"color":[1],"bgColor":[1,"bg-color"]}]]],["salla-add-product-button.cjs",[[4,"salla-add-product-button",{"channels":[513],"quantity":[514],"donatingAmount":[514,"donating-amount"],"productId":[520,"product-id"],"productStatus":[513,"product-status"],"productType":[513,"product-type"]}]]],["salla-conditional-fields.cjs",[[4,"salla-conditional-fields",null,[[0,"change","changeHandler"]]]]],["salla-installment.cjs",[[0,"salla-installment",{"price":[1],"language":[1],"currency":[1],"tamaraIsActive":[32],"tabbyIsActive":[32],"spotiiIsActive":[32]}]]],["salla-quantity-input.cjs",[[4,"salla-quantity-input",{"quantity":[32],"decrease":[64],"increase":[64],"setValue":[64]}]]]], options);
   });
 };
 

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

@@ -1537,9 +1537,13 @@ const SallaScopees = class {
     this.isDefault = true;
     this.isOpenedBefore = salla.storage.get("branch-choosed-before");
     /**
-     * Dictates when to show the searchfield
+     * Optionally open the modal or enforce the pop-up to the viewer
      */
-    this.searchFieldToggler = 6;
+    this.selection = 'optional';
+    /**
+     * Dictates when to show the search field
+     */
+    this.searchDisplayLimit = 6;
     this.getFormTitle = () => {
       var _a;
       if (((_a = this.originalScopesList) === null || _a === void 0 ? void 0 : _a.length) < 2)
@@ -1551,24 +1555,22 @@ const SallaScopees = class {
     salla.event.on('scopes::open', ({ mode = null, product_id = null }) => {
       if (!!mode)
         this.mode = mode;
-      this.isDefault = !mode || mode == ModeType.DEFAULT;
       this.open(mode, product_id);
     });
-    salla.lang.onLoaded(() => {
-      this.branchNotFound = salla.lang.get("blocks.scope.branch_looking_for_not_found");
-      this.ourServiceIsNotFound = salla.lang.get("blocks.scope.our_services_not_available_in_this_branch");
-      this.searchForAvailabilityInOtherBranch = salla.lang.get('blocks.scope.search_for_availability_in_other_branches');
-      this.shoppingFromAnotherBranch = salla.lang.get("blocks.scope.shopping_from_another_branch");
-      this.nowBrowsingFrom = salla.lang.get('blocks.scope.you_are_browse_store_from');
-      this.confirmButton = salla.lang.get('common.elements.confirm');
-      this.scopeSearchPlaceholder = salla.lang.get('blocks.scope.searching_for_a_branch');
-    });
+    this.branchNotFound = salla.lang.get("blocks.scope.branch_looking_for_not_found");
+    this.ourServiceIsNotFound = salla.lang.get("blocks.scope.our_services_not_available_in_this_branch");
+    this.searchForAvailabilityInOtherBranch = salla.lang.get('blocks.scope.search_for_availability_in_other_branches');
+    this.shoppingFromAnotherBranch = salla.lang.get("blocks.scope.shopping_from_another_branch");
+    this.nowBrowsingFrom = salla.lang.get('blocks.scope.you_are_browse_store_from');
+    this.confirmButton = salla.lang.get('common.elements.confirm');
+    this.scopeSearchPlaceholder = salla.lang.get('blocks.scope.searching_for_a_branch');
   }
   async close() {
     var _a;
     return await ((_a = this.modal) === null || _a === void 0 ? void 0 : _a.close());
   }
   async open(mode = ModeType.DEFAULT, product_id = null) {
+    this.isDefault = !mode || mode == ModeType.DEFAULT;
     this.modal.open();
     return await (mode == ModeType.AVAILABILITY ? salla.scope.getProductAvailability(product_id) : salla.scope.get())
       .then((resp) => {
@@ -1584,11 +1586,11 @@ const SallaScopees = class {
     });
   }
   async handleSubmit() {
-    salla.storage.set("branch-choosed-before", true);
     let payload = { 'scope_id': this.current_scope.id };
     this.changeBtn.load();
     return await salla.scope.change(payload)
       .then(() => {
+      salla.storage.set("branch-choosed-before", true);
       window.location.reload();
     }).catch(e => console.log(e))
       .finally(() => {
@@ -1623,24 +1625,24 @@ const SallaScopees = class {
     return index$1.h("salla-placeholder", { alignment: "center", class: "s-scopes-placeholder" }, index$1.h("span", { slot: "title" }, this.branchNotFound), index$1.h("span", { slot: "description" }, this.ourServiceIsNotFound));
   }
   defaultContent() {
-    return [index$1.h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes.map((scope) => index$1.h("div", { class: "s-scopes-input-wrap", "data-position": this.position }, index$1.h("input", { id: `${this.position} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }), index$1.h("label", { htmlFor: `${this.position} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" }, index$1.h("span", null, scope.name))))), this.footerContent()];
+    return [index$1.h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes.map((scope) => index$1.h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, index$1.h("input", { id: `${this.selection} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }), index$1.h("label", { htmlFor: `${this.selection} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" }, index$1.h("span", null, scope.name))))), this.footerContent()];
   }
   availabilityContent() {
-    return index$1.h("div", { class: "s-scopes-container" }, this.scopes.map((scope) => index$1.h("div", { class: "s-scopes-input-wrap", "data-position": this.position }, index$1.h("h2", { class: { "s-scopes-label": true, "s-scopes-clickable": this.isDefault } }, index$1.h("span", null, scope.name)), index$1.h("h2", { style: { 'color': scope.availability.color }, class: `s-scopes-${scope.availability.key}` }, scope.availability.label))));
+    return index$1.h("div", { class: "s-scopes-container" }, this.scopes.map((scope) => index$1.h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, index$1.h("h2", { class: { "s-scopes-label": true, "s-scopes-clickable": this.isDefault } }, index$1.h("span", null, scope.name)), index$1.h("h2", { style: { 'color': scope.availability.color }, class: `s-scopes-${scope.availability.key}` }, scope.availability.label))));
   }
   footerContent() {
     return index$1.h("div", { class: "s-scopes-footer" }, index$1.h("slot", { name: "footer" }, index$1.h("salla-button", { ref: btn => this.changeBtn = btn, disabled: !this.current_scope, onClick: () => this.handleSubmit(), class: "s-scopes-submit", "loader-position": "center", width: "wide" }, this.confirmButton)));
   }
   render() {
-    return (index$1.h(index$1.Host, null, index$1.h("salla-modal", { ref: modal => this.modal = modal, id: "s-scopes-modal", class: "s-scopes-modal", isLoading: true }, index$1.h("salla-list-tile", { class: this.originalScopesList.length ? "s-scopes-header block" : "s-hidden" }, index$1.h("div", { slot: "icon", class: "s-scopes-header-icon", innerHTML: StoreAlt }), index$1.h("div", { slot: "title", class: "s-scopes-header-title" }, this.nowBrowsingFrom), index$1.h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, !!this.selected_scope ? this.selected_scope.name : "")), index$1.h("div", { class: "s-scopes-wrap" }, !!this.originalScopesList.length && index$1.h("h4", { class: "s-scopes-title" }, this.getFormTitle()), this.originalScopesList.length > this.searchFieldToggler ?
+    return (index$1.h(index$1.Host, null, index$1.h("salla-modal", { ref: modal => this.modal = modal, id: "s-scopes-modal", isClosable: this.selection == 'optional', class: "s-scopes-modal", isLoading: true }, index$1.h("salla-list-tile", { class: this.originalScopesList.length ? "s-scopes-header block" : "s-hidden" }, index$1.h("div", { slot: "icon", class: "s-scopes-header-icon", innerHTML: StoreAlt }), index$1.h("div", { slot: "title", class: "s-scopes-header-title" }, this.nowBrowsingFrom), index$1.h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, !!this.selected_scope ? this.selected_scope.name : "")), index$1.h("div", { class: "s-scopes-wrap" }, !!this.originalScopesList.length && index$1.h("h4", { class: "s-scopes-title" }, this.getFormTitle()), this.originalScopesList.length > this.searchDisplayLimit ?
       index$1.h("div", { class: "s-scopes-search-wrapper" }, index$1.h("div", { class: "s-scopes-search-icon", innerHTML: Search }), index$1.h("input", { type: "text", class: "s-scopes-search-input", onInput: e => this.handleSearchFieldTyping(e), placeholder: this.scopeSearchPlaceholder }))
       : "", this.scopes.length < 2 ?
       this.placeholderContent()
       : this.isDefault ? this.defaultContent() : this.availabilityContent()))));
   }
-  componentDidRender() {
-    if (!this.isOpenedBefore && this.position == 'popup') {
-      salla.event.dispatch('scopes::open', {});
+  componentDidLoad() {
+    if (!this.isOpenedBefore && this.selection == 'mandatory') {
+      this.open();
     }
   }
 };

package/dist/cjs/twilight-components.cjs.js

@@ -18,5 +18,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["salla-button_23.cjs",[[4,"salla-loyalty",{"prizePoints":[8,"prize-points"],"customerPoints":[2,"customer-points"],"prizeTitle":[1,"prize-title"],"allowEmail":[4,"allow-email"],"allowMobile":[4,"allow-mobile"],"requireEmail":[4,"require-email"],"guestMessage":[1,"guest-message"],"loyaltyProgram":[32],"buttonLoading":[32],"selectedItem":[32],"askConfirmation":[32],"is_loggedin":[32],"points":[32],"exchange_points":[32],"are_you_sure_to_exchange":[32],"for":[32],"cancel":[32],"confirm":[32],"cart_total_point_summary":[32],"cart_point_exchange_now":[32],"login_button":[32],"open":[64],"close":[64],"resetExchange":[64],"exchangeLoyaltyPoint":[64]}],[4,"salla-product-size-guide",{"guides":[32],"productId":[32],"open":[64],"close":[64]}],[4,"salla-login-modal",{"isEmailAllowed":[1028,"is-email-allowed"],"isMobileAllowed":[1028,"is-mobile-allowed"],"isEmailRequired":[1028,"is-email-required"],"title":[32],"loginTypeTitle":[32],"loginText":[32],"smsLabel":[32],"mobileLabel":[32],"emailLabel":[32],"enterText":[32],"bySMSText":[32],"byEmailText":[32],"emailErrorMsg":[32],"firstNameLabel":[32],"lastNameLabel":[32],"firstNameErrorMsg":[32],"lastNameErrorMsg":[32],"open":[64]},[[8,"verified","onVerified"]]],[4,"salla-scopes",{"position":[1],"searchFieldToggler":[2,"search-field-toggler"],"mode":[32],"current_scope":[32],"scopes":[32],"originalScopesList":[32],"branchNotFound":[32],"ourServiceIsNotFound":[32],"searchForAvailabilityInOtherBranch":[32],"shoppingFromAnotherBranch":[32],"nowBrowsingFrom":[32],"confirmButton":[32],"scopeSearchPlaceholder":[32],"selected_scope":[32],"isDefault":[32],"isOpenedBefore":[32],"close":[64],"open":[64],"handleSubmit":[64]}],[0,"salla-rating-modal",{"orderId":[2,"order-id"],"order":[32],"open":[64],"close":[64]}],[0,"salla-localization-modal",{"language":[1537],"currency":[1537],"languages":[32],"currencies":[32],"languagesTitle":[32],"currenciesTitle":[32],"isLoading":[32],"open":[64],"close":[64],"submit":[64]}],[0,"salla-offer-modal",{"offer":[32],"offer_name":[32],"offer_message":[32],"offer_expires_in":[32],"remember_my_choice":[32],"add_to_cart":[32],"out_of_stock":[32],"open":[64],"showOffer":[64]}],[0,"salla-search",{"inline":[4],"oval":[4],"height":[2],"results":[32],"placeholder":[32],"noResultsText":[32],"typing":[32],"debounce":[32],"search_term":[32]}],[4,"salla-social-share",{"url":[513],"urlName":[513,"url-name"],"platforms":[16],"opened":[32],"allPlatforms":[32],"platformIcons":[32],"open":[64]}],[4,"salla-infinite-scroll",{"nextPage":[1,"next-page"],"autoload":[1028],"container":[1],"item":[1],"loadMore":[32],"noMore":[32],"failedToLoad":[32]}],[0,"salla-product-availability",{"channels":[1],"productId":[2,"product-id"],"isSubscribed":[1028,"is-subscribed"],"subTitle":[32],"mobileLabel":[32],"emailLabel":[32],"emailPlaceholder":[32],"subscribedMessage":[32],"title_":[32],"emailErrorMsg":[32],"isVisitorSubscribed":[32]}],[4,"salla-verify",{"display":[1],"type":[1025],"autoReload":[4,"auto-reload"],"title":[32],"resendAfter":[32],"isProfileVerify":[32],"getCode":[64],"open":[64]}],[4,"salla-swiper",{"loop":[4],"speed":[2],"itemPerView":[8,"item-per-view"],"spaceBetweenItems":[2,"space-between-items"],"direction":[1],"currentIndex":[32],"isLastSlideItem":[32],"isFirstSlideItem":[32]}],[0,"salla-rating-stars",{"name":[1],"size":[1],"value":[2]}],[4,"salla-list-tile",{"href":[1],"target":[1]}],[4,"salla-tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}],[4,"salla-tab-header",{"name":[1],"activeClass":[1,"active-class"],"height":[8],"centered":[4],"isSelected":[32],"getChild":[64]}],[4,"salla-tabs",{"backgroundColor":[1,"background-color"],"vertical":[4]},[[0,"onSelect","onSelectedTab"]]],[4,"salla-placeholder",{"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"],"default_title":[32],"default_description":[32]}],[0,"salla-tel-input",{"phone":[1025],"name":[1],"countryCode":[1025,"country-code"],"mobileRequired":[32],"countryCodeLabel":[32],"mobileLabel":[32],"tooShort":[32],"tooLong":[32],"invalidCountryCode":[32],"invalidNumber":[32],"errorMap":[32],"getValues":[64],"isValid":[64]}],[4,"salla-modal",{"isClosable":[1028,"is-closable"],"width":[513],"position":[513],"visible":[516],"isLoading":[1540,"is-loading"],"subTitleFirst":[4,"sub-title-first"],"noPadding":[4,"no-padding"],"subTitle":[1,"sub-title"],"icon":[1],"iconStyle":[1,"icon-style"],"imageIcon":[1,"image-icon"],"modalTitle":[32],"open":[64],"close":[64],"setTitle":[64],"loading":[64],"stopLoading":[64]}],[4,"salla-button",{"shape":[513],"color":[513],"fill":[513],"size":[513],"width":[513],"loading":[516],"disabled":[516],"loaderPosition":[1,"loader-position"],"href":[1],"load":[64],"stop":[64],"setText":[64],"disable":[64],"enable":[64]}],[0,"salla-loading",{"size":[8],"width":[8],"color":[1],"bgColor":[1,"bg-color"]}]]],["salla-add-product-button.cjs",[[4,"salla-add-product-button",{"channels":[513],"quantity":[514],"donatingAmount":[514,"donating-amount"],"productId":[520,"product-id"],"productStatus":[513,"product-status"],"productType":[513,"product-type"]}]]],["salla-conditional-fields.cjs",[[4,"salla-conditional-fields",null,[[0,"change","changeHandler"]]]]],["salla-installment.cjs",[[0,"salla-installment",{"price":[1],"language":[1],"currency":[1],"tamaraIsActive":[32],"tabbyIsActive":[32],"spotiiIsActive":[32]}]]],["salla-quantity-input.cjs",[[4,"salla-quantity-input",{"quantity":[32],"decrease":[64],"increase":[64],"setValue":[64]}]]]], options);
+  return index.bootstrapLazy([["salla-button_23.cjs",[[4,"salla-loyalty",{"prizePoints":[8,"prize-points"],"customerPoints":[2,"customer-points"],"prizeTitle":[1,"prize-title"],"allowEmail":[4,"allow-email"],"allowMobile":[4,"allow-mobile"],"requireEmail":[4,"require-email"],"guestMessage":[1,"guest-message"],"loyaltyProgram":[32],"buttonLoading":[32],"selectedItem":[32],"askConfirmation":[32],"is_loggedin":[32],"points":[32],"exchange_points":[32],"are_you_sure_to_exchange":[32],"for":[32],"cancel":[32],"confirm":[32],"cart_total_point_summary":[32],"cart_point_exchange_now":[32],"login_button":[32],"open":[64],"close":[64],"resetExchange":[64],"exchangeLoyaltyPoint":[64]}],[4,"salla-product-size-guide",{"guides":[32],"productId":[32],"open":[64],"close":[64]}],[4,"salla-login-modal",{"isEmailAllowed":[1028,"is-email-allowed"],"isMobileAllowed":[1028,"is-mobile-allowed"],"isEmailRequired":[1028,"is-email-required"],"title":[32],"loginTypeTitle":[32],"loginText":[32],"smsLabel":[32],"mobileLabel":[32],"emailLabel":[32],"enterText":[32],"bySMSText":[32],"byEmailText":[32],"emailErrorMsg":[32],"firstNameLabel":[32],"lastNameLabel":[32],"firstNameErrorMsg":[32],"lastNameErrorMsg":[32],"open":[64]},[[8,"verified","onVerified"]]],[4,"salla-scopes",{"selection":[1],"searchDisplayLimit":[2,"search-display-limit"],"mode":[32],"current_scope":[32],"scopes":[32],"originalScopesList":[32],"branchNotFound":[32],"ourServiceIsNotFound":[32],"searchForAvailabilityInOtherBranch":[32],"shoppingFromAnotherBranch":[32],"nowBrowsingFrom":[32],"confirmButton":[32],"scopeSearchPlaceholder":[32],"selected_scope":[32],"isDefault":[32],"isOpenedBefore":[32],"close":[64],"open":[64],"handleSubmit":[64]}],[0,"salla-rating-modal",{"orderId":[2,"order-id"],"order":[32],"open":[64],"close":[64]}],[0,"salla-localization-modal",{"language":[1537],"currency":[1537],"languages":[32],"currencies":[32],"languagesTitle":[32],"currenciesTitle":[32],"isLoading":[32],"open":[64],"close":[64],"submit":[64]}],[0,"salla-offer-modal",{"offer":[32],"offer_name":[32],"offer_message":[32],"offer_expires_in":[32],"remember_my_choice":[32],"add_to_cart":[32],"out_of_stock":[32],"open":[64],"showOffer":[64]}],[0,"salla-search",{"inline":[4],"oval":[4],"height":[2],"results":[32],"placeholder":[32],"noResultsText":[32],"typing":[32],"debounce":[32],"search_term":[32]}],[4,"salla-social-share",{"url":[513],"urlName":[513,"url-name"],"platforms":[16],"opened":[32],"allPlatforms":[32],"platformIcons":[32],"open":[64]}],[4,"salla-infinite-scroll",{"nextPage":[1,"next-page"],"autoload":[1028],"container":[1],"item":[1],"loadMore":[32],"noMore":[32],"failedToLoad":[32]}],[0,"salla-product-availability",{"channels":[1],"productId":[2,"product-id"],"isSubscribed":[1028,"is-subscribed"],"subTitle":[32],"mobileLabel":[32],"emailLabel":[32],"emailPlaceholder":[32],"subscribedMessage":[32],"title_":[32],"emailErrorMsg":[32],"isVisitorSubscribed":[32]}],[4,"salla-verify",{"display":[1],"type":[1025],"autoReload":[4,"auto-reload"],"title":[32],"resendAfter":[32],"isProfileVerify":[32],"getCode":[64],"open":[64]}],[4,"salla-swiper",{"loop":[4],"speed":[2],"itemPerView":[8,"item-per-view"],"spaceBetweenItems":[2,"space-between-items"],"direction":[1],"currentIndex":[32],"isLastSlideItem":[32],"isFirstSlideItem":[32]}],[0,"salla-rating-stars",{"name":[1],"size":[1],"value":[2]}],[4,"salla-list-tile",{"href":[1],"target":[1]}],[4,"salla-tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}],[4,"salla-tab-header",{"name":[1],"activeClass":[1,"active-class"],"height":[8],"centered":[4],"isSelected":[32],"getChild":[64]}],[4,"salla-tabs",{"backgroundColor":[1,"background-color"],"vertical":[4]},[[0,"onSelect","onSelectedTab"]]],[4,"salla-placeholder",{"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"],"default_title":[32],"default_description":[32]}],[0,"salla-tel-input",{"phone":[1025],"name":[1],"countryCode":[1025,"country-code"],"mobileRequired":[32],"countryCodeLabel":[32],"mobileLabel":[32],"tooShort":[32],"tooLong":[32],"invalidCountryCode":[32],"invalidNumber":[32],"errorMap":[32],"getValues":[64],"isValid":[64]}],[4,"salla-modal",{"isClosable":[1028,"is-closable"],"width":[513],"position":[513],"visible":[516],"isLoading":[1540,"is-loading"],"subTitleFirst":[4,"sub-title-first"],"noPadding":[4,"no-padding"],"subTitle":[1,"sub-title"],"icon":[1],"iconStyle":[1,"icon-style"],"imageIcon":[1,"image-icon"],"modalTitle":[32],"open":[64],"close":[64],"setTitle":[64],"loading":[64],"stopLoading":[64]}],[4,"salla-button",{"shape":[513],"color":[513],"fill":[513],"size":[513],"width":[513],"loading":[516],"disabled":[516],"loaderPosition":[1,"loader-position"],"href":[1],"load":[64],"stop":[64],"setText":[64],"disable":[64],"enable":[64]}],[0,"salla-loading",{"size":[8],"width":[8],"color":[1],"bgColor":[1,"bg-color"]}]]],["salla-add-product-button.cjs",[[4,"salla-add-product-button",{"channels":[513],"quantity":[514],"donatingAmount":[514,"donating-amount"],"productId":[520,"product-id"],"productStatus":[513,"product-status"],"productType":[513,"product-type"]}]]],["salla-conditional-fields.cjs",[[4,"salla-conditional-fields",null,[[0,"change","changeHandler"]]]]],["salla-installment.cjs",[[0,"salla-installment",{"price":[1],"language":[1],"currency":[1],"tamaraIsActive":[32],"tabbyIsActive":[32],"spotiiIsActive":[32]}]]],["salla-quantity-input.cjs",[[4,"salla-quantity-input",{"quantity":[32],"decrease":[64],"increase":[64],"setValue":[64]}]]]], options);
 });

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

@@ -13,9 +13,13 @@ export class SallaScopees {
     this.isDefault = true;
     this.isOpenedBefore = salla.storage.get("branch-choosed-before");
     /**
-     * Dictates when to show the searchfield
+     * Optionally open the modal or enforce the pop-up to the viewer
      */
-    this.searchFieldToggler = 6;
+    this.selection = 'optional';
+    /**
+     * Dictates when to show the search field
+     */
+    this.searchDisplayLimit = 6;
     this.getFormTitle = () => {
       var _a;
       if (((_a = this.originalScopesList) === null || _a === void 0 ? void 0 : _a.length) < 2)
@@ -27,24 +31,22 @@ export class SallaScopees {
     salla.event.on('scopes::open', ({ mode = null, product_id = null }) => {
       if (!!mode)
         this.mode = mode;
-      this.isDefault = !mode || mode == ModeType.DEFAULT;
       this.open(mode, product_id);
     });
-    salla.lang.onLoaded(() => {
-      this.branchNotFound = salla.lang.get("blocks.scope.branch_looking_for_not_found");
-      this.ourServiceIsNotFound = salla.lang.get("blocks.scope.our_services_not_available_in_this_branch");
-      this.searchForAvailabilityInOtherBranch = salla.lang.get('blocks.scope.search_for_availability_in_other_branches');
-      this.shoppingFromAnotherBranch = salla.lang.get("blocks.scope.shopping_from_another_branch");
-      this.nowBrowsingFrom = salla.lang.get('blocks.scope.you_are_browse_store_from');
-      this.confirmButton = salla.lang.get('common.elements.confirm');
-      this.scopeSearchPlaceholder = salla.lang.get('blocks.scope.searching_for_a_branch');
-    });
+    this.branchNotFound = salla.lang.get("blocks.scope.branch_looking_for_not_found");
+    this.ourServiceIsNotFound = salla.lang.get("blocks.scope.our_services_not_available_in_this_branch");
+    this.searchForAvailabilityInOtherBranch = salla.lang.get('blocks.scope.search_for_availability_in_other_branches');
+    this.shoppingFromAnotherBranch = salla.lang.get("blocks.scope.shopping_from_another_branch");
+    this.nowBrowsingFrom = salla.lang.get('blocks.scope.you_are_browse_store_from');
+    this.confirmButton = salla.lang.get('common.elements.confirm');
+    this.scopeSearchPlaceholder = salla.lang.get('blocks.scope.searching_for_a_branch');
   }
   async close() {
     var _a;
     return await ((_a = this.modal) === null || _a === void 0 ? void 0 : _a.close());
   }
   async open(mode = ModeType.DEFAULT, product_id = null) {
+    this.isDefault = !mode || mode == ModeType.DEFAULT;
     this.modal.open();
     return await (mode == ModeType.AVAILABILITY ? salla.scope.getProductAvailability(product_id) : salla.scope.get())
       .then((resp) => {
@@ -60,11 +62,11 @@ export class SallaScopees {
     });
   }
   async handleSubmit() {
-    salla.storage.set("branch-choosed-before", true);
     let payload = { 'scope_id': this.current_scope.id };
     this.changeBtn.load();
     return await salla.scope.change(payload)
       .then(() => {
+      salla.storage.set("branch-choosed-before", true);
       window.location.reload();
     }).catch(e => console.log(e))
       .finally(() => {
@@ -101,13 +103,13 @@ export class SallaScopees {
       h("span", { slot: "description" }, this.ourServiceIsNotFound));
   }
   defaultContent() {
-    return [h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-position": this.position },
-        h("input", { id: `${this.position} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }),
-        h("label", { htmlFor: `${this.position} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" },
+    return [h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection },
+        h("input", { id: `${this.selection} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }),
+        h("label", { htmlFor: `${this.selection} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" },
           h("span", null, scope.name))))), this.footerContent()];
   }
   availabilityContent() {
-    return h("div", { class: "s-scopes-container" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-position": this.position },
+    return h("div", { class: "s-scopes-container" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection },
       h("h2", { class: { "s-scopes-label": true, "s-scopes-clickable": this.isDefault } },
         h("span", null, scope.name)),
       h("h2", { style: { 'color': scope.availability.color }, class: `s-scopes-${scope.availability.key}` }, scope.availability.label))));
@@ -119,14 +121,14 @@ export class SallaScopees {
   }
   render() {
     return (h(Host, null,
-      h("salla-modal", { ref: modal => this.modal = modal, id: "s-scopes-modal", class: "s-scopes-modal", isLoading: true },
+      h("salla-modal", { ref: modal => this.modal = modal, id: "s-scopes-modal", isClosable: this.selection == 'optional', class: "s-scopes-modal", isLoading: true },
         h("salla-list-tile", { class: this.originalScopesList.length ? "s-scopes-header block" : "s-hidden" },
           h("div", { slot: "icon", class: "s-scopes-header-icon", innerHTML: StoreAlt }),
           h("div", { slot: "title", class: "s-scopes-header-title" }, this.nowBrowsingFrom),
           h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, !!this.selected_scope ? this.selected_scope.name : "")),
         h("div", { class: "s-scopes-wrap" },
           !!this.originalScopesList.length && h("h4", { class: "s-scopes-title" }, this.getFormTitle()),
-          this.originalScopesList.length > this.searchFieldToggler ?
+          this.originalScopesList.length > this.searchDisplayLimit ?
             h("div", { class: "s-scopes-search-wrapper" },
               h("div", { class: "s-scopes-search-icon", innerHTML: Search }),
               h("input", { type: "text", class: "s-scopes-search-input", onInput: e => this.handleSearchFieldTyping(e), placeholder: this.scopeSearchPlaceholder }))
@@ -135,9 +137,9 @@ export class SallaScopees {
             this.placeholderContent()
             : this.isDefault ? this.defaultContent() : this.availabilityContent()))));
   }
-  componentDidRender() {
-    if (!this.isOpenedBefore && this.position == 'popup') {
-      salla.event.dispatch('scopes::open', {});
+  componentDidLoad() {
+    if (!this.isOpenedBefore && this.selection == 'mandatory') {
+      this.open();
     }
   }
   static get is() { return "salla-scopes"; }
@@ -148,24 +150,25 @@ export class SallaScopees {
     "$": ["salla-scopes.css"]
   }; }
   static get properties() { return {
-    "position": {
+    "selection": {
       "type": "string",
       "mutable": false,
       "complexType": {
-        "original": "string",
-        "resolved": "string",
+        "original": "'optional' | 'mandatory'",
+        "resolved": "\"mandatory\" | \"optional\"",
         "references": {}
       },
       "required": false,
       "optional": false,
       "docs": {
         "tags": [],
-        "text": ""
+        "text": "Optionally open the modal or enforce the pop-up to the viewer"
       },
-      "attribute": "position",
-      "reflect": false
+      "attribute": "selection",
+      "reflect": false,
+      "defaultValue": "'optional'"
     },
-    "searchFieldToggler": {
+    "searchDisplayLimit": {
       "type": "number",
       "mutable": false,
       "complexType": {
@@ -177,9 +180,9 @@ export class SallaScopees {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Dictates when to show the searchfield"
+        "text": "Dictates when to show the search field"
       },
-      "attribute": "search-field-toggler",
+      "attribute": "search-display-limit",
       "reflect": false,
       "defaultValue": "6"
     }

package/dist/components/salla-scopes.js

@@ -40,9 +40,13 @@ const SallaScopees = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     this.isDefault = true;
     this.isOpenedBefore = salla.storage.get("branch-choosed-before");
     /**
-     * Dictates when to show the searchfield
+     * Optionally open the modal or enforce the pop-up to the viewer
      */
-    this.searchFieldToggler = 6;
+    this.selection = 'optional';
+    /**
+     * Dictates when to show the search field
+     */
+    this.searchDisplayLimit = 6;
     this.getFormTitle = () => {
       var _a;
       if (((_a = this.originalScopesList) === null || _a === void 0 ? void 0 : _a.length) < 2)
@@ -54,24 +58,22 @@ const SallaScopees = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     salla.event.on('scopes::open', ({ mode = null, product_id = null }) => {
       if (!!mode)
         this.mode = mode;
-      this.isDefault = !mode || mode == ModeType.DEFAULT;
       this.open(mode, product_id);
     });
-    salla.lang.onLoaded(() => {
-      this.branchNotFound = salla.lang.get("blocks.scope.branch_looking_for_not_found");
-      this.ourServiceIsNotFound = salla.lang.get("blocks.scope.our_services_not_available_in_this_branch");
-      this.searchForAvailabilityInOtherBranch = salla.lang.get('blocks.scope.search_for_availability_in_other_branches');
-      this.shoppingFromAnotherBranch = salla.lang.get("blocks.scope.shopping_from_another_branch");
-      this.nowBrowsingFrom = salla.lang.get('blocks.scope.you_are_browse_store_from');
-      this.confirmButton = salla.lang.get('common.elements.confirm');
-      this.scopeSearchPlaceholder = salla.lang.get('blocks.scope.searching_for_a_branch');
-    });
+    this.branchNotFound = salla.lang.get("blocks.scope.branch_looking_for_not_found");
+    this.ourServiceIsNotFound = salla.lang.get("blocks.scope.our_services_not_available_in_this_branch");
+    this.searchForAvailabilityInOtherBranch = salla.lang.get('blocks.scope.search_for_availability_in_other_branches');
+    this.shoppingFromAnotherBranch = salla.lang.get("blocks.scope.shopping_from_another_branch");
+    this.nowBrowsingFrom = salla.lang.get('blocks.scope.you_are_browse_store_from');
+    this.confirmButton = salla.lang.get('common.elements.confirm');
+    this.scopeSearchPlaceholder = salla.lang.get('blocks.scope.searching_for_a_branch');
   }
   async close() {
     var _a;
     return await ((_a = this.modal) === null || _a === void 0 ? void 0 : _a.close());
   }
   async open(mode = ModeType.DEFAULT, product_id = null) {
+    this.isDefault = !mode || mode == ModeType.DEFAULT;
     this.modal.open();
     return await (mode == ModeType.AVAILABILITY ? salla.scope.getProductAvailability(product_id) : salla.scope.get())
       .then((resp) => {
@@ -87,11 +89,11 @@ const SallaScopees = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     });
   }
   async handleSubmit() {
-    salla.storage.set("branch-choosed-before", true);
     let payload = { 'scope_id': this.current_scope.id };
     this.changeBtn.load();
     return await salla.scope.change(payload)
       .then(() => {
+      salla.storage.set("branch-choosed-before", true);
       window.location.reload();
     }).catch(e => console.log(e))
       .finally(() => {
@@ -126,30 +128,30 @@ const SallaScopees = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     return h("salla-placeholder", { alignment: "center", class: "s-scopes-placeholder" }, h("span", { slot: "title" }, this.branchNotFound), h("span", { slot: "description" }, this.ourServiceIsNotFound));
   }
   defaultContent() {
-    return [h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-position": this.position }, h("input", { id: `${this.position} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }), h("label", { htmlFor: `${this.position} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" }, h("span", null, scope.name))))), this.footerContent()];
+    return [h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, h("input", { id: `${this.selection} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }), h("label", { htmlFor: `${this.selection} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" }, h("span", null, scope.name))))), this.footerContent()];
   }
   availabilityContent() {
-    return h("div", { class: "s-scopes-container" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-position": this.position }, h("h2", { class: { "s-scopes-label": true, "s-scopes-clickable": this.isDefault } }, h("span", null, scope.name)), h("h2", { style: { 'color': scope.availability.color }, class: `s-scopes-${scope.availability.key}` }, scope.availability.label))));
+    return h("div", { class: "s-scopes-container" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, h("h2", { class: { "s-scopes-label": true, "s-scopes-clickable": this.isDefault } }, h("span", null, scope.name)), h("h2", { style: { 'color': scope.availability.color }, class: `s-scopes-${scope.availability.key}` }, scope.availability.label))));
   }
   footerContent() {
     return h("div", { class: "s-scopes-footer" }, h("slot", { name: "footer" }, h("salla-button", { ref: btn => this.changeBtn = btn, disabled: !this.current_scope, onClick: () => this.handleSubmit(), class: "s-scopes-submit", "loader-position": "center", width: "wide" }, this.confirmButton)));
   }
   render() {
-    return (h(Host, null, h("salla-modal", { ref: modal => this.modal = modal, id: "s-scopes-modal", class: "s-scopes-modal", isLoading: true }, h("salla-list-tile", { class: this.originalScopesList.length ? "s-scopes-header block" : "s-hidden" }, h("div", { slot: "icon", class: "s-scopes-header-icon", innerHTML: StoreAlt }), h("div", { slot: "title", class: "s-scopes-header-title" }, this.nowBrowsingFrom), h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, !!this.selected_scope ? this.selected_scope.name : "")), h("div", { class: "s-scopes-wrap" }, !!this.originalScopesList.length && h("h4", { class: "s-scopes-title" }, this.getFormTitle()), this.originalScopesList.length > this.searchFieldToggler ?
+    return (h(Host, null, h("salla-modal", { ref: modal => this.modal = modal, id: "s-scopes-modal", isClosable: this.selection == 'optional', class: "s-scopes-modal", isLoading: true }, h("salla-list-tile", { class: this.originalScopesList.length ? "s-scopes-header block" : "s-hidden" }, h("div", { slot: "icon", class: "s-scopes-header-icon", innerHTML: StoreAlt }), h("div", { slot: "title", class: "s-scopes-header-title" }, this.nowBrowsingFrom), h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, !!this.selected_scope ? this.selected_scope.name : "")), h("div", { class: "s-scopes-wrap" }, !!this.originalScopesList.length && h("h4", { class: "s-scopes-title" }, this.getFormTitle()), this.originalScopesList.length > this.searchDisplayLimit ?
       h("div", { class: "s-scopes-search-wrapper" }, h("div", { class: "s-scopes-search-icon", innerHTML: Search }), h("input", { type: "text", class: "s-scopes-search-input", onInput: e => this.handleSearchFieldTyping(e), placeholder: this.scopeSearchPlaceholder }))
       : "", this.scopes.length < 2 ?
       this.placeholderContent()
       : this.isDefault ? this.defaultContent() : this.availabilityContent()))));
   }
-  componentDidRender() {
-    if (!this.isOpenedBefore && this.position == 'popup') {
-      salla.event.dispatch('scopes::open', {});
+  componentDidLoad() {
+    if (!this.isOpenedBefore && this.selection == 'mandatory') {
+      this.open();
     }
   }
   static get style() { return sallaScopesCss; }
 }, [4, "salla-scopes", {
-    "position": [1],
-    "searchFieldToggler": [2, "search-field-toggler"],
+    "selection": [1],
+    "searchDisplayLimit": [2, "search-display-limit"],
     "mode": [32],
     "current_scope": [32],
     "scopes": [32],

package/dist/esm/loader.js

@@ -13,7 +13,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy([["salla-button_23",[[4,"salla-loyalty",{"prizePoints":[8,"prize-points"],"customerPoints":[2,"customer-points"],"prizeTitle":[1,"prize-title"],"allowEmail":[4,"allow-email"],"allowMobile":[4,"allow-mobile"],"requireEmail":[4,"require-email"],"guestMessage":[1,"guest-message"],"loyaltyProgram":[32],"buttonLoading":[32],"selectedItem":[32],"askConfirmation":[32],"is_loggedin":[32],"points":[32],"exchange_points":[32],"are_you_sure_to_exchange":[32],"for":[32],"cancel":[32],"confirm":[32],"cart_total_point_summary":[32],"cart_point_exchange_now":[32],"login_button":[32],"open":[64],"close":[64],"resetExchange":[64],"exchangeLoyaltyPoint":[64]}],[4,"salla-product-size-guide",{"guides":[32],"productId":[32],"open":[64],"close":[64]}],[4,"salla-login-modal",{"isEmailAllowed":[1028,"is-email-allowed"],"isMobileAllowed":[1028,"is-mobile-allowed"],"isEmailRequired":[1028,"is-email-required"],"title":[32],"loginTypeTitle":[32],"loginText":[32],"smsLabel":[32],"mobileLabel":[32],"emailLabel":[32],"enterText":[32],"bySMSText":[32],"byEmailText":[32],"emailErrorMsg":[32],"firstNameLabel":[32],"lastNameLabel":[32],"firstNameErrorMsg":[32],"lastNameErrorMsg":[32],"open":[64]},[[8,"verified","onVerified"]]],[4,"salla-scopes",{"position":[1],"searchFieldToggler":[2,"search-field-toggler"],"mode":[32],"current_scope":[32],"scopes":[32],"originalScopesList":[32],"branchNotFound":[32],"ourServiceIsNotFound":[32],"searchForAvailabilityInOtherBranch":[32],"shoppingFromAnotherBranch":[32],"nowBrowsingFrom":[32],"confirmButton":[32],"scopeSearchPlaceholder":[32],"selected_scope":[32],"isDefault":[32],"isOpenedBefore":[32],"close":[64],"open":[64],"handleSubmit":[64]}],[0,"salla-rating-modal",{"orderId":[2,"order-id"],"order":[32],"open":[64],"close":[64]}],[0,"salla-localization-modal",{"language":[1537],"currency":[1537],"languages":[32],"currencies":[32],"languagesTitle":[32],"currenciesTitle":[32],"isLoading":[32],"open":[64],"close":[64],"submit":[64]}],[0,"salla-offer-modal",{"offer":[32],"offer_name":[32],"offer_message":[32],"offer_expires_in":[32],"remember_my_choice":[32],"add_to_cart":[32],"out_of_stock":[32],"open":[64],"showOffer":[64]}],[0,"salla-search",{"inline":[4],"oval":[4],"height":[2],"results":[32],"placeholder":[32],"noResultsText":[32],"typing":[32],"debounce":[32],"search_term":[32]}],[4,"salla-social-share",{"url":[513],"urlName":[513,"url-name"],"platforms":[16],"opened":[32],"allPlatforms":[32],"platformIcons":[32],"open":[64]}],[4,"salla-infinite-scroll",{"nextPage":[1,"next-page"],"autoload":[1028],"container":[1],"item":[1],"loadMore":[32],"noMore":[32],"failedToLoad":[32]}],[0,"salla-product-availability",{"channels":[1],"productId":[2,"product-id"],"isSubscribed":[1028,"is-subscribed"],"subTitle":[32],"mobileLabel":[32],"emailLabel":[32],"emailPlaceholder":[32],"subscribedMessage":[32],"title_":[32],"emailErrorMsg":[32],"isVisitorSubscribed":[32]}],[4,"salla-verify",{"display":[1],"type":[1025],"autoReload":[4,"auto-reload"],"title":[32],"resendAfter":[32],"isProfileVerify":[32],"getCode":[64],"open":[64]}],[4,"salla-swiper",{"loop":[4],"speed":[2],"itemPerView":[8,"item-per-view"],"spaceBetweenItems":[2,"space-between-items"],"direction":[1],"currentIndex":[32],"isLastSlideItem":[32],"isFirstSlideItem":[32]}],[0,"salla-rating-stars",{"name":[1],"size":[1],"value":[2]}],[4,"salla-list-tile",{"href":[1],"target":[1]}],[4,"salla-tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}],[4,"salla-tab-header",{"name":[1],"activeClass":[1,"active-class"],"height":[8],"centered":[4],"isSelected":[32],"getChild":[64]}],[4,"salla-tabs",{"backgroundColor":[1,"background-color"],"vertical":[4]},[[0,"onSelect","onSelectedTab"]]],[4,"salla-placeholder",{"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"],"default_title":[32],"default_description":[32]}],[0,"salla-tel-input",{"phone":[1025],"name":[1],"countryCode":[1025,"country-code"],"mobileRequired":[32],"countryCodeLabel":[32],"mobileLabel":[32],"tooShort":[32],"tooLong":[32],"invalidCountryCode":[32],"invalidNumber":[32],"errorMap":[32],"getValues":[64],"isValid":[64]}],[4,"salla-modal",{"isClosable":[1028,"is-closable"],"width":[513],"position":[513],"visible":[516],"isLoading":[1540,"is-loading"],"subTitleFirst":[4,"sub-title-first"],"noPadding":[4,"no-padding"],"subTitle":[1,"sub-title"],"icon":[1],"iconStyle":[1,"icon-style"],"imageIcon":[1,"image-icon"],"modalTitle":[32],"open":[64],"close":[64],"setTitle":[64],"loading":[64],"stopLoading":[64]}],[4,"salla-button",{"shape":[513],"color":[513],"fill":[513],"size":[513],"width":[513],"loading":[516],"disabled":[516],"loaderPosition":[1,"loader-position"],"href":[1],"load":[64],"stop":[64],"setText":[64],"disable":[64],"enable":[64]}],[0,"salla-loading",{"size":[8],"width":[8],"color":[1],"bgColor":[1,"bg-color"]}]]],["salla-add-product-button",[[4,"salla-add-product-button",{"channels":[513],"quantity":[514],"donatingAmount":[514,"donating-amount"],"productId":[520,"product-id"],"productStatus":[513,"product-status"],"productType":[513,"product-type"]}]]],["salla-conditional-fields",[[4,"salla-conditional-fields",null,[[0,"change","changeHandler"]]]]],["salla-installment",[[0,"salla-installment",{"price":[1],"language":[1],"currency":[1],"tamaraIsActive":[32],"tabbyIsActive":[32],"spotiiIsActive":[32]}]]],["salla-quantity-input",[[4,"salla-quantity-input",{"quantity":[32],"decrease":[64],"increase":[64],"setValue":[64]}]]]], options);
+  return bootstrapLazy([["salla-button_23",[[4,"salla-loyalty",{"prizePoints":[8,"prize-points"],"customerPoints":[2,"customer-points"],"prizeTitle":[1,"prize-title"],"allowEmail":[4,"allow-email"],"allowMobile":[4,"allow-mobile"],"requireEmail":[4,"require-email"],"guestMessage":[1,"guest-message"],"loyaltyProgram":[32],"buttonLoading":[32],"selectedItem":[32],"askConfirmation":[32],"is_loggedin":[32],"points":[32],"exchange_points":[32],"are_you_sure_to_exchange":[32],"for":[32],"cancel":[32],"confirm":[32],"cart_total_point_summary":[32],"cart_point_exchange_now":[32],"login_button":[32],"open":[64],"close":[64],"resetExchange":[64],"exchangeLoyaltyPoint":[64]}],[4,"salla-product-size-guide",{"guides":[32],"productId":[32],"open":[64],"close":[64]}],[4,"salla-login-modal",{"isEmailAllowed":[1028,"is-email-allowed"],"isMobileAllowed":[1028,"is-mobile-allowed"],"isEmailRequired":[1028,"is-email-required"],"title":[32],"loginTypeTitle":[32],"loginText":[32],"smsLabel":[32],"mobileLabel":[32],"emailLabel":[32],"enterText":[32],"bySMSText":[32],"byEmailText":[32],"emailErrorMsg":[32],"firstNameLabel":[32],"lastNameLabel":[32],"firstNameErrorMsg":[32],"lastNameErrorMsg":[32],"open":[64]},[[8,"verified","onVerified"]]],[4,"salla-scopes",{"selection":[1],"searchDisplayLimit":[2,"search-display-limit"],"mode":[32],"current_scope":[32],"scopes":[32],"originalScopesList":[32],"branchNotFound":[32],"ourServiceIsNotFound":[32],"searchForAvailabilityInOtherBranch":[32],"shoppingFromAnotherBranch":[32],"nowBrowsingFrom":[32],"confirmButton":[32],"scopeSearchPlaceholder":[32],"selected_scope":[32],"isDefault":[32],"isOpenedBefore":[32],"close":[64],"open":[64],"handleSubmit":[64]}],[0,"salla-rating-modal",{"orderId":[2,"order-id"],"order":[32],"open":[64],"close":[64]}],[0,"salla-localization-modal",{"language":[1537],"currency":[1537],"languages":[32],"currencies":[32],"languagesTitle":[32],"currenciesTitle":[32],"isLoading":[32],"open":[64],"close":[64],"submit":[64]}],[0,"salla-offer-modal",{"offer":[32],"offer_name":[32],"offer_message":[32],"offer_expires_in":[32],"remember_my_choice":[32],"add_to_cart":[32],"out_of_stock":[32],"open":[64],"showOffer":[64]}],[0,"salla-search",{"inline":[4],"oval":[4],"height":[2],"results":[32],"placeholder":[32],"noResultsText":[32],"typing":[32],"debounce":[32],"search_term":[32]}],[4,"salla-social-share",{"url":[513],"urlName":[513,"url-name"],"platforms":[16],"opened":[32],"allPlatforms":[32],"platformIcons":[32],"open":[64]}],[4,"salla-infinite-scroll",{"nextPage":[1,"next-page"],"autoload":[1028],"container":[1],"item":[1],"loadMore":[32],"noMore":[32],"failedToLoad":[32]}],[0,"salla-product-availability",{"channels":[1],"productId":[2,"product-id"],"isSubscribed":[1028,"is-subscribed"],"subTitle":[32],"mobileLabel":[32],"emailLabel":[32],"emailPlaceholder":[32],"subscribedMessage":[32],"title_":[32],"emailErrorMsg":[32],"isVisitorSubscribed":[32]}],[4,"salla-verify",{"display":[1],"type":[1025],"autoReload":[4,"auto-reload"],"title":[32],"resendAfter":[32],"isProfileVerify":[32],"getCode":[64],"open":[64]}],[4,"salla-swiper",{"loop":[4],"speed":[2],"itemPerView":[8,"item-per-view"],"spaceBetweenItems":[2,"space-between-items"],"direction":[1],"currentIndex":[32],"isLastSlideItem":[32],"isFirstSlideItem":[32]}],[0,"salla-rating-stars",{"name":[1],"size":[1],"value":[2]}],[4,"salla-list-tile",{"href":[1],"target":[1]}],[4,"salla-tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}],[4,"salla-tab-header",{"name":[1],"activeClass":[1,"active-class"],"height":[8],"centered":[4],"isSelected":[32],"getChild":[64]}],[4,"salla-tabs",{"backgroundColor":[1,"background-color"],"vertical":[4]},[[0,"onSelect","onSelectedTab"]]],[4,"salla-placeholder",{"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"],"default_title":[32],"default_description":[32]}],[0,"salla-tel-input",{"phone":[1025],"name":[1],"countryCode":[1025,"country-code"],"mobileRequired":[32],"countryCodeLabel":[32],"mobileLabel":[32],"tooShort":[32],"tooLong":[32],"invalidCountryCode":[32],"invalidNumber":[32],"errorMap":[32],"getValues":[64],"isValid":[64]}],[4,"salla-modal",{"isClosable":[1028,"is-closable"],"width":[513],"position":[513],"visible":[516],"isLoading":[1540,"is-loading"],"subTitleFirst":[4,"sub-title-first"],"noPadding":[4,"no-padding"],"subTitle":[1,"sub-title"],"icon":[1],"iconStyle":[1,"icon-style"],"imageIcon":[1,"image-icon"],"modalTitle":[32],"open":[64],"close":[64],"setTitle":[64],"loading":[64],"stopLoading":[64]}],[4,"salla-button",{"shape":[513],"color":[513],"fill":[513],"size":[513],"width":[513],"loading":[516],"disabled":[516],"loaderPosition":[1,"loader-position"],"href":[1],"load":[64],"stop":[64],"setText":[64],"disable":[64],"enable":[64]}],[0,"salla-loading",{"size":[8],"width":[8],"color":[1],"bgColor":[1,"bg-color"]}]]],["salla-add-product-button",[[4,"salla-add-product-button",{"channels":[513],"quantity":[514],"donatingAmount":[514,"donating-amount"],"productId":[520,"product-id"],"productStatus":[513,"product-status"],"productType":[513,"product-type"]}]]],["salla-conditional-fields",[[4,"salla-conditional-fields",null,[[0,"change","changeHandler"]]]]],["salla-installment",[[0,"salla-installment",{"price":[1],"language":[1],"currency":[1],"tamaraIsActive":[32],"tabbyIsActive":[32],"spotiiIsActive":[32]}]]],["salla-quantity-input",[[4,"salla-quantity-input",{"quantity":[32],"decrease":[64],"increase":[64],"setValue":[64]}]]]], options);
   });
 };
 

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

@@ -1533,9 +1533,13 @@ const SallaScopees = class {
     this.isDefault = true;
     this.isOpenedBefore = salla.storage.get("branch-choosed-before");
     /**
-     * Dictates when to show the searchfield
+     * Optionally open the modal or enforce the pop-up to the viewer
      */
-    this.searchFieldToggler = 6;
+    this.selection = 'optional';
+    /**
+     * Dictates when to show the search field
+     */
+    this.searchDisplayLimit = 6;
     this.getFormTitle = () => {
       var _a;
       if (((_a = this.originalScopesList) === null || _a === void 0 ? void 0 : _a.length) < 2)
@@ -1547,24 +1551,22 @@ const SallaScopees = class {
     salla.event.on('scopes::open', ({ mode = null, product_id = null }) => {
       if (!!mode)
         this.mode = mode;
-      this.isDefault = !mode || mode == ModeType.DEFAULT;
       this.open(mode, product_id);
     });
-    salla.lang.onLoaded(() => {
-      this.branchNotFound = salla.lang.get("blocks.scope.branch_looking_for_not_found");
-      this.ourServiceIsNotFound = salla.lang.get("blocks.scope.our_services_not_available_in_this_branch");
-      this.searchForAvailabilityInOtherBranch = salla.lang.get('blocks.scope.search_for_availability_in_other_branches');
-      this.shoppingFromAnotherBranch = salla.lang.get("blocks.scope.shopping_from_another_branch");
-      this.nowBrowsingFrom = salla.lang.get('blocks.scope.you_are_browse_store_from');
-      this.confirmButton = salla.lang.get('common.elements.confirm');
-      this.scopeSearchPlaceholder = salla.lang.get('blocks.scope.searching_for_a_branch');
-    });
+    this.branchNotFound = salla.lang.get("blocks.scope.branch_looking_for_not_found");
+    this.ourServiceIsNotFound = salla.lang.get("blocks.scope.our_services_not_available_in_this_branch");
+    this.searchForAvailabilityInOtherBranch = salla.lang.get('blocks.scope.search_for_availability_in_other_branches');
+    this.shoppingFromAnotherBranch = salla.lang.get("blocks.scope.shopping_from_another_branch");
+    this.nowBrowsingFrom = salla.lang.get('blocks.scope.you_are_browse_store_from');
+    this.confirmButton = salla.lang.get('common.elements.confirm');
+    this.scopeSearchPlaceholder = salla.lang.get('blocks.scope.searching_for_a_branch');
   }
   async close() {
     var _a;
     return await ((_a = this.modal) === null || _a === void 0 ? void 0 : _a.close());
   }
   async open(mode = ModeType.DEFAULT, product_id = null) {
+    this.isDefault = !mode || mode == ModeType.DEFAULT;
     this.modal.open();
     return await (mode == ModeType.AVAILABILITY ? salla.scope.getProductAvailability(product_id) : salla.scope.get())
       .then((resp) => {
@@ -1580,11 +1582,11 @@ const SallaScopees = class {
     });
   }
   async handleSubmit() {
-    salla.storage.set("branch-choosed-before", true);
     let payload = { 'scope_id': this.current_scope.id };
     this.changeBtn.load();
     return await salla.scope.change(payload)
       .then(() => {
+      salla.storage.set("branch-choosed-before", true);
       window.location.reload();
     }).catch(e => console.log(e))
       .finally(() => {
@@ -1619,24 +1621,24 @@ const SallaScopees = class {
     return h("salla-placeholder", { alignment: "center", class: "s-scopes-placeholder" }, h("span", { slot: "title" }, this.branchNotFound), h("span", { slot: "description" }, this.ourServiceIsNotFound));
   }
   defaultContent() {
-    return [h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-position": this.position }, h("input", { id: `${this.position} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }), h("label", { htmlFor: `${this.position} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" }, h("span", null, scope.name))))), this.footerContent()];
+    return [h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, h("input", { id: `${this.selection} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }), h("label", { htmlFor: `${this.selection} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" }, h("span", null, scope.name))))), this.footerContent()];
   }
   availabilityContent() {
-    return h("div", { class: "s-scopes-container" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-position": this.position }, h("h2", { class: { "s-scopes-label": true, "s-scopes-clickable": this.isDefault } }, h("span", null, scope.name)), h("h2", { style: { 'color': scope.availability.color }, class: `s-scopes-${scope.availability.key}` }, scope.availability.label))));
+    return h("div", { class: "s-scopes-container" }, this.scopes.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, h("h2", { class: { "s-scopes-label": true, "s-scopes-clickable": this.isDefault } }, h("span", null, scope.name)), h("h2", { style: { 'color': scope.availability.color }, class: `s-scopes-${scope.availability.key}` }, scope.availability.label))));
   }
   footerContent() {
     return h("div", { class: "s-scopes-footer" }, h("slot", { name: "footer" }, h("salla-button", { ref: btn => this.changeBtn = btn, disabled: !this.current_scope, onClick: () => this.handleSubmit(), class: "s-scopes-submit", "loader-position": "center", width: "wide" }, this.confirmButton)));
   }
   render() {
-    return (h(Host, null, h("salla-modal", { ref: modal => this.modal = modal, id: "s-scopes-modal", class: "s-scopes-modal", isLoading: true }, h("salla-list-tile", { class: this.originalScopesList.length ? "s-scopes-header block" : "s-hidden" }, h("div", { slot: "icon", class: "s-scopes-header-icon", innerHTML: StoreAlt }), h("div", { slot: "title", class: "s-scopes-header-title" }, this.nowBrowsingFrom), h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, !!this.selected_scope ? this.selected_scope.name : "")), h("div", { class: "s-scopes-wrap" }, !!this.originalScopesList.length && h("h4", { class: "s-scopes-title" }, this.getFormTitle()), this.originalScopesList.length > this.searchFieldToggler ?
+    return (h(Host, null, h("salla-modal", { ref: modal => this.modal = modal, id: "s-scopes-modal", isClosable: this.selection == 'optional', class: "s-scopes-modal", isLoading: true }, h("salla-list-tile", { class: this.originalScopesList.length ? "s-scopes-header block" : "s-hidden" }, h("div", { slot: "icon", class: "s-scopes-header-icon", innerHTML: StoreAlt }), h("div", { slot: "title", class: "s-scopes-header-title" }, this.nowBrowsingFrom), h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, !!this.selected_scope ? this.selected_scope.name : "")), h("div", { class: "s-scopes-wrap" }, !!this.originalScopesList.length && h("h4", { class: "s-scopes-title" }, this.getFormTitle()), this.originalScopesList.length > this.searchDisplayLimit ?
       h("div", { class: "s-scopes-search-wrapper" }, h("div", { class: "s-scopes-search-icon", innerHTML: Search }), h("input", { type: "text", class: "s-scopes-search-input", onInput: e => this.handleSearchFieldTyping(e), placeholder: this.scopeSearchPlaceholder }))
       : "", this.scopes.length < 2 ?
       this.placeholderContent()
       : this.isDefault ? this.defaultContent() : this.availabilityContent()))));
   }
-  componentDidRender() {
-    if (!this.isOpenedBefore && this.position == 'popup') {
-      salla.event.dispatch('scopes::open', {});
+  componentDidLoad() {
+    if (!this.isOpenedBefore && this.selection == 'mandatory') {
+      this.open();
     }
   }
 };