@strapi/content-type-builder 5.25.0 → 5.27.0

package/dist/admin/components/AIChat/components/Messages/Message.js

@@ -0,0 +1,214 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var designSystem = require('@strapi/design-system');
+var Icons = require('@strapi/icons');
+var Markdown = require('react-markdown');
+var styledComponents = require('styled-components');
+var FeedbackModal = require('../../FeedbackModal.js');
+var useFeedback = require('../../hooks/useFeedback.js');
+var AnimatedBox = require('../AnimatedBox.js');
+var AttachmentPreview = require('../Attachments/AttachmentPreview.js');
+var Marker = require('./Marker.js');
+
+const MarkdownStyles = styledComponents.styled(designSystem.Typography)`
+  max-width: 65ch;
+  margin: 0 auto;
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    margin-top: 1.25em;
+    margin-bottom: 0.5em;
+    font-weight: bold;
+  }
+
+  p {
+    margin-bottom: 1em;
+  }
+
+  ul,
+  ol {
+    padding-left: 1.5em; /* indentation for bullet points */
+    margin-bottom: 1em;
+  }
+
+  li {
+    margin-bottom: 0.5em;
+    list-style-type: disc; /* or whatever style you prefer */
+  }
+
+  strong {
+    font-weight: bold;
+  }
+
+  /* code blocks, blockquotes, etc. */
+  code {
+    background-color: ${({ theme })=>theme.colors.neutral100};
+    padding: 0.2em 0.4em;
+    border-radius: ${({ theme })=>theme.borderRadius};
+    border-color: ${({ theme })=>theme.colors.neutral150};
+    border-style: solid;
+    font-family: 'SF Mono', SFMono-Regular, ui-monospace, 'DejaVu Sans Mono', Menlo, Consolas,
+      monospace;
+  }
+
+  /* links */
+  a {
+    color: ${({ theme })=>theme.colors.primary500};
+    background-color: ${({ theme })=>theme.colors.neutral100};
+    padding: 0.2em 0.4em;
+    border-radius: ${({ theme })=>theme.borderRadius};
+    border-color: ${({ theme })=>theme.colors.neutral150};
+    border-style: solid;
+    text-decoration: none;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+`;
+const isSchemaToolPart = (part)=>part && typeof part === 'object' && part.type === 'tool-schemaGenerationTool';
+const capitalize = (s)=>s ? s.charAt(0).toUpperCase() + s.slice(1) : '';
+const getSchemaLink = (schema)=>{
+    const isComponent = (schema.kind ?? schema.modelType) === 'component';
+    if (!schema.uid) return undefined;
+    return isComponent ? `/plugins/content-type-builder/component-categories/${schema.category ?? ''}/${schema.uid}` : `/plugins/content-type-builder/content-types/${schema.uid}`;
+};
+const toMarkerFromSchemaTool = (part)=>{
+    const outSchemas = part.output?.schemas ?? [];
+    const inSchemas = part.input?.schemas ?? [];
+    const schemas = outSchemas.length ? outSchemas : inSchemas;
+    const numSchemas = schemas.length;
+    const state = part.output ? part.output.error ? 'error' : 'success' : 'loading';
+    const steps = schemas.map((schema, index)=>({
+            id: `${part.toolCallId ?? 'schemaGenerationTool'}-${schema.uid ?? schema.name ?? index}`,
+            description: capitalize(schema.name ?? schema.uid ?? 'Schema'),
+            status: schema.action === 'create' || schema.action === 'update' || schema.action === 'remove' ? schema.action : 'update',
+            link: getSchemaLink(schema)
+        }));
+    const title = state === 'success' ? `Updated ${numSchemas} schema${numSchemas === 1 ? '' : 's'}` : state === 'error' ? `Failed to update schema${numSchemas === 1 ? '' : 's'}` : 'Updating schemas';
+    return {
+        type: 'marker',
+        title,
+        state,
+        steps
+    };
+};
+const MessageContent = ({ part })=>{
+    if (part.type === 'text') {
+        return /*#__PURE__*/ jsxRuntime.jsx(MarkdownStyles, {
+            children: /*#__PURE__*/ jsxRuntime.jsx(Markdown, {
+                components: {
+                    a: ({ node, ...props })=>/*#__PURE__*/ jsxRuntime.jsx("a", {
+                            target: "_blank",
+                            rel: "noopener noreferrer",
+                            ...props
+                        })
+                },
+                children: part.text
+            })
+        });
+    }
+    if (isSchemaToolPart(part)) {
+        const marker = toMarkerFromSchemaTool(part);
+        return /*#__PURE__*/ jsxRuntime.jsx(Marker.Marker, {
+            ...marker
+        });
+    }
+    return null;
+};
+const UserMessage = ({ message })=>{
+    const hasText = message.parts.some((content)=>content.type === 'text' && content.text.trim() !== '');
+    const attachments = message.parts.filter((content)=>content.type === 'file');
+    return /*#__PURE__*/ jsxRuntime.jsxs(AnimatedBox.AnimatedBox, {
+        as: designSystem.Flex,
+        direction: "column",
+        alignItems: "flex-end",
+        style: {
+            alignSelf: 'flex-end'
+        },
+        gap: 2,
+        maxWidth: "80%",
+        children: [
+            hasText ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+                background: "neutral150",
+                borderStyle: "none",
+                padding: [
+                    '10px',
+                    '16px'
+                ],
+                hasRadius: true,
+                children: message.parts.map((content, index)=>{
+                    if (content.type !== 'text') return null;
+                    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                        children: content.text
+                    }, index);
+                })
+            }) : null,
+            attachments.map((attachment, idx)=>/*#__PURE__*/ jsxRuntime.jsx(AttachmentPreview.AttachmentPreview, {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    attachment: {
+                        ...attachment,
+                        status: 'ready'
+                    }
+                }, `${attachment.type === 'file' ? attachment.filename : attachment.type}-${idx}`))
+        ]
+    });
+};
+const AssistantMessage = ({ message, isLoading })=>{
+    const { upvoteMessage } = useFeedback.useFeedback();
+    const { openFeedbackModal } = FeedbackModal.useFeedbackModal();
+    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Box, {
+        style: {
+            alignSelf: 'flex-start'
+        },
+        maxWidth: "90%",
+        children: [
+            message.parts.map((content, index)=>/*#__PURE__*/ jsxRuntime.jsx(MessageContent, {
+                    part: content
+                }, index)),
+            isLoading ? /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                gap: 1,
+                children: [
+                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                        label: "Upvote",
+                        size: "XS",
+                        variant: "ghost",
+                        onClick: ()=>upvoteMessage(message.id),
+                        children: /*#__PURE__*/ jsxRuntime.jsx(Icons.ThumbUp, {})
+                    }),
+                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                        label: "Downvote",
+                        size: "XS",
+                        variant: "ghost",
+                        // For downvoting, user must provide specific feedback
+                        onClick: ()=>openFeedbackModal(message.id),
+                        children: /*#__PURE__*/ jsxRuntime.jsx(Icons.ThumbDown, {})
+                    })
+                ]
+            }) : null
+        ]
+    });
+};
+const ChatMessage = ({ message, isLoading })=>{
+    /**
+   * IMPORTANT: Messages are rendered using react-markdown (heavy compute)
+   * Component re-renders on each message update, but AI SDK v5 provides
+   * throttling (experimental_throttle: 100ms) which batches updates and reduces
+   * re-render frequency during streaming.
+   */ if (message.role === 'user') {
+        return /*#__PURE__*/ jsxRuntime.jsx(UserMessage, {
+            message: message
+        });
+    }
+    return /*#__PURE__*/ jsxRuntime.jsx(AssistantMessage, {
+        message: message
+    });
+};
+
+exports.ChatMessage = ChatMessage;
+//# sourceMappingURL=Message.js.map

package/dist/admin/components/AIChat/components/Messages/Message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.js","sources":["../../../../../../admin/src/components/AIChat/components/Messages/Message.tsx"],"sourcesContent":["import { Typography, Box, IconButton, Flex } from '@strapi/design-system';\nimport { ThumbUp, ThumbDown } from '@strapi/icons';\nimport Markdown from 'react-markdown';\nimport { styled } from 'styled-components';\n\nimport { useFeedbackModal } from '../../FeedbackModal';\nimport { useFeedback } from '../../hooks/useFeedback';\nimport {\n  AIMessage,\n  type UserMessage as UserMessageType,\n  AssistantMessage as AssistantMessageType,\n  type MarkerContent as MarkerContentType,\n} from '../../lib/types/messages';\nimport { AnimatedBox } from '../AnimatedBox';\nimport { AttachmentPreview } from '../Attachments/AttachmentPreview';\n\nimport { Marker } from './Marker';\n\nconst MarkdownStyles = styled(Typography)`\n  max-width: 65ch;\n  margin: 0 auto;\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin-top: 1.25em;\n    margin-bottom: 0.5em;\n    font-weight: bold;\n  }\n\n  p {\n    margin-bottom: 1em;\n  }\n\n  ul,\n  ol {\n    padding-left: 1.5em; /* indentation for bullet points */\n    margin-bottom: 1em;\n  }\n\n  li {\n    margin-bottom: 0.5em;\n    list-style-type: disc; /* or whatever style you prefer */\n  }\n\n  strong {\n    font-weight: bold;\n  }\n\n  /* code blocks, blockquotes, etc. */\n  code {\n    background-color: ${({ theme }) => theme.colors.neutral100};\n    padding: 0.2em 0.4em;\n    border-radius: ${({ theme }) => theme.borderRadius};\n    border-color: ${({ theme }) => theme.colors.neutral150};\n    border-style: solid;\n    font-family: 'SF Mono', SFMono-Regular, ui-monospace, 'DejaVu Sans Mono', Menlo, Consolas,\n      monospace;\n  }\n\n  /* links */\n  a {\n    color: ${({ theme }) => theme.colors.primary500};\n    background-color: ${({ theme }) => theme.colors.neutral100};\n    padding: 0.2em 0.4em;\n    border-radius: ${({ theme }) => theme.borderRadius};\n    border-color: ${({ theme }) => theme.colors.neutral150};\n    border-style: solid;\n    text-decoration: none;\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n`;\n\n// ---------------------------\n// Tool: schemaGenerationTool helpers\n// ---------------------------\n\ntype SchemaToolSchema = {\n  action?: 'create' | 'update' | 'remove';\n  uid?: string;\n  name?: string;\n  category?: string;\n  kind?: 'collectionType' | 'singleType' | 'component';\n  modelType?: 'component' | 'collectionType' | 'singleType';\n};\n\ntype SchemaToolPart = {\n  type: 'tool-schemaGenerationTool';\n  input?: { schemas?: SchemaToolSchema[] };\n  output?: { schemas?: SchemaToolSchema[]; error?: unknown };\n  toolCallId?: string;\n};\n\nconst isSchemaToolPart = (part: any): part is SchemaToolPart =>\n  part && typeof part === 'object' && part.type === 'tool-schemaGenerationTool';\n\nconst capitalize = (s?: string) => (s ? s.charAt(0).toUpperCase() + s.slice(1) : '');\n\nconst getSchemaLink = (schema: SchemaToolSchema): string | undefined => {\n  const isComponent = (schema.kind ?? schema.modelType) === 'component';\n  if (!schema.uid) return undefined;\n  return isComponent\n    ? `/plugins/content-type-builder/component-categories/${schema.category ?? ''}/${schema.uid}`\n    : `/plugins/content-type-builder/content-types/${schema.uid}`;\n};\n\nconst toMarkerFromSchemaTool = (part: SchemaToolPart): MarkerContentType => {\n  const outSchemas = part.output?.schemas ?? [];\n  const inSchemas = part.input?.schemas ?? [];\n\n  const schemas = (outSchemas.length ? outSchemas : inSchemas) as SchemaToolSchema[];\n  const numSchemas = schemas.length;\n\n  const state: 'loading' | 'success' | 'error' = part.output\n    ? part.output.error\n      ? 'error'\n      : 'success'\n    : 'loading';\n\n  const steps = schemas.map((schema, index) => ({\n    id: `${part.toolCallId ?? 'schemaGenerationTool'}-${schema.uid ?? schema.name ?? index}`,\n    description: capitalize(schema.name ?? schema.uid ?? 'Schema'),\n    status:\n      schema.action === 'create' || schema.action === 'update' || schema.action === 'remove'\n        ? schema.action\n        : ('update' as const),\n    link: getSchemaLink(schema),\n  }));\n\n  const title =\n    state === 'success'\n      ? `Updated ${numSchemas} schema${numSchemas === 1 ? '' : 's'}`\n      : state === 'error'\n        ? `Failed to update schema${numSchemas === 1 ? '' : 's'}`\n        : 'Updating schemas';\n\n  return {\n    type: 'marker',\n    title,\n    state,\n    steps,\n  };\n};\n\nconst MessageContent = ({\n  part,\n}: {\n  part: AIMessage['parts'][number];\n  status?: 'loading' | 'success' | 'error';\n}) => {\n  if (part.type === 'text') {\n    return (\n      <MarkdownStyles>\n        <Markdown\n          components={{\n            a: ({ node, ...props }) => <a target=\"_blank\" rel=\"noopener noreferrer\" {...props} />,\n          }}\n        >\n          {part.text}\n        </Markdown>\n      </MarkdownStyles>\n    );\n  }\n\n  if (isSchemaToolPart(part)) {\n    const marker = toMarkerFromSchemaTool(part);\n    return <Marker {...marker} />;\n  }\n\n  return null;\n};\n\nconst UserMessage = ({ message }: { message: UserMessageType }) => {\n  const hasText = message.parts.some(\n    (content) => content.type === 'text' && content.text.trim() !== ''\n  );\n  const attachments = message.parts.filter((content) => content.type === 'file');\n\n  return (\n    <AnimatedBox\n      as={Flex}\n      direction=\"column\"\n      alignItems=\"flex-end\"\n      style={{ alignSelf: 'flex-end' }}\n      gap={2}\n      maxWidth=\"80%\"\n    >\n      {hasText ? (\n        <Box background=\"neutral150\" borderStyle=\"none\" padding={['10px', '16px']} hasRadius>\n          {message.parts.map((content, index) => {\n            if (content.type !== 'text') return null;\n            return <Typography key={index}>{content.text}</Typography>;\n          })}\n        </Box>\n      ) : null}\n\n      {/* Attachments */}\n      {attachments.map((attachment, idx) => (\n        <AttachmentPreview\n          key={`${attachment.type === 'file' ? attachment.filename : attachment.type}-${idx}`}\n          // eslint-disable-next-line @typescript-eslint/no-explicit-any\n          attachment={{ ...attachment, status: 'ready' } as any}\n        />\n      ))}\n    </AnimatedBox>\n  );\n};\n\nconst AssistantMessage = ({\n  message,\n  isLoading,\n}: {\n  message: AssistantMessageType;\n  isLoading?: boolean;\n}) => {\n  const { upvoteMessage } = useFeedback();\n  const { openFeedbackModal } = useFeedbackModal();\n\n  return (\n    <Box style={{ alignSelf: 'flex-start' }} maxWidth=\"90%\">\n      {message.parts.map((content, index) => (\n        <MessageContent key={index} part={content} />\n      ))}\n      {isLoading ? (\n        <Flex gap={1}>\n          <IconButton\n            label=\"Upvote\"\n            size=\"XS\"\n            variant=\"ghost\"\n            onClick={() => upvoteMessage(message.id)}\n          >\n            <ThumbUp />\n          </IconButton>\n          <IconButton\n            label=\"Downvote\"\n            size=\"XS\"\n            variant=\"ghost\"\n            // For downvoting, user must provide specific feedback\n            onClick={() => openFeedbackModal(message.id)}\n          >\n            <ThumbDown />\n          </IconButton>\n        </Flex>\n      ) : null}\n    </Box>\n  );\n};\n\nexport const ChatMessage = ({\n  message,\n  isLoading,\n}: {\n  message: AIMessage;\n  isLoading?: boolean;\n}) => {\n  /**\n   * IMPORTANT: Messages are rendered using react-markdown (heavy compute)\n   * Component re-renders on each message update, but AI SDK v5 provides\n   * throttling (experimental_throttle: 100ms) which batches updates and reduces\n   * re-render frequency during streaming.\n   */\n  if (message.role === 'user') {\n    return <UserMessage message={message as UserMessageType} />;\n  }\n  return <AssistantMessage message={message as AssistantMessageType} />;\n};\n"],"names":["MarkdownStyles","styled","Typography","theme","colors","neutral100","borderRadius","neutral150","primary500","isSchemaToolPart","part","type","capitalize","s","charAt","toUpperCase","slice","getSchemaLink","schema","isComponent","kind","modelType","uid","undefined","category","toMarkerFromSchemaTool","outSchemas","output","schemas","inSchemas","input","length","numSchemas","state","error","steps","map","index","id","toolCallId","name","description","status","action","link","title","MessageContent","_jsx","Markdown","components","a","node","props","target","rel","text","marker","Marker","UserMessage","message","hasText","parts","some","content","trim","attachments","filter","_jsxs","AnimatedBox","as","Flex","direction","alignItems","style","alignSelf","gap","maxWidth","Box","background","borderStyle","padding","hasRadius","attachment","idx","AttachmentPreview","filename","AssistantMessage","isLoading","upvoteMessage","useFeedback","openFeedbackModal","useFeedbackModal","IconButton","label","size","variant","onClick","ThumbUp","ThumbDown","ChatMessage","role"],"mappings":";;;;;;;;;;;;;AAkBA,MAAMA,cAAAA,GAAiBC,uBAAOC,CAAAA,uBAAAA,CAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBAoCnB,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAACC,UAAU,CAAC;;AAE5C,mBAAA,EAAE,CAAC,EAAEF,KAAK,EAAE,GAAKA,KAAAA,CAAMG,YAAY,CAAC;kBACrC,EAAE,CAAC,EAAEH,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAACG,UAAU,CAAC;;;;;;;;WAQhD,EAAE,CAAC,EAAEJ,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAACI,UAAU,CAAC;sBAC9B,EAAE,CAAC,EAAEL,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAACC,UAAU,CAAC;;AAE5C,mBAAA,EAAE,CAAC,EAAEF,KAAK,EAAE,GAAKA,KAAAA,CAAMG,YAAY,CAAC;kBACrC,EAAE,CAAC,EAAEH,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAACG,UAAU,CAAC;;;;;;;;AAQ3D,CAAC;AAsBD,MAAME,gBAAAA,GAAmB,CAACC,IACxBA,GAAAA,IAAAA,IAAQ,OAAOA,IAAS,KAAA,QAAA,IAAYA,IAAKC,CAAAA,IAAI,KAAK,2BAAA;AAEpD,MAAMC,UAAa,GAAA,CAACC,CAAgBA,GAAAA,CAAAA,GAAIA,CAAEC,CAAAA,MAAM,CAAC,CAAA,CAAA,CAAGC,WAAW,EAAA,GAAKF,CAAEG,CAAAA,KAAK,CAAC,CAAK,CAAA,GAAA,EAAA;AAEjF,MAAMC,gBAAgB,CAACC,MAAAA,GAAAA;IACrB,MAAMC,WAAAA,GAAc,CAACD,MAAAA,CAAOE,IAAI,IAAIF,MAAAA,CAAOG,SAAQ,MAAO,WAAA;AAC1D,IAAA,IAAI,CAACH,MAAAA,CAAOI,GAAG,EAAE,OAAOC,SAAAA;IACxB,OAAOJ,WAAAA,GACH,CAAC,mDAAmD,EAAED,OAAOM,QAAQ,IAAI,GAAG,CAAC,EAAEN,OAAOI,GAAG,CAAC,CAAC,GAC3F,CAAC,4CAA4C,EAAEJ,MAAAA,CAAOI,GAAG,CAAC,CAAC;AACjE,CAAA;AAEA,MAAMG,yBAAyB,CAACf,IAAAA,GAAAA;AAC9B,IAAA,MAAMgB,UAAahB,GAAAA,IAAAA,CAAKiB,MAAM,EAAEC,WAAW,EAAE;AAC7C,IAAA,MAAMC,SAAYnB,GAAAA,IAAAA,CAAKoB,KAAK,EAAEF,WAAW,EAAE;AAE3C,IAAA,MAAMA,OAAWF,GAAAA,UAAAA,CAAWK,MAAM,GAAGL,UAAaG,GAAAA,SAAAA;IAClD,MAAMG,UAAAA,GAAaJ,QAAQG,MAAM;IAEjC,MAAME,KAAAA,GAAyCvB,IAAKiB,CAAAA,MAAM,GACtDjB,IAAAA,CAAKiB,MAAM,CAACO,KAAK,GACf,OAAA,GACA,SACF,GAAA,SAAA;AAEJ,IAAA,MAAMC,QAAQP,OAAQQ,CAAAA,GAAG,CAAC,CAAClB,MAAAA,EAAQmB,SAAW;AAC5CC,YAAAA,EAAAA,EAAI,CAAC,EAAE5B,IAAK6B,CAAAA,UAAU,IAAI,sBAAuB,CAAA,CAAC,EAAErB,MAAAA,CAAOI,GAAG,IAAIJ,MAAAA,CAAOsB,IAAI,IAAIH,MAAM,CAAC;AACxFI,YAAAA,WAAAA,EAAa7B,WAAWM,MAAOsB,CAAAA,IAAI,IAAItB,MAAAA,CAAOI,GAAG,IAAI,QAAA,CAAA;AACrDoB,YAAAA,MAAAA,EACExB,MAAOyB,CAAAA,MAAM,KAAK,QAAA,IAAYzB,OAAOyB,MAAM,KAAK,QAAYzB,IAAAA,MAAAA,CAAOyB,MAAM,KAAK,QAC1EzB,GAAAA,MAAAA,CAAOyB,MAAM,GACZ,QAAA;AACPC,YAAAA,IAAAA,EAAM3B,aAAcC,CAAAA,MAAAA;SACtB,CAAA,CAAA;IAEA,MAAM2B,KAAAA,GACJZ,KAAU,KAAA,SAAA,GACN,CAAC,QAAQ,EAAED,UAAW,CAAA,OAAO,EAAEA,UAAAA,KAAe,CAAI,GAAA,EAAA,GAAK,IAAI,CAAC,GAC5DC,KAAU,KAAA,OAAA,GACR,CAAC,uBAAuB,EAAED,UAAAA,KAAe,CAAI,GAAA,EAAA,GAAK,GAAI,CAAA,CAAC,GACvD,kBAAA;IAER,OAAO;QACLrB,IAAM,EAAA,QAAA;AACNkC,QAAAA,KAAAA;AACAZ,QAAAA,KAAAA;AACAE,QAAAA;AACF,KAAA;AACF,CAAA;AAEA,MAAMW,cAAiB,GAAA,CAAC,EACtBpC,IAAI,EAIL,GAAA;IACC,IAAIA,IAAAA,CAAKC,IAAI,KAAK,MAAQ,EAAA;AACxB,QAAA,qBACEoC,cAAC/C,CAAAA,cAAAA,EAAAA;AACC,YAAA,QAAA,gBAAA+C,cAACC,CAAAA,QAAAA,EAAAA;gBACCC,UAAY,EAAA;AACVC,oBAAAA,CAAAA,EAAG,CAAC,EAAEC,IAAI,EAAE,GAAGC,KAAAA,EAAO,iBAAKL,cAACG,CAAAA,GAAAA,EAAAA;4BAAEG,MAAO,EAAA,QAAA;4BAASC,GAAI,EAAA,qBAAA;AAAuB,4BAAA,GAAGF;;AAC9E,iBAAA;AAEC1C,gBAAAA,QAAAA,EAAAA,IAAAA,CAAK6C;;;AAId;AAEA,IAAA,IAAI9C,iBAAiBC,IAAO,CAAA,EAAA;AAC1B,QAAA,MAAM8C,SAAS/B,sBAAuBf,CAAAA,IAAAA,CAAAA;AACtC,QAAA,qBAAOqC,cAACU,CAAAA,aAAAA,EAAAA;AAAQ,YAAA,GAAGD;;AACrB;IAEA,OAAO,IAAA;AACT,CAAA;AAEA,MAAME,WAAc,GAAA,CAAC,EAAEC,OAAO,EAAgC,GAAA;AAC5D,IAAA,MAAMC,UAAUD,OAAQE,CAAAA,KAAK,CAACC,IAAI,CAChC,CAACC,OAAAA,GAAYA,OAAQpD,CAAAA,IAAI,KAAK,MAAUoD,IAAAA,OAAAA,CAAQR,IAAI,CAACS,IAAI,EAAO,KAAA,EAAA,CAAA;IAElE,MAAMC,WAAAA,GAAcN,OAAQE,CAAAA,KAAK,CAACK,MAAM,CAAC,CAACH,OAAAA,GAAYA,OAAQpD,CAAAA,IAAI,KAAK,MAAA,CAAA;AAEvE,IAAA,qBACEwD,eAACC,CAAAA,uBAAAA,EAAAA;QACCC,EAAIC,EAAAA,iBAAAA;QACJC,SAAU,EAAA,QAAA;QACVC,UAAW,EAAA,UAAA;QACXC,KAAO,EAAA;YAAEC,SAAW,EAAA;AAAW,SAAA;QAC/BC,GAAK,EAAA,CAAA;QACLC,QAAS,EAAA,KAAA;;AAERhB,YAAAA,OAAAA,iBACCb,cAAC8B,CAAAA,gBAAAA,EAAAA;gBAAIC,UAAW,EAAA,YAAA;gBAAaC,WAAY,EAAA,MAAA;gBAAOC,OAAS,EAAA;AAAC,oBAAA,MAAA;AAAQ,oBAAA;AAAO,iBAAA;gBAAEC,SAAS,EAAA,IAAA;AACjFtB,gBAAAA,QAAAA,EAAAA,OAAAA,CAAQE,KAAK,CAACzB,GAAG,CAAC,CAAC2B,OAAS1B,EAAAA,KAAAA,GAAAA;AAC3B,oBAAA,IAAI0B,OAAQpD,CAAAA,IAAI,KAAK,MAAA,EAAQ,OAAO,IAAA;AACpC,oBAAA,qBAAOoC,cAAC7C,CAAAA,uBAAAA,EAAAA;AAAwB6D,wBAAAA,QAAAA,EAAAA,OAAAA,CAAQR;AAAhBlB,qBAAAA,EAAAA,KAAAA,CAAAA;AAC1B,iBAAA;AAEA,aAAA,CAAA,GAAA,IAAA;AAGH4B,YAAAA,WAAAA,CAAY7B,GAAG,CAAC,CAAC8C,UAAAA,EAAYC,oBAC5BpC,cAACqC,CAAAA,mCAAAA,EAAAA;;oBAGCF,UAAY,EAAA;AAAE,wBAAA,GAAGA,UAAU;wBAAExC,MAAQ,EAAA;AAAQ;AAFxC,iBAAA,EAAA,CAAC,EAAEwC,UAAAA,CAAWvE,IAAI,KAAK,SAASuE,UAAWG,CAAAA,QAAQ,GAAGH,UAAAA,CAAWvE,IAAI,CAAC,CAAC,EAAEwE,IAAI,CAAC,CAAA;;;AAO7F,CAAA;AAEA,MAAMG,mBAAmB,CAAC,EACxB3B,OAAO,EACP4B,SAAS,EAIV,GAAA;IACC,MAAM,EAAEC,aAAa,EAAE,GAAGC,uBAAAA,EAAAA;IAC1B,MAAM,EAAEC,iBAAiB,EAAE,GAAGC,8BAAAA,EAAAA;AAE9B,IAAA,qBACExB,eAACU,CAAAA,gBAAAA,EAAAA;QAAIJ,KAAO,EAAA;YAAEC,SAAW,EAAA;AAAa,SAAA;QAAGE,QAAS,EAAA,KAAA;;AAC/CjB,YAAAA,OAAAA,CAAQE,KAAK,CAACzB,GAAG,CAAC,CAAC2B,OAAAA,EAAS1B,sBAC3BU,cAACD,CAAAA,cAAAA,EAAAA;oBAA2BpC,IAAMqD,EAAAA;AAAb1B,iBAAAA,EAAAA,KAAAA,CAAAA,CAAAA;AAEtBkD,YAAAA,SAAAA,iBACCpB,eAACG,CAAAA,iBAAAA,EAAAA;gBAAKK,GAAK,EAAA,CAAA;;kCACT5B,cAAC6C,CAAAA,uBAAAA,EAAAA;wBACCC,KAAM,EAAA,QAAA;wBACNC,IAAK,EAAA,IAAA;wBACLC,OAAQ,EAAA,OAAA;wBACRC,OAAS,EAAA,IAAMR,aAAc7B,CAAAA,OAAAA,CAAQrB,EAAE,CAAA;AAEvC,wBAAA,QAAA,gBAAAS,cAACkD,CAAAA,aAAAA,EAAAA,EAAAA;;kCAEHlD,cAAC6C,CAAAA,uBAAAA,EAAAA;wBACCC,KAAM,EAAA,UAAA;wBACNC,IAAK,EAAA,IAAA;wBACLC,OAAQ,EAAA,OAAA;;wBAERC,OAAS,EAAA,IAAMN,iBAAkB/B,CAAAA,OAAAA,CAAQrB,EAAE,CAAA;AAE3C,wBAAA,QAAA,gBAAAS,cAACmD,CAAAA,eAAAA,EAAAA,EAAAA;;;AAGH,aAAA,CAAA,GAAA;;;AAGV,CAAA;MAEaC,WAAc,GAAA,CAAC,EAC1BxC,OAAO,EACP4B,SAAS,EAIV,GAAA;AACC;;;;;AAKC,MACD,IAAI5B,OAAAA,CAAQyC,IAAI,KAAK,MAAQ,EAAA;AAC3B,QAAA,qBAAOrD,cAACW,CAAAA,WAAAA,EAAAA;YAAYC,OAASA,EAAAA;;AAC/B;AACA,IAAA,qBAAOZ,cAACuC,CAAAA,gBAAAA,EAAAA;QAAiB3B,OAASA,EAAAA;;AACpC;;;;"}

package/dist/admin/components/AIChat/components/Messages/Message.mjs

@@ -0,0 +1,212 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Typography, Flex, Box, IconButton } from '@strapi/design-system';
+import { ThumbUp, ThumbDown } from '@strapi/icons';
+import Markdown from 'react-markdown';
+import { styled } from 'styled-components';
+import { useFeedbackModal } from '../../FeedbackModal.mjs';
+import { useFeedback } from '../../hooks/useFeedback.mjs';
+import { AnimatedBox } from '../AnimatedBox.mjs';
+import { AttachmentPreview } from '../Attachments/AttachmentPreview.mjs';
+import { Marker } from './Marker.mjs';
+
+const MarkdownStyles = styled(Typography)`
+  max-width: 65ch;
+  margin: 0 auto;
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    margin-top: 1.25em;
+    margin-bottom: 0.5em;
+    font-weight: bold;
+  }
+
+  p {
+    margin-bottom: 1em;
+  }
+
+  ul,
+  ol {
+    padding-left: 1.5em; /* indentation for bullet points */
+    margin-bottom: 1em;
+  }
+
+  li {
+    margin-bottom: 0.5em;
+    list-style-type: disc; /* or whatever style you prefer */
+  }
+
+  strong {
+    font-weight: bold;
+  }
+
+  /* code blocks, blockquotes, etc. */
+  code {
+    background-color: ${({ theme })=>theme.colors.neutral100};
+    padding: 0.2em 0.4em;
+    border-radius: ${({ theme })=>theme.borderRadius};
+    border-color: ${({ theme })=>theme.colors.neutral150};
+    border-style: solid;
+    font-family: 'SF Mono', SFMono-Regular, ui-monospace, 'DejaVu Sans Mono', Menlo, Consolas,
+      monospace;
+  }
+
+  /* links */
+  a {
+    color: ${({ theme })=>theme.colors.primary500};
+    background-color: ${({ theme })=>theme.colors.neutral100};
+    padding: 0.2em 0.4em;
+    border-radius: ${({ theme })=>theme.borderRadius};
+    border-color: ${({ theme })=>theme.colors.neutral150};
+    border-style: solid;
+    text-decoration: none;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+`;
+const isSchemaToolPart = (part)=>part && typeof part === 'object' && part.type === 'tool-schemaGenerationTool';
+const capitalize = (s)=>s ? s.charAt(0).toUpperCase() + s.slice(1) : '';
+const getSchemaLink = (schema)=>{
+    const isComponent = (schema.kind ?? schema.modelType) === 'component';
+    if (!schema.uid) return undefined;
+    return isComponent ? `/plugins/content-type-builder/component-categories/${schema.category ?? ''}/${schema.uid}` : `/plugins/content-type-builder/content-types/${schema.uid}`;
+};
+const toMarkerFromSchemaTool = (part)=>{
+    const outSchemas = part.output?.schemas ?? [];
+    const inSchemas = part.input?.schemas ?? [];
+    const schemas = outSchemas.length ? outSchemas : inSchemas;
+    const numSchemas = schemas.length;
+    const state = part.output ? part.output.error ? 'error' : 'success' : 'loading';
+    const steps = schemas.map((schema, index)=>({
+            id: `${part.toolCallId ?? 'schemaGenerationTool'}-${schema.uid ?? schema.name ?? index}`,
+            description: capitalize(schema.name ?? schema.uid ?? 'Schema'),
+            status: schema.action === 'create' || schema.action === 'update' || schema.action === 'remove' ? schema.action : 'update',
+            link: getSchemaLink(schema)
+        }));
+    const title = state === 'success' ? `Updated ${numSchemas} schema${numSchemas === 1 ? '' : 's'}` : state === 'error' ? `Failed to update schema${numSchemas === 1 ? '' : 's'}` : 'Updating schemas';
+    return {
+        type: 'marker',
+        title,
+        state,
+        steps
+    };
+};
+const MessageContent = ({ part })=>{
+    if (part.type === 'text') {
+        return /*#__PURE__*/ jsx(MarkdownStyles, {
+            children: /*#__PURE__*/ jsx(Markdown, {
+                components: {
+                    a: ({ node, ...props })=>/*#__PURE__*/ jsx("a", {
+                            target: "_blank",
+                            rel: "noopener noreferrer",
+                            ...props
+                        })
+                },
+                children: part.text
+            })
+        });
+    }
+    if (isSchemaToolPart(part)) {
+        const marker = toMarkerFromSchemaTool(part);
+        return /*#__PURE__*/ jsx(Marker, {
+            ...marker
+        });
+    }
+    return null;
+};
+const UserMessage = ({ message })=>{
+    const hasText = message.parts.some((content)=>content.type === 'text' && content.text.trim() !== '');
+    const attachments = message.parts.filter((content)=>content.type === 'file');
+    return /*#__PURE__*/ jsxs(AnimatedBox, {
+        as: Flex,
+        direction: "column",
+        alignItems: "flex-end",
+        style: {
+            alignSelf: 'flex-end'
+        },
+        gap: 2,
+        maxWidth: "80%",
+        children: [
+            hasText ? /*#__PURE__*/ jsx(Box, {
+                background: "neutral150",
+                borderStyle: "none",
+                padding: [
+                    '10px',
+                    '16px'
+                ],
+                hasRadius: true,
+                children: message.parts.map((content, index)=>{
+                    if (content.type !== 'text') return null;
+                    return /*#__PURE__*/ jsx(Typography, {
+                        children: content.text
+                    }, index);
+                })
+            }) : null,
+            attachments.map((attachment, idx)=>/*#__PURE__*/ jsx(AttachmentPreview, {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    attachment: {
+                        ...attachment,
+                        status: 'ready'
+                    }
+                }, `${attachment.type === 'file' ? attachment.filename : attachment.type}-${idx}`))
+        ]
+    });
+};
+const AssistantMessage = ({ message, isLoading })=>{
+    const { upvoteMessage } = useFeedback();
+    const { openFeedbackModal } = useFeedbackModal();
+    return /*#__PURE__*/ jsxs(Box, {
+        style: {
+            alignSelf: 'flex-start'
+        },
+        maxWidth: "90%",
+        children: [
+            message.parts.map((content, index)=>/*#__PURE__*/ jsx(MessageContent, {
+                    part: content
+                }, index)),
+            isLoading ? /*#__PURE__*/ jsxs(Flex, {
+                gap: 1,
+                children: [
+                    /*#__PURE__*/ jsx(IconButton, {
+                        label: "Upvote",
+                        size: "XS",
+                        variant: "ghost",
+                        onClick: ()=>upvoteMessage(message.id),
+                        children: /*#__PURE__*/ jsx(ThumbUp, {})
+                    }),
+                    /*#__PURE__*/ jsx(IconButton, {
+                        label: "Downvote",
+                        size: "XS",
+                        variant: "ghost",
+                        // For downvoting, user must provide specific feedback
+                        onClick: ()=>openFeedbackModal(message.id),
+                        children: /*#__PURE__*/ jsx(ThumbDown, {})
+                    })
+                ]
+            }) : null
+        ]
+    });
+};
+const ChatMessage = ({ message, isLoading })=>{
+    /**
+   * IMPORTANT: Messages are rendered using react-markdown (heavy compute)
+   * Component re-renders on each message update, but AI SDK v5 provides
+   * throttling (experimental_throttle: 100ms) which batches updates and reduces
+   * re-render frequency during streaming.
+   */ if (message.role === 'user') {
+        return /*#__PURE__*/ jsx(UserMessage, {
+            message: message
+        });
+    }
+    return /*#__PURE__*/ jsx(AssistantMessage, {
+        message: message
+    });
+};
+
+export { ChatMessage };
+//# sourceMappingURL=Message.mjs.map

package/dist/admin/components/AIChat/components/Messages/Message.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.mjs","sources":["../../../../../../admin/src/components/AIChat/components/Messages/Message.tsx"],"sourcesContent":["import { Typography, Box, IconButton, Flex } from '@strapi/design-system';\nimport { ThumbUp, ThumbDown } from '@strapi/icons';\nimport Markdown from 'react-markdown';\nimport { styled } from 'styled-components';\n\nimport { useFeedbackModal } from '../../FeedbackModal';\nimport { useFeedback } from '../../hooks/useFeedback';\nimport {\n  AIMessage,\n  type UserMessage as UserMessageType,\n  AssistantMessage as AssistantMessageType,\n  type MarkerContent as MarkerContentType,\n} from '../../lib/types/messages';\nimport { AnimatedBox } from '../AnimatedBox';\nimport { AttachmentPreview } from '../Attachments/AttachmentPreview';\n\nimport { Marker } from './Marker';\n\nconst MarkdownStyles = styled(Typography)`\n  max-width: 65ch;\n  margin: 0 auto;\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin-top: 1.25em;\n    margin-bottom: 0.5em;\n    font-weight: bold;\n  }\n\n  p {\n    margin-bottom: 1em;\n  }\n\n  ul,\n  ol {\n    padding-left: 1.5em; /* indentation for bullet points */\n    margin-bottom: 1em;\n  }\n\n  li {\n    margin-bottom: 0.5em;\n    list-style-type: disc; /* or whatever style you prefer */\n  }\n\n  strong {\n    font-weight: bold;\n  }\n\n  /* code blocks, blockquotes, etc. */\n  code {\n    background-color: ${({ theme }) => theme.colors.neutral100};\n    padding: 0.2em 0.4em;\n    border-radius: ${({ theme }) => theme.borderRadius};\n    border-color: ${({ theme }) => theme.colors.neutral150};\n    border-style: solid;\n    font-family: 'SF Mono', SFMono-Regular, ui-monospace, 'DejaVu Sans Mono', Menlo, Consolas,\n      monospace;\n  }\n\n  /* links */\n  a {\n    color: ${({ theme }) => theme.colors.primary500};\n    background-color: ${({ theme }) => theme.colors.neutral100};\n    padding: 0.2em 0.4em;\n    border-radius: ${({ theme }) => theme.borderRadius};\n    border-color: ${({ theme }) => theme.colors.neutral150};\n    border-style: solid;\n    text-decoration: none;\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n`;\n\n// ---------------------------\n// Tool: schemaGenerationTool helpers\n// ---------------------------\n\ntype SchemaToolSchema = {\n  action?: 'create' | 'update' | 'remove';\n  uid?: string;\n  name?: string;\n  category?: string;\n  kind?: 'collectionType' | 'singleType' | 'component';\n  modelType?: 'component' | 'collectionType' | 'singleType';\n};\n\ntype SchemaToolPart = {\n  type: 'tool-schemaGenerationTool';\n  input?: { schemas?: SchemaToolSchema[] };\n  output?: { schemas?: SchemaToolSchema[]; error?: unknown };\n  toolCallId?: string;\n};\n\nconst isSchemaToolPart = (part: any): part is SchemaToolPart =>\n  part && typeof part === 'object' && part.type === 'tool-schemaGenerationTool';\n\nconst capitalize = (s?: string) => (s ? s.charAt(0).toUpperCase() + s.slice(1) : '');\n\nconst getSchemaLink = (schema: SchemaToolSchema): string | undefined => {\n  const isComponent = (schema.kind ?? schema.modelType) === 'component';\n  if (!schema.uid) return undefined;\n  return isComponent\n    ? `/plugins/content-type-builder/component-categories/${schema.category ?? ''}/${schema.uid}`\n    : `/plugins/content-type-builder/content-types/${schema.uid}`;\n};\n\nconst toMarkerFromSchemaTool = (part: SchemaToolPart): MarkerContentType => {\n  const outSchemas = part.output?.schemas ?? [];\n  const inSchemas = part.input?.schemas ?? [];\n\n  const schemas = (outSchemas.length ? outSchemas : inSchemas) as SchemaToolSchema[];\n  const numSchemas = schemas.length;\n\n  const state: 'loading' | 'success' | 'error' = part.output\n    ? part.output.error\n      ? 'error'\n      : 'success'\n    : 'loading';\n\n  const steps = schemas.map((schema, index) => ({\n    id: `${part.toolCallId ?? 'schemaGenerationTool'}-${schema.uid ?? schema.name ?? index}`,\n    description: capitalize(schema.name ?? schema.uid ?? 'Schema'),\n    status:\n      schema.action === 'create' || schema.action === 'update' || schema.action === 'remove'\n        ? schema.action\n        : ('update' as const),\n    link: getSchemaLink(schema),\n  }));\n\n  const title =\n    state === 'success'\n      ? `Updated ${numSchemas} schema${numSchemas === 1 ? '' : 's'}`\n      : state === 'error'\n        ? `Failed to update schema${numSchemas === 1 ? '' : 's'}`\n        : 'Updating schemas';\n\n  return {\n    type: 'marker',\n    title,\n    state,\n    steps,\n  };\n};\n\nconst MessageContent = ({\n  part,\n}: {\n  part: AIMessage['parts'][number];\n  status?: 'loading' | 'success' | 'error';\n}) => {\n  if (part.type === 'text') {\n    return (\n      <MarkdownStyles>\n        <Markdown\n          components={{\n            a: ({ node, ...props }) => <a target=\"_blank\" rel=\"noopener noreferrer\" {...props} />,\n          }}\n        >\n          {part.text}\n        </Markdown>\n      </MarkdownStyles>\n    );\n  }\n\n  if (isSchemaToolPart(part)) {\n    const marker = toMarkerFromSchemaTool(part);\n    return <Marker {...marker} />;\n  }\n\n  return null;\n};\n\nconst UserMessage = ({ message }: { message: UserMessageType }) => {\n  const hasText = message.parts.some(\n    (content) => content.type === 'text' && content.text.trim() !== ''\n  );\n  const attachments = message.parts.filter((content) => content.type === 'file');\n\n  return (\n    <AnimatedBox\n      as={Flex}\n      direction=\"column\"\n      alignItems=\"flex-end\"\n      style={{ alignSelf: 'flex-end' }}\n      gap={2}\n      maxWidth=\"80%\"\n    >\n      {hasText ? (\n        <Box background=\"neutral150\" borderStyle=\"none\" padding={['10px', '16px']} hasRadius>\n          {message.parts.map((content, index) => {\n            if (content.type !== 'text') return null;\n            return <Typography key={index}>{content.text}</Typography>;\n          })}\n        </Box>\n      ) : null}\n\n      {/* Attachments */}\n      {attachments.map((attachment, idx) => (\n        <AttachmentPreview\n          key={`${attachment.type === 'file' ? attachment.filename : attachment.type}-${idx}`}\n          // eslint-disable-next-line @typescript-eslint/no-explicit-any\n          attachment={{ ...attachment, status: 'ready' } as any}\n        />\n      ))}\n    </AnimatedBox>\n  );\n};\n\nconst AssistantMessage = ({\n  message,\n  isLoading,\n}: {\n  message: AssistantMessageType;\n  isLoading?: boolean;\n}) => {\n  const { upvoteMessage } = useFeedback();\n  const { openFeedbackModal } = useFeedbackModal();\n\n  return (\n    <Box style={{ alignSelf: 'flex-start' }} maxWidth=\"90%\">\n      {message.parts.map((content, index) => (\n        <MessageContent key={index} part={content} />\n      ))}\n      {isLoading ? (\n        <Flex gap={1}>\n          <IconButton\n            label=\"Upvote\"\n            size=\"XS\"\n            variant=\"ghost\"\n            onClick={() => upvoteMessage(message.id)}\n          >\n            <ThumbUp />\n          </IconButton>\n          <IconButton\n            label=\"Downvote\"\n            size=\"XS\"\n            variant=\"ghost\"\n            // For downvoting, user must provide specific feedback\n            onClick={() => openFeedbackModal(message.id)}\n          >\n            <ThumbDown />\n          </IconButton>\n        </Flex>\n      ) : null}\n    </Box>\n  );\n};\n\nexport const ChatMessage = ({\n  message,\n  isLoading,\n}: {\n  message: AIMessage;\n  isLoading?: boolean;\n}) => {\n  /**\n   * IMPORTANT: Messages are rendered using react-markdown (heavy compute)\n   * Component re-renders on each message update, but AI SDK v5 provides\n   * throttling (experimental_throttle: 100ms) which batches updates and reduces\n   * re-render frequency during streaming.\n   */\n  if (message.role === 'user') {\n    return <UserMessage message={message as UserMessageType} />;\n  }\n  return <AssistantMessage message={message as AssistantMessageType} />;\n};\n"],"names":["MarkdownStyles","styled","Typography","theme","colors","neutral100","borderRadius","neutral150","primary500","isSchemaToolPart","part","type","capitalize","s","charAt","toUpperCase","slice","getSchemaLink","schema","isComponent","kind","modelType","uid","undefined","category","toMarkerFromSchemaTool","outSchemas","output","schemas","inSchemas","input","length","numSchemas","state","error","steps","map","index","id","toolCallId","name","description","status","action","link","title","MessageContent","_jsx","Markdown","components","a","node","props","target","rel","text","marker","Marker","UserMessage","message","hasText","parts","some","content","trim","attachments","filter","_jsxs","AnimatedBox","as","Flex","direction","alignItems","style","alignSelf","gap","maxWidth","Box","background","borderStyle","padding","hasRadius","attachment","idx","AttachmentPreview","filename","AssistantMessage","isLoading","upvoteMessage","useFeedback","openFeedbackModal","useFeedbackModal","IconButton","label","size","variant","onClick","ThumbUp","ThumbDown","ChatMessage","role"],"mappings":"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"}

package/dist/admin/components/AIChat/components/ResizableTextArea.js

@@ -0,0 +1,78 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var designSystem = require('@strapi/design-system');
+var styledComponents = require('styled-components');
+
+const TextAreaElement = styledComponents.styled(designSystem.Box).attrs({
+    as: 'textarea'
+})`
+  border: none;
+  resize: none;
+  background: transparent;
+  outline: none !important;
+  width: 100%;
+  min-height: 44px;
+  max-height: 160px;
+  line-height: ${({ theme })=>theme.lineHeights[4]};
+  font-size: ${({ theme })=>theme.fontSizes[2]};
+  color: ${({ theme })=>theme.colors.neutral800};
+  padding-bottom: ${({ theme })=>theme.spaces[1]};
+  overflow-y: auto;
+
+  /* Show partial lines when content exceeds visible area */
+  height: ${({ rows, theme })=>rows === 5 ? `calc(${rows} * ${theme.lineHeights[4]} * 1em + 0.7em)` : `calc(${rows} * ${theme.lineHeights[4]} * 1em)`};
+
+  &:disabled,
+  &::placeholder {
+    color: ${({ theme })=>theme.colors.neutral600};
+  }
+`;
+const ResizableTextArea = ({ value, onChange, onSubmit, placeholder })=>{
+    const textareaRef = React.useRef(null);
+    const [rows, setRows] = React.useState(1);
+    const calculateRows = (text)=>{
+        if (!text) return 1;
+        // Count newlines in the text
+        const lineCount = (text.match(/\n/g) || []).length + 1;
+        // Limit to a maximum of 5 rows
+        return Math.min(lineCount, 5);
+    };
+    // Update rows when value changes
+    React.useEffect(()=>{
+        setRows(calculateRows(value));
+    }, [
+        value
+    ]);
+    const handleKeyDown = (e)=>{
+        if (!textareaRef.current?.value.trim()) {
+            return;
+        }
+        if (e.key === 'Enter' && !e.shiftKey && onSubmit) {
+            e.preventDefault();
+            onSubmit(e);
+            // Ensure focus is maintained after submission using a small delay
+            // This helps ensure the focus happens after any other effects from submission
+            setTimeout(()=>{
+                textareaRef.current?.focus();
+            }, 10);
+        }
+    };
+    React.useEffect(()=>{
+        textareaRef.current?.focus();
+    }, [
+        textareaRef
+    ]);
+    return /*#__PURE__*/ jsxRuntime.jsx(TextAreaElement, {
+        ref: textareaRef,
+        value: value,
+        onChange: onChange,
+        onKeyDown: handleKeyDown,
+        placeholder: placeholder,
+        rows: rows
+    });
+};
+
+exports.ResizableTextArea = ResizableTextArea;
+//# sourceMappingURL=ResizableTextArea.js.map

package/dist/admin/components/AIChat/components/ResizableTextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizableTextArea.js","sources":["../../../../../admin/src/components/AIChat/components/ResizableTextArea.tsx"],"sourcesContent":["import { useRef, useEffect, useState } from 'react';\n\nimport { Box } from '@strapi/design-system';\nimport { styled } from 'styled-components';\n\ninterface TextAreaProps {\n  value: string;\n  onChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  onSubmit?: (e: React.FormEvent<HTMLFormElement>) => void;\n  placeholder?: string;\n}\n\nconst TextAreaElement = styled(Box).attrs({ as: 'textarea' })`\n  border: none;\n  resize: none;\n  background: transparent;\n  outline: none !important;\n  width: 100%;\n  min-height: 44px;\n  max-height: 160px;\n  line-height: ${({ theme }) => theme.lineHeights[4]};\n  font-size: ${({ theme }) => theme.fontSizes[2]};\n  color: ${({ theme }) => theme.colors.neutral800};\n  padding-bottom: ${({ theme }) => theme.spaces[1]};\n  overflow-y: auto;\n\n  /* Show partial lines when content exceeds visible area */\n  height: ${({ rows, theme }) =>\n    rows === 5\n      ? `calc(${rows} * ${theme.lineHeights[4]} * 1em + 0.7em)`\n      : `calc(${rows} * ${theme.lineHeights[4]} * 1em)`};\n\n  &:disabled,\n  &::placeholder {\n    color: ${({ theme }) => theme.colors.neutral600};\n  }\n`;\n\nexport const ResizableTextArea = ({ value, onChange, onSubmit, placeholder }: TextAreaProps) => {\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const [rows, setRows] = useState(1);\n\n  const calculateRows = (text: string) => {\n    if (!text) return 1;\n    // Count newlines in the text\n    const lineCount = (text.match(/\\n/g) || []).length + 1;\n    // Limit to a maximum of 5 rows\n    return Math.min(lineCount, 5);\n  };\n\n  // Update rows when value changes\n  useEffect(() => {\n    setRows(calculateRows(value));\n  }, [value]);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n    if (!textareaRef.current?.value.trim()) {\n      return;\n    }\n\n    if (e.key === 'Enter' && !e.shiftKey && onSubmit) {\n      e.preventDefault();\n      onSubmit(e as unknown as React.FormEvent<HTMLFormElement>);\n      // Ensure focus is maintained after submission using a small delay\n      // This helps ensure the focus happens after any other effects from submission\n      setTimeout(() => {\n        textareaRef.current?.focus();\n      }, 10);\n    }\n  };\n\n  useEffect(() => {\n    textareaRef.current?.focus();\n  }, [textareaRef]);\n\n  return (\n    <TextAreaElement\n      ref={textareaRef}\n      value={value}\n      onChange={onChange}\n      onKeyDown={handleKeyDown}\n      placeholder={placeholder}\n      rows={rows}\n    />\n  );\n};\n"],"names":["TextAreaElement","styled","Box","attrs","as","theme","lineHeights","fontSizes","colors","neutral800","spaces","rows","neutral600","ResizableTextArea","value","onChange","onSubmit","placeholder","textareaRef","useRef","setRows","useState","calculateRows","text","lineCount","match","length","Math","min","useEffect","handleKeyDown","e","current","trim","key","shiftKey","preventDefault","setTimeout","focus","_jsx","ref","onKeyDown"],"mappings":";;;;;;;AAYA,MAAMA,eAAkBC,GAAAA,uBAAAA,CAAOC,gBAAKC,CAAAA,CAAAA,KAAK,CAAC;IAAEC,EAAI,EAAA;AAAW,CAAA,CAAE;;;;;;;;eAQ9C,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAMC,CAAAA,WAAW,CAAC,CAAA,CAAE,CAAC;aACxC,EAAE,CAAC,EAAED,KAAK,EAAE,GAAKA,KAAME,CAAAA,SAAS,CAAC,CAAA,CAAE,CAAC;SACxC,EAAE,CAAC,EAAEF,KAAK,EAAE,GAAKA,KAAMG,CAAAA,MAAM,CAACC,UAAU,CAAC;kBAChC,EAAE,CAAC,EAAEJ,KAAK,EAAE,GAAKA,KAAMK,CAAAA,MAAM,CAAC,CAAA,CAAE,CAAC;;;;AAIzC,UAAA,EAAE,CAAC,EAAEC,IAAI,EAAEN,KAAK,EAAE,GACxBM,IAAAA,KAAS,CACL,GAAA,CAAC,KAAK,EAAEA,IAAAA,CAAK,GAAG,EAAEN,MAAMC,WAAW,CAAC,CAAE,CAAA,CAAC,eAAe,CAAC,GACvD,CAAC,KAAK,EAAEK,IAAK,CAAA,GAAG,EAAEN,KAAAA,CAAMC,WAAW,CAAC,CAAA,CAAE,CAAC,OAAO,CAAC,CAAC;;;;WAI7C,EAAE,CAAC,EAAED,KAAK,EAAE,GAAKA,KAAMG,CAAAA,MAAM,CAACI,UAAU,CAAC;;AAEpD,CAAC;AAEM,MAAMC,iBAAoB,GAAA,CAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,WAAW,EAAiB,GAAA;AACzF,IAAA,MAAMC,cAAcC,YAA4B,CAAA,IAAA,CAAA;AAChD,IAAA,MAAM,CAACR,IAAAA,EAAMS,OAAQ,CAAA,GAAGC,cAAS,CAAA,CAAA,CAAA;AAEjC,IAAA,MAAMC,gBAAgB,CAACC,IAAAA,GAAAA;QACrB,IAAI,CAACA,MAAM,OAAO,CAAA;;QAElB,MAAMC,SAAAA,GAAY,CAACD,IAAKE,CAAAA,KAAK,CAAC,KAAA,CAAA,IAAU,EAAC,EAAGC,MAAM,GAAG,CAAA;;QAErD,OAAOC,IAAAA,CAAKC,GAAG,CAACJ,SAAW,EAAA,CAAA,CAAA;AAC7B,KAAA;;IAGAK,eAAU,CAAA,IAAA;AACRT,QAAAA,OAAAA,CAAQE,aAAcR,CAAAA,KAAAA,CAAAA,CAAAA;KACrB,EAAA;AAACA,QAAAA;AAAM,KAAA,CAAA;AAEV,IAAA,MAAMgB,gBAAgB,CAACC,CAAAA,GAAAA;AACrB,QAAA,IAAI,CAACb,WAAAA,CAAYc,OAAO,EAAElB,MAAMmB,IAAQ,EAAA,EAAA;AACtC,YAAA;AACF;QAEA,IAAIF,CAAAA,CAAEG,GAAG,KAAK,OAAA,IAAW,CAACH,CAAEI,CAAAA,QAAQ,IAAInB,QAAU,EAAA;AAChDe,YAAAA,CAAAA,CAAEK,cAAc,EAAA;YAChBpB,QAASe,CAAAA,CAAAA,CAAAA;;;YAGTM,UAAW,CAAA,IAAA;AACTnB,gBAAAA,WAAAA,CAAYc,OAAO,EAAEM,KAAAA,EAAAA;aACpB,EAAA,EAAA,CAAA;AACL;AACF,KAAA;IAEAT,eAAU,CAAA,IAAA;AACRX,QAAAA,WAAAA,CAAYc,OAAO,EAAEM,KAAAA,EAAAA;KACpB,EAAA;AAACpB,QAAAA;AAAY,KAAA,CAAA;AAEhB,IAAA,qBACEqB,cAACvC,CAAAA,eAAAA,EAAAA;QACCwC,GAAKtB,EAAAA,WAAAA;QACLJ,KAAOA,EAAAA,KAAAA;QACPC,QAAUA,EAAAA,QAAAA;QACV0B,SAAWX,EAAAA,aAAAA;QACXb,WAAaA,EAAAA,WAAAA;QACbN,IAAMA,EAAAA;;AAGZ;;;;"}

package/dist/admin/components/AIChat/components/ResizableTextArea.mjs

@@ -0,0 +1,76 @@
+import { jsx } from 'react/jsx-runtime';
+import { useRef, useState, useEffect } from 'react';
+import { Box } from '@strapi/design-system';
+import { styled } from 'styled-components';
+
+const TextAreaElement = styled(Box).attrs({
+    as: 'textarea'
+})`
+  border: none;
+  resize: none;
+  background: transparent;
+  outline: none !important;
+  width: 100%;
+  min-height: 44px;
+  max-height: 160px;
+  line-height: ${({ theme })=>theme.lineHeights[4]};
+  font-size: ${({ theme })=>theme.fontSizes[2]};
+  color: ${({ theme })=>theme.colors.neutral800};
+  padding-bottom: ${({ theme })=>theme.spaces[1]};
+  overflow-y: auto;
+
+  /* Show partial lines when content exceeds visible area */
+  height: ${({ rows, theme })=>rows === 5 ? `calc(${rows} * ${theme.lineHeights[4]} * 1em + 0.7em)` : `calc(${rows} * ${theme.lineHeights[4]} * 1em)`};
+
+  &:disabled,
+  &::placeholder {
+    color: ${({ theme })=>theme.colors.neutral600};
+  }
+`;
+const ResizableTextArea = ({ value, onChange, onSubmit, placeholder })=>{
+    const textareaRef = useRef(null);
+    const [rows, setRows] = useState(1);
+    const calculateRows = (text)=>{
+        if (!text) return 1;
+        // Count newlines in the text
+        const lineCount = (text.match(/\n/g) || []).length + 1;
+        // Limit to a maximum of 5 rows
+        return Math.min(lineCount, 5);
+    };
+    // Update rows when value changes
+    useEffect(()=>{
+        setRows(calculateRows(value));
+    }, [
+        value
+    ]);
+    const handleKeyDown = (e)=>{
+        if (!textareaRef.current?.value.trim()) {
+            return;
+        }
+        if (e.key === 'Enter' && !e.shiftKey && onSubmit) {
+            e.preventDefault();
+            onSubmit(e);
+            // Ensure focus is maintained after submission using a small delay
+            // This helps ensure the focus happens after any other effects from submission
+            setTimeout(()=>{
+                textareaRef.current?.focus();
+            }, 10);
+        }
+    };
+    useEffect(()=>{
+        textareaRef.current?.focus();
+    }, [
+        textareaRef
+    ]);
+    return /*#__PURE__*/ jsx(TextAreaElement, {
+        ref: textareaRef,
+        value: value,
+        onChange: onChange,
+        onKeyDown: handleKeyDown,
+        placeholder: placeholder,
+        rows: rows
+    });
+};
+
+export { ResizableTextArea };
+//# sourceMappingURL=ResizableTextArea.mjs.map