babel-plugin-tailwind/lib/index.js

Transforms [TailwindCSS](https://www.tailwindcss.com) classes to CSS-in-JS at build time.

"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};exports.default=function(babel){var t=babel.types;return{name:"tailwind-to-css-in-js",// not required
visitor:{CallExpression:function CallExpression(path){var node=path.node;if(node.callee.name==="tw"&&(t.isStringLiteral(node.arguments[0])||t.isArrayExpression(node.arguments[0]))){var selectors=(0,_isArray2.default)(node.arguments[0].elements)?node.arguments[0].elements:node.arguments[0].value.split(" ");if(t.isStringLiteral(selectors[0])){selectors=selectors.map(function(s){return s.value})}var customStyles={};var focusSelectors={};var hoverSelectors={};var mediaFocusSelectors={};var mediaHoverSelectors={};var mediaSelectors={};var normalSelectors={};for(var x=0;x<=selectors.length-1;x++){if(isNormalSelector(selectors[x])){normalSelectors=_extends({},normalSelectors,getNormalSelectors(selectors[x]))}else if(isHoverSelector(selectors[x])){hoverSelectors=_extends({},hoverSelectors,getHoverSelectors(selectors[x],hoverSelectors))}else if(isFocusSelector(selectors[x])){focusSelectors=_extends({},focusSelectors,getFocusSelectors(selectors[x],focusSelectors))}else if(isMediaSelector(selectors[x])){mediaSelectors=_extends({},mediaSelectors,getMediaSelectors(selectors[x],mediaSelectors))}else if(isMediaHoverSelector(selectors[x])){mediaHoverSelectors=_extends({},mediaHoverSelectors,getMediaHoverSelectors(selectors[x],mediaHoverSelectors))}else if(isMediaFocusSelector(selectors[x])){mediaFocusSelectors=_extends({},mediaFocusSelectors,getMediaFocusSelectors(selectors[x],mediaFocusSelectors))}}if(t.isObjectExpression(node.arguments[1])){customStyles=convertAstObjectToLiteral(node.arguments[1],t)}var mergedSelectors=(0,_merge2.default)(normalSelectors,hoverSelectors,focusSelectors,mediaSelectors,mediaHoverSelectors,mediaFocusSelectors,customStyles);var result=(0,_babelLiteralToAst2.default)(mergedSelectors);path.replaceWith(result)}}}}};exports.isNormalSelector=isNormalSelector;exports.isHoverSelector=isHoverSelector;exports.isFocusSelector=isFocusSelector;exports.isMediaSelector=isMediaSelector;exports.isMediaHoverSelector=isMediaHoverSelector;exports.isMediaFocusSelector=isMediaFocusSelector;exports.getNormalSelectors=getNormalSelectors;exports.getHoverSelectors=getHoverSelectors;exports.getFocusSelectors=getFocusSelectors;exports.getMediaSelectors=getMediaSelectors;exports.getMediaHoverSelectors=getMediaHoverSelectors;exports.getMediaFocusSelectors=getMediaFocusSelectors;exports.formatTailwindObj=formatTailwindObj;var _postcss=require("postcss");var _postcss2=_interopRequireDefault(_postcss);var _postcssJs=require("postcss-js");var _postcssJs2=_interopRequireDefault(_postcssJs);var _fs=require("fs");var _fs2=_interopRequireDefault(_fs);var _babelLiteralToAst=require("babel-literal-to-ast");var _babelLiteralToAst2=_interopRequireDefault(_babelLiteralToAst);var _merge=require("lodash/merge");var _merge2=_interopRequireDefault(_merge);var _isArray=require("lodash/isArray");var _isArray2=_interopRequireDefault(_isArray);var _path=require("path");var _path2=_interopRequireDefault(_path);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}var twConfig={};if(_fs2.default.existsSync("./tailwind.js")){twConfig=require(process.cwd()+"/tailwind.js")}else{twConfig=require("tailwindcss/defaultConfig")()}var twObj={};if(_fs2.default.existsSync("./tailwind.custom.css")){twObj=_fs2.default.readFileSync("./tailwind.custom.css","utf8")}else{twObj=_fs2.default.readFileSync("./node_modules/tailwindcss/dist/tailwind.min.css","utf8")}twObj=_postcss2.default.parse(twObj);twObj=_postcssJs2.default.objectify(twObj);twObj=formatTailwindObj(twObj);function isNormalSelector(selector){return!selector.includes(":")}function isHoverSelector(selector){return selector.includes(":")&&selector.split(":")[0]==="hover"}function isFocusSelector(selector){return selector.includes(":")&&selector.split(":")[0]==="focus"}function isMediaSelector(selector){return selector.includes(":")&&selector.split(":").length===2&&Object.keys(twConfig.screens).some(function(screen){return selector.split(":")[0]})}function isMediaHoverSelector(selector){return selector.includes(":")&&selector.split(":").length===3&&selector.split(":")[1]==="hover"&&Object.keys(twConfig.screens).some(function(screen){return selector.split(":")[0]})}function isMediaFocusSelector(selector){return selector.includes(":")&&selector.split(":").length===3&&selector.split(":")[1]==="focus"&&Object.keys(twConfig.screens).some(function(screen){return selector.split(":")[0]})}function getNormalSelectors(selector){return twObj["."+selector]}function getHoverSelectors(hoverSelector,hoverSelectors){var selector=hoverSelector.split(":")[1];return{":hover":_extends({},hoverSelectors[":hover"],twObj["."+selector])}}function getFocusSelectors(focusSelector,focusSelectors){var selector=focusSelector.split(":")[1];return{":focus":_extends({},focusSelectors[":focus"],twObj["."+selector])}}function getMediaSelectors(mediaSelector,mediaSelectors){var mediaSelectorSplit=mediaSelector.split(":");var size=mediaSelectorSplit[0];var selector=mediaSelectorSplit[1];var screen="@media (min-width: "+twConfig.screens[size]+")";return _defineProperty({},screen,_extends({},mediaSelectors[screen],twObj["."+selector]))}function getMediaHoverSelectors(mediaHoverSelector,mediaHoverSelectors){var mediaHoverSelectorSplit=mediaHoverSelector.split(":");var size=mediaHoverSelectorSplit[0];var hover=mediaHoverSelectorSplit[1];var selector=mediaHoverSelectorSplit[2];var screen="@media (min-width: "+twConfig.screens[size]+")";if(!mediaHoverSelectors.hasOwnProperty(screen)){mediaHoverSelectors[screen]={}}if(!mediaHoverSelectors[screen].hasOwnProperty(":hover")){mediaHoverSelectors[screen][":hover"]={}}return _defineProperty({},screen,_extends({},mediaHoverSelectors[screen],{":hover":_extends({},mediaHoverSelectors[screen][":hover"],twObj["."+selector])}))}function getMediaFocusSelectors(mediaFocusSelector,mediaFocusSelectors){var mediaFocusSelectorSplit=mediaFocusSelector.split(":");var size=mediaFocusSelectorSplit[0];var hover=mediaFocusSelectorSplit[1];var selector=mediaFocusSelectorSplit[2];var screen="@media (min-width: "+twConfig.screens[size]+")";if(!mediaFocusSelectors.hasOwnProperty(screen)){mediaFocusSelectors[screen]={}}if(!mediaFocusSelectors[screen].hasOwnProperty(":focus")){mediaFocusSelectors[screen][":focus"]={}}return _defineProperty({},screen,_extends({},mediaFocusSelectors[screen],{":focus":_extends({},mediaFocusSelectors[screen][":focus"],twObj["."+selector])}))}function formatTailwindObj(obj){return Object.keys(twObj).filter(function(k){return k.includes(".")}).map(function(k){var newKey=k.replace("\\","");return _defineProperty({},newKey,twObj[k])}).reduce(function(acc,x){for(var key in x){if(key.includes(",")){var splitKey=key.split(",");acc[splitKey[0]]=x[key];acc[splitKey[1]]=x[key];delete acc[key];return acc}acc[key]=x[key]}return acc},{})}function convertAstObjectToLiteral(farts,t){return farts.properties.reduce(function(acc,x){acc[x.key.value]=x.value.value;if(t.isObjectExpression(x.value)){acc[x.key.value]=convertAstObjectToLiteral(x.value,t)}return acc},{})}