ics-ui-kit 0.1.17 → 0.1.19

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 (71) hide show
  1. package/dist/{Button-Dg89xRSi.js → Button-BZ3ON1Tj.js} +2 -2
  2. package/dist/{Button-Dg89xRSi.js.map → Button-BZ3ON1Tj.js.map} +1 -1
  3. package/dist/ButtonBase-jgu7EolU.js +158 -0
  4. package/dist/ButtonBase-jgu7EolU.js.map +1 -0
  5. package/dist/{CheckboxField-2zNFubvm.js → CheckboxField-limFbMk2.js} +43 -43
  6. package/dist/CheckboxField-limFbMk2.js.map +1 -0
  7. package/dist/{Command-D5zgJ7-y.js → Command-B7ZRyW8w.js} +2 -2
  8. package/dist/Command-B7ZRyW8w.js.map +1 -0
  9. package/dist/{FormFooterTemplate-Cfn5Nmge.js → FormFooterTemplate-DdNnLu2-.js} +3 -3
  10. package/dist/{FormFooterTemplate-Cfn5Nmge.js.map → FormFooterTemplate-DdNnLu2-.js.map} +1 -1
  11. package/dist/{IconButton-DwkpNgn3.js → IconButton-uGJ3cQtk.js} +2 -2
  12. package/dist/{IconButton-DwkpNgn3.js.map → IconButton-uGJ3cQtk.js.map} +1 -1
  13. package/dist/{InputGroup-BvD9Igmt.js → InputGroup-AVAtosX_.js} +21 -23
  14. package/dist/InputGroup-AVAtosX_.js.map +1 -0
  15. package/dist/{Popover-CRVD7AtB.js → Popover-KjZXxxl3.js} +2 -2
  16. package/dist/{Popover-CRVD7AtB.js.map → Popover-KjZXxxl3.js.map} +1 -1
  17. package/dist/{RichButton-DuPTenmS.js → RichButton-B1wjK7Bk.js} +2 -2
  18. package/dist/{RichButton-DuPTenmS.js.map → RichButton-B1wjK7Bk.js.map} +1 -1
  19. package/dist/{Select-MLPTpIl5.js → Select-D9juHX8o.js} +7 -8
  20. package/dist/{Select-MLPTpIl5.js.map → Select-D9juHX8o.js.map} +1 -1
  21. package/dist/{TextInput-Cj50ImXi.js → TextInput-5BuZtWV6.js} +2 -2
  22. package/dist/{TextInput-Cj50ImXi.js.map → TextInput-5BuZtWV6.js.map} +1 -1
  23. package/dist/{TriggerButton-CfDObWP9.js → TriggerButton-Bakr8Boi.js} +2 -2
  24. package/dist/{TriggerButton-CfDObWP9.js.map → TriggerButton-Bakr8Boi.js.map} +1 -1
  25. package/dist/blocks/auth/otp-form.js +2 -2
  26. package/dist/components/alert-dialog.js +1 -1
  27. package/dist/components/alert.js +1 -1
  28. package/dist/components/button.js +5 -5
  29. package/dist/components/calendar.js +1 -1
  30. package/dist/components/card.js +1 -1
  31. package/dist/components/carousel.js +1 -1
  32. package/dist/components/checkbox.js +1 -1
  33. package/dist/components/command.js +1 -1
  34. package/dist/components/dialog.js +1 -1
  35. package/dist/components/drawer.js +2 -2
  36. package/dist/components/dropdown.js +1 -1
  37. package/dist/components/error-state.js +1 -1
  38. package/dist/components/file-upload.js +2 -2
  39. package/dist/components/form.js +2 -2
  40. package/dist/components/image-preview.js +1 -1
  41. package/dist/components/image-uploader.js +9 -9
  42. package/dist/components/image-uploader.js.map +1 -1
  43. package/dist/components/input.js +5 -5
  44. package/dist/components/menu-item.js +3 -3
  45. package/dist/components/page-state.js +1 -1
  46. package/dist/components/popover.js +1 -1
  47. package/dist/components/progress-circle.js +1 -1
  48. package/dist/components/progress.js +1 -1
  49. package/dist/components/radio-group.js +10 -10
  50. package/dist/components/radio-group.js.map +1 -1
  51. package/dist/components/search-select.js +41 -41
  52. package/dist/components/search-select.js.map +1 -1
  53. package/dist/components/select/Select.d.ts +0 -3
  54. package/dist/components/select.js +1 -1
  55. package/dist/components/sidebar.js +2 -2
  56. package/dist/components/system-state.js +1 -1
  57. package/dist/components/tag-input.js +2 -2
  58. package/dist/components/textarea.js +1 -1
  59. package/dist/components/toast.js +2 -2
  60. package/dist/{inputBaseStyles-DbzD_jvq.js → inputBaseStyles-BfZIWuQ6.js} +5 -5
  61. package/dist/inputBaseStyles-BfZIWuQ6.js.map +1 -0
  62. package/dist/styles-scoped.css +77 -154
  63. package/dist/styles.css +77 -154
  64. package/package.json +1 -1
  65. package/tailwind.preset.js +5 -5
  66. package/dist/ButtonBase-e6qyv6mD.js +0 -158
  67. package/dist/ButtonBase-e6qyv6mD.js.map +0 -1
  68. package/dist/CheckboxField-2zNFubvm.js.map +0 -1
  69. package/dist/Command-D5zgJ7-y.js.map +0 -1
  70. package/dist/InputGroup-BvD9Igmt.js.map +0 -1
  71. package/dist/inputBaseStyles-DbzD_jvq.js.map +0 -1
package/dist/styles.css CHANGED
@@ -4053,23 +4053,23 @@ body {
4053
4053
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4054
4054
  }
4055
4055
  .shadow-soft-base {
4056
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
4057
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
4056
+ --tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
4057
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
4058
4058
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4059
4059
  }
4060
4060
  .shadow-soft-lg {
4061
- --tw-shadow: 0 8px 16px -4px rgba(15, 23, 42, 0.12), 0 4px 8px -4px rgba(15, 23, 42, 0.12);
4062
- --tw-shadow-colored: 0 8px 16px -4px var(--tw-shadow-color), 0 4px 8px -4px var(--tw-shadow-color);
4061
+ --tw-shadow: 0 10px 15px -3px hsl(var(--primary-fg) / 0.12), 0 4px 6px -4px hsl(var(--primary-fg) / 0.12);
4062
+ --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
4063
4063
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4064
4064
  }
4065
4065
  .shadow-soft-md {
4066
- --tw-shadow: 0 2px 4px -2px rgba(15, 23, 42, 0.12), 0 4px 8px -1px rgba(15, 23, 42, 0.12);
4067
- --tw-shadow-colored: 0 2px 4px -2px var(--tw-shadow-color), 0 4px 8px -1px var(--tw-shadow-color);
4066
+ --tw-shadow: 0 4px 6px -1px hsl(var(--primary-fg) / 0.12), 0 2px 4px -2px hsl(var(--primary-fg) / 0.12);
4067
+ --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
4068
4068
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4069
4069
  }
4070
4070
  .shadow-soft-sm {
4071
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
4072
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
4071
+ --tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
4072
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
4073
4073
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4074
4074
  }
4075
4075
  .outline-none {
@@ -4509,8 +4509,8 @@ body {
4509
4509
  border-color: hsl(var(--status-error-secondary-border));
4510
4510
  }
4511
4511
  .invalid\:shadow-soft-base:invalid {
4512
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
4513
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
4512
+ --tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
4513
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
4514
4514
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4515
4515
  }
4516
4516
  .read-only\:w-0:read-only {
@@ -4525,9 +4525,9 @@ body {
4525
4525
  .read-only\:bg-secondary-bg-hover:read-only {
4526
4526
  background-color: hsl(var(--secondary-bg-hover));
4527
4527
  }
4528
- .read-only\:shadow-soft-sm:read-only {
4529
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
4530
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
4528
+ .read-only\:shadow-none:read-only {
4529
+ --tw-shadow: 0 0 #0000;
4530
+ --tw-shadow-colored: 0 0 #0000;
4531
4531
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4532
4532
  }
4533
4533
  @media (hover: hover) and (pointer: fine) {
@@ -4555,9 +4555,18 @@ body {
4555
4555
  .hover\:border-status-error-secondary-border:hover {
4556
4556
  border-color: hsl(var(--status-error-secondary-border));
4557
4557
  }
4558
+ .hover\:border-status-info-primary-border:hover {
4559
+ border-color: hsl(var(--status-info-primary-border));
4560
+ }
4561
+ .hover\:border-status-success-primary-border:hover {
4562
+ border-color: hsl(var(--status-success-primary-border));
4563
+ }
4558
4564
  .hover\:border-status-success-secondary-border:hover {
4559
4565
  border-color: hsl(var(--status-success-secondary-border));
4560
4566
  }
4567
+ .hover\:border-status-warning-primary-border:hover {
4568
+ border-color: hsl(var(--status-warning-primary-border));
4569
+ }
4561
4570
  .hover\:\!bg-inverse-hover:hover {
4562
4571
  background-color: hsl(var(--inverse-hover)) !important;
4563
4572
  }
@@ -4585,6 +4594,9 @@ body {
4585
4594
  --tw-bg-opacity: 1;
4586
4595
  background-color: rgb(255 237 213 / var(--tw-bg-opacity, 1));
4587
4596
  }
4597
+ .hover\:bg-primary-accent-hover:hover {
4598
+ background-color: hsl(var(--primary-accent-hover));
4599
+ }
4588
4600
  .hover\:bg-primary-bg-hover:hover {
4589
4601
  background-color: hsl(var(--primary-bg-hover));
4590
4602
  }
@@ -4606,6 +4618,9 @@ body {
4606
4618
  .hover\:bg-status-error-hover:hover {
4607
4619
  background-color: hsl(var(--status-error-hover));
4608
4620
  }
4621
+ .hover\:bg-status-info-bg:hover {
4622
+ background-color: hsl(var(--status-info-bg));
4623
+ }
4609
4624
  .hover\:bg-status-info-bg-hover:hover {
4610
4625
  background-color: hsl(var(--status-info-bg-hover));
4611
4626
  }
@@ -4618,6 +4633,9 @@ body {
4618
4633
  .hover\:bg-status-neutral-hover:hover {
4619
4634
  background-color: hsl(var(--status-default-hover));
4620
4635
  }
4636
+ .hover\:bg-status-success-bg:hover {
4637
+ background-color: hsl(var(--status-success-bg));
4638
+ }
4621
4639
  .hover\:bg-status-success-bg-hover:hover {
4622
4640
  background-color: hsl(var(--status-success-bg-hover));
4623
4641
  }
@@ -4654,6 +4672,18 @@ body {
4654
4672
  .hover\:text-secondary-fg:hover {
4655
4673
  color: hsl(var(--secondary-fg));
4656
4674
  }
4675
+ .hover\:text-status-error-fg:hover {
4676
+ color: hsl(var(--status-error-fg));
4677
+ }
4678
+ .hover\:text-status-info-fg:hover {
4679
+ color: hsl(var(--status-info-fg));
4680
+ }
4681
+ .hover\:text-status-success-fg:hover {
4682
+ color: hsl(var(--status-success-fg));
4683
+ }
4684
+ .hover\:text-status-warning-fg:hover {
4685
+ color: hsl(var(--status-warning-fg));
4686
+ }
4657
4687
  .hover\:text-white:hover {
4658
4688
  --tw-text-opacity: 1;
4659
4689
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
@@ -4670,13 +4700,13 @@ body {
4670
4700
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4671
4701
  }
4672
4702
  .hover\:shadow-soft-base:hover {
4673
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
4674
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
4703
+ --tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
4704
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
4675
4705
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4676
4706
  }
4677
4707
  .hover\:shadow-soft-sm:hover {
4678
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
4679
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
4708
+ --tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
4709
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
4680
4710
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4681
4711
  }
4682
4712
  .hover\:brightness-110:hover {
@@ -4703,11 +4733,6 @@ body {
4703
4733
  .invalid\:hover\:border-status-error-primary-border:hover:invalid {
4704
4734
  border-color: hsl(var(--status-error-primary-border));
4705
4735
  }
4706
- .invalid\:hover\:shadow-soft-base:hover:invalid {
4707
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
4708
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
4709
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4710
- }
4711
4736
  .read-only\:hover\:bg-secondary-bg-hover:hover:read-only {
4712
4737
  background-color: hsl(var(--secondary-bg-hover));
4713
4738
  }
@@ -4762,8 +4787,8 @@ body {
4762
4787
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4763
4788
  }
4764
4789
  .focus\:shadow-soft-sm:focus {
4765
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
4766
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
4790
+ --tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
4791
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
4767
4792
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4768
4793
  }
4769
4794
  .focus\:outline-none:focus {
@@ -5004,9 +5029,14 @@ body {
5004
5029
  .disabled\:opacity-50:disabled {
5005
5030
  opacity: 0.5;
5006
5031
  }
5032
+ .disabled\:shadow-none:disabled {
5033
+ --tw-shadow: 0 0 #0000;
5034
+ --tw-shadow-colored: 0 0 #0000;
5035
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5036
+ }
5007
5037
  .disabled\:shadow-soft-sm:disabled {
5008
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
5009
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
5038
+ --tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
5039
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
5010
5040
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5011
5041
  }
5012
5042
  @media (hover: hover) and (pointer: fine) {
@@ -5069,9 +5099,6 @@ body {
5069
5099
  .group:focus-visible .group-focus-visible\:opacity-100 {
5070
5100
  opacity: 1;
5071
5101
  }
5072
- .group:disabled .group-disabled\:hidden {
5073
- display: none;
5074
- }
5075
5102
  @media (hover: hover) and (pointer: fine) {
5076
5103
  .peer\/icon:hover ~ .peer-hover\/icon\:bg-primary-fg {
5077
5104
  background-color: hsl(var(--primary-fg));
@@ -5149,8 +5176,8 @@ body {
5149
5176
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5150
5177
  }
5151
5178
  .has-\[input\:disabled\]\:shadow-soft-sm:has(input:disabled) {
5152
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
5153
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
5179
+ --tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
5180
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
5154
5181
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5155
5182
  }
5156
5183
  .has-\[input\:focus\]\:shadow-focus:has(input:focus) {
@@ -5164,8 +5191,8 @@ body {
5164
5191
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5165
5192
  }
5166
5193
  .has-\[input\:invalid\]\:shadow-soft-base:has(input:invalid) {
5167
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5168
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5194
+ --tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
5195
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5169
5196
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5170
5197
  }
5171
5198
  .has-\[input\:read-only\:not\(\[type\=\'file\'\]\)\]\:has-\[input\:focus\]\:shadow-focus:has(input:focus):has(input:read-only:not([type='file'])) {
@@ -5173,9 +5200,9 @@ body {
5173
5200
  --tw-shadow-colored: 0 0 0 0.5px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color);
5174
5201
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5175
5202
  }
5176
- .has-\[input\:read-only\:not\(\[type\=\'file\'\]\)\]\:shadow-soft-sm:has(input:read-only:not([type='file'])) {
5177
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
5178
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
5203
+ .has-\[input\:read-only\:not\(\[type\=\'file\'\]\)\]\:shadow-none:has(input:read-only:not([type='file'])) {
5204
+ --tw-shadow: 0 0 #0000;
5205
+ --tw-shadow-colored: 0 0 #0000;
5179
5206
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5180
5207
  }
5181
5208
  .has-\[input\[aria-invalid\=true\]\]\:has-\[input\:focus\]\:shadow-focus-error:has(input:focus):has(input[aria-invalid=true]) {
@@ -5184,8 +5211,8 @@ body {
5184
5211
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5185
5212
  }
5186
5213
  .has-\[input\[aria-invalid\=true\]\]\:shadow-soft-base:has(input[aria-invalid=true]) {
5187
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5188
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5214
+ --tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
5215
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5189
5216
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5190
5217
  }
5191
5218
  @media (hover: hover) and (pointer: fine) {
@@ -5198,16 +5225,6 @@ body {
5198
5225
  .has-\[input\:read-only\:not\(\[type\=\'file\'\]\)\]\:hover\:bg-secondary-bg-hover:hover:has(input:read-only:not([type='file'])) {
5199
5226
  background-color: hsl(var(--secondary-bg-hover));
5200
5227
  }
5201
- .has-\[input\:invalid\]\:hover\:shadow-soft-base:hover:has(input:invalid) {
5202
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5203
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5204
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5205
- }
5206
- .has-\[input\[aria-invalid\=true\]\]\:hover\:shadow-soft-base:hover:has(input[aria-invalid=true]) {
5207
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5208
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5209
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5210
- }
5211
5228
  }
5212
5229
  .group\/menu-item:has([data-sidebar=menu-action]) .group-has-\[\[data-sidebar\=menu-action\]\]\/menu-item\:pr-8 {
5213
5230
  padding-right: 2rem;
@@ -5222,19 +5239,14 @@ body {
5222
5239
  border-color: hsl(var(--status-error-secondary-border));
5223
5240
  }
5224
5241
  .aria-\[invalid\=true\]\:shadow-soft-base[aria-invalid="true"] {
5225
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5226
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5242
+ --tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
5243
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5227
5244
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5228
5245
  }
5229
5246
  @media (hover: hover) and (pointer: fine) {
5230
5247
  .aria-\[invalid\=true\]\:hover\:border-status-error-primary-border:hover[aria-invalid="true"] {
5231
5248
  border-color: hsl(var(--status-error-primary-border));
5232
5249
  }
5233
- .aria-\[invalid\=true\]\:hover\:shadow-soft-base:hover[aria-invalid="true"] {
5234
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5235
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5236
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5237
- }
5238
5250
  }
5239
5251
  .aria-\[invalid\=true\]\:focus\:border-status-error-secondary-border:focus[aria-invalid="true"] {
5240
5252
  border-color: hsl(var(--status-error-secondary-border));
@@ -5471,8 +5483,8 @@ body {
5471
5483
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
5472
5484
  }
5473
5485
  .data-\[state\=active\]\:shadow-soft-base[data-state="active"] {
5474
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5475
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5486
+ --tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
5487
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5476
5488
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5477
5489
  }
5478
5490
  .data-\[state\=open\]\:shadow-none[data-state="open"] {
@@ -5641,16 +5653,6 @@ body {
5641
5653
  .data-\[state\=open\]\:hover\:text-primary-fg:hover[data-state="open"] {
5642
5654
  color: hsl(var(--primary-fg));
5643
5655
  }
5644
- .data-\[state\=checked\]\:hover\:shadow-soft-base:hover[data-state="checked"] {
5645
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5646
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5647
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5648
- }
5649
- .data-\[state\=indeterminate\]\:hover\:shadow-soft-base:hover[data-state="indeterminate"] {
5650
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12);
5651
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
5652
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5653
- }
5654
5656
  }
5655
5657
  .data-\[state\=checked\]\:focus-visible\:shadow-focus:focus-visible[data-state="checked"] {
5656
5658
  --tw-shadow: 0 0 0 0.5px hsl(var(--primary-bg)), 0 0 0 1px hsl(var(--focus));
@@ -5698,13 +5700,13 @@ body {
5698
5700
  opacity: 0.5;
5699
5701
  }
5700
5702
  .data-\[state\=checked\]\:disabled\:shadow-soft-sm:disabled[data-state="checked"] {
5701
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
5702
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
5703
+ --tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
5704
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
5703
5705
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5704
5706
  }
5705
5707
  .data-\[state\=indeterminate\]\:disabled\:shadow-soft-sm:disabled[data-state="indeterminate"] {
5706
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
5707
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
5708
+ --tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
5709
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
5708
5710
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5709
5711
  }
5710
5712
  .group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:left-\[calc\(var\(--sidebar-width\)\*-1\)\] {
@@ -5844,8 +5846,8 @@ body {
5844
5846
  opacity: 1;
5845
5847
  }
5846
5848
  .group[data-variant="floating"] .group-data-\[variant\=floating\]\:shadow-soft-xl {
5847
- --tw-shadow: 0 6px 12px -6px rgba(15, 23, 42, 0.12), 0 16px 24px -6px rgba(15, 23, 42, 0.12);
5848
- --tw-shadow-colored: 0 6px 12px -6px var(--tw-shadow-color), 0 16px 24px -6px var(--tw-shadow-color);
5849
+ --tw-shadow: 0 20px 25px -5px hsl(var(--primary-fg) / 0.12), 0 8px 10px -6px hsl(var(--primary-fg) / 0.12);
5850
+ --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
5849
5851
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
5850
5852
  }
5851
5853
  .group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:after\:left-full::after {
@@ -6292,99 +6294,20 @@ body {
6292
6294
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
6293
6295
  }
6294
6296
  .lg\:shadow-soft-sm {
6295
- --tw-shadow: 0 2px 4px 0 rgba(15, 23, 42, 0.06);
6296
- --tw-shadow-colored: 0 2px 4px 0 var(--tw-shadow-color);
6297
+ --tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
6298
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
6297
6299
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
6298
6300
  }
6299
6301
  @media (hover: hover) and (pointer: fine) {
6300
6302
  .lg\:hover\:border-inverse-border:hover {
6301
6303
  border-color: hsl(var(--inverse-border));
6302
6304
  }
6303
- .lg\:hover\:border-primary-border:hover {
6304
- border-color: hsl(var(--primary-border));
6305
- }
6306
- .lg\:hover\:border-status-error-primary-border:hover {
6307
- border-color: hsl(var(--status-error-primary-border));
6308
- }
6309
- .lg\:hover\:border-status-info-primary-border:hover {
6310
- border-color: hsl(var(--status-info-primary-border));
6311
- }
6312
- .lg\:hover\:border-status-success-primary-border:hover {
6313
- border-color: hsl(var(--status-success-primary-border));
6314
- }
6315
- .lg\:hover\:border-status-warning-primary-border:hover {
6316
- border-color: hsl(var(--status-warning-primary-border));
6317
- }
6318
6305
  .lg\:hover\:bg-inverse-hover:hover {
6319
6306
  background-color: hsl(var(--inverse-hover));
6320
6307
  }
6321
- .lg\:hover\:bg-primary-accent-hover:hover {
6322
- background-color: hsl(var(--primary-accent-hover));
6323
- }
6324
- .lg\:hover\:bg-primary-bg-hover:hover {
6325
- background-color: hsl(var(--primary-bg-hover));
6326
- }
6327
- .lg\:hover\:bg-secondary-bg-hover:hover {
6328
- background-color: hsl(var(--secondary-bg-hover));
6329
- }
6330
- .lg\:hover\:bg-status-error-bg:hover {
6331
- background-color: hsl(var(--status-error-bg));
6332
- }
6333
- .lg\:hover\:bg-status-error-bg-hover:hover {
6334
- background-color: hsl(var(--status-error-bg-hover));
6335
- }
6336
- .lg\:hover\:bg-status-error-hover:hover {
6337
- background-color: hsl(var(--status-error-hover));
6338
- }
6339
- .lg\:hover\:bg-status-info-bg:hover {
6340
- background-color: hsl(var(--status-info-bg));
6341
- }
6342
- .lg\:hover\:bg-status-info-bg-hover:hover {
6343
- background-color: hsl(var(--status-info-bg-hover));
6344
- }
6345
- .lg\:hover\:bg-status-info-hover:hover {
6346
- background-color: hsl(var(--status-info-hover));
6347
- }
6348
- .lg\:hover\:bg-status-success-bg:hover {
6349
- background-color: hsl(var(--status-success-bg));
6350
- }
6351
- .lg\:hover\:bg-status-success-bg-hover:hover {
6352
- background-color: hsl(var(--status-success-bg-hover));
6353
- }
6354
- .lg\:hover\:bg-status-success-hover:hover {
6355
- background-color: hsl(var(--status-success-hover));
6356
- }
6357
- .lg\:hover\:bg-status-warning-bg:hover {
6358
- background-color: hsl(var(--status-warning-bg));
6359
- }
6360
- .lg\:hover\:bg-status-warning-bg-hover:hover {
6361
- background-color: hsl(var(--status-warning-bg-hover));
6362
- }
6363
- .lg\:hover\:bg-status-warning-hover:hover {
6364
- background-color: hsl(var(--status-warning-hover));
6365
- }
6366
6308
  .lg\:hover\:text-inverse-primary-fg:hover {
6367
6309
  color: hsl(var(--inverse-primary-fg));
6368
6310
  }
6369
- .lg\:hover\:text-primary-fg:hover {
6370
- color: hsl(var(--primary-fg));
6371
- }
6372
- .lg\:hover\:text-status-error-fg:hover {
6373
- color: hsl(var(--status-error-fg));
6374
- }
6375
- .lg\:hover\:text-status-info-fg:hover {
6376
- color: hsl(var(--status-info-fg));
6377
- }
6378
- .lg\:hover\:text-status-success-fg:hover {
6379
- color: hsl(var(--status-success-fg));
6380
- }
6381
- .lg\:hover\:text-status-warning-fg:hover {
6382
- color: hsl(var(--status-warning-fg));
6383
- }
6384
- .lg\:hover\:text-white:hover {
6385
- --tw-text-opacity: 1;
6386
- color: rgb(255 255 255 / var(--tw-text-opacity, 1));
6387
- }
6388
6311
  }
6389
6312
  .lg\:has-\[\>svg\]\:grid-cols-\[1\.5rem_1fr\]:has(>svg) {
6390
6313
  grid-template-columns: 1.5rem 1fr;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ics-ui-kit",
3
- "version": "0.1.17",
3
+ "version": "0.1.19",
4
4
  "packageManager": "pnpm@10.17.1",
5
5
  "repository": {
6
6
  "type": "git",
@@ -230,11 +230,11 @@ export default {
230
230
  xs: "calc(var(--radius) - 6px)" /** 2px */
231
231
  },
232
232
  boxShadow: {
233
- "soft-base": "0 2px 4px 0 rgba(15, 23, 42, 0.12), 0 1px 2px -1px rgba(15, 23, 42, 0.12)",
234
- "soft-sm": "0 2px 4px 0 rgba(15, 23, 42, 0.06)",
235
- "soft-md": "0 2px 4px -2px rgba(15, 23, 42, 0.12), 0 4px 8px -1px rgba(15, 23, 42, 0.12)",
236
- "soft-lg": "0 8px 16px -4px rgba(15, 23, 42, 0.12), 0 4px 8px -4px rgba(15, 23, 42, 0.12)",
237
- "soft-xl": "0 6px 12px -6px rgba(15, 23, 42, 0.12), 0 16px 24px -6px rgba(15, 23, 42, 0.12)",
233
+ "soft-base": "0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12)",
234
+ "soft-sm": "0 1px 2px 0 hsl(var(--primary-fg) / 0.06)",
235
+ "soft-md": "0 4px 6px -1px hsl(var(--primary-fg) / 0.12), 0 2px 4px -2px hsl(var(--primary-fg) / 0.12)",
236
+ "soft-lg": "0 10px 15px -3px hsl(var(--primary-fg) / 0.12), 0 4px 6px -4px hsl(var(--primary-fg) / 0.12)",
237
+ "soft-xl": "0 20px 25px -5px hsl(var(--primary-fg) / 0.12), 0 8px 10px -6px hsl(var(--primary-fg) / 0.12)",
238
238
  "soft-2xl": "0 24px 48px -12px rgba(15, 23, 42, 0.24)",
239
239
 
240
240
  focus: "0 0 0 0.5px hsl(var(--primary-bg)), 0 0 0 1px hsl(var(--focus))",
@@ -1,158 +0,0 @@
1
- import { jsx as n } from "react/jsx-runtime";
2
- import { S as u } from "./index-BtQfgaSF.js";
3
- import c from "react";
4
- import { T as b } from "./index-BVqs-uqP.js";
5
- const v = b({
6
- base: "inline-flex cursor-pointer select-none items-center justify-center overflow-hidden rounded-lg font-medium text-primary-fg transition-all focus-visible:shadow-focus focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50",
7
- variants: {
8
- variant: {
9
- primary: "bg-primary-accent text-primary-bg shadow-soft-base active:bg-primary-accent-hover lg:hover:bg-primary-accent-hover",
10
- secondary: "bg-secondary-bg-hover active:bg-primary-bg-hover lg:hover:bg-primary-bg-hover",
11
- outline: "border border-solid border-secondary-border bg-secondary-bg shadow-soft-sm active:border-primary-border active:bg-secondary-bg-hover lg:hover:border-primary-border lg:hover:bg-secondary-bg-hover",
12
- ghost: "bg-transparent active:bg-secondary-bg-hover lg:hover:bg-secondary-bg-hover",
13
- link: "bg-transparent text-muted underline active:text-primary-fg lg:hover:text-primary-fg",
14
- text: "bg-transparent text-muted active:text-primary-fg lg:hover:text-primary-fg"
15
- },
16
- status: {
17
- default: "",
18
- info: "text-status-info-fg",
19
- success: "text-status-success-fg",
20
- warning: "text-status-warning-fg",
21
- error: "text-status-error-fg"
22
- },
23
- size: {
24
- xs: "h-7 gap-2 px-2.5 py-1.5 text-xs",
25
- sm: "h-8 gap-2 px-3 py-2 text-xs",
26
- md: "h-9 gap-2 px-4 py-2 text-sm",
27
- lg: "h-10 gap-2 px-5 py-2 text-sm",
28
- xl: "h-11 gap-3 px-6 py-3 text-base"
29
- }
30
- },
31
- defaultVariants: {
32
- variant: "primary",
33
- size: "md",
34
- status: "default"
35
- },
36
- compoundVariants: [
37
- /*
38
- * Statuses
39
- */
40
- // Primary
41
- {
42
- variant: "primary",
43
- status: ["info", "success", "warning", "error"],
44
- class: "text-white active:text-white lg:hover:text-white"
45
- },
46
- {
47
- variant: "primary",
48
- status: "info",
49
- class: "bg-status-info active:bg-status-info-hover lg:hover:bg-status-info-hover"
50
- },
51
- {
52
- variant: "primary",
53
- status: "success",
54
- class: "bg-status-success active:bg-status-success-hover lg:hover:bg-status-success-hover"
55
- },
56
- {
57
- variant: "primary",
58
- status: "warning",
59
- class: "bg-status-warning active:bg-status-warning-hover lg:hover:bg-status-warning-hover"
60
- },
61
- {
62
- variant: "primary",
63
- status: "error",
64
- class: "bg-status-error active:bg-status-error-hover lg:hover:bg-status-error-hover"
65
- },
66
- // Secondary
67
- {
68
- variant: "secondary",
69
- status: "info",
70
- class: "bg-status-info-bg active:bg-status-info-bg-hover lg:hover:bg-status-info-bg-hover"
71
- },
72
- {
73
- variant: "secondary",
74
- status: "success",
75
- class: "bg-status-success-bg active:bg-status-success-bg-hover lg:hover:bg-status-success-bg-hover"
76
- },
77
- {
78
- variant: "secondary",
79
- status: "warning",
80
- class: "bg-status-warning-bg active:bg-status-warning-bg-hover lg:hover:bg-status-warning-bg-hover"
81
- },
82
- {
83
- variant: "secondary",
84
- status: "error",
85
- class: "bg-status-error-bg active:bg-status-error-bg-hover lg:hover:bg-status-error-bg-hover"
86
- },
87
- // Outline
88
- {
89
- variant: "outline",
90
- status: "info",
91
- class: "border-status-info-secondary-border active:border-status-info-secondary-border active:bg-status-info-bg lg:hover:border-status-info-primary-border lg:hover:bg-status-info-bg"
92
- },
93
- {
94
- variant: "outline",
95
- status: "success",
96
- class: "border-status-success-secondary-border active:border-status-success-secondary-border active:bg-status-success-bg lg:hover:border-status-success-primary-border lg:hover:bg-status-success-bg"
97
- },
98
- {
99
- variant: "outline",
100
- status: "warning",
101
- class: "border-status-warning-secondary-border active:border-status-warning-secondary-border active:bg-status-warning-bg lg:hover:border-status-warning-primary-border lg:hover:bg-status-warning-bg"
102
- },
103
- {
104
- variant: "outline",
105
- status: "error",
106
- class: "border-status-error-secondary-border active:border-status-error-secondary-border active:bg-status-error-bg lg:hover:border-status-error-primary-border lg:hover:bg-status-error-bg"
107
- },
108
- // Ghost
109
- {
110
- variant: "ghost",
111
- status: "info",
112
- class: "text-status-info-fg active:bg-status-info-bg lg:hover:bg-status-info-bg"
113
- },
114
- {
115
- variant: "ghost",
116
- status: "success",
117
- class: "text-status-success-fg active:bg-status-success-bg lg:hover:bg-status-success-bg"
118
- },
119
- {
120
- variant: "ghost",
121
- status: "warning",
122
- class: "text-status-warning-fg active:bg-status-warning-bg lg:hover:bg-status-warning-bg"
123
- },
124
- {
125
- variant: "ghost",
126
- status: "error",
127
- class: "text-status-error-fg active:bg-status-error-bg lg:hover:bg-status-error-bg"
128
- },
129
- // Text & Link
130
- {
131
- variant: ["text", "link"],
132
- status: "info",
133
- class: "text-status-info-fg/70 active:text-status-info-fg lg:hover:text-status-info-fg"
134
- },
135
- {
136
- variant: ["text", "link"],
137
- status: "success",
138
- class: "text-status-success-fg/70 active:text-status-success-fg lg:hover:text-status-success-fg"
139
- },
140
- {
141
- variant: ["text", "link"],
142
- status: "warning",
143
- class: "text-status-warning-fg/70 active:text-status-warning-fg lg:hover:text-status-warning-fg"
144
- },
145
- {
146
- variant: ["text", "link"],
147
- status: "error",
148
- class: "text-status-error-fg/70 active:text-status-error-fg lg:hover:text-status-error-fg"
149
- }
150
- ]
151
- }), l = c.forwardRef(
152
- ({ variant: t, size: s, children: r, status: a, className: e, asChild: o = !1, ...g }, i) => /* @__PURE__ */ n(o ? u : "button", { className: v({ variant: t, size: s, status: a, className: e }), ref: i, ...g, children: r })
153
- );
154
- l.displayName = "ButtonBase";
155
- export {
156
- l as B
157
- };
158
- //# sourceMappingURL=ButtonBase-e6qyv6mD.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ButtonBase-e6qyv6mD.js","sources":["../src/components/button/button-base/ButtonBase.tsx"],"sourcesContent":["import { VariantsConfig } from \"@/lib/utils/variants\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport React, { PropsWithChildren } from \"react\";\nimport { tv } from \"tailwind-variants\";\n\nexport interface ButtonBaseVariants {\n\tvariant?: \"primary\" | \"secondary\" | \"outline\" | \"ghost\" | \"link\" | \"text\";\n\tstatus?: \"default\" | \"info\" | \"success\" | \"warning\" | \"error\";\n\tsize?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n}\n\nconst buttonBaseStyles = tv({\n\tbase: \"inline-flex cursor-pointer select-none items-center justify-center overflow-hidden rounded-lg font-medium text-primary-fg transition-all focus-visible:shadow-focus focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50\",\n\tvariants: {\n\t\tvariant: {\n\t\t\tprimary:\n\t\t\t\t\"bg-primary-accent text-primary-bg shadow-soft-base active:bg-primary-accent-hover lg:hover:bg-primary-accent-hover\",\n\t\t\tsecondary: \"bg-secondary-bg-hover active:bg-primary-bg-hover lg:hover:bg-primary-bg-hover\",\n\t\t\toutline:\n\t\t\t\t\"border border-solid border-secondary-border bg-secondary-bg shadow-soft-sm active:border-primary-border active:bg-secondary-bg-hover lg:hover:border-primary-border lg:hover:bg-secondary-bg-hover\",\n\t\t\tghost: \"bg-transparent active:bg-secondary-bg-hover lg:hover:bg-secondary-bg-hover\",\n\t\t\tlink: \"bg-transparent text-muted underline active:text-primary-fg lg:hover:text-primary-fg\",\n\t\t\ttext: \"bg-transparent text-muted active:text-primary-fg lg:hover:text-primary-fg\"\n\t\t},\n\t\tstatus: {\n\t\t\tdefault: \"\",\n\t\t\tinfo: \"text-status-info-fg\",\n\t\t\tsuccess: \"text-status-success-fg\",\n\t\t\twarning: \"text-status-warning-fg\",\n\t\t\terror: \"text-status-error-fg\"\n\t\t},\n\t\tsize: {\n\t\t\txs: \"h-7 gap-2 px-2.5 py-1.5 text-xs\",\n\t\t\tsm: \"h-8 gap-2 px-3 py-2 text-xs\",\n\t\t\tmd: \"h-9 gap-2 px-4 py-2 text-sm\",\n\t\t\tlg: \"h-10 gap-2 px-5 py-2 text-sm\",\n\t\t\txl: \"h-11 gap-3 px-6 py-3 text-base\"\n\t\t}\n\t} satisfies VariantsConfig<ButtonBaseVariants>,\n\tdefaultVariants: {\n\t\tvariant: \"primary\",\n\t\tsize: \"md\",\n\t\tstatus: \"default\"\n\t},\n\tcompoundVariants: [\n\t\t/*\n\t\t * Statuses\n\t\t */\n\t\t// Primary\n\t\t{\n\t\t\tvariant: \"primary\",\n\t\t\tstatus: [\"info\", \"success\", \"warning\", \"error\"],\n\t\t\tclass: \"text-white active:text-white lg:hover:text-white\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"primary\",\n\t\t\tstatus: \"info\",\n\t\t\tclass: \"bg-status-info active:bg-status-info-hover lg:hover:bg-status-info-hover\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"primary\",\n\t\t\tstatus: \"success\",\n\t\t\tclass: \"bg-status-success active:bg-status-success-hover lg:hover:bg-status-success-hover\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"primary\",\n\t\t\tstatus: \"warning\",\n\t\t\tclass: \"bg-status-warning active:bg-status-warning-hover lg:hover:bg-status-warning-hover\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"primary\",\n\t\t\tstatus: \"error\",\n\t\t\tclass: \"bg-status-error active:bg-status-error-hover lg:hover:bg-status-error-hover\"\n\t\t},\n\t\t// Secondary\n\t\t{\n\t\t\tvariant: \"secondary\",\n\t\t\tstatus: \"info\",\n\t\t\tclass: \"bg-status-info-bg active:bg-status-info-bg-hover lg:hover:bg-status-info-bg-hover\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"secondary\",\n\t\t\tstatus: \"success\",\n\t\t\tclass: \"bg-status-success-bg active:bg-status-success-bg-hover lg:hover:bg-status-success-bg-hover\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"secondary\",\n\t\t\tstatus: \"warning\",\n\t\t\tclass: \"bg-status-warning-bg active:bg-status-warning-bg-hover lg:hover:bg-status-warning-bg-hover\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"secondary\",\n\t\t\tstatus: \"error\",\n\t\t\tclass: \"bg-status-error-bg active:bg-status-error-bg-hover lg:hover:bg-status-error-bg-hover\"\n\t\t},\n\t\t// Outline\n\t\t{\n\t\t\tvariant: \"outline\",\n\t\t\tstatus: \"info\",\n\t\t\tclass: \"border-status-info-secondary-border active:border-status-info-secondary-border active:bg-status-info-bg lg:hover:border-status-info-primary-border lg:hover:bg-status-info-bg\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"outline\",\n\t\t\tstatus: \"success\",\n\t\t\tclass: \"border-status-success-secondary-border active:border-status-success-secondary-border active:bg-status-success-bg lg:hover:border-status-success-primary-border lg:hover:bg-status-success-bg\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"outline\",\n\t\t\tstatus: \"warning\",\n\t\t\tclass: \"border-status-warning-secondary-border active:border-status-warning-secondary-border active:bg-status-warning-bg lg:hover:border-status-warning-primary-border lg:hover:bg-status-warning-bg\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"outline\",\n\t\t\tstatus: \"error\",\n\t\t\tclass: \"border-status-error-secondary-border active:border-status-error-secondary-border active:bg-status-error-bg lg:hover:border-status-error-primary-border lg:hover:bg-status-error-bg\"\n\t\t},\n\t\t// Ghost\n\t\t{\n\t\t\tvariant: \"ghost\",\n\t\t\tstatus: \"info\",\n\t\t\tclass: \"text-status-info-fg active:bg-status-info-bg lg:hover:bg-status-info-bg\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"ghost\",\n\t\t\tstatus: \"success\",\n\t\t\tclass: \"text-status-success-fg active:bg-status-success-bg lg:hover:bg-status-success-bg\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"ghost\",\n\t\t\tstatus: \"warning\",\n\t\t\tclass: \"text-status-warning-fg active:bg-status-warning-bg lg:hover:bg-status-warning-bg\"\n\t\t},\n\t\t{\n\t\t\tvariant: \"ghost\",\n\t\t\tstatus: \"error\",\n\t\t\tclass: \"text-status-error-fg active:bg-status-error-bg lg:hover:bg-status-error-bg\"\n\t\t},\n\t\t// Text & Link\n\t\t{\n\t\t\tvariant: [\"text\", \"link\"],\n\t\t\tstatus: \"info\",\n\t\t\tclass: \"text-status-info-fg/70 active:text-status-info-fg lg:hover:text-status-info-fg\"\n\t\t},\n\t\t{\n\t\t\tvariant: [\"text\", \"link\"],\n\t\t\tstatus: \"success\",\n\t\t\tclass: \"text-status-success-fg/70 active:text-status-success-fg lg:hover:text-status-success-fg\"\n\t\t},\n\t\t{\n\t\t\tvariant: [\"text\", \"link\"],\n\t\t\tstatus: \"warning\",\n\t\t\tclass: \"text-status-warning-fg/70 active:text-status-warning-fg lg:hover:text-status-warning-fg\"\n\t\t},\n\t\t{\n\t\t\tvariant: [\"text\", \"link\"],\n\t\t\tstatus: \"error\",\n\t\t\tclass: \"text-status-error-fg/70 active:text-status-error-fg lg:hover:text-status-error-fg\"\n\t\t}\n\t]\n});\n\nexport type ButtonBaseProps = React.ButtonHTMLAttributes<HTMLButtonElement> &\n\tButtonBaseVariants & {\n\t\tasChild?: boolean;\n\t};\n\nexport const ButtonBase = React.forwardRef<HTMLButtonElement, PropsWithChildren<ButtonBaseProps>>(\n\t({ variant, size, children, status, className, asChild = false, ...props }, ref) => {\n\t\tconst Comp = asChild ? Slot : \"button\";\n\t\treturn (\n\t\t\t<Comp className={buttonBaseStyles({ variant, size, status, className })} ref={ref} {...props}>\n\t\t\t\t{children}\n\t\t\t</Comp>\n\t\t);\n\t}\n);\n\nButtonBase.displayName = \"ButtonBase\";\n"],"names":["buttonBaseStyles","tv","ButtonBase","React","variant","size","children","status","className","asChild","props","ref","jsx","Slot"],"mappings":";;;;AAWA,MAAMA,IAAmBC,EAAG;AAAA,EAC3B,MAAM;AAAA,EACN,UAAU;AAAA,IACT,SAAS;AAAA,MACR,SACC;AAAA,MACD,WAAW;AAAA,MACX,SACC;AAAA,MACD,OAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAM;AAAA,IACP;AAAA,IACA,QAAQ;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,IACR;AAAA,IACA,MAAM;AAAA,MACL,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA;AAAA,EAEN;AAAA,EACA,iBAAiB;AAAA,IAChB,SAAS;AAAA,IACT,MAAM;AAAA,IACN,QAAQ;AAAA,EACT;AAAA,EACA,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjB;AAAA,MACC,SAAS;AAAA,MACT,QAAQ,CAAC,QAAQ,WAAW,WAAW,OAAO;AAAA,MAC9C,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA;AAAA,IAEA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA;AAAA,IAEA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA;AAAA,IAEA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA;AAAA,IAEA;AAAA,MACC,SAAS,CAAC,QAAQ,MAAM;AAAA,MACxB,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS,CAAC,QAAQ,MAAM;AAAA,MACxB,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS,CAAC,QAAQ,MAAM;AAAA,MACxB,QAAQ;AAAA,MACR,OAAO;AAAA,IACR;AAAA,IACA;AAAA,MACC,SAAS,CAAC,QAAQ,MAAM;AAAA,MACxB,QAAQ;AAAA,MACR,OAAO;AAAA,IAAA;AAAA,EACR;AAEF,CAAC,GAOYC,IAAaC,EAAM;AAAA,EAC/B,CAAC,EAAE,SAAAC,GAAS,MAAAC,GAAM,UAAAC,GAAU,QAAAC,GAAQ,WAAAC,GAAW,SAAAC,IAAU,IAAO,GAAGC,EAAM,GAAGC,MAGzE,gBAAAC,EAFWH,IAAUI,IAAO,UAE5B,EAAK,WAAWb,EAAiB,EAAE,SAAAI,GAAS,MAAAC,GAAM,QAAAE,GAAQ,WAAAC,EAAW,CAAA,GAAG,KAAAG,GAAW,GAAGD,GACrF,UAAAJ,EACF,CAAA;AAGH;AAEAJ,EAAW,cAAc;"}