@helpwave/hightide 0.10.0 → 0.10.2

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.
@@ -916,9 +916,11 @@
916
916
  transition: border-color var(--animation-duration-in, 250ms) ease-in-out, box-shadow var(--animation-duration-in, 250ms) ease-in-out, outline-color var(--animation-duration-in, 250ms) ease-in-out, outline-offset var(--animation-duration-in, 250ms) ease-in-out, color var(--animation-duration-in, 250ms) ease-in-out, background-color var(--animation-duration-in, 250ms) ease-in-out;
917
917
  &:not([data-disabled]):not([data-invalid]) {
918
918
  background-color: var(--color-input-background);
919
- &:hover {
920
- @media (hover: hover) {
921
- border-color: var(--color-primary-hover);
919
+ &:not([data-readonly]) {
920
+ &:hover {
921
+ @media (hover: hover) {
922
+ border-color: var(--color-primary-hover);
923
+ }
922
924
  }
923
925
  }
924
926
  &:not([data-value]) {
@@ -934,9 +936,11 @@
934
936
  @supports (color: color-mix(in lab, red, red)) {
935
937
  background-color: color-mix(in oklab, var(--color-negative) 20%, transparent);
936
938
  }
937
- &:hover {
938
- @media (hover: hover) {
939
- border-color: var(--color-negative-hover);
939
+ &:not([data-readonly]) {
940
+ &:hover {
941
+ @media (hover: hover) {
942
+ border-color: var(--color-negative-hover);
943
+ }
940
944
  }
941
945
  }
942
946
  --color-focus: var(--color-negative);
@@ -2800,9 +2804,11 @@
2800
2804
  transition: border-color var(--animation-duration-in, 250ms) ease-in-out, box-shadow var(--animation-duration-in, 250ms) ease-in-out, outline-color var(--animation-duration-in, 250ms) ease-in-out, outline-offset var(--animation-duration-in, 250ms) ease-in-out, color var(--animation-duration-in, 250ms) ease-in-out, background-color var(--animation-duration-in, 250ms) ease-in-out;
2801
2805
  &:not([data-disabled]):not([data-invalid]) {
2802
2806
  background-color: var(--color-input-background);
2803
- &:hover {
2804
- @media (hover: hover) {
2805
- border-color: var(--color-primary-hover);
2807
+ &:not([data-readonly]) {
2808
+ &:hover {
2809
+ @media (hover: hover) {
2810
+ border-color: var(--color-primary-hover);
2811
+ }
2806
2812
  }
2807
2813
  }
2808
2814
  &:not([data-value]) {
@@ -2818,9 +2824,11 @@
2818
2824
  @supports (color: color-mix(in lab, red, red)) {
2819
2825
  background-color: color-mix(in oklab, var(--color-negative) 20%, transparent);
2820
2826
  }
2821
- &:hover {
2822
- @media (hover: hover) {
2823
- border-color: var(--color-negative-hover);
2827
+ &:not([data-readonly]) {
2828
+ &:hover {
2829
+ @media (hover: hover) {
2830
+ border-color: var(--color-negative-hover);
2831
+ }
2824
2832
  }
2825
2833
  }
2826
2834
  --color-focus: var(--color-negative);
@@ -4329,9 +4337,11 @@
4329
4337
  transition: border-color var(--animation-duration-in, 250ms) ease-in-out, box-shadow var(--animation-duration-in, 250ms) ease-in-out, outline-color var(--animation-duration-in, 250ms) ease-in-out, outline-offset var(--animation-duration-in, 250ms) ease-in-out, color var(--animation-duration-in, 250ms) ease-in-out, background-color var(--animation-duration-in, 250ms) ease-in-out;
4330
4338
  &:not([data-disabled]):not([data-invalid]) {
4331
4339
  background-color: var(--color-input-background);
4332
- &:hover {
4333
- @media (hover: hover) {
4334
- border-color: var(--color-primary-hover);
4340
+ &:not([data-readonly]) {
4341
+ &:hover {
4342
+ @media (hover: hover) {
4343
+ border-color: var(--color-primary-hover);
4344
+ }
4335
4345
  }
4336
4346
  }
4337
4347
  &:not([data-value]) {
@@ -4347,9 +4357,11 @@
4347
4357
  @supports (color: color-mix(in lab, red, red)) {
4348
4358
  background-color: color-mix(in oklab, var(--color-negative) 20%, transparent);
4349
4359
  }
4350
- &:hover {
4351
- @media (hover: hover) {
4352
- border-color: var(--color-negative-hover);
4360
+ &:not([data-readonly]) {
4361
+ &:hover {
4362
+ @media (hover: hover) {
4363
+ border-color: var(--color-negative-hover);
4364
+ }
4353
4365
  }
4354
4366
  }
4355
4367
  --color-focus: var(--color-negative);
@@ -4821,9 +4833,11 @@
4821
4833
  transition: border-color var(--animation-duration-in, 250ms) ease-in-out, box-shadow var(--animation-duration-in, 250ms) ease-in-out, outline-color var(--animation-duration-in, 250ms) ease-in-out, outline-offset var(--animation-duration-in, 250ms) ease-in-out, color var(--animation-duration-in, 250ms) ease-in-out, background-color var(--animation-duration-in, 250ms) ease-in-out;
4822
4834
  &:not([data-disabled]):not([data-invalid]) {
4823
4835
  background-color: var(--color-input-background);
4824
- &:hover {
4825
- @media (hover: hover) {
4826
- border-color: var(--color-primary-hover);
4836
+ &:not([data-readonly]) {
4837
+ &:hover {
4838
+ @media (hover: hover) {
4839
+ border-color: var(--color-primary-hover);
4840
+ }
4827
4841
  }
4828
4842
  }
4829
4843
  &:not([data-value]) {
@@ -4839,9 +4853,11 @@
4839
4853
  @supports (color: color-mix(in lab, red, red)) {
4840
4854
  background-color: color-mix(in oklab, var(--color-negative) 20%, transparent);
4841
4855
  }
4842
- &:hover {
4843
- @media (hover: hover) {
4844
- border-color: var(--color-negative-hover);
4856
+ &:not([data-readonly]) {
4857
+ &:hover {
4858
+ @media (hover: hover) {
4859
+ border-color: var(--color-negative-hover);
4860
+ }
4845
4861
  }
4846
4862
  }
4847
4863
  --color-focus: var(--color-negative);
@@ -4866,7 +4882,7 @@
4866
4882
  border-radius: var(--radius-md);
4867
4883
  padding-inline: calc(var(--spacing) * 3);
4868
4884
  padding-block: calc(var(--spacing) * 2);
4869
- &:not([data-disabled]) {
4885
+ &:not([data-disabled]):not([data-readonly]) {
4870
4886
  &:hover {
4871
4887
  @media (hover: hover) {
4872
4888
  cursor: pointer;
@@ -4891,9 +4907,11 @@
4891
4907
  transition: border-color var(--animation-duration-in, 250ms) ease-in-out, box-shadow var(--animation-duration-in, 250ms) ease-in-out, outline-color var(--animation-duration-in, 250ms) ease-in-out, outline-offset var(--animation-duration-in, 250ms) ease-in-out, color var(--animation-duration-in, 250ms) ease-in-out, background-color var(--animation-duration-in, 250ms) ease-in-out;
4892
4908
  &:not([data-disabled]):not([data-invalid]) {
4893
4909
  background-color: var(--color-input-background);
4894
- &:hover {
4895
- @media (hover: hover) {
4896
- border-color: var(--color-primary-hover);
4910
+ &:not([data-readonly]) {
4911
+ &:hover {
4912
+ @media (hover: hover) {
4913
+ border-color: var(--color-primary-hover);
4914
+ }
4897
4915
  }
4898
4916
  }
4899
4917
  &:not([data-value]) {
@@ -4909,9 +4927,11 @@
4909
4927
  @supports (color: color-mix(in lab, red, red)) {
4910
4928
  background-color: color-mix(in oklab, var(--color-negative) 20%, transparent);
4911
4929
  }
4912
- &:hover {
4913
- @media (hover: hover) {
4914
- border-color: var(--color-negative-hover);
4930
+ &:not([data-readonly]) {
4931
+ &:hover {
4932
+ @media (hover: hover) {
4933
+ border-color: var(--color-negative-hover);
4934
+ }
4915
4935
  }
4916
4936
  }
4917
4937
  --color-focus: var(--color-negative);
@@ -4937,7 +4957,7 @@
4937
4957
  border-radius: var(--radius-md);
4938
4958
  padding-inline: calc(var(--spacing) * 2.5);
4939
4959
  padding-block: calc(var(--spacing) * 2.5);
4940
- &:not([data-disabled]) {
4960
+ &:not([data-disabled]):not([data-readonly]) {
4941
4961
  &:hover {
4942
4962
  @media (hover: hover) {
4943
4963
  cursor: pointer;
@@ -5037,9 +5057,11 @@
5037
5057
  transition: border-color var(--animation-duration-in, 250ms) ease-in-out, box-shadow var(--animation-duration-in, 250ms) ease-in-out, outline-color var(--animation-duration-in, 250ms) ease-in-out, outline-offset var(--animation-duration-in, 250ms) ease-in-out, color var(--animation-duration-in, 250ms) ease-in-out, background-color var(--animation-duration-in, 250ms) ease-in-out;
5038
5058
  &:not([data-disabled]):not([data-invalid]) {
5039
5059
  background-color: var(--color-input-background);
5040
- &:hover {
5041
- @media (hover: hover) {
5042
- border-color: var(--color-primary-hover);
5060
+ &:not([data-readonly]) {
5061
+ &:hover {
5062
+ @media (hover: hover) {
5063
+ border-color: var(--color-primary-hover);
5064
+ }
5043
5065
  }
5044
5066
  }
5045
5067
  &:not([data-value]) {
@@ -5055,9 +5077,11 @@
5055
5077
  @supports (color: color-mix(in lab, red, red)) {
5056
5078
  background-color: color-mix(in oklab, var(--color-negative) 20%, transparent);
5057
5079
  }
5058
- &:hover {
5059
- @media (hover: hover) {
5060
- border-color: var(--color-negative-hover);
5080
+ &:not([data-readonly]) {
5081
+ &:hover {
5082
+ @media (hover: hover) {
5083
+ border-color: var(--color-negative-hover);
5084
+ }
5061
5085
  }
5062
5086
  }
5063
5087
  --color-focus: var(--color-negative);
@@ -5508,9 +5532,11 @@
5508
5532
  transition: border-color var(--animation-duration-in, 250ms) ease-in-out, box-shadow var(--animation-duration-in, 250ms) ease-in-out, outline-color var(--animation-duration-in, 250ms) ease-in-out, outline-offset var(--animation-duration-in, 250ms) ease-in-out, color var(--animation-duration-in, 250ms) ease-in-out, background-color var(--animation-duration-in, 250ms) ease-in-out;
5509
5533
  &:not([data-disabled]):not([data-invalid]) {
5510
5534
  background-color: var(--color-input-background);
5511
- &:hover {
5512
- @media (hover: hover) {
5513
- border-color: var(--color-primary-hover);
5535
+ &:not([data-readonly]) {
5536
+ &:hover {
5537
+ @media (hover: hover) {
5538
+ border-color: var(--color-primary-hover);
5539
+ }
5514
5540
  }
5515
5541
  }
5516
5542
  &:not([data-value]) {
@@ -5526,9 +5552,11 @@
5526
5552
  @supports (color: color-mix(in lab, red, red)) {
5527
5553
  background-color: color-mix(in oklab, var(--color-negative) 20%, transparent);
5528
5554
  }
5529
- &:hover {
5530
- @media (hover: hover) {
5531
- border-color: var(--color-negative-hover);
5555
+ &:not([data-readonly]) {
5556
+ &:hover {
5557
+ @media (hover: hover) {
5558
+ border-color: var(--color-negative-hover);
5559
+ }
5532
5560
  }
5533
5561
  }
5534
5562
  --color-focus: var(--color-negative);
@@ -9,7 +9,11 @@
9
9
  background-color var(--animation-duration-in, 250ms) ease-in-out;
10
10
 
11
11
  &:not([data-disabled]):not([data-invalid]) {
12
- @apply bg-input-background hover:border-primary-hover;
12
+ @apply bg-input-background;
13
+
14
+ &:not([data-readonly]) {
15
+ @apply hover:border-primary-hover;
16
+ }
13
17
 
14
18
  &:not([data-value]) {
15
19
  @apply text-placeholder;
@@ -21,7 +25,11 @@
21
25
  }
22
26
 
23
27
  &:not([data-disabled])[data-invalid] {
24
- @apply bg-negative/20 border-negative hover:border-negative-hover;
28
+ @apply bg-negative/20 border-negative;
29
+
30
+ &:not([data-readonly]) {
31
+ @apply hover:border-negative-hover;
32
+ }
25
33
 
26
34
  --color-focus: var(--color-negative);
27
35
 
@@ -4,7 +4,7 @@
4
4
  [data-name="multi-select-button"] {
5
5
  @apply input-element flex-row-2 items-center justify-between rounded-md px-3 py-2;
6
6
 
7
- &:not([data-disabled]) {
7
+ &:not([data-disabled]):not([data-readonly]) {
8
8
  @apply hover:cursor-pointer;
9
9
  }
10
10
  }
@@ -12,7 +12,7 @@
12
12
  [data-name="multi-select-chip-display-button"] {
13
13
  @apply input-element flex flex-wrap gap-2 items-center rounded-md px-2.5 py-2.5;
14
14
 
15
- &:not([data-disabled]) {
15
+ &:not([data-disabled]):not([data-readonly]) {
16
16
  @apply hover:cursor-pointer;
17
17
  }
18
18
  }
package/package.json CHANGED
@@ -10,7 +10,7 @@
10
10
  "access": "public"
11
11
  },
12
12
  "license": "MPL-2.0",
13
- "version": "0.10.0",
13
+ "version": "0.10.2",
14
14
  "files": [
15
15
  "dist"
16
16
  ],