@everymatrix/general-slider 1.32.4 → 1.33.1

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.
Files changed (46) hide show
  1. package/dist/cjs/general-slider.cjs.entry.js +233 -0
  2. package/dist/cjs/general-slider.cjs.js +19 -0
  3. package/dist/cjs/index-813e9dd4.js +1176 -0
  4. package/dist/cjs/index.cjs.js +2 -0
  5. package/dist/cjs/loader.cjs.js +21 -0
  6. package/dist/collection/collection-manifest.json +12 -0
  7. package/dist/collection/components/general-slider/general-slider.css +134 -0
  8. package/dist/collection/components/general-slider/general-slider.js +406 -0
  9. package/dist/collection/index.js +1 -0
  10. package/dist/collection/utils/utils.js +3 -0
  11. package/dist/components/general-slider.d.ts +11 -0
  12. package/dist/components/general-slider.js +260 -0
  13. package/dist/components/index.d.ts +26 -0
  14. package/dist/components/index.js +1 -0
  15. package/dist/esm/general-slider.entry.js +229 -0
  16. package/dist/esm/general-slider.js +17 -0
  17. package/dist/esm/index-3bef6f6d.js +1150 -0
  18. package/dist/esm/index.js +1 -0
  19. package/dist/esm/loader.js +17 -0
  20. package/dist/esm/polyfills/core-js.js +11 -0
  21. package/dist/esm/polyfills/css-shim.js +1 -0
  22. package/dist/esm/polyfills/dom.js +79 -0
  23. package/dist/esm/polyfills/es5-html-element.js +1 -0
  24. package/dist/esm/polyfills/index.js +34 -0
  25. package/dist/esm/polyfills/system.js +6 -0
  26. package/dist/general-slider/general-slider.esm.js +1 -0
  27. package/dist/general-slider/index.esm.js +0 -0
  28. package/dist/general-slider/p-1d97b302.js +1 -0
  29. package/dist/general-slider/p-20e28994.entry.js +1 -0
  30. package/dist/index.cjs.js +1 -0
  31. package/dist/index.js +1 -0
  32. package/dist/stencil.config.js +22 -0
  33. package/dist/types/Users/adrian.pripon/Documents/Work/widgets-stencil/packages/general-slider/.stencil/packages/general-slider/stencil.config.d.ts +2 -0
  34. package/dist/types/components/general-slider/general-slider.d.ts +69 -0
  35. package/dist/types/components.d.ts +109 -0
  36. package/dist/types/index.d.ts +1 -0
  37. package/dist/types/stencil-public-runtime.d.ts +1565 -0
  38. package/dist/types/utils/utils.d.ts +1 -0
  39. package/loader/cdn.js +3 -0
  40. package/loader/index.cjs.js +3 -0
  41. package/loader/index.d.ts +12 -0
  42. package/loader/index.es2017.js +3 -0
  43. package/loader/index.js +4 -0
  44. package/loader/package.json +10 -0
  45. package/package.json +2 -3
  46. package/LICENSE +0 -21
@@ -0,0 +1,260 @@
1
+ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
2
+
3
+ const generalSliderCss = ":host{display:block}.GeneralSlider{position:relative}.Slider{position:relative;width:100%;margin:0 auto;overflow:hidden}.SliderList{display:flex;margin:0;padding:0;list-style:none;transition:transform 0.5s ease-in-out}::slotted(li){flex:1 0 auto;width:100%;margin:auto}::slotted(li.hide){visibility:hidden;height:0;transition-delay:500ms}.Col-2 ::slotted(li){flex:2 0 auto;width:50%}.Col-3 ::slotted(li){flex:3 0 auto;width:33.3333333333%}.Col-4 ::slotted(li){flex:4 0 auto;width:25%}.Col-5 ::slotted(li){flex:5 0 auto;width:20%}.Col-6 ::slotted(li){flex:6 0 auto;width:16.6666666667%}.Col-7 ::slotted(li){flex:7 0 auto;width:14.2857142857%}.Col-8 ::slotted(li){flex:8 0 auto;width:12.5%}.Col-9 ::slotted(li){flex:9 0 auto;width:11.1111111111%}.Col-10 ::slotted(li){flex:10 0 auto;width:10%}.Col-11 ::slotted(li){flex:11 0 auto;width:9.0909090909%}.Col-12 ::slotted(li){flex:12 0 auto;width:8.3333333333%}.Button{position:absolute;z-index:1;top:calc(50% - 32px);padding:20px;font-size:20px;line-height:20px;opacity:0.5;border:none;background:var(--emfe-w-color-contrast, #07072A);color:var(--emfe-w-color-white, #FFFFFF);cursor:pointer}.Button:hover{opacity:1;transition:opacity 0.5s ease-in-out}.Button[disabled],.Button[disabled]:hover{color:var(--emfe-w-color-gray-150, #828282);opacity:0.25}.Button.ButtonNext{right:0}.PageButtons{display:flex;gap:4px;margin-top:8px}.PageButton{width:15px;height:4px;border-radius:4px;background-color:var(--emfe-w-tournament-color-primary, #0072ed);opacity:0.2;cursor:pointer;float:right}.PageButton.active{width:45px;opacity:1}";
4
+
5
+ const GeneralSlider$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
6
+ constructor() {
7
+ super();
8
+ this.__registerHost();
9
+ this.__attachShadow();
10
+ /**
11
+ * Slide Count
12
+ */
13
+ this.slideNumber = 3;
14
+ /**
15
+ * Slides to show
16
+ */
17
+ this.slideShow = 3;
18
+ /**
19
+ * Display the arrow icon
20
+ */
21
+ this.showArrow = true;
22
+ /**
23
+ * Display the button
24
+ */
25
+ this.showButton = false;
26
+ /**
27
+ * Auto Slide
28
+ */
29
+ this.autoSlide = false;
30
+ /**
31
+ * Auto Slide loop time
32
+ */
33
+ this.loopTime = 1;
34
+ /**
35
+ * Auto fill the Item height
36
+ */
37
+ this.autoItemHeight = false;
38
+ /**
39
+ * Client custom styling via inline styles
40
+ */
41
+ this.clientStyling = '';
42
+ /**
43
+ * Client custom styling via url
44
+ */
45
+ this.clientStylingUrl = '';
46
+ this.currentSlideNumber = 0;
47
+ this.slidesCount = 0;
48
+ this.limitStylingAppends = false;
49
+ this.slides = null;
50
+ this.slideWidth = 0;
51
+ this.currentPage = 0;
52
+ this.controls = {
53
+ Prev: null,
54
+ Next: null
55
+ };
56
+ this.xDown = null;
57
+ this.yDown = null;
58
+ }
59
+ slide(next) {
60
+ let slideTo = 0;
61
+ if (next) {
62
+ slideTo = this.currentSlideNumber + this.slideNumber;
63
+ }
64
+ else {
65
+ slideTo = this.currentSlideNumber - this.slideNumber;
66
+ }
67
+ if (slideTo < 0 || slideTo >= this.slidesCount)
68
+ return;
69
+ this.currentSlideNumber = slideTo;
70
+ this.currentPage = this.currentSlideNumber / this.slideNumber;
71
+ this.updateListStyle();
72
+ }
73
+ slideTo(page) {
74
+ this.currentSlideNumber = page * this.slideNumber;
75
+ this.currentPage = page;
76
+ this.updateListStyle();
77
+ }
78
+ updateControls() {
79
+ this.switchControl('Prev', (this.currentSlideNumber === 0) ? false : true);
80
+ this.switchControl('Next', (this.currentSlideNumber === this.slidesCount - this.slideShow) ? false : true);
81
+ }
82
+ switchControl(type, enabled) {
83
+ if (this.controls[type]) {
84
+ this.controls[type].disabled = !enabled;
85
+ }
86
+ }
87
+ componentWillLoad() {
88
+ if (!this.slideNumber)
89
+ this.slideNumber = 1;
90
+ if (!this.slideShow)
91
+ this.slideShow = 1;
92
+ }
93
+ componentDidLoad() {
94
+ this.slides = this.slotEl.assignedElements();
95
+ this.slidesCount = this.slides.length;
96
+ for (let type in this.controls) {
97
+ this.controls[type] = this.el.shadowRoot.querySelector('.Button' + type);
98
+ }
99
+ if (this.autoSlide) {
100
+ this.setSlideAutoInterval();
101
+ }
102
+ if (!this.limitStylingAppends && this.el.shadowRoot) {
103
+ if (this.clientStyling)
104
+ this.setClientStyling();
105
+ if (this.clientStylingUrl)
106
+ this.setClientStylingURL();
107
+ this.limitStylingAppends = true;
108
+ }
109
+ }
110
+ componentDidRender() {
111
+ if (this.slides)
112
+ this.slideWidth = this.slides[0].offsetWidth;
113
+ this.el.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
114
+ this.el.addEventListener('touchmove', this.handleTouchMove.bind(this), { passive: true });
115
+ this.updateListStyle();
116
+ if (!this.limitStylingAppends && this.el.shadowRoot) {
117
+ if (this.clientStyling)
118
+ this.setClientStyling();
119
+ if (this.clientStylingUrl)
120
+ this.setClientStylingURL();
121
+ this.limitStylingAppends = true;
122
+ }
123
+ }
124
+ updateListStyle() {
125
+ if (!this.autoItemHeight)
126
+ return;
127
+ if (this.slides === null)
128
+ return;
129
+ this.slides.forEach((li, index) => {
130
+ if (index >= this.currentPage * this.slideNumber && index < (this.currentPage + 1) * this.slideNumber) {
131
+ li.classList.remove('hide');
132
+ }
133
+ else {
134
+ li.classList.add('hide');
135
+ }
136
+ });
137
+ }
138
+ disconnectedCallback() {
139
+ this.el.removeEventListener('touchstart', this.handleTouchStart);
140
+ this.el.removeEventListener('touchmove', this.handleTouchMove);
141
+ }
142
+ handleTouchStart(evt) {
143
+ const firstTouch = this.getTouches(evt)[0];
144
+ this.xDown = firstTouch.clientX;
145
+ this.yDown = firstTouch.clientY;
146
+ clearInterval(this.sliderInterval);
147
+ }
148
+ getTouches(evt) {
149
+ return evt.touches || evt.originalEvent.touches;
150
+ }
151
+ handleTouchMove(evt) {
152
+ if (!this.xDown || !this.yDown)
153
+ return;
154
+ let xUp = evt.touches[0].clientX;
155
+ let yUp = evt.touches[0].clientY;
156
+ let xDiff = this.xDown - xUp;
157
+ let yDiff = this.yDown - yUp;
158
+ if (Math.abs(xDiff) > Math.abs(yDiff)) {
159
+ if (xDiff > 0) {
160
+ this.slide(true);
161
+ }
162
+ else {
163
+ this.slide(false);
164
+ }
165
+ }
166
+ this.xDown = null;
167
+ this.yDown = null;
168
+ if (this.autoSlide) {
169
+ this.setSlideAutoInterval();
170
+ }
171
+ }
172
+ ;
173
+ setSlideAutoInterval() {
174
+ if (this.loopTime == 0) {
175
+ return;
176
+ }
177
+ clearInterval(this.sliderInterval);
178
+ this.sliderInterval = setInterval(() => {
179
+ if (this.currentPage + 1 < this.slidesCount / this.slideNumber) {
180
+ this.slideTo(this.currentPage + 1);
181
+ }
182
+ else {
183
+ this.slideTo(0);
184
+ }
185
+ }, Number(this.loopTime) * 1000);
186
+ }
187
+ componentDidUpdate() {
188
+ this.sliderEl.style.transform = `translateX(${this.currentSlideNumber * this.slideWidth * -1}px)`;
189
+ this.updateControls();
190
+ }
191
+ switchLoopStatus(isMouseMoveEnter) {
192
+ if (!this.autoSlide)
193
+ return;
194
+ if (this.loopTime > 0) {
195
+ if (isMouseMoveEnter) {
196
+ clearInterval(this.sliderInterval);
197
+ }
198
+ else {
199
+ this.setSlideAutoInterval();
200
+ }
201
+ }
202
+ }
203
+ setClientStyling() {
204
+ const sheet = new CSSStyleSheet();
205
+ // @ts-ignore
206
+ sheet.replace(this.clientStyling);
207
+ // @ts-ignore
208
+ this.el.shadowRoot.adoptedStyleSheets = [...this.el.shadowRoot.adoptedStyleSheets, sheet];
209
+ }
210
+ setClientStylingURL() {
211
+ let url = new URL(this.clientStylingUrl);
212
+ fetch(url.href)
213
+ .then((res) => res.text())
214
+ .then((data) => {
215
+ const sheet = new CSSStyleSheet();
216
+ // @ts-ignore
217
+ sheet.replace(data);
218
+ // @ts-ignore
219
+ this.el.shadowRoot.adoptedStyleSheets = [...this.el.shadowRoot.adoptedStyleSheets, sheet];
220
+ });
221
+ }
222
+ render() {
223
+ return (h("div", { class: "GeneralSlider" }, h("div", { class: "Slider" }, this.showArrow &&
224
+ h("div", null, h("button", { type: "button", class: "Button ButtonNext", onClick: this.slide.bind(this, true), onMouseEnter: this.switchLoopStatus.bind(this, true), onMouseLeave: this.switchLoopStatus.bind(this, false) }, ">"), h("button", { type: "button", class: "Button ButtonPrev", onClick: this.slide.bind(this, false), onMouseEnter: this.switchLoopStatus.bind(this, true), onMouseLeave: this.switchLoopStatus.bind(this, false) }, "<")), h("ul", { class: `SliderList Col-${this.slideShow}`, part: "SliderList", onMouseEnter: this.switchLoopStatus.bind(this, true), onMouseLeave: this.switchLoopStatus.bind(this, false), ref: (el) => this.sliderEl = el }, h("slot", { ref: (el) => this.slotEl = el }))), this.showButton && this.slidesCount > 0 &&
225
+ h("div", { class: "PageButtons", part: "PageButtons" }, [...Array(this.slidesCount / this.slideNumber)].map((_x, i) => h("div", { class: `PageButton ${this.currentPage == i ? 'active' : ''}`, title: `page${i}`, onClick: this.slideTo.bind(this, i), onMouseEnter: this.switchLoopStatus.bind(this, true), onMouseLeave: this.switchLoopStatus.bind(this, false) }, "\u00A0")))));
226
+ }
227
+ get el() { return this; }
228
+ static get style() { return generalSliderCss; }
229
+ }, [1, "general-slider", {
230
+ "slideNumber": [2, "slide-number"],
231
+ "slideShow": [2, "slide-show"],
232
+ "showArrow": [4, "show-arrow"],
233
+ "showButton": [4, "show-button"],
234
+ "autoSlide": [4, "auto-slide"],
235
+ "loopTime": [2, "loop-time"],
236
+ "autoItemHeight": [4, "auto-item-height"],
237
+ "clientStyling": [1, "client-styling"],
238
+ "clientStylingUrl": [1, "client-styling-url"],
239
+ "currentSlideNumber": [32],
240
+ "slidesCount": [32],
241
+ "limitStylingAppends": [32]
242
+ }]);
243
+ function defineCustomElement$1() {
244
+ if (typeof customElements === "undefined") {
245
+ return;
246
+ }
247
+ const components = ["general-slider"];
248
+ components.forEach(tagName => { switch (tagName) {
249
+ case "general-slider":
250
+ if (!customElements.get(tagName)) {
251
+ customElements.define(tagName, GeneralSlider$1);
252
+ }
253
+ break;
254
+ } });
255
+ }
256
+
257
+ const GeneralSlider = GeneralSlider$1;
258
+ const defineCustomElement = defineCustomElement$1;
259
+
260
+ export { GeneralSlider, defineCustomElement };
@@ -0,0 +1,26 @@
1
+ /* GeneralSlider custom elements */
2
+
3
+ import type { Components, JSX } from "../types/components";
4
+
5
+ /**
6
+ * Used to manually set the base path where assets can be found.
7
+ * If the script is used as "module", it's recommended to use "import.meta.url",
8
+ * such as "setAssetPath(import.meta.url)". Other options include
9
+ * "setAssetPath(document.currentScript.src)", or using a bundler's replace plugin to
10
+ * dynamically set the path at build time, such as "setAssetPath(process.env.ASSET_PATH)".
11
+ * But do note that this configuration depends on how your script is bundled, or lack of
12
+ * bundling, and where your assets can be loaded from. Additionally custom bundling
13
+ * will have to ensure the static assets are copied to its build directory.
14
+ */
15
+ export declare const setAssetPath: (path: string) => void;
16
+
17
+ export interface SetPlatformOptions {
18
+ raf?: (c: FrameRequestCallback) => number;
19
+ ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
20
+ rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
21
+ }
22
+ export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;
23
+
24
+ export type { Components, JSX };
25
+
26
+ export * from '../types';
@@ -0,0 +1 @@
1
+ export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
@@ -0,0 +1,229 @@
1
+ import { r as registerInstance, h, g as getElement } from './index-3bef6f6d.js';
2
+
3
+ const generalSliderCss = ":host{display:block}.GeneralSlider{position:relative}.Slider{position:relative;width:100%;margin:0 auto;overflow:hidden}.SliderList{display:flex;margin:0;padding:0;list-style:none;transition:transform 0.5s ease-in-out}::slotted(li){flex:1 0 auto;width:100%;margin:auto}::slotted(li.hide){visibility:hidden;height:0;transition-delay:500ms}.Col-2 ::slotted(li){flex:2 0 auto;width:50%}.Col-3 ::slotted(li){flex:3 0 auto;width:33.3333333333%}.Col-4 ::slotted(li){flex:4 0 auto;width:25%}.Col-5 ::slotted(li){flex:5 0 auto;width:20%}.Col-6 ::slotted(li){flex:6 0 auto;width:16.6666666667%}.Col-7 ::slotted(li){flex:7 0 auto;width:14.2857142857%}.Col-8 ::slotted(li){flex:8 0 auto;width:12.5%}.Col-9 ::slotted(li){flex:9 0 auto;width:11.1111111111%}.Col-10 ::slotted(li){flex:10 0 auto;width:10%}.Col-11 ::slotted(li){flex:11 0 auto;width:9.0909090909%}.Col-12 ::slotted(li){flex:12 0 auto;width:8.3333333333%}.Button{position:absolute;z-index:1;top:calc(50% - 32px);padding:20px;font-size:20px;line-height:20px;opacity:0.5;border:none;background:var(--emfe-w-color-contrast, #07072A);color:var(--emfe-w-color-white, #FFFFFF);cursor:pointer}.Button:hover{opacity:1;transition:opacity 0.5s ease-in-out}.Button[disabled],.Button[disabled]:hover{color:var(--emfe-w-color-gray-150, #828282);opacity:0.25}.Button.ButtonNext{right:0}.PageButtons{display:flex;gap:4px;margin-top:8px}.PageButton{width:15px;height:4px;border-radius:4px;background-color:var(--emfe-w-tournament-color-primary, #0072ed);opacity:0.2;cursor:pointer;float:right}.PageButton.active{width:45px;opacity:1}";
4
+
5
+ const GeneralSlider = class {
6
+ constructor(hostRef) {
7
+ registerInstance(this, hostRef);
8
+ /**
9
+ * Slide Count
10
+ */
11
+ this.slideNumber = 3;
12
+ /**
13
+ * Slides to show
14
+ */
15
+ this.slideShow = 3;
16
+ /**
17
+ * Display the arrow icon
18
+ */
19
+ this.showArrow = true;
20
+ /**
21
+ * Display the button
22
+ */
23
+ this.showButton = false;
24
+ /**
25
+ * Auto Slide
26
+ */
27
+ this.autoSlide = false;
28
+ /**
29
+ * Auto Slide loop time
30
+ */
31
+ this.loopTime = 1;
32
+ /**
33
+ * Auto fill the Item height
34
+ */
35
+ this.autoItemHeight = false;
36
+ /**
37
+ * Client custom styling via inline styles
38
+ */
39
+ this.clientStyling = '';
40
+ /**
41
+ * Client custom styling via url
42
+ */
43
+ this.clientStylingUrl = '';
44
+ this.currentSlideNumber = 0;
45
+ this.slidesCount = 0;
46
+ this.limitStylingAppends = false;
47
+ this.slides = null;
48
+ this.slideWidth = 0;
49
+ this.currentPage = 0;
50
+ this.controls = {
51
+ Prev: null,
52
+ Next: null
53
+ };
54
+ this.xDown = null;
55
+ this.yDown = null;
56
+ }
57
+ slide(next) {
58
+ let slideTo = 0;
59
+ if (next) {
60
+ slideTo = this.currentSlideNumber + this.slideNumber;
61
+ }
62
+ else {
63
+ slideTo = this.currentSlideNumber - this.slideNumber;
64
+ }
65
+ if (slideTo < 0 || slideTo >= this.slidesCount)
66
+ return;
67
+ this.currentSlideNumber = slideTo;
68
+ this.currentPage = this.currentSlideNumber / this.slideNumber;
69
+ this.updateListStyle();
70
+ }
71
+ slideTo(page) {
72
+ this.currentSlideNumber = page * this.slideNumber;
73
+ this.currentPage = page;
74
+ this.updateListStyle();
75
+ }
76
+ updateControls() {
77
+ this.switchControl('Prev', (this.currentSlideNumber === 0) ? false : true);
78
+ this.switchControl('Next', (this.currentSlideNumber === this.slidesCount - this.slideShow) ? false : true);
79
+ }
80
+ switchControl(type, enabled) {
81
+ if (this.controls[type]) {
82
+ this.controls[type].disabled = !enabled;
83
+ }
84
+ }
85
+ componentWillLoad() {
86
+ if (!this.slideNumber)
87
+ this.slideNumber = 1;
88
+ if (!this.slideShow)
89
+ this.slideShow = 1;
90
+ }
91
+ componentDidLoad() {
92
+ this.slides = this.slotEl.assignedElements();
93
+ this.slidesCount = this.slides.length;
94
+ for (let type in this.controls) {
95
+ this.controls[type] = this.el.shadowRoot.querySelector('.Button' + type);
96
+ }
97
+ if (this.autoSlide) {
98
+ this.setSlideAutoInterval();
99
+ }
100
+ if (!this.limitStylingAppends && this.el.shadowRoot) {
101
+ if (this.clientStyling)
102
+ this.setClientStyling();
103
+ if (this.clientStylingUrl)
104
+ this.setClientStylingURL();
105
+ this.limitStylingAppends = true;
106
+ }
107
+ }
108
+ componentDidRender() {
109
+ if (this.slides)
110
+ this.slideWidth = this.slides[0].offsetWidth;
111
+ this.el.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
112
+ this.el.addEventListener('touchmove', this.handleTouchMove.bind(this), { passive: true });
113
+ this.updateListStyle();
114
+ if (!this.limitStylingAppends && this.el.shadowRoot) {
115
+ if (this.clientStyling)
116
+ this.setClientStyling();
117
+ if (this.clientStylingUrl)
118
+ this.setClientStylingURL();
119
+ this.limitStylingAppends = true;
120
+ }
121
+ }
122
+ updateListStyle() {
123
+ if (!this.autoItemHeight)
124
+ return;
125
+ if (this.slides === null)
126
+ return;
127
+ this.slides.forEach((li, index) => {
128
+ if (index >= this.currentPage * this.slideNumber && index < (this.currentPage + 1) * this.slideNumber) {
129
+ li.classList.remove('hide');
130
+ }
131
+ else {
132
+ li.classList.add('hide');
133
+ }
134
+ });
135
+ }
136
+ disconnectedCallback() {
137
+ this.el.removeEventListener('touchstart', this.handleTouchStart);
138
+ this.el.removeEventListener('touchmove', this.handleTouchMove);
139
+ }
140
+ handleTouchStart(evt) {
141
+ const firstTouch = this.getTouches(evt)[0];
142
+ this.xDown = firstTouch.clientX;
143
+ this.yDown = firstTouch.clientY;
144
+ clearInterval(this.sliderInterval);
145
+ }
146
+ getTouches(evt) {
147
+ return evt.touches || evt.originalEvent.touches;
148
+ }
149
+ handleTouchMove(evt) {
150
+ if (!this.xDown || !this.yDown)
151
+ return;
152
+ let xUp = evt.touches[0].clientX;
153
+ let yUp = evt.touches[0].clientY;
154
+ let xDiff = this.xDown - xUp;
155
+ let yDiff = this.yDown - yUp;
156
+ if (Math.abs(xDiff) > Math.abs(yDiff)) {
157
+ if (xDiff > 0) {
158
+ this.slide(true);
159
+ }
160
+ else {
161
+ this.slide(false);
162
+ }
163
+ }
164
+ this.xDown = null;
165
+ this.yDown = null;
166
+ if (this.autoSlide) {
167
+ this.setSlideAutoInterval();
168
+ }
169
+ }
170
+ ;
171
+ setSlideAutoInterval() {
172
+ if (this.loopTime == 0) {
173
+ return;
174
+ }
175
+ clearInterval(this.sliderInterval);
176
+ this.sliderInterval = setInterval(() => {
177
+ if (this.currentPage + 1 < this.slidesCount / this.slideNumber) {
178
+ this.slideTo(this.currentPage + 1);
179
+ }
180
+ else {
181
+ this.slideTo(0);
182
+ }
183
+ }, Number(this.loopTime) * 1000);
184
+ }
185
+ componentDidUpdate() {
186
+ this.sliderEl.style.transform = `translateX(${this.currentSlideNumber * this.slideWidth * -1}px)`;
187
+ this.updateControls();
188
+ }
189
+ switchLoopStatus(isMouseMoveEnter) {
190
+ if (!this.autoSlide)
191
+ return;
192
+ if (this.loopTime > 0) {
193
+ if (isMouseMoveEnter) {
194
+ clearInterval(this.sliderInterval);
195
+ }
196
+ else {
197
+ this.setSlideAutoInterval();
198
+ }
199
+ }
200
+ }
201
+ setClientStyling() {
202
+ const sheet = new CSSStyleSheet();
203
+ // @ts-ignore
204
+ sheet.replace(this.clientStyling);
205
+ // @ts-ignore
206
+ this.el.shadowRoot.adoptedStyleSheets = [...this.el.shadowRoot.adoptedStyleSheets, sheet];
207
+ }
208
+ setClientStylingURL() {
209
+ let url = new URL(this.clientStylingUrl);
210
+ fetch(url.href)
211
+ .then((res) => res.text())
212
+ .then((data) => {
213
+ const sheet = new CSSStyleSheet();
214
+ // @ts-ignore
215
+ sheet.replace(data);
216
+ // @ts-ignore
217
+ this.el.shadowRoot.adoptedStyleSheets = [...this.el.shadowRoot.adoptedStyleSheets, sheet];
218
+ });
219
+ }
220
+ render() {
221
+ return (h("div", { class: "GeneralSlider" }, h("div", { class: "Slider" }, this.showArrow &&
222
+ h("div", null, h("button", { type: "button", class: "Button ButtonNext", onClick: this.slide.bind(this, true), onMouseEnter: this.switchLoopStatus.bind(this, true), onMouseLeave: this.switchLoopStatus.bind(this, false) }, ">"), h("button", { type: "button", class: "Button ButtonPrev", onClick: this.slide.bind(this, false), onMouseEnter: this.switchLoopStatus.bind(this, true), onMouseLeave: this.switchLoopStatus.bind(this, false) }, "<")), h("ul", { class: `SliderList Col-${this.slideShow}`, part: "SliderList", onMouseEnter: this.switchLoopStatus.bind(this, true), onMouseLeave: this.switchLoopStatus.bind(this, false), ref: (el) => this.sliderEl = el }, h("slot", { ref: (el) => this.slotEl = el }))), this.showButton && this.slidesCount > 0 &&
223
+ h("div", { class: "PageButtons", part: "PageButtons" }, [...Array(this.slidesCount / this.slideNumber)].map((_x, i) => h("div", { class: `PageButton ${this.currentPage == i ? 'active' : ''}`, title: `page${i}`, onClick: this.slideTo.bind(this, i), onMouseEnter: this.switchLoopStatus.bind(this, true), onMouseLeave: this.switchLoopStatus.bind(this, false) }, "\u00A0")))));
224
+ }
225
+ get el() { return getElement(this); }
226
+ };
227
+ GeneralSlider.style = generalSliderCss;
228
+
229
+ export { GeneralSlider as general_slider };
@@ -0,0 +1,17 @@
1
+ import { p as promiseResolve, b as bootstrapLazy } from './index-3bef6f6d.js';
2
+
3
+ /*
4
+ Stencil Client Patch Browser v2.15.2 | MIT Licensed | https://stenciljs.com
5
+ */
6
+ const patchBrowser = () => {
7
+ const importMeta = import.meta.url;
8
+ const opts = {};
9
+ if (importMeta !== '') {
10
+ opts.resourcesUrl = new URL('.', importMeta).href;
11
+ }
12
+ return promiseResolve(opts);
13
+ };
14
+
15
+ patchBrowser().then(options => {
16
+ return bootstrapLazy([["general-slider",[[1,"general-slider",{"slideNumber":[2,"slide-number"],"slideShow":[2,"slide-show"],"showArrow":[4,"show-arrow"],"showButton":[4,"show-button"],"autoSlide":[4,"auto-slide"],"loopTime":[2,"loop-time"],"autoItemHeight":[4,"auto-item-height"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"currentSlideNumber":[32],"slidesCount":[32],"limitStylingAppends":[32]}]]]], options);
17
+ });