@droppii-org/chat-sdk 0.1.81 → 0.1.83

package/dist/assets/svg/empty-box.d.ts

@@ -0,0 +1,2 @@
+export declare const emptyBoxIcon: import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=empty-box.d.ts.map

package/dist/assets/svg/empty-box.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-box.d.ts","sourceRoot":"","sources":["../../../src/assets/svg/empty-box.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,yCAiCxB,CAAC"}

package/dist/assets/svg/empty-box.js

@@ -0,0 +1,2 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const emptyBoxIcon = (_jsxs("svg", { width: "120", height: "120", viewBox: "0 0 120 120", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsxs("g", { id: "grph", clipPath: "url(#clip0_0_44)", children: [_jsx("path", { id: "Vector", d: "M104.708 44.4234C106.778 44.4234 108.456 42.744 108.456 40.6724C108.456 38.6007 106.778 36.9213 104.708 36.9213C102.638 36.9213 100.961 38.6007 100.961 40.6724C100.961 42.744 102.638 44.4234 104.708 44.4234Z", fill: "#F2F6FE" }), _jsx("path", { id: "Vector_2", d: "M5.15652 64.7085C6.51824 64.7085 7.62213 63.6036 7.62213 62.2407C7.62213 60.8778 6.51824 59.7729 5.15652 59.7729C3.79481 59.7729 2.69092 60.8778 2.69092 62.2407C2.69092 63.6036 3.79481 64.7085 5.15652 64.7085Z", fill: "#F2F6FE" }), _jsx("path", { id: "Vector_3", d: "M16.4904 109.075C17.8521 109.075 18.956 107.97 18.956 106.607C18.956 105.244 17.8521 104.14 16.4904 104.14C15.1287 104.14 14.0248 105.244 14.0248 106.607C14.0248 107.97 15.1287 109.075 16.4904 109.075Z", fill: "#F2F6FE" }), _jsxs("g", { id: "Group 848", children: [_jsx("path", { id: "Vector_4", d: "M29.6698 109.075L64.2691 98.2337V53.7837L29.6698 64.5417V109.075Z", fill: "#F2F6FE", stroke: "#D4DAEC", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsx("path", { id: "Vector_5", d: "M98.8686 109.075L64.2692 98.2337V53.7837L98.8686 64.5417V109.075Z", fill: "#F2F6FE", stroke: "#D4DAEC", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsx("path", { id: "Vector_6", d: "M64.2691 120L29.6698 109.159V64.7085L64.2691 75.55V120Z", fill: "white", stroke: "#D4DAEC", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsx("path", { id: "Vector_7", d: "M64.2692 120L98.8686 109.159V64.7085L64.2692 75.55V120Z", fill: "white", stroke: "#D4DAEC", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsx("path", { id: "Vector_8", d: "M64.2692 53.7837L48.0017 41.6079L12.8243 53.4501L29.6698 64.5417L64.2692 53.7837Z", fill: "#F2F6FE", stroke: "#D4DAEC", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsx("path", { id: "Vector_9", d: "M64.2692 53.7837L80.5367 41.6079L115.714 53.4501L98.8686 64.5417L64.2692 53.7837Z", fill: "#F2F6FE", stroke: "#D4DAEC", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsx("path", { id: "Vector_10", d: "M29.6699 64.7085L64.2692 75.55L47.0108 86.5583L12.8244 75.2164L29.6699 64.7085Z", fill: "#F2F6FE", stroke: "#D4DAEC", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsx("path", { id: "Vector_11", d: "M98.8686 64.7085L64.2692 75.55L81.5276 86.5583L115.714 75.2164L98.8686 64.7085Z", fill: "#F2F6FE", stroke: "#D4DAEC", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" })] }), _jsx("path", { id: "Vector_12", d: "M73.9226 11.1102C78.7698 24.2648 80.2146 27.1877 80.6888 40.1497C80.5064 43.1085 80.3933 46.3259 78.9984 48.9166C77.1355 52.8798 72.5789 55.6245 68.2739 55.669C63.8389 55.7482 59.491 53.0328 57.534 48.8455C56.1571 46.3044 56.2009 42.8284 58.0896 40.5211C60.1428 38.3084 63.7549 37.7567 66.3533 39.1393C69.2116 40.4523 70.9176 43.1825 71.5495 46.0617C72.1814 48.941 71.9038 52.0639 71.1324 54.9033C69.5192 61.8092 68.1832 62.1432 64.227 73.8352", stroke: "#A9B2D0", strokeWidth: "2", strokeMiterlimit: "10", strokeDasharray: "4 4" }), _jsx("path", { id: "Vector_13", d: "M79.8222 4.14741C79.8109 6.08171 78.0109 7.26611 75.7282 6.64849C73.3247 6.23878 71.6236 5.81652 71.5141 4.09013C71.5693 2.31965 73.501 1.62671 75.7619 0.845586C78.4729 -0.23164 79.6688 2.2572 79.8222 4.14741Z", fill: "#F2F6FE", stroke: "#A9B2D0", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsx("path", { id: "Vector_14", d: "M64.2914 10.0625C65.5095 11.3164 68.0775 11.682 69.329 9.76668C70.7011 7.64345 71.8757 6.09987 70.6138 4.68213C69.3957 3.42822 68.2103 4.27242 65.4993 5.34965C63.3261 6.45841 62.8649 8.68881 64.2914 10.0625Z", fill: "#F2F6FE", stroke: "#A9B2D0", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" }), _jsxs("g", { id: "Vector_15", children: [_jsx("path", { d: "M69.9118 2.06124C71.0204 1.58876 72.3483 1.93539 72.9408 2.83013C73.1932 3.11367 73.4895 3.56104 73.5772 3.88868C74.5208 6.09398 74.2241 8.28029 72.9509 8.79685C71.557 9.52133 69.6366 8.27997 68.9016 6.1944C68.7261 5.53912 68.6383 5.21148 68.5067 4.72002C68.3642 3.52918 68.8033 2.53371 69.9118 2.06124C70.0765 2.01714 69.9118 2.06124 69.9118 2.06124Z", fill: "#F2F6FE" }), _jsx("path", { d: "M69.9118 2.06124C71.0204 1.58876 72.3483 1.93539 72.9408 2.83013C73.1932 3.11367 73.4895 3.56104 73.5772 3.88868C74.5208 6.09398 74.2241 8.28029 72.9509 8.79685C71.557 9.52133 69.6366 8.27997 68.9016 6.1944C68.7261 5.53912 68.6383 5.21148 68.5067 4.72002C68.3642 3.52918 68.8033 2.53371 69.9118 2.06124ZM69.9118 2.06124C69.9118 2.06124 70.0765 2.01714 69.9118 2.06124Z", stroke: "#A9B2D0", strokeWidth: "2", strokeMiterlimit: "10", strokeLinejoin: "round" })] }), _jsx("path", { id: "Vector_16", d: "M18.9558 37.5611H16.8098V35.4151H14.9704V37.5611H12.8243V39.4619H14.9704V41.6079H16.8098V39.4619H18.9558V37.5611Z", fill: "#A9B2D0" }), _jsx("path", { id: "Vector_17", d: "M23.6701 91.4039H21.5241V89.2579H19.6846V91.4039H17.5386V93.3047H19.6846V95.4507H21.5241V93.3047H23.6701V91.4039Z", fill: "#A9B2D0" }), _jsx("path", { id: "Vector_18", d: "M117.484 91.5254L114.858 90.1997L116.184 87.574L113.933 86.4377L112.607 89.0634L109.982 87.7378L108.808 90.0634L111.433 91.389L110.108 94.0147L112.358 95.151L113.684 92.5253L116.31 93.851L117.484 91.5254Z", fill: "#A9B2D0" })] }), _jsx("defs", { children: _jsx("clipPath", { id: "clip0_0_44", children: _jsx("rect", { width: "120", height: "120", fill: "white" }) }) })] }));

package/dist/assets/svg/empty-box.tsx

@@ -0,0 +1,34 @@
+export const emptyBoxIcon = (
+  <svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g id="grph" clipPath="url(#clip0_0_44)">
+  <path id="Vector" d="M104.708 44.4234C106.778 44.4234 108.456 42.744 108.456 40.6724C108.456 38.6007 106.778 36.9213 104.708 36.9213C102.638 36.9213 100.961 38.6007 100.961 40.6724C100.961 42.744 102.638 44.4234 104.708 44.4234Z" fill="#F2F6FE"/>
+  <path id="Vector_2" d="M5.15652 64.7085C6.51824 64.7085 7.62213 63.6036 7.62213 62.2407C7.62213 60.8778 6.51824 59.7729 5.15652 59.7729C3.79481 59.7729 2.69092 60.8778 2.69092 62.2407C2.69092 63.6036 3.79481 64.7085 5.15652 64.7085Z" fill="#F2F6FE"/>
+  <path id="Vector_3" d="M16.4904 109.075C17.8521 109.075 18.956 107.97 18.956 106.607C18.956 105.244 17.8521 104.14 16.4904 104.14C15.1287 104.14 14.0248 105.244 14.0248 106.607C14.0248 107.97 15.1287 109.075 16.4904 109.075Z" fill="#F2F6FE"/>
+  <g id="Group 848">
+  <path id="Vector_4" d="M29.6698 109.075L64.2691 98.2337V53.7837L29.6698 64.5417V109.075Z" fill="#F2F6FE" stroke="#D4DAEC" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <path id="Vector_5" d="M98.8686 109.075L64.2692 98.2337V53.7837L98.8686 64.5417V109.075Z" fill="#F2F6FE" stroke="#D4DAEC" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <path id="Vector_6" d="M64.2691 120L29.6698 109.159V64.7085L64.2691 75.55V120Z" fill="white" stroke="#D4DAEC" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <path id="Vector_7" d="M64.2692 120L98.8686 109.159V64.7085L64.2692 75.55V120Z" fill="white" stroke="#D4DAEC" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <path id="Vector_8" d="M64.2692 53.7837L48.0017 41.6079L12.8243 53.4501L29.6698 64.5417L64.2692 53.7837Z" fill="#F2F6FE" stroke="#D4DAEC" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <path id="Vector_9" d="M64.2692 53.7837L80.5367 41.6079L115.714 53.4501L98.8686 64.5417L64.2692 53.7837Z" fill="#F2F6FE" stroke="#D4DAEC" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <path id="Vector_10" d="M29.6699 64.7085L64.2692 75.55L47.0108 86.5583L12.8244 75.2164L29.6699 64.7085Z" fill="#F2F6FE" stroke="#D4DAEC" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <path id="Vector_11" d="M98.8686 64.7085L64.2692 75.55L81.5276 86.5583L115.714 75.2164L98.8686 64.7085Z" fill="#F2F6FE" stroke="#D4DAEC" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  </g>
+  <path id="Vector_12" d="M73.9226 11.1102C78.7698 24.2648 80.2146 27.1877 80.6888 40.1497C80.5064 43.1085 80.3933 46.3259 78.9984 48.9166C77.1355 52.8798 72.5789 55.6245 68.2739 55.669C63.8389 55.7482 59.491 53.0328 57.534 48.8455C56.1571 46.3044 56.2009 42.8284 58.0896 40.5211C60.1428 38.3084 63.7549 37.7567 66.3533 39.1393C69.2116 40.4523 70.9176 43.1825 71.5495 46.0617C72.1814 48.941 71.9038 52.0639 71.1324 54.9033C69.5192 61.8092 68.1832 62.1432 64.227 73.8352" stroke="#A9B2D0" strokeWidth="2" strokeMiterlimit="10" strokeDasharray="4 4"/>
+  <path id="Vector_13" d="M79.8222 4.14741C79.8109 6.08171 78.0109 7.26611 75.7282 6.64849C73.3247 6.23878 71.6236 5.81652 71.5141 4.09013C71.5693 2.31965 73.501 1.62671 75.7619 0.845586C78.4729 -0.23164 79.6688 2.2572 79.8222 4.14741Z" fill="#F2F6FE" stroke="#A9B2D0" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <path id="Vector_14" d="M64.2914 10.0625C65.5095 11.3164 68.0775 11.682 69.329 9.76668C70.7011 7.64345 71.8757 6.09987 70.6138 4.68213C69.3957 3.42822 68.2103 4.27242 65.4993 5.34965C63.3261 6.45841 62.8649 8.68881 64.2914 10.0625Z" fill="#F2F6FE" stroke="#A9B2D0" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  <g id="Vector_15">
+  <path d="M69.9118 2.06124C71.0204 1.58876 72.3483 1.93539 72.9408 2.83013C73.1932 3.11367 73.4895 3.56104 73.5772 3.88868C74.5208 6.09398 74.2241 8.28029 72.9509 8.79685C71.557 9.52133 69.6366 8.27997 68.9016 6.1944C68.7261 5.53912 68.6383 5.21148 68.5067 4.72002C68.3642 3.52918 68.8033 2.53371 69.9118 2.06124C70.0765 2.01714 69.9118 2.06124 69.9118 2.06124Z" fill="#F2F6FE"/>
+  <path d="M69.9118 2.06124C71.0204 1.58876 72.3483 1.93539 72.9408 2.83013C73.1932 3.11367 73.4895 3.56104 73.5772 3.88868C74.5208 6.09398 74.2241 8.28029 72.9509 8.79685C71.557 9.52133 69.6366 8.27997 68.9016 6.1944C68.7261 5.53912 68.6383 5.21148 68.5067 4.72002C68.3642 3.52918 68.8033 2.53371 69.9118 2.06124ZM69.9118 2.06124C69.9118 2.06124 70.0765 2.01714 69.9118 2.06124Z" stroke="#A9B2D0" strokeWidth="2" strokeMiterlimit="10" strokeLinejoin="round"/>
+  </g>
+  <path id="Vector_16" d="M18.9558 37.5611H16.8098V35.4151H14.9704V37.5611H12.8243V39.4619H14.9704V41.6079H16.8098V39.4619H18.9558V37.5611Z" fill="#A9B2D0"/>
+  <path id="Vector_17" d="M23.6701 91.4039H21.5241V89.2579H19.6846V91.4039H17.5386V93.3047H19.6846V95.4507H21.5241V93.3047H23.6701V91.4039Z" fill="#A9B2D0"/>
+  <path id="Vector_18" d="M117.484 91.5254L114.858 90.1997L116.184 87.574L113.933 86.4377L112.607 89.0634L109.982 87.7378L108.808 90.0634L111.433 91.389L110.108 94.0147L112.358 95.151L113.684 92.5253L116.31 93.851L117.484 91.5254Z" fill="#A9B2D0"/>
+  </g>
+  <defs>
+  <clipPath id="clip0_0_44">
+  <rect width="120" height="120" fill="white"/>
+  </clipPath>
+  </defs>
+  </svg>
+);

package/dist/assets/svg/file-pdf.d.ts

@@ -0,0 +1,2 @@
+export declare const filePdfIcon: import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=file-pdf.d.ts.map

package/dist/assets/svg/file-pdf.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-pdf.d.ts","sourceRoot":"","sources":["../../../src/assets/svg/file-pdf.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,yCAYvB,CAAC"}

package/dist/assets/svg/file-pdf.js

@@ -0,0 +1,2 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const filePdfIcon = (_jsx("svg", { width: "17.5", height: "20", viewBox: "0 0 17.5 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsxs("g", { id: "Group", children: [_jsx("path", { id: "Vector", d: "M1.24999 0H11.8706L17.5 5.60752V18.75C17.5 19.4406 16.94 20 16.25 20H1.24999C0.559969 20 0 19.4406 0 18.75V1.24999C0 0.559387 0.560034 0 1.24999 0Z", fill: "#F04438" }), _jsx("path", { id: "Vector_2", d: "M17.4819 5.62498H13.125C12.435 5.62498 11.875 5.06501 11.875 4.37499V0.0124811L17.4819 5.62498Z", fill: "#CC2A1E" }), _jsxs("g", { id: "Vector_3", children: [_jsx("path", { d: "M11.0645 9.64275C11.0768 9.4523 11.1547 9.24995 11.2983 9.0357C11.4459 8.81748 11.6346 8.64885 11.8643 8.52982C12.0939 8.41079 12.3154 8.34929 12.5286 8.34533H14.042C14.3373 8.34136 14.5177 8.46832 14.5833 8.72622V8.89286C14.5177 9.15076 14.3373 9.27773 14.042 9.27376H12.7747C12.6558 9.28169 12.5492 9.33129 12.4548 9.42255C12.3605 9.50983 12.3113 9.61895 12.3072 9.74988V10.3688H13.9312C14.2265 10.3649 14.407 10.4918 14.4726 10.7497V10.9283C14.407 11.1862 14.2265 11.3131 13.9312 11.3092H12.3072V12.8566C12.3031 12.9875 12.2539 13.0986 12.1595 13.1898C12.0652 13.2771 11.9586 13.3247 11.8396 13.3327H11.5259C11.4111 13.3247 11.3065 13.2771 11.2122 13.1898C11.1178 13.0986 11.0686 12.9875 11.0645 12.8566V9.64275Z", fill: "white" }), _jsx("path", { d: "M9.26675 9.74985C9.26265 9.61892 9.21343 9.50981 9.11911 9.42252C9.02478 9.33127 8.91815 9.28167 8.79921 9.27373H8.45472C8.31117 9.26977 8.23325 9.32135 8.22095 9.42847V12.2495C8.23325 12.3566 8.31117 12.4082 8.45472 12.4042H8.79921C8.91815 12.3963 9.02478 12.3487 9.11911 12.2614C9.21343 12.1701 9.26265 12.059 9.26675 11.9281V9.74985ZM6.9906 9.04758C6.9947 8.83729 7.09723 8.66668 7.29818 8.53575C7.49914 8.40085 7.74521 8.33737 8.0364 8.3453H8.97762C9.23599 8.34927 9.48001 8.41077 9.70968 8.5298C9.93934 8.64883 10.1259 8.81745 10.2695 9.03568C10.4171 9.24993 10.4971 9.45228 10.5094 9.64273V12.0352C10.4971 12.2257 10.4171 12.43 10.2695 12.6482C10.1259 12.8625 9.93934 13.0291 9.70968 13.1482C9.48001 13.2672 9.23599 13.3287 8.97762 13.3327H8.0364C7.74521 13.3406 7.49914 13.2791 7.29818 13.1482C7.09723 13.0133 6.9947 12.8407 6.9906 12.6304V9.04758Z", fill: "white" }), _jsx("path", { d: "M3.37805 13.3326C3.26322 13.3247 3.15864 13.277 3.06431 13.1898C2.96998 13.0985 2.92077 12.9874 2.91667 12.8565V9.63076C2.92897 9.44031 3.00689 9.23796 3.15043 9.02371C3.29808 8.80548 3.48673 8.63686 3.7164 8.51783C3.94606 8.3988 4.16753 8.3373 4.38079 8.33333H4.90369C5.16206 8.3373 5.40608 8.3988 5.63575 8.51783C5.86541 8.63686 6.05202 8.80548 6.19556 9.02371C6.3432 9.23796 6.42317 9.44031 6.43548 9.63076V10.0117C6.42317 10.2021 6.3432 10.4064 6.19556 10.6247C6.05202 10.8389 5.86541 11.0056 5.63575 11.1246C5.40608 11.2436 5.16616 11.3051 4.91599 11.3091H4.14702V12.8565C4.14292 12.9874 4.0937 13.0985 3.99938 13.1898C3.90505 13.277 3.79842 13.3247 3.67949 13.3326H3.37805ZM5.19282 9.73789C5.18872 9.60695 5.1395 9.49784 5.04518 9.41055C4.95085 9.3193 4.84422 9.2697 4.72529 9.26177H4.61455C4.49562 9.2697 4.38899 9.3193 4.29466 9.41055C4.20033 9.49784 4.15112 9.60695 4.14702 9.73789V10.3687H4.72529C4.84422 10.3608 4.95085 10.3132 5.04518 10.2259C5.1395 10.1347 5.18872 10.0236 5.19282 9.89262V9.73789Z", fill: "white" })] })] }) }));

package/dist/assets/svg/file-pdf.tsx

@@ -0,0 +1,13 @@
+export const filePdfIcon = (
+  <svg width="17.5" height="20" viewBox="0 0 17.5 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g id="Group">
+  <path id="Vector" d="M1.24999 0H11.8706L17.5 5.60752V18.75C17.5 19.4406 16.94 20 16.25 20H1.24999C0.559969 20 0 19.4406 0 18.75V1.24999C0 0.559387 0.560034 0 1.24999 0Z" fill="#F04438"/>
+  <path id="Vector_2" d="M17.4819 5.62498H13.125C12.435 5.62498 11.875 5.06501 11.875 4.37499V0.0124811L17.4819 5.62498Z" fill="#CC2A1E"/>
+  <g id="Vector_3">
+  <path d="M11.0645 9.64275C11.0768 9.4523 11.1547 9.24995 11.2983 9.0357C11.4459 8.81748 11.6346 8.64885 11.8643 8.52982C12.0939 8.41079 12.3154 8.34929 12.5286 8.34533H14.042C14.3373 8.34136 14.5177 8.46832 14.5833 8.72622V8.89286C14.5177 9.15076 14.3373 9.27773 14.042 9.27376H12.7747C12.6558 9.28169 12.5492 9.33129 12.4548 9.42255C12.3605 9.50983 12.3113 9.61895 12.3072 9.74988V10.3688H13.9312C14.2265 10.3649 14.407 10.4918 14.4726 10.7497V10.9283C14.407 11.1862 14.2265 11.3131 13.9312 11.3092H12.3072V12.8566C12.3031 12.9875 12.2539 13.0986 12.1595 13.1898C12.0652 13.2771 11.9586 13.3247 11.8396 13.3327H11.5259C11.4111 13.3247 11.3065 13.2771 11.2122 13.1898C11.1178 13.0986 11.0686 12.9875 11.0645 12.8566V9.64275Z" fill="white"/>
+  <path d="M9.26675 9.74985C9.26265 9.61892 9.21343 9.50981 9.11911 9.42252C9.02478 9.33127 8.91815 9.28167 8.79921 9.27373H8.45472C8.31117 9.26977 8.23325 9.32135 8.22095 9.42847V12.2495C8.23325 12.3566 8.31117 12.4082 8.45472 12.4042H8.79921C8.91815 12.3963 9.02478 12.3487 9.11911 12.2614C9.21343 12.1701 9.26265 12.059 9.26675 11.9281V9.74985ZM6.9906 9.04758C6.9947 8.83729 7.09723 8.66668 7.29818 8.53575C7.49914 8.40085 7.74521 8.33737 8.0364 8.3453H8.97762C9.23599 8.34927 9.48001 8.41077 9.70968 8.5298C9.93934 8.64883 10.1259 8.81745 10.2695 9.03568C10.4171 9.24993 10.4971 9.45228 10.5094 9.64273V12.0352C10.4971 12.2257 10.4171 12.43 10.2695 12.6482C10.1259 12.8625 9.93934 13.0291 9.70968 13.1482C9.48001 13.2672 9.23599 13.3287 8.97762 13.3327H8.0364C7.74521 13.3406 7.49914 13.2791 7.29818 13.1482C7.09723 13.0133 6.9947 12.8407 6.9906 12.6304V9.04758Z" fill="white"/>
+  <path d="M3.37805 13.3326C3.26322 13.3247 3.15864 13.277 3.06431 13.1898C2.96998 13.0985 2.92077 12.9874 2.91667 12.8565V9.63076C2.92897 9.44031 3.00689 9.23796 3.15043 9.02371C3.29808 8.80548 3.48673 8.63686 3.7164 8.51783C3.94606 8.3988 4.16753 8.3373 4.38079 8.33333H4.90369C5.16206 8.3373 5.40608 8.3988 5.63575 8.51783C5.86541 8.63686 6.05202 8.80548 6.19556 9.02371C6.3432 9.23796 6.42317 9.44031 6.43548 9.63076V10.0117C6.42317 10.2021 6.3432 10.4064 6.19556 10.6247C6.05202 10.8389 5.86541 11.0056 5.63575 11.1246C5.40608 11.2436 5.16616 11.3051 4.91599 11.3091H4.14702V12.8565C4.14292 12.9874 4.0937 13.0985 3.99938 13.1898C3.90505 13.277 3.79842 13.3247 3.67949 13.3326H3.37805ZM5.19282 9.73789C5.18872 9.60695 5.1395 9.49784 5.04518 9.41055C4.95085 9.3193 4.84422 9.2697 4.72529 9.26177H4.61455C4.49562 9.2697 4.38899 9.3193 4.29466 9.41055C4.20033 9.49784 4.15112 9.60695 4.14702 9.73789V10.3687H4.72529C4.84422 10.3608 4.95085 10.3132 5.04518 10.2259C5.1395 10.1347 5.18872 10.0236 5.19282 9.89262V9.73789Z" fill="white"/>
+  </g>
+  </g>
+  </svg>
+);

package/dist/assets/svg/index.d.ts

@@ -1,3 +1,4 @@
 export * from "./document";
 export * from "./canned-response";
+export * from "./empty-box";
 //# sourceMappingURL=index.d.ts.map

package/dist/assets/svg/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/assets/svg/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/assets/svg/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC"}

package/dist/assets/svg/index.js

@@ -1,2 +1,3 @@
 export * from "./document";
 export * from "./canned-response";
+export * from "./empty-box";

package/dist/assets/svg/index.ts

@@ -1,2 +1,3 @@
 export * from "./document";
-export * from "./canned-response";
+export * from "./canned-response";
+export * from "./empty-box";

package/dist/components/conversation/ConversationBySessionItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationBySessionItem.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/ConversationBySessionItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAE7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAShD,UAAU,8BAA8B;IACtC,WAAW,EAAE,gBAAgB,CAAC;IAC9B,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,QAAA,MAAM,yBAAyB,GAAI,iCAGhC,8BAA8B,mDAiEhC,CAAC;AAEF,eAAe,yBAAyB,CAAC"}
+{"version":3,"file":"ConversationBySessionItem.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/ConversationBySessionItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAE7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAShD,UAAU,8BAA8B;IACtC,WAAW,EAAE,gBAAgB,CAAC;IAC9B,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,QAAA,MAAM,yBAAyB,GAAI,iCAGhC,8BAA8B,mDAoEhC,CAAC;AAEF,eAAe,yBAAyB,CAAC"}

package/dist/components/conversation/ConversationBySessionItem.js

@@ -27,6 +27,9 @@ const ConversationBySessionItem = ({ sessionItem, latestPreview, }) => {
         setConversationData(conversation);
         const newSearchParams = new URLSearchParams(searchParams);
         newSearchParams.set("threadId", conversation.conversationID);
+        newSearchParams.delete("userId");
+        newSearchParams.delete("groupId");
+        newSearchParams.delete("botId");
         router.push(`${pathname}?${newSearchParams.toString()}`);
         setSelectedConversationId(conversation.conversationID);
     };

package/dist/components/conversation-detail/ConversationDetailHeader.d.ts

@@ -2,7 +2,8 @@ import type { ConversationItem } from "@openim/wasm-client-sdk";
 export interface ConversationDetailHeaderProps {
     conversation: ConversationItem;
     onBack?: () => void;
+    onProfileClick?: () => void;
 }
-declare const ConversationDetailHeader: ({ conversation, onBack, }: ConversationDetailHeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const ConversationDetailHeader: ({ conversation, onBack, onProfileClick, }: ConversationDetailHeaderProps) => import("react/jsx-runtime").JSX.Element;
 export default ConversationDetailHeader;
 //# sourceMappingURL=ConversationDetailHeader.d.ts.map

package/dist/components/conversation-detail/ConversationDetailHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationDetailHeader.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-detail/ConversationDetailHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAQhE,MAAM,WAAW,6BAA6B;IAC5C,YAAY,EAAE,gBAAgB,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAqBD,QAAA,MAAM,wBAAwB,GAAI,2BAG/B,6BAA6B,4CAyC/B,CAAC;AAEF,eAAe,wBAAwB,CAAC"}
+{"version":3,"file":"ConversationDetailHeader.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-detail/ConversationDetailHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAQhE,MAAM,WAAW,6BAA6B;IAC5C,YAAY,EAAE,gBAAgB,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAqBD,QAAA,MAAM,wBAAwB,GAAI,2CAI/B,6BAA6B,4CA0C/B,CAAC;AAEF,eAAe,wBAAwB,CAAC"}

package/dist/components/conversation-detail/ConversationDetailHeader.js

@@ -7,13 +7,13 @@ import ConversationInboxTitle from "../../components/conversation-inbox/Conversa
 import { resolveConversationDisplayName, resolvePeerBadgeLabel, } from "../../utils/conversation";
 import { useConversationAvatarUrl } from "../../hooks/conversation/useConversationAvatarUrl";
 const HeaderIconButton = ({ icon, onClick, testId, }) => (_jsx("button", { type: "button", onClick: onClick, "data-testid": testId, className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-primary-400", children: _jsx(Icon, { icon: icon, size: 24 }) }));
-const ConversationDetailHeader = ({ conversation, onBack, }) => {
+const ConversationDetailHeader = ({ conversation, onBack, onProfileClick, }) => {
     const { t } = useTranslation("conversation-inbox");
     const displayName = resolveConversationDisplayName(conversation, t);
     const avatarUrl = useConversationAvatarUrl(conversation);
     const peerType = conversation.peerType;
     const badgeLabel = resolvePeerBadgeLabel(peerType, t);
     const subtitle = t("thread_detail.profile_hint");
-    return (_jsxs("div", { "data-testid": "conversation-detail-header", className: "flex w-full cursor-default items-center border-b border-gray-25 bg-white p-2 shadow-inset-gray-divider", children: [_jsx(HeaderIconButton, { icon: "arrow-left-o", onClick: onBack, testId: "conversation-detail-back" }), _jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2 px-1", "data-testid": "conversation-detail-profile", children: [_jsx(ConversationPeerAvatar, { peerType: peerType, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(ConversationInboxTitle, { peerType: peerType, displayName: displayName }), _jsx("p", { className: "truncate text-[10px] font-normal leading-[160%] tracking-[0.1px] text-gray-600 [font-feature-settings:'liga'_off,'clig'_off]", children: subtitle })] })] })] }));
+    return (_jsxs("div", { "data-testid": "conversation-detail-header", className: "flex w-full cursor-default items-center border-b border-gray-25 bg-white p-2 shadow-inset-gray-divider", children: [_jsx(HeaderIconButton, { icon: "arrow-left-o", onClick: onBack, testId: "conversation-detail-back" }), _jsxs("div", { className: "flex min-w-0 flex-1 cursor-pointer items-center gap-2 px-1", "data-testid": "conversation-detail-profile", onClick: onProfileClick, children: [_jsx(ConversationPeerAvatar, { peerType: peerType, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(ConversationInboxTitle, { peerType: peerType, displayName: displayName }), _jsx("p", { className: "truncate text-[10px] font-normal leading-[160%] tracking-[0.1px] text-gray-600 [font-feature-settings:'liga'_off,'clig'_off]", children: subtitle })] })] })] }));
 };
 export default ConversationDetailHeader;

package/dist/components/conversation-detail/ThreadProfilePanel.d.ts

@@ -0,0 +1,11 @@
+import type { ConversationItem } from "@openim/wasm-client-sdk";
+import { MediaResourceTabKey } from "../../components/media-resources/constants";
+interface ThreadProfilePanelProps {
+    open: boolean;
+    conversation: ConversationItem;
+    onClose: () => void;
+    onSelectResource: (tabKey: MediaResourceTabKey) => void;
+}
+declare const ThreadProfilePanel: ({ open, conversation, onClose, onSelectResource, }: ThreadProfilePanelProps) => import("react/jsx-runtime").JSX.Element;
+export default ThreadProfilePanel;
+//# sourceMappingURL=ThreadProfilePanel.d.ts.map

package/dist/components/conversation-detail/ThreadProfilePanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThreadProfilePanel.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-detail/ThreadProfilePanel.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAGhE,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAW7E,UAAU,uBAAuB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,gBAAgB,CAAC;IAC/B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAC;CACzD;AAED,QAAA,MAAM,kBAAkB,GAAI,oDAKzB,uBAAuB,4CAiEzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/conversation-detail/ThreadProfilePanel.js

@@ -0,0 +1,21 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar, Drawer } from "antd";
+import clsx from "clsx";
+import { useTranslation } from "react-i18next";
+import { Icon } from "../../components/icon";
+import MediaEntryCard from "../../components/media-resources/MediaEntryCard";
+import { resolveConversationDisplayName, resolvePeerBadgeColor, resolvePeerBadgeLabel, } from "../../utils/conversation";
+import { useConversationAvatarUrl } from "../../hooks/conversation/useConversationAvatarUrl";
+const PROFILE_AVATAR_SIZE = 96;
+const ThreadProfilePanel = ({ open, conversation, onClose, onSelectResource, }) => {
+    const { t } = useTranslation("conversation-inbox");
+    const displayName = resolveConversationDisplayName(conversation, t);
+    const avatarUrl = useConversationAvatarUrl(conversation);
+    const peerType = conversation.peerType;
+    const badgeLabel = resolvePeerBadgeLabel(peerType, t);
+    return (_jsx(Drawer, { open: open, onClose: onClose, placement: "right", closeIcon: false, width: "100%", styles: {
+            body: { padding: 0 },
+        }, getContainer: false, destroyOnHidden: true, children: _jsxs("div", { className: "flex h-full flex-col bg-gray-25", children: [_jsxs("div", { className: "flex w-full items-center bg-white p-2", children: [_jsx("button", { type: "button", "data-testid": "thread-profile-back", className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-primary-400", onClick: onClose, children: _jsx(Icon, { icon: "arrow-left-o", size: 24 }) }), _jsx("p", { className: "min-w-0 flex-1 truncate px-2 text-[18px] font-bold leading-[1.6] text-gray-900", children: t("thread_detail.options_title") })] }), _jsxs("div", { className: "flex flex-col items-center gap-2 bg-white px-0 py-2", children: [_jsxs("div", { className: "relative h-24 w-24 shrink-0", children: [_jsx(Avatar, { size: PROFILE_AVATAR_SIZE, src: avatarUrl || undefined, alt: displayName, className: "uppercase", children: (displayName === null || displayName === void 0 ? void 0 : displayName.charAt(0)) || "A" }), badgeLabel && (_jsx("span", { className: clsx("absolute bottom-1 right-0 flex h-[17px] items-center justify-center rounded-md border border-white px-1 text-[10px] font-semibold leading-3 text-white shadow-badge-inset", resolvePeerBadgeColor(peerType)), children: badgeLabel }))] }), _jsx("p", { className: "w-full truncate text-center text-[18px] font-bold leading-[1.6] text-gray-900", children: displayName })] }), _jsx("div", { className: "flex flex-col px-3 py-1.5", children: _jsx(MediaEntryCard, { onSelect: onSelectResource }) })] }) }));
+};
+export default ThreadProfilePanel;

package/dist/components/conversation-inbox/ConversationInboxList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationInboxList.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxList.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAKjE,MAAM,WAAW,0BAA0B;IACzC,KAAK,EAAE,oBAAoB,EAAE,CAAC;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACvD;AAYD,QAAA,MAAM,qBAAqB,GAAI,oFAO5B,0BAA0B,4CA8E5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"ConversationInboxList.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxList.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAKjE,MAAM,WAAW,0BAA0B;IACzC,KAAK,EAAE,oBAAoB,EAAE,CAAC;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACvD;AAYD,QAAA,MAAM,qBAAqB,GAAI,oFAO5B,0BAA0B,4CAiF5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/conversation-inbox/ConversationInboxList.js

@@ -18,6 +18,9 @@ const ConversationInboxList = ({ items, isLoading, isFetchingNextPage, hasNextPa
     const handleSelectThread = (item) => {
         const newSearchParams = new URLSearchParams(searchParams);
         newSearchParams.set("threadId", item.conversationID);
+        newSearchParams.delete("userId");
+        newSearchParams.delete("groupId");
+        newSearchParams.delete("botId");
         router.push(`${pathname}?${newSearchParams.toString()}`);
         setSelectedConversationId(item.conversationID);
         setConversationData(item);

package/dist/components/media-collection/FileCollection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/FileCollection.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,cAAc,+CAqGnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"FileCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/FileCollection.tsx"],"names":[],"mappings":"AAaA,QAAA,MAAM,cAAc,+CAkFnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/media-collection/FileCollection.js

@@ -9,6 +9,7 @@ import useConversationStore from "../../store/conversation";
 import { useTranslation } from "react-i18next";
 import { documentIcon } from "../../assets/svg";
 import { renderFileSize, shortenFileName } from "../../utils/common";
+import { downloadFileFromUrl } from "../../utils/download";
 const FileCollection = () => {
     const { t } = useTranslation();
     const selectedSourceId = useConversationStore((state) => state.selectedSourceId);
@@ -18,27 +19,11 @@ const FileCollection = () => {
             contentType: MessageType.FileMessage,
         },
     });
-    const handleDownload = (url, fileName) => {
-        if (!url) {
-            console.warn("Không có link file để tải");
-            return;
-        }
-        const link = document.createElement("a");
-        link.href = url;
-        if (fileName) {
-            link.setAttribute("download", fileName);
-        }
-        link.setAttribute("target", "_blank");
-        link.setAttribute("rel", "noopener noreferrer");
-        document.body.appendChild(link);
-        link.click();
-        link.remove();
-    };
     const renderItem = useCallback((date, items) => {
         return (_jsxs("div", { className: "px-3", children: [_jsx("span", { className: "text-sm font-medium text-gray-500", children: dayjs(date).format("DD MMMM, YYYY") }), _jsx("div", { className: "flex flex-col gap-1 mt-2", children: items.map((item) => {
                         var _a, _b, _c;
                         const fileContent = JSON.parse(((_a = item === null || item === void 0 ? void 0 : item.chatLog) === null || _a === void 0 ? void 0 : _a.content) || "{}");
-                        return (_jsxs("div", { className: "relative flex flex-row items-center gap-2 align-center bg-gray-100 rounded-md p-2 cursor-pointer", onClick: () => handleDownload((fileContent === null || fileContent === void 0 ? void 0 : fileContent.sourceUrl) || "", (fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileName) || ""), children: [documentIcon, _jsxs("div", { className: "flex flex-col flex-1", children: [_jsx("span", { className: "text-sm font-medium", children: shortenFileName((fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileName) || "", {
+                        return (_jsxs("div", { className: "relative flex flex-row items-center gap-2 align-center bg-gray-100 rounded-md p-2 cursor-pointer", onClick: () => downloadFileFromUrl((fileContent === null || fileContent === void 0 ? void 0 : fileContent.sourceUrl) || "", (fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileName) || ""), children: [documentIcon, _jsxs("div", { className: "flex flex-col flex-1", children: [_jsx("span", { className: "text-sm font-medium", children: shortenFileName((fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileName) || "", {
                                                 maxLength: 32,
                                             }) }), _jsx("span", { className: "text-xs text-gray-500", children: `${renderFileSize(fileContent.fileSize || 0)}  -  ${dayjs(((_b = item === null || item === void 0 ? void 0 : item.chatLog) === null || _b === void 0 ? void 0 : _b.sendTime) || 0).format("HH:mm")}` })] })] }, (_c = item.chatLog) === null || _c === void 0 ? void 0 : _c.clientMsgID));
                     }) })] }, date));

package/dist/components/media-collection/VideoCollection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VideoCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/VideoCollection.tsx"],"names":[],"mappings":"AAaA,QAAA,MAAM,eAAe,+CAyHpB,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"VideoCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/VideoCollection.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,eAAe,+CAiGpB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/media-collection/VideoCollection.js

@@ -2,14 +2,16 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { MessageType } from "@openim/wasm-client-sdk";
 import { useSearchMessage } from "../../hooks/search/useSearchMessage";
 import InfiniteScroll from "react-infinite-scroll-component";
-import { Carousel, Empty, Image, Modal, Spin } from "antd";
-import { useCallback, useState } from "react";
+import { Empty, Image, Spin } from "antd";
+import { useState } from "react";
 import dayjs from "dayjs";
 import useConversationStore from "../../store/conversation";
 import { useBoolean } from "ahooks";
 import { images } from "../../constants/images";
 import { Icon } from "../../components/icon";
 import { useTranslation } from "react-i18next";
+import VideoPlayerModal, { toVideoPlayerSources, } from "../../components/video-player/VideoPlayerModal";
+import { parseMessageContent } from "../../utils/common";
 const VideoCollection = () => {
     const { t } = useTranslation();
     const selectedSourceId = useConversationStore((state) => state.selectedSourceId);
@@ -21,31 +23,23 @@ const VideoCollection = () => {
     });
     const [open, { setTrue, setFalse }] = useBoolean(false);
     const [currentIndex, setCurrentIndex] = useState(0);
+    const videoIndexByMsgId = new Map(dataFlatten.map((item, index) => { var _a; return [(_a = item.chatLog) === null || _a === void 0 ? void 0 : _a.clientMsgID, index]; }));
     const handleOpenPreview = (index) => {
         setCurrentIndex(index);
         setTrue();
     };
-    const renderItem = useCallback((date, items) => {
+    const renderItem = (date, items) => {
         return (_jsxs("div", { className: "mb-2", children: [_jsx("span", { className: "text-sm font-medium text-gray-500 px-3", children: dayjs(date).format("DD MMMM, YYYY") }), _jsx("div", { className: "grid grid-cols-3 justify-start gap-px py-2", children: items.map((item) => {
-                        var _a, _b;
-                        const videoContent = JSON.parse(((_a = item === null || item === void 0 ? void 0 : item.chatLog) === null || _a === void 0 ? void 0 : _a.content) || "{}");
-                        const globalIndex = dataFlatten.findIndex((v) => { var _a, _b; return ((_a = v.chatLog) === null || _a === void 0 ? void 0 : _a.clientMsgID) === ((_b = item.chatLog) === null || _b === void 0 ? void 0 : _b.clientMsgID); });
-                        return (_jsxs("div", { className: "border relative w-full h-full aspect-square cursor-pointer", onClick: () => handleOpenPreview(globalIndex), children: [_jsx(Image, { rootClassName: "w-full h-full", src: videoContent.snapshotUrl, alt: "video thumbnail", className: "w-full !h-full object-cover", fallback: images.imageFailed }), _jsx("div", { className: "absolute inset-0 flex items-center justify-center bg-black/30 text-white text-2xl", children: _jsx(Icon, { icon: "play-b", size: 24, color: "white" }) })] }, (_b = item === null || item === void 0 ? void 0 : item.chatLog) === null || _b === void 0 ? void 0 : _b.clientMsgID));
+                        var _a, _b, _c, _d;
+                        const videoContent = parseMessageContent((_a = item === null || item === void 0 ? void 0 : item.chatLog) === null || _a === void 0 ? void 0 : _a.content);
+                        const globalIndex = (_c = videoIndexByMsgId.get((_b = item.chatLog) === null || _b === void 0 ? void 0 : _b.clientMsgID)) !== null && _c !== void 0 ? _c : 0;
+                        return (_jsxs("div", { className: "border relative w-full h-full aspect-square cursor-pointer", onClick: () => handleOpenPreview(globalIndex), children: [_jsx(Image, { rootClassName: "w-full h-full", src: videoContent.snapshotUrl, alt: "video thumbnail", className: "w-full !h-full object-cover", fallback: images.imageFailed }), _jsx("div", { className: "absolute inset-0 flex items-center justify-center bg-black/30 text-white text-2xl", children: _jsx(Icon, { icon: "play-b", size: 24, color: "white" }) })] }, (_d = item === null || item === void 0 ? void 0 : item.chatLog) === null || _d === void 0 ? void 0 : _d.clientMsgID));
                     }) })] }, date));
-    }, []);
+    };
     if (dataFlatten.length === 0 && !isLoading)
         return _jsx(Empty, { description: t("no_media_files") });
     if (isLoading)
         return (_jsx("div", { className: "flex items-center justify-center", children: _jsx(Spin, {}) }));
-    return (_jsxs("div", { id: "scrollableVideoDiv", className: "h-full overflow-auto", children: [_jsx(InfiniteScroll, { dataLength: Object.keys(groupedData).length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableVideoDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }), _jsx(Modal, { open: open, onCancel: setFalse, footer: null, centered: true, styles: {
-                    content: {
-                        padding: 0,
-                    },
-                }, children: _jsx(Carousel, { dots: true, infinite: false, initialSlide: currentIndex, afterChange: (i) => setCurrentIndex(i), children: dataFlatten.map((item, idx) => {
-                        var _a;
-                        const videoContent = JSON.parse(((_a = item === null || item === void 0 ? void 0 : item.chatLog) === null || _a === void 0 ? void 0 : _a.content) || "{}");
-                        const sourceUrl = videoContent.videoUrl;
-                        return (_jsx("div", { style: { textAlign: "center" }, children: _jsx("video", { src: sourceUrl, controls: true, autoPlay: idx === currentIndex, style: { width: "100%", maxHeight: "80vh" } }) }, idx));
-                    }) }) })] }));
+    return (_jsxs("div", { id: "scrollableVideoDiv", className: "h-full overflow-auto", children: [_jsx(InfiniteScroll, { dataLength: Object.keys(groupedData).length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableVideoDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }), open && (_jsx(VideoPlayerModal, { open: open, videos: toVideoPlayerSources(dataFlatten), initialIndex: currentIndex, onClose: setFalse }))] }));
 };
 export default VideoCollection;

package/dist/components/media-resources/FileResourceList.d.ts

@@ -0,0 +1,3 @@
+declare const FileResourceList: () => import("react/jsx-runtime").JSX.Element;
+export default FileResourceList;
+//# sourceMappingURL=FileResourceList.d.ts.map

package/dist/components/media-resources/FileResourceList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileResourceList.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/FileResourceList.tsx"],"names":[],"mappings":"AAUA,QAAA,MAAM,gBAAgB,+CAsCrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/media-resources/FileResourceList.js

@@ -0,0 +1,17 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { documentIcon } from "../../assets/svg";
+import { parseMessageContent, renderFileSize } from "../../utils/common";
+import { downloadFileFromUrl } from "../../utils/download";
+import { MediaResourceTabKey } from "./constants";
+import ResourceScrollContainer from "./ResourceScrollContainer";
+import { useResourceTab } from "./useResourceTab";
+const FileResourceList = () => {
+    const { items, containerProps } = useResourceTab(MediaResourceTabKey.File);
+    return (_jsx(ResourceScrollContainer, Object.assign({}, containerProps, { itemCount: items.length, children: _jsx("div", { className: "flex flex-col gap-2 p-3", children: items.map((item) => {
+                var _a, _b;
+                const fileContent = parseMessageContent((_a = item === null || item === void 0 ? void 0 : item.chatLog) === null || _a === void 0 ? void 0 : _a.content);
+                return (_jsxs("div", { className: "flex w-full cursor-pointer items-center gap-2 rounded-[12px] bg-gray-50/20 p-3", onClick: () => downloadFileFromUrl((fileContent === null || fileContent === void 0 ? void 0 : fileContent.sourceUrl) || "", (fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileName) || ""), children: [_jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center [&>svg]:h-full [&>svg]:w-auto", children: documentIcon }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "truncate text-[16px] font-medium leading-[1.6] text-gray-900", children: (fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileName) || "" }), _jsx("span", { className: "text-[13px] font-normal leading-[1.6] text-gray-400", children: renderFileSize((fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileSize) || 0) })] })] }, (_b = item.chatLog) === null || _b === void 0 ? void 0 : _b.clientMsgID));
+            }) }) })));
+};
+export default FileResourceList;

package/dist/components/media-resources/ImageResourceGrid.d.ts

@@ -0,0 +1,3 @@
+declare const ImageResourceGrid: () => import("react/jsx-runtime").JSX.Element;
+export default ImageResourceGrid;
+//# sourceMappingURL=ImageResourceGrid.d.ts.map

package/dist/components/media-resources/ImageResourceGrid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageResourceGrid.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/ImageResourceGrid.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,iBAAiB,+CA4CtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/media-resources/ImageResourceGrid.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Image, Spin } from "antd";
+import { useTranslation } from "react-i18next";
+import { images } from "../../constants/images";
+import { renderImagePreviewToolbar } from "../../components/message/item/imagePreviewToolbar";
+import { parseMessageContent } from "../../utils/common";
+import { MediaResourceTabKey } from "./constants";
+import ResourceScrollContainer from "./ResourceScrollContainer";
+import { useResourceTab } from "./useResourceTab";
+const ImageResourceGrid = () => {
+    const { t } = useTranslation();
+    const { items, containerProps } = useResourceTab(MediaResourceTabKey.Image);
+    return (_jsx(ResourceScrollContainer, Object.assign({}, containerProps, { itemCount: items.length, children: _jsx(Image.PreviewGroup, { preview: {
+                toolbarRender: (originalNode, info) => { var _a; return renderImagePreviewToolbar(originalNode, (_a = info === null || info === void 0 ? void 0 : info.image) === null || _a === void 0 ? void 0 : _a.url, t); },
+            }, children: _jsx("div", { className: "grid grid-cols-3 gap-2 p-3", children: items.map((item) => {
+                    var _a, _b, _c, _d;
+                    const imageContent = parseMessageContent((_a = item === null || item === void 0 ? void 0 : item.chatLog) === null || _a === void 0 ? void 0 : _a.content);
+                    const sourceUrl = ((_b = imageContent.sourcePicture) === null || _b === void 0 ? void 0 : _b.url) ||
+                        ((_c = imageContent.snapshotPicture) === null || _c === void 0 ? void 0 : _c.url);
+                    return (_jsx("div", { className: "aspect-square w-full overflow-hidden rounded-[8px]", children: _jsx(Image, { rootClassName: "cursor-pointer w-full h-full", className: "w-full !h-full object-cover", src: sourceUrl, preview: true, placeholder: _jsx("div", { className: "flex h-full items-center justify-center", children: _jsx(Spin, {}) }), fallback: images.imageFailed }) }, (_d = item === null || item === void 0 ? void 0 : item.chatLog) === null || _d === void 0 ? void 0 : _d.clientMsgID));
+                }) }) }) })));
+};
+export default ImageResourceGrid;

package/dist/components/media-resources/LinkResourceItem.d.ts

@@ -0,0 +1,8 @@
+import type { UrlMetadataInfo } from "../../types/chat";
+interface LinkResourceItemProps {
+    url: string;
+    messageMetadata?: UrlMetadataInfo;
+}
+declare const LinkResourceItem: ({ url, messageMetadata }: LinkResourceItemProps) => import("react/jsx-runtime").JSX.Element;
+export default LinkResourceItem;
+//# sourceMappingURL=LinkResourceItem.d.ts.map

package/dist/components/media-resources/LinkResourceItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkResourceItem.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/LinkResourceItem.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD,UAAU,qBAAqB;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC;AAID,QAAA,MAAM,gBAAgB,GAAI,0BAA0B,qBAAqB,4CAmDxE,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/media-resources/LinkResourceItem.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Icon } from "../../components/icon";
+import { useFetchUrlMetadata } from "../../hooks/common/useFetchUrlMetadata";
+import { openLink } from "../../utils/openLink";
+const stripProtocol = (url) => url.replace(/^https?:\/\//i, "");
+const LinkResourceItem = ({ url, messageMetadata }) => {
+    const { t } = useTranslation("conversation-inbox");
+    const hasMessageMetadata = Boolean((messageMetadata === null || messageMetadata === void 0 ? void 0 : messageMetadata.title) || (messageMetadata === null || messageMetadata === void 0 ? void 0 : messageMetadata.image));
+    const { data: fetchedMetadata } = useFetchUrlMetadata(url, !hasMessageMetadata);
+    const title = (messageMetadata === null || messageMetadata === void 0 ? void 0 : messageMetadata.title) || (fetchedMetadata === null || fetchedMetadata === void 0 ? void 0 : fetchedMetadata.title) || "";
+    const imageUrl = (messageMetadata === null || messageMetadata === void 0 ? void 0 : messageMetadata.image) || (fetchedMetadata === null || fetchedMetadata === void 0 ? void 0 : fetchedMetadata.image) || "";
+    const [failedImageUrl, setFailedImageUrl] = useState("");
+    const shouldShowImage = Boolean(imageUrl) && failedImageUrl !== imageUrl;
+    const handleOpen = () => {
+        openLink(url, t);
+    };
+    return (_jsxs("div", { "data-testid": "link-resource-item", className: "flex w-full cursor-pointer items-center gap-2 rounded-[12px] bg-gray-50/20 p-3", onClick: handleOpen, children: [_jsx("div", { className: "flex h-[76px] w-[76px] shrink-0 items-center justify-center", children: shouldShowImage ? (_jsx("img", { src: imageUrl, alt: "", className: "h-full w-full rounded-[8px] object-cover", onError: () => setFailedImageUrl(imageUrl) })) : (_jsx("div", { className: "flex h-full w-full items-center justify-center rounded-[12px] bg-gray-200", children: _jsx(Icon, { icon: "link-b", size: 24, color: "white" }) })) }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center", children: [_jsx("p", { className: "truncate text-[14px] font-normal leading-[1.6] tracking-[-0.14px] text-gray-600", children: stripProtocol(url) }), _jsx("p", { className: "line-clamp-2 text-[16px] font-medium leading-[1.6] text-gray-900", children: title || url })] })] }));
+};
+export default LinkResourceItem;

package/dist/components/media-resources/LinkResourceList.d.ts

@@ -0,0 +1,3 @@
+declare const LinkResourceList: () => import("react/jsx-runtime").JSX.Element;
+export default LinkResourceList;
+//# sourceMappingURL=LinkResourceList.d.ts.map

package/dist/components/media-resources/LinkResourceList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkResourceList.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/LinkResourceList.tsx"],"names":[],"mappings":"AASA,QAAA,MAAM,gBAAgB,+CA2BrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/media-resources/LinkResourceList.js

@@ -0,0 +1,25 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { parseMessageContent, parseUrlMetadata } from "../../utils/common";
+import { MediaResourceTabKey } from "./constants";
+import ResourceScrollContainer from "./ResourceScrollContainer";
+import LinkResourceItem from "./LinkResourceItem";
+import { useResourceTab } from "./useResourceTab";
+const LinkResourceList = () => {
+    const { items, containerProps } = useResourceTab(MediaResourceTabKey.Link);
+    const linkRows = items.flatMap((item) => {
+        var _a, _b;
+        const urls = parseMessageContent((_a = item === null || item === void 0 ? void 0 : item.chatLog) === null || _a === void 0 ? void 0 : _a.content).urls || [];
+        const messageMetadata = parseUrlMetadata((_b = item === null || item === void 0 ? void 0 : item.chatLog) === null || _b === void 0 ? void 0 : _b.ex);
+        return urls.map((url, urlIndex) => {
+            var _a;
+            return ({
+                key: `${(_a = item.chatLog) === null || _a === void 0 ? void 0 : _a.clientMsgID}-${urlIndex}`,
+                url,
+                messageMetadata: urlIndex === 0 ? messageMetadata : undefined,
+            });
+        });
+    });
+    return (_jsx(ResourceScrollContainer, Object.assign({}, containerProps, { itemCount: linkRows.length, children: _jsx("div", { className: "flex flex-col gap-2 p-3", children: linkRows.map((row) => (_jsx(LinkResourceItem, { url: row.url, messageMetadata: row.messageMetadata }, row.key))) }) })));
+};
+export default LinkResourceList;

package/dist/components/media-resources/MediaEntryCard.d.ts

@@ -0,0 +1,7 @@
+import { MediaResourceTabKey } from "./constants";
+interface MediaEntryCardProps {
+    onSelect: (tabKey: MediaResourceTabKey) => void;
+}
+declare const MediaEntryCard: ({ onSelect }: MediaEntryCardProps) => import("react/jsx-runtime").JSX.Element;
+export default MediaEntryCard;
+//# sourceMappingURL=MediaEntryCard.d.ts.map

package/dist/components/media-resources/MediaEntryCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaEntryCard.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaEntryCard.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,mBAAmB,EAGpB,MAAM,aAAa,CAAC;AAErB,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAC;CACjD;AAED,QAAA,MAAM,cAAc,GAAI,cAAc,mBAAmB,4CA4BxD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/media-resources/MediaEntryCard.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { Icon } from "../../components/icon";
+import { MEDIA_RESOURCE_TAB_ORDER, RESOURCE_ENTRY_ICON, RESOURCE_TAB_LABEL_KEY, } from "./constants";
+const MediaEntryCard = ({ onSelect }) => {
+    const { t } = useTranslation();
+    return (_jsx("div", { "data-testid": "media-entry-card", className: "flex w-full items-center justify-between overflow-hidden rounded-[12px] bg-white", children: MEDIA_RESOURCE_TAB_ORDER.map((tabKey) => (_jsxs("button", { type: "button", "data-testid": `media-entry-${tabKey}`, className: "flex min-w-0 flex-1 cursor-pointer flex-col items-center justify-center gap-1 px-2 py-3", onClick: () => onSelect(tabKey), children: [_jsx(Icon, { icon: RESOURCE_ENTRY_ICON[tabKey], size: 24, className: "text-gray-900" }), _jsx("span", { className: "whitespace-nowrap text-center text-[12px] font-normal leading-[1.6] text-gray-900", children: t(RESOURCE_TAB_LABEL_KEY[tabKey]) })] }, tabKey))) }));
+};
+export default MediaEntryCard;

package/dist/components/media-resources/MediaResourcePanel.d.ts

@@ -0,0 +1,9 @@
+import { MediaResourceTabKey } from "./constants";
+interface MediaResourcePanelProps {
+    open: boolean;
+    initialTab: MediaResourceTabKey;
+    onClose: () => void;
+}
+declare const MediaResourcePanel: ({ open, initialTab, onClose, }: MediaResourcePanelProps) => import("react/jsx-runtime").JSX.Element;
+export default MediaResourcePanel;
+//# sourceMappingURL=MediaResourcePanel.d.ts.map

package/dist/components/media-resources/MediaResourcePanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaResourcePanel.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaResourcePanel.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGlD,UAAU,uBAAuB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,mBAAmB,CAAC;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,kBAAkB,GAAI,gCAIzB,uBAAuB,4CAoCzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/media-resources/MediaResourcePanel.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Drawer } from "antd";
+import { useTranslation } from "react-i18next";
+import { Icon } from "../../components/icon";
+import MediaResourceTabs from "./MediaResourceTabs";
+const MediaResourcePanel = ({ open, initialTab, onClose, }) => {
+    const { t } = useTranslation();
+    return (_jsx(Drawer, { open: open, onClose: onClose, placement: "right", closeIcon: false, width: "100%", styles: {
+            body: { padding: 0 },
+        }, getContainer: false, destroyOnHidden: true, children: _jsxs("div", { className: "flex h-full flex-col bg-white", children: [_jsxs("div", { className: "flex w-full items-center p-2", children: [_jsx("button", { type: "button", "data-testid": "media-resource-back", className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-primary-400", onClick: onClose, children: _jsx(Icon, { icon: "arrow-left-o", size: 24 }) }), _jsx("p", { className: "min-w-0 flex-1 truncate px-2 text-[18px] font-bold leading-[1.6] text-gray-900", children: t("media_resources_title") })] }), _jsx("div", { className: "min-h-0 flex-1", children: _jsx(MediaResourceTabs, { initialTab: initialTab }) })] }) }));
+};
+export default MediaResourcePanel;

package/dist/components/media-resources/MediaResourceTabBar.d.ts

@@ -0,0 +1,8 @@
+import { MediaResourceTabKey } from "./constants";
+interface MediaResourceTabBarProps {
+    activeKey: MediaResourceTabKey;
+    onChange: (key: MediaResourceTabKey) => void;
+}
+declare const MediaResourceTabBar: ({ activeKey, onChange, }: MediaResourceTabBarProps) => import("react/jsx-runtime").JSX.Element;
+export default MediaResourceTabBar;
+//# sourceMappingURL=MediaResourceTabBar.d.ts.map

package/dist/components/media-resources/MediaResourceTabBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaResourceTabBar.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaResourceTabBar.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,mBAAmB,EAEpB,MAAM,aAAa,CAAC;AAErB,UAAU,wBAAwB;IAChC,SAAS,EAAE,mBAAmB,CAAC;IAC/B,QAAQ,EAAE,CAAC,GAAG,EAAE,mBAAmB,KAAK,IAAI,CAAC;CAC9C;AAED,QAAA,MAAM,mBAAmB,GAAI,0BAG1B,wBAAwB,4CAwC1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/components/media-resources/MediaResourceTabBar.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import { useTranslation } from "react-i18next";
+import { MEDIA_RESOURCE_TAB_ORDER, RESOURCE_TAB_LABEL_KEY, } from "./constants";
+const MediaResourceTabBar = ({ activeKey, onChange, }) => {
+    const { t } = useTranslation();
+    return (_jsx("div", { role: "tablist", "data-testid": "media-resource-tab-bar", className: "flex w-full items-end border-b border-gray-25 bg-white", children: MEDIA_RESOURCE_TAB_ORDER.map((tabKey) => {
+            const isActive = tabKey === activeKey;
+            return (_jsxs("button", { type: "button", role: "tab", "aria-selected": isActive, "data-testid": `media-resource-tab-${tabKey}`, className: "flex cursor-pointer flex-col items-center justify-center px-3 pt-0.5", onClick: () => onChange(tabKey), children: [_jsx("span", { className: clsx("text-center text-[14px] font-bold leading-[1.6] tracking-[0.14px]", isActive ? "text-primary-400" : "text-gray-400"), children: t(RESOURCE_TAB_LABEL_KEY[tabKey]) }), _jsx("span", { className: clsx("h-[3px] w-full rounded-[4px] bg-primary-400", !isActive && "opacity-0") })] }, tabKey));
+        }) }));
+};
+export default MediaResourceTabBar;