@vef-framework/components 1.0.62 → 1.0.64

package/es/vef-page/index.js

@@ -1,15 +1,23 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{jsxs as e,jsx as o,Fragment as t}from"@emotion/react/jsx-runtime";import{css as a}from"@emotion/react";import{themeVariables as r}from"@vef-framework/shared";import i from"clsx";import{AnimatePresence as n,motion as l}from"motion/react";import c from"../vef-scroll-area/index.js";import d from"../vef-title/index.js";const f=a`
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { jsxs, jsx, Fragment } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
+import { themeVariables } from '@vef-framework/shared';
+import clsx from 'clsx';
+import { AnimatePresence, motion } from 'motion/react';
+import VefScrollArea from '../vef-scroll-area/index.js';
+import VefTitle from '../vef-title/index.js';
+
+const pageStyle = css`
   height: 100%;
   display: flex;
   flex-direction: column;
-  background-color: ${r.colorBgLayout};
+  background-color: ${themeVariables.colorBgLayout};
 
   .vef-page-header {
     flex: none;
-    background-color: ${r.colorBgContainer};
-    padding: ${r.paddingSm} ${r.paddingLg};
-    border-bottom: ${r.lineWidth} ${r.lineType} ${r.colorBorderSecondary};
+    background-color: ${themeVariables.colorBgContainer};
+    padding: ${themeVariables.paddingSm} ${themeVariables.paddingLg};
+    border-bottom: ${themeVariables.lineWidth} ${themeVariables.lineType} ${themeVariables.colorBorderSecondary};
 
     &.vef-page-header-default {
       display: flex;
@@ -37,10 +45,10 @@ import{jsxs as e,jsx as o,Fragment as t}from"@emotion/react/jsx-runtime";import{
   }
 
   .vef-page-content {
-    margin: ${r.marginSm};
+    margin: ${themeVariables.marginSm};
 
     &.vef-page-content-footer-padding {
-      padding-bottom: calc(${r.controlHeight} * 2);
+      padding-bottom: calc(${themeVariables.controlHeight} * 2);
     }
   }
 
@@ -50,10 +58,78 @@ import{jsxs as e,jsx as o,Fragment as t}from"@emotion/react/jsx-runtime";import{
     left: 0;
     right: 0;
     z-index: 9;
-    border-top: ${r.lineWidth} ${r.lineType} ${r.colorBorderSecondary};
+    border-top: ${themeVariables.lineWidth} ${themeVariables.lineType} ${themeVariables.colorBorderSecondary};
     background-color: rgba(255, 255, 255, 0.6);
     backdrop-filter: blur(8px);
-    height: calc(${r.controlHeight} * 2);
+    height: calc(${themeVariables.controlHeight} * 2);
   }
-`;function p({title:a,actions:r,header:p,footer:g,scrollable:s=!1,children:m}){return e("div",{css:f,children:[!1!==p&&o("div",{className:i("vef-page-header",{"vef-page-header-default":!p}),children:p||e(t,{children:[o(d,{noPaddingBottom:!0,showLeftBar:!0,className:"vef-page-title",level:5,children:a??"无标题"}),o("div",{className:"vef-page-actions",children:r})]})}),s?e(c,{className:"vef-page-body",scrollDirection:"both",children:[o("div",{className:i("vef-page-content",{"vef-page-content-footer-padding":!!g}),children:m}),o(n,{children:g&&o(l.div,{className:"vef-page-footer",animate:{opacity:1,y:0},exit:{opacity:0,y:60},initial:{opacity:0,y:60},transition:{duration:.2,ease:"easeInOut"},children:g})})]}):o("div",{className:"vef-page-body vef-page-content",children:m})]})}export{p as default};
+`;
+function VefPage({
+  title,
+  actions,
+  header,
+  footer,
+  scrollable = false,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("div", { css: pageStyle, children: [
+    header !== false && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: clsx("vef-page-header", {
+          "vef-page-header-default": !header
+        }),
+        children: header || /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            VefTitle,
+            {
+              noPaddingBottom: true,
+              showLeftBar: true,
+              className: "vef-page-title",
+              level: 5,
+              children: title ?? "\u65E0\u6807\u9898"
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "vef-page-actions", children: actions })
+        ] })
+      }
+    ),
+    scrollable ? /* @__PURE__ */ jsxs(VefScrollArea, { className: "vef-page-body", scrollDirection: "both", children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: clsx("vef-page-content", {
+            "vef-page-content-footer-padding": !!footer
+          }),
+          children
+        }
+      ),
+      /* @__PURE__ */ jsx(AnimatePresence, { children: footer && /* @__PURE__ */ jsx(
+        motion.div,
+        {
+          className: "vef-page-footer",
+          animate: {
+            opacity: 1,
+            y: 0
+          },
+          exit: {
+            opacity: 0,
+            y: 60
+          },
+          initial: {
+            opacity: 0,
+            y: 60
+          },
+          transition: {
+            duration: 0.2,
+            ease: "easeInOut"
+          },
+          children: footer
+        }
+      ) })
+    ] }) : /* @__PURE__ */ jsx("div", { className: "vef-page-body vef-page-content", children })
+  ] });
+}
+
+export { VefPage as default };
 /*! 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/es/vef-pagination/index.js

@@ -1,3 +1,58 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{jsxs as e,Fragment as t,jsx as o}from"@emotion/react/jsx-runtime";import{Pagination as a}from"antd";import{memo as i}from"react";import r from"../vef-text/index.js";import{defaultPageSizeOptions as n}from"./props.js";function m(a){return e(t,{children:["共"," ",o(r,{bold:!0,children:a})," ","条"]})}const l={listHeight:300};const p=i((function({defaultPageNumber:e,defaultPageSize:t,pageNumber:i,pageSize:r,total:p,size:u,pageSizeOptions:s=n,allowChangePageSize:f=!0,showTotal:g=!0,compact:d,allowQuickJump:c,onChange:h,...z}){return o(a,{current:i,defaultCurrent:e,defaultPageSize:t,pageSize:r,pageSizeOptions:s,showQuickJumper:c,showSizeChanger:f?l:f,showTotal:g?m:void 0,simple:d,size:"medium"===u?"default":u,total:p,onChange:h,...z})}));p.displayName="VefPagination";export{p as default};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { jsxs, Fragment, jsx } from '@emotion/react/jsx-runtime';
+import { Pagination } from 'antd';
+import { memo } from 'react';
+import VefText from '../vef-text/index.js';
+import { defaultPageSizeOptions } from './props.js';
+
+function renderTotal(total) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    "\u5171",
+    " ",
+    /* @__PURE__ */ jsx(VefText, { bold: true, children: total }),
+    " ",
+    "\u6761"
+  ] });
+}
+const sizeChangerProps = {
+  listHeight: 300
+};
+function VefPaginationBase({
+  defaultPageNumber,
+  defaultPageSize,
+  pageNumber,
+  pageSize,
+  total,
+  size,
+  pageSizeOptions = defaultPageSizeOptions,
+  allowChangePageSize = true,
+  showTotal = true,
+  compact,
+  allowQuickJump,
+  onChange,
+  ...restProps
+}) {
+  return /* @__PURE__ */ jsx(
+    Pagination,
+    {
+      current: pageNumber,
+      defaultCurrent: defaultPageNumber,
+      defaultPageSize,
+      pageSize,
+      pageSizeOptions,
+      showQuickJumper: allowQuickJump,
+      showSizeChanger: allowChangePageSize ? sizeChangerProps : allowChangePageSize,
+      showTotal: showTotal ? renderTotal : void 0,
+      simple: compact,
+      size: size === "medium" ? "default" : size,
+      total,
+      onChange,
+      ...restProps
+    }
+  );
+}
+const VefPagination = memo(VefPaginationBase);
+VefPagination.displayName = "VefPagination";
+
+export { VefPagination as default };
 /*! 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/es/vef-pagination/props.js

@@ -1,3 +1,14 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-const o=[5,10,15,20,30,40,50,100];export{o as defaultPageSizeOptions};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+const defaultPageSizeOptions = [
+  5,
+  10,
+  15,
+  20,
+  30,
+  40,
+  50,
+  100
+];
+
+export { defaultPageSizeOptions };
 /*! 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/es/vef-paragraph/index.js

@@ -1,3 +1,90 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{jsx as e}from"@emotion/react/jsx-runtime";import{useColorTokens as o}from"@vef-framework/hooks";import{isFunction as r}from"@vef-framework/shared";import{Typography as t}from"antd";import{useMemo as a}from"react";const{Paragraph:n}=t;function p({variant:t,color:p,bold:d,ellipsis:i,ellipsisRows:s=2,expandable:l,defaultExpanded:f,expanded:c,copyable:m,copiedText:x,onCopy:u,onExpand:y,...b}){const h=a((()=>{if(i)return{rows:s,expandable:l?"collapsible":void 0,defaultExpanded:f,expanded:c,onExpand:r(y)?(e,{expanded:o})=>{y(o)}:void 0}}),[l,f,i,s,c,y]),v=o(),g=a((()=>{const e={};return"strikethrough"===t?e.delete=!0:t&&(e[t]=!0),"secondary"===p?e.type="secondary":p&&(e.css={color:v.get(p)}),d&&(e.strong=!0),e}),[d,p,v,t]),k=a((()=>{if(m)return{format:"text/plain",text:x,onCopy:u}}),[m,x,u]);return e(n,{copyable:k,ellipsis:h,...g,...b})}export{p as default};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { useColorTokens } from '@vef-framework/hooks';
+import { isFunction } from '@vef-framework/shared';
+import { Typography } from 'antd';
+import { useMemo } from 'react';
+
+const { Paragraph } = Typography;
+function VefParagraph({
+  variant,
+  color,
+  bold,
+  ellipsis,
+  ellipsisRows = 2,
+  expandable,
+  defaultExpanded,
+  expanded,
+  copyable,
+  copiedText,
+  onCopy,
+  onExpand,
+  ...restProps
+}) {
+  const ellipsisConfig = useMemo(() => {
+    if (ellipsis) {
+      return {
+        rows: ellipsisRows,
+        expandable: expandable ? "collapsible" : void 0,
+        defaultExpanded,
+        expanded,
+        onExpand: isFunction(onExpand) ? (_, { expanded: expanded2 }) => {
+          onExpand(expanded2);
+        } : void 0
+      };
+    }
+  }, [
+    expandable,
+    defaultExpanded,
+    ellipsis,
+    ellipsisRows,
+    expanded,
+    onExpand
+  ]);
+  const colorTokens = useColorTokens();
+  const styleProps = useMemo(() => {
+    const props = {};
+    if (variant === "strikethrough") {
+      props.delete = true;
+    } else if (variant) {
+      props[variant] = true;
+    }
+    if (color === "secondary") {
+      props.type = "secondary";
+    } else if (color) {
+      props.css = {
+        color: colorTokens.get(color)
+      };
+    }
+    if (bold) {
+      props.strong = true;
+    }
+    return props;
+  }, [
+    bold,
+    color,
+    colorTokens,
+    variant
+  ]);
+  const copyConfig = useMemo(() => {
+    if (copyable) {
+      return {
+        format: "text/plain",
+        text: copiedText,
+        onCopy
+      };
+    }
+  }, [copyable, copiedText, onCopy]);
+  return /* @__PURE__ */ jsx(
+    Paragraph,
+    {
+      copyable: copyConfig,
+      ellipsis: ellipsisConfig,
+      ...styleProps,
+      ...restProps
+    }
+  );
+}
+
+export { VefParagraph as default };
 /*! 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/es/vef-password/hooks/use-password-instance.js

@@ -1,3 +1,14 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{useRef as r,useImperativeHandle as t}from"react";function u(u){const c=r(null);return t(u,(()=>({blur:()=>c.current?.blur(),focus:()=>c.current?.focus({preventScroll:!0})}))),c}export{u as usePasswordInstance};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { useRef, useImperativeHandle } from 'react';
+
+function usePasswordInstance(ref) {
+  const passwordRef = useRef(null);
+  useImperativeHandle(ref, () => ({
+    blur: () => passwordRef.current?.blur(),
+    focus: () => passwordRef.current?.focus({ preventScroll: true })
+  }));
+  return passwordRef;
+}
+
+export { usePasswordInstance };
 /*! 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/es/vef-password/index.js

@@ -1,3 +1,68 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{jsx as e}from"@emotion/react/jsx-runtime";import{isFunction as o}from"@vef-framework/shared";import{Input as r}from"antd";import{forwardRef as t,useMemo as a}from"react";import"../internal/index.js";import{usePasswordInstance as n}from"./hooks/use-password-instance.js";import{convertBasicSizeToUiSize as s}from"../internal/utils.js";const{Password:l}=r;function u(e){return""===e?null:e}const i=t((({defaultValue:r,value:t,size:i,clearable:m,showCount:d,onChange:f,onEnterKeyPress:v,onBlur:c,onFocus:p,...w},g)=>{const h=a((()=>({onChange:o(f)?e=>f(u(e.target.value)):void 0,onPressEnter:o(v)?e=>v(u(e.target.value)):void 0,onBlur:o(c)?e=>c(u(e.target.value)):void 0,onFocus:o(p)?e=>p(u(e.target.value)):void 0})),[f,v,c,p]),C=n(g);return e(l,{ref:C,allowClear:m,defaultValue:r,showCount:d,size:s(i),value:t,...w,...h})}));i.displayName="VefPassword";export{i as default};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { isFunction } from '@vef-framework/shared';
+import { Input } from 'antd';
+import { forwardRef, useMemo } from 'react';
+import '../internal/index.js';
+import { usePasswordInstance } from './hooks/use-password-instance.js';
+import { convertBasicSizeToUiSize } from '../internal/utils.js';
+
+const { Password } = Input;
+function normalizeValue(value) {
+  if (value === "") {
+    return null;
+  }
+  return value;
+}
+const VefPassword = forwardRef(
+  ({
+    defaultValue,
+    value,
+    size,
+    clearable,
+    showCount,
+    onChange,
+    onEnterKeyPress,
+    onBlur,
+    onFocus,
+    ...restProps
+  }, ref) => {
+    const eventHandlers = useMemo(() => ({
+      onChange: isFunction(onChange) ? (event) => onChange(
+        normalizeValue(event.target.value)
+      ) : void 0,
+      onPressEnter: isFunction(onEnterKeyPress) ? (event) => onEnterKeyPress(
+        normalizeValue(event.target.value)
+      ) : void 0,
+      onBlur: isFunction(onBlur) ? (event) => onBlur(
+        normalizeValue(event.target.value)
+      ) : void 0,
+      onFocus: isFunction(onFocus) ? (event) => onFocus(
+        normalizeValue(event.target.value)
+      ) : void 0
+    }), [
+      onChange,
+      onEnterKeyPress,
+      onBlur,
+      onFocus
+    ]);
+    const passwordRef = usePasswordInstance(ref);
+    return /* @__PURE__ */ jsx(
+      Password,
+      {
+        ref: passwordRef,
+        allowClear: clearable,
+        defaultValue,
+        showCount,
+        size: convertBasicSizeToUiSize(size),
+        value,
+        ...restProps,
+        ...eventHandlers
+      }
+    );
+  }
+);
+VefPassword.displayName = "VefPassword";
+
+export { VefPassword as default };
 /*! 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/es/vef-popconfirm/index.js

@@ -1,3 +1,57 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{jsx as e}from"@emotion/react/jsx-runtime";import{infoIcon as o,defaultMessageTitle as n}from"@vef-framework/shared";import{Popconfirm as t}from"antd";import{CheckIcon as r}from"lucide-react";import{forwardRef as a,useRef as c,useImperativeHandle as i}from"react";import p from"../vef-icon/index.js";const l={autoInsertSpace:!1,icon:e(p,{children:e(r,{})})},m={autoInsertSpace:!1,variant:"text",color:"default"};function f(e){e.stopPropagation()}const s=a((({title:r=n,content:a,cancelable:p=!0,defaultOpened:s,opened:u,onOpenedChange:d,onOk:C,onCancel:h,...O},P)=>{const k=c(null);return i(P,(()=>k.current.nativeElement)),e(t,{ref:k,cancelButtonProps:m,defaultOpen:s,description:a,icon:o,okButtonProps:l,open:u,showCancel:p,title:r,onCancel:h,onConfirm:C,onOpenChange:d,onPopupClick:f,...O})}));s.displayName="VefPopconfirm";export{s as default};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { infoIcon, defaultMessageTitle } from '@vef-framework/shared';
+import { Popconfirm } from 'antd';
+import { CheckIcon } from 'lucide-react';
+import { forwardRef, useRef, useImperativeHandle } from 'react';
+import VefIcon from '../vef-icon/index.js';
+
+const okButtonProps = {
+  autoInsertSpace: false,
+  icon: /* @__PURE__ */ jsx(VefIcon, { children: /* @__PURE__ */ jsx(CheckIcon, {}) })
+};
+const cancelButtonProps = {
+  autoInsertSpace: false,
+  variant: "text",
+  color: "default"
+};
+function popupClickHandler(event) {
+  event.stopPropagation();
+}
+const VefPopconfirm = forwardRef(({
+  title = defaultMessageTitle,
+  content,
+  cancelable = true,
+  defaultOpened,
+  opened,
+  onOpenedChange,
+  onOk,
+  onCancel,
+  ...restProps
+}, ref) => {
+  const tooltipRef = useRef(null);
+  useImperativeHandle(ref, () => tooltipRef.current.nativeElement);
+  return /* @__PURE__ */ jsx(
+    Popconfirm,
+    {
+      ref: tooltipRef,
+      cancelButtonProps,
+      defaultOpen: defaultOpened,
+      description: content,
+      icon: infoIcon,
+      okButtonProps,
+      open: opened,
+      showCancel: cancelable,
+      title,
+      onCancel,
+      onConfirm: onOk,
+      onOpenChange: onOpenedChange,
+      onPopupClick: popupClickHandler,
+      ...restProps
+    }
+  );
+});
+VefPopconfirm.displayName = "VefPopconfirm";
+
+export { VefPopconfirm as default };
 /*! 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/es/vef-popover/index.js

@@ -1,3 +1,30 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{jsx as t}from"@emotion/react/jsx-runtime";import{Popover as r}from"antd";import{forwardRef as e,useRef as o,useImperativeHandle as n}from"react";const i=e((({title:e,content:i,trigger:a="click",arrow:m=!1,...c},l)=>{const f=o(null);return n(l,(()=>f.current.nativeElement)),t(r,{ref:f,arrow:m,content:i,title:e,trigger:a,...c})}));i.displayName="VefPopover";export{i as default};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { Popover } from 'antd';
+import { forwardRef, useRef, useImperativeHandle } from 'react';
+
+const VefPopover = forwardRef(({
+  title,
+  content,
+  trigger = "click",
+  arrow = false,
+  ...restProps
+}, ref) => {
+  const popoverRef = useRef(null);
+  useImperativeHandle(ref, () => popoverRef.current.nativeElement);
+  return /* @__PURE__ */ jsx(
+    Popover,
+    {
+      ref: popoverRef,
+      arrow,
+      content,
+      title,
+      trigger,
+      ...restProps
+    }
+  );
+});
+VefPopover.displayName = "VefPopover";
+
+export { VefPopover as default };
 /*! 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/es/vef-radio/hooks/use-data-options.js

@@ -1,3 +1,41 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{useComputedOptions as e}from"@vef-framework/hooks";import{isFunction as o,isNullish as r}from"@vef-framework/shared";import{useMemo as a,useLayoutEffect as i}from"react";function t({value:t,onChange:n,...p}){const{normalizedOptions:s,defaultOption:f,isLoading:l}=e({...p,isGrouped:!1,filterable:!1,selectedOptionValues:t?[t]:[]}),m=a((()=>s.reduce(((e,o)=>(e.set(o.value,o),e)),new Map)),[s]);return i((()=>{f&&o(n)&&r(t)&&n(f.value,f)}),[f,n,t]),{optionsMap:m,normalizedOptions:s,isLoading:l}}export{t as useDataOptions};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { useComputedOptions } from '@vef-framework/hooks';
+import { isFunction, isNullish } from '@vef-framework/shared';
+import { useMemo, useLayoutEffect } from 'react';
+
+function useDataOptions({
+  value,
+  onChange,
+  ...rest
+}) {
+  const {
+    normalizedOptions,
+    defaultOption,
+    isLoading
+  } = useComputedOptions({
+    ...rest,
+    isGrouped: false,
+    filterable: false,
+    selectedOptionValues: value ? [value] : []
+  });
+  const optionsMap = useMemo(() => normalizedOptions.reduce((map, option) => {
+    map.set(option.value, option);
+    return map;
+  }, /* @__PURE__ */ new Map()), [normalizedOptions]);
+  useLayoutEffect(() => {
+    if (defaultOption && isFunction(onChange) && isNullish(value)) {
+      onChange(
+        defaultOption.value,
+        defaultOption
+      );
+    }
+  }, [defaultOption, onChange, value]);
+  return {
+    optionsMap,
+    normalizedOptions,
+    isLoading
+  };
+}
+
+export { useDataOptions };
 /*! 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/es/vef-radio/hooks/use-radio-instance.js

@@ -1,3 +1,21 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{useRef as r,useImperativeHandle as t}from"react";function n(n,o){const u=r(null);return t(n,(()=>({blur:()=>{u.current?.blur()},focus:()=>{u.current?.focus({preventScroll:!0})},getDataOptions:()=>o}))),u}export{n as useRadioInstance};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { useRef, useImperativeHandle } from 'react';
+
+function useRadioInstance(ref, dataOptions) {
+  const radioRef = useRef(null);
+  useImperativeHandle(ref, () => ({
+    blur: () => {
+      radioRef.current?.blur();
+    },
+    focus: () => {
+      radioRef.current?.focus({
+        preventScroll: true
+      });
+    },
+    getDataOptions: () => dataOptions
+  }));
+  return radioRef;
+}
+
+export { useRadioInstance };
 /*! 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/es/vef-radio/index.js

@@ -1,5 +1,89 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{jsx as e}from"@emotion/react/jsx-runtime";import{css as o}from"@emotion/react";import{themeVariables as t,isFunction as i}from"@vef-framework/shared";import{Radio as r}from"antd";import{useMemo as n,memo as a,forwardRef as l}from"react";import"../internal/index.js";import d from"../vef-loading-placeholder/index.js";import s from"../vef-tooltip/index.js";import{useDataOptions as m}from"./hooks/use-data-options.js";import{useRadioInstance as u}from"./hooks/use-radio-instance.js";import{convertBasicSizeToUiSize as p}from"../internal/utils.js";const{Group:c}=r,f=e("div",{css:o`
-      height: ${t.controlHeight}
-    `,children:e(d,{})});const h=a(l((function({defaultValue:o,value:t,disabled:a,block:l,variant:d,buttonVariant:h,buttonSize:v,onChange:b,...g},j){const{optionsMap:k,normalizedOptions:x,isLoading:V}=m({value:t,onChange:b,...g}),y=u(j,x),z=n((()=>{if(i(b))return({target:{value:e}})=>{b(e,k.get(e))}}),[b,k]);if(V)return f;const C=x.map((o=>{const{value:t,label:i,disabled:n,description:a}=o;return a?e(s,{content:a,children:e(r,{disabled:n,value:t,children:i})},t):e(r,{disabled:n,value:t,children:i},t)}));return e(c,{ref:y,block:l,buttonStyle:h,defaultValue:o,disabled:a,optionType:d,size:p(v),onChange:z,...void 0===t?{}:{value:t},children:C})})));h.displayName="VefRadio";export{h as default};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
+import { themeVariables, isFunction } from '@vef-framework/shared';
+import { Radio } from 'antd';
+import { useMemo, memo, forwardRef } from 'react';
+import '../internal/index.js';
+import VefLoadingPlaceholder from '../vef-loading-placeholder/index.js';
+import VefTooltip from '../vef-tooltip/index.js';
+import { useDataOptions } from './hooks/use-data-options.js';
+import { useRadioInstance } from './hooks/use-radio-instance.js';
+import { convertBasicSizeToUiSize } from '../internal/utils.js';
+
+const { Group } = Radio;
+const loadingPlaceholder = /* @__PURE__ */ jsx(
+  "div",
+  {
+    css: css`
+      height: ${themeVariables.controlHeight}
+    `,
+    children: /* @__PURE__ */ jsx(VefLoadingPlaceholder, {})
+  }
+);
+function VefRadioBase({
+  defaultValue,
+  value,
+  disabled,
+  block,
+  variant,
+  buttonVariant,
+  buttonSize,
+  onChange,
+  ...restProps
+}, ref) {
+  const {
+    optionsMap,
+    normalizedOptions,
+    isLoading
+  } = useDataOptions({
+    value,
+    onChange,
+    ...restProps
+  });
+  const radioRef = useRadioInstance(ref, normalizedOptions);
+  const handleChange = useMemo(() => {
+    if (isFunction(onChange)) {
+      return ({ target: { value: value2 } }) => {
+        onChange(value2, optionsMap.get(value2));
+      };
+    }
+  }, [onChange, optionsMap]);
+  if (isLoading) {
+    return loadingPlaceholder;
+  }
+  const radios = normalizedOptions.map((option) => {
+    const {
+      value: value2,
+      label,
+      disabled: disabled2,
+      description
+    } = option;
+    if (description) {
+      return /* @__PURE__ */ jsx(VefTooltip, { content: description, children: /* @__PURE__ */ jsx(Radio, { disabled: disabled2, value: value2, children: label }) }, value2);
+    }
+    return /* @__PURE__ */ jsx(Radio, { disabled: disabled2, value: value2, children: label }, value2);
+  });
+  return /* @__PURE__ */ jsx(
+    Group,
+    {
+      ref: radioRef,
+      block,
+      buttonStyle: buttonVariant,
+      defaultValue,
+      disabled,
+      optionType: variant,
+      size: convertBasicSizeToUiSize(buttonSize),
+      onChange: handleChange,
+      ...value === void 0 ? {} : { value },
+      children: radios
+    }
+  );
+}
+const VefRadio = memo(
+  forwardRef(VefRadioBase)
+);
+VefRadio.displayName = "VefRadio";
+
+export { VefRadio as default };
 /*! 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/es/vef-rate/hooks/use-rate-instance.js

@@ -1,3 +1,14 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-import{useRef as r,useImperativeHandle as u}from"react";function t(t){const c=r(null);return u(t,(()=>({blur:()=>c.current?.blur(),focus:()=>c.current?.focus()}))),c}export{t as useRateInstance};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+import { useRef, useImperativeHandle } from 'react';
+
+function useRateInstance(ref) {
+  const rateRef = useRef(null);
+  useImperativeHandle(ref, () => ({
+    blur: () => rateRef.current?.blur(),
+    focus: () => rateRef.current?.focus()
+  }));
+  return rateRef;
+}
+
+export { useRateInstance };
 /*! 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 */