@bothub-chat/ui 2.50.2-develop-6d722f0e-68f4-46ee-bf96-67bf4eedf7ad → 2.51.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/components/input-message/index.d.ts +4 -2
- package/dist/components/input-message/index.js +1 -1
- package/dist/components/input-message/styled.d.ts +5998 -3999
- package/dist/components/input-message/styled.js +26 -6
- package/dist/components/input-message/types.d.ts +6 -0
- package/package.json +1 -1
|
@@ -1,14 +1,34 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{styled as i,css as a,keyframes as n}from"styled-components";import{animated as s}from"@react-spring/web";import{Button as r}from"../button/index.js";import{EnterIcon as l}from"../../icons/enter/index.js";import{
|
|
1
|
+
import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{styled as i,css as a,keyframes as n}from"styled-components";import{animated as s}from"@react-spring/web";import{Button as r}from"../button/index.js";import{EnterIcon as l}from"../../icons/enter/index.js";import{SendIcon as d}from"../../icons/send/index.js";import{CloseIcon as c}from"../../icons/close/index.js";import{Chip as p}from"../chip/index.js";import{VoiceIcon as g}from"../../icons/voice/index.js";import{PauseIcon as m}from"../../icons/pause/index.js";import{PlayIcon as u}from"../../icons/play/index.js";import{Plus2Icon as y}from"../../icons/plus-2/index.js";import{ExclamationIcon as h}from"../../icons/exclamation/index.js";import"tslib";import{IconProvider as x}from"../icon/context.js";import"../icon/styled.js";import"react";import"react-markdown";import"react-dom";import"../portal/styled.js";import"../tooltip/styled.js";import"../tooltip/arrow/styled.js";import"../../theme/index.js";import"../tooltip/context.js";import{Typography as f}from"../typography/index.js";import{adaptive as b}from"../../adaptive/index.js";const w=i.div.withConfig({displayName:"styled__InputMessageStyled",componentId:"sc-4jukeb-0"})(["display:flex;flex-direction:column;gap:14px;position:relative;border-radius:10px;border:1px solid ",";background:",";width:100%;padding:14px 20px;max-width:",";box-sizing:border-box;overflow:visible;cursor:",";outline:none;"," ",""],({theme:e,$active:t,$disabled:o})=>o?e.colors.grayScale.gray2:t?e.colors.accent.primary:e.colors.grayScale.gray2,({theme:e,$disabled:t})=>t?e.colors.grayScale.gray3:"light"===e.mode?e.default.colors.base.white:e.colors.grayScale.gray4,({theme:e})=>e.dashboard.chat.containerWidth,({$disabled:e,$textAreaDisabled:t,$voiceRecording:o})=>e?"not-allowed":t||o?"default":"text",({$disabled:e})=>!e&&a`
|
|
2
2
|
&:hover {
|
|
3
3
|
border-color: ${({theme:e})=>e.colors.accent.primary};
|
|
4
4
|
}
|
|
5
|
-
`,({$dragActive:e})=>e&&"\n opacity: 0.85;\n "),
|
|
5
|
+
`,({$dragActive:e})=>e&&"\n opacity: 0.85;\n "),I=i.div.withConfig({displayName:"styled__InputMessageContent",componentId:"sc-4jukeb-1"})(["width:100%;gap:14px;display:grid;grid-template-areas:'input input input' 'configure . buttons';grid-auto-rows:min-content;grid-auto-columns:min-content auto min-content;align-items:center;"]),_=i.div.withConfig({displayName:"styled__InputMessageConfigure",componentId:"sc-4jukeb-2"})(["display:flex;align-items:center;gap:14px;position:relative;width:fit-content;height:100%;user-select:none;grid-area:configure;"]),k=i.button.attrs({children:e(y,{})}).withConfig({displayName:"styled__InputMessageConfigureButton",componentId:"sc-4jukeb-3"})(["all:unset;display:flex;align-items:center;padding:10px;border-radius:8px;background-color:",";transition:background-color 300ms ease-in-out,transform 50ms ease-in;&:hover{cursor:pointer;background-color:",";}&:active{transform:scale(0.98) translateY(1px);}",""],({theme:e})=>e.colors.grayScale.gray4,({theme:e})=>e.colors.grayScale.gray3,({theme:e,$disabled:t})=>t&&a`
|
|
6
|
+
background-color: ${e.colors.grayScale.gray2} !important;
|
|
7
|
+
`),j=i(s.div).withConfig({displayName:"styled__InputMessageConfigureMenu",componentId:"sc-4jukeb-4"})(["position:absolute;bottom:calc(100% + 8px);left:0;width:max-content;display:flex;justify-content:center;flex-direction:column;padding:8px;border-radius:10px;border:1px solid ",";background-color:",";"],({theme:e})=>e.colors.grayScale.gray2,({theme:e})=>e.colors.grayScale.gray4),v=a`
|
|
8
|
+
all: unset;
|
|
9
|
+
display: flex;
|
|
10
|
+
flex: 1;
|
|
11
|
+
align-items: center;
|
|
12
|
+
padding: 10px 12px;
|
|
13
|
+
gap: 8px;
|
|
14
|
+
border-radius: 8px;
|
|
15
|
+
`,M=i.button.attrs(({theme:i,children:a,icon:n})=>({children:t(o,{children:[n&&e(x,{fill:i.colors.base.white,size:18,children:n}),e(f,{variant:"body-m-medium",children:a})]})})).withConfig({displayName:"styled__InputMessageMenuOption",componentId:"sc-4jukeb-5"})([""," &:hover{cursor:pointer;background-color:",";}&:active{transform:scale(0.98) translateY(1px);}"],v,({theme:e})=>e.colors.grayScale.gray3),C=i.div.withConfig({displayName:"styled__InputMessageUploadFile",componentId:"sc-4jukeb-6"})(["display:inline-flex;"]),S=i.input.attrs({id:"inputMessageUploadFileInput"}).withConfig({displayName:"styled__InputMessageUploadFileInput",componentId:"sc-4jukeb-7"})(["display:none;"]),N=i.label.attrs({htmlFor:"inputMessageUploadFileInput"}).withConfig({displayName:"styled__InputMessageUploadFileLabel",componentId:"sc-4jukeb-8"})([""," ",""],v,({theme:e,$disabled:t})=>t?a`
|
|
16
|
+
background-color: ${e.colors.grayScale.gray2};
|
|
17
|
+
`:a`
|
|
18
|
+
&:hover {
|
|
19
|
+
cursor: pointer;
|
|
20
|
+
background-color: ${({theme:e})=>e.colors.grayScale.gray3};
|
|
21
|
+
}
|
|
22
|
+
&:active {
|
|
23
|
+
transform: scale(0.98) translateY(1px);
|
|
24
|
+
}
|
|
25
|
+
`),$=i.hr.withConfig({displayName:"styled__InputMessageMenuHr",componentId:"sc-4jukeb-9"})(["all:unset;margin-block:8px;height:1px;width:100%;background-color:",";"],({theme:e})=>e.colors.grayScale.gray2),F=i.div.withConfig({displayName:"styled__InputMessageMain",componentId:"sc-4jukeb-10"})(["display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:14px;width:100%;grid-area:input;"]),z=i.div.withConfig({displayName:"styled__InputMessageButtons",componentId:"sc-4jukeb-11"})(["display:flex;gap:10px;align-items:center;grid-area:buttons;"]),V=i.div.withConfig({displayName:"styled__InputMessageFiles",componentId:"sc-4jukeb-12"})(["display:flex;flex-wrap:wrap;gap:10px 14px;cursor:default;max-height:200px;overflow-y:auto;"]),T=i(p).attrs({variant:"input"}).withConfig({displayName:"styled__InputMessageFile",componentId:"sc-4jukeb-13"})([""]),B=i(V).withConfig({displayName:"styled__InputMessageVoiceFiles",componentId:"sc-4jukeb-14"})(["width:100%;"]),R=i.div.withConfig({displayName:"styled__InputMessageVoiceTrack",componentId:"sc-4jukeb-15"})(["display:flex;gap:14px;align-items:center;"]),U=i(f).attrs(({theme:i,children:a})=>({variant:"body-m-regular",children:t(o,{children:[e(h,{fill:i.colors.accent.primaryLight}),a]})})).withConfig({displayName:"styled__InputMessageConcatenateWarning",componentId:"sc-4jukeb-16"})(["display:flex;align-items:center;gap:8px;color:",";"],({theme:e})=>e.colors.accent.primaryLight),Y=i(r).attrs({variant:"text",children:e(c,{})}).withConfig({displayName:"styled__InputMessageVoiceFileDelete",componentId:"sc-4jukeb-17"})([""]),A=i.textarea.withConfig({displayName:"styled__InputMessageTextArea",componentId:"sc-4jukeb-18"})(["display:flex;height:auto;width:100%;min-height:22px;max-height:270px;background:none;outline:none;resize:none;border:none;color:",";flex-shrink:0;overflow:auto;scrollbar-width:none;padding:0px;&::placeholder{color:",";}&::-webkit-scrollbar{display:none;}"," font-weight:400;font-size:18px;line-height:23.4px;@media (max-width:","){font-size:16px;line-height:22px;}"],({theme:e,$disabled:t})=>t?e.colors.grayScale.gray1:e.colors.base.white,({theme:e})=>e.colors.grayScale.gray1,({$disabled:e})=>e&&a`
|
|
6
26
|
cursor: not-allowed;
|
|
7
|
-
`,({theme:e})=>e.mobile.maxWidth),
|
|
27
|
+
`,({theme:e})=>e.mobile.maxWidth),D=i(r).withConfig({displayName:"styled__InputMessageSendButton",componentId:"sc-4jukeb-19"})(["flex-shrink:0;svg{pointer-events:none;}"]),L=i(r).attrs({variant:"text",children:e(m,{})}).withConfig({displayName:"styled__InputMessageVoicePauseButton",componentId:"sc-4jukeb-20"})(["padding:10px;margin-left:10px;"]),W=i(L).attrs({children:e(u,{})}).withConfig({displayName:"styled__InputMessageVoicePlayButton",componentId:"sc-4jukeb-21"})([""]),H=i(D).attrs(({theme:t,disabled:o})=>({variant:"text",startIcon:e(g,{}),iconFill:o?t.colors.grayScale.gray1:t.bright?t.default.colors.base.black:t.colors.base.white,disableHoverColor:!0})).withConfig({displayName:"styled__InputMessageVoiceButton",componentId:"sc-4jukeb-22"})(["margin-inline:10px;padding:10px;border-radius:8px;background-color:",";position:relative;z-index:0;"," &:before{content:'';height:140%;width:140%;position:absolute;top:-20%;left:-20%;background-color:",";opacity:",";filter:blur(18px);z-index:-1;transition:opacity 300ms ease-out;}"],({theme:e,$isRecording:t})=>t?e.colors.critic:"transparent",({theme:e,$isRecording:t})=>t&&a`
|
|
8
28
|
svg path {
|
|
9
29
|
fill: ${e.default.colors.base.white} !important;
|
|
10
30
|
}
|
|
11
|
-
`,({theme:e})=>e.colors.critic,({$isRecording:e})=>e?1:0),
|
|
31
|
+
`,({theme:e})=>e.colors.critic,({$isRecording:e})=>e?1:0),O=d,P=i.div.withConfig({displayName:"styled__InputMessageVoiceRecord",componentId:"sc-4jukeb-23"})(["display:flex;align-items:center;gap:8px;"]),q=i.span.withConfig({displayName:"styled__InputMessageVoiceRecordDot",componentId:"sc-4jukeb-24"})(["display:inline-flex;width:8px;height:8px;background:",";border-radius:50%;animation:"," 1s ease-in-out infinite;"],({theme:e})=>e.colors.critic,()=>n`
|
|
12
32
|
from {
|
|
13
33
|
opacity: 1;
|
|
14
34
|
}
|
|
@@ -18,8 +38,8 @@ import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{styled as
|
|
|
18
38
|
to {
|
|
19
39
|
opacity: 1;
|
|
20
40
|
}
|
|
21
|
-
`),
|
|
41
|
+
`),E=i(f).attrs({variant:"body-s-medium"}).withConfig({displayName:"styled__InputMessageVoiceRecordTimeText",componentId:"sc-4jukeb-25"})(["cursor:default;"]),G=i.div.withConfig({displayName:"styled__InputMessageToggleSendStyled",componentId:"sc-4jukeb-26"})(["position:relative;width:fit-content;height:fit-content;",""],b({tablet:a`
|
|
22
42
|
display: none;
|
|
23
43
|
`,mobile:a`
|
|
24
44
|
display: none;
|
|
25
|
-
`})),
|
|
45
|
+
`})),J=i(r).attrs({variant:"text",startIcon:e(l,{}),iconSize:24}).withConfig({displayName:"styled__InputMessageToggleSendButton",componentId:"sc-4jukeb-27"})(["svg{g path{fill:"," !important;}}display:flex;&:hover{svg{path{fill:"," !important;}}}"],({theme:e})=>e.colors.grayScale.gray3,({theme:e})=>"dark"===e.mode?e.colors.grayScale.gray2:e.colors.grayScale.gray1),K=i(s.div).withConfig({displayName:"styled__InputMessageToggleSendModalStyled",componentId:"sc-4jukeb-28"})(["display:flex;flex-direction:column;gap:6px;max-height:fit-content;width:max-content;max-width:60vw;padding:6px;position:absolute;bottom:calc(100% + 10px);right:0;border-radius:10px;border:1px "," solid;background-color:",";z-index:50;user-select:none;-moz-user-select:none;-webkit-user-select:none;"],({theme:e})=>e.colors.grayScale.gray2,({theme:e})=>"dark"===e.mode?e.colors.grayScale.gray4:e.default.colors.base.white),Q=i.button.withConfig({displayName:"styled__InputMessageToggleSendModalOption",componentId:"sc-4jukeb-29"})(["all:unset;margin:0;padding:12px;border-radius:8px;background-color:",";cursor:pointer;transition:opacity 0.1s ease-in-out,transform 0.1s ease-in-out,filter 0.1s ease-in-out;&:hover{filter:",";transition:filter 100ms ease-in-out;}&:active{transform:translateY(1px);}"],({theme:e,active:t})=>"dark"===e.mode?t?e.colors.grayScale.gray3:e.colors.grayScale.gray4:t?e.colors.grayScale.gray3:e.default.colors.base.white,({theme:e})=>"dark"===e.mode?"brightness(120%)":"brightness(80%)");export{z as InputMessageButtons,U as InputMessageConcatenateWarning,_ as InputMessageConfigure,k as InputMessageConfigureButton,j as InputMessageConfigureMenu,I as InputMessageContent,T as InputMessageFile,V as InputMessageFiles,F as InputMessageMain,$ as InputMessageMenuHr,M as InputMessageMenuOption,D as InputMessageSendButton,O as InputMessageSendIcon,w as InputMessageStyled,A as InputMessageTextArea,J as InputMessageToggleSendButton,Q as InputMessageToggleSendModalOption,K as InputMessageToggleSendModalStyled,G as InputMessageToggleSendStyled,C as InputMessageUploadFile,S as InputMessageUploadFileInput,N as InputMessageUploadFileLabel,H as InputMessageVoiceButton,Y as InputMessageVoiceFileDelete,B as InputMessageVoiceFiles,L as InputMessageVoicePauseButton,W as InputMessageVoicePlayButton,P as InputMessageVoiceRecord,q as InputMessageVoiceRecordDot,E as InputMessageVoiceRecordTimeText,R as InputMessageVoiceTrack};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
export interface IInputMessageFile {
|
|
2
3
|
name: string;
|
|
3
4
|
previewUrl: string | null;
|
|
@@ -9,3 +10,8 @@ export interface IInputMessageVoiceFile {
|
|
|
9
10
|
src: string;
|
|
10
11
|
blob: Blob;
|
|
11
12
|
}
|
|
13
|
+
export interface IConfigureOption {
|
|
14
|
+
icon?: React.ReactNode;
|
|
15
|
+
children?: React.ReactNode;
|
|
16
|
+
onClick?: () => unknown;
|
|
17
|
+
}
|