lucid-ui
Version:
A UI component library from AppNexus.
72 lines • 3.03 kB
JavaScript
;
var __spreadArrays = (this && this.__spreadArrays) || function () {
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
for (var r = Array(s), k = 0, i = 0; i < il; i++)
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
r[k] = a[j];
return r;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.uniqueName = exports.lucidClassNames = exports.NAMESPACE = exports.bindClassNames = void 0;
var lodash_1 = __importDefault(require("lodash"));
var classnames_1 = __importDefault(require("classnames"));
var RANDOM_INTEGER = lodash_1.default.random(0, Number.MAX_SAFE_INTEGER);
/**
* bindClassNames
*
* Returns a version of the `classnames` functions where `&` is bound to a given
* value. The returned functions can be further bound to more specific values for
* `&` which allows your bound classnames to look closer to style selector.
*
* Examples:
* bindClassNames('lucid')('&-Button') === 'lucid-Button'
* bindClassNames('lucid').bind('&-Button')('&-active') === 'lucid-Button-active'
*/
function bindClassNames(value, variable) {
if (value === void 0) { value = ''; }
if (variable === void 0) { variable = /&/g; }
// We left `any` here because the classNames @types package doesn't export
// the right types for us to be able to use. It accepts a fairly wide range
// of input.
function cx() {
var args = [];
for (var _i = 0; _i < arguments.length; _i++) {
args[_i] = arguments[_i];
}
return lodash_1.default.map(classnames_1.default.apply(void 0, args).split(' '), function (className) {
return className.replace(variable, value);
}).join(' ');
}
return lodash_1.default.assign(cx, {
bind: function (nextValue) {
if (nextValue === void 0) { nextValue = value; }
var args = [];
for (var _i = 1; _i < arguments.length; _i++) {
args[_i - 1] = arguments[_i];
}
return bindClassNames.apply(void 0, __spreadArrays([nextValue.replace(variable, value)], args));
},
});
}
exports.bindClassNames = bindClassNames;
exports.NAMESPACE = typeof LUCID_CSS_NAMESPACE !== 'undefined' ? LUCID_CSS_NAMESPACE : 'lucid'; // eslint-disable-line no-undef
/**
* Exports a lucid-bound version of classnames, which can be make more specific
* to a component.
*
* Example:
* const cx = lucidClassNames.bind('&-Button')
*
* cx('&',{
* '&-active': true
* }, ['custom-classname']) === 'lucid-Button lucid-Button-active custom-classname'
*/
exports.lucidClassNames = bindClassNames(exports.NAMESPACE);
function uniqueName(prefix) {
return lodash_1.default.uniqueId(RANDOM_INTEGER + "-" + prefix);
}
exports.uniqueName = uniqueName;
//# sourceMappingURL=style-helpers.js.map