fix: dock action bar bottom-center; support comma-list refs in inline + live preview

- Action bar anchored to passage bottom rendered off-screen for tall (full-chapter)
  passages; dock it bottom-center of the viewport via CSS instead.
- Inline reading-mode processor and the Live Preview extension used single-range
  parse(), so non-contiguous refs like 'Genesis 1:2, 4, 8' weren't recognized; route
  both through parseList()/getBibleContentList().
This commit is contained in:
Scott Tomaszewski 2026-06-02 22:36:41 -04:00
parent f42759c0e2
commit 2ea9bc7f0f
5 changed files with 22 additions and 24 deletions

4
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "obsidian-disciples-journal",
"version": "0.13.2",
"version": "0.13.3",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "obsidian-disciples-journal",
"version": "0.13.2",
"version": "0.13.3",
"license": "MIT",
"devDependencies": {
"@codemirror/language": "^6.0.0",

View file

@ -38,7 +38,7 @@ export function createInlineReferenceExtension(contentService: BibleContentServi
const content = view.state.doc.sliceString(node.from, node.to);
// Try to parse as a Bible reference
try {
const reference = BibleReference.parse(content);
const reference = BibleReference.parseList(content);
if (reference) {
const decor = Decoration.mark({
inclusive: true,
@ -67,13 +67,13 @@ export function createInlineReferenceExtension(contentService: BibleContentServi
new Notice("No text content found for Bible reference", 10000);
return;
}
const reference = BibleReference.parse(t.textContent);
const reference = BibleReference.parseList(t.textContent);
if (!reference) {
new Notice("Invalid Bible reference: " + t.textContent, 10000);
return;
}
void contentService.getBibleContent(reference).then(response => {
void contentService.getBibleContentList(t.textContent).then(response => {
if (response.isError()) {
new Notice(response.errorMessage, 10000);
return;

View file

@ -58,17 +58,17 @@ export class BibleReferenceRenderer {
}
try {
const reference = BibleReference.parse(codeText);
if (!reference) {
// Accept single refs and non-contiguous lists (e.g. "Genesis 1:2, 4, 8")
if (!BibleReference.parseList(codeText)) {
continue;
}
// Create a Bible reference element
const referenceEl = element.doc.createElement('span');
referenceEl.classList.add('bible-reference');
referenceEl.textContent = codeText;
const response = await this.bibleContentService.getBibleContent(reference);
const response = await this.bibleContentService.getBibleContentList(codeText);
if (response.isError()) {
new Notice(response.errorMessage, 10000);
continue;

View file

@ -88,8 +88,6 @@ export class VerseActionBar extends Component {
});
setIcon(close, "x");
close.onClickEvent(() => this.onClose());
this.position();
}
private openFormatMenu(e: MouseEvent, kind: VerseActionKind, label: string, selection: VerseSelection): void {
@ -101,11 +99,4 @@ export class VerseActionBar extends Component {
}
menu.showAtMouseEvent(e);
}
private position(): void {
if (!this.root) return;
const r = this.passageEl.getBoundingClientRect();
// Anchor just below the passage; CSS bottom-docks it on narrow layouts.
this.root.setCssStyles({ left: `${r.left}px`, top: `${r.bottom + 4}px` });
}
}

View file

@ -544,12 +544,20 @@ button.clear-input-button {
box-shadow: inset 0 0 0 1px var(--text-accent);
}
/* Floating action bar (appears only while verses are selected) */
/* Floating action bar bottom-center dock, so it stays in view regardless of how tall
the passage is (a full chapter is taller than the viewport, so anchoring to the passage
would push the bar off-screen). Appears only while verses are selected. */
.dj-verse-action-bar {
position: fixed;
z-index: var(--layer-popover);
left: 50%;
bottom: var(--size-4-6);
transform: translateX(-50%);
max-width: calc(100% - var(--size-4-8));
display: flex;
align-items: center;
flex-wrap: wrap;
justify-content: center;
gap: var(--size-4-2);
padding: var(--size-4-2) var(--size-4-3);
border-radius: var(--radius-m);
@ -598,15 +606,14 @@ button.clear-input-button {
outline-offset: 2px;
}
/* Bottom-dock and enlarge touch targets on narrow / mobile layouts */
/* Full-width and enlarge touch targets on narrow / mobile layouts */
@media (max-width: 600px) {
.dj-verse-action-bar {
left: var(--size-4-2) !important;
left: var(--size-4-2);
right: var(--size-4-2);
top: auto !important;
bottom: var(--size-4-3);
justify-content: center;
flex-wrap: wrap;
transform: none;
max-width: none;
}
.dj-verse-action-bar button {