feat: manually mirror opencoze's code from bytedance

Change-Id: I09a73aadda978ad9511264a756b2ce51f5761adf

frontend/packages/common/assets/.stylelintrc.js

@@ -0,0 +1,5 @@
+const { defineConfig } = require('@coze-arch/stylelint-config');
+
+module.exports = defineConfig({
+  extends: [],
+});

frontend/packages/common/assets/README.md

@@ -0,0 +1,63 @@
+# @coze-common/assets
+
+通用全局样式 & 图片啥的
+
+## Overview
+
+This package is part of the Coze Studio monorepo and provides utilities functionality. It serves as a core component in the Coze ecosystem.
+
+## Getting Started
+
+### Installation
+
+Add this package to your `package.json`:
+
+```json
+{
+  "dependencies": {
+    "@coze-common/assets": "workspace:*"
+  }
+}
+```
+
+Then run:
+
+```bash
+rush update
+```
+
+### Usage
+
+```typescript
+import { /* exported functions/components */ } from '@coze-common/assets';
+
+// Example usage
+// TODO: Add specific usage examples
+```
+
+## Features
+
+- Core functionality for Coze Studio
+- TypeScript support
+- Modern ES modules
+
+## API Reference
+
+Please refer to the TypeScript definitions for detailed API documentation.
+
+## Development
+
+This package is built with:
+
+- TypeScript
+- Modern JavaScript
+
+- ESLint for code quality
+
+## Contributing
+
+This package is part of the Coze Studio monorepo. Please follow the monorepo contribution guidelines.
+
+## License
+
+Apache-2.0

frontend/packages/common/assets/config/rush-project.json

@@ -0,0 +1,8 @@
+{
+  "operationSettings": [
+    {
+      "operationName": "ts-check",
+      "outputFolderNames": ["./dist"]
+    }
+  ]
+}

frontend/packages/common/assets/config/rushx-config.json

@@ -0,0 +1,6 @@
+{
+  "codecov": {
+    "coverage": 0,
+    "incrementCoverage": 0
+  }
+}

frontend/packages/common/assets/eslint.config.js

@@ -0,0 +1,7 @@
+const { defineConfig } = require('@coze-arch/eslint-config');
+
+module.exports = defineConfig({
+  packageRoot: __dirname,
+  preset: 'web',
+  rules: {},
+});

frontend/packages/common/assets/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@coze-common/assets",
+  "version": "0.0.1",
+  "description": "通用全局样式 & 图片啥的",
+  "license": "Apache-2.0",
+  "author": "fanchen@bytedance.com",
+  "maintainers": [],
+  "scripts": {
+    "build": "exit 0",
+    "lint": "eslint ./ --cache"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "@coze-arch/eslint-config": "workspace:*",
+    "@coze-arch/stylelint-config": "workspace:*",
+    "@coze-arch/ts-config": "workspace:*",
+    "@types/react": "18.2.37",
+    "@types/react-dom": "18.2.15",
+    "react": "~18.2.0",
+    "react-dom": "~18.2.0"
+  }
+}
+

frontend/packages/common/assets/style/common.less

@@ -0,0 +1,13 @@
+@common-box-shadow: 0px 2px 8px 0px rgba(31, 35, 41, 0.02),
+  0px 2px 4px 0px rgba(31, 35, 41, 0.02), 0px 2px 2px 0px rgba(31, 35, 41, 0.02);
+
+.common-svg-icon(@size:14px, @color:#3370ff) {
+  > svg {
+    width: @size;
+    height: @size;
+
+    > path {
+      fill: @color;
+    }
+  }
+}

frontend/packages/common/assets/style/image-colors.less

@@ -0,0 +1,98 @@
+@layer base {
+
+  // 新增css色值，仅业务使用；
+  :root {
+    --coze-fg-image-bots: rgba(6, 7, 9, 80%);
+    --coze-fg-image-white: rgba(255, 255, 255);
+    --coze-fg-image-user: rgba(255, 255, 255, 92%);
+    --coze-fg-image-user-name: rgba(255, 255, 255);
+    --coze-fg-image-secondary: rgba(255, 255, 255, 60%);
+    --coze-bg-image-user: rgba(56, 57, 58, 70%);
+    --coze-bg-image-bots: rgba(249, 249, 249, 80%);
+    --coze-bg-image-question: rgba(235, 235, 235, 65%);
+    --coze-stroke-image-bots: rgba(6, 7, 9, 10%);
+    --coze-stroke-image-user: rgba(255, 255, 255, 12%);
+    --coze-stroke-image-hover: rgba(255, 255, 255, 28%);
+  }
+}
+
+@layer components {
+
+  // 新增语义化class，仅业务使用；
+  .coz-fg-images-bots {
+    color: var(--coze-fg-images-bots);
+  }
+
+  .coz-fg-images-white {
+    color: var(--coze-fg-image-white);
+    text-shadow: 0 0.5px 1px rgba(0, 0, 0, 25%);
+  }
+
+  .coz-bg-images-white {
+    background-color: var(--coze-fg-image-white);
+
+  }
+
+  .coz-fg-images-user {
+    color: var(--coze-fg-image-user);
+  }
+
+  .coz-fg-images-user-name {
+    color: var(--coze-fg-image-user-name);
+    text-shadow: 0 0.5px 1px rgba(0, 0, 0, 50%);
+  }
+
+  .coz-fg-images-secondary {
+    color: var(--coze-fg-image-secondary);
+  }
+
+  .coz-bg-images-secondary {
+    background-color: var(--coze-fg-image-secondary);
+  }
+
+  .coz-bg-image-user {
+    background-color: var(--coze-bg-image-user);
+    //  由于Chrome浏览器不兼容 父级使用mask 和 子级使用backdrop-filter，表现为backdrop-filter不生效，这里增加滤镜替代方案
+    // 规划后期气泡改为实色方案，删除此属性
+    filter: drop-shadow(0 0 0 var(--coze-bg-image-user));
+    backdrop-filter: drop-shadow(0 0 0 var(--coze-bg-image-user));
+    // stylelint-disable-next-line -- 必须兼容这种情况
+    -webkit-backdrop-filter: drop-shadow(0 0 0 var(--coze-bg-image-user));
+  }
+
+  .coz-bg-image-bots {
+    background-color: var(--coze-bg-image-bots);
+    filter: drop-shadow(0 0 0 var(--coze-bg-image-bots));
+    backdrop-filter: drop-shadow(0 0 0 var(--coze-bg-image-bots));
+    // stylelint-disable-next-line -- 必须兼容这种情况
+    -webkit-backdrop-filter: drop-shadow(0 0 0 var(--coze-bg-image-bots));
+  }
+
+  .coz-bg-image-question {
+    background-color: var(--coze-bg-image-question);
+    filter: drop-shadow(0 0 0 var(--coze-bg-image-question));
+    backdrop-filter: drop-shadow(0 0 0 var(--coze-bg-image-question));
+    // stylelint-disable-next-line -- 必须兼容这种情况
+    -webkit-backdrop-filter: drop-shadow(0 0 0 var(--coze-bg-image-question));
+  }
+
+  .coz-stroke-image-bots {
+    border: 1px solid var(--coze-stroke-image-bots)
+  }
+
+  .coz-stroke-image-user {
+    border: 1px solid var(--coze-stroke-image-user)
+  }
+
+  .coz-stroke-image-hover {
+    border: 1px solid var(--coze-stroke-image-hover);
+  }
+
+  .coz-fg-images-bots-2 {
+    @apply text-foreground-3;
+  }
+
+  .coz-fg-images-bots-3 {
+    color: rgba(var(--coze-fg-3)); // 可以继续复用 base token 里的色值；
+  }
+}

frontend/packages/common/assets/style/index.less

@@ -0,0 +1,2 @@
+@import './tailwind.less';
+@import './image-colors.less';

frontend/packages/common/assets/style/mixins.less

@@ -0,0 +1,67 @@
+.border-line(@radius: 8px, @color: #eceef0) {
+  &::after {
+    content: '';
+    position: absolute;
+    width: 200%;
+    height: 200%;
+    top: 0;
+    left: 0;
+    transform-origin: 0 0;
+    border-width: 1px;
+    border-style: solid;
+    transform: scale(0.5, 0.5);
+    box-sizing: border-box;
+    pointer-events: none;
+    color: @color;
+    border-color: @color;
+    border-radius: @radius;
+  }
+}
+
+.base-border-line(@color: #eceef0) {
+  content: '';
+  display: inline-block;
+  position: absolute;
+  background: @color;
+}
+
+.border-left-line(@color: #eceef0) {
+  &::after {
+    top: 0;
+    left: 0;
+    bottom: 0;
+    width: 1px;
+    transform: scaleX(0.5);
+    .base-border-line(@color);
+  }
+}
+.border-right-line(@color: #eceef0) {
+  &::after {
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 1px;
+    transform: scaleX(0.5);
+    .base-border-line(@color);
+  }
+}
+.border-top-line(@color: #eceef0) {
+  &::after {
+    top: 0;
+    right: 0;
+    left: 0;
+    height: 1px;
+    transform: scaleY(0.5);
+    .base-border-line(@color);
+  }
+}
+.border-bottom-line(@color: #eceef0) {
+  &::after {
+    left: 0;
+    right: 0;
+    bottom: 0;
+    height: 1px;
+    transform: scaleY(0.5);
+    .base-border-line(@color);
+  }
+}

frontend/packages/common/assets/style/tailwind.less

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind utilities;
+@tailwind components;

frontend/packages/common/assets/style/variables.less

@@ -0,0 +1,13 @@
+@bg-gray-blue: rgba(
+  240,
+  245,
+  255,
+  0.81
+); // highlight the area of the background
+@text-gray-blue: #536eb1; // highlight the area of the text
+
+@bg-white-smoke: #f5f5f5; // background of input/table/btn TODO：rgba(46, 50, 56, 0.05)) #2e3238
+@border-light-gray: rgba(28, 29, 35, 0.12);
+@error-red: #f93920;
+@text-title-black: #2e3238;
+@text-highlight-blue: #3370ff;

frontend/packages/common/assets/svg/default-agent-logo.svg

@@ -0,0 +1,4 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="64" height="64" rx="8" fill="#E8E8EA"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.8282 24.3937C14.6856 20.6529 17.7136 17.9991 21.4554 17.1463C24.1276 16.5373 27.5923 16 31.5001 16C35.4078 16 38.8725 16.5373 41.5447 17.1463C45.2865 17.9991 48.3144 20.6529 49.1717 24.3936C49.6371 26.4242 50 28.9955 50 32.0772C50 35.5629 49.5357 38.3594 48.984 40.4522C48.1535 43.6022 45.645 45.8852 42.4839 46.6729C39.8563 47.3277 36.1635 47.9344 31.5001 47.9344C26.8366 47.9344 23.1438 47.3277 20.5162 46.6729C17.3551 45.8852 14.8464 43.6022 14.016 40.452C13.4643 38.3594 13 35.5628 13 32.0772C13 28.9956 13.3629 26.4242 13.8282 24.3937ZM38.0978 33.3965C38.0978 31.9368 39.281 30.7536 40.7407 30.7536C42.2003 30.7536 43.3835 31.9368 43.3835 33.3965V36.0393C43.3835 37.4989 42.2003 38.6821 40.7407 38.6821C39.281 38.6821 38.0978 37.4989 38.0978 36.0393V33.3965ZM22.2407 30.7537C20.7811 30.7537 19.5979 31.937 19.5979 33.3966V36.0394C19.5979 37.499 20.7811 38.6823 22.2407 38.6823C23.7003 38.6823 24.8836 37.499 24.8836 36.0394V33.3966C24.8836 31.937 23.7003 30.7537 22.2407 30.7537Z" fill="#CDCDCD"/>
+</svg>

frontend/packages/common/assets/svg/icon_ai.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd"
+    d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM9.48544 7H11.0225C11.2106 7 11.3793 7.12745 11.4465 7.32043L14.5702 16.2923C14.6838 16.6186 14.4641 16.9686 14.1456 16.9686H13.3052C13.1152 16.9686 12.9453 16.8389 12.8792 16.6435L12.3143 14.9739H8.18872L7.62275 16.6422C7.55654 16.8373 7.38669 16.9668 7.19682 16.9668H6.36382C6.04537 16.9668 5.82567 16.6169 5.93924 16.2906L9.06143 7.32043C9.12863 7.12745 9.48544 7 9.48544 7ZM8.8588 12.9804H11.6401L10.2689 8.94692H10.2262L8.8588 12.9804ZM16.2827 7C15.973 7 15.722 7.25106 15.722 7.56075V16.4393C15.722 16.7489 15.973 17 16.2827 17H17.0304C17.3401 17 17.5911 16.7489 17.5911 16.4393V7.56075C17.5911 7.25106 17.3401 7 17.0304 7H16.2827Z"
+    fill="#1D1C23" />
+</svg>

frontend/packages/common/assets/svg/icon_ai_active.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd"
+    d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM9.48544 7H11.0225C11.2106 7 11.3793 7.12745 11.4465 7.32043L14.5702 16.2923C14.6838 16.6186 14.4641 16.9686 14.1456 16.9686H13.3052C13.1152 16.9686 12.9453 16.8389 12.8792 16.6435L12.3143 14.9739H8.18872L7.62275 16.6422C7.55654 16.8373 7.38669 16.9668 7.19682 16.9668H6.36382C6.04537 16.9668 5.82567 16.6169 5.93924 16.2906L9.06143 7.32043C9.12863 7.12745 9.48544 7 9.48544 7ZM8.8588 12.9804H11.6401L10.2689 8.94692H10.2262L8.8588 12.9804ZM16.2827 7C15.973 7 15.722 7.25106 15.722 7.56075V16.4393C15.722 16.7489 15.973 17 16.2827 17H17.0304C17.3401 17 17.5911 16.7489 17.5911 16.4393V7.56075C17.5911 7.25106 17.3401 7 17.0304 7H16.2827Z"
+    fill="#4D53E8" />
+</svg>

frontend/packages/common/assets/svg/icon_all.svg

@@ -0,0 +1,18 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g clip-path="url(#clip0_1163_68314)">
+        <mask id="mask0_1163_68314" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="16">
+            <path d="M16 0H0V16H16V0Z" fill="white"/>
+        </mask>
+        <g mask="url(#mask0_1163_68314)">
+            <path d="M0.941895 4.15078C0.941895 2.37897 2.37824 0.942627 4.15005 0.942627C5.92187 0.942627 7.35821 2.37897 7.35821 4.15078V6.07568C7.35821 6.7844 6.78367 7.35894 6.07494 7.35894H4.15005C2.37824 7.35894 0.941895 5.9226 0.941895 4.15078Z" fill="#1D1C23"/>
+            <path d="M0.941895 11.8503C0.941895 10.0784 2.37824 8.64209 4.15005 8.64209H6.07494C6.78367 8.64209 7.35821 9.21663 7.35821 9.92535V11.8503C7.35821 13.6221 5.92187 15.0584 4.15005 15.0584C2.37824 15.0584 0.941895 13.6221 0.941895 11.8503Z" fill="#1D1C23"/>
+            <path d="M9.92462 8.64209C9.2159 8.64209 8.64136 9.21663 8.64136 9.92535V11.8503C8.64136 13.6221 10.0777 15.0584 11.8495 15.0584C13.6213 15.0584 15.0577 13.6221 15.0577 11.8503C15.0577 10.0784 13.6213 8.64209 11.8495 8.64209H9.92462Z" fill="#1D1C23"/>
+            <path d="M8.6416 4.15054C8.6416 2.37872 10.0779 0.942383 11.8498 0.942383C13.6216 0.942383 15.0579 2.37872 15.0579 4.15054C15.0579 5.92235 13.6216 7.3587 11.8498 7.3587H9.92486C9.21614 7.3587 8.6416 6.78416 8.6416 6.07543V4.15054Z" fill="#1D1C23"/>
+        </g>
+    </g>
+    <defs>
+        <clipPath id="clip0_1163_68314">
+            <rect width="16" height="16" fill="white"/>
+        </clipPath>
+    </defs>
+</svg>

frontend/packages/common/assets/svg/icon_all_active.svg

@@ -0,0 +1,18 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g clip-path="url(#clip0_1163_68199)">
+        <mask id="mask0_1163_68199" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="16">
+            <path d="M16 0H0V16H16V0Z" fill="white"/>
+        </mask>
+        <g mask="url(#mask0_1163_68199)">
+            <path d="M0.941895 4.15078C0.941895 2.37897 2.37824 0.942627 4.15005 0.942627C5.92187 0.942627 7.35821 2.37897 7.35821 4.15078V6.07568C7.35821 6.7844 6.78367 7.35894 6.07494 7.35894H4.15005C2.37824 7.35894 0.941895 5.9226 0.941895 4.15078Z" fill="#4D53E8"/>
+            <path d="M0.941895 11.8503C0.941895 10.0784 2.37824 8.64209 4.15005 8.64209H6.07494C6.78367 8.64209 7.35821 9.21663 7.35821 9.92535V11.8503C7.35821 13.6221 5.92187 15.0584 4.15005 15.0584C2.37824 15.0584 0.941895 13.6221 0.941895 11.8503Z" fill="#4D53E8"/>
+            <path d="M9.92462 8.64209C9.2159 8.64209 8.64136 9.21663 8.64136 9.92535V11.8503C8.64136 13.6221 10.0777 15.0584 11.8495 15.0584C13.6213 15.0584 15.0577 13.6221 15.0577 11.8503C15.0577 10.0784 13.6213 8.64209 11.8495 8.64209H9.92462Z" fill="#4D53E8"/>
+            <path d="M8.6416 4.15054C8.6416 2.37872 10.0779 0.942383 11.8498 0.942383C13.6216 0.942383 15.0579 2.37872 15.0579 4.15054C15.0579 5.92235 13.6216 7.3587 11.8498 7.3587H9.92486C9.21614 7.3587 8.6416 6.78416 8.6416 6.07543V4.15054Z" fill="#4D53E8"/>
+        </g>
+    </g>
+    <defs>
+        <clipPath id="clip0_1163_68199">
+            <rect width="16" height="16" fill="white"/>
+        </clipPath>
+    </defs>
+</svg>

frontend/packages/common/assets/svg/widget-cover-load-fail-dark.svg

@@ -0,0 +1,33 @@
+<svg width="68" height="78" viewBox="0 0 68 78" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g filter="url(#filter0_d_4434_146488)">
+    <rect x="7" y="5" width="54" height="64" rx="3" fill="#1C2333" shape-rendering="crispEdges" />
+    <rect x="6.75" y="4.75" width="54.5" height="64.5" rx="3.25" stroke="#99B6FF" stroke-opacity="0.12"
+      stroke-width="0.5" shape-rendering="crispEdges" />
+    <rect x="11" y="9" width="46" height="16" rx="1" fill="white" fill-opacity="0.1" />
+    <g clip-path="url(#clip0_4434_146488)">
+      <rect x="11" y="28" width="46" height="3" rx="1.5" fill="white" fill-opacity="0.08" />
+      <rect x="11" y="33" width="22" height="3" rx="1.5" fill="white" fill-opacity="0.08" />
+      <rect x="11" y="38" width="26" height="3" rx="1.5" fill="white" fill-opacity="0.08" />
+      <rect x="11" y="44" width="46" height="3" rx="1.5" fill="white" fill-opacity="0.08" />
+      <rect x="11" y="49" width="22" height="3" rx="1.5" fill="white" fill-opacity="0.08" />
+      <rect x="11" y="54" width="26" height="3" rx="1.5" fill="white" fill-opacity="0.08" />
+    </g>
+  </g>
+  <defs>
+    <filter id="filter0_d_4434_146488" x="0.5" y="0.5" width="67" height="77" filterUnits="userSpaceOnUse"
+      color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+        result="hardAlpha" />
+      <feOffset dy="2" />
+      <feGaussianBlur stdDeviation="3" />
+      <feComposite in2="hardAlpha" operator="out" />
+      <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
+      <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4434_146488" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4434_146488" result="shape" />
+    </filter>
+    <clipPath id="clip0_4434_146488">
+      <rect width="46" height="29" fill="white" transform="translate(11 28)" />
+    </clipPath>
+  </defs>
+</svg>

frontend/packages/common/assets/svg/widget-cover-load-fail-default.svg

@@ -0,0 +1,33 @@
+<svg width="68" height="78" viewBox="0 0 68 78" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g filter="url(#filter0_d_4434_161940)">
+    <rect x="7" y="5" width="54" height="64" rx="3" fill="#F9F9F9" shape-rendering="crispEdges" />
+    <rect x="6.75" y="4.75" width="54.5" height="64.5" rx="3.25" stroke="#060709" stroke-opacity="0.1"
+      stroke-width="0.5" shape-rendering="crispEdges" />
+    <rect x="11" y="9" width="46" height="16" rx="1" fill="#060709" fill-opacity="0.12" />
+    <g clip-path="url(#clip0_4434_161940)">
+      <rect x="11" y="28" width="46" height="3" rx="1.5" fill="#060709" fill-opacity="0.08" />
+      <rect x="11" y="33" width="22" height="3" rx="1.5" fill="#060709" fill-opacity="0.08" />
+      <rect x="11" y="38" width="26" height="3" rx="1.5" fill="#060709" fill-opacity="0.08" />
+      <rect x="11" y="44" width="46" height="3" rx="1.5" fill="#060709" fill-opacity="0.08" />
+      <rect x="11" y="49" width="22" height="3" rx="1.5" fill="#060709" fill-opacity="0.08" />
+      <rect x="11" y="54" width="26" height="3" rx="1.5" fill="#060709" fill-opacity="0.08" />
+    </g>
+  </g>
+  <defs>
+    <filter id="filter0_d_4434_161940" x="0.5" y="0.5" width="67" height="77" filterUnits="userSpaceOnUse"
+      color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+        result="hardAlpha" />
+      <feOffset dy="2" />
+      <feGaussianBlur stdDeviation="3" />
+      <feComposite in2="hardAlpha" operator="out" />
+      <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
+      <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4434_161940" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4434_161940" result="shape" />
+    </filter>
+    <clipPath id="clip0_4434_161940">
+      <rect width="46" height="29" fill="white" transform="translate(11 28)" />
+    </clipPath>
+  </defs>
+</svg>

frontend/packages/common/assets/tsconfig.build.json

@@ -0,0 +1,24 @@
+{
+  "extends": "@coze-arch/ts-config/tsconfig.web.json",
+  "compilerOptions": {
+    "jsx": "preserve",
+    "useUnknownInCatchVariables": false,
+    "types": [],
+    "rootDir": "./src",
+    "outDir": "./dist",
+    "tsBuildInfoFile": "dist/tsconfig.build.tsbuildinfo"
+  },
+  "include": ["./src"],
+  "references": [
+    {
+      "path": "../../../config/eslint-config/tsconfig.build.json"
+    },
+    {
+      "path": "../../../config/stylelint-config/tsconfig.build.json"
+    },
+    {
+      "path": "../../../config/ts-config/tsconfig.build.json"
+    }
+  ],
+  "$schema": "https://json.schemastore.org/tsconfig"
+}

frontend/packages/common/assets/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "compilerOptions": {
+    "composite": true
+  },
+  "references": [
+    {
+      "path": "./tsconfig.build.json"
+    },
+    {
+      "path": "./tsconfig.misc.json"
+    }
+  ],
+  "exclude": ["**/*"]
+}

frontend/packages/common/assets/tsconfig.misc.json

@@ -0,0 +1,18 @@
+{
+  "extends": "@coze-arch/ts-config/tsconfig.web.json",
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "include": ["__tests__", "vitest.config.mts"],
+  "exclude": ["./dist"],
+  "references": [
+    {
+      "path": "./tsconfig.build.json"
+    }
+  ],
+  "compilerOptions": {
+    "jsx": "preserve",
+    "rootDir": "./",
+    "outDir": "./dist",
+    "useUnknownInCatchVariables": false,
+    "types": []
+  }
+}