lucid-ui
Version:
A UI component library from Xandr.
74 lines • 3.1 kB
JavaScript
;
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
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, __spreadArray([nextValue.replace(variable, value)], args, false));
},
});
}
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("".concat(RANDOM_INTEGER, "-").concat(prefix));
}
exports.uniqueName = uniqueName;
//# sourceMappingURL=style-helpers.js.map