fix(PT-4157): inline resource name keeps its ellipsis in narrow panes

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",

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 <div style={ROW_BOX_STYLE}>{children}</div>;
 }
 
-/** Wraps one cell in a bounded column (preserves single-cell stories). */
-function CellBox({ children }: { children: React.ReactNode }) {
-  return <div style={CELL_BOX_STYLE}>{children}</div>;
+/**
+ * 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 <div style={{ ...CELL_BOX_STYLE, ...(width ? { width } : {}) }}>{children}</div>;
 }
 
 /** 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: () => (
     <CellBox>
@@ -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: () => (
+    <CellBox width="110px">
+      <ResourceCellView
+        state="ready"
+        label="New International Version 2011"
+        textDirection="ltr"
+        localizedStrings={localizedStrings}
+        nameDisplay="inline"
+        editor={<SampleVerse />}
+      />
+    </CellBox>
+  ),
+};
+
 /** 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: () => (
+    <CellBox width="110px">
+      <ResourceCellView
+        state="ready"
+        label="תרגום השבעים המלא לפי מהדורת רלפס"
+        textDirection="rtl"
+        localizedStrings={localizedStrings}
+        nameDisplay="inline"
+        editor={<SampleVerse rtl />}
+      />
+    </CellBox>
+  ),
+};
+
 /**
  * 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 = {

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.
         <div className="tw:flex tw:flex-1 tw:flex-row tw:gap-2 tw:p-2" dir={textDirection}>
-          <ResourceNameLabel label={label} className="tw:max-w-24 tw:shrink-0 tw:text-sm" />
+          <ResourceNameLabel label={label} className="tw:max-w-24 tw:min-w-0 tw:text-sm" />
           <div className="tw:min-w-0 tw:flex-1 tw:overflow-auto" style={contentStyle}>
             {stateContent}
           </div>

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<typeof ScriptureTextGrid> = {
   title: 'Bundled Extensions/platform-scripture-editor/ScriptureTextGrid',