@peculiar/certificates-viewer 3.10.1 → 4.0.1

package/dist/collection/components/button/button.js

@@ -8,129 +8,17 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { Component, h, Prop, } from '@stencil/core';
-export class Button {
-  constructor() {
-    this.fill = 'stroke';
-    this.handleClick = (event) => {
-      if (this.disabled) {
-        event.preventDefault();
-        event.stopPropagation();
-        return;
-      }
-      if (this.onClick) {
-        this.onClick(event);
-      }
-    };
-  }
-  render() {
-    const isLink = !!this.href;
-    const TagType = isLink ? 'a' : 'button';
-    return (h(TagType, { class: {
-        button: true,
-        button_stroke: this.fill === 'stroke',
-        button_fill: this.fill === 'fill',
-        button_disabled: this.disabled,
-      }, disabled: this.disabled, type: !isLink && 'button', href: isLink && this.href, target: isLink && this.target ? this.target : null, rel: isLink && 'noreferrer noopener', onClick: this.handleClick, part: "base" },
-      h("span", { part: "label", class: "button_label" },
-        h("slot", null))));
-  }
-  static get is() { return "peculiar-button"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["button.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["button.css"]
-  }; }
-  static get properties() { return {
-    "fill": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'stroke' | 'fill'",
-        "resolved": "\"fill\" | \"stroke\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "fill",
-      "reflect": false,
-      "defaultValue": "'stroke'"
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Set to true to disable the button."
-      },
-      "attribute": "disabled",
-      "reflect": true
-    },
-    "href": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "When set, the underlying button will be rendered as an `<a>` with\nthis `href` instead of a `<button>`."
-      },
-      "attribute": "href",
-      "reflect": false
-    },
-    "target": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'_blank' | '_parent' | '_self' | '_top'",
-        "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Tells the browser where to open the link. Only used when `href` is set."
-      },
-      "attribute": "target",
-      "reflect": false
-    },
-    "onClick": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "(event: MouseEvent) => void",
-        "resolved": "(event: MouseEvent) => void",
-        "references": {
-          "MouseEvent": {
-            "location": "global"
-          }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      }
-    }
-  }; }
-}
+import { h } from "@stencil/core";
+import { Typography } from "../typography";
+export const Button = (props, children) => {
+  const { href, class: classProp, startIcon, onClick, } = props;
+  const isLink = !!href;
+  const TagType = isLink ? 'a' : 'button';
+  return (h(TagType, { type: !isLink && 'button', href: isLink && href, target: isLink && '_blank', rel: isLink && 'noreferrer noopener', onClick: onClick, class: {
+      button: true,
+      // eslint-disable-next-line react/destructuring-assignment
+      m_no_padding: children.length === 0,
+      [classProp]: Boolean(classProp),
+    } }, startIcon, children.length > 0 && (h(Typography, { variant: "b3", color: "black", component: "span" }, children))));
+};
+//# sourceMappingURL=button.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAuB,CAAC,EAAS,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAS3C,MAAM,CAAC,MAAM,MAAM,GAAqC,CAAC,KAAK,EAAE,QAAQ,EAAE,EAAE;EAC1E,MAAM,EACJ,IAAI,EACJ,KAAK,EAAE,SAAS,EAChB,SAAS,EACT,OAAO,GACR,GAAG,KAAK,CAAC;EAEV,MAAM,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC;EACtB,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC;EAExC,OAAO,CACL,EAAC,OAAO,IACN,IAAI,EAAE,CAAC,MAAM,IAAI,QAAQ,EACzB,IAAI,EAAE,MAAM,IAAI,IAAI,EACpB,MAAM,EAAE,MAAM,IAAI,QAAQ,EAC1B,GAAG,EAAE,MAAM,IAAI,qBAAqB,EACpC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE;MACL,MAAM,EAAE,IAAI;MACZ,0DAA0D;MAC1D,YAAY,EAAE,QAAQ,CAAC,MAAM,KAAK,CAAC;MACnC,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC;KAChC;IAEA,SAAS;IAET,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,CACtB,EAAC,UAAU,IACT,OAAO,EAAC,IAAI,EACZ,KAAK,EAAC,OAAO,EACb,SAAS,EAAC,MAAM,IAEf,QAAQ,CACE,CACd,CACO,CACX,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/**\n * @license\n * Copyright (c) Peculiar Ventures, LLC.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { FunctionalComponent, h, VNode } from '@stencil/core';\nimport { Typography } from '../typography';\n\nexport interface ButtonProps {\n  href?: string;\n  class?: string;\n  startIcon?: VNode;\n  onClick?: (event: MouseEvent) => void;\n}\n\nexport const Button: FunctionalComponent<ButtonProps> = (props, children) => {\n  const {\n    href,\n    class: classProp,\n    startIcon,\n    onClick,\n  } = props;\n\n  const isLink = !!href;\n  const TagType = isLink ? 'a' : 'button';\n\n  return (\n    <TagType\n      type={!isLink && 'button'}\n      href={isLink && href}\n      target={isLink && '_blank'}\n      rel={isLink && 'noreferrer noopener'}\n      onClick={onClick}\n      class={{\n        button: true,\n        // eslint-disable-next-line react/destructuring-assignment\n        m_no_padding: children.length === 0,\n        [classProp]: Boolean(classProp),\n      }}\n    >\n      {startIcon}\n      {/* eslint-disable-next-line react/destructuring-assignment */}\n      {children.length > 0 && (\n        <Typography\n          variant=\"b3\"\n          color=\"black\"\n          component=\"span\"\n        >\n          {children}\n        </Typography>\n      )}\n    </TagType>\n  );\n};\n"]}

package/dist/collection/components/button/index.js

@@ -0,0 +1,5 @@
+/*!
+ * © Peculiar Ventures https://peculiarventures.com/ - MIT License
+ */
+export { Button } from './button';
+//# sourceMappingURL=index.js.map

package/dist/collection/components/button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { Button } from './button';\nexport type { ButtonProps } from './button';\n"]}

package/dist/collection/components/button-menu/button-menu.css

@@ -0,0 +1,46 @@
+:host {
+  display: inline-flex;
+  position: relative;
+}
+:host.is_shown .button_popover:before {
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  content: "";
+}
+:host.is_shown .popover {
+  display: block;
+}
+
+.popover {
+  min-width: 200px;
+  position: absolute;
+  top: 100%;
+  right: 0;
+  border-radius: 4px;
+  z-index: 1;
+  box-shadow: var(--pv-shadow-light-medium);
+  background: var(--pv-color-white);
+  padding: var(--pv-size-base-2) 0;
+  margin: var(--pv-size-base) 0;
+  display: none;
+}
+
+.button_option {
+  width: 100%;
+  justify-content: flex-start;
+  border-radius: 0;
+}
+
+.group:not(:last-child) {
+  border-bottom: 1px solid var(--pv-color-gray-5);
+  padding-bottom: var(--pv-size-base-2);
+  margin-bottom: var(--pv-size-base);
+}
+
+.group_title {
+  line-height: var(--pv-size-base-6);
+  padding: 0 var(--pv-size-base-2);
+}

package/dist/collection/components/button-menu/button-menu.js

@@ -0,0 +1,78 @@
+/*!
+ * © Peculiar Ventures https://peculiarventures.com/ - MIT License
+ */
+/**
+ * @license
+ * Copyright (c) Peculiar Ventures, LLC.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { h, Host, } from "@stencil/core";
+import { Button } from "../button";
+import { Typography } from "../typography";
+import { ActionsIcon } from "../icons";
+export class ButtonMenu {
+  constructor() {
+    this.handleClick = () => {
+      this.open = !this.open;
+    };
+    this.groups = [];
+    this.open = false;
+  }
+  render() {
+    return (h(Host, { class: {
+        is_shown: this.open,
+      } }, h(Button, { class: "button_popover", onClick: this.handleClick, startIcon: h(ActionsIcon, null) }), h("div", { role: "dialog", tabIndex: -1, class: "popover", "aria-hidden": String(this.open) }, this.groups.map((group) => (h("div", { class: "group" }, h(Typography, { variant: "c2", color: "gray-9", class: "group_title" }, group.title), group.options.map((option) => (h(Button, { class: "button_option", startIcon: option.startIcon, href: option.href, onClick: (event) => {
+        event.stopPropagation();
+        this.handleClick();
+        if (option.onClick) {
+          option.onClick(event);
+        }
+      } }, option.text)))))))));
+  }
+  static get is() { return "peculiar-button-menu"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["button-menu.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["button-menu.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "groups": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "ButtonMenuGroup[]",
+          "resolved": "ButtonMenuGroup[]",
+          "references": {
+            "ButtonMenuGroup": {
+              "location": "local",
+              "path": "/Users/donskov/Documents/work/pv/pv-certificates-viewer/packages/webcomponents/src/components/button-menu/button-menu.tsx",
+              "id": "src/components/button-menu/button-menu.tsx::ButtonMenuGroup"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "defaultValue": "[]"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "open": {}
+    };
+  }
+}
+//# sourceMappingURL=button-menu.js.map

package/dist/collection/components/button-menu/button-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-menu.js","sourceRoot":"","sources":["../../../src/components/button-menu/button-menu.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EACL,SAAS,EACT,CAAC,EACD,KAAK,EACL,IAAI,EACJ,IAAI,GACL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,MAAM,EAAe,MAAM,WAAW,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAgBvC,MAAM,OAAO,UAAU;;IAKrB,gBAAW,GAAG,GAAG,EAAE;MACjB,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;IACzB,CAAC,CAAC;kBANkC,EAAE;gBAEb,KAAK;;EAM9B,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,QAAQ,EAAE,IAAI,CAAC,IAAI;OACpB;MAED,EAAC,MAAM,IACL,KAAK,EAAC,gBAAgB,EACtB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,EAAC,WAAW,OAAG,GAC1B;MACF,WACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,CAAC,EACZ,KAAK,EAAC,SAAS,iBACF,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,IAE7B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAC1B,WAAK,KAAK,EAAC,OAAO;QAChB,EAAC,UAAU,IACT,OAAO,EAAC,IAAI,EACZ,KAAK,EAAC,QAAQ,EACd,KAAK,EAAC,aAAa,IAElB,KAAK,CAAC,KAAK,CACD;QACZ,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC7B,EAAC,MAAM,IACL,KAAK,EAAC,eAAe,EACrB,SAAS,EAAE,MAAM,CAAC,SAAS,EAC3B,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;YACjB,KAAK,CAAC,eAAe,EAAE,CAAC;YAExB,IAAI,CAAC,WAAW,EAAE,CAAC;YAEnB,IAAI,MAAM,CAAC,OAAO,EAAE;cAClB,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;aACvB;UACH,CAAC,IAEA,MAAM,CAAC,IAAI,CACL,CACV,CAAC,CACE,CACP,CAAC,CACE,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/**\n * @license\n * Copyright (c) Peculiar Ventures, LLC.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  h,\n  State,\n  Prop,\n  Host,\n} from '@stencil/core';\nimport { Button, ButtonProps } from '../button';\nimport { Typography } from '../typography';\nimport { ActionsIcon } from '../icons';\n\nexport interface ButtonMenuGroupOptions extends ButtonProps {\n  text: string | string[];\n}\n\nexport interface ButtonMenuGroup {\n  title: string | string[];\n  options: ButtonMenuGroupOptions[];\n}\n\n@Component({\n  tag: 'peculiar-button-menu',\n  styleUrl: 'button-menu.scss',\n  scoped: true,\n})\nexport class ButtonMenu {\n  @Prop() groups: ButtonMenuGroup[] = [];\n\n  @State() open: boolean = false;\n\n  handleClick = () => {\n    this.open = !this.open;\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          is_shown: this.open,\n        }}\n      >\n        <Button\n          class=\"button_popover\"\n          onClick={this.handleClick}\n          startIcon={<ActionsIcon />}\n        />\n        <div\n          role=\"dialog\"\n          tabIndex={-1}\n          class=\"popover\"\n          aria-hidden={String(this.open)}\n        >\n          {this.groups.map((group) => (\n            <div class=\"group\">\n              <Typography\n                variant=\"c2\"\n                color=\"gray-9\"\n                class=\"group_title\"\n              >\n                {group.title}\n              </Typography>\n              {group.options.map((option) => (\n                <Button\n                  class=\"button_option\"\n                  startIcon={option.startIcon}\n                  href={option.href}\n                  onClick={(event) => {\n                    event.stopPropagation();\n\n                    this.handleClick();\n\n                    if (option.onClick) {\n                      option.onClick(event);\n                    }\n                  }}\n                >\n                  {option.text}\n                </Button>\n              ))}\n            </div>\n          ))}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}