@web3r/flowerkit
Version:
Tree-shakable JavaScript and TypeScript utility library for frontend/browser apps: DOM, events, arrays, objects, strings, date, JSON, and network helpers (ESM/CJS, SSR-friendly).
1 lines • 2.7 kB
Source Map (JSON)
{"version":3,"file":"index.cjs","sources":[""],"sourcesContent":["\r\nimport { getDocument } from \"ssr-window\";\r\n\r\nexport type TGetElWrapperArgs = Parameters<typeof getElWrapper>;\r\n\r\nexport type TGetElWrapperReturn = ReturnType<typeof getElWrapper>;\r\n\r\n/**\r\n * Gets a wrapper for specific element\r\n * @param el{HTMLElement} DOM element\r\n * @param str{String} string of wrapper HTML layout (supports nested blocks)\r\n * @returns {HTMLElement}\r\n * @throws {TypeError} getElWrapper: el must be an HTMLElement\r\n * @throws {TypeError} getElWrapper: str must be a non-empty string\r\n * @example\r\n * // How to wrap content to the few nested `div` blocks?\r\n * // <div id=\"block\">My Element</div>\r\n * const wrapperLayout = `\r\n * <div class=\"wrapper\">\r\n * <div class=\"wrapper__inner\"></div>\r\n * </div>\r\n * `;\r\n * const el = document.getElementById(\"block\");\r\n * const wrapped = getElWrapper(el, wrapperLayout);\r\n * console.log(wrapped.outerHTML); // => `<div class=\"wrapper\"><div class=\"wrapper__inner\"><div id=\"block\">My Element</div></div></div>`\r\n */\r\nexport const getElWrapper = (el: HTMLElement, str: string): HTMLElement => {\r\n if (!el || typeof (el as any).nodeType !== \"number\") {\r\n throw new TypeError(\"getElWrapper: el must be an HTMLElement\");\r\n }\r\n if (typeof str !== \"string\" || str.length === 0) {\r\n throw new TypeError(\"getElWrapper: str must be a non-empty string\");\r\n }\r\n const temp = getDocument().createElement(\"div\");\r\n const parent = el.parentNode;\r\n const insertWhere = (el as any).previousSibling;\r\n let target;\r\n temp.innerHTML = str;\r\n target = temp.firstChild as any;\r\n while ((target as any).firstChild) {\r\n target = (target as any).firstChild;\r\n }\r\n (target as any).appendChild(el);\r\n if (parent) {\r\n parent.insertBefore(temp.firstChild as any, (insertWhere ? (insertWhere as any).nextSibling : (parent as any).firstChild));\r\n }\r\n return target as any;\r\n};\r\n"],"names":["getElWrapper","el","str","nodeType","TypeError","length","temp","getDocument","createElement","parent","parentNode","insertWhere","previousSibling","target","innerHTML","firstChild","appendChild","insertBefore","nextSibling"],"mappings":";;;;;;;;;;;;;;;;;;;SA0BaA,aAAeA,CAACC,GAAiBC,OAC5C,IAAKD,WAAcA,GAAWE,WAAa,SACzC,MAAM,IAAIC,UAAU,2CAEtB,UAAWF,MAAQ,UAAYA,IAAIG,SAAW,EAC5C,MAAM,IAAID,UAAU,gDAEtB,MAAME,KAAOC,UAAAA,cAAcC,cAAc,OACzC,MAAMC,OAASR,GAAGS,WAClB,MAAMC,YAAeV,GAAWW,gBAChC,IAAIC,OACJP,KAAKQ,UAAYZ,IACjBW,OAASP,KAAKS,WACd,MAAQF,OAAeE,WACrBF,OAAUA,OAAeE,WAE1BF,OAAeG,YAAYf,IAC5B,GAAIQ,OACFA,OAAOQ,aAAaX,KAAKS,WAAoBJ,YAAeA,YAAoBO,YAAeT,OAAeM,YAEhH,OAAOF"}