@amaui/style
Version:
CSS in JS styling solution
164 lines (163 loc) • 7.77 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.minify = exports.getID = exports.names = exports.pxToRem = exports.makeName = exports.dynamic = exports.valueResolve = exports.getRefs = exports.isAmauiSubscription = exports.is = exports.capitalize = exports.capitalizedCammelCase = exports.kebabCasetoCammelCase = exports.cammelCaseToKebabCase = void 0;
const variationWithRepetition_1 = __importDefault(require("@amaui/utils/variationWithRepetition"));
const getEnvironment_1 = __importDefault(require("@amaui/utils/getEnvironment"));
const subscription_1 = __importDefault(require("@amaui/subscription"));
const cammelCaseToKebabCase = (value) => (0, exports.is)('string', value) ? value.replace(/[A-Z]/g, v => `-${v[0]}`).toLowerCase() : value;
exports.cammelCaseToKebabCase = cammelCaseToKebabCase;
const kebabCasetoCammelCase = (value) => (0, exports.is)('string', value) ? value.replace(/-./g, v => v[1] !== undefined ? v[1].toUpperCase() : '') : value;
exports.kebabCasetoCammelCase = kebabCasetoCammelCase;
const capitalizedCammelCase = (value) => (0, exports.capitalize)((0, exports.kebabCasetoCammelCase)(value));
exports.capitalizedCammelCase = capitalizedCammelCase;
const capitalize = (value) => (0, exports.is)('string', value) ? value.charAt(0).toUpperCase() + value.slice(1) : value;
exports.capitalize = capitalize;
const is = (version, value) => {
switch (version) {
case 'string':
return typeof value === 'string';
case 'number':
return typeof value === 'number' && !Number.isNaN(value);
case 'array':
return Array.isArray(value);
case 'boolean':
return typeof value === 'boolean';
case 'null':
return value === null;
case 'undefined':
return value === undefined;
case 'object':
const isObject = typeof value === 'object' && !!value && value.constructor === Object;
return isObject;
case 'function':
return !!(value && value instanceof Function);
case 'simple':
return ((0, exports.is)('string', value) ||
(0, exports.is)('number', value) ||
(0, exports.is)('boolean', value) ||
(0, exports.is)('undefined', value) ||
(0, exports.is)('null', value));
default:
return;
}
};
exports.is = is;
const isAmauiSubscription = value => value instanceof subscription_1.default || (0, exports.is)('function', value === null || value === void 0 ? void 0 : value.emit);
exports.isAmauiSubscription = isAmauiSubscription;
const getRefs = (value) => {
const items = [];
if ((0, exports.is)('string', value)) {
const regex = /\$[a-zA-Z1-9_]+/g;
items.push(...(value.match(regex) || []).map(item => item.replace('$', '')));
}
return items;
};
exports.getRefs = getRefs;
const valueResolve = (property, value, amauiStyle) => {
var _a, _b;
const response = {
value: [],
options: {},
};
// Mange all the values
if ((0, exports.is)('string', property) && !!property.length && value !== undefined && amauiStyle) {
// String
if ((0, exports.is)('string', value))
response.value = [value];
// Number
else if ((0, exports.is)('number', value)) {
const unit = (_a = amauiStyle.subscriptions.rule.unit.map({ property, value })) === null || _a === void 0 ? void 0 : _a.value;
response.value = [(unit === null || unit === void 0 ? void 0 : unit.value) || value];
}
// Array of simple
else if ((0, exports.is)('array', value) && value.every(item => (0, exports.is)('simple', item))) {
response.value = [value.flatMap(item => (0, exports.valueResolve)(property, item, amauiStyle).value).join(' ')];
}
// Array of arrays
// Array of objects
else if ((0, exports.is)('array', value) && value.every(item => (0, exports.is)('array', item) || (0, exports.is)('object', item))) {
response.value = [value.flatMap(item => (0, exports.valueResolve)(property, item, amauiStyle).value).join(', ')];
}
// Object
else if ((0, exports.is)('object', value)) {
// Object value
if (value.value) {
const fallbacks = (value.fallbacks || []).flatMap(item => (0, exports.valueResolve)(property, item, amauiStyle).value);
response.value = [fallbacks, (0, exports.valueResolve)(property, value.value, amauiStyle).value].flat().filter(Boolean);
if (value.rule)
response.options.rule = value.rule;
}
else {
// Value plugins
const value_ = (_b = amauiStyle.subscriptions.rule.value.map({ property, value })) === null || _b === void 0 ? void 0 : _b.value;
response.value = value_ || [];
}
}
// Method
// AmauiSubscription
// For methods and AmauiSubscription leave as is
// these are only used during add method
else
response.value = [value];
}
return response;
};
exports.valueResolve = valueResolve;
const dynamic = (value) => ((0, exports.is)('function', value) ||
(0, exports.isAmauiSubscription)(value) ||
(0, exports.is)('object', value) && Object.keys(value).some(prop => (0, exports.dynamic)(value[prop])));
exports.dynamic = dynamic;
function* makeName(length_ = 2, input_ = 'abcdefghijklmnopqrstuvwxyz') {
const input = (0, exports.is)('array', input_) ? input_ : input_.split('');
let length = length_;
let value;
let methodNameGenerator = (0, variationWithRepetition_1.default)(input, length, { response: 'yield' })();
while (true) {
value = methodNameGenerator.next();
if (value === null || value === void 0 ? void 0 : value.done) {
methodNameGenerator = (0, variationWithRepetition_1.default)(input, ++length, { response: 'yield' })();
value = methodNameGenerator.next();
}
yield value.value.join('');
}
}
exports.makeName = makeName;
const pxToRem = (value, htmlFontSize = 16) => Number((value / htmlFontSize).toFixed(4));
exports.pxToRem = pxToRem;
const env = (0, getEnvironment_1.default)();
env.amaui_methods = {
makeName: makeName(),
};
const names = (value) => {
if ((0, exports.is)('object', value)) {
// Update styles, className and class
if (!value.hasOwnProperty('className'))
Object.defineProperty(value, 'className', {
get: function () { return Object.keys(value.classNames).map(item => value.classNames[item]).join(' '); }
});
if (!value.hasOwnProperty('class'))
Object.defineProperty(value, 'class', {
get: function () { return Object.keys(value.classes).map(item => value.classes[item]).join(' '); }
});
if (!value.hasOwnProperty('styles'))
value.styles = (...args) => {
const values = [];
args.forEach(arg => {
if (value.classes[arg])
values.push(value.classes[arg]);
});
return values.join(' ');
};
return value;
}
return value;
};
exports.names = names;
let i = 0;
const getID = () => `${i++}-${new Date().getTime()}`;
exports.getID = getID;
const minify = (value) => value.replace(/\n/g, '').replace(/ ?(\{|:|,|>|~) ?/g, '$1').replace(/;(\})/g, '$1');
exports.minify = minify;