Skip to content

Commit b93f89f

Browse files
author
Lauren
committed
remove react16 feature
1 parent 7d82089 commit b93f89f

File tree

8 files changed

+74
-75
lines changed

8 files changed

+74
-75
lines changed

‎README.md

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,10 +35,12 @@ import 'owl.carousel/dist/assets/owl.theme.default.css';
3535

3636
// className "owl-theme" is optional
3737
<OwlCarousel
38-
className="owl-theme"
39-
loop margin={10} nav
38+
className="owl-theme"
39+
loop
40+
margin={10}
41+
nav
4042
>
41-
<div class="item"><h4>1</h4></div>
43+
<div class="item"><h4>1</h4></div>
4244
<div class="item"><h4>2</h4></div>
4345
<div class="item"><h4>3</h4></div>
4446
<div class="item"><h4>4</h4></div>

‎package.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -31,11 +31,9 @@
3131
},
3232
"devDependencies": {
3333
"@types/owl.carousel": "^2.2.1",
34-
"@types/react": "^16.3.14",
35-
"@types/react-dom": "^16.0.5",
34+
"@types/react": "^15.0.0",
35+
"@types/react-dom": "^15.0.0",
3636
"cross-env": "^5.1.5",
37-
"react": "^16.3.2",
38-
"react-dom": "^16.3.2",
3937
"rimraf": "^2.6.2",
4038
"rollup": "^0.58.2",
4139
"rollup-plugin-babel": "^3.0.4",
@@ -52,6 +50,8 @@
5250
"typescript": "^2.8.3"
5351
},
5452
"dependencies": {
55-
"owl.carousel": "~2.3.4"
53+
"owl.carousel": "~2.3.4",
54+
"react": "15",
55+
"react-dom": "15"
5656
}
5757
}

‎src/OwlCarousel.tsx

Lines changed: 16 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { Component, createRef, AllHTMLAttributes, ReactNode } from 'react';
1+
import React, { Component, AllHTMLAttributes, ReactNode, Ref } from 'react';
22
import jquery from 'jquery';
33
import { Options } from './options';
44

@@ -11,11 +11,9 @@ export type OwlCarouselProps = Options & ComponentProps;
1111

1212
export default class ReactOwlCarousel extends Component<OwlCarouselProps> {
1313
public $ele?: JQuery<HTMLElement>;
14-
15-
private container = createRef<HTMLDivElement>();
14+
private container?: HTMLDivElement | null;
1615
private propsWithoutOptions: ComponentProps;
1716
private options: Options;
18-
private children = createRef<HTMLDivElement>();
1917

2018
constructor(props: OwlCarouselProps) {
2119
super(props);
@@ -25,21 +23,19 @@ export default class ReactOwlCarousel extends Component<OwlCarouselProps> {
2523
}
2624

2725
public componentDidMount() {
28-
this.$ele = $(this.container.current!);
29-
this.$ele!.append(Array.from($(this.children.current!.children)!.clone()));
26+
this.$ele = $(this.container!);
3027
this.create();
3128
}
3229

33-
public componentDidUpdate() {
30+
public componentWillReceiveProps() {
3431
this.destory();
32+
}
3533

34+
public componentDidUpdate() {
3635
const [options, propsWithoutOptions] = filterOptions(this.props);
3736
this.options = options;
3837
this.propsWithoutOptions = propsWithoutOptions;
3938

40-
this.$ele!.html('');
41-
this.$ele!.append(Array.from($(this.children.current!.children).clone()));
42-
4339
this.create();
4440
}
4541

@@ -91,7 +87,7 @@ export default class ReactOwlCarousel extends Component<OwlCarouselProps> {
9187
public play(timeout: number, speed: number) {
9288
if (!this.$ele) throw new Error('OwlCarousel is not created');
9389

94-
if (typeof(timeout) === 'number' && typeof(speed) === 'number') {
90+
if (typeof timeout === 'number' && typeof speed === 'number') {
9591
this.$ele.trigger('play.owl.autoplay', [timeout, speed]);
9692
}
9793
else {
@@ -108,23 +104,21 @@ export default class ReactOwlCarousel extends Component<OwlCarouselProps> {
108104
public render() {
109105
const {
110106
className,
111-
children,
112107
...props,
113108
} = this.propsWithoutOptions;
114109

115110
return (
116-
<>
117-
<div
118-
className={`owl-carousel ${className}`}
119-
ref={this.container}
120-
{...props}
121-
/>
122-
<div ref={this.children} style={{ display: 'none' }}>
123-
{children}
124-
</div>
125-
</>
111+
<div
112+
className={`owl-carousel ${className}`}
113+
ref={this.containerRef}
114+
{...props}
115+
/>
126116
);
127117
}
118+
119+
private containerRef: Ref<HTMLDivElement> = (inst) => {
120+
this.container = inst;
121+
}
128122
}
129123

130124
const OPTIONS = new Set([

‎src/options.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,8 @@ export interface Options {
8888

8989
export type HandlerCallback = (...args: any[]) => void;
9090

91-
export type OnEvent = 'initialize.owl.carousel'
91+
export type OnEvent =
92+
| 'initialize.owl.carousel'
9293
| 'initialized.owl.carousel'
9394
| 'resize.owl.carousel'
9495
| 'resized.owl.carousel'
@@ -105,7 +106,8 @@ export type OnEvent = 'initialize.owl.carousel'
105106
| 'stop.owl.video'
106107
| 'play.owl.video';
107108

108-
export type TriggerEvent = 'refresh.owl.carousel'
109+
export type TriggerEvent =
110+
| 'refresh.owl.carousel'
109111
| 'next.owl.carousel'
110112
| 'prev.owl.carousel'
111113
| 'to.owl.carousel'

‎umd/OwlCarousel.d.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,12 @@ export declare type ComponentProps = Readonly<AllHTMLAttributes<HTMLDivElement>
1010
export declare type OwlCarouselProps = Options & ComponentProps;
1111
export default class ReactOwlCarousel extends Component<OwlCarouselProps> {
1212
$ele?: JQuery<HTMLElement>;
13-
private container;
13+
private container?;
1414
private propsWithoutOptions;
1515
private options;
16-
private children;
1716
constructor(props: OwlCarouselProps);
1817
componentDidMount(): void;
18+
componentWillReceiveProps(): void;
1919
componentDidUpdate(): void;
2020
next(speed: number | number[]): void;
2121
prev(speed: number | number[]): void;
@@ -25,5 +25,6 @@ export default class ReactOwlCarousel extends Component<OwlCarouselProps> {
2525
play(timeout: number, speed: number): void;
2626
stop(): void;
2727
render(): JSX.Element;
28+
private containerRef;
2829
}
2930
export * from './options';

‎umd/OwlCarousel.js

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3414,25 +3414,25 @@
34143414
__extends(ReactOwlCarousel, _super);
34153415
function ReactOwlCarousel(props) {
34163416
var _this = _super.call(this, props) || this;
3417-
_this.container = React.createRef();
3418-
_this.children = React.createRef();
3417+
_this.containerRef = function (inst) {
3418+
_this.container = inst;
3419+
};
34193420
var _a = filterOptions(_this.props), options = _a[0], propsWithoutOptions = _a[1];
34203421
_this.options = options;
34213422
_this.propsWithoutOptions = propsWithoutOptions;
34223423
return _this;
34233424
}
34243425
ReactOwlCarousel.prototype.componentDidMount = function () {
3425-
this.$ele = $(this.container.current);
3426-
this.$ele.append(Array.from($(this.children.current.children).clone()));
3426+
this.$ele = $(this.container);
34273427
this.create();
34283428
};
3429-
ReactOwlCarousel.prototype.componentDidUpdate = function () {
3429+
ReactOwlCarousel.prototype.componentWillReceiveProps = function () {
34303430
this.destory();
3431+
};
3432+
ReactOwlCarousel.prototype.componentDidUpdate = function () {
34313433
var _a = filterOptions(this.props), options = _a[0], propsWithoutOptions = _a[1];
34323434
this.options = options;
34333435
this.propsWithoutOptions = propsWithoutOptions;
3434-
this.$ele.html('');
3435-
this.$ele.append(Array.from($(this.children.current.children).clone()));
34363436
this.create();
34373437
};
34383438
ReactOwlCarousel.prototype.next = function (speed) {
@@ -3478,7 +3478,7 @@
34783478
ReactOwlCarousel.prototype.play = function (timeout, speed) {
34793479
if (!this.$ele)
34803480
throw new Error('OwlCarousel is not created');
3481-
if (typeof (timeout) === 'number' && typeof (speed) === 'number') {
3481+
if (typeof timeout === 'number' && typeof speed === 'number') {
34823482
this.$ele.trigger('play.owl.autoplay', [timeout, speed]);
34833483
}
34843484
else {
@@ -3491,10 +3491,8 @@
34913491
this.$ele.trigger('stop.owl.autoplay');
34923492
};
34933493
ReactOwlCarousel.prototype.render = function () {
3494-
var _a = this.propsWithoutOptions, className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
3495-
return (React__default.createElement(React__default.Fragment, null,
3496-
React__default.createElement("div", __assign({ className: "owl-carousel " + className, ref: this.container }, props)),
3497-
React__default.createElement("div", { ref: this.children, style: { display: 'none' } }, children)));
3494+
var _a = this.propsWithoutOptions, className = _a.className, props = __rest(_a, ["className"]);
3495+
return (React__default.createElement("div", __assign({ className: "owl-carousel " + className, ref: this.containerRef }, props)));
34983496
};
34993497
return ReactOwlCarousel;
35003498
}(React.Component));

‎umd/OwlCarousel.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎yarn.lock

Lines changed: 30 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -36,18 +36,15 @@
3636
dependencies:
3737
"@types/jquery" "*"
3838

39-
"@types/react-dom@^16.0.5":
40-
version "16.0.5"
41-
resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.0.5.tgz#a757457662e3819409229e8f86795ff37b371f96"
39+
"@types/react-dom@^15.0.0":
40+
version "15.5.7"
41+
resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-15.5.7.tgz#a5c1c8b315e925d84d59db5ee88ca7e31c5030f9"
4242
dependencies:
43-
"@types/node" "*"
44-
"@types/react" "*"
43+
"@types/react" "^15"
4544

46-
"@types/react@*", "@types/react@^16.3.14":
47-
version "16.3.14"
48-
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.3.14.tgz#f90ac6834de172e13ecca430dcb6814744225d36"
49-
dependencies:
50-
csstype "^2.2.0"
45+
"@types/react@^15", "@types/react@^15.0.0":
46+
version "15.6.15"
47+
resolved "https://registry.yarnpkg.com/@types/react/-/react-15.6.15.tgz#1856f932120311aa566f91e6d0c6e613d6448236"
5148

5249
ansi-regex@^2.0.0:
5350
version "2.1.1"
@@ -170,6 +167,14 @@ core-js@^1.0.0:
170167
version "1.2.7"
171168
resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
172169

170+
create-react-class@^15.6.0:
171+
version "15.6.3"
172+
resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036"
173+
dependencies:
174+
fbjs "^0.8.9"
175+
loose-envify "^1.3.1"
176+
object-assign "^4.1.1"
177+
173178
cross-env@^5.1.5:
174179
version "5.1.5"
175180
resolved "https://registry.yarnpkg.com/cross-env/-/cross-env-5.1.5.tgz#31daf7f3a52ef337c8ddda585f08175cce5d1fa5"
@@ -185,10 +190,6 @@ cross-spawn@^5.1.0:
185190
shebang-command "^1.2.0"
186191
which "^1.2.9"
187192

188-
csstype@^2.2.0:
189-
version "2.5.1"
190-
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.1.tgz#654231d1ddddfc3eb93da281a1144e7c14fc0bdc"
191-
192193
diff@^3.2.0:
193194
version "3.5.0"
194195
resolved "https://registry.yarnpkg.com/diff/-/diff-3.5.0.tgz#800c0dd1e0a8bfbc95835c202ad220fe317e5a12"
@@ -248,7 +249,7 @@ extglob@^0.3.1:
248249
dependencies:
249250
is-extglob "^1.0.0"
250251

251-
fbjs@^0.8.16:
252+
fbjs@^0.8.16, fbjs@^0.8.9:
252253
version "0.8.16"
253254
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db"
254255
dependencies:
@@ -583,7 +584,7 @@ promise@^7.1.1:
583584
dependencies:
584585
asap "~2.0.3"
585586

586-
prop-types@^15.6.0:
587+
prop-types@^15.5.10:
587588
version "15.6.1"
588589
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.1.tgz#36644453564255ddda391191fb3a125cbdf654ca"
589590
dependencies:
@@ -603,23 +604,24 @@ randomatic@^3.0.0:
603604
kind-of "^6.0.0"
604605
math-random "^1.0.1"
605606

606-
react-dom@^16.3.2:
607-
version "16.3.2"
608-
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.3.2.tgz#cb90f107e09536d683d84ed5d4888e9640e0e4df"
607+
react-dom@15:
608+
version "15.6.2"
609+
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.6.2.tgz#41cfadf693b757faf2708443a1d1fd5a02bef730"
609610
dependencies:
610-
fbjs "^0.8.16"
611+
fbjs "^0.8.9"
611612
loose-envify "^1.1.0"
612-
object-assign "^4.1.1"
613-
prop-types "^15.6.0"
613+
object-assign "^4.1.0"
614+
prop-types "^15.5.10"
614615

615-
react@^16.3.2:
616-
version "16.3.2"
617-
resolved "https://registry.yarnpkg.com/react/-/react-16.3.2.tgz#fdc8420398533a1e58872f59091b272ce2f91ea9"
616+
react@15:
617+
version "15.6.2"
618+
resolved "https://registry.yarnpkg.com/react/-/react-15.6.2.tgz#dba0434ab439cfe82f108f0f511663908179aa72"
618619
dependencies:
619-
fbjs "^0.8.16"
620+
create-react-class "^15.6.0"
621+
fbjs "^0.8.9"
620622
loose-envify "^1.1.0"
621-
object-assign "^4.1.1"
622-
prop-types "^15.6.0"
623+
object-assign "^4.1.0"
624+
prop-types "^15.5.10"
623625

624626
reflect-metadata@^0.1.12:
625627
version "0.1.12"

0 commit comments

Comments
 (0)