function mergeSettings(defaultSettings, userSettings) {
    // Create a fresh copy of default settings.
    var settings = mergeObjects({}, defaultSettings);

    // Merge user settings to default settings.
    if (userSettings) {
      settings = mergeObjects(settings, userSettings);
    }

    // Handle visible/hidden styles manually so that the whole object is
    // overridden instead of the props.

    if (userSettings && userSettings.visibleStyles) {
      settings.visibleStyles = userSettings.visibleStyles;
    } else if (defaultSettings && defaultSettings.visibleStyles) {
      settings.visibleStyles = defaultSettings.visibleStyles;
    }

    if (userSettings && userSettings.hiddenStyles) {
      settings.hiddenStyles = userSettings.hiddenStyles;
    } else if (defaultSettings && defaultSettings.hiddenStyles) {
      settings.hiddenStyles = defaultSettings.hiddenStyles;
    }

    return settings;
  }
Merge default settings with user settings. The returned object is a new
object with merged values. The merging is a deep merge meaning that all
objects and arrays within the provided settings objects will be also merged
so that modifying the values of the settings object will have no effect on
the returned object.

@param {Object} defaultSettings
@param {Object} [userSettings]
@returns {Object} Returns a new object.