@tendaui/components 1.2.4 → 1.3.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 (406) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +176 -176
  3. package/_util/scroll.ts +9 -0
  4. package/alert/_example/base.tsx +13 -0
  5. package/alert/_example/collapse.tsx +15 -0
  6. package/badge/_example/base.tsx +10 -0
  7. package/badge/_example/count.tsx +29 -0
  8. package/badge/_example/custom-color.tsx +32 -0
  9. package/badge/_example/dot.tsx +26 -0
  10. package/badge/_example/max-count.tsx +26 -0
  11. package/badge/_example/offset.tsx +29 -0
  12. package/badge/_example/shape.tsx +32 -0
  13. package/badge/_example/show-zero.tsx +23 -0
  14. package/badge/_example/size.tsx +35 -0
  15. package/badge/_example/standalone.tsx +14 -0
  16. package/badge/_example/text-count.tsx +26 -0
  17. package/badge/_example/with-button.tsx +23 -0
  18. package/button/_example/block.tsx +18 -0
  19. package/button/_example/disabled.tsx +22 -0
  20. package/button/_example/ghost.tsx +24 -0
  21. package/button/_example/link.tsx +15 -0
  22. package/button/_example/loading.tsx +19 -0
  23. package/button/_example/shape.tsx +18 -0
  24. package/button/_example/size.tsx +18 -0
  25. package/button/_example/suffix.tsx +16 -0
  26. package/button/_example/theme.tsx +14 -0
  27. package/button/_example/variant-base.tsx +24 -0
  28. package/button/_example/variant-dashed.tsx +24 -0
  29. package/button/_example/variant-outline.tsx +24 -0
  30. package/button/_example/variant-text.tsx +24 -0
  31. package/checkbox/_example/base.tsx +8 -0
  32. package/checkbox/_example/controlled.tsx +11 -0
  33. package/checkbox/_example/group-disabled.tsx +13 -0
  34. package/checkbox/_example/group-with-check-all.tsx +22 -0
  35. package/checkbox/_example/group-with-max.tsx +17 -0
  36. package/checkbox/_example/group-with-options.tsx +18 -0
  37. package/checkbox/_example/group.tsx +17 -0
  38. package/checkbox/_example/states.tsx +19 -0
  39. package/color-picker/ColorPicker.tsx +16 -2
  40. package/color-picker/_example/base.tsx +12 -0
  41. package/color-picker/_example/borderless.tsx +17 -0
  42. package/color-picker/_example/clearable.tsx +12 -0
  43. package/color-picker/_example/disabled.tsx +17 -0
  44. package/color-picker/_example/formats.tsx +30 -0
  45. package/color-picker/_example/manual-input.tsx +39 -0
  46. package/color-picker/_example/recent-colors.tsx +19 -0
  47. package/color-picker/_example/swatch-colors.tsx +28 -0
  48. package/color-picker/_example/with-alpha.tsx +21 -0
  49. package/color-picker/components/panel/format/inputs.tsx +1 -1
  50. package/color-picker/components/panel/index.tsx +13 -0
  51. package/color-picker/components/trigger.tsx +64 -13
  52. package/color-picker/defaultProps.ts +4 -1
  53. package/color-picker/utils/color-picker/cmyk.ts +89 -89
  54. package/color-picker/utils/color-picker/color.ts +467 -467
  55. package/color-picker/utils/color-picker/constants.ts +187 -187
  56. package/color-picker/utils/color-picker/draggable.ts +99 -100
  57. package/color-picker/utils/color-picker/format.ts +90 -95
  58. package/color-picker/utils/color-picker/gradient.ts +237 -243
  59. package/color-picker/utils/color-picker/index.ts +7 -7
  60. package/color-picker/utils/color-picker/types.ts +33 -33
  61. package/config-provider/ConfigContext.tsx +1 -0
  62. package/config-provider/ConfigProvider.tsx +18 -1
  63. package/config-provider/type.ts +5 -0
  64. package/dialog/_example/base.tsx +27 -0
  65. package/dialog/_example/confirm-loading.tsx +32 -0
  66. package/dialog/_example/custom-buttons.tsx +24 -0
  67. package/dialog/_example/full-screen.tsx +26 -0
  68. package/dialog/_example/hide-buttons.tsx +39 -0
  69. package/dialog/_example/modeless.tsx +25 -0
  70. package/dialog/_example/placement.tsx +40 -0
  71. package/dialog/_example/plugin-example.tsx +69 -0
  72. package/dialog/_example/themes.tsx +41 -0
  73. package/dialog/hooks/useDialogPosition.ts +35 -35
  74. package/drawer/Drawer.tsx +17 -9
  75. package/drawer/_example/custom-header-footer.tsx +29 -0
  76. package/drawer/_example/default.tsx +20 -0
  77. package/drawer/_example/events.tsx +53 -0
  78. package/drawer/_example/no-footer.tsx +20 -0
  79. package/drawer/_example/no-overlay.tsx +20 -0
  80. package/drawer/_example/placement.tsx +43 -0
  81. package/drawer/_example/size-draggable.tsx +26 -0
  82. package/drawer/_example/size.tsx +40 -0
  83. package/drawer/defaultProps.ts +1 -1
  84. package/fireworks/Fireworks.tsx +1 -10
  85. package/fireworks/index.ts +0 -1
  86. package/fireworks/type.ts +0 -1
  87. package/form/_example/complex.tsx +76 -0
  88. package/form/_example/default.tsx +58 -0
  89. package/form/_example/disabled.tsx +26 -0
  90. package/form/_example/form-list.tsx +74 -0
  91. package/form/_example/inline-layout.tsx +20 -0
  92. package/form/_example/label-align.tsx +46 -0
  93. package/form/_example/methods.tsx +66 -0
  94. package/form/_example/validation.tsx +71 -0
  95. package/form/hooks/useFormItemStyle.tsx +19 -7
  96. package/form/index.ts +20 -2
  97. package/form/type.ts +519 -519
  98. package/global-config/default-config.ts +95 -95
  99. package/global-config/locale/ar_KW.ts +259 -270
  100. package/global-config/locale/en_US.ts +265 -280
  101. package/global-config/locale/it_IT.ts +264 -287
  102. package/global-config/locale/ja_JP.ts +264 -279
  103. package/global-config/locale/ko_KR.ts +264 -279
  104. package/global-config/locale/ru_RU.ts +277 -288
  105. package/global-config/locale/zh_CN.ts +265 -279
  106. package/global-config/locale/zh_TW.ts +265 -279
  107. package/global-config/mobile/default-config.ts +6 -6
  108. package/global-config/mobile/locale/ar_KW.ts +112 -113
  109. package/global-config/mobile/locale/en_US.ts +113 -114
  110. package/global-config/mobile/locale/it_IT.ts +113 -114
  111. package/global-config/mobile/locale/ja_JP.ts +100 -101
  112. package/global-config/mobile/locale/ko_KR.ts +100 -101
  113. package/global-config/mobile/locale/ru_RU.ts +112 -113
  114. package/global-config/mobile/locale/zh_CN.ts +100 -101
  115. package/global-config/mobile/locale/zh_TW.ts +100 -101
  116. package/global-config/t.ts +111 -111
  117. package/hooks/useDebounce.ts +27 -0
  118. package/hooks/useLastest.ts +6 -2
  119. package/hooks/useResizeObserve.ts +0 -1
  120. package/index.ts +1 -1
  121. package/input/Input.tsx +53 -10
  122. package/input/_example/auto-width.tsx +14 -0
  123. package/input/_example/borderless.tsx +17 -0
  124. package/input/_example/clearable.tsx +14 -0
  125. package/input/_example/default.tsx +10 -0
  126. package/input/_example/disabled-readonly.tsx +12 -0
  127. package/input/_example/events.tsx +42 -0
  128. package/input/_example/group.tsx +14 -0
  129. package/input/_example/label-suffix.tsx +12 -0
  130. package/input/_example/max-length.tsx +11 -0
  131. package/input/_example/password.tsx +14 -0
  132. package/input/_example/sizes.tsx +12 -0
  133. package/input/_example/status.tsx +13 -0
  134. package/input/_example/text-align.tsx +12 -0
  135. package/input/_example/with-icon.tsx +13 -0
  136. package/input/type.ts +3 -0
  137. package/input/useLengthLimit.ts +122 -0
  138. package/input-number/InputNumber.tsx +124 -124
  139. package/input-number/_example/align.tsx +23 -0
  140. package/input-number/_example/auto-width.tsx +8 -0
  141. package/input-number/_example/default.tsx +8 -0
  142. package/input-number/_example/events.tsx +45 -0
  143. package/input-number/_example/format.tsx +27 -0
  144. package/input-number/_example/large-number.tsx +17 -0
  145. package/input-number/_example/min-max.tsx +14 -0
  146. package/input-number/_example/sizes.tsx +35 -0
  147. package/input-number/_example/status.tsx +65 -0
  148. package/input-number/_example/step-and-decimal.tsx +14 -0
  149. package/input-number/_example/themes.tsx +21 -0
  150. package/input-number/_example/with-suffix.tsx +12 -0
  151. package/input-number/defaultProps.ts +17 -17
  152. package/input-number/index.ts +9 -9
  153. package/input-number/style/css.js +1 -1
  154. package/input-number/style/index.js +1 -1
  155. package/input-number/useInputNumber.tsx +270 -270
  156. package/ip-input/_example/controlled.tsx +26 -0
  157. package/ip-input/_example/default.tsx +12 -0
  158. package/ip-input/_example/full-featured.tsx +32 -0
  159. package/ip-input/_example/ipv6.tsx +23 -0
  160. package/ip-input/_example/keyboard-navigation.tsx +19 -0
  161. package/ip-input/_example/paste-demo.tsx +23 -0
  162. package/ip-input/_example/states.tsx +21 -0
  163. package/ip-input/_example/with-cidr.tsx +23 -0
  164. package/layout/_example/combine-left.tsx +54 -0
  165. package/layout/_example/combine-right.tsx +54 -0
  166. package/layout/_example/custom-aside-width.tsx +56 -0
  167. package/layout/_example/custom-height.tsx +45 -0
  168. package/layout/_example/double-sidebar.tsx +57 -0
  169. package/layout/_example/side-navigation-right.tsx +51 -0
  170. package/layout/_example/side-navigation.tsx +51 -0
  171. package/layout/_example/top-navigation.tsx +41 -0
  172. package/list/ListItem.tsx +36 -36
  173. package/list/ListItemMeta.tsx +40 -40
  174. package/list/_example/async-loading.tsx +46 -0
  175. package/list/_example/default.tsx +23 -0
  176. package/list/_example/header-footer.tsx +40 -0
  177. package/list/_example/multiline.tsx +24 -0
  178. package/list/_example/scroll-loading.tsx +69 -0
  179. package/list/_example/sizes.tsx +45 -0
  180. package/list/_example/split.tsx +36 -0
  181. package/list/_example/stripe.tsx +24 -0
  182. package/list/_example/virtual-scroll.tsx +51 -0
  183. package/list/_example/with-image.tsx +26 -0
  184. package/list/defaultProps.ts +11 -11
  185. package/list/hooks/useListVirtualScroll.ts +82 -82
  186. package/list/style/css.js +1 -1
  187. package/list/style/index.js +1 -1
  188. package/loading/_example/default.tsx +6 -0
  189. package/loading/_example/delay.tsx +53 -0
  190. package/loading/_example/fullscreen.tsx +29 -0
  191. package/loading/_example/inherit-color.tsx +24 -0
  192. package/loading/_example/no-overlay.tsx +15 -0
  193. package/loading/_example/sizes.tsx +25 -0
  194. package/loading/_example/with-text.tsx +12 -0
  195. package/loading/_example/wrapper.tsx +30 -0
  196. package/locale/LocalReceiver.ts +55 -55
  197. package/locale/ar_KW.ts +7 -7
  198. package/locale/en_US.ts +7 -7
  199. package/locale/it_IT.ts +6 -6
  200. package/locale/ja_JP.ts +6 -6
  201. package/locale/ko_KR.ts +6 -6
  202. package/locale/ru_RU.ts +6 -6
  203. package/locale/zh_CN.ts +5 -5
  204. package/locale/zh_TW.ts +7 -7
  205. package/notification/_example/default.tsx +31 -0
  206. package/notification/_example/long-content.tsx +37 -0
  207. package/notification/_example/stacking.tsx +40 -0
  208. package/notification/_example/types.tsx +78 -0
  209. package/notification/_example/usage-example.tsx +62 -0
  210. package/package.json +4 -3
  211. package/popup/Popup.tsx +17 -5
  212. package/popup/_example/controlled.tsx +32 -0
  213. package/popup/_example/custom-content.tsx +64 -0
  214. package/popup/_example/default.tsx +19 -0
  215. package/popup/_example/delay.tsx +35 -0
  216. package/popup/_example/disabled.tsx +17 -0
  217. package/popup/_example/no-arrow.tsx +17 -0
  218. package/popup/_example/placements.tsx +61 -0
  219. package/popup/_example/triggers.tsx +26 -0
  220. package/radio/_example/allow-uncheck.tsx +19 -0
  221. package/radio/_example/button-style.tsx +40 -0
  222. package/radio/_example/controlled.tsx +13 -0
  223. package/radio/_example/default.tsx +13 -0
  224. package/radio/_example/group-disabled.tsx +22 -0
  225. package/radio/_example/group-with-options.tsx +20 -0
  226. package/radio/_example/group.tsx +19 -0
  227. package/radio/_example/sizes.tsx +37 -0
  228. package/radio/_example/states.tsx +20 -0
  229. package/select/_example/collapsed.tsx +30 -0
  230. package/select/_example/creatable.tsx +36 -0
  231. package/select/_example/custom-content.tsx +26 -0
  232. package/select/_example/default.tsx +29 -0
  233. package/select/_example/disabled.tsx +20 -0
  234. package/select/_example/filterable.tsx +27 -0
  235. package/select/_example/group-options.tsx +44 -0
  236. package/select/_example/label-suffix.tsx +24 -0
  237. package/select/_example/loading.tsx +19 -0
  238. package/select/_example/multiple.tsx +31 -0
  239. package/select/_example/sizes.tsx +20 -0
  240. package/select/_example/status.tsx +27 -0
  241. package/select/type.ts +382 -382
  242. package/select-input/type.ts +280 -280
  243. package/slider/Slider.tsx +13 -5
  244. package/slider/SliderHandleButton.tsx +50 -50
  245. package/slider/_example/custom-label.tsx +19 -0
  246. package/slider/_example/default.tsx +14 -0
  247. package/slider/_example/disabled.tsx +17 -0
  248. package/slider/_example/marks.tsx +31 -0
  249. package/slider/_example/range.tsx +16 -0
  250. package/slider/_example/step.tsx +14 -0
  251. package/slider/_example/vertical.tsx +26 -0
  252. package/slider/_example/with-input-number.tsx +21 -0
  253. package/slider/defaultProps.ts +15 -15
  254. package/slider/style/css.js +1 -1
  255. package/slider/style/index.js +1 -1
  256. package/slider/type.ts +1 -1
  257. package/styles/_global.scss +40 -40
  258. package/styles/_vars.scss +374 -358
  259. package/styles/components/alert/_index.scss +175 -175
  260. package/styles/components/alert/_vars.scss +41 -41
  261. package/styles/components/badge/_index.scss +71 -71
  262. package/styles/components/badge/_vars.scss +26 -26
  263. package/styles/components/button/_index.scss +499 -499
  264. package/styles/components/button/_mixins.scss +40 -40
  265. package/styles/components/button/_vars.scss +121 -121
  266. package/styles/components/checkbox/_index.scss +158 -158
  267. package/styles/components/checkbox/_var.scss +59 -59
  268. package/styles/components/color-picker/_index.scss +586 -586
  269. package/styles/components/color-picker/_vars.scss +79 -79
  270. package/styles/components/dialog/_animate.scss +133 -133
  271. package/styles/components/dialog/_index.scss +310 -312
  272. package/styles/components/dialog/_vars.scss +60 -60
  273. package/styles/components/drawer/_index.scss +206 -205
  274. package/styles/components/drawer/_var.scss +55 -55
  275. package/styles/components/fireworks/_index.scss +86 -86
  276. package/styles/components/fireworks/_vars.scss +5 -5
  277. package/styles/components/form/_index.scss +175 -174
  278. package/styles/components/form/_mixins.scss +74 -74
  279. package/styles/components/form/_vars.scss +101 -101
  280. package/styles/components/input/_index.scss +350 -350
  281. package/styles/components/input/_mixins.scss +120 -118
  282. package/styles/components/input/_vars.scss +130 -130
  283. package/styles/components/input-number/_index.scss +340 -339
  284. package/styles/components/input-number/_vars.scss +56 -56
  285. package/styles/components/ip-input/_index.scss +277 -277
  286. package/styles/components/layout/_index.scss +47 -47
  287. package/styles/components/layout/_vars.scss +19 -19
  288. package/styles/components/layout/doc.scss +74 -74
  289. package/styles/components/list/_index.scss +172 -172
  290. package/styles/components/list/_vars.scss +42 -42
  291. package/styles/components/loading/_index.scss +113 -113
  292. package/styles/components/loading/_vars.scss +40 -40
  293. package/styles/components/notification/_index.scss +144 -144
  294. package/styles/components/notification/_mixins.scss +13 -13
  295. package/styles/components/notification/_vars.scss +60 -60
  296. package/styles/components/popup/_index.scss +78 -78
  297. package/styles/components/popup/_mixin.scss +149 -149
  298. package/styles/components/popup/_vars.scss +33 -33
  299. package/styles/components/radio/_index.scss +376 -376
  300. package/styles/components/radio/_vars.scss +89 -89
  301. package/styles/components/select/_index.scss +291 -291
  302. package/styles/components/select/_var.scss +64 -64
  303. package/styles/components/select-input/_index.scss +5 -5
  304. package/styles/components/select-input/_var.scss +4 -4
  305. package/styles/components/slider/_index.scss +241 -241
  306. package/styles/components/slider/_vars.scss +51 -51
  307. package/styles/components/switch/_index.scss +248 -165
  308. package/styles/components/switch/_vars.scss +63 -63
  309. package/styles/components/table/_index.scss +194 -186
  310. package/styles/components/table/_var.scss +52 -52
  311. package/styles/components/tabs/_index.scss +165 -166
  312. package/styles/components/tabs/_mixins.scss +11 -11
  313. package/styles/components/tabs/_vars.scss +72 -72
  314. package/styles/components/tag/_index.scss +317 -317
  315. package/styles/components/tag/_var.scss +86 -86
  316. package/styles/components/tag-input/_index.scss +164 -164
  317. package/styles/components/tag-input/_vars.scss +17 -17
  318. package/styles/components/tooltip/_index.scss +104 -0
  319. package/styles/components/tooltip/_vars.scss +23 -0
  320. package/styles/mixins/_focus.scss +8 -8
  321. package/styles/mixins/_layout.scss +32 -32
  322. package/styles/mixins/_reset.scss +11 -11
  323. package/styles/mixins/_scrollbar.scss +32 -32
  324. package/styles/mixins/_text.scss +50 -50
  325. package/styles/themes/_dark.scss +169 -169
  326. package/styles/themes/_font.scss +69 -69
  327. package/styles/themes/_index.scss +5 -5
  328. package/styles/themes/_light.scss +170 -170
  329. package/styles/themes/_radius.scss +9 -9
  330. package/styles/themes/_size.scss +68 -68
  331. package/styles/utilities/_animation.scss +58 -58
  332. package/styles/utilities/_tips.scss +10 -10
  333. package/switch/_example/async-change.tsx +25 -0
  334. package/switch/_example/before-change.tsx +22 -0
  335. package/switch/_example/controlled.tsx +14 -0
  336. package/switch/_example/custom-value.tsx +21 -0
  337. package/switch/_example/default.tsx +6 -0
  338. package/switch/_example/disabled.tsx +25 -0
  339. package/switch/_example/loading.tsx +17 -0
  340. package/switch/_example/sizes.tsx +21 -0
  341. package/switch/_example/with-label.tsx +21 -0
  342. package/tab/TabPanel.tsx +9 -6
  343. package/tab/_example/addable.tsx +45 -0
  344. package/tab/_example/card-theme.tsx +22 -0
  345. package/tab/_example/default.tsx +22 -0
  346. package/tab/_example/disabled.tsx +38 -0
  347. package/tab/_example/lazy.tsx +25 -0
  348. package/tab/_example/placement.tsx +36 -0
  349. package/tab/_example/removable.tsx +31 -0
  350. package/tab/_example/sizes.tsx +31 -0
  351. package/tab/_example/with-action.tsx +26 -0
  352. package/table/Cell.tsx +3 -6
  353. package/table/Ellipsis.tsx +73 -0
  354. package/table/_example/alignment.tsx +46 -0
  355. package/table/_example/auto-width.tsx +47 -0
  356. package/table/_example/bordered-stripe-hover.tsx +42 -0
  357. package/table/_example/bordered.tsx +42 -0
  358. package/table/_example/cell-click.tsx +52 -0
  359. package/table/_example/complex.tsx +82 -0
  360. package/table/_example/custom-cell.tsx +68 -0
  361. package/table/_example/custom-empty.tsx +37 -0
  362. package/table/_example/custom-row-class-name.tsx +57 -0
  363. package/table/_example/default.tsx +42 -0
  364. package/table/_example/ellipsis.tsx +56 -0
  365. package/table/_example/empty.tsx +28 -0
  366. package/table/_example/fixed-width.tsx +48 -0
  367. package/table/_example/hover.tsx +42 -0
  368. package/table/_example/row-click.tsx +52 -0
  369. package/table/_example/sizes.tsx +57 -0
  370. package/table/_example/stripe.tsx +42 -0
  371. package/table/_example/vertical-align.tsx +110 -0
  372. package/table/hooks/useTableClassName.ts +3 -3
  373. package/table/index.ts +2 -0
  374. package/table/type.ts +1 -0
  375. package/tag/Tag.tsx +1 -1
  376. package/tag/_example/closable.tsx +44 -0
  377. package/tag/_example/default.tsx +17 -0
  378. package/tag/_example/disabled.tsx +19 -0
  379. package/tag/_example/sizes.tsx +18 -0
  380. package/tag/_example/variants.tsx +37 -0
  381. package/tag-input/_example/collapsed.tsx +27 -0
  382. package/tag-input/_example/controlled-uncontrolled.tsx +26 -0
  383. package/tag-input/_example/default.tsx +15 -0
  384. package/tag-input/_example/disabled-readonly.tsx +21 -0
  385. package/tag-input/_example/events.tsx +64 -0
  386. package/tag-input/_example/excess-display.tsx +27 -0
  387. package/tag-input/_example/max-tags.tsx +22 -0
  388. package/tag-input/_example/sizes.tsx +21 -0
  389. package/tag-input/_example/status.tsx +37 -0
  390. package/tag-input/_example/with-label.tsx +23 -0
  391. package/tag-input/hooks/useTagList.tsx +1 -1
  392. package/tooltip/Tooltip.tsx +76 -0
  393. package/tooltip/_example/base.tsx +26 -0
  394. package/tooltip/_example/custom-content.tsx +47 -0
  395. package/tooltip/_example/placement.tsx +33 -0
  396. package/tooltip/_example/theme.tsx +34 -0
  397. package/tooltip/defaultProps.ts +14 -0
  398. package/tooltip/index.ts +7 -0
  399. package/tooltip/style/index.js +1 -0
  400. package/tooltip/type.ts +99 -0
  401. package/utils/input-number/large-number.ts +423 -423
  402. package/utils/input-number/number.ts +257 -257
  403. package/utils/log/index.ts +3 -3
  404. package/utils/log/log.ts +29 -30
  405. package/utils/log/types.ts +9 -12
  406. package/utils/style.ts +58 -58
package/styles/components/form/_vars.scss CHANGED
@@ -1,101 +1,101 @@
1
- @use "../../_vars.scss" as *;
2
- // 组件变量
3
- // 名称可按如下规则定义//
4
- // <component>-[type]-[attrtype]-<attr>-[status]
5
-
6
- // component:组件名，如button//
7
- // type: 组件类型，如 button 的次要按钮（line//
8
- // attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（border）等
9
- // attr: 属性名称，如color、height、radius//
10
- // status: 表示组件状态或尺寸，如 hover、disabled、s、l
11
-
12
- // 如：$button-line-bg-color-hover
13
- // 如：$button-line-height-s
14
- //字体
15
-
16
- $form-font: $font-body-medium;
17
- $form-item-help-font: $font-body-small;
18
-
19
- // 行高
20
- $form-item-help-line-height: $text-line-height-s;
21
-
22
- // 颜色
23
- $form-color-label: $text-color-primary;
24
- $form-color-error: $error-color;
25
- $form-color-warning: $warning-color;
26
- $form-color-success: $success-color;
27
- $form-color-extra: $text-color-placeholder;
28
-
29
- $form-color: (
30
- label: $text-color-primary,
31
- error: $error-color,
32
- warning: $warning-color,
33
- success: $success-color,
34
- extra: $text-color-placeholder
35
- );
36
- // 间距
37
- $form-item-margin-bottom: $comp-margin-xxl;
38
- $form-item-with-help-margin-bottom: $comp-margin-xs;
39
- $form-item-control-height: $comp-margin-xxxl;
40
- $form-item-row-gap: $comp-margin-l;
41
- $form-item-padding-bottom: $comp-paddingTB-xs;
42
- $form-item-margin-right-inline: $comp-margin-xxl;
43
-
44
- $form-label-line-height: $text-line-height-base;
45
- $form-label-padding-right: $comp-paddingLR-xl;
46
- $form-label-margin-left-required: $comp-margin-xs;
47
- $form-label-margin-right-required: $comp-margin-xs;
48
- $form-label-margin-colon: 0 $comp-margin-xxs;
49
- $form-status-margin: 0 $comp-margin-s;
50
- $form-status-button-margin: $comp-margin-s;
51
- $form-status-button-width: $comp-size-m;
52
- $from-help-text-margin-top: $comp-margin-xs;
53
- $form-status-icon-size: $comp-size-xxxs;
54
-
55
- // status
56
- $input-border-color-success: $success-color;
57
- $input-box-shadow-color-success-focus: $success-color-focus;
58
- $input-border-color-warning: $warning-color;
59
- $input-box-shadow-color-warning-focus: $warning-color-focus;
60
- $input-border-color-error: $error-color;
61
- $input-box-shadow-color-error-focus: $error-color-focus;
62
-
63
- $input-color: (
64
- border: (
65
- default: (
66
- hover: $brand-color,
67
- focus: $brand-color
68
- ),
69
- success: $success-color,
70
- warning: $warning-color,
71
- error: $error-color
72
- ),
73
- text: (
74
- default: $text-color-primary,
75
- success: $success-color,
76
- warning: $warning-color,
77
- error: $error-color,
78
- readonly: $text-color-primary,
79
- tips: $text-color-placeholder,
80
- disabled: $text-color-disabled
81
- ),
82
- bg-color: (
83
- default: $text-color-placeholder,
84
- readonly: $bg-color-specialcomponent,
85
- disabled: $bg-color-component-disabled
86
- ),
87
- extra: (
88
- default: $text-color-placeholder,
89
- success: $success-color,
90
- warning: $warning-color,
91
- error: $error-color
92
- ),
93
- append: $bg-color-secondarycontainer-hover,
94
- limit: $text-color-placeholder,
95
- box-shadow: (
96
- default: $brand-color-focus,
97
- success: $success-color-focus,
98
- warning: $warning-color-focus,
99
- error: $error-color-focus
100
- )
101
- );
1
+ @use "../../_vars.scss" as *;
2
+ // 组件变量
3
+ // 名称可按如下规则定义//
4
+ // <component>-[type]-[attrtype]-<attr>-[status]
5
+
6
+ // component:组件名，如button//
7
+ // type: 组件类型，如 button 的次要按钮（line//
8
+ // attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（border）等
9
+ // attr: 属性名称，如color、height、radius//
10
+ // status: 表示组件状态或尺寸，如 hover、disabled、s、l
11
+
12
+ // 如：$button-line-bg-color-hover
13
+ // 如：$button-line-height-s
14
+ //字体
15
+
16
+ $form-font: $font-body-medium;
17
+ $form-item-help-font: $font-body-small;
18
+
19
+ // 行高
20
+ $form-item-help-line-height: $text-line-height-s;
21
+
22
+ // 颜色
23
+ $form-color-label: $text-color-primary;
24
+ $form-color-error: $error-color;
25
+ $form-color-warning: $warning-color;
26
+ $form-color-success: $success-color;
27
+ $form-color-extra: $text-color-placeholder;
28
+
29
+ $form-color: (
30
+ label: $text-color-primary,
31
+ error: $error-color,
32
+ warning: $warning-color,
33
+ success: $success-color,
34
+ extra: $text-color-placeholder
35
+ );
36
+ // 间距
37
+ $form-item-margin-bottom: $comp-margin-xxl;
38
+ $form-item-with-help-margin-bottom: $comp-margin-xs;
39
+ $form-item-control-height: $comp-margin-xxxl;
40
+ $form-item-row-gap: $comp-margin-l;
41
+ $form-item-padding-bottom: $comp-paddingTB-xs;
42
+ $form-item-margin-right-inline: $comp-margin-xxl;
43
+
44
+ $form-label-line-height: $text-line-height-base;
45
+ $form-label-padding-right: $comp-paddingLR-xl;
46
+ $form-label-margin-left-required: $comp-margin-xs;
47
+ $form-label-margin-right-required: $comp-margin-xs;
48
+ $form-label-margin-colon: 0 $comp-margin-xxs;
49
+ $form-status-margin: 0 $comp-margin-s;
50
+ $form-status-button-margin: $comp-margin-s;
51
+ $form-status-button-width: $comp-size-m;
52
+ $from-help-text-margin-top: $comp-margin-xs;
53
+ $form-status-icon-size: $comp-size-xxxs;
54
+
55
+ // status
56
+ $input-border-color-success: $success-color;
57
+ $input-box-shadow-color-success-focus: $success-color-focus;
58
+ $input-border-color-warning: $warning-color;
59
+ $input-box-shadow-color-warning-focus: $warning-color-focus;
60
+ $input-border-color-error: $error-color;
61
+ $input-box-shadow-color-error-focus: $error-color-focus;
62
+
63
+ $input-color: (
64
+ border: (
65
+ default: (
66
+ hover: $brand-color,
67
+ focus: $brand-color
68
+ ),
69
+ success: $success-color,
70
+ warning: $warning-color,
71
+ error: $error-color
72
+ ),
73
+ text: (
74
+ default: $text-color-primary,
75
+ success: $success-color,
76
+ warning: $warning-color,
77
+ error: $error-color,
78
+ readonly: $text-color-primary,
79
+ tips: $text-color-placeholder,
80
+ disabled: $text-color-disabled
81
+ ),
82
+ bg-color: (
83
+ default: $text-color-placeholder,
84
+ readonly: $bg-color-specialcomponent,
85
+ disabled: $bg-color-component-disabled
86
+ ),
87
+ extra: (
88
+ default: $text-color-placeholder,
89
+ success: $success-color,
90
+ warning: $warning-color,
91
+ error: $error-color
92
+ ),
93
+ append: $bg-color-secondarycontainer-hover,
94
+ limit: $text-color-placeholder,
95
+ box-shadow: (
96
+ default: $brand-color-focus,
97
+ success: $success-color-focus,
98
+ warning: $warning-color-focus,
99
+ error: $error-color-focus
100
+ )
101
+ );