@onesy/ui-react 1.0.59 → 1.0.60

package/esm/ImageEdit/ImageEdit.js

@@ -122,6 +122,7 @@ const useStyle = styleMethod(theme => ({
 });
 const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const theme = useOnesyTheme();
+  const l = theme.l;
   const props = React.useMemo(() => _objectSpread(_objectSpread(_objectSpread({}, theme?.ui?.elements?.all?.props?.default), theme?.ui?.elements?.onesyImageEdit?.props?.default), props_), [props_]);
   const Line = React.useMemo(() => theme?.elements?.Line || LineElement, [theme]);
   const Type = React.useMemo(() => theme?.elements?.Type || TypeElement, [theme]);
@@ -538,13 +539,13 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
     refs.canvasMain.current?.getContext('2d').drawImage(refs.value.current, 0, 0, refs.value.current.width, refs.value.current.height);
   };
   let filters = React.useMemo(() => [{
-    label: 'Brightness',
+    label: l('Brightness'),
     Icon: IconBrightness,
     value: 'brightness',
     method: canvasBrightness,
     renderIconButton: (value__, selected_, onChangeFilter_) => /*#__PURE__*/React.createElement(Tooltip, _extends({
       key: value__,
-      label: "Brightness"
+      name: l('Brightness')
     }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
       version: "outlined",
       selected: selected_,
@@ -576,13 +577,13 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
       className: classNames([staticClassName('ImageEdit', theme) && ['onesy-ImageEdit-slider'], SliderProps.className, classes.slider])
     }))
   }, {
-    label: 'Contrast',
+    label: l('Contrast'),
     Icon: IconContrast,
     value: 'contrast',
     method: canvasContrast,
     renderIconButton: (value__, selected_, onChangeFilter_) => /*#__PURE__*/React.createElement(Tooltip, _extends({
       key: value__,
-      label: "Contrast"
+      name: l('Contrast')
     }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
       version: "outlined",
       selected: selected_,
@@ -614,13 +615,13 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
       className: classNames([staticClassName('ImageEdit', theme) && ['onesy-ImageEdit-slider'], SliderProps.className, classes.slider])
     }))
   }, {
-    label: 'Saturation',
+    label: l('Saturation'),
     Icon: IconSaturation,
     value: 'saturation',
     method: canvasSaturation,
     renderIconButton: (value__, selected_, onChangeFilter_) => /*#__PURE__*/React.createElement(Tooltip, _extends({
       key: value__,
-      label: "Saturation"
+      name: l('Saturation')
     }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
       version: "outlined",
       selected: selected_,
@@ -652,13 +653,13 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
       className: classNames([staticClassName('ImageEdit', theme) && ['onesy-ImageEdit-slider'], SliderProps.className, classes.slider])
     }))
   }, {
-    label: 'Fade',
+    label: l('Fade'),
     Icon: IconFade,
     value: 'fade',
     method: canvasFade,
     renderIconButton: (value__, selected_, onChangeFilter_) => /*#__PURE__*/React.createElement(Tooltip, _extends({
       key: value__,
-      label: "Fade"
+      name: l('Fade')
     }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
       version: "outlined",
       selected: selected_,
@@ -687,13 +688,13 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
       className: classNames([staticClassName('ImageEdit', theme) && ['onesy-ImageEdit-slider'], SliderProps.className, classes.slider])
     }))
   }, {
-    label: 'Invert',
+    label: l('Invert'),
     Icon: IconInvert,
     value: 'invert',
     method: canvasInvert,
     renderIconButton: (value__, selected_, onChangeFilter_) => /*#__PURE__*/React.createElement(Tooltip, _extends({
       key: value__,
-      label: "Invert"
+      name: l('Invert')
     }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
       version: "outlined",
       selected: selected_,
@@ -722,13 +723,13 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
       className: classNames([staticClassName('ImageEdit', theme) && ['onesy-ImageEdit-slider'], SliderProps.className, classes.slider])
     }))
   }, {
-    label: 'Old photo',
+    label: l('Old photo'),
     Icon: IconOldPhoto,
     value: 'old_photo',
     method: canvasOldPhoto,
     renderIconButton: (value__, selected_, onChangeFilter_) => /*#__PURE__*/React.createElement(Tooltip, _extends({
       key: value__,
-      label: "Old photo"
+      name: l('Old photo')
     }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
       version: "outlined",
       selected: selected_,
@@ -792,19 +793,19 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
     value: 16 / 9
   }];
   const options = [filtersOption && {
-    label: 'Filters',
+    label: l('Filters'),
     value: 'filters',
     Icon: IconFilters
   }, cropOption && {
-    label: 'Crop',
+    label: l('Crop'),
     value: 'crop',
     Icon: IconCrop
   }, resizeOption && {
-    label: 'Resize',
+    label: l('Resize'),
     value: 'resize',
     Icon: IconResize
   }, qualityOption && {
-    label: 'Quality',
+    label: l('Quality'),
     value: 'quality',
     Icon: IconQuality
   }].filter(Boolean);
@@ -926,7 +927,7 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
     className: classNames([staticClassName('ImageEdit', theme) && ['onesy-ImageEdit-inputs'], classes.inputs])
   }, is('function', renderInput) ? renderInput(value, valueCopy, resize, onChangeResize, 'width') : /*#__PURE__*/React.createElement(NumericTextField, {
     tonal: tonal,
-    label: "Width",
+    name: l('Width'),
     color: "default",
     version: "text",
     size: "small",
@@ -937,7 +938,7 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
     onChange: valueNew => onChangeResize(valueNew)
   }), is('function', renderInput) ? renderInput(value, valueCopy, resize, onChangeResize, 'height') : /*#__PURE__*/React.createElement(NumericTextField, {
     tonal: tonal,
-    label: "Height",
+    name: l('Height'),
     color: "default",
     version: "text",
     size: "small",
@@ -992,12 +993,12 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
     justify: "center",
     className: classNames([staticClassName('ImageEdit', theme) && ['onesy-ImageEdit-action'], classes.action])
   }, is('function', renderSave) ? renderSave(onSave) : /*#__PURE__*/React.createElement(Tooltip, _extends({
-    label: "Save"
+    name: l('Save')
   }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
     version: "outlined",
     onClick: onSave
   }, IconButtonProps), /*#__PURE__*/React.createElement(IconSave, null))), is('function', renderCancel) ? renderCancel(onSave) : /*#__PURE__*/React.createElement(Tooltip, _extends({
-    label: "Cancel"
+    name: l('Cancel')
   }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
     version: "outlined",
     onClick: onCancel
@@ -1015,7 +1016,7 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
     justify: "flex-start"
   }, options.map((item, index) => is('function', renderOption) ? renderOption(item, open && openOption === item.value, openOption) : /*#__PURE__*/React.createElement(Tooltip, _extends({
     key: index,
-    label: item.label
+    name: item.label
   }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
     version: "outlined",
     selected: open && openedOption === item.value,
@@ -1025,12 +1026,12 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
     direction: "row",
     align: "center"
   }, downloadOption && is('function', renderDownload) ? renderDownload(onDownload) : /*#__PURE__*/React.createElement(Tooltip, _extends({
-    label: "Download"
+    name: l('Download')
   }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
     version: "text",
     onClick: onDownload
   }, IconButtonProps), /*#__PURE__*/React.createElement(IconDownload, null))), is('function', renderOptionClear) ? renderOptionClear(onReset) : /*#__PURE__*/React.createElement(Tooltip, _extends({
-    label: "Reset"
+    name: l('Reset')
   }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, _extends({
     version: "text",
     onClick: onReset
@@ -1043,7 +1044,7 @@ const ImageEdit = /*#__PURE__*/React.forwardRef((props_, ref) => {
     align: "center",
     justify: "center",
     className: classNames([staticClassName('ImageEdit', theme) && ['onesy-ImageEdit-meta'], classes.meta])
-  }, /*#__PURE__*/React.createElement(Type, MetaTypeProps, "Dimensions: ", (!open ? value : valueCopy)?.width, "x", (!open ? value : valueCopy)?.height), /*#__PURE__*/React.createElement(Type, MetaTypeProps, "\xB7"), /*#__PURE__*/React.createElement(Type, MetaTypeProps, "Size: ", size))));
+  }, /*#__PURE__*/React.createElement(Type, MetaTypeProps, l('Dimensions'), ": ", (!open ? value : valueCopy)?.width, "x", (!open ? value : valueCopy)?.height), /*#__PURE__*/React.createElement(Type, MetaTypeProps, "\xB7"), /*#__PURE__*/React.createElement(Type, MetaTypeProps, l('Size'), ": ", size))));
 });
 ImageEdit.displayName = 'onesy-ImageEdit';
 export default ImageEdit;

package/esm/Info/Info.js

@@ -32,6 +32,7 @@ const useStyle = style(theme => ({
 });
 const Info = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const theme = useOnesyTheme();
+  const l = theme.l;
   const props = React.useMemo(() => _objectSpread(_objectSpread(_objectSpread({}, theme?.ui?.elements?.all?.props?.default), theme?.ui?.elements?.onesyInfo?.props?.default), props_), [props_]);
   const IconButton = React.useMemo(() => theme?.elements?.IconButton || IconButtonElement, [theme]);
   const Line = React.useMemo(() => theme?.elements?.Line || LineElement, [theme]);
@@ -70,7 +71,7 @@ const Info = /*#__PURE__*/React.forwardRef((props_, ref) => {
     }, TitleProps), title), children)),
     className: classNames([staticClassName('Info', theme) && ['onesy-Info-root'], className, classes.root])
   }, other), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Tooltip, _extends({
-    name: name !== undefined ? name : 'Info'
+    name: name !== undefined ? name : l('Info')
   }, TooltipProps), /*#__PURE__*/React.createElement(IconButton, IconButtonProps, /*#__PURE__*/React.createElement(Icon, IconProps)))));
 });
 Info.displayName = 'onesy-Info';

package/esm/Links/Links.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-const _excluded = ["name", "short_description", "cover", "profile", "links", "share", "start", "end", "IconMore", "IconShare", "ShareProps", "ItemShareProps", "IconButtonProps", "IconProps", "NameProps", "ShortDescriptionProps", "LinkProps", "LinkTypeProps", "className"];
+const _excluded = ["name", "short_description", "cover", "profile", "links", "share", "start", "end", "sensitiveText", "sensitiveDescription", "IconMore", "IconShare", "ShareProps", "ItemShareProps", "IconButtonProps", "IconProps", "NameProps", "ShortDescriptionProps", "LinkProps", "LinkTypeProps", "className"];
 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; }
 import React from 'react';
@@ -76,6 +76,7 @@ const useStyle = style(theme => ({
 });
 const Element = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const theme = useOnesyTheme();
+  const l = theme.l;
   const props = React.useMemo(() => _objectSpread(_objectSpread(_objectSpread({}, theme?.ui?.elements?.all?.props?.default), theme?.ui?.elements?.onesyLinks?.props?.default), props_), [props_]);
   const Line = React.useMemo(() => theme?.elements?.Line || LineElement, [theme]);
   const Section = React.useMemo(() => theme?.elements?.Section || SectionElement, [theme]);
@@ -97,6 +98,8 @@ const Element = /*#__PURE__*/React.forwardRef((props_, ref) => {
       share = true,
       start,
       end,
+      sensitiveText = l('Sensitive URL'),
+      sensitiveDescription = l('This is URL might contain sensitive information, confirm you are 18+ to continue.'),
       IconMore = IconMaterialMoreVert,
       IconShare = IconMaterialShare,
       ShareProps,
@@ -113,13 +116,13 @@ const Element = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const confirm = useConfirm();
   const onOpenLink = React.useCallback(async item => {
     const confirmed = item.sensitivity && !['none'].includes(item.sensitivity) ? await confirm.open({
-      name: 'Sensitive URL',
-      description: `This is URL might contain sensitive information, confirm you are 18+ to continue.`
+      name: sensitiveText,
+      description: sensitiveDescription
     }) : true;
     if (confirmed) {
       window.open(item.url, 'blank');
     }
-  }, []);
+  }, [sensitiveText, sensitiveDescription]);
   return /*#__PURE__*/React.createElement(Section, _extends({
     ref: ref,
     gap: 2,
@@ -199,7 +202,7 @@ const Element = /*#__PURE__*/React.forwardRef((props_, ref) => {
   }), /*#__PURE__*/React.createElement(Type, _extends({
     version: "b1",
     weight: 300
-  }, LinkTypeProps), item.name || 'Link')), /*#__PURE__*/React.createElement(Menu, {
+  }, LinkTypeProps), item.name || l('Link'))), /*#__PURE__*/React.createElement(Menu, {
     menuItems: [/*#__PURE__*/React.createElement(MenuItem, {
       start: /*#__PURE__*/React.createElement(IconShare, _extends({
         size: "small"
@@ -207,7 +210,7 @@ const Element = /*#__PURE__*/React.forwardRef((props_, ref) => {
       startAlign: "center",
       primary: /*#__PURE__*/React.createElement(Type, {
         version: "b3"
-      }, "Share"),
+      }, l('Share')),
       menu: item.share ? /*#__PURE__*/React.createElement(Share, _extends({
         version: "menu-items",
         name: item.name,

package/esm/Medias/Medias.js

@@ -141,6 +141,7 @@ const useStyle = styleMethod(theme => ({
 });
 const Medias = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const theme = useOnesyTheme();
+  const l = theme.l;
   const props = React.useMemo(() => _objectSpread(_objectSpread(_objectSpread({}, theme?.ui?.elements?.all?.props?.default), theme?.ui?.elements?.onesyMedias?.props?.default), props_), [props_]);
   const Line = React.useMemo(() => theme?.elements?.Line || LineElement, [theme]);
   const Link = React.useMemo(() => theme?.elements?.Link || LinkElement, [theme]);
@@ -285,7 +286,7 @@ const Medias = /*#__PURE__*/React.forwardRef((props_, ref) => {
       version: size === 'large' ? 'l2' : size === 'regular' ? 'l3' : 'l3'
     }, NameProps, {
       className: classNames([staticClassName('Medias', theme) && ['onesy-Medias-name'], NameProps?.className, classes.name])
-    }), media?.name || 'No name');
+    }), media?.name || l('No name'));
     if (version === 'embed') {
       return getLink(media, index);
     }

package/esm/MenuDesktop/MenuDesktop.js

@@ -161,7 +161,6 @@ const MenuDesktop = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const [openItem, setOpenItem] = React.useState();
   const [focus, setFocus] = React.useState();
   const [append, setAppend] = React.useState();
-  const [menuOpened, setMenuOpened] = React.useState();
   const [menu, setMenu] = React.useState();
   const refs = {
     root: React.useRef(undefined),
@@ -446,7 +445,7 @@ const MenuDesktop = /*#__PURE__*/React.forwardRef((props_, ref) => {
         color: color,
         version: version
       }, WrapperMenuProps, {
-        className: classNames([staticClassName('MenuDesktop', theme) && ['onesy-MenuDesktop-menu-wrapper'], WrapperMenuProps?.className, classes.menuWrapper, menuOpened && classes.menuWrapper_open]),
+        className: classNames([staticClassName('MenuDesktop', theme) && ['onesy-MenuDesktop-menu-wrapper'], WrapperMenuProps?.className, classes.menuWrapper]),
         style: _objectSpread(_objectSpread({}, append), WrapperMenuProps?.style)
       }), menu && menuTransition && /*#__PURE__*/React.createElement(Transitions, {
         switch: true,

package/esm/NavigationItem/NavigationItem.js

@@ -243,7 +243,7 @@ const NavigationItem = /*#__PURE__*/React.forwardRef((props_, ref) => {
   }
   const Icon = selected && iconSelected || icon;
   return /*#__PURE__*/React.createElement(Tooltip, _extends({
-    label: label || value,
+    name: label || value,
     position: "top",
     alignment: "center",
     longPress: true,

package/esm/NotFound/NotFound.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-const _excluded = ["name", "to", "link", "renderButton", "fullHeight", "start", "end", "ButtonProps", "TypeProps", "className"];
+const _excluded = ["name", "to", "link", "renderButton", "fullHeight", "start", "end", "buttonText", "ButtonProps", "TypeProps", "className"];
 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; }
 import React from 'react';
@@ -22,18 +22,20 @@ const useStyle = styleMethod(theme => ({
 });
 const NotFound = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const theme = useOnesyTheme();
+  const l = theme.l;
   const props = React.useMemo(() => _objectSpread(_objectSpread(_objectSpread({}, theme?.ui?.elements?.all?.props?.default), theme?.ui?.elements?.onesyNotFound?.props?.default), props_), [props_]);
   const Section = React.useMemo(() => theme?.elements?.Section || SectionElement, [theme]);
   const Type = React.useMemo(() => theme?.elements?.Type || TypeElement, [theme]);
   const Button = React.useMemo(() => theme?.elements?.Button || ButtonElement, [theme]);
   const {
-      name = 'Page not found 🫠',
+      name = l('Page not found'),
       to = '/',
       link = '',
       renderButton,
       fullHeight,
       start,
       end,
+      buttonText = l('Back'),
       ButtonProps,
       TypeProps,
       className
@@ -65,7 +67,7 @@ const NotFound = /*#__PURE__*/React.forwardRef((props_, ref) => {
     onClick: onTo
   }, ButtonProps, {
     className: classNames([staticClassName('NotFound', theme) && [`onesy-NotFound-button`], ButtonProps?.className, classes.button])
-  }), "Back"), end);
+  }), buttonText), end);
 });
 NotFound.displayName = 'onesy-NotFound';
 export default NotFound;

package/esm/Page/Page.js

@@ -36,6 +36,7 @@ const useStyle = styleMethod(theme => ({
 });
 const Page = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const theme = useOnesyTheme();
+  const l = theme.l;
   const props = React.useMemo(() => _objectSpread(_objectSpread(_objectSpread({}, theme?.ui?.elements?.all?.props?.default), theme?.ui?.elements?.onesyPage?.props?.default), props_), [props_]);
   const Line = React.useMemo(() => theme?.elements?.Line || LineElement, [theme]);
   const IconButton = React.useMemo(() => theme?.elements?.IconButton || IconButtonElement, [theme]);
@@ -66,11 +67,11 @@ const Page = /*#__PURE__*/React.forwardRef((props_, ref) => {
     justify: "space-between",
     fullWidth: true
   }, back ? /*#__PURE__*/React.createElement(Tooltip, {
-    name: (back?.name !== undefined ? back.name : back?.label) || 'Back'
+    name: (back?.name !== undefined ? back.name : back?.label) || l('Back')
   }, /*#__PURE__*/React.createElement(IconButton, _extends({
     onClick: () => navigate(back?.to)
   }, IconButtonProps), /*#__PURE__*/React.createElement(IconBack, null))) : /*#__PURE__*/React.createElement("span", null), forward ? /*#__PURE__*/React.createElement(Tooltip, {
-    name: (forward?.name !== undefined ? forward.name : forward?.label) || 'Forward'
+    name: (forward?.name !== undefined ? forward.name : forward?.label) || l('Forward')
   }, /*#__PURE__*/React.createElement(IconButton, _extends({
     onClick: () => navigate(forward?.to)
   }, IconButtonProps), /*#__PURE__*/React.createElement(IconForward, null))) : /*#__PURE__*/React.createElement("span", null));

package/esm/PieChart/PieChart.js

@@ -54,6 +54,7 @@ const useStyle = styleMethod(theme => ({
 });
 const PieChart = /*#__PURE__*/React.forwardRef((props_, ref) => {
   const theme = useOnesyTheme();
+  const l = theme.l;
   const props = React.useMemo(() => _objectSpread(_objectSpread(_objectSpread({}, theme?.ui?.elements?.all?.props?.default), theme?.ui?.elements?.onesyPieChart?.props?.default), props_), [props_]);
   const Line = React.useMemo(() => theme?.elements?.Line || LineElement, [theme]);
   const Type = React.useMemo(() => theme?.elements?.Type || TypeElement, [theme]);
@@ -142,8 +143,7 @@ const PieChart = /*#__PURE__*/React.forwardRef((props_, ref) => {
     // invert y so 0, 0 is at bottom left
     if (refs.rects.current && values) {
       const {
-        width,
-        height
+        width
       } = refs.rects.current.wrapper;
 
       // Legend
@@ -321,7 +321,7 @@ const PieChart = /*#__PURE__*/React.forwardRef((props_, ref) => {
         style: {
           fontWeight: 600
         }
-      }, names?.value || 'Value'), /*#__PURE__*/React.createElement(Type, {
+      }, names?.value || l('Value')), /*#__PURE__*/React.createElement(Type, {
         version: "b3"
       }, valueValue)), /*#__PURE__*/React.createElement(Line, {
         gap: 1,
@@ -332,7 +332,7 @@ const PieChart = /*#__PURE__*/React.forwardRef((props_, ref) => {
         style: {
           fontWeight: 600
         }
-      }, names?.percentage || 'Percentage'), /*#__PURE__*/React.createElement(Type, {
+      }, names?.percentage || l('Percentage')), /*#__PURE__*/React.createElement(Type, {
         version: "b3"
       }, valuePercentage, "%"))))
     };