@webority/theme 0.127.0 → 0.129.0

package/scss/wui/_chat.scss

@@ -1,156 +0,0 @@
-// ── Assistant chat ──
-// <wui-chat> / <app-chat>: a launcher pinned to a bottom corner and a side panel holding the
-// conversation and the question box. The header, buttons, form field and alerts inside are the
-// theme's own (.drawer-header, .btn, .form-control, .alert); only the placement and the two chat
-// shapes live here. A compact launcher is the shared .wui-floating-btn circle (_floating.scss).
-//
-// Part of the wui-components layer — see _wui-components.scss for load order.
-
-// The element is a plain host: its two parts are fixed to the viewport.
-wui-chat {
-    display: contents;
-}
-
-.wui-chat-launcher {
-    position: fixed;
-    // Rises above an open consent banner, which publishes its room on html.
-    bottom: var(--wui-consent-banner-block, 0px);
-    inset-inline-end: 0;
-    z-index: var(--wui-z-fixed);
-    margin: 1rem;
-}
-wui-chat[position="start"] .wui-chat-launcher {
-    inset-inline-end: auto;
-    inset-inline-start: 0;
-}
-
-// Above the shell chrome and below modals, like the drawer it stands in for.
-.wui-chat-panel {
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    inset-inline-end: 0;
-    z-index: var(--wui-z-shell-drawer);
-    display: flex;
-    flex-direction: column;
-    width: min(440px, 100%);
-    background: var(--color-surface);
-    border-inline-start: 1px solid var(--color-border);
-    box-shadow: var(--wui-shadow-modal);
-}
-wui-chat[position="start"] .wui-chat-panel {
-    inset-inline-end: auto;
-    inset-inline-start: 0;
-    border-inline-start: 0;
-    border-inline-end: 1px solid var(--color-border);
-}
-// `hidden` is how the element closes the panel; display: flex above would otherwise win over it.
-.wui-chat-panel[hidden] {
-    display: none;
-}
-
-.wui-chat-body {
-    flex: 1 1 auto;
-    min-height: 0;
-    padding: 20px;
-    overflow-y: auto;
-}
-.wui-chat-empty {
-    padding-block: 2rem;
-}
-.wui-chat-foot {
-    flex: none;
-    padding: 16px 20px;
-    border-top: 1px solid var(--color-border);
-}
-
-// The person's question, on the right; the answer is plain text on the panel.
-.wui-chat-question {
-    max-width: 85%;
-}
-.wui-chat-bubble {
-    padding: 10px 14px;
-    background: var(--color-bg-muted);
-    border-radius: var(--wui-radius-lg);
-    white-space: pre-wrap;
-    overflow-wrap: anywhere;
-}
-
-// The question box starts one line tall, as tall as Send beside it, and grows with its text
-// up to a few lines. Its padding is equal top and bottom, so one line of text sits centred in it.
-.wui-chat-composer .form-control {
-    min-height: var(--wui-control-md);
-    max-height: 9rem;
-    padding-block: 10px;
-    resize: none;
-}
-// A form reserves a line under each field for its error; the question box has none, and the
-// empty line pushed Send below the box.
-.wui-chat-composer .wui-field-message:empty {
-    display: none;
-}
-
-// Attachments wrap onto new rows as the composer or a sent question grows.
-.wui-chat-attachments {
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--wui-space-xs);
-}
-.wui-chat-question-attachments {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: flex-end;
-    gap: var(--wui-space-xs);
-}
-
-// The banner that says a question is being edited, with its cancel control beside the text.
-.wui-chat-editing {
-    display: flex;
-    align-items: center;
-    gap: var(--wui-space-sm);
-    padding: var(--wui-space-sm) var(--wui-space-md);
-    background: var(--color-bg-muted);
-    border-radius: var(--wui-radius-md);
-    color: var(--color-text-muted);
-    font-size: var(--wui-fs-sm);
-}
-
-// Copy, edit, retry and the other actions under an answer; they wrap rather than overflow the panel.
-.wui-chat-turn-actions {
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--wui-space-xs);
-    margin-block-start: var(--wui-space-xs);
-}
-
-// Suggested follow-up questions under an answer, as wrapping chips.
-.wui-chat-suggestions {
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--wui-space-xs);
-}
-
-// Past chats: a scrolling list in the body's padding, one row per chat.
-.wui-chat-past {
-    display: flex;
-    flex-direction: column;
-    flex: 1 1 auto;
-    min-height: 0;
-    gap: var(--wui-space-xs);
-    padding: var(--wui-space-lg);
-    overflow: auto;
-}
-// min-width 0 lets the title inside the row shrink and truncate instead of pushing the row wider.
-.wui-chat-past-row {
-    display: flex;
-    align-items: center;
-    gap: var(--wui-space-sm);
-    min-width: 0;
-}
-
-// Bootstrap's d-flex is !important, so hidden needs its own rule.
-.wui-chat-foot[hidden],
-.wui-chat-past[hidden],
-.wui-chat-suggestions[hidden] {
-    display: none !important;
-}