@yoobic/yobi 8.2.0-1 → 8.2.0-2

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.
@@ -36,11 +36,6 @@ const YooWalkthroughComponent = class {
36
36
  (_a = this.animations[this.activeEntry]) === null || _a === void 0 ? void 0 : _a.play();
37
37
  }
38
38
  }
39
- onAnimationLoaded(index) {
40
- if (!this.animated) {
41
- this.animations[index].goToLastFrameAndStop();
42
- }
43
- }
44
39
  onSlideChanged() {
45
40
  var _a;
46
41
  (_a = this.slides) === null || _a === void 0 ? void 0 : _a.getActiveIndex().then((index) => {
@@ -55,7 +50,7 @@ const YooWalkthroughComponent = class {
55
50
  }
56
51
  render() {
57
52
  const isLastSlide = this.entries.length - 1 === this.activeEntry;
58
- return (index.h(index.Host, null, index.h("yoo-ion-slides", { ref: (slides) => (this.slides = slides), initialSlide: this.activeEntry, navigation: false, pager: true, onIonSlideWillChange: () => this.onSlideChanged() }, this.entries.map(({ title, subtitle, animation }, index$2) => (index.h("yoo-ion-slide", null, !!this.logo && index.h("yoo-img", { contained: true, ignoreWidth: true, src: this.logo, svgOptions: { afterLoad: (_, svgString) => index$1.replaceSVGColors(svgString) } }), index.h("yoo-lottie", { ref: (animation) => (this.animations[index$2] = animation), type: animation, onLoaded: () => this.onAnimationLoaded(index$2) }), index.h("h1", null, index$1.translate(title)), index.h("p", null, index$1.translate(subtitle)))))), isLastSlide && (index.h("yoo-button", { class: "finish", color: "app-color", key: "finish", size: "large", onClick: () => this.finish.emit() }, index$1.translate('GETSTARTED'))), !isLastSlide && (index.h("yoo-button", { class: "skip", color: "stable", fill: "transparent", key: "skip", onClick: () => this.skip.emit() }, index$1.translate('YOOBICSKIP').toUpperCase())), !isLastSlide && (index.h("yoo-button", { class: "next", color: "app-color", fill: "transparent", key: "next", onClick: () => this.slides.slideNext(300) }, index$1.translate('YOOBICNEXT').toUpperCase()))));
53
+ return (index.h(index.Host, null, index.h("yoo-ion-slides", { ref: (slides) => (this.slides = slides), initialSlide: this.activeEntry, navigation: false, pager: true, onIonSlideWillChange: () => this.onSlideChanged() }, this.entries.map(({ title, subtitle, animation }, index$2) => (index.h("yoo-ion-slide", null, !!this.logo && index.h("yoo-img", { contained: true, ignoreWidth: true, src: this.logo, svgOptions: { afterLoad: (_, svgString) => index$1.replaceSVGColors(svgString) } }), index.h("yoo-lottie", { ref: (animation) => (this.animations[index$2] = animation), type: animation, animated: this.animated }), index.h("h1", null, index$1.translate(title)), index.h("p", null, index$1.translate(subtitle)))))), isLastSlide && (index.h("yoo-button", { class: "finish", color: "app-color", key: "finish", size: "large", onClick: () => this.finish.emit() }, index$1.translate('GETSTARTED'))), !isLastSlide && (index.h("yoo-button", { class: "skip", color: "stable", fill: "transparent", key: "skip", onClick: () => this.skip.emit() }, index$1.translate('YOOBICSKIP').toUpperCase())), !isLastSlide && (index.h("yoo-button", { class: "next", color: "app-color", fill: "transparent", key: "next", onClick: () => this.slides.slideNext(300) }, index$1.translate('YOOBICNEXT').toUpperCase()))));
59
54
  }
60
55
  };
61
56
  YooWalkthroughComponent.style = walkthroughCss;
@@ -22,11 +22,6 @@ export class YooWalkthroughComponent {
22
22
  (_a = this.animations[this.activeEntry]) === null || _a === void 0 ? void 0 : _a.play();
23
23
  }
24
24
  }
25
- onAnimationLoaded(index) {
26
- if (!this.animated) {
27
- this.animations[index].goToLastFrameAndStop();
28
- }
29
- }
30
25
  onSlideChanged() {
31
26
  var _a;
32
27
  (_a = this.slides) === null || _a === void 0 ? void 0 : _a.getActiveIndex().then((index) => {
@@ -44,7 +39,7 @@ export class YooWalkthroughComponent {
44
39
  return (h(Host, null,
45
40
  h("yoo-ion-slides", { ref: (slides) => (this.slides = slides), initialSlide: this.activeEntry, navigation: false, pager: true, onIonSlideWillChange: () => this.onSlideChanged() }, this.entries.map(({ title, subtitle, animation }, index) => (h("yoo-ion-slide", null,
46
41
  !!this.logo && h("yoo-img", { contained: true, ignoreWidth: true, src: this.logo, svgOptions: { afterLoad: (_, svgString) => replaceSVGColors(svgString) } }),
47
- h("yoo-lottie", { ref: (animation) => (this.animations[index] = animation), type: animation, onLoaded: () => this.onAnimationLoaded(index) }),
42
+ h("yoo-lottie", { ref: (animation) => (this.animations[index] = animation), type: animation, animated: this.animated }),
48
43
  h("h1", null, translate(title)),
49
44
  h("p", null, translate(subtitle)))))),
50
45
  isLastSlide && (h("yoo-button", { class: "finish", color: "app-color", key: "finish", size: "large", onClick: () => this.finish.emit() }, translate('GETSTARTED'))),
@@ -32,11 +32,6 @@ const YooWalkthroughComponent = class {
32
32
  (_a = this.animations[this.activeEntry]) === null || _a === void 0 ? void 0 : _a.play();
33
33
  }
34
34
  }
35
- onAnimationLoaded(index) {
36
- if (!this.animated) {
37
- this.animations[index].goToLastFrameAndStop();
38
- }
39
- }
40
35
  onSlideChanged() {
41
36
  var _a;
42
37
  (_a = this.slides) === null || _a === void 0 ? void 0 : _a.getActiveIndex().then((index) => {
@@ -51,7 +46,7 @@ const YooWalkthroughComponent = class {
51
46
  }
52
47
  render() {
53
48
  const isLastSlide = this.entries.length - 1 === this.activeEntry;
54
- return (h(Host, null, h("yoo-ion-slides", { ref: (slides) => (this.slides = slides), initialSlide: this.activeEntry, navigation: false, pager: true, onIonSlideWillChange: () => this.onSlideChanged() }, this.entries.map(({ title, subtitle, animation }, index) => (h("yoo-ion-slide", null, !!this.logo && h("yoo-img", { contained: true, ignoreWidth: true, src: this.logo, svgOptions: { afterLoad: (_, svgString) => replaceSVGColors(svgString) } }), h("yoo-lottie", { ref: (animation) => (this.animations[index] = animation), type: animation, onLoaded: () => this.onAnimationLoaded(index) }), h("h1", null, translate(title)), h("p", null, translate(subtitle)))))), isLastSlide && (h("yoo-button", { class: "finish", color: "app-color", key: "finish", size: "large", onClick: () => this.finish.emit() }, translate('GETSTARTED'))), !isLastSlide && (h("yoo-button", { class: "skip", color: "stable", fill: "transparent", key: "skip", onClick: () => this.skip.emit() }, translate('YOOBICSKIP').toUpperCase())), !isLastSlide && (h("yoo-button", { class: "next", color: "app-color", fill: "transparent", key: "next", onClick: () => this.slides.slideNext(300) }, translate('YOOBICNEXT').toUpperCase()))));
49
+ return (h(Host, null, h("yoo-ion-slides", { ref: (slides) => (this.slides = slides), initialSlide: this.activeEntry, navigation: false, pager: true, onIonSlideWillChange: () => this.onSlideChanged() }, this.entries.map(({ title, subtitle, animation }, index) => (h("yoo-ion-slide", null, !!this.logo && h("yoo-img", { contained: true, ignoreWidth: true, src: this.logo, svgOptions: { afterLoad: (_, svgString) => replaceSVGColors(svgString) } }), h("yoo-lottie", { ref: (animation) => (this.animations[index] = animation), type: animation, animated: this.animated }), h("h1", null, translate(title)), h("p", null, translate(subtitle)))))), isLastSlide && (h("yoo-button", { class: "finish", color: "app-color", key: "finish", size: "large", onClick: () => this.finish.emit() }, translate('GETSTARTED'))), !isLastSlide && (h("yoo-button", { class: "skip", color: "stable", fill: "transparent", key: "skip", onClick: () => this.skip.emit() }, translate('YOOBICSKIP').toUpperCase())), !isLastSlide && (h("yoo-button", { class: "next", color: "app-color", fill: "transparent", key: "next", onClick: () => this.slides.slideNext(300) }, translate('YOOBICNEXT').toUpperCase()))));
55
50
  }
56
51
  };
57
52
  YooWalkthroughComponent.style = walkthroughCss;
@@ -32,11 +32,6 @@ const YooWalkthroughComponent = class {
32
32
  (_a = this.animations[this.activeEntry]) === null || _a === void 0 ? void 0 : _a.play();
33
33
  }
34
34
  }
35
- onAnimationLoaded(index) {
36
- if (!this.animated) {
37
- this.animations[index].goToLastFrameAndStop();
38
- }
39
- }
40
35
  onSlideChanged() {
41
36
  var _a;
42
37
  (_a = this.slides) === null || _a === void 0 ? void 0 : _a.getActiveIndex().then((index) => {
@@ -51,7 +46,7 @@ const YooWalkthroughComponent = class {
51
46
  }
52
47
  render() {
53
48
  const isLastSlide = this.entries.length - 1 === this.activeEntry;
54
- return (h(Host, null, h("yoo-ion-slides", { ref: (slides) => (this.slides = slides), initialSlide: this.activeEntry, navigation: false, pager: true, onIonSlideWillChange: () => this.onSlideChanged() }, this.entries.map(({ title, subtitle, animation }, index) => (h("yoo-ion-slide", null, !!this.logo && h("yoo-img", { contained: true, ignoreWidth: true, src: this.logo, svgOptions: { afterLoad: (_, svgString) => replaceSVGColors(svgString) } }), h("yoo-lottie", { ref: (animation) => (this.animations[index] = animation), type: animation, onLoaded: () => this.onAnimationLoaded(index) }), h("h1", null, translate(title)), h("p", null, translate(subtitle)))))), isLastSlide && (h("yoo-button", { class: "finish", color: "app-color", key: "finish", size: "large", onClick: () => this.finish.emit() }, translate('GETSTARTED'))), !isLastSlide && (h("yoo-button", { class: "skip", color: "stable", fill: "transparent", key: "skip", onClick: () => this.skip.emit() }, translate('YOOBICSKIP').toUpperCase())), !isLastSlide && (h("yoo-button", { class: "next", color: "app-color", fill: "transparent", key: "next", onClick: () => this.slides.slideNext(300) }, translate('YOOBICNEXT').toUpperCase()))));
49
+ return (h(Host, null, h("yoo-ion-slides", { ref: (slides) => (this.slides = slides), initialSlide: this.activeEntry, navigation: false, pager: true, onIonSlideWillChange: () => this.onSlideChanged() }, this.entries.map(({ title, subtitle, animation }, index) => (h("yoo-ion-slide", null, !!this.logo && h("yoo-img", { contained: true, ignoreWidth: true, src: this.logo, svgOptions: { afterLoad: (_, svgString) => replaceSVGColors(svgString) } }), h("yoo-lottie", { ref: (animation) => (this.animations[index] = animation), type: animation, animated: this.animated }), h("h1", null, translate(title)), h("p", null, translate(subtitle)))))), isLastSlide && (h("yoo-button", { class: "finish", color: "app-color", key: "finish", size: "large", onClick: () => this.finish.emit() }, translate('GETSTARTED'))), !isLastSlide && (h("yoo-button", { class: "skip", color: "stable", fill: "transparent", key: "skip", onClick: () => this.skip.emit() }, translate('YOOBICSKIP').toUpperCase())), !isLastSlide && (h("yoo-button", { class: "next", color: "app-color", fill: "transparent", key: "next", onClick: () => this.slides.slideNext(300) }, translate('YOOBICNEXT').toUpperCase()))));
55
50
  }
56
51
  };
57
52
  YooWalkthroughComponent.style = walkthroughCss;
@@ -32,7 +32,6 @@ export declare class YooWalkthroughComponent {
32
32
  private animations;
33
33
  private slides;
34
34
  componentDidLoad(): void;
35
- onAnimationLoaded(index: number): void;
36
35
  onSlideChanged(): void;
37
36
  render(): any;
38
37
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yoobic/yobi",
3
- "version": "8.2.0-1",
3
+ "version": "8.2.0-2",
4
4
  "description": "Yobi - Yoobic Design System",
5
5
  "module": "dist/index.js",
6
6
  "main": "dist/index.cjs.js",