@cozeloop/prompt-components 0.0.1

package/dist/types/code-editor/json-editor.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+interface BaseJsonEditorProps {
+  value: string;
+  onChange?: (value: string) => void;
+  className?: string;
+  dataTestID?: string;
+  placeholder?: string | HTMLElement;
+  isDarkTheme?: boolean;
+  readonly?: boolean;
+  minHeight?: string | number;
+  maxHeight?: string | number;
+  editerHeight?: string | number;
+  padding?: string | number;
+  borderRadius?: string | number;
+}
+export declare const BaseJsonEditor: React.ForwardRefExoticComponent<BaseJsonEditorProps & React.RefAttributes<unknown>>;
+export {};

package/dist/types/code-editor/raw-text-editor.d.ts

@@ -0,0 +1,11 @@
+interface RawTextEditorProps {
+  value: string;
+  onChange?: (value?: string) => void;
+  className?: string;
+  readonly?: boolean;
+  dataTestID?: string;
+  placeholder?: string | HTMLElement;
+  minHeight?: string | number;
+}
+export declare const BaseRawTextEditor: import("react").ForwardRefExoticComponent<RawTextEditorProps & import("react").RefAttributes<HTMLDivElement>>;
+export {};

package/dist/types/code-editor/text-editor.d.ts

@@ -0,0 +1,23 @@
+export declare const TextEditor: (props: import("@coze-editor/editor/react").InferRendererProps<(import("@coze-editor/editor/react").ExtensionPluginSpec | import("@coze-editor/editor/react").OptionPluginSpec<"fontSize", number> | import("@coze-editor/editor/react").OptionPluginSpec<"placeholder", string | HTMLElement> | import("@coze-editor/editor/react").OptionPluginSpec<"readOnly", boolean> | import("@coze-editor/editor/react").OptionPluginSpec<"editable", boolean> | import("@coze-editor/editor/react").EventPluginSpec<"focus", symbol> | import("@coze-editor/editor/react").EventPluginSpec<"blur", symbol> | import("@coze-editor/editor/react").DOMEventHandlerPluginSpec<"mousedown"> | import("@coze-editor/editor/react").DOMEventHandlerPluginSpec<"mouseup"> | import("@coze-editor/editor/react").APIPluginSpec<"getValue", [], string> | import("@coze-editor/editor/react").APIPluginSpec<"focus", [], void> | import("@coze-editor/editor/react").APIPluginSpec<"blur", [], void> | import("@coze-editor/editor/react").APIPluginSpec<"getCursorPosition", [], number> | import("@coze-editor/editor/react").OptionPluginSpec<"minHeight", string | number> | import("@coze-editor/editor/react").OptionPluginSpec<"maxHeight", string | number> | import("@coze-editor/editor/react").OptionPluginSpec<"height", string | number> | import("@coze-editor/editor/react").APIPluginSpec<"undo", [], void> | import("@coze-editor/editor/react").APIPluginSpec<"redo", [], void> | import("@coze-editor/editor/react").OptionPluginSpec<"lineHeight", string | number | undefined> | import("@coze-editor/editor/react").OptionPluginSpec<"lineWrapping", boolean> | import("@coze-editor/editor/react").APIPluginSpec<"updateASTDecorations", [], void> | import("@coze-editor/editor/react").APIPluginSpec<"setValue", [value: string], void> | import("@coze-editor/editor/react").APIPluginSpec<"replaceText", [options: {
+  from: number;
+  to: number;
+  text: string;
+  cursorOffset?: number;
+  scrollIntoView?: boolean;
+  userEvent?: string;
+}], void> | import("@coze-editor/editor/react").APIPluginSpec<"setCursorPosition", [pos: number], void> | import("@coze-editor/editor/react").APIPluginSpec<"disableKeybindings", [keys: string[]], void> | import("@coze-editor/editor/react").APIPluginSpec<"transformTextInSelection", [transformer: (text: string) => string | undefined], void> | import("@coze-editor/editor/react").APIPluginSpec<"getSelection", [], {
+  from: number;
+  to: number;
+  anchor: number;
+  head: number;
+}> | import("@coze-editor/editor/react").APIPluginSpec<"getLineInfoAtPosition", [pos: number], import("@codemirror/state").Line> | import("@coze-editor/editor/react").EventPluginSpec<"selectionChange", {
+  selection: {
+    from: number;
+    to: number;
+    head: number;
+    anchor: number;
+  };
+  update: import("@codemirror/view").ViewUpdate;
+}> | import("@coze-editor/editor/react").EventPluginSpec<"change", {
+  value: string;
+}>)[]>) => import("react/jsx-runtime").JSX.Element;

package/dist/types/code-editor/themes/coze-dark.d.ts

@@ -0,0 +1 @@
+export declare const cozeDark: import("@codemirror/state").Extension[];

package/dist/types/code-editor/themes/coze-light.d.ts

@@ -0,0 +1 @@
+export declare const cozeLight: import("@codemirror/state").Extension[];

package/dist/types/consts/index.d.ts

@@ -0,0 +1,3 @@
+export declare const VARIABLE_MAX_LEN = 50;
+export declare const modelConfigLabelMap: Record<string, string>;
+export declare const DEFAULT_MAX_TOKENS = 4096;

package/dist/types/dev-layout/index.d.ts

@@ -0,0 +1,13 @@
+export declare function DevLayout({
+  title,
+  actionBtns,
+  children,
+  className,
+  style
+}: {
+  title: React.ReactNode;
+  actionBtns?: React.ReactNode;
+  children?: React.ReactNode;
+  className?: string;
+  style?: React.CSSProperties;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/types/index.d.ts

@@ -0,0 +1,19 @@
+export { PromptBasicEditor, type PromptBasicEditorProps, type PromptBasicEditorRef } from './basic-editor';
+export { PromptEditor, type PromptEditorProps } from './prompt-editor';
+export { PromptDiffEditor, type PromptDiffEditorRef } from './basic-editor/diff';
+export { BaseJsonEditor, BaseRawTextEditor, EditorProvider } from './code-editor';
+export { SchemaEditor } from './schema-editor';
+export { ModelSelect } from './model-select';
+export { BasicModelConfigEditor } from './model-config-editor/basic-type';
+export { PopoverModelConfigEdiotr } from './model-config-editor/popover-type';
+export { DevLayout } from './dev-layout';
+export { type EditorAPI } from '@coze-editor/editor/preset-code';
+export { useEditor, useInjector, useLatest } from '@coze-editor/editor/react';
+import regexpDecorator, { updateRegexpDecorations } from '@coze-editor/extension-regexp-decorator';
+export { regexpDecorator, updateRegexpDecorations };
+export { Decoration, EditorView, WidgetType, keymap } from '@codemirror/view';
+export { EditorSelection } from '@codemirror/state';
+export { type Extension, Prec, StateEffect, StateField } from '@codemirror/state';
+export { cunstomFacet } from './basic-editor/custom-facet';
+export { insertFourSpaces, deleteMarkupBackward, insertNewlineContinueMarkup } from './basic-editor/extensions/keymap';
+export { MermaidDiagram, type MermaidDiagramRef } from './mermaid-diagram';

package/dist/types/mermaid-diagram/index.d.ts

@@ -0,0 +1,12 @@
+export interface MermaidDiagramProps {
+  /** mermaid text */
+  chart: string;
+  className?: string;
+}
+export interface MermaidDiagramRef {
+  zoomIn: () => void;
+  zoomOut: () => void;
+  fit: () => void;
+  exportImg: () => Promise<void>;
+}
+export declare const MermaidDiagram: import("react").ForwardRefExoticComponent<MermaidDiagramProps & import("react").RefAttributes<MermaidDiagramRef>>;

package/dist/types/mermaid-diagram/use-svg-pan-zoom.d.ts

@@ -0,0 +1,17 @@
+interface UseSvgPanZoomParams {
+  svgSelector: string;
+  viewportSelector: string;
+  renderedChart: string;
+  zoomStepLength?: number;
+}
+export declare const useSvgPanZoom: ({
+  svgSelector,
+  viewportSelector,
+  renderedChart,
+  zoomStepLength
+}: UseSvgPanZoomParams) => {
+  zoomIn: () => void;
+  zoomOut: () => void;
+  fit: () => void;
+};
+export {};

package/dist/types/mermaid-diagram/utils.d.ts

@@ -0,0 +1 @@
+export declare const exportImage: (svgSelector: string) => Promise<void>;

package/dist/types/model-config-editor/basic-type.d.ts

@@ -0,0 +1,19 @@
+import { type CSSProperties } from 'react';
+import { type flow_devops_prompt_common } from '@flow-infra/idl/prompt_api';
+import { type ModelSelectProps } from "../model-select";
+export interface BasicModelConfigEditorProps {
+  className?: string;
+  style?: CSSProperties;
+  value?: flow_devops_prompt_common.ModelConfig;
+  disabled?: boolean;
+  modelSelectProps?: ModelSelectProps;
+  onChange?: (value?: flow_devops_prompt_common.ModelConfig) => void;
+}
+export declare function BasicModelConfigEditor({
+  className,
+  style,
+  value,
+  onChange,
+  disabled,
+  modelSelectProps
+}: BasicModelConfigEditorProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/model-config-editor/model-config-form.d.ts

@@ -0,0 +1,14 @@
+import { type Model, type ModelParam } from '@flow-infra/idl/fornax_ml_flow';
+import { type LabelProps } from '@coze-arch/coze-design';
+export declare const convertInt64ToNumber: (v?: Int64) => number | undefined;
+export declare const getInputSliderConfig: (key: string, modelParams: ModelParam[]) => {
+  min?: number;
+  max?: number;
+  defaultValue?: number;
+  label?: React.ReactNode | LabelProps;
+};
+export declare function ModelConfigForm({
+  model
+}: {
+  model?: Model;
+}): import("react/jsx-runtime").JSX.Element | null;

package/dist/types/model-config-editor/popover-type.d.ts

@@ -0,0 +1,25 @@
+import { type CSSProperties } from 'react';
+import { type flow_devops_prompt_common } from '@flow-infra/idl/prompt_api';
+import { type Model } from '@flow-infra/idl/fornax_ml_flow';
+import { type PopoverProps } from '@coze-arch/coze-design';
+import { type ModelSelectProps } from "../model-select";
+interface ModelConfigPopoverProps {
+  value?: flow_devops_prompt_common.ModelConfig;
+  disabled?: boolean;
+  modelSelectProps?: ModelSelectProps;
+  popoverProps?: PopoverProps & {
+    wrapClassName?: string;
+    wrapStyle?: CSSProperties;
+  };
+  onChange?: (value?: flow_devops_prompt_common.ModelConfig) => void;
+  renderDisplayContent?: (model?: Model, isPopoverVisible?: boolean) => React.ReactNode;
+}
+export declare function PopoverModelConfigEdiotr({
+  value,
+  disabled,
+  modelSelectProps,
+  popoverProps,
+  onChange,
+  renderDisplayContent
+}: ModelConfigPopoverProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/model-select/index.d.ts

@@ -0,0 +1,38 @@
+import { type CSSProperties } from 'react';
+import { type Model, type Int64 } from '@flow-infra/idl/fornax_ml_flow';
+interface ModelExtra extends Model {
+  disabled?: boolean;
+}
+interface ModelListDataProps {
+  list: ModelExtra[];
+  total?: Int64;
+  cursorID?: string;
+  hasMore?: boolean;
+}
+export interface ModelSelectProps {
+  className?: string;
+  style?: CSSProperties;
+  value?: Model;
+  disabled?: boolean;
+  defaultSelectFirstModel?: boolean;
+  modelListData?: ModelListDataProps;
+  loading?: boolean;
+  optionCustomRender?: (item: ModelExtra) => React.ReactNode;
+  onChange?: (v?: Model) => void;
+  loadMore?: () => void;
+  valueKey?: string;
+}
+export declare function ModelSelect({
+  className,
+  style,
+  value,
+  disabled,
+  defaultSelectFirstModel,
+  loading,
+  modelListData,
+  onChange,
+  loadMore,
+  optionCustomRender,
+  valueKey
+}: ModelSelectProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/model-select/model-option/index.d.ts

@@ -0,0 +1,30 @@
+import { type Model } from '@flow-infra/idl/fornax_ml_flow';
+export type ModelOptionProps = {
+  model: Model;
+  selected?: boolean;
+  disabled?: boolean;
+  /** 返回是否切换成功 */
+  onClick?: () => boolean;
+} & ({
+  enableConfig?: false;
+} | {
+  enableConfig: true;
+  onConfigClick: () => void;
+}) & ({
+  enableJumpDetail?: false;
+} | {
+  enableJumpDetail: true;
+  /**
+   * 点击跳转模型管理页面
+   *
+   * 因为该组件定位是纯 UI 组件，且不同模块 space id 获取的方式不尽相同，因此跳转行为和 url 的拼接就不内置了
+   */
+  onDetailClick: (modelId: string) => void;
+});
+export declare function ModelOption({
+  model,
+  selected,
+  disabled,
+  onClick,
+  ...props
+}: ModelOptionProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/model-select/model-option-group/index.d.ts

@@ -0,0 +1,15 @@
+import { type PropsWithChildren } from 'react';
+export type ModelOptionGroupProps = {
+  /** 新模型专区 */
+  type: 'new';
+  seriesName?: string;
+  tooltip?: string;
+} | {
+  /** 普通系列模型 */
+  type?: 'normal';
+  icon: string;
+  desc: string;
+  seriesName?: string;
+  tooltip?: string;
+};
+export declare function ModelOptionGroup(props: PropsWithChildren<ModelOptionGroupProps>): import("react/jsx-runtime").JSX.Element;

package/dist/types/prompt-editor/index.d.ts

@@ -0,0 +1,30 @@
+import { type ReactNode } from 'react';
+import { flow_devops_prompt_common } from '@flow-infra/idl/prompt_api';
+import { type PromptBasicEditorRef, type PromptBasicEditorProps } from '../basic-editor';
+type PromptMessage = flow_devops_prompt_common.Message & {
+  key?: string;
+  optimize_key?: string;
+};
+type BasicEditorProps = Pick<PromptBasicEditorProps, 'variables' | 'height' | 'minHeight' | 'maxHeight' | 'forbidJinjaHighlight' | 'forbidVariables' | 'linePlaceholder' | 'isGoTemplate' | 'customExtensions' | 'canSearch' | 'isJinja2Template'>;
+export interface PromptEditorProps extends BasicEditorProps {
+  className?: string;
+  message?: PromptMessage;
+  dragBtnHidden?: boolean;
+  messageTypeDisabled?: boolean;
+  disabled?: boolean;
+  isDrag?: boolean;
+  placeholder?: string;
+  messageTypeList?: Array<{
+    label: string;
+    value: number;
+  }>;
+  leftActionBtns?: ReactNode;
+  rightActionBtns?: ReactNode;
+  hideActionWrap?: boolean;
+  onMessageChange?: (v: PromptMessage) => void;
+  onMessageTypeChange?: (v: number) => void;
+  children?: ReactNode;
+  isFullscreen?: boolean;
+}
+export declare const PromptEditor: import("react").ForwardRefExoticComponent<PromptEditorProps & import("react").RefAttributes<PromptBasicEditorRef>>;
+export {};

package/dist/types/prompt-editor/message-type-select.d.ts

@@ -0,0 +1,16 @@
+interface MessageTypeSelectProps {
+  value: number;
+  onChange?: (v: number) => void;
+  disabled?: boolean;
+  messageTypeList?: Array<{
+    label: string;
+    value: number;
+  }>;
+}
+export declare function MessageTypeSelect({
+  value,
+  onChange,
+  disabled,
+  messageTypeList
+}: MessageTypeSelectProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/schema-editor/index.d.ts

@@ -0,0 +1,18 @@
+interface SchemaEditorProps {
+  value?: string;
+  readOnly?: boolean;
+  onChange?: (value?: string) => void;
+  language?: string;
+  placeholder?: string;
+  showLineNumbs?: boolean;
+  className?: string;
+}
+export declare const SchemaEditor: ({
+  value,
+  onChange,
+  placeholder,
+  readOnly,
+  language,
+  className
+}: SchemaEditorProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/utils/base.d.ts

@@ -0,0 +1,10 @@
+import { type UIEventHandler } from 'react';
+export declare const safeParseJson: <T>(jsonString?: string, fallback?: T) => T | undefined;
+export declare const handleScrollToBottom: (e: Parameters<UIEventHandler>[0], callback: () => void) => void;
+export declare function sleep(timer?: number): Promise<void>;
+export declare const messageId: () => string;
+export declare const convertNumberToThousands: (num?: Int64) => string | number;
+export declare function recordToArray(record: Record<string, string>): {
+  label: string;
+  value?: string;
+}[];

package/dist/types/utils/model-config.d.ts

@@ -0,0 +1,4 @@
+import { type flow_devops_prompt_common } from '@flow-infra/idl/prompt_api';
+import { type Model } from '@flow-infra/idl/fornax_ml_flow';
+export declare const convertModelToModelConfig: (model?: Model) => flow_devops_prompt_common.ModelConfig;
+export declare const renderModelOfflineTag: (model?: Model) => import("react/jsx-runtime").JSX.Element | null;

package/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "@cozeloop/prompt-components",
+  "version": "0.0.1",
+  "description": "Prompt common components for cozeloop",
+  "author": "cozeloop",
+  "main": "./dist/lib/index.js",
+  "scripts": {
+    "build": "exit 0",
+    "lint": "eslint ./ --cache",
+    "pub": "node publish.js",
+    "test": "exit 0",
+    "test:cov": "exit 0"
+  },
+  "dependencies": {
+    "@codemirror/commands": "^6.3.3",
+    "@codemirror/language": "^6.10.1",
+    "@codemirror/merge": "^6.10.0",
+    "@codemirror/search": "^6.5.5",
+    "@codemirror/state": "^6.4.1",
+    "@codemirror/view": "^6.34.1",
+    "@coze-arch/coze-design": "0.0.6-alpha.101d0c",
+    "@coze-editor/editor": "0.1.0-alpha.dac011",
+    "@coze-editor/extension-regexp-decorator": "0.1.0-alpha.0fd19e",
+    "@cozeloop/components": "^0.0.1",
+    "@flow-web/md-box": "2.4.2",
+    "@lezer/common": "^1.2.2",
+    "@shikijs/themes": "^3.2.2",
+    "ahooks": "^3.7.8",
+    "classnames": "^2.3.2",
+    "codemirror-shiki": "^0.2.2",
+    "crelt": "^1.0.5",
+    "eventsource-parser": "^1.0.0",
+    "immer": "^10.0.3",
+    "js-base64": "^3.7.7",
+    "lodash-es": "^4.17.21",
+    "lucide-react": "^0.438.0",
+    "mermaid": "^11.4.1",
+    "mitt": "^3.0.1",
+    "nanoid": "^4.0.2",
+    "react": "~18.2.0",
+    "shiki": "^3.2.2",
+    "sortablejs": "~1.15.2",
+    "svg-pan-zoom": "^3.6.2",
+    "tippy.js": "^6.3.7"
+  },
+  "devDependencies": {
+    "@cozeloop/tailwind-config": "workspace:*",
+    "@cozeloop/tailwind-plugin": "workspace:*",
+    "@edenx/module-tools": "1.39.2",
+    "@edenx/plugin-tailwind": "1.51.0",
+    "@flow-infra/bot-typings": "workspace:*",
+    "@flow-infra/eslint-config": "workspace:*",
+    "@flow-infra/idl": "workspace:*",
+    "@flow-infra/tailwind-config": "workspace:*",
+    "@flow-infra/ts-config": "workspace:*",
+    "@types/lodash-es": "^4.17.10",
+    "@types/react": "18.2.37",
+    "@types/react-dom": "18.2.15",
+    "@vitest/coverage-v8": "~3.0.5",
+    "happy-dom": "^12.10.3",
+    "react-dom": "~18.2.0",
+    "storybook": "^7.6.7",
+    "tsconfig-paths": "4.1.0",
+    "vite": "^4.3.9",
+    "vite-plugin-svgr": "~3.3.0",
+    "vitest": "~3.0.5"
+  },
+  "module": "./dist/es/index.js",
+  "types": "./dist/types/index.d.ts",
+  "files": [
+    "dist",
+    "package.json",
+    "README.md"
+  ]
+}