@yuntijs/ui 1.0.0-beta.70 → 1.0.0-beta.72

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.
@@ -5,12 +5,12 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
5
5
  var _excluded = ["avatarAddon", "onAvatarClick", "avatarProps", "actions", "className", "primary", "loading", "message", "placement", "type", "avatar", "error", "showTitle", "time", "editing", "onChange", "onEditingChange", "messageExtra", "renderMessage", "text", "errorMessage", "onDoubleClick", "fontSize", "markdownProps", "markdownClassname"];
6
6
  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; }
7
7
  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; }
8
- import Actions from '@lobehub/ui/es/ChatItem/components/Actions';
9
- import Avatar from '@lobehub/ui/es/ChatItem/components/Avatar';
10
- import BorderSpacing from '@lobehub/ui/es/ChatItem/components/BorderSpacing';
11
- import ErrorContent from '@lobehub/ui/es/ChatItem/components/ErrorContent';
12
- import Title from '@lobehub/ui/es/ChatItem/components/Title';
13
- import { useStyles } from '@lobehub/ui/es/ChatItem/style';
8
+ import Actions from '@lobehub/ui/es/chat/ChatItem/components/Actions';
9
+ import Avatar from '@lobehub/ui/es/chat/ChatItem/components/Avatar';
10
+ import BorderSpacing from '@lobehub/ui/es/chat/ChatItem/components/BorderSpacing';
11
+ import ErrorContent from '@lobehub/ui/es/chat/ChatItem/components/ErrorContent';
12
+ import Title from '@lobehub/ui/es/chat/ChatItem/components/Title';
13
+ import { useStyles } from '@lobehub/ui/es/chat/ChatItem/style';
14
14
  import { useResponsive } from 'antd-style';
15
15
  import { memo } from 'react';
16
16
  import { Flexbox } from 'react-layout-kit';
@@ -31,5 +31,13 @@ export interface PageHeaderProps extends Omit<React.HTMLAttributes<HTMLDivElemen
31
31
  extraContentRender?: (buttonsElement: React.ReactNode) => React.ReactNode;
32
32
  /** 控制 header 与 content 的分割线,当 bordered 为 true 时,divider 自动设置为 false */
33
33
  divider?: boolean;
34
+ /** PageHeader 各个模块的 className */
35
+ classNames?: {
36
+ titleWrapper?: string;
37
+ title?: string;
38
+ subTitle?: string;
39
+ descriptions?: string;
40
+ extraContent?: string;
41
+ };
34
42
  }
35
43
  export declare const PageHeader: React.FC<PageHeaderProps>;
@@ -1,7 +1,7 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
2
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
4
- var _excluded = ["className", "icon", "title", "titleRender", "subTitle", "status", "descriptions", "descriptionsRender", "extraContent", "extraContentRender", "bordered", "divider"];
4
+ var _excluded = ["className", "classNames", "icon", "title", "titleRender", "subTitle", "status", "descriptions", "descriptionsRender", "extraContent", "extraContentRender", "bordered", "divider"];
5
5
  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; }
6
6
  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; }
7
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(_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 e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
@@ -21,6 +21,7 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
21
21
  var Paragraph = Typography.Paragraph;
22
22
  export var PageHeader = function PageHeader(props) {
23
23
  var className = props.className,
24
+ classNames = props.classNames,
24
25
  icon = props.icon,
25
26
  title = props.title,
26
27
  titleRender = props.titleRender,
@@ -55,14 +56,14 @@ export var PageHeader = function PageHeader(props) {
55
56
  }, [icon, subTitle]);
56
57
  var TitleNode = useMemo(function () {
57
58
  var titleElement = /*#__PURE__*/_jsx("span", {
58
- className: styles.title,
59
+ className: cx(styles.title, classNames === null || classNames === void 0 ? void 0 : classNames.title),
59
60
  children: title
60
61
  });
61
62
  if (titleRender) {
62
63
  return titleRender(titleElement);
63
64
  }
64
65
  return titleElement;
65
- }, [styles.title, title, titleRender]);
66
+ }, [classNames === null || classNames === void 0 ? void 0 : classNames.title, cx, styles.title, title, titleRender]);
66
67
  var DescriptionsNode = useMemo(function () {
67
68
  var descriptionsElement = [];
68
69
  var _iterator = _createForOfIteratorHelper(descriptions.filter(function (d) {
@@ -139,7 +140,7 @@ export var PageHeader = function PageHeader(props) {
139
140
  active: true,
140
141
  size: 25
141
142
  }), subTitle && /*#__PURE__*/_jsx("div", {
142
- className: styles.subTitle,
143
+ className: cx(styles.subTitle, className),
143
144
  children: /*#__PURE__*/_jsx(Skeleton.Input, {
144
145
  active: true,
145
146
  size: 18
@@ -175,10 +176,10 @@ export var PageHeader = function PageHeader(props) {
175
176
  justify: "space-between",
176
177
  vertical: true,
177
178
  children: [/*#__PURE__*/_jsxs(Flex, {
178
- className: styles.titleBox,
179
+ className: cx(styles.titleBox, classNames === null || classNames === void 0 ? void 0 : classNames.titleWrapper),
179
180
  vertical: true,
180
181
  children: [TitleNode, subTitle && /*#__PURE__*/_jsx(Paragraph, {
181
- className: styles.subTitle,
182
+ className: cx(styles.subTitle, classNames === null || classNames === void 0 ? void 0 : classNames.subTitle),
182
183
  ellipsis: {
183
184
  rows: 2
184
185
  },
@@ -186,12 +187,13 @@ export var PageHeader = function PageHeader(props) {
186
187
  })]
187
188
  }), /*#__PURE__*/_jsxs(Flex, {
188
189
  align: "center",
189
- className: styles.descriptions,
190
+ className: cx(styles.descriptions, classNames === null || classNames === void 0 ? void 0 : classNames.descriptions),
190
191
  gap: 4,
191
192
  children: [status && /*#__PURE__*/_jsx(Status, _objectSpread({}, status)), DescriptionsNode]
192
193
  })]
193
194
  }), /*#__PURE__*/_jsx(Flex, {
194
195
  align: "center",
196
+ className: classNames === null || classNames === void 0 ? void 0 : classNames.extraContent,
195
197
  flex: "1",
196
198
  justify: "flex-end",
197
199
  children: ExtraContentNode
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ interface WaveformIconProps {
3
+ height?: number;
4
+ width?: number;
5
+ lineColor?: string;
6
+ bgColor?: string;
7
+ }
8
+ export declare const WaveformIcon: React.FC<WaveformIconProps>;
9
+ export {};
@@ -0,0 +1,51 @@
1
+ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
2
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
3
+ import { createStyles, keyframes } from 'antd-style';
4
+ import React from 'react';
5
+ import { jsx as _jsx } from "react/jsx-runtime";
6
+ import { jsxs as _jsxs } from "react/jsx-runtime";
7
+ var useStyles = createStyles(function (_ref, props) {
8
+ var css = _ref.css;
9
+ var dance1 = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n 0% {\n transform: scaleY(0.4)\n }\n 50% {\n transform: scaleY(0.2)\n }\n 100% {\n transform: scaleY(0.5)\n }\n "])));
10
+ var dance2 = keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n 0% {\n transform: scaleY(0.7)\n }\n 50% {\n transform: scaleY(0.4)\n }\n 100% {\n transform: scaleY(0.7)\n }\n "])));
11
+ var dance3 = keyframes(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n 0% {\n transform: scaleY(0.9)\n }\n 50% {\n transform: scaleY(0.7)\n }\n 100% {\n transform: scaleY(0.9)\n }\n "])));
12
+ return {
13
+ box: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: relative;\n\n display: flex;\n align-items: center;\n justify-content: space-evenly;\n\n width: ", "px;\n height: ", "px;\n\n background-color: ", ";\n "])), props.width || 34, props.height || 22, props.bgColor || 'transparent'),
14
+ line: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: inline-block;\n\n width: 3px;\n height: 90%;\n\n background-color: ", ";\n border: none;\n border-radius: 30%;\n "])), props.lineColor || '#000'),
15
+ animate1: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n animation: ", " 500ms ease-in infinite alternate;\n "])), dance1),
16
+ animate2: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n animation: ", " 500ms ease-out infinite alternate;\n "])), dance2),
17
+ animate3: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n animation: ", " 500ms ease-in infinite alternate;\n "])), dance3)
18
+ };
19
+ });
20
+ export var WaveformIcon = function WaveformIcon(_ref2) {
21
+ var height = _ref2.height,
22
+ width = _ref2.width,
23
+ lineColor = _ref2.lineColor,
24
+ bgColor = _ref2.bgColor;
25
+ var _useStyles = useStyles({
26
+ height: height,
27
+ width: width,
28
+ lineColor: lineColor,
29
+ bgColor: bgColor
30
+ }),
31
+ styles = _useStyles.styles,
32
+ cx = _useStyles.cx;
33
+ return /*#__PURE__*/_jsxs("div", {
34
+ className: styles.box,
35
+ children: [/*#__PURE__*/_jsx("div", {
36
+ className: cx(styles.line, styles.animate1)
37
+ }), /*#__PURE__*/_jsx("div", {
38
+ className: cx(styles.line, styles.animate2)
39
+ }), /*#__PURE__*/_jsx("div", {
40
+ className: cx(styles.line, styles.animate3)
41
+ }), /*#__PURE__*/_jsx("div", {
42
+ className: cx(styles.line, styles.animate2)
43
+ }), /*#__PURE__*/_jsx("div", {
44
+ className: cx(styles.line, styles.animate1)
45
+ }), /*#__PURE__*/_jsx("div", {
46
+ className: cx(styles.line, styles.animate2)
47
+ }), /*#__PURE__*/_jsx("div", {
48
+ className: cx(styles.line, styles.animate1)
49
+ })]
50
+ });
51
+ };
package/es/index.d.ts CHANGED
@@ -32,6 +32,7 @@ export * from './EditableMessage';
32
32
  export * from './Highlighter';
33
33
  export * from './styles';
34
34
  export * from './useSpeechSynthes';
35
+ export * from './WaveformIcon';
35
36
  export { Affix, type AffixProps, Anchor, type AnchorProps, type MentionProps as AntdMentionProps, Mentions as AntdMentions, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, BackTop, type BackTopProps, Badge, // @todo composed type
36
37
  type BadgeProps, Button, // @todo dependence unifiedLink. link type, hover primary color, back button
37
38
  type ButtonProps, Calendar, type CalendarProps, Carousel, type CarouselProps, Cascader, type CascaderProps, Checkbox, type CheckboxProps, Col, Collapse, type CollapseProps, ColorPicker, type ColorPickerProps, type ColProps, // @todo center style
package/es/index.js CHANGED
@@ -38,6 +38,7 @@ export * from "./styles";
38
38
 
39
39
  // ~ custom @lobehub/tts
40
40
  export * from "./useSpeechSynthes";
41
+ export * from "./WaveformIcon";
41
42
 
42
43
  // ~ antd
43
44
  export { Affix, Anchor, Mentions as AntdMentions, AutoComplete, Avatar, BackTop, Badge // @todo composed type
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yuntijs/ui",
3
- "version": "1.0.0-beta.70",
3
+ "version": "1.0.0-beta.72",
4
4
  "description": "☁️ Yunti UI - an open-source UI component library for building Cloud Native web apps",
5
5
  "keywords": [
6
6
  "yuntijs",
@@ -87,7 +87,7 @@
87
87
  "@lexical/text": "^0.16.1",
88
88
  "@lexical/utils": "^0.16.1",
89
89
  "@lobehub/tts": "^1.25.1",
90
- "@lobehub/ui": "^1.147.0",
90
+ "@lobehub/ui": "^1.153.16",
91
91
  "@melloware/react-logviewer": "^5.2.0",
92
92
  "@monaco-editor/loader": "^1.4.0",
93
93
  "@shikijs/transformers": "^1.10.3",