Bug: Sender组件右下角出现可拖拽的小三角形

[ztygod]

应该是<textarea>引起的，有点不美观，加个css应该就行了

textarea {
  resize: none;
}

[ztygod]

写官网时候发现的

[fu050409]

感谢反馈，我检查一下

[fu050409]

@ztygod 参考：

matechat-react/src/sender.tsx

Line 164 in 4e2905b

className="w-full py-4 px-4 border-0 rounded-2xl resize-none focus:ring-0 focus:outline-none text-gray-700 placeholder-gray-400"

可以看到在Sender组件中已经基于TailwindCSS写入了resize-none，这应该表现为：

.resize-none {
    resize: none;
}

看起来没有问题，我使用pnpm dev启动playground后看到的页面正常（输入任意的token后并点击Activate Chat进入对话样例页面），你那里的playground正常工作吗？

[ztygod]

@fu050409 playground正常，可能是样式覆盖的问题我继续排查下

[ztygod]

@fu050409 目前排查下了，原因大概可能是tailwindcss没有生效或者被覆盖，通过tailwindcss插件的调式和rspress的配置都无法解决问题，目前采用手写样式的方案，可以达到效果。

/* todo: SenderDemo组件tailwindcss没有生效或被覆盖，目前采用手写样式方法，期待解决方案*/
textarea {
    resize: none;
    --text-xs: .75rem;
    --text-xs--line-height: calc(1/.75);
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25/.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5/1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75/1.125);
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --radius-md: .375rem;
    --radius-2xl: 1rem;
    --animate-bounce: bounce 1s infinite;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4,0,.2,1);
    --color-blue-300: lab(77.5052% -6.4629 -36.42);
    --color-gray-200: lab(91.6229% -.159085 -2.26791);
    --color-gray-400: lab(65.9269% -.832707 -8.17474);
    --color-gray-500: lab(47.7841% -.393212 -10.0268);
    --color-gray-700: lab(27.1134% -.956401 -12.3224);
    --color-gray-800: lab(16.1051% -1.18239 -11.7533);
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-blue-500: oklch(62.3% 0.214 259.815);
    --color-gray-100: oklch(96.7% 0.003 264.542);
    --color-gray-300: oklch(87.2% 0.01 258.338);
    --color-white: #fff;
    --spacing: 0.25rem;
    --container-xs: 20rem;
    --container-3xl: 48rem;
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --font-weight-bold: 700;
    --radius-lg: 0.5rem;
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    -webkit-tap-highlight-color: transparent;
    --tw-duration: .3s;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    background-color: transparent;
    opacity: 1;
    resize: none;
    border-radius: var(--radius-2xl);
    border-style: var(--tw-border-style);
    border-width: 0;
    padding-block: calc(var(--spacing)*4);
    color: var(--color-gray-700);
    width: 100%;
    padding-inline: calc(var(--spacing) * 4);
    height: 56px;
    overflow-y: hidden;
}  

效果如下

（注： 样式取自playground中的Sender组件，打开浏览器开发工具，选择复制样式）

期待其他更好解决方案！

[fu050409]

@ztygod 检查一下rspress的tailwind插件版本是否一致呢？