@lolmath/ui 7.0.0 → 8.1.0

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 (9) hide show
  1. package/dist/es/index.css +140 -144
  2. package/dist/es/index.d.ts +61 -23
  3. package/dist/es/index.js +251 -340
  4. package/dist/es/index.js.map +1 -1
  5. package/dist/lib/index.cjs +237 -323
  6. package/dist/lib/index.cjs.map +1 -1
  7. package/dist/lib/index.css +140 -144
  8. package/dist/lib/index.d.cts +61 -23
  9. package/package.json +15 -15
package/dist/es/index.css CHANGED
@@ -859,133 +859,89 @@
859
859
  }
860
860
  }
861
861
 
862
- /* src/components/typography/text.module.css?css_virtual&hash=9962e */
863
- @layer lol {
864
- .text_63391 {
865
- font-family: var(--lol-font-family-spiegel);
866
- }
867
- .label_63391 {
868
- font-size: var(--lol-font-size-label);
869
- line-height: var(--lol-line-height-label);
870
- letter-spacing: var(--lol-letter-spacing-label);
871
- font-weight: var(--lol-font-weight-label);
872
- }
873
- .stat_63391 {
874
- font-size: var(--lol-font-size-stat);
875
- line-height: var(--lol-line-height-stat);
876
- letter-spacing: var(--lol-letter-spacing-stat);
877
- font-weight: var(--lol-font-weight-stat);
878
- }
879
- .largeNumber_63391 {
880
- font-size: var(--lol-font-size-large-number);
881
- line-height: var(--lol-line-height-large-number);
882
- letter-spacing: var(--lol-letter-spacing-large-number);
883
- font-weight: var(--lol-font-weight-large-number);
884
- }
885
- .sm_63391 {
886
- font-size: var(--lol-font-size-sm);
887
- line-height: var(--lol-line-height-sm);
888
- letter-spacing: var(--lol-letter-spacing-sm);
889
- font-weight: var(--lol-font-weight-sm);
890
- }
891
- .base_63391 {
892
- font-size: var(--lol-font-size-base);
893
- line-height: var(--lol-line-height-base);
894
- letter-spacing: var(--lol-letter-spacing-base);
895
- font-weight: var(--lol-font-weight-base);
896
- }
897
- .md_63391 {
898
- font-size: var(--lol-font-size-md);
899
- line-height: var(--lol-line-height-md);
900
- letter-spacing: var(--lol-letter-spacing-md);
901
- font-weight: var(--lol-font-weight-md);
902
- }
903
- .lg_63391 {
904
- font-size: var(--lol-font-size-lg);
905
- line-height: var(--lol-line-height-lg);
906
- letter-spacing: var(--lol-letter-spacing-lg);
907
- font-weight: var(--lol-font-weight-lg);
908
- }
909
- .grey100_63391 {
910
- color: var(--lol-color-grey-100);
911
- }
912
- .grey150_63391 {
913
- color: var(--lol-color-grey-150);
914
- }
915
- .gold100_63391 {
916
- color: var(--lol-color-gold-100);
917
- }
918
- }
919
-
920
- /* src/components/select/multiple-select.module.css?css_virtual&hash=0014c */
921
- .multiSelect_e6fde {
922
- position: relative;
923
- padding: 0.25rem 0.25rem;
862
+ /* src/components/tag-group/tag-group.module.css?css_virtual&hash=028e0 */
863
+ .tag_c2881 {
864
+ background: var(--lol-multiple-select-background-gradient) padding-box, var(--lol-multiple-select-border-gradient) border-box;
865
+ border: 2px solid transparent;
866
+ border-radius: 9999px;
867
+ align-items: center;
924
868
  display: grid;
925
869
  grid-template-columns: 1fr auto;
926
- align-items: center;
927
- border: 1px solid transparent;
928
- background: var(--lol-select-background-gradient) padding-box, var(--lol-select-border-gradient) border-box;
929
- --lol-select-border-gradient: var(--lol-gradient-gold);
930
- --lol-select-background-gradient: var(--lol-gradient-hextech-black);
931
- }
932
- .multiSelect_e6fde.focusWithin_e6fde {
933
- --lol-select-background-gradient: var(--lol-gradient-grey-300);
934
- --lol-select-border-gradient: var(--lol-gradient-gold-press);
935
- --lol-select-border-gradient: var(--lol-gradient-gold-hover);
936
- }
937
- .multiSelect_e6fde.disabled_e6fde {
938
- --lol-select-border-gradient: var(--lol-gradient-disabled);
870
+ font-family: var(--lol-font-family-spiegel);
871
+ letter-spacing: var(--lol-letter-spacing-sm);
872
+ font-weight: var(--lol-font-weight-sm);
873
+ font-size: 0.75rem;
874
+ line-height: 1;
875
+ color: var(--lol-color-gold-300);
876
+ padding: 0 0.3rem 0 0.5rem;
939
877
  }
940
- .multiSelect_e6fde.small_e6fde {
941
- min-height: var(--lol-form-height-small);
878
+ .gold_c2881 {
879
+ border-width: 1px;
880
+ --lol-multiple-select-border-gradient: var(--lol-gradient-gold);
881
+ --lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);
882
+ color: var(--lol-color-gold-300);
942
883
  }
943
- .multiSelect_e6fde.medium_e6fde {
944
- min-height: var(--lol-form-height-medium);
884
+ .hextech_c2881 {
885
+ border-width: 1px;
886
+ --lol-multiple-select-border-gradient: var(--lol-gradient-hextech);
887
+ --lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);
888
+ color: var(--lol-color-blue-100);
945
889
  }
946
- .multiSelect_e6fde.large_e6fde {
947
- min-height: var(--lol-form-height-large);
890
+ .grey_c2881 {
891
+ border-width: 1px;
892
+ --lol-multiple-select-border-gradient: var(--lol-color-grey-100);
893
+ --lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);
894
+ color: var(--lol-color-gold-100);
948
895
  }
949
- .tagsAndInput_e6fde {
950
- display: flex;
951
- flex-wrap: wrap;
896
+ .text_c2881 {
897
+ padding: 0.25rem 0;
952
898
  }
953
- .chevronButton_e6fde {
954
- display: flex;
955
- justify-content: center;
956
- align-items: center;
957
- width: 2rem;
899
+ .remove_c2881 {
900
+ mask: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAACKklEQVR42uzcvUoDQRQF4M0QBW0srHwICxttIygGRH0PsRAfwELsI/gkghYiiGATQVDwIawsUmihRbzjDyyLm2Qnc+eejefC6Taw+zGz88NkG/1+P2OVlyMBgQhEIAIRiEAEIhCLQAQiEIHQqhn6w97zU60edG5hEaoFNdjFymtecitpJXyOFckuVBcbgHMlWZJcSDYlNwlwLn0vkkxLTlBbUB7H1+wPUisRjq+OZB8RqIiTJUAq4mQaSE4RRxOpDCc6UgygswE4GkjDcPJIewhAh5K3Ea6LgTQqztdUTXKPAHQt2UqAVBWnLemivKS1kUxwYg/zWkhmOBoz6dhIpjhaS41YSOY4movVcZEgcDSBxkGCwdEGCkWCwUkBFIIEg5MKqCoSDE5KoFhISXFSA42LlBzHAigUyQTHCsjXq+SjwvVTkhmLG7UAqjLPyY9u55LVSQcKwTFFcjXBMUNyNcIxQXJgOL0KM+4kSA4Mp11xWaKO5MBwugFrN1UkB4YTusBVQ3KAOFBIDhQHBskB40AgOXAccyRXAxxTpBhAy1m6bdKqSMcIQKeSg4T7OaMiPUq2Ud5BnQFIGptdw5AeJGuSF6RR7C8kj7OR6ewEliF5nPUYOBrzoDzSL86d4nKmiBQVx1dT4aY90nv2fXhJE6eIdCTZiYnjqxH6v3nAk/b+8Hrpw6CdtLcolS8kNPjlhf/TgghEIAIRiEAEYhGIQAQiEIEINCH1KcAAQX7SgLqjwvQAAAAASUVORK5CYII=);
901
+ height: 1rem;
902
+ aspect-ratio: 1;
903
+ background-color: currentColor;
904
+ mask-size: contain;
958
905
  }
959
- .input_e6fde {
960
- flex: 1 1;
961
- padding-left: 0.5rem;
962
- box-shadow: none;
963
- border: none;
964
- background-color: transparent;
906
+ .remove_c2881[data-hovered] {
907
+ background-color: var(--lol-color-gold-100);
965
908
  }
966
- .input_e6fde:focus {
967
- outline: none;
909
+ .remove_c2881[data-pressed] {
910
+ background-color: var(--lol-color-grey-150);
968
911
  }
969
- .comboBox_e6fde {
912
+ .tagGroup_c2881 {
913
+ padding: 0.25rem;
970
914
  display: flex;
971
- flex: 1 1;
915
+ justify-content: center;
972
916
  }
973
- .tagList_e6fde {
917
+ .tagList_c2881 {
974
918
  display: flex;
975
919
  flex-wrap: wrap;
976
920
  gap: 0.25rem;
977
921
  row-gap: 0.25rem;
978
922
  }
979
- .emptyText_e6fde {
980
- padding: 0.5rem;
923
+
924
+ /* src/components/select/multiple-select.module.css?css_virtual&hash=d2a09 */
925
+ .popover_e6fde {
926
+ width: 250px;
927
+ display: flex;
928
+ flex-direction: column;
929
+ }
930
+ .select_e6fde {
931
+ border-right: none;
932
+ display: flex;
933
+ align-items: center;
934
+ }
935
+ .triggerContainer_e6fde {
936
+ display: inline-flex;
981
937
  }
982
938
 
983
- /* src/components/select/select.module.css?css_virtual&hash=c6dc3 */
939
+ /* src/components/select/select.module.css?css_virtual&hash=96c1d */
984
940
  @layer lol {
985
941
  .button_560be {
986
942
  font-family: var(--lol-font-family-spiegel);
987
943
  display: inline-block;
988
- width: 200px;
944
+ min-width: 200px;
989
945
  outline: none;
990
946
  border: 1px solid transparent;
991
947
  color: var(--lol-color-grey-100);
@@ -995,13 +951,9 @@
995
951
  line-height: 1rem;
996
952
  letter-spacing: 0.025em;
997
953
  text-align: left;
998
- background:
999
- var(--lol-select-image) no-repeat right 0.5rem center,
1000
- var(--lol-select-background-gradient) padding-box,
1001
- var(--lol-select-border-gradient) border-box;
954
+ --lol-select-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAASCAYAAACAa1QyAAAAiUlEQVR42mL8//8/A6mAiYEMQJYmFnSBk6vzYcwmIP4LxI0gjnnoRNyaoKAViKuQ+I14bQKCTiAuA+I6IGYG4gZ0jSw4nFwB1QwDjIRsKkbjNwxckFNNUw8QlyLx66EYb0D8A+IuIGaDyjcQE0+gOPoDxC1I8dNASBMDNDX8hWKMIGcc3FkDIMAA1n8bpHnZDOAAAAAASUVORK5CYII=);
1002
955
  --lol-select-border-gradient: var(--lol-gradient-gold);
1003
956
  --lol-select-background-gradient: var(--lol-gradient-hextech-black);
1004
- --lol-select-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAASCAYAAACAa1QyAAAAiUlEQVR42mL8//8/A6mAiYEMQJYmFnSBk6vzYcwmIP4LxI0gjnnoRNyaoKAViKuQ+I14bQKCTiAuA+I6IGYG4gZ0jSw4nFwB1QwDjIRsKkbjNwxckFNNUw8QlyLx66EYb0D8A+IuIGaDyjcQE0+gOPoDxC1I8dNASBMDNDX8hWKMIGcc3FkDIMAA1n8bpHnZDOAAAAAASUVORK5CYII=);
1005
957
  }
1006
958
  .button_560be[data-open] {
1007
959
  --lol-select-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAASCAYAAACAa1QyAAAA90lEQVR42mL8//8/A6mAiYEMwILVJG4RNiAlDcQgZzz79/XNL2R5RnTnATWwAyn5BEfBaqDUv4UH3rcD+Q+QNaJoAmrgAFJyiY6CdWL8LNEgsRcf/ixA14juJ6kkJ8FGkIbn7//MB2pYKCHAkhDvIFgJksPlJ0ZGRgbmp+9+z1py6EMvSACoASyO009A53FCTfwNCgCoS2A2wAOEcWDiCcl5v6DOY8bmPBYsodf28/f/90sPf+iDBgQo5BiAwd4ICnZcKeKfjDBrepy9IAsoJEFBDgp6fKGHLXIXAm1pQ45cfMmoBpqM2vAmIzSNUkQnWJrFE0CAAQCQxYvehN8YFAAAAABJRU5ErkJggg==);
@@ -1028,6 +980,15 @@
1028
980
  .button_560be.large_560be {
1029
981
  min-height: var(--lol-form-height-large);
1030
982
  }
983
+ .singleSelect_560be {
984
+ background:
985
+ var(--lol-select-image) no-repeat right 0.5rem center,
986
+ var(--lol-select-background-gradient) padding-box,
987
+ var(--lol-select-border-gradient) border-box;
988
+ }
989
+ .multiSelect_560be {
990
+ background: var(--lol-select-background-gradient) padding-box, var(--lol-select-border-gradient) border-box;
991
+ }
1031
992
  .listBox_560be {
1032
993
  background-color: var(--lol-color-hextech-black);
1033
994
  border: 1px solid var(--lol-color-gold-600);
@@ -1064,6 +1025,68 @@
1064
1025
  display: flex;
1065
1026
  flex-direction: column;
1066
1027
  }
1028
+ .emptyList_560be {
1029
+ padding: 0.5rem 0.25rem;
1030
+ text-align: center;
1031
+ }
1032
+ }
1033
+
1034
+ /* src/components/typography/text.module.css?css_virtual&hash=9962e */
1035
+ @layer lol {
1036
+ .text_63391 {
1037
+ font-family: var(--lol-font-family-spiegel);
1038
+ }
1039
+ .label_63391 {
1040
+ font-size: var(--lol-font-size-label);
1041
+ line-height: var(--lol-line-height-label);
1042
+ letter-spacing: var(--lol-letter-spacing-label);
1043
+ font-weight: var(--lol-font-weight-label);
1044
+ }
1045
+ .stat_63391 {
1046
+ font-size: var(--lol-font-size-stat);
1047
+ line-height: var(--lol-line-height-stat);
1048
+ letter-spacing: var(--lol-letter-spacing-stat);
1049
+ font-weight: var(--lol-font-weight-stat);
1050
+ }
1051
+ .largeNumber_63391 {
1052
+ font-size: var(--lol-font-size-large-number);
1053
+ line-height: var(--lol-line-height-large-number);
1054
+ letter-spacing: var(--lol-letter-spacing-large-number);
1055
+ font-weight: var(--lol-font-weight-large-number);
1056
+ }
1057
+ .sm_63391 {
1058
+ font-size: var(--lol-font-size-sm);
1059
+ line-height: var(--lol-line-height-sm);
1060
+ letter-spacing: var(--lol-letter-spacing-sm);
1061
+ font-weight: var(--lol-font-weight-sm);
1062
+ }
1063
+ .base_63391 {
1064
+ font-size: var(--lol-font-size-base);
1065
+ line-height: var(--lol-line-height-base);
1066
+ letter-spacing: var(--lol-letter-spacing-base);
1067
+ font-weight: var(--lol-font-weight-base);
1068
+ }
1069
+ .md_63391 {
1070
+ font-size: var(--lol-font-size-md);
1071
+ line-height: var(--lol-line-height-md);
1072
+ letter-spacing: var(--lol-letter-spacing-md);
1073
+ font-weight: var(--lol-font-weight-md);
1074
+ }
1075
+ .lg_63391 {
1076
+ font-size: var(--lol-font-size-lg);
1077
+ line-height: var(--lol-line-height-lg);
1078
+ letter-spacing: var(--lol-letter-spacing-lg);
1079
+ font-weight: var(--lol-font-weight-lg);
1080
+ }
1081
+ .grey100_63391 {
1082
+ color: var(--lol-color-grey-100);
1083
+ }
1084
+ .grey150_63391 {
1085
+ color: var(--lol-color-grey-150);
1086
+ }
1087
+ .gold100_63391 {
1088
+ color: var(--lol-color-gold-100);
1089
+ }
1067
1090
  }
1068
1091
 
1069
1092
  /* src/components/slider/slider.module.css?css_virtual&hash=54b45 */
@@ -1277,7 +1300,7 @@
1277
1300
  }
1278
1301
  }
1279
1302
 
1280
- /* src/components/tabs.module.css?css_virtual&hash=eec5f */
1303
+ /* src/components/tabs.module.css?css_virtual&hash=cf0cd */
1281
1304
  @layer lol {
1282
1305
  .list_c42a1 {
1283
1306
  margin-left: -1rem;
@@ -1321,41 +1344,14 @@
1321
1344
  height: 1px;
1322
1345
  width: 100%;
1323
1346
  background: linear-gradient(to right, transparent, var(--lol-color-gold-200), transparent);
1347
+ transition-property: translate, width;
1348
+ transition-duration: 200ms;
1349
+ }
1350
+ @media (prefers-reduced-motion: reduce) {
1351
+ .indicator_c42a1 {
1352
+ transition: none;
1353
+ }
1324
1354
  }
1325
- }
1326
-
1327
- /* src/components/tag/tag.module.css?css_virtual&hash=c0ee1 */
1328
- .tag_c7c88 {
1329
- background: var(--lol-multiple-select-background-gradient) padding-box, var(--lol-multiple-select-border-gradient) border-box;
1330
- --lol-multiple-select-border-gradient: var(--lol-gradient-gold);
1331
- --lol-multiple-select-background-gradient: linear-gradient( to top, var(--lol-color-gold-600), var(--lol-color-gold-600), var(--lol-color-gold-700) );
1332
- border: 2px solid transparent;
1333
- align-items: center;
1334
- display: grid;
1335
- grid-template-columns: 1fr auto;
1336
- font-family: var(--lol-font-family-spiegel);
1337
- letter-spacing: var(--lol-letter-spacing-sm);
1338
- font-weight: var(--lol-font-weight-sm);
1339
- font-size: 0.75rem;
1340
- line-height: 1;
1341
- color: var(--lol-color-gold-300);
1342
- padding: 0 0.125rem 0 0.25rem;
1343
- }
1344
- .text_c7c88 {
1345
- padding: 0.25rem 0;
1346
- }
1347
- .remove_c7c88 {
1348
- mask: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAACKklEQVR42uzcvUoDQRQF4M0QBW0srHwICxttIygGRH0PsRAfwELsI/gkghYiiGATQVDwIawsUmihRbzjDyyLm2Qnc+eejefC6Taw+zGz88NkG/1+P2OVlyMBgQhEIAIRiEAEIhCLQAQiEIHQqhn6w97zU60edG5hEaoFNdjFymtecitpJXyOFckuVBcbgHMlWZJcSDYlNwlwLn0vkkxLTlBbUB7H1+wPUisRjq+OZB8RqIiTJUAq4mQaSE4RRxOpDCc6UgygswE4GkjDcPJIewhAh5K3Ea6LgTQqztdUTXKPAHQt2UqAVBWnLemivKS1kUxwYg/zWkhmOBoz6dhIpjhaS41YSOY4movVcZEgcDSBxkGCwdEGCkWCwUkBFIIEg5MKqCoSDE5KoFhISXFSA42LlBzHAigUyQTHCsjXq+SjwvVTkhmLG7UAqjLPyY9u55LVSQcKwTFFcjXBMUNyNcIxQXJgOL0KM+4kSA4Mp11xWaKO5MBwugFrN1UkB4YTusBVQ3KAOFBIDhQHBskB40AgOXAccyRXAxxTpBhAy1m6bdKqSMcIQKeSg4T7OaMiPUq2Ud5BnQFIGptdw5AeJGuSF6RR7C8kj7OR6ewEliF5nPUYOBrzoDzSL86d4nKmiBQVx1dT4aY90nv2fXhJE6eIdCTZiYnjqxH6v3nAk/b+8Hrpw6CdtLcolS8kNPjlhf/TgghEIAIRiEAEYhGIQAQiEIEINCH1KcAAQX7SgLqjwvQAAAAASUVORK5CYII=);
1349
- height: 1rem;
1350
- aspect-ratio: 1;
1351
- background-color: currentColor;
1352
- mask-size: contain;
1353
- }
1354
- .remove_c7c88[data-hovered] {
1355
- background-color: var(--lol-color-gold-100);
1356
- }
1357
- .remove_c7c88[data-pressed] {
1358
- background-color: var(--lol-color-grey-150);
1359
1355
  }
1360
1356
 
1361
1357
  /* src/components/text-field.module.css?css_virtual&hash=0b7dc */
package/dist/es/index.d.ts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react_aria_components from 'react-aria-components';
2
- import { BreadcrumbsProps, BreadcrumbProps, ButtonProps as ButtonProps$1, LinkProps, CheckboxProps, DisclosureProps, DisclosurePanelProps, MenuTrigger as MenuTrigger$1, MenuProps, MenuItemProps, PopoverProps, MenuSectionProps, Header, SeparatorProps, VirtualizerProps, HeadingProps as HeadingProps$1, ModalOverlayProps, DialogProps, NumberFieldProps, Input, Group, ProgressBarProps as ProgressBarProps$1, RadioGroupProps, RadioProps, SearchFieldProps, ComboBoxProps, InputProps, ListBoxProps, ListBoxItemProps, SliderProps, SliderTrackProps, SliderThumbProps, SliderTrackRenderProps, SliderOutputProps, SwitchProps, TabListProps, TabProps, TabPanelProps, TagProps, TextFieldProps, TextAreaProps, ToggleButtonProps as ToggleButtonProps$1, TextProps as TextProps$1, LabelProps as LabelProps$1 } from 'react-aria-components';
2
+ import { BreadcrumbsProps, BreadcrumbProps, ButtonProps as ButtonProps$1, LinkProps, CheckboxProps, DisclosureProps, DisclosurePanelProps, MenuTrigger as MenuTrigger$1, MenuProps, MenuItemProps, PopoverProps, MenuSectionProps, Header, SeparatorProps, VirtualizerProps, HeadingProps as HeadingProps$1, ModalOverlayProps, DialogProps, NumberFieldProps, Input, Group, ProgressBarProps as ProgressBarProps$1, RadioGroupProps, RadioProps, SearchFieldProps, SelectProps, Key, ListBoxProps, ListBoxItemProps, SliderProps, SliderTrackProps, SliderThumbProps, SliderTrackRenderProps, SliderOutputProps, SwitchProps, TabListProps, TabProps, TabPanelProps, TagProps as TagProps$1, TagGroupProps as TagGroupProps$1, TagListProps as TagListProps$1, TextFieldProps, TextAreaProps, InputProps, ToggleButtonProps as ToggleButtonProps$1, TextProps as TextProps$1, LabelProps as LabelProps$1 } from 'react-aria-components';
3
3
  export { Autocomplete, Collection, Dialog, DialogTrigger, FieldError, GridLayout, Key, ListBoxItem, ListLayout, MenuItemProps, MenuProps, RouterProvider, Select, SelectValue, Selection, Size, TableLayout, Popover as UnstyledPopover, Virtualizer, WaterfallLayout, useFilter } from 'react-aria-components';
4
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
5
+ import * as cva from 'cva';
5
6
  import * as react from 'react';
6
7
  import react__default, { Ref, ComponentProps, JSX } from 'react';
7
- import * as cva from 'cva';
8
- import { Key } from 'react-aria';
9
8
  import { ExternalToast as ExternalToast$1, ToasterProps } from 'sonner';
10
9
 
11
10
  declare function Breadcrumbs<T extends object>({ className, ...props }: BreadcrumbsProps<T>): react_jsx_runtime.JSX.Element;
@@ -34,8 +33,9 @@ declare const button: (props?: ({
34
33
  class?: never;
35
34
  className?: cva.ClassValue;
36
35
  })) | undefined) => string;
37
- declare function _Button({ children, className, preset, shape, size, thin, ...props }: ButtonProps, ref: Ref<HTMLButtonElement>): react_jsx_runtime.JSX.Element;
38
- declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
36
+ declare function Button({ children, className, preset, shape, size, thin, ref, ...props }: ButtonProps & {
37
+ ref?: Ref<HTMLButtonElement>;
38
+ }): react_jsx_runtime.JSX.Element;
39
39
 
40
40
  interface ButtonLinkProps extends LinkProps {
41
41
  preset?: ButtonPreset;
@@ -43,8 +43,9 @@ interface ButtonLinkProps extends LinkProps {
43
43
  shape?: ButtonShape;
44
44
  size?: ButtonSize;
45
45
  }
46
- declare function _ButtonLink({ children, className, preset, shape, size, thin, ...props }: ButtonLinkProps, ref: Ref<HTMLAnchorElement>): react_jsx_runtime.JSX.Element;
47
- declare const ButtonLink: react.ForwardRefExoticComponent<ButtonLinkProps & react.RefAttributes<HTMLAnchorElement>>;
46
+ declare function ButtonLink({ children, className, preset, shape, size, ref, thin, ...props }: ButtonLinkProps & {
47
+ ref?: Ref<HTMLAnchorElement>;
48
+ }): react_jsx_runtime.JSX.Element;
48
49
 
49
50
  declare function Checkbox({ children, className, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
50
51
 
@@ -105,28 +106,35 @@ declare function SearchField({ inputProps, borderProps, children, className, siz
105
106
  size?: "small" | "medium" | "large";
106
107
  }): react_jsx_runtime.JSX.Element;
107
108
 
108
- interface SelectedKey {
109
- id: Key;
110
- name: string;
111
- }
112
- interface MultipleSelectProps<T extends SelectedKey> extends Omit<ComboBoxProps<T>, "children" | "validate" | "allowsEmptyCollection" | "selectedKey" | "inputValue" | "className" | "value" | "onSelectionChange" | "onInputChange"> {
109
+ interface MultipleSelectProps<T extends object = {}> extends Omit<SelectProps<T, "multiple">, "children" | "className" | "validationBehavior" | "selectionMode"> {
113
110
  items: Array<T>;
114
- selectedItems: Array<T>;
115
111
  className?: string;
116
- onChange?: (items: Array<T>) => void;
117
- renderEmptyState?: (inputValue: string) => react__default.ReactNode;
118
- tag: (item: T) => react__default.ReactNode;
119
- children: react__default.ReactNode | ((item: T) => react__default.ReactNode);
120
- inputProps?: InputProps;
121
112
  size?: "small" | "medium" | "large";
113
+ emptyTags?: react__default.ReactNode;
114
+ emptyList?: react__default.ReactNode;
115
+ tagGroupLabel?: string;
116
+ selectId: (item: T) => Key;
117
+ selectLabel: (item: T) => string;
122
118
  }
123
- declare function MultipleSelect<T extends SelectedKey>({ children, items, selectedItems, onChange, className, name, renderEmptyState, size, ...props }: MultipleSelectProps<T>): react_jsx_runtime.JSX.Element;
119
+ declare function MultipleSelect<T extends object = {}>({ items, className, size, emptyList, emptyTags, tagGroupLabel, selectId, selectLabel, ...selectProps }: MultipleSelectProps<T>): react_jsx_runtime.JSX.Element;
124
120
 
121
+ declare const select: (props?: ({
122
+ size?: "small" | "medium" | "large" | undefined;
123
+ selectionMode?: "multiple" | "single" | undefined;
124
+ } & ({
125
+ class?: cva.ClassValue;
126
+ className?: never;
127
+ } | {
128
+ class?: never;
129
+ className?: cva.ClassValue;
130
+ })) | undefined) => string;
125
131
  declare function SelectButton({ className, size, ...props }: ButtonProps$1 & {
126
132
  size?: "small" | "medium" | "large";
127
133
  }): react_jsx_runtime.JSX.Element;
128
134
  declare function SelectPopover({ className, ...props }: PopoverProps): react_jsx_runtime.JSX.Element;
129
- declare function SelectListBox<T extends object>({ className, ...props }: ListBoxProps<T>): react_jsx_runtime.JSX.Element;
135
+ declare function SelectListBox<T extends object>({ className, emptyList, ...props }: ListBoxProps<T> & {
136
+ emptyList?: React.ReactNode;
137
+ }): react_jsx_runtime.JSX.Element;
130
138
  declare function SelectListBoxItem({ className, ...props }: ListBoxItemProps): react_jsx_runtime.JSX.Element;
131
139
  declare function SelectVirtualizer<T>(props: Omit<VirtualizerProps<T>, "layout" | "layoutOptions">): react_jsx_runtime.JSX.Element;
132
140
 
@@ -251,7 +259,37 @@ declare function TabList<T extends object>({ className, ...rest }: TabListProps<
251
259
  declare function Tab({ children, className, ...rest }: TabProps): react_jsx_runtime.JSX.Element;
252
260
  declare function TabPanel({ ...rest }: TabPanelProps): react_jsx_runtime.JSX.Element;
253
261
 
254
- declare function Tag({ children, className, ...props }: TagProps): react_jsx_runtime.JSX.Element;
262
+ interface TagProps extends TagProps$1 {
263
+ variant?: "gold" | "hextech" | "grey";
264
+ }
265
+ declare function Tag({ children, className, variant, ...props }: TagProps): react_jsx_runtime.JSX.Element;
266
+ declare const tagGroup: (props?: ({
267
+ class?: cva.ClassValue;
268
+ className?: never;
269
+ } | {
270
+ class?: never;
271
+ className?: cva.ClassValue;
272
+ }) | undefined) => string;
273
+ interface TagGroupProps extends TagGroupProps$1 {
274
+ }
275
+ declare function TagGroup({ children, className, ...props }: TagGroupProps): react_jsx_runtime.JSX.Element;
276
+ declare const tagList: (props?: ({
277
+ class?: cva.ClassValue;
278
+ className?: never;
279
+ } | {
280
+ class?: never;
281
+ className?: cva.ClassValue;
282
+ }) | undefined) => string;
283
+ interface TagListProps<T extends object = {}> extends TagListProps$1<T> {
284
+ children?: React.ReactNode;
285
+ className?: string;
286
+ selectLabel: (item: T) => string;
287
+ variant?: TagProps["variant"];
288
+ }
289
+ declare function TagList<T extends object>({ children, className, selectLabel, variant, ...props }: TagListProps<T> & {
290
+ selectLabel: (item: T) => string;
291
+ variant?: TagProps["variant"];
292
+ }): react_jsx_runtime.JSX.Element;
255
293
 
256
294
  declare function TextArea({ textAreaProps, children, ...props }: TextFieldProps & {
257
295
  textAreaProps?: TextAreaProps;
@@ -306,7 +344,7 @@ type TextElement = "p" | "span" | "div";
306
344
  type TextPreset = "sm" | "base" | "md" | "lg" | "largeNumber" | "stat";
307
345
  declare const text: (props?: ({
308
346
  color?: "gold100" | "grey100" | "grey150" | undefined;
309
- preset?: "base" | "label" | "sm" | "md" | "lg" | "largeNumber" | "stat" | undefined;
347
+ preset?: "label" | "base" | "sm" | "md" | "lg" | "largeNumber" | "stat" | undefined;
310
348
  } & ({
311
349
  class?: cva.ClassValue;
312
350
  className?: never;
@@ -325,4 +363,4 @@ interface LabelProps extends LabelProps$1 {
325
363
  }
326
364
  declare function Label({ preset, color, className, ...rest }: LabelProps): JSX.Element;
327
365
 
328
- export { Breadcrumb, Breadcrumbs, Button, ButtonLink, type ButtonPreset, type ButtonShape, type ButtonSize, Checkbox, DialogButtons, DialogHeading, Disclosure, DisclosureButton, DisclosureGroup, DisclosurePanel, Divider, Heading, type HeadingColor, type HeadingElement, Label, Menu, MenuHeader, MenuItem, MenuPopover, MenuSection, MenuSeparator, MenuTrigger, MenuVirtualizer, Modal, MultipleSelect, NumberField, Popover, ProgressBar, Radio, RadioGroup, SearchField, SelectButton, SelectListBox, SelectListBoxItem, SelectPopover, SelectVirtualizer, type SelectedKey, Slider, SliderOutput, Sonner, type SonnerProps, Spinner, SubmenuTrigger, Switch, Tab, TabList, TabPanel, Tabs, Tag, Text, TextArea, type TextColor, type TextElement, TextField, type TextPreset, type ToastVariant, ToggleButton, type ToggleButtonPreset, _Button, _ButtonLink, button, heading, sonner, text, textField };
366
+ export { Breadcrumb, Breadcrumbs, Button, ButtonLink, type ButtonPreset, type ButtonShape, type ButtonSize, Checkbox, DialogButtons, DialogHeading, Disclosure, DisclosureButton, DisclosureGroup, DisclosurePanel, Divider, Heading, type HeadingColor, type HeadingElement, Label, Menu, MenuHeader, MenuItem, MenuPopover, MenuSection, MenuSeparator, MenuTrigger, MenuVirtualizer, Modal, MultipleSelect, type MultipleSelectProps, NumberField, Popover, ProgressBar, Radio, RadioGroup, SearchField, SelectButton, SelectListBox, SelectListBoxItem, SelectPopover, SelectVirtualizer, Slider, SliderOutput, Sonner, type SonnerProps, Spinner, SubmenuTrigger, Switch, Tab, TabList, TabPanel, Tabs, Tag, TagGroup, type TagGroupProps, TagList, type TagListProps, type TagProps, Text, TextArea, type TextColor, type TextElement, TextField, type TextPreset, type ToastVariant, ToggleButton, type ToggleButtonPreset, button, heading, select, sonner, tagGroup, tagList, text, textField };