@builder.io/mitosis 0.6.3 → 0.6.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -2,5 +2,6 @@ import { MitosisComponent } from '../../types/mitosis-component';
|
|
|
2
2
|
type CollectStyleOptions = {
|
|
3
3
|
prefix?: string;
|
|
4
4
|
};
|
|
5
|
+
export declare function normalizeName(name: string | undefined): string;
|
|
5
6
|
export declare const collectCss: (json: MitosisComponent, options?: CollectStyleOptions) => string;
|
|
6
7
|
export {};
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.collectCss = void 0;
|
|
6
|
+
exports.collectCss = exports.normalizeName = void 0;
|
|
7
7
|
const legacy_1 = __importDefault(require("neotraverse/legacy"));
|
|
8
8
|
const object_hash_1 = __importDefault(require("object-hash"));
|
|
9
9
|
const dash_case_1 = require("../dash-case");
|
|
@@ -20,25 +20,39 @@ const updateClassForNode = (item, className) => {
|
|
|
20
20
|
item.properties.class = trimClassStr(`${item.properties.class || ''} ${className}`);
|
|
21
21
|
}
|
|
22
22
|
};
|
|
23
|
+
function normalizeName(name) {
|
|
24
|
+
if (!name || name.trim() === '' || name.match(/^[^a-zA-Z0-9]*$/)) {
|
|
25
|
+
return '';
|
|
26
|
+
}
|
|
27
|
+
// Clean the name first
|
|
28
|
+
const cleaned = name.replace(/[^a-zA-Z0-9\-_]/g, '');
|
|
29
|
+
// If pure numeric or only contains numbers and dashes
|
|
30
|
+
if (cleaned.match(/^[0-9-]+$/)) {
|
|
31
|
+
// Extract just the numbers and format as css{number}
|
|
32
|
+
const numbers = cleaned.replace(/[^0-9]/g, '');
|
|
33
|
+
return `css${numbers}`;
|
|
34
|
+
}
|
|
35
|
+
// Remove leading numbers and dashes for other cases
|
|
36
|
+
const normalized = cleaned.replace(/^[0-9-]+(?=[a-zA-Z])/, '');
|
|
37
|
+
return normalized || '';
|
|
38
|
+
}
|
|
39
|
+
exports.normalizeName = normalizeName;
|
|
23
40
|
const collectStyles = (json, options = {}) => {
|
|
24
41
|
const styleMap = {};
|
|
25
42
|
const componentIndexes = {};
|
|
26
43
|
const componentHashes = {};
|
|
27
44
|
(0, legacy_1.default)(json).forEach(function (item) {
|
|
28
|
-
var _a
|
|
45
|
+
var _a;
|
|
29
46
|
if ((0, is_mitosis_node_1.isMitosisNode)(item)) {
|
|
30
47
|
if ((0, helpers_1.nodeHasCss)(item)) {
|
|
31
48
|
const value = (0, helpers_1.parseCssObject)((_a = item.bindings.css) === null || _a === void 0 ? void 0 : _a.code);
|
|
32
49
|
delete item.bindings.css;
|
|
33
|
-
|
|
34
|
-
const cleanedName = (_b = item.properties.$name) === null || _b === void 0 ? void 0 : _b.replace(/[^a-zA-Z0-9_-]/g, '');
|
|
35
|
-
// Remove leading numbers or dashes
|
|
36
|
-
const normalizedName = cleanedName === null || cleanedName === void 0 ? void 0 : cleanedName.replace(/^[0-9-]+/, '');
|
|
50
|
+
const normalizedName = normalizeName(item.properties.$name);
|
|
37
51
|
const componentName = normalizedName
|
|
38
52
|
? (0, dash_case_1.dashCase)(normalizedName)
|
|
39
53
|
: /^h\d$/.test(item.name || '') // don't dashcase h1 into h-1
|
|
40
54
|
? item.name
|
|
41
|
-
: (0, dash_case_1.dashCase)(item.name || 'div');
|
|
55
|
+
: (0, dash_case_1.dashCase)(normalizeName(item.name) || 'div');
|
|
42
56
|
const classNameWPrefix = `${componentName}${options.prefix ? `-${options.prefix}` : ''}`;
|
|
43
57
|
const stylesHash = (0, object_hash_1.default)(value);
|
|
44
58
|
if (componentHashes[componentName] === stylesHash) {
|
|
@@ -10,6 +10,7 @@ const object_hash_1 = __importDefault(require("object-hash"));
|
|
|
10
10
|
const capitalize_1 = require("../capitalize");
|
|
11
11
|
const is_mitosis_node_1 = require("../is-mitosis-node");
|
|
12
12
|
const is_upper_case_1 = require("../is-upper-case");
|
|
13
|
+
const collect_css_1 = require("./collect-css");
|
|
13
14
|
const helpers_1 = require("./helpers");
|
|
14
15
|
const collectStyledComponents = (json) => {
|
|
15
16
|
let styledComponentsCode = '';
|
|
@@ -22,13 +23,13 @@ const collectStyledComponents = (json) => {
|
|
|
22
23
|
const value = (0, helpers_1.parseCssObject)((_a = item.bindings.css) === null || _a === void 0 ? void 0 : _a.code);
|
|
23
24
|
delete item.bindings.css;
|
|
24
25
|
const normalizedNameProperty = item.properties.$name
|
|
25
|
-
? (0, capitalize_1.capitalize)((0, lodash_1.camelCase)(item.properties.$name
|
|
26
|
+
? (0, capitalize_1.capitalize)((0, lodash_1.camelCase)((0, collect_css_1.normalizeName)(item.properties.$name)))
|
|
26
27
|
: null;
|
|
27
28
|
const componentName = normalizedNameProperty
|
|
28
29
|
? normalizedNameProperty
|
|
29
30
|
: /^h\d$/.test(item.name || '')
|
|
30
31
|
? item.name
|
|
31
|
-
: (0, capitalize_1.capitalize)((0, lodash_1.camelCase)(item.name || 'div'));
|
|
32
|
+
: (0, capitalize_1.capitalize)((0, lodash_1.camelCase)((0, collect_css_1.normalizeName)(item.name) || 'div'));
|
|
32
33
|
const index = (componentIndexes[componentName] =
|
|
33
34
|
(componentIndexes[componentName] || 0) + 1);
|
|
34
35
|
const className = `${componentName}${componentName !== item.name && index === 1 ? '' : index}`;
|