https://creaditor.ai/component---src-templates-doc-tsx-content-fil…r-11-demo-pages-mdx-12e0359d0473d9f0113a.js

1"use strict";(self.webpackChunkofficial=self.webpackChunkofficial||[]).push([[9938],{1276:function(e,t,n){n.r(t),n.d(t,{Head:function(){return N},default:function(){return b}});var a=n(1151),l=n(7294);function r(e){const t=Object.assign({p:"p",strong:"strong",table:"table",thead:"thead",tr:"tr",th:"th",tbody:"tbody",td:"td",code:"code",a:"a"},(0,a.ah)(),e.components);return l.createElement(l.Fragment,null,l.createElement(t.p,null,"Four of them, and the first is the odd one out: it loads the ",l.createElement(t.strong,null,"published bundle")," rather than the source, so it opens by hand with no dev server, which makes it the one to hand someone."),"\n",l.createElement(t.table,null,l.createElement(t.thead,null,l.createElement(t.tr,null,l.createElement(t.th,null,"Page"),l.createElement(t.th,null,"How to open"),l.createElement(t.th,null,"What it shows"))),l.createElement(t.tbody,null,l.createElement(t.tr,null,l.createElement(t.td,null,l.createElement(t.code,null,"demo.html")),l.createElement(t.td,null,"open the file directly"),l.createElement(t.td,null,"The editor beside a live monitor of every event it fires, with the payloads. Loads ",l.createElement(t.code,null,"./dist-cdn/creaditor-form-builder.js")," if the checkout has been through ",l.createElement(t.code,null,"npm run build:cdn"),", and falls back to unpkg.")),l.createElement(t.tr,null,l.createElement(t.td,null,l.createElement(t.code,null,"/")),l.createElement(t.td,null,l.createElement(t.code,null,"npm run dev")),l.createElement(t.td,null,"The editor as a host would mount it: custom fields, field rules, mailing lists, image search, all wired in ",l.createElement(t.code,null,"src/builder/main.tsx"),".")),l.createElement(t.tr,null,l.createElement(t.td,null,l.createElement(t.code,null,"/renderer-demo.html")),l.createElement(t.td,null,l.createElement(t.code,null,"npm run dev")),l.createElement(t.td,null,"The other half: a form rendered on a page, with its trigger, frequency cap and submit.")),l.createElement(t.tr,null,l.createElement(t.td,null,l.createElement(t.code,null,"/modal-demo.html")),l.createElement(t.td,null,l.createElement(t.code,null,"npm run dev")),l.createElement(t.td,null,"A pretend host app opening the editor as a ",l.createElement(t.a,{href:"/docs/form-builder/theming-language/#opening-the-editor-as-a-dialog-modal"},"dialog"),", and removing it on ",l.createElement(t.code,null,"close"),".")))),"\n",l.createElement(t.p,null,"The three dev-server pages import from ",l.createElement(t.code,null,"src/"),", so they show the working tree."))}var c=function(e){void 0===e&&(e={});const{wrapper:t}=Object.assign({},(0,a.ah)(),e.components);return t?l.createElement(t,e,l.createElement(r,e)):r(e)},o=n(4160),s=n(9872),i=n(3414),m=n(332),d=n(1073),u=n(9298);const p=n(7926),h="https://github.com/Creaditor/website-official/edit/main/",E=e=>"https://www.npmjs.com/package/"+e;function f(e){let{title:t}=e;const[n,a]=l.useState(null);if(n)return l.createElement("span",{className:p.feedback},"yes"===n?"Thanks, glad it helped.":"Thanks, we'll take another pass at this page.");const r=e=>{var n,l;a(e),null===(n=(l=window).gtag)||void 0===n||n.call(l,"event","docs_feedback",{event_category:"docs",event_label:t,value:"yes"===e?1:0})};return l.createElement("span",{className:p.feedback},"Was this page helpful?",l.createElement("button",{type:"button",className:p.feedbackButton,onClick:()=>r("yes")},l.createElement(u.Z7,null)," Yes"),l.createElement("button",{type:"button",className:p.feedbackButton,onClick:()=>r("no")},l.createElement(u.C_,null)," No"))}function g(e){let{data:t,pageContext:n,children:r,location:c}=e;const{frontmatter:d,fields:u}=t.mdx,{previous:g,next:b}=n;return l.createElement(s.Z,{currentPath:c.pathname},l.createElement("nav",{className:p.breadcrumbs,"aria-label":"Breadcrumb"},l.createElement(o.rU,{to:"/docs"},"Docs"),l.createElement("span",null,"/"),l.createElement("span",null,(0,m.R)(u.section))),l.createElement("h1",{className:p.pageTitle},d.title),d.description&&l.createElement("p",{className:p.pageLede},d.description),d.npmPackage&&l.createElement("p",{className:p.npmSource},l.createElement("a",{href:E(d.npmPackage),target:"_blank",rel:"noreferrer noopener"},d.npmPackage),d.npmVersion&&l.createElement("span",{className:p.navBadge},"v",d.npmVersion)),l.createElement("div",{className:p.prose},l.createElement(a.Zo,{components:i.ZP},r)),l.createElement("footer",{className:p.pageFooter},l.createElement("div",{className:p.footerMeta},l.createElement(f,{title:d.title}),d.npmPackage?l.createElement("a",{className:p.footerLink,href:E(d.npmPackage),target:"_blank",rel:"noreferrer noopener"},"View on npm"):u.sourcePath&&l.createElement("a",{className:p.footerLink,href:""+h+u.sourcePath,target:"_blank",rel:"noreferrer noopener"},"Edit this page")),l.createElement("div",{className:p.prevNext}

1,g&&l.createElement(o.rU,{className:p.prevNextCard,to:g.slug},l.createElement("span",{className:p.prevNextLabel},"Previous"),l.createElement("span",{className:p.prevNextTitle},g.title)),b&&l.createElement(o.rU,{className:p.prevNextCard+" "+p.prevNextEnd,to:b.slug},l.createElement("span",{className:p.prevNextLabel},"Next"),l.createElement("span",{className:p.prevNextTitle},b.title)))))}function b(e){return l.createElement(g,e,l.createElement(c,e))}const N=e=>{var t;let{data:n}=e;return l.createElement(d.Z,{title:n.mdx.frontmatter.title+" | Creaditor Docs",description:null!==(t=n.mdx.frontmatter.description)&&void 0!==t?t:"Creaditor developer documentation, embed the editor, build custom elements, integrate with any stack.",pathname:n.mdx.fields.slug})}},3414:function(e,t,n){var a=n(3366),l=n(7294),r=n(4160),c=n(7902),o=n(9298),s=n(7926);const i=["children"],m=["href","children"],d=["children","className"],u=["children"],p=s;function h(e){return null==e||"boolean"==typeof e?"":"string"==typeof e||"number"==typeof e?String(e):Array.isArray(e)?e.map(h).join(""):l.isValidElement(e)?h(e.props.children):""}const E=e=>function(t){let{children:n}=t,r=(0,a.Z)(t,i);const c=h(n).toLowerCase().replace(/[`*_~]/g,"").replace(/[^a-z0-9֐-׿]+/g,"-").replace(/^-+|-+$/g,"");return l.createElement(e,Object.assign({id:c},r),n,l.createElement("a",{className:p.headingAnchor,href:"#"+c,"aria-label":"Link to this section"},l.createElement(o.xP,null)))};const f={note:o.sz,tip:o.ag,warning:o.aN,danger:o.cS},g={note:"calloutNote",tip:"calloutTip",warning:"calloutWarning",danger:"calloutDanger"};const b={rocket:o.WC,cube:o.FM,book:o.vJ,terminal:o.Fx,spark:o.xT};const N={h2:E("h2"),h3:E("h3"),h4:E("h4"),a:function(e){let{href:t="",children:n}=e,c=(0,a.Z)(e,m);return/^\/(?!\/)/.test(t)?l.createElement(r.rU,Object.assign({to:t},c),n):l.createElement("a",Object.assign({href:t,target:"_blank",rel:"noreferrer noopener"},c),n)},pre:function(e){let{children:t}=e;const n=l.Children.toArray(t)[0];if(!l.isValidElement(n))return l.createElement("pre",null,t);const{className:a,meta:r,children:o}=n.props,{language:s,highlightLines:i,filename:m}=(0,c.J)(a,r);return l.createElement(c.Z,{code:String(null!=o?o:"").replace(/\n$/,""),language:s,filename:m,highlightLines:i})},code:function(e){let{children:t,className:n}=e,r=(0,a.Z)(e,d);return n?l.createElement("code",Object.assign({className:n},r),t):l.createElement("code",Object.assign({className:p.inlineCode},r),t)},table:function(e){let{children:t}=e,n=(0,a.Z)(e,u);return l.createElement("div",{className:p.tableWrap},l.createElement("table",Object.assign({className:p.table},n),t))},Callout:function(e){let{type:t="note",title:n,children:a}=e;const r=f[t];return l.createElement("div",{className:p.callout+" "+p[g[t]]},l.createElement("span",{className:p.calloutIcon},l.createElement(r,null)),l.createElement("div",{className:p.calloutBody},n&&l.createElement("strong",{className:p.calloutTitle},n),a))},Steps:function(e){let{children:t}=e;return l.createElement("div",{className:p.steps},t)},Step:function(e){let{title:t,children:n}=e;return l.createElement("div",{className:p.step},t&&l.createElement("p",{className:p.stepTitle},t),n)},Card:function(e){let{title:t,href:n,icon:a,children:c}=e;const o=a?b[a]:null,s=/^\/(?!\/)/.test(n),i=l.createElement(l.Fragment,null,o&&l.createElement("span",{className:p.cardIcon},l.createElement(o,null)),l.createElement("p",{className:p.cardTitle},t),c&&l.createElement("p",{className:p.cardDesc},c));return s?l.createElement(r.rU,{className:p.card,to:n},i):l.createElement("a",{className:p.card,href:n,target:"_blank",rel:"noreferrer noopener"},i)},CardGrid:function(e){let{children:t}=e;return l.createElement("div",{className:p.cardGrid},t)},Tabs:function(e){let{labels:t,children:n}=e;const[a,r]=l.useState(0),c=l.Children.toArray(n);return l.createElement("div",{className:p.tabs},l.createElement("div",{className:p.tabList,role:"tablist"},t.map(((e,t)=>l.createElement("button",{key:e,type:"button",role:"tab","aria-selected":t===a,className:p.tab+" "+(t===a?p.tabActive:""),onClick:()=>r(t)},e)))),l.createElement("div",{className:p.tabPanel,role:"tabpanel"},c[a]))}};t.ZP=N},1151:function(e,t,n){n.d(t,{Zo:function(){return o},ah:function(){return r}});var a=n(7294);const l=a.createContext({});function r(e){const t=a.useContext(l);return a.useMemo((()=>"function"==typeof e?e(t):{...t,...e}),[t,e])}const c={};function o({components:e,children:t,disableParentContext:n}){let o;return o=n?"function"==typeof e?e({}):e||c:r(e),a.createElement(l.Provider,{value:o},t)}}}]);
2//# sourceMappingURL=component---src-templates-doc-tsx-content-file-path-src-content-npm-05-form-builder

2-11-demo-pages-mdx-12e0359d0473d9f0113a.js.map