@peculiar/certificates-viewer 4.7.1-alpha.4 → 4.8.0

package/dist/collection/components/certificate-chain-viewer/certificate-chain-viewer.css

@@ -445,453 +445,6 @@
   background-color: var(--pv-color-gray-5);
 }
 
-* {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-size-adjust: none;
-  -webkit-text-size-adjust: none;
-  -webkit-tap-highlight-color: transparent;
-  font-family: var(--pv-font-family, inherit);
-}
-
-/**
- * Typography variants.
- */
-.t-h1 {
-  font-weight: var(--pv-text-h1-weight);
-  font-size: var(--pv-text-h1-size);
-  line-height: var(--pv-text-h1-height);
-  letter-spacing: var(--pv-text-h1-spacing);
-}
-
-.t-h2 {
-  font-weight: var(--pv-text-h2-weight);
-  font-size: var(--pv-text-h2-size);
-  line-height: var(--pv-text-h2-height);
-  letter-spacing: var(--pv-text-h2-spacing);
-}
-
-.t-h3 {
-  font-weight: var(--pv-text-h3-weight);
-  font-size: var(--pv-text-h3-size);
-  line-height: var(--pv-text-h3-height);
-  letter-spacing: var(--pv-text-h3-spacing);
-}
-
-.t-h4 {
-  font-weight: var(--pv-text-h4-weight);
-  font-size: var(--pv-text-h4-size);
-  line-height: var(--pv-text-h4-height);
-  letter-spacing: var(--pv-text-h4-spacing);
-}
-
-.t-h5 {
-  font-weight: var(--pv-text-h5-weight);
-  font-size: var(--pv-text-h5-size);
-  line-height: var(--pv-text-h5-height);
-  letter-spacing: var(--pv-text-h5-spacing);
-}
-
-.t-s1 {
-  font-weight: var(--pv-text-s1-weight);
-  font-size: var(--pv-text-s1-size);
-  line-height: var(--pv-text-s1-height);
-  letter-spacing: var(--pv-text-s1-spacing);
-}
-
-.t-s2 {
-  font-weight: var(--pv-text-s2-weight);
-  font-size: var(--pv-text-s2-size);
-  line-height: var(--pv-text-s2-height);
-  letter-spacing: var(--pv-text-s2-spacing);
-}
-
-.t-b1 {
-  font-weight: var(--pv-text-b1-weight);
-  font-size: var(--pv-text-b1-size);
-  line-height: var(--pv-text-b1-height);
-  letter-spacing: var(--pv-text-b1-spacing);
-}
-
-.t-b2 {
-  font-weight: var(--pv-text-b2-weight);
-  font-size: var(--pv-text-b2-size);
-  line-height: var(--pv-text-b2-height);
-  letter-spacing: var(--pv-text-b2-spacing);
-}
-
-.t-b3 {
-  font-weight: var(--pv-text-b3-weight);
-  font-size: var(--pv-text-b3-size);
-  line-height: var(--pv-text-b3-height);
-  letter-spacing: var(--pv-text-b3-spacing);
-}
-
-.t-btn1 {
-  font-weight: var(--pv-text-btn1-weight);
-  font-size: var(--pv-text-btn1-size);
-  line-height: var(--pv-text-btn1-height);
-  letter-spacing: var(--pv-text-btn1-spacing);
-}
-
-.t-btn2 {
-  font-weight: var(--pv-text-btn2-weight);
-  font-size: var(--pv-text-btn2-size);
-  line-height: var(--pv-text-btn2-height);
-  letter-spacing: var(--pv-text-btn2-spacing);
-}
-
-.t-c1 {
-  font-weight: var(--pv-text-c1-weight);
-  font-size: var(--pv-text-c1-size);
-  line-height: var(--pv-text-c1-height);
-  letter-spacing: var(--pv-text-c1-spacing);
-}
-
-.t-c2 {
-  font-weight: var(--pv-text-c2-weight);
-  font-size: var(--pv-text-c2-size);
-  line-height: var(--pv-text-c2-height);
-  letter-spacing: var(--pv-text-c2-spacing);
-}
-
-/**
- *
- */
-/**
- * Color variants.
- */
-.c-primary-tint-5 {
-  --pv-color-base: var(--pv-color-primary-tint-5);
-}
-
-.c-primary-tint-4 {
-  --pv-color-base: var(--pv-color-primary-tint-4);
-}
-
-.c-primary-tint-3 {
-  --pv-color-base: var(--pv-color-primary-tint-3);
-}
-
-.c-primary-tint-2 {
-  --pv-color-base: var(--pv-color-primary-tint-2);
-}
-
-.c-primary-tint-1 {
-  --pv-color-base: var(--pv-color-primary-tint-1);
-}
-
-.c-primary {
-  --pv-color-base: var(--pv-color-primary);
-}
-
-.c-primary-shade-1 {
-  --pv-color-base: var(--pv-color-primary-shade-1);
-}
-
-.c-primary-shade-2 {
-  --pv-color-base: var(--pv-color-primary-shade-2);
-}
-
-.c-primary-shade-3 {
-  --pv-color-base: var(--pv-color-primary-shade-3);
-}
-
-.c-primary-shade-4 {
-  --pv-color-base: var(--pv-color-primary-shade-4);
-}
-
-.c-primary-shade-5 {
-  --pv-color-base: var(--pv-color-primary-shade-5);
-}
-
-.c-primary-contrast {
-  --pv-color-base: var(--pv-color-primary-contrast);
-}
-
-.c-secondary-tint-5 {
-  --pv-color-base: var(--pv-color-secondary-tint-5);
-}
-
-.c-secondary-tint-4 {
-  --pv-color-base: var(--pv-color-secondary-tint-4);
-}
-
-.c-secondary-tint-3 {
-  --pv-color-base: var(--pv-color-secondary-tint-3);
-}
-
-.c-secondary-tint-2 {
-  --pv-color-base: var(--pv-color-secondary-tint-2);
-}
-
-.c-secondary-tint-1 {
-  --pv-color-base: var(--pv-color-secondary-tint-1);
-}
-
-.c-secondary {
-  --pv-color-base: var(--pv-color-secondary);
-}
-
-.c-secondary-shade-1 {
-  --pv-color-base: var(--pv-color-secondary-shade-1);
-}
-
-.c-secondary-shade-2 {
-  --pv-color-base: var(--pv-color-secondary-shade-2);
-}
-
-.c-secondary-shade-3 {
-  --pv-color-base: var(--pv-color-secondary-shade-3);
-}
-
-.c-secondary-shade-4 {
-  --pv-color-base: var(--pv-color-secondary-shade-4);
-}
-
-.c-secondary-shade-5 {
-  --pv-color-base: var(--pv-color-secondary-shade-5);
-}
-
-.c-secondary-contrast {
-  --pv-color-base: var(--pv-color-secondary-contrast);
-}
-
-.c-wrong-tint-5 {
-  --pv-color-base: var(--pv-color-wrong-tint-5);
-}
-
-.c-wrong-tint-4 {
-  --pv-color-base: var(--pv-color-wrong-tint-4);
-}
-
-.c-wrong-tint-3 {
-  --pv-color-base: var(--pv-color-wrong-tint-3);
-}
-
-.c-wrong-tint-2 {
-  --pv-color-base: var(--pv-color-wrong-tint-2);
-}
-
-.c-wrong-tint-1 {
-  --pv-color-base: var(--pv-color-wrong-tint-1);
-}
-
-.c-wrong {
-  --pv-color-base: var(--pv-color-wrong);
-}
-
-.c-wrong-shade-1 {
-  --pv-color-base: var(--pv-color-wrong-shade-1);
-}
-
-.c-wrong-shade-2 {
-  --pv-color-base: var(--pv-color-wrong-shade-2);
-}
-
-.c-wrong-shade-3 {
-  --pv-color-base: var(--pv-color-wrong-shade-3);
-}
-
-.c-wrong-shade-4 {
-  --pv-color-base: var(--pv-color-wrong-shade-4);
-}
-
-.c-wrong-shade-5 {
-  --pv-color-base: var(--pv-color-wrong-shade-5);
-}
-
-.c-wrong-contrast {
-  --pv-color-base: var(--pv-color-wrong-contrast);
-}
-
-.c-attention-tint-5 {
-  --pv-color-base: var(--pv-color-attention-tint-5);
-}
-
-.c-attention-tint-4 {
-  --pv-color-base: var(--pv-color-attention-tint-4);
-}
-
-.c-attention-tint-3 {
-  --pv-color-base: var(--pv-color-attention-tint-3);
-}
-
-.c-attention-tint-2 {
-  --pv-color-base: var(--pv-color-attention-tint-2);
-}
-
-.c-attention-tint-1 {
-  --pv-color-base: var(--pv-color-attention-tint-1);
-}
-
-.c-attention {
-  --pv-color-base: var(--pv-color-attention);
-}
-
-.c-attention-shade-1 {
-  --pv-color-base: var(--pv-color-attention-shade-1);
-}
-
-.c-attention-shade-2 {
-  --pv-color-base: var(--pv-color-attention-shade-2);
-}
-
-.c-attention-shade-3 {
-  --pv-color-base: var(--pv-color-attention-shade-3);
-}
-
-.c-attention-shade-4 {
-  --pv-color-base: var(--pv-color-attention-shade-4);
-}
-
-.c-attention-shade-5 {
-  --pv-color-base: var(--pv-color-attention-shade-5);
-}
-
-.c-success-tint-5 {
-  --pv-color-base: var(--pv-color-success-tint-5);
-}
-
-.c-success-tint-4 {
-  --pv-color-base: var(--pv-color-success-tint-4);
-}
-
-.c-success-tint-3 {
-  --pv-color-base: var(--pv-color-success-tint-3);
-}
-
-.c-success-tint-2 {
-  --pv-color-base: var(--pv-color-success-tint-2);
-}
-
-.c-success-tint-1 {
-  --pv-color-base: var(--pv-color-success-tint-1);
-}
-
-.c-success {
-  --pv-color-base: var(--pv-color-success);
-}
-
-.c-success-shade-1 {
-  --pv-color-base: var(--pv-color-success-shade-1);
-}
-
-.c-success-shade-2 {
-  --pv-color-base: var(--pv-color-success-shade-2);
-}
-
-.c-success-shade-3 {
-  --pv-color-base: var(--pv-color-success-shade-3);
-}
-
-.c-success-shade-4 {
-  --pv-color-base: var(--pv-color-success-shade-4);
-}
-
-.c-success-shade-5 {
-  --pv-color-base: var(--pv-color-success-shade-5);
-}
-
-.c-black {
-  --pv-color-base: var(--pv-color-black);
-}
-
-.c-gray-10 {
-  --pv-color-base: var(--pv-color-gray-10);
-}
-
-.c-gray-9 {
-  --pv-color-base: var(--pv-color-gray-9);
-}
-
-.c-gray-8 {
-  --pv-color-base: var(--pv-color-gray-8);
-}
-
-.c-gray-7 {
-  --pv-color-base: var(--pv-color-gray-7);
-}
-
-.c-gray-6 {
-  --pv-color-base: var(--pv-color-gray-6);
-}
-
-.c-gray-5 {
-  --pv-color-base: var(--pv-color-gray-5);
-}
-
-.c-gray-4 {
-  --pv-color-base: var(--pv-color-gray-4);
-}
-
-.c-gray-3 {
-  --pv-color-base: var(--pv-color-gray-3);
-}
-
-.c-gray-2 {
-  --pv-color-base: var(--pv-color-gray-2);
-}
-
-.c-gray-1 {
-  --pv-color-base: var(--pv-color-gray-1);
-}
-
-.c-white {
-  --pv-color-base: var(--pv-color-white);
-}
-
-.c-extra-1 {
-  --pv-color-base: var(--pv-color-extra-1);
-}
-
-.c-extra-2 {
-  --pv-color-base: var(--pv-color-extra-2);
-}
-
-/**
- *
- */
-.typography {
-  color: var(--pv-color-base);
-}
-
-.button {
-  display: inline-flex;
-  cursor: pointer;
-  background: transparent;
-  border: none;
-  user-select: none;
-  white-space: nowrap;
-  text-decoration: none;
-  outline: none;
-  font-family: inherit;
-  border-radius: 4px;
-  height: var(--pv-size-base-6);
-  min-width: var(--pv-size-base-6);
-  padding: 0 var(--pv-size-base-2);
-  transition: background-color 200ms ease 0s;
-  align-items: center;
-  justify-content: center;
-  gap: var(--pv-size-base-2);
-  font-size: 0;
-}
-.button.m_no_padding {
-  padding: 0;
-}
-.button:hover {
-  background-color: var(--pv-color-gray-3);
-}
-.button:focus {
-  background-color: var(--pv-color-gray-4);
-}
-.button:active {
-  background-color: var(--pv-color-gray-5);
-}
-
 :host {
   display: block;
   width: 100%;

package/dist/collection/components/certificate-chain-viewer/certificate-chain-viewer.js

@@ -47,7 +47,6 @@ export class CertificateChainViewer {
         return {
             "certificates": {
                 "type": "unknown",
-                "attribute": "certificates",
                 "mutable": false,
                 "complexType": {
                     "original": "X509Certificates",
@@ -71,7 +70,6 @@ export class CertificateChainViewer {
             },
             "download": {
                 "type": "boolean",
-                "attribute": "download",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -86,7 +84,8 @@ export class CertificateChainViewer {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": true
+                "reflect": true,
+                "attribute": "download"
             }
         };
     }

package/dist/collection/components/certificate-chain-viewer/certificate-chain-viewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"certificate-chain-viewer.js","sourceRoot":"","sources":["../../../src/components/certificate-chain-viewer/certificate-chain-viewer.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EACL,SAAS,EACT,CAAC,EACD,IAAI,EACJ,KAAK,EACL,IAAI,GACL,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAO7D,MAAM,OAAO,sBAAsB;IALnC;QAgBW,6BAAwB,GAAG,CAAC,CAAC;KA4DvC;IA1DS,gBAAgB;QACtB,OAAO,CACL,WAAK,KAAK,EAAC,gBAAgB;YACzB,EAAC,UAAU,8CAEE,CACT,CACP,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YACvB,OAAO,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACjC,CAAC;QAED,OAAO,CACL,EAAC,IAAI;YACH,WACE,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,MAAM,IAEX,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE,CAAC,CACzD,cACE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,KAAK,mBACI,KAAK,KAAK,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EACzE,OAAO,EAAE,GAAG,EAAE;oBACZ,IAAI,CAAC,wBAAwB,GAAG,KAAK,CAAC;gBACxC,CAAC,IAEA,WAAW,CAAC,UAAU,CAChB,CACV,CAAC,CACE;YACL,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE;gBACxD,IAAI,KAAK,KAAK,IAAI,CAAC,wBAAwB,EAAE,CAAC;oBAC5C,OAAO,CACL,mCACE,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,KAAK,GACf,CACH,CAAC;gBACJ,CAAC;gBAED,OAAO,IAAI,CAAC;YACd,CAAC,CAAC;YAEF,iBACG,IAAI,CAAC,QAAQ,IAAI,CAChB,EAAC,aAAa,IACZ,WAAW,EAAE,IAAI,CAAC,YAAY,GAC9B,CACH,CACK,CACH,CACR,CAAC;IACJ,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  Prop,\n  State,\n  Host,\n} from '@stencil/core';\nimport { X509Certificates } from '../../crypto';\nimport { Typography } from '../typography';\nimport { Miscellaneous } from '../certificate-details-parts';\n\n@Component({\n  tag: 'peculiar-certificate-chain-viewer',\n  styleUrl: 'certificate-chain-viewer.scss',\n  shadow: true,\n})\nexport class CertificateChainViewer {\n  /**\n   * The certificate value for decode and show details. Use PEM or DER.\n   */\n  @Prop({ reflect: true }) certificates: X509Certificates;\n\n  /**\n   * If `true` - component will show split-button to download certificate as PEM or DER.\n   */\n  @Prop({ reflect: true }) download?: boolean;\n\n  @State() selectedCertificateIndex = 0;\n\n  private renderEmptyState() {\n    return (\n      <div class=\"status_wrapper\">\n        <Typography>\n          There is no certificates available.\n        </Typography>\n      </div>\n    );\n  }\n\n  render() {\n    if (!this.certificates) {\n      return this.renderEmptyState();\n    }\n\n    return (\n      <Host>\n        <div\n          role=\"tablist\"\n          class=\"tabs\"\n        >\n          {Array.from(this.certificates).map((certificate, index) => (\n            <button\n              type=\"button\"\n              role=\"tab\"\n              class=\"tab\"\n              aria-selected={index === this.selectedCertificateIndex ? 'true' : 'false'}\n              onClick={() => {\n                this.selectedCertificateIndex = index;\n              }}\n            >\n              {certificate.commonName}\n            </button>\n          ))}\n        </div>\n        {Array.from(this.certificates).map((certificate, index) => {\n          if (index === this.selectedCertificateIndex) {\n            return (\n              <peculiar-certificate-viewer\n                certificate={certificate}\n                download={false}\n              />\n            );\n          }\n\n          return null;\n        })}\n\n        <table>\n          {this.download && (\n            <Miscellaneous\n              certificate={this.certificates}\n            />\n          )}\n        </table>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"certificate-chain-viewer.js","sourceRoot":"","sources":["../../../src/components/certificate-chain-viewer/certificate-chain-viewer.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EACL,SAAS,EACT,CAAC,EACD,IAAI,EACJ,KAAK,EACL,IAAI,GACL,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAO7D,MAAM,OAAO,sBAAsB;IALnC;QAgBW,6BAAwB,GAAG,CAAC,CAAC;KA4DvC;IA1DS,gBAAgB;QACtB,OAAO,CACL,WAAK,KAAK,EAAC,gBAAgB;YACzB,EAAC,UAAU,8CAEE,CACT,CACP,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YACvB,OAAO,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACjC,CAAC;QAED,OAAO,CACL,EAAC,IAAI;YACH,WACE,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,MAAM,IAEX,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE,CAAC,CACzD,cACE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,KAAK,mBACI,KAAK,KAAK,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EACzE,OAAO,EAAE,GAAG,EAAE;oBACZ,IAAI,CAAC,wBAAwB,GAAG,KAAK,CAAC;gBACxC,CAAC,IAEA,WAAW,CAAC,UAAU,CAChB,CACV,CAAC,CACE;YACL,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE;gBACxD,IAAI,KAAK,KAAK,IAAI,CAAC,wBAAwB,EAAE,CAAC;oBAC5C,OAAO,CACL,mCACE,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,KAAK,GACf,CACH,CAAC;gBACJ,CAAC;gBAED,OAAO,IAAI,CAAC;YACd,CAAC,CAAC;YAEF,iBACG,IAAI,CAAC,QAAQ,IAAI,CAChB,EAAC,aAAa,IACZ,WAAW,EAAE,IAAI,CAAC,YAAY,GAC9B,CACH,CACK,CACH,CACR,CAAC;IACJ,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  Prop,\n  State,\n  Host,\n} from '@stencil/core';\nimport { X509Certificates } from '../../crypto';\nimport { Typography } from '../typography';\nimport { Miscellaneous } from '../certificate-details-parts';\n\n@Component({\n  tag: 'peculiar-certificate-chain-viewer',\n  styleUrl: 'certificate-chain-viewer.scss',\n  shadow: true,\n})\nexport class CertificateChainViewer {\n  /**\n   * The certificate value for decode and show details. Use PEM or DER.\n   */\n  @Prop({ reflect: true }) certificates: X509Certificates;\n\n  /**\n   * If `true` - component will show split-button to download certificate as PEM or DER.\n   */\n  @Prop({ reflect: true }) download?: boolean;\n\n  @State() selectedCertificateIndex = 0;\n\n  private renderEmptyState() {\n    return (\n      <div class=\"status_wrapper\">\n        <Typography>\n          There is no certificates available.\n        </Typography>\n      </div>\n    );\n  }\n\n  render() {\n    if (!this.certificates) {\n      return this.renderEmptyState();\n    }\n\n    return (\n      <Host>\n        <div\n          role=\"tablist\"\n          class=\"tabs\"\n        >\n          {Array.from(this.certificates).map((certificate, index) => (\n            <button\n              type=\"button\"\n              role=\"tab\"\n              class=\"tab\"\n              aria-selected={index === this.selectedCertificateIndex ? 'true' : 'false'}\n              onClick={() => {\n                this.selectedCertificateIndex = index;\n              }}\n            >\n              {certificate.commonName}\n            </button>\n          ))}\n        </div>\n        {Array.from(this.certificates).map((certificate, index) => {\n          if (index === this.selectedCertificateIndex) {\n            return (\n              <peculiar-certificate-viewer\n                certificate={certificate}\n                download={false}\n              />\n            );\n          }\n\n          return null;\n        })}\n\n        <table>\n          {this.download && (\n            <Miscellaneous\n              certificate={this.certificates}\n            />\n          )}\n        </table>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/certificate-decoder/certificate-decoder.js

@@ -113,7 +113,7 @@ export class CertificateDecoder {
     }
     render() {
         var _a;
-        return (h(Host, { key: '9067f2d7f33a40b3ad0ba03c7338a6f800100dab' }, h("textarea", { key: '9e8962631c259fd5e144a1397d8591dde46d032f', placeholder: "Certificate DER or PEM", class: "textarea t-b2 c-black", ref: (el) => { this.inputPaste = el; }, onDrop: this.handleDropFile }), h("div", { key: '9be2b1e6c9b3de94c9d5e1e6cf31d9fb487960d8', class: "controls" }, h("div", { key: '3959b89ab5c5654a3c10a1166743c056c0340e2e', class: "control_row" }, h(Typography, { key: '3c03f42d14ff5a485264523bab40765bb4f89a8f', variant: "b3", color: "secondary-tint-2" }, "Drag or load file:"), h("input", { key: '3c8682f5de0b0e2f84e37a8a05882ebcf331daef', type: "file", accept: "application/pkix-cert,application/x-x509-ca-cert,application/x-x509-user-cert,application/pkcs10,application/pkix-crl,.csr,.req,.crl,.cert", value: "", onChange: this.handleChangeInputFile })), ((_a = this.certificateExamples) === null || _a === void 0 ? void 0 : _a.length) && (h("div", { key: '7c38788ccf4b038126ddf6909ec1d3de76325660', class: "control_row" }, h(Typography, { key: 'c1c13aaad3d1df51465c6c51ee24f45313de8f1c', variant: "b3", color: "secondary-tint-2" }, "Load examples:"), h("select", { key: '811c4440269bb0a0a55f488e10dfa12093b18d7b', onChange: this.handleChangeExample }, h("option", { key: 'd2e30396fe3a59d5c46c83c6cd1e5b5a58f15f73', value: "" }, "None"), this.certificateExamples.map((example) => (h("option", { value: example.value }, example.title)))))), h("div", { key: '58daae2b9d8e2dd4c698ec9ad6e7f0d8b2500883', class: "control_row" }, h(Button, { key: 'd7f813370ace60deaad975622cc26b9a497ce9d2', onClick: this.handleClickDecode }, "Decode"), h(Button, { key: 'ec2fbeb6283ffd17c7328ee78c9464926b0bbb6b', onClick: this.handleClickClear }, "Clear"))), this.renderCertificate()));
+        return (h(Host, { key: '9067f2d7f33a40b3ad0ba03c7338a6f800100dab' }, h("textarea", { key: '9e8962631c259fd5e144a1397d8591dde46d032f', placeholder: "Certificate DER or PEM", class: "textarea t-b2 c-black", ref: (el) => { this.inputPaste = el; }, onDrop: this.handleDropFile }), h("div", { key: '9be2b1e6c9b3de94c9d5e1e6cf31d9fb487960d8', class: "controls" }, h("div", { key: '3959b89ab5c5654a3c10a1166743c056c0340e2e', class: "control_row" }, h(Typography, { key: '3c03f42d14ff5a485264523bab40765bb4f89a8f', variant: "b3", color: "secondary-tint-2" }, "Drag or load file:"), h("input", { key: '29845cfd11955ded4b43d19be3ede89d77b71fef', type: "file", accept: "application/pkix-cert,application/x-x509-ca-cert,application/x-x509-user-cert,application/pkcs10,application/pkix-crl,.csr,.req,.crl,.pub", value: "", onChange: this.handleChangeInputFile })), ((_a = this.certificateExamples) === null || _a === void 0 ? void 0 : _a.length) && (h("div", { key: 'ec2e21cdcda421bd046d42607569e90eb0a96589', class: "control_row" }, h(Typography, { key: '17850c755e70545949be4f772ec67f02eae829af', variant: "b3", color: "secondary-tint-2" }, "Load examples:"), h("select", { key: '4431af8f0dcc97fd8e26637cef8a9524a83e9519', onChange: this.handleChangeExample }, h("option", { key: 'c08edb4c2faf0f640e100cf62ae7ad07f0714cc3', value: "" }, "None"), this.certificateExamples.map((example) => (h("option", { value: example.value }, example.title)))))), h("div", { key: 'e7f7a693ef5f72ce739fe6a42d8c87345d23a743', class: "control_row" }, h(Button, { key: '7448517bf7f76af06f8a7f60d1e40360613d3acd', onClick: this.handleClickDecode }, "Decode"), h(Button, { key: 'b831592de27a3b292b2d81a19400216fbce7e797', onClick: this.handleClickClear }, "Clear"))), this.renderCertificate()));
     }
     static get is() { return "peculiar-certificate-decoder"; }
     static get encapsulation() { return "shadow"; }
@@ -131,7 +131,6 @@ export class CertificateDecoder {
         return {
             "certificateExamples": {
                 "type": "unknown",
-                "attribute": "certificate-examples",
                 "mutable": false,
                 "complexType": {
                     "original": "{\n    title: string;\n    value: string;\n  }[]",
@@ -149,7 +148,6 @@ export class CertificateDecoder {
             },
             "certificateToDecode": {
                 "type": "string",
-                "attribute": "certificate-to-decode",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -164,7 +162,8 @@ export class CertificateDecoder {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "certificate-to-decode"
             }
         };
     }

package/dist/collection/components/certificate-decoder/certificate-decoder.js.map

@@ -1 +1 @@
-{"version":3,"file":"certificate-decoder.js","sourceRoot":"","sources":["../../../src/components/certificate-decoder/certificate-decoder.tsx"],"names":[],"mappings":"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","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  Host,\n  h,\n  State,\n  Prop,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { readAsBinaryString } from '../../utils';\nimport {\n  X509Certificate,\n  X509AttributeCertificate,\n  Pkcs10CertificateRequest,\n  X509Crl,\n  X509Certificates,\n  SshCertificate,\n} from '../../crypto';\nimport { Button } from '../button';\nimport { Typography } from '../typography';\n\n@Component({\n  tag: 'peculiar-certificate-decoder',\n  styleUrl: 'certificate-decoder.scss',\n  shadow: true,\n})\nexport class CertificateDecoder {\n  private inputPaste?: HTMLTextAreaElement;\n\n  /**\n   * The example certificate value for decode and show details. Use PEM or DER.\n   */\n  @Prop() certificateExamples?: {\n    title: string;\n    value: string;\n  }[];\n\n  /**\n   * The default certificate value for decode and show details. Use PEM or DER.\n   */\n  @Prop() certificateToDecode?: string;\n\n  @State() certificateDecoded: X509Certificates\n    | X509Certificate\n    | X509AttributeCertificate\n    | Pkcs10CertificateRequest\n    | X509Crl\n    | SshCertificate;\n\n  /**\n   * Emitted when the certificate has been successfully parsed.\n   */\n  @Event() successParse!: EventEmitter<string>;\n\n  /**\n   * Emitted when the certificate has been removed.\n   */\n  @Event() clearCertificate!: EventEmitter<void>;\n\n  componentDidLoad() {\n    if (this.certificateToDecode) {\n      /**\n       * Prevent Stencil warning about re-render\n       */\n      setTimeout(() => this.decode(this.certificateToDecode), 100);\n    }\n  }\n\n  private handleClickDecode = () => {\n    const { value } = this.inputPaste;\n\n    if (value) {\n      this.decode(value);\n    }\n  };\n\n  private handleClickClear = () => {\n    this.clearValue();\n  };\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private handleChangeInputFile = async (event: any) => {\n    const element = event.target;\n\n    if (element.files) {\n      const file = await readAsBinaryString(element.files[0]);\n\n      if (typeof file.value === 'string') {\n        this.decode(file.value);\n      }\n\n      element.value = '';\n    }\n  };\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private handleChangeExample = (event: any) => {\n    if (event.target.value) {\n      this.decode(event.target.value);\n    } else {\n      this.clearValue();\n    }\n  };\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private handleDropFile = async (event: any) => {\n    event.stopPropagation();\n    event.preventDefault();\n\n    const element = event.dataTransfer;\n\n    if (element.files) {\n      const file = await readAsBinaryString(element.files[0]);\n\n      if (typeof file.value === 'string') {\n        this.decode(file.value);\n      }\n    }\n  };\n\n  clearValue() {\n    this.inputPaste.value = '';\n    this.certificateDecoded = null;\n    this.clearCertificate.emit();\n  }\n\n  async setValue(value: typeof this.certificateDecoded) {\n    this.certificateDecoded = value;\n\n    this.inputPaste.value = await value.toString('pem');\n    this.successParse.emit(await value.toString('base64url'));\n  }\n\n  async decode(value: string) {\n    new Promise<X509Certificates>((resolve) => {\n      resolve(new X509Certificates(value));\n    })\n      .catch(() => new X509Certificate(value))\n      .catch(() => new X509AttributeCertificate(value))\n      .catch(() => new Pkcs10CertificateRequest(value))\n      .catch(() => new X509Crl(value))\n      .catch(() => new SshCertificate(value))\n      .then((res: typeof this.certificateDecoded) => this.setValue(res))\n      .catch((error) => {\n        console.log(error);\n\n        alert(`Error decoding certificate:\\n\"${value}\"\\n\\nPlease try to use Certificate/AttributeCertificate/CertificateRequest/CRL.`);\n      });\n  }\n\n  renderCertificate() {\n    if (this.certificateDecoded instanceof X509Certificates) {\n      return (\n        <peculiar-certificate-chain-viewer\n          certificates={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof X509Certificate) {\n      return (\n        <peculiar-certificate-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof X509AttributeCertificate) {\n      return (\n        <peculiar-attribute-certificate-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof Pkcs10CertificateRequest) {\n      return (\n        <peculiar-csr-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof X509Crl) {\n      return (\n        <peculiar-crl-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof SshCertificate) {\n      return (\n        <peculiar-ssh-certificate-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    return null;\n  }\n\n  render() {\n    return (\n      <Host>\n        <textarea\n          placeholder=\"Certificate DER or PEM\"\n          class=\"textarea t-b2 c-black\"\n          ref={(el) => { this.inputPaste = el; }}\n          onDrop={this.handleDropFile}\n        />\n        <div class=\"controls\">\n          <div class=\"control_row\">\n            <Typography\n              variant=\"b3\"\n              color=\"secondary-tint-2\"\n            >\n              Drag or load file:\n            </Typography>\n            <input\n              type=\"file\"\n              accept=\"application/pkix-cert,application/x-x509-ca-cert,application/x-x509-user-cert,application/pkcs10,application/pkix-crl,.csr,.req,.crl,.cert\"\n              value=\"\"\n              onChange={this.handleChangeInputFile}\n            />\n          </div>\n          {this.certificateExamples?.length && (\n            <div class=\"control_row\">\n              <Typography\n                variant=\"b3\"\n                color=\"secondary-tint-2\"\n              >\n                Load examples:\n              </Typography>\n              <select onChange={this.handleChangeExample}>\n                <option value=\"\">None</option>\n                {this.certificateExamples.map((example) => (\n                  <option value={example.value}>\n                    {example.title}\n                  </option>\n                ))}\n              </select>\n            </div>\n          )}\n          <div class=\"control_row\">\n            <Button\n              onClick={this.handleClickDecode}\n            >\n              Decode\n            </Button>\n            <Button\n              onClick={this.handleClickClear}\n            >\n              Clear\n            </Button>\n          </div>\n        </div>\n        {this.renderCertificate()}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"certificate-decoder.js","sourceRoot":"","sources":["../../../src/components/certificate-decoder/certificate-decoder.tsx"],"names":[],"mappings":"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","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  Host,\n  h,\n  State,\n  Prop,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { readAsBinaryString } from '../../utils';\nimport {\n  X509Certificate,\n  X509AttributeCertificate,\n  Pkcs10CertificateRequest,\n  X509Crl,\n  X509Certificates,\n  SshCertificate,\n} from '../../crypto';\nimport { Button } from '../button';\nimport { Typography } from '../typography';\n\n@Component({\n  tag: 'peculiar-certificate-decoder',\n  styleUrl: 'certificate-decoder.scss',\n  shadow: true,\n})\nexport class CertificateDecoder {\n  private inputPaste?: HTMLTextAreaElement;\n\n  /**\n   * The example certificate value for decode and show details. Use PEM or DER.\n   */\n  @Prop() certificateExamples?: {\n    title: string;\n    value: string;\n  }[];\n\n  /**\n   * The default certificate value for decode and show details. Use PEM or DER.\n   */\n  @Prop() certificateToDecode?: string;\n\n  @State() certificateDecoded: X509Certificates\n    | X509Certificate\n    | X509AttributeCertificate\n    | Pkcs10CertificateRequest\n    | X509Crl\n    | SshCertificate;\n\n  /**\n   * Emitted when the certificate has been successfully parsed.\n   */\n  @Event() successParse!: EventEmitter<string>;\n\n  /**\n   * Emitted when the certificate has been removed.\n   */\n  @Event() clearCertificate!: EventEmitter<void>;\n\n  componentDidLoad() {\n    if (this.certificateToDecode) {\n      /**\n       * Prevent Stencil warning about re-render\n       */\n      setTimeout(() => this.decode(this.certificateToDecode), 100);\n    }\n  }\n\n  private handleClickDecode = () => {\n    const { value } = this.inputPaste;\n\n    if (value) {\n      this.decode(value);\n    }\n  };\n\n  private handleClickClear = () => {\n    this.clearValue();\n  };\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private handleChangeInputFile = async (event: any) => {\n    const element = event.target;\n\n    if (element.files) {\n      const file = await readAsBinaryString(element.files[0]);\n\n      if (typeof file.value === 'string') {\n        this.decode(file.value);\n      }\n\n      element.value = '';\n    }\n  };\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private handleChangeExample = (event: any) => {\n    if (event.target.value) {\n      this.decode(event.target.value);\n    } else {\n      this.clearValue();\n    }\n  };\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private handleDropFile = async (event: any) => {\n    event.stopPropagation();\n    event.preventDefault();\n\n    const element = event.dataTransfer;\n\n    if (element.files) {\n      const file = await readAsBinaryString(element.files[0]);\n\n      if (typeof file.value === 'string') {\n        this.decode(file.value);\n      }\n    }\n  };\n\n  clearValue() {\n    this.inputPaste.value = '';\n    this.certificateDecoded = null;\n    this.clearCertificate.emit();\n  }\n\n  async setValue(value: typeof this.certificateDecoded) {\n    this.certificateDecoded = value;\n\n    this.inputPaste.value = await value.toString('pem');\n    this.successParse.emit(await value.toString('base64url'));\n  }\n\n  async decode(value: string) {\n    new Promise<X509Certificates>((resolve) => {\n      resolve(new X509Certificates(value));\n    })\n      .catch(() => new X509Certificate(value))\n      .catch(() => new X509AttributeCertificate(value))\n      .catch(() => new Pkcs10CertificateRequest(value))\n      .catch(() => new X509Crl(value))\n      .catch(() => new SshCertificate(value))\n      .then((res: typeof this.certificateDecoded) => this.setValue(res))\n      .catch((error) => {\n        console.log(error);\n\n        alert(`Error decoding certificate:\\n\"${value}\"\\n\\nPlease try to use Certificate/AttributeCertificate/CertificateRequest/CRL.`);\n      });\n  }\n\n  renderCertificate() {\n    if (this.certificateDecoded instanceof X509Certificates) {\n      return (\n        <peculiar-certificate-chain-viewer\n          certificates={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof X509Certificate) {\n      return (\n        <peculiar-certificate-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof X509AttributeCertificate) {\n      return (\n        <peculiar-attribute-certificate-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof Pkcs10CertificateRequest) {\n      return (\n        <peculiar-csr-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof X509Crl) {\n      return (\n        <peculiar-crl-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    if (this.certificateDecoded instanceof SshCertificate) {\n      return (\n        <peculiar-ssh-certificate-viewer\n          certificate={this.certificateDecoded}\n          download\n        />\n      );\n    }\n\n    return null;\n  }\n\n  render() {\n    return (\n      <Host>\n        <textarea\n          placeholder=\"Certificate DER or PEM\"\n          class=\"textarea t-b2 c-black\"\n          ref={(el) => { this.inputPaste = el; }}\n          onDrop={this.handleDropFile}\n        />\n        <div class=\"controls\">\n          <div class=\"control_row\">\n            <Typography\n              variant=\"b3\"\n              color=\"secondary-tint-2\"\n            >\n              Drag or load file:\n            </Typography>\n            <input\n              type=\"file\"\n              accept=\"application/pkix-cert,application/x-x509-ca-cert,application/x-x509-user-cert,application/pkcs10,application/pkix-crl,.csr,.req,.crl,.pub\"\n              value=\"\"\n              onChange={this.handleChangeInputFile}\n            />\n          </div>\n          {this.certificateExamples?.length && (\n            <div class=\"control_row\">\n              <Typography\n                variant=\"b3\"\n                color=\"secondary-tint-2\"\n              >\n                Load examples:\n              </Typography>\n              <select onChange={this.handleChangeExample}>\n                <option value=\"\">None</option>\n                {this.certificateExamples.map((example) => (\n                  <option value={example.value}>\n                    {example.title}\n                  </option>\n                ))}\n              </select>\n            </div>\n          )}\n          <div class=\"control_row\">\n            <Button\n              onClick={this.handleClickDecode}\n            >\n              Decode\n            </Button>\n            <Button\n              onClick={this.handleClickClear}\n            >\n              Clear\n            </Button>\n          </div>\n        </div>\n        {this.renderCertificate()}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/certificate-details-parts/extensions/certificate_transparency_extension.js

@@ -17,7 +17,7 @@ export const CertificateTransparencyExtension = (props) => {
     const { extension } = props;
     return (h(BasicExtension, { extension: extension }, Boolean(extension.value.items.length) && ([
         h(RowValue, { name: "Signed Certificate Timestamps", value: "" }),
-        extension.value.toJSON().map((signedCertificateTimestamp) => (h(TableRowTable, null, h(RowValue, { name: "Version", value: signedCertificateTimestamp.version + 1 }), h(RowValue, { name: "Log Operator", value: logs[signedCertificateTimestamp.logId] || signedCertificateTimestamp.logId }), h(RowValue, { name: "Log Key ID", value: signedCertificateTimestamp.logId, monospace: true }), h(RowValue, { name: "Timestamp", value: dateShort(signedCertificateTimestamp.timestamp) }), h(RowValue, { name: "Signature Algorithm", value: `${signedCertificateTimestamp.hashAlgorithm} ${signedCertificateTimestamp.signatureAlgorithm}`.toUpperCase() }), h(RowValue, { name: "Signature", value: signedCertificateTimestamp.signature, monospace: true })))),
+        extension.value.toJSON().map((signedCertificateTimestamp) => (h(TableRowTable, null, h(RowValue, { name: "Version", value: signedCertificateTimestamp.version + 1 }), h(RowValue, { name: "Log Operator", value: logs[signedCertificateTimestamp.logId] || signedCertificateTimestamp.logId }), h(RowValue, { name: "Log Key ID", value: signedCertificateTimestamp.logId, monospace: true }), h(RowValue, { name: "Timestamp", value: dateShort(signedCertificateTimestamp.timestamp) }), h(RowValue, { name: "Signature Algorithm", value: `${signedCertificateTimestamp.hashAlgorithm} ${signedCertificateTimestamp.signatureAlgorithm}`.toUpperCase() }), h(RowValue, { name: "Signature", value: signedCertificateTimestamp.signature, monospace: true }), h(RowValue, { name: "Extensions", value: signedCertificateTimestamp.extensions || undefined, monospace: true })))),
     ])));
 };
 //# sourceMappingURL=certificate_transparency_extension.js.map

package/dist/collection/components/certificate-details-parts/extensions/certificate_transparency_extension.js.map

@@ -1 +1 @@
-{"version":3,"file":"certificate_transparency_extension.js","sourceRoot":"","sources":["../../../../src/components/certificate-details-parts/extensions/certificate_transparency_extension.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,CAAC,EAAuB,MAAM,eAAe,CAAC;AAGvD,OAAO,IAAI,MAAM,yBAAyB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAMnD,MAAM,CAAC,MAAM,gCAAgC,GACiB,CAAC,KAAK,EAAE,EAAE;IACtE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAE5B,OAAO,CACL,EAAC,cAAc,IACb,SAAS,EAAE,SAAS,IAEnB,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;QACzC,EAAC,QAAQ,IACP,IAAI,EAAC,+BAA+B,EACpC,KAAK,EAAC,EAAE,GACR;QACF,SAAS,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,0BAA0B,EAAE,EAAE,CAAC,CAC3D,EAAC,aAAa;YACZ,EAAC,QAAQ,IACP,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,0BAA0B,CAAC,OAAO,GAAG,CAAC,GAC7C;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,IAAI,CAAC,0BAA0B,CAAC,KAAK,CAAC,IAAI,0BAA0B,CAAC,KAAK,GACjF;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,0BAA0B,CAAC,KAAK,EACvC,SAAS,SACT;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,SAAS,CAAC,0BAA0B,CAAC,SAAS,CAAC,GACtD;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,qBAAqB,EAC1B,KAAK,EAAE,GAAG,0BAA0B,CAAC,aAAa,IAAI,0BAA0B,CAAC,kBAAkB,EAAE,CAAC,WAAW,EAAE,GACnH;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,0BAA0B,CAAC,SAAS,EAC3C,SAAS,SACT,CACY,CACjB,CAAC;KACH,CAAC,CACa,CAClB,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 { h, FunctionalComponent } from '@stencil/core';\nimport type { CertificateTransparency } from '@peculiar/asn1-cert-transparency';\nimport type { Extension } from '../../../crypto/extension';\nimport logs from '../../../constants/logs';\nimport { dateShort } from '../../../utils';\nimport { RowValue, TableRowTable } from '../row';\nimport { BasicExtension } from './basic_extension';\n\ninterface ICertificateTransparencyExtensionProps {\n  extension: Extension<CertificateTransparency>;\n}\n\nexport const CertificateTransparencyExtension:\nFunctionalComponent<ICertificateTransparencyExtensionProps> = (props) => {\n  const { extension } = props;\n\n  return (\n    <BasicExtension\n      extension={extension}\n    >\n      {Boolean(extension.value.items.length) && ([\n        <RowValue\n          name=\"Signed Certificate Timestamps\"\n          value=\"\"\n        />,\n        extension.value.toJSON().map((signedCertificateTimestamp) => (\n          <TableRowTable>\n            <RowValue\n              name=\"Version\"\n              value={signedCertificateTimestamp.version + 1}\n            />\n            <RowValue\n              name=\"Log Operator\"\n              value={logs[signedCertificateTimestamp.logId] || signedCertificateTimestamp.logId}\n            />\n            <RowValue\n              name=\"Log Key ID\"\n              value={signedCertificateTimestamp.logId}\n              monospace\n            />\n            <RowValue\n              name=\"Timestamp\"\n              value={dateShort(signedCertificateTimestamp.timestamp)}\n            />\n            <RowValue\n              name=\"Signature Algorithm\"\n              value={`${signedCertificateTimestamp.hashAlgorithm} ${signedCertificateTimestamp.signatureAlgorithm}`.toUpperCase()}\n            />\n            <RowValue\n              name=\"Signature\"\n              value={signedCertificateTimestamp.signature}\n              monospace\n            />\n          </TableRowTable>\n        )),\n      ])}\n    </BasicExtension>\n  );\n};\n"]}
+{"version":3,"file":"certificate_transparency_extension.js","sourceRoot":"","sources":["../../../../src/components/certificate-details-parts/extensions/certificate_transparency_extension.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,CAAC,EAAuB,MAAM,eAAe,CAAC;AAGvD,OAAO,IAAI,MAAM,yBAAyB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAMnD,MAAM,CAAC,MAAM,gCAAgC,GACiB,CAAC,KAAK,EAAE,EAAE;IACtE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAE5B,OAAO,CACL,EAAC,cAAc,IACb,SAAS,EAAE,SAAS,IAEnB,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;QACzC,EAAC,QAAQ,IACP,IAAI,EAAC,+BAA+B,EACpC,KAAK,EAAC,EAAE,GACR;QACF,SAAS,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,0BAA0B,EAAE,EAAE,CAAC,CAC3D,EAAC,aAAa;YACZ,EAAC,QAAQ,IACP,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,0BAA0B,CAAC,OAAO,GAAG,CAAC,GAC7C;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,IAAI,CAAC,0BAA0B,CAAC,KAAK,CAAC,IAAI,0BAA0B,CAAC,KAAK,GACjF;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,0BAA0B,CAAC,KAAK,EACvC,SAAS,SACT;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,SAAS,CAAC,0BAA0B,CAAC,SAAS,CAAC,GACtD;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,qBAAqB,EAC1B,KAAK,EAAE,GAAG,0BAA0B,CAAC,aAAa,IAAI,0BAA0B,CAAC,kBAAkB,EAAE,CAAC,WAAW,EAAE,GACnH;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,0BAA0B,CAAC,SAAS,EAC3C,SAAS,SACT;YACF,EAAC,QAAQ,IACP,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,0BAA0B,CAAC,UAAU,IAAI,SAAS,EACzD,SAAS,SACT,CACY,CACjB,CAAC;KACH,CAAC,CACa,CAClB,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 { h, FunctionalComponent } from '@stencil/core';\nimport type { CertificateTransparency } from '@peculiar/asn1-cert-transparency';\nimport type { Extension } from '../../../crypto/extension';\nimport logs from '../../../constants/logs';\nimport { dateShort } from '../../../utils';\nimport { RowValue, TableRowTable } from '../row';\nimport { BasicExtension } from './basic_extension';\n\ninterface ICertificateTransparencyExtensionProps {\n  extension: Extension<CertificateTransparency>;\n}\n\nexport const CertificateTransparencyExtension:\nFunctionalComponent<ICertificateTransparencyExtensionProps> = (props) => {\n  const { extension } = props;\n\n  return (\n    <BasicExtension\n      extension={extension}\n    >\n      {Boolean(extension.value.items.length) && ([\n        <RowValue\n          name=\"Signed Certificate Timestamps\"\n          value=\"\"\n        />,\n        extension.value.toJSON().map((signedCertificateTimestamp) => (\n          <TableRowTable>\n            <RowValue\n              name=\"Version\"\n              value={signedCertificateTimestamp.version + 1}\n            />\n            <RowValue\n              name=\"Log Operator\"\n              value={logs[signedCertificateTimestamp.logId] || signedCertificateTimestamp.logId}\n            />\n            <RowValue\n              name=\"Log Key ID\"\n              value={signedCertificateTimestamp.logId}\n              monospace\n            />\n            <RowValue\n              name=\"Timestamp\"\n              value={dateShort(signedCertificateTimestamp.timestamp)}\n            />\n            <RowValue\n              name=\"Signature Algorithm\"\n              value={`${signedCertificateTimestamp.hashAlgorithm} ${signedCertificateTimestamp.signatureAlgorithm}`.toUpperCase()}\n            />\n            <RowValue\n              name=\"Signature\"\n              value={signedCertificateTimestamp.signature}\n              monospace\n            />\n            <RowValue\n              name=\"Extensions\"\n              value={signedCertificateTimestamp.extensions || undefined}\n              monospace\n            />\n          </TableRowTable>\n        )),\n      ])}\n    </BasicExtension>\n  );\n};\n"]}

package/dist/collection/components/certificate-details-parts/extensions/qc_statements_extension.js

@@ -19,7 +19,7 @@ import { BasicExtension } from "./basic_extension";
 export const QCStatementsExtension = (props) => {
     const { extension } = props;
     function renderStatementInfo(statementId, statementInfo) {
-        if (!statementInfo.byteLength) {
+        if (!statementInfo || !statementInfo.byteLength) {
             return null;
         }
         if (statementId === id_qcs_pkixQCSyntax_v2) {