Skip to content

Commit 5c45ad6

Browse files
mjancarikmjancarik
committed
feat: uodate to IMA@17
1 parent 86f66d4 commit 5c45ad6

36 files changed

+151
-114
lines changed

‎.eslintrc.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@ module.exports = {
1414
allow: ['warn', 'error']
1515
}],
1616

17-
'react/wrap-multilines': 0
17+
'react/wrap-multilines': 0,
18+
'react/prop-types': 0
1819
},
1920
'plugins': [
2021
'prettier',

‎example/lib/componentPositions.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { ComponentPositions } from '../../dist/main.js';
1+
import { ComponentPositions } from '../../dist/atoms.client.cjs.js';
22
import _window from './windowMock';
33

44
let componentPositions = new ComponentPositions(_window);

‎example/lib/uiComponentHelper.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { UIComponentHelper } from '../../dist/main.js';
1+
import { UIComponentHelper } from '../../dist/atoms.client.cjs.js';
22
import componentPositions from './componentPositions';
33
import _router from './routerMock';
44
import _window from './windowMock';

‎example/lib/visibility.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Window, Dispatcher } from '@ima/core';
2-
import { Visibility } from '../../dist/main.js';
2+
import { Visibility } from '../../dist/atoms.client.cjs.js';
33

44
let visibility = new Visibility(new Window(), new Dispatcher());
55

‎gulpfile.js

+2-32
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,9 @@
1-
let del = require('del');
21
let gulp = require('gulp');
3-
let babel = require('gulp-babel');
4-
let rename = require('gulp-rename');
52
let path = require('path');
63
let browserify = require('browserify');
74
let babelify = require('babelify');
85
let watchify = require('watchify');
96
let fs = require('fs');
10-
let cache = require('gulp-cached');
11-
let remember = require('gulp-remember');
127
let gulpLess = require('gulp-less');
138
let b = null;
149

@@ -18,29 +13,8 @@ let gulpConfig = {
1813
}
1914
};
2015

21-
exports.build = gulp.series(clean, compile, copy);
2216
exports.copy = copy;
2317

24-
function compile() {
25-
return gulp
26-
.src('./src/**/*.{js,jsx}')
27-
.pipe(cache('compile'))
28-
.pipe(
29-
babel({
30-
moduleIds: true,
31-
presets: ['@babel/preset-react'],
32-
plugins: ['@babel/plugin-transform-modules-commonjs']
33-
})
34-
)
35-
.pipe(remember('compile'))
36-
.pipe(
37-
rename(path => {
38-
path.extname = '.js';
39-
})
40-
)
41-
.pipe(gulp.dest('./dist'));
42-
}
43-
4418
function bundle() {
4519
if (!b) {
4620
b = createBrowserifyInstance();
@@ -92,11 +66,7 @@ function copy() {
9266
return gulp.src(['./src/**/*.less']).pipe(gulp.dest('./dist'));
9367
}
9468

95-
function clean() {
96-
return del(['./dist']);
97-
}
98-
99-
exports['dev'] = gulp.series(compile, less, bundle, dev);
69+
exports['dev'] = gulp.series(less, bundle, dev);
10070
function dev() {
10171
gulp.watch('./src/**/*.less', less);
10272
gulp.watch(
@@ -106,7 +76,7 @@ function dev() {
10676
},
10777
bundle
10878
);
109-
gulp.watch('./src/**/*.{js,jsx}', gulp.series(compile, bundle));
79+
gulp.watch('./src/**/*.{js,jsx}', gulp.series(bundle));
11080
}
11181

11282
if (gulpConfig.onTerminate) {

‎index.client.cjs.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
'use strict';
2+
3+
module.exports = require('./dist/atoms.client.cjs.js');

‎index.js

-3
This file was deleted.

‎index.server.cjs.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
'use strict';
2+
3+
module.exports = require('./dist/atoms.server.cjs.js');

‎index.server.esm.js

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from './dist/atoms.server.esm';

‎package.json

+12-8
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@
22
"name": "@ima/plugin-atoms",
33
"version": "1.3.0",
44
"description": "IMA.js UI React atoms",
5-
"main": "index.js",
5+
"main": "index.server.cjs.js",
6+
"browser": "index.client.cjs.js",
7+
"module": "index.server.esm.js",
68
"scripts": {
79
"preversion": "npm test && npm run lint && npm run build",
810
"postversion": "npm run build && npm run changelog && git commit -am $npm_package_version && git tag $npm_package_version && git push && git push --tags && npm publish",
@@ -11,7 +13,7 @@
1113
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 1",
1214
"commit": "node_modules/.bin/git-cz",
1315
"copy": "node_modules/.bin/gulp copy",
14-
"build": "node_modules/.bin/gulp build",
16+
"build": "node_modules/.bin/rollup --config",
1517
"dev": "node_modules/.bin/gulp dev"
1618
},
1719
"keywords": [
@@ -39,6 +41,7 @@
3941
"@commitlint/cli": "^8.2.0",
4042
"@commitlint/config-conventional": "^8.2.0",
4143
"@ima/core": "17.0.1",
44+
"@ima/helpers": "^17.0.1",
4245
"babel-eslint": "^10.0.3",
4346
"babel-jest": "^24.9.0",
4447
"babelify": "10.0.0",
@@ -47,7 +50,6 @@
4750
"commitizen": "^4.0.3",
4851
"conventional-changelog-cli": "^2.0.28",
4952
"cz-conventional-changelog": "^3.0.2",
50-
"del": "5.1.0",
5153
"enzyme": "3.10.0",
5254
"enzyme-adapter-react-16": "^1.15.1",
5355
"enzyme-to-json": "^3.4.3",
@@ -59,17 +61,19 @@
5961
"eslint-plugin-prettier": "^3.1.1",
6062
"eslint-plugin-react": "^7.17.0",
6163
"gulp": "4.0.2",
62-
"gulp-babel": "8.0.0",
63-
"gulp-cached": "1.1.1",
6464
"gulp-less": "4.0.1",
65-
"gulp-remember": "1.0.1",
66-
"gulp-rename": "2.0.0",
6765
"husky": "^3.1.0",
6866
"ima-clientify": "^0.1.2",
6967
"jest": "^24.9.0",
7068
"prettier": "^1.19.1",
7169
"react": "^16.7.0",
7270
"react-dom": "^16.12.0",
71+
"rollup": "^1.27.8",
72+
"rollup-plugin-babel": "^4.3.3",
73+
"rollup-plugin-jscc": "^1.0.0",
74+
"rollup-plugin-json": "^4.0.0",
75+
"rollup-plugin-node-resolve": "^5.2.0",
76+
"rollup-plugin-replace": "^2.2.0",
7377
"to-mock": "^1.5.4",
7478
"watchify": "3.11.1"
7579
},
@@ -88,7 +92,7 @@
8892
},
8993
"peerDependencies": {
9094
"react": "16.x",
91-
"ima": "17.x"
95+
"@ima/core": "17.x"
9296
},
9397
"engines": {
9498
"npm": ">=4 <6"

‎rollup.config.js

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import resolve from 'rollup-plugin-node-resolve';
2+
import json from 'rollup-plugin-json';
3+
import jscc from 'rollup-plugin-jscc';
4+
import babel from 'rollup-plugin-babel';
5+
6+
function generateConfig(environemnt) {
7+
return {
8+
external: [
9+
'react',
10+
'react-dom',
11+
'infinite-circle',
12+
'@ima/helpers',
13+
'@ima/core'
14+
],
15+
input: 'src/main.js',
16+
treeshake: {
17+
pureExternalModules: true
18+
},
19+
output: [
20+
{
21+
file: `./dist/atoms.${environemnt}.cjs.js`,
22+
format: 'cjs',
23+
exports: 'named'
24+
},
25+
{
26+
file: `./dist/atoms.${environemnt}.esm.js`,
27+
format: 'esm',
28+
exports: 'named'
29+
}
30+
],
31+
plugins: [
32+
resolve({
33+
extensions: ['.mjs', '.js', '.jsx', '.json']
34+
}),
35+
babel({
36+
moduleIds: true,
37+
presets: ['@babel/preset-react']
38+
}),
39+
json({
40+
preferConst: true, // Default: false
41+
compact: true, // Default: false
42+
namedExports: true // Default: true
43+
}),
44+
jscc({
45+
values: { _SERVER: environemnt === 'server' }
46+
})
47+
]
48+
};
49+
}
50+
51+
const config = [generateConfig('server'), generateConfig('client')];
52+
53+
export default config;

‎src/headline/Headline.jsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { PageContext, AbstractPureComponent } from '@ima/core';
1+
import { PageContext } from '@ima/core';
22
import React from 'react';
33

44
/**
@@ -7,7 +7,7 @@ import React from 'react';
77
* @namespace ima.ui.atom.headline
88
* @module ima.ui.atom
99
*/
10-
export default class Headline extends AbstractPureComponent {
10+
export default class Headline extends React.PureComponent {
1111
static get contextType() {
1212
return PageContext;
1313
}
@@ -27,7 +27,7 @@ export default class Headline extends AbstractPureComponent {
2727
render() {
2828
let headline = null;
2929
let { type: Type, id, mode, text, className, children, style } = this.props;
30-
let helper = this.utils.$UIComponentHelper;
30+
let helper = this.context.$Utils.$UIComponentHelper;
3131
let computedClassName = helper.cssClasses(
3232
{
3333
['atm-headline']: true,

‎src/headline/Headline1.jsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { AbstractPureComponent } from '@ima/core';
21
import React from 'react';
32
import Headline from './Headline';
43

@@ -8,7 +7,7 @@ import Headline from './Headline';
87
* @namespace ima.ui.atom.headline
98
* @module ima.ui.atom
109
*/
11-
export default class Headline1 extends AbstractPureComponent {
10+
export default class Headline1 extends React.PureComponent {
1211
render() {
1312
return <Headline {...this.props} type="h1" />;
1413
}

‎src/headline/Headline2.jsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { AbstractPureComponent } from '@ima/core';
21
import React from 'react';
32
import Headline from './Headline';
43

@@ -8,7 +7,7 @@ import Headline from './Headline';
87
* @namespace ima.ui.atom.headline
98
* @module ima.ui.atom
109
*/
11-
export default class Headline2 extends AbstractPureComponent {
10+
export default class Headline2 extends React.PureComponent {
1211
render() {
1312
return <Headline {...this.props} type="h2" />;
1413
}

‎src/headline/Headline3.jsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { AbstractPureComponent } from '@ima/core';
21
import React from 'react';
32
import Headline from './Headline';
43

@@ -8,7 +7,7 @@ import Headline from './Headline';
87
* @namespace ima.ui.atom.headline
98
* @module ima.ui.atom
109
*/
11-
export default class Headline3 extends AbstractPureComponent {
10+
export default class Headline3 extends React.PureComponent {
1211
render() {
1312
return <Headline {...this.props} type="h3" />;
1413
}

‎src/headline/Headline4.jsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { AbstractPureComponent } from '@ima/core';
21
import React from 'react';
32
import Headline from './Headline';
43

@@ -8,7 +7,7 @@ import Headline from './Headline';
87
* @namespace ima.ui.atom.headline
98
* @module ima.ui.atom
109
*/
11-
export default class Headline4 extends AbstractPureComponent {
10+
export default class Headline4 extends React.PureComponent {
1211
render() {
1312
return <Headline {...this.props} type="h4" />;
1413
}

‎src/headline/Headline5.jsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { AbstractPureComponent } from '@ima/core';
21
import React from 'react';
32
import Headline from './Headline';
43

@@ -8,7 +7,7 @@ import Headline from './Headline';
87
* @namespace ima.ui.atom.headline
98
* @module ima.ui.atom
109
*/
11-
export default class Headline5 extends AbstractPureComponent {
10+
export default class Headline5 extends React.PureComponent {
1211
render() {
1312
return <Headline {...this.props} type="h5" />;
1413
}

‎src/headline/Headline6.jsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { AbstractPureComponent } from '@ima/core';
21
import React from 'react';
32
import Headline from './Headline';
43

@@ -8,7 +7,7 @@ import Headline from './Headline';
87
* @namespace ima.ui.atom.headline
98
* @module ima.ui.atom
109
*/
11-
export default class Headline6 extends AbstractPureComponent {
10+
export default class Headline6 extends React.PureComponent {
1211
render() {
1312
return <Headline {...this.props} type="h6" />;
1413
}

‎src/iframe/AmpIframe.jsx

+5-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { PageContext, AbstractPureComponent } from '@ima/core';
1+
import { PageContext } from '@ima/core';
22
import React from 'react';
33

44
// @server-side class AmpIframe extends __VARIABLE__ {__CLEAR__}\nexports.default = AmpIframe;
@@ -9,13 +9,14 @@ import React from 'react';
99
* @namespace ima.ui.atom.iframe
1010
* @module ima.ui.atom
1111
*/
12-
export default class AmpIframe extends AbstractPureComponent {
12+
export default class AmpIframe extends React.PureComponent {
13+
//#if _SERVER
1314
static get contextType() {
1415
return PageContext;
1516
}
1617

1718
render() {
18-
let helper = this.utils.$UIComponentHelper;
19+
let helper = this.context.$Utils.$UIComponentHelper;
1920
let {
2021
src,
2122
srcDoc,
@@ -62,4 +63,5 @@ export default class AmpIframe extends AbstractPureComponent {
6263
</amp-iframe>
6364
);
6465
}
66+
//#endif
6567
}

‎src/iframe/HtmlIframe.jsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { PageContext, AbstractPureComponent } from '@ima/core';
1+
import { PageContext } from '@ima/core';
22
import React from 'react';
33
import Sizer from '../sizer/Sizer';
44

@@ -11,7 +11,7 @@ const MIN_EXTENDED_PADDING = 500;
1111
* @module ima.ui.atom
1212
*/
1313

14-
export default class HtmlIframe extends AbstractPureComponent {
14+
export default class HtmlIframe extends React.PureComponent {
1515
static get contextType() {
1616
return PageContext;
1717
}
@@ -34,8 +34,8 @@ export default class HtmlIframe extends AbstractPureComponent {
3434

3535
this._rootElement = React.createRef();
3636

37-
this._helper = this.utils.$UIComponentHelper;
38-
this._settings = this.utils.$Settings;
37+
this._helper = this.context.$Utils.$UIComponentHelper;
38+
this._settings = this.context.$Utils.$Settings;
3939
}
4040

4141
get useIntersectionObserver() {

0 commit comments

Comments
 (0)