Well Documented

.gitignore

@@ -2,8 +2,6 @@
 .sass-cache
 
 node_modules
-gulpfile.js
-config.json
 
 /style.scss
 /style.css

_bem.scss

@@ -1,51 +1,16 @@
-$bem: (
-	element: '__',
-	modifier: '--',
-	state: '-'
-) !default;
+// SASS-BEM 2.4.0
+// http://sass-bem.zgabievi.io/
+// Copyright 2016 Zura Gabievi.
+// MIT License
 
-$bem-debug: false !default;
+// Configuration
+@import "config";
 
-// functions
-@import "functions/bem-index";
-@import "functions/get-block";
-@import "functions/has-state";
-@import "functions/is-modifier";
-@import "functions/is-element";
-@import "functions/is-block";
-@import "functions/math-min";
-@import "functions/explode";
-@import "functions/to-string";
+// Functions
+@import "functions/all";
 
-// selectors
-@import "helpers/block-selector";
-@import "helpers/element-selector";
-@import "helpers/modifier-selector";
-@import "helpers/relations-selector";
-@import "helpers/object-selector";
-@import "helpers/component-selector";
-@import "helpers/utility-selector";
-@import "helpers/theme-selector";
-@import "helpers/scope-selector";
-@import "helpers/state-selector";
-@import "helpers/hack-selector";
-@import "helpers/test-selector";
+// Helpers
+@import "helpers/all";
 
-// mixins
-@import "mixins/block";
-@import "mixins/element";
-@import "mixins/modifier";
-@import "mixins/relations";
-@import "mixins/states";
-@import "mixins/pseudo";
-@import "mixins/parse";
-
-// oocss
-@import "mixins/object";
-@import "mixins/component";
-@import "mixins/utility";
-@import "mixins/theme";
-@import "mixins/scope";
-@import "mixins/state";
-@import "mixins/hack";
-@import "mixins/test";
+// Mixins
+@import "mixins/all";

_config.scss

@@ -0,0 +1,113 @@
+@charset "UTF-8";
+
+/// Default sass-bem configuration settings.
+///
+/// @type map
+///
+/// @prop {boolean} debug [false] - Turn debug mode on/off. To get outlines on selectors.
+///
+/// @prop {boolean} separator.element [__] - Element separator from parent block.
+///
+/// @prop {boolean} separator.modifier [--] - Modifier separator from parent block.
+///
+/// @prop {boolean} separator.state [-] - States separator from parent block.
+///
+/// @prop {boolean} namespace.component [c] - Component selector namespace.
+///
+/// @prop {boolean} namespace.hack [_] - Hack selector namespace.
+///
+/// @prop {boolean} namespace.object [o] - Object selector namespace.
+///
+/// @prop {boolean} namespace.scope [s] - Scope selector namespace.
+///
+/// @prop {boolean} namespace.test [qa] - Test selector namespace.
+///
+/// @prop {boolean} namespace.theme [t] - Theme selector namespace.
+///
+/// @prop {boolean} namespace.utility [u] - Utility selector namespace.
+///
+/// @access public
+
+$bem: (
+	'debug': false,
+	'separator': (
+		'element': "__",
+		'modifier': "--",
+		'state': "-",
+	),
+	'namespace': (
+		'component': "c",
+		'hack': "_",
+		'object': "o",
+		'scope': "s",
+		'test': "qa",
+		'theme': "t",
+		'utility': "u",
+	)
+) !default;
+
+/// Turn debug mode on/off. To get outlines on selectors.
+///
+/// @type Bool
+
+$bem-debug: map-get($bem, 'debug') !default;
+
+/// Element separator from parent block.
+///
+/// @type String
+
+$bem-element-separator: map-get(map-get($bem, 'separator'), 'element') !default;
+
+/// Modifier separator from parent block.
+///
+/// @type String
+
+$bem-modifier-separator: map-get(map-get($bem, 'separator'), 'modifier') !default;
+
+/// States separator from parent block.
+///
+/// @type String
+
+$bem-state-separator: map-get(map-get($bem, 'separator'), 'state') !default;
+
+/// Component selector namespace.
+///
+/// @type String
+
+$bem-component-namespace: map-get(map-get($bem, 'namespace'), 'component') !default;
+
+/// Hack selector namespace.
+///
+/// @type String
+
+$bem-hack-namespace: map-get(map-get($bem, 'namespace'), 'hack') !default;
+
+/// Object selector namespace.
+///
+/// @type String
+
+$bem-object-namespace: map-get(map-get($bem, 'namespace'), 'object') !default;
+
+/// Scope selector namespace.
+///
+/// @type String
+
+$bem-scope-namespace: map-get(map-get($bem, 'namespace'), 'scope') !default;
+
+/// Test selector namespace.
+///
+/// @type String
+
+$bem-test-namespace: map-get(map-get($bem, 'namespace'), 'test') !default;
+
+/// Theme selector namespace.
+///
+/// @type String
+
+$bem-theme-namespace: map-get(map-get($bem, 'namespace'), 'theme') !default;
+
+/// Utility selector namespace.
+///
+/// @type String
+
+$bem-utility-namespace: map-get(map-get($bem, 'namespace'), 'utility') !default;

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "sass-bem",
-  "version": "2.3.3",
+  "version": "2.4.0",
   "main": "_bem.scss",
   "description": "Collection of BEM Mixins & Helpers",
   "authors": [

functions/_all.scss

@@ -0,0 +1,15 @@
+////
+/// @group Functions
+///
+/// @access private
+////
+
+@import "bem-index";
+@import "get-block";
+@import "has-state";
+@import "is-modifier";
+@import "is-element";
+@import "is-block";
+@import "math-min";
+@import "explode";
+@import "implode";

functions/_bem-index.scss

@@ -1,31 +1,44 @@
-//
+@charset "UTF-8";
+
+/// Get index of separator.
+///
+/// @access private
+///
+/// @param {String} $string - Name of selector, where we should find separator
+///
+/// @requires math-min
+/// @requires $bem-element-separator
+/// @requires $bem-modifier-separator
+///
+/// @returns {Number} - Index of separators
+
 @function bem-index($string) {
 	$e_index: null;
 	$m_index: null;
 
 	//
-	@if (str-index($string, unquote("#{map-get($bem, element)}")) != null) {
-		$e_index: str-index($string, unquote("#{map-get($bem, element)}"));
+	@if (str-index($string, unquote("#{$bem-element-separator}")) != null) {
+		$e_index: str-index($string, unquote("#{$bem-element-separator}"));
 	}
 
 	//
-	@if (str-index($string, unquote("#{map-get($bem, modifier)}")) != null) {
-		$m_index: str-index($string, unquote("#{map-get($bem, modifier)}"));
+	@if (str-index($string, unquote("#{$bem-modifier-separator}")) != null) {
+		$m_index: str-index($string, unquote("#{$bem-modifier-separator}"));
 	}
 
 	//
-	@if (str-index($string, unquote(".is#{map-get($bem, state)}")) != null) {
-		$m_index: str-index($string, unquote(".is#{map-get($bem, state)}"));
+	@if (str-index($string, unquote(".is#{$bem-modifier-separator}")) != null) {
+		$m_index: str-index($string, unquote(".is#{$bem-state-separator}"));
 	}
 
 	//
-	@if (str-index($string, unquote(".js#{map-get($bem, state)}")) != null) {
-		$m_index: str-index($string, unquote(".js#{map-get($bem, state)}"));
+	@if (str-index($string, unquote(".js#{$bem-modifier-separator}")) != null) {
+		$m_index: str-index($string, unquote(".js#{$bem-state-separator}"));
 	}
 
 	//
-	@if (str-index($string, unquote(".has#{map-get($bem, state)}")) != null) {
-		$m_index: str-index($string, unquote(".has#{map-get($bem, state)}"));
+	@if (str-index($string, unquote(".has#{$bem-modifier-separator}")) != null) {
+		$m_index: str-index($string, unquote(".has#{$bem-state-separator}"));
 	}
 
 	//

functions/_explode.scss

@@ -1,4 +1,14 @@
-//
+@charset "UTF-8";
+
+/// Explode string to get list of strings.
+///
+/// @access private
+///
+/// @param {String} $string - String which should be exploded
+/// @param {String} $separator - Separator which will explode string to pieces
+///
+/// @returns {List} - List of exploded string
+
 @function explode($string, $separator) {
 	$list: ();
 	$length: str-length($string);

functions/_get-block.scss

@@ -1,4 +1,15 @@
-//
-@function get-block($element) {
-	@return str-slice($element, 2, bem-index($element) - 1);
+@charset "UTF-8";
+
+/// Get block element from selector.
+///
+/// @access private
+///
+/// @param {String} $selector - Selector, from where we will take block
+///
+/// @requires bem-index
+///
+/// @returns {String} - Block element
+
+@function get-block($selector) {
+	@return str-slice($selector, 2, bem-index($selector) - 1);
 }

functions/_has-state.scss

@@ -1,8 +1,19 @@
-//
+@charset "UTF-8";
+
+/// Check if selector contains state.
+///
+/// @access private
+///
+/// @param {String} $selector - Selector, which we will check for state
+///
+/// @requires $bem-state-separator
+///
+/// @returns {Bool}
+
 @function has-state($selector) {
-    $separator_is: unquote(".is#{map-get($bem, state)}");
-    $separator_js: unquote(".js#{map-get($bem, state)}");
-    $separator_has: unquote(".has#{map-get($bem, state)}");
+    $separator_is: unquote(".is#{$bem-state-separator}");
+    $separator_js: unquote(".js#{$bem-state-separator}");
+    $separator_has: unquote(".has#{$bem-state-separator}");
 
 	@return str-index($selector, $separator_is) != null and str-index($selector, $separator_js) != null and str-index($selector, $separator_has) != null;
 }

functions/_implode.scss

@@ -0,0 +1,32 @@
+@charset "UTF-8";
+
+/// Implode list to get string.
+///
+/// @access private
+///
+/// @param {List} $list - List which will be imploded
+/// @param {String} $glue [''] - Separator which will glue list
+/// @param {Bool} $is-nested - List is nested or not
+///
+/// @returns {String} - Imploded list
+
+@function implode($list, $glue: '', $is-nested: false) {
+	$result: null;
+
+	//
+	@for $i from 1 through length($list) {
+		$e: nth($list, $i);
+
+		//
+		@if type-of($e) == list {
+			$result: unquote("#{$result}#{implode($e, $glue, true)}");
+		}
+
+			//
+		@else {
+			$result: if($i != length($list) or $is-nested, unquote("#{$result}#{$e}#{$glue}"), unquote("#{$result}#{$e}"));
+		}
+	}
+
+	@return $result;
+}

functions/_is-block.scss

@@ -1,4 +1,17 @@
-//
+@charset "UTF-8";
+
+/// Check if selector is block.
+///
+/// @access private
+///
+/// @param {String} $selector - Selector, which we will check for block
+///
+/// @requires is-element
+/// @requires is-modifier
+/// @requires has-state
+///
+/// @returns {Bool}
+
 @function is-block($selector) {
 	@return (not is-element($selector) and not is-modifier($selector) and not has-state($selector));
 }