@dust-tt/sparkle 0.2.205 → 0.2.206
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/cjs/components/DataTable.d.ts +2 -1
- package/dist/cjs/index.js +2 -2
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/components/DataTable.d.ts +2 -1
- package/dist/esm/index.js +2 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +2 -2
- package/src/components/DataTable.tsx +8 -1
- package/src/stories/DataTable.stories.tsx +3 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dust-tt/sparkle",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.206",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"build": "rm -rf dist && rollup -c",
|
|
6
6
|
"build:with-tw-base": "rollup -c --environment INCLUDE_TW_BASE:true",
|
|
@@ -92,4 +92,4 @@
|
|
|
92
92
|
"tailwind-scrollbar-hide": "^1.1.7"
|
|
93
93
|
},
|
|
94
94
|
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
|
|
95
|
-
}
|
|
95
|
+
}
|
|
@@ -250,6 +250,7 @@ interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
|
|
|
250
250
|
avatarUrl?: string;
|
|
251
251
|
icon?: React.ComponentType<{ className?: string }>;
|
|
252
252
|
iconClassName?: string;
|
|
253
|
+
roundedAvatar?: boolean;
|
|
253
254
|
children?: ReactNode;
|
|
254
255
|
description?: string;
|
|
255
256
|
}
|
|
@@ -258,6 +259,7 @@ DataTable.Cell = function Cell({
|
|
|
258
259
|
children,
|
|
259
260
|
className,
|
|
260
261
|
avatarUrl,
|
|
262
|
+
roundedAvatar,
|
|
261
263
|
icon,
|
|
262
264
|
iconClassName,
|
|
263
265
|
description,
|
|
@@ -273,7 +275,12 @@ DataTable.Cell = function Cell({
|
|
|
273
275
|
>
|
|
274
276
|
<div className="s-flex">
|
|
275
277
|
{avatarUrl && (
|
|
276
|
-
<Avatar
|
|
278
|
+
<Avatar
|
|
279
|
+
visual={avatarUrl}
|
|
280
|
+
size="xs"
|
|
281
|
+
className="s-mr-2"
|
|
282
|
+
isRounded={roundedAvatar ?? false}
|
|
283
|
+
/>
|
|
277
284
|
)}
|
|
278
285
|
{icon && (
|
|
279
286
|
<Icon
|
|
@@ -22,6 +22,7 @@ type Data = {
|
|
|
22
22
|
icon?: React.ComponentType<{ className?: string }>;
|
|
23
23
|
onClick?: () => void;
|
|
24
24
|
onMoreClick?: () => void;
|
|
25
|
+
roundedAvatar?: boolean;
|
|
25
26
|
};
|
|
26
27
|
|
|
27
28
|
export const DataTableExample = () => {
|
|
@@ -34,6 +35,7 @@ export const DataTableExample = () => {
|
|
|
34
35
|
lastUpdated: "July 8, 2023",
|
|
35
36
|
size: "32kb",
|
|
36
37
|
avatarUrl: "https://dust.tt/static/droidavatar/Droid_Lime_3.jpg",
|
|
38
|
+
roundedAvatar: true,
|
|
37
39
|
onClick: () => console.log("hehe"),
|
|
38
40
|
onMoreClick: () => console.log("show more"),
|
|
39
41
|
},
|
|
@@ -77,6 +79,7 @@ export const DataTableExample = () => {
|
|
|
77
79
|
avatarUrl={info.row.original.avatarUrl}
|
|
78
80
|
icon={info.row.original.icon}
|
|
79
81
|
description={info.row.original.description}
|
|
82
|
+
roundedAvatar={info.row.original.roundedAvatar}
|
|
80
83
|
>
|
|
81
84
|
{info.row.original.name}
|
|
82
85
|
</DataTable.Cell>
|