How to use the diffhtml.use function in diffhtml

To help you get started, we’ve selected a few diffhtml examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github raen79 / fie / lib / javascript / fie.js View on Github external
_diffSetup() {
    polyfill();

    use(
      Object.assign(_ => {}, {
        syncTreeHook: (oldTree, newTree) => {
          if (newTree.nodeName === 'input') {
            const oldElement = document.querySelector('[name="' + newTree.attributes['name'] + '"]');

            if (oldElement != undefined && oldElement.attributes['fie-ignore'] != undefined) {
              newTree.nodeValue = oldElement.value;
              newTree.attributes['value'] = oldElement.value;
              newTree.attributes['autofocus'] = '';
              newTree.attributes['fie-ignore'] = oldElement.attributes['fie-ignore'];
            }

            return newTree;
          }
        }
      })
github tbranyen / diffhtml / packages / diffhtml-react-compat / lib / index.js View on Github external
addTransitionState,
  removeTransitionState,
  release,
  Internals,
} from 'diffhtml';
import { Component } from 'diffhtml-components';
import PropTypes from 'prop-types';
import Children from './children';
import PureComponent from './pure-component';
import syntheticEvents from 'diffhtml-middleware-synthetic-events';

const { assign, keys } = Object;
const { NodeCache } = Internals;

if (typeof document !== 'undefined') {
  use(syntheticEvents());
}

const REACT_ELEMENT_TYPE = Symbol.for('react.element') || 0xeac7;

const createElement = (...args) => {
  const tree = createTree(...args);

  tree.$$typeof = REACT_ELEMENT_TYPE;

  const attributes = keys(tree.attributes);

  if (attributes.includes('className')) {
    tree.attributes.class = tree.attributes.className;
  }

  if (attributes.includes('htmlFor')) {
github mAAdhaTTah / brookjs / packages / brookjs / src / component / render / index.js View on Github external
import assert from 'assert';
import R from 'ramda';
import { outerHTML, use } from 'diffhtml';
import Kefir from '../../kefir';
import { $$internals, $$meta } from '../constants';
import { raf$ } from '../rAF';
import middleware from './middleware';
import createEffects$ from './createEffects$';

use(middleware());

/**
 * Creates a stream that updates the element to match the provided HTML.
 *
 * @param {Element} el - Element to update.
 * @param {string} html - HTML to update to.
 * @returns {Kefir.Observable} Render stream.
 */
export const renderFromHTML = R.curry((el, html) =>
    raf$.take(1).flatMap(() => {
        if (process.env.NODE_ENV !== 'production') {
            assert.equal(typeof html, 'string', '`template` should return a string');
        }

        return outerHTML(el, html);
    })
github tbranyen / diffhtml / packages / diffhtml-components / lib / shared / upgrade-shared-class.js View on Github external
Constructor.subscribeMiddleware = options => {
    if (unsubscribe) {
      unsubscribe();
    }

    unsubscribe = use(componentTask(options));
  };