antd-solid 0.0.24 → 0.0.25

package/dist/index.esm.js

@@ -570,6 +570,10 @@ function isEmptyJSXElement(element) {
   return element === undefined || element === null || typeof element === 'boolean' || element === '' || Array.isArray(element) && element.length === 0;
 }
 
+const CompactContext = createContext({
+  compact: false
+});
+
 var _tmpl$$O = /*#__PURE__*/template(`<span class="i-ant-design:loading [vertical-align:-0.125em] keyframes-spin [animation:spin_1s_linear_infinite]">`),
   _tmpl$2$v = /*#__PURE__*/template(`<span>`),
   _tmpl$3$k = /*#__PURE__*/template(`<span class="inline-block leading-inherit">`);
@@ -601,6 +605,9 @@ const Button$1 = _props => {
   const loading = createMemo(() => typeof props.loading === 'boolean' ? props.loading : innerLoading());
   const resolvedChildren = children(() => props.children);
   const resolvedIcon = children(() => unwrapStringOrJSXElement(props.icon));
+  const {
+    compact
+  } = useContext(CompactContext);
   return createComponent(Element$1, mergeProps$1({
     tag: "button"
   }, buttonElementProps, {
@@ -609,7 +616,7 @@ const Button$1 = _props => {
       typeof _ref$ === "function" ? _ref$(r$) : props.ref = r$;
     },
     get ["class"]() {
-      return cs(`ant-btn ant-btn-${props.type}`, 'inline-flex justify-center items-center gap-8px', 'relative cursor-pointer [font-size:var(--ant-font-size)] rounded-[--ant-button-border-radius]', 'focus-visible:[outline:4px_solid_var(--ant-color-primary-border)] focus-visible:[outline-offset:1px]', props.block && 'block w-full', props.class, sizeClassMap[size()], props.disabled && 'cursor-not-allowed', typeClassMap[props.type](props.danger, props.disabled), loading() && 'opacity-65');
+      return cs(`ant-btn ant-btn-${props.type}`, 'inline-flex justify-center items-center gap-8px', 'relative cursor-pointer [font-size:var(--ant-font-size)] rounded-[--ant-button-border-radius]', 'focus-visible:[outline:4px_solid_var(--ant-color-primary-border)] focus-visible:[outline-offset:1px]', props.block && 'block w-full', props.class, sizeClassMap[size()], props.disabled && 'cursor-not-allowed', typeClassMap[props.type](props.danger, props.disabled), loading() && 'opacity-65', compact && 'ant-compact-item');
     },
     get style() {
       return {
@@ -807,10 +814,6 @@ const TextArea = props => {
 var css_248z$4 = ".ant-input-group > :first-child {\n  border-top-left-radius: var(--ant-input-border-radius);\n  border-bottom-left-radius: var(--ant-input-border-radius);\n}\n.ant-input-group > :last-child {\n  border-top-right-radius: var(--ant-input-border-radius);\n  border-bottom-right-radius: var(--ant-input-border-radius);\n}\n\n.ant-compact > :not(:first-child).ant-input-group.ant-compact-item > :first-child, .ant-compact > :not(:first-child) .ant-input-group.ant-compact-item > :first-child {\n  border-top-left-radius: 0px;\n  border-bottom-left-radius: 0px;\n}\n.ant-compact > :not(:last-child).ant-input-group.ant-compact-item > :last-child, .ant-compact > :not(:last-child) .ant-input-group.ant-compact-item > :last-child {\n  border-top-right-radius: 0px;\n  border-bottom-right-radius: 0px;\n}";
 styleInject(css_248z$4);
 
-const CompactContext = createContext({
-  compact: false
-});
-
 var _tmpl$$M = /*#__PURE__*/template(`<div>`),
   _tmpl$2$u = /*#__PURE__*/template(`<span class="ml-4px i-ant-design:close-circle-filled cursor-pointer text-[var(--ant-color-text-quaternary)] hover:text-[var(--ant-color-text-tertiary)] active:text-[var(--ant-color-text)]">`),
   _tmpl$3$j = /*#__PURE__*/template(`<div class="[display:var(--actions-display)] absolute top-0 bottom-0 right-0 h-[calc(100%-2px)] translate-y-1px -translate-x-1px">`),
@@ -3679,12 +3682,13 @@ const Slider = _props => {
         case 'ArrowDown':
           e.preventDefault();
           setValue(NP.minus(value(), props.step));
+          props.onChangeComplete?.(value());
           break;
         case 'ArrowRight':
         case 'ArrowUp':
           e.preventDefault();
           setValue(NP.plus(value(), props.step));
-          e.preventDefault();
+          props.onChangeComplete?.(value());
           break;
       }
     };
@@ -3725,6 +3729,7 @@ const Slider = _props => {
         const halfHandleWidth = handleWidth / 2;
         const offsetX = clamp(e.offsetX - halfHandleWidth, 0, containerRef.offsetWidth - handleWidth);
         setValue(props.min + offsetX / (containerRef.offsetWidth - handleWidth) * gap());
+        props.onChangeComplete?.(value());
       };
       insert(_el$4, createComponent(Tooltip, {
         get open() {
@@ -5698,7 +5703,7 @@ function getElementCssVariables(type, size) {
 }
 
 var _tmpl$$a = /*#__PURE__*/template(`<span>`),
-  _tmpl$2$3 = /*#__PURE__*/template(`<div><span class="inline-flex items-center gap-[--ant-margin-sm]"></span><span class="inline-flex items-center gap-[--ant-margin-sm]">`),
+  _tmpl$2$3 = /*#__PURE__*/template(`<div><span class="inline-flex items-center gap-[--ant-margin-sm]"><span></span></span><span class="inline-flex items-center gap-[--ant-margin-sm]"><span>`),
   _tmpl$3$3 = /*#__PURE__*/template(`<div class=overflow-hidden><div>`);
 const CollapseItem = _props => {
   const props = mergeProps({
@@ -5746,16 +5751,18 @@ const CollapseItem = _props => {
       return [(() => {
         var _el$2 = _tmpl$2$3(),
           _el$3 = _el$2.firstChild,
-          _el$4 = _el$3.nextSibling;
+          _el$4 = _el$3.firstChild,
+          _el$5 = _el$3.nextSibling,
+          _el$6 = _el$5.firstChild;
         _el$2.$$click = () => {
           if (props.disabledChildren) return;
           setOpen(!open());
         };
-        insert(_el$3, () => getExpandIcon('left'), null);
-        insert(_el$3, () => unwrapStringOrJSXElement(props.label), null);
+        insert(_el$3, () => getExpandIcon('left'), _el$4);
+        insert(_el$4, () => unwrapStringOrJSXElement(props.label));
         insert(_el$3, () => getExpandIcon('right'), null);
-        insert(_el$4, () => unwrapStringOrJSXElement(props.extra), null);
-        insert(_el$4, () => getExpandIcon('end'), null);
+        insert(_el$6, () => unwrapStringOrJSXElement(props.extra));
+        insert(_el$5, () => getExpandIcon('end'), null);
         effect(_p$ => {
           var _v$ = cs('text-[--ant-color-text-heading] flex justify-between items-center cursor-pointer', props.type === 'card' && 'bg-[var(--ant-collapse-header-bg)] p-[--ant-collapse-header-padding]'),
             _v$2 = props.headerStyle;
@@ -5792,20 +5799,20 @@ const CollapseItem = _props => {
               return open();
             },
             get children() {
-              var _el$5 = _tmpl$3$3(),
-                _el$6 = _el$5.firstChild;
-              insert(_el$6, () => props.children);
+              var _el$7 = _tmpl$3$3(),
+                _el$8 = _el$7.firstChild;
+              insert(_el$8, () => props.children);
               effect(_p$ => {
                 var _v$3 = cs('p-[--ant-collapse-content-padding]', props.type === 'card' && '[border-top:1px_solid_var(--ant-color-border)]'),
                   _v$4 = props.bodyStyle;
-                _v$3 !== _p$.e && className(_el$6, _p$.e = _v$3);
-                _p$.t = style(_el$6, _v$4, _p$.t);
+                _v$3 !== _p$.e && className(_el$8, _p$.e = _v$3);
+                _p$.t = style(_el$8, _v$4, _p$.t);
                 return _p$;
               }, {
                 e: undefined,
                 t: undefined
               });
-              return _el$5;
+              return _el$7;
             }
           });
         }
@@ -7368,12 +7375,13 @@ const Cursor = props => {
     _children.style.cursor = 'none';
   };
   const onMouseMove = e => {
+    setHover(true);
     setCursorPosition({
       x: e.clientX,
       y: e.clientY
     });
   };
-  const onMouseLeave = (_, _children) => {
+  const onLeave = _children => {
     setHover(false);
     if (originalCursor) {
       _children.style.cursor = originalCursor;
@@ -7382,33 +7390,36 @@ const Cursor = props => {
     }
     originalCursor = undefined;
   };
+  const onMouseLeave = (_, _children) => {
+    onLeave(_children);
+  };
   setRef(props, {
     onMouseEnter,
     onMouseMove,
     onMouseLeave
   });
   createEffect(() => {
+    if (props.disabled) return;
     const _children = resolvedChildren();
     if (!(_children instanceof HTMLElement || _children instanceof SVGElement)) return;
     const abortController = new AbortController();
+    // 注意：不能设置 capture 为 true，否则鼠标移入子元素时，子元素也会触发 mouseenter 事件
     _children.addEventListener('mouseenter', e => {
       onMouseEnter(e, _children);
     }, {
-      capture: true,
       signal: abortController.signal
     });
     _children.addEventListener('mousemove', onMouseMove, {
-      capture: true,
       signal: abortController.signal
     });
     _children.addEventListener('mouseleave', e => {
       onMouseLeave(e, _children);
     }, {
-      capture: true,
       signal: abortController.signal
     });
     onCleanup(() => {
       abortController.abort();
+      onLeave(_children);
     });
   });
   return [resolvedChildren, createComponent(Show, {