@tiny-design/react 1.4.0 → 1.5.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 (168) hide show
  1. package/es/alert/style/_index.scss +2 -2
  2. package/es/alert/style/index.css +2 -2
  3. package/es/auto-complete/style/_index.scss +4 -5
  4. package/es/auto-complete/style/index.css +4 -5
  5. package/es/breadcrumb/style/index.css +1 -1
  6. package/es/breadcrumb/types.d.ts +1 -1
  7. package/es/button/style/index.css +14 -14
  8. package/es/calendar/style/_index.scss +9 -9
  9. package/es/calendar/style/index.css +9 -9
  10. package/es/card/style/index.css +3 -3
  11. package/es/cascader/style/_index.scss +9 -9
  12. package/es/cascader/style/index.css +9 -9
  13. package/es/checkbox/style/_index.scss +9 -12
  14. package/es/checkbox/style/index.css +9 -12
  15. package/es/collapse/style/index.css +3 -3
  16. package/es/color-picker/style/_index.scss +7 -7
  17. package/es/color-picker/style/index.css +4 -4
  18. package/es/date-picker/style/_index.scss +1 -1
  19. package/es/date-picker/style/index.css +1 -1
  20. package/es/descriptions/style/_index.scss +5 -6
  21. package/es/descriptions/style/index.css +6 -6
  22. package/es/empty/style/_index.scss +1 -1
  23. package/es/empty/style/index.css +1 -1
  24. package/es/form/style/_index.scss +5 -6
  25. package/es/form/style/index.css +4 -4
  26. package/es/index.d.ts +2 -1
  27. package/es/index.js +2 -1
  28. package/es/input/style/_index.scss +5 -4
  29. package/es/input/style/_mixin.scss +1 -1
  30. package/es/input/style/index.css +21 -20
  31. package/es/input-number/input-number.js +11 -5
  32. package/es/input-number/input-number.js.map +1 -1
  33. package/es/input-number/style/_index.scss +5 -3
  34. package/es/input-number/style/index.css +13 -11
  35. package/es/input-otp/style/_index.scss +1 -1
  36. package/es/input-otp/style/index.css +8 -8
  37. package/es/list/style/_index.scss +3 -3
  38. package/es/list/style/index.css +3 -3
  39. package/es/marquee/index.d.ts +1 -0
  40. package/es/marquee/index.js +9 -0
  41. package/es/marquee/index.js.map +1 -0
  42. package/es/marquee/marquee.d.ts +8 -0
  43. package/es/marquee/marquee.js +42 -0
  44. package/es/marquee/marquee.js.map +1 -0
  45. package/es/marquee/style/_index.scss +77 -0
  46. package/es/marquee/style/index.css +64 -0
  47. package/es/marquee/style/index.d.ts +1 -0
  48. package/es/marquee/style/index.js +1 -0
  49. package/es/marquee/types.d.ts +21 -0
  50. package/es/native-select/style/index.css +4 -4
  51. package/es/notification/style/_index.scss +1 -1
  52. package/es/notification/style/index.css +1 -1
  53. package/es/pop-confirm/style/_index.scss +1 -1
  54. package/es/pop-confirm/style/index.css +1 -1
  55. package/es/popup/style/_index.scss +9 -9
  56. package/es/popup/style/index.css +10 -10
  57. package/es/radio/style/_index.scss +5 -8
  58. package/es/radio/style/index.css +5 -8
  59. package/es/segmented/style/_index.scss +10 -10
  60. package/es/segmented/style/index.css +9 -9
  61. package/es/select/style/_index.scss +16 -17
  62. package/es/select/style/index.css +15 -16
  63. package/es/speed-dial/style/_index.scss +2 -2
  64. package/es/speed-dial/style/index.css +2 -2
  65. package/es/statistic/style/_index.scss +2 -2
  66. package/es/statistic/style/index.css +2 -2
  67. package/es/style/_component.scss +1 -0
  68. package/es/style/base.css +57 -0
  69. package/es/table/style/_index.scss +6 -6
  70. package/es/table/style/index.css +5 -5
  71. package/es/tag/style/index.css +1 -1
  72. package/es/textarea/style/index.css +2 -2
  73. package/es/time-picker/style/_index.scss +1 -1
  74. package/es/time-picker/style/index.css +1 -1
  75. package/es/timeline/style/_index.scss +3 -3
  76. package/es/timeline/style/index.css +3 -3
  77. package/es/tooltip/style/index.css +1 -1
  78. package/es/transfer/style/_index.scss +4 -4
  79. package/es/transfer/style/index.css +4 -4
  80. package/es/tree/style/index.css +1 -1
  81. package/es/typography/style/_index.scss +2 -2
  82. package/es/typography/style/index.css +2 -2
  83. package/es/upload/style/_index.scss +4 -4
  84. package/es/upload/style/index.css +4 -4
  85. package/lib/alert/style/_index.scss +2 -2
  86. package/lib/alert/style/index.css +2 -2
  87. package/lib/auto-complete/style/_index.scss +4 -5
  88. package/lib/auto-complete/style/index.css +4 -5
  89. package/lib/breadcrumb/style/index.css +1 -1
  90. package/lib/breadcrumb/types.d.ts +1 -1
  91. package/lib/button/style/index.css +14 -14
  92. package/lib/calendar/style/_index.scss +9 -9
  93. package/lib/calendar/style/index.css +9 -9
  94. package/lib/card/style/index.css +3 -3
  95. package/lib/cascader/style/_index.scss +9 -9
  96. package/lib/cascader/style/index.css +9 -9
  97. package/lib/checkbox/style/_index.scss +9 -12
  98. package/lib/checkbox/style/index.css +9 -12
  99. package/lib/collapse/style/index.css +3 -3
  100. package/lib/color-picker/style/_index.scss +7 -7
  101. package/lib/color-picker/style/index.css +4 -4
  102. package/lib/date-picker/style/_index.scss +1 -1
  103. package/lib/date-picker/style/index.css +1 -1
  104. package/lib/descriptions/style/_index.scss +5 -6
  105. package/lib/descriptions/style/index.css +6 -6
  106. package/lib/empty/style/_index.scss +1 -1
  107. package/lib/empty/style/index.css +1 -1
  108. package/lib/form/style/_index.scss +5 -6
  109. package/lib/form/style/index.css +4 -4
  110. package/lib/index.d.ts +2 -1
  111. package/lib/index.js +76 -74
  112. package/lib/input/style/_index.scss +5 -4
  113. package/lib/input/style/_mixin.scss +1 -1
  114. package/lib/input/style/index.css +21 -20
  115. package/lib/input-number/input-number.js +11 -5
  116. package/lib/input-number/input-number.js.map +1 -1
  117. package/lib/input-number/style/_index.scss +5 -3
  118. package/lib/input-number/style/index.css +13 -11
  119. package/lib/input-otp/style/_index.scss +1 -1
  120. package/lib/input-otp/style/index.css +8 -8
  121. package/lib/list/style/_index.scss +3 -3
  122. package/lib/list/style/index.css +3 -3
  123. package/lib/marquee/index.js +8 -0
  124. package/lib/marquee/index.js.map +1 -0
  125. package/lib/marquee/marquee.d.ts +8 -0
  126. package/lib/marquee/marquee.js +45 -0
  127. package/lib/marquee/marquee.js.map +1 -0
  128. package/lib/marquee/style/_index.scss +77 -0
  129. package/lib/marquee/style/index.css +64 -0
  130. package/lib/marquee/style/index.d.ts +1 -0
  131. package/lib/marquee/style/index.js +1 -0
  132. package/lib/marquee/types.d.ts +21 -0
  133. package/lib/native-select/style/index.css +4 -4
  134. package/lib/notification/style/_index.scss +1 -1
  135. package/lib/notification/style/index.css +1 -1
  136. package/lib/pop-confirm/style/_index.scss +1 -1
  137. package/lib/pop-confirm/style/index.css +1 -1
  138. package/lib/popup/style/_index.scss +9 -9
  139. package/lib/popup/style/index.css +10 -10
  140. package/lib/radio/style/_index.scss +5 -8
  141. package/lib/radio/style/index.css +5 -8
  142. package/lib/segmented/style/_index.scss +10 -10
  143. package/lib/segmented/style/index.css +9 -9
  144. package/lib/select/style/_index.scss +16 -17
  145. package/lib/select/style/index.css +15 -16
  146. package/lib/speed-dial/style/_index.scss +2 -2
  147. package/lib/speed-dial/style/index.css +2 -2
  148. package/lib/statistic/style/_index.scss +2 -2
  149. package/lib/statistic/style/index.css +2 -2
  150. package/lib/style/_component.scss +1 -0
  151. package/lib/style/base.css +57 -0
  152. package/lib/table/style/_index.scss +6 -6
  153. package/lib/table/style/index.css +5 -5
  154. package/lib/tag/style/index.css +1 -1
  155. package/lib/textarea/style/index.css +2 -2
  156. package/lib/time-picker/style/_index.scss +1 -1
  157. package/lib/time-picker/style/index.css +1 -1
  158. package/lib/timeline/style/_index.scss +3 -3
  159. package/lib/timeline/style/index.css +3 -3
  160. package/lib/tooltip/style/index.css +1 -1
  161. package/lib/transfer/style/_index.scss +4 -4
  162. package/lib/transfer/style/index.css +4 -4
  163. package/lib/tree/style/index.css +1 -1
  164. package/lib/typography/style/_index.scss +2 -2
  165. package/lib/typography/style/index.css +2 -2
  166. package/lib/upload/style/_index.scss +4 -4
  167. package/lib/upload/style/index.css +4 -4
  168. package/package.json +3 -3
package/lib/textarea/style/index.css CHANGED
@@ -6,8 +6,8 @@
6
6
  border: 1px solid var(--ty-input-border);
7
7
  transition: all 0.3s;
8
8
  outline: 0;
9
- border-radius: 2px;
10
- font-size: 1rem;
9
+ border-radius: var(--ty-border-radius);
10
+ font-size: var(--ty-font-size-base);
11
11
  background-color: var(--ty-input-bg);
12
12
  }
13
13
  .ty-textarea:hover {
package/lib/time-picker/style/_index.scss CHANGED
@@ -5,7 +5,7 @@ $tp: #{$prefix}-time-picker;
5
5
  .#{$tp} {
6
6
  display: inline-flex;
7
7
  position: relative;
8
- font-size: $font-size-base;
8
+ font-size: var(--ty-font-size-base);
9
9
 
10
10
  // ---- Input ----
11
11
  &__input {
package/lib/time-picker/style/index.css CHANGED
@@ -1,7 +1,7 @@
1
1
  .ty-time-picker {
2
2
  display: inline-flex;
3
3
  position: relative;
4
- font-size: 1rem;
4
+ font-size: var(--ty-font-size-base);
5
5
  }
6
6
  .ty-time-picker__input {
7
7
  display: inline-flex;
package/lib/timeline/style/_index.scss CHANGED
@@ -3,7 +3,7 @@
3
3
  .#{$prefix}-timeline {
4
4
  box-sizing: border-box;
5
5
  color: var(--ty-color-text-secondary);
6
- font-size: $font-size-base;
6
+ font-size: var(--ty-font-size-base);
7
7
  line-height: 1.5;
8
8
  margin: 0;
9
9
  padding: 0;
@@ -20,7 +20,7 @@
20
20
 
21
21
  &:last-child {
22
22
  .#{$prefix}-timeline-item__head {
23
- &:before {
23
+ &::before {
24
24
  display: none;
25
25
  }
26
26
  }
@@ -33,7 +33,7 @@
33
33
  color: var(--ty-color-primary);
34
34
  height: 100%;
35
35
 
36
- &:before {
36
+ &::before {
37
37
  content: '';
38
38
  position: absolute;
39
39
  top: 0;
package/lib/timeline/style/index.css CHANGED
@@ -1,7 +1,7 @@
1
1
  .ty-timeline {
2
2
  box-sizing: border-box;
3
3
  color: var(--ty-color-text-secondary);
4
- font-size: 1rem;
4
+ font-size: var(--ty-font-size-base);
5
5
  line-height: 1.5;
6
6
  margin: 0;
7
7
  padding: 0;
@@ -16,7 +16,7 @@
16
16
  font-size: 14px;
17
17
  list-style: none;
18
18
  }
19
- .ty-timeline-item:last-child .ty-timeline-item__head:before {
19
+ .ty-timeline-item:last-child .ty-timeline-item__head::before {
20
20
  display: none;
21
21
  }
22
22
  .ty-timeline-item__head {
@@ -26,7 +26,7 @@
26
26
  color: var(--ty-color-primary);
27
27
  height: 100%;
28
28
  }
29
- .ty-timeline-item__head:before {
29
+ .ty-timeline-item__head::before {
30
30
  content: "";
31
31
  position: absolute;
32
32
  top: 0;
package/lib/tooltip/style/index.css CHANGED
@@ -1,5 +1,5 @@
1
1
  .ty-tooltip {
2
- font-size: 0.875rem;
2
+ font-size: var(--ty-font-size-sm);
3
3
  }
4
4
  .ty-tooltip__inner {
5
5
  padding: 5px 8px;
package/lib/transfer/style/_index.scss CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  .#{$prefix}-transfer {
4
4
  box-sizing: border-box;
5
- font-size: $font-size-base;
5
+ font-size: var(--ty-font-size-base);
6
6
  color: var(--ty-color-text);
7
7
 
8
8
  &__left-arrow {
@@ -34,14 +34,14 @@
34
34
  vertical-align: middle;
35
35
  width: 180px;
36
36
  border: 1px solid var(--ty-transfer-border);
37
- border-radius: $border-radius;
37
+ border-radius: var(--ty-border-radius);
38
38
 
39
39
  &__header {
40
40
  padding: 8px 12px 9px;
41
41
  color: var(--ty-color-text);
42
42
  background: var(--ty-transfer-header-bg);
43
43
  border-bottom: 1px solid var(--ty-transfer-footer-border);
44
- border-radius: $border-radius $border-radius 0 0;
44
+ border-radius: var(--ty-border-radius) var(--ty-border-radius) 0 0;
45
45
  }
46
46
 
47
47
  &__body {
@@ -93,6 +93,6 @@
93
93
  padding: 8px 12px 9px;
94
94
  border-top: 1px solid var(--ty-transfer-footer-border);
95
95
  background-color: var(--ty-transfer-footer-bg);
96
- border-radius: 0 0 $border-radius $border-radius;
96
+ border-radius: 0 0 var(--ty-border-radius) var(--ty-border-radius);
97
97
  }
98
98
  }
package/lib/transfer/style/index.css CHANGED
@@ -1,6 +1,6 @@
1
1
  .ty-transfer {
2
2
  box-sizing: border-box;
3
- font-size: 1rem;
3
+ font-size: var(--ty-font-size-base);
4
4
  color: var(--ty-color-text);
5
5
  }
6
6
  .ty-transfer__left-arrow {
@@ -28,14 +28,14 @@
28
28
  vertical-align: middle;
29
29
  width: 180px;
30
30
  border: 1px solid var(--ty-transfer-border);
31
- border-radius: 2px;
31
+ border-radius: var(--ty-border-radius);
32
32
  }
33
33
  .ty-transfer-panel__header {
34
34
  padding: 8px 12px 9px;
35
35
  color: var(--ty-color-text);
36
36
  background: var(--ty-transfer-header-bg);
37
37
  border-bottom: 1px solid var(--ty-transfer-footer-border);
38
- border-radius: 2px 2px 0 0;
38
+ border-radius: var(--ty-border-radius) var(--ty-border-radius) 0 0;
39
39
  }
40
40
  .ty-transfer-panel__body {
41
41
  position: relative;
@@ -79,5 +79,5 @@
79
79
  padding: 8px 12px 9px;
80
80
  border-top: 1px solid var(--ty-transfer-footer-border);
81
81
  background-color: var(--ty-transfer-footer-bg);
82
- border-radius: 0 0 2px 2px;
82
+ border-radius: 0 0 var(--ty-border-radius) var(--ty-border-radius);
83
83
  }
package/lib/tree/style/index.css CHANGED
@@ -2,7 +2,7 @@
2
2
  margin: 0;
3
3
  padding: 0;
4
4
  list-style: none;
5
- font-size: 1rem;
5
+ font-size: var(--ty-font-size-base);
6
6
  }
7
7
 
8
8
  .ty-tree-node {
package/lib/typography/style/_index.scss CHANGED
@@ -36,7 +36,7 @@ $tp-prefix: #{$prefix}-typography;
36
36
  font-size: 85%;
37
37
  background: var(--ty-typography-code-bg);
38
38
  border: 1px solid var(--ty-typography-code-border);
39
- border-radius: $border-radius;
39
+ border-radius: var(--ty-border-radius);
40
40
  }
41
41
 
42
42
  mark {
@@ -99,7 +99,7 @@ p.#{$tp-prefix}, div.#{$tp-prefix} {
99
99
  margin-top: 0;
100
100
  margin-bottom: 1em;
101
101
  color: var(--ty-typography-body-color);
102
- font-size: $font-size-base;
102
+ font-size: var(--ty-font-size-base);
103
103
  line-height: 1.5;
104
104
  }
105
105
 
package/lib/typography/style/index.css CHANGED
@@ -24,7 +24,7 @@
24
24
  font-size: 85%;
25
25
  background: var(--ty-typography-code-bg);
26
26
  border: 1px solid var(--ty-typography-code-border);
27
- border-radius: 2px;
27
+ border-radius: var(--ty-border-radius);
28
28
  }
29
29
  .ty-typography mark {
30
30
  padding: 0;
@@ -83,7 +83,7 @@ p.ty-typography, div.ty-typography {
83
83
  margin-top: 0;
84
84
  margin-bottom: 1em;
85
85
  color: var(--ty-typography-body-color);
86
- font-size: 1rem;
86
+ font-size: var(--ty-font-size-base);
87
87
  line-height: 1.5;
88
88
  }
89
89
 
package/lib/upload/style/_index.scss CHANGED
@@ -7,7 +7,7 @@
7
7
  margin: 0;
8
8
  padding: 0;
9
9
  color: var(--ty-color-text);
10
- font-size: $font-size-base;
10
+ font-size: var(--ty-font-size-base);
11
11
  outline: 0;
12
12
 
13
13
  &__upload-list {
@@ -16,12 +16,12 @@
16
16
  padding: 0;
17
17
  box-sizing: border-box;
18
18
  color: var(--ty-color-text);
19
- font-size: $font-size-base;
19
+ font-size: var(--ty-font-size-base);
20
20
  }
21
21
 
22
22
  &__upload-list-item {
23
23
  margin-top: 5px;
24
- font-size: $font-size-base;
24
+ font-size: var(--ty-font-size-base);
25
25
  transition: background-color 300ms;
26
26
 
27
27
  &:hover {
@@ -82,7 +82,7 @@
82
82
  text-align: center;
83
83
  background: var(--ty-upload-dragger-bg);
84
84
  border: 1px dashed var(--ty-upload-dragger-border);
85
- border-radius: $border-radius;
85
+ border-radius: var(--ty-border-radius);
86
86
  cursor: pointer;
87
87
  transition: border-color 300ms, background-color 300ms;
88
88
 
package/lib/upload/style/index.css CHANGED
@@ -30,7 +30,7 @@
30
30
  margin: 0;
31
31
  padding: 0;
32
32
  color: var(--ty-color-text);
33
- font-size: 1rem;
33
+ font-size: var(--ty-font-size-base);
34
34
  outline: 0;
35
35
  }
36
36
  .ty-upload__upload-list {
@@ -39,11 +39,11 @@
39
39
  padding: 0;
40
40
  box-sizing: border-box;
41
41
  color: var(--ty-color-text);
42
- font-size: 1rem;
42
+ font-size: var(--ty-font-size-base);
43
43
  }
44
44
  .ty-upload__upload-list-item {
45
45
  margin-top: 5px;
46
- font-size: 1rem;
46
+ font-size: var(--ty-font-size-base);
47
47
  transition: background-color 300ms;
48
48
  }
49
49
  .ty-upload__upload-list-item:hover {
@@ -92,7 +92,7 @@
92
92
  text-align: center;
93
93
  background: var(--ty-upload-dragger-bg);
94
94
  border: 1px dashed var(--ty-upload-dragger-border);
95
- border-radius: 2px;
95
+ border-radius: var(--ty-border-radius);
96
96
  cursor: pointer;
97
97
  transition: border-color 300ms, background-color 300ms;
98
98
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tiny-design/react",
3
- "version": "1.4.0",
3
+ "version": "1.5.0",
4
4
  "description": "A friendly UI component set for React",
5
5
  "license": "MIT",
6
6
  "keywords": [
@@ -54,8 +54,8 @@
54
54
  "@popperjs/core": "^2.11.4",
55
55
  "classnames": "^2.3.1",
56
56
  "tslib": "^2.3.1",
57
- "@tiny-design/icons": "1.4.0",
58
- "@tiny-design/tokens": "1.4.0"
57
+ "@tiny-design/icons": "1.5.0",
58
+ "@tiny-design/tokens": "1.5.0"
59
59
  },
60
60
  "devDependencies": {
61
61
  "@testing-library/jest-dom": "^6.0.0",