@simplybusiness/theme-core 7.2.0 → 7.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # Changelog
2
2
 
3
+ ## 7.2.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies [7352bc8]
8
+ - Updated dependencies [3da7d02]
9
+ - Updated dependencies [b2d5b4b]
10
+ - Updated dependencies [3708724]
11
+ - @simplybusiness/mobius@5.6.0
12
+
3
13
  ## 7.2.0
4
14
 
5
15
  ### Minor Changes
package/dist/index.css CHANGED
@@ -536,28 +536,50 @@ a.mobius-button:focus-visible,
536
536
  content:" (optional)";
537
537
  }
538
538
 
539
+ :root{
540
+ interpolate-size:allow-keywords;
541
+ --combobox-border-color:#ccc;
542
+ --combobox-group-color:var(--color-text);
543
+ --combobox-group-background-color:#dad6f7;
544
+ --combobox-selected-background-color:var(--color-primary);
545
+ --listbox-height:200px;
546
+ --listbox-gap:4px;
547
+ --option-padding:var(--size-xs) var(--size-lg);
548
+ }
549
+
539
550
  .mobius-combobox{
540
551
  position:relative;
552
+ width:100%;
541
553
  }
542
554
 
543
555
  .mobius-combobox__list{
544
556
  position:absolute;
545
557
  margin:0;
558
+ margin-top:var(--listbox-gap);
546
559
  padding:0;
547
560
  top:100%;
548
561
  left:0;
549
562
  right:0;
550
563
  z-index:1000;
551
564
  background-color:#fff;
552
- border:1px solid #ccc;
553
- border-top:0;
565
+ border:1px solid var(--combobox-border-color);
566
+ border-radius:var(--radius-1);
554
567
  box-shadow:0 2px 4px rgba(0, 0, 0, 0.1);
555
- max-height:200px;
568
+ max-height:var(--listbox-height);
556
569
  overflow-y:auto;
570
+ height:0;
571
+ opacity:0;
572
+ transition:box-shadow 0.3s ease, height 0.3s ease, opacity 0.3s ease;
573
+ transition-behavior:allow-discrete;
557
574
  }
558
575
 
576
+ .mobius-combobox__list.expanded{
577
+ opacity:1;
578
+ height:auto;
579
+ }
580
+
559
581
  .mobius-combobox__option{
560
- padding:0.5rem 1rem;
582
+ padding:var(--option-padding);
561
583
  cursor:pointer;
562
584
  }
563
585
 
@@ -567,6 +589,26 @@ a.mobius-button:focus-visible,
567
589
  color:var(--color-neutral-100);
568
590
  }
569
591
 
592
+ [role="group"]{
593
+ margin:0;
594
+ padding:0;
595
+ }
596
+
597
+ [role="group"] > [role="presentation"]{
598
+ display:block;
599
+ margin:0;
600
+ padding:var(--option-padding);
601
+ font-weight:bold;
602
+ color:var(--combobox-group-color);
603
+ background-color:var(--combobox-group-background-color);
604
+ }
605
+
606
+ [role="option"]{
607
+ position:relative;
608
+ display:block;
609
+ cursor:pointer;
610
+ }
611
+
570
612
  .mobius-container{
571
613
  box-sizing:border-box;
572
614
  margin-left:auto;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@simplybusiness/theme-core",
3
- "version": "7.2.0",
3
+ "version": "7.2.1",
4
4
  "main": "dist/index.css",
5
5
  "simplyBusiness": {
6
6
  "publishToPublicNpm": true
@@ -26,7 +26,7 @@
26
26
  "./fonts": "./dist/fonts.css"
27
27
  },
28
28
  "dependencies": {
29
- "@simplybusiness/mobius": "^5.5.0"
29
+ "@simplybusiness/mobius": "^5.6.0"
30
30
  },
31
31
  "devDependencies": {
32
32
  "css-loader": "^7.1.2",