@jack-henry/jh-icons 1.2.0

package/icons-wc/icon-tag-xmark.js

@@ -0,0 +1,87 @@
+// SPDX-FileCopyrightText: 2025 Jack Henry
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import {LitElement, css, html} from 'lit';
+
+export default class JhIconTagXmark extends LitElement {
+  /** @type {ElementInternals} */
+  #internals;
+
+  static get styles() {
+    return css`
+      :host {
+        fill: var(
+          --jh-icon-color-fill,
+          var(--jh-color-content-secondary-enabled)
+        );
+        width: var(--icon-size);
+        height: var(--icon-size);
+        display: inline-block;
+      }
+      :host([size='x-small']) {
+        --icon-size: var(
+          --jh-icon-size-extra-small,
+          var(--jh-size-400)
+        );
+      }
+      :host([size='small']) {
+        --icon-size: var(
+          --jh-icon-size-small,
+          var(--jh-size-500)
+        );
+      }
+      :host([size='medium']) {
+        --icon-size: var(
+          --jh-icon-size-medium,
+          var(--jh-size-600)
+        );
+      }
+      :host([size='large']) {
+        --icon-size: var(
+          --jh-icon-size-large,
+          var(--jh-size-900)
+        );
+      }
+      :host([size='x-large']) {
+        --icon-size: var(
+          --jh-icon-size-extra-large,
+          var(--jh-size-1400)
+        );
+      }
+      svg {
+        width: 100%;
+        height: 100%;
+      }
+    `;
+  }
+
+  static get properties() {
+    return {
+      /**
+      * The size of the icon.
+      */
+      size: {
+        type: String, reflect: true 
+      }
+    }
+  }
+
+  constructor() {
+    super();
+    this.#internals = this.attachInternals();
+    this.#internals.role = 'graphics-symbol';
+    this.#internals.ariaHidden = 'true';
+
+    /** @type {'x-small'|'small'|'medium'|'large'|'x-large'} */
+    this.size = 'medium';
+  }
+
+  render() {
+    return html`
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">   <path fill-rule="evenodd" d="M7.512 6.93 3.93 11.574l-.016.02-.017.02a.584.584 0 0 0 0 .775l.017.019.016.02 3.582 4.643c.11.115.263.18.422.18H20a.25.25 0 0 0 .25-.25V7a.25.25 0 0 0-.25-.25H7.934a.583.583 0 0 0-.422.18Zm-1.135-.98c.396-.445.962-.7 1.557-.7H20c.966 0 1.75.784 1.75 1.75v10A1.75 1.75 0 0 1 20 18.75H7.934a2.084 2.084 0 0 1-1.557-.699l-.017-.02-.016-.02-3.587-4.649a2.084 2.084 0 0 1 0-2.724L6.344 5.99l.016-.02.017-.02ZM9.47 8.47a.75.75 0 0 1 1.06 0L13 10.94l2.47-2.47a.75.75 0 0 1 1.06 1.06L14.06 12l2.47 2.47a.75.75 0 1 1-1.06 1.06L13 13.06l-2.47 2.47a.75.75 0 0 1-1.06-1.06L11.94 12 9.47 9.53a.75.75 0 0 1 0-1.06Z" clip-rule="evenodd"/> </svg> 
+    `;
+  }
+}
+
+customElements.define('jh-icon-tag-xmark', JhIconTagXmark);

package/icons-wc/icon-tag.js

@@ -0,0 +1,87 @@
+// SPDX-FileCopyrightText: 2025 Jack Henry
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import {LitElement, css, html} from 'lit';
+
+export default class JhIconTag extends LitElement {
+  /** @type {ElementInternals} */
+  #internals;
+
+  static get styles() {
+    return css`
+      :host {
+        fill: var(
+          --jh-icon-color-fill,
+          var(--jh-color-content-secondary-enabled)
+        );
+        width: var(--icon-size);
+        height: var(--icon-size);
+        display: inline-block;
+      }
+      :host([size='x-small']) {
+        --icon-size: var(
+          --jh-icon-size-extra-small,
+          var(--jh-size-400)
+        );
+      }
+      :host([size='small']) {
+        --icon-size: var(
+          --jh-icon-size-small,
+          var(--jh-size-500)
+        );
+      }
+      :host([size='medium']) {
+        --icon-size: var(
+          --jh-icon-size-medium,
+          var(--jh-size-600)
+        );
+      }
+      :host([size='large']) {
+        --icon-size: var(
+          --jh-icon-size-large,
+          var(--jh-size-900)
+        );
+      }
+      :host([size='x-large']) {
+        --icon-size: var(
+          --jh-icon-size-extra-large,
+          var(--jh-size-1400)
+        );
+      }
+      svg {
+        width: 100%;
+        height: 100%;
+      }
+    `;
+  }
+
+  static get properties() {
+    return {
+      /**
+      * The size of the icon.
+      */
+      size: {
+        type: String, reflect: true 
+      }
+    }
+  }
+
+  constructor() {
+    super();
+    this.#internals = this.attachInternals();
+    this.#internals.role = 'graphics-symbol';
+    this.#internals.ariaHidden = 'true';
+
+    /** @type {'x-small'|'small'|'medium'|'large'|'x-large'} */
+    this.size = 'medium';
+  }
+
+  render() {
+    return html`
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">   <path fill-rule="evenodd" d="M3.93 11.573 7.512 6.93a.583.583 0 0 1 .422-.18H20a.25.25 0 0 1 .25.25v10a.25.25 0 0 1-.25.25H7.934a.583.583 0 0 1-.422-.181L3.93 12.427l-.016-.02-.017-.02a.584.584 0 0 1 0-.774l.017-.02.016-.02ZM7.934 5.25c-.595 0-1.161.255-1.557.7l-.017.019-.016.02-3.587 4.65a2.084 2.084 0 0 0 0 2.723l3.587 4.649.016.02.017.02c.396.444.962.7 1.557.7H20A1.75 1.75 0 0 0 21.75 17V7A1.75 1.75 0 0 0 20 5.25H7.934ZM7.75 12a1.25 1.25 0 1 1 2.5 0 1.25 1.25 0 0 1-2.5 0ZM9 9.25a2.75 2.75 0 1 0 0 5.5 2.75 2.75 0 0 0 0-5.5Z" clip-rule="evenodd"/> </svg> 
+    `;
+  }
+}
+
+customElements.define('jh-icon-tag', JhIconTag);

package/icons-wc/icon-text.js

@@ -0,0 +1,87 @@
+// SPDX-FileCopyrightText: 2025 Jack Henry
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import {LitElement, css, html} from 'lit';
+
+export default class JhIconText extends LitElement {
+  /** @type {ElementInternals} */
+  #internals;
+
+  static get styles() {
+    return css`
+      :host {
+        fill: var(
+          --jh-icon-color-fill,
+          var(--jh-color-content-secondary-enabled)
+        );
+        width: var(--icon-size);
+        height: var(--icon-size);
+        display: inline-block;
+      }
+      :host([size='x-small']) {
+        --icon-size: var(
+          --jh-icon-size-extra-small,
+          var(--jh-size-400)
+        );
+      }
+      :host([size='small']) {
+        --icon-size: var(
+          --jh-icon-size-small,
+          var(--jh-size-500)
+        );
+      }
+      :host([size='medium']) {
+        --icon-size: var(
+          --jh-icon-size-medium,
+          var(--jh-size-600)
+        );
+      }
+      :host([size='large']) {
+        --icon-size: var(
+          --jh-icon-size-large,
+          var(--jh-size-900)
+        );
+      }
+      :host([size='x-large']) {
+        --icon-size: var(
+          --jh-icon-size-extra-large,
+          var(--jh-size-1400)
+        );
+      }
+      svg {
+        width: 100%;
+        height: 100%;
+      }
+    `;
+  }
+
+  static get properties() {
+    return {
+      /**
+      * The size of the icon.
+      */
+      size: {
+        type: String, reflect: true 
+      }
+    }
+  }
+
+  constructor() {
+    super();
+    this.#internals = this.attachInternals();
+    this.#internals.role = 'graphics-symbol';
+    this.#internals.ariaHidden = 'true';
+
+    /** @type {'x-small'|'small'|'medium'|'large'|'x-large'} */
+    this.size = 'medium';
+  }
+
+  render() {
+    return html`
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">   <path fill-rule="evenodd" d="M14.25 5.625H9v-1.5h12v1.5h-5.25v14.25h-1.5V5.625Zm-6.5 6H11v-1.5H3v1.5h3.25v8.25h1.5v-8.25Z" clip-rule="evenodd"/> </svg> 
+    `;
+  }
+}
+
+customElements.define('jh-icon-text', JhIconText);

package/icons-wc/icon-trash-can.js

@@ -0,0 +1,87 @@
+// SPDX-FileCopyrightText: 2025 Jack Henry
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import {LitElement, css, html} from 'lit';
+
+export default class JhIconTrashCan extends LitElement {
+  /** @type {ElementInternals} */
+  #internals;
+
+  static get styles() {
+    return css`
+      :host {
+        fill: var(
+          --jh-icon-color-fill,
+          var(--jh-color-content-secondary-enabled)
+        );
+        width: var(--icon-size);
+        height: var(--icon-size);
+        display: inline-block;
+      }
+      :host([size='x-small']) {
+        --icon-size: var(
+          --jh-icon-size-extra-small,
+          var(--jh-size-400)
+        );
+      }
+      :host([size='small']) {
+        --icon-size: var(
+          --jh-icon-size-small,
+          var(--jh-size-500)
+        );
+      }
+      :host([size='medium']) {
+        --icon-size: var(
+          --jh-icon-size-medium,
+          var(--jh-size-600)
+        );
+      }
+      :host([size='large']) {
+        --icon-size: var(
+          --jh-icon-size-large,
+          var(--jh-size-900)
+        );
+      }
+      :host([size='x-large']) {
+        --icon-size: var(
+          --jh-icon-size-extra-large,
+          var(--jh-size-1400)
+        );
+      }
+      svg {
+        width: 100%;
+        height: 100%;
+      }
+    `;
+  }
+
+  static get properties() {
+    return {
+      /**
+      * The size of the icon.
+      */
+      size: {
+        type: String, reflect: true 
+      }
+    }
+  }
+
+  constructor() {
+    super();
+    this.#internals = this.attachInternals();
+    this.#internals.role = 'graphics-symbol';
+    this.#internals.ariaHidden = 'true';
+
+    /** @type {'x-small'|'small'|'medium'|'large'|'x-large'} */
+    this.size = 'medium';
+  }
+
+  render() {
+    return html`
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">   <path fill-rule="evenodd" d="M9 3.25a.75.75 0 0 0-.75.75v2.25H5a.75.75 0 0 0 0 1.5h.75V19c0 1.032.897 1.75 1.85 1.75h8.8c.953 0 1.85-.718 1.85-1.75V7.75H19a.75.75 0 0 0 0-1.5h-3.25V4a.75.75 0 0 0-.75-.75H9Zm5.25 3v-1.5h-4.5v1.5h4.5ZM9 7.75H7.25V19c0 .044.018.099.077.152.06.054.154.098.273.098h8.8a.405.405 0 0 0 .273-.098c.059-.053.077-.108.077-.152V7.75H9ZM10.75 10a.75.75 0 0 0-1.5 0v7a.75.75 0 0 0 1.5 0v-7ZM14 9.25a.75.75 0 0 1 .75.75v7a.75.75 0 0 1-1.5 0v-7a.75.75 0 0 1 .75-.75Z" clip-rule="evenodd"/> </svg> 
+    `;
+  }
+}
+
+customElements.define('jh-icon-trash-can', JhIconTrashCan);

package/icons-wc/icon-triangle-exclamation-filled.js

@@ -0,0 +1,87 @@
+// SPDX-FileCopyrightText: 2025 Jack Henry
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import {LitElement, css, html} from 'lit';
+
+export default class JhIconTriangleExclamationFilled extends LitElement {
+  /** @type {ElementInternals} */
+  #internals;
+
+  static get styles() {
+    return css`
+      :host {
+        fill: var(
+          --jh-icon-color-fill,
+          var(--jh-color-content-secondary-enabled)
+        );
+        width: var(--icon-size);
+        height: var(--icon-size);
+        display: inline-block;
+      }
+      :host([size='x-small']) {
+        --icon-size: var(
+          --jh-icon-size-extra-small,
+          var(--jh-size-400)
+        );
+      }
+      :host([size='small']) {
+        --icon-size: var(
+          --jh-icon-size-small,
+          var(--jh-size-500)
+        );
+      }
+      :host([size='medium']) {
+        --icon-size: var(
+          --jh-icon-size-medium,
+          var(--jh-size-600)
+        );
+      }
+      :host([size='large']) {
+        --icon-size: var(
+          --jh-icon-size-large,
+          var(--jh-size-900)
+        );
+      }
+      :host([size='x-large']) {
+        --icon-size: var(
+          --jh-icon-size-extra-large,
+          var(--jh-size-1400)
+        );
+      }
+      svg {
+        width: 100%;
+        height: 100%;
+      }
+    `;
+  }
+
+  static get properties() {
+    return {
+      /**
+      * The size of the icon.
+      */
+      size: {
+        type: String, reflect: true 
+      }
+    }
+  }
+
+  constructor() {
+    super();
+    this.#internals = this.attachInternals();
+    this.#internals.role = 'graphics-symbol';
+    this.#internals.ariaHidden = 'true';
+
+    /** @type {'x-small'|'small'|'medium'|'large'|'x-large'} */
+    this.size = 'medium';
+  }
+
+  render() {
+    return html`
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">   <path fill-rule="evenodd" d="M13.876 4.28c-.845-1.373-2.906-1.373-3.752 0l-3.792 6.16-3.772 6.126c-.903 1.466.257 3.184 1.876 3.184h15.13c1.619 0 2.78-1.718 1.876-3.184l-3.773-6.127-3.792-6.158ZM12 7.25a.75.75 0 0 1 .75.75v4a.75.75 0 1 1-1.5 0V8a.75.75 0 0 1 .75-.75Zm-1 8.25a1 1 0 1 1 2 0 1 1 0 0 1-2 0Z" clip-rule="evenodd"/> </svg> 
+    `;
+  }
+}
+
+customElements.define('jh-icon-triangle-exclamation-filled', JhIconTriangleExclamationFilled);

package/icons-wc/icon-triangle-exclamation.js

@@ -0,0 +1,87 @@
+// SPDX-FileCopyrightText: 2025 Jack Henry
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import {LitElement, css, html} from 'lit';
+
+export default class JhIconTriangleExclamation extends LitElement {
+  /** @type {ElementInternals} */
+  #internals;
+
+  static get styles() {
+    return css`
+      :host {
+        fill: var(
+          --jh-icon-color-fill,
+          var(--jh-color-content-secondary-enabled)
+        );
+        width: var(--icon-size);
+        height: var(--icon-size);
+        display: inline-block;
+      }
+      :host([size='x-small']) {
+        --icon-size: var(
+          --jh-icon-size-extra-small,
+          var(--jh-size-400)
+        );
+      }
+      :host([size='small']) {
+        --icon-size: var(
+          --jh-icon-size-small,
+          var(--jh-size-500)
+        );
+      }
+      :host([size='medium']) {
+        --icon-size: var(
+          --jh-icon-size-medium,
+          var(--jh-size-600)
+        );
+      }
+      :host([size='large']) {
+        --icon-size: var(
+          --jh-icon-size-large,
+          var(--jh-size-900)
+        );
+      }
+      :host([size='x-large']) {
+        --icon-size: var(
+          --jh-icon-size-extra-large,
+          var(--jh-size-1400)
+        );
+      }
+      svg {
+        width: 100%;
+        height: 100%;
+      }
+    `;
+  }
+
+  static get properties() {
+    return {
+      /**
+      * The size of the icon.
+      */
+      size: {
+        type: String, reflect: true 
+      }
+    }
+  }
+
+  constructor() {
+    super();
+    this.#internals = this.attachInternals();
+    this.#internals.role = 'graphics-symbol';
+    this.#internals.ariaHidden = 'true';
+
+    /** @type {'x-small'|'small'|'medium'|'large'|'x-large'} */
+    this.size = 'medium';
+  }
+
+  render() {
+    return html`
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">   <path fill-rule="evenodd" d="M12.598 5.066c-.26-.422-.937-.422-1.197 0L7.61 11.225l-3.773 6.127c-.211.343.006.898.599.898h15.13c.593 0 .81-.555.6-.898l-3.774-6.127L12.6 5.066Zm1.278-.786c-.845-1.374-2.906-1.374-3.752 0l-3.792 6.158-3.773 6.128c-.903 1.466.257 3.184 1.876 3.184h15.13c1.618 0 2.78-1.718 1.876-3.184l-3.773-6.128-3.792-6.158ZM12 7.25a.75.75 0 0 1 .75.75v4a.75.75 0 1 1-1.5 0V8a.75.75 0 0 1 .75-.75Zm0 7.25a1 1 0 1 0 0 2 1 1 0 0 0 0-2Z" clip-rule="evenodd"/> </svg> 
+    `;
+  }
+}
+
+customElements.define('jh-icon-triangle-exclamation', JhIconTriangleExclamation);

package/icons-wc/icon-umbrella.js

@@ -0,0 +1,87 @@
+// SPDX-FileCopyrightText: 2025 Jack Henry
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import {LitElement, css, html} from 'lit';
+
+export default class JhIconUmbrella extends LitElement {
+  /** @type {ElementInternals} */
+  #internals;
+
+  static get styles() {
+    return css`
+      :host {
+        fill: var(
+          --jh-icon-color-fill,
+          var(--jh-color-content-secondary-enabled)
+        );
+        width: var(--icon-size);
+        height: var(--icon-size);
+        display: inline-block;
+      }
+      :host([size='x-small']) {
+        --icon-size: var(
+          --jh-icon-size-extra-small,
+          var(--jh-size-400)
+        );
+      }
+      :host([size='small']) {
+        --icon-size: var(
+          --jh-icon-size-small,
+          var(--jh-size-500)
+        );
+      }
+      :host([size='medium']) {
+        --icon-size: var(
+          --jh-icon-size-medium,
+          var(--jh-size-600)
+        );
+      }
+      :host([size='large']) {
+        --icon-size: var(
+          --jh-icon-size-large,
+          var(--jh-size-900)
+        );
+      }
+      :host([size='x-large']) {
+        --icon-size: var(
+          --jh-icon-size-extra-large,
+          var(--jh-size-1400)
+        );
+      }
+      svg {
+        width: 100%;
+        height: 100%;
+      }
+    `;
+  }
+
+  static get properties() {
+    return {
+      /**
+      * The size of the icon.
+      */
+      size: {
+        type: String, reflect: true 
+      }
+    }
+  }
+
+  constructor() {
+    super();
+    this.#internals = this.attachInternals();
+    this.#internals.role = 'graphics-symbol';
+    this.#internals.ariaHidden = 'true';
+
+    /** @type {'x-small'|'small'|'medium'|'large'|'x-large'} */
+    this.size = 'medium';
+  }
+
+  render() {
+    return html`
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">   <path fill-rule="evenodd" d="M12.75 2.875a.75.75 0 0 0-1.5 0v.77A8.86 8.86 0 0 0 3 12.35a.753.753 0 0 0 .55.748.751.751 0 0 0 .854-.356c.165-.278.425-.569.73-.787.313-.223.616-.33.866-.33s.553.107.866.33c.305.218.566.51.73.788a.75.75 0 0 0 1.135.207c.765-.63 1.621-1.086 2.519-1.254v7.18c0 .589-.181.958-.383 1.174a1.01 1.01 0 0 1-1.484 0C9.181 19.834 9 19.465 9 18.875a.75.75 0 0 0-1.5 0c0 .91.288 1.666.789 2.2a2.51 2.51 0 0 0 3.672 0c.501-.534.789-1.29.789-2.2v-7.18c.898.168 1.754.625 2.519 1.255a.748.748 0 0 0 1.135-.207c.163-.277.424-.568.73-.787.314-.223.618-.33.866-.33s.552.107.866.33c.306.219.566.51.73.786a.754.754 0 0 0 .854.356.752.752 0 0 0 .55-.748 8.859 8.859 0 0 0-8.25-8.705v-.77ZM9.23 5.61l-.076.03a7.36 7.36 0 0 0-4.359 4.778A2.775 2.775 0 0 1 6 10.125c.604 0 1.163.228 1.62.529.165-1.258.498-2.59.967-3.74.187-.459.402-.901.644-1.305Zm9.67 3.96c.119.278.22.561.305.85A2.771 2.771 0 0 0 18 10.124c-.604 0-1.163.229-1.62.53-.165-1.258-.497-2.591-.967-3.74a9.578 9.578 0 0 0-.644-1.306l.077.03a7.36 7.36 0 0 1 4.053 3.93Zm-4.876-2.088c.427 1.044.728 2.271.875 3.415-.871-.47-1.85-.77-2.899-.77-1.05 0-2.028.3-2.899.77.147-1.144.448-2.37.875-3.415.31-.759.668-1.378 1.045-1.794.376-.415.703-.56.974-.562h.01c.271.002.598.147.974.562.377.416.736 1.035 1.045 1.794Z" clip-rule="evenodd"/> </svg> 
+    `;
+  }
+}
+
+customElements.define('jh-icon-umbrella', JhIconUmbrella);

package/icons-wc/icon-user-plus.js

@@ -0,0 +1,87 @@
+// SPDX-FileCopyrightText: 2025 Jack Henry
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import {LitElement, css, html} from 'lit';
+
+export default class JhIconUserPlu extends LitElement {
+  /** @type {ElementInternals} */
+  #internals;
+
+  static get styles() {
+    return css`
+      :host {
+        fill: var(
+          --jh-icon-color-fill,
+          var(--jh-color-content-secondary-enabled)
+        );
+        width: var(--icon-size);
+        height: var(--icon-size);
+        display: inline-block;
+      }
+      :host([size='x-small']) {
+        --icon-size: var(
+          --jh-icon-size-extra-small,
+          var(--jh-size-400)
+        );
+      }
+      :host([size='small']) {
+        --icon-size: var(
+          --jh-icon-size-small,
+          var(--jh-size-500)
+        );
+      }
+      :host([size='medium']) {
+        --icon-size: var(
+          --jh-icon-size-medium,
+          var(--jh-size-600)
+        );
+      }
+      :host([size='large']) {
+        --icon-size: var(
+          --jh-icon-size-large,
+          var(--jh-size-900)
+        );
+      }
+      :host([size='x-large']) {
+        --icon-size: var(
+          --jh-icon-size-extra-large,
+          var(--jh-size-1400)
+        );
+      }
+      svg {
+        width: 100%;
+        height: 100%;
+      }
+    `;
+  }
+
+  static get properties() {
+    return {
+      /**
+      * The size of the icon.
+      */
+      size: {
+        type: String, reflect: true 
+      }
+    }
+  }
+
+  constructor() {
+    super();
+    this.#internals = this.attachInternals();
+    this.#internals.role = 'graphics-symbol';
+    this.#internals.ariaHidden = 'true';
+
+    /** @type {'x-small'|'small'|'medium'|'large'|'x-large'} */
+    this.size = 'medium';
+  }
+
+  render() {
+    return html`
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">   <path fill-rule="evenodd" d="M7.928 4.796c.614-.426 1.397-.67 2.366-.67.97 0 1.752.244 2.366.67.61.423 1.002.99 1.253 1.556.484 1.089.484 2.267.484 2.697v.017c0 .529-.137 1.264-.432 2-.253.632-.64 1.308-1.204 1.869a.83.83 0 0 0 .065.194c.047.097.127.2.318.296.347.173.804.313 1.363.473l.178.05c.49.139 1.038.294 1.543.494.568.224 1.156.533 1.606 1.01.471.501.754 1.15.754 1.961v1.712a.75.75 0 0 1-1.5 0v-1.712c0-.428-.136-.709-.346-.932-.231-.246-.585-.454-1.066-.645-.43-.17-.9-.303-1.402-.445l-.177-.05c-.541-.155-1.132-.329-1.624-.574a2.13 2.13 0 0 1-.996-.98c-.188-.387-.237-.787-.251-1.119l-.016-.372.287-.237c.487-.402.842-.968 1.076-1.55.235-.588.324-1.133.324-1.443 0-.423-.007-1.323-.354-2.105-.168-.378-.405-.701-.738-.933-.33-.228-.803-.403-1.51-.403-.708 0-1.183.175-1.512.403-.333.232-.57.555-.737.933-.348.782-.355 1.682-.355 2.105 0 .31.088.85.32 1.433.231.578.582 1.141 1.065 1.547l.323.271-.064.417c-.034.222-.109.59-.27.96-.158.359-.44.818-.95 1.072-.492.246-1.082.42-1.623.574l-.178.05c-.5.143-.972.276-1.402.446-.48.19-.835.4-1.066.645-.21.223-.346.504-.346.932v1.712a.75.75 0 0 1-1.5 0v-1.712c0-.811.283-1.46.754-1.96.45-.478 1.039-.787 1.606-1.011.505-.2 1.053-.355 1.543-.494l.178-.05c.56-.16 1.016-.3 1.363-.473.058-.03.153-.119.246-.332.031-.071.057-.145.08-.217a5.612 5.612 0 0 1-1.151-1.82c-.293-.732-.428-1.461-.428-1.99V9.05c0-.43 0-1.608.484-2.697.251-.566.643-1.133 1.253-1.556Zm7.572 3.83H18v-2.5h1.5v2.5H22v1.5h-2.5v2.5H18v-2.5h-2.5v-1.5Z" clip-rule="evenodd"/> </svg> 
+    `;
+  }
+}
+
+customElements.define('jh-icon-user-plus', JhIconUserPlu);