This is an automated email from the git hooks/post-receive script. It was generated because a ref change was pushed to the repository containing the project "Evergreen ILS". The branch, rel_3_13 has been updated via 8bc7e83744a57e55322e01bc9d2ff2cede2739f8 (commit) from fd7e175ec053058ec0e24adbd7f3aec8f2dfe197 (commit) Those revisions listed above that are new to this repository have not appeared on any other notification email; so we list those revisions in full, below. - Log ----------------------------------------------------------------- commit 8bc7e83744a57e55322e01bc9d2ff2cede2739f8 Author: Stephanie Leary <stephanie.leary@equinoxoli.org> Date: Wed Apr 2 00:49:47 2025 +0000 LP2101884 MARC Rich Editor subfield tabbing order Changes the MARC rich editor keyboard navigation behavior so that either the right or left arrows can be used to move from grouped subfield focus (with all three inputs highlighted at once) into the subfield for editing. Also moves focus into the subfield value rather than the code. Additionally, changes the tabindex of the currently focused subfield group to -1 so that the group is not part of the tabbing order when moving out of the subfield inputs (in either direction). That is, tabbing out of the subfield group goes directly to the next or previous group rather than the current one. Release-note: Edit MARC subfield value in focused group with right or left arrow; do not focus on current group when tabbing into or out of subfield inputs Signed-off-by: Stephanie Leary <stephanie.leary@equinoxoli.org> Signed-off-by: Ruth Frasur Davis <redavis4974@gmail.com> Signed-off-by: Terran McCanna <tmccanna@georgialibraries.org> diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.html b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.html index aa558a1db8..3922b5abe8 100644 --- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.html +++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.html @@ -33,6 +33,7 @@ Track their labels here. <ng-container *ngIf="!bigText"> <eg-combobox #MARCCombo *ngIf="suggest" + trigger="click" [domId]="domId" [moreClasses]="'fw-bold form-control-sm type-'+fieldType" tabindex="{{tabindex}}" diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editor-context.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editor-context.ts index cfce36f413..1df38c3658 100644 --- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editor-context.ts +++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editor-context.ts @@ -439,24 +439,20 @@ export class MarcEditContext { this.insertSubfield(field, newSf); } - // Focus the requested subfield by its position. If its - // position is less than zero, focus the field's tag instead. + // Focus the requested subfield by its position. focusSubfield(field: MarcField, position: number, group?: boolean) { - - const focus: FieldFocusRequest = {fieldId: field.fieldId, target: 'tag'}; - - if (position >= 0) { - // Focus the code instead of the value, because attempting to - // focus an empty (editable) div results in nothing getting focus. - focus.target = 'sfc'; - focus.sfOffset = position; - } + // console.debug("focusSubfield()", field, position, group); + const focus: FieldFocusRequest = {fieldId: field.fieldId, target: 'sfv'}; if (group) { focus.target = 'group'; - focus.sfOffset = position; + } else if (position < 0) { + // Focus the code instead of the value + focus.target = 'sfc'; } + focus.sfOffset = position; + this.requestFieldFocus(focus); } diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.html b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.html index 396a46636d..9b9b556055 100644 --- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.html +++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.html @@ -146,7 +146,7 @@ <li i18n>Copy Current Row Above: Ctrl+Up</li> <li i18n>Copy Current Row Below: Ctrl+Down</li> <li i18n>Add Subfield: Ctrl+D or Ctrl+I</li> - <li i18n>Edit Subfield (when grouped): Right Arrow</li> + <li i18n>Edit Subfield (when grouped): Left or Right Arrow</li> <li i18n>Remove Row: Ctrl+Del</li> <li i18n>Remove Subfield: Shift+Del</li> <li i18n>Open Suggestions: Ctrl+Shift+Down</li> @@ -314,10 +314,10 @@ 'full-width': subfield[1].length > 100 || context.isFullWidth(field.tag, subfield[0]), 'last': last }" - tabindex="0" - [id]="'subfield-{{subfield[2]}}'" + [tabindex]="getSubfieldTabindex(field, subfield)" + [id]="getSubfieldDomId(field, subfield)" (keydown)="onKeyDown($event, field, subfield)" - attr.aria-description="Press right arrow to edit." + [attr.aria-description]="'Press right or left arrow to edit.'" i18n-aria-label i18n-aria-description> <ng-container #subfieldContent *ngTemplateOutlet="subfieldChunk;context:{field:field,subfield:subfield,tabIndex:context.subfieldHasFocus(field, subfield) ? 0 : -1}"> diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.ts index 3dbdca5839..12b3450e78 100644 --- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.ts +++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.ts @@ -209,6 +209,7 @@ export class MarcRichEditorComponent implements OnInit { onKeyDown(evt: KeyboardEvent, field: MarcField, subfield?: MarcSubfield) { switch (evt.key) { + case 'ArrowLeft': case 'ArrowRight': // console.debug("ArrowRight: ", evt, field, subfield); let el = evt.target as HTMLElement; @@ -345,6 +346,18 @@ export class MarcRichEditorComponent implements OnInit { evt.stopPropagation(); } + getSubfieldDomId(field, subfield) { + return 'subfield-' + field.tag+subfield[0] + '-' + subfield[2]; + } + + getSubfieldTabindex(field, subfield) { + const subfieldGroupElement = document.getElementById(this.getSubfieldDomId(field, subfield)) as HTMLElement; + if (subfieldGroupElement?.contains(document.activeElement)) { + return -1; + } + return 0; + } + focusSubfieldGroup(field: MarcField, subfield: MarcSubfield) { // set lastFocused to subfield group for undo/redo purposes, // but do not emit a focus request ----------------------------------------------------------------------- Summary of changes: .../share/marc-edit/editable-content.component.html | 1 + .../src/app/staff/share/marc-edit/editor-context.ts | 20 ++++++++------------ .../staff/share/marc-edit/rich-editor.component.html | 8 ++++---- .../staff/share/marc-edit/rich-editor.component.ts | 13 +++++++++++++ 4 files changed, 26 insertions(+), 16 deletions(-) hooks/post-receive -- Evergreen ILS