@internetarchive/ia-topnav 1.1.30 → 1.1.31-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (83) hide show
  1. package/.eslintrc +16 -16
  2. package/LICENSE +661 -661
  3. package/README.md +147 -147
  4. package/index.d.ts +104 -104
  5. package/index.js +3 -3
  6. package/package.json +61 -61
  7. package/src/assets/img/hamburger.js +36 -36
  8. package/src/assets/img/ia-icon.js +33 -33
  9. package/src/assets/img/icon-audio.js +23 -23
  10. package/src/assets/img/icon-close.js +16 -16
  11. package/src/assets/img/icon-donate.js +15 -15
  12. package/src/assets/img/icon-ellipses.js +15 -15
  13. package/src/assets/img/icon-ia-logo.js +24 -24
  14. package/src/assets/img/icon-images.js +15 -15
  15. package/src/assets/img/icon-search.js +15 -15
  16. package/src/assets/img/icon-software.js +15 -15
  17. package/src/assets/img/icon-texts.js +15 -15
  18. package/src/assets/img/icon-upload.js +15 -15
  19. package/src/assets/img/icon-user.js +15 -15
  20. package/src/assets/img/icon-video.js +15 -15
  21. package/src/assets/img/icon-web.js +15 -15
  22. package/src/assets/img/icon.js +18 -18
  23. package/src/assets/img/icons.js +29 -29
  24. package/src/assets/img/user.js +38 -38
  25. package/src/assets/img/wordmark-stacked.js +13 -13
  26. package/src/data/menus.js +669 -659
  27. package/src/desktop-subnav.js +45 -45
  28. package/src/dropdown-menu.js +102 -98
  29. package/src/ia-topnav.js +307 -307
  30. package/src/lib/formatUrl.js +1 -1
  31. package/src/lib/location-handler.js +5 -5
  32. package/src/lib/query-handler.js +7 -7
  33. package/src/lib/toSentenceCase.js +8 -8
  34. package/src/login-button.js +79 -79
  35. package/src/media-button.js +113 -113
  36. package/src/media-menu.js +133 -133
  37. package/src/media-slider.js +104 -104
  38. package/src/media-subnav.js +112 -112
  39. package/src/more-slider.js +33 -33
  40. package/src/nav-search.js +125 -125
  41. package/src/primary-nav.js +215 -203
  42. package/src/save-page-form.js +59 -59
  43. package/src/search-menu.js +115 -115
  44. package/src/signed-out-dropdown.js +10 -10
  45. package/src/styles/base.js +48 -48
  46. package/src/styles/desktop-subnav.js +37 -37
  47. package/src/styles/dropdown-menu.js +149 -139
  48. package/src/styles/ia-topnav.js +88 -88
  49. package/src/styles/login-button.js +70 -70
  50. package/src/styles/media-button.js +153 -153
  51. package/src/styles/media-menu.js +70 -70
  52. package/src/styles/media-slider.js +81 -81
  53. package/src/styles/media-subnav.js +156 -156
  54. package/src/styles/more-slider.js +15 -15
  55. package/src/styles/nav-search.js +134 -134
  56. package/src/styles/primary-nav.js +298 -258
  57. package/src/styles/save-page-form.js +53 -53
  58. package/src/styles/search-menu.js +99 -99
  59. package/src/styles/signed-out-dropdown.js +31 -31
  60. package/src/styles/user-menu.js +31 -31
  61. package/src/styles/wayback-search.js +48 -48
  62. package/src/styles/wayback-slider.js +30 -30
  63. package/src/tracked-element.js +27 -27
  64. package/src/user-menu.js +42 -42
  65. package/src/wayback-search.js +18 -18
  66. package/src/wayback-slider.js +88 -88
  67. package/test/assets/img/hamburger.test.js +15 -15
  68. package/test/assets/img/user.test.js +15 -15
  69. package/test/data/menus.test.js +19 -19
  70. package/test/dropdown-menu.test.js +25 -25
  71. package/test/ia-icon.test.js +13 -13
  72. package/test/ia-topnav.test.js +273 -273
  73. package/test/login-button.test.js +15 -15
  74. package/test/media-button.test.js +19 -19
  75. package/test/media-menu.test.js +40 -40
  76. package/test/media-slider.test.js +57 -57
  77. package/test/more-slider.test.js +13 -13
  78. package/test/nav-search.test.js +61 -61
  79. package/test/primary-nav.test.js +82 -82
  80. package/test/save-page-form.test.js +35 -35
  81. package/test/search-menu.test.js +49 -49
  82. package/test/user-menu.test.js +33 -33
  83. package/test/wayback-slider.test.js +80 -80
@@ -1,49 +1,49 @@
1
- import { html, fixture, expect } from '@open-wc/testing';
2
-
3
- import '../src/search-menu';
4
-
5
- const component = html`<search-menu></search-menu>`;
6
-
7
- describe('<search-menu>', () => {
8
- it('sets default properties', async () => {
9
- const el = await fixture(component);
10
-
11
- expect(el.searchMenuOpen).to.be.false;
12
- expect(el.searchMenuAnimate).to.be.false;
13
- expect(el.selectedSearchType).to.equal('');
14
- });
15
-
16
- it('sets selected search type', async () => {
17
- const el = await fixture(component);
18
- const value = 'text';
19
-
20
- el.selectSearchType({
21
- target: {
22
- value
23
- }
24
- });
25
-
26
- expect(el.selectedSearchType).to.equal(value);
27
- });
28
-
29
- it('renders with closed class if done animating', async () => {
30
- const el = await fixture(component);
31
-
32
- el.searchMenuAnimate = true;
33
- await el.updateComplete;
34
-
35
- expect(el.shadowRoot.querySelector('.search-menu-inner').classList.contains('closed')).to.be.true;
36
- });
37
-
38
- it('omits rendering of an option when hiddenSearchOptions has a value', async () => {
39
- const el = await fixture(component);
40
- const hiddenSearchOptions = ['WEB', 'RADIO'];
41
-
42
- el.config = { hiddenSearchOptions };
43
- await el.updateComplete;
44
-
45
- hiddenSearchOptions.forEach((value) => {
46
- expect(el.shadowRoot.querySelector(`[value=${value}]`)).to.equal(null);
47
- });
48
- });
49
- });
1
+ import { html, fixture, expect } from '@open-wc/testing';
2
+
3
+ import '../src/search-menu';
4
+
5
+ const component = html`<search-menu></search-menu>`;
6
+
7
+ describe('<search-menu>', () => {
8
+ it('sets default properties', async () => {
9
+ const el = await fixture(component);
10
+
11
+ expect(el.searchMenuOpen).to.be.false;
12
+ expect(el.searchMenuAnimate).to.be.false;
13
+ expect(el.selectedSearchType).to.equal('');
14
+ });
15
+
16
+ it('sets selected search type', async () => {
17
+ const el = await fixture(component);
18
+ const value = 'text';
19
+
20
+ el.selectSearchType({
21
+ target: {
22
+ value
23
+ }
24
+ });
25
+
26
+ expect(el.selectedSearchType).to.equal(value);
27
+ });
28
+
29
+ it('renders with closed class if done animating', async () => {
30
+ const el = await fixture(component);
31
+
32
+ el.searchMenuAnimate = true;
33
+ await el.updateComplete;
34
+
35
+ expect(el.shadowRoot.querySelector('.search-menu-inner').classList.contains('closed')).to.be.true;
36
+ });
37
+
38
+ it('omits rendering of an option when hiddenSearchOptions has a value', async () => {
39
+ const el = await fixture(component);
40
+ const hiddenSearchOptions = ['WEB', 'RADIO'];
41
+
42
+ el.config = { hiddenSearchOptions };
43
+ await el.updateComplete;
44
+
45
+ hiddenSearchOptions.forEach((value) => {
46
+ expect(el.shadowRoot.querySelector(`[value=${value}]`)).to.equal(null);
47
+ });
48
+ });
49
+ });
@@ -1,33 +1,33 @@
1
- import { html, fixture, expect } from '@open-wc/testing';
2
- import '../src/user-menu';
3
- import { buildTopNavMenus } from '../../src/data/menus.js';
4
-
5
- const component = html`<user-menu></user-menu>`;
6
- const component2 = html`<user-menu screenName="brewster"></user-menu>`;
7
-
8
- describe('<user-menu>', () => {
9
- it('does not render admin links for logged out users', async () => {
10
- const el = await fixture(component);
11
- el.menuItems = buildTopNavMenus().user;
12
-
13
- await el.updateComplete;
14
-
15
- expect(el.shadowRoot.querySelectorAll('li').length).to.be.gt(0);
16
- expect(el.shadowRoot.querySelectorAll('.divider').length).to.equal(0);
17
- });
18
-
19
- it('does not render admin links for logged in users', async () => {
20
- // NOTE: top-nav never renders admin links now -- that's been delegated to dynamic JS insertion
21
- // in petabox tree (since it's only relevant there).
22
- const el = await fixture(component2);
23
- el.menuItems = buildTopNavMenus('brewster_userid').user;
24
-
25
- await el.updateComplete;
26
-
27
- expect(el.shadowRoot.querySelectorAll('li').length).to.be.gt(0);
28
- expect(el.shadowRoot.querySelectorAll('.divider').length).to.equal(0);
29
-
30
- expect(el.shadowRoot.querySelectorAll('h3').length).to.equal(1);
31
- expect(el.shadowRoot.querySelector('h3').innerText).to.equal('brewster');
32
- });
33
- });
1
+ import { html, fixture, expect } from '@open-wc/testing';
2
+ import '../src/user-menu';
3
+ import { buildTopNavMenus } from '../../src/data/menus.js';
4
+
5
+ const component = html`<user-menu></user-menu>`;
6
+ const component2 = html`<user-menu screenName="brewster"></user-menu>`;
7
+
8
+ describe('<user-menu>', () => {
9
+ it('does not render admin links for logged out users', async () => {
10
+ const el = await fixture(component);
11
+ el.menuItems = buildTopNavMenus().user;
12
+
13
+ await el.updateComplete;
14
+
15
+ expect(el.shadowRoot.querySelectorAll('li').length).to.be.gt(0);
16
+ expect(el.shadowRoot.querySelectorAll('.divider').length).to.equal(0);
17
+ });
18
+
19
+ it('does not render admin links for logged in users', async () => {
20
+ // NOTE: top-nav never renders admin links now -- that's been delegated to dynamic JS insertion
21
+ // in petabox tree (since it's only relevant there).
22
+ const el = await fixture(component2);
23
+ el.menuItems = buildTopNavMenus('brewster_userid').user;
24
+
25
+ await el.updateComplete;
26
+
27
+ expect(el.shadowRoot.querySelectorAll('li').length).to.be.gt(0);
28
+ expect(el.shadowRoot.querySelectorAll('.divider').length).to.equal(0);
29
+
30
+ expect(el.shadowRoot.querySelectorAll('h3').length).to.equal(1);
31
+ expect(el.shadowRoot.querySelector('h3').innerText).to.equal('brewster');
32
+ });
33
+ });
@@ -1,80 +1,80 @@
1
- import { html, fixture, expect } from '@open-wc/testing';
2
-
3
- import '../src/wayback-slider';
4
-
5
- const component = ({
6
- archiveItLinks,
7
- browserExtensionsLinks,
8
- config,
9
- mobileAppsLinks
10
- }) => (
11
- html`
12
- <wayback-slider
13
- .baseHost='archive.org'
14
- .config=${config}
15
- .archiveItLinks=${archiveItLinks}
16
- .browserExtensionsLinks=${browserExtensionsLinks}
17
- .mobileAppsLinks=${mobileAppsLinks}
18
- ></wayback-slider>
19
- `
20
- );
21
-
22
- const buildDefaults = () => ({
23
- config: {},
24
- archiveItLinks: [{
25
- url: '1',
26
- title: 'first'
27
- }, {
28
- url: '2',
29
- title: 'second'
30
- }],
31
- browserExtensionsLinks: [{
32
- url: '3',
33
- title: 'third'
34
- }, {
35
- url: '4',
36
- title: 'fourth'
37
- }],
38
- mobileAppsLinks: [{
39
- url: '5',
40
- title: 'fifth'
41
- }, {
42
- url: '6',
43
- title: 'sixth'
44
- }]
45
- });
46
-
47
- describe('<wayback-slider>', () => {
48
- it('renders the links passed in via the archiveItLinks prop', async () => {
49
- const options = buildDefaults();
50
- const el = await fixture(component(options));
51
- const anchors = el.shadowRoot.querySelectorAll('.archive-it a');
52
-
53
- options.archiveItLinks.forEach((link, i) => {
54
- expect(anchors[i].innerText).to.equal(link.title);
55
- expect(anchors[i].getAttribute('href')).to.contain(link.url);
56
- });
57
- });
58
-
59
- it('renders the links passed in via the browserExtensionsLinks prop', async () => {
60
- const options = buildDefaults();
61
- const el = await fixture(component(options));
62
- const anchors = el.shadowRoot.querySelectorAll('.browser-extensions a');
63
-
64
- options.browserExtensionsLinks.forEach((link, i) => {
65
- expect(anchors[i].innerText).to.equal(link.title);
66
- expect(anchors[i].getAttribute('href')).to.contain(link.url);
67
- });
68
- });
69
-
70
- it('renders the links passed in via the mobileAppsLinks prop', async () => {
71
- const options = buildDefaults();
72
- const el = await fixture(component(options));
73
- const anchors = el.shadowRoot.querySelectorAll('.mobile-apps a');
74
-
75
- options.mobileAppsLinks.forEach((link, i) => {
76
- expect(anchors[i].innerText).to.equal(link.title);
77
- expect(anchors[i].getAttribute('href')).to.contain(link.url);
78
- });
79
- });
80
- });
1
+ import { html, fixture, expect } from '@open-wc/testing';
2
+
3
+ import '../src/wayback-slider';
4
+
5
+ const component = ({
6
+ archiveItLinks,
7
+ browserExtensionsLinks,
8
+ config,
9
+ mobileAppsLinks
10
+ }) => (
11
+ html`
12
+ <wayback-slider
13
+ .baseHost='archive.org'
14
+ .config=${config}
15
+ .archiveItLinks=${archiveItLinks}
16
+ .browserExtensionsLinks=${browserExtensionsLinks}
17
+ .mobileAppsLinks=${mobileAppsLinks}
18
+ ></wayback-slider>
19
+ `
20
+ );
21
+
22
+ const buildDefaults = () => ({
23
+ config: {},
24
+ archiveItLinks: [{
25
+ url: '1',
26
+ title: 'first'
27
+ }, {
28
+ url: '2',
29
+ title: 'second'
30
+ }],
31
+ browserExtensionsLinks: [{
32
+ url: '3',
33
+ title: 'third'
34
+ }, {
35
+ url: '4',
36
+ title: 'fourth'
37
+ }],
38
+ mobileAppsLinks: [{
39
+ url: '5',
40
+ title: 'fifth'
41
+ }, {
42
+ url: '6',
43
+ title: 'sixth'
44
+ }]
45
+ });
46
+
47
+ describe('<wayback-slider>', () => {
48
+ it('renders the links passed in via the archiveItLinks prop', async () => {
49
+ const options = buildDefaults();
50
+ const el = await fixture(component(options));
51
+ const anchors = el.shadowRoot.querySelectorAll('.archive-it a');
52
+
53
+ options.archiveItLinks.forEach((link, i) => {
54
+ expect(anchors[i].innerText).to.equal(link.title);
55
+ expect(anchors[i].getAttribute('href')).to.contain(link.url);
56
+ });
57
+ });
58
+
59
+ it('renders the links passed in via the browserExtensionsLinks prop', async () => {
60
+ const options = buildDefaults();
61
+ const el = await fixture(component(options));
62
+ const anchors = el.shadowRoot.querySelectorAll('.browser-extensions a');
63
+
64
+ options.browserExtensionsLinks.forEach((link, i) => {
65
+ expect(anchors[i].innerText).to.equal(link.title);
66
+ expect(anchors[i].getAttribute('href')).to.contain(link.url);
67
+ });
68
+ });
69
+
70
+ it('renders the links passed in via the mobileAppsLinks prop', async () => {
71
+ const options = buildDefaults();
72
+ const el = await fixture(component(options));
73
+ const anchors = el.shadowRoot.querySelectorAll('.mobile-apps a');
74
+
75
+ options.mobileAppsLinks.forEach((link, i) => {
76
+ expect(anchors[i].innerText).to.equal(link.title);
77
+ expect(anchors[i].getAttribute('href')).to.contain(link.url);
78
+ });
79
+ });
80
+ });