@dust-tt/sparkle 0.2.130 → 0.2.132

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.
@@ -17,5 +17,6 @@ export type ModalProps = {
17
17
  savingLabel?: string;
18
18
  title?: string;
19
19
  variant?: "full-screen" | "side-sm" | "side-md" | "dialogue";
20
+ className?: string;
20
21
  };
21
- export declare function Modal({ isOpen, onClose, action, children, hasChanged, onSave, saveLabel, isSaving, savingLabel, title, variant, }: ModalProps): React.JSX.Element;
22
+ export declare function Modal({ isOpen, onClose, action, children, hasChanged, onSave, saveLabel, isSaving, savingLabel, title, variant, className, }: ModalProps): React.JSX.Element;
package/dist/cjs/index.js CHANGED
@@ -55009,7 +55009,7 @@ var modalStyles = (_a = {},
55009
55009
  _a);
55010
55010
  var getModalClasses = function (type) { return modalStyles[type] || {}; };
55011
55011
  function Modal(_a) {
55012
- var isOpen = _a.isOpen, onClose = _a.onClose, action = _a.action, children = _a.children, hasChanged = _a.hasChanged, onSave = _a.onSave, _b = _a.saveLabel, saveLabel = _b === void 0 ? "Save" : _b, isSaving = _a.isSaving, savingLabel = _a.savingLabel, title = _a.title, _c = _a.variant, variant = _c === void 0 ? "side-sm" : _c;
55012
+ var isOpen = _a.isOpen, onClose = _a.onClose, action = _a.action, children = _a.children, hasChanged = _a.hasChanged, onSave = _a.onSave, _b = _a.saveLabel, saveLabel = _b === void 0 ? "Save" : _b, isSaving = _a.isSaving, savingLabel = _a.savingLabel, title = _a.title, _c = _a.variant, variant = _c === void 0 ? "side-sm" : _c, className = _a.className;
55013
55013
  var type = variantToType[variant];
55014
55014
  if (variant === "dialogue") {
55015
55015
  console.warn("Dialogue variant of Modal is deprecated. Please use either another variant of Modal or the Dialog component.");
@@ -55036,7 +55036,7 @@ function Modal(_a) {
55036
55036
  React.createElement(tt.Child, { as: React.Fragment, enter: "s-ease-out s-duration-300", enterFrom: transitionEnterFrom, enterTo: transitionEnterTo, leave: "s-ease-in s-duration-200", leaveFrom: transitionLeaveFrom, leaveTo: transitionLeaveTo },
55037
55037
  React.createElement(_t.Panel, { className: classNames("s-absolute s-transform s-bg-structure-0 s-px-3 s-transition-all sm:s-px-4", panelClasses, variantSize[variant]) },
55038
55038
  React.createElement(BarHeader, { title: title || "", leftActions: action ? React.createElement(Button, __assign({}, action)) : undefined, rightActions: React.createElement(BarHeader.ButtonBar, __assign({}, buttonBarProps)) }),
55039
- React.createElement("div", { className: classNames("s-pb-6 s-pt-16", innerContainerClasses) }, children)))))));
55039
+ React.createElement("div", { className: classNames("s-pb-6 s-pt-16", innerContainerClasses, className !== null && className !== void 0 ? className : "") }, children)))))));
55040
55040
  }
55041
55041
 
55042
55042
  var reactConfetti_min = {exports: {}};
@@ -55270,14 +55270,20 @@ function TextArea(_a) {
55270
55270
  React.useEffect(function () {
55271
55271
  var textarea = textareaRef.current;
55272
55272
  if (textarea) {
55273
- textarea.style.height = "auto"; // Reset height to recalculate
55274
55273
  textarea.style.height = "".concat(textarea.scrollHeight, "px"); // Set to scroll height
55275
55274
  }
55276
55275
  }, [value]); // Re-run when value changes
55277
55276
  return (React.createElement("div", { className: "s-flex s-flex-col s-gap-1 s-p-px" },
55278
- React.createElement("textarea", { ref: textareaRef, className: classNames("s-min-h-60 overflow-y-auto s-block s-w-full s-min-w-0 s-rounded-xl s-text-sm s-transition-all s-duration-200 s-scrollbar-hide", !error
55277
+ React.createElement("textarea", { ref: textareaRef, className: classNames("overflow-y-auto s-block s-min-h-60 s-w-full s-min-w-0 s-rounded-xl s-text-sm s-transition-all s-duration-200 s-scrollbar-hide", !error
55279
55278
  ? "s-border-structure-100 focus:s-border-action-300 focus:s-ring-action-300"
55280
55279
  : "s-border-red-500 focus:s-border-red-500 focus:s-ring-red-500", "s-border-structure-200 s-bg-structure-50", "s-resize-y", className !== null && className !== void 0 ? className : ""), placeholder: placeholder, value: value !== null && value !== void 0 ? value : "", onChange: function (e) {
55280
+ var newValue = e.target.value;
55281
+ var textAreaComponent = textareaRef.current;
55282
+ if (textAreaComponent &&
55283
+ (value === null || value === void 0 ? void 0 : value.length) &&
55284
+ newValue.length < value.length) {
55285
+ textAreaComponent.style.height = "auto"; // Reset height to recalculate
55286
+ }
55281
55287
  onChange(e.target.value);
55282
55288
  } }),
55283
55289
  error && showErrorLabel && (React.createElement("div", { className: "s-ml-2 s-text-sm s-text-warning-500" }, error))));