@monolith-forensics/monolith-ui 1.8.1-dev.3 → 1.8.1-dev.4

package/dist/RichTextEditor/RichTextEditor.js

@@ -11,6 +11,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from "react";
 import styled from "styled-components";
 import { EditorContent, useEditor } from "@tiptap/react";
+import { DOMParser as ProseMirrorDOMParser } from "@tiptap/pm/model";
 import { Toolbar } from "./Toolbar";
 import getTipTapExtensions from "./Extensions/getTiptapExtensions";
 import { Extensions, SlashCommands } from "./Enums";
@@ -83,6 +84,12 @@ const htmlHasContent = (html) => {
     return Boolean(((_a = document.body.textContent) === null || _a === void 0 ? void 0 : _a.trim()) ||
         document.body.querySelector("table, ul, ol, blockquote, pre, code, hr, iframe, video, audio"));
 };
+const insertHtmlAtSelection = (view, html) => {
+    const container = window.document.createElement("div");
+    container.innerHTML = html;
+    const slice = ProseMirrorDOMParser.fromSchema(view.state.schema).parseSlice(container);
+    view.dispatch(view.state.tr.replaceSelection(slice).scrollIntoView());
+};
 const createImageFileFromSource = (imageSource, index) => __awaiter(void 0, void 0, void 0, function* () {
     var _a;
     const response = yield fetch(imageSource.src);
@@ -191,7 +198,7 @@ const handleImagePaste = (view, event, handleImageUpload, handleImageUrlUpload)
         return false;
     event.preventDefault();
     if (html && htmlHasContent(htmlWithImageMarkers)) {
-        view.pasteHTML(htmlWithImageMarkers);
+        insertHtmlAtSelection(view, htmlWithImageMarkers);
         imageSources.forEach((imageSource) => {
             replaceImageMarkerWithPlaceholder(view, imageSource);
         });

package/dist/RichTextEditor/Toolbar/Toolbar.js

@@ -23,7 +23,11 @@ export const Toolbar = styled(({ className, editor, toolbarOptions }) => {
                     return (_jsx(Button, Object.assign({}, item.options, { children: (_a = item === null || item === void 0 ? void 0 : item.options) === null || _a === void 0 ? void 0 : _a.label }), index));
                 }
                 else if (item.type === "menu") {
-                    return (_jsx(DropDownMenu, Object.assign({}, item.options, { children: (_b = item === null || item === void 0 ? void 0 : item.options) === null || _b === void 0 ? void 0 : _b.label }), index));
+                    return (_jsx(DropDownMenu, Object.assign({ dropDownProps: {
+                            style: {
+                                width: 135,
+                            },
+                        } }, item.options, { children: (_b = item === null || item === void 0 ? void 0 : item.options) === null || _b === void 0 ? void 0 : _b.label }), index));
                 }
             }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.FONT)) && (_jsx(DropDownMenu, { data: Object.values(Fonts).map((font) => ({
                     label: font,
@@ -31,7 +35,11 @@ export const Toolbar = styled(({ className, editor, toolbarOptions }) => {
                     onClick: () => {
                         setFont(font);
                     },
-                })), size: "xxs", variant: "outlined", arrow: true, buttonProps: {
+                })), size: "xxs", variant: "outlined", arrow: true, dropDownProps: {
+                    style: {
+                        width: 135,
+                    },
+                }, buttonProps: {
                     title: "Select Font",
                 }, children: (font || Fonts.DEFAULT) })), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.UNDO)) && _jsx(UndoControl, { editor: editor }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.REDO)) && _jsx(RedoControl, { editor: editor })] }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.COLOR)) && (_jsx(DropDownMenu, { data: [
                     {
@@ -60,6 +68,10 @@ export const Toolbar = styled(({ className, editor, toolbarOptions }) => {
                                 borderRadius: "3px",
                             } }), item.label] })), size: "xxs", variant: "outlined", arrow: true, buttonProps: {
                     title: "Select Color",
+                }, dropDownProps: {
+                    style: {
+                        width: 100,
+                    },
                 }, children: "Color" })), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.BOLD)) && _jsx(BoldControl, { editor: editor }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.ITALIC)) && (_jsx(ItalicControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.UNDERLINE)) && (_jsx(UnderlineControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.STRIKE)) && (_jsx(StrikeThroughControl, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_1)) && (_jsx(Heading1Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_2)) && (_jsx(Heading2Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_3)) && (_jsx(Heading3Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_4)) && (_jsx(Heading4Control, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.BULLET_LIST)) && (_jsx(BulletListControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.ORDERED_LIST)) && (_jsx(OrderedListControl, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_LEFT)) && (_jsx(AlignLeftControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_CENTER)) && (_jsx(AlignCenterControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_RIGHT)) && (_jsx(AlignRightControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_JUSTIFIED)) && (_jsx(AlignJustifiedControl, { editor: editor }))] })] }));
 }) `
   display: flex;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@monolith-forensics/monolith-ui",
-  "version": "1.8.1-dev.3",
+  "version": "1.8.1-dev.4",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "author": "Matt Danner (Monolith Forensics LLC)",

package/dist/DateTimeRangePicker/DateTimeRangePicker.d.ts

@@ -1,41 +0,0 @@
-import { ReactNode } from "react";
-import type { FormatOptions } from "../DateInput/DateInput";
-import { Size, Variant } from "../core";
-export type DateTimeRangeValue = {
-    start?: string | null;
-    end?: string | null;
-};
-export type DateTimeRangePreset = {
-    label: string;
-    getRange: () => Required<DateTimeRangeValue>;
-};
-export type DateTimeRangePickerChangeMeta = {
-    source: "apply" | "clear" | "preset";
-    preset?: DateTimeRangePreset;
-};
-export type DateTimeRangePickerProps = {
-    className?: string;
-    style?: React.CSSProperties;
-    defaultValue?: DateTimeRangeValue;
-    value?: DateTimeRangeValue;
-    onChange?: (value: DateTimeRangeValue, meta: DateTimeRangePickerChangeMeta) => void;
-    label?: string;
-    description?: ReactNode;
-    placeholder?: string;
-    startLabel?: string;
-    endLabel?: string;
-    format?: FormatOptions;
-    size?: Size;
-    variant?: Variant;
-    required?: boolean;
-    clearable?: boolean;
-    disabled?: boolean;
-    error?: string;
-    width?: string | number;
-    min?: Date;
-    max?: Date;
-    utc?: boolean;
-    presets?: DateTimeRangePreset[];
-};
-declare const DateTimeRangePicker: import("react").ForwardRefExoticComponent<DateTimeRangePickerProps & import("react").RefAttributes<HTMLElement>>;
-export default DateTimeRangePicker;

package/dist/DateTimeRangePicker/DateTimeRangePicker.js

@@ -1,363 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { autoUpdate, flip, FloatingPortal, offset, shift, useDismiss, useFloating, useInteractions, } from "@floating-ui/react";
-import moment from "moment";
-import { CalendarDaysIcon, Clock3Icon } from "lucide-react";
-import { forwardRef, useCallback, useEffect, useMemo, useRef, useState, } from "react";
-import styled from "styled-components";
-import { Button, Calendar, DateInput, FieldLabel, SegmentedControl } from "..";
-import { ArrowButton, ClearButton, getControlSizeTokens, StyledContent, StyledFloatContainer, } from "../core";
-const DEFAULT_FORMAT = "YYYY-MM-DD HH:mm:ss";
-const resolveNow = (utc) => (utc ? moment.utc() : moment());
-const serializeMoment = (value, utc) => {
-    const next = utc ? value.clone().utc() : value.clone();
-    return next.toISOString();
-};
-const getDefaultPresets = (utc) => {
-    const makePreset = (label, amount, unit) => ({
-        label,
-        getRange: () => {
-            const end = resolveNow(utc);
-            const start = end.clone().subtract(amount, unit);
-            return {
-                start: serializeMoment(start, utc),
-                end: serializeMoment(end, utc),
-            };
-        },
-    });
-    return [
-        makePreset("Last 15 minutes", 15, "minutes"),
-        makePreset("Last 30 minutes", 30, "minutes"),
-        makePreset("Last 1 hour", 1, "hour"),
-        makePreset("Last 24 hours", 24, "hours"),
-        makePreset("Last 7 days", 7, "days"),
-        makePreset("Last 30 days", 30, "days"),
-    ];
-};
-const parseRangeMoment = (value, utc) => {
-    if (!value)
-        return null;
-    const parsed = utc ? moment.utc(value) : moment(value);
-    return parsed.isValid() ? parsed : null;
-};
-const momentToCalendarDate = (value, utc) => {
-    const parsed = parseRangeMoment(value, utc);
-    if (!parsed)
-        return undefined;
-    if (!utc)
-        return parsed.toDate();
-    return new Date(parsed.year(), parsed.month(), parsed.date(), parsed.hour(), parsed.minute(), parsed.second(), parsed.millisecond());
-};
-const calendarDateToMoment = (value, utc) => {
-    if (!utc)
-        return moment(value);
-    return moment.utc({
-        year: value.getFullYear(),
-        month: value.getMonth(),
-        date: value.getDate(),
-        hour: value.getHours(),
-        minute: value.getMinutes(),
-        second: value.getSeconds(),
-        millisecond: value.getMilliseconds(),
-    });
-};
-const formatDisplay = (value, format, utc) => {
-    const parsed = parseRangeMoment(value, utc);
-    if (!parsed)
-        return "";
-    return parsed.format(format);
-};
-const StyledContainer = styled.div.attrs({
-    className: "mfui-DateTimeRangePicker",
-}) `
-  width: ${({ $width }) => {
-    if ($width === undefined || $width === null)
-        return "100%";
-    return typeof $width === "number" ? `${$width}px` : $width;
-}};
-`;
-const StyledTrigger = styled.button `
-  position: relative;
-  display: flex;
-  align-items: center;
-  gap: ${({ size }) => `${getControlSizeTokens(size).iconGap}px`};
-  width: 100%;
-  height: ${({ size }) => `${getControlSizeTokens(size).height}px`};
-  padding: ${({ size }) => `0 ${getControlSizeTokens(size).adornmentWidth}px 0 ${getControlSizeTokens(size).inputPaddingX}px`};
-  border-radius: 5px;
-  border: 1px solid
-    ${({ theme, variant }) => variant === "filled" || variant === "text"
-    ? "transparent"
-    : theme.palette.input.border};
-  outline: none;
-  background: ${({ theme, variant }) => variant === "text" ? "transparent" : theme.palette.input.background};
-  color: ${({ theme }) => theme.palette.text.primary};
-  font-family: ${({ theme }) => theme.typography.fontFamily};
-  font-size: ${({ size }) => `${getControlSizeTokens(size).fontSize}px`};
-  text-align: left;
-  cursor: pointer;
-  transition: border 0.1s ease-in-out;
-
-  &:focus-visible,
-  &:focus {
-    border-color: ${({ theme }) => theme.palette.primary.main};
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-  }
-`;
-const TriggerIcon = styled.span `
-  display: inline-flex;
-  align-items: center;
-  color: ${({ theme }) => theme.palette.text.secondary};
-
-  svg {
-    width: ${({ size }) => `${getControlSizeTokens(size).iconSize}px`};
-    height: ${({ size }) => `${getControlSizeTokens(size).iconSize}px`};
-  }
-`;
-const TriggerText = styled.span `
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  color: ${({ theme, $empty }) => $empty ? theme.palette.input.placeholder : theme.palette.text.primary};
-`;
-const TriggerActions = styled.span `
-  position: absolute;
-  right: 0;
-  top: 0;
-  display: flex;
-  height: 100%;
-`;
-const PickerPanel = styled.div `
-  display: grid;
-  grid-template-columns: 172px minmax(430px, 1fr);
-  gap: 10px;
-  width: min(720px, calc(100vw - 32px));
-
-  @media (max-width: 640px) {
-    grid-template-columns: minmax(0, 1fr);
-    width: calc(100vw - 32px);
-  }
-`;
-const PresetColumn = styled.div `
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  padding-right: 10px;
-  border-right: 1px solid ${({ theme }) => theme.palette.divider};
-
-  @media (max-width: 640px) {
-    padding-right: 0;
-    padding-bottom: 10px;
-    border-right: none;
-    border-bottom: 1px solid ${({ theme }) => theme.palette.divider};
-  }
-`;
-const PanelTitle = styled.div `
-  font-size: 11px;
-  font-weight: 700;
-  line-height: 1.2;
-  text-transform: uppercase;
-  color: ${({ theme }) => theme.palette.text.secondary};
-  margin-bottom: 4px;
-`;
-const PresetButton = styled.button `
-  display: flex;
-  align-items: center;
-  width: 100%;
-  min-height: 28px;
-  padding: 0 8px;
-  border: none;
-  border-radius: 4px;
-  background: transparent;
-  color: ${({ theme }) => theme.palette.text.primary};
-  font: inherit;
-  font-size: 12px;
-  text-align: left;
-  cursor: pointer;
-
-  &:hover,
-  &:focus-visible {
-    background: ${({ theme }) => theme.palette.action.hover};
-    outline: none;
-  }
-`;
-const CustomColumn = styled.div `
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-  min-width: 0;
-`;
-const InputGrid = styled.div `
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 8px;
-
-  @media (max-width: 640px) {
-    grid-template-columns: minmax(0, 1fr);
-  }
-`;
-const EndpointField = styled.div `
-  min-width: 0;
-`;
-const ActiveControlRow = styled.div `
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 10px;
-`;
-const CalendarShell = styled.div `
-  display: flex;
-  justify-content: center;
-  padding: 8px;
-  overflow-x: auto;
-  border: 1px solid ${({ theme }) => theme.palette.divider};
-  border-radius: 5px;
-  background: ${({ theme }) => theme.palette.background.paper};
-`;
-const ValidationText = styled.div `
-  min-height: 16px;
-  font-size: 11px;
-  color: ${({ theme }) => theme.palette.error.main};
-`;
-const ActionRow = styled.div `
-  display: flex;
-  justify-content: flex-end;
-  gap: 8px;
-`;
-const FooterMeta = styled.div `
-  display: flex;
-  align-items: center;
-  gap: 5px;
-  margin-right: auto;
-  color: ${({ theme }) => theme.palette.text.secondary};
-  font-size: 11px;
-
-  svg {
-    width: 13px;
-    height: 13px;
-  }
-`;
-const DateTimeRangePicker = forwardRef(({ className, style, defaultValue = { start: null, end: null }, value, onChange = () => { }, label, description, placeholder = "Select date/time range", startLabel = "Start", endLabel = "End", format = DEFAULT_FORMAT, size = "sm", variant = "outlined", required = false, clearable = true, disabled = false, error, width, min, max, utc = false, presets, }, ref) => {
-    var _a, _b;
-    const isControlled = useRef(value !== undefined);
-    const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);
-    const _value = isControlled.current ? value || {} : uncontrolledValue;
-    const [isOpen, setIsOpen] = useState(false);
-    const [draftValue, setDraftValue] = useState(_value);
-    const [activeEndpoint, setActiveEndpoint] = useState("start");
-    const resolvedPresets = useMemo(() => presets || getDefaultPresets(utc), [presets, utc]);
-    const { refs, floatingStyles, context } = useFloating({
-        open: isOpen,
-        onOpenChange: setIsOpen,
-        placement: "bottom-start",
-        strategy: "absolute",
-        middleware: [offset(5), flip(), shift({ padding: 8 })],
-        whileElementsMounted: autoUpdate,
-    });
-    const dismiss = useDismiss(context, {
-        outsidePress: (event) => {
-            var _a, _b, _c;
-            const target = event.target;
-            if (((_a = target === null || target === void 0 ? void 0 : target.closest) === null || _a === void 0 ? void 0 : _a.call(target, ".mfui-DateInput")) ||
-                ((_b = target === null || target === void 0 ? void 0 : target.closest) === null || _b === void 0 ? void 0 : _b.call(target, ".mfui-DropDownMenu")) ||
-                ((_c = target === null || target === void 0 ? void 0 : target.closest) === null || _c === void 0 ? void 0 : _c.call(target, ".Menu"))) {
-                return false;
-            }
-            return true;
-        },
-    });
-    const { getReferenceProps, getFloatingProps } = useInteractions([dismiss]);
-    useEffect(() => {
-        if (isOpen) {
-            setDraftValue(_value);
-            setActiveEndpoint(_value.start ? "end" : "start");
-        }
-    }, [isOpen, _value.start, _value.end]);
-    const commitValue = useCallback((nextValue, meta) => {
-        if (!isControlled.current) {
-            setUncontrolledValue(nextValue);
-        }
-        onChange(nextValue, meta);
-    }, [onChange]);
-    const displayValue = useMemo(() => {
-        if (!_value.start && !_value.end)
-            return "";
-        const start = formatDisplay(_value.start, format, utc) || "Start";
-        const end = formatDisplay(_value.end, format, utc) || "End";
-        return `${start} - ${end}${utc ? " UTC" : ""}`;
-    }, [_value.start, _value.end, format, utc]);
-    const validationError = useMemo(() => {
-        const start = parseRangeMoment(draftValue.start, utc);
-        const end = parseRangeMoment(draftValue.end, utc);
-        if (!start || !end)
-            return "Select both a start and end timestamp.";
-        if (start.isAfter(end))
-            return "Start timestamp must be before end.";
-        if (min && start.isBefore(moment(min)))
-            return "Start is before minimum.";
-        if (max && end.isAfter(moment(max)))
-            return "End is after maximum.";
-        return "";
-    }, [draftValue.start, draftValue.end, min, max, utc]);
-    const patchDraft = (patch) => {
-        setDraftValue((prev) => (Object.assign(Object.assign({}, prev), patch)));
-    };
-    const handleClear = (event) => {
-        event === null || event === void 0 ? void 0 : event.preventDefault();
-        event === null || event === void 0 ? void 0 : event.stopPropagation();
-        const emptyValue = { start: null, end: null };
-        setDraftValue(emptyValue);
-        commitValue(emptyValue, { source: "clear" });
-        setIsOpen(false);
-    };
-    const handleApply = () => {
-        if (validationError)
-            return;
-        commitValue(draftValue, { source: "apply" });
-        setIsOpen(false);
-    };
-    const handleCancel = () => {
-        setDraftValue(_value);
-        setIsOpen(false);
-    };
-    const handlePreset = (preset) => {
-        const nextValue = preset.getRange();
-        setDraftValue(nextValue);
-        commitValue(nextValue, { source: "preset", preset });
-        setIsOpen(false);
-    };
-    const handleCalendarChange = (date) => {
-        if (!date) {
-            patchDraft({ [activeEndpoint]: null });
-            return;
-        }
-        patchDraft({
-            [activeEndpoint]: serializeMoment(calendarDateToMoment(date, utc), utc),
-        });
-    };
-    const activeValue = draftValue[activeEndpoint];
-    const activeMin = activeEndpoint === "end"
-        ? ((_a = parseRangeMoment(draftValue.start, utc)) === null || _a === void 0 ? void 0 : _a.toDate()) || min
-        : min;
-    const activeMax = activeEndpoint === "start"
-        ? ((_b = parseRangeMoment(draftValue.end, utc)) === null || _b === void 0 ? void 0 : _b.toDate()) || max
-        : max;
-    return (_jsxs(StyledContainer, Object.assign({ ref: (node) => {
-            if (typeof ref === "function") {
-                ref(node);
-            }
-            else if (ref) {
-                ref.current = node;
-            }
-            refs.setReference(node);
-        }, className: className, "$width": width }, getReferenceProps(), { children: [label && (_jsx(FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label })), _jsxs(StyledTrigger, { type: "button", size: size, variant: variant, disabled: disabled, style: style, "aria-haspopup": "dialog", "aria-expanded": isOpen, onClick: () => setIsOpen((prev) => !prev), children: [_jsx(TriggerIcon, { size: size, children: _jsx(CalendarDaysIcon, {}) }), _jsx(TriggerText, { "$empty": !displayValue, children: displayValue || placeholder }), _jsx(TriggerActions, { children: clearable && (_value.start || _value.end) ? (_jsx(ClearButton, { size: size, onClick: handleClear })) : (_jsx(ArrowButton, { size: size })) })] }), !disabled && isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(StyledFloatContainer, Object.assign({ ref: refs.setFloating, style: floatingStyles }, getFloatingProps(), { children: _jsx(StyledContent, { maxDropdownHeight: "fit-content", children: _jsxs(PickerPanel, { children: [_jsxs(PresetColumn, { children: [_jsx(PanelTitle, { children: "Quick ranges" }), resolvedPresets.map((preset) => (_jsx(PresetButton, { type: "button", onClick: () => handlePreset(preset), children: preset.label }, preset.label)))] }), _jsxs(CustomColumn, { children: [_jsxs(InputGrid, { children: [_jsx(EndpointField, { onClick: () => setActiveEndpoint("start"), children: _jsx(DateInput, { label: startLabel, value: draftValue.start, onChange: (next) => patchDraft({ start: next }), format: format, size: size, variant: variant, clearable: true, utc: utc, min: min, max: activeEndpoint === "start" ? activeMax : max }) }), _jsx(EndpointField, { onClick: () => setActiveEndpoint("end"), children: _jsx(DateInput, { label: endLabel, value: draftValue.end, onChange: (next) => patchDraft({ end: next }), format: format, size: size, variant: variant, clearable: true, utc: utc, min: activeEndpoint === "end" ? activeMin : min, max: max }) })] }), _jsxs(ActiveControlRow, { children: [_jsxs(PanelTitle, { children: ["Editing ", activeEndpoint === "start" ? startLabel : endLabel] }), _jsx(SegmentedControl, { data: [
-                                                        { label: startLabel, value: "start" },
-                                                        { label: endLabel, value: "end" },
-                                                    ], value: activeEndpoint, onChange: (next) => setActiveEndpoint(next), size: "xs" })] }), _jsx(CalendarShell, { children: _jsx(Calendar, { value: momentToCalendarDate(activeValue, utc), onChange: handleCalendarChange, includeTime: true, clearable: false, min: activeMin, max: activeMax }) }), _jsx(ValidationText, { children: validationError }), _jsxs(ActionRow, { children: [_jsxs(FooterMeta, { children: [_jsx(Clock3Icon, {}), utc ? "UTC" : "Local time"] }), clearable && (_jsx(Button, { type: "button", size: size, variant: "subtle", onClick: handleClear, children: "Clear" })), _jsx(Button, { type: "button", size: size, variant: "outlined", onClick: handleCancel, children: "Cancel" }), _jsx(Button, { type: "button", size: size, variant: "contained", onClick: handleApply, disabled: Boolean(validationError), children: "Apply" })] })] })] }) }) })) }))] })));
-});
-DateTimeRangePicker.displayName = "DateTimeRangePicker";
-export default DateTimeRangePicker;

package/dist/DateTimeRangePicker/index.d.ts

@@ -1,2 +0,0 @@
-export { default } from "./DateTimeRangePicker";
-export * from "./DateTimeRangePicker";

package/dist/DateTimeRangePicker/index.js

@@ -1,2 +0,0 @@
-export { default } from "./DateTimeRangePicker";
-export * from "./DateTimeRangePicker";

package/dist/QueryFilter/DefaultOperators.d.ts

@@ -1 +0,0 @@
-export { DefaultOperators, Operators, DEFAULT_QUERY_FILTER_OPERATORS, QUERY_FILTER_OPERATORS, } from "./QueryFilter.constants";

package/dist/QueryFilter/DefaultOperators.js

@@ -1 +0,0 @@
-export { DefaultOperators, Operators, DEFAULT_QUERY_FILTER_OPERATORS, QUERY_FILTER_OPERATORS, } from "./QueryFilter.constants";

package/dist/QueryFilter/types.d.ts

@@ -1 +0,0 @@
-export * from "./QueryFilter.types";

package/dist/QueryFilter/types.js

@@ -1 +0,0 @@
-export * from "./QueryFilter.types";

package/dist/Table/Utils/resizeHandler.d.ts

@@ -1,3 +0,0 @@
-import { ResizeHandlerProps } from "../types";
-declare const resizeHandler: ({ event, columnId, columnProps, onResize, onResizeFinished, }: ResizeHandlerProps) => void;
-export default resizeHandler;

package/dist/Table/Utils/resizeHandler.js

@@ -1,84 +0,0 @@
-import TableDefaults from "../TableDefaults";
-const enableResizeClass = (dataField) => {
-    if (dataField === undefined) {
-        return;
-    }
-    document.querySelectorAll(`.resizer.col-${dataField}`).forEach((resizer) => {
-        resizer.classList.add("isResizing");
-    });
-};
-const disableResizeClass = (dataField) => {
-    if (dataField === undefined) {
-        return;
-    }
-    document.querySelectorAll(`.resizer.col-${dataField}`).forEach((resizer) => {
-        resizer.classList.remove("isResizing");
-    });
-};
-const resizeHandler = ({ event, columnId, columnProps, onResize, onResizeFinished, }) => {
-    let col = event.target
-        .parentElement;
-    let newColumns = [];
-    let x = 0;
-    let w = 0;
-    const mouseMoveHandler = function (e) {
-        const selectedColumn = document.querySelectorAll(`.column-${columnId}`);
-        const columnHeaders = document.querySelectorAll(`.mfui-th.column-${columnId}`);
-        const dx = e.clientX - x;
-        let newWidth = w + dx;
-        // Calculate what the minimum width should be
-        // min width should be the defined column width or the default min width
-        if (columnProps.minWidth === undefined) {
-            if (newWidth < TableDefaults.td.minWidth)
-                newWidth = TableDefaults.td.minWidth;
-        }
-        else {
-            if (newWidth < columnProps.minWidth)
-                newWidth = columnProps.minWidth;
-        }
-        selectedColumn.forEach((col) => {
-            var _a;
-            col.style.width = `${newWidth}px`;
-            col.style.flex = "0 0 auto";
-            // col.style.maxWidth = `${newWidth}px`;
-            // col.style.minWidth = `${newWidth}px`;
-            newColumns.push({
-                dataField: ((_a = col === null || col === void 0 ? void 0 : col.dataset) === null || _a === void 0 ? void 0 : _a.field) || "",
-                width: newWidth,
-            });
-        });
-        newColumns = Array.from(columnHeaders).map((col) => {
-            var _a;
-            return {
-                dataField: ((_a = col === null || col === void 0 ? void 0 : col.dataset) === null || _a === void 0 ? void 0 : _a.field) || "",
-                width: newWidth,
-            };
-        });
-        onResize({
-            columns: newColumns,
-        });
-    };
-    const mouseUpHandler = function () {
-        var _a, _b, _c;
-        let newWidth = ((_c = (_b = (_a = document === null || document === void 0 ? void 0 : document.querySelector) === null || _a === void 0 ? void 0 : _a.call(document, `.column-${columnId}`)) === null || _b === void 0 ? void 0 : _b.style) === null || _c === void 0 ? void 0 : _c.width) || null;
-        if (newWidth) {
-            newWidth = newWidth.replace("px", "");
-        }
-        disableResizeClass(columnId);
-        document.removeEventListener("mousemove", mouseMoveHandler);
-        document.removeEventListener("mouseup", mouseUpHandler);
-        onResizeFinished === null || onResizeFinished === void 0 ? void 0 : onResizeFinished({
-            column: columnProps,
-            columnId: columnId,
-            targetColumn: document.querySelector(`.column-${columnId}`),
-            newWidth,
-        });
-    };
-    x = event.clientX;
-    const styles = window.getComputedStyle(col);
-    w = parseInt(styles.width, 10);
-    document.addEventListener("mousemove", mouseMoveHandler);
-    document.addEventListener("mouseup", mouseUpHandler);
-    enableResizeClass(columnId);
-};
-export default resizeHandler;