@pb33f/cowboy-components 0.8.0 → 0.10.0

package/README.md

@@ -7,3 +7,5 @@ If you're not [pb33f](https://pb33f.io), you probably don't want to use this.
 Thanks for stopping by though! Thanks for your interest.
 
 Bye for now.
+
+- quobix.

package/dist/{_basePickBy-DtTwxTrV.js → _basePickBy-D0MVaff7.js}

@@ -1,5 +1,5 @@
-import { e as x, c as O, g as m, k as P, h as p, j as w, l as A, m as c, n as I, t as N, o as E } from "./_baseUniq-C5Y4WFmx.js";
-import { aR as g, aA as F, aS as M, aT as T, aU as _, aV as l, aW as $, aX as B, aY as S, aZ as y } from "./cowboy-components-BcyXo9oX.js";
+import { e as x, c as O, g as m, k as P, h as p, j as w, l as A, m as c, n as I, t as N, o as E } from "./_baseUniq-DVhBEtEZ.js";
+import { aR as g, aA as F, aS as M, aT as T, aU as _, aV as l, aW as $, aX as B, aY as S, aZ as y } from "./cowboy-components-BRANjWMG.js";
 var R = /\s/;
 function G(n) {
   for (var r = n.length; r-- && R.test(n.charAt(r)); )

package/dist/{_baseUniq-C5Y4WFmx.js → _baseUniq-DVhBEtEZ.js}

@@ -1,4 +1,4 @@
-import { be as S, bf as Rn, aW as T, bg as w, bh as xn, bi as mn, aV as sn, bj as Mn, bk as un, bl as x, aT as U, bm as Cn, bn as on, bo as Fn, bp as E, bc as gn, bq as R, aR as ln, br as Dn, bs as D, bt as Gn, bu as Un, bv as _, aZ as Bn, bw as Nn, aU as Kn, bx as X, by as jn, bz as Hn, aY as qn, aX as cn, ba as Yn, bA as M } from "./cowboy-components-BcyXo9oX.js";
+import { be as S, bf as Rn, aW as T, bg as w, bh as xn, bi as mn, aV as sn, bj as Mn, bk as un, bl as x, aT as U, bm as Cn, bn as on, bo as Fn, bp as E, bc as gn, bq as R, aR as ln, br as Dn, bs as D, bt as Gn, bu as Un, bv as _, aZ as Bn, bw as Nn, aU as Kn, bx as X, by as jn, bz as Hn, aY as qn, aX as cn, ba as Yn, bA as M } from "./cowboy-components-BRANjWMG.js";
 var Zn = "[object Symbol]";
 function B(n) {
   return typeof n == "symbol" || S(n) && Rn(n) == Zn;

package/dist/{arc-a-7w7y90.js → arc-DfidlRZC.js}

@@ -1,4 +1,4 @@
-import { a0 as ln, a1 as an, a2 as y, a3 as tn, a4 as H, a5 as q, a6 as _, a7 as un, a8 as B, a9 as rn, aa as L, ab as o, ac as sn, ad as on, ae as fn } from "./cowboy-components-BcyXo9oX.js";
+import { a0 as ln, a1 as an, a2 as y, a3 as tn, a4 as H, a5 as q, a6 as _, a7 as un, a8 as B, a9 as rn, aa as L, ab as o, ac as sn, ad as on, ae as fn } from "./cowboy-components-BRANjWMG.js";
 function cn(l) {
   return l.innerRadius;
 }

package/dist/{architecture-U656AL7Q-c_zxypEp.js → architecture-U656AL7Q-2l0oI7kq.js}

@@ -1,4 +1,4 @@
-import { A as c, e as t } from "./mermaid-parser.core-BPror82d.js";
+import { A as c, e as t } from "./mermaid-parser.core-quOEU4Mi.js";
 export {
   c as ArchitectureModule,
   t as createArchitectureServices

package/dist/{architectureDiagram-VXUJARFQ-CIhQJ6xS.js → architectureDiagram-VXUJARFQ-CluOaK7l.js}

@@ -1,6 +1,6 @@
-import { aI as ke, _ as dt, H as Ze, V as qe, l as Se, b as Qe, a as Je, p as Ke, q as je, g as _e, s as tr, y as er, D as rr, E as ir, F as ar, c as Ee, ak as me, aJ as pe, i as nr, d as or, x as sr, aK as hr, aL as lr } from "./cowboy-components-BcyXo9oX.js";
-import { p as fr } from "./chunk-4BX2VUAB-BeHGB7ON.js";
-import { p as cr } from "./mermaid-parser.core-BPror82d.js";
+import { aI as ke, _ as dt, H as Ze, V as qe, l as Se, b as Qe, a as Je, p as Ke, q as je, g as _e, s as tr, y as er, D as rr, E as ir, F as ar, c as Ee, ak as me, aJ as pe, i as nr, d as or, x as sr, aK as hr, aL as lr } from "./cowboy-components-BRANjWMG.js";
+import { p as fr } from "./chunk-4BX2VUAB-Dk4r_XjO.js";
+import { p as cr } from "./mermaid-parser.core-quOEU4Mi.js";
 import { c as Fe } from "./cytoscape.esm-DfdJODL8.js";
 var he = { exports: {} }, le = { exports: {} }, fe = { exports: {} }, gr = fe.exports, we;
 function ur() {

package/dist/{blockDiagram-VD42YOAC-BLl5ID-l.js → blockDiagram-VD42YOAC-RbyzthW7.js}

@@ -1,8 +1,8 @@
-import { g as oe } from "./chunk-FMBD7UC4-D-H9-bHN.js";
-import { _ as d, E as rt, d as O, e as he, l as L, y as de, A as ge, c as R, ai as ue, R as pe, S as fe, O as xe, aj as j, ak as Wt, al as ye, u as $, k as be, am as we, an as xt, i as yt, ao as me } from "./cowboy-components-BcyXo9oX.js";
-import { c as Le } from "./clone-CybyMoa0.js";
-import { G as Se } from "./graph-D9HS4Ahd.js";
-import { c as ke } from "./channel-DYeI56io.js";
+import { g as oe } from "./chunk-FMBD7UC4-_BECV2vM.js";
+import { _ as d, E as rt, d as O, e as he, l as L, y as de, A as ge, c as R, ai as ue, R as pe, S as fe, O as xe, aj as j, ak as Wt, al as ye, u as $, k as be, am as we, an as xt, i as yt, ao as me } from "./cowboy-components-BRANjWMG.js";
+import { c as Le } from "./clone-CXHEQoEn.js";
+import { G as Se } from "./graph-BSko0AhB.js";
+import { c as ke } from "./channel-Dsjz0D5Z.js";
 var bt = (function() {
   var e = /* @__PURE__ */ d(function(D, y, g, f) {
     for (g = g || {}, f = D.length; f--; g[D[f]] = y) ;

package/dist/{c4Diagram-YG6GDRKO-BOGfb13x.js → c4Diagram-YG6GDRKO-Bx8eR5aW.js}

@@ -1,5 +1,5 @@
-import { g as Se, d as De } from "./chunk-TZMSLE5B-BmXGcXo9.js";
-import { _ as g, s as Pe, g as Be, a as Ie, b as Me, c as Bt, d as jt, l as de, e as Le, f as Ne, h as Tt, i as ge, j as Ye, w as je, k as $t, m as fe } from "./cowboy-components-BcyXo9oX.js";
+import { g as Se, d as De } from "./chunk-TZMSLE5B-DRZQTDqv.js";
+import { _ as g, s as Pe, g as Be, a as Ie, b as Me, c as Bt, d as jt, l as de, e as Le, f as Ne, h as Tt, i as ge, j as Ye, w as je, k as $t, m as fe } from "./cowboy-components-BRANjWMG.js";
 var Ft = (function() {
   var e = /* @__PURE__ */ g(function(_t, x, m, v) {
     for (m = m || {}, v = _t.length; v--; m[_t[v]] = x) ;

package/dist/{channel-DYeI56io.js → channel-Dsjz0D5Z.js}

@@ -1,4 +1,4 @@
-import { ap as o, aq as n } from "./cowboy-components-BcyXo9oX.js";
+import { ap as o, aq as n } from "./cowboy-components-BRANjWMG.js";
 const t = (a, r) => o.lang.round(n.parse(a)[r]);
 export {
   t as c

package/dist/{chunk-4BX2VUAB-BeHGB7ON.js → chunk-4BX2VUAB-Dk4r_XjO.js}

@@ -1,4 +1,4 @@
-import { _ as i } from "./cowboy-components-BcyXo9oX.js";
+import { _ as i } from "./cowboy-components-BRANjWMG.js";
 function t(c, e) {
   c.accDescr && e.setAccDescription?.(c.accDescr), c.accTitle && e.setAccTitle?.(c.accTitle), c.title && e.setDiagramTitle?.(c.title);
 }

package/dist/{chunk-55IACEB6-DgHUzWsw.js → chunk-55IACEB6-O_k-h5nN.js}

@@ -1,4 +1,4 @@
-import { _ as a, d as o } from "./cowboy-components-BcyXo9oX.js";
+import { _ as a, d as o } from "./cowboy-components-BRANjWMG.js";
 var d = /* @__PURE__ */ a((t, e) => {
   let n;
   return e === "sandbox" && (n = o("#i" + t)), (e === "sandbox" ? o(n.nodes()[0].contentDocument.body) : o("body")).select(`[id="${t}"]`);

package/dist/{chunk-B4BG7PRW-Vs7GiQMf.js → chunk-B4BG7PRW-DVDQ5atJ.js}

@@ -1,7 +1,7 @@
-import { g as et } from "./chunk-FMBD7UC4-D-H9-bHN.js";
-import { g as tt } from "./chunk-55IACEB6-DgHUzWsw.js";
-import { s as st } from "./chunk-QN33PNHL-D7uE2r1Y.js";
-import { _ as A, l as Oe, c as D, o as it, r as at, u as we, d as ee, b as nt, a as rt, s as ut, g as lt, p as ot, q as ct, k as v, y as ht, x as dt, i as pt, Q as R } from "./cowboy-components-BcyXo9oX.js";
+import { g as et } from "./chunk-FMBD7UC4-_BECV2vM.js";
+import { g as tt } from "./chunk-55IACEB6-O_k-h5nN.js";
+import { s as st } from "./chunk-QN33PNHL-BZt9yPgN.js";
+import { _ as A, l as Oe, c as D, o as it, r as at, u as we, d as ee, b as nt, a as rt, s as ut, g as lt, p as ot, q as ct, k as v, y as ht, x as dt, i as pt, Q as R } from "./cowboy-components-BRANjWMG.js";
 var Ve = (function() {
   var s = /* @__PURE__ */ A(function(I, o, c, d) {
     for (c = c || {}, d = I.length; d--; c[I[d]] = o) ;

package/dist/{chunk-DI55MBZ5-CHjdGXx0.js → chunk-DI55MBZ5-CeD8zHDH.js}

@@ -1,6 +1,6 @@
-import { g as te } from "./chunk-55IACEB6-DgHUzWsw.js";
-import { s as ee } from "./chunk-QN33PNHL-D7uE2r1Y.js";
-import { _ as u, l as b, c as w, r as se, u as ie, a as re, b as ae, g as ne, s as oe, p as le, q as ce, T as he, k as U, y as ue } from "./cowboy-components-BcyXo9oX.js";
+import { g as te } from "./chunk-55IACEB6-O_k-h5nN.js";
+import { s as ee } from "./chunk-QN33PNHL-BZt9yPgN.js";
+import { _ as u, l as b, c as w, r as se, u as ie, a as re, b as ae, g as ne, s as oe, p as le, q as ce, T as he, k as U, y as ue } from "./cowboy-components-BRANjWMG.js";
 var vt = (function() {
   var t = /* @__PURE__ */ u(function(Y, o, c, n) {
     for (c = c || {}, n = Y.length; n--; c[Y[n]] = o) ;

package/dist/{chunk-FMBD7UC4-D-H9-bHN.js → chunk-FMBD7UC4-_BECV2vM.js}

@@ -1,4 +1,4 @@
-import { _ as e } from "./cowboy-components-BcyXo9oX.js";
+import { _ as e } from "./cowboy-components-BRANjWMG.js";
 var l = /* @__PURE__ */ e(() => `
   /* Font Awesome icon styling - consolidated */
   .label-icon {

package/dist/{chunk-QN33PNHL-D7uE2r1Y.js → chunk-QN33PNHL-BZt9yPgN.js}

@@ -1,4 +1,4 @@
-import { _ as a, e as w, l as x } from "./cowboy-components-BcyXo9oX.js";
+import { _ as a, e as w, l as x } from "./cowboy-components-BRANjWMG.js";
 var d = /* @__PURE__ */ a((e, t, i, r) => {
   e.attr("class", i);
   const { width: o, height: h, x: n, y: c } = u(e, t);

package/dist/{chunk-QZHKN3VN-Cp3sUp7e.js → chunk-QZHKN3VN-VPFLLErx.js}

@@ -1,4 +1,4 @@
-import { _ as s } from "./cowboy-components-BcyXo9oX.js";
+import { _ as s } from "./cowboy-components-BRANjWMG.js";
 var t, e = (t = class {
   /**
    * @param init - Function that creates the default state.

package/dist/{chunk-TZMSLE5B-BmXGcXo9.js → chunk-TZMSLE5B-DRZQTDqv.js}

@@ -1,4 +1,4 @@
-import { _ as n, U as o, j as l } from "./cowboy-components-BcyXo9oX.js";
+import { _ as n, U as o, j as l } from "./cowboy-components-BRANjWMG.js";
 var x = /* @__PURE__ */ n((s, t) => {
   const e = s.append("rect");
   if (e.attr("x", t.x), e.attr("y", t.y), e.attr("fill", t.fill), e.attr("stroke", t.stroke), e.attr("width", t.width), e.attr("height", t.height), t.name && e.attr("name", t.name), t.rx && e.attr("rx", t.rx), t.ry && e.attr("ry", t.ry), t.attrs !== void 0)

package/dist/{classDiagram-v2-WZHVMYZB-9ilqiDEi.js → classDiagram-2ON5EDUG-Pjlv98sa.js}

@@ -1,5 +1,5 @@
-import { s as r, c as s, a as e, C as t } from "./chunk-B4BG7PRW-Vs7GiQMf.js";
-import { _ as l } from "./cowboy-components-BcyXo9oX.js";
+import { s as r, c as s, a as e, C as t } from "./chunk-B4BG7PRW-DVDQ5atJ.js";
+import { _ as l } from "./cowboy-components-BRANjWMG.js";
 var d = {
   parser: e,
   get db() {

package/dist/{classDiagram-2ON5EDUG-9ilqiDEi.js → classDiagram-v2-WZHVMYZB-Pjlv98sa.js}

@@ -1,5 +1,5 @@
-import { s as r, c as s, a as e, C as t } from "./chunk-B4BG7PRW-Vs7GiQMf.js";
-import { _ as l } from "./cowboy-components-BcyXo9oX.js";
+import { s as r, c as s, a as e, C as t } from "./chunk-B4BG7PRW-DVDQ5atJ.js";
+import { _ as l } from "./cowboy-components-BRANjWMG.js";
 var d = {
   parser: e,
   get db() {

package/dist/{clone-CybyMoa0.js → clone-CXHEQoEn.js}

@@ -1,4 +1,4 @@
-import { b as r } from "./_baseUniq-C5Y4WFmx.js";
+import { b as r } from "./_baseUniq-DVhBEtEZ.js";
 var e = 4;
 function a(o) {
   return r(o, e);

package/dist/components/charts/beefy-chart.d.ts

@@ -17,5 +17,6 @@ export declare class BeefyChart extends Colorful {
     updateChart(): void;
     buildChart(): void;
     firstUpdated(): void;
+    updated(changedProperties: Map<string, unknown>): void;
     render(): import("lit-html").TemplateResult<1>;
 }

package/dist/components/charts/beefy-chart.js

@@ -97,7 +97,7 @@ let BeefyChart = class BeefyChart extends Colorful {
                         position: 'bottom',
                         maxHeight: 40,
                         labels: {
-                            color: 'rgb(255, 255, 255)',
+                            color: this.secondary,
                             font: this.mediumFont,
                             pointStyle: 'line',
                             boxHeight: 1,
@@ -111,6 +111,11 @@ let BeefyChart = class BeefyChart extends Colorful {
         super.firstUpdated();
         this.buildChart();
     }
+    updated(changedProperties) {
+        if (changedProperties.has('currentTheme') && this.chart) {
+            this.buildChart();
+        }
+    }
     render() {
         return html `
             <canvas id="chart" style="width: ${this.width}px; height: ${this.height}px; "></canvas>

package/dist/components/charts/chart-colors.d.ts

@@ -18,10 +18,18 @@ export declare class Colorful extends LitElement {
     mediumFont: FontSpec;
     fontBold: FontSpec;
     titleFont: FontSpec;
+    protected currentTheme: string;
+    private _themeHandler;
     constructor();
+    private readColors;
     firstUpdated(): void;
+    disconnectedCallback(): void;
 }
+export declare function isLightMode(): boolean;
 export declare const ChartColors: string[];
+export declare const LightChartColors: string[];
 export declare const ChartColorsChanges: string[];
+export declare const LightChartColorsChanges: string[];
 export declare const BinaryChartColors: string[];
+export declare const LightBinaryChartColors: string[];
 export declare function CreateRadialGradient(context: any, c1: any, c2: any, c3: any, c4: any): any;

package/dist/components/charts/chart-colors.js

@@ -1,10 +1,23 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 import { LitElement } from "lit";
+import { state } from "lit/decorators.js";
 import { fontBold, fontSpec, fontTitle, mediumFont, smallFont } from "./config";
+import { PB33F_THEME_CHANGE } from "../../events/theme.js";
 export class Colorful extends LitElement {
     constructor() {
         super();
+        this.currentTheme = 'dark';
+        this._themeHandler = () => {
+            this.readColors();
+            this.currentTheme = isLightMode() ? 'light' : 'dark';
+        };
     }
-    firstUpdated() {
+    readColors() {
         const styles = getComputedStyle(this);
         this.primary = styles.getPropertyValue('--primary-color').trim();
         this.secondary = styles.getPropertyValue('--secondary-color').trim();
@@ -18,13 +31,28 @@ export class Colorful extends LitElement {
         this.color3 = styles.getPropertyValue('--chart-color3').trim();
         this.color4 = styles.getPropertyValue('--chart-color4').trim();
         this.color5 = styles.getPropertyValue('--chart-color5').trim();
+    }
+    firstUpdated() {
+        this.readColors();
+        this.currentTheme = isLightMode() ? 'light' : 'dark';
         this.font = fontSpec;
         this.smallFont = smallFont;
         this.mediumFont = mediumFont;
         this.titleFont = fontTitle;
         this.fontBold = fontBold;
+        window.addEventListener(PB33F_THEME_CHANGE, this._themeHandler);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        window.removeEventListener(PB33F_THEME_CHANGE, this._themeHandler);
     }
 }
+__decorate([
+    state()
+], Colorful.prototype, "currentTheme", void 0);
+export function isLightMode() {
+    return document.documentElement.getAttribute('theme') === 'light';
+}
 export const ChartColors = [
     "#f83aff",
     "rgba(98, 196, 255, 1)",
@@ -33,15 +61,32 @@ export const ChartColors = [
     "rgba(248,58,255,0.2)",
     "rgba(98, 196, 255, 0.5)"
 ];
+export const LightChartColors = [
+    "rgba(0, 0, 0, 0.6)",
+    "rgba(0, 0, 0, 0.4)",
+    "rgba(0, 0, 0, 0.25)",
+    "rgba(0, 0, 0, 0.15)",
+    "rgba(0, 0, 0, 0.08)",
+    "rgba(0, 0, 0, 0.5)"
+];
 export const ChartColorsChanges = [
     "#f83aff",
     "#00FF00",
     "#787878",
 ];
+export const LightChartColorsChanges = [
+    "rgba(0, 0, 0, 0.6)",
+    "rgba(0, 0, 0, 0.35)",
+    "rgba(0, 0, 0, 0.15)",
+];
 export const BinaryChartColors = [
     "#ff246b",
     "rgba(98, 196, 255, 1)",
 ];
+export const LightBinaryChartColors = [
+    "rgba(0, 0, 0, 0.6)",
+    "rgba(0, 0, 0, 0.25)",
+];
 const cache = new Map();
 let width = null;
 let height = null;

package/dist/components/charts/doughnut-chart.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement, property } from "lit/decorators.js";
 import { html } from "lit";
 import Chart from 'chart.js/auto';
-import { BinaryChartColors, ChartColors, ChartColorsChanges, Colorful, } from "./chart-colors";
+import { BinaryChartColors, ChartColors, ChartColorsChanges, Colorful, isLightMode, LightBinaryChartColors, LightChartColors, LightChartColorsChanges } from "./chart-colors";
 let DoughnutChart = class DoughnutChart extends Colorful {
     constructor() {
         super();
@@ -39,6 +39,7 @@ let DoughnutChart = class DoughnutChart extends Colorful {
         const needsRebuild = !this.chart ||
             changedProperties.has('changesChart') ||
             changedProperties.has('breakingChanges') ||
+            changedProperties.has('currentTheme') ||
             this.dataChanged();
         if (!needsRebuild) {
             return;
@@ -46,11 +47,15 @@ let DoughnutChart = class DoughnutChart extends Colorful {
         if (this.chart) {
             this.chart.destroy();
         }
+        const light = isLightMode();
         if (this.changesChart) {
-            this.colors = ChartColorsChanges;
+            this.colors = light ? LightChartColorsChanges : ChartColorsChanges;
         }
-        if (this.breakingChanges) {
-            this.colors = BinaryChartColors;
+        else if (this.breakingChanges) {
+            this.colors = light ? LightBinaryChartColors : BinaryChartColors;
+        }
+        else {
+            this.colors = light ? LightChartColors : ChartColors;
         }
         this.datasets.forEach((data) => {
             data.backgroundColor = this.colors;
@@ -102,7 +107,7 @@ let DoughnutChart = class DoughnutChart extends Colorful {
                         position: 'right',
                         maxHeight: 40,
                         labels: {
-                            color: 'rgb(255, 255, 255)',
+                            color: this.secondary,
                             font: this.mediumFont,
                         }
                     },

package/dist/components/credit-ticker/credit-ticker.js

@@ -50,13 +50,9 @@ let CreditTicker = class CreditTicker extends LitElement {
         }
     }
     render() {
-        if (!this.visible) {
+        if (!this.visible || this.credits < 0) {
             return html ``;
         }
-        let credits = this.credits;
-        if (credits < 0) {
-            credits = '--';
-        }
         let arrowClass = 'ok';
         if (this.credits <= 10 && this.credits > 0) {
             arrowClass = 'warning';
@@ -68,7 +64,7 @@ let CreditTicker = class CreditTicker extends LitElement {
             <div class="credit-ticker ${arrowClass}">
                 <sl-icon name="cash-coin" aria-hidden="true"></sl-icon>
                 <span class="credits"> 
-                    <sl-format-number value="${credits}"></sl-format-number>
+                    <sl-format-number value="${this.credits}"></sl-format-number>
                 </span>
                 <div class="arrow">
                     <sl-animation

package/dist/components/editor/editor.js

@@ -16,6 +16,7 @@ import editorCss from "./editor.css.js";
 // schemas
 import openapi3 from './schemas/openapi3.json';
 import openapi31 from './schemas/openapi31.json';
+import openapi32 from './schemas/openapi32.json';
 // register the YAML worker (only once)
 configureMonacoYaml(monaco, {
     // mirror the old setDiagnosticsOptions flags:
@@ -24,18 +25,7 @@ configureMonacoYaml(monaco, {
     completion: true,
     validate: true,
     format: true,
-    schemas: [
-        // {
-        //     uri:       "inmemory://schema/openapi-3.0.json",
-        //     fileMatch: ["*.yaml","*.yml"],
-        //     schema:    openapi3
-        // },
-        {
-            uri: "inmemory://schema/openapi-3.1.json",
-            fileMatch: ["*.yaml", "*.yml"],
-            schema: openapi31
-        }
-    ]
+    schemas: []
 });
 const editorGreen = '#00FF00FF';
 const editorGreenDim = '#008a00';
@@ -49,9 +39,9 @@ const editorPink = '#E400FB';
 const editorGreenLight = '#000000';
 const editorGreenDimLight = '#444444';
 const editorGreenDimmerLight = 'rgba(0, 0, 0, 0.15)';
-const editorRedLight = '#d32f5a';
-const editorRedDimLight = 'rgba(211, 47, 90, 0.2)';
-const editorRedDimmerLight = 'rgba(211, 47, 90, 0.1)';
+const editorRedLight = '#000000';
+const editorRedDimLight = 'rgba(0, 0, 0, 0.25)';
+const editorRedDimmerLight = 'rgba(0, 0, 0, 0.12)';
 const editorBrownLight = 'rgba(0, 0, 0, 0.08)';
 const editorBlueLight = '#000000';
 const editorPinkLight = '#000000';
@@ -258,7 +248,7 @@ function generatePb33fLightTheme() {
                 "foreground": "000000",
                 "token": "keyword"
             },
-            { token: 'constant', foreground: 'd32f5a' },
+            { token: 'constant', foreground: '000000' },
             {
                 "foreground": "888888",
                 "token": "comment",
@@ -284,7 +274,7 @@ function generatePb33fLightTheme() {
             'editor.lineHighlightBackground': '#e8e8e8',
             'editorLineNumber.foreground': '#aaaaaa',
             'editorLineNumber.activeForeground': '#000000',
-            'editor.inactiveSelectionBackground': 'rgba(211, 47, 90, 0.15)',
+            'editor.inactiveSelectionBackground': 'rgba(0, 0, 0, 0.15)',
             'diffEditor.removedTextBackground': editorRedDimLight,
             'diffEditor.insertedTextBackground': editorGreenDimmerLight,
             'diffEditor.insertedLineBackground': editorBrownLight,
@@ -302,10 +292,10 @@ function generatePb33fLightTheme() {
             'editorBracketHighlight.foreground2': '#444444',
             'editorBracketHighlight.foreground3': '#666666',
             'editorBracketHighlight.foreground4': '#888888',
-            'editorError.foreground': '#d32f5a',
+            'editorError.foreground': '#000000',
             'editorWarning.foreground': '#888888',
             'editorInfo.foreground': '#cccccc',
-            'editorOverviewRuler.errorForeground': '#d32f5a',
+            'editorOverviewRuler.errorForeground': '#000000',
             'editorOverviewRuler.warningForeground': '#888888',
             'editorOverviewRuler.infoForeground': '#cccccc',
         }
@@ -363,8 +353,12 @@ function generateDeadLightTheme() {
             'editorLineNumber.foreground': '#cccccc',
             'editorLineNumber.activeForeground': '#aaaaaa',
             'editor.inactiveSelectionBackground': '#f0f0f0',
-            'diffEditor.removedTextBackground': 'rgba(211, 47, 90, 0.1)',
+            'diffEditor.removedTextBackground': 'rgba(0, 0, 0, 0.12)',
             'diffEditor.insertedTextBackground': 'rgba(0, 0, 0, 0.05)',
+            'diffEditor.insertedLineBackground': 'rgba(0, 0, 0, 0.04)',
+            'diffEditor.removedLineBackground': 'rgba(0, 0, 0, 0.08)',
+            'diffEditorGutter.insertedLineBackground': 'rgba(0, 0, 0, 0.04)',
+            'diffEditorGutter.removedLineBackground': 'rgba(0, 0, 0, 0.08)',
             'editorLink.activeForeground': '#bbbbbb',
             'editorHoverWidget.background': '#fafafa',
             'editorHoverWidget.border': '#dddddd',
@@ -656,13 +650,13 @@ let SpecEditor = class SpecEditor extends LitElement {
             if (!m) {
                 return; // no version yet
             }
-            const ver = m[1].startsWith('3.1') ? '3.1' : '3.0';
+            const ver = m[1].startsWith('3.2') ? '3.2' : m[1].startsWith('3.1') ? '3.1' : '3.0';
             if (ver === this.currentVersion) {
                 return; // no change
             }
             this.currentVersion = ver;
             // pick the right JSON schema
-            const schema = (ver === '3.1') ? openapi31 : openapi3;
+            const schema = ver === '3.2' ? openapi32 : ver === '3.1' ? openapi31 : openapi3;
             const uri = `inmemory://schema/openapi-${ver}.json`;
             // 4) update monaco-yaml with the new schema
             const settings = {
@@ -918,7 +912,7 @@ let SpecEditor = class SpecEditor extends LitElement {
         window
             .matchMedia("(prefers-color-scheme: dark)")
             .addEventListener("change", () => {
-            monaco.editor.setTheme(this.getTheme());
+            monaco.editor.setTheme(getActiveTheme(this.isActive, this.isLightTheme));
         });
         // Apply any pending value that was set before Monaco was initialized
         if (this.pendingValue && this.editor && !this.diffMode) {