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

package/dist/esm/components/Input.d.ts

@@ -1,10 +1,14 @@
 import React from "react";
+declare const MESSAGE_STATUS: readonly ["info", "default", "error"];
+type MessageStatus = (typeof MESSAGE_STATUS)[number];
 export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "value"> {
-    error?: string | null;
+    message?: string;
+    messageStatus?: MessageStatus;
     value?: string | null;
-    showErrorLabel?: boolean;
+    isError?: boolean;
     className?: string;
     label?: string;
 }
 export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+export {};
 //# sourceMappingURL=Input.d.ts.map

package/dist/esm/components/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAM1C,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAClE,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA6BD,eAAO,MAAM,KAAK,qFAiCjB,CAAC"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAQ1C,QAAA,MAAM,cAAc,uCAAwC,CAAC;AAE7D,KAAK,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;AAErD,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA6CD,eAAO,MAAM,KAAK,qFA0CjB,CAAC"}

package/dist/esm/components/Input.js

@@ -1,14 +1,30 @@
 import { __assign, __rest } from "tslib";
 import { cva } from "class-variance-authority";
 import React, { forwardRef } from "react";
+import { Icon } from "../components/Icon";
+import { InformationCircleStrokeIcon } from "../icons";
 import { cn } from "../lib/utils";
 import { Label } from "./Label";
+var MESSAGE_STATUS = ["info", "default", "error"];
 var INPUT_STATES = ["error", "disabled", "default"];
+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,
@@ -18,12 +34,14 @@ var inputStyleClasses = cva(cn("s-text-sm s-bg-background s-rounded-xl s-border
     },
 });
 export var Input = 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, { 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";
 //# sourceMappingURL=Input.js.map

package/dist/esm/components/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/Input.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AAExC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAWhC,IAAM,YAAY,GAAG,CAAC,OAAO,EAAE,UAAU,EAAE,SAAS,CAAC,CAAC;AAItD,IAAM,kBAAkB,GAAmC;IACzD,OAAO,EAAE,2BAA2B;IACpC,QAAQ,EACN,sFAAsF;IACxF,KAAK,EAAE,mDAAmD;CAC3D,CAAC;AACF,IAAM,iBAAiB,GAAG,GAAG,CAC3B,EAAE,CACA,6GAA6G,EAC7G,gGAAgG,EAChG,qCAAqC,EACrC,sHAAsH,CACvH,EACD;IACE,QAAQ,EAAE;QACR,KAAK,EAAE,kBAAkB;KAC1B;IACD,eAAe,EAAE;QACf,KAAK,EAAE,SAAS;KACjB;CACF,CACF,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,UAAU,CAC7B,UACE,EAQC,EACD,GAAG;IARD,IAAA,SAAS,eAAA,EACT,KAAK,WAAA,EACL,KAAK,WAAA,EACL,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,sBAAsB,EAAtB,cAAc,mBAAG,KAAK,KAAA,EACnB,KAAK,cAPV,sEAQC,CADS;IAIV,IAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;IAClE,OAAO,CACL,6BAAK,SAAS,EAAC,kCAAkC;QAC9C,KAAK,IAAI,oBAAC,KAAK,IAAC,OAAO,EAAE,KAAK,CAAC,IAAI,IAAG,KAAK,CAAS;QACrD,wCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAAE,SAAS,CAAC,oBACtC,KAAK,CAAC,IAAI,KAAK,UAAU,EACzC,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,SAAS,EACzB,QAAQ,EAAE,QAAQ,IACd,KAAK,EACT;QACD,cAAc,IAAI,KAAK,IAAI,CAC1B,6BAAK,SAAS,EAAC,8CAA8C,IAC1D,KAAK,CACF,CACP,CACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC"}
+{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/Input.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAC;AAChD,OAAO,EAAE,2BAA2B,EAAE,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AAExC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,IAAM,cAAc,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,OAAO,CAAU,CAAC;AAc7D,IAAM,YAAY,GAAG,CAAC,OAAO,EAAE,UAAU,EAAE,SAAS,CAAC,CAAC;AAItD,IAAM,oBAAoB,GAAkC;IAC1D,IAAI,EAAE,yBAAyB;IAC/B,OAAO,EAAE,yBAAyB;IAClC,KAAK,EAAE,2BAA2B;CACnC,CAAC;AAEF,IAAM,kBAAkB,GAAmC;IACzD,OAAO,EAAE,2BAA2B;IACpC,QAAQ,EACN,sFAAsF;IACxF,KAAK,EAAE,mDAAmD;CAC3D,CAAC;AAEF,IAAM,cAAc,GAAG,GAAG,CAAC,EAAE,EAAE;IAC7B,QAAQ,EAAE;QACR,MAAM,EAAE,oBAAoB;KAC7B;IACD,eAAe,EAAE;QACf,MAAM,EAAE,MAAM;KACf;CACF,CAAC,CAAC;AAEH,IAAM,iBAAiB,GAAG,GAAG,CAC3B,EAAE,CACA,6GAA6G,EAC7G,gGAAgG,EAChG,qCAAqC,EACrC,sHAAsH,CACvH,EACD;IACE,QAAQ,EAAE;QACR,KAAK,EAAE,kBAAkB;KAC1B;IACD,eAAe,EAAE;QACf,KAAK,EAAE,SAAS;KACjB;CACF,CACF,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,UAAU,CAC7B,UACE,EASC,EACD,GAAG;IATD,IAAA,SAAS,eAAA,EACT,OAAO,aAAA,EACP,aAAa,mBAAA,EACb,KAAK,WAAA,EACL,KAAK,WAAA,EACL,OAAO,aAAA,EACP,QAAQ,cAAA,EACL,KAAK,cARV,kFASC,CADS;IAIV,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;IACpE,OAAO,CACL,6BAAK,SAAS,EAAC,2BAA2B;QACvC,KAAK,IAAI,oBAAC,KAAK,IAAC,OAAO,EAAE,KAAK,CAAC,IAAI,IAAG,KAAK,CAAS;QACrD,wCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAAE,SAAS,CAAC,oBACtC,KAAK,CAAC,IAAI,KAAK,UAAU,EACzC,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,SAAS,EACzB,QAAQ,EAAE,QAAQ,IACd,KAAK,EACT;QACD,OAAO,IAAI,CACV,6BACE,SAAS,EAAE,EAAE,CACX,kDAAkD,EAClD,cAAc,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,CAAC,CAC1C;YAEA,aAAa,KAAK,MAAM,IAAI,CAC3B,oBAAC,IAAI,IAAC,MAAM,EAAE,2BAA2B,EAAE,IAAI,EAAC,IAAI,GAAG,CACxD;YACA,OAAO,CACJ,CACP,CACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC"}

package/dist/esm/components/NavigationList.d.ts

@@ -6,7 +6,7 @@ interface NavigationListItemProps extends React.HTMLAttributes<HTMLDivElement>,
     selected?: boolean;
     label?: string;
     icon?: React.ComponentType;
-    showMoreIcon?: boolean;
+    moreMenu?: React.ReactNode;
 }
 declare const NavigationListItem: React.ForwardRefExoticComponent<NavigationListItemProps & React.RefAttributes<HTMLDivElement>>;
 declare const variantStyles: (props?: ({

package/dist/esm/components/NavigationList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationList.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAIL,gBAAgB,EACjB,MAAM,sBAAsB,CAAC;AA8B9B,QAAA,MAAM,cAAc,6GASlB,CAAC;AAGH,UAAU,uBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,IAAI,CAAC,gBAAgB,EAAE,UAAU,GAAG,WAAW,CAAC;IAClD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,kBAAkB,gGA8EvB,CAAC;AAGF,QAAA,MAAM,aAAa;;mFAUjB,CAAC;AAEH,UAAU,wBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,mBAAmB,iGAWvB,CAAC;AAIH,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,CAAC"}
+{"version":3,"file":"NavigationList.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAqB,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AA6B3E,QAAA,MAAM,cAAc,6GASlB,CAAC;AAGH,UAAU,uBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,IAAI,CAAC,gBAAgB,EAAE,UAAU,GAAG,WAAW,CAAC;IAClD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,QAAA,MAAM,kBAAkB,gGAqEvB,CAAC;AAGF,QAAA,MAAM,aAAa;;mFAUjB,CAAC;AAEH,UAAU,wBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,mBAAmB,iGAWvB,CAAC;AAIH,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,CAAC"}

package/dist/esm/components/NavigationList.js

@@ -1,8 +1,7 @@
 import { __assign, __read, __rest } from "tslib";
 import { cva } from "class-variance-authority";
 import * as React from "react";
-import { Button, Icon, LinkWrapper, } from "../components";
-import { MoreIcon } from "../icons";
+import { Icon, LinkWrapper } from "../components";
 import { cn } from "../lib/utils";
 var listStyles = cva("s-flex", {
     variants: {
@@ -28,11 +27,10 @@ var NavigationList = React.forwardRef(function (_a, ref) {
 });
 NavigationList.displayName = "NavigationList";
 var NavigationListItem = React.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.useState(false), 2), isHovered = _b[0], setIsHovered = _b[1];
-    var _c = __read(React.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.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);
         }
     };
@@ -40,14 +38,12 @@ var NavigationListItem = React.forwardRef(function (_a, ref) {
         React.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.createElement(Icon, { visual: icon, size: "sm" }),
             label && (React.createElement("span", { className: "s-grow s-overflow-hidden s-text-ellipsis s-whitespace-nowrap" }, label)),
-            isHovered && (React.createElement("div", { className: "-s-mr-2 s-flex s-h-4 s-items-center" },
-                React.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.createElement("div", { className: "-s-mr-2 s-flex s-h-4 s-items-center" }, moreMenu)))));
     return (React.createElement(LinkWrapper, { href: href, target: target, rel: rel, replace: replace, shallow: shallow, className: className }, content));
 });
 NavigationListItem.displayName = "NavigationListItem";

package/dist/esm/components/NavigationList.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationList.js","sourceRoot":"","sources":["../../../src/components/NavigationList.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"NavigationList.js","sourceRoot":"","sources":["../../../src/components/NavigationList.tsx"],"names":[],"mappings":"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"}

package/dist/esm/stories/Input.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/Input.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,QAAA,MAAM,IAAI;;;CAGoB,CAAC;AAE/B,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,YAAY,yBA4ExB,CAAC"}
+{"version":3,"file":"Input.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/Input.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,QAAA,MAAM,IAAI;;;CAGoB,CAAC;AAE/B,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,YAAY,yBA8ExB,CAAC"}

package/dist/esm/stories/Input.stories.js

@@ -7,18 +7,18 @@ var meta = {
 export default meta;
 export var InputExample = function () { return (React.createElement("div", { className: "s-flex s-flex-col s-gap-20" },
     React.createElement("div", { className: "s-grid s-grid-cols-3 s-gap-4" },
-        React.createElement(Input, { placeholder: "placeholder", name: "input" }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", error: "errored because it's a very long message", showErrorLabel: true }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", error: "errored" }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", error: "errored because it's a very long message", showErrorLabel: true }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "disabled", disabled: true, showErrorLabel: true })),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", message: "Name must be unique", messageStatus: "info" }),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", message: "errored because it's a very long message", messageStatus: "error" }),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", message: "Default message" }),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", message: "errored because it's a very long message", messageStatus: "error" }),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "disabled", disabled: true, messageStatus: "error" })),
     React.createElement("div", { className: "s-grid s-grid-cols-3 s-gap-4" },
         React.createElement(Input, { placeholder: "placeholder", name: "input" }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", error: "errored because it's a very long message", showErrorLabel: true }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", error: "errored" }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", error: "errored because it's a very long message", showErrorLabel: true }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "test", showErrorLabel: true })),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", message: "errored because it's a very long message", messageStatus: "error" }),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", message: "Default message" }),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "value", message: "errored because it's a very long message", messageStatus: "error" }),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", value: "test", messageStatus: "error" })),
     React.createElement("div", { className: "s-grid s-grid-cols-3 s-gap-4" },
-        React.createElement(Input, { placeholder: "placeholder", name: "input", label: "Firstname", showErrorLabel: true }),
-        React.createElement(Input, { placeholder: "placeholder", name: "input", label: "Lastname", showErrorLabel: true })))); };
+        React.createElement(Input, { placeholder: "placeholder", name: "input", label: "Firstname", isError: true }),
+        React.createElement(Input, { placeholder: "placeholder", name: "input", label: "Lastname", message: "Input your lastname", messageStatus: "info", isError: true })))); };
 //# sourceMappingURL=Input.stories.js.map

package/dist/esm/stories/Input.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.stories.js","sourceRoot":"","sources":["../../../src/stories/Input.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAE9C,IAAM,IAAI,GAAG;IACX,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,KAAK;CACY,CAAC;AAE/B,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,IAAM,YAAY,GAAG,cAAM,OAAA,CAChC,6BAAK,SAAS,EAAC,4BAA4B;IACzC,6BAAK,SAAS,EAAC,8BAA8B;QAC3C,oBAAC,KAAK,IAAC,WAAW,EAAC,aAAa,EAAC,IAAI,EAAC,OAAO,GAAG;QAChD,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,KAAK,EAAC,0CAA0C,EAChD,cAAc,SACd;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,KAAK,EAAC,SAAS,GACf;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,KAAK,EAAC,0CAA0C,EAChD,cAAc,SACd;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,UAAU,EAChB,QAAQ,EAAE,IAAI,EACd,cAAc,SACd,CACE;IACN,6BAAK,SAAS,EAAC,8BAA8B;QAC3C,oBAAC,KAAK,IAAC,WAAW,EAAC,aAAa,EAAC,IAAI,EAAC,OAAO,GAAG;QAChD,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,KAAK,EAAC,0CAA0C,EAChD,cAAc,SACd;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,KAAK,EAAC,SAAS,GACf;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,KAAK,EAAC,0CAA0C,EAChD,cAAc,SACd;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,MAAM,EACZ,cAAc,SACd,CACE;IACN,6BAAK,SAAS,EAAC,8BAA8B;QAC3C,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,WAAW,EACjB,cAAc,SACd;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,UAAU,EAChB,cAAc,SACd,CACE,CACF,CACP,EA5EiC,CA4EjC,CAAC"}
+{"version":3,"file":"Input.stories.js","sourceRoot":"","sources":["../../../src/stories/Input.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAE9C,IAAM,IAAI,GAAG;IACX,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,KAAK;CACY,CAAC;AAE/B,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,IAAM,YAAY,GAAG,cAAM,OAAA,CAChC,6BAAK,SAAS,EAAC,4BAA4B;IACzC,6BAAK,SAAS,EAAC,8BAA8B;QAC3C,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,qBAAqB,EAC7B,aAAa,EAAC,MAAM,GACpB;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,OAAO,EAAC,0CAA0C,EAClD,aAAa,EAAC,OAAO,GACrB;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,OAAO,EAAC,iBAAiB,GACzB;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,OAAO,EAAC,0CAA0C,EAClD,aAAa,EAAC,OAAO,GACrB;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,UAAU,EAChB,QAAQ,QACR,aAAa,EAAC,OAAO,GACrB,CACE;IACN,6BAAK,SAAS,EAAC,8BAA8B;QAC3C,oBAAC,KAAK,IAAC,WAAW,EAAC,aAAa,EAAC,IAAI,EAAC,OAAO,GAAG;QAChD,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,OAAO,EAAC,0CAA0C,EAClD,aAAa,EAAC,OAAO,GACrB;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,OAAO,EAAC,iBAAiB,GACzB;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,OAAO,EAAC,0CAA0C,EAClD,aAAa,EAAC,OAAO,GACrB;QACF,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,MAAM,EACZ,aAAa,EAAC,OAAO,GACrB,CACE;IACN,6BAAK,SAAS,EAAC,8BAA8B;QAC3C,oBAAC,KAAK,IAAC,WAAW,EAAC,aAAa,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,WAAW,EAAC,OAAO,SAAG;QAC1E,oBAAC,KAAK,IACJ,WAAW,EAAC,aAAa,EACzB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,UAAU,EAChB,OAAO,EAAC,qBAAqB,EAC7B,aAAa,EAAC,MAAM,EACpB,OAAO,SACP,CACE,CACF,CACP,EA9EiC,CA8EjC,CAAC"}

package/dist/esm/stories/NavigationList.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationList.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/NavigationList.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAUnD,QAAA,MAAM,IAAI;;CAEM,CAAC;AAEjB,eAAe,IAAI,CAAC;AAOpB,eAAO,MAAM,qBAAqB,yBA4CjC,CAAC"}
+{"version":3,"file":"NavigationList.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/NavigationList.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAkBnD,QAAA,MAAM,IAAI;;CAEM,CAAC;AAEjB,eAAe,IAAI,CAAC;AAOpB,eAAO,MAAM,qBAAqB,yBA+DjC,CAAC"}

package/dist/esm/stories/NavigationList.stories.js

@@ -1,6 +1,6 @@
 import { __read } from "tslib";
 import React, { useEffect, useState } from "react";
-import { NavigationList, NavigationListItem, NavigationListLabel, ScrollArea, ScrollBar, } from "../index_with_tw_base";
+import { Button, MoreIcon, NavigationList, NavigationListItem, NavigationListLabel, NewDropdownMenu, NewDropdownMenuContent, NewDropdownMenuItem, NewDropdownMenuTrigger, PencilSquareIcon, ScrollArea, ScrollBar, TrashIcon, } from "../index_with_tw_base";
 var meta = {
     title: "Primitives/NavigationList",
 };
@@ -13,22 +13,25 @@ export var NewNavigationListDemo = function () {
     var _a = __read(useState(null), 2), selectedIndex = _a[0], setSelectedIndex = _a[1];
     var _b = __read(useState([]), 2), conversationTitles = _b[0], setConversationTitles = _b[1];
     useEffect(function () {
-        // Generate random titles for each date section only once
         setConversationTitles([
             { label: "Today", items: getRandomTitles(5) },
             { label: "Yesterday", items: getRandomTitles(10) },
         ]);
-        console.log(conversationTitles); // Add this line
     }, []);
-    // Flatten the items array to easily manage indices
     var allItems = conversationTitles.flatMap(function (section) { return section.items; });
+    var getMoreMenu = function (title) { return (React.createElement(NewDropdownMenu, null,
+        React.createElement(NewDropdownMenuTrigger, { asChild: true },
+            React.createElement(Button, { variant: "ghost", icon: MoreIcon, size: "xs" })),
+        React.createElement(NewDropdownMenuContent, null,
+            React.createElement(NewDropdownMenuItem, { label: "Rename ".concat(title), icon: PencilSquareIcon, onClick: function (e) { return e.stopPropagation(); } }),
+            React.createElement(NewDropdownMenuItem, { label: "Delete", icon: TrashIcon, variant: "warning", onClick: function (e) { return e.stopPropagation(); } })))); };
     return (React.createElement("div", { className: "s-h-[400px] s-w-[200px] s-py-12" },
         React.createElement(ScrollArea, null,
             React.createElement(NavigationList, { className: "s-w-full" }, conversationTitles.map(function (section, sectionIndex) { return (React.createElement(React.Fragment, { key: sectionIndex },
                 React.createElement(NavigationListLabel, { label: section.label }),
                 section.items.map(function (title, index) {
-                    var itemIndex = allItems.indexOf(title); // Calculate the global index
-                    return (React.createElement(NavigationListItem, { key: index, selected: itemIndex === selectedIndex, onClick: function () { return setSelectedIndex(itemIndex); }, label: title, className: "s-w-full" }));
+                    var itemIndex = allItems.indexOf(title);
+                    return (React.createElement(NavigationListItem, { key: index, selected: itemIndex === selectedIndex, onClick: function () { return setSelectedIndex(itemIndex); }, label: title, className: "s-w-full", moreMenu: getMoreMenu(title) }));
                 }))); })),
             React.createElement(ScrollBar, null))));
 };

package/dist/esm/stories/NavigationList.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationList.stories.js","sourceRoot":"","sources":["../../../src/stories/NavigationList.stories.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"NavigationList.stories.js","sourceRoot":"","sources":["../../../src/stories/NavigationList.stories.tsx"],"names":[],"mappings":"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"}

package/dist/sparkle.css

@@ -3365,11 +3365,6 @@ select {
   padding: 1px;
 }
 
-.s-px-1 {
-  padding-left: 0.25rem;
-  padding-right: 0.25rem;
-}
-
 .s-px-2 {
   padding-left: 0.5rem;
   padding-right: 0.5rem;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dust-tt/sparkle",
-  "version": "0.2.285",
+  "version": "0.2.287-rc-1",
   "scripts": {
     "build": "rm -rf dist && npm run tailwind && npm run build:esm && npm run build:cjs",
     "tailwind": "tailwindcss -i ./src/styles/tailwind.css -o dist/sparkle.css",

package/src/components/Input.tsx

@@ -1,15 +1,22 @@
 import { cva } from "class-variance-authority";
 import React, { forwardRef } from "react";
 
+import { Icon } from "@sparkle/components/Icon";
+import { InformationCircleStrokeIcon } from "@sparkle/icons";
 import { cn } from "@sparkle/lib/utils";
 
 import { Label } from "./Label";
 
+const MESSAGE_STATUS = ["info", "default", "error"] as const;
+
+type MessageStatus = (typeof MESSAGE_STATUS)[number];
+
 export interface InputProps
   extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "value"> {
-  error?: string | null;
+  message?: string;
+  messageStatus?: MessageStatus;
   value?: string | null;
-  showErrorLabel?: boolean;
+  isError?: boolean;
   className?: string;
   label?: string;
 }
@@ -18,12 +25,28 @@ const INPUT_STATES = ["error", "disabled", "default"];
 
 type InputStateType = (typeof INPUT_STATES)[number];
 
+const messageVariantStyles: Record<MessageStatus, string> = {
+  info: "s-text-muted-foreground",
+  default: "s-text-muted-foreground",
+  error: "s-text-foreground-warning",
+};
+
 const stateVariantStyles: Record<InputStateType, string> = {
   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",
 };
+
+const messageVariant = cva("", {
+  variants: {
+    status: messageVariantStyles,
+  },
+  defaultVariants: {
+    status: "info",
+  },
+});
+
 const 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 ",
@@ -45,18 +68,19 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
   (
     {
       className,
-      error,
+      message,
+      messageStatus ,
       value,
       label,
+      isError,
       disabled,
-      showErrorLabel = false,
       ...props
     },
     ref
   ) => {
-    const state = error ? "error" : disabled ? "disabled" : "default";
+    const state = isError ? "error" : disabled ? "disabled" : "default";
     return (
-      <div className="s-flex s-flex-col s-gap-1 s-px-1">
+      <div className="s-flex s-flex-col s-gap-1">
         {label && <Label htmlFor={props.name}>{label}</Label>}
         <input
           ref={ref}
@@ -66,9 +90,17 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
           disabled={disabled}
           {...props}
         />
-        {showErrorLabel && error && (
-          <div className="s-ml-3.5 s-text-xs s-text-foreground-warning">
-            {error}
+        {message && (
+          <div
+            className={cn(
+              "s-ml-3.5 s-flex s-items-center s-gap-1 s-text-xs",
+              messageVariant({ status: messageStatus })
+            )}
+          >
+            {messageStatus === "info" && (
+              <Icon visual={InformationCircleStrokeIcon} size="xs" />
+            )}
+            {message}
           </div>
         )}
       </div>

package/src/components/NavigationList.tsx

@@ -1,13 +1,7 @@
 import { cva, type VariantProps } from "class-variance-authority";
 import * as React from "react";
 
-import {
-  Button,
-  Icon,
-  LinkWrapper,
-  LinkWrapperProps,
-} from "@sparkle/components/";
-import { MoreIcon } from "@sparkle/icons";
+import { Icon, LinkWrapper, LinkWrapperProps } from "@sparkle/components/";
 import { cn } from "@sparkle/lib/utils";
 
 const listStyles = cva("s-flex", {
@@ -54,7 +48,7 @@ interface NavigationListItemProps
   selected?: boolean;
   label?: string;
   icon?: React.ComponentType;
-  showMoreIcon?: boolean;
+  moreMenu?: React.ReactNode;
 }
 
 const NavigationListItem = React.forwardRef<
@@ -72,15 +66,15 @@ const NavigationListItem = React.forwardRef<
       rel,
       replace,
       shallow,
+      moreMenu,
       ...props
     },
     ref
   ) => {
-    const [isHovered, setIsHovered] = React.useState(false);
     const [isPressed, setIsPressed] = React.useState(false);
 
     const handleMouseDown = (event: React.MouseEvent) => {
-      if (!(event.target as HTMLElement).closest(".new-button-class")) {
+      if (!(event.target as HTMLElement).closest(".button-class")) {
         setIsPressed(true);
       }
     };
@@ -92,9 +86,7 @@ const NavigationListItem = React.forwardRef<
             layout: "item",
             state: selected ? "selected" : isPressed ? "active" : "unselected",
           })}
-          onMouseEnter={() => setIsHovered(true)}
           onMouseLeave={() => {
-            setIsHovered(false);
             setIsPressed(false);
           }}
           onMouseDown={handleMouseDown}
@@ -106,16 +98,9 @@ const NavigationListItem = React.forwardRef<
               {label}
             </span>
           )}
-          {isHovered && (
+          {selected && moreMenu && (
             <div className="-s-mr-2 s-flex s-h-4 s-items-center">
-              <Button
-                variant="ghost"
-                icon={MoreIcon}
-                size="xs"
-                onClick={(e) => e.stopPropagation()}
-                onMouseDown={(e) => e.stopPropagation()}
-                onMouseUp={(e) => e.stopPropagation()}
-              />
+              {moreMenu}
             </div>
           )}
         </div>

package/src/stories/Input.stories.tsx

@@ -13,33 +13,38 @@ export default meta;
 export const InputExample = () => (
   <div className="s-flex s-flex-col s-gap-20">
     <div className="s-grid s-grid-cols-3 s-gap-4">
-      <Input placeholder="placeholder" name="input" />
+      <Input
+        placeholder="placeholder"
+        name="input"
+        message="Name must be unique"
+        messageStatus="info"
+      />
       <Input
         placeholder="placeholder"
         name="input"
         value="value"
-        error="errored because it's a very long message"
-        showErrorLabel
+        message="errored because it's a very long message"
+        messageStatus="error"
       />
       <Input
         placeholder="placeholder"
         name="input"
         value="value"
-        error="errored"
+        message="Default message"
       />
       <Input
         placeholder="placeholder"
         name="input"
         value="value"
-        error="errored because it's a very long message"
-        showErrorLabel
+        message="errored because it's a very long message"
+        messageStatus="error"
       />
       <Input
         placeholder="placeholder"
         name="input"
         value="disabled"
-        disabled={true}
-        showErrorLabel
+        disabled
+        messageStatus="error"
       />
     </div>
     <div className="s-grid s-grid-cols-3 s-gap-4">
@@ -48,41 +53,38 @@ export const InputExample = () => (
         placeholder="placeholder"
         name="input"
         value="value"
-        error="errored because it's a very long message"
-        showErrorLabel
+        message="errored because it's a very long message"
+        messageStatus="error"
       />
       <Input
         placeholder="placeholder"
         name="input"
         value="value"
-        error="errored"
+        message="Default message"
       />
       <Input
         placeholder="placeholder"
         name="input"
         value="value"
-        error="errored because it's a very long message"
-        showErrorLabel
+        message="errored because it's a very long message"
+        messageStatus="error"
       />
       <Input
         placeholder="placeholder"
         name="input"
         value="test"
-        showErrorLabel
+        messageStatus="error"
       />
     </div>
     <div className="s-grid s-grid-cols-3 s-gap-4">
-      <Input
-        placeholder="placeholder"
-        name="input"
-        label="Firstname"
-        showErrorLabel
-      />
+      <Input placeholder="placeholder" name="input" label="Firstname" isError />
       <Input
         placeholder="placeholder"
         name="input"
         label="Lastname"
-        showErrorLabel
+        message="Input your lastname"
+        messageStatus="info"
+        isError
       />
     </div>
   </div>