@particle-academy/react-fancy 5.30.0 → 5.31.0

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.
@@ -1,83 +0,0 @@
1
- 'use strict';
2
-
3
- var chunkOUOEQZHY_cjs = require('./chunk-OUOEQZHY.cjs');
4
- var chunkZU5Q77OT_cjs = require('./chunk-ZU5Q77OT.cjs');
5
- var react = require('react');
6
- var jsxRuntime = require('react/jsx-runtime');
7
-
8
- var Composer = react.forwardRef(
9
- function Composer2({
10
- value: controlledValue,
11
- defaultValue = "",
12
- onChange,
13
- onSubmit,
14
- placeholder = "Type a message...",
15
- actions,
16
- disabled = false,
17
- className
18
- }, ref) {
19
- const [value, setValue] = chunkOUOEQZHY_cjs.useControllableState(
20
- controlledValue,
21
- defaultValue,
22
- onChange
23
- );
24
- const textareaRef = react.useRef(null);
25
- const handleSubmit = react.useCallback(() => {
26
- if (!value.trim() || disabled) return;
27
- onSubmit?.(value);
28
- setValue("");
29
- textareaRef.current?.focus();
30
- }, [value, disabled, onSubmit, setValue]);
31
- const handleKeyDown = (e) => {
32
- if (e.key === "Enter" && !e.shiftKey) {
33
- e.preventDefault();
34
- handleSubmit();
35
- }
36
- };
37
- return /* @__PURE__ */ jsxRuntime.jsxs(
38
- "div",
39
- {
40
- "data-react-fancy-composer": "",
41
- ref,
42
- className: chunkZU5Q77OT_cjs.cn(
43
- "rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900",
44
- disabled && "opacity-50",
45
- className
46
- ),
47
- children: [
48
- /* @__PURE__ */ jsxRuntime.jsx(
49
- "textarea",
50
- {
51
- ref: textareaRef,
52
- value,
53
- onChange: (e) => setValue(e.target.value),
54
- onKeyDown: handleKeyDown,
55
- placeholder,
56
- disabled,
57
- rows: 3,
58
- className: "w-full resize-none bg-transparent px-4 pt-3 text-sm outline-none placeholder:text-zinc-400"
59
- }
60
- ),
61
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between border-t border-zinc-100 px-3 py-2 dark:border-zinc-800", children: [
62
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1", children: actions }),
63
- /* @__PURE__ */ jsxRuntime.jsx(
64
- "button",
65
- {
66
- type: "button",
67
- onClick: handleSubmit,
68
- disabled: disabled || !value.trim(),
69
- className: "rounded-lg bg-zinc-900 px-3 py-1.5 text-sm font-medium text-white transition-colors hover:bg-zinc-800 disabled:opacity-50 dark:bg-white dark:text-zinc-900 dark:hover:bg-zinc-100",
70
- children: "Send"
71
- }
72
- )
73
- ] })
74
- ]
75
- }
76
- );
77
- }
78
- );
79
- Composer.displayName = "Composer";
80
-
81
- exports.Composer = Composer;
82
- //# sourceMappingURL=chunk-OGEE23SP.cjs.map
83
- //# sourceMappingURL=chunk-OGEE23SP.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Composer/Composer.tsx"],"names":["forwardRef","Composer","useControllableState","useRef","useCallback","jsxs","cn","jsx"],"mappings":";;;;;;;AAKO,IAAM,QAAA,GAAWA,gBAAA;AAAA,EACtB,SAASC,SAAAA,CACP;AAAA,IACE,KAAA,EAAO,eAAA;AAAA,IACP,YAAA,GAAe,EAAA;AAAA,IACf,QAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA,GAAc,mBAAA;AAAA,IACd,OAAA;AAAA,IACA,QAAA,GAAW,KAAA;AAAA,IACX;AAAA,KAEF,GAAA,EACA;AACA,IAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIC,sCAAA;AAAA,MACxB,eAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA,KACF;AACA,IAAA,MAAM,WAAA,GAAcC,aAA4B,IAAI,CAAA;AAEpD,IAAA,MAAM,YAAA,GAAeC,kBAAY,MAAM;AACrC,MAAA,IAAI,CAAC,KAAA,CAAM,IAAA,EAAK,IAAK,QAAA,EAAU;AAC/B,MAAA,QAAA,GAAW,KAAK,CAAA;AAChB,MAAA,QAAA,CAAS,EAAE,CAAA;AACX,MAAA,WAAA,CAAY,SAAS,KAAA,EAAM;AAAA,IAC7B,GAAG,CAAC,KAAA,EAAO,QAAA,EAAU,QAAA,EAAU,QAAQ,CAAC,CAAA;AAExC,IAAA,MAAM,aAAA,GAAgB,CAAC,CAAA,KAAgD;AACrE,MAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAC,EAAE,QAAA,EAAU;AACpC,QAAA,CAAA,CAAE,cAAA,EAAe;AACjB,QAAA,YAAA,EAAa;AAAA,MACf;AAAA,IACF,CAAA;AAEA,IAAA,uBACEC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,2BAAA,EAA0B,EAAA;AAAA,QAC1B,GAAA;AAAA,QACA,SAAA,EAAWC,oBAAA;AAAA,UACT,kFAAA;AAAA,UACA,QAAA,IAAY,YAAA;AAAA,UACZ;AAAA,SACF;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAAC,cAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,GAAA,EAAK,WAAA;AAAA,cACL,KAAA;AAAA,cACA,UAAU,CAAC,CAAA,KAAM,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,cACxC,SAAA,EAAW,aAAA;AAAA,cACX,WAAA;AAAA,cACA,QAAA;AAAA,cACA,IAAA,EAAM,CAAA;AAAA,cACN,SAAA,EAAU;AAAA;AAAA,WACZ;AAAA,0BACAF,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,2FAAA,EACb,QAAA,EAAA;AAAA,4BAAAE,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,yBAAA,EAA2B,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,4BAClDA,cAAA;AAAA,cAAC,QAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,QAAA;AAAA,gBACL,OAAA,EAAS,YAAA;AAAA,gBACT,QAAA,EAAU,QAAA,IAAY,CAAC,KAAA,CAAM,IAAA,EAAK;AAAA,gBAClC,SAAA,EAAU,mLAAA;AAAA,gBACX,QAAA,EAAA;AAAA;AAAA;AAED,WAAA,EACF;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-OGEE23SP.cjs","sourcesContent":["import { forwardRef, useCallback, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport type { ComposerProps } from \"./Composer.types\";\n\nexport const Composer = forwardRef<HTMLDivElement, ComposerProps>(\n function Composer(\n {\n value: controlledValue,\n defaultValue = \"\",\n onChange,\n onSubmit,\n placeholder = \"Type a message...\",\n actions,\n disabled = false,\n className,\n },\n ref,\n ) {\n const [value, setValue] = useControllableState(\n controlledValue,\n defaultValue,\n onChange,\n );\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n const handleSubmit = useCallback(() => {\n if (!value.trim() || disabled) return;\n onSubmit?.(value);\n setValue(\"\");\n textareaRef.current?.focus();\n }, [value, disabled, onSubmit, setValue]);\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n handleSubmit();\n }\n };\n\n return (\n <div\n data-react-fancy-composer=\"\"\n ref={ref}\n className={cn(\n \"rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900\",\n disabled && \"opacity-50\",\n className,\n )}\n >\n <textarea\n ref={textareaRef}\n value={value}\n onChange={(e) => setValue(e.target.value)}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n disabled={disabled}\n rows={3}\n className=\"w-full resize-none bg-transparent px-4 pt-3 text-sm outline-none placeholder:text-zinc-400\"\n />\n <div className=\"flex items-center justify-between border-t border-zinc-100 px-3 py-2 dark:border-zinc-800\">\n <div className=\"flex items-center gap-1\">{actions}</div>\n <button\n type=\"button\"\n onClick={handleSubmit}\n disabled={disabled || !value.trim()}\n className=\"rounded-lg bg-zinc-900 px-3 py-1.5 text-sm font-medium text-white transition-colors hover:bg-zinc-800 disabled:opacity-50 dark:bg-white dark:text-zinc-900 dark:hover:bg-zinc-100\"\n >\n Send\n </button>\n </div>\n </div>\n );\n },\n);\n\nComposer.displayName = \"Composer\";\n"]}
@@ -1,81 +0,0 @@
1
- import { useControllableState } from './chunk-6FQGMVF2.js';
2
- import { cn } from './chunk-MMW2JGKZ.js';
3
- import { forwardRef, useRef, useCallback } from 'react';
4
- import { jsxs, jsx } from 'react/jsx-runtime';
5
-
6
- var Composer = forwardRef(
7
- function Composer2({
8
- value: controlledValue,
9
- defaultValue = "",
10
- onChange,
11
- onSubmit,
12
- placeholder = "Type a message...",
13
- actions,
14
- disabled = false,
15
- className
16
- }, ref) {
17
- const [value, setValue] = useControllableState(
18
- controlledValue,
19
- defaultValue,
20
- onChange
21
- );
22
- const textareaRef = useRef(null);
23
- const handleSubmit = useCallback(() => {
24
- if (!value.trim() || disabled) return;
25
- onSubmit?.(value);
26
- setValue("");
27
- textareaRef.current?.focus();
28
- }, [value, disabled, onSubmit, setValue]);
29
- const handleKeyDown = (e) => {
30
- if (e.key === "Enter" && !e.shiftKey) {
31
- e.preventDefault();
32
- handleSubmit();
33
- }
34
- };
35
- return /* @__PURE__ */ jsxs(
36
- "div",
37
- {
38
- "data-react-fancy-composer": "",
39
- ref,
40
- className: cn(
41
- "rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900",
42
- disabled && "opacity-50",
43
- className
44
- ),
45
- children: [
46
- /* @__PURE__ */ jsx(
47
- "textarea",
48
- {
49
- ref: textareaRef,
50
- value,
51
- onChange: (e) => setValue(e.target.value),
52
- onKeyDown: handleKeyDown,
53
- placeholder,
54
- disabled,
55
- rows: 3,
56
- className: "w-full resize-none bg-transparent px-4 pt-3 text-sm outline-none placeholder:text-zinc-400"
57
- }
58
- ),
59
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-t border-zinc-100 px-3 py-2 dark:border-zinc-800", children: [
60
- /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: actions }),
61
- /* @__PURE__ */ jsx(
62
- "button",
63
- {
64
- type: "button",
65
- onClick: handleSubmit,
66
- disabled: disabled || !value.trim(),
67
- className: "rounded-lg bg-zinc-900 px-3 py-1.5 text-sm font-medium text-white transition-colors hover:bg-zinc-800 disabled:opacity-50 dark:bg-white dark:text-zinc-900 dark:hover:bg-zinc-100",
68
- children: "Send"
69
- }
70
- )
71
- ] })
72
- ]
73
- }
74
- );
75
- }
76
- );
77
- Composer.displayName = "Composer";
78
-
79
- export { Composer };
80
- //# sourceMappingURL=chunk-VVL5LMLW.js.map
81
- //# sourceMappingURL=chunk-VVL5LMLW.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Composer/Composer.tsx"],"names":["Composer"],"mappings":";;;;;AAKO,IAAM,QAAA,GAAW,UAAA;AAAA,EACtB,SAASA,SAAAA,CACP;AAAA,IACE,KAAA,EAAO,eAAA;AAAA,IACP,YAAA,GAAe,EAAA;AAAA,IACf,QAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA,GAAc,mBAAA;AAAA,IACd,OAAA;AAAA,IACA,QAAA,GAAW,KAAA;AAAA,IACX;AAAA,KAEF,GAAA,EACA;AACA,IAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,oBAAA;AAAA,MACxB,eAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA,KACF;AACA,IAAA,MAAM,WAAA,GAAc,OAA4B,IAAI,CAAA;AAEpD,IAAA,MAAM,YAAA,GAAe,YAAY,MAAM;AACrC,MAAA,IAAI,CAAC,KAAA,CAAM,IAAA,EAAK,IAAK,QAAA,EAAU;AAC/B,MAAA,QAAA,GAAW,KAAK,CAAA;AAChB,MAAA,QAAA,CAAS,EAAE,CAAA;AACX,MAAA,WAAA,CAAY,SAAS,KAAA,EAAM;AAAA,IAC7B,GAAG,CAAC,KAAA,EAAO,QAAA,EAAU,QAAA,EAAU,QAAQ,CAAC,CAAA;AAExC,IAAA,MAAM,aAAA,GAAgB,CAAC,CAAA,KAAgD;AACrE,MAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAC,EAAE,QAAA,EAAU;AACpC,QAAA,CAAA,CAAE,cAAA,EAAe;AACjB,QAAA,YAAA,EAAa;AAAA,MACf;AAAA,IACF,CAAA;AAEA,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,2BAAA,EAA0B,EAAA;AAAA,QAC1B,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,kFAAA;AAAA,UACA,QAAA,IAAY,YAAA;AAAA,UACZ;AAAA,SACF;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,GAAA,EAAK,WAAA;AAAA,cACL,KAAA;AAAA,cACA,UAAU,CAAC,CAAA,KAAM,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,cACxC,SAAA,EAAW,aAAA;AAAA,cACX,WAAA;AAAA,cACA,QAAA;AAAA,cACA,IAAA,EAAM,CAAA;AAAA,cACN,SAAA,EAAU;AAAA;AAAA,WACZ;AAAA,0BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,2FAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,yBAAA,EAA2B,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,4BAClD,GAAA;AAAA,cAAC,QAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,QAAA;AAAA,gBACL,OAAA,EAAS,YAAA;AAAA,gBACT,QAAA,EAAU,QAAA,IAAY,CAAC,KAAA,CAAM,IAAA,EAAK;AAAA,gBAClC,SAAA,EAAU,mLAAA;AAAA,gBACX,QAAA,EAAA;AAAA;AAAA;AAED,WAAA,EACF;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-VVL5LMLW.js","sourcesContent":["import { forwardRef, useCallback, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport type { ComposerProps } from \"./Composer.types\";\n\nexport const Composer = forwardRef<HTMLDivElement, ComposerProps>(\n function Composer(\n {\n value: controlledValue,\n defaultValue = \"\",\n onChange,\n onSubmit,\n placeholder = \"Type a message...\",\n actions,\n disabled = false,\n className,\n },\n ref,\n ) {\n const [value, setValue] = useControllableState(\n controlledValue,\n defaultValue,\n onChange,\n );\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n const handleSubmit = useCallback(() => {\n if (!value.trim() || disabled) return;\n onSubmit?.(value);\n setValue(\"\");\n textareaRef.current?.focus();\n }, [value, disabled, onSubmit, setValue]);\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n handleSubmit();\n }\n };\n\n return (\n <div\n data-react-fancy-composer=\"\"\n ref={ref}\n className={cn(\n \"rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900\",\n disabled && \"opacity-50\",\n className,\n )}\n >\n <textarea\n ref={textareaRef}\n value={value}\n onChange={(e) => setValue(e.target.value)}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n disabled={disabled}\n rows={3}\n className=\"w-full resize-none bg-transparent px-4 pt-3 text-sm outline-none placeholder:text-zinc-400\"\n />\n <div className=\"flex items-center justify-between border-t border-zinc-100 px-3 py-2 dark:border-zinc-800\">\n <div className=\"flex items-center gap-1\">{actions}</div>\n <button\n type=\"button\"\n onClick={handleSubmit}\n disabled={disabled || !value.trim()}\n className=\"rounded-lg bg-zinc-900 px-3 py-1.5 text-sm font-medium text-white transition-colors hover:bg-zinc-800 disabled:opacity-50 dark:bg-white dark:text-zinc-900 dark:hover:bg-zinc-100\"\n >\n Send\n </button>\n </div>\n </div>\n );\n },\n);\n\nComposer.displayName = \"Composer\";\n"]}