@salsita-ai/sdk 0.50.0-develop.fbe43b9a2d → 0.50.0-develop.fda84314a5

package/dist/docs/layouts/gallery/fenwick-window.mdx

@@ -413,8 +413,19 @@ const useSize = () => {
   return { ref, size }
 }
 
+// A rectangle moved in by `by` on every side. A size the spec allows can leave no room, for example three panes across
+// a 500 mm window, so the size never drops below zero; what has no size is not drawn.
 const inset = (rect: { x: number; y: number; width: number; height: number }, by: number) => {
-  return { x: rect.x + by, y: rect.y + by, width: rect.width - 2 * by, height: rect.height - 2 * by }
+  return {
+    x: rect.x + by,
+    y: rect.y + by,
+    width: Math.max(0, rect.width - 2 * by),
+    height: Math.max(0, rect.height - 2 * by),
+  }
+}
+
+const hasSize = (rect: { width: number; height: number }) => {
+  return rect.width > 0 && rect.height > 0
 }
 
 // The elevation of the window as configured, drawn in millimetres from the spec's `$panes` expression. The drawing is
@@ -426,8 +437,14 @@ export const ShopDrawing = () => {
   const { width: W, height: H, $panes: panes, $mullionWidth: mullion } = casement
   const mainPanes = panes.filter(pane => pane.key.startsWith('P'))
   const topLight = panes.find(pane => pane.key === 'T1')
-  const left = (topLight ? 2 : 1) * TIER + 18
-  const bottom = (mainPanes.length > 1 ? 2 : 1) * TIER + 14
+  const transom = topLight ? topLight.y + topLight.height + mullion / 2 : null
+  // A tall top light can leave the main panes no height. They are not drawn then, so neither is a height split
+  // over them nor the chain of their widths
+  const mainPanesDrawn = mainPanes.some(hasSize)
+  const split = mainPanesDrawn ? transom : null
+  const chained = mainPanesDrawn && mainPanes.length > 1
+  const left = (split !== null ? 2 : 1) * TIER + 18
+  const bottom = (chained ? 2 : 1) * TIER + 14
   const timber = SHEET.timber[casement.finish]
 
   // Pixels per millimetre: the window and its margins fill the box in its tighter direction
@@ -439,7 +456,6 @@ export const ShopDrawing = () => {
   const viewBox = [-left * px, -MARGIN.top * px, W + (left + MARGIN.right) * px, H + (MARGIN.top + bottom) * px]
   // The chain of pane widths along the bottom, measured to the centres of the mullions
   const chain = [0, ...mainPanes.slice(0, -1).map(pane => pane.x + pane.width + mullion / 2), W]
-  const split = topLight ? topLight.y + topLight.height + mullion / 2 : null
 
   return (
     <Box component="div" ref={ref} sx={{ position: 'absolute', inset: 0 }}>
@@ -457,51 +473,60 @@ export const ShopDrawing = () => {
 
           {panes.map(pane => {
             const isSash = pane.opening !== 'Fixed'
+            const opening = inset(pane, 0)
             const glass = inset(pane, isSash ? SASH : BEAD)
             const outline = pane.oversize ? SHEET.attention : SHEET.ink
 
+            // A top light can leave the main panes no height at all; the spec's warning says so
+            if (!hasSize(opening)) {
+              return null
+            }
+
             return (
               <g key={pane.key}>
-                <rect
-                  x={pane.x}
-                  y={pane.y}
-                  width={pane.width}
-                  height={pane.height}
-                  fill={isSash ? timber : SHEET.glass}
-                  stroke={SHEET.ink}
-                  strokeWidth={1.2 * px}
-                />
-                <rect {...glass} fill={SHEET.glass} stroke={SHEET.glassStroke} strokeWidth={px} />
-                {/* Two short strokes in a corner, the drafting sign for glass */}
-                <polyline
-                  points={`${glass.x + glass.width * 0.1},${glass.y + glass.height * 0.28} ${glass.x + glass.width * 0.28},${glass.y + glass.height * 0.1}`}
-                  stroke={SHEET.glassStroke}
-                  strokeWidth={1.2 * px}
-                  fill="none"
-                />
-                <polyline
-                  points={`${glass.x + glass.width * 0.1},${glass.y + glass.height * 0.4} ${glass.x + glass.width * 0.4},${glass.y + glass.height * 0.1}`}
-                  stroke={SHEET.glassStroke}
-                  strokeWidth={1.2 * px}
-                  fill="none"
-                />
-                {casement.glazingBars && (
-                  <g fill={timber} stroke={SHEET.ink} strokeWidth={px}>
-                    <rect
-                      x={glass.x + glass.width / 2 - GLAZING_BAR / 2}
-                      y={glass.y}
-                      width={GLAZING_BAR}
-                      height={glass.height}
+                <rect {...opening} fill={isSash ? timber : SHEET.glass} stroke={SHEET.ink} strokeWidth={1.2 * px} />
+                {hasSize(glass) && (
+                  <>
+                    <rect {...glass} fill={SHEET.glass} stroke={SHEET.glassStroke} strokeWidth={px} />
+                    {/* Two short strokes in a corner, the drafting sign for glass */}
+                    <polyline
+                      points={`${glass.x + glass.width * 0.1},${glass.y + glass.height * 0.28} ${glass.x + glass.width * 0.28},${glass.y + glass.height * 0.1}`}
+                      stroke={SHEET.glassStroke}
+                      strokeWidth={1.2 * px}
+                      fill="none"
                     />
-                    <rect
-                      x={glass.x}
-                      y={glass.y + glass.height / 2 - GLAZING_BAR / 2}
-                      width={glass.width}
-                      height={GLAZING_BAR}
+                    <polyline
+                      points={`${glass.x + glass.width * 0.1},${glass.y + glass.height * 0.4} ${glass.x + glass.width * 0.4},${glass.y + glass.height * 0.1}`}
+                      stroke={SHEET.glassStroke}
+                      strokeWidth={1.2 * px}
+                      fill="none"
                     />
-                  </g>
+                    {casement.glazingBars && (
+                      <g fill={timber} stroke={SHEET.ink} strokeWidth={px}>
+                        <rect
+                          x={glass.x + glass.width / 2 - GLAZING_BAR / 2}
+                          y={glass.y}
+                          width={GLAZING_BAR}
+                          height={glass.height}
+                        />
+                        <rect
+                          x={glass.x}
+                          y={glass.y + glass.height / 2 - GLAZING_BAR / 2}
+                          width={glass.width}
+                          height={GLAZING_BAR}
+                        />
+                      </g>
+                    )}
+                    <OpeningSymbol
+                      opening={pane.opening}
+                      glass={glass}
+                      sash={opening}
+                      stile={SASH}
+                      px={px}
+                      color={outline}
+                    />
+                  </>
                 )}
-                <OpeningSymbol opening={pane.opening} glass={glass} sash={pane} stile={SASH} px={px} color={outline} />
                 {pane.oversize && (
                   <>
                     <rect
@@ -529,7 +554,7 @@ export const ShopDrawing = () => {
             )
           })}
 
-          {mainPanes.length > 1 &&
+          {chained &&
             chain
               .slice(1)
               .map((end, index) => (
@@ -543,14 +568,7 @@ export const ShopDrawing = () => {
                   px={px}
                 />
               ))}
-          <DimensionLine
-            from={0}
-            to={W}
-            at={H + (mainPanes.length > 1 ? 2 : 1) * TIER * px}
-            origin={H}
-            axis="horizontal"
-            px={px}
-          />
+          <DimensionLine from={0} to={W} at={H + (chained ? 2 : 1) * TIER * px} origin={H} axis="horizontal" px={px} />
 
           {split !== null && (
             <>
@@ -670,7 +688,7 @@ components:
 
 ## Rules the drawing shows
 
-A sash wider than its hinges carry would sag, and a top light can leave too little window below it. Both rules are `warning` invariants: the change is kept, so the drawing shows the problem, the inputs say how to fix it, and the window cannot be ordered until it is fixed.
+A sash wider than its hinges carry would sag, a sash narrower than its two stiles has no room for glass, and a top light can leave too little window below it. All three rules are `warning` invariants: the change is kept, so the drawing shows the problem, the inputs say how to fix it, and the window cannot be ordered until it is fixed. The drawing never draws a negative size: a sash with no room for glass is drawn without glass or symbol, and main panes with no height are left out.
 
 ```yaml
 invariants:
@@ -678,6 +696,7 @@ invariants:
     sashSize:
       types:
         - sashTooWide
+        - sashTooNarrow
     topLightTooTall:
       type: topLightTooTall
       severity: warning
@@ -690,26 +709,40 @@ import { phx } from '../../.phoenix/phx.js'
 const MAX_SASH_WIDTH = { Fixed: Infinity, SideHung: 900, TiltTurn: 1300, TopHung: 1600 }
 const OPENING_LABEL = { Fixed: 'fixed', SideHung: 'side-hung', TiltTurn: 'tilt and turn', TopHung: 'top-hung' }
 const MIN_MAIN_HEIGHT = 500
+// A sash's two stiles are 56 mm each, so a narrower opening leaves no room for glass
+const MIN_SASH_WIDTH = 2 * 56
 
 // Both rules are warnings: the drawing keeps the change and marks the problem, and the window cannot be ordered until
 // it is resolved
 export default phx.domain.implementCustomInvariants({
   Window: {
-    // A sash wider than its hinges carry would sag; the message names the limit of the chosen opening
+    // A sash wider than its hinges carry would sag, and one narrower than its two stiles has no room for glass; the
+    // messages name the limit
     sashSize: s => {
       const oversize = s.$panes.find(pane => pane.oversize)
+      const undersize = s.$panes.find(pane => pane.opening !== 'Fixed' && pane.width < MIN_SASH_WIDTH)
+
+      if (oversize !== undefined) {
+        return [
+          {
+            type: 'sashTooWide',
+            severity: 'warning',
+            message: `A ${OPENING_LABEL[s.opening]} sash can be at most ${MAX_SASH_WIDTH[s.opening].toLocaleString('en-GB')} mm wide, and these are ${Math.round(oversize.width).toLocaleString('en-GB')} mm. Add a pane across or make the window narrower.`,
+          },
+        ]
+      }
 
-      if (oversize === undefined) {
-        return []
+      if (undersize !== undefined) {
+        return [
+          {
+            type: 'sashTooNarrow',
+            severity: 'warning',
+            message: `A sash needs at least ${MIN_SASH_WIDTH} mm for its stiles, and these are ${Math.round(undersize.width)} mm. Use fewer panes across or make the window wider.`,
+          },
+        ]
       }
 
-      return [
-        {
-          type: 'sashTooWide',
-          severity: 'warning',
-          message: `A ${OPENING_LABEL[s.opening]} sash can be at most ${MAX_SASH_WIDTH[s.opening].toLocaleString('en-GB')} mm wide, and these are ${Math.round(oversize.width).toLocaleString('en-GB')} mm. Add a pane across or make the window narrower.`,
-        },
-      ]
+      return []
     },
     topLightTooTall: s => {
       return !s.topLight || s.height - 2 * s.$frameWidth - s.topLightHeight - s.$mullionWidth >= MIN_MAIN_HEIGHT
@@ -852,12 +885,14 @@ The same layout in a frame 390 pixels wide: the drawing keeps the top of the scr
 - The page opens on a 1400 × 1250 mm two-light window with side-hung sashes hinged at the outer edges: two dashed symbols with their apexes at the outer sides, the handles on the meeting stiles, the pane widths 700 and 700 below, 1400 overall and 1250 at the side. The title block shows Uw 1.30 W/m²K and 50 kg, and the price is **£1,276.00**.
 - A width of 2100 mm outlines both sashes in red with "SASH TOO WIDE", shows "A side-hung sash can be at most 900 mm wide, and these are 944 mm. …" under **Overall size**, and disables **Add to order**.
 - Three panes across clear the warning: the middle pane reads "FIXED", the outer two open, and the chain reads 710, 680 and 710.
+- Three panes across a 500 mm window show "A sash needs at least 112 mm for its stiles, and these are 71 mm. …" under **Overall size**; the outer sashes are drawn without glass or symbol.
+- A 500 mm high window with the 400 mm top light shows the top light warning, and the drawing keeps the top light and leaves out the main panes.
 - **Top light** adds a fixed pane above a transom, the **Top light height** input, and a second tier on the left with the two heights. A top light of 600 mm in a 1250 mm window shows the top light warning under **Panes**; 380 mm clears it.
 - One pane with **Tilt and turn** shows the **Hinged on the** question; **Right** puts the symbol's apex on the right and the handle on the left, with a second pair of lines pointing down for the tilt.
 - **Top-hung** removes the hinge question and points the symbol's apex to the top, with the handle on the bottom rail.
 - An 800 × 1800 mm window draws tall and narrow, with its lettering at the same size as the wide one's.
 - **Triple** glazing lowers the U-value in the title block and raises the price; **Glazing bars** draws a cross of bars in every pane; **Natural oak** tints the frame and changes the title block's finish.
-- The **−** and **+** buttons change a size by 10 mm, and a typed size is clamped to the input's range.
+- The **−** and **+** buttons change a size by 10 mm, a typed size is clamped to the input's range, and a size cleared and left empty gets its value back.
 - **Add to order** shows a spinner and "Adding…", then "Added to your order" with the size and the price; the inputs are locked until **Draw another**.
 - In the **Phone** story the drawing stays at the top while the inputs scroll, the same warning and drawing changes appear, and **Add to order** confirms the order in the bottom bar.
 - The browser console shows no errors, the page has no `canvas` element, and no model or texture is requested.
@@ -1019,6 +1054,7 @@ invariants:
     sashSize:
       types:
         - sashTooWide
+        - sashTooNarrow
     topLightTooTall:
       type: topLightTooTall
       severity: warning
@@ -1322,8 +1358,8 @@ export const OpeningSymbol = ({ opening, glass, sash, stile, px, color }: Openin
   const midX = x + width / 2
   const midY = y + height / 2
   const dash = `${8 * px} ${5 * px}`
-  const handleLength = Math.min(120, height / 3)
-  const handleWidth = Math.min(16, stile / 2)
+  const handleLength = Math.max(0, Math.min(120, height / 3))
+  const handleWidth = Math.max(0, Math.min(16, stile / 2))
 
   if (opening === 'Fixed') {
     return (
@@ -1373,7 +1409,9 @@ export const OpeningSymbol = ({ opening, glass, sash, stile, px, color }: Openin
       {tiltLines && (
         <polyline points={tiltLines} fill="none" stroke={color} strokeWidth={1.2 * px} strokeDasharray={dash} />
       )}
-      <rect {...handle} rx={handleWidth / 2} fill={SHEET.paper} stroke={SHEET.ink} strokeWidth={1.4 * px} />
+      {handleLength > 0 && (
+        <rect {...handle} rx={handleWidth / 2} fill={SHEET.paper} stroke={SHEET.ink} strokeWidth={1.4 * px} />
+      )}
     </g>
   )
 }
@@ -1428,8 +1466,19 @@ const useSize = () => {
   return { ref, size }
 }
 
+// A rectangle moved in by `by` on every side. A size the spec allows can leave no room, for example three panes across
+// a 500 mm window, so the size never drops below zero; what has no size is not drawn.
 const inset = (rect: { x: number; y: number; width: number; height: number }, by: number) => {
-  return { x: rect.x + by, y: rect.y + by, width: rect.width - 2 * by, height: rect.height - 2 * by }
+  return {
+    x: rect.x + by,
+    y: rect.y + by,
+    width: Math.max(0, rect.width - 2 * by),
+    height: Math.max(0, rect.height - 2 * by),
+  }
+}
+
+const hasSize = (rect: { width: number; height: number }) => {
+  return rect.width > 0 && rect.height > 0
 }
 
 // The elevation of the window as configured, drawn in millimetres from the spec's `$panes` expression. The drawing is
@@ -1441,8 +1490,14 @@ export const ShopDrawing = () => {
   const { width: W, height: H, $panes: panes, $mullionWidth: mullion } = casement
   const mainPanes = panes.filter(pane => pane.key.startsWith('P'))
   const topLight = panes.find(pane => pane.key === 'T1')
-  const left = (topLight ? 2 : 1) * TIER + 18
-  const bottom = (mainPanes.length > 1 ? 2 : 1) * TIER + 14
+  const transom = topLight ? topLight.y + topLight.height + mullion / 2 : null
+  // A tall top light can leave the main panes no height. They are not drawn then, so neither is a height split
+  // over them nor the chain of their widths
+  const mainPanesDrawn = mainPanes.some(hasSize)
+  const split = mainPanesDrawn ? transom : null
+  const chained = mainPanesDrawn && mainPanes.length > 1
+  const left = (split !== null ? 2 : 1) * TIER + 18
+  const bottom = (chained ? 2 : 1) * TIER + 14
   const timber = SHEET.timber[casement.finish]
 
   // Pixels per millimetre: the window and its margins fill the box in its tighter direction
@@ -1454,7 +1509,6 @@ export const ShopDrawing = () => {
   const viewBox = [-left * px, -MARGIN.top * px, W + (left + MARGIN.right) * px, H + (MARGIN.top + bottom) * px]
   // The chain of pane widths along the bottom, measured to the centres of the mullions
   const chain = [0, ...mainPanes.slice(0, -1).map(pane => pane.x + pane.width + mullion / 2), W]
-  const split = topLight ? topLight.y + topLight.height + mullion / 2 : null
 
   return (
     <Box component="div" ref={ref} sx={{ position: 'absolute', inset: 0 }}>
@@ -1472,51 +1526,60 @@ export const ShopDrawing = () => {
 
           {panes.map(pane => {
             const isSash = pane.opening !== 'Fixed'
+            const opening = inset(pane, 0)
             const glass = inset(pane, isSash ? SASH : BEAD)
             const outline = pane.oversize ? SHEET.attention : SHEET.ink
 
+            // A top light can leave the main panes no height at all; the spec's warning says so
+            if (!hasSize(opening)) {
+              return null
+            }
+
             return (
               <g key={pane.key}>
-                <rect
-                  x={pane.x}
-                  y={pane.y}
-                  width={pane.width}
-                  height={pane.height}
-                  fill={isSash ? timber : SHEET.glass}
-                  stroke={SHEET.ink}
-                  strokeWidth={1.2 * px}
-                />
-                <rect {...glass} fill={SHEET.glass} stroke={SHEET.glassStroke} strokeWidth={px} />
-                {/* Two short strokes in a corner, the drafting sign for glass */}
-                <polyline
-                  points={`${glass.x + glass.width * 0.1},${glass.y + glass.height * 0.28} ${glass.x + glass.width * 0.28},${glass.y + glass.height * 0.1}`}
-                  stroke={SHEET.glassStroke}
-                  strokeWidth={1.2 * px}
-                  fill="none"
-                />
-                <polyline
-                  points={`${glass.x + glass.width * 0.1},${glass.y + glass.height * 0.4} ${glass.x + glass.width * 0.4},${glass.y + glass.height * 0.1}`}
-                  stroke={SHEET.glassStroke}
-                  strokeWidth={1.2 * px}
-                  fill="none"
-                />
-                {casement.glazingBars && (
-                  <g fill={timber} stroke={SHEET.ink} strokeWidth={px}>
-                    <rect
-                      x={glass.x + glass.width / 2 - GLAZING_BAR / 2}
-                      y={glass.y}
-                      width={GLAZING_BAR}
-                      height={glass.height}
+                <rect {...opening} fill={isSash ? timber : SHEET.glass} stroke={SHEET.ink} strokeWidth={1.2 * px} />
+                {hasSize(glass) && (
+                  <>
+                    <rect {...glass} fill={SHEET.glass} stroke={SHEET.glassStroke} strokeWidth={px} />
+                    {/* Two short strokes in a corner, the drafting sign for glass */}
+                    <polyline
+                      points={`${glass.x + glass.width * 0.1},${glass.y + glass.height * 0.28} ${glass.x + glass.width * 0.28},${glass.y + glass.height * 0.1}`}
+                      stroke={SHEET.glassStroke}
+                      strokeWidth={1.2 * px}
+                      fill="none"
                     />
-                    <rect
-                      x={glass.x}
-                      y={glass.y + glass.height / 2 - GLAZING_BAR / 2}
-                      width={glass.width}
-                      height={GLAZING_BAR}
+                    <polyline
+                      points={`${glass.x + glass.width * 0.1},${glass.y + glass.height * 0.4} ${glass.x + glass.width * 0.4},${glass.y + glass.height * 0.1}`}
+                      stroke={SHEET.glassStroke}
+                      strokeWidth={1.2 * px}
+                      fill="none"
+                    />
+                    {casement.glazingBars && (
+                      <g fill={timber} stroke={SHEET.ink} strokeWidth={px}>
+                        <rect
+                          x={glass.x + glass.width / 2 - GLAZING_BAR / 2}
+                          y={glass.y}
+                          width={GLAZING_BAR}
+                          height={glass.height}
+                        />
+                        <rect
+                          x={glass.x}
+                          y={glass.y + glass.height / 2 - GLAZING_BAR / 2}
+                          width={glass.width}
+                          height={GLAZING_BAR}
+                        />
+                      </g>
+                    )}
+                    <OpeningSymbol
+                      opening={pane.opening}
+                      glass={glass}
+                      sash={opening}
+                      stile={SASH}
+                      px={px}
+                      color={outline}
                     />
-                  </g>
+                  </>
                 )}
-                <OpeningSymbol opening={pane.opening} glass={glass} sash={pane} stile={SASH} px={px} color={outline} />
                 {pane.oversize && (
                   <>
                     <rect
@@ -1544,7 +1607,7 @@ export const ShopDrawing = () => {
             )
           })}
 
-          {mainPanes.length > 1 &&
+          {chained &&
             chain
               .slice(1)
               .map((end, index) => (
@@ -1558,14 +1621,7 @@ export const ShopDrawing = () => {
                   px={px}
                 />
               ))}
-          <DimensionLine
-            from={0}
-            to={W}
-            at={H + (mainPanes.length > 1 ? 2 : 1) * TIER * px}
-            origin={H}
-            axis="horizontal"
-            px={px}
-          />
+          <DimensionLine from={0} to={W} at={H + (chained ? 2 : 1) * TIER * px} origin={H} axis="horizontal" px={px} />
 
           {split !== null && (
             <>
@@ -1891,7 +1947,8 @@ const MillimetreInput = ({ instanceName, label, readOnly }: MillimetreFieldProps
   const commitDraft = () => {
     const parsed = Number(draft)
 
-    if (Number.isFinite(parsed)) {
+    // `Number('')` is 0, so a cleared field would become the minimum; it gets the stored value back instead
+    if (draft.trim() !== '' && Number.isFinite(parsed)) {
       commit(parsed)
     } else {
       setDraft(String(dimension.value))
@@ -2435,7 +2492,7 @@ interface WindowInputsProps {
 export const WindowInputs = ({ readOnly }: WindowInputsProps) => {
   return (
     <Box component="div" sx={{ display: 'grid' }}>
-      <Section title="Overall size" warningTypes={['sashTooWide']}>
+      <Section title="Overall size" warningTypes={['sashTooWide', 'sashTooNarrow']}>
         <MillimetreField instanceName="width" label="Width" readOnly={readOnly} />
         <MillimetreField instanceName="height" label="Height" readOnly={readOnly} />
       </Section>
@@ -2701,26 +2758,40 @@ import { phx } from '../../.phoenix/phx.js'
 const MAX_SASH_WIDTH = { Fixed: Infinity, SideHung: 900, TiltTurn: 1300, TopHung: 1600 }
 const OPENING_LABEL = { Fixed: 'fixed', SideHung: 'side-hung', TiltTurn: 'tilt and turn', TopHung: 'top-hung' }
 const MIN_MAIN_HEIGHT = 500
+// A sash's two stiles are 56 mm each, so a narrower opening leaves no room for glass
+const MIN_SASH_WIDTH = 2 * 56
 
 // Both rules are warnings: the drawing keeps the change and marks the problem, and the window cannot be ordered until
 // it is resolved
 export default phx.domain.implementCustomInvariants({
   Window: {
-    // A sash wider than its hinges carry would sag; the message names the limit of the chosen opening
+    // A sash wider than its hinges carry would sag, and one narrower than its two stiles has no room for glass; the
+    // messages name the limit
     sashSize: s => {
       const oversize = s.$panes.find(pane => pane.oversize)
+      const undersize = s.$panes.find(pane => pane.opening !== 'Fixed' && pane.width < MIN_SASH_WIDTH)
+
+      if (oversize !== undefined) {
+        return [
+          {
+            type: 'sashTooWide',
+            severity: 'warning',
+            message: `A ${OPENING_LABEL[s.opening]} sash can be at most ${MAX_SASH_WIDTH[s.opening].toLocaleString('en-GB')} mm wide, and these are ${Math.round(oversize.width).toLocaleString('en-GB')} mm. Add a pane across or make the window narrower.`,
+          },
+        ]
+      }
 
-      if (oversize === undefined) {
-        return []
+      if (undersize !== undefined) {
+        return [
+          {
+            type: 'sashTooNarrow',
+            severity: 'warning',
+            message: `A sash needs at least ${MIN_SASH_WIDTH} mm for its stiles, and these are ${Math.round(undersize.width)} mm. Use fewer panes across or make the window wider.`,
+          },
+        ]
       }
 
-      return [
-        {
-          type: 'sashTooWide',
-          severity: 'warning',
-          message: `A ${OPENING_LABEL[s.opening]} sash can be at most ${MAX_SASH_WIDTH[s.opening].toLocaleString('en-GB')} mm wide, and these are ${Math.round(oversize.width).toLocaleString('en-GB')} mm. Add a pane across or make the window narrower.`,
-        },
-      ]
+      return []
     },
     topLightTooTall: s => {
       return !s.topLight || s.height - 2 * s.$frameWidth - s.topLightHeight - s.$mullionWidth >= MIN_MAIN_HEIGHT