@base-framework/atoms 1.0.22 → 1.0.24

package/README.md

@@ -19,7 +19,7 @@ Atoms can be instantiated using various methodologies:
 ### Function Atoms
 These atoms are instantiated with either standard functions or arrow functions, equipped with a props object to transfer properties to the atoms.
 
-```typescript
+```javascript
 const Div = (props, children) => ({
     ...props,
     children
@@ -29,7 +29,7 @@ const Div = (props, children) => ({
 ### Atom Callbacks
 Atoms may be created using the Atom function, which accepts a callback function as its sole parameter. The callback function is passed a props object and children array and returns an object containing the atom's layout.
 
-```typescript
+```javascript
 const Button = Atom((props, children) => ({
     tag: 'button',
     ...props,
@@ -40,7 +40,7 @@ const Button = Atom((props, children) => ({
 #### Atom Nesting
 Atoms should use composition to nest other atoms. This is achieved by passing the children array to the atoms args.
 
-```typescript
+```javascript
 const SecondaryButton = Atom((props, children) => (Button({
     ...props,
     class: 'secondary-btn',
@@ -52,7 +52,7 @@ const SecondaryButton = Atom((props, children) => (Button({
 Event listener callbacks within atoms accept two parameters: the originating event object and the "parent" component object in which the atom resides.
 
 ### Accessing the Parent Component in an Atom
-```typescript
+```javascript
 class Page extends Component
 {
     render()
@@ -124,6 +124,84 @@ Section([
 ])
 ```
 
+## Special Atoms
+Special atoms are atoms that have been pre-configured with specific properties. These atoms are designed to simplify the creation of common components. This library has a few special atoms that can help create complex actions.
+
+### On Atom
+The On atom allows a child to be added or removed based on a bindable data property. This atom makes the child not need to have an "onSet" property on a parent wrapper allowing for easier layouts with less code.
+
+```javascript
+
+// The traditional way using a parent wrapper with an onSet property
+Div({
+    class: "p-4 transition",
+    onState: ["loaded", (loaded) => (!loaded)
+        ? SkeletonPost()
+        : Post(post)
+    ]
+})
+
+// The new way using the On atom
+Div({ class: "p-4 transition" }, [
+    On('loaded', (loaded) => (!loaded)
+    ? SkeletonPost()
+    : Post(post))
+])
+
+// Or with a state
+Div({ class: "p-4 transition" }, [
+    OnState('loaded', (loaded) => (!loaded)
+    ? SkeletonPost()
+    : Post(post))
+])
+
+// Children can now be added dynamically without a wrapper
+Div({ class: "p-4 transition" }, [
+    H1('Title'),
+
+    // this will add or remove this child based on the loaded state
+    On('loaded', (loaded) => (!loaded)
+    ? SkeletonPost()
+    : Post(post))
+])
+
+```
+
+The On and OnState atoms support two overloads. The first overload is the data property to bind to and the second is the callback function that will be called when the data property changes.
+
+### On Atom Overloads
+```javascript
+
+// This will watch to the component data, or context data, or component state in that order if the first two are not set in the component.
+// data property, callback
+On('loaded', (loaded) => (!loaded)
+    ? SkeletonPost()
+    : Post(post))
+
+```
+
+The second overload allows for a custom data source to be used. This allows for more flexibility with the layouts.
+
+```javascript
+
+// watching on the component route
+// data source, data property, callback
+On(this.route, 'loaded', (loaded) => (!loaded)
+    ? SkeletonPost()
+    : Post(post))
+
+```
+
+The callback function will be called when the data property changes. The callback function will be called with the new value of the data property, the element that the watcher is using, and the parent component.
+
+```javascript
+// the new data value, the element that the watcher is using, the parent component object
+(loaded, element, parent) =>
+{
+    // handle the loaded state
+}
+```
+
 ## Contributing
 
 Contributions to Base Framework are welcome. Follow these steps to contribute:

package/dist/atoms.js

@@ -1,2 +1,2 @@
-import{Atom as e}from"@base-framework/base";import{Builder as x,dataBinder as i}from"@base-framework/base";var u=(t,o,s,r)=>!t||!r||r.isUnit!==!0||t.persist!==!0||!t.state?r:m(t,o,s,r),m=(t,o,s,r)=>{let a=o+":"+s,p=t.state,c=p.get(a);return typeof c<"u"&&(r=c),p.set(a,r),r},d=(t,o,s,r)=>{let a=null;return p=>{let c=t(p,o,r);if(!c)return;a&&x.removeNode(a),c=u(r,s,p,c);let g=x.build(c,null,r);a=g.children[0],o.parentNode.insertBefore(g,o.nextSibling)}},l=t=>({tag:"comment",textContent:"on placeholder",onCreated:t.onCreated}),f=t=>t.data?t.data:t.context&&t.context.data?t.context.data:t.state?t.state:null,b=(...t)=>{let o=[...t],s=o.pop();if(typeof s=="function")return l({onCreated:(r,a)=>{if(o.length<2){let c=f(a);o.unshift(c)}let p=d(s,r,o[1],a);i.watch(r,o[0],o[1],p)}})},h=(...t)=>{let o=[...t],s=o.pop();if(typeof s=="function")return l({onCreated:(r,a)=>{if(o.length<2){let c=a.state;o.unshift(c)}let p=d(s,r,o[1],a);i.watch(r,o[0],o[1],p)}})};var n=(t,o)=>({...t,children:o}),C=t=>({...t,tag:"DOCTYPE"}),D=e((t,o)=>n({...t,tag:"html"},o)),H=e((t,o)=>n({...t,tag:"script"},o)),O=e((t,o)=>n({...t,tag:"style"},o)),P=e((t,o)=>n({...t,tag:"head"},o)),A=t=>({...t}),R=t=>({...t,tag:"meta"}),F=t=>({...t,tag:"link"}),L=e((t,o)=>n({...t,tag:"body"},o)),I=e((t,o)=>n(t,o)),M=e((t,o)=>n({...t,tag:"dialog"},o)),q=e((t,o)=>n({...t,tag:"span"},o)),w=e((t,o)=>n({...t,tag:"p"},o)),E=e((t,o)=>n({...t,tag:"a"},o)),y=e((t,o)=>n({...t,tag:"button"},o)),N=e((t,o)=>y({...t,type:"submit"},o)),U=e((t,o)=>n({...t,tag:"ul"},o)),V=e((t,o)=>n({...t,tag:"li"},o)),K=e(t=>n({...t,tag:"img"},null)),Q=e(t=>n({...t,tag:"br"},null)),W=e(t=>n({...t,tag:"hr"},null)),Y=e((t,o)=>n({...t,tag:"text"},o)),j=e((t,o)=>n({...t,tag:"h1"},o)),z=e((t,o)=>n({...t,tag:"h2"},o)),G=e((t,o)=>n({...t,tag:"h3"},o)),J=e((t,o)=>n({...t,tag:"h4"},o)),X=e((t,o)=>n({...t,tag:"h5"},o)),Z=e((t,o)=>n({...t,tag:"h6"},o)),S=e(t=>n({...t,tag:"input"},null)),_=e((t,o)=>n({...t,tag:"label"},o)),$=e(t=>S({...t,type:"checkbox"})),tt=e((t,o)=>n({...t,tag:"section"},o)),ot=e((t,o)=>n({...t,tag:"article"},o)),et=e((t,o)=>n({...t,tag:"header"},o)),nt=e((t,o)=>n({...t,tag:"footer"},o)),rt=e((t,o)=>n({...t,tag:"nav"},o)),at=e((t,o)=>n({...t,tag:"aside"},o)),st=e((t,o)=>n({...t,tag:"figure"},o)),ct=e((t,o)=>n({...t,tag:"figcaption"},o)),pt=e((t,o)=>n({...t,tag:"main"},o)),gt=e((t,o)=>n({...t,tag:"video"},o)),xt=e((t,o)=>n({...t,tag:"audio"},o)),it=e((t,o)=>n({...t,tag:"table"},o)),dt=e((t,o)=>n({...t,tag:"tr"},o)),lt=e((t,o)=>n({...t,tag:"th"},o)),ut=e((t,o)=>n({...t,tag:"td"},o)),mt=e((t,o)=>n({...t,tag:"thead"},o)),ft=e((t,o)=>n({...t,tag:"tbody"},o)),bt=e((t,o)=>n({...t,tag:"tfoot"},o)),ht=e((t,o)=>n({...t,tag:"form"},o)),yt=e((t,o)=>n({...t,tag:"select"},o)),St=e((t,o)=>n({...t,tag:"option"},o)),kt=e((t,o)=>n({...t,tag:"textarea"},o)),Bt=e((t,o)=>n({...t,tag:"canvas"},o)),Tt=e((t,o)=>n({...t,tag:"progress"},o)),vt=e((t,o)=>n({...t,tag:"blockquote"},o)),Ct=e((t,o)=>n({...t,tag:"pre"},o)),Dt=e((t,o)=>n({...t,tag:"code"},o)),Ht=e((t,o)=>n({...t,tag:"ol"},o)),Ot=e((t,o)=>n({...t,tag:"dl"},o)),Pt=e((t,o)=>n({...t,tag:"dt"},o)),At=e((t,o)=>n({...t,tag:"dd"},o)),Rt=e((t,o)=>n({...t,tag:"fieldset"},o)),Ft=e((t,o)=>n({...t,tag:"legend"},o)),Lt=e((t,o)=>n({...t,tag:"meter"},o)),It=e((t,o)=>n({...t,tag:"iframe"},o)),Mt=e((t,o)=>n({...t,tag:"details"},o)),qt=e((t,o)=>n({...t,tag:"summary"},o)),wt=e((t,o)=>n({...t,tag:"em"},o)),Et=e((t,o)=>n({...t,tag:"strong"},o)),Nt=e((t,o)=>n({...t,tag:"small"},o)),Ut=e((t,o)=>n({...t,tag:"s"},o)),Vt=e((t,o)=>n({...t,tag:"cite"},o)),Kt=e((t,o)=>n({...t,tag:"q"},o)),Qt=e((t,o)=>n({...t,tag:"dfn"},o)),Wt=e((t,o)=>n({...t,tag:"abbr"},o)),Yt=e((t,o)=>n({...t,tag:"data"},o)),jt=e((t,o)=>n({...t,tag:"time"},o)),zt=e((t,o)=>n({...t,tag:"var"},o)),Gt=e((t,o)=>n({...t,tag:"samp"},o)),Jt=e((t,o)=>n({...t,tag:"kbd"},o)),Xt=e((t,o)=>n({...t,tag:"sub"},o)),Zt=e((t,o)=>n({...t,tag:"sup"},o)),_t=e((t,o)=>n({...t,tag:"i"},o)),$t=e((t,o)=>n({...t,tag:"b"},o)),to=e((t,o)=>n({...t,tag:"u"},o)),oo=e((t,o)=>n({...t,tag:"mark"},o)),eo=e((t,o)=>n({...t,tag:"ruby"},o)),no=e((t,o)=>n({...t,tag:"rt"},o)),ro=e((t,o)=>n({...t,tag:"rp"},o)),ao=e((t,o)=>n({...t,tag:"bdi"},o)),so=e((t,o)=>n({...t,tag:"bdo"},o)),co=e(t=>n({...t,tag:"wbr"},null));export{E as A,Wt as Abbr,ot as Article,at as Aside,xt as Audio,$t as B,ao as Bdi,so as Bdo,vt as Blockquote,L as Body,Q as Br,y as Button,Bt as Canvas,$ as Checkbox,Vt as Cite,Dt as Code,Yt as Data,At as Dd,Mt as Details,Qt as Dfn,M as Dialog,I as Div,Ot as Dl,C as Doctype,Pt as Dt,wt as Em,Rt as Fieldset,ct as Figcaption,st as Figure,nt as Footer,ht as Form,j as H1,z as H2,G as H3,J as H4,X as H5,Z as H6,P as Head,et as Header,W as Hr,D as Html,_t as I,It as Iframe,K as Img,S as Input,Jt as Kbd,_ as Label,Ft as Legend,V as Li,F as Link,pt as Main,oo as Mark,R as Meta,Lt as Meter,rt as Nav,Ht as Ol,b as On,h as OnState,St as Option,w as P,Ct as Pre,Tt as Progress,Kt as Q,ro as Rp,no as Rt,eo as Ruby,Ut as S,Gt as Samp,H as Script,tt as Section,yt as Select,Nt as Small,q as Span,Et as Strong,O as Style,Xt as Sub,N as SubmitButton,qt as Summary,Zt as Sup,it as Table,ft as Tbody,ut as Td,Y as Text,kt as Textarea,bt as Tfoot,lt as Th,mt as Thead,jt as Time,A as Title,dt as Tr,to as U,U as Ul,zt as Var,gt as Video,co as Wbr};
+import{Atom as e}from"@base-framework/base";import{Builder as x,dataBinder as i}from"@base-framework/base";var l=(t,o,s,r)=>!t||!r||r.isUnit!==!0||t.persist!==!0||!t.state?r:f(t,o,s,r),f=(t,o,s,r)=>{let a=o+":"+s,p=t.state,c=p.get(a);return typeof c<"u"&&(r=c),p.set(a,r),r},d=(t,o,s,r)=>{let a=null;return p=>{let c=t(p,o,r);if(typeof c>"u")return;a&&x.removeNode(a),c=l(r,s,p,c);let g=x.build(c,null,r);a=g.children[0],o.parentNode.insertBefore(g,o.nextSibling)}},u=t=>({tag:"comment",textContent:"on placeholder",onCreated:t.onCreated}),m=t=>t.data?t.data:t.context&&t.context.data?t.context.data:t.state?t.state:null,b=(...t)=>{let o=[...t],s=o.pop();if(typeof s=="function")return u({onCreated:(r,a)=>{if(o.length<2){let c=m(a);o.unshift(c)}let p=d(s,r,o[1],a);i.watch(r,o[0],o[1],p)}})},h=(...t)=>{let o=[...t],s=o.pop();if(typeof s=="function")return u({onCreated:(r,a)=>{if(o.length<2){let c=a.state;o.unshift(c)}let p=d(s,r,o[1],a);i.watch(r,o[0],o[1],p)}})};var n=(t,o)=>({...t,children:o}),C=t=>({...t,tag:"DOCTYPE"}),D=e((t,o)=>n({...t,tag:"html"},o)),H=e((t,o)=>n({...t,tag:"script"},o)),O=e((t,o)=>n({...t,tag:"style"},o)),P=e((t,o)=>n({...t,tag:"head"},o)),A=t=>({...t}),R=t=>({...t,tag:"meta"}),F=t=>({...t,tag:"link"}),L=e((t,o)=>n({...t,tag:"body"},o)),I=e((t,o)=>n(t,o)),M=e((t,o)=>n({...t,tag:"dialog"},o)),q=e((t,o)=>n({...t,tag:"span"},o)),w=e((t,o)=>n({...t,tag:"p"},o)),E=e((t,o)=>n({...t,tag:"a"},o)),y=e((t,o)=>n({...t,tag:"button"},o)),N=e((t,o)=>y({...t,type:"submit"},o)),U=e((t,o)=>n({...t,tag:"ul"},o)),V=e((t,o)=>n({...t,tag:"li"},o)),K=e(t=>n({...t,tag:"img"},null)),Q=e(t=>n({...t,tag:"br"},null)),W=e(t=>n({...t,tag:"hr"},null)),Y=e((t,o)=>n({...t,tag:"text"},o)),j=e((t,o)=>n({...t,tag:"h1"},o)),z=e((t,o)=>n({...t,tag:"h2"},o)),G=e((t,o)=>n({...t,tag:"h3"},o)),J=e((t,o)=>n({...t,tag:"h4"},o)),X=e((t,o)=>n({...t,tag:"h5"},o)),Z=e((t,o)=>n({...t,tag:"h6"},o)),S=e(t=>n({...t,tag:"input"},null)),_=e((t,o)=>n({...t,tag:"label"},o)),$=e(t=>S({...t,type:"checkbox"})),tt=e((t,o)=>n({...t,tag:"section"},o)),ot=e((t,o)=>n({...t,tag:"article"},o)),et=e((t,o)=>n({...t,tag:"header"},o)),nt=e((t,o)=>n({...t,tag:"footer"},o)),rt=e((t,o)=>n({...t,tag:"nav"},o)),at=e((t,o)=>n({...t,tag:"aside"},o)),st=e((t,o)=>n({...t,tag:"figure"},o)),ct=e((t,o)=>n({...t,tag:"figcaption"},o)),pt=e((t,o)=>n({...t,tag:"main"},o)),gt=e((t,o)=>n({...t,tag:"video"},o)),xt=e((t,o)=>n({...t,tag:"audio"},o)),it=e((t,o)=>n({...t,tag:"table"},o)),dt=e((t,o)=>n({...t,tag:"tr"},o)),ut=e((t,o)=>n({...t,tag:"th"},o)),lt=e((t,o)=>n({...t,tag:"td"},o)),ft=e((t,o)=>n({...t,tag:"thead"},o)),mt=e((t,o)=>n({...t,tag:"tbody"},o)),bt=e((t,o)=>n({...t,tag:"tfoot"},o)),ht=e((t,o)=>n({...t,tag:"form"},o)),yt=e((t,o)=>n({...t,tag:"select"},o)),St=e((t,o)=>n({...t,tag:"option"},o)),kt=e((t,o)=>n({...t,tag:"textarea"},o)),Bt=e((t,o)=>n({...t,tag:"canvas"},o)),Tt=e((t,o)=>n({...t,tag:"progress"},o)),vt=e((t,o)=>n({...t,tag:"blockquote"},o)),Ct=e((t,o)=>n({...t,tag:"pre"},o)),Dt=e((t,o)=>n({...t,tag:"code"},o)),Ht=e((t,o)=>n({...t,tag:"ol"},o)),Ot=e((t,o)=>n({...t,tag:"dl"},o)),Pt=e((t,o)=>n({...t,tag:"dt"},o)),At=e((t,o)=>n({...t,tag:"dd"},o)),Rt=e((t,o)=>n({...t,tag:"fieldset"},o)),Ft=e((t,o)=>n({...t,tag:"legend"},o)),Lt=e((t,o)=>n({...t,tag:"meter"},o)),It=e((t,o)=>n({...t,tag:"iframe"},o)),Mt=e((t,o)=>n({...t,tag:"details"},o)),qt=e((t,o)=>n({...t,tag:"summary"},o)),wt=e((t,o)=>n({...t,tag:"em"},o)),Et=e((t,o)=>n({...t,tag:"strong"},o)),Nt=e((t,o)=>n({...t,tag:"small"},o)),Ut=e((t,o)=>n({...t,tag:"s"},o)),Vt=e((t,o)=>n({...t,tag:"cite"},o)),Kt=e((t,o)=>n({...t,tag:"q"},o)),Qt=e((t,o)=>n({...t,tag:"dfn"},o)),Wt=e((t,o)=>n({...t,tag:"abbr"},o)),Yt=e((t,o)=>n({...t,tag:"data"},o)),jt=e((t,o)=>n({...t,tag:"time"},o)),zt=e((t,o)=>n({...t,tag:"var"},o)),Gt=e((t,o)=>n({...t,tag:"samp"},o)),Jt=e((t,o)=>n({...t,tag:"kbd"},o)),Xt=e((t,o)=>n({...t,tag:"sub"},o)),Zt=e((t,o)=>n({...t,tag:"sup"},o)),_t=e((t,o)=>n({...t,tag:"i"},o)),$t=e((t,o)=>n({...t,tag:"b"},o)),to=e((t,o)=>n({...t,tag:"u"},o)),oo=e((t,o)=>n({...t,tag:"mark"},o)),eo=e((t,o)=>n({...t,tag:"ruby"},o)),no=e((t,o)=>n({...t,tag:"rt"},o)),ro=e((t,o)=>n({...t,tag:"rp"},o)),ao=e((t,o)=>n({...t,tag:"bdi"},o)),so=e((t,o)=>n({...t,tag:"bdo"},o)),co=e(t=>n({...t,tag:"wbr"},null));export{E as A,Wt as Abbr,ot as Article,at as Aside,xt as Audio,$t as B,ao as Bdi,so as Bdo,vt as Blockquote,L as Body,Q as Br,y as Button,Bt as Canvas,$ as Checkbox,Vt as Cite,Dt as Code,Yt as Data,At as Dd,Mt as Details,Qt as Dfn,M as Dialog,I as Div,Ot as Dl,C as Doctype,Pt as Dt,wt as Em,Rt as Fieldset,ct as Figcaption,st as Figure,nt as Footer,ht as Form,j as H1,z as H2,G as H3,J as H4,X as H5,Z as H6,P as Head,et as Header,W as Hr,D as Html,_t as I,It as Iframe,K as Img,S as Input,Jt as Kbd,_ as Label,Ft as Legend,V as Li,F as Link,pt as Main,oo as Mark,R as Meta,Lt as Meter,rt as Nav,Ht as Ol,b as On,h as OnState,St as Option,w as P,Ct as Pre,Tt as Progress,Kt as Q,ro as Rp,no as Rt,eo as Ruby,Ut as S,Gt as Samp,H as Script,tt as Section,yt as Select,Nt as Small,q as Span,Et as Strong,O as Style,Xt as Sub,N as SubmitButton,qt as Summary,Zt as Sup,it as Table,mt as Tbody,lt as Td,Y as Text,kt as Textarea,bt as Tfoot,ut as Th,ft as Thead,jt as Time,A as Title,dt as Tr,to as U,U as Ul,zt as Var,gt as Video,co as Wbr};
 //# sourceMappingURL=atoms.js.map

package/dist/atoms.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/atoms.js", "../src/on/on.js"],
-  "sourcesContent": ["import { Atom } from '@base-framework/base';\r\nimport { On, OnState } from './on/on.js';\r\nexport { On, OnState };\r\n\r\n/**\r\n * Creates a generic HTML tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @param {array} children - Children elements of the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nconst Tag = (props, children) => {\r\n    return { ...props, children };\r\n};\r\n\r\n/**\r\n * Creates a Doctype tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nexport const Doctype = (props) => ({ ...props, tag: 'DOCTYPE' });\r\n\r\n/**\r\n * Creates an HTML tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @param {array} children - Children elements of the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nexport const Html = Atom((props, children) => Tag({ ...props, tag: 'html' }, children));\r\n\r\n/**\r\n * Creates a script tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @param {array} children - Children elements of the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nexport const Script = Atom((props, children) => Tag({ ...props, tag: 'script' }, children));\r\n\r\n/**\r\n * Creates a style tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @param {array} children - Children elements of the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nexport const Style = Atom((props, children) => Tag({ ...props, tag: 'style' }, children));\r\n\r\n/**\r\n * Creates a head tag.\r\n *\r\n * @param {object} props - Properties for the head element.\r\n * @param {array} children - Children elements of the head.\r\n * @returns {object} - Returns an object representing the head element.\r\n */\r\nexport const Head = Atom((props, children) => Tag({ ...props, tag: 'head' }, children));\r\n\r\n/**\r\n * Creates a title tag.\r\n *\r\n * @param {object} props - Properties for the title element.\r\n */\r\nexport const Title = (props) =>\r\n{\r\n    return { ...props };\r\n};\r\n\r\n/**\r\n * Creates a meta tag.\r\n *\r\n * @param {object} props - Properties for the meta element.\r\n * @returns {object} - Returns an object representing the meta element.\r\n */\r\nexport const Meta = (props) => ({ ...props, tag: 'meta' });\r\n\r\n/**\r\n * Creates a link tag.\r\n *\r\n * @param {object} props - Properties for the link element.\r\n * @returns {object} - Returns an object representing the link element.\r\n */\r\nexport const Link = (props) => ({ ...props, tag: 'link' });\r\n\r\n/**\r\n * Creates a body tag.\r\n *\r\n * @param {object} props - Properties for the body element.\r\n * @param {array} children - Children elements of the body.\r\n * @returns {object} - Returns an object representing the body element.\r\n */\r\nexport const Body = Atom((props, children) => Tag({ ...props, tag: 'body' }, children));\r\n\r\n/**\r\n * Creates a div element.\r\n *\r\n * @param {object} props - Properties for the div element.\r\n * @param {array} children - Children elements of the div.\r\n * @returns {object} - Returns an object representing the div element.\r\n */\r\nexport const Div = Atom((props, children) => Tag(props, children));\r\n\r\n/**\r\n * Creates a dialog element.\r\n *\r\n * @param {object} props - Properties for the div element.\r\n * @param {array} children - Children elements of the div.\r\n * @returns {object} - Returns an object representing the dialog element.\r\n */\r\nexport const Dialog = Atom((props, children) => Tag({ ...props, tag: 'dialog' }, children));\r\n\r\n/**\r\n * Creates a span element.\r\n *\r\n * @param {object} props - Properties for the span element.\r\n * @param {array} children - Children elements of the span.\r\n * @returns {object} - Returns an object representing the span element.\r\n */\r\nexport const Span = Atom((props, children) => Tag({ ...props, tag: 'span' }, children));\r\n\r\n/**\r\n * Creates a paragraph (p) element.\r\n *\r\n * @param {object} props - Properties for the paragraph element.\r\n * @param {array} children - Children elements of the paragraph.\r\n * @returns {object} - Returns an object representing the paragraph element.\r\n */\r\nexport const P = Atom((props, children) => Tag({ ...props, tag: 'p' }, children));\r\n\r\n/**\r\n * Creates an anchor (a) element.\r\n *\r\n * @param {object} props - Properties for the anchor element.\r\n * @param {array} children - Children elements of the anchor.\r\n * @return {object} - Returns an object representing the anchor element.\r\n */\r\nexport const A = Atom((props, children) => Tag({ ...props, tag: 'a' }, children));\r\n\r\n/**\r\n * Creates a button element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Button = Atom((props, children) => Tag({ ...props, tag: 'button' }, children));\r\n\r\n/**\r\n * Creates a submit button element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const SubmitButton = Atom((props, children) => Button({ ...props, type: 'submit' }, children));\r\n\r\n/**\r\n * Creates an unordered list (ul) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Ul = Atom((props, children) => Tag({ ...props, tag: 'ul' }, children));\r\n\r\n/**\r\n * Creates a list item (li) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Li = Atom((props, children) => Tag({ ...props, tag: 'li' }, children));\r\n\r\n/**\r\n * Creates an image (img) element.\r\n */\r\nexport const Img = Atom((props) => Tag({ ...props, tag: 'img' }, null));\r\n\r\n/**\r\n * Create a br element.\r\n *\r\n * @param {object} props - Properties for the br element.\r\n * @returns {object} - Returns an object representing the br element.\r\n */\r\nexport const Br = Atom((props) => Tag({ ...props, tag: 'br' }, null));\r\n\r\n/**\r\n * Creates a horizontal rule (hr) element.\r\n *\r\n * @param {object} props - Properties for the hr element.\r\n * @returns {object} - Returns an object representing the hr element.\r\n */\r\nexport const Hr = Atom((props) => Tag({ ...props, tag: 'hr' }, null));\r\n\r\n/**\r\n * Creates a text (text) element.\r\n *\r\n * @param {object} props - Properties for the text element.\r\n * @param {array} children - Children elements of the text element.\r\n * @returns {object} - Returns an object representing the text element.\r\n */\r\nexport const Text = Atom((props, children) => Tag({ ...props, tag: 'text' }, children));\r\n\r\n/**\r\n * Creates a header 1 (h1) element.\r\n *\r\n * @param {object} props - Properties for the h1 element.\r\n * @param {array} children - Children elements of the h1 element.\r\n * @returns {object} - Returns an object representing the h1 element.\r\n */\r\nexport const H1 = Atom((props, children) => Tag({ ...props, tag: 'h1' }, children));\r\n\r\n/**\r\n * Creates a header 2 (h2) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H2 = Atom((props, children) => Tag({ ...props, tag: 'h2' }, children));\r\n\r\n/**\r\n * Creates a header 3 (h3) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H3 = Atom((props, children) => Tag({ ...props, tag: 'h3' }, children));\r\n\r\n/**\r\n * Creates a header 4 (h4) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H4 = Atom((props, children) => Tag({ ...props, tag: 'h4' }, children));\r\n\r\n/**\r\n * Creates a header 5 (h5) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H5 = Atom((props, children) => Tag({ ...props, tag: 'h5' }, children));\r\n\r\n/**\r\n * Creates a header 6 (h6) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H6 = Atom((props, children) => Tag({ ...props, tag: 'h6' }, children));\r\n\r\n/**\r\n * Creates an input element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Input = Atom((props) => Tag({ ...props, tag: 'input' }, null));\r\n\r\n/**\r\n * Creates a label element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Label = Atom((props, children) => Tag({ ...props, tag: 'label' }, children));\r\n\r\n/**\r\n * Creates a checkbox input element.\r\n *\r\n * @param {object} props - Properties for the checkbox input element.\r\n * @returns {object} - Returns an object representing the checkbox input element.\r\n */\r\nexport const Checkbox = Atom((props) => Input({ ...props, type: 'checkbox' }));\r\n\r\n/**\r\n * Creates a section element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Section = Atom((props, children) => Tag({ ...props, tag: 'section' }, children));\r\n\r\n/**\r\n * Creates an article element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Article = Atom((props, children) => Tag({ ...props, tag: 'article' }, children));\r\n\r\n/**\r\n * Creates a header (header) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Header = Atom((props, children) => Tag({ ...props, tag: 'header' }, children));\r\n\r\n/**\r\n * Creates a footer element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Footer = Atom((props, children) => Tag({ ...props, tag: 'footer' }, children));\r\n\r\n/**\r\n * Creates a nav element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Nav = Atom((props, children) => Tag({ ...props, tag: 'nav' }, children));\r\n\r\n/**\r\n * Creates an aside element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Aside = Atom((props, children) => Tag({ ...props, tag: 'aside' }, children));\r\n\r\n/**\r\n * Creates a figure element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Figure = Atom((props, children) => Tag({ ...props, tag: 'figure' }, children));\r\n\r\n/**\r\n * Creates a figcaption element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Figcaption = Atom((props, children) => Tag({ ...props, tag: 'figcaption' }, children));\r\n\r\n/**\r\n * Creates a main element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Main = Atom((props, children) => Tag({ ...props, tag: 'main' }, children));\r\n\r\n/**\r\n * Creates a video element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Video = Atom((props, children) => Tag({ ...props, tag: 'video' }, children));\r\n\r\n/**\r\n * Creates an audio element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Audio = Atom((props, children) => Tag({ ...props, tag: 'audio' }, children));\r\n\r\n/**\r\n * Creates a table element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Table = Atom((props, children) => Tag({ ...props, tag: 'table' }, children));\r\n\r\n/**\r\n * Creates a table row (tr) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Tr = Atom((props, children) => Tag({ ...props, tag: 'tr' }, children));\r\n\r\n/**\r\n * Creates a table header (th) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Th = Atom((props, children) => Tag({ ...props, tag: 'th' }, children));\r\n\r\n/**\r\n * Creates a table data (td) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Td = Atom((props, children) => Tag({ ...props, tag: 'td' }, children));\r\n\r\n/**\r\n * Creates a table header group (thead) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Thead = Atom((props, children) => Tag({ ...props, tag: 'thead' }, children));\r\n\r\n/**\r\n * Creates a table body (tbody) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Tbody = Atom((props, children) => Tag({ ...props, tag: 'tbody' }, children));\r\n\r\n/**\r\n * Creates a table footer (tfoot) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Tfoot = Atom((props, children) => Tag({ ...props, tag: 'tfoot' }, children));\r\n\r\n/**\r\n * Creates a form element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Form = Atom((props, children) => Tag({ ...props, tag: 'form' }, children));\r\n\r\n/**\r\n * Creates a select element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Select = Atom((props, children) => Tag({ ...props, tag: 'select' }, children));\r\n\r\n/**\r\n * Creates an option element for a select tag.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Option = Atom((props, children) => Tag({ ...props, tag: 'option' }, children));\r\n\r\n/**\r\n * Creates a textarea element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Textarea = Atom((props, children) => Tag({ ...props, tag: 'textarea' }, children));\r\n\r\n/**\r\n * Creates a canvas element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Canvas = Atom((props, children) => Tag({ ...props, tag: 'canvas' }, children));\r\n\r\n/**\r\n * Creates a progress element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Progress = Atom((props, children) => Tag({ ...props, tag: 'progress' }, children));\r\n\r\n/**\r\n * Creates a blockquote element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Blockquote = Atom((props, children) => Tag({ ...props, tag: 'blockquote' }, children));\r\n\r\n/**\r\n * Creates a preformatted text (pre) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Pre = Atom((props, children) => Tag({ ...props, tag: 'pre' }, children));\r\n\r\n/**\r\n * Creates a code element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Code = Atom((props, children) => Tag({ ...props, tag: 'code' }, children));\r\n\r\n/**\r\n * Creates an ordered list (ol) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Ol = Atom((props, children) => Tag({ ...props, tag: 'ol' }, children));\r\n\r\n/**\r\n * Creates a definition list (dl) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Dl = Atom((props, children) => Tag({ ...props, tag: 'dl' }, children));\r\n\r\n/**\r\n * Creates a definition term (dt) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Dt = Atom((props, children) => Tag({ ...props, tag: 'dt' }, children));\r\n\r\n/**\r\n * Creates a definition description (dd) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Dd = Atom((props, children) => Tag({ ...props, tag: 'dd' }, children));\r\n\r\n/**\r\n * Creates a fieldset element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Fieldset = Atom((props, children) => Tag({ ...props, tag: 'fieldset' }, children));\r\n\r\n/**\r\n * Creates a legend element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Legend = Atom((props, children) => Tag({ ...props, tag: 'legend' }, children));\r\n\r\n/**\r\n * Creates a meter element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Meter = Atom((props, children) => Tag({ ...props, tag: 'meter' }, children));\r\n\r\n/**\r\n * Creates an iframe element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Iframe = Atom((props, children) => Tag({ ...props, tag: 'iframe' }, children));\r\n\r\n/**\r\n * Creates a details element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Details = Atom((props, children) => Tag({ ...props, tag: 'details' }, children));\r\n\r\n/**\r\n * Creates a summary element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Summary = Atom((props, children) => Tag({ ...props, tag: 'summary' }, children));\r\n\r\n/**\r\n * Creates an em element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Em = Atom((props, children) => Tag({ ...props, tag: 'em' }, children));\r\n\r\n/**\r\n * Creates a strong element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Strong = Atom((props, children) => Tag({ ...props, tag: 'strong' }, children));\r\n\r\n/**\r\n * Creates a small element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Small = Atom((props, children) => Tag({ ...props, tag: 'small' }, children));\r\n\r\n/**\r\n * Creates a s element (strikethrough).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const S = Atom((props, children) => Tag({ ...props, tag: 's' }, children));\r\n\r\n/**\r\n * Creates a cite element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Cite = Atom((props, children) => Tag({ ...props, tag: 'cite' }, children));\r\n\r\n/**\r\n * Creates a q element (inline quotation).\r\n */\r\nexport const Q = Atom((props, children) => Tag({ ...props, tag: 'q' }, children));\r\n\r\n/**\r\n * Creates a dfn element (definition element).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Dfn = Atom((props, children) => Tag({ ...props, tag: 'dfn' }, children));\r\n\r\n/**\r\n * Creates an abbr element (abbreviation).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Abbr = Atom((props, children) => Tag({ ...props, tag: 'abbr' }, children));\r\n\r\n/**\r\n * Creates a data element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Data = Atom((props, children) => Tag({ ...props, tag: 'data' }, children));\r\n\r\n/**\r\n * Creates a time element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Time = Atom((props, children) => Tag({ ...props, tag: 'time' }, children));\r\n\r\n/**\r\n * Creates a var element (variable).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Var = Atom((props, children) => Tag({ ...props, tag: 'var' }, children));\r\n\r\n/**\r\n * Creates a samp element (sample output).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Samp = Atom((props, children) => Tag({ ...props, tag: 'samp' }, children));\r\n\r\n/**\r\n * Creates a kbd element (keyboard input).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Kbd = Atom((props, children) => Tag({ ...props, tag: 'kbd' }, children));\r\n\r\n/**\r\n * Creates a sub element (subscript).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Sub = Atom((props, children) => Tag({ ...props, tag: 'sub' }, children));\r\n\r\n/**\r\n * Creates a sup element (superscript).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Sup = Atom((props, children) => Tag({ ...props, tag: 'sup' }, children));\r\n\r\n/**\r\n * Creates an i element (italic).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const I = Atom((props, children) => Tag({ ...props, tag: 'i' }, children));\r\n\r\n/**\r\n * Creates a b element (bold).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const B = Atom((props, children) => Tag({ ...props, tag: 'b' }, children));\r\n\r\n/**\r\n * Creates a u element (underline).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const U = Atom((props, children) => Tag({ ...props, tag: 'u' }, children));\r\n\r\n/**\r\n * Creates a mark element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Mark = Atom((props, children) => Tag({ ...props, tag: 'mark' }, children));\r\n\r\n/**\r\n * Creates a ruby element (for East Asian typography).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Ruby = Atom((props, children) => Tag({ ...props, tag: 'ruby' }, children));\r\n\r\n/**\r\n * Creates an rt element (explanation/pronunciation of characters in East Asian typography).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Rt = Atom((props, children) => Tag({ ...props, tag: 'rt' }, children));\r\n\r\n/**\r\n * Creates an rp element (for East Asian fallback parenthesis).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Rp = Atom((props, children) => Tag({ ...props, tag: 'rp' }, children));\r\n\r\n/**\r\n * Creates a bdi element (Bi-Directional Isolation).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Bdi = Atom((props, children) => Tag({ ...props, tag: 'bdi' }, children));\r\n\r\n/**\r\n * Creates a bdo element (Bi-Directional Override).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Bdo = Atom((props, children) => Tag({ ...props, tag: 'bdo' }, children));\r\n\r\n/**\r\n * Creates a wbr element (Word Break Opportunity).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Wbr = Atom((props) => Tag({ ...props, tag: 'wbr' }, null));", "import { Builder, dataBinder } from \"@base-framework/base\";\r\n\r\n/**\r\n * This will set a previous result.\r\n *\r\n * @private\r\n * @param {object} parent\r\n * @param {string} prop\r\n * @param {string} value\r\n * @param {object} result\r\n * @returns {*}\r\n */\r\nconst checkPreviousResult = (parent, prop, value, result) =>\r\n{\r\n    if (!parent || !result)\r\n    {\r\n        return result;\r\n    }\r\n\r\n    if (result.isUnit !== true || parent.persist !== true || !parent.state)\r\n    {\r\n        return result;\r\n    }\r\n\r\n    return setPreviousResult(parent, prop, value, result);\r\n};\r\n\r\n/**\r\n * This will set the previous result.\r\n *\r\n * @param {object} parent\r\n * @param {string} prop\r\n * @param {string} value\r\n * @param {object} result\r\n * @returns {*}\r\n */\r\nconst setPreviousResult = (parent, prop, value, result) =>\r\n{\r\n    let key = prop + ':' + value,\r\n    state = parent.state,\r\n    previousResult = state.get(key);\r\n    if (typeof previousResult !== 'undefined')\r\n    {\r\n        result = previousResult;\r\n    }\r\n\r\n    state.set(key, result);\r\n    return result;\r\n};\r\n\r\n/**\r\n * This will set up the update layout function.\r\n *\r\n * @param {function} callBack\r\n * @param {object} ele\r\n * @param {string} prop\r\n * @param {object} parent\r\n * @returns {function}\r\n */\r\nconst updateLayout = (callBack, ele, prop, parent) =>\r\n{\r\n    /**\r\n     * This will hold the previous child element to\r\n     * help remove it when updating.\r\n     *\r\n     * @type {(object|null)} prevEle\r\n     */\r\n    let prevEle = null;\r\n\r\n    /**\r\n     * This will update the layout.\r\n     *\r\n     * @param {object} value\r\n     * @returns {void}\r\n     */\r\n    return (value) =>\r\n    {\r\n        let layout = callBack(value, ele, parent);\r\n        if (!layout)\r\n        {\r\n            return;\r\n        }\r\n\r\n        /**\r\n         * This will remove the previous element if it exists.\r\n         */\r\n        if (prevEle)\r\n        {\r\n            Builder.removeNode(prevEle);\r\n        }\r\n\r\n        /**\r\n         * This will set the previous result if needed.\r\n         */\r\n        layout = checkPreviousResult(parent, prop, value, layout);\r\n\r\n        /**\r\n         * This will build the layout and insert it after the\r\n         * comment element.\r\n         */\r\n        const frag = Builder.build(layout, null, parent);\r\n        prevEle = frag.children[0];\r\n\r\n        ele.parentNode.insertBefore(frag, ele.nextSibling);\r\n    };\r\n};\r\n\r\n/**\r\n * This will create a comment.\r\n *\r\n * @param {object} props\r\n * @returns {object}\r\n */\r\nconst Comment = (props) => ({\r\n    tag: 'comment',\r\n    textContent: 'on placeholder',\r\n    onCreated: props.onCreated\r\n});\r\n\r\n/**\r\n * This will get the parent set data.\r\n *\r\n * @param {object} parent\r\n * @returns {object|null}\r\n */\r\nexport const getParentData = (parent) =>\r\n{\r\n    if (parent.data)\r\n    {\r\n        return parent.data;\r\n    }\r\n\r\n    if (parent.context && parent.context.data)\r\n    {\r\n        return parent.context.data;\r\n    }\r\n\r\n    if (parent.state)\r\n    {\r\n        return parent.state;\r\n    }\r\n\r\n    return null;\r\n};\r\n\r\n/**\r\n * This will create an on data tag.\r\n *\r\n * @overload\r\n * @param {object} data\r\n * @param {string} prop\r\n * @param {function} callBack\r\n *\r\n * @overload\r\n * @param {string} prop\r\n * @param {function} callBack\r\n *\r\n * @returns {object}\r\n */\r\nexport const On = (...args) =>\r\n{\r\n    const settings = [...args];\r\n    const callBack = settings.pop();\r\n    if (typeof callBack !== 'function')\r\n    {\r\n        return;\r\n    }\r\n\r\n    /**\r\n     * This will create a comment to use as a placeholder\r\n     * to keep the layout in place.\r\n     */\r\n    return Comment({\r\n        onCreated: (ele, parent) =>\r\n        {\r\n            if (settings.length < 2)\r\n            {\r\n                /**\r\n                 * This will get the parent data and add it to the\r\n                 * settings array.\r\n                 */\r\n                const data = getParentData(parent);\r\n                settings.unshift(data);\r\n            }\r\n\r\n            const update = updateLayout(callBack, ele, settings[1], parent);\r\n            dataBinder.watch(ele, settings[0], settings[1], update);\r\n        }\r\n    });\r\n};\r\n\r\n/**\r\n * This will create an on state tag.\r\n *\r\n * @overload\r\n * @param {object} data\r\n * @param {string} prop\r\n * @param {function} callBack\r\n *\r\n * @overload\r\n * @param {string} prop\r\n * @param {function} callBack\r\n *\r\n * @returns {object}\r\n */\r\nexport const OnState = (...args) =>\r\n{\r\n    const settings = [...args];\r\n    const callBack = settings.pop();\r\n    if (typeof callBack !== 'function')\r\n    {\r\n        return;\r\n    }\r\n\r\n    /**\r\n     * This will create a comment to use as a placeholder\r\n     * to keep the layout in place.\r\n     */\r\n    return Comment({\r\n        onCreated: (ele, parent) =>\r\n        {\r\n            if (settings.length < 2)\r\n            {\r\n                const data = parent.state;\r\n                settings.unshift(data);\r\n            }\r\n\r\n            const update = updateLayout(callBack, ele, settings[1], parent);\r\n            dataBinder.watch(ele, settings[0], settings[1], update);\r\n        }\r\n    });\r\n};"],
-  "mappings": "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",
+  "sourcesContent": ["import { Atom } from '@base-framework/base';\r\nimport { On, OnState } from './on/on.js';\r\nexport { On, OnState };\r\n\r\n/**\r\n * Creates a generic HTML tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @param {array} children - Children elements of the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nconst Tag = (props, children) => {\r\n    return { ...props, children };\r\n};\r\n\r\n/**\r\n * Creates a Doctype tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nexport const Doctype = (props) => ({ ...props, tag: 'DOCTYPE' });\r\n\r\n/**\r\n * Creates an HTML tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @param {array} children - Children elements of the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nexport const Html = Atom((props, children) => Tag({ ...props, tag: 'html' }, children));\r\n\r\n/**\r\n * Creates a script tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @param {array} children - Children elements of the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nexport const Script = Atom((props, children) => Tag({ ...props, tag: 'script' }, children));\r\n\r\n/**\r\n * Creates a style tag.\r\n *\r\n * @param {object} props - Properties for the HTML element.\r\n * @param {array} children - Children elements of the HTML element.\r\n * @returns {object} - Returns an object representing the HTML element.\r\n */\r\nexport const Style = Atom((props, children) => Tag({ ...props, tag: 'style' }, children));\r\n\r\n/**\r\n * Creates a head tag.\r\n *\r\n * @param {object} props - Properties for the head element.\r\n * @param {array} children - Children elements of the head.\r\n * @returns {object} - Returns an object representing the head element.\r\n */\r\nexport const Head = Atom((props, children) => Tag({ ...props, tag: 'head' }, children));\r\n\r\n/**\r\n * Creates a title tag.\r\n *\r\n * @param {object} props - Properties for the title element.\r\n */\r\nexport const Title = (props) =>\r\n{\r\n    return { ...props };\r\n};\r\n\r\n/**\r\n * Creates a meta tag.\r\n *\r\n * @param {object} props - Properties for the meta element.\r\n * @returns {object} - Returns an object representing the meta element.\r\n */\r\nexport const Meta = (props) => ({ ...props, tag: 'meta' });\r\n\r\n/**\r\n * Creates a link tag.\r\n *\r\n * @param {object} props - Properties for the link element.\r\n * @returns {object} - Returns an object representing the link element.\r\n */\r\nexport const Link = (props) => ({ ...props, tag: 'link' });\r\n\r\n/**\r\n * Creates a body tag.\r\n *\r\n * @param {object} props - Properties for the body element.\r\n * @param {array} children - Children elements of the body.\r\n * @returns {object} - Returns an object representing the body element.\r\n */\r\nexport const Body = Atom((props, children) => Tag({ ...props, tag: 'body' }, children));\r\n\r\n/**\r\n * Creates a div element.\r\n *\r\n * @param {object} props - Properties for the div element.\r\n * @param {array} children - Children elements of the div.\r\n * @returns {object} - Returns an object representing the div element.\r\n */\r\nexport const Div = Atom((props, children) => Tag(props, children));\r\n\r\n/**\r\n * Creates a dialog element.\r\n *\r\n * @param {object} props - Properties for the div element.\r\n * @param {array} children - Children elements of the div.\r\n * @returns {object} - Returns an object representing the dialog element.\r\n */\r\nexport const Dialog = Atom((props, children) => Tag({ ...props, tag: 'dialog' }, children));\r\n\r\n/**\r\n * Creates a span element.\r\n *\r\n * @param {object} props - Properties for the span element.\r\n * @param {array} children - Children elements of the span.\r\n * @returns {object} - Returns an object representing the span element.\r\n */\r\nexport const Span = Atom((props, children) => Tag({ ...props, tag: 'span' }, children));\r\n\r\n/**\r\n * Creates a paragraph (p) element.\r\n *\r\n * @param {object} props - Properties for the paragraph element.\r\n * @param {array} children - Children elements of the paragraph.\r\n * @returns {object} - Returns an object representing the paragraph element.\r\n */\r\nexport const P = Atom((props, children) => Tag({ ...props, tag: 'p' }, children));\r\n\r\n/**\r\n * Creates an anchor (a) element.\r\n *\r\n * @param {object} props - Properties for the anchor element.\r\n * @param {array} children - Children elements of the anchor.\r\n * @return {object} - Returns an object representing the anchor element.\r\n */\r\nexport const A = Atom((props, children) => Tag({ ...props, tag: 'a' }, children));\r\n\r\n/**\r\n * Creates a button element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Button = Atom((props, children) => Tag({ ...props, tag: 'button' }, children));\r\n\r\n/**\r\n * Creates a submit button element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const SubmitButton = Atom((props, children) => Button({ ...props, type: 'submit' }, children));\r\n\r\n/**\r\n * Creates an unordered list (ul) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Ul = Atom((props, children) => Tag({ ...props, tag: 'ul' }, children));\r\n\r\n/**\r\n * Creates a list item (li) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Li = Atom((props, children) => Tag({ ...props, tag: 'li' }, children));\r\n\r\n/**\r\n * Creates an image (img) element.\r\n */\r\nexport const Img = Atom((props) => Tag({ ...props, tag: 'img' }, null));\r\n\r\n/**\r\n * Create a br element.\r\n *\r\n * @param {object} props - Properties for the br element.\r\n * @returns {object} - Returns an object representing the br element.\r\n */\r\nexport const Br = Atom((props) => Tag({ ...props, tag: 'br' }, null));\r\n\r\n/**\r\n * Creates a horizontal rule (hr) element.\r\n *\r\n * @param {object} props - Properties for the hr element.\r\n * @returns {object} - Returns an object representing the hr element.\r\n */\r\nexport const Hr = Atom((props) => Tag({ ...props, tag: 'hr' }, null));\r\n\r\n/**\r\n * Creates a text (text) element.\r\n *\r\n * @param {object} props - Properties for the text element.\r\n * @param {array} children - Children elements of the text element.\r\n * @returns {object} - Returns an object representing the text element.\r\n */\r\nexport const Text = Atom((props, children) => Tag({ ...props, tag: 'text' }, children));\r\n\r\n/**\r\n * Creates a header 1 (h1) element.\r\n *\r\n * @param {object} props - Properties for the h1 element.\r\n * @param {array} children - Children elements of the h1 element.\r\n * @returns {object} - Returns an object representing the h1 element.\r\n */\r\nexport const H1 = Atom((props, children) => Tag({ ...props, tag: 'h1' }, children));\r\n\r\n/**\r\n * Creates a header 2 (h2) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H2 = Atom((props, children) => Tag({ ...props, tag: 'h2' }, children));\r\n\r\n/**\r\n * Creates a header 3 (h3) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H3 = Atom((props, children) => Tag({ ...props, tag: 'h3' }, children));\r\n\r\n/**\r\n * Creates a header 4 (h4) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H4 = Atom((props, children) => Tag({ ...props, tag: 'h4' }, children));\r\n\r\n/**\r\n * Creates a header 5 (h5) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H5 = Atom((props, children) => Tag({ ...props, tag: 'h5' }, children));\r\n\r\n/**\r\n * Creates a header 6 (h6) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const H6 = Atom((props, children) => Tag({ ...props, tag: 'h6' }, children));\r\n\r\n/**\r\n * Creates an input element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Input = Atom((props) => Tag({ ...props, tag: 'input' }, null));\r\n\r\n/**\r\n * Creates a label element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Label = Atom((props, children) => Tag({ ...props, tag: 'label' }, children));\r\n\r\n/**\r\n * Creates a checkbox input element.\r\n *\r\n * @param {object} props - Properties for the checkbox input element.\r\n * @returns {object} - Returns an object representing the checkbox input element.\r\n */\r\nexport const Checkbox = Atom((props) => Input({ ...props, type: 'checkbox' }));\r\n\r\n/**\r\n * Creates a section element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Section = Atom((props, children) => Tag({ ...props, tag: 'section' }, children));\r\n\r\n/**\r\n * Creates an article element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Article = Atom((props, children) => Tag({ ...props, tag: 'article' }, children));\r\n\r\n/**\r\n * Creates a header (header) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Header = Atom((props, children) => Tag({ ...props, tag: 'header' }, children));\r\n\r\n/**\r\n * Creates a footer element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Footer = Atom((props, children) => Tag({ ...props, tag: 'footer' }, children));\r\n\r\n/**\r\n * Creates a nav element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Nav = Atom((props, children) => Tag({ ...props, tag: 'nav' }, children));\r\n\r\n/**\r\n * Creates an aside element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Aside = Atom((props, children) => Tag({ ...props, tag: 'aside' }, children));\r\n\r\n/**\r\n * Creates a figure element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Figure = Atom((props, children) => Tag({ ...props, tag: 'figure' }, children));\r\n\r\n/**\r\n * Creates a figcaption element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Figcaption = Atom((props, children) => Tag({ ...props, tag: 'figcaption' }, children));\r\n\r\n/**\r\n * Creates a main element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Main = Atom((props, children) => Tag({ ...props, tag: 'main' }, children));\r\n\r\n/**\r\n * Creates a video element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Video = Atom((props, children) => Tag({ ...props, tag: 'video' }, children));\r\n\r\n/**\r\n * Creates an audio element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Audio = Atom((props, children) => Tag({ ...props, tag: 'audio' }, children));\r\n\r\n/**\r\n * Creates a table element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Table = Atom((props, children) => Tag({ ...props, tag: 'table' }, children));\r\n\r\n/**\r\n * Creates a table row (tr) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Tr = Atom((props, children) => Tag({ ...props, tag: 'tr' }, children));\r\n\r\n/**\r\n * Creates a table header (th) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Th = Atom((props, children) => Tag({ ...props, tag: 'th' }, children));\r\n\r\n/**\r\n * Creates a table data (td) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Td = Atom((props, children) => Tag({ ...props, tag: 'td' }, children));\r\n\r\n/**\r\n * Creates a table header group (thead) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Thead = Atom((props, children) => Tag({ ...props, tag: 'thead' }, children));\r\n\r\n/**\r\n * Creates a table body (tbody) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Tbody = Atom((props, children) => Tag({ ...props, tag: 'tbody' }, children));\r\n\r\n/**\r\n * Creates a table footer (tfoot) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Tfoot = Atom((props, children) => Tag({ ...props, tag: 'tfoot' }, children));\r\n\r\n/**\r\n * Creates a form element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Form = Atom((props, children) => Tag({ ...props, tag: 'form' }, children));\r\n\r\n/**\r\n * Creates a select element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Select = Atom((props, children) => Tag({ ...props, tag: 'select' }, children));\r\n\r\n/**\r\n * Creates an option element for a select tag.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Option = Atom((props, children) => Tag({ ...props, tag: 'option' }, children));\r\n\r\n/**\r\n * Creates a textarea element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Textarea = Atom((props, children) => Tag({ ...props, tag: 'textarea' }, children));\r\n\r\n/**\r\n * Creates a canvas element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Canvas = Atom((props, children) => Tag({ ...props, tag: 'canvas' }, children));\r\n\r\n/**\r\n * Creates a progress element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Progress = Atom((props, children) => Tag({ ...props, tag: 'progress' }, children));\r\n\r\n/**\r\n * Creates a blockquote element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Blockquote = Atom((props, children) => Tag({ ...props, tag: 'blockquote' }, children));\r\n\r\n/**\r\n * Creates a preformatted text (pre) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Pre = Atom((props, children) => Tag({ ...props, tag: 'pre' }, children));\r\n\r\n/**\r\n * Creates a code element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Code = Atom((props, children) => Tag({ ...props, tag: 'code' }, children));\r\n\r\n/**\r\n * Creates an ordered list (ol) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Ol = Atom((props, children) => Tag({ ...props, tag: 'ol' }, children));\r\n\r\n/**\r\n * Creates a definition list (dl) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Dl = Atom((props, children) => Tag({ ...props, tag: 'dl' }, children));\r\n\r\n/**\r\n * Creates a definition term (dt) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Dt = Atom((props, children) => Tag({ ...props, tag: 'dt' }, children));\r\n\r\n/**\r\n * Creates a definition description (dd) element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Dd = Atom((props, children) => Tag({ ...props, tag: 'dd' }, children));\r\n\r\n/**\r\n * Creates a fieldset element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Fieldset = Atom((props, children) => Tag({ ...props, tag: 'fieldset' }, children));\r\n\r\n/**\r\n * Creates a legend element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Legend = Atom((props, children) => Tag({ ...props, tag: 'legend' }, children));\r\n\r\n/**\r\n * Creates a meter element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Meter = Atom((props, children) => Tag({ ...props, tag: 'meter' }, children));\r\n\r\n/**\r\n * Creates an iframe element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Iframe = Atom((props, children) => Tag({ ...props, tag: 'iframe' }, children));\r\n\r\n/**\r\n * Creates a details element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Details = Atom((props, children) => Tag({ ...props, tag: 'details' }, children));\r\n\r\n/**\r\n * Creates a summary element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Summary = Atom((props, children) => Tag({ ...props, tag: 'summary' }, children));\r\n\r\n/**\r\n * Creates an em element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Em = Atom((props, children) => Tag({ ...props, tag: 'em' }, children));\r\n\r\n/**\r\n * Creates a strong element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Strong = Atom((props, children) => Tag({ ...props, tag: 'strong' }, children));\r\n\r\n/**\r\n * Creates a small element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Small = Atom((props, children) => Tag({ ...props, tag: 'small' }, children));\r\n\r\n/**\r\n * Creates a s element (strikethrough).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const S = Atom((props, children) => Tag({ ...props, tag: 's' }, children));\r\n\r\n/**\r\n * Creates a cite element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Cite = Atom((props, children) => Tag({ ...props, tag: 'cite' }, children));\r\n\r\n/**\r\n * Creates a q element (inline quotation).\r\n */\r\nexport const Q = Atom((props, children) => Tag({ ...props, tag: 'q' }, children));\r\n\r\n/**\r\n * Creates a dfn element (definition element).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Dfn = Atom((props, children) => Tag({ ...props, tag: 'dfn' }, children));\r\n\r\n/**\r\n * Creates an abbr element (abbreviation).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Abbr = Atom((props, children) => Tag({ ...props, tag: 'abbr' }, children));\r\n\r\n/**\r\n * Creates a data element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Data = Atom((props, children) => Tag({ ...props, tag: 'data' }, children));\r\n\r\n/**\r\n * Creates a time element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Time = Atom((props, children) => Tag({ ...props, tag: 'time' }, children));\r\n\r\n/**\r\n * Creates a var element (variable).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Var = Atom((props, children) => Tag({ ...props, tag: 'var' }, children));\r\n\r\n/**\r\n * Creates a samp element (sample output).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Samp = Atom((props, children) => Tag({ ...props, tag: 'samp' }, children));\r\n\r\n/**\r\n * Creates a kbd element (keyboard input).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Kbd = Atom((props, children) => Tag({ ...props, tag: 'kbd' }, children));\r\n\r\n/**\r\n * Creates a sub element (subscript).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Sub = Atom((props, children) => Tag({ ...props, tag: 'sub' }, children));\r\n\r\n/**\r\n * Creates a sup element (superscript).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Sup = Atom((props, children) => Tag({ ...props, tag: 'sup' }, children));\r\n\r\n/**\r\n * Creates an i element (italic).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const I = Atom((props, children) => Tag({ ...props, tag: 'i' }, children));\r\n\r\n/**\r\n * Creates a b element (bold).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const B = Atom((props, children) => Tag({ ...props, tag: 'b' }, children));\r\n\r\n/**\r\n * Creates a u element (underline).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const U = Atom((props, children) => Tag({ ...props, tag: 'u' }, children));\r\n\r\n/**\r\n * Creates a mark element.\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Mark = Atom((props, children) => Tag({ ...props, tag: 'mark' }, children));\r\n\r\n/**\r\n * Creates a ruby element (for East Asian typography).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Ruby = Atom((props, children) => Tag({ ...props, tag: 'ruby' }, children));\r\n\r\n/**\r\n * Creates an rt element (explanation/pronunciation of characters in East Asian typography).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Rt = Atom((props, children) => Tag({ ...props, tag: 'rt' }, children));\r\n\r\n/**\r\n * Creates an rp element (for East Asian fallback parenthesis).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Rp = Atom((props, children) => Tag({ ...props, tag: 'rp' }, children));\r\n\r\n/**\r\n * Creates a bdi element (Bi-Directional Isolation).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Bdi = Atom((props, children) => Tag({ ...props, tag: 'bdi' }, children));\r\n\r\n/**\r\n * Creates a bdo element (Bi-Directional Override).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Bdo = Atom((props, children) => Tag({ ...props, tag: 'bdo' }, children));\r\n\r\n/**\r\n * Creates a wbr element (Word Break Opportunity).\r\n *\r\n * @param {object} props - Properties for the element.\r\n * @param {array} children - Children elements.\r\n * @returns {object} - Returns an object representing the element.\r\n */\r\nexport const Wbr = Atom((props) => Tag({ ...props, tag: 'wbr' }, null));", "import { Builder, dataBinder } from \"@base-framework/base\";\r\n\r\n/**\r\n * This will set a previous result.\r\n *\r\n * @private\r\n * @param {object} parent\r\n * @param {string} prop\r\n * @param {string} value\r\n * @param {object} result\r\n * @returns {*}\r\n */\r\nconst checkPreviousResult = (parent, prop, value, result) =>\r\n{\r\n    if (!parent || !result)\r\n    {\r\n        return result;\r\n    }\r\n\r\n    if (result.isUnit !== true || parent.persist !== true || !parent.state)\r\n    {\r\n        return result;\r\n    }\r\n\r\n    return setPreviousResult(parent, prop, value, result);\r\n};\r\n\r\n/**\r\n * This will set the previous result.\r\n *\r\n * @param {object} parent\r\n * @param {string} prop\r\n * @param {string} value\r\n * @param {object} result\r\n * @returns {*}\r\n */\r\nconst setPreviousResult = (parent, prop, value, result) =>\r\n{\r\n    let key = prop + ':' + value,\r\n    state = parent.state,\r\n    previousResult = state.get(key);\r\n    if (typeof previousResult !== 'undefined')\r\n    {\r\n        result = previousResult;\r\n    }\r\n\r\n    state.set(key, result);\r\n    return result;\r\n};\r\n\r\n/**\r\n * This will set up the update layout function.\r\n *\r\n * @param {function} callBack\r\n * @param {object} ele\r\n * @param {string} prop\r\n * @param {object} parent\r\n * @returns {function}\r\n */\r\nconst updateLayout = (callBack, ele, prop, parent) =>\r\n{\r\n    /**\r\n     * This will hold the previous child element to\r\n     * help remove it when updating.\r\n     *\r\n     * @type {(object|null)} prevEle\r\n     */\r\n    let prevEle = null;\r\n\r\n    /**\r\n     * This will update the layout.\r\n     *\r\n     * @param {object} value\r\n     * @returns {void}\r\n     */\r\n    return (value) =>\r\n    {\r\n        let layout = callBack(value, ele, parent);\r\n        if (typeof layout === \"undefined\")\r\n        {\r\n            return;\r\n        }\r\n\r\n        /**\r\n         * This will remove the previous element if it exists.\r\n         */\r\n        if (prevEle)\r\n        {\r\n            Builder.removeNode(prevEle);\r\n        }\r\n\r\n        /**\r\n         * This will set the previous result if needed.\r\n         */\r\n        layout = checkPreviousResult(parent, prop, value, layout);\r\n\r\n        /**\r\n         * This will build the layout and insert it after the\r\n         * comment element.\r\n         */\r\n        const frag = Builder.build(layout, null, parent);\r\n        prevEle = frag.children[0];\r\n\r\n        ele.parentNode.insertBefore(frag, ele.nextSibling);\r\n    };\r\n};\r\n\r\n/**\r\n * This will create a comment.\r\n *\r\n * @param {object} props\r\n * @returns {object}\r\n */\r\nconst Comment = (props) => ({\r\n    tag: 'comment',\r\n    textContent: 'on placeholder',\r\n    onCreated: props.onCreated\r\n});\r\n\r\n/**\r\n * This will get the parent set data.\r\n *\r\n * @param {object} parent\r\n * @returns {object|null}\r\n */\r\nexport const getParentData = (parent) =>\r\n{\r\n    if (parent.data)\r\n    {\r\n        return parent.data;\r\n    }\r\n\r\n    if (parent.context && parent.context.data)\r\n    {\r\n        return parent.context.data;\r\n    }\r\n\r\n    if (parent.state)\r\n    {\r\n        return parent.state;\r\n    }\r\n\r\n    return null;\r\n};\r\n\r\n/**\r\n * This will create an on data tag.\r\n *\r\n * @overload\r\n * @param {object} data\r\n * @param {string} prop\r\n * @param {function} callBack\r\n *\r\n * @overload\r\n * @param {string} prop\r\n * @param {function} callBack\r\n *\r\n * @returns {object}\r\n */\r\nexport const On = (...args) =>\r\n{\r\n    const settings = [...args];\r\n    const callBack = settings.pop();\r\n    if (typeof callBack !== 'function')\r\n    {\r\n        return;\r\n    }\r\n\r\n    /**\r\n     * This will create a comment to use as a placeholder\r\n     * to keep the layout in place.\r\n     */\r\n    return Comment({\r\n        onCreated: (ele, parent) =>\r\n        {\r\n            if (settings.length < 2)\r\n            {\r\n                /**\r\n                 * This will get the parent data and add it to the\r\n                 * settings array.\r\n                 */\r\n                const data = getParentData(parent);\r\n                settings.unshift(data);\r\n            }\r\n\r\n            const update = updateLayout(callBack, ele, settings[1], parent);\r\n            dataBinder.watch(ele, settings[0], settings[1], update);\r\n        }\r\n    });\r\n};\r\n\r\n/**\r\n * This will create an on state tag.\r\n *\r\n * @overload\r\n * @param {object} data\r\n * @param {string} prop\r\n * @param {function} callBack\r\n *\r\n * @overload\r\n * @param {string} prop\r\n * @param {function} callBack\r\n *\r\n * @returns {object}\r\n */\r\nexport const OnState = (...args) =>\r\n{\r\n    const settings = [...args];\r\n    const callBack = settings.pop();\r\n    if (typeof callBack !== 'function')\r\n    {\r\n        return;\r\n    }\r\n\r\n    /**\r\n     * This will create a comment to use as a placeholder\r\n     * to keep the layout in place.\r\n     */\r\n    return Comment({\r\n        onCreated: (ele, parent) =>\r\n        {\r\n            if (settings.length < 2)\r\n            {\r\n                const data = parent.state;\r\n                settings.unshift(data);\r\n            }\r\n\r\n            const update = updateLayout(callBack, ele, settings[1], parent);\r\n            dataBinder.watch(ele, settings[0], settings[1], update);\r\n        }\r\n    });\r\n};"],
+  "mappings": "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",
   "names": ["Atom", "Builder", "dataBinder", "checkPreviousResult", "parent", "prop", "value", "result", "setPreviousResult", "key", "state", "previousResult", "updateLayout", "callBack", "ele", "prevEle", "layout", "frag", "Comment", "props", "getParentData", "On", "args", "settings", "data", "update", "OnState", "Tag", "props", "children", "Doctype", "Html", "Atom", "Script", "Style", "Head", "Title", "Meta", "Link", "Body", "Div", "Dialog", "Span", "P", "A", "Button", "SubmitButton", "Ul", "Li", "Img", "Br", "Hr", "Text", "H1", "H2", "H3", "H4", "H5", "H6", "Input", "Label", "Checkbox", "Section", "Article", "Header", "Footer", "Nav", "Aside", "Figure", "Figcaption", "Main", "Video", "Audio", "Table", "Tr", "Th", "Td", "Thead", "Tbody", "Tfoot", "Form", "Select", "Option", "Textarea", "Canvas", "Progress", "Blockquote", "Pre", "Code", "Ol", "Dl", "Dt", "Dd", "Fieldset", "Legend", "Meter", "Iframe", "Details", "Summary", "Em", "Strong", "Small", "S", "Cite", "Q", "Dfn", "Abbr", "Data", "Time", "Var", "Samp", "Kbd", "Sub", "Sup", "I", "B", "U", "Mark", "Ruby", "Rt", "Rp", "Bdi", "Bdo", "Wbr"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@base-framework/atoms",
-	"version": "1.0.22",
+	"version": "1.0.24",
 	"description": "This will add default atoms to the base framework.",
 	"main": "./dist/atoms.js",
 	"scripts": {