venice-ui 2.0.35 → 2.0.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -74,7 +74,7 @@ exports.mainTheme = {
74
74
  disabledText: exports.Theme.colors.gray_1,
75
75
  errorBackgroundColor: exports.Theme.colors.red,
76
76
  errorBackgroundColorHover: (0, polished_1.lighten)(0.3, exports.Theme.colors.red),
77
- errorBackgroundColorHoverLight: (0, polished_1.lighten)(0.5, exports.Theme.colors.red),
77
+ errorBackgroundColorHoverLight: (0, polished_1.lighten)(0.6, exports.Theme.colors.red),
78
78
  //icon
79
79
  iconColor: exports.Theme.colors.text,
80
80
  iconHoverColor: exports.Theme.colors.primary,
@@ -93,7 +93,7 @@ exports.mainTheme = {
93
93
  inputDisabledBackground: exports.Theme.colors.gray_4,
94
94
  inputDisabledBorder: exports.Theme.colors.gray_1,
95
95
  inputDisabledTextColor: exports.Theme.colors.gray_1,
96
- inputErrorBackground: (0, polished_1.lighten)(0.5, exports.Theme.colors.red),
96
+ inputErrorBackground: (0, polished_1.lighten)(0.6, exports.Theme.colors.red),
97
97
  inputErrorBorder: exports.Theme.colors.red,
98
98
  inputErrorTextColor: exports.Theme.colors.red,
99
99
  // global
@@ -72,6 +72,7 @@ const Calendar = ({ value, top, left, size, handleClose, handleSelect, zIndex })
72
72
  });
73
73
  };
74
74
  const setNewDate = (newDate) => {
75
+ console.log('setNewDate', newDate);
75
76
  setSellectedDate(newDate);
76
77
  };
77
78
  const confirmDate = () => {
@@ -35,7 +35,7 @@ const react_dom_1 = require("react-dom");
35
35
  const Calendar_1 = require("./Calendar");
36
36
  const date_fns_1 = require("date-fns");
37
37
  const Icons_1 = require("../Icons");
38
- const DatePicker = ({ label, labelPosition = 'top', value, name, disabled = false, size = 'medium', width, error, theme = Theme_1.mainTheme, readOnly = false, position = 'left', placeholder = 'Select date', handleChange, zIndex }) => {
38
+ const DatePicker = ({ label, labelPosition = 'top', value, name, disabled = false, size = 'medium', width, error, errorMsg, theme = Theme_1.mainTheme, readOnly = false, position = 'left', placeholder = 'Select date', handleChange, zIndex }) => {
39
39
  const [open, toogleOpen] = (0, react_1.useState)(false);
40
40
  const sourceRef = (0, react_1.useRef)(null);
41
41
  const [dropdownStyles, setDropdownStyles] = (0, react_1.useState)({
@@ -33,7 +33,7 @@ const common_1 = require("../common");
33
33
  const react_dom_1 = require("react-dom");
34
34
  const Icons_1 = require("../Icons");
35
35
  const Theme_1 = require("../../Theme");
36
- const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = false, error, width, options, value, placeholder = 'Please select', name, handleSelect, position = 'left', zIndex, readOnly = false, theme = Theme_1.mainTheme, }) => {
36
+ const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = false, error, errorMsg, width, options, value, placeholder = 'Please select', name, handleSelect, position = 'left', zIndex, readOnly = false, theme = Theme_1.mainTheme, }) => {
37
37
  const [open, toogleOpen] = (0, react_1.useState)(false);
38
38
  const ref = (0, react_1.useRef)(null);
39
39
  const sourceRef = (0, react_1.useRef)(null);
@@ -87,6 +87,6 @@ const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = fa
87
87
  open &&
88
88
  (0, react_dom_1.createPortal)(react_1.default.createElement(common_1.Panel, { style: dropdownStyles, ref: ref, size: size, fullWidth: true, zIndex: zIndex }, options &&
89
89
  options.map((option) => (react_1.default.createElement(common_1.PanelOption, { key: option.value, active: option.value === value, onClick: (e) => selectOption(e, option.value) }, option.label)))), document.body),
90
- error && react_1.default.createElement(Input_1.InputErrorMsg, null, error)))));
90
+ (error && errorMsg) && react_1.default.createElement(Input_1.InputErrorMsg, null, errorMsg)))));
91
91
  };
92
92
  exports.Dropdown = Dropdown;
@@ -31,7 +31,7 @@ const Button_1 = require("../Button");
31
31
  const File_styles_1 = require("./File.styles");
32
32
  const Dropdown_1 = require("../Dropdown");
33
33
  const Typography_1 = require("../Typography");
34
- const File = ({ label, labelPosition = 'top', name, disabled = false, multiple = false, size = 'medium', handleChange, accept = 'application/pdf', width, error, placeholder, fileValue, subLabel }) => {
34
+ const File = ({ label, labelPosition = 'top', name, disabled = false, multiple = false, size = 'medium', handleChange, accept = 'application/pdf', width, error, errorMsg, placeholder, fileValue, subLabel }) => {
35
35
  const fileRef = (0, react_1.useRef)(null);
36
36
  const handleSelect = (e) => {
37
37
  handleChange(e);
@@ -48,6 +48,6 @@ const File = ({ label, labelPosition = 'top', name, disabled = false, multiple =
48
48
  react_1.default.createElement(Button_1.Button, { size: size, mode: "secondary", onClick: openFileSelector, text: "Wybierz plik" })),
49
49
  subLabel && react_1.default.createElement(Typography_1.TextMicro, null, subLabel)),
50
50
  react_1.default.createElement(File_styles_1.HiddenField, { type: "file", name: name, onChange: (e) => handleSelect(e), ref: fileRef, accept: accept, multiple: multiple }),
51
- error && react_1.default.createElement(Input_1.InputErrorMsg, null, error))));
51
+ (error && errorMsg) && react_1.default.createElement(Input_1.InputErrorMsg, null, errorMsg))));
52
52
  };
53
53
  exports.File = File;
@@ -30,7 +30,7 @@ const Aligment_1 = require("../Aligment");
30
30
  const Input_styles_1 = require("./Input.styles");
31
31
  const Icons_1 = require("../Icons");
32
32
  const Theme_1 = require("../../Theme");
33
- const Input = ({ label, labelPosition = 'top', value, type = 'text', name, disabled = false, size = 'medium', handleChange, handleSubmit, width, error, placeholder, min, max, step = 0.1, autoFocus, theme = Theme_1.mainTheme, readOnly = false, prefix, }) => {
33
+ const Input = ({ label, labelPosition = 'top', value, type = 'text', name, disabled = false, size = 'medium', handleChange, handleSubmit, width, error = false, errorMsg, placeholder, min, max, step = 0.1, autoFocus, theme = Theme_1.mainTheme, readOnly = false, prefix, }) => {
34
34
  const calculateNumberValue = (numberValue) => {
35
35
  return isNaN(parseFloat(numberValue))
36
36
  ? numberValue
@@ -99,6 +99,6 @@ const Input = ({ label, labelPosition = 'top', value, type = 'text', name, disab
99
99
  type === 'increase' && (react_1.default.createElement(Input_styles_1.IconsWrapper, null,
100
100
  react_1.default.createElement(Icons_1.Icon, { name: "add", size: size === 'small' ? 16 : 24, onClick: () => increaseValue(value), iconColor: theme.inputDefaultTextColor }),
101
101
  react_1.default.createElement(Icons_1.Icon, { name: "remove", size: size === 'small' ? 16 : 24, onClick: () => decreaseValue(value), iconColor: theme.inputDefaultTextColor }))),
102
- error && react_1.default.createElement(Input_styles_1.InputErrorMsg, null, error))))))));
102
+ (error && errorMsg) && react_1.default.createElement(Input_styles_1.InputErrorMsg, null, errorMsg))))))));
103
103
  };
104
104
  exports.Input = Input;
@@ -71,7 +71,7 @@ export const mainTheme = {
71
71
  disabledText: Theme.colors.gray_1,
72
72
  errorBackgroundColor: Theme.colors.red,
73
73
  errorBackgroundColorHover: lighten(0.3, Theme.colors.red),
74
- errorBackgroundColorHoverLight: lighten(0.5, Theme.colors.red),
74
+ errorBackgroundColorHoverLight: lighten(0.6, Theme.colors.red),
75
75
  //icon
76
76
  iconColor: Theme.colors.text,
77
77
  iconHoverColor: Theme.colors.primary,
@@ -90,7 +90,7 @@ export const mainTheme = {
90
90
  inputDisabledBackground: Theme.colors.gray_4,
91
91
  inputDisabledBorder: Theme.colors.gray_1,
92
92
  inputDisabledTextColor: Theme.colors.gray_1,
93
- inputErrorBackground: lighten(0.5, Theme.colors.red),
93
+ inputErrorBackground: lighten(0.6, Theme.colors.red),
94
94
  inputErrorBorder: Theme.colors.red,
95
95
  inputErrorTextColor: Theme.colors.red,
96
96
  // global
@@ -46,6 +46,7 @@ export const Calendar = ({ value, top, left, size, handleClose, handleSelect, zI
46
46
  });
47
47
  };
48
48
  const setNewDate = (newDate) => {
49
+ console.log('setNewDate', newDate);
49
50
  setSellectedDate(newDate);
50
51
  };
51
52
  const confirmDate = () => {
@@ -9,7 +9,7 @@ import { createPortal } from 'react-dom';
9
9
  import { Calendar } from './Calendar';
10
10
  import { format } from 'date-fns';
11
11
  import { Icon } from '../Icons';
12
- export const DatePicker = ({ label, labelPosition = 'top', value, name, disabled = false, size = 'medium', width, error, theme = mainTheme, readOnly = false, position = 'left', placeholder = 'Select date', handleChange, zIndex }) => {
12
+ export const DatePicker = ({ label, labelPosition = 'top', value, name, disabled = false, size = 'medium', width, error, errorMsg, theme = mainTheme, readOnly = false, position = 'left', placeholder = 'Select date', handleChange, zIndex }) => {
13
13
  const [open, toogleOpen] = useState(false);
14
14
  const sourceRef = useRef(null);
15
15
  const [dropdownStyles, setDropdownStyles] = useState({
@@ -7,7 +7,7 @@ import { Panel, PanelOption } from '../common';
7
7
  import { createPortal } from 'react-dom';
8
8
  import { Icon } from '../Icons';
9
9
  import { mainTheme } from '../../Theme';
10
- export const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = false, error, width, options, value, placeholder = 'Please select', name, handleSelect, position = 'left', zIndex, readOnly = false, theme = mainTheme, }) => {
10
+ export const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = false, error, errorMsg, width, options, value, placeholder = 'Please select', name, handleSelect, position = 'left', zIndex, readOnly = false, theme = mainTheme, }) => {
11
11
  const [open, toogleOpen] = useState(false);
12
12
  const ref = useRef(null);
13
13
  const sourceRef = useRef(null);
@@ -61,5 +61,5 @@ export const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabl
61
61
  open &&
62
62
  createPortal(React.createElement(Panel, { style: dropdownStyles, ref: ref, size: size, fullWidth: true, zIndex: zIndex }, options &&
63
63
  options.map((option) => (React.createElement(PanelOption, { key: option.value, active: option.value === value, onClick: (e) => selectOption(e, option.value) }, option.label)))), document.body),
64
- error && React.createElement(InputErrorMsg, null, error)))));
64
+ (error && errorMsg) && React.createElement(InputErrorMsg, null, errorMsg)))));
65
65
  };
@@ -5,7 +5,7 @@ import { Button } from '../Button';
5
5
  import { HiddenField } from './File.styles';
6
6
  import { Field } from '../Dropdown';
7
7
  import { TextMicro } from '../Typography';
8
- export const File = ({ label, labelPosition = 'top', name, disabled = false, multiple = false, size = 'medium', handleChange, accept = 'application/pdf', width, error, placeholder, fileValue, subLabel }) => {
8
+ export const File = ({ label, labelPosition = 'top', name, disabled = false, multiple = false, size = 'medium', handleChange, accept = 'application/pdf', width, error, errorMsg, placeholder, fileValue, subLabel }) => {
9
9
  const fileRef = useRef(null);
10
10
  const handleSelect = (e) => {
11
11
  handleChange(e);
@@ -22,5 +22,5 @@ export const File = ({ label, labelPosition = 'top', name, disabled = false, mul
22
22
  React.createElement(Button, { size: size, mode: "secondary", onClick: openFileSelector, text: "Wybierz plik" })),
23
23
  subLabel && React.createElement(TextMicro, null, subLabel)),
24
24
  React.createElement(HiddenField, { type: "file", name: name, onChange: (e) => handleSelect(e), ref: fileRef, accept: accept, multiple: multiple }),
25
- error && React.createElement(InputErrorMsg, null, error))));
25
+ (error && errorMsg) && React.createElement(InputErrorMsg, null, errorMsg))));
26
26
  };
@@ -4,7 +4,7 @@ import { Aligment } from '../Aligment';
4
4
  import { InputTextElement, InputLabelElement, InputErrorMsg, InputWrapper, EyeIconWrapper, IconsWrapper, InputReadOnlyElement, Prefix, } from './Input.styles';
5
5
  import { Icon } from '../Icons';
6
6
  import { mainTheme } from '../../Theme';
7
- export const Input = ({ label, labelPosition = 'top', value, type = 'text', name, disabled = false, size = 'medium', handleChange, handleSubmit, width, error, placeholder, min, max, step = 0.1, autoFocus, theme = mainTheme, readOnly = false, prefix, }) => {
7
+ export const Input = ({ label, labelPosition = 'top', value, type = 'text', name, disabled = false, size = 'medium', handleChange, handleSubmit, width, error = false, errorMsg, placeholder, min, max, step = 0.1, autoFocus, theme = mainTheme, readOnly = false, prefix, }) => {
8
8
  const calculateNumberValue = (numberValue) => {
9
9
  return isNaN(parseFloat(numberValue))
10
10
  ? numberValue
@@ -73,5 +73,5 @@ export const Input = ({ label, labelPosition = 'top', value, type = 'text', name
73
73
  type === 'increase' && (React.createElement(IconsWrapper, null,
74
74
  React.createElement(Icon, { name: "add", size: size === 'small' ? 16 : 24, onClick: () => increaseValue(value), iconColor: theme.inputDefaultTextColor }),
75
75
  React.createElement(Icon, { name: "remove", size: size === 'small' ? 16 : 24, onClick: () => decreaseValue(value), iconColor: theme.inputDefaultTextColor }))),
76
- error && React.createElement(InputErrorMsg, null, error))))))));
76
+ (error && errorMsg) && React.createElement(InputErrorMsg, null, errorMsg))))))));
77
77
  };
@@ -2,7 +2,7 @@ import { InputSize } from "../../types";
2
2
  export interface IFieldProps {
3
3
  inputSize: InputSize;
4
4
  disabled: boolean;
5
- error?: string;
5
+ error?: boolean;
6
6
  width?: string;
7
7
  active: boolean;
8
8
  }
@@ -13,7 +13,7 @@ export interface FormDataProps {
13
13
  position?: string;
14
14
  zIndex?: number;
15
15
  isDisabled?: boolean;
16
- error?: string;
16
+ error?: boolean;
17
17
  subLabel?: string;
18
18
  }
19
19
  interface FormDataParentProps {
@@ -3,7 +3,7 @@ import { InputSize, InputType } from '../../types';
3
3
  interface IInputTextElementProps extends InputHTMLAttributes<HTMLInputElement> {
4
4
  inputSize: InputSize;
5
5
  disabled: boolean;
6
- error?: string;
6
+ error?: boolean;
7
7
  width?: string;
8
8
  type: InputType;
9
9
  theme: any;
@@ -11,7 +11,8 @@ export interface IFormElement {
11
11
  size?: InputSize;
12
12
  width?: string;
13
13
  disabled?: boolean;
14
- error?: string;
14
+ error?: boolean;
15
+ errorMsg?: string;
15
16
  placeholder?: string;
16
17
  readOnly?: boolean;
17
18
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "venice-ui",
3
- "version": "2.0.35",
3
+ "version": "2.0.36",
4
4
  "description": "Component library",
5
5
  "main": "index.js",
6
6
  "module": "./dist/esm/index.js",