npm - @kompasid/lit-web-components - Versions diffs - 0.6.7 → 0.7.0 - Mend

@kompasid/lit-web-components 0.6.7 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (31) hide show

package/demo/index.html CHANGED Viewed

@@ -45,6 +45,8 @@
     <script type="module">
       import { html, render } from 'lit'
+      import '../dist/src/components/kompasid-widget-recirculations-default/KompasWidgetRecirculationsDefault.js'
+      import '../dist/src/components/kompasid-widget-recirculations-list/KompasWidgetRecirculationsList.js'
       import '../dist/src/components/kompasid-footer/KompasFooter.js'
       import '../dist/src/components/kompasid-paywall/KompasPaywall.js'
       import '../dist/src/components/kompasid-paywall-video/KompasPaywallVideo.js'
@@ -78,7 +80,7 @@
       const textHeader = 'this is message for header information'
       const userGuid = '111000'
       const trackerSubscriptionStatus = 'register'
-      const swgEnable = false
+      const swgEnable = true
       const videoPaywallType = 'homepage'
       const freewallType = 'landing_page'
       const headCopyExpand = ''
@@ -108,6 +110,22 @@
           updateMembership: 'Perbarui Langganan',
       }
+      const widgetRelatedPost = {
+        navigation: {
+          name: 'Artikel Terkait',
+          permalink: undefined
+        },
+        permalinkArticle: 'https://www.kompas.id/baca/opini/2024/05/02/pesan-bung-karno-jaga-persatuan-dan-keutuhan?open_from=Section_Artikel_Lainnya',
+        slugs: 'persatuan,bung-karno, surat pembaca, eduard lukman, bharoto, wira hardiprakoso, vision'
+      }
+      const widgetOtherPost = {
+        navigation: {
+          name: 'Lainnya Dalam Opini',
+          permalink: '/kategori/opini'
+        }
+      }
       render(
         html`
           <kompasid-header-account
@@ -122,6 +140,22 @@
             .read_later_url=${readLaterUrl}
             .total_grace_period=${totalGracePeriod}
           ></kompasid-header-account>
+          <kompasid-widget-recirculations-default
+            .navigation=${widgetRelatedPost.navigation}
+            .permalinkArticle=${widgetRelatedPost.permalinkArticle}
+            .slugs=${widgetRelatedPost.slugs}
+          ></kompasid-widget-recirculations-default>
+          <kompasid-widget-recirculations-default
+            .navigation=${widgetOtherPost.navigation}
+            type='otherArticle'
+            mainCategory='opini'
+          ></kompasid-widget-recirculations-default>
+          <kompasid-widget-recirculations-list widgetTitle="Terpopuler" apiSlug="popular-article">
+          </kompasid-widget-recirculations-list>
           <kompasid-paywall
             .type=${type}
             .theme=${theme}

package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.js CHANGED Viewed

@@ -770,8 +770,8 @@ let KompasIdPaywallBody = class KompasIdPaywallBody extends LitElement {
         ${data.memberships.map(item => item.isHighlight
             ? this.primaryPackages(item)
             : this.secondaryPackages(item))}
-        ${this.swgEnable ? this.swgPackageSection() : nothing}
         ${this.freeTrialPackageSection()} ${this.freeTrialPopUp()}
+        ${this.swgEnable ? this.swgPackageSection() : nothing}
       </div>
     `;
     }
@@ -904,12 +904,16 @@ let KompasIdPaywallBody = class KompasIdPaywallBody extends LitElement {
         class="fixed w-full h-full inset-0 flex justify-center items-center z-50 bg-black bg-opacity-75 hidden"
       >
         <div
-          class="bg-white rounded w-11/12 sm:w-3/4 md:w-1/2 lg:w-1/3 2xl:w-1/4 p-6 text-center"
+          class="${this.isDark
+            ? 'bg-dark-4'
+            : 'bg-white'} rounded w-11/12 sm:w-3/4 md:w-1/2 lg:w-1/3 2xl:w-1/4 p-6 text-center"
         >
           <div class="w-full flex justify-end px-2">
             <button
               @click=${this.closeFreeTrialPopup}
-              class="w-8 h-8 pl-4 text-grey-400"
+              class="w-8 h-8 pl-4 ${this.isDark
+            ? 'text-grey-300'
+            : 'text-grey-400'}"
             >
               ${unsafeSVG(getFontAwesomeIcon('fas', 'xmark', 24, 24))}
             </button>
@@ -922,11 +926,17 @@ let KompasIdPaywallBody = class KompasIdPaywallBody extends LitElement {
               />
             </div>
           </div>
-          <p class="font-bold text-lg text-grey-600 mt-4">
+          <p
+            class="font-bold text-lg ${this.isDark
+            ? 'text-white'
+            : 'text-grey-600'} mt-4"
+          >
             Coba Gratis Kompas.id di Aplikasi
           </p>
           <div
-            class="hidden lg:block lg:flex flex border border-grey-300 rounded mt-4 px-8 py-4 items-center"
+            class="${this.isDark
+            ? 'bg-dark-3 border border-dark-9'
+            : 'bg-white border border-grey-300'} hidden lg:block lg:flex flex rounded mt-4 px-8 py-4 items-center"
           >
             <div class="w-1/3 flex mr-6">
               <img
@@ -934,13 +944,19 @@ let KompasIdPaywallBody = class KompasIdPaywallBody extends LitElement {
                 alt="QR Code Deep Link"
               />
             </div>
-            <div class="w-2/3 text-base text-grey-600 text-left">
+            <div
+              class="w-2/3 text-base ${this.isDark
+            ? 'text-dark-7'
+            : 'text-grey-600'} text-left"
+            >
               Coba gratis 3 hari Kompas.id melalui aplikasi. Pindai kode QR
               dengan ponsel atau tablet untuk mengunduh aplikasi.
             </div>
           </div>
           <div
-            class="text-base text-grey-600 text-center lg:hidden px-2 md:px-8"
+            class="text-base ${this.isDark
+            ? 'text-dark-7'
+            : 'text-grey-600'} text-center lg:hidden px-2 md:px-8"
           >
             Dapatkan akses gratis selama 3 hari ke konten dan fitur premium
             Kompas.id di aplikasi.
@@ -950,22 +966,34 @@ let KompasIdPaywallBody = class KompasIdPaywallBody extends LitElement {
               href="https://play.google.com/store/apps/details?id=id.kompas.app"
               target="_blank"
               ><img
-                src="https://cdn-www.kompas.id/halaman-unduh/image/google-play-badge.png"
+                src="${this.isDark
+            ? 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/Button_Download%20Google%20Play_Dark%20Mode.svg'
+            : 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/Button_Download%20Google%20Play_Light%20Mode.svg'}"
                 alt="Google Play Badge"
             /></a>
             <a
               href="https://apps.apple.com/id/app/kompas-id/id1242195037?l=id"
               target="_blank"
               ><img
-                src="https://cdn-www.kompas.id/halaman-unduh/image/ios-badge.png"
+                src="${this.isDark
+            ? 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/Button_Download%20App%20Store_Dark%20Mode.svg'
+            : 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/Button_Download%20App%20Store_Light%20Mode.svg'}"
                 alt="iOS App Store Badge"
             /></a>
           </div>
           <button
             onclick="window.open('https://app.komp.as/langganan', '_blank')"
-            class="h-12 bg-green-500 rounded-md mt-4 flex w-full items-center justify-center lg:hidden"
+            class="h-12 ${this.isDark
+            ? 'bg-green-300'
+            : 'bg-green-500'} rounded-md mt-4 flex w-full items-center justify-center lg:hidden"
           >
-            <h6 class="text-white font-bold p-4">Unduh Sekarang</h6>
+            <h6
+              class="${this.isDark
+            ? 'text-dark-5'
+            : 'text-white'} font-bold p-4"
+            >
+              Unduh Sekarang
+            </h6>
           </button>
         </div>
       </div>

package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"KompasPaywallBody.js","sourceRoot":"","sources":["../../../../src/components/kompasid-paywall-body/KompasPaywallBody.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-return-assign /\n\nimport { html, css, LitElement, nothing } from 'lit'\nimport { property, state, customElement } from 'lit/decorators.js'\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport {\n PaywallProduct,\n Product,\n Packages,\n PaymentImage,\n PaywallType,\n} from '../kompasid-paywall/types.js'\nimport { getFontAwesomeIcon } from '../../utils/fontawesome-setup.js'\nimport { deviceType } from '../../utils/deviceType.js'\nimport { formatRupiah } from '../../utils/formatRupiah.js'\nimport { addGoogleFonts } from '../../utils/googleFont.js'\nimport { redirectToRegister, redirectToLogin } from '../../utils/cta.js'\n\n@customElement('kompasid-paywall-body')\nexport class KompasIdPaywallBody extends LitElement {\n static styles = [\n css`\n .wrapper-body {\n display: flex;\n flex-direction: column;\n justify-items: center;\n align-items: center;\n }\n\n .font-lora {\n font-family: 'Lora', 'Georgia', 'serif';\n }\n `,\n TWStyles,\n ]\n\n /\n Props\n /\n /\n prop slug untuk menghandle slug\n * prop isLogin untuk menghandle apakah user sudah login atau belum\n * prop type untuk menghandle tipe epaper\n * prop paywallData untuk menghandle data paywall\n * prop userGuid untuk menghandle user Guid\n * prop subscriptionStatus untuk menghandle status subscription user\n * prop countdownArticle untuk menghandle count artikel\n * prop swgEnable untuk menghandle swg apakah di aktifkan atau tidak\n * prop paywall_location = The location where user encounter the paywall\n * prop paywall_subscription_package = The name of the subscription package viewed by user\n * prop paywall_subscription_id = The ID of the subscription package viewed by user\n * prop paywall_subscription_price = The price of the subscriprtion package viewed by user\n * prop paywall_position = The position of the subscription package viewed by user\n * prop tracker_page_type = Type of the page\n * prop tracker_content_id = ID of article (slug)\n * prop tracker_content_type = Whether it's free article or paid article\n * prop tracker_content_title = The title of article\n * prop tracker_content_categories = The category of the content\n * prop tracker_user_type = Type of user based on their subscription\n * prop tracker_subscription_status = Status of their subscription\n * prop tracker_page_domain = Page Domain\n * prop tracker_metered_wall_type = The type of Metered Wall\n * prop tracker_metered_wall_balance = The balance of their metered wall\n * prop tracker_metered_wall_balance = The edition of epaper viewed by user\n * prop theme = The theme of the paywall component\n /\n\n @property({ type: String }) slug = ''\n @property({ type: Boolean }) isLogin = false\n @property({ type: String }) type: PaywallType = 'reguler'\n @property({ type: Object }) paywallData: PaywallProduct \| undefined =\n undefined\n @property({ type: String }) userGuid = ''\n @property({ type: String }) subscriptionStatus = ''\n @property({ type: Number }) countdownArticle = 0\n @property({ type: Boolean }) swgEnable = false\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: Number }) paywall_subscription_id = 0\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n @property({ type: String }) tracker_epaper_edition = ''\n @property({ type: String }) theme = ''\n @property() togglePaywall = () => {}\n\n /\n State\n /\n\n @state() private isExtensionsOpened = false\n @state() private kompasAkunHost = 'https://akun.kompas.id'\n @state() private kompasApigenHost = 'https://apigen.kompas.id'\n @state() private kompasApiWcmHost = 'https://apiwcm.kompas.id'\n @state() private kompasLoginHost = 'https://account.kompas.id/login'\n @state() private epaperHost = 'https://epaper.kompas.id'\n @state() private swgPublisherName = 'Harian Kompas'\n @state() private swgPublisherId = 'kompas.id'\n @state() private swgProductId = 'kompas.id:kompas_digital_premium'\n @state() private errorFlag = 0\n\n buttonElement!: HTMLButtonElement\n targetElement!: HTMLElement\n\n /\n Getter\n /\n\n get loginUrl() {\n return `${this.kompasLoginHost}?next=${encodeURIComponent(\n this.epaperHost + window.location.pathname\n )}&loc=hard_paywall`\n }\n\n get isDark() {\n return this.theme === 'dark'\n }\n\n get isEntitledForIntroductoryPrice(): boolean {\n return !this.isLogin \|\| this.tracker_subscription_status === 'IA'\n }\n\n /\n Logic Function\n /\n\n private redirectToCheckout(\n url: string,\n name: string,\n id: string,\n price: number,\n position: number\n ): void {\n this.sendDataLayeronButtonBuyPackage(name, id, price, position)\n const originHost: string = encodeURIComponent(window.location.href)\n let source: string\n\n switch (this.type) {\n case 'epaper':\n source = 'epaper'\n break\n case 'audio':\n source = 'news_audio'\n break\n default:\n source = 'article'\n }\n const directUrlCheckout: string = `${url}${originHost}&source=${source}`\n window.open(directUrlCheckout)\n }\n\n private redirectToPrevUrl(): void {\n window.history.back()\n }\n\n private redirectToSubscriber(): void {\n this.sendDataLayer()\n window.open('https://www.kompas.id/berlangganan')\n }\n\n private redirectToHelpdesk(): void {\n this.sendDataLayeronHelpDesk()\n window.open(\n 'https://api.whatsapp.com/send/?phone=6281290050800&text=Halo,%20saya%20perlu%20informasi%20mengenai%20kompas.id'\n )\n }\n\n private handleClickOutside() {\n if (this.targetElement.classList.contains('wrapper-body')) {\n this.togglePaywall()\n }\n\n if (this.targetElement.id === 'freeTrialPopup') {\n this.closeFreeTrialPopup()\n }\n }\n\n private parsePrice(price: string): number {\n const lowerCasePrice = price.toLowerCase()\n\n if (lowerCasePrice.startsWith('rp')) {\n return parseFloat(price.replace(/[^0-9,]/g, ''))\n }\n\n return parseFloat(price.replace(/[^0-9.]/g, ''))\n }\n\n private async getRegisterToken(path: string, payload: any): Promise<string> {\n return fetch(`${this.kompasApigenHost}/v1/user/register/token/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => data.result.token)\n .catch(error => {\n throw error\n })\n }\n\n private async getUserToken(path: string, payload: any): Promise<string> {\n return fetch(`${this.kompasApigenHost}/v1/user/token/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => data.result.token)\n .catch(error => {\n throw error\n })\n }\n\n private async getSubscriptionToken(\n path: string,\n payload: any\n ): Promise<string> {\n return fetch(`${this.kompasAkunHost}/api/subscription/login/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => {\n this.errorFlag = 0\n return data.access_token\n })\n .catch(async error => {\n const errorCode = error.response.status\n if (errorCode === 500 && this.errorFlag < 5) {\n // eslint-disable-next-line no-plusplus\n this.errorFlag++\n setTimeout(async () => {\n await this.getSubscriptionToken(path, payload)\n }, 2000)\n } else {\n this.errorFlag = 0\n throw error\n }\n })\n }\n\n private async createSwG(payload: any, token: string) {\n await fetch(`${this.kompasApiWcmHost}/v2/membership/swg/create`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n Authorization: `Bearer ${token}`,\n },\n })\n .then(response => response.json())\n .catch(error => {\n throw error\n })\n }\n\n private subscribeWithGoogleButton(): any {\n // @ts-ignore\n // eslint-disable-next-line no-restricted-globals\n ;(self.SWG = self.SWG \|\| []).push((subscriptions: any) => {\n // set entitlement\n subscriptions.setOnEntitlementsResponse(() => {\n // subscriptions attach button\n subscriptions.attachButton(\n this.buttonElement,\n { theme: 'light', lang: 'en' },\n async () => {\n subscriptions.showOffers({ isClosable: true })\n subscriptions.setOnLoginRequest(() => {\n window.location.href = this.loginUrl\n })\n const offers = await subscriptions.getOffers()\n subscriptions.setOnFlowStarted((callback: any) => {\n if (callback.flow === 'showOffers') {\n window.dataLayer.push(this.swgPackageViewedDataLayer(offers))\n } else if (callback.flow === 'subscribe') {\n const selectedOfferSkuId = callback.data.skuId\n const selectedOffer = offers.find(\n (offer: any) => offer.skuId === selectedOfferSkuId\n )\n window.dataLayer.push(\n this.swgSubscribeButtonClicked(\n selectedOffer,\n offers.indexOf(selectedOffer)\n )\n )\n }\n })\n subscriptions.setOnPaymentResponse(async (paymentResponse: any) => {\n const response = await paymentResponse\n const raw = JSON.parse(response.purchaseData.raw)\n const { productId, purchaseToken, packageName } = raw\n const { email } = response.userData.data\n\n const payload = {\n subscription_token: purchaseToken,\n products: productId,\n detail: 'test',\n }\n const userToken = await this.getUserToken('google', payload)\n if (userToken) {\n // login and update membership\n const accessToken = await this.getSubscriptionToken('google', {\n token: userToken,\n })\n if (accessToken) {\n const payloadSWG = {\n email,\n package_name: packageName,\n product_id: productId,\n purchase_token: purchaseToken,\n }\n await this.createSwG(payloadSWG, accessToken)\n }\n } else {\n // register and login the unknown user\n const payloadRegisterToken = {\n subscription_token: purchaseToken,\n products: productId,\n detail: 'test',\n }\n const token = await this.getRegisterToken(\n 'google',\n payloadRegisterToken\n )\n if (token) {\n const accessToken = await this.getSubscriptionToken(\n 'google',\n { token }\n )\n const payloadSWRUknown = {\n email,\n package_name: packageName,\n product_id: productId,\n purchase_token: purchaseToken,\n }\n await this.createSwG(payloadSWRUknown, accessToken)\n }\n }\n response.complete().then(() => {\n window.location.href = this.loginUrl\n })\n })\n }\n )\n })\n })\n }\n\n private jsonScript() {\n const jsonData = {\n '@context': 'https://schema.org',\n '@type': ['WebSite', 'WebPage'],\n isAccessibleForFree: false,\n url: this.epaperHost + window.location.pathname,\n name: this.swgPublisherName,\n hasPart: {\n '@type': 'WebPageElement',\n },\n isPartOf: {\n '@type': ['CreativeWork', 'Product'],\n name: this.swgPublisherId,\n productID: this.swgProductId,\n },\n }\n const str = JSON.stringify(jsonData)\n const jsonScript = document.createElement('script')\n jsonScript.type = 'application/ld+json'\n jsonScript.text = str\n jsonScript.defer = true\n const jsonHead = document.querySelector('head')\n if (jsonHead) {\n jsonHead.appendChild(jsonScript)\n }\n }\n\n constructor() {\n super()\n this.handleClickOutside = this.handleClickOutside.bind(this)\n }\n\n protected createRenderRoot() {\n const root = super.createRenderRoot()\n root.addEventListener(\n 'click',\n (e: Event) => (this.targetElement = e.target as HTMLElement)\n )\n return root\n }\n\n override async connectedCallback() {\n super.connectedCallback()\n await this.updateComplete\n if (this.swgEnable) {\n this.jsonScript()\n const appendSWGButton = () => {\n this.buttonElement = this.shadowRoot?.getElementById(\n 'subscribe-with-google'\n ) as HTMLButtonElement\n if (this.buttonElement) {\n const head = document.querySelector('head')\n const script = document.createElement('script')\n script.src = 'https://news.google.com/swg/js/v1/swg.js'\n script.defer = true\n script.onload = this.subscribeWithGoogleButton()\n if (head) {\n head.appendChild(script)\n }\n }\n }\n setTimeout(appendSWGButton, 500)\n }\n addGoogleFonts(['pt-sans', 'lora'])\n document.addEventListener('click', this.handleClickOutside)\n }\n\n override async disconnectedCallback() {\n super.disconnectedCallback()\n document.removeEventListener('click', this.handleClickOutside)\n }\n\n private otherPackagesClicked() {\n this.sendDataLayerOtherPackagesClicked()\n this.redirectToSubscriber()\n }\n\n private customerServiceClicked() {\n this.sendDataLayerCustomerServiceClicked()\n this.redirectToHelpdesk()\n }\n\n /\n Data Layer\n /\n\n private buildGtmParams(\n event: string,\n impressions: Record<string, any>[],\n index: number = 0\n ) {\n const gtmParams: Record<string, any> = {\n event,\n impressions: impressions.map((impression, i) => ({\n paywall_location: this.paywall_location \|\| '',\n paywall_subscription_package: impression.package,\n paywall_subscription_id: impression.subscription_id,\n paywall_subscription_price: this.parsePrice(impression.price),\n paywall_position: index + i + 1,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain \|\| 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type \|\| 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n ...(this.type === 'epaper'\n ? { epaper_edition: this.tracker_epaper_edition }\n : {\n page_type: this.tracker_page_type,\n content_id: this.tracker_content_id,\n content_title: this.tracker_content_title,\n content_categories: this.tracker_content_categories,\n content_type: this.tracker_content_type,\n }),\n })),\n }\n\n return gtmParams\n }\n\n private generalPaywallDataLayer(event: string): Record<string, any> {\n const packages = this.paywallData?.packages ?? ({} as Packages)\n\n const impressions = packages.memberships.map(membership => ({\n package: membership.package,\n subscription_id: membership.subscriptionId,\n price: membership.price.toString(),\n }))\n\n return this.buildGtmParams(event, impressions)\n }\n\n private sendDataLayer(): void {\n window.dataLayer.push({\n event: 'halamanBerlanggananClick',\n subscriptionStatus: '',\n GUID: '',\n interface: deviceType(),\n })\n }\n\n private sendDataLayeronHelpDesk(): void {\n window.dataLayer.push({\n event: 'helpOfferClick',\n userType: this.subscriptionStatus,\n GUID: this.userGuid,\n interface: deviceType(),\n })\n }\n\n private sendDataLayeronButtonBuyPackage(\n name: string,\n id: string,\n price: number,\n position: number\n ): void {\n const gtmParams: Record<string, any> = {\n event: 'subscribe_button_clicked',\n paywall_location: this.paywall_location,\n paywall_subscription_package: name,\n paywall_subscription_id: id,\n paywall_subscription_price: price,\n paywall_position: position,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain \|\| 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type \|\| 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n }\n\n if (this.type !== 'epaper') {\n gtmParams.content_title = this.tracker_content_title\n gtmParams.content_id = this.tracker_content_id\n gtmParams.content_categories = this.tracker_content_categories\n gtmParams.content_type = this.tracker_content_type\n gtmParams.page_type = this.tracker_page_type\n } else {\n gtmParams.epaper_edition = this.tracker_epaper_edition\n }\n\n window.dataLayer.push(gtmParams)\n }\n\n private sendDataLayeronPaywallBody(): void {\n const gtmParams = this.generalPaywallDataLayer('paywall_viewed')\n window.dataLayer.push(gtmParams)\n }\n\n private sendDataLayerOtherPackagesClicked(): void {\n const gtmParams = this.generalPaywallDataLayer('other_packages_clicked')\n window.dataLayer.push(gtmParams)\n }\n\n private sendDataLayerCustomerServiceClicked(): void {\n const gtmParams = this.generalPaywallDataLayer('customer_service_clicked')\n window.dataLayer.push(gtmParams)\n }\n\n private swgPackageViewedDataLayer(data: any): Record<string, any> {\n const impressions = data.map(\n (item: {\n title: string\n skuId: string\n price: string\n introductoryPrice: string\n }) => ({\n package: item.title,\n subscription_id: item.skuId,\n price: item.introductoryPrice \|\| item.price,\n })\n )\n\n return this.buildGtmParams('subscription_package_viewed', impressions)\n }\n\n private swgSubscribeButtonClicked(item: any, index: number) {\n const gtmParams: any = {\n event: 'subscribe_button_clicked',\n paywall_location: this.paywall_location \|\| '',\n paywall_subscription_package: item.title,\n paywall_subscription_id: item.skuId,\n paywall_subscription_price: this.parsePrice(\n item.introductoryPrice \|\| item.price\n ),\n paywall_position: index + 1,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain \|\| 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type \|\| 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n }\n\n if (this.type === 'epaper') {\n gtmParams.epaper_edition = this.tracker_epaper_edition\n } else {\n gtmParams.page_type = this.tracker_page_type\n gtmParams.content_id = this.tracker_content_id\n gtmParams.content_title = this.tracker_content_title\n gtmParams.content_categories = this.tracker_content_categories\n gtmParams.content_type = this.tracker_content_type\n }\n\n return gtmParams\n }\n\n /\n Component\n /\n\n private headerSection(type: PaywallType, title: string) {\n let buttonContent\n\n if (type === 'epaper') {\n buttonContent = html` <button\n @click=${this.redirectToPrevUrl}\n class=\"hidden md:block w-8 h-8 pl-4 ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'}\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'arrow-left'))}\n </button>`\n } else if (type === 'audio') {\n buttonContent = html` <button\n @click=${this.togglePaywall}\n class=\"hidden md:block w-8 h-8 pl-4 ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'}\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'xmark', 24, 24))}\n </button>`\n } else {\n buttonContent = nothing\n }\n\n const headerClass = `text-base flex justify-center self-center md:block md:text-xl ${\n this.isDark ? 'text-white' : 'text-grey-600'\n } text-center font-lora font-bold tracking-wide md:tracking-normal max-w-xs sm:max-w-lg md:w-full md:max-w-full ${\n type === 'audio' && 'sm:px-16 md:px-20'\n }`\n\n return html`\n <div class=\"flex w-full items-start justify-center\">\n ${buttonContent}\n <h4 class=${headerClass}>${title}</h4>\n ${type === 'epaper' \|\| type === 'audio'\n ? html`<div class=\"w-10 hidden md:flex\"></div>`\n : nothing}\n </div>\n `\n }\n\n private descriptionSection(data: Array<string>) {\n return html`<div class=\" flex flex-col items-center\">\n <div class=\"flex flex-col space-y-2 mt-2.5 md:mt-3\">\n ${data.map(\n item =>\n html`\n <div class=\"flex items-center\">\n <div class=${this.isDark ? 'text-green-400' : 'text-green-500'}>\n ${unsafeSVG(getFontAwesomeIcon('fas', 'check', 12, 12))}\n </div>\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-white'\n : 'text-grey-600'} ml-0.5 md:ml-1\"\n >\n ${item}\n </h6>\n </div>\n `\n )}\n </div>\n </div>`\n }\n\n private informationPackages() {\n return html` <div class=\"mt-4 flex justify-center\">\n <button\n @click=${this.otherPackagesClicked}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Lihat Paket Lainnya\n </button>\n </div>`\n }\n\n private epaperRegistrationSection() {\n return html`\n <div>\n <button\n @click=${() =>\n redirectToLogin({\n loc: 'hard_paywall',\n next: this.epaperHost + window.location.pathname,\n })}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Masuk\n </button>\n <span class=${this.isDark ? 'text-white' : 'text-grey-600'}>\n jika sudah berlangganan.</span\n >\n </div>\n `\n }\n\n private regulerRegistrationSection() {\n return html`\n <div class=\"flex flex-col items-center justify-center\">\n <div>\n <button\n @click=${() => redirectToRegister('hard_paywall')}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Daftar\n </button>\n <span class=${this.isDark ? 'text-white' : 'text-grey-600'}>\n untuk kuota artikel gratis</span\n >\n </div>\n <div>\n <span class=${this.isDark ? 'text-white' : 'text-grey-600'}\n >atau\n </span>\n <button\n @click=${() => redirectToLogin({ loc: 'hard_paywall' })}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Masuk\n </button>\n <span class=${this.isDark ? 'text-white' : 'text-grey-600'}>\n jika sudah punya akun.</span\n >\n </div>\n </div>\n `\n }\n\n private registrationSection(type: PaywallType) {\n return type === 'epaper'\n ? this.epaperRegistrationSection()\n : this.regulerRegistrationSection()\n }\n\n private paymentMobileExtension(data: Array<PaymentImage>) {\n return html`\n <div\n class=\"w-full ${this.isDark\n ? '-bottom-6'\n : 'bottom-0'} max-w-xs mb-1 ml-8 md:hidden absolute px-4\"\n >\n <div\n class=\"w-full ${this.isDark\n ? 'bg-dark-6 border-dark-6'\n : 'bg-white border-white'} rounded p-3 max-w-xs\"\n >\n <svg\n class=\"right-0 ${this.isDark\n ? 'text-dark-6 border-dark-6'\n : 'text-white border-white '} h-4 mr-10 -mt-7 z-0 transform rotate-180 absolute\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 255 255\"\n >\n <polygon class=\"fill-current\" points=\"0,0 127.5,127.5 255,0\" />\n </svg>\n <div\n class=\"grid place-items-center items-center grid-flow-row grid-cols-5 grid-rows-2 gap-y-4\"\n >\n ${data.map(\n item =>\n html`<img\n class=\"object-cover\"\n src=${item.link}\n alt=\"${item.name}-logo-payment\"\n />`\n )}\n </div>\n </div>\n </div>\n `\n }\n\n private primaryPackages(product: Product) {\n return html`\n <div\n class=\"flex flex-wrap justify-between h-[68px] items-center ${this\n .isDark\n ? 'bg-grey-600'\n : 'bg-white'} rounded-lg md:mx-0 w-full max-w-xs md:max-w-sm md:w-3/5 mt-2.5 md:mt-4 border border-yellow-400 relative\"\n >\n <div class=\"flex flex-col py-3 px-4\">\n <div class=\"flex flex-none items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${formatRupiah(product.price)}\n </h5>\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'} font-bold pl-1\"\n >\n / ${product.periode}\n </h6>\n </div>\n ${product.savingPrice\n ? html`\n <div class=\"flex items-center\">\n <p\n class=\"text-xs ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'}\"\n >\n hanya\n <span class=\"text-orange-400\"\n >${formatRupiah(product.savingPrice)}</span\n >\n / bulan\n </p>\n </div>\n `\n : nothing}\n </div>\n <button\n class=\"h-8 ${this.isDark\n ? 'bg-green-300 border border-green-400'\n : 'bg-green-500'} rounded mr-4 flex items-center\"\n @click=${() =>\n this.redirectToCheckout(\n product.url,\n product.package,\n product.subscriptionId,\n product.price,\n product.position\n )}\n >\n <h6\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-black'\n : 'text-white'} font-bold py-2 px-4\"\n >\n Langganan\n </h6>\n </button>\n <div class=\"absolute -top-2 left-4\">\n <div class=\"rounded bg-yellow-300 px-2 py-0.5 text-xs\">\n <b class=\"text-grey-600\">Harga Terbaik</b>\n </div>\n </div>\n </div>\n `\n }\n\n private secondaryPackages(product: Product) {\n return html`\n <div\n class=\"flex flex-wrap items-center justify-between ${this.isDark\n ? 'bg-grey-600'\n : 'bg-white'} py-3 px-4 rounded-lg md:mx-0 w-full h-[68px] max-w-xs md:max-w-sm md:w-3/5 mt-3 md:mt-4\"\n >\n <div class=\"flex flex-col\">\n <div class=\"flex items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${formatRupiah(product.price)}\n </h5>\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'} font-bold pl-1\"\n >\n / ${product.periode}\n </h6>\n </div>\n ${product.savingPrice\n ? html`\n <div class=\"flex items-center\">\n <p\n class=\"text-xs ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'}\"\n >\n hanya\n <span class=\"text-orange-400\"\n >${formatRupiah(product.savingPrice)}</span\n >\n / bulan\n </p>\n </div>\n `\n : nothing}\n </div>\n <button\n @click=${() =>\n this.redirectToCheckout(\n product.url,\n product.package,\n product.subscriptionId,\n product.price,\n product.position\n )}\n class=\"h-8 ${!this.isDark &&\n 'bg-white'} border border-green-500 rounded\"\n >\n <h6\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-green-300'\n : 'text-green-500'} font-bold px-4\"\n >\n Langganan\n </h6>\n </button>\n </div>\n `\n }\n\n private packagesSection(data: Packages) {\n return html`\n <div class=\"flex flex-col w-full items-center mt-8 lg:mt-2 px-4\">\n ${data.memberships.map(item =>\n item.isHighlight\n ? this.primaryPackages(item)\n : this.secondaryPackages(item)\n )}\n ${this.swgEnable ? this.swgPackageSection() : nothing}\n ${this.freeTrialPackageSection()} ${this.freeTrialPopUp()}\n </div>\n `\n }\n\n private topNavigator(type: PaywallType) {\n let icon: string\n let buttonText: string\n let clickAction: Function\n\n if (type === 'audio') {\n icon = getFontAwesomeIcon('fas', 'xmark')\n buttonText = 'Tutup'\n clickAction = this.togglePaywall.bind(this)\n } else {\n icon = getFontAwesomeIcon('fas', 'arrow-left')\n buttonText = 'Kembali'\n clickAction = this.redirectToPrevUrl.bind(this)\n }\n\n return html`\n <div class=\"flex md:hidden w-full pb-4\">\n <button\n @click=${clickAction}\n class=\"text-xs md:text-lg text-white flex flex-row\"\n >\n <div class=\"icon-lg icon-white w-4 h-4 mr-3.5 md:mr-5 pt-0.5\">\n ${unsafeSVG(icon)}\n </div>\n ${buttonText}\n </button>\n </div>\n `\n }\n\n private helpDesk() {\n return html`\n <div\n class=\"${this.isDark\n ? 'text-dark-7'\n : 'text-white'} self-center text-xs md:text-sm\"\n >\n Butuh bantuan? Hubungi\n <button\n @click=${this.customerServiceClicked}\n class=\"font-bold underline\"\n >\n Layanan Pelanggan.\n </button>\n </div>\n `\n }\n\n private userAction() {\n return html`\n <div\n class=\"flex py-5 px-8 md:py-6 ${this.isDark\n ? 'bg-dark-4'\n : 'bg-blue-600'} w-full justify-evenly rounded-b-xl mt-6 md:mt-8 relative\"\n >\n ${this.helpDesk()}\n </div>\n `\n }\n\n private introductoryPrice() {\n return html` <div\n class=\"flex space-x-1 h-5 md:h-max overflow-hidden md:flex-col md:space-x-0 items-center md:items-start md:justify-center\"\n >\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">Rp 10.000</h5>\n <p class=\"text-xs ${this.isDark ? 'text-dark-7' : 'text-grey-600'}\">\n untuk 1 bulan pertama\n </p>\n </div>`\n }\n\n private swgRegonText() {\n return html`<p\n class=\"text-xs leading-4 md:max-w-[137px] ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'}\"\n >\n Berlangganan lebih mudah dengan Google\n </p>`\n }\n\n private swgPackageSection() {\n return html`\n <div\n class=\"flex flex-col space-y-2 md:space-x-2 md:space-y-0 md:flex-row justify-between items-center ${this\n .isDark\n ? 'bg-grey-600'\n : 'bg-white'} py-3 px-4 rounded-lg md:mx-0 w-full h-[76px] md:h-[68px] max-w-xs md:max-w-sm md:w-3/5 mt-3 md:mt-4\"\n >\n ${this.isEntitledForIntroductoryPrice\n ? this.introductoryPrice()\n : this.swgRegonText()}\n <div>\n <button\n class=\"${this.isDark\n ? 'bg-grey-600'\n : 'bg-grey-100 border-grey-100'} border space-x-2 justify-center border-grey-400 rounded-md px-[22px] md:px-6 shadow-sm flex h-max flex-row flex-nowrap py-[5.6px] md:py-1.5 items-center\"\n id=\"subscribe-with-google\"\n >\n <p\n class=\"${this.isDark\n ? 'text-dark-7'\n : 'text-grey-500'} text-[11px] md:text-xs whitespace-nowrap w-full\"\n >\n Subscribe with\n </p>\n <img\n class=\"object-scale-down h-[17px] md:h-5\"\n src=${this.isDark\n ? 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/paywall-asset/google-white.png'\n : 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/paywall-asset/google.png'}\n alt=\"subscribe with google\"\n />\n </button>\n </div>\n </div>\n `\n }\n\n private openFreeTrialPopup() {\n const popup = this.shadowRoot?.getElementById('freeTrialPopup')\n popup?.classList.remove('hidden')\n }\n\n private closeFreeTrialPopup() {\n const popup = this.shadowRoot?.getElementById('freeTrialPopup')\n popup?.classList.add('hidden')\n }\n\n private freeTrialPopUp() {\n return html`\n <div\n id=\"freeTrialPopup\"\n class=\"fixed w-full h-full inset-0 flex justify-center items-center z-50 bg-black bg-opacity-75 hidden\"\n >\n <div\n class=\"bg-white rounded w-11/12 sm:w-3/4 md:w-1/2 lg:w-1/3 2xl:w-1/4 p-6 text-center\"\n >\n <div class=\"w-full flex justify-end px-2\">\n <button\n @click=${this.closeFreeTrialPopup}\n class=\"w-8 h-8 pl-4 text-grey-400\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'xmark', 24, 24))}\n </button>\n </div>\n <div class=\"w-full flex justify-center\">\n <div class=\"w-3/4 lg:w-1/2\">\n <img\n src=\"https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/kompas-free-trial.png\"\n alt=\"Free Trial\"\n />\n </div>\n </div>\n <p class=\"font-bold text-lg text-grey-600 mt-4\">\n Coba Gratis Kompas.id di Aplikasi\n </p>\n <div\n class=\"hidden lg:block lg:flex flex border border-grey-300 rounded mt-4 px-8 py-4 items-center\"\n >\n <div class=\"w-1/3 flex mr-6\">\n <img\n src=\"https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/free-trial-qr-code.png\"\n alt=\"QR Code Deep Link\"\n />\n </div>\n <div class=\"w-2/3 text-base text-grey-600 text-left\">\n Coba gratis 3 hari Kompas.id melalui aplikasi. Pindai kode QR\n dengan ponsel atau tablet untuk mengunduh aplikasi.\n </div>\n </div>\n <div\n class=\"text-base text-grey-600 text-center lg:hidden px-2 md:px-8\"\n >\n Dapatkan akses gratis selama 3 hari ke konten dan fitur premium\n Kompas.id di aplikasi.\n </div>\n <div class=\"lg:flex flex justify-center mt-4 hidden lg:block gap-4\">\n <a\n href=\"https://play.google.com/store/apps/details?id=id.kompas.app\"\n target=\"_blank\"\n ><img\n src=\"https://cdn-www.kompas.id/halaman-unduh/image/google-play-badge.png\"\n alt=\"Google Play Badge\"\n /></a>\n <a\n href=\"https://apps.apple.com/id/app/kompas-id/id1242195037?l=id\"\n target=\"_blank\"\n ><img\n src=\"https://cdn-www.kompas.id/halaman-unduh/image/ios-badge.png\"\n alt=\"iOS App Store Badge\"\n /></a>\n </div>\n <button\n onclick=\"window.open('https://app.komp.as/langganan', '_blank')\"\n class=\"h-12 bg-green-500 rounded-md mt-4 flex w-full items-center justify-center lg:hidden\"\n >\n <h6 class=\"text-white font-bold p-4\">Unduh Sekarang</h6>\n </button>\n </div>\n </div>\n `\n }\n\n private freeTrialPackageSection() {\n const packages = this.paywallData?.packages ?? ({} as Packages)\n\n if (packages.freeTrial) {\n return html`\n <div\n class=\"flex flex-wrap items-center justify-between ${this.isDark\n ? 'bg-grey-600'\n : 'bg-white'} py-3 px-4 rounded-lg md:mx-0 w-full h-[68px] max-w-xs md:max-w-sm md:w-3/5 mt-3 md:mt-4\"\n >\n <div class=\"flex flex-col\">\n <div class=\"flex items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${formatRupiah(0)}\n </h5>\n </div>\n <div class=\"flex items-center\">\n <p\n class=\"text-xs ${this.isDark ? 'text-dark-7' : 'text-grey-600'}\"\n >\n ${packages.freeTrial}\n </p>\n </div>\n </div>\n <button\n @click=${this.openFreeTrialPopup}\n class=\"h-8 ${!this.isDark &&\n 'bg-white'} border border-green-500 rounded\"\n >\n <h6\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-green-300'\n : 'text-green-500'} font-bold px-4\"\n >\n Coba Gratis\n </h6>\n </button>\n </div>\n `\n }\n return nothing\n }\n\n /\n Render Statement\n */\n\n render() {\n return html`\n <div\n class=\"${this.type === 'epaper'\n ? 'bg-transparent wrapper-body mx-2'\n : 'wrapper-body'}\n ${this.type === 'audio'\n ? `fixed w-full h-full inset-0 flex justify-center items-center z-50 bg-black bg-opacity-75`\n : 'wrapper-body'}\"\n >\n <div\n class=\"flex flex-col justify-center items-center w-full max-w-screen-sm my-5 px-2 relative\"\n >\n ${this.type === 'epaper' \|\| this.type === 'audio'\n ? this.topNavigator(this.type)\n : nothing}\n <div\n class=\"flex w-full flex-col items-center justify-center ${this\n .isDark\n ? 'bg-dark-3'\n : 'bg-blue-100'} rounded-xl pt-6 md:pt-8 relative\"\n >\n ${this.headerSection(\n this.type,\n this.paywallData?.informations?.title ?? ''\n )}\n ${this.descriptionSection(\n this.paywallData?.informations?.description ?? []\n )}\n ${this.packagesSection(\n this.paywallData?.packages ?? ({} as Packages)\n )}\n ${this.informationPackages()}\n ${!this.isLogin\n ? html`\n <div\n class=\"border-b ${this.isDark\n ? 'border-dark-8'\n : 'border-blue-200'} w-1/5 my-4 flex justify-center\"\n ></div>\n ${this.registrationSection(this.type)}\n `\n : nothing}\n ${this.userAction()} ${this.sendDataLayeronPaywallBody()}\n </div>\n ${this.isExtensionsOpened\n ? this.paymentMobileExtension(\n this.paywallData?.payment?.ekstension ?? []\n )\n : nothing}\n </div>\n </div>\n `\n }\n}\n"]}
1	+ {"version":3,"file":"KompasPaywallBody.js","sourceRoot":"","sources":["../../../../src/components/kompasid-paywall-body/KompasPaywallBody.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-return-assign /\n\nimport { html, css, LitElement, nothing } from 'lit'\nimport { property, state, customElement } from 'lit/decorators.js'\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport {\n PaywallProduct,\n Product,\n Packages,\n PaymentImage,\n PaywallType,\n} from '../kompasid-paywall/types.js'\nimport { getFontAwesomeIcon } from '../../utils/fontawesome-setup.js'\nimport { deviceType } from '../../utils/deviceType.js'\nimport { formatRupiah } from '../../utils/formatRupiah.js'\nimport { addGoogleFonts } from '../../utils/googleFont.js'\nimport { redirectToRegister, redirectToLogin } from '../../utils/cta.js'\n\n@customElement('kompasid-paywall-body')\nexport class KompasIdPaywallBody extends LitElement {\n static styles = [\n css`\n .wrapper-body {\n display: flex;\n flex-direction: column;\n justify-items: center;\n align-items: center;\n }\n\n .font-lora {\n font-family: 'Lora', 'Georgia', 'serif';\n }\n `,\n TWStyles,\n ]\n\n /\n Props\n /\n /\n prop slug untuk menghandle slug\n * prop isLogin untuk menghandle apakah user sudah login atau belum\n * prop type untuk menghandle tipe epaper\n * prop paywallData untuk menghandle data paywall\n * prop userGuid untuk menghandle user Guid\n * prop subscriptionStatus untuk menghandle status subscription user\n * prop countdownArticle untuk menghandle count artikel\n * prop swgEnable untuk menghandle swg apakah di aktifkan atau tidak\n * prop paywall_location = The location where user encounter the paywall\n * prop paywall_subscription_package = The name of the subscription package viewed by user\n * prop paywall_subscription_id = The ID of the subscription package viewed by user\n * prop paywall_subscription_price = The price of the subscriprtion package viewed by user\n * prop paywall_position = The position of the subscription package viewed by user\n * prop tracker_page_type = Type of the page\n * prop tracker_content_id = ID of article (slug)\n * prop tracker_content_type = Whether it's free article or paid article\n * prop tracker_content_title = The title of article\n * prop tracker_content_categories = The category of the content\n * prop tracker_user_type = Type of user based on their subscription\n * prop tracker_subscription_status = Status of their subscription\n * prop tracker_page_domain = Page Domain\n * prop tracker_metered_wall_type = The type of Metered Wall\n * prop tracker_metered_wall_balance = The balance of their metered wall\n * prop tracker_metered_wall_balance = The edition of epaper viewed by user\n * prop theme = The theme of the paywall component\n /\n\n @property({ type: String }) slug = ''\n @property({ type: Boolean }) isLogin = false\n @property({ type: String }) type: PaywallType = 'reguler'\n @property({ type: Object }) paywallData: PaywallProduct \| undefined =\n undefined\n @property({ type: String }) userGuid = ''\n @property({ type: String }) subscriptionStatus = ''\n @property({ type: Number }) countdownArticle = 0\n @property({ type: Boolean }) swgEnable = false\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: Number }) paywall_subscription_id = 0\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n @property({ type: String }) tracker_epaper_edition = ''\n @property({ type: String }) theme = ''\n @property() togglePaywall = () => {}\n\n /\n State\n /\n\n @state() private isExtensionsOpened = false\n @state() private kompasAkunHost = 'https://akun.kompas.id'\n @state() private kompasApigenHost = 'https://apigen.kompas.id'\n @state() private kompasApiWcmHost = 'https://apiwcm.kompas.id'\n @state() private kompasLoginHost = 'https://account.kompas.id/login'\n @state() private epaperHost = 'https://epaper.kompas.id'\n @state() private swgPublisherName = 'Harian Kompas'\n @state() private swgPublisherId = 'kompas.id'\n @state() private swgProductId = 'kompas.id:kompas_digital_premium'\n @state() private errorFlag = 0\n\n buttonElement!: HTMLButtonElement\n targetElement!: HTMLElement\n\n /\n Getter\n /\n\n get loginUrl() {\n return `${this.kompasLoginHost}?next=${encodeURIComponent(\n this.epaperHost + window.location.pathname\n )}&loc=hard_paywall`\n }\n\n get isDark() {\n return this.theme === 'dark'\n }\n\n get isEntitledForIntroductoryPrice(): boolean {\n return !this.isLogin \|\| this.tracker_subscription_status === 'IA'\n }\n\n /\n Logic Function\n /\n\n private redirectToCheckout(\n url: string,\n name: string,\n id: string,\n price: number,\n position: number\n ): void {\n this.sendDataLayeronButtonBuyPackage(name, id, price, position)\n const originHost: string = encodeURIComponent(window.location.href)\n let source: string\n\n switch (this.type) {\n case 'epaper':\n source = 'epaper'\n break\n case 'audio':\n source = 'news_audio'\n break\n default:\n source = 'article'\n }\n const directUrlCheckout: string = `${url}${originHost}&source=${source}`\n window.open(directUrlCheckout)\n }\n\n private redirectToPrevUrl(): void {\n window.history.back()\n }\n\n private redirectToSubscriber(): void {\n this.sendDataLayer()\n window.open('https://www.kompas.id/berlangganan')\n }\n\n private redirectToHelpdesk(): void {\n this.sendDataLayeronHelpDesk()\n window.open(\n 'https://api.whatsapp.com/send/?phone=6281290050800&text=Halo,%20saya%20perlu%20informasi%20mengenai%20kompas.id'\n )\n }\n\n private handleClickOutside() {\n if (this.targetElement.classList.contains('wrapper-body')) {\n this.togglePaywall()\n }\n\n if (this.targetElement.id === 'freeTrialPopup') {\n this.closeFreeTrialPopup()\n }\n }\n\n private parsePrice(price: string): number {\n const lowerCasePrice = price.toLowerCase()\n\n if (lowerCasePrice.startsWith('rp')) {\n return parseFloat(price.replace(/[^0-9,]/g, ''))\n }\n\n return parseFloat(price.replace(/[^0-9.]/g, ''))\n }\n\n private async getRegisterToken(path: string, payload: any): Promise<string> {\n return fetch(`${this.kompasApigenHost}/v1/user/register/token/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => data.result.token)\n .catch(error => {\n throw error\n })\n }\n\n private async getUserToken(path: string, payload: any): Promise<string> {\n return fetch(`${this.kompasApigenHost}/v1/user/token/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => data.result.token)\n .catch(error => {\n throw error\n })\n }\n\n private async getSubscriptionToken(\n path: string,\n payload: any\n ): Promise<string> {\n return fetch(`${this.kompasAkunHost}/api/subscription/login/${path}`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n },\n })\n .then(response => response.json())\n .then((data: any) => {\n this.errorFlag = 0\n return data.access_token\n })\n .catch(async error => {\n const errorCode = error.response.status\n if (errorCode === 500 && this.errorFlag < 5) {\n // eslint-disable-next-line no-plusplus\n this.errorFlag++\n setTimeout(async () => {\n await this.getSubscriptionToken(path, payload)\n }, 2000)\n } else {\n this.errorFlag = 0\n throw error\n }\n })\n }\n\n private async createSwG(payload: any, token: string) {\n await fetch(`${this.kompasApiWcmHost}/v2/membership/swg/create`, {\n method: 'POST',\n body: JSON.stringify(payload),\n headers: {\n 'content-type': 'application/json',\n Authorization: `Bearer ${token}`,\n },\n })\n .then(response => response.json())\n .catch(error => {\n throw error\n })\n }\n\n private subscribeWithGoogleButton(): any {\n // @ts-ignore\n // eslint-disable-next-line no-restricted-globals\n ;(self.SWG = self.SWG \|\| []).push((subscriptions: any) => {\n // set entitlement\n subscriptions.setOnEntitlementsResponse(() => {\n // subscriptions attach button\n subscriptions.attachButton(\n this.buttonElement,\n { theme: 'light', lang: 'en' },\n async () => {\n subscriptions.showOffers({ isClosable: true })\n subscriptions.setOnLoginRequest(() => {\n window.location.href = this.loginUrl\n })\n const offers = await subscriptions.getOffers()\n subscriptions.setOnFlowStarted((callback: any) => {\n if (callback.flow === 'showOffers') {\n window.dataLayer.push(this.swgPackageViewedDataLayer(offers))\n } else if (callback.flow === 'subscribe') {\n const selectedOfferSkuId = callback.data.skuId\n const selectedOffer = offers.find(\n (offer: any) => offer.skuId === selectedOfferSkuId\n )\n window.dataLayer.push(\n this.swgSubscribeButtonClicked(\n selectedOffer,\n offers.indexOf(selectedOffer)\n )\n )\n }\n })\n subscriptions.setOnPaymentResponse(async (paymentResponse: any) => {\n const response = await paymentResponse\n const raw = JSON.parse(response.purchaseData.raw)\n const { productId, purchaseToken, packageName } = raw\n const { email } = response.userData.data\n\n const payload = {\n subscription_token: purchaseToken,\n products: productId,\n detail: 'test',\n }\n const userToken = await this.getUserToken('google', payload)\n if (userToken) {\n // login and update membership\n const accessToken = await this.getSubscriptionToken('google', {\n token: userToken,\n })\n if (accessToken) {\n const payloadSWG = {\n email,\n package_name: packageName,\n product_id: productId,\n purchase_token: purchaseToken,\n }\n await this.createSwG(payloadSWG, accessToken)\n }\n } else {\n // register and login the unknown user\n const payloadRegisterToken = {\n subscription_token: purchaseToken,\n products: productId,\n detail: 'test',\n }\n const token = await this.getRegisterToken(\n 'google',\n payloadRegisterToken\n )\n if (token) {\n const accessToken = await this.getSubscriptionToken(\n 'google',\n { token }\n )\n const payloadSWRUknown = {\n email,\n package_name: packageName,\n product_id: productId,\n purchase_token: purchaseToken,\n }\n await this.createSwG(payloadSWRUknown, accessToken)\n }\n }\n response.complete().then(() => {\n window.location.href = this.loginUrl\n })\n })\n }\n )\n })\n })\n }\n\n private jsonScript() {\n const jsonData = {\n '@context': 'https://schema.org',\n '@type': ['WebSite', 'WebPage'],\n isAccessibleForFree: false,\n url: this.epaperHost + window.location.pathname,\n name: this.swgPublisherName,\n hasPart: {\n '@type': 'WebPageElement',\n },\n isPartOf: {\n '@type': ['CreativeWork', 'Product'],\n name: this.swgPublisherId,\n productID: this.swgProductId,\n },\n }\n const str = JSON.stringify(jsonData)\n const jsonScript = document.createElement('script')\n jsonScript.type = 'application/ld+json'\n jsonScript.text = str\n jsonScript.defer = true\n const jsonHead = document.querySelector('head')\n if (jsonHead) {\n jsonHead.appendChild(jsonScript)\n }\n }\n\n constructor() {\n super()\n this.handleClickOutside = this.handleClickOutside.bind(this)\n }\n\n protected createRenderRoot() {\n const root = super.createRenderRoot()\n root.addEventListener(\n 'click',\n (e: Event) => (this.targetElement = e.target as HTMLElement)\n )\n return root\n }\n\n override async connectedCallback() {\n super.connectedCallback()\n await this.updateComplete\n if (this.swgEnable) {\n this.jsonScript()\n const appendSWGButton = () => {\n this.buttonElement = this.shadowRoot?.getElementById(\n 'subscribe-with-google'\n ) as HTMLButtonElement\n if (this.buttonElement) {\n const head = document.querySelector('head')\n const script = document.createElement('script')\n script.src = 'https://news.google.com/swg/js/v1/swg.js'\n script.defer = true\n script.onload = this.subscribeWithGoogleButton()\n if (head) {\n head.appendChild(script)\n }\n }\n }\n setTimeout(appendSWGButton, 500)\n }\n addGoogleFonts(['pt-sans', 'lora'])\n document.addEventListener('click', this.handleClickOutside)\n }\n\n override async disconnectedCallback() {\n super.disconnectedCallback()\n document.removeEventListener('click', this.handleClickOutside)\n }\n\n private otherPackagesClicked() {\n this.sendDataLayerOtherPackagesClicked()\n this.redirectToSubscriber()\n }\n\n private customerServiceClicked() {\n this.sendDataLayerCustomerServiceClicked()\n this.redirectToHelpdesk()\n }\n\n /\n Data Layer\n /\n\n private buildGtmParams(\n event: string,\n impressions: Record<string, any>[],\n index: number = 0\n ) {\n const gtmParams: Record<string, any> = {\n event,\n impressions: impressions.map((impression, i) => ({\n paywall_location: this.paywall_location \|\| '',\n paywall_subscription_package: impression.package,\n paywall_subscription_id: impression.subscription_id,\n paywall_subscription_price: this.parsePrice(impression.price),\n paywall_position: index + i + 1,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain \|\| 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type \|\| 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n ...(this.type === 'epaper'\n ? { epaper_edition: this.tracker_epaper_edition }\n : {\n page_type: this.tracker_page_type,\n content_id: this.tracker_content_id,\n content_title: this.tracker_content_title,\n content_categories: this.tracker_content_categories,\n content_type: this.tracker_content_type,\n }),\n })),\n }\n\n return gtmParams\n }\n\n private generalPaywallDataLayer(event: string): Record<string, any> {\n const packages = this.paywallData?.packages ?? ({} as Packages)\n\n const impressions = packages.memberships.map(membership => ({\n package: membership.package,\n subscription_id: membership.subscriptionId,\n price: membership.price.toString(),\n }))\n\n return this.buildGtmParams(event, impressions)\n }\n\n private sendDataLayer(): void {\n window.dataLayer.push({\n event: 'halamanBerlanggananClick',\n subscriptionStatus: '',\n GUID: '',\n interface: deviceType(),\n })\n }\n\n private sendDataLayeronHelpDesk(): void {\n window.dataLayer.push({\n event: 'helpOfferClick',\n userType: this.subscriptionStatus,\n GUID: this.userGuid,\n interface: deviceType(),\n })\n }\n\n private sendDataLayeronButtonBuyPackage(\n name: string,\n id: string,\n price: number,\n position: number\n ): void {\n const gtmParams: Record<string, any> = {\n event: 'subscribe_button_clicked',\n paywall_location: this.paywall_location,\n paywall_subscription_package: name,\n paywall_subscription_id: id,\n paywall_subscription_price: price,\n paywall_position: position,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain \|\| 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type \|\| 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n }\n\n if (this.type !== 'epaper') {\n gtmParams.content_title = this.tracker_content_title\n gtmParams.content_id = this.tracker_content_id\n gtmParams.content_categories = this.tracker_content_categories\n gtmParams.content_type = this.tracker_content_type\n gtmParams.page_type = this.tracker_page_type\n } else {\n gtmParams.epaper_edition = this.tracker_epaper_edition\n }\n\n window.dataLayer.push(gtmParams)\n }\n\n private sendDataLayeronPaywallBody(): void {\n const gtmParams = this.generalPaywallDataLayer('paywall_viewed')\n window.dataLayer.push(gtmParams)\n }\n\n private sendDataLayerOtherPackagesClicked(): void {\n const gtmParams = this.generalPaywallDataLayer('other_packages_clicked')\n window.dataLayer.push(gtmParams)\n }\n\n private sendDataLayerCustomerServiceClicked(): void {\n const gtmParams = this.generalPaywallDataLayer('customer_service_clicked')\n window.dataLayer.push(gtmParams)\n }\n\n private swgPackageViewedDataLayer(data: any): Record<string, any> {\n const impressions = data.map(\n (item: {\n title: string\n skuId: string\n price: string\n introductoryPrice: string\n }) => ({\n package: item.title,\n subscription_id: item.skuId,\n price: item.introductoryPrice \|\| item.price,\n })\n )\n\n return this.buildGtmParams('subscription_package_viewed', impressions)\n }\n\n private swgSubscribeButtonClicked(item: any, index: number) {\n const gtmParams: any = {\n event: 'subscribe_button_clicked',\n paywall_location: this.paywall_location \|\| '',\n paywall_subscription_package: item.title,\n paywall_subscription_id: item.skuId,\n paywall_subscription_price: this.parsePrice(\n item.introductoryPrice \|\| item.price\n ),\n paywall_position: index + 1,\n user_type: this.tracker_user_type,\n subscription_status: this.tracker_subscription_status,\n page_domain: this.tracker_page_domain \|\| 'Kompas.id',\n metered_wall_type: this.tracker_metered_wall_type \|\| 'HP',\n metered_wall_balance: this.tracker_metered_wall_balance,\n }\n\n if (this.type === 'epaper') {\n gtmParams.epaper_edition = this.tracker_epaper_edition\n } else {\n gtmParams.page_type = this.tracker_page_type\n gtmParams.content_id = this.tracker_content_id\n gtmParams.content_title = this.tracker_content_title\n gtmParams.content_categories = this.tracker_content_categories\n gtmParams.content_type = this.tracker_content_type\n }\n\n return gtmParams\n }\n\n /\n Component\n /\n\n private headerSection(type: PaywallType, title: string) {\n let buttonContent\n\n if (type === 'epaper') {\n buttonContent = html` <button\n @click=${this.redirectToPrevUrl}\n class=\"hidden md:block w-8 h-8 pl-4 ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'}\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'arrow-left'))}\n </button>`\n } else if (type === 'audio') {\n buttonContent = html` <button\n @click=${this.togglePaywall}\n class=\"hidden md:block w-8 h-8 pl-4 ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'}\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'xmark', 24, 24))}\n </button>`\n } else {\n buttonContent = nothing\n }\n\n const headerClass = `text-base flex justify-center self-center md:block md:text-xl ${\n this.isDark ? 'text-white' : 'text-grey-600'\n } text-center font-lora font-bold tracking-wide md:tracking-normal max-w-xs sm:max-w-lg md:w-full md:max-w-full ${\n type === 'audio' && 'sm:px-16 md:px-20'\n }`\n\n return html`\n <div class=\"flex w-full items-start justify-center\">\n ${buttonContent}\n <h4 class=${headerClass}>${title}</h4>\n ${type === 'epaper' \|\| type === 'audio'\n ? html`<div class=\"w-10 hidden md:flex\"></div>`\n : nothing}\n </div>\n `\n }\n\n private descriptionSection(data: Array<string>) {\n return html`<div class=\" flex flex-col items-center\">\n <div class=\"flex flex-col space-y-2 mt-2.5 md:mt-3\">\n ${data.map(\n item =>\n html`\n <div class=\"flex items-center\">\n <div class=${this.isDark ? 'text-green-400' : 'text-green-500'}>\n ${unsafeSVG(getFontAwesomeIcon('fas', 'check', 12, 12))}\n </div>\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-white'\n : 'text-grey-600'} ml-0.5 md:ml-1\"\n >\n ${item}\n </h6>\n </div>\n `\n )}\n </div>\n </div>`\n }\n\n private informationPackages() {\n return html` <div class=\"mt-4 flex justify-center\">\n <button\n @click=${this.otherPackagesClicked}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Lihat Paket Lainnya\n </button>\n </div>`\n }\n\n private epaperRegistrationSection() {\n return html`\n <div>\n <button\n @click=${() =>\n redirectToLogin({\n loc: 'hard_paywall',\n next: this.epaperHost + window.location.pathname,\n })}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Masuk\n </button>\n <span class=${this.isDark ? 'text-white' : 'text-grey-600'}>\n jika sudah berlangganan.</span\n >\n </div>\n `\n }\n\n private regulerRegistrationSection() {\n return html`\n <div class=\"flex flex-col items-center justify-center\">\n <div>\n <button\n @click=${() => redirectToRegister('hard_paywall')}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Daftar\n </button>\n <span class=${this.isDark ? 'text-white' : 'text-grey-600'}>\n untuk kuota artikel gratis</span\n >\n </div>\n <div>\n <span class=${this.isDark ? 'text-white' : 'text-grey-600'}\n >atau\n </span>\n <button\n @click=${() => redirectToLogin({ loc: 'hard_paywall' })}\n class=\"text-sm md:text-base font-bold ${this.isDark\n ? 'text-blue-300'\n : 'text-blue-600'} underline\"\n >\n Masuk\n </button>\n <span class=${this.isDark ? 'text-white' : 'text-grey-600'}>\n jika sudah punya akun.</span\n >\n </div>\n </div>\n `\n }\n\n private registrationSection(type: PaywallType) {\n return type === 'epaper'\n ? this.epaperRegistrationSection()\n : this.regulerRegistrationSection()\n }\n\n private paymentMobileExtension(data: Array<PaymentImage>) {\n return html`\n <div\n class=\"w-full ${this.isDark\n ? '-bottom-6'\n : 'bottom-0'} max-w-xs mb-1 ml-8 md:hidden absolute px-4\"\n >\n <div\n class=\"w-full ${this.isDark\n ? 'bg-dark-6 border-dark-6'\n : 'bg-white border-white'} rounded p-3 max-w-xs\"\n >\n <svg\n class=\"right-0 ${this.isDark\n ? 'text-dark-6 border-dark-6'\n : 'text-white border-white '} h-4 mr-10 -mt-7 z-0 transform rotate-180 absolute\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 255 255\"\n >\n <polygon class=\"fill-current\" points=\"0,0 127.5,127.5 255,0\" />\n </svg>\n <div\n class=\"grid place-items-center items-center grid-flow-row grid-cols-5 grid-rows-2 gap-y-4\"\n >\n ${data.map(\n item =>\n html`<img\n class=\"object-cover\"\n src=${item.link}\n alt=\"${item.name}-logo-payment\"\n />`\n )}\n </div>\n </div>\n </div>\n `\n }\n\n private primaryPackages(product: Product) {\n return html`\n <div\n class=\"flex flex-wrap justify-between h-[68px] items-center ${this\n .isDark\n ? 'bg-grey-600'\n : 'bg-white'} rounded-lg md:mx-0 w-full max-w-xs md:max-w-sm md:w-3/5 mt-2.5 md:mt-4 border border-yellow-400 relative\"\n >\n <div class=\"flex flex-col py-3 px-4\">\n <div class=\"flex flex-none items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${formatRupiah(product.price)}\n </h5>\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'} font-bold pl-1\"\n >\n / ${product.periode}\n </h6>\n </div>\n ${product.savingPrice\n ? html`\n <div class=\"flex items-center\">\n <p\n class=\"text-xs ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'}\"\n >\n hanya\n <span class=\"text-orange-400\"\n >${formatRupiah(product.savingPrice)}</span\n >\n / bulan\n </p>\n </div>\n `\n : nothing}\n </div>\n <button\n class=\"h-8 ${this.isDark\n ? 'bg-green-300 border border-green-400'\n : 'bg-green-500'} rounded mr-4 flex items-center\"\n @click=${() =>\n this.redirectToCheckout(\n product.url,\n product.package,\n product.subscriptionId,\n product.price,\n product.position\n )}\n >\n <h6\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-black'\n : 'text-white'} font-bold py-2 px-4\"\n >\n Langganan\n </h6>\n </button>\n <div class=\"absolute -top-2 left-4\">\n <div class=\"rounded bg-yellow-300 px-2 py-0.5 text-xs\">\n <b class=\"text-grey-600\">Harga Terbaik</b>\n </div>\n </div>\n </div>\n `\n }\n\n private secondaryPackages(product: Product) {\n return html`\n <div\n class=\"flex flex-wrap items-center justify-between ${this.isDark\n ? 'bg-grey-600'\n : 'bg-white'} py-3 px-4 rounded-lg md:mx-0 w-full h-[68px] max-w-xs md:max-w-sm md:w-3/5 mt-3 md:mt-4\"\n >\n <div class=\"flex flex-col\">\n <div class=\"flex items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${formatRupiah(product.price)}\n </h5>\n <h6\n class=\"text-xs md:text-base ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'} font-bold pl-1\"\n >\n / ${product.periode}\n </h6>\n </div>\n ${product.savingPrice\n ? html`\n <div class=\"flex items-center\">\n <p\n class=\"text-xs ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'}\"\n >\n hanya\n <span class=\"text-orange-400\"\n >${formatRupiah(product.savingPrice)}</span\n >\n / bulan\n </p>\n </div>\n `\n : nothing}\n </div>\n <button\n @click=${() =>\n this.redirectToCheckout(\n product.url,\n product.package,\n product.subscriptionId,\n product.price,\n product.position\n )}\n class=\"h-8 ${!this.isDark &&\n 'bg-white'} border border-green-500 rounded\"\n >\n <h6\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-green-300'\n : 'text-green-500'} font-bold px-4\"\n >\n Langganan\n </h6>\n </button>\n </div>\n `\n }\n\n private packagesSection(data: Packages) {\n return html`\n <div class=\"flex flex-col w-full items-center mt-8 lg:mt-2 px-4\">\n ${data.memberships.map(item =>\n item.isHighlight\n ? this.primaryPackages(item)\n : this.secondaryPackages(item)\n )}\n ${this.freeTrialPackageSection()} ${this.freeTrialPopUp()}\n ${this.swgEnable ? this.swgPackageSection() : nothing}\n </div>\n `\n }\n\n private topNavigator(type: PaywallType) {\n let icon: string\n let buttonText: string\n let clickAction: Function\n\n if (type === 'audio') {\n icon = getFontAwesomeIcon('fas', 'xmark')\n buttonText = 'Tutup'\n clickAction = this.togglePaywall.bind(this)\n } else {\n icon = getFontAwesomeIcon('fas', 'arrow-left')\n buttonText = 'Kembali'\n clickAction = this.redirectToPrevUrl.bind(this)\n }\n\n return html`\n <div class=\"flex md:hidden w-full pb-4\">\n <button\n @click=${clickAction}\n class=\"text-xs md:text-lg text-white flex flex-row\"\n >\n <div class=\"icon-lg icon-white w-4 h-4 mr-3.5 md:mr-5 pt-0.5\">\n ${unsafeSVG(icon)}\n </div>\n ${buttonText}\n </button>\n </div>\n `\n }\n\n private helpDesk() {\n return html`\n <div\n class=\"${this.isDark\n ? 'text-dark-7'\n : 'text-white'} self-center text-xs md:text-sm\"\n >\n Butuh bantuan? Hubungi\n <button\n @click=${this.customerServiceClicked}\n class=\"font-bold underline\"\n >\n Layanan Pelanggan.\n </button>\n </div>\n `\n }\n\n private userAction() {\n return html`\n <div\n class=\"flex py-5 px-8 md:py-6 ${this.isDark\n ? 'bg-dark-4'\n : 'bg-blue-600'} w-full justify-evenly rounded-b-xl mt-6 md:mt-8 relative\"\n >\n ${this.helpDesk()}\n </div>\n `\n }\n\n private introductoryPrice() {\n return html` <div\n class=\"flex space-x-1 h-5 md:h-max overflow-hidden md:flex-col md:space-x-0 items-center md:items-start md:justify-center\"\n >\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">Rp 10.000</h5>\n <p class=\"text-xs ${this.isDark ? 'text-dark-7' : 'text-grey-600'}\">\n untuk 1 bulan pertama\n </p>\n </div>`\n }\n\n private swgRegonText() {\n return html`<p\n class=\"text-xs leading-4 md:max-w-[137px] ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'}\"\n >\n Berlangganan lebih mudah dengan Google\n </p>`\n }\n\n private swgPackageSection() {\n return html`\n <div\n class=\"flex flex-col space-y-2 md:space-x-2 md:space-y-0 md:flex-row justify-between items-center ${this\n .isDark\n ? 'bg-grey-600'\n : 'bg-white'} py-3 px-4 rounded-lg md:mx-0 w-full h-[76px] md:h-[68px] max-w-xs md:max-w-sm md:w-3/5 mt-3 md:mt-4\"\n >\n ${this.isEntitledForIntroductoryPrice\n ? this.introductoryPrice()\n : this.swgRegonText()}\n <div>\n <button\n class=\"${this.isDark\n ? 'bg-grey-600'\n : 'bg-grey-100 border-grey-100'} border space-x-2 justify-center border-grey-400 rounded-md px-[22px] md:px-6 shadow-sm flex h-max flex-row flex-nowrap py-[5.6px] md:py-1.5 items-center\"\n id=\"subscribe-with-google\"\n >\n <p\n class=\"${this.isDark\n ? 'text-dark-7'\n : 'text-grey-500'} text-[11px] md:text-xs whitespace-nowrap w-full\"\n >\n Subscribe with\n </p>\n <img\n class=\"object-scale-down h-[17px] md:h-5\"\n src=${this.isDark\n ? 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/paywall-asset/google-white.png'\n : 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/paywall-asset/google.png'}\n alt=\"subscribe with google\"\n />\n </button>\n </div>\n </div>\n `\n }\n\n private openFreeTrialPopup() {\n const popup = this.shadowRoot?.getElementById('freeTrialPopup')\n popup?.classList.remove('hidden')\n }\n\n private closeFreeTrialPopup() {\n const popup = this.shadowRoot?.getElementById('freeTrialPopup')\n popup?.classList.add('hidden')\n }\n\n private freeTrialPopUp() {\n return html`\n <div\n id=\"freeTrialPopup\"\n class=\"fixed w-full h-full inset-0 flex justify-center items-center z-50 bg-black bg-opacity-75 hidden\"\n >\n <div\n class=\"${this.isDark\n ? 'bg-dark-4'\n : 'bg-white'} rounded w-11/12 sm:w-3/4 md:w-1/2 lg:w-1/3 2xl:w-1/4 p-6 text-center\"\n >\n <div class=\"w-full flex justify-end px-2\">\n <button\n @click=${this.closeFreeTrialPopup}\n class=\"w-8 h-8 pl-4 ${this.isDark\n ? 'text-grey-300'\n : 'text-grey-400'}\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'xmark', 24, 24))}\n </button>\n </div>\n <div class=\"w-full flex justify-center\">\n <div class=\"w-3/4 lg:w-1/2\">\n <img\n src=\"https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/kompas-free-trial.png\"\n alt=\"Free Trial\"\n />\n </div>\n </div>\n <p\n class=\"font-bold text-lg ${this.isDark\n ? 'text-white'\n : 'text-grey-600'} mt-4\"\n >\n Coba Gratis Kompas.id di Aplikasi\n </p>\n <div\n class=\"${this.isDark\n ? 'bg-dark-3 border border-dark-9'\n : 'bg-white border border-grey-300'} hidden lg:block lg:flex flex rounded mt-4 px-8 py-4 items-center\"\n >\n <div class=\"w-1/3 flex mr-6\">\n <img\n src=\"https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/free-trial-qr-code.png\"\n alt=\"QR Code Deep Link\"\n />\n </div>\n <div\n class=\"w-2/3 text-base ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'} text-left\"\n >\n Coba gratis 3 hari Kompas.id melalui aplikasi. Pindai kode QR\n dengan ponsel atau tablet untuk mengunduh aplikasi.\n </div>\n </div>\n <div\n class=\"text-base ${this.isDark\n ? 'text-dark-7'\n : 'text-grey-600'} text-center lg:hidden px-2 md:px-8\"\n >\n Dapatkan akses gratis selama 3 hari ke konten dan fitur premium\n Kompas.id di aplikasi.\n </div>\n <div class=\"lg:flex flex justify-center mt-4 hidden lg:block gap-4\">\n <a\n href=\"https://play.google.com/store/apps/details?id=id.kompas.app\"\n target=\"_blank\"\n ><img\n src=\"${this.isDark\n ? 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/Button_Download%20Google%20Play_Dark%20Mode.svg'\n : 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/Button_Download%20Google%20Play_Light%20Mode.svg'}\"\n alt=\"Google Play Badge\"\n /></a>\n <a\n href=\"https://apps.apple.com/id/app/kompas-id/id1242195037?l=id\"\n target=\"_blank\"\n ><img\n src=\"${this.isDark\n ? 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/Button_Download%20App%20Store_Dark%20Mode.svg'\n : 'https://kompasid-production-www.s3.ap-southeast-1.amazonaws.com/web-component/Button_Download%20App%20Store_Light%20Mode.svg'}\"\n alt=\"iOS App Store Badge\"\n /></a>\n </div>\n <button\n onclick=\"window.open('https://app.komp.as/langganan', '_blank')\"\n class=\"h-12 ${this.isDark\n ? 'bg-green-300'\n : 'bg-green-500'} rounded-md mt-4 flex w-full items-center justify-center lg:hidden\"\n >\n <h6\n class=\"${this.isDark\n ? 'text-dark-5'\n : 'text-white'} font-bold p-4\"\n >\n Unduh Sekarang\n </h6>\n </button>\n </div>\n </div>\n `\n }\n\n private freeTrialPackageSection() {\n const packages = this.paywallData?.packages ?? ({} as Packages)\n\n if (packages.freeTrial) {\n return html`\n <div\n class=\"flex flex-wrap items-center justify-between ${this.isDark\n ? 'bg-grey-600'\n : 'bg-white'} py-3 px-4 rounded-lg md:mx-0 w-full h-[68px] max-w-xs md:max-w-sm md:w-3/5 mt-3 md:mt-4\"\n >\n <div class=\"flex flex-col\">\n <div class=\"flex items-center\">\n <h5 class=\"text-base md:text-lg font-bold text-orange-400\">\n ${formatRupiah(0)}\n </h5>\n </div>\n <div class=\"flex items-center\">\n <p\n class=\"text-xs ${this.isDark ? 'text-dark-7' : 'text-grey-600'}\"\n >\n ${packages.freeTrial}\n </p>\n </div>\n </div>\n <button\n @click=${this.openFreeTrialPopup}\n class=\"h-8 ${!this.isDark &&\n 'bg-white'} border border-green-500 rounded\"\n >\n <h6\n class=\"text-xs md:text-sm ${this.isDark\n ? 'text-green-300'\n : 'text-green-500'} font-bold px-4\"\n >\n Coba Gratis\n </h6>\n </button>\n </div>\n `\n }\n return nothing\n }\n\n /\n Render Statement\n */\n\n render() {\n return html`\n <div\n class=\"${this.type === 'epaper'\n ? 'bg-transparent wrapper-body mx-2'\n : 'wrapper-body'}\n ${this.type === 'audio'\n ? `fixed w-full h-full inset-0 flex justify-center items-center z-50 bg-black bg-opacity-75`\n : 'wrapper-body'}\"\n >\n <div\n class=\"flex flex-col justify-center items-center w-full max-w-screen-sm my-5 px-2 relative\"\n >\n ${this.type === 'epaper' \|\| this.type === 'audio'\n ? this.topNavigator(this.type)\n : nothing}\n <div\n class=\"flex w-full flex-col items-center justify-center ${this\n .isDark\n ? 'bg-dark-3'\n : 'bg-blue-100'} rounded-xl pt-6 md:pt-8 relative\"\n >\n ${this.headerSection(\n this.type,\n this.paywallData?.informations?.title ?? ''\n )}\n ${this.descriptionSection(\n this.paywallData?.informations?.description ?? []\n )}\n ${this.packagesSection(\n this.paywallData?.packages ?? ({} as Packages)\n )}\n ${this.informationPackages()}\n ${!this.isLogin\n ? html`\n <div\n class=\"border-b ${this.isDark\n ? 'border-dark-8'\n : 'border-blue-200'} w-1/5 my-4 flex justify-center\"\n ></div>\n ${this.registrationSection(this.type)}\n `\n : nothing}\n ${this.userAction()} ${this.sendDataLayeronPaywallBody()}\n </div>\n ${this.isExtensionsOpened\n ? this.paymentMobileExtension(\n this.paywallData?.payment?.ekstension ?? []\n )\n : nothing}\n </div>\n </div>\n `\n }\n}\n"]}

package/dist/src/components/kompasid-widget-recirculations-default/KompasWidgetRecirculationsDefault.d.ts ADDED Viewed

@@ -0,0 +1,39 @@
+import { LitElement } from 'lit';
+import { Post, Navigation } from './types.js';
+export declare class KompasWidgetRecirculationsDefault extends LitElement {
+    static styles: import("lit").CSSResult[];
+    /**
+     * Props
+     */
+    posts: Post[][];
+    navigation: Navigation | undefined;
+    accessToken: string;
+    permalinkArticle: string;
+    userGuid: string;
+    slugs: string;
+    type: 'relatedArticle' | 'otherArticle';
+    mainCategory: string;
+    /**
+     * Getters
+     */
+    get navigationPermalink(): string | undefined;
+    /**
+     * Fetch Data
+     */
+    connectedCallback(): Promise<void>;
+    fetchAccessToken(): Promise<void>;
+    relatedArticles(): Promise<void>;
+    otherArticles(): Promise<void>;
+    handleFetchError(error: unknown): void;
+    /**
+     * Function to format date
+     */
+    formatDate(date: string): string;
+    /**
+     * Render widget components
+     */
+    private WidgetTitle;
+    renderChips(post: Post): import("lit").TemplateResult<1>[];
+    renderImage(post: Post): import("lit").TemplateResult<1> | "";
+    render(): import("lit").TemplateResult<1>;
+}