@dust-tt/sparkle 0.2.285 → 0.2.287-rc-1

package/dist/cjs/index.js

@@ -460,9 +460,9 @@ var SvgImage$1 = function (props) { return (React__namespace.createElement("svg"
     React__namespace.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M2 21V3h20v18H2Zm18-6V5H4v14L14 9l6 6Z", clipRule: "evenodd" }))); };
 var SvgImage$2 = SvgImage$1;
 
-var SvgInformationCircle$2 = function (props) { return (React__namespace.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
+var SvgInformationCircle$1 = function (props) { return (React__namespace.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
     React__namespace.createElement("path", { fill: "currentColor", d: "M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10Zm-1-11v6h2v-6h-2Zm0-4v2h2V7h-2Z" }))); };
-var InformationCircleIcon = SvgInformationCircle$2;
+var InformationCircleIcon = SvgInformationCircle$1;
 
 var SvgKey$2 = function (props) { return (React__namespace.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
     React__namespace.createElement("path", { fill: "currentColor", d: "m10.313 11.566 7.94-7.94 2.121 2.12-1.414 1.415 2.121 2.121-3.535 3.536-2.121-2.121-2.99 2.99a5.002 5.002 0 0 1-7.97 5.848 5 5 0 0 1 5.848-7.97Zm-.899 5.848a2 2 0 1 0-2.828-2.828 2 2 0 0 0 2.828 2.828Z" }))); };
@@ -43484,7 +43484,7 @@ var ImageStrokeIcon = SvgImage;
 
 var SvgInformationCircle = function (props) { return (React__namespace.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
     React__namespace.createElement("path", { fill: "currentColor", d: "M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10Zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM11 7h2v2h-2V7Zm0 4h2v6h-2v-6Z" }))); };
-var SvgInformationCircle$1 = SvgInformationCircle;
+var InformationCircleStrokeIcon = SvgInformationCircle;
 
 var SvgKey = function (props) { return (React__namespace.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24" }, props),
     React__namespace.createElement("path", { fill: "currentColor", d: "m10.758 11.828 7.849-7.849 1.414 1.414-1.414 1.414 2.474 2.475-1.414 1.415-2.475-2.475-1.414 1.414 2.121 2.121-1.414 1.414-2.121-2.12-2.192 2.191a5.002 5.002 0 0 1-7.708 6.293 5 5 0 0 1 6.294-7.707Zm-.637 6.293A3 3 0 1 0 5.88 13.88a3 3 0 0 0 4.242 4.242Z" }))); };
@@ -85122,11 +85122,24 @@ function IconToggleButton(_a) {
     return tooltip ? (React.createElement(Tooltip, { trigger: IconButtonToggleContent, label: tooltip, side: tooltipPosition })) : (IconButtonToggleContent);
 }
 
+var messageVariantStyles = {
+    info: "s-text-muted-foreground",
+    default: "s-text-muted-foreground",
+    error: "s-text-foreground-warning",
+};
 var stateVariantStyles = {
     default: "focus-visible:s-ring-ring",
     disabled: "disabled:s-cursor-not-allowed disabled:s-opacity-50 disabled:s-text-muted-foreground",
     error: "s-border-border-warning focus:s-ring-ring-warning",
 };
+var messageVariant = cva("", {
+    variants: {
+        status: messageVariantStyles,
+    },
+    defaultVariants: {
+        status: "info",
+    },
+});
 var inputStyleClasses = cva(cn("s-text-sm s-bg-background s-rounded-xl s-border s-border-border-dark s-flex s-h-9 s-w-full s-px-3 s-py-1.5 ", "file:s-border-0 file:s-bg-transparent file:s-text-sm file:s-font-medium file:s-text-foreground", "placeholder:s-text-muted-foreground", "focus-visible:s-outline-none focus-visible:s-ring-2 focus-visible:s-ring-offset-2 focus-visible:s-border-border-dark"), {
     variants: {
         state: stateVariantStyles,
@@ -85136,12 +85149,14 @@ var inputStyleClasses = cva(cn("s-text-sm s-bg-background s-rounded-xl s-border
     },
 });
 var Input = React.forwardRef(function (_a, ref) {
-    var className = _a.className, error = _a.error, value = _a.value, label = _a.label, disabled = _a.disabled, _b = _a.showErrorLabel, showErrorLabel = _b === void 0 ? false : _b, props = __rest(_a, ["className", "error", "value", "label", "disabled", "showErrorLabel"]);
-    var state = error ? "error" : disabled ? "disabled" : "default";
-    return (React.createElement("div", { className: "s-flex s-flex-col s-gap-1 s-px-1" },
+    var className = _a.className, message = _a.message, messageStatus = _a.messageStatus, value = _a.value, label = _a.label, isError = _a.isError, disabled = _a.disabled, props = __rest(_a, ["className", "message", "messageStatus", "value", "label", "isError", "disabled"]);
+    var state = isError ? "error" : disabled ? "disabled" : "default";
+    return (React.createElement("div", { className: "s-flex s-flex-col s-gap-1" },
         label && React.createElement(Label$1, { htmlFor: props.name }, label),
         React.createElement("input", __assign({ ref: ref, className: cn(inputStyleClasses({ state: state }), className), "data-1p-ignore": props.type !== "password", value: value !== null && value !== void 0 ? value : undefined, disabled: disabled }, props)),
-        showErrorLabel && error && (React.createElement("div", { className: "s-ml-3.5 s-text-xs s-text-foreground-warning" }, error))));
+        message && (React.createElement("div", { className: cn("s-ml-3.5 s-flex s-items-center s-gap-1 s-text-xs", messageVariant({ status: messageStatus })) },
+            messageStatus === "info" && (React.createElement(Icon, { visual: InformationCircleStrokeIcon, size: "xs" })),
+            message))));
 });
 Input.displayName = "Input";
 
@@ -106717,11 +106732,10 @@ var NavigationList = React__namespace.forwardRef(function (_a, ref) {
 });
 NavigationList.displayName = "NavigationList";
 var NavigationListItem = React__namespace.forwardRef(function (_a, ref) {
-    var className = _a.className, selected = _a.selected, label = _a.label, icon = _a.icon, href = _a.href, target = _a.target, rel = _a.rel, replace = _a.replace, shallow = _a.shallow, props = __rest(_a, ["className", "selected", "label", "icon", "href", "target", "rel", "replace", "shallow"]);
-    var _b = __read(React__namespace.useState(false), 2), isHovered = _b[0], setIsHovered = _b[1];
-    var _c = __read(React__namespace.useState(false), 2), isPressed = _c[0], setIsPressed = _c[1];
+    var className = _a.className, selected = _a.selected, label = _a.label, icon = _a.icon, href = _a.href, target = _a.target, rel = _a.rel, replace = _a.replace, shallow = _a.shallow, moreMenu = _a.moreMenu, props = __rest(_a, ["className", "selected", "label", "icon", "href", "target", "rel", "replace", "shallow", "moreMenu"]);
+    var _b = __read(React__namespace.useState(false), 2), isPressed = _b[0], setIsPressed = _b[1];
     var handleMouseDown = function (event) {
-        if (!event.target.closest(".new-button-class")) {
+        if (!event.target.closest(".button-class")) {
             setIsPressed(true);
         }
     };
@@ -106729,14 +106743,12 @@ var NavigationListItem = React__namespace.forwardRef(function (_a, ref) {
         React__namespace.createElement("div", { className: listStyles({
                 layout: "item",
                 state: selected ? "selected" : isPressed ? "active" : "unselected",
-            }), onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () {
-                setIsHovered(false);
+            }), onMouseLeave: function () {
                 setIsPressed(false);
             }, onMouseDown: handleMouseDown, onMouseUp: function () { return setIsPressed(false); } },
             icon && React__namespace.createElement(Icon, { visual: icon, size: "sm" }),
             label && (React__namespace.createElement("span", { className: "s-grow s-overflow-hidden s-text-ellipsis s-whitespace-nowrap" }, label)),
-            isHovered && (React__namespace.createElement("div", { className: "-s-mr-2 s-flex s-h-4 s-items-center" },
-                React__namespace.createElement(Button, { variant: "ghost", icon: MoreIcon, size: "xs", onClick: function (e) { return e.stopPropagation(); }, onMouseDown: function (e) { return e.stopPropagation(); }, onMouseUp: function (e) { return e.stopPropagation(); } }))))));
+            selected && moreMenu && (React__namespace.createElement("div", { className: "-s-mr-2 s-flex s-h-4 s-items-center" }, moreMenu)))));
     return (React__namespace.createElement(LinkWrapper, { href: href, target: target, rel: rel, replace: replace, shallow: shallow, className: className }, content));
 });
 NavigationListItem.displayName = "NavigationListItem";
@@ -113320,7 +113332,7 @@ exports.IconToggleButton = IconToggleButton;
 exports.ImageIcon = SvgImage$2;
 exports.ImageStrokeIcon = ImageStrokeIcon;
 exports.InformationCircleIcon = InformationCircleIcon;
-exports.InformationCircleStrokeIcon = SvgInformationCircle$1;
+exports.InformationCircleStrokeIcon = InformationCircleStrokeIcon;
 exports.Input = Input;
 exports.IntercomLogo = IntercomLogo;
 exports.Item = Item$3;