@viasat/beam-styles 2.38.0 → 2.38.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/styles.css CHANGED
@@ -3921,7 +3921,15 @@
3921
3921
  --bm-sem-color-surface-negative-strong,
3922
3922
  #cc2429
3923
3923
  );
3924
- --bm-comp-input-typo-default: var(
3924
+ --bm-comp-input-typo-sm: var(
3925
+ --bm-sem-typo-compact-body-sm,
3926
+ 400 0.875rem/1rem "Source Sans Pro"
3927
+ );
3928
+ --bm-comp-input-typo-md: var(
3929
+ --bm-sem-typo-compact-body-md,
3930
+ 400 1rem/1.25rem "Source Sans Pro"
3931
+ );
3932
+ --bm-comp-input-typo-lg: var(
3925
3933
  --bm-sem-typo-compact-body-md,
3926
3934
  400 1rem/1.25rem "Source Sans Pro"
3927
3935
  );
@@ -3933,8 +3941,12 @@
3933
3941
  --bm-sem-typo-body-md,
3934
3942
  400 1rem/1.5rem "Source Sans Pro"
3935
3943
  );
3936
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
3937
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
3944
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
3945
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
3946
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
3947
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
3948
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
3949
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
3938
3950
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
3939
3951
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
3940
3952
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -3943,9 +3955,13 @@
3943
3955
  --bm-primitive-dimension-12,
3944
3956
  0.125rem
3945
3957
  );
3946
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
3958
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
3959
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
3960
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
3947
3961
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
3948
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
3962
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
3963
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
3964
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
3949
3965
  --bm-comp-input-size-field-text-area-height: var(
3950
3966
  --bm-primitive-dimension-475,
3951
3967
  4.75rem
@@ -4090,7 +4106,15 @@
4090
4106
  --bm-sem-color-surface-negative-strong,
4091
4107
  #f67378
4092
4108
  );
4093
- --bm-comp-input-typo-default: var(
4109
+ --bm-comp-input-typo-sm: var(
4110
+ --bm-sem-typo-compact-body-sm,
4111
+ 400 0.875rem/1rem "Source Sans Pro"
4112
+ );
4113
+ --bm-comp-input-typo-md: var(
4114
+ --bm-sem-typo-compact-body-md,
4115
+ 400 1rem/1.25rem "Source Sans Pro"
4116
+ );
4117
+ --bm-comp-input-typo-lg: var(
4094
4118
  --bm-sem-typo-compact-body-md,
4095
4119
  400 1rem/1.25rem "Source Sans Pro"
4096
4120
  );
@@ -4102,8 +4126,12 @@
4102
4126
  --bm-sem-typo-body-md,
4103
4127
  400 1rem/1.5rem "Source Sans Pro"
4104
4128
  );
4105
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
4106
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
4129
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
4130
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
4131
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
4132
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
4133
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
4134
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
4107
4135
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
4108
4136
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
4109
4137
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -4112,9 +4140,13 @@
4112
4140
  --bm-primitive-dimension-12,
4113
4141
  0.125rem
4114
4142
  );
4115
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
4143
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
4144
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
4145
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
4116
4146
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
4117
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
4147
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
4148
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
4149
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
4118
4150
  --bm-comp-input-size-field-text-area-height: var(
4119
4151
  --bm-primitive-dimension-475,
4120
4152
  4.75rem
@@ -4762,7 +4794,15 @@ textarea:focus-visible,
4762
4794
  --bm-sem-color-surface-negative-strong,
4763
4795
  #cc2429
4764
4796
  );
4765
- --bm-comp-input-typo-default: var(
4797
+ --bm-comp-input-typo-sm: var(
4798
+ --bm-sem-typo-compact-body-sm,
4799
+ 400 0.875rem/1rem "Source Sans Pro"
4800
+ );
4801
+ --bm-comp-input-typo-md: var(
4802
+ --bm-sem-typo-compact-body-md,
4803
+ 400 1rem/1.25rem "Source Sans Pro"
4804
+ );
4805
+ --bm-comp-input-typo-lg: var(
4766
4806
  --bm-sem-typo-compact-body-md,
4767
4807
  400 1rem/1.25rem "Source Sans Pro"
4768
4808
  );
@@ -4774,8 +4814,12 @@ textarea:focus-visible,
4774
4814
  --bm-sem-typo-body-md,
4775
4815
  400 1rem/1.5rem "Source Sans Pro"
4776
4816
  );
4777
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
4778
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
4817
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
4818
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
4819
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
4820
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
4821
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
4822
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
4779
4823
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
4780
4824
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
4781
4825
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -4784,9 +4828,13 @@ textarea:focus-visible,
4784
4828
  --bm-primitive-dimension-12,
4785
4829
  0.125rem
4786
4830
  );
4787
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
4831
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
4832
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
4833
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
4788
4834
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
4789
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
4835
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
4836
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
4837
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
4790
4838
  --bm-comp-input-size-field-text-area-height: var(
4791
4839
  --bm-primitive-dimension-475,
4792
4840
  4.75rem
@@ -4931,7 +4979,15 @@ textarea:focus-visible,
4931
4979
  --bm-sem-color-surface-negative-strong,
4932
4980
  #f67378
4933
4981
  );
4934
- --bm-comp-input-typo-default: var(
4982
+ --bm-comp-input-typo-sm: var(
4983
+ --bm-sem-typo-compact-body-sm,
4984
+ 400 0.875rem/1rem "Source Sans Pro"
4985
+ );
4986
+ --bm-comp-input-typo-md: var(
4987
+ --bm-sem-typo-compact-body-md,
4988
+ 400 1rem/1.25rem "Source Sans Pro"
4989
+ );
4990
+ --bm-comp-input-typo-lg: var(
4935
4991
  --bm-sem-typo-compact-body-md,
4936
4992
  400 1rem/1.25rem "Source Sans Pro"
4937
4993
  );
@@ -4943,8 +4999,12 @@ textarea:focus-visible,
4943
4999
  --bm-sem-typo-body-md,
4944
5000
  400 1rem/1.5rem "Source Sans Pro"
4945
5001
  );
4946
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
4947
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
5002
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
5003
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
5004
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
5005
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
5006
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
5007
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
4948
5008
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
4949
5009
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
4950
5010
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -4953,9 +5013,13 @@ textarea:focus-visible,
4953
5013
  --bm-primitive-dimension-12,
4954
5014
  0.125rem
4955
5015
  );
4956
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
5016
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
5017
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
5018
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
4957
5019
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
4958
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
5020
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
5021
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
5022
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
4959
5023
  --bm-comp-input-size-field-text-area-height: var(
4960
5024
  --bm-primitive-dimension-475,
4961
5025
  4.75rem
@@ -5025,7 +5089,7 @@ textarea:focus-visible,
5025
5089
  display: inherit;
5026
5090
  word-break: break-word;
5027
5091
  color: var(--bm-comp-input-color-text);
5028
- font: var(--bm-comp-input-typo-default);
5092
+ font: var(--bm-comp-input-typo-md);
5029
5093
  gap: var(--bm-comp-input-space-choice-gap-inside);
5030
5094
  cursor: var(--bm-input-choice-label-cursor, pointer);
5031
5095
  }
@@ -5689,7 +5753,15 @@ textarea:focus-visible,
5689
5753
  --bm-sem-color-surface-negative-strong,
5690
5754
  #cc2429
5691
5755
  );
5692
- --bm-comp-input-typo-default: var(
5756
+ --bm-comp-input-typo-sm: var(
5757
+ --bm-sem-typo-compact-body-sm,
5758
+ 400 0.875rem/1rem "Source Sans Pro"
5759
+ );
5760
+ --bm-comp-input-typo-md: var(
5761
+ --bm-sem-typo-compact-body-md,
5762
+ 400 1rem/1.25rem "Source Sans Pro"
5763
+ );
5764
+ --bm-comp-input-typo-lg: var(
5693
5765
  --bm-sem-typo-compact-body-md,
5694
5766
  400 1rem/1.25rem "Source Sans Pro"
5695
5767
  );
@@ -5701,8 +5773,12 @@ textarea:focus-visible,
5701
5773
  --bm-sem-typo-body-md,
5702
5774
  400 1rem/1.5rem "Source Sans Pro"
5703
5775
  );
5704
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
5705
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
5776
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
5777
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
5778
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
5779
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
5780
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
5781
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
5706
5782
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
5707
5783
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
5708
5784
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -5711,9 +5787,13 @@ textarea:focus-visible,
5711
5787
  --bm-primitive-dimension-12,
5712
5788
  0.125rem
5713
5789
  );
5714
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
5790
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
5791
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
5792
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
5715
5793
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
5716
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
5794
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
5795
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
5796
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
5717
5797
  --bm-comp-input-size-field-text-area-height: var(
5718
5798
  --bm-primitive-dimension-475,
5719
5799
  4.75rem
@@ -5858,7 +5938,15 @@ textarea:focus-visible,
5858
5938
  --bm-sem-color-surface-negative-strong,
5859
5939
  #f67378
5860
5940
  );
5861
- --bm-comp-input-typo-default: var(
5941
+ --bm-comp-input-typo-sm: var(
5942
+ --bm-sem-typo-compact-body-sm,
5943
+ 400 0.875rem/1rem "Source Sans Pro"
5944
+ );
5945
+ --bm-comp-input-typo-md: var(
5946
+ --bm-sem-typo-compact-body-md,
5947
+ 400 1rem/1.25rem "Source Sans Pro"
5948
+ );
5949
+ --bm-comp-input-typo-lg: var(
5862
5950
  --bm-sem-typo-compact-body-md,
5863
5951
  400 1rem/1.25rem "Source Sans Pro"
5864
5952
  );
@@ -5870,8 +5958,12 @@ textarea:focus-visible,
5870
5958
  --bm-sem-typo-body-md,
5871
5959
  400 1rem/1.5rem "Source Sans Pro"
5872
5960
  );
5873
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
5874
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
5961
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
5962
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
5963
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
5964
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
5965
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
5966
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
5875
5967
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
5876
5968
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
5877
5969
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -5880,9 +5972,13 @@ textarea:focus-visible,
5880
5972
  --bm-primitive-dimension-12,
5881
5973
  0.125rem
5882
5974
  );
5883
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
5975
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
5976
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
5977
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
5884
5978
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
5885
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
5979
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
5980
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
5981
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
5886
5982
  --bm-comp-input-size-field-text-area-height: var(
5887
5983
  --bm-primitive-dimension-475,
5888
5984
  4.75rem
@@ -5950,25 +6046,25 @@ textarea:focus-visible,
5950
6046
  --bm-text-field-input-cursor: not-allowed;
5951
6047
  }
5952
6048
  .bm-combobox--sm .bm-combobox__field {
5953
- --bm-input-field-height: var(--bm-sem-size-height-sm);
5954
- --bm-input-field-padding-y: var(--bm-sem-space-25);
5955
- --bm-input-field-padding-x: var(--bm-sem-space-75);
5956
- --bm-input-field-font: var(--bm-sem-typo-compact-body-sm);
5957
- --bm-input-field-icon-size: var(--bm-sem-size-icon-sm);
6049
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-sm);
6050
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-sm);
6051
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-sm);
6052
+ --bm-input-field-font: var(--bm-comp-input-typo-sm);
6053
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-sm);
5958
6054
  }
5959
6055
  .bm-combobox--md .bm-combobox__field {
5960
- --bm-input-field-height: var(--bm-comp-input-size-field-md-height);
5961
- --bm-input-field-padding-y: var(--bm-comp-input-space-field-y);
5962
- --bm-input-field-padding-x: var(--bm-comp-input-space-field-x);
5963
- --bm-input-field-font: var(--bm-comp-input-typo-default);
5964
- --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon);
6056
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-md);
6057
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-md);
6058
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-md);
6059
+ --bm-input-field-font: var(--bm-comp-input-typo-md);
6060
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-md);
5965
6061
  }
5966
6062
  .bm-combobox--lg .bm-combobox__field {
5967
- --bm-input-field-height: var(--bm-sem-size-height-lg);
5968
- --bm-input-field-padding-y: var(--bm-sem-space-75);
5969
- --bm-input-field-padding-x: var(--bm-sem-space-125);
5970
- --bm-input-field-font: var(--bm-comp-input-typo-default);
5971
- --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon);
6063
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-lg);
6064
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-lg);
6065
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-lg);
6066
+ --bm-input-field-font: var(--bm-comp-input-typo-lg);
6067
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-lg);
5972
6068
  }
5973
6069
  .bm-combobox--fluid {
5974
6070
  max-width: 100%;
@@ -6056,6 +6152,12 @@ textarea:focus-visible,
6056
6152
  flex-wrap: wrap;
6057
6153
  margin-block: calc(-1 * var(--bm-comp-input-border-width-field-default));
6058
6154
  }
6155
+ .bm-combobox__field__content-before svg,
6156
+ .bm-combobox__field__content-before ::slotted([slot*=content]), .bm-combobox__field__content-after svg,
6157
+ .bm-combobox__field__content-after ::slotted([slot*=content]) {
6158
+ color: var(--bm-comp-input-color-icon);
6159
+ height: var(--bm-primitive-dimension-100);
6160
+ }
6059
6161
  .bm-combobox__field__content-before .bm-icon, .bm-combobox__field__content-after .bm-icon {
6060
6162
  width: var(--bm-input-field-icon-size);
6061
6163
  height: var(--bm-input-field-icon-size);
@@ -6113,7 +6215,8 @@ textarea:focus-visible,
6113
6215
  transform: translate3d(var(--bm-sem-space-0), var(--bm-sem-space-0), var(--bm-sem-space-0));
6114
6216
  padding-block: var(--bm-input-field-padding-y);
6115
6217
  padding-inline: var(--bm-input-field-padding-x) calc(
6116
- 0.625rem + var(--bm-comp-input-space-field-gap) + var(--bm-input-field-padding-x)
6218
+ 0.625rem + var(--bm-comp-input-space-field-gap) +
6219
+ var(--bm-input-field-padding-x)
6117
6220
  );
6118
6221
  min-height: var(--bm-input-field-height);
6119
6222
  }
@@ -6222,7 +6325,15 @@ textarea:focus-visible,
6222
6325
  --bm-sem-color-surface-negative-strong,
6223
6326
  #cc2429
6224
6327
  );
6225
- --bm-comp-input-typo-default: var(
6328
+ --bm-comp-input-typo-sm: var(
6329
+ --bm-sem-typo-compact-body-sm,
6330
+ 400 0.875rem/1rem "Source Sans Pro"
6331
+ );
6332
+ --bm-comp-input-typo-md: var(
6333
+ --bm-sem-typo-compact-body-md,
6334
+ 400 1rem/1.25rem "Source Sans Pro"
6335
+ );
6336
+ --bm-comp-input-typo-lg: var(
6226
6337
  --bm-sem-typo-compact-body-md,
6227
6338
  400 1rem/1.25rem "Source Sans Pro"
6228
6339
  );
@@ -6234,8 +6345,12 @@ textarea:focus-visible,
6234
6345
  --bm-sem-typo-body-md,
6235
6346
  400 1rem/1.5rem "Source Sans Pro"
6236
6347
  );
6237
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
6238
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
6348
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
6349
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
6350
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
6351
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
6352
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
6353
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
6239
6354
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
6240
6355
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
6241
6356
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -6244,9 +6359,13 @@ textarea:focus-visible,
6244
6359
  --bm-primitive-dimension-12,
6245
6360
  0.125rem
6246
6361
  );
6247
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
6362
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
6363
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
6364
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
6248
6365
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
6249
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
6366
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
6367
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
6368
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
6250
6369
  --bm-comp-input-size-field-text-area-height: var(
6251
6370
  --bm-primitive-dimension-475,
6252
6371
  4.75rem
@@ -6391,7 +6510,15 @@ textarea:focus-visible,
6391
6510
  --bm-sem-color-surface-negative-strong,
6392
6511
  #f67378
6393
6512
  );
6394
- --bm-comp-input-typo-default: var(
6513
+ --bm-comp-input-typo-sm: var(
6514
+ --bm-sem-typo-compact-body-sm,
6515
+ 400 0.875rem/1rem "Source Sans Pro"
6516
+ );
6517
+ --bm-comp-input-typo-md: var(
6518
+ --bm-sem-typo-compact-body-md,
6519
+ 400 1rem/1.25rem "Source Sans Pro"
6520
+ );
6521
+ --bm-comp-input-typo-lg: var(
6395
6522
  --bm-sem-typo-compact-body-md,
6396
6523
  400 1rem/1.25rem "Source Sans Pro"
6397
6524
  );
@@ -6403,8 +6530,12 @@ textarea:focus-visible,
6403
6530
  --bm-sem-typo-body-md,
6404
6531
  400 1rem/1.5rem "Source Sans Pro"
6405
6532
  );
6406
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
6407
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
6533
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
6534
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
6535
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
6536
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
6537
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
6538
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
6408
6539
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
6409
6540
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
6410
6541
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -6413,9 +6544,13 @@ textarea:focus-visible,
6413
6544
  --bm-primitive-dimension-12,
6414
6545
  0.125rem
6415
6546
  );
6416
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
6547
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
6548
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
6549
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
6417
6550
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
6418
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
6551
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
6552
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
6553
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
6419
6554
  --bm-comp-input-size-field-text-area-height: var(
6420
6555
  --bm-primitive-dimension-475,
6421
6556
  4.75rem
@@ -6529,9 +6664,9 @@ textarea:focus-visible,
6529
6664
  gap: var(--bm-comp-input-space-field-gap);
6530
6665
  box-shadow: var(--bm-comp-input-shadow-field);
6531
6666
  background-color: var(--bm-comp-input-color-bg);
6532
- height: var(--bm-comp-input-size-field-md-height);
6533
- padding-block: var(--bm-comp-input-space-field-y);
6534
- padding-inline: var(--bm-comp-input-space-field-x);
6667
+ height: var(--bm-comp-input-size-field-height-md);
6668
+ padding-block: var(--bm-comp-input-space-field-y-md);
6669
+ padding-inline: var(--bm-comp-input-space-field-x-md);
6535
6670
  }
6536
6671
  .bm-date-field__field:focus-within {
6537
6672
  outline-offset: calc(0px - var(--bm-sem-size-focus-offset));
@@ -6541,7 +6676,7 @@ textarea:focus-visible,
6541
6676
  display: inline-flex;
6542
6677
  align-items: baseline;
6543
6678
  color: var(--bm-comp-input-color-text);
6544
- font: var(--bm-comp-input-typo-default);
6679
+ font: var(--bm-comp-input-typo-md);
6545
6680
  font-variant-numeric: tabular-nums;
6546
6681
  gap: var(--bm-sem-space-12);
6547
6682
  }
@@ -6567,7 +6702,7 @@ textarea:focus-visible,
6567
6702
  }
6568
6703
  .bm-date-field__field .bm-date-field__separator {
6569
6704
  color: var(--bm-comp-input-color-text);
6570
- font: var(--bm-comp-input-typo-default);
6705
+ font: var(--bm-comp-input-typo-md);
6571
6706
  user-select: none;
6572
6707
  }
6573
6708
 
@@ -8323,7 +8458,15 @@ textarea:focus-visible,
8323
8458
  --bm-sem-color-surface-negative-strong,
8324
8459
  #cc2429
8325
8460
  );
8326
- --bm-comp-input-typo-default: var(
8461
+ --bm-comp-input-typo-sm: var(
8462
+ --bm-sem-typo-compact-body-sm,
8463
+ 400 0.875rem/1rem "Source Sans Pro"
8464
+ );
8465
+ --bm-comp-input-typo-md: var(
8466
+ --bm-sem-typo-compact-body-md,
8467
+ 400 1rem/1.25rem "Source Sans Pro"
8468
+ );
8469
+ --bm-comp-input-typo-lg: var(
8327
8470
  --bm-sem-typo-compact-body-md,
8328
8471
  400 1rem/1.25rem "Source Sans Pro"
8329
8472
  );
@@ -8335,8 +8478,12 @@ textarea:focus-visible,
8335
8478
  --bm-sem-typo-body-md,
8336
8479
  400 1rem/1.5rem "Source Sans Pro"
8337
8480
  );
8338
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
8339
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
8481
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
8482
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
8483
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
8484
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
8485
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
8486
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
8340
8487
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
8341
8488
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
8342
8489
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -8345,9 +8492,13 @@ textarea:focus-visible,
8345
8492
  --bm-primitive-dimension-12,
8346
8493
  0.125rem
8347
8494
  );
8348
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
8495
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
8496
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
8497
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
8349
8498
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
8350
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
8499
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
8500
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
8501
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
8351
8502
  --bm-comp-input-size-field-text-area-height: var(
8352
8503
  --bm-primitive-dimension-475,
8353
8504
  4.75rem
@@ -8492,7 +8643,15 @@ textarea:focus-visible,
8492
8643
  --bm-sem-color-surface-negative-strong,
8493
8644
  #f67378
8494
8645
  );
8495
- --bm-comp-input-typo-default: var(
8646
+ --bm-comp-input-typo-sm: var(
8647
+ --bm-sem-typo-compact-body-sm,
8648
+ 400 0.875rem/1rem "Source Sans Pro"
8649
+ );
8650
+ --bm-comp-input-typo-md: var(
8651
+ --bm-sem-typo-compact-body-md,
8652
+ 400 1rem/1.25rem "Source Sans Pro"
8653
+ );
8654
+ --bm-comp-input-typo-lg: var(
8496
8655
  --bm-sem-typo-compact-body-md,
8497
8656
  400 1rem/1.25rem "Source Sans Pro"
8498
8657
  );
@@ -8504,8 +8663,12 @@ textarea:focus-visible,
8504
8663
  --bm-sem-typo-body-md,
8505
8664
  400 1rem/1.5rem "Source Sans Pro"
8506
8665
  );
8507
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
8508
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
8666
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
8667
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
8668
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
8669
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
8670
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
8671
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
8509
8672
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
8510
8673
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
8511
8674
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -8514,9 +8677,13 @@ textarea:focus-visible,
8514
8677
  --bm-primitive-dimension-12,
8515
8678
  0.125rem
8516
8679
  );
8517
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
8680
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
8681
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
8682
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
8518
8683
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
8519
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
8684
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
8685
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
8686
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
8520
8687
  --bm-comp-input-size-field-text-area-height: var(
8521
8688
  --bm-primitive-dimension-475,
8522
8689
  4.75rem
@@ -9385,7 +9552,15 @@ textarea:focus-visible,
9385
9552
  --bm-sem-color-surface-negative-strong,
9386
9553
  #cc2429
9387
9554
  );
9388
- --bm-comp-input-typo-default: var(
9555
+ --bm-comp-input-typo-sm: var(
9556
+ --bm-sem-typo-compact-body-sm,
9557
+ 400 0.875rem/1rem "Source Sans Pro"
9558
+ );
9559
+ --bm-comp-input-typo-md: var(
9560
+ --bm-sem-typo-compact-body-md,
9561
+ 400 1rem/1.25rem "Source Sans Pro"
9562
+ );
9563
+ --bm-comp-input-typo-lg: var(
9389
9564
  --bm-sem-typo-compact-body-md,
9390
9565
  400 1rem/1.25rem "Source Sans Pro"
9391
9566
  );
@@ -9397,8 +9572,12 @@ textarea:focus-visible,
9397
9572
  --bm-sem-typo-body-md,
9398
9573
  400 1rem/1.5rem "Source Sans Pro"
9399
9574
  );
9400
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
9401
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
9575
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
9576
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
9577
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
9578
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
9579
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
9580
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
9402
9581
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
9403
9582
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
9404
9583
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -9407,9 +9586,13 @@ textarea:focus-visible,
9407
9586
  --bm-primitive-dimension-12,
9408
9587
  0.125rem
9409
9588
  );
9410
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
9589
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
9590
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
9591
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
9411
9592
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
9412
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
9593
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
9594
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
9595
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
9413
9596
  --bm-comp-input-size-field-text-area-height: var(
9414
9597
  --bm-primitive-dimension-475,
9415
9598
  4.75rem
@@ -9554,7 +9737,15 @@ textarea:focus-visible,
9554
9737
  --bm-sem-color-surface-negative-strong,
9555
9738
  #f67378
9556
9739
  );
9557
- --bm-comp-input-typo-default: var(
9740
+ --bm-comp-input-typo-sm: var(
9741
+ --bm-sem-typo-compact-body-sm,
9742
+ 400 0.875rem/1rem "Source Sans Pro"
9743
+ );
9744
+ --bm-comp-input-typo-md: var(
9745
+ --bm-sem-typo-compact-body-md,
9746
+ 400 1rem/1.25rem "Source Sans Pro"
9747
+ );
9748
+ --bm-comp-input-typo-lg: var(
9558
9749
  --bm-sem-typo-compact-body-md,
9559
9750
  400 1rem/1.25rem "Source Sans Pro"
9560
9751
  );
@@ -9566,8 +9757,12 @@ textarea:focus-visible,
9566
9757
  --bm-sem-typo-body-md,
9567
9758
  400 1rem/1.5rem "Source Sans Pro"
9568
9759
  );
9569
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
9570
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
9760
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
9761
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
9762
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
9763
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
9764
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
9765
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
9571
9766
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
9572
9767
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
9573
9768
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -9576,9 +9771,13 @@ textarea:focus-visible,
9576
9771
  --bm-primitive-dimension-12,
9577
9772
  0.125rem
9578
9773
  );
9579
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
9774
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
9775
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
9776
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
9580
9777
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
9581
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
9778
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
9779
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
9780
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
9582
9781
  --bm-comp-input-size-field-text-area-height: var(
9583
9782
  --bm-primitive-dimension-475,
9584
9783
  4.75rem
@@ -9645,25 +9844,25 @@ textarea:focus-visible,
9645
9844
  --bm-text-field-input-cursor: not-allowed;
9646
9845
  }
9647
9846
  .bm-native-select--sm .bm-native-select__field {
9648
- --bm-input-field-height: var(--bm-sem-size-height-sm);
9649
- --bm-input-field-padding-y: var(--bm-sem-space-25);
9650
- --bm-input-field-padding-x: var(--bm-sem-space-75);
9651
- --bm-input-field-font: var(--bm-sem-typo-compact-body-sm);
9652
- --bm-input-field-icon-size: var(--bm-sem-size-icon-sm);
9847
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-sm);
9848
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-sm);
9849
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-sm);
9850
+ --bm-input-field-font: var(--bm-comp-input-typo-sm);
9851
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-sm);
9653
9852
  }
9654
9853
  .bm-native-select--md .bm-native-select__field {
9655
- --bm-input-field-height: var(--bm-comp-input-size-field-md-height);
9656
- --bm-input-field-padding-y: var(--bm-comp-input-space-field-y);
9657
- --bm-input-field-padding-x: var(--bm-comp-input-space-field-x);
9658
- --bm-input-field-font: var(--bm-comp-input-typo-default);
9659
- --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon);
9854
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-md);
9855
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-md);
9856
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-md);
9857
+ --bm-input-field-font: var(--bm-comp-input-typo-md);
9858
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-md);
9660
9859
  }
9661
9860
  .bm-native-select--lg .bm-native-select__field {
9662
- --bm-input-field-height: var(--bm-sem-size-height-lg);
9663
- --bm-input-field-padding-y: var(--bm-sem-space-75);
9664
- --bm-input-field-padding-x: var(--bm-sem-space-125);
9665
- --bm-input-field-font: var(--bm-comp-input-typo-default);
9666
- --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon);
9861
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-lg);
9862
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-lg);
9863
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-lg);
9864
+ --bm-input-field-font: var(--bm-comp-input-typo-lg);
9865
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-lg);
9667
9866
  }
9668
9867
  .bm-native-select--fluid {
9669
9868
  max-width: 100%;
@@ -9742,7 +9941,8 @@ textarea:focus-visible,
9742
9941
  transform: translate3d(var(--bm-sem-space-0), var(--bm-sem-space-0), var(--bm-sem-space-0));
9743
9942
  padding-block: var(--bm-input-field-padding-y);
9744
9943
  padding-inline: var(--bm-input-field-padding-x) calc(
9745
- 0.625rem + var(--bm-comp-input-space-field-gap) + var(--bm-input-field-padding-x)
9944
+ 0.625rem + var(--bm-comp-input-space-field-gap) +
9945
+ var(--bm-input-field-padding-x)
9746
9946
  );
9747
9947
  }
9748
9948
  .bm-native-select__field .bm-native-select__input:focus {
@@ -10460,7 +10660,15 @@ textarea:focus-visible,
10460
10660
  --bm-sem-color-surface-negative-strong,
10461
10661
  #cc2429
10462
10662
  );
10463
- --bm-comp-input-typo-default: var(
10663
+ --bm-comp-input-typo-sm: var(
10664
+ --bm-sem-typo-compact-body-sm,
10665
+ 400 0.875rem/1rem "Source Sans Pro"
10666
+ );
10667
+ --bm-comp-input-typo-md: var(
10668
+ --bm-sem-typo-compact-body-md,
10669
+ 400 1rem/1.25rem "Source Sans Pro"
10670
+ );
10671
+ --bm-comp-input-typo-lg: var(
10464
10672
  --bm-sem-typo-compact-body-md,
10465
10673
  400 1rem/1.25rem "Source Sans Pro"
10466
10674
  );
@@ -10472,8 +10680,12 @@ textarea:focus-visible,
10472
10680
  --bm-sem-typo-body-md,
10473
10681
  400 1rem/1.5rem "Source Sans Pro"
10474
10682
  );
10475
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
10476
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
10683
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
10684
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
10685
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
10686
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
10687
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
10688
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
10477
10689
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
10478
10690
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
10479
10691
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -10482,9 +10694,13 @@ textarea:focus-visible,
10482
10694
  --bm-primitive-dimension-12,
10483
10695
  0.125rem
10484
10696
  );
10485
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
10697
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
10698
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
10699
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
10486
10700
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
10487
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
10701
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
10702
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
10703
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
10488
10704
  --bm-comp-input-size-field-text-area-height: var(
10489
10705
  --bm-primitive-dimension-475,
10490
10706
  4.75rem
@@ -10629,7 +10845,15 @@ textarea:focus-visible,
10629
10845
  --bm-sem-color-surface-negative-strong,
10630
10846
  #f67378
10631
10847
  );
10632
- --bm-comp-input-typo-default: var(
10848
+ --bm-comp-input-typo-sm: var(
10849
+ --bm-sem-typo-compact-body-sm,
10850
+ 400 0.875rem/1rem "Source Sans Pro"
10851
+ );
10852
+ --bm-comp-input-typo-md: var(
10853
+ --bm-sem-typo-compact-body-md,
10854
+ 400 1rem/1.25rem "Source Sans Pro"
10855
+ );
10856
+ --bm-comp-input-typo-lg: var(
10633
10857
  --bm-sem-typo-compact-body-md,
10634
10858
  400 1rem/1.25rem "Source Sans Pro"
10635
10859
  );
@@ -10641,8 +10865,12 @@ textarea:focus-visible,
10641
10865
  --bm-sem-typo-body-md,
10642
10866
  400 1rem/1.5rem "Source Sans Pro"
10643
10867
  );
10644
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
10645
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
10868
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
10869
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
10870
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
10871
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
10872
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
10873
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
10646
10874
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
10647
10875
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
10648
10876
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -10651,9 +10879,13 @@ textarea:focus-visible,
10651
10879
  --bm-primitive-dimension-12,
10652
10880
  0.125rem
10653
10881
  );
10654
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
10882
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
10883
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
10884
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
10655
10885
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
10656
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
10886
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
10887
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
10888
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
10657
10889
  --bm-comp-input-size-field-text-area-height: var(
10658
10890
  --bm-primitive-dimension-475,
10659
10891
  4.75rem
@@ -10723,7 +10955,7 @@ textarea:focus-visible,
10723
10955
  display: inherit;
10724
10956
  word-break: break-word;
10725
10957
  color: var(--bm-comp-input-color-text);
10726
- font: var(--bm-comp-input-typo-default);
10958
+ font: var(--bm-comp-input-typo-md);
10727
10959
  gap: var(--bm-comp-input-space-choice-gap-inside);
10728
10960
  cursor: var(--bm-input-choice-label-cursor, pointer);
10729
10961
  pointer-events: var(--bm-input-choice-label-pointer-events, auto);
@@ -10891,7 +11123,15 @@ textarea:focus-visible,
10891
11123
  --bm-sem-color-surface-negative-strong,
10892
11124
  #cc2429
10893
11125
  );
10894
- --bm-comp-input-typo-default: var(
11126
+ --bm-comp-input-typo-sm: var(
11127
+ --bm-sem-typo-compact-body-sm,
11128
+ 400 0.875rem/1rem "Source Sans Pro"
11129
+ );
11130
+ --bm-comp-input-typo-md: var(
11131
+ --bm-sem-typo-compact-body-md,
11132
+ 400 1rem/1.25rem "Source Sans Pro"
11133
+ );
11134
+ --bm-comp-input-typo-lg: var(
10895
11135
  --bm-sem-typo-compact-body-md,
10896
11136
  400 1rem/1.25rem "Source Sans Pro"
10897
11137
  );
@@ -10903,8 +11143,12 @@ textarea:focus-visible,
10903
11143
  --bm-sem-typo-body-md,
10904
11144
  400 1rem/1.5rem "Source Sans Pro"
10905
11145
  );
10906
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
10907
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
11146
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
11147
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
11148
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
11149
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
11150
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
11151
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
10908
11152
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
10909
11153
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
10910
11154
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -10913,9 +11157,13 @@ textarea:focus-visible,
10913
11157
  --bm-primitive-dimension-12,
10914
11158
  0.125rem
10915
11159
  );
10916
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
11160
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
11161
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
11162
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
10917
11163
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
10918
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
11164
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
11165
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
11166
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
10919
11167
  --bm-comp-input-size-field-text-area-height: var(
10920
11168
  --bm-primitive-dimension-475,
10921
11169
  4.75rem
@@ -11060,7 +11308,15 @@ textarea:focus-visible,
11060
11308
  --bm-sem-color-surface-negative-strong,
11061
11309
  #f67378
11062
11310
  );
11063
- --bm-comp-input-typo-default: var(
11311
+ --bm-comp-input-typo-sm: var(
11312
+ --bm-sem-typo-compact-body-sm,
11313
+ 400 0.875rem/1rem "Source Sans Pro"
11314
+ );
11315
+ --bm-comp-input-typo-md: var(
11316
+ --bm-sem-typo-compact-body-md,
11317
+ 400 1rem/1.25rem "Source Sans Pro"
11318
+ );
11319
+ --bm-comp-input-typo-lg: var(
11064
11320
  --bm-sem-typo-compact-body-md,
11065
11321
  400 1rem/1.25rem "Source Sans Pro"
11066
11322
  );
@@ -11072,8 +11328,12 @@ textarea:focus-visible,
11072
11328
  --bm-sem-typo-body-md,
11073
11329
  400 1rem/1.5rem "Source Sans Pro"
11074
11330
  );
11075
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
11076
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
11331
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
11332
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
11333
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
11334
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
11335
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
11336
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
11077
11337
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
11078
11338
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
11079
11339
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -11082,9 +11342,13 @@ textarea:focus-visible,
11082
11342
  --bm-primitive-dimension-12,
11083
11343
  0.125rem
11084
11344
  );
11085
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
11345
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
11346
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
11347
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
11086
11348
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
11087
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
11349
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
11350
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
11351
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
11088
11352
  --bm-comp-input-size-field-text-area-height: var(
11089
11353
  --bm-primitive-dimension-475,
11090
11354
  4.75rem
@@ -11151,25 +11415,25 @@ textarea:focus-visible,
11151
11415
  --bm-text-field-input-cursor: not-allowed;
11152
11416
  }
11153
11417
  .bm-search--sm .bm-search__field {
11154
- --bm-input-field-height: var(--bm-sem-size-height-sm);
11155
- --bm-input-field-padding-y: var(--bm-sem-space-25);
11156
- --bm-input-field-padding-x: var(--bm-sem-space-75);
11157
- --bm-input-field-font: var(--bm-sem-typo-compact-body-sm);
11158
- --bm-input-field-icon-size: var(--bm-sem-size-icon-sm);
11418
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-sm);
11419
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-sm);
11420
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-sm);
11421
+ --bm-input-field-font: var(--bm-comp-input-typo-sm);
11422
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-sm);
11159
11423
  }
11160
11424
  .bm-search--md .bm-search__field {
11161
- --bm-input-field-height: var(--bm-comp-input-size-field-md-height);
11162
- --bm-input-field-padding-y: var(--bm-comp-input-space-field-y);
11163
- --bm-input-field-padding-x: var(--bm-comp-input-space-field-x);
11164
- --bm-input-field-font: var(--bm-comp-input-typo-default);
11165
- --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon);
11425
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-md);
11426
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-md);
11427
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-md);
11428
+ --bm-input-field-font: var(--bm-comp-input-typo-md);
11429
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-md);
11166
11430
  }
11167
11431
  .bm-search--lg .bm-search__field {
11168
- --bm-input-field-height: var(--bm-sem-size-height-lg);
11169
- --bm-input-field-padding-y: var(--bm-sem-space-75);
11170
- --bm-input-field-padding-x: var(--bm-sem-space-125);
11171
- --bm-input-field-font: var(--bm-comp-input-typo-default);
11172
- --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon);
11432
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-lg);
11433
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-lg);
11434
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-lg);
11435
+ --bm-input-field-font: var(--bm-comp-input-typo-lg);
11436
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-lg);
11173
11437
  }
11174
11438
  .bm-search--fluid {
11175
11439
  max-width: 100%;
@@ -11278,8 +11542,7 @@ textarea:focus-visible,
11278
11542
  .bm-search__field .bm-search__content svg,
11279
11543
  .bm-search__field .bm-search__content ::slotted([slot*=content]) {
11280
11544
  color: var(--bm-comp-input-color-icon);
11281
- width: var(--bm-comp-input-size-field-icon);
11282
- height: var(--bm-comp-input-size-field-icon);
11545
+ height: var(--bm-primitive-dimension-100);
11283
11546
  }
11284
11547
  .bm-search__field .bm-search__content .bm-icon {
11285
11548
  width: var(--bm-input-field-icon-size);
@@ -12463,7 +12726,7 @@ textarea:focus-visible,
12463
12726
  --bm-slider-thumb-cursor: pointer;
12464
12727
  --bm-comp-slider-min-percentage: 0cqw;
12465
12728
  --bm-comp-slider-max-percentage: 0cqw;
12466
- font: var(--bm-comp-input-typo-default);
12729
+ font: var(--bm-comp-input-typo-md);
12467
12730
  }
12468
12731
  .bm-slider--disabled {
12469
12732
  --bm-label-cursor: not-allowed;
@@ -13362,7 +13625,15 @@ textarea:focus-visible,
13362
13625
  --bm-sem-color-surface-negative-strong,
13363
13626
  #cc2429
13364
13627
  );
13365
- --bm-comp-input-typo-default: var(
13628
+ --bm-comp-input-typo-sm: var(
13629
+ --bm-sem-typo-compact-body-sm,
13630
+ 400 0.875rem/1rem "Source Sans Pro"
13631
+ );
13632
+ --bm-comp-input-typo-md: var(
13633
+ --bm-sem-typo-compact-body-md,
13634
+ 400 1rem/1.25rem "Source Sans Pro"
13635
+ );
13636
+ --bm-comp-input-typo-lg: var(
13366
13637
  --bm-sem-typo-compact-body-md,
13367
13638
  400 1rem/1.25rem "Source Sans Pro"
13368
13639
  );
@@ -13374,8 +13645,12 @@ textarea:focus-visible,
13374
13645
  --bm-sem-typo-body-md,
13375
13646
  400 1rem/1.5rem "Source Sans Pro"
13376
13647
  );
13377
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
13378
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
13648
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
13649
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
13650
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
13651
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
13652
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
13653
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
13379
13654
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
13380
13655
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
13381
13656
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -13384,9 +13659,13 @@ textarea:focus-visible,
13384
13659
  --bm-primitive-dimension-12,
13385
13660
  0.125rem
13386
13661
  );
13387
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
13662
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
13663
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
13664
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
13388
13665
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
13389
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
13666
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
13667
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
13668
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
13390
13669
  --bm-comp-input-size-field-text-area-height: var(
13391
13670
  --bm-primitive-dimension-475,
13392
13671
  4.75rem
@@ -13531,7 +13810,15 @@ textarea:focus-visible,
13531
13810
  --bm-sem-color-surface-negative-strong,
13532
13811
  #f67378
13533
13812
  );
13534
- --bm-comp-input-typo-default: var(
13813
+ --bm-comp-input-typo-sm: var(
13814
+ --bm-sem-typo-compact-body-sm,
13815
+ 400 0.875rem/1rem "Source Sans Pro"
13816
+ );
13817
+ --bm-comp-input-typo-md: var(
13818
+ --bm-sem-typo-compact-body-md,
13819
+ 400 1rem/1.25rem "Source Sans Pro"
13820
+ );
13821
+ --bm-comp-input-typo-lg: var(
13535
13822
  --bm-sem-typo-compact-body-md,
13536
13823
  400 1rem/1.25rem "Source Sans Pro"
13537
13824
  );
@@ -13543,8 +13830,12 @@ textarea:focus-visible,
13543
13830
  --bm-sem-typo-body-md,
13544
13831
  400 1rem/1.5rem "Source Sans Pro"
13545
13832
  );
13546
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
13547
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
13833
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
13834
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
13835
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
13836
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
13837
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
13838
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
13548
13839
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
13549
13840
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
13550
13841
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -13553,9 +13844,13 @@ textarea:focus-visible,
13553
13844
  --bm-primitive-dimension-12,
13554
13845
  0.125rem
13555
13846
  );
13556
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
13847
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
13848
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
13849
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
13557
13850
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
13558
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
13851
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
13852
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
13853
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
13559
13854
  --bm-comp-input-size-field-text-area-height: var(
13560
13855
  --bm-primitive-dimension-475,
13561
13856
  4.75rem
@@ -13626,7 +13921,7 @@ textarea:focus-visible,
13626
13921
  gap: var(--bm-comp-input-space-choice-gap-inside);
13627
13922
  min-width: var(--bm-comp-input-size-choice-switch-width);
13628
13923
  min-height: var(--bm-comp-input-size-choice-switch-height);
13629
- font: var(--bm-comp-input-typo-default);
13924
+ font: var(--bm-comp-input-typo-md);
13630
13925
  color: var(--bm-comp-input-color-text);
13631
13926
  cursor: var(--bm-input-choice-label-cursor, pointer);
13632
13927
  pointer-events: var(--bm-input-choice-label-pointer-events, auto);
@@ -14717,7 +15012,15 @@ textarea:focus-visible,
14717
15012
  --bm-sem-color-surface-negative-strong,
14718
15013
  #cc2429
14719
15014
  );
14720
- --bm-comp-input-typo-default: var(
15015
+ --bm-comp-input-typo-sm: var(
15016
+ --bm-sem-typo-compact-body-sm,
15017
+ 400 0.875rem/1rem "Source Sans Pro"
15018
+ );
15019
+ --bm-comp-input-typo-md: var(
15020
+ --bm-sem-typo-compact-body-md,
15021
+ 400 1rem/1.25rem "Source Sans Pro"
15022
+ );
15023
+ --bm-comp-input-typo-lg: var(
14721
15024
  --bm-sem-typo-compact-body-md,
14722
15025
  400 1rem/1.25rem "Source Sans Pro"
14723
15026
  );
@@ -14729,8 +15032,12 @@ textarea:focus-visible,
14729
15032
  --bm-sem-typo-body-md,
14730
15033
  400 1rem/1.5rem "Source Sans Pro"
14731
15034
  );
14732
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
14733
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
15035
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
15036
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
15037
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
15038
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
15039
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
15040
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
14734
15041
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
14735
15042
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
14736
15043
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -14739,9 +15046,13 @@ textarea:focus-visible,
14739
15046
  --bm-primitive-dimension-12,
14740
15047
  0.125rem
14741
15048
  );
14742
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
15049
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
15050
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
15051
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
14743
15052
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
14744
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
15053
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
15054
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
15055
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
14745
15056
  --bm-comp-input-size-field-text-area-height: var(
14746
15057
  --bm-primitive-dimension-475,
14747
15058
  4.75rem
@@ -14886,7 +15197,15 @@ textarea:focus-visible,
14886
15197
  --bm-sem-color-surface-negative-strong,
14887
15198
  #f67378
14888
15199
  );
14889
- --bm-comp-input-typo-default: var(
15200
+ --bm-comp-input-typo-sm: var(
15201
+ --bm-sem-typo-compact-body-sm,
15202
+ 400 0.875rem/1rem "Source Sans Pro"
15203
+ );
15204
+ --bm-comp-input-typo-md: var(
15205
+ --bm-sem-typo-compact-body-md,
15206
+ 400 1rem/1.25rem "Source Sans Pro"
15207
+ );
15208
+ --bm-comp-input-typo-lg: var(
14890
15209
  --bm-sem-typo-compact-body-md,
14891
15210
  400 1rem/1.25rem "Source Sans Pro"
14892
15211
  );
@@ -14898,8 +15217,12 @@ textarea:focus-visible,
14898
15217
  --bm-sem-typo-body-md,
14899
15218
  400 1rem/1.5rem "Source Sans Pro"
14900
15219
  );
14901
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
14902
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
15220
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
15221
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
15222
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
15223
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
15224
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
15225
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
14903
15226
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
14904
15227
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
14905
15228
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -14908,9 +15231,13 @@ textarea:focus-visible,
14908
15231
  --bm-primitive-dimension-12,
14909
15232
  0.125rem
14910
15233
  );
14911
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
15234
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
15235
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
15236
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
14912
15237
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
14913
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
15238
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
15239
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
15240
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
14914
15241
  --bm-comp-input-size-field-text-area-height: var(
14915
15242
  --bm-primitive-dimension-475,
14916
15243
  4.75rem
@@ -15078,12 +15405,12 @@ textarea:focus-visible,
15078
15405
  border-radius: var(--bm-comp-input-radius-field);
15079
15406
  border-width: var(--bm-comp-input-border-width-field-default);
15080
15407
  color: var(--bm-comp-input-color-text);
15081
- font: var(--bm-comp-input-typo-default);
15408
+ font: var(--bm-comp-input-typo-md);
15082
15409
  cursor: var(--bm-text-field-input-cursor, text);
15083
15410
  box-shadow: var(--bm-comp-input-shadow-field);
15084
15411
  background-color: var(--bm-comp-input-color-bg);
15085
15412
  min-height: var(--bm-comp-input-size-field-text-area-height);
15086
- padding: var(--bm-comp-input-space-field-y) var(--bm-comp-input-space-field-x);
15413
+ padding: var(--bm-comp-input-space-field-y-md) var(--bm-comp-input-space-field-x-md);
15087
15414
  transform: translate3d(var(--bm-sem-space-0), var(--bm-sem-space-0), var(--bm-sem-space-0));
15088
15415
  }
15089
15416
  .bm-text-area__field .bm-text-area__input::-webkit-resizer {
@@ -15189,7 +15516,15 @@ textarea:focus-visible,
15189
15516
  --bm-sem-color-surface-negative-strong,
15190
15517
  #cc2429
15191
15518
  );
15192
- --bm-comp-input-typo-default: var(
15519
+ --bm-comp-input-typo-sm: var(
15520
+ --bm-sem-typo-compact-body-sm,
15521
+ 400 0.875rem/1rem "Source Sans Pro"
15522
+ );
15523
+ --bm-comp-input-typo-md: var(
15524
+ --bm-sem-typo-compact-body-md,
15525
+ 400 1rem/1.25rem "Source Sans Pro"
15526
+ );
15527
+ --bm-comp-input-typo-lg: var(
15193
15528
  --bm-sem-typo-compact-body-md,
15194
15529
  400 1rem/1.25rem "Source Sans Pro"
15195
15530
  );
@@ -15201,8 +15536,12 @@ textarea:focus-visible,
15201
15536
  --bm-sem-typo-body-md,
15202
15537
  400 1rem/1.5rem "Source Sans Pro"
15203
15538
  );
15204
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
15205
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
15539
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
15540
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
15541
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
15542
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
15543
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
15544
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
15206
15545
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
15207
15546
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
15208
15547
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -15211,9 +15550,13 @@ textarea:focus-visible,
15211
15550
  --bm-primitive-dimension-12,
15212
15551
  0.125rem
15213
15552
  );
15214
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
15553
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
15554
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
15555
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
15215
15556
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
15216
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
15557
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
15558
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
15559
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
15217
15560
  --bm-comp-input-size-field-text-area-height: var(
15218
15561
  --bm-primitive-dimension-475,
15219
15562
  4.75rem
@@ -15358,7 +15701,15 @@ textarea:focus-visible,
15358
15701
  --bm-sem-color-surface-negative-strong,
15359
15702
  #f67378
15360
15703
  );
15361
- --bm-comp-input-typo-default: var(
15704
+ --bm-comp-input-typo-sm: var(
15705
+ --bm-sem-typo-compact-body-sm,
15706
+ 400 0.875rem/1rem "Source Sans Pro"
15707
+ );
15708
+ --bm-comp-input-typo-md: var(
15709
+ --bm-sem-typo-compact-body-md,
15710
+ 400 1rem/1.25rem "Source Sans Pro"
15711
+ );
15712
+ --bm-comp-input-typo-lg: var(
15362
15713
  --bm-sem-typo-compact-body-md,
15363
15714
  400 1rem/1.25rem "Source Sans Pro"
15364
15715
  );
@@ -15370,8 +15721,12 @@ textarea:focus-visible,
15370
15721
  --bm-sem-typo-body-md,
15371
15722
  400 1rem/1.5rem "Source Sans Pro"
15372
15723
  );
15373
- --bm-comp-input-space-field-x: var(--bm-sem-space-100, 1rem);
15374
- --bm-comp-input-space-field-y: var(--bm-sem-space-50, 0.5rem);
15724
+ --bm-comp-input-space-field-x-sm: var(--bm-sem-space-75, 0.75rem);
15725
+ --bm-comp-input-space-field-x-md: var(--bm-sem-space-100, 1rem);
15726
+ --bm-comp-input-space-field-x-lg: var(--bm-sem-space-125, 1.25rem);
15727
+ --bm-comp-input-space-field-y-sm: var(--bm-sem-space-25, 0.25rem);
15728
+ --bm-comp-input-space-field-y-md: var(--bm-sem-space-50, 0.5rem);
15729
+ --bm-comp-input-space-field-y-lg: var(--bm-sem-space-75, 0.75rem);
15375
15730
  --bm-comp-input-space-field-gap: var(--bm-sem-space-50, 0.5rem);
15376
15731
  --bm-comp-input-space-choice-gap-inside: var(--bm-sem-space-50, 0.5rem);
15377
15732
  --bm-comp-input-space-choice-gap-items-y: var(--bm-sem-space-50, 0.5rem);
@@ -15380,9 +15735,13 @@ textarea:focus-visible,
15380
15735
  --bm-primitive-dimension-12,
15381
15736
  0.125rem
15382
15737
  );
15383
- --bm-comp-input-size-field-md-height: var(--bm-sem-size-height-md, 2.5rem);
15738
+ --bm-comp-input-size-field-height-sm: var(--bm-sem-size-height-sm, 2rem);
15739
+ --bm-comp-input-size-field-height-md: var(--bm-sem-size-height-md, 2.5rem);
15740
+ --bm-comp-input-size-field-height-lg: var(--bm-sem-size-height-lg, 3rem);
15384
15741
  --bm-comp-input-size-field-width: var(--bm-primitive-dimension-1800, 18rem);
15385
- --bm-comp-input-size-field-icon: var(--bm-sem-size-icon-md, 1.25rem);
15742
+ --bm-comp-input-size-field-icon-sm: var(--bm-sem-size-icon-sm, 1rem);
15743
+ --bm-comp-input-size-field-icon-md: var(--bm-sem-size-icon-md, 1.25rem);
15744
+ --bm-comp-input-size-field-icon-lg: var(--bm-sem-size-icon-md, 1.25rem);
15386
15745
  --bm-comp-input-size-field-text-area-height: var(
15387
15746
  --bm-primitive-dimension-475,
15388
15747
  4.75rem
@@ -15449,25 +15808,25 @@ textarea:focus-visible,
15449
15808
  --bm-text-field-input-cursor: not-allowed;
15450
15809
  }
15451
15810
  .bm-text-field--sm .bm-text-field__field {
15452
- --bm-input-field-height: var(--bm-sem-size-height-sm);
15453
- --bm-input-field-padding-y: var(--bm-sem-space-25);
15454
- --bm-input-field-padding-x: var(--bm-sem-space-75);
15455
- --bm-input-field-font: var(--bm-sem-typo-compact-body-sm);
15456
- --bm-input-field-icon-size: var(--bm-sem-size-icon-sm);
15811
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-sm);
15812
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-sm);
15813
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-sm);
15814
+ --bm-input-field-font: var(--bm-comp-input-typo-sm);
15815
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-sm);
15457
15816
  }
15458
15817
  .bm-text-field--md .bm-text-field__field {
15459
- --bm-input-field-height: var(--bm-comp-input-size-field-md-height);
15460
- --bm-input-field-padding-y: var(--bm-comp-input-space-field-y);
15461
- --bm-input-field-padding-x: var(--bm-comp-input-space-field-x);
15462
- --bm-input-field-font: var(--bm-comp-input-typo-default);
15463
- --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon);
15818
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-md);
15819
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-md);
15820
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-md);
15821
+ --bm-input-field-font: var(--bm-comp-input-typo-md);
15822
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-md);
15464
15823
  }
15465
15824
  .bm-text-field--lg .bm-text-field__field {
15466
- --bm-input-field-height: var(--bm-sem-size-height-lg);
15467
- --bm-input-field-padding-y: var(--bm-sem-space-75);
15468
- --bm-input-field-padding-x: var(--bm-sem-space-125);
15469
- --bm-input-field-font: var(--bm-comp-input-typo-default);
15470
- --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon);
15825
+ --bm-input-field-height: var(--bm-comp-input-size-field-height-lg);
15826
+ --bm-input-field-padding-y: var(--bm-comp-input-space-field-y-lg);
15827
+ --bm-input-field-padding-x: var(--bm-comp-input-space-field-x-lg);
15828
+ --bm-input-field-font: var(--bm-comp-input-typo-lg);
15829
+ --bm-input-field-icon-size: var(--bm-comp-input-size-field-icon-lg);
15471
15830
  }
15472
15831
  .bm-text-field--error .bm-text-field__field {
15473
15832
  border-color: var(--bm-comp-input-color-border-error);
@@ -15566,8 +15925,7 @@ textarea:focus-visible,
15566
15925
  .bm-text-field__field .bm-text-field__content svg,
15567
15926
  .bm-text-field__field .bm-text-field__content ::slotted([slot*=content]) {
15568
15927
  color: var(--bm-comp-input-color-icon);
15569
- width: var(--bm-comp-input-size-field-icon);
15570
- height: var(--bm-comp-input-size-field-icon);
15928
+ height: var(--bm-primitive-dimension-100);
15571
15929
  }
15572
15930
  .bm-text-field__field .bm-text-field__content .bm-icon {
15573
15931
  width: var(--bm-input-field-icon-size);