@salla.sa/twilight-components 1.0.0 → 1.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.
- package/README.md +19 -1
- package/dist/cjs/{index-6ea83d19.js → index-a67728b4.js} +9 -392
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{salla-alert_3.cjs.entry.js → salla-login_2.cjs.entry.js} +1 -62
- package/dist/cjs/twilight-components.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +0 -2
- package/dist/esm/{index-3c2b0663.js → index-aeba9f62.js} +10 -391
- package/dist/esm/loader.js +2 -2
- package/dist/esm/{salla-alert_3.entry.js → salla-login_2.entry.js} +2 -62
- package/dist/esm/twilight-components.js +2 -2
- package/dist/twilight-components/p-0a7edc5f.entry.js +1 -0
- package/dist/twilight-components/p-b390bfd1.js +1 -0
- package/dist/twilight-components/twilight-components.esm.js +1 -1
- package/dist/types/components.d.ts +0 -120
- package/package.json +3 -2
- package/dist/cjs/salla-modal.cjs.entry.js +0 -52
- package/dist/collection/components/alert/alert.css +0 -112
- package/dist/collection/components/alert/alert.js +0 -194
- package/dist/collection/components/modal/modal.css +0 -158
- package/dist/collection/components/modal/modal.js +0 -180
- package/dist/esm/salla-modal.entry.js +0 -48
- package/dist/twilight-components/p-58168e3c.entry.js +0 -1
- package/dist/twilight-components/p-a2a8cae2.entry.js +0 -1
- package/dist/twilight-components/p-e1773073.js +0 -1
- package/dist/types/components/alert/alert.d.ts +0 -38
- package/dist/types/components/modal/modal.d.ts +0 -28
package/README.md
CHANGED
|
@@ -27,8 +27,26 @@ Salla web components for building web applications.
|
|
|
27
27
|
```
|
|
28
28
|
# npm link
|
|
29
29
|
npm install @salla.sa/twilight-components
|
|
30
|
+
npm install @salla.sa/twilight-tailwind-theme
|
|
30
31
|
// or npm install {full-path-of-folder}
|
|
31
32
|
|
|
32
|
-
//
|
|
33
|
+
// inclued dev
|
|
33
34
|
require('@salla.sa/twilight-components/dist/twilight-components/twilight-components.esm')
|
|
35
|
+
// include prod
|
|
36
|
+
require('@salla.sa/twilight-components')
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
## Publish
|
|
41
|
+
|
|
42
|
+
### @salla.sa/twilight-components
|
|
43
|
+
|
|
44
|
+
```
|
|
45
|
+
npm publish --access private
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
### @salla.sa/plugins
|
|
49
|
+
|
|
50
|
+
```
|
|
51
|
+
node publish.js
|
|
34
52
|
```
|
|
@@ -23,11 +23,7 @@ function _interopNamespace(e) {
|
|
|
23
23
|
const NAMESPACE = 'twilight-components';
|
|
24
24
|
|
|
25
25
|
let scopeId;
|
|
26
|
-
let contentRef;
|
|
27
26
|
let hostTagName;
|
|
28
|
-
let useNativeShadowDom = false;
|
|
29
|
-
let checkSlotFallbackVisibility = false;
|
|
30
|
-
let checkSlotRelocate = false;
|
|
31
27
|
let isSvgMode = false;
|
|
32
28
|
let queuePending = false;
|
|
33
29
|
const win = typeof window !== 'undefined' ? window : {};
|
|
@@ -161,9 +157,6 @@ const attachStyles = (hostRef) => {
|
|
|
161
157
|
// DOM WRITE!!
|
|
162
158
|
elm['s-sc'] = scopeId;
|
|
163
159
|
elm.classList.add(scopeId + '-h');
|
|
164
|
-
if (flags & 2 /* scopedCssEncapsulation */) {
|
|
165
|
-
elm.classList.add(scopeId + '-s');
|
|
166
|
-
}
|
|
167
160
|
}
|
|
168
161
|
endAttachStyles();
|
|
169
162
|
};
|
|
@@ -196,7 +189,6 @@ const isComplexType = (o) => {
|
|
|
196
189
|
const h = (nodeName, vnodeData, ...children) => {
|
|
197
190
|
let child = null;
|
|
198
191
|
let key = null;
|
|
199
|
-
let slotName = null;
|
|
200
192
|
let simple = false;
|
|
201
193
|
let lastSimple = false;
|
|
202
194
|
let vNodeChildren = [];
|
|
@@ -228,9 +220,6 @@ const h = (nodeName, vnodeData, ...children) => {
|
|
|
228
220
|
if (vnodeData.key) {
|
|
229
221
|
key = vnodeData.key;
|
|
230
222
|
}
|
|
231
|
-
if (vnodeData.name) {
|
|
232
|
-
slotName = vnodeData.name;
|
|
233
|
-
}
|
|
234
223
|
{
|
|
235
224
|
const classData = vnodeData.className || vnodeData.class;
|
|
236
225
|
if (classData) {
|
|
@@ -251,9 +240,6 @@ const h = (nodeName, vnodeData, ...children) => {
|
|
|
251
240
|
{
|
|
252
241
|
vnode.$key$ = key;
|
|
253
242
|
}
|
|
254
|
-
{
|
|
255
|
-
vnode.$name$ = slotName;
|
|
256
|
-
}
|
|
257
243
|
return vnode;
|
|
258
244
|
};
|
|
259
245
|
const newVNode = (tag, text) => {
|
|
@@ -270,9 +256,6 @@ const newVNode = (tag, text) => {
|
|
|
270
256
|
{
|
|
271
257
|
vnode.$key$ = null;
|
|
272
258
|
}
|
|
273
|
-
{
|
|
274
|
-
vnode.$name$ = null;
|
|
275
|
-
}
|
|
276
259
|
return vnode;
|
|
277
260
|
};
|
|
278
261
|
const Host = {};
|
|
@@ -430,36 +413,13 @@ const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
|
|
|
430
413
|
let i = 0;
|
|
431
414
|
let elm;
|
|
432
415
|
let childNode;
|
|
433
|
-
let oldVNode;
|
|
434
|
-
if (!useNativeShadowDom) {
|
|
435
|
-
// remember for later we need to check to relocate nodes
|
|
436
|
-
checkSlotRelocate = true;
|
|
437
|
-
if (newVNode.$tag$ === 'slot') {
|
|
438
|
-
if (scopeId) {
|
|
439
|
-
// scoped css needs to add its scoped id to the parent element
|
|
440
|
-
parentElm.classList.add(scopeId + '-s');
|
|
441
|
-
}
|
|
442
|
-
newVNode.$flags$ |= newVNode.$children$
|
|
443
|
-
? // slot element has fallback content
|
|
444
|
-
2 /* isSlotFallback */
|
|
445
|
-
: // slot element does not have fallback content
|
|
446
|
-
1 /* isSlotReference */;
|
|
447
|
-
}
|
|
448
|
-
}
|
|
449
416
|
if (newVNode.$text$ !== null) {
|
|
450
417
|
// create text node
|
|
451
418
|
elm = newVNode.$elm$ = doc.createTextNode(newVNode.$text$);
|
|
452
419
|
}
|
|
453
|
-
else if (newVNode.$flags$ & 1 /* isSlotReference */) {
|
|
454
|
-
// create a slot reference node
|
|
455
|
-
elm = newVNode.$elm$ =
|
|
456
|
-
doc.createTextNode('');
|
|
457
|
-
}
|
|
458
420
|
else {
|
|
459
421
|
// create element
|
|
460
|
-
elm = newVNode.$elm$ = (doc.createElement(newVNode.$
|
|
461
|
-
? 'slot-fb'
|
|
462
|
-
: newVNode.$tag$));
|
|
422
|
+
elm = newVNode.$elm$ = (doc.createElement(newVNode.$tag$));
|
|
463
423
|
// add css classes, attrs, props, listeners, etc.
|
|
464
424
|
{
|
|
465
425
|
updateElement(null, newVNode, isSvgMode);
|
|
@@ -472,7 +432,7 @@ const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
|
|
|
472
432
|
if (newVNode.$children$) {
|
|
473
433
|
for (i = 0; i < newVNode.$children$.length; ++i) {
|
|
474
434
|
// create the node
|
|
475
|
-
childNode = createElm(oldParentVNode, newVNode, i
|
|
435
|
+
childNode = createElm(oldParentVNode, newVNode, i);
|
|
476
436
|
// return node could have been null
|
|
477
437
|
if (childNode) {
|
|
478
438
|
// append our new node
|
|
@@ -481,62 +441,20 @@ const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
|
|
|
481
441
|
}
|
|
482
442
|
}
|
|
483
443
|
}
|
|
484
|
-
{
|
|
485
|
-
elm['s-hn'] = hostTagName;
|
|
486
|
-
if (newVNode.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) {
|
|
487
|
-
// remember the content reference comment
|
|
488
|
-
elm['s-sr'] = true;
|
|
489
|
-
// remember the content reference comment
|
|
490
|
-
elm['s-cr'] = contentRef;
|
|
491
|
-
// remember the slot name, or empty string for default slot
|
|
492
|
-
elm['s-sn'] = newVNode.$name$ || '';
|
|
493
|
-
// check if we've got an old vnode for this slot
|
|
494
|
-
oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
|
|
495
|
-
if (oldVNode && oldVNode.$tag$ === newVNode.$tag$ && oldParentVNode.$elm$) {
|
|
496
|
-
// we've got an old slot vnode and the wrapper is being replaced
|
|
497
|
-
// so let's move the old slot content back to it's original location
|
|
498
|
-
putBackInOriginalLocation(oldParentVNode.$elm$, false);
|
|
499
|
-
}
|
|
500
|
-
}
|
|
501
|
-
}
|
|
502
444
|
return elm;
|
|
503
445
|
};
|
|
504
|
-
const putBackInOriginalLocation = (parentElm, recursive) => {
|
|
505
|
-
plt.$flags$ |= 1 /* isTmpDisconnected */;
|
|
506
|
-
const oldSlotChildNodes = parentElm.childNodes;
|
|
507
|
-
for (let i = oldSlotChildNodes.length - 1; i >= 0; i--) {
|
|
508
|
-
const childNode = oldSlotChildNodes[i];
|
|
509
|
-
if (childNode['s-hn'] !== hostTagName && childNode['s-ol']) {
|
|
510
|
-
// // this child node in the old element is from another component
|
|
511
|
-
// // remove this node from the old slot's parent
|
|
512
|
-
// childNode.remove();
|
|
513
|
-
// and relocate it back to it's original location
|
|
514
|
-
parentReferenceNode(childNode).insertBefore(childNode, referenceNode(childNode));
|
|
515
|
-
// remove the old original location comment entirely
|
|
516
|
-
// later on the patch function will know what to do
|
|
517
|
-
// and move this to the correct spot in need be
|
|
518
|
-
childNode['s-ol'].remove();
|
|
519
|
-
childNode['s-ol'] = undefined;
|
|
520
|
-
checkSlotRelocate = true;
|
|
521
|
-
}
|
|
522
|
-
if (recursive) {
|
|
523
|
-
putBackInOriginalLocation(childNode, recursive);
|
|
524
|
-
}
|
|
525
|
-
}
|
|
526
|
-
plt.$flags$ &= ~1 /* isTmpDisconnected */;
|
|
527
|
-
};
|
|
528
446
|
const addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
|
|
529
|
-
let containerElm = (
|
|
447
|
+
let containerElm = (parentElm);
|
|
530
448
|
let childNode;
|
|
531
449
|
if (containerElm.shadowRoot && containerElm.tagName === hostTagName) {
|
|
532
450
|
containerElm = containerElm.shadowRoot;
|
|
533
451
|
}
|
|
534
452
|
for (; startIdx <= endIdx; ++startIdx) {
|
|
535
453
|
if (vnodes[startIdx]) {
|
|
536
|
-
childNode = createElm(null, parentVNode, startIdx
|
|
454
|
+
childNode = createElm(null, parentVNode, startIdx);
|
|
537
455
|
if (childNode) {
|
|
538
456
|
vnodes[startIdx].$elm$ = childNode;
|
|
539
|
-
containerElm.insertBefore(childNode,
|
|
457
|
+
containerElm.insertBefore(childNode, before);
|
|
540
458
|
}
|
|
541
459
|
}
|
|
542
460
|
}
|
|
@@ -545,20 +463,6 @@ const removeVnodes = (vnodes, startIdx, endIdx, vnode, elm) => {
|
|
|
545
463
|
for (; startIdx <= endIdx; ++startIdx) {
|
|
546
464
|
if ((vnode = vnodes[startIdx])) {
|
|
547
465
|
elm = vnode.$elm$;
|
|
548
|
-
{
|
|
549
|
-
// we're removing this element
|
|
550
|
-
// so it's possible we need to show slot fallback content now
|
|
551
|
-
checkSlotFallbackVisibility = true;
|
|
552
|
-
if (elm['s-ol']) {
|
|
553
|
-
// remove the original location comment
|
|
554
|
-
elm['s-ol'].remove();
|
|
555
|
-
}
|
|
556
|
-
else {
|
|
557
|
-
// it's possible that child nodes of the node
|
|
558
|
-
// that's being removed are slot nodes
|
|
559
|
-
putBackInOriginalLocation(elm, true);
|
|
560
|
-
}
|
|
561
|
-
}
|
|
562
466
|
// remove the vnode's element from the dom
|
|
563
467
|
elm.remove();
|
|
564
468
|
}
|
|
@@ -602,20 +506,12 @@ const updateChildren = (parentElm, oldCh, newVNode, newCh) => {
|
|
|
602
506
|
newEndVnode = newCh[--newEndIdx];
|
|
603
507
|
}
|
|
604
508
|
else if (isSameVnode(oldStartVnode, newEndVnode)) {
|
|
605
|
-
// Vnode moved right
|
|
606
|
-
if ((oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot')) {
|
|
607
|
-
putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false);
|
|
608
|
-
}
|
|
609
509
|
patch(oldStartVnode, newEndVnode);
|
|
610
510
|
parentElm.insertBefore(oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
|
|
611
511
|
oldStartVnode = oldCh[++oldStartIdx];
|
|
612
512
|
newEndVnode = newCh[--newEndIdx];
|
|
613
513
|
}
|
|
614
514
|
else if (isSameVnode(oldEndVnode, newStartVnode)) {
|
|
615
|
-
// Vnode moved left
|
|
616
|
-
if ((oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot')) {
|
|
617
|
-
putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false);
|
|
618
|
-
}
|
|
619
515
|
patch(oldEndVnode, newStartVnode);
|
|
620
516
|
parentElm.insertBefore(oldEndVnode.$elm$, oldStartVnode.$elm$);
|
|
621
517
|
oldEndVnode = oldCh[--oldEndIdx];
|
|
@@ -635,7 +531,7 @@ const updateChildren = (parentElm, oldCh, newVNode, newCh) => {
|
|
|
635
531
|
if (idxInOld >= 0) {
|
|
636
532
|
elmToMove = oldCh[idxInOld];
|
|
637
533
|
if (elmToMove.$tag$ !== newStartVnode.$tag$) {
|
|
638
|
-
node = createElm(oldCh && oldCh[newStartIdx], newVNode, idxInOld
|
|
534
|
+
node = createElm(oldCh && oldCh[newStartIdx], newVNode, idxInOld);
|
|
639
535
|
}
|
|
640
536
|
else {
|
|
641
537
|
patch(elmToMove, newStartVnode);
|
|
@@ -646,12 +542,12 @@ const updateChildren = (parentElm, oldCh, newVNode, newCh) => {
|
|
|
646
542
|
}
|
|
647
543
|
else {
|
|
648
544
|
// new element
|
|
649
|
-
node = createElm(oldCh && oldCh[newStartIdx], newVNode, newStartIdx
|
|
545
|
+
node = createElm(oldCh && oldCh[newStartIdx], newVNode, newStartIdx);
|
|
650
546
|
newStartVnode = newCh[++newStartIdx];
|
|
651
547
|
}
|
|
652
548
|
if (node) {
|
|
653
549
|
{
|
|
654
|
-
|
|
550
|
+
oldStartVnode.$elm$.parentNode.insertBefore(node, oldStartVnode.$elm$);
|
|
655
551
|
}
|
|
656
552
|
}
|
|
657
553
|
}
|
|
@@ -667,36 +563,21 @@ const isSameVnode = (vnode1, vnode2) => {
|
|
|
667
563
|
// compare if two vnode to see if they're "technically" the same
|
|
668
564
|
// need to have the same element tag, and same key to be the same
|
|
669
565
|
if (vnode1.$tag$ === vnode2.$tag$) {
|
|
670
|
-
if (vnode1.$tag$ === 'slot') {
|
|
671
|
-
return vnode1.$name$ === vnode2.$name$;
|
|
672
|
-
}
|
|
673
566
|
{
|
|
674
567
|
return vnode1.$key$ === vnode2.$key$;
|
|
675
568
|
}
|
|
676
569
|
}
|
|
677
570
|
return false;
|
|
678
571
|
};
|
|
679
|
-
const referenceNode = (node) => {
|
|
680
|
-
// this node was relocated to a new location in the dom
|
|
681
|
-
// because of some other component's slot
|
|
682
|
-
// but we still have an html comment in place of where
|
|
683
|
-
// it's original location was according to it's original vdom
|
|
684
|
-
return (node && node['s-ol']) || node;
|
|
685
|
-
};
|
|
686
|
-
const parentReferenceNode = (node) => (node['s-ol'] ? node['s-ol'] : node).parentNode;
|
|
687
572
|
const patch = (oldVNode, newVNode) => {
|
|
688
573
|
const elm = (newVNode.$elm$ = oldVNode.$elm$);
|
|
689
574
|
const oldChildren = oldVNode.$children$;
|
|
690
575
|
const newChildren = newVNode.$children$;
|
|
691
|
-
const tag = newVNode.$tag$;
|
|
692
576
|
const text = newVNode.$text$;
|
|
693
|
-
let defaultHolder;
|
|
694
577
|
if (text === null) {
|
|
695
578
|
// element node
|
|
696
579
|
{
|
|
697
|
-
|
|
698
|
-
;
|
|
699
|
-
else {
|
|
580
|
+
{
|
|
700
581
|
// either this is the first render of an element OR it's an update
|
|
701
582
|
// AND we already know it's possible it could have changed
|
|
702
583
|
// this updates the element's css classes, attrs, props, listeners, etc.
|
|
@@ -721,147 +602,12 @@ const patch = (oldVNode, newVNode) => {
|
|
|
721
602
|
removeVnodes(oldChildren, 0, oldChildren.length - 1);
|
|
722
603
|
}
|
|
723
604
|
}
|
|
724
|
-
else if ((defaultHolder = elm['s-cr'])) {
|
|
725
|
-
// this element has slotted content
|
|
726
|
-
defaultHolder.parentNode.textContent = text;
|
|
727
|
-
}
|
|
728
605
|
else if (oldVNode.$text$ !== text) {
|
|
729
606
|
// update the text content for the text only vnode
|
|
730
607
|
// and also only if the text is different than before
|
|
731
608
|
elm.data = text;
|
|
732
609
|
}
|
|
733
610
|
};
|
|
734
|
-
const updateFallbackSlotVisibility = (elm) => {
|
|
735
|
-
// tslint:disable-next-line: prefer-const
|
|
736
|
-
let childNodes = elm.childNodes;
|
|
737
|
-
let childNode;
|
|
738
|
-
let i;
|
|
739
|
-
let ilen;
|
|
740
|
-
let j;
|
|
741
|
-
let slotNameAttr;
|
|
742
|
-
let nodeType;
|
|
743
|
-
for (i = 0, ilen = childNodes.length; i < ilen; i++) {
|
|
744
|
-
childNode = childNodes[i];
|
|
745
|
-
if (childNode.nodeType === 1 /* ElementNode */) {
|
|
746
|
-
if (childNode['s-sr']) {
|
|
747
|
-
// this is a slot fallback node
|
|
748
|
-
// get the slot name for this slot reference node
|
|
749
|
-
slotNameAttr = childNode['s-sn'];
|
|
750
|
-
// by default always show a fallback slot node
|
|
751
|
-
// then hide it if there are other slots in the light dom
|
|
752
|
-
childNode.hidden = false;
|
|
753
|
-
for (j = 0; j < ilen; j++) {
|
|
754
|
-
nodeType = childNodes[j].nodeType;
|
|
755
|
-
if (childNodes[j]['s-hn'] !== childNode['s-hn'] || slotNameAttr !== '') {
|
|
756
|
-
// this sibling node is from a different component OR is a named fallback slot node
|
|
757
|
-
if (nodeType === 1 /* ElementNode */ && slotNameAttr === childNodes[j].getAttribute('slot')) {
|
|
758
|
-
childNode.hidden = true;
|
|
759
|
-
break;
|
|
760
|
-
}
|
|
761
|
-
}
|
|
762
|
-
else {
|
|
763
|
-
// this is a default fallback slot node
|
|
764
|
-
// any element or text node (with content)
|
|
765
|
-
// should hide the default fallback slot node
|
|
766
|
-
if (nodeType === 1 /* ElementNode */ ||
|
|
767
|
-
(nodeType === 3 /* TextNode */ && childNodes[j].textContent.trim() !== '')) {
|
|
768
|
-
childNode.hidden = true;
|
|
769
|
-
break;
|
|
770
|
-
}
|
|
771
|
-
}
|
|
772
|
-
}
|
|
773
|
-
}
|
|
774
|
-
// keep drilling down
|
|
775
|
-
updateFallbackSlotVisibility(childNode);
|
|
776
|
-
}
|
|
777
|
-
}
|
|
778
|
-
};
|
|
779
|
-
const relocateNodes = [];
|
|
780
|
-
const relocateSlotContent = (elm) => {
|
|
781
|
-
// tslint:disable-next-line: prefer-const
|
|
782
|
-
let childNode;
|
|
783
|
-
let node;
|
|
784
|
-
let hostContentNodes;
|
|
785
|
-
let slotNameAttr;
|
|
786
|
-
let relocateNodeData;
|
|
787
|
-
let j;
|
|
788
|
-
let i = 0;
|
|
789
|
-
let childNodes = elm.childNodes;
|
|
790
|
-
let ilen = childNodes.length;
|
|
791
|
-
for (; i < ilen; i++) {
|
|
792
|
-
childNode = childNodes[i];
|
|
793
|
-
if (childNode['s-sr'] && (node = childNode['s-cr']) && node.parentNode) {
|
|
794
|
-
// first got the content reference comment node
|
|
795
|
-
// then we got it's parent, which is where all the host content is in now
|
|
796
|
-
hostContentNodes = node.parentNode.childNodes;
|
|
797
|
-
slotNameAttr = childNode['s-sn'];
|
|
798
|
-
for (j = hostContentNodes.length - 1; j >= 0; j--) {
|
|
799
|
-
node = hostContentNodes[j];
|
|
800
|
-
if (!node['s-cn'] && !node['s-nr'] && node['s-hn'] !== childNode['s-hn']) {
|
|
801
|
-
// let's do some relocating to its new home
|
|
802
|
-
// but never relocate a content reference node
|
|
803
|
-
// that is suppose to always represent the original content location
|
|
804
|
-
if (isNodeLocatedInSlot(node, slotNameAttr)) {
|
|
805
|
-
// it's possible we've already decided to relocate this node
|
|
806
|
-
relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
|
|
807
|
-
// made some changes to slots
|
|
808
|
-
// let's make sure we also double check
|
|
809
|
-
// fallbacks are correctly hidden or shown
|
|
810
|
-
checkSlotFallbackVisibility = true;
|
|
811
|
-
node['s-sn'] = node['s-sn'] || slotNameAttr;
|
|
812
|
-
if (relocateNodeData) {
|
|
813
|
-
// previously we never found a slot home for this node
|
|
814
|
-
// but turns out we did, so let's remember it now
|
|
815
|
-
relocateNodeData.$slotRefNode$ = childNode;
|
|
816
|
-
}
|
|
817
|
-
else {
|
|
818
|
-
// add to our list of nodes to relocate
|
|
819
|
-
relocateNodes.push({
|
|
820
|
-
$slotRefNode$: childNode,
|
|
821
|
-
$nodeToRelocate$: node,
|
|
822
|
-
});
|
|
823
|
-
}
|
|
824
|
-
if (node['s-sr']) {
|
|
825
|
-
relocateNodes.map((relocateNode) => {
|
|
826
|
-
if (isNodeLocatedInSlot(relocateNode.$nodeToRelocate$, node['s-sn'])) {
|
|
827
|
-
relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
|
|
828
|
-
if (relocateNodeData && !relocateNode.$slotRefNode$) {
|
|
829
|
-
relocateNode.$slotRefNode$ = relocateNodeData.$slotRefNode$;
|
|
830
|
-
}
|
|
831
|
-
}
|
|
832
|
-
});
|
|
833
|
-
}
|
|
834
|
-
}
|
|
835
|
-
else if (!relocateNodes.some((r) => r.$nodeToRelocate$ === node)) {
|
|
836
|
-
// so far this element does not have a slot home, not setting slotRefNode on purpose
|
|
837
|
-
// if we never find a home for this element then we'll need to hide it
|
|
838
|
-
relocateNodes.push({
|
|
839
|
-
$nodeToRelocate$: node,
|
|
840
|
-
});
|
|
841
|
-
}
|
|
842
|
-
}
|
|
843
|
-
}
|
|
844
|
-
}
|
|
845
|
-
if (childNode.nodeType === 1 /* ElementNode */) {
|
|
846
|
-
relocateSlotContent(childNode);
|
|
847
|
-
}
|
|
848
|
-
}
|
|
849
|
-
};
|
|
850
|
-
const isNodeLocatedInSlot = (nodeToRelocate, slotNameAttr) => {
|
|
851
|
-
if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
|
|
852
|
-
if (nodeToRelocate.getAttribute('slot') === null && slotNameAttr === '') {
|
|
853
|
-
return true;
|
|
854
|
-
}
|
|
855
|
-
if (nodeToRelocate.getAttribute('slot') === slotNameAttr) {
|
|
856
|
-
return true;
|
|
857
|
-
}
|
|
858
|
-
return false;
|
|
859
|
-
}
|
|
860
|
-
if (nodeToRelocate['s-sn'] === slotNameAttr) {
|
|
861
|
-
return true;
|
|
862
|
-
}
|
|
863
|
-
return slotNameAttr === '';
|
|
864
|
-
};
|
|
865
611
|
const renderVdom = (hostRef, renderFnResults) => {
|
|
866
612
|
const hostElm = hostRef.$hostElement$;
|
|
867
613
|
const cmpMeta = hostRef.$cmpMeta$;
|
|
@@ -879,104 +625,8 @@ const renderVdom = (hostRef, renderFnResults) => {
|
|
|
879
625
|
{
|
|
880
626
|
scopeId = hostElm['s-sc'];
|
|
881
627
|
}
|
|
882
|
-
{
|
|
883
|
-
contentRef = hostElm['s-cr'];
|
|
884
|
-
useNativeShadowDom = (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) !== 0;
|
|
885
|
-
// always reset
|
|
886
|
-
checkSlotFallbackVisibility = false;
|
|
887
|
-
}
|
|
888
628
|
// synchronous patch
|
|
889
629
|
patch(oldVNode, rootVnode);
|
|
890
|
-
{
|
|
891
|
-
// while we're moving nodes around existing nodes, temporarily disable
|
|
892
|
-
// the disconnectCallback from working
|
|
893
|
-
plt.$flags$ |= 1 /* isTmpDisconnected */;
|
|
894
|
-
if (checkSlotRelocate) {
|
|
895
|
-
relocateSlotContent(rootVnode.$elm$);
|
|
896
|
-
let relocateData;
|
|
897
|
-
let nodeToRelocate;
|
|
898
|
-
let orgLocationNode;
|
|
899
|
-
let parentNodeRef;
|
|
900
|
-
let insertBeforeNode;
|
|
901
|
-
let refNode;
|
|
902
|
-
let i = 0;
|
|
903
|
-
for (; i < relocateNodes.length; i++) {
|
|
904
|
-
relocateData = relocateNodes[i];
|
|
905
|
-
nodeToRelocate = relocateData.$nodeToRelocate$;
|
|
906
|
-
if (!nodeToRelocate['s-ol']) {
|
|
907
|
-
// add a reference node marking this node's original location
|
|
908
|
-
// keep a reference to this node for later lookups
|
|
909
|
-
orgLocationNode =
|
|
910
|
-
doc.createTextNode('');
|
|
911
|
-
orgLocationNode['s-nr'] = nodeToRelocate;
|
|
912
|
-
nodeToRelocate.parentNode.insertBefore((nodeToRelocate['s-ol'] = orgLocationNode), nodeToRelocate);
|
|
913
|
-
}
|
|
914
|
-
}
|
|
915
|
-
for (i = 0; i < relocateNodes.length; i++) {
|
|
916
|
-
relocateData = relocateNodes[i];
|
|
917
|
-
nodeToRelocate = relocateData.$nodeToRelocate$;
|
|
918
|
-
if (relocateData.$slotRefNode$) {
|
|
919
|
-
// by default we're just going to insert it directly
|
|
920
|
-
// after the slot reference node
|
|
921
|
-
parentNodeRef = relocateData.$slotRefNode$.parentNode;
|
|
922
|
-
insertBeforeNode = relocateData.$slotRefNode$.nextSibling;
|
|
923
|
-
orgLocationNode = nodeToRelocate['s-ol'];
|
|
924
|
-
while ((orgLocationNode = orgLocationNode.previousSibling)) {
|
|
925
|
-
refNode = orgLocationNode['s-nr'];
|
|
926
|
-
if (refNode && refNode['s-sn'] === nodeToRelocate['s-sn'] && parentNodeRef === refNode.parentNode) {
|
|
927
|
-
refNode = refNode.nextSibling;
|
|
928
|
-
if (!refNode || !refNode['s-nr']) {
|
|
929
|
-
insertBeforeNode = refNode;
|
|
930
|
-
break;
|
|
931
|
-
}
|
|
932
|
-
}
|
|
933
|
-
}
|
|
934
|
-
if ((!insertBeforeNode && parentNodeRef !== nodeToRelocate.parentNode) ||
|
|
935
|
-
nodeToRelocate.nextSibling !== insertBeforeNode) {
|
|
936
|
-
// we've checked that it's worth while to relocate
|
|
937
|
-
// since that the node to relocate
|
|
938
|
-
// has a different next sibling or parent relocated
|
|
939
|
-
if (nodeToRelocate !== insertBeforeNode) {
|
|
940
|
-
if (!nodeToRelocate['s-hn'] && nodeToRelocate['s-ol']) {
|
|
941
|
-
// probably a component in the index.html that doesn't have it's hostname set
|
|
942
|
-
nodeToRelocate['s-hn'] = nodeToRelocate['s-ol'].parentNode.nodeName;
|
|
943
|
-
}
|
|
944
|
-
// add it back to the dom but in its new home
|
|
945
|
-
parentNodeRef.insertBefore(nodeToRelocate, insertBeforeNode);
|
|
946
|
-
}
|
|
947
|
-
}
|
|
948
|
-
}
|
|
949
|
-
else {
|
|
950
|
-
// this node doesn't have a slot home to go to, so let's hide it
|
|
951
|
-
if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
|
|
952
|
-
nodeToRelocate.hidden = true;
|
|
953
|
-
}
|
|
954
|
-
}
|
|
955
|
-
}
|
|
956
|
-
}
|
|
957
|
-
if (checkSlotFallbackVisibility) {
|
|
958
|
-
updateFallbackSlotVisibility(rootVnode.$elm$);
|
|
959
|
-
}
|
|
960
|
-
// done moving nodes around
|
|
961
|
-
// allow the disconnect callback to work again
|
|
962
|
-
plt.$flags$ &= ~1 /* isTmpDisconnected */;
|
|
963
|
-
// always reset
|
|
964
|
-
relocateNodes.length = 0;
|
|
965
|
-
}
|
|
966
|
-
};
|
|
967
|
-
const getElement = (ref) => (getHostRef(ref).$hostElement$ );
|
|
968
|
-
const createEvent = (ref, name, flags) => {
|
|
969
|
-
const elm = getElement(ref);
|
|
970
|
-
return {
|
|
971
|
-
emit: (detail) => {
|
|
972
|
-
return emitEvent(elm, name, {
|
|
973
|
-
bubbles: !!(flags & 4 /* Bubbles */),
|
|
974
|
-
composed: !!(flags & 2 /* Composed */),
|
|
975
|
-
cancelable: !!(flags & 1 /* Cancellable */),
|
|
976
|
-
detail,
|
|
977
|
-
});
|
|
978
|
-
},
|
|
979
|
-
};
|
|
980
630
|
};
|
|
981
631
|
/**
|
|
982
632
|
* Helper function to create & dispatch a custom Event on a provided target
|
|
@@ -1022,9 +672,6 @@ const dispatchHooks = (hostRef, isInitialLoad) => {
|
|
|
1022
672
|
hostRef.$queuedListeners$ = null;
|
|
1023
673
|
}
|
|
1024
674
|
}
|
|
1025
|
-
{
|
|
1026
|
-
promise = safeCall(instance, 'componentWillLoad');
|
|
1027
|
-
}
|
|
1028
675
|
}
|
|
1029
676
|
endSchedule();
|
|
1030
677
|
return then(promise, () => updateComponent(hostRef, instance, isInitialLoad));
|
|
@@ -1159,10 +806,6 @@ const parsePropertyValue = (propValue, propType) => {
|
|
|
1159
806
|
// but we'll cheat here and say that the string "false" is the boolean false
|
|
1160
807
|
return propValue === 'false' ? false : propValue === '' || !!propValue;
|
|
1161
808
|
}
|
|
1162
|
-
if (propType & 2 /* Number */) {
|
|
1163
|
-
// force it to be a number
|
|
1164
|
-
return parseFloat(propValue);
|
|
1165
|
-
}
|
|
1166
809
|
if (propType & 1 /* String */) {
|
|
1167
810
|
// could have been passed as a number or boolean
|
|
1168
811
|
// but we still want it as a string
|
|
@@ -1359,15 +1002,6 @@ const connectedCallback = (elm) => {
|
|
|
1359
1002
|
if (!(hostRef.$flags$ & 1 /* hasConnected */)) {
|
|
1360
1003
|
// first time this component has connected
|
|
1361
1004
|
hostRef.$flags$ |= 1 /* hasConnected */;
|
|
1362
|
-
{
|
|
1363
|
-
// initUpdate
|
|
1364
|
-
// if the slot polyfill is required we'll need to put some nodes
|
|
1365
|
-
// in here to act as original content anchors as we move nodes around
|
|
1366
|
-
// host element has been connected to the DOM
|
|
1367
|
-
if ((cmpMeta.$flags$ & (4 /* hasSlotRelocation */ | 8 /* needsShadowDomShim */))) {
|
|
1368
|
-
setContentReference(elm);
|
|
1369
|
-
}
|
|
1370
|
-
}
|
|
1371
1005
|
{
|
|
1372
1006
|
// find the first ancestor component (if there is one) and register
|
|
1373
1007
|
// this component as one of the actively loading child components for its ancestor
|
|
@@ -1407,30 +1041,15 @@ const connectedCallback = (elm) => {
|
|
|
1407
1041
|
endConnected();
|
|
1408
1042
|
}
|
|
1409
1043
|
};
|
|
1410
|
-
const setContentReference = (elm) => {
|
|
1411
|
-
// only required when we're NOT using native shadow dom (slot)
|
|
1412
|
-
// or this browser doesn't support native shadow dom
|
|
1413
|
-
// and this host element was NOT created with SSR
|
|
1414
|
-
// let's pick out the inner content for slot projection
|
|
1415
|
-
// create a node to represent where the original
|
|
1416
|
-
// content was first placed, which is useful later on
|
|
1417
|
-
const contentRefElm = (elm['s-cr'] = doc.createComment(''));
|
|
1418
|
-
contentRefElm['s-cn'] = true;
|
|
1419
|
-
elm.insertBefore(contentRefElm, elm.firstChild);
|
|
1420
|
-
};
|
|
1421
1044
|
const disconnectedCallback = (elm) => {
|
|
1422
1045
|
if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
|
|
1423
1046
|
const hostRef = getHostRef(elm);
|
|
1424
|
-
const instance = hostRef.$lazyInstance$ ;
|
|
1425
1047
|
{
|
|
1426
1048
|
if (hostRef.$rmListeners$) {
|
|
1427
1049
|
hostRef.$rmListeners$.map((rmListener) => rmListener());
|
|
1428
1050
|
hostRef.$rmListeners$ = undefined;
|
|
1429
1051
|
}
|
|
1430
1052
|
}
|
|
1431
|
-
{
|
|
1432
|
-
safeCall(instance, 'disconnectedCallback');
|
|
1433
|
-
}
|
|
1434
1053
|
}
|
|
1435
1054
|
};
|
|
1436
1055
|
const bootstrapLazy = (lazyBundles, options = {}) => {
|
|
@@ -1612,8 +1231,6 @@ const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
|
|
|
1612
1231
|
|
|
1613
1232
|
exports.Host = Host;
|
|
1614
1233
|
exports.bootstrapLazy = bootstrapLazy;
|
|
1615
|
-
exports.createEvent = createEvent;
|
|
1616
|
-
exports.getElement = getElement;
|
|
1617
1234
|
exports.h = h;
|
|
1618
1235
|
exports.promiseResolve = promiseResolve;
|
|
1619
1236
|
exports.registerInstance = registerInstance;
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-a67728b4.js');
|
|
6
6
|
|
|
7
7
|
/*
|
|
8
8
|
Stencil Client Patch Esm v2.8.1 | MIT Licensed | https://stenciljs.com
|
|
@@ -14,7 +14,7 @@ const patchEsm = () => {
|
|
|
14
14
|
const defineCustomElements = (win, options) => {
|
|
15
15
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
16
16
|
return patchEsm().then(() => {
|
|
17
|
-
return index.bootstrapLazy([["salla-
|
|
17
|
+
return index.bootstrapLazy([["salla-login_2.cjs",[[1,"salla-login",{"searchIcon":[1,"search-icon"],"visible":[1540],"searchTerm":[32],"results":[32],"fetchStatus":[32],"showResult":[32]},[[8,"click","handleClick"]]],[0,"salla-search-modal",{"searchPlaceholder":[1,"search-placeholder"],"searchTerm":[32],"results":[32],"fetchStatus":[32],"showResult":[32],"showModal":[32]}]]]], options);
|
|
18
18
|
});
|
|
19
19
|
};
|
|
20
20
|
|