Skip to content

Commit 3444794

Browse files
Hyperkid123Hyperkid123
committed
Use env based dependencies in PF3 mapper.
1 parent 4bbe3f1 commit 3444794

11 files changed

Lines changed: 116 additions & 140 deletions

File tree

‎babel.config.js‎

Lines changed: 39 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,42 @@
1-
const createIconsTransformPlugin = [
2-
'transform-imports',
3-
{
4-
'@patternfly/react-icons': {
5-
transform: (importName) =>
6-
`@patternfly/react-icons/dist/js/icons/${importName.split(/(?=[A-Z])/).join('-').toLowerCase()}`,
7-
preventFullImport: true,
8-
},
9-
},
10-
];
11-
1+
const camelToSnake = (string) => {
2+
return string
3+
.replace(/[\w]([A-Z])/g, function(m) {
4+
return m[0] + '-' + m[1];
5+
})
6+
.toLowerCase();
7+
};
128

139
module.exports = {
14-
"presets": ["@babel/preset-env", "@babel/preset-react"],
15-
"plugins": ["@babel/plugin-syntax-dynamic-import", "lodash", "@babel/plugin-proposal-class-properties", createIconsTransformPlugin ]
10+
presets: ["@babel/preset-env", "@babel/preset-react"],
11+
plugins: ["@babel/plugin-syntax-dynamic-import", "lodash", "@babel/plugin-proposal-class-properties" ],
12+
env: {
13+
cjs: {
14+
plugins: [
15+
[
16+
'transform-imports',
17+
{
18+
'@data-driven-forms/react-form-renderer': {
19+
transform: (importName) => `@data-driven-forms/react-form-renderer/dist/cjs/${camelToSnake(importName)}`,
20+
preventFullImport: true
21+
}
22+
},
23+
'@data-driven-forms/react-form-renderer-CJS'
24+
],
25+
]
26+
},
27+
esm: {
28+
plugins: [
29+
[
30+
'transform-imports',
31+
{
32+
'@data-driven-forms/react-form-renderer': {
33+
transform: (importName) => `@data-driven-forms/react-form-renderer/dist/esm/${camelToSnake(importName)}`,
34+
preventFullImport: true
35+
}
36+
},
37+
'@data-driven-forms/react-form-renderer-ESM'
38+
],
39+
]
40+
}
41+
}
1642
}

‎packages/common/babel.config.js‎

Lines changed: 50 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -10,29 +10,11 @@ const mapper = {
1010
TextListItemVariants: 'TextListItem'
1111
};
1212

13-
const camelToSnake = (string) => {
14-
return string
15-
.replace(/[\w]([A-Z])/g, function(m) {
16-
return m[0] + '-' + m[1];
17-
})
18-
.toLowerCase();
19-
};
20-
2113
module.exports = {
2214
extends: '../../babel.config.js',
2315
env: {
2416
cjs: {
2517
plugins: [
26-
[
27-
'transform-imports',
28-
{
29-
'@data-driven-forms/react-form-renderer': {
30-
transform: (importName) => `@data-driven-forms/react-form-renderer/dist/cjs/${camelToSnake(importName)}`,
31-
preventFullImport: true
32-
}
33-
},
34-
'@data-driven-forms/react-form-renderer-CJS'
35-
],
3618
[
3719
'transform-imports',
3820
{
@@ -58,7 +40,6 @@ module.exports = {
5840
},
5941
'react-core-CJS'
6042
],
61-
6243
[
6344
'transform-imports',
6445
{
@@ -72,21 +53,36 @@ module.exports = {
7253
}
7354
},
7455
'react-icons-CJS'
75-
]
76-
]
77-
},
78-
esm: {
79-
plugins: [
56+
],
8057
[
8158
'transform-imports',
8259
{
83-
'@data-driven-forms/react-form-renderer': {
84-
transform: (importName) => `@data-driven-forms/react-form-renderer/dist/esm/${camelToSnake(importName)}`,
85-
preventFullImport: true
60+
'patternfly-react': {
61+
transform: (importName) => {
62+
let res;
63+
const files = glob.sync(
64+
path.resolve(__dirname, `../../node_modules/patternfly-react/dist/js/**/${mapper[importName] || importName}.js`)
65+
);
66+
if (files.length > 0) {
67+
res = files[0];
68+
} else {
69+
throw new Error(`File with importName ${importName} does not exist`);
70+
}
71+
72+
res = res.replace(path.resolve(__dirname, '../../node_modules/'), '');
73+
res = res.replace(/^\//, '');
74+
return res;
75+
},
76+
preventFullImport: false,
77+
skipDefaultConversion: false
8678
}
8779
},
88-
'@data-driven-forms/react-form-renderer-ESM'
89-
],
80+
'pf3-react-CJS'
81+
]
82+
]
83+
},
84+
esm: {
85+
plugins: [
9086
[
9187
'transform-imports',
9288
{
@@ -126,6 +122,31 @@ module.exports = {
126122
}
127123
},
128124
'react-icons-ESM'
125+
],
126+
[
127+
'transform-imports',
128+
{
129+
'patternfly-react': {
130+
transform: (importName) => {
131+
let res;
132+
const files = glob.sync(
133+
path.resolve(__dirname, `../../node_modules/patternfly-react/dist/esm/**/${mapper[importName] || importName}.js`)
134+
);
135+
if (files.length > 0) {
136+
res = files[0];
137+
} else {
138+
throw new Error(`File with importName ${importName} does not exist`);
139+
}
140+
141+
res = res.replace(path.resolve(__dirname, '../../node_modules/'), '');
142+
res = res.replace(/^\//, '');
143+
return res;
144+
},
145+
preventFullImport: false,
146+
skipDefaultConversion: false
147+
}
148+
},
149+
'pf3-react-ESM'
129150
]
130151
]
131152
}

‎packages/pf3-component-mapper/package.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,10 @@
77
"license": "Apache-2.0",
88
"scripts": {
99
"start": "webpack-dev-server --env dev --config ./config/webpack.config.js --open --hot",
10-
"build": "rollup -c ./rollup.config.js",
10+
"build": "yarn build:cjs && yarn build:esm && yarn build:umd",
11+
"build:cjs": "BABEL_ENV=cjs rollup -c ./rollup.config.js --format=cjs --environment FORMAT:cjs",
12+
"build:esm": "BABEL_ENV=esm rollup -c ./rollup.config.js --format=esm --environment FORMAT:esm",
13+
"build:umd": "rollup -c ./rollup.config.js --format=umd --environment FORMAT:umd",
1114
"vendor": "webpack --env vendor --config ./config/webpack.config.js",
1215
"release": "semantic-release"
1316
},

‎packages/pf3-component-mapper/rollup.config.js‎

Lines changed: 17 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ const globals = {
3838
const babelOptions = {
3939
exclude: /node_modules/,
4040
runtimeHelpers: true,
41-
configFile: '../../babel.config.js'
41+
configFile: './babel.config.js'
4242
};
4343

4444
const commonjsOptions = {
@@ -67,31 +67,19 @@ const plugins = [
6767
sourcemaps()
6868
];
6969

70-
export default [
71-
...['cjs', 'esm'].map((env) => ({
72-
input: ['./src/index.js', ...outputPaths],
73-
output: {
74-
dir: `./dist/${env}`,
75-
format: env,
76-
name: '@data-driven-forms/pf3-component-mapper',
77-
exports: 'named',
78-
globals,
79-
sourcemap: true
80-
},
81-
external: pf3Externals,
82-
plugins
83-
})),
84-
{
85-
input: './src/index.js',
86-
output: {
87-
file: `./dist/umd/index.js`,
88-
format: 'umd',
89-
name: '@data-driven-forms/pf3-component-mapper',
90-
exports: 'named',
91-
globals,
92-
sourcemap: true
93-
},
94-
external: pf3Externals,
95-
plugins
96-
}
97-
];
70+
export default {
71+
input: process.env.FORMAT === 'umd' ? './src/index.js' : ['./src/index.js', ...outputPaths],
72+
output: {
73+
...(process.env.FORMAT === 'umd'
74+
? {
75+
file: `./dist/umd/index.js`
76+
}
77+
: { dir: `./dist/${process.env.FORMAT}` }),
78+
name: '@data-driven-forms/pf3-component-mapper',
79+
exports: 'named',
80+
globals,
81+
sourcemap: true
82+
},
83+
external: pf3Externals,
84+
plugins
85+
};

‎packages/pf3-component-mapper/src/common/form-wrapper.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import { FormGroup as Pf3FormGroup, ControlLabel } from 'patternfly-react/dist/js/components/Form';
4-
import { FieldLevelHelp } from 'patternfly-react/dist/js/components/FieldLevelHelp';
3+
import { FormGroup as Pf3FormGroup, ControlLabel, FieldLevelHelp } from 'patternfly-react';
54
import { validationError } from '../form-fields/helpers';
65
import RequiredLabel from '../form-fields/required-label';
76
import renderHelperText from './render-helper-text';

‎packages/pf3-component-mapper/src/common/render-helper-text.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { HelpBlock } from 'patternfly-react/dist/js/components/Form';
2+
import { HelpBlock } from 'patternfly-react';
33

44
const renderHelperText = (error, description) =>
55
error ? ( // eslint-disable-line no-nested-ternary

‎packages/pf3-component-mapper/src/files/checkbox.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import Pf3Checkbox from 'patternfly-react/dist/js/components/Form/Checkbox';
4-
import { FieldLevelHelp } from 'patternfly-react/dist/js/components/FieldLevelHelp';
3+
import { FieldLevelHelp, Checkbox as Pf3Checkbox } from 'patternfly-react';
54
import MultipleChoiceList from '../form-fields/multiple-choice-list';
65
import FormGroup from '../common/form-wrapper';
76
import RequiredLabel from '../form-fields/required-label';

‎packages/pf3-component-mapper/src/files/layout-components.js‎

Lines changed: 0 additions & 60 deletions
This file was deleted.

‎packages/pf3-component-mapper/src/files/text-field.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
33

4-
import FormControl from 'patternfly-react/dist/js/components/Form/FormControl';
4+
import { FormControl } from 'patternfly-react';
55
import FormGroup from '../common/form-wrapper';
66
import { useFieldApi } from '@data-driven-forms/react-form-renderer';
77

‎packages/pf3-component-mapper/src/files/textarea.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
33

4-
import FormControl from 'patternfly-react/dist/js/components/Form/FormControl';
4+
import { FormControl } from 'patternfly-react';
55
import FormGroup from '../common/form-wrapper';
66
import { useFieldApi } from '@data-driven-forms/react-form-renderer';
77

0 commit comments

Comments
 (0)