@pb33f/cowboy-components 0.3.4 → 0.4.0

package/dist/components/problems-overview/diagnostic-evaluation.js

@@ -77,12 +77,53 @@ let DiagnosticEvaluation = class DiagnosticEvaluation extends LitElement {
         if (parsed === '') {
             parsed = "No diagnosis available, looks like we're missing an OpenAPI specification";
         }
+        let grade;
+        if (this.score > 95) {
+            grade = 'A+';
+        }
+        else if (this.score > 90 && this.score <= 95) {
+            grade = 'A';
+        }
+        else if (this.score > 85 && this.score <= 90) {
+            grade = 'B';
+        }
+        else if (this.score > 75 && this.score <= 85) {
+            grade = 'C';
+        }
+        else if (this.score > 65 && this.score <= 75) {
+            grade = 'D';
+        }
+        else if (this.score > 55 && this.score <= 65) {
+            grade = 'F';
+        }
+        else if (this.score > 25 && this.score <= 55) {
+            grade = '🤒';
+        }
+        else if (this.score >= 10 && this.score <= 25) {
+            grade = '🥵';
+        }
+        else if (this.score >= 5 && this.score < 10) {
+            grade = '😵';
+        }
+        else if (this.score >= 1 && this.score < 5) {
+            grade = '💀';
+        }
+        else {
+            if (this.evaluation === 'Useless') {
+                grade = '⛔';
+                score = 'invalid';
+            }
+            else {
+                grade = '⏱️';
+            }
+        }
         return html `
             <div class="diagnostic-evaluation">
                 <div class="diagnostic-score">
                     <label>Overall score</label>
                     <div class="score ${this.scoreClass()}">
-                        <span>${score}</span>
+                        <span class="score-percent">${score}</span><br/>
+                        <span class="score-grade">${grade}</span><br/>
                     </div>
                     <span>${evalString}</span>
                 </div>

package/dist/components/problems-overview/problems-overview.css.js

@@ -9,6 +9,7 @@ export default css `
     
     .paginator {
         overflow-y: auto;
+        height: calc(100vh - 485px);
     }
 
     pb33f-paginator-navigation::part(values) {

package/dist/components/the-doctor/nuke-workspace.d.ts

@@ -0,0 +1,13 @@
+import '@shoelace-style/shoelace/dist/components/format-bytes/format-bytes.js';
+import { LitElement } from "lit";
+import SlDialog from "@shoelace-style/shoelace/dist/components/dialog/dialog.js";
+export declare class NukeWorkspaceComponent extends LitElement {
+    static styles: import("lit").CSSResult[];
+    dialog: SlDialog | undefined;
+    visible: boolean;
+    constructor();
+    show(): void;
+    hide(): void;
+    nuke(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/components/the-doctor/nuke-workspace.js

@@ -0,0 +1,70 @@
+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 '@shoelace-style/shoelace/dist/components/format-bytes/format-bytes.js';
+import { customElement, property, query } from "lit/decorators.js";
+import { html, LitElement } from "lit";
+import dialogCss from "../../css/dialog.css";
+import buttonCss from "../../css/button.css";
+import { AttentionType } from "../attention-box/attention-box";
+import hrCss from "../../css/hr.css";
+import { NukeWorkspaceEvent } from "../../events/doctor";
+let NukeWorkspaceComponent = class NukeWorkspaceComponent extends LitElement {
+    constructor() {
+        super();
+        this.visible = false;
+    }
+    show() {
+        this.visible = true;
+        this.dialog?.show();
+    }
+    hide() {
+        this.visible = false;
+        this.dialog?.hide();
+    }
+    nuke() {
+        this.dispatchEvent(new Event(NukeWorkspaceEvent));
+    }
+    render() {
+        return html `
+            <sl-dialog style="--width: 60vw; --height: 50vh">
+                <span slot="label" style="color: var(--error-color);"><sl-icon name="radioactive"
+                                                                               style="vertical-align: middle">
+                </sl-icon> Nuke workspace</span>
+                <p style="margin-top: 0; padding-top: 0">Things get messed up sometimes.</p>
+
+                <p>
+                    To <strong>reset</strong> the workspace back to factory default, you can <strong>nuke it</strong>.
+                </p>
+
+                <hr/>
+                <pb33f-attention-box type="${AttentionType.Warning}" headerText="All changes will be lost">
+                    The doctor will forget everything you have done and obliterate the workspace.
+                    <p>
+                        <strong>This cannot be un-done and cannot be restored, ever.</strong>
+                    </p>
+                </pb33f-attention-box>
+                </p>
+                <hr/>
+                <sl-button class="danger" @click="${this.nuke}">Do it! Destroy it all
+                    <sl-icon name="radioactive" slot="suffix"></sl-icon>
+                    <sl-icon name="radioactive" slot="prefix"></sl-icon>
+                </sl-button>
+                <sl-button variant="primary" @click="${this.hide}" style="float: right">Cancel</sl-button>
+            </sl-dialog>`;
+    }
+};
+NukeWorkspaceComponent.styles = [dialogCss, buttonCss, hrCss];
+__decorate([
+    query('sl-dialog')
+], NukeWorkspaceComponent.prototype, "dialog", void 0);
+__decorate([
+    property({ type: Boolean })
+], NukeWorkspaceComponent.prototype, "visible", void 0);
+NukeWorkspaceComponent = __decorate([
+    customElement("pb33f-nuke-workspace")
+], NukeWorkspaceComponent);
+export { NukeWorkspaceComponent };

package/dist/components/the-doctor/sparks.d.ts

@@ -5,6 +5,7 @@ export declare class PixelSparks extends LitElement {
     private readonly spawnRate;
     private ctx;
     private canvas;
+    isError: boolean;
     static styles: import("lit").CSSResult;
     constructor();
     firstUpdated(): void;

package/dist/components/the-doctor/sparks.js

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 { customElement } from "lit/decorators.js";
+import { customElement, property } from "lit/decorators.js";
 import { css, html, LitElement } from "lit";
 let PixelSparks = class PixelSparks extends LitElement {
     constructor() {
@@ -12,6 +12,7 @@ let PixelSparks = class PixelSparks extends LitElement {
         this.sparkArray = [];
         this.gravity = 0.0001;
         this.spawnRate = 70;
+        this.isError = false;
     }
     firstUpdated() {
         const canvas = this.renderRoot.querySelector('canvas');
@@ -32,11 +33,16 @@ let PixelSparks = class PixelSparks extends LitElement {
         return Math.random() * (max - min) + min;
     }
     spawnSpark() {
+        let color = Math.random() > 0.5 ? 'rgb(248, 58, 255)' : 'rgb(98, 196, 255)';
+        if (this.isError) {
+            // create a color between
+            color = Math.random() > 0.5 ? 'rgb(255, 60, 116)' : 'rgb(157, 26, 65)';
+        }
         this.sparkArray.push({
             x: Math.random() * this.canvas.width,
             y: -2,
             size: 1,
-            color: Math.random() > 0.5 ? 'rgb(248, 58, 255)' : 'rgb(98, 196, 255)',
+            color: color,
             velocityY: this.getRandomBetween(0.05, 0.3),
             lifetime: 300,
             initialLifetime: 300,
@@ -75,6 +81,9 @@ PixelSparks.styles = css `
             image-rendering: pixelated; /* Ensures pixelated appearance */
         }
     `;
+__decorate([
+    property({ type: Boolean })
+], PixelSparks.prototype, "isError", void 0);
 PixelSparks = __decorate([
     customElement('pb33f-pixel-sparks')
 ], PixelSparks);

package/dist/components/the-doctor/status-bar.css.js

@@ -2,21 +2,22 @@ import { css } from "lit";
 export default css `
     .status-bar {
         position: absolute;
-        bottom: 0;
+        bottom: 8px;
         left: 0;
         width: 100%;
         height: 20px;
         background: var(--background-color);
         border: 1px dashed var(--secondary-color);
-        z-index: 1000;
+        z-index: 100;
         border-bottom: none;
-        font-size: 0.9rem;
-        padding: 2px 0 0 5px;
+        font-size: 0.8rem;
+        padding: 4px 0 0 5px;
         vertical-align: middle;
+        
     }
     
     sl-icon {
-        vertical-align: middle;
+        vertical-align: bottom;
         font-size: 1rem;
     }
     

package/dist/components/the-doctor/the-doctor.css.js

@@ -20,9 +20,10 @@ export default css `
     .problems {
         position: relative;
         display: block;
-        margin-left: 10px;
+        padding-left: 10px;
         overflow: hidden;
         width: 100%;
+        background-color: var(--background-color);
     }
 
     #manager-controls::part(nav) {
@@ -51,7 +52,7 @@ export default css `
 
     sl-split-panel {
         width: 100%;
-        height: 100%;
+       // height: calc(100% - 65px);
         --divider-width: 2px;
     }
 
@@ -60,7 +61,7 @@ export default css `
         background-color: var(--secondary-color);
     }
 
-    sl-icon {
+    sl-icon.divider-vert {
         position: absolute;
         left: 2px;
         border-radius: 0;
@@ -71,6 +72,17 @@ export default css `
         height: 40px;
     }
 
+    sl-icon.divider-horiz {
+        position: absolute;
+        border-radius: 0;
+        background: var(--secondary-color);
+        color: var(--background-color);
+        padding: 0;
+        width: 40px;
+        height: 8px;
+    }
+
+
     sl-split-panel::part(divider):focus-visible {
         background-color: var(--primary-color);
     }
@@ -87,7 +99,6 @@ export default css `
     }
 
     .model-tree {
-        height: calc(100vh - 95px);
         overflow-x: auto;
         overflow-y: auto;
     }
@@ -108,6 +119,11 @@ export default css `
     }
 
 
+    .split-panel-rolodex {
+        --min: 150px;
+        --max: calc(100% - 150px);
+    }
+
     .split-panel {
         --min: 550px;
         --max: calc(100vw - 550px);
@@ -167,7 +183,8 @@ export default css `
     }
 
     .tab-panel {
-        height: calc(100vh - 110px);
+        height: 100%;
+        width: 100%;
     }
 
     sl-tab-panel.tab-panel::part(base) {
@@ -251,7 +268,7 @@ export default css `
         margin-top: 2px;
         height: 10px;
     }
-    
+
     .collapse-side {
         position: absolute;
         right: 5px;
@@ -266,41 +283,49 @@ export default css `
     }
 
     .controls {
+        position: relative;
         display: flex;
-        margin-left: 10px;
-        padding-top: 2px;
+        margin-left: 0;
+        padding-top: 0;
         font-size: 0.8rem;
-        height: 38px;
+        height: 24px;
         border-bottom: 1px dashed var(--secondary-color-dimmer);
+        padding-bottom: 5px;
+        margin-bottom: 5px;
     }
 
     .url-input {
         width: 50%;
     }
-    
+
     .url-problem {
         padding: 50px;
         display: none;
     }
-    
+
     #url-spinner {
         padding: 5px 50px 5px 50px;
     }
-    
+
     .main-view {
-       position: relative;
+        position: relative;
         width: 100%;
-        height: 100%;
+        height: calc(100vh - 120px);
+        overflow: auto;
     }
 
     sl-button.url-input-button::part(base) {
         margin-top: 0;
         margin-left: 10px;
     }
-    
+
+    sl-button.upload-button {
+        margin-left: 10px;
+    }
+
     .editor-url-overlay {
         position: absolute;
-        height: calc(100% - 5px); 
+        height: calc(100% - 5px);
         width: 100%;
         left: 0;
         top: 0;
@@ -310,5 +335,81 @@ export default css `
         -webkit-backdrop-filter: blur(2px);
         background-color: var(--background-color-withopacity);
     }
+
+    .import-button {
+        border: 0;
+        padding: 0;
+        font-size: 1rem;
+        width: calc(100% - 10px);
+        min-width: 100px;
+    }
+
+    .import-button::part(base) {
+        height: 5px;
+        line-height: 1.2rem;
+        margin-top: 0;
+    }
+    
+    .minimap-toggle {
+        position: absolute;
+        right: 10px;
+        top: -5px;
+        z-index: 10;
+    }
+
+    sl-tooltip.minimap-tip::part(base) {
+        font-size: 1rem;
+    }
+    
+    .minimap-toggle.active {
+        color: var(--warn-color)
+    }
+    
+    .nuke-session-button {
+        font-size: 1.4rem;
+        margin: 0 10px 0 10px;
+    }
+    
+    .nuke-session-button::part(base) {
+        padding: 0;
+    }
+
+    .nuke-session-button::part(base):hover {
+        color: var(--error-color);
+    }
+
+    pb33f-credit-ticker {
+        position: fixed;
+        display: inline-block;
+        bottom: 26px;
+        padding-left: 10px;
+        padding-top: 6px;
+        left: 0;
+        z-index: 20;
+        width: 100px;
+        height: 20px;
+        font-size: 0.8rem;
+        color: var(--terminal-text);
+        background-color: var(--background-color-withopacity);
+        
+    }
+    
+    .url-spinner-icon {
+        display: block;
+        margin: 20px auto 0 auto;
+        width: 200px;
+        color: var(--primary-color);
+        font-size: 5rem;
+        animation: spin 2s linear infinite;
+    }
+
+    @keyframes spin {
+        0% {
+            transform: rotate(0deg);
+        }
+        100% {
+            transform: rotate(360deg);
+        }
+    }
     
 `;

package/dist/components/the-doctor/the-doctor.d.ts

@@ -8,22 +8,30 @@ import '@shoelace-style/shoelace/dist/components/alert/alert.js';
 import '@shoelace-style/shoelace/dist/components/badge/badge.js';
 import '@shoelace-style/shoelace/dist/components/avatar/avatar.js';
 import { LitElement } from "lit";
-import { AddToastEvent, EditorUpdatedEvent, ProblemRuleFilterChangedEvent, RulesetSavedEvent, RuleClickedEvent, NodeClickedEvent, NodeReferenceEvent, ExplorerEqualizerChangedEvent } from "../../events/doctor.js";
+import { SpecEditor } from "../editor/editor.js";
+import { AddToastEvent, ArchiveURLRequestedEvent, DocumentReference, EditorUpdatedEvent, ExplorerEqualizerChangedEvent, NodeClickedEvent, NodeReferenceEvent, ProblemRuleFilterChangedEvent, RuleClickedEvent, RulesetSavedEvent } from "../../events/doctor.js";
 import { ProblemDrawerEvent } from "../problem-list/details-drawer.js";
+import { Problem } from "../../model/problem.js";
 import { SlButton, SlDialog, SlIcon, SlInput, SlRadioGroup, SlSplitPanel, SlTab, SlTabGroup } from "@shoelace-style/shoelace";
 import { PlatformError } from "../../model/errors.js";
 import { AttentionBox } from "../attention-box/attention-box.js";
 import { Toast } from "../../model/toast.js";
 import SlIconButton from "@shoelace-style/shoelace/dist/components/icon-button/icon-button.js";
-import { Node } from "../../model/graph.js";
+import { Node, Reference } from "../../model/graph.js";
 import { ModelTree } from "../model-tree/tree.js";
 import { ExplorerComponent } from "../visualizer/explorer.js";
 import { RenderedNodeComponent } from "../model-renderer/rendered-node.js";
 import { BusCallback, CommandResponse } from "@pb33f/ranch";
 export declare const GraphBag = "pb33f-doctor-graph";
+export declare const PanelStateBag = "pb33f-doctor-panel-state";
+export declare const RolodexResponseBag = "pb33f-doctor-rolodex-response";
+export declare const RolodexFilesBag = "pb33f-doctor-rolodex-files";
+export declare const RolodexStateBag = "pb33f-doctor-rolodex-state";
+export declare const ReferenceMapBag = "pb33f-doctor-reference-map";
 export declare const DoctorDocumentBag = "pb33f-doctor-editor";
 export declare const HowToFixBag = "pb33f-doctor-howtofix";
 export declare const FunctionDocumentationBag = "pb33f-doctor-funcdocs";
+export declare const DocumentationExpirationBag = "pb33f-doctor-doc-expiration";
 export declare const RuleDocumentationBag = "pb33f-doctor-ruledocs";
 export declare const DiagnosticBag = "pb33f-doctor-diagnostic";
 export declare const DefaultRulesetBag = "pb33f-doctor-default-ruleset";
@@ -34,8 +42,8 @@ export declare const FunctionsSchemaBag = "pb33f-doctor-function-schema";
 export declare const CustomRulesetBag = "pb33f-doctor-custom-ruleset";
 export declare const RuleConfigurationBag = "pb33f-doctor-rule-configuration";
 export declare const SessionRulesetMapBag = "pb33f-doctor-session-rulesetmap";
-export declare const DefaultDocument = "document";
-export declare const DocumentProblems = "problems";
+export declare const DefaultDocument = "pb33f-doctor-document";
+export declare const DocumentProblems = "pb33f-doctor-problems";
 export declare const DoctorEndpoint = "doctor-endpoint";
 export declare class TheDoctor extends LitElement {
     static styles: import("lit").CSSResult[];
@@ -53,30 +61,50 @@ export declare class TheDoctor extends LitElement {
     urlInputButton: SlButton;
     urlInput: SlInput;
     private unavailable;
+    urlOverlay: HTMLElement;
+    urlProblem: HTMLElement;
+    urlSpinner: HTMLDivElement;
+    urlErrorCode: number;
+    urlErrorMessage: string;
     doctorEndpoint: string;
     exportRulesetDialog: SlDialog;
     collapseButton: SlIconButton;
     splitDivider: SlIcon;
     splitPanel: SlSplitPanel;
+    splitPanelExplorer: SlSplitPanel;
+    splitPanelRolodex: SlSplitPanel;
+    splitPanelInspector: SlSplitPanel;
     private rulesetPulse;
     explorerVisible: boolean;
+    minimapVisible: boolean;
     explorerBooted: boolean;
     activeURL: string;
+    rolodexNeedsReset: boolean;
+    editor: SpecEditor;
+    rolodexRoot: Node;
+    rolodexProblemMap: Map<string, Problem[]>;
+    private readonly uploadArchive;
+    private readonly nukeWorkspace;
     private readonly errorBanner;
     private bagManager;
-    private readonly editor;
-    private readonly rulesetEditor;
+    rulesetEditor: SpecEditor;
     private docBag;
     private problemBag;
     private diagnosticBag;
-    private DefaultRulesetBag;
+    private defaultRulesetBag;
     private OWASPRulesetBag;
-    private AllRulesetBag;
-    private CustomRulesetBag;
-    private FunctionsBag;
-    private FunctionSchemaBag;
-    private RuleConfigBag;
+    private allRulesetBag;
+    private customRulesetBag;
+    private functionsBag;
+    private functionSchemaBag;
+    private ruleConfigBag;
     private howToFixBag;
+    private rolodexResponseBag;
+    private rolodexFilesBag;
+    private rolodexStateBag;
+    private referenceMapBag;
+    private panelStateBag;
+    private docExpirationBag;
     private graphBag;
     private ruleDocsBag;
     private functionDocsBag;
@@ -84,6 +112,7 @@ export declare class TheDoctor extends LitElement {
     private readonly problemsOverview;
     private readonly problemList;
     private readonly detailsDrawer;
+    private readonly creditTicker;
     private ruleDocsWorker;
     private debounceTime;
     private debounceTimeRuleset;
@@ -96,16 +125,19 @@ export declare class TheDoctor extends LitElement {
     private readonly manageRuleset;
     private defaultRuleset;
     private OWASPRuleset;
-    private AllRuleset;
-    private CustomRuleset;
+    private allRuleset;
+    private customRuleset;
     private functions;
     private readonly toastManager;
     private editorMap;
     private selectedEditorTab;
     private sidebarClosed;
+    private importDisabled;
     renderedNodeMap: Map<string, Node>;
     selectedNodeHashId: string;
     modelTree: ModelTree;
+    rolodexTree: ModelTree;
+    references: Reference[];
     explorer: ExplorerComponent;
     nodeMap: Map<string, Node>;
     nodeIdMap: Map<string, Node>;
@@ -115,23 +147,41 @@ export declare class TheDoctor extends LitElement {
     activeNode: Node;
     private readonly bus;
     private readonly specStreamChannel;
+    private readonly creditStreamChannel;
     private readonly doctorServiceChannel;
     private specChannelSubscription;
     private doctorChannelSubscription;
+    private creditChannelSubscription;
     private brokerConnectionId;
     private readonly busPort;
     private readonly busHost;
     private readonly busVersion;
     private useTLS;
     readonly nodeLimit: number;
+    private pendingLine;
+    private rolodexDividerPosition;
     constructor(doctorEndpoint?: string);
+    nukeWorkspaceHandler(): void;
+    minimapToggled(): void;
+    firstUpdated(): void;
     whoAmI(): void;
     protected connectToBroker(): void;
     addClickTrack(node: Node): void;
+    addRefTrack(ref: string): void;
     doctorServiceHandler(): BusCallback<CommandResponse>;
+    startTheDoctor(): void;
     specStreamHandler(): BusCallback<CommandResponse>;
+    creditStreamHandler(): BusCallback<CommandResponse>;
+    private _firstRun;
     filterTreeModel(event: CustomEvent<ExplorerEqualizerChangedEvent>): void;
+    documentReferenceClicked(evt: CustomEvent<DocumentReference>): void;
     explorerReferenceClicked(evt: CustomEvent<NodeReferenceEvent>): void;
+    rolodexRootPath: string;
+    rolodexRootHash: string;
+    rolodexActivePath: string | undefined;
+    rolodexActiveHash: string | undefined;
+    rolodexTreeNodeClicked(evt: CustomEvent<NodeClickedEvent>): void;
+    rolodexRootFileSelected(evt: CustomEvent<NodeClickedEvent>): void;
     modelTreeNodeClicked(evt: CustomEvent<NodeClickedEvent>): void;
     explorerNodeClicked(evt: CustomEvent<NodeClickedEvent>): void;
     exportRuleset(): void;
@@ -140,7 +190,12 @@ export declare class TheDoctor extends LitElement {
     ruleGroupClicked(event: CustomEvent<ProblemRuleFilterChangedEvent>): void;
     ruleDocsClicked(event: CustomEvent<ProblemDrawerEvent>): void;
     rulesetSaved(evt: CustomEvent<RulesetSavedEvent>): void;
+    private buildRolodexResultMap;
     private lintSpec;
+    updateInspectorDivider(): void;
+    updateExplorerDivider(): void;
+    updateRolodexDivider(): void;
+    private updateRefmapBag;
     private platformUnavailable;
     private specClicked;
     private problemClicked;
@@ -170,14 +225,8 @@ export declare class TheDoctor extends LitElement {
     toggleExplorer(): void;
     closeExplorer(): void;
     render(): import("lit-html").TemplateResult<1>;
-    fetchUrl(): void;
-    urlOverlay: HTMLElement;
-    urlProblem: HTMLElement;
-    urlSpinner: HTMLDivElement;
-    urlErrorCode: number;
-    urlErrorMessage: string;
+    fetchUrl(event: CustomEvent<ArchiveURLRequestedEvent>): void;
     hideUrlError(): void;
     showUrlError(e: PlatformError): void;
-    validateUrl(evt: KeyboardEvent): void;
     ungrabExplorer(): void;
 }