Javascript object to Sass map transform

js-to-sass-map.js

// For a JS object like so
const sassMapObj = {
  namespace: {
    primary: {
      white: '#fff',
    },
    secondary: {
      black: '#000',
    },
  },
};
  
// Recursively build out the sass map syntax based on the sassMapObj
const drill = (obj) =>
  Object.entries(obj).reduce((acc, [key, value]) => {
    acc +=
      typeof value === 'string'
        ? `'${key}': ${value},`
        : `'${key}': (${drill(value)}),`;
    return acc;
  }, '');

const sassMapString = `$tokens: (${drill(sassMapObj)});`;

// Results in this string (unformatted, use prettier to make pretty or something):
//
// $tokens: (
//   'namespace': (
//     'primary': (
//       'white': '#fff',
//     ),
//     'secondary: (
//       'black': '#000',
//     ),
//   ),
// );