/**
 * Vaultfire Trust Widget — Embeddable Web Component
 *
 * Usage:
 *   <script src="https://theloopbreaker.com/trust-widget.js"></script>
 *   <vaultfire-trust address="0x..." chain="base"></vaultfire-trust>
 *
 * @module trust-widget
 */
(function () {
  'use strict';

  var API_BASE = 'https://theloopbreaker.com';

  function getTrustColor(score) {
    if (score >= 70) return '#22C55E';
    if (score >= 40) return '#FBBF24';
    return '#EF4444';
  }

  function getTrustLabel(score) {
    if (score >= 90) return 'Excellent';
    if (score >= 70) return 'Good';
    if (score >= 40) return 'Fair';
    if (score > 0) return 'Low';
    return 'Unverified';
  }

  var VaultfireTrust = /** @class */ (function () {
    function VaultfireTrustElement() {
      var el = Reflect.construct(HTMLElement, [], VaultfireTrustElement);
      el._shadow = el.attachShadow({ mode: 'open' });
      el._data = null;
      el._expanded = false;
      return el;
    }

    VaultfireTrustElement.prototype = Object.create(HTMLElement.prototype);
    VaultfireTrustElement.prototype.constructor = VaultfireTrustElement;

    Object.defineProperty(VaultfireTrustElement, 'observedAttributes', {
      get: function () { return ['address', 'chain']; }
    });

    VaultfireTrustElement.prototype.connectedCallback = function () {
      this._render();
      this._fetchData();
    };

    VaultfireTrustElement.prototype.attributeChangedCallback = function () {
      this._fetchData();
    };

    VaultfireTrustElement.prototype._fetchData = function () {
      var self = this;
      var address = this.getAttribute('address') || '';
      var chain = this.getAttribute('chain') || 'base';
      if (!address) {
        self._data = { trustScore: 0, bondStatus: 'unknown', reputationTier: 'Unverified', erc8004Registered: false, chain: chain, address: '' };
        self._render();
        return;
      }
      fetch(API_BASE + '/api/trust-widget?address=' + encodeURIComponent(address) + '&chain=' + encodeURIComponent(chain))
        .then(function (r) { return r.json(); })
        .then(function (d) { self._data = d; self._render(); })
        .catch(function () {
          self._data = { trustScore: 0, bondStatus: 'unknown', reputationTier: 'Unverified', erc8004Registered: false, chain: chain, address: address };
          self._render();
        });
    };

    VaultfireTrustElement.prototype._render = function () {
      var d = this._data;
      var expanded = this._expanded;
      var self = this;

      if (!d) {
        this._shadow.innerHTML = '<div style="display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:12px;background:#111113;border:1px solid rgba(255,255,255,0.06);font-family:system-ui,sans-serif"><div style="width:20px;height:20px;border-radius:50%;border:2px solid rgba(249,115,22,0.3);border-top-color:#F97316;animation:vf-spin 1s linear infinite"></div><span style="font-size:11px;color:#71717A">Loading...</span></div><style>@keyframes vf-spin{to{transform:rotate(360deg)}}</style>';
        return;
      }

      var color = getTrustColor(d.trustScore);
      var label = getTrustLabel(d.trustScore);
      var addr = d.address ? d.address.slice(0, 6) + '...' + d.address.slice(-4) : 'N/A';
      var bondLabel = d.bondStatus === 'bonded' ? 'Active Bond' : d.bondStatus === 'unbonded' ? 'No Bond' : 'Unknown';
      var bondBadge = d.bondStatus === 'bonded' ? '<span style="padding:1px 6px;border-radius:4px;background:rgba(34,197,94,0.1);border:1px solid rgba(34,197,94,0.2);font-size:8px;font-weight:700;color:#22C55E">BONDED</span>' : '';

      var expandedHTML = '';
      if (expanded) {
        expandedHTML = '<div style="padding:0 16px 12px;border-top:1px solid rgba(255,255,255,0.04);padding-top:10px">' +
          '<div style="display:flex;flex-direction:column;gap:6px">' +
          '<div style="display:flex;justify-content:space-between"><span style="font-size:10px;color:#71717A">Bond</span><span style="font-size:10px;font-weight:600;color:' + (d.bondStatus === 'bonded' ? '#22C55E' : '#71717A') + '">' + bondLabel + '</span></div>' +
          '<div style="display:flex;justify-content:space-between"><span style="font-size:10px;color:#71717A">Reputation</span><span style="font-size:10px;font-weight:600;color:#F97316">' + d.reputationTier + '</span></div>' +
          '<div style="display:flex;justify-content:space-between"><span style="font-size:10px;color:#71717A">ERC-8004</span><span style="font-size:10px;font-weight:600;color:' + (d.erc8004Registered ? '#22C55E' : '#71717A') + '">' + (d.erc8004Registered ? 'Registered' : 'Not Registered') + '</span></div>' +
          '<div style="display:flex;justify-content:space-between"><span style="font-size:10px;color:#71717A">Chain</span><span style="font-size:10px;font-weight:600;color:#38BDF8">' + d.chain + '</span></div>' +
          '</div>' +
          '<div style="margin-top:8px;text-align:center;font-size:8px;color:#3F3F46">Powered by Vaultfire Protocol</div>' +
          '</div>';
      }

      this._shadow.innerHTML = '<div id="vf-root" style="display:inline-block;border-radius:12px;background:#111113;border:1px solid rgba(255,255,255,0.06);cursor:pointer;overflow:hidden;min-width:200px;font-family:system-ui,sans-serif">' +
        '<div style="display:flex;align-items:center;gap:10px;padding:10px 16px">' +
        '<div style="width:36px;height:36px;border-radius:50%;background:conic-gradient(' + color + ' ' + (d.trustScore * 3.6) + 'deg,rgba(255,255,255,0.04) 0deg);display:flex;align-items:center;justify-content:center">' +
        '<div style="width:28px;height:28px;border-radius:50%;background:#111113;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:' + color + '">' + d.trustScore + '</div>' +
        '</div>' +
        '<div style="flex:1"><div style="display:flex;align-items:center;gap:6px"><span style="font-size:12px;font-weight:700;color:' + color + '">' + label + '</span>' + bondBadge + '</div>' +
        '<div style="font-size:9px;color:#52525B;font-family:monospace">' + addr + '</div></div>' +
        '<svg width="16" height="16" viewBox="0 0 32 32" fill="none" style="opacity:0.4"><path d="M16 4c-3 3.5-6 8-6 12 0 3.31 2.69 6 6 6s6-2.69 6-6c0-4-3-8.5-6-12z" fill="#F97316"/></svg>' +
        '</div>' + expandedHTML + '</div>';

      var root = this._shadow.getElementById('vf-root');
      if (root) {
        root.addEventListener('click', function () {
          self._expanded = !self._expanded;
          self._render();
        });
      }
    };

    return VaultfireTrustElement;
  })();

  if (!customElements.get('vaultfire-trust')) {
    customElements.define('vaultfire-trust', VaultfireTrust);
  }
})();
