@kompasid/lit-web-components 0.9.3 → 0.9.10

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 (34) hide show
  1. package/.yarnrc.yml +1 -0
  2. package/demo/index.html +6 -1
  3. package/dist/assets/font-awesome.d.ts +2 -2
  4. package/dist/src/components/kompasid-footer/KompasFooter.d.ts +1 -1
  5. package/dist/src/components/kompasid-freewall/KompasFreewall.d.ts +1 -1
  6. package/dist/src/components/kompasid-freewall-body/KompasFreewallBody.d.ts +1 -1
  7. package/dist/src/components/kompasid-freewall-head/KompasFreewallHead.d.ts +1 -1
  8. package/dist/src/components/kompasid-grace-period/KompasGracePeriod.d.ts +1 -1
  9. package/dist/src/components/kompasid-header-account/KompasHeaderAccount.d.ts +1 -1
  10. package/dist/src/components/kompasid-header-account-help-center/KompasHeaderAccountHelpCenter.d.ts +1 -1
  11. package/dist/src/components/kompasid-header-account-menu/KompasHeaderAccountMenu.d.ts +1 -1
  12. package/dist/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.d.ts +1 -1
  13. package/dist/src/components/kompasid-header-notification/KompasHeaderNotification.d.ts +1 -1
  14. package/dist/src/components/kompasid-menu-side-bar/KompasMenuSideBar.d.ts +6 -2
  15. package/dist/src/components/kompasid-menu-side-bar/KompasMenuSideBar.js +67 -31
  16. package/dist/src/components/kompasid-menu-side-bar/KompasMenuSideBar.js.map +1 -1
  17. package/dist/src/components/kompasid-metered-paywall/KompasMeteredPaywall.d.ts +1 -1
  18. package/dist/src/components/kompasid-metered-wall-register/KompasMeteredWallRegister.d.ts +1 -1
  19. package/dist/src/components/kompasid-paywall/KompasPaywall.d.ts +1 -1
  20. package/dist/src/components/kompasid-paywall-banner-registration/KompasPaywallBannerRegistration.d.ts +1 -1
  21. package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.d.ts +1 -1
  22. package/dist/src/components/kompasid-paywall-information-header/KompasPaywallInformationHeader.d.ts +1 -1
  23. package/dist/src/components/kompasid-paywall-video/KompasPaywallVideo.d.ts +1 -1
  24. package/dist/src/components/kompasid-widget-recirculations-default/KompasWidgetRecirculationsDefault.d.ts +3 -3
  25. package/dist/src/components/kompasid-widget-recirculations-list/KompasWidgetRecirculationsList.d.ts +2 -2
  26. package/dist/src/utils/IntersectionObserver.d.ts +1 -1
  27. package/dist/tailwind/tailwind.js +223 -211
  28. package/dist/tailwind/tailwind.js.map +1 -1
  29. package/dist/tsconfig.tsbuildinfo +1 -1
  30. package/package.json +1 -1
  31. package/src/components/kompasid-menu-side-bar/KompasMenuSideBar.ts +102 -36
  32. package/src/components/kompasid-menu-side-bar/readme.md +27 -0
  33. package/tailwind/tailwind.css +219 -203
  34. package/tailwind/tailwind.ts +223 -211
package/.yarnrc.yml ADDED
@@ -0,0 +1 @@
1
+ nodeLinker: node-modules
package/demo/index.html CHANGED
@@ -197,7 +197,12 @@
197
197
  apiSlug="popular-article"
198
198
  >
199
199
  </kompasid-widget-recirculations-list>
200
- <kompasid-menu-side-bar></kompasid-menu-side-bar>
200
+ <div style="justify-content: space-between; display: flex; width: 100%;">
201
+ <kompasid-menu-side-bar></kompasid-menu-side-bar>
202
+ <kompasid-menu-side-bar>
203
+ <button>Slot ini</button>
204
+ </kompasid-menu-side-bar>
205
+ </div>
201
206
 
202
207
  <kompasid-widget-recirculations-list
203
208
  widgetTitle="Terbaru"
@@ -1,2 +1,2 @@
1
- export declare const faArrowLeft: import("lit").TemplateResult<1>;
2
- export declare const faCheck: () => import("lit").TemplateResult<1>;
1
+ export declare const faArrowLeft: import("lit-html").TemplateResult<1>;
2
+ export declare const faCheck: () => import("lit-html").TemplateResult<1>;
@@ -8,5 +8,5 @@ export declare class KompasFooter extends LitElement {
8
8
  private initializeFooter;
9
9
  fetchFooter(): Promise<void>;
10
10
  getYear(): number;
11
- render(): import("lit").TemplateResult<1>;
11
+ render(): import("lit-html").TemplateResult<1>;
12
12
  }
@@ -92,5 +92,5 @@ export declare class KompasFreewall extends LitElement {
92
92
  /**
93
93
  * Render Statement
94
94
  */
95
- render(): import("lit").TemplateResult<1> | typeof nothing;
95
+ render(): import("lit-html").TemplateResult<1> | typeof nothing;
96
96
  }
@@ -30,5 +30,5 @@ export declare class KompasFreewallBody extends LitElement {
30
30
  /**
31
31
  * Render Statement
32
32
  */
33
- render(): import("lit").TemplateResult<1>;
33
+ render(): import("lit-html").TemplateResult<1>;
34
34
  }
@@ -34,5 +34,5 @@ export declare class KompasFreewallHead extends LitElement {
34
34
  /**
35
35
  * Render Statement
36
36
  */
37
- render(): import("lit").TemplateResult<1>;
37
+ render(): import("lit-html").TemplateResult<1>;
38
38
  }
@@ -64,5 +64,5 @@ export declare class KompasGracePeriod extends LitElement {
64
64
  private dataLayeronGracePeriod;
65
65
  private gracePeriodTemplate;
66
66
  connectedCallback(): Promise<void>;
67
- render(): import("lit").TemplateResult<1>;
67
+ render(): import("lit-html").TemplateResult<1>;
68
68
  }
@@ -43,5 +43,5 @@ export declare class KompasHeaderAccount extends LitElement {
43
43
  private account;
44
44
  private accountSidebar;
45
45
  connectedCallback(): Promise<void>;
46
- render(): import("lit").TemplateResult<1>;
46
+ render(): import("lit-html").TemplateResult<1>;
47
47
  }
@@ -9,5 +9,5 @@ export declare class KompasHeaderAccountHelpCenter extends LitElement {
9
9
  private email;
10
10
  private workingHour;
11
11
  connectedCallback(): Promise<void>;
12
- render(): import("lit").TemplateResult<1>;
12
+ render(): import("lit-html").TemplateResult<1>;
13
13
  }
@@ -29,5 +29,5 @@ export declare class KompasHeaderAccountMenu extends LitElement {
29
29
  readLaterUrl: string;
30
30
  private renderTotalBubble;
31
31
  connectedCallback(): Promise<void>;
32
- render(): import("lit").TemplateResult<1>;
32
+ render(): import("lit-html").TemplateResult<1>;
33
33
  }
@@ -37,5 +37,5 @@ export declare class KompasHeaderAccountProfile extends LitElement {
37
37
  private renderSkeletonLoading;
38
38
  private renderProfileContent;
39
39
  connectedCallback(): Promise<void>;
40
- render(): import("lit").TemplateResult<1>;
40
+ render(): import("lit-html").TemplateResult<1>;
41
41
  }
@@ -43,5 +43,5 @@ export declare class KompasHeaderNotification extends LitElement {
43
43
  private notificationPopup;
44
44
  private getParamsData;
45
45
  private pushDataLayer;
46
- render(): import("lit").TemplateResult<1>;
46
+ render(): import("lit-html").TemplateResult<1>;
47
47
  }
@@ -43,13 +43,17 @@ interface DataSideBarLink {
43
43
  category: dataType[];
44
44
  }
45
45
  export declare class KompasMenuSideBar extends LitElement {
46
+ hasSlotContent: boolean;
47
+ shadowRoot: any;
48
+ firstUpdated(): void;
46
49
  static styles: import("lit").CSSResult[];
47
50
  dataExternal: DataExternalLink[];
51
+ isDark: boolean;
48
52
  connectedCallback(): Promise<void>;
49
53
  handleFetchError(error: unknown): void;
50
54
  dataSidebar: DataSideBarLink;
51
55
  fetchExternal(): Promise<void>;
52
- renderChips(): import("lit").TemplateResult<1>[];
56
+ renderChips(): import("lit-html").TemplateResult<1>[];
53
57
  hasChildren(item: any): boolean;
54
58
  rubricClicked(item: {
55
59
  name: string;
@@ -59,6 +63,6 @@ export declare class KompasMenuSideBar extends LitElement {
59
63
  private toggleChildren;
60
64
  private showNavBar;
61
65
  toggleNavSidebar: (e: Event) => void;
62
- render(): import("lit").TemplateResult<1>;
66
+ render(): import("lit-html").TemplateResult<1>;
63
67
  }
64
68
  export {};
@@ -10,7 +10,9 @@ import { timedContent } from '../../utils/timedContent.js';
10
10
  let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
11
11
  constructor() {
12
12
  super(...arguments);
13
+ this.hasSlotContent = false;
13
14
  this.dataExternal = [];
15
+ this.isDark = false;
14
16
  this.dataSidebar = {
15
17
  feature: [],
16
18
  category: [],
@@ -22,7 +24,13 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
22
24
  this.showNavBar = !this.showNavBar;
23
25
  };
24
26
  }
25
- // @property({ type: Array }) dataSidebar: DataSideBarLink[] = []
27
+ firstUpdated() {
28
+ var _a;
29
+ const slot = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
30
+ const assignedNodes = slot.assignedNodes({ flatten: true });
31
+ this.hasSlotContent = assignedNodes.length > 0;
32
+ console.log('Slot content exists?', this.hasSlotContent);
33
+ }
26
34
  async connectedCallback() {
27
35
  super.connectedCallback();
28
36
  try {
@@ -162,10 +170,12 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
162
170
  chips.push(html `
163
171
  <div class="flex">
164
172
  <div
165
- class="py-1 px-2 rounded text-xs"
166
- style="position: absolute; top: -22px; right: -24px; display: inline-flex; background-color:#D71920;"
173
+ class="py-0.5 px-1.5 rounded-full"
174
+ style="position: relative; display: inline-flex; background-color:#D71920;"
167
175
  >
168
- <span class="font-normal text-white capitalize">Baru</span>
176
+ <span class="font-bold font-pt-sans text-xs text-white capitalize"
177
+ >Baru</span
178
+ >
169
179
  </div>
170
180
  </div>
171
181
  `);
@@ -193,13 +203,26 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
193
203
  class="w-fit flex items-center justify-center cursor-pointer relative"
194
204
  @click=${this.toggleNavSidebar}
195
205
  >
196
- <div class="h-4 inline-flex text-brand-1">
197
- ${unsafeSVG(getFontAwesomeIcon('fas', 'bars'))}
198
- </div>
199
- <span
200
- class="font-sans hidden sm:inline ml-2 tracking-wide text-brand-1 font-bold"
201
- >Menu</span
202
- >
206
+ <slot></slot>
207
+ ${!this.hasSlotContent
208
+ ? html `
209
+ <div
210
+ class="h-4 inline-flex ${this.isDark
211
+ ? 'text-[#FFFFFF]'
212
+ : 'text-brand-1'}"
213
+ >
214
+ ${unsafeSVG(getFontAwesomeIcon('fas', 'bars'))}
215
+ </div>
216
+ <span
217
+ class="font-pt-sans hidden sm:inline ml-2 tracking-wide font-bold ${this
218
+ .isDark
219
+ ? 'text-[#FFFFFF]'
220
+ : 'text-brand-1'}"
221
+ >
222
+ Menu
223
+ </span>
224
+ `
225
+ : ''}
203
226
  </div>
204
227
  <!-- Side Menu -->
205
228
  <nav
@@ -214,7 +237,7 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
214
237
  style="width: 312px;"
215
238
  >
216
239
  <div
217
- class="bg-[#e1f0ff] flex flex-col items-center justify-center mb-6 w-full"
240
+ class="bg-[#FFFFFF] flex flex-col items-center justify-center mb-6 w-full"
218
241
  >
219
242
  <div
220
243
  ref="logo-kompas"
@@ -229,36 +252,46 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
229
252
  />
230
253
  </a>
231
254
  <span
232
- class="bg-[#93c8fd] text-brand-1 cursor-pointer flex h-10 items-center justify-center rounded text-base w-10 p-4"
255
+ class="bg-[#E1F0FF] text-brand-1 cursor-pointer flex h-10 items-center justify-center rounded text-base w-10 py-4"
233
256
  @click=${this.toggleNavSidebar}
234
257
  >
235
- ${unsafeSVG(getFontAwesomeIcon('fa', 'times'))}
258
+ ${unsafeSVG(getFontAwesomeIcon('fa', 'times', 12, 12))}
236
259
  </span>
237
260
  </div>
238
261
  <div class="flex flex-wrap px-4 w-full">
239
262
  ${this.dataExternal.map(item => html `
240
- <a href="${item.url}" class="block w-1/2 no-underline">
241
- <div class="cursor-pointer flex items-center pb-6 w-full">
242
- <div class="flex mr-2 text-brand-1">
243
- ${item.icon &&
263
+ <a href="${item.url}" class="flex w-1/2 no-underline">
264
+ <div
265
+ class="cursor-pointer flex items-center pb-4 w-[312px]"
266
+ >
267
+ ${item.icon &&
244
268
  Array.isArray(item.icon) &&
245
269
  item.icon.length >= 2
246
- ? unsafeSVG(getFontAwesomeIcon(item.icon[0], item.icon[1]))
270
+ ? html `
271
+ <div class="flex mr-2 text-brand-1">
272
+ ${unsafeSVG(getFontAwesomeIcon(item.icon[0], item.icon[1]))}
273
+ </div>
274
+ `
247
275
  : ''}
248
- </div>
249
- <span class="font-sans relative text-sm text-brand-1">
250
- ${item.name} ${item.isNew ? this.renderChips() : ''}
276
+ <span
277
+ class="font-pt-sans relative text-xs text-[#666666]"
278
+ >
279
+ ${item.name}
251
280
  </span>
281
+ <div class="ml-1">
282
+ ${item.isNew ? this.renderChips() : ''}
283
+ </div>
252
284
  </div>
253
285
  </a>
254
286
  `)}
255
287
  </div>
256
288
  </div>
289
+ <div class="border-b border-[#DDD] m-6 "></div>
257
290
  <!-- feature -->
258
291
  <div class="flex">
259
292
  <div class="flex justify-between flex-col">
260
293
  ${this.dataSidebar.feature.map(item => html `
261
- <div class="w-full font-sans">
294
+ <div class="w-full font-pt-sans">
262
295
  <!-- Parent item -->
263
296
  <div
264
297
  class="flex items-center justify-between px-4 text-sm font-medium text-gray-700 transition-all cursor-pointer"
@@ -275,7 +308,7 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
275
308
  ${item.icon &&
276
309
  Array.isArray(item.icon) &&
277
310
  item.icon.length >= 2
278
- ? unsafeSVG(getFontAwesomeIcon(item.icon[0], item.icon[1]))
311
+ ? unsafeSVG(getFontAwesomeIcon(item.icon[0], item.icon[1], 20, 20))
279
312
  : ''}
280
313
  </span>
281
314
  <span class="font-bold relative text-[#333] w-full"
@@ -300,8 +333,8 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
300
333
  }}
301
334
  >
302
335
  ${this.expandedSlug === item.slug
303
- ? unsafeSVG(getFontAwesomeIcon('fas', 'chevron-up'))
304
- : unsafeSVG(getFontAwesomeIcon('fas', 'chevron-down'))}
336
+ ? unsafeSVG(getFontAwesomeIcon('fas', 'chevron-up', 12, 12))
337
+ : unsafeSVG(getFontAwesomeIcon('fas', 'chevron-down', 12, 12))}
305
338
  </span>
306
339
  `
307
340
  : null}
@@ -341,7 +374,7 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
341
374
  <div class="flex">
342
375
  <div class="w-full flex justify-between flex-col">
343
376
  ${this.dataSidebar.category.map(item => html `
344
- <div class="w-full font-sans">
377
+ <div class="w-full font-pt-sans">
345
378
  <!-- Parent item -->
346
379
  <div
347
380
  class="flex items-center justify-between text-sm font-medium px-4 transition-all cursor-pointer"
@@ -357,7 +390,7 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
357
390
  ${item.icon &&
358
391
  Array.isArray(item.icon) &&
359
392
  item.icon.length >= 2
360
- ? unsafeSVG(getFontAwesomeIcon(item.icon[0], item.icon[1]))
393
+ ? unsafeSVG(getFontAwesomeIcon(item.icon[0], item.icon[1], 20, 20))
361
394
  : ''}
362
395
  </span>
363
396
  <span
@@ -379,15 +412,15 @@ let KompasMenuSideBar = class KompasMenuSideBar extends LitElement {
379
412
  ${this.hasChildren(item)
380
413
  ? html `
381
414
  <span
382
- class="text-xs bg-[#e1f0ff] flex justify-center items-center rounded my-1 p-4 w-10 h-10 cursor-pointer font-bold text-brand-1"
415
+ class="bg-[#e1f0ff] flex justify-center items-center rounded my-1 py-4 w-10 h-10 cursor-pointer font-bold text-brand-1"
383
416
  @click=${(e) => {
384
417
  e.stopPropagation(); // Prevents click from bubbling to parent
385
418
  this.toggleChildren(item);
386
419
  }}
387
420
  >
388
421
  ${this.expandedSlug === item.slug
389
- ? unsafeSVG(getFontAwesomeIcon('fas', 'chevron-up'))
390
- : unsafeSVG(getFontAwesomeIcon('fas', 'chevron-down'))}
422
+ ? unsafeSVG(getFontAwesomeIcon('fas', 'chevron-up', 12, 12))
423
+ : unsafeSVG(getFontAwesomeIcon('fas', 'chevron-down', 12, 12))}
391
424
  </span>
392
425
  `
393
426
  : null}
@@ -467,6 +500,9 @@ KompasMenuSideBar.styles = [
467
500
  __decorate([
468
501
  property({ type: Array })
469
502
  ], KompasMenuSideBar.prototype, "dataExternal", void 0);
503
+ __decorate([
504
+ property({ type: Boolean })
505
+ ], KompasMenuSideBar.prototype, "isDark", void 0);
470
506
  __decorate([
471
507
  state()
472
508
  ], KompasMenuSideBar.prototype, "expandedSlug", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"KompasMenuSideBar.js","sourceRoot":"","sources":["../../../../src/components/kompasid-menu-side-bar/KompasMenuSideBar.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable lit-a11y/click-events-have-key-events */\nimport { html, css, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.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\ninterface DataExternalLink {\n external?: boolean\n gtmClass?: string\n icon: object | null\n iconify: string | null\n isNew: boolean\n name: string\n url: string\n}\n\ninterface dataType {\n href: string\n external?: boolean\n icon: object | null\n iconify: string | null\n name: string\n slug: string\n redDot: [\n {\n start: string\n end: string\n }\n ]\n children: [\n {\n href: string\n external: boolean\n icon: string\n iconify: string | null\n name: string\n slug: string\n redDot: [\n {\n start: string\n end: string\n }\n ]\n }\n ]\n}\ninterface DataSideBarLink {\n feature: dataType[]\n category: dataType[]\n}\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\n .menu-menu-sidebar::-webkit-scrollbar-track {\n background: white;\n }\n\n .menu-menu-sidebar::-webkit-scrollbar-thumb {\n background-color: #00557d; /* Replace with your brand color */\n border-radius: 8px;\n }\n\n .menu-menu-sidebar::-webkit-scrollbar-button,\n .menu-menu-sidebar::-webkit-scrollbar-corner {\n background-color: white;\n }\n `,\n TWStyles,\n ]\n @property({ type: Array }) dataExternal: DataExternalLink[] = []\n // @property({ type: Array }) dataSidebar: DataSideBarLink[] = []\n\n async connectedCallback() {\n super.connectedCallback()\n try {\n await this.fetchExternal()\n } catch (error) {\n this.handleFetchError(error)\n }\n }\n handleFetchError(error: unknown) {\n const errorMessage =\n error instanceof Error ? error.message : 'Kesalahan tidak diketahui'\n alert(`Terjadi kesalahan: ${errorMessage}`)\n }\n\n dataSidebar: DataSideBarLink = {\n feature: [],\n category: [],\n }\n async fetchExternal() {\n // External\n const endpointExternal = `https://cdn-www.kompas.id/assets/json/ApiMenuExternalLink.json`\n const response = await fetch(endpointExternal, {\n headers: {\n 'Content-Type': 'application/json',\n },\n })\n const resultExternal = await response.json()\n // eslint-disable-next-line no-undef\n if (!resultExternal || !Array.isArray(resultExternal)) {\n console.error(\n 'Error: resultExternal.result is undefined or not an array',\n resultExternal\n )\n this.dataExternal = [] // Ensure dataExternal is an empty array instead of undefined\n } else {\n this.dataExternal = resultExternal.map(\n (externalLink: Partial<DataExternalLink>) => ({\n external: externalLink.external ?? false,\n gtmClass: externalLink.gtmClass ?? '',\n icon: externalLink.icon ?? null,\n iconify: externalLink.iconify ?? null,\n isNew: externalLink.isNew ?? false,\n name: externalLink.name ?? '',\n url: externalLink.url ?? '',\n })\n )\n }\n // Sidebar\n const endpointSidebar = `https://cdn-www.kompas.id/assets/json/ApiMenuSideV2.json`\n const responseSidebar = await fetch(endpointSidebar, {\n headers: {\n 'Content-Type': 'application/json',\n },\n })\n const resultSidebar = await responseSidebar.json()\n // Validate the structure of the response\n if (!resultSidebar || typeof resultSidebar !== 'object') {\n console.error('Invalid response format:', resultSidebar)\n return\n }\n\n // Convert object to an array\n const sidebarArray = Object.values(resultSidebar)\n const [featureArray, categoryArray] = sidebarArray as [any[], any[]]\n const features: dataType[] =\n featureArray?.map((item: any) => ({\n href: item?.href ?? '',\n external: item?.external ?? false,\n icon: item?.icon ?? null,\n iconify: item?.iconify ?? null,\n name: item?.name ?? '',\n slug: item?.slug ?? '',\n redDot: [\n {\n start: item?.redDot?.start ?? '',\n end: item?.redDot?.end ?? '',\n },\n ],\n children: Array.isArray(item?.children)\n ? item.children.map((child: any) => ({\n href: child?.href ?? '',\n external: child?.external ?? false,\n icon: child?.icon ?? '',\n iconify: child?.iconify ?? '',\n name: child?.name ?? '',\n slug: child?.slug ?? '',\n redDot: [\n {\n start: child?.redDot?.start ?? '',\n end: child?.redDot?.end ?? '',\n },\n ],\n }))\n : [],\n })) ?? []\n\n // Map category data\n const categories: dataType[] =\n categoryArray?.map((item: any) => ({\n href: item?.href ?? '',\n external: item?.external ?? false,\n icon: item?.icon ?? null,\n iconify: item?.iconify ?? null,\n name: item?.name ?? '',\n slug: item?.slug ?? '',\n redDot: [\n {\n start: item?.redDot?.start ?? '',\n end: item?.redDot?.end ?? '',\n },\n ],\n children: Array.isArray(item?.children)\n ? item.children.map((child: any) => ({\n href: child?.href ?? '',\n external: child?.external ?? false,\n icon: child?.icon ?? '',\n iconify: child?.iconify ?? '',\n name: child?.name ?? '',\n slug: child?.slug ?? '',\n redDot: [\n {\n start: child?.redDot?.start ?? '',\n end: child?.redDot?.end ?? '',\n },\n ],\n }))\n : [],\n })) ?? []\n this.dataSidebar = { feature: features, category: categories }\n this.requestUpdate()\n }\n\n renderChips() {\n const chips = []\n chips.push(\n html`\n <div class=\"flex\">\n <div\n class=\"py-1 px-2 rounded text-xs\"\n style=\"position: absolute; top: -22px; right: -24px; display: inline-flex; background-color:#D71920;\"\n >\n <span class=\"font-normal text-white capitalize\">Baru</span>\n </div>\n </div>\n `\n )\n return chips\n }\n\n hasChildren(item: any): boolean {\n return Array.isArray(item?.children) && item.children.length > 0\n }\n\n rubricClicked(item: { name: string; href?: string }, event?: Event): 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 @state()\n private expandedSlug: string | null = null\n private toggleChildren(item: any) {\n this.expandedSlug = this.expandedSlug === item.slug ? null : item.slug\n }\n\n @state()\n private showNavBar: boolean = false\n\n toggleNavSidebar = (e: Event) => {\n e.stopPropagation() // prevent bubbling\n this.showNavBar = !this.showNavBar\n }\n\n render() {\n return html`\n <!-- Button Menu -->\n <div\n class=\"w-fit flex items-center justify-center cursor-pointer relative\"\n @click=${this.toggleNavSidebar}\n >\n <div class=\"h-4 inline-flex text-brand-1\">\n ${unsafeSVG(getFontAwesomeIcon('fas', 'bars'))}\n </div>\n <span\n class=\"font-sans hidden sm:inline ml-2 tracking-wide text-brand-1 font-bold\"\n >Menu</span\n >\n </div>\n <!-- Side Menu -->\n <nav\n @click=${this.toggleNavSidebar}\n class=${this.showNavBar\n ? 'fixed left-0 top-0 w-screen z-[100]'\n : 'hidden'}\n >\n <div\n ref=\"toggle-nav-sidebar\"\n class=\"bg-white h-screen menu-menu-sidebar overflow-y-auto pb-20 pt-0 shadow-lg\"\n style=\"width: 312px;\"\n >\n <div\n class=\"bg-[#e1f0ff] flex flex-col items-center justify-center mb-6 w-full\"\n >\n <div\n ref=\"logo-kompas\"\n class=\"flex items-center justify-between px-4 py-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 class=\"bg-[#93c8fd] text-brand-1 cursor-pointer flex h-10 items-center justify-center rounded text-base w-10 p-4\"\n @click=${this.toggleNavSidebar}\n >\n ${unsafeSVG(getFontAwesomeIcon('fa', 'times'))}\n </span>\n </div>\n <div class=\"flex flex-wrap px-4 w-full\">\n ${this.dataExternal.map(\n item => html`\n <a href=\"${item.url}\" class=\"block w-1/2 no-underline\">\n <div class=\"cursor-pointer flex items-center pb-6 w-full\">\n <div class=\"flex mr-2 text-brand-1\">\n ${item.icon &&\n Array.isArray(item.icon) &&\n item.icon.length >= 2\n ? unsafeSVG(\n getFontAwesomeIcon(item.icon[0], item.icon[1])\n )\n : ''}\n </div>\n <span class=\"font-sans relative text-sm text-brand-1\">\n ${item.name} ${item.isNew ? this.renderChips() : ''}\n </span>\n </div>\n </a>\n `\n )}\n </div>\n </div>\n <!-- feature -->\n <div class=\"flex\">\n <div class=\"flex justify-between flex-col\">\n ${this.dataSidebar.feature.map(\n item => html`\n <div class=\"w-full font-sans\">\n <!-- Parent item -->\n <div\n class=\"flex items-center justify-between px-4 text-sm font-medium text-gray-700 transition-all cursor-pointer\"\n @click=${(e: Event) => this.rubricClicked(item, e)}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center\"\n >\n <div class=\"flex items-center space-x-3\">\n <span\n class=\"text-xl text-brand-1 h-8 flex items-center \n ${item.icon === null ? 'w-6' : 'max-w-max w-8'}\"\n >\n ${item.icon &&\n Array.isArray(item.icon) &&\n item.icon.length >= 2\n ? unsafeSVG(\n getFontAwesomeIcon(item.icon[0], item.icon[1])\n )\n : ''}\n </span>\n <span class=\"font-bold relative text-[#333] w-full\"\n >${decodeSpecialChars(item.name)}</span\n >\n ${timedContent(\n item.redDot[0].start,\n item.redDot[0].end\n )\n ? html`<span\n class=\"bg-orange-600 h-2 relative rounded-full w-2 -top-[12px]\"\n ></span>`\n : ''}\n </div>\n </div>\n\n <!-- Toggle chevron -->\n ${this.hasChildren(item)\n ? html`\n <span\n class=\"text-xs text-brand-1 bg-[#e1f0ff] flex justify-center items-center rounded my-1 p-4 w-10 h-10 cursor-pointer\"\n @click=${(e: Event) => {\n e.stopPropagation() // Prevents click from bubbling to parent\n this.toggleChildren(item)\n }}\n >\n ${this.expandedSlug === item.slug\n ? unsafeSVG(\n getFontAwesomeIcon('fas', 'chevron-up')\n )\n : unsafeSVG(\n getFontAwesomeIcon('fas', 'chevron-down')\n )}\n </span>\n `\n : null}\n </div>\n\n <!-- Children items -->\n ${this.hasChildren(item) && this.expandedSlug === item.slug\n ? html`\n <div class=\"pl-14 pt-1 pb-2 space-y-1\">\n ${item.children.map(\n child => html`\n <div\n class=\"flex items-center text-sm text-[#333] px-4 cursor-pointer transition-all\"\n @click=${() => this.rubricClicked(child)}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center pl-11\"\n >\n ${decodeSpecialChars(child.name)}\n ${timedContent(\n child.redDot[0].start,\n child.redDot[0].end\n )\n ? html`<span\n class=\"bg-orange-600 h-2 relative rounded-full w-2 -top-[12px]\"\n ></span>`\n : ''}\n <div></div>\n </div>\n </div>\n `\n )}\n </div>\n `\n : ''}\n </div>\n `\n )}\n </div>\n </div>\n <div class=\"border-b border-[#DDD] m-6 \"></div>\n <!-- category -->\n <div class=\"flex\">\n <div class=\"w-full flex justify-between flex-col\">\n ${this.dataSidebar.category.map(\n item => html`\n <div class=\"w-full font-sans\">\n <!-- Parent item -->\n <div\n class=\"flex items-center justify-between text-sm font-medium px-4 transition-all cursor-pointer\"\n @click=${(e: Event) => this.rubricClicked(item, e)}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center\"\n >\n <div class=\"flex items-center space-x-3\">\n <span\n class=\"text-xl text-brand-1 max-w-max w-8 h-8 flex items-center\"\n >\n ${item.icon &&\n Array.isArray(item.icon) &&\n item.icon.length >= 2\n ? unsafeSVG(\n getFontAwesomeIcon(item.icon[0], item.icon[1])\n )\n : ''}\n </span>\n <span\n class=\"font-bold ${item.name === 'Beranda'\n ? 'text-[#00559a]'\n : 'text-[#333] w-full'}\"\n >${decodeSpecialChars(item.name)}</span\n >\n\n ${timedContent(\n item.redDot[0].start,\n item.redDot[0].end\n )\n ? html`<span\n class=\"bg-orange-600 h-2 relative rounded-full w-2 -top-[12px]\"\n ></span>`\n : ''}\n </div>\n </div>\n\n <!-- Toggle chevron -->\n ${this.hasChildren(item)\n ? html`\n <span\n class=\"text-xs bg-[#e1f0ff] flex justify-center items-center rounded my-1 p-4 w-10 h-10 cursor-pointer font-bold text-brand-1\"\n @click=${(e: Event) => {\n e.stopPropagation() // Prevents click from bubbling to parent\n this.toggleChildren(item)\n }}\n >\n ${this.expandedSlug === item.slug\n ? unsafeSVG(\n getFontAwesomeIcon('fas', 'chevron-up')\n )\n : unsafeSVG(\n getFontAwesomeIcon('fas', 'chevron-down')\n )}\n </span>\n `\n : null}\n </div>\n\n <!-- Children items -->\n ${this.hasChildren(item) && this.expandedSlug === item.slug\n ? html`\n <div class=\"pt-1 pb-2 space-y-1\">\n ${item.children.map(\n child => html`\n <div\n class=\"flex items-center text-sm text-[#333] px-4 cursor-pointer transition-all\"\n @click=${() => this.rubricClicked(child)}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center pl-11\"\n >\n ${decodeSpecialChars(child.name)}\n ${timedContent(\n child.redDot[0].start,\n child.redDot[0].end\n )\n ? html`<span\n class=\"bg-orange-600 h-2 relative rounded-full w-2 -top-[12px]\"\n ></span>`\n : ''}\n </div>\n </div>\n `\n )}\n </div>\n `\n : ''}\n </div>\n `\n )}\n </div>\n </div>\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":["/* eslint-disable lit-a11y/click-events-have-key-events */\nimport { html, css, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.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\ninterface DataExternalLink {\n external?: boolean\n gtmClass?: string\n icon: object | null\n iconify: string | null\n isNew: boolean\n name: string\n url: string\n}\n\ninterface dataType {\n href: string\n external?: boolean\n icon: object | null\n iconify: string | null\n name: string\n slug: string\n redDot: [\n {\n start: string\n end: string\n }\n ]\n children: [\n {\n href: string\n external: boolean\n icon: string\n iconify: string | null\n name: string\n slug: string\n redDot: [\n {\n start: string\n end: string\n }\n ]\n }\n ]\n}\ninterface DataSideBarLink {\n feature: dataType[]\n category: dataType[]\n}\n\n@customElement('kompasid-menu-side-bar')\nexport class KompasMenuSideBar extends LitElement {\n hasSlotContent = false\n shadowRoot: any\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 console.log('Slot content exists?', this.hasSlotContent)\n }\n\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\n .menu-menu-sidebar::-webkit-scrollbar-track {\n background: white;\n }\n\n .menu-menu-sidebar::-webkit-scrollbar-thumb {\n background-color: #00557d; /* Replace with your brand color */\n border-radius: 8px;\n }\n\n .menu-menu-sidebar::-webkit-scrollbar-button,\n .menu-menu-sidebar::-webkit-scrollbar-corner {\n background-color: white;\n }\n `,\n TWStyles,\n ]\n @property({ type: Array }) dataExternal: DataExternalLink[] = []\n @property({ type: Boolean }) isDark = false\n\n async connectedCallback() {\n super.connectedCallback()\n try {\n await this.fetchExternal()\n } catch (error) {\n this.handleFetchError(error)\n }\n }\n handleFetchError(error: unknown) {\n const errorMessage =\n error instanceof Error ? error.message : 'Kesalahan tidak diketahui'\n alert(`Terjadi kesalahan: ${errorMessage}`)\n }\n\n dataSidebar: DataSideBarLink = {\n feature: [],\n category: [],\n }\n async fetchExternal() {\n // External\n const endpointExternal = `https://cdn-www.kompas.id/assets/json/ApiMenuExternalLink.json`\n const response = await fetch(endpointExternal, {\n headers: {\n 'Content-Type': 'application/json',\n },\n })\n const resultExternal = await response.json()\n // eslint-disable-next-line no-undef\n if (!resultExternal || !Array.isArray(resultExternal)) {\n console.error(\n 'Error: resultExternal.result is undefined or not an array',\n resultExternal\n )\n this.dataExternal = [] // Ensure dataExternal is an empty array instead of undefined\n } else {\n this.dataExternal = resultExternal.map(\n (externalLink: Partial<DataExternalLink>) => ({\n external: externalLink.external ?? false,\n gtmClass: externalLink.gtmClass ?? '',\n icon: externalLink.icon ?? null,\n iconify: externalLink.iconify ?? null,\n isNew: externalLink.isNew ?? false,\n name: externalLink.name ?? '',\n url: externalLink.url ?? '',\n })\n )\n }\n // Sidebar\n const endpointSidebar = `https://cdn-www.kompas.id/assets/json/ApiMenuSideV2.json`\n const responseSidebar = await fetch(endpointSidebar, {\n headers: {\n 'Content-Type': 'application/json',\n },\n })\n const resultSidebar = await responseSidebar.json()\n // Validate the structure of the response\n if (!resultSidebar || typeof resultSidebar !== 'object') {\n console.error('Invalid response format:', resultSidebar)\n return\n }\n\n // Convert object to an array\n const sidebarArray = Object.values(resultSidebar)\n const [featureArray, categoryArray] = sidebarArray as [any[], any[]]\n const features: dataType[] =\n featureArray?.map((item: any) => ({\n href: item?.href ?? '',\n external: item?.external ?? false,\n icon: item?.icon ?? null,\n iconify: item?.iconify ?? null,\n name: item?.name ?? '',\n slug: item?.slug ?? '',\n redDot: [\n {\n start: item?.redDot?.start ?? '',\n end: item?.redDot?.end ?? '',\n },\n ],\n children: Array.isArray(item?.children)\n ? item.children.map((child: any) => ({\n href: child?.href ?? '',\n external: child?.external ?? false,\n icon: child?.icon ?? '',\n iconify: child?.iconify ?? '',\n name: child?.name ?? '',\n slug: child?.slug ?? '',\n redDot: [\n {\n start: child?.redDot?.start ?? '',\n end: child?.redDot?.end ?? '',\n },\n ],\n }))\n : [],\n })) ?? []\n\n // Map category data\n const categories: dataType[] =\n categoryArray?.map((item: any) => ({\n href: item?.href ?? '',\n external: item?.external ?? false,\n icon: item?.icon ?? null,\n iconify: item?.iconify ?? null,\n name: item?.name ?? '',\n slug: item?.slug ?? '',\n redDot: [\n {\n start: item?.redDot?.start ?? '',\n end: item?.redDot?.end ?? '',\n },\n ],\n children: Array.isArray(item?.children)\n ? item.children.map((child: any) => ({\n href: child?.href ?? '',\n external: child?.external ?? false,\n icon: child?.icon ?? '',\n iconify: child?.iconify ?? '',\n name: child?.name ?? '',\n slug: child?.slug ?? '',\n redDot: [\n {\n start: child?.redDot?.start ?? '',\n end: child?.redDot?.end ?? '',\n },\n ],\n }))\n : [],\n })) ?? []\n this.dataSidebar = { feature: features, category: categories }\n this.requestUpdate()\n }\n\n renderChips() {\n const chips = []\n chips.push(\n html`\n <div class=\"flex\">\n <div\n class=\"py-0.5 px-1.5 rounded-full\"\n style=\"position: relative; display: inline-flex; background-color:#D71920;\"\n >\n <span class=\"font-bold font-pt-sans text-xs text-white capitalize\"\n >Baru</span\n >\n </div>\n </div>\n `\n )\n return chips\n }\n\n hasChildren(item: any): boolean {\n return Array.isArray(item?.children) && item.children.length > 0\n }\n\n rubricClicked(item: { name: string; href?: string }, event?: Event): 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 @state()\n private expandedSlug: string | null = null\n private toggleChildren(item: any) {\n this.expandedSlug = this.expandedSlug === item.slug ? null : item.slug\n }\n\n @state()\n private showNavBar: boolean = false\n\n toggleNavSidebar = (e: Event) => {\n e.stopPropagation() // prevent bubbling\n this.showNavBar = !this.showNavBar\n }\n\n render() {\n return html`\n <!-- Button Menu -->\n <div\n class=\"w-fit flex items-center justify-center cursor-pointer relative\"\n @click=${this.toggleNavSidebar}\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-pt-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 <!-- Side Menu -->\n <nav\n @click=${this.toggleNavSidebar}\n class=${this.showNavBar\n ? 'fixed left-0 top-0 w-screen z-[100]'\n : 'hidden'}\n >\n <div\n ref=\"toggle-nav-sidebar\"\n class=\"bg-white h-screen menu-menu-sidebar overflow-y-auto pb-20 pt-0 shadow-lg\"\n style=\"width: 312px;\"\n >\n <div\n class=\"bg-[#FFFFFF] flex flex-col items-center justify-center mb-6 w-full\"\n >\n <div\n ref=\"logo-kompas\"\n class=\"flex items-center justify-between px-4 py-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 class=\"bg-[#E1F0FF] text-brand-1 cursor-pointer flex h-10 items-center justify-center rounded text-base w-10 py-4\"\n @click=${this.toggleNavSidebar}\n >\n ${unsafeSVG(getFontAwesomeIcon('fa', 'times', 12, 12))}\n </span>\n </div>\n <div class=\"flex flex-wrap px-4 w-full\">\n ${this.dataExternal.map(\n item => html`\n <a href=\"${item.url}\" class=\"flex w-1/2 no-underline\">\n <div\n class=\"cursor-pointer flex items-center pb-4 w-[312px]\"\n >\n ${item.icon &&\n Array.isArray(item.icon) &&\n item.icon.length >= 2\n ? html`\n <div class=\"flex mr-2 text-brand-1\">\n ${unsafeSVG(\n getFontAwesomeIcon(item.icon[0], item.icon[1])\n )}\n </div>\n `\n : ''}\n <span\n class=\"font-pt-sans relative text-xs text-[#666666]\"\n >\n ${item.name}\n </span>\n <div class=\"ml-1\">\n ${item.isNew ? this.renderChips() : ''}\n </div>\n </div>\n </a>\n `\n )}\n </div>\n </div>\n <div class=\"border-b border-[#DDD] m-6 \"></div>\n <!-- feature -->\n <div class=\"flex\">\n <div class=\"flex justify-between flex-col\">\n ${this.dataSidebar.feature.map(\n item => html`\n <div class=\"w-full font-pt-sans\">\n <!-- Parent item -->\n <div\n class=\"flex items-center justify-between px-4 text-sm font-medium text-gray-700 transition-all cursor-pointer\"\n @click=${(e: Event) => this.rubricClicked(item, e)}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center\"\n >\n <div class=\"flex items-center space-x-3\">\n <span\n class=\"text-xl text-brand-1 h-8 flex items-center \n ${item.icon === null ? 'w-6' : 'max-w-max w-8'}\"\n >\n ${item.icon &&\n Array.isArray(item.icon) &&\n item.icon.length >= 2\n ? unsafeSVG(\n getFontAwesomeIcon(\n item.icon[0],\n item.icon[1],\n 20,\n 20\n )\n )\n : ''}\n </span>\n <span class=\"font-bold relative text-[#333] w-full\"\n >${decodeSpecialChars(item.name)}</span\n >\n ${timedContent(\n item.redDot[0].start,\n item.redDot[0].end\n )\n ? html`<span\n class=\"bg-orange-600 h-2 relative rounded-full w-2 -top-[12px]\"\n ></span>`\n : ''}\n </div>\n </div>\n\n <!-- Toggle chevron -->\n ${this.hasChildren(item)\n ? html`\n <span\n class=\"text-xs text-brand-1 bg-[#e1f0ff] flex justify-center items-center rounded my-1 p-4 w-10 h-10 cursor-pointer\"\n @click=${(e: Event) => {\n e.stopPropagation() // Prevents click from bubbling to parent\n this.toggleChildren(item)\n }}\n >\n ${this.expandedSlug === item.slug\n ? unsafeSVG(\n getFontAwesomeIcon(\n 'fas',\n 'chevron-up',\n 12,\n 12\n )\n )\n : unsafeSVG(\n getFontAwesomeIcon(\n 'fas',\n 'chevron-down',\n 12,\n 12\n )\n )}\n </span>\n `\n : null}\n </div>\n\n <!-- Children items -->\n ${this.hasChildren(item) && this.expandedSlug === item.slug\n ? html`\n <div class=\"pl-14 pt-1 pb-2 space-y-1\">\n ${item.children.map(\n child => html`\n <div\n class=\"flex items-center text-sm text-[#333] px-4 cursor-pointer transition-all\"\n @click=${() => this.rubricClicked(child)}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center pl-11\"\n >\n ${decodeSpecialChars(child.name)}\n ${timedContent(\n child.redDot[0].start,\n child.redDot[0].end\n )\n ? html`<span\n class=\"bg-orange-600 h-2 relative rounded-full w-2 -top-[12px]\"\n ></span>`\n : ''}\n <div></div>\n </div>\n </div>\n `\n )}\n </div>\n `\n : ''}\n </div>\n `\n )}\n </div>\n </div>\n <div class=\"border-b border-[#DDD] m-6 \"></div>\n <!-- category -->\n <div class=\"flex\">\n <div class=\"w-full flex justify-between flex-col\">\n ${this.dataSidebar.category.map(\n item => html`\n <div class=\"w-full font-pt-sans\">\n <!-- Parent item -->\n <div\n class=\"flex items-center justify-between text-sm font-medium px-4 transition-all cursor-pointer\"\n @click=${(e: Event) => this.rubricClicked(item, e)}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center\"\n >\n <div class=\"flex items-center space-x-3\">\n <span\n class=\"text-xl text-brand-1 max-w-max w-8 h-8 flex items-center\"\n >\n ${item.icon &&\n Array.isArray(item.icon) &&\n item.icon.length >= 2\n ? unsafeSVG(\n getFontAwesomeIcon(\n item.icon[0],\n item.icon[1],\n 20,\n 20\n )\n )\n : ''}\n </span>\n <span\n class=\"font-bold ${item.name === 'Beranda'\n ? 'text-[#00559a]'\n : 'text-[#333] w-full'}\"\n >${decodeSpecialChars(item.name)}</span\n >\n\n ${timedContent(\n item.redDot[0].start,\n item.redDot[0].end\n )\n ? html`<span\n class=\"bg-orange-600 h-2 relative rounded-full w-2 -top-[12px]\"\n ></span>`\n : ''}\n </div>\n </div>\n\n <!-- Toggle chevron -->\n ${this.hasChildren(item)\n ? html`\n <span\n class=\"bg-[#e1f0ff] flex justify-center items-center rounded my-1 py-4 w-10 h-10 cursor-pointer font-bold text-brand-1\"\n @click=${(e: Event) => {\n e.stopPropagation() // Prevents click from bubbling to parent\n this.toggleChildren(item)\n }}\n >\n ${this.expandedSlug === item.slug\n ? unsafeSVG(\n getFontAwesomeIcon(\n 'fas',\n 'chevron-up',\n 12,\n 12\n )\n )\n : unsafeSVG(\n getFontAwesomeIcon(\n 'fas',\n 'chevron-down',\n 12,\n 12\n )\n )}\n </span>\n `\n : null}\n </div>\n\n <!-- Children items -->\n ${this.hasChildren(item) && this.expandedSlug === item.slug\n ? html`\n <div class=\"pt-1 pb-2 space-y-1\">\n ${item.children.map(\n child => html`\n <div\n class=\"flex items-center text-sm text-[#333] px-4 cursor-pointer transition-all\"\n @click=${() => this.rubricClicked(child)}\n >\n <div\n class=\"w-[216px] hover:bg-[#f3f4f6] rounded h-12 flex items-center pl-11\"\n >\n ${decodeSpecialChars(child.name)}\n ${timedContent(\n child.redDot[0].start,\n child.redDot[0].end\n )\n ? html`<span\n class=\"bg-orange-600 h-2 relative rounded-full w-2 -top-[12px]\"\n ></span>`\n : ''}\n </div>\n </div>\n `\n )}\n </div>\n `\n : ''}\n </div>\n `\n )}\n </div>\n </div>\n </div>\n </nav>\n `\n }\n}\n"]}
@@ -48,5 +48,5 @@ export declare class KompasMeteredPaywall extends LitElement {
48
48
  private redirectToBerlangganan;
49
49
  private dataLayeronLanggananButton;
50
50
  private dataLayeronMeteredPaywall;
51
- render(): import("lit").TemplateResult<1> | typeof nothing;
51
+ render(): import("lit-html").TemplateResult<1> | typeof nothing;
52
52
  }
@@ -97,5 +97,5 @@ export declare class KompasMeteredWallRegister extends LitElement {
97
97
  */
98
98
  connectedCallback(): Promise<void>;
99
99
  private loadData;
100
- render(): import("lit").TemplateResult<1> | null;
100
+ render(): import("lit-html").TemplateResult<1> | null;
101
101
  }
@@ -74,5 +74,5 @@ export declare class KompasPaywall extends LitElement {
74
74
  private renderAudioPaywallSection;
75
75
  private selectorTypePaywall;
76
76
  private togglePaywall;
77
- render(): import("lit").TemplateResult<1> | typeof nothing;
77
+ render(): import("lit-html").TemplateResult<1> | typeof nothing;
78
78
  }
@@ -8,5 +8,5 @@ export declare class KompasPaywallBannerRegistration extends LitElement {
8
8
  private redirectToLogin;
9
9
  private redirectToRegister;
10
10
  private sendDataLayer;
11
- render(): import("lit").TemplateResult<1>;
11
+ render(): import("lit-html").TemplateResult<1>;
12
12
  }
@@ -145,5 +145,5 @@ export declare class KompasIdPaywallBody extends LitElement {
145
145
  /**
146
146
  * Render Statement
147
147
  */
148
- render(): import("lit").TemplateResult<1>;
148
+ render(): import("lit-html").TemplateResult<1>;
149
149
  }
@@ -4,5 +4,5 @@ export declare class KompasPaywallInformationHeader extends LitElement {
4
4
  text: string;
5
5
  theme: string;
6
6
  get isDark(): boolean;
7
- render(): import("lit").TemplateResult<1>;
7
+ render(): import("lit-html").TemplateResult<1>;
8
8
  }
@@ -85,5 +85,5 @@ export declare class KompasPaywallVideo extends LitElement {
85
85
  /**
86
86
  * Render Statement
87
87
  */
88
- render(): import("lit").TemplateResult<1>;
88
+ render(): import("lit-html").TemplateResult<1>;
89
89
  }
@@ -36,13 +36,13 @@ export declare class KompasWidgetRecirculationsDefault extends LitElement {
36
36
  */
37
37
  private titleRelatedArticle;
38
38
  private titleOtherArticle;
39
- renderChips(post: Post): import("lit").TemplateResult<1>[];
40
- renderImage(post: Post): import("lit").TemplateResult<1> | "";
39
+ renderChips(post: Post): import("lit-html").TemplateResult<1>[];
40
+ renderImage(post: Post): import("lit-html").TemplateResult<1> | "";
41
41
  /**
42
42
  * mengirim event ke datalayer
43
43
  */
44
44
  private recoContentClicked;
45
45
  private recoContentViewed;
46
46
  handleObserver(): void;
47
- render(): import("lit").TemplateResult<1>;
47
+ render(): import("lit-html").TemplateResult<1>;
48
48
  }
@@ -21,8 +21,8 @@ export declare class KompasWidgetRecirculationsList extends LitElement {
21
21
  connectedCallback(): Promise<void>;
22
22
  fetchArticles(): Promise<void>;
23
23
  handleFetchError(error: unknown): void;
24
- renderChips(item: ListItem): import("lit").TemplateResult<1>[];
24
+ renderChips(item: ListItem): import("lit-html").TemplateResult<1>[];
25
25
  getSectionName(): "Section_Terbaru" | "Section_Terpopuler";
26
- render(): import("lit").TemplateResult<1>;
26
+ render(): import("lit-html").TemplateResult<1>;
27
27
  }
28
28
  export {};
@@ -16,6 +16,6 @@ export declare class IntersectionObserverComponent extends LitElement {
16
16
  private handleEntryInView;
17
17
  private clearTimer;
18
18
  private emitTrigger;
19
- render(): import("lit").TemplateResult<1>;
19
+ render(): import("lit-html").TemplateResult<1>;
20
20
  }
21
21
  export declare const createIntersectionObserverComponent: () => typeof IntersectionObserverComponent;