@vef-framework/components 1.0.97 → 1.0.99

package/lib/vef-drawer/index.cjs

@@ -1,10 +1,165 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),t=require("@emotion/react"),o=require("@vef-framework/shared"),n=require("antd"),s=require("react"),l=require("./components/cancel-action-button.cjs"),r=require("./components/ok-action-button.cjs"),a=require("./context.cjs"),i=require("./components/action-button-wrapper.cjs"),c=t.css`
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const react = require('@emotion/react');
+const shared = require('@vef-framework/shared');
+const antd = require('antd');
+const react$1 = require('react');
+const cancelActionButton = require('./components/cancel-action-button.cjs');
+const okActionButton = require('./components/ok-action-button.cjs');
+const context = require('./context.cjs');
+const actionButtonWrapper = require('./components/action-button-wrapper.cjs');
+
+const drawerStyle = react.css`
   .vef-drawer-footer {
     display: flex;
-    gap: ${o.themeVariables.padding};
+    gap: ${shared.themeVariables.padding};
     justify-content: flex-end;
     align-items: center;
   }
-`,u={narrow:"25",half:"50",wide:"75",full:"100"};const d=s.memo((function VefDrawerBase({title:t,open:i,closable:d=!0,closeOnEscPress:f=!0,closeOnMaskClick:p=!1,destroyOnClose:m=!1,placement:x="right",expansionSize:C,extra:h,showCancelButton:b=!0,cancelButtonText:y="取消",okButtonText:g="提交",actions:k,loading:w,cancelOnClose:j=!0,onClose:O,onCancel:F,onOk:q,onAfterOpen:v,onAfterClose:B,children:D}){const M=s.useMemo((()=>"small"===C?{size:"default"}:"medium"===C?{size:"large"}:"left"===x||"right"===x?{width:u[C]?`${u[C]}vw`:C}:{height:u[C]?`${u[C]}vh`:C}),[C,x]),[A,S]=s.useState({isFullyOpened:!1,isFullyClosed:!1}),[z,V]=s.useState(!1),P=s.useMemo((()=>({isDisabled:z,setIsDisabled:V,...A})),[z,A]),T=w||z;s.useLayoutEffect((()=>{i&&A.isFullyClosed&&S((e=>({...e,isFullyClosed:!1})))}),[i]);const $=s.useMemo((()=>{const t=e.jsx(l.default,{text:y,onClick:F},"cancelActionButton"),n=e.jsx(r.default,{text:g,onClick:q},"okActionButton");return o.isFunction(k)?k([t,n]):k||(b?e.jsxs(e.Fragment,{children:[t,n]}):n)}),[k,y,g,F,q,b]),E=s.useCallback((()=>{T||(j&&F?.(),O?.())}),[j,T,F,O]),I=s.useCallback((e=>{const t=o.isFunction(v),n=o.isFunction(B);e?(t&&v(),S((e=>({...e,isFullyOpened:!0})))):(n&&B(),S((e=>({...e,isFullyClosed:!0}))))}),[v,B]);return e.jsx(a.DrawerContextProvider,{value:P,children:e.jsx(n.Drawer,{afterOpenChange:I,closable:d,css:c,destroyOnClose:m,extra:h,footer:!w&&$,keyboard:f,loading:w,maskClosable:p,open:i,placement:x,title:t,zIndex:20,onClose:E,...M,children:D})})}));d.displayName="VefDrawer",exports.VefDrawerActionButtonWrapper=i.default,exports.default=d;
+`;
+const responsiveSizeMap = {
+  narrow: "25",
+  half: "50",
+  wide: "75",
+  full: "100"
+};
+function VefDrawerBase({
+  title,
+  open,
+  closable = true,
+  closeOnEscPress = true,
+  closeOnMaskClick = false,
+  destroyOnClose = false,
+  placement = "right",
+  expansionSize,
+  extra,
+  showCancelButton = true,
+  cancelButtonText = "\u53D6\u6D88",
+  okButtonText = "\u63D0\u4EA4",
+  actions,
+  loading,
+  cancelOnClose = true,
+  onClose,
+  onCancel,
+  onOk,
+  onAfterOpen,
+  onAfterClose,
+  children
+}) {
+  const expansionSizeProps = react$1.useMemo(() => {
+    if (expansionSize === "small") {
+      return {
+        size: "default"
+      };
+    } else if (expansionSize === "medium") {
+      return {
+        size: "large"
+      };
+    }
+    if (placement === "left" || placement === "right") {
+      return {
+        width: responsiveSizeMap[expansionSize] ? `${responsiveSizeMap[expansionSize]}vw` : expansionSize
+      };
+    }
+    return {
+      height: responsiveSizeMap[expansionSize] ? `${responsiveSizeMap[expansionSize]}vh` : expansionSize
+    };
+  }, [expansionSize, placement]);
+  const [drawerVisibleState, setDrawerVisibleState] = react$1.useState({
+    isFullyOpened: false,
+    isFullyClosed: false
+  });
+  const [isDisabled, setIsDisabled] = react$1.useState(false);
+  const drawerContext = react$1.useMemo(() => ({
+    isDisabled,
+    setIsDisabled,
+    ...drawerVisibleState
+  }), [isDisabled, drawerVisibleState]);
+  const modalDisabled = loading || isDisabled;
+  react$1.useLayoutEffect(() => {
+    if (open && drawerVisibleState.isFullyClosed) {
+      setDrawerVisibleState((prevState) => ({
+        ...prevState,
+        isFullyClosed: false
+      }));
+    }
+  }, [open]);
+  const actionNode = react$1.useMemo(() => {
+    const cancelButton = /* @__PURE__ */ jsxRuntime.jsx(cancelActionButton.default, { text: cancelButtonText, onClick: onCancel }, "cancelActionButton");
+    const okButton = /* @__PURE__ */ jsxRuntime.jsx(okActionButton.default, { text: okButtonText, onClick: onOk }, "okActionButton");
+    if (shared.isFunction(actions)) {
+      return actions([cancelButton, okButton]);
+    }
+    if (actions) {
+      return actions;
+    }
+    if (!showCancelButton) {
+      return okButton;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      cancelButton,
+      okButton
+    ] });
+  }, [actions, cancelButtonText, okButtonText, onCancel, onOk, showCancelButton]);
+  const handleClose = react$1.useCallback(() => {
+    if (modalDisabled) {
+      return;
+    }
+    if (cancelOnClose) {
+      onCancel?.();
+    }
+    onClose?.();
+  }, [cancelOnClose, modalDisabled, onCancel, onClose]);
+  const handleAfterOpenChange = react$1.useCallback((open2) => {
+    const hasAfterOpen = shared.isFunction(onAfterOpen);
+    const hasAfterClose = shared.isFunction(onAfterClose);
+    if (open2) {
+      if (hasAfterOpen) {
+        onAfterOpen();
+      }
+      setDrawerVisibleState((prevState) => ({
+        ...prevState,
+        isFullyOpened: true
+      }));
+    } else {
+      if (hasAfterClose) {
+        onAfterClose();
+      }
+      setDrawerVisibleState((prevState) => ({
+        ...prevState,
+        isFullyClosed: true
+      }));
+    }
+  }, [onAfterOpen, onAfterClose]);
+  return /* @__PURE__ */ jsxRuntime.jsx(context.DrawerContextProvider, { value: drawerContext, children: /* @__PURE__ */ jsxRuntime.jsx(
+    antd.Drawer,
+    {
+      afterOpenChange: handleAfterOpenChange,
+      closable,
+      css: drawerStyle,
+      destroyOnClose,
+      extra,
+      footer: !loading && actionNode,
+      keyboard: closeOnEscPress,
+      loading,
+      maskClosable: closeOnMaskClick,
+      open,
+      placement,
+      title,
+      zIndex: 20,
+      onClose: handleClose,
+      ...expansionSizeProps,
+      children
+    }
+  ) });
+}
+const VefDrawer = react$1.memo(VefDrawerBase);
+VefDrawer.displayName = "VefDrawer";
+
+exports.VefDrawerActionButtonWrapper = actionButtonWrapper.default;
+exports.default = VefDrawer;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-drawer/props.cjs

@@ -1,3 +1,5 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-dropdown/index.cjs

@@ -1,3 +1,97 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),t=require("@vef-framework/hooks"),o=require("@vef-framework/shared"),s=require("antd"),n=require("react");const i=n.memo((function VefDropdownBase({className:i,disabled:l,placement:r,children:a,items:c,trigger:d="hover",selectable:u=!1,deselectable:m=!1,multiple:p=!1,defaultSelectedKeys:y,selectedKeys:f,onChange:k,onSelect:v,onDeselect:g,onClick:h}){const b=n.useMemo((()=>[d]),[d]),P=t.useNormalizedMenuItems(c),D=t.useDeepMemo((()=>({items:P,selectable:u,unselectable:m?"on":"off",multiple:p,defaultSelectedKeys:y,selectedKeys:f,onSelect:o.isFunction(k)||o.isFunction(v)?({key:e,keyPath:t,selectedKeys:o,domEvent:s})=>{s.stopPropagation(),k?.(o),v?.(e,t)}:void 0,onDeselect:o.isFunction(k)||o.isFunction(g)?({key:e,keyPath:t,selectedKeys:o,domEvent:s})=>{s.stopPropagation(),k?.(o),g?.(e,t)}:void 0,onClick:o.isFunction(h)?({key:e,keyPath:t,domEvent:o})=>{o.stopPropagation(),h(e,t)}:void 0})),[y,p,P,k,h,g,v,u,f,m]);return e.jsx(s.Dropdown,{className:i,disabled:l,menu:D,placement:r,trigger:b,children:a})}));i.displayName="VefDropdown",exports.default=i;
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const hooks = require('@vef-framework/hooks');
+const shared = require('@vef-framework/shared');
+const antd = require('antd');
+const react = require('react');
+
+function VefDropdownBase({
+  className,
+  disabled,
+  placement,
+  children,
+  items,
+  trigger = "hover",
+  selectable = false,
+  deselectable = false,
+  multiple = false,
+  defaultSelectedKeys,
+  selectedKeys,
+  onChange,
+  onSelect,
+  onDeselect,
+  onClick
+}) {
+  const dropdownTrigger = react.useMemo(() => [trigger], [trigger]);
+  const normalizedItems = hooks.useNormalizedMenuItems(items);
+  const menuProps = hooks.useDeepMemo(
+    () => ({
+      items: normalizedItems,
+      selectable,
+      unselectable: deselectable ? "on" : "off",
+      multiple,
+      defaultSelectedKeys,
+      selectedKeys,
+      onSelect: shared.isFunction(onChange) || shared.isFunction(onSelect) ? ({
+        key,
+        keyPath,
+        selectedKeys: selectedKeys2,
+        domEvent
+      }) => {
+        domEvent.stopPropagation();
+        onChange?.(selectedKeys2);
+        onSelect?.(key, keyPath);
+      } : void 0,
+      onDeselect: shared.isFunction(onChange) || shared.isFunction(onDeselect) ? ({
+        key,
+        keyPath,
+        selectedKeys: selectedKeys2,
+        domEvent
+      }) => {
+        domEvent.stopPropagation();
+        onChange?.(selectedKeys2);
+        onDeselect?.(key, keyPath);
+      } : void 0,
+      onClick: shared.isFunction(onClick) ? ({
+        key,
+        keyPath,
+        domEvent
+      }) => {
+        domEvent.stopPropagation();
+        onClick(key, keyPath);
+      } : void 0
+    }),
+    [
+      defaultSelectedKeys,
+      multiple,
+      normalizedItems,
+      onChange,
+      onClick,
+      onDeselect,
+      onSelect,
+      selectable,
+      selectedKeys,
+      deselectable
+    ]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    antd.Dropdown,
+    {
+      className,
+      disabled,
+      menu: menuProps,
+      placement,
+      trigger: dropdownTrigger,
+      children
+    }
+  );
+}
+const VefDropdown = react.memo(VefDropdownBase);
+VefDropdown.displayName = "VefDropdown";
+
+exports.default = VefDropdown;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-dropdown/props.cjs

@@ -1,3 +1,5 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-dynamic-icon/index.cjs

@@ -1,3 +1,51 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),r=require("@vef-framework/hooks"),t=require("lucide-react/dynamicIconImports"),o=require("react"),i=require("../vef-icon/index.cjs");function SvgPlaceholder(){const{colorFillContent:t}=r.useThemeTokens();return e.jsx("svg",{"aria-label":"Loading icon",height:"1em",role:"img",viewBox:"0 0 100 100",width:"1em",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("rect",{fill:t,height:"100",rx:"20",width:"100"})})}const n=e.jsx(SvgPlaceholder,{}),s=new Map,l=o.forwardRef((({name:r,...l},c)=>{if(!s.has(r)){const e=o.lazy(t[r]);s.set(r,e)}const a=s.get(r);return e.jsx(i.default,{ref:c,...l,children:e.jsx(o.Suspense,{fallback:n,children:e.jsx(a,{})})})}));l.displayName="VefDynamicIcon",exports.default=l;
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const hooks = require('@vef-framework/hooks');
+const dynamicIconImports = require('lucide-react/dynamicIconImports');
+const react = require('react');
+const index = require('../vef-icon/index.cjs');
+
+function SvgPlaceholder() {
+  const { colorFillContent } = hooks.useThemeTokens();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      "aria-label": "Loading icon",
+      height: "1em",
+      role: "img",
+      viewBox: "0 0 100 100",
+      width: "1em",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "rect",
+        {
+          fill: colorFillContent,
+          height: "100",
+          rx: "20",
+          width: "100"
+        }
+      )
+    }
+  );
+}
+const fallback = /* @__PURE__ */ jsxRuntime.jsx(SvgPlaceholder, {});
+const iconCache = /* @__PURE__ */ new Map();
+const VefDynamicIcon = react.forwardRef(({
+  name,
+  ...restProps
+}, ref) => {
+  if (!iconCache.has(name)) {
+    const Icon2 = react.lazy(dynamicIconImports[name]);
+    iconCache.set(name, Icon2);
+  }
+  const Icon = iconCache.get(name);
+  return /* @__PURE__ */ jsxRuntime.jsx(index.default, { ref, ...restProps, children: /* @__PURE__ */ jsxRuntime.jsx(react.Suspense, { fallback, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, {}) }) });
+});
+VefDynamicIcon.displayName = "VefDynamicIcon";
+
+exports.default = VefDynamicIcon;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-dynamic-icon/props.cjs

@@ -1,3 +1,11 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("lucide-react/dynamicIconImports"),t=new Set(Object.keys(e));exports.dynamicIconNames=t;
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const dynamicIconImports = require('lucide-react/dynamicIconImports');
+
+const dynamicIconNames = new Set(Object.keys(dynamicIconImports));
+
+exports.dynamicIconNames = dynamicIconNames;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-empty/index.cjs

@@ -1,3 +1,42 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),t=require("@vef-framework/shared"),r=require("antd"),i=require("react"),{PRESENTED_IMAGE_DEFAULT:s,PRESENTED_IMAGE_SIMPLE:u}=r.Empty;exports.default=function VefEmpty({icon:o,iconStyle:l,presetIcon:n="default",...a}){const E=i.useMemo((()=>t.isNullish(o)?"default"===n?s:u:o),[o,n]),m=i.useMemo((()=>{if(!t.isNullish(l))return{image:l}}),[l]);return e.jsx(r.Empty,{image:E,styles:m,...a})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const shared = require('@vef-framework/shared');
+const antd = require('antd');
+const react = require('react');
+
+const { PRESENTED_IMAGE_DEFAULT, PRESENTED_IMAGE_SIMPLE } = antd.Empty;
+function VefEmpty({
+  icon,
+  iconStyle,
+  presetIcon = "default",
+  ...restProps
+}) {
+  const iconToUse = react.useMemo(() => {
+    if (shared.isNullish(icon)) {
+      return presetIcon === "default" ? PRESENTED_IMAGE_DEFAULT : PRESENTED_IMAGE_SIMPLE;
+    }
+    return icon;
+  }, [icon, presetIcon]);
+  const styles = react.useMemo(() => {
+    if (!shared.isNullish(iconStyle)) {
+      return {
+        image: iconStyle
+      };
+    }
+  }, [iconStyle]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    antd.Empty,
+    {
+      image: iconToUse,
+      styles,
+      ...restProps
+    }
+  );
+}
+
+exports.default = VefEmpty;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-empty/props.cjs

@@ -1,3 +1,5 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-empty-placeholder/index.cjs

@@ -1,7 +1,25 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),r=require("@emotion/react"),t=require("@vef-framework/shared"),s=require("../vef-empty/index.cjs"),i=r.css`
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const react = require('@emotion/react');
+const shared = require('@vef-framework/shared');
+const index = require('../vef-empty/index.cjs');
+
+const emptyPlaceholderStyle = react.css`
   height: 100%;
-  padding: ${t.themeVariables.paddingLg};
-  ${t.styles.flexCenter}
-`;exports.default=function VefEmptyPlaceholder({className:r,style:t,...a}){return e.jsx("div",{className:r,css:i,style:t,children:e.jsx(s.default,{...a})})};
+  padding: ${shared.themeVariables.paddingLg};
+  ${shared.styles.flexCenter}
+`;
+function VefEmptyPlaceholder({
+  className,
+  style,
+  ...restProps
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className, css: emptyPlaceholderStyle, style, children: /* @__PURE__ */ jsxRuntime.jsx(index.default, { ...restProps }) });
+}
+
+exports.default = VefEmptyPlaceholder;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-empty-placeholder/props.cjs

@@ -1,3 +1,5 @@
-/*! VefFramework version: 1.0.97, build time: 2025-03-06T12:24:36.991Z, made by Venus. */
-"use strict";
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */