DOMVisualElement.mjs 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. import { isMotionValue } from '../../value/utils/is-motion-value.mjs';
  2. import { VisualElement } from '../VisualElement.mjs';
  3. import { DOMKeyframesResolver } from './DOMKeyframesResolver.mjs';
  4. class DOMVisualElement extends VisualElement {
  5. constructor() {
  6. super(...arguments);
  7. this.KeyframeResolver = DOMKeyframesResolver;
  8. }
  9. sortInstanceNodePosition(a, b) {
  10. /**
  11. * compareDocumentPosition returns a bitmask, by using the bitwise &
  12. * we're returning true if 2 in that bitmask is set to true. 2 is set
  13. * to true if b preceeds a.
  14. */
  15. return a.compareDocumentPosition(b) & 2 ? 1 : -1;
  16. }
  17. getBaseTargetFromProps(props, key) {
  18. return props.style
  19. ? props.style[key]
  20. : undefined;
  21. }
  22. removeValueFromRenderState(key, { vars, style }) {
  23. delete vars[key];
  24. delete style[key];
  25. }
  26. handleChildMotionValue() {
  27. if (this.childSubscription) {
  28. this.childSubscription();
  29. delete this.childSubscription;
  30. }
  31. const { children } = this.props;
  32. if (isMotionValue(children)) {
  33. this.childSubscription = children.on("change", (latest) => {
  34. if (this.current) {
  35. this.current.textContent = `${latest}`;
  36. }
  37. });
  38. }
  39. }
  40. }
  41. export { DOMVisualElement };