Commit graph

16 commits

Author SHA1 Message Date
Bogdan Abaev
df18ac4e1f citation dlg: updated icons
- updated annotations dialog type icons for dark and light mode
- use checkmark instead of right arrow for "accept" button
- fix incorrect sizing of "accept" and "cancel" icons
2026-03-31 14:53:11 -04:00
Bogdan Abaev
0e7ed13a43 citation dlg: variable min-width for list/library
- Allow different min-width for list vs library layouts.
In library mode, we need at least 1000px to have a functional
itemTree, especially when sidepane is present. But for list
mode, 1000px is very wide, so min-width should be 800px.
Increased min-height of itemTree from 200px to 400px
- When the dialog closes, store the width/height of
the current dialog's layout. Then, when the dialog opens
next time in that layout, set window's width/height based on last saved
params. That way, one can open a citation dialog in list
mode at 800px, then open annotations dialog (always library mode)
at 1000px, and then have the citation dialog in list mode open
again at its intended 800px.
- If one switches from library to list mode, add a smooth
window resizing animation to shrink diagonally from current width
to 800px. If one switches from list to library mode,
window smoothly resizes to 1000px min-width. This is
not applied to linux where win resizing behavior is a bit jumpy.
2026-03-31 14:53:11 -04:00
abaevbog
1d437d88f0
citation dialog: insert annotations followup (#5858)
- fix breakage when initially setting annotation dialog
   mode to library
- on click of a non-annotation item in suggested items,
   select the top-level library if the item could not be selected
   in the initial state of the itemTree
- increase min-width of the dialog to 1000px to ensure
   there's always space for the sidebar.
2026-03-24 21:07:19 -04:00
Bogdan Abaev
6bec3c817e Citation dialog: allow to insert annotations (#5356) 2026-03-23 15:00:22 -04:00
abaevbog
fb4ac78291 citation dlg: fix details popup buttons overflow (#5838)
For locales with long button labels.
https://forums.zotero.org/discussion/130208/spacing-is-off-in-citation-detail-pop-up
2026-03-12 14:46:45 -04:00
abaevbog
25a96c35ca
citation dlg: fix itemTree dblclick stealing focus (#5833)
Make sure bubble-input is refocused after double-click
on itemTree, same as as after adding an item to citation
via Enter or + click.

Fixes: #5830
2026-03-09 14:56:47 -04:00
abaevbog
56de1abb79
Citation dialog: localized CSL page locator in guidance panel text (#5746)
* citation dlg: local. CSL locator in guidance panel

Use localized short CSL page locator in guidance panel
text example ("p10")

Fixes: #5745

Also, fix dialog mode switch buttons not properly sizing
in locales where list/library string is longer.
2026-01-27 12:26:32 -05:00
abaevbog
f1c7b7939c
Citation dialog: allow to switch between "Add Note" and "Add/Edit Citation" (#5586)
Allow one to switch between "Add/Edit Citation" and "Add Note" modes
in the citation dialog via segmented control in the bottom
left corner.

One cannot switch modes when editing an existing citation or
when inserting a citation in the note editor.

Use the same segmented control UI to switch between
list and library modes for clarity. Replace icons with
"List" and "Library" strings.

Collect some of the state variables into DIALOG_STATE object
for better organization.

Fixes: #5582

Also, remove earlier logic of not resizing window on refocus
on Linux if focus was lost <100ms ago. That workaround
no longer works, and now that we retain the window sizing
after search reruns, it is less of an issue.
Addresses: #5590
2025-12-18 23:18:35 -05:00
Bogdan Abaev
015769a9f8 fx140: allow pointer events on cells in virt table (#5518)
Revert change from 8e2790e2d2.
Post fx140, dragstart fires fine on rows that are not
yet selected. This allows us to remove the workaround that
limited pointer events to the rows of virtualized table (vs its cells).
With it, we no longer need most of the manual handling
of the tooltip in virtualized table - just adding title attribute is enough.
We also don't need to add extra mouse events handling on
clickable button columns as in citationDialog - we can use
proper :hover and :activate effects, as well as attach
click handler directly to the button.
2025-09-05 02:04:15 -04:00
abaevbog
2f262c943c
Additional fixes to form element appearance on Linux (#5503)
Followup to 06ef9ab

Fix <html> based form elements, in citation dialog item popover.
Set slightly smaller default border width of buttons.
2025-08-21 11:48:53 +03:00
abaevbog
4dbe0f7842
Citation dialog: fix broken item details popup with some non-english locales (#5354)
This allows the locator dropdown to be as wide as it wants
(depending on the longest option in the current locale),
with inputs occupying the remaining space. This is
a more flexible layout that avoids broken UI in
cases if <select> dropdown tries to become too wide
while <input>s occupy a fixed space to remain aligned.

Fixes: #5350
2025-06-25 02:17:41 -04:00
abaevbog
a366f16346
citation dialog: remove cited item placeholder in library mode (#5152)
Keep the placeholder node to retain the positioning
of the text consistent but remove the border
so the item card is invisible.

Also: remove spinner

Fixes: #5151
2025-03-27 03:03:03 -04:00
abaevbog
6787dcd596
Citation dialog: do not wait for cited items to load (#5127)
Before making the dialog interactable.

Initialize loading cited items via io.getItems when the dialog appears.
Once they are loaded, itemsList is refreshed to include
cited matching items and all subsequent searches will include
them too. During the refresh immediately after cited items load,
try to preserve focused/selected state of items.

Added IOManager.preInit that is ran as soon as the dialog
is loaded. Move accept/cancel initialization there.
IOManager.init runs at the very end of onLoad because
it relies on most data and layouts being loaded,
It means if there is some delay or error during loading,
the dialog cannot be closed. To avoid it, setup
cancel/accept buttons separately in the beginning.

Also, minor refactoring of SearchHandler to handle
refreshing of cited items separately from selected and
open items.

Fixes: #5121
2025-03-20 23:42:00 -04:00
abaevbog
bbf91d65f9
Citation dialog: move locator label lower (#5096)
So it aligns with inputs a bit better. Positioning
is tricky with native select elements but with a bit extra
margins, it looks better.

Fixes: #5091
2025-03-13 23:48:10 -04:00
Bogdan Abaev
4a00304925 Redesigned citation dialog (#4872)
Implemented redesigned citation dialog with library
and list modes one can switch between. This dialog is
a direct replacement of quickFormat and classic citation
dialogs.

In Library Mode:
- items table has a new + button column to add items from the
citation and rows of selected items are highlighted
- open, cited and selected items appear in a section
between the items table and bubbleInput. When there are no
matches, a message is shown.
- only top-level items are shown when citing
items and only notes/notes' parents - when adding a note
- selected items are gathered in a collapsible deck to save space.
Click on the deck will expand it. All selected items can be
added via "Add all" button.
- when an item is added, bubble-input may increase in height and
push itemTree lower. To try to preserve relative positioning
of the mouse, itemTree will scroll to be over the row that was just clicked

In List mode:
- arrow up/down from the input will change the selected item
with the focus remaining in the input
- selected items are a collapsible list section

Other behaviors and fixes:
- one can add any locator (not just pages) by typing its full or short name
in an input and pressing Enter (e.g. line 10, or l. 10, or chap. "test chapter")
- Added a new preference to select if the citation dialog
should always open in list mode, library mode or in the last
mode that was used
- bubbles whose items are selected in library or list mode
are highlighted
- arrow up/down from a bubble will focus the bubble
above/below it for easier navigation across bubble-input
- multi-select is supported on items in list mode or item cards in
library mode via Shift-arrow or Cmd+click to select multiple items
- Cmd/Ctrl + Enter will always accept the dialog no matter what
is focused
- when there are no bubbles, accept button is disabled
- after an item is added, bubble-input is always refocused
- added suppressed property to itemTreeMenubar to be able to
hide if in list mode, where it is not relevant. Fixed menubar
getting stuck or re-appearing on Alt keypress on Linux by setting
height: 0 vs hiding it via hidden.
- added initialFolder and onActivate prop to collectionTree to set which collection
should be reopened when dialog opens and to be able to set a custom
onActivate handler.
- added getExtraField prop to itemTree to get data on if
an item is in a citation or not

Implementation details:
- citationDialog.js is the main file. It relies on a number of
helper files in citationDialog/* directory to keep the main
file less cluttered. popupHandler.js contains the logic of
opening/closing the item details popup to add locator/prefix/suffix/etc.
keyboardHandler.js is responsible for overall keyboard navigation
throughout the dialog. searchHandler.js contains the logic
for running the search based on user's query. Finally, Helpers.js
has general helper functions that don't handle any actual logic.
- SearchHandler is set to run search in two ways: for cited/selected/open
items (which are cached and do not involve any actual SQL query) and
general search for items across all libraries. When layout.search
runs, firstly cited/selected/open items are updated after which the
SQL search runs.
- bubbleInput.js is a customElement responsible for bubbles interface.
bubbleInput.refresh takes a list of items and handles adding/removing/reordering
of bubbles as needed. It always has two inputs on each side of
a bubble, as opposed to having inputs inserted dynamically. It
allows keyboardHandler.js to handle navigation with arrows within
bubbleInput.
- when user interacts with bubbleInput, it emits custom events that are
handled by IOManager singleton in citationDialog.js, which
may update the items information and pass them back to bubbleInput.refresh
to have the list of bubbles updated
- CitationDataManager singleton is responsible for storing
items added into the citation in CitationDataManager.items
in an object with both Zotero.Item and the actual citation item.
It is easier to pass both items to other components
and helpers, as opposed to sharing functions to convert
items back and forth.
2025-03-10 22:40:43 -04:00
Adomas Venčkauskas
a3654652b2 Adds a Citation Explorer dialog for document integration (#3468) 2025-03-10 22:40:43 -04:00