@internetarchive/ia-topnav 1.3.6 → 1.3.7-0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/.eslintrc +16 -16
  2. package/LICENSE +661 -661
  3. package/README.md +147 -147
  4. package/index.d.ts +109 -109
  5. package/index.js +3 -3
  6. package/package.json +61 -61
  7. package/src/assets/img/hamburger.js +38 -38
  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-unpadded.js +16 -16
  12. package/src/assets/img/icon-donate.js +15 -15
  13. package/src/assets/img/icon-ellipses.js +15 -15
  14. package/src/assets/img/icon-ia-logo.js +22 -22
  15. package/src/assets/img/icon-images.js +15 -15
  16. package/src/assets/img/icon-search.js +15 -15
  17. package/src/assets/img/icon-software.js +15 -15
  18. package/src/assets/img/icon-texts.js +15 -15
  19. package/src/assets/img/icon-upload-unpadded.js +14 -14
  20. package/src/assets/img/icon-upload.js +15 -15
  21. package/src/assets/img/icon-user.js +15 -15
  22. package/src/assets/img/icon-video.js +15 -15
  23. package/src/assets/img/icon-web.js +15 -15
  24. package/src/assets/img/icon.js +18 -18
  25. package/src/assets/img/icons.js +33 -33
  26. package/src/assets/img/wordmark-stacked.js +13 -13
  27. package/src/data/menus.js +646 -646
  28. package/src/desktop-subnav.js +45 -45
  29. package/src/dropdown-menu.js +110 -109
  30. package/src/ia-topnav.js +324 -314
  31. package/src/lib/formatUrl.js +1 -1
  32. package/src/lib/keyboard-navigation.js +128 -0
  33. package/src/lib/location-handler.js +5 -5
  34. package/src/lib/query-handler.js +7 -7
  35. package/src/lib/toSentenceCase.js +8 -8
  36. package/src/login-button.js +79 -79
  37. package/src/media-button.js +113 -113
  38. package/src/media-menu.js +154 -133
  39. package/src/media-slider.js +118 -104
  40. package/src/media-subnav.js +112 -112
  41. package/src/more-slider.js +33 -33
  42. package/src/nav-search.js +111 -117
  43. package/src/primary-nav.js +258 -224
  44. package/src/save-page-form.js +59 -59
  45. package/src/search-menu.js +145 -115
  46. package/src/signed-out-dropdown.js +10 -10
  47. package/src/styles/base.js +48 -48
  48. package/src/styles/desktop-subnav.js +37 -37
  49. package/src/styles/dropdown-menu.js +168 -166
  50. package/src/styles/ia-topnav.js +87 -87
  51. package/src/styles/login-button.js +82 -79
  52. package/src/styles/media-button.js +156 -156
  53. package/src/styles/media-menu.js +66 -70
  54. package/src/styles/media-slider.js +81 -81
  55. package/src/styles/media-subnav.js +156 -156
  56. package/src/styles/more-slider.js +15 -15
  57. package/src/styles/nav-search.js +136 -136
  58. package/src/styles/primary-nav.js +311 -300
  59. package/src/styles/save-page-form.js +54 -54
  60. package/src/styles/search-menu.js +105 -99
  61. package/src/styles/signed-out-dropdown.js +31 -31
  62. package/src/styles/user-menu.js +31 -31
  63. package/src/styles/wayback-search.js +48 -48
  64. package/src/styles/wayback-slider.js +30 -30
  65. package/src/tracked-element.js +29 -27
  66. package/src/user-menu.js +56 -42
  67. package/src/wayback-search.js +18 -18
  68. package/src/wayback-slider.js +87 -87
  69. package/test/assets/img/hamburger.test.js +15 -15
  70. package/test/assets/img/user.test.js +15 -15
  71. package/test/data/menus.test.js +19 -19
  72. package/test/dropdown-menu.test.js +25 -25
  73. package/test/ia-icon.test.js +13 -13
  74. package/test/ia-topnav.test.js +273 -273
  75. package/test/login-button.test.js +15 -15
  76. package/test/media-button.test.js +19 -19
  77. package/test/media-menu.test.js +40 -40
  78. package/test/media-slider.test.js +57 -57
  79. package/test/more-slider.test.js +13 -13
  80. package/test/nav-search.test.js +61 -61
  81. package/test/primary-nav.test.js +82 -82
  82. package/test/save-page-form.test.js +35 -35
  83. package/test/search-menu.test.js +49 -49
  84. package/test/user-menu.test.js +33 -33
  85. 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
+ });