@peculiar/certificates-viewer 4.2.0 → 4.2.2

package/components/certificate-viewer.js

@@ -2,8 +2,8 @@
  * © Peculiar Ventures https://peculiarventures.com/ - MIT License
  */
 import { proxyCustomElement, HTMLElement, Build, h, Host } from '@stencil/core/internal/client';
-import { A as AsnData, c as certificateRawToBuffer, a1 as Certificate, a2 as Name, d as dateDiff, E as Extension, b as AsnConvert, a3 as id_ecPublicKey, a4 as ECParameters, a5 as id_rsaEncryption, a6 as RSAPublicKey, a7 as id_composite_key, a8 as CompositePublicKey, a9 as id_alg_composite, aa as CompositeSignatureValue, ab as CompositeParams, h as hexFormat, e as base64Format, g as getCertificateThumbprint, B as BasicInformation, S as Signature, T as Thumbprints, n as Extensions, j as getLEILink, k as getDNSNameLink, m as getIPAddressLink, M as Miscellaneous } from './miscellaneous.js';
-import { C as Convert_1, D as Download } from './download.js';
+import { A as AsnData, c as certificateRawToBuffer, aR as Certificate, f as Convert_1, N as Name, O as dateDiff, j as Extension, b as AsnConvert, i as id_ecPublicKey, E as ECParameters, e as id_rsaEncryption, R as RSAPublicKey, aS as id_composite_key, aT as CompositePublicKey, aU as id_alg_composite, aV as CompositeSignatureValue, aW as CompositeParams, g as getCertificateThumbprint, k as base64Format, l as hexFormat, D as Download } from './download.js';
+import { B as BasicInformation, S as Signature, b as Thumbprints, E as Extensions, c as getLEILink, d as getDNSNameLink, e as getIPAddressLink, M as Miscellaneous } from './miscellaneous.js';
 import { S as SubjectName, P as PublicKey } from './subject_name.js';
 import { I as IssuerName } from './issuer_name.js';
 import { T as Typography } from './button.js';
@@ -16,283 +16,286 @@ import { T as Typography } from './button.js';
  * LICENSE file in the root directory of this source tree.
  */
 class X509Certificate extends AsnData {
-  constructor(raw) {
-    super(certificateRawToBuffer(raw), Certificate);
-    this.thumbprints = {};
-    this.type = 'X.509 Certificate';
-    const { tbsCertificate } = this.asn;
-    this.serialNumber = Convert_1.ToHex(tbsCertificate.serialNumber);
-    this.subject = new Name(tbsCertificate.subject).toJSON();
-    this.issuer = new Name(tbsCertificate.issuer).toJSON();
-    this.version = tbsCertificate.version + 1;
-    const notBefore = tbsCertificate.validity.notBefore.utcTime
-      || tbsCertificate.validity.notBefore.generalTime;
-    if (!notBefore) {
-      throw new Error("Cannot get 'notBefore' value");
+    constructor(raw) {
+        super(certificateRawToBuffer(raw), Certificate);
+        this.thumbprints = {};
+        this.type = 'X.509 Certificate';
+        this.tag = 'CERTIFICATE';
+        const { tbsCertificate } = this.asn;
+        this.serialNumber = Convert_1.ToHex(tbsCertificate.serialNumber);
+        this.subject = new Name(tbsCertificate.subject).toJSON();
+        this.issuer = new Name(tbsCertificate.issuer).toJSON();
+        this.version = tbsCertificate.version + 1;
+        const notBefore = tbsCertificate.validity.notBefore.utcTime
+            || tbsCertificate.validity.notBefore.generalTime;
+        if (!notBefore) {
+            throw new Error("Cannot get 'notBefore' value");
+        }
+        this.notBefore = notBefore;
+        const notAfter = tbsCertificate.validity.notAfter.utcTime
+            || tbsCertificate.validity.notAfter.generalTime;
+        if (!notAfter) {
+            throw new Error("Cannot get 'notAfter' value");
+        }
+        this.notAfter = notAfter;
+        this.validity = dateDiff(this.notBefore, this.notAfter);
     }
-    this.notBefore = notBefore;
-    const notAfter = tbsCertificate.validity.notAfter.utcTime
-      || tbsCertificate.validity.notAfter.generalTime;
-    if (!notAfter) {
-      throw new Error("Cannot get 'notAfter' value");
+    parseExtensions() {
+        const { tbsCertificate } = this.asn;
+        if (tbsCertificate.extensions) {
+            this.extensions = tbsCertificate.extensions
+                .map((e) => new Extension(AsnConvert.serialize(e)));
+        }
     }
-    this.notAfter = notAfter;
-    this.validity = dateDiff(this.notBefore, this.notAfter);
-  }
-  parseExtensions() {
-    const { tbsCertificate } = this.asn;
-    if (tbsCertificate.extensions) {
-      this.extensions = tbsCertificate.extensions
-        .map((e) => new Extension(AsnConvert.serialize(e)));
+    getPublicKeyInfo(publicKeyInfo) {
+        const { subjectPublicKey, algorithm } = publicKeyInfo;
+        let params;
+        if (algorithm.algorithm === id_ecPublicKey && algorithm.parameters) {
+            params = AsnConvert.parse(algorithm.parameters, ECParameters);
+        }
+        if (algorithm.algorithm === id_rsaEncryption) {
+            params = AsnConvert.parse(subjectPublicKey, RSAPublicKey);
+        }
+        if (algorithm.algorithm === id_composite_key) {
+            params = AsnConvert.parse(subjectPublicKey, CompositePublicKey);
+            params = params.map((param) => this.getPublicKeyInfo(param));
+        }
+        const spki = AsnConvert.serialize(publicKeyInfo);
+        return {
+            params,
+            value: spki,
+            algorithm: algorithm.algorithm,
+        };
     }
-  }
-  getPublicKeyInfo(publicKeyInfo) {
-    const { subjectPublicKey, algorithm } = publicKeyInfo;
-    let params;
-    if (algorithm.algorithm === id_ecPublicKey && algorithm.parameters) {
-      params = AsnConvert.parse(algorithm.parameters, ECParameters);
+    get publicKey() {
+        return this.getPublicKeyInfo(this.asn.tbsCertificate.subjectPublicKeyInfo);
     }
-    if (algorithm.algorithm === id_rsaEncryption) {
-      params = AsnConvert.parse(subjectPublicKey, RSAPublicKey);
+    get signature() {
+        const { signatureValue, signatureAlgorithm } = this.asn;
+        let params;
+        if (signatureAlgorithm.algorithm === id_alg_composite) {
+            const compositeSignatureValues = AsnConvert.parse(signatureValue, CompositeSignatureValue);
+            const compositeParams = AsnConvert.parse(signatureAlgorithm.parameters, CompositeParams);
+            params = compositeParams.map((param, index) => (Object.assign(Object.assign({}, param), { value: compositeSignatureValues[index] })));
+        }
+        return {
+            params,
+            value: signatureValue,
+            algorithm: signatureAlgorithm.algorithm,
+        };
     }
-    if (algorithm.algorithm === id_composite_key) {
-      params = AsnConvert.parse(subjectPublicKey, CompositePublicKey);
-      params = params.map((param) => this.getPublicKeyInfo(param));
+    async getThumbprint(algorithm = 'SHA-1') {
+        try {
+            const thumbprint = await getCertificateThumbprint(algorithm, this.raw);
+            if (thumbprint) {
+                this.thumbprints[algorithm] = Convert_1.ToHex(thumbprint);
+            }
+        }
+        catch (error) {
+            console.error('Error thumbprint get:', error);
+        }
     }
-    const spki = AsnConvert.serialize(publicKeyInfo);
-    return {
-      params,
-      value: spki,
-      algorithm: algorithm.algorithm,
-    };
-  }
-  get publicKey() {
-    return this.getPublicKeyInfo(this.asn.tbsCertificate.subjectPublicKeyInfo);
-  }
-  get signature() {
-    const { signatureValue, signatureAlgorithm } = this.asn;
-    let params;
-    if (signatureAlgorithm.algorithm === id_alg_composite) {
-      const compositeSignatureValues = AsnConvert.parse(signatureValue, CompositeSignatureValue);
-      const compositeParams = AsnConvert.parse(signatureAlgorithm.parameters, CompositeParams);
-      params = compositeParams.map((param, index) => (Object.assign(Object.assign({}, param), { value: compositeSignatureValues[index] })));
+    get commonName() {
+        if (!this.subject) {
+            return '';
+        }
+        for (let i = 0; i < this.subject.length; i += 1) {
+            const name = this.subject[i];
+            if (name.shortName === 'CN' || name.shortName === 'E' || name.shortName === 'O') {
+                return name.value;
+            }
+        }
+        return '';
     }
-    return {
-      params,
-      value: signatureValue,
-      algorithm: signatureAlgorithm.algorithm,
-    };
-  }
-  exportAsBase64() {
-    return Convert_1.ToBase64(this.raw);
-  }
-  exportAsHexFormatted() {
-    return hexFormat(Convert_1.ToHex(this.raw));
-  }
-  exportAsPemFormatted() {
-    return `-----BEGIN CERTIFICATE-----\n${base64Format(this.exportAsBase64())}\n-----END CERTIFICATE-----`;
-  }
-  async getThumbprint(algorithm = 'SHA-1') {
-    try {
-      const thumbprint = await getCertificateThumbprint(algorithm, this.raw);
-      if (thumbprint) {
-        this.thumbprints[algorithm] = Convert_1.ToHex(thumbprint);
-      }
+    get issuerCommonName() {
+        if (!this.issuer) {
+            return '';
+        }
+        for (let i = 0; i < this.issuer.length; i += 1) {
+            const name = this.issuer[i];
+            if (name.shortName === 'CN') {
+                return name.value;
+            }
+            if (name.shortName === 'E') {
+                return name.value;
+            }
+        }
+        return '';
     }
-    catch (error) {
-      console.error('Error thumbprint get:', error);
+    get isRoot() {
+        return JSON.stringify(this.issuer) === JSON.stringify(this.subject);
     }
-  }
-  get commonName() {
-    if (!this.subject) {
-      return '';
+    subjectToString() {
+        if (!this.subject) {
+            return '';
+        }
+        return this.subject
+            .map((name) => (`${name.shortName}=${name.value}`))
+            .join(', ');
     }
-    for (let i = 0; i < this.subject.length; i += 1) {
-      const name = this.subject[i];
-      if (name.shortName === 'CN' || name.shortName === 'E' || name.shortName === 'O') {
-        return name.value;
-      }
+    issuerToString() {
+        if (!this.issuer) {
+            return '';
+        }
+        return this.issuer
+            .map((name) => (`${name.shortName}=${name.value}`))
+            .join(', ');
     }
-    return '';
-  }
-  get issuerCommonName() {
-    if (!this.issuer) {
-      return '';
+    toString(format = 'pem') {
+        switch (format) {
+            case 'hex':
+                return hexFormat(Convert_1.ToHex(this.raw));
+            case 'pem':
+                return `-----BEGIN ${this.tag}-----\n${base64Format(this.toString('base64'))}\n-----END ${this.tag}-----`;
+            default:
+                return Convert_1.ToBase64(this.raw);
+        }
     }
-    for (let i = 0; i < this.issuer.length; i += 1) {
-      const name = this.issuer[i];
-      if (name.shortName === 'CN') {
-        return name.value;
-      }
-      if (name.shortName === 'E') {
-        return name.value;
-      }
+    downloadAsPEM(name) {
+        Download.cert.asPEM(this.toString('pem'), name || this.commonName);
     }
-    return '';
-  }
-  get isRoot() {
-    return JSON.stringify(this.issuer) === JSON.stringify(this.subject);
-  }
-  subjectToString() {
-    if (!this.subject) {
-      return '';
+    downloadAsDER(name) {
+        Download.cert.asDER(this.toString('hex'), name || this.commonName);
     }
-    return this.subject
-      .map((name) => (`${name.shortName}=${name.value}`))
-      .join(', ');
-  }
-  issuerToString() {
-    if (!this.issuer) {
-      return '';
-    }
-    return this.issuer
-      .map((name) => (`${name.shortName}=${name.value}`))
-      .join(', ');
-  }
-  downloadAsPEM(name) {
-    Download.cert.asPEM(this.exportAsPemFormatted(), name || this.commonName);
-  }
-  downloadAsDER(name) {
-    Download.cert.asDER(this.exportAsHexFormatted(), name || this.commonName);
-  }
 }
 
 const certificateViewerCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-moz-text-size-adjust:none;-ms-text-size-adjust:none;text-size-adjust:none;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:transparent;font-family:var(--pv-font-family, inherit)}.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)}.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:-ms-inline-flexbox;display:inline-flex;cursor:pointer;background:transparent;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select: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);-webkit-transition:background-color 200ms ease 0s;transition:background-color 200ms ease 0s;-ms-flex-align:center;align-items:center;-ms-flex-pack: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%;position:relative;min-width:280px;min-height:300px;word-wrap:break-word;word-break:break-word}th,td{border:none}table{width:100%;border-spacing:0;border-collapse:collapse}table td{padding:var(--pv-size-base-2) var(--pv-size-base-4);vertical-align:top}table td:first-child{width:220px}table td:last-child{width:calc(100% - 220px)}table td.monospace{max-width:0}table td.divider{padding:var(--pv-size-base-2) 0}table td.divider span{height:1px;display:block;background-color:var(--pv-color-gray-4)}table .title td{padding-top:var(--pv-size-base-6);padding-bottom:var(--pv-size-base-2)}table table{border-left:1px solid var(--pv-color-gray-5)}.status_wrapper{min-height:inherit;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}:host([data-mobile-screen-view=true]) table,:host([data-mobile-screen-view=true]) tr,:host([data-mobile-screen-view=true]) td{display:block}:host([data-mobile-screen-view=true]) table tr{padding:var(--pv-size-base-2) 0}:host([data-mobile-screen-view=true]) table tr.title{padding-top:var(--pv-size-base-6)}:host([data-mobile-screen-view=true]) table tr.title td{padding:0 var(--pv-size-base-4)}:host([data-mobile-screen-view=true]) table td{padding:0 var(--pv-size-base-4);width:100% !important;max-width:100% !important}:host([data-mobile-screen-view=true]) table td.divider{padding:0}";
+const PeculiarCertificateViewerStyle0 = certificateViewerCss;
 
 const CertificateViewer = /*@__PURE__*/ proxyCustomElement(class CertificateViewer extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.getAuthKeyIdParentLink = (value) => {
-      var _a;
-      return (_a = this.authKeyIdParentLink) === null || _a === void 0 ? void 0 : _a.replace('{{authKeyId}}', value);
-    };
-    this.getAuthKeyIdSiblingsLink = (value) => {
-      var _a;
-      return (_a = this.authKeyIdSiblingsLink) === null || _a === void 0 ? void 0 : _a.replace('{{authKeyId}}', value);
-    };
-    this.getSubjectKeyIdChildrenLink = (value) => {
-      var _a;
-      return (_a = this.subjectKeyIdChildrenLink) === null || _a === void 0 ? void 0 : _a.replace('{{subjectKeyId}}', value);
-    };
-    this.getSubjectKeyIdSiblingsLink = (value) => {
-      var _a;
-      return (_a = this.subjectKeyIdSiblingsLink) === null || _a === void 0 ? void 0 : _a.replace('{{subjectKeyId}}', value);
-    };
-    this.certificate = undefined;
-    this.download = undefined;
-    this.authKeyIdParentLink = undefined;
-    this.authKeyIdSiblingsLink = undefined;
-    this.subjectKeyIdChildrenLink = undefined;
-    this.subjectKeyIdSiblingsLink = undefined;
-    this.issuerDnLink = undefined;
-    this.mobileMediaQueryString = '(max-width: 900px)';
-    this.mobileScreenView = false;
-    this.isDecodeInProcess = true;
-  }
-  handleMediaQueryChange(event) {
-    this.mobileScreenView = event.matches;
-  }
-  componentWillLoad() {
-    this.decodeCertificate(this.certificate);
-    if (Build.isBrowser) {
-      this.mobileMediaQuery = window.matchMedia(this.mobileMediaQueryString);
-      this.mobileMediaQuery.addEventListener('change', this.handleMediaQueryChange.bind(this));
-      this.mobileScreenView = this.mobileMediaQuery.matches;
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.getAuthKeyIdParentLink = (value) => {
+            var _a;
+            return (_a = this.authKeyIdParentLink) === null || _a === void 0 ? void 0 : _a.replace('{{authKeyId}}', value);
+        };
+        this.getAuthKeyIdSiblingsLink = (value) => {
+            var _a;
+            return (_a = this.authKeyIdSiblingsLink) === null || _a === void 0 ? void 0 : _a.replace('{{authKeyId}}', value);
+        };
+        this.getSubjectKeyIdChildrenLink = (value) => {
+            var _a;
+            return (_a = this.subjectKeyIdChildrenLink) === null || _a === void 0 ? void 0 : _a.replace('{{subjectKeyId}}', value);
+        };
+        this.getSubjectKeyIdSiblingsLink = (value) => {
+            var _a;
+            return (_a = this.subjectKeyIdSiblingsLink) === null || _a === void 0 ? void 0 : _a.replace('{{subjectKeyId}}', value);
+        };
+        this.certificate = undefined;
+        this.download = undefined;
+        this.authKeyIdParentLink = undefined;
+        this.authKeyIdSiblingsLink = undefined;
+        this.subjectKeyIdChildrenLink = undefined;
+        this.subjectKeyIdSiblingsLink = undefined;
+        this.issuerDnLink = undefined;
+        this.mobileMediaQueryString = '(max-width: 900px)';
+        this.mobileScreenView = false;
+        this.isDecodeInProcess = true;
     }
-  }
-  disconnectedCallback() {
-    this.mobileMediaQuery.removeEventListener('change', this.handleMediaQueryChange.bind(this));
-  }
-  async decodeCertificate(certificate) {
-    this.isDecodeInProcess = true;
-    try {
-      if (certificate instanceof X509Certificate) {
-        this.certificateDecoded = certificate;
-      }
-      else if (typeof certificate === 'string') {
-        this.certificateDecoded = new X509Certificate(certificate);
-      }
-      else {
-        return;
-      }
-      this.certificateDecoded.parseExtensions();
-      await this.certificateDecoded.getThumbprint('SHA-1');
-      await this.certificateDecoded.getThumbprint('SHA-256');
+    handleMediaQueryChange(event) {
+        this.mobileScreenView = event.matches;
+    }
+    componentWillLoad() {
+        this.decodeCertificate(this.certificate);
+        if (Build.isBrowser) {
+            this.mobileMediaQuery = window.matchMedia(this.mobileMediaQueryString);
+            this.mobileMediaQuery.addEventListener('change', this.handleMediaQueryChange.bind(this));
+            this.mobileScreenView = this.mobileMediaQuery.matches;
+        }
+    }
+    disconnectedCallback() {
+        this.mobileMediaQuery.removeEventListener('change', this.handleMediaQueryChange.bind(this));
     }
-    catch (error) {
-      this.certificateDecodeError = error;
-      console.error('Error certificate parse:', error);
+    async decodeCertificate(certificate) {
+        this.isDecodeInProcess = true;
+        try {
+            if (certificate instanceof X509Certificate) {
+                this.certificateDecoded = certificate;
+            }
+            else if (typeof certificate === 'string') {
+                this.certificateDecoded = new X509Certificate(certificate);
+            }
+            else {
+                return;
+            }
+            this.certificateDecoded.parseExtensions();
+            await this.certificateDecoded.getThumbprint('SHA-1');
+            await this.certificateDecoded.getThumbprint('SHA-256');
+        }
+        catch (error) {
+            this.certificateDecodeError = error;
+            console.error('Error certificate parse:', error);
+        }
+        this.isDecodeInProcess = false;
     }
-    this.isDecodeInProcess = false;
-  }
-  /**
-   * Rerun decodeCertificate if previuos value not equal current value
-   */
-  watchCertificateAndDecode(newValue, oldValue) {
-    if (typeof newValue === 'string' && typeof oldValue === 'string') {
-      if (newValue !== oldValue) {
-        this.decodeCertificate(newValue);
-      }
-      return;
+    /**
+     * Rerun decodeCertificate if previuos value not equal current value
+     */
+    watchCertificateAndDecode(newValue, oldValue) {
+        if (typeof newValue === 'string' && typeof oldValue === 'string') {
+            if (newValue !== oldValue) {
+                this.decodeCertificate(newValue);
+            }
+            return;
+        }
+        if (newValue instanceof X509Certificate && oldValue instanceof X509Certificate) {
+            if (newValue.serialNumber !== oldValue.serialNumber) {
+                this.decodeCertificate(newValue);
+            }
+        }
     }
-    if (newValue instanceof X509Certificate && oldValue instanceof X509Certificate) {
-      if (newValue.serialNumber !== oldValue.serialNumber) {
-        this.decodeCertificate(newValue);
-      }
+    getIssuerDnLink() {
+        return this.issuerDnLink;
     }
-  }
-  getIssuerDnLink() {
-    return this.issuerDnLink;
-  }
-  // eslint-disable-next-line class-methods-use-this
-  renderErrorState() {
-    return (h("div", { class: "status_wrapper" }, h(Typography, null, "There was an error decoding this certificate.")));
-  }
-  // eslint-disable-next-line class-methods-use-this
-  renderEmptyState() {
-    return (h("div", { class: "status_wrapper" }, h(Typography, null, "There is no certificate available.")));
-  }
-  render() {
-    if (this.certificateDecodeError) {
-      return this.renderErrorState();
+    // eslint-disable-next-line class-methods-use-this
+    renderErrorState() {
+        return (h("div", { class: "status_wrapper" }, h(Typography, null, "There was an error decoding this certificate.")));
     }
-    if (!this.certificateDecoded) {
-      return this.renderEmptyState();
+    // eslint-disable-next-line class-methods-use-this
+    renderEmptyState() {
+        return (h("div", { class: "status_wrapper" }, h(Typography, null, "There is no certificate available.")));
     }
-    return (h(Host, { "data-mobile-screen-view": String(this.mobileScreenView) }, h("table", null, h(BasicInformation, Object.assign({}, this.certificateDecoded)), h(SubjectName, { name: this.certificateDecoded.subject }), h(IssuerName, { name: this.certificateDecoded.issuer, issuerDnLink: this.getIssuerDnLink() }), h(PublicKey, { publicKey: this.certificateDecoded.publicKey }), h(Signature, { signature: this.certificateDecoded.signature }), h(Thumbprints, { thumbprints: this.certificateDecoded.thumbprints }), h(Extensions, { extensions: this.certificateDecoded.extensions, getLEILink: getLEILink, getDNSNameLink: getDNSNameLink, getIPAddressLink: getIPAddressLink, getAuthKeyIdParentLink: this.getAuthKeyIdParentLink, getAuthKeyIdSiblingsLink: this.getAuthKeyIdSiblingsLink, getSubjectKeyIdChildrenLink: this.getSubjectKeyIdChildrenLink, getSubjectKeyIdSiblingsLink: this.getSubjectKeyIdSiblingsLink }), this.download && (h(Miscellaneous, { certificate: this.certificateDecoded })))));
-  }
-  static get watchers() { return {
-    "certificate": ["watchCertificateAndDecode"]
-  }; }
-  static get style() { return certificateViewerCss; }
+    render() {
+        if (this.certificateDecodeError) {
+            return this.renderErrorState();
+        }
+        if (!this.certificateDecoded) {
+            return this.renderEmptyState();
+        }
+        return (h(Host, { "data-mobile-screen-view": String(this.mobileScreenView) }, h("table", null, h(BasicInformation, Object.assign({}, this.certificateDecoded)), h(SubjectName, { name: this.certificateDecoded.subject }), h(IssuerName, { name: this.certificateDecoded.issuer, issuerDnLink: this.getIssuerDnLink() }), h(PublicKey, { publicKey: this.certificateDecoded.publicKey }), h(Signature, { signature: this.certificateDecoded.signature }), h(Thumbprints, { thumbprints: this.certificateDecoded.thumbprints }), h(Extensions, { extensions: this.certificateDecoded.extensions, getLEILink: getLEILink, getDNSNameLink: getDNSNameLink, getIPAddressLink: getIPAddressLink, getAuthKeyIdParentLink: this.getAuthKeyIdParentLink, getAuthKeyIdSiblingsLink: this.getAuthKeyIdSiblingsLink, getSubjectKeyIdChildrenLink: this.getSubjectKeyIdChildrenLink, getSubjectKeyIdSiblingsLink: this.getSubjectKeyIdSiblingsLink }), this.download && (h(Miscellaneous, { certificate: this.certificateDecoded })))));
+    }
+    static get watchers() { return {
+        "certificate": ["watchCertificateAndDecode"]
+    }; }
+    static get style() { return PeculiarCertificateViewerStyle0; }
 }, [1, "peculiar-certificate-viewer", {
-    "certificate": [513],
-    "download": [516],
-    "authKeyIdParentLink": [513, "auth-key-id-parent-link"],
-    "authKeyIdSiblingsLink": [513, "auth-key-id-siblings-link"],
-    "subjectKeyIdChildrenLink": [513, "subject-key-id-children-link"],
-    "subjectKeyIdSiblingsLink": [513, "subject-key-id-siblings-link"],
-    "issuerDnLink": [513, "issuer-dn-link"],
-    "mobileMediaQueryString": [1, "mobile-media-query-string"],
-    "mobileScreenView": [32],
-    "isDecodeInProcess": [32]
-  }, undefined, {
-    "certificate": ["watchCertificateAndDecode"]
-  }]);
+        "certificate": [513],
+        "download": [516],
+        "authKeyIdParentLink": [513, "auth-key-id-parent-link"],
+        "authKeyIdSiblingsLink": [513, "auth-key-id-siblings-link"],
+        "subjectKeyIdChildrenLink": [513, "subject-key-id-children-link"],
+        "subjectKeyIdSiblingsLink": [513, "subject-key-id-siblings-link"],
+        "issuerDnLink": [513, "issuer-dn-link"],
+        "mobileMediaQueryString": [1, "mobile-media-query-string"],
+        "mobileScreenView": [32],
+        "isDecodeInProcess": [32]
+    }, undefined, {
+        "certificate": ["watchCertificateAndDecode"]
+    }]);
 function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["peculiar-certificate-viewer"];
-  components.forEach(tagName => { switch (tagName) {
-    case "peculiar-certificate-viewer":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, CertificateViewer);
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["peculiar-certificate-viewer"];
+    components.forEach(tagName => { switch (tagName) {
+        case "peculiar-certificate-viewer":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, CertificateViewer);
+            }
+            break;
+    } });
 }
 
 export { CertificateViewer as C, X509Certificate as X, defineCustomElement as d };