@lobehub/ui 1.29.2 → 1.30.0

package/es/DraggablePanel/components/DraggablePanelBody.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { type DivProps } from "../../types";
+export declare type DraggablePanelBodyProps = DivProps;
+declare const DraggablePanelBody: import("react").NamedExoticComponent<DivProps>;
+export default DraggablePanelBody;

package/es/DraggablePanel/components/DraggablePanelBody.js

@@ -0,0 +1,22 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["className", "children"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { memo } from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+var DraggablePanelBody = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+    className: cx(styles.body, className)
+  }, props), {}, {
+    children: children
+  }));
+});
+export default DraggablePanelBody;

package/es/DraggablePanel/components/DraggablePanelContainer.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { type DivProps } from "../../types";
+export declare type DraggablePanelContainerProps = DivProps;
+declare const DraggablePanelContainer: import("react").NamedExoticComponent<DivProps>;
+export default DraggablePanelContainer;

package/es/DraggablePanel/components/DraggablePanelContainer.js

@@ -0,0 +1,22 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["className", "children"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { memo } from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+var DraggablePanelContainer = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+    className: cx(styles.container, className)
+  }, props), {}, {
+    children: children
+  }));
+});
+export default DraggablePanelContainer;

package/es/DraggablePanel/components/DraggablePanelFooter.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { type DivProps } from "../../types";
+export declare type DraggablePanelFooterProps = DivProps;
+declare const DraggablePanelFooter: import("react").NamedExoticComponent<DivProps>;
+export default DraggablePanelFooter;

package/es/DraggablePanel/components/DraggablePanelFooter.js

@@ -0,0 +1,22 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["className", "children"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { memo } from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+var DraggablePanelFooter = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+    className: cx(styles.footer, className)
+  }, props), {}, {
+    children: children
+  }));
+});
+export default DraggablePanelFooter;

package/es/DraggablePanel/components/DraggablePanelHeader.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { type DivProps } from "../../types";
+export interface DraggablePanelHeaderProps extends DivProps {
+    pin: boolean;
+    position?: 'left' | 'right';
+    setExpand: (expand: boolean) => void;
+    setPin: (pin: boolean) => void;
+    title: string;
+}
+declare const DraggablePanelHeader: import("react").NamedExoticComponent<DraggablePanelHeaderProps>;
+export default DraggablePanelHeader;

package/es/DraggablePanel/components/DraggablePanelHeader.js

@@ -0,0 +1,51 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["pin", "setPin", "className", "setExpand", "title", "position"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { ActionIcon } from "../..";
+import { PanelLeft, Pin, PinOff } from 'lucide-react';
+import { memo } from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var DraggablePanelHeader = /*#__PURE__*/memo(function (_ref) {
+  var pin = _ref.pin,
+    setPin = _ref.setPin,
+    className = _ref.className,
+    setExpand = _ref.setExpand,
+    title = _ref.title,
+    _ref$position = _ref.position,
+    position = _ref$position === void 0 ? 'left' : _ref$position,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  var panelIcon = /*#__PURE__*/_jsx(ActionIcon, {
+    icon: PanelLeft,
+    onClick: function onClick() {
+      return setExpand(false);
+    },
+    size: {
+      blockSize: 24,
+      fontSize: 14
+    }
+  });
+  var pinIcon = /*#__PURE__*/_jsx(ActionIcon, {
+    active: pin,
+    icon: pin ? Pin : PinOff,
+    onClick: function onClick() {
+      return setPin(!pin);
+    },
+    size: {
+      blockSize: 24,
+      fontSize: 14
+    }
+  });
+  return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
+    className: cx(styles.header, className)
+  }, props), {}, {
+    children: [position === 'left' ? panelIcon : pinIcon, title, position === 'left' ? pinIcon : panelIcon]
+  }));
+});
+export default DraggablePanelHeader;

package/es/DraggablePanel/components/style.d.ts

@@ -0,0 +1,6 @@
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    body: import("antd-style").SerializedStyles;
+    container: import("antd-style").SerializedStyles;
+    footer: import("antd-style").SerializedStyles;
+    header: import("antd-style").SerializedStyles;
+}>;

package/es/DraggablePanel/components/style.js

@@ -0,0 +1,13 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref) {
+  var css = _ref.css,
+    token = _ref.token;
+  return {
+    body: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    overflow-x: hidden;\n    overflow-y: auto;\n    flex: 1;\n    padding: 16px;\n  "]))),
+    container: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    position: relative;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n  "]))),
+    footer: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    display: flex;\n    flex: 0;\n    gap: 8px;\n    align-items: center;\n    justify-content: flex-start;\n\n    padding: 8px 16px;\n\n    border-top: 1px solid ", ";\n  "])), token.colorBorderSecondary),
+    header: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    display: flex;\n    flex: 0;\n    gap: 8px;\n    align-items: center;\n    justify-content: space-between;\n\n    padding: 8px 16px;\n\n    font-weight: 500;\n\n    border-bottom: 1px solid ", ";\n  "])), token.colorBorderSecondary)
+  };
+});

package/es/Form/components/FormDivider.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { DividerProps } from 'antd';
+export declare type FormDividerProps = DividerProps;
+declare const Divider: import("react").NamedExoticComponent<DividerProps>;
+export default Divider;

package/es/Form/components/FormDivider.js

@@ -0,0 +1,18 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["style"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { Divider as AntDivider } from 'antd';
+import { memo } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+var Divider = /*#__PURE__*/memo(function (_ref) {
+  var style = _ref.style,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_jsx(AntDivider, _objectSpread({
+    style: _objectSpread({
+      margin: 0
+    }, style)
+  }, props));
+});
+export default Divider;

package/es/Form/components/FormFooter.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { DivProps } from "../../types";
+export declare type FormFooterProps = DivProps;
+declare const FormFooter: import("react").NamedExoticComponent<DivProps>;
+export default FormFooter;

package/es/Form/components/FormFooter.js

@@ -0,0 +1,22 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["className", "children"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { memo } from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+var FormFooter = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+    className: cx(styles.footer, className)
+  }, props), {}, {
+    children: children
+  }));
+});
+export default FormFooter;

package/es/Form/components/FormGroup.d.ts

@@ -0,0 +1,10 @@
+import { type IconProps } from "../..";
+import { type CollapseProps } from 'antd';
+import { type ReactNode } from 'react';
+export interface FormGroupProps extends CollapseProps {
+    children: ReactNode;
+    icon: IconProps['icon'];
+    title: string;
+}
+declare const FormGroup: import("react").NamedExoticComponent<FormGroupProps>;
+export default FormGroup;

package/es/Form/components/FormGroup.js

@@ -0,0 +1,36 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["className", "icon", "title", "children"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { Icon } from "../..";
+import { Collapse } from 'antd';
+import { memo } from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var FormGroup = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    icon = _ref.icon,
+    title = _ref.title,
+    children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsx(Collapse, _objectSpread({
+    className: cx(styles.group, className),
+    defaultActiveKey: [1],
+    items: [{
+      children: children,
+      key: 1,
+      label: /*#__PURE__*/_jsxs("div", {
+        className: styles.title,
+        children: [/*#__PURE__*/_jsx(Icon, {
+          icon: icon
+        }), title]
+      })
+    }]
+  }, props), 1);
+});
+export default FormGroup;

package/es/Form/components/FormItem.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { FormItemProps as AntdFormItemProps } from 'antd';
+export interface FormItemProps extends AntdFormItemProps {
+    desc?: string;
+    divider?: boolean;
+}
+declare const FormItem: import("react").NamedExoticComponent<FormItemProps>;
+export default FormItem;

package/es/Form/components/FormItem.js

@@ -0,0 +1,37 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["desc", "className", "label", "children", "divider"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { Form } from 'antd';
+import { memo } from 'react';
+import FormDivider from "./FormDivider";
+import FormTitle from "./FormTitle";
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var Item = Form.Item;
+var FormItem = /*#__PURE__*/memo(function (_ref) {
+  var desc = _ref.desc,
+    className = _ref.className,
+    label = _ref.label,
+    children = _ref.children,
+    divider = _ref.divider,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [divider && /*#__PURE__*/_jsx(FormDivider, {}), /*#__PURE__*/_jsx(Item, _objectSpread(_objectSpread({
+      className: cx(styles.item, className),
+      label: desc ? /*#__PURE__*/_jsx(FormTitle, {
+        desc: desc,
+        title: String(label)
+      }) : label
+    }, props), {}, {
+      children: children
+    }))]
+  });
+});
+export default FormItem;

package/es/Form/components/FormTitle.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { DivProps } from "../../types";
+export interface FormTitleProps extends DivProps {
+    desc: string;
+    title: string;
+}
+declare const FormTitle: import("react").NamedExoticComponent<FormTitleProps>;
+export default FormTitle;

package/es/Form/components/FormTitle.js

@@ -0,0 +1,21 @@
+import { memo } from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var FormTitle = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    title = _ref.title,
+    desc = _ref.desc;
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return /*#__PURE__*/_jsxs("div", {
+    className: cx(styles.formTitle, className),
+    children: [/*#__PURE__*/_jsx("div", {
+      children: title
+    }), /*#__PURE__*/_jsx("small", {
+      children: desc
+    })]
+  });
+});
+export default FormTitle;

package/es/Form/components/style.d.ts

@@ -0,0 +1,7 @@
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    footer: import("antd-style").SerializedStyles;
+    formTitle: import("antd-style").SerializedStyles;
+    group: import("antd-style").SerializedStyles;
+    item: import("antd-style").SerializedStyles;
+    title: import("antd-style").SerializedStyles;
+}>;

package/es/Form/components/style.js

@@ -0,0 +1,14 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref) {
+  var css = _ref.css,
+    token = _ref.token;
+  return {
+    footer: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n    gap: 8px;\n    justify-content: flex-end;\n  "]))),
+    formTitle: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    position: relative;\n\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n\n    text-align: left;\n\n    > div {\n      font-weight: 500;\n      line-height: 1;\n    }\n\n    > small {\n      display: block;\n\n      line-height: 1.1;\n      color: ", ";\n      word-wrap: break-word;\n      white-space: pre-wrap;\n    }\n  "])), token.colorTextDescription),
+    group: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    .ant-collapse-header {\n      background: ", ";\n      border-radius: 0 !important;\n    }\n\n    .ant-collapse-content {\n      background: transparent;\n    }\n\n    .ant-collapse-content-box {\n      padding-top: 0 !important;\n      padding-bottom: 0 !important;\n    }\n  "])), token.colorFillTertiary),
+    item: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    padding: 8px 0;\n\n    .ant-row {\n      justify-content: space-between;\n\n      > div {\n        flex: unset !important;\n        flex-grow: unset !important;\n      }\n    }\n  "]))),
+    title: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    display: flex;\n    gap: 8px;\n    align-items: center;\n\n    font-size: 16px;\n    font-weight: 600;\n\n    .anticon {\n      color: ", ";\n    }\n  "])), token.colorPrimary)
+  };
+});

package/es/Form/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { FormProps as AntFormProps } from 'antd';
+export declare type FormProps = AntFormProps;
+declare const Form: import("react").NamedExoticComponent<FormProps>;
+export default Form;

package/es/Form/index.js

@@ -0,0 +1,26 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["className"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { Form as AntForm } from 'antd';
+import { memo } from 'react';
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
+var Form = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useStyles = useStyles(),
+    cx = _useStyles.cx,
+    styles = _useStyles.styles;
+  return (
+    /*#__PURE__*/
+    // @ts-ignore
+    _jsx(AntForm, _objectSpread({
+      className: cx(styles.form, className),
+      colon: false,
+      layout: "horizontal"
+    }, props))
+  );
+});
+export default Form;

package/es/Form/style.d.ts

@@ -0,0 +1,4 @@
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    footer: import("antd-style").SerializedStyles;
+    form: import("antd-style").SerializedStyles;
+}>;

package/es/Form/style.js

@@ -0,0 +1,10 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+var _templateObject, _templateObject2;
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref) {
+  var css = _ref.css;
+  return {
+    footer: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n    gap: 8px;\n    justify-content: flex-end;\n  "]))),
+    form: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n\n    .ant-form-item {\n      margin: 0 !important;\n    }\n\n    .ant-form-item .ant-form-item-label > label {\n      height: unset;\n    }\n\n    .ant-row {\n      position: relative;\n      flex-wrap: nowrap;\n    }\n\n    .ant-form-item-label {\n      position: relative;\n      flex: 1;\n      max-width: 100%;\n    }\n\n    .ant-form-item-control {\n      position: relative;\n      flex: 0;\n      min-width: unset !important;\n    }\n  "])))
+  };
+});

package/es/index.d.ts

@@ -10,6 +10,10 @@ export { default as ColorScales, type ColorScalesProps } from './ColorScales';
 export { default as ContextMenu, type ContextMenuProps } from './ContextMenu';
 export { default as CopyButton, type CopyButtonProps } from './CopyButton';
 export { default as DraggablePanel, type DraggablePanelProps } from './DraggablePanel';
+export { default as DraggablePanelBody, type DraggablePanelBodyProps, } from './DraggablePanel/components/DraggablePanelBody';
+export { default as DraggablePanelContainer, type DraggablePanelContainerProps, } from './DraggablePanel/components/DraggablePanelContainer';
+export { default as DraggablePanelFooter, type DraggablePanelFooterProps, } from './DraggablePanel/components/DraggablePanelFooter';
+export { default as DraggablePanelHeader, type DraggablePanelHeaderProps, } from './DraggablePanel/components/DraggablePanelHeader';
 export { default as EditableMessage, type EditableMessageProps } from './EditableMessage';
 export { default as EditableMessageList, type EditableMessageListProps, } from './EditableMessageList';
 export { default as EditableText, type EditableTextProps } from './EditableText';
@@ -17,6 +21,12 @@ export { type FeatureItem, default as Features, type FeaturesProps } from './Fea
 export { default as FluentEmoji, type FluentEmojiProps } from './FluentEmoji';
 export { default as FontLoader, type FontLoaderProps } from './FontLoader';
 export { default as Footer, type FooterProps } from './Footer';
+export { default as Form, type FormProps } from './Form';
+export { default as FormDivider, type FormDividerProps } from './Form/components/FormDivider';
+export { default as FormFooter, type FormFooterProps } from './Form/components/FormFooter';
+export { default as FormGroup, type FormGroupProps } from './Form/components/FormGroup';
+export { default as FormItem, type FormItemProps } from './Form/components/FormItem';
+export { default as FormTitle, type FormTitleProps } from './Form/components/FormTitle';
 export { default as GradientButton, type GradientButtonProps } from './GradientButton';
 export { default as Header, type HeaderProps } from './Header';
 export { default as Hero, type HeroAction, type HeroProps } from './Hero';

package/es/index.js

@@ -9,6 +9,10 @@ export { default as ColorScales } from "./ColorScales";
 export { default as ContextMenu } from "./ContextMenu";
 export { default as CopyButton } from "./CopyButton";
 export { default as DraggablePanel } from "./DraggablePanel";
+export { default as DraggablePanelBody } from "./DraggablePanel/components/DraggablePanelBody";
+export { default as DraggablePanelContainer } from "./DraggablePanel/components/DraggablePanelContainer";
+export { default as DraggablePanelFooter } from "./DraggablePanel/components/DraggablePanelFooter";
+export { default as DraggablePanelHeader } from "./DraggablePanel/components/DraggablePanelHeader";
 export { default as EditableMessage } from "./EditableMessage";
 export { default as EditableMessageList } from "./EditableMessageList";
 export { default as EditableText } from "./EditableText";
@@ -16,6 +20,12 @@ export { default as Features } from "./Features";
 export { default as FluentEmoji } from "./FluentEmoji";
 export { default as FontLoader } from "./FontLoader";
 export { default as Footer } from "./Footer";
+export { default as Form } from "./Form";
+export { default as FormDivider } from "./Form/components/FormDivider";
+export { default as FormFooter } from "./Form/components/FormFooter";
+export { default as FormGroup } from "./Form/components/FormGroup";
+export { default as FormItem } from "./Form/components/FormItem";
+export { default as FormTitle } from "./Form/components/FormTitle";
 export { default as GradientButton } from "./GradientButton";
 export { default as Header } from "./Header";
 export { default as Hero } from "./Hero";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "1.29.2",
+  "version": "1.30.0",
   "description": "Lobe UI is an open-source UI component library for building chatbot web apps",
   "keywords": [
     "lobehub",
@@ -114,6 +114,7 @@
     "@types/react-dom": "^18",
     "@vitest/coverage-v8": "latest",
     "antd-style": "^3",
+    "babel-plugin-antd-style": "^1.0.4",
     "commitlint": "^17",
     "concurrently": "^8",
     "cross-env": "^7",