@empathyco/x-components 6.0.0-alpha.82 → 6.0.0-alpha.84

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 (7) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/design-system/deprecated-full-theme.css +375 -375
  3. package/js/components/base-teleport.vue.js.map +1 -1
  4. package/js/components/base-teleport.vue2.js +12 -14
  5. package/js/components/base-teleport.vue2.js.map +1 -1
  6. package/package.json +2 -2
  7. package/types/components/base-teleport.vue.d.ts.map +1 -1
package/CHANGELOG.md CHANGED
@@ -3,6 +3,24 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [6.0.0-alpha.84](https://github.com/empathyco/x/compare/@empathyco/x-components@6.0.0-alpha.83...@empathyco/x-components@6.0.0-alpha.84) (2025-05-15)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **base-teleport:** improve target element observation logic ([4304720](https://github.com/empathyco/x/commit/4304720aaf81202f32555a87d04c078cbfb8f122))
12
+
13
+
14
+
15
+ ## [6.0.0-alpha.83](https://github.com/empathyco/x/compare/@empathyco/x-components@6.0.0-alpha.82...@empathyco/x-components@6.0.0-alpha.83) (2025-05-14)
16
+
17
+
18
+ ### Bug Fixes
19
+
20
+ * **base-teleport:** add style tag after DOMContentLoaded was fired ([1086d37](https://github.com/empathyco/x/commit/1086d37358c50ebf0396193607d1c3075ffdbdfa))
21
+
22
+
23
+
6
24
  ## [6.0.0-alpha.82](https://github.com/empathyco/x/compare/@empathyco/x-components@6.0.0-alpha.81...@empathyco/x-components@6.0.0-alpha.82) (2025-05-14)
7
25
 
8
26
  **Note:** Version bump only for package @empathyco/x-components
package/design-system/deprecated-full-theme.css CHANGED
@@ -1,4 +1,5 @@
1
1
 
2
+
2
3
  .x-uppercase {
3
4
  text-transform: uppercase;
4
5
  }
@@ -33,7 +34,6 @@
33
34
  -webkit-text-decoration-line: none;
34
35
  text-decoration-line: none;
35
36
  }
36
-
37
37
  .x-static {
38
38
  position: static !important;
39
39
  }
@@ -3314,6 +3314,49 @@
3314
3314
  [dir="rtl"] .x-border-radius--bottom-right-20 {
3315
3315
  border-bottom-left-radius: var(--x-size-base-20) !important;
3316
3316
  }
3317
+ .x-border-color--lead {
3318
+ border-color: var(--x-color-base-lead) !important;
3319
+ }
3320
+
3321
+ .x-border-color--auxiliary {
3322
+ border-color: var(--x-color-base-auxiliary) !important;
3323
+ }
3324
+
3325
+ .x-border-color--neutral-10 {
3326
+ border-color: var(--x-color-base-neutral-10) !important;
3327
+ }
3328
+
3329
+ .x-border-color--neutral-35 {
3330
+ border-color: var(--x-color-base-neutral-35) !important;
3331
+ }
3332
+
3333
+ .x-border-color--neutral-70 {
3334
+ border-color: var(--x-color-base-neutral-70) !important;
3335
+ }
3336
+
3337
+ .x-border-color--neutral-95 {
3338
+ border-color: var(--x-color-base-neutral-95) !important;
3339
+ }
3340
+
3341
+ .x-border-color--neutral-100 {
3342
+ border-color: var(--x-color-base-neutral-100) !important;
3343
+ }
3344
+
3345
+ .x-border-color--accent {
3346
+ border-color: var(--x-color-base-accent) !important;
3347
+ }
3348
+
3349
+ .x-border-color--enable {
3350
+ border-color: var(--x-color-base-enable) !important;
3351
+ }
3352
+
3353
+ .x-border-color--disable {
3354
+ border-color: var(--x-color-base-disable) !important;
3355
+ }
3356
+
3357
+ .x-border-color--transparent {
3358
+ border-color: var(--x-color-base-transparent) !important;
3359
+ }
3317
3360
  .x-background--lead {
3318
3361
  background-color: var(--x-color-base-lead) !important;
3319
3362
  }
@@ -3375,49 +3418,6 @@
3375
3418
  :root {
3376
3419
  --x-color-text-secondary: var(--x-color-base-neutral-35);
3377
3420
  }
3378
- .x-border-color--lead {
3379
- border-color: var(--x-color-base-lead) !important;
3380
- }
3381
-
3382
- .x-border-color--auxiliary {
3383
- border-color: var(--x-color-base-auxiliary) !important;
3384
- }
3385
-
3386
- .x-border-color--neutral-10 {
3387
- border-color: var(--x-color-base-neutral-10) !important;
3388
- }
3389
-
3390
- .x-border-color--neutral-35 {
3391
- border-color: var(--x-color-base-neutral-35) !important;
3392
- }
3393
-
3394
- .x-border-color--neutral-70 {
3395
- border-color: var(--x-color-base-neutral-70) !important;
3396
- }
3397
-
3398
- .x-border-color--neutral-95 {
3399
- border-color: var(--x-color-base-neutral-95) !important;
3400
- }
3401
-
3402
- .x-border-color--neutral-100 {
3403
- border-color: var(--x-color-base-neutral-100) !important;
3404
- }
3405
-
3406
- .x-border-color--accent {
3407
- border-color: var(--x-color-base-accent) !important;
3408
- }
3409
-
3410
- .x-border-color--enable {
3411
- border-color: var(--x-color-base-enable) !important;
3412
- }
3413
-
3414
- .x-border-color--disable {
3415
- border-color: var(--x-color-base-disable) !important;
3416
- }
3417
-
3418
- .x-border-color--transparent {
3419
- border-color: var(--x-color-base-transparent) !important;
3420
- }
3421
3421
  .x-text--secondary {
3422
3422
  --x-color-text-default: var(--x-color-text-secondary);
3423
3423
  }
@@ -4540,6 +4540,14 @@
4540
4540
  --x-size-padding-row-05: var(--x-size-base-05);
4541
4541
  --x-size-padding-row-06: var(--x-size-base-06);
4542
4542
  }
4543
+ /* @deprecated */
4544
+ :root {
4545
+ --x-size-padding-row-02: var(--x-size-base-02);
4546
+ --x-size-padding-row-03: var(--x-size-base-03);
4547
+ --x-size-padding-row-04: var(--x-size-base-04);
4548
+ --x-size-padding-row-05: var(--x-size-base-05);
4549
+ --x-size-padding-row-06: var(--x-size-base-06);
4550
+ }
4543
4551
 
4544
4552
  /* @deprecated */
4545
4553
  .x-row--padding-02 {
@@ -4685,14 +4693,6 @@
4685
4693
  .x-row--gap-20 {
4686
4694
  --x-size-gap-row: var(--x-size-gap-row-20);
4687
4695
  }
4688
- /* @deprecated */
4689
- :root {
4690
- --x-size-padding-row-02: var(--x-size-base-02);
4691
- --x-size-padding-row-03: var(--x-size-base-03);
4692
- --x-size-padding-row-04: var(--x-size-base-04);
4693
- --x-size-padding-row-05: var(--x-size-base-05);
4694
- --x-size-padding-row-06: var(--x-size-base-06);
4695
- }
4696
4696
  :root {
4697
4697
  --x-size-gap-row: 0;
4698
4698
  --x-size-padding-row: 0;
@@ -4979,6 +4979,14 @@
4979
4979
  :root {
4980
4980
  --x-number-aspect-ratio-picture: 1;
4981
4981
  }
4982
+ :root {
4983
+ --x-number-aspect-ratio-picture: 1;
4984
+ }
4985
+
4986
+ .x-picture--fixed-ratio.x-picture {
4987
+ aspect-ratio: var(--x-number-aspect-ratio-picture);
4988
+ width: 100%;
4989
+ }
4982
4990
  :root {
4983
4991
  --x-size-border-radius-picture-default: 0;
4984
4992
  --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
@@ -4998,12 +5006,60 @@
4998
5006
  --x-mix-blend-mode-picture-placeholder-default: var(--x-mix-blend-mode-picture-default);
4999
5007
  }
5000
5008
  :root {
5001
- --x-number-aspect-ratio-picture: 1;
5009
+ --x-size-border-radius-picture-default: 0;
5010
+ --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
5011
+ --x-size-border-radius-right-picture-default: var(--x-size-border-radius-picture-default);
5012
+ --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-picture-default);
5013
+ --x-size-border-radius-left-picture-default: var(--x-size-border-radius-picture-default);
5014
+ --x-color-background-picture-default: transparent;
5015
+ --x-color-fill-picture-placeholder-path-default: var(--x-color-base-neutral-70);
5016
+ --x-color-fill-picture-placeholder-rect-default: var(--x-color-base-neutral-95);
5017
+ --x-color-fill-picture-fallback-path-default: var(--x-color-base-neutral-70);
5018
+ --x-color-fill-picture-fallback-rect-default: var(--x-color-base-neutral-95);
5019
+ --x-object-fit-picture-default: contain;
5020
+ --x-object-fit-picture-fallback-default: var(--x-object-fit-picture-default);
5021
+ --x-object-fit-picture-placeholder-default: var(--x-object-fit-picture-default);
5022
+ --x-mix-blend-mode-picture-default: normal;
5023
+ --x-mix-blend-mode-picture-fallback-default: var(--x-mix-blend-mode-picture-default);
5024
+ --x-mix-blend-mode-picture-placeholder-default: var(--x-mix-blend-mode-picture-default);
5002
5025
  }
5003
5026
 
5004
- .x-picture--fixed-ratio.x-picture {
5005
- aspect-ratio: var(--x-number-aspect-ratio-picture);
5027
+ .x-picture {
5028
+ display: block;
5029
+ overflow: hidden;
5030
+ border-radius: var(--x-size-border-radius-top-picture-default) var(--x-size-border-radius-right-picture-default) var(--x-size-border-radius-bottom-picture-default) var(--x-size-border-radius-left-picture-default);
5031
+ background: var(--x-color-background-picture-default);
5032
+ }
5033
+ .x-picture-image {
5034
+ display: block;
5006
5035
  width: 100%;
5036
+ height: 100%;
5037
+ object-fit: var(--x-object-fit-picture-default);
5038
+ mix-blend-mode: var(--x-mix-blend-mode-picture-default);
5039
+ }
5040
+ .x-picture-image--fallback {
5041
+ --x-object-fit-picture-default: var(--x-object-fit-picture-fallback-default) !important;
5042
+ --x-mix-blend-mode-picture-default: var(
5043
+ --x-mix-blend-mode-picture-fallback-default
5044
+ ) !important;
5045
+ }
5046
+ .x-picture-image--fallback > rect {
5047
+ fill: var(--x-color-fill-picture-fallback-rect-default) !important;
5048
+ }
5049
+ .x-picture-image--fallback > path {
5050
+ fill: var(--x-color-fill-picture-fallback-path-default) !important;
5051
+ }
5052
+ .x-picture-image--placeholder {
5053
+ --x-object-fit-picture-default: var(--x-object-fit-picture-placeholder-default) !important;
5054
+ --x-mix-blend-mode-picture-default: var(
5055
+ --x-mix-blend-mode-picture-placeholder-default
5056
+ ) !important;
5057
+ }
5058
+ .x-picture-image--placeholder > rect {
5059
+ fill: var(--x-color-fill-picture-placeholder-rect-default) !important;
5060
+ }
5061
+ .x-picture-image--placeholder > path {
5062
+ fill: var(--x-color-fill-picture-placeholder-path-default) !important;
5007
5063
  }
5008
5064
  :root {
5009
5065
  --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
@@ -5035,6 +5091,12 @@
5035
5091
  --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5036
5092
  --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5037
5093
  }
5094
+ :root {
5095
+ --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5096
+ --x-mix-blend-mode-picture-colored: multiply;
5097
+ --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5098
+ --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5099
+ }
5038
5100
 
5039
5101
  .x-picture--colored.x-picture {
5040
5102
  --x-color-background-picture-default: var(--x-color-background-picture-colored);
@@ -5048,12 +5110,6 @@
5048
5110
  .x-picture--colored.x-picture .x-picture--placeholder {
5049
5111
  --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-placeholder-colored);
5050
5112
  }
5051
- :root {
5052
- --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5053
- --x-mix-blend-mode-picture-colored: multiply;
5054
- --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5055
- --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5056
- }
5057
5113
  :root {
5058
5114
  --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5059
5115
  --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
@@ -5394,139 +5450,49 @@
5394
5450
  );
5395
5451
  }
5396
5452
  :root {
5397
- --x-size-border-radius-picture-default: 0;
5398
- --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
5399
- --x-size-border-radius-right-picture-default: var(--x-size-border-radius-picture-default);
5400
- --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-picture-default);
5401
- --x-size-border-radius-left-picture-default: var(--x-size-border-radius-picture-default);
5402
- --x-color-background-picture-default: transparent;
5403
- --x-color-fill-picture-placeholder-path-default: var(--x-color-base-neutral-70);
5404
- --x-color-fill-picture-placeholder-rect-default: var(--x-color-base-neutral-95);
5405
- --x-color-fill-picture-fallback-path-default: var(--x-color-base-neutral-70);
5406
- --x-color-fill-picture-fallback-rect-default: var(--x-color-base-neutral-95);
5407
- --x-object-fit-picture-default: contain;
5408
- --x-object-fit-picture-fallback-default: var(--x-object-fit-picture-default);
5409
- --x-object-fit-picture-placeholder-default: var(--x-object-fit-picture-default);
5410
- --x-mix-blend-mode-picture-default: normal;
5411
- --x-mix-blend-mode-picture-fallback-default: var(--x-mix-blend-mode-picture-default);
5412
- --x-mix-blend-mode-picture-placeholder-default: var(--x-mix-blend-mode-picture-default);
5413
- }
5414
-
5415
- .x-picture {
5416
- display: block;
5417
- overflow: hidden;
5418
- border-radius: var(--x-size-border-radius-top-picture-default) var(--x-size-border-radius-right-picture-default) var(--x-size-border-radius-bottom-picture-default) var(--x-size-border-radius-left-picture-default);
5419
- background: var(--x-color-background-picture-default);
5420
- }
5421
- .x-picture-image {
5422
- display: block;
5423
- width: 100%;
5424
- height: 100%;
5425
- object-fit: var(--x-object-fit-picture-default);
5426
- mix-blend-mode: var(--x-mix-blend-mode-picture-default);
5427
- }
5428
- .x-picture-image--fallback {
5429
- --x-object-fit-picture-default: var(--x-object-fit-picture-fallback-default) !important;
5430
- --x-mix-blend-mode-picture-default: var(
5431
- --x-mix-blend-mode-picture-fallback-default
5432
- ) !important;
5433
- }
5434
- .x-picture-image--fallback > rect {
5435
- fill: var(--x-color-fill-picture-fallback-rect-default) !important;
5436
- }
5437
- .x-picture-image--fallback > path {
5438
- fill: var(--x-color-fill-picture-fallback-path-default) !important;
5439
- }
5440
- .x-picture-image--placeholder {
5441
- --x-object-fit-picture-default: var(--x-object-fit-picture-placeholder-default) !important;
5442
- --x-mix-blend-mode-picture-default: var(
5443
- --x-mix-blend-mode-picture-placeholder-default
5444
- ) !important;
5445
- }
5446
- .x-picture-image--placeholder > rect {
5447
- fill: var(--x-color-fill-picture-placeholder-rect-default) !important;
5448
- }
5449
- .x-picture-image--placeholder > path {
5450
- fill: var(--x-color-fill-picture-placeholder-path-default) !important;
5451
- }
5452
- :root {
5453
- --x-modal-overlay-color: rgb(0, 0, 0);
5454
- --x-modal-overlay-opacity: 0.7;
5455
- }
5456
-
5457
- .x-modal__overlay {
5458
- background-color: var(--x-modal-overlay-color) !important;
5459
- opacity: var(--x-modal-overlay-opacity) !important;
5460
- }
5461
- :root {
5462
- --x-modal-overlay-color: rgb(0, 0, 0);
5463
- --x-modal-overlay-opacity: 0.7;
5464
- }
5465
- :root {
5466
- --x-string-justify-message-default: center;
5467
- --x-size-gap-message-default: var(--x-size-base-03);
5468
- --x-size-padding-message-default: var(--x-size-base-06);
5469
- --x-color-background-message-default: var(--x-color-base-neutral-95);
5470
- --x-color-border-message-default: var(--x-color-background-message-default);
5471
- --x-color-text-message-default: var(--x-color-text-default);
5472
- --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
5473
- --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
5474
- --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
5475
- --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
5476
- --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
5477
- --x-size-border-width-message-default: var(--x-size-border-width-base);
5478
- --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
5479
- --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
5480
- --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
5481
- --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
5482
- --x-font-family-message-default: var(--x-font-family-title3);
5483
- --x-size-font-message-default: var(--x-size-font-title3);
5484
- --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5485
- }
5486
- :root {
5487
- --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5488
- --x-color-text-option-list-button-bottom-selected-hover: var(
5489
- --x-color-text-option-list-button-bottom-selected
5490
- );
5491
- --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5492
- --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5493
- --x-color-border-option-list-item-bottom: transparent;
5494
- --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5495
- --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5496
- --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5497
- --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5498
- --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5499
- --x-color-border-top-option-list-item-bottom-selected: var(
5500
- --x-color-border-option-list-item-bottom
5501
- );
5502
- --x-color-border-right-option-list-item-bottom-selected: var(
5503
- --x-color-border-option-list-item-bottom
5504
- );
5505
- --x-color-border-bottom-option-list-item-bottom-selected: var(
5506
- --x-color-border-option-list-item-bottom-selected
5507
- );
5508
- --x-color-border-left-option-list-item-bottom-selected: var(
5509
- --x-color-border-option-list-item-bottom
5510
- );
5511
- --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5512
- --x-size-border-width-top-option-list-item-bottom: 0;
5513
- --x-size-border-width-right-option-list-item-bottom: 0;
5514
- --x-size-border-width-bottom-option-list-item-bottom: var(
5515
- --x-size-border-width-option-list-item-bottom
5516
- );
5517
- --x-size-border-width-left-option-list-item-bottom: 0;
5518
- --x-size-border-width-top-option-list-item-bottom-selected: 0;
5519
- --x-size-border-width-right-option-list-item-bottom-selected: 0;
5520
- --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5521
- --x-size-border-width-option-list-item-bottom
5522
- );
5523
- --x-size-border-width-left-option-list-item-bottom-selected: 0;
5524
- --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5525
- --x-font-decoration-option-list-button-bottom-hover: none;
5526
- --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5527
- --x-number-font-weight-option-list-button-bottom-selected: var(
5528
- --x-number-font-weight-base-regular
5529
- );
5453
+ --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5454
+ --x-color-text-option-list-button-bottom-selected-hover: var(
5455
+ --x-color-text-option-list-button-bottom-selected
5456
+ );
5457
+ --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
5458
+ --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
5459
+ --x-color-border-option-list-item-bottom: transparent;
5460
+ --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5461
+ --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5462
+ --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5463
+ --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
5464
+ --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
5465
+ --x-color-border-top-option-list-item-bottom-selected: var(
5466
+ --x-color-border-option-list-item-bottom
5467
+ );
5468
+ --x-color-border-right-option-list-item-bottom-selected: var(
5469
+ --x-color-border-option-list-item-bottom
5470
+ );
5471
+ --x-color-border-bottom-option-list-item-bottom-selected: var(
5472
+ --x-color-border-option-list-item-bottom-selected
5473
+ );
5474
+ --x-color-border-left-option-list-item-bottom-selected: var(
5475
+ --x-color-border-option-list-item-bottom
5476
+ );
5477
+ --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
5478
+ --x-size-border-width-top-option-list-item-bottom: 0;
5479
+ --x-size-border-width-right-option-list-item-bottom: 0;
5480
+ --x-size-border-width-bottom-option-list-item-bottom: var(
5481
+ --x-size-border-width-option-list-item-bottom
5482
+ );
5483
+ --x-size-border-width-left-option-list-item-bottom: 0;
5484
+ --x-size-border-width-top-option-list-item-bottom-selected: 0;
5485
+ --x-size-border-width-right-option-list-item-bottom-selected: 0;
5486
+ --x-size-border-width-bottom-option-list-item-bottom-selected: var(
5487
+ --x-size-border-width-option-list-item-bottom
5488
+ );
5489
+ --x-size-border-width-left-option-list-item-bottom-selected: 0;
5490
+ --x-size-font-option-list-button-bottom: var(--x-size-font-text);
5491
+ --x-font-decoration-option-list-button-bottom-hover: none;
5492
+ --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
5493
+ --x-number-font-weight-option-list-button-bottom-selected: var(
5494
+ --x-number-font-weight-base-regular
5495
+ );
5530
5496
  }
5531
5497
 
5532
5498
  .x-option-list--bottom.x-option-list,
@@ -5614,6 +5580,40 @@
5614
5580
  --x-size-border-width-bottom-option-list-item-default: inherit;
5615
5581
  --x-size-border-width-left-option-list-item-default: inherit;
5616
5582
  }
5583
+ :root {
5584
+ --x-modal-overlay-color: rgb(0, 0, 0);
5585
+ --x-modal-overlay-opacity: 0.7;
5586
+ }
5587
+ :root {
5588
+ --x-modal-overlay-color: rgb(0, 0, 0);
5589
+ --x-modal-overlay-opacity: 0.7;
5590
+ }
5591
+
5592
+ .x-modal__overlay {
5593
+ background-color: var(--x-modal-overlay-color) !important;
5594
+ opacity: var(--x-modal-overlay-opacity) !important;
5595
+ }
5596
+ :root {
5597
+ --x-string-justify-message-default: center;
5598
+ --x-size-gap-message-default: var(--x-size-base-03);
5599
+ --x-size-padding-message-default: var(--x-size-base-06);
5600
+ --x-color-background-message-default: var(--x-color-base-neutral-95);
5601
+ --x-color-border-message-default: var(--x-color-background-message-default);
5602
+ --x-color-text-message-default: var(--x-color-text-default);
5603
+ --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
5604
+ --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
5605
+ --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
5606
+ --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
5607
+ --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
5608
+ --x-size-border-width-message-default: var(--x-size-border-width-base);
5609
+ --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
5610
+ --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
5611
+ --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
5612
+ --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
5613
+ --x-font-family-message-default: var(--x-font-family-title3);
5614
+ --x-size-font-message-default: var(--x-size-font-title3);
5615
+ --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5616
+ }
5617
5617
  :root {
5618
5618
  --x-string-justify-message-default: center;
5619
5619
  --x-size-gap-message-default: var(--x-size-base-03);
@@ -6063,6 +6063,28 @@
6063
6063
  --x-size-gap-list-19: var(--x-size-base-19);
6064
6064
  --x-size-gap-list-20: var(--x-size-base-20);
6065
6065
  }
6066
+ :root {
6067
+ --x-size-gap-list-01: var(--x-size-base-01);
6068
+ --x-size-gap-list-02: var(--x-size-base-02);
6069
+ --x-size-gap-list-03: var(--x-size-base-03);
6070
+ --x-size-gap-list-04: var(--x-size-base-04);
6071
+ --x-size-gap-list-05: var(--x-size-base-05);
6072
+ --x-size-gap-list-06: var(--x-size-base-06);
6073
+ --x-size-gap-list-07: var(--x-size-base-07);
6074
+ --x-size-gap-list-08: var(--x-size-base-08);
6075
+ --x-size-gap-list-09: var(--x-size-base-09);
6076
+ --x-size-gap-list-10: var(--x-size-base-10);
6077
+ --x-size-gap-list-11: var(--x-size-base-11);
6078
+ --x-size-gap-list-12: var(--x-size-base-12);
6079
+ --x-size-gap-list-13: var(--x-size-base-13);
6080
+ --x-size-gap-list-14: var(--x-size-base-14);
6081
+ --x-size-gap-list-15: var(--x-size-base-15);
6082
+ --x-size-gap-list-16: var(--x-size-base-16);
6083
+ --x-size-gap-list-17: var(--x-size-base-17);
6084
+ --x-size-gap-list-18: var(--x-size-base-18);
6085
+ --x-size-gap-list-19: var(--x-size-base-19);
6086
+ --x-size-gap-list-20: var(--x-size-base-20);
6087
+ }
6066
6088
 
6067
6089
  .x-list--gap-01.x-list {
6068
6090
  gap: var(--x-size-gap-list-01);
@@ -6563,28 +6585,6 @@
6563
6585
  margin-bottom: var(--x-size-gap-list-20);
6564
6586
  }
6565
6587
  }
6566
- :root {
6567
- --x-size-gap-list-01: var(--x-size-base-01);
6568
- --x-size-gap-list-02: var(--x-size-base-02);
6569
- --x-size-gap-list-03: var(--x-size-base-03);
6570
- --x-size-gap-list-04: var(--x-size-base-04);
6571
- --x-size-gap-list-05: var(--x-size-base-05);
6572
- --x-size-gap-list-06: var(--x-size-base-06);
6573
- --x-size-gap-list-07: var(--x-size-base-07);
6574
- --x-size-gap-list-08: var(--x-size-base-08);
6575
- --x-size-gap-list-09: var(--x-size-base-09);
6576
- --x-size-gap-list-10: var(--x-size-base-10);
6577
- --x-size-gap-list-11: var(--x-size-base-11);
6578
- --x-size-gap-list-12: var(--x-size-base-12);
6579
- --x-size-gap-list-13: var(--x-size-base-13);
6580
- --x-size-gap-list-14: var(--x-size-base-14);
6581
- --x-size-gap-list-15: var(--x-size-base-15);
6582
- --x-size-gap-list-16: var(--x-size-base-16);
6583
- --x-size-gap-list-17: var(--x-size-base-17);
6584
- --x-size-gap-list-18: var(--x-size-base-18);
6585
- --x-size-gap-list-19: var(--x-size-base-19);
6586
- --x-size-gap-list-20: var(--x-size-base-20);
6587
- }
6588
6588
  :root {
6589
6589
  --x-string-flow-list: column nowrap;
6590
6590
  --x-size-padding-list: 0;
@@ -6875,58 +6875,6 @@
6875
6875
  );
6876
6876
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6877
6877
  }
6878
- :root {
6879
- --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6880
- --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
6881
- --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
6882
- --x-size-border-radius-bottom-right-input-group-card: var(
6883
- --x-size-border-radius-input-group-card
6884
- );
6885
- --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6886
- }
6887
- :root {
6888
- --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6889
- --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
6890
- --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
6891
- --x-size-border-radius-bottom-right-input-group-card: var(
6892
- --x-size-border-radius-input-group-card
6893
- );
6894
- --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6895
- }
6896
-
6897
- .x-input-group--card.x-input-group,
6898
- .x-input-group--card .x-input-group {
6899
- --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-card);
6900
- --x-size-border-radius-top-left-input-group-default: var(
6901
- --x-size-border-radius-top-left-input-group-card
6902
- );
6903
- --x-size-border-radius-top-right-input-group-default: var(
6904
- --x-size-border-radius-top-right-input-group-card
6905
- );
6906
- --x-size-border-radius-bottom-right-input-group-default: var(
6907
- --x-size-border-radius-bottom-right-input-group-card
6908
- );
6909
- --x-size-border-radius-bottom-left-input-group-default: var(
6910
- --x-size-border-radius-bottom-left-input-group-card
6911
- );
6912
- }
6913
- .x-input-group--card.x-input-group__action:first-child,
6914
- .x-input-group--card .x-input-group__action:first-child {
6915
- --x-size-border-radius-top-right-input-group-default: 0;
6916
- --x-size-border-radius-bottom-right-input-group-default: 0;
6917
- }
6918
- .x-input-group--card.x-input-group__action:last-child,
6919
- .x-input-group--card .x-input-group__action:last-child {
6920
- --x-size-border-radius-top-left-input-group-default: 0;
6921
- --x-size-border-radius-bottom-left-input-group-default: 0;
6922
- }
6923
- :root {
6924
- --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
6925
- --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
6926
- --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
6927
- --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
6928
- --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
6929
- }
6930
6878
  :root {
6931
6879
  --x-color-background-input-group-default: var(--x-color-background-input-default);
6932
6880
  --x-color-border-input-group-default: var(--x-color-border-input-default);
@@ -7104,6 +7052,58 @@
7104
7052
  [dir="rtl"] .x-input-group > .x-input-group__action:last-child {
7105
7053
  margin-left: calc(var(--x-size-border-width-right-input-group-default) * -1);
7106
7054
  }
7055
+ :root {
7056
+ --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
7057
+ --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
7058
+ --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
7059
+ --x-size-border-radius-bottom-right-input-group-card: var(
7060
+ --x-size-border-radius-input-group-card
7061
+ );
7062
+ --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
7063
+ }
7064
+ :root {
7065
+ --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
7066
+ --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
7067
+ --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
7068
+ --x-size-border-radius-bottom-right-input-group-card: var(
7069
+ --x-size-border-radius-input-group-card
7070
+ );
7071
+ --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
7072
+ }
7073
+
7074
+ .x-input-group--card.x-input-group,
7075
+ .x-input-group--card .x-input-group {
7076
+ --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-card);
7077
+ --x-size-border-radius-top-left-input-group-default: var(
7078
+ --x-size-border-radius-top-left-input-group-card
7079
+ );
7080
+ --x-size-border-radius-top-right-input-group-default: var(
7081
+ --x-size-border-radius-top-right-input-group-card
7082
+ );
7083
+ --x-size-border-radius-bottom-right-input-group-default: var(
7084
+ --x-size-border-radius-bottom-right-input-group-card
7085
+ );
7086
+ --x-size-border-radius-bottom-left-input-group-default: var(
7087
+ --x-size-border-radius-bottom-left-input-group-card
7088
+ );
7089
+ }
7090
+ .x-input-group--card.x-input-group__action:first-child,
7091
+ .x-input-group--card .x-input-group__action:first-child {
7092
+ --x-size-border-radius-top-right-input-group-default: 0;
7093
+ --x-size-border-radius-bottom-right-input-group-default: 0;
7094
+ }
7095
+ .x-input-group--card.x-input-group__action:last-child,
7096
+ .x-input-group--card .x-input-group__action:last-child {
7097
+ --x-size-border-radius-top-left-input-group-default: 0;
7098
+ --x-size-border-radius-bottom-left-input-group-default: 0;
7099
+ }
7100
+ :root {
7101
+ --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7102
+ --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7103
+ --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7104
+ --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7105
+ --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7106
+ }
7107
7107
  :root {
7108
7108
  --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7109
7109
  --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
@@ -7180,13 +7180,6 @@
7180
7180
  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7181
7181
  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7182
7182
  }
7183
- :root {
7184
- --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7185
- --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7186
- --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7187
- --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7188
- --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7189
- }
7190
7183
  :root {
7191
7184
  --x-color-background-input-default: var(--x-color-base-neutral-100);
7192
7185
  --x-color-border-input-default: var(--x-color-base-neutral-70);
@@ -7295,6 +7288,33 @@
7295
7288
  font-weight: var(--x-number-font-weight-input-placeholder-default);
7296
7289
  line-height: var(--x-size-line-height-input-placeholder-default);
7297
7290
  }
7291
+ :root {
7292
+ --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7293
+ --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7294
+ --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7295
+ --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7296
+ --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7297
+ }
7298
+ :root {
7299
+ --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7300
+ --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7301
+ --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7302
+ --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7303
+ --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7304
+ }
7305
+
7306
+ .x-input--card.x-input,
7307
+ .x-input--card .x-input {
7308
+ --x-size-border-radius-input-default: var(--x-size-border-radius-input-card);
7309
+ --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-top-left-input-card);
7310
+ --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-top-right-input-card);
7311
+ --x-size-border-radius-bottom-right-input-default: var(
7312
+ --x-size-border-radius-bottom-right-input-card
7313
+ );
7314
+ --x-size-border-radius-bottom-left-input-default: var(
7315
+ --x-size-border-radius-bottom-left-input-card
7316
+ );
7317
+ }
7298
7318
  :root {
7299
7319
  --x-size-width-icon-xl: var(--x-size-base-07);
7300
7320
  --x-size-height-icon-xl: var(--x-size-base-07);
@@ -7356,11 +7376,6 @@
7356
7376
  --x-string-stroke-linejoin-icon-default: mitter;
7357
7377
  --x-size-stroke-width-icon-default: 1px;
7358
7378
  }
7359
- :root {
7360
- --x-size-padding-grid: 0;
7361
- --x-size-gap-grid: var(--x-size-base-03);
7362
- --x-size-min-width-grid-item: 150px;
7363
- }
7364
7379
  :root {
7365
7380
  --x-color-stroke-icon-default: currentColor;
7366
7381
  --x-color-fill-icon-default: none;
@@ -7396,6 +7411,11 @@
7396
7411
  --x-size-gap-grid: var(--x-size-base-03);
7397
7412
  --x-size-min-width-grid-item: 150px;
7398
7413
  }
7414
+ :root {
7415
+ --x-size-padding-grid: 0;
7416
+ --x-size-gap-grid: var(--x-size-base-03);
7417
+ --x-size-min-width-grid-item: 150px;
7418
+ }
7399
7419
 
7400
7420
  .x-grid-list {
7401
7421
  margin: 0;
@@ -7424,24 +7444,11 @@
7424
7444
  margin-left: auto;
7425
7445
  }
7426
7446
  :root {
7427
- --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7428
- --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7429
- --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7430
- --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7431
- --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7432
- }
7433
-
7434
- .x-input--card.x-input,
7435
- .x-input--card .x-input {
7436
- --x-size-border-radius-input-default: var(--x-size-border-radius-input-card);
7437
- --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-top-left-input-card);
7438
- --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-top-right-input-card);
7439
- --x-size-border-radius-bottom-right-input-default: var(
7440
- --x-size-border-radius-bottom-right-input-card
7441
- );
7442
- --x-size-border-radius-bottom-left-input-default: var(
7443
- --x-size-border-radius-bottom-left-input-card
7444
- );
7447
+ --x-size-margin-filter-children: 0;
7448
+ --x-size-padding-top-filter-children: 0;
7449
+ --x-size-padding-right-filter-children: 0;
7450
+ --x-size-padding-bottom-filter-children: 0;
7451
+ --x-size-padding-left-filter-children: var(--x-size-base-05);
7445
7452
  }
7446
7453
  :root {
7447
7454
  --x-size-margin-filter-children: 0;
@@ -7450,6 +7457,32 @@
7450
7457
  --x-size-padding-bottom-filter-children: 0;
7451
7458
  --x-size-padding-left-filter-children: var(--x-size-base-05);
7452
7459
  }
7460
+
7461
+ .x-hierarchical-filter-container {
7462
+ list-style: none;
7463
+ }
7464
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7465
+ padding-left: var(--x-size-padding-left-filter-children);
7466
+ }
7467
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7468
+ padding-right: var(--x-size-padding-left-filter-children);
7469
+ }
7470
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7471
+ padding-right: var(--x-size-padding-right-filter-children);
7472
+ }
7473
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7474
+ padding-left: var(--x-size-padding-right-filter-children);
7475
+ }
7476
+ .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7477
+ margin: var(--x-size-margin-filter-children);
7478
+ padding-top: var(--x-size-padding-top-filter-children);
7479
+ padding-bottom: var(--x-size-padding-bottom-filter-children);
7480
+ }
7481
+ .x-hierarchical-filter-container .x-hierarchical-filter-container,
7482
+ .x-hierarchical-filter-container .x-filter,
7483
+ .x-hierarchical-filter-container .x-facet-filter {
7484
+ width: 100%;
7485
+ }
7453
7486
  :root {
7454
7487
  --x-color-background-filter-default: transparent;
7455
7488
  --x-color-border-filter-default: var(--x-color-background-filter-default);
@@ -7661,37 +7694,28 @@
7661
7694
  --x-size-border-width-left-facet-header-line: 0;
7662
7695
  }
7663
7696
  :root {
7664
- --x-size-margin-filter-children: 0;
7665
- --x-size-padding-top-filter-children: 0;
7666
- --x-size-padding-right-filter-children: 0;
7667
- --x-size-padding-bottom-filter-children: 0;
7668
- --x-size-padding-left-filter-children: var(--x-size-base-05);
7697
+ --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7698
+ --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7699
+ --x-size-border-width-top-facet-header-line: 0;
7700
+ --x-size-border-width-right-facet-header-line: 0;
7701
+ --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7702
+ --x-size-border-width-left-facet-header-line: 0;
7669
7703
  }
7670
7704
 
7671
- .x-hierarchical-filter-container {
7672
- list-style: none;
7673
- }
7674
- [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7675
- padding-left: var(--x-size-padding-left-filter-children);
7676
- }
7677
- [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7678
- padding-right: var(--x-size-padding-left-filter-children);
7679
- }
7680
- [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7681
- padding-right: var(--x-size-padding-right-filter-children);
7682
- }
7683
- [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7684
- padding-left: var(--x-size-padding-right-filter-children);
7685
- }
7686
- .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7687
- margin: var(--x-size-margin-filter-children);
7688
- padding-top: var(--x-size-padding-top-filter-children);
7689
- padding-bottom: var(--x-size-padding-bottom-filter-children);
7690
- }
7691
- .x-hierarchical-filter-container .x-hierarchical-filter-container,
7692
- .x-hierarchical-filter-container .x-filter,
7693
- .x-hierarchical-filter-container .x-facet-filter {
7694
- width: 100%;
7705
+ .x-facet--line.x-facet,
7706
+ .x-facet--line .x-facet {
7707
+ --x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
7708
+ --x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
7709
+ --x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
7710
+ --x-size-border-width-right-facet-header-default: var(
7711
+ --x-size-border-width-right-facet-header-line
7712
+ );
7713
+ --x-size-border-width-bottom-facet-header-default: var(
7714
+ --x-size-border-width-bottom-facet-header-line
7715
+ );
7716
+ --x-size-border-width-left-facet-header-default: var(
7717
+ --x-size-border-width-left-facet-header-line
7718
+ );
7695
7719
  }
7696
7720
  :root {
7697
7721
  --x-color-background-facet-default: transparent;
@@ -7726,30 +7750,6 @@
7726
7750
  --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
7727
7751
  --x-size-line-height-facet-default: var(--x-size-line-height-title3);
7728
7752
  }
7729
- :root {
7730
- --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7731
- --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7732
- --x-size-border-width-top-facet-header-line: 0;
7733
- --x-size-border-width-right-facet-header-line: 0;
7734
- --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7735
- --x-size-border-width-left-facet-header-line: 0;
7736
- }
7737
-
7738
- .x-facet--line.x-facet,
7739
- .x-facet--line .x-facet {
7740
- --x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
7741
- --x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
7742
- --x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
7743
- --x-size-border-width-right-facet-header-default: var(
7744
- --x-size-border-width-right-facet-header-line
7745
- );
7746
- --x-size-border-width-bottom-facet-header-default: var(
7747
- --x-size-border-width-bottom-facet-header-line
7748
- );
7749
- --x-size-border-width-left-facet-header-default: var(
7750
- --x-size-border-width-left-facet-header-line
7751
- );
7752
- }
7753
7753
  :root {
7754
7754
  --x-color-background-facet-default: transparent;
7755
7755
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7928,13 +7928,13 @@
7928
7928
  :root {
7929
7929
  --x-size-width-dropdown-s: 74px;
7930
7930
  }
7931
+ :root {
7932
+ --x-size-width-dropdown-s: 74px;
7933
+ }
7931
7934
 
7932
7935
  .x-dropdown.x-dropdown--s {
7933
7936
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-s);
7934
7937
  }
7935
- :root {
7936
- --x-size-width-dropdown-s: 74px;
7937
- }
7938
7938
  :root {
7939
7939
  --x-size-gap-dropdown-pill: var(--x-size-base-03);
7940
7940
  --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
@@ -8168,19 +8168,6 @@
8168
8168
  --x-string-overflow-dropdown-toggle-default: hidden;
8169
8169
  --x-string-overflow-dropdown-list-default: hidden;
8170
8170
  }
8171
- :root {
8172
- --x-size-gap-dropdown-card: var(--x-size-base-03);
8173
- --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8174
- --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8175
- --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8176
- --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8177
- --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8178
- --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8179
- --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8180
- --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8181
- --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8182
- --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8183
- }
8184
8171
  :root {
8185
8172
  --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
8186
8173
  --x-size-border-radius-top-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
@@ -8424,14 +8411,17 @@
8424
8411
  left: 0;
8425
8412
  }
8426
8413
  :root {
8427
- --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8428
- --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
8429
- --x-color-text-button-tertiary: var(--x-color-text-default);
8430
- --x-size-border-width-button-tertiary: var(--x-size-border-width-base);
8431
- --x-size-border-width-top-button-tertiary: var(--x-size-border-width-button-tertiary);
8432
- --x-size-border-width-right-button-tertiary: var(--x-size-border-width-button-tertiary);
8433
- --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
8434
- --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
8414
+ --x-size-gap-dropdown-card: var(--x-size-base-03);
8415
+ --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8416
+ --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8417
+ --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8418
+ --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8419
+ --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8420
+ --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8421
+ --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8422
+ --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8423
+ --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8424
+ --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8435
8425
  }
8436
8426
  :root {
8437
8427
  --x-size-gap-dropdown-card: var(--x-size-base-03);
@@ -8486,6 +8476,16 @@
8486
8476
  --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
8487
8477
  --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
8488
8478
  }
8479
+ :root {
8480
+ --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8481
+ --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
8482
+ --x-color-text-button-tertiary: var(--x-color-text-default);
8483
+ --x-size-border-width-button-tertiary: var(--x-size-border-width-base);
8484
+ --x-size-border-width-top-button-tertiary: var(--x-size-border-width-button-tertiary);
8485
+ --x-size-border-width-right-button-tertiary: var(--x-size-border-width-button-tertiary);
8486
+ --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
8487
+ --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
8488
+ }
8489
8489
 
8490
8490
  .x-button--tertiary.x-button,
8491
8491
  .x-button--tertiary .x-button {
package/js/components/base-teleport.vue.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"base-teleport.vue.js","sources":["../../../src/components/base-teleport.vue"],"sourcesContent":["<template>\n <Teleport v-if=\"teleportHost\" :to=\"teleportHost.shadowRoot ?? teleportHost\" :disabled>\n <slot></slot>\n </Teleport>\n</template>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport {\n defineComponent,\n getCurrentInstance,\n onBeforeUnmount,\n onMounted,\n onUnmounted,\n ref,\n watch,\n watchEffect,\n} from 'vue'\n\nexport default defineComponent({\n name: 'BaseTeleport',\n props: {\n /** The element or css selector to which the component will be teleported. */\n target: {\n type: [String, Object] as PropType<string | Element>,\n required: true,\n },\n /**\n * The position relative to the target\n * - `beforebegin`: Before the target element.\n * - `afterbegin`: Inside the target element, before its first child.\n * - `beforeend`: Inside the target element, after its last child.\n * - `afterend`: After the target element.\n * - `onlychild`: Adds it as child and hides all other children of the target element.\n */\n position: {\n type: String as PropType<\n 'beforebegin' | 'afterbegin' | 'beforeend' | 'afterend' | 'onlychild'\n >,\n default: 'onlychild',\n },\n /** If disabled, the slot content will not be teleported */\n disabled: {\n type: Boolean,\n default: false,\n },\n },\n setup(props) {\n const instance = getCurrentInstance()\n /** Hook where the slot content will be teleported to. */\n const teleportHost = ref<Element>()\n /** The page element where the teleport host will be inserted. */\n const targetElement = ref<Element>()\n let isIsolated = false\n\n // Before doing app.mount it is unknown if it will be mounted in a shadow so we need to wait.\n if (instance?.appContext.app._container) {\n createHost()\n } else {\n afterAppMount(createHost)\n }\n\n const targetAddedObserver = new MutationObserver(targetAdded)\n const targetRemovedObserver = new MutationObserver(targetRemoved)\n\n onUnmounted(() => {\n if (isIsolated && teleportHost.value) {\n ;(window as any).xCSSInjector.removeHost(teleportHost.value.shadowRoot)\n }\n })\n\n onBeforeUnmount(() => {\n targetAddedObserver.disconnect()\n targetRemovedObserver.disconnect()\n teleportHost.value?.remove()\n })\n\n // Handles target prop changes and init the observers accordingly.\n watch(\n () => props.target,\n newTarget => {\n targetAddedObserver.disconnect()\n targetRemovedObserver.disconnect()\n const target = typeof newTarget === 'string' ? document.querySelector(newTarget) : newTarget\n if (target?.isConnected) {\n targetAdded()\n } else {\n targetRemoved()\n }\n },\n { immediate: true },\n )\n\n // Updates the teleport host when props change.\n watchEffect(() => {\n if (!teleportHost.value) {\n return\n }\n if (props.disabled) {\n teleportHost.value.remove()\n return\n }\n teleportHost.value.className = `x-base-teleport x-base-teleport--${props.position}`\n\n if (!targetElement.value) {\n console.warn(`BaseTeleport: Target element \"${props.target}\" not found.`)\n return\n }\n const position = props.position === 'onlychild' ? 'beforeend' : props.position\n targetElement.value.insertAdjacentElement(position, teleportHost.value)\n })\n\n /** Checks if the target element exists in the DOM and updates the observers */\n function targetAdded() {\n const target =\n typeof props.target === 'string' ? document.querySelector(props.target) : props.target\n if (target?.isConnected) {\n targetAddedObserver.disconnect()\n targetRemovedObserver.observe(target.parentElement!, { childList: true })\n targetElement.value = target\n }\n }\n\n /** Checks if the target was disconnected from the DOM and updates the observers */\n function targetRemoved() {\n if (!targetElement.value?.isConnected) {\n targetRemovedObserver.disconnect()\n targetAddedObserver.observe(document.body, { childList: true, subtree: true })\n targetElement.value = undefined\n }\n }\n\n /** Creates and sets the teleport host element */\n function createHost() {\n teleportHost.value = document.createElement('div')\n isIsolated = instance?.appContext.app._container instanceof ShadowRoot\n if (isIsolated) {\n teleportHost.value.attachShadow({ mode: 'open' })\n ;(window as any).xCSSInjector.addHost(teleportHost.value.shadowRoot)\n }\n }\n\n function afterAppMount(fn: () => void) {\n onMounted(() => setTimeout(fn, 0))\n }\n\n return { teleportHost }\n },\n})\n\n/** Teleport host styles should be injected outside our shadowRoots */\ndocument.addEventListener('DOMContentLoaded', () => {\n const styleTag = document.createElement('style')\n styleTag.textContent = `\n :has(> .x-base-teleport--onlychild) > *:not(.x-base-teleport) {\n display: none;\n }\n `\n document.head.appendChild(styleTag)\n})\n</script>\n"],"names":["_openBlock","_Teleport","teleportHost","_renderSlot","_createCommentVNode"],"mappings":";;;;qBACE,IAEW,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA;AAHb,EAAA,OAAA,IAAA,CAAA,YAAA,IAAAA,SAAA,gBACkDC,QAAcC,EAAAA;AAAAA,IAAe,GAAA,EAAA,CAAA;AAAA,IAAA,EAAA,EAAA,IAAA,CAAA,YAAA,CAAA,UAAA,IAAA,IAAA,CAAA,YAAA;IAC3E,QAAa,EAAA,IAAA,CAAA,QAAA;AAAA,GAAA,EAAA;AAFjB,IAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,CAAA;AAAA,GAAA,EAAA,CAAA,EAAA,CAAA,IAAA,EAAA,UAAA,CAAA,CAAA,IAAAC,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}
1
+ {"version":3,"file":"base-teleport.vue.js","sources":["../../../src/components/base-teleport.vue"],"sourcesContent":["<template>\n <Teleport v-if=\"teleportHost\" :to=\"teleportHost.shadowRoot ?? teleportHost\" :disabled>\n <slot></slot>\n </Teleport>\n</template>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport {\n defineComponent,\n getCurrentInstance,\n onBeforeUnmount,\n onMounted,\n onUnmounted,\n ref,\n watch,\n watchEffect,\n} from 'vue'\n\nexport default defineComponent({\n name: 'BaseTeleport',\n props: {\n /** The element or css selector to which the component will be teleported. */\n target: {\n type: [String, Object] as PropType<string | Element>,\n required: true,\n },\n /**\n * The position relative to the target\n * - `beforebegin`: Before the target element.\n * - `afterbegin`: Inside the target element, before its first child.\n * - `beforeend`: Inside the target element, after its last child.\n * - `afterend`: After the target element.\n * - `onlychild`: Adds it as child and hides all other children of the target element.\n */\n position: {\n type: String as PropType<\n 'beforebegin' | 'afterbegin' | 'beforeend' | 'afterend' | 'onlychild'\n >,\n default: 'onlychild',\n },\n /** If disabled, the slot content will not be teleported */\n disabled: {\n type: Boolean,\n default: false,\n },\n },\n setup(props) {\n const instance = getCurrentInstance()\n /** Hook where the slot content will be teleported to. */\n const teleportHost = ref<Element>()\n /** The page element where the teleport host will be inserted. */\n const targetElement = ref<Element>()\n let isIsolated = false\n\n // Before doing app.mount it is unknown if it will be mounted in a shadow so we need to wait.\n if (instance?.appContext.app._container) {\n createHost()\n } else {\n afterAppMount(createHost)\n }\n\n const targetAddedObserver = new MutationObserver(targetAdded)\n const targetRemovedObserver = new MutationObserver(targetRemoved)\n\n onUnmounted(() => {\n if (isIsolated && teleportHost.value) {\n ;(window as any).xCSSInjector.removeHost(teleportHost.value.shadowRoot)\n }\n })\n\n onBeforeUnmount(() => {\n targetAddedObserver.disconnect()\n targetRemovedObserver.disconnect()\n teleportHost.value?.remove()\n })\n\n // Handles target prop changes and init the observers accordingly.\n watch(\n () => props.target,\n newTarget => {\n targetAddedObserver.disconnect()\n targetRemovedObserver.disconnect()\n const target = typeof newTarget === 'string' ? document.querySelector(newTarget) : newTarget\n if (target?.isConnected) {\n targetAdded()\n } else {\n targetRemoved()\n }\n },\n { immediate: true },\n )\n\n // Updates the teleport host when props change.\n watchEffect(() => {\n if (!teleportHost.value) {\n return\n }\n if (props.disabled) {\n teleportHost.value.remove()\n return\n }\n teleportHost.value.className = `x-base-teleport x-base-teleport--${props.position}`\n\n if (!targetElement.value) {\n console.warn(`BaseTeleport: Target element \"${props.target}\" not found.`)\n return\n }\n const position = props.position === 'onlychild' ? 'beforeend' : props.position\n targetElement.value.insertAdjacentElement(position, teleportHost.value)\n })\n\n /** Checks if the target element exists in the DOM and updates the observers */\n function targetAdded() {\n let element =\n typeof props.target === 'string' ? document.querySelector(props.target) : props.target\n if (element?.isConnected) {\n targetAddedObserver.disconnect()\n targetElement.value = element\n while (element.parentElement) {\n element = element.parentElement\n targetRemovedObserver.observe(element, { childList: true })\n }\n }\n }\n\n /** Checks if the target was disconnected from the DOM and updates the observers */\n function targetRemoved() {\n if (targetElement.value && !targetElement.value.isConnected) {\n targetRemovedObserver.disconnect()\n targetAddedObserver.observe(document.body, { childList: true, subtree: true })\n targetElement.value = undefined\n }\n }\n\n /** Creates and sets the teleport host element */\n function createHost() {\n teleportHost.value = document.createElement('div')\n isIsolated = instance?.appContext.app._container instanceof ShadowRoot\n if (isIsolated) {\n teleportHost.value.attachShadow({ mode: 'open' })\n ;(window as any).xCSSInjector.addHost(teleportHost.value.shadowRoot)\n }\n }\n\n function afterAppMount(fn: () => void) {\n onMounted(() => setTimeout(fn, 0))\n }\n\n return { teleportHost }\n },\n})\n\n/** Teleport host styles should be injected outside our shadowRoots */\nconst css = document.createElement('style')\ncss.textContent = ':has(> .x-base-teleport--onlychild) > *:not(.x-base-teleport) { display: none; }'\ndocument.head?.appendChild(css) ||\n document.addEventListener('DOMContentLoaded', () => document.head.appendChild(css))\n</script>\n"],"names":["_openBlock","_Teleport","teleportHost","_renderSlot","_createCommentVNode"],"mappings":";;;;qBACE,IAEW,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA;AAHb,EAAA,OAAA,IAAA,CAAA,YAAA,IAAAA,SAAA,gBACkDC,QAAcC,EAAAA;AAAAA,IAAe,GAAA,EAAA,CAAA;AAAA,IAAA,EAAA,EAAA,IAAA,CAAA,YAAA,CAAA,UAAA,IAAA,IAAA,CAAA,YAAA;IAC3E,QAAa,EAAA,IAAA,CAAA,QAAA;AAAA,GAAA,EAAA;AAFjB,IAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,CAAA;AAAA,GAAA,EAAA,CAAA,EAAA,CAAA,IAAA,EAAA,UAAA,CAAA,CAAA,IAAAC,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}
package/js/components/base-teleport.vue2.js CHANGED
@@ -83,16 +83,19 @@ var _sfc_main = defineComponent({
83
83
  });
84
84
  /** Checks if the target element exists in the DOM and updates the observers */
85
85
  function targetAdded() {
86
- const target = typeof props.target === 'string' ? document.querySelector(props.target) : props.target;
87
- if (target?.isConnected) {
86
+ let element = typeof props.target === 'string' ? document.querySelector(props.target) : props.target;
87
+ if (element?.isConnected) {
88
88
  targetAddedObserver.disconnect();
89
- targetRemovedObserver.observe(target.parentElement, { childList: true });
90
- targetElement.value = target;
89
+ targetElement.value = element;
90
+ while (element.parentElement) {
91
+ element = element.parentElement;
92
+ targetRemovedObserver.observe(element, { childList: true });
93
+ }
91
94
  }
92
95
  }
93
96
  /** Checks if the target was disconnected from the DOM and updates the observers */
94
97
  function targetRemoved() {
95
- if (!targetElement.value?.isConnected) {
98
+ if (targetElement.value && !targetElement.value.isConnected) {
96
99
  targetRemovedObserver.disconnect();
97
100
  targetAddedObserver.observe(document.body, { childList: true, subtree: true });
98
101
  targetElement.value = undefined;
@@ -114,15 +117,10 @@ var _sfc_main = defineComponent({
114
117
  },
115
118
  });
116
119
  /** Teleport host styles should be injected outside our shadowRoots */
117
- document.addEventListener('DOMContentLoaded', () => {
118
- const styleTag = document.createElement('style');
119
- styleTag.textContent = `
120
- :has(> .x-base-teleport--onlychild) > *:not(.x-base-teleport) {
121
- display: none;
122
- }
123
- `;
124
- document.head.appendChild(styleTag);
125
- });
120
+ const css = document.createElement('style');
121
+ css.textContent = ':has(> .x-base-teleport--onlychild) > *:not(.x-base-teleport) { display: none; }';
122
+ document.head?.appendChild(css) ||
123
+ document.addEventListener('DOMContentLoaded', () => document.head.appendChild(css));
126
124
 
127
125
  export { _sfc_main as default };
128
126
  //# sourceMappingURL=base-teleport.vue2.js.map
package/js/components/base-teleport.vue2.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"base-teleport.vue2.js","sources":["../../../src/components/base-teleport.vue"],"sourcesContent":["<template>\n <Teleport v-if=\"teleportHost\" :to=\"teleportHost.shadowRoot ?? teleportHost\" :disabled>\n <slot></slot>\n </Teleport>\n</template>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport {\n defineComponent,\n getCurrentInstance,\n onBeforeUnmount,\n onMounted,\n onUnmounted,\n ref,\n watch,\n watchEffect,\n} from 'vue'\n\nexport default defineComponent({\n name: 'BaseTeleport',\n props: {\n /** The element or css selector to which the component will be teleported. */\n target: {\n type: [String, Object] as PropType<string | Element>,\n required: true,\n },\n /**\n * The position relative to the target\n * - `beforebegin`: Before the target element.\n * - `afterbegin`: Inside the target element, before its first child.\n * - `beforeend`: Inside the target element, after its last child.\n * - `afterend`: After the target element.\n * - `onlychild`: Adds it as child and hides all other children of the target element.\n */\n position: {\n type: String as PropType<\n 'beforebegin' | 'afterbegin' | 'beforeend' | 'afterend' | 'onlychild'\n >,\n default: 'onlychild',\n },\n /** If disabled, the slot content will not be teleported */\n disabled: {\n type: Boolean,\n default: false,\n },\n },\n setup(props) {\n const instance = getCurrentInstance()\n /** Hook where the slot content will be teleported to. */\n const teleportHost = ref<Element>()\n /** The page element where the teleport host will be inserted. */\n const targetElement = ref<Element>()\n let isIsolated = false\n\n // Before doing app.mount it is unknown if it will be mounted in a shadow so we need to wait.\n if (instance?.appContext.app._container) {\n createHost()\n } else {\n afterAppMount(createHost)\n }\n\n const targetAddedObserver = new MutationObserver(targetAdded)\n const targetRemovedObserver = new MutationObserver(targetRemoved)\n\n onUnmounted(() => {\n if (isIsolated && teleportHost.value) {\n ;(window as any).xCSSInjector.removeHost(teleportHost.value.shadowRoot)\n }\n })\n\n onBeforeUnmount(() => {\n targetAddedObserver.disconnect()\n targetRemovedObserver.disconnect()\n teleportHost.value?.remove()\n })\n\n // Handles target prop changes and init the observers accordingly.\n watch(\n () => props.target,\n newTarget => {\n targetAddedObserver.disconnect()\n targetRemovedObserver.disconnect()\n const target = typeof newTarget === 'string' ? document.querySelector(newTarget) : newTarget\n if (target?.isConnected) {\n targetAdded()\n } else {\n targetRemoved()\n }\n },\n { immediate: true },\n )\n\n // Updates the teleport host when props change.\n watchEffect(() => {\n if (!teleportHost.value) {\n return\n }\n if (props.disabled) {\n teleportHost.value.remove()\n return\n }\n teleportHost.value.className = `x-base-teleport x-base-teleport--${props.position}`\n\n if (!targetElement.value) {\n console.warn(`BaseTeleport: Target element \"${props.target}\" not found.`)\n return\n }\n const position = props.position === 'onlychild' ? 'beforeend' : props.position\n targetElement.value.insertAdjacentElement(position, teleportHost.value)\n })\n\n /** Checks if the target element exists in the DOM and updates the observers */\n function targetAdded() {\n const target =\n typeof props.target === 'string' ? document.querySelector(props.target) : props.target\n if (target?.isConnected) {\n targetAddedObserver.disconnect()\n targetRemovedObserver.observe(target.parentElement!, { childList: true })\n targetElement.value = target\n }\n }\n\n /** Checks if the target was disconnected from the DOM and updates the observers */\n function targetRemoved() {\n if (!targetElement.value?.isConnected) {\n targetRemovedObserver.disconnect()\n targetAddedObserver.observe(document.body, { childList: true, subtree: true })\n targetElement.value = undefined\n }\n }\n\n /** Creates and sets the teleport host element */\n function createHost() {\n teleportHost.value = document.createElement('div')\n isIsolated = instance?.appContext.app._container instanceof ShadowRoot\n if (isIsolated) {\n teleportHost.value.attachShadow({ mode: 'open' })\n ;(window as any).xCSSInjector.addHost(teleportHost.value.shadowRoot)\n }\n }\n\n function afterAppMount(fn: () => void) {\n onMounted(() => setTimeout(fn, 0))\n }\n\n return { teleportHost }\n },\n})\n\n/** Teleport host styles should be injected outside our shadowRoots */\ndocument.addEventListener('DOMContentLoaded', () => {\n const styleTag = document.createElement('style')\n styleTag.textContent = `\n :has(> .x-base-teleport--onlychild) > *:not(.x-base-teleport) {\n display: none;\n }\n `\n document.head.appendChild(styleTag)\n})\n</script>\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"base-teleport.vue2.js","sources":["../../../src/components/base-teleport.vue"],"sourcesContent":["<template>\n <Teleport v-if=\"teleportHost\" :to=\"teleportHost.shadowRoot ?? teleportHost\" :disabled>\n <slot></slot>\n </Teleport>\n</template>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport {\n defineComponent,\n getCurrentInstance,\n onBeforeUnmount,\n onMounted,\n onUnmounted,\n ref,\n watch,\n watchEffect,\n} from 'vue'\n\nexport default defineComponent({\n name: 'BaseTeleport',\n props: {\n /** The element or css selector to which the component will be teleported. */\n target: {\n type: [String, Object] as PropType<string | Element>,\n required: true,\n },\n /**\n * The position relative to the target\n * - `beforebegin`: Before the target element.\n * - `afterbegin`: Inside the target element, before its first child.\n * - `beforeend`: Inside the target element, after its last child.\n * - `afterend`: After the target element.\n * - `onlychild`: Adds it as child and hides all other children of the target element.\n */\n position: {\n type: String as PropType<\n 'beforebegin' | 'afterbegin' | 'beforeend' | 'afterend' | 'onlychild'\n >,\n default: 'onlychild',\n },\n /** If disabled, the slot content will not be teleported */\n disabled: {\n type: Boolean,\n default: false,\n },\n },\n setup(props) {\n const instance = getCurrentInstance()\n /** Hook where the slot content will be teleported to. */\n const teleportHost = ref<Element>()\n /** The page element where the teleport host will be inserted. */\n const targetElement = ref<Element>()\n let isIsolated = false\n\n // Before doing app.mount it is unknown if it will be mounted in a shadow so we need to wait.\n if (instance?.appContext.app._container) {\n createHost()\n } else {\n afterAppMount(createHost)\n }\n\n const targetAddedObserver = new MutationObserver(targetAdded)\n const targetRemovedObserver = new MutationObserver(targetRemoved)\n\n onUnmounted(() => {\n if (isIsolated && teleportHost.value) {\n ;(window as any).xCSSInjector.removeHost(teleportHost.value.shadowRoot)\n }\n })\n\n onBeforeUnmount(() => {\n targetAddedObserver.disconnect()\n targetRemovedObserver.disconnect()\n teleportHost.value?.remove()\n })\n\n // Handles target prop changes and init the observers accordingly.\n watch(\n () => props.target,\n newTarget => {\n targetAddedObserver.disconnect()\n targetRemovedObserver.disconnect()\n const target = typeof newTarget === 'string' ? document.querySelector(newTarget) : newTarget\n if (target?.isConnected) {\n targetAdded()\n } else {\n targetRemoved()\n }\n },\n { immediate: true },\n )\n\n // Updates the teleport host when props change.\n watchEffect(() => {\n if (!teleportHost.value) {\n return\n }\n if (props.disabled) {\n teleportHost.value.remove()\n return\n }\n teleportHost.value.className = `x-base-teleport x-base-teleport--${props.position}`\n\n if (!targetElement.value) {\n console.warn(`BaseTeleport: Target element \"${props.target}\" not found.`)\n return\n }\n const position = props.position === 'onlychild' ? 'beforeend' : props.position\n targetElement.value.insertAdjacentElement(position, teleportHost.value)\n })\n\n /** Checks if the target element exists in the DOM and updates the observers */\n function targetAdded() {\n let element =\n typeof props.target === 'string' ? document.querySelector(props.target) : props.target\n if (element?.isConnected) {\n targetAddedObserver.disconnect()\n targetElement.value = element\n while (element.parentElement) {\n element = element.parentElement\n targetRemovedObserver.observe(element, { childList: true })\n }\n }\n }\n\n /** Checks if the target was disconnected from the DOM and updates the observers */\n function targetRemoved() {\n if (targetElement.value && !targetElement.value.isConnected) {\n targetRemovedObserver.disconnect()\n targetAddedObserver.observe(document.body, { childList: true, subtree: true })\n targetElement.value = undefined\n }\n }\n\n /** Creates and sets the teleport host element */\n function createHost() {\n teleportHost.value = document.createElement('div')\n isIsolated = instance?.appContext.app._container instanceof ShadowRoot\n if (isIsolated) {\n teleportHost.value.attachShadow({ mode: 'open' })\n ;(window as any).xCSSInjector.addHost(teleportHost.value.shadowRoot)\n }\n }\n\n function afterAppMount(fn: () => void) {\n onMounted(() => setTimeout(fn, 0))\n }\n\n return { teleportHost }\n },\n})\n\n/** Teleport host styles should be injected outside our shadowRoots */\nconst css = document.createElement('style')\ncss.textContent = ':has(> .x-base-teleport--onlychild) > *:not(.x-base-teleport) { display: none; }'\ndocument.head?.appendChild(css) ||\n document.addEventListener('DOMContentLoaded', () => document.head.appendChild(css))\n</script>\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@empathyco/x-components",
3
- "version": "6.0.0-alpha.82",
3
+ "version": "6.0.0-alpha.84",
4
4
  "description": "Empathy X Components",
5
5
  "author": "Empathy Systems Corporation S.L.",
6
6
  "license": "Apache-2.0",
@@ -142,5 +142,5 @@
142
142
  "access": "public",
143
143
  "directory": "dist"
144
144
  },
145
- "gitHead": "581356fa1a13bba6c809ee8053d30a4de473e29f"
145
+ "gitHead": "c298f7de8b504c699c2b020c2ecc9d11e5eaf442"
146
146
  }
package/types/components/base-teleport.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"base-teleport.vue?vue&type=script&lang.d.ts","sourceRoot":"","sources":["../../../src/components/base-teleport.vue?vue&type=script&lang.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;;IAe/B,6EAA6E;;;;;IAK7E;;;;;;;OAOG;;;;;IAOH,2DAA2D;;;;;;;;IAnB3D,6EAA6E;;;;;IAK7E;;;;;;;OAOG;;;;;IAOH,2DAA2D;;;;;;;;;AAtB/D,wBAiIE"}
1
+ {"version":3,"file":"base-teleport.vue?vue&type=script&lang.d.ts","sourceRoot":"","sources":["../../../src/components/base-teleport.vue?vue&type=script&lang.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;;IAe/B,6EAA6E;;;;;IAK7E;;;;;;;OAOG;;;;;IAOH,2DAA2D;;;;;;;;IAnB3D,6EAA6E;;;;;IAK7E;;;;;;;OAOG;;;;;IAOH,2DAA2D;;;;;;;;;AAtB/D,wBAoIE"}