diff --git a/src-node/package-lock.json b/src-node/package-lock.json index 499fe919a4..892d199c9b 100644 --- a/src-node/package-lock.json +++ b/src-node/package-lock.json @@ -1,12 +1,12 @@ { "name": "@phcode/node-core", - "version": "5.5.6-0", + "version": "5.5.9-0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@phcode/node-core", - "version": "5.5.6-0", + "version": "5.5.9-0", "hasInstallScript": true, "license": "GNU-AGPL3.0", "dependencies": { @@ -32,7 +32,7 @@ } }, "..": { - "version": "5.5.6-0", + "version": "5.5.9-0", "hasInstallScript": true, "dependencies": { "@bugsnag/js": "^7.18.0", diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index 5767f81215..17eb0e243e 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -2892,9 +2892,9 @@ define({ "AI_CHAT_USAGE_TURNS_CALLS": "Turns \u00b7 API calls", "AI_CHAT_USAGE_API_TIME": "Time in API", "AI_CHAT_USAGE_COST": "Cost at list price", - "AI_CHAT_USAGE_NOTE": "With a Claude subscription, this cost is included in your plan. Pricing shown is for reference only.", - "AI_CHAT_USAGE_SPEND_INCLUDED": "API-equivalent cost estimates. Your subscription or provider billing may differ.", - "AI_CHAT_USAGE_SPEND_NO_PRO_CHARGE": "No charge to your Phoenix Pro subscription.", + "AI_CHAT_USAGE_NOTE": "You won’t be charged this amount by Phoenix Pro.", + "AI_CHAT_USAGE_SPEND_INCLUDED": "With a Claude or ChatGPT subscription, these AI costs are covered by your plan. If you use an API key, billing is handled by your provider.", + "AI_CHAT_USAGE_SPEND_NO_PRO_CHARGE": "You won’t be charged this amount by Phoenix Pro.", "AI_CHAT_USAGE_OPTION_TURNS": "Show usage after every turn", "AI_CHAT_USAGE_OPTION_DOLLARS": "Show $ cost", "AI_CHAT_USAGE_CARD_TITLE": "Usage", diff --git a/src/styles/Extn-AIChatPanel.less b/src/styles/Extn-AIChatPanel.less index ca3f3b0346..9cd4b37f41 100644 --- a/src/styles/Extn-AIChatPanel.less +++ b/src/styles/Extn-AIChatPanel.less @@ -4896,11 +4896,60 @@ } .ai-usage-note { + position: relative; margin-top: auto; padding: 4px 12px 6px; color: @project-panel-text-2; white-space: normal; max-width: 270px; + + &:hover .ai-usage-note-tip, + &:focus-within .ai-usage-note-tip { + display: block; + } + } + + .ai-usage-note-trigger { + display: flex; + align-items: baseline; + gap: 6px; + padding: 0; + border: 0; + border-radius: 2px; + background: none; + box-shadow: none; + color: inherit; + font: inherit; + text-align: left; + cursor: help; + + span { + text-decoration: underline dotted; + text-underline-offset: 3px; + } + + &:focus-visible { + outline: 1px solid @project-panel-text-1; + outline-offset: 3px; + } + } + + .ai-usage-note-tip { + display: none; + position: absolute; + bottom: 100%; + left: 8px; + right: 8px; + margin-bottom: 6px; + padding: 10px 12px; + background: @bc-ai-sidebar-bg; + border: 1px solid @ai-start-border; + border-radius: 8px; + box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35); + color: @project-panel-text-1; + line-height: 1.45; + z-index: 1; + pointer-events: none; } label.ai-usage-option { @@ -5950,6 +5999,10 @@ flex-direction: column; gap: 4px; + .ai-settings-section-note { + margin-bottom: 0; + } + label { font-size: @ai-dialog-text; font-weight: 600; @@ -6192,7 +6245,8 @@ cursor: pointer; input[type="checkbox"] { - margin: 2px 0 0; + margin: 4px 0 0; + top: 0; flex-shrink: 0; cursor: pointer; } @@ -6838,19 +6892,38 @@ .ai-usage-bars { display: flex; align-items: flex-end; - gap: 3px; height: 44px; margin-bottom: 4px; } .ai-usage-bar { flex: 1; + display: flex; + flex-direction: column; + justify-content: flex-end; + height: 100%; + min-width: 0; + padding: 0 1.5px; + box-sizing: border-box; + border-radius: 2px; + + &.ai-usage-bar-hovered { + outline: 1px solid @project-panel-text-1; + outline-offset: -1px; + background: rgba(255, 255, 255, 0.05); + filter: brightness(1.2); + } + } + + .ai-usage-bar-fill { display: flex; flex-direction: column-reverse; + flex-shrink: 0; border-radius: 2px 2px 0 0; overflow: hidden; background: rgba(255, 255, 255, 0.03); min-height: 1px; + pointer-events: none; i { display: block; @@ -7114,10 +7187,10 @@ } } - // The spend figures' tip: a Claude plan covers the spend; Phoenix Pro adds no charge. + // Leave enough room for the no-charge sentence; wrap longer copy on narrow windows. .ai-usage-tip-note, .ai-usage-tip-foot { - max-width: 240px; + max-width: ~"min(280px, calc(100vw - 42px))"; white-space: normal; line-height: 1.45; } diff --git a/tracking-repos.json b/tracking-repos.json index bf04fe490a..c4b00baa98 100644 --- a/tracking-repos.json +++ b/tracking-repos.json @@ -1,5 +1,5 @@ { "phoenixPro": { - "commitID": "c63b994897b344c757263ee4acfe484d64faa61b" + "commitID": "4dc933fb3306dd5c8bd098969dce17544c58c0a6" } }