@kompasid/lit-web-components 0.9.22 → 0.9.25

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 (22) hide show
  1. package/demo/index.html +3 -1
  2. package/dist/src/components/kompasid-menu-side-bar/KompasMenuSideBar.js +27 -22
  3. package/dist/src/components/kompasid-menu-side-bar/KompasMenuSideBar.js.map +1 -1
  4. package/dist/src/components/kompasid-paywall/KompasPaywall.d.ts +1 -0
  5. package/dist/src/components/kompasid-paywall/KompasPaywall.js +33 -6
  6. package/dist/src/components/kompasid-paywall/KompasPaywall.js.map +1 -1
  7. package/dist/src/components/kompasid-paywall/types.d.ts +7 -1
  8. package/dist/src/components/kompasid-paywall/types.js.map +1 -1
  9. package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.d.ts +2 -1
  10. package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.js +33 -12
  11. package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.js.map +1 -1
  12. package/dist/tailwind/tailwind.js +14 -46
  13. package/dist/tailwind/tailwind.js.map +1 -1
  14. package/dist/tsconfig.tsbuildinfo +1 -1
  15. package/package.json +1 -1
  16. package/src/components/kompasid-menu-side-bar/KompasMenuSideBar.ts +26 -21
  17. package/src/components/kompasid-paywall/KompasPaywall.ts +30 -6
  18. package/src/components/kompasid-paywall/types.ts +14 -1
  19. package/src/components/kompasid-paywall-body/KompasPaywallBody.ts +29 -13
  20. package/src/components/kompasid-paywall-body/readme.md +2 -1
  21. package/tailwind/tailwind.css +17 -42
  22. package/tailwind/tailwind.ts +14 -46
package/demo/index.html CHANGED
@@ -58,7 +58,7 @@
58
58
  import '../dist/src/components/kompasid-header-notification/KompasHeaderNotification.js'
59
59
  import '../dist/src/components/kompasid-grace-period/KompasGracePeriod.js'
60
60
 
61
- const type = 'epaper'
61
+ const type = 'proMiningArticle'
62
62
  const theme = ''
63
63
  const paywallLocation = 'paywall_location'
64
64
  const paywallSubscriptionId = 'testId'
@@ -73,6 +73,7 @@
73
73
  const trackerContentCategories = 'content_categories'
74
74
  const trackerUserId = 'user_id'
75
75
  const trackerUserType = 'user_type'
76
+ const trackerContentPublisher = 'publisher'
76
77
  const trackerMeteredWallBalance = 0
77
78
  const subscriptionStatus = 'subscription_status'
78
79
  const trackerPageDomain = 'page_domain'
@@ -250,6 +251,7 @@
250
251
  .subscriptionStatus=${subscriptionStatus}
251
252
  .tracker_epaper_edition=${trackerEpaperEdition}
252
253
  .metered_wall_balance=${meteredWallBalance}
254
+ .tracker_content_publisher=${trackerContentPublisher}
253
255
  .isLogin=${isLogin}
254
256
  .isWithHeader=${isWithHeader}
255
257
  .swgEnable=${swgEnable}
package/dist/src/components/kompasid-menu-side-bar/KompasMenuSideBar.js CHANGED
@@ -106,16 +106,32 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
106
106
  }
107
107
  renderItem(item, padClass) {
108
108
  var _a, _b, _c;
109
+ const hasChild = this.hasChildren(item);
109
110
  return html `
110
111
  <div class="w-full font-sans text-black">
111
112
  <div
112
113
  class="flex items-center justify-between text-sm font-medium ${padClass} transition-all cursor-pointer"
113
114
  role="button"
114
115
  tabindex="0"
115
- @click=${(e) => this.rubricClicked(item, e)}
116
- @keydown=${(e) => {
117
- if (e.key === 'Enter')
116
+ @click=${(e) => {
117
+ e.stopPropagation();
118
+ if (hasChild) {
119
+ this.toggleChildren(item);
120
+ }
121
+ else {
118
122
  this.rubricClicked(item, e);
123
+ }
124
+ }}
125
+ @keydown=${(e) => {
126
+ if (e.key === 'Enter') {
127
+ e.stopPropagation();
128
+ if (hasChild) {
129
+ this.toggleChildren(item);
130
+ }
131
+ else {
132
+ this.rubricClicked(item, e);
133
+ }
134
+ }
119
135
  }}
120
136
  >
121
137
  <div
@@ -135,26 +151,15 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
135
151
  <span class="font-bold">${decodeSpecialChars(item.name)}</span>
136
152
  ${timedContent((_a = item.redDot.start) !== null && _a !== void 0 ? _a : '', (_b = item.redDot.end) !== null && _b !== void 0 ? _b : '')
137
153
  ? html `<span
138
- class="bg-orange-400 h‑2 w‑2 rounded-full relative -top-[12px] shrink-0"
154
+ class="bg-orange-400 h-2 w-2 rounded-full relative -top-[12px] shrink-0"
139
155
  ></span>`
140
156
  : ''}
141
157
  </div>
142
- ${this.hasChildren(item)
158
+
159
+ ${hasChild
143
160
  ? html `
144
161
  <span
145
- class="flex justify-center items-center rounded my‑1 py‑4 w‑10 h‑10 cursor‑pointer text-grey-400"
146
- role="button"
147
- tabindex="0"
148
- @click=${(e) => {
149
- e.stopPropagation();
150
- this.toggleChildren(item);
151
- }}
152
- @keydown=${(e) => {
153
- if (e.key === 'Enter') {
154
- e.stopPropagation();
155
- this.toggleChildren(item);
156
- }
157
- }}
162
+ class="flex justify-center items-center rounded my-1 py-4 w-10 h-10 text-grey-400"
158
163
  >
159
164
  ${unsafeSVG(getFontAwesomeIcon('fas', this.expandedSlug === item.slug
160
165
  ? 'chevron-up'
@@ -164,11 +169,11 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
164
169
  : null}
165
170
  </div>
166
171
 
167
- ${this.hasChildren(item) && this.expandedSlug === item.slug
172
+ ${hasChild && this.expandedSlug === item.slug
168
173
  ? html `<div
169
174
  class="${padClass.includes('px-6')
170
- ? 'pt‑1 pb‑2 space-y‑1 text-black'
171
- : 'pl‑14 pt‑1 pb‑2 space-y‑1 text-black'}"
175
+ ? 'pt-1 pb-2 space-y-1 text-black'
176
+ : 'pl-14 pt-1 pb-2 space-y-1 text-black'}"
172
177
  >
173
178
  ${repeat((_c = item.children) !== null && _c !== void 0 ? _c : [], (c) => c.slug, (child) => {
174
179
  var _a, _b;
@@ -189,7 +194,7 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
189
194
  ${decodeSpecialChars(child.name)}
190
195
  ${timedContent((_a = child.redDot.start) !== null && _a !== void 0 ? _a : '', (_b = child.redDot.end) !== null && _b !== void 0 ? _b : '')
191
196
  ? html `<span
192
- class="bg-orange-400 h‑2 w‑2 rounded-full relative -top-[12px] shrink-0"
197
+ class="bg-orange-400 h-2 w-2 rounded-full relative -top-[12px] shrink-0"
193
198
  ></span>`
194
199
  : ''}
195
200
  </div>
package/dist/src/components/kompasid-menu-side-bar/KompasMenuSideBar.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"KompasMenuSideBar.js","sourceRoot":"","sources":["../../../../src/components/kompasid-menu-side-bar/KompasMenuSideBar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAA;AACrE,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAA;AACtE,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAE1D,qCAAqC;AACrC,OAAO,EACL,kBAAkB,EAClB,gBAAgB,GAIjB,MAAM,4BAA4B,CAAA;AAG5B,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,UAAU;IAA1C;;QAsCL;;;WAGG;QAE0B,WAAM,GAAG,KAAK,CAAA;QACd,qBAAgB,GAAG,KAAK,CAAA;QACzB,wBAAmB,GAAG,EAAE,CAAA;QAE3C,iBAAY,GAAuB,EAAE,CAAA;QACrC,gBAAW,GAAoB;YACtC,OAAO,EAAE,EAAE;YACX,OAAO,EAAE,EAAE;YACX,QAAQ,EAAE,EAAE;YACZ,OAAO,EAAE,EAAE;SACZ,CAAA;QACQ,eAAU,GAAG,KAAK,CAAA;QAClB,iBAAY,GAAkB,IAAI,CAAA;QAC3C,mBAAc,GAAG,KAAK,CAAA;IA+WxB,CAAC;IA7WC,wDAAwD;IACxD,KAAK,CAAC,iBAAiB;QACrB,KAAK,CAAC,iBAAiB,EAAE,CAAA;QACzB,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAA;IACvB,CAAC;IAED,YAAY;;QACV,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,MAAM,CAAC,CAAA;QACnD,MAAM,aAAa,GAAG,IAAK,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAA;QAE5D,IAAI,CAAC,cAAc,GAAG,aAAa,CAAC,MAAM,GAAG,CAAC,CAAA;IAChD,CAAC;IAEO,mBAAmB;;QACzB,OAAO,MAAA,IAAI,CAAC,mBAAmB,0CAC3B,KAAK,CAAC,GAAG,EACV,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAA;IAC5C,CAAC;IAEO,mBAAmB;;QACzB,OAAO,MAAA,IAAI,CAAC,mBAAmB,0CAC3B,KAAK,CAAC,GAAG,EACV,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAA;IAC5C,CAAC;IAEO,aAAa,CAAC,OAA0B;QAC9C,OAAO,OAAO;aACX,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC;aACrB,GAAG,CAAC,CAAC,CAAC,EAAE;YACP,IAAI,CAAC,CAAC,IAAI,KAAK,YAAY,EAAE;gBAC3B,OAAO;oBACL,GAAG,CAAC;oBACJ,QAAQ,EAAE,IAAI,CAAC,mBAAmB,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE;iBACvD,CAAA;aACF;YACD,IAAI,CAAC,CAAC,IAAI,KAAK,YAAY,EAAE;gBAC3B,OAAO;oBACL,GAAG,CAAC;oBACJ,QAAQ,EAAE,IAAI,CAAC,mBAAmB,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE;iBACvD,CAAA;aACF;YACD,OAAO,CAAC,CAAA;QACV,CAAC,CAAC,CAAA;IACN,CAAC;IAED,kDAAkD;IAC1C,KAAK,CAAC,QAAQ;QACpB,IAAI;YACF,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC;gBAC1C,kBAAkB,CAAC,IAAI,CAAC,gBAAgB,CAAC;gBACzC,gBAAgB,CAAC,IAAI,CAAC,gBAAgB,CAAC;aACxC,CAAC,CAAA;YAEF,IAAI,CAAC,YAAY,GAAG,OAAO,CAAA;YAC3B,IAAI,CAAC,WAAW,GAAG;gBACjB,GAAG,MAAM;gBACT,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,OAAO,CAAC;aAC5C,CAAA;SACF;QAAC,OAAO,KAAK,EAAE;YACd,OAAO,CAAC,KAAK,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAA;SAC5C;IACH,CAAC;IAEO,gBAAgB,CAAC,CAAQ;QAC/B,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAA;IACpC,CAAC;IAEO,aAAa,CACnB,IAAqC,EACrC,KAAa;QAEb,IAAI,KAAK,EAAE;YACT,KAAK,CAAC,eAAe,EAAE,CAAA,CAAC,6BAA6B;SACtD;QACD,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAA;SACjC;QAED,sBAAsB;IACxB,CAAC;IAEO,WAAW,CAAC,IAAqB;QACvC,OAAO,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAA;IACjE,CAAC;IAEO,cAAc,CAAC,IAAqB;QAC1C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAA;IACxE,CAAC;IAEO,UAAU,CAAC,IAAS,EAAE,QAAgB;;QAC5C,OAAO,IAAI,CAAA;;;yEAG0D,QAAQ;;;mBAG9D,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC;qBACvC,CAAC,CAAgB,EAAE,EAAE;YAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO;gBAAE,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC,CAAA;QACpD,CAAC;;;;;cAKG,IAAI,CAAC,OAAO;YACZ,CAAC,CAAC,IAAI,CAAA;;2BAEO,IAAI,CAAC,OAAO;2BACZ,IAAI,CAAC,IAAI;;;;;uBAKb;YACT,CAAC,CAAC,EAAE;sCACoB,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;cACrD,YAAY,CAAC,MAAA,IAAI,CAAC,MAAM,CAAC,KAAK,mCAAI,EAAE,EAAE,MAAA,IAAI,CAAC,MAAM,CAAC,GAAG,mCAAI,EAAE,CAAC;YAC5D,CAAC,CAAC,IAAI,CAAA;;yBAEK;YACX,CAAC,CAAC,EAAE;;YAEN,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;YACtB,CAAC,CAAC,IAAI,CAAA;;;;;2BAKS,CAAC,CAAQ,EAAE,EAAE;gBACpB,CAAC,CAAC,eAAe,EAAE,CAAA;gBACnB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAA;YAC3B,CAAC;6BACU,CAAC,CAAgB,EAAE,EAAE;gBAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;oBACrB,CAAC,CAAC,eAAe,EAAE,CAAA;oBACnB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAA;iBAC1B;YACH,CAAC;;oBAEC,SAAS,CACT,kBAAkB,CAChB,KAAK,EACL,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,IAAI;gBAC7B,CAAC,CAAC,YAAY;gBACd,CAAC,CAAC,cAAc,EAClB,EAAE,EACF,EAAE,CACH,CACF;;eAEJ;YACH,CAAC,CAAC,IAAI;;;UAGR,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,IAAI;YACzD,CAAC,CAAC,IAAI,CAAA;uBACO,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC;gBAChC,CAAC,CAAC,gCAAgC;gBAClC,CAAC,CAAC,sCAAsC;;gBAExC,MAAM,CACN,MAAA,IAAI,CAAC,QAAQ,mCAAI,EAAE,EACnB,CAAC,CAAkB,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAC9B,CAAC,KAAsB,EAAE,EAAE;;gBAAC,OAAA,IAAI,CAAA;;;;;6BAKnB,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC;+BAC7B,CAAC,CAAgB,EAAE,EAAE;oBAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO;wBAAE,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC,CAAC,CAAA;gBACrD,CAAC;;;;;wBAKG,kBAAkB,CAAC,KAAK,CAAC,IAAI,CAAC;wBAC9B,YAAY,CACZ,MAAA,KAAK,CAAC,MAAM,CAAC,KAAK,mCAAI,EAAE,EACxB,MAAA,KAAK,CAAC,MAAM,CAAC,GAAG,mCAAI,EAAE,CACvB;oBACC,CAAC,CAAC,IAAI,CAAA;;mCAEK;oBACX,CAAC,CAAC,EAAE;;;wBAGJ,KAAK,CAAC,QAAQ;oBACd,CAAC,CAAC,SAAS,CACP,kBAAkB,CAAC,KAAK,EAAE,eAAe,EAAE,EAAE,EAAE,EAAE,CAAC,CACnD;oBACH,CAAC,CAAC,EAAE;;;iBAGX,CAAA;aAAA,CACF;mBACI;YACT,CAAC,CAAC,EAAE;;KAET,CAAA;IACH,CAAC;IAEO,aAAa,CAAC,KAAoB,EAAE,KAAY,EAAE,QAAgB;QACxE,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,IAAI,CAAA,CAAC,qBAAqB;QACnE,OAAO,IAAI,CAAA;QACP,KAAK;YACL,CAAC,CAAC,IAAI,CAAA,sCAAsC,QAAQ;eAC7C,KAAK;YACR;YACJ,CAAC,CAAC,IAAI;QACN,MAAM,CACN,KAAK,EACL,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,EACjB,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,QAAQ,CAAC,CACxC;KACF,CAAA;IACH,CAAC;IAEO,WAAW;QACjB,OAAO,IAAI,CAAA;;;;;;;;;KASV,CAAA;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;iBAME,IAAI,CAAC,gBAAgB;mBACnB,CAAC,CAAgB,EAAE,EAAE;YAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO;gBAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAA;QACjD,CAAC;;;UAGC,CAAC,IAAI,CAAC,cAAc;YACpB,CAAC,CAAC,IAAI,CAAA;;yCAEyB,IAAI,CAAC,MAAM;gBAClC,CAAC,CAAC,gBAAgB;gBAClB,CAAC,CAAC,cAAc;;kBAEhB,SAAS,CAAC,kBAAkB,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;;;iFAGmB,IAAI;iBAClE,MAAM;gBACP,CAAC,CAAC,gBAAgB;gBAClB,CAAC,CAAC,cAAc;;;;aAIrB;YACH,CAAC,CAAC,EAAE;;;;gBAIE,IAAI,CAAC,UAAU;YACrB,CAAC,CAAC,qCAAqC;YACvC,CAAC,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;yBA2BK,IAAI,CAAC,gBAAgB;2BACnB,CAAC,CAAgB,EAAE,EAAE;YAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO;gBAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAA;QACjD,CAAC;;kBAEC,SAAS,CAAC,kBAAkB,CAAC,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;;;;;;cAMxD,MAAM,CACN,IAAI,CAAC,YAAY,EACjB,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,EACjB,IAAI,CAAC,EAAE,CAAC,IAAI,CAAA;2BACC,IAAI,CAAC,GAAG;;sBAEb,IAAI,CAAC,IAAI;YACX,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;YACxB,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC;YACnB,CAAC,CAAC,IAAI,CAAA;4BACA,SAAS,CACT,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAC/C;+BACI;YACT,CAAC,CAAC,EAAE;;yBAED,IAAI,CAAC,IAAI;;sBAEZ,IAAI,CAAC,KAAK;YACV,CAAC,CAAC,IAAI,CAAA,sBAAsB,IAAI,CAAC,WAAW,EAAE,SAAS;YACvD,CAAC,CAAC,EAAE;;;eAGX,CACF;;YAED,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC;YAC5B,CAAC,CAAC,IAAI,CAAA,sDAAsD;YAC5D,CAAC,CAAC,IAAI;;;YAGN,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,CAAC;YAC1D,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC;YACnC,CAAC,CAAC,IAAI,CAAA,sDAAsD;YAC5D,CAAC,CAAC,IAAI;;;YAGN,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,CAAC;YAC1D,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC;YACnC,CAAC,CAAC,IAAI,CAAA,sDAAsD;YAC5D,CAAC,CAAC,IAAI;;;YAGN,IAAI,CAAC,aAAa,CAClB,aAAa,EACb,IAAI,CAAC,WAAW,CAAC,QAAQ,EACzB,MAAM,CACP;YACC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC;YACpC,CAAC,CAAC,IAAI,CAAA,sDAAsD;YAC5D,CAAC,CAAC,IAAI;;;YAGN,IAAI,CAAC,aAAa,CAAC,SAAS,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,CAAC;;;KAGtE,CAAA;IACH,CAAC;;AAraM,wBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAgCF;IACD,QAAQ;CACT,CAAA;AAO4B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAAe;AACd;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2DAAyB;AACzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8DAAyB;AAE3C;IAAR,KAAK,EAAE;uDAAsC;AACrC;IAAR,KAAK,EAAE;sDAKP;AACQ;IAAR,KAAK,EAAE;qDAAmB;AAClB;IAAR,KAAK,EAAE;uDAAmC;AAvDhC,iBAAiB;IAD7B,aAAa,CAAC,wBAAwB,CAAC;GAC3B,iBAAiB,CAua7B;SAvaY,iBAAiB","sourcesContent":["import { LitElement, html, css } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { repeat } from 'lit/directives/repeat.js'\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { getFontAwesomeIcon } from '../../utils/fontawesome-setup.js'\nimport { decodeSpecialChars } from '../../utils/decodeSpecialChars.js'\nimport { timedContent } from '../../utils/timedContent.js'\n\n// Importing the data fetch functions\nimport {\n fetchExternalLinks,\n fetchSidebarData,\n DataExternalLink,\n DataSideBarLink,\n DataSideBarItem,\n} from './SidebarDataController.js'\n\n@customElement('kompasid-menu-side-bar')\nexport class KompasMenuSideBar extends LitElement {\n static styles = [\n css`\n .slide-side-enter-active,\n .slide-side-leave-active {\n transition: all 0.3s ease-out;\n }\n .slide-side-enter,\n .slide-side-leave-to {\n transform: translateX(-100%);\n }\n /* end: transisi buat sidebar */\n .nuxt-link-exact-active {\n @apply text-brand-1;\n }\n .menu-menu-sidebar {\n z-index: 99999;\n }\n /* Force scrollbar to always show (for debugging) */\n .menu-menu-sidebar::-webkit-scrollbar {\n width: 4px;\n }\n .menu-menu-sidebar::-webkit-scrollbar-track {\n background: white;\n }\n .menu-menu-sidebar::-webkit-scrollbar-thumb {\n background-color: #00557d; /* Replace with your brand color */\n border-radius: 8px;\n }\n .menu-menu-sidebar::-webkit-scrollbar-button,\n .menu-menu-sidebar::-webkit-scrollbar-corner {\n background-color: white;\n }\n /* existing styles */\n `,\n TWStyles,\n ]\n\n /**\n * Props\n * property kompasProSubscription untuk menghandle apakah user sudah login atau belum\n */\n\n @property({ type: Boolean }) isDark = false\n @property({ type: Boolean }) isProductionMode = false\n @property({ type: String }) subscriptionPackage = ''\n\n @state() dataExternal: DataExternalLink[] = []\n @state() dataSidebar: DataSideBarLink = {\n bundles: [],\n feature: [],\n category: [],\n lainnya: [],\n }\n @state() showNavBar = false\n @state() expandedSlug: string | null = null\n hasSlotContent = false\n\n // Fetch data when the component is connected to the DOM\n async connectedCallback() {\n super.connectedCallback()\n await this.loadData()\n }\n\n firstUpdated() {\n const slot = this.shadowRoot?.querySelector('slot')\n const assignedNodes = slot!.assignedNodes({ flatten: true })\n\n this.hasSlotContent = assignedNodes.length > 0\n }\n\n private hasKompasOnePackage(): boolean {\n return this.subscriptionPackage\n ?.split(' ')\n .some(pkg => pkg.includes('kompas-one'))\n }\n\n private hasKompasProPackage(): boolean {\n return this.subscriptionPackage\n ?.split(' ')\n .some(pkg => pkg.includes('kompas-pro'))\n }\n\n private filterBundles(bundles: DataSideBarItem[]): DataSideBarItem[] {\n return bundles\n .filter(b => b.isShow)\n .map(b => {\n if (b.name === 'Kompas One') {\n return {\n ...b,\n children: this.hasKompasOnePackage() ? b.children : [],\n }\n }\n if (b.name === 'Kompas Pro') {\n return {\n ...b,\n children: this.hasKompasProPackage() ? b.children : [],\n }\n }\n return b\n })\n }\n\n // Function to load the data using async API calls\n private async loadData() {\n try {\n const [extData, sbData] = await Promise.all([\n fetchExternalLinks(this.isProductionMode),\n fetchSidebarData(this.isProductionMode),\n ])\n\n this.dataExternal = extData\n this.dataSidebar = {\n ...sbData,\n bundles: this.filterBundles(sbData.bundles),\n }\n } catch (error) {\n console.error('Error loading data:', error)\n }\n }\n\n private toggleNavSidebar(e: Event) {\n e.stopPropagation()\n this.showNavBar = !this.showNavBar\n }\n\n private rubricClicked(\n item: { name: string; href?: string },\n event?: Event\n ): void {\n if (event) {\n event.stopPropagation() // Prevent parent click event\n }\n if (item.href) {\n window.location.href = item.href\n }\n\n // add data layer here\n }\n\n private hasChildren(item: DataSideBarItem): boolean {\n return Array.isArray(item.children) && item.children.length > 0\n }\n\n private toggleChildren(item: DataSideBarItem) {\n this.expandedSlug = this.expandedSlug === item.slug ? null : item.slug\n }\n\n private renderItem(item: any, padClass: string) {\n return html`\n <div class=\"w-full font-sans text-black\">\n <div\n class=\"flex items-center justify-between text-sm font-medium ${padClass} transition-all cursor-pointer\"\n role=\"button\"\n tabindex=\"0\"\n @click=${(e: Event) => this.rubricClicked(item, e)}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') this.rubricClicked(item, e)\n }}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center space-x-3\"\n >\n ${item.iconSrc\n ? html`<div class=\"flex\">\n <img\n src=\"${item.iconSrc}\"\n alt=\"${item.name}\"\n width=\"20\"\n height=\"20\"\n class=\"block\"\n />\n </div>`\n : ''}\n <span class=\"font-bold\">${decodeSpecialChars(item.name)}</span>\n ${timedContent(item.redDot.start ?? '', item.redDot.end ?? '')\n ? html`<span\n class=\"bg-orange-400 h‑2 w‑2 rounded-full relative -top-[12px] shrink-0\"\n ></span>`\n : ''}\n </div>\n ${this.hasChildren(item)\n ? html`\n <span\n class=\"flex justify-center items-center rounded my‑1 py‑4 w‑10 h‑10 cursor‑pointer text-grey-400\"\n role=\"button\"\n tabindex=\"0\"\n @click=${(e: Event) => {\n e.stopPropagation()\n this.toggleChildren(item)\n }}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n e.stopPropagation()\n this.toggleChildren(item)\n }\n }}\n >\n ${unsafeSVG(\n getFontAwesomeIcon(\n 'fas',\n this.expandedSlug === item.slug\n ? 'chevron-up'\n : 'chevron-down',\n 12,\n 12\n )\n )}\n </span>\n `\n : null}\n </div>\n\n ${this.hasChildren(item) && this.expandedSlug === item.slug\n ? html`<div\n class=\"${padClass.includes('px-6')\n ? 'pt‑1 pb‑2 space-y‑1 text-black'\n : 'pl‑14 pt‑1 pb‑2 space-y‑1 text-black'}\"\n >\n ${repeat(\n item.children ?? [],\n (c: DataSideBarItem) => c.slug,\n (child: DataSideBarItem) => html`\n <div\n role=\"button\"\n tabindex=\"0\"\n class=\"flex items-center justify-between text-sm font-medium px-6 transition-all cursor-pointer\"\n @click=${() => this.rubricClicked(child)}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') this.rubricClicked(child, e)\n }}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center pl-8\"\n >\n ${decodeSpecialChars(child.name)}\n ${timedContent(\n child.redDot.start ?? '',\n child.redDot.end ?? ''\n )\n ? html`<span\n class=\"bg-orange-400 h‑2 w‑2 rounded-full relative -top-[12px] shrink-0\"\n ></span>`\n : ''}\n </div>\n <span class=\"ml-auto text-grey-400\">\n ${child.external\n ? unsafeSVG(\n getFontAwesomeIcon('fas', 'external-link', 16, 16)\n )\n : ''}\n </span>\n </div>\n `\n )}\n </div>`\n : ''}\n </div>\n `\n }\n\n private renderSection(title: string | null, items: any[], padClass: string) {\n if (!items || items.length === 0) return null // skip if empty data\n return html`\n ${title\n ? html`<span class=\"text-sm text-grey-400 ${padClass} font-normal\"\n >${title}</span\n >`\n : null}\n ${repeat(\n items,\n item => item.slug,\n item => this.renderItem(item, padClass)\n )}\n `\n }\n\n private renderChips() {\n return html`\n <div\n class=\"py-0.5 px-1.5 rounded-full bg-[#D71920] inline-flex\"\n style=\"background-color:#D71920;\"\n >\n <span class=\"font-bold font-sans text-xs text-white capitalize\"\n >Baru</span\n >\n </div>\n `\n }\n\n render() {\n return html`\n <!-- Toggle Button -->\n <div\n role=\"button\"\n tabindex=\"0\"\n class=\"w-fit flex items-center justify-center cursor-pointer relative\"\n @click=${this.toggleNavSidebar}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') this.toggleNavSidebar(e)\n }}\n >\n <slot></slot>\n ${!this.hasSlotContent\n ? html`\n <div\n class=\"h-4 inline-flex ${this.isDark\n ? 'text-[#FFFFFF]'\n : 'text-brand-1'}\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'bars'))}\n </div>\n <span\n class=\"font-sans hidden sm:inline ml-2 tracking-wide font-bold ${this\n .isDark\n ? 'text-[#FFFFFF]'\n : 'text-brand-1'}\"\n >\n Menu\n </span>\n `\n : ''}\n </div>\n <!-- Sidebar Menu -->\n <nav\n class=${this.showNavBar\n ? 'fixed left-0 top-0 w-screen z-[100]'\n : 'hidden'}\n >\n <!-- Sidebar Content -->\n <div\n class=\"bg-white h-screen menu-menu-sidebar overflow-y-auto pb-20 shadow-lg\"\n style=\"width:312px;\"\n >\n <!-- Logo and Close Button -->\n <div\n class=\"bg-[#FFFFFF] flex flex-col items-center justify-center w-full\"\n >\n <div\n ref=\"logo-kompas\"\n class=\"flex items-center justify-between p-6 w-full\"\n >\n <a href=\"/\" class=\"flex h-9 w-9\">\n <img\n src=\"https://cdn-www.kompas.id/assets/img/icons/kompas-icon-gold.svg\"\n alt=\"Kompas.id\"\n scale=\"0\"\n class=\"block w-full\"\n />\n </a>\n <span\n role=\"button\"\n tabindex=\"0\"\n class=\"font-bold cursor-pointer text-grey-400 flex h-10 items-center justify-center rounded text-base w-10 py-4\"\n @click=${this.toggleNavSidebar}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') this.toggleNavSidebar(e)\n }}\n >\n ${unsafeSVG(getFontAwesomeIcon('fa', 'times', 20, 20))}\n </span>\n </div>\n </div>\n <!-- External Links -->\n <div class=\"flex flex-wrap px-6\">\n ${repeat(\n this.dataExternal,\n item => item.name,\n item => html`\n <a href=\"${item.url}\" class=\"flex w-1/2 no-underline px-2\">\n <div class=\"cursor-pointer flex items-center pb-4\">\n ${item.icon &&\n Array.isArray(item.icon) &&\n item.icon.length >= 2\n ? html`<div class=\"flex mr-2 text-brand-1\">\n ${unsafeSVG(\n getFontAwesomeIcon(item.icon[0], item.icon[1])\n )}\n </div>`\n : ''}\n <span class=\"font-sans text-xs text-[#666666]\"\n >${item.name}</span\n >\n ${item.isNew\n ? html`<span class=\"ml-1\">${this.renderChips()}</span>`\n : ''}\n </div>\n </a>\n `\n )}\n </div>\n ${this.dataExternal.length > 0\n ? html`<div class=\"border-b border-[#DDD] mx-6 my-4\"></div>`\n : null}\n\n <!-- Bundle Section -->\n ${this.renderSection(null, this.dataSidebar.bundles, 'px-6')}\n ${this.dataSidebar.bundles.length > 0\n ? html`<div class=\"border-b border-[#DDD] mx-6 my-4\"></div>`\n : null}\n\n <!-- Feature Section -->\n ${this.renderSection(null, this.dataSidebar.feature, 'px-6')}\n ${this.dataSidebar.feature.length > 0\n ? html`<div class=\"border-b border-[#DDD] mx-6 my-4\"></div>`\n : null}\n\n <!-- Category (Redaksional) -->\n ${this.renderSection(\n 'Redaksional',\n this.dataSidebar.category,\n 'px-6'\n )}\n ${this.dataSidebar.category.length > 0\n ? html`<div class=\"border-b border-[#DDD] mx-6 my-4\"></div>`\n : null}\n\n <!-- Others (Lainnya) -->\n ${this.renderSection('Lainnya', this.dataSidebar.lainnya, 'px-6')}\n </div>\n </nav>\n `\n }\n}\n"]}
1
+ {"version":3,"file":"KompasMenuSideBar.js","sourceRoot":"","sources":["../../../../src/components/kompasid-menu-side-bar/KompasMenuSideBar.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { repeat } from 'lit/directives/repeat.js'\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { getFontAwesomeIcon } from '../../utils/fontawesome-setup.js'\nimport { decodeSpecialChars } from '../../utils/decodeSpecialChars.js'\nimport { timedContent } from '../../utils/timedContent.js'\n\n// Importing the data fetch functions\nimport {\n fetchExternalLinks,\n fetchSidebarData,\n DataExternalLink,\n DataSideBarLink,\n DataSideBarItem,\n} from './SidebarDataController.js'\n\n@customElement('kompasid-menu-side-bar')\nexport class KompasMenuSideBar extends LitElement {\n static styles = [\n css`\n .slide-side-enter-active,\n .slide-side-leave-active {\n transition: all 0.3s ease-out;\n }\n .slide-side-enter,\n .slide-side-leave-to {\n transform: translateX(-100%);\n }\n /* end: transisi buat sidebar */\n .nuxt-link-exact-active {\n @apply text-brand-1;\n }\n .menu-menu-sidebar {\n z-index: 99999;\n }\n /* Force scrollbar to always show (for debugging) */\n .menu-menu-sidebar::-webkit-scrollbar {\n width: 4px;\n }\n .menu-menu-sidebar::-webkit-scrollbar-track {\n background: white;\n }\n .menu-menu-sidebar::-webkit-scrollbar-thumb {\n background-color: #00557d; /* Replace with your brand color */\n border-radius: 8px;\n }\n .menu-menu-sidebar::-webkit-scrollbar-button,\n .menu-menu-sidebar::-webkit-scrollbar-corner {\n background-color: white;\n }\n /* existing styles */\n `,\n TWStyles,\n ]\n\n /**\n * Props\n * property kompasProSubscription untuk menghandle apakah user sudah login atau belum\n */\n\n @property({ type: Boolean }) isDark = false\n @property({ type: Boolean }) isProductionMode = false\n @property({ type: String }) subscriptionPackage = ''\n\n @state() dataExternal: DataExternalLink[] = []\n @state() dataSidebar: DataSideBarLink = {\n bundles: [],\n feature: [],\n category: [],\n lainnya: [],\n }\n @state() showNavBar = false\n @state() expandedSlug: string | null = null\n hasSlotContent = false\n\n // Fetch data when the component is connected to the DOM\n async connectedCallback() {\n super.connectedCallback()\n await this.loadData()\n }\n\n firstUpdated() {\n const slot = this.shadowRoot?.querySelector('slot')\n const assignedNodes = slot!.assignedNodes({ flatten: true })\n\n this.hasSlotContent = assignedNodes.length > 0\n }\n\n private hasKompasOnePackage(): boolean {\n return this.subscriptionPackage\n ?.split(' ')\n .some(pkg => pkg.includes('kompas-one'))\n }\n\n private hasKompasProPackage(): boolean {\n return this.subscriptionPackage\n ?.split(' ')\n .some(pkg => pkg.includes('kompas-pro'))\n }\n\n private filterBundles(bundles: DataSideBarItem[]): DataSideBarItem[] {\n return bundles\n .filter(b => b.isShow)\n .map(b => {\n if (b.name === 'Kompas One') {\n return {\n ...b,\n children: this.hasKompasOnePackage() ? b.children : [],\n }\n }\n if (b.name === 'Kompas Pro') {\n return {\n ...b,\n children: this.hasKompasProPackage() ? b.children : [],\n }\n }\n return b\n })\n }\n\n // Function to load the data using async API calls\n private async loadData() {\n try {\n const [extData, sbData] = await Promise.all([\n fetchExternalLinks(this.isProductionMode),\n fetchSidebarData(this.isProductionMode),\n ])\n\n this.dataExternal = extData\n this.dataSidebar = {\n ...sbData,\n bundles: this.filterBundles(sbData.bundles),\n }\n } catch (error) {\n console.error('Error loading data:', error)\n }\n }\n\n private toggleNavSidebar(e: Event) {\n e.stopPropagation()\n this.showNavBar = !this.showNavBar\n }\n\n private rubricClicked(\n item: { name: string; href?: string },\n event?: Event\n ): void {\n if (event) {\n event.stopPropagation() // Prevent parent click event\n }\n if (item.href) {\n window.location.href = item.href\n }\n\n // add data layer here\n }\n\n private hasChildren(item: DataSideBarItem): boolean {\n return Array.isArray(item.children) && item.children.length > 0\n }\n\n private toggleChildren(item: DataSideBarItem) {\n this.expandedSlug = this.expandedSlug === item.slug ? null : item.slug\n }\n\n private renderItem(item: any, padClass: string) {\n const hasChild = this.hasChildren(item)\n\n return html`\n <div class=\"w-full font-sans text-black\">\n <div\n class=\"flex items-center justify-between text-sm font-medium ${padClass} transition-all cursor-pointer\"\n role=\"button\"\n tabindex=\"0\"\n @click=${(e: Event) => {\n e.stopPropagation()\n if (hasChild) {\n this.toggleChildren(item)\n } else {\n this.rubricClicked(item, e)\n }\n }}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n e.stopPropagation()\n if (hasChild) {\n this.toggleChildren(item)\n } else {\n this.rubricClicked(item, e)\n }\n }\n }}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center space-x-3\"\n >\n ${item.iconSrc\n ? html`<div class=\"flex\">\n <img\n src=\"${item.iconSrc}\"\n alt=\"${item.name}\"\n width=\"20\"\n height=\"20\"\n class=\"block\"\n />\n </div>`\n : ''}\n <span class=\"font-bold\">${decodeSpecialChars(item.name)}</span>\n ${timedContent(item.redDot.start ?? '', item.redDot.end ?? '')\n ? html`<span\n class=\"bg-orange-400 h-2 w-2 rounded-full relative -top-[12px] shrink-0\"\n ></span>`\n : ''}\n </div>\n\n ${hasChild\n ? html`\n <span\n class=\"flex justify-center items-center rounded my-1 py-4 w-10 h-10 text-grey-400\"\n >\n ${unsafeSVG(\n getFontAwesomeIcon(\n 'fas',\n this.expandedSlug === item.slug\n ? 'chevron-up'\n : 'chevron-down',\n 12,\n 12\n )\n )}\n </span>\n `\n : null}\n </div>\n\n ${hasChild && this.expandedSlug === item.slug\n ? html`<div\n class=\"${padClass.includes('px-6')\n ? 'pt-1 pb-2 space-y-1 text-black'\n : 'pl-14 pt-1 pb-2 space-y-1 text-black'}\"\n >\n ${repeat(\n item.children ?? [],\n (c: DataSideBarItem) => c.slug,\n (child: DataSideBarItem) => html`\n <div\n role=\"button\"\n tabindex=\"0\"\n class=\"flex items-center justify-between text-sm font-medium px-6 transition-all cursor-pointer\"\n @click=${() => this.rubricClicked(child)}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') this.rubricClicked(child, e)\n }}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center pl-8\"\n >\n ${decodeSpecialChars(child.name)}\n ${timedContent(\n child.redDot.start ?? '',\n child.redDot.end ?? ''\n )\n ? html`<span\n class=\"bg-orange-400 h-2 w-2 rounded-full relative -top-[12px] shrink-0\"\n ></span>`\n : ''}\n </div>\n <span class=\"ml-auto text-grey-400\">\n ${child.external\n ? unsafeSVG(\n getFontAwesomeIcon('fas', 'external-link', 16, 16)\n )\n : ''}\n </span>\n </div>\n `\n )}\n </div>`\n : ''}\n </div>\n `\n }\n\n private renderSection(title: string | null, items: any[], padClass: string) {\n if (!items || items.length === 0) return null // skip if empty data\n return html`\n ${title\n ? html`<span class=\"text-sm text-grey-400 ${padClass} font-normal\"\n >${title}</span\n >`\n : null}\n ${repeat(\n items,\n item => item.slug,\n item => this.renderItem(item, padClass)\n )}\n `\n }\n\n private renderChips() {\n return html`\n <div\n class=\"py-0.5 px-1.5 rounded-full bg-[#D71920] inline-flex\"\n style=\"background-color:#D71920;\"\n >\n <span class=\"font-bold font-sans text-xs text-white capitalize\"\n >Baru</span\n >\n </div>\n `\n }\n\n render() {\n return html`\n <!-- Toggle Button -->\n <div\n role=\"button\"\n tabindex=\"0\"\n class=\"w-fit flex items-center justify-center cursor-pointer relative\"\n @click=${this.toggleNavSidebar}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') this.toggleNavSidebar(e)\n }}\n >\n <slot></slot>\n ${!this.hasSlotContent\n ? html`\n <div\n class=\"h-4 inline-flex ${this.isDark\n ? 'text-[#FFFFFF]'\n : 'text-brand-1'}\"\n >\n ${unsafeSVG(getFontAwesomeIcon('fas', 'bars'))}\n </div>\n <span\n class=\"font-sans hidden sm:inline ml-2 tracking-wide font-bold ${this\n .isDark\n ? 'text-[#FFFFFF]'\n : 'text-brand-1'}\"\n >\n Menu\n </span>\n `\n : ''}\n </div>\n <!-- Sidebar Menu -->\n <nav\n class=${this.showNavBar\n ? 'fixed left-0 top-0 w-screen z-[100]'\n : 'hidden'}\n >\n <!-- Sidebar Content -->\n <div\n class=\"bg-white h-screen menu-menu-sidebar overflow-y-auto pb-20 shadow-lg\"\n style=\"width:312px;\"\n >\n <!-- Logo and Close Button -->\n <div\n class=\"bg-[#FFFFFF] flex flex-col items-center justify-center w-full\"\n >\n <div\n ref=\"logo-kompas\"\n class=\"flex items-center justify-between p-6 w-full\"\n >\n <a href=\"/\" class=\"flex h-9 w-9\">\n <img\n src=\"https://cdn-www.kompas.id/assets/img/icons/kompas-icon-gold.svg\"\n alt=\"Kompas.id\"\n scale=\"0\"\n class=\"block w-full\"\n />\n </a>\n <span\n role=\"button\"\n tabindex=\"0\"\n class=\"font-bold cursor-pointer text-grey-400 flex h-10 items-center justify-center rounded text-base w-10 py-4\"\n @click=${this.toggleNavSidebar}\n @keydown=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') this.toggleNavSidebar(e)\n }}\n >\n ${unsafeSVG(getFontAwesomeIcon('fa', 'times', 20, 20))}\n </span>\n </div>\n </div>\n <!-- External Links -->\n <div class=\"flex flex-wrap px-6\">\n ${repeat(\n this.dataExternal,\n item => item.name,\n item => html`\n <a href=\"${item.url}\" class=\"flex w-1/2 no-underline px-2\">\n <div class=\"cursor-pointer flex items-center pb-4\">\n ${item.icon &&\n Array.isArray(item.icon) &&\n item.icon.length >= 2\n ? html`<div class=\"flex mr-2 text-brand-1\">\n ${unsafeSVG(\n getFontAwesomeIcon(item.icon[0], item.icon[1])\n )}\n </div>`\n : ''}\n <span class=\"font-sans text-xs text-[#666666]\"\n >${item.name}</span\n >\n ${item.isNew\n ? html`<span class=\"ml-1\">${this.renderChips()}</span>`\n : ''}\n </div>\n </a>\n `\n )}\n </div>\n ${this.dataExternal.length > 0\n ? html`<div class=\"border-b border-[#DDD] mx-6 my-4\"></div>`\n : null}\n\n <!-- Bundle Section -->\n ${this.renderSection(null, this.dataSidebar.bundles, 'px-6')}\n ${this.dataSidebar.bundles.length > 0\n ? html`<div class=\"border-b border-[#DDD] mx-6 my-4\"></div>`\n : null}\n\n <!-- Feature Section -->\n ${this.renderSection(null, this.dataSidebar.feature, 'px-6')}\n ${this.dataSidebar.feature.length > 0\n ? html`<div class=\"border-b border-[#DDD] mx-6 my-4\"></div>`\n : null}\n\n <!-- Category (Redaksional) -->\n ${this.renderSection(\n 'Redaksional',\n this.dataSidebar.category,\n 'px-6'\n )}\n ${this.dataSidebar.category.length > 0\n ? html`<div class=\"border-b border-[#DDD] mx-6 my-4\"></div>`\n : null}\n\n <!-- Others (Lainnya) -->\n ${this.renderSection('Lainnya', this.dataSidebar.lainnya, 'px-6')}\n </div>\n </nav>\n `\n }\n}\n"]}
package/dist/src/components/kompasid-paywall/KompasPaywall.d.ts CHANGED
@@ -63,6 +63,7 @@ export declare class KompasPaywall extends LitElement {
63
63
  tracker_metered_wall_type: string;
64
64
  tracker_metered_wall_balance: number;
65
65
  tracker_epaper_edition: string;
66
+ tracker_content_publisher: string;
66
67
  theme: string;
67
68
  mockResult: PaywallProduct;
68
69
  get darkUrl(): "" | "-dark";
package/dist/src/components/kompasid-paywall/KompasPaywall.js CHANGED
@@ -66,6 +66,7 @@ let KompasPaywall = class KompasPaywall extends LitElement {
66
66
  this.tracker_metered_wall_type = '';
67
67
  this.tracker_metered_wall_balance = 0;
68
68
  this.tracker_epaper_edition = '';
69
+ this.tracker_content_publisher = '';
69
70
  this.theme = '';
70
71
  this.mockResult = {
71
72
  informations: {
@@ -83,6 +84,11 @@ let KompasPaywall = class KompasPaywall extends LitElement {
83
84
  maxQuotaMessage: 'Akses artikel gratis Anda bulan ini sudah habis.',
84
85
  url: 'https://kompas.id/berlangganan',
85
86
  },
87
+ cta: {
88
+ show: true,
89
+ text: 'Lihat Paket Lainnya',
90
+ url: 'https://www.kompas.id/berlangganan/v2',
91
+ },
86
92
  },
87
93
  packages: {
88
94
  title: 'Sekali bayar, tanpa perpanjang otomatis',
@@ -222,6 +228,8 @@ let KompasPaywall = class KompasPaywall extends LitElement {
222
228
  this.selectorTypePaywall = (type) => {
223
229
  switch (type) {
224
230
  case 'epaper':
231
+ case 'proMiningArticle':
232
+ case 'proMiningOutlook':
225
233
  return this.renderEpaperPaywallSection();
226
234
  case 'audio':
227
235
  return this.renderAudioPaywallSection();
@@ -243,19 +251,30 @@ let KompasPaywall = class KompasPaywall extends LitElement {
243
251
  try {
244
252
  const response = await fetch('https://cdn-www.kompas.id/web-component/paywall.json');
245
253
  const json = await response.json();
254
+ const listType = [
255
+ 'reguler',
256
+ 'audio',
257
+ 'proMiningOutlook',
258
+ 'proMiningArticle',
259
+ 'epaper',
260
+ 'custom',
261
+ ];
262
+ const findTypeOnTheList = listType.includes(this.type);
263
+ const defaultType = findTypeOnTheList ? this.type : 'reguler';
246
264
  this.paywallData = {
247
265
  ...this.mockResult,
248
266
  informations: {
249
267
  ...this.mockResult.informations,
250
- title: json[this.type].head,
251
- description: json[this.type].content,
268
+ title: json[defaultType].head,
269
+ description: json[defaultType].content,
270
+ cta: json[defaultType].cta,
252
271
  },
253
272
  packages: {
254
273
  ...this.mockResult.packages,
255
- memberships: json[this.type].memberships,
256
- swgEnable: json[this.type].swgEnable,
257
- freeTrial: json[this.type].freeTrial,
258
- swgContent: json[this.type].swgContent,
274
+ memberships: json[defaultType].memberships,
275
+ swgEnable: json[defaultType].swgEnable,
276
+ freeTrial: json[defaultType].freeTrial,
277
+ swgContent: json[defaultType].swgContent,
259
278
  },
260
279
  };
261
280
  }
@@ -292,6 +311,7 @@ let KompasPaywall = class KompasPaywall extends LitElement {
292
311
  tracker_metered_wall_type=${this.tracker_metered_wall_type}
293
312
  tracker_epaper_edition=${this.tracker_epaper_edition}
294
313
  tracker_metered_wall_balance=${this.tracker_metered_wall_balance}
314
+ tracker_content_publisher=${this.tracker_content_publisher}
295
315
  ?swgEnable=${this.swgEnable}
296
316
  tracker_content_type=${this.tracker_content_type}
297
317
  ?isLogin=${this.isLogin}
@@ -338,6 +358,7 @@ let KompasPaywall = class KompasPaywall extends LitElement {
338
358
  tracker_metered_wall_balance=${this
339
359
  .tracker_metered_wall_balance}
340
360
  tracker_content_type=${this.tracker_content_type}
361
+ tracker_content_publisher=${this.tracker_content_publisher}
341
362
  ?swgEnable=${this.swgEnable}
342
363
  ?isLogin=${this.isLogin}
343
364
  type=${this.type}
@@ -378,6 +399,7 @@ let KompasPaywall = class KompasPaywall extends LitElement {
378
399
  tracker_page_domain=${this.tracker_page_domain}
379
400
  tracker_metered_wall_type=${this.tracker_metered_wall_type}
380
401
  tracker_metered_wall_balance=${this.tracker_metered_wall_balance}
402
+ tracker_content_publisher=${this.tracker_content_publisher}
381
403
  ?swgEnable=${this.swgEnable}
382
404
  ?isLogin=${this.isLogin}
383
405
  type=${this.type}
@@ -427,6 +449,7 @@ let KompasPaywall = class KompasPaywall extends LitElement {
427
449
  tracker_metered_wall_balance=${this
428
450
  .tracker_metered_wall_balance}
429
451
  tracker_content_type=${this.tracker_content_type}
452
+ tracker_content_publisher=${this.tracker_content_publisher}
430
453
  ?swgEnable=${this.swgEnable}
431
454
  ?isLogin=${this.isLogin}
432
455
  type=${this.type}
@@ -468,6 +491,7 @@ let KompasPaywall = class KompasPaywall extends LitElement {
468
491
  tracker_page_domain=${this.tracker_page_domain}
469
492
  tracker_metered_wall_type=${this.tracker_metered_wall_type}
470
493
  tracker_metered_wall_balance=${this.tracker_metered_wall_balance}
494
+ tracker_content_publisher=${this.tracker_content_publisher}
471
495
  ?swgEnable=${this.swgEnable}
472
496
  ?isLogin=${this.isLogin}
473
497
  type=${this.type}
@@ -607,6 +631,9 @@ __decorate([
607
631
  __decorate([
608
632
  property({ type: String })
609
633
  ], KompasPaywall.prototype, "tracker_epaper_edition", void 0);
634
+ __decorate([
635
+ property({ type: String })
636
+ ], KompasPaywall.prototype, "tracker_content_publisher", void 0);
610
637
  __decorate([
611
638
  property({ type: String })
612
639
  ], KompasPaywall.prototype, "theme", void 0);
package/dist/src/components/kompasid-paywall/KompasPaywall.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"KompasPaywall.js","sourceRoot":"","sources":["../../../../src/components/kompasid-paywall/KompasPaywall.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement, nothing } from 'lit'\nimport { property, state, customElement } from 'lit/decorators.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { PaywallProduct, PaywallType } from './types.js'\nimport '../kompasid-paywall-body/KompasPaywallBody.js'\nimport '../kompasid-paywall-banner-registration/KompasPaywallBannerRegistration.js'\nimport '../kompasid-paywall-information-header/KompasPaywallInformationHeader.js'\n\n@customElement('kompasid-paywall')\nexport class KompasPaywall extends LitElement {\n static styles = [\n css`\n :host {\n font-family: 'PT Sans', sans-serif;\n }\n\n .transparent-linear {\n background-image: -webkit-gradient(\n linear,\n left top,\n left bottom,\n from(hsla(0, 0%, 100%, 0)),\n to(#fff)\n );\n background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0), #fff);\n }\n\n .transparent-linear-dark {\n background-image: -webkit-gradient(\n linear,\n left top,\n left bottom,\n from(hsla(0, 0%, 18%, 0)),\n to(#121212)\n );\n background-image: linear-gradient(180deg, hsla(0, 0%, 18%, 0), #121212);\n }\n `,\n TWStyles,\n ]\n\n /**\n * Props\n */\n /**\n * property isLogin untuk menghandle apakah user sudah login atau belum\n * property countdownArticle untuk menghandle count artikel\n * property type untuk menghandle tipe epaper\n * property isWithHeader untuk menghandle paywall information header\n * property textHeader digunakan sebagai text pada paywall information header\n * property paywallData untuk menghandle data paywall\n * property userGuid untuk menghandle user Guid\n * property subscriptionStatus untuk menghandle status subscription user\n * property swgEnable untuk menghandle swg apakah di aktifkan atau tidak\n * property paywall_location = The location where user encounter the paywall\n * property paywall_subscription_package = The name of the subscription package viewed by user\n * property paywall_subscription_id = The ID of the subscription package viewed by user\n * property paywall_subscription_price = The price of the subscriprtion package viewed by user\n * property paywall_position = The position of the subscription package viewed by user\n * property page_type = Type of the page\n * property content_id = ID of article (slug)\n * property content_type = Whether it's free article or paid article\n * property content_title = The title of article\n * property tracker_content_categories = The category of the content\n * property user_type = Type of user based on their subscription\n * property subscription_status = Status of their subscription\n * property page_domain = Page Domain\n * property metered_wall_type = The type of Metered Wall\n * property metered_wall_balance = The balance of their metered wall\n * property epaper_edition = The edition of epaper viewed by user\n * property theme = The theme of the paywall component\n */\n\n @state() private paywallData: PaywallProduct = {} as PaywallProduct\n @state() private isOpen: Boolean = true\n @state() private isLoading: Boolean = true\n\n @property({ type: Boolean }) isLogin = false\n @property({ type: Number }) countdownArticle = 0\n @property({ type: String }) type: PaywallType = 'reguler'\n @property({ type: Boolean }) isWithHeader = false\n @property({ type: String }) textHeader = ''\n @property({ type: String }) userGuid = ''\n @property({ type: String }) subscriptionStatus = ''\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\n mockResult: PaywallProduct = {\n informations: {\n title: '',\n description: [],\n register: {\n img: 'https://www.kompas.id/img/backgrounds/ilustrasi-banner-registration.png',\n title: 'Ingin Membaca Artikel Ini Secara Utuh?',\n subtitle: 'Daftar akun untuk membaca 5 artikel premium secara gratis ',\n label: 'Daftar Sekarang ',\n },\n meterred: {\n maxQuota: 5,\n label: 'Langganan',\n maxQuotaMessage: 'Akses artikel gratis Anda bulan ini sudah habis.',\n url: 'https://kompas.id/berlangganan',\n },\n },\n packages: {\n title: 'Sekali bayar, tanpa perpanjang otomatis',\n memberships: [],\n swgEnable: false,\n freeTrial: {\n packageText: 'untuk 3 hari pertama',\n desktopText:\n 'Coba gratis 3 hari Kompas.id melalui aplikasi. Pindai kode QR dengan ponsel atau tablet untuk mengunduh aplikasi.',\n mobileText:\n 'Dapatkan akses gratis selama 3 hari ke konten dan fitur premium Kompas.id di aplikasi.',\n },\n swgContent: {\n introductory: {\n price: 'Rp. 10.000',\n description: 'untuk 1 bulan pertama',\n duration: '',\n },\n default: {\n price: '',\n description: 'Berlangganan lebih mudah dengan Google',\n duration: '',\n },\n },\n },\n payment: {\n desktop: [\n {\n name: 'gopay',\n link: `https://cdn-www.cloudfront.net/paywall-asset/gopay${this.darkUrl}.svg`,\n },\n {\n name: 'ovo',\n link: `https://cdn-www.cloudfront.net/paywall-asset/ovo${this.darkUrl}.svg`,\n },\n {\n name: 'mastercard',\n link: `https://cdn-www.cloudfront.net/paywall-asset/mastercard${this.darkUrl}.svg`,\n },\n {\n name: 'bri',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bri${this.darkUrl}.svg`,\n },\n {\n name: 'bcaklikpay',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bca-klik-pay${this.darkUrl}.svg`,\n },\n {\n name: 'indomaret',\n link: `https://cdn-www.cloudfront.net/paywall-asset/indomaret${this.darkUrl}.svg`,\n },\n {\n name: 'jcb',\n link: `https://cdn-www.cloudfront.net/paywall-asset/jcb${this.darkUrl}.svg`,\n },\n {\n name: 'dana',\n link: `https://cdn-www.cloudfront.net/paywall-asset/dana${this.darkUrl}.svg`,\n },\n {\n name: 'visa',\n link: `https://cdn-www.cloudfront.net/paywall-asset/visa${this.darkUrl}.svg`,\n },\n {\n name: 'mandiri',\n link: `https://cdn-www.cloudfront.net/paywall-asset/mandiri${this.darkUrl}.svg`,\n },\n {\n name: 'bca',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bca${this.darkUrl}.svg`,\n },\n {\n name: 'bni',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bni${this.darkUrl}.svg`,\n },\n {\n name: 'akulaku',\n link: `https://cdn-www.cloudfront.net/paywall-asset/akulaku${this.darkUrl}.svg`,\n },\n ],\n mobile: [\n {\n name: 'gopay',\n link: `https://cdn-www.cloudfront.net/paywall-asset/gopay${this.darkUrl}.svg`,\n },\n {\n name: 'ovo',\n link: `https://cdn-www.cloudfront.net/paywall-asset/ovo${this.darkUrl}.svg`,\n },\n {\n name: 'visa',\n link: `https://cdn-www.cloudfront.net/paywall-asset/visa${this.darkUrl}.svg`,\n },\n {\n name: 'mastercard',\n link: `https://cdn-www.cloudfront.net/paywall-asset/mastercard${this.darkUrl}.svg`,\n },\n ],\n ekstension: [\n {\n name: 'dana',\n link: `https://cdn-www.cloudfront.net/paywall-asset/dana${this.darkUrl}.svg`,\n },\n {\n name: 'mandiri',\n link: `https://cdn-www.cloudfront.net/paywall-asset/mandiri${this.darkUrl}.svg`,\n },\n {\n name: 'bri',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bri${this.darkUrl}.svg`,\n },\n {\n name: 'bcaklikpay',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bca-klik-pay${this.darkUrl}.svg`,\n },\n {\n name: 'akulaku',\n link: `https://cdn-www.cloudfront.net/paywall-asset/akulaku${this.darkUrl}.svg`,\n },\n {\n name: 'bni',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bni${this.darkUrl}.svg`,\n },\n {\n name: 'indomaret',\n link: `https://cdn-www.cloudfront.net/paywall-asset/indomaret${this.darkUrl}.svg`,\n },\n {\n name: 'bca',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bca${this.darkUrl}.svg`,\n },\n {\n name: 'jcb',\n link: `https://cdn-www.cloudfront.net/paywall-asset/jcb${this.darkUrl}.svg`,\n },\n ],\n },\n }\n\n get darkUrl() {\n return this.theme === 'dark' ? '-dark' : ''\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this.getPaywallData()\n }\n\n async getPaywallData() {\n try {\n const response = await fetch(\n 'https://cdn-www.kompas.id/web-component/paywall.json'\n )\n const json = await response.json()\n this.paywallData = {\n ...this.mockResult,\n informations: {\n ...this.mockResult.informations,\n title: json[this.type].head,\n description: json[this.type].content,\n },\n packages: {\n ...this.mockResult.packages,\n memberships: json[this.type].memberships,\n swgEnable: json[this.type].swgEnable,\n freeTrial: json[this.type].freeTrial,\n swgContent: json[this.type].swgContent,\n },\n }\n } catch (error) {\n throw Error('Failed to get paywall data')\n } finally {\n this.isLoading = false\n }\n }\n\n private transitionBox() {\n return html`\n <div\n class=\"h-20 ${this.theme === 'dark'\n ? 'transparent-linear-dark'\n : 'transparent-linear'} -mt-24 z-0 w-full\"\n ></div>\n `\n }\n\n private renderEpaperPaywallSection() {\n return html`<kompasid-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n ?swgEnable=${this.swgEnable}\n tracker_content_type=${this.tracker_content_type}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompasid-paywall-body>`\n }\n\n private renderRegularPaywallSection() {\n const defaultHeaderText: string =\n this.paywallData.informations.meterred.maxQuotaMessage\n if (this.isWithHeader) {\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompasid-paywall-information-header\n text=${this.textHeader || defaultHeaderText}\n theme=${this.theme}\n ></kompasid-paywall-information-header>\n <kompasid-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this\n .paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this\n .tracker_metered_wall_balance}\n tracker_content_type=${this.tracker_content_type}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompasid-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompasid-paywall-body\n tracker_content_type=${this.tracker_content_type}\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompasid-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n\n private renderAudioPaywallSection() {\n const defaultHeaderText: string =\n this.paywallData.informations.meterred.maxQuotaMessage\n if (this.isWithHeader) {\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompasid-paywall-information-header\n text=${this.textHeader || defaultHeaderText}\n theme=${this.theme}\n ></kompasid-paywall-information-header>\n <kompasid-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this\n .paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this\n .tracker_metered_wall_balance}\n tracker_content_type=${this.tracker_content_type}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n .togglePaywall=${() => this.togglePaywall()}\n ></kompasid-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompasid-paywall-body\n tracker_content_type=${this.tracker_content_type}\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n .togglePaywall=${() => this.togglePaywall()}\n ></kompasid-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n\n private selectorTypePaywall = (type: PaywallType) => {\n switch (type) {\n case 'epaper':\n return this.renderEpaperPaywallSection()\n case 'audio':\n return this.renderAudioPaywallSection()\n case 'reguler':\n return this.renderRegularPaywallSection()\n default:\n return this.renderRegularPaywallSection()\n }\n }\n\n private togglePaywall() {\n this.isOpen = !this.isOpen\n }\n\n render() {\n return !this.isLoading && this.isOpen\n ? html`\n <div class=\"relative w-full\">\n ${this.selectorTypePaywall(this.type)}\n </div>\n `\n : nothing\n }\n}\n"]}
1
+ {"version":3,"file":"KompasPaywall.js","sourceRoot":"","sources":["../../../../src/components/kompasid-paywall/KompasPaywall.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement, nothing } from 'lit'\nimport { property, state, customElement } from 'lit/decorators.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { PaywallProduct, PaywallType } from './types.js'\nimport '../kompasid-paywall-body/KompasPaywallBody.js'\nimport '../kompasid-paywall-banner-registration/KompasPaywallBannerRegistration.js'\nimport '../kompasid-paywall-information-header/KompasPaywallInformationHeader.js'\n\n@customElement('kompasid-paywall')\nexport class KompasPaywall extends LitElement {\n static styles = [\n css`\n :host {\n font-family: 'PT Sans', sans-serif;\n }\n\n .transparent-linear {\n background-image: -webkit-gradient(\n linear,\n left top,\n left bottom,\n from(hsla(0, 0%, 100%, 0)),\n to(#fff)\n );\n background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0), #fff);\n }\n\n .transparent-linear-dark {\n background-image: -webkit-gradient(\n linear,\n left top,\n left bottom,\n from(hsla(0, 0%, 18%, 0)),\n to(#121212)\n );\n background-image: linear-gradient(180deg, hsla(0, 0%, 18%, 0), #121212);\n }\n `,\n TWStyles,\n ]\n\n /**\n * Props\n */\n /**\n * property isLogin untuk menghandle apakah user sudah login atau belum\n * property countdownArticle untuk menghandle count artikel\n * property type untuk menghandle tipe epaper\n * property isWithHeader untuk menghandle paywall information header\n * property textHeader digunakan sebagai text pada paywall information header\n * property paywallData untuk menghandle data paywall\n * property userGuid untuk menghandle user Guid\n * property subscriptionStatus untuk menghandle status subscription user\n * property swgEnable untuk menghandle swg apakah di aktifkan atau tidak\n * property paywall_location = The location where user encounter the paywall\n * property paywall_subscription_package = The name of the subscription package viewed by user\n * property paywall_subscription_id = The ID of the subscription package viewed by user\n * property paywall_subscription_price = The price of the subscriprtion package viewed by user\n * property paywall_position = The position of the subscription package viewed by user\n * property page_type = Type of the page\n * property content_id = ID of article (slug)\n * property content_type = Whether it's free article or paid article\n * property content_title = The title of article\n * property tracker_content_categories = The category of the content\n * property user_type = Type of user based on their subscription\n * property subscription_status = Status of their subscription\n * property page_domain = Page Domain\n * property metered_wall_type = The type of Metered Wall\n * property metered_wall_balance = The balance of their metered wall\n * property epaper_edition = The edition of epaper viewed by user\n * property theme = The theme of the paywall component\n */\n\n @state() private paywallData: PaywallProduct = {} as PaywallProduct\n @state() private isOpen: Boolean = true\n @state() private isLoading: Boolean = true\n\n @property({ type: Boolean }) isLogin = false\n @property({ type: Number }) countdownArticle = 0\n @property({ type: String }) type: PaywallType = 'reguler'\n @property({ type: Boolean }) isWithHeader = false\n @property({ type: String }) textHeader = ''\n @property({ type: String }) userGuid = ''\n @property({ type: String }) subscriptionStatus = ''\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 }) tracker_content_publisher = ''\n @property({ type: String }) theme = ''\n\n mockResult: PaywallProduct = {\n informations: {\n title: '',\n description: [],\n register: {\n img: 'https://www.kompas.id/img/backgrounds/ilustrasi-banner-registration.png',\n title: 'Ingin Membaca Artikel Ini Secara Utuh?',\n subtitle: 'Daftar akun untuk membaca 5 artikel premium secara gratis ',\n label: 'Daftar Sekarang ',\n },\n meterred: {\n maxQuota: 5,\n label: 'Langganan',\n maxQuotaMessage: 'Akses artikel gratis Anda bulan ini sudah habis.',\n url: 'https://kompas.id/berlangganan',\n },\n cta: {\n show: true,\n text: 'Lihat Paket Lainnya',\n url: 'https://www.kompas.id/berlangganan/v2',\n },\n },\n packages: {\n title: 'Sekali bayar, tanpa perpanjang otomatis',\n memberships: [],\n swgEnable: false,\n freeTrial: {\n packageText: 'untuk 3 hari pertama',\n desktopText:\n 'Coba gratis 3 hari Kompas.id melalui aplikasi. Pindai kode QR dengan ponsel atau tablet untuk mengunduh aplikasi.',\n mobileText:\n 'Dapatkan akses gratis selama 3 hari ke konten dan fitur premium Kompas.id di aplikasi.',\n },\n swgContent: {\n introductory: {\n price: 'Rp. 10.000',\n description: 'untuk 1 bulan pertama',\n duration: '',\n },\n default: {\n price: '',\n description: 'Berlangganan lebih mudah dengan Google',\n duration: '',\n },\n },\n },\n payment: {\n desktop: [\n {\n name: 'gopay',\n link: `https://cdn-www.cloudfront.net/paywall-asset/gopay${this.darkUrl}.svg`,\n },\n {\n name: 'ovo',\n link: `https://cdn-www.cloudfront.net/paywall-asset/ovo${this.darkUrl}.svg`,\n },\n {\n name: 'mastercard',\n link: `https://cdn-www.cloudfront.net/paywall-asset/mastercard${this.darkUrl}.svg`,\n },\n {\n name: 'bri',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bri${this.darkUrl}.svg`,\n },\n {\n name: 'bcaklikpay',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bca-klik-pay${this.darkUrl}.svg`,\n },\n {\n name: 'indomaret',\n link: `https://cdn-www.cloudfront.net/paywall-asset/indomaret${this.darkUrl}.svg`,\n },\n {\n name: 'jcb',\n link: `https://cdn-www.cloudfront.net/paywall-asset/jcb${this.darkUrl}.svg`,\n },\n {\n name: 'dana',\n link: `https://cdn-www.cloudfront.net/paywall-asset/dana${this.darkUrl}.svg`,\n },\n {\n name: 'visa',\n link: `https://cdn-www.cloudfront.net/paywall-asset/visa${this.darkUrl}.svg`,\n },\n {\n name: 'mandiri',\n link: `https://cdn-www.cloudfront.net/paywall-asset/mandiri${this.darkUrl}.svg`,\n },\n {\n name: 'bca',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bca${this.darkUrl}.svg`,\n },\n {\n name: 'bni',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bni${this.darkUrl}.svg`,\n },\n {\n name: 'akulaku',\n link: `https://cdn-www.cloudfront.net/paywall-asset/akulaku${this.darkUrl}.svg`,\n },\n ],\n mobile: [\n {\n name: 'gopay',\n link: `https://cdn-www.cloudfront.net/paywall-asset/gopay${this.darkUrl}.svg`,\n },\n {\n name: 'ovo',\n link: `https://cdn-www.cloudfront.net/paywall-asset/ovo${this.darkUrl}.svg`,\n },\n {\n name: 'visa',\n link: `https://cdn-www.cloudfront.net/paywall-asset/visa${this.darkUrl}.svg`,\n },\n {\n name: 'mastercard',\n link: `https://cdn-www.cloudfront.net/paywall-asset/mastercard${this.darkUrl}.svg`,\n },\n ],\n ekstension: [\n {\n name: 'dana',\n link: `https://cdn-www.cloudfront.net/paywall-asset/dana${this.darkUrl}.svg`,\n },\n {\n name: 'mandiri',\n link: `https://cdn-www.cloudfront.net/paywall-asset/mandiri${this.darkUrl}.svg`,\n },\n {\n name: 'bri',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bri${this.darkUrl}.svg`,\n },\n {\n name: 'bcaklikpay',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bca-klik-pay${this.darkUrl}.svg`,\n },\n {\n name: 'akulaku',\n link: `https://cdn-www.cloudfront.net/paywall-asset/akulaku${this.darkUrl}.svg`,\n },\n {\n name: 'bni',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bni${this.darkUrl}.svg`,\n },\n {\n name: 'indomaret',\n link: `https://cdn-www.cloudfront.net/paywall-asset/indomaret${this.darkUrl}.svg`,\n },\n {\n name: 'bca',\n link: `https://cdn-www.cloudfront.net/paywall-asset/bca${this.darkUrl}.svg`,\n },\n {\n name: 'jcb',\n link: `https://cdn-www.cloudfront.net/paywall-asset/jcb${this.darkUrl}.svg`,\n },\n ],\n },\n }\n\n get darkUrl() {\n return this.theme === 'dark' ? '-dark' : ''\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this.getPaywallData()\n }\n\n async getPaywallData() {\n try {\n const response = await fetch(\n 'https://cdn-www.kompas.id/web-component/paywall.json'\n )\n const json = await response.json()\n const listType = [\n 'reguler',\n 'audio',\n 'proMiningOutlook',\n 'proMiningArticle',\n 'epaper',\n 'custom',\n ]\n const findTypeOnTheList = listType.includes(this.type)\n const defaultType = findTypeOnTheList ? this.type : 'reguler'\n this.paywallData = {\n ...this.mockResult,\n informations: {\n ...this.mockResult.informations,\n title: json[defaultType].head,\n description: json[defaultType].content,\n cta: json[defaultType].cta,\n },\n packages: {\n ...this.mockResult.packages,\n memberships: json[defaultType].memberships,\n swgEnable: json[defaultType].swgEnable,\n freeTrial: json[defaultType].freeTrial,\n swgContent: json[defaultType].swgContent,\n },\n }\n } catch (error) {\n throw Error('Failed to get paywall data')\n } finally {\n this.isLoading = false\n }\n }\n\n private transitionBox() {\n return html`\n <div\n class=\"h-20 ${this.theme === 'dark'\n ? 'transparent-linear-dark'\n : 'transparent-linear'} -mt-24 z-0 w-full\"\n ></div>\n `\n }\n\n private renderEpaperPaywallSection() {\n return html`<kompasid-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n tracker_content_publisher=${this.tracker_content_publisher}\n ?swgEnable=${this.swgEnable}\n tracker_content_type=${this.tracker_content_type}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompasid-paywall-body>`\n }\n\n private renderRegularPaywallSection() {\n const defaultHeaderText: string =\n this.paywallData.informations.meterred.maxQuotaMessage\n if (this.isWithHeader) {\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompasid-paywall-information-header\n text=${this.textHeader || defaultHeaderText}\n theme=${this.theme}\n ></kompasid-paywall-information-header>\n <kompasid-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this\n .paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this\n .tracker_metered_wall_balance}\n tracker_content_type=${this.tracker_content_type}\n tracker_content_publisher=${this.tracker_content_publisher}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompasid-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompasid-paywall-body\n tracker_content_type=${this.tracker_content_type}\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n tracker_content_publisher=${this.tracker_content_publisher}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n ></kompasid-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n\n private renderAudioPaywallSection() {\n const defaultHeaderText: string =\n this.paywallData.informations.meterred.maxQuotaMessage\n if (this.isWithHeader) {\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompasid-paywall-information-header\n text=${this.textHeader || defaultHeaderText}\n theme=${this.theme}\n ></kompasid-paywall-information-header>\n <kompasid-paywall-body\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this\n .paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_metered_wall_balance=${this\n .tracker_metered_wall_balance}\n tracker_content_type=${this.tracker_content_type}\n tracker_content_publisher=${this.tracker_content_publisher}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n .togglePaywall=${() => this.togglePaywall()}\n ></kompasid-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n return html`\n <div>\n ${this.transitionBox()}\n <div\n class=\"flex flex-col ${this.theme === 'dark'\n ? 'bg-dark-5'\n : 'bg-white'} items-center justify-center mx-4 md:mx-0\"\n >\n <div class=\"flex flex-col w-full max-w-screen-md my-5\">\n <kompasid-paywall-body\n tracker_content_type=${this.tracker_content_type}\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this.paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_epaper_edition=${this.tracker_epaper_edition}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_metered_wall_balance=${this.tracker_metered_wall_balance}\n tracker_content_publisher=${this.tracker_content_publisher}\n ?swgEnable=${this.swgEnable}\n ?isLogin=${this.isLogin}\n type=${this.type}\n countdownArticle=${this.countdownArticle}\n .paywallData=${this.paywallData}\n subscriptionStatus=${this.subscriptionStatus}\n userGuid=${this.userGuid}\n theme=${this.theme}\n .togglePaywall=${() => this.togglePaywall()}\n ></kompasid-paywall-body>\n </div>\n </div>\n </div>\n `\n }\n\n private selectorTypePaywall = (type: PaywallType) => {\n switch (type) {\n case 'epaper':\n case 'proMiningArticle':\n case 'proMiningOutlook':\n return this.renderEpaperPaywallSection()\n case 'audio':\n return this.renderAudioPaywallSection()\n case 'reguler':\n return this.renderRegularPaywallSection()\n default:\n return this.renderRegularPaywallSection()\n }\n }\n\n private togglePaywall() {\n this.isOpen = !this.isOpen\n }\n\n render() {\n return !this.isLoading && this.isOpen\n ? html`\n <div class=\"relative w-full\">\n ${this.selectorTypePaywall(this.type)}\n </div>\n `\n : nothing\n }\n}\n"]}
package/dist/src/components/kompasid-paywall/types.d.ts CHANGED
@@ -58,12 +58,18 @@ export interface Packages {
58
58
  freeTrial: FreeTrial;
59
59
  swgContent: SwgContent;
60
60
  }
61
+ export interface ctaPaywall {
62
+ show: boolean;
63
+ text: string;
64
+ url: string;
65
+ }
61
66
  export interface PaywallProduct {
62
67
  informations: {
63
68
  title: string;
64
69
  description: Array<string>;
65
70
  register: Registration;
66
71
  meterred: Metered;
72
+ cta: ctaPaywall;
67
73
  };
68
74
  packages: Packages;
69
75
  payment: {
@@ -72,4 +78,4 @@ export interface PaywallProduct {
72
78
  ekstension: Array<PaymentImage>;
73
79
  };
74
80
  }
75
- export type PaywallType = 'epaper' | 'reguler' | 'audio' | 'custom';
81
+ export type PaywallType = 'proMiningArticle' | 'proMiningOutlook' | 'epaper' | 'reguler' | 'audio' | 'custom';
package/dist/src/components/kompasid-paywall/types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/kompasid-paywall/types.ts"],"names":[],"mappings":"","sourcesContent":["export interface Product {\n title: string\n percentage: number\n price: number\n discountPrice: number\n savingPrice: number\n periode: string\n isHighlight: boolean\n url: string\n package: string\n subscriptionId: string\n position: number\n}\nexport interface Metered {\n maxQuota: number\n label: string\n maxQuotaMessage: string\n url: string\n}\nexport interface PaymentImage {\n name: string\n link: string\n}\nexport interface Registration {\n img: string\n title: string\n subtitle: string\n label: string\n}\nexport interface Informations {\n title: string\n description: Array<string>\n register: {\n img: string\n title: string\n subtitle: string\n label: string\n }\n}\nexport interface FreeTrial {\n packageText: string\n desktopText: string\n mobileText: string\n}\nexport interface SwgContentData {\n duration: string\n price: string\n description: string\n}\n\nexport interface SwgContent {\n introductory: SwgContentData\n default: SwgContentData\n}\n\nexport interface Packages {\n title: string\n memberships: Array<Product>\n swgEnable: boolean\n freeTrial: FreeTrial\n swgContent: SwgContent\n}\n\nexport interface PaywallProduct {\n informations: {\n title: string\n description: Array<string>\n register: Registration\n meterred: Metered\n }\n packages: Packages\n payment: {\n desktop: Array<PaymentImage>\n mobile: Array<PaymentImage>\n ekstension: Array<PaymentImage>\n }\n}\nexport type PaywallType = 'epaper' | 'reguler' | 'audio' | 'custom'\n"]}
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/kompasid-paywall/types.ts"],"names":[],"mappings":"","sourcesContent":["export interface Product {\n title: string\n percentage: number\n price: number\n discountPrice: number\n savingPrice: number\n periode: string\n isHighlight: boolean\n url: string\n package: string\n subscriptionId: string\n position: number\n}\nexport interface Metered {\n maxQuota: number\n label: string\n maxQuotaMessage: string\n url: string\n}\nexport interface PaymentImage {\n name: string\n link: string\n}\nexport interface Registration {\n img: string\n title: string\n subtitle: string\n label: string\n}\nexport interface Informations {\n title: string\n description: Array<string>\n register: {\n img: string\n title: string\n subtitle: string\n label: string\n }\n}\nexport interface FreeTrial {\n packageText: string\n desktopText: string\n mobileText: string\n}\nexport interface SwgContentData {\n duration: string\n price: string\n description: string\n}\n\nexport interface SwgContent {\n introductory: SwgContentData\n default: SwgContentData\n}\n\nexport interface Packages {\n title: string\n memberships: Array<Product>\n swgEnable: boolean\n freeTrial: FreeTrial\n swgContent: SwgContent\n}\n\nexport interface ctaPaywall {\n show: boolean\n text: string\n url: string\n}\n\nexport interface PaywallProduct {\n informations: {\n title: string\n description: Array<string>\n register: Registration\n meterred: Metered\n cta: ctaPaywall\n }\n packages: Packages\n payment: {\n desktop: Array<PaymentImage>\n mobile: Array<PaymentImage>\n ekstension: Array<PaymentImage>\n }\n}\nexport type PaywallType =\n | 'proMiningArticle'\n | 'proMiningOutlook'\n | 'epaper'\n | 'reguler'\n | 'audio'\n | 'custom'\n"]}
package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.d.ts CHANGED
@@ -56,6 +56,7 @@ export declare class KompasIdPaywallBody extends LitElement {
56
56
  tracker_metered_wall_type: string;
57
57
  tracker_metered_wall_balance: number;
58
58
  tracker_epaper_edition: string;
59
+ tracker_content_publisher: string;
59
60
  theme: string;
60
61
  togglePaywall: () => void;
61
62
  /**
@@ -124,7 +125,7 @@ export declare class KompasIdPaywallBody extends LitElement {
124
125
  */
125
126
  private headerSection;
126
127
  private descriptionSection;
127
- private informationPackages;
128
+ private ctaPackages;
128
129
  private epaperRegistrationSection;
129
130
  private regulerRegistrationSection;
130
131
  private registrationSection;