@tangle-network/sandbox-ui 0.17.0 → 0.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chat.d.ts +118 -0
- package/dist/chat.js +12 -3
- package/dist/{chunk-GPT7VKK6.js → chunk-CP2L6B53.js} +21 -4
- package/dist/chunk-MQ52AYJX.js +445 -0
- package/dist/chunk-N5RYCDLD.js +1187 -0
- package/dist/dashboard.d.ts +1 -1
- package/dist/dashboard.js +1 -1
- package/dist/globals.css +1282 -0
- package/dist/index.d.ts +2 -1
- package/dist/index.js +12 -4
- package/dist/openui.d.ts +0 -1
- package/dist/pages.d.ts +1 -1
- package/dist/pages.js +1 -1
- package/dist/styles.css +1282 -0
- package/dist/{template-card-Dufxl4hV.d.ts → template-card-gf-InrfN.d.ts} +12 -0
- package/dist/workspace.d.ts +1 -1
- package/dist/workspace.js +1 -1
- package/package.json +2 -1
- package/dist/chunk-27X3DWMO.js +0 -815
- package/dist/chunk-QPAJR74X.js +0 -20
|
@@ -0,0 +1,1187 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cn
|
|
3
|
+
} from "./chunk-EI44GEQ5.js";
|
|
4
|
+
|
|
5
|
+
// src/dashboard/model-picker.tsx
|
|
6
|
+
import * as React from "react";
|
|
7
|
+
import { TangleKnot } from "@tangle-network/brand";
|
|
8
|
+
import { ChevronDown, Search, Sparkles, Loader2 } from "lucide-react";
|
|
9
|
+
import * as Popover from "@radix-ui/react-dropdown-menu";
|
|
10
|
+
|
|
11
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/ai21.svg
|
|
12
|
+
var ai21_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>AI21</title><path d="M6.47 17l-.367-1.189H2.718L2.35 17H0l3.398-9.789h2.026L8.864 17H6.47zm-2.052-6.993l-1.17 4.028H5.56l-1.142-4.028zm4.707-2.796h2.23V17h-2.23V7.211zM11.955 15c.1-.483.277-.946.524-1.37.214-.359.482-.68.795-.951.32-.273.658-.52 1.013-.741.28-.168.54-.33.781-.483.222-.14.433-.296.632-.468.172-.148.317-.325.428-.525.107-.199.16-.423.157-.65 0-.392-.104-.674-.313-.846a1.176 1.176 0 00-.775-.259 1.207 1.207 0 00-.863.329c-.231.219-.347.585-.347 1.098H11.8a3.387 3.387 0 01.224-1.245c.146-.377.371-.716.66-.993.306-.29.667-.514 1.06-.657A4.04 4.04 0 0115.183 7c.42-.002.84.057 1.244.175.376.107.73.287 1.04.531.305.246.55.562.714.923.185.419.275.875.265 1.335.005.39-.084.774-.259 1.12-.167.328-.38.63-.632.894-.246.259-.517.49-.808.693-.29.2-.554.37-.789.51-.326.224-.596.417-.809.58a3.872 3.872 0 00-.51.455 1.229 1.229 0 00-.265.434 1.633 1.633 0 00-.074.517h4.078V17h-6.606a9.24 9.24 0 01.183-2zM18.8 8.93a5.05 5.05 0 001.135-.105c.25-.049.484-.156.686-.314.163-.139.28-.324.34-.532.068-.25.1-.51.095-.77H23V17h-2.243v-6.475H18.8V8.93z"></path></svg>';
|
|
13
|
+
|
|
14
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/alibaba.svg
|
|
15
|
+
var alibaba_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Alibaba</title><path d="M24 14.014c-2.8 1.512-5.62 2.896-8.759 3.524-.7.139-1.476.139-2.187.043-.678-.085-1.017-.682-.776-1.31.23-.585.536-1.181.93-1.671.852-1.065 1.814-2.034 2.678-3.088a15.75 15.75 0 001.422-2.054c.306-.511.164-1.129-.372-1.384-.897-.437-1.859-.745-2.81-1.075-.11-.043-.274.074-.492.149.273.244.47.425.743.67-2.821.48-5.49 1.16-8.08 2.098-.012.053-.033.095-.023.117.383.585.208 1.032-.35 1.394a2.365 2.365 0 00-.568.522c1.706.5 3.226.213 4.68-.735-.087-.127-.175-.244-.262-.372.546.096.874.394.918.862.011.107-.054.213-.087.32-.077-.086-.175-.17-.24-.267-.045-.064-.056-.138-.088-.245-1.728 1.15-3.587 1.438-5.632.842 0 .404-.022.745.011 1.075.022.287-.098.415-.36.564-.591.362-1.204.735-1.696 1.214-.59.585-.371 1.299.427 1.597.907.34 1.859.35 2.81.234 1.126-.139 2.23-.32 3.456-.49-1.433.67-2.844 1.14-4.33 1.33-1.04.14-2.078.214-3.106-.084-1.476-.415-2.133-1.501-1.75-2.96.361-1.363 1.236-2.449 2.176-3.45 3.139-3.332 7.108-5.024 11.7-5.365 1.072-.074 2.155.064 3.16.511 1.411.639 2.002 1.99 1.313 3.354-.448.905-1.072 1.735-1.695 2.555-.612.809-1.301 1.554-1.946 2.331-.186.234-.361.48-.503.745-.274.5-.088.83.492.778 1.213-.118 2.45-.213 3.62-.511 1.716-.437 3.389-1.054 5.084-1.597.175-.043.339-.107.492-.17z"></path></svg>';
|
|
16
|
+
|
|
17
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/anthropic.svg
|
|
18
|
+
var anthropic_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Anthropic</title><path d="M13.827 3.52h3.603L24 20h-3.603l-6.57-16.48zm-7.258 0h3.767L16.906 20h-3.674l-1.343-3.461H5.017l-1.344 3.46H0L6.57 3.522zm4.132 9.959L8.453 7.687 6.205 13.48H10.7z"></path></svg>';
|
|
19
|
+
|
|
20
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/azure.svg
|
|
21
|
+
var azure_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Azure</title><path d="M18.397 15.296H7.4a.51.51 0 00-.347.882l7.066 6.595c.206.192.477.298.758.298h6.226l-2.706-7.775z" fill-opacity=".75"></path><path d="M8.295.857c-.477 0-.9.304-1.053.756L.495 21.605a1.11 1.11 0 001.052 1.466h5.43c.477 0 .9-.304 1.053-.755l1.341-3.975-2.318-2.163a.51.51 0 01.347-.882h3L15.271.857H8.295z" fill-opacity=".5"></path><path d="M17.193 1.613a1.11 1.11 0 00-1.052-.756h-7.81.035c.477 0 .9.304 1.052.756l6.748 19.992a1.11 1.11 0 01-1.052 1.466h-.12 7.895a1.11 1.11 0 001.052-1.466L17.193 1.613z"></path></svg>';
|
|
22
|
+
|
|
23
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/bedrock.svg
|
|
24
|
+
var bedrock_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Bedrock</title><path d="M13.05 15.513h3.08c.214 0 .389.177.389.394v1.82a1.704 1.704 0 011.296 1.661c0 .943-.755 1.708-1.685 1.708-.931 0-1.686-.765-1.686-1.708 0-.807.554-1.484 1.297-1.662v-1.425h-2.69v4.663a.395.395 0 01-.188.338l-2.69 1.641a.385.385 0 01-.405-.002l-4.926-3.086a.395.395 0 01-.185-.336V16.3L2.196 14.87A.395.395 0 012 14.555L2 14.528V9.406c0-.14.073-.27.192-.34l2.465-1.462V4.448c0-.129.062-.249.165-.322l.021-.014L9.77 1.058a.385.385 0 01.407 0l2.69 1.675a.395.395 0 01.185.336V7.6h3.856V5.683a1.704 1.704 0 01-1.296-1.662c0-.943.755-1.708 1.685-1.708.931 0 1.685.765 1.685 1.708 0 .807-.553 1.484-1.296 1.662v2.311a.391.391 0 01-.389.394h-4.245v1.806h6.624a1.69 1.69 0 011.64-1.313c.93 0 1.685.764 1.685 1.707 0 .943-.754 1.708-1.685 1.708a1.69 1.69 0 01-1.64-1.314H13.05v1.937h4.953l.915 1.18a1.66 1.66 0 01.84-.227c.931 0 1.685.764 1.685 1.707 0 .943-.754 1.708-1.685 1.708-.93 0-1.685-.765-1.685-1.708 0-.346.102-.668.276-.937l-.724-.935H13.05v1.806zM9.973 1.856L7.93 3.122V6.09h-.778V3.604L5.435 4.669v2.945l2.11 1.36L9.712 7.61V5.334h.778V7.83c0 .136-.07.263-.184.335L7.963 9.638v2.081l1.422 1.009-.446.646-1.406-.998-1.53 1.005-.423-.66 1.605-1.055v-1.99L5.038 8.29l-2.26 1.34v1.676l1.972-1.189.398.677-2.37 1.429V14.3l2.166 1.258 2.27-1.368.397.677-2.176 1.311V19.3l1.876 1.175 2.365-1.426.398.678-2.017 1.216 1.918 1.201 2.298-1.403v-5.78l-4.758 2.893-.4-.675 5.158-3.136V3.289L9.972 1.856zM16.13 18.47a.913.913 0 00-.908.92c0 .507.406.918.908.918a.913.913 0 00.907-.919.913.913 0 00-.907-.92zm3.63-3.81a.913.913 0 00-.908.92c0 .508.406.92.907.92a.913.913 0 00.908-.92.913.913 0 00-.908-.92zm1.555-4.99a.913.913 0 00-.908.92c0 .507.407.918.908.918a.913.913 0 00.907-.919.913.913 0 00-.907-.92zM17.296 3.1a.913.913 0 00-.907.92c0 .508.406.92.907.92a.913.913 0 00.908-.92.913.913 0 00-.908-.92z"></path></svg>';
|
|
25
|
+
|
|
26
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/cerebras.svg
|
|
27
|
+
var cerebras_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Cerebras</title><path clip-rule="evenodd" d="M14.121 2.701a9.299 9.299 0 000 18.598V22.7c-5.91 0-10.7-4.791-10.7-10.701S8.21 1.299 14.12 1.299V2.7zm4.752 3.677A7.353 7.353 0 109.42 17.643l-.901 1.074a8.754 8.754 0 01-1.08-12.334 8.755 8.755 0 0112.335-1.08l-.901 1.075zm-2.255.844a5.407 5.407 0 00-5.048 9.563l-.656 1.24a6.81 6.81 0 016.358-12.043l-.654 1.24zM14.12 8.539a3.46 3.46 0 100 6.922v1.402a4.863 4.863 0 010-9.726v1.402z"></path><path d="M15.407 10.836a2.24 2.24 0 00-.51-.409 1.084 1.084 0 00-.544-.152c-.255 0-.483.047-.684.14a1.58 1.58 0 00-.84.912c-.074.203-.11.416-.11.631 0 .218.036.43.11.631a1.594 1.594 0 00.84.913c.2.093.43.14.684.14.216 0 .417-.046.602-.135.188-.09.35-.225.475-.392l.928 1.006c-.14.14-.3.261-.482.363a3.367 3.367 0 01-1.083.38c-.17.026-.317.04-.44.04a3.315 3.315 0 01-1.182-.21 2.825 2.825 0 01-.961-.597 2.816 2.816 0 01-.644-.929 2.987 2.987 0 01-.238-1.21c0-.444.08-.847.238-1.21.15-.35.368-.666.643-.929.278-.261.605-.464.962-.596a3.315 3.315 0 011.182-.21c.355 0 .712.068 1.072.204.361.138.685.36.944.649l-.962.97z"></path></svg>';
|
|
28
|
+
|
|
29
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/cohere.svg
|
|
30
|
+
var cohere_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Cohere</title><path clip-rule="evenodd" d="M8.128 14.099c.592 0 1.77-.033 3.398-.703 1.897-.781 5.672-2.2 8.395-3.656 1.905-1.018 2.74-2.366 2.74-4.18A4.56 4.56 0 0018.1 1H7.549A6.55 6.55 0 001 7.55c0 3.617 2.745 6.549 7.128 6.549z"></path><path clip-rule="evenodd" d="M9.912 18.61a4.387 4.387 0 012.705-4.052l3.323-1.38c3.361-1.394 7.06 1.076 7.06 4.715a5.104 5.104 0 01-5.105 5.104l-3.597-.001a4.386 4.386 0 01-4.386-4.387z"></path><path d="M4.776 14.962A3.775 3.775 0 001 18.738v.489a3.776 3.776 0 007.551 0v-.49a3.775 3.775 0 00-3.775-3.775z"></path></svg>';
|
|
31
|
+
|
|
32
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/deepseek.svg
|
|
33
|
+
var deepseek_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>DeepSeek</title><path d="M23.748 4.482c-.254-.124-.364.113-.512.234-.051.039-.094.09-.137.136-.372.397-.806.657-1.373.626-.829-.046-1.537.214-2.163.848-.133-.782-.575-1.248-1.247-1.548-.352-.156-.708-.311-.955-.65-.172-.241-.219-.51-.305-.774-.055-.16-.11-.323-.293-.35-.2-.031-.278.136-.356.276-.313.572-.434 1.202-.422 1.84.027 1.436.633 2.58 1.838 3.393.137.093.172.187.129.323-.082.28-.18.552-.266.833-.055.179-.137.217-.329.14a5.526 5.526 0 01-1.736-1.18c-.857-.828-1.631-1.742-2.597-2.458a11.365 11.365 0 00-.689-.471c-.985-.957.13-1.743.388-1.836.27-.098.093-.432-.779-.428-.872.004-1.67.295-2.687.684a3.055 3.055 0 01-.465.137 9.597 9.597 0 00-2.883-.102c-1.885.21-3.39 1.102-4.497 2.623C.082 8.606-.231 10.684.152 12.85c.403 2.284 1.569 4.175 3.36 5.653 1.858 1.533 3.997 2.284 6.438 2.14 1.482-.085 3.133-.284 4.994-1.86.47.234.962.327 1.78.397.63.059 1.236-.03 1.705-.128.735-.156.684-.837.419-.961-2.155-1.004-1.682-.595-2.113-.926 1.096-1.296 2.746-2.642 3.392-7.003.05-.347.007-.565 0-.845-.004-.17.035-.237.23-.256a4.173 4.173 0 001.545-.475c1.396-.763 1.96-2.015 2.093-3.517.02-.23-.004-.467-.247-.588zM11.581 18c-2.089-1.642-3.102-2.183-3.52-2.16-.392.024-.321.471-.235.763.09.288.207.486.371.739.114.167.192.416-.113.603-.673.416-1.842-.14-1.897-.167-1.361-.802-2.5-1.86-3.301-3.307-.774-1.393-1.224-2.887-1.298-4.482-.02-.386.093-.522.477-.592a4.696 4.696 0 011.529-.039c2.132.312 3.946 1.265 5.468 2.774.868.86 1.525 1.887 2.202 2.891.72 1.066 1.494 2.082 2.48 2.914.348.292.625.514.891.677-.802.09-2.14.11-3.054-.614zm1-6.44a.306.306 0 01.415-.287.302.302 0 01.2.288.306.306 0 01-.31.307.303.303 0 01-.304-.308zm3.11 1.596c-.2.081-.399.151-.59.16a1.245 1.245 0 01-.798-.254c-.274-.23-.47-.358-.552-.758a1.73 1.73 0 01.016-.588c.07-.327-.008-.537-.239-.727-.187-.156-.426-.199-.688-.199a.559.559 0 01-.254-.078c-.11-.054-.2-.19-.114-.358.028-.054.16-.186.192-.21.356-.202.767-.136 1.146.016.352.144.618.408 1.001.782.391.451.462.576.685.914.176.265.336.537.445.848.067.195-.019.354-.25.452z"></path></svg>';
|
|
34
|
+
|
|
35
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/elevenlabs.svg
|
|
36
|
+
var elevenlabs_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>ElevenLabs</title><path d="M5 0h5v24H5V0zM14 0h5v24h-5V0z"></path></svg>';
|
|
37
|
+
|
|
38
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/fal.svg
|
|
39
|
+
var fal_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Fal</title><path clip-rule="evenodd" d="M15.477 0c.415 0 .749.338.788.752a7.775 7.775 0 006.985 6.984c.413.04.752.373.752.788v6.952c0 .415-.338.748-.752.788a7.775 7.775 0 00-6.985 6.984c-.04.414-.373.752-.788.752H8.525c-.416 0-.749-.338-.789-.752a7.775 7.775 0 00-6.984-6.984c-.414-.04-.752-.373-.752-.788V8.524c0-.415.338-.748.752-.788A7.775 7.775 0 007.736.752C7.776.338 8.11 0 8.526 0h6.95zM4.819 11.98a7.226 7.226 0 007.223 7.23 7.226 7.226 0 007.223-7.23c0-3.994-3.234-7.23-7.223-7.23a7.227 7.227 0 00-7.223 7.23z"></path></svg>';
|
|
40
|
+
|
|
41
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/fireworks.svg
|
|
42
|
+
var fireworks_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Fireworks</title><path clip-rule="evenodd" d="M14.8 5l-2.801 6.795L9.195 5H7.397l3.072 7.428a1.64 1.64 0 003.038.002L16.598 5H14.8zm1.196 10.352l5.124-5.244-.699-1.669-5.596 5.739a1.664 1.664 0 00-.343 1.807 1.642 1.642 0 001.516 1.012L16 17l8-.02-.699-1.669-7.303.041h-.002zM2.88 10.104l.699-1.669 5.596 5.739c.468.479.603 1.189.343 1.807a1.643 1.643 0 01-1.516 1.012l-8-.018-.002.002.699-1.669 7.303.042-5.122-5.246z"></path></svg>';
|
|
43
|
+
|
|
44
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/google.svg
|
|
45
|
+
var google_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Google</title><path d="M23 12.245c0-.905-.075-1.565-.236-2.25h-10.54v4.083h6.186c-.124 1.014-.797 2.542-2.294 3.569l-.021.136 3.332 2.53.23.022C21.779 18.417 23 15.593 23 12.245z"></path><path d="M12.225 23c3.03 0 5.574-.978 7.433-2.665l-3.542-2.688c-.948.648-2.22 1.1-3.891 1.1a6.745 6.745 0 01-6.386-4.572l-.132.011-3.465 2.628-.045.124C4.043 20.531 7.835 23 12.225 23z"></path><path d="M5.84 14.175A6.65 6.65 0 015.463 12c0-.758.138-1.491.361-2.175l-.006-.147-3.508-2.67-.115.054A10.831 10.831 0 001 12c0 1.772.436 3.447 1.197 4.938l3.642-2.763z"></path><path d="M12.225 5.253c2.108 0 3.529.892 4.34 1.638l3.167-3.031C17.787 2.088 15.255 1 12.225 1 7.834 1 4.043 3.469 2.197 7.062l3.63 2.763a6.77 6.77 0 016.398-4.572z"></path></svg>';
|
|
46
|
+
|
|
47
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/groq.svg
|
|
48
|
+
var groq_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Groq</title><path d="M12.036 2c-3.853-.035-7 3-7.036 6.781-.035 3.782 3.055 6.872 6.908 6.907h2.42v-2.566h-2.292c-2.407.028-4.38-1.866-4.408-4.23-.029-2.362 1.901-4.298 4.308-4.326h.1c2.407 0 4.358 1.915 4.365 4.278v6.305c0 2.342-1.944 4.25-4.323 4.279a4.375 4.375 0 01-3.033-1.252l-1.851 1.818A7 7 0 0012.029 22h.092c3.803-.056 6.858-3.083 6.879-6.816v-6.5C18.907 4.963 15.817 2 12.036 2z"></path></svg>';
|
|
49
|
+
|
|
50
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/kling.svg
|
|
51
|
+
var kling_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Kling</title><path clip-rule="evenodd" d="M5.493 21.234c-1.112-1.451-1.109-4.263-.081-7.459l-4.557-2.63a1.683 1.683 0 01-.85-1.304 1.505 1.505 0 01.08-.622 13.18 13.18 0 011.037-2.255c3.476-6.02 10.916-8.23 16.619-4.938.46.266.82.67 1.081 1.184.785 1.545.685 4.096-.234 6.954l4.557 2.631c.339.196.596.492.736.832a1.53 1.53 0 01.034 1.093 13.146 13.146 0 01-1.037 2.255c-3.476 6.02-10.916 8.23-16.619 4.938a2.6 2.6 0 01-.766-.68zm11.096-6.615c-2.073 3.591-5.808 5.316-8.343 3.852-1.267-.731-1.994-2.122-2.145-3.778-.095-1.035.036-2.173.4-3.32.217-.684.517-1.37.902-2.039l.008-.014c2.073-3.59 5.808-5.315 8.343-3.852.633.366 1.13.895 1.49 1.54.986 1.772.922 4.415-.285 6.914-.111.23-.232.457-.362.683l-.008.014z"></path></svg>';
|
|
52
|
+
|
|
53
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/luma.svg
|
|
54
|
+
var luma_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Luma</title><path d="M12.393 24L2 17.998l10.393-6 10.392 6-10.393 6z" fill-opacity=".66"></path><path d="M2 5.999L12.393 0v24L2 18V5.999z" fill-opacity=".66"></path></svg>';
|
|
55
|
+
|
|
56
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/meta.svg
|
|
57
|
+
var meta_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Meta</title><path d="M6.897 4c1.915 0 3.516.932 5.43 3.376l.282-.373c.19-.246.383-.484.58-.71l.313-.35C14.588 4.788 15.792 4 17.225 4c1.273 0 2.469.557 3.491 1.516l.218.213c1.73 1.765 2.917 4.71 3.053 8.026l.011.392.002.25c0 1.501-.28 2.759-.818 3.7l-.14.23-.108.153c-.301.42-.664.758-1.086 1.009l-.265.142-.087.04a3.493 3.493 0 01-.302.118 4.117 4.117 0 01-1.33.208c-.524 0-.996-.067-1.438-.215-.614-.204-1.163-.56-1.726-1.116l-.227-.235c-.753-.812-1.534-1.976-2.493-3.586l-1.43-2.41-.544-.895-1.766 3.13-.343.592C7.597 19.156 6.227 20 4.356 20c-1.21 0-2.205-.42-2.936-1.182l-.168-.184c-.484-.573-.837-1.311-1.043-2.189l-.067-.32a8.69 8.69 0 01-.136-1.288L0 14.468c.002-.745.06-1.49.174-2.23l.1-.573c.298-1.53.828-2.958 1.536-4.157l.209-.34c1.177-1.83 2.789-3.053 4.615-3.16L6.897 4zm-.033 2.615l-.201.01c-.83.083-1.606.673-2.252 1.577l-.138.199-.01.018c-.67 1.017-1.185 2.378-1.456 3.845l-.004.022a12.591 12.591 0 00-.207 2.254l.002.188c.004.18.017.36.04.54l.043.291c.092.503.257.908.486 1.208l.117.137c.303.323.698.492 1.17.492 1.1 0 1.796-.676 3.696-3.641l2.175-3.4.454-.701-.139-.198C9.11 7.3 8.084 6.616 6.864 6.616zm10.196-.552l-.176.007c-.635.048-1.223.359-1.82.933l-.196.198c-.439.462-.887 1.064-1.367 1.807l.266.398c.18.274.362.56.55.858l.293.475 1.396 2.335.695 1.114c.583.926 1.03 1.6 1.408 2.082l.213.262c.282.326.529.54.777.673l.102.05c.227.1.457.138.718.138.176.002.35-.023.518-.073.338-.104.61-.32.813-.637l.095-.163.077-.162c.194-.459.29-1.06.29-1.785l-.006-.449c-.08-2.871-.938-5.372-2.2-6.798l-.176-.189c-.67-.683-1.444-1.074-2.27-1.074z"></path></svg>';
|
|
58
|
+
|
|
59
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/mistral.svg
|
|
60
|
+
var mistral_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Mistral</title><path clip-rule="evenodd" d="M3.428 3.4h3.429v3.428h3.429v3.429h-.002 3.431V6.828h3.427V3.4h3.43v13.714H24v3.429H13.714v-3.428h-3.428v-3.429h-3.43v3.428h3.43v3.429H0v-3.429h3.428V3.4zm10.286 13.715h3.428v-3.429h-3.427v3.429z"></path></svg>';
|
|
61
|
+
|
|
62
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/moonshot.svg
|
|
63
|
+
var moonshot_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>MoonshotAI</title><path d="M1.052 16.916l9.539 2.552a21.007 21.007 0 00.06 2.033l5.956 1.593a11.997 11.997 0 01-5.586.865l-.18-.016-.044-.004-.084-.009-.094-.01a11.605 11.605 0 01-.157-.02l-.107-.014-.11-.016a11.962 11.962 0 01-.32-.051l-.042-.008-.075-.013-.107-.02-.07-.015-.093-.019-.075-.016-.095-.02-.097-.023-.094-.022-.068-.017-.088-.022-.09-.024-.095-.025-.082-.023-.109-.03-.062-.02-.084-.025-.093-.028-.105-.034-.058-.019-.08-.026-.09-.031-.066-.024a6.293 6.293 0 01-.044-.015l-.068-.025-.101-.037-.057-.022-.08-.03-.087-.035-.088-.035-.079-.032-.095-.04-.063-.028-.063-.027a5.655 5.655 0 01-.041-.018l-.066-.03-.103-.047-.052-.024-.096-.046-.062-.03-.084-.04-.086-.044-.093-.047-.052-.027-.103-.055-.057-.03-.058-.032a6.49 6.49 0 01-.046-.026l-.094-.053-.06-.034-.051-.03-.072-.041-.082-.05-.093-.056-.052-.032-.084-.053-.061-.039-.079-.05-.07-.047-.053-.035a7.785 7.785 0 01-.054-.036l-.044-.03-.044-.03a6.066 6.066 0 01-.04-.028l-.057-.04-.076-.054-.069-.05-.074-.054-.056-.042-.076-.057-.076-.059-.086-.067-.045-.035-.064-.052-.074-.06-.089-.073-.046-.039-.046-.039a7.516 7.516 0 01-.043-.037l-.045-.04-.061-.053-.07-.062-.068-.06-.062-.058-.067-.062-.053-.05-.088-.084a13.28 13.28 0 01-.099-.097l-.029-.028-.041-.042-.069-.07-.05-.051-.05-.053a6.457 6.457 0 01-.168-.179l-.08-.088-.062-.07-.071-.08-.042-.049-.053-.062-.058-.068-.046-.056a7.175 7.175 0 01-.027-.033l-.045-.055-.066-.082-.041-.052-.05-.064-.02-.025a11.99 11.99 0 01-1.44-2.402zm-1.02-5.794l11.353 3.037a20.468 20.468 0 00-.469 2.011l10.817 2.894a12.076 12.076 0 01-1.845 2.005L.657 15.923l-.016-.046-.035-.104a11.965 11.965 0 01-.05-.153l-.007-.023a11.896 11.896 0 01-.207-.741l-.03-.126-.018-.08-.021-.097-.018-.081-.018-.09-.017-.084-.018-.094c-.026-.141-.05-.283-.071-.426l-.017-.118-.011-.083-.013-.102a12.01 12.01 0 01-.019-.161l-.005-.047a12.12 12.12 0 01-.034-2.145zm1.593-5.15l11.948 3.196c-.368.605-.705 1.231-1.01 1.875l11.295 3.022c-.142.82-.368 1.612-.668 2.365l-11.55-3.09L.124 10.26l.015-.1.008-.049.01-.067.015-.087.018-.098c.026-.148.056-.295.088-.442l.028-.124.02-.085.024-.097c.022-.09.045-.18.07-.268l.028-.102.023-.083.03-.1.025-.082.03-.096.026-.082.031-.095a11.896 11.896 0 011.01-2.232zm4.442-4.4L17.352 4.59a20.77 20.77 0 00-1.688 1.721l7.823 2.093c.267.852.442 1.744.513 2.665L2.106 5.213l.045-.065.027-.04.04-.055.046-.065.055-.076.054-.072.064-.086.05-.065.057-.073.055-.07.06-.074.055-.069.065-.077.054-.066.066-.077.053-.06.072-.082.053-.06.067-.074.054-.058.073-.078.058-.06.063-.067.168-.17.1-.098.059-.056.076-.071a12.084 12.084 0 012.272-1.677zM12.017 0h.097l.082.001.069.001.054.002.068.002.046.001.076.003.047.002.06.003.054.002.087.005.105.007.144.011.088.007.044.004.077.008.082.008.047.005.102.012.05.006.108.014.081.01.042.006.065.01.207.032.07.012.065.011.14.026.092.018.11.022.046.01.075.016.041.01L14.7.3l.042.01.065.015.049.012.071.017.096.024.112.03.113.03.113.032.05.015.07.02.078.024.073.023.05.016.05.016.076.025.099.033.102.036.048.017.064.023.093.034.11.041.116.045.1.04.047.02.06.024.041.018.063.026.04.018.057.025.11.048.1.046.074.035.075.036.06.028.092.046.091.045.102.052.053.028.049.026.046.024.06.033.041.022.052.029.088.05.106.06.087.051.057.034.053.032.096.059.088.055.098.062.036.024.064.041.084.056.04.027.062.042.062.043.023.017c.054.037.108.075.161.114l.083.06.065.048.056.043.086.065.082.064.04.03.05.041.086.069.079.065.085.071c.712.6 1.353 1.283 1.909 2.031L7.222.994l.062-.027.065-.028.081-.034.086-.035c.113-.045.227-.09.341-.131l.096-.035.093-.033.084-.03.096-.031c.087-.03.176-.058.264-.085l.091-.027.086-.025.102-.03.085-.023.1-.026L9.04.37l.09-.023.091-.022.095-.022.09-.02.098-.021.091-.02.095-.018.092-.018.1-.018.091-.016.098-.017.092-.014.097-.015.092-.013.102-.013.091-.012.105-.012.09-.01.105-.01c.093-.01.186-.018.28-.024l.106-.008.09-.005.11-.006.093-.004.1-.004.097-.002.099-.002.197-.002z"></path></svg>';
|
|
64
|
+
|
|
65
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/openai.svg
|
|
66
|
+
var openai_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>OpenAI</title><path d="M9.205 8.658v-2.26c0-.19.072-.333.238-.428l4.543-2.616c.619-.357 1.356-.523 2.117-.523 2.854 0 4.662 2.212 4.662 4.566 0 .167 0 .357-.024.547l-4.71-2.759a.797.797 0 00-.856 0l-5.97 3.473zm10.609 8.8V12.06c0-.333-.143-.57-.429-.737l-5.97-3.473 1.95-1.118a.433.433 0 01.476 0l4.543 2.617c1.309.76 2.189 2.378 2.189 3.948 0 1.808-1.07 3.473-2.76 4.163zM7.802 12.703l-1.95-1.142c-.167-.095-.239-.238-.239-.428V5.899c0-2.545 1.95-4.472 4.591-4.472 1 0 1.927.333 2.712.928L8.23 5.067c-.285.166-.428.404-.428.737v6.898zM12 15.128l-2.795-1.57v-3.33L12 8.658l2.795 1.57v3.33L12 15.128zm1.796 7.23c-1 0-1.927-.332-2.712-.927l4.686-2.712c.285-.166.428-.404.428-.737v-6.898l1.974 1.142c.167.095.238.238.238.428v5.233c0 2.545-1.974 4.472-4.614 4.472zm-5.637-5.303l-4.544-2.617c-1.308-.761-2.188-2.378-2.188-3.948A4.482 4.482 0 014.21 6.327v5.423c0 .333.143.571.428.738l5.947 3.449-1.95 1.118a.432.432 0 01-.476 0zm-.262 3.9c-2.688 0-4.662-2.021-4.662-4.519 0-.19.024-.38.047-.57l4.686 2.71c.286.167.571.167.856 0l5.97-3.448v2.26c0 .19-.07.333-.237.428l-4.543 2.616c-.619.357-1.356.523-2.117.523zm5.899 2.83a5.947 5.947 0 005.827-4.756C22.287 18.339 24 15.84 24 13.296c0-1.665-.713-3.282-1.998-4.448.119-.5.19-.999.19-1.498 0-3.401-2.759-5.947-5.946-5.947-.642 0-1.26.095-1.88.31A5.962 5.962 0 0010.205 0a5.947 5.947 0 00-5.827 4.757C1.713 5.447 0 7.945 0 10.49c0 1.666.713 3.283 1.998 4.448-.119.5-.19 1-.19 1.499 0 3.401 2.759 5.946 5.946 5.946.642 0 1.26-.095 1.88-.309a5.96 5.96 0 004.162 1.713z"></path></svg>';
|
|
67
|
+
|
|
68
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/openrouter.svg
|
|
69
|
+
var openrouter_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>OpenRouter</title><path d="M16.804 1.957l7.22 4.105v.087L16.73 10.21l.017-2.117-.821-.03c-1.059-.028-1.611.002-2.268.11-1.064.175-2.038.577-3.147 1.352L8.345 11.03c-.284.195-.495.336-.68.455l-.515.322-.397.234.385.23.53.338c.476.314 1.17.796 2.701 1.866 1.11.775 2.083 1.177 3.147 1.352l.3.045c.694.091 1.375.094 2.825.033l.022-2.159 7.22 4.105v.087L16.589 22l.014-1.862-.635.022c-1.386.042-2.137.002-3.138-.162-1.694-.28-3.26-.926-4.881-2.059l-2.158-1.5a21.997 21.997 0 00-.755-.498l-.467-.28a55.927 55.927 0 00-.76-.43C2.908 14.73.563 14.116 0 14.116V9.888l.14.004c.564-.007 2.91-.622 3.809-1.124l1.016-.58.438-.274c.428-.28 1.072-.726 2.686-1.853 1.621-1.133 3.186-1.78 4.881-2.059 1.152-.19 1.974-.213 3.814-.138l.02-1.907z"></path></svg>';
|
|
70
|
+
|
|
71
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/perplexity.svg
|
|
72
|
+
var perplexity_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Perplexity</title><path d="M19.785 0v7.272H22.5V17.62h-2.935V24l-7.037-6.194v6.145h-1.091v-6.152L4.392 24v-6.465H1.5V7.188h2.884V0l7.053 6.494V.19h1.09v6.49L19.786 0zm-7.257 9.044v7.319l5.946 5.234V14.44l-5.946-5.397zm-1.099-.08l-5.946 5.398v7.235l5.946-5.234V8.965zm8.136 7.58h1.844V8.349H13.46l6.105 5.54v2.655zm-8.982-8.28H2.59v8.195h1.8v-2.576l6.192-5.62zM5.475 2.476v4.71h5.115l-5.115-4.71zm13.219 0l-5.115 4.71h5.115v-4.71z"></path></svg>';
|
|
73
|
+
|
|
74
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/pika.svg
|
|
75
|
+
var pika_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Pika</title><path d="M.661 19.889h8.666c-.14-1.41-1.145-2.955-3.601-4.007v-.104c2.863.88 3.893 2.386 4.312 4.11H20.73l-1.72-1.476C20.017 15.244 24 13.747 24 13.747c-.141-2.541-1.441-4.909-5.787-6.827L8.326 3c.331 4.179 1.811 6.575 5.523 7.163v.102c-2.579-.064-4.368-1.216-5.275-3.588C.698 8.123-1.201 14.156.66 19.889z"></path></svg>';
|
|
76
|
+
|
|
77
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/replicate.svg
|
|
78
|
+
var replicate_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Replicate</title><path d="M22 10.552v2.26h-7.932V22H11.54V10.552H22zM22 2v2.264H4.528V22H2V2h20zm0 4.276V8.54H9.296V22H6.768V6.276H22z"></path></svg>';
|
|
79
|
+
|
|
80
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/runway.svg
|
|
81
|
+
var runway_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Runway</title><path d="M17.86 22.992c-2.669.245-4.887-2.876-6.597-4.454C10.398 24.759 1 24.177 1 17.86V6.15c0-.921.244-1.861.733-2.65C2.635 1.977 4.383.98 6.15 1h11.71c6.316 0 6.918 9.398.677 10.243l2.97 2.951c3.252 3.064.808 8.929-3.646 8.797zm-1.428-3.721c1.842 1.898 4.774-1.034 2.876-2.876l-5.132-5.132H11.3v2.876l4.436 4.436.696.696zM4.12 17.842c-.037 2.632 4.117 2.632 4.06 0V6.132c.038-1.316-1.353-2.35-2.612-1.955-.057.019-.113.037-.15.056-.79.301-1.335 1.09-1.317 1.936v11.673h.02zm13.74-9.68c2.632.037 2.632-4.098 0-4.06h-6.973c.526 1.109.395 2.857.413 4.06h6.56z"></path></svg>';
|
|
82
|
+
|
|
83
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/stability.svg
|
|
84
|
+
var stability_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Stability</title><path d="M7.223 21c4.252 0 7.018-2.22 7.018-5.56 0-2.59-1.682-4.236-4.69-4.918l-1.93-.571c-1.694-.375-2.683-.825-2.45-1.975.194-.957.773-1.497 2.122-1.497 4.285 0 5.873 1.497 5.873 1.497v-3.6S11.62 3 7.293 3C3.213 3 1 5.07 1 8.273c0 2.59 1.534 4.097 4.645 4.812l.334.083c.473.144 1.112.335 1.916.572 1.59.375 1.999.773 1.999 1.966 0 1.09-1.15 1.71-2.67 1.71C2.841 17.416 1 15.231 1 15.231v3.989S2.152 21 7.223 21z"></path><path d="M20.374 20.73c1.505 0 2.626-1.073 2.626-2.526 0-1.484-1.089-2.526-2.626-2.526-1.505 0-2.594 1.042-2.594 2.526 0 1.484 1.089 2.526 2.594 2.526z"></path></svg>';
|
|
85
|
+
|
|
86
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/together.svg
|
|
87
|
+
var together_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>together.ai</title><path d="M23.197 4.503A6 6 0 0015 2.307a5.973 5.973 0 00-2.995 4.933l5.996.008v.515h-5.996c.039.937.298 1.87.8 2.74a6 6 0 1010.39-6z"></path><path d="M.805 4.5A6 6 0 003 12.697a5.972 5.972 0 005.77.127L5.779 7.627l.446-.257 2.997 5.192A6 6 0 10.804 4.5z"></path><path d="M12 23.894a6 6 0 005.999-6c0-2.13-1.1-3.996-2.775-5.06l-3.005 5.189-.444-.258 2.997-5.192A6 6 0 1012 23.894z"></path></svg>';
|
|
88
|
+
|
|
89
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/vertexai.svg
|
|
90
|
+
var vertexai_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>VertexAI</title><path d="M11.995 20.216a1.892 1.892 0 100 3.785 1.892 1.892 0 000-3.785zm0 2.806a.927.927 0 11.927-.914.914.914 0 01-.927.914z"></path><path clip-rule="evenodd" d="M21.687 14.144c.237.038.452.16.605.344a.978.978 0 01-.18 1.3l-8.24 6.082a1.892 1.892 0 00-1.147-1.508l8.28-6.08a.991.991 0 01.682-.138z"></path><path clip-rule="evenodd" d="M10.122 21.842l-8.217-6.066a.952.952 0 01-.206-1.287.978.978 0 011.287-.206l8.28 6.08a1.893 1.893 0 00-1.144 1.479z"></path><path d="M4.273 4.475a.978.978 0 01-.965-.965V1.09a.978.978 0 111.943 0v2.42a.978.978 0 01-.978.965zM4.247 13.034a.978.978 0 100-1.956.978.978 0 000 1.956zM4.247 10.19a.978.978 0 100-1.956.978.978 0 000 1.956zM4.247 7.332a.978.978 0 100-1.956.978.978 0 000 1.956z"></path><path d="M19.718 7.307a.978.978 0 01-.965-.979v-2.42a.965.965 0 011.93 0v2.42a.964.964 0 01-.965.979zM19.743 13.047a.978.978 0 100-1.956.978.978 0 000 1.956zM19.743 10.151a.978.978 0 100-1.956.978.978 0 000 1.956zM19.743 2.068a.978.978 0 100-1.956.978.978 0 000 1.956z"></path><path d="M11.995 15.917a.978.978 0 01-.965-.965v-2.459a.978.978 0 011.943 0v2.433a.976.976 0 01-.978.991zM11.995 18.762a.978.978 0 100-1.956.978.978 0 000 1.956zM11.995 10.64a.978.978 0 100-1.956.978.978 0 000 1.956zM11.995 7.783a.978.978 0 100-1.956.978.978 0 000 1.956z"></path><path d="M15.856 10.177a.978.978 0 01-.965-.965v-2.42a.977.977 0 011.702-.763.979.979 0 01.241.763v2.42a.978.978 0 01-.978.965zM15.869 4.913a.978.978 0 100-1.956.978.978 0 000 1.956zM15.869 15.853a.978.978 0 100-1.956.978.978 0 000 1.956zM15.869 12.996a.978.978 0 100-1.956.978.978 0 000 1.956z"></path><path d="M8.121 15.853a.978.978 0 100-1.956.978.978 0 000 1.956zM8.121 7.783a.978.978 0 100-1.956.978.978 0 000 1.956zM8.121 4.913a.978.978 0 100-1.957.978.978 0 000 1.957zM8.134 12.996a.978.978 0 01-.978-.94V9.611a.965.965 0 011.93 0v2.445a.966.966 0 01-.952.94z"></path></svg>';
|
|
91
|
+
|
|
92
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/xai.svg
|
|
93
|
+
var xai_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Grok</title><path d="M6.469 8.776L16.512 23h-4.464L2.005 8.776H6.47zm-.004 7.9l2.233 3.164L6.467 23H2l4.465-6.324zM22 2.582V23h-3.659V7.764L22 2.582zM22 1l-9.952 14.095-2.233-3.163L17.533 1H22z"></path></svg>';
|
|
94
|
+
|
|
95
|
+
// node_modules/.pnpm/@lobehub+icons-static-svg@1.90.0/node_modules/@lobehub/icons-static-svg/icons/zai.svg
|
|
96
|
+
var zai_default = 'data:image/svg+xml,<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Z.ai</title><path d="M12.105 2L9.927 4.953H.653L2.83 2h9.276zM23.254 19.048L21.078 22h-9.242l2.174-2.952h9.244zM24 2L9.264 22H0L14.736 2H24z"></path></svg>';
|
|
97
|
+
|
|
98
|
+
// src/dashboard/model-picker.tsx
|
|
99
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
100
|
+
function canonicalModelId(model) {
|
|
101
|
+
const id = model.id;
|
|
102
|
+
if (id.includes("/")) return id;
|
|
103
|
+
const provider = model._provider ?? model.provider;
|
|
104
|
+
return provider ? `${provider}/${id}` : id;
|
|
105
|
+
}
|
|
106
|
+
function formatPricing(pricing) {
|
|
107
|
+
const prompt = Number(pricing?.prompt ?? 0);
|
|
108
|
+
const completion = Number(pricing?.completion ?? 0);
|
|
109
|
+
if (!prompt && !completion) return null;
|
|
110
|
+
const fmt = (n) => {
|
|
111
|
+
const perM = n * 1e6;
|
|
112
|
+
if (perM === 0) return "0";
|
|
113
|
+
if (perM >= 1) return `$${perM.toFixed(2)}`;
|
|
114
|
+
return `$${perM.toFixed(2)}`;
|
|
115
|
+
};
|
|
116
|
+
return `${fmt(prompt)} / ${fmt(completion)} per 1M`;
|
|
117
|
+
}
|
|
118
|
+
function formatContext(ctx) {
|
|
119
|
+
if (!ctx) return null;
|
|
120
|
+
if (ctx >= 1e6) return `${(ctx / 1e6).toFixed(1)}M ctx`;
|
|
121
|
+
if (ctx >= 1e3) return `${Math.round(ctx / 1e3)}k ctx`;
|
|
122
|
+
return `${ctx} ctx`;
|
|
123
|
+
}
|
|
124
|
+
function resolveModelBrandIdentity(model) {
|
|
125
|
+
const canonical = canonicalModelId(model);
|
|
126
|
+
const hostKey = normalizeBrandKey(model.logos?.host ?? model.hostProvider ?? model._provider ?? model.provider ?? firstIdSegment(canonical));
|
|
127
|
+
const labKey = normalizeBrandKey(model.logos?.lab ?? model.modelLab ?? inferModelLab(model, canonical, hostKey));
|
|
128
|
+
const hostBase = brandInfo(hostKey);
|
|
129
|
+
const labBase = brandInfo(labKey);
|
|
130
|
+
const host = { ...hostBase, logoUrl: model.logos?.hostUrl ?? hostBase.logoUrl };
|
|
131
|
+
const lab = { ...labBase, logoUrl: model.logos?.labUrl ?? labBase.logoUrl };
|
|
132
|
+
return {
|
|
133
|
+
host,
|
|
134
|
+
lab,
|
|
135
|
+
combined: host.key === lab.key
|
|
136
|
+
};
|
|
137
|
+
}
|
|
138
|
+
var PRIORITY_MODEL_GROUPS = ["anthropic", "openai", "google", "deepseek", "zai", "moonshot"];
|
|
139
|
+
function modelGroupKey(model) {
|
|
140
|
+
const identity = resolveModelBrandIdentity(model);
|
|
141
|
+
if (identity.lab.key !== "unknown") return identity.lab.key;
|
|
142
|
+
if (identity.host.key !== "unknown") return identity.host.key;
|
|
143
|
+
return (model._provider ?? model.provider ?? "other").toLowerCase();
|
|
144
|
+
}
|
|
145
|
+
function modelGroupLabel(key) {
|
|
146
|
+
if (key === "moonshot") return "Kimi";
|
|
147
|
+
const brand = brandInfo(normalizeBrandKey(key));
|
|
148
|
+
return brand.key === "unknown" ? key : brand.label;
|
|
149
|
+
}
|
|
150
|
+
function modelGroupRank(key) {
|
|
151
|
+
const priorityIndex = PRIORITY_MODEL_GROUPS.indexOf(normalizeBrandKey(key));
|
|
152
|
+
return priorityIndex === -1 ? Number.POSITIVE_INFINITY : priorityIndex;
|
|
153
|
+
}
|
|
154
|
+
function compareModelGroups(a, b) {
|
|
155
|
+
const aRank = modelGroupRank(a);
|
|
156
|
+
const bRank = modelGroupRank(b);
|
|
157
|
+
if (aRank !== bRank) return aRank - bRank;
|
|
158
|
+
return modelGroupLabel(a).localeCompare(modelGroupLabel(b));
|
|
159
|
+
}
|
|
160
|
+
function compareModelsByDisplayName(a, b) {
|
|
161
|
+
return (a.name ?? a.id).localeCompare(b.name ?? b.id);
|
|
162
|
+
}
|
|
163
|
+
function ModelPicker({
|
|
164
|
+
value,
|
|
165
|
+
onChange,
|
|
166
|
+
models,
|
|
167
|
+
loading = false,
|
|
168
|
+
recents,
|
|
169
|
+
popular,
|
|
170
|
+
excludeProviders,
|
|
171
|
+
modalities,
|
|
172
|
+
variant = "field",
|
|
173
|
+
label = "Model",
|
|
174
|
+
placeholder = "Choose a model",
|
|
175
|
+
className,
|
|
176
|
+
triggerClassName,
|
|
177
|
+
disabled
|
|
178
|
+
}) {
|
|
179
|
+
const [query, setQuery] = React.useState("");
|
|
180
|
+
const [open, setOpen] = React.useState(false);
|
|
181
|
+
const searchInputRef = React.useRef(null);
|
|
182
|
+
React.useLayoutEffect(() => {
|
|
183
|
+
if (!open) return;
|
|
184
|
+
const frame = requestAnimationFrame(() => {
|
|
185
|
+
searchInputRef.current?.focus();
|
|
186
|
+
searchInputRef.current?.select();
|
|
187
|
+
});
|
|
188
|
+
return () => cancelAnimationFrame(frame);
|
|
189
|
+
}, [open]);
|
|
190
|
+
const filtered = React.useMemo(() => {
|
|
191
|
+
const excluded = new Set((excludeProviders ?? []).map((p) => p.toLowerCase()));
|
|
192
|
+
const allowedModalities = modalities ? new Set(modalities) : null;
|
|
193
|
+
const q = query.trim().toLowerCase();
|
|
194
|
+
return models.filter((m) => {
|
|
195
|
+
const provider = (m._provider ?? m.provider ?? "").toLowerCase();
|
|
196
|
+
if (excluded.has(provider)) return false;
|
|
197
|
+
if (allowedModalities && m.architecture?.modality && !allowedModalities.has(m.architecture.modality)) return false;
|
|
198
|
+
if (!q) return true;
|
|
199
|
+
const id = canonicalModelId(m).toLowerCase();
|
|
200
|
+
const name = (m.name ?? "").toLowerCase();
|
|
201
|
+
const identity = resolveModelBrandIdentity(m);
|
|
202
|
+
return id.includes(q) || name.includes(q) || provider.includes(q) || identity.host.label.toLowerCase().includes(q) || identity.lab.label.toLowerCase().includes(q);
|
|
203
|
+
});
|
|
204
|
+
}, [models, query, modalities, excludeProviders]);
|
|
205
|
+
const grouped = React.useMemo(() => {
|
|
206
|
+
const groups = /* @__PURE__ */ new Map();
|
|
207
|
+
for (const m of filtered) {
|
|
208
|
+
const key = modelGroupKey(m);
|
|
209
|
+
const list = groups.get(key);
|
|
210
|
+
if (list) list.push(m);
|
|
211
|
+
else groups.set(key, [m]);
|
|
212
|
+
}
|
|
213
|
+
return Array.from(groups.entries()).map(([key, list]) => [key, [...list].sort(compareModelsByDisplayName)]).sort(([a], [b]) => compareModelGroups(a, b));
|
|
214
|
+
}, [filtered]);
|
|
215
|
+
const current = React.useMemo(
|
|
216
|
+
() => models.find((m) => canonicalModelId(m) === value),
|
|
217
|
+
[models, value]
|
|
218
|
+
);
|
|
219
|
+
const currentLabel = current?.name ?? current?.id ?? value;
|
|
220
|
+
const currentIdentity = current ? resolveModelBrandIdentity(current) : null;
|
|
221
|
+
const recentIds = React.useMemo(() => {
|
|
222
|
+
if (!recents?.length) return [];
|
|
223
|
+
const lookup = new Map(models.map((m) => [canonicalModelId(m), m]));
|
|
224
|
+
return recents.map((id) => lookup.get(id)).filter((m) => Boolean(m)).slice(0, 4);
|
|
225
|
+
}, [recents, models]);
|
|
226
|
+
const popularModels = React.useMemo(() => {
|
|
227
|
+
if (!popular?.length) return [];
|
|
228
|
+
const lookup = new Map(models.map((m) => [canonicalModelId(m), m]));
|
|
229
|
+
return popular.map((id) => lookup.get(id)).filter((m) => Boolean(m));
|
|
230
|
+
}, [popular, models]);
|
|
231
|
+
const handleSelect = (id) => {
|
|
232
|
+
onChange(id);
|
|
233
|
+
setOpen(false);
|
|
234
|
+
setQuery("");
|
|
235
|
+
};
|
|
236
|
+
const triggerLabel = label ? `${label}: ${currentLabel || placeholder}` : currentLabel || placeholder;
|
|
237
|
+
const trigger = variant === "pill" ? /* @__PURE__ */ jsxs(
|
|
238
|
+
"button",
|
|
239
|
+
{
|
|
240
|
+
type: "button",
|
|
241
|
+
"aria-label": triggerLabel,
|
|
242
|
+
disabled,
|
|
243
|
+
className: cn(
|
|
244
|
+
"inline-flex items-center gap-1.5 rounded-full border border-border bg-card",
|
|
245
|
+
"px-2.5 py-1 text-xs font-medium text-foreground",
|
|
246
|
+
"transition-colors duration-[var(--transition-fast)]",
|
|
247
|
+
"hover:border-primary/30 hover:bg-accent/30",
|
|
248
|
+
"focus:outline-none focus:border-primary/40",
|
|
249
|
+
"data-[state=open]:border-primary/40 data-[state=open]:bg-accent/30",
|
|
250
|
+
"disabled:opacity-50 disabled:cursor-not-allowed",
|
|
251
|
+
className,
|
|
252
|
+
triggerClassName
|
|
253
|
+
),
|
|
254
|
+
children: [
|
|
255
|
+
currentIdentity ? /* @__PURE__ */ jsx(ModelBrandStack, { identity: currentIdentity, size: "sm" }) : /* @__PURE__ */ jsx(Sparkles, { className: "h-3 w-3 text-muted-foreground" }),
|
|
256
|
+
/* @__PURE__ */ jsx("span", { className: "truncate max-w-[160px]", children: currentLabel || placeholder }),
|
|
257
|
+
/* @__PURE__ */ jsx(ChevronDown, { className: "h-3 w-3 text-muted-foreground transition-transform data-[state=open]:rotate-180" })
|
|
258
|
+
]
|
|
259
|
+
}
|
|
260
|
+
) : /* @__PURE__ */ jsxs(
|
|
261
|
+
"button",
|
|
262
|
+
{
|
|
263
|
+
type: "button",
|
|
264
|
+
"aria-label": triggerLabel,
|
|
265
|
+
disabled,
|
|
266
|
+
className: cn(
|
|
267
|
+
"flex w-full items-center justify-between gap-2 rounded-[var(--radius-md)]",
|
|
268
|
+
"border border-border bg-card px-3 py-2.5 text-sm text-left",
|
|
269
|
+
"transition-colors duration-[var(--transition-fast)]",
|
|
270
|
+
"hover:border-primary/20 hover:bg-accent/30",
|
|
271
|
+
"focus:outline-none focus:border-primary/30",
|
|
272
|
+
"data-[state=open]:border-primary/30 data-[state=open]:bg-accent/30",
|
|
273
|
+
"disabled:opacity-50 disabled:cursor-not-allowed",
|
|
274
|
+
className,
|
|
275
|
+
triggerClassName
|
|
276
|
+
),
|
|
277
|
+
children: [
|
|
278
|
+
/* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-2", children: [
|
|
279
|
+
currentIdentity && /* @__PURE__ */ jsx(ModelBrandStack, { identity: currentIdentity, size: "sm" }),
|
|
280
|
+
/* @__PURE__ */ jsx("span", { className: cn("truncate", current ? "text-foreground font-medium" : "text-muted-foreground"), children: currentLabel || placeholder })
|
|
281
|
+
] }),
|
|
282
|
+
/* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 shrink-0 text-muted-foreground transition-transform data-[state=open]:rotate-180" })
|
|
283
|
+
]
|
|
284
|
+
}
|
|
285
|
+
);
|
|
286
|
+
return /* @__PURE__ */ jsxs("div", { className: cn(variant === "field" ? "space-y-1.5" : "inline-flex", variant === "field" ? className : void 0), children: [
|
|
287
|
+
variant === "field" && label && /* @__PURE__ */ jsx("label", { className: "block text-xs font-medium text-muted-foreground uppercase tracking-[0.06em]", children: label }),
|
|
288
|
+
/* @__PURE__ */ jsxs(Popover.Root, { open, onOpenChange: setOpen, modal: false, children: [
|
|
289
|
+
/* @__PURE__ */ jsx(Popover.Trigger, { asChild: true, children: trigger }),
|
|
290
|
+
/* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsxs(
|
|
291
|
+
Popover.Content,
|
|
292
|
+
{
|
|
293
|
+
sideOffset: 4,
|
|
294
|
+
align: variant === "pill" ? "start" : "start",
|
|
295
|
+
className: cn(
|
|
296
|
+
"z-50 w-[var(--radix-dropdown-menu-trigger-width)] min-w-[320px] max-w-[460px]",
|
|
297
|
+
"max-h-[440px] overflow-hidden flex flex-col",
|
|
298
|
+
"rounded-[var(--radius-md)] border border-border bg-card shadow-[var(--shadow-dropdown)]",
|
|
299
|
+
"data-[state=open]:animate-in data-[state=closed]:animate-out",
|
|
300
|
+
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
|
|
301
|
+
"data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95"
|
|
302
|
+
),
|
|
303
|
+
children: [
|
|
304
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-b border-border bg-background/80 px-3 py-2", children: [
|
|
305
|
+
/* @__PURE__ */ jsx(Search, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
|
|
306
|
+
/* @__PURE__ */ jsx(
|
|
307
|
+
"input",
|
|
308
|
+
{
|
|
309
|
+
ref: searchInputRef,
|
|
310
|
+
type: "text",
|
|
311
|
+
value: query,
|
|
312
|
+
onChange: (e) => setQuery(e.target.value),
|
|
313
|
+
onKeyDown: (e) => {
|
|
314
|
+
if (e.key.length === 1) e.stopPropagation();
|
|
315
|
+
},
|
|
316
|
+
placeholder: "Search models...",
|
|
317
|
+
autoFocus: true,
|
|
318
|
+
className: "flex-1 bg-transparent text-sm font-medium outline-none placeholder:font-normal placeholder:text-muted-foreground"
|
|
319
|
+
}
|
|
320
|
+
),
|
|
321
|
+
loading && /* @__PURE__ */ jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin text-muted-foreground" })
|
|
322
|
+
] }),
|
|
323
|
+
/* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto", children: [
|
|
324
|
+
!query && popularModels.length > 0 && /* @__PURE__ */ jsx(Section, { label: "Top models", tone: "featured", children: popularModels.map((m) => /* @__PURE__ */ jsx(
|
|
325
|
+
ModelRow,
|
|
326
|
+
{
|
|
327
|
+
model: m,
|
|
328
|
+
active: canonicalModelId(m) === value,
|
|
329
|
+
onSelect: handleSelect,
|
|
330
|
+
featured: true
|
|
331
|
+
},
|
|
332
|
+
`popular-${canonicalModelId(m)}`
|
|
333
|
+
)) }),
|
|
334
|
+
!query && recentIds.length > 0 && /* @__PURE__ */ jsx(Section, { label: "Recent", children: recentIds.map((m) => /* @__PURE__ */ jsx(
|
|
335
|
+
ModelRow,
|
|
336
|
+
{
|
|
337
|
+
model: m,
|
|
338
|
+
active: canonicalModelId(m) === value,
|
|
339
|
+
onSelect: handleSelect
|
|
340
|
+
},
|
|
341
|
+
`recent-${canonicalModelId(m)}`
|
|
342
|
+
)) }),
|
|
343
|
+
grouped.length === 0 ? /* @__PURE__ */ jsx("div", { className: "px-3 py-8 text-center text-xs text-muted-foreground", children: loading ? "Loading models..." : query ? "No models match." : "No models available." }) : grouped.map(([groupKey, list]) => /* @__PURE__ */ jsx(Section, { label: modelGroupLabel(groupKey), children: list.map((m) => /* @__PURE__ */ jsx(
|
|
344
|
+
ModelRow,
|
|
345
|
+
{
|
|
346
|
+
model: m,
|
|
347
|
+
active: canonicalModelId(m) === value,
|
|
348
|
+
onSelect: handleSelect
|
|
349
|
+
},
|
|
350
|
+
canonicalModelId(m)
|
|
351
|
+
)) }, groupKey))
|
|
352
|
+
] }),
|
|
353
|
+
/* @__PURE__ */ jsxs("div", { className: "border-t border-border px-3 py-1.5 text-[10px] text-muted-foreground", children: [
|
|
354
|
+
filtered.length,
|
|
355
|
+
" of ",
|
|
356
|
+
models.length,
|
|
357
|
+
" model",
|
|
358
|
+
models.length === 1 ? "" : "s"
|
|
359
|
+
] })
|
|
360
|
+
]
|
|
361
|
+
}
|
|
362
|
+
) })
|
|
363
|
+
] })
|
|
364
|
+
] });
|
|
365
|
+
}
|
|
366
|
+
function Section({ label, children, tone }) {
|
|
367
|
+
const identity = brandInfo(normalizeBrandKey(label));
|
|
368
|
+
return /* @__PURE__ */ jsxs("div", { className: "py-1", children: [
|
|
369
|
+
/* @__PURE__ */ jsxs(
|
|
370
|
+
"div",
|
|
371
|
+
{
|
|
372
|
+
className: cn(
|
|
373
|
+
"flex items-center gap-1.5 px-3 pt-1.5 pb-0.5 text-[10px] font-mono uppercase tracking-widest",
|
|
374
|
+
tone === "featured" ? "text-primary" : "text-muted-foreground"
|
|
375
|
+
),
|
|
376
|
+
children: [
|
|
377
|
+
identity.key !== "unknown" && /* @__PURE__ */ jsx(BrandLogo, { brand: identity, size: "xs" }),
|
|
378
|
+
/* @__PURE__ */ jsx("span", { children: label })
|
|
379
|
+
]
|
|
380
|
+
}
|
|
381
|
+
),
|
|
382
|
+
/* @__PURE__ */ jsx("div", { children })
|
|
383
|
+
] });
|
|
384
|
+
}
|
|
385
|
+
function PickerItem({
|
|
386
|
+
onSelect,
|
|
387
|
+
active,
|
|
388
|
+
featured,
|
|
389
|
+
children
|
|
390
|
+
}) {
|
|
391
|
+
return /* @__PURE__ */ jsx(
|
|
392
|
+
Popover.Item,
|
|
393
|
+
{
|
|
394
|
+
onSelect: (e) => {
|
|
395
|
+
e.preventDefault();
|
|
396
|
+
onSelect();
|
|
397
|
+
},
|
|
398
|
+
className: cn(
|
|
399
|
+
"flex cursor-pointer items-start gap-2 px-3 py-2 outline-none",
|
|
400
|
+
"transition-colors duration-[var(--transition-fast)]",
|
|
401
|
+
"hover:bg-accent/40 focus:bg-accent/40",
|
|
402
|
+
featured && "mx-1 rounded-lg border border-primary/10 bg-primary/[0.035] px-2.5",
|
|
403
|
+
active && "bg-[var(--accent-surface-soft)] text-[var(--accent-text)]"
|
|
404
|
+
),
|
|
405
|
+
children
|
|
406
|
+
}
|
|
407
|
+
);
|
|
408
|
+
}
|
|
409
|
+
function ModelRow({
|
|
410
|
+
model,
|
|
411
|
+
active,
|
|
412
|
+
onSelect,
|
|
413
|
+
featured
|
|
414
|
+
}) {
|
|
415
|
+
const id = canonicalModelId(model);
|
|
416
|
+
const pricing = formatPricing(model.pricing);
|
|
417
|
+
const ctx = formatContext(model.context_length);
|
|
418
|
+
const identity = resolveModelBrandIdentity(model);
|
|
419
|
+
return /* @__PURE__ */ jsxs(PickerItem, { onSelect: () => onSelect(id), active, featured, children: [
|
|
420
|
+
/* @__PURE__ */ jsx(ModelBrandStack, { identity, size: "md" }),
|
|
421
|
+
/* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
|
|
422
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-baseline justify-between gap-2", children: [
|
|
423
|
+
/* @__PURE__ */ jsx("span", { className: "text-sm font-medium truncate", children: model.name ?? model.id }),
|
|
424
|
+
ctx && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: ctx })
|
|
425
|
+
] }),
|
|
426
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-[11px] text-muted-foreground", children: [
|
|
427
|
+
/* @__PURE__ */ jsx("span", { className: "truncate", children: id }),
|
|
428
|
+
!identity.combined && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
429
|
+
/* @__PURE__ */ jsx("span", { className: "shrink-0", children: "\xB7" }),
|
|
430
|
+
/* @__PURE__ */ jsxs("span", { className: "shrink-0", children: [
|
|
431
|
+
identity.host.label,
|
|
432
|
+
" \u2192 ",
|
|
433
|
+
identity.lab.label
|
|
434
|
+
] })
|
|
435
|
+
] }),
|
|
436
|
+
pricing && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
437
|
+
/* @__PURE__ */ jsx("span", { className: "shrink-0", children: "\xB7" }),
|
|
438
|
+
/* @__PURE__ */ jsx("span", { className: "shrink-0 font-mono", children: pricing })
|
|
439
|
+
] })
|
|
440
|
+
] })
|
|
441
|
+
] })
|
|
442
|
+
] });
|
|
443
|
+
}
|
|
444
|
+
function ModelBrandStack({ identity, size }) {
|
|
445
|
+
if (identity.combined) return /* @__PURE__ */ jsx(BrandLogo, { brand: identity.lab, size });
|
|
446
|
+
const hasHostLogo = hasRealLogo(identity.host);
|
|
447
|
+
const hasLabLogo = hasRealLogo(identity.lab);
|
|
448
|
+
if (!hasHostLogo && !hasLabLogo) return null;
|
|
449
|
+
if (!hasHostLogo) return /* @__PURE__ */ jsx(BrandLogo, { brand: identity.lab, size });
|
|
450
|
+
if (!hasLabLogo) return /* @__PURE__ */ jsx(BrandLogo, { brand: identity.host, size });
|
|
451
|
+
return /* @__PURE__ */ jsxs("div", { className: cn("relative shrink-0", size === "sm" ? "h-4 w-6" : "h-7 w-9"), "aria-label": `${identity.host.label} hosting ${identity.lab.label}`, children: [
|
|
452
|
+
/* @__PURE__ */ jsx(BrandLogo, { brand: identity.host, size: size === "sm" ? "xs" : "sm", className: "absolute left-0 top-0" }),
|
|
453
|
+
/* @__PURE__ */ jsx(BrandLogo, { brand: identity.lab, size: size === "sm" ? "xs" : "sm", className: "absolute bottom-0 right-0 ring-2 ring-card" })
|
|
454
|
+
] });
|
|
455
|
+
}
|
|
456
|
+
function BrandLogo({ brand, size, className }) {
|
|
457
|
+
if (!hasRealLogo(brand)) return null;
|
|
458
|
+
const pixelSize = size === "xs" ? 14 : size === "sm" ? 16 : 28;
|
|
459
|
+
return /* @__PURE__ */ jsx(
|
|
460
|
+
"span",
|
|
461
|
+
{
|
|
462
|
+
title: brand.label,
|
|
463
|
+
"aria-label": brand.label,
|
|
464
|
+
className: cn(
|
|
465
|
+
"inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-background shadow-sm ring-1 ring-border",
|
|
466
|
+
size === "xs" && "h-3.5 w-3.5",
|
|
467
|
+
size === "sm" && "h-4 w-4",
|
|
468
|
+
size === "md" && "h-7 w-7",
|
|
469
|
+
className
|
|
470
|
+
),
|
|
471
|
+
children: brand.logo === "tangle" ? /* @__PURE__ */ jsx(TangleKnot, { size: pixelSize, className: "h-full w-full" }) : brand.logoUrl ? /* @__PURE__ */ jsx("img", { src: brand.logoUrl, alt: "", className: "h-[72%] w-[72%] object-contain" }) : null
|
|
472
|
+
}
|
|
473
|
+
);
|
|
474
|
+
}
|
|
475
|
+
function hasRealLogo(brand) {
|
|
476
|
+
return Boolean(brand.logoUrl || brand.logo);
|
|
477
|
+
}
|
|
478
|
+
function modelLogo(path) {
|
|
479
|
+
return path;
|
|
480
|
+
}
|
|
481
|
+
function brandLogo(key) {
|
|
482
|
+
switch (key) {
|
|
483
|
+
case "ai21":
|
|
484
|
+
return modelLogo(ai21_default);
|
|
485
|
+
case "alibaba":
|
|
486
|
+
return modelLogo(alibaba_default);
|
|
487
|
+
case "anthropic":
|
|
488
|
+
return modelLogo(anthropic_default);
|
|
489
|
+
case "azure":
|
|
490
|
+
return modelLogo(azure_default);
|
|
491
|
+
case "bedrock":
|
|
492
|
+
return modelLogo(bedrock_default);
|
|
493
|
+
case "cerebras":
|
|
494
|
+
return modelLogo(cerebras_default);
|
|
495
|
+
case "cohere":
|
|
496
|
+
return modelLogo(cohere_default);
|
|
497
|
+
case "deepseek":
|
|
498
|
+
return modelLogo(deepseek_default);
|
|
499
|
+
case "elevenlabs":
|
|
500
|
+
return modelLogo(elevenlabs_default);
|
|
501
|
+
case "fal":
|
|
502
|
+
return modelLogo(fal_default);
|
|
503
|
+
case "fireworks":
|
|
504
|
+
return modelLogo(fireworks_default);
|
|
505
|
+
case "google":
|
|
506
|
+
return modelLogo(google_default);
|
|
507
|
+
case "groq":
|
|
508
|
+
return modelLogo(groq_default);
|
|
509
|
+
case "kuaishou":
|
|
510
|
+
return modelLogo(kling_default);
|
|
511
|
+
case "luma":
|
|
512
|
+
return modelLogo(luma_default);
|
|
513
|
+
case "meta":
|
|
514
|
+
return modelLogo(meta_default);
|
|
515
|
+
case "mistral":
|
|
516
|
+
return modelLogo(mistral_default);
|
|
517
|
+
case "moonshot":
|
|
518
|
+
return modelLogo(moonshot_default);
|
|
519
|
+
case "openai":
|
|
520
|
+
return modelLogo(openai_default);
|
|
521
|
+
case "openrouter":
|
|
522
|
+
return modelLogo(openrouter_default);
|
|
523
|
+
case "perplexity":
|
|
524
|
+
return modelLogo(perplexity_default);
|
|
525
|
+
case "pika":
|
|
526
|
+
return modelLogo(pika_default);
|
|
527
|
+
case "replicate":
|
|
528
|
+
return modelLogo(replicate_default);
|
|
529
|
+
case "runway":
|
|
530
|
+
return modelLogo(runway_default);
|
|
531
|
+
case "stability":
|
|
532
|
+
return modelLogo(stability_default);
|
|
533
|
+
case "together":
|
|
534
|
+
return modelLogo(together_default);
|
|
535
|
+
case "vertex":
|
|
536
|
+
return modelLogo(vertexai_default);
|
|
537
|
+
case "xai":
|
|
538
|
+
return modelLogo(xai_default);
|
|
539
|
+
case "zai":
|
|
540
|
+
return modelLogo(zai_default);
|
|
541
|
+
case "tangle":
|
|
542
|
+
case "tcloud":
|
|
543
|
+
case "cartesia":
|
|
544
|
+
case "unknown":
|
|
545
|
+
return void 0;
|
|
546
|
+
}
|
|
547
|
+
}
|
|
548
|
+
function brandMark(key) {
|
|
549
|
+
if (key === "tangle" || key === "tcloud") return { logo: "tangle" };
|
|
550
|
+
const logoUrl = brandLogo(key);
|
|
551
|
+
return logoUrl ? { logoUrl } : {};
|
|
552
|
+
}
|
|
553
|
+
function inferModelLab(model, canonical, hostKey) {
|
|
554
|
+
const name = model.name ?? "";
|
|
555
|
+
const idSegments = canonical.split("/");
|
|
556
|
+
const possibleLab = normalizeBrandKey(idSegments.length > 1 ? idSegments[1] : idSegments[0]);
|
|
557
|
+
const textKey = normalizeBrandKey(`${canonical} ${name}`);
|
|
558
|
+
if (hostKey !== possibleLab && possibleLab !== "unknown") return possibleLab;
|
|
559
|
+
if (textKey !== "unknown") return textKey;
|
|
560
|
+
return hostKey;
|
|
561
|
+
}
|
|
562
|
+
function firstIdSegment(value) {
|
|
563
|
+
return value.split("/")[0] ?? value;
|
|
564
|
+
}
|
|
565
|
+
function normalizeBrandKey(value) {
|
|
566
|
+
const normalized = (value ?? "").toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
|
|
567
|
+
if (!normalized) return "unknown";
|
|
568
|
+
if (/(^|-)anthropic($|-)|claude/.test(normalized)) return "anthropic";
|
|
569
|
+
if (/(^|-)openai($|-)|(^|-)gpt-|o[1345]($|-)|chatgpt/.test(normalized)) return "openai";
|
|
570
|
+
if (/(^|-)google($|-)|gemini|palm|imagen|veo/.test(normalized)) return "google";
|
|
571
|
+
if (/(^|-)xai($|-)|grok/.test(normalized)) return "xai";
|
|
572
|
+
if (/(^|-)meta($|-)|llama/.test(normalized)) return "meta";
|
|
573
|
+
if (/(^|-)mistral($|-)|mixtral|codestral/.test(normalized)) return "mistral";
|
|
574
|
+
if (/(^|-)cohere($|-)|command-r/.test(normalized)) return "cohere";
|
|
575
|
+
if (/(^|-)deepseek($|-)/.test(normalized)) return "deepseek";
|
|
576
|
+
if (/(^|-)moonshot($|-)|kimi/.test(normalized)) return "moonshot";
|
|
577
|
+
if (/(^|-)zai($|-)|z-ai|glm/.test(normalized)) return "zai";
|
|
578
|
+
if (/(^|-)qwen($|-)|alibaba|wan($|-)/.test(normalized)) return "alibaba";
|
|
579
|
+
if (/(^|-)perplexity($|-)|sonar/.test(normalized)) return "perplexity";
|
|
580
|
+
if (/(^|-)ai21($|-)|jamba/.test(normalized)) return "ai21";
|
|
581
|
+
if (/(^|-)runway($|-)|gen-?[34]/.test(normalized)) return "runway";
|
|
582
|
+
if (/(^|-)kling($|-)|kuaishou/.test(normalized)) return "kuaishou";
|
|
583
|
+
if (/(^|-)luma($|-)|ray-?[12]/.test(normalized)) return "luma";
|
|
584
|
+
if (/(^|-)pika($|-)/.test(normalized)) return "pika";
|
|
585
|
+
if (/(^|-)stability($|-)|stable-diffusion|sdxl/.test(normalized)) return "stability";
|
|
586
|
+
if (/(^|-)elevenlabs($|-)|eleven/.test(normalized)) return "elevenlabs";
|
|
587
|
+
if (/(^|-)cartesia($|-)|sonic/.test(normalized)) return "cartesia";
|
|
588
|
+
if (/(^|-)openrouter($|-)/.test(normalized)) return "openrouter";
|
|
589
|
+
if (/(^|-)tcloud($|-)/.test(normalized)) return "tcloud";
|
|
590
|
+
if (/(^|-)tangle($|-)/.test(normalized)) return "tangle";
|
|
591
|
+
if (/(^|-)fal($|-)/.test(normalized)) return "fal";
|
|
592
|
+
if (/(^|-)replicate($|-)/.test(normalized)) return "replicate";
|
|
593
|
+
if (/(^|-)together($|-)/.test(normalized)) return "together";
|
|
594
|
+
if (/(^|-)fireworks($|-)/.test(normalized)) return "fireworks";
|
|
595
|
+
if (/(^|-)groq($|-)/.test(normalized)) return "groq";
|
|
596
|
+
if (/(^|-)cerebras($|-)/.test(normalized)) return "cerebras";
|
|
597
|
+
if (/(^|-)bedrock($|-)|amazon/.test(normalized)) return "bedrock";
|
|
598
|
+
if (/(^|-)vertex($|-)/.test(normalized)) return "vertex";
|
|
599
|
+
if (/(^|-)azure($|-)/.test(normalized)) return "azure";
|
|
600
|
+
return "unknown";
|
|
601
|
+
}
|
|
602
|
+
function brandInfo(key) {
|
|
603
|
+
return BRAND_INFO[key] ?? BRAND_INFO.unknown;
|
|
604
|
+
}
|
|
605
|
+
var BRAND_INFO = {
|
|
606
|
+
ai21: { key: "ai21", label: "AI21", ...brandMark("ai21") },
|
|
607
|
+
alibaba: { key: "alibaba", label: "Alibaba", ...brandMark("alibaba") },
|
|
608
|
+
anthropic: { key: "anthropic", label: "Anthropic", ...brandMark("anthropic") },
|
|
609
|
+
azure: { key: "azure", label: "Azure", ...brandMark("azure") },
|
|
610
|
+
bedrock: { key: "bedrock", label: "AWS Bedrock", ...brandMark("bedrock") },
|
|
611
|
+
cartesia: { key: "cartesia", label: "Cartesia" },
|
|
612
|
+
cerebras: { key: "cerebras", label: "Cerebras", ...brandMark("cerebras") },
|
|
613
|
+
cohere: { key: "cohere", label: "Cohere", ...brandMark("cohere") },
|
|
614
|
+
deepseek: { key: "deepseek", label: "DeepSeek", ...brandMark("deepseek") },
|
|
615
|
+
elevenlabs: { key: "elevenlabs", label: "ElevenLabs", ...brandMark("elevenlabs") },
|
|
616
|
+
fal: { key: "fal", label: "Fal", ...brandMark("fal") },
|
|
617
|
+
fireworks: { key: "fireworks", label: "Fireworks", ...brandMark("fireworks") },
|
|
618
|
+
google: { key: "google", label: "Google", ...brandMark("google") },
|
|
619
|
+
groq: { key: "groq", label: "Groq", ...brandMark("groq") },
|
|
620
|
+
kuaishou: { key: "kuaishou", label: "Kling", ...brandMark("kuaishou") },
|
|
621
|
+
luma: { key: "luma", label: "Luma", ...brandMark("luma") },
|
|
622
|
+
meta: { key: "meta", label: "Meta", ...brandMark("meta") },
|
|
623
|
+
mistral: { key: "mistral", label: "Mistral", ...brandMark("mistral") },
|
|
624
|
+
moonshot: { key: "moonshot", label: "Moonshot", ...brandMark("moonshot") },
|
|
625
|
+
openai: { key: "openai", label: "OpenAI", ...brandMark("openai") },
|
|
626
|
+
openrouter: { key: "openrouter", label: "OpenRouter", ...brandMark("openrouter") },
|
|
627
|
+
perplexity: { key: "perplexity", label: "Perplexity", ...brandMark("perplexity") },
|
|
628
|
+
pika: { key: "pika", label: "Pika", ...brandMark("pika") },
|
|
629
|
+
replicate: { key: "replicate", label: "Replicate", ...brandMark("replicate") },
|
|
630
|
+
runway: { key: "runway", label: "Runway", ...brandMark("runway") },
|
|
631
|
+
stability: { key: "stability", label: "Stability AI", ...brandMark("stability") },
|
|
632
|
+
tangle: { key: "tangle", label: "Tangle", ...brandMark("tangle") },
|
|
633
|
+
tcloud: { key: "tcloud", label: "tcloud", ...brandMark("tcloud") },
|
|
634
|
+
together: { key: "together", label: "Together", ...brandMark("together") },
|
|
635
|
+
vertex: { key: "vertex", label: "Vertex AI", ...brandMark("vertex") },
|
|
636
|
+
xai: { key: "xai", label: "xAI", ...brandMark("xai") },
|
|
637
|
+
zai: { key: "zai", label: "Z.ai", ...brandMark("zai") },
|
|
638
|
+
unknown: { key: "unknown", label: "Unknown" }
|
|
639
|
+
};
|
|
640
|
+
|
|
641
|
+
// src/dashboard/billing-dashboard.tsx
|
|
642
|
+
import { Button } from "@tangle-network/ui/primitives";
|
|
643
|
+
import { Badge } from "@tangle-network/ui/primitives";
|
|
644
|
+
import {
|
|
645
|
+
Card,
|
|
646
|
+
CardContent,
|
|
647
|
+
CardDescription,
|
|
648
|
+
CardHeader,
|
|
649
|
+
CardTitle
|
|
650
|
+
} from "@tangle-network/ui/primitives";
|
|
651
|
+
import { Progress } from "@tangle-network/ui/primitives";
|
|
652
|
+
import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
653
|
+
var variantColors = {
|
|
654
|
+
sandbox: {
|
|
655
|
+
accent: "text-[var(--accent-text)]",
|
|
656
|
+
accentBg: "bg-[var(--accent-surface-soft)]",
|
|
657
|
+
border: "border-[var(--border-accent)]",
|
|
658
|
+
progress: "bg-[image:var(--accent-gradient-strong)]"
|
|
659
|
+
}
|
|
660
|
+
};
|
|
661
|
+
function formatCredits(value) {
|
|
662
|
+
if (value >= 1e6) {
|
|
663
|
+
return `${(value / 1e6).toFixed(1)}M`;
|
|
664
|
+
}
|
|
665
|
+
if (value >= 1e3) {
|
|
666
|
+
return `${(value / 1e3).toFixed(1)}K`;
|
|
667
|
+
}
|
|
668
|
+
return value.toLocaleString();
|
|
669
|
+
}
|
|
670
|
+
function formatDate(dateStr) {
|
|
671
|
+
const date = new Date(dateStr);
|
|
672
|
+
return date.toLocaleDateString("en-US", {
|
|
673
|
+
month: "long",
|
|
674
|
+
day: "numeric",
|
|
675
|
+
year: "numeric"
|
|
676
|
+
});
|
|
677
|
+
}
|
|
678
|
+
function getStatusBadgeVariant(status) {
|
|
679
|
+
switch (status.toLowerCase()) {
|
|
680
|
+
case "active":
|
|
681
|
+
return "success";
|
|
682
|
+
case "trialing":
|
|
683
|
+
case "past_due":
|
|
684
|
+
return "warning";
|
|
685
|
+
case "canceled":
|
|
686
|
+
case "unpaid":
|
|
687
|
+
return "error";
|
|
688
|
+
default:
|
|
689
|
+
return "secondary";
|
|
690
|
+
}
|
|
691
|
+
}
|
|
692
|
+
function CreditCardIcon({ className }) {
|
|
693
|
+
return /* @__PURE__ */ jsxs2(
|
|
694
|
+
"svg",
|
|
695
|
+
{
|
|
696
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
697
|
+
viewBox: "0 0 24 24",
|
|
698
|
+
fill: "none",
|
|
699
|
+
stroke: "currentColor",
|
|
700
|
+
strokeWidth: "2",
|
|
701
|
+
strokeLinecap: "round",
|
|
702
|
+
strokeLinejoin: "round",
|
|
703
|
+
className: cn("h-5 w-5", className),
|
|
704
|
+
children: [
|
|
705
|
+
/* @__PURE__ */ jsx2("title", { children: "Credit card icon" }),
|
|
706
|
+
/* @__PURE__ */ jsx2("rect", { width: "20", height: "14", x: "2", y: "5", rx: "2" }),
|
|
707
|
+
/* @__PURE__ */ jsx2("line", { x1: "2", x2: "22", y1: "10", y2: "10" })
|
|
708
|
+
]
|
|
709
|
+
}
|
|
710
|
+
);
|
|
711
|
+
}
|
|
712
|
+
function CoinsIcon({ className }) {
|
|
713
|
+
return /* @__PURE__ */ jsxs2(
|
|
714
|
+
"svg",
|
|
715
|
+
{
|
|
716
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
717
|
+
viewBox: "0 0 24 24",
|
|
718
|
+
fill: "none",
|
|
719
|
+
stroke: "currentColor",
|
|
720
|
+
strokeWidth: "2",
|
|
721
|
+
strokeLinecap: "round",
|
|
722
|
+
strokeLinejoin: "round",
|
|
723
|
+
className: cn("h-5 w-5", className),
|
|
724
|
+
children: [
|
|
725
|
+
/* @__PURE__ */ jsx2("title", { children: "Coins icon" }),
|
|
726
|
+
/* @__PURE__ */ jsx2("circle", { cx: "8", cy: "8", r: "6" }),
|
|
727
|
+
/* @__PURE__ */ jsx2("path", { d: "M18.09 10.37A6 6 0 1 1 10.34 18" }),
|
|
728
|
+
/* @__PURE__ */ jsx2("path", { d: "M7 6h1v4" }),
|
|
729
|
+
/* @__PURE__ */ jsx2("path", { d: "m16.71 13.88.7.71-2.82 2.82" })
|
|
730
|
+
]
|
|
731
|
+
}
|
|
732
|
+
);
|
|
733
|
+
}
|
|
734
|
+
function ChartIcon({ className }) {
|
|
735
|
+
return /* @__PURE__ */ jsxs2(
|
|
736
|
+
"svg",
|
|
737
|
+
{
|
|
738
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
739
|
+
viewBox: "0 0 24 24",
|
|
740
|
+
fill: "none",
|
|
741
|
+
stroke: "currentColor",
|
|
742
|
+
strokeWidth: "2",
|
|
743
|
+
strokeLinecap: "round",
|
|
744
|
+
strokeLinejoin: "round",
|
|
745
|
+
className: cn("h-5 w-5", className),
|
|
746
|
+
children: [
|
|
747
|
+
/* @__PURE__ */ jsx2("title", { children: "Chart icon" }),
|
|
748
|
+
/* @__PURE__ */ jsx2("path", { d: "M3 3v18h18" }),
|
|
749
|
+
/* @__PURE__ */ jsx2("path", { d: "m19 9-5 5-4-4-3 3" })
|
|
750
|
+
]
|
|
751
|
+
}
|
|
752
|
+
);
|
|
753
|
+
}
|
|
754
|
+
function BillingDashboard({
|
|
755
|
+
subscription,
|
|
756
|
+
balance,
|
|
757
|
+
usage,
|
|
758
|
+
onManageSubscription,
|
|
759
|
+
onAddCredits,
|
|
760
|
+
variant = "sandbox",
|
|
761
|
+
className,
|
|
762
|
+
cardClassName
|
|
763
|
+
}) {
|
|
764
|
+
const colors2 = variantColors[variant];
|
|
765
|
+
const totalCredits = balance.available + balance.used;
|
|
766
|
+
const usagePercent = totalCredits > 0 ? balance.used / totalCredits * 100 : 0;
|
|
767
|
+
const sortedModels = Object.entries(usage.byModel).sort(
|
|
768
|
+
([, a], [, b]) => b - a
|
|
769
|
+
);
|
|
770
|
+
return /* @__PURE__ */ jsxs2("div", { className: cn("grid gap-6 lg:grid-cols-3", className), children: [
|
|
771
|
+
/* @__PURE__ */ jsxs2(Card, { variant, className: cn("lg:col-span-1", cardClassName), children: [
|
|
772
|
+
/* @__PURE__ */ jsx2(CardHeader, { children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between", children: [
|
|
773
|
+
/* @__PURE__ */ jsxs2(CardTitle, { className: "flex items-center gap-2 text-base", children: [
|
|
774
|
+
/* @__PURE__ */ jsx2(CreditCardIcon, { className: colors2.accent }),
|
|
775
|
+
"Current Plan"
|
|
776
|
+
] }),
|
|
777
|
+
subscription && /* @__PURE__ */ jsx2(Badge, { variant: getStatusBadgeVariant(subscription.status), children: subscription.status })
|
|
778
|
+
] }) }),
|
|
779
|
+
/* @__PURE__ */ jsx2(CardContent, { className: "space-y-4", children: subscription ? /* @__PURE__ */ jsxs2(Fragment2, { children: [
|
|
780
|
+
/* @__PURE__ */ jsxs2("div", { children: [
|
|
781
|
+
/* @__PURE__ */ jsx2("p", { className: cn("font-bold text-2xl", colors2.accent), children: subscription.tierName }),
|
|
782
|
+
/* @__PURE__ */ jsxs2("p", { className: "text-muted-foreground text-sm", children: [
|
|
783
|
+
"Renews ",
|
|
784
|
+
formatDate(subscription.renewsAt)
|
|
785
|
+
] })
|
|
786
|
+
] }),
|
|
787
|
+
/* @__PURE__ */ jsx2(
|
|
788
|
+
Button,
|
|
789
|
+
{
|
|
790
|
+
variant: "outline",
|
|
791
|
+
className: "w-full",
|
|
792
|
+
onClick: onManageSubscription,
|
|
793
|
+
children: "Manage Subscription"
|
|
794
|
+
}
|
|
795
|
+
)
|
|
796
|
+
] }) : /* @__PURE__ */ jsxs2(Fragment2, { children: [
|
|
797
|
+
/* @__PURE__ */ jsxs2("div", { children: [
|
|
798
|
+
/* @__PURE__ */ jsx2("p", { className: "font-bold text-2xl text-muted-foreground", children: "No Active Plan" }),
|
|
799
|
+
/* @__PURE__ */ jsx2("p", { className: "text-muted-foreground text-sm", children: "Subscribe to get started" })
|
|
800
|
+
] }),
|
|
801
|
+
/* @__PURE__ */ jsx2(
|
|
802
|
+
Button,
|
|
803
|
+
{
|
|
804
|
+
variant,
|
|
805
|
+
className: "w-full",
|
|
806
|
+
onClick: onManageSubscription,
|
|
807
|
+
children: "View Plans"
|
|
808
|
+
}
|
|
809
|
+
)
|
|
810
|
+
] }) })
|
|
811
|
+
] }),
|
|
812
|
+
/* @__PURE__ */ jsxs2(Card, { variant, className: cn("lg:col-span-1", cardClassName), children: [
|
|
813
|
+
/* @__PURE__ */ jsxs2(CardHeader, { children: [
|
|
814
|
+
/* @__PURE__ */ jsxs2(CardTitle, { className: "flex items-center gap-2 text-base", children: [
|
|
815
|
+
/* @__PURE__ */ jsx2(CoinsIcon, { className: colors2.accent }),
|
|
816
|
+
"Credit Balance"
|
|
817
|
+
] }),
|
|
818
|
+
/* @__PURE__ */ jsxs2(CardDescription, { children: [
|
|
819
|
+
formatCredits(balance.available),
|
|
820
|
+
" credits remaining"
|
|
821
|
+
] })
|
|
822
|
+
] }),
|
|
823
|
+
/* @__PURE__ */ jsxs2(CardContent, { className: "space-y-4", children: [
|
|
824
|
+
/* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
|
|
825
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between text-sm", children: [
|
|
826
|
+
/* @__PURE__ */ jsx2("span", { className: "text-muted-foreground", children: "Used" }),
|
|
827
|
+
/* @__PURE__ */ jsx2("span", { className: "font-medium", children: formatCredits(balance.used) })
|
|
828
|
+
] }),
|
|
829
|
+
/* @__PURE__ */ jsx2(Progress, { value: usagePercent, variant, className: "h-3" }),
|
|
830
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between text-sm", children: [
|
|
831
|
+
/* @__PURE__ */ jsx2("span", { className: "text-muted-foreground", children: "Available" }),
|
|
832
|
+
/* @__PURE__ */ jsx2("span", { className: cn("font-medium", colors2.accent), children: formatCredits(balance.available) })
|
|
833
|
+
] })
|
|
834
|
+
] }),
|
|
835
|
+
/* @__PURE__ */ jsx2(Button, { variant, className: "w-full", onClick: onAddCredits, children: "Add Credits" })
|
|
836
|
+
] })
|
|
837
|
+
] }),
|
|
838
|
+
/* @__PURE__ */ jsxs2(Card, { variant, className: cn("lg:col-span-1", cardClassName), children: [
|
|
839
|
+
/* @__PURE__ */ jsxs2(CardHeader, { children: [
|
|
840
|
+
/* @__PURE__ */ jsxs2(CardTitle, { className: "flex items-center gap-2 text-base", children: [
|
|
841
|
+
/* @__PURE__ */ jsx2(ChartIcon, { className: colors2.accent }),
|
|
842
|
+
"Usage Breakdown"
|
|
843
|
+
] }),
|
|
844
|
+
/* @__PURE__ */ jsx2(CardDescription, { children: usage.period })
|
|
845
|
+
] }),
|
|
846
|
+
/* @__PURE__ */ jsxs2(CardContent, { className: "space-y-4", children: [
|
|
847
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex items-baseline justify-between", children: [
|
|
848
|
+
/* @__PURE__ */ jsx2("span", { className: "text-muted-foreground text-sm", children: "Total Usage" }),
|
|
849
|
+
/* @__PURE__ */ jsx2("span", { className: cn("font-bold text-2xl", colors2.accent), children: formatCredits(usage.total) })
|
|
850
|
+
] }),
|
|
851
|
+
/* @__PURE__ */ jsxs2("div", { className: "space-y-3", children: [
|
|
852
|
+
/* @__PURE__ */ jsx2("p", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wider", children: "By Model" }),
|
|
853
|
+
/* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
|
|
854
|
+
sortedModels.slice(0, 5).map(([model, credits]) => {
|
|
855
|
+
const modelPercent = usage.total > 0 ? credits / usage.total * 100 : 0;
|
|
856
|
+
return /* @__PURE__ */ jsxs2("div", { className: "space-y-1", children: [
|
|
857
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between text-sm", children: [
|
|
858
|
+
/* @__PURE__ */ jsx2("span", { className: "truncate text-muted-foreground", children: model }),
|
|
859
|
+
/* @__PURE__ */ jsx2("span", { className: "ml-2 font-medium", children: formatCredits(credits) })
|
|
860
|
+
] }),
|
|
861
|
+
/* @__PURE__ */ jsx2("div", { className: "h-1.5 w-full overflow-hidden rounded-full bg-muted", children: /* @__PURE__ */ jsx2(
|
|
862
|
+
"div",
|
|
863
|
+
{
|
|
864
|
+
className: cn(
|
|
865
|
+
"h-full rounded-full transition-all",
|
|
866
|
+
variant === "sandbox" && colors2.progress
|
|
867
|
+
),
|
|
868
|
+
style: { width: `${modelPercent}%` }
|
|
869
|
+
}
|
|
870
|
+
) })
|
|
871
|
+
] }, model);
|
|
872
|
+
}),
|
|
873
|
+
sortedModels.length > 5 && /* @__PURE__ */ jsxs2("p", { className: "text-muted-foreground text-xs", children: [
|
|
874
|
+
"+",
|
|
875
|
+
sortedModels.length - 5,
|
|
876
|
+
" more models"
|
|
877
|
+
] }),
|
|
878
|
+
sortedModels.length === 0 && /* @__PURE__ */ jsx2("p", { className: "text-muted-foreground text-sm", children: "No usage this period" })
|
|
879
|
+
] })
|
|
880
|
+
] })
|
|
881
|
+
] })
|
|
882
|
+
] })
|
|
883
|
+
] });
|
|
884
|
+
}
|
|
885
|
+
|
|
886
|
+
// src/dashboard/pricing-page.tsx
|
|
887
|
+
import { Check, Zap } from "lucide-react";
|
|
888
|
+
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
889
|
+
function formatPrice(cents) {
|
|
890
|
+
if (!Number.isFinite(cents) || cents < 0) return "$0";
|
|
891
|
+
return cents % 100 === 0 ? `$${cents / 100}` : `$${(cents / 100).toFixed(2)}`;
|
|
892
|
+
}
|
|
893
|
+
function PricingPage({
|
|
894
|
+
tiers,
|
|
895
|
+
currentTierId,
|
|
896
|
+
billingPeriod,
|
|
897
|
+
onBillingPeriodChange,
|
|
898
|
+
onSelectTier,
|
|
899
|
+
loading = false,
|
|
900
|
+
className
|
|
901
|
+
}) {
|
|
902
|
+
const tiersWithRecommended = tiers.map((tier, i) => ({
|
|
903
|
+
...tier,
|
|
904
|
+
recommended: tier.recommended ?? (tiers.length === 3 && i === 1)
|
|
905
|
+
}));
|
|
906
|
+
return /* @__PURE__ */ jsxs3("div", { className: cn("w-full space-y-10", className), children: [
|
|
907
|
+
/* @__PURE__ */ jsx3("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs3("div", { className: "inline-flex items-center rounded-full border border-border bg-muted/50 p-1", children: [
|
|
908
|
+
/* @__PURE__ */ jsx3(
|
|
909
|
+
"button",
|
|
910
|
+
{
|
|
911
|
+
type: "button",
|
|
912
|
+
onClick: () => onBillingPeriodChange("monthly"),
|
|
913
|
+
className: cn(
|
|
914
|
+
"rounded-full px-5 py-2 text-sm font-medium transition-all",
|
|
915
|
+
billingPeriod === "monthly" ? "bg-card text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
|
|
916
|
+
),
|
|
917
|
+
children: "Monthly"
|
|
918
|
+
}
|
|
919
|
+
),
|
|
920
|
+
/* @__PURE__ */ jsxs3(
|
|
921
|
+
"button",
|
|
922
|
+
{
|
|
923
|
+
type: "button",
|
|
924
|
+
onClick: () => onBillingPeriodChange("yearly"),
|
|
925
|
+
className: cn(
|
|
926
|
+
"rounded-full px-5 py-2 text-sm font-medium transition-all",
|
|
927
|
+
billingPeriod === "yearly" ? "bg-card text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
|
|
928
|
+
),
|
|
929
|
+
children: [
|
|
930
|
+
"Yearly",
|
|
931
|
+
/* @__PURE__ */ jsx3("span", { className: "ml-2 rounded-full bg-[var(--surface-success-bg)] px-2 py-0.5 text-[10px] font-bold text-[var(--surface-success-text)]", children: "Save 20%" })
|
|
932
|
+
]
|
|
933
|
+
}
|
|
934
|
+
)
|
|
935
|
+
] }) }),
|
|
936
|
+
/* @__PURE__ */ jsx3("div", { className: "grid grid-cols-1 gap-6 lg:grid-cols-3 items-start", children: tiersWithRecommended.map((tier) => {
|
|
937
|
+
const isCurrentTier = tier.id === currentTierId;
|
|
938
|
+
const isRecommended = tier.recommended;
|
|
939
|
+
const isFree = tier.monthlyPriceCents === 0;
|
|
940
|
+
const price = billingPeriod === "yearly" && tier.yearlyPriceCents !== void 0 ? tier.yearlyPriceCents : tier.monthlyPriceCents;
|
|
941
|
+
const displayPrice = billingPeriod === "yearly" ? Math.round(price / 12) : price;
|
|
942
|
+
return /* @__PURE__ */ jsxs3(
|
|
943
|
+
"div",
|
|
944
|
+
{
|
|
945
|
+
className: cn(
|
|
946
|
+
"relative flex flex-col rounded-2xl border transition-all",
|
|
947
|
+
isRecommended ? "border-primary shadow-[var(--shadow-glow)] scale-[1.02] z-10" : "border-border hover:border-primary/30"
|
|
948
|
+
),
|
|
949
|
+
children: [
|
|
950
|
+
isRecommended && /* @__PURE__ */ jsx3("div", { className: "absolute -top-4 left-1/2 -translate-x-1/2", children: /* @__PURE__ */ jsxs3("span", { className: "inline-flex items-center gap-1.5 rounded-full bg-primary px-4 py-1.5 text-xs font-bold text-primary-foreground shadow-sm", children: [
|
|
951
|
+
/* @__PURE__ */ jsx3(Zap, { className: "h-3 w-3" }),
|
|
952
|
+
"Most Popular"
|
|
953
|
+
] }) }),
|
|
954
|
+
isCurrentTier && !isRecommended && /* @__PURE__ */ jsx3("div", { className: "absolute -top-4 left-1/2 -translate-x-1/2", children: /* @__PURE__ */ jsx3("span", { className: "inline-flex items-center rounded-full bg-muted border border-border px-4 py-1.5 text-xs font-bold text-foreground", children: "Current Plan" }) }),
|
|
955
|
+
/* @__PURE__ */ jsxs3("div", { className: cn("flex flex-col p-8", isRecommended && "pt-10"), children: [
|
|
956
|
+
/* @__PURE__ */ jsxs3("div", { className: "mb-6", children: [
|
|
957
|
+
/* @__PURE__ */ jsx3("h3", { className: "text-lg font-bold text-foreground", children: tier.name }),
|
|
958
|
+
/* @__PURE__ */ jsx3("p", { className: "mt-1 text-sm text-muted-foreground", children: tier.description })
|
|
959
|
+
] }),
|
|
960
|
+
/* @__PURE__ */ jsxs3("div", { className: "mb-8", children: [
|
|
961
|
+
/* @__PURE__ */ jsxs3("div", { className: "flex items-baseline gap-1", children: [
|
|
962
|
+
/* @__PURE__ */ jsx3("span", { className: cn("text-5xl font-extrabold tracking-tight", isRecommended ? "text-primary" : "text-foreground"), children: isFree ? "Free" : formatPrice(displayPrice) }),
|
|
963
|
+
!isFree && /* @__PURE__ */ jsx3("span", { className: "text-muted-foreground text-sm font-medium", children: "/mo" })
|
|
964
|
+
] }),
|
|
965
|
+
billingPeriod === "yearly" && tier.yearlyPriceCents !== void 0 && !isFree && /* @__PURE__ */ jsxs3("p", { className: "mt-1 text-xs text-muted-foreground", children: [
|
|
966
|
+
formatPrice(tier.yearlyPriceCents),
|
|
967
|
+
" billed annually"
|
|
968
|
+
] })
|
|
969
|
+
] }),
|
|
970
|
+
/* @__PURE__ */ jsx3(
|
|
971
|
+
"button",
|
|
972
|
+
{
|
|
973
|
+
type: "button",
|
|
974
|
+
onClick: () => onSelectTier(tier.id),
|
|
975
|
+
disabled: isCurrentTier || loading,
|
|
976
|
+
className: cn(
|
|
977
|
+
"w-full rounded-xl py-3 text-sm font-bold transition-all active:scale-[0.98] disabled:opacity-50",
|
|
978
|
+
isRecommended ? "bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm" : isCurrentTier ? "bg-muted text-muted-foreground border border-border cursor-default" : "bg-card text-foreground border border-border hover:border-primary/50 hover:bg-muted"
|
|
979
|
+
),
|
|
980
|
+
children: isCurrentTier ? "Current Plan" : isFree ? "Get Started" : "Subscribe"
|
|
981
|
+
}
|
|
982
|
+
),
|
|
983
|
+
/* @__PURE__ */ jsx3("div", { className: "my-8 border-t border-border" }),
|
|
984
|
+
/* @__PURE__ */ jsx3("ul", { className: "space-y-3.5 flex-1", children: tier.features.map((feature) => /* @__PURE__ */ jsxs3("li", { className: "flex items-start gap-3", children: [
|
|
985
|
+
/* @__PURE__ */ jsx3("div", { className: cn(
|
|
986
|
+
"mt-0.5 flex h-5 w-5 shrink-0 items-center justify-center rounded-full",
|
|
987
|
+
isRecommended ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"
|
|
988
|
+
), children: /* @__PURE__ */ jsx3(Check, { className: "h-3 w-3" }) }),
|
|
989
|
+
/* @__PURE__ */ jsx3("span", { className: "text-sm text-foreground/80", children: feature })
|
|
990
|
+
] }, feature)) })
|
|
991
|
+
] })
|
|
992
|
+
]
|
|
993
|
+
},
|
|
994
|
+
tier.id
|
|
995
|
+
);
|
|
996
|
+
}) })
|
|
997
|
+
] });
|
|
998
|
+
}
|
|
999
|
+
|
|
1000
|
+
// src/dashboard/usage-chart.tsx
|
|
1001
|
+
import * as React2 from "react";
|
|
1002
|
+
import { Card as Card2, CardContent as CardContent2, CardHeader as CardHeader2, CardTitle as CardTitle2 } from "@tangle-network/ui/primitives";
|
|
1003
|
+
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
1004
|
+
var colors = {
|
|
1005
|
+
bar: "bg-[image:var(--accent-gradient-strong)]",
|
|
1006
|
+
barHover: "hover:brightness-110",
|
|
1007
|
+
text: "text-[var(--accent-text)]"
|
|
1008
|
+
};
|
|
1009
|
+
function formatDate2(dateStr) {
|
|
1010
|
+
const date = new Date(dateStr);
|
|
1011
|
+
return date.toLocaleDateString("en-US", { month: "short", day: "numeric" });
|
|
1012
|
+
}
|
|
1013
|
+
function formatValue(value) {
|
|
1014
|
+
if (value >= 1e6) {
|
|
1015
|
+
return `${(value / 1e6).toFixed(1)}M`;
|
|
1016
|
+
}
|
|
1017
|
+
if (value >= 1e3) {
|
|
1018
|
+
return `${(value / 1e3).toFixed(1)}K`;
|
|
1019
|
+
}
|
|
1020
|
+
return value.toLocaleString();
|
|
1021
|
+
}
|
|
1022
|
+
function UsageChart({ data, title, unit, className }) {
|
|
1023
|
+
const maxValue = Math.max(...data.map((d) => d.value), 1);
|
|
1024
|
+
const total = data.reduce((sum, d) => sum + d.value, 0);
|
|
1025
|
+
const [hoveredIndex, setHoveredIndex] = React2.useState(null);
|
|
1026
|
+
return /* @__PURE__ */ jsxs4(Card2, { className, children: [
|
|
1027
|
+
/* @__PURE__ */ jsxs4(CardHeader2, { className: "flex flex-row items-center justify-between pb-2", children: [
|
|
1028
|
+
/* @__PURE__ */ jsx4(CardTitle2, { className: "font-medium text-base", children: title }),
|
|
1029
|
+
/* @__PURE__ */ jsxs4("div", { className: "text-right", children: [
|
|
1030
|
+
/* @__PURE__ */ jsx4("span", { className: cn("font-bold text-2xl", colors.text), children: formatValue(total) }),
|
|
1031
|
+
/* @__PURE__ */ jsx4("span", { className: "ml-1 text-muted-foreground text-sm", children: unit })
|
|
1032
|
+
] })
|
|
1033
|
+
] }),
|
|
1034
|
+
/* @__PURE__ */ jsxs4(CardContent2, { children: [
|
|
1035
|
+
/* @__PURE__ */ jsxs4("div", { className: "relative", children: [
|
|
1036
|
+
/* @__PURE__ */ jsxs4("div", { className: "absolute top-0 left-0 flex h-48 flex-col justify-between text-muted-foreground text-xs", children: [
|
|
1037
|
+
/* @__PURE__ */ jsx4("span", { children: formatValue(maxValue) }),
|
|
1038
|
+
/* @__PURE__ */ jsx4("span", { children: formatValue(Math.round(maxValue / 2)) }),
|
|
1039
|
+
/* @__PURE__ */ jsx4("span", { children: "0" })
|
|
1040
|
+
] }),
|
|
1041
|
+
/* @__PURE__ */ jsx4("div", { className: "ml-10 flex h-48 items-end gap-1", children: data.map((point, index) => {
|
|
1042
|
+
const heightPercent = point.value / maxValue * 100;
|
|
1043
|
+
const isHovered = hoveredIndex === index;
|
|
1044
|
+
return (
|
|
1045
|
+
// biome-ignore lint/a11y/noStaticElementInteractions: chart bar uses hover for tooltip display
|
|
1046
|
+
/* @__PURE__ */ jsxs4(
|
|
1047
|
+
"div",
|
|
1048
|
+
{
|
|
1049
|
+
className: "group relative flex flex-1 flex-col items-center",
|
|
1050
|
+
onMouseEnter: () => setHoveredIndex(index),
|
|
1051
|
+
onMouseLeave: () => setHoveredIndex(null),
|
|
1052
|
+
children: [
|
|
1053
|
+
isHovered && /* @__PURE__ */ jsxs4("div", { className: "absolute -top-12 z-10 rounded-lg bg-popover px-3 py-1.5 text-sm shadow-lg", children: [
|
|
1054
|
+
/* @__PURE__ */ jsxs4("p", { className: "font-medium", children: [
|
|
1055
|
+
formatValue(point.value),
|
|
1056
|
+
" ",
|
|
1057
|
+
unit
|
|
1058
|
+
] }),
|
|
1059
|
+
/* @__PURE__ */ jsx4("p", { className: "text-muted-foreground text-xs", children: formatDate2(point.date) })
|
|
1060
|
+
] }),
|
|
1061
|
+
/* @__PURE__ */ jsx4(
|
|
1062
|
+
"div",
|
|
1063
|
+
{
|
|
1064
|
+
className: cn(
|
|
1065
|
+
"min-h-[2px] w-full rounded-t-sm transition-all duration-200",
|
|
1066
|
+
colors.bar,
|
|
1067
|
+
colors.barHover,
|
|
1068
|
+
isHovered && "opacity-80"
|
|
1069
|
+
),
|
|
1070
|
+
style: { height: `${Math.max(heightPercent, 1)}%` }
|
|
1071
|
+
}
|
|
1072
|
+
)
|
|
1073
|
+
]
|
|
1074
|
+
},
|
|
1075
|
+
point.date
|
|
1076
|
+
)
|
|
1077
|
+
);
|
|
1078
|
+
}) }),
|
|
1079
|
+
/* @__PURE__ */ jsx4("div", { className: "mt-2 ml-10 flex gap-1", children: data.map((point, index) => /* @__PURE__ */ jsx4(
|
|
1080
|
+
"div",
|
|
1081
|
+
{
|
|
1082
|
+
className: cn(
|
|
1083
|
+
"flex-1 truncate text-center text-muted-foreground text-xs",
|
|
1084
|
+
hoveredIndex === index && colors.text
|
|
1085
|
+
),
|
|
1086
|
+
children: data.length <= 7 || index % Math.ceil(data.length / 7) === 0 ? formatDate2(point.date) : ""
|
|
1087
|
+
},
|
|
1088
|
+
point.date
|
|
1089
|
+
)) })
|
|
1090
|
+
] }),
|
|
1091
|
+
/* @__PURE__ */ jsxs4("div", { className: "mt-4 grid grid-cols-3 gap-4 border-border border-t pt-4", children: [
|
|
1092
|
+
/* @__PURE__ */ jsxs4("div", { className: "text-center", children: [
|
|
1093
|
+
/* @__PURE__ */ jsx4("p", { className: "text-muted-foreground text-xs", children: "Average" }),
|
|
1094
|
+
/* @__PURE__ */ jsxs4("p", { className: "font-medium", children: [
|
|
1095
|
+
formatValue(Math.round(total / data.length)),
|
|
1096
|
+
" ",
|
|
1097
|
+
unit
|
|
1098
|
+
] })
|
|
1099
|
+
] }),
|
|
1100
|
+
/* @__PURE__ */ jsxs4("div", { className: "text-center", children: [
|
|
1101
|
+
/* @__PURE__ */ jsx4("p", { className: "text-muted-foreground text-xs", children: "Peak" }),
|
|
1102
|
+
/* @__PURE__ */ jsxs4("p", { className: "font-medium", children: [
|
|
1103
|
+
formatValue(maxValue),
|
|
1104
|
+
" ",
|
|
1105
|
+
unit
|
|
1106
|
+
] })
|
|
1107
|
+
] }),
|
|
1108
|
+
/* @__PURE__ */ jsxs4("div", { className: "text-center", children: [
|
|
1109
|
+
/* @__PURE__ */ jsx4("p", { className: "text-muted-foreground text-xs", children: "Total" }),
|
|
1110
|
+
/* @__PURE__ */ jsxs4("p", { className: cn("font-medium", colors.text), children: [
|
|
1111
|
+
formatValue(total),
|
|
1112
|
+
" ",
|
|
1113
|
+
unit
|
|
1114
|
+
] })
|
|
1115
|
+
] })
|
|
1116
|
+
] })
|
|
1117
|
+
] })
|
|
1118
|
+
] });
|
|
1119
|
+
}
|
|
1120
|
+
|
|
1121
|
+
// src/dashboard/template-card.tsx
|
|
1122
|
+
import { ArrowRight } from "lucide-react";
|
|
1123
|
+
import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
1124
|
+
function TemplateCard({ template, onUseTemplate, className }) {
|
|
1125
|
+
return /* @__PURE__ */ jsxs5(
|
|
1126
|
+
"div",
|
|
1127
|
+
{
|
|
1128
|
+
className: cn(
|
|
1129
|
+
"group relative flex flex-col justify-between rounded-2xl border border-border bg-card p-6 transition-all hover:border-primary/30 hover:shadow-md",
|
|
1130
|
+
className
|
|
1131
|
+
),
|
|
1132
|
+
children: [
|
|
1133
|
+
/* @__PURE__ */ jsxs5("div", { children: [
|
|
1134
|
+
/* @__PURE__ */ jsx5("div", { className: "mb-4 flex h-12 w-12 items-center justify-center rounded-xl bg-muted border border-border", children: template.icon ?? /* @__PURE__ */ jsx5("span", { className: "text-lg font-bold text-primary", children: template.name.charAt(0).toUpperCase() }) }),
|
|
1135
|
+
/* @__PURE__ */ jsx5("h3", { className: "mb-1 text-base font-bold text-foreground", children: template.name }),
|
|
1136
|
+
/* @__PURE__ */ jsx5("p", { className: "text-sm text-muted-foreground leading-relaxed line-clamp-2", children: template.description }),
|
|
1137
|
+
template.tags && template.tags.length > 0 && /* @__PURE__ */ jsx5("div", { className: "mt-3 flex flex-wrap gap-1.5", children: template.tags.map((tag, i) => /* @__PURE__ */ jsx5(
|
|
1138
|
+
"span",
|
|
1139
|
+
{
|
|
1140
|
+
className: "rounded-full bg-muted px-2 py-0.5 text-[10px] font-medium text-muted-foreground",
|
|
1141
|
+
children: tag
|
|
1142
|
+
},
|
|
1143
|
+
`${tag}-${i}`
|
|
1144
|
+
)) })
|
|
1145
|
+
] }),
|
|
1146
|
+
/* @__PURE__ */ jsxs5(
|
|
1147
|
+
"button",
|
|
1148
|
+
{
|
|
1149
|
+
type: "button",
|
|
1150
|
+
onClick: () => onUseTemplate(template.id),
|
|
1151
|
+
className: "mt-5 inline-flex w-full items-center justify-center gap-2 rounded-xl bg-primary/10 border border-primary/20 px-4 py-2.5 text-sm font-bold text-primary transition-colors hover:bg-primary hover:text-primary-foreground active:scale-[0.98]",
|
|
1152
|
+
children: [
|
|
1153
|
+
"Use Template",
|
|
1154
|
+
/* @__PURE__ */ jsx5(ArrowRight, { className: "h-4 w-4 transition-transform group-hover:translate-x-0.5" })
|
|
1155
|
+
]
|
|
1156
|
+
}
|
|
1157
|
+
)
|
|
1158
|
+
]
|
|
1159
|
+
}
|
|
1160
|
+
);
|
|
1161
|
+
}
|
|
1162
|
+
|
|
1163
|
+
// src/dashboard/info-panel.tsx
|
|
1164
|
+
import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
1165
|
+
function InfoPanel({ label, title, description, className }) {
|
|
1166
|
+
return /* @__PURE__ */ jsxs6("div", { className: cn("rounded-lg bg-[var(--brand-strong)] p-5 text-[var(--brand-strong-text)] relative overflow-hidden", className), children: [
|
|
1167
|
+
/* @__PURE__ */ jsxs6("div", { className: "relative z-10", children: [
|
|
1168
|
+
/* @__PURE__ */ jsx6("p", { className: "text-[10px] font-bold uppercase tracking-widest text-[var(--brand-strong-text-dim)]", children: label }),
|
|
1169
|
+
/* @__PURE__ */ jsx6("h3", { className: "mt-1 text-lg font-bold", children: title }),
|
|
1170
|
+
/* @__PURE__ */ jsx6("p", { className: "mt-1 text-sm text-[var(--brand-strong-text-muted)]", children: description })
|
|
1171
|
+
] }),
|
|
1172
|
+
/* @__PURE__ */ jsx6("div", { className: "absolute right-0 top-0 h-full w-1/3 bg-white/5 -skew-x-12 translate-x-12 pointer-events-none" })
|
|
1173
|
+
] });
|
|
1174
|
+
}
|
|
1175
|
+
|
|
1176
|
+
export {
|
|
1177
|
+
canonicalModelId,
|
|
1178
|
+
formatPricing,
|
|
1179
|
+
formatContext,
|
|
1180
|
+
ModelPicker,
|
|
1181
|
+
BillingDashboard,
|
|
1182
|
+
formatPrice,
|
|
1183
|
+
PricingPage,
|
|
1184
|
+
UsageChart,
|
|
1185
|
+
TemplateCard,
|
|
1186
|
+
InfoPanel
|
|
1187
|
+
};
|