@vef-framework/components 1.0.128 → 1.0.129

package/cjs/vef-breadcrumb/index.cjs

@@ -1,53 +1,2 @@
 "use strict";
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('@emotion/react/jsx-runtime');
-var shared = require('@vef-framework/shared');
-var antd = require('antd');
-var react = require('react');
-
-"use strict";
-function VefBreadcrumb({ items, onClick }) {
-  const breadcrumbItems = react.useMemo(() => items.map((item) => {
-    const {
-      label,
-      key,
-      dropdownItems
-    } = item;
-    return {
-      title: label,
-      key,
-      menu: shared.isArray(dropdownItems) && dropdownItems.length > 0 ? {
-        items: dropdownItems.map((it) => ({
-          key: it.key,
-          title: it.label
-        })),
-        onClick: ({ key: key2 }) => onClick?.(key2)
-      } : void 0
-    };
-  }), [items, onClick]);
-  const renderItem = react.useCallback(({ key, title }) => {
-    if (shared.isString(key)) {
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "a",
-        {
-          className: "vef-breadcrumb-link",
-          onClick: () => onClick?.(key),
-          children: title
-        }
-      );
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "vef-breadcrumb-text", children: title });
-  }, [onClick]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    antd.Breadcrumb,
-    {
-      itemRender: renderItem,
-      items: breadcrumbItems
-    }
-  );
-}
-
-exports.default = VefBreadcrumb;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a=require("@emotion/react/jsx-runtime"),l=require("@vef-framework/shared"),k=require("antd"),u=require("react");function o({items:n,onClick:e}){const c=u.useMemo(()=>n.map(r=>{const{label:t,key:d,dropdownItems:s}=r;return{title:t,key:d,menu:l.isArray(s)&&s.length>0?{items:s.map(i=>({key:i.key,title:i.label})),onClick:({key:i})=>e?.(i)}:void 0}}),[n,e]),m=u.useCallback(({key:r,title:t})=>l.isString(r)?a.jsx("a",{className:"vef-breadcrumb-link",onClick:()=>e?.(r),children:t}):a.jsx("span",{className:"vef-breadcrumb-text",children:t}),[e]);return a.jsx(k.Breadcrumb,{itemRender:m,items:c})}exports.default=o;

package/cjs/vef-breadcrumb/props.cjs

@@ -1,4 +1,2 @@
 "use strict";
-'use strict';
-
 "use strict";

package/cjs/vef-button/components/base-button.cjs

@@ -1,78 +1,2 @@
 "use strict";
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('@emotion/react/jsx-runtime');
-var hooks = require('@vef-framework/hooks');
-var shared = require('@vef-framework/shared');
-var antd = require('antd');
-var react = require('react');
-require('../../internal/index.cjs');
-var utils = require('../../internal/utils.cjs');
-
-"use strict";
-const buttonColorTypes = [...shared.defaultColorTypes, "default", "primary", "error"];
-const VefBaseButton = react.forwardRef(({
-  color,
-  iconPosition,
-  size,
-  type,
-  variant = "solid",
-  autoInsertSpace,
-  disabled,
-  loading,
-  ...restProps
-}, ref) => {
-  const colorTokens = hooks.useColorTokens();
-  const iconPositionToUse = iconPosition === "left" ? "start" : iconPosition === "right" ? "end" : void 0;
-  if (!color || buttonColorTypes.includes(color)) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      antd.Button,
-      {
-        ref,
-        autoInsertSpace,
-        color: color === "error" ? "danger" : color,
-        disabled: loading ? false : disabled,
-        htmlType: type,
-        iconPosition: iconPositionToUse,
-        loading,
-        size: utils.convertBasicSizeToUiSize(size),
-        variant,
-        ...restProps
-      }
-    );
-  }
-  if (colorTokens.has(color)) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      antd.ConfigProvider,
-      {
-        theme: {
-          token: {
-            colorPrimary: colorTokens.get(color)
-          }
-        },
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          antd.Button,
-          {
-            ref,
-            autoInsertSpace,
-            color: "primary",
-            disabled: loading ? false : disabled,
-            htmlType: type,
-            iconPosition: iconPositionToUse,
-            loading,
-            size: utils.convertBasicSizeToUiSize(size),
-            variant,
-            ...restProps
-          }
-        )
-      }
-    );
-  } else {
-    throw new Error(`Invalid button color: ${color}`);
-  }
-});
-VefBaseButton.displayName = "VefBaseButton";
-
-exports.default = VefBaseButton;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var i=require("@emotion/react/jsx-runtime"),y=require("@vef-framework/hooks"),g=require("@vef-framework/shared"),o=require("antd"),m=require("react");require("../../internal/index.cjs");var h=require("../../internal/utils.cjs");const q=[...g.defaultColorTypes,"default","primary","error"],p=m.forwardRef(({color:r,iconPosition:t,size:a,type:n,variant:s="solid",autoInsertSpace:u,disabled:l,loading:e,...d},c)=>{const v=y.useColorTokens(),f=t==="left"?"start":t==="right"?"end":void 0;if(!r||q.includes(r))return i.jsx(o.Button,{ref:c,autoInsertSpace:u,color:r==="error"?"danger":r,disabled:e?!1:l,htmlType:n,iconPosition:f,loading:e,size:h.convertBasicSizeToUiSize(a),variant:s,...d});if(v.has(r))return i.jsx(o.ConfigProvider,{theme:{token:{colorPrimary:v.get(r)}},children:i.jsx(o.Button,{ref:c,autoInsertSpace:u,color:"primary",disabled:e?!1:l,htmlType:n,iconPosition:f,loading:e,size:h.convertBasicSizeToUiSize(a),variant:s,...d})});throw new Error(`Invalid button color: ${r}`)});p.displayName="VefBaseButton",exports.default=p;

package/cjs/vef-button/index.cjs

@@ -1,156 +1,2 @@
 "use strict";
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('@emotion/react/jsx-runtime');
-var hooks = require('@vef-framework/hooks');
-var shared = require('@vef-framework/shared');
-var react = require('react');
-var index$1 = require('../vef-popconfirm/index.cjs');
-var index = require('../vef-tooltip/index.cjs');
-var baseButton = require('./components/base-button.cjs');
-
-"use strict";
-const VefButtonBase = react.forwardRef(({
-  tip,
-  onClick,
-  disabled = false,
-  loading,
-  ...restProps
-}, ref) => {
-  const [isLoading, setIsLoading] = react.useState(false);
-  const onConfirmationOkToUse = react.useMemo(
-    () => {
-      if (restProps.requireConfirmation) {
-        const { onConfirmationOk } = restProps;
-        return shared.isNullish(loading) ? async () => {
-          await shared.invokeMaybeAsyncFn(
-            onConfirmationOk,
-            {
-              beforeInvoke: () => {
-                setIsLoading(true);
-              },
-              onFinally: () => {
-                setIsLoading(false);
-              }
-            }
-          );
-        } : onConfirmationOk;
-      }
-    },
-    // eslint-disable-next-line ts/ban-ts-comment
-    // @ts-expect-error
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [restProps.requireConfirmation, restProps.onConfirmationOk]
-  );
-  const onClickToUse = react.useMemo(
-    () => {
-      if (!restProps.requireConfirmation) {
-        if (onClick && shared.isNullish(loading)) {
-          return async (event) => {
-            await shared.invokeMaybeAsyncFn(
-              onClick,
-              {
-                beforeInvoke: () => {
-                  setIsLoading(true);
-                },
-                onFinally: () => {
-                  setIsLoading(false);
-                }
-              },
-              event
-            );
-          };
-        } else {
-          return onClick;
-        }
-      }
-      const {
-        confirmationMode = "simple",
-        confirmationTitle = shared.defaultMessageTitle,
-        confirmationContent,
-        onConfirmationCancel
-      } = restProps;
-      if (confirmationMode === "simple") {
-        return (event) => {
-          event.stopPropagation();
-        };
-      }
-      return (event) => {
-        event.stopPropagation();
-        shared.showConfirmation(
-          confirmationTitle,
-          confirmationContent,
-          onConfirmationOkToUse,
-          {
-            onCancel: onConfirmationCancel
-          }
-        );
-      };
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-      loading,
-      onClick,
-      onConfirmationOkToUse,
-      restProps.requireConfirmation,
-      // eslint-disable-next-line ts/ban-ts-comment
-      // @ts-expect-error
-      restProps.confirmationMode,
-      // eslint-disable-next-line ts/ban-ts-comment
-      // @ts-expect-error
-      restProps.confirmationTitle,
-      // eslint-disable-next-line ts/ban-ts-comment
-      // @ts-expect-error
-      restProps.confirmationContent,
-      // eslint-disable-next-line ts/ban-ts-comment
-      // @ts-expect-error
-      restProps.onConfirmationCancel
-    ]
-  );
-  const contextDisabled = hooks.useContextDisabled();
-  const buttonDisabled = contextDisabled || disabled;
-  const buttonNode = /* @__PURE__ */ jsxRuntime.jsx(
-    baseButton.default,
-    {
-      ref,
-      disabled: buttonDisabled,
-      loading: loading ?? isLoading,
-      onClick: onClickToUse,
-      ...shared.omit(restProps, [
-        "requireConfirmation",
-        "confirmationMode",
-        "confirmationTitle",
-        "confirmationContent",
-        "onConfirmationOk",
-        "onConfirmationCancel"
-      ])
-    }
-  );
-  const buttonNodeMaybeWithTip = tip ? /* @__PURE__ */ jsxRuntime.jsx(index.default, { content: tip, children: buttonNode }) : buttonNode;
-  if (restProps.requireConfirmation && restProps.confirmationMode === "simple") {
-    const {
-      confirmationTitle = shared.defaultMessageTitle,
-      confirmationContent,
-      onConfirmationCancel
-    } = restProps;
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      index$1.default,
-      {
-        ref,
-        content: confirmationContent,
-        disabled: buttonDisabled,
-        title: confirmationTitle,
-        onCancel: onConfirmationCancel,
-        onOk: onConfirmationOkToUse,
-        children: buttonNodeMaybeWithTip
-      }
-    );
-  }
-  return buttonNodeMaybeWithTip;
-});
-const VefButton = react.memo(VefButtonBase);
-VefButton.displayName = "VefButton";
-
-exports.default = VefButton;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var u=require("@emotion/react/jsx-runtime"),h=require("@vef-framework/hooks"),e=require("@vef-framework/shared"),r=require("react"),x=require("../vef-popconfirm/index.cjs"),g=require("../vef-tooltip/index.cjs"),T=require("./components/base-button.cjs");const j=r.forwardRef(({tip:c,onClick:t,disabled:M=!1,loading:a,...n},d)=>{const[b,s]=r.useState(!1),f=r.useMemo(()=>{if(n.requireConfirmation){const{onConfirmationOk:i}=n;return e.isNullish(a)?async()=>{await e.invokeMaybeAsyncFn(i,{beforeInvoke:()=>{s(!0)},onFinally:()=>{s(!1)}})}:i}},[n.requireConfirmation,n.onConfirmationOk]),p=r.useMemo(()=>{if(!n.requireConfirmation)return t&&e.isNullish(a)?async o=>{await e.invokeMaybeAsyncFn(t,{beforeInvoke:()=>{s(!0)},onFinally:()=>{s(!1)}},o)}:t;const{confirmationMode:i="simple",confirmationTitle:l=e.defaultMessageTitle,confirmationContent:m,onConfirmationCancel:y}=n;return i==="simple"?o=>{o.stopPropagation()}:o=>{o.stopPropagation(),e.showConfirmation(l,m,f,{onCancel:y})}},[a,t,f,n.requireConfirmation,n.confirmationMode,n.confirmationTitle,n.confirmationContent,n.onConfirmationCancel]),C=h.useContextDisabled()||M,q=u.jsx(T.default,{ref:d,disabled:C,loading:a??b,onClick:p,...e.omit(n,["requireConfirmation","confirmationMode","confirmationTitle","confirmationContent","onConfirmationOk","onConfirmationCancel"])}),k=c?u.jsx(g.default,{content:c,children:q}):q;if(n.requireConfirmation&&n.confirmationMode==="simple"){const{confirmationTitle:i=e.defaultMessageTitle,confirmationContent:l,onConfirmationCancel:m}=n;return u.jsx(x.default,{ref:d,content:l,disabled:C,title:i,onCancel:m,onOk:f,children:k})}return k}),v=r.memo(j);v.displayName="VefButton",exports.default=v;

package/cjs/vef-button/props.cjs

@@ -1,4 +1,2 @@
 "use strict";
-'use strict';
-
 "use strict";

package/cjs/vef-card/index.cjs

@@ -1,30 +1,2 @@
 "use strict";
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('@emotion/react/jsx-runtime');
-var shared = require('@vef-framework/shared');
-var antd = require('antd');
-
-"use strict";
-function VefCard({
-  size = "medium",
-  showHoverEffect = false,
-  actions,
-  nested = false,
-  ...restProps
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    antd.Card,
-    {
-      actions: shared.isArray(actions) ? actions : actions ? [actions] : void 0,
-      hoverable: showHoverEffect,
-      size: size === "medium" ? "default" : size,
-      type: nested ? "inner" : void 0,
-      ...restProps
-    }
-  );
-}
-
-exports.default = VefCard;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var u=require("@emotion/react/jsx-runtime"),a=require("@vef-framework/shared"),d=require("antd");function n({size:r="medium",showHoverEffect:i=!1,actions:e,nested:t=!1,...s}){return u.jsx(d.Card,{actions:a.isArray(e)?e:e?[e]:void 0,hoverable:i,size:r==="medium"?"default":r,type:t?"inner":void 0,...s})}exports.default=n;

package/cjs/vef-card/props.cjs

@@ -1,4 +1,2 @@
 "use strict";
-'use strict';
-
 "use strict";

package/cjs/vef-card-meta/index.cjs

@@ -1,17 +1,2 @@
 "use strict";
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('@emotion/react/jsx-runtime');
-var antd = require('antd');
-
-"use strict";
-const { Meta: CardMeta } = antd.Card;
-function VefCardMeta({
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(CardMeta, { ...props });
-}
-
-exports.default = VefCardMeta;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@emotion/react/jsx-runtime"),r=require("antd");const{Meta:u}=r.Card;function a({...e}){return t.jsx(u,{...e})}exports.default=a;

package/cjs/vef-card-meta/props.cjs

@@ -1,4 +1,2 @@
 "use strict";
-'use strict';
-
 "use strict";

package/cjs/vef-chart-container/hooks/use-chart-container-context.cjs

@@ -1,17 +1,2 @@
 "use strict";
-'use strict';
-
-var shared = require('@vef-framework/shared');
-
-"use strict";
-const {
-  useContextSelector: useChartContainerContextSelector,
-  useContext: useChartContainerContext,
-  ContextProvider: ChartContainerContextProvider
-} = shared.createSelectableContext({
-  config: {}
-});
-
-exports.ChartContainerContextProvider = ChartContainerContextProvider;
-exports.useChartContainerContext = useChartContainerContext;
-exports.useChartContainerContextSelector = useChartContainerContextSelector;
+"use strict";var e=require("@vef-framework/shared");const{useContextSelector:t,useContext:r,ContextProvider:o}=e.createSelectableContext({config:{}});exports.ChartContainerContextProvider=o,exports.useChartContainerContext=r,exports.useChartContainerContextSelector=t;

package/cjs/vef-chart-container/index.cjs

@@ -1,30 +1,18 @@
 "use strict";
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('@emotion/react/jsx-runtime');
-var react = require('@emotion/react');
-var shared = require('@vef-framework/shared');
-var react$1 = require('react');
-var recharts = require('recharts');
-var useChartContainerContext = require('./hooks/use-chart-container-context.cjs');
-
-"use strict";
-const chartContainerStyle = react.css`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a=require("@emotion/react/jsx-runtime"),x=require("@emotion/react"),r=require("@vef-framework/shared"),n=require("react"),k=require("recharts"),v=require("./hooks/use-chart-container-context.cjs");const $=x.css`
   display: flex;
   justify-content: center;
   
   & .recharts-cartesian-axis-tick text {
-    fill: ${shared.themeVariables.colorTextDescription};
+    fill: ${r.themeVariables.colorTextDescription};
   }
   
   & .recharts-cartesian-grid line[stroke='#ccc'] {
-    stroke: color-mix(in srgb, ${shared.themeVariables.colorBorder} 50%, transparent);
+    stroke: color-mix(in srgb, ${r.themeVariables.colorBorder} 50%, transparent);
   }
   
   & .recharts-curve.recharts-tooltip-cursor {
-    stroke: ${shared.themeVariables.colorBorderSecondary};
+    stroke: ${r.themeVariables.colorBorderSecondary};
   }
   
   & .recharts-dot[stroke='#fff'] {
@@ -36,19 +24,19 @@ const chartContainerStyle = react.css`
   }
   
   & .recharts-polar-grid[stroke='#ccc'] {
-    stroke: ${shared.themeVariables.colorBorderSecondary};
+    stroke: ${r.themeVariables.colorBorderSecondary};
   }
   
   & .recharts-radial-bar-background-sector {
-    fill: ${shared.themeVariables.colorFillContent};
+    fill: ${r.themeVariables.colorFillContent};
   }
   
   & .recharts-rectangle.recharts-tooltip-cursor {
-    fill: ${shared.themeVariables.colorFillContent};
+    fill: ${r.themeVariables.colorFillContent};
   }
   
   & .recharts-reference-line[stroke='#ccc'] {
-    stroke: ${shared.themeVariables.colorBorderSecondary};
+    stroke: ${r.themeVariables.colorBorderSecondary};
   }
   
   & .recharts-sector[stroke='#fff'] {
@@ -62,67 +50,9 @@ const chartContainerStyle = react.css`
   & .recharts-surface {
     outline: none;
   }
-`;
-function ChartStyle({
-  id,
-  config
-}) {
-  const colors = Object.entries(config).map(([key, { color }]) => [key, color]).filter(([, color]) => shared.isString(color));
-  if (!colors.length) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "style",
-    {
-      dangerouslySetInnerHTML: {
-        __html: `
-          [data-chart="${id}"] {
-            ${colors.map(([key, color]) => `--vef-color-${key}: ${color};`).join("\n")}
-          }
-        `
-      }
-    }
-  );
-}
-const VefChartContainer = react$1.forwardRef(({
-  id,
-  className,
-  children,
-  config,
-  aspect = 16 / 9,
-  width = "100%",
-  height,
-  minWidth,
-  minHeight,
-  ...restProps
-}, ref) => {
-  const uniqueId = react$1.useId();
-  const chartId = `${id || uniqueId.replace(/:/g, "")}-chart`;
-  return /* @__PURE__ */ jsxRuntime.jsx(useChartContainerContext.ChartContainerContextProvider, { value: { config }, children: /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      ref,
-      className,
-      css: chartContainerStyle,
-      "data-chart": chartId,
-      ...restProps,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ChartStyle, { config, id: chartId }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          recharts.ResponsiveContainer,
-          {
-            aspect,
-            height,
-            minHeight,
-            minWidth,
-            width,
-            children
+`;function b({id:c,config:o}){const s=Object.entries(o).map(([e,{color:t}])=>[e,t]).filter(([,e])=>r.isString(e));return s.length?a.jsx("style",{dangerouslySetInnerHTML:{__html:`
+          [data-chart="${c}"] {
+            ${s.map(([e,t])=>`--vef-color-${e}: ${t};`).join(`
+`)}
           }
-        )
-      ]
-    }
-  ) });
-});
-VefChartContainer.displayName = "VefChartContainer";
-
-exports.default = VefChartContainer;
+        `}}):null}const l=n.forwardRef(({id:c,className:o,children:s,config:e,aspect:t=16/9,width:h="100%",height:d,minWidth:u,minHeight:f,...m},g)=>{const p=n.useId(),i=`${c||p.replace(/:/g,"")}-chart`;return a.jsx(v.ChartContainerContextProvider,{value:{config:e},children:a.jsxs("div",{ref:g,className:o,css:$,"data-chart":i,...m,children:[a.jsx(b,{config:e,id:i}),a.jsx(k.ResponsiveContainer,{aspect:t,height:d,minHeight:f,minWidth:u,width:h,children:s})]})})});l.displayName="VefChartContainer",exports.default=l;

package/cjs/vef-chart-container/props.cjs

@@ -1,4 +1,2 @@
 "use strict";
-'use strict';
-
 "use strict";

package/cjs/vef-chart-legend-content/index.cjs

@@ -1,55 +1,17 @@
 "use strict";
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('@emotion/react/jsx-runtime');
-var react = require('@emotion/react');
-var shared = require('@vef-framework/shared');
-var react$1 = require('react');
-require('../internal/index.cjs');
-var useChartContainerContext = require('../vef-chart-container/hooks/use-chart-container-context.cjs');
-var chart = require('../internal/chart.cjs');
-
-"use strict";
-const chartLegendContentStyle = react.css`
-  ${shared.styles.flexCenter}
-  gap: ${shared.themeVariables.margin};
-  padding-top: ${shared.themeVariables.marginSm};
-`;
-const itemStyle = react.css`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a=require("@emotion/react/jsx-runtime"),t=require("@emotion/react"),r=require("@vef-framework/shared"),u=require("react");require("../internal/index.cjs");var h=require("../vef-chart-container/hooks/use-chart-container-context.cjs"),m=require("../internal/chart.cjs");const g=t.css`
+  ${r.styles.flexCenter}
+  gap: ${r.themeVariables.margin};
+  padding-top: ${r.themeVariables.marginSm};
+`,f=t.css`
   display: flex;
   align-items: center;
-  gap: ${shared.themeVariables.marginXs};
-  color: ${shared.themeVariables.colorTextLabel};
-`;
-const indicatorStyle = react.css`
+  gap: ${r.themeVariables.marginXs};
+  color: ${r.themeVariables.colorTextLabel};
+`,v=t.css`
   flex: none;
   width: 0.75rem;
   height: 0.75rem;
-  border-radius: ${shared.themeVariables.borderRadiusXs};
+  border-radius: ${r.themeVariables.borderRadiusXs};
   background-color: var(--vef-indicator-color);
-`;
-const VefChartLegendContent = react$1.forwardRef(({
-  className,
-  payload
-}, ref) => {
-  const config = useChartContainerContext.useChartContainerContextSelector((ctx) => ctx.config);
-  if (!payload?.length) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className, css: chartLegendContentStyle, children: payload.map(
-    (item) => {
-      const key = `${item.dataKey || "value"}`;
-      const itemConfig = chart.getPayloadConfigFromPayload(item, key, config);
-      return /* @__PURE__ */ jsxRuntime.jsxs("div", { css: itemStyle, children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { css: indicatorStyle, style: { "--vef-indicator-color": item.color } }),
-        itemConfig?.label
-      ] }, item.value);
-    }
-  ) });
-});
-VefChartLegendContent.displayName = "VefChartLegendContent";
-
-exports.VefChartLegendContent = VefChartLegendContent;
-exports.default = VefChartLegendContent;
+`,s=u.forwardRef(({className:n,payload:i},o)=>{const l=h.useChartContainerContextSelector(e=>e.config);return i?.length?a.jsx("div",{ref:o,className:n,css:g,children:i.map(e=>{const c=`${e.dataKey||"value"}`,d=m.getPayloadConfigFromPayload(e,c,l);return a.jsxs("div",{css:f,children:[a.jsx("div",{css:v,style:{"--vef-indicator-color":e.color}}),d?.label]},e.value)})}):null});s.displayName="VefChartLegendContent",exports.VefChartLegendContent=s,exports.default=s;

package/cjs/vef-chart-legend-content/props.cjs

@@ -1,4 +1,2 @@
 "use strict";
-'use strict';
-
 "use strict";