@salla.sa/twilight-components
Version:
Salla Web Component
260 lines (250 loc) • 22.7 kB
JavaScript
/*!
* Crafted with ❤ by Salla
*/
import { h, proxyCustomElement, HTMLElement } from '@stencil/core/internal/client';
import { c as closeModals, f as formattedPointsJsx } from './functions.js';
import { l as loyaltyProgramIcon } from './gift.js';
import { C as Cart2 } from './cart2.js';
import { M as MailIcon } from './mail.js';
import { S as SICalendar } from './calendar.js';
import { I as IphoneXIcon } from './iphone-x.js';
import { L as Location } from './location.js';
import { S as SIShipping } from './shipping.js';
import { d as defineCustomElement$3 } from './salla-badge2.js';
import { d as defineCustomElement$2 } from './salla-loading2.js';
import { d as defineCustomElement$1 } from './salla-modal2.js';
var SIStore = `<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<title>store</title>
<path d="M27.25 16c-1.539-0.010-2.899-0.765-3.741-1.921l-0.009-0.013c-0.844 1.178-2.209 1.936-3.75 1.936s-2.906-0.758-3.741-1.922l-0.009-0.014c-0.844 1.178-2.209 1.936-3.75 1.936s-2.906-0.758-3.741-1.922l-0.009-0.014c-0.851 1.169-2.211 1.924-3.748 1.934h-0.002c-2.64-0.075-4.751-2.233-4.751-4.884 0-0.041 0.001-0.081 0.002-0.122l-0 0.006c0-0.086 0.011-0.169 0.032-0.249l-0.002 0.007 2-8c0.112-0.439 0.504-0.758 0.97-0.758h26c0.466 0 0.858 0.319 0.968 0.751l0.002 0.007 2 8c0.019 0.073 0.030 0.156 0.030 0.242v0c0.001 0.034 0.001 0.075 0.001 0.116 0 2.651-2.111 4.809-4.744 4.884l-0.007 0zM23.5 10c0.552 0 1 0.448 1 1v0c-0.006 0.069-0.010 0.149-0.010 0.23 0 1.522 1.234 2.756 2.756 2.756s2.756-1.234 2.756-2.756c0-0.040-0.001-0.080-0.003-0.12l0 0.006-1.782-7.116h-24.436l-1.782 7.116c0 0.003-0 0.007-0 0.011 0 1.544 1.217 2.804 2.744 2.873l0.006 0c1.535-0.073 2.752-1.336 2.752-2.883 0-0.041-0.001-0.082-0.003-0.123l0 0.006c0-0.552 0.448-1 1-1s1 0.448 1 1v0c-0.002 0.035-0.002 0.076-0.002 0.117 0 1.547 1.217 2.81 2.746 2.883l0.007 0c1.535-0.073 2.752-1.336 2.752-2.883 0-0.041-0.001-0.082-0.003-0.123l0 0.006c0-0.552 0.448-1 1-1s1 0.448 1 1v0c-0.002 0.035-0.002 0.076-0.002 0.117 0 1.547 1.217 2.81 2.746 2.883l0.007 0c1.535-0.073 2.752-1.336 2.752-2.883 0-0.041-0.001-0.082-0.003-0.123l0 0.006c0-0.552 0.448-1 1-1v0zM13 30h-10c-0.552 0-1-0.448-1-1v0-14.46c0-0.552 0.448-1 1-1s1 0.448 1 1v0 13.46h9c0.552 0 1 0.448 1 1s-0.448 1-1 1v0zM29 30h-10c-0.552 0-1-0.448-1-1s0.448-1 1-1v0h9v-13.46c0-0.552 0.448-1 1-1s1 0.448 1 1v0 14.46c0 0.552-0.448 1-1 1v0zM19 30c-0.552 0-1-0.448-1-1v0-7h-4v7c0 0.552-0.448 1-1 1s-1-0.448-1-1v0-8c0-0.552 0.448-1 1-1v0h6c0.552 0 1 0.448 1 1v0 8c0 0.552-0.448 1-1 1v0z"></path>
</svg>
`;
var SIUserAdd = `<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<title>user-add</title>
<path d="M10.667 16c4.044 0 7.333-3.289 7.333-7.333s-3.289-7.333-7.333-7.333-7.333 3.289-7.333 7.333 3.289 7.333 7.333 7.333zM10.667 4c2.573 0 4.667 2.093 4.667 4.667s-2.093 4.667-4.667 4.667-4.667-2.093-4.667-4.667 2.093-4.667 4.667-4.667zM30.667 14.667h-2.667v-2.667c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333v2.667h-2.667c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333h2.667v2.667c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-2.667h2.667c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333zM10.667 18.667c-5.881 0-10.667 3.813-10.667 8.5v2.167c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-2.167c0-3.217 3.588-5.833 8-5.833s8 2.616 8 5.833v2.167c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-2.167c0-4.687-4.785-8.5-10.667-8.5z"></path>
</svg>
`;
var SIChatConversationAlt = `<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<title>chat-conversation-alt</title>
<path d="M17.333 14.667h-8c-0.737 0-1.333 0.597-1.333 1.333s0.596 1.333 1.333 1.333h8c0.737 0 1.333-0.597 1.333-1.333s-0.596-1.333-1.333-1.333zM22.667 8h-13.333c-0.737 0-1.333 0.597-1.333 1.333s0.596 1.333 1.333 1.333h13.333c0.737 0 1.333-0.597 1.333-1.333s-0.596-1.333-1.333-1.333zM28 0h-24c-2.205 0-4 1.795-4 4v17.333c0 2.205 1.795 4 4 4h6.027l4.932 6.167c0.253 0.316 0.636 0.5 1.041 0.5s0.788-0.184 1.041-0.5l4.932-6.167h6.027c2.205 0 4-1.795 4-4v-17.333c0-2.205-1.795-4-4-4zM29.333 21.333c0 0.735-0.597 1.333-1.333 1.333h-6.667c-0.405 0-0.788 0.184-1.041 0.5l-4.292 5.365-4.292-5.365c-0.253-0.316-0.636-0.5-1.041-0.5h-6.667c-0.736 0-1.333-0.599-1.333-1.333v-17.333c0-0.735 0.597-1.333 1.333-1.333h24c0.736 0 1.333 0.599 1.333 1.333z"></path>
</svg>
`;
var SILink1 = `<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<title>link1</title>
<path d="M16.541 19.873c-0.489 0.205-0.825 0.68-0.825 1.233 0 0.184 0.037 0.359 0.105 0.519l-0.003-0.009c0.064 0.151 0.101 0.326 0.101 0.51 0 0.368-0.149 0.702-0.391 0.943v0l-3.771 3.772c-0.483 0.482-1.149 0.781-1.885 0.781s-1.403-0.298-1.885-0.781l-2.829-2.828c-0.483-0.483-0.781-1.149-0.781-1.886s0.299-1.403 0.781-1.886l3.776-3.771c0.244-0.24 0.578-0.388 0.948-0.388 0.183 0 0.357 0.036 0.516 0.102l-0.009-0.003c0.15 0.064 0.325 0.101 0.509 0.101 0.736 0 1.334-0.597 1.334-1.334 0-0.553-0.337-1.027-0.816-1.229l-0.009-0.003c-0.449-0.187-0.97-0.295-1.517-0.295-1.107 0-2.11 0.445-2.841 1.165l0-0-3.776 3.771c-0.963 0.966-1.559 2.299-1.559 3.771s0.596 2.805 1.559 3.771l2.829 2.828c0.965 0.965 2.298 1.562 3.771 1.562s2.806-0.597 3.771-1.562l3.772-3.771c0.723-0.725 1.171-1.726 1.171-2.832 0-0.551-0.111-1.076-0.312-1.555l0.010 0.026c-0.206-0.488-0.68-0.824-1.232-0.824-0.184 0-0.359 0.037-0.518 0.104l0.009-0.003z"></path>
<path d="M10.343 21.655c0.243 0.238 0.576 0.384 0.943 0.384s0.7-0.147 0.943-0.385l-0 0 10.372-10.371c0.232-0.24 0.374-0.566 0.374-0.926 0-0.736-0.597-1.333-1.333-1.333-0.36 0-0.687 0.143-0.927 0.375l-10.372 10.37c-0.241 0.241-0.39 0.575-0.39 0.943s0.149 0.701 0.39 0.943v0z"></path>
<path d="M28.728 6.099l-2.828-2.828c-0.966-0.963-2.299-1.559-3.771-1.559s-2.805 0.596-3.771 1.559l-3.772 3.771c-0.723 0.725-1.171 1.726-1.171 2.831 0 0.551 0.111 1.076 0.313 1.554l-0.010-0.026c0.206 0.488 0.68 0.824 1.233 0.824 0.737 0 1.334-0.597 1.334-1.334 0-0.184-0.037-0.359-0.104-0.518l0.003 0.009c-0.063-0.15-0.1-0.324-0.1-0.506 0-0.368 0.149-0.7 0.389-0.942l3.771-3.771c0.483-0.483 1.149-0.781 1.886-0.781s1.403 0.299 1.886 0.781l2.828 2.828c0.483 0.483 0.781 1.149 0.781 1.886s-0.299 1.403-0.781 1.886v0l-3.776 3.764c-0.244 0.24-0.579 0.388-0.948 0.388-0.183 0-0.357-0.036-0.515-0.102l0.009 0.003c-0.151-0.064-0.326-0.101-0.51-0.101-0.737 0-1.334 0.597-1.334 1.334 0 0.553 0.336 1.027 0.815 1.229l0.009 0.003c0.45 0.189 0.974 0.298 1.523 0.298 1.106 0 2.109-0.445 2.838-1.167l3.77-3.77c0.965-0.966 1.562-2.301 1.562-3.775 0-1.471-0.595-2.803-1.557-3.769l0 0z"></path>
</svg>
`;
var SIUser = `<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<title>user</title>
<path d="M16 16c4.412 0 8-3.588 8-8s-3.588-8-8-8-8 3.588-8 8 3.588 8 8 8zM16 2.667c2.941 0 5.333 2.392 5.333 5.333s-2.392 5.333-5.333 5.333-5.333-2.392-5.333-5.333 2.392-5.333 5.333-5.333zM16 18.667c-7.476 0-13.333 3.66-13.333 8.333v3.667c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-3.667c0-3.019 4.984-5.667 10.667-5.667s10.667 2.648 10.667 5.667v3.667c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-3.667c0-4.673-5.857-8.333-13.333-8.333z"></path>
</svg>
`;
var SIMapLocation = `<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<title>map-location</title>
<path d="M24.667 8.013v-0.013c0-0.736-0.597-1.327-1.333-1.327s-1.333 0.604-1.333 1.34 0.597 1.333 1.333 1.333 1.333-0.597 1.333-1.333zM30.667 18.667c-0.736 0-1.333 0.596-1.333 1.333v8.701l-7.879-3.135c-0.308-0.127-0.651-0.127-0.961-0.011l-9.817 3.684-8.009-3.121v-20.351l7.633 2.181c0.708 0.205 1.447-0.209 1.648-0.916 0.203-0.708-0.207-1.447-0.915-1.648l-9.333-2.667c-0.403-0.115-0.836-0.035-1.169 0.217-0.335 0.252-0.531 0.645-0.531 1.064v23.029c0 0.549 0.337 1.043 0.849 1.243l9.333 3.637c0.305 0.12 0.645 0.12 0.952 0.007l9.812-3.68 9.227 3.669c0.16 0.064 0.327 0.095 0.493 0.095 0.263 0 0.525-0.079 0.749-0.231 0.365-0.247 0.584-0.661 0.584-1.103v-10.667c0-0.737-0.597-1.333-1.333-1.333zM23.333 22.667c0.395 0 0.769-0.175 1.023-0.476 0.783-0.935 7.644-9.241 7.644-13.357 0-4.389-2.976-8.833-8.667-8.833-5.689 0-8.667 4.444-8.667 8.833 0 4.116 6.863 12.423 7.645 13.357 0.253 0.301 0.628 0.476 1.021 0.476zM23.333 2.667c4.145 0 6 3.097 6 6.167 0 2.095-3.347 7.027-6 10.385-2.653-3.36-6-8.291-6-10.385 0-3.069 1.856-6.167 6-6.167z"></path>
</svg>
`;
const sallaLoyaltyProgramCss = "";
/**
* Dashboard sicons:
* share - sicon-share-alt
* order from store - sicon-shopping-basket
* rate order - sicon-chat-conversation-alt
* order from app - sicon-iphone-x
* first order - sicon-add-to-cart
* pos - sicon-store
* fill profile - sicon-user-add
*/
const sicons = {
'FIRST_ORDER_STORE_FOR_UNIT': h("span", { innerHTML: Cart2 }),
'FIRST_ORDER_STORE_FIX_AMOUNT': h("span", { innerHTML: Cart2 }),
'ORDER_FROM_APP_FOR_UNIT': h("span", { innerHTML: Cart2 }),
'ORDER_FROM_APP_FIX_AMOUNT': h("span", { innerHTML: Cart2 }),
'CONDITION_RATING_SHIPPING_STORE': h("span", { innerHTML: SIStore }),
'CONDITION_RATING_PRODUCT': h("span", { innerHTML: SIChatConversationAlt }),
'CONDITION_RATING_SHIPPING_COMPANY': h("span", { innerHTML: SIShipping }),
'CONDITION_COMPLETE_PERSONAL_INFORMATION_BIRTHDAY': h("span", { innerHTML: SICalendar }),
'CONDITION_COMPLETE_PERSONAL_INFORMATION_EMAIL': h("span", { innerHTML: MailIcon }),
'CONDITION_COMPLETE_PERSONAL_INFORMATION_MOBILE': h("span", { innerHTML: IphoneXIcon }),
'CONDITION_COMPLETE_PERSONAL_INFORMATION_GENDER': h("span", { innerHTML: SIUser }),
'CONDITION_BUY_FROM_STORE_FOR_UNIT': h("span", { innerHTML: Cart2 }),
'CONDITION_BUY_FROM_STORE_FIX_AMOUNT': h("span", { innerHTML: Cart2 }),
'order_from_pos_1': h("span", { innerHTML: IphoneXIcon }),
'order_from_pos_2': h("span", { innerHTML: Location }),
'buy_from_pos_1': h("span", { innerHTML: SIMapLocation }),
'buy_from_pos_2': h("span", { innerHTML: IphoneXIcon }),
'CONDITION_BUY_FROM_POS_FOR_UNIT': h("span", { innerHTML: IphoneXIcon }),
'CONDITION_BUY_FROM_POS_FIX_AMOUNT': h("span", { innerHTML: IphoneXIcon }),
'affiliate_link_1': h("span", { innerHTML: SILink1 }),
'affiliate_link_2': h("span", { innerHTML: SIUserAdd }),
'affiliate_link_3': h("span", { innerHTML: Cart2 }),
'CONDITION_AFFILIATE_LINK': h("span", { innerHTML: SILink1 }),
};
const SallaLoyaltyPoint = /*@__PURE__*/ proxyCustomElement(class SallaLoyaltyPoint extends HTMLElement {
constructor() {
super();
this.__registerHost();
}
async handleShareAction(e, point, successText) {
const isDesktop = window.matchMedia('(min-width: 1024px)').matches;
// only on mobile/tablet devices
if ('share' in navigator && !isDesktop) {
try {
await navigator.share({
title: document.title,
url: point.url,
});
return;
}
catch (error) { }
}
const el = e.target;
const oldTextContent = el.textContent;
const temporaryTextContent = successText;
// fallback to clipboard
if ('clipboard' in navigator) {
try {
await navigator.clipboard.writeText(point.url);
el.textContent = temporaryTextContent;
setTimeout(() => {
el.textContent = oldTextContent;
}, 5000);
return;
}
catch (error) { }
}
// fallback to textarea
const textarea = document.createElement('textarea');
textarea.value = point.url;
textarea.style.opacity = '0';
this.host.appendChild(textarea);
textarea.focus();
textarea.select();
try {
const success = document.execCommand('copy');
if (!success) {
throw new Error('Failed to copy URL to clipboard');
}
el.textContent = temporaryTextContent;
setTimeout(() => {
el.textContent = oldTextContent;
}, 5000);
}
catch (error) { }
this.host.removeChild(textarea);
}
handleAction(e, point) {
e.stopPropagation();
if (point.is_completed) {
e.preventDefault();
return;
}
switch (point.type) {
case 'profile':
case 'rating': {
if (!salla.config.isUser()) {
e.preventDefault();
closeModals(() => salla.event.dispatch('login::open'));
return;
}
return;
}
case 'share': {
if (!salla.config.isUser()) {
e.preventDefault();
closeModals(() => salla.event.dispatch('login::open'));
return;
}
e.preventDefault();
this.handleShareAction(e, point, salla.lang.get('pages.loyalty_program.copied'));
return;
}
}
}
getSubHeading(point) {
switch (point.type) {
case 'share':
return (h("div", { class: "s-loyalty-program-point-subheading" }, h("h2", null, salla.lang.get('pages.loyalty_program.how_to_start')), h("p", null, salla.lang.get('pages.loyalty_program.three_simple_steps'))));
case 'pos':
return (h("div", { class: "s-loyalty-program-point-subheading" }, h("h2", null, salla.lang.get('pages.loyalty_program.how_to_start')), h("p", null, salla.lang.get('pages.loyalty_program.two_simple_steps'))));
default:
return '';
}
}
getTrailingContent(point) {
switch (point.type) {
case 'first_order':
case 'profile':
return h("p", { class: "s-loyalty-program-points-completed-note" }, salla.lang.get('pages.loyalty_program.one_time_points'));
default:
return point.is_completed ? h("p", { class: "s-loyalty-program-points-completed-note" }, salla.lang.get('pages.loyalty_program.one_time_points')) : '';
}
}
render() {
return (h("div", { key: '1a96a88716d9fa2b3e8aac4864a025824c48d36a' }, h("div", { key: '13bc00fa473bfb16b272d751b45ad7384db0fc43', onClick: () => closeModals(() => this.modal.open()), class: "s-loyalty-program-point-wrapper" }, h("div", { key: 'a7d6d5f9692c7454d6bd9aa350c4934ec1704002', class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-sm s-loyalty-program-circle-variant-fill" }, h("span", { key: '2e26922099bbc8d1d46d48d807f09b195868a262', class: this.point.icon })), h("div", { key: 'ea7c80d9fd595d1e319fb9840cfa7dc439ad2bbb', class: "s-loyalty-program-points-badge-mobile" }, h("salla-badge", { key: '76c01bd0380e5729989ae4b748d7e59f334b40b8', size: "xs", bg: "transparent" }, h("span", { key: 'b459db33b3926952415e2ac6a9b383a53467bc7f', innerHTML: loyaltyProgramIcon }), formattedPointsJsx(this.point))), h("div", { key: '528f5f6e1c36c637b69684d95ec304f9c129400e', class: "s-loyalty-program-points-badge-desktop" }, h("salla-badge", { key: '9360900b49e9b122c3de07ad08de0cc0e8eccec4', size: "sm", bg: "transparent" }, h("span", { key: '7786c402cb6b946f9fd6402e1d066ad58ae4c0d4', innerHTML: loyaltyProgramIcon }), formattedPointsJsx(this.point))), h("p", { key: 'e6e4e93f0cdbd7dfd0dc39f279cac0bbb9ca4fa8', class: "s-loyalty-program-point-description" }, this.point.name), this.point.is_completed ?
h("a", { class: {
's-loyalty-program-points-action': true,
's-loyalty-program-points-action-completed': this.point.is_completed,
's-loyalty-program-points-action-incomplete': !this.point.is_completed,
} }, salla.lang.get('pages.loyalty_program.completed'))
: h("a", { href: this.point.url, onClick: e => this.handleAction(e, this.point), class: {
's-loyalty-program-points-action': true,
's-loyalty-program-points-action-completed': this.point.is_completed,
's-loyalty-program-points-action-incomplete': !this.point.is_completed,
} }, this.point.description)), h("salla-modal", { key: '1b4bbdf4a31b15a05de6e82eaba7e41623bb7926', ref: modal => this.modal = modal, class: "s-loyalty-program-point-modal s-loyalty-program-modal", width: window.matchMedia('(min-width: 768px)').matches ? 'md' : 'sm', noPadding: true }, h("div", { key: 'dd47de6d728d0e242ba907df2ad5efac90eca3bc', class: "s-loyalty-program-points-modal-header" }, h("h1", { key: '5b683091ac479ada36a8a653379973399ef7a9e9', class: "s-loyalty-program-points-modal-info" }, this.point.name)), h("div", { key: '76a05aedcc3b13f44709e369bf16c9c992689406', class: "s-loyalty-program-modal-scrollable-content" }, h("div", { key: 'a71c0eb9f39a103728974e687dfcb9be5d8d9be7', class: "s-loyalty-program-points-modal-main" }, h("div", { key: 'de83e494131791cae7df3782489be5f1d2ffcb4d', class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xl s-loyalty-program-circle-variant-fill" }, h("span", { key: '2c8faf8db0b4984d0c9319e18343e41d9a6d0d26', class: this.point.icon })), h("salla-badge", { key: 'b29e2f350840663bb36dff05124aa58a3c774640', size: "sm", bg: "light" }, h("span", { key: '0d6cc163f3b14710bca60c5e4fb9c602ff8416a1', innerHTML: loyaltyProgramIcon }), h("span", { key: 'a9ddb1a5ed1c69e0c2017691f67d360f189d4b37', class: "s-loyalty-program-points-badge-points" }, formattedPointsJsx(this.point)))), this.getSubHeading(this.point), h("div", { key: '3327f05f80fec2ddceed0e6f230f0a99020445cc', class: "s-loyalty-program-points-modal-details" }, h("div", { key: 'd5505b3ab399f5d0b668c02bbf441eee33b4a1b2', class: "s-loyalty-program-points-chains-wrapper" }, h("ul", { key: 'dc9b64ad5795e87a12ffd104c5d6bbbade1c2a2e', class: "s-loyalty-program-points-chain-list" }, !!this.point.steps && Object.keys(this.point.steps).length > 0
? Object.values(this.point.steps).map((step, idx) => {
const stepsArray = Object.values(this.point.steps);
const isLastItem = idx === stepsArray.length - 1;
return (h("li", { class: "s-loyalty-program-points-chain-item" }, h("div", { class: "s-loyalty-program-points-chain-icon" }, h("div", { class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xs s-loyalty-program-circle-variant-outline-primary" }, sicons[step.key]), !isLastItem && h("div", { class: "s-loyalty-program-points-chain-line" })), h("div", { class: "s-loyalty-program-points-chain-content" }, h("salla-badge", { size: "xs", color: "primary-900", bg: "primary-100" }, h("span", null, salla.lang.get(`pages.loyalty_program.step_${idx + 1}`))), h("p", { class: "s-loyalty-program-points-chain-description" }, step.title || step.name))));
})
: this.point.conditions?.map((condition, idx) => {
const isLastItem = idx === this.point.conditions.length - 1;
return (h("li", { class: "s-loyalty-program-points-chain-item" }, h("div", { class: "s-loyalty-program-points-chain-icon" }, h("div", { class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xs s-loyalty-program-circle-variant-outline-primary" }, sicons[condition.key]), !isLastItem && h("div", { class: "s-loyalty-program-points-chain-line" })), h("div", { class: "s-loyalty-program-points-chain-content" }, h("salla-badge", { size: "xs", color: "primary-900", bg: "primary-100" }, h("span", { innerHTML: loyaltyProgramIcon }), formattedPointsJsx(condition.points ?? 0)), h("p", { class: "s-loyalty-program-points-chain-description" }, condition.name))));
}))), this.getTrailingContent(this.point)), !this.point.branches?.length ? '' : h("div", { class: "s-loyalty-program-points-modal-list" }, h("div", { class: "s-loyalty-program-point-details-branches" }, h("h2", null, salla.lang.get('pages.loyalty_program.branches')), h("p", null, salla.lang.get('pages.loyalty_program.shop_from_branches'))), h("div", { class: "s-loyalty-program-points-modal-list-wrapper" }, h("ul", null, this.point.branches.map((branch) => (h("li", { class: "s-loyalty-program-points-modal-list-item" }, h("p", null, branch.name), h("salla-badge", { size: "sm", bg: "transparent" }, h("span", { innerHTML: loyaltyProgramIcon }), h("a", { href: branch.location ? `https://www.google.com/maps?q=${branch.location.lat},${branch.location.lon}` : '#', target: "_blank", rel: "noopener noreferrer" }, branch.address_description))))))))), h("div", { key: '685d0de853bd3becf1c10529768a5952b6365517', class: "s-loyalty-program-points-modal-action" }, h("a", { key: '806543e483c0872139ee395ee9ba2dbe27061564', href: this.point.url, onClick: (e) => (e.stopPropagation(), this.handleAction(e, this.point)), class: {
's-loyalty-program-points-action': true,
's-loyalty-program-points-action-completed': this.point.is_completed,
's-loyalty-program-points-action-incomplete': !this.point.is_completed,
} }, this.point.is_completed ? salla.lang.get('pages.loyalty_program.completed') : this.point.description)))));
}
get host() { return this; }
static get style() { return sallaLoyaltyProgramCss; }
}, [0, "salla-loyalty-point", {
"point": [16]
}]);
function defineCustomElement() {
if (typeof customElements === "undefined") {
return;
}
const components = ["salla-loyalty-point", "salla-badge", "salla-loading", "salla-modal"];
components.forEach(tagName => { switch (tagName) {
case "salla-loyalty-point":
if (!customElements.get(tagName)) {
customElements.define(tagName, SallaLoyaltyPoint);
}
break;
case "salla-badge":
if (!customElements.get(tagName)) {
defineCustomElement$3();
}
break;
case "salla-loading":
if (!customElements.get(tagName)) {
defineCustomElement$2();
}
break;
case "salla-modal":
if (!customElements.get(tagName)) {
defineCustomElement$1();
}
break;
} });
}
defineCustomElement();
export { SallaLoyaltyPoint as S, SIUserAdd as a, defineCustomElement as d };