@cloudtower/eagle 0.0.0-double-rc-1 → 0.0.0-no-uikit-0

package/dist/esm/core/TableForm/AddRowButton.js

@@ -0,0 +1,106 @@
+import { PlusAddCreateNew16SecondaryIcon } from '@cloudtower/icons-react';
+import { cx } from '@linaria/core';
+import Button from '../Button/index.js';
+import { AddRowButtonWrapper } from './style.js';
+import { genEmptyRow } from './utils.js';
+import { Typo } from '../Typo/index.js';
+import useParrotTranslation from '../../hooks/useParrotTranslation.js';
+import React__default, { useMemo } from 'react';
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const AddRowButton = (props) => {
+  const {
+    config: { maximum, className, CustomizedButton, buttonProps, text },
+    columns,
+    updateData,
+    data
+  } = props;
+  const { t } = useParrotTranslation();
+  const _a = buttonProps || {}, {
+    disabled: disabledFromProp,
+    onClick
+  } = _a, restButtonProps = __objRest(_a, [
+    "disabled",
+    "onClick"
+  ]);
+  const onAdd = (e, data2) => {
+    const newData = [...data2];
+    const newRow = genEmptyRow(columns);
+    newData.push(newRow);
+    updateData(newData);
+    onClick == null ? void 0 : onClick(e);
+  };
+  const disabled = useMemo(
+    () => disabledFromProp || typeof maximum === "number" && maximum <= data.length,
+    [maximum, data.length, disabledFromProp]
+  );
+  const CustomizedButtonText = useMemo(() => {
+    if (!text)
+      return null;
+    if (typeof text === "string")
+      return text;
+    return text();
+  }, [text]);
+  if (!columns.length) {
+    return null;
+  }
+  return CustomizedButton ? /* @__PURE__ */ React__default.createElement(CustomizedButton, __spreadValues({}, props)) : /* @__PURE__ */ React__default.createElement(AddRowButtonWrapper, { className }, /* @__PURE__ */ React__default.createElement(
+    Button,
+    __spreadProps(__spreadValues({}, restButtonProps), {
+      type: restButtonProps.type || "ordinary",
+      size: restButtonProps.size || "small",
+      prefixIcon: restButtonProps.prefixIcon || /* @__PURE__ */ React__default.createElement(PlusAddCreateNew16SecondaryIcon, null),
+      className: cx(Typo.Label.l3_regular, restButtonProps.className),
+      onClick: (e) => {
+        onAdd(e, data);
+      },
+      disabled
+    }),
+    CustomizedButtonText || t("components.add")
+  ), typeof maximum === "number" ? /* @__PURE__ */ React__default.createElement(
+    "span",
+    {
+      className: cx(
+        Typo.Label.l4_regular,
+        "maximum-desc",
+        disabled && "disabled"
+      )
+    },
+    t("components.maximum_row_count_desc", {
+      count: maximum
+    })
+  ) : null);
+};
+var AddRowButton$1 = AddRowButton;
+
+export { AddRowButton$1 as default };

package/dist/esm/core/TableForm/Columns/AffixColumn.js

@@ -0,0 +1,46 @@
+import { Space, Input } from 'antd';
+import React__default, { useState, useCallback } from 'react';
+import useParrotTranslation from '../../../hooks/useParrotTranslation.js';
+
+const AffixColumnHeaderCell = ({ data, column, onChange, onBlur }) => {
+  const [suffix, setSuffix] = useState("");
+  const [prefix, setPrefix] = useState("");
+  const { t } = useParrotTranslation();
+  const onPrefixChange = useCallback(
+    (e) => {
+      const newPrefix = e.target.value;
+      setPrefix(newPrefix);
+      onChange(newPrefix + suffix);
+    },
+    [suffix, onChange]
+  );
+  const onSuffixChange = useCallback(
+    (e) => {
+      const newSuffix = e.target.value;
+      setSuffix(newSuffix);
+      onChange(prefix + newSuffix);
+    },
+    [prefix, onChange]
+  );
+  return /* @__PURE__ */ React__default.createElement(Space, null, !column.disablePrefix ? /* @__PURE__ */ React__default.createElement(
+    Input,
+    {
+      value: prefix,
+      placeholder: t("components.prefix"),
+      size: "small",
+      onChange: onPrefixChange,
+      onBlur
+    }
+  ) : void 0, !column.disableSuffix ? /* @__PURE__ */ React__default.createElement(
+    Input,
+    {
+      value: suffix,
+      placeholder: t("components.suffix"),
+      size: "small",
+      onChange: onSuffixChange,
+      onBlur
+    }
+  ) : void 0);
+};
+
+export { AffixColumnHeaderCell };

package/dist/esm/core/TableForm/Columns/CheckboxColumn.js

@@ -0,0 +1,32 @@
+import React__default, { useCallback } from 'react';
+import Checkbox from '../../Checkbox/index.js';
+
+const CheckboxColumnHeaderCell = ({ onChange }) => {
+  const _onChange = useCallback(
+    (e) => {
+      onChange(e.target.checked, true);
+    },
+    [onChange]
+  );
+  return /* @__PURE__ */ React__default.createElement(Checkbox, { onChange: _onChange });
+};
+const CheckboxColumnBodyCell = ({ data, column, index, onChange }) => {
+  const value = data[index][column.key] === void 0 ? column.defaultValue : data[index][column.key];
+  const _onChange = useCallback(
+    (e) => {
+      onChange(e.target.checked);
+    },
+    [onChange]
+  );
+  const defaultChecked = column.defaultValue;
+  return /* @__PURE__ */ React__default.createElement(
+    Checkbox,
+    {
+      checked: value,
+      onChange: _onChange,
+      defaultChecked
+    }
+  );
+};
+
+export { CheckboxColumnBodyCell, CheckboxColumnHeaderCell };

package/dist/esm/core/TableForm/Columns/FormItem.js

@@ -0,0 +1,18 @@
+import { Form } from 'antd';
+import React__default from 'react';
+
+const FormItemStyle = "E_f16blduf";
+const FormItem = props => {
+  const {
+    validateStatus,
+    message,
+    children
+  } = props;
+  return /* @__PURE__ */React__default.createElement(Form.Item, {
+    className: FormItemStyle,
+    validateStatus,
+    help: validateStatus && message ? message : void 0
+  }, children);
+};
+
+export { FormItem };

package/dist/esm/core/TableForm/Columns/InputColumn.js

@@ -0,0 +1,114 @@
+import { EyeOutlined, EyeInvisibleOutlined } from '@ant-design/icons';
+import React__default, { useState, useEffect } from 'react';
+import Input from '../../Input/index.js';
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const InputPassword = (props) => {
+  const [showPassword, setShowPassword] = useState(false);
+  useEffect(() => {
+    if (props.visible !== void 0) {
+      setShowPassword(props.visible);
+    }
+  }, [props.visible]);
+  const toggleShowPassword = () => {
+    var _a;
+    setShowPassword(!showPassword);
+    (_a = props == null ? void 0 : props.onVisibleChange) == null ? void 0 : _a.call(props, !showPassword);
+  };
+  const inputType = showPassword ? "text" : "password";
+  return /* @__PURE__ */ React__default.createElement(
+    Input,
+    __spreadProps(__spreadValues({}, props), {
+      type: inputType,
+      suffix: showPassword ? /* @__PURE__ */ React__default.createElement(
+        EyeOutlined,
+        {
+          className: "ant-input-password-icon",
+          onClick: toggleShowPassword
+        }
+      ) : /* @__PURE__ */ React__default.createElement(
+        EyeInvisibleOutlined,
+        {
+          className: "ant-input-password-icon",
+          onClick: toggleShowPassword
+        }
+      )
+    })
+  );
+};
+const CustomInput = (props) => {
+  if (props.type === "password") {
+    return /* @__PURE__ */ React__default.createElement(InputPassword, __spreadValues({}, props));
+  }
+  return /* @__PURE__ */ React__default.createElement(Input, __spreadValues({}, props));
+};
+const InputColumnHeaderCell = ({ disabled, column, onChange, onBlur, onVisibleChange }) => {
+  const _onChange = (e) => {
+    const newValue = e.target.value;
+    onChange(newValue);
+  };
+  return /* @__PURE__ */ React__default.createElement(
+    CustomInput,
+    {
+      type: column.type,
+      placeholder: column.placeholder,
+      disabled,
+      size: "small",
+      onChange: _onChange,
+      onBlur,
+      onVisibleChange
+    }
+  );
+};
+const InputColumnBodyCell = ({
+  data,
+  latestData,
+  column,
+  index,
+  disabled,
+  onChange,
+  onBlur,
+  visible,
+  error
+}) => {
+  const placeHolderValue = column.type === "password" ? "" : latestData[index][column.key];
+  const _onChange = (e) => {
+    const newValue = e.target.value;
+    onChange(newValue);
+  };
+  return /* @__PURE__ */ React__default.createElement(
+    CustomInput,
+    {
+      size: "small",
+      value: data[index][column.key],
+      type: column.type,
+      defaultValue: column.defaultValue,
+      disabled,
+      placeholder: placeHolderValue || column.placeholder,
+      onChange: _onChange,
+      onBlur,
+      visible,
+      error
+    }
+  );
+};
+
+export { InputColumnBodyCell, InputColumnHeaderCell };

package/dist/esm/core/TableForm/Columns/TextColumn.js

@@ -0,0 +1,41 @@
+import { cx } from '@linaria/core';
+import React__default, { useMemo } from 'react';
+import { Typo } from '../../Typo/index.js';
+import { SubtitleStyle, BodyCellTextStyle, BodyCellTextWrapper } from '../style.js';
+
+const TextColumnHeaderCell = ({
+  column
+}) => {
+  return /* @__PURE__ */ React__default.createElement(
+    "p",
+    {
+      className: cx(Typo.Label.l4_regular, SubtitleStyle, column.subTitleColor)
+    },
+    column.subTitle
+  );
+};
+const TextColumnBodyCell = ({ data, column, index }) => {
+  const text = column.displayText || data[index][column.key];
+  const CellDescription = useMemo(() => {
+    var _a, _b;
+    const Result = (_b = (_a = column.renderDescription) == null ? void 0 : _a.call(column, {
+      rowIndex: index,
+      rowData: data[index]
+    })) != null ? _b : null;
+    return typeof Result === "string" ? /* @__PURE__ */ React__default.createElement("p", { className: cx(Typo.Label.l4_regular, "cell-description") }, Result) : Result;
+  }, [index, data, column]);
+  const Text = useMemo(
+    () => /* @__PURE__ */ React__default.createElement("p", { className: cx(Typo.Label.l3_regular, BodyCellTextStyle) }, text),
+    [text]
+  );
+  return /* @__PURE__ */ React__default.createElement(
+    BodyCellTextWrapper,
+    {
+      className: !!CellDescription ? "with-description" : void 0
+    },
+    Text,
+    CellDescription
+  );
+};
+
+export { TextColumnBodyCell, TextColumnHeaderCell };

package/dist/esm/core/TableForm/Columns/index.js

@@ -0,0 +1,21 @@
+import { AffixColumnHeaderCell } from './AffixColumn.js';
+import { CheckboxColumnHeaderCell, CheckboxColumnBodyCell } from './CheckboxColumn.js';
+import { InputColumnHeaderCell, InputColumnBodyCell } from './InputColumn.js';
+import { TextColumnHeaderCell, TextColumnBodyCell } from './TextColumn.js';
+
+const ColumnHeaderImpls = {
+  text: TextColumnHeaderCell,
+  input: InputColumnHeaderCell,
+  password: InputColumnHeaderCell,
+  affix: AffixColumnHeaderCell,
+  checkbox: CheckboxColumnHeaderCell
+};
+const ColumnBodyImpls = {
+  text: TextColumnBodyCell,
+  input: InputColumnBodyCell,
+  password: InputColumnBodyCell,
+  affix: InputColumnBodyCell,
+  checkbox: CheckboxColumnBodyCell
+};
+
+export { ColumnBodyImpls, ColumnHeaderImpls };

package/dist/esm/core/TableForm/TableFormBodyCell.js

@@ -0,0 +1,163 @@
+import { cx } from '@linaria/core';
+import { ColumnBodyImpls } from './Columns/index.js';
+import { FormItem } from './Columns/FormItem.js';
+import { ValidateTriggerType } from './types.js';
+import { Typo } from '../Typo/index.js';
+import React__default, { useState, useEffect, useCallback, useMemo } from 'react';
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const TableFormBodyCell = (props) => {
+  const {
+    column,
+    index: rowIndex,
+    data,
+    latestData,
+    validateTriggerType,
+    isRowError,
+    getRowValidateResult,
+    disabled,
+    onChange,
+    onBlur,
+    validateAll,
+    error
+  } = props;
+  const [validateResult, setValidateResult] = useState();
+  const [isTouched, setIsTouched] = useState(false);
+  const width = typeof column.width === "number" ? column.width + "px" : column.width;
+  const isCellErrorStyle = Boolean((validateResult == null ? void 0 : validateResult.isError) || isRowError);
+  useEffect(() => {
+    if (isTouched)
+      setValidateResult(
+        error ? {
+          msg: error,
+          isError: true
+        } : void 0
+      );
+  }, [error, isTouched]);
+  const triggerValidate = useCallback(
+    (currentValue) => {
+      var _a;
+      const value = currentValue != null ? currentValue : data[rowIndex][column.key];
+      const rowData = __spreadProps(__spreadValues({}, data[rowIndex]), { [column.key]: value });
+      const rowValidateRes = getRowValidateResult(rowData);
+      if (rowValidateRes) {
+        return;
+      }
+      if (column.validator) {
+        const result = (_a = column.validator) == null ? void 0 : _a.call(column, {
+          value,
+          rowIndex,
+          rowData: data[rowIndex]
+        });
+        const isError = result ? typeof result === "string" : false;
+        setValidateResult({ msg: result || "", isError });
+        return;
+      }
+    },
+    [data, rowIndex, column, getRowValidateResult]
+  );
+  useEffect(() => {
+    if (validateAll) {
+      setIsTouched(true);
+      triggerValidate();
+    }
+  }, [validateAll, triggerValidate, setIsTouched]);
+  const _onChange = (value, data2) => {
+    const newData = data2.map(
+      (row, i) => i === rowIndex ? __spreadProps(__spreadValues({}, row), { [column.key]: value }) : row
+    );
+    onChange == null ? void 0 : onChange(newData, rowIndex, column.key);
+    if (validateTriggerType === ValidateTriggerType.Normal && isTouched || validateTriggerType === ValidateTriggerType.Aggressive) {
+      triggerValidate(value);
+    }
+  };
+  const _onBlur = useCallback(() => {
+    setIsTouched(true);
+    triggerValidate();
+    onBlur == null ? void 0 : onBlur(data, rowIndex, column.key);
+  }, [rowIndex, column, onBlur, data, triggerValidate, setIsTouched]);
+  const renderDefaultComponent = () => {
+    if (!column.type)
+      return null;
+    const CellComponent = ColumnBodyImpls[column.type];
+    return /* @__PURE__ */ React__default.createElement(
+      CellComponent,
+      {
+        disabled,
+        data,
+        index: rowIndex,
+        latestData,
+        column,
+        visible: props.visible,
+        error: isCellErrorStyle,
+        onChange: (val) => {
+          _onChange(val, data);
+        },
+        onBlur: _onBlur
+      }
+    );
+  };
+  const Cell = column.render ? column.render({
+    isHeader: false,
+    disabled,
+    placeholder: props.placeholderValue || latestData[rowIndex][column.key],
+    value: data[rowIndex][column.key],
+    onChange: (val) => {
+      _onChange(val, data);
+    },
+    onBlur: _onBlur,
+    rowIndex,
+    error: isCellErrorStyle
+  }) : renderDefaultComponent();
+  const CellDescription = useMemo(() => {
+    var _a;
+    if (column.type === "text")
+      return null;
+    const Result = ((_a = column.renderDescription) == null ? void 0 : _a.call(column, {
+      rowIndex,
+      rowData: data[rowIndex],
+      latestData
+    })) || null;
+    return typeof Result === "string" ? /* @__PURE__ */ React__default.createElement("p", { className: cx(Typo.Label.l4_regular, "cell-description") }, Result) : Result;
+  }, [rowIndex, data, latestData, column]);
+  return /* @__PURE__ */ React__default.createElement(
+    "div",
+    {
+      className: cx("eagle-table-form-cell", `align-${column.align || "left"}`),
+      style: {
+        maxWidth: column.width ? width : "",
+        minWidth: column.width ? width : "",
+        visibility: column.hidden ? "hidden" : "visible"
+      }
+    },
+    /* @__PURE__ */ React__default.createElement(
+      FormItem,
+      {
+        validateStatus: isCellErrorStyle ? "error" : "",
+        message: isRowError ? "" : validateResult == null ? void 0 : validateResult.msg
+      },
+      Cell
+    ),
+    CellDescription
+  );
+};
+
+export { TableFormBodyCell };