keyed.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. /**
  2. * @license
  3. * Copyright 2021 Google LLC
  4. * SPDX-License-Identifier: BSD-3-Clause
  5. */
  6. import { nothing } from '../lit-html.js';
  7. import { directive, Directive, } from '../directive.js';
  8. import { setCommittedValue } from '../directive-helpers.js';
  9. class Keyed extends Directive {
  10. constructor() {
  11. super(...arguments);
  12. this.key = nothing;
  13. }
  14. render(k, v) {
  15. this.key = k;
  16. return v;
  17. }
  18. update(part, [k, v]) {
  19. if (k !== this.key) {
  20. // Clear the part before returning a value. The one-arg form of
  21. // setCommittedValue sets the value to a sentinel which forces a
  22. // commit the next render.
  23. setCommittedValue(part);
  24. this.key = k;
  25. }
  26. return v;
  27. }
  28. }
  29. /**
  30. * Associates a renderable value with a unique key. When the key changes, the
  31. * previous DOM is removed and disposed before rendering the next value, even
  32. * if the value - such as a template - is the same.
  33. *
  34. * This is useful for forcing re-renders of stateful components, or working
  35. * with code that expects new data to generate new HTML elements, such as some
  36. * animation techniques.
  37. */
  38. export const keyed = directive(Keyed);
  39. //# sourceMappingURL=keyed.js.map