@tachybase/components 0.23.8

package/lib/form-item/index.js

@@ -0,0 +1,303 @@
+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 __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+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_item_exports = {};
+__export(form_item_exports, {
+  BaseItem: () => BaseItem,
+  FormItem: () => FormItem,
+  default: () => form_item_default
+});
+module.exports = __toCommonJS(form_item_exports);
+var import_react = __toESM(require("react"));
+var import_schema = require("@tachybase/schema");
+var import_icons = require("@ant-design/icons");
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_builtins = require("../__builtins__");
+var import_form_layout = require("../form-layout");
+var import_hooks = require("./hooks");
+var import_style = __toESM(require("./style"));
+__reExport(form_item_exports, require("./hooks"), module.exports);
+__reExport(form_item_exports, require("./types"), module.exports);
+const ICON_MAP = {
+  error: /* @__PURE__ */ import_react.default.createElement(import_icons.CloseCircleOutlined, null),
+  success: /* @__PURE__ */ import_react.default.createElement(import_icons.CheckCircleOutlined, null),
+  warning: /* @__PURE__ */ import_react.default.createElement(import_icons.ExclamationCircleOutlined, null)
+};
+const BaseItem = /* @__PURE__ */ __name(({ children, ...props }) => {
+  const [active, setActive] = (0, import_react.useState)(false);
+  const formLayout = (0, import_hooks.useFormItemLayout)(props);
+  const { containerRef, contentRef, overflow } = (0, import_hooks.useOverflow)();
+  const {
+    label,
+    style,
+    layout,
+    colon = true,
+    addonBefore,
+    addonAfter,
+    asterisk,
+    feedbackStatus,
+    extra,
+    feedbackText,
+    fullness,
+    feedbackLayout,
+    feedbackIcon,
+    getPopupContainer,
+    inset,
+    bordered = true,
+    labelWidth,
+    wrapperWidth,
+    labelCol,
+    wrapperCol,
+    labelAlign,
+    wrapperAlign = "left",
+    size,
+    labelWrap,
+    wrapperWrap,
+    tooltipLayout,
+    tooltip,
+    tooltipIcon
+  } = formLayout;
+  const labelStyle = { ...formLayout.labelStyle };
+  const wrapperStyle = { ...formLayout.wrapperStyle };
+  const prefixCls = (0, import_builtins.usePrefixCls)("formily-item", props);
+  const [wrapSSR, hashId] = (0, import_style.default)(prefixCls);
+  let enableCol = false;
+  if (labelWidth || wrapperWidth) {
+    if (labelWidth) {
+      labelStyle.width = labelWidth === "auto" ? void 0 : labelWidth;
+      labelStyle.maxWidth = labelWidth === "auto" ? void 0 : labelWidth;
+    }
+    if (wrapperWidth) {
+      wrapperStyle.width = wrapperWidth === "auto" ? void 0 : wrapperWidth;
+      wrapperStyle.maxWidth = wrapperWidth === "auto" ? void 0 : wrapperWidth;
+    }
+  }
+  if (labelCol || wrapperCol) {
+    if (!labelStyle.width && !wrapperStyle.width && layout !== "vertical") {
+      enableCol = true;
+    }
+  }
+  const formatChildren = feedbackLayout === "popover" ? /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Popover,
+    {
+      autoAdjustOverflow: true,
+      overlayClassName: `${prefixCls}-popover`,
+      placement: "top",
+      content: /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          className: (0, import_classnames.default)({
+            [`${prefixCls}-${feedbackStatus}-help`]: !!feedbackStatus,
+            [`${prefixCls}-help`]: true
+          })
+        },
+        feedbackStatus ? ICON_MAP[feedbackStatus] : null,
+        " ",
+        feedbackText
+      ),
+      open: !!feedbackText,
+      getPopupContainer
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, children)
+  ) : children;
+  const gridStyles = {};
+  const getOverflowTooltip = /* @__PURE__ */ __name(() => {
+    if (overflow) {
+      return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", null, label), /* @__PURE__ */ import_react.default.createElement("div", null, tooltip));
+    }
+    return tooltip;
+  }, "getOverflowTooltip");
+  const renderLabelText = /* @__PURE__ */ __name(() => {
+    const labelChildren = /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-label-content`, ref: containerRef }, /* @__PURE__ */ import_react.default.createElement("span", { ref: contentRef }, asterisk && /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-asterisk` }, "*"), /* @__PURE__ */ import_react.default.createElement("label", null, label)));
+    if (tooltipLayout === "text" && tooltip || overflow) {
+      return /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { placement: "top", title: getOverflowTooltip() }, labelChildren);
+    }
+    return labelChildren;
+  }, "renderLabelText");
+  const renderTooltipIcon = /* @__PURE__ */ __name(() => {
+    if (tooltip && tooltipLayout === "icon" && !overflow) {
+      return /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-label-tooltip-icon` }, /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { placement: "top", title: tooltip }, tooltipIcon));
+    }
+  }, "renderTooltipIcon");
+  const renderLabel = /* @__PURE__ */ __name(() => {
+    if (!label) return null;
+    return /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: (0, import_classnames.default)({
+          [`${prefixCls}-label`]: true,
+          [`${prefixCls}-label-tooltip`]: tooltip && tooltipLayout === "text" || overflow,
+          [`${prefixCls}-item-col-${labelCol}`]: enableCol && !!labelCol
+        }),
+        style: labelStyle
+      },
+      renderLabelText(),
+      renderTooltipIcon(),
+      label !== " " && /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-colon` }, colon ? ":" : "")
+    );
+  }, "renderLabel");
+  return wrapSSR(
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        ...(0, import_builtins.pickDataProps)(props),
+        style: {
+          ...style,
+          ...gridStyles
+        },
+        "data-grid-span": props.gridSpan,
+        className: (0, import_classnames.default)(
+          props.className,
+          {
+            [`${prefixCls}`]: true,
+            [`${prefixCls}-layout-${layout}`]: true,
+            [`${prefixCls}-${feedbackStatus}`]: !!feedbackStatus,
+            [`${prefixCls}-feedback-has-text`]: !!feedbackText,
+            [`${prefixCls}-size-${size}`]: !!size,
+            [`${prefixCls}-feedback-layout-${feedbackLayout}`]: !!feedbackLayout,
+            [`${prefixCls}-fullness`]: !!fullness || !!inset || !!feedbackIcon,
+            [`${prefixCls}-inset`]: !!inset,
+            [`${prefixCls}-active`]: active,
+            [`${prefixCls}-inset-active`]: !!inset && active,
+            [`${prefixCls}-label-align-${labelAlign}`]: true,
+            [`${prefixCls}-control-align-${wrapperAlign}`]: true,
+            [`${prefixCls}-label-wrap`]: !!labelWrap,
+            [`${prefixCls}-control-wrap`]: !!wrapperWrap,
+            [`${prefixCls}-bordered-none`]: bordered === false || !!inset || !!feedbackIcon
+          },
+          hashId
+        ),
+        onFocus: () => {
+          if (feedbackIcon || inset) {
+            setActive(true);
+          }
+        },
+        onBlur: () => {
+          if (feedbackIcon || inset) {
+            setActive(false);
+          }
+        }
+      },
+      renderLabel(),
+      /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          className: (0, import_classnames.default)({
+            [`${prefixCls}-control`]: true,
+            [`${prefixCls}-item-col-${wrapperCol}`]: enableCol && !!wrapperCol && label
+          })
+        },
+        /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${prefixCls}-control-content`) }, addonBefore && /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${prefixCls}-addon-before`) }, addonBefore), /* @__PURE__ */ import_react.default.createElement(
+          "div",
+          {
+            style: wrapperStyle,
+            className: (0, import_classnames.default)({
+              [`${prefixCls}-control-content-component`]: true,
+              [`${prefixCls}-control-content-component-has-feedback-icon`]: !!feedbackIcon
+            })
+          },
+          /* @__PURE__ */ import_react.default.createElement(import_form_layout.FormLayoutShallowContext.Provider, { value: {} }, formatChildren),
+          feedbackIcon && /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${prefixCls}-feedback-icon`) }, feedbackIcon)
+        ), addonAfter && /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${prefixCls}-addon-after`) }, addonAfter)),
+        !!feedbackText && feedbackLayout !== "popover" && feedbackLayout !== "none" && /* @__PURE__ */ import_react.default.createElement(
+          "div",
+          {
+            className: (0, import_classnames.default)({
+              [`${prefixCls}-${feedbackStatus}-help`]: !!feedbackStatus,
+              [`${prefixCls}-help`]: true,
+              [`${prefixCls}-help-enter`]: true,
+              [`${prefixCls}-help-enter-active`]: true
+            })
+          },
+          feedbackText
+        ),
+        extra && /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${prefixCls}-extra`) }, extra)
+      )
+    )
+  );
+}, "BaseItem");
+const FormItem = Object.assign(
+  (0, import_schema.connect)(
+    BaseItem,
+    (0, import_schema.mapProps)((props, field) => {
+      if ((0, import_schema.isVoidField)(field))
+        return {
+          label: field.title || props.label,
+          asterisk: props.asterisk,
+          extra: props.extra || field.description
+        };
+      if (!field) return props;
+      const takeFeedbackStatus = /* @__PURE__ */ __name(() => {
+        if (field.validating) return "pending";
+        return field.decoratorProps.feedbackStatus || field.validateStatus;
+      }, "takeFeedbackStatus");
+      const takeMessage = /* @__PURE__ */ __name(() => {
+        const split = /* @__PURE__ */ __name((messages) => {
+          return messages.reduce((buf, text, index) => {
+            if (!text) return buf;
+            return index < messages.length - 1 ? buf.concat([text, ", "]) : buf.concat([text]);
+          }, []);
+        }, "split");
+        if (field.validating) return;
+        if (props.feedbackText) return props.feedbackText;
+        if (field.selfErrors.length) return split(field.selfErrors);
+        if (field.selfWarnings.length) return split(field.selfWarnings);
+        if (field.selfSuccesses.length) return split(field.selfSuccesses);
+      }, "takeMessage");
+      const takeAsterisk = /* @__PURE__ */ __name(() => {
+        if ("asterisk" in props) {
+          return props.asterisk;
+        }
+        if (field.required && field.pattern !== "readPretty") {
+          return true;
+        }
+        return false;
+      }, "takeAsterisk");
+      return {
+        label: props.label || field.title,
+        feedbackStatus: takeFeedbackStatus(),
+        feedbackText: takeMessage(),
+        asterisk: takeAsterisk(),
+        extra: props.extra || field.description
+      };
+    })
+  ),
+  {
+    BaseItem
+  }
+);
+var form_item_default = FormItem;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BaseItem,
+  FormItem,
+  ...require("./hooks"),
+  ...require("./types")
+});

package/lib/form-item/style/animation.d.ts

@@ -0,0 +1,2 @@
+import { GenerateStyle } from '../../__builtins__';
+export declare const getAnimationStyle: GenerateStyle;

package/lib/form-item/style/animation.js

@@ -0,0 +1,57 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var animation_exports = {};
+__export(animation_exports, {
+  getAnimationStyle: () => getAnimationStyle
+});
+module.exports = __toCommonJS(animation_exports);
+var import_cssinjs = require("@ant-design/cssinjs");
+const antShowHelpIn = new import_cssinjs.Keyframes("antShowHelpIn", {
+  "0%": {
+    transform: "translateY(-5px)",
+    opacity: 0
+  },
+  to: {
+    transform: " translateY(0)",
+    opacity: 1
+  }
+});
+const getAnimationStyle = /* @__PURE__ */ __name((token) => {
+  const { componentCls } = token;
+  const helpCls = `${componentCls}-help`;
+  return {
+    [helpCls]: {
+      "&-appear, &-enter": {
+        animationDuration: "0.3s",
+        animationFillMode: "both",
+        animationPlayState: "paused",
+        opacity: 0,
+        animationTimingFunction: "cubic-bezier(0.645, 0.045, 0.355, 1)",
+        "&-active": {
+          animationPlayState: "running",
+          animationName: antShowHelpIn
+        }
+      }
+    }
+  };
+}, "getAnimationStyle");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getAnimationStyle
+});

package/lib/form-item/style/grid.d.ts

@@ -0,0 +1,2 @@
+import { GenerateStyle } from '../../__builtins__';
+export declare const getGridStyle: GenerateStyle;

package/lib/form-item/style/grid.js

@@ -0,0 +1,50 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var grid_exports = {};
+__export(grid_exports, {
+  getGridStyle: () => getGridStyle
+});
+module.exports = __toCommonJS(grid_exports);
+const getGridStyle = /* @__PURE__ */ __name((token) => {
+  const { componentCls } = token;
+  const colCls = `${componentCls}-item-col`;
+  const genGrid = /* @__PURE__ */ __name((grid) => {
+    return {
+      flex: `0 0 ${grid / 24 * 100}%`,
+      maxWidth: `${grid / 24 * 100}%`
+    };
+  }, "genGrid");
+  const genGrids = /* @__PURE__ */ __name(() => {
+    return Array.from({ length: 24 }, (_, i) => {
+      const gridCls = `${colCls}-${i + 1}`;
+      return {
+        [gridCls]: genGrid(i + 1)
+      };
+    }).reduce((acc, cur) => ({ ...acc, ...cur }), {});
+  }, "genGrids");
+  return {
+    [componentCls]: {
+      ...genGrids()
+    }
+  };
+}, "getGridStyle");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getGridStyle
+});

package/lib/form-item/style/index.d.ts

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