@dust-tt/sparkle 0.2.210-rc74 → 0.2.210-rc75

package/dist/cjs/components/Tree.d.ts

@@ -4,16 +4,18 @@ export interface TreeProps {
     children?: ReactNode;
     isBoxed?: boolean;
     isLoading?: boolean;
+    tailwindIconTextColor?: string;
     variant?: "navigator" | "finder";
 }
-export declare function Tree({ children, isLoading, isBoxed, variant, }: TreeProps): React.JSX.Element;
+export declare function Tree({ children, isLoading, isBoxed, tailwindIconTextColor, variant, }: TreeProps): React.JSX.Element;
 export declare namespace Tree {
-    var Item: ({ label, type, className, size, visual, checkbox, onChevronClick, collapsed, defaultCollapsed, actions, areActionsFading, renderTreeItems, children, isNavigatable, isSelected, onItemClick, }: TreeItemPropsWithChildren | TreeItemPropsWithRender) => React.JSX.Element;
+    var Item: ({ label, type, className, size, tailwindIconTextColor, visual, checkbox, onChevronClick, collapsed, defaultCollapsed, actions, areActionsFading, renderTreeItems, children, isNavigatable, isSelected, onItemClick, }: TreeItemPropsWithChildren | TreeItemPropsWithRender) => React.JSX.Element;
 }
 interface TreeItemProps {
     label?: string;
     type?: "node" | "item" | "leaf";
     size?: "sm" | "md";
+    tailwindIconTextColor?: string;
     visual?: ComponentType<{
         className?: string;
     }>;

package/dist/cjs/index.js

@@ -76352,21 +76352,29 @@ function IconButton(_a) {
 }
 
 function Tree(_a) {
-    var children = _a.children, isLoading = _a.isLoading, _b = _a.isBoxed, isBoxed = _b === void 0 ? false : _b, _c = _a.variant, variant = _c === void 0 ? "finder" : _c;
+    var children = _a.children, isLoading = _a.isLoading, _b = _a.isBoxed, isBoxed = _b === void 0 ? false : _b, tailwindIconTextColor = _a.tailwindIconTextColor, _c = _a.variant, variant = _c === void 0 ? "finder" : _c;
     var modifiedChildren = React.Children.map(children, function (child) {
-        if (React.isValidElement(child) && variant === "navigator") {
-            return React.cloneElement(child, { isNavigatable: true });
+        if (React.isValidElement(child)) {
+            // Clone the child element and pass the necessary props
+            var childProps = {};
+            if (variant === "navigator") {
+                childProps.isNavigatable = true;
+            }
+            if (tailwindIconTextColor) {
+                childProps.tailwindIconTextColor = tailwindIconTextColor;
+            }
+            return React.cloneElement(child, childProps);
         }
         return child;
     });
     return isLoading ? (React.createElement("div", { className: "s-py-2 s-pl-4" },
         React.createElement(Spinner, { size: "xs", variant: "dark" }))) : (React.createElement("div", { className: classNames("s-flex s-flex-col s-gap-1 s-overflow-hidden", isBoxed
-            ? "s- s-rounded-xl s-border s-border-structure-200 s-bg-structure-50 s-p-4"
+            ? "s-rounded-xl s-border s-border-structure-200 s-bg-structure-50 s-p-4"
             : "") }, modifiedChildren));
 }
 Tree.Item = function (_a) {
-    var label = _a.label, _b = _a.type, type = _b === void 0 ? "node" : _b, _c = _a.className, className = _c === void 0 ? "" : _c, _d = _a.size, size = _d === void 0 ? "sm" : _d, visual = _a.visual, checkbox = _a.checkbox, onChevronClick = _a.onChevronClick, collapsed = _a.collapsed, defaultCollapsed = _a.defaultCollapsed, actions = _a.actions, _e = _a.areActionsFading, areActionsFading = _e === void 0 ? true : _e, renderTreeItems = _a.renderTreeItems, children = _a.children, _f = _a.isNavigatable, isNavigatable = _f === void 0 ? false : _f, _g = _a.isSelected, isSelected = _g === void 0 ? false : _g, onItemClick = _a.onItemClick;
-    var _h = __read(React.useState(defaultCollapsed !== null && defaultCollapsed !== void 0 ? defaultCollapsed : true), 2), collapsedState = _h[0], setCollapsedState = _h[1];
+    var label = _a.label, _b = _a.type, type = _b === void 0 ? "node" : _b, _c = _a.className, className = _c === void 0 ? "" : _c, _d = _a.size, size = _d === void 0 ? "sm" : _d, _e = _a.tailwindIconTextColor, tailwindIconTextColor = _e === void 0 ? "s-text-element-600" : _e, visual = _a.visual, checkbox = _a.checkbox, onChevronClick = _a.onChevronClick, collapsed = _a.collapsed, defaultCollapsed = _a.defaultCollapsed, actions = _a.actions, _f = _a.areActionsFading, areActionsFading = _f === void 0 ? true : _f, renderTreeItems = _a.renderTreeItems, children = _a.children, _g = _a.isNavigatable, isNavigatable = _g === void 0 ? false : _g, _h = _a.isSelected, isSelected = _h === void 0 ? false : _h, onItemClick = _a.onItemClick;
+    var _j = __read(React.useState(defaultCollapsed !== null && defaultCollapsed !== void 0 ? defaultCollapsed : true), 2), collapsedState = _j[0], setCollapsedState = _j[1];
     var isControlledCollapse = collapsed !== undefined;
     var effectiveCollapsed = isControlledCollapse ? collapsed : collapsedState;
     var effectiveOnChevronClick = isControlledCollapse
@@ -76407,7 +76415,7 @@ Tree.Item = function (_a) {
                 } })),
             type === "leaf" && React.createElement("div", { className: "s-w-5" }),
             checkbox && React.createElement(Checkbox, __assign({}, checkbox, { size: "xs" })),
-            React.createElement(Icon, { visual: visual, size: size === "sm" ? "sm" : "md", className: "s-flex-shrink-0 s-text-element-600" }),
+            React.createElement(Icon, { visual: visual, size: size === "sm" ? "sm" : "md", className: classNames("s-flex-shrink-0", tailwindIconTextColor) }),
             React.createElement("div", { className: classNames("s-truncate s-font-medium s-text-element-900", size === "sm" ? "s-ml-1 s-text-sm" : "s-ml-1 s-text-base") }, label),
             React.createElement("div", { className: "s-grow" }),
             actions && (React.createElement("div", { className: classNames("s-flex s-gap-2 s-pl-4", areActionsFading