@internetarchive/ia-topnav 1.2.2-alpha7 → 1.3.0-WEBDEV-8274-1

package/.prettierignore

@@ -0,0 +1 @@
+coverage

package/README.md

@@ -5,7 +5,7 @@ https://git.archive.org/www/offshoot/-/blob/main/guides/update-top-nav.md
 ## Installation
 
 ```bash
-yarn add @internetarchive/ia-topnav
+npm i -S @internetarchive/ia-topnav
 ```
 
 ## Usage
@@ -13,7 +13,7 @@ yarn add @internetarchive/ia-topnav
 @see [www/index.html](www/index.html) for the simplest example with all the defaults
 
 * Demo app is in another directory: `/www/index.html`
-  * `npm|yarn start` - runs local server in Demo directory which is in `/www` folder
+  * `npm run start` - runs local server in Demo directory which is in `/www` folder
   * you can also just use your preferred server
   * open demo: `http://localhost:8000/www/index.html`
 
@@ -45,7 +45,7 @@ export default IATopNav;
     --grey80: #ccc;
     --errorYellow: #ffcd27;
 
-    --linkColor: #428bca;
+    --linkColor: #4b64ff;
     --linkHoverColor: var(--white);
     --subnavLinkColor: var(--grey66);
     --primaryTextColor: var(--white);
@@ -118,30 +118,30 @@ Please see [src/data/menus.js](the menu objects) for our valid `menus` property.
 ## Prerequisite
 
 ```bash
-yarn install
+npm install
 ```
 
 ## Start Development Server
 
 ```bash
-yarn start  // start development server and typescript compiler
+npm run start  // start development server and typescript compiler
 ```
 then open demo - http://localhost:8000/www/index.html
 
 ## Testing
 
 ```bash
-yarn test
+npm run test
 ```
 
 ## Testing via browserstack
 
 ```bash
-yarn test:bs
+npm run test:bs
 ```
 
 ## Linting
 
 ```bash
-yarn lint
+npm run lint
 ```

package/demo/app-root.ts

@@ -0,0 +1,183 @@
+import { html, css, LitElement, TemplateResult } from 'lit';
+import { customElement, query, state } from 'lit/decorators.js';
+import '../src/ia-topnav';
+import type { IATopNav } from '../src/ia-topnav';
+
+@customElement('app-root')
+export class AppRoot extends LitElement {
+  @query('ia-topnav')
+  private topnav!: IATopNav;
+
+  @state() private admin = false;
+
+  @state() private canManageFlags = false;
+
+  @state() private username = '@foo';
+
+  @state() private screenName = '@foo-user';
+
+  @state() private itemIdentifier = '';
+
+  render() {
+    return html`
+      <ia-topnav
+        ?admin=${this.admin}
+        ?canManageFlags=${this.canManageFlags}
+        .username=${this.username}
+        .screenName=${this.screenName}
+        .itemIdentifier=${this.itemIdentifier}
+      >
+      </ia-topnav>
+
+      ${this.devTools}
+    `;
+  }
+
+  private get devTools(): TemplateResult {
+    return html`
+      <div id="dev-tools">
+        <h1>Dev Tools</h1>
+
+        <h2>User menu</h2>
+        <fieldset>
+          <ul>
+            <li>
+              <button
+                @click=${() => {
+                  this.screenName = 'brewster';
+                  this.username = '@brewster';
+                }}
+              >
+                Switch username to brewster
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+                  this.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';
+                  this.username = '@test';
+                }}
+              >
+                Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+                  this.screenName =
+                    'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز';
+                  this.username = '@test';
+                }}
+              >
+                Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور
+                محمد العجوز
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+                  this.username = '';
+                  this.screenName = '';
+                }}
+              >
+                Switch to logged out
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+                  this.itemIdentifier = this.admin ? '' : 'boop';
+                  this.admin = !this.admin;
+                }}
+              >
+                Toggle admin mode (${this.admin ? 'on' : 'off'}) (requires
+                logged in)
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+                  this.canManageFlags = !this.canManageFlags;
+                }}
+              >
+                Toggle manage flags mode (${this.canManageFlags ? 'on' : 'off'})
+                (requires admin mode)
+              </button>
+            </li>
+          </ul>
+        </fieldset>
+
+        <h2>Local Links</h2>
+        <fieldset>
+          <button
+            @click=${() => {
+              this.topnav.localLinks = false;
+            }}
+          >
+            Disable local links
+          </button>
+          <button
+            @click=${() => {
+              this.topnav.localLinks = true;
+            }}
+          >
+            Enable local links
+          </button>
+        </fieldset>
+
+        <h2>Wayback Count</h2>
+        <fieldset>
+          <button
+            @click=${() => {
+              this.topnav.waybackPagesArchived = 'many, MAAAANNNY';
+            }}
+          >
+            Change WB pages count
+          </button>
+
+          <button
+            @click=${() => {
+              this.topnav.waybackPagesArchived = '740 billion';
+            }}
+          >
+            Reset WB pages count
+          </button>
+        </fieldset>
+
+        <h2>Search</h2>
+        <fieldset>
+          <button
+            @click=${() => {
+              this.topnav.hideSearch = true;
+            }}
+          >
+            Hide Top Row Search button, like on mobile
+          </button>
+          <button
+            @click=${() => {
+              this.topnav.hideSearch = false;
+            }}
+          >
+            Show Top Row Search button, like on mobile
+          </button>
+        </fieldset>
+      </div>
+    `;
+  }
+
+  static styles = css`
+    :host {
+      display: block;
+      font-family: sans-serif;
+    }
+
+    #dev-tools {
+      margin: 1rem;
+    }
+  `;
+}

package/demo/index.html

@@ -0,0 +1,28 @@
+<!doctype html>
+<html lang="en-GB">
+
+<head>
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <meta charset="utf-8">
+  <title>Internet Archive topnav component</title>
+  <style>
+    html {
+      font-size: 10px;
+    }
+
+    body {
+      background: #fafafa;
+      margin: 0;
+      padding: 0;
+    }
+  </style>
+</head>
+
+<body>
+  <app-root></app-root>
+
+  <script type="module" src="../dist/demo/app-root.js">
+  </script>
+</body>
+
+</html>

package/dist/demo/app-root.d.ts

@@ -0,0 +1,13 @@
+import { LitElement, TemplateResult } from 'lit';
+import '../src/ia-topnav';
+export declare class AppRoot extends LitElement {
+    private topnav;
+    private admin;
+    private canManageFlags;
+    private username;
+    private screenName;
+    private itemIdentifier;
+    render(): TemplateResult<1>;
+    private get devTools();
+    static styles: import("lit").CSSResult;
+}

package/dist/demo/app-root.js

@@ -0,0 +1,197 @@
+import { __decorate } from "tslib";
+import { html, css, LitElement } from 'lit';
+import { customElement, query, state } from 'lit/decorators.js';
+import '../src/ia-topnav';
+let AppRoot = class AppRoot extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.admin = false;
+        this.canManageFlags = false;
+        this.username = '@foo';
+        this.screenName = '@foo-user';
+        this.itemIdentifier = '';
+    }
+    render() {
+        return html `
+      <ia-topnav
+        ?admin=${this.admin}
+        ?canManageFlags=${this.canManageFlags}
+        .username=${this.username}
+        .screenName=${this.screenName}
+        .itemIdentifier=${this.itemIdentifier}
+      >
+      </ia-topnav>
+
+      ${this.devTools}
+    `;
+    }
+    get devTools() {
+        return html `
+      <div id="dev-tools">
+        <h1>Dev Tools</h1>
+
+        <h2>User menu</h2>
+        <fieldset>
+          <ul>
+            <li>
+              <button
+                @click=${() => {
+            this.screenName = 'brewster';
+            this.username = '@brewster';
+        }}
+              >
+                Switch username to brewster
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+            this.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';
+            this.username = '@test';
+        }}
+              >
+                Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+            this.screenName =
+                'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز';
+            this.username = '@test';
+        }}
+              >
+                Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور
+                محمد العجوز
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+            this.username = '';
+            this.screenName = '';
+        }}
+              >
+                Switch to logged out
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+            this.itemIdentifier = this.admin ? '' : 'boop';
+            this.admin = !this.admin;
+        }}
+              >
+                Toggle admin mode (${this.admin ? 'on' : 'off'}) (requires
+                logged in)
+              </button>
+            </li>
+
+            <li>
+              <button
+                @click=${() => {
+            this.canManageFlags = !this.canManageFlags;
+        }}
+              >
+                Toggle manage flags mode (${this.canManageFlags ? 'on' : 'off'})
+                (requires admin mode)
+              </button>
+            </li>
+          </ul>
+        </fieldset>
+
+        <h2>Local Links</h2>
+        <fieldset>
+          <button
+            @click=${() => {
+            this.topnav.localLinks = false;
+        }}
+          >
+            Disable local links
+          </button>
+          <button
+            @click=${() => {
+            this.topnav.localLinks = true;
+        }}
+          >
+            Enable local links
+          </button>
+        </fieldset>
+
+        <h2>Wayback Count</h2>
+        <fieldset>
+          <button
+            @click=${() => {
+            this.topnav.waybackPagesArchived = 'many, MAAAANNNY';
+        }}
+          >
+            Change WB pages count
+          </button>
+
+          <button
+            @click=${() => {
+            this.topnav.waybackPagesArchived = '740 billion';
+        }}
+          >
+            Reset WB pages count
+          </button>
+        </fieldset>
+
+        <h2>Search</h2>
+        <fieldset>
+          <button
+            @click=${() => {
+            this.topnav.hideSearch = true;
+        }}
+          >
+            Hide Top Row Search button, like on mobile
+          </button>
+          <button
+            @click=${() => {
+            this.topnav.hideSearch = false;
+        }}
+          >
+            Show Top Row Search button, like on mobile
+          </button>
+        </fieldset>
+      </div>
+    `;
+    }
+};
+AppRoot.styles = css `
+    :host {
+      display: block;
+      font-family: sans-serif;
+    }
+
+    #dev-tools {
+      margin: 1rem;
+    }
+  `;
+__decorate([
+    query('ia-topnav')
+], AppRoot.prototype, "topnav", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "admin", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "canManageFlags", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "username", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "screenName", void 0);
+__decorate([
+    state()
+], AppRoot.prototype, "itemIdentifier", void 0);
+AppRoot = __decorate([
+    customElement('app-root')
+], AppRoot);
+export { AppRoot };
+//# sourceMappingURL=app-root.js.map

package/dist/demo/app-root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-root.js","sourceRoot":"","sources":["../../demo/app-root.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement, TemplateResult } from 'lit';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport '../src/ia-topnav';\nimport type { IATopNav } from '../src/ia-topnav';\n\n@customElement('app-root')\nexport class AppRoot extends LitElement {\n  @query('ia-topnav')\n  private topnav!: IATopNav;\n\n  @state() private admin = false;\n\n  @state() private canManageFlags = false;\n\n  @state() private username = '@foo';\n\n  @state() private screenName = '@foo-user';\n\n  @state() private itemIdentifier = '';\n\n  render() {\n    return html`\n      <ia-topnav\n        ?admin=${this.admin}\n        ?canManageFlags=${this.canManageFlags}\n        .username=${this.username}\n        .screenName=${this.screenName}\n        .itemIdentifier=${this.itemIdentifier}\n      >\n      </ia-topnav>\n\n      ${this.devTools}\n    `;\n  }\n\n  private get devTools(): TemplateResult {\n    return html`\n      <div id=\"dev-tools\">\n        <h1>Dev Tools</h1>\n\n        <h2>User menu</h2>\n        <fieldset>\n          <ul>\n            <li>\n              <button\n                @click=${() => {\n                  this.screenName = 'brewster';\n                  this.username = '@brewster';\n                }}\n              >\n                Switch username to brewster\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n                  this.screenName = 'a😊b😊c😊d😊e😊f😊g😊h😊i😊';\n                  this.username = '@test';\n                }}\n              >\n                Switch username to a😊b😊c😊d😊e😊f😊g😊h😊i😊\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n                  this.screenName =\n                    'الدكتور محمالدكتور محمد العجوز محمالدكتور محمد العجوز';\n                  this.username = '@test';\n                }}\n              >\n                Switch username to محمالدكتور محمد العجوز الدكتور محمالدكتور\n                محمد العجوز\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n                  this.username = '';\n                  this.screenName = '';\n                }}\n              >\n                Switch to logged out\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n                  this.itemIdentifier = this.admin ? '' : 'boop';\n                  this.admin = !this.admin;\n                }}\n              >\n                Toggle admin mode (${this.admin ? 'on' : 'off'}) (requires\n                logged in)\n              </button>\n            </li>\n\n            <li>\n              <button\n                @click=${() => {\n                  this.canManageFlags = !this.canManageFlags;\n                }}\n              >\n                Toggle manage flags mode (${this.canManageFlags ? 'on' : 'off'})\n                (requires admin mode)\n              </button>\n            </li>\n          </ul>\n        </fieldset>\n\n        <h2>Local Links</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.localLinks = false;\n            }}\n          >\n            Disable local links\n          </button>\n          <button\n            @click=${() => {\n              this.topnav.localLinks = true;\n            }}\n          >\n            Enable local links\n          </button>\n        </fieldset>\n\n        <h2>Wayback Count</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.waybackPagesArchived = 'many, MAAAANNNY';\n            }}\n          >\n            Change WB pages count\n          </button>\n\n          <button\n            @click=${() => {\n              this.topnav.waybackPagesArchived = '740 billion';\n            }}\n          >\n            Reset WB pages count\n          </button>\n        </fieldset>\n\n        <h2>Search</h2>\n        <fieldset>\n          <button\n            @click=${() => {\n              this.topnav.hideSearch = true;\n            }}\n          >\n            Hide Top Row Search button, like on mobile\n          </button>\n          <button\n            @click=${() => {\n              this.topnav.hideSearch = false;\n            }}\n          >\n            Show Top Row Search button, like on mobile\n          </button>\n        </fieldset>\n      </div>\n    `;\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n      font-family: sans-serif;\n    }\n\n    #dev-tools {\n      margin: 1rem;\n    }\n  `;\n}\n"]}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+import { IATopNav } from './src/ia-topnav';
+export { IATopNav };

package/dist/index.js

@@ -0,0 +1,3 @@
+import { IATopNav } from './src/ia-topnav';
+export { IATopNav };
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE3C,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import { IATopNav } from './src/ia-topnav';\n\nexport { IATopNav };\n"]}

package/dist/src/assets/img/hamburger.d.ts

@@ -0,0 +1,7 @@
+import Icon from './icon';
+export declare class HamBurger extends Icon {
+    static get styles(): import("lit").CSSResult;
+    static get closed(): import("lit").TemplateResult<1>;
+    static get opened(): import("lit").TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/src/assets/img/hamburger.js

@@ -0,0 +1,51 @@
+var HamBurger_1;
+import { __decorate } from "tslib";
+import { html, css } from 'lit';
+import Icon from './icon';
+import icons from './icons';
+import { customElement } from 'lit/decorators.js';
+let HamBurger = HamBurger_1 = class HamBurger extends Icon {
+    static get styles() {
+        return css `
+      svg {
+        display: block;
+        height: 4rem;
+        width: 4rem;
+      }
+      .fill-color {
+        fill: var(--activeColor);
+      }
+    `;
+    }
+    static get closed() {
+        return html `
+      <svg
+        viewBox="0 0 40 40"
+        xmlns="http://www.w3.org/2000/svg"
+        aria-labelledby="hamburgerTitleID hamburgerDescID"
+      >
+        <title id="hamburgerTitleID">Hamburger icon</title>
+        <desc id="hamburgerDescID">
+          An icon used to represent a menu that can be toggled by interacting
+          with this icon.
+        </desc>
+        <path
+          d="m30.5 26.5c.8284271 0 1.5.6715729 1.5 1.5s-.6715729 1.5-1.5 1.5h-21c-.82842712 0-1.5-.6715729-1.5-1.5s.67157288-1.5 1.5-1.5zm0-8c.8284271 0 1.5.6715729 1.5 1.5s-.6715729 1.5-1.5 1.5h-21c-.82842712 0-1.5-.6715729-1.5-1.5s.67157288-1.5 1.5-1.5zm0-8c.8284271 0 1.5.6715729 1.5 1.5s-.6715729 1.5-1.5 1.5h-21c-.82842712 0-1.5-.6715729-1.5-1.5s.67157288-1.5 1.5-1.5z"
+          fill="#999"
+          fill-rule="evenodd"
+        />
+      </svg>
+    `;
+    }
+    static get opened() {
+        return icons.close;
+    }
+    render() {
+        return this.active ? HamBurger_1.opened : HamBurger_1.closed;
+    }
+};
+HamBurger = HamBurger_1 = __decorate([
+    customElement('icon-hamburger')
+], HamBurger);
+export { HamBurger };
+//# sourceMappingURL=hamburger.js.map

package/dist/src/assets/img/hamburger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hamburger.js","sourceRoot":"","sources":["../../../../src/assets/img/hamburger.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAG3C,IAAM,SAAS,iBAAf,MAAM,SAAU,SAAQ,IAAI;IACjC,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;KAST,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,IAAI,CAAA;;;;;;;;;;;;;;;;;KAiBV,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,KAAK,CAAC,KAAK,CAAC;IACrB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,WAAS,CAAC,MAAM,CAAC,CAAC,CAAC,WAAS,CAAC,MAAM,CAAC;IAC3D,CAAC;CACF,CAAA;AA1CY,SAAS;IADrB,aAAa,CAAC,gBAAgB,CAAC;GACnB,SAAS,CA0CrB","sourcesContent":["import { html, css } from 'lit';\nimport Icon from './icon';\nimport icons from './icons';\nimport { customElement } from 'lit/decorators.js';\n\n@customElement('icon-hamburger')\nexport class HamBurger extends Icon {\n  static get styles() {\n    return css`\n      svg {\n        display: block;\n        height: 4rem;\n        width: 4rem;\n      }\n      .fill-color {\n        fill: var(--activeColor);\n      }\n    `;\n  }\n\n  static get closed() {\n    return html`\n      <svg\n        viewBox=\"0 0 40 40\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        aria-labelledby=\"hamburgerTitleID hamburgerDescID\"\n      >\n        <title id=\"hamburgerTitleID\">Hamburger icon</title>\n        <desc id=\"hamburgerDescID\">\n          An icon used to represent a menu that can be toggled by interacting\n          with this icon.\n        </desc>\n        <path\n          d=\"m30.5 26.5c.8284271 0 1.5.6715729 1.5 1.5s-.6715729 1.5-1.5 1.5h-21c-.82842712 0-1.5-.6715729-1.5-1.5s.67157288-1.5 1.5-1.5zm0-8c.8284271 0 1.5.6715729 1.5 1.5s-.6715729 1.5-1.5 1.5h-21c-.82842712 0-1.5-.6715729-1.5-1.5s.67157288-1.5 1.5-1.5zm0-8c.8284271 0 1.5.6715729 1.5 1.5s-.6715729 1.5-1.5 1.5h-21c-.82842712 0-1.5-.6715729-1.5-1.5s.67157288-1.5 1.5-1.5z\"\n          fill=\"#999\"\n          fill-rule=\"evenodd\"\n        />\n      </svg>\n    `;\n  }\n\n  static get opened() {\n    return icons.close;\n  }\n\n  render() {\n    return this.active ? HamBurger.opened : HamBurger.closed;\n  }\n}\n"]}

package/dist/src/assets/img/ia-icon.d.ts

@@ -0,0 +1,7 @@
+import { LitElement, TemplateResult } from 'lit';
+import './icons';
+export declare class IAIcon extends LitElement {
+    icon: string;
+    static get icons(): Record<string, TemplateResult>;
+    render(): TemplateResult;
+}

package/dist/src/assets/img/ia-icon.js

@@ -0,0 +1,33 @@
+var IAIcon_1;
+import { __decorate } from "tslib";
+import { LitElement, html } from 'lit';
+import './icons';
+import { customElement, property } from 'lit/decorators.js';
+let IAIcon = IAIcon_1 = class IAIcon extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.icon = '';
+    }
+    static get icons() {
+        return {
+            audio: html `<icon-audio></icon-audio>`,
+            ellipses: html `<icon-ellipses></icon-ellipses>`,
+            images: html `<icon-images></icon-images>`,
+            software: html `<icon-software></icon-software>`,
+            texts: html `<icon-texts></icon-texts>`,
+            video: html `<icon-video></icon-video>`,
+            web: html `<icon-web></icon-web>`,
+        };
+    }
+    render() {
+        return IAIcon_1.icons[this.icon];
+    }
+};
+__decorate([
+    property({ type: String })
+], IAIcon.prototype, "icon", void 0);
+IAIcon = IAIcon_1 = __decorate([
+    customElement('ia-icon')
+], IAIcon);
+export { IAIcon };
+//# sourceMappingURL=ia-icon.js.map

package/dist/src/assets/img/ia-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ia-icon.js","sourceRoot":"","sources":["../../../../src/assets/img/ia-icon.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAE,MAAM,KAAK,CAAC;AACvD,OAAO,SAAS,CAAC;AACjB,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAGrD,IAAM,MAAM,cAAZ,MAAM,MAAO,SAAQ,UAAU;IAA/B;;QACuB,SAAI,GAAG,EAAE,CAAC;IAiBxC,CAAC;IAfC,MAAM,KAAK,KAAK;QACd,OAAO;YACL,KAAK,EAAE,IAAI,CAAA,2BAA2B;YACtC,QAAQ,EAAE,IAAI,CAAA,iCAAiC;YAC/C,MAAM,EAAE,IAAI,CAAA,6BAA6B;YACzC,QAAQ,EAAE,IAAI,CAAA,iCAAiC;YAC/C,KAAK,EAAE,IAAI,CAAA,2BAA2B;YACtC,KAAK,EAAE,IAAI,CAAA,2BAA2B;YACtC,GAAG,EAAE,IAAI,CAAA,uBAAuB;SACjC,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,QAAM,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC;CACF,CAAA;AAjB6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAAW;AAD3B,MAAM;IADlB,aAAa,CAAC,SAAS,CAAC;GACZ,MAAM,CAkBlB","sourcesContent":["import { LitElement, TemplateResult, html } from 'lit';\nimport './icons';\nimport { customElement, property } from 'lit/decorators.js';\n\n@customElement('ia-icon')\nexport class IAIcon extends LitElement {\n  @property({ type: String }) icon = '';\n\n  static get icons(): Record<string, TemplateResult> {\n    return {\n      audio: html`<icon-audio></icon-audio>`,\n      ellipses: html`<icon-ellipses></icon-ellipses>`,\n      images: html`<icon-images></icon-images>`,\n      software: html`<icon-software></icon-software>`,\n      texts: html`<icon-texts></icon-texts>`,\n      video: html`<icon-video></icon-video>`,\n      web: html`<icon-web></icon-web>`,\n    };\n  }\n\n  render() {\n    return IAIcon.icons[this.icon];\n  }\n}\n"]}

package/dist/src/assets/img/icon-audio.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").TemplateResult<1>;
+export default _default;

package/dist/src/assets/img/icon-audio.js

@@ -0,0 +1,28 @@
+import { html } from 'lit';
+export default html `
+  <svg
+    width="40px"
+    height="40px"
+    viewBox="0 0 40 40"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    aria-labelledby="audioTitleID audioDescID"
+  >
+    <title id="audioTitleID">Audio icon</title>
+    <desc id="audioDescID">An illustration of an audio speaker.</desc>
+    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+      <g transform="translate(10, 8)" class="fill-color">
+        <path
+          d="M19.4264564,11.8585048 L19.4264564,20.7200433 C19.4264564,22.3657576 18.8838179,23.2519114 16.8489237,23.2519114 C12.2364969,23.125318 7.75972977,23.125318 3.14730298,23.2519114 C1.24806842,23.2519114 0.569770368,22.492351 0.569770368,20.7200433 L0.569770368,2.74377955 C0.569770368,1.09806526 1.11240881,0.211911416 3.14730298,0.211911416 C7.75972977,0.338504822 12.2364969,0.338504822 16.8489237,0.211911416 C18.7481583,0.211911416 19.4264564,0.971471855 19.4264564,2.74377955 C19.2907967,5.78202131 19.4264564,8.82026306 19.4264564,11.8585048 L19.4264564,11.8585048 Z M10.0659432,2.74377955 C8.16670861,2.74377955 6.67445288,4.13630702 6.67445288,5.90861471 C6.67445288,7.6809224 8.16670861,9.07344988 10.0659432,9.07344988 C11.9651777,9.07344988 13.4574335,7.6809224 13.4574335,5.90861471 C13.4574335,4.13630702 11.8295181,2.74377955 10.0659432,2.74377955 L10.0659432,2.74377955 Z M10.0659432,11.4787246 C7.21709133,11.4787246 5.04653754,13.6308125 5.04653754,16.1626806 C5.04653754,18.8211422 7.35275094,20.8466367 10.0659432,20.8466367 C12.914795,20.8466367 15.0853488,18.6945488 15.0853488,16.1626806 C15.0853488,13.6308125 12.7791354,11.4787246 10.0659432,11.4787246 L10.0659432,11.4787246 Z"
+        ></path>
+        <ellipse
+          cx="10.2016028"
+          cy="16.5690777"
+          rx="1.35659611"
+          ry="1.34075134"
+        ></ellipse>
+      </g>
+    </g>
+  </svg>
+`;
+//# sourceMappingURL=icon-audio.js.map

package/dist/src/assets/img/icon-audio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-audio.js","sourceRoot":"","sources":["../../../../src/assets/img/icon-audio.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAE3B,eAAe,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;CAyBlB,CAAC","sourcesContent":["import { html } from 'lit';\n\nexport default html`\n  <svg\n    width=\"40px\"\n    height=\"40px\"\n    viewBox=\"0 0 40 40\"\n    version=\"1.1\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    aria-labelledby=\"audioTitleID audioDescID\"\n  >\n    <title id=\"audioTitleID\">Audio icon</title>\n    <desc id=\"audioDescID\">An illustration of an audio speaker.</desc>\n    <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n      <g transform=\"translate(10, 8)\" class=\"fill-color\">\n        <path\n          d=\"M19.4264564,11.8585048 L19.4264564,20.7200433 C19.4264564,22.3657576 18.8838179,23.2519114 16.8489237,23.2519114 C12.2364969,23.125318 7.75972977,23.125318 3.14730298,23.2519114 C1.24806842,23.2519114 0.569770368,22.492351 0.569770368,20.7200433 L0.569770368,2.74377955 C0.569770368,1.09806526 1.11240881,0.211911416 3.14730298,0.211911416 C7.75972977,0.338504822 12.2364969,0.338504822 16.8489237,0.211911416 C18.7481583,0.211911416 19.4264564,0.971471855 19.4264564,2.74377955 C19.2907967,5.78202131 19.4264564,8.82026306 19.4264564,11.8585048 L19.4264564,11.8585048 Z M10.0659432,2.74377955 C8.16670861,2.74377955 6.67445288,4.13630702 6.67445288,5.90861471 C6.67445288,7.6809224 8.16670861,9.07344988 10.0659432,9.07344988 C11.9651777,9.07344988 13.4574335,7.6809224 13.4574335,5.90861471 C13.4574335,4.13630702 11.8295181,2.74377955 10.0659432,2.74377955 L10.0659432,2.74377955 Z M10.0659432,11.4787246 C7.21709133,11.4787246 5.04653754,13.6308125 5.04653754,16.1626806 C5.04653754,18.8211422 7.35275094,20.8466367 10.0659432,20.8466367 C12.914795,20.8466367 15.0853488,18.6945488 15.0853488,16.1626806 C15.0853488,13.6308125 12.7791354,11.4787246 10.0659432,11.4787246 L10.0659432,11.4787246 Z\"\n        ></path>\n        <ellipse\n          cx=\"10.2016028\"\n          cy=\"16.5690777\"\n          rx=\"1.35659611\"\n          ry=\"1.34075134\"\n        ></ellipse>\n      </g>\n    </g>\n  </svg>\n`;\n"]}