@sc-360-v2/storefront-cms-library 0.2.88 → 0.2.90

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.
@@ -28,44 +28,44 @@ $rai: "repeater-advertise-item";
28
28
  var(--_ctm-tab-rep-lt-mn, var(--_ctm-rep-lt-mn, var(--_ctm-lt-mn, var(--_tst-lt-mn))))
29
29
  );
30
30
  background-color: var(
31
- --_ctm-mob-rep-dn-bd-cr,
32
- var(--_ctm-tab-rep-dn-bd-cr, var(--_ctm-rep-dn-bd-cr))
31
+ --_ctm-mob-rep-dn-rr-wt-bd-cr,
32
+ var(--_ctm-tab-rep-dn-rr-wt-bd-cr, var(--_ctm-rep-dn-rr-wt-bd-cr))
33
33
  );
34
34
  background-image: var(
35
- --_ctm-mob-rep-dn-bd-ie,
36
- var(--_ctm-tab-rep-dn-bd-ie, var(--_ctm-rep-dn-bd-ie))
35
+ --_ctm-mob-rep-dn-rr-wt-bd-ie,
36
+ var(--_ctm-tab-rep-dn-rr-wt-bd-ie, var(--_ctm-rep-dn-rr-wt-bd-ie))
37
37
  );
38
38
  background-attachment: var(
39
- --_ctm-mob-rep-dn-bd-at,
40
- var(--_ctm-tab-rep-dn-bd-at, var(--_ctm-rep-dn-bd-at))
39
+ --_ctm-mob-rep-dn-rr-wt-bd-at,
40
+ var(--_ctm-tab-rep-dn-rr-wt-bd-at, var(--_ctm-rep-dn-rr-wt-bd-at))
41
41
  );
42
42
  background-position: var(
43
- --_ctm-mob-rep-dn-bd-pn,
44
- var(--_ctm-tab-rep-dn-bd-pn, var(--_ctm-rep-dn-bd-pn))
43
+ --_ctm-mob-rep-dn-rr-wt-bd-pn,
44
+ var(--_ctm-tab-rep-dn-rr-wt-bd-pn, var(--_ctm-rep-dn-rr-wt-bd-pn))
45
45
  );
46
46
  background-repeat: var(
47
- --_ctm-mob-rep-dn-bd-rt,
48
- var(--_ctm-tab-rep-dn-bd-rt, var(--_ctm-rep-dn-bd-rt))
47
+ --_ctm-mob-rep-dn-rr-wt-bd-rt,
48
+ var(--_ctm-tab-rep-dn-rr-wt-bd-rt, var(--_ctm-rep-dn-rr-wt-bd-rt))
49
49
  );
50
50
  background-size: var(
51
- --_ctm-mob-rep-dn-bd-se,
52
- var(--_ctm-tab-rep-dn-bd-se, var(--_ctm-rep-dn-bd-se))
51
+ --_ctm-mob-rep-dn-rr-wt-bd-se,
52
+ var(--_ctm-tab-rep-dn-rr-wt-bd-se, var(--_ctm-rep-dn-rr-wt-bd-se))
53
53
  );
54
54
  border-radius: var(
55
- --_ctm-mob-rep-dn-br-rs,
56
- var(--_ctm-tab-rep-dn-br-rs, var(--_ctm-rep-dn-br-rs))
55
+ --_ctm-mob-rep-dn-rr-wt-br-rs,
56
+ var(--_ctm-tab-rep-dn-rr-wt-br-rs, var(--_ctm-rep-dn-rr-wt-br-rs))
57
57
  );
58
58
  border-color: var(
59
- --_ctm-mob-rep-dn-br-cr,
60
- var(--_ctm-tab-rep-dn-br-cr, var(--_ctm-rep-dn-br-cr))
59
+ --_ctm-mob-rep-dn-rr-wt-br-cr,
60
+ var(--_ctm-tab-rep-dn-rr-wt-br-cr, var(--_ctm-rep-dn-rr-wt-br-cr))
61
61
  );
62
62
  border-style: var(
63
- --_ctm-mob-rep-dn-br-se,
64
- var(--_ctm-tab-rep-dn-br-se, var(--_ctm-rep-dn-br-se))
63
+ --_ctm-mob-rep-dn-rr-wt-br-se,
64
+ var(--_ctm-tab-rep-dn-rr-wt-br-se, var(--_ctm-rep-dn-rr-wt-br-se))
65
65
  );
66
66
  border-width: var(
67
- --_ctm-mob-rep-dn-br-wh,
68
- var(--_ctm-tab-rep-dn-br-wh, var(--_ctm-rep-dn-br-wh))
67
+ --_ctm-mob-rep-dn-rr-wt-br-wh,
68
+ var(--_ctm-tab-rep-dn-rr-wt-br-wh, var(--_ctm-rep-dn-rr-wt-br-wh))
69
69
  );
70
70
  box-shadow: var(
71
71
  --_hover-show-shadow,
@@ -302,6 +302,337 @@ $rai: "repeater-advertise-item";
302
302
  max-height: 100%;
303
303
  }
304
304
  }
305
+
306
+ .loadMore__container {
307
+ display: flex;
308
+ align-items: center;
309
+ justify-content: center;
310
+
311
+ width: 100%;
312
+ .action__button {
313
+ display: flex;
314
+ align-items: center;
315
+ height: 40px;
316
+ cursor: pointer;
317
+ .btn__container {
318
+ display: flex;
319
+ align-items: center;
320
+ justify-content: center;
321
+ gap: 10px;
322
+ height: 100%;
323
+ width: 100%;
324
+ padding: 16px;
325
+ .btn__with__text {
326
+ height: 2.5rem;
327
+ }
328
+ }
329
+ &.loadMore {
330
+ background-color: var(
331
+ --_sf-at-hr-bd-cr,
332
+ var(
333
+ --_ctm-mob-rep-dn-bn-se-dt-se-bd-cr,
334
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-bd-cr, var(--_ctm-rep-dn-bn-se-dt-se-bd-cr))
335
+ )
336
+ );
337
+ border-color: var(
338
+ --_sf-at-hr-br-cr,
339
+ var(
340
+ --_ctm-mob-rep-dn-bn-se-dt-se-br-cr,
341
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-br-cr, var(--_ctm-rep-dn-bn-se-dt-se-br-cr))
342
+ )
343
+ );
344
+ border-style: var(
345
+ --_sf-at-hr-br-se,
346
+ var(
347
+ --_ctm-mob-rep-dn-bn-se-dt-se-br-se,
348
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-br-se, var(--_ctm-rep-dn-bn-se-dt-se-br-se))
349
+ )
350
+ );
351
+ border-width: var(
352
+ --_sf-at-hr-br-wt,
353
+ var(
354
+ --_ctm-mob-rep-dn-bn-se-dt-se-br-wh,
355
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-br-wh, var(--_ctm-rep-dn-bn-se-dt-se-br-wh))
356
+ )
357
+ );
358
+ border-radius: var(
359
+ --_sf-at-hr-br-br,
360
+ var(
361
+ --_ctm-mob-rep-dn-bn-se-dt-se-br-rs,
362
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-br-rs, var(--_ctm-rep-dn-bn-se-dt-se-br-rs))
363
+ )
364
+ );
365
+
366
+ box-shadow: var(
367
+ --_hover-show-shadow,
368
+ var(
369
+ --_sf-at-hr-bx-sw,
370
+ var(
371
+ --_show-shadow,
372
+ var(
373
+ --_ctm-mob-rep-dn-bn-se-dt-se-sw-ae,
374
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-ae, var(--_ctm-rep-dn-bn-se-dt-se-sw-ae))
375
+ )
376
+ var(
377
+ --_ctm-mob-rep-dn-bn-se-dt-se-sw-br,
378
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-br, var(--_ctm-rep-dn-bn-se-dt-se-sw-br))
379
+ )
380
+ var(
381
+ --_ctm-mob-rep-dn-bn-se-dt-se-sw-sd,
382
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-sd, var(--_ctm-rep-dn-bn-se-dt-se-sw-sd))
383
+ )
384
+ var(
385
+ --_ctm-mob-rep-dn-bn-se-dt-se-sw-cr,
386
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-cr, var(--_ctm-rep-dn-bn-se-dt-se-sw-cr))
387
+ )
388
+ )
389
+ )
390
+ );
391
+
392
+ .btn__container {
393
+ gap: var(
394
+ --_ctm-mob-rep-dn-bn-se-dt-se-in-ad-tt-sg,
395
+ var(
396
+ --_ctm-tab-rep-dn-bn-se-dt-se-in-ad-tt-sg,
397
+ var(--_ctm-rep-dn-bn-se-dt-se-in-ad-tt-sg)
398
+ )
399
+ );
400
+ justify-content: var(
401
+ --_ctm-mob-rep-dn-bn-se-dt-se-at,
402
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-at, var(--_ctm-rep-dn-bn-se-dt-se-at))
403
+ );
404
+
405
+ &[data-actions-icon-position="left"],
406
+ &[data-actions-icon-position="center"] {
407
+ flex-direction: row;
408
+ }
409
+ &[data-actions-icon-position="right"] {
410
+ flex-direction: row-reverse;
411
+ }
412
+ span {
413
+ svg {
414
+ width: var(
415
+ --_ctm-mob-rep-dn-bn-se-dt-se-in-se,
416
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-in-se, var(--_ctm-rep-dn-bn-se-dt-se-in-se))
417
+ );
418
+ height: var(
419
+ --_ctm-mob-rep-dn-bn-se-dt-se-in-se,
420
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-in-se, var(--_ctm-rep-dn-bn-se-dt-se-in-se))
421
+ );
422
+
423
+ path {
424
+ stroke: var(
425
+ --_ctm-mob-rep-dn-bn-se-dt-se-in-c1,
426
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-in-c1, var(--_ctm-rep-dn-bn-se-dt-se-in-c1))
427
+ );
428
+ }
429
+ }
430
+ }
431
+ .btn__with__text {
432
+ color: var(
433
+ --_ctm-mob-rep-dn-bn-se-dt-se-cr,
434
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-cr, var(--_ctm-rep-dn-bn-se-dt-se-cr))
435
+ );
436
+ font-family: var(
437
+ --_ctm-mob-rep-dn-bn-se-dt-se-ft-fy,
438
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-fy, var(--_ctm-rep-dn-bn-se-dt-se-ft-fy))
439
+ ),
440
+ sans-serif;
441
+ font-size: var(
442
+ --_ctm-mob-rep-dn-bn-se-dt-se-ft-se,
443
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-se, var(--_ctm-rep-dn-bn-se-dt-se-ft-se))
444
+ );
445
+ font-weight: var(
446
+ --_ctm-mob-rep-dn-bn-se-dt-se-ft-wt,
447
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-wt, var(--_ctm-rep-dn-bn-se-dt-se-ft-wt))
448
+ );
449
+ font-style: var(
450
+ --_ctm-mob-rep-dn-bn-se-dt-se-ft-se-ic,
451
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-se-ic, var(--_ctm-rep-dn-bn-se-dt-se-ft-se-ic))
452
+ );
453
+ text-align: var(
454
+ --_ctm-mob-rep-dn-bn-se-dt-se-tt-an,
455
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-tt-an, var(--_ctm-rep-dn-bn-se-dt-se-tt-an))
456
+ );
457
+ letter-spacing: var(
458
+ --_ctm-mob-rep-dn-bn-se-dt-se-lr-sg,
459
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-lr-sg, var(--_ctm-rep-dn-bn-se-dt-se-lr-sg))
460
+ );
461
+ line-height: var(
462
+ --_ctm-mob-rep-dn-bn-se-dt-se-le-ht,
463
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-le-ht, var(--_ctm-rep-dn-bn-se-dt-se-le-ht))
464
+ );
465
+ text-decoration: var(
466
+ --_ctm-mob-rep-dn-bn-se-dt-se-ue,
467
+ var(--_ctm-tab-rep-dn-bn-se-dt-se-ue, var(--_ctm-rep-dn-bn-se-dt-se-ue))
468
+ );
469
+ }
470
+
471
+ &:hover {
472
+ background-color: var(
473
+ --_sf-at-hr-bd-cr,
474
+ var(
475
+ --_ctm-mob-rep-dn-bn-se-hr-se-bd-cr,
476
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-bd-cr, var(--_ctm-rep-dn-bn-se-hr-se-bd-cr))
477
+ )
478
+ );
479
+ border-color: var(
480
+ --_sf-at-hr-br-cr,
481
+ var(
482
+ --_ctm-mob-rep-dn-bn-se-hr-se-br-cr,
483
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-br-cr, var(--_ctm-rep-dn-bn-se-hr-se-br-cr))
484
+ )
485
+ );
486
+ border-style: var(
487
+ --_sf-at-hr-br-se,
488
+ var(
489
+ --_ctm-mob-rep-dn-bn-se-hr-se-br-se,
490
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-br-se, var(--_ctm-rep-dn-bn-se-hr-se-br-se))
491
+ )
492
+ );
493
+ border-width: var(
494
+ --_sf-at-hr-br-wt,
495
+ var(
496
+ --_ctm-mob-rep-dn-bn-se-hr-se-br-wh,
497
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-br-wh, var(--_ctm-rep-dn-bn-se-hr-se-br-wh))
498
+ )
499
+ );
500
+ border-radius: var(
501
+ --_sf-at-hr-br-br,
502
+ var(
503
+ --_ctm-mob-rep-dn-bn-se-hr-se-br-rs,
504
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-br-rs, var(--_ctm-rep-dn-bn-se-hr-se-br-rs))
505
+ )
506
+ );
507
+ box-shadow: var(
508
+ --_hover-show-shadow,
509
+ var(
510
+ --_sf-at-hr-bx-sw,
511
+ var(
512
+ --_show-shadow,
513
+ var(
514
+ --_ctm-mob-rep-dn-bn-se-hr-se-sw-ae,
515
+ var(
516
+ --_ctm-tab-rep-dn-bn-se-hr-se-sw-ae,
517
+ var(--_ctm-rep-dn-bn-se-hr-se-sw-ae)
518
+ )
519
+ )
520
+ var(
521
+ --_ctm-mob-rep-dn-bn-se-hr-se-sw-br,
522
+ var(
523
+ --_ctm-tab-rep-dn-bn-se-hr-se-sw-br,
524
+ var(--_ctm-rep-dn-bn-se-hr-se-sw-br)
525
+ )
526
+ )
527
+ var(
528
+ --_ctm-mob-rep-dn-bn-se-hr-se-sw-sd,
529
+ var(
530
+ --_ctm-tab-rep-dn-bn-se-hr-se-sw-sd,
531
+ var(--_ctm-rep-dn-bn-se-hr-se-sw-sd)
532
+ )
533
+ )
534
+ var(
535
+ --_ctm-mob-rep-dn-bn-se-hr-se-sw-cr,
536
+ var(
537
+ --_ctm-tab-rep-dn-bn-se-hr-se-sw-cr,
538
+ var(--_ctm-rep-dn-bn-se-hr-se-sw-cr)
539
+ )
540
+ )
541
+ )
542
+ )
543
+ );
544
+
545
+ .btn__container {
546
+ gap: var(
547
+ --_ctm-mob-rep-dn-bn-se-hr-se-in-ad-tt-sg,
548
+ var(
549
+ --_ctm-tab-rep-dn-bn-se-hr-se-in-ad-tt-sg,
550
+ var(--_ctm-rep-dn-bn-se-hr-se-in-ad-tt-sg)
551
+ )
552
+ );
553
+ justify-content: var(
554
+ --_ctm-mob-rep-dn-bn-se-hr-se-at,
555
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-at, var(--_ctm-rep-dn-bn-se-hr-se-at))
556
+ );
557
+
558
+ &[data-actions-icon-position-hover="left"],
559
+ &[data-actions-icon-position-hover="center"] {
560
+ flex-direction: row;
561
+ }
562
+ &[data-actions-icon-position-hover="right"] {
563
+ flex-direction: row-reverse;
564
+ }
565
+ span {
566
+ svg {
567
+ width: var(
568
+ --_ctm-mob-rep-dn-bn-se-hr-se-in-se,
569
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
570
+ );
571
+ height: var(
572
+ --_ctm-mob-rep-dn-bn-se-hr-se-in-se,
573
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
574
+ );
575
+
576
+ path {
577
+ stroke: var(
578
+ --_ctm-mob-rep-dn-bn-se-hr-se-in-c1,
579
+ var(
580
+ --_ctm-tab-rep-dn-bn-se-hr-se-in-c1,
581
+ var(--_ctm-rep-dn-bn-se-hr-se-in-c1)
582
+ )
583
+ );
584
+ }
585
+ }
586
+ }
587
+ .btn__with__text {
588
+ color: var(
589
+ --_ctm-mob-rep-dn-bn-se-hr-se-cr,
590
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-cr, var(--_ctm-rep-dn-bn-se-hr-se-cr))
591
+ );
592
+ font-family: var(
593
+ --_ctm-mob-rep-dn-bn-se-hr-se-ft-fy,
594
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-fy, var(--_ctm-rep-dn-bn-se-hr-se-ft-fy))
595
+ ),
596
+ sans-serif;
597
+ font-size: var(
598
+ --_ctm-mob-rep-dn-bn-se-hr-se-ft-se,
599
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-se, var(--_ctm-rep-dn-bn-se-hr-se-ft-se))
600
+ );
601
+ font-weight: var(
602
+ --_ctm-mob-rep-dn-bn-se-hr-se-ft-wt,
603
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-wt, var(--_ctm-rep-dn-bn-se-hr-se-ft-wt))
604
+ );
605
+ font-style: var(
606
+ --_ctm-mob-rep-dn-bn-se-hr-se-ft-se-ic,
607
+ var(
608
+ --_ctm-tab-rep-dn-bn-se-hr-se-ft-se-ic,
609
+ var(--_ctm-rep-dn-bn-se-hr-se-ft-se-ic)
610
+ )
611
+ );
612
+ text-align: var(
613
+ --_ctm-mob-rep-dn-bn-se-hr-se-tt-an,
614
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-tt-an, var(--_ctm-rep-dn-bn-se-hr-se-tt-an))
615
+ );
616
+ letter-spacing: var(
617
+ --_ctm-mob-rep-dn-bn-se-hr-se-lr-sg,
618
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-lr-sg, var(--_ctm-rep-dn-bn-se-hr-se-lr-sg))
619
+ );
620
+ line-height: var(
621
+ --_ctm-mob-rep-dn-bn-se-hr-se-le-ht,
622
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-le-ht, var(--_ctm-rep-dn-bn-se-hr-se-le-ht))
623
+ );
624
+ text-decoration: var(
625
+ --_ctm-mob-rep-dn-bn-se-hr-se-ue,
626
+ var(--_ctm-tab-rep-dn-bn-se-hr-se-ue, var(--_ctm-rep-dn-bn-se-hr-se-ue))
627
+ );
628
+ }
629
+ }
630
+ }
631
+ }
632
+ }
633
+ }
634
+ }
635
+
305
636
  // &[data-view-state="full"] {
306
637
  // width: auto;
307
638
  // margin: 0;
@@ -47,15 +47,22 @@ interface selfLayoutInterface {
47
47
  stopOnMouseEnter: CMSIBCommonInterface;
48
48
  stopOnInteraction: CMSIBCommonInterface;
49
49
  displayAds: CMSIBCommonInterface;
50
+ loadMoreItemsOn: CMSIBCommonInterface;
50
51
  }
51
52
  export interface selfDesignInterface {
52
53
  selectorKey: string;
54
+ repeaterWidget: any;
55
+ buttonStyle: any;
53
56
  }
54
57
  export declare enum selfSelectorKeysEnum {
55
58
  LAYOUT = "layout",
56
59
  DESIGN = "design",
57
60
  DATA_CONNECTOR = "dataConnector",
58
- CONTENT = "content"
61
+ CONTENT = "content",
62
+ DEFAULT_STATE = "defaultState",
63
+ HOVER_STATE = "hoverState",
64
+ SELECTED_STATE = "selectedState",
65
+ BUTTON_STYLE = "buttonStyle"
59
66
  }
60
67
  export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
61
68
  export {};
package/dist/widget.scss CHANGED
@@ -96,3 +96,5 @@
96
96
  @use "./buy-for-tab-container.scss";
97
97
  @use "./toaster.scss";
98
98
  @use "./spotlight.scss";
99
+ @use "./quick-order-pad.scss";
100
+ @use "./product-customizations.scss";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sc-360-v2/storefront-cms-library",
3
- "version": "0.2.88",
3
+ "version": "0.2.90",
4
4
  "main": "/dist/index.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "exports": {