From 107bf271ec05287dbbdd6ad1d8187a785f49db32 Mon Sep 17 00:00:00 2001 From: Adam Sinclair Date: Wed, 24 Jul 2024 10:00:12 -0700 Subject: [PATCH 1/2] Copy release/10.11 UI folder --- assets/icons/redact-icons-credit-card.svg | 4 +- assets/icons/redact-icons-email.svg | 4 +- assets/icons/redact-icons-image.svg | 4 +- assets/icons/redact-icons-phone-number.svg | 2 +- eslint-plugin-custom/package.json | 9 -- i18n/translation-bn.json | 8 +- i18n/translation-cs.json | 8 +- i18n/translation-de.json | 10 +- i18n/translation-el.json | 8 +- i18n/translation-en.json | 10 +- i18n/translation-es.json | 8 +- i18n/translation-fr.json | 8 +- i18n/translation-hi.json | 8 +- i18n/translation-hu.json | 8 +- i18n/translation-id.json | 6 +- i18n/translation-it.json | 8 +- i18n/translation-ja.json | 6 +- i18n/translation-ko.json | 8 +- i18n/translation-ms.json | 6 +- i18n/translation-nl.json | 8 +- i18n/translation-pl.json | 8 +- i18n/translation-pt_br.json | 8 +- i18n/translation-ro.json | 10 +- i18n/translation-ru.json | 10 +- i18n/translation-sv.json | 28 ++-- i18n/translation-th.json | 8 +- i18n/translation-tr.json | 8 +- i18n/translation-uk.json | 8 +- i18n/translation-vi.json | 10 +- i18n/translation-zh_cn.json | 8 +- i18n/translation-zh_tw.json | 8 +- jest/withMockRedux.js | 4 +- src/components/App/App.js | 3 +- src/components/Button/Button.scss | 28 ++-- src/components/Choice/Choice.scss | 6 +- src/components/ColorPalette/ColorPalette.scss | 19 ++- .../ColorPickerModal/ColorPickerModal.js | 9 +- .../ColorPickerModal/ColorPickerModal.scss | 42 ++++-- .../ColorPickerModal.stories.js | 9 +- .../CreatableList/CreatableList.stories.js | 6 +- .../CreatableList/CreatableListContainer.js | 47 +++---- .../CreatableMultiSelect.js | 21 ++- .../CreatableMultiSelect.scss | 5 + .../DocumentCropPopup/DocumentCropPopup.js | 19 +-- .../DocumentCropPopup/DocumentCropPopup.scss | 26 ++-- src/components/Dropdown/Dropdown.scss | 19 ++- .../FileAttachmentPanel.js | 2 +- .../FileAttachmentPanel.scss | 11 +- src/components/FilePicker/FilePicker.scss | 6 +- .../FontSizeDropdown/pdfEditHelper.js | 7 +- .../FormFieldEditPopup/FormFieldEditPopup.js | 77 +++++++++-- .../FormFieldEditPopup.scss | 10 +- .../FormFieldEditPopup.spec.js | 71 +++++++--- .../FormFieldEditPopup.stories.js | 21 +-- .../FormFieldEditPopupContainer.js | 125 +++++++++++------- .../FormFieldEditPopupIndicator.js | 12 +- .../FormFieldEditSignaturePopup.js | 52 +++++++- .../FormFieldEditSignaturePopup.stories.js | 12 +- .../SignatureOptionsDropdown.js | 26 ++-- .../Header/OfficeEditorToolsHeader.js | 4 +- .../InlineCommentingPopup.js | 3 + .../InlineCommentingPopupContainer.js | 7 +- .../InsertUploadedPagePanel.scss | 11 +- .../AppStories/Responsiveness.stories.js | 11 +- .../CustomButton/CustomButton.scss | 64 ++++----- .../RibbonGroup/RibbonGroup.js | 33 +++-- .../RibbonGroup/RibbonGroup.stories.js | 7 +- .../ModularComponents/TabPanel/TabPanel.js | 2 +- .../ToggleElementButton.js | 2 + .../ZoomControls/ZoomControls.js | 8 +- .../ZoomControls/ZoomControls.scss | 9 +- .../MoreOptionsContextMenuPopup.scss | 6 +- src/components/Note/Note.scss | 15 ++- src/components/NoteContent/NoteContent.js | 15 +-- src/components/NoteContent/NoteContent.scss | 18 ++- .../NoteTextPreview/NoteTextPreview.scss | 12 +- src/components/NotesPanel/NotesPanel.js | 12 -- .../OutlinesPanel/OutlinesPanel.scss | 4 + .../PageReplacementModal.scss | 7 +- src/components/Panel/Panel.js | 4 +- src/components/Panel/Panel.scss | 20 +-- src/components/Panel/Panel.stories.js | 30 +++-- .../PortfolioItemContent.js | 6 +- .../PortfolioItemContent.scss | 8 +- src/components/PrintModal/PrintModal.js | 47 ++++--- .../PrintModal/PrintModalContainer.js | 5 +- .../RedactionItem/RedactionItem.js | 11 +- .../RedactionItem/RedactionItem.scss | 22 +++ .../RedactionPageGroup.scss | 15 ++- .../RedactionPanel/RedactionPanel.js | 13 +- .../RedactionPanel/RedactionPanel.scss | 32 ++++- .../RedactionPanel/RedactionPanelContainer.js | 43 ++++-- .../RedactionSearchMultiSelect.js | 102 +++++++++++--- .../RedactionSearchMultiSelect.scss | 12 ++ .../RedactionSearchOverlay.scss | 4 - .../RedactionSearchPanel.spec.js | 2 +- .../RedactionSearchResult.scss | 9 +- .../RedactionSearchResults.js | 37 +++--- .../RedactionSearchResults.scss | 118 +++++++++++------ .../RedactionSearchResults.spec.js | 4 +- .../RedactionSearchResultsContainer.js | 9 +- .../RichTextStyleEditor.scss | 4 + .../RubberStampPanel/CustomRubberStamps.js | 13 +- .../RubberStampPanel/RubberStampPanel.js | 22 +-- .../RubberStampPanel/RubberStampPanel.scss | 27 ++-- src/components/SearchResult/SearchResult.scss | 9 +- .../SignatureListPanel/SavedSignatures.js | 12 +- .../SignatureListPanel.scss | 7 +- .../SignatureListPanel.spec.js | 43 ++++++ .../ImageSignature/ImageSignature.js | 8 +- .../ImageSignature/ImageSignature.scss | 4 + .../SignatureModal/SignatureModal.scss | 9 ++ .../SignaturePanel/WidgetInfo/WidgetInfo.js | 36 +++-- .../SignaturePanel/WidgetInfo/WidgetInfo.scss | 41 ++++-- .../SignatureValidationModal.js | 10 +- .../SignatureValidationModal.scss | 15 ++- .../SnippingToolPopup/SnippingToolPopup.js | 19 +-- .../SnippingToolPopup/SnippingToolPopup.scss | 14 +- src/components/StylePanel/StylePanel.js | 8 +- .../StylePicker/ColorPicker/ColorPicker.scss | 9 +- src/components/StylePicker/StylePicker.scss | 6 + .../TextStylePicker/TextStylePicker.js | 9 +- .../TextStylePicker/TextStylePicker.scss | 4 + .../TrackChangeOverlay/TrackChangeOverlay.js | 4 - src/constants/bookmarksOutlinesShared.scss | 22 ++- src/constants/commonColors.js | 11 ++ src/constants/dark.scss | 4 +- src/constants/light.scss | 9 +- src/constants/lightWCAG.scss | 7 +- src/constants/panel.scss | 2 +- src/constants/popup.scss | 3 + src/constants/styles.scss | 28 +++- src/constants/tabs.scss | 24 +++- src/helpers/downloadPdf.js | 20 +++ src/helpers/embeddedPrint.js | 8 +- src/helpers/itemToFlyoutHelper.js | 5 +- src/helpers/parseFontSize.js | 14 ++ src/helpers/parseFontSize.spec.js | 11 ++ .../useOnContextMenuOpen.js | 2 +- ...useOnFormFieldAnnotationAddedOrSelected.js | 7 + 140 files changed, 1516 insertions(+), 747 deletions(-) delete mode 100644 eslint-plugin-custom/package.json create mode 100644 src/components/CreatableMultiSelect/CreatableMultiSelect.scss create mode 100644 src/components/RedactionSearchOverlay/RedactionSearchMultiSelect/RedactionSearchMultiSelect.scss create mode 100644 src/components/SignatureListPanel/SignatureListPanel.spec.js create mode 100644 src/helpers/parseFontSize.js create mode 100644 src/helpers/parseFontSize.spec.js diff --git a/assets/icons/redact-icons-credit-card.svg b/assets/icons/redact-icons-credit-card.svg index a8710124e..f1202f972 100644 --- a/assets/icons/redact-icons-credit-card.svg +++ b/assets/icons/redact-icons-credit-card.svg @@ -1,4 +1,4 @@ - - + + diff --git a/assets/icons/redact-icons-email.svg b/assets/icons/redact-icons-email.svg index 0ca014ad0..ec67ee28b 100644 --- a/assets/icons/redact-icons-email.svg +++ b/assets/icons/redact-icons-email.svg @@ -1,4 +1,4 @@ - - + + diff --git a/assets/icons/redact-icons-image.svg b/assets/icons/redact-icons-image.svg index 6dab1e9ec..e03a60327 100644 --- a/assets/icons/redact-icons-image.svg +++ b/assets/icons/redact-icons-image.svg @@ -1,4 +1,4 @@ - - + + diff --git a/assets/icons/redact-icons-phone-number.svg b/assets/icons/redact-icons-phone-number.svg index c1f5887a6..d15e58a91 100644 --- a/assets/icons/redact-icons-phone-number.svg +++ b/assets/icons/redact-icons-phone-number.svg @@ -1,3 +1,3 @@ - + diff --git a/eslint-plugin-custom/package.json b/eslint-plugin-custom/package.json deleted file mode 100644 index 151cef29b..000000000 --- a/eslint-plugin-custom/package.json +++ /dev/null @@ -1,9 +0,0 @@ -{ - "name": "eslint-plugin-custom", - "version": "1.0.0", - "main": "index.js", - "dependencies": {}, - "peerDependencies": { - "eslint": "^6.8.0" - } -} \ No newline at end of file diff --git a/i18n/translation-bn.json b/i18n/translation-bn.json index b85004411..837fcff6e 100644 --- a/i18n/translation-bn.json +++ b/i18n/translation-bn.json @@ -311,7 +311,7 @@ "selectFile": "ফাইল নির্বাচন", "selectPageToReplace": "নথিতে যে পৃষ্ঠাগুলি আপনি প্রতিস্থাপন করতে চান তা নির্বাচন করুন৷", "embeddedFiles": "এমবেডেড ফাইল", - "pageNum": "পৃষ্ঠা সংখ্যা", + "pageNum": "পাতা", "viewBookmark": "পৃষ্ঠায় বুকমার্ক দেখুন", "error": "ত্রুটি", "errorPageNumber": "অবৈধ পৃষ্ঠা নম্বর। সীমা হল", @@ -428,7 +428,6 @@ "includeComments": "মন্তব্য অন্তর্ভুক্ত করুন", "printSettings": "প্রিন্ট সেটিংস", "printGrayscale": "গ্রেস্কেল প্রিন্ট করুন", - "flatten": "সমতল নথি", "printCurrentDisabled": "বর্তমান দৃশ্য শুধুমাত্র একটি একক পৃষ্ঠা দেখার সময় উপলব্ধ।" }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "টেক্সট, অঞ্চল, পৃষ্ঠা চিহ্নিত করে বা একটি অনুসন্ধান করে সংশোধন করা শুরু করুন।", - "redactionSearchPlaceholder": "কীওয়ার্ড অনুসন্ধান বা নিদর্শন দ্বারা যোগ করুন", + "redactionSearchPlaceholder": "কীবোর্ড বা নিদর্শন দ্বারা সংশোধন করুন", "redactionCounter": "সংস্কারের জন্য চিহ্নিত", "clearMarked": "স্পষ্ট", "redactAllMarked": "সমস্ত সংশোধন করুন", @@ -1151,7 +1150,7 @@ "phoneNumbers": "ফোন নাম্বারগুলো", "images": "ছবি", "emails": "ইমেইল", - "pattern": "প্যাটার্ন", + "pattern": "নিদর্শন", "start": "আপনার অনুসন্ধান করা শুরু করুন" } }, @@ -1177,6 +1176,7 @@ "createFolder": "ফোল্ডার তৈরি করুন", "portfolioPanelTitle": "পিডিএফ পোর্টফোলিও", "portfolioNewFolder": "নতুন ফোল্ডার", + "portfolioDocumentTitle": "নথির শিরোনাম", "portfolioFolderPlaceholder": "ফোল্ডারের নাম", "portfolioFilePlaceholder": "ফাইলের নাম", "folderNameAlreadyExists": "ফোল্ডারের নাম আগে থেকেই আছে", diff --git a/i18n/translation-cs.json b/i18n/translation-cs.json index cd32df296..9e0ea93d2 100644 --- a/i18n/translation-cs.json +++ b/i18n/translation-cs.json @@ -311,7 +311,7 @@ "selectFile": "Zvolte soubor", "selectPageToReplace": "Vyberte stránky v dokumentu, kterými chcete nahradit.", "embeddedFiles": "Vložené soubory", - "pageNum": "Číslo stránky", + "pageNum": "Strana", "viewBookmark": "Zobrazit záložku na stránce", "error": "Chyba", "errorPageNumber": "Neplatné číslo stránky. Limit je", @@ -428,7 +428,6 @@ "includeComments": "Zahrnout komentáře", "printSettings": "Nastavení tisku", "printGrayscale": "Tisk ve stupních šedi", - "flatten": "Vyrovnat dokument", "printCurrentDisabled": "Aktuální zobrazení je dostupné pouze při prohlížení jedné stránky." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Začněte redigovat označením textu, regionů, stránek nebo hledáním.", - "redactionSearchPlaceholder": "Přidejte podle vyhledávání klíčových slov nebo vzorů", + "redactionSearchPlaceholder": "Upravte pomocí klávesnice nebo vzorů", "redactionCounter": "Označeno k redigování", "clearMarked": "Průhledná", "redactAllMarked": "Upravit vše", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Telefonní čísla", "images": "snímky", "emails": "e-maily", - "pattern": "Vzor", + "pattern": "Vzory", "start": "Začněte hledat" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Vytvořit složku", "portfolioPanelTitle": "Portfolio PDF", "portfolioNewFolder": "Nová složka", + "portfolioDocumentTitle": "Název dokumentu", "portfolioFolderPlaceholder": "Název složky", "portfolioFilePlaceholder": "Název souboru", "folderNameAlreadyExists": "Název složky již existuje", diff --git a/i18n/translation-de.json b/i18n/translation-de.json index 1778185f7..3132bf60d 100644 --- a/i18n/translation-de.json +++ b/i18n/translation-de.json @@ -311,7 +311,7 @@ "selectFile": "Datei auswählen", "selectPageToReplace": "Wählen Sie die Seite(n) im Dokument aus, die Sie ersetzen möchten.", "embeddedFiles": "Eingebettete Dateien", - "pageNum": "Seitennummer", + "pageNum": "Seite", "viewBookmark": "Lesezeichen auf Seite anzeigen", "error": "Fehler", "errorPageNumber": "Ungültige Seitenzahl. Grenze ist", @@ -428,7 +428,6 @@ "includeComments": "Kommentare einfügen", "printSettings": "Druckeinstellungen", "printGrayscale": "Graustufen drucken", - "flatten": "Dokument reduzieren", "printCurrentDisabled": "Die aktuelle Ansicht ist nur beim Anzeigen einer einzelnen Seite verfügbar." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Beginnen Sie mit dem Schwärzen, indem Sie Text, Regionen, Seiten markieren oder eine Suche durchführen.", - "redactionSearchPlaceholder": "Hinzufügen nach Schlüsselwortsuche oder Mustern", + "redactionSearchPlaceholder": "Schwärzen per Tastatur oder Muster", "redactionCounter": "Zur Schwärzung markiert", "clearMarked": "Markierung entfernen", "redactAllMarked": "Alle schwärzen", @@ -1177,6 +1176,7 @@ "createFolder": "Ordner erstellen", "portfolioPanelTitle": "PDF-Portfolio", "portfolioNewFolder": "Neuer Ordner", + "portfolioDocumentTitle": "Dokumenttitel", "portfolioFolderPlaceholder": "Ordnernamen", "portfolioFilePlaceholder": "Dateiname", "folderNameAlreadyExists": "Der Ordnername existiert bereits", @@ -1224,7 +1224,9 @@ "viewOnly": "Nur anschauen", "viewOnlyDescription": "Ohne Vorschläge anzeigen", "notSupportedOnMobile": "Die Office-Bearbeitung wird auf Mobilgeräten nicht unterstützt.", - "previewAllChanges": "Vorschau aller Änderungen" + "previewAllChanges": "Vorschau aller Änderungen", + "accept": "Akzeptieren", + "reject": "Ablehnen" }, "insertPageModal": { "title": "Neue Seite hinzufügen", diff --git a/i18n/translation-el.json b/i18n/translation-el.json index 9ad6ec4c2..01fbdab65 100644 --- a/i18n/translation-el.json +++ b/i18n/translation-el.json @@ -311,7 +311,7 @@ "selectFile": "Επιλέξτε αρχείο", "selectPageToReplace": "Επιλέξτε τις σελίδες του εγγράφου με τις οποίες θέλετε να αντικαταστήσετε.", "embeddedFiles": "Ενσωματωμένα Αρχεία", - "pageNum": "Αριθμός σελίδας", + "pageNum": "Σελίδα", "viewBookmark": "Προβολή σελιδοδείκτη στη σελίδα", "error": "Λάθος", "errorPageNumber": "Μη έγκυρος αριθμός σελίδας. Όριο είναι", @@ -428,7 +428,6 @@ "includeComments": "Συμπεριλάβετε σχόλια", "printSettings": "Ρυθμίσεις εκτύπωσης", "printGrayscale": "Εκτύπωση κλίμακας του γκρι", - "flatten": "Ισοπεδώστε το έγγραφο", "printCurrentDisabled": "Η τρέχουσα προβολή είναι διαθέσιμη μόνο κατά την προβολή μιας σελίδας." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Ξεκινήστε τη σύνταξη επισημαίνοντας κείμενο, περιοχές, σελίδες ή κάνοντας μια αναζήτηση.", - "redactionSearchPlaceholder": "Προσθήκη κατά αναζήτηση λέξης-κλειδιού ή μοτίβα", + "redactionSearchPlaceholder": "Επεξεργασία με πληκτρολόγιο ή μοτίβα", "redactionCounter": "Επισήμανση για Επιμέλεια", "clearMarked": "Σαφή", "redactAllMarked": "Διορθώστε όλα", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Τηλεφωνικοί αριθμοί", "images": "εικόνες", "emails": "Email", - "pattern": "Πρότυπο", + "pattern": "Μοτίβα", "start": "Ξεκινήστε να κάνετε την αναζήτησή σας" } }, @@ -1177,6 +1176,7 @@ "createFolder": "ΔΗΜΙΟΥΡΓΩ φακελο", "portfolioPanelTitle": "Χαρτοφυλάκιο PDF", "portfolioNewFolder": "Νέος φάκελος", + "portfolioDocumentTitle": "Τίτλος εγγράφου", "portfolioFolderPlaceholder": "Ονομα φακέλου", "portfolioFilePlaceholder": "Ονομα αρχείου", "folderNameAlreadyExists": "Το όνομα φακέλου υπάρχει ήδη", diff --git a/i18n/translation-en.json b/i18n/translation-en.json index 4a34a5f01..2f50000dc 100644 --- a/i18n/translation-en.json +++ b/i18n/translation-en.json @@ -311,7 +311,7 @@ "selectFile": "Select file", "selectPageToReplace": "Select the pages in the document you would like to replace with.", "embeddedFiles": "Embedded Files", - "pageNum": "Page Number", + "pageNum": "Page", "viewBookmark": "View Bookmark on Page", "error": "Error", "errorPageNumber": "Invalid page number. Limit is ", @@ -428,7 +428,6 @@ "includeComments": "Include comments", "printSettings": "Print Settings", "printGrayscale": "Print Grayscale", - "flatten": "Flatten document", "printCurrentDisabled": "Current view is only available when viewing a single page." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Start redacting by marking text, regions, pages or making a search.", - "redactionSearchPlaceholder": "Add by keyword search or patterns", + "redactionSearchPlaceholder": "Redact by keyboard or patterns", "redactionCounter": "Marked for Redaction", "clearMarked": "Clear", "redactAllMarked": "Redact All", @@ -1145,13 +1144,13 @@ }, "expand": "Expand", "collapse": "Collapse", - "searchResults": "Search results", + "searchResults": "Search Results", "search": { "creditCards": "Credit Card", "phoneNumbers": "Phone Numbers", "images": "Images", "emails": "Emails", - "pattern": "Pattern", + "pattern": "Patterns", "start": "Start making your search" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Create Folder", "portfolioPanelTitle": "PDF Portfolio", "portfolioNewFolder": "New Folder", + "portfolioDocumentTitle": "Document Title", "portfolioFolderPlaceholder": "Folder Name", "portfolioFilePlaceholder": "File Name", "folderNameAlreadyExists": "Folder name already exists", diff --git a/i18n/translation-es.json b/i18n/translation-es.json index f9dca2220..d58557cc7 100644 --- a/i18n/translation-es.json +++ b/i18n/translation-es.json @@ -311,7 +311,7 @@ "selectFile": "Seleccione Archivo", "selectPageToReplace": "Seleccione las páginas del documento por las que le gustaría reemplazar.", "embeddedFiles": "Archivos incrustados", - "pageNum": "Número de página", + "pageNum": "Página", "viewBookmark": "Ver marcador en la página", "error": "Error", "errorPageNumber": "Número de página no válido. El límite es", @@ -428,7 +428,6 @@ "includeComments": "Incluir comentarios", "printSettings": "Configuración de impresión", "printGrayscale": "Imprimir en escala de grises", - "flatten": "Aplanar documento", "printCurrentDisabled": "La vista actual solo está disponible cuando se visualiza una sola página." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Comience a redactar marcando texto, regiones, páginas o realizando una búsqueda.", - "redactionSearchPlaceholder": "Agregar por búsqueda de palabra clave o patrones", + "redactionSearchPlaceholder": "Redactar por teclado o patrones", "redactionCounter": "Marcado para Redacción", "clearMarked": "Claro", "redactAllMarked": "Redactar todo", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Números de teléfono", "images": "Imágenes", "emails": "Correos electrónicos", - "pattern": "Patrón", + "pattern": "Patrones", "start": "Empieza a hacer tu búsqueda" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Crear carpeta", "portfolioPanelTitle": "Portafolio PDF", "portfolioNewFolder": "Nueva carpeta", + "portfolioDocumentTitle": "Titulo del documento", "portfolioFolderPlaceholder": "Nombre de la carpeta", "portfolioFilePlaceholder": "Nombre del archivo", "folderNameAlreadyExists": "El nombre de la carpeta ya existe", diff --git a/i18n/translation-fr.json b/i18n/translation-fr.json index 2014f1e0d..dddf2b79e 100644 --- a/i18n/translation-fr.json +++ b/i18n/translation-fr.json @@ -311,7 +311,7 @@ "selectFile": "Choisir le dossier", "selectPageToReplace": "Sélectionnez les pages du document que vous souhaitez remplacer.", "embeddedFiles": "Fichiers intégrés", - "pageNum": "Numéro de page", + "pageNum": "Page", "viewBookmark": "Afficher le signet sur la page", "error": "Erreur", "errorPageNumber": "Numéro de page invalide. La limite est", @@ -428,7 +428,6 @@ "includeComments": "Inclure les commentaires", "printSettings": "Paramètres d'impression", "printGrayscale": "Imprimer en niveaux de gris", - "flatten": "Aplatir le document", "printCurrentDisabled": "La vue actuelle n'est disponible que lors de l'affichage d'une seule page." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Commencez à rédiger en marquant du texte, des régions, des pages ou en effectuant une recherche.", - "redactionSearchPlaceholder": "Ajouter par recherche par mot-clé ou modèles", + "redactionSearchPlaceholder": "Rédiger par clavier ou par modèles", "redactionCounter": "Marqué pour rédaction", "clearMarked": "Dégager", "redactAllMarked": "Tout expurger", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Les numéros de téléphone", "images": "Images", "emails": "E-mails", - "pattern": "Modèle", + "pattern": "Motifs", "start": "Commencez à faire votre recherche" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Créer le dossier", "portfolioPanelTitle": "Portfolio PDF", "portfolioNewFolder": "Nouveau dossier", + "portfolioDocumentTitle": "Titre du document", "portfolioFolderPlaceholder": "Nom de dossier", "portfolioFilePlaceholder": "Nom de fichier", "folderNameAlreadyExists": "Le nom du dossier existe déjà", diff --git a/i18n/translation-hi.json b/i18n/translation-hi.json index 509e20cf4..244f29273 100644 --- a/i18n/translation-hi.json +++ b/i18n/translation-hi.json @@ -311,7 +311,7 @@ "selectFile": "फ़ाइल का चयन करें", "selectPageToReplace": "दस्तावेज़ में उन पृष्ठों का चयन करें जिनसे आप बदलना चाहते हैं।", "embeddedFiles": "एंबेडेड फ़ाइलें", - "pageNum": "पृष्ठ संख्या", + "pageNum": "पृष्ठ", "viewBookmark": "पेज पर बुकमार्क देखें", "error": "त्रुटि", "errorPageNumber": "अमान्य पृष्ठ संख्या। सीमा है", @@ -428,7 +428,6 @@ "includeComments": "टिप्पणियाँ शामिल करें", "printSettings": "प्रिंट सेटिंग्स", "printGrayscale": "ग्रेस्केल प्रिंट करें", - "flatten": "दस्तावेज़ समतल करें", "printCurrentDisabled": "वर्तमान दृश्य केवल एकल पृष्ठ देखने पर ही उपलब्ध होता है।" }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "पाठ, क्षेत्रों, पृष्ठों को चिह्नित करके या खोज करके पुनः अभिनय करना प्रारंभ करें।", - "redactionSearchPlaceholder": "कीवर्ड खोज या पैटर्न द्वारा जोड़ें", + "redactionSearchPlaceholder": "कीबोर्ड या पैटर्न द्वारा संपादित करें", "redactionCounter": "रिडक्शन के लिए चिह्नित", "clearMarked": "स्पष्ट", "redactAllMarked": "Redact All", @@ -1151,7 +1150,7 @@ "phoneNumbers": "दूरभाष संख्या", "images": "इमेजिस", "emails": "ईमेल", - "pattern": "प्रतिरूप", + "pattern": "पैटर्न्स", "start": "अपनी खोज शुरू करें" } }, @@ -1177,6 +1176,7 @@ "createFolder": "फोल्डर बनाएं", "portfolioPanelTitle": "पीडीएफ पोर्टफोलियो", "portfolioNewFolder": "नया फ़ोल्डर", + "portfolioDocumentTitle": "दस्तावेज़ का शीर्षक", "portfolioFolderPlaceholder": "फ़ोल्डर का नाम", "portfolioFilePlaceholder": "फ़ाइल का नाम", "folderNameAlreadyExists": "फ़ोल्डर नाम पहले से मौजूद है", diff --git a/i18n/translation-hu.json b/i18n/translation-hu.json index c048af0d7..109919295 100644 --- a/i18n/translation-hu.json +++ b/i18n/translation-hu.json @@ -311,7 +311,7 @@ "selectFile": "Válaszd ki a fájlt", "selectPageToReplace": "Válassza ki a dokumentum azon oldalait, amelyekre le szeretné cserélni.", "embeddedFiles": "Beágyazott fájlok", - "pageNum": "Oldalszám", + "pageNum": "oldal", "viewBookmark": "Könyvjelző megtekintése az oldalon", "error": "Hiba", "errorPageNumber": "Érvénytelen oldalszám. A határ az", @@ -428,7 +428,6 @@ "includeComments": "Tartalmazza a megjegyzéseket", "printSettings": "Nyomtatási beállítások", "printGrayscale": "Nyomtatás Szürkeárnyalatos", - "flatten": "Lapos dokumentum", "printCurrentDisabled": "Az aktuális nézet csak egyetlen oldal megtekintésekor érhető el." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Kezdje el a szerkesztést szöveg, régiók, oldalak megjelölésével vagy kereséssel.", - "redactionSearchPlaceholder": "Hozzáadás kulcsszavas kereséssel vagy mintákkal", + "redactionSearchPlaceholder": "Szerkesztés billentyűzet vagy minták alapján", "redactionCounter": "Szerkesztésre megjelölve", "clearMarked": "Egyértelmű", "redactAllMarked": "Összes szerkesztése", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Telefonszámok", "images": "Képek", "emails": "E-mailek", - "pattern": "Minta", + "pattern": "Minták", "start": "Kezdje el a keresést" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Mappa létrehozás", "portfolioPanelTitle": "PDF portfólió", "portfolioNewFolder": "Új mappa", + "portfolioDocumentTitle": "Dokumentum címe", "portfolioFolderPlaceholder": "Mappa neve", "portfolioFilePlaceholder": "Fájl név", "folderNameAlreadyExists": "A mappanév már létezik", diff --git a/i18n/translation-id.json b/i18n/translation-id.json index 3f5c4d160..c6860b1af 100644 --- a/i18n/translation-id.json +++ b/i18n/translation-id.json @@ -311,7 +311,7 @@ "selectFile": "Pilih file", "selectPageToReplace": "Pilih halaman dalam dokumen yang ingin Anda ganti.", "embeddedFiles": "File Tertanam", - "pageNum": "Nomor halaman", + "pageNum": "Halaman", "viewBookmark": "Lihat Bookmark di Halaman", "error": "Kesalahan", "errorPageNumber": "Nomor halaman tidak valid. Batasnya adalah", @@ -428,7 +428,6 @@ "includeComments": "Sertakan komentar", "printSettings": "Pengaturan Cetak", "printGrayscale": "Cetak Skala abu-abu", - "flatten": "Ratakan dokumen", "printCurrentDisabled": "Tampilan saat ini hanya tersedia saat melihat satu halaman." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Mulai menyunting dengan menandai teks, wilayah, halaman, atau melakukan pencarian.", - "redactionSearchPlaceholder": "Tambahkan dengan pencarian atau pola kata kunci", + "redactionSearchPlaceholder": "Sunting berdasarkan keyboard atau pola", "redactionCounter": "Ditandai untuk Redaksi", "clearMarked": "Jernih", "redactAllMarked": "Redaksi Semua", @@ -1177,6 +1176,7 @@ "createFolder": "Membuat folder", "portfolioPanelTitle": "Portofolio PDF", "portfolioNewFolder": "Folder baru", + "portfolioDocumentTitle": "Judul dokumen", "portfolioFolderPlaceholder": "Nama folder", "portfolioFilePlaceholder": "Nama file", "folderNameAlreadyExists": "Nama folder sudah ada", diff --git a/i18n/translation-it.json b/i18n/translation-it.json index c0b14b308..854fab22e 100644 --- a/i18n/translation-it.json +++ b/i18n/translation-it.json @@ -311,7 +311,7 @@ "selectFile": "Seleziona il file", "selectPageToReplace": "Seleziona le pagine del documento con cui desideri sostituire.", "embeddedFiles": "File incorporati", - "pageNum": "Numero di pagina", + "pageNum": "Pagina", "viewBookmark": "Visualizza segnalibro sulla pagina", "error": "Errore", "errorPageNumber": "Numero di pagina non valido. Il limite è", @@ -428,7 +428,6 @@ "includeComments": "Includi commenti", "printSettings": "Impostazioni di stampa", "printGrayscale": "Stampa scala di grigi", - "flatten": "Documento appiattito", "printCurrentDisabled": "La visualizzazione corrente è disponibile solo quando si visualizza una singola pagina." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Inizia a redigere contrassegnando testo, regioni, pagine o effettuando una ricerca.", - "redactionSearchPlaceholder": "Aggiungi per ricerca per parola chiave o modelli", + "redactionSearchPlaceholder": "Redigere tramite tastiera o modelli", "redactionCounter": "Contrassegnato per la redazione", "clearMarked": "Chiaro", "redactAllMarked": "Redigere tutto", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Numeri di telefono", "images": "immagini", "emails": "E-mail", - "pattern": "Modello", + "pattern": "Modelli", "start": "Inizia a fare la tua ricerca" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Creare una cartella", "portfolioPanelTitle": "Portafoglio PDF", "portfolioNewFolder": "Nuova cartella", + "portfolioDocumentTitle": "Titolo del documento", "portfolioFolderPlaceholder": "Nome della cartella", "portfolioFilePlaceholder": "Nome del file", "folderNameAlreadyExists": "Il nome della cartella esiste già", diff --git a/i18n/translation-ja.json b/i18n/translation-ja.json index 4b2d91a22..08eef1562 100644 --- a/i18n/translation-ja.json +++ b/i18n/translation-ja.json @@ -311,7 +311,7 @@ "selectFile": "ファイルを選ぶ", "selectPageToReplace": "ドキュメント内の入れ替えたいページを選択します。", "embeddedFiles": "埋め込みファイル", - "pageNum": "ページ番号", + "pageNum": "ページ", "viewBookmark": "ページにブックマークを表示", "error": "エラー", "errorPageNumber": "ページ番号が無効です。限界は", @@ -428,7 +428,6 @@ "includeComments": "コメントを含める", "printSettings": "印刷設定", "printGrayscale": "グレースケール印刷", - "flatten": "ドキュメントをフラット化する", "printCurrentDisabled": "現在のビューは、単一のページを表示する場合にのみ使用できます。" }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "テキスト、地域、ページにマークを付けるか、検索して、編集を開始します。", - "redactionSearchPlaceholder": "キーワード検索またはパターンで追加", + "redactionSearchPlaceholder": "キーボードまたはパターンによる編集", "redactionCounter": "墨消しのマーク", "clearMarked": "クリア", "redactAllMarked": "すべて編集", @@ -1177,6 +1176,7 @@ "createFolder": "フォルダーを作る", "portfolioPanelTitle": "PDFポートフォリオ", "portfolioNewFolder": "新しいフォルダー", + "portfolioDocumentTitle": "ドキュメントのタイトル", "portfolioFolderPlaceholder": "フォルダ名", "portfolioFilePlaceholder": "ファイル名", "folderNameAlreadyExists": "フォルダ名はすでに存在します", diff --git a/i18n/translation-ko.json b/i18n/translation-ko.json index 61e902ca6..257c4cec8 100644 --- a/i18n/translation-ko.json +++ b/i18n/translation-ko.json @@ -311,7 +311,7 @@ "selectFile": "파일선택", "selectPageToReplace": "문서에서 교체할 페이지를 선택하세요.", "embeddedFiles": "포함된 파일", - "pageNum": "페이지 번호", + "pageNum": "페이지", "viewBookmark": "페이지에서 책갈피 보기", "error": "오류", "errorPageNumber": "잘못된 페이지 번호입니다. 한도", @@ -428,7 +428,6 @@ "includeComments": "댓글포함", "printSettings": "인쇄 설정", "printGrayscale": "인쇄 그레이스케일", - "flatten": "문서 병합", "printCurrentDisabled": "현재 보기는 단일 페이지를 볼 때만 사용할 수 있습니다." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "텍스트, 지역, 페이지를 표시하거나 검색하여 수정을 시작하세요.", - "redactionSearchPlaceholder": "키워드 검색 또는 패턴으로 추가", + "redactionSearchPlaceholder": "키보드 또는 패턴으로 수정", "redactionCounter": "표시 수정", "clearMarked": "표시 지우기", "redactAllMarked": "모두 수정", @@ -1145,7 +1144,7 @@ }, "expand": "확대", "collapse": "축소", - "searchResults": "검색결과", + "searchResults": "검색 결과", "search": { "creditCards": "신용카드", "phoneNumbers": "전화번호", @@ -1177,6 +1176,7 @@ "createFolder": "폴더 만들기", "portfolioPanelTitle": "PDF 포트폴리오", "portfolioNewFolder": "새 폴더", + "portfolioDocumentTitle": "문서 제목", "portfolioFolderPlaceholder": "폴더 이름", "portfolioFilePlaceholder": "파일 이름", "folderNameAlreadyExists": "폴더 이름이 이미 존재합니다", diff --git a/i18n/translation-ms.json b/i18n/translation-ms.json index 6e40a8e07..327720db4 100644 --- a/i18n/translation-ms.json +++ b/i18n/translation-ms.json @@ -311,7 +311,7 @@ "selectFile": "Pilih fail", "selectPageToReplace": "Pilih halaman dalam dokumen yang anda ingin gantikan.", "embeddedFiles": "Fail Terbenam", - "pageNum": "Mukasurat", + "pageNum": "Halaman", "viewBookmark": "Lihat Penanda Halaman pada Halaman", "error": "ralat", "errorPageNumber": "Nombor halaman tidak sah. Had ialah", @@ -428,7 +428,6 @@ "includeComments": "Sertakan ulasan", "printSettings": "Tetapan Cetak", "printGrayscale": "Cetak Skala Kelabu", - "flatten": "Ratakan dokumen", "printCurrentDisabled": "Paparan semasa hanya tersedia apabila melihat satu halaman." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Mula menyunting dengan menandakan teks, kawasan, halaman atau membuat carian.", - "redactionSearchPlaceholder": "Tambahkan mengikut carian kata kunci atau corak", + "redactionSearchPlaceholder": "Redaksi mengikut papan kekunci atau corak", "redactionCounter": "Ditanda untuk Redaksi", "clearMarked": "Jelas", "redactAllMarked": "Redaksi Semua", @@ -1177,6 +1176,7 @@ "createFolder": "Buat Folder", "portfolioPanelTitle": "Portfolio PDF", "portfolioNewFolder": "Fail baharu", + "portfolioDocumentTitle": "Tajuk dokumen", "portfolioFolderPlaceholder": "Nama folder", "portfolioFilePlaceholder": "Nama fail", "folderNameAlreadyExists": "Nama folder sudah wujud", diff --git a/i18n/translation-nl.json b/i18n/translation-nl.json index d6d477760..181a54991 100644 --- a/i18n/translation-nl.json +++ b/i18n/translation-nl.json @@ -311,7 +311,7 @@ "selectFile": "Selecteer bestand", "selectPageToReplace": "Selecteer de pagina's in het document die u wilt vervangen.", "embeddedFiles": "Ingesloten bestanden", - "pageNum": "Paginanummer", + "pageNum": "Bladzijde", "viewBookmark": "Bekijk bladwijzer op pagina", "error": "Fout", "errorPageNumber": "Ongeldig paginanummer. Limiet is", @@ -428,7 +428,6 @@ "includeComments": "Inclusief commentaar", "printSettings": "Afdrukinstellingen", "printGrayscale": "Grijstinten afdrukken", - "flatten": "Document plat maken", "printCurrentDisabled": "De huidige weergave is alleen beschikbaar als u één pagina bekijkt." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Begin met redigeren door tekst, regio's, pagina's te markeren of een zoekopdracht uit te voeren.", - "redactionSearchPlaceholder": "Toevoegen op trefwoord zoeken of patronen", + "redactionSearchPlaceholder": "Redigeren via toetsenbord of patronen", "redactionCounter": "Gemarkeerd voor redactie", "clearMarked": "Duidelijk", "redactAllMarked": "Alles redigeren", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Telefoonnummers", "images": "Afbeeldingen", "emails": "E-mails", - "pattern": "Patroon", + "pattern": "Patronen", "start": "Begin met zoeken" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Map aanmaken", "portfolioPanelTitle": "PDF-portfolio", "portfolioNewFolder": "Nieuwe map", + "portfolioDocumentTitle": "Document titel", "portfolioFolderPlaceholder": "Naam van de map", "portfolioFilePlaceholder": "Bestandsnaam", "folderNameAlreadyExists": "Mapnaam bestaat al", diff --git a/i18n/translation-pl.json b/i18n/translation-pl.json index 0b71afbc9..ff77a3fa9 100644 --- a/i18n/translation-pl.json +++ b/i18n/translation-pl.json @@ -311,7 +311,7 @@ "selectFile": "Wybierz plik", "selectPageToReplace": "Wybierz strony w dokumencie, którymi chcesz zastąpić.", "embeddedFiles": "Osadzone pliki", - "pageNum": "Numer strony", + "pageNum": "Strona", "viewBookmark": "Wyświetl zakładkę na stronie", "error": "Błąd", "errorPageNumber": "Nieprawidłowy numer strony. Limit to", @@ -428,7 +428,6 @@ "includeComments": "Dołącz komentarze", "printSettings": "Ustawienia drukowania", "printGrayscale": "Drukuj w skali szarości", - "flatten": "Spłaszcz dokument", "printCurrentDisabled": "Widok bieżący jest dostępny tylko podczas przeglądania pojedynczej strony." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Zacznij redagować, zaznaczając tekst, regiony, strony lub przeprowadzając wyszukiwanie.", - "redactionSearchPlaceholder": "Dodaj według wyszukiwania słów kluczowych lub wzorców", + "redactionSearchPlaceholder": "Redaguj za pomocą klawiatury lub wzorców", "redactionCounter": "Oznaczone do redakcji", "clearMarked": "Wyczyść zaznaczone", "redactAllMarked": "Redaguj wszystko", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Numery telefoniczne", "images": "Obrazy", "emails": "E-maile", - "pattern": "Wzorzec", + "pattern": "Wzory", "start": "Rozpocznij wyszukiwanie" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Utwórz folder", "portfolioPanelTitle": "Portfolio PDF", "portfolioNewFolder": "Nowy folder", + "portfolioDocumentTitle": "Tytuł dokumentu", "portfolioFolderPlaceholder": "Nazwa folderu", "portfolioFilePlaceholder": "Nazwa pliku", "folderNameAlreadyExists": "Nazwa folderu już istnieje", diff --git a/i18n/translation-pt_br.json b/i18n/translation-pt_br.json index 11675ebfc..88657a59f 100644 --- a/i18n/translation-pt_br.json +++ b/i18n/translation-pt_br.json @@ -311,7 +311,7 @@ "selectFile": "Selecione o arquivo", "selectPageToReplace": "Selecione as páginas do documento que deseja substituir.", "embeddedFiles": "Arquivos incorporados", - "pageNum": "Número de página", + "pageNum": "Página", "viewBookmark": "Ver marcador na página", "error": "Erro", "errorPageNumber": "Número de página inválido. Limite é", @@ -428,7 +428,6 @@ "includeComments": "Incluir comentários", "printSettings": "Configurações de impressão", "printGrayscale": "Imprimir escala de cinza", - "flatten": "Achatar documento", "printCurrentDisabled": "A visualização atual só está disponível ao visualizar uma única página." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Comece a redigir marcando texto, regiões, páginas ou fazendo uma pesquisa.", - "redactionSearchPlaceholder": "Adicionar por pesquisa de palavras-chave ou padrões", + "redactionSearchPlaceholder": "Editar por teclado ou padrões", "redactionCounter": "Marcado para redação", "clearMarked": "Claro", "redactAllMarked": "Redigir tudo", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Números de telefone", "images": "Imagens", "emails": "E-mails", - "pattern": "Padrão", + "pattern": "Padrões", "start": "Comece a fazer sua pesquisa" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Criar pasta", "portfolioPanelTitle": "Portfólio PDF", "portfolioNewFolder": "Nova pasta", + "portfolioDocumentTitle": "Título do documento", "portfolioFolderPlaceholder": "Nome da pasta", "portfolioFilePlaceholder": "Nome do arquivo", "folderNameAlreadyExists": "O nome da pasta já existe", diff --git a/i18n/translation-ro.json b/i18n/translation-ro.json index d0185c7d6..ecc0b4e44 100644 --- a/i18n/translation-ro.json +++ b/i18n/translation-ro.json @@ -311,7 +311,7 @@ "selectFile": "Selectați fișierul", "selectPageToReplace": "Selectați paginile din document cu care doriți să le înlocuiți.", "embeddedFiles": "Fișiere încorporate", - "pageNum": "Numărul paginii", + "pageNum": "Pagină", "viewBookmark": "Vizualizați marcajul pe pagină", "error": "Eroare", "errorPageNumber": "Număr de pagină nevalid. Limita este", @@ -428,7 +428,6 @@ "includeComments": "Includeți comentarii", "printSettings": "Setări de imprimare", "printGrayscale": "Imprimare în tonuri de gri", - "flatten": "Aplatizați documentul", "printCurrentDisabled": "Vizualizarea curentă este disponibilă numai când vizualizați o singură pagină." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Începeți să redactați prin marcarea textului, regiunilor, paginilor sau efectuând o căutare.", - "redactionSearchPlaceholder": "Adăugați prin căutare de cuvinte cheie sau modele", + "redactionSearchPlaceholder": "Redactați după tastatură sau modele", "redactionCounter": "Marcat pentru redactare", "clearMarked": "clar", "redactAllMarked": "Redact All", @@ -1145,13 +1144,13 @@ }, "expand": "Extinde", "collapse": "Colaps", - "searchResults": "Rezultatele cautarii", + "searchResults": "rezultatele cautarii", "search": { "creditCards": "Card de credit", "phoneNumbers": "Numere de telefon", "images": "Imagini", "emails": "E-mailuri", - "pattern": "Model", + "pattern": "Modele", "start": "Începeți să căutați" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Creeaza dosar", "portfolioPanelTitle": "Portofoliu PDF", "portfolioNewFolder": "Dosar nou", + "portfolioDocumentTitle": "Titlul documentului", "portfolioFolderPlaceholder": "Numele fisierului", "portfolioFilePlaceholder": "Nume de fișier", "folderNameAlreadyExists": "Numele dosarului există deja", diff --git a/i18n/translation-ru.json b/i18n/translation-ru.json index 89d6e79e9..eb6cf68ec 100644 --- a/i18n/translation-ru.json +++ b/i18n/translation-ru.json @@ -311,7 +311,7 @@ "selectFile": "Выберите файл", "selectPageToReplace": "Выберите страницы в документе, которые вы хотите заменить.", "embeddedFiles": "Встроенные файлы", - "pageNum": "Номер страницы", + "pageNum": "Страница", "viewBookmark": "Посмотреть закладку на странице", "error": "Ошибка", "errorPageNumber": "Неверный номер страницы. Лимит", @@ -428,7 +428,6 @@ "includeComments": "Приложить комментарии", "printSettings": "Параметры печати", "printGrayscale": "Печать оттенков серого", - "flatten": "Сгладить документ", "printCurrentDisabled": "Текущий вид доступен только при просмотре одной страницы." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Начните редактирование, пометив текст, области, страницы или выполнив поиск.", - "redactionSearchPlaceholder": "Добавить по ключевому слову или шаблонам", + "redactionSearchPlaceholder": "Редактирование с помощью клавиатуры или шаблонов", "redactionCounter": "Помечено для редактирования", "clearMarked": "Прозрачный", "redactAllMarked": "Редактировать все", @@ -1145,13 +1144,13 @@ }, "expand": "Расширять", "collapse": "Крах", - "searchResults": "Результаты поиска", + "searchResults": "результаты поиска", "search": { "creditCards": "Кредитная карта", "phoneNumbers": "Телефонные номера", "images": "Картинки", "emails": "электронные письма", - "pattern": "Шаблон", + "pattern": "Узоры", "start": "Начните поиск" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Создать папку", "portfolioPanelTitle": "PDF-портфолио", "portfolioNewFolder": "Новая папка", + "portfolioDocumentTitle": "Заголовок документа", "portfolioFolderPlaceholder": "Имя папки", "portfolioFilePlaceholder": "Имя файла", "folderNameAlreadyExists": "Имя папки уже существует", diff --git a/i18n/translation-sv.json b/i18n/translation-sv.json index e9757d6bc..2027b9288 100644 --- a/i18n/translation-sv.json +++ b/i18n/translation-sv.json @@ -166,12 +166,12 @@ "formFillDot": "Punkt", "signature": "Signatur", "snipping": "Beskärningsverktyg", - "squiggly": "Snyggt", + "squiggly": "Snirklig", "stamp": "Stämpel", "stickyNote": "Notera", "strikeout": "Överstrykning", "underline": "Understrykning", - "custom": "Beställnings", + "custom": "Anpassad", "rubberStamp": "Gummistämpel", "note": "Notera", "textField": "Textfält", @@ -210,7 +210,7 @@ "SHWitness": "Bevittna", "SHInitialHere": "Inledande här", "SHAccepted": "Accepterad", - "SBRejected": "avvisade" + "SBRejected": "Avvisade" }, "component": { "attachmentPanel": "Bilagor", @@ -311,7 +311,7 @@ "selectFile": "Välj fil", "selectPageToReplace": "Välj sidorna i dokumentet som du vill ersätta med.", "embeddedFiles": "Inbäddade filer", - "pageNum": "Sidonummer", + "pageNum": "Sida", "viewBookmark": "Visa bokmärke på sidan", "error": "Fel", "errorPageNumber": "Ogiltigt sidnummer. Gränsen är", @@ -321,7 +321,7 @@ "option": { "type": { "caret": "Markör", - "custom": "Beställnings", + "custom": "Anpassad", "ellipse": "Ellips", "fileattachment": "Bifogad fil", "freehand": "Fri hand", @@ -369,7 +369,7 @@ "toolbarGroup-Redact": "Redigera" }, "annotationColor": { - "StrokeColor": "Stroke", + "StrokeColor": "Streck", "FillColor": "Fylla", "TextColor": "Text" }, @@ -428,7 +428,6 @@ "includeComments": "Inkludera kommentarer", "printSettings": "Utskriftsinställningar", "printGrayscale": "Skriv ut gråskala", - "flatten": "Platta till dokument", "printCurrentDisabled": "Aktuell vy är endast tillgänglig när du visar en enskild sida." }, "printInfo": { @@ -441,7 +440,7 @@ }, "searchPanel": { "caseSensitive": "Skiftlägeskänsliga", - "wholeWordOnly": "Hela världen", + "wholeWordOnly": "Hela ord", "wildcard": "Jokertecken", "replace": "Byta ut", "replaceAll": "Ersätt alla", @@ -501,7 +500,7 @@ }, "state": { "accepted": "Accepterad", - "rejected": "avvisade", + "rejected": "Avvisade", "completed": "Avslutad", "cancelled": "Inställt", "set": "Ange status:", @@ -534,7 +533,7 @@ "measurement": { "scaleModal": { "calibrate": "Kalibrera", - "custom": "Beställnings", + "custom": "Anpassad", "fractionalUnits": "Fraktionella enheter", "precision": "Precision", "preset": "Förinställa", @@ -676,7 +675,7 @@ "title": "Stil" }, "settings": { - "settings": "inställningar", + "settings": "Inställningar", "searchSettings": "Sökinställningar", "general": "Allmän", "language": "Språk", @@ -849,7 +848,7 @@ "Marquee": "Marquee Zoom", "Link": "Länk URL eller sida", "Standard": "Standard", - "Custom": "Beställnings" + "Custom": "Anpassad" }, "link": { "url": "URL", @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Börja redigera genom att markera text, regioner, sidor eller göra en sökning.", - "redactionSearchPlaceholder": "Lägg till genom nyckelordssökning eller mönster", + "redactionSearchPlaceholder": "Redigera med tangentbord eller mönster", "redactionCounter": "Markerad för redigering", "clearMarked": "Klar", "redactAllMarked": "Redigera alla", @@ -1177,6 +1176,7 @@ "createFolder": "Skapa mapp", "portfolioPanelTitle": "PDF-portfölj", "portfolioNewFolder": "Ny mapp", + "portfolioDocumentTitle": "Dokument titel", "portfolioFolderPlaceholder": "Mapp namn", "portfolioFilePlaceholder": "Filnamn", "folderNameAlreadyExists": "Mappnamnet finns redan", @@ -1254,7 +1254,7 @@ "letter": "Brev", "halfLetter": "Halv bokstav", "juniorLegal": "Junior juridisk", - "custom": "Beställnings" + "custom": "Anpassad" }, "units": "Enheter" }, diff --git a/i18n/translation-th.json b/i18n/translation-th.json index a7434907b..3f8243ddd 100644 --- a/i18n/translation-th.json +++ b/i18n/translation-th.json @@ -311,7 +311,7 @@ "selectFile": "เลือกไฟล์", "selectPageToReplace": "เลือกหน้าในเอกสารที่คุณต้องการแทนที่ด้วย", "embeddedFiles": "ไฟล์ที่ฝังตัว", - "pageNum": "เลขหน้า", + "pageNum": "หน้าหนังสือ", "viewBookmark": "ดูบุ๊กมาร์กบนเพจ", "error": "ข้อผิดพลาด", "errorPageNumber": "หมายเลขหน้าไม่ถูกต้อง ขีดจำกัดคือ", @@ -428,7 +428,6 @@ "includeComments": "รวมความคิดเห็น", "printSettings": "การตั้งค่าการพิมพ์", "printGrayscale": "พิมพ์โทนสีเทา", - "flatten": "เรียบเอกสาร", "printCurrentDisabled": "มุมมองปัจจุบันใช้ได้เฉพาะเมื่อดูหน้าเดียวเท่านั้น" }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "เริ่มแก้ไขด้วยการทำเครื่องหมายข้อความ ภูมิภาค หน้า หรือทำการค้นหา", - "redactionSearchPlaceholder": "เพิ่มด้วยการค้นหาคำสำคัญหรือรูปแบบ", + "redactionSearchPlaceholder": "ตรวจทานด้วยแป้นพิมพ์หรือรูปแบบ", "redactionCounter": "ถูกทำเครื่องหมายสำหรับ Redaction", "clearMarked": "ชัดเจน", "redactAllMarked": "แก้ไขทั้งหมด", @@ -1151,7 +1150,7 @@ "phoneNumbers": "หมายเลขโทรศัพท์", "images": "รูปภาพ", "emails": "อีเมล", - "pattern": "ลวดลาย", + "pattern": "รูปแบบ", "start": "เริ่มทำการค้นหาของคุณ" } }, @@ -1177,6 +1176,7 @@ "createFolder": "สร้างโฟลเดอร์", "portfolioPanelTitle": "ไฟล์ PDF", "portfolioNewFolder": "แฟ้มใหม่", + "portfolioDocumentTitle": "ชื่อเอกสาร", "portfolioFolderPlaceholder": "ชื่อโฟลเดอร์", "portfolioFilePlaceholder": "ชื่อไฟล์", "folderNameAlreadyExists": "ชื่อโฟลเดอร์มีอยู่แล้ว", diff --git a/i18n/translation-tr.json b/i18n/translation-tr.json index ec9e420bb..ec940655c 100644 --- a/i18n/translation-tr.json +++ b/i18n/translation-tr.json @@ -311,7 +311,7 @@ "selectFile": "Dosya Seç", "selectPageToReplace": "Belgede değiştirmek istediğiniz sayfaları seçin.", "embeddedFiles": "Gömülü Dosyalar", - "pageNum": "Sayfa numarası", + "pageNum": "Sayfa", "viewBookmark": "Sayfadaki Yer İşaretini Görüntüle", "error": "Hata", "errorPageNumber": "Geçersiz sayfa numarası. Sınır (şimdiki değeri)", @@ -428,7 +428,6 @@ "includeComments": "Yorumları dahil et", "printSettings": "Yazdırma Ayarları", "printGrayscale": "Gri Tonlamalı Yazdır", - "flatten": "Belgeyi düzleştir", "printCurrentDisabled": "Geçerli görünüm yalnızca tek bir sayfa görüntülenirken kullanılabilir." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Metni, bölgeleri, sayfaları işaretleyerek veya arama yaparak redaksiyona başlayın.", - "redactionSearchPlaceholder": "Anahtar kelime araması veya kalıplara göre ekleyin", + "redactionSearchPlaceholder": "Klavyeye veya desenlere göre düzenleme", "redactionCounter": "Redaksiyon için işaretlendi", "clearMarked": "Temizlemek", "redactAllMarked": "Tümünü Düzelt", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Telefon numaraları", "images": "Görüntüler", "emails": "e-postalar", - "pattern": "Desen", + "pattern": "Desenler", "start": "Aramanızı yapmaya başlayın" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Klasör oluşturun", "portfolioPanelTitle": "PDF Portföyü", "portfolioNewFolder": "Yeni dosya", + "portfolioDocumentTitle": "Belge başlığı", "portfolioFolderPlaceholder": "Klasör adı", "portfolioFilePlaceholder": "Dosya adı", "folderNameAlreadyExists": "Klasör adı zaten var", diff --git a/i18n/translation-uk.json b/i18n/translation-uk.json index 90e023cd8..6c6e75eaf 100644 --- a/i18n/translation-uk.json +++ b/i18n/translation-uk.json @@ -311,7 +311,7 @@ "selectFile": "Виберіть файл", "selectPageToReplace": "Виберіть сторінки в документі, якими потрібно замінити.", "embeddedFiles": "Вбудовані файли", - "pageNum": "Номер сторінки", + "pageNum": "Сторінка", "viewBookmark": "Переглянути закладку на сторінці", "error": "Помилка", "errorPageNumber": "Недійсний номер сторінки. Обмеження є", @@ -428,7 +428,6 @@ "includeComments": "Включіть коментарі", "printSettings": "Налаштування друку", "printGrayscale": "Друк у градаціях сірого", - "flatten": "Звести документ", "printCurrentDisabled": "Поточний перегляд доступний лише під час перегляду однієї сторінки." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Почніть редагувати, позначивши текст, регіони, сторінки або здійснивши пошук.", - "redactionSearchPlaceholder": "Додайте за допомогою пошуку за ключовими словами або шаблонів", + "redactionSearchPlaceholder": "Редагувати за допомогою клавіатури або шаблонів", "redactionCounter": "Позначено для редагування", "clearMarked": "Ясно", "redactAllMarked": "Редагувати все", @@ -1151,7 +1150,7 @@ "phoneNumbers": "Номери телефонів", "images": "Зображення", "emails": "Електронні листи", - "pattern": "Візерунок", + "pattern": "Візерунки", "start": "Почніть пошук" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Створити папку", "portfolioPanelTitle": "PDF-портфоліо", "portfolioNewFolder": "Нова папка", + "portfolioDocumentTitle": "Назва документа", "portfolioFolderPlaceholder": "Назва папки", "portfolioFilePlaceholder": "Ім'я файлу", "folderNameAlreadyExists": "Назва папки вже існує", diff --git a/i18n/translation-vi.json b/i18n/translation-vi.json index fb9e1b7c8..2411188d8 100644 --- a/i18n/translation-vi.json +++ b/i18n/translation-vi.json @@ -311,7 +311,7 @@ "selectFile": "Chọn tệp", "selectPageToReplace": "Chọn các trang trong tài liệu bạn muốn thay thế.", "embeddedFiles": "Tệp Nhúng", - "pageNum": "Số Trang", + "pageNum": "Trang", "viewBookmark": "Xem dấu trang trên trang", "error": "Lỗi", "errorPageNumber": "Số trang không hợp lệ. Giới hạn là", @@ -428,7 +428,6 @@ "includeComments": "Bao gồm bình luận", "printSettings": "Cài đặt in", "printGrayscale": "In thang độ xám", - "flatten": "Làm phẳng tài liệu", "printCurrentDisabled": "Chế độ xem hiện tại chỉ khả dụng khi xem một trang duy nhất." }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "Bắt đầu biên tập lại bằng cách đánh dấu văn bản, vùng, trang hoặc thực hiện tìm kiếm.", - "redactionSearchPlaceholder": "Bổ sung theo tìm kiếm từ khóa hoặc mẫu", + "redactionSearchPlaceholder": "Chỉnh sửa bằng bàn phím hoặc mẫu", "redactionCounter": "Đã Đánh Dấu để Biên Tập", "clearMarked": "Xóa", "redactAllMarked": "Biên Tập Tất Cả", @@ -1145,13 +1144,13 @@ }, "expand": "Mở rộng", "collapse": "Thu gọn", - "searchResults": "Kết quả tìm kiếm", + "searchResults": "kết quả tìm kiếm", "search": { "creditCards": "Thẻ tín dụng", "phoneNumbers": "Số điện thoại", "images": "Hình ảnh", "emails": "Email", - "pattern": "Mẫu", + "pattern": "mẫu", "start": "Bắt đầu thực hiện tìm kiếm của bạn" } }, @@ -1177,6 +1176,7 @@ "createFolder": "Tạo thư mục", "portfolioPanelTitle": "Danh mục đầu tư PDF", "portfolioNewFolder": "Thư mục mới", + "portfolioDocumentTitle": "Tiêu đề tài liệu", "portfolioFolderPlaceholder": "Tên thư mục", "portfolioFilePlaceholder": "Tên tệp", "folderNameAlreadyExists": "Tên thư mục đã tồn tại", diff --git a/i18n/translation-zh_cn.json b/i18n/translation-zh_cn.json index 7d3eeb4a7..6b1bb7976 100644 --- a/i18n/translation-zh_cn.json +++ b/i18n/translation-zh_cn.json @@ -311,7 +311,7 @@ "selectFile": "选择文件", "selectPageToReplace": "选择文档中要替换的页面。", "embeddedFiles": "嵌入文件", - "pageNum": "页码", + "pageNum": "页", "viewBookmark": "在页面上查看书签", "error": "错误", "errorPageNumber": "页码无效。限制是", @@ -428,7 +428,6 @@ "includeComments": "包括评论", "printSettings": "打印设置", "printGrayscale": "灰度打印", - "flatten": "展平文件", "printCurrentDisabled": "当前视图仅在查看单个页面时可用。" }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "通过标记文本、区域、页面或进行搜索来开始编辑。", - "redactionSearchPlaceholder": "通过关键字搜索或模式添加", + "redactionSearchPlaceholder": "通过键盘或图案编辑", "redactionCounter": "标记为编辑", "clearMarked": "清除", "redactAllMarked": "全部编辑", @@ -1151,7 +1150,7 @@ "phoneNumbers": "电话号码", "images": "图片", "emails": "电子邮件", - "pattern": "图案", + "pattern": "模式", "start": "开始搜索" } }, @@ -1177,6 +1176,7 @@ "createFolder": "创建文件夹", "portfolioPanelTitle": "PDF 作品集", "portfolioNewFolder": "新建文件夹", + "portfolioDocumentTitle": "文件名", "portfolioFolderPlaceholder": "文件夹名称", "portfolioFilePlaceholder": "文件名", "folderNameAlreadyExists": "文件夹名称已存在", diff --git a/i18n/translation-zh_tw.json b/i18n/translation-zh_tw.json index fa17defca..083d0fd92 100644 --- a/i18n/translation-zh_tw.json +++ b/i18n/translation-zh_tw.json @@ -311,7 +311,7 @@ "selectFile": "選擇文件", "selectPageToReplace": "選擇文檔中要替換的頁面。", "embeddedFiles": "嵌入文件", - "pageNum": "頁碼", + "pageNum": "頁", "viewBookmark": "在頁面上查看書籤", "error": "錯誤", "errorPageNumber": "頁碼無效。限制是", @@ -428,7 +428,6 @@ "includeComments": "包括評論", "printSettings": "打印設置", "printGrayscale": "灰度打印", - "flatten": "展平文檔", "printCurrentDisabled": "目前視圖僅在查看單一頁面時可用。" }, "printInfo": { @@ -1131,7 +1130,7 @@ }, "redactionPanel": { "noMarkedRedactions": "通過標記文本、區域、頁面或進行搜索來開始編輯。", - "redactionSearchPlaceholder": "通過關鍵字搜索或模式添加", + "redactionSearchPlaceholder": "透過鍵盤或模式進行編輯", "redactionCounter": "標記為編輯", "clearMarked": "清除", "redactAllMarked": "全部編輯", @@ -1145,7 +1144,7 @@ }, "expand": "擴張", "collapse": "坍塌", - "searchResults": "搜索結果", + "searchResults": "搜尋結果", "search": { "creditCards": "信用卡", "phoneNumbers": "電話號碼", @@ -1177,6 +1176,7 @@ "createFolder": "創建文件夾", "portfolioPanelTitle": "PDF 作品集", "portfolioNewFolder": "新建文件夾", + "portfolioDocumentTitle": "檔案名稱", "portfolioFolderPlaceholder": "文件夾名稱", "portfolioFilePlaceholder": "文件名", "folderNameAlreadyExists": "文件夾名稱已存在", diff --git a/jest/withMockRedux.js b/jest/withMockRedux.js index 652eb3bd8..75389ab56 100644 --- a/jest/withMockRedux.js +++ b/jest/withMockRedux.js @@ -32,8 +32,10 @@ const initialState = { { dataElement: 'annotationDeleteButton' }, { dataElement: 'shortCutKeysFor3D' }, { dataElement: 'playSoundButton' }, - { dataElement: 'annotationAlignButton'} + { dataElement: 'annotationAlignButton' } ], + savedSignatures: [], + maxSignatureCount: 10, }, search: { redactionSearchPatterns: {}, diff --git a/src/components/App/App.js b/src/components/App/App.js index 1185fb0ba..eb828f27d 100644 --- a/src/components/App/App.js +++ b/src/components/App/App.js @@ -328,7 +328,7 @@ const App = ({ removeEventHandlers }) => { case panelNames.STYLE: return ; case panelNames.REDACTION: - return ; + return ; case panelNames.SEARCH: return ; case panelNames.NOTES: @@ -355,6 +355,7 @@ const App = ({ removeEventHandlers }) => { display={panel.dataElement} dataElement={panel.dataElement} render={panel.render} + isCustomPanel={true} /> )} diff --git a/src/components/Button/Button.scss b/src/components/Button/Button.scss index a78572b16..aef73dd15 100644 --- a/src/components/Button/Button.scss +++ b/src/components/Button/Button.scss @@ -25,7 +25,8 @@ } // hack for pan tool and annot select tool - &[data-element="panToolButton"],&[data-element="selectToolButton"] { + &[data-element="panToolButton"], + &[data-element="selectToolButton"] { background: var(--view-header-button-active); } } @@ -36,13 +37,16 @@ } } - &.disabled { - background: none!important; + &.disabled, + &:disabled { + background: none; + border: none; cursor: default; - + .Icon { - color: var(--disabled-icon) !important; + color: var(--disabled-icon); } + span { color: var(--disabled-icon); } @@ -52,9 +56,8 @@ &.icon-only { &:hover:not(:disabled):not(.disabled) { @extend %icon-button-hover; - } - + &.active { box-shadow: inset 0 0 0 1px var(--blue-5); background: var(--tools-button-active); @@ -65,4 +68,13 @@ } } } -} + + &:focus { + outline: none; + } + + &:focus-visible { + outline: var(--focus-visible-outline) !important; + z-index: 2; + } +} \ No newline at end of file diff --git a/src/components/Choice/Choice.scss b/src/components/Choice/Choice.scss index 8ee1e3af6..2d6da374d 100644 --- a/src/components/Choice/Choice.scss +++ b/src/components/Choice/Choice.scss @@ -30,6 +30,10 @@ } } + &--focus { + outline: var(--focus-visible-outline); + } + .ui__choice__input__toggle { height: 10px !important; width: 10px !important; @@ -41,4 +45,4 @@ input:disabled { cursor: not-allowed !important; } -} +} \ No newline at end of file diff --git a/src/components/ColorPalette/ColorPalette.scss b/src/components/ColorPalette/ColorPalette.scss index 8c4a1f94a..40f1627fb 100644 --- a/src/components/ColorPalette/ColorPalette.scss +++ b/src/components/ColorPalette/ColorPalette.scss @@ -1,11 +1,13 @@ @import '../../constants/styles.scss'; .ColorPalette { - display: flex; // fallback for ie11, grid not available + display: flex; // fallback for ie11, grid not available flex-wrap: wrap; // fallback for ie11, grid not available + @include ie11 { width: 196px; // hack for ie11. Have to define width for flex basis to work. } + display: grid; grid-template-columns: repeat(7, 1fr); @@ -19,6 +21,7 @@ @include mobile { max-width: 450px; width: auto; + @include ie11 { width: 308px; // hack for ie11. Have to define width for flex basis to work. } @@ -34,6 +37,7 @@ display: flex; align-items: center; justify-content: center; + border-radius: 4px; @include mobile { width: 44px; @@ -50,7 +54,7 @@ align-items: center; justify-content: center; - @include mobile { + @include mobile { width: 36px; height: 36px; } @@ -66,15 +70,20 @@ border-radius: 10000000px; } - &.border{ + &.border { border: 1px solid var(--white-color-palette-border); } - @include mobile { + @include mobile { width: 24px; height: 24px; } } } + + &:focus-visible { + outline: var(--focus-visible-outline); + } + } -} +} \ No newline at end of file diff --git a/src/components/ColorPickerModal/ColorPickerModal.js b/src/components/ColorPickerModal/ColorPickerModal.js index bc677a7cd..054ac8536 100644 --- a/src/components/ColorPickerModal/ColorPickerModal.js +++ b/src/components/ColorPickerModal/ColorPickerModal.js @@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next'; import { SketchPicker } from 'react-color'; import { Swipeable } from 'react-swipeable'; import DataElements from 'src/constants/dataElement'; +import Button from 'components/Button'; import './ColorPickerModal.scss'; @@ -46,12 +47,8 @@ const ColorPickerModal = ({ isDisabled, isOpen, color, closeModal, handleChangeS presetColors={[]} />
- - +
diff --git a/src/components/ColorPickerModal/ColorPickerModal.scss b/src/components/ColorPickerModal/ColorPickerModal.scss index 9695039f7..7f8e16d46 100644 --- a/src/components/ColorPickerModal/ColorPickerModal.scss +++ b/src/components/ColorPickerModal/ColorPickerModal.scss @@ -31,35 +31,42 @@ width: 220px !important; padding: 0px !important; background: var(--component-background) !important; - > div{ + + >div { border-radius: 2px !important; } .saturation-white { + // Make the color picker dot a little bit bigger - > div > div { + >div>div { width: 12px !important; height: 12px !important; transform: translateX(-6px) translateY(-6px) !important; } } + .flexbox-fix:nth-child(2) { span { color: var(--text-color) !important; cursor: default !important; } + // style for hue selector - > div:nth-child(1) { + >div:nth-child(1) { border-radius: 2px; - > div { + + >div { margin-top: 6px; cursor: ew-resize !important; overflow: visible !important; } } - .hue-horizontal{ + + .hue-horizontal { width: 97%; border-radius: 2px; + div div { transform: translateX(-7px) translateY(-3px) !important; height: 14px !important; @@ -67,26 +74,31 @@ border-radius: 14px !important; } } + // style for color preview - > div:nth-child(2) { + >div:nth-child(2) { height: 24px !important; border-radius: 12px !important; - > div { + + >div { border-radius: 12px !important; } } } + .flexbox-fix:nth-child(3) { + // input boxes input { width: 100% !important; text-align: center; border-radius: 2px; - box-shadow: var(--border) 0px 0px 0px 1px inset!important; + box-shadow: var(--border) 0px 0px 0px 1px inset !important; } + // style for input box label - label{ - color: var(--text-color)!important; + label { + color: var(--text-color) !important; } } } @@ -98,6 +110,7 @@ margin-top: 20px; display: flex; justify-content: flex-end; + .save-button { background-color: transparent; color: var(--primary-button-text); @@ -107,7 +120,9 @@ border: 0; height: 32px; cursor: pointer; + width: fit-content; } + .cancel-button { cursor: pointer; background: none; @@ -116,13 +131,12 @@ padding: 6px 16px; margin-right: 4px; height: 32px; + width: fit-content; + &:hover { color: var(--secondary-button-hover); } - &:focus { - outline: none; - } } } } -} +} \ No newline at end of file diff --git a/src/components/ColorPickerModal/ColorPickerModal.stories.js b/src/components/ColorPickerModal/ColorPickerModal.stories.js index 97cc6a949..01cfe65d6 100644 --- a/src/components/ColorPickerModal/ColorPickerModal.stories.js +++ b/src/components/ColorPickerModal/ColorPickerModal.stories.js @@ -1,5 +1,10 @@ import React from 'react'; import ColorPickerModal from './ColorPickerModal'; +import { Provider } from 'react-redux'; +import initialState from 'src/redux/initialState'; +import { configureStore } from '@reduxjs/toolkit'; + +const store = configureStore({ reducer: () => initialState }); export default { title: 'Components/ColorPickerModal', @@ -28,8 +33,8 @@ export function Basic() { handleChangeCancel, }; return ( -
+ -
+ ); } diff --git a/src/components/CreatableList/CreatableList.stories.js b/src/components/CreatableList/CreatableList.stories.js index e5143f044..409194313 100644 --- a/src/components/CreatableList/CreatableList.stories.js +++ b/src/components/CreatableList/CreatableList.stories.js @@ -24,7 +24,7 @@ function rootReducer(state = initialState, action) { const store = createStore(rootReducer); -const options = [ +const fieldSelectionOptions = [ { 'displayValue': '', 'value': '', @@ -61,8 +61,8 @@ const onOptionsUpdated = (options) => { }; const props = { - options, - onOptionsUpdated + fieldSelectionOptions, + onOptionsUpdated, }; export function Basic() { diff --git a/src/components/CreatableList/CreatableListContainer.js b/src/components/CreatableList/CreatableListContainer.js index 19c29e29a..dc214066c 100644 --- a/src/components/CreatableList/CreatableListContainer.js +++ b/src/components/CreatableList/CreatableListContainer.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState, useCallback, useRef } from 'react'; +import React, { useState, useCallback, useRef } from 'react'; import Button from '../Button'; import { useTranslation } from 'react-i18next'; import CreatableListItem from './CreatableListItem'; @@ -6,54 +6,39 @@ import CreatableListItem from './CreatableListItem'; import './CreatableList.scss'; const CreatableListContainer = ({ - options, - onOptionsUpdated, + draggableItems, popupRef, + fieldSelectionOptions, + setFieldSelectionOptions, }) => { const { t } = useTranslation(); - - // In order to be draggable, each item needs a unique Id - // These are managed internally in this component and not exposed to the user - const draggableItems = options.map((option, index) => { - return { - id: index, - displayValue: option.displayValue, - value: option.value, - }; - }); - const [items, setItems] = useState(draggableItems); - const [nextId, setNextId] = useState(draggableItems.length); + const [nextId, setNextId] = useState(draggableItems?.length ?? 0); const containerRef = useRef(); - useEffect(() => { - const sanitizedOptions = items.map((item) => ({ value: item.value, displayValue: item.displayValue })); - onOptionsUpdated(sanitizedOptions); - }, [items, onOptionsUpdated]); - const onAddItem = useCallback(() => { const id = nextId; setNextId(nextId + 1); - setItems([...items, { id, value: '', displayValue: '' }]); + setFieldSelectionOptions([...fieldSelectionOptions, { id, value: '', displayValue: '' }]); validatePopupHeight(); - }, [nextId, items]); + }, [nextId, fieldSelectionOptions]); const handleDeleteItem = (id) => () => { - const updatedItems = items.filter((item) => { + const updatedItems = fieldSelectionOptions.filter((item) => { return id !== item.id; }); - setItems(updatedItems); + setFieldSelectionOptions(updatedItems); }; const handleItemValueChange = (id) => (value) => { - const updatedItems = items.map((item) => { + const updatedItems = fieldSelectionOptions.map((item) => { if (item.id !== id) { return item; } return { ...item, value, displayValue: value }; }); - setItems(updatedItems); + setFieldSelectionOptions(updatedItems); }; // We add this helper function that doesn't mutate the original array @@ -66,17 +51,17 @@ const CreatableListContainer = ({ const moveListItem = useCallback( (dragIndex, hoverIndex) => { - const dragItem = items[dragIndex]; + const dragItem = fieldSelectionOptions[dragIndex]; // Update items array without mutating original items array for perf reasons // First we remove the element being dragged - const itemsWithoutDraggedElement = items.filter((_item, index) => index !== dragIndex); + const itemsWithoutDraggedElement = fieldSelectionOptions.filter((_item, index) => index !== dragIndex); // Now we add the dragged element at the index it's currently hovering const itemsWithDraggedElementAtNewPosition = addItemAtIndex(itemsWithoutDraggedElement, hoverIndex, dragItem); - setItems(itemsWithDraggedElementAtNewPosition); + setFieldSelectionOptions(itemsWithDraggedElementAtNewPosition); }, - [items], + [fieldSelectionOptions], ); const validatePopupHeight = () => { @@ -98,7 +83,7 @@ const CreatableListContainer = ({ return (
- {items.map((item, index) => ( + {fieldSelectionOptions.map((item, index) => ( { +const CreatableMultiSelect = ({ id, label, ...rest }) => { return ( - + + ); }; +CreatableMultiSelect.propTypes = { + id: PropTypes.string, + label: PropTypes.string, +}; + +CreatableMultiSelect.defaultProps = { + id: '', + label: '', +}; + export default CreatableMultiSelect; \ No newline at end of file diff --git a/src/components/CreatableMultiSelect/CreatableMultiSelect.scss b/src/components/CreatableMultiSelect/CreatableMultiSelect.scss new file mode 100644 index 000000000..a2d24b510 --- /dev/null +++ b/src/components/CreatableMultiSelect/CreatableMultiSelect.scss @@ -0,0 +1,5 @@ +.creatable-multi-select-label { + display: inline-block; + font-weight: bold; + margin-bottom: var(--padding-small); +} \ No newline at end of file diff --git a/src/components/DocumentCropPopup/DocumentCropPopup.js b/src/components/DocumentCropPopup/DocumentCropPopup.js index b01152f4f..4785c829a 100644 --- a/src/components/DocumentCropPopup/DocumentCropPopup.js +++ b/src/components/DocumentCropPopup/DocumentCropPopup.js @@ -11,6 +11,7 @@ import actions from 'actions'; import { useDispatch } from 'react-redux'; import pageNumberPlaceholder from 'constants/pageNumberPlaceholder'; import DataElements from 'constants/dataElement'; +import Button from 'components/Button'; import './DocumentCropPopup.scss'; @@ -458,17 +459,19 @@ const DocumentCropPopup = ({
- - + label={t('action.apply')} + />
); diff --git a/src/components/DocumentCropPopup/DocumentCropPopup.scss b/src/components/DocumentCropPopup/DocumentCropPopup.scss index d7b775efc..05e89689f 100644 --- a/src/components/DocumentCropPopup/DocumentCropPopup.scss +++ b/src/components/DocumentCropPopup/DocumentCropPopup.scss @@ -24,7 +24,7 @@ margin-left: 23px; height: 32px; display: flex; - + Button { margin-top: 0; } @@ -44,7 +44,7 @@ margin-left: 23px; height: 32px; display: flex; - + Button { margin-top: 0; } @@ -86,6 +86,10 @@ height: 18px; width: 18px; } + + &:focus-visible { + outline: var(--focus-visible-outline); + } } .menu-items { @@ -118,6 +122,7 @@ border-radius: 4px; border: 0; height: 32px; + width: fit-content; cursor: pointer; &:disabled { @@ -134,12 +139,16 @@ padding: 6px 16px; margin-right: 4px; height: 32px; + width: fit-content; + &:hover { color: var(--secondary-button-hover); } + &:focus { outline: none; } + &:disabled { opacity: 0.5; cursor: auto; @@ -304,15 +313,15 @@ .DocumentCropPopup { width: 100%; } - + .document-crop-mobile-container { display: flex; align-items: center; .customSelector { width: 100%; - } - + } + .Dropdown { height: 32px; min-width: 150px; @@ -337,12 +346,13 @@ .wrapper { z-index: max($modal-z-index, $popup-z-index) - 1; } - + .save-button { margin-left: 6px; min-width: 75px; } } + .cancel-button { padding: 0; @@ -366,7 +376,7 @@ height: 32px; } } - + .page-number-input { width: 100%; min-width: 150px; @@ -389,4 +399,4 @@ } } } -} +} \ No newline at end of file diff --git a/src/components/Dropdown/Dropdown.scss b/src/components/Dropdown/Dropdown.scss index 218e89745..94a904f48 100644 --- a/src/components/Dropdown/Dropdown.scss +++ b/src/components/Dropdown/Dropdown.scss @@ -54,6 +54,14 @@ color: var(--disabled-icon); pointer-events: none; } + + &:focus { + outline: none; + } + + &:focus-visible { + outline: var(--focus-visible-outline) !important; + } } .Dropdown__items { @@ -92,15 +100,20 @@ border-radius: 0px; padding-right: 32px; - &.active, &:hover { + &.active, + &:hover { color: var(--dropdown-item-active-text); - .Icon, .Icon svg * { + + .Icon, + .Icon svg * { color: var(--dropdown-item-active-icon); } } + &.active { background-color: var(--dropdown-item-active); } + &:hover { background-color: var(--dropdown-item-hover); } @@ -122,4 +135,4 @@ [data-element="endLineStyleDropdown"] .picked-option .arrow { width: 11px !important; -} +} \ No newline at end of file diff --git a/src/components/FileAttachmentPanel/FileAttachmentPanel.js b/src/components/FileAttachmentPanel/FileAttachmentPanel.js index 6442fda3b..0da649de5 100644 --- a/src/components/FileAttachmentPanel/FileAttachmentPanel.js +++ b/src/components/FileAttachmentPanel/FileAttachmentPanel.js @@ -115,7 +115,7 @@ const FileAttachmentPanel = ({ initialFiles = initialFilesDefault }) => { return (

- {t('message.pageNum')}: {pageNumber} + {t('message.pageNum')} {pageNumber}

    {fileAttachmentAnnotsPerPage.map((fileAttachmentAnnot, idx) => renderAttachment( diff --git a/src/components/FileAttachmentPanel/FileAttachmentPanel.scss b/src/components/FileAttachmentPanel/FileAttachmentPanel.scss index 7f51096e5..8c6fa9561 100644 --- a/src/components/FileAttachmentPanel/FileAttachmentPanel.scss +++ b/src/components/FileAttachmentPanel/FileAttachmentPanel.scss @@ -7,11 +7,14 @@ font-size: var(--font-size-default); .section{ - margin-bottom: 10px; + margin-bottom: 8px; p.title{ - margin-left:16px; + font-weight: bold; + padding-left: var(--fileAttachment-title-padding); + margin: 12px 0; } ul.downloadable{ + padding-left: var(--fileAttachment-list-padding); &>li{ cursor: pointer; color: var(--secondary-button-text); @@ -19,6 +22,10 @@ text-overflow: ellipsis; overflow: hidden; white-space: nowrap;text-overflow: ellipsis; + padding: 4px 0; + &:hover{ + color: var(--secondary-button-hover); + } } .embedSpinner{ display: flex; diff --git a/src/components/FilePicker/FilePicker.scss b/src/components/FilePicker/FilePicker.scss index 014095009..0a044f43f 100644 --- a/src/components/FilePicker/FilePicker.scss +++ b/src/components/FilePicker/FilePicker.scss @@ -54,6 +54,10 @@ border-color: var(--blue-6); color: var(--blue-6); } + + &:focus-visible { + outline: var(--focus-visible-outline); + } } .Icon { @@ -79,4 +83,4 @@ margin: 0px 5px 5px 0px; } } -} +} \ No newline at end of file diff --git a/src/components/FontSizeDropdown/pdfEditHelper.js b/src/components/FontSizeDropdown/pdfEditHelper.js index 585a98219..593027f2c 100644 --- a/src/components/FontSizeDropdown/pdfEditHelper.js +++ b/src/components/FontSizeDropdown/pdfEditHelper.js @@ -15,7 +15,12 @@ export function keepTextEditSelectionOnInputFocus(core) { // When we click anywhere other than the input field itself, it should unfocus. document.addEventListener('mousedown', handleClick); - const currentRange = window.getSelection().getRangeAt(0); + const selection = window.getSelection(); + if (selection.rangeCount === 0) { + return; + } + + const currentRange = selection.getRangeAt(0); const isFocusOutsideTextBox = currentRange.startContainer.nodeName === 'DIV'; // Component re-renders when we focus into the input field because it is a dropdown/input combo. // In that case the focus is already shifted out from text edit box and this function is executed again diff --git a/src/components/FormFieldEditPopup/FormFieldEditPopup.js b/src/components/FormFieldEditPopup/FormFieldEditPopup.js index c724e544c..83abbb6e8 100644 --- a/src/components/FormFieldEditPopup/FormFieldEditPopup.js +++ b/src/components/FormFieldEditPopup/FormFieldEditPopup.js @@ -16,10 +16,12 @@ const FormFieldEditPopup = ({ flags, closeFormFieldEditPopup, isValid, + setIsValid, validationMessage, + setValidationMessage, radioButtonGroups, options, - onOptionsChange, + confirmFieldOptionsChange, annotation, selectedRadioGroup, getPageHeight, @@ -46,6 +48,17 @@ const FormFieldEditPopup = ({ selectedRadioGroup === '' ? null : { value: selectedRadioGroup, label: selectedRadioGroup }, ); + // In order to be draggable, each item needs a unique Id + // These are managed internally in this component and not exposed to the user + const draggableItems = options?.map((option, index) => { + return { + id: index, + displayValue: option.displayValue, + value: option.value, + }; + }); + const [fieldSelectionOptions, setFieldSelectionOptions] = useState(draggableItems ?? []); + useEffect(() => { // When we open up the popup the async call to set the right radio group may not be finished // we deal with this timing issue by updating state when the prop is refreshed @@ -58,10 +71,10 @@ const FormFieldEditPopup = ({ function onSelectInputChange(field, input) { if (input === null) { - field.onChange(''); + field.setValue(''); setRadioButtonGroup(null); } else { - field.onChange(input.value); + field.setValue(input.value); setRadioButtonGroup({ value: input.value, label: input.value }); } } @@ -98,6 +111,13 @@ const FormFieldEditPopup = ({ return height; } + const confirmIndicatorChange = () => { + if (indicator.isChecked) { + indicator.confirmTextChange(indicator.textValue || indicatorPlaceholder); + } + indicator.confirmToggleIndicator(indicator.isChecked); + }; + function onCancel() { if (!isValid) { const { value } = fields.find((field) => field.label.includes('fieldName')); @@ -116,6 +136,33 @@ const FormFieldEditPopup = ({ closeFormFieldEditPopup(); } + function onConfirm() { + for (let i = 0; i < fields.length; i++) { + const isInvalidName = fields[i].label.includes('fieldName') && fields[i].value.trim() === ''; + if (isInvalidName) { + // Field name is required, so if this is an empty string + // the field is not valid and the user should be warned + // As a failsafe the FormFieldCreationManager will create a unique field name if this is left blank + setValidationMessage('formField.formFieldPopup.invalidField.empty'); + setIsValid(false); + return; + } + if (fields[i].label.includes('fieldName')) { + fields[i].confirmChange(fields[i].value); + } + } + flags.forEach((flag) => { + flag.confirmChange(flag.isChecked); + }); + + if (confirmFieldOptionsChange) { + const sanitizedOptions = fieldSelectionOptions.map((option) => ({ value: option.value, displayValue: option.displayValue })); + confirmFieldOptionsChange(sanitizedOptions); + } + confirmIndicatorChange(); + closeFormFieldEditPopup(true); + } + function renderInput(field) { if (field.type === 'text') { return renderTextInput(field); @@ -125,11 +172,18 @@ const FormFieldEditPopup = ({ } } + function handleTextChange(event, field) { + field.setValue(event.target.value); + if (event.target.value.trim().length > 0) { + setIsValid(true); + } + } + function renderTextInput(field) { return ( field.onChange(event.target.value)} + onChange={(e) => handleTextChange(e, field)} value={field.value} fillWidth="false" messageText={field.required && !isValid ? t(validationMessage) : ''} @@ -160,7 +214,12 @@ const FormFieldEditPopup = ({ return (
    {t('formField.formFieldPopup.options')} - +
    ); } @@ -186,8 +245,10 @@ const FormFieldEditPopup = ({ {flags.map((flag) => ( flag.onChange(event.target.checked)} + checked = {flag.isChecked} + onChange={(event) => { + flag.setIsChecked(event.target.checked); + }} label={t(flag.label)} /> ))} @@ -212,7 +273,7 @@ const FormFieldEditPopup = ({ />
diff --git a/src/components/FormFieldEditPopup/FormFieldEditSignaturePopup/FormFieldEditSignaturePopup.stories.js b/src/components/FormFieldEditPopup/FormFieldEditSignaturePopup/FormFieldEditSignaturePopup.stories.js index b09af8cda..633646b3c 100644 --- a/src/components/FormFieldEditPopup/FormFieldEditSignaturePopup/FormFieldEditSignaturePopup.stories.js +++ b/src/components/FormFieldEditPopup/FormFieldEditSignaturePopup/FormFieldEditSignaturePopup.stories.js @@ -29,7 +29,7 @@ export function SignatureFieldPopup() { const signatureFields = [ { label: 'formField.formFieldPopup.fieldName', - onChange: () => { }, + confirmChange: () => { }, value: 'SignatureField1', required: true, type: 'text', @@ -39,22 +39,22 @@ export function SignatureFieldPopup() { const signatureFlags = [ { label: 'formField.formFieldPopup.readOnly', - onChange: () => { }, + confirmChange: () => { }, isChecked: true, }, { label: 'formField.formFieldPopup.required', - onChange: () => { }, + confirmChange: () => { }, isChecked: true, } ]; const indicator = { label: 'formField.formFieldPopup.documentFieldIndicator', - toggleIndicator: () => { }, + confirmToggleIndicator: () => { }, isChecked: true, - onChange: () => { }, - value: 'This is an indicator' + confirmChange: () => { }, + textValue: 'This is an indicator' }; const props = { diff --git a/src/components/FormFieldEditPopup/FormFieldEditSignaturePopup/SignatureOptionsDropdown/SignatureOptionsDropdown.js b/src/components/FormFieldEditPopup/FormFieldEditSignaturePopup/SignatureOptionsDropdown/SignatureOptionsDropdown.js index dd643496b..a0685ad77 100644 --- a/src/components/FormFieldEditPopup/FormFieldEditSignaturePopup/SignatureOptionsDropdown/SignatureOptionsDropdown.js +++ b/src/components/FormFieldEditPopup/FormFieldEditSignaturePopup/SignatureOptionsDropdown/SignatureOptionsDropdown.js @@ -9,13 +9,17 @@ import ReactSelectWebComponentProvider from 'src/components/ReactSelectWebCompon import './SignatureOptionsDropdown.scss'; const getStyles = () => ({ - control: (provided) => ({ + control: (provided, state) => ({ ...provided, minHeight: '28px', backgroundColor: 'var(--component-background)', - borderColor: 'hsl(0, 0%, 80%)', - boxShadow: null, - '&:hover': null, + borderColor: state.isFocused ? 'var(--gray-10)' : 'hsl(0, 0%, 80%)', + borderRadius: state.isFocused ? '4px' : provided.borderRadius, + borderWidth: state.isFocused ? '2px' : provided.borderWidth, + boxShadow: state.isFocused ? '0 0 0 1px var(--gray-10)' : null, + '&:hover': { + borderColor: state.isFocused ? 'var(--gray-10)' : 'hsl(0, 0%, 70%)', + }, }), valueContainer: (provided) => ({ ...provided, @@ -29,13 +33,17 @@ const getStyles = () => ({ ...provided, backgroundColor: 'var(--component-background)', }), - option: (provided) => ({ + option: (provided, state) => ({ ...provided, - backgroundColor: 'var(--component-background)', - color: 'var(--text-color)', + backgroundColor: state.isSelected ? 'var(--blue-5)' : 'var(--component-background)', '&:hover': { - backgroundColor: 'var(--popup-button-hover)', - } + backgroundColor: 'var(--blue-6)', + color: 'var(--gray-0)', + }, + '&:active': { + backgroundColor: state.isSelected ? 'var(--blue-5)' : 'var(--blue-6)', + }, + border: state.isFocused ? 'var(--focus-visible-outline) !important' : 'null', }), indicatorsContainer: (provided) => ({ ...provided, diff --git a/src/components/Header/OfficeEditorToolsHeader.js b/src/components/Header/OfficeEditorToolsHeader.js index f83bfe7a4..e51457361 100644 --- a/src/components/Header/OfficeEditorToolsHeader.js +++ b/src/components/Header/OfficeEditorToolsHeader.js @@ -441,7 +441,9 @@ const OfficeEditorToolsHeader = () => { items={availableFontFaces} onOpened={() => setShowMoreTools(false)} onClickItem={(fontFace) => { - core.getOfficeEditor().updateSelectionAndCursorStyle({ fontFace }); + if (typeof fontFace === 'string') { + core.getOfficeEditor().updateSelectionAndCursorStyle({ fontFace }); + } }} getCustomItemStyle={(item) => ({ ...cssFontValues[item] })} maxHeight={500} diff --git a/src/components/InlineCommentingPopup/InlineCommentingPopup.js b/src/components/InlineCommentingPopup/InlineCommentingPopup.js index f11c48c49..4d322399c 100644 --- a/src/components/InlineCommentingPopup/InlineCommentingPopup.js +++ b/src/components/InlineCommentingPopup/InlineCommentingPopup.js @@ -56,6 +56,9 @@ const InlineCommentingPopup = ({ ref={popupRef} data-element={DataElements.INLINE_COMMENT_POPUP} style={{ ...position }} + onMouseMove={(e) => { + e.stopPropagation(); + }} onMouseDown={(e) => { if (isMobile) { e.stopPropagation(); diff --git a/src/components/InlineCommentingPopup/InlineCommentingPopupContainer.js b/src/components/InlineCommentingPopup/InlineCommentingPopupContainer.js index 59ccfc6bc..a22304f5c 100644 --- a/src/components/InlineCommentingPopup/InlineCommentingPopupContainer.js +++ b/src/components/InlineCommentingPopup/InlineCommentingPopupContainer.js @@ -12,6 +12,7 @@ import DataElements from 'constants/dataElement'; import getRootNode from 'helpers/getRootNode'; import debounce from 'lodash/debounce'; import PropTypes from 'prop-types'; +import { workerTypes } from 'constants/types'; const propTypes = { annotation: PropTypes.object, @@ -146,7 +147,11 @@ const InlineCommentingPopupContainer = ({ annotation, closeAndReset }) => { const contextValue = { searchInput: '', - resize: () => { }, + resize: () => { + if (core.getDocument()?.getType() === workerTypes.OFFICE_EDITOR) { + setPosition(getPopupPosition(annotation, popupRef, activeDocumentViewerKey)); + } + }, isSelected: true, isContentEditable: core.canModifyContents(annotation) && !annotation.getContents(), pendingEditTextMap, diff --git a/src/components/InsertPageModal/InsertUploadedPagePanel/InsertUploadedPagePanel.scss b/src/components/InsertPageModal/InsertUploadedPagePanel/InsertUploadedPagePanel.scss index 8691b1083..e3a44b110 100644 --- a/src/components/InsertPageModal/InsertUploadedPagePanel/InsertUploadedPagePanel.scss +++ b/src/components/InsertPageModal/InsertUploadedPagePanel/InsertUploadedPagePanel.scss @@ -170,7 +170,6 @@ .modal-btn { @include button-reset; - background: var(--primary-button); border-radius: 4px; padding: 8px 16px; height: 32px; @@ -179,7 +178,6 @@ align-items: center; justify-content: center; position: relative; - color: var(--primary-button-text); font-weight: 400; cursor: pointer; @@ -188,8 +186,13 @@ width: 100px; } - &:hover { - background: var(--primary-button-hover); + &:not(:disabled):not(.disabled) { + background: var(--primary-button); + color: var(--primary-button-text); + + &:hover { + background: var(--primary-button-hover); + } } } diff --git a/src/components/ModularComponents/AppStories/Responsiveness.stories.js b/src/components/ModularComponents/AppStories/Responsiveness.stories.js index e26d4a9d7..0858a8781 100644 --- a/src/components/ModularComponents/AppStories/Responsiveness.stories.js +++ b/src/components/ModularComponents/AppStories/Responsiveness.stories.js @@ -51,12 +51,12 @@ const Template = (args) => { lastPickedToolForGroupedItems: { annotateGroupedItems: 'AnnotationCreateTextUnderline', }, - activeCustomRibbon: 'annotations-ribbon-item', + activeCustomRibbon: args.activeCustomRibbon, lastPickedToolAndGroup: { tool: 'AnnotationCreateTextUnderline', group: ['annotateGroupedItems'], }, - activeToolName: 'AnnotationCreateTextUnderline' + activeToolName: 'AnnotationCreateTextUnderline', }, featureFlags: { customizableUI: true, @@ -69,10 +69,11 @@ function createTemplate({ width = '100%', height = '100%', headers = mockHeadersNormalized, - components = mockModularComponents + components = mockModularComponents, + activeCustomRibbon = 'annotations-ribbon-item', } = {}) { const template = Template.bind({}); - template.args = { headers, components, width, height }; + template.args = { headers, components, width, height, activeCustomRibbon }; template.parameters = { layout: 'fullscreen' }; return template; } @@ -145,3 +146,5 @@ export const ExtraItemsAdded = createTemplate({ components: ExtraItemsAddedComponents }); +export const RibbonItemsOverflow = createTemplate({ width: '690px' }); +export const RibbonItemsOverflowActive = createTemplate({ width: '750px', activeCustomRibbon: 'toolbarGroup-Insert' }); diff --git a/src/components/ModularComponents/CustomButton/CustomButton.scss b/src/components/ModularComponents/CustomButton/CustomButton.scss index 54b5ddc31..f2960ea90 100644 --- a/src/components/ModularComponents/CustomButton/CustomButton.scss +++ b/src/components/ModularComponents/CustomButton/CustomButton.scss @@ -17,40 +17,40 @@ fill: var(--view-header-icon-active-fill) } } -} - -.confirm-button { - background-color: var(--primary-button); - border: 1px solid var(--primary-button); - color: var(--primary-button-text); - padding: 7px 14px; - width: -webkit-fit-content; - width: -moz-fit-content; - width: fit-content; - border-radius: 5px; - height: 30px; - cursor: pointer; - &:hover { - background: var(--primary-button-hover) !important; - border: 1px solid var(--primary-button-hover) !important; - border-radius: 5px !important; + &.confirm-button { + background-color: var(--primary-button); + border: 1px solid var(--primary-button); + color: var(--primary-button-text); + padding: 7px 14px; + width: -webkit-fit-content; + width: -moz-fit-content; + width: fit-content; + border-radius: 5px; + height: 30px; + cursor: pointer; + + &:hover { + background: var(--primary-button-hover) !important; + border: 1px solid var(--primary-button-hover) !important; + border-radius: 5px !important; + } } -} - -.cancel-button { - color: var(--secondary-button-text); - background-color: transparent; - padding: 7px 14px; - width: -webkit-fit-content; - width: -moz-fit-content; - width: fit-content; - border-radius: 5px; - height: 30px; - cursor: pointer; - &:hover { - color: var(--secondary-button-hover); - background: transparent; + &.cancel-button { + color: var(--secondary-button-text); + background-color: transparent; + padding: 7px 14px; + width: -webkit-fit-content; + width: -moz-fit-content; + width: fit-content; + border-radius: 5px; + height: 30px; + cursor: pointer; + + &:hover { + color: var(--secondary-button-hover); + background: transparent; + } } } \ No newline at end of file diff --git a/src/components/ModularComponents/RibbonGroup/RibbonGroup.js b/src/components/ModularComponents/RibbonGroup/RibbonGroup.js index e3e117614..892a95252 100644 --- a/src/components/ModularComponents/RibbonGroup/RibbonGroup.js +++ b/src/components/ModularComponents/RibbonGroup/RibbonGroup.js @@ -67,13 +67,14 @@ const RibbonGroup = (props) => { const dispatch = useDispatch(); const FLYOUT_NAME = `${dataElement}-flyout`; + const MIN_SIZE = items.length - 1; const size = useSelector((state) => selectors.getCustomElementSize(state, dataElement)); useEffect(() => { sizeManager[dataElement] = { ...(sizeManager[dataElement] ? sizeManager[dataElement] : {}), canGrow: size > 0, - canShrink: size < items.length, + canShrink: size < MIN_SIZE, grow: () => { const newSize = size - 1; dispatch(actions.setCustomElementSize(dataElement, newSize < 0 ? 0 : newSize)); @@ -111,19 +112,22 @@ const RibbonGroup = (props) => { className: 'RibbonGroupFlyout', items: [], }; - if (size > 0) { + if (size > 0 && size !== MIN_SIZE) { const activeIndex = ribbonItems.findIndex((item) => item.toolbarGroup === activeCustomRibbon); const lastIndex = ribbonItems.length - 1; - const indexToExcludeFrom = activeIndex >= lastIndex - size ? lastIndex - size : lastIndex - size + 1; + const indexToExcludeFrom = lastIndex - size + 1; for (let i = 0; i < ribbonItems.length; i++) { const item = ribbonItems[i]; - if (i < indexToExcludeFrom || item.toolbarGroup === activeCustomRibbon) { + if (i < indexToExcludeFrom) { continue; } const flyoutItem = itemToFlyout(item, { onClick: () => { dispatch(actions.closeElements([FLYOUT_NAME])); }, + extraProps: { + isActive: i === activeIndex, + }, }); if (flyoutItem) { flyout.items.push(flyoutItem); @@ -152,11 +156,10 @@ const RibbonGroup = (props) => { }, [activeCustomRibbon]); const renderRibbonItems = () => { - const activeIndex = ribbonItems.findIndex((item) => item.toolbarGroup === activeCustomRibbon); const lastIndex = ribbonItems.length - 1; - const indexToExcludeFrom = activeIndex >= lastIndex - size ? lastIndex - size : lastIndex - size + 1; + const indexToExcludeFrom = lastIndex - size + 1; return ribbonItems.map((item, index) => { - if (index >= indexToExcludeFrom && item.toolbarGroup !== activeCustomRibbon) { + if (index >= indexToExcludeFrom) { return null; } const itemProps = item.props || item; @@ -183,9 +186,9 @@ const RibbonGroup = (props) => { const glyph = item.img; const text = getTranslatedDisplayValue(item.label); return ( -
+
{glyph && - + } {(text) && {text} @@ -194,6 +197,9 @@ const RibbonGroup = (props) => { ); }; + const activeIndex = ribbonItems.findIndex((item) => item.toolbarGroup === activeCustomRibbon); + const lastIndex = ribbonItems.length - 1; + if (!isRibbonGroupDisabled && ribbonItems && ribbonItems.length) { return (
{
= MIN_SIZE, })} style={{ gap: `${itemsGap}px`, @@ -219,14 +225,17 @@ const RibbonGroup = (props) => { dataElement="moreRibbonsButton" toggleElement={FLYOUT_NAME} title="action.more" - img="icon-tools-more" + img={activeIndex > lastIndex - size ? 'icon-tools-more-active' : 'icon-tools-more'} + className={classNames({ + 'hasActive': activeIndex > lastIndex - size + })} />
{ items: [temp1, temp2, temp3, temp4, temp5, item6, item7, item8], }; + setItemToFlyoutStore(store); + return (
@@ -132,7 +135,7 @@ const initialStateDropdown = { viewer: { ...initialState.viewer, customElementSizes: { - 'ribbon-group': 3 + 'ribbon-group': 2, }, activeGroupedItems: [], activeCustomRibbon: 'toolbarGroup-View', @@ -152,6 +155,8 @@ export const ribbonGroupDropdown = () => { items: [item1, item2, item3], }; + setItemToFlyoutStore(storeDropdown); + return (
diff --git a/src/components/ModularComponents/TabPanel/TabPanel.js b/src/components/ModularComponents/TabPanel/TabPanel.js index c7f3c2200..1285f85a4 100644 --- a/src/components/ModularComponents/TabPanel/TabPanel.js +++ b/src/components/ModularComponents/TabPanel/TabPanel.js @@ -95,7 +95,7 @@ const TabPanel = ({ dataElement: tabPanelDataElement }) => { case panelNames.STYLE: return ; case panelNames.REDACTION: - return ; + return ; case panelNames.SEARCH: return ; case panelNames.NOTES: diff --git a/src/components/ModularComponents/ToggleElementButton/ToggleElementButton.js b/src/components/ModularComponents/ToggleElementButton/ToggleElementButton.js index d3bf9fb6c..1f371c108 100644 --- a/src/components/ModularComponents/ToggleElementButton/ToggleElementButton.js +++ b/src/components/ModularComponents/ToggleElementButton/ToggleElementButton.js @@ -59,6 +59,7 @@ const ToggleElementButton = (props) => { title={title} onClick={onClick} disabled={isElementDisabled} + className={props.className} > {props.children} @@ -74,6 +75,7 @@ ToggleElementButton.propTypes = { label: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), toggleElement: PropTypes.string.isRequired, setFlyoutTriggerRef: PropTypes.func, + className: PropTypes.string, }; export default ToggleElementButton; diff --git a/src/components/ModularComponents/ZoomControls/ZoomControls.js b/src/components/ModularComponents/ZoomControls/ZoomControls.js index 6b1b7d61e..01ee46842 100644 --- a/src/components/ModularComponents/ZoomControls/ZoomControls.js +++ b/src/components/ModularComponents/ZoomControls/ZoomControls.js @@ -64,14 +64,16 @@ function ZoomControls(props) { })} data-element={dataElement} ref={elementRef}> {size === 0 && <>
-
-
onClick}> +
onClick} + tabIndex={0}>
- - + />
); diff --git a/src/components/NoteContent/NoteContent.scss b/src/components/NoteContent/NoteContent.scss index 41f0c9ebe..93ae75944 100644 --- a/src/components/NoteContent/NoteContent.scss +++ b/src/components/NoteContent/NoteContent.scss @@ -2,6 +2,8 @@ @import '../../constants/note'; .NoteContent { + --note-content-right-padding-width: 12px; + position: relative; display: flex; flex-direction: column; @@ -16,7 +18,7 @@ &.unread { &.isReply { - background: rgba($color:$pdftron-blue, $alpha: 0.08); + background: rgba($color: $pdftron-blue, $alpha: 0.08); } &.clicked { @@ -42,7 +44,7 @@ user-select: text; cursor: text; padding-left: 52px; - padding-right: 12px; + padding-right: var(--note-content-right-padding-width); } .container-reply { @@ -96,7 +98,7 @@ justify-content: flex-end; margin-top: 8px; - > div { + >div { margin-right: 4px; } @@ -106,6 +108,7 @@ flex-shrink: 0; background: var(--primary-button); border-radius: 4px; + width: fit-content; border: none; height: 28px; display: flex; @@ -121,9 +124,13 @@ } &.disabled { - background: var(--gray-6); - border-color: var(--gray-6); + background: var(--gray-6) !important; + border-color: var(--gray-6) !important; cursor: not-allowed; + + span { + color: var(--primary-button-text); + } } } @@ -131,6 +138,7 @@ @include button-reset; color: var(--secondary-button-text); padding: 0 10px; + width: fit-content; height: 28px; display: flex; align-items: center; diff --git a/src/components/NoteTextPreview/NoteTextPreview.scss b/src/components/NoteTextPreview/NoteTextPreview.scss index b9e4f5c33..375508bbe 100644 --- a/src/components/NoteTextPreview/NoteTextPreview.scss +++ b/src/components/NoteTextPreview/NoteTextPreview.scss @@ -1,11 +1,11 @@ .note-text-preview { font-size: 13px; color: var(--gray-7); - padding-right: 12px; + padding-right: var(--note-content-right-padding-width); user-select: text !important; cursor: text; height: fit-content; - width: calc(100% - 12px); + width: calc(100% - var(--note-content-right-padding-width)); overflow: hidden; } @@ -20,4 +20,12 @@ &:hover { color: var(--primary-button-hover); } +} + +.trackedChangePopup { + .note-text-preview { + max-height: 400px; + overflow-y: auto; + width: calc(100% + var(--note-content-right-padding-width)); + } } \ No newline at end of file diff --git a/src/components/NotesPanel/NotesPanel.js b/src/components/NotesPanel/NotesPanel.js index 9c4963a13..b1de505d0 100644 --- a/src/components/NotesPanel/NotesPanel.js +++ b/src/components/NotesPanel/NotesPanel.js @@ -12,12 +12,10 @@ import ListSeparator from 'components/ListSeparator'; import MultiSelectControls from 'components/NotesPanel/MultiSelectControls'; import CustomElement from 'components/CustomElement'; import NotesPanelHeader from 'components/NotesPanelHeader'; -import Choice from 'components/Choice'; import core from 'core'; import DataElements from 'constants/dataElement'; import { getSortStrategies } from 'constants/sortStrategies'; -import { OFFICE_EDITOR_EDIT_MODE } from 'constants/officeEditor'; import actions from 'actions'; import selectors from 'selectors'; import { isMobileSize } from 'helpers/getDeviceSize'; @@ -476,16 +474,6 @@ const NotesPanel = ({ be overlayed with position absolute and extend into the right panel while still being able to not have any notes cut off */} {isMultiSelectMode ? (showMultiReply ? MultiReplyPlaceHolder : MultiSelectPlaceHolder) : null} - {isOfficeEditorMode && !isMultiSelectMode && (notesToRender.length > 0) && ( -
-
- core.getOfficeEditor().setEditMode(e.target.checked ? OFFICE_EDITOR_EDIT_MODE.PREVIEW : OFFICE_EDITOR_EDIT_MODE.REVIEWING)} - /> -
- )}
{isMultiSelectMode && ( diff --git a/src/components/OutlinesPanel/OutlinesPanel.scss b/src/components/OutlinesPanel/OutlinesPanel.scss index f8cc660e6..9570fe3a4 100644 --- a/src/components/OutlinesPanel/OutlinesPanel.scss +++ b/src/components/OutlinesPanel/OutlinesPanel.scss @@ -33,6 +33,10 @@ background: none; } + &:focus-visible { + outline: var(--focus-visible-outline) !important; + } + .bookmark-outline-input:active { border-color: var(--focus-border) } diff --git a/src/components/PageReplacementModal/PageReplacementModal.scss b/src/components/PageReplacementModal/PageReplacementModal.scss index b0259b408..9213e9613 100644 --- a/src/components/PageReplacementModal/PageReplacementModal.scss +++ b/src/components/PageReplacementModal/PageReplacementModal.scss @@ -100,7 +100,6 @@ .modal-btn { @include button-reset; - background: var(--primary-button); border-radius: 4px; padding: 0 20px; height: 32px; @@ -109,7 +108,6 @@ align-items: center; justify-content: center; position: relative; - color: var(--tab-footer-button-color); font-weight: bold; cursor: pointer; @@ -118,6 +116,11 @@ width: 100px; } + &:not(:disabled) { + background: var(--primary-button); + color: var(--tab-footer-button-color); + } + &:hover { background: var(--primary-button-hover); } diff --git a/src/components/Panel/Panel.js b/src/components/Panel/Panel.js index abd02d5e2..1876c660a 100644 --- a/src/components/Panel/Panel.js +++ b/src/components/Panel/Panel.js @@ -77,7 +77,7 @@ const DesktopPanel = ({ children }) => { return (
{ {isCustom && location === 'right' && !isInDesktopOnlyMode && !isMobile && } -
+
{!isInDesktopOnlyMode && isMobile && (
initialState }); + mockInitialState.viewer.panelCustomEmptyPanel = undefined; + const store = configureStore({ reducer: () => mockInitialState }); return ( @@ -44,9 +44,9 @@ export function Basic() { } export function PanelOnRightSide() { - initialState.viewer.panelCustomEmptyPanel = undefined; - initialState.viewer.openElements.panel2 = true; - const store = configureStore({ reducer: () => initialState }); + mockInitialState.viewer.panelCustomEmptyPanel = undefined; + mockInitialState.viewer.openElements.panel2 = true; + const store = configureStore({ reducer: () => mockInitialState }); return ( @@ -55,13 +55,12 @@ export function PanelOnRightSide() { ); } - // Should not be cutoff export function PanelWithHeaders() { const state = { - ...initialState, + ...mockInitialState, viewer: { - ...initialState.viewer, + ...mockInitialState.viewer, panelCustomEmptyPanel: undefined, openElements: { panel: true, @@ -73,6 +72,13 @@ export function PanelWithHeaders() { modularHeadersHeight: { top: 49, }, + activeGroupedItems: [ + 'annotateGroupedItems', + 'annotateToolsGroupedItems', + 'defaultAnnotationUtilities' + ], + modularHeaders: mockHeadersNormalized, + modularComponents: mockModularComponents, floatingContainersDimensions: {}, }, featureFlags: { @@ -83,7 +89,7 @@ export function PanelWithHeaders() { return (
-
SIZE OF MULTI-TAB HEADER
+
SIZE OF MULTI-TAB HEADER
SIZE OF TOP HEADER
SIZE OF TOOLS HEADER
@@ -101,4 +107,4 @@ export function PanelWithHeaders() {
); -} +} \ No newline at end of file diff --git a/src/components/PortfolioItemContent/PortfolioItemContent.js b/src/components/PortfolioItemContent/PortfolioItemContent.js index 2c160a30d..3fc877786 100644 --- a/src/components/PortfolioItemContent/PortfolioItemContent.js +++ b/src/components/PortfolioItemContent/PortfolioItemContent.js @@ -135,7 +135,7 @@ const PortfolioItemContent = ({ className="bookmark-outline-more-button" dataElement={`portfolio-item-more-button-${id}`} img="icon-tool-more" - tabIndex={-1} + tabIndex={0} onClick={(e) => { e.stopPropagation(); // click on this button won't select the file/folder setContextMenuOpen(true); @@ -171,13 +171,13 @@ const PortfolioItemContent = ({ {(isAdding || isPortfolioRenaming) && <> + setPortfolioEditName(e.target.value)} diff --git a/src/components/PortfolioItemContent/PortfolioItemContent.scss b/src/components/PortfolioItemContent/PortfolioItemContent.scss index 3a2afe899..0c668c9fc 100644 --- a/src/components/PortfolioItemContent/PortfolioItemContent.scss +++ b/src/components/PortfolioItemContent/PortfolioItemContent.scss @@ -8,7 +8,13 @@ } .bookmark-outline-text { - flex-basis: calc(100% - 38px); // icon + mr + more-button width + ml = 38px + flex-basis: calc(100% - 40px); // icon + mr + more-button width + ml = 40px + } + + + .portfolio-input-label { + font-weight: 600; + padding-bottom: var(--padding-small); } .portfolio-input { diff --git a/src/components/PrintModal/PrintModal.js b/src/components/PrintModal/PrintModal.js index 5e3f9ef94..059f52857 100644 --- a/src/components/PrintModal/PrintModal.js +++ b/src/components/PrintModal/PrintModal.js @@ -26,8 +26,6 @@ const PrintModal = ({ printQuality, isGrayscale, setIsGrayscale, - shouldFlatten, - setShouldFlatten, setIsCurrentView, isCurrentViewDisabled, includeAnnotations, @@ -57,8 +55,6 @@ const PrintModal = ({ printQuality: PropTypes.number, isGrayscale: PropTypes.bool, setIsGrayscale: PropTypes.func, - shouldFlatten: PropTypes.bool, - setShouldFlatten: PropTypes.func, setIsCurrentView: PropTypes.func, isCurrentViewDisabled: PropTypes.bool, includeAnnotations: PropTypes.bool, @@ -326,16 +322,6 @@ const PrintModal = ({ checked={isGrayscale} center /> - setShouldFlatten((prevState) => !prevState)} - checked={shouldFlatten} - center - /> )} {!embedPrintValid && ( - setIsGrayscale((prevState) => !prevState)} - checked={isGrayscale} - center - /> + <> + setIsGrayscale((prevState) => !prevState)} + checked={isGrayscale} + center + /> + setIncludeComments((prevState) => !prevState)} + disabled={isPrinting} + checked={includeComments} + center + /> + )}
diff --git a/src/components/PrintModal/PrintModalContainer.js b/src/components/PrintModal/PrintModalContainer.js index 5887b6a29..a16ee6419 100644 --- a/src/components/PrintModal/PrintModalContainer.js +++ b/src/components/PrintModal/PrintModalContainer.js @@ -60,7 +60,6 @@ const PrintModalContainer = () => { const [maintainPageOrientation, setMaintainPageOrientation] = useState(false); const [pagesToPrint, setPagesToPrint] = useState([]); const [isGrayscale, setIsGrayscale] = useState(false); - const [shouldFlatten, setShouldFlatten] = useState(false); const [isWatermarkModalVisible, setIsWatermarkModalVisible] = useState(false); const [includeAnnotations, setIncludeAnnotations] = useState(true); const [includeComments, setIncludeComments] = useState(false); @@ -128,7 +127,7 @@ const PrintModalContainer = () => { } const document = core.getDocument(); const annotManager = core.getAnnotationManager(); - const printingOptions = { isCurrentView, includeAnnotations, shouldFlatten, includeComments }; + const printingOptions = { isCurrentView, includeAnnotations, includeComments }; let pdf = await createPages( document, annotManager, @@ -210,8 +209,6 @@ const PrintModalContainer = () => { isGrayscale={isGrayscale} setIsGrayscale={setIsGrayscale} setIsCurrentView={setIsCurrentView} - shouldFlatten={shouldFlatten} - setShouldFlatten={setShouldFlatten} isCurrentViewDisabled={isCurrentViewDisabled} checkCurrentView={checkCurrentView} includeAnnotations={includeAnnotations} diff --git a/src/components/RedactionPageGroup/RedactionItem/RedactionItem.js b/src/components/RedactionPageGroup/RedactionItem/RedactionItem.js index d8460bc1d..7452a347e 100644 --- a/src/components/RedactionPageGroup/RedactionItem/RedactionItem.js +++ b/src/components/RedactionPageGroup/RedactionItem/RedactionItem.js @@ -8,8 +8,16 @@ import './RedactionItem.scss'; import RedactionTextPreview from 'components/RedactionTextPreview'; import classNames from 'classnames'; import { redactionTypeMap } from 'constants/redactionTypes'; +import { useSelector } from 'react-redux'; +import selectors from 'selectors'; const RedactionItem = (props) => { + // Remove if we get rid of legacy UI along with stylesheet changes + const [isCustomUI] = useSelector( + (state) => [ + selectors.getFeatureFlags(state)?.customizableUI, + ] + ); const { iconColor, annotation, @@ -33,7 +41,7 @@ const RedactionItem = (props) => { const formattedDate = date ? dayjs(date).locale(language).format(dateFormat) : t('option.notesPanel.noteContent.noDate'); const dateAndAuthor = `${author} - ${formattedDate}`; - const className = classNames('redaction-item', { 'redaction-item-selected': isSelected }); + const className = classNames('redaction-item', { 'redaction-item-selected': isSelected }, { 'modular-ui': isCustomUI }); const { label, icon = 'icon-form-field-text', // Default icon if none provided @@ -85,6 +93,7 @@ const RedactionItem = (props) => {
{redactionPageNumbers.length > 0 ? renderRedactionPageGroups() : noRedactionAnnotations}
- - +
); diff --git a/src/components/RedactionPanel/RedactionPanel.scss b/src/components/RedactionPanel/RedactionPanel.scss index a5add1cbb..bfc897ba8 100644 --- a/src/components/RedactionPanel/RedactionPanel.scss +++ b/src/components/RedactionPanel/RedactionPanel.scss @@ -84,20 +84,25 @@ justify-content: flex-end; padding-right: 16px; - .redact-all-marked { + .Button.redact-all-marked { @include button-reset; background-color: var(--primary-button); color: var(--primary-button-text); border-radius: 4px; height: 32px; width: 90px; - cursor: pointer; + + &:hover:not(.disabled) { + background-color: var(--primary-button-hover); + } &.disabled { opacity: 0.5; - cursor: not-allowed; - } + span { + color: var(--primary-button-text); + } + } } .clear-all-marked { @@ -107,12 +112,20 @@ border: none; height: 32px; width: 70px; - padding-right: 5px; + margin-right: 8px; cursor: pointer; + &:hover:not(.disabled) { + color: var(--secondary-button-hover); + } + &.disabled { opacity: 0.5; cursor: not-allowed; + + span { + color: var(--secondary-button-text); + } } } @@ -122,13 +135,18 @@ } .redaction-group-container { - overflow-y: scroll; flex: 1 1 auto; } + + button { + &:focus-visible { + outline: var(--focus-visible-outline); + } + } } -.flx-Panel-container .RedactionPanel { +.ModularPanel-container .RedactionPanel { height: 100%; padding: unset; diff --git a/src/components/RedactionPanel/RedactionPanelContainer.js b/src/components/RedactionPanel/RedactionPanelContainer.js index dab4ea124..f5da53f75 100644 --- a/src/components/RedactionPanel/RedactionPanelContainer.js +++ b/src/components/RedactionPanel/RedactionPanelContainer.js @@ -1,4 +1,5 @@ import React, { useContext, useEffect, useMemo, useState } from 'react'; +import PropTypes from 'prop-types'; import RedactionPanel from './RedactionPanel'; import { useSelector, useDispatch, shallowEqual } from 'react-redux'; import selectors from 'selectors'; @@ -34,7 +35,7 @@ export const RedactionPanelContainer = (props) => { const isMobile = isMobileSize(); - const { redactionAnnotationsList } = props; + const { redactionAnnotationsList, isCustomPanel, dataElement } = props; const redactionTypesDictionary = useMemo(() => { const storedRedactionTypes = Object.keys(redactionSearchPatterns).reduce((map, key) => { @@ -56,9 +57,7 @@ export const RedactionPanelContainer = (props) => { const dispatch = useDispatch(); const applyAllRedactions = () => { const originalApplyRedactions = () => { - const callOnRedactionCompleted = props.isCustomPanel - ? closeRedactionPanel : () => { }; - + const callOnRedactionCompleted = isCustomPanel ? closeRedactionPanel : () => {}; dispatch(applyRedactions(redactionAnnotationsList, callOnRedactionCompleted)); }; if (customApplyRedactionsHandler) { @@ -67,22 +66,27 @@ export const RedactionPanelContainer = (props) => { originalApplyRedactions(); } }; + const closeRedactionPanel = () => { - const tempDataElement = props.isCustomPanel ? props.dataElement : 'redactionPanel'; + const tempDataElement = isCustomPanel ? dataElement : 'redactionPanel'; dispatch(actions.closeElement(tempDataElement)); }; const renderMobileCloseButton = () => { return ( -
-
- + !isCustomPanel && ( +
+
+ +
-
+ ) ); }; - const style = props.isCustomPanel || !isInDesktopOnlyMode && isMobile ? {} : { width: `${redactionPanelWidth}px`, minWidth: `${redactionPanelWidth}px` }; + const style = isCustomPanel || (!isInDesktopOnlyMode && isMobile) + ? {} + : { width: `${redactionPanelWidth}px`, minWidth: `${redactionPanelWidth}px` }; const { isRedactionSearchActive } = useContext(RedactionPanelContext); @@ -97,14 +101,14 @@ export const RedactionPanelContainer = (props) => { }; }, [isOpen]); - if (isDisabled || (!isOpen && renderNull && !props.isCustomPanel)) { + if (isDisabled || (!isOpen && renderNull && !isCustomPanel)) { return null; } - const dataElement = props.isCustomPanel ? props.dataElement : 'redactionPanel'; + const dataElementToUse = isCustomPanel ? dataElement : 'redactionPanel'; return ( - + {!isInDesktopOnlyMode && isMobile && renderMobileCloseButton()} {!isRedactionSearchActive && ( @@ -119,6 +123,17 @@ export const RedactionPanelContainer = (props) => { ); }; +RedactionPanelContainer.propTypes = { + redactionAnnotationsList: PropTypes.array, + isCustomPanel: PropTypes.bool, + dataElement: PropTypes.string, +}; + +RedactionPanelContainer.defaultProps = { + isCustomPanel: false, + dataElement: '', +}; + const RedactionPanelContainerWithProvider = (props) => { return ( @@ -127,4 +142,4 @@ const RedactionPanelContainerWithProvider = (props) => { ); }; -export default RedactionPanelContainerWithProvider; \ No newline at end of file +export default RedactionPanelContainerWithProvider; diff --git a/src/components/RedactionSearchOverlay/RedactionSearchMultiSelect/RedactionSearchMultiSelect.js b/src/components/RedactionSearchOverlay/RedactionSearchMultiSelect/RedactionSearchMultiSelect.js index 903dcaa0b..f95ed6cce 100644 --- a/src/components/RedactionSearchOverlay/RedactionSearchMultiSelect/RedactionSearchMultiSelect.js +++ b/src/components/RedactionSearchOverlay/RedactionSearchMultiSelect/RedactionSearchMultiSelect.js @@ -3,7 +3,9 @@ import { components } from 'react-select'; import Icon from 'components/Icon'; import CreatableMultiSelect from 'components/CreatableMultiSelect'; import { useTranslation } from 'react-i18next'; -import { COMMON_COLORS } from 'constants/commonColors'; +import { COMMON_COLORS, CUSTOM_UI_VARS } from 'constants/commonColors'; +import PropTypes from 'prop-types'; +import './RedactionSearchMultiSelect.scss'; const getColorForMode = (isDarkMode, darkModeColor, lightModeColor, isFocused = true) => { if (isFocused) { @@ -16,8 +18,9 @@ const getStyles = (isDarkMode) => ({ groupHeading: (base) => ({ ...base, textTransform: 'none', - fontSize: '10px', - color: getColorForMode(isDarkMode, COMMON_COLORS['white'], COMMON_COLORS['gray8']), + fontSize: '13px', + fontWeight: 'bold', + color: getColorForMode(isDarkMode, COMMON_COLORS['white'], CUSTOM_UI_VARS['text-color']), paddingBottom: '8px', paddingLeft: '8px', paddingTop: '10px', @@ -29,29 +32,63 @@ const getStyles = (isDarkMode) => ({ menu: (base) => ({ ...base, padding: '0px 0px 0px 0px', + borderRadius: '4px', + overflowY: 'visible', + margin: '0' }), menuList: (base) => ({ ...base, padding: '0px', - backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['black'], COMMON_COLORS['white']), + backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['black'], COMMON_COLORS['gray0']), + overflowY: 'visible', + borderRadius: '4px', }), multiValue: (base) => ({ ...base, - backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['blue1DarkMode'], COMMON_COLORS['blue1LightMode']), + backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['blue1DarkMode'], COMMON_COLORS['gray2']), padding: '2px 8px', fontSize: '13px', borderRadius: '4px', + overflowY: 'hidden', + whiteSpace: 'nowrap', + color: getColorForMode(isDarkMode, COMMON_COLORS['white'], CUSTOM_UI_VARS['text-color']) + }), + multiValueRemove: (base) => ({ + ...base, + color: COMMON_COLORS['gray6'], + borderRadius: '4px', + marginLeft: '4px', + padding: '0px', + '&:hover': { + backgroundColor: COMMON_COLORS['gray2'], + boxShadow: `inset 0 0 0 1px ${COMMON_COLORS['blue6']}`, + color: COMMON_COLORS['gray6'], + }, + 'svg': { + height: '16px', + width: '16px', + }, }), - option: (base, state) => ({ + option: (base) => ({ ...base, - height: '28px', display: 'flex', fontSize: '13px', - padding: '6px 8px', + padding: '6px 8px 0', '&:hover': { - backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['blue1DarkMode'], COMMON_COLORS['blue1LightMode']), + backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['blue1DarkMode'], CUSTOM_UI_VARS['primary-button-hover']), + color: COMMON_COLORS['gray0'], + }, + backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['blue1DarkMode'], COMMON_COLORS['gray0']), + overflowY: 'visible', + whiteSpace: 'normal', + '&:last-child': { + borderRadius: '0 0 4px 4px', + paddingBottom: '6px', }, - backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['blue1DarkMode'], COMMON_COLORS['blue1LightMode'], state.isFocused), + }), + noOptionsMessage: (base) => ({ + ...base, + color: CUSTOM_UI_VARS['text-color'], }), valueContainer: (base) => ({ ...base, @@ -62,11 +99,16 @@ const getStyles = (isDarkMode) => ({ control: (base) => ({ ...base, backgroundColor: getColorForMode(isDarkMode, COMMON_COLORS['gray10'], COMMON_COLORS['white']), - minHeight: '29px', - borderColor: getColorForMode(isDarkMode, COMMON_COLORS['gray8'], COMMON_COLORS['gray4']), + minHeight: '28px', + borderColor: getColorForMode(isDarkMode, COMMON_COLORS['gray8'], COMMON_COLORS['gray6']), + '&:focus-within': { + borderColor: getColorForMode(isDarkMode, COMMON_COLORS['gray8'], COMMON_COLORS['blue5']), + }, + // override the default border color on focus '&:hover': { - borderColor: getColorForMode(isDarkMode, COMMON_COLORS['gray8'], COMMON_COLORS['gray4']), + borderColor: getColorForMode(isDarkMode, COMMON_COLORS['gray8'], COMMON_COLORS['gray6']), }, + boxShadow: 'none !important', }), placeholder: (base) => ({ ...base, @@ -77,7 +119,7 @@ const getStyles = (isDarkMode) => ({ input: (base) => ({ ...base, fontSize: '13px', - color: getColorForMode(isDarkMode, COMMON_COLORS['white'], COMMON_COLORS['gray8']), + color: getColorForMode(isDarkMode, COMMON_COLORS['white'], CUSTOM_UI_VARS['text-color']), paddingLeft: '3px', }), }); @@ -93,6 +135,10 @@ const RedactionOption = (props) => { ); }; +RedactionOption.propTypes = { + data: PropTypes.object.isRequired, +}; + const MultiValueLabel = ({ data }) => { const { t } = useTranslation(); @@ -104,6 +150,23 @@ const MultiValueLabel = ({ data }) => { ); }; +MultiValueLabel.propTypes = { + data: PropTypes.object.isRequired, +}; + +const CustomControl = ({ children, ...props }) => ( + +
+ +
+ {children} + +); + +CustomControl.propTypes = { + children: PropTypes.node, +}; + const RedactionSearchMultiSelect = (props) => { const { t } = useTranslation(); const { activeTheme, redactionSearchOptions } = props; @@ -122,12 +185,19 @@ const RedactionSearchMultiSelect = (props) => { null }} - placeholder={t('redactionPanel.redactionSearchPlaceholder')} + components={{ Option: RedactionOption, MultiValueLabel, IndicatorsContainer: () => null, Control: CustomControl }} + placeholder={''} formatCreateLabel={(value) => `${t('component.searchPanel')} ${value}`} + id="redaction-search-multi-select" + label={t('redactionPanel.redactionSearchPlaceholder')} {...props} /> ); }; +RedactionSearchMultiSelect.propTypes = { + activeTheme: PropTypes.string.isRequired, + redactionSearchOptions: PropTypes.array.isRequired, +}; + export default RedactionSearchMultiSelect; diff --git a/src/components/RedactionSearchOverlay/RedactionSearchMultiSelect/RedactionSearchMultiSelect.scss b/src/components/RedactionSearchOverlay/RedactionSearchMultiSelect/RedactionSearchMultiSelect.scss new file mode 100644 index 000000000..30f55b8b4 --- /dev/null +++ b/src/components/RedactionSearchOverlay/RedactionSearchMultiSelect/RedactionSearchMultiSelect.scss @@ -0,0 +1,12 @@ +.redaction-search-multi-select-search-icon-container { + height: 28px; + align-self: flex-start; + display: flex; + align-items: center; + margin: 0 var(--padding-tiny); + + .Icon { + width: 16px; + height: 16px; + } +} \ No newline at end of file diff --git a/src/components/RedactionSearchOverlay/RedactionSearchOverlay.scss b/src/components/RedactionSearchOverlay/RedactionSearchOverlay.scss index 6e8eca386..85305caba 100644 --- a/src/components/RedactionSearchOverlay/RedactionSearchOverlay.scss +++ b/src/components/RedactionSearchOverlay/RedactionSearchOverlay.scss @@ -6,9 +6,5 @@ input { width: 100%; padding: 6px; - - &::placeholder { - color: var(--placeholder-text); - } } } \ No newline at end of file diff --git a/src/components/RedactionSearchPanel/RedactionSearchPanel.spec.js b/src/components/RedactionSearchPanel/RedactionSearchPanel.spec.js index 4e38084ae..6f6d9d0f7 100644 --- a/src/components/RedactionSearchPanel/RedactionSearchPanel.spec.js +++ b/src/components/RedactionSearchPanel/RedactionSearchPanel.spec.js @@ -83,7 +83,7 @@ describe('RedactionSearchPanel', () => { screen.getByText(/Page 2/); // Renders the correct total number of results message - screen.getByText((_, node) => node.textContent === `Search results (${mockSearchResults.length})`); + screen.getByText((_, node) => node.textContent === `Search Results (${mockSearchResults.length})`); }); it('when user clicks on Select All and Unselect, we select and deselect all results', () => { diff --git a/src/components/RedactionSearchResultGroup/RedactionSearchResult/RedactionSearchResult.scss b/src/components/RedactionSearchResultGroup/RedactionSearchResult/RedactionSearchResult.scss index 193a5669f..0cd2ecdea 100644 --- a/src/components/RedactionSearchResultGroup/RedactionSearchResult/RedactionSearchResult.scss +++ b/src/components/RedactionSearchResultGroup/RedactionSearchResult/RedactionSearchResult.scss @@ -3,6 +3,7 @@ align-items: center; padding: 12px; background-color: var(--component-background); + border: solid 1px transparent; border-radius: 4px; box-shadow: 0px 0px 3px var(--document-box-shadow); margin: 8px 0px; @@ -21,15 +22,11 @@ } &.active { - background-color: var(--view-header-button-active) !important; + background-color: transparent !important; + border: solid 1px var(--focus-border); } } -// box shadow for active ?? -// &.active { - // box-shadow: 0px 0px 4px #868E96, 0px 4px 16px rgba(134, 142, 150, 0.24); -// } - .redaction-search-result-info { font-size: 13px; color: var(--text-color); diff --git a/src/components/RedactionSearchResults/RedactionSearchResults.js b/src/components/RedactionSearchResults/RedactionSearchResults.js index b6d9fb91f..1434eba9f 100644 --- a/src/components/RedactionSearchResults/RedactionSearchResults.js +++ b/src/components/RedactionSearchResults/RedactionSearchResults.js @@ -7,6 +7,7 @@ import classNames from 'classnames'; import { Virtuoso } from 'react-virtuoso'; import SearchStatus from 'constants/searchStatus'; import { RedactionPanelContext } from '../RedactionPanel/RedactionPanelContext'; +import Button from 'components/Button'; function RedactionSearchResults(props) { const { @@ -148,20 +149,26 @@ function RedactionSearchResults(props) {
{t('redactionPanel.searchResults')} ({redactionSearchResults.length})
- - + )}
@@ -171,29 +178,29 @@ function RedactionSearchResults(props) { {(searchStatus === SearchStatus['SEARCH_IN_PROGRESS'] || searchStatus === SearchStatus['SEARCH_DONE']) && renderSearchResults()}
- - - +
); diff --git a/src/components/RedactionSearchResults/RedactionSearchResults.scss b/src/components/RedactionSearchResults/RedactionSearchResults.scss index 50c9be141..5e3beac23 100644 --- a/src/components/RedactionSearchResults/RedactionSearchResults.scss +++ b/src/components/RedactionSearchResults/RedactionSearchResults.scss @@ -3,17 +3,18 @@ .redaction-search-counter-controls { display: flex; flex-direction: row; - margin-top: 49px; + margin-top: 36px; font-size: var(--font-size-default); padding: 16px; - border: 1px solid var(--border); + border: 1px solid var(--lighter-border); background-color: var(--gray-0); border-radius: 4px 4px 0px 0px; max-height: 50px; min-height: 50px; + column-gap: var(--padding-medium); .redaction-search-results-counter { - flex: 3 1 auto; + flex: 2 1 auto; span { font-weight: bold; @@ -31,10 +32,24 @@ color: var(--secondary-button-text); border: none; cursor: pointer; + height: 100%; + + white-space: nowrap; + + &:hover:not(:disabled) { + color: var(--secondary-button-hover) + } + + @include mobile { + font-size: var(--font-size-default); + } &.disabled { opacity: 0.5; - cursor: not-allowed; + + span { + color: var(--secondary-button-text); + } } } @@ -43,10 +58,10 @@ .redaction-search-results-container { flex: 1 1 auto; background-color: var(--gray-2); - color: var(--placeholder-text); + color: var(--faded-text); font-size: 13px; - border-left: 1px solid var(--border); - border-right: 1px solid var(--border); + border-left: 1px solid var(--lighter-border); + border-right: 1px solid var(--lighter-border); display: flex; flex-direction: column; @@ -67,13 +82,13 @@ flex: 0 1 52px; padding: 12px; background-color: var(--component-background); - border: 1px solid var(--border); + border: 1px solid var(--lighter-border); margin-bottom: 16px; button { @include button-reset; height: 28px; - padding: 6px 16px; + padding: 0 16px; cursor: pointer; @include mobile { @@ -81,40 +96,67 @@ } } - .cancel { - flex: 2 1 auto; - color: var(--secondary-button-text); - border: none; - cursor: pointer; - margin-right: 20px; - } + .Button { + white-space: nowrap; - .redact-all-selected { - flex: 1 1 auto; - border: 1px solid var(--secondary-button-text); - border-radius: 4px; - color: var(--secondary-button-text); - margin-right: 8px; + @include mobile { + font-size: var(--font-size-default); + } - &.disabled { - opacity: 0.5; - cursor: not-allowed; + &.cancel { + flex: 2 1 auto; + color: var(--secondary-button-text); + border: none; + cursor: pointer; + margin-right: 20px; + + &:hover:not(.disabled) { + span { + color: var(--secondary-button-hover); + } + } } - } - .mark-all-selected { - flex: 1 1 auto; - background-color: var(--primary-button); - border: 1px solid var(--primary-button); - border-radius: 4px; - color: var(--primary-button-text); - border-radius: 4px; - // width: 90px; - cursor: pointer; + &.redact-all-selected { + flex: 1 1 auto; + border: 1px solid var(--secondary-button-text); + border-radius: 4px; + margin-right: 8px; + + span { + color: var(--secondary-button-text); + } + + &.disabled { + opacity: 0.5; + } + + &:hover:not(.disabled) { + span { + color: var(--secondary-button-hover); + } + border-color: var(--secondary-button-hover); + } + } - &.disabled { - opacity: 0.5; - cursor: not-allowed; + &.mark-all-selected { + flex: 2 1 auto; + background-color: var(--primary-button) !important; + border: 1px solid var(--primary-button); + border-radius: 4px; + + span { + color: var(--primary-button-text); + } + + &:hover:not(.disabled) { + border-color: var(--primary-button-hover); + background-color: var(--primary-button-hover) !important; + } + + &.disabled { + opacity: 0.5; + } } } } \ No newline at end of file diff --git a/src/components/RedactionSearchResults/RedactionSearchResults.spec.js b/src/components/RedactionSearchResults/RedactionSearchResults.spec.js index ef1a64bb8..d019e91e1 100644 --- a/src/components/RedactionSearchResults/RedactionSearchResults.spec.js +++ b/src/components/RedactionSearchResults/RedactionSearchResults.spec.js @@ -56,8 +56,8 @@ describe('RedactionSearchResults component', () => { customRenderWithContext(, providerProps); - const markForRedactionButton = screen.getByText(/Add Mark/); - const redactButton = screen.getByText(/Redact/); + const markForRedactionButton = screen.getByRole('button', { name: 'Add Mark' }); + const redactButton = screen.getByRole('button', { name: 'Redact' }); // Both buttons should be disabled if no results are selected expect(markForRedactionButton).toBeDisabled(); diff --git a/src/components/RedactionSearchResults/RedactionSearchResultsContainer.js b/src/components/RedactionSearchResults/RedactionSearchResultsContainer.js index 8e7f049d3..2071a2de3 100644 --- a/src/components/RedactionSearchResults/RedactionSearchResultsContainer.js +++ b/src/components/RedactionSearchResults/RedactionSearchResultsContainer.js @@ -5,6 +5,7 @@ import selectors from 'selectors'; import applyRedactions from 'helpers/applyRedactions'; import core from 'core'; +const { ToolNames } = window.Core.Tools; export const defaultRedactionStyles = { OverlayText: '', @@ -19,7 +20,8 @@ export function createRedactionAnnotations(searchResults, activeToolStyles = def OverlayText, FillColor, Font = 'Helvetica', - TextColor + TextColor, + FontSize, } = activeToolStyles; const redactionAnnotations = searchResults.map((result) => { const redaction = new window.Core.Annotations.RedactionAnnotation(); @@ -29,6 +31,7 @@ export function createRedactionAnnotations(searchResults, activeToolStyles = def redaction.OverlayText = OverlayText; redaction.FillColor = FillColor; redaction.Font = Font; + redaction.FontSize = FontSize; redaction.TextColor = TextColor; redaction.setContents(result.result_str); redaction.type = result.type; @@ -62,7 +65,9 @@ function RedactionSearchResultsContainer(props) { }; const markSelectedResultsForRedaction = useCallback((searchResults) => { - const redactionStyles = activeToolName.includes('Redaction') ? activeToolStyles : defaultRedactionStyles; + const tool = core.getTool(ToolNames.REDACTION); + const alternativeDefaultStyles = (tool && tool.defaults) ? tool.defaults : defaultRedactionStyles; + const redactionStyles = activeToolName.includes('Redaction') ? activeToolStyles : alternativeDefaultStyles; const redactionAnnotations = createRedactionAnnotations(searchResults, redactionStyles); const annotationManager = core.getAnnotationManager(); annotationManager.addAnnotations(redactionAnnotations); diff --git a/src/components/RichTextStyleEditor/RichTextStyleEditor.scss b/src/components/RichTextStyleEditor/RichTextStyleEditor.scss index 612a71d65..347888276 100644 --- a/src/components/RichTextStyleEditor/RichTextStyleEditor.scss +++ b/src/components/RichTextStyleEditor/RichTextStyleEditor.scss @@ -22,6 +22,10 @@ .auto-size-checkbox { padding-top: 4px; padding-bottom: 8px; + + .ui__choice__input__check--focus { + outline: var(--focus-visible-outline); + } } } } diff --git a/src/components/RubberStampPanel/CustomRubberStamps.js b/src/components/RubberStampPanel/CustomRubberStamps.js index 933b81925..32103c0b7 100644 --- a/src/components/RubberStampPanel/CustomRubberStamps.js +++ b/src/components/RubberStampPanel/CustomRubberStamps.js @@ -4,12 +4,12 @@ import core from 'core'; import classNames from 'classnames'; import selectors from 'selectors'; import actions from 'actions'; -import Icon from 'components/Icon'; import { useDispatch, useSelector } from 'react-redux'; import { isMobileSize } from 'src/helpers/getDeviceSize'; import { PANEL_SIZES } from 'src/constants/panel'; import { isNull } from 'lodash'; import PropTypes from 'prop-types'; +import Button from 'components/Button'; const TOOL_NAME = 'AnnotationCreateRubberStamp'; @@ -26,7 +26,7 @@ const CustomRubberStamp = React.memo(( const [t] = useTranslation(); return ( -
+
- + img="icon-delete-line" + ariaLabel={`${t('action.delete')} ${t('annotation.stamp')} ${index + 1}`} + />
); }); diff --git a/src/components/RubberStampPanel/RubberStampPanel.js b/src/components/RubberStampPanel/RubberStampPanel.js index 00628ae6f..b2ae82c41 100644 --- a/src/components/RubberStampPanel/RubberStampPanel.js +++ b/src/components/RubberStampPanel/RubberStampPanel.js @@ -26,22 +26,12 @@ const RubberStampPanel = () => { const stampToolArray = core.getToolsFromAllDocumentViewers(TOOL_NAME); const isMobile = isMobileSize(); - const [ - standardStamps, - customStamps, - selectedStampIndex, - mobilePanelSize, - featureFlags, - ] = useSelector( - (state) => [ - selectors.getStandardStamps(state), - selectors.getCustomStamps(state), - selectors.getSelectedStampIndex(state), - selectors.getMobilePanelSize(state), - selectors.getFeatureFlags(state), - ], - shallowEqual, - ); + const standardStamps = useSelector(selectors.getStandardStamps, shallowEqual); + const customStamps = useSelector(selectors.getCustomStamps, shallowEqual); + const selectedStampIndex = useSelector(selectors.getSelectedStampIndex); + const mobilePanelSize = useSelector(selectors.getMobilePanelSize); + const featureFlags = useSelector(selectors.getFeatureFlags, shallowEqual); + const store = useStore(); const customizableUI = featureFlags.customizableUI; diff --git a/src/components/RubberStampPanel/RubberStampPanel.scss b/src/components/RubberStampPanel/RubberStampPanel.scss index 556945f93..77f090d14 100644 --- a/src/components/RubberStampPanel/RubberStampPanel.scss +++ b/src/components/RubberStampPanel/RubberStampPanel.scss @@ -38,6 +38,7 @@ display: flex; flex-direction: column; gap: 4px; + padding-top: 2px; padding-bottom: 16px; .rubber-stamp { @@ -114,6 +115,7 @@ } &.small-size { + .CreateRubberStampButton, .Divider, .collapsible-page-group-header, @@ -133,15 +135,16 @@ } .rubber-stamps-list { - .rubber-stamp, - .icon-button { - &:hover { - background-color: var(--gray-0); - } - - &.active { - background: var(--tools-overlay-button-active); - } + + .rubber-stamp, + .icon-button { + &:hover { + background-color: var(--gray-0); + } + + &.active { + background: var(--tools-overlay-button-active); + } } } @@ -152,8 +155,12 @@ } &.modular-ui-panel { - .rubber-stamps-list .rubber-stamp{ + .rubber-stamps-list .rubber-stamp { border-color: var(--lighter-border); + + &:focus-visible { + outline: var(--focus-visible-outline) !important; + } } } } \ No newline at end of file diff --git a/src/components/SearchResult/SearchResult.scss b/src/components/SearchResult/SearchResult.scss index 319c632a7..3e12e60cd 100644 --- a/src/components/SearchResult/SearchResult.scss +++ b/src/components/SearchResult/SearchResult.scss @@ -22,6 +22,7 @@ } &.modular-ui { + &.selected, &:hover { border: 1px solid var(--focus-border); @@ -31,11 +32,15 @@ background-color: var(--faded-component-background); box-shadow: none; } - + + &:focus-visible { + outline: var(--focus-visible-outline); + } + .search-value { font-weight: 700; color: var(--blue-5); background: none; } - } + } } \ No newline at end of file diff --git a/src/components/SignatureListPanel/SavedSignatures.js b/src/components/SignatureListPanel/SavedSignatures.js index f83b2c31c..69706437f 100644 --- a/src/components/SignatureListPanel/SavedSignatures.js +++ b/src/components/SignatureListPanel/SavedSignatures.js @@ -1,11 +1,11 @@ import React from 'react'; import { useTranslation } from 'react-i18next'; -import Icon from 'components/Icon'; import classNames from 'classnames'; import SignatureModes from 'constants/signatureModes'; import { isMobileSize } from 'helpers/getDeviceSize'; import { PANEL_SIZES } from 'constants/panel'; import PropTypes from 'prop-types'; +import Button from 'components/Button'; const SignatureRowContent = React.memo(({ index, @@ -97,18 +97,18 @@ const SavedSignatures = (props) => { signatureMode={signatureMode} /> {!isDeleteDisabled && ( - + /> )}
); } diff --git a/src/components/SignatureListPanel/SignatureListPanel.scss b/src/components/SignatureListPanel/SignatureListPanel.scss index 0c6bea0f9..599ee2bc9 100644 --- a/src/components/SignatureListPanel/SignatureListPanel.scss +++ b/src/components/SignatureListPanel/SignatureListPanel.scss @@ -51,7 +51,8 @@ } .signature-list { - padding-top: 16px; + padding: 16px 2px 0 2px; + overflow: auto; } @@ -143,6 +144,10 @@ background: var(--tools-overlay-button-active); } + &:focus-visible { + outline: var(--focus-visible-outline) !important; + } + .signature-button-icon { width: 20px; height: 20px; diff --git a/src/components/SignatureListPanel/SignatureListPanel.spec.js b/src/components/SignatureListPanel/SignatureListPanel.spec.js new file mode 100644 index 000000000..3911bf471 --- /dev/null +++ b/src/components/SignatureListPanel/SignatureListPanel.spec.js @@ -0,0 +1,43 @@ +import React from 'react'; +import { screen, render } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; +import SignatureListPanel from './SignatureListPanel'; + +const SignatureListPanelWithRedux = withProviders(SignatureListPanel); + +describe.only('SignatureListPanel component', () => { + it('renders the component correctly', () => { + render(); + screen.getByText(/New Signature/); + }); + + // this test is skipped as there is an issue with JSDOM to be investigated + // https://github.com/jsdom/jsdom/issues/3359 + it.skip('applies focus-visible styles when focused via keyboard', () => { + render(); + + const button = screen.getByRole('button', { name: /New Signature/ }); + + // Simulate keyboard navigation to focus the button + // button.focus(); + userEvent.tab(); + + // Log the computed styles + const styles = window.getComputedStyle(button); + console.log('Computed styles:', styles); + + // Check if the focus-visible styles are applied + expect(button).toHaveFocus(); + expect(button).toHaveStyle({ + borderWidth: '2px' + }); + + // Simulate mouse click to ensure focus-visible styles are not applied + userEvent.tab(); + + // Check if focus-visible styles are not applied + expect(button).not.toHaveStyle({ + borderWidth: '2px' + }); + }); +}); \ No newline at end of file diff --git a/src/components/SignatureModal/ImageSignature/ImageSignature.js b/src/components/SignatureModal/ImageSignature/ImageSignature.js index afe61b24f..762bcfee2 100644 --- a/src/components/SignatureModal/ImageSignature/ImageSignature.js +++ b/src/components/SignatureModal/ImageSignature/ImageSignature.js @@ -215,12 +215,12 @@ const ImageSignature = ({ onChange={handleFullSignatureFileChange} disabled={!(isModalOpen && isTabPanelSelected)} /> -
fullSignatureInputRef.current.click()} className="pick-image-button" > {t('option.signatureModal.pickImage')} -
+
{fullSignatureErrorMessage && (
{fullSignatureErrorMessage}
@@ -249,12 +249,12 @@ const ImageSignature = ({ onChange={handleInitialsFileChange} disabled={!(isModalOpen && isTabPanelSelected)} /> -
initialsInputRef.current.click()} className="pick-image-button" > {t('option.signatureModal.pickInitialsFile')} -
+
{initialsErrorMessage && (
{initialsErrorMessage}
diff --git a/src/components/SignatureModal/ImageSignature/ImageSignature.scss b/src/components/SignatureModal/ImageSignature/ImageSignature.scss index edf54e056..cc8122611 100644 --- a/src/components/SignatureModal/ImageSignature/ImageSignature.scss +++ b/src/components/SignatureModal/ImageSignature/ImageSignature.scss @@ -99,6 +99,10 @@ border: 1px solid var(--primary-button-hover); color: var(--primary-button-hover); } + + &:focus-visible { + outline: var(--focus-visible-outline); + } } } diff --git a/src/components/SignatureModal/SignatureModal.scss b/src/components/SignatureModal/SignatureModal.scss index fba4a71e4..6c55c44a2 100644 --- a/src/components/SignatureModal/SignatureModal.scss +++ b/src/components/SignatureModal/SignatureModal.scss @@ -199,6 +199,10 @@ &:disabled { opacity: 0.5; } + + &:focus-visible { + outline: var(--focus-visible-outline); + } } } @@ -308,6 +312,11 @@ &:disabled { opacity: 0.5; } + + + &:focus-visible { + outline: var(--focus-visible-outline); + } } .signature-input { diff --git a/src/components/SignaturePanel/WidgetInfo/WidgetInfo.js b/src/components/SignaturePanel/WidgetInfo/WidgetInfo.js index 9433eefd8..635226b2d 100644 --- a/src/components/SignaturePanel/WidgetInfo/WidgetInfo.js +++ b/src/components/SignaturePanel/WidgetInfo/WidgetInfo.js @@ -34,12 +34,10 @@ export const renderPermissionStatus = ({ ); break; case ModificationPermissionsStatus.e_unmodified: - content = `${ - translate('digitalSignatureVerification.permissionStatus.unmodified') - } ${ - isCertification - ? translate('digitalSignatureVerification.certified') - : translate('digitalSignatureVerification.signed') + content = `${translate('digitalSignatureVerification.permissionStatus.unmodified') + } ${isCertification + ? translate('digitalSignatureVerification.certified') + : translate('digitalSignatureVerification.signed') }.`; break; case ModificationPermissionsStatus.e_permissions_verification_disabled: @@ -151,9 +149,8 @@ const WidgetInfo = ({ name, collapsible, field }) => { return (
{collapsible && ( @@ -168,7 +165,7 @@ const WidgetInfo = ({ name, collapsible, field }) => { )} - +

{content}

); @@ -206,12 +203,10 @@ const WidgetInfo = ({ name, collapsible, field }) => { ); break; case ModificationPermissionsStatus.e_unmodified: - content = `${ - translate('digitalSignatureVerification.permissionStatus.unmodified') - } ${ - isCertification - ? translate('digitalSignatureVerification.certified') - : translate('digitalSignatureVerification.signed') + content = `${translate('digitalSignatureVerification.permissionStatus.unmodified') + } ${isCertification + ? translate('digitalSignatureVerification.certified') + : translate('digitalSignatureVerification.signed') }.`; break; case ModificationPermissionsStatus.e_permissions_verification_disabled: @@ -311,7 +306,7 @@ const WidgetInfo = ({ name, collapsible, field }) => { return null; } return ( -
) } - +
); }; @@ -417,7 +412,6 @@ const WidgetInfo = ({ name, collapsible, field }) => {
@@ -427,12 +421,12 @@ const WidgetInfo = ({ name, collapsible, field }) => { }; return ( -
+
{signed ? ( {renderTitle()} {isExpanded && ( - +
)} ) : ( diff --git a/src/components/SignaturePanel/WidgetInfo/WidgetInfo.scss b/src/components/SignaturePanel/WidgetInfo/WidgetInfo.scss index ee602edf1..c8217b6ea 100644 --- a/src/components/SignaturePanel/WidgetInfo/WidgetInfo.scss +++ b/src/components/SignaturePanel/WidgetInfo/WidgetInfo.scss @@ -2,7 +2,7 @@ --widget-header-indent: 49px; --widget-body-indent: 22px; --arrow-width: 22px; - padding: 0 4px; + padding: 4px; display: flex; flex-direction: column; @@ -11,7 +11,7 @@ // Ensures alignment with the Left Panel Header margin-left: 5px; - p + p { + p+p { margin: 0px; margin-top: 1em; } @@ -30,7 +30,9 @@ } .signatureProperties { - &:hover, &:focus { + + &:hover, + &:focus { color: var(--blue-5); } } @@ -40,6 +42,10 @@ outline: none; border: 0; background-color: transparent; + + &:focus-visible { + outline: var(--focus-visible-outline); + } } box-sizing: border-box; @@ -57,16 +63,18 @@ border-color: var(--blue-6); } - &:active, &:focus-within { + &:active, + &:focus-within { background: var(--outline-hover); border-color: var(--blue-5); } - .collapsible { - outline: none; + &:focus-visible { + outline: var(--focus-visible-outline); } .title { + padding-left: 2px; font-weight: bold; display: flex; align-items: center; @@ -79,7 +87,8 @@ border: 0; background-color: transparent; - div + *, button + * { + div+*, + button+* { margin-left: 2px; } @@ -111,11 +120,19 @@ color: var(--blue-6); } } + + &:focus-visible { + outline: var(--focus-visible-outline); + } } .signature-icon { margin-right: 5px; } + + &:focus-visible { + outline: var(--focus-visible-outline); + } } .header { @@ -125,11 +142,12 @@ margin-left: var(--widget-body-indent); } - .body > div:first-child > p:first-child, .body > p:first-child { + .body>div:first-child>p:first-child, + .body>p:first-child { margin-top: 0.5em; } - .body > div:last-child { + .body>div:last-child { margin-bottom: 0.5em; } } @@ -150,10 +168,11 @@ } } - .signatureDetails, .verificationDetails { + .signatureDetails, + .verificationDetails { padding: 0; background-color: transparent; border: none; text-align: left; } -} +} \ No newline at end of file diff --git a/src/components/SignatureValidationModal/SignatureValidationModal.js b/src/components/SignatureValidationModal/SignatureValidationModal.js index 3c7afe176..eb49fc26f 100644 --- a/src/components/SignatureValidationModal/SignatureValidationModal.js +++ b/src/components/SignatureValidationModal/SignatureValidationModal.js @@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next'; import classNames from 'classnames'; import selectors from 'selectors'; import DataElements from 'constants/dataElement'; +import Button from 'components/Button'; import { renderPermissionStatus, @@ -134,7 +135,7 @@ const SignatureValidationModal = () => { {translate('digitalSignatureModal.title', { type: typeCapitalized })}
- +
{ translate( @@ -469,12 +470,11 @@ const SignatureValidationModal = () => {
- + label={translate('action.close')} + />
); diff --git a/src/components/SignatureValidationModal/SignatureValidationModal.scss b/src/components/SignatureValidationModal/SignatureValidationModal.scss index 006bf84a9..9afbf9685 100644 --- a/src/components/SignatureValidationModal/SignatureValidationModal.scss +++ b/src/components/SignatureValidationModal/SignatureValidationModal.scss @@ -44,7 +44,7 @@ font-weight: bold; } - .summary-box > *:not(:first-child) { + .summary-box>*:not(:first-child) { margin-left: 8px; } @@ -68,26 +68,26 @@ margin-top: 16px; } - div.body > div.section:first-child { + div.body>div.section:first-child { margin-top: 0px; } - div.body > div.section { + div.body>div.section { margin: 16px 16px; padding-bottom: 16px; border-bottom: 1px solid var(--gray-5); } - div.body > div.section:last-child { + div.body>div.section:last-child { margin-bottom: 0px; } - div.body > div.section > p { + div.body>div.section>p { font-size: 13px; margin: 8px 0 8px 0; } - div.body > div.section > p:last-child { + div.body>div.section>p:last-child { margin: 0; } @@ -107,6 +107,7 @@ border-radius: 4px; padding: 0 16px; height: 32px; + width: fit-content; display: flex; align-items: center; justify-content: center; @@ -124,4 +125,4 @@ } } } -} +} \ No newline at end of file diff --git a/src/components/SnippingToolPopup/SnippingToolPopup.js b/src/components/SnippingToolPopup/SnippingToolPopup.js index 1cc68936d..c023bd31f 100644 --- a/src/components/SnippingToolPopup/SnippingToolPopup.js +++ b/src/components/SnippingToolPopup/SnippingToolPopup.js @@ -9,6 +9,7 @@ import { useDispatch } from 'react-redux'; import DataElements from 'constants/dataElement'; import './SnippingToolPopup.scss'; +import Button from 'components/Button'; const SnippingToolPopup = ({ snippingMode, @@ -136,17 +137,19 @@ const SnippingToolPopup = ({
- - + label={t('action.apply')} + />
); diff --git a/src/components/SnippingToolPopup/SnippingToolPopup.scss b/src/components/SnippingToolPopup/SnippingToolPopup.scss index 7e9acbfaa..7df1e0dea 100644 --- a/src/components/SnippingToolPopup/SnippingToolPopup.scss +++ b/src/components/SnippingToolPopup/SnippingToolPopup.scss @@ -53,6 +53,7 @@ border-radius: 4px; border: 0; height: 32px; + width: fit-content; cursor: pointer; &:disabled { @@ -69,12 +70,16 @@ padding: 6px 16px; margin-right: 4px; height: 32px; + width: fit-content; + &:hover { color: var(--secondary-button-hover); } + &:focus { outline: none; } + &:disabled { opacity: 0.5; cursor: auto; @@ -142,14 +147,14 @@ .SnippingToolPopup { width: 100%; } - + .snipping-mobile-container { display: flex; align-items: center; .customSelector { width: 100%; - } + } .Dropdown { height: 32px; @@ -175,12 +180,13 @@ .wrapper { z-index: 79; } - + .save-button { margin-left: 6px; min-width: 75px; } } + .cancel-button { padding: 0; @@ -201,4 +207,4 @@ } } } -} +} \ No newline at end of file diff --git a/src/components/StylePanel/StylePanel.js b/src/components/StylePanel/StylePanel.js index 1ce0e9a46..dbe62fc5c 100644 --- a/src/components/StylePanel/StylePanel.js +++ b/src/components/StylePanel/StylePanel.js @@ -304,12 +304,16 @@ const StylePanel = () => { if (colorProperties.includes(property)) { const colorRGB = hexToRGBA(value); const color = new Annotations.Color(colorRGB.r, colorRGB.g, colorRGB.b, colorRGB.a); - annot[property] = color; + core.setAnnotationStyles(annot, { + [property]: color, + }, activeDocumentViewerKey); if (isAnnotationToolStyleSyncingEnabled) { setToolStyles(annot.ToolName, property, color); } } else { - annot[property] = value; + core.setAnnotationStyles(annot, { + [property]: value, + }, activeDocumentViewerKey); if (annot instanceof Annotations.FreeTextAnnotation) { if (property === 'FontSize' || property === 'Font' || property === 'StrokeThickness') { adjustFreeTextBoundingBox(annot); diff --git a/src/components/StylePicker/ColorPicker/ColorPicker.scss b/src/components/StylePicker/ColorPicker/ColorPicker.scss index 036808997..72ef58fce 100644 --- a/src/components/StylePicker/ColorPicker/ColorPicker.scss +++ b/src/components/StylePicker/ColorPicker/ColorPicker.scss @@ -4,9 +4,11 @@ .ColorPalette { display: flex; // fallback for ie11, grid not available flex-wrap: wrap; // fallback for ie11, grid not available + @include ie11 { width: 196px; // hack for ie11. Have to define width for flex basis to work. } + display: grid; grid-template-columns: repeat(7, 1fr); row-gap: 8px; @@ -22,6 +24,7 @@ @include mobile { max-width: 450px; width: auto; + @include ie11 { width: 308px; // hack for ie11. Have to define width for flex basis to work. } @@ -129,8 +132,10 @@ display: none; } + &:focus-visible { + outline: var(--focus-visible-outline); + } } } -} - +} \ No newline at end of file diff --git a/src/components/StylePicker/StylePicker.scss b/src/components/StylePicker/StylePicker.scss index 266601a87..9db3622a5 100644 --- a/src/components/StylePicker/StylePicker.scss +++ b/src/components/StylePicker/StylePicker.scss @@ -60,6 +60,7 @@ position: relative; align-items: center; margin-bottom: 16px; + border-radius: 4px; .menu-title { padding-top: 6px; @@ -91,6 +92,10 @@ } } + + &:focus-visible { + outline: var(--focus-visible-outline); + } } .divider { @@ -134,6 +139,7 @@ .FontSizeDropdown { height: 32px; } + .overlay-text-input:focus { border-color: var(--blue-5); } diff --git a/src/components/TextStylePicker/TextStylePicker.js b/src/components/TextStylePicker/TextStylePicker.js index a6d63ff70..15a26786d 100644 --- a/src/components/TextStylePicker/TextStylePicker.js +++ b/src/components/TextStylePicker/TextStylePicker.js @@ -6,6 +6,8 @@ import Button from 'components/Button'; import Choice from 'components/Choice'; import PropTypes from 'prop-types'; import i18next from 'i18next'; +import parseFontSize from 'helpers/parseFontSize'; + const TextStylePicker = ({ onPropertyChange, @@ -133,10 +135,9 @@ const TextStylePicker = ({ onPropertyChange('TextVerticalAlign', yAlign); }; - const fontSizeProps = fontSize?.match(/([0-9.]+)|([a-z]+)/gi); - const [error, setError] = useState(''); - const fontSizePropsToUpdate = (fontSizeProps && parseFloat(fontSizeProps[0])) || undefined; + const fontSizeResult = parseFontSize(fontSize); + const fontSizePropsToUpdate = fontSizeResult[0]; const defaultConfig = { quillFont: { @@ -244,7 +245,7 @@ const TextStylePicker = ({ { let doc = core.getDocument(documentViewerKey); + + if (previousFileName !== doc?.getFilename()) { + previousFileName = doc?.getFilename(); + isDownloaded = false; + } + + const documentViewer = core.getDocumentViewer(); + previousWatermarkSettings = await documentViewer.getWatermark(); + if (isDownloaded) { + documentViewer.setWatermark(); + } else { + isDownloaded = true; + } + + const { filename = doc?.getFilename() || 'document', includeAnnotations = true, @@ -51,6 +69,8 @@ export default async (dispatch, options = {}, documentViewerKey = 1) => { if (includeComments || convertToPDF) { doc.unloadResources(); } + + documentViewer.setWatermark(previousWatermarkSettings); }; // We currently don't convert to pdf, png, etc. for office editor. diff --git a/src/helpers/embeddedPrint.js b/src/helpers/embeddedPrint.js index 78a9f5f7d..ac98c4ff9 100644 --- a/src/helpers/embeddedPrint.js +++ b/src/helpers/embeddedPrint.js @@ -56,7 +56,7 @@ const cropDocumentToCurrentView = async (document) => { return document; }; -// printingOptions: isCurrentView, includeAnnotations, shouldFlatten +// printingOptions: isCurrentView, includeAnnotations export const createPages = async (document, annotManager, pagesToPrint, printingOptions, watermarkModalOptions) => { const extension = document.getType(); const bbURLPromise = document.getPrintablePDF(); @@ -81,11 +81,7 @@ export const createPages = async (document, annotManager, pagesToPrint, printing if (watermarkModalOptions) { result.setWatermark(watermarkModalOptions); - } - - if (printingOptions?.shouldFlatten || watermarkModalOptions) { - const fileDataOptions = { flatten: printingOptions?.shouldFlatten }; - result = await createDocumentForPrint(result, fileDataOptions); + result = await createDocumentForPrint(result); } if (printingOptions?.includeComments) { diff --git a/src/helpers/itemToFlyoutHelper.js b/src/helpers/itemToFlyoutHelper.js index 036b53b50..ac0382434 100644 --- a/src/helpers/itemToFlyoutHelper.js +++ b/src/helpers/itemToFlyoutHelper.js @@ -14,10 +14,12 @@ export const itemToFlyout = (item, { onClick = undefined, children = undefined, useOverrideClickOnly = false, + extraProps = {}, } = {}) => { const itemProps = item.props || item; - if (!itemProps || !itemProps.type || !Object.values(ITEM_TYPE).includes(itemProps.type)) { + const isDisabledItem = itemProps?.dataElement && store && selectors.isElementDisabled(store.getState(), itemProps.dataElement); + if (!itemProps || !itemProps.type || !Object.values(ITEM_TYPE).includes(itemProps.type) || isDisabledItem) { return null; } @@ -35,6 +37,7 @@ export const itemToFlyout = (item, { icon: itemProps.icon || itemProps.img, children, disabled: itemProps.disabled, + ...extraProps, }; if (itemProps.type === ITEM_TYPE.BUTTON) { diff --git a/src/helpers/parseFontSize.js b/src/helpers/parseFontSize.js new file mode 100644 index 000000000..6f7146ecf --- /dev/null +++ b/src/helpers/parseFontSize.js @@ -0,0 +1,14 @@ + +// Function parses the "30pt" string to array [30, 'pt'] +function parseFontSize(fontSize) { + if (typeof fontSize === 'number') { + return [fontSize, 'pt']; + } + if (fontSize && !Array.isArray(fontSize)) { + const result = fontSize?.match(/([0-9.]+)|([a-z]+)/gi); + return [parseFloat(result[0]), result[1]]; + } + return [undefined, 'pt']; +} + +export default parseFontSize; \ No newline at end of file diff --git a/src/helpers/parseFontSize.spec.js b/src/helpers/parseFontSize.spec.js new file mode 100644 index 000000000..5c18a3e49 --- /dev/null +++ b/src/helpers/parseFontSize.spec.js @@ -0,0 +1,11 @@ +import parseFontSize from './parseFontSize'; + +describe('parseFontSize', () => { + it('should parse font size correctly', () => { + const result = parseFontSize(['30pt', '45pt']); + expect(result).toEqual([undefined, 'pt']); + + const result2 = parseFontSize('30pt'); + expect(result2).toEqual([30, 'pt']); + }); +}); \ No newline at end of file diff --git a/src/hooks/useOnContextMenuOpen/useOnContextMenuOpen.js b/src/hooks/useOnContextMenuOpen/useOnContextMenuOpen.js index 0ad52e0c0..05e314a2a 100644 --- a/src/hooks/useOnContextMenuOpen/useOnContextMenuOpen.js +++ b/src/hooks/useOnContextMenuOpen/useOnContextMenuOpen.js @@ -41,7 +41,7 @@ export default function useOnContextMenuOpen() { useCallback(async (e) => { const { pageX: left, pageY: top } = e; const annotationUnderMouse = core.getAnnotationByMouseEvent(e, activeDocumentViewerKey); - if ((!isRightClickAnnotationPopupEnabledRef.current && !isMobile) || (isRightClickAnnotationPopupEnabledRef.current && !annotationUnderMouse)) { + if ((!isRightClickAnnotationPopupEnabledRef.current && !isMobile) || (isRightClickAnnotationPopupEnabledRef.current && (!annotationUnderMouse || isOfficeEditorMode()))) { if (popupItems.length > 0) { setClickPosition({ left, top }); if (isOfficeEditorMode()) { diff --git a/src/hooks/useOnFormFieldAnnotationAddedOrSelected/useOnFormFieldAnnotationAddedOrSelected.js b/src/hooks/useOnFormFieldAnnotationAddedOrSelected/useOnFormFieldAnnotationAddedOrSelected.js index 66bdbff95..eb00f59e0 100644 --- a/src/hooks/useOnFormFieldAnnotationAddedOrSelected/useOnFormFieldAnnotationAddedOrSelected.js +++ b/src/hooks/useOnFormFieldAnnotationAddedOrSelected/useOnFormFieldAnnotationAddedOrSelected.js @@ -27,6 +27,13 @@ export default function useOnFormFieldAnnotationAddedOrSelected() { useEffect(() => { const onAnnotationChanged = (annotations, action) => { + if (annotations.length !== 1) { + return; + } + const selectedAnnots = core.getAnnotationManager().getSelectedAnnotations(); + if (selectedAnnots.length > 1) { + return; + } const annotation = annotations[0]; if (action === 'add' && annotation.isFormFieldPlaceholder() && annotation.getCustomData('trn-editing-widget-id') === '') { // If for some reason we are drawing a new form field place holder before filling the name for the previous one, we will not switch From 842a0afeefb30f4976f2c8c5955d8a7079f850ac Mon Sep 17 00:00:00 2001 From: Adam Sinclair Date: Wed, 24 Jul 2024 14:53:37 -0700 Subject: [PATCH 2/2] Recommit eslint-plugin-custom/package.json --- eslint-plugin-custom/package.json | 9 +++++++++ 1 file changed, 9 insertions(+) create mode 100644 eslint-plugin-custom/package.json diff --git a/eslint-plugin-custom/package.json b/eslint-plugin-custom/package.json new file mode 100644 index 000000000..151cef29b --- /dev/null +++ b/eslint-plugin-custom/package.json @@ -0,0 +1,9 @@ +{ + "name": "eslint-plugin-custom", + "version": "1.0.0", + "main": "index.js", + "dependencies": {}, + "peerDependencies": { + "eslint": "^6.8.0" + } +} \ No newline at end of file