@roxyapi/ui 0.2.0 → 0.2.1

package/dist/index.js

@@ -5757,7 +5757,6 @@ var RoxyTransitsTable = class extends LitElement23 {
 					<th scope="col">Orb</th>
 					<th scope="col">Status</th>
 					<th scope="col">Strength</th>
-					<th scope="col" class="interp">Interpretation</th>
 				</tr>
 			</thead>
 			<tbody>
@@ -5766,26 +5765,28 @@ var RoxyTransitsTable = class extends LitElement23 {
       const nGlyph = PLANET_GLYPH[capitalize(a.natalPlanet)] ?? "";
       const natureClass = `nature-${(a.nature ?? "").toLowerCase()}`;
       const summary = a.interpretation?.summary ?? "";
-      const truncated = summary.length > 120 ? `${summary.slice(0, 120)}...` : summary;
-      return html23`<tr>
-						<td>
-							<div class="arrow-cell">
-								<span class="glyph" aria-hidden="true">${tGlyph}</span>
-								${a.transitPlanet}
-							</div>
-						</td>
-						<td>
-							<div class="arrow-cell">
-								<span class="glyph" aria-hidden="true">${nGlyph}</span>
-								${a.natalPlanet}
-							</div>
-						</td>
-						<td class=${natureClass}>${(a.type ?? "").toLowerCase()}</td>
-						<td class="num">${formatNumber(a.orb, 2)}</td>
-						<td>${a.isApplying ? "Applying" : "Separating"}</td>
-						<td class="num">${formatNumber(a.strength, 1)}</td>
-						<td class="interp" title=${summary}>${truncated}</td>
-					</tr>`;
+      const rowClass = summary ? "aspect-row" : "aspect-row no-interp";
+      return html23`<tr class=${rowClass}>
+							<td>
+								<div class="arrow-cell">
+									<span class="glyph" aria-hidden="true">${tGlyph}</span>
+									${a.transitPlanet}
+								</div>
+							</td>
+							<td>
+								<div class="arrow-cell">
+									<span class="glyph" aria-hidden="true">${nGlyph}</span>
+									${a.natalPlanet}
+								</div>
+							</td>
+							<td class=${natureClass}>${(a.type ?? "").toLowerCase()}</td>
+							<td class="num">${formatNumber(a.orb, 2)}</td>
+							<td>${a.isApplying ? "Applying" : "Separating"}</td>
+							<td class="num">${formatNumber(a.strength, 1)}</td>
+						</tr>
+						${summary ? html23`<tr class="interp-row">
+										<td colspan="6">${summary}</td>
+									</tr>` : nothing24}`;
     })}
 			</tbody>
 		</table>`;
@@ -5940,19 +5941,23 @@ RoxyTransitsTable.styles = [
 				white-space: nowrap;
 			}
 
-			.interp {
+			.interp-row td {
+				padding-top: 0;
+				padding-bottom: var(--roxy-space-sm, 0.5rem);
+				border-bottom: 1px solid var(--roxy-border, #e4e4e7);
 				color: var(--roxy-secondary, #475569);
 				font-size: var(--roxy-text-xs, 0.75rem);
-				max-width: 22rem;
-				white-space: nowrap;
-				overflow: hidden;
-				text-overflow: ellipsis;
+				line-height: 1.45;
 			}
 
-			@container (max-width: 600px) {
-				.interp {
-					display: none;
-				}
+			.aspect-row td {
+				border-bottom: none;
+				padding-bottom: 4px;
+			}
+
+			.aspect-row.no-interp td {
+				border-bottom: 1px solid var(--roxy-border, #e4e4e7);
+				padding-bottom: var(--roxy-space-sm, 0.5rem);
 			}
 
 			.overflow-scroll {
@@ -6630,7 +6635,7 @@ var ROXY_COMPONENTS = [
 ];
 
 // packages/ui/src/version.ts
-var ROXY_UI_VERSION = "0.2.0";
+var ROXY_UI_VERSION = "0.2.1";
 
 // packages/ui/src/index.ts
 var ROXY_UI_COMPONENTS = ROXY_COMPONENTS.map((c) => c.slug);