## HAX - Headless Authoring eXperience

HAX is a WYSIWYG unlike any other. You extend your world by extending the web through the web component standard. HAX has a simple schema and integrations to allow anyone to author that "widget" on any web site.

This means that developers can fundamentally change the way HTML operates while expressing it in a highly semantic tag structure.

## Let's understand through a silly example

Web components
It's "the" platform

## How HAX leverages this

HAX leverages this capability to express advanced functionality through a single tag in order to build itself. Ultimately, HAX is made up of dozens of complex new web component tags. In the end though. It shows up on the interface like . A single tag that cascades and unpacks a unique interface experience.

HAX also doesn't understand what it's editing though! It hasn't been built to say, understand the meme-maker tag above. It's been built to edit things in a very general sense. If it's a custom element / DOM object, it could theoretically edit it... if it knew the directions. These directions are emitted from HAX capable elements when the editor sets itself up. The critical implication of this:

- HAX can be extended to understand how to modify just about any custom element!
- these definitions are limited by the develop more or less creating the rules of the experience
- the content produced can operate anywhere with or without hax after the fact

## Wait, how can you say that

HAX is effectively organizing the HTML of the page just like you could. Let's look at an example of this page's source. Either hit edit and then the "Source View" button or see the screenshot below

So when this page was built and the files/lego.jpg file uploaded (drag and drop in a place holder area) we selected the "Full width" image type for rendering. Then, adding a caption in the HAX element panel, we hit insert and HAX writes the properties into the web component and adds it to the DOM it is editing. When you hit save, HAX takes this piece of DOM and converts it into HTML to send to a backend.

The output has no trace of HAX, meaning that if you can load the web component definition for the full-width-image tag, then you no longer require HAX. It also means that if this content migrates between platforms that have access to HAX, it'll know how to pick up and modify the content after the fact (as long as the web component definition is there).

In this way, HAX then gets integrated into other platforms by effectively managing the "body" / blob area that makes up the page. The visual assets produced that work with HAX can then be used anywhere in any website.