@gravity-ui/aikit 1.6.0 → 1.8.0

package/dist/components/organisms/Header/Header.scss

@@ -1,51 +0,0 @@
-@use '../../../styles/variables';
-
-$block: '.#{variables.$ns}header';
-
-#{$block} {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: var(--g-spacing-2);
-    width: 100%;
-    box-sizing: border-box;
-    background: var(--g-aikit-header-background);
-
-    &__icon {
-        display: flex;
-        align-items: center;
-        flex-shrink: 0;
-    }
-
-    &__title-container {
-        display: flex;
-        gap: var(--g-spacing-1);
-        flex: 1;
-        align-items: baseline;
-
-        &_position_left {
-            justify-content: flex-start;
-        }
-
-        &_position_center {
-            justify-content: center;
-        }
-    }
-
-    &__title {
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        overflow: hidden;
-        flex-shrink: 0;
-    }
-
-    &__preview {
-        display: flex;
-        align-items: center;
-        flex-shrink: 0;
-    }
-
-    &__action-button {
-        flex-shrink: 0;
-    }
-}

package/dist/components/organisms/MessageList/MessageList.scss

@@ -1,35 +0,0 @@
-@use '../../../styles/variables';
-
-$block: '.#{variables.$ns}message-list';
-
-#{$block} {
-    overflow-y: auto;
-    display: flex;
-    flex-direction: column;
-    min-height: 0;
-    flex: 1;
-    align-self: stretch;
-
-    &__messages {
-        display: flex;
-        flex-direction: column;
-        gap: var(--g-spacing-4);
-    }
-
-    &__retry-button {
-        display: flex;
-        align-items: center;
-        gap: var(--g-spacing-1);
-    }
-
-    &__loader,
-    &__error-alert {
-        margin-top: var(--g-spacing-4);
-    }
-
-    &__load-trigger {
-        display: flex;
-        justify-content: center;
-        padding: var(--g-spacing-2);
-    }
-}

package/dist/components/organisms/PromptInput/PromptInput.scss

@@ -1,77 +0,0 @@
-@use '../../../styles/variables.scss';
-
-$block: '.#{variables.$ns}prompt-input';
-
-#{$block} {
-    border-radius: var(--g-border-radius-xl);
-    border: 1px solid var(--g-color-line-generic);
-    background: var(--g-color-base-float);
-    overflow: hidden;
-
-    &_view_simple {
-        display: flex;
-        flex-direction: column;
-        padding: var(--g-spacing-1) var(--g-spacing-1) var(--g-spacing-1) var(--g-spacing-3);
-    }
-
-    &_view_full {
-        display: flex;
-        padding: var(--g-spacing-2);
-        flex-direction: column;
-        align-items: flex-start;
-        gap: var(--g-spacing-2);
-    }
-
-    &_view_full &__textarea {
-        padding-top: 0;
-    }
-
-    &__content {
-        display: flex;
-        align-items: flex-end;
-        gap: var(--g-spacing-2);
-        width: 100%;
-    }
-
-    &__panel-wrapper {
-        background: var(--g-color-base-simple-hover-solid);
-
-        border-radius: var(--g-border-radius-xl);
-    }
-
-    &__panel {
-        overflow: hidden;
-        transition:
-            max-height 0.3s ease-in-out,
-            opacity 0.3s ease-in-out,
-            margin 0.3s ease-in-out;
-        will-change: max-height, opacity, margin;
-
-        // Closed state
-        max-height: 0;
-        opacity: 0;
-        margin: 0;
-
-        // Open state
-        &_open {
-            max-height: var(
-                --g-aikit-prompt-input-panel-max-height
-            ); // Large enough value for most content
-            opacity: 1;
-        }
-
-        // Animation works thanks to useDelayedUnmount hook:
-        // - When isOpen=true, element is immediately added to DOM and animation plays
-        // - When isOpen=false, _open class is removed, animation plays,
-        //   then element is removed from DOM after transition completes (300ms)
-    }
-
-    &__suggestions-wrapper {
-        align-self: stretch;
-        flex: 1;
-    }
-
-    &__suggestions {
-        padding-bottom: var(--g-spacing-2);
-    }
-}

package/dist/components/organisms/ThinkingMessage/ThinkingMessage.scss

@@ -1,27 +0,0 @@
-@use '../../../styles/variables';
-
-$block: '.#{variables.$ns}thinking-message';
-
-#{$block} {
-    display: flex;
-    flex-direction: column;
-    gap: var(--g-spacing-2);
-    padding: var(--g-spacing-1) 0 var(--g-spacing-1) var(--g-spacing-4);
-    border-left: 2px solid var(--g-color-line-generic);
-
-    &__buttons {
-        display: flex;
-        align-items: center;
-        gap: var(--g-spacing-2);
-    }
-
-    &__container {
-        display: flex;
-        flex-direction: column;
-        gap: var(--g-spacing-6);
-    }
-
-    &__content {
-        color: var(--g-color-text-complementary);
-    }
-}

package/dist/components/organisms/ToolMessage/ToolMessage.scss

@@ -1,19 +0,0 @@
-@use '../../../styles/variables';
-
-$block: '.#{variables.$ns}tool-message';
-
-#{$block} {
-    padding: var(--g-spacing-2);
-    border-radius: var(--g-border-radius-xl);
-    width: 100%;
-
-    &_waiting {
-        border-color: var(--g-color-line-brand);
-    }
-
-    &__container {
-        display: flex;
-        flex-direction: column;
-        gap: var(--g-spacing-2);
-    }
-}

package/dist/components/organisms/UserMessage/UserMessage.scss

@@ -1,14 +0,0 @@
-@use '../../../styles/variables';
-
-$block: '.#{variables.$ns}user-message';
-
-#{$block} {
-    display: flex;
-    flex-direction: column;
-    gap: var(--g-spacing-1);
-    align-items: flex-end;
-}
-
-#{$block}_format_plain {
-    white-space: pre-wrap;
-}

package/dist/components/pages/ChatContainer/ChatContainer.scss

@@ -1,60 +0,0 @@
-@use '../../../styles/variables';
-
-.#{variables.$ns}chat-container {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    width: 100%;
-    overflow: hidden;
-    background: var(--g-aikit-chat-container-background);
-
-    &__header {
-        display: flex;
-        padding: var(--g-aikit-layout-base-padding-m);
-        flex-direction: column;
-        align-items: flex-start;
-        gap: var(--g-spacing-2);
-        align-self: stretch;
-        background: var(--g-aikit-chat-container-header-background);
-    }
-
-    &__content {
-        min-height: 0; // Important for proper overflow behavior in child elements
-        display: flex;
-        flex-direction: column;
-        align-items: flex-start;
-        align-self: stretch;
-        background: var(--g-aikit-chat-container-content-background);
-
-        padding: 0 var(--g-aikit-layout-base-padding-m) var(--g-spacing-4)
-            var(--g-aikit-layout-base-padding-m);
-        gap: var(--g-spacing-2);
-        flex: 1 0 0;
-    }
-
-    &__content_view_empty {
-        background: var(--g-aikit-chat-container-content-empty-background);
-    }
-
-    &__content_view_chat {
-        background: var(--g-aikit-chat-container-content-chat-background);
-    }
-
-    &__footer {
-        display: flex;
-        padding: var(--g-aikit-layout-base-padding-m);
-        flex-direction: column;
-        align-items: flex-start;
-        gap: var(--g-spacing-1);
-        align-self: stretch;
-        background: var(--g-aikit-chat-container-footer-background);
-    }
-
-    &__footer_view_empty {
-        background: var(--g-aikit-chat-container-footer-empty-background);
-    }
-
-    &__footer_view_chat {
-        background: var(--g-aikit-chat-container-footer-chat-background);
-    }
-}

package/dist/components/templates/ChatContent/ChatContent.scss

@@ -1,30 +0,0 @@
-@use '../../../styles/variables';
-@use '../../../styles/functions' as *;
-
-$block: '.#{variables.$ns}chat-content';
-
-#{$block} {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    overflow: hidden;
-    background: var(--g-aikit-chat-content-background);
-    align-items: flex-start;
-    gap: var(--g-spacing-2);
-    flex: 1 0 0;
-    align-self: stretch;
-
-    &__message-list-container {
-        display: flex;
-        flex-direction: column;
-        align-items: flex-start;
-        gap: var(--g-spacing-4);
-        align-self: stretch;
-        flex: 1;
-        min-height: 0;
-    }
-
-    &__message-list {
-        padding: var(--g-spacing-2) var(--g-spacing-2) 0 var(--g-spacing-2);
-    }
-}

package/dist/components/templates/EmptyContainer/EmptyContainer.scss

@@ -1,86 +0,0 @@
-@use '../../../styles/variables';
-
-.#{variables.$ns}empty-container {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    width: 100%;
-    background: var(--g-aikit-empty-container-background);
-
-    &__content {
-        flex: 1;
-        display: flex;
-        flex-direction: column;
-        align-self: stretch;
-        gap: var(--g-aikit-empty-container-content-gap);
-        padding: var(--g-aikit-empty-container-padding);
-    }
-
-    &__welcome-section {
-        display: flex;
-        flex-direction: column;
-        gap: var(--g-spacing-6);
-    }
-
-    &__text-container {
-        display: flex;
-        flex-direction: column;
-        gap: var(--g-spacing-3);
-    }
-
-    &__image-container {
-        display: flex;
-        flex: 1;
-
-        &_align {
-            &_left {
-                justify-content: flex-start;
-            }
-
-            &_center {
-                justify-content: center;
-            }
-
-            &_right {
-                justify-content: flex-end;
-            }
-        }
-    }
-
-    &__title,
-    &__description {
-        &_align {
-            &_left {
-                text-align: left;
-            }
-
-            &_center {
-                text-align: center;
-            }
-
-            &_right {
-                text-align: right;
-            }
-        }
-    }
-
-    &__suggestions-section {
-        display: flex;
-        flex-direction: column;
-        gap: var(--g-spacing-3);
-    }
-
-    &__suggestions-title {
-        display: flex;
-        padding: 0 var(--g-spacing-2);
-        align-items: flex-start;
-        gap: var(--g-spacing-2);
-        align-self: stretch;
-    }
-
-    &__show-more {
-        display: flex;
-        justify-content: flex-start;
-        padding-top: var(--g-spacing-2);
-    }
-}

package/dist/components/templates/History/History.scss

@@ -1,103 +0,0 @@
-@use '../../../styles/variables';
-@use '../../../styles/functions' as *;
-
-$block: '.#{variables.$ns}history';
-
-#{$block} {
-    &__container {
-        display: flex;
-        flex-direction: column;
-        width: var(--g-aikit-history-width);
-        background: var(--g-color-base-background);
-    }
-
-    &__list-wrapper {
-        flex: 1;
-    }
-
-    &__list {
-        padding: 0 spacing(2) 0 spacing(2);
-        overflow: auto;
-        max-height: var(--g-aikit-history-max-height);
-    }
-
-    &__list-item {
-        border-radius: 6px;
-    }
-
-    &__filter {
-        padding: spacing(2);
-        border-bottom: 1px solid var(--g-color-line-generic);
-        margin-bottom: 0;
-    }
-
-    &__date-header {
-        display: flex;
-        padding: var(--g-spacing-3) var(--g-spacing-2) var(--g-spacing-1) var(--g-spacing-2);
-        flex-direction: column;
-        align-items: flex-start;
-        gap: spacing(3);
-        align-self: stretch;
-    }
-
-    &__chat-item {
-        cursor: pointer;
-        display: flex;
-        padding: spacing(2) spacing(4);
-        align-items: center;
-        gap: spacing(4);
-        align-self: stretch;
-        flex: 1;
-        min-width: 0;
-
-        &_active {
-            #{$block}__delete-button {
-                display: block;
-            }
-        }
-    }
-
-    &__chat-content {
-        height: var(--g-aikit-history-item-height);
-        flex: 1;
-        min-width: 0;
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-
-        > * {
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            min-width: 0;
-        }
-    }
-
-    &__icon-button {
-        color: var(--g-color-text-secondary);
-    }
-
-    &__delete-button {
-        margin-left: spacing(2);
-        display: none;
-    }
-
-    &__empty {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        padding: spacing(8) spacing(4);
-        color: var(--g-color-text-secondary);
-        font-size: var(--g-text-body-2-font-size);
-        text-align: center;
-        flex: 1;
-    }
-
-    &__loader-wrapper {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        padding: spacing(8) spacing(4);
-        flex: 1;
-    }
-}

package/dist/styles/_functions.scss

@@ -1,5 +0,0 @@
-// spacing @gravity-ui/uikit layout
-
-@function spacing($multiplier: 1) {
-    @return calc(var(--g-spacing-base) * $multiplier);
-}

package/dist/styles/variables.scss

@@ -1 +0,0 @@
-$ns: 'g-aikit-';