@tachybase/components 0.23.8

package/lib/form-button-group/index.js

@@ -0,0 +1,148 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var form_button_group_exports = {};
+__export(form_button_group_exports, {
+  FormButtonGroup: () => FormButtonGroup,
+  default: () => form_button_group_default
+});
+module.exports = __toCommonJS(form_button_group_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_react_sticky_box = __toESM(require("react-sticky-box"));
+var import_builtins = require("../__builtins__");
+var import_form_item = require("../form-item");
+var import_style = __toESM(require("./style"));
+function getInheritedBackgroundColor(el) {
+  const defaultStyle = getDefaultBackground();
+  const backgroundColor = window.getComputedStyle(el).backgroundColor;
+  if (backgroundColor !== defaultStyle) return backgroundColor;
+  if (!el.parentElement) return defaultStyle;
+  return getInheritedBackgroundColor(el.parentElement);
+}
+__name(getInheritedBackgroundColor, "getInheritedBackgroundColor");
+function getDefaultBackground() {
+  const div = document.createElement("div");
+  document.head.appendChild(div);
+  const bg = window.getComputedStyle(div).backgroundColor;
+  document.head.removeChild(div);
+  return bg;
+}
+__name(getDefaultBackground, "getDefaultBackground");
+const FormButtonGroup = /* @__PURE__ */ __name(({
+  align,
+  gutter,
+  ...props
+}) => {
+  const prefixCls = (0, import_builtins.usePrefixCls)("formily-button-group");
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Space,
+    {
+      ...props,
+      size: gutter,
+      className: (0, import_classnames.default)(prefixCls, props.className),
+      style: {
+        ...props.style,
+        justifyContent: align === "left" ? "flex-start" : align === "right" ? "flex-end" : "center",
+        display: "flex"
+      }
+    },
+    props.children
+  );
+}, "FormButtonGroup");
+FormButtonGroup.defaultProps = {
+  align: "left"
+};
+FormButtonGroup.FormItem = ({ gutter, ...props }) => {
+  var _a;
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_form_item.BaseItem,
+    {
+      ...props,
+      label: " ",
+      style: {
+        margin: 0,
+        padding: 0,
+        ...props.style,
+        width: "100%"
+      },
+      colon: false
+    },
+    ((_a = props.children) == null ? void 0 : _a["length"]) ? /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { size: gutter }, props.children) : props.children
+  );
+};
+const _Sticky = /* @__PURE__ */ __name(({
+  align = "left",
+  ...props
+}) => {
+  const ref = (0, import_react.useRef)(null);
+  const [color, setColor] = (0, import_react.useState)("transparent");
+  const prefixCls = (0, import_builtins.usePrefixCls)("formily-button-group");
+  const [wrapSSR, hashId] = (0, import_style.default)(prefixCls);
+  (0, import_react.useLayoutEffect)(() => {
+    if (ref.current) {
+      const computed = getInheritedBackgroundColor(ref.current);
+      if (computed !== color) {
+        setColor(computed);
+      }
+    }
+  });
+  return wrapSSR(
+    /* @__PURE__ */ import_react.default.createElement(
+      import_react_sticky_box.default,
+      {
+        ...props,
+        className: (0, import_classnames.default)(`${prefixCls}-sticky`, hashId, props.className),
+        style: {
+          backgroundColor: color,
+          ...props.style
+        },
+        bottom: true
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          ref,
+          className: `${prefixCls}-sticky-inner`,
+          style: {
+            ...props.style,
+            justifyContent: align === "left" ? "flex-start" : align === "right" ? "flex-end" : "center"
+          }
+        },
+        props.children
+      )
+    )
+  );
+}, "_Sticky");
+FormButtonGroup.Sticky = _Sticky;
+var form_button_group_default = FormButtonGroup;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FormButtonGroup
+});

package/lib/form-button-group/style.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (prefixCls: string) => import("..").UseComponentStyleResult;
+export default _default;

package/lib/form-button-group/style.js

@@ -0,0 +1,41 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var style_exports = {};
+__export(style_exports, {
+  default: () => style_default
+});
+module.exports = __toCommonJS(style_exports);
+var import_builtins = require("./../__builtins__");
+var style_default = (0, import_builtins.genStyleHook)("form-button-group", (token) => {
+  const { componentCls, antCls, colorBorder } = token;
+  return {
+    [componentCls]: {
+      "&-sticky": {
+        padding: "10px 0",
+        borderTop: `1px solid ${colorBorder}`,
+        zIndex: 999,
+        [`${componentCls}-sticky-inner`]: {
+          display: "flex",
+          [`${antCls}-formily-item`]: {
+            flex: 2
+          }
+        }
+      }
+    }
+  };
+});

package/lib/form-collapse/index.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import { ReactFC } from '@tachybase/schema';
+import { CollapsePanelProps, CollapseProps } from 'antd';
+type ActiveKeys = string | number | Array<string | number>;
+type ActiveKey = string | number;
+export interface IFormCollapse {
+    activeKeys: ActiveKeys;
+    hasActiveKey(key: ActiveKey): boolean;
+    setActiveKeys(key: ActiveKeys): void;
+    addActiveKey(key: ActiveKey): void;
+    removeActiveKey(key: ActiveKey): void;
+    toggleActiveKey(key: ActiveKey): void;
+}
+export interface IFormCollapseProps extends CollapseProps {
+    formCollapse?: IFormCollapse;
+}
+export declare const FormCollapse: ReactFC<IFormCollapseProps> & {
+    CollapsePanel: React.FC<React.PropsWithChildren<CollapsePanelProps>>;
+    createFormCollapse: (defaultActiveKeys?: ActiveKeys) => {
+        activeKeys: ActiveKeys;
+        setActiveKeys(keys: ActiveKeys): void;
+        hasActiveKey(key: ActiveKey): boolean;
+        addActiveKey(key: ActiveKey): void;
+        removeActiveKey(key: ActiveKey): void;
+        toggleActiveKey(key: ActiveKey): void;
+    };
+};
+export default FormCollapse;

package/lib/form-collapse/index.js

@@ -0,0 +1,150 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var form_collapse_exports = {};
+__export(form_collapse_exports, {
+  FormCollapse: () => FormCollapse,
+  default: () => form_collapse_default
+});
+module.exports = __toCommonJS(form_collapse_exports);
+var import_react = __toESM(require("react"));
+var import_schema = require("@tachybase/schema");
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_builtins = require("../__builtins__");
+const usePanels = /* @__PURE__ */ __name(() => {
+  const collapseField = (0, import_schema.useField)();
+  const schema = (0, import_schema.useFieldSchema)();
+  const panels = [];
+  schema.mapProperties((schema2, name) => {
+    var _a, _b, _c;
+    const field = collapseField.query(collapseField.address.concat(name)).take();
+    if ((field == null ? void 0 : field.display) === "none" || (field == null ? void 0 : field.display) === "hidden") return;
+    if (((_a = schema2["x-component"]) == null ? void 0 : _a.indexOf("CollapsePanel")) > -1) {
+      const key = ((_b = field == null ? void 0 : field.componentProps) == null ? void 0 : _b.key) || ((_c = schema2 == null ? void 0 : schema2["x-component-props"]) == null ? void 0 : _c.key) || name;
+      panels.push({
+        name,
+        props: {
+          ...schema2 == null ? void 0 : schema2["x-component-props"],
+          ...field == null ? void 0 : field.componentProps,
+          key
+        },
+        schema: schema2
+      });
+    }
+  });
+  return panels;
+}, "usePanels");
+const createFormCollapse = /* @__PURE__ */ __name((defaultActiveKeys) => {
+  const formCollapse = (0, import_schema.model)({
+    activeKeys: defaultActiveKeys,
+    setActiveKeys(keys) {
+      formCollapse.activeKeys = keys;
+    },
+    hasActiveKey(key) {
+      if (Array.isArray(formCollapse.activeKeys)) {
+        if (formCollapse.activeKeys.includes(key)) {
+          return true;
+        }
+      } else if (formCollapse.activeKeys === key) {
+        return true;
+      }
+      return false;
+    },
+    addActiveKey(key) {
+      if (formCollapse.hasActiveKey(key)) return;
+      formCollapse.activeKeys = (0, import_schema.toArr)(formCollapse.activeKeys).concat(key);
+    },
+    removeActiveKey(key) {
+      if (Array.isArray(formCollapse.activeKeys)) {
+        formCollapse.activeKeys = formCollapse.activeKeys.filter((item) => item !== key);
+      } else {
+        formCollapse.activeKeys = "";
+      }
+    },
+    toggleActiveKey(key) {
+      if (formCollapse.hasActiveKey(key)) {
+        formCollapse.removeActiveKey(key);
+      } else {
+        formCollapse.addActiveKey(key);
+      }
+    }
+  });
+  return (0, import_schema.markRaw)(formCollapse);
+}, "createFormCollapse");
+const InternalFormCollapse = (0, import_schema.observer)(({ formCollapse, ...props }) => {
+  const field = (0, import_schema.useField)();
+  const panels = usePanels();
+  const prefixCls = (0, import_builtins.usePrefixCls)("formily-collapse", props);
+  const _formCollapse = (0, import_react.useMemo)(() => {
+    return formCollapse ? formCollapse : createFormCollapse(props.defaultActiveKey);
+  }, []);
+  const takeActiveKeys = /* @__PURE__ */ __name(() => {
+    var _a;
+    if (props.activeKey) return props.activeKey;
+    if (_formCollapse == null ? void 0 : _formCollapse.activeKeys) return _formCollapse == null ? void 0 : _formCollapse.activeKeys;
+    if (props.accordion) return (_a = panels[0]) == null ? void 0 : _a.name;
+    return panels.map((item) => item.name);
+  }, "takeActiveKeys");
+  const badgedHeader = /* @__PURE__ */ __name((key, props2) => {
+    const errors = field.form.queryFeedbacks({
+      type: "error",
+      address: `${field.address.concat(key)}.*`
+    });
+    if (errors.length) {
+      return /* @__PURE__ */ import_react.default.createElement(import_antd.Badge, { size: "small", className: "errors-badge", count: errors.length }, props2.header);
+    }
+    return props2.header;
+  }, "badgedHeader");
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Collapse,
+    {
+      ...props,
+      className: (0, import_classnames.default)(prefixCls, props.className),
+      activeKey: takeActiveKeys(),
+      onChange: (key) => {
+        var _a, _b;
+        (_a = props == null ? void 0 : props.onChange) == null ? void 0 : _a.call(props, key);
+        (_b = _formCollapse == null ? void 0 : _formCollapse.setActiveKeys) == null ? void 0 : _b.call(_formCollapse, key);
+      }
+    },
+    panels.map(({ props: props2, schema, name }, index) => /* @__PURE__ */ import_react.default.createElement(import_antd.Collapse.Panel, { key: index, ...props2, header: badgedHeader(name, props2), forceRender: true }, /* @__PURE__ */ import_react.default.createElement(import_schema.RecursionField, { schema, name })))
+  );
+});
+const CollapsePanel = /* @__PURE__ */ __name(({ children }) => {
+  return /* @__PURE__ */ import_react.default.createElement(import_react.Fragment, null, children);
+}, "CollapsePanel");
+const FormCollapse = Object.assign(InternalFormCollapse, {
+  CollapsePanel,
+  createFormCollapse
+});
+var form_collapse_default = FormCollapse;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FormCollapse
+});

package/lib/form-dialog/index.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import { Form, IFormProps, IMiddleware, ReactFC } from '@tachybase/schema';
+import { ModalProps } from 'antd';
+type FormDialogRenderer = React.ReactElement | ((form: Form) => React.ReactElement);
+type ModalTitle = string | number | React.ReactElement;
+export interface IFormDialog {
+    forOpen(middleware: IMiddleware<IFormProps>): IFormDialog;
+    forConfirm(middleware: IMiddleware<Form>): IFormDialog;
+    forCancel(middleware: IMiddleware<Form>): IFormDialog;
+    open(props?: IFormProps): Promise<any>;
+    close(): void;
+}
+export interface IModalProps extends ModalProps {
+    onOk?: (event: React.MouseEvent<HTMLElement>) => void | boolean;
+    onCancel?: (event: React.MouseEvent<HTMLElement>) => void | boolean;
+    loadingText?: React.ReactNode;
+}
+export declare function FormDialog(title: IModalProps, id: string, renderer: FormDialogRenderer): IFormDialog;
+export declare function FormDialog(title: IModalProps, renderer: FormDialogRenderer): IFormDialog;
+export declare function FormDialog(title: ModalTitle, id: string, renderer: FormDialogRenderer): IFormDialog;
+export declare function FormDialog(title: ModalTitle, renderer: FormDialogRenderer): IFormDialog;
+export declare namespace FormDialog {
+    var Footer: ReactFC;
+    var Portal: ReactFC<import("..").IPortalProps>;
+}
+export default FormDialog;

package/lib/form-dialog/index.js

@@ -0,0 +1,194 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var form_dialog_exports = {};
+__export(form_dialog_exports, {
+  FormDialog: () => FormDialog,
+  default: () => form_dialog_default
+});
+module.exports = __toCommonJS(form_dialog_exports);
+var import_react = __toESM(require("react"));
+var import_schema = require("@tachybase/schema");
+var import_antd = require("antd");
+var import_react_dom = require("react-dom");
+var import_builtins = require("../__builtins__");
+const isModalTitle = /* @__PURE__ */ __name((props) => {
+  return (0, import_schema.isNum)(props) || (0, import_schema.isStr)(props) || (0, import_schema.isBool)(props) || import_react.default.isValidElement(props);
+}, "isModalTitle");
+const getModelProps = /* @__PURE__ */ __name((props) => {
+  if (isModalTitle(props)) {
+    return {
+      title: props
+    };
+  } else {
+    return props;
+  }
+}, "getModelProps");
+function FormDialog(title, id, renderer) {
+  if ((0, import_schema.isFn)(id) || import_react.default.isValidElement(id)) {
+    renderer = id;
+    id = "form-dialog";
+  }
+  const env = {
+    host: document.createElement("div"),
+    form: null,
+    promise: null,
+    openMiddlewares: [],
+    confirmMiddlewares: [],
+    cancelMiddlewares: []
+  };
+  const root = (0, import_builtins.createPortalRoot)(env.host, id);
+  const props = getModelProps(title);
+  const modal = {
+    ...props,
+    afterClose: /* @__PURE__ */ __name(() => {
+      var _a;
+      (_a = props == null ? void 0 : props.afterClose) == null ? void 0 : _a.call(props);
+      root.unmount();
+    }, "afterClose")
+  };
+  const DialogContent = (0, import_schema.observer)(() => {
+    return /* @__PURE__ */ import_react.default.createElement(import_react.Fragment, null, (0, import_schema.isFn)(renderer) ? renderer(env.form) : renderer);
+  });
+  const renderDialog = /* @__PURE__ */ __name((open = true, resolve, reject) => {
+    const { form } = env;
+    if (!form) return null;
+    return /* @__PURE__ */ import_react.default.createElement(import_schema.Observer, null, () => /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Modal,
+      {
+        ...modal,
+        open,
+        confirmLoading: form.submitting,
+        onCancel: (e) => {
+          var _a;
+          if (((_a = modal == null ? void 0 : modal.onCancel) == null ? void 0 : _a.call(modal, e)) !== false) {
+            reject == null ? void 0 : reject();
+          }
+        },
+        onOk: async (e) => {
+          var _a;
+          if (((_a = modal == null ? void 0 : modal.onOk) == null ? void 0 : _a.call(modal, e)) !== false) {
+            resolve == null ? void 0 : resolve();
+          }
+        }
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_schema.FormProvider, { form }, /* @__PURE__ */ import_react.default.createElement(DialogContent, null))
+    ));
+  }, "renderDialog");
+  document.body.appendChild(env.host);
+  const formDialog = {
+    forOpen: /* @__PURE__ */ __name((middleware) => {
+      if ((0, import_schema.isFn)(middleware)) {
+        env.openMiddlewares.push(middleware);
+      }
+      return formDialog;
+    }, "forOpen"),
+    forConfirm: /* @__PURE__ */ __name((middleware) => {
+      if ((0, import_schema.isFn)(middleware)) {
+        env.confirmMiddlewares.push(middleware);
+      }
+      return formDialog;
+    }, "forConfirm"),
+    forCancel: /* @__PURE__ */ __name((middleware) => {
+      if ((0, import_schema.isFn)(middleware)) {
+        env.cancelMiddlewares.push(middleware);
+      }
+      return formDialog;
+    }, "forCancel"),
+    open: /* @__PURE__ */ __name(async (props2) => {
+      if (env.promise) return env.promise;
+      env.promise = new Promise((resolve, reject) => {
+        const run = /* @__PURE__ */ __name(async () => {
+          try {
+            props2 = await (0, import_builtins.loading)(modal.loadingText, () => (0, import_schema.applyMiddleware)(props2, env.openMiddlewares));
+            env.form = env.form || (0, import_schema.createForm)(props2);
+          } catch (e) {
+            reject(e);
+          }
+        }, "run");
+        run();
+        root.render(
+          () => renderDialog(
+            true,
+            () => {
+              var _a;
+              (_a = env.form) == null ? void 0 : _a.submit(async () => {
+                var _a2;
+                await (0, import_schema.applyMiddleware)(env.form, env.confirmMiddlewares);
+                resolve((0, import_schema.toJS)((_a2 = env.form) == null ? void 0 : _a2.values));
+                formDialog.close();
+              }).catch(() => {
+              });
+            },
+            async () => {
+              await (0, import_builtins.loading)(modal.loadingText, () => (0, import_schema.applyMiddleware)(env.form, env.cancelMiddlewares));
+              formDialog.close();
+            }
+          )
+        );
+      });
+      return env.promise;
+    }, "open"),
+    close: /* @__PURE__ */ __name(() => {
+      if (!env.host) return;
+      root.render(() => renderDialog(false));
+    }, "close")
+  };
+  return formDialog;
+}
+__name(FormDialog, "FormDialog");
+const DialogFooter = /* @__PURE__ */ __name((props) => {
+  const ref = (0, import_react.useRef)(null);
+  const [footer, setFooter] = (0, import_react.useState)();
+  const footerRef = (0, import_react.useRef)();
+  const prefixCls = (0, import_builtins.usePrefixCls)("modal");
+  (0, import_react.useLayoutEffect)(() => {
+    var _a;
+    const content = (_a = ref.current) == null ? void 0 : _a.closest(`.${prefixCls}-content`);
+    if (content) {
+      if (!footerRef.current) {
+        footerRef.current = content.querySelector(`.${prefixCls}-footer`);
+        if (!footerRef.current) {
+          footerRef.current = document.createElement("div");
+          footerRef.current.classList.add(`${prefixCls}-footer`);
+          content.appendChild(footerRef.current);
+        }
+      }
+      setFooter(footerRef.current);
+    }
+  });
+  footerRef.current = footer;
+  return /* @__PURE__ */ import_react.default.createElement("div", { ref, style: { display: "none" } }, footer && (0, import_react_dom.createPortal)(props.children, footer));
+}, "DialogFooter");
+FormDialog.Footer = DialogFooter;
+FormDialog.Portal = (0, import_builtins.createPortalProvider)("form-dialog");
+var form_dialog_default = FormDialog;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FormDialog
+});

package/lib/form-drawer/index.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { Form, IFormProps, IMiddleware, ReactFC } from '@tachybase/schema';
+import { DrawerProps } from 'antd';
+type FormDrawerRenderer = React.ReactElement | ((form: Form) => React.ReactElement);
+type DrawerTitle = string | number | React.ReactElement;
+type EventType = React.KeyboardEvent<HTMLDivElement> | React.MouseEvent<HTMLDivElement | HTMLButtonElement>;
+export interface IFormDrawer {
+    forOpen(middleware: IMiddleware<IFormProps>): IFormDrawer;
+    open(props?: IFormProps): Promise<any>;
+    close(): void;
+}
+export interface IDrawerProps extends DrawerProps {
+    onClose?: (e: EventType) => void | boolean;
+    loadingText?: React.ReactNode;
+}
+export declare function FormDrawer(title: IDrawerProps, id: string, renderer: FormDrawerRenderer): IFormDrawer;
+export declare function FormDrawer(title: IDrawerProps, id: FormDrawerRenderer): IFormDrawer;
+export declare function FormDrawer(title: DrawerTitle, id: string, renderer: FormDrawerRenderer): IFormDrawer;
+export declare function FormDrawer(title: DrawerTitle, id: FormDrawerRenderer): IFormDrawer;
+export declare namespace FormDrawer {
+    var Extra: ReactFC;
+    var Footer: ReactFC;
+    var Portal: ReactFC<import("..").IPortalProps>;
+}
+export default FormDrawer;