@qn-pandora/pandora-component 3.0.0 → 3.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 (239) hide show
  1. package/CHANGELOG.json +21 -1
  2. package/CHANGELOG.md +12 -4
  3. package/es/components/AutoComplete/style.css +4 -1
  4. package/es/components/Button/index.js +1 -1
  5. package/es/components/Card/style.css +10 -2
  6. package/es/components/CheckTransformList/Item/index.js +7 -3
  7. package/es/components/CheckTransformList/index.js +1 -1
  8. package/es/components/CheckTransformList/style.css +17 -7
  9. package/es/components/Collapse/Panel/index.d.ts +8 -40
  10. package/es/components/Collapse/Panel/index.js +34 -44
  11. package/es/components/Collapse/index.d.ts +15 -20
  12. package/es/components/Collapse/index.js +44 -18
  13. package/es/components/Collapse/style.css +210 -0
  14. package/es/components/Collapse/style.less +57 -0
  15. package/es/components/DateTimePicker/Base/index.d.ts +1 -0
  16. package/es/components/DateTimePicker/Base/index.js +29 -13
  17. package/es/components/DateTimePicker/Base/relativeTimePicker.d.ts +1 -0
  18. package/es/components/DateTimePicker/Base/relativeTimePicker.js +16 -3
  19. package/es/components/DateTimePicker/Base/style.css +7 -12
  20. package/es/components/DateTimePicker/BaseMobile/Absolute/index.d.ts +1 -0
  21. package/es/components/DateTimePicker/BaseMobile/Absolute/index.js +8 -3
  22. package/es/components/DateTimePicker/BaseMobile/index.d.ts +2 -0
  23. package/es/components/DateTimePicker/BaseMobile/index.js +7 -2
  24. package/es/components/DateTimePicker/Collapse/Panel/index.d.ts +41 -0
  25. package/es/components/DateTimePicker/Collapse/Panel/index.js +51 -0
  26. package/es/components/{Collapse → DateTimePicker/Collapse}/Panel/style.css +0 -0
  27. package/es/components/{Collapse → DateTimePicker/Collapse}/Panel/style.less +1 -1
  28. package/es/components/DateTimePicker/Collapse/index.d.ts +24 -0
  29. package/es/components/DateTimePicker/Collapse/index.js +42 -0
  30. package/es/components/DateTimePicker/DisplayInput/index.d.ts +1 -0
  31. package/es/components/DateTimePicker/DisplayInput/index.js +4 -1
  32. package/es/components/DateTimePicker/DisplayInput/style.css +17 -7
  33. package/es/components/DateTimePicker/constants.d.ts +4 -5
  34. package/es/components/DateTimePicker/constants.js +39 -44
  35. package/es/components/DateTimePicker/style.css +155 -57
  36. package/es/components/DateTimePicker/time.d.ts +2 -2
  37. package/es/components/DateTimePicker/time.js +17 -11
  38. package/es/components/Input/style.css +17 -7
  39. package/es/components/InputNumber/style.css +1 -1
  40. package/es/components/Menu/Option.d.ts +1 -1
  41. package/es/components/Menu/style.css +4 -0
  42. package/es/components/NameLimiter/index.js +1 -0
  43. package/es/components/OptionList/PopoverOptionList/style.css +155 -57
  44. package/es/components/OptionList/style.css +155 -57
  45. package/es/components/RadioGroup/index.d.ts +53 -0
  46. package/es/components/RadioGroup/index.js +31 -0
  47. package/es/components/{SolidRadioGroup → RadioGroup}/style.css +43 -50
  48. package/es/components/RadioGroup/style.less +32 -0
  49. package/es/components/RangeInput/index.js +13 -7
  50. package/es/components/RangeInput/style.css +18 -8
  51. package/es/components/Selector/index.js +2 -2
  52. package/es/components/Selector/style.css +4 -1
  53. package/es/components/SolidRadioGroup/index.d.ts +3 -45
  54. package/es/components/SolidRadioGroup/index.js +13 -25
  55. package/es/components/Steps/ControlButton/index.js +8 -2
  56. package/es/components/Steps/style.css +0 -5
  57. package/es/components/Steps/style.less +0 -5
  58. package/es/components/Table/index.d.ts +1 -0
  59. package/es/components/Table/index.js +14 -5
  60. package/es/components/Table/style.css +20 -8
  61. package/es/components/Table/style.less +10 -3
  62. package/es/components/Tabs/style.css +10 -2
  63. package/es/components/Timeline/TimelineItem/index.js +6 -4
  64. package/es/components/Timeline/TimelineItem/style.css +1 -2
  65. package/es/components/Timeline/TimelineItem/style.less +1 -2
  66. package/es/components/Transfer/List/index.js +9 -4
  67. package/es/constants/language/check_transform_list/en.d.ts +2 -0
  68. package/es/constants/language/check_transform_list/en.js +5 -0
  69. package/es/constants/language/check_transform_list/type.d.ts +6 -0
  70. package/es/constants/language/check_transform_list/type.js +3 -0
  71. package/es/constants/language/check_transform_list/zh.d.ts +2 -0
  72. package/es/constants/language/check_transform_list/zh.js +5 -0
  73. package/es/constants/language/datetime/en.d.ts +2 -0
  74. package/es/constants/language/datetime/en.js +79 -0
  75. package/es/constants/language/datetime/type.d.ts +80 -0
  76. package/es/constants/language/datetime/type.js +3 -0
  77. package/es/constants/language/datetime/zh.d.ts +2 -0
  78. package/es/constants/language/datetime/zh.js +79 -0
  79. package/es/constants/language/en.d.ts +2 -0
  80. package/es/constants/language/en.js +14 -0
  81. package/es/constants/language/range_input/en.d.ts +2 -0
  82. package/es/constants/language/range_input/en.js +7 -0
  83. package/es/constants/language/range_input/type.d.ts +8 -0
  84. package/es/constants/language/range_input/type.js +3 -0
  85. package/es/constants/language/range_input/zh.d.ts +2 -0
  86. package/es/constants/language/range_input/zh.js +7 -0
  87. package/es/constants/language/steps/en.d.ts +2 -0
  88. package/es/constants/language/steps/en.js +4 -0
  89. package/es/constants/language/steps/type.d.ts +5 -0
  90. package/es/constants/language/steps/type.js +3 -0
  91. package/es/constants/language/steps/zh.d.ts +2 -0
  92. package/es/constants/language/steps/zh.js +4 -0
  93. package/es/constants/language/table/en.d.ts +2 -0
  94. package/es/constants/language/table/en.js +4 -0
  95. package/es/constants/language/table/type.d.ts +5 -0
  96. package/es/constants/language/table/type.js +3 -0
  97. package/es/constants/language/table/zh.d.ts +2 -0
  98. package/es/constants/language/table/zh.js +4 -0
  99. package/es/constants/language/transfer/en.d.ts +2 -0
  100. package/es/constants/language/transfer/en.js +4 -0
  101. package/es/constants/language/transfer/type.d.ts +5 -0
  102. package/es/constants/language/transfer/type.js +3 -0
  103. package/es/constants/language/transfer/zh.d.ts +2 -0
  104. package/es/constants/language/transfer/zh.js +4 -0
  105. package/es/constants/language/type.d.ts +15 -0
  106. package/es/constants/language/type.js +3 -0
  107. package/es/constants/language/zh.d.ts +2 -0
  108. package/es/constants/language/zh.js +14 -0
  109. package/es/index.css +3138 -2827
  110. package/es/index.d.ts +2 -1
  111. package/es/index.js +2 -1
  112. package/es/index.less +5 -5
  113. package/es/style/theme.less +9 -2
  114. package/es/utils/language.d.ts +1 -0
  115. package/es/utils/language.js +15 -0
  116. package/es/utils/languageLocale.d.ts +1 -0
  117. package/es/utils/languageLocale.js +9 -0
  118. package/lib/components/AutoComplete/style.css +4 -1
  119. package/lib/components/Button/index.js +1 -1
  120. package/lib/components/Card/style.css +10 -2
  121. package/lib/components/CheckTransformList/Item/index.js +7 -3
  122. package/lib/components/CheckTransformList/index.js +1 -1
  123. package/lib/components/CheckTransformList/style.css +17 -7
  124. package/lib/components/Collapse/Panel/index.d.ts +8 -40
  125. package/lib/components/Collapse/Panel/index.js +35 -45
  126. package/lib/components/Collapse/index.d.ts +15 -20
  127. package/lib/components/Collapse/index.js +47 -20
  128. package/lib/components/Collapse/style.css +210 -0
  129. package/lib/components/Collapse/style.less +57 -0
  130. package/lib/components/DateTimePicker/Base/index.d.ts +1 -0
  131. package/lib/components/DateTimePicker/Base/index.js +29 -13
  132. package/lib/components/DateTimePicker/Base/relativeTimePicker.d.ts +1 -0
  133. package/lib/components/DateTimePicker/Base/relativeTimePicker.js +16 -3
  134. package/lib/components/DateTimePicker/Base/style.css +7 -12
  135. package/lib/components/DateTimePicker/BaseMobile/Absolute/index.d.ts +1 -0
  136. package/lib/components/DateTimePicker/BaseMobile/Absolute/index.js +8 -3
  137. package/lib/components/DateTimePicker/BaseMobile/index.d.ts +2 -0
  138. package/lib/components/DateTimePicker/BaseMobile/index.js +7 -2
  139. package/lib/components/DateTimePicker/Collapse/Panel/index.d.ts +41 -0
  140. package/lib/components/DateTimePicker/Collapse/Panel/index.js +64 -0
  141. package/lib/components/{Collapse → DateTimePicker/Collapse}/Panel/style.css +0 -0
  142. package/lib/components/{Collapse → DateTimePicker/Collapse}/Panel/style.less +1 -1
  143. package/lib/components/DateTimePicker/Collapse/index.d.ts +24 -0
  144. package/lib/components/DateTimePicker/Collapse/index.js +54 -0
  145. package/lib/components/DateTimePicker/DisplayInput/index.d.ts +1 -0
  146. package/lib/components/DateTimePicker/DisplayInput/index.js +4 -1
  147. package/lib/components/DateTimePicker/DisplayInput/style.css +17 -7
  148. package/lib/components/DateTimePicker/constants.d.ts +4 -5
  149. package/lib/components/DateTimePicker/constants.js +39 -44
  150. package/lib/components/DateTimePicker/style.css +155 -57
  151. package/lib/components/DateTimePicker/time.d.ts +2 -2
  152. package/lib/components/DateTimePicker/time.js +16 -10
  153. package/lib/components/Input/style.css +17 -7
  154. package/lib/components/InputNumber/style.css +1 -1
  155. package/lib/components/Menu/Option.d.ts +1 -1
  156. package/lib/components/Menu/style.css +4 -0
  157. package/lib/components/NameLimiter/index.js +1 -0
  158. package/lib/components/OptionList/PopoverOptionList/style.css +155 -57
  159. package/lib/components/OptionList/style.css +155 -57
  160. package/lib/components/RadioGroup/index.d.ts +53 -0
  161. package/lib/components/RadioGroup/index.js +44 -0
  162. package/lib/components/{SolidRadioGroup → RadioGroup}/style.css +43 -50
  163. package/lib/components/RadioGroup/style.less +32 -0
  164. package/lib/components/RangeInput/index.js +13 -7
  165. package/lib/components/RangeInput/style.css +18 -8
  166. package/lib/components/Selector/index.js +1 -1
  167. package/lib/components/Selector/style.css +4 -1
  168. package/lib/components/SolidRadioGroup/index.d.ts +3 -45
  169. package/lib/components/SolidRadioGroup/index.js +13 -25
  170. package/lib/components/Steps/ControlButton/index.js +8 -2
  171. package/lib/components/Steps/style.css +0 -5
  172. package/lib/components/Steps/style.less +0 -5
  173. package/lib/components/Table/index.d.ts +1 -0
  174. package/lib/components/Table/index.js +14 -5
  175. package/lib/components/Table/style.css +20 -8
  176. package/lib/components/Table/style.less +10 -3
  177. package/lib/components/Tabs/style.css +10 -2
  178. package/lib/components/Timeline/TimelineItem/index.js +6 -4
  179. package/lib/components/Timeline/TimelineItem/style.css +1 -2
  180. package/lib/components/Timeline/TimelineItem/style.less +1 -2
  181. package/lib/components/Transfer/List/index.js +8 -3
  182. package/lib/constants/language/check_transform_list/en.d.ts +2 -0
  183. package/lib/constants/language/check_transform_list/en.js +7 -0
  184. package/lib/constants/language/check_transform_list/type.d.ts +6 -0
  185. package/lib/constants/language/check_transform_list/type.js +5 -0
  186. package/lib/constants/language/check_transform_list/zh.d.ts +2 -0
  187. package/lib/constants/language/check_transform_list/zh.js +7 -0
  188. package/lib/constants/language/datetime/en.d.ts +2 -0
  189. package/lib/constants/language/datetime/en.js +81 -0
  190. package/lib/constants/language/datetime/type.d.ts +80 -0
  191. package/lib/constants/language/datetime/type.js +5 -0
  192. package/lib/constants/language/datetime/zh.d.ts +2 -0
  193. package/lib/constants/language/datetime/zh.js +81 -0
  194. package/lib/constants/language/en.d.ts +2 -0
  195. package/lib/constants/language/en.js +16 -0
  196. package/lib/constants/language/range_input/en.d.ts +2 -0
  197. package/lib/constants/language/range_input/en.js +9 -0
  198. package/lib/constants/language/range_input/type.d.ts +8 -0
  199. package/lib/constants/language/range_input/type.js +5 -0
  200. package/lib/constants/language/range_input/zh.d.ts +2 -0
  201. package/lib/constants/language/range_input/zh.js +9 -0
  202. package/lib/constants/language/steps/en.d.ts +2 -0
  203. package/lib/constants/language/steps/en.js +6 -0
  204. package/lib/constants/language/steps/type.d.ts +5 -0
  205. package/lib/constants/language/steps/type.js +5 -0
  206. package/lib/constants/language/steps/zh.d.ts +2 -0
  207. package/lib/constants/language/steps/zh.js +6 -0
  208. package/lib/constants/language/table/en.d.ts +2 -0
  209. package/lib/constants/language/table/en.js +6 -0
  210. package/lib/constants/language/table/type.d.ts +5 -0
  211. package/lib/constants/language/table/type.js +5 -0
  212. package/lib/constants/language/table/zh.d.ts +2 -0
  213. package/lib/constants/language/table/zh.js +6 -0
  214. package/lib/constants/language/transfer/en.d.ts +2 -0
  215. package/lib/constants/language/transfer/en.js +6 -0
  216. package/lib/constants/language/transfer/type.d.ts +5 -0
  217. package/lib/constants/language/transfer/type.js +5 -0
  218. package/lib/constants/language/transfer/zh.d.ts +2 -0
  219. package/lib/constants/language/transfer/zh.js +6 -0
  220. package/lib/constants/language/type.d.ts +15 -0
  221. package/lib/constants/language/type.js +5 -0
  222. package/lib/constants/language/zh.d.ts +2 -0
  223. package/lib/constants/language/zh.js +16 -0
  224. package/lib/index.css +3754 -3443
  225. package/lib/index.d.ts +2 -1
  226. package/lib/index.js +3 -0
  227. package/lib/index.less +6 -6
  228. package/lib/style/theme.less +9 -2
  229. package/lib/utils/language.d.ts +1 -0
  230. package/lib/utils/language.js +21 -0
  231. package/lib/utils/languageLocale.d.ts +1 -0
  232. package/lib/utils/languageLocale.js +12 -0
  233. package/package.json +12 -9
  234. package/es/components/Collapse/stories/style.stories.css +0 -12
  235. package/es/components/Collapse/stories/style.stories.less +0 -7
  236. package/es/components/SolidRadioGroup/style.less +0 -39
  237. package/lib/components/Collapse/stories/style.stories.css +0 -12
  238. package/lib/components/Collapse/stories/style.stories.less +0 -7
  239. package/lib/components/SolidRadioGroup/style.less +0 -39
package/lib/components/OptionList/PopoverOptionList/style.css CHANGED
@@ -113,100 +113,198 @@
113
113
  display: block;
114
114
  width: 8.48528137px;
115
115
  height: 8.48528137px;
116
+ overflow: hidden;
116
117
  background: transparent;
117
- border-style: solid;
118
- border-width: 4.24264069px;
119
- -webkit-transform: rotate(45deg);
120
- transform: rotate(45deg);
121
- }
122
- .ant-popover-placement-top > .ant-popover-content > .ant-popover-arrow,
123
- .ant-popover-placement-topLeft > .ant-popover-content > .ant-popover-arrow,
124
- .ant-popover-placement-topRight > .ant-popover-content > .ant-popover-arrow {
125
- bottom: 6.2px;
126
- border-top-color: transparent;
127
- border-right-color: #ffffff;
128
- border-bottom-color: #ffffff;
129
- border-left-color: transparent;
118
+ pointer-events: none;
119
+ }
120
+ .ant-popover-arrow-content {
121
+ position: absolute;
122
+ top: 0;
123
+ right: 0;
124
+ bottom: 0;
125
+ left: 0;
126
+ display: block;
127
+ width: 6px;
128
+ height: 6px;
129
+ margin: auto;
130
+ background-color: #ffffff;
131
+ content: '';
132
+ pointer-events: auto;
133
+ }
134
+ .ant-popover-placement-top .ant-popover-arrow,
135
+ .ant-popover-placement-topLeft .ant-popover-arrow,
136
+ .ant-popover-placement-topRight .ant-popover-arrow {
137
+ bottom: 1.51471863px;
138
+ }
139
+ .ant-popover-placement-top .ant-popover-arrow-content,
140
+ .ant-popover-placement-topLeft .ant-popover-arrow-content,
141
+ .ant-popover-placement-topRight .ant-popover-arrow-content {
130
142
  -webkit-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);
131
143
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);
144
+ -webkit-transform: translateY(-4.24264069px) rotate(45deg);
145
+ transform: translateY(-4.24264069px) rotate(45deg);
132
146
  }
133
- .ant-popover-placement-top > .ant-popover-content > .ant-popover-arrow {
147
+ .ant-popover-placement-top .ant-popover-arrow {
134
148
  left: 50%;
135
- -webkit-transform: translateX(-50%) rotate(45deg);
136
- transform: translateX(-50%) rotate(45deg);
149
+ -webkit-transform: translateX(-50%);
150
+ transform: translateX(-50%);
137
151
  }
138
- .ant-popover-placement-topLeft > .ant-popover-content > .ant-popover-arrow {
152
+ .ant-popover-placement-topLeft .ant-popover-arrow {
139
153
  left: 16px;
140
154
  }
141
- .ant-popover-placement-topRight > .ant-popover-content > .ant-popover-arrow {
155
+ .ant-popover-placement-topRight .ant-popover-arrow {
142
156
  right: 16px;
143
157
  }
144
- .ant-popover-placement-right > .ant-popover-content > .ant-popover-arrow,
145
- .ant-popover-placement-rightTop > .ant-popover-content > .ant-popover-arrow,
146
- .ant-popover-placement-rightBottom > .ant-popover-content > .ant-popover-arrow {
147
- left: 6px;
148
- border-top-color: transparent;
149
- border-right-color: transparent;
150
- border-bottom-color: #ffffff;
151
- border-left-color: #ffffff;
158
+ .ant-popover-placement-right .ant-popover-arrow,
159
+ .ant-popover-placement-rightTop .ant-popover-arrow,
160
+ .ant-popover-placement-rightBottom .ant-popover-arrow {
161
+ left: 1.51471863px;
162
+ }
163
+ .ant-popover-placement-right .ant-popover-arrow-content,
164
+ .ant-popover-placement-rightTop .ant-popover-arrow-content,
165
+ .ant-popover-placement-rightBottom .ant-popover-arrow-content {
152
166
  -webkit-box-shadow: -3px 3px 7px rgba(0, 0, 0, 0.07);
153
167
  box-shadow: -3px 3px 7px rgba(0, 0, 0, 0.07);
168
+ -webkit-transform: translateX(4.24264069px) rotate(45deg);
169
+ transform: translateX(4.24264069px) rotate(45deg);
154
170
  }
155
- .ant-popover-placement-right > .ant-popover-content > .ant-popover-arrow {
171
+ .ant-popover-placement-right .ant-popover-arrow {
156
172
  top: 50%;
157
- -webkit-transform: translateY(-50%) rotate(45deg);
158
- transform: translateY(-50%) rotate(45deg);
173
+ -webkit-transform: translateY(-50%);
174
+ transform: translateY(-50%);
159
175
  }
160
- .ant-popover-placement-rightTop > .ant-popover-content > .ant-popover-arrow {
176
+ .ant-popover-placement-rightTop .ant-popover-arrow {
161
177
  top: 12px;
162
178
  }
163
- .ant-popover-placement-rightBottom > .ant-popover-content > .ant-popover-arrow {
179
+ .ant-popover-placement-rightBottom .ant-popover-arrow {
164
180
  bottom: 12px;
165
181
  }
166
- .ant-popover-placement-bottom > .ant-popover-content > .ant-popover-arrow,
167
- .ant-popover-placement-bottomLeft > .ant-popover-content > .ant-popover-arrow,
168
- .ant-popover-placement-bottomRight > .ant-popover-content > .ant-popover-arrow {
169
- top: 6px;
170
- border-top-color: #ffffff;
171
- border-right-color: transparent;
172
- border-bottom-color: transparent;
173
- border-left-color: #ffffff;
182
+ .ant-popover-placement-bottom .ant-popover-arrow,
183
+ .ant-popover-placement-bottomLeft .ant-popover-arrow,
184
+ .ant-popover-placement-bottomRight .ant-popover-arrow {
185
+ top: 1.51471863px;
186
+ }
187
+ .ant-popover-placement-bottom .ant-popover-arrow-content,
188
+ .ant-popover-placement-bottomLeft .ant-popover-arrow-content,
189
+ .ant-popover-placement-bottomRight .ant-popover-arrow-content {
174
190
  -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.06);
175
191
  box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.06);
192
+ -webkit-transform: translateY(4.24264069px) rotate(45deg);
193
+ transform: translateY(4.24264069px) rotate(45deg);
176
194
  }
177
- .ant-popover-placement-bottom > .ant-popover-content > .ant-popover-arrow {
195
+ .ant-popover-placement-bottom .ant-popover-arrow {
178
196
  left: 50%;
179
- -webkit-transform: translateX(-50%) rotate(45deg);
180
- transform: translateX(-50%) rotate(45deg);
197
+ -webkit-transform: translateX(-50%);
198
+ transform: translateX(-50%);
181
199
  }
182
- .ant-popover-placement-bottomLeft > .ant-popover-content > .ant-popover-arrow {
200
+ .ant-popover-placement-bottomLeft .ant-popover-arrow {
183
201
  left: 16px;
184
202
  }
185
- .ant-popover-placement-bottomRight > .ant-popover-content > .ant-popover-arrow {
203
+ .ant-popover-placement-bottomRight .ant-popover-arrow {
186
204
  right: 16px;
187
205
  }
188
- .ant-popover-placement-left > .ant-popover-content > .ant-popover-arrow,
189
- .ant-popover-placement-leftTop > .ant-popover-content > .ant-popover-arrow,
190
- .ant-popover-placement-leftBottom > .ant-popover-content > .ant-popover-arrow {
191
- right: 6px;
192
- border-top-color: #ffffff;
193
- border-right-color: #ffffff;
194
- border-bottom-color: transparent;
195
- border-left-color: transparent;
206
+ .ant-popover-placement-left .ant-popover-arrow,
207
+ .ant-popover-placement-leftTop .ant-popover-arrow,
208
+ .ant-popover-placement-leftBottom .ant-popover-arrow {
209
+ right: 1.51471863px;
210
+ }
211
+ .ant-popover-placement-left .ant-popover-arrow-content,
212
+ .ant-popover-placement-leftTop .ant-popover-arrow-content,
213
+ .ant-popover-placement-leftBottom .ant-popover-arrow-content {
196
214
  -webkit-box-shadow: 3px -3px 7px rgba(0, 0, 0, 0.07);
197
215
  box-shadow: 3px -3px 7px rgba(0, 0, 0, 0.07);
216
+ -webkit-transform: translateX(-4.24264069px) rotate(45deg);
217
+ transform: translateX(-4.24264069px) rotate(45deg);
198
218
  }
199
- .ant-popover-placement-left > .ant-popover-content > .ant-popover-arrow {
219
+ .ant-popover-placement-left .ant-popover-arrow {
200
220
  top: 50%;
201
- -webkit-transform: translateY(-50%) rotate(45deg);
202
- transform: translateY(-50%) rotate(45deg);
221
+ -webkit-transform: translateY(-50%);
222
+ transform: translateY(-50%);
203
223
  }
204
- .ant-popover-placement-leftTop > .ant-popover-content > .ant-popover-arrow {
224
+ .ant-popover-placement-leftTop .ant-popover-arrow {
205
225
  top: 12px;
206
226
  }
207
- .ant-popover-placement-leftBottom > .ant-popover-content > .ant-popover-arrow {
227
+ .ant-popover-placement-leftBottom .ant-popover-arrow {
208
228
  bottom: 12px;
209
229
  }
230
+ .ant-popover-pink .ant-popover-inner {
231
+ background-color: #eb2f96;
232
+ }
233
+ .ant-popover-pink .ant-popover-arrow-content {
234
+ background-color: #eb2f96;
235
+ }
236
+ .ant-popover-magenta .ant-popover-inner {
237
+ background-color: #eb2f96;
238
+ }
239
+ .ant-popover-magenta .ant-popover-arrow-content {
240
+ background-color: #eb2f96;
241
+ }
242
+ .ant-popover-red .ant-popover-inner {
243
+ background-color: #f5222d;
244
+ }
245
+ .ant-popover-red .ant-popover-arrow-content {
246
+ background-color: #f5222d;
247
+ }
248
+ .ant-popover-volcano .ant-popover-inner {
249
+ background-color: #fa541c;
250
+ }
251
+ .ant-popover-volcano .ant-popover-arrow-content {
252
+ background-color: #fa541c;
253
+ }
254
+ .ant-popover-orange .ant-popover-inner {
255
+ background-color: #fa8c16;
256
+ }
257
+ .ant-popover-orange .ant-popover-arrow-content {
258
+ background-color: #fa8c16;
259
+ }
260
+ .ant-popover-yellow .ant-popover-inner {
261
+ background-color: #fadb14;
262
+ }
263
+ .ant-popover-yellow .ant-popover-arrow-content {
264
+ background-color: #fadb14;
265
+ }
266
+ .ant-popover-gold .ant-popover-inner {
267
+ background-color: #faad14;
268
+ }
269
+ .ant-popover-gold .ant-popover-arrow-content {
270
+ background-color: #faad14;
271
+ }
272
+ .ant-popover-cyan .ant-popover-inner {
273
+ background-color: #13c2c2;
274
+ }
275
+ .ant-popover-cyan .ant-popover-arrow-content {
276
+ background-color: #13c2c2;
277
+ }
278
+ .ant-popover-lime .ant-popover-inner {
279
+ background-color: #a0d911;
280
+ }
281
+ .ant-popover-lime .ant-popover-arrow-content {
282
+ background-color: #a0d911;
283
+ }
284
+ .ant-popover-green .ant-popover-inner {
285
+ background-color: #52c41a;
286
+ }
287
+ .ant-popover-green .ant-popover-arrow-content {
288
+ background-color: #52c41a;
289
+ }
290
+ .ant-popover-blue .ant-popover-inner {
291
+ background-color: #1890ff;
292
+ }
293
+ .ant-popover-blue .ant-popover-arrow-content {
294
+ background-color: #1890ff;
295
+ }
296
+ .ant-popover-geekblue .ant-popover-inner {
297
+ background-color: #2f54eb;
298
+ }
299
+ .ant-popover-geekblue .ant-popover-arrow-content {
300
+ background-color: #2f54eb;
301
+ }
302
+ .ant-popover-purple .ant-popover-inner {
303
+ background-color: #722ed1;
304
+ }
305
+ .ant-popover-purple .ant-popover-arrow-content {
306
+ background-color: #722ed1;
307
+ }
210
308
  .ant-popover-rtl {
211
309
  direction: rtl;
212
310
  text-align: right;
package/lib/components/OptionList/style.css CHANGED
@@ -527,100 +527,198 @@
527
527
  display: block;
528
528
  width: 8.48528137px;
529
529
  height: 8.48528137px;
530
+ overflow: hidden;
530
531
  background: transparent;
531
- border-style: solid;
532
- border-width: 4.24264069px;
533
- -webkit-transform: rotate(45deg);
534
- transform: rotate(45deg);
535
- }
536
- .ant-popover-placement-top > .ant-popover-content > .ant-popover-arrow,
537
- .ant-popover-placement-topLeft > .ant-popover-content > .ant-popover-arrow,
538
- .ant-popover-placement-topRight > .ant-popover-content > .ant-popover-arrow {
539
- bottom: 6.2px;
540
- border-top-color: transparent;
541
- border-right-color: #ffffff;
542
- border-bottom-color: #ffffff;
543
- border-left-color: transparent;
532
+ pointer-events: none;
533
+ }
534
+ .ant-popover-arrow-content {
535
+ position: absolute;
536
+ top: 0;
537
+ right: 0;
538
+ bottom: 0;
539
+ left: 0;
540
+ display: block;
541
+ width: 6px;
542
+ height: 6px;
543
+ margin: auto;
544
+ background-color: #ffffff;
545
+ content: '';
546
+ pointer-events: auto;
547
+ }
548
+ .ant-popover-placement-top .ant-popover-arrow,
549
+ .ant-popover-placement-topLeft .ant-popover-arrow,
550
+ .ant-popover-placement-topRight .ant-popover-arrow {
551
+ bottom: 1.51471863px;
552
+ }
553
+ .ant-popover-placement-top .ant-popover-arrow-content,
554
+ .ant-popover-placement-topLeft .ant-popover-arrow-content,
555
+ .ant-popover-placement-topRight .ant-popover-arrow-content {
544
556
  -webkit-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);
545
557
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);
558
+ -webkit-transform: translateY(-4.24264069px) rotate(45deg);
559
+ transform: translateY(-4.24264069px) rotate(45deg);
546
560
  }
547
- .ant-popover-placement-top > .ant-popover-content > .ant-popover-arrow {
561
+ .ant-popover-placement-top .ant-popover-arrow {
548
562
  left: 50%;
549
- -webkit-transform: translateX(-50%) rotate(45deg);
550
- transform: translateX(-50%) rotate(45deg);
563
+ -webkit-transform: translateX(-50%);
564
+ transform: translateX(-50%);
551
565
  }
552
- .ant-popover-placement-topLeft > .ant-popover-content > .ant-popover-arrow {
566
+ .ant-popover-placement-topLeft .ant-popover-arrow {
553
567
  left: 16px;
554
568
  }
555
- .ant-popover-placement-topRight > .ant-popover-content > .ant-popover-arrow {
569
+ .ant-popover-placement-topRight .ant-popover-arrow {
556
570
  right: 16px;
557
571
  }
558
- .ant-popover-placement-right > .ant-popover-content > .ant-popover-arrow,
559
- .ant-popover-placement-rightTop > .ant-popover-content > .ant-popover-arrow,
560
- .ant-popover-placement-rightBottom > .ant-popover-content > .ant-popover-arrow {
561
- left: 6px;
562
- border-top-color: transparent;
563
- border-right-color: transparent;
564
- border-bottom-color: #ffffff;
565
- border-left-color: #ffffff;
572
+ .ant-popover-placement-right .ant-popover-arrow,
573
+ .ant-popover-placement-rightTop .ant-popover-arrow,
574
+ .ant-popover-placement-rightBottom .ant-popover-arrow {
575
+ left: 1.51471863px;
576
+ }
577
+ .ant-popover-placement-right .ant-popover-arrow-content,
578
+ .ant-popover-placement-rightTop .ant-popover-arrow-content,
579
+ .ant-popover-placement-rightBottom .ant-popover-arrow-content {
566
580
  -webkit-box-shadow: -3px 3px 7px rgba(0, 0, 0, 0.07);
567
581
  box-shadow: -3px 3px 7px rgba(0, 0, 0, 0.07);
582
+ -webkit-transform: translateX(4.24264069px) rotate(45deg);
583
+ transform: translateX(4.24264069px) rotate(45deg);
568
584
  }
569
- .ant-popover-placement-right > .ant-popover-content > .ant-popover-arrow {
585
+ .ant-popover-placement-right .ant-popover-arrow {
570
586
  top: 50%;
571
- -webkit-transform: translateY(-50%) rotate(45deg);
572
- transform: translateY(-50%) rotate(45deg);
587
+ -webkit-transform: translateY(-50%);
588
+ transform: translateY(-50%);
573
589
  }
574
- .ant-popover-placement-rightTop > .ant-popover-content > .ant-popover-arrow {
590
+ .ant-popover-placement-rightTop .ant-popover-arrow {
575
591
  top: 12px;
576
592
  }
577
- .ant-popover-placement-rightBottom > .ant-popover-content > .ant-popover-arrow {
593
+ .ant-popover-placement-rightBottom .ant-popover-arrow {
578
594
  bottom: 12px;
579
595
  }
580
- .ant-popover-placement-bottom > .ant-popover-content > .ant-popover-arrow,
581
- .ant-popover-placement-bottomLeft > .ant-popover-content > .ant-popover-arrow,
582
- .ant-popover-placement-bottomRight > .ant-popover-content > .ant-popover-arrow {
583
- top: 6px;
584
- border-top-color: #ffffff;
585
- border-right-color: transparent;
586
- border-bottom-color: transparent;
587
- border-left-color: #ffffff;
596
+ .ant-popover-placement-bottom .ant-popover-arrow,
597
+ .ant-popover-placement-bottomLeft .ant-popover-arrow,
598
+ .ant-popover-placement-bottomRight .ant-popover-arrow {
599
+ top: 1.51471863px;
600
+ }
601
+ .ant-popover-placement-bottom .ant-popover-arrow-content,
602
+ .ant-popover-placement-bottomLeft .ant-popover-arrow-content,
603
+ .ant-popover-placement-bottomRight .ant-popover-arrow-content {
588
604
  -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.06);
589
605
  box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.06);
606
+ -webkit-transform: translateY(4.24264069px) rotate(45deg);
607
+ transform: translateY(4.24264069px) rotate(45deg);
590
608
  }
591
- .ant-popover-placement-bottom > .ant-popover-content > .ant-popover-arrow {
609
+ .ant-popover-placement-bottom .ant-popover-arrow {
592
610
  left: 50%;
593
- -webkit-transform: translateX(-50%) rotate(45deg);
594
- transform: translateX(-50%) rotate(45deg);
611
+ -webkit-transform: translateX(-50%);
612
+ transform: translateX(-50%);
595
613
  }
596
- .ant-popover-placement-bottomLeft > .ant-popover-content > .ant-popover-arrow {
614
+ .ant-popover-placement-bottomLeft .ant-popover-arrow {
597
615
  left: 16px;
598
616
  }
599
- .ant-popover-placement-bottomRight > .ant-popover-content > .ant-popover-arrow {
617
+ .ant-popover-placement-bottomRight .ant-popover-arrow {
600
618
  right: 16px;
601
619
  }
602
- .ant-popover-placement-left > .ant-popover-content > .ant-popover-arrow,
603
- .ant-popover-placement-leftTop > .ant-popover-content > .ant-popover-arrow,
604
- .ant-popover-placement-leftBottom > .ant-popover-content > .ant-popover-arrow {
605
- right: 6px;
606
- border-top-color: #ffffff;
607
- border-right-color: #ffffff;
608
- border-bottom-color: transparent;
609
- border-left-color: transparent;
620
+ .ant-popover-placement-left .ant-popover-arrow,
621
+ .ant-popover-placement-leftTop .ant-popover-arrow,
622
+ .ant-popover-placement-leftBottom .ant-popover-arrow {
623
+ right: 1.51471863px;
624
+ }
625
+ .ant-popover-placement-left .ant-popover-arrow-content,
626
+ .ant-popover-placement-leftTop .ant-popover-arrow-content,
627
+ .ant-popover-placement-leftBottom .ant-popover-arrow-content {
610
628
  -webkit-box-shadow: 3px -3px 7px rgba(0, 0, 0, 0.07);
611
629
  box-shadow: 3px -3px 7px rgba(0, 0, 0, 0.07);
630
+ -webkit-transform: translateX(-4.24264069px) rotate(45deg);
631
+ transform: translateX(-4.24264069px) rotate(45deg);
612
632
  }
613
- .ant-popover-placement-left > .ant-popover-content > .ant-popover-arrow {
633
+ .ant-popover-placement-left .ant-popover-arrow {
614
634
  top: 50%;
615
- -webkit-transform: translateY(-50%) rotate(45deg);
616
- transform: translateY(-50%) rotate(45deg);
635
+ -webkit-transform: translateY(-50%);
636
+ transform: translateY(-50%);
617
637
  }
618
- .ant-popover-placement-leftTop > .ant-popover-content > .ant-popover-arrow {
638
+ .ant-popover-placement-leftTop .ant-popover-arrow {
619
639
  top: 12px;
620
640
  }
621
- .ant-popover-placement-leftBottom > .ant-popover-content > .ant-popover-arrow {
641
+ .ant-popover-placement-leftBottom .ant-popover-arrow {
622
642
  bottom: 12px;
623
643
  }
644
+ .ant-popover-pink .ant-popover-inner {
645
+ background-color: #eb2f96;
646
+ }
647
+ .ant-popover-pink .ant-popover-arrow-content {
648
+ background-color: #eb2f96;
649
+ }
650
+ .ant-popover-magenta .ant-popover-inner {
651
+ background-color: #eb2f96;
652
+ }
653
+ .ant-popover-magenta .ant-popover-arrow-content {
654
+ background-color: #eb2f96;
655
+ }
656
+ .ant-popover-red .ant-popover-inner {
657
+ background-color: #f5222d;
658
+ }
659
+ .ant-popover-red .ant-popover-arrow-content {
660
+ background-color: #f5222d;
661
+ }
662
+ .ant-popover-volcano .ant-popover-inner {
663
+ background-color: #fa541c;
664
+ }
665
+ .ant-popover-volcano .ant-popover-arrow-content {
666
+ background-color: #fa541c;
667
+ }
668
+ .ant-popover-orange .ant-popover-inner {
669
+ background-color: #fa8c16;
670
+ }
671
+ .ant-popover-orange .ant-popover-arrow-content {
672
+ background-color: #fa8c16;
673
+ }
674
+ .ant-popover-yellow .ant-popover-inner {
675
+ background-color: #fadb14;
676
+ }
677
+ .ant-popover-yellow .ant-popover-arrow-content {
678
+ background-color: #fadb14;
679
+ }
680
+ .ant-popover-gold .ant-popover-inner {
681
+ background-color: #faad14;
682
+ }
683
+ .ant-popover-gold .ant-popover-arrow-content {
684
+ background-color: #faad14;
685
+ }
686
+ .ant-popover-cyan .ant-popover-inner {
687
+ background-color: #13c2c2;
688
+ }
689
+ .ant-popover-cyan .ant-popover-arrow-content {
690
+ background-color: #13c2c2;
691
+ }
692
+ .ant-popover-lime .ant-popover-inner {
693
+ background-color: #a0d911;
694
+ }
695
+ .ant-popover-lime .ant-popover-arrow-content {
696
+ background-color: #a0d911;
697
+ }
698
+ .ant-popover-green .ant-popover-inner {
699
+ background-color: #52c41a;
700
+ }
701
+ .ant-popover-green .ant-popover-arrow-content {
702
+ background-color: #52c41a;
703
+ }
704
+ .ant-popover-blue .ant-popover-inner {
705
+ background-color: #1890ff;
706
+ }
707
+ .ant-popover-blue .ant-popover-arrow-content {
708
+ background-color: #1890ff;
709
+ }
710
+ .ant-popover-geekblue .ant-popover-inner {
711
+ background-color: #2f54eb;
712
+ }
713
+ .ant-popover-geekblue .ant-popover-arrow-content {
714
+ background-color: #2f54eb;
715
+ }
716
+ .ant-popover-purple .ant-popover-inner {
717
+ background-color: #722ed1;
718
+ }
719
+ .ant-popover-purple .ant-popover-arrow-content {
720
+ background-color: #722ed1;
721
+ }
624
722
  .ant-popover-rtl {
625
723
  direction: rtl;
626
724
  text-align: right;
package/lib/components/RadioGroup/index.d.ts ADDED
@@ -0,0 +1,53 @@
1
+ import * as React from 'react';
2
+ declare type BasicType = string | number | boolean;
3
+ export interface IOption<T = BasicType> {
4
+ /**
5
+ * 选项的值
6
+ */
7
+ value: T;
8
+ /**
9
+ * 选项的展示形式：string类型或者React组件
10
+ */
11
+ item: string | React.ReactNode;
12
+ /**
13
+ * 禁用选项
14
+ */
15
+ disabled?: boolean;
16
+ }
17
+ export interface IRadioGroupProps<T = BasicType> {
18
+ /**
19
+ * 当前值
20
+ */
21
+ value?: T;
22
+ /**
23
+ * 选中变化回调
24
+ */
25
+ onChange?: (value: any) => void;
26
+ /**
27
+ * 容器样式
28
+ */
29
+ className?: string;
30
+ /**
31
+ * 按钮样式
32
+ */
33
+ buttonClassName?: string;
34
+ /**
35
+ * 按钮大小
36
+ */
37
+ size?: 'small' | 'middle' | 'large';
38
+ /**
39
+ * 禁用
40
+ */
41
+ disabled?: boolean;
42
+ /**
43
+ * 可选线列表
44
+ */
45
+ options?: Array<IOption<T>> | IKeyValues<string | React.ReactNode>;
46
+ /**
47
+ * 用于设置 Radio options 类型
48
+ */
49
+ optionType?: 'button' | 'default';
50
+ children?: any;
51
+ }
52
+ export default function RadioGroup(props: IRadioGroupProps): JSX.Element;
53
+ export {};
package/lib/components/RadioGroup/index.js ADDED
@@ -0,0 +1,44 @@
1
+ "use strict";
2
+ var __importStar = (this && this.__importStar) || function (mod) {
3
+ if (mod && mod.__esModule) return mod;
4
+ var result = {};
5
+ if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
6
+ result["default"] = mod;
7
+ return result;
8
+ };
9
+ var __importDefault = (this && this.__importDefault) || function (mod) {
10
+ return (mod && mod.__esModule) ? mod : { "default": mod };
11
+ };
12
+ Object.defineProperty(exports, "__esModule", { value: true });
13
+ var React = __importStar(require("react"));
14
+ var lodash_1 = require("lodash");
15
+ var radio_1 = __importDefault(require("antd/es/radio"));
16
+ var classnames_1 = __importDefault(require("classnames"));
17
+ var style_1 = require("../../constants/style");
18
+ var useCallback = React.useCallback, useMemo = React.useMemo;
19
+ function RadioGroup(props) {
20
+ var className = props.className, buttonClassName = props.buttonClassName, value = props.value, size = props.size, onChange = props.onChange, children = props.children, disabled = props.disabled, _a = props.options, options = _a === void 0 ? {} : _a, _b = props.optionType, optionType = _b === void 0 ? 'default' : _b;
21
+ var handleChange = useCallback(function (e) {
22
+ if (onChange) {
23
+ onChange(e.target.value);
24
+ }
25
+ }, [onChange]);
26
+ var radioOptions = useMemo(function () {
27
+ return lodash_1.isArray(options)
28
+ ? options
29
+ : Object.keys(options).map(function (key) { return ({ value: key, item: options[key] }); });
30
+ }, [options]);
31
+ var Component = useMemo(function () {
32
+ return optionType === 'default' ? radio_1.default : radio_1.default.Button;
33
+ }, [optionType]);
34
+ return (React.createElement(radio_1.default.Group, { className: classnames_1.default(style_1.SDK_PREFIX + "-solid-radio-group", className), value: value, onChange: handleChange, size: size, disabled: disabled },
35
+ radioOptions.map(function (option) {
36
+ var _a;
37
+ var value = option.value, item = option.item;
38
+ return (React.createElement(Component, { key: value.toString(), value: value, disabled: option.disabled, className: classnames_1.default((_a = {},
39
+ _a["" + buttonClassName] = optionType === 'button' && buttonClassName,
40
+ _a)) }, item));
41
+ }),
42
+ children));
43
+ }
44
+ exports.default = RadioGroup;