From 441baca292f7e7df2c2a2a2453b027b3ade0a8bc Mon Sep 17 00:00:00 2001 From: Westbrook Johnson Date: Wed, 25 Jan 2023 21:34:18 -0500 Subject: [PATCH] [labs/virtualizer] Trigger reflow after padding is set (#3606) * Trigger reflow after padding is set --- .changeset/slimy-mails-clean.md | 5 +++++ .../src/layouts/shared/SizeGapPaddingBaseLayout.ts | 4 ++++ 2 files changed, 9 insertions(+) create mode 100644 .changeset/slimy-mails-clean.md diff --git a/.changeset/slimy-mails-clean.md b/.changeset/slimy-mails-clean.md new file mode 100644 index 0000000000..f86db99c2c --- /dev/null +++ b/.changeset/slimy-mails-clean.md @@ -0,0 +1,5 @@ +--- +"@lit-labs/virtualizer": patch +--- + +Trigger reflow after padding is set diff --git a/packages/labs/virtualizer/src/layouts/shared/SizeGapPaddingBaseLayout.ts b/packages/labs/virtualizer/src/layouts/shared/SizeGapPaddingBaseLayout.ts index b013d55ced..45afac953d 100644 --- a/packages/labs/virtualizer/src/layouts/shared/SizeGapPaddingBaseLayout.ts +++ b/packages/labs/virtualizer/src/layouts/shared/SizeGapPaddingBaseLayout.ts @@ -174,17 +174,21 @@ export abstract class SizeGapPaddingBaseLayout< .map((v) => paddingValueToNumber(v as PaddingValue)); if (values.length === 1) { padding.top = padding.right = padding.bottom = padding.left = values[0]; + this._triggerReflow(); } else if (values.length === 2) { padding.top = padding.bottom = values[0]; padding.right = padding.left = values[1]; + this._triggerReflow(); } else if (values.length === 3) { padding.top = values[0]; padding.right = padding.left = values[1]; padding.bottom = values[2]; + this._triggerReflow(); } else if (values.length === 4) { ['top', 'right', 'bottom', 'left'].forEach( (side, idx) => (padding[side as side] = values[idx]) ); + this._triggerReflow(); } } }