@madie/madie-design-system 1.2.81 → 1.2.83

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.
@@ -5,6 +5,8 @@ import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
5
5
  import InputLabel from "../InputLabel";
6
6
  import { kebabCase } from "lodash";
7
7
  import PropTypes from "prop-types";
8
+ import dayjs from "dayjs";
9
+ import { ReadOnlyTextField } from "../ReadOnlyTextField";
8
10
 
9
11
  const timeFieldStyle = {
10
12
  width: "170px",
@@ -39,14 +41,28 @@ const timeFieldStyle = {
39
41
  };
40
42
 
41
43
  const TimeField = ({
44
+ id,
42
45
  label,
43
46
  value,
44
47
  handleTimeChange,
48
+ readOnly,
45
49
  disabled,
46
50
  required,
47
51
  error,
48
52
  ...rest
49
53
  }) => {
54
+ if (readOnly) {
55
+ return (
56
+ <ReadOnlyTextField
57
+ required={required}
58
+ label={label}
59
+ id={id}
60
+ size="small"
61
+ {...rest}
62
+ value={value ? dayjs.utc(value).format("HH:mm:ss a") : "-"}
63
+ />
64
+ );
65
+ }
50
66
  return (
51
67
  <LocalizationProvider dateAdapter={AdapterDayjs}>
52
68
  <InputLabel
@@ -90,11 +106,13 @@ const TimeField = ({
90
106
  };
91
107
 
92
108
  TimeField.propTypes = {
109
+ id: PropTypes.string,
93
110
  label: PropTypes.string.isRequired,
94
111
  value: PropTypes.object,
95
112
  handleTimeChange: PropTypes.func.isRequired,
96
113
  disabled: PropTypes.bool,
97
114
  required: PropTypes.bool,
115
+ readOnly: PropTypes.bool,
98
116
  error: PropTypes.string,
99
117
  };
100
118