@assistant-ui/react-markdown 0.0.5 → 0.1.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.
package/dist/index.d.mts CHANGED
@@ -1,5 +1,7 @@
1
+ import * as react from 'react';
1
2
  import { ComponentType, FC } from 'react';
2
3
  import { Options } from 'react-markdown';
4
+ import { TextContentPartProps } from '@assistant-ui/react';
3
5
 
4
6
  type PreComponent = NonNullable<NonNullable<Options["components"]>["pre"]>;
5
7
  type CodeComponent = NonNullable<NonNullable<Options["components"]>["code"]>;
@@ -25,4 +27,9 @@ type MarkdownTextPrimitiveProps = Omit<Options, "components" | "children"> & {
25
27
  };
26
28
  declare const MarkdownTextPrimitive: FC<MarkdownTextPrimitiveProps>;
27
29
 
28
- export { type CodeHeaderProps, MarkdownTextPrimitive, type MarkdownTextPrimitiveProps, type SyntaxHighlighterProps };
30
+ type MakeMarkdownTextProps = MarkdownTextPrimitiveProps;
31
+ declare const makeMarkdownText: ({ className, components: userComponents, ...rest }?: MakeMarkdownTextProps) => react.NamedExoticComponent<TextContentPartProps>;
32
+
33
+ declare const CodeHeader: FC<CodeHeaderProps>;
34
+
35
+ export { CodeHeader, type CodeHeaderProps, type MakeMarkdownTextProps, MarkdownTextPrimitive, type MarkdownTextPrimitiveProps, type SyntaxHighlighterProps, makeMarkdownText };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,7 @@
1
+ import * as react from 'react';
1
2
  import { ComponentType, FC } from 'react';
2
3
  import { Options } from 'react-markdown';
4
+ import { TextContentPartProps } from '@assistant-ui/react';
3
5
 
4
6
  type PreComponent = NonNullable<NonNullable<Options["components"]>["pre"]>;
5
7
  type CodeComponent = NonNullable<NonNullable<Options["components"]>["code"]>;
@@ -25,4 +27,9 @@ type MarkdownTextPrimitiveProps = Omit<Options, "components" | "children"> & {
25
27
  };
26
28
  declare const MarkdownTextPrimitive: FC<MarkdownTextPrimitiveProps>;
27
29
 
28
- export { type CodeHeaderProps, MarkdownTextPrimitive, type MarkdownTextPrimitiveProps, type SyntaxHighlighterProps };
30
+ type MakeMarkdownTextProps = MarkdownTextPrimitiveProps;
31
+ declare const makeMarkdownText: ({ className, components: userComponents, ...rest }?: MakeMarkdownTextProps) => react.NamedExoticComponent<TextContentPartProps>;
32
+
33
+ declare const CodeHeader: FC<CodeHeaderProps>;
34
+
35
+ export { CodeHeader, type CodeHeaderProps, type MakeMarkdownTextProps, MarkdownTextPrimitive, type MarkdownTextPrimitiveProps, type SyntaxHighlighterProps, makeMarkdownText };
package/dist/index.js CHANGED
@@ -1,3 +1,4 @@
1
+ "use client";
1
2
  "use strict";
2
3
  var __create = Object.create;
3
4
  var __defProp = Object.defineProperty;
@@ -30,15 +31,17 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
30
31
  // src/index.ts
31
32
  var src_exports = {};
32
33
  __export(src_exports, {
33
- MarkdownTextPrimitive: () => MarkdownTextPrimitive
34
+ CodeHeader: () => CodeHeader,
35
+ MarkdownTextPrimitive: () => MarkdownTextPrimitive,
36
+ makeMarkdownText: () => makeMarkdownText
34
37
  });
35
38
  module.exports = __toCommonJS(src_exports);
36
39
 
37
- // src/MarkdownText.tsx
40
+ // src/primitives/MarkdownText.tsx
38
41
  var import_react3 = require("@assistant-ui/react");
39
42
  var import_react_markdown = __toESM(require("react-markdown"));
40
43
 
41
- // src/PreOverride.tsx
44
+ // src/overrides/PreOverride.tsx
42
45
  var import_react = require("react");
43
46
  var import_jsx_runtime = require("react/jsx-runtime");
44
47
  var PreContext = (0, import_react.createContext)(null);
@@ -46,29 +49,45 @@ var PreOverride = ({ children, ...rest }) => {
46
49
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PreContext.Provider, { value: rest, children });
47
50
  };
48
51
 
49
- // src/defaultComponents.tsx
52
+ // src/overrides/defaultComponents.tsx
50
53
  var import_jsx_runtime2 = require("react/jsx-runtime");
51
54
  var DefaultPre = ({ node, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("pre", { ...rest });
52
55
  var DefaultCode = ({ node, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("code", { ...rest });
53
56
  var DefaultSyntaxHighlighter = ({ components: { Pre, Code }, code }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Pre, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Code, { children: code }) });
54
57
  var DefaultCodeHeader = () => null;
55
58
 
56
- // src/MarkdownText.tsx
59
+ // src/primitives/MarkdownText.tsx
57
60
  var import_react_use_callback_ref2 = require("@radix-ui/react-use-callback-ref");
58
61
 
59
- // src/CodeOverride.tsx
62
+ // src/overrides/CodeOverride.tsx
60
63
  var import_react2 = require("react");
61
- var import_react_slot = require("@radix-ui/react-slot");
62
64
  var import_react_use_callback_ref = require("@radix-ui/react-use-callback-ref");
65
+
66
+ // src/overrides/withDefaults.tsx
67
+ var import_classnames = __toESM(require("classnames"));
68
+ var withDefaultProps = ({
69
+ className,
70
+ ...defaultProps
71
+ }) => ({ className: classNameProp, ...props }) => {
72
+ return {
73
+ className: (0, import_classnames.default)(className, classNameProp),
74
+ ...defaultProps,
75
+ ...props
76
+ };
77
+ };
78
+
79
+ // src/overrides/CodeOverride.tsx
63
80
  var import_jsx_runtime3 = require("react/jsx-runtime");
64
81
  var CodeBlockOverride = ({
65
- components: { Pre, Code, SyntaxHighlighter, CodeHeader },
82
+ components: { Pre, Code, SyntaxHighlighter, CodeHeader: CodeHeader2 },
66
83
  children,
67
84
  ...codeProps
68
85
  }) => {
69
86
  const preProps = (0, import_react2.useContext)(PreContext);
70
- const WrappedPre = (0, import_react_use_callback_ref.useCallbackRef)((props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_slot.Slot, { ...preProps, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Pre, { ...props }) }));
71
- const WrappedCode = (0, import_react_use_callback_ref.useCallbackRef)((props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_slot.Slot, { ...codeProps, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Code, { ...props }) }));
87
+ const getPreProps = withDefaultProps(preProps);
88
+ const WrappedPre = (0, import_react_use_callback_ref.useCallbackRef)((props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Pre, { ...getPreProps(props) }));
89
+ const getCodeProps = withDefaultProps(codeProps);
90
+ const WrappedCode = (0, import_react_use_callback_ref.useCallbackRef)((props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Code, { ...getCodeProps(props) }));
72
91
  const components = (0, import_react2.useMemo)(
73
92
  () => ({ Pre: WrappedPre, Code: WrappedCode }),
74
93
  [WrappedPre, WrappedCode]
@@ -77,7 +96,7 @@ var CodeBlockOverride = ({
77
96
  const code = children;
78
97
  const SH = language ? SyntaxHighlighter : DefaultSyntaxHighlighter;
79
98
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
80
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CodeHeader, { language, code }),
99
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CodeHeader2, { language, code }),
81
100
  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
82
101
  SH,
83
102
  {
@@ -97,7 +116,7 @@ var CodeOverride = ({
97
116
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CodeBlockOverride, { components, ...props });
98
117
  };
99
118
 
100
- // src/MarkdownText.tsx
119
+ // src/primitives/MarkdownText.tsx
101
120
  var import_jsx_runtime4 = require("react/jsx-runtime");
102
121
  var { useSmooth } = import_react3.INTERNAL;
103
122
  var MarkdownTextPrimitive = ({
@@ -113,7 +132,7 @@ var MarkdownTextPrimitive = ({
113
132
  pre = DefaultPre,
114
133
  code = DefaultCode,
115
134
  SyntaxHighlighter = DefaultSyntaxHighlighter,
116
- CodeHeader = DefaultCodeHeader,
135
+ CodeHeader: CodeHeader2 = DefaultCodeHeader,
117
136
  ...componentsRest
118
137
  } = userComponents ?? {};
119
138
  const components = {
@@ -122,15 +141,95 @@ var MarkdownTextPrimitive = ({
122
141
  code: (0, import_react_use_callback_ref2.useCallbackRef)((props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
123
142
  CodeOverride,
124
143
  {
125
- components: { Pre: pre, Code: code, SyntaxHighlighter, CodeHeader },
144
+ components: { Pre: pre, Code: code, SyntaxHighlighter, CodeHeader: CodeHeader2 },
126
145
  ...props
127
146
  }
128
147
  ))
129
148
  };
130
149
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_markdown.default, { components, ...rest, children: smoothText });
131
150
  };
151
+
152
+ // src/ui/markdown-text.tsx
153
+ var import_react6 = require("react");
154
+
155
+ // src/ui/code-header.tsx
156
+ var import_lucide_react = require("lucide-react");
157
+ var import_react5 = require("@assistant-ui/react");
158
+
159
+ // src/ui/useCopyToClipboard.tsx
160
+ var import_react4 = require("react");
161
+ var useCopyToClipboard = ({
162
+ copiedDuration = 3e3
163
+ } = {}) => {
164
+ const [isCopied, setIsCopied] = (0, import_react4.useState)(false);
165
+ const copyToClipboard = (value) => {
166
+ if (!value) return;
167
+ navigator.clipboard.writeText(value).then(() => {
168
+ setIsCopied(true);
169
+ setTimeout(() => setIsCopied(false), copiedDuration);
170
+ });
171
+ };
172
+ return { isCopied, copyToClipboard };
173
+ };
174
+
175
+ // src/ui/code-header.tsx
176
+ var import_jsx_runtime5 = require("react/jsx-runtime");
177
+ var { TooltipIconButton } = import_react5.INTERNAL;
178
+ var CodeHeader = ({ language, code }) => {
179
+ const {
180
+ strings: {
181
+ code: { header: { copy: { tooltip = "Copy" } = {} } = {} } = {}
182
+ } = {}
183
+ } = (0, import_react5.useThreadConfig)();
184
+ const { isCopied, copyToClipboard } = useCopyToClipboard();
185
+ const onCopy = () => {
186
+ if (!code || isCopied) return;
187
+ copyToClipboard(code);
188
+ };
189
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "aui-code-header-root", children: [
190
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "aui-code-header-language", children: language }),
191
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(TooltipIconButton, { tooltip, onClick: onCopy, children: [
192
+ !isCopied && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.CopyIcon, {}),
193
+ isCopied && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.CheckIcon, {})
194
+ ] })
195
+ ] });
196
+ };
197
+
198
+ // src/ui/markdown-text.tsx
199
+ var import_classnames2 = __toESM(require("classnames"));
200
+ var import_jsx_runtime6 = require("react/jsx-runtime");
201
+ var makeMarkdownText = ({
202
+ className,
203
+ components: userComponents,
204
+ ...rest
205
+ } = {}) => {
206
+ const components = {
207
+ ...userComponents,
208
+ CodeHeader: userComponents?.CodeHeader ?? CodeHeader
209
+ };
210
+ const MarkdownTextImpl = ({ status }) => {
211
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
212
+ "div",
213
+ {
214
+ className: (0, import_classnames2.default)(
215
+ "aui-md-root",
216
+ status.type === "in_progress" && "aui-md-in-progress",
217
+ className
218
+ ),
219
+ children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(MarkdownTextPrimitive, { components, ...rest })
220
+ }
221
+ );
222
+ };
223
+ MarkdownTextImpl.displayName = "MarkdownText";
224
+ return (0, import_react6.memo)(
225
+ MarkdownTextImpl,
226
+ (prev, next) => prev.status.type === next.status.type
227
+ );
228
+ };
132
229
  // Annotate the CommonJS export names for ESM import in node:
133
230
  0 && (module.exports = {
134
- MarkdownTextPrimitive
231
+ CodeHeader,
232
+ MarkdownTextPrimitive,
233
+ makeMarkdownText
135
234
  });
136
235
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/MarkdownText.tsx","../src/PreOverride.tsx","../src/defaultComponents.tsx","../src/CodeOverride.tsx"],"sourcesContent":["export {\n MarkdownTextPrimitive,\n type MarkdownTextPrimitiveProps,\n} from \"./MarkdownText\";\n\nexport type { CodeHeaderProps, SyntaxHighlighterProps } from \"./types\";\n","import { INTERNAL, useContentPartText } from \"@assistant-ui/react\";\nimport type { ComponentType, FC } from \"react\";\nimport ReactMarkdown, { type Options } from \"react-markdown\";\nimport { SyntaxHighlighterProps, CodeHeaderProps } from \"./types\";\nimport { PreOverride } from \"./PreOverride\";\nimport {\n DefaultPre,\n DefaultCode,\n DefaultSyntaxHighlighter,\n DefaultCodeHeader,\n} from \"./defaultComponents\";\nimport { useCallbackRef } from \"@radix-ui/react-use-callback-ref\";\nimport { CodeOverride } from \"./CodeOverride\";\n\nconst { useSmooth } = INTERNAL;\n\nexport type MarkdownTextPrimitiveProps = Omit<\n Options,\n \"components\" | \"children\"\n> & {\n components?: NonNullable<Options[\"components\"]> & {\n SyntaxHighlighter?: ComponentType<SyntaxHighlighterProps>;\n CodeHeader?: ComponentType<CodeHeaderProps>;\n };\n smooth?: boolean;\n};\nexport const MarkdownTextPrimitive: FC<MarkdownTextPrimitiveProps> = ({\n smooth = true,\n components: userComponents,\n ...rest\n}) => {\n const {\n part: { text },\n } = useContentPartText();\n const smoothText = useSmooth(text, smooth);\n\n const {\n pre = DefaultPre,\n code = DefaultCode,\n SyntaxHighlighter = DefaultSyntaxHighlighter,\n CodeHeader = DefaultCodeHeader,\n ...componentsRest\n } = userComponents ?? {};\n const components: typeof userComponents = {\n ...componentsRest,\n pre: PreOverride,\n code: useCallbackRef((props) => (\n <CodeOverride\n components={{ Pre: pre, Code: code, SyntaxHighlighter, CodeHeader }}\n {...props}\n />\n )),\n };\n\n return (\n <ReactMarkdown components={components} {...rest}>\n {smoothText}\n </ReactMarkdown>\n );\n};\n","import { createContext, ComponentPropsWithoutRef } from \"react\";\nimport { PreComponent } from \"./types\";\n\nexport const PreContext = createContext<Omit<\n ComponentPropsWithoutRef<PreComponent>,\n \"children\"\n> | null>(null);\n\nexport const PreOverride: PreComponent = ({ children, ...rest }) => {\n return <PreContext.Provider value={rest}>{children}</PreContext.Provider>;\n};\n","import type { ComponentType } from \"react\";\nimport {\n PreComponent,\n CodeComponent,\n SyntaxHighlighterProps,\n CodeHeaderProps,\n} from \"./types\";\n\nexport const DefaultPre: PreComponent = ({ node, ...rest }) => (\n <pre {...rest} />\n);\nexport const DefaultCode: CodeComponent = ({ node, ...rest }) => (\n <code {...rest} />\n);\nexport const DefaultSyntaxHighlighter: ComponentType<\n SyntaxHighlighterProps\n> = ({ components: { Pre, Code }, code }) => (\n <Pre>\n <Code>{code}</Code>\n </Pre>\n);\nexport const DefaultCodeHeader: ComponentType<CodeHeaderProps> = () => null;\n","import {\n ComponentPropsWithoutRef,\n ComponentType,\n FC,\n useContext,\n useMemo,\n} from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useCallbackRef } from \"@radix-ui/react-use-callback-ref\";\nimport { PreContext } from \"./PreOverride\";\nimport {\n CodeComponent,\n CodeHeaderProps,\n PreComponent,\n SyntaxHighlighterProps,\n} from \"./types\";\nimport { DefaultSyntaxHighlighter } from \"./defaultComponents\";\n\ntype CodeOverrideProps = ComponentPropsWithoutRef<CodeComponent> & {\n components: {\n Pre: PreComponent;\n Code: CodeComponent;\n CodeHeader: ComponentType<CodeHeaderProps>;\n SyntaxHighlighter: ComponentType<SyntaxHighlighterProps>;\n };\n};\n\nconst CodeBlockOverride: FC<CodeOverrideProps> = ({\n components: { Pre, Code, SyntaxHighlighter, CodeHeader },\n children,\n ...codeProps\n}) => {\n const preProps = useContext(PreContext);\n const WrappedPre: PreComponent = useCallbackRef((props) => (\n <Slot {...(preProps as any)}>\n <Pre {...props} />\n </Slot>\n ));\n const WrappedCode: CodeComponent = useCallbackRef((props) => (\n <Slot {...(codeProps as any)}>\n <Code {...props} />\n </Slot>\n ));\n\n const components = useMemo(\n () => ({ Pre: WrappedPre, Code: WrappedCode }),\n [WrappedPre, WrappedCode],\n );\n\n const language = /language-(\\w+)/.exec(codeProps.className || \"\")?.[1];\n const code = children as string;\n const SH = language ? SyntaxHighlighter : DefaultSyntaxHighlighter;\n\n return (\n <>\n <CodeHeader language={language} code={code} />\n <SH\n components={components}\n language={language ?? \"unknown\"}\n code={code}\n />\n </>\n );\n};\n\nexport const CodeOverride: FC<CodeOverrideProps> = ({\n components,\n ...props\n}) => {\n const preProps = useContext(PreContext);\n if (!preProps) return <components.Code {...(props as any)} />;\n return <CodeBlockOverride components={components} {...props} />;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAA6C;AAE7C,4BAA4C;;;ACF5C,mBAAwD;AAS/C;AANF,IAAM,iBAAa,4BAGhB,IAAI;AAEP,IAAM,cAA4B,CAAC,EAAE,UAAU,GAAG,KAAK,MAAM;AAClE,SAAO,4CAAC,WAAW,UAAX,EAAoB,OAAO,MAAO,UAAS;AACrD;;;ACDE,IAAAC,sBAAA;AADK,IAAM,aAA2B,CAAC,EAAE,MAAM,GAAG,KAAK,MACvD,6CAAC,SAAK,GAAG,MAAM;AAEV,IAAM,cAA6B,CAAC,EAAE,MAAM,GAAG,KAAK,MACzD,6CAAC,UAAM,GAAG,MAAM;AAEX,IAAM,2BAET,CAAC,EAAE,YAAY,EAAE,KAAK,KAAK,GAAG,KAAK,MACrC,6CAAC,OACC,uDAAC,QAAM,gBAAK,GACd;AAEK,IAAM,oBAAoD,MAAM;;;AFVvE,IAAAC,iCAA+B;;;AGX/B,IAAAC,gBAMO;AACP,wBAAqB;AACrB,oCAA+B;AA2BzB,IAAAC,sBAAA;AARN,IAAM,oBAA2C,CAAC;AAAA,EAChD,YAAY,EAAE,KAAK,MAAM,mBAAmB,WAAW;AAAA,EACvD;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,eAAW,0BAAW,UAAU;AACtC,QAAM,iBAA2B,8CAAe,CAAC,UAC/C,6CAAC,0BAAM,GAAI,UACT,uDAAC,OAAK,GAAG,OAAO,GAClB,CACD;AACD,QAAM,kBAA6B,8CAAe,CAAC,UACjD,6CAAC,0BAAM,GAAI,WACT,uDAAC,QAAM,GAAG,OAAO,GACnB,CACD;AAED,QAAM,iBAAa;AAAA,IACjB,OAAO,EAAE,KAAK,YAAY,MAAM,YAAY;AAAA,IAC5C,CAAC,YAAY,WAAW;AAAA,EAC1B;AAEA,QAAM,WAAW,iBAAiB,KAAK,UAAU,aAAa,EAAE,IAAI,CAAC;AACrE,QAAM,OAAO;AACb,QAAM,KAAK,WAAW,oBAAoB;AAE1C,SACE,8EACE;AAAA,iDAAC,cAAW,UAAoB,MAAY;AAAA,IAC5C;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,UAAU,YAAY;AAAA,QACtB;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEO,IAAM,eAAsC,CAAC;AAAA,EAClD;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,eAAW,0BAAW,UAAU;AACtC,MAAI,CAAC,SAAU,QAAO,6CAAC,WAAW,MAAX,EAAiB,GAAI,OAAe;AAC3D,SAAO,6CAAC,qBAAkB,YAAyB,GAAG,OAAO;AAC/D;;;AHzBM,IAAAC,sBAAA;AAjCN,IAAM,EAAE,UAAU,IAAI;AAYf,IAAM,wBAAwD,CAAC;AAAA,EACpE,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,GAAG;AACL,MAAM;AACJ,QAAM;AAAA,IACJ,MAAM,EAAE,KAAK;AAAA,EACf,QAAI,kCAAmB;AACvB,QAAM,aAAa,UAAU,MAAM,MAAM;AAEzC,QAAM;AAAA,IACJ,MAAM;AAAA,IACN,OAAO;AAAA,IACP,oBAAoB;AAAA,IACpB,aAAa;AAAA,IACb,GAAG;AAAA,EACL,IAAI,kBAAkB,CAAC;AACvB,QAAM,aAAoC;AAAA,IACxC,GAAG;AAAA,IACH,KAAK;AAAA,IACL,UAAM,+CAAe,CAAC,UACpB;AAAA,MAAC;AAAA;AAAA,QACC,YAAY,EAAE,KAAK,KAAK,MAAM,MAAM,mBAAmB,WAAW;AAAA,QACjE,GAAG;AAAA;AAAA,IACN,CACD;AAAA,EACH;AAEA,SACE,6CAAC,sBAAAC,SAAA,EAAc,YAAyB,GAAG,MACxC,sBACH;AAEJ;","names":["import_react","import_jsx_runtime","import_react_use_callback_ref","import_react","import_jsx_runtime","import_jsx_runtime","ReactMarkdown"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/primitives/MarkdownText.tsx","../src/overrides/PreOverride.tsx","../src/overrides/defaultComponents.tsx","../src/overrides/CodeOverride.tsx","../src/overrides/withDefaults.tsx","../src/ui/markdown-text.tsx","../src/ui/code-header.tsx","../src/ui/useCopyToClipboard.tsx"],"sourcesContent":["export {\n MarkdownTextPrimitive,\n type MarkdownTextPrimitiveProps,\n} from \"./primitives/MarkdownText\";\n\nexport type {\n CodeHeaderProps,\n SyntaxHighlighterProps,\n} from \"./overrides/types\";\n\nexport {\n makeMarkdownText,\n type MakeMarkdownTextProps,\n} from \"./ui/markdown-text\";\n\nexport { CodeHeader } from \"./ui/code-header\";\n","import { INTERNAL, useContentPartText } from \"@assistant-ui/react\";\nimport type { ComponentType, FC } from \"react\";\nimport ReactMarkdown, { type Options } from \"react-markdown\";\nimport { SyntaxHighlighterProps, CodeHeaderProps } from \"../overrides/types\";\nimport { PreOverride } from \"../overrides/PreOverride\";\nimport {\n DefaultPre,\n DefaultCode,\n DefaultSyntaxHighlighter,\n DefaultCodeHeader,\n} from \"../overrides/defaultComponents\";\nimport { useCallbackRef } from \"@radix-ui/react-use-callback-ref\";\nimport { CodeOverride } from \"../overrides/CodeOverride\";\n\nconst { useSmooth } = INTERNAL;\n\nexport type MarkdownTextPrimitiveProps = Omit<\n Options,\n \"components\" | \"children\"\n> & {\n components?: NonNullable<Options[\"components\"]> & {\n SyntaxHighlighter?: ComponentType<SyntaxHighlighterProps>;\n CodeHeader?: ComponentType<CodeHeaderProps>;\n };\n smooth?: boolean;\n};\nexport const MarkdownTextPrimitive: FC<MarkdownTextPrimitiveProps> = ({\n smooth = true,\n components: userComponents,\n ...rest\n}) => {\n const {\n part: { text },\n } = useContentPartText();\n const smoothText = useSmooth(text, smooth);\n\n const {\n pre = DefaultPre,\n code = DefaultCode,\n SyntaxHighlighter = DefaultSyntaxHighlighter,\n CodeHeader = DefaultCodeHeader,\n ...componentsRest\n } = userComponents ?? {};\n const components: typeof userComponents = {\n ...componentsRest,\n pre: PreOverride,\n code: useCallbackRef((props) => (\n <CodeOverride\n components={{ Pre: pre, Code: code, SyntaxHighlighter, CodeHeader }}\n {...props}\n />\n )),\n };\n\n return (\n <ReactMarkdown components={components} {...rest}>\n {smoothText}\n </ReactMarkdown>\n );\n};\n","import { createContext, ComponentPropsWithoutRef } from \"react\";\nimport { PreComponent } from \"./types\";\n\nexport const PreContext = createContext<Omit<\n ComponentPropsWithoutRef<PreComponent>,\n \"children\"\n> | null>(null);\n\nexport const PreOverride: PreComponent = ({ children, ...rest }) => {\n return <PreContext.Provider value={rest}>{children}</PreContext.Provider>;\n};\n","import type { ComponentType } from \"react\";\nimport {\n PreComponent,\n CodeComponent,\n SyntaxHighlighterProps,\n CodeHeaderProps,\n} from \"./types\";\n\nexport const DefaultPre: PreComponent = ({ node, ...rest }) => (\n <pre {...rest} />\n);\nexport const DefaultCode: CodeComponent = ({ node, ...rest }) => (\n <code {...rest} />\n);\nexport const DefaultSyntaxHighlighter: ComponentType<\n SyntaxHighlighterProps\n> = ({ components: { Pre, Code }, code }) => (\n <Pre>\n <Code>{code}</Code>\n </Pre>\n);\nexport const DefaultCodeHeader: ComponentType<CodeHeaderProps> = () => null;\n","import {\n ComponentPropsWithoutRef,\n ComponentType,\n FC,\n useContext,\n useMemo,\n} from \"react\";\nimport { useCallbackRef } from \"@radix-ui/react-use-callback-ref\";\nimport { PreContext } from \"./PreOverride\";\nimport {\n CodeComponent,\n CodeHeaderProps,\n PreComponent,\n SyntaxHighlighterProps,\n} from \"./types\";\nimport { DefaultSyntaxHighlighter } from \"./defaultComponents\";\nimport { withDefaultProps } from \"./withDefaults\";\n\ntype CodeOverrideProps = ComponentPropsWithoutRef<CodeComponent> & {\n components: {\n Pre: PreComponent;\n Code: CodeComponent;\n CodeHeader: ComponentType<CodeHeaderProps>;\n SyntaxHighlighter: ComponentType<SyntaxHighlighterProps>;\n };\n};\n\nconst CodeBlockOverride: FC<CodeOverrideProps> = ({\n components: { Pre, Code, SyntaxHighlighter, CodeHeader },\n children,\n ...codeProps\n}) => {\n const preProps = useContext(PreContext)!;\n const getPreProps = withDefaultProps<any>(preProps);\n const WrappedPre: PreComponent = useCallbackRef((props) => (\n <Pre {...getPreProps(props)} />\n ));\n\n const getCodeProps = withDefaultProps<any>(codeProps);\n const WrappedCode: CodeComponent = useCallbackRef((props) => (\n <Code {...getCodeProps(props)} />\n ));\n\n const components = useMemo(\n () => ({ Pre: WrappedPre, Code: WrappedCode }),\n [WrappedPre, WrappedCode],\n );\n\n const language = /language-(\\w+)/.exec(codeProps.className || \"\")?.[1];\n const code = children as string;\n const SH = language ? SyntaxHighlighter : DefaultSyntaxHighlighter;\n\n return (\n <>\n <CodeHeader language={language} code={code} />\n <SH\n components={components}\n language={language ?? \"unknown\"}\n code={code}\n />\n </>\n );\n};\n\nexport const CodeOverride: FC<CodeOverrideProps> = ({\n components,\n ...props\n}) => {\n const preProps = useContext(PreContext);\n if (!preProps) return <components.Code {...(props as any)} />;\n return <CodeBlockOverride components={components} {...props} />;\n};\n","import classNames from \"classnames\";\n\nexport const withDefaultProps =\n <TProps extends { className?: string | undefined }>({\n className,\n ...defaultProps\n }: Partial<TProps>) =>\n ({ className: classNameProp, ...props }: TProps) => {\n return {\n className: classNames(className, classNameProp),\n ...defaultProps,\n ...props,\n } as TProps;\n };\n","import { TextContentPartProps } from \"@assistant-ui/react\";\nimport { FC, memo } from \"react\";\nimport { CodeHeader } from \"./code-header\";\nimport classNames from \"classnames\";\nimport {\n MarkdownTextPrimitive,\n MarkdownTextPrimitiveProps,\n} from \"../primitives/MarkdownText\";\n\nexport type MakeMarkdownTextProps = MarkdownTextPrimitiveProps;\n\nexport const makeMarkdownText = ({\n className,\n components: userComponents,\n ...rest\n}: MakeMarkdownTextProps = {}) => {\n const components = {\n ...userComponents,\n CodeHeader: userComponents?.CodeHeader ?? CodeHeader,\n };\n\n const MarkdownTextImpl: FC<TextContentPartProps> = ({ status }) => {\n return (\n <div\n className={classNames(\n \"aui-md-root\",\n status.type === \"in_progress\" && \"aui-md-in-progress\",\n className,\n )}\n >\n <MarkdownTextPrimitive components={components} {...rest} />\n </div>\n );\n };\n MarkdownTextImpl.displayName = \"MarkdownText\";\n\n return memo(\n MarkdownTextImpl,\n (prev, next) => prev.status.type === next.status.type,\n );\n};\n","import { FC } from \"react\";\nimport { CheckIcon, CopyIcon } from \"lucide-react\";\nimport { useThreadConfig, INTERNAL } from \"@assistant-ui/react\";\n\nimport { CodeHeaderProps } from \"../overrides/types\";\nimport { useCopyToClipboard } from \"./useCopyToClipboard\";\n\nconst { TooltipIconButton } = INTERNAL;\n\nexport const CodeHeader: FC<CodeHeaderProps> = ({ language, code }) => {\n const {\n strings: {\n code: { header: { copy: { tooltip = \"Copy\" } = {} } = {} } = {},\n } = {},\n } = useThreadConfig();\n\n const { isCopied, copyToClipboard } = useCopyToClipboard();\n const onCopy = () => {\n if (!code || isCopied) return;\n copyToClipboard(code);\n };\n\n return (\n <div className=\"aui-code-header-root\">\n <span className=\"aui-code-header-language\">{language}</span>\n <TooltipIconButton tooltip={tooltip} onClick={onCopy}>\n {!isCopied && <CopyIcon />}\n {isCopied && <CheckIcon />}\n </TooltipIconButton>\n </div>\n );\n};\n","import { useState } from \"react\";\nimport { UseActionBarCopyProps } from \"@assistant-ui/react\";\n\nexport type useCopyToClipboardProps = UseActionBarCopyProps;\n\nexport const useCopyToClipboard = ({\n copiedDuration = 3000,\n}: useCopyToClipboardProps = {}) => {\n const [isCopied, setIsCopied] = useState<boolean>(false);\n\n const copyToClipboard = (value: string) => {\n if (!value) return;\n\n navigator.clipboard.writeText(value).then(() => {\n setIsCopied(true);\n setTimeout(() => setIsCopied(false), copiedDuration);\n });\n };\n\n return { isCopied, copyToClipboard };\n};\n"],"mappings":"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","names":["import_react","import_jsx_runtime","import_react_use_callback_ref","import_react","classNames","import_jsx_runtime","CodeHeader","import_jsx_runtime","CodeHeader","ReactMarkdown","import_react","import_react","import_react","import_jsx_runtime","import_classnames","import_jsx_runtime","classNames"]}
package/dist/index.mjs CHANGED
@@ -1,8 +1,10 @@
1
- // src/MarkdownText.tsx
1
+ "use client";
2
+
3
+ // src/primitives/MarkdownText.tsx
2
4
  import { INTERNAL, useContentPartText } from "@assistant-ui/react";
3
5
  import ReactMarkdown from "react-markdown";
4
6
 
5
- // src/PreOverride.tsx
7
+ // src/overrides/PreOverride.tsx
6
8
  import { createContext } from "react";
7
9
  import { jsx } from "react/jsx-runtime";
8
10
  var PreContext = createContext(null);
@@ -10,32 +12,48 @@ var PreOverride = ({ children, ...rest }) => {
10
12
  return /* @__PURE__ */ jsx(PreContext.Provider, { value: rest, children });
11
13
  };
12
14
 
13
- // src/defaultComponents.tsx
15
+ // src/overrides/defaultComponents.tsx
14
16
  import { jsx as jsx2 } from "react/jsx-runtime";
15
17
  var DefaultPre = ({ node, ...rest }) => /* @__PURE__ */ jsx2("pre", { ...rest });
16
18
  var DefaultCode = ({ node, ...rest }) => /* @__PURE__ */ jsx2("code", { ...rest });
17
19
  var DefaultSyntaxHighlighter = ({ components: { Pre, Code }, code }) => /* @__PURE__ */ jsx2(Pre, { children: /* @__PURE__ */ jsx2(Code, { children: code }) });
18
20
  var DefaultCodeHeader = () => null;
19
21
 
20
- // src/MarkdownText.tsx
22
+ // src/primitives/MarkdownText.tsx
21
23
  import { useCallbackRef as useCallbackRef2 } from "@radix-ui/react-use-callback-ref";
22
24
 
23
- // src/CodeOverride.tsx
25
+ // src/overrides/CodeOverride.tsx
24
26
  import {
25
27
  useContext,
26
28
  useMemo
27
29
  } from "react";
28
- import { Slot } from "@radix-ui/react-slot";
29
30
  import { useCallbackRef } from "@radix-ui/react-use-callback-ref";
31
+
32
+ // src/overrides/withDefaults.tsx
33
+ import classNames from "classnames";
34
+ var withDefaultProps = ({
35
+ className,
36
+ ...defaultProps
37
+ }) => ({ className: classNameProp, ...props }) => {
38
+ return {
39
+ className: classNames(className, classNameProp),
40
+ ...defaultProps,
41
+ ...props
42
+ };
43
+ };
44
+
45
+ // src/overrides/CodeOverride.tsx
30
46
  import { Fragment, jsx as jsx3, jsxs } from "react/jsx-runtime";
31
47
  var CodeBlockOverride = ({
32
- components: { Pre, Code, SyntaxHighlighter, CodeHeader },
48
+ components: { Pre, Code, SyntaxHighlighter, CodeHeader: CodeHeader2 },
33
49
  children,
34
50
  ...codeProps
35
51
  }) => {
36
52
  const preProps = useContext(PreContext);
37
- const WrappedPre = useCallbackRef((props) => /* @__PURE__ */ jsx3(Slot, { ...preProps, children: /* @__PURE__ */ jsx3(Pre, { ...props }) }));
38
- const WrappedCode = useCallbackRef((props) => /* @__PURE__ */ jsx3(Slot, { ...codeProps, children: /* @__PURE__ */ jsx3(Code, { ...props }) }));
53
+ const getPreProps = withDefaultProps(preProps);
54
+ const WrappedPre = useCallbackRef((props) => /* @__PURE__ */ jsx3(Pre, { ...getPreProps(props) }));
55
+ const getCodeProps = withDefaultProps(codeProps);
56
+ const WrappedCode = useCallbackRef((props) => /* @__PURE__ */ jsx3(Code, { ...getCodeProps(props) }));
39
57
  const components = useMemo(
40
58
  () => ({ Pre: WrappedPre, Code: WrappedCode }),
41
59
  [WrappedPre, WrappedCode]
@@ -44,7 +62,7 @@ var CodeBlockOverride = ({
44
62
  const code = children;
45
63
  const SH = language ? SyntaxHighlighter : DefaultSyntaxHighlighter;
46
64
  return /* @__PURE__ */ jsxs(Fragment, { children: [
47
- /* @__PURE__ */ jsx3(CodeHeader, { language, code }),
65
+ /* @__PURE__ */ jsx3(CodeHeader2, { language, code }),
48
66
  /* @__PURE__ */ jsx3(
49
67
  SH,
50
68
  {
@@ -64,7 +82,7 @@ var CodeOverride = ({
64
82
  return /* @__PURE__ */ jsx3(CodeBlockOverride, { components, ...props });
65
83
  };
66
84
 
67
- // src/MarkdownText.tsx
85
+ // src/primitives/MarkdownText.tsx
68
86
  import { jsx as jsx4 } from "react/jsx-runtime";
69
87
  var { useSmooth } = INTERNAL;
70
88
  var MarkdownTextPrimitive = ({
@@ -80,7 +98,7 @@ var MarkdownTextPrimitive = ({
80
98
  pre = DefaultPre,
81
99
  code = DefaultCode,
82
100
  SyntaxHighlighter = DefaultSyntaxHighlighter,
83
- CodeHeader = DefaultCodeHeader,
101
+ CodeHeader: CodeHeader2 = DefaultCodeHeader,
84
102
  ...componentsRest
85
103
  } = userComponents ?? {};
86
104
  const components = {
@@ -89,14 +107,94 @@ var MarkdownTextPrimitive = ({
89
107
  code: useCallbackRef2((props) => /* @__PURE__ */ jsx4(
90
108
  CodeOverride,
91
109
  {
92
- components: { Pre: pre, Code: code, SyntaxHighlighter, CodeHeader },
110
+ components: { Pre: pre, Code: code, SyntaxHighlighter, CodeHeader: CodeHeader2 },
93
111
  ...props
94
112
  }
95
113
  ))
96
114
  };
97
115
  return /* @__PURE__ */ jsx4(ReactMarkdown, { components, ...rest, children: smoothText });
98
116
  };
117
+
118
+ // src/ui/markdown-text.tsx
119
+ import { memo } from "react";
120
+
121
+ // src/ui/code-header.tsx
122
+ import { CheckIcon, CopyIcon } from "lucide-react";
123
+ import { useThreadConfig, INTERNAL as INTERNAL2 } from "@assistant-ui/react";
124
+
125
+ // src/ui/useCopyToClipboard.tsx
126
+ import { useState } from "react";
127
+ var useCopyToClipboard = ({
128
+ copiedDuration = 3e3
129
+ } = {}) => {
130
+ const [isCopied, setIsCopied] = useState(false);
131
+ const copyToClipboard = (value) => {
132
+ if (!value) return;
133
+ navigator.clipboard.writeText(value).then(() => {
134
+ setIsCopied(true);
135
+ setTimeout(() => setIsCopied(false), copiedDuration);
136
+ });
137
+ };
138
+ return { isCopied, copyToClipboard };
139
+ };
140
+
141
+ // src/ui/code-header.tsx
142
+ import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
143
+ var { TooltipIconButton } = INTERNAL2;
144
+ var CodeHeader = ({ language, code }) => {
145
+ const {
146
+ strings: {
147
+ code: { header: { copy: { tooltip = "Copy" } = {} } = {} } = {}
148
+ } = {}
149
+ } = useThreadConfig();
150
+ const { isCopied, copyToClipboard } = useCopyToClipboard();
151
+ const onCopy = () => {
152
+ if (!code || isCopied) return;
153
+ copyToClipboard(code);
154
+ };
155
+ return /* @__PURE__ */ jsxs2("div", { className: "aui-code-header-root", children: [
156
+ /* @__PURE__ */ jsx5("span", { className: "aui-code-header-language", children: language }),
157
+ /* @__PURE__ */ jsxs2(TooltipIconButton, { tooltip, onClick: onCopy, children: [
158
+ !isCopied && /* @__PURE__ */ jsx5(CopyIcon, {}),
159
+ isCopied && /* @__PURE__ */ jsx5(CheckIcon, {})
160
+ ] })
161
+ ] });
162
+ };
163
+
164
+ // src/ui/markdown-text.tsx
165
+ import classNames2 from "classnames";
166
+ import { jsx as jsx6 } from "react/jsx-runtime";
167
+ var makeMarkdownText = ({
168
+ className,
169
+ components: userComponents,
170
+ ...rest
171
+ } = {}) => {
172
+ const components = {
173
+ ...userComponents,
174
+ CodeHeader: userComponents?.CodeHeader ?? CodeHeader
175
+ };
176
+ const MarkdownTextImpl = ({ status }) => {
177
+ return /* @__PURE__ */ jsx6(
178
+ "div",
179
+ {
180
+ className: classNames2(
181
+ "aui-md-root",
182
+ status.type === "in_progress" && "aui-md-in-progress",
183
+ className
184
+ ),
185
+ children: /* @__PURE__ */ jsx6(MarkdownTextPrimitive, { components, ...rest })
186
+ }
187
+ );
188
+ };
189
+ MarkdownTextImpl.displayName = "MarkdownText";
190
+ return memo(
191
+ MarkdownTextImpl,
192
+ (prev, next) => prev.status.type === next.status.type
193
+ );
194
+ };
99
195
  export {
100
- MarkdownTextPrimitive
196
+ CodeHeader,
197
+ MarkdownTextPrimitive,
198
+ makeMarkdownText
101
199
  };
102
200
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/MarkdownText.tsx","../src/PreOverride.tsx","../src/defaultComponents.tsx","../src/CodeOverride.tsx"],"sourcesContent":["import { INTERNAL, useContentPartText } from \"@assistant-ui/react\";\nimport type { ComponentType, FC } from \"react\";\nimport ReactMarkdown, { type Options } from \"react-markdown\";\nimport { SyntaxHighlighterProps, CodeHeaderProps } from \"./types\";\nimport { PreOverride } from \"./PreOverride\";\nimport {\n DefaultPre,\n DefaultCode,\n DefaultSyntaxHighlighter,\n DefaultCodeHeader,\n} from \"./defaultComponents\";\nimport { useCallbackRef } from \"@radix-ui/react-use-callback-ref\";\nimport { CodeOverride } from \"./CodeOverride\";\n\nconst { useSmooth } = INTERNAL;\n\nexport type MarkdownTextPrimitiveProps = Omit<\n Options,\n \"components\" | \"children\"\n> & {\n components?: NonNullable<Options[\"components\"]> & {\n SyntaxHighlighter?: ComponentType<SyntaxHighlighterProps>;\n CodeHeader?: ComponentType<CodeHeaderProps>;\n };\n smooth?: boolean;\n};\nexport const MarkdownTextPrimitive: FC<MarkdownTextPrimitiveProps> = ({\n smooth = true,\n components: userComponents,\n ...rest\n}) => {\n const {\n part: { text },\n } = useContentPartText();\n const smoothText = useSmooth(text, smooth);\n\n const {\n pre = DefaultPre,\n code = DefaultCode,\n SyntaxHighlighter = DefaultSyntaxHighlighter,\n CodeHeader = DefaultCodeHeader,\n ...componentsRest\n } = userComponents ?? {};\n const components: typeof userComponents = {\n ...componentsRest,\n pre: PreOverride,\n code: useCallbackRef((props) => (\n <CodeOverride\n components={{ Pre: pre, Code: code, SyntaxHighlighter, CodeHeader }}\n {...props}\n />\n )),\n };\n\n return (\n <ReactMarkdown components={components} {...rest}>\n {smoothText}\n </ReactMarkdown>\n );\n};\n","import { createContext, ComponentPropsWithoutRef } from \"react\";\nimport { PreComponent } from \"./types\";\n\nexport const PreContext = createContext<Omit<\n ComponentPropsWithoutRef<PreComponent>,\n \"children\"\n> | null>(null);\n\nexport const PreOverride: PreComponent = ({ children, ...rest }) => {\n return <PreContext.Provider value={rest}>{children}</PreContext.Provider>;\n};\n","import type { ComponentType } from \"react\";\nimport {\n PreComponent,\n CodeComponent,\n SyntaxHighlighterProps,\n CodeHeaderProps,\n} from \"./types\";\n\nexport const DefaultPre: PreComponent = ({ node, ...rest }) => (\n <pre {...rest} />\n);\nexport const DefaultCode: CodeComponent = ({ node, ...rest }) => (\n <code {...rest} />\n);\nexport const DefaultSyntaxHighlighter: ComponentType<\n SyntaxHighlighterProps\n> = ({ components: { Pre, Code }, code }) => (\n <Pre>\n <Code>{code}</Code>\n </Pre>\n);\nexport const DefaultCodeHeader: ComponentType<CodeHeaderProps> = () => null;\n","import {\n ComponentPropsWithoutRef,\n ComponentType,\n FC,\n useContext,\n useMemo,\n} from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useCallbackRef } from \"@radix-ui/react-use-callback-ref\";\nimport { PreContext } from \"./PreOverride\";\nimport {\n CodeComponent,\n CodeHeaderProps,\n PreComponent,\n SyntaxHighlighterProps,\n} from \"./types\";\nimport { DefaultSyntaxHighlighter } from \"./defaultComponents\";\n\ntype CodeOverrideProps = ComponentPropsWithoutRef<CodeComponent> & {\n components: {\n Pre: PreComponent;\n Code: CodeComponent;\n CodeHeader: ComponentType<CodeHeaderProps>;\n SyntaxHighlighter: ComponentType<SyntaxHighlighterProps>;\n };\n};\n\nconst CodeBlockOverride: FC<CodeOverrideProps> = ({\n components: { Pre, Code, SyntaxHighlighter, CodeHeader },\n children,\n ...codeProps\n}) => {\n const preProps = useContext(PreContext);\n const WrappedPre: PreComponent = useCallbackRef((props) => (\n <Slot {...(preProps as any)}>\n <Pre {...props} />\n </Slot>\n ));\n const WrappedCode: CodeComponent = useCallbackRef((props) => (\n <Slot {...(codeProps as any)}>\n <Code {...props} />\n </Slot>\n ));\n\n const components = useMemo(\n () => ({ Pre: WrappedPre, Code: WrappedCode }),\n [WrappedPre, WrappedCode],\n );\n\n const language = /language-(\\w+)/.exec(codeProps.className || \"\")?.[1];\n const code = children as string;\n const SH = language ? SyntaxHighlighter : DefaultSyntaxHighlighter;\n\n return (\n <>\n <CodeHeader language={language} code={code} />\n <SH\n components={components}\n language={language ?? \"unknown\"}\n code={code}\n />\n </>\n );\n};\n\nexport const CodeOverride: FC<CodeOverrideProps> = ({\n components,\n ...props\n}) => {\n const preProps = useContext(PreContext);\n if (!preProps) return <components.Code {...(props as any)} />;\n return <CodeBlockOverride components={components} {...props} />;\n};\n"],"mappings":"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","names":["jsx","useCallbackRef","jsx","jsx","useCallbackRef"]}
1
+ {"version":3,"sources":["../src/primitives/MarkdownText.tsx","../src/overrides/PreOverride.tsx","../src/overrides/defaultComponents.tsx","../src/overrides/CodeOverride.tsx","../src/overrides/withDefaults.tsx","../src/ui/markdown-text.tsx","../src/ui/code-header.tsx","../src/ui/useCopyToClipboard.tsx"],"sourcesContent":["import { INTERNAL, useContentPartText } from \"@assistant-ui/react\";\nimport type { ComponentType, FC } from \"react\";\nimport ReactMarkdown, { type Options } from \"react-markdown\";\nimport { SyntaxHighlighterProps, CodeHeaderProps } from \"../overrides/types\";\nimport { PreOverride } from \"../overrides/PreOverride\";\nimport {\n DefaultPre,\n DefaultCode,\n DefaultSyntaxHighlighter,\n DefaultCodeHeader,\n} from \"../overrides/defaultComponents\";\nimport { useCallbackRef } from \"@radix-ui/react-use-callback-ref\";\nimport { CodeOverride } from \"../overrides/CodeOverride\";\n\nconst { useSmooth } = INTERNAL;\n\nexport type MarkdownTextPrimitiveProps = Omit<\n Options,\n \"components\" | \"children\"\n> & {\n components?: NonNullable<Options[\"components\"]> & {\n SyntaxHighlighter?: ComponentType<SyntaxHighlighterProps>;\n CodeHeader?: ComponentType<CodeHeaderProps>;\n };\n smooth?: boolean;\n};\nexport const MarkdownTextPrimitive: FC<MarkdownTextPrimitiveProps> = ({\n smooth = true,\n components: userComponents,\n ...rest\n}) => {\n const {\n part: { text },\n } = useContentPartText();\n const smoothText = useSmooth(text, smooth);\n\n const {\n pre = DefaultPre,\n code = DefaultCode,\n SyntaxHighlighter = DefaultSyntaxHighlighter,\n CodeHeader = DefaultCodeHeader,\n ...componentsRest\n } = userComponents ?? {};\n const components: typeof userComponents = {\n ...componentsRest,\n pre: PreOverride,\n code: useCallbackRef((props) => (\n <CodeOverride\n components={{ Pre: pre, Code: code, SyntaxHighlighter, CodeHeader }}\n {...props}\n />\n )),\n };\n\n return (\n <ReactMarkdown components={components} {...rest}>\n {smoothText}\n </ReactMarkdown>\n );\n};\n","import { createContext, ComponentPropsWithoutRef } from \"react\";\nimport { PreComponent } from \"./types\";\n\nexport const PreContext = createContext<Omit<\n ComponentPropsWithoutRef<PreComponent>,\n \"children\"\n> | null>(null);\n\nexport const PreOverride: PreComponent = ({ children, ...rest }) => {\n return <PreContext.Provider value={rest}>{children}</PreContext.Provider>;\n};\n","import type { ComponentType } from \"react\";\nimport {\n PreComponent,\n CodeComponent,\n SyntaxHighlighterProps,\n CodeHeaderProps,\n} from \"./types\";\n\nexport const DefaultPre: PreComponent = ({ node, ...rest }) => (\n <pre {...rest} />\n);\nexport const DefaultCode: CodeComponent = ({ node, ...rest }) => (\n <code {...rest} />\n);\nexport const DefaultSyntaxHighlighter: ComponentType<\n SyntaxHighlighterProps\n> = ({ components: { Pre, Code }, code }) => (\n <Pre>\n <Code>{code}</Code>\n </Pre>\n);\nexport const DefaultCodeHeader: ComponentType<CodeHeaderProps> = () => null;\n","import {\n ComponentPropsWithoutRef,\n ComponentType,\n FC,\n useContext,\n useMemo,\n} from \"react\";\nimport { useCallbackRef } from \"@radix-ui/react-use-callback-ref\";\nimport { PreContext } from \"./PreOverride\";\nimport {\n CodeComponent,\n CodeHeaderProps,\n PreComponent,\n SyntaxHighlighterProps,\n} from \"./types\";\nimport { DefaultSyntaxHighlighter } from \"./defaultComponents\";\nimport { withDefaultProps } from \"./withDefaults\";\n\ntype CodeOverrideProps = ComponentPropsWithoutRef<CodeComponent> & {\n components: {\n Pre: PreComponent;\n Code: CodeComponent;\n CodeHeader: ComponentType<CodeHeaderProps>;\n SyntaxHighlighter: ComponentType<SyntaxHighlighterProps>;\n };\n};\n\nconst CodeBlockOverride: FC<CodeOverrideProps> = ({\n components: { Pre, Code, SyntaxHighlighter, CodeHeader },\n children,\n ...codeProps\n}) => {\n const preProps = useContext(PreContext)!;\n const getPreProps = withDefaultProps<any>(preProps);\n const WrappedPre: PreComponent = useCallbackRef((props) => (\n <Pre {...getPreProps(props)} />\n ));\n\n const getCodeProps = withDefaultProps<any>(codeProps);\n const WrappedCode: CodeComponent = useCallbackRef((props) => (\n <Code {...getCodeProps(props)} />\n ));\n\n const components = useMemo(\n () => ({ Pre: WrappedPre, Code: WrappedCode }),\n [WrappedPre, WrappedCode],\n );\n\n const language = /language-(\\w+)/.exec(codeProps.className || \"\")?.[1];\n const code = children as string;\n const SH = language ? SyntaxHighlighter : DefaultSyntaxHighlighter;\n\n return (\n <>\n <CodeHeader language={language} code={code} />\n <SH\n components={components}\n language={language ?? \"unknown\"}\n code={code}\n />\n </>\n );\n};\n\nexport const CodeOverride: FC<CodeOverrideProps> = ({\n components,\n ...props\n}) => {\n const preProps = useContext(PreContext);\n if (!preProps) return <components.Code {...(props as any)} />;\n return <CodeBlockOverride components={components} {...props} />;\n};\n","import classNames from \"classnames\";\n\nexport const withDefaultProps =\n <TProps extends { className?: string | undefined }>({\n className,\n ...defaultProps\n }: Partial<TProps>) =>\n ({ className: classNameProp, ...props }: TProps) => {\n return {\n className: classNames(className, classNameProp),\n ...defaultProps,\n ...props,\n } as TProps;\n };\n","import { TextContentPartProps } from \"@assistant-ui/react\";\nimport { FC, memo } from \"react\";\nimport { CodeHeader } from \"./code-header\";\nimport classNames from \"classnames\";\nimport {\n MarkdownTextPrimitive,\n MarkdownTextPrimitiveProps,\n} from \"../primitives/MarkdownText\";\n\nexport type MakeMarkdownTextProps = MarkdownTextPrimitiveProps;\n\nexport const makeMarkdownText = ({\n className,\n components: userComponents,\n ...rest\n}: MakeMarkdownTextProps = {}) => {\n const components = {\n ...userComponents,\n CodeHeader: userComponents?.CodeHeader ?? CodeHeader,\n };\n\n const MarkdownTextImpl: FC<TextContentPartProps> = ({ status }) => {\n return (\n <div\n className={classNames(\n \"aui-md-root\",\n status.type === \"in_progress\" && \"aui-md-in-progress\",\n className,\n )}\n >\n <MarkdownTextPrimitive components={components} {...rest} />\n </div>\n );\n };\n MarkdownTextImpl.displayName = \"MarkdownText\";\n\n return memo(\n MarkdownTextImpl,\n (prev, next) => prev.status.type === next.status.type,\n );\n};\n","import { FC } from \"react\";\nimport { CheckIcon, CopyIcon } from \"lucide-react\";\nimport { useThreadConfig, INTERNAL } from \"@assistant-ui/react\";\n\nimport { CodeHeaderProps } from \"../overrides/types\";\nimport { useCopyToClipboard } from \"./useCopyToClipboard\";\n\nconst { TooltipIconButton } = INTERNAL;\n\nexport const CodeHeader: FC<CodeHeaderProps> = ({ language, code }) => {\n const {\n strings: {\n code: { header: { copy: { tooltip = \"Copy\" } = {} } = {} } = {},\n } = {},\n } = useThreadConfig();\n\n const { isCopied, copyToClipboard } = useCopyToClipboard();\n const onCopy = () => {\n if (!code || isCopied) return;\n copyToClipboard(code);\n };\n\n return (\n <div className=\"aui-code-header-root\">\n <span className=\"aui-code-header-language\">{language}</span>\n <TooltipIconButton tooltip={tooltip} onClick={onCopy}>\n {!isCopied && <CopyIcon />}\n {isCopied && <CheckIcon />}\n </TooltipIconButton>\n </div>\n );\n};\n","import { useState } from \"react\";\nimport { UseActionBarCopyProps } from \"@assistant-ui/react\";\n\nexport type useCopyToClipboardProps = UseActionBarCopyProps;\n\nexport const useCopyToClipboard = ({\n copiedDuration = 3000,\n}: useCopyToClipboardProps = {}) => {\n const [isCopied, setIsCopied] = useState<boolean>(false);\n\n const copyToClipboard = (value: string) => {\n if (!value) return;\n\n navigator.clipboard.writeText(value).then(() => {\n setIsCopied(true);\n setTimeout(() => setIsCopied(false), copiedDuration);\n });\n };\n\n return { isCopied, copyToClipboard };\n};\n"],"mappings":"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","names":["jsx","useCallbackRef","jsx","CodeHeader","jsx","CodeHeader","useCallbackRef","INTERNAL","jsx","jsxs","INTERNAL","classNames","jsx","classNames"]}
@@ -0,0 +1,72 @@
1
+ /* src/styles/tailwindcss/markdown.css */
2
+ .aui-md-in-progress:empty::after,
3
+ .aui-md-in-progress > :not(ol):not(ul):not(pre):last-child::after,
4
+ .aui-md-in-progress > pre:last-child code::after,
5
+ .aui-md-in-progress > :is(ol, ul):last-child > li:last-child:not(:has(* > li))::after,
6
+ .aui-md-in-progress > :is(ol, ul):last-child > li:last-child > :is(ol, ul):last-child > li:last-child:not(:has(* > li))::after,
7
+ .aui-md-in-progress > :is(ol, ul):last-child > li:last-child > :is(ol, ul):last-child > li:last-child > :is(ol, ul):last-child > li:last-child::after {
8
+ @apply animate-pulse font-sans content-["\25cf"] ltr:ml-1 rtl:mr-1;
9
+ }
10
+ .aui-md-root h1 {
11
+ @apply mb-8 scroll-m-20 text-4xl font-extrabold tracking-tight last:mb-0;
12
+ }
13
+ .aui-md-root h2 {
14
+ @apply mb-4 mt-8 scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0 last:mb-0;
15
+ }
16
+ .aui-md-root h3 {
17
+ @apply mb-4 mt-6 scroll-m-20 text-2xl font-semibold tracking-tight first:mt-0 last:mb-0;
18
+ }
19
+ .aui-md-root h4 {
20
+ @apply mb-4 mt-6 scroll-m-20 text-xl font-semibold tracking-tight first:mt-0 last:mb-0;
21
+ }
22
+ .aui-md-root h5 {
23
+ @apply my-4 text-lg font-semibold first:mt-0 last:mb-0;
24
+ }
25
+ .aui-md-root h6 {
26
+ @apply my-4 font-semibold first:mt-0 last:mb-0;
27
+ }
28
+ .aui-md-root p {
29
+ @apply mb-5 mt-5 leading-7 first:mt-0 last:mb-0;
30
+ }
31
+ .aui-md-root a {
32
+ @apply text-aui-primary font-medium underline underline-offset-4;
33
+ }
34
+ .aui-md-root blockquote {
35
+ @apply border-l-2 pl-6 italic;
36
+ }
37
+ .aui-md-root ul {
38
+ @apply my-5 ml-6 list-disc [&>li]:mt-2;
39
+ }
40
+ .aui-md-root ol {
41
+ @apply my-5 ml-6 list-decimal [&>li]:mt-2;
42
+ }
43
+ .aui-md-root hr {
44
+ @apply my-5 border-b;
45
+ }
46
+ .aui-md-root table {
47
+ @apply my-5 w-full border-separate border-spacing-0 overflow-y-auto;
48
+ }
49
+ .aui-md-root th {
50
+ @apply bg-aui-muted px-4 py-2 text-left font-bold first:rounded-tl-lg last:rounded-tr-lg [&[align=center]]:text-center [&[align=right]]:text-right;
51
+ }
52
+ .aui-md-root td {
53
+ @apply border-b border-l px-4 py-2 text-left last:border-r [&[align=center]]:text-center [&[align=right]]:text-right;
54
+ }
55
+ .aui-md-root tr {
56
+ @apply m-0 border-b p-0 first:border-t [&:last-child>td:first-child]:rounded-bl-lg [&:last-child>td:last-child]:rounded-br-lg;
57
+ }
58
+ .aui-md-root sup {
59
+ @apply [&>a]:text-xs [&>a]:no-underline;
60
+ }
61
+ .aui-md-root pre {
62
+ @apply overflow-x-auto rounded-b-lg bg-black p-4 text-white;
63
+ }
64
+ .aui-md-root :not(pre) code {
65
+ @apply bg-aui-muted rounded border font-semibold;
66
+ }
67
+ .aui-code-header-root {
68
+ @apply flex items-center justify-between gap-4 rounded-t-lg bg-zinc-900 px-4 py-2 text-sm font-semibold text-white;
69
+ }
70
+ .aui-code-header-language {
71
+ @apply lowercase [&>span]:text-xs;
72
+ }
@@ -0,0 +1,107 @@
1
+ /* in progress indicator */
2
+ .aui-md-in-progress:empty::after,
3
+ .aui-md-in-progress > :not(ol):not(ul):not(pre):last-child::after,
4
+ .aui-md-in-progress > pre:last-child code::after,
5
+ .aui-md-in-progress
6
+ > :is(ol, ul):last-child
7
+ > li:last-child:not(:has(* > li))::after,
8
+ .aui-md-in-progress
9
+ > :is(ol, ul):last-child
10
+ > li:last-child
11
+ > :is(ol, ul):last-child
12
+ > li:last-child:not(:has(* > li))::after,
13
+ .aui-md-in-progress
14
+ > :is(ol, ul):last-child
15
+ > li:last-child
16
+ > :is(ol, ul):last-child
17
+ > li:last-child
18
+ > :is(ol, ul):last-child
19
+ > li:last-child::after {
20
+ @apply animate-pulse font-sans content-['\25CF'] ltr:ml-1 rtl:mr-1;
21
+ }
22
+
23
+ /* typography */
24
+
25
+ .aui-md-root h1 {
26
+ @apply mb-8 scroll-m-20 text-4xl font-extrabold tracking-tight last:mb-0;
27
+ }
28
+
29
+ .aui-md-root h2 {
30
+ @apply mb-4 mt-8 scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0 last:mb-0;
31
+ }
32
+
33
+ .aui-md-root h3 {
34
+ @apply mb-4 mt-6 scroll-m-20 text-2xl font-semibold tracking-tight first:mt-0 last:mb-0;
35
+ }
36
+
37
+ .aui-md-root h4 {
38
+ @apply mb-4 mt-6 scroll-m-20 text-xl font-semibold tracking-tight first:mt-0 last:mb-0;
39
+ }
40
+
41
+ .aui-md-root h5 {
42
+ @apply my-4 text-lg font-semibold first:mt-0 last:mb-0;
43
+ }
44
+
45
+ .aui-md-root h6 {
46
+ @apply my-4 font-semibold first:mt-0 last:mb-0;
47
+ }
48
+
49
+ .aui-md-root p {
50
+ @apply mb-5 mt-5 leading-7 first:mt-0 last:mb-0;
51
+ }
52
+
53
+ .aui-md-root a {
54
+ @apply text-aui-primary font-medium underline underline-offset-4;
55
+ }
56
+
57
+ .aui-md-root blockquote {
58
+ @apply border-l-2 pl-6 italic;
59
+ }
60
+
61
+ .aui-md-root ul {
62
+ @apply my-5 ml-6 list-disc [&>li]:mt-2;
63
+ }
64
+
65
+ .aui-md-root ol {
66
+ @apply my-5 ml-6 list-decimal [&>li]:mt-2;
67
+ }
68
+
69
+ .aui-md-root hr {
70
+ @apply my-5 border-b;
71
+ }
72
+
73
+ .aui-md-root table {
74
+ @apply my-5 w-full border-separate border-spacing-0 overflow-y-auto;
75
+ }
76
+
77
+ .aui-md-root th {
78
+ @apply bg-aui-muted px-4 py-2 text-left font-bold first:rounded-tl-lg last:rounded-tr-lg [&[align=center]]:text-center [&[align=right]]:text-right;
79
+ }
80
+
81
+ .aui-md-root td {
82
+ @apply border-b border-l px-4 py-2 text-left last:border-r [&[align=center]]:text-center [&[align=right]]:text-right;
83
+ }
84
+
85
+ .aui-md-root tr {
86
+ @apply m-0 border-b p-0 first:border-t [&:last-child>td:first-child]:rounded-bl-lg [&:last-child>td:last-child]:rounded-br-lg;
87
+ }
88
+
89
+ .aui-md-root sup {
90
+ @apply [&>a]:text-xs [&>a]:no-underline;
91
+ }
92
+
93
+ .aui-md-root pre {
94
+ @apply overflow-x-auto rounded-b-lg bg-black p-4 text-white;
95
+ }
96
+
97
+ .aui-md-root :not(pre) code {
98
+ @apply bg-aui-muted rounded border font-semibold;
99
+ }
100
+
101
+ .aui-code-header-root {
102
+ @apply flex items-center justify-between gap-4 rounded-t-lg bg-zinc-900 px-4 py-2 text-sm font-semibold text-white;
103
+ }
104
+
105
+ .aui-code-header-language {
106
+ @apply lowercase [&>span]:text-xs;
107
+ }
@@ -0,0 +1,11 @@
1
+ import * as tailwindcss_types_config from 'tailwindcss/types/config';
2
+
3
+ declare const auiPlugin: {
4
+ (options: {}): {
5
+ handler: tailwindcss_types_config.PluginCreator;
6
+ config?: Partial<tailwindcss_types_config.Config>;
7
+ };
8
+ __isOptionsFunction: true;
9
+ };
10
+
11
+ export { auiPlugin as default };
@@ -0,0 +1,11 @@
1
+ import * as tailwindcss_types_config from 'tailwindcss/types/config';
2
+
3
+ declare const auiPlugin: {
4
+ (options: {}): {
5
+ handler: tailwindcss_types_config.PluginCreator;
6
+ config?: Partial<tailwindcss_types_config.Config>;
7
+ };
8
+ __isOptionsFunction: true;
9
+ };
10
+
11
+ export { auiPlugin as default };
@@ -0,0 +1,43 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+
30
+ // src/tailwindcss/index.ts
31
+ var tailwindcss_exports = {};
32
+ __export(tailwindcss_exports, {
33
+ default: () => tailwindcss_default
34
+ });
35
+ module.exports = __toCommonJS(tailwindcss_exports);
36
+ var import_plugin = __toESM(require("tailwindcss/plugin"));
37
+ var auiPlugin = import_plugin.default.withOptions(() => ({ addComponents }) => {
38
+ addComponents({
39
+ '@import "@assistant-ui/react-markdown/styles/tailwindcss/markdown.css"': ""
40
+ });
41
+ });
42
+ var tailwindcss_default = auiPlugin;
43
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/tailwindcss/index.ts"],"sourcesContent":["import plugin from \"tailwindcss/plugin\";\n\nconst auiPlugin = plugin.withOptions<{}>(() => ({ addComponents }) => {\n addComponents({\n '@import \"@assistant-ui/react-markdown/styles/tailwindcss/markdown.css\"':\n \"\",\n });\n});\n\nexport default auiPlugin;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAmB;AAEnB,IAAM,YAAY,cAAAA,QAAO,YAAgB,MAAM,CAAC,EAAE,cAAc,MAAM;AACpE,gBAAc;AAAA,IACZ,0EACE;AAAA,EACJ,CAAC;AACH,CAAC;AAED,IAAO,sBAAQ;","names":["plugin"]}
@@ -0,0 +1,12 @@
1
+ // src/tailwindcss/index.ts
2
+ import plugin from "tailwindcss/plugin";
3
+ var auiPlugin = plugin.withOptions(() => ({ addComponents }) => {
4
+ addComponents({
5
+ '@import "@assistant-ui/react-markdown/styles/tailwindcss/markdown.css"': ""
6
+ });
7
+ });
8
+ var tailwindcss_default = auiPlugin;
9
+ export {
10
+ tailwindcss_default as default
11
+ };
12
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/tailwindcss/index.ts"],"sourcesContent":["import plugin from \"tailwindcss/plugin\";\n\nconst auiPlugin = plugin.withOptions<{}>(() => ({ addComponents }) => {\n addComponents({\n '@import \"@assistant-ui/react-markdown/styles/tailwindcss/markdown.css\"':\n \"\",\n });\n});\n\nexport default auiPlugin;\n"],"mappings":";AAAA,OAAO,YAAY;AAEnB,IAAM,YAAY,OAAO,YAAgB,MAAM,CAAC,EAAE,cAAc,MAAM;AACpE,gBAAc;AAAA,IACZ,0EACE;AAAA,EACJ,CAAC;AACH,CAAC;AAED,IAAO,sBAAQ;","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@assistant-ui/react-markdown",
3
- "version": "0.0.5",
3
+ "version": "0.1.0",
4
4
  "license": "MIT",
5
5
  "exports": {
6
6
  ".": {
@@ -12,6 +12,19 @@
12
12
  "types": "./dist/index.d.ts",
13
13
  "default": "./dist/index.js"
14
14
  }
15
+ },
16
+ "./tailwindcss": {
17
+ "import": {
18
+ "types": "./dist/tailwindcss/index.d.mts",
19
+ "default": "./dist/tailwindcss/index.mjs"
20
+ },
21
+ "require": {
22
+ "types": "./dist/tailwindcss/index.d.ts",
23
+ "default": "./dist/tailwindcss/index.js"
24
+ }
25
+ },
26
+ "./styles/*": {
27
+ "default": "./dist/styles/*"
15
28
  }
16
29
  },
17
30
  "source": "./src/index.ts",
@@ -24,23 +37,30 @@
24
37
  ],
25
38
  "sideEffects": false,
26
39
  "dependencies": {
27
- "@radix-ui/react-slot": "^1.1.0",
28
40
  "@radix-ui/react-use-callback-ref": "^1.1.0",
41
+ "classnames": "^2.5.1",
42
+ "lucide-react": "^0.407.0",
29
43
  "react-markdown": "^9.0.1"
30
44
  },
31
45
  "peerDependencies": {
32
- "@assistant-ui/react": "^0.3.5",
46
+ "@assistant-ui/react": "^0.4.0",
33
47
  "@types/react": "*",
34
- "react": "^18"
48
+ "react": "^18",
49
+ "tailwindcss": "^3.4.4"
35
50
  },
36
51
  "peerDependenciesMeta": {
37
52
  "@types/react": {
38
53
  "optional": true
54
+ },
55
+ "tailwindcss": {
56
+ "optional": true
39
57
  }
40
58
  },
41
59
  "devDependencies": {
42
- "eslint-config-next": "14.2.4",
60
+ "eslint-config-next": "14.2.5",
61
+ "tailwindcss": "^3.4.4",
43
62
  "tsup": "^8.1.0",
63
+ "tsx": "^4.16.2",
44
64
  "@assistant-ui/tsconfig": "0.0.0"
45
65
  },
46
66
  "publishConfig": {
@@ -56,6 +76,6 @@
56
76
  "url": "https://github.com/Yonom/assistant-ui/issues"
57
77
  },
58
78
  "scripts": {
59
- "build": "tsup src/index.ts --format cjs,esm --dts --sourcemap --clean"
79
+ "build": "tsx scripts/build.mts"
60
80
  }
61
81
  }