@osdk/react-components 0.2.0-beta.9 → 0.2.1-main-20260407074313

package/build/esm/pdf-viewer/components/PdfViewerSidebar.js

@@ -0,0 +1,78 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { useVirtualizer } from "@tanstack/react-virtual";
+import React, { useEffect, useRef } from "react";
+import { DEFAULT_PAGE_HEIGHT, THUMBNAIL_GAP, THUMBNAIL_SCALE } from "../constants.js";
+import styles from "./PdfViewerSidebar.module.css";
+import { PdfViewerSidebarHeader } from "./PdfViewerSidebarHeader.js";
+import { PdfViewerThumbnail } from "./PdfViewerThumbnail.js";
+export function PdfViewerSidebar({
+  document,
+  numPages,
+  currentPage,
+  onPageClick,
+  sidebarMode,
+  onSidebarModeChange
+}) {
+  const scrollContainerRef = useRef(null);
+  const estimatedItemHeight = Math.floor(DEFAULT_PAGE_HEIGHT * THUMBNAIL_SCALE) + THUMBNAIL_GAP + 20;
+  const virtualizer = useVirtualizer({
+    count: numPages,
+    getScrollElement: () => scrollContainerRef.current,
+    estimateSize: () => estimatedItemHeight,
+    overscan: 2
+  });
+
+  // Auto-scroll to keep the active thumbnail visible
+  useEffect(function () {
+    virtualizer.scrollToIndex(currentPage - 1, {
+      align: "auto"
+    });
+  }, [currentPage, virtualizer]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.sidebar
+  }, /*#__PURE__*/React.createElement(PdfViewerSidebarHeader, {
+    sidebarMode: sidebarMode,
+    onSidebarModeChange: onSidebarModeChange
+  }), /*#__PURE__*/React.createElement("div", {
+    ref: scrollContainerRef,
+    className: styles.scrollContainer
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.thumbnailsContainer,
+    style: {
+      height: virtualizer.getTotalSize()
+    }
+  }, virtualizer.getVirtualItems().map(virtualItem => {
+    const pageNumber = virtualItem.index + 1;
+    return /*#__PURE__*/React.createElement("div", {
+      key: virtualItem.key,
+      className: styles.thumbnailWrapper,
+      style: {
+        top: virtualItem.start,
+        height: virtualItem.size
+      }
+    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(PdfViewerThumbnail, {
+      document: document,
+      pageNumber: pageNumber,
+      isActive: pageNumber === currentPage,
+      onClick: () => onPageClick(pageNumber)
+    }), /*#__PURE__*/React.createElement("div", {
+      className: styles.pageNumber
+    }, pageNumber)));
+  }))));
+}
+//# sourceMappingURL=PdfViewerSidebar.js.map

package/build/esm/pdf-viewer/components/PdfViewerSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PdfViewerSidebar.js","names":["useVirtualizer","React","useEffect","useRef","DEFAULT_PAGE_HEIGHT","THUMBNAIL_GAP","THUMBNAIL_SCALE","styles","PdfViewerSidebarHeader","PdfViewerThumbnail","PdfViewerSidebar","document","numPages","currentPage","onPageClick","sidebarMode","onSidebarModeChange","scrollContainerRef","estimatedItemHeight","Math","floor","virtualizer","count","getScrollElement","current","estimateSize","overscan","scrollToIndex","align","createElement","className","sidebar","ref","scrollContainer","thumbnailsContainer","style","height","getTotalSize","getVirtualItems","map","virtualItem","pageNumber","index","key","thumbnailWrapper","top","start","size","isActive","onClick"],"sources":["PdfViewerSidebar.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useVirtualizer } from \"@tanstack/react-virtual\";\nimport type { PDFDocumentProxy } from \"pdfjs-dist\";\nimport React, { useEffect, useRef } from \"react\";\nimport {\n  DEFAULT_PAGE_HEIGHT,\n  THUMBNAIL_GAP,\n  THUMBNAIL_SCALE,\n} from \"../constants.js\";\nimport type { SidebarMode } from \"../types.js\";\nimport styles from \"./PdfViewerSidebar.module.css\";\nimport { PdfViewerSidebarHeader } from \"./PdfViewerSidebarHeader.js\";\nimport { PdfViewerThumbnail } from \"./PdfViewerThumbnail.js\";\n\nexport interface PdfViewerSidebarProps {\n  document: PDFDocumentProxy;\n  numPages: number;\n  currentPage: number;\n  onPageClick: (page: number) => void;\n  sidebarMode: SidebarMode;\n  onSidebarModeChange: (mode: SidebarMode) => void;\n}\n\nexport function PdfViewerSidebar({\n  document,\n  numPages,\n  currentPage,\n  onPageClick,\n  sidebarMode,\n  onSidebarModeChange,\n}: PdfViewerSidebarProps): React.ReactElement {\n  const scrollContainerRef = useRef<HTMLDivElement>(null);\n  const estimatedItemHeight = Math.floor(DEFAULT_PAGE_HEIGHT * THUMBNAIL_SCALE)\n    + THUMBNAIL_GAP + 20;\n\n  const virtualizer = useVirtualizer({\n    count: numPages,\n    getScrollElement: () => scrollContainerRef.current,\n    estimateSize: () => estimatedItemHeight,\n    overscan: 2,\n  });\n\n  // Auto-scroll to keep the active thumbnail visible\n  useEffect(function syncActiveThumbnail() {\n    virtualizer.scrollToIndex(currentPage - 1, { align: \"auto\" });\n  }, [currentPage, virtualizer]);\n\n  return (\n    <div className={styles.sidebar}>\n      <PdfViewerSidebarHeader\n        sidebarMode={sidebarMode}\n        onSidebarModeChange={onSidebarModeChange}\n      />\n      <div ref={scrollContainerRef} className={styles.scrollContainer}>\n        <div\n          className={styles.thumbnailsContainer}\n          style={{ height: virtualizer.getTotalSize() }}\n        >\n          {virtualizer.getVirtualItems().map((virtualItem) => {\n            const pageNumber = virtualItem.index + 1;\n            return (\n              <div\n                key={virtualItem.key}\n                className={styles.thumbnailWrapper}\n                style={{\n                  top: virtualItem.start,\n                  height: virtualItem.size,\n                }}\n              >\n                <div>\n                  <PdfViewerThumbnail\n                    document={document}\n                    pageNumber={pageNumber}\n                    isActive={pageNumber === currentPage}\n                    onClick={() => onPageClick(pageNumber)}\n                  />\n                  <div className={styles.pageNumber}>{pageNumber}</div>\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,cAAc,QAAQ,yBAAyB;AAExD,OAAOC,KAAK,IAAIC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAChD,SACEC,mBAAmB,EACnBC,aAAa,EACbC,eAAe,QACV,iBAAiB;AAExB,OAAOC,MAAM,MAAM,+BAA+B;AAClD,SAASC,sBAAsB,QAAQ,6BAA6B;AACpE,SAASC,kBAAkB,QAAQ,yBAAyB;AAW5D,OAAO,SAASC,gBAAgBA,CAAC;EAC/BC,QAAQ;EACRC,QAAQ;EACRC,WAAW;EACXC,WAAW;EACXC,WAAW;EACXC;AACqB,CAAC,EAAsB;EAC5C,MAAMC,kBAAkB,GAAGd,MAAM,CAAiB,IAAI,CAAC;EACvD,MAAMe,mBAAmB,GAAGC,IAAI,CAACC,KAAK,CAAChB,mBAAmB,GAAGE,eAAe,CAAC,GACzED,aAAa,GAAG,EAAE;EAEtB,MAAMgB,WAAW,GAAGrB,cAAc,CAAC;IACjCsB,KAAK,EAAEV,QAAQ;IACfW,gBAAgB,EAAEA,CAAA,KAAMN,kBAAkB,CAACO,OAAO;IAClDC,YAAY,EAAEA,CAAA,KAAMP,mBAAmB;IACvCQ,QAAQ,EAAE;EACZ,CAAC,CAAC;;EAEF;EACAxB,SAAS,CAAC,YAA+B;IACvCmB,WAAW,CAACM,aAAa,CAACd,WAAW,GAAG,CAAC,EAAE;MAAEe,KAAK,EAAE;IAAO,CAAC,CAAC;EAC/D,CAAC,EAAE,CAACf,WAAW,EAAEQ,WAAW,CAAC,CAAC;EAE9B,oBACEpB,KAAA,CAAA4B,aAAA;IAAKC,SAAS,EAAEvB,MAAM,CAACwB;EAAQ,gBAC7B9B,KAAA,CAAA4B,aAAA,CAACrB,sBAAsB;IACrBO,WAAW,EAAEA,WAAY;IACzBC,mBAAmB,EAAEA;EAAoB,CAC1C,CAAC,eACFf,KAAA,CAAA4B,aAAA;IAAKG,GAAG,EAAEf,kBAAmB;IAACa,SAAS,EAAEvB,MAAM,CAAC0B;EAAgB,gBAC9DhC,KAAA,CAAA4B,aAAA;IACEC,SAAS,EAAEvB,MAAM,CAAC2B,mBAAoB;IACtCC,KAAK,EAAE;MAAEC,MAAM,EAAEf,WAAW,CAACgB,YAAY,CAAC;IAAE;EAAE,GAE7ChB,WAAW,CAACiB,eAAe,CAAC,CAAC,CAACC,GAAG,CAAEC,WAAW,IAAK;IAClD,MAAMC,UAAU,GAAGD,WAAW,CAACE,KAAK,GAAG,CAAC;IACxC,oBACEzC,KAAA,CAAA4B,aAAA;MACEc,GAAG,EAAEH,WAAW,CAACG,GAAI;MACrBb,SAAS,EAAEvB,MAAM,CAACqC,gBAAiB;MACnCT,KAAK,EAAE;QACLU,GAAG,EAAEL,WAAW,CAACM,KAAK;QACtBV,MAAM,EAAEI,WAAW,CAACO;MACtB;IAAE,gBAEF9C,KAAA,CAAA4B,aAAA,2BACE5B,KAAA,CAAA4B,aAAA,CAACpB,kBAAkB;MACjBE,QAAQ,EAAEA,QAAS;MACnB8B,UAAU,EAAEA,UAAW;MACvBO,QAAQ,EAAEP,UAAU,KAAK5B,WAAY;MACrCoC,OAAO,EAAEA,CAAA,KAAMnC,WAAW,CAAC2B,UAAU;IAAE,CACxC,CAAC,eACFxC,KAAA,CAAA4B,aAAA;MAAKC,SAAS,EAAEvB,MAAM,CAACkC;IAAW,GAAEA,UAAgB,CACjD,CACF,CAAC;EAEV,CAAC,CACE,CACF,CACF,CAAC;AAEV","ignoreList":[]}

package/build/esm/pdf-viewer/components/PdfViewerSidebar.module.css

@@ -0,0 +1,37 @@
+.sidebar {
+  width: var(--osdk-pdf-viewer-sidebar-width);
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: column;
+  background-color: var(--osdk-pdf-viewer-sidebar-bg);
+  border-right: var(--osdk-pdf-viewer-sidebar-border);
+  overflow: hidden;
+}
+
+
+.scrollContainer {
+  flex: 1;
+  overflow-y: auto;
+}
+
+.thumbnailsContainer {
+  position: relative;
+}
+
+.thumbnailWrapper {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  padding: var(--osdk-pdf-viewer-sidebar-thumbnail-gap)
+    var(--osdk-pdf-viewer-sidebar-thumbnail-gap) 0;
+}
+
+.pageNumber {
+  text-align: center;
+  font-family: var(--osdk-typography-family-default);
+  font-size: var(--osdk-typography-size-body-small);
+  color: var(--osdk-typography-color-muted);
+  margin-top: 4px;
+}

package/build/esm/pdf-viewer/components/PdfViewerSidebarHeader.js

@@ -0,0 +1,54 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Toggle } from "@base-ui/react/toggle";
+import { ToggleGroup } from "@base-ui/react/toggle-group";
+import { GridView, Properties } from "@blueprintjs/icons";
+import React, { useCallback } from "react";
+import styles from "./PdfViewerSidebarHeader.module.css";
+const SIDEBAR_MODE_VALUE = Object.freeze(["thumbnails"]);
+const OUTLINE_MODE_VALUE = Object.freeze(["outline"]);
+export function PdfViewerSidebarHeader({
+  sidebarMode,
+  onSidebarModeChange
+}) {
+  const value = sidebarMode === "thumbnails" ? SIDEBAR_MODE_VALUE : OUTLINE_MODE_VALUE;
+  const handleValueChange = useCallback(newValue => {
+    if (newValue.length > 0) {
+      onSidebarModeChange(newValue[0]);
+    }
+  }, [onSidebarModeChange]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.sidebarHeader
+  }, /*#__PURE__*/React.createElement(ToggleGroup, {
+    value: value,
+    onValueChange: handleValueChange,
+    className: styles.toggleGroup
+  }, /*#__PURE__*/React.createElement(Toggle, {
+    value: "thumbnails",
+    className: styles.modeButton,
+    "aria-label": "Page thumbnails"
+  }, /*#__PURE__*/React.createElement(GridView, {
+    size: 16
+  })), /*#__PURE__*/React.createElement(Toggle, {
+    value: "outline",
+    className: styles.modeButton,
+    "aria-label": "Document outline"
+  }, /*#__PURE__*/React.createElement(Properties, {
+    size: 16
+  }))));
+}
+//# sourceMappingURL=PdfViewerSidebarHeader.js.map

package/build/esm/pdf-viewer/components/PdfViewerSidebarHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PdfViewerSidebarHeader.js","names":["Toggle","ToggleGroup","GridView","Properties","React","useCallback","styles","SIDEBAR_MODE_VALUE","Object","freeze","OUTLINE_MODE_VALUE","PdfViewerSidebarHeader","sidebarMode","onSidebarModeChange","value","handleValueChange","newValue","length","createElement","className","sidebarHeader","onValueChange","toggleGroup","modeButton","size"],"sources":["PdfViewerSidebarHeader.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Toggle } from \"@base-ui/react/toggle\";\nimport { ToggleGroup } from \"@base-ui/react/toggle-group\";\nimport { GridView, Properties } from \"@blueprintjs/icons\";\nimport React, { useCallback } from \"react\";\nimport type { SidebarMode } from \"../types.js\";\nimport styles from \"./PdfViewerSidebarHeader.module.css\";\n\nexport interface PdfViewerSidebarHeaderProps {\n  sidebarMode: SidebarMode;\n  onSidebarModeChange: (mode: SidebarMode) => void;\n}\n\nconst SIDEBAR_MODE_VALUE = Object.freeze([\"thumbnails\"]) as readonly string[];\nconst OUTLINE_MODE_VALUE = Object.freeze([\"outline\"]) as readonly string[];\n\nexport function PdfViewerSidebarHeader({\n  sidebarMode,\n  onSidebarModeChange,\n}: PdfViewerSidebarHeaderProps): React.ReactElement {\n  const value = sidebarMode === \"thumbnails\"\n    ? SIDEBAR_MODE_VALUE\n    : OUTLINE_MODE_VALUE;\n\n  const handleValueChange = useCallback(\n    (newValue: string[]) => {\n      if (newValue.length > 0) {\n        onSidebarModeChange(newValue[0] as SidebarMode);\n      }\n    },\n    [onSidebarModeChange],\n  );\n\n  return (\n    <div className={styles.sidebarHeader}>\n      <ToggleGroup\n        value={value}\n        onValueChange={handleValueChange}\n        className={styles.toggleGroup}\n      >\n        <Toggle\n          value=\"thumbnails\"\n          className={styles.modeButton}\n          aria-label=\"Page thumbnails\"\n        >\n          <GridView size={16} />\n        </Toggle>\n\n        <Toggle\n          value=\"outline\"\n          className={styles.modeButton}\n          aria-label=\"Document outline\"\n        >\n          <Properties size={16} />\n        </Toggle>\n      </ToggleGroup>\n    </div>\n  );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,WAAW,QAAQ,6BAA6B;AACzD,SAASC,QAAQ,EAAEC,UAAU,QAAQ,oBAAoB;AACzD,OAAOC,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAE1C,OAAOC,MAAM,MAAM,qCAAqC;AAOxD,MAAMC,kBAAkB,GAAGC,MAAM,CAACC,MAAM,CAAC,CAAC,YAAY,CAAC,CAAsB;AAC7E,MAAMC,kBAAkB,GAAGF,MAAM,CAACC,MAAM,CAAC,CAAC,SAAS,CAAC,CAAsB;AAE1E,OAAO,SAASE,sBAAsBA,CAAC;EACrCC,WAAW;EACXC;AAC2B,CAAC,EAAsB;EAClD,MAAMC,KAAK,GAAGF,WAAW,KAAK,YAAY,GACtCL,kBAAkB,GAClBG,kBAAkB;EAEtB,MAAMK,iBAAiB,GAAGV,WAAW,CAClCW,QAAkB,IAAK;IACtB,IAAIA,QAAQ,CAACC,MAAM,GAAG,CAAC,EAAE;MACvBJ,mBAAmB,CAACG,QAAQ,CAAC,CAAC,CAAgB,CAAC;IACjD;EACF,CAAC,EACD,CAACH,mBAAmB,CACtB,CAAC;EAED,oBACET,KAAA,CAAAc,aAAA;IAAKC,SAAS,EAAEb,MAAM,CAACc;EAAc,gBACnChB,KAAA,CAAAc,aAAA,CAACjB,WAAW;IACVa,KAAK,EAAEA,KAAM;IACbO,aAAa,EAAEN,iBAAkB;IACjCI,SAAS,EAAEb,MAAM,CAACgB;EAAY,gBAE9BlB,KAAA,CAAAc,aAAA,CAAClB,MAAM;IACLc,KAAK,EAAC,YAAY;IAClBK,SAAS,EAAEb,MAAM,CAACiB,UAAW;IAC7B,cAAW;EAAiB,gBAE5BnB,KAAA,CAAAc,aAAA,CAAChB,QAAQ;IAACsB,IAAI,EAAE;EAAG,CAAE,CACf,CAAC,eAETpB,KAAA,CAAAc,aAAA,CAAClB,MAAM;IACLc,KAAK,EAAC,SAAS;IACfK,SAAS,EAAEb,MAAM,CAACiB,UAAW;IAC7B,cAAW;EAAkB,gBAE7BnB,KAAA,CAAAc,aAAA,CAACf,UAAU;IAACqB,IAAI,EAAE;EAAG,CAAE,CACjB,CACG,CACV,CAAC;AAEV","ignoreList":[]}

package/build/esm/pdf-viewer/components/PdfViewerSidebarHeader.module.css

@@ -0,0 +1,70 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+.sidebarHeader {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  padding: var(--osdk-surface-spacing);
+  border-bottom: var(--osdk-pdf-viewer-sidebar-border);
+  flex-shrink: 0;
+}
+
+.toggleGroup {
+  display: flex;
+  align-items: center;
+  gap: var(--osdk-spacing-2xs, 2px);
+  padding: var(--osdk-spacing-2xs, 2px);
+  border: none;
+  border-radius: var(--osdk-surface-border-radius);
+  background-color: var(--osdk-surface-background-color, transparent);
+}
+
+.modeButton {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  border: none;
+  background: none;
+  color: var(--osdk-typography-color-muted);
+  cursor: pointer;
+  border-radius: var(--osdk-surface-border-radius);
+  padding: 0;
+}
+
+.modeButton:hover {
+  background-color: var(--osdk-surface-background-color-default-hover);
+}
+
+.modeButton:active {
+  background-color: var(--osdk-surface-background-color-default-active);
+}
+
+.modeButton:focus-visible {
+  outline: var(--osdk-focus-outline);
+  outline-offset: var(--osdk-focus-visible-outline-offset);
+}
+
+.modeButton[data-pressed] {
+  background-color: var(--osdk-pdf-viewer-outline-item-active-bg, rgba(45, 114, 210, 0.1));
+  color: var(--osdk-pdf-viewer-outline-item-active-color, var(--osdk-intent-primary));
+}
+
+.modeButton[data-pressed]:hover {
+  background-color: var(--osdk-pdf-viewer-outline-item-active-bg, rgba(45, 114, 210, 0.1));
+}

package/build/esm/pdf-viewer/components/PdfViewerThumbnail.js

@@ -0,0 +1,100 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import classnames from "classnames";
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { DEVICE_PIXEL_RATIO, THUMBNAIL_SCALE } from "../constants.js";
+import styles from "./PdfViewerThumbnail.module.css";
+export function PdfViewerThumbnail({
+  document,
+  pageNumber,
+  isActive,
+  onClick
+}) {
+  const canvasRef = useRef(null);
+  const renderTaskRef = useRef(null);
+  const [dimensions, setDimensions] = useState(undefined);
+  useEffect(() => {
+    let cancelled = false;
+    void document.getPage(pageNumber).then(page => {
+      if (cancelled || canvasRef.current == null) {
+        return;
+      }
+      const viewport = page.getViewport({
+        scale: THUMBNAIL_SCALE
+      });
+      const canvas = canvasRef.current;
+      const context = canvas.getContext("2d");
+      if (context == null) {
+        return;
+      }
+      canvas.width = Math.floor(viewport.width * DEVICE_PIXEL_RATIO);
+      canvas.height = Math.floor(viewport.height * DEVICE_PIXEL_RATIO);
+      canvas.style.width = `${Math.floor(viewport.width)}px`;
+      canvas.style.height = `${Math.floor(viewport.height)}px`;
+      setDimensions({
+        width: Math.floor(viewport.width),
+        height: Math.floor(viewport.height)
+      });
+      if (renderTaskRef.current != null) {
+        renderTaskRef.current.cancel();
+      }
+      context.setTransform(DEVICE_PIXEL_RATIO, 0, 0, DEVICE_PIXEL_RATIO, 0, 0);
+      const renderTask = page.render({
+        canvasContext: context,
+        viewport
+      });
+      renderTaskRef.current = renderTask;
+      void renderTask.promise.catch(err => {
+        if (err instanceof Error && err.message.includes("cancelled")) {
+          return;
+        }
+        throw err;
+      });
+    });
+    return () => {
+      cancelled = true;
+      if (renderTaskRef.current != null) {
+        renderTaskRef.current.cancel();
+        renderTaskRef.current = null;
+      }
+    };
+  }, [document, pageNumber]);
+  const handleKeyDown = useCallback(e => {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      onClick();
+    }
+  }, [onClick]);
+  const containerClassName = classnames(styles.thumbnailContainer, isActive && styles.active);
+  return /*#__PURE__*/React.createElement("div", {
+    className: containerClassName,
+    onClick: onClick,
+    onKeyDown: handleKeyDown,
+    role: "button",
+    tabIndex: 0,
+    "aria-label": `Page ${pageNumber}`,
+    "aria-current": isActive ? "page" : undefined,
+    style: dimensions != null ? {
+      width: dimensions.width,
+      height: dimensions.height
+    } : undefined
+  }, /*#__PURE__*/React.createElement("canvas", {
+    ref: canvasRef,
+    className: styles.canvas
+  }));
+}
+//# sourceMappingURL=PdfViewerThumbnail.js.map

package/build/esm/pdf-viewer/components/PdfViewerThumbnail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PdfViewerThumbnail.js","names":["classnames","React","useCallback","useEffect","useRef","useState","DEVICE_PIXEL_RATIO","THUMBNAIL_SCALE","styles","PdfViewerThumbnail","document","pageNumber","isActive","onClick","canvasRef","renderTaskRef","dimensions","setDimensions","undefined","cancelled","getPage","then","page","current","viewport","getViewport","scale","canvas","context","getContext","width","Math","floor","height","style","cancel","setTransform","renderTask","render","canvasContext","promise","catch","err","Error","message","includes","handleKeyDown","e","key","preventDefault","containerClassName","thumbnailContainer","active","createElement","className","onKeyDown","role","tabIndex","ref"],"sources":["PdfViewerThumbnail.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport classnames from \"classnames\";\nimport type { PDFDocumentProxy, PDFPageProxy } from \"pdfjs-dist\";\nimport React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport { DEVICE_PIXEL_RATIO, THUMBNAIL_SCALE } from \"../constants.js\";\nimport styles from \"./PdfViewerThumbnail.module.css\";\n\ninterface PdfViewerThumbnailProps {\n  document: PDFDocumentProxy;\n  pageNumber: number;\n  isActive: boolean;\n  onClick: () => void;\n}\n\nexport function PdfViewerThumbnail({\n  document,\n  pageNumber,\n  isActive,\n  onClick,\n}: PdfViewerThumbnailProps): React.ReactElement {\n  const canvasRef = useRef<HTMLCanvasElement>(null);\n  const renderTaskRef = useRef<ReturnType<PDFPageProxy[\"render\"]> | null>(null);\n  const [dimensions, setDimensions] = useState<\n    { width: number; height: number } | undefined\n  >(undefined);\n\n  useEffect(() => {\n    let cancelled = false;\n\n    void document.getPage(pageNumber).then((page) => {\n      if (cancelled || canvasRef.current == null) {\n        return;\n      }\n\n      const viewport = page.getViewport({ scale: THUMBNAIL_SCALE });\n      const canvas = canvasRef.current;\n      const context = canvas.getContext(\"2d\");\n      if (context == null) {\n        return;\n      }\n\n      canvas.width = Math.floor(viewport.width * DEVICE_PIXEL_RATIO);\n      canvas.height = Math.floor(viewport.height * DEVICE_PIXEL_RATIO);\n      canvas.style.width = `${Math.floor(viewport.width)}px`;\n      canvas.style.height = `${Math.floor(viewport.height)}px`;\n\n      setDimensions({\n        width: Math.floor(viewport.width),\n        height: Math.floor(viewport.height),\n      });\n\n      if (renderTaskRef.current != null) {\n        renderTaskRef.current.cancel();\n      }\n\n      context.setTransform(\n        DEVICE_PIXEL_RATIO,\n        0,\n        0,\n        DEVICE_PIXEL_RATIO,\n        0,\n        0,\n      );\n\n      const renderTask = page.render({\n        canvasContext: context,\n        viewport,\n      });\n      renderTaskRef.current = renderTask;\n\n      void renderTask.promise.catch((err: unknown) => {\n        if (err instanceof Error && err.message.includes(\"cancelled\")) {\n          return;\n        }\n        throw err;\n      });\n    });\n\n    return () => {\n      cancelled = true;\n      if (renderTaskRef.current != null) {\n        renderTaskRef.current.cancel();\n        renderTaskRef.current = null;\n      }\n    };\n  }, [document, pageNumber]);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.key === \"Enter\" || e.key === \" \") {\n        e.preventDefault();\n        onClick();\n      }\n    },\n    [onClick],\n  );\n\n  const containerClassName = classnames(\n    styles.thumbnailContainer,\n    isActive && styles.active,\n  );\n\n  return (\n    <div\n      className={containerClassName}\n      onClick={onClick}\n      onKeyDown={handleKeyDown}\n      role=\"button\"\n      tabIndex={0}\n      aria-label={`Page ${pageNumber}`}\n      aria-current={isActive ? \"page\" : undefined}\n      style={dimensions != null\n        ? { width: dimensions.width, height: dimensions.height }\n        : undefined}\n    >\n      <canvas ref={canvasRef} className={styles.canvas} />\n    </div>\n  );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,UAAU,MAAM,YAAY;AAEnC,OAAOC,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AACvE,SAASC,kBAAkB,EAAEC,eAAe,QAAQ,iBAAiB;AACrE,OAAOC,MAAM,MAAM,iCAAiC;AASpD,OAAO,SAASC,kBAAkBA,CAAC;EACjCC,QAAQ;EACRC,UAAU;EACVC,QAAQ;EACRC;AACuB,CAAC,EAAsB;EAC9C,MAAMC,SAAS,GAAGV,MAAM,CAAoB,IAAI,CAAC;EACjD,MAAMW,aAAa,GAAGX,MAAM,CAA4C,IAAI,CAAC;EAC7E,MAAM,CAACY,UAAU,EAAEC,aAAa,CAAC,GAAGZ,QAAQ,CAE1Ca,SAAS,CAAC;EAEZf,SAAS,CAAC,MAAM;IACd,IAAIgB,SAAS,GAAG,KAAK;IAErB,KAAKT,QAAQ,CAACU,OAAO,CAACT,UAAU,CAAC,CAACU,IAAI,CAAEC,IAAI,IAAK;MAC/C,IAAIH,SAAS,IAAIL,SAAS,CAACS,OAAO,IAAI,IAAI,EAAE;QAC1C;MACF;MAEA,MAAMC,QAAQ,GAAGF,IAAI,CAACG,WAAW,CAAC;QAAEC,KAAK,EAAEnB;MAAgB,CAAC,CAAC;MAC7D,MAAMoB,MAAM,GAAGb,SAAS,CAACS,OAAO;MAChC,MAAMK,OAAO,GAAGD,MAAM,CAACE,UAAU,CAAC,IAAI,CAAC;MACvC,IAAID,OAAO,IAAI,IAAI,EAAE;QACnB;MACF;MAEAD,MAAM,CAACG,KAAK,GAAGC,IAAI,CAACC,KAAK,CAACR,QAAQ,CAACM,KAAK,GAAGxB,kBAAkB,CAAC;MAC9DqB,MAAM,CAACM,MAAM,GAAGF,IAAI,CAACC,KAAK,CAACR,QAAQ,CAACS,MAAM,GAAG3B,kBAAkB,CAAC;MAChEqB,MAAM,CAACO,KAAK,CAACJ,KAAK,GAAG,GAAGC,IAAI,CAACC,KAAK,CAACR,QAAQ,CAACM,KAAK,CAAC,IAAI;MACtDH,MAAM,CAACO,KAAK,CAACD,MAAM,GAAG,GAAGF,IAAI,CAACC,KAAK,CAACR,QAAQ,CAACS,MAAM,CAAC,IAAI;MAExDhB,aAAa,CAAC;QACZa,KAAK,EAAEC,IAAI,CAACC,KAAK,CAACR,QAAQ,CAACM,KAAK,CAAC;QACjCG,MAAM,EAAEF,IAAI,CAACC,KAAK,CAACR,QAAQ,CAACS,MAAM;MACpC,CAAC,CAAC;MAEF,IAAIlB,aAAa,CAACQ,OAAO,IAAI,IAAI,EAAE;QACjCR,aAAa,CAACQ,OAAO,CAACY,MAAM,CAAC,CAAC;MAChC;MAEAP,OAAO,CAACQ,YAAY,CAClB9B,kBAAkB,EAClB,CAAC,EACD,CAAC,EACDA,kBAAkB,EAClB,CAAC,EACD,CACF,CAAC;MAED,MAAM+B,UAAU,GAAGf,IAAI,CAACgB,MAAM,CAAC;QAC7BC,aAAa,EAAEX,OAAO;QACtBJ;MACF,CAAC,CAAC;MACFT,aAAa,CAACQ,OAAO,GAAGc,UAAU;MAElC,KAAKA,UAAU,CAACG,OAAO,CAACC,KAAK,CAAEC,GAAY,IAAK;QAC9C,IAAIA,GAAG,YAAYC,KAAK,IAAID,GAAG,CAACE,OAAO,CAACC,QAAQ,CAAC,WAAW,CAAC,EAAE;UAC7D;QACF;QACA,MAAMH,GAAG;MACX,CAAC,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,MAAM;MACXvB,SAAS,GAAG,IAAI;MAChB,IAAIJ,aAAa,CAACQ,OAAO,IAAI,IAAI,EAAE;QACjCR,aAAa,CAACQ,OAAO,CAACY,MAAM,CAAC,CAAC;QAC9BpB,aAAa,CAACQ,OAAO,GAAG,IAAI;MAC9B;IACF,CAAC;EACH,CAAC,EAAE,CAACb,QAAQ,EAAEC,UAAU,CAAC,CAAC;EAE1B,MAAMmC,aAAa,GAAG5C,WAAW,CAC9B6C,CAAsB,IAAK;IAC1B,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,IAAID,CAAC,CAACC,GAAG,KAAK,GAAG,EAAE;MACtCD,CAAC,CAACE,cAAc,CAAC,CAAC;MAClBpC,OAAO,CAAC,CAAC;IACX;EACF,CAAC,EACD,CAACA,OAAO,CACV,CAAC;EAED,MAAMqC,kBAAkB,GAAGlD,UAAU,CACnCQ,MAAM,CAAC2C,kBAAkB,EACzBvC,QAAQ,IAAIJ,MAAM,CAAC4C,MACrB,CAAC;EAED,oBACEnD,KAAA,CAAAoD,aAAA;IACEC,SAAS,EAAEJ,kBAAmB;IAC9BrC,OAAO,EAAEA,OAAQ;IACjB0C,SAAS,EAAET,aAAc;IACzBU,IAAI,EAAC,QAAQ;IACbC,QAAQ,EAAE,CAAE;IACZ,cAAY,QAAQ9C,UAAU,EAAG;IACjC,gBAAcC,QAAQ,GAAG,MAAM,GAAGM,SAAU;IAC5CgB,KAAK,EAAElB,UAAU,IAAI,IAAI,GACrB;MAAEc,KAAK,EAAEd,UAAU,CAACc,KAAK;MAAEG,MAAM,EAAEjB,UAAU,CAACiB;IAAO,CAAC,GACtDf;EAAU,gBAEdjB,KAAA,CAAAoD,aAAA;IAAQK,GAAG,EAAE5C,SAAU;IAACwC,SAAS,EAAE9C,MAAM,CAACmB;EAAO,CAAE,CAChD,CAAC;AAEV","ignoreList":[]}

package/build/esm/pdf-viewer/components/PdfViewerThumbnail.module.css

@@ -0,0 +1,26 @@
+.thumbnailContainer {
+  position: relative;
+  cursor: pointer;
+  border: 2px solid transparent;
+  border-radius: var(--osdk-surface-border-radius);
+  box-shadow: var(--osdk-pdf-viewer-page-shadow);
+  overflow: hidden;
+  transition: border-color var(--osdk-emphasis-transition-duration)
+    var(--osdk-emphasis-ease-default);
+}
+
+.thumbnailContainer:hover {
+  border-color: var(--osdk-pdf-viewer-sidebar-border);
+}
+
+.active {
+  border-color: var(--osdk-pdf-viewer-sidebar-active-border);
+}
+
+.active:hover {
+  border-color: var(--osdk-pdf-viewer-sidebar-active-border);
+}
+
+.canvas {
+  display: block;
+}

package/build/esm/pdf-viewer/components/PdfViewerToolbar.js

@@ -0,0 +1,221 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Button } from "@base-ui/react/button";
+import { Input } from "@base-ui/react/input";
+import { ChevronLeft, ChevronRight, Download, FloppyDisk, Highlight, Menu, Minus, Plus, RotatePage, Search } from "@blueprintjs/icons";
+import classnames from "classnames";
+import React, { useCallback, useEffect, useState } from "react";
+import { MAX_SCALE, MIN_SCALE, SCALE_STEP } from "../constants.js";
+import styles from "./PdfViewerToolbar.module.css";
+export function PdfViewerToolbar({
+  currentPage,
+  numPages,
+  scale,
+  sidebarOpen,
+  onPageChange,
+  onScaleChange,
+  onSearchOpen,
+  onSidebarToggle,
+  onDownload,
+  enableDownload,
+  onRotateLeft,
+  onRotateRight,
+  enableHighlight,
+  highlightModeActive,
+  onHighlightToggle,
+  enableFormSave = false,
+  onFormSave
+}) {
+  const [pageInputValue, setPageInputValue] = useState(String(currentPage));
+
+  // Sync input display when currentPage changes from scrolling
+  useEffect(function () {
+    setPageInputValue(String(currentPage));
+  }, [currentPage]);
+  const handlePrevPage = useCallback(() => {
+    if (currentPage > 1) {
+      const newPage = currentPage - 1;
+      onPageChange(newPage);
+      setPageInputValue(String(newPage));
+    }
+  }, [currentPage, onPageChange]);
+  const handleNextPage = useCallback(() => {
+    if (currentPage < numPages) {
+      const newPage = currentPage + 1;
+      onPageChange(newPage);
+      setPageInputValue(String(newPage));
+    }
+  }, [currentPage, numPages, onPageChange]);
+  const handlePageInputChange = useCallback(e => {
+    setPageInputValue(e.target.value);
+  }, []);
+  const handlePageInputKeyDown = useCallback(e => {
+    if (e.key === "Enter") {
+      const page = parseInt(pageInputValue, 10);
+      if (!isNaN(page) && page >= 1 && page <= numPages) {
+        onPageChange(page);
+      } else {
+        setPageInputValue(String(currentPage));
+      }
+    }
+  }, [pageInputValue, numPages, onPageChange, currentPage]);
+  const handlePageInputBlur = useCallback(() => {
+    setPageInputValue(String(currentPage));
+  }, [currentPage]);
+  const handleZoomIn = useCallback(() => {
+    const newScale = Math.min(scale + SCALE_STEP, MAX_SCALE);
+    onScaleChange(newScale);
+  }, [scale, onScaleChange]);
+  const handleZoomOut = useCallback(() => {
+    const newScale = Math.max(scale - SCALE_STEP, MIN_SCALE);
+    onScaleChange(newScale);
+  }, [scale, onScaleChange]);
+  const scalePercent = `${Math.round(scale * 100)}%`;
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.toolbar
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: onSidebarToggle,
+    "aria-label": sidebarOpen ? "Close sidebar" : "Open sidebar",
+    title: sidebarOpen ? "Close sidebar" : "Open sidebar",
+    "aria-pressed": sidebarOpen,
+    type: "button"
+  }, /*#__PURE__*/React.createElement(Menu, {
+    size: 16
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles.separator
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles.toolbarGroup
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: handlePrevPage,
+    disabled: currentPage <= 1,
+    "aria-label": "Previous page",
+    title: "Previous page",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(ChevronLeft, {
+    size: 16
+  })), /*#__PURE__*/React.createElement(Input, {
+    className: styles.pageInput,
+    type: "text",
+    value: pageInputValue,
+    onChange: handlePageInputChange,
+    onKeyDown: handlePageInputKeyDown,
+    onBlur: handlePageInputBlur,
+    "aria-label": "Page number"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: styles.pageCount
+  }, "of ", numPages), /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: handleNextPage,
+    disabled: currentPage >= numPages,
+    "aria-label": "Next page",
+    title: "Next page",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(ChevronRight, {
+    size: 16
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: styles.separator
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles.toolbarGroup
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: handleZoomOut,
+    disabled: scale <= MIN_SCALE,
+    "aria-label": "Zoom out",
+    title: "Zoom out",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(Minus, {
+    size: 16
+  })), /*#__PURE__*/React.createElement("span", {
+    className: styles.scaleDisplay
+  }, scalePercent), /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: handleZoomIn,
+    disabled: scale >= MAX_SCALE,
+    "aria-label": "Zoom in",
+    title: "Zoom in",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(Plus, {
+    size: 16
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: styles.separator
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles.toolbarGroup
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: onRotateLeft,
+    "aria-label": "Rotate left",
+    title: "Rotate left",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(RotatePage, {
+    size: 16
+  })), /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: onRotateRight,
+    "aria-label": "Rotate right",
+    title: "Rotate right",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(RotatePage, {
+    size: 16,
+    style: {
+      transform: "scaleX(-1)"
+    }
+  }))), enableHighlight && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: styles.separator
+  }), /*#__PURE__*/React.createElement(Button, {
+    className: classnames(styles.toolbarButton, highlightModeActive && styles.toolbarButtonActive),
+    onClick: onHighlightToggle,
+    "aria-label": highlightModeActive ? "Disable highlight mode" : "Enable highlight mode",
+    title: highlightModeActive ? "Disable highlight mode" : "Enable highlight mode",
+    "aria-pressed": highlightModeActive,
+    type: "button"
+  }, /*#__PURE__*/React.createElement(Highlight, {
+    size: 16
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: styles.separator
+  }), /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: onSearchOpen,
+    "aria-label": "Search",
+    title: "Search",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(Search, {
+    size: 16
+  })), enableDownload && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: styles.separator
+  }), /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: onDownload,
+    "aria-label": "Download",
+    title: "Download",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(Download, {
+    size: 16
+  }))), enableFormSave && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: styles.separator
+  }), /*#__PURE__*/React.createElement(Button, {
+    className: styles.toolbarButton,
+    onClick: onFormSave,
+    "aria-label": "Save form",
+    title: "Save form",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(FloppyDisk, {
+    size: 16
+  }))));
+}
+//# sourceMappingURL=PdfViewerToolbar.js.map