@deenruv/react-ui-devkit 1.0.0

package/dist/universal_components/FacetIdsSelector.js

@@ -0,0 +1,70 @@
+import { __awaiter, __generator } from "tslib";
+import { MultipleSelector } from "../components/index.js";
+import { useTranslation } from "../hooks/useTranslation.js";
+import { generateColorFromString } from "../lib/utils.js";
+import { FacetValueSelector } from "../selectors/FacetValueSelector.js";
+import { apiClient } from "../zeus_client/deenruvAPICall.js";
+import React, { useCallback, useEffect, useState } from "react";
+export var FacetIdsSelector = function (_a) {
+    var facetValuesIds = _a.facetValuesIds, onChange = _a.onChange, fixedDropdown = _a.fixedDropdown, _b = _a.single, single = _b === void 0 ? false : _b, className = _a.className, disabledInput = _a.disabledInput;
+    var t = useTranslation("products").t;
+    var _c = useState([]), selectedOptions = _c[0], setSelectedOptions = _c[1];
+    var handleSearch = useCallback(function (debaouncedValues) { return __awaiter(void 0, void 0, void 0, function () {
+        var response;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, apiClient("query")({
+                        facetValues: [
+                            { options: { filter: { name: { contains: debaouncedValues } } } },
+                            { totalItems: true, items: FacetValueSelector },
+                        ],
+                    })];
+                case 1:
+                    response = _a.sent();
+                    return [2 /*return*/, response.facetValues.items.map(function (f) { return ({
+                            label: "".concat(f.facet.name.toUpperCase(), " ").concat(f.name),
+                            value: f.id,
+                            parent: f.facet.name,
+                            color: generateColorFromString(f.facet.name),
+                        }); })];
+            }
+        });
+    }); }, []);
+    useEffect(function () {
+        (function () { return __awaiter(void 0, void 0, void 0, function () {
+            var response;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, apiClient("query")({
+                            facetValues: [
+                                { options: { filter: { id: { in: facetValuesIds } } } },
+                                { totalItems: true, items: FacetValueSelector },
+                            ],
+                        })];
+                    case 1:
+                        response = _a.sent();
+                        setSelectedOptions(response.facetValues.items.map(function (f) { return ({
+                            label: "".concat(f.facet.name.toUpperCase(), " ").concat(f.name),
+                            value: f.id,
+                            parent: f.facet.name,
+                            color: generateColorFromString(f.facet.name),
+                        }); }));
+                        return [2 /*return*/];
+                }
+            });
+        }); })();
+    }, [facetValuesIds]);
+    var handleChange = function (options) {
+        if (single) {
+            var first = options[0];
+            setSelectedOptions(first ? [first] : []);
+            onChange(first ? [first.value] : []);
+        }
+        else {
+            setSelectedOptions(options);
+            onChange(options.map(function (o) { return o.value; }));
+        }
+    };
+    return (React.createElement(MultipleSelector, { value: selectedOptions, placeholder: t("facetPlaceholder"), onChange: handleChange, onSearch: handleSearch, hideClearAllButton: true, fixedDropdown: fixedDropdown, maxSelected: single ? 1 : undefined, className: className, disabledInput: disabledInput }));
+};
+//# sourceMappingURL=FacetIdsSelector.js.map

package/dist/universal_components/FacetIdsSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FacetIdsSelector.js","sourceRoot":"","sources":["../../src/universal_components/FacetIdsSelector.tsx"],"names":[],"mappings":"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"}

package/dist/universal_components/PageBlock.d.ts

@@ -0,0 +1,14 @@
+import React, { PropsWithChildren } from "react";
+interface PageBlockProps {
+    sidebar?: React.ReactNode;
+    withoutPadding?: boolean;
+    className?: string;
+}
+/**
+ * A page block component that can be used to layout a page with a sidebar.
+ *
+ * @param {React.ReactNode} sidebar - The sidebar component.
+ * @param {React.ReactNode} children - The children components.
+ */
+export declare const PageBlock: React.FC<PropsWithChildren<PageBlockProps>>;
+export {};

package/dist/universal_components/PageBlock.js

@@ -0,0 +1,15 @@
+import { cn } from "../lib/utils.js";
+import React from "react";
+/**
+ * A page block component that can be used to layout a page with a sidebar.
+ *
+ * @param {React.ReactNode} sidebar - The sidebar component.
+ * @param {React.ReactNode} children - The children components.
+ */
+export var PageBlock = function (_a) {
+    var className = _a.className, withoutPadding = _a.withoutPadding, children = _a.children, sidebar = _a.sidebar;
+    return (React.createElement("div", { className: cn(sidebar ? "grid grid-cols-[minmax(0,1fr)_400px] gap-4" : "w-full", withoutPadding ? "" : "p-4", className) },
+        children ? children : React.createElement("div", null, "Missing component"),
+        sidebar && React.createElement("div", { className: "flex flex-col gap-2" }, sidebar)));
+};
+//# sourceMappingURL=PageBlock.js.map

package/dist/universal_components/PageBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageBlock.js","sourceRoot":"","sources":["../../src/universal_components/PageBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,wBAAuB;AACpC,OAAO,KAA4B,MAAM,OAAO,CAAC;AAQjD;;;;;GAKG;AACH,MAAM,CAAC,IAAM,SAAS,GAAgD,UAAC,EAKtE;QAJC,SAAS,eAAA,EACT,cAAc,oBAAA,EACd,QAAQ,cAAA,EACR,OAAO,aAAA;IAEP,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CACX,OAAO,CAAC,CAAC,CAAC,4CAA4C,CAAC,CAAC,CAAC,QAAQ,EACjE,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,EAC3B,SAAS,CACV;QAEA,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,qDAA4B;QAClD,OAAO,IAAI,6BAAK,SAAS,EAAC,qBAAqB,IAAE,OAAO,CAAO,CAC5D,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/universal_components/RichTextEditor/Buttons.d.ts

@@ -0,0 +1,12 @@
+import React, { PropsWithChildren } from "react";
+interface EditorButtonProps {
+    onClick: () => void;
+    disabled?: boolean;
+}
+export declare const SimpleButton: React.FC<PropsWithChildren<EditorButtonProps>>;
+export declare const ToggleButton: React.FC<PropsWithChildren<EditorButtonProps>>;
+interface EditorToggleGroupButtonProps {
+    value: string;
+}
+export declare const ToggleGroupButton: React.FC<PropsWithChildren<EditorToggleGroupButtonProps>>;
+export {};

package/dist/universal_components/RichTextEditor/Buttons.js

@@ -0,0 +1,15 @@
+import { Button, Toggle, ToggleGroupItem } from "../../components/atoms";
+import React from "react";
+export var SimpleButton = function (_a) {
+    var children = _a.children, onClick = _a.onClick, disabled = _a.disabled;
+    return (React.createElement(Button, { variant: "outline", size: "sm", className: "size-8 p-1", onClick: onClick, disabled: disabled }, children));
+};
+export var ToggleButton = function (_a) {
+    var children = _a.children, onClick = _a.onClick;
+    return (React.createElement(Toggle, { variant: "outline", size: "sm", className: "size-8 p-1", onClick: onClick }, children));
+};
+export var ToggleGroupButton = function (_a) {
+    var children = _a.children, value = _a.value;
+    return (React.createElement(ToggleGroupItem, { variant: "outline", size: "sm", className: "size-8 p-1", value: value }, children));
+};
+//# sourceMappingURL=Buttons.js.map

package/dist/universal_components/RichTextEditor/Buttons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Buttons.js","sourceRoot":"","sources":["../../../src/universal_components/RichTextEditor/Buttons.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,eAAe,EAAE,+BAA2B;AACrE,OAAO,KAA4B,MAAM,OAAO,CAAC;AAOjD,MAAM,CAAC,IAAM,YAAY,GAAmD,UAAC,EAI5E;QAHC,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,QAAQ,cAAA;IAER,OAAO,CACL,oBAAC,MAAM,IACL,OAAO,EAAE,SAAS,EAClB,IAAI,EAAE,IAAI,EACV,SAAS,EAAC,YAAY,EACtB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,IAEjB,QAAQ,CACF,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,YAAY,GAAmD,UAAC,EAG5E;QAFC,QAAQ,cAAA,EACR,OAAO,aAAA;IAEP,OAAO,CACL,oBAAC,MAAM,IACL,OAAO,EAAE,SAAS,EAClB,IAAI,EAAE,IAAI,EACV,SAAS,EAAC,YAAY,EACtB,OAAO,EAAE,OAAO,IAEf,QAAQ,CACF,CACV,CAAC;AACJ,CAAC,CAAC;AAMF,MAAM,CAAC,IAAM,iBAAiB,GAE1B,UAAC,EAAmB;QAAjB,QAAQ,cAAA,EAAE,KAAK,WAAA;IACpB,OAAO,CACL,oBAAC,eAAe,IACd,OAAO,EAAE,SAAS,EAClB,IAAI,EAAE,IAAI,EACV,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,KAAK,IAEX,QAAQ,CACO,CACnB,CAAC;AACJ,CAAC,CAAC"}

package/dist/universal_components/RichTextEditor/EditorToolbar.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { Editor } from "@tiptap/react";
+export declare const EditorToolbar: ({ editor }: {
+    editor: Editor | null;
+}) => React.JSX.Element | null;

package/dist/universal_components/RichTextEditor/EditorToolbar.js

@@ -0,0 +1,54 @@
+import React from "react";
+import { SimpleButton, ToggleButton, ToggleGroupButton } from "./Buttons";
+import { Separator, ToggleGroup } from "../../components/atoms";
+import { Bold, Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, Italic, List, ListOrdered, Quote, Redo, Undo, } from "lucide-react";
+export var EditorToolbar = function (_a) {
+    var editor = _a.editor;
+    if (!editor || !editor.isEditable) {
+        return null;
+    }
+    return (React.createElement("div", { className: "flex min-h-8 gap-1" },
+        React.createElement(ToggleButton, { onClick: function () { return editor.chain().focus().toggleBold().run(); } },
+            React.createElement(Bold, { size: 20 })),
+        React.createElement(ToggleButton, { onClick: function () { return editor.chain().focus().toggleItalic().run(); } },
+            React.createElement(Italic, { size: 20 })),
+        React.createElement(Separator, { orientation: "vertical" }),
+        React.createElement(ToggleGroup, { type: "single", onValueChange: function (v) {
+                return v === "ordered"
+                    ? editor.chain().focus().toggleOrderedList().run()
+                    : editor.chain().focus().toggleBulletList().run();
+            } },
+            React.createElement(ToggleGroupButton, { value: "ordered" },
+                React.createElement(ListOrdered, { size: 20 })),
+            React.createElement(ToggleGroupButton, { value: "bullet" },
+                React.createElement(List, { size: 20 }))),
+        React.createElement(Separator, { orientation: "vertical" }),
+        React.createElement(ToggleButton, { onClick: function () { return editor.chain().focus().toggleBlockquote().run(); } },
+            React.createElement(Quote, { size: 20 })),
+        React.createElement(Separator, { orientation: "vertical" }),
+        React.createElement(SimpleButton, { onClick: function () { return editor.chain().focus().undo().run(); }, disabled: !editor.can().chain().focus().undo().run() },
+            React.createElement(Undo, { size: 20 })),
+        React.createElement(SimpleButton, { onClick: function () { return editor.chain().focus().redo().run(); }, disabled: !editor.can().chain().focus().redo().run() },
+            React.createElement(Redo, { size: 20 })),
+        React.createElement(Separator, { orientation: "vertical" }),
+        React.createElement(ToggleGroup, { type: "single", onValueChange: function (e) {
+                return editor
+                    .chain()
+                    .focus()
+                    .toggleHeading({ level: Number(e) })
+                    .run();
+            } },
+            React.createElement(ToggleGroupButton, { value: "1" },
+                React.createElement(Heading1, { size: 20 })),
+            React.createElement(ToggleGroupButton, { value: "2" },
+                React.createElement(Heading2, { size: 20 })),
+            React.createElement(ToggleGroupButton, { value: "3" },
+                React.createElement(Heading3, { size: 20 })),
+            React.createElement(ToggleGroupButton, { value: "4" },
+                React.createElement(Heading4, { size: 20 })),
+            React.createElement(ToggleGroupButton, { value: "5" },
+                React.createElement(Heading5, { size: 20 })),
+            React.createElement(ToggleGroupButton, { value: "6" },
+                React.createElement(Heading6, { size: 20 })))));
+};
+//# sourceMappingURL=EditorToolbar.js.map

package/dist/universal_components/RichTextEditor/EditorToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditorToolbar.js","sourceRoot":"","sources":["../../../src/universal_components/RichTextEditor/EditorToolbar.tsx"],"names":[],"mappings":"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"}

package/dist/universal_components/RichTextEditor/RichTextEditor.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+interface RichTextEditorProps {
+    content: string | undefined;
+    onContentChanged: (content: string) => void;
+    errors?: string[];
+    disabled?: boolean;
+}
+/**
+ * Rich text editor component that handles content input and validation.
+ *
+ * @param {string | undefined} content - The initial content of the editor.
+ * @param {(content: string) => void} onContentChanged - Callback invoked whenever the editor content changes.
+ * @param {string[]} [errors] - Optional list of error messages to display.
+ * @param {boolean} [disabled=false] - Whether the editor is in a disabled state.
+ */
+export declare const RichTextEditor: React.FC<RichTextEditorProps>;
+export {};

package/dist/universal_components/RichTextEditor/RichTextEditor.js

@@ -0,0 +1,48 @@
+import { useEditor, EditorContent } from "@tiptap/react";
+import StarterKit from "@tiptap/starter-kit";
+import Document from "@tiptap/extension-document";
+import Paragraph from "@tiptap/extension-paragraph";
+import Text from "@tiptap/extension-text";
+import Heading from "@tiptap/extension-heading";
+import { useEffect } from "react";
+import { EditorToolbar } from "./EditorToolbar.js";
+import { cn } from "../../lib/utils.js";
+import React from "react";
+import { ErrorMessage } from "../../components/molecules";
+var extensions = [StarterKit, Document, Paragraph, Text, Heading];
+/**
+ * Rich text editor component that handles content input and validation.
+ *
+ * @param {string | undefined} content - The initial content of the editor.
+ * @param {(content: string) => void} onContentChanged - Callback invoked whenever the editor content changes.
+ * @param {string[]} [errors] - Optional list of error messages to display.
+ * @param {boolean} [disabled=false] - Whether the editor is in a disabled state.
+ */
+export var RichTextEditor = function (_a) {
+    var content = _a.content, onContentChanged = _a.onContentChanged, errors = _a.errors, disabled = _a.disabled;
+    var editor = useEditor({
+        extensions: extensions,
+        content: content,
+        onUpdate: function (_a) {
+            var editor = _a.editor;
+            return onContentChanged(editor.getHTML());
+        },
+        editorProps: {
+            attributes: {
+                class: cn("min-h-32 max-h-64 overflow-auto focus-visible:outline-none", "prose max-w-none [&_ol]:list-decimal [&_ul]:list-disc"),
+            },
+        },
+        editable: !disabled,
+    });
+    useEffect(function () {
+        if (editor && content && content !== editor.getHTML()) {
+            editor.commands.setContent(content);
+        }
+    }, [content, editor]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "flex w-full flex-col gap-3 rounded-md border border-stone-200 bg-white px-3 py-2 text-sm ring-offset-white focus-visible:outline-none focus-visible:ring-2 disabled:cursor-not-allowed disabled:opacity-50 dark:border-stone-800 dark:bg-stone-950 dark:placeholder:text-stone-400" },
+            React.createElement(EditorToolbar, { editor: editor }),
+            React.createElement(EditorContent, { editor: editor })),
+        React.createElement(ErrorMessage, { errors: errors })));
+};
+//# sourceMappingURL=RichTextEditor.js.map

package/dist/universal_components/RichTextEditor/RichTextEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichTextEditor.js","sourceRoot":"","sources":["../../../src/universal_components/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,UAAU,MAAM,qBAAqB,CAAC;AAC7C,OAAO,QAAQ,MAAM,4BAA4B,CAAC;AAClD,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,IAAI,MAAM,wBAAwB,CAAC;AAC1C,OAAO,OAAO,MAAM,2BAA2B,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,2BAAuB;AACpC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,mCAA+B;AAEtD,IAAM,UAAU,GAAG,CAAC,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC;AASpE;;;;;;;GAOG;AACH,MAAM,CAAC,IAAM,cAAc,GAAkC,UAAC,EAK7D;QAJC,OAAO,aAAA,EACP,gBAAgB,sBAAA,EAChB,MAAM,YAAA,EACN,QAAQ,cAAA;IAER,IAAM,MAAM,GAAG,SAAS,CAAC;QACvB,UAAU,EAAE,UAAU;QACtB,OAAO,EAAE,OAAO;QAChB,QAAQ,EAAE,UAAC,EAAU;gBAAR,MAAM,YAAA;YAAO,OAAA,gBAAgB,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;QAAlC,CAAkC;QAC5D,WAAW,EAAE;YACX,UAAU,EAAE;gBACV,KAAK,EAAE,EAAE,CACP,4DAA4D,EAC5D,uDAAuD,CACxD;aACF;SACF;QACD,QAAQ,EAAE,CAAC,QAAQ;KACpB,CAAC,CAAC;IAEH,SAAS,CAAC;QACR,IAAI,MAAM,IAAI,OAAO,IAAI,OAAO,KAAK,MAAM,CAAC,OAAO,EAAE,EAAE,CAAC;YACtD,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QACtC,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;IAEtB,OAAO,CACL;QACE,6BAAK,SAAS,EAAC,oRAAoR;YACjS,oBAAC,aAAa,IAAC,MAAM,EAAE,MAAM,GAAI;YACjC,oBAAC,aAAa,IAAC,MAAM,EAAE,MAAM,GAAI,CAC7B;QACN,oBAAC,YAAY,IAAC,MAAM,EAAE,MAAM,GAAI,CAC/B,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/dist/universal_components/RichTextEditor/index.d.ts

@@ -0,0 +1 @@
+export * from "./RichTextEditor.js";

package/dist/universal_components/RichTextEditor/index.js

@@ -0,0 +1,2 @@
+export * from "./RichTextEditor.js";
+//# sourceMappingURL=index.js.map

package/dist/universal_components/RichTextEditor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/universal_components/RichTextEditor/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC"}

package/dist/universal_components/SimpleTimePicker.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Simple Time Picker
+ * Check out the live demo at https://shadcn-datetime-picker-pro.vercel.app/
+ * Find the latest source code at https://github.com/huybuidac/shadcn-datetime-picker
+ */
+import React from "react";
+export declare function SimpleTimePicker({ value, onChange, use12HourFormat, min, max, disabled, modal, }: {
+    use12HourFormat?: boolean;
+    value: Date;
+    onChange: (date: Date) => void;
+    min?: Date;
+    max?: Date;
+    disabled?: boolean;
+    className?: string;
+    modal?: boolean;
+}): React.JSX.Element;

package/dist/universal_components/SimpleTimePicker.js

@@ -0,0 +1,297 @@
+import { __assign } from "tslib";
+/**
+ * Simple Time Picker
+ * Check out the live demo at https://shadcn-datetime-picker-pro.vercel.app/
+ * Find the latest source code at https://github.com/huybuidac/shadcn-datetime-picker
+ */
+import React, { useCallback, useEffect, useMemo, useRef, useState, } from "react";
+import { cn } from "../lib/utils";
+import { Clock, ChevronDownIcon, CheckIcon } from "lucide-react";
+import { format, parse, setHours, startOfHour, endOfHour, setMinutes, startOfMinute, endOfMinute, setSeconds, startOfDay, endOfDay, addHours, subHours, setMilliseconds, } from "date-fns";
+import { Button, Popover, PopoverContent, PopoverTrigger, ScrollArea, } from "../components/index.js";
+var AM_VALUE = 0;
+var PM_VALUE = 1;
+export function SimpleTimePicker(_a) {
+    var value = _a.value, onChange = _a.onChange, use12HourFormat = _a.use12HourFormat, min = _a.min, max = _a.max, disabled = _a.disabled, modal = _a.modal;
+    // hours24h = HH
+    // hours12h = hh
+    var formatStr = useMemo(function () {
+        return use12HourFormat
+            ? "yyyy-MM-dd hh:mm:ss.SSS a xxxx"
+            : "yyyy-MM-dd HH:mm:ss.SSS xxxx";
+    }, [use12HourFormat]);
+    var _b = useState(format(value, "a") === "AM" ? AM_VALUE : PM_VALUE), ampm = _b[0], setAmpm = _b[1];
+    var _c = useState(use12HourFormat ? +format(value, "hh") : value.getHours()), hour = _c[0], setHour = _c[1];
+    var _d = useState(value.getMinutes()), minute = _d[0], setMinute = _d[1];
+    var _e = useState(value.getSeconds()), second = _e[0], setSecond = _e[1];
+    useEffect(function () {
+        onChange(buildTime({
+            use12HourFormat: use12HourFormat,
+            value: value,
+            formatStr: formatStr,
+            hour: hour,
+            minute: minute,
+            second: second,
+            ampm: ampm,
+        }));
+    }, [hour, minute, second, ampm, formatStr, use12HourFormat]);
+    var _hourIn24h = useMemo(function () {
+        return use12HourFormat ? (hour % 12) + ampm * 12 : hour;
+    }, [hour, use12HourFormat, ampm]);
+    var hours = useMemo(function () {
+        return Array.from({ length: use12HourFormat ? 12 : 24 }, function (_, i) {
+            var disabled = false;
+            var hourValue = use12HourFormat ? (i === 0 ? 12 : i) : i;
+            var hDate = setHours(value, use12HourFormat ? i + ampm * 12 : i);
+            var hStart = startOfHour(hDate);
+            var hEnd = endOfHour(hDate);
+            if (min && hEnd < min)
+                disabled = true;
+            if (max && hStart > max)
+                disabled = true;
+            return {
+                value: hourValue,
+                label: hourValue.toString().padStart(2, "0"),
+                disabled: disabled,
+            };
+        });
+    }, [value, min, max, use12HourFormat, ampm]);
+    var minutes = useMemo(function () {
+        var anchorDate = setHours(value, _hourIn24h);
+        return Array.from({ length: 60 }, function (_, i) {
+            var disabled = false;
+            var mDate = setMinutes(anchorDate, i);
+            var mStart = startOfMinute(mDate);
+            var mEnd = endOfMinute(mDate);
+            if (min && mEnd < min)
+                disabled = true;
+            if (max && mStart > max)
+                disabled = true;
+            return {
+                value: i,
+                label: i.toString().padStart(2, "0"),
+                disabled: disabled,
+            };
+        });
+    }, [value, min, max, _hourIn24h]);
+    var seconds = useMemo(function () {
+        var anchorDate = setMilliseconds(setMinutes(setHours(value, _hourIn24h), minute), 0);
+        var _min = min ? setMilliseconds(min, 0) : undefined;
+        var _max = max ? setMilliseconds(max, 0) : undefined;
+        return Array.from({ length: 60 }, function (_, i) {
+            var disabled = false;
+            var sDate = setSeconds(anchorDate, i);
+            if (_min && sDate < _min)
+                disabled = true;
+            if (_max && sDate > _max)
+                disabled = true;
+            return {
+                value: i,
+                label: i.toString().padStart(2, "0"),
+                disabled: disabled,
+            };
+        });
+    }, [value, minute, min, max, _hourIn24h]);
+    var ampmOptions = useMemo(function () {
+        var startD = startOfDay(value);
+        var endD = endOfDay(value);
+        return [
+            { value: AM_VALUE, label: "AM" },
+            { value: PM_VALUE, label: "PM" },
+        ].map(function (v) {
+            var disabled = false;
+            var start = addHours(startD, v.value * 12);
+            var end = subHours(endD, (1 - v.value) * 12);
+            if (min && end < min)
+                disabled = true;
+            if (max && start > max)
+                disabled = true;
+            return __assign(__assign({}, v), { disabled: disabled });
+        });
+    }, [value, min, max]);
+    var _f = useState(false), open = _f[0], setOpen = _f[1];
+    var hourRef = useRef(null);
+    var minuteRef = useRef(null);
+    var secondRef = useRef(null);
+    useEffect(function () {
+        var timeoutId = setTimeout(function () {
+            var _a, _b, _c;
+            if (open) {
+                (_a = hourRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: "auto" });
+                (_b = minuteRef.current) === null || _b === void 0 ? void 0 : _b.scrollIntoView({ behavior: "auto" });
+                (_c = secondRef.current) === null || _c === void 0 ? void 0 : _c.scrollIntoView({ behavior: "auto" });
+            }
+        }, 1);
+        return function () { return clearTimeout(timeoutId); };
+    }, [open]);
+    var onHourChange = useCallback(function (v) {
+        if (min) {
+            var newTime = buildTime({
+                use12HourFormat: use12HourFormat,
+                value: value,
+                formatStr: formatStr,
+                hour: v.value,
+                minute: minute,
+                second: second,
+                ampm: ampm,
+            });
+            if (newTime < min) {
+                setMinute(min.getMinutes());
+                setSecond(min.getSeconds());
+            }
+        }
+        if (max) {
+            var newTime = buildTime({
+                use12HourFormat: use12HourFormat,
+                value: value,
+                formatStr: formatStr,
+                hour: v.value,
+                minute: minute,
+                second: second,
+                ampm: ampm,
+            });
+            if (newTime > max) {
+                setMinute(max.getMinutes());
+                setSecond(max.getSeconds());
+            }
+        }
+        setHour(v.value);
+    }, [setHour, use12HourFormat, value, formatStr, minute, second, ampm]);
+    var onMinuteChange = useCallback(function (v) {
+        if (min) {
+            var newTime = buildTime({
+                use12HourFormat: use12HourFormat,
+                value: value,
+                formatStr: formatStr,
+                hour: v.value,
+                minute: minute,
+                second: second,
+                ampm: ampm,
+            });
+            if (newTime < min) {
+                setSecond(min.getSeconds());
+            }
+        }
+        if (max) {
+            var newTime = buildTime({
+                use12HourFormat: use12HourFormat,
+                value: value,
+                formatStr: formatStr,
+                hour: v.value,
+                minute: minute,
+                second: second,
+                ampm: ampm,
+            });
+            if (newTime > max) {
+                setSecond(newTime.getSeconds());
+            }
+        }
+        setMinute(v.value);
+    }, [setMinute, use12HourFormat, value, formatStr, hour, second, ampm]);
+    var onAmpmChange = useCallback(function (v) {
+        if (min) {
+            var newTime = buildTime({
+                use12HourFormat: use12HourFormat,
+                value: value,
+                formatStr: formatStr,
+                hour: hour,
+                minute: minute,
+                second: second,
+                ampm: v.value,
+            });
+            if (newTime < min) {
+                var minH = min.getHours() % 12;
+                setHour(minH === 0 ? 12 : minH);
+                setMinute(min.getMinutes());
+                setSecond(min.getSeconds());
+            }
+        }
+        if (max) {
+            var newTime = buildTime({
+                use12HourFormat: use12HourFormat,
+                value: value,
+                formatStr: formatStr,
+                hour: hour,
+                minute: minute,
+                second: second,
+                ampm: v.value,
+            });
+            if (newTime > max) {
+                var maxH = max.getHours() % 12;
+                setHour(maxH === 0 ? 12 : maxH);
+                setMinute(max.getMinutes());
+                setSecond(max.getSeconds());
+            }
+        }
+        setAmpm(v.value);
+    }, [
+        setAmpm,
+        use12HourFormat,
+        value,
+        formatStr,
+        hour,
+        minute,
+        second,
+        min,
+        max,
+    ]);
+    var display = useMemo(function () {
+        return format(value, use12HourFormat ? "hh:mm:ss a" : "HH:mm:ss");
+    }, [value, use12HourFormat]);
+    return (React.createElement(Popover, { open: open, onOpenChange: setOpen, modal: modal },
+        React.createElement(PopoverTrigger, { asChild: true },
+            React.createElement("div", { role: "combobox", "aria-expanded": open, className: cn("flex h-9 px-3 items-center justify-between cursor-pointer font-normal border border-input rounded-md text-sm shadow-sm", disabled && "opacity-50 cursor-not-allowed"), tabIndex: 0 },
+                React.createElement(Clock, { className: "mr-2 size-4" }),
+                display,
+                React.createElement(ChevronDownIcon, { className: "ml-2 size-4 shrink-0 opacity-50" }))),
+        React.createElement(PopoverContent, { className: "p-0", side: "top" },
+            React.createElement("div", { className: "flex-col gap-2 p-2" },
+                React.createElement("div", { className: "flex h-56 grow" },
+                    React.createElement(ScrollArea, { className: "h-full flex-grow" },
+                        React.createElement("div", { className: "flex grow flex-col items-stretch overflow-y-auto pe-2 pb-48" }, hours.map(function (v) { return (React.createElement("div", { ref: v.value === hour ? hourRef : undefined, key: v.value },
+                            React.createElement(TimeItem, { option: v, selected: v.value === hour, onSelect: onHourChange, disabled: v.disabled, className: "h-8" }))); }))),
+                    React.createElement(ScrollArea, { className: "h-full flex-grow" },
+                        React.createElement("div", { className: "flex grow flex-col items-stretch overflow-y-auto pe-2 pb-48" }, minutes.map(function (v) { return (React.createElement("div", { ref: v.value === minute ? minuteRef : undefined, key: v.value },
+                            React.createElement(TimeItem, { option: v, selected: v.value === minute, onSelect: onMinuteChange, disabled: v.disabled, className: "h-8" }))); }))),
+                    React.createElement(ScrollArea, { className: "h-full flex-grow" },
+                        React.createElement("div", { className: "flex grow flex-col items-stretch overflow-y-auto pe-2 pb-48" }, seconds.map(function (v) { return (React.createElement("div", { ref: v.value === second ? secondRef : undefined, key: v.value },
+                            React.createElement(TimeItem, { option: v, selected: v.value === second, onSelect: function (v) { return setSecond(v.value); }, className: "h-8", disabled: v.disabled }))); }))),
+                    use12HourFormat && (React.createElement(ScrollArea, { className: "h-full flex-grow" },
+                        React.createElement("div", { className: "flex grow flex-col items-stretch overflow-y-auto pe-2" }, ampmOptions.map(function (v) { return (React.createElement(TimeItem, { key: v.value, option: v, selected: v.value === ampm, onSelect: onAmpmChange, className: "h-8", disabled: v.disabled })); })))))))));
+}
+var TimeItem = function (_a) {
+    var option = _a.option, selected = _a.selected, onSelect = _a.onSelect, className = _a.className, disabled = _a.disabled;
+    return (React.createElement(Button, { variant: "ghost", className: cn("flex justify-center px-1 pe-2 ps-1", className), onClick: function () { return onSelect(option); }, disabled: disabled },
+        React.createElement("div", { className: "w-4" }, selected && React.createElement(CheckIcon, { className: "my-auto size-4" })),
+        React.createElement("span", { className: "ms-2" }, option.label)));
+};
+function buildTime(options) {
+    var use12HourFormat = options.use12HourFormat, value = options.value, formatStr = options.formatStr, hour = options.hour, minute = options.minute, second = options.second, ampm = options.ampm;
+    var date;
+    if (use12HourFormat) {
+        var dateStrRaw = format(value, formatStr);
+        // yyyy-MM-dd hh:mm:ss.SSS a zzzz
+        // 2024-10-14 01:20:07.524 AM GMT+00:00
+        var dateStr = dateStrRaw.slice(0, 11) +
+            hour.toString().padStart(2, "0") +
+            dateStrRaw.slice(13);
+        dateStr =
+            dateStr.slice(0, 14) +
+                minute.toString().padStart(2, "0") +
+                dateStr.slice(16);
+        dateStr =
+            dateStr.slice(0, 17) +
+                second.toString().padStart(2, "0") +
+                dateStr.slice(19);
+        dateStr =
+            dateStr.slice(0, 24) +
+                (ampm == AM_VALUE ? "AM" : "PM") +
+                dateStr.slice(26);
+        date = parse(dateStr, formatStr, value);
+    }
+    else {
+        date = setHours(setMinutes(setSeconds(setMilliseconds(value, 0), second), minute), hour);
+    }
+    return date;
+}
+//# sourceMappingURL=SimpleTimePicker.js.map