@dust-tt/sparkle 0.2.231 → 0.2.232
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/index.js +2 -2
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/components/TextArea.d.ts +2 -1
- package/dist/esm/components/TextArea.d.ts.map +1 -1
- package/dist/esm/components/TextArea.js +2 -2
- package/dist/esm/components/TextArea.js.map +1 -1
- package/dist/esm/stories/TextArea.stories.d.ts.map +1 -1
- package/dist/esm/stories/TextArea.stories.js +1 -1
- package/dist/esm/stories/TextArea.stories.js.map +1 -1
- package/dist/sparkle.css +0 -4
- package/package.json +1 -1
- package/src/components/TextArea.tsx +4 -1
- package/src/stories/TextArea.stories.tsx +1 -0
|
@@ -6,7 +6,8 @@ type TextAreaProps = {
|
|
|
6
6
|
error?: string | null;
|
|
7
7
|
showErrorLabel?: boolean;
|
|
8
8
|
className?: string;
|
|
9
|
+
rows?: number;
|
|
9
10
|
};
|
|
10
|
-
export declare function TextArea({ placeholder, value, onChange, error, showErrorLabel, className, }: TextAreaProps): React.JSX.Element;
|
|
11
|
+
export declare function TextArea({ placeholder, value, onChange, error, showErrorLabel, className, rows }: TextAreaProps): React.JSX.Element;
|
|
11
12
|
export {};
|
|
12
13
|
//# sourceMappingURL=TextArea.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAIjD,KAAK,aAAa,GAAG;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAIjD,KAAK,aAAa,GAAG;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EACvB,WAAW,EACX,KAAK,EACL,QAAQ,EACR,KAAK,EACL,cAAsB,EACtB,SAAS,EACT,IAAS,EACV,EAAE,aAAa,qBA2Cf"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { useEffect, useRef } from "react";
|
|
2
2
|
import { classNames } from "../lib/utils";
|
|
3
3
|
export function TextArea(_a) {
|
|
4
|
-
var placeholder = _a.placeholder, value = _a.value, onChange = _a.onChange, error = _a.error, _b = _a.showErrorLabel, showErrorLabel = _b === void 0 ? false : _b, className = _a.className;
|
|
4
|
+
var placeholder = _a.placeholder, value = _a.value, onChange = _a.onChange, error = _a.error, _b = _a.showErrorLabel, showErrorLabel = _b === void 0 ? false : _b, className = _a.className, _c = _a.rows, rows = _c === void 0 ? 10 : _c;
|
|
5
5
|
var textareaRef = useRef(null);
|
|
6
6
|
useEffect(function () {
|
|
7
7
|
var textarea = textareaRef.current;
|
|
@@ -10,7 +10,7 @@ export function TextArea(_a) {
|
|
|
10
10
|
}
|
|
11
11
|
}, [value]); // Re-run when value changes
|
|
12
12
|
return (React.createElement("div", { className: "s-flex s-flex-col s-gap-1 s-p-px" },
|
|
13
|
-
React.createElement("textarea", { ref: textareaRef, className: classNames("overflow-y-auto s-block s-
|
|
13
|
+
React.createElement("textarea", { rows: rows, ref: textareaRef, className: classNames("overflow-y-auto s-block s-w-full s-min-w-0 s-rounded-xl s-text-sm s-placeholder-element-700 s-transition-all s-duration-200 s-scrollbar-hide", !error
|
|
14
14
|
? "s-border-structure-100 focus:s-border-action-300 focus:s-ring-action-300"
|
|
15
15
|
: "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) {
|
|
16
16
|
var newValue = e.target.value;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/components/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;
|
|
1
|
+
{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/components/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAYhD,MAAM,UAAU,QAAQ,CAAC,EAQT;QAPd,WAAW,iBAAA,EACX,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,KAAK,WAAA,EACL,sBAAsB,EAAtB,cAAc,mBAAG,KAAK,KAAA,EACtB,SAAS,eAAA,EACT,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA;IAET,IAAM,WAAW,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAEtD,SAAS,CAAC;QACR,IAAM,QAAQ,GAAG,WAAW,CAAC,OAAO,CAAC;QACrC,IAAI,QAAQ,EAAE,CAAC;YACb,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,UAAG,QAAQ,CAAC,YAAY,OAAI,CAAC,CAAC,uBAAuB;QAC/E,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,4BAA4B;IACzC,OAAO,CACL,6BAAK,SAAS,EAAC,kCAAkC;QAC/C,kCACE,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,UAAU,CACnB,8IAA8I,EAC9I,CAAC,KAAK;gBACJ,CAAC,CAAC,0EAA0E;gBAC5E,CAAC,CAAC,8DAA8D,EAClE,0CAA0C,EAC1C,YAAY,EACZ,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,EAAE,CAChB,EACD,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE,EAClB,QAAQ,EAAE,UAAC,CAAC;gBACV,IAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;gBAChC,IAAM,iBAAiB,GAAG,WAAW,CAAC,OAAO,CAAC;gBAC9C,IACE,iBAAiB;qBACjB,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,CAAA;oBACb,QAAQ,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,EAC9B,CAAC;oBACD,iBAAiB,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC,8BAA8B;gBACzE,CAAC;gBACD,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC3B,CAAC,GACD;QACD,KAAK,IAAI,cAAc,IAAI,CAC1B,6BAAK,SAAS,EAAC,qCAAqC,IAAE,KAAK,CAAO,CACnE,CACG,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/TextArea.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjD,QAAA,MAAM,IAAI;;;CAGuB,CAAC;AAElC,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,eAAe,
|
|
1
|
+
{"version":3,"file":"TextArea.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/TextArea.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjD,QAAA,MAAM,IAAI;;;CAGuB,CAAC;AAElC,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,eAAe,yBAsC3B,CAAC"}
|
|
@@ -17,7 +17,7 @@ export var TextAreaExample = function () {
|
|
|
17
17
|
React.createElement("div", { className: "s-grid s-grid-cols-3 s-gap-4" },
|
|
18
18
|
React.createElement(TextArea, { placeholder: "placeholder", value: textValues[0], onChange: function (v) {
|
|
19
19
|
return setTextValues([v, textValues[1], textValues[2], textValues[3]]);
|
|
20
|
-
} }),
|
|
20
|
+
}, rows: 2 }),
|
|
21
21
|
React.createElement(TextArea, { placeholder: "placeholder", value: textValues[1], error: "errored because blah", onChange: function (v) {
|
|
22
22
|
return setTextValues([textValues[0], v, textValues[2], textValues[3]]);
|
|
23
23
|
}, showErrorLabel: true }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.stories.js","sourceRoot":"","sources":["../../../src/stories/TextArea.stories.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjD,IAAM,IAAI,GAAG;IACX,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,QAAQ;CACY,CAAC;AAElC,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,IAAM,eAAe,GAAG;IACvB,IAAA,KAAA,OAA8B,QAAQ,CAAC;QAC3C,EAAE;QACF,kBAAkB;QAClB,gBAAgB;QAChB,EAAE;KACH,CAAC,IAAA,EALK,UAAU,QAAA,EAAE,aAAa,QAK9B,CAAC;IACH,OAAO,CACL,6BAAK,SAAS,EAAC,4BAA4B;QACzC,6BAAK,SAAS,EAAC,8BAA8B;YAC3C,oBAAC,QAAQ,IACP,WAAW,EAAC,aAAa,EACzB,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EACpB,QAAQ,EAAE,UAAC,CAAC;oBACV,OAAA,aAAa,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;gBAA/D,CAA+D,
|
|
1
|
+
{"version":3,"file":"TextArea.stories.js","sourceRoot":"","sources":["../../../src/stories/TextArea.stories.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjD,IAAM,IAAI,GAAG;IACX,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,QAAQ;CACY,CAAC;AAElC,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,IAAM,eAAe,GAAG;IACvB,IAAA,KAAA,OAA8B,QAAQ,CAAC;QAC3C,EAAE;QACF,kBAAkB;QAClB,gBAAgB;QAChB,EAAE;KACH,CAAC,IAAA,EALK,UAAU,QAAA,EAAE,aAAa,QAK9B,CAAC;IACH,OAAO,CACL,6BAAK,SAAS,EAAC,4BAA4B;QACzC,6BAAK,SAAS,EAAC,8BAA8B;YAC3C,oBAAC,QAAQ,IACP,WAAW,EAAC,aAAa,EACzB,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EACpB,QAAQ,EAAE,UAAC,CAAC;oBACV,OAAA,aAAa,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;gBAA/D,CAA+D,EAEjE,IAAI,EAAE,CAAC,GACP;YACF,oBAAC,QAAQ,IACP,WAAW,EAAC,aAAa,EACzB,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EACpB,KAAK,EAAE,sBAAsB,EAC7B,QAAQ,EAAE,UAAC,CAAC;oBACV,OAAA,aAAa,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;gBAA/D,CAA+D,EAEjE,cAAc,SACd;YACF,oBAAC,QAAQ,IACP,WAAW,EAAC,aAAa,EACzB,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EACpB,QAAQ,EAAE,UAAC,CAAC;oBACV,OAAA,aAAa,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;gBAA/D,CAA+D,EAEjE,KAAK,EAAE,sBAAsB,GAC7B,CACE,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}
|
package/dist/sparkle.css
CHANGED
package/package.json
CHANGED
|
@@ -9,6 +9,7 @@ type TextAreaProps = {
|
|
|
9
9
|
error?: string | null;
|
|
10
10
|
showErrorLabel?: boolean;
|
|
11
11
|
className?: string;
|
|
12
|
+
rows?: number;
|
|
12
13
|
};
|
|
13
14
|
|
|
14
15
|
export function TextArea({
|
|
@@ -18,6 +19,7 @@ export function TextArea({
|
|
|
18
19
|
error,
|
|
19
20
|
showErrorLabel = false,
|
|
20
21
|
className,
|
|
22
|
+
rows = 10
|
|
21
23
|
}: TextAreaProps) {
|
|
22
24
|
const textareaRef = useRef<HTMLTextAreaElement>(null);
|
|
23
25
|
|
|
@@ -30,9 +32,10 @@ export function TextArea({
|
|
|
30
32
|
return (
|
|
31
33
|
<div className="s-flex s-flex-col s-gap-1 s-p-px">
|
|
32
34
|
<textarea
|
|
35
|
+
rows={rows}
|
|
33
36
|
ref={textareaRef}
|
|
34
37
|
className={classNames(
|
|
35
|
-
"overflow-y-auto s-block s-
|
|
38
|
+
"overflow-y-auto s-block s-w-full s-min-w-0 s-rounded-xl s-text-sm s-placeholder-element-700 s-transition-all s-duration-200 s-scrollbar-hide",
|
|
36
39
|
!error
|
|
37
40
|
? "s-border-structure-100 focus:s-border-action-300 focus:s-ring-action-300"
|
|
38
41
|
: "s-border-red-500 focus:s-border-red-500 focus:s-ring-red-500",
|