@salla.sa/twilight-components 2.11.27 → 2.11.28
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.
- package/dist/cjs/salla-button_36.cjs.entry.js +3 -2
- package/dist/collection/components/salla-progress-bar/salla-progress-bar.css +0 -16
- package/dist/collection/components/salla-slider/salla-slider.js +16 -1
- package/dist/components/salla-progress-bar2.js +1 -1
- package/dist/components/salla-slider2.js +2 -1
- package/dist/esm/salla-button_36.entry.js +3 -2
- package/dist/esm-es5/salla-button_36.entry.js +1 -1
- package/dist/twilight/p-1b87ab66.system.js +1 -1
- package/dist/twilight/{p-485b62a3.entry.js → p-7dcf1bf3.entry.js} +1 -1
- package/dist/twilight/{p-79264f27.system.entry.js → p-ae899ce6.system.entry.js} +5 -5
- package/dist/twilight/twilight.esm.js +1 -1
- package/dist/types/components/salla-slider/salla-slider.d.ts +4 -0
- package/dist/types/components.d.ts +4 -0
- package/package.json +4 -4
|
@@ -23277,7 +23277,7 @@ const SallaProductSizeGuide = class {
|
|
|
23277
23277
|
};
|
|
23278
23278
|
SallaProductSizeGuide.style = sallaProductSizeGuideCss;
|
|
23279
23279
|
|
|
23280
|
-
const sallaProgressBarCss = ".s-progress-bar-
|
|
23280
|
+
const sallaProgressBarCss = ".s-progress-bar-wrapper{background-color:#E5E7EB;width:100%;height:0.625rem;border-radius:9999px;margin-bottom:0.375rem}.s-progress-bar-progress{height:0.625rem;border-radius:9999px}.s-progress-bar-message{color:#a2a8b4;font-size:0.75rem;line-height:1rem;display:block;margin-bottom:0.625rem}";
|
|
23281
23281
|
|
|
23282
23282
|
const SallaProgressBar = class {
|
|
23283
23283
|
constructor(hostRef) {
|
|
@@ -24181,6 +24181,7 @@ const sallaSliderCss = "@font-face{font-family:\"swiper-icons\";src:url(\"data:a
|
|
|
24181
24181
|
const SallaSwiper = class {
|
|
24182
24182
|
constructor(hostRef) {
|
|
24183
24183
|
index.registerInstance(this, hostRef);
|
|
24184
|
+
this.afterInit = index.createEvent(this, "afterInit", 7);
|
|
24184
24185
|
this.slideChange = index.createEvent(this, "slideChange", 7);
|
|
24185
24186
|
this.reachBeginning = index.createEvent(this, "reachBeginning", 7);
|
|
24186
24187
|
this.reachEnd = index.createEvent(this, "reachEnd", 7);
|
|
@@ -24507,6 +24508,7 @@ const SallaSwiper = class {
|
|
|
24507
24508
|
// then it re appended it as is,in this case the image is loaded but class not added.
|
|
24508
24509
|
afterInit: (slider) => {
|
|
24509
24510
|
var _a;
|
|
24511
|
+
this.afterInit.emit(slider);
|
|
24510
24512
|
(_a = document.lazyLoadInstance) === null || _a === void 0 ? void 0 : _a.update();
|
|
24511
24513
|
this.loop && slider.slides.map(slide => {
|
|
24512
24514
|
if (!slide.classList.contains('swiper-slide-duplicate')) {
|
|
@@ -24568,7 +24570,6 @@ const SallaSwiper = class {
|
|
|
24568
24570
|
}
|
|
24569
24571
|
initSlider() {
|
|
24570
24572
|
for (const slide of this.sliderWrapper.children) {
|
|
24571
|
-
//todo:: use `s-slider-slide`
|
|
24572
24573
|
slide.classList.add('swiper-slide');
|
|
24573
24574
|
}
|
|
24574
24575
|
// @ts-ignore
|
|
@@ -1,19 +1,3 @@
|
|
|
1
|
-
.s-progress-bar-header {
|
|
2
|
-
font-size: 0.875rem;
|
|
3
|
-
line-height: 1.25rem;
|
|
4
|
-
color: #6b7280;
|
|
5
|
-
font-weight: bold;
|
|
6
|
-
}
|
|
7
|
-
.s-progress-bar-target-section {
|
|
8
|
-
display: flex;
|
|
9
|
-
margin-bottom: 0.625rem;
|
|
10
|
-
font-size: 0.875rem;
|
|
11
|
-
line-height: 1.25rem;
|
|
12
|
-
justify-content: space-between;
|
|
13
|
-
}
|
|
14
|
-
.s-progress-bar-container {
|
|
15
|
-
margin-bottom: 0.625rem;
|
|
16
|
-
}
|
|
17
1
|
.s-progress-bar-wrapper {
|
|
18
2
|
background-color: #E5E7EB;
|
|
19
3
|
width: 100%;
|
|
@@ -321,6 +321,7 @@ export class SallaSwiper {
|
|
|
321
321
|
// then it re appended it as is,in this case the image is loaded but class not added.
|
|
322
322
|
afterInit: (slider) => {
|
|
323
323
|
var _a;
|
|
324
|
+
this.afterInit.emit(slider);
|
|
324
325
|
(_a = document.lazyLoadInstance) === null || _a === void 0 ? void 0 : _a.update();
|
|
325
326
|
this.loop && slider.slides.map(slide => {
|
|
326
327
|
if (!slide.classList.contains('swiper-slide-duplicate')) {
|
|
@@ -382,7 +383,6 @@ export class SallaSwiper {
|
|
|
382
383
|
}
|
|
383
384
|
initSlider() {
|
|
384
385
|
for (const slide of this.sliderWrapper.children) {
|
|
385
|
-
//todo:: use `s-slider-slide`
|
|
386
386
|
slide.classList.add('swiper-slide');
|
|
387
387
|
}
|
|
388
388
|
// @ts-ignore
|
|
@@ -822,6 +822,21 @@ export class SallaSwiper {
|
|
|
822
822
|
"displayAllTitle": {}
|
|
823
823
|
}; }
|
|
824
824
|
static get events() { return [{
|
|
825
|
+
"method": "afterInit",
|
|
826
|
+
"name": "afterInit",
|
|
827
|
+
"bubbles": true,
|
|
828
|
+
"cancelable": true,
|
|
829
|
+
"composed": true,
|
|
830
|
+
"docs": {
|
|
831
|
+
"tags": [],
|
|
832
|
+
"text": "Event will fired right after initialization."
|
|
833
|
+
},
|
|
834
|
+
"complexType": {
|
|
835
|
+
"original": "any",
|
|
836
|
+
"resolved": "any",
|
|
837
|
+
"references": {}
|
|
838
|
+
}
|
|
839
|
+
}, {
|
|
825
840
|
"method": "slideChange",
|
|
826
841
|
"name": "slideChange",
|
|
827
842
|
"bubbles": true,
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
5
5
|
|
|
6
|
-
const sallaProgressBarCss = ".s-progress-bar-
|
|
6
|
+
const sallaProgressBarCss = ".s-progress-bar-wrapper{background-color:#E5E7EB;width:100%;height:0.625rem;border-radius:9999px;margin-bottom:0.375rem}.s-progress-bar-progress{height:0.625rem;border-radius:9999px}.s-progress-bar-message{color:#a2a8b4;font-size:0.75rem;line-height:1rem;display:block;margin-bottom:0.625rem}";
|
|
7
7
|
|
|
8
8
|
const SallaProgressBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
9
9
|
constructor() {
|
|
@@ -17,6 +17,7 @@ const SallaSwiper = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
|
17
17
|
constructor() {
|
|
18
18
|
super();
|
|
19
19
|
this.__registerHost();
|
|
20
|
+
this.afterInit = createEvent(this, "afterInit", 7);
|
|
20
21
|
this.slideChange = createEvent(this, "slideChange", 7);
|
|
21
22
|
this.reachBeginning = createEvent(this, "reachBeginning", 7);
|
|
22
23
|
this.reachEnd = createEvent(this, "reachEnd", 7);
|
|
@@ -343,6 +344,7 @@ const SallaSwiper = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
|
343
344
|
// then it re appended it as is,in this case the image is loaded but class not added.
|
|
344
345
|
afterInit: (slider) => {
|
|
345
346
|
var _a;
|
|
347
|
+
this.afterInit.emit(slider);
|
|
346
348
|
(_a = document.lazyLoadInstance) === null || _a === void 0 ? void 0 : _a.update();
|
|
347
349
|
this.loop && slider.slides.map(slide => {
|
|
348
350
|
if (!slide.classList.contains('swiper-slide-duplicate')) {
|
|
@@ -404,7 +406,6 @@ const SallaSwiper = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
|
404
406
|
}
|
|
405
407
|
initSlider() {
|
|
406
408
|
for (const slide of this.sliderWrapper.children) {
|
|
407
|
-
//todo:: use `s-slider-slide`
|
|
408
409
|
slide.classList.add('swiper-slide');
|
|
409
410
|
}
|
|
410
411
|
// @ts-ignore
|
|
@@ -23273,7 +23273,7 @@ const SallaProductSizeGuide = class {
|
|
|
23273
23273
|
};
|
|
23274
23274
|
SallaProductSizeGuide.style = sallaProductSizeGuideCss;
|
|
23275
23275
|
|
|
23276
|
-
const sallaProgressBarCss = ".s-progress-bar-
|
|
23276
|
+
const sallaProgressBarCss = ".s-progress-bar-wrapper{background-color:#E5E7EB;width:100%;height:0.625rem;border-radius:9999px;margin-bottom:0.375rem}.s-progress-bar-progress{height:0.625rem;border-radius:9999px}.s-progress-bar-message{color:#a2a8b4;font-size:0.75rem;line-height:1rem;display:block;margin-bottom:0.625rem}";
|
|
23277
23277
|
|
|
23278
23278
|
const SallaProgressBar = class {
|
|
23279
23279
|
constructor(hostRef) {
|
|
@@ -24177,6 +24177,7 @@ const sallaSliderCss = "@font-face{font-family:\"swiper-icons\";src:url(\"data:a
|
|
|
24177
24177
|
const SallaSwiper = class {
|
|
24178
24178
|
constructor(hostRef) {
|
|
24179
24179
|
registerInstance(this, hostRef);
|
|
24180
|
+
this.afterInit = createEvent(this, "afterInit", 7);
|
|
24180
24181
|
this.slideChange = createEvent(this, "slideChange", 7);
|
|
24181
24182
|
this.reachBeginning = createEvent(this, "reachBeginning", 7);
|
|
24182
24183
|
this.reachEnd = createEvent(this, "reachEnd", 7);
|
|
@@ -24503,6 +24504,7 @@ const SallaSwiper = class {
|
|
|
24503
24504
|
// then it re appended it as is,in this case the image is loaded but class not added.
|
|
24504
24505
|
afterInit: (slider) => {
|
|
24505
24506
|
var _a;
|
|
24507
|
+
this.afterInit.emit(slider);
|
|
24506
24508
|
(_a = document.lazyLoadInstance) === null || _a === void 0 ? void 0 : _a.update();
|
|
24507
24509
|
this.loop && slider.slides.map(slide => {
|
|
24508
24510
|
if (!slide.classList.contains('swiper-slide-duplicate')) {
|
|
@@ -24564,7 +24566,6 @@ const SallaSwiper = class {
|
|
|
24564
24566
|
}
|
|
24565
24567
|
initSlider() {
|
|
24566
24568
|
for (const slide of this.sliderWrapper.children) {
|
|
24567
|
-
//todo:: use `s-slider-slide`
|
|
24568
24569
|
slide.classList.add('swiper-slide');
|
|
24569
24570
|
}
|
|
24570
24571
|
// @ts-ignore
|