shad-m 1.0.0

package/dist/common/interactive/date-time-picker.mjs

@@ -0,0 +1,213 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { isBefore, isAfter, format } from 'date-fns';
+import { vi } from 'date-fns/locale';
+import { useState, useMemo, useCallback } from 'react';
+import { CloseCircleFilledIcon, CalendarOutlinedIcon } from '@/icons';
+import { Button } from '../../components/button';
+import { Calendar } from '../../components/calendar';
+import { Input } from '../../components/input';
+import { Popover, PopoverTrigger, PopoverContent } from '../../components/popover';
+import { ScrollArea } from '../../components/scroll-area';
+import { cn } from '../../lib/utils';
+
+function DateTimePicker({
+  value,
+  onChange,
+  use12HourFormat = false,
+  minDate,
+  maxDate,
+  minTime,
+  maxTime,
+  minuteStep = 30,
+  disabled,
+  modal,
+  placeholder = "Ch\u1ECDn ng\xE0y v\xE0 th\u1EDDi gian",
+  className,
+  error,
+  label,
+  helperText,
+  helperTextClass,
+  size = "default",
+  hasRemoveIcon = true,
+  onClearValue,
+  ...props
+}) {
+  const [open, setOpen] = useState(false);
+  const [selectedDate, setSelectedDate] = useState(value?.date);
+  const [selectedTime, setSelectedTime] = useState(value?.time);
+  const timeOptions = useMemo(() => {
+    const options = [];
+    for (let hour = 0; hour < 24; hour++) {
+      for (let minute = 0; minute < 60; minute += minuteStep) {
+        const timeString = `${hour.toString().padStart(2, "0")}:${minute.toString().padStart(2, "0")}`;
+        if (minTime || maxTime) {
+          const testDate = /* @__PURE__ */ new Date();
+          testDate.setHours(hour, minute, 0, 0);
+          if (minTime && isBefore(testDate, minTime)) continue;
+          if (maxTime && isAfter(testDate, maxTime)) continue;
+        }
+        options.push(timeString);
+      }
+    }
+    return options;
+  }, [minuteStep, minTime, maxTime]);
+  const formatTimeDisplay = useCallback(
+    (time) => {
+      if (!time || !use12HourFormat) return time;
+      const timeParts = time.split(":");
+      if (timeParts.length !== 2) return time;
+      const [hours, minutes] = timeParts;
+      if (!hours || !minutes) return time;
+      const hour = parseInt(hours, 10);
+      const ampm = hour >= 12 ? "PM" : "AM";
+      const displayHour = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour;
+      return `${displayHour}:${minutes} ${ampm}`;
+    },
+    [use12HourFormat]
+  );
+  const displayValue = useMemo(() => {
+    if (!selectedDate && !selectedTime) return "";
+    const parts = [];
+    if (selectedTime) {
+      parts.push(formatTimeDisplay(selectedTime));
+    }
+    if (selectedDate) {
+      parts.push(format(selectedDate, "dd/MM/yyyy", { locale: vi }));
+    }
+    return parts.join(" ");
+  }, [selectedDate, selectedTime, formatTimeDisplay]);
+  const handleDateSelect = useCallback(
+    (date) => {
+      setSelectedDate(date);
+      const newValue = {
+        date,
+        time: selectedTime
+      };
+      onChange(newValue);
+    },
+    [selectedTime, onChange]
+  );
+  const handleTimeSelect = useCallback(
+    (time) => {
+      setSelectedTime(time);
+      const newValue = {
+        date: selectedDate,
+        time
+      };
+      onChange(newValue);
+      if (selectedDate) {
+        setOpen(false);
+      }
+    },
+    [selectedDate, onChange]
+  );
+  const handleClearValue = useCallback(() => {
+    setSelectedDate(void 0);
+    setSelectedTime(void 0);
+    onChange({ date: void 0, time: void 0 });
+    onClearValue?.();
+  }, [onChange, onClearValue]);
+  const hasValue = !!(selectedDate || selectedTime);
+  const iconSizeClasses = {
+    default: "h-5 w-5",
+    lg: "h-5 w-5"
+  };
+  const buttonIcon = useMemo(
+    () => /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+      /* @__PURE__ */ jsx("div", { className: "mr-1 flex h-5 w-5 items-center justify-center", children: hasRemoveIcon && hasValue && !disabled && /* @__PURE__ */ jsx(
+        CloseCircleFilledIcon,
+        {
+          className: "input-remove-icon cursor-pointer hover:opacity-70",
+          onClick: handleClearValue
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        CalendarOutlinedIcon,
+        {
+          className: cn("cursor-pointer opacity-50 hover:opacity-70", iconSizeClasses[size]),
+          onClick: (e) => {
+            e.stopPropagation();
+            setOpen(true);
+          }
+        }
+      )
+    ] }),
+    [hasRemoveIcon, hasValue, disabled, handleClearValue, iconSizeClasses, size]
+  );
+  const isDateDisabled = useCallback(
+    (date) => {
+      if (minDate && date < minDate) return true;
+      if (maxDate && date > maxDate) return true;
+      return false;
+    },
+    [minDate, maxDate]
+  );
+  return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsxs(
+    Popover,
+    {
+      modal,
+      open: disabled ? false : open,
+      onOpenChange: disabled ? void 0 : setOpen,
+      children: [
+        /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx("div", { className: "w-full", children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            value: displayValue,
+            placeholder,
+            disabled,
+            isError: error,
+            label,
+            helpText: helperText,
+            helpTextClassName: helperTextClass,
+            size,
+            showRemoveIcon: false,
+            onClearValue: handleClearValue,
+            buttonIcon,
+            readOnly: true,
+            className: cn(
+              "border-input bg-background focus:border-primary rounded-md border focus:outline-none",
+              {
+                "border-destructive": error,
+                "cursor-pointer": !disabled
+              }
+            ),
+            onClick: () => setOpen(true),
+            ...props
+          }
+        ) }) }),
+        /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsxs("div", { className: "flex", children: [
+          /* @__PURE__ */ jsx("div", { className: "border-r", children: /* @__PURE__ */ jsx(
+            Calendar,
+            {
+              mode: "single",
+              selected: selectedDate,
+              onSelect: handleDateSelect,
+              disabled: isDateDisabled,
+              locale: vi,
+              className: "p-3",
+              autoFocus: false
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { className: "w-[88px]", children: [
+            /* @__PURE__ */ jsx("div", { className: "border-b p-3 py-4", children: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1 whitespace-nowrap text-sm font-medium", children: "Th\u1EDDi gian" }) }),
+            /* @__PURE__ */ jsx(ScrollArea, { className: "h-64", children: /* @__PURE__ */ jsx("div", { className: "p-1", children: timeOptions.map((time) => /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: selectedTime === time ? "default" : "ghost",
+                size: "sm",
+                className: "w-full justify-start font-normal",
+                onClick: () => handleTimeSelect(time),
+                children: formatTimeDisplay(time)
+              },
+              time
+            )) }) })
+          ] })
+        ] }) })
+      ]
+    }
+  ) });
+}
+
+export { DateTimePicker };
+//# sourceMappingURL=date-time-picker.mjs.map
+//# sourceMappingURL=date-time-picker.mjs.map

package/dist/common/interactive/date-time-picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/common/interactive/date-time-picker.tsx"],"names":["CalendarComponent"],"mappings":"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","file":"date-time-picker.mjs","sourcesContent":["'use client';\n\nimport { format, isAfter, isBefore } from 'date-fns';\nimport { vi } from 'date-fns/locale';\nimport { Calendar, Clock } from 'lucide-react';\nimport { useCallback, useMemo, useState } from 'react';\n\nimport { CalendarOutlinedIcon, ClockOutlinedIcon, CloseCircleFilledIcon } from '@/icons';\nimport { Button } from '../../components/button';\nimport { Calendar as CalendarComponent } from '../../components/calendar';\nimport { Input } from '../../components/input';\nimport { Popover, PopoverContent, PopoverTrigger } from '../../components/popover';\nimport { ScrollArea } from '../../components/scroll-area';\nimport { cn } from '../../lib/utils';\n\nexport interface DateTimePickerProps {\n  /**\n   * The selected date and time value\n   */\n  value?: {\n    date?: Date;\n    time?: string; // HH:mm format\n  };\n  /**\n   * Callback when date and time is selected\n   */\n  onChange: (value: { date?: Date; time?: string }) => void;\n  /**\n   * Use 12-hour format with AM/PM for time\n   */\n  use12HourFormat?: boolean;\n  /**\n   * Minimum selectable date\n   */\n  minDate?: Date;\n  /**\n   * Maximum selectable date\n   */\n  maxDate?: Date;\n  /**\n   * Minimum selectable time\n   */\n  minTime?: Date;\n  /**\n   * Maximum selectable time\n   */\n  maxTime?: Date;\n  /**\n   * Step interval for minutes (e.g., 15 for 15-minute intervals)\n   */\n  minuteStep?: number;\n  /**\n   * Whether the picker is disabled\n   */\n  disabled?: boolean;\n  /**\n   * Custom className for the component\n   */\n  className?: string;\n  /**\n   * Whether to render the popover as a modal\n   */\n  modal?: boolean;\n  /**\n   * Placeholder text for the input\n   */\n  placeholder?: string;\n  /**\n   * Error state\n   */\n  error?: boolean;\n  /**\n   * Label for the input\n   */\n  label?: string;\n  /**\n   * Helper text below the input\n   */\n  helperText?: string;\n  /**\n   * Custom className for helper text\n   */\n  helperTextClass?: string;\n  /**\n   * Size variant of the input\n   */\n  size?: 'default' | 'lg';\n  /**\n   * Whether to show remove icon when there's a value\n   */\n  hasRemoveIcon?: boolean;\n  /**\n   * Callback when clear button is clicked\n   */\n  onClearValue?: () => void;\n}\n\nexport function DateTimePicker({\n  value,\n  onChange,\n  use12HourFormat = false,\n  minDate,\n  maxDate,\n  minTime,\n  maxTime,\n  minuteStep = 30,\n  disabled,\n  modal,\n  placeholder = 'Chọn ngày và thời gian',\n  className,\n  error,\n  label,\n  helperText,\n  helperTextClass,\n  size = 'default',\n  hasRemoveIcon = true,\n  onClearValue,\n  ...props\n}: DateTimePickerProps) {\n  const [open, setOpen] = useState(false);\n  const [selectedDate, setSelectedDate] = useState<Date | undefined>(value?.date);\n  const [selectedTime, setSelectedTime] = useState<string | undefined>(value?.time);\n\n  // Generate time options based on minuteStep\n  const timeOptions = useMemo(() => {\n    const options: string[] = [];\n    for (let hour = 0; hour < 24; hour++) {\n      for (let minute = 0; minute < 60; minute += minuteStep) {\n        const timeString = `${hour.toString().padStart(2, '0')}:${minute.toString().padStart(2, '0')}`;\n\n        // Check time constraints if minTime or maxTime is provided\n        if (minTime || maxTime) {\n          const testDate = new Date();\n          testDate.setHours(hour, minute, 0, 0);\n\n          if (minTime && isBefore(testDate, minTime)) continue;\n          if (maxTime && isAfter(testDate, maxTime)) continue;\n        }\n\n        options.push(timeString);\n      }\n    }\n    return options;\n  }, [minuteStep, minTime, maxTime]);\n\n  const formatTimeDisplay = useCallback(\n    (time: string) => {\n      if (!time || !use12HourFormat) return time;\n\n      const timeParts = time.split(':');\n      if (timeParts.length !== 2) return time;\n\n      const [hours, minutes] = timeParts;\n      if (!hours || !minutes) return time;\n\n      const hour = parseInt(hours, 10);\n      const ampm = hour >= 12 ? 'PM' : 'AM';\n      const displayHour = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour;\n\n      return `${displayHour}:${minutes} ${ampm}`;\n    },\n    [use12HourFormat],\n  );\n\n  const displayValue = useMemo(() => {\n    if (!selectedDate && !selectedTime) return '';\n\n    const parts: string[] = [];\n\n    // Add time first, then date\n    if (selectedTime) {\n      parts.push(formatTimeDisplay(selectedTime));\n    }\n\n    if (selectedDate) {\n      parts.push(format(selectedDate, 'dd/MM/yyyy', { locale: vi }));\n    }\n\n    return parts.join(' ');\n  }, [selectedDate, selectedTime, formatTimeDisplay]);\n\n  const handleDateSelect = useCallback(\n    (date: Date | undefined) => {\n      setSelectedDate(date);\n      const newValue = {\n        date,\n        time: selectedTime,\n      };\n      onChange(newValue);\n    },\n    [selectedTime, onChange],\n  );\n\n  const handleTimeSelect = useCallback(\n    (time: string) => {\n      setSelectedTime(time);\n      const newValue = {\n        date: selectedDate,\n        time,\n      };\n      onChange(newValue);\n\n      // Close popover if both date and time are selected\n      if (selectedDate) {\n        setOpen(false);\n      }\n    },\n    [selectedDate, onChange],\n  );\n\n  const handleClearValue = useCallback(() => {\n    setSelectedDate(undefined);\n    setSelectedTime(undefined);\n    onChange({ date: undefined, time: undefined });\n    onClearValue?.();\n  }, [onChange, onClearValue]);\n\n  const hasValue = !!(selectedDate || selectedTime);\n\n  const iconSizeClasses = {\n    default: 'h-5 w-5',\n    lg: 'h-5 w-5',\n  };\n\n  const buttonIcon = useMemo(\n    () => (\n      <div className=\"flex items-center\">\n        {/* Always reserve space for remove icon to maintain consistent width */}\n        <div className=\"mr-1 flex h-5 w-5 items-center justify-center\">\n          {hasRemoveIcon && hasValue && !disabled && (\n            <CloseCircleFilledIcon\n              className=\"input-remove-icon cursor-pointer hover:opacity-70\"\n              onClick={handleClearValue}\n            />\n          )}\n        </div>\n        <CalendarOutlinedIcon\n          className={cn('cursor-pointer opacity-50 hover:opacity-70', iconSizeClasses[size])}\n          onClick={(e) => {\n            e.stopPropagation();\n            setOpen(true);\n          }}\n        />\n      </div>\n    ),\n    [hasRemoveIcon, hasValue, disabled, handleClearValue, iconSizeClasses, size],\n  );\n\n  const isDateDisabled = useCallback(\n    (date: Date) => {\n      if (minDate && date < minDate) return true;\n      if (maxDate && date > maxDate) return true;\n      return false;\n    },\n    [minDate, maxDate],\n  );\n\n  return (\n    <div className={cn('w-full', className)}>\n      <Popover\n        modal={modal}\n        open={disabled ? false : open}\n        onOpenChange={disabled ? undefined : setOpen}\n      >\n        <PopoverTrigger asChild>\n          <div className=\"w-full\">\n            <Input\n              value={displayValue}\n              placeholder={placeholder}\n              disabled={disabled}\n              isError={error}\n              label={label}\n              helpText={helperText}\n              helpTextClassName={helperTextClass}\n              size={size}\n              showRemoveIcon={false}\n              onClearValue={handleClearValue}\n              buttonIcon={buttonIcon}\n              readOnly\n              className={cn(\n                'border-input bg-background focus:border-primary rounded-md border focus:outline-none',\n                {\n                  'border-destructive': error,\n                  'cursor-pointer': !disabled,\n                },\n              )}\n              onClick={() => setOpen(true)}\n              {...props}\n            />\n          </div>\n        </PopoverTrigger>\n        <PopoverContent className=\"w-auto p-0\" align=\"start\">\n          <div className=\"flex\">\n            {/* Calendar Section */}\n            <div className=\"border-r\">\n              <CalendarComponent\n                mode=\"single\"\n                selected={selectedDate}\n                onSelect={handleDateSelect}\n                disabled={isDateDisabled}\n                locale={vi}\n                className=\"p-3\"\n                autoFocus={false}\n              />\n            </div>\n\n            {/* Time Picker Section */}\n            <div className=\"w-[88px]\">\n              <div className=\"border-b p-3 py-4\">\n                <div className=\"flex items-center gap-1 whitespace-nowrap text-sm font-medium\">\n                  Thời gian\n                </div>\n              </div>\n              <ScrollArea className=\"h-64\">\n                <div className=\"p-1\">\n                  {timeOptions.map((time) => (\n                    <Button\n                      key={time}\n                      variant={selectedTime === time ? 'default' : 'ghost'}\n                      size=\"sm\"\n                      className=\"w-full justify-start font-normal\"\n                      onClick={() => handleTimeSelect(time)}\n                    >\n                      {formatTimeDisplay(time)}\n                    </Button>\n                  ))}\n                </div>\n              </ScrollArea>\n            </div>\n          </div>\n        </PopoverContent>\n      </Popover>\n    </div>\n  );\n}\n"]}

package/dist/common/interactive/dialog-wrapper.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { DialogContent, dialogVariants, type VariantProps } from '../../components/dialog';
+interface DialogWrapperProps extends React.ComponentPropsWithoutRef<typeof DialogContent> {
+    trigger?: React.ReactNode;
+    triggerAsChild?: boolean;
+    triggerClassName?: string;
+    showHeader?: boolean;
+    title?: string;
+    titleClassName?: string;
+    description?: string;
+    descriptionClassName?: string;
+    headerClassName?: string;
+    headerContent?: React.ReactNode;
+    showFooter?: boolean;
+    footerContent?: React.ReactNode;
+    footerClassName?: string;
+    children?: React.ReactNode;
+    contentClassName?: string;
+    childrenClassName?: string;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    defaultOpen?: boolean;
+    modal?: boolean;
+    autoHeight?: boolean;
+    hasCloseButton?: boolean;
+    size?: VariantProps<typeof dialogVariants>['size'];
+    trackingNameView?: string;
+    trackingNameClose?: string;
+    trackingData?: Record<string, any>;
+    trackingIndex?: number;
+}
+declare const DialogWrapper: React.ForwardRefExoticComponent<DialogWrapperProps & React.RefAttributes<HTMLDivElement>>;
+export { DialogWrapper, type DialogWrapperProps };
+//# sourceMappingURL=dialog-wrapper.d.ts.map

package/dist/common/interactive/dialog-wrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-wrapper.d.ts","sourceRoot":"","sources":["../../../src/common/interactive/dialog-wrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAEL,aAAa,EAMb,cAAc,EACd,KAAK,YAAY,EAClB,MAAM,yBAAyB,CAAC;AAGjC,UAAU,kBAAmB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,aAAa,CAAC;IAEvF,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAG1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAGhC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,eAAe,CAAC,EAAE,MAAM,CAAC;IAGzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAG3B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,OAAO,CAAC;IAGhB,UAAU,CAAC,EAAE,OAAO,CAAC;IAGrB,cAAc,CAAC,EAAE,OAAO,CAAC;IAGzB,IAAI,CAAC,EAAE,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;IAGnD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,QAAA,MAAM,aAAa,2FA0IlB,CAAC;AAIF,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,CAAC"}

package/dist/common/interactive/dialog-wrapper.js

@@ -0,0 +1,124 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var useDevice = require('@/hooks/useDevice');
+var utils = require('@/lib/utils');
+var dialog = require('../../components/dialog');
+var scrollArea = require('../../components/scroll-area');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+const DialogWrapper = React__namespace.forwardRef(
+  ({
+    // Trigger props
+    trigger,
+    triggerAsChild = false,
+    triggerClassName,
+    // Header props
+    showHeader = true,
+    title,
+    titleClassName,
+    description,
+    descriptionClassName,
+    headerClassName,
+    headerContent,
+    // Footer props
+    showFooter = false,
+    footerContent,
+    footerClassName,
+    // Content props
+    children,
+    contentClassName,
+    childrenClassName,
+    // Dialog behavior props
+    open,
+    onOpenChange,
+    defaultOpen,
+    modal,
+    // ScrollArea props
+    autoHeight = true,
+    // Close button props
+    hasCloseButton = true,
+    // Size variants
+    size = "lg",
+    // Tracking props
+    trackingNameView,
+    trackingNameClose,
+    trackingData,
+    trackingIndex,
+    // Other props
+    className,
+    ...props
+  }, ref) => {
+    const { isDesktop } = useDevice.useDevice();
+    const effectiveAutoHeight = autoHeight && isDesktop;
+    const contentComponent = effectiveAutoHeight ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("h-full overflow-y-auto px-4 py-2 pb-4", childrenClassName), children }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full min-h-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(scrollArea.ScrollArea, { className: "h-full w-full", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("h-full px-4", childrenClassName), children }) }) });
+    return /* @__PURE__ */ jsxRuntime.jsxs(dialog.Dialog, { open, onOpenChange, defaultOpen, modal, children: [
+      trigger && /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTrigger, { asChild: triggerAsChild, className: triggerClassName, children: trigger }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        dialog.DialogContent,
+        {
+          ref,
+          hasCloseButton,
+          size,
+          trackingNameView,
+          trackingNameClose,
+          trackingData,
+          trackingIndex,
+          className: utils.cn(
+            "flex flex-col p-0",
+            // For autoHeight dialogs on desktop, handle max-height
+            effectiveAutoHeight && "max-h-full lg:max-h-[88vh]",
+            // Default height for non-full size dialogs or mobile/tablet
+            !effectiveAutoHeight && size !== "full" && "h-full lg:h-[500px]",
+            className,
+            contentClassName
+          ),
+          ...props,
+          children: [
+            !showHeader && title && /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTitle, { className: "sr-only", children: title }),
+            showHeader && (title || description || headerContent) && /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogHeader, { className: utils.cn("flex-shrink-0", headerClassName), children: headerContent ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTitle, { className: "sr-only", children: "Title" }),
+              headerContent
+            ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              title ? /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTitle, { className: titleClassName, children: title }) : /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTitle, { className: "sr-only", children: "Title" }),
+              description && /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogDescription, { className: descriptionClassName, children: description })
+            ] }) }),
+            contentComponent,
+            showFooter && footerContent && /* @__PURE__ */ jsxRuntime.jsx(
+              dialog.DialogFooter,
+              {
+                className: utils.cn("border-border mt-4 flex-shrink-0 border-t p-4", footerClassName),
+                children: footerContent
+              }
+            )
+          ]
+        }
+      )
+    ] });
+  }
+);
+DialogWrapper.displayName = "DialogWrapper";
+
+exports.DialogWrapper = DialogWrapper;
+//# sourceMappingURL=dialog-wrapper.js.map
+//# sourceMappingURL=dialog-wrapper.js.map

package/dist/common/interactive/dialog-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/common/interactive/dialog-wrapper.tsx"],"names":["React","useDevice","jsx","cn","ScrollArea","jsxs","Dialog","DialogTrigger","DialogContent","DialogTitle","DialogHeader","Fragment","DialogDescription","DialogFooter"],"mappings":"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","file":"dialog-wrapper.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { useDevice } from '@/hooks/useDevice';\nimport { cn } from '@/lib/utils';\nimport { TrackingPropsType } from '@/lib/types';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n  dialogVariants,\n  type VariantProps,\n} from '../../components/dialog';\nimport { ScrollArea } from '../../components/scroll-area';\n\ninterface DialogWrapperProps extends React.ComponentPropsWithoutRef<typeof DialogContent> {\n  // Trigger props\n  trigger?: React.ReactNode;\n  triggerAsChild?: boolean;\n  triggerClassName?: string;\n\n  // Header props\n  showHeader?: boolean;\n  title?: string;\n  titleClassName?: string;\n  description?: string;\n  descriptionClassName?: string;\n  headerClassName?: string;\n  headerContent?: React.ReactNode;\n\n  // Footer props\n  showFooter?: boolean;\n  footerContent?: React.ReactNode;\n  footerClassName?: string;\n\n  // Content props\n  children?: React.ReactNode;\n  contentClassName?: string;\n  childrenClassName?: string;\n\n  // Dialog behavior props\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  defaultOpen?: boolean;\n  modal?: boolean;\n\n  // ScrollArea props\n  autoHeight?: boolean;\n\n  // Close button props\n  hasCloseButton?: boolean;\n\n  // Size variants\n  size?: VariantProps<typeof dialogVariants>['size'];\n\n  // Tracking props\n  trackingNameView?: string;\n  trackingNameClose?: string;\n  trackingData?: Record<string, any>;\n  trackingIndex?: number;\n}\n\nconst DialogWrapper = React.forwardRef<React.ElementRef<typeof DialogContent>, DialogWrapperProps>(\n  (\n    {\n      // Trigger props\n      trigger,\n      triggerAsChild = false,\n      triggerClassName,\n\n      // Header props\n      showHeader = true,\n      title,\n      titleClassName,\n      description,\n      descriptionClassName,\n      headerClassName,\n      headerContent,\n\n      // Footer props\n      showFooter = false,\n      footerContent,\n      footerClassName,\n\n      // Content props\n      children,\n      contentClassName,\n      childrenClassName,\n\n      // Dialog behavior props\n      open,\n      onOpenChange,\n      defaultOpen,\n      modal,\n\n      // ScrollArea props\n      autoHeight = true,\n\n      // Close button props\n      hasCloseButton = true,\n\n      // Size variants\n      size = 'lg',\n\n      // Tracking props\n      trackingNameView,\n      trackingNameClose,\n      trackingData,\n      trackingIndex,\n\n      // Other props\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { isDesktop } = useDevice();\n\n    // autoHeight only works on desktop, mobile/tablet always use ScrollArea (full screen)\n    const effectiveAutoHeight = autoHeight && isDesktop;\n\n    const contentComponent = effectiveAutoHeight ? (\n      <div className={cn('h-full overflow-y-auto px-4 py-2 pb-4', childrenClassName)}>\n        {children}\n      </div>\n    ) : (\n      <div className=\"h-full min-h-0 flex-1\">\n        <ScrollArea className=\"h-full w-full\">\n          <div className={cn('h-full px-4', childrenClassName)}>{children}</div>\n        </ScrollArea>\n      </div>\n    );\n\n    return (\n      <Dialog open={open} onOpenChange={onOpenChange} defaultOpen={defaultOpen} modal={modal}>\n        {trigger && (\n          <DialogTrigger asChild={triggerAsChild} className={triggerClassName}>\n            {trigger}\n          </DialogTrigger>\n        )}\n\n        <DialogContent\n          ref={ref}\n          hasCloseButton={hasCloseButton}\n          size={size}\n          trackingNameView={trackingNameView}\n          trackingNameClose={trackingNameClose}\n          trackingData={trackingData}\n          trackingIndex={trackingIndex}\n          className={cn(\n            'flex flex-col p-0',\n            // For autoHeight dialogs on desktop, handle max-height\n            effectiveAutoHeight && 'max-h-full lg:max-h-[88vh]',\n            // Default height for non-full size dialogs or mobile/tablet\n            !effectiveAutoHeight && size !== 'full' && 'h-full lg:h-[500px]',\n            className,\n            contentClassName,\n          )}\n          {...props}\n        >\n          {/* Always include DialogTitle for accessibility */}\n          {!showHeader && title && <DialogTitle className=\"sr-only\">{title}</DialogTitle>}\n\n          {showHeader && (title || description || headerContent) && (\n            <DialogHeader className={cn('flex-shrink-0', headerClassName)}>\n              {headerContent ? (\n                <>\n                  <DialogTitle className=\"sr-only\">Title</DialogTitle>\n                  {headerContent}\n                </>\n              ) : (\n                <>\n                  {title ? (\n                    <DialogTitle className={titleClassName}>{title}</DialogTitle>\n                  ) : (\n                    <DialogTitle className=\"sr-only\">Title</DialogTitle>\n                  )}\n                  {description && (\n                    <DialogDescription className={descriptionClassName}>\n                      {description}\n                    </DialogDescription>\n                  )}\n                </>\n              )}\n            </DialogHeader>\n          )}\n\n          {contentComponent}\n\n          {showFooter && footerContent && (\n            <DialogFooter\n              className={cn('border-border mt-4 flex-shrink-0 border-t p-4', footerClassName)}\n            >\n              {footerContent}\n            </DialogFooter>\n          )}\n        </DialogContent>\n      </Dialog>\n    );\n  },\n);\n\nDialogWrapper.displayName = 'DialogWrapper';\n\nexport { DialogWrapper, type DialogWrapperProps };\n"]}

package/dist/common/interactive/dialog-wrapper.mjs

@@ -0,0 +1,102 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useDevice } from '@/hooks/useDevice';
+import { cn } from '@/lib/utils';
+import { Dialog, DialogTrigger, DialogContent, DialogTitle, DialogHeader, DialogDescription, DialogFooter } from '../../components/dialog';
+import { ScrollArea } from '../../components/scroll-area';
+
+const DialogWrapper = React.forwardRef(
+  ({
+    // Trigger props
+    trigger,
+    triggerAsChild = false,
+    triggerClassName,
+    // Header props
+    showHeader = true,
+    title,
+    titleClassName,
+    description,
+    descriptionClassName,
+    headerClassName,
+    headerContent,
+    // Footer props
+    showFooter = false,
+    footerContent,
+    footerClassName,
+    // Content props
+    children,
+    contentClassName,
+    childrenClassName,
+    // Dialog behavior props
+    open,
+    onOpenChange,
+    defaultOpen,
+    modal,
+    // ScrollArea props
+    autoHeight = true,
+    // Close button props
+    hasCloseButton = true,
+    // Size variants
+    size = "lg",
+    // Tracking props
+    trackingNameView,
+    trackingNameClose,
+    trackingData,
+    trackingIndex,
+    // Other props
+    className,
+    ...props
+  }, ref) => {
+    const { isDesktop } = useDevice();
+    const effectiveAutoHeight = autoHeight && isDesktop;
+    const contentComponent = effectiveAutoHeight ? /* @__PURE__ */ jsx("div", { className: cn("h-full overflow-y-auto px-4 py-2 pb-4", childrenClassName), children }) : /* @__PURE__ */ jsx("div", { className: "h-full min-h-0 flex-1", children: /* @__PURE__ */ jsx(ScrollArea, { className: "h-full w-full", children: /* @__PURE__ */ jsx("div", { className: cn("h-full px-4", childrenClassName), children }) }) });
+    return /* @__PURE__ */ jsxs(Dialog, { open, onOpenChange, defaultOpen, modal, children: [
+      trigger && /* @__PURE__ */ jsx(DialogTrigger, { asChild: triggerAsChild, className: triggerClassName, children: trigger }),
+      /* @__PURE__ */ jsxs(
+        DialogContent,
+        {
+          ref,
+          hasCloseButton,
+          size,
+          trackingNameView,
+          trackingNameClose,
+          trackingData,
+          trackingIndex,
+          className: cn(
+            "flex flex-col p-0",
+            // For autoHeight dialogs on desktop, handle max-height
+            effectiveAutoHeight && "max-h-full lg:max-h-[88vh]",
+            // Default height for non-full size dialogs or mobile/tablet
+            !effectiveAutoHeight && size !== "full" && "h-full lg:h-[500px]",
+            className,
+            contentClassName
+          ),
+          ...props,
+          children: [
+            !showHeader && title && /* @__PURE__ */ jsx(DialogTitle, { className: "sr-only", children: title }),
+            showHeader && (title || description || headerContent) && /* @__PURE__ */ jsx(DialogHeader, { className: cn("flex-shrink-0", headerClassName), children: headerContent ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(DialogTitle, { className: "sr-only", children: "Title" }),
+              headerContent
+            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              title ? /* @__PURE__ */ jsx(DialogTitle, { className: titleClassName, children: title }) : /* @__PURE__ */ jsx(DialogTitle, { className: "sr-only", children: "Title" }),
+              description && /* @__PURE__ */ jsx(DialogDescription, { className: descriptionClassName, children: description })
+            ] }) }),
+            contentComponent,
+            showFooter && footerContent && /* @__PURE__ */ jsx(
+              DialogFooter,
+              {
+                className: cn("border-border mt-4 flex-shrink-0 border-t p-4", footerClassName),
+                children: footerContent
+              }
+            )
+          ]
+        }
+      )
+    ] });
+  }
+);
+DialogWrapper.displayName = "DialogWrapper";
+
+export { DialogWrapper };
+//# sourceMappingURL=dialog-wrapper.mjs.map
+//# sourceMappingURL=dialog-wrapper.mjs.map

package/dist/common/interactive/dialog-wrapper.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/common/interactive/dialog-wrapper.tsx"],"names":[],"mappings":"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","file":"dialog-wrapper.mjs","sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { useDevice } from '@/hooks/useDevice';\nimport { cn } from '@/lib/utils';\nimport { TrackingPropsType } from '@/lib/types';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n  dialogVariants,\n  type VariantProps,\n} from '../../components/dialog';\nimport { ScrollArea } from '../../components/scroll-area';\n\ninterface DialogWrapperProps extends React.ComponentPropsWithoutRef<typeof DialogContent> {\n  // Trigger props\n  trigger?: React.ReactNode;\n  triggerAsChild?: boolean;\n  triggerClassName?: string;\n\n  // Header props\n  showHeader?: boolean;\n  title?: string;\n  titleClassName?: string;\n  description?: string;\n  descriptionClassName?: string;\n  headerClassName?: string;\n  headerContent?: React.ReactNode;\n\n  // Footer props\n  showFooter?: boolean;\n  footerContent?: React.ReactNode;\n  footerClassName?: string;\n\n  // Content props\n  children?: React.ReactNode;\n  contentClassName?: string;\n  childrenClassName?: string;\n\n  // Dialog behavior props\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  defaultOpen?: boolean;\n  modal?: boolean;\n\n  // ScrollArea props\n  autoHeight?: boolean;\n\n  // Close button props\n  hasCloseButton?: boolean;\n\n  // Size variants\n  size?: VariantProps<typeof dialogVariants>['size'];\n\n  // Tracking props\n  trackingNameView?: string;\n  trackingNameClose?: string;\n  trackingData?: Record<string, any>;\n  trackingIndex?: number;\n}\n\nconst DialogWrapper = React.forwardRef<React.ElementRef<typeof DialogContent>, DialogWrapperProps>(\n  (\n    {\n      // Trigger props\n      trigger,\n      triggerAsChild = false,\n      triggerClassName,\n\n      // Header props\n      showHeader = true,\n      title,\n      titleClassName,\n      description,\n      descriptionClassName,\n      headerClassName,\n      headerContent,\n\n      // Footer props\n      showFooter = false,\n      footerContent,\n      footerClassName,\n\n      // Content props\n      children,\n      contentClassName,\n      childrenClassName,\n\n      // Dialog behavior props\n      open,\n      onOpenChange,\n      defaultOpen,\n      modal,\n\n      // ScrollArea props\n      autoHeight = true,\n\n      // Close button props\n      hasCloseButton = true,\n\n      // Size variants\n      size = 'lg',\n\n      // Tracking props\n      trackingNameView,\n      trackingNameClose,\n      trackingData,\n      trackingIndex,\n\n      // Other props\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { isDesktop } = useDevice();\n\n    // autoHeight only works on desktop, mobile/tablet always use ScrollArea (full screen)\n    const effectiveAutoHeight = autoHeight && isDesktop;\n\n    const contentComponent = effectiveAutoHeight ? (\n      <div className={cn('h-full overflow-y-auto px-4 py-2 pb-4', childrenClassName)}>\n        {children}\n      </div>\n    ) : (\n      <div className=\"h-full min-h-0 flex-1\">\n        <ScrollArea className=\"h-full w-full\">\n          <div className={cn('h-full px-4', childrenClassName)}>{children}</div>\n        </ScrollArea>\n      </div>\n    );\n\n    return (\n      <Dialog open={open} onOpenChange={onOpenChange} defaultOpen={defaultOpen} modal={modal}>\n        {trigger && (\n          <DialogTrigger asChild={triggerAsChild} className={triggerClassName}>\n            {trigger}\n          </DialogTrigger>\n        )}\n\n        <DialogContent\n          ref={ref}\n          hasCloseButton={hasCloseButton}\n          size={size}\n          trackingNameView={trackingNameView}\n          trackingNameClose={trackingNameClose}\n          trackingData={trackingData}\n          trackingIndex={trackingIndex}\n          className={cn(\n            'flex flex-col p-0',\n            // For autoHeight dialogs on desktop, handle max-height\n            effectiveAutoHeight && 'max-h-full lg:max-h-[88vh]',\n            // Default height for non-full size dialogs or mobile/tablet\n            !effectiveAutoHeight && size !== 'full' && 'h-full lg:h-[500px]',\n            className,\n            contentClassName,\n          )}\n          {...props}\n        >\n          {/* Always include DialogTitle for accessibility */}\n          {!showHeader && title && <DialogTitle className=\"sr-only\">{title}</DialogTitle>}\n\n          {showHeader && (title || description || headerContent) && (\n            <DialogHeader className={cn('flex-shrink-0', headerClassName)}>\n              {headerContent ? (\n                <>\n                  <DialogTitle className=\"sr-only\">Title</DialogTitle>\n                  {headerContent}\n                </>\n              ) : (\n                <>\n                  {title ? (\n                    <DialogTitle className={titleClassName}>{title}</DialogTitle>\n                  ) : (\n                    <DialogTitle className=\"sr-only\">Title</DialogTitle>\n                  )}\n                  {description && (\n                    <DialogDescription className={descriptionClassName}>\n                      {description}\n                    </DialogDescription>\n                  )}\n                </>\n              )}\n            </DialogHeader>\n          )}\n\n          {contentComponent}\n\n          {showFooter && footerContent && (\n            <DialogFooter\n              className={cn('border-border mt-4 flex-shrink-0 border-t p-4', footerClassName)}\n            >\n              {footerContent}\n            </DialogFooter>\n          )}\n        </DialogContent>\n      </Dialog>\n    );\n  },\n);\n\nDialogWrapper.displayName = 'DialogWrapper';\n\nexport { DialogWrapper, type DialogWrapperProps };\n"]}

package/dist/common/interactive/filter.d.ts

@@ -0,0 +1,51 @@
+import React, { Dispatch, SetStateAction } from 'react';
+type FilterPosition = 'fixed' | 'advanced';
+interface FilterElementType {
+    isAdvanced?: boolean;
+}
+interface FilterItemData {
+    id: string;
+    position: FilterPosition[];
+    element: (props: FilterElementType) => React.ReactNode;
+    groupId?: string;
+}
+interface FilterContextType {
+    advancedFiltersOpen: boolean;
+    setAdvancedFiltersOpen: (open: boolean) => void;
+    registerFilter: (filterItem: FilterItemData) => void;
+    unregisterFilter: (id: string) => void;
+    values: Record<string, any>;
+    setValues: (values: Record<string, any>, apply?: boolean) => void;
+    value?: any;
+    setValue?: (values: any) => void;
+    setFixedFilterFields: Dispatch<SetStateAction<string[]>>;
+    setAdvancedFilterFields: Dispatch<SetStateAction<string[]>>;
+}
+interface FilterProps {
+    children: React.ReactElement | React.ReactElement[] | ((context: FilterContextType) => React.ReactNode);
+    className?: string;
+    onApply?: (filters: Record<string, any>) => void;
+    initFilters?: Record<string, any>;
+    filters?: Record<string, any>;
+    buttonFilter?: React.ReactElement | ((context: any) => React.ReactNode);
+    disableAutoApply?: boolean;
+}
+interface FilterItemChildrenProps extends FilterContextType {
+    isAdvanced?: boolean;
+}
+interface FilterItemProps {
+    position: FilterPosition[];
+    children: React.ReactElement | ((context: FilterItemChildrenProps) => React.ReactNode);
+    label?: string;
+    className?: string;
+    id?: string;
+    name?: string;
+    filterFields: string[];
+    layout?: 'vertical' | 'horizontal';
+    renderValue?: (context: FilterItemChildrenProps) => React.ReactNode;
+    groupId?: string;
+}
+export declare function Filter({ children, className, onApply, initFilters, filters, buttonFilter, disableAutoApply, }: FilterProps): import("react/jsx-runtime").JSX.Element;
+export declare function FilterItem({ position, children, label, className, id, name, filterFields, layout, renderValue, groupId, }: FilterItemProps): null;
+export {};
+//# sourceMappingURL=filter.d.ts.map

package/dist/common/interactive/filter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter.d.ts","sourceRoot":"","sources":["../../../src/common/interactive/filter.tsx"],"names":[],"mappings":"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"}