@rainbow-oh/yee-c 0.1.0 → 0.2.0

package/dist/esm/Anchor/anchor-item.js

@@ -26,14 +26,17 @@ var AnchorItem = function AnchorItem(props) {
   var _useContext = useContext(AnchorContext),
     prefixCls = _useContext.prefixCls,
     activeKey = _useContext.activeKey,
-    onClick = _useContext.onClick;
+    onClick = _useContext.onClick,
+    classNames = _useContext.classNames,
+    styles = _useContext.styles;
+  var isActive = targetKey === activeKey;
   var handleClick = function handleClick(e) {
     e.preventDefault();
     e.stopPropagation();
     onClick === null || onClick === void 0 || onClick(targetKey);
   };
-  var cls = clsx("".concat(prefixCls, "-item"), _defineProperty(_defineProperty({}, "".concat(prefixCls, "-item-active"), targetKey === activeKey), "".concat(prefixCls, "-item-").concat(status), status), className);
-  var itemStyle = _objectSpread(_objectSpread({}, style), {}, {
+  var cls = clsx("".concat(prefixCls, "-item"), _defineProperty(_defineProperty({}, "".concat(prefixCls, "-item-active"), isActive), "".concat(prefixCls, "-item-").concat(status), status), className, isActive && (classNames === null || classNames === void 0 ? void 0 : classNames.active));
+  var itemStyle = _objectSpread(_objectSpread(_objectSpread({}, style), isActive ? styles === null || styles === void 0 ? void 0 : styles.active : undefined), {}, {
     paddingLeft: "".concat(level * INDENT_WIDTH, "px")
   });
   var renderItem = /*#__PURE__*/React.createElement("li", _extends({

package/dist/esm/Anchor/anchor.js

@@ -61,12 +61,19 @@ var Anchor = /*#__PURE__*/forwardRef(function (baseprops, ref) {
     anchorList = _useState2[0],
     setAnchorList = _useState2[1];
   var containerRef = useRef(null);
+  var activeKeyRef = useRef(mergedActiveKey);
+  useEffect(function () {
+    activeKeyRef.current = mergedActiveKey;
+  }, [mergedActiveKey]);
 
   // Auto-generate anchor list from DOM
   var generateAnchorList = useCallback(function () {
     if (!auto || !name) return;
     var list = [];
-    var elements = document.querySelectorAll("[data-anchor-group=\"".concat(name, "\"]"));
+    // Escape `name` before interpolating into the attribute selector: a raw
+    // value containing quotes / brackets / backslashes would either break the
+    // selector (throwing) or open an injection vector.
+    var elements = document.querySelectorAll("[data-anchor-group=\"".concat(CSS.escape(name), "\"]"));
     elements.forEach(function (element) {
       var key = element.getAttribute('id') || '';
       var title = element.getAttribute('data-anchor-title') || '';
@@ -86,6 +93,12 @@ var Anchor = /*#__PURE__*/forwardRef(function (baseprops, ref) {
       generateAnchorList();
     }
   }, [auto, generateAnchorList]);
+  var getTargetOffsetTop = useCallback(function (target) {
+    var container = containerRef.current;
+    var containerTop = container === window ? 0 : container.getBoundingClientRect().top;
+    var currentScroll = container === window ? window.scrollY : container.scrollTop;
+    return currentScroll + (target.getBoundingClientRect().top - containerTop);
+  }, []);
 
   // Handle scroll to update active key
   var handleScroll = useCallback(function () {
@@ -100,27 +113,28 @@ var Anchor = /*#__PURE__*/forwardRef(function (baseprops, ref) {
       var item = currentItems[i];
       var target = document.getElementById(item.key);
       if (target) {
-        var targetTop = target.offsetTop;
+        var targetTop = getTargetOffsetTop(target);
         if (scrollTop + offsetTop >= targetTop) {
-          setMergedActiveKey(item.key);
-          onChange === null || onChange === void 0 || onChange(item.key);
+          if (activeKeyRef.current !== item.key) {
+            setMergedActiveKey(item.key);
+            onChange === null || onChange === void 0 || onChange(item.key);
+          }
           break;
         }
       }
     }
-  }, [auto, anchorList, items, offsetTop, onChange]);
+  }, [auto, anchorList, items, offsetTop, onChange, getTargetOffsetTop]);
   useEffect(function () {
-    var container = getContainer ? getContainer() : window;
-    containerRef.current = container;
-    if (container && typeof activeKey === 'undefined') {
-      var debouncedScroll = debounce(handleScroll, 100);
-      container.addEventListener('scroll', debouncedScroll);
-      handleScroll();
-      return function () {
-        container.removeEventListener('scroll', debouncedScroll);
-      };
-    }
-  }, [getContainer, handleScroll, activeKey]);
+    var container = containerRef.current;
+    if (!container) return;
+    var debouncedScroll = debounce(handleScroll, 100);
+    container.addEventListener('scroll', debouncedScroll);
+    handleScroll();
+    return function () {
+      container.removeEventListener('scroll', debouncedScroll);
+      debouncedScroll.cancel();
+    };
+  }, [getContainer, handleScroll]);
 
   // Scroll to target when activeKey changes
   var scrollToAnchor = useCallback(function (key) {
@@ -128,7 +142,7 @@ var Anchor = /*#__PURE__*/forwardRef(function (baseprops, ref) {
     if (!target) return;
     var container = containerRef.current;
     if (!container) return;
-    var targetTop = target.offsetTop - offsetTop;
+    var targetTop = getTargetOffsetTop(target) - offsetTop;
     if (container === window) {
       window.scrollTo({
         top: targetTop,
@@ -140,7 +154,10 @@ var Anchor = /*#__PURE__*/forwardRef(function (baseprops, ref) {
         behavior: 'smooth'
       });
     }
-  }, [offsetTop]);
+  }, [offsetTop, getTargetOffsetTop]);
+  useLayoutEffect(function () {
+    containerRef.current = getContainer ? getContainer() : window;
+  }, [getContainer]);
   useLayoutEffect(function () {
     if (defaultActiveKey) {
       scrollToAnchor(defaultActiveKey);
@@ -158,7 +175,9 @@ var Anchor = /*#__PURE__*/forwardRef(function (baseprops, ref) {
   var contextValue = {
     prefixCls: prefixCls,
     activeKey: mergedActiveKey,
-    onClick: handleItemClick
+    onClick: handleItemClick,
+    classNames: classNames,
+    styles: styles
   };
   var renderNavArrow = function renderNavArrow() {
     if (!affix || direction !== 'vertical') return null;

package/dist/esm/Anchor/demo/auto.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+/**
+ * `auto` mode: the anchor list is generated from the DOM. Decorate each target
+ * section with the following attributes:
+ *   - data-anchor-group="<name>"  must match the Anchor's `name` prop
+ *   - id="<key>"                  used as the anchor key and scroll target
+ *   - data-anchor-title="<title>"  the nav label (required; a section without it is skipped)
+ *   - data-anchor-status="success | error | warning"  optional status badge color
+ */
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/esm/Anchor/demo/auto.js

@@ -0,0 +1,62 @@
+import { Anchor } from "../..";
+import React from 'react';
+
+/**
+ * `auto` mode: the anchor list is generated from the DOM. Decorate each target
+ * section with the following attributes:
+ *   - data-anchor-group="<name>"  must match the Anchor's `name` prop
+ *   - id="<key>"                  used as the anchor key and scroll target
+ *   - data-anchor-title="<title>"  the nav label (required; a section without it is skipped)
+ *   - data-anchor-status="success | error | warning"  optional status badge color
+ */
+export default (function () {
+  return /*#__PURE__*/React.createElement("div", {
+    id: "auto-container",
+    style: {
+      display: 'flex',
+      height: 300,
+      overflow: 'auto'
+    }
+  }, /*#__PURE__*/React.createElement(Anchor, {
+    auto: true,
+    name: "article",
+    affix: false,
+    defaultActiveKey: "auto-intro",
+    getContainer: function getContainer() {
+      return document.getElementById('auto-container');
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      flex: 1,
+      padding: 20
+    }
+  }, /*#__PURE__*/React.createElement("section", {
+    id: "auto-intro",
+    "data-anchor-group": "article",
+    "data-anchor-title": "Introduction",
+    style: {
+      height: 300,
+      background: '#f0f0f0',
+      marginBottom: 20
+    }
+  }, "Introduction"), /*#__PURE__*/React.createElement("section", {
+    id: "auto-usage",
+    "data-anchor-group": "article",
+    "data-anchor-title": "Usage",
+    "data-anchor-status": "success",
+    style: {
+      height: 300,
+      background: '#e0e0e0',
+      marginBottom: 20
+    }
+  }, "Usage"), /*#__PURE__*/React.createElement("section", {
+    id: "auto-caveats",
+    "data-anchor-group": "article",
+    "data-anchor-title": "Caveats",
+    "data-anchor-status": "warning",
+    style: {
+      height: 300,
+      background: '#d0d0d0'
+    }
+  }, "Caveats")));
+});

package/dist/esm/Anchor/demo/basic.js

@@ -14,9 +14,11 @@ export default (function () {
   return /*#__PURE__*/React.createElement("div", {
     id: "basic-container",
     style: {
+      position: 'relative',
       display: 'flex',
       height: '100vh',
-      overflow: 'auto'
+      overflow: 'auto',
+      transform: 'scale(1)'
     }
   }, /*#__PURE__*/React.createElement(Anchor, {
     items: items,

package/dist/esm/Anchor/demo/controlled.js

@@ -5,24 +5,24 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { Anchor } from "../..";
-import React, { useState } from 'react';
+import React, { useRef, useState } from 'react';
 export default (function () {
   var _useState = useState('part1'),
     _useState2 = _slicedToArray(_useState, 2),
     activeKey = _useState2[0],
     setActiveKey = _useState2[1];
+  var containerRef = useRef(null);
   var onChange = function onChange(key) {
     console.log('Anchor changed to:', key);
     setActiveKey(key);
   };
   return /*#__PURE__*/React.createElement("div", {
     style: {
-      display: 'flex'
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      width: '200px'
-    }
+      display: 'flex',
+      height: '200px',
+      overflow: 'auto'
+    },
+    ref: containerRef
   }, /*#__PURE__*/React.createElement(Anchor, {
     items: [{
       key: 'part1',
@@ -34,9 +34,14 @@ export default (function () {
       key: 'part3',
       title: 'Part 3'
     }],
+    direction: "vertical",
+    affix: false,
     activeKey: activeKey,
-    onChange: onChange
-  })), /*#__PURE__*/React.createElement("div", {
+    onChange: onChange,
+    getContainer: function getContainer() {
+      return containerRef.current;
+    }
+  }), /*#__PURE__*/React.createElement("div", {
     style: {
       flex: 1,
       padding: '20px'

package/dist/esm/Anchor/interface.d.ts

@@ -119,4 +119,6 @@ export interface AnchorContextType {
     prefixCls: string;
     activeKey?: string;
     onClick?: (key: string) => void;
+    classNames?: Partial<Record<AnchorSemanticDOM, string>>;
+    styles?: Partial<Record<AnchorSemanticDOM, React.CSSProperties>>;
 }

package/dist/esm/Anchor/style/index.less

@@ -53,7 +53,7 @@
           width: var(--yee-anchor-static-item-active-width);
           height: var(--yee-anchor-static-item-active-height);
           border: none;
-          border-radius: 0;
+          border-radius: var(--yee-anchor-static-item-active-width);
           background-color: var(--yee-anchor-item-active-font-color);
         }
       }
@@ -165,7 +165,7 @@
 
   &-item {
     position: relative;
-    padding: var(--yee-anchor-item-padding);
+    margin: var(--yee-anchor-item-padding);
     white-space: nowrap;
     color: var(--yee-anchor-item-font-color);
     cursor: pointer;

package/dist/esm/Button/button.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import type { ButtonProps } from './interface';
 import './style/index.less';
-declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
 export default Button;

package/dist/esm/Checkbox/checkbox-group.js

@@ -39,6 +39,8 @@ var CheckboxGroup = function CheckboxGroup(baseprops) {
     options = props.options,
     buttonStyle = props.buttonStyle,
     disabled = props.disabled,
+    _props$layout = props.layout,
+    layout = _props$layout === void 0 ? 'horizontal' : _props$layout,
     onChange = props.onChange;
   var _useMergedState = useMergedState([], {
       value: value,
@@ -47,7 +49,7 @@ var CheckboxGroup = function CheckboxGroup(baseprops) {
     _useMergedState2 = _slicedToArray(_useMergedState, 2),
     mergedValue = _useMergedState2[0],
     setMergedValue = _useMergedState2[1];
-  var cls = clsx(prefixCls, _defineProperty(_defineProperty({}, "".concat(prefixCls, "-").concat(buttonStyle), buttonStyle), "".concat(prefixCls, "-disabled"), disabled), className);
+  var cls = clsx(prefixCls, ["".concat(prefixCls, "-").concat(layout)], _defineProperty(_defineProperty({}, "".concat(prefixCls, "-").concat(buttonStyle), buttonStyle), "".concat(prefixCls, "-disabled"), disabled), className);
   var handleChange = function handleChange(event) {
     var value = event.target.value;
     var newValue = mergedValue.includes(value) ? mergedValue.filter(function (i) {
@@ -71,7 +73,7 @@ var CheckboxGroup = function CheckboxGroup(baseprops) {
     }, option, {
       checked: mergedValue.includes(option.value),
       key: option.value || index
-    }));
+    }), option.label);
   })));
 };
 CheckboxGroup.displayName = 'CheckboxGroup';

package/dist/esm/Checkbox/demo/group.js

@@ -36,6 +36,7 @@ export default (function () {
   }), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Checkbox.Group, {
     value: value,
     onChange: onChange,
+    layout: "vertical",
     options: [{
       value: 'A',
       label: 'Option A'

package/dist/esm/Checkbox/interface.d.ts

@@ -93,6 +93,11 @@ export interface CheckboxGroupProps {
      * Options
      */
     options?: Array<CheckboxOption>;
+    /**
+     * group layout
+     * @default horizontal
+     */
+    layout?: 'horizontal' | 'vertical';
     /**
      * Callback when value changes
      */

package/dist/esm/Checkbox/style/index.less

@@ -33,6 +33,10 @@
       background-color: var(--yee-checkbox-checked-bg-color);
       border-color: var(--yee-checkbox-checked-border-color);
 
+      --ye-checkbox-checked-border-color: var(
+        --yee-checkbox-checked-after-border-color
+      );
+
       &::after {
         position: absolute;
         top: 50%;
@@ -41,7 +45,7 @@
         width: var(--yee-checkbox-checked-after-width);
         height: var(--yee-checkbox-checked-after-height);
         border: var(--yee-checkbox-checked-after-border-width) solid
-          var(--yee-checkbox-checked-after-border-color);
+          var(--ye-checkbox-checked-border-color);
         border-top: 0;
         transform: rotate(45deg) scale(1) translate(-50%, -50%);
         content: '';
@@ -59,6 +63,14 @@
       border-color: var(--yee-checkbox-border-color);
     }
 
+    &&-checked {
+      @{pls}-inner {
+        --ye-checkbox-checked-border-color: var(
+          --yee-checkbox-disabled-checked-border-color
+        );
+      }
+    }
+
     @{pls}-input {
       display: none;
     }
@@ -100,4 +112,12 @@
       }
     }
   }
+
+  &-group {
+    &-vertical {
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+    }
+  }
 }

package/dist/esm/Dropdown/demo/placement.js

@@ -11,7 +11,8 @@ export default (function () {
     }, {
       key: '3',
       label: 'Option 3'
-    }]
+    }],
+    keyboard: true
   });
   return /*#__PURE__*/React.createElement(Space, {
     wrap: true

package/dist/esm/Dropdown/dropdown.js

@@ -1,4 +1,4 @@
-var _excluded = ["children", "placement", "prefixCls", "popup", "menu", "open", "defaultOpen", "onOpenChange"];
+var _excluded = ["children", "placement", "prefixCls", "popup", "menu", "open", "defaultOpen", "arrow", "onOpenChange"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -29,6 +29,10 @@ var Dropdown = function Dropdown(baseprops) {
     menu = props.menu,
     open = props.open,
     defaultOpen = props.defaultOpen,
+    _props$arrow = props.arrow,
+    arrow = _props$arrow === void 0 ? {
+      className: "".concat(prefixCls, "-arrow")
+    } : _props$arrow,
     onOpenChange = props.onOpenChange,
     rest = _objectWithoutProperties(props, _excluded);
   var _useMergedState = useMergedState(false, {
@@ -60,6 +64,7 @@ var Dropdown = function Dropdown(baseprops) {
     return null;
   };
   return /*#__PURE__*/React.createElement(Trigger, _extends({}, rest, {
+    arrow: arrow,
     popup: renderPopup(),
     placement: placement,
     popupClassName: "".concat(prefixCls, "-popup"),

package/dist/esm/Dropdown/style/index.less

@@ -4,4 +4,10 @@
   &-popup {
     background-color: var(--yee-dropdown-bg-color);
   }
+
+  &-arrow {
+    &::after {
+      background-color: var(--yee-dropdown-bg-color);
+    }
+  }
 }

package/dist/esm/Form/Field.js

@@ -1,3 +1,6 @@
+var _excluded = ["icon"];
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -15,8 +18,10 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import clsx from 'clsx';
+import { HelpCircle } from 'lucide-react';
 import { AnimatePresence, motion } from 'motion/react';
 import React, { useContext, useLayoutEffect, useMemo, useReducer } from 'react';
+import Tooltip from "../Tooltip";
 import FieldContext from "./FieldContext";
 import FormContext from "./FormContext";
 import { ListNameContext } from "./List";
@@ -36,10 +41,13 @@ var Field = function Field(props) {
     name = props.name,
     rules = props.rules,
     label = props.label,
+    tooltip = props.tooltip,
     required = props.required,
     disabled = props.disabled,
     _props$valuePropName = props.valuePropName,
     valuePropName = _props$valuePropName === void 0 ? 'value' : _props$valuePropName,
+    _props$layout = props.layout,
+    layout = _props$layout === void 0 ? 'vertical' : _props$layout,
     formatter = props.formatter;
   var _useContext = useContext(FieldContext),
     getCallbacks = _useContext.getCallbacks,
@@ -87,8 +95,34 @@ var Field = function Field(props) {
     }) || required;
   };
   var validate = getFieldValidate === null || getFieldValidate === void 0 ? void 0 : getFieldValidate(normalizedName);
+
+  // Normalize tooltip into { icon, ...tooltipProps }, or null when not provided.
+  // Everything except `icon` is forwarded to <Tooltip>, so any Tooltip prop
+  // (title, color, placement, ...) is supported automatically.
+  var tooltipConfig = useMemo(function () {
+    if (tooltip === undefined || tooltip === null || tooltip === false) return null;
+    if (_typeof(tooltip) === 'object' && ! /*#__PURE__*/React.isValidElement(tooltip) && 'title' in tooltip) {
+      var _ref = tooltip,
+        icon = _ref.icon,
+        rest = _objectWithoutProperties(_ref, _excluded);
+      return {
+        icon: icon !== null && icon !== void 0 ? icon : /*#__PURE__*/React.createElement(HelpCircle, {
+          size: 14
+        }),
+        tooltipProps: rest
+      };
+    }
+    return {
+      icon: /*#__PURE__*/React.createElement(HelpCircle, {
+        size: 14
+      }),
+      tooltipProps: {
+        title: tooltip
+      }
+    };
+  }, [tooltip]);
   var getControlled = function getControlled(children) {
-    var _getFieldValue, _props$dataTestid, _ref2;
+    var _getFieldValue, _props$dataTestid, _ref3;
     var props = children.props;
     var _value = (_getFieldValue = getFieldValue === null || getFieldValue === void 0 ? void 0 : getFieldValue(normalizedName)) !== null && _getFieldValue !== void 0 ? _getFieldValue : undefined;
     var value = formatter ? formatter(_value) : _value;
@@ -99,7 +133,7 @@ var Field = function Field(props) {
       formName: formName,
       id: normalizedName,
       'data-testid': (_props$dataTestid = props['data-testid']) !== null && _props$dataTestid !== void 0 ? _props$dataTestid : normalizedName,
-      disabled: (_ref2 = disabled !== null && disabled !== void 0 ? disabled : formDisabled) !== null && _ref2 !== void 0 ? _ref2 : props.disabled,
+      disabled: (_ref3 = disabled !== null && disabled !== void 0 ? disabled : formDisabled) !== null && _ref3 !== void 0 ? _ref3 : props.disabled,
       onChange: function onChange(value) {
         var _callbacks$onValuesBe, _props$onChange;
         var callbacks = getCallbacks === null || getCallbacks === void 0 ? void 0 : getCallbacks();
@@ -126,13 +160,17 @@ var Field = function Field(props) {
     });
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: clsx("".concat(prefixCls, "-item"), _defineProperty({}, "".concat(prefixCls, "-item-").concat(validate === null || validate === void 0 ? void 0 : validate.status), validate && validate.status))
+    className: clsx("".concat(prefixCls, "-item"), "".concat(prefixCls, "-item-").concat(layout), _defineProperty({}, "".concat(prefixCls, "-item-").concat(validate === null || validate === void 0 ? void 0 : validate.status), validate && validate.status))
   }, /*#__PURE__*/React.createElement("div", {
     className: clsx("".concat(prefixCls, "-item-row"))
-  }, label ? /*#__PURE__*/React.createElement("label", {
+  }, label || tooltipConfig ? /*#__PURE__*/React.createElement("label", {
     htmlFor: normalizedName,
     className: clsx("".concat(prefixCls, "-item-label"), _defineProperty({}, "".concat(prefixCls, "-item-required"), isRequired()))
-  }, label) : null, /*#__PURE__*/React.createElement("div", {
+  }, label, isRequired() ? /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "-item-required-mark")
+  }, "*") : null, tooltipConfig ? /*#__PURE__*/React.createElement(Tooltip, tooltipConfig.tooltipProps, /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "-item-tooltip-icon")
+  }, tooltipConfig.icon)) : null) : null, /*#__PURE__*/React.createElement("div", {
     className: "".concat(prefixCls, "-item-control")
   }, /*#__PURE__*/React.isValidElement(children) ? ( /*#__PURE__*/React.cloneElement(children, getControlled(children))) : /*#__PURE__*/React.createElement("span", null, children))), /*#__PURE__*/React.createElement(AnimatePresence, null, validate && /*#__PURE__*/React.createElement(motion.small, {
     initial: {

package/dist/esm/Form/Group.js

@@ -88,7 +88,7 @@ var Group = function Group(props) {
               name: childNames,
               status: 'error',
               value: values,
-              message: rule.message
+              message: rule.message || ''
             });
           }
         }
@@ -152,7 +152,9 @@ var Group = function Group(props) {
     className: "".concat(itemCls, "-row")
   }, label && /*#__PURE__*/React.createElement("label", {
     className: clsx("".concat(itemCls, "-label"), _defineProperty({}, "".concat(itemCls, "-required"), required))
-  }, label), /*#__PURE__*/React.createElement("div", {
+  }, label, required ? /*#__PURE__*/React.createElement("span", {
+    className: "".concat(itemCls, "-required-mark")
+  }, "*") : null), /*#__PURE__*/React.createElement("div", {
     className: "".concat(itemCls, "-control")
   }, content)), /*#__PURE__*/React.createElement(AnimatePresence, null, hasError && /*#__PURE__*/React.createElement(motion.small, {
     initial: {

package/dist/esm/Form/demo/form-table.js

@@ -22,12 +22,14 @@ export default (function () {
     onFinish: onFinish,
     layout: "vertical"
   }, /*#__PURE__*/React.createElement(Form.List, {
-    name: "users",
-    initialValue: [{
-      name: '',
-      age: '',
-      address: ''
-    }]
+    name: "users"
+    // initialValue={[
+    //   {
+    //     name: '',
+    //     age: '',
+    //     address: '',
+    //   },
+    // ]}
   }, function (fields, operations) {
     // Define column config - operations are accessible here
     var columns = [{

package/dist/esm/Form/demo/tooltip.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;