fix(preview): render translucent solid fills and outlines - #301
Merged
Merged
Conversation
`<a:alpha>` / `<a:alphaMod>` / `<a:alphaOff>` on a solid fill or outline color were parsed but never surfaced, so a semi-transparent shape laid over layout artwork rendered as an opaque block that hid the gradient (or slide background) beneath it. OOXML keeps alpha beside the color rather than inside it, so the resolved `#RRGGBB` stays as is and the opacity is exposed through new readers (`resolveDrawingColorOpacity`, `getShapeFillOpacity`, `getShapeStrokeOpacity`); the preview renderer emits `fill-opacity` / `stroke-opacity` from them, including for the custom-geometry path, which previously dropped extra attributes when a path had no stroke.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Solid fills and outlines whose color carries
<a:alpha>/<a:alphaMod>/<a:alphaOff>now render with the matchingfill-opacity/stroke-opacityin@office-kit/pptx-preview, and@office-kit/pptxexposes the opacity throughresolveDrawingColorOpacity,getShapeFillOpacity, andgetShapeStrokeOpacity. A translucent shape layered over layout artwork previously painted as an opaque block and hid the gradient or slide background beneath it.Motivation
Corporate slide templates commonly stack a semi-transparent "veil" shape on the slide layout over a gradient. The color transform parser already recognised the alpha children (and deliberately left the RGB untouched), but nothing surfaced the value, so the preview painted the veil at 100% and the slide looked nothing like PowerPoint or LibreOffice. Found while previewing such a template; opened without an issue because the fix is small and self-contained.
Changes
@office-kit/pptx: new exportsresolveDrawingColorOpacity(colorEl),getShapeFillOpacity(shape),getShapeStrokeOpacity(shape)(0–1 fraction,nullwhen no alpha transform is present, mirroringgetShapeImageOpacity).getShapeFillColorResolved/getShapeStrokeColorResolvedare unchanged and still return the plain#RRGGBB.@office-kit/pptx-preview: emitsfill-opacityon solid fills (preset geometry and custom geometry paths) andstroke-opacityon solid outlines, for slide shapes and for artwork inherited from layouts / masters. Peer dependency on@office-kit/pptxraised to>=0.13.0.@office-kit/pptxminor,@office-kit/pptx-previewpatch.Testing
test/fn-resolve-drawing-color.test.ts(alpha / alphaMod / alphaOff order, clamping, bare-float values) andtest/fn-shape-fill-opacity.test.ts(fill and outline read independently; color readers stay alpha-free).test/preview-effects-fills.test.ts: a slide shape with 27% fill / 50% outline alpha, and a layout-level translucent shape over the Blank layout.pnpm test→ 313 files, 1334 tests passed.pnpm format:check,pnpm lint,pnpm typecheck,pnpm build, and the preview package'stypecheck/buildpass.Breaking changes
None. Consumers of
@office-kit/pptx-previewneed@office-kit/pptx >= 0.13.0because the renderer imports the new readers.Checklist
flagged it above.
represents real work that warrants a maintainer's review, and I am willing to
defend each line in review.
🤖 Generated with Claude Code
https://claude.ai/code/session_01GvR7C4YF5qxjGtn3bnbG3i