venice-ui 3.0.23 → 3.0.25

package/dist/cjs/components/Checkbox/Checkbox.js

@@ -9,7 +9,7 @@ const config_1 = require("../../config");
 const ComponentRoot_1 = require("../ComponentRoot");
 const Checkbox_styles_1 = require("./Checkbox.styles");
 const IconsPath_1 = require("../Icon/IconsPath");
-const Checkbox = ({ name, value = false, size = 'md', label, labelPosition = 'top', theme, themeVariant = 'default', handleClick, isIntermedian = false, isDisabled = false, labelInversed = false, error = false, helperText, required = false, optional = false, optionalLabel, }) => {
+const Checkbox = ({ name, value = false, size = 'md', label, labelPosition = 'top', theme, width = 'auto', themeVariant = 'default', handleClick, isIntermedian = false, isDisabled = false, labelInversed = false, error = false, helperText, required = false, optional = false, optionalLabel, componentWidth }) => {
     const resolvedThemeData = (0, config_1.resolveThemeWithComponentsConfig)({
         theme,
         themeVariant,
@@ -26,8 +26,8 @@ const Checkbox = ({ name, value = false, size = 'md', label, labelPosition = 'to
             handleClick(!value);
         }
     };
-    return (react_1.default.createElement(ComponentRoot_1.ComponentRoot, { labelPosition: labelPosition, size: size, disabled: isDisabled, error: error, readOnly: false, required: required, optional: optional, optionalLabel: optionalLabel, helperText: helperText, themeVariant: themeVariant, theme: resolvedTheme, componentConfig: checkboxConfig, label: label, isActive: value, labelInversed: labelInversed, smallSize: true },
-        react_1.default.createElement(Checkbox_styles_1.CheckboxRoot, { onClick: onClick, isDisabled: isDisabled, id: 'dupa' },
+    return (react_1.default.createElement(ComponentRoot_1.ComponentRoot, { labelPosition: labelPosition, size: size, width: width, disabled: isDisabled, error: error, readOnly: false, required: required, optional: optional, optionalLabel: optionalLabel, helperText: helperText, themeVariant: themeVariant, theme: resolvedTheme, componentConfig: checkboxConfig, label: label, isActive: value, labelInversed: labelInversed, smallSize: true, componentWidth: componentWidth ? componentWidth : `${checkboxConfig.size[size].width}px` },
+        react_1.default.createElement(Checkbox_styles_1.CheckboxRoot, { onClick: onClick, isDisabled: isDisabled },
             react_1.default.createElement(Checkbox_styles_1.CheckboxBox, { theme: resolvedTheme, config: checkboxConfig, size: size, isDisabled: isDisabled, isIntermedian: isIntermedian, isActive: value }, (value || isIntermedian) && (react_1.default.createElement("svg", { width: resolvedSize.iconSize, height: resolvedSize.iconSize, viewBox: '0 0 24 24', preserveAspectRatio: "xMidYMid meet", x: "0", y: "0", name: name },
                 react_1.default.createElement("path", { d: iconName, fill: isDisabled
                         ? checkboxConfig.color.disabled.icon

package/dist/cjs/components/DatePicker/Calendar.js

@@ -42,7 +42,7 @@ const styled_components_1 = require("styled-components");
 const CalendarHeader_1 = require("./CalendarHeader");
 const ButtonsFooter_1 = require("../ButtonsFooter");
 const CalendarContent_1 = require("./CalendarContent");
-const Calendar = ({ theme, themeVariant = 'default', value, top, left, triggerTop, localeLabels, handleClose, handleSelect, isAdvance = true, autoConfirm = false, zIndex, config, labels, }) => {
+const Calendar = ({ theme, themeVariant = 'default', value, top, left, triggerTop, localeLabels, handleClose, handleSelect, isAdvance = true, zIndex, config, labels, }) => {
     const setYearScope = (date) => {
         const year = (0, date_fns_1.getYear)(date);
         const yearIndex = year % 12;
@@ -50,11 +50,6 @@ const Calendar = ({ theme, themeVariant = 'default', value, top, left, triggerTo
         const futureYears = Array.from({ length: 12 - yearIndex - 1 }, (_, i) => year + (i + 1));
         return [...pastYears, year, ...futureYears];
     };
-    const effectiveAutoConfirm = isAdvance
-        ? false
-        : typeof autoConfirm !== 'undefined'
-            ? Boolean(autoConfirm)
-            : true;
     const [calendarSettings, updateCalendarSettings] = (0, react_1.useState)(() => {
         const initialDate = value !== undefined ? new Date(value) : new Date();
         return {
@@ -127,7 +122,7 @@ const Calendar = ({ theme, themeVariant = 'default', value, top, left, triggerTo
     };
     const setNewDate = (newDate) => {
         setSellectedDate(newDate);
-        if (effectiveAutoConfirm && handleSelect) {
+        if (!isAdvance && handleSelect) {
             handleSelect((0, date_fns_1.getTime)(newDate));
             handleClose && handleClose();
         }

package/dist/cjs/components/Toggle/Toggle.js

@@ -21,7 +21,7 @@ const Toggle = ({ name, value = true, size = 'md', label, labelPosition = 'top',
             handleClick(!value);
         }
     };
-    return (react_1.default.createElement(ComponentRoot_1.ComponentRoot, { labelPosition: labelPosition, size: size, width: width, disabled: isDisabled, error: error, readOnly: false, required: required, optional: optional, optionalLabel: optionalLabel, helperText: helperText, themeVariant: themeVariant, theme: resolvedTheme, componentConfig: toggleConfig, label: label, isActive: value, labelInversed: labelInversed, smallSize: true, componentWidth: `${toggleConfig.size[size].width}  px` },
+    return (react_1.default.createElement(ComponentRoot_1.ComponentRoot, { labelPosition: labelPosition, size: size, width: width, disabled: isDisabled, error: error, readOnly: false, required: required, optional: optional, optionalLabel: optionalLabel, helperText: helperText, themeVariant: themeVariant, theme: resolvedTheme, componentConfig: toggleConfig, label: label, isActive: value, labelInversed: labelInversed, smallSize: true, componentWidth: componentWidth ? componentWidth : `${toggleConfig.size[size].width}px` },
         react_1.default.createElement(Toggle_styles_1.ToggleRoot, { onClick: onClick, isDisabled: isDisabled },
             react_1.default.createElement(Toggle_styles_1.ToggleTrack, { size: size, theme: resolvedTheme, config: toggleConfig, isDisabled: isDisabled, isActive: value },
                 react_1.default.createElement(Toggle_styles_1.TrackThumb, { size: size, theme: resolvedTheme, config: toggleConfig, isActive: value, isDisabled: isDisabled })))));

package/dist/esm/components/Checkbox/Checkbox.js

@@ -3,7 +3,7 @@ import { resolveThemeWithComponentsConfig } from '../../config';
 import { ComponentRoot } from '../ComponentRoot';
 import { CheckboxBox, CheckboxRoot } from './Checkbox.styles';
 import { iconsPath } from '../Icon/IconsPath';
-export const Checkbox = ({ name, value = false, size = 'md', label, labelPosition = 'top', theme, themeVariant = 'default', handleClick, isIntermedian = false, isDisabled = false, labelInversed = false, error = false, helperText, required = false, optional = false, optionalLabel, }) => {
+export const Checkbox = ({ name, value = false, size = 'md', label, labelPosition = 'top', theme, width = 'auto', themeVariant = 'default', handleClick, isIntermedian = false, isDisabled = false, labelInversed = false, error = false, helperText, required = false, optional = false, optionalLabel, componentWidth }) => {
     const resolvedThemeData = resolveThemeWithComponentsConfig({
         theme,
         themeVariant,
@@ -20,8 +20,8 @@ export const Checkbox = ({ name, value = false, size = 'md', label, labelPositio
             handleClick(!value);
         }
     };
-    return (React.createElement(ComponentRoot, { labelPosition: labelPosition, size: size, disabled: isDisabled, error: error, readOnly: false, required: required, optional: optional, optionalLabel: optionalLabel, helperText: helperText, themeVariant: themeVariant, theme: resolvedTheme, componentConfig: checkboxConfig, label: label, isActive: value, labelInversed: labelInversed, smallSize: true },
-        React.createElement(CheckboxRoot, { onClick: onClick, isDisabled: isDisabled, id: 'dupa' },
+    return (React.createElement(ComponentRoot, { labelPosition: labelPosition, size: size, width: width, disabled: isDisabled, error: error, readOnly: false, required: required, optional: optional, optionalLabel: optionalLabel, helperText: helperText, themeVariant: themeVariant, theme: resolvedTheme, componentConfig: checkboxConfig, label: label, isActive: value, labelInversed: labelInversed, smallSize: true, componentWidth: componentWidth ? componentWidth : `${checkboxConfig.size[size].width}px` },
+        React.createElement(CheckboxRoot, { onClick: onClick, isDisabled: isDisabled },
             React.createElement(CheckboxBox, { theme: resolvedTheme, config: checkboxConfig, size: size, isDisabled: isDisabled, isIntermedian: isIntermedian, isActive: value }, (value || isIntermedian) && (React.createElement("svg", { width: resolvedSize.iconSize, height: resolvedSize.iconSize, viewBox: '0 0 24 24', preserveAspectRatio: "xMidYMid meet", x: "0", y: "0", name: name },
                 React.createElement("path", { d: iconName, fill: isDisabled
                         ? checkboxConfig.color.disabled.icon

package/dist/esm/components/DatePicker/Calendar.js

@@ -6,7 +6,7 @@ import { ThemeProvider } from 'styled-components';
 import { CalendarHeader } from './CalendarHeader';
 import { ButtonsFooter } from '../ButtonsFooter';
 import { CalendarContent } from './CalendarContent';
-export const Calendar = ({ theme, themeVariant = 'default', value, top, left, triggerTop, localeLabels, handleClose, handleSelect, isAdvance = true, autoConfirm = false, zIndex, config, labels, }) => {
+export const Calendar = ({ theme, themeVariant = 'default', value, top, left, triggerTop, localeLabels, handleClose, handleSelect, isAdvance = true, zIndex, config, labels, }) => {
     const setYearScope = (date) => {
         const year = getYear(date);
         const yearIndex = year % 12;
@@ -14,11 +14,6 @@ export const Calendar = ({ theme, themeVariant = 'default', value, top, left, tr
         const futureYears = Array.from({ length: 12 - yearIndex - 1 }, (_, i) => year + (i + 1));
         return [...pastYears, year, ...futureYears];
     };
-    const effectiveAutoConfirm = isAdvance
-        ? false
-        : typeof autoConfirm !== 'undefined'
-            ? Boolean(autoConfirm)
-            : true;
     const [calendarSettings, updateCalendarSettings] = useState(() => {
         const initialDate = value !== undefined ? new Date(value) : new Date();
         return {
@@ -91,7 +86,7 @@ export const Calendar = ({ theme, themeVariant = 'default', value, top, left, tr
     };
     const setNewDate = (newDate) => {
         setSellectedDate(newDate);
-        if (effectiveAutoConfirm && handleSelect) {
+        if (!isAdvance && handleSelect) {
             handleSelect(getTime(newDate));
             handleClose && handleClose();
         }

package/dist/esm/components/Toggle/Toggle.js

@@ -15,7 +15,7 @@ export const Toggle = ({ name, value = true, size = 'md', label, labelPosition =
             handleClick(!value);
         }
     };
-    return (React.createElement(ComponentRoot, { labelPosition: labelPosition, size: size, width: width, disabled: isDisabled, error: error, readOnly: false, required: required, optional: optional, optionalLabel: optionalLabel, helperText: helperText, themeVariant: themeVariant, theme: resolvedTheme, componentConfig: toggleConfig, label: label, isActive: value, labelInversed: labelInversed, smallSize: true, componentWidth: `${toggleConfig.size[size].width}  px` },
+    return (React.createElement(ComponentRoot, { labelPosition: labelPosition, size: size, width: width, disabled: isDisabled, error: error, readOnly: false, required: required, optional: optional, optionalLabel: optionalLabel, helperText: helperText, themeVariant: themeVariant, theme: resolvedTheme, componentConfig: toggleConfig, label: label, isActive: value, labelInversed: labelInversed, smallSize: true, componentWidth: componentWidth ? componentWidth : `${toggleConfig.size[size].width}px` },
         React.createElement(ToggleRoot, { onClick: onClick, isDisabled: isDisabled },
             React.createElement(ToggleTrack, { size: size, theme: resolvedTheme, config: toggleConfig, isDisabled: isDisabled, isActive: value },
                 React.createElement(TrackThumb, { size: size, theme: resolvedTheme, config: toggleConfig, isActive: value, isDisabled: isDisabled })))));

package/dist/types/components/Checkbox/Checkbox.d.ts

@@ -7,6 +7,7 @@ interface ICheckboxProps {
     size?: InputSize;
     label?: string;
     labelPosition?: LabelPosition;
+    width?: string;
     theme?: AppTheme;
     themeVariant?: ThemeName;
     handleClick: (value: boolean) => void;
@@ -18,6 +19,7 @@ interface ICheckboxProps {
     required?: boolean;
     optional?: boolean;
     optionalLabel?: string;
+    componentWidth?: string;
 }
 export declare const Checkbox: FC<ICheckboxProps>;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "venice-ui",
-  "version": "3.0.23",
+  "version": "3.0.25",
   "description": "Component library",
   "main": "index.js",
   "module": "./dist/esm/index.js",