diff --git a/extensions/src/platform-scripture-editor/contributions/localizedStrings.json b/extensions/src/platform-scripture-editor/contributions/localizedStrings.json index 4dc94911dcf..fb1a6d24a7c 100644 --- a/extensions/src/platform-scripture-editor/contributions/localizedStrings.json +++ b/extensions/src/platform-scripture-editor/contributions/localizedStrings.json @@ -140,22 +140,22 @@ "%webView_scriptureTextGrid_title_multiple%": "Text Collection", "%webView_scriptureTextGrid_emptyState_prompt%": "No texts to display. Open {viewOptionsLabel} to choose which texts to show.", "%webView_scriptureTextGrid_cell_accessibleName%": "{resourceName}, {reference}", + "%webView_scriptureTextGrid_cell_not_installed%": "Resource not installed", "%webView_scriptureTextGrid_cell_reorderAnnouncement%": "Moved {resourceName} to position {position} of {total}", "%webView_scriptureTextGrid_cell_reorderHandle%": "Reorder {resourceName}", "%webView_scriptureTextGrid_cell_reorderHint%": "Drag or press arrow keys to reorder", - "%webView_scriptureTextGrid_cell_status_loading%": "Resource is loading…", "%webView_scriptureTextGrid_cell_status_downloading%": "Downloading…", "%webView_scriptureTextGrid_cell_status_failed%": "Download failed", + "%webView_scriptureTextGrid_cell_status_loading%": "Resource is loading…", "%webView_scriptureTextGrid_cell_unavailable%": "Resource unavailable", - "%webView_scriptureTextGrid_cell_not_installed%": "Resource not installed", "%webView_scriptureTextGrid_cell_verse_empty%": "No text for this verse", "%webView_scriptureTextGrid_aria_chapterContextClosed%": "Chapter view closed", "%webView_scriptureTextGrid_aria_chapterContextOpened%": "Chapter view opened for {resourceReference}", - "%webView_scriptureTextGrid_cell_zoomIn%": "Zoom in", - "%webView_scriptureTextGrid_cell_zoomOut%": "Zoom out", + "%webView_scriptureTextGrid_cell_copy%": "Copy", "%webView_scriptureTextGrid_cell_resetZoom%": "Reset zoom", + "%webView_scriptureTextGrid_cell_zoomIn%": "Zoom in", "%webView_scriptureTextGrid_cell_zoomOptions%": "Zoom options for {resourceName}", - "%webView_scriptureTextGrid_cell_copy%": "Copy", + "%webView_scriptureTextGrid_cell_zoomOut%": "Zoom out", "%webView_scriptureTextGrid_chapterContext_close%": "Close chapter view", "%webView_scriptureTextGrid_viewOptions_adminSharedLock%": "Shared by administrator", "%webView_scriptureTextGrid_viewOptions_chapter%": "Chapter", @@ -286,22 +286,22 @@ "%webView_scriptureTextGrid_title_multiple%": "Colección de textos", "%webView_scriptureTextGrid_emptyState_prompt%": "No hay textos para mostrar. Abra {viewOptionsLabel} para elegir qué textos mostrar.", "%webView_scriptureTextGrid_cell_accessibleName%": "{resourceName}, {reference}", + "%webView_scriptureTextGrid_cell_not_installed%": "Recurso no instalado", "%webView_scriptureTextGrid_cell_reorderAnnouncement%": "Se movió {resourceName} a la posición {position} de {total}", "%webView_scriptureTextGrid_cell_reorderHandle%": "Reordenar {resourceName}", "%webView_scriptureTextGrid_cell_reorderHint%": "Arrastre o presione las teclas de flecha para reordenar", - "%webView_scriptureTextGrid_cell_status_loading%": "El recurso se está cargando…", "%webView_scriptureTextGrid_cell_status_downloading%": "Descargando…", "%webView_scriptureTextGrid_cell_status_failed%": "Error de descarga", + "%webView_scriptureTextGrid_cell_status_loading%": "El recurso se está cargando…", "%webView_scriptureTextGrid_cell_unavailable%": "Recurso no disponible", - "%webView_scriptureTextGrid_cell_not_installed%": "Recurso no instalado", "%webView_scriptureTextGrid_cell_verse_empty%": "No hay texto para este versículo", "%webView_scriptureTextGrid_aria_chapterContextClosed%": "Vista de capítulo cerrada", "%webView_scriptureTextGrid_aria_chapterContextOpened%": "Vista de capítulo abierta mostrando {resourceReference}", - "%webView_scriptureTextGrid_cell_zoomIn%": "Acercar", - "%webView_scriptureTextGrid_cell_zoomOut%": "Alejar", + "%webView_scriptureTextGrid_cell_copy%": "Copiar", "%webView_scriptureTextGrid_cell_resetZoom%": "Restablecer zoom", + "%webView_scriptureTextGrid_cell_zoomIn%": "Acercar", "%webView_scriptureTextGrid_cell_zoomOptions%": "Opciones de zoom para {resourceName}", - "%webView_scriptureTextGrid_cell_copy%": "Copiar", + "%webView_scriptureTextGrid_cell_zoomOut%": "Alejar", "%webView_scriptureTextGrid_chapterContext_close%": "Cerrar vista de capítulo", "%webView_scriptureTextGrid_viewOptions_adminSharedLock%": "Compartido por el administrador", "%webView_scriptureTextGrid_viewOptions_chapter%": "Capítulo", diff --git a/extensions/src/platform-scripture-editor/src/scripture-text-grid/resource-cell-view.component.stories.tsx b/extensions/src/platform-scripture-editor/src/scripture-text-grid/resource-cell-view.component.stories.tsx index 7ea8e874634..84bbfcb30c9 100644 --- a/extensions/src/platform-scripture-editor/src/scripture-text-grid/resource-cell-view.component.stories.tsx +++ b/extensions/src/platform-scripture-editor/src/scripture-text-grid/resource-cell-view.component.stories.tsx @@ -57,9 +57,12 @@ function CellRowBox({ children }: { children: React.ReactNode }) { return
{children}
; } -/** Wraps one cell in a bounded column (preserves single-cell stories). */ -function CellBox({ children }: { children: React.ReactNode }) { - return
{children}
; +/** + * Wraps one cell in a bounded column (preserves single-cell stories). `width` overrides the default + * column width for stories that need a narrower pane. + */ +function CellBox({ children, width }: { children: React.ReactNode; width?: string }) { + return
{children}
; } /** Stand-in for the read-only `Editorial` the connected cell supplies once the chapter is ready. */ @@ -269,7 +272,7 @@ export const VerseNotInstalled: Story = { ), }; -/** Verse mode, downloading — the inline name stays beside the offline placeholder + spinner. */ +/** Verse mode, downloading — the inline name stays beside the unavailable placeholder + spinner. */ export const VerseDownloading: Story = { render: () => ( @@ -320,6 +323,25 @@ export const VerseLongName: Story = { ), }; +/** + * Verse mode, long name in a pane narrower than the label's width cap — the inline name must still + * show its truncation "…" at the visible edge (not a hard cut); hover reveals the full name. + */ +export const VerseLongNameNarrowPane: Story = { + render: () => ( + + } + /> + + ), +}; + /** Verse mode, RTL long name — truncates on the inline-start (right) side; tooltip reveals it. */ export const VerseLongNameRightToLeft: Story = { render: () => ( @@ -336,10 +358,29 @@ export const VerseLongNameRightToLeft: Story = { ), }; +/** + * Verse mode, RTL long name in a pane narrower than the label's width cap — the truncation "…" must + * still show at the visible inline-start (right) edge, mirroring the LTR narrow-pane case. + */ +export const VerseLongNameNarrowPaneRightToLeft: Story = { + render: () => ( + + } + /> + + ), +}; + /** * Partial-failure row smoke: ready, failed, unavailable, and downloading cells side by side. - * Neighbors stay independent — one offline cell does not blank its siblings. The `unavailable` cell - * shows "Resource not installed" (not "Download failed") so the two failure modes are + * Neighbors stay independent — one non-ready cell does not blank its siblings. The `unavailable` + * cell shows "Resource not installed" (not "Download failed") so the two failure modes are * distinguishable at a glance. */ export const PartialFailureRow: Story = { diff --git a/extensions/src/platform-scripture-editor/src/scripture-text-grid/resource-cell-view.component.tsx b/extensions/src/platform-scripture-editor/src/scripture-text-grid/resource-cell-view.component.tsx index 47168bb25af..c59772088d8 100644 --- a/extensions/src/platform-scripture-editor/src/scripture-text-grid/resource-cell-view.component.tsx +++ b/extensions/src/platform-scripture-editor/src/scripture-text-grid/resource-cell-view.component.tsx @@ -25,7 +25,7 @@ import { import { ResourceCellState } from './resource-cell.utils'; /** - * Localization keys for the ResourceCell offline states. Import to resolve them via + * Localization keys for the ResourceCell's status and action labels. Import to resolve them via * `useLocalizedStrings` (in the app) or `getLocalizedStrings` (in Storybook). */ export const UNAVAILABLE_KEY = '%webView_scriptureTextGrid_cell_unavailable%'; @@ -177,9 +177,9 @@ function ResourceNameLabel({ label, className }: { label: string; className?: st /** * Presentational ResourceCell: renders the resource name (inline label or header band), per-cell - * text direction, and either the editor (`ready`) or the offline placeholder + * text direction, and either the editor (`ready`) or the unavailable placeholder * (`downloading`/`failed`/`unavailable`). Data-free so Storybook can drive every state; - * `ResourceCell` wraps it with the PAPI fetch/direction/offline wiring. + * `ResourceCell` wraps it with the PAPI fetch/direction/availability wiring. * * All role, focus, activation, and accessible-name concerns are handled by the parent verse * `listitem` in `ScriptureTextGrid` — this component is purely presentational. It adds only the @@ -287,11 +287,11 @@ export function ResourceCellView({ {nameDisplay === 'inline' ? ( // Verse-row cell: hang the name at the inline-start beside the verse text. `dir` on the row // makes flex place the name on the resource's own inline-start (right in RTL). The name is a - // shrink-0, width-capped column; the verse text flows and scrolls in the remaining min-w-0 - // column, so the hanging name stays pinned even when the verse overflows. Only the verse - // text scales with zoom; the hanging name keeps a fixed size (as in header mode). + // width-capped column (max-w-24) that can shrink (min-w-0, not shrink-0) so its truncation + // "…" stays at the visible edge in a narrow pane; the verse text flows and scrolls in the + // remaining min-w-0 column. Only the verse text scales with zoom; the hanging name is fixed.
- +
{stateContent}
diff --git a/extensions/src/platform-scripture-editor/src/scripture-text-grid/scripture-text-grid.component.stories.tsx b/extensions/src/platform-scripture-editor/src/scripture-text-grid/scripture-text-grid.component.stories.tsx index 91b7b3f108a..b6e7066c67c 100644 --- a/extensions/src/platform-scripture-editor/src/scripture-text-grid/scripture-text-grid.component.stories.tsx +++ b/extensions/src/platform-scripture-editor/src/scripture-text-grid/scripture-text-grid.component.stories.tsx @@ -16,9 +16,8 @@ import type { ResourceZoomController } from './use-resource-zoom.hook'; * The Scripture Text Grid row: one cell per shown resource, all synced to the active scrRef, laid * out as a horizontal row. Clicking a verse cell opens a resizable chapter-context panel beside the * row. In Storybook the connected `ResourceCell` runs against inert PAPI stubs, so every cell - * renders its "Downloading…" offline state (the real `Editorial` never mounts) — these stories - * capture the row layout, the chapter-context split, and the close button rather than live - * scripture content. + * renders its "Downloading…" state (the real `Editorial` never mounts) — these stories capture the + * row layout, the chapter-context split, and the close button rather than live scripture content. */ const meta: Meta = { title: 'Bundled Extensions/platform-scripture-editor/ScriptureTextGrid',