react-interactive-inspect

A react component to select part of a webpage, given raw html and css

Usage no npm install needed!

<script type="module">
  import reactInteractiveInspect from 'https://cdn.skypack.dev/react-interactive-inspect';
</script>

README

react-interactive-inspect

A react component to select part of a webpage, given the raw html and css as strings

NPM JavaScript Style Guide

Install

npm install --save react-interactive-inspect

yarn add react-interactive-inspect

Usage

import * as React from "react";

import InteractiveXPathSelector from "react-interactive-inspect";

const htmlData = "<html><ul><li>1</li><li>2</li><li>3</li></ul></html>";
const cssData = "ul { paddingBottom: 10px }";

class Example extends React.Component {
  render() {
    return (
      <InteractiveXPathSelector
        html={htmlData}
        css={cssData}
        onSelect={path => console.log(path)}
      />
    );
  }
}

License

MIT © jaw9c