@ukho/admiralty-core 0.0.0

package/dist/collection/components/header-profile/header-profile.css

@@ -0,0 +1,81 @@
+/* Core Palette */
+/* Supporting Palette */
+/* Secondary Palette */
+/* Digital Product Colours */
+/* Utility Colours */
+/* Button Colours */
+/* Primary */
+/* Secondary */
+/* Link Colours */
+/* Nav colours */
+/* Table colours */
+/* Tab colours */
+/* form text input colours */
+/* form textarea colours */
+/* radio button */
+/* checkbox */
+/* code snippet */
+.header-profile {
+  color: #09315b;
+  cursor: pointer;
+  display: flex;
+  flex: 0;
+  flex-direction: column;
+  font-size: 18px !important;
+  font-weight: 400;
+  height: 100%;
+  justify-content: center;
+  line-height: 1.33em;
+  margin-bottom: 0;
+  min-width: 4em;
+  max-width: 11.1em;
+  padding: 0 1.65em;
+  position: relative;
+  text-align: center;
+}
+.header-profile button {
+  all: unset;
+  height: 100%;
+  width: 100%;
+}
+.header-profile:hover {
+  background-color: #f0f0f0;
+  box-shadow: inset 0 -5px #09315b;
+}
+.header-profile:hover .sub-menu {
+  display: flex;
+}
+.header-profile.active {
+  background-color: #f0f0f0;
+  box-shadow: inset 0 -5px #09315b;
+}
+.header-profile .sub-menu {
+  display: none;
+  flex-direction: column;
+  font-size: 18px;
+  position: absolute;
+  top: 100%;
+  right: 0;
+  border: 1px solid #d8d8d8;
+  width: 300px;
+}
+.header-profile .sub-menu .sub-menu-item {
+  box-sizing: content-box;
+  margin: 0;
+  width: 100%;
+}
+.header-profile .sub-menu .sub-menu-item button {
+  all: unset;
+  box-sizing: border-box;
+  color: #09315b;
+  cursor: pointer;
+  display: block;
+  font-weight: 300;
+  height: 100%;
+  padding: 10px;
+  text-align: left;
+  width: 100%;
+}
+.header-profile .sub-menu .sub-menu-item button:hover {
+  background-color: #f0f0f0;
+}

package/dist/collection/components/header-profile/header-profile.js

@@ -0,0 +1,148 @@
+import { Host, h } from '@stencil/core';
+export class HeaderProfileComponent {
+  constructor() {
+    this.handleSignIn = () => {
+      this.signInClicked.emit();
+    };
+    this.handleSignOut = () => {
+      this.signOutClicked.emit();
+    };
+    this.handleYouAccount = () => {
+      this.yourAccountClicked.emit();
+    };
+    this.openDropdown = () => {
+      this.displaySubmenu = true;
+    };
+    this.closeDropdown = () => {
+      this.displaySubmenu = true;
+    };
+    this.displaySubmenu = false;
+    this.isSignedIn = false;
+    this.signedInText = 'replace';
+  }
+  render() {
+    let { isSignedIn, signedInText, displaySubmenu } = this;
+    return (h(Host, null, h("div", { class: "header-profile" }, isSignedIn ? (h("div", null, h("button", { onMouseOver: this.openDropdown, onMouseOut: this.closeDropdown }, signedInText), displaySubmenu ? (h("div", { class: "sub-menu" }, h("div", { class: "sub-menu-item" }, h("button", { onClick: this.handleYouAccount }, "Your Account")), h("div", { class: "sub-menu-item" }, h("button", { onClick: this.handleSignOut }, "Sign Out")))) : null)) : (h("button", { onClick: this.handleSignIn }, "Sign In")))));
+  }
+  static get is() { return "admiralty-header-profile"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["header-profile.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["header-profile.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "isSignedIn": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "A boolean to indicate if the user is signed in or not"
+        },
+        "attribute": "is-signed-in",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "signedInText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The text that is displayed after the user signs in"
+        },
+        "attribute": "signed-in-text",
+        "reflect": false,
+        "defaultValue": "'replace'"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "displaySubmenu": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "signInClicked",
+        "name": "signInClicked",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "The event that is fired when the user clicks on\nthe sign in button"
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "yourAccountClicked",
+        "name": "yourAccountClicked",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "The event that is fired when the user clicks on the\n'Your account' button"
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "signOutClicked",
+        "name": "signOutClicked",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "The event that is fired when the user clicks on the\n'sign out' button"
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "userProfileClicked",
+        "name": "userProfileClicked",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "TThe event that is fired when the user clicks 'user profile'\n on the profile sub menu"
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
+}
+//# sourceMappingURL=header-profile.js.map

package/dist/collection/components/header-profile/header-profile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"header-profile.js","sourceRoot":"","sources":["../../../src/components/header-profile/header-profile.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAgB,KAAK,EAAE,MAAM,eAAe,CAAC;AAOrF,MAAM,OAAO,sBAAsB;;IAqCjC,iBAAY,GAAG,GAAG,EAAE;MAClB,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;IAC5B,CAAC,CAAC;IAEF,kBAAa,GAAG,GAAG,EAAE;MACnB,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;IAC7B,CAAC,CAAC;IAEF,qBAAgB,GAAG,GAAG,EAAE;MACtB,IAAI,CAAC,kBAAkB,CAAC,IAAI,EAAE,CAAC;IACjC,CAAC,CAAC;IAEF,iBAAY,GAAG,GAAG,EAAE;MAClB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;IAC7B,CAAC,CAAC;IAEF,kBAAa,GAAG,GAAG,EAAE;MACnB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;IAC7B,CAAC,CAAC;0BAtDwB,KAAK;sBAKD,KAAK;wBAKJ,SAAS;;EA8CxC,MAAM;IACJ,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;IAExD,OAAO,CACL,EAAC,IAAI;MACH,WAAK,KAAK,EAAC,gBAAgB,IACxB,UAAU,CAAC,CAAC,CAAC,CACZ;QACE,cAAQ,WAAW,EAAE,IAAI,CAAC,YAAY,EAAE,UAAU,EAAE,IAAI,CAAC,aAAa,IACnE,YAAY,CACN;QACR,cAAc,CAAC,CAAC,CAAC,CAChB,WAAK,KAAK,EAAC,UAAU;UACnB,WAAK,KAAK,EAAC,eAAe;YACxB,cAAQ,OAAO,EAAE,IAAI,CAAC,gBAAgB,mBAAuB,CACzD;UACN,WAAK,KAAK,EAAC,eAAe;YACxB,cAAQ,OAAO,EAAE,IAAI,CAAC,aAAa,eAAmB,CAClD,CACF,CACP,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC,CAAC,CAAC,CACF,cAAQ,OAAO,EAAE,IAAI,CAAC,YAAY,cAAkB,CACrD,CACG,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, Host, h, Prop, EventEmitter, State } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-header-profile',\n  styleUrl: 'header-profile.scss',\n  shadow: true,\n})\nexport class HeaderProfileComponent {\n  @State() displaySubmenu = false;\n\n  /**\n   * A boolean to indicate if the user is signed in or not\n   */\n  @Prop() isSignedIn: boolean = false;\n\n  /**\n   * The text that is displayed after the user signs in\n   */\n  @Prop() signedInText: string = 'replace';\n\n  /**\n   * The event that is fired when the user clicks on\n   * the sign in button\n   */\n  @Event() signInClicked: EventEmitter<void>;\n\n  /**\n   * The event that is fired when the user clicks on the\n   * 'Your account' button\n   */\n  @Event() yourAccountClicked: EventEmitter<void>;\n\n  /**\n   * The event that is fired when the user clicks on the\n   * 'sign out' button\n   */\n  @Event() signOutClicked: EventEmitter<void>;\n\n  /**\n   * TThe event that is fired when the user clicks 'user profile'\n   *  on the profile sub menu\n   */\n  @Event() userProfileClicked: EventEmitter<void>;\n\n  handleSignIn = () => {\n    this.signInClicked.emit();\n  };\n\n  handleSignOut = () => {\n    this.signOutClicked.emit();\n  };\n\n  handleYouAccount = () => {\n    this.yourAccountClicked.emit();\n  };\n\n  openDropdown = () => {\n    this.displaySubmenu = true;\n  };\n\n  closeDropdown = () => {\n    this.displaySubmenu = true;\n  };\n\n  render() {\n    let { isSignedIn, signedInText, displaySubmenu } = this;\n\n    return (\n      <Host>\n        <div class=\"header-profile\">\n          {isSignedIn ? (\n            <div>\n              <button onMouseOver={this.openDropdown} onMouseOut={this.closeDropdown}>\n                {signedInText}\n              </button>\n              {displaySubmenu ? (\n                <div class=\"sub-menu\">\n                  <div class=\"sub-menu-item\">\n                    <button onClick={this.handleYouAccount}>Your Account</button>\n                  </div>\n                  <div class=\"sub-menu-item\">\n                    <button onClick={this.handleSignOut}>Sign Out</button>\n                  </div>\n                </div>\n              ) : null}\n            </div>\n          ) : (\n            <button onClick={this.handleSignIn}>Sign In</button>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/header-sub-menu-item/header-sub-menu-item.css

@@ -0,0 +1,35 @@
+/* Core Palette */
+/* Supporting Palette */
+/* Secondary Palette */
+/* Digital Product Colours */
+/* Utility Colours */
+/* Button Colours */
+/* Primary */
+/* Secondary */
+/* Link Colours */
+/* Nav colours */
+/* Table colours */
+/* Tab colours */
+/* form text input colours */
+/* form textarea colours */
+/* radio button */
+/* checkbox */
+/* code snippet */
+.header-sub-menu-item {
+  box-sizing: border-box;
+  color: #09315b;
+  display: block;
+  font-size: 18px;
+  margin-bottom: 0;
+  padding: 0 0.66em;
+  text-align: center;
+  width: 300px;
+}
+.header-sub-menu-item .title {
+  display: block;
+  padding: 10px;
+  text-align: center;
+}
+.header-sub-menu-item:hover {
+  background-color: #f0f0f0;
+}

package/dist/collection/components/header-sub-menu-item/header-sub-menu-item.js

@@ -0,0 +1,66 @@
+import { h, Host } from '@stencil/core';
+export class HeaderMenuItemComponent {
+  constructor() {
+    this.handleClick = (ev) => {
+      ev.stopPropagation();
+      return this.subMenuItemClick.emit();
+    };
+    this.menuTitle = undefined;
+  }
+  render() {
+    const { menuTitle } = this;
+    return (h(Host, null, h("div", { class: "header-sub-menu-item", onClick: this.handleClick }, h("span", { class: "title" }, menuTitle))));
+  }
+  static get is() { return "admiralty-header-sub-menu-item"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["header-sub-menu-item.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["header-sub-menu-item.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "menuTitle": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The text that will be displayed in the menu"
+        },
+        "attribute": "menu-title",
+        "reflect": false
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "subMenuItemClick",
+        "name": "subMenuItemClick",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "The event that is fired when a user clicks on the menu"
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
+}
+//# sourceMappingURL=header-sub-menu-item.js.map

package/dist/collection/components/header-sub-menu-item/header-sub-menu-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"header-sub-menu-item.js","sourceRoot":"","sources":["../../../src/components/header-sub-menu-item/header-sub-menu-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,uBAAuB;;IAWlC,gBAAW,GAAG,CAAC,EAAc,EAAqB,EAAE;MAClD,EAAE,CAAC,eAAe,EAAE,CAAC;MACrB,OAAO,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAAC;IACtC,CAAC,CAAC;;;EAEF,MAAM;IACJ,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAE3B,OAAO,CACL,EAAC,IAAI;MACH,WAAK,KAAK,EAAC,sBAAsB,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW;QACzD,YAAM,KAAK,EAAC,OAAO,IAAE,SAAS,CAAQ,CAClC,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-header-sub-menu-item',\n  styleUrl: 'header-sub-menu-item.scss',\n  shadow: true,\n})\nexport class HeaderMenuItemComponent {\n  /**\n   * The text that will be displayed in the menu\n   */\n  @Prop() menuTitle: string;\n\n  /**\n   * The event that is fired when a user clicks on the menu\n   */\n  @Event() subMenuItemClick: EventEmitter<void>;\n\n  handleClick = (ev: MouseEvent): CustomEvent<void> => {\n    ev.stopPropagation();\n    return this.subMenuItemClick.emit();\n  };\n\n  render() {\n    const { menuTitle } = this;\n\n    return (\n      <Host>\n        <div class=\"header-sub-menu-item\" onClick={this.handleClick}>\n          <span class=\"title\">{menuTitle}</span>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/hint/hint.css

@@ -0,0 +1,26 @@
+/* Core Palette */
+/* Supporting Palette */
+/* Secondary Palette */
+/* Digital Product Colours */
+/* Utility Colours */
+/* Button Colours */
+/* Primary */
+/* Secondary */
+/* Link Colours */
+/* Nav colours */
+/* Table colours */
+/* Tab colours */
+/* form text input colours */
+/* form textarea colours */
+/* radio button */
+/* checkbox */
+/* code snippet */
+p {
+  margin-top: 0;
+  margin-bottom: 6px;
+  display: block;
+  font-weight: 300;
+}
+p.disabled {
+  color: #adadad;
+}

package/dist/collection/components/hint/hint.js

@@ -0,0 +1,47 @@
+import { h } from '@stencil/core';
+/**
+ * @slot - The hint content should be placed in the slot e.g.
+ * `<admiralty-hint>Enter your full name</admiralty-hint>`
+ */
+export class HintComponent {
+  constructor() {
+    this.disabled = undefined;
+  }
+  render() {
+    return (h("p", { class: { disabled: this.disabled } }, h("slot", null)));
+  }
+  static get is() { return "admiralty-hint"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["hint.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["hint.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The disabled option can be used to disable the component."
+        },
+        "attribute": "disabled",
+        "reflect": false
+      }
+    };
+  }
+}
+//# sourceMappingURL=hint.js.map

package/dist/collection/components/hint/hint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hint.js","sourceRoot":"","sources":["../../../src/components/hint/hint.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;;GAGG;AAMH,MAAM,OAAO,aAAa;;;;EAMxB,MAAM;IACJ,OAAO,CACL,SAAG,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;MACnC,eAAa,CACX,CACL,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The hint content should be placed in the slot e.g.\n * `<admiralty-hint>Enter your full name</admiralty-hint>`\n */\n@Component({\n  tag: 'admiralty-hint',\n  styleUrl: 'hint.scss',\n  shadow: true,\n})\nexport class HintComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  render() {\n    return (\n      <p class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </p>\n    );\n  }\n}\n"]}

package/dist/collection/components/horizontal-rule/horizontal-rule.css

@@ -0,0 +1,23 @@
+/* Core Palette */
+/* Supporting Palette */
+/* Secondary Palette */
+/* Digital Product Colours */
+/* Utility Colours */
+/* Button Colours */
+/* Primary */
+/* Secondary */
+/* Link Colours */
+/* Nav colours */
+/* Table colours */
+/* Tab colours */
+/* form text input colours */
+/* form textarea colours */
+/* radio button */
+/* checkbox */
+/* code snippet */
+admiralty-hr {
+  width: 100%;
+}
+admiralty-hr hr {
+  border-top: 1px solid #d0d0d0;
+}

package/dist/collection/components/horizontal-rule/horizontal-rule.js

@@ -0,0 +1,18 @@
+import { h } from '@stencil/core';
+export class HorizontalRuleComponent {
+  render() {
+    return h("hr", null);
+  }
+  static get is() { return "admiralty-hr"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["horizontal-rule.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["horizontal-rule.css"]
+    };
+  }
+}
+//# sourceMappingURL=horizontal-rule.js.map

package/dist/collection/components/horizontal-rule/horizontal-rule.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"horizontal-rule.js","sourceRoot":"","sources":["../../../src/components/horizontal-rule/horizontal-rule.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,uBAAuB;EAClC,MAAM;IACJ,OAAO,aAAM,CAAC;EAChB,CAAC;;;;;;;;CACF","sourcesContent":["import { Component, h } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-hr',\n  styleUrl: 'horizontal-rule.scss',\n  shadow: false,\n})\nexport class HorizontalRuleComponent {\n  render() {\n    return <hr />;\n  }\n}\n"]}

package/dist/collection/components/icon/icon.css

@@ -0,0 +1,15 @@
+:host {
+  display: inline-block;
+  min-width: 1em;
+  min-height: 1em;
+  contain: strict;
+  fill: currentColor;
+  box-sizing: content-box !important;
+}
+
+.icon-inner,
+svg {
+  display: block;
+  height: 1em;
+  width: 1em;
+}