one-design-next 0.0.19 → 0.0.21
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/_genui-types.d.ts +2 -2
- package/dist/_genui-types.js +2 -2
- package/dist/artifact/index.d.ts +32 -0
- package/dist/artifact/index.js +136 -0
- package/dist/artifact/style/index.css +181 -0
- package/dist/artifact/style/index.d.ts +2 -0
- package/dist/artifact/style/index.js +2 -0
- package/dist/chart/index.d.ts +2 -2
- package/dist/composer/editor.js +50 -13
- package/dist/composer/index.d.ts +21 -2
- package/dist/composer/index.js +94 -38
- package/dist/index.d.ts +3 -1
- package/dist/index.js +2 -0
- package/package.json +4 -1
package/dist/_genui-types.d.ts
CHANGED
|
@@ -55,10 +55,10 @@ export interface PreviewTab {
|
|
|
55
55
|
type: string;
|
|
56
56
|
}
|
|
57
57
|
/**
|
|
58
|
-
*
|
|
58
|
+
* 内联引用状态:
|
|
59
59
|
* - complete:默认稳态(无参数 / 参数已填)
|
|
60
60
|
* - pending:邀请补充参数(业务自定,不强制)
|
|
61
|
-
* - active:参数面板打开(最高优先级,由组件内部根据 `active` prop
|
|
61
|
+
* - active:参数面板打开(最高优先级,由组件内部根据 `active` prop 控制,不进 data)
|
|
62
62
|
*/
|
|
63
63
|
export type InlineRefState = 'pending' | 'complete';
|
|
64
64
|
/**
|
package/dist/_genui-types.js
CHANGED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import './style';
|
|
3
|
+
export interface ArtifactShimmerOptions {
|
|
4
|
+
durationMs?: number;
|
|
5
|
+
/** 每秒扫光次数(优先级高于 durationMs)。 */
|
|
6
|
+
frequencyHz?: number;
|
|
7
|
+
angleDeg?: number;
|
|
8
|
+
bandSizePercent?: number;
|
|
9
|
+
baseOpacity?: number;
|
|
10
|
+
highlightOpacity?: number;
|
|
11
|
+
easing?: string;
|
|
12
|
+
}
|
|
13
|
+
export interface ArtifactProps {
|
|
14
|
+
title: string;
|
|
15
|
+
statRange: string;
|
|
16
|
+
createdAt?: string;
|
|
17
|
+
/** 预留字段:当前卡片不展示。 */
|
|
18
|
+
type?: string;
|
|
19
|
+
status?: 'Generating' | 'Done' | (string & {});
|
|
20
|
+
shimmer?: ArtifactShimmerOptions;
|
|
21
|
+
thumbnailUrl?: string;
|
|
22
|
+
onOpen?: () => void;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* 对话流内的单个产物摘要卡片。
|
|
26
|
+
* 本期聚焦单项展示,保留 `type` 字段以支持未来“报告 / 人群”等产物类型扩展。
|
|
27
|
+
*/
|
|
28
|
+
export declare function Artifact({ title, statRange, createdAt, status, shimmer, thumbnailUrl, onOpen, }: ArtifactProps): import("react").JSX.Element;
|
|
29
|
+
export declare namespace Artifact {
|
|
30
|
+
var displayName: string;
|
|
31
|
+
}
|
|
32
|
+
export default Artifact;
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
9
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
10
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
11
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
12
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
|
+
import { useState } from 'react';
|
|
14
|
+
import Icon from "../icon";
|
|
15
|
+
import "./style";
|
|
16
|
+
/**
|
|
17
|
+
* 对话流内的单个产物摘要卡片。
|
|
18
|
+
* 本期聚焦单项展示,保留 `type` 字段以支持未来“报告 / 人群”等产物类型扩展。
|
|
19
|
+
*/
|
|
20
|
+
export function Artifact(_ref) {
|
|
21
|
+
var _shimmer$durationMs, _shimmer$angleDeg, _shimmer$bandSizePerc, _shimmer$baseOpacity, _shimmer$highlightOpa, _shimmer$easing;
|
|
22
|
+
var title = _ref.title,
|
|
23
|
+
statRange = _ref.statRange,
|
|
24
|
+
createdAt = _ref.createdAt,
|
|
25
|
+
_ref$status = _ref.status,
|
|
26
|
+
status = _ref$status === void 0 ? 'Done' : _ref$status,
|
|
27
|
+
shimmer = _ref.shimmer,
|
|
28
|
+
thumbnailUrl = _ref.thumbnailUrl,
|
|
29
|
+
onOpen = _ref.onOpen;
|
|
30
|
+
var isGenerating = status === 'Generating';
|
|
31
|
+
var isInteractive = !!onOpen && !isGenerating;
|
|
32
|
+
var _useState = useState({
|
|
33
|
+
x: 208,
|
|
34
|
+
y: 60,
|
|
35
|
+
active: false
|
|
36
|
+
}),
|
|
37
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
38
|
+
spotlight = _useState2[0],
|
|
39
|
+
setSpotlight = _useState2[1];
|
|
40
|
+
var handleMouseMove = function handleMouseMove(event) {
|
|
41
|
+
var rect = event.currentTarget.getBoundingClientRect();
|
|
42
|
+
setSpotlight({
|
|
43
|
+
x: event.clientX - rect.left,
|
|
44
|
+
y: event.clientY - rect.top,
|
|
45
|
+
active: true
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
var handleMouseEnter = function handleMouseEnter(event) {
|
|
49
|
+
var rect = event.currentTarget.getBoundingClientRect();
|
|
50
|
+
setSpotlight({
|
|
51
|
+
x: event.clientX - rect.left,
|
|
52
|
+
y: event.clientY - rect.top,
|
|
53
|
+
active: true
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
var handleMouseLeave = function handleMouseLeave() {
|
|
57
|
+
setSpotlight(function (prev) {
|
|
58
|
+
return _objectSpread(_objectSpread({}, prev), {}, {
|
|
59
|
+
active: false
|
|
60
|
+
});
|
|
61
|
+
});
|
|
62
|
+
};
|
|
63
|
+
var shimmerConfig = {
|
|
64
|
+
durationMs: (_shimmer$durationMs = shimmer === null || shimmer === void 0 ? void 0 : shimmer.durationMs) !== null && _shimmer$durationMs !== void 0 ? _shimmer$durationMs : 4200,
|
|
65
|
+
frequencyHz: shimmer === null || shimmer === void 0 ? void 0 : shimmer.frequencyHz,
|
|
66
|
+
angleDeg: (_shimmer$angleDeg = shimmer === null || shimmer === void 0 ? void 0 : shimmer.angleDeg) !== null && _shimmer$angleDeg !== void 0 ? _shimmer$angleDeg : 110,
|
|
67
|
+
bandSizePercent: (_shimmer$bandSizePerc = shimmer === null || shimmer === void 0 ? void 0 : shimmer.bandSizePercent) !== null && _shimmer$bandSizePerc !== void 0 ? _shimmer$bandSizePerc : 16,
|
|
68
|
+
baseOpacity: (_shimmer$baseOpacity = shimmer === null || shimmer === void 0 ? void 0 : shimmer.baseOpacity) !== null && _shimmer$baseOpacity !== void 0 ? _shimmer$baseOpacity : 0.42,
|
|
69
|
+
highlightOpacity: (_shimmer$highlightOpa = shimmer === null || shimmer === void 0 ? void 0 : shimmer.highlightOpacity) !== null && _shimmer$highlightOpa !== void 0 ? _shimmer$highlightOpa : 0.92,
|
|
70
|
+
easing: (_shimmer$easing = shimmer === null || shimmer === void 0 ? void 0 : shimmer.easing) !== null && _shimmer$easing !== void 0 ? _shimmer$easing : 'cubic-bezier(0.22, 1, 0.36, 1)'
|
|
71
|
+
};
|
|
72
|
+
var resolvedDurationMs = shimmerConfig.frequencyHz && shimmerConfig.frequencyHz > 0 ? 1000 / shimmerConfig.frequencyHz : shimmerConfig.durationMs;
|
|
73
|
+
var spotlightStyle = {
|
|
74
|
+
'--odn-artifact-spot-x': "".concat(spotlight.x, "px"),
|
|
75
|
+
'--odn-artifact-spot-y': "".concat(spotlight.y, "px"),
|
|
76
|
+
'--odn-artifact-spot-opacity': spotlight.active && !isGenerating ? 1 : 0,
|
|
77
|
+
'--odn-artifact-shimmer-duration': "".concat(Math.max(300, resolvedDurationMs), "ms"),
|
|
78
|
+
'--odn-artifact-shimmer-angle': "".concat(shimmerConfig.angleDeg, "deg"),
|
|
79
|
+
'--odn-artifact-shimmer-band': "".concat(Math.max(4, Math.min(40, shimmerConfig.bandSizePercent)), "%"),
|
|
80
|
+
'--odn-artifact-shimmer-base-color': "rgba(51, 55, 61, ".concat(Math.max(0, Math.min(1, shimmerConfig.baseOpacity)), ")"),
|
|
81
|
+
'--odn-artifact-shimmer-highlight-color': "rgba(13, 13, 13, ".concat(Math.max(0, Math.min(1, shimmerConfig.highlightOpacity)), ")"),
|
|
82
|
+
'--odn-artifact-shimmer-easing': shimmerConfig.easing
|
|
83
|
+
};
|
|
84
|
+
var thirdLineText = status === 'Generating' ? '生成中' : createdAt !== null && createdAt !== void 0 ? createdAt : '创建时间:--';
|
|
85
|
+
var content = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
86
|
+
"data-odn-artifact-spotlight": true,
|
|
87
|
+
"aria-hidden": true
|
|
88
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
89
|
+
"data-odn-artifact-copy": true
|
|
90
|
+
}, /*#__PURE__*/React.createElement("p", {
|
|
91
|
+
"data-odn-artifact-title": true
|
|
92
|
+
}, title), /*#__PURE__*/React.createElement("p", {
|
|
93
|
+
"data-odn-artifact-stat-range": true
|
|
94
|
+
}, statRange), /*#__PURE__*/React.createElement("p", {
|
|
95
|
+
"data-odn-artifact-created-at": true
|
|
96
|
+
}, thirdLineText)), /*#__PURE__*/React.createElement("div", {
|
|
97
|
+
"data-odn-artifact-visual-wrap": true
|
|
98
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
99
|
+
"data-odn-artifact-visual": true,
|
|
100
|
+
"aria-hidden": true
|
|
101
|
+
}, thumbnailUrl ? /*#__PURE__*/React.createElement("div", {
|
|
102
|
+
"data-odn-artifact-visual-inner": true
|
|
103
|
+
}, /*#__PURE__*/React.createElement("img", {
|
|
104
|
+
src: thumbnailUrl,
|
|
105
|
+
alt: "",
|
|
106
|
+
"data-odn-artifact-visual-image": true
|
|
107
|
+
})) : /*#__PURE__*/React.createElement("div", {
|
|
108
|
+
"data-odn-artifact-visual-inner": true,
|
|
109
|
+
"data-odn-artifact-visual-inner-placeholder": true
|
|
110
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
111
|
+
"data-odn-artifact-visual-placeholder": true
|
|
112
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
113
|
+
name: "file-text",
|
|
114
|
+
size: 18
|
|
115
|
+
}))))));
|
|
116
|
+
return isInteractive ? /*#__PURE__*/React.createElement("button", {
|
|
117
|
+
type: "button",
|
|
118
|
+
"data-odn-artifact": true,
|
|
119
|
+
"data-odn-artifact-clickable": true,
|
|
120
|
+
onClick: onOpen,
|
|
121
|
+
onMouseEnter: handleMouseEnter,
|
|
122
|
+
onMouseMove: handleMouseMove,
|
|
123
|
+
onMouseLeave: handleMouseLeave,
|
|
124
|
+
style: spotlightStyle,
|
|
125
|
+
"data-odn-artifact-status": status
|
|
126
|
+
}, content) : /*#__PURE__*/React.createElement("div", {
|
|
127
|
+
"data-odn-artifact": true,
|
|
128
|
+
onMouseEnter: !isGenerating ? handleMouseEnter : undefined,
|
|
129
|
+
onMouseMove: !isGenerating ? handleMouseMove : undefined,
|
|
130
|
+
onMouseLeave: !isGenerating ? handleMouseLeave : undefined,
|
|
131
|
+
style: spotlightStyle,
|
|
132
|
+
"data-odn-artifact-status": status
|
|
133
|
+
}, content);
|
|
134
|
+
}
|
|
135
|
+
Artifact.displayName = 'Artifact';
|
|
136
|
+
export default Artifact;
|
|
@@ -0,0 +1,181 @@
|
|
|
1
|
+
html {
|
|
2
|
+
--odn-artifact-padding-y: 20px;
|
|
3
|
+
--odn-artifact-padding-x: 24px;
|
|
4
|
+
--odn-artifact-radius: 12px;
|
|
5
|
+
--odn-artifact-content-gap: 24px;
|
|
6
|
+
--odn-artifact-copy-width: 280px;
|
|
7
|
+
--odn-artifact-copy-height: 120px;
|
|
8
|
+
--odn-artifact-visual-width: 136px;
|
|
9
|
+
--odn-artifact-visual-inner-width: 96px;
|
|
10
|
+
--odn-artifact-visual-height: 120px;
|
|
11
|
+
--odn-artifact-shimmer-duration: 1.8s;
|
|
12
|
+
--odn-artifact-shimmer-angle: 110deg;
|
|
13
|
+
--odn-artifact-shimmer-band: 16%;
|
|
14
|
+
--odn-artifact-shimmer-base-color: rgba(51, 55, 61, 0.42);
|
|
15
|
+
--odn-artifact-shimmer-highlight-color: rgba(13, 13, 13, 0.92);
|
|
16
|
+
--odn-artifact-shimmer-easing: cubic-bezier(0.22, 1, 0.36, 1);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
[data-odn-artifact] {
|
|
20
|
+
position: relative;
|
|
21
|
+
width: min(100%, 416px);
|
|
22
|
+
height: var(--odn-artifact-copy-height);
|
|
23
|
+
display: grid;
|
|
24
|
+
grid-template-columns: var(--odn-artifact-copy-width) var(--odn-artifact-visual-width);
|
|
25
|
+
align-items: stretch;
|
|
26
|
+
gap: 0;
|
|
27
|
+
text-align: left;
|
|
28
|
+
padding: 0;
|
|
29
|
+
border: 1px solid transparent;
|
|
30
|
+
border-radius: var(--odn-artifact-radius);
|
|
31
|
+
background: radial-gradient(91.56% 103.35% at 86.39% 100%, #deeaff 0%, #ecf4ff 100%);
|
|
32
|
+
background: radial-gradient(91.56% 103.35% at 86.39% 100%, color(display-p3 0.8789 0.9166 0.9924) 0%, color(display-p3 0.9319 0.9547 0.9956) 100%);
|
|
33
|
+
color: var(--odn-color-black-11);
|
|
34
|
+
overflow: hidden;
|
|
35
|
+
transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
button[data-odn-artifact] {
|
|
39
|
+
cursor: pointer;
|
|
40
|
+
font: inherit;
|
|
41
|
+
height: 120px;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
[data-odn-artifact][data-odn-artifact-clickable]:hover {
|
|
45
|
+
border-color: var(--odn-color-blue-2);
|
|
46
|
+
box-shadow: 0 4px 16px color-mix(in srgb, var(--odn-color-blue-2) 18%, transparent);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
[data-odn-artifact-copy] {
|
|
50
|
+
position: relative;
|
|
51
|
+
z-index: 1;
|
|
52
|
+
width: var(--odn-artifact-copy-width);
|
|
53
|
+
height: var(--odn-artifact-copy-height);
|
|
54
|
+
padding: var(--odn-artifact-padding-y) var(--odn-artifact-padding-x);
|
|
55
|
+
box-sizing: border-box;
|
|
56
|
+
display: flex;
|
|
57
|
+
flex-direction: column;
|
|
58
|
+
justify-content: flex-start;
|
|
59
|
+
min-width: 0;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
[data-odn-artifact-title] {
|
|
63
|
+
margin: 0;
|
|
64
|
+
font-size: var(--odn-font-size-headline-6);
|
|
65
|
+
line-height: var(--odn-font-leading-headline-6);
|
|
66
|
+
font-weight: 500;
|
|
67
|
+
color: var(--odn-color-black-12);
|
|
68
|
+
overflow: hidden;
|
|
69
|
+
text-overflow: ellipsis;
|
|
70
|
+
white-space: nowrap;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
[data-odn-artifact-stat-range] {
|
|
74
|
+
margin: 0;
|
|
75
|
+
margin-top: 0;
|
|
76
|
+
font-size: var(--odn-font-size-text-sm);
|
|
77
|
+
line-height: var(--odn-font-leading-text-sm);
|
|
78
|
+
color: var(--odn-color-black-12);
|
|
79
|
+
white-space: nowrap;
|
|
80
|
+
overflow: hidden;
|
|
81
|
+
text-overflow: ellipsis;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
[data-odn-artifact-created-at] {
|
|
85
|
+
margin: 0;
|
|
86
|
+
margin-top: 14px;
|
|
87
|
+
font-size: var(--odn-font-size-text-mn);
|
|
88
|
+
line-height: var(--odn-font-leading-text-mn);
|
|
89
|
+
color: var(--odn-color-black-8);
|
|
90
|
+
white-space: nowrap;
|
|
91
|
+
overflow: hidden;
|
|
92
|
+
text-overflow: ellipsis;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
[data-odn-artifact-visual-wrap] {
|
|
96
|
+
position: relative;
|
|
97
|
+
z-index: 1;
|
|
98
|
+
width: var(--odn-artifact-visual-width);
|
|
99
|
+
height: var(--odn-artifact-visual-height);
|
|
100
|
+
display: flex;
|
|
101
|
+
align-items: stretch;
|
|
102
|
+
justify-content: center;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
[data-odn-artifact-visual] {
|
|
106
|
+
width: var(--odn-artifact-visual-inner-width);
|
|
107
|
+
min-width: var(--odn-artifact-visual-inner-width);
|
|
108
|
+
height: var(--odn-artifact-visual-height);
|
|
109
|
+
margin-top: 20px;
|
|
110
|
+
margin-right: 0;
|
|
111
|
+
display: flex;
|
|
112
|
+
align-items: center;
|
|
113
|
+
justify-content: center;
|
|
114
|
+
border-radius: 8px;
|
|
115
|
+
border: 0;
|
|
116
|
+
background: #fff;
|
|
117
|
+
overflow: hidden;
|
|
118
|
+
transition: transform 0.2s ease;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
[data-odn-artifact][data-odn-artifact-clickable]:hover [data-odn-artifact-visual] {
|
|
122
|
+
transform: rotate(5deg) scale(1.05);
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
[data-odn-artifact-spotlight] {
|
|
126
|
+
position: absolute;
|
|
127
|
+
inset: 0;
|
|
128
|
+
z-index: 0;
|
|
129
|
+
pointer-events: none;
|
|
130
|
+
opacity: var(--odn-artifact-spot-opacity, 0);
|
|
131
|
+
transition: opacity 0.2s ease;
|
|
132
|
+
background: radial-gradient(280px circle at var(--odn-artifact-spot-x, 50%) var(--odn-artifact-spot-y, 50%), color-mix(in srgb, var(--odn-color-blue-2) 42%, transparent) 0%, transparent 62%);
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
[data-odn-artifact-visual-image] {
|
|
136
|
+
width: 100%;
|
|
137
|
+
height: 100%;
|
|
138
|
+
object-fit: cover;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
[data-odn-artifact-visual-placeholder] {
|
|
142
|
+
display: inline-flex;
|
|
143
|
+
flex-direction: column;
|
|
144
|
+
align-items: center;
|
|
145
|
+
gap: 4px;
|
|
146
|
+
font-size: var(--odn-font-size-text-sm);
|
|
147
|
+
line-height: var(--odn-font-leading-text-sm);
|
|
148
|
+
color: var(--odn-color-black-8);
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
[data-odn-artifact][data-odn-artifact-status=Generating] p,
|
|
152
|
+
[data-odn-artifact][data-odn-artifact-status=Generating] [data-odn-artifact-visual-placeholder],
|
|
153
|
+
[data-odn-artifact][data-odn-artifact-status=Generating] [data-odn-artifact-visual-placeholder] span {
|
|
154
|
+
color: transparent !important;
|
|
155
|
+
background-image: linear-gradient(var(--odn-artifact-shimmer-angle), var(--odn-artifact-shimmer-base-color) calc(50% - var(--odn-artifact-shimmer-band)), var(--odn-artifact-shimmer-highlight-color) 50%, var(--odn-artifact-shimmer-base-color) calc(50% + var(--odn-artifact-shimmer-band)));
|
|
156
|
+
background-size: 260% 100%;
|
|
157
|
+
background-position: 120% 50%;
|
|
158
|
+
/* stylelint-disable-next-line property-no-vendor-prefix */
|
|
159
|
+
-webkit-background-clip: text;
|
|
160
|
+
background-clip: text;
|
|
161
|
+
/* stylelint-disable-next-line property-no-vendor-prefix */
|
|
162
|
+
-webkit-text-fill-color: transparent;
|
|
163
|
+
animation: odn-artifact-text-shimmer var(--odn-artifact-shimmer-duration) var(--odn-artifact-shimmer-easing) infinite alternate;
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
@keyframes odn-artifact-text-shimmer {
|
|
167
|
+
0% {
|
|
168
|
+
background-position: 120% 50%;
|
|
169
|
+
}
|
|
170
|
+
100% {
|
|
171
|
+
background-position: -20% 50%;
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
@media (prefers-reduced-motion: reduce) {
|
|
175
|
+
[data-odn-artifact][data-odn-artifact-status=Generating] p,
|
|
176
|
+
[data-odn-artifact][data-odn-artifact-status=Generating] [data-odn-artifact-visual-placeholder],
|
|
177
|
+
[data-odn-artifact][data-odn-artifact-status=Generating] [data-odn-artifact-visual-placeholder] span {
|
|
178
|
+
animation: none;
|
|
179
|
+
background-position: 50% 50%;
|
|
180
|
+
}
|
|
181
|
+
}
|
package/dist/chart/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import './style';
|
|
3
|
-
export interface
|
|
3
|
+
export interface ChartProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
4
4
|
/**
|
|
5
5
|
* @description 是否禁用
|
|
6
6
|
* @default false
|
|
@@ -10,5 +10,5 @@ export interface AvatarProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
10
10
|
/**
|
|
11
11
|
* Chart 图表
|
|
12
12
|
*/
|
|
13
|
-
declare const Chart: React.FC<
|
|
13
|
+
declare const Chart: React.FC<ChartProps>;
|
|
14
14
|
export default Chart;
|
package/dist/composer/editor.js
CHANGED
|
@@ -137,17 +137,27 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
|
|
|
137
137
|
_useState2 = _slicedToArray(_useState, 2),
|
|
138
138
|
empty = _useState2[0],
|
|
139
139
|
setEmpty = _useState2[1];
|
|
140
|
-
/**
|
|
141
|
-
|
|
140
|
+
/**
|
|
141
|
+
* contenteditable 的 DOM 由浏览器直接改写。受控模式下,输入后延后一帧校验:
|
|
142
|
+
* - 父组件已回写 value:DOM 与 valueProp 一致,不做事
|
|
143
|
+
* - 父组件未回写 value:把 DOM 拉回 valueProp,维持受控语义
|
|
144
|
+
*/
|
|
145
|
+
var _useState3 = useState(0),
|
|
142
146
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
143
|
-
|
|
144
|
-
|
|
147
|
+
controlledSyncTick = _useState4[0],
|
|
148
|
+
setControlledSyncTick = _useState4[1];
|
|
149
|
+
var controlledSyncRafRef = useRef(null);
|
|
150
|
+
/** 输入模态:键盘操作时置为 keyboard,用于抑制“鼠标隐藏但 hover 仍生效”的视觉残留。 */
|
|
151
|
+
var _useState5 = useState('pointer'),
|
|
152
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
153
|
+
inputModality = _useState6[0],
|
|
154
|
+
setInputModality = _useState6[1];
|
|
145
155
|
|
|
146
156
|
/** ScrollArea root 显式高度。Base UI viewport=100%,root 必须有确定 height。 */
|
|
147
|
-
var
|
|
148
|
-
|
|
149
|
-
scrollHeight =
|
|
150
|
-
setScrollHeight =
|
|
157
|
+
var _useState7 = useState(null),
|
|
158
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
159
|
+
scrollHeight = _useState8[0],
|
|
160
|
+
setScrollHeight = _useState8[1];
|
|
151
161
|
|
|
152
162
|
/** onHeightChange 用 ref 稳定,避免 ResizeObserver effect 反复 cleanup/重建。 */
|
|
153
163
|
var onHeightChangeRef = useRef(onHeightChange);
|
|
@@ -193,6 +203,25 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
|
|
|
193
203
|
var lineCount = el.querySelectorAll('br').length + 1;
|
|
194
204
|
return lineCount <= 1;
|
|
195
205
|
}, []);
|
|
206
|
+
var scheduleControlledSync = useCallback(function () {
|
|
207
|
+
if (!isControlled) return;
|
|
208
|
+
if (controlledSyncRafRef.current != null) {
|
|
209
|
+
cancelAnimationFrame(controlledSyncRafRef.current);
|
|
210
|
+
}
|
|
211
|
+
controlledSyncRafRef.current = requestAnimationFrame(function () {
|
|
212
|
+
controlledSyncRafRef.current = null;
|
|
213
|
+
setControlledSyncTick(function (v) {
|
|
214
|
+
return v + 1;
|
|
215
|
+
});
|
|
216
|
+
});
|
|
217
|
+
}, [isControlled]);
|
|
218
|
+
useEffect(function () {
|
|
219
|
+
return function () {
|
|
220
|
+
if (controlledSyncRafRef.current != null) {
|
|
221
|
+
cancelAnimationFrame(controlledSyncRafRef.current);
|
|
222
|
+
}
|
|
223
|
+
};
|
|
224
|
+
}, []);
|
|
196
225
|
var fireChange = useCallback(function () {
|
|
197
226
|
var el = editorRef.current;
|
|
198
227
|
if (!el) return;
|
|
@@ -205,9 +234,10 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
|
|
|
205
234
|
}
|
|
206
235
|
forceNonEmptyOnceRef.current = false;
|
|
207
236
|
onChange === null || onChange === void 0 || onChange(getPlainText(el));
|
|
237
|
+
scheduleControlledSync();
|
|
208
238
|
// editor.height 锁定时 RO 不触发,主动同步一次,确保升格判定能拿到 scrollHeight
|
|
209
239
|
syncHeight();
|
|
210
|
-
}, [onChange, shouldShowPlaceholder, syncHeight]);
|
|
240
|
+
}, [onChange, scheduleControlledSync, shouldShowPlaceholder, syncHeight]);
|
|
211
241
|
|
|
212
242
|
/* ─────────────────────────────────────
|
|
213
243
|
* chip 管理
|
|
@@ -420,15 +450,21 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
|
|
|
420
450
|
}, [syncHeight]);
|
|
421
451
|
|
|
422
452
|
/* ─────────────────────────────────────
|
|
423
|
-
*
|
|
424
|
-
*
|
|
453
|
+
* 受控同步:仅在外部 value 变化,或输入后延迟校验 tick 变化时校验 DOM。
|
|
454
|
+
* contenteditable 不像原生 input 会被 React 自动回写 value;如果父组件
|
|
455
|
+
* 在 onChange 里不回写,DOM 会继续保留用户刚输入的内容,造成“看起来受控,
|
|
456
|
+
* 实际脱离 valueProp”的假受控状态。
|
|
457
|
+
*
|
|
458
|
+
* 不能每次 render 都同步:输入换行会触发高度测量等内部 render,若此时父组件
|
|
459
|
+
* 正常回写 value 尚未完成,就会被旧 valueProp 抢先覆盖 DOM,导致光标跳回行首。
|
|
460
|
+
* 因此输入后用 requestAnimationFrame 延后一拍,只在父组件没回写时兜底。
|
|
425
461
|
*
|
|
426
462
|
* 注:当前阶段还未实现「从 marker 反序列化 chip」,所以重置 DOM 时
|
|
427
463
|
* 只是 textContent= 写入;marker 字符会进入 DOM 当作不可见文本。
|
|
428
464
|
* 同时必须 resetChips(),否则旧的 chip host 已被销毁,但 React state
|
|
429
465
|
* 里残留的 chip 数据会让 portal 渲染挂在 detached node(沉默泄漏)。
|
|
430
466
|
* ───────────────────────────────────── */
|
|
431
|
-
|
|
467
|
+
useLayoutEffect(function () {
|
|
432
468
|
if (!isControlled) return;
|
|
433
469
|
var el = editorRef.current;
|
|
434
470
|
if (!el) return;
|
|
@@ -441,8 +477,9 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
|
|
|
441
477
|
triggerRef.current = null;
|
|
442
478
|
onTriggerChange === null || onTriggerChange === void 0 || onTriggerChange(null);
|
|
443
479
|
}
|
|
480
|
+
syncHeight();
|
|
444
481
|
}
|
|
445
|
-
}, [
|
|
482
|
+
}, [controlledSyncTick, isControlled, onTriggerChange, resetChips, shouldShowPlaceholder, syncHeight, valueProp]);
|
|
446
483
|
|
|
447
484
|
/* ─────────────────────────────────────
|
|
448
485
|
* 输入事件
|
package/dist/composer/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { Attachment, ComposerSegment, SkillItem, SendMeta } from '../_genui-types';
|
|
3
|
+
import type { ChipData } from '../_genui-types';
|
|
3
4
|
import type { ComposerParamPanelContext } from './param-panel';
|
|
4
5
|
import './style';
|
|
5
6
|
export type { ComposerParamPanelContext } from './param-panel';
|
|
@@ -18,8 +19,15 @@ export interface ComposerRef {
|
|
|
18
19
|
* 用于"外部面板(Welcome Card / Suggestions)点 skill 后塞进 composer"等场景;
|
|
19
20
|
* 内部 toolbar 按钮 / `/` trigger 已自带插入路径,无需调用此方法。
|
|
20
21
|
* 调用后会自动 focus editor,光标停在 chip 之后。
|
|
22
|
+
*
|
|
23
|
+
* 返回插入的 chip 实例 id,可用于后续 `updateChipData` 更新状态。
|
|
24
|
+
*/
|
|
25
|
+
insertSkill: (skill: SkillItem) => string;
|
|
26
|
+
/**
|
|
27
|
+
* 更新编辑器内指定 chip 的数据(partial merge)。
|
|
28
|
+
* 典型用法:`updateChipData(chipId, { state: 'pending' })` 将 chip 置为待补充态。
|
|
21
29
|
*/
|
|
22
|
-
|
|
30
|
+
updateChipData: (id: string, patch: Partial<ChipData>) => void;
|
|
23
31
|
/**
|
|
24
32
|
* 底层输入区根元素。
|
|
25
33
|
* 注:composer 内部已从 textarea 迁移到 contenteditable 实现,类型由
|
|
@@ -42,8 +50,19 @@ export interface ComposerProps {
|
|
|
42
50
|
* `meta`:附件 / 联网搜索等非正文数据;为空时不传。
|
|
43
51
|
*
|
|
44
52
|
* 兼容旧链路(需要单串文本):业务可调 `segmentsToReadableText(segments)`。
|
|
53
|
+
*
|
|
54
|
+
* **返回值语义**:
|
|
55
|
+
* - 返回 `false` 或 `Promise<false>` → 发送失败,**不清空**输入框与附件。
|
|
56
|
+
* - 返回 `void` / `true` 或 `Promise<void | true>` → 发送成功,正常清空。
|
|
57
|
+
* - 不返回(旧用法)→ 视为成功,保持向后兼容。
|
|
58
|
+
*
|
|
59
|
+
* **清空范围(重要)**:组件只清空它自己拥有的内部状态。
|
|
60
|
+
* - `value` / `attachments` 受控时,发送后组件**不会**自动清空也不会
|
|
61
|
+
* 代抛 onChange('') / onAttachmentsChange([]);如需清空,请在 onSend
|
|
62
|
+
* 内自行 `setValue('')` / `setAttachments([])`。
|
|
63
|
+
* - `value` / `attachments` 非受控时,组件按上述返回值语义自动清空。
|
|
45
64
|
*/
|
|
46
|
-
onSend: (segments: ComposerSegment[], meta?: SendMeta) => void
|
|
65
|
+
onSend: (segments: ComposerSegment[], meta?: SendMeta) => void | boolean | Promise<void | boolean>;
|
|
47
66
|
onStop?: () => void;
|
|
48
67
|
isGenerating?: boolean;
|
|
49
68
|
/**
|
package/dist/composer/index.js
CHANGED
|
@@ -1,9 +1,13 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
1
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
3
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
3
4
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
5
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
5
6
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
6
7
|
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function (_e) { function e(_x) { return _e.apply(this, arguments); } e.toString = function () { return _e.toString(); }; return e; }(function (e) { throw e; }), f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function (_e2) { function e(_x2) { return _e2.apply(this, arguments); } e.toString = function () { return _e2.toString(); }; return e; }(function (e) { didErr = true; err = e; }), f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
8
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
|
|
9
|
+
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
10
|
+
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
7
11
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
12
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
9
13
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
@@ -188,10 +192,15 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
188
192
|
(_editorRef$current6 = editorRef.current) === null || _editorRef$current6 === void 0 || _editorRef$current6.insertChip(data);
|
|
189
193
|
(_editorRef$current7 = editorRef.current) === null || _editorRef$current7 === void 0 || _editorRef$current7.focus();
|
|
190
194
|
if (skill.initialState === 'pending') openParamPanel(data.id);
|
|
195
|
+
return data.id;
|
|
196
|
+
},
|
|
197
|
+
updateChipData: function updateChipData(id, patch) {
|
|
198
|
+
var _editorRef$current8;
|
|
199
|
+
return (_editorRef$current8 = editorRef.current) === null || _editorRef$current8 === void 0 ? void 0 : _editorRef$current8.updateChipData(id, patch);
|
|
191
200
|
},
|
|
192
201
|
get nativeElement() {
|
|
193
|
-
var _editorRef$current$na, _editorRef$
|
|
194
|
-
return (_editorRef$current$na = (_editorRef$
|
|
202
|
+
var _editorRef$current$na, _editorRef$current9;
|
|
203
|
+
return (_editorRef$current$na = (_editorRef$current9 = editorRef.current) === null || _editorRef$current9 === void 0 ? void 0 : _editorRef$current9.nativeElement) !== null && _editorRef$current$na !== void 0 ? _editorRef$current$na : null;
|
|
195
204
|
}
|
|
196
205
|
};
|
|
197
206
|
});
|
|
@@ -259,24 +268,70 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
259
268
|
* - meta:attachments / webSearch 等非正文数据;都为空时不传
|
|
260
269
|
*
|
|
261
270
|
* 需要单串文本的业务方在 onSend 内自行调 segmentsToReadableText。
|
|
262
|
-
*
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
271
|
+
* onSend 返回 false 或 Promise<false> 时视为发送失败,不清空;否则正常清空。
|
|
272
|
+
*
|
|
273
|
+
* 清空策略按受控/非受控分两条路径——受控时**完全不动** value / attachments,
|
|
274
|
+
* 把决策权留给业务方(在 onSend 内自行 setValue('') / setAttachments([])):
|
|
275
|
+
*
|
|
276
|
+
* - 受控 value:editor.clear() 会直接 innerHTML='' + resetChips(),
|
|
277
|
+
* 若业务方未立即把 valueProp 回写为 '',editor 的受控同步 effect 会用
|
|
278
|
+
* 旧 valueProp 重置 textContent,但 chip host 已销毁、chip state 已清,
|
|
279
|
+
* 导致 chip 永久丢失 + 文本闪一下又回来。
|
|
280
|
+
* 也不能由组件代抛 onChange('')——常见写法 `onChange={setValue}` 会被
|
|
281
|
+
* 立即回写,等于组件强行清空 value,违反受控合约。
|
|
282
|
+
* - 受控 attachments:useControlledState 的 setter 写不进 mergedValue;
|
|
283
|
+
* 也不能代抛 onAttachmentsChange([])——同样会被业务方常见的
|
|
284
|
+
* `onAttachmentsChange={setAttachments}` 直接回写。
|
|
285
|
+
* - webSearch 无受控接口,直接清。 */
|
|
286
|
+
var handleSend = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
|
|
287
|
+
var _editorRef$current$ge2, _editorRef$current10;
|
|
288
|
+
var chips, segments, hasAttachments, meta, hasMeta, result, _editorRef$current11;
|
|
289
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
290
|
+
while (1) switch (_context.prev = _context.next) {
|
|
291
|
+
case 0:
|
|
292
|
+
if (!disabled) {
|
|
293
|
+
_context.next = 2;
|
|
294
|
+
break;
|
|
295
|
+
}
|
|
296
|
+
return _context.abrupt("return");
|
|
297
|
+
case 2:
|
|
298
|
+
chips = (_editorRef$current$ge2 = (_editorRef$current10 = editorRef.current) === null || _editorRef$current10 === void 0 ? void 0 : _editorRef$current10.getChips()) !== null && _editorRef$current$ge2 !== void 0 ? _editorRef$current$ge2 : [];
|
|
299
|
+
segments = rawValueToSegments(text, chips);
|
|
300
|
+
hasAttachments = attachments.length > 0;
|
|
301
|
+
if (!(!segmentsHasContent(segments) && !hasAttachments)) {
|
|
302
|
+
_context.next = 7;
|
|
303
|
+
break;
|
|
304
|
+
}
|
|
305
|
+
return _context.abrupt("return");
|
|
306
|
+
case 7:
|
|
307
|
+
meta = {};
|
|
308
|
+
if (hasAttachments) meta.attachments = attachments;
|
|
309
|
+
if (webSearch) meta.webSearch = true;
|
|
310
|
+
hasMeta = hasAttachments || webSearch;
|
|
311
|
+
_context.next = 13;
|
|
312
|
+
return onSend(segments, hasMeta ? meta : undefined);
|
|
313
|
+
case 13:
|
|
314
|
+
result = _context.sent;
|
|
315
|
+
if (!(result === false)) {
|
|
316
|
+
_context.next = 16;
|
|
317
|
+
break;
|
|
318
|
+
}
|
|
319
|
+
return _context.abrupt("return");
|
|
320
|
+
case 16:
|
|
321
|
+
closeParamPanel();
|
|
322
|
+
if (valueProp === undefined) {
|
|
323
|
+
(_editorRef$current11 = editorRef.current) === null || _editorRef$current11 === void 0 || _editorRef$current11.clear();
|
|
324
|
+
}
|
|
325
|
+
if (attachmentsProp === undefined) {
|
|
326
|
+
setAttachments([]);
|
|
327
|
+
}
|
|
328
|
+
setWebSearch(false);
|
|
329
|
+
case 20:
|
|
330
|
+
case "end":
|
|
331
|
+
return _context.stop();
|
|
332
|
+
}
|
|
333
|
+
}, _callee);
|
|
334
|
+
})), [text, attachments, webSearch, onSend, disabled, closeParamPanel, valueProp, attachmentsProp, setAttachments]);
|
|
280
335
|
|
|
281
336
|
/* ---- File upload ----
|
|
282
337
|
* 三入口(按钮 / 拖入 / 粘贴)共用此函数。先做内置校验(数量、单文件体积、重名),
|
|
@@ -398,14 +453,14 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
398
453
|
var handleSelectSkill = useCallback(function (skill, source) {
|
|
399
454
|
var data = createInvocationChipData(skill);
|
|
400
455
|
if (source === 'trigger') {
|
|
401
|
-
var _editorRef$
|
|
402
|
-
(_editorRef$
|
|
456
|
+
var _editorRef$current12;
|
|
457
|
+
(_editorRef$current12 = editorRef.current) === null || _editorRef$current12 === void 0 || _editorRef$current12.replaceTriggerWithChip(data);
|
|
403
458
|
setTriggerInfo(null);
|
|
404
459
|
} else {
|
|
405
|
-
var _editorRef$
|
|
406
|
-
(_editorRef$
|
|
460
|
+
var _editorRef$current13, _editorRef$current14;
|
|
461
|
+
(_editorRef$current13 = editorRef.current) === null || _editorRef$current13 === void 0 || _editorRef$current13.insertChip(data);
|
|
407
462
|
setToolMenuOpen(false);
|
|
408
|
-
(_editorRef$
|
|
463
|
+
(_editorRef$current14 = editorRef.current) === null || _editorRef$current14 === void 0 || _editorRef$current14.focus();
|
|
409
464
|
}
|
|
410
465
|
if (skill.initialState === 'pending') openParamPanel(data.id);
|
|
411
466
|
}, [openParamPanel]);
|
|
@@ -422,6 +477,10 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
422
477
|
});
|
|
423
478
|
}, [skills, triggerInfo === null || triggerInfo === void 0 ? void 0 : triggerInfo.query]);
|
|
424
479
|
|
|
480
|
+
/* trigger 浮层渲染条件:editor 处于 `/` 触发态 + 业务方传了 skills。
|
|
481
|
+
* `@` 触发本轮不接(mention 数据源待业务接入),onTriggerChange 拿到也不弹。 */
|
|
482
|
+
var triggerMenuVisible = !!(triggerInfo && triggerInfo.trigger === '/' && skills && skills.length > 0);
|
|
483
|
+
|
|
425
484
|
/* query 变化或浮层关闭 → 高亮项重置到第一项。
|
|
426
485
|
* 用 query 而不是 triggerInfo 整体当依赖:rect 变化(光标移位)不应该 reset。 */
|
|
427
486
|
useEffect(function () {
|
|
@@ -433,6 +492,7 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
433
492
|
* - Enter / Tab 选中当前高亮项
|
|
434
493
|
* - Escape 关 menu,焦点保留在 editor */
|
|
435
494
|
var handleTriggerKeyDown = useCallback(function (e) {
|
|
495
|
+
if (!triggerMenuVisible) return false;
|
|
436
496
|
var list = filteredSkills;
|
|
437
497
|
var max = list ? list.length - 1 : -1;
|
|
438
498
|
if (e.key === 'ArrowDown') {
|
|
@@ -456,14 +516,14 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
456
516
|
return true;
|
|
457
517
|
}
|
|
458
518
|
if (e.key === 'Escape') {
|
|
459
|
-
var _editorRef$
|
|
519
|
+
var _editorRef$current15;
|
|
460
520
|
e.preventDefault();
|
|
461
|
-
(_editorRef$
|
|
521
|
+
(_editorRef$current15 = editorRef.current) === null || _editorRef$current15 === void 0 || _editorRef$current15.cancelTrigger();
|
|
462
522
|
setTriggerInfo(null);
|
|
463
523
|
return true;
|
|
464
524
|
}
|
|
465
525
|
return false;
|
|
466
|
-
}, [filteredSkills, triggerActiveIndex]);
|
|
526
|
+
}, [filteredSkills, handleSelectSkill, triggerActiveIndex, triggerMenuVisible]);
|
|
467
527
|
|
|
468
528
|
/* trigger 浮 anchor:跟随 caret 的 0×0 隐形元素,给 Popover 当 children。
|
|
469
529
|
* Popover 需要 DOM children 当 reference,没有"虚拟 anchor" API,只能这么搞。 */
|
|
@@ -693,13 +753,9 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
693
753
|
"data-odn-composer-file-input": true,
|
|
694
754
|
onChange: handleFileChange
|
|
695
755
|
});
|
|
696
|
-
|
|
697
|
-
/* trigger 浮层渲染条件:editor 处于 `/` 触发态 + 业务方传了 skills。
|
|
698
|
-
* `@` 触发本轮不接(mention 数据源待业务接入),onTriggerChange 拿到也不弹。 */
|
|
699
|
-
var triggerMenuVisible = !!(triggerInfo && triggerInfo.trigger === '/' && skills && skills.length > 0);
|
|
700
|
-
var paramPanelNode = function (_editorRef$current$ge3, _editorRef$current15, _boxRef$current) {
|
|
756
|
+
var paramPanelNode = function (_editorRef$current$ge3, _editorRef$current16, _boxRef$current) {
|
|
701
757
|
if (!paramEdit || !renderParamPanel) return null;
|
|
702
|
-
var chips = (_editorRef$current$ge3 = (_editorRef$
|
|
758
|
+
var chips = (_editorRef$current$ge3 = (_editorRef$current16 = editorRef.current) === null || _editorRef$current16 === void 0 ? void 0 : _editorRef$current16.getChips()) !== null && _editorRef$current$ge3 !== void 0 ? _editorRef$current$ge3 : [];
|
|
703
759
|
var chip = chips.find(function (c) {
|
|
704
760
|
return c.id === paramEdit.chipId;
|
|
705
761
|
});
|
|
@@ -709,8 +765,8 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
709
765
|
chip: chip,
|
|
710
766
|
anchor: paramEdit.anchor,
|
|
711
767
|
onApply: function onApply(patch) {
|
|
712
|
-
var _editorRef$
|
|
713
|
-
(_editorRef$
|
|
768
|
+
var _editorRef$current17;
|
|
769
|
+
(_editorRef$current17 = editorRef.current) === null || _editorRef$current17 === void 0 || _editorRef$current17.updateChipData(chip.id, patch);
|
|
714
770
|
},
|
|
715
771
|
onClose: closeParamPanel
|
|
716
772
|
};
|
|
@@ -774,8 +830,8 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
|
|
|
774
830
|
visible: triggerMenuVisible,
|
|
775
831
|
onVisibleChange: function onVisibleChange(v) {
|
|
776
832
|
if (!v) {
|
|
777
|
-
var _editorRef$
|
|
778
|
-
(_editorRef$
|
|
833
|
+
var _editorRef$current18;
|
|
834
|
+
(_editorRef$current18 = editorRef.current) === null || _editorRef$current18 === void 0 || _editorRef$current18.cancelTrigger();
|
|
779
835
|
setTriggerInfo(null);
|
|
780
836
|
}
|
|
781
837
|
},
|
package/dist/index.d.ts
CHANGED
|
@@ -14,7 +14,7 @@ export { default as Button, type ButtonProps } from './button';
|
|
|
14
14
|
export { default as Calendar, type CalendarProps } from './calendar';
|
|
15
15
|
export { default as Cascader, type CascaderProps } from './cascader';
|
|
16
16
|
export { default as Card, type CardProps, type CardElevation, type CardHeaderProps, type CardHeaderSize } from './card';
|
|
17
|
-
export { default as Chart } from './chart';
|
|
17
|
+
export { default as Chart, type ChartProps } from './chart';
|
|
18
18
|
export { default as Checkbox, type CheckboxGroupProps, type CheckboxProps } from './checkbox';
|
|
19
19
|
export { default as Collapse, type CollapseProps, type CollapseItem } from './collapse';
|
|
20
20
|
export { default as ColorPicker, type ColorPickerProps } from './color-picker';
|
|
@@ -56,6 +56,7 @@ export { default as VirtualList, type VirtualListProps } from './virtual-list';
|
|
|
56
56
|
export { default as ActionBar, type ActionBarProps } from './action-bar';
|
|
57
57
|
export { default as AgentStep, type AgentStepProps, type AgentStepGroupProps } from './agent-step';
|
|
58
58
|
export { default as AgentThink, type AgentThinkProps } from './agent-think';
|
|
59
|
+
export { default as Artifact, type ArtifactProps } from './artifact';
|
|
59
60
|
export { default as Attachments, type AttachmentsProps } from './attachments';
|
|
60
61
|
export { default as CodeBlock, type CodeBlockProps } from './code-block';
|
|
61
62
|
export { default as Composer, type ComposerProps, type ComposerRef } from './composer';
|
|
@@ -69,6 +70,7 @@ export { default as Fab, type FabProps } from './fab';
|
|
|
69
70
|
export { default as MessageImage, type MessageImageProps, type MessageImageItem } from './message-image';
|
|
70
71
|
export { default as PreviewPanel, type PreviewPanelProps } from './preview-panel';
|
|
71
72
|
export { default as Sources, type SourcesProps } from './sources';
|
|
73
|
+
export { default as Provenance, type ProvenanceProps, type ProvenanceType } from './provenance';
|
|
72
74
|
export { default as StreamText, type StreamTextProps, type TypographyOverrides } from './stream-text';
|
|
73
75
|
export { default as Suggestions, type SuggestionsProps } from './suggestions';
|
|
74
76
|
export { default as UserBubble, type UserBubbleProps } from './user-bubble';
|
package/dist/index.js
CHANGED
|
@@ -62,6 +62,7 @@ export { default as VirtualList } from "./virtual-list";
|
|
|
62
62
|
export { default as ActionBar } from "./action-bar";
|
|
63
63
|
export { default as AgentStep } from "./agent-step";
|
|
64
64
|
export { default as AgentThink } from "./agent-think";
|
|
65
|
+
export { default as Artifact } from "./artifact";
|
|
65
66
|
export { default as Attachments } from "./attachments";
|
|
66
67
|
export { default as CodeBlock } from "./code-block";
|
|
67
68
|
export { default as Composer } from "./composer";
|
|
@@ -74,6 +75,7 @@ export { default as Fab } from "./fab";
|
|
|
74
75
|
export { default as MessageImage } from "./message-image";
|
|
75
76
|
export { default as PreviewPanel } from "./preview-panel";
|
|
76
77
|
export { default as Sources } from "./sources";
|
|
78
|
+
export { default as Provenance } from "./provenance";
|
|
77
79
|
export { default as StreamText } from "./stream-text";
|
|
78
80
|
export { default as Suggestions } from "./suggestions";
|
|
79
81
|
export { default as UserBubble } from "./user-bubble";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "one-design-next",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.21",
|
|
4
4
|
"description": "One Design Next from TAD@tencent.com",
|
|
5
5
|
"packageManager": "pnpm@10.33.0",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
"lint:es": "eslint \"{components,test}/**/*.{js,jsx,ts,tsx}\"",
|
|
25
25
|
"prepublishOnly": "father doctor && npm run build",
|
|
26
26
|
"create-component": "node scripts/create-component.js",
|
|
27
|
+
"gen:test": "node scripts/gen-test.mjs",
|
|
27
28
|
"test": "vitest",
|
|
28
29
|
"test:ci": "vitest run",
|
|
29
30
|
"test:visual:update": "UPDATE_VISUAL=1 vitest run",
|
|
@@ -84,6 +85,8 @@
|
|
|
84
85
|
"devDependencies": {
|
|
85
86
|
"@commitlint/cli": "^17.1.2",
|
|
86
87
|
"@commitlint/config-conventional": "^17.1.0",
|
|
88
|
+
"@fontsource/jetbrains-mono": "^5.2.8",
|
|
89
|
+
"@fontsource/noto-sans-sc": "^5.2.9",
|
|
87
90
|
"@tailwindcss/postcss": "^4",
|
|
88
91
|
"@tailwindcss/vite": "^4.3.0",
|
|
89
92
|
"@testing-library/dom": "^10.4.1",
|