listpage-next 0.0.237 → 0.0.238

package/dist/features/ChatClient/ui/Bubble/Bubble.d.ts

@@ -11,7 +11,8 @@ export type BubbleProps = {
     references?: ReferenceListProps['references'];
     placement?: 'start' | 'end';
     role?: 'user' | 'assistant';
-    markdownRender?: (text: string) => ReactNode;
+    status?: 'pending' | 'success' | 'error';
+    markdownRender?: (text: string, status: BubbleProps['status']) => ReactNode;
     reasoningMarkdownRender?: (text: string) => ReactNode;
 };
 export declare const Bubble: (props: BubbleProps) => import("react/jsx-runtime").JSX.Element;

package/dist/features/ChatClient/ui/Bubble/Bubble.js

@@ -6,16 +6,17 @@ import { Markdown } from "./Markdown.js";
 import { Reasoning } from "./Reasoning.js";
 import { ReferenceList } from "./ReferenceList.js";
 const Bubble = (props)=>{
-    const { className, content, reasoning_content, extra, feedback, markdownRender, reasoningMarkdownRender = markdownRender, references, suggests, role = 'user', placement = 'user' === role ? 'end' : 'start', showFeedback = (hovered)=>hovered } = props;
+    const { className, content, reasoning_content, extra, feedback, markdownRender, reasoningMarkdownRender = markdownRender, references, suggests, role = 'user', status, placement = 'user' === role ? 'end' : 'start', showFeedback = (hovered)=>hovered } = props;
     const containerRef = useRef(null);
     const feedbackRef = useRef(null);
     const containerHovered = useHover(containerRef);
     const feedbackHovered = useHover(feedbackRef);
     const hovered = containerHovered || feedbackHovered;
-    const messageMarkdownEle = markdownRender ? markdownRender(content || '') : /*#__PURE__*/ jsx(Markdown, {
-        content: content || ''
+    const cursorPlaceholder = 'pending' === status && 'assistant' === role ? '<placeholder type="pending" />' : '';
+    const messageMarkdownEle = markdownRender ? markdownRender(content || '', status) : /*#__PURE__*/ jsx(Markdown, {
+        content: (content || '') + cursorPlaceholder
     });
-    const reasoningMarkdownEle = reasoningMarkdownRender ? reasoningMarkdownRender(reasoning_content || '') : /*#__PURE__*/ jsx(Markdown, {
+    const reasoningMarkdownEle = reasoningMarkdownRender ? reasoningMarkdownRender(reasoning_content || '', status) : /*#__PURE__*/ jsx(Markdown, {
         content: reasoning_content || ''
     });
     const message = 'user' === role ? /*#__PURE__*/ jsx(UserContentWrapper, {

package/dist/features/JsonEditor/JsonEditor.d.ts

@@ -1,8 +1,8 @@
 import { type JsonValue } from './types';
 export interface JsonEditorProps {
-    defaultValue?: JsonValue;
     value?: JsonValue;
     onChange?: (v: JsonValue) => void;
+    schema?: any;
 }
 export interface JsonEditorHandle {
     update: () => void;

package/dist/features/JsonEditor/JsonEditor.js

@@ -3,6 +3,7 @@ import { Flex, message } from "antd";
 import { forwardRef, useImperativeHandle, useState } from "react";
 import { Card } from "../../components/index.js";
 import styled_components from "styled-components";
+import { JSONSchemaFaker } from "json-schema-faker";
 import { Toolbar } from "./Toolbar.js";
 import { CodeEditor } from "./CodeEditor.js";
 import { formatJson, minifyJson, validateJson } from "./utils.js";
@@ -41,8 +42,8 @@ const InfoBar = styled_components.div`
   border-radius: 4px;
 `;
 const JsonEditor = /*#__PURE__*/ forwardRef((props, ref)=>{
-    const { value, onChange, defaultValue } = props;
-    const initialText = void 0 !== value ? JSON.stringify(value, null, 2) : defaultValue ? JSON.stringify(defaultValue, null, 2) : '';
+    const { value, onChange, schema } = props;
+    const initialText = void 0 !== value ? JSON.stringify(value, null, 2) : '';
     const [jsonInput, setJsonInput] = useState(initialText);
     const [validation, setValidation] = useState({
         isValid: true,
@@ -61,7 +62,7 @@ const JsonEditor = /*#__PURE__*/ forwardRef((props, ref)=>{
     };
     useImperativeHandle(ref, ()=>({
             update: ()=>{
-                updateInput(initialText);
+                setJsonInput(initialText);
             }
         }), [
         initialText,
@@ -79,7 +80,24 @@ const JsonEditor = /*#__PURE__*/ forwardRef((props, ref)=>{
         navigator.clipboard.writeText(jsonInput);
         message.success('复制成功');
     };
+    const handleGenerateMock = ()=>{
+        if (schema) try {
+            JSONSchemaFaker.option({
+                alwaysFakeOptionals: true,
+                fillProperties: false
+            });
+            const mock = JSONSchemaFaker.generate(schema);
+            const formatted = JSON.stringify(mock, null, 2);
+            updateInput(formatted);
+        } catch (error) {
+            message.error('Mock 数据生成失败');
+            console.log(error);
+        }
+    };
     return /*#__PURE__*/ jsx(Card, {
+        style: {
+            height: '100%'
+        },
         title: /*#__PURE__*/ jsxs(Flex, {
             align: "center",
             gap: 6,
@@ -99,7 +117,8 @@ const JsonEditor = /*#__PURE__*/ forwardRef((props, ref)=>{
                 disabled: !validation.isValid,
                 onFormat: handleFormat,
                 onMinify: handleMinify,
-                onCopy: handleCopy
+                onCopy: handleCopy,
+                onGenerateMock: schema && handleGenerateMock
             })
         }),
         children: /*#__PURE__*/ jsx(EditorWrapper, {

package/dist/features/JsonEditor/Toolbar.d.ts

@@ -3,6 +3,7 @@ interface ToolbarProps {
     onFormat: () => void;
     onMinify: () => void;
     onCopy: () => void;
+    onGenerateMock: () => void;
 }
-export declare const Toolbar: ({ onFormat, onMinify, onCopy, disabled, }: ToolbarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Toolbar: ({ onGenerateMock, onFormat, onMinify, onCopy, disabled, }: ToolbarProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/features/JsonEditor/Toolbar.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button, Tooltip } from "antd";
-import { Braces, Copy, FileArchive } from "lucide-react";
+import { Braces, Copy, FileArchive, Sparkles } from "lucide-react";
 import styled_components from "styled-components";
 const ToolbarContainer = styled_components.div`
   display: flex;
@@ -12,8 +12,23 @@ const ActionButton = styled_components(Button)`
     background-color: rgba(31, 41, 55, 0.5);
   }
 `;
-const Toolbar = ({ onFormat, onMinify, onCopy, disabled })=>/*#__PURE__*/ jsxs(ToolbarContainer, {
+const Toolbar = ({ onGenerateMock, onFormat, onMinify, onCopy, disabled })=>/*#__PURE__*/ jsxs(ToolbarContainer, {
         children: [
+            onGenerateMock && /*#__PURE__*/ jsx(Tooltip, {
+                title: "随机生成数据",
+                children: /*#__PURE__*/ jsx(ActionButton, {
+                    disabled: disabled,
+                    size: "small",
+                    type: "text",
+                    onClick: onGenerateMock,
+                    icon: /*#__PURE__*/ jsx(Sparkles, {
+                        style: {
+                            width: 14,
+                            height: 14
+                        }
+                    })
+                })
+            }),
             /*#__PURE__*/ jsx(Tooltip, {
                 title: "格式化",
                 children: /*#__PURE__*/ jsx(ActionButton, {
@@ -23,7 +38,8 @@ const Toolbar = ({ onFormat, onMinify, onCopy, disabled })=>/*#__PURE__*/ jsxs(T
                     onClick: onFormat,
                     icon: /*#__PURE__*/ jsx(Braces, {
                         style: {
-                            fontSize: 16
+                            width: 14,
+                            height: 14
                         }
                     })
                 })
@@ -37,7 +53,8 @@ const Toolbar = ({ onFormat, onMinify, onCopy, disabled })=>/*#__PURE__*/ jsxs(T
                     onClick: onMinify,
                     icon: /*#__PURE__*/ jsx(FileArchive, {
                         style: {
-                            fontSize: 16
+                            width: 14,
+                            height: 14
                         }
                     })
                 })
@@ -51,7 +68,8 @@ const Toolbar = ({ onFormat, onMinify, onCopy, disabled })=>/*#__PURE__*/ jsxs(T
                     onClick: onCopy,
                     icon: /*#__PURE__*/ jsx(Copy, {
                         style: {
-                            fontSize: 16
+                            width: 14,
+                            height: 14
                         }
                     })
                 })

package/dist/ui/PromptEditor/index.d.ts

@@ -0,0 +1,8 @@
+import 'prismjs/components/prism-markdown';
+export interface PromptEditorProps {
+    value: string;
+    onChange: (value: string) => void;
+    placeholder?: string;
+    className?: string;
+}
+export declare const PromptEditor: ({ value, onChange, placeholder, className, }: PromptEditorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/ui/index.d.ts

@@ -0,0 +1 @@
+export { PromptEditor, type PromptEditorProps } from './PromptEditor';

package/dist/ui.css

@@ -0,0 +1,366 @@
+/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
+@layer properties;
+@layer theme, base, components, utilities;
+@layer theme {
+  :root, :host {
+    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
+      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+      "Courier New", monospace;
+    --color-slate-300: oklch(86.9% 0.022 252.894);
+    --text-sm: 0.875rem;
+    --text-sm--line-height: calc(1.25 / 0.875);
+    --default-transition-duration: 150ms;
+    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    --default-font-family: var(--font-sans);
+    --default-mono-font-family: var(--font-mono);
+  }
+}
+@layer base {
+  *, ::after, ::before, ::backdrop, ::file-selector-button {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+    border: 0 solid;
+  }
+  html, :host {
+    line-height: 1.5;
+    -webkit-text-size-adjust: 100%;
+    tab-size: 4;
+    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
+    font-feature-settings: var(--default-font-feature-settings, normal);
+    font-variation-settings: var(--default-font-variation-settings, normal);
+    -webkit-tap-highlight-color: transparent;
+  }
+  hr {
+    height: 0;
+    color: inherit;
+    border-top-width: 1px;
+  }
+  abbr:where([title]) {
+    -webkit-text-decoration: underline dotted;
+    text-decoration: underline dotted;
+  }
+  h1, h2, h3, h4, h5, h6 {
+    font-size: inherit;
+    font-weight: inherit;
+  }
+  a {
+    color: inherit;
+    -webkit-text-decoration: inherit;
+    text-decoration: inherit;
+  }
+  b, strong {
+    font-weight: bolder;
+  }
+  code, kbd, samp, pre {
+    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
+    font-feature-settings: var(--default-mono-font-feature-settings, normal);
+    font-variation-settings: var(--default-mono-font-variation-settings, normal);
+    font-size: 1em;
+  }
+  small {
+    font-size: 80%;
+  }
+  sub, sup {
+    font-size: 75%;
+    line-height: 0;
+    position: relative;
+    vertical-align: baseline;
+  }
+  sub {
+    bottom: -0.25em;
+  }
+  sup {
+    top: -0.5em;
+  }
+  table {
+    text-indent: 0;
+    border-color: inherit;
+    border-collapse: collapse;
+  }
+  :-moz-focusring {
+    outline: auto;
+  }
+  progress {
+    vertical-align: baseline;
+  }
+  summary {
+    display: list-item;
+  }
+  ol, ul, menu {
+    list-style: none;
+  }
+  img, svg, video, canvas, audio, iframe, embed, object {
+    display: block;
+    vertical-align: middle;
+  }
+  img, video {
+    max-width: 100%;
+    height: auto;
+  }
+  button, input, select, optgroup, textarea, ::file-selector-button {
+    font: inherit;
+    font-feature-settings: inherit;
+    font-variation-settings: inherit;
+    letter-spacing: inherit;
+    color: inherit;
+    border-radius: 0;
+    background-color: transparent;
+    opacity: 1;
+  }
+  :where(select:is([multiple], [size])) optgroup {
+    font-weight: bolder;
+  }
+  :where(select:is([multiple], [size])) optgroup option {
+    padding-inline-start: 20px;
+  }
+  ::file-selector-button {
+    margin-inline-end: 4px;
+  }
+  ::placeholder {
+    opacity: 1;
+  }
+  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
+    ::placeholder {
+      color: currentcolor;
+      @supports (color: color-mix(in lab, red, red)) {
+        color: color-mix(in oklab, currentcolor 50%, transparent);
+      }
+    }
+  }
+  textarea {
+    resize: vertical;
+  }
+  ::-webkit-search-decoration {
+    -webkit-appearance: none;
+  }
+  ::-webkit-date-and-time-value {
+    min-height: 1lh;
+    text-align: inherit;
+  }
+  ::-webkit-datetime-edit {
+    display: inline-flex;
+  }
+  ::-webkit-datetime-edit-fields-wrapper {
+    padding: 0;
+  }
+  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
+    padding-block: 0;
+  }
+  ::-webkit-calendar-picker-indicator {
+    line-height: 1;
+  }
+  :-moz-ui-invalid {
+    box-shadow: none;
+  }
+  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
+    appearance: button;
+  }
+  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
+    height: auto;
+  }
+  [hidden]:where(:not([hidden="until-found"])) {
+    display: none !important;
+  }
+}
+@layer utilities {
+  .visible {
+    visibility: visible;
+  }
+  .absolute {
+    position: absolute;
+  }
+  .relative {
+    position: relative;
+  }
+  .block {
+    display: block;
+  }
+  .flex {
+    display: flex;
+  }
+  .inline {
+    display: inline;
+  }
+  .inline-flex {
+    display: inline-flex;
+  }
+  .table {
+    display: table;
+  }
+  .h-full {
+    height: 100%;
+  }
+  .flex-1 {
+    flex: 1;
+  }
+  .flex-shrink {
+    flex-shrink: 1;
+  }
+  .flex-grow {
+    flex-grow: 1;
+  }
+  .border-collapse {
+    border-collapse: collapse;
+  }
+  .transform {
+    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
+  }
+  .resize {
+    resize: both;
+  }
+  .flex-col {
+    flex-direction: column;
+  }
+  .overflow-auto {
+    overflow: auto;
+  }
+  .overflow-hidden {
+    overflow: hidden;
+  }
+  .border {
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+  }
+  .bg-\[\#0B1120\] {
+    background-color: #0B1120;
+  }
+  .font-mono {
+    font-family: var(--font-mono);
+  }
+  .text-sm {
+    font-size: var(--text-sm);
+    line-height: var(--tw-leading, var(--text-sm--line-height));
+  }
+  .text-slate-300 {
+    color: var(--color-slate-300);
+  }
+  .outline {
+    outline-style: var(--tw-outline-style);
+    outline-width: 1px;
+  }
+  .filter {
+    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
+  }
+  .transition {
+    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
+  .focus\:outline-none {
+    &:focus {
+      --tw-outline-style: none;
+      outline-style: none;
+    }
+  }
+}
+@property --tw-rotate-x {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-rotate-y {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-rotate-z {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-skew-x {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-skew-y {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-border-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
+@property --tw-outline-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
+@property --tw-blur {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-brightness {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-contrast {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-grayscale {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-hue-rotate {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-invert {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-opacity {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-saturate {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-sepia {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-drop-shadow {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-drop-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-drop-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-drop-shadow-size {
+  syntax: "*";
+  inherits: false;
+}
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-rotate-x: initial;
+      --tw-rotate-y: initial;
+      --tw-rotate-z: initial;
+      --tw-skew-x: initial;
+      --tw-skew-y: initial;
+      --tw-border-style: solid;
+      --tw-outline-style: solid;
+      --tw-blur: initial;
+      --tw-brightness: initial;
+      --tw-contrast: initial;
+      --tw-grayscale: initial;
+      --tw-hue-rotate: initial;
+      --tw-invert: initial;
+      --tw-opacity: initial;
+      --tw-saturate: initial;
+      --tw-sepia: initial;
+      --tw-drop-shadow: initial;
+      --tw-drop-shadow-color: initial;
+      --tw-drop-shadow-alpha: 100%;
+      --tw-drop-shadow-size: initial;
+    }
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "listpage-next",
-  "version": "0.0.237",
+  "version": "0.0.238",
   "description": "A React component library for creating filter forms with Ant Design",
   "type": "module",
   "main": "./dist/index.js",
@@ -9,7 +9,12 @@
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js"
-    }
+    },
+    "./ui": {
+      "types": "./dist/ui/ui.d.ts",
+      "import": "./dist/ui/ui.js"
+    },
+    "./ui.css": "./dist/ui.css"
   },
   "types": "./dist/index.d.ts",
   "files": [
@@ -25,7 +30,8 @@
   ],
   "license": "MIT",
   "scripts": {
-    "build": "rslib build",
+    "build": "rslib build && npm run build:css || true",
+    "build:css": "npx -p @tailwindcss/cli@4.1.17 -p tailwindcss@4.1.17 tailwindcss -c tailwind.config.cjs -i ./src/ui/tailwind.css -o ./dist/ui.css --min",
     "format": "prettier --write .",
     "prepublishOnly": "npm run build"
   },
@@ -41,7 +47,11 @@
     "typescript": "^5.9.2",
     "react": "^19.1.1",
     "react-router-dom": ">=6.0.0",
-    "@types/markdown-it": "~14.1.2"
+    "@types/markdown-it": "~14.1.2",
+    "tailwindcss": "~4.1.17",
+    "@tailwindcss/cli": "^4.1.0",
+    "postcss": "^8.4.49",
+    "autoprefixer": "^10.4.20"
   },
   "peerDependencies": {
     "react": ">=16.9.0",
@@ -70,6 +80,10 @@
     "@tiptap/core": "~3.10.7",
     "@tiptap/pm": "~3.10.7",
     "prosemirror-state": "~1.4.4",
-    "lucide-react": "~0.555.0"
+    "lucide-react": "~0.555.0",
+    "react-simple-code-editor": "~0.14.1",
+    "prismjs": "~1.30.0",
+    "@types/prismjs": "~1.26.5",
+    "json-schema-faker": "~0.5.9"
   }
 }