syntaxmatrix 2.5.8.1__py3-none-any.whl → 2.6.0__py3-none-any.whl

syntaxmatrix/templates/dashboard.html

@@ -11,45 +11,7 @@
         margin: 0;
         padding: 0;
       }
-      .dashboard-sidebar {
-        position: fixed;
-        top: 0; left: 0;
-        width: 200px; height: 100vh;
-        background: #a3a4a5ff;
-        border-right: 1px solid #ccc;
-        padding: 26px 10px 10px 14px;
-        box-sizing: border-box;
-        overflow-y: auto;    
-        z-index: 100;
-        font-size: clamp(0.95rem, 2vw, 1.09rem);
-      }
-      .dashboard-sidebar h2 {
-        font-size: clamp(1.12rem, 3vw, 1.28rem);
-        color: #007acc;
-        margin-top: 0;
-        margin-bottom: 32px;
-        font-weight: bold;
-        letter-spacing: 1px;
-      }
-      .sidebar-links {
-        margin-top: 22px;
-      }
-      .sidebar-links a {
-        display: block;
-        padding: 12px 10px 12px 0;
-        color: #333;
-        text-decoration: none;
-        font-size: clamp(0.93rem, 2vw, 1.08rem);
-        border-radius: 6px;
-        margin-bottom: 6px;
-        transition: background 0.2s, color 0.2s;
-      }
-      .sidebar-links a.active,
-      .sidebar-links a:hover {
-        background: #e0e5ee;
-        color: #007acc;
-        font-weight: bold;
-      }
+      
       .dashboard-main {
         margin-left: 220px;
         padding: 36px 40px 30px 10px;
@@ -99,6 +61,46 @@
       textarea#askai{
         background: #e5e5e5cd;
       }
+
+      .dashboard-sidebar {
+        position: fixed;
+        top: 0; left: 0;
+        width: 200px; height: 100vh;
+        background: #a3a4a5ff;
+        border-right: 1px solid #ccc;
+        padding: 26px 10px 10px 14px;
+        box-sizing: border-box;
+        overflow-y: auto;    
+        z-index: 100;
+        font-size: clamp(0.95rem, 2vw, 1.09rem);
+      }
+      .dashboard-sidebar h2 {
+        font-size: clamp(1.12rem, 3vw, 1.28rem);
+        color: #007acc;
+        margin-top: 0;
+        margin-bottom: 32px;
+        font-weight: bold;
+        letter-spacing: 1px;
+      }
+      .sidebar-links {
+        margin-top: 22px;
+      }
+      .sidebar-links a {
+        display: block;
+        padding: 12px 10px 12px 0;
+        color: #333;
+        text-decoration: none;
+        font-size: clamp(0.93rem, 2vw, 1.08rem);
+        border-radius: 6px;
+        margin-bottom: 6px;
+        transition: background 0.2s, color 0.2s;
+      }
+      .sidebar-links a.active,
+      .sidebar-links a:hover {
+        background: #e0e5ee;
+        color: #007acc;
+        font-weight: bold;
+      }
       
       .smx-table {
         padding: clamp(3px, 1vw, 9px) clamp(4px, 2vw, 13px);
@@ -197,8 +199,8 @@
         .dashboard-sidebar {
           position: fixed !important;
           inset: 0 auto 0 0;
-          width: 80vw !important;           /* drawer width */
-          max-width: 320px;
+          width: 48vw !important;           /* drawer width */
+          max-width: 200px;
           transform: translateX(-100%);
           transition: transform .28s ease;
           z-index: 1000;
@@ -582,7 +584,7 @@
       .smx-stat h4{ color: #64748b !important; }
     </style>
     <style>
-      div.li > li {
+      div.li li {
         margin-left: 35px;
       }
       /* 1. Style the arrow specifically */
@@ -606,39 +608,68 @@
         display: none;
       }
 
-      /* Spinner that sits inside the Explore Data submit button */
-      .eda-btn-spinner {
-        display: none;
-        width: 1.1rem;
-        height: 1.1rem;
-        border-radius: 999px;
-        border: 2px solid currentColor;
-        border-top-color: transparent;
-        border-right-color: transparent;
-        animation: edaBtnSpin 0.7s linear infinite;
-        margin-left: 0;              /* was 0.5rem */
-        vertical-align: middle;
-        box-sizing: border-box;
+      /* Thinking dots that sit inside the Explore Data submit button */
+      /* Submit button: keep size constant while swapping text for dots */
+      .eda-submit-btn {
+        position: relative;
+        overflow: hidden;
       }
+
       .eda-btn-label {
         display: inline-block;
-        margin-right: 0.5rem;        /* space between text and spinner when both are visible */
       }
 
-      /* While loading: hide the label, show the spinner */
+      /* Thinking dots overlay, centred in the button */
+      .eda-btn-spinner {
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+        display: none;                 /* hidden until loading */
+        align-items: center;
+        justify-content: center;
+        gap: 0.15rem;
+      }
+
+      .eda-btn-spinner .dot {
+        width: 0.28rem;
+        height: 0.28rem;
+        border-radius: 999px;
+        background: currentColor;
+        opacity: 0.2;
+        display: inline-block;
+        margin: 0 0.08rem;
+        animation: edaBtnDots 1s infinite ease-in-out;
+      }
+
+      .eda-btn-spinner .dot:nth-child(2) {
+        animation-delay: 0.15s;
+      }
+
+      .eda-btn-spinner .dot:nth-child(3) {
+        animation-delay: 0.30s;
+      }
+
+      /* While loading: keep label in layout, but hide it visually */
       .eda-btn-loading .eda-btn-label {
-        display: none;           /* keeps button width stable */
+        visibility: hidden;            /* keeps height and width */
       }
 
       .eda-btn-loading .eda-btn-spinner {
-        display: inline-block;
+        display: inline-flex;
       }
 
-      @keyframes edaBtnSpin {
-        to {
-          transform: rotate(360deg);
+      @keyframes edaBtnDots {
+        0%, 60%, 100% {
+          opacity: 0.2;
+          transform: translateY(0);
+        }
+        30% {
+          opacity: 1;
+          transform: translateY(-0.16rem);
         }
       }
+
       .sidebar-links {
         margin-top: 22px;
       }
@@ -679,7 +710,7 @@
 <body>
   <div id="sidebarScrim" class="sidebar-scrim" aria-hidden="true"></div>
   <div class="dashboard-sidebar">
-    <button class="sidebar-close" aria-label="Close menu">✕</button>
+   
     <h2>ML&nbsp;Lab</h2>
     <a href="/">return to home</a>
     <div class="sidebar-links">
@@ -755,8 +786,14 @@
               type="submit"
               class="btn btn-primary eda-submit-btn"
             >
-              <span class="eda-btn-label">Submit</span>
-              <span class="eda-btn-spinner" aria-hidden="true"></span>
+              <span class="eda-btn-content">
+                <span class="eda-btn-label">Submit</span>
+                <span class="eda-btn-spinner" aria-hidden="true">
+                  <span class="dot"></span>
+                  <span class="dot"></span>
+                  <span class="dot"></span>
+                </span>
+              </span>
             </button>
           </form>
           <div style="margin-bottom: 36px;">
@@ -784,16 +821,23 @@
                         {% endfor %}
                       {% endif %} 
                       <br><br>
-                      {% if llm_usage %}
-                        <b>LLM: </b><span>{{ llm_usage.provider }} | {{ llm_usage.model }}</span><br> 
+                      {% if TOKENS %}
+                        <b>Refiner Agent: </b><span>{{ TOKENS['Refiner'][0] }} | {{  TOKENS['Refiner'][1] }}</span><br> 
                         <b>Token Usage: </b>
-                          <li>Input Tokens: {{ llm_usage.input_tokens }}</li>
-                          <li>Output Tokens: {{ llm_usage.output_tokens }}</li>
-                          <li>Total Tokens: {{ llm_usage.total_tokens }}</li>         
-                      </div>
-                    {% endif %} 
+                          <li>Input Tokens: {{ TOKENS['Refiner'][2] }}</li>
+                          <li>Output Tokens: {{ TOKENS['Refiner'][3] }}</li>
+                          <li>Total Tokens: {{ TOKENS['Refiner'][4] }}</li>  
+                        <br>     
+                        
+                        <b>Coder Agent: </b><span>{{ TOKENS['Coder'][0] }} | {{  TOKENS['Coder'][1] }}</span><br> 
+                        <b>Token Usage: </b>
+                          <li>Input Tokens: {{ TOKENS['Coder'][2] }}</li>
+                          <li>Output Tokens: {{ TOKENS['Coder'][3] }}</li>
+                          <li>Total Tokens: {{ TOKENS['Coder'][4] }}</li>
+                      {% endif %} 
                   </div>
                 </details>
+              </div>
             {% endif %}
             {% if ai_outputs %}
               <div class="d-flex align-items-center justify-content-between" style="margin: 12px;">