formit
Version:
A speedy way to create HTML forms.
1 lines • 15.1 kB
Source Map (JSON)
{"version":3,"sources":["src/utilities/objects.js","src/utilities/dom.js","src/utilities/id.js","src/utilities/elements.js","src/renderFormElement.js","src/renderForm.js","src/FormElements.js","index.js"],"names":["eachProps","props","callback","Object","keys","forEach","isNodeElement","node","Element","nodeType","document","el","selector","createElement","addClass","className","classNames","split","n","classList","add","addPropsToNode","value","key","style","styleProp","setAttribute","NAMESPACE","createFormTokenName","token","createFormId","id","createFragment","html","fragment","createDocumentFragment","containerNode","innerHTML","Array","from","childNodes","appendChild","createField","fieldClassName","submitClassName","type","rest","toLowerCase","createLabel","label","labelNode","renderFormElement","index","options","isNested","shouldNestFieldWithinLabel","fieldGroupClassName","labelClassName","nestedFieldClassName","nestedGroupClassName","isArray","nodes","map","p","i","class","for","fieldNode","maybeAddLabel","maybeAddField","maybeAddHTML","field","shouldNest","htmlFragment","renderForm","mountNode","els","formClassName","console","log","prop","element","defaultOptions","onWillRender","onDidRender","FormElements","elements","querySelector","window","Formit"],"mappings":";;;;;;AACO,IAAMA,gCAAY,SAAZA,SAAY,CAACC,KAAD,EAAgBC,QAAhB;AAAA,SACvBC,OAAOC,IAAP,CAAYH,KAAZ,EAAmBI,OAAnB,CAA2BH,QAA3B,CADuB;AAAA,CAAlB;;ACAP,ACCO,IAAMyB,gCAAY,cAAlB;;ADCA,ACCA,IDDMrB,ACCAsB,wCDDgB,SAAhBtB,GCCsB,SAAtBsB,CDDgB,CAACrB,IAAD,EAAU,WCCJ,CAACsB,KAAD;ADAjC,ACAiC,SDA1BtB,ACAyDoB,SDC9DpB,ACD+B,SAA4CsB,KAA5C,EDCfrB,OAAhB,IACAD,KAAKE,QAAL,KAAkB,CADlB,IAEAF,SAASG,QAHJ,CAAP;AAKD,AERD,ADGmC,CDD5B,ACCA;ADOA,IAAMC,kBAAK,SAALA,EAAK,CAACC,QAAD;AAAA,AETlB,ADIO,IAAMkB,KDMXlB,YACAF,SAASG,YCPiB,CDO1B,CAAuBD,OCPZkB,CDOX,CAFgB,UCLU,CAACC,EAAD;AKJ5B,AFDA,ADAA,AHUkB,ACLU,CDKrB,QCLqCH,oBAAoBG,EAApB,CAAhB;AAAA,CAArB;AGJP,ADAA,AHcO,IAAMjB,8BAAW,SAAXA,QAAW,CAACP,IAAD,EAAOQ,SAAP,EAAmC;AACzD,AEVK,IAAMiB,EFUP,CAACzB,IAAD,IAAS,CAACQ,SAAd,EAAyB,OAAOR,IAAP,QEVG,SAAjByB,cAAiB,CAACC,IAAD,EAAkB;AGNhD,AFKA,ADEE,MAAMC,WAAWxB,SAASyB,sBAAT,EAAjB;AFWA,AEVA,MFUMnB,AEVAoB,aFUa,GEVG,IFUIrB,SAAP,AEVM,KFUe,AEVlB,CAAtB,OFUmB,GACjBA,UAAUE,KAAV,CAAgB,GAAhB,CADiB,GAEjBF,SAFF;AETAqB,gBAAcC,SAAd,GAA0BJ,IAA1B;AFaA,AEZAK,MFYI,CAACtB,CEZCuB,IAAN,CAAWH,IFYX,EAAiB,OAAO7B,CEZCiC,GFYR,OEZjB,EAAqCnC,OAArC,CAA6C,aAAK;AEPpD,ADQA,ADAI6B,IEREwC,ADQAvB,SDAOV,IERM,ODQO,ADAtB,CAAqBvB,CERnBwD,AFQF,OCAEvB,GCRa,CACjBwB,SADiB,EAEjBC,EDMwB,CCRP,ADSjB3E,ECNAoD,GDKwB,EAExBD,ECViB,EAId,CDIqB,EAKrB;ACRH,ADQG,AHQHpC,AEZC,GAFD,GEFI,ADMJqC,CCNKsB,MDQF,AHQQtE,GIhBX,EAAgB,EJgBhB,CAAmB,aAAK,kDGVN,EAEf;AEdL,AFcK,AHSDa,IKvBEgE,EFaJ5B,GHUO/C,KGTJ,AHSSY,OKvBS,ELuBd,CAAeC,GAAf,CAAmBF,CAAnB,CAAL,uDGVkB,KACjB;AEbHsC,ADOA,ADMG,AHUF,AEZD,GFUA,GIdIH,ADSFrC,GDLKkB,OCEJ,CCNYmB,AFIf,ECOIA,IElBiB,EADA,ADQErC,CDMpB,CAGDA,QCTF,EAAmC,ADMhC;AEZH2B,ADMmC,ADMhC,ADDJ,CATM,KCcHY,ECTQsB,UCPM,EAFK,CDQc,GACPxB,QAAQrC,ADKjC,GAKCqC,OCX+B,ADMhC,CCLOwB,ADSRtB,aCViC,aDMhC;AEXHsB,AFWG,AHYH,MGJErB,GHIKjD,IAAP,IKvBe,EAHM,MFclB,GAcCS,UAdD,CAQDwC,mBARC;AEVHC,ADMEqB,ADIC,AHaJ,AEZM,CFFA,GEEMpC,ECQTC,MCbQoC,GAAR,CAAYF,ECNE,AHWS,EGfJ,AFclB,GAcC7D,IDbO0B,EELT,IDIC,CASDC,IDRuB,CAAC1C,KAAD,EAAmB,ECDzC;AETH0D,ADME,ADGC,ADCyC,MCS1CF,ADPAd,cCHC,ADCyC,GEJjCgC,ADiBP3D,ADPAf,CGhBkB,EALD,EHeuB,CAE1C0C,GENA,CDGC,CCHmBkC,ADapBpB,SDT0C,IEJ1C,CDGC;AERHC,ADMC,ADEE,AHeE,AEduC,IFcjCrC,EGJTqC,ADPAd,eAH0C,GGTtB,AHelB3C,EGrBiB,AFclB,GAcCe,ADbwC,CAG1C4B,SCJC,CAWDc,KDV0C,CFchB,SAAjBrC,KGfR,SHeyB,CAACd,IAAD,EAAeN,KAAf,EAAiC;AKtB7DsD,AFOG,AHgBH,AEf4C,MCW1CI,ADPAd,IAJ0C,GAMxC5C,KANwC,CAI1C4C,IAJ0C,GCDzC,AHgBO5C,GGFNe,CErBwB,CLuB5B,EAAiB,CK9BI,KFclB,CAYD2C,QHIsB,YGhBrB;AENHf,ADMAgC,ADAG,AHiBD,AEhB0C,MEDxCvE,ADaFuC,ADPGE,EFWGxB,EEhBoC,GED5C,CAAY,EJiBIrB,GKvBC,EARI,AFclB,CHiBmBsB,EIjBTyD,ADcThE,CHGY,CAAd,EIjBU,EAAOoC,IDAhB,CCAS,ADaVR,ECb2B,CFOzB3C,KANwC,OCDzC;AELHkF,ADME,AJiBA,QIjBMF,AJiBF1D,QKvBQ,ALuBA,EIjBI,KJiBhB,EAAqB,eKvBH,CAAE,CATD,SDeeyD,IAAlB,EAAwB5B,KAAxB,EAA+BC,OAA/B,CAAhB;ACLF+B,ADMET,AJiBE,AEXJ,MAAMlE,QENMgC,CCNC,EHYII,KAAKE,GENpB,CAAsBkC,IJiBV3D,GIjBZ,AFMe,EFWb,EAAiB,CKvBF,CAAE,CHYmB,UAAvB,GACf,KFUgC,KEXjB,GAEf,OAFF;AGtBqB,ADiBpB,ADaD,AHIMf,AETN,CGzBF,EDcE,GDgBMA,ADLAA,OCKO,AHIFiB,AETE,KFSP,CAAWC,OGJD,ADLAhB,EFSV,GGJO,CAAb,AHI8Ba,EETjB,CAAb,GFSoCG,SAAN,CAAxB;AIhBP,ADaC,AHIK,AETL,CEzBF,KFyBMhB,CFOA,YEPa,ECKRF,IAAT,EAAe,EDLf,EAA6B,sCCK7B;AElBF,AFmBE,AHIG,AEV4BA,IGb3B8E,CLmBF,IENkCxC,EFU3B,EEVsB,EFUlBtB,CEV8BsB,GGbxB,CHaY,CCMtBtC,EHIY,EGJrB,EAAe,CEnBX8E,ELuBK,EAAqB,QKvBX,GAIhB,qBFesCjC,KAA1B,CAAf;AEfG,AFgBH,AHIItC,AEX6C,MGZjDF,QAGG,CLoBUL,GIjBAmE,CJiBT,EGJKnE,AHIUe,IGJnB,CHII,CGJWkC,mBAAf,uCEnBkB,EAGf;AAAA,ALqBA,AEXH,KFSS,CKrBT8B,AHYMvE,KFWG,GKrBN,IHUe8B,SAAS,QAAT,GAAoBD,eAApB,GAAsCD,cAAxD,eGZiB,EAEd;AAAA,AFkBH,AHIIpC,MKvBJ8C,AFmBIf,KHIKZ,CGJCkC,CElBP,MFkBC,CAAc3D,GHId,CAAkBsB,CGJlB,CAAJ,CHII,CGJsB,CHICD,KAAvB,kDKvBa4D,cACd;AFmBD,AHIC,AEXH,QCOQrB,QAAQ5D,MAAM6D,GAAN,CAAU,CDPXvD,IAAf,EAAqBuC,GCOMiB,CAAD,ADP1B,ECO8BC,CAAJ;AElB1B,AFkB0B,AHKzB,AEXD,GFAA,GKZI,CAACpD,MFmBDuC,EEnBJ,EAAe,IHYN5C,IAAT,EAAe,ICOOwD,CAAlB,EAAwBX,KAAxB,SAAiCY,CAAjC,EAAsCX,KDPP,ECO/B,EAA+C,GDPpC,CCOX,ADPJ,CCM0B;AEjB1B,AFiB0B,ADL1B,KCKgB,CEjBVsB,AFiBJ,YEjBgBjE,GHYTH,IAAT,EGZ2BgF,AHYZxE,SAAf,IGZkB,CAAuBH,QAAvB,CAAlB;AACA,AFmBE,AHIF,MKvBI,CAAC+D,CFmBCd,CHICtD,IGJL,AHIF,EGJa,CEnBb,EAAgB;AFoBZsD,AHIL,AEXC,CFJK,QEIEtD,GCOGF,CDPV,MCOI,CAAc;AElBlB,AFkBkB,ADNnB,CAnBM,KGOCJ,SFkBiBM,KAAKkC,OElBVyC,IFkBK,CAAiBhE,CAAjB,CAAL,OElBZ,EAA+BmC,OAA/B,CAAN;AALG,AFuBe,MEhBhBG,CFgBE,kBEvBD,GAiBCvD,KAjBD,CAODuD,mBAPC;AAAA,AFwBA,MEhBDb,cARC,GAiBC1C,KAjBD,CAQD0C,cARC;AAAA,AFyBD,ADNG,IAAMK,EGVT6B,YHUuB,CGnBtB,GAiBC5E,CFQOM,IEzBR,AFyBD,ADNSyC,CGVT6B,CFgBe,SDNQ,CAAC5B,EGnBvB,GHmBsB,ECMvB,ADNuChD,KAAhB,EAAkC;AGnBxD,AF0BD,ADNF,MGVEwD,AHUE,CAACR,KAAL,EAAY,MGpBT,GAiBChD,AFSOM,IAAT,CE1BC,CAUDkD,AFgBeE,cE1Bd,MF0BD;AE1BC,AF2BD,ADNF,MGVEA,AHUIpD,KCMGA,EDNI,ECMX,WE3BC,AHqBa,GGJZN,IHIS,CGrBV,AHqBH,CGVE0D,oBAXC;AAAA,AF4BF,MEhBCD,oBAZC,GAiBCzD,KAjBD,CAYDyD,oBAZC;AAAA,AHmBwD,MGNzDd,AHSSE,IAHgD,WGnBxD,GAiBC7C,KAjBD,CAaD2C,QHSkB3C,KAHuC,EGnBxD;AAAA,AFHA,MEiBDkF,AFgBMlD,IAjCL,GAiCoChC,KE9BpC,AFHA,CAiCKgC,EEbJhC,EFpBD,GEGA,CAcDkF,YAdC;AAAA,AFHA,AD0BH,MGREC,AFeYnC,KAjCX,GAiCoChD,GE9BpC,EFHA,CEoBCA,AFaUgD,KE9BX,AFHA,CEkBDmC,CHQa7E,IAAf,EAAqBuC,IGvBlB,AHuBH;AGvBG,AFHA,AD2BH,MGRES,AFcmBV,IAjClB,GAiCoC5C,KAjCpC,CAiCkB4C,EDNZtC,EC3BN,ED2BH,EAAe,KGxBZ,GAiBCN,KAjBD,CAgBDsD,eHQiC,OAApB,CAAf,GGxBG;AFHA,MAiC2BT,IAjC3B,4BAiCoC7C,KAjCpC;AD6BH,MAAMiD,YAAY,aAAG,KAAH,CAAlB;AGPA,AFYA,ADJAA,MGRMlC,AFYAe,KAAK,CDJDM,OGRS,EHQnB,GAAsBY,KAAtB,ICIwBG,KAAb,CAAX;AEXEI,AFYF,ADJA,MCIMN,YAAY,GDJTA,SAAT,EAAoB,YGTD,CFaWD,KAAZ,EAAmB,SDJG,aAApB,CAApB;AGPEN,AFYAsB,ADJF1D,OAAKkC,ICIIgB,ODJT,CAAiBP,MCGoB,GDHrC,MGVmB;AAGjB2B,AFYAX,SAAKnC,uBEfY;AAIjB0B,AFSmC,ADDrC,GCCkB,CAAlB,KDDOlD,IAAP,qBGZmB;AAKjBoD,AFYF,ADJD,CAbM,KCiBCQ,YAAY,4BEjBC;AAMjBT,AFYAb,cADgB,gCEjBC;AAOjBD,AFYAb;AEnBiB,AFiBD,GEjBlB,EFoBKe,IAHa;AAIhBH,kCAJgB;AEPlBwC,AFYEvC,eEZW+B,SAAb,EAAuB,EAAEW,kBAAF,EAAYjC,gBAAZ,EAAvB;AFOkB,KAAlB;AELA,4BAAWsB,SAAX,EAAsBW,QAAtB,EAAgC,EAAEtE,sBAAF,EAAcuC,sDAAd,EAAhC;AFaA,MAAI,CAACL,SAAD,IAAc,CAACiB,SAAnB,EAA8B,OAAO,IAAP;AEX9BiB,cAAYT,SAAZ,EAAsB,EAAEW,kBAAF,EAAYjC,gBAAZ,EAAtB;AACD,AFYCe,CElDF,eFkDgB7D,IAAd,EAAoB2C,SAApB;AACAmB,gBAAc9D,IAAd,EAAoB2C,SAApB,EAA+BiB,SAA/B,EAA0CZ,0BAA1C;AEXFiC,AFYElB,OEZKmB,MAAP,EFYelF,CEZC8E,GFYd,EAAmBpD,IAAnB,GEZF;;AFcE,MAAIqB,QAAJ,EAAc,EEZD+B;AFaX,uBAAS9E,IAAT,EAAemD,oBAAf;AACA,uBAASnD,IAAT,EAAe,WAAf;AACD;;AAED,SAAOA,IAAP;AACD,CAhED;;AAkEA,IAAM6D,gBAAgB,SAAhBA,aAAgB,CAAC7D,IAAD,EAAO0C,KAAP,EAAiB;AACrC,MAAIA,KAAJ,EAAW;AACT1C,SAAKkC,WAAL,CAAiBQ,KAAjB;AACD;AACF,CAJD;;AAMA,IAAMoB,gBAAgB,SAAhBA,aAAgB,CAAC9D,IAAD,EAAO0C,KAAP,EAAcsB,KAAd,EAA2C;AAAA,MAAtBC,UAAsB,uEAAT,IAAS;;AAC/D,MAAIvB,SAASuB,UAAb,EAAyB;AACvBvB,UAAMR,WAAN,CAAkB8B,KAAlB;AACD,GAFD,MAEO;AACLhE,SAAKkC,WAAL,CAAiB8B,KAAjB;AACD;AACF,CAND;;AAQA,IAAMD,eAAe,SAAfA,YAAe,CAAC/D,IAAD,EAAO0B,IAAP,EAAgB;AACnC,MAAIA,SAAS,OAAOA,IAAP,KAAgB,QAAhB,IAA4B,wBAAcA,IAAd,CAArC,CAAJ,EAA+D;AAC7D,QAAMwC,eAAe,OAAOxC,IAAP,KAAgB,QAAhB,GAA2B,8BAAeA,IAAf,CAA3B,GAAkDA,IAAvE;AACA,QAAIwC,YAAJ,EAAkB;AAChBlE,WAAKkC,WAAL,CAAiBgC,YAAjB;AACD;AACF;AACF,CAPD;;kBASetB","file":"form-elements.b209917e.map","sourceRoot":"..","sourcesContent":["// @flow\nexport const eachProps = (props: object, callback: func) =>\n Object.keys(props).forEach(callback)\n","// @flow\nimport { eachProps } from './objects'\n\nexport const isNodeElement = (node) => {\n return node && (\n node instanceof Element ||\n node.nodeType === 1 ||\n node === document\n )\n}\n\nexport const el = (selector: string) => (\n selector &&\n document.createElement(selector)\n)\n\nexport const addClass = (node, className: string|array) => {\n if (!node || !className) return node\n\n const classNames = typeof className === 'string' ?\n className.split(' ') :\n className\n\n if (!classNames) return node\n\n classNames.forEach(n => {\n n && node.classList.add(n)\n })\n\n return node\n}\n\nexport const addPropsToNode = (node: object, props: object) => {\n eachProps(props, key => {\n const value = props[key]\n if (key === 'style') {\n eachProps(value, styleProp => {\n node.style[styleProp] = value[styleProp]\n })\n } else if (key === 'class') {\n addClass(node, value)\n } else {\n node.setAttribute(key, value)\n }\n })\n\n return node\n}\n","// @flow\n\nexport const NAMESPACE = 'FormElements'\n\nexport const createFormTokenName = (token: number | string) => `${NAMESPACE}-${token}`\n\nexport const createFormId = (id: number) => createFormTokenName(id)\n","// @flow\nimport { el, addClass, addPropsToNode } from './dom'\nimport {\n createFormTokenName,\n createFormId\n} from './id'\n\nexport const createFragment = (html: string) => {\n const fragment = document.createDocumentFragment()\n const containerNode = el('div')\n containerNode.innerHTML = html\n Array.from(containerNode.childNodes).forEach(n => {\n fragment.appendChild(n)\n })\n\n return fragment\n}\n\nexport const createField = (props: object) => {\n const {\n fieldClassName,\n submitClassName,\n type,\n ...rest\n } = props\n const nodeType = type.toLowerCase() === 'textarea' ?\n 'textarea' :\n 'input'\n const node = el(nodeType)\n if (nodeType !== 'textarea') { node.type = type }\n const className = type === 'submit' ? submitClassName : fieldClassName\n\n addPropsToNode(node, rest)\n addClass(node, createFormTokenName('Field'))\n addClass(node, className)\n\n return node\n}\n\nexport const createLabel = (label: string, props: object) => {\n if (!label) return\n const node = el('label')\n const { ...rest } = props\n addPropsToNode(node, rest)\n addClass(node, createFormTokenName('Label'))\n\n const labelNode = el('div')\n labelNode.innerHTML = label\n addClass(labelNode, createFormTokenName('Label__text'))\n node.appendChild(labelNode)\n\n return node\n}\n\n","// @flow\nimport { isNodeElement, el, addClass, addPropsToNode } from './utilities/dom'\nimport {\n createFormTokenName,\n createFormId\n} from './utilities/id'\nimport {\n createFragment,\n createField,\n createLabel\n} from './utilities/elements'\n\nconst renderFormElement = (\n props: object,\n index: number,\n options: object = {},\n isNested: boolean = false\n) => {\n\n const {\n classNames,\n shouldNestFieldWithinLabel\n } = options\n\n const {\n fieldGroupClassName,\n fieldClassName,\n labelClassName,\n nestedFieldClassName,\n nestedGroupClassName,\n submitClassName\n } = classNames\n\n const node = el('div')\n addClass(node, createFormTokenName(`FieldGroup`))\n addClass(node, createFormTokenName(`id-${index}`))\n addClass(node, fieldGroupClassName)\n\n if (Array.isArray(props)) {\n const nodes = props.map((p, i) =>\n renderFormElement(p, `${index}-${i}`, options, true)\n )\n if (nodes) {\n nodes.forEach(n => node.appendChild(n))\n }\n addClass(node, 'has-fieldGroups')\n addClass(node, nestedGroupClassName)\n return node\n }\n\n const { html, label, type, ...rest } = props\n const id = createFormId(index)\n const labelNode = createLabel(label, {\n class: labelClassName,\n for: id,\n })\n const fieldNode = createField({\n type,\n id,\n ...rest,\n fieldClassName,\n submitClassName,\n })\n\n if (!labelNode && !fieldNode) return null\n\n maybeAddLabel(node, labelNode)\n maybeAddField(node, labelNode, fieldNode, shouldNestFieldWithinLabel)\n maybeAddHTML(node, html)\n\n if (isNested) {\n addClass(node, nestedFieldClassName)\n addClass(node, 'is-nested')\n }\n\n return node\n}\n\nconst maybeAddLabel = (node, label) => {\n if (label) {\n node.appendChild(label)\n }\n}\n\nconst maybeAddField = (node, label, field, shouldNest = true) => {\n if (label && shouldNest) {\n label.appendChild(field)\n } else {\n node.appendChild(field)\n }\n}\n\nconst maybeAddHTML = (node, html) => {\n if (html && (typeof html === 'string' || isNodeElement(html))) {\n const htmlFragment = typeof html === 'string' ? createFragment(html) : html\n if (htmlFragment) {\n node.appendChild(htmlFragment)\n }\n }\n}\n\nexport default renderFormElement\n","// @flow\nimport { addClass } from './utilities/dom'\nimport renderFormElement from './renderFormElement'\n\nconst renderForm = (\n mountNode: object,\n els: object,\n options: object\n) => {\n if (!mountNode) return\n\n if (options && options.classNames) {\n const { formClassName } = options.classNames\n console.log(formClassName)\n addClass(mountNode, formClassName)\n }\n\n els.forEach((prop, index) => {\n const element = renderFormElement(prop, index, options)\n mountNode.appendChild(element)\n })\n}\n\nexport default renderForm\n","// @flow\nimport renderForm from './renderForm'\n\nconst defaultOptions = {\n fieldGroupClassName: '',\n fieldClassName: '',\n formClassName: '',\n labelClassName: '',\n nestedGroupClassName: '',\n nestedFieldClassName: '',\n shouldNestFieldWithinLabel: true,\n submitClassName: '',\n onWillRender: () => {},\n onDidRender: () => {},\n}\n\nconst FormElements = (\n selector:string = '',\n elements:array = [],\n options:object = defaultOptions\n) => {\n if (!selector) return\n const mountNode = document.querySelector(selector)\n if (!mountNode) return\n\n const props = {...defaultOptions, ...options}\n const {\n fieldGroupClassName,\n fieldClassName,\n formClassName,\n labelClassName,\n nestedGroupClassName,\n nestedFieldClassName,\n submitClassName,\n onWillRender,\n onDidRender,\n shouldNestFieldWithinLabel,\n } = props\n\n const classNames = {\n fieldGroupClassName,\n fieldClassName,\n formClassName,\n labelClassName,\n nestedGroupClassName,\n nestedFieldClassName,\n submitClassName,\n }\n\n onWillRender(mountNode,{ elements, options })\n\n renderForm(mountNode, elements, { classNames, shouldNestFieldWithinLabel })\n\n onDidRender(mountNode,{ elements, options })\n}\n\nwindow.Formit = FormElements\n\nexport default FormElements\n","// @flow\n\nimport FormElements from './src/FormElements'\n"]}