venice-ui 2.0.21 → 2.0.23

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.
Files changed (5) hide show
  1. package/dist/cjs/components/Dropdown/Dropdown.js +3 -3
  2. package/dist/cjs/components/Form/Form.js +1 -1
  3. package/dist/esm/components/Dropdown/Dropdown.js +4 -4
  4. package/dist/esm/components/Form/Form.js +1 -1
  5. package/package.json +1 -1
package/dist/cjs/components/Dropdown/Dropdown.js CHANGED
@@ -31,7 +31,7 @@ const DropdownElements_1 = require("./DropdownElements");
31
31
  const Input_1 = require("../Input");
32
32
  const common_1 = require("../common");
33
33
  const react_dom_1 = require("react-dom");
34
- const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = false, error, width, options, value, placeholder = 'Please select', name, handleSelect, position = 'left', zIndex, }) => {
34
+ const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = false, error, width, options, value, placeholder = 'Please select', name, handleSelect, position = 'left', zIndex, readOnly = false, }) => {
35
35
  const [open, toogleOpen] = (0, react_1.useState)(false);
36
36
  const ref = (0, react_1.useRef)(null);
37
37
  const sourceRef = (0, react_1.useRef)(null);
@@ -78,11 +78,11 @@ const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = fa
78
78
  }, [open]);
79
79
  return (react_1.default.createElement(Aligment_1.Aligment, { align: labelPosition === 'top' ? 'flex-start' : 'center', direction: labelPosition === 'top' ? 'column' : 'row', wrap: 'nowrap', width: width },
80
80
  label && (react_1.default.createElement(Input_1.InputLabelElement, { size: size, labelPosition: labelPosition }, label)),
81
- react_1.default.createElement(Dropdown_styles_1.DropdownElement, { onClick: () => handleOpen(), ref: sourceRef },
81
+ readOnly ? (react_1.default.createElement(Input_1.InputReadOnlyElement, { inputSize: size }, value)) : (react_1.default.createElement(Dropdown_styles_1.DropdownElement, { onClick: () => handleOpen(), ref: sourceRef },
82
82
  react_1.default.createElement(DropdownElements_1.Field, { inputSize: size, disabled: disabled, width: width, active: open, error: error }, value ? getLabelForValue(value) : placeholder),
83
83
  open &&
84
84
  (0, react_dom_1.createPortal)(react_1.default.createElement(common_1.Panel, { style: dropdownStyles, ref: ref, size: size, fullWidth: true, zIndex: zIndex }, options &&
85
85
  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),
86
- error && react_1.default.createElement(Input_1.InputErrorMsg, null, error))));
86
+ error && react_1.default.createElement(Input_1.InputErrorMsg, null, error)))));
87
87
  };
88
88
  exports.Dropdown = Dropdown;
package/dist/cjs/components/Form/Form.js CHANGED
@@ -45,7 +45,7 @@ const Form = ({ formData, size = 'medium', read }) => {
45
45
  case 'increase':
46
46
  return (react_1.default.createElement(Input_1.Input, { type: "increase", label: item.label, value: item.value, name: item.name, size: size, handleChange: onIntChangeHandler, min: item.min, max: item.max, step: item.step, readOnly: read, autoFocus: item.autofocus, handleSubmit: item.submit }));
47
47
  case 'select':
48
- return (react_1.default.createElement(Dropdown_1.Dropdown, { options: item.options, handleSelect: onChangeHandler, name: item.name, value: item.value, size: size, label: item.label, position: item.position, zIndex: item.zIndex }));
48
+ return (react_1.default.createElement(Dropdown_1.Dropdown, { options: item.options, handleSelect: onChangeHandler, name: item.name, value: item.value, size: size, label: item.label, position: item.position, zIndex: item.zIndex, readOnly: read }));
49
49
  case 'file':
50
50
  return (react_1.default.createElement(File_1.File, { label: item.label, fileValue: item.value, name: item.name, size: size, handleChange: onFileHandler, readOnly: read }));
51
51
  }
package/dist/esm/components/Dropdown/Dropdown.js CHANGED
@@ -2,10 +2,10 @@ import React, { useState, useEffect, useRef } from 'react';
2
2
  import { Aligment } from '../Aligment';
3
3
  import { DropdownElement } from './Dropdown.styles';
4
4
  import { Field } from './DropdownElements';
5
- import { InputErrorMsg, InputLabelElement } from '../Input';
5
+ import { InputErrorMsg, InputLabelElement, InputReadOnlyElement, } from '../Input';
6
6
  import { Panel, PanelOption } from '../common';
7
7
  import { createPortal } from 'react-dom';
8
- export const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = false, error, width, options, value, placeholder = 'Please select', name, handleSelect, position = 'left', zIndex, }) => {
8
+ export const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabled = false, error, width, options, value, placeholder = 'Please select', name, handleSelect, position = 'left', zIndex, readOnly = false, }) => {
9
9
  const [open, toogleOpen] = useState(false);
10
10
  const ref = useRef(null);
11
11
  const sourceRef = useRef(null);
@@ -52,10 +52,10 @@ export const Dropdown = ({ size = 'medium', label, labelPosition = 'top', disabl
52
52
  }, [open]);
53
53
  return (React.createElement(Aligment, { align: labelPosition === 'top' ? 'flex-start' : 'center', direction: labelPosition === 'top' ? 'column' : 'row', wrap: 'nowrap', width: width },
54
54
  label && (React.createElement(InputLabelElement, { size: size, labelPosition: labelPosition }, label)),
55
- React.createElement(DropdownElement, { onClick: () => handleOpen(), ref: sourceRef },
55
+ readOnly ? (React.createElement(InputReadOnlyElement, { inputSize: size }, value)) : (React.createElement(DropdownElement, { onClick: () => handleOpen(), ref: sourceRef },
56
56
  React.createElement(Field, { inputSize: size, disabled: disabled, width: width, active: open, error: error }, value ? getLabelForValue(value) : placeholder),
57
57
  open &&
58
58
  createPortal(React.createElement(Panel, { style: dropdownStyles, ref: ref, size: size, fullWidth: true, zIndex: zIndex }, options &&
59
59
  options.map((option) => (React.createElement(PanelOption, { key: option.value, active: option.value === value, onClick: (e) => selectOption(e, option.value) }, option.label)))), document.body),
60
- error && React.createElement(InputErrorMsg, null, error))));
60
+ error && React.createElement(InputErrorMsg, null, error)))));
61
61
  };
package/dist/esm/components/Form/Form.js CHANGED
@@ -39,7 +39,7 @@ export const Form = ({ formData, size = 'medium', read }) => {
39
39
  case 'increase':
40
40
  return (React.createElement(Input, { type: "increase", label: item.label, value: item.value, name: item.name, size: size, handleChange: onIntChangeHandler, min: item.min, max: item.max, step: item.step, readOnly: read, autoFocus: item.autofocus, handleSubmit: item.submit }));
41
41
  case 'select':
42
- return (React.createElement(Dropdown, { options: item.options, handleSelect: onChangeHandler, name: item.name, value: item.value, size: size, label: item.label, position: item.position, zIndex: item.zIndex }));
42
+ return (React.createElement(Dropdown, { options: item.options, handleSelect: onChangeHandler, name: item.name, value: item.value, size: size, label: item.label, position: item.position, zIndex: item.zIndex, readOnly: read }));
43
43
  case 'file':
44
44
  return (React.createElement(File, { label: item.label, fileValue: item.value, name: item.name, size: size, handleChange: onFileHandler, readOnly: read }));
45
45
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "venice-ui",
3
- "version": "2.0.21",
3
+ "version": "2.0.23",
4
4
  "description": "Component library",
5
5
  "main": "index.js",
6
6
  "module": "./dist/esm/index.js",