@dmsi/wedgekit-react 0.0.490 → 0.0.492

package/dist/components/index.cjs

@@ -4245,6 +4245,7 @@ function CalendarRange({
   from,
   to,
   onChange,
+  onPendingFromChange,
   isDateAvailable,
   mode = "double",
   cardStyle = false,
@@ -4329,6 +4330,7 @@ function CalendarRange({
       setPendingFrom(date);
       setSelecting("to");
       setHoveredDate(void 0);
+      onPendingFromChange == null ? void 0 : onPendingFromChange(date.toString());
     } else if (pendingFrom) {
       if (onChange) {
         const [start, end] = import_polyfill.Temporal.PlainDate.compare(date, pendingFrom) < 0 ? [date, pendingFrom] : [pendingFrom, date];
@@ -7483,7 +7485,6 @@ function SimpleTable({
 var import_react36 = require("react");
 
 // src/components/PDFViewer/PDFElement.tsx
-var import_react_pdf2 = require("@mikecousins/react-pdf");
 var import_react35 = require("react");
 
 // src/components/Spinner.tsx
@@ -7517,17 +7518,17 @@ var Spinner = ({ size = "small", testid }) => {
 Spinner.displayName = "Spinner";
 
 // src/components/PDFViewer/PDFPage.tsx
-var import_react_pdf = require("@mikecousins/react-pdf");
 var import_react34 = require("react");
 var import_jsx_runtime55 = require("react/jsx-runtime");
 function PdfPage({
   file,
   pageNumber,
   testid,
-  isMobile
+  isMobile,
+  usePDF
 }) {
   const canvasRef = (0, import_react34.useRef)(null);
-  const { pdfDocument } = (0, import_react_pdf.usePdf)({
+  const { pdfDocument } = usePDF({
     file,
     page: pageNumber,
     canvasRef,
@@ -7553,10 +7554,35 @@ function PDFElement({
   testid,
   isMobile,
   error
+}) {
+  const [pdfHook, setPDFHook] = (0, import_react35.useState)(null);
+  (0, import_react35.useEffect)(() => {
+    import("@mikecousins/react-pdf").then((m) => setPDFHook(m.usePdf));
+  }, []);
+  if (pdfHook === null) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+    PDFElementInternal,
+    {
+      b64,
+      testid,
+      isMobile,
+      error,
+      usePDF: pdfHook
+    }
+  );
+}
+function PDFElementInternal({
+  b64,
+  testid,
+  isMobile,
+  error,
+  usePDF
 }) {
   var _a;
   const canvasRef = (0, import_react35.useRef)(null);
-  const { pdfDocument } = (0, import_react_pdf2.usePdf)({
+  const { pdfDocument } = usePDF({
     file: `data:application/pdf;base64,${b64}`,
     workerSrc: "/scripts/pdf.worker.min.mjs",
     scale: isMobile ? 1 : 1.3,
@@ -7581,6 +7607,7 @@ function PDFElement({
           children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
             PdfPage,
             {
+              usePDF,
               testid: testid ? `${testid}-pdf_page_${i + 1}` : void 0,
               file: `data:application/pdf;base64,${b64}`,
               pageNumber: i + 1
@@ -7713,6 +7740,10 @@ function PDFViewer(props) {
   } = props;
   const [currentIndex, setCurrentIndex] = (0, import_react36.useState)(0);
   const [isDownloading, setIsDownloading] = (0, import_react36.useState)(false);
+  const [isMounted, setIsMounted] = (0, import_react36.useState)(false);
+  (0, import_react36.useEffect)(() => {
+    setIsMounted(true);
+  }, []);
   const handleDownload = (0, import_react36.useCallback)(() => {
     setIsDownloading(true);
     const link = document.createElement("a");
@@ -7744,6 +7775,7 @@ function PDFViewer(props) {
     setIsDownloading(false);
     onClose();
   }
+  if (!isMounted) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
     Modal,
     {

package/dist/components/index.js

@@ -2,7 +2,7 @@ import {
   DataGrid,
   DateInput,
   MobileDataGrid
-} from "../chunk-WIDUWFLX.js";
+} from "../chunk-BYY2NTJH.js";
 import "../chunk-M7INAUAJ.js";
 import "../chunk-4Q7T4GJ2.js";
 import "../chunk-3DEYCNUE.js";
@@ -11,7 +11,7 @@ import {
 } from "../chunk-DYBJUTGK.js";
 import {
   PDFViewer
-} from "../chunk-24K4HHV5.js";
+} from "../chunk-TPBEID5X.js";
 import "../chunk-B53XDCLO.js";
 import "../chunk-MBZ55T2D.js";
 import "../chunk-2IKT6IHB.js";
@@ -24,8 +24,8 @@ import "../chunk-5IFPG6TS.js";
 import "../chunk-KW6V7O3H.js";
 import "../chunk-AJ5M6MVX.js";
 import "../chunk-JUFBGNWW.js";
-import "../chunk-YNKN6RKF.js";
-import "../chunk-VJVY6NPF.js";
+import "../chunk-YEZBNQZI.js";
+import "../chunk-S5ZJ3Q7P.js";
 import "../chunk-AT4AWD6B.js";
 import "../chunk-EWGHVZL5.js";
 import {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dmsi/wedgekit-react",
   "private": false,
-  "version": "0.0.490",
+  "version": "0.0.492",
   "type": "module",
   "scripts": {
     "build": "tsup",

package/src/components/CalendarRange.tsx

@@ -14,6 +14,7 @@ export interface CalendarRangeProps {
   from?: string | number;
   to?: string | number;
   onChange?: (from: string, to: string) => void;
+  onPendingFromChange?: (from: string) => void;
   isDateAvailable?: (date: Temporal.PlainDate) => boolean;
   /**
    * Display mode: 'single' for one month, 'double' for two months side by side (default)
@@ -141,6 +142,7 @@ export function CalendarRange({
   from,
   to,
   onChange,
+  onPendingFromChange,
   isDateAvailable,
   mode = "double",
   cardStyle = false,
@@ -249,6 +251,7 @@ export function CalendarRange({
       setPendingFrom(date);
       setSelecting("to");
       setHoveredDate(undefined);
+      onPendingFromChange?.(date.toString());
       // Hide current from/to selection when starting a new selection
     } else if (pendingFrom) {
       if (onChange) {

package/src/components/DateRangeInput.tsx

@@ -1,7 +1,7 @@
 import { useRef, useEffect, useState, useLayoutEffect } from "react";
 import { createPortal } from "react-dom";
 import { InputBaseProps, InputBase } from "./Input";
-import { CalendarRange } from "./CalendarRange";
+import { CalendarRange, CalendarRangeProps } from "./CalendarRange";
 import { Icon } from "./Icon";
 import { findDocumentRoot } from "../utils";
 import {
@@ -42,7 +42,7 @@ type DateRangeInputProps = Omit<InputBaseProps, "id"> & {
   disableRange?: boolean;
   readOnly?: boolean; // If true, input is read-only and cannot be focused
   label?: string; // Optional label for the input
-};
+} & Pick<CalendarRangeProps, "isDateAvailable" | "onPendingFromChange">;
 
 export const DateRangeInput = ({
   id,
@@ -55,6 +55,8 @@ export const DateRangeInput = ({
   single = false,
   disableRange = false,
   label,
+  isDateAvailable,
+  onPendingFromChange,
   ...props
 }: DateRangeInputProps) => {
   const [visible, setVisible] = useState(false);
@@ -626,6 +628,8 @@ export const DateRangeInput = ({
               cardStyle
               mode={single ? "single" : "double"}
               disableRange={disableRange}
+              isDateAvailable={isDateAvailable}
+              onPendingFromChange={onPendingFromChange}
             />
           </div>,
           findDocumentRoot(popoverRef.current),

package/src/components/PDFViewer/PDFElement.tsx

@@ -1,5 +1,6 @@
-import { usePdf } from "@mikecousins/react-pdf";
-import { useRef } from "react";
+"use client";
+import { type usePdf } from "@mikecousins/react-pdf";
+import { useEffect, useRef, useState } from "react";
 import { Spinner } from "../Spinner";
 import { Stack } from "../Stack";
 import { PdfPage } from "./PDFPage";
@@ -15,10 +16,43 @@ export function PDFElement({
   testid?: string;
   isMobile?: boolean;
   error?: React.ReactNode;
+}) {
+  const [pdfHook, setPDFHook] = useState<typeof usePdf | null>(null);
+  useEffect(() => {
+    import("@mikecousins/react-pdf").then((m) => setPDFHook(m.usePdf));
+  }, []);
+
+  if (pdfHook === null) {
+    return null;
+  }
+
+  return (
+    <PDFElementInternal
+      b64={b64}
+      testid={testid}
+      isMobile={isMobile}
+      error={error}
+      usePDF={pdfHook}
+    />
+  );
+}
+
+function PDFElementInternal({
+  b64,
+  testid,
+  isMobile,
+  error,
+  usePDF,
+}: {
+  b64: string;
+  testid?: string;
+  isMobile?: boolean;
+  error?: React.ReactNode;
+  usePDF: typeof usePdf;
 }) {
   const canvasRef = useRef<HTMLCanvasElement>(null);
 
-  const { pdfDocument } = usePdf({
+  const { pdfDocument } = usePDF({
     file: `data:application/pdf;base64,${b64}`,
     workerSrc: "/scripts/pdf.worker.min.mjs",
     scale: isMobile ? 1 : 1.3,
@@ -51,6 +85,7 @@ export function PDFElement({
                 )}
               >
                 <PdfPage
+                  usePDF={usePDF}
                   testid={testid ? `${testid}-pdf_page_${i + 1}` : undefined}
                   file={`data:application/pdf;base64,${b64}`}
                   pageNumber={i + 1}

package/src/components/PDFViewer/PDFPage.tsx

@@ -1,4 +1,4 @@
-import { usePdf } from "@mikecousins/react-pdf";
+import { type usePdf } from "@mikecousins/react-pdf";
 import { useRef } from "react";
 
 export function PdfPage({
@@ -6,15 +6,17 @@ export function PdfPage({
   pageNumber,
   testid,
   isMobile,
+  usePDF,
 }: {
   file: string;
   pageNumber: number;
   testid?: string;
   isMobile?: boolean;
+  usePDF: typeof usePdf;
 }) {
   const canvasRef = useRef<HTMLCanvasElement>(null);
 
-  const { pdfDocument } = usePdf({
+  const { pdfDocument } = usePDF({
     file,
     page: pageNumber,
     canvasRef,

package/src/components/PDFViewer/index.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useCallback, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
 import { Modal } from "../Modal";
 import { PDFElement } from "./PDFElement";
 import { DownloadIcon } from "./DownloadIcon";
@@ -35,6 +35,12 @@ export function PDFViewer(props: PDFViewerProps) {
   const [currentIndex, setCurrentIndex] = useState(0);
   const [isDownloading, setIsDownloading] = useState(false);
 
+  const [isMounted, setIsMounted] = useState(false);
+
+  useEffect(() => {
+    setIsMounted(true);
+  }, []);
+
   const handleDownload = useCallback(() => {
     setIsDownloading(true);
     const link = document.createElement("a");
@@ -73,6 +79,8 @@ export function PDFViewer(props: PDFViewerProps) {
     onClose();
   }
 
+  if (!isMounted) return null;
+
   return (
     <Modal
       testid={testid}