@monolith-forensics/monolith-ui 1.2.91 → 1.2.92

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 (122) hide show
  1. package/dist/Button/Button.d.ts +1 -0
  2. package/dist/Button/Button.js +3 -2
  3. package/dist/Calendar/CalendarStyles.d.ts +5 -15
  4. package/dist/Calendar/calendarHelpers.d.ts +1 -1
  5. package/dist/CheckBox/CheckBox.js +6 -4
  6. package/dist/DateInput/DateInput.d.ts +5 -3
  7. package/dist/DateInput/DateInput.js +41 -25
  8. package/dist/DropDownMenu/DropDownMenu.d.ts +2 -45
  9. package/dist/DropDownMenu/DropDownMenu.js +9 -315
  10. package/dist/DropDownMenu/components/Menu.d.ts +2 -0
  11. package/dist/DropDownMenu/components/Menu.js +11 -0
  12. package/dist/DropDownMenu/components/MenuComponent.d.ts +2 -0
  13. package/dist/DropDownMenu/components/MenuComponent.js +117 -0
  14. package/dist/DropDownMenu/components/MenuContext.d.ts +7 -0
  15. package/dist/DropDownMenu/components/MenuContext.js +8 -0
  16. package/dist/DropDownMenu/components/MenuItem.d.ts +7 -0
  17. package/dist/DropDownMenu/components/MenuItem.js +99 -0
  18. package/dist/DropDownMenu/components/MenuItemList.d.ts +18 -0
  19. package/dist/DropDownMenu/components/MenuItemList.js +92 -0
  20. package/dist/DropDownMenu/components/SearchInput.d.ts +1 -0
  21. package/dist/DropDownMenu/components/SearchInput.js +4 -0
  22. package/dist/DropDownMenu/components/StyledContent.d.ts +2 -0
  23. package/dist/DropDownMenu/components/StyledContent.js +42 -0
  24. package/dist/DropDownMenu/components/StyledFloatContainer.d.ts +1 -0
  25. package/dist/DropDownMenu/components/StyledFloatContainer.js +5 -0
  26. package/dist/DropDownMenu/components/StyledInnerItemContainer.d.ts +1 -0
  27. package/dist/DropDownMenu/components/StyledInnerItemContainer.js +9 -0
  28. package/dist/DropDownMenu/components/index.d.ts +9 -0
  29. package/dist/DropDownMenu/components/index.js +9 -0
  30. package/dist/DropDownMenu/index.d.ts +1 -1
  31. package/dist/DropDownMenu/index.js +1 -0
  32. package/dist/DropDownMenu/types.d.ts +52 -0
  33. package/dist/FieldLabel/FieldLabel.d.ts +1 -1
  34. package/dist/FileViewer/FileViewer.d.ts +13 -0
  35. package/dist/FileViewer/FileViewer.js +180 -0
  36. package/dist/FileViewer/index.d.ts +1 -0
  37. package/dist/FileViewer/index.js +1 -0
  38. package/dist/FileViewer/viewers/CodeViewer.d.ts +6 -0
  39. package/dist/FileViewer/viewers/CodeViewer.js +106 -0
  40. package/dist/FileViewer/viewers/ImageViewer.d.ts +6 -0
  41. package/dist/FileViewer/viewers/ImageViewer.js +58 -0
  42. package/dist/FileViewer/viewers/OfficeViewer.d.ts +5 -0
  43. package/dist/FileViewer/viewers/OfficeViewer.js +70 -0
  44. package/dist/FileViewer/viewers/PdfViewer.d.ts +8 -0
  45. package/dist/FileViewer/viewers/PdfViewer.js +63 -0
  46. package/dist/FileViewer/viewers/PlainTextViewer.d.ts +4 -0
  47. package/dist/FileViewer/viewers/PlainTextViewer.js +62 -0
  48. package/dist/FileViewer/viewers/VideoViewer.d.ts +6 -0
  49. package/dist/FileViewer/viewers/VideoViewer.js +30 -0
  50. package/dist/FileViewer/viewers/index.d.ts +6 -0
  51. package/dist/FileViewer/viewers/index.js +6 -0
  52. package/dist/FormSection/FormSection.d.ts +10 -2
  53. package/dist/FormSection/FormSection.js +43 -8
  54. package/dist/IconButton/IconButton.d.ts +1 -3
  55. package/dist/Input/Input.js +5 -0
  56. package/dist/MonolithUIProvider/GlobalStyle.d.ts +1 -1
  57. package/dist/MonolithUIProvider/GlobalStyle.js +1 -1
  58. package/dist/MonolithUIProvider/MonolithUIProvider.d.ts +2 -2
  59. package/dist/MonolithUIProvider/MonolithUIProvider.js +8 -3
  60. package/dist/MonolithUIProvider/index.d.ts +2 -2
  61. package/dist/MonolithUIProvider/index.js +2 -2
  62. package/dist/MonolithUIProvider/useMonolithUITheme.d.ts +1 -2
  63. package/dist/MonolithUIProvider/useMonolithUITheme.js +1 -2
  64. package/dist/Pill/Pill.d.ts +2 -1
  65. package/dist/Pill/Pill.js +2 -2
  66. package/dist/QueryFilter/DefaultOperators.d.ts +2 -3
  67. package/dist/QueryFilter/DefaultOperators.js +2 -3
  68. package/dist/QueryFilter/QueryFilter.d.ts +2 -3
  69. package/dist/QueryFilter/QueryFilter.js +126 -49
  70. package/dist/QueryFilter/index.d.ts +4 -2
  71. package/dist/QueryFilter/index.js +4 -2
  72. package/dist/QueryFilter/types.d.ts +12 -8
  73. package/dist/QueryFilter/useFilterHelper.d.ts +20 -0
  74. package/dist/QueryFilter/useFilterHelper.js +61 -0
  75. package/dist/QueryFilter/useQueryFilter.d.ts +1 -2
  76. package/dist/QueryFilter/useQueryFilter.js +5 -2
  77. package/dist/RichTextEditor/Components/BubbleMenu.d.ts +3 -4
  78. package/dist/RichTextEditor/Components/BubbleMenu.js +29 -26
  79. package/dist/RichTextEditor/Components/ColorPicker.d.ts +4 -0
  80. package/dist/RichTextEditor/Components/ColorPicker.js +37 -0
  81. package/dist/RichTextEditor/Components/index.d.ts +1 -0
  82. package/dist/RichTextEditor/Components/index.js +1 -0
  83. package/dist/RichTextEditor/RichTextEditor.d.ts +2 -3
  84. package/dist/RichTextEditor/RichTextEditor.js +83 -86
  85. package/dist/RichTextEditor/Toolbar/ControlsGroup.d.ts +1 -3
  86. package/dist/RichTextEditor/Toolbar/Toolbar.d.ts +1 -1
  87. package/dist/RichTextEditor/Toolbar/Toolbar.js +10 -14
  88. package/dist/SelectBox/SelectBox.d.ts +1 -1
  89. package/dist/SelectBox/SelectBox.js +133 -92
  90. package/dist/SelectBox/types.d.ts +8 -5
  91. package/dist/Switch/Switch.js +4 -4
  92. package/dist/Table/ActionButton.d.ts +1 -3
  93. package/dist/Table/ActionCell.d.ts +1 -3
  94. package/dist/Table/SelectionCell.d.ts +1 -3
  95. package/dist/Table/StaticRows.d.ts +2 -2
  96. package/dist/Table/Table.d.ts +1 -2
  97. package/dist/Table/Table.js +9 -13
  98. package/dist/Table/TableComponents.d.ts +2 -6
  99. package/dist/Table/TableComponents.js +0 -5
  100. package/dist/Table/TableHeader.js +8 -2
  101. package/dist/Table/TableMenu/TableMenu.js +11 -9
  102. package/dist/Table/TableProvider.js +36 -30
  103. package/dist/Table/TableRow.js +5 -2
  104. package/dist/Table/VirtualIzedRows.d.ts +2 -2
  105. package/dist/Table/VirtualIzedRows.js +12 -10
  106. package/dist/Table/index.d.ts +1 -2
  107. package/dist/Table/index.js +1 -2
  108. package/dist/Table/types.d.ts +23 -3
  109. package/dist/TagBox/TagBox.d.ts +1 -1
  110. package/dist/TagBox/TagBox.js +180 -92
  111. package/dist/TagBox/TagBoxStyles.d.ts +1 -3
  112. package/dist/TagBox/types.d.ts +4 -2
  113. package/dist/TextArea/TextArea.d.ts +1 -3
  114. package/dist/Tooltip/Tooltip.d.ts +1 -1
  115. package/dist/index.d.ts +4 -4
  116. package/dist/index.js +4 -4
  117. package/dist/theme/getTheme.d.ts +1 -1
  118. package/package.json +11 -5
  119. package/dist/RichTextEditor/Components/DefaultColorIcon.d.ts +0 -4
  120. package/dist/RichTextEditor/Components/DefaultColorIcon.js +0 -7
  121. package/dist/Table/Column.d.ts +0 -3
  122. package/dist/Table/Column.js +0 -5
@@ -14,6 +14,7 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
14
14
  color?: string;
15
15
  disabled?: boolean;
16
16
  selected?: boolean;
17
+ justify?: "start" | "center" | "end";
17
18
  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
18
19
  }
19
20
  declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
@@ -188,6 +188,7 @@ const StyledButton = styled.button `
188
188
  .inner-span {
189
189
  display: flex;
190
190
  align-items: center;
191
+ justify-content: center;
191
192
  }
192
193
 
193
194
  .button-label {
@@ -324,8 +325,8 @@ const StyledLoader = styled.span `
324
325
  }
325
326
  `;
326
327
  const Button = forwardRef((props, ref) => {
327
- const { children, loading = false, leftSection = null, rightSection = null, href = null, download = null } = props, other = __rest(props, ["children", "loading", "leftSection", "rightSection", "href", "download"]);
328
- const buttonContent = (_jsx("span", { className: "inner-span", style: { height: "100%", width: "100%" }, children: loading ? (_jsx(StyledLoader, { children: _jsx(Loader2Icon, {}) })) : (_jsxs(_Fragment, { children: [leftSection && _jsx("span", { "data-position": "left", children: leftSection }), _jsx("span", { className: "button-label", children: children }), rightSection && _jsx("span", { "data-position": "right", children: rightSection })] })) }));
328
+ const { children, loading = false, leftSection = null, rightSection = null, href = null, download = null, justify = "center" } = props, other = __rest(props, ["children", "loading", "leftSection", "rightSection", "href", "download", "justify"]);
329
+ const buttonContent = (_jsx("div", { className: "inner-span", style: { height: "100%", width: "100%", justifyContent: justify }, children: loading ? (_jsx(StyledLoader, { children: _jsx(Loader2Icon, {}) })) : (_jsxs(_Fragment, { children: [leftSection && _jsx("div", { "data-position": "left", children: leftSection }), _jsx("div", { className: "button-label", children: children }), rightSection && _jsx("div", { "data-position": "right", children: rightSection })] })) }));
329
330
  return (_jsx(StyledButton, Object.assign({ ref: ref }, other, { children: href ? (_jsx(StyledAnchor, { href: href, download: download, children: buttonContent })) : (buttonContent) })));
330
331
  });
331
332
  export default Button;
@@ -11,26 +11,16 @@ interface CalendarCellProps {
11
11
  title?: string;
12
12
  }
13
13
  export declare const CalendarCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, CalendarCellProps>> & string;
14
- export declare const CalendarDay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof CalendarCellProps> & CalendarCellProps, "ref"> & {
15
- ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
16
- }, CalendarCellProps>> & string;
17
- export declare const CalendarDate: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof CalendarCellProps> & CalendarCellProps, "ref"> & {
18
- ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
19
- }, CalendarCellProps>> & string;
20
- export declare const HighlightedCalendarDate: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof CalendarCellProps> & CalendarCellProps, "ref"> & {
21
- ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
22
- }, keyof CalendarCellProps> & CalendarCellProps, CalendarCellProps>> & string;
23
- export declare const TodayCalendarDate: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof CalendarCellProps> & CalendarCellProps, "ref"> & {
24
- ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
25
- }, keyof CalendarCellProps> & CalendarCellProps, keyof CalendarCellProps> & CalendarCellProps, CalendarCellProps>> & string;
14
+ export declare const CalendarDay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof CalendarCellProps> & CalendarCellProps, CalendarCellProps>> & string;
15
+ export declare const CalendarDate: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof CalendarCellProps> & CalendarCellProps, CalendarCellProps>> & string;
16
+ export declare const HighlightedCalendarDate: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof CalendarCellProps> & CalendarCellProps, keyof CalendarCellProps> & CalendarCellProps, CalendarCellProps>> & string;
17
+ export declare const TodayCalendarDate: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof CalendarCellProps> & CalendarCellProps, keyof CalendarCellProps> & CalendarCellProps, keyof CalendarCellProps> & CalendarCellProps, CalendarCellProps>> & string;
26
18
  export declare const TimeContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
27
19
  export declare const TimePickerContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
28
20
  export declare const TimeHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
29
21
  export declare const TimeHourSelect: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
30
22
  export declare const TimeMinuteSelect: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
31
23
  export declare const TimeItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
32
- export declare const TimeItemActive: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
33
- ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
34
- }, never>> & string;
24
+ export declare const TimeItemActive: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, never>> & string;
35
25
  export declare const NoValueButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
36
26
  export {};
@@ -35,7 +35,7 @@ export declare const CALENDAR_MONTHS: {
35
35
  };
36
36
  export declare const CALENDAR_WEEKS = 6;
37
37
  export declare const zeroPad: (value: number, length: number) => string;
38
- export declare const getMonthDays: (month?: number, year?: number) => 29 | 28 | 30 | 31;
38
+ export declare const getMonthDays: (month?: number, year?: number) => 28 | 29 | 30 | 31;
39
39
  export declare const getMonthFirstDay: (month?: number, year?: number) => number;
40
40
  export declare const isDate: (date: Date) => boolean;
41
41
  export declare const isSameMonth: (date: Date, basedate?: Date) => boolean;
@@ -24,16 +24,18 @@ const CheckBox = styled(({ className, defaultValue = false, value, partialCheck
24
24
  color: ${(props) => props.theme.palette.primary.main};
25
25
  font-size: ${({ size }) => {
26
26
  switch (size) {
27
- case "xs":
27
+ case "xxs":
28
28
  return "12px";
29
+ case "xs":
30
+ return "14px";
29
31
  case "sm":
30
32
  return "16px";
31
33
  case "md":
32
- return "24px";
34
+ return "18px";
33
35
  case "lg":
34
- return "32px";
36
+ return "20px";
35
37
  default:
36
- return "16px";
38
+ return "14px";
37
39
  }
38
40
  }};
39
41
  }
@@ -5,6 +5,7 @@ interface DateInputProps {
5
5
  className?: string;
6
6
  style?: React.CSSProperties;
7
7
  defaultValue?: string | null | undefined;
8
+ value?: string | null | undefined;
8
9
  format?: FormatOptions;
9
10
  label?: string;
10
11
  description?: string;
@@ -21,10 +22,11 @@ interface DateInputProps {
21
22
  enableCalendar?: boolean;
22
23
  utc?: boolean;
23
24
  closeOnSelect?: boolean;
25
+ disabled?: boolean;
24
26
  }
25
- type DateFormatOptions = "MM/DD/YYYY" | "DD/MM/YYYY" | "YYYY-MM-DD";
26
- type TimeFormatOptions = "HH:mm:ss" | "h:mm:ss A" | "HH:mm:ss.SSS";
27
- type FormatOptions = DateFormatOptions | `${DateFormatOptions} ${TimeFormatOptions}`;
27
+ export type DateFormatOptions = "MM/DD/YYYY" | "DD/MM/YYYY" | "YYYY-MM-DD";
28
+ export type TimeFormatOptions = "HH:mm:ss" | "h:mm:ss A" | "HH:mm:ss.SSS";
29
+ export type FormatOptions = DateFormatOptions | `${DateFormatOptions} ${TimeFormatOptions}`;
28
30
  export type Segment = {
29
31
  value: string;
30
32
  text: string;
@@ -15,6 +15,11 @@ import styled from "styled-components";
15
15
  import { FieldLabel, Calendar } from "..";
16
16
  import { StyledContent, StyledFloatContainer, ArrowButton, ClearButton, } from "../core";
17
17
  import parseTimestamp from "../Utilities/parseTimestamp";
18
+ const StyledContainer = styled.div.attrs({
19
+ className: "mfui-DateInput",
20
+ }) `
21
+ width: 100%;
22
+ `;
18
23
  const StyledInputContainer = styled.div `
19
24
  position: relative;
20
25
 
@@ -136,6 +141,15 @@ const StyledInputContainer = styled.div `
136
141
  &:focus {
137
142
  border: 1px solid ${(props) => props.theme.palette.primary.main};
138
143
  }
144
+
145
+ &[data-disabled="true"] {
146
+ opacity: 0.5;
147
+ pointer-events: none;
148
+
149
+ > * {
150
+ pointer-events: none;
151
+ }
152
+ }
139
153
  `;
140
154
  const InputSegment = styled.div `
141
155
  user-select: none;
@@ -178,8 +192,10 @@ const InputSegment = styled.div `
178
192
  : "10px"};
179
193
  }
180
194
  `;
181
- const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "YYYY-MM-DD HH:mm:ss", label, description, arrow = true, size = "sm", variant = "outlined", clearable = false, required = false, onChange = () => { }, min, max, error, enableCalendar = false, utc = false, closeOnSelect = true, }, _ref) => {
182
- const [value, setValue] = useState(defaultValue);
195
+ const DateInput = forwardRef(({ className, style = {}, defaultValue, value, format = "YYYY-MM-DD HH:mm:ss", label, description, arrow = true, size = "sm", variant = "outlined", clearable = false, required = false, onChange = () => { }, min, max, error, enableCalendar = false, utc = false, closeOnSelect = true, disabled = false, }, _ref) => {
196
+ const isControlled = value !== undefined;
197
+ const [unControlledValue, setUncontrolledValue] = useState(defaultValue);
198
+ const _value = isControlled ? value : unControlledValue;
183
199
  const [selectedSegment, setSelectedSegment] = useState();
184
200
  const [isOpen, setIsOpen] = useState(false);
185
201
  // Check if format is date only and does not include time
@@ -197,7 +213,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
197
213
  });
198
214
  const dismiss = useDismiss(context);
199
215
  const { getReferenceProps } = useInteractions([dismiss]);
200
- const segments = useMemo(() => parseTimestamp(moment(value).toISOString(), format, utc), [value, format, utc]);
216
+ const segments = useMemo(() => parseTimestamp(moment(_value).toISOString(), format, utc), [_value, format, utc]);
201
217
  const checkValidRange = (value) => {
202
218
  if (!value)
203
219
  return false;
@@ -210,7 +226,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
210
226
  const handleClear = (e) => {
211
227
  e.preventDefault();
212
228
  e.stopPropagation();
213
- setValue(null);
229
+ setUncontrolledValue(null);
214
230
  onChange === null || onChange === void 0 ? void 0 : onChange(null);
215
231
  setIsOpen(false);
216
232
  };
@@ -285,7 +301,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
285
301
  // Up Arrow
286
302
  if (e.key === "ArrowUp") {
287
303
  e.preventDefault();
288
- setValue((prev) => {
304
+ setUncontrolledValue((prev) => {
289
305
  if (selectedSegment.type === "separator")
290
306
  return prev;
291
307
  let newValue = prev
@@ -303,7 +319,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
303
319
  // Down Arrow
304
320
  if (e.key === "ArrowDown") {
305
321
  e.preventDefault();
306
- setValue((prev) => {
322
+ setUncontrolledValue((prev) => {
307
323
  if (selectedSegment.type === "separator")
308
324
  return prev;
309
325
  let newValue = prev
@@ -332,7 +348,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
332
348
  Array.from(tempValue).every((c) => c === "0")) {
333
349
  tempValue = "01";
334
350
  }
335
- setValue((prev) => {
351
+ setUncontrolledValue((prev) => {
336
352
  if (!(selectedSegment === null || selectedSegment === void 0 ? void 0 : selectedSegment.momentType))
337
353
  return prev;
338
354
  const momentValue = utc ? moment.utc(prev) : moment(prev);
@@ -358,7 +374,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
358
374
  if (!selectedSegment) {
359
375
  return;
360
376
  }
361
- setValue((prev) => {
377
+ setUncontrolledValue((prev) => {
362
378
  let newValue = prev;
363
379
  if (selectedSegment.type === "separator") {
364
380
  newValue = prev; // skip all logic if separator
@@ -391,7 +407,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
391
407
  const parsedTimestamp = moment
392
408
  .unix(parseInt(pastedText, 10))
393
409
  .toISOString();
394
- setValue(parsedTimestamp);
410
+ setUncontrolledValue(parsedTimestamp);
395
411
  return;
396
412
  }
397
413
  // check for unix timestamp in seconds with fractional seconds
@@ -399,7 +415,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
399
415
  const parsedTimestamp = moment
400
416
  .unix(parseFloat(pastedText))
401
417
  .toISOString();
402
- setValue(parsedTimestamp);
418
+ setUncontrolledValue(parsedTimestamp);
403
419
  return;
404
420
  }
405
421
  // check for unix timestamp in milliseconds
@@ -407,7 +423,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
407
423
  const parsedTimestamp = moment
408
424
  .unix(parseInt(pastedText, 10) / 1000)
409
425
  .toISOString();
410
- setValue(parsedTimestamp);
426
+ setUncontrolledValue(parsedTimestamp);
411
427
  return;
412
428
  }
413
429
  // check for windows ldap or filetime timestamp
@@ -415,7 +431,7 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
415
431
  const parsedTimestamp = moment
416
432
  .unix((parseInt(pastedText, 10) - 116444736000000000) / 10000000)
417
433
  .toISOString();
418
- setValue(parsedTimestamp);
434
+ setUncontrolledValue(parsedTimestamp);
419
435
  return;
420
436
  }
421
437
  // check for YMD ldap timestamp in format YYYYMMDDHHMMSSZ
@@ -423,14 +439,14 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
423
439
  const parsedTimestamp = moment
424
440
  .utc(pastedText, "YYYYMMDDHHmmssZ")
425
441
  .toISOString();
426
- setValue(parsedTimestamp);
442
+ setUncontrolledValue(parsedTimestamp);
427
443
  return;
428
444
  }
429
445
  // check if pasted text is any other valid timestamp
430
446
  if (!moment(pastedText).isValid())
431
447
  return;
432
448
  const parsedTimestamp = moment.utc(pastedText).toISOString();
433
- setValue(parsedTimestamp);
449
+ setUncontrolledValue(parsedTimestamp);
434
450
  });
435
451
  // Close on outside click
436
452
  useEffect(() => {
@@ -460,27 +476,27 @@ const DateInput = forwardRef(({ className, style = {}, defaultValue, format = "Y
460
476
  document.removeEventListener("wheel", handleWheelEvent);
461
477
  };
462
478
  }, [selectedSegment]);
463
- return (_jsxs("div", { className: "mfui-DateInput", children: [label && (_jsx(FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label })), _jsxs(StyledInputContainer, { ref: (ref) => {
464
- if (typeof _ref === "function") {
465
- _ref(ref);
466
- }
467
- mainRef.current = ref;
468
- refs.setReference(ref);
469
- }, className: className, onClick: handleContainerClick, onMouseDown: handleMouseDown, onKeyDown: handleKeyDown, onFocus: (e) => {
479
+ return (_jsxs(StyledContainer, { ref: (ref) => {
480
+ if (typeof _ref === "function") {
481
+ _ref(ref);
482
+ }
483
+ mainRef.current = ref;
484
+ refs.setReference(ref);
485
+ }, className: className, children: [label && (_jsx(FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label })), _jsxs(StyledInputContainer, { className: "input-container", onClick: handleContainerClick, onMouseDown: handleMouseDown, onKeyDown: handleKeyDown, onFocus: (e) => {
470
486
  e.preventDefault();
471
487
  setSelectedSegment(segments[0]);
472
488
  }, onBlur: () => {
473
489
  setSelectedSegment(null);
474
- }, "data-empty": !value, role: "textbox", size: size, variant: variant, "data-button-right": arrow || clearable, style: style, children: [segments.map((segment, i) => {
490
+ }, "data-empty": !_value, "data-disabled": disabled, role: "textbox", size: size, variant: variant, "data-button-right": arrow || clearable, style: style, children: [segments.map((segment, i) => {
475
491
  if (segment.type === "separator") {
476
492
  return (_jsx("div", { className: "separator", tabIndex: -1, onClick: (e) => {
477
493
  e.preventDefault();
478
494
  e.stopPropagation();
479
495
  }, onFocus: (e) => e.preventDefault(), onPointerDown: (e) => e.preventDefault(), "data-type": "separator", "data-identifier": segment.type, "data-has-space": segment.text.includes(" "), "data-placeholder": segment.placeholder, "data-value": segment.value, children: segment.text }, i));
480
496
  }
481
- return (_jsx(InputSegment, { className: "input", tabIndex: i === 0 ? 0 : -1, onClick: (e) => handleSegmentClick(e, segment), "data-type": "input", size: size, "data-identifier": segment.type, "data-has-space": segment.text.includes(" "), "data-placeholder": segment.placeholder, "data-value": segment.value, "data-selected": (selectedSegment === null || selectedSegment === void 0 ? void 0 : selectedSegment.index) === segment.index, children: value ? segment.text : segment.placeholder }, i));
482
- }), utc && _jsx("div", { style: { marginLeft: 5 }, children: "UTC" }), clearable && value ? (_jsx(ClearButton, { onClick: handleClear })) : arrow ? (_jsx(ArrowButton, {})) : null] }), enableCalendar && isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(StyledFloatContainer, Object.assign({ ref: refs.setFloating, style: floatingStyles }, getReferenceProps(), { children: _jsx(StyledContent, { maxDropdownHeight: "fit-content", children: _jsx("div", { children: _jsx(Calendar, { value: value ? moment(value).toDate() : undefined, clearable: false, min: min, max: max, onChange: (date) => {
483
- setValue((prev) => {
497
+ return (_jsx(InputSegment, { className: "input", tabIndex: i === 0 ? 0 : -1, onClick: (e) => handleSegmentClick(e, segment), "data-type": "input", size: size, "data-identifier": segment.type, "data-has-space": segment.text.includes(" "), "data-placeholder": segment.placeholder, "data-value": segment.value, "data-selected": (selectedSegment === null || selectedSegment === void 0 ? void 0 : selectedSegment.index) === segment.index, children: _value ? segment.text : segment.placeholder }, i));
498
+ }), utc && _jsx("div", { style: { marginLeft: 5 }, children: "UTC" }), clearable && _value ? (_jsx(ClearButton, { onClick: handleClear })) : arrow ? (_jsx(ArrowButton, {})) : null] }), !disabled && enableCalendar && isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(StyledFloatContainer, Object.assign({ ref: refs.setFloating, style: floatingStyles }, getReferenceProps(), { children: _jsx(StyledContent, { maxDropdownHeight: "fit-content", children: _jsx("div", { children: _jsx(Calendar, { value: _value ? moment(_value).toDate() : undefined, clearable: false, min: min, max: max, onChange: (date) => {
499
+ setUncontrolledValue((prev) => {
484
500
  // make copy of prev variable
485
501
  const oldValue = moment(prev).toISOString();
486
502
  const result = `${moment(date).format("YYYY-MM-DD")}T${moment(prev || undefined).format("HH:mm:ss")}`;
@@ -1,46 +1,3 @@
1
- import React, { ComponentPropsWithoutRef, ComponentType, ReactElement, ReactNode, UIEvent } from "react";
2
- import { ButtonProps } from "../Button";
3
- import { Size, Variant } from "../core";
4
- import { DropDownItem } from "./types";
5
- interface StyledContentProps {
6
- maxDropdownHeight?: number | string;
7
- variant?: Variant;
8
- }
9
- declare const StyledContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledContentProps>> & string;
10
- export interface DropDownMenuProps {
11
- className?: string;
12
- children?: ReactNode | string;
13
- label?: string;
14
- data: DropDownItem[];
15
- variant?: Variant;
16
- defaultValue?: DropDownItem[];
17
- multiselect?: boolean;
18
- size?: Size;
19
- title?: string;
20
- TooltipContent?: ComponentType<any>;
21
- renderOption?: (item: DropDownItem) => ReactNode;
22
- onChange?: (selected: DropDownItem[], diff: DropDownItem[]) => void;
23
- onItemSelect?: (item: DropDownItem) => void;
24
- onScroll?: (e: UIEvent<HTMLDivElement>) => void;
25
- loading?: boolean;
26
- arrow?: boolean;
27
- searchable?: boolean;
28
- dropDownProps?: ComponentPropsWithoutRef<typeof StyledContent>;
29
- buttonRender?: (props: any) => ReactElement;
30
- buttonProps?: ButtonProps;
31
- }
32
- interface MenuProps {
33
- label?: any;
34
- nested?: boolean;
35
- children?: React.ReactNode;
36
- buttonRender?: (props: any) => ReactElement;
37
- arrow?: boolean;
38
- variant?: Variant;
39
- buttonProps?: ButtonProps;
40
- size?: Size;
41
- buttonSize?: Size;
42
- multiselect?: boolean;
43
- }
44
- export declare const Menu: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLButtonElement> & MenuProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
45
- declare const DropDownMenu: ({ data, children, defaultValue, variant, arrow, size, searchable, loading, onScroll, multiselect, renderOption, onItemSelect, onChange, buttonProps, TooltipContent, }: DropDownMenuProps) => import("react/jsx-runtime").JSX.Element;
1
+ import { DropDownMenuProps } from "./types";
2
+ declare const DropDownMenu: ({ data, children, defaultValue, variant, arrow, size, searchable, loading, onScroll, multiselect, renderOption, onItemSelect, onChange, buttonProps, TooltipContent, dropDownProps, }: DropDownMenuProps) => import("react/jsx-runtime").JSX.Element;
46
3
  export default DropDownMenu;