@itfin/components 1.0.9 → 1.0.10

package/src/components/pdf-viewer/styles/index.scss

@@ -0,0 +1,4 @@
+@import "text_layer_builder.scss";
+@import "annotation_layer_builder.scss";
+@import "pdf_viewer.scss";
+@import "viewer.scss";

package/src/components/pdf-viewer/utils/constants.js

@@ -0,0 +1 @@
+export const PDF_FILE_INPUT_ID = "pdfFileInput";

package/src/components/pdf-viewer/utils/locale.js

@@ -0,0 +1,290 @@
+export default {
+  default_locale: 'en',
+  locales: {
+    en: {
+      annotation_date_string: { textContent: '{{date}}, {{time}}' },
+      attachments_label: { textContent: 'Attachments' },
+      attachments: {
+        title: 'Show Attachments'
+      },
+      bookmark_label: { textContent: 'Current View' },
+      bookmark: {
+        title: 'Current view (copy or open in new window)'
+      },
+      cursor_hand_tool_label: { textContent: 'Hand Tool' },
+      cursor_hand_tool: {
+        title: 'Enable Hand Tool'
+      },
+      cursor_text_select_tool_label: { textContent: 'Text Selection Tool' },
+      cursor_text_select_tool: {
+        title: 'Enable Text Selection Tool'
+      },
+      document_outline_label: { textContent: 'Document Outline' },
+      document_outline: {
+        title:
+          'Show Document Outline (double-click to expand/collapse all items)'
+      },
+      document_properties_author: { textContent: 'Author:' },
+      document_properties_close: { textContent: 'Close' },
+      document_properties_creation_date: { textContent: 'Creation Date:' },
+      document_properties_creator: { textContent: 'Creator:' },
+      document_properties_date_string: { textContent: '{{date}}, {{time}}' },
+      document_properties_file_name: { textContent: 'File name:' },
+      document_properties_file_size: { textContent: 'File size:' },
+      document_properties_kb: {
+        textContent: '{{size_kb}} KB ({{size_b}} bytes)'
+      },
+      document_properties_keywords: { textContent: 'Keywords:' },
+      document_properties_label: { textContent: 'Document Properties…' },
+      document_properties_linearized_no: { textContent: 'No' },
+      document_properties_linearized_yes: { textContent: 'Yes' },
+      document_properties_linearized: { textContent: 'Fast Web View:' },
+      document_properties_mb: {
+        textContent: '{{size_mb}} MB ({{size_b}} bytes)'
+      },
+      document_properties_modification_date: {
+        textContent: 'Modification Date:'
+      },
+      document_properties_page_count: { textContent: 'Page Count:' },
+      document_properties_page_size_dimension_name_string: {
+        textContent:
+          '{{width}} × {{height}} {{unit}} ({{name}}, {{orientation}})'
+      },
+      document_properties_page_size_dimension_string: {
+        textContent: '{{width}} × {{height}} {{unit}} ({{orientation}})'
+      },
+      document_properties_page_size_name_a3: { textContent: 'A3' },
+      document_properties_page_size_name_a4: { textContent: 'A4' },
+      document_properties_page_size_name_legal: { textContent: 'Legal' },
+      document_properties_page_size_name_letter: { textContent: 'Letter' },
+      document_properties_page_size_orientation_landscape: {
+        textContent: 'landscape'
+      },
+      document_properties_page_size_orientation_portrait: {
+        textContent: 'portrait'
+      },
+      document_properties_page_size_unit_inches: { textContent: 'in' },
+      document_properties_page_size_unit_millimeters: { textContent: 'mm' },
+      document_properties_page_size: { textContent: 'Page Size:' },
+      document_properties_producer: { textContent: 'PDF Producer:' },
+      document_properties_subject: { textContent: 'Subject:' },
+      document_properties_title: { textContent: 'Title:' },
+      document_properties_version: { textContent: 'PDF Version:' },
+      document_properties: {
+        title: 'Document Properties…'
+      },
+      download_label: { textContent: 'Download' },
+      download: {
+        title: 'Download'
+      },
+      error_close: { textContent: 'Close' },
+      error_file: { textContent: 'File: {{file}}' },
+      error_less_info: { textContent: 'Less Information' },
+      error_line: { textContent: 'Line: {{line}}' },
+      error_message: { textContent: 'Message: {{message}}' },
+      error_more_info: { textContent: 'More Information' },
+      error_stack: { textContent: 'Stack: {{stack}}' },
+      error_version_info: {
+        textContent: 'PDF.js v{{version}} (build: {{build}})'
+      },
+      find_entire_word_label: { textContent: 'Whole words' },
+      find_highlight: { textContent: 'Highlight all' },
+      find_input: {
+        placeholder: 'Find in document…',
+        title: 'Find'
+      },
+      find_match_case_label: { textContent: 'Match case' },
+      'find_match_count_limit[few]': {
+        textContent: 'More than {{limit}} matches'
+      },
+      'find_match_count_limit[many]': {
+        textContent: 'More than {{limit}} matches'
+      },
+      'find_match_count_limit[one]': {
+        textContent: 'More than {{limit}} match'
+      },
+      'find_match_count_limit[other]': {
+        textContent: 'More than {{limit}} matches'
+      },
+      'find_match_count_limit[two]': {
+        textContent: 'More than {{limit}} matches'
+      },
+      'find_match_count_limit[zero]': {
+        textContent: 'More than {{limit}} matches'
+      },
+      find_match_count_limit: {
+        textContent: '{[ plural(limit) ]}'
+      },
+      'find_match_count[few]': {
+        textContent: '{{current}} of {{total}} matches'
+      },
+      'find_match_count[many]': {
+        textContent: '{{current}} of {{total}} matches'
+      },
+      'find_match_count[one]': {
+        textContent: '{{current}} of {{total}} match'
+      },
+      'find_match_count[other]': {
+        textContent: '{{current}} of {{total}} matches'
+      },
+      'find_match_count[two]': {
+        textContent: '{{current}} of {{total}} matches'
+      },
+      find_match_count: {
+        textContent: '{[ plural(total) ]}'
+      },
+      find_next_label: { textContent: 'Next' },
+      find_next: {
+        title: 'Find the next occurrence of the phrase'
+      },
+      find_not_found: { textContent: 'Phrase not found' },
+      find_previous_label: { textContent: 'Previous' },
+      find_previous: {
+        title: 'Find the previous occurrence of the phrase'
+      },
+      find_reached_bottom: {
+        textContent: 'Reached end of document, continued from top'
+      },
+      find_reached_top: {
+        textContent: 'Reached top of document, continued from bottom'
+      },
+      findbar_label: { textContent: 'Find' },
+      findbar: {
+        title: 'Find in Document'
+      },
+      first_page_label: { textContent: 'Go to First Page' },
+      first_page: {
+        label: 'Go to First Page',
+        title: 'Go to First Page'
+      },
+      invalid_file_error: { textContent: 'Invalid or corrupted PDF file.' },
+      last_page_label: { textContent: 'Go to Last Page' },
+      last_page: {
+        title: 'Go to Last Page'
+      },
+      loading_error_indicator: { textContent: 'Error' },
+      loading_error: {
+        textContent: 'An error occurred while loading the PDF.'
+      },
+      missing_file_error: { textContent: 'Missing PDF file.' },
+      next_label: { textContent: 'Next' },
+      next: {
+        title: 'Next Page'
+      },
+      of_pages: { textContent: 'of {{pagesCount}}' },
+      open_file_label: { textContent: 'Open' },
+      open_file: {
+        title: 'Open File'
+      },
+      page_canvas: { textContent: 'Page {{page}}' },
+      page_of_pages: { textContent: '({{pageNumber}} of {{pagesCount}})' },
+      page_rotate_ccw_label: { textContent: 'Rotate Counterclockwise' },
+      page_rotate_ccw: {
+        label: 'Rotate Counterclockwise',
+        title: 'Rotate Counterclockwise'
+      },
+      page_rotate_cw_label: { textContent: 'Rotate Clockwise' },
+      page_rotate_cw: {
+        label: 'Rotate Clockwise',
+        title: 'Rotate Clockwise'
+      },
+      page_scale_actual: { textContent: 'Actual Size' },
+      page_scale_auto: { textContent: 'Automatic Zoom' },
+      page_scale_fit: { textContent: 'Page Fit' },
+      page_scale_percent: { textContent: '{{scale}}%' },
+      page_scale_width: { textContent: 'Page Width' },
+      page: {
+        title: 'Page'
+      },
+      password_cancel: { textContent: 'Cancel' },
+      password_invalid: { textContent: 'Invalid password. Please try again.' },
+      password_label: {
+        textContent: 'Enter the password to open this PDF file.'
+      },
+      password_ok: { textContent: 'OK' },
+      presentation_mode_label: { textContent: 'Presentation Mode' },
+      presentation_mode: {
+        title: 'Switch to Presentation Mode'
+      },
+      previous_label: { textContent: 'Previous' },
+      previous: {
+        title: 'Previous Page'
+      },
+      print_label: { textContent: 'Print' },
+      print_progress_close: { textContent: 'Cancel' },
+      print_progress_message: {
+        textContent: 'Preparing document for printing…'
+      },
+      print_progress_percent: { textContent: '{{progress}}%' },
+      print: {
+        title: 'Print'
+      },
+      printing_not_ready: {
+        textContent: 'Warning: The PDF is not fully loaded for printing.'
+      },
+      printing_not_supported: {
+        textContent: 'Warning: Printing is not fully supported by this browser.'
+      },
+      rendering_error: {
+        textContent: 'An error occurred while rendering the page.'
+      },
+      scroll_horizontal_label: { textContent: 'Horizontal Scrolling' },
+      scroll_horizontal: {
+        title: 'Use Horizontal Scrolling'
+      },
+      scroll_vertical_label: { textContent: 'Vertical Scrolling' },
+      scroll_vertical: {
+        title: 'Use Vertical Scrolling'
+      },
+      scroll_wrapped_label: { textContent: 'Wrapped Scrolling' },
+      scroll_wrapped: {
+        title: 'Use Wrapped Scrolling'
+      },
+      spread_even_label: { textContent: 'Even Spreads' },
+      spread_even: {
+        title: 'Join page spreads starting with even-numbered pages'
+      },
+      spread_none_label: { textContent: 'No Spreads' },
+      spread_none: {
+        title: 'Do not join page spreads'
+      },
+      spread_odd_label: { textContent: 'Odd Spreads' },
+      spread_odd: {
+        title: 'Join page spreads starting with odd-numbered pages'
+      },
+      text_annotation_type: { alt: '[{{type}} Annotation]' },
+      thumb_page_canvas: { textContent: 'Thumbnail of Page {{page}}' },
+      thumb_page_title: { textContent: 'Page {{page}}' },
+      thumbs_label: { textContent: 'Thumbnails' },
+      thumbs: {
+        title: 'Show Thumbnails'
+      },
+      toggle_sidebar_label: { textContent: 'Toggle Sidebar' },
+      toggle_sidebar_notification: {
+        title: 'Toggle Sidebar (document contains outline/attachments)'
+      },
+      toggle_sidebar: {
+        title: 'Toggle Sidebar'
+      },
+      tools_label: { textContent: 'Tools' },
+      tools: {
+        title: 'Tools'
+      },
+      unexpected_response_error: { textContent: 'Unexpected server response.' },
+      web_fonts_disabled: {
+        textContent: 'Web fonts are disabled: unable to use embedded PDF fonts.'
+      },
+      zoom_in_label: { textContent: 'Zoom In' },
+      zoom_in: {
+        title: 'Zoom In'
+      },
+      zoom_out_label: { textContent: 'Zoom Out' },
+      zoom_out: {
+        title: 'Zoom Out'
+      },
+      zoom: {
+        title: 'Zoom'
+      }
+    }
+  }
+};

package/src/components/pdf-viewer/utils/pdf-config.js

@@ -0,0 +1,137 @@
+import { PDF_FILE_INPUT_ID } from './constants';
+
+const getEl = document.getElementById.bind(document);
+
+export default (idConfig = {}) => ({
+  appContainer: getEl('pdf'),
+  mainContainer: getEl('viewerContainer'),
+  viewerContainer: getEl('viewer'),
+  eventBus: null,
+  toolbar: {
+    container: getEl('toolbarViewer'),
+    numPages: getEl(idConfig.numPages || 'numPages'),
+    pageNumber: getEl(idConfig.pageNumber || 'pageNumber'),
+    // TODO make scale select customizable
+    scaleSelectContainer: getEl('scaleSelectContainer'),
+    scaleSelect: getEl('scaleSelect'),
+    customScaleOption: getEl('customScaleOption'),
+    previous: getEl(idConfig.previousPage || 'previous'),
+    next: getEl(idConfig.nextPage || 'next'),
+    zoomIn: getEl(idConfig.zoomIn || 'zoomIn'),
+    zoomOut: getEl(idConfig.zoomOut || 'zoomOut'),
+    viewFind: getEl(idConfig.toggleFindbar || 'viewFind'),
+    openFile: getEl(idConfig.openFile || 'openFile'),
+    print: getEl(idConfig.print || 'print'),
+    presentationModeButton: getEl(
+      idConfig.presentationMode || 'presentationMode'
+    ),
+    download: getEl(idConfig.download || 'download'),
+    viewBookmark: getEl(idConfig.viewBookmark || 'viewBookmark')
+  },
+  secondaryToolbar: {
+    toolbar: getEl('secondaryToolbar'),
+    toggleButton: getEl('secondaryToolbarToggle'),
+    toolbarButtonContainer: getEl('secondaryToolbarButtonContainer'),
+    presentationModeButton: getEl('secondaryPresentationMode'),
+    openFileButton: getEl('secondaryOpenFile'),
+    printButton: getEl('secondaryPrint'),
+    downloadButton: getEl('secondaryDownload'),
+    viewBookmarkButton: getEl('secondaryViewBookmark'),
+    firstPageButton: getEl(idConfig.firstPage || 'firstPage'),
+    lastPageButton: getEl(idConfig.lastPage || 'lastPage'),
+    pageRotateCwButton: getEl(idConfig.pageRotateCw || 'pageRotateCw'),
+    pageRotateCcwButton: getEl(idConfig.pageRotateCcw || 'pageRotateCcw'),
+    cursorSelectToolButton: getEl(
+      idConfig.cursorSelectTool || 'cursorSelectTool'
+    ),
+    cursorHandToolButton: getEl(idConfig.cursorHandTool || 'cursorHandTool'),
+    scrollVerticalButton: getEl(idConfig.scrollVertical || 'scrollVertical'),
+    scrollHorizontalButton: getEl(
+      idConfig.scrollHorizontal || 'scrollHorizontal'
+    ),
+    scrollWrappedButton: getEl(idConfig.scrollWrapped || 'scrollWrapped'),
+    spreadNoneButton: getEl(idConfig.spreadNone || 'spreadNone'),
+    spreadOddButton: getEl(idConfig.spreadOdd || 'spreadOdd'),
+    spreadEvenButton: getEl(idConfig.spreadEven || 'spreadEven'),
+    documentPropertiesButton: getEl(
+      idConfig.documentProperties || 'documentProperties'
+    )
+  },
+  fullscreen: {
+    contextFirstPage: getEl('contextFirstPage'),
+    contextLastPage: getEl('contextLastPage'),
+    contextPageRotateCw: getEl('contextPageRotateCw'),
+    contextPageRotateCcw: getEl('contextPageRotateCcw')
+  },
+  sidebar: {
+    // Divs (and sidebar button)
+    outerContainer: getEl('outerContainer'),
+    viewerContainer: getEl('viewerContainer'),
+    toggleButton: getEl(idConfig.sidebarToggle || 'sidebarToggle'),
+    // Buttons
+    thumbnailButton: getEl(idConfig.viewThumbnail || 'viewThumbnail'),
+    outlineButton: getEl(idConfig.viewOutline || 'viewOutline'),
+    attachmentsButton: getEl(idConfig.viewAttachments || 'viewAttachments'),
+    // Views
+    thumbnailView: getEl('thumbnailView'),
+    outlineView: getEl('outlineView'),
+    attachmentsView: getEl('attachmentsView')
+  },
+  sidebarResizer: {
+    outerContainer: getEl('outerContainer'),
+    resizer: getEl('sidebarResizer')
+  },
+  findBar: {
+    bar: getEl(idConfig.findbar || 'findbar'),
+    toggleButton: getEl(idConfig.toggleFindbar || 'viewFind'),
+    findField: getEl(idConfig.findInput || 'findInput'),
+    highlightAllCheckbox: getEl(
+      idConfig.findHighlightAll || 'findHighlightAll'
+    ),
+    caseSensitiveCheckbox: getEl(idConfig.findMatchCase || 'findMatchCase'),
+    entireWordCheckbox: getEl(idConfig.findEntireWord || 'findEntireWord'),
+    findMsg: getEl(idConfig.findMessage || 'findMsg'),
+    findResultsCount: getEl(idConfig.findResultsCount || 'findResultsCount'),
+    findPreviousButton: getEl(idConfig.findPrevious || 'findPrevious'),
+    findNextButton: getEl(idConfig.findNext || 'findNext')
+  },
+  passwordOverlay: {
+    overlayName: 'passwordOverlay',
+    container: getEl('passwordOverlay'),
+    label: getEl('passwordText'),
+    input: getEl('password'),
+    submitButton: getEl('passwordSubmit'),
+    cancelButton: getEl('passwordCancel')
+  },
+  documentProperties: {
+    overlayName: 'documentPropertiesOverlay',
+    container: getEl('documentPropertiesOverlay'),
+    closeButton: getEl('documentPropertiesClose'),
+    fields: {
+      fileName: getEl('fileNameField'),
+      fileSize: getEl('fileSizeField'),
+      title: getEl('titleField'),
+      author: getEl('authorField'),
+      subject: getEl('subjectField'),
+      keywords: getEl('keywordsField'),
+      creationDate: getEl('creationDateField'),
+      modificationDate: getEl('modificationDateField'),
+      creator: getEl('creatorField'),
+      producer: getEl('producerField'),
+      version: getEl('versionField'),
+      pageCount: getEl('pageCountField'),
+      pageSize: getEl('pageSizeField'),
+      linearized: getEl('linearizedField')
+    }
+  },
+  errorWrapper: {
+    container: getEl('errorWrapper'),
+    errorMessage: getEl('errorMessage'),
+    closeButton: getEl('errorClose'),
+    errorMoreInfo: getEl('errorMoreInfo'),
+    moreInfoButton: getEl('errorShowMore'),
+    lessInfoButton: getEl('errorShowLess')
+  },
+  printContainer: getEl('printContainer'),
+  openFileInputName: PDF_FILE_INPUT_ID
+});

package/src/components/pdf-viewer/utils/toolbar-config.js

@@ -0,0 +1,60 @@
+export const toolbarConfig = {
+  sidebar: {
+    viewThumbnail: true,
+    viewOutline: true,
+    viewAttachments: true
+  },
+  secondaryToolbar: {
+    secondaryPresentationMode: true,
+    secondaryOpenFile: true,
+    secondaryPrint: true,
+    secondaryDownload: true,
+    secondaryViewBookmark: true,
+    firstPage: true,
+    lastPage: true,
+    pageRotateCw: true,
+    pageRotateCcw: true,
+    cursorSelectTool: true,
+    cursorHandTool: true,
+    scrollVertical: true,
+    scrollHorizontal: true,
+    scrollWrapped: true,
+    spreadNone: true,
+    spreadOdd: true,
+    spreadEven: true,
+    documentProperties: true
+  },
+  toolbar: {
+    toolbarViewerLeft: {
+      findbar: true,
+      previous: true,
+      next: true,
+      pageNumber: true
+    },
+    toolbarViewerRight: {
+      presentationMode: true,
+      openFile: true,
+      print: true,
+      download: true,
+      viewBookmark: true
+    },
+    toolbarViewerMiddle: {
+      zoomOut: true,
+      zoomIn: true,
+      scaleSelectContainer: true
+    }
+  },
+  errorWrapper: true
+};
+
+export const getToolbarConfigValue = (config, path) => {
+  const props = path.split('.');
+  let currValue = config[props[0]];
+
+  for (let i = 1; i < props.length; i++) {
+    if (typeof currValue === 'object') {
+      currValue = currValue[props[i]];
+    } else break;
+  }
+  return currValue;
+};