@triptease/tt-navbar 0.0.6 → 0.0.7

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.
@@ -106,9 +106,9 @@ __decorate([
106
106
  property({ type: Function })
107
107
  ], TtNavbar.prototype, "navigate", void 0);
108
108
  __decorate([
109
- property({ type: String })
109
+ property({ type: String, attribute: 'base-url' })
110
110
  ], TtNavbar.prototype, "baseUrl", void 0);
111
111
  __decorate([
112
- property({ type: String })
112
+ property({ type: String, attribute: 'client-key' })
113
113
  ], TtNavbar.prototype, "clientKey", void 0);
114
114
  //# sourceMappingURL=TtNavbar.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TtNavbar.js","sourceRoot":"","sources":["../../src/TtNavbar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,OAAO,QAAS,SAAQ,UAAU;IAAxC;;QAYU,aAAQ,GAAG,CAAC,IAAY,EAAU,EAAE;YAC1C,IAAI,CAAC,IAAI,CAAC,SAAS;gBAAE,MAAM,IAAI,KAAK,CAAC,uBAAuB,CAAC,CAAC;YAE9D,MAAM,aAAa,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YAClE,IAAI,CAAC,IAAI,CAAC,OAAO;gBAAE,OAAO,aAAa,CAAC;YAExC,OAAO,IAAI,GAAG,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,EAAE,CAAC;QACzD,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,CAAa,EAAE,EAAE;YACxC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;YACnB,CAAC;QACH,CAAC,CAAC;IAmFJ,CAAC;IAjFC,MAAM;QACJ,OAAO,IAAI,CAAA;gBACC,IAAI,CAAC,EAAE;kBACL,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,WAAW,IAAI,CAAC,aAAa;;kBAE/C,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,WAAW,IAAI,CAAC,aAAa;;;;;;;qBAOpD,IAAI,CAAC,QAAQ,CAAC,qBAAqB,CAAC;uBAClC,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,6BAA6B,CAAC;uBAC1C,IAAI,CAAC,aAAa;;;;;;;;;qBASpB,IAAI,CAAC,QAAQ,CAAC,qCAAqC,CAAC;uBAClD,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,yBAAyB,CAAC;uBACtC,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,iBAAiB,CAAC;uBAC9B,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,+BAA+B,CAAC;uBAC5C,IAAI,CAAC,aAAa;;;;;;;;;sBASnB,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,WAAW,IAAI,CAAC,aAAa;;;;qBAIvD,IAAI,CAAC,QAAQ,CAAC,2BAA2B,CAAC;uBACxC,IAAI,CAAC,aAAa;;;;;;;;;qBASpB,IAAI,CAAC,QAAQ,CAAC,yCAAyC,CAAC;uBACtD,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,4BAA4B,CAAC;uBACzC,IAAI,CAAC,aAAa;;;;;;;KAOpC,CAAC;IACJ,CAAC;;AA1GM,eAAM,GAAG,MAAM,AAAT,CAAU;AAGvB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;0CACmB;AAGhD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCACV;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACR","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { styles } from './styles.js';\n\nexport class TtNavbar extends LitElement {\n static styles = styles;\n\n @property({ type: Function })\n navigate: ((e: MouseEvent) => void) | undefined;\n\n @property({ type: String })\n baseUrl?: string;\n\n @property({ type: String })\n clientKey?: string;\n\n private buildUrl = (path: string): string => {\n if (!this.clientKey) throw new Error('clientKey is required');\n\n const formattedPath = path.replace('$CLIENT_KEY', this.clientKey);\n if (!this.baseUrl) return formattedPath;\n\n return new URL(formattedPath, this.baseUrl).toString();\n };\n\n private onAnchorClick = (e: MouseEvent) => {\n if (this.navigate) {\n this.navigate(e);\n }\n };\n\n render() {\n return html`\n <nav id=${this.id}>\n <a href=${this.buildUrl('/')} @click=${this.onAnchorClick}>Dashboard</a>\n <a href=\"https://app.campaign-manager.triptease.io\">Campaigns</a>\n <a href=${this.buildUrl('/channels')} @click=${this.onAnchorClick}\n >Channels</a\n >\n <details>\n <summary>Market Insights</summary>\n <div>\n <a\n href=${this.buildUrl('/parity/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Parity</a\n >\n <a\n href=${this.buildUrl('/guest-insights/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Guest insights</a\n >\n </div>\n </details>\n <details>\n <summary>Settings</summary>\n <div>\n <a\n href=${this.buildUrl('/$CLIENT_KEY/guest-behavioural-data')}\n @click=${this.onAnchorClick}\n >Email setup</a\n >\n <a\n href=${this.buildUrl('/$CLIENT_KEY/crm-config')}\n @click=${this.onAnchorClick}\n >CRM connectivity</a\n >\n <a\n href=${this.buildUrl('/settings/group')}\n @click=${this.onAnchorClick}\n >Group settings</a\n >\n <a\n href=${this.buildUrl('/settings/$CLIENT_KEY/hotels/')}\n @click=${this.onAnchorClick}\n >Property settings</a\n >\n </div>\n </details>\n <hr />\n <details>\n <summary>Account</summary>\n <div>\n <a href=${this.buildUrl('/account')} @click=${this.onAnchorClick}\n >User settings</a\n >\n <a\n href=${this.buildUrl('/account/team/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Team and permissions</a\n >\n </div>\n </details>\n <details>\n <summary>Billing</summary>\n <div>\n <a\n href=${this.buildUrl('/account/billing-management/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Booking reconciliation</a\n >\n <a\n href=${this.buildUrl('/subscriptions/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Subscriptions</a\n >\n </div>\n </details>\n <slot name=\"clientSelector\"></slot>\n </nav>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"TtNavbar.js","sourceRoot":"","sources":["../../src/TtNavbar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,OAAO,QAAS,SAAQ,UAAU;IAAxC;;QAYU,aAAQ,GAAG,CAAC,IAAY,EAAU,EAAE;YAC1C,IAAI,CAAC,IAAI,CAAC,SAAS;gBAAE,MAAM,IAAI,KAAK,CAAC,uBAAuB,CAAC,CAAC;YAE9D,MAAM,aAAa,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YAClE,IAAI,CAAC,IAAI,CAAC,OAAO;gBAAE,OAAO,aAAa,CAAC;YAExC,OAAO,IAAI,GAAG,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,EAAE,CAAC;QACzD,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,CAAa,EAAE,EAAE;YACxC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;YACnB,CAAC;QACH,CAAC,CAAC;IAmFJ,CAAC;IAjFC,MAAM;QACJ,OAAO,IAAI,CAAA;gBACC,IAAI,CAAC,EAAE;kBACL,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,WAAW,IAAI,CAAC,aAAa;;kBAE/C,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,WAAW,IAAI,CAAC,aAAa;;;;;;;qBAOpD,IAAI,CAAC,QAAQ,CAAC,qBAAqB,CAAC;uBAClC,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,6BAA6B,CAAC;uBAC1C,IAAI,CAAC,aAAa;;;;;;;;;qBASpB,IAAI,CAAC,QAAQ,CAAC,qCAAqC,CAAC;uBAClD,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,yBAAyB,CAAC;uBACtC,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,iBAAiB,CAAC;uBAC9B,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,+BAA+B,CAAC;uBAC5C,IAAI,CAAC,aAAa;;;;;;;;;sBASnB,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,WAAW,IAAI,CAAC,aAAa;;;;qBAIvD,IAAI,CAAC,QAAQ,CAAC,2BAA2B,CAAC;uBACxC,IAAI,CAAC,aAAa;;;;;;;;;qBASpB,IAAI,CAAC,QAAQ,CAAC,yCAAyC,CAAC;uBACtD,IAAI,CAAC,aAAa;;;;qBAIpB,IAAI,CAAC,QAAQ,CAAC,4BAA4B,CAAC;uBACzC,IAAI,CAAC,aAAa;;;;;;;KAOpC,CAAC;IACJ,CAAC;;AA1GM,eAAM,GAAG,MAAM,AAAT,CAAU;AAGvB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;0CACmB;AAGhD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;yCACjC;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;2CACjC","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { styles } from './styles.js';\n\nexport class TtNavbar extends LitElement {\n static styles = styles;\n\n @property({ type: Function })\n navigate: ((e: MouseEvent) => void) | undefined;\n\n @property({ type: String, attribute: 'base-url' })\n baseUrl?: string;\n\n @property({ type: String, attribute: 'client-key' })\n clientKey?: string;\n\n private buildUrl = (path: string): string => {\n if (!this.clientKey) throw new Error('clientKey is required');\n\n const formattedPath = path.replace('$CLIENT_KEY', this.clientKey);\n if (!this.baseUrl) return formattedPath;\n\n return new URL(formattedPath, this.baseUrl).toString();\n };\n\n private onAnchorClick = (e: MouseEvent) => {\n if (this.navigate) {\n this.navigate(e);\n }\n };\n\n render() {\n return html`\n <nav id=${this.id}>\n <a href=${this.buildUrl('/')} @click=${this.onAnchorClick}>Dashboard</a>\n <a href=\"https://app.campaign-manager.triptease.io\">Campaigns</a>\n <a href=${this.buildUrl('/channels')} @click=${this.onAnchorClick}\n >Channels</a\n >\n <details>\n <summary>Market Insights</summary>\n <div>\n <a\n href=${this.buildUrl('/parity/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Parity</a\n >\n <a\n href=${this.buildUrl('/guest-insights/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Guest insights</a\n >\n </div>\n </details>\n <details>\n <summary>Settings</summary>\n <div>\n <a\n href=${this.buildUrl('/$CLIENT_KEY/guest-behavioural-data')}\n @click=${this.onAnchorClick}\n >Email setup</a\n >\n <a\n href=${this.buildUrl('/$CLIENT_KEY/crm-config')}\n @click=${this.onAnchorClick}\n >CRM connectivity</a\n >\n <a\n href=${this.buildUrl('/settings/group')}\n @click=${this.onAnchorClick}\n >Group settings</a\n >\n <a\n href=${this.buildUrl('/settings/$CLIENT_KEY/hotels/')}\n @click=${this.onAnchorClick}\n >Property settings</a\n >\n </div>\n </details>\n <hr />\n <details>\n <summary>Account</summary>\n <div>\n <a href=${this.buildUrl('/account')} @click=${this.onAnchorClick}\n >User settings</a\n >\n <a\n href=${this.buildUrl('/account/team/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Team and permissions</a\n >\n </div>\n </details>\n <details>\n <summary>Billing</summary>\n <div>\n <a\n href=${this.buildUrl('/account/billing-management/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Booking reconciliation</a\n >\n <a\n href=${this.buildUrl('/subscriptions/$CLIENT_KEY')}\n @click=${this.onAnchorClick}\n >Subscriptions</a\n >\n </div>\n </details>\n <slot name=\"clientSelector\"></slot>\n </nav>\n `;\n }\n}\n"]}
@@ -1,9 +1,15 @@
1
1
  import { css } from 'lit';
2
2
  export const styles = css `
3
- nav {
3
+ :host {
4
+ display: block;
5
+ height: 100vh;
4
6
  max-width: 260px;
7
+ }
8
+
9
+ nav {
5
10
  display: flex;
6
11
  flex-direction: column;
12
+ height: 100%;
7
13
  }
8
14
 
9
15
  nav details div {
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;CAkBxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n nav {\n max-width: 260px;\n display: flex;\n flex-direction: column;\n }\n\n nav details div {\n display: flex;\n flex-direction: column;\n }\n\n hr {\n background: black;\n width: 100%;\n height: 1px;\n border: none;\n }\n`;\n"]}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;CAwBxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n :host {\n display: block;\n height: 100vh;\n max-width: 260px;\n }\n\n nav {\n display: flex;\n flex-direction: column;\n height: 100%;\n }\n\n nav details div {\n display: flex;\n flex-direction: column;\n }\n\n hr {\n background: black;\n width: 100%;\n height: 1px;\n border: none;\n }\n`;\n"]}
@@ -6,13 +6,12 @@ export default {
6
6
  };
7
7
  const Template = () => html `
8
8
  <div>
9
- <tt-navbar clientKey="zxd47KQGAP">
9
+ <tt-navbar client-key="zxd47KQGAP">
10
10
  <div slot="clientSelector">
11
11
  <p>My Cool Client Selector</p>
12
12
  </div>
13
13
  </tt-navbar>
14
14
  </div>
15
-
16
15
  `;
17
16
  export const Regular = Template.bind({});
18
17
  //# sourceMappingURL=index.stories.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../stories/index.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,qBAAqB,CAAC;AAE7B,eAAe;IACb,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,WAAW;CACvB,CAAC;AAKF,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;;;;;;;CAS1B,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { html } from 'lit';\nimport '../src/tt-navbar.js';\n\nexport default {\n title: 'TtNavbar',\n component: 'tt-navbar',\n};\n\n\n\n\nconst Template = () => html`\n <div>\n <tt-navbar clientKey=\"zxd47KQGAP\">\n <div slot=\"clientSelector\">\n <p>My Cool Client Selector</p>\n </div>\n </tt-navbar>\n </div>\n\n`;\n\nexport const Regular = Template.bind({});\n"]}
1
+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../stories/index.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,qBAAqB,CAAC;AAE7B,eAAe;IACb,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,WAAW;CACvB,CAAC;AAEF,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;;;;;;CAQ1B,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { html } from 'lit';\nimport '../src/tt-navbar.js';\n\nexport default {\n title: 'TtNavbar',\n component: 'tt-navbar',\n};\n\nconst Template = () => html`\n <div>\n <tt-navbar client-key=\"zxd47KQGAP\">\n <div slot=\"clientSelector\">\n <p>My Cool Client Selector</p>\n </div>\n </tt-navbar>\n </div>\n`;\n\nexport const Regular = Template.bind({});\n"]}
@@ -20,7 +20,7 @@ describe('TtNavbar', () => {
20
20
  }
21
21
  });
22
22
  it('should render with the default links', async () => {
23
- const navbar = await fixture(`<tt-navbar clientKey=${CLIENT_KEY}></tt-navbar>`);
23
+ const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`);
24
24
  const links = navbar.shadowRoot?.querySelectorAll('a');
25
25
  expect(links?.length).to.equal(13);
26
26
  if (links) {
@@ -44,7 +44,7 @@ describe('TtNavbar', () => {
44
44
  });
45
45
  it('should render platform URLs against the base URL when it is defined', async () => {
46
46
  const baseUrl = 'https://app.triptease.io';
47
- const navbar = await fixture(`<tt-navbar clientKey=${CLIENT_KEY} baseUrl="${baseUrl}"></tt-navbar>`);
47
+ const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY} base-url="${baseUrl}"></tt-navbar>`);
48
48
  const links = navbar.shadowRoot?.querySelectorAll('a');
49
49
  if (links) {
50
50
  expect(getLinkByHref(links, `${baseUrl}/`)).to.exist;
@@ -59,7 +59,7 @@ describe('TtNavbar', () => {
59
59
  e.preventDefault();
60
60
  navigateEventCount += 1;
61
61
  };
62
- const navbar = await fixture(`<tt-navbar clientKey=${CLIENT_KEY}></tt-navbar>`);
62
+ const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`);
63
63
  navbar.navigate = onNavigate;
64
64
  await navbar.updateComplete;
65
65
  const links = navbar.shadowRoot?.querySelectorAll('a');
@@ -67,7 +67,7 @@ describe('TtNavbar', () => {
67
67
  await waitUntil(() => expect(navigateEventCount).to.equal(12), 'navigate event did not fire');
68
68
  });
69
69
  it('should render the given client selector', async () => {
70
- const navbar = await fixture(`<tt-navbar clientKey=${CLIENT_KEY}><div slot="clientSelector"><div id="myCoolClientSelector"></div></div></tt-navbar>`);
70
+ const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY}><div slot="clientSelector"><div id="myCoolClientSelector"></div></div></tt-navbar>`);
71
71
  const clientSelector = navbar.querySelector('#myCoolClientSelector');
72
72
  expect(clientSelector).to.exist;
73
73
  });
@@ -1 +1 @@
1
- {"version":3,"file":"tt-navbar.test.js","sourceRoot":"","sources":["../../test/tt-navbar.test.ts"],"names":[],"mappings":"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","sourcesContent":["import '../src/tt-navbar.js';\nimport { expect, fixture, waitUntil } from '@open-wc/testing';\nimport { TtNavbar } from '../src/index.js';\n\n// eslint-disable-next-line no-undef\nconst getLinkByHref = (links: NodeListOf<HTMLAnchorElement>, href: string) => {\n for (const link of links) {\n if (link.getAttribute('href') === href) {\n return link;\n }\n }\n\n return undefined;\n};\n\nconst CLIENT_KEY = 'zxd47KQGAP';\n\ndescribe('TtNavbar', () => {\n it('should throw an error if the clientKey is not provided', async () => {\n try {\n await fixture<TtNavbar>(`<tt-navbar></tt-navbar>`);\n } catch (e) {\n expect(e).to.match(/clientKey is required/);\n }\n });\n it('should render with the default links', async () => {\n const navbar = await fixture<TtNavbar>(\n `<tt-navbar clientKey=${CLIENT_KEY}></tt-navbar>`,\n );\n const links = navbar.shadowRoot?.querySelectorAll('a');\n\n expect(links?.length).to.equal(13);\n\n if (links) {\n expect(getLinkByHref(links, '/')).to.exist;\n expect(getLinkByHref(links, 'https://app.campaign-manager.triptease.io'))\n .to.exist;\n expect(getLinkByHref(links, '/channels')).to.exist;\n expect(getLinkByHref(links, `/parity/${CLIENT_KEY}`)).to.exist;\n expect(getLinkByHref(links, `/guest-insights/${CLIENT_KEY}`)).to.exist;\n expect(getLinkByHref(links, `/${CLIENT_KEY}/guest-behavioural-data`)).to\n .exist;\n expect(getLinkByHref(links, `/${CLIENT_KEY}/crm-config`)).to.exist;\n expect(getLinkByHref(links, `/settings/group`)).to.exist;\n expect(getLinkByHref(links, `/settings/${CLIENT_KEY}/hotels/`)).to.exist;\n expect(getLinkByHref(links, `/account`)).to.exist;\n expect(getLinkByHref(links, `/account/team/${CLIENT_KEY}`)).to.exist;\n expect(getLinkByHref(links, `/account/billing-management/${CLIENT_KEY}`))\n .to.exist;\n expect(getLinkByHref(links, `/subscriptions/${CLIENT_KEY}`)).to.exist;\n }\n });\n\n it('should render platform URLs against the base URL when it is defined', async () => {\n const baseUrl = 'https://app.triptease.io';\n const navbar = await fixture<TtNavbar>(\n `<tt-navbar clientKey=${CLIENT_KEY} baseUrl=\"${baseUrl}\"></tt-navbar>`,\n );\n const links = navbar.shadowRoot?.querySelectorAll('a');\n\n if (links) {\n expect(getLinkByHref(links, `${baseUrl}/`)).to.exist;\n expect(getLinkByHref(links, 'https://app.campaign-manager.triptease.io'))\n .to.exist; // This shouldn't change\n expect(getLinkByHref(links, `${baseUrl}/channels`)).to.exist;\n }\n });\n\n it('should allow navigation events to be handled externally', async () => {\n let navigateEventCount = 0;\n\n const onNavigate = (e: MouseEvent) => {\n e.preventDefault();\n navigateEventCount += 1;\n };\n\n const navbar = await fixture<TtNavbar>(\n `<tt-navbar clientKey=${CLIENT_KEY}></tt-navbar>`,\n );\n navbar.navigate = onNavigate;\n await navbar.updateComplete;\n\n const links = navbar.shadowRoot?.querySelectorAll('a');\n links?.forEach(l => l.click());\n\n await waitUntil(\n () => expect(navigateEventCount).to.equal(12),\n 'navigate event did not fire',\n );\n });\n\n it('should render the given client selector', async () => {\n const navbar = await fixture<TtNavbar>(\n `<tt-navbar clientKey=${CLIENT_KEY}><div slot=\"clientSelector\"><div id=\"myCoolClientSelector\"></div></div></tt-navbar>`,\n );\n\n const clientSelector = navbar.querySelector('#myCoolClientSelector');\n\n expect(clientSelector).to.exist;\n });\n});\n"]}
1
+ {"version":3,"file":"tt-navbar.test.js","sourceRoot":"","sources":["../../test/tt-navbar.test.ts"],"names":[],"mappings":"AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAG9D,oCAAoC;AACpC,MAAM,aAAa,GAAG,CAAC,KAAoC,EAAE,IAAY,EAAE,EAAE;IAC3E,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE,CAAC;QACzB,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC;YACvC,OAAO,IAAI,CAAC;QACd,CAAC;IACH,CAAC;IAED,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,YAAY,CAAC;AAEhC,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACxB,EAAE,CAAC,wDAAwD,EAAE,KAAK,IAAI,EAAE;QACtE,IAAI,CAAC;YACH,MAAM,OAAO,CAAW,yBAAyB,CAAC,CAAC;QACrD,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,uBAAuB,CAAC,CAAC;QAC9C,CAAC;IACH,CAAC,CAAC,CAAC;IACH,EAAE,CAAC,sCAAsC,EAAE,KAAK,IAAI,EAAE;QACpD,MAAM,MAAM,GAAG,MAAM,OAAO,CAC1B,yBAAyB,UAAU,eAAe,CACnD,CAAC;QACF,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC;QAEvD,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAEnC,IAAI,KAAK,EAAE,CAAC;YACV,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YAC3C,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,2CAA2C,CAAC,CAAC;iBACtE,EAAE,CAAC,KAAK,CAAC;YACZ,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YACnD,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,WAAW,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YAC/D,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,mBAAmB,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YACvE,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,IAAI,UAAU,yBAAyB,CAAC,CAAC,CAAC,EAAE;iBACrE,KAAK,CAAC;YACT,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,IAAI,UAAU,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YACnE,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YACzD,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,aAAa,UAAU,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YACzE,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YAClD,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,iBAAiB,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YACrE,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,+BAA+B,UAAU,EAAE,CAAC,CAAC;iBACtE,EAAE,CAAC,KAAK,CAAC;YACZ,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,kBAAkB,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QACxE,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qEAAqE,EAAE,KAAK,IAAI,EAAE;QACnF,MAAM,OAAO,GAAG,0BAA0B,CAAC;QAC3C,MAAM,MAAM,GAAG,MAAM,OAAO,CAC1B,yBAAyB,UAAU,cAAc,OAAO,gBAAgB,CACzE,CAAC;QACF,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC;QAEvD,IAAI,KAAK,EAAE,CAAC;YACV,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,GAAG,OAAO,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YACrD,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,2CAA2C,CAAC,CAAC;iBACtE,EAAE,CAAC,KAAK,CAAC,CAAC,wBAAwB;YACrC,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,GAAG,OAAO,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAC/D,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yDAAyD,EAAE,KAAK,IAAI,EAAE;QACvE,IAAI,kBAAkB,GAAG,CAAC,CAAC;QAE3B,MAAM,UAAU,GAAG,CAAC,CAAa,EAAE,EAAE;YACnC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,kBAAkB,IAAI,CAAC,CAAC;QAC1B,CAAC,CAAC;QAEF,MAAM,MAAM,GAAG,MAAM,OAAO,CAC1B,yBAAyB,UAAU,eAAe,CACnD,CAAC;QACF,MAAM,CAAC,QAAQ,GAAG,UAAU,CAAC;QAC7B,MAAM,MAAM,CAAC,cAAc,CAAC;QAE5B,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC;QACvD,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC;QAE/B,MAAM,SAAS,CACb,GAAG,EAAE,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,EAC7C,6BAA6B,CAC9B,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yCAAyC,EAAE,KAAK,IAAI,EAAE;QACvD,MAAM,MAAM,GAAG,MAAM,OAAO,CAC1B,yBAAyB,UAAU,qFAAqF,CACzH,CAAC;QAEF,MAAM,cAAc,GAAG,MAAM,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;QAErE,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAClC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import '../src/tt-navbar.js';\nimport { expect, fixture, waitUntil } from '@open-wc/testing';\nimport { TtNavbar } from '../src/index.js';\n\n// eslint-disable-next-line no-undef\nconst getLinkByHref = (links: NodeListOf<HTMLAnchorElement>, href: string) => {\n for (const link of links) {\n if (link.getAttribute('href') === href) {\n return link;\n }\n }\n\n return undefined;\n};\n\nconst CLIENT_KEY = 'zxd47KQGAP';\n\ndescribe('TtNavbar', () => {\n it('should throw an error if the clientKey is not provided', async () => {\n try {\n await fixture<TtNavbar>(`<tt-navbar></tt-navbar>`);\n } catch (e) {\n expect(e).to.match(/clientKey is required/);\n }\n });\n it('should render with the default links', async () => {\n const navbar = await fixture<TtNavbar>(\n `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n );\n const links = navbar.shadowRoot?.querySelectorAll('a');\n\n expect(links?.length).to.equal(13);\n\n if (links) {\n expect(getLinkByHref(links, '/')).to.exist;\n expect(getLinkByHref(links, 'https://app.campaign-manager.triptease.io'))\n .to.exist;\n expect(getLinkByHref(links, '/channels')).to.exist;\n expect(getLinkByHref(links, `/parity/${CLIENT_KEY}`)).to.exist;\n expect(getLinkByHref(links, `/guest-insights/${CLIENT_KEY}`)).to.exist;\n expect(getLinkByHref(links, `/${CLIENT_KEY}/guest-behavioural-data`)).to\n .exist;\n expect(getLinkByHref(links, `/${CLIENT_KEY}/crm-config`)).to.exist;\n expect(getLinkByHref(links, `/settings/group`)).to.exist;\n expect(getLinkByHref(links, `/settings/${CLIENT_KEY}/hotels/`)).to.exist;\n expect(getLinkByHref(links, `/account`)).to.exist;\n expect(getLinkByHref(links, `/account/team/${CLIENT_KEY}`)).to.exist;\n expect(getLinkByHref(links, `/account/billing-management/${CLIENT_KEY}`))\n .to.exist;\n expect(getLinkByHref(links, `/subscriptions/${CLIENT_KEY}`)).to.exist;\n }\n });\n\n it('should render platform URLs against the base URL when it is defined', async () => {\n const baseUrl = 'https://app.triptease.io';\n const navbar = await fixture<TtNavbar>(\n `<tt-navbar client-key=${CLIENT_KEY} base-url=\"${baseUrl}\"></tt-navbar>`,\n );\n const links = navbar.shadowRoot?.querySelectorAll('a');\n\n if (links) {\n expect(getLinkByHref(links, `${baseUrl}/`)).to.exist;\n expect(getLinkByHref(links, 'https://app.campaign-manager.triptease.io'))\n .to.exist; // This shouldn't change\n expect(getLinkByHref(links, `${baseUrl}/channels`)).to.exist;\n }\n });\n\n it('should allow navigation events to be handled externally', async () => {\n let navigateEventCount = 0;\n\n const onNavigate = (e: MouseEvent) => {\n e.preventDefault();\n navigateEventCount += 1;\n };\n\n const navbar = await fixture<TtNavbar>(\n `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n );\n navbar.navigate = onNavigate;\n await navbar.updateComplete;\n\n const links = navbar.shadowRoot?.querySelectorAll('a');\n links?.forEach(l => l.click());\n\n await waitUntil(\n () => expect(navigateEventCount).to.equal(12),\n 'navigate event did not fire',\n );\n });\n\n it('should render the given client selector', async () => {\n const navbar = await fixture<TtNavbar>(\n `<tt-navbar client-key=${CLIENT_KEY}><div slot=\"clientSelector\"><div id=\"myCoolClientSelector\"></div></div></tt-navbar>`,\n );\n\n const clientSelector = navbar.querySelector('#myCoolClientSelector');\n\n expect(clientSelector).to.exist;\n });\n});\n"]}
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @triptease/tt-navbar v0.0.6
2
+ * @triptease/tt-navbar v0.0.7
3
3
  */
4
4
  var __defProp = Object.defineProperty;
5
5
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -592,10 +592,16 @@ function n4(t3) {
592
592
 
593
593
  // src/styles.ts
594
594
  var styles = i`
595
- nav {
595
+ :host {
596
+ display: block;
597
+ height: 100vh;
596
598
  max-width: 260px;
599
+ }
600
+
601
+ nav {
597
602
  display: flex;
598
603
  flex-direction: column;
604
+ height: 100%;
599
605
  }
600
606
 
601
607
  nav details div {
@@ -714,10 +720,10 @@ __decorateClass([
714
720
  n4({ type: Function })
715
721
  ], TtNavbar.prototype, "navigate", 2);
716
722
  __decorateClass([
717
- n4({ type: String })
723
+ n4({ type: String, attribute: "base-url" })
718
724
  ], TtNavbar.prototype, "baseUrl", 2);
719
725
  __decorateClass([
720
- n4({ type: String })
726
+ n4({ type: String, attribute: "client-key" })
721
727
  ], TtNavbar.prototype, "clientKey", 2);
722
728
  export {
723
729
  TtNavbar