@slimr/css 2.0.1 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/package.json +1 -1
  2. package/src/core.cjs +8 -8
  3. package/src/core.cjs.map +1 -1
  4. package/src/core.d.ts +9 -3
  5. package/src/core.js +10 -10
  6. package/src/core.js.map +1 -1
  7. package/src/core.ts +26 -14
  8. package/src/index.cjs +9 -9
  9. package/src/index.cjs.map +1 -1
  10. package/src/index.d.ts +1 -1
  11. package/src/index.js +9 -9
  12. package/src/index.js.map +1 -1
  13. package/src/index.ts +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@slimr/css",
3
- "version": "2.0.1",
3
+ "version": "2.0.2",
4
4
  "author": "Brian Dombrowski",
5
5
  "license": "ISC",
6
6
  "private": false,
package/src/core.cjs CHANGED
@@ -1,14 +1,14 @@
1
- "use strict";var g=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var c=(r,n)=>{for(var t in n)g(r,t,{get:n[t],enumerable:!0})},y=(r,n,t,o)=>{if(n&&typeof n=="object"||typeof n=="function")for(let e of f(n))!b.call(r,e)&&e!==t&&g(r,e,{get:()=>n[e],enumerable:!(o=l(n,e))||o.enumerable});return r};var h=r=>y(g({},"__esModule",{value:!0}),r);var T={};c(T,{addCss:()=>m,classJoin:()=>$,createClass:()=>u,shorthandProps:()=>P,shorthandPropsMap:()=>p,t2s:()=>d});module.exports=h(T);var x=["30em","48em","62em","80em","96em"];function $(...r){return r.filter(n=>n&&typeof n=="string").join(" ")}function j(r){return r.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm,"")}function w(r){return r.includes("[")?r.split(`
2
- `).map(n=>{var s;let[t,o,e]=(s=[...n.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)][0])!=null?s:[];return e?e.split(",").map((i,a)=>(i=i.trim(),!i||i==="null"||i==="undefined"?"":a===0?`${o}: ${i};`:`@media (min-width: ${x[a-1]}) { ${o}: ${i}; }`)).join(`
1
+ "use strict";var g=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var c=(r,n)=>{for(var t in n)g(r,t,{get:n[t],enumerable:!0})},y=(r,n,t,o)=>{if(n&&typeof n=="object"||typeof n=="function")for(let e of f(n))!b.call(r,e)&&e!==t&&g(r,e,{get:()=>n[e],enumerable:!(o=l(n,e))||o.enumerable});return r};var h=r=>y(g({},"__esModule",{value:!0}),r);var k={};c(k,{addCss:()=>m,breakPoints:()=>a,classJoin:()=>x,createClass:()=>u,shorthandProps:()=>w,shorthandPropsMap:()=>p,t2s:()=>d});module.exports=h(k);var a=["30em","48em","62em","80em","96em"];function x(...r){return r.filter(n=>n&&typeof n=="string").join(" ")}function $(r){return r.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm,"")}function j(r){return r.includes("[")?r.split(`
2
+ `).map(n=>{var e;let[,t,o]=(e=[...n.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)][0])!=null?e:[];return o?o.split(",").map((i,s)=>(i=i.trim(),!i||i==="null"||i==="undefined"?"":s===0?`${t}: ${i};`:`@media (min-width: ${a[s-1]}) { ${t}: ${i}; }`)).join(`
3
3
  `):n}).join(`
4
- `):r}var p={ai:"align-items",b:"border",br:"border-radius",bg:"background",c:"color",d:"display",f:"flex",fd:"flex-direction",i:"inset",h:"height",jc:"justify-content",m:"margin",ml:"margin-left",mr:"margin-right",mt:"margin-top",mb:"margin-bottom",maxW:"max-width",minW:"min-width",p:"padding",pl:"padding-left",pr:"padding-right",pt:"padding-top",pb:"padding-bottom",pos:"position",ta:"text-align",w:"width",z:"z-index"},P=[...Object.keys(p),"mx","my","px","py"];function S(r){return r=`
4
+ `):r}var p={ai:"align-items",b:"border",br:"border-radius",bg:"background",c:"color",d:"display",f:"flex",fd:"flex-direction",i:"inset",h:"height",jc:"justify-content",m:"margin",ml:"margin-left",mr:"margin-right",mt:"margin-top",mb:"margin-bottom",maxW:"max-width",minW:"min-width",p:"padding",pl:"padding-left",pr:"padding-right",pt:"padding-top",pb:"padding-bottom",pos:"position",ta:"text-align",w:"width",z:"z-index"},w=[...Object.keys(p),"mx","my","px","py"];function P(r){return r=`
5
5
  `+r,r=r.replace(/([mp])x:([^;]*)/g,`$1l:$2;
6
6
  $1r:$2`).replace(/([mp])y:([^;]*);/g,`$1t:$2;
7
7
  $1b:$2`),Object.entries(p).forEach(([n,t])=>{r=r.replace(new RegExp(`([
8
- ;])${n}:`,"g"),`$1${t}:`)}),r.trim()}function k(r){let n=[];for(let t of r.matchAll(/[@&]/gm)){let o="",e=0,s=0;for(let i=t.index;i<r.length;i++)if(r[i]==="{")s===0&&(o=r.slice(t.index,i).trim(),e=i+1),s++;else if(r[i]==="}"&&(s--,s===0)){n.push({start:t.index,end:i+1,query:o,outerBody:r.slice(t.index,i+1),innerBody:r.slice(e,i)});break}s!==0&&console.error(`${o} not closed: "${r}"`)}return n}function q(r){return r.split(`
8
+ ;])${n}:`,"g"),`$1${t}:`)}),r.trim()}function S(r){let n=[];for(let t of r.matchAll(/[@&]/gm)){let o="",e=0,i=0;for(let s=t.index;s<r.length;s++)if(r[s]==="{")i===0&&(o=r.slice(t.index,s).trim(),e=s+1),i++;else if(r[s]==="}"&&(i--,i===0)){n.push({start:t.index,end:s+1,query:o,outerBody:r.slice(t.index,s+1),innerBody:r.slice(e,s)});break}i!==0&&console.error(`${o} not closed: "${r}"`)}return n}function A(r){return r.split(`
9
9
  `).map(n=>n.trim()).filter(n=>n).join(`
10
- `)}function d(...r){let[n,...t]=r;return typeof n=="string"?n:n.map((o,e)=>{var s;return o+((s=t==null?void 0:t[e])!=null?s:"")}).join("")}function m(r){m.que.add(r),setTimeout(()=>{let n=[...m.que].join(`
11
- `);if(n){m.que.clear();let t=document.createElement("style");t.id=`u${m.count++}`,t.innerHTML=n,document.head.appendChild(t)}},0)}m.que=new Set;m.count=0;function u(...r){let n=d(...r);if(!n)return"";let t=u.history.get(n);if(!t){t="s"+u.count++,u.history.set(n,t),n=j(n),n=S(n),n=w(n);let o=k(n);for(let e of o.reverse())n=n.slice(0,e.start)+n.slice(e.end);n=`.${t}{
10
+ `)}function d(...r){let[n,...t]=r;return typeof n=="string"?n:n.map((o,e)=>{var i;return o+((i=t==null?void 0:t[e])!=null?i:"")}).join("")}function m(r){m.que.add(r),setTimeout(()=>{let n=[...m.que].join(`
11
+ `);if(n){m.que.clear();let t=document.createElement("style");t.id=`u${m.count++}`,t.innerHTML=n,document.head.appendChild(t)}},0)}m.que=new Set;m.count=0;function u(...r){let n=d(...r);if(!n)return"";let t=u.history.get(n);if(!t){t="s"+u.count++,u.history.set(n,t),n=$(n),n=P(n),n=j(n);let o=S(n);for(let e of o.reverse())n=n.slice(0,e.start)+n.slice(e.end);n=`.${t}{
12
12
  ${n}
13
13
  }
14
14
  `,n+=o.map(e=>e.query.startsWith("&")?`.${t}${e.query.slice(1)}{
@@ -17,7 +17,7 @@ ${e.innerBody}
17
17
  .${t}{${e.innerBody}
18
18
  }
19
19
  }`).join(`
20
- `),n=q(n)+`
20
+ `),n=A(n)+`
21
21
 
22
- `,m(n)}return t}u.count=0;u.history=new Map;0&&(module.exports={addCss,classJoin,createClass,shorthandProps,shorthandPropsMap,t2s});
22
+ `,m(n)}return t}u.count=0;u.history=new Map;0&&(module.exports={addCss,breakPoints,classJoin,createClass,shorthandProps,shorthandPropsMap,t2s});
23
23
  //# sourceMappingURL=core.cjs.map
package/src/core.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["core.ts"],"sourcesContent":["/** Breakpoints like chakra */\nconst breakPoints = ['30em', '48em', '62em', '80em', '96em']\n\n/** Joins class names and filters out blanks */\nexport function classJoin(...classes: any[]) {\n return classes.filter((c) => c && typeof c === 'string').join(' ')\n}\n\n// delete css comments i.e. {/* blah */}\nfunction deleteComments(css: string) {\n return css.replace(/{\\/\\*[\\s\\S]*?(?=\\*\\/})\\*\\/}/gm, '')\n}\n\n/**\n * Expands array values into media queries\n *\n * Inspired by https://chakra-ui.com/docs/styled-system/responsive-styles\n */\nfunction expandArrayValues(css: string) {\n if (!css.includes('[')) return css\n return css\n .split('\\n')\n .map((l) => {\n const [_, prop, vals] = [...l.matchAll(/([A-Za-z\\-]*):[ ]*\\[([^\\]]+)\\]/g)]?.[0] ?? []\n if (vals) {\n return vals\n .split(',')\n .map((val, i) => {\n val = val.trim()\n if (!val || val === 'null' || val === 'undefined') return ''\n if (i === 0) {\n return `${prop}: ${val};`\n }\n return `@media (min-width: ${breakPoints[i - 1]}) { ${prop}: ${val}; }`\n })\n .join('\\n')\n }\n return l\n })\n .join('\\n')\n}\n\nexport interface ShorthandProps {\n /** shorthand for css:align-items */\n ai?: string\n /** shorthand for css:border */\n b?: string | number\n /** shorthand for css:border-radius */\n br?: string | number\n /** shorthand for css:background */\n bg?: string\n /** shorthand for css:color */\n c?: string\n /** shorthand for css:display */\n d?: string\n /** shorthand for css:flex */\n f?: string\n /** shorthand for css:flex-direction */\n fd?: string\n /** shorthand for css:height */\n h?: number | string\n /** shorthand for css:inset */\n i?: number | string\n /** shorthand for css:justify-content */\n jc?: string\n /** shorthand for css:margin */\n m?: number | string\n /** shorthand for css:margin-left */\n ml?: number | string\n /** shorthand for css:margin-right */\n mr?: number | string\n /** shorthand for css:margin-top */\n mt?: number | string\n /** shorthand for css:margin-bottom */\n mb?: number | string\n /** shorthand for css:margin-top & margin-bottom */\n my?: number | string\n /** shorthand for css:margin-left & margin-right */\n mx?: number | string\n /** shorthand for css:max-width */\n maxW?: number | string\n /** shorthand for css:min-width */\n minW?: number | string\n /** shorthand for css:padding */\n p?: number | string\n /** shorthand for css:padding-left */\n pl?: number | string\n /** shorthand for css:padding-right */\n pr?: number | string\n /** shorthand for css:padding-top */\n pt?: number | string\n /** shorthand for css:padding-bottom */\n pb?: number | string\n /** shorthand for css:padding-top & padding-bottom */\n py?: number | string\n /** shorthand for css:padding-left & padding-right */\n px?: number | string\n /** shorthand for css:position */\n pos?: number | string\n /** shorthand for css:text-align */\n ta?: string\n /** shorthand for css:width */\n w?: number | string\n /** shorthand for css:z-index */\n z?: number | string\n}\nexport const shorthandPropsMap: Record<keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>, string> = {\n ai: 'align-items',\n b: 'border',\n br: 'border-radius',\n bg: 'background',\n c: 'color',\n d: 'display',\n f: 'flex',\n fd: 'flex-direction',\n i: 'inset',\n h: 'height',\n jc: 'justify-content',\n m: 'margin',\n ml: 'margin-left',\n mr: 'margin-right',\n mt: 'margin-top',\n mb: 'margin-bottom',\n maxW: 'max-width',\n minW: 'min-width',\n p: 'padding',\n pl: 'padding-left',\n pr: 'padding-right',\n pt: 'padding-top',\n pb: 'padding-bottom',\n pos: 'position',\n ta: 'text-align',\n w: 'width',\n z: 'z-index',\n}\nexport const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'px', 'py']\n\n/** Expand short-hand css props to full */\nfunction expandProps(css: string) {\n css = '\\n' + css // inject a newline to make the regex easier\n // Handle 'mx', 'my', 'px', 'py'\n css = css.replace(/([mp])x:([^;]*)/g, '$1l:$2;\\n$1r:$2').replace(/([mp])y:([^;]*);/g, '$1t:$2;\\n$1b:$2')\n Object.entries(shorthandPropsMap).forEach(([k, v]) => {\n css = css.replace(new RegExp(`([ \\n\\t;])${k}:`, 'g'), `$1${v}:`)\n })\n return css.trim()\n}\n\n/** Find @keyframes, @media, @container queries in css **/\nfunction findQueries(css: string) {\n const queries = []\n for (let m of css.matchAll(/[@&]/gm)) {\n let query = ''\n let bodyStart = 0\n let openCount = 0\n for (let i = m.index!; i < css.length; i++) {\n if (css[i] === '{') {\n if (openCount === 0) {\n query = css.slice(m.index, i).trim()\n bodyStart = i + 1\n }\n openCount++\n } else if (css[i] === '}') {\n openCount--\n if (openCount === 0) {\n queries.push({\n start: m.index,\n end: i + 1,\n query,\n outerBody: css.slice(m.index, i + 1),\n innerBody: css.slice(bodyStart, i),\n })\n break\n }\n }\n }\n if (openCount !== 0) console.error(`${query} not closed: \"${css}\"`)\n }\n return queries\n}\n\n/** Trims whitespace for every line */\nfunction trim(css: string) {\n return css\n .split('\\n')\n .map((l) => l.trim())\n .filter((l) => l)\n .join('\\n')\n}\n\n/**\n * Assemble a string from a template string array and a list of placeholders.\n *\n * - If the first argument is a string, it is returned as is.\n *\n * i.e.\n * myFoo(...props: TemplateStringProps) => {\n * const inputStr = t2s(...props);\n * }\n * myFoo`hello ${name}` => 'hello world'\n * myFoo(`hello ${name}`) => 'hello world'\n */\nexport function t2s(...tsp: TemplateStringProps) {\n const [s, ...p] = tsp\n return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')\n}\nexport type TemplateStringProps = [strings: TemplateStringsArray | string, ...placeHolders: string[]]\n\n/**\n * Injects css to the page\n *\n * - Batches adds for performance\n *\n * @param css - css to be injected\n * @returns void\n */\nexport function addCss(css: string) {\n addCss.que.add(css)\n setTimeout(() => {\n const css = [...addCss.que].join('\\n')\n if (css) {\n addCss.que.clear()\n const s = document.createElement('style')\n s.id = `u${addCss.count++}`\n s.innerHTML = css\n document.head.appendChild(s)\n }\n }, 0)\n}\naddCss.que = new Set<string>()\naddCss.count = 0\n\n/**\n * Injects css and creates unique class names\n *\n * - Skips if already added\n *\n * @param css - string or template string, to be injected\n * @returns a unique class name\n */\nexport function createClass(...p: TemplateStringProps) {\n let css = t2s(...p)\n if (!css) return ''\n let className = createClass.history.get(css)\n if (!className) {\n className = 's' + createClass.count++\n createClass.history.set(css, className)\n\n css = deleteComments(css)\n css = expandProps(css)\n css = expandArrayValues(css)\n const qs = findQueries(css)\n\n for (let q of qs.reverse()) {\n css = css.slice(0, q.start) + css.slice(q.end)\n }\n\n css = `.${className}{\\n${css}\\n}\\n`\n css += qs\n .map((q) => {\n if (q.query.startsWith('&')) {\n return `.${className}${q.query.slice(1)}{\\n${q.innerBody}\\n}`\n }\n if (q.query.startsWith('@keyframes')) {\n return q.outerBody\n }\n return `${q.query}{\\n.${className}{${q.innerBody}\\n}\\n}`\n })\n .join('\\n')\n\n css = trim(css) + '\\n\\n'\n\n addCss(css)\n }\n return className\n}\ncreateClass.count = 0\ncreateClass.history = new Map<string, string>()\n"],"mappings":"yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,YAAAE,EAAA,cAAAC,EAAA,gBAAAC,EAAA,mBAAAC,EAAA,sBAAAC,EAAA,QAAAC,IAAA,eAAAC,EAAAR,GACA,IAAMS,EAAc,CAAC,OAAQ,OAAQ,OAAQ,OAAQ,MAAM,EAGpD,SAASN,KAAaO,EAAgB,CAC3C,OAAOA,EAAQ,OAAQC,GAAMA,GAAK,OAAOA,GAAM,QAAQ,EAAE,KAAK,GAAG,CACnE,CAGA,SAASC,EAAeC,EAAa,CACnC,OAAOA,EAAI,QAAQ,gCAAiC,EAAE,CACxD,CAOA,SAASC,EAAkBD,EAAa,CACtC,OAAKA,EAAI,SAAS,GAAG,EACdA,EACJ,MAAM;AAAA,CAAI,EACV,IAAKE,GAAM,CAtBhB,IAAAC,EAuBM,GAAM,CAACC,EAAGC,EAAMC,CAAI,GAAIH,EAAA,CAAC,GAAGD,EAAE,SAAS,iCAAiC,CAAC,EAAI,KAArD,KAAAC,EAA2D,CAAC,EACpF,OAAIG,EACKA,EACJ,MAAM,GAAG,EACT,IAAI,CAACC,EAAKC,KACTD,EAAMA,EAAI,KAAK,EACX,CAACA,GAAOA,IAAQ,QAAUA,IAAQ,YAAoB,GACtDC,IAAM,EACD,GAAGH,MAASE,KAEd,sBAAsBX,EAAYY,EAAI,SAASH,MAASE,OAChE,EACA,KAAK;AAAA,CAAI,EAEPL,CACT,CAAC,EACA,KAAK;AAAA,CAAI,EApBmBF,CAqBjC,CAkEO,IAAMP,EAA2F,CACtG,GAAI,cACJ,EAAG,SACH,GAAI,gBACJ,GAAI,aACJ,EAAG,QACH,EAAG,UACH,EAAG,OACH,GAAI,iBACJ,EAAG,QACH,EAAG,SACH,GAAI,kBACJ,EAAG,SACH,GAAI,cACJ,GAAI,eACJ,GAAI,aACJ,GAAI,gBACJ,KAAM,YACN,KAAM,YACN,EAAG,UACH,GAAI,eACJ,GAAI,gBACJ,GAAI,cACJ,GAAI,iBACJ,IAAK,WACL,GAAI,aACJ,EAAG,QACH,EAAG,SACL,EACaD,EAAiB,CAAC,GAAG,OAAO,KAAKC,CAAiB,EAAG,KAAM,KAAM,KAAM,IAAI,EAGxF,SAASgB,EAAYT,EAAa,CAChC,OAAAA,EAAM;AAAA,EAAOA,EAEbA,EAAMA,EAAI,QAAQ,mBAAoB;AAAA,OAAiB,EAAE,QAAQ,oBAAqB;AAAA,OAAiB,EACvG,OAAO,QAAQP,CAAiB,EAAE,QAAQ,CAAC,CAACiB,EAAGC,CAAC,IAAM,CACpDX,EAAMA,EAAI,QAAQ,IAAI,OAAO;AAAA,MAAaU,KAAM,GAAG,EAAG,KAAKC,IAAI,CACjE,CAAC,EACMX,EAAI,KAAK,CAClB,CAGA,SAASY,EAAYZ,EAAa,CAChC,IAAMa,EAAU,CAAC,EACjB,QAASC,KAAKd,EAAI,SAAS,QAAQ,EAAG,CACpC,IAAIe,EAAQ,GACRC,EAAY,EACZC,EAAY,EAChB,QAAS,EAAIH,EAAE,MAAQ,EAAId,EAAI,OAAQ,IACrC,GAAIA,EAAI,KAAO,IACTiB,IAAc,IAChBF,EAAQf,EAAI,MAAMc,EAAE,MAAO,CAAC,EAAE,KAAK,EACnCE,EAAY,EAAI,GAElBC,YACSjB,EAAI,KAAO,MACpBiB,IACIA,IAAc,GAAG,CACnBJ,EAAQ,KAAK,CACX,MAAOC,EAAE,MACT,IAAK,EAAI,EACT,MAAAC,EACA,UAAWf,EAAI,MAAMc,EAAE,MAAO,EAAI,CAAC,EACnC,UAAWd,EAAI,MAAMgB,EAAW,CAAC,CACnC,CAAC,EACD,KACF,CAGAC,IAAc,GAAG,QAAQ,MAAM,GAAGF,kBAAsBf,IAAM,CACpE,CACA,OAAOa,CACT,CAGA,SAASK,EAAKlB,EAAa,CACzB,OAAOA,EACJ,MAAM;AAAA,CAAI,EACV,IAAKE,GAAMA,EAAE,KAAK,CAAC,EACnB,OAAQA,GAAMA,CAAC,EACf,KAAK;AAAA,CAAI,CACd,CAcO,SAASR,KAAOyB,EAA0B,CAC/C,GAAM,CAACC,KAAMC,CAAC,EAAIF,EAClB,OAAO,OAAOC,GAAM,SAAWA,EAAIA,EAAE,IAAI,CAACA,EAAGZ,IAAG,CA5MlD,IAAAL,EA4MqD,OAAAiB,IAAKjB,EAAAkB,GAAA,YAAAA,EAAIb,KAAJ,KAAAL,EAAU,IAAG,EAAE,KAAK,EAAE,CAChF,CAWO,SAASd,EAAOW,EAAa,CAClCX,EAAO,IAAI,IAAIW,CAAG,EAClB,WAAW,IAAM,CACf,IAAMA,EAAM,CAAC,GAAGX,EAAO,GAAG,EAAE,KAAK;AAAA,CAAI,EACrC,GAAIW,EAAK,CACPX,EAAO,IAAI,MAAM,EACjB,IAAM+B,EAAI,SAAS,cAAc,OAAO,EACxCA,EAAE,GAAK,IAAI/B,EAAO,UAClB+B,EAAE,UAAYpB,EACd,SAAS,KAAK,YAAYoB,CAAC,CAC7B,CACF,EAAG,CAAC,CACN,CACA/B,EAAO,IAAM,IAAI,IACjBA,EAAO,MAAQ,EAUR,SAASE,KAAe8B,EAAwB,CACrD,IAAIrB,EAAMN,EAAI,GAAG2B,CAAC,EAClB,GAAI,CAACrB,EAAK,MAAO,GACjB,IAAIsB,EAAY/B,EAAY,QAAQ,IAAIS,CAAG,EAC3C,GAAI,CAACsB,EAAW,CACdA,EAAY,IAAM/B,EAAY,QAC9BA,EAAY,QAAQ,IAAIS,EAAKsB,CAAS,EAEtCtB,EAAMD,EAAeC,CAAG,EACxBA,EAAMS,EAAYT,CAAG,EACrBA,EAAMC,EAAkBD,CAAG,EAC3B,IAAMuB,EAAKX,EAAYZ,CAAG,EAE1B,QAASwB,KAAKD,EAAG,QAAQ,EACvBvB,EAAMA,EAAI,MAAM,EAAGwB,EAAE,KAAK,EAAIxB,EAAI,MAAMwB,EAAE,GAAG,EAG/CxB,EAAM,IAAIsB;AAAA,EAAetB;AAAA;AAAA,EACzBA,GAAOuB,EACJ,IAAKC,GACAA,EAAE,MAAM,WAAW,GAAG,EACjB,IAAIF,IAAYE,EAAE,MAAM,MAAM,CAAC;AAAA,EAAOA,EAAE;AAAA,GAE7CA,EAAE,MAAM,WAAW,YAAY,EAC1BA,EAAE,UAEJ,GAAGA,EAAE;AAAA,GAAYF,KAAaE,EAAE;AAAA;AAAA,EACxC,EACA,KAAK;AAAA,CAAI,EAEZxB,EAAMkB,EAAKlB,CAAG,EAAI;AAAA;AAAA,EAElBX,EAAOW,CAAG,CACZ,CACA,OAAOsB,CACT,CACA/B,EAAY,MAAQ,EACpBA,EAAY,QAAU,IAAI","names":["core_exports","__export","addCss","classJoin","createClass","shorthandProps","shorthandPropsMap","t2s","__toCommonJS","breakPoints","classes","c","deleteComments","css","expandArrayValues","l","_a","_","prop","vals","val","i","expandProps","k","v","findQueries","queries","m","query","bodyStart","openCount","trim","tsp","s","p","className","qs","q"]}
1
+ {"version":3,"sources":["core.ts"],"sourcesContent":["/** Breakpoints like chakra */\nexport const breakPoints = ['30em', '48em', '62em', '80em', '96em']\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype allowableAny = any\n\n/** Joins class names and filters out blanks */\nexport function classJoin(...classes: allowableAny[]) {\n return classes.filter(c => c && typeof c === 'string').join(' ')\n}\n\n/** delete css comments **/\nfunction deleteComments(css: string) {\n return css.replace(/{\\/\\*[\\s\\S]*?(?=\\*\\/})\\*\\/}/gm, '')\n}\n\n/**\n * Expands array values into media queries\n *\n * Inspired by https://chakra-ui.com/docs/styled-system/responsive-styles\n */\nfunction expandArrayValues(css: string) {\n if (!css.includes('[')) return css\n return css\n .split('\\n')\n .map(l => {\n // eslint-disable-next-line no-useless-escape\n const [, prop, vals] = [...l.matchAll(/([A-Za-z\\-]*):[ ]*\\[([^\\]]+)\\]/g)]?.[0] ?? []\n if (vals) {\n return vals\n .split(',')\n .map((val, i) => {\n val = val.trim()\n if (!val || val === 'null' || val === 'undefined') return ''\n if (i === 0) {\n return `${prop}: ${val};`\n }\n return `@media (min-width: ${breakPoints[i - 1]}) { ${prop}: ${val}; }`\n })\n .join('\\n')\n }\n return l\n })\n .join('\\n')\n}\n\nexport interface ShorthandProps {\n /** shorthand for css:align-items */\n ai?: string\n /** shorthand for css:border */\n b?: string | number\n /** shorthand for css:border-radius */\n br?: string | number\n /** shorthand for css:background */\n bg?: string\n /** shorthand for css:color */\n c?: string\n /** shorthand for css:display */\n d?: string\n /** shorthand for css:flex */\n f?: string\n /** shorthand for css:flex-direction */\n fd?: string\n /** shorthand for css:height */\n h?: number | string\n /** shorthand for css:inset */\n i?: number | string\n /** shorthand for css:justify-content */\n jc?: string\n /** shorthand for css:margin */\n m?: number | string\n /** shorthand for css:margin-left */\n ml?: number | string\n /** shorthand for css:margin-right */\n mr?: number | string\n /** shorthand for css:margin-top */\n mt?: number | string\n /** shorthand for css:margin-bottom */\n mb?: number | string\n /** shorthand for css:margin-top & margin-bottom */\n my?: number | string\n /** shorthand for css:margin-left & margin-right */\n mx?: number | string\n /** shorthand for css:max-width */\n maxW?: number | string\n /** shorthand for css:min-width */\n minW?: number | string\n /** shorthand for css:padding */\n p?: number | string\n /** shorthand for css:padding-left */\n pl?: number | string\n /** shorthand for css:padding-right */\n pr?: number | string\n /** shorthand for css:padding-top */\n pt?: number | string\n /** shorthand for css:padding-bottom */\n pb?: number | string\n /** shorthand for css:padding-top & padding-bottom */\n py?: number | string\n /** shorthand for css:padding-left & padding-right */\n px?: number | string\n /** shorthand for css:position */\n pos?: number | string\n /** shorthand for css:text-align */\n ta?: string\n /** shorthand for css:width */\n w?: number | string\n /** shorthand for css:z-index */\n z?: number | string\n}\nexport const shorthandPropsMap: Record<\n keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>,\n string\n> = {\n ai: 'align-items',\n b: 'border',\n br: 'border-radius',\n bg: 'background',\n c: 'color',\n d: 'display',\n f: 'flex',\n fd: 'flex-direction',\n i: 'inset',\n h: 'height',\n jc: 'justify-content',\n m: 'margin',\n ml: 'margin-left',\n mr: 'margin-right',\n mt: 'margin-top',\n mb: 'margin-bottom',\n maxW: 'max-width',\n minW: 'min-width',\n p: 'padding',\n pl: 'padding-left',\n pr: 'padding-right',\n pt: 'padding-top',\n pb: 'padding-bottom',\n pos: 'position',\n ta: 'text-align',\n w: 'width',\n z: 'z-index',\n}\nexport const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'px', 'py']\n\n/** Expand short-hand css props to full */\nfunction expandProps(css: string) {\n css = '\\n' + css // inject a newline to make the regex easier\n // Handle 'mx', 'my', 'px', 'py'\n css = css\n .replace(/([mp])x:([^;]*)/g, '$1l:$2;\\n$1r:$2')\n .replace(/([mp])y:([^;]*);/g, '$1t:$2;\\n$1b:$2')\n Object.entries(shorthandPropsMap).forEach(([k, v]) => {\n css = css.replace(new RegExp(`([ \\n\\t;])${k}:`, 'g'), `$1${v}:`)\n })\n return css.trim()\n}\n\n/** Find @keyframes, @media, @container queries in css **/\nfunction findQueries(css: string) {\n const queries = []\n for (const m of css.matchAll(/[@&]/gm)) {\n let query = ''\n let bodyStart = 0\n let openCount = 0\n for (let i = m.index!; i < css.length; i++) {\n if (css[i] === '{') {\n if (openCount === 0) {\n query = css.slice(m.index, i).trim()\n bodyStart = i + 1\n }\n openCount++\n } else if (css[i] === '}') {\n openCount--\n if (openCount === 0) {\n queries.push({\n start: m.index,\n end: i + 1,\n query,\n outerBody: css.slice(m.index, i + 1),\n innerBody: css.slice(bodyStart, i),\n })\n break\n }\n }\n }\n if (openCount !== 0) console.error(`${query} not closed: \"${css}\"`)\n }\n return queries\n}\n\n/** Trims whitespace for every line */\nfunction trim(css: string) {\n return css\n .split('\\n')\n .map(l => l.trim())\n .filter(l => l)\n .join('\\n')\n}\n\n/**\n * Assemble a string from a template string array and a list of placeholders.\n *\n * - If the first argument is a string, it is returned as is.\n *\n * i.e.\n * myFoo(...props: TemplateStringProps) => {\n * const inputStr = t2s(...props);\n * }\n * myFoo`hello ${name}` => 'hello world'\n * myFoo(`hello ${name}`) => 'hello world'\n */\nexport function t2s(...tsp: TemplateStringProps) {\n const [s, ...p] = tsp\n return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')\n}\nexport type TemplateStringProps = [\n strings: TemplateStringsArray | string,\n ...placeHolders: string[]\n]\n\n/**\n * Injects css to the page\n *\n * - Batches adds for performance\n *\n * @param css - css to be injected\n * @returns void\n */\nexport function addCss(css: string) {\n addCss.que.add(css)\n setTimeout(() => {\n const css = [...addCss.que].join('\\n')\n if (css) {\n addCss.que.clear()\n const s = document.createElement('style')\n s.id = `u${addCss.count++}`\n s.innerHTML = css\n document.head.appendChild(s)\n }\n }, 0)\n}\naddCss.que = new Set<string>()\naddCss.count = 0\n\n/**\n * Injects css and creates unique class names\n *\n * - Skips if already added\n *\n * @param css - string or template string, to be injected\n * @returns a unique class name\n */\nexport function createClass(...p: TemplateStringProps) {\n let css = t2s(...p)\n if (!css) return ''\n let className = createClass.history.get(css)\n if (!className) {\n className = 's' + createClass.count++\n createClass.history.set(css, className)\n\n css = deleteComments(css)\n css = expandProps(css)\n css = expandArrayValues(css)\n const qs = findQueries(css)\n\n for (const q of qs.reverse()) {\n css = css.slice(0, q.start) + css.slice(q.end)\n }\n\n css = `.${className}{\\n${css}\\n}\\n`\n css += qs\n .map(q => {\n if (q.query.startsWith('&')) {\n return `.${className}${q.query.slice(1)}{\\n${q.innerBody}\\n}`\n }\n if (q.query.startsWith('@keyframes')) {\n return q.outerBody\n }\n return `${q.query}{\\n.${className}{${q.innerBody}\\n}\\n}`\n })\n .join('\\n')\n\n css = trim(css) + '\\n\\n'\n\n addCss(css)\n }\n return className\n}\ncreateClass.count = 0\ncreateClass.history = new Map<string, string>()\n"],"mappings":"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","names":["core_exports","__export","addCss","breakPoints","classJoin","createClass","shorthandProps","shorthandPropsMap","t2s","__toCommonJS","classes","c","deleteComments","css","expandArrayValues","l","_a","prop","vals","val","i","expandProps","k","v","findQueries","queries","m","query","bodyStart","openCount","trim","tsp","s","p","className","qs","q"]}
package/src/core.d.ts CHANGED
@@ -1,5 +1,8 @@
1
+ /** Breakpoints like chakra */
2
+ declare const breakPoints: string[];
3
+ type allowableAny = any;
1
4
  /** Joins class names and filters out blanks */
2
- declare function classJoin(...classes: any[]): string;
5
+ declare function classJoin(...classes: allowableAny[]): string;
3
6
  interface ShorthandProps {
4
7
  /** shorthand for css:align-items */
5
8
  ai?: string;
@@ -79,7 +82,10 @@ declare const shorthandProps: string[];
79
82
  * myFoo(`hello ${name}`) => 'hello world'
80
83
  */
81
84
  declare function t2s(...tsp: TemplateStringProps): string;
82
- type TemplateStringProps = [strings: TemplateStringsArray | string, ...placeHolders: string[]];
85
+ type TemplateStringProps = [
86
+ strings: TemplateStringsArray | string,
87
+ ...placeHolders: string[]
88
+ ];
83
89
  /**
84
90
  * Injects css to the page
85
91
  *
@@ -107,4 +113,4 @@ declare namespace createClass {
107
113
  var history: Map<string, string>;
108
114
  }
109
115
 
110
- export { ShorthandProps, TemplateStringProps, addCss, classJoin, createClass, shorthandProps, shorthandPropsMap, t2s };
116
+ export { ShorthandProps, TemplateStringProps, addCss, breakPoints, classJoin, createClass, shorthandProps, shorthandPropsMap, t2s };
package/src/core.js CHANGED
@@ -1,23 +1,23 @@
1
- var a=["30em","48em","62em","80em","96em"];function h(...r){return r.filter(n=>n&&typeof n=="string").join(" ")}function d(r){return r.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm,"")}function l(r){return r.includes("[")?r.split(`
2
- `).map(n=>{var s;let[t,o,e]=(s=[...n.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)][0])!=null?s:[];return e?e.split(",").map((i,g)=>(i=i.trim(),!i||i==="null"||i==="undefined"?"":g===0?`${o}: ${i};`:`@media (min-width: ${a[g-1]}) { ${o}: ${i}; }`)).join(`
1
+ var p=["30em","48em","62em","80em","96em"];function y(...r){return r.filter(n=>n&&typeof n=="string").join(" ")}function a(r){return r.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm,"")}function d(r){return r.includes("[")?r.split(`
2
+ `).map(n=>{var e;let[,t,s]=(e=[...n.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)][0])!=null?e:[];return s?s.split(",").map((i,o)=>(i=i.trim(),!i||i==="null"||i==="undefined"?"":o===0?`${t}: ${i};`:`@media (min-width: ${p[o-1]}) { ${t}: ${i}; }`)).join(`
3
3
  `):n}).join(`
4
- `):r}var p={ai:"align-items",b:"border",br:"border-radius",bg:"background",c:"color",d:"display",f:"flex",fd:"flex-direction",i:"inset",h:"height",jc:"justify-content",m:"margin",ml:"margin-left",mr:"margin-right",mt:"margin-top",mb:"margin-bottom",maxW:"max-width",minW:"min-width",p:"padding",pl:"padding-left",pr:"padding-right",pt:"padding-top",pb:"padding-bottom",pos:"position",ta:"text-align",w:"width",z:"z-index"},x=[...Object.keys(p),"mx","my","px","py"];function f(r){return r=`
4
+ `):r}var g={ai:"align-items",b:"border",br:"border-radius",bg:"background",c:"color",d:"display",f:"flex",fd:"flex-direction",i:"inset",h:"height",jc:"justify-content",m:"margin",ml:"margin-left",mr:"margin-right",mt:"margin-top",mb:"margin-bottom",maxW:"max-width",minW:"min-width",p:"padding",pl:"padding-left",pr:"padding-right",pt:"padding-top",pb:"padding-bottom",pos:"position",ta:"text-align",w:"width",z:"z-index"},h=[...Object.keys(g),"mx","my","px","py"];function l(r){return r=`
5
5
  `+r,r=r.replace(/([mp])x:([^;]*)/g,`$1l:$2;
6
6
  $1r:$2`).replace(/([mp])y:([^;]*);/g,`$1t:$2;
7
- $1b:$2`),Object.entries(p).forEach(([n,t])=>{r=r.replace(new RegExp(`([
8
- ;])${n}:`,"g"),`$1${t}:`)}),r.trim()}function b(r){let n=[];for(let t of r.matchAll(/[@&]/gm)){let o="",e=0,s=0;for(let i=t.index;i<r.length;i++)if(r[i]==="{")s===0&&(o=r.slice(t.index,i).trim(),e=i+1),s++;else if(r[i]==="}"&&(s--,s===0)){n.push({start:t.index,end:i+1,query:o,outerBody:r.slice(t.index,i+1),innerBody:r.slice(e,i)});break}s!==0&&console.error(`${o} not closed: "${r}"`)}return n}function c(r){return r.split(`
7
+ $1b:$2`),Object.entries(g).forEach(([n,t])=>{r=r.replace(new RegExp(`([
8
+ ;])${n}:`,"g"),`$1${t}:`)}),r.trim()}function f(r){let n=[];for(let t of r.matchAll(/[@&]/gm)){let s="",e=0,i=0;for(let o=t.index;o<r.length;o++)if(r[o]==="{")i===0&&(s=r.slice(t.index,o).trim(),e=o+1),i++;else if(r[o]==="}"&&(i--,i===0)){n.push({start:t.index,end:o+1,query:s,outerBody:r.slice(t.index,o+1),innerBody:r.slice(e,o)});break}i!==0&&console.error(`${s} not closed: "${r}"`)}return n}function b(r){return r.split(`
9
9
  `).map(n=>n.trim()).filter(n=>n).join(`
10
- `)}function y(...r){let[n,...t]=r;return typeof n=="string"?n:n.map((o,e)=>{var s;return o+((s=t==null?void 0:t[e])!=null?s:"")}).join("")}function m(r){m.que.add(r),setTimeout(()=>{let n=[...m.que].join(`
11
- `);if(n){m.que.clear();let t=document.createElement("style");t.id=`u${m.count++}`,t.innerHTML=n,document.head.appendChild(t)}},0)}m.que=new Set;m.count=0;function u(...r){let n=y(...r);if(!n)return"";let t=u.history.get(n);if(!t){t="s"+u.count++,u.history.set(n,t),n=d(n),n=f(n),n=l(n);let o=b(n);for(let e of o.reverse())n=n.slice(0,e.start)+n.slice(e.end);n=`.${t}{
10
+ `)}function c(...r){let[n,...t]=r;return typeof n=="string"?n:n.map((s,e)=>{var i;return s+((i=t==null?void 0:t[e])!=null?i:"")}).join("")}function m(r){m.que.add(r),setTimeout(()=>{let n=[...m.que].join(`
11
+ `);if(n){m.que.clear();let t=document.createElement("style");t.id=`u${m.count++}`,t.innerHTML=n,document.head.appendChild(t)}},0)}m.que=new Set;m.count=0;function u(...r){let n=c(...r);if(!n)return"";let t=u.history.get(n);if(!t){t="s"+u.count++,u.history.set(n,t),n=a(n),n=l(n),n=d(n);let s=f(n);for(let e of s.reverse())n=n.slice(0,e.start)+n.slice(e.end);n=`.${t}{
12
12
  ${n}
13
13
  }
14
- `,n+=o.map(e=>e.query.startsWith("&")?`.${t}${e.query.slice(1)}{
14
+ `,n+=s.map(e=>e.query.startsWith("&")?`.${t}${e.query.slice(1)}{
15
15
  ${e.innerBody}
16
16
  }`:e.query.startsWith("@keyframes")?e.outerBody:`${e.query}{
17
17
  .${t}{${e.innerBody}
18
18
  }
19
19
  }`).join(`
20
- `),n=c(n)+`
20
+ `),n=b(n)+`
21
21
 
22
- `,m(n)}return t}u.count=0;u.history=new Map;export{m as addCss,h as classJoin,u as createClass,x as shorthandProps,p as shorthandPropsMap,y as t2s};
22
+ `,m(n)}return t}u.count=0;u.history=new Map;export{m as addCss,p as breakPoints,y as classJoin,u as createClass,h as shorthandProps,g as shorthandPropsMap,c as t2s};
23
23
  //# sourceMappingURL=core.js.map
package/src/core.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["core.ts"],"sourcesContent":["/** Breakpoints like chakra */\nconst breakPoints = ['30em', '48em', '62em', '80em', '96em']\n\n/** Joins class names and filters out blanks */\nexport function classJoin(...classes: any[]) {\n return classes.filter((c) => c && typeof c === 'string').join(' ')\n}\n\n// delete css comments i.e. {/* blah */}\nfunction deleteComments(css: string) {\n return css.replace(/{\\/\\*[\\s\\S]*?(?=\\*\\/})\\*\\/}/gm, '')\n}\n\n/**\n * Expands array values into media queries\n *\n * Inspired by https://chakra-ui.com/docs/styled-system/responsive-styles\n */\nfunction expandArrayValues(css: string) {\n if (!css.includes('[')) return css\n return css\n .split('\\n')\n .map((l) => {\n const [_, prop, vals] = [...l.matchAll(/([A-Za-z\\-]*):[ ]*\\[([^\\]]+)\\]/g)]?.[0] ?? []\n if (vals) {\n return vals\n .split(',')\n .map((val, i) => {\n val = val.trim()\n if (!val || val === 'null' || val === 'undefined') return ''\n if (i === 0) {\n return `${prop}: ${val};`\n }\n return `@media (min-width: ${breakPoints[i - 1]}) { ${prop}: ${val}; }`\n })\n .join('\\n')\n }\n return l\n })\n .join('\\n')\n}\n\nexport interface ShorthandProps {\n /** shorthand for css:align-items */\n ai?: string\n /** shorthand for css:border */\n b?: string | number\n /** shorthand for css:border-radius */\n br?: string | number\n /** shorthand for css:background */\n bg?: string\n /** shorthand for css:color */\n c?: string\n /** shorthand for css:display */\n d?: string\n /** shorthand for css:flex */\n f?: string\n /** shorthand for css:flex-direction */\n fd?: string\n /** shorthand for css:height */\n h?: number | string\n /** shorthand for css:inset */\n i?: number | string\n /** shorthand for css:justify-content */\n jc?: string\n /** shorthand for css:margin */\n m?: number | string\n /** shorthand for css:margin-left */\n ml?: number | string\n /** shorthand for css:margin-right */\n mr?: number | string\n /** shorthand for css:margin-top */\n mt?: number | string\n /** shorthand for css:margin-bottom */\n mb?: number | string\n /** shorthand for css:margin-top & margin-bottom */\n my?: number | string\n /** shorthand for css:margin-left & margin-right */\n mx?: number | string\n /** shorthand for css:max-width */\n maxW?: number | string\n /** shorthand for css:min-width */\n minW?: number | string\n /** shorthand for css:padding */\n p?: number | string\n /** shorthand for css:padding-left */\n pl?: number | string\n /** shorthand for css:padding-right */\n pr?: number | string\n /** shorthand for css:padding-top */\n pt?: number | string\n /** shorthand for css:padding-bottom */\n pb?: number | string\n /** shorthand for css:padding-top & padding-bottom */\n py?: number | string\n /** shorthand for css:padding-left & padding-right */\n px?: number | string\n /** shorthand for css:position */\n pos?: number | string\n /** shorthand for css:text-align */\n ta?: string\n /** shorthand for css:width */\n w?: number | string\n /** shorthand for css:z-index */\n z?: number | string\n}\nexport const shorthandPropsMap: Record<keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>, string> = {\n ai: 'align-items',\n b: 'border',\n br: 'border-radius',\n bg: 'background',\n c: 'color',\n d: 'display',\n f: 'flex',\n fd: 'flex-direction',\n i: 'inset',\n h: 'height',\n jc: 'justify-content',\n m: 'margin',\n ml: 'margin-left',\n mr: 'margin-right',\n mt: 'margin-top',\n mb: 'margin-bottom',\n maxW: 'max-width',\n minW: 'min-width',\n p: 'padding',\n pl: 'padding-left',\n pr: 'padding-right',\n pt: 'padding-top',\n pb: 'padding-bottom',\n pos: 'position',\n ta: 'text-align',\n w: 'width',\n z: 'z-index',\n}\nexport const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'px', 'py']\n\n/** Expand short-hand css props to full */\nfunction expandProps(css: string) {\n css = '\\n' + css // inject a newline to make the regex easier\n // Handle 'mx', 'my', 'px', 'py'\n css = css.replace(/([mp])x:([^;]*)/g, '$1l:$2;\\n$1r:$2').replace(/([mp])y:([^;]*);/g, '$1t:$2;\\n$1b:$2')\n Object.entries(shorthandPropsMap).forEach(([k, v]) => {\n css = css.replace(new RegExp(`([ \\n\\t;])${k}:`, 'g'), `$1${v}:`)\n })\n return css.trim()\n}\n\n/** Find @keyframes, @media, @container queries in css **/\nfunction findQueries(css: string) {\n const queries = []\n for (let m of css.matchAll(/[@&]/gm)) {\n let query = ''\n let bodyStart = 0\n let openCount = 0\n for (let i = m.index!; i < css.length; i++) {\n if (css[i] === '{') {\n if (openCount === 0) {\n query = css.slice(m.index, i).trim()\n bodyStart = i + 1\n }\n openCount++\n } else if (css[i] === '}') {\n openCount--\n if (openCount === 0) {\n queries.push({\n start: m.index,\n end: i + 1,\n query,\n outerBody: css.slice(m.index, i + 1),\n innerBody: css.slice(bodyStart, i),\n })\n break\n }\n }\n }\n if (openCount !== 0) console.error(`${query} not closed: \"${css}\"`)\n }\n return queries\n}\n\n/** Trims whitespace for every line */\nfunction trim(css: string) {\n return css\n .split('\\n')\n .map((l) => l.trim())\n .filter((l) => l)\n .join('\\n')\n}\n\n/**\n * Assemble a string from a template string array and a list of placeholders.\n *\n * - If the first argument is a string, it is returned as is.\n *\n * i.e.\n * myFoo(...props: TemplateStringProps) => {\n * const inputStr = t2s(...props);\n * }\n * myFoo`hello ${name}` => 'hello world'\n * myFoo(`hello ${name}`) => 'hello world'\n */\nexport function t2s(...tsp: TemplateStringProps) {\n const [s, ...p] = tsp\n return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')\n}\nexport type TemplateStringProps = [strings: TemplateStringsArray | string, ...placeHolders: string[]]\n\n/**\n * Injects css to the page\n *\n * - Batches adds for performance\n *\n * @param css - css to be injected\n * @returns void\n */\nexport function addCss(css: string) {\n addCss.que.add(css)\n setTimeout(() => {\n const css = [...addCss.que].join('\\n')\n if (css) {\n addCss.que.clear()\n const s = document.createElement('style')\n s.id = `u${addCss.count++}`\n s.innerHTML = css\n document.head.appendChild(s)\n }\n }, 0)\n}\naddCss.que = new Set<string>()\naddCss.count = 0\n\n/**\n * Injects css and creates unique class names\n *\n * - Skips if already added\n *\n * @param css - string or template string, to be injected\n * @returns a unique class name\n */\nexport function createClass(...p: TemplateStringProps) {\n let css = t2s(...p)\n if (!css) return ''\n let className = createClass.history.get(css)\n if (!className) {\n className = 's' + createClass.count++\n createClass.history.set(css, className)\n\n css = deleteComments(css)\n css = expandProps(css)\n css = expandArrayValues(css)\n const qs = findQueries(css)\n\n for (let q of qs.reverse()) {\n css = css.slice(0, q.start) + css.slice(q.end)\n }\n\n css = `.${className}{\\n${css}\\n}\\n`\n css += qs\n .map((q) => {\n if (q.query.startsWith('&')) {\n return `.${className}${q.query.slice(1)}{\\n${q.innerBody}\\n}`\n }\n if (q.query.startsWith('@keyframes')) {\n return q.outerBody\n }\n return `${q.query}{\\n.${className}{${q.innerBody}\\n}\\n}`\n })\n .join('\\n')\n\n css = trim(css) + '\\n\\n'\n\n addCss(css)\n }\n return className\n}\ncreateClass.count = 0\ncreateClass.history = new Map<string, string>()\n"],"mappings":"AACA,IAAMA,EAAc,CAAC,OAAQ,OAAQ,OAAQ,OAAQ,MAAM,EAGpD,SAASC,KAAaC,EAAgB,CAC3C,OAAOA,EAAQ,OAAQC,GAAMA,GAAK,OAAOA,GAAM,QAAQ,EAAE,KAAK,GAAG,CACnE,CAGA,SAASC,EAAeC,EAAa,CACnC,OAAOA,EAAI,QAAQ,gCAAiC,EAAE,CACxD,CAOA,SAASC,EAAkBD,EAAa,CACtC,OAAKA,EAAI,SAAS,GAAG,EACdA,EACJ,MAAM;AAAA,CAAI,EACV,IAAKE,GAAM,CAtBhB,IAAAC,EAuBM,GAAM,CAACC,EAAGC,EAAMC,CAAI,GAAIH,EAAA,CAAC,GAAGD,EAAE,SAAS,iCAAiC,CAAC,EAAI,KAArD,KAAAC,EAA2D,CAAC,EACpF,OAAIG,EACKA,EACJ,MAAM,GAAG,EACT,IAAI,CAACC,EAAKC,KACTD,EAAMA,EAAI,KAAK,EACX,CAACA,GAAOA,IAAQ,QAAUA,IAAQ,YAAoB,GACtDC,IAAM,EACD,GAAGH,MAASE,KAEd,sBAAsBZ,EAAYa,EAAI,SAASH,MAASE,OAChE,EACA,KAAK;AAAA,CAAI,EAEPL,CACT,CAAC,EACA,KAAK;AAAA,CAAI,EApBmBF,CAqBjC,CAkEO,IAAMS,EAA2F,CACtG,GAAI,cACJ,EAAG,SACH,GAAI,gBACJ,GAAI,aACJ,EAAG,QACH,EAAG,UACH,EAAG,OACH,GAAI,iBACJ,EAAG,QACH,EAAG,SACH,GAAI,kBACJ,EAAG,SACH,GAAI,cACJ,GAAI,eACJ,GAAI,aACJ,GAAI,gBACJ,KAAM,YACN,KAAM,YACN,EAAG,UACH,GAAI,eACJ,GAAI,gBACJ,GAAI,cACJ,GAAI,iBACJ,IAAK,WACL,GAAI,aACJ,EAAG,QACH,EAAG,SACL,EACaC,EAAiB,CAAC,GAAG,OAAO,KAAKD,CAAiB,EAAG,KAAM,KAAM,KAAM,IAAI,EAGxF,SAASE,EAAYX,EAAa,CAChC,OAAAA,EAAM;AAAA,EAAOA,EAEbA,EAAMA,EAAI,QAAQ,mBAAoB;AAAA,OAAiB,EAAE,QAAQ,oBAAqB;AAAA,OAAiB,EACvG,OAAO,QAAQS,CAAiB,EAAE,QAAQ,CAAC,CAACG,EAAGC,CAAC,IAAM,CACpDb,EAAMA,EAAI,QAAQ,IAAI,OAAO;AAAA,MAAaY,KAAM,GAAG,EAAG,KAAKC,IAAI,CACjE,CAAC,EACMb,EAAI,KAAK,CAClB,CAGA,SAASc,EAAYd,EAAa,CAChC,IAAMe,EAAU,CAAC,EACjB,QAASC,KAAKhB,EAAI,SAAS,QAAQ,EAAG,CACpC,IAAIiB,EAAQ,GACRC,EAAY,EACZC,EAAY,EAChB,QAAS,EAAIH,EAAE,MAAQ,EAAIhB,EAAI,OAAQ,IACrC,GAAIA,EAAI,KAAO,IACTmB,IAAc,IAChBF,EAAQjB,EAAI,MAAMgB,EAAE,MAAO,CAAC,EAAE,KAAK,EACnCE,EAAY,EAAI,GAElBC,YACSnB,EAAI,KAAO,MACpBmB,IACIA,IAAc,GAAG,CACnBJ,EAAQ,KAAK,CACX,MAAOC,EAAE,MACT,IAAK,EAAI,EACT,MAAAC,EACA,UAAWjB,EAAI,MAAMgB,EAAE,MAAO,EAAI,CAAC,EACnC,UAAWhB,EAAI,MAAMkB,EAAW,CAAC,CACnC,CAAC,EACD,KACF,CAGAC,IAAc,GAAG,QAAQ,MAAM,GAAGF,kBAAsBjB,IAAM,CACpE,CACA,OAAOe,CACT,CAGA,SAASK,EAAKpB,EAAa,CACzB,OAAOA,EACJ,MAAM;AAAA,CAAI,EACV,IAAKE,GAAMA,EAAE,KAAK,CAAC,EACnB,OAAQA,GAAMA,CAAC,EACf,KAAK;AAAA,CAAI,CACd,CAcO,SAASmB,KAAOC,EAA0B,CAC/C,GAAM,CAACC,KAAMC,CAAC,EAAIF,EAClB,OAAO,OAAOC,GAAM,SAAWA,EAAIA,EAAE,IAAI,CAACA,EAAGf,IAAG,CA5MlD,IAAAL,EA4MqD,OAAAoB,IAAKpB,EAAAqB,GAAA,YAAAA,EAAIhB,KAAJ,KAAAL,EAAU,IAAG,EAAE,KAAK,EAAE,CAChF,CAWO,SAASsB,EAAOzB,EAAa,CAClCyB,EAAO,IAAI,IAAIzB,CAAG,EAClB,WAAW,IAAM,CACf,IAAMA,EAAM,CAAC,GAAGyB,EAAO,GAAG,EAAE,KAAK;AAAA,CAAI,EACrC,GAAIzB,EAAK,CACPyB,EAAO,IAAI,MAAM,EACjB,IAAMF,EAAI,SAAS,cAAc,OAAO,EACxCA,EAAE,GAAK,IAAIE,EAAO,UAClBF,EAAE,UAAYvB,EACd,SAAS,KAAK,YAAYuB,CAAC,CAC7B,CACF,EAAG,CAAC,CACN,CACAE,EAAO,IAAM,IAAI,IACjBA,EAAO,MAAQ,EAUR,SAASC,KAAeF,EAAwB,CACrD,IAAIxB,EAAMqB,EAAI,GAAGG,CAAC,EAClB,GAAI,CAACxB,EAAK,MAAO,GACjB,IAAI2B,EAAYD,EAAY,QAAQ,IAAI1B,CAAG,EAC3C,GAAI,CAAC2B,EAAW,CACdA,EAAY,IAAMD,EAAY,QAC9BA,EAAY,QAAQ,IAAI1B,EAAK2B,CAAS,EAEtC3B,EAAMD,EAAeC,CAAG,EACxBA,EAAMW,EAAYX,CAAG,EACrBA,EAAMC,EAAkBD,CAAG,EAC3B,IAAM4B,EAAKd,EAAYd,CAAG,EAE1B,QAAS6B,KAAKD,EAAG,QAAQ,EACvB5B,EAAMA,EAAI,MAAM,EAAG6B,EAAE,KAAK,EAAI7B,EAAI,MAAM6B,EAAE,GAAG,EAG/C7B,EAAM,IAAI2B;AAAA,EAAe3B;AAAA;AAAA,EACzBA,GAAO4B,EACJ,IAAKC,GACAA,EAAE,MAAM,WAAW,GAAG,EACjB,IAAIF,IAAYE,EAAE,MAAM,MAAM,CAAC;AAAA,EAAOA,EAAE;AAAA,GAE7CA,EAAE,MAAM,WAAW,YAAY,EAC1BA,EAAE,UAEJ,GAAGA,EAAE;AAAA,GAAYF,KAAaE,EAAE;AAAA;AAAA,EACxC,EACA,KAAK;AAAA,CAAI,EAEZ7B,EAAMoB,EAAKpB,CAAG,EAAI;AAAA;AAAA,EAElByB,EAAOzB,CAAG,CACZ,CACA,OAAO2B,CACT,CACAD,EAAY,MAAQ,EACpBA,EAAY,QAAU,IAAI","names":["breakPoints","classJoin","classes","c","deleteComments","css","expandArrayValues","l","_a","_","prop","vals","val","i","shorthandPropsMap","shorthandProps","expandProps","k","v","findQueries","queries","m","query","bodyStart","openCount","trim","t2s","tsp","s","p","addCss","createClass","className","qs","q"]}
1
+ {"version":3,"sources":["core.ts"],"sourcesContent":["/** Breakpoints like chakra */\nexport const breakPoints = ['30em', '48em', '62em', '80em', '96em']\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype allowableAny = any\n\n/** Joins class names and filters out blanks */\nexport function classJoin(...classes: allowableAny[]) {\n return classes.filter(c => c && typeof c === 'string').join(' ')\n}\n\n/** delete css comments **/\nfunction deleteComments(css: string) {\n return css.replace(/{\\/\\*[\\s\\S]*?(?=\\*\\/})\\*\\/}/gm, '')\n}\n\n/**\n * Expands array values into media queries\n *\n * Inspired by https://chakra-ui.com/docs/styled-system/responsive-styles\n */\nfunction expandArrayValues(css: string) {\n if (!css.includes('[')) return css\n return css\n .split('\\n')\n .map(l => {\n // eslint-disable-next-line no-useless-escape\n const [, prop, vals] = [...l.matchAll(/([A-Za-z\\-]*):[ ]*\\[([^\\]]+)\\]/g)]?.[0] ?? []\n if (vals) {\n return vals\n .split(',')\n .map((val, i) => {\n val = val.trim()\n if (!val || val === 'null' || val === 'undefined') return ''\n if (i === 0) {\n return `${prop}: ${val};`\n }\n return `@media (min-width: ${breakPoints[i - 1]}) { ${prop}: ${val}; }`\n })\n .join('\\n')\n }\n return l\n })\n .join('\\n')\n}\n\nexport interface ShorthandProps {\n /** shorthand for css:align-items */\n ai?: string\n /** shorthand for css:border */\n b?: string | number\n /** shorthand for css:border-radius */\n br?: string | number\n /** shorthand for css:background */\n bg?: string\n /** shorthand for css:color */\n c?: string\n /** shorthand for css:display */\n d?: string\n /** shorthand for css:flex */\n f?: string\n /** shorthand for css:flex-direction */\n fd?: string\n /** shorthand for css:height */\n h?: number | string\n /** shorthand for css:inset */\n i?: number | string\n /** shorthand for css:justify-content */\n jc?: string\n /** shorthand for css:margin */\n m?: number | string\n /** shorthand for css:margin-left */\n ml?: number | string\n /** shorthand for css:margin-right */\n mr?: number | string\n /** shorthand for css:margin-top */\n mt?: number | string\n /** shorthand for css:margin-bottom */\n mb?: number | string\n /** shorthand for css:margin-top & margin-bottom */\n my?: number | string\n /** shorthand for css:margin-left & margin-right */\n mx?: number | string\n /** shorthand for css:max-width */\n maxW?: number | string\n /** shorthand for css:min-width */\n minW?: number | string\n /** shorthand for css:padding */\n p?: number | string\n /** shorthand for css:padding-left */\n pl?: number | string\n /** shorthand for css:padding-right */\n pr?: number | string\n /** shorthand for css:padding-top */\n pt?: number | string\n /** shorthand for css:padding-bottom */\n pb?: number | string\n /** shorthand for css:padding-top & padding-bottom */\n py?: number | string\n /** shorthand for css:padding-left & padding-right */\n px?: number | string\n /** shorthand for css:position */\n pos?: number | string\n /** shorthand for css:text-align */\n ta?: string\n /** shorthand for css:width */\n w?: number | string\n /** shorthand for css:z-index */\n z?: number | string\n}\nexport const shorthandPropsMap: Record<\n keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>,\n string\n> = {\n ai: 'align-items',\n b: 'border',\n br: 'border-radius',\n bg: 'background',\n c: 'color',\n d: 'display',\n f: 'flex',\n fd: 'flex-direction',\n i: 'inset',\n h: 'height',\n jc: 'justify-content',\n m: 'margin',\n ml: 'margin-left',\n mr: 'margin-right',\n mt: 'margin-top',\n mb: 'margin-bottom',\n maxW: 'max-width',\n minW: 'min-width',\n p: 'padding',\n pl: 'padding-left',\n pr: 'padding-right',\n pt: 'padding-top',\n pb: 'padding-bottom',\n pos: 'position',\n ta: 'text-align',\n w: 'width',\n z: 'z-index',\n}\nexport const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'px', 'py']\n\n/** Expand short-hand css props to full */\nfunction expandProps(css: string) {\n css = '\\n' + css // inject a newline to make the regex easier\n // Handle 'mx', 'my', 'px', 'py'\n css = css\n .replace(/([mp])x:([^;]*)/g, '$1l:$2;\\n$1r:$2')\n .replace(/([mp])y:([^;]*);/g, '$1t:$2;\\n$1b:$2')\n Object.entries(shorthandPropsMap).forEach(([k, v]) => {\n css = css.replace(new RegExp(`([ \\n\\t;])${k}:`, 'g'), `$1${v}:`)\n })\n return css.trim()\n}\n\n/** Find @keyframes, @media, @container queries in css **/\nfunction findQueries(css: string) {\n const queries = []\n for (const m of css.matchAll(/[@&]/gm)) {\n let query = ''\n let bodyStart = 0\n let openCount = 0\n for (let i = m.index!; i < css.length; i++) {\n if (css[i] === '{') {\n if (openCount === 0) {\n query = css.slice(m.index, i).trim()\n bodyStart = i + 1\n }\n openCount++\n } else if (css[i] === '}') {\n openCount--\n if (openCount === 0) {\n queries.push({\n start: m.index,\n end: i + 1,\n query,\n outerBody: css.slice(m.index, i + 1),\n innerBody: css.slice(bodyStart, i),\n })\n break\n }\n }\n }\n if (openCount !== 0) console.error(`${query} not closed: \"${css}\"`)\n }\n return queries\n}\n\n/** Trims whitespace for every line */\nfunction trim(css: string) {\n return css\n .split('\\n')\n .map(l => l.trim())\n .filter(l => l)\n .join('\\n')\n}\n\n/**\n * Assemble a string from a template string array and a list of placeholders.\n *\n * - If the first argument is a string, it is returned as is.\n *\n * i.e.\n * myFoo(...props: TemplateStringProps) => {\n * const inputStr = t2s(...props);\n * }\n * myFoo`hello ${name}` => 'hello world'\n * myFoo(`hello ${name}`) => 'hello world'\n */\nexport function t2s(...tsp: TemplateStringProps) {\n const [s, ...p] = tsp\n return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')\n}\nexport type TemplateStringProps = [\n strings: TemplateStringsArray | string,\n ...placeHolders: string[]\n]\n\n/**\n * Injects css to the page\n *\n * - Batches adds for performance\n *\n * @param css - css to be injected\n * @returns void\n */\nexport function addCss(css: string) {\n addCss.que.add(css)\n setTimeout(() => {\n const css = [...addCss.que].join('\\n')\n if (css) {\n addCss.que.clear()\n const s = document.createElement('style')\n s.id = `u${addCss.count++}`\n s.innerHTML = css\n document.head.appendChild(s)\n }\n }, 0)\n}\naddCss.que = new Set<string>()\naddCss.count = 0\n\n/**\n * Injects css and creates unique class names\n *\n * - Skips if already added\n *\n * @param css - string or template string, to be injected\n * @returns a unique class name\n */\nexport function createClass(...p: TemplateStringProps) {\n let css = t2s(...p)\n if (!css) return ''\n let className = createClass.history.get(css)\n if (!className) {\n className = 's' + createClass.count++\n createClass.history.set(css, className)\n\n css = deleteComments(css)\n css = expandProps(css)\n css = expandArrayValues(css)\n const qs = findQueries(css)\n\n for (const q of qs.reverse()) {\n css = css.slice(0, q.start) + css.slice(q.end)\n }\n\n css = `.${className}{\\n${css}\\n}\\n`\n css += qs\n .map(q => {\n if (q.query.startsWith('&')) {\n return `.${className}${q.query.slice(1)}{\\n${q.innerBody}\\n}`\n }\n if (q.query.startsWith('@keyframes')) {\n return q.outerBody\n }\n return `${q.query}{\\n.${className}{${q.innerBody}\\n}\\n}`\n })\n .join('\\n')\n\n css = trim(css) + '\\n\\n'\n\n addCss(css)\n }\n return className\n}\ncreateClass.count = 0\ncreateClass.history = new Map<string, string>()\n"],"mappings":"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","names":["breakPoints","classJoin","classes","c","deleteComments","css","expandArrayValues","l","_a","prop","vals","val","i","shorthandPropsMap","shorthandProps","expandProps","k","v","findQueries","queries","m","query","bodyStart","openCount","trim","t2s","tsp","s","p","addCss","createClass","className","qs","q"]}
package/src/core.ts CHANGED
@@ -1,12 +1,15 @@
1
1
  /** Breakpoints like chakra */
2
- const breakPoints = ['30em', '48em', '62em', '80em', '96em']
2
+ export const breakPoints = ['30em', '48em', '62em', '80em', '96em']
3
+
4
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
5
+ type allowableAny = any
3
6
 
4
7
  /** Joins class names and filters out blanks */
5
- export function classJoin(...classes: any[]) {
6
- return classes.filter((c) => c && typeof c === 'string').join(' ')
8
+ export function classJoin(...classes: allowableAny[]) {
9
+ return classes.filter(c => c && typeof c === 'string').join(' ')
7
10
  }
8
11
 
9
- // delete css comments i.e. {/* blah */}
12
+ /** delete css comments **/
10
13
  function deleteComments(css: string) {
11
14
  return css.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm, '')
12
15
  }
@@ -20,8 +23,9 @@ function expandArrayValues(css: string) {
20
23
  if (!css.includes('[')) return css
21
24
  return css
22
25
  .split('\n')
23
- .map((l) => {
24
- const [_, prop, vals] = [...l.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)]?.[0] ?? []
26
+ .map(l => {
27
+ // eslint-disable-next-line no-useless-escape
28
+ const [, prop, vals] = [...l.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)]?.[0] ?? []
25
29
  if (vals) {
26
30
  return vals
27
31
  .split(',')
@@ -104,7 +108,10 @@ export interface ShorthandProps {
104
108
  /** shorthand for css:z-index */
105
109
  z?: number | string
106
110
  }
107
- export const shorthandPropsMap: Record<keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>, string> = {
111
+ export const shorthandPropsMap: Record<
112
+ keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>,
113
+ string
114
+ > = {
108
115
  ai: 'align-items',
109
116
  b: 'border',
110
117
  br: 'border-radius',
@@ -139,7 +146,9 @@ export const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'p
139
146
  function expandProps(css: string) {
140
147
  css = '\n' + css // inject a newline to make the regex easier
141
148
  // Handle 'mx', 'my', 'px', 'py'
142
- css = css.replace(/([mp])x:([^;]*)/g, '$1l:$2;\n$1r:$2').replace(/([mp])y:([^;]*);/g, '$1t:$2;\n$1b:$2')
149
+ css = css
150
+ .replace(/([mp])x:([^;]*)/g, '$1l:$2;\n$1r:$2')
151
+ .replace(/([mp])y:([^;]*);/g, '$1t:$2;\n$1b:$2')
143
152
  Object.entries(shorthandPropsMap).forEach(([k, v]) => {
144
153
  css = css.replace(new RegExp(`([ \n\t;])${k}:`, 'g'), `$1${v}:`)
145
154
  })
@@ -149,7 +158,7 @@ function expandProps(css: string) {
149
158
  /** Find @keyframes, @media, @container queries in css **/
150
159
  function findQueries(css: string) {
151
160
  const queries = []
152
- for (let m of css.matchAll(/[@&]/gm)) {
161
+ for (const m of css.matchAll(/[@&]/gm)) {
153
162
  let query = ''
154
163
  let bodyStart = 0
155
164
  let openCount = 0
@@ -183,8 +192,8 @@ function findQueries(css: string) {
183
192
  function trim(css: string) {
184
193
  return css
185
194
  .split('\n')
186
- .map((l) => l.trim())
187
- .filter((l) => l)
195
+ .map(l => l.trim())
196
+ .filter(l => l)
188
197
  .join('\n')
189
198
  }
190
199
 
@@ -204,7 +213,10 @@ export function t2s(...tsp: TemplateStringProps) {
204
213
  const [s, ...p] = tsp
205
214
  return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')
206
215
  }
207
- export type TemplateStringProps = [strings: TemplateStringsArray | string, ...placeHolders: string[]]
216
+ export type TemplateStringProps = [
217
+ strings: TemplateStringsArray | string,
218
+ ...placeHolders: string[]
219
+ ]
208
220
 
209
221
  /**
210
222
  * Injects css to the page
@@ -251,13 +263,13 @@ export function createClass(...p: TemplateStringProps) {
251
263
  css = expandArrayValues(css)
252
264
  const qs = findQueries(css)
253
265
 
254
- for (let q of qs.reverse()) {
266
+ for (const q of qs.reverse()) {
255
267
  css = css.slice(0, q.start) + css.slice(q.end)
256
268
  }
257
269
 
258
270
  css = `.${className}{\n${css}\n}\n`
259
271
  css += qs
260
- .map((q) => {
272
+ .map(q => {
261
273
  if (q.query.startsWith('&')) {
262
274
  return `.${className}${q.query.slice(1)}{\n${q.innerBody}\n}`
263
275
  }
package/src/index.cjs CHANGED
@@ -1,14 +1,14 @@
1
- "use strict";var g=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var b=(r,n)=>{for(var t in n)g(r,t,{get:n[t],enumerable:!0})},y=(r,n,t,o)=>{if(n&&typeof n=="object"||typeof n=="function")for(let e of f(n))!c.call(r,e)&&e!==t&&g(r,e,{get:()=>n[e],enumerable:!(o=l(n,e))||o.enumerable});return r};var x=r=>y(g({},"__esModule",{value:!0}),r);var C={};b(C,{addCss:()=>m,classJoin:()=>$,createClass:()=>u,css:()=>u,shorthandProps:()=>P,shorthandPropsMap:()=>p,t2s:()=>d});module.exports=x(C);var h=["30em","48em","62em","80em","96em"];function $(...r){return r.filter(n=>n&&typeof n=="string").join(" ")}function j(r){return r.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm,"")}function w(r){return r.includes("[")?r.split(`
2
- `).map(n=>{var s;let[t,o,e]=(s=[...n.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)][0])!=null?s:[];return e?e.split(",").map((i,a)=>(i=i.trim(),!i||i==="null"||i==="undefined"?"":a===0?`${o}: ${i};`:`@media (min-width: ${h[a-1]}) { ${o}: ${i}; }`)).join(`
1
+ "use strict";var p=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var b=(r,n)=>{for(var t in n)p(r,t,{get:n[t],enumerable:!0})},y=(r,n,t,o)=>{if(n&&typeof n=="object"||typeof n=="function")for(let e of f(n))!c.call(r,e)&&e!==t&&p(r,e,{get:()=>n[e],enumerable:!(o=l(n,e))||o.enumerable});return r};var x=r=>y(p({},"__esModule",{value:!0}),r);var k={};b(k,{addCss:()=>m,breakPoints:()=>a,classJoin:()=>h,createClass:()=>u,css:()=>u,shorthandProps:()=>w,shorthandPropsMap:()=>g,t2s:()=>d});module.exports=x(k);var a=["30em","48em","62em","80em","96em"];function h(...r){return r.filter(n=>n&&typeof n=="string").join(" ")}function $(r){return r.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm,"")}function j(r){return r.includes("[")?r.split(`
2
+ `).map(n=>{var e;let[,t,o]=(e=[...n.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)][0])!=null?e:[];return o?o.split(",").map((i,s)=>(i=i.trim(),!i||i==="null"||i==="undefined"?"":s===0?`${t}: ${i};`:`@media (min-width: ${a[s-1]}) { ${t}: ${i}; }`)).join(`
3
3
  `):n}).join(`
4
- `):r}var p={ai:"align-items",b:"border",br:"border-radius",bg:"background",c:"color",d:"display",f:"flex",fd:"flex-direction",i:"inset",h:"height",jc:"justify-content",m:"margin",ml:"margin-left",mr:"margin-right",mt:"margin-top",mb:"margin-bottom",maxW:"max-width",minW:"min-width",p:"padding",pl:"padding-left",pr:"padding-right",pt:"padding-top",pb:"padding-bottom",pos:"position",ta:"text-align",w:"width",z:"z-index"},P=[...Object.keys(p),"mx","my","px","py"];function S(r){return r=`
4
+ `):r}var g={ai:"align-items",b:"border",br:"border-radius",bg:"background",c:"color",d:"display",f:"flex",fd:"flex-direction",i:"inset",h:"height",jc:"justify-content",m:"margin",ml:"margin-left",mr:"margin-right",mt:"margin-top",mb:"margin-bottom",maxW:"max-width",minW:"min-width",p:"padding",pl:"padding-left",pr:"padding-right",pt:"padding-top",pb:"padding-bottom",pos:"position",ta:"text-align",w:"width",z:"z-index"},w=[...Object.keys(g),"mx","my","px","py"];function P(r){return r=`
5
5
  `+r,r=r.replace(/([mp])x:([^;]*)/g,`$1l:$2;
6
6
  $1r:$2`).replace(/([mp])y:([^;]*);/g,`$1t:$2;
7
- $1b:$2`),Object.entries(p).forEach(([n,t])=>{r=r.replace(new RegExp(`([
8
- ;])${n}:`,"g"),`$1${t}:`)}),r.trim()}function k(r){let n=[];for(let t of r.matchAll(/[@&]/gm)){let o="",e=0,s=0;for(let i=t.index;i<r.length;i++)if(r[i]==="{")s===0&&(o=r.slice(t.index,i).trim(),e=i+1),s++;else if(r[i]==="}"&&(s--,s===0)){n.push({start:t.index,end:i+1,query:o,outerBody:r.slice(t.index,i+1),innerBody:r.slice(e,i)});break}s!==0&&console.error(`${o} not closed: "${r}"`)}return n}function q(r){return r.split(`
7
+ $1b:$2`),Object.entries(g).forEach(([n,t])=>{r=r.replace(new RegExp(`([
8
+ ;])${n}:`,"g"),`$1${t}:`)}),r.trim()}function S(r){let n=[];for(let t of r.matchAll(/[@&]/gm)){let o="",e=0,i=0;for(let s=t.index;s<r.length;s++)if(r[s]==="{")i===0&&(o=r.slice(t.index,s).trim(),e=s+1),i++;else if(r[s]==="}"&&(i--,i===0)){n.push({start:t.index,end:s+1,query:o,outerBody:r.slice(t.index,s+1),innerBody:r.slice(e,s)});break}i!==0&&console.error(`${o} not closed: "${r}"`)}return n}function A(r){return r.split(`
9
9
  `).map(n=>n.trim()).filter(n=>n).join(`
10
- `)}function d(...r){let[n,...t]=r;return typeof n=="string"?n:n.map((o,e)=>{var s;return o+((s=t==null?void 0:t[e])!=null?s:"")}).join("")}function m(r){m.que.add(r),setTimeout(()=>{let n=[...m.que].join(`
11
- `);if(n){m.que.clear();let t=document.createElement("style");t.id=`u${m.count++}`,t.innerHTML=n,document.head.appendChild(t)}},0)}m.que=new Set;m.count=0;function u(...r){let n=d(...r);if(!n)return"";let t=u.history.get(n);if(!t){t="s"+u.count++,u.history.set(n,t),n=j(n),n=S(n),n=w(n);let o=k(n);for(let e of o.reverse())n=n.slice(0,e.start)+n.slice(e.end);n=`.${t}{
10
+ `)}function d(...r){let[n,...t]=r;return typeof n=="string"?n:n.map((o,e)=>{var i;return o+((i=t==null?void 0:t[e])!=null?i:"")}).join("")}function m(r){m.que.add(r),setTimeout(()=>{let n=[...m.que].join(`
11
+ `);if(n){m.que.clear();let t=document.createElement("style");t.id=`u${m.count++}`,t.innerHTML=n,document.head.appendChild(t)}},0)}m.que=new Set;m.count=0;function u(...r){let n=d(...r);if(!n)return"";let t=u.history.get(n);if(!t){t="s"+u.count++,u.history.set(n,t),n=$(n),n=P(n),n=j(n);let o=S(n);for(let e of o.reverse())n=n.slice(0,e.start)+n.slice(e.end);n=`.${t}{
12
12
  ${n}
13
13
  }
14
14
  `,n+=o.map(e=>e.query.startsWith("&")?`.${t}${e.query.slice(1)}{
@@ -17,7 +17,7 @@ ${e.innerBody}
17
17
  .${t}{${e.innerBody}
18
18
  }
19
19
  }`).join(`
20
- `),n=q(n)+`
20
+ `),n=A(n)+`
21
21
 
22
- `,m(n)}return t}u.count=0;u.history=new Map;0&&(module.exports={addCss,classJoin,createClass,css,shorthandProps,shorthandPropsMap,t2s});
22
+ `,m(n)}return t}u.count=0;u.history=new Map;0&&(module.exports={addCss,breakPoints,classJoin,createClass,css,shorthandProps,shorthandPropsMap,t2s});
23
23
  //# sourceMappingURL=index.cjs.map
package/src/index.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts","core.ts"],"sourcesContent":["export * from './core.js'\nexport { createClass as css } from './core.js'\n","/** Breakpoints like chakra */\nconst breakPoints = ['30em', '48em', '62em', '80em', '96em']\n\n/** Joins class names and filters out blanks */\nexport function classJoin(...classes: any[]) {\n return classes.filter((c) => c && typeof c === 'string').join(' ')\n}\n\n// delete css comments i.e. {/* blah */}\nfunction deleteComments(css: string) {\n return css.replace(/{\\/\\*[\\s\\S]*?(?=\\*\\/})\\*\\/}/gm, '')\n}\n\n/**\n * Expands array values into media queries\n *\n * Inspired by https://chakra-ui.com/docs/styled-system/responsive-styles\n */\nfunction expandArrayValues(css: string) {\n if (!css.includes('[')) return css\n return css\n .split('\\n')\n .map((l) => {\n const [_, prop, vals] = [...l.matchAll(/([A-Za-z\\-]*):[ ]*\\[([^\\]]+)\\]/g)]?.[0] ?? []\n if (vals) {\n return vals\n .split(',')\n .map((val, i) => {\n val = val.trim()\n if (!val || val === 'null' || val === 'undefined') return ''\n if (i === 0) {\n return `${prop}: ${val};`\n }\n return `@media (min-width: ${breakPoints[i - 1]}) { ${prop}: ${val}; }`\n })\n .join('\\n')\n }\n return l\n })\n .join('\\n')\n}\n\nexport interface ShorthandProps {\n /** shorthand for css:align-items */\n ai?: string\n /** shorthand for css:border */\n b?: string | number\n /** shorthand for css:border-radius */\n br?: string | number\n /** shorthand for css:background */\n bg?: string\n /** shorthand for css:color */\n c?: string\n /** shorthand for css:display */\n d?: string\n /** shorthand for css:flex */\n f?: string\n /** shorthand for css:flex-direction */\n fd?: string\n /** shorthand for css:height */\n h?: number | string\n /** shorthand for css:inset */\n i?: number | string\n /** shorthand for css:justify-content */\n jc?: string\n /** shorthand for css:margin */\n m?: number | string\n /** shorthand for css:margin-left */\n ml?: number | string\n /** shorthand for css:margin-right */\n mr?: number | string\n /** shorthand for css:margin-top */\n mt?: number | string\n /** shorthand for css:margin-bottom */\n mb?: number | string\n /** shorthand for css:margin-top & margin-bottom */\n my?: number | string\n /** shorthand for css:margin-left & margin-right */\n mx?: number | string\n /** shorthand for css:max-width */\n maxW?: number | string\n /** shorthand for css:min-width */\n minW?: number | string\n /** shorthand for css:padding */\n p?: number | string\n /** shorthand for css:padding-left */\n pl?: number | string\n /** shorthand for css:padding-right */\n pr?: number | string\n /** shorthand for css:padding-top */\n pt?: number | string\n /** shorthand for css:padding-bottom */\n pb?: number | string\n /** shorthand for css:padding-top & padding-bottom */\n py?: number | string\n /** shorthand for css:padding-left & padding-right */\n px?: number | string\n /** shorthand for css:position */\n pos?: number | string\n /** shorthand for css:text-align */\n ta?: string\n /** shorthand for css:width */\n w?: number | string\n /** shorthand for css:z-index */\n z?: number | string\n}\nexport const shorthandPropsMap: Record<keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>, string> = {\n ai: 'align-items',\n b: 'border',\n br: 'border-radius',\n bg: 'background',\n c: 'color',\n d: 'display',\n f: 'flex',\n fd: 'flex-direction',\n i: 'inset',\n h: 'height',\n jc: 'justify-content',\n m: 'margin',\n ml: 'margin-left',\n mr: 'margin-right',\n mt: 'margin-top',\n mb: 'margin-bottom',\n maxW: 'max-width',\n minW: 'min-width',\n p: 'padding',\n pl: 'padding-left',\n pr: 'padding-right',\n pt: 'padding-top',\n pb: 'padding-bottom',\n pos: 'position',\n ta: 'text-align',\n w: 'width',\n z: 'z-index',\n}\nexport const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'px', 'py']\n\n/** Expand short-hand css props to full */\nfunction expandProps(css: string) {\n css = '\\n' + css // inject a newline to make the regex easier\n // Handle 'mx', 'my', 'px', 'py'\n css = css.replace(/([mp])x:([^;]*)/g, '$1l:$2;\\n$1r:$2').replace(/([mp])y:([^;]*);/g, '$1t:$2;\\n$1b:$2')\n Object.entries(shorthandPropsMap).forEach(([k, v]) => {\n css = css.replace(new RegExp(`([ \\n\\t;])${k}:`, 'g'), `$1${v}:`)\n })\n return css.trim()\n}\n\n/** Find @keyframes, @media, @container queries in css **/\nfunction findQueries(css: string) {\n const queries = []\n for (let m of css.matchAll(/[@&]/gm)) {\n let query = ''\n let bodyStart = 0\n let openCount = 0\n for (let i = m.index!; i < css.length; i++) {\n if (css[i] === '{') {\n if (openCount === 0) {\n query = css.slice(m.index, i).trim()\n bodyStart = i + 1\n }\n openCount++\n } else if (css[i] === '}') {\n openCount--\n if (openCount === 0) {\n queries.push({\n start: m.index,\n end: i + 1,\n query,\n outerBody: css.slice(m.index, i + 1),\n innerBody: css.slice(bodyStart, i),\n })\n break\n }\n }\n }\n if (openCount !== 0) console.error(`${query} not closed: \"${css}\"`)\n }\n return queries\n}\n\n/** Trims whitespace for every line */\nfunction trim(css: string) {\n return css\n .split('\\n')\n .map((l) => l.trim())\n .filter((l) => l)\n .join('\\n')\n}\n\n/**\n * Assemble a string from a template string array and a list of placeholders.\n *\n * - If the first argument is a string, it is returned as is.\n *\n * i.e.\n * myFoo(...props: TemplateStringProps) => {\n * const inputStr = t2s(...props);\n * }\n * myFoo`hello ${name}` => 'hello world'\n * myFoo(`hello ${name}`) => 'hello world'\n */\nexport function t2s(...tsp: TemplateStringProps) {\n const [s, ...p] = tsp\n return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')\n}\nexport type TemplateStringProps = [strings: TemplateStringsArray | string, ...placeHolders: string[]]\n\n/**\n * Injects css to the page\n *\n * - Batches adds for performance\n *\n * @param css - css to be injected\n * @returns void\n */\nexport function addCss(css: string) {\n addCss.que.add(css)\n setTimeout(() => {\n const css = [...addCss.que].join('\\n')\n if (css) {\n addCss.que.clear()\n const s = document.createElement('style')\n s.id = `u${addCss.count++}`\n s.innerHTML = css\n document.head.appendChild(s)\n }\n }, 0)\n}\naddCss.que = new Set<string>()\naddCss.count = 0\n\n/**\n * Injects css and creates unique class names\n *\n * - Skips if already added\n *\n * @param css - string or template string, to be injected\n * @returns a unique class name\n */\nexport function createClass(...p: TemplateStringProps) {\n let css = t2s(...p)\n if (!css) return ''\n let className = createClass.history.get(css)\n if (!className) {\n className = 's' + createClass.count++\n createClass.history.set(css, className)\n\n css = deleteComments(css)\n css = expandProps(css)\n css = expandArrayValues(css)\n const qs = findQueries(css)\n\n for (let q of qs.reverse()) {\n css = css.slice(0, q.start) + css.slice(q.end)\n }\n\n css = `.${className}{\\n${css}\\n}\\n`\n css += qs\n .map((q) => {\n if (q.query.startsWith('&')) {\n return `.${className}${q.query.slice(1)}{\\n${q.innerBody}\\n}`\n }\n if (q.query.startsWith('@keyframes')) {\n return q.outerBody\n }\n return `${q.query}{\\n.${className}{${q.innerBody}\\n}\\n}`\n })\n .join('\\n')\n\n css = trim(css) + '\\n\\n'\n\n addCss(css)\n }\n return className\n}\ncreateClass.count = 0\ncreateClass.history = new Map<string, string>()\n"],"mappings":"yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,YAAAE,EAAA,cAAAC,EAAA,gBAAAC,EAAA,QAAAA,EAAA,mBAAAC,EAAA,sBAAAC,EAAA,QAAAC,IAAA,eAAAC,EAAAR,GCCA,IAAMS,EAAc,CAAC,OAAQ,OAAQ,OAAQ,OAAQ,MAAM,EAGpD,SAASC,KAAaC,EAAgB,CAC3C,OAAOA,EAAQ,OAAQC,GAAMA,GAAK,OAAOA,GAAM,QAAQ,EAAE,KAAK,GAAG,CACnE,CAGA,SAASC,EAAeC,EAAa,CACnC,OAAOA,EAAI,QAAQ,gCAAiC,EAAE,CACxD,CAOA,SAASC,EAAkBD,EAAa,CACtC,OAAKA,EAAI,SAAS,GAAG,EACdA,EACJ,MAAM;AAAA,CAAI,EACV,IAAKE,GAAM,CAtBhB,IAAAC,EAuBM,GAAM,CAACC,EAAGC,EAAMC,CAAI,GAAIH,EAAA,CAAC,GAAGD,EAAE,SAAS,iCAAiC,CAAC,EAAI,KAArD,KAAAC,EAA2D,CAAC,EACpF,OAAIG,EACKA,EACJ,MAAM,GAAG,EACT,IAAI,CAACC,EAAKC,KACTD,EAAMA,EAAI,KAAK,EACX,CAACA,GAAOA,IAAQ,QAAUA,IAAQ,YAAoB,GACtDC,IAAM,EACD,GAAGH,MAASE,KAEd,sBAAsBZ,EAAYa,EAAI,SAASH,MAASE,OAChE,EACA,KAAK;AAAA,CAAI,EAEPL,CACT,CAAC,EACA,KAAK;AAAA,CAAI,EApBmBF,CAqBjC,CAkEO,IAAMS,EAA2F,CACtG,GAAI,cACJ,EAAG,SACH,GAAI,gBACJ,GAAI,aACJ,EAAG,QACH,EAAG,UACH,EAAG,OACH,GAAI,iBACJ,EAAG,QACH,EAAG,SACH,GAAI,kBACJ,EAAG,SACH,GAAI,cACJ,GAAI,eACJ,GAAI,aACJ,GAAI,gBACJ,KAAM,YACN,KAAM,YACN,EAAG,UACH,GAAI,eACJ,GAAI,gBACJ,GAAI,cACJ,GAAI,iBACJ,IAAK,WACL,GAAI,aACJ,EAAG,QACH,EAAG,SACL,EACaC,EAAiB,CAAC,GAAG,OAAO,KAAKD,CAAiB,EAAG,KAAM,KAAM,KAAM,IAAI,EAGxF,SAASE,EAAYX,EAAa,CAChC,OAAAA,EAAM;AAAA,EAAOA,EAEbA,EAAMA,EAAI,QAAQ,mBAAoB;AAAA,OAAiB,EAAE,QAAQ,oBAAqB;AAAA,OAAiB,EACvG,OAAO,QAAQS,CAAiB,EAAE,QAAQ,CAAC,CAACG,EAAGC,CAAC,IAAM,CACpDb,EAAMA,EAAI,QAAQ,IAAI,OAAO;AAAA,MAAaY,KAAM,GAAG,EAAG,KAAKC,IAAI,CACjE,CAAC,EACMb,EAAI,KAAK,CAClB,CAGA,SAASc,EAAYd,EAAa,CAChC,IAAMe,EAAU,CAAC,EACjB,QAASC,KAAKhB,EAAI,SAAS,QAAQ,EAAG,CACpC,IAAIiB,EAAQ,GACRC,EAAY,EACZC,EAAY,EAChB,QAAS,EAAIH,EAAE,MAAQ,EAAIhB,EAAI,OAAQ,IACrC,GAAIA,EAAI,KAAO,IACTmB,IAAc,IAChBF,EAAQjB,EAAI,MAAMgB,EAAE,MAAO,CAAC,EAAE,KAAK,EACnCE,EAAY,EAAI,GAElBC,YACSnB,EAAI,KAAO,MACpBmB,IACIA,IAAc,GAAG,CACnBJ,EAAQ,KAAK,CACX,MAAOC,EAAE,MACT,IAAK,EAAI,EACT,MAAAC,EACA,UAAWjB,EAAI,MAAMgB,EAAE,MAAO,EAAI,CAAC,EACnC,UAAWhB,EAAI,MAAMkB,EAAW,CAAC,CACnC,CAAC,EACD,KACF,CAGAC,IAAc,GAAG,QAAQ,MAAM,GAAGF,kBAAsBjB,IAAM,CACpE,CACA,OAAOe,CACT,CAGA,SAASK,EAAKpB,EAAa,CACzB,OAAOA,EACJ,MAAM;AAAA,CAAI,EACV,IAAKE,GAAMA,EAAE,KAAK,CAAC,EACnB,OAAQA,GAAMA,CAAC,EACf,KAAK;AAAA,CAAI,CACd,CAcO,SAASmB,KAAOC,EAA0B,CAC/C,GAAM,CAACC,KAAMC,CAAC,EAAIF,EAClB,OAAO,OAAOC,GAAM,SAAWA,EAAIA,EAAE,IAAI,CAACA,EAAGf,IAAG,CA5MlD,IAAAL,EA4MqD,OAAAoB,IAAKpB,EAAAqB,GAAA,YAAAA,EAAIhB,KAAJ,KAAAL,EAAU,IAAG,EAAE,KAAK,EAAE,CAChF,CAWO,SAASsB,EAAOzB,EAAa,CAClCyB,EAAO,IAAI,IAAIzB,CAAG,EAClB,WAAW,IAAM,CACf,IAAMA,EAAM,CAAC,GAAGyB,EAAO,GAAG,EAAE,KAAK;AAAA,CAAI,EACrC,GAAIzB,EAAK,CACPyB,EAAO,IAAI,MAAM,EACjB,IAAMF,EAAI,SAAS,cAAc,OAAO,EACxCA,EAAE,GAAK,IAAIE,EAAO,UAClBF,EAAE,UAAYvB,EACd,SAAS,KAAK,YAAYuB,CAAC,CAC7B,CACF,EAAG,CAAC,CACN,CACAE,EAAO,IAAM,IAAI,IACjBA,EAAO,MAAQ,EAUR,SAASC,KAAeF,EAAwB,CACrD,IAAIxB,EAAMqB,EAAI,GAAGG,CAAC,EAClB,GAAI,CAACxB,EAAK,MAAO,GACjB,IAAI2B,EAAYD,EAAY,QAAQ,IAAI1B,CAAG,EAC3C,GAAI,CAAC2B,EAAW,CACdA,EAAY,IAAMD,EAAY,QAC9BA,EAAY,QAAQ,IAAI1B,EAAK2B,CAAS,EAEtC3B,EAAMD,EAAeC,CAAG,EACxBA,EAAMW,EAAYX,CAAG,EACrBA,EAAMC,EAAkBD,CAAG,EAC3B,IAAM4B,EAAKd,EAAYd,CAAG,EAE1B,QAAS6B,KAAKD,EAAG,QAAQ,EACvB5B,EAAMA,EAAI,MAAM,EAAG6B,EAAE,KAAK,EAAI7B,EAAI,MAAM6B,EAAE,GAAG,EAG/C7B,EAAM,IAAI2B;AAAA,EAAe3B;AAAA;AAAA,EACzBA,GAAO4B,EACJ,IAAKC,GACAA,EAAE,MAAM,WAAW,GAAG,EACjB,IAAIF,IAAYE,EAAE,MAAM,MAAM,CAAC;AAAA,EAAOA,EAAE;AAAA,GAE7CA,EAAE,MAAM,WAAW,YAAY,EAC1BA,EAAE,UAEJ,GAAGA,EAAE;AAAA,GAAYF,KAAaE,EAAE;AAAA;AAAA,EACxC,EACA,KAAK;AAAA,CAAI,EAEZ7B,EAAMoB,EAAKpB,CAAG,EAAI;AAAA;AAAA,EAElByB,EAAOzB,CAAG,CACZ,CACA,OAAO2B,CACT,CACAD,EAAY,MAAQ,EACpBA,EAAY,QAAU,IAAI","names":["src_exports","__export","addCss","classJoin","createClass","shorthandProps","shorthandPropsMap","t2s","__toCommonJS","breakPoints","classJoin","classes","c","deleteComments","css","expandArrayValues","l","_a","_","prop","vals","val","i","shorthandPropsMap","shorthandProps","expandProps","k","v","findQueries","queries","m","query","bodyStart","openCount","trim","t2s","tsp","s","p","addCss","createClass","className","qs","q"]}
1
+ {"version":3,"sources":["index.ts","core.ts"],"sourcesContent":["export * from './core.js'\nexport {createClass as css} from './core.js'\n","/** Breakpoints like chakra */\nexport const breakPoints = ['30em', '48em', '62em', '80em', '96em']\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype allowableAny = any\n\n/** Joins class names and filters out blanks */\nexport function classJoin(...classes: allowableAny[]) {\n return classes.filter(c => c && typeof c === 'string').join(' ')\n}\n\n/** delete css comments **/\nfunction deleteComments(css: string) {\n return css.replace(/{\\/\\*[\\s\\S]*?(?=\\*\\/})\\*\\/}/gm, '')\n}\n\n/**\n * Expands array values into media queries\n *\n * Inspired by https://chakra-ui.com/docs/styled-system/responsive-styles\n */\nfunction expandArrayValues(css: string) {\n if (!css.includes('[')) return css\n return css\n .split('\\n')\n .map(l => {\n // eslint-disable-next-line no-useless-escape\n const [, prop, vals] = [...l.matchAll(/([A-Za-z\\-]*):[ ]*\\[([^\\]]+)\\]/g)]?.[0] ?? []\n if (vals) {\n return vals\n .split(',')\n .map((val, i) => {\n val = val.trim()\n if (!val || val === 'null' || val === 'undefined') return ''\n if (i === 0) {\n return `${prop}: ${val};`\n }\n return `@media (min-width: ${breakPoints[i - 1]}) { ${prop}: ${val}; }`\n })\n .join('\\n')\n }\n return l\n })\n .join('\\n')\n}\n\nexport interface ShorthandProps {\n /** shorthand for css:align-items */\n ai?: string\n /** shorthand for css:border */\n b?: string | number\n /** shorthand for css:border-radius */\n br?: string | number\n /** shorthand for css:background */\n bg?: string\n /** shorthand for css:color */\n c?: string\n /** shorthand for css:display */\n d?: string\n /** shorthand for css:flex */\n f?: string\n /** shorthand for css:flex-direction */\n fd?: string\n /** shorthand for css:height */\n h?: number | string\n /** shorthand for css:inset */\n i?: number | string\n /** shorthand for css:justify-content */\n jc?: string\n /** shorthand for css:margin */\n m?: number | string\n /** shorthand for css:margin-left */\n ml?: number | string\n /** shorthand for css:margin-right */\n mr?: number | string\n /** shorthand for css:margin-top */\n mt?: number | string\n /** shorthand for css:margin-bottom */\n mb?: number | string\n /** shorthand for css:margin-top & margin-bottom */\n my?: number | string\n /** shorthand for css:margin-left & margin-right */\n mx?: number | string\n /** shorthand for css:max-width */\n maxW?: number | string\n /** shorthand for css:min-width */\n minW?: number | string\n /** shorthand for css:padding */\n p?: number | string\n /** shorthand for css:padding-left */\n pl?: number | string\n /** shorthand for css:padding-right */\n pr?: number | string\n /** shorthand for css:padding-top */\n pt?: number | string\n /** shorthand for css:padding-bottom */\n pb?: number | string\n /** shorthand for css:padding-top & padding-bottom */\n py?: number | string\n /** shorthand for css:padding-left & padding-right */\n px?: number | string\n /** shorthand for css:position */\n pos?: number | string\n /** shorthand for css:text-align */\n ta?: string\n /** shorthand for css:width */\n w?: number | string\n /** shorthand for css:z-index */\n z?: number | string\n}\nexport const shorthandPropsMap: Record<\n keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>,\n string\n> = {\n ai: 'align-items',\n b: 'border',\n br: 'border-radius',\n bg: 'background',\n c: 'color',\n d: 'display',\n f: 'flex',\n fd: 'flex-direction',\n i: 'inset',\n h: 'height',\n jc: 'justify-content',\n m: 'margin',\n ml: 'margin-left',\n mr: 'margin-right',\n mt: 'margin-top',\n mb: 'margin-bottom',\n maxW: 'max-width',\n minW: 'min-width',\n p: 'padding',\n pl: 'padding-left',\n pr: 'padding-right',\n pt: 'padding-top',\n pb: 'padding-bottom',\n pos: 'position',\n ta: 'text-align',\n w: 'width',\n z: 'z-index',\n}\nexport const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'px', 'py']\n\n/** Expand short-hand css props to full */\nfunction expandProps(css: string) {\n css = '\\n' + css // inject a newline to make the regex easier\n // Handle 'mx', 'my', 'px', 'py'\n css = css\n .replace(/([mp])x:([^;]*)/g, '$1l:$2;\\n$1r:$2')\n .replace(/([mp])y:([^;]*);/g, '$1t:$2;\\n$1b:$2')\n Object.entries(shorthandPropsMap).forEach(([k, v]) => {\n css = css.replace(new RegExp(`([ \\n\\t;])${k}:`, 'g'), `$1${v}:`)\n })\n return css.trim()\n}\n\n/** Find @keyframes, @media, @container queries in css **/\nfunction findQueries(css: string) {\n const queries = []\n for (const m of css.matchAll(/[@&]/gm)) {\n let query = ''\n let bodyStart = 0\n let openCount = 0\n for (let i = m.index!; i < css.length; i++) {\n if (css[i] === '{') {\n if (openCount === 0) {\n query = css.slice(m.index, i).trim()\n bodyStart = i + 1\n }\n openCount++\n } else if (css[i] === '}') {\n openCount--\n if (openCount === 0) {\n queries.push({\n start: m.index,\n end: i + 1,\n query,\n outerBody: css.slice(m.index, i + 1),\n innerBody: css.slice(bodyStart, i),\n })\n break\n }\n }\n }\n if (openCount !== 0) console.error(`${query} not closed: \"${css}\"`)\n }\n return queries\n}\n\n/** Trims whitespace for every line */\nfunction trim(css: string) {\n return css\n .split('\\n')\n .map(l => l.trim())\n .filter(l => l)\n .join('\\n')\n}\n\n/**\n * Assemble a string from a template string array and a list of placeholders.\n *\n * - If the first argument is a string, it is returned as is.\n *\n * i.e.\n * myFoo(...props: TemplateStringProps) => {\n * const inputStr = t2s(...props);\n * }\n * myFoo`hello ${name}` => 'hello world'\n * myFoo(`hello ${name}`) => 'hello world'\n */\nexport function t2s(...tsp: TemplateStringProps) {\n const [s, ...p] = tsp\n return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')\n}\nexport type TemplateStringProps = [\n strings: TemplateStringsArray | string,\n ...placeHolders: string[]\n]\n\n/**\n * Injects css to the page\n *\n * - Batches adds for performance\n *\n * @param css - css to be injected\n * @returns void\n */\nexport function addCss(css: string) {\n addCss.que.add(css)\n setTimeout(() => {\n const css = [...addCss.que].join('\\n')\n if (css) {\n addCss.que.clear()\n const s = document.createElement('style')\n s.id = `u${addCss.count++}`\n s.innerHTML = css\n document.head.appendChild(s)\n }\n }, 0)\n}\naddCss.que = new Set<string>()\naddCss.count = 0\n\n/**\n * Injects css and creates unique class names\n *\n * - Skips if already added\n *\n * @param css - string or template string, to be injected\n * @returns a unique class name\n */\nexport function createClass(...p: TemplateStringProps) {\n let css = t2s(...p)\n if (!css) return ''\n let className = createClass.history.get(css)\n if (!className) {\n className = 's' + createClass.count++\n createClass.history.set(css, className)\n\n css = deleteComments(css)\n css = expandProps(css)\n css = expandArrayValues(css)\n const qs = findQueries(css)\n\n for (const q of qs.reverse()) {\n css = css.slice(0, q.start) + css.slice(q.end)\n }\n\n css = `.${className}{\\n${css}\\n}\\n`\n css += qs\n .map(q => {\n if (q.query.startsWith('&')) {\n return `.${className}${q.query.slice(1)}{\\n${q.innerBody}\\n}`\n }\n if (q.query.startsWith('@keyframes')) {\n return q.outerBody\n }\n return `${q.query}{\\n.${className}{${q.innerBody}\\n}\\n}`\n })\n .join('\\n')\n\n css = trim(css) + '\\n\\n'\n\n addCss(css)\n }\n return className\n}\ncreateClass.count = 0\ncreateClass.history = new Map<string, string>()\n"],"mappings":"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","names":["src_exports","__export","addCss","breakPoints","classJoin","createClass","shorthandProps","shorthandPropsMap","t2s","__toCommonJS","breakPoints","classJoin","classes","c","deleteComments","css","expandArrayValues","l","_a","prop","vals","val","i","shorthandPropsMap","shorthandProps","expandProps","k","v","findQueries","queries","m","query","bodyStart","openCount","trim","t2s","tsp","s","p","addCss","createClass","className","qs","q"]}
package/src/index.d.ts CHANGED
@@ -1 +1 @@
1
- export { ShorthandProps, TemplateStringProps, addCss, classJoin, createClass, createClass as css, shorthandProps, shorthandPropsMap, t2s } from './core.js';
1
+ export { ShorthandProps, TemplateStringProps, addCss, breakPoints, classJoin, createClass, createClass as css, shorthandProps, shorthandPropsMap, t2s } from './core.js';
package/src/index.js CHANGED
@@ -1,23 +1,23 @@
1
- var a=["30em","48em","62em","80em","96em"];function x(...r){return r.filter(n=>n&&typeof n=="string").join(" ")}function d(r){return r.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm,"")}function l(r){return r.includes("[")?r.split(`
2
- `).map(n=>{var s;let[t,o,e]=(s=[...n.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)][0])!=null?s:[];return e?e.split(",").map((i,g)=>(i=i.trim(),!i||i==="null"||i==="undefined"?"":g===0?`${o}: ${i};`:`@media (min-width: ${a[g-1]}) { ${o}: ${i}; }`)).join(`
1
+ var g=["30em","48em","62em","80em","96em"];function y(...r){return r.filter(n=>n&&typeof n=="string").join(" ")}function a(r){return r.replace(/{\/\*[\s\S]*?(?=\*\/})\*\/}/gm,"")}function d(r){return r.includes("[")?r.split(`
2
+ `).map(n=>{var e;let[,t,s]=(e=[...n.matchAll(/([A-Za-z\-]*):[ ]*\[([^\]]+)\]/g)][0])!=null?e:[];return s?s.split(",").map((i,o)=>(i=i.trim(),!i||i==="null"||i==="undefined"?"":o===0?`${t}: ${i};`:`@media (min-width: ${g[o-1]}) { ${t}: ${i}; }`)).join(`
3
3
  `):n}).join(`
4
- `):r}var p={ai:"align-items",b:"border",br:"border-radius",bg:"background",c:"color",d:"display",f:"flex",fd:"flex-direction",i:"inset",h:"height",jc:"justify-content",m:"margin",ml:"margin-left",mr:"margin-right",mt:"margin-top",mb:"margin-bottom",maxW:"max-width",minW:"min-width",p:"padding",pl:"padding-left",pr:"padding-right",pt:"padding-top",pb:"padding-bottom",pos:"position",ta:"text-align",w:"width",z:"z-index"},h=[...Object.keys(p),"mx","my","px","py"];function f(r){return r=`
4
+ `):r}var p={ai:"align-items",b:"border",br:"border-radius",bg:"background",c:"color",d:"display",f:"flex",fd:"flex-direction",i:"inset",h:"height",jc:"justify-content",m:"margin",ml:"margin-left",mr:"margin-right",mt:"margin-top",mb:"margin-bottom",maxW:"max-width",minW:"min-width",p:"padding",pl:"padding-left",pr:"padding-right",pt:"padding-top",pb:"padding-bottom",pos:"position",ta:"text-align",w:"width",z:"z-index"},x=[...Object.keys(p),"mx","my","px","py"];function l(r){return r=`
5
5
  `+r,r=r.replace(/([mp])x:([^;]*)/g,`$1l:$2;
6
6
  $1r:$2`).replace(/([mp])y:([^;]*);/g,`$1t:$2;
7
7
  $1b:$2`),Object.entries(p).forEach(([n,t])=>{r=r.replace(new RegExp(`([
8
- ;])${n}:`,"g"),`$1${t}:`)}),r.trim()}function c(r){let n=[];for(let t of r.matchAll(/[@&]/gm)){let o="",e=0,s=0;for(let i=t.index;i<r.length;i++)if(r[i]==="{")s===0&&(o=r.slice(t.index,i).trim(),e=i+1),s++;else if(r[i]==="}"&&(s--,s===0)){n.push({start:t.index,end:i+1,query:o,outerBody:r.slice(t.index,i+1),innerBody:r.slice(e,i)});break}s!==0&&console.error(`${o} not closed: "${r}"`)}return n}function b(r){return r.split(`
8
+ ;])${n}:`,"g"),`$1${t}:`)}),r.trim()}function f(r){let n=[];for(let t of r.matchAll(/[@&]/gm)){let s="",e=0,i=0;for(let o=t.index;o<r.length;o++)if(r[o]==="{")i===0&&(s=r.slice(t.index,o).trim(),e=o+1),i++;else if(r[o]==="}"&&(i--,i===0)){n.push({start:t.index,end:o+1,query:s,outerBody:r.slice(t.index,o+1),innerBody:r.slice(e,o)});break}i!==0&&console.error(`${s} not closed: "${r}"`)}return n}function c(r){return r.split(`
9
9
  `).map(n=>n.trim()).filter(n=>n).join(`
10
- `)}function y(...r){let[n,...t]=r;return typeof n=="string"?n:n.map((o,e)=>{var s;return o+((s=t==null?void 0:t[e])!=null?s:"")}).join("")}function m(r){m.que.add(r),setTimeout(()=>{let n=[...m.que].join(`
11
- `);if(n){m.que.clear();let t=document.createElement("style");t.id=`u${m.count++}`,t.innerHTML=n,document.head.appendChild(t)}},0)}m.que=new Set;m.count=0;function u(...r){let n=y(...r);if(!n)return"";let t=u.history.get(n);if(!t){t="s"+u.count++,u.history.set(n,t),n=d(n),n=f(n),n=l(n);let o=c(n);for(let e of o.reverse())n=n.slice(0,e.start)+n.slice(e.end);n=`.${t}{
10
+ `)}function b(...r){let[n,...t]=r;return typeof n=="string"?n:n.map((s,e)=>{var i;return s+((i=t==null?void 0:t[e])!=null?i:"")}).join("")}function m(r){m.que.add(r),setTimeout(()=>{let n=[...m.que].join(`
11
+ `);if(n){m.que.clear();let t=document.createElement("style");t.id=`u${m.count++}`,t.innerHTML=n,document.head.appendChild(t)}},0)}m.que=new Set;m.count=0;function u(...r){let n=b(...r);if(!n)return"";let t=u.history.get(n);if(!t){t="s"+u.count++,u.history.set(n,t),n=a(n),n=l(n),n=d(n);let s=f(n);for(let e of s.reverse())n=n.slice(0,e.start)+n.slice(e.end);n=`.${t}{
12
12
  ${n}
13
13
  }
14
- `,n+=o.map(e=>e.query.startsWith("&")?`.${t}${e.query.slice(1)}{
14
+ `,n+=s.map(e=>e.query.startsWith("&")?`.${t}${e.query.slice(1)}{
15
15
  ${e.innerBody}
16
16
  }`:e.query.startsWith("@keyframes")?e.outerBody:`${e.query}{
17
17
  .${t}{${e.innerBody}
18
18
  }
19
19
  }`).join(`
20
- `),n=b(n)+`
20
+ `),n=c(n)+`
21
21
 
22
- `,m(n)}return t}u.count=0;u.history=new Map;export{m as addCss,x as classJoin,u as createClass,u as css,h as shorthandProps,p as shorthandPropsMap,y as t2s};
22
+ `,m(n)}return t}u.count=0;u.history=new Map;export{m as addCss,g as breakPoints,y as classJoin,u as createClass,u as css,x as shorthandProps,p as shorthandPropsMap,b as t2s};
23
23
  //# sourceMappingURL=index.js.map
package/src/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["core.ts"],"sourcesContent":["/** Breakpoints like chakra */\nconst breakPoints = ['30em', '48em', '62em', '80em', '96em']\n\n/** Joins class names and filters out blanks */\nexport function classJoin(...classes: any[]) {\n return classes.filter((c) => c && typeof c === 'string').join(' ')\n}\n\n// delete css comments i.e. {/* blah */}\nfunction deleteComments(css: string) {\n return css.replace(/{\\/\\*[\\s\\S]*?(?=\\*\\/})\\*\\/}/gm, '')\n}\n\n/**\n * Expands array values into media queries\n *\n * Inspired by https://chakra-ui.com/docs/styled-system/responsive-styles\n */\nfunction expandArrayValues(css: string) {\n if (!css.includes('[')) return css\n return css\n .split('\\n')\n .map((l) => {\n const [_, prop, vals] = [...l.matchAll(/([A-Za-z\\-]*):[ ]*\\[([^\\]]+)\\]/g)]?.[0] ?? []\n if (vals) {\n return vals\n .split(',')\n .map((val, i) => {\n val = val.trim()\n if (!val || val === 'null' || val === 'undefined') return ''\n if (i === 0) {\n return `${prop}: ${val};`\n }\n return `@media (min-width: ${breakPoints[i - 1]}) { ${prop}: ${val}; }`\n })\n .join('\\n')\n }\n return l\n })\n .join('\\n')\n}\n\nexport interface ShorthandProps {\n /** shorthand for css:align-items */\n ai?: string\n /** shorthand for css:border */\n b?: string | number\n /** shorthand for css:border-radius */\n br?: string | number\n /** shorthand for css:background */\n bg?: string\n /** shorthand for css:color */\n c?: string\n /** shorthand for css:display */\n d?: string\n /** shorthand for css:flex */\n f?: string\n /** shorthand for css:flex-direction */\n fd?: string\n /** shorthand for css:height */\n h?: number | string\n /** shorthand for css:inset */\n i?: number | string\n /** shorthand for css:justify-content */\n jc?: string\n /** shorthand for css:margin */\n m?: number | string\n /** shorthand for css:margin-left */\n ml?: number | string\n /** shorthand for css:margin-right */\n mr?: number | string\n /** shorthand for css:margin-top */\n mt?: number | string\n /** shorthand for css:margin-bottom */\n mb?: number | string\n /** shorthand for css:margin-top & margin-bottom */\n my?: number | string\n /** shorthand for css:margin-left & margin-right */\n mx?: number | string\n /** shorthand for css:max-width */\n maxW?: number | string\n /** shorthand for css:min-width */\n minW?: number | string\n /** shorthand for css:padding */\n p?: number | string\n /** shorthand for css:padding-left */\n pl?: number | string\n /** shorthand for css:padding-right */\n pr?: number | string\n /** shorthand for css:padding-top */\n pt?: number | string\n /** shorthand for css:padding-bottom */\n pb?: number | string\n /** shorthand for css:padding-top & padding-bottom */\n py?: number | string\n /** shorthand for css:padding-left & padding-right */\n px?: number | string\n /** shorthand for css:position */\n pos?: number | string\n /** shorthand for css:text-align */\n ta?: string\n /** shorthand for css:width */\n w?: number | string\n /** shorthand for css:z-index */\n z?: number | string\n}\nexport const shorthandPropsMap: Record<keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>, string> = {\n ai: 'align-items',\n b: 'border',\n br: 'border-radius',\n bg: 'background',\n c: 'color',\n d: 'display',\n f: 'flex',\n fd: 'flex-direction',\n i: 'inset',\n h: 'height',\n jc: 'justify-content',\n m: 'margin',\n ml: 'margin-left',\n mr: 'margin-right',\n mt: 'margin-top',\n mb: 'margin-bottom',\n maxW: 'max-width',\n minW: 'min-width',\n p: 'padding',\n pl: 'padding-left',\n pr: 'padding-right',\n pt: 'padding-top',\n pb: 'padding-bottom',\n pos: 'position',\n ta: 'text-align',\n w: 'width',\n z: 'z-index',\n}\nexport const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'px', 'py']\n\n/** Expand short-hand css props to full */\nfunction expandProps(css: string) {\n css = '\\n' + css // inject a newline to make the regex easier\n // Handle 'mx', 'my', 'px', 'py'\n css = css.replace(/([mp])x:([^;]*)/g, '$1l:$2;\\n$1r:$2').replace(/([mp])y:([^;]*);/g, '$1t:$2;\\n$1b:$2')\n Object.entries(shorthandPropsMap).forEach(([k, v]) => {\n css = css.replace(new RegExp(`([ \\n\\t;])${k}:`, 'g'), `$1${v}:`)\n })\n return css.trim()\n}\n\n/** Find @keyframes, @media, @container queries in css **/\nfunction findQueries(css: string) {\n const queries = []\n for (let m of css.matchAll(/[@&]/gm)) {\n let query = ''\n let bodyStart = 0\n let openCount = 0\n for (let i = m.index!; i < css.length; i++) {\n if (css[i] === '{') {\n if (openCount === 0) {\n query = css.slice(m.index, i).trim()\n bodyStart = i + 1\n }\n openCount++\n } else if (css[i] === '}') {\n openCount--\n if (openCount === 0) {\n queries.push({\n start: m.index,\n end: i + 1,\n query,\n outerBody: css.slice(m.index, i + 1),\n innerBody: css.slice(bodyStart, i),\n })\n break\n }\n }\n }\n if (openCount !== 0) console.error(`${query} not closed: \"${css}\"`)\n }\n return queries\n}\n\n/** Trims whitespace for every line */\nfunction trim(css: string) {\n return css\n .split('\\n')\n .map((l) => l.trim())\n .filter((l) => l)\n .join('\\n')\n}\n\n/**\n * Assemble a string from a template string array and a list of placeholders.\n *\n * - If the first argument is a string, it is returned as is.\n *\n * i.e.\n * myFoo(...props: TemplateStringProps) => {\n * const inputStr = t2s(...props);\n * }\n * myFoo`hello ${name}` => 'hello world'\n * myFoo(`hello ${name}`) => 'hello world'\n */\nexport function t2s(...tsp: TemplateStringProps) {\n const [s, ...p] = tsp\n return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')\n}\nexport type TemplateStringProps = [strings: TemplateStringsArray | string, ...placeHolders: string[]]\n\n/**\n * Injects css to the page\n *\n * - Batches adds for performance\n *\n * @param css - css to be injected\n * @returns void\n */\nexport function addCss(css: string) {\n addCss.que.add(css)\n setTimeout(() => {\n const css = [...addCss.que].join('\\n')\n if (css) {\n addCss.que.clear()\n const s = document.createElement('style')\n s.id = `u${addCss.count++}`\n s.innerHTML = css\n document.head.appendChild(s)\n }\n }, 0)\n}\naddCss.que = new Set<string>()\naddCss.count = 0\n\n/**\n * Injects css and creates unique class names\n *\n * - Skips if already added\n *\n * @param css - string or template string, to be injected\n * @returns a unique class name\n */\nexport function createClass(...p: TemplateStringProps) {\n let css = t2s(...p)\n if (!css) return ''\n let className = createClass.history.get(css)\n if (!className) {\n className = 's' + createClass.count++\n createClass.history.set(css, className)\n\n css = deleteComments(css)\n css = expandProps(css)\n css = expandArrayValues(css)\n const qs = findQueries(css)\n\n for (let q of qs.reverse()) {\n css = css.slice(0, q.start) + css.slice(q.end)\n }\n\n css = `.${className}{\\n${css}\\n}\\n`\n css += qs\n .map((q) => {\n if (q.query.startsWith('&')) {\n return `.${className}${q.query.slice(1)}{\\n${q.innerBody}\\n}`\n }\n if (q.query.startsWith('@keyframes')) {\n return q.outerBody\n }\n return `${q.query}{\\n.${className}{${q.innerBody}\\n}\\n}`\n })\n .join('\\n')\n\n css = trim(css) + '\\n\\n'\n\n addCss(css)\n }\n return className\n}\ncreateClass.count = 0\ncreateClass.history = new Map<string, string>()\n"],"mappings":"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","names":["breakPoints","classJoin","classes","c","deleteComments","css","expandArrayValues","l","_a","_","prop","vals","val","i","shorthandPropsMap","shorthandProps","expandProps","k","v","findQueries","queries","m","query","bodyStart","openCount","trim","t2s","tsp","s","p","addCss","createClass","className","qs","q"]}
1
+ {"version":3,"sources":["core.ts"],"sourcesContent":["/** Breakpoints like chakra */\nexport const breakPoints = ['30em', '48em', '62em', '80em', '96em']\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype allowableAny = any\n\n/** Joins class names and filters out blanks */\nexport function classJoin(...classes: allowableAny[]) {\n return classes.filter(c => c && typeof c === 'string').join(' ')\n}\n\n/** delete css comments **/\nfunction deleteComments(css: string) {\n return css.replace(/{\\/\\*[\\s\\S]*?(?=\\*\\/})\\*\\/}/gm, '')\n}\n\n/**\n * Expands array values into media queries\n *\n * Inspired by https://chakra-ui.com/docs/styled-system/responsive-styles\n */\nfunction expandArrayValues(css: string) {\n if (!css.includes('[')) return css\n return css\n .split('\\n')\n .map(l => {\n // eslint-disable-next-line no-useless-escape\n const [, prop, vals] = [...l.matchAll(/([A-Za-z\\-]*):[ ]*\\[([^\\]]+)\\]/g)]?.[0] ?? []\n if (vals) {\n return vals\n .split(',')\n .map((val, i) => {\n val = val.trim()\n if (!val || val === 'null' || val === 'undefined') return ''\n if (i === 0) {\n return `${prop}: ${val};`\n }\n return `@media (min-width: ${breakPoints[i - 1]}) { ${prop}: ${val}; }`\n })\n .join('\\n')\n }\n return l\n })\n .join('\\n')\n}\n\nexport interface ShorthandProps {\n /** shorthand for css:align-items */\n ai?: string\n /** shorthand for css:border */\n b?: string | number\n /** shorthand for css:border-radius */\n br?: string | number\n /** shorthand for css:background */\n bg?: string\n /** shorthand for css:color */\n c?: string\n /** shorthand for css:display */\n d?: string\n /** shorthand for css:flex */\n f?: string\n /** shorthand for css:flex-direction */\n fd?: string\n /** shorthand for css:height */\n h?: number | string\n /** shorthand for css:inset */\n i?: number | string\n /** shorthand for css:justify-content */\n jc?: string\n /** shorthand for css:margin */\n m?: number | string\n /** shorthand for css:margin-left */\n ml?: number | string\n /** shorthand for css:margin-right */\n mr?: number | string\n /** shorthand for css:margin-top */\n mt?: number | string\n /** shorthand for css:margin-bottom */\n mb?: number | string\n /** shorthand for css:margin-top & margin-bottom */\n my?: number | string\n /** shorthand for css:margin-left & margin-right */\n mx?: number | string\n /** shorthand for css:max-width */\n maxW?: number | string\n /** shorthand for css:min-width */\n minW?: number | string\n /** shorthand for css:padding */\n p?: number | string\n /** shorthand for css:padding-left */\n pl?: number | string\n /** shorthand for css:padding-right */\n pr?: number | string\n /** shorthand for css:padding-top */\n pt?: number | string\n /** shorthand for css:padding-bottom */\n pb?: number | string\n /** shorthand for css:padding-top & padding-bottom */\n py?: number | string\n /** shorthand for css:padding-left & padding-right */\n px?: number | string\n /** shorthand for css:position */\n pos?: number | string\n /** shorthand for css:text-align */\n ta?: string\n /** shorthand for css:width */\n w?: number | string\n /** shorthand for css:z-index */\n z?: number | string\n}\nexport const shorthandPropsMap: Record<\n keyof Omit<ShorthandProps, 'mx' | 'my' | 'px' | 'py'>,\n string\n> = {\n ai: 'align-items',\n b: 'border',\n br: 'border-radius',\n bg: 'background',\n c: 'color',\n d: 'display',\n f: 'flex',\n fd: 'flex-direction',\n i: 'inset',\n h: 'height',\n jc: 'justify-content',\n m: 'margin',\n ml: 'margin-left',\n mr: 'margin-right',\n mt: 'margin-top',\n mb: 'margin-bottom',\n maxW: 'max-width',\n minW: 'min-width',\n p: 'padding',\n pl: 'padding-left',\n pr: 'padding-right',\n pt: 'padding-top',\n pb: 'padding-bottom',\n pos: 'position',\n ta: 'text-align',\n w: 'width',\n z: 'z-index',\n}\nexport const shorthandProps = [...Object.keys(shorthandPropsMap), 'mx', 'my', 'px', 'py']\n\n/** Expand short-hand css props to full */\nfunction expandProps(css: string) {\n css = '\\n' + css // inject a newline to make the regex easier\n // Handle 'mx', 'my', 'px', 'py'\n css = css\n .replace(/([mp])x:([^;]*)/g, '$1l:$2;\\n$1r:$2')\n .replace(/([mp])y:([^;]*);/g, '$1t:$2;\\n$1b:$2')\n Object.entries(shorthandPropsMap).forEach(([k, v]) => {\n css = css.replace(new RegExp(`([ \\n\\t;])${k}:`, 'g'), `$1${v}:`)\n })\n return css.trim()\n}\n\n/** Find @keyframes, @media, @container queries in css **/\nfunction findQueries(css: string) {\n const queries = []\n for (const m of css.matchAll(/[@&]/gm)) {\n let query = ''\n let bodyStart = 0\n let openCount = 0\n for (let i = m.index!; i < css.length; i++) {\n if (css[i] === '{') {\n if (openCount === 0) {\n query = css.slice(m.index, i).trim()\n bodyStart = i + 1\n }\n openCount++\n } else if (css[i] === '}') {\n openCount--\n if (openCount === 0) {\n queries.push({\n start: m.index,\n end: i + 1,\n query,\n outerBody: css.slice(m.index, i + 1),\n innerBody: css.slice(bodyStart, i),\n })\n break\n }\n }\n }\n if (openCount !== 0) console.error(`${query} not closed: \"${css}\"`)\n }\n return queries\n}\n\n/** Trims whitespace for every line */\nfunction trim(css: string) {\n return css\n .split('\\n')\n .map(l => l.trim())\n .filter(l => l)\n .join('\\n')\n}\n\n/**\n * Assemble a string from a template string array and a list of placeholders.\n *\n * - If the first argument is a string, it is returned as is.\n *\n * i.e.\n * myFoo(...props: TemplateStringProps) => {\n * const inputStr = t2s(...props);\n * }\n * myFoo`hello ${name}` => 'hello world'\n * myFoo(`hello ${name}`) => 'hello world'\n */\nexport function t2s(...tsp: TemplateStringProps) {\n const [s, ...p] = tsp\n return typeof s === 'string' ? s : s.map((s, i) => s + (p?.[i] ?? '')).join('')\n}\nexport type TemplateStringProps = [\n strings: TemplateStringsArray | string,\n ...placeHolders: string[]\n]\n\n/**\n * Injects css to the page\n *\n * - Batches adds for performance\n *\n * @param css - css to be injected\n * @returns void\n */\nexport function addCss(css: string) {\n addCss.que.add(css)\n setTimeout(() => {\n const css = [...addCss.que].join('\\n')\n if (css) {\n addCss.que.clear()\n const s = document.createElement('style')\n s.id = `u${addCss.count++}`\n s.innerHTML = css\n document.head.appendChild(s)\n }\n }, 0)\n}\naddCss.que = new Set<string>()\naddCss.count = 0\n\n/**\n * Injects css and creates unique class names\n *\n * - Skips if already added\n *\n * @param css - string or template string, to be injected\n * @returns a unique class name\n */\nexport function createClass(...p: TemplateStringProps) {\n let css = t2s(...p)\n if (!css) return ''\n let className = createClass.history.get(css)\n if (!className) {\n className = 's' + createClass.count++\n createClass.history.set(css, className)\n\n css = deleteComments(css)\n css = expandProps(css)\n css = expandArrayValues(css)\n const qs = findQueries(css)\n\n for (const q of qs.reverse()) {\n css = css.slice(0, q.start) + css.slice(q.end)\n }\n\n css = `.${className}{\\n${css}\\n}\\n`\n css += qs\n .map(q => {\n if (q.query.startsWith('&')) {\n return `.${className}${q.query.slice(1)}{\\n${q.innerBody}\\n}`\n }\n if (q.query.startsWith('@keyframes')) {\n return q.outerBody\n }\n return `${q.query}{\\n.${className}{${q.innerBody}\\n}\\n}`\n })\n .join('\\n')\n\n css = trim(css) + '\\n\\n'\n\n addCss(css)\n }\n return className\n}\ncreateClass.count = 0\ncreateClass.history = new Map<string, string>()\n"],"mappings":"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","names":["breakPoints","classJoin","classes","c","deleteComments","css","expandArrayValues","l","_a","prop","vals","val","i","shorthandPropsMap","shorthandProps","expandProps","k","v","findQueries","queries","m","query","bodyStart","openCount","trim","t2s","tsp","s","p","addCss","createClass","className","qs","q"]}
package/src/index.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  export * from './core.js'
2
- export { createClass as css } from './core.js'
2
+ export {createClass as css} from './core.js'