persagy-vant 0.0.30 → 0.0.32

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 (212) hide show
  1. package/README.md +11 -12
  2. package/bin/persagy-vant.mjs +63 -0
  3. package/es/cell/Cell.d.ts +34 -1
  4. package/es/cell/Cell.mjs +48 -12
  5. package/es/cell/index.css +1 -1
  6. package/es/cell/index.d.ts +20 -1
  7. package/es/cell/index.less +19 -0
  8. package/es/cell/var.less +1 -1
  9. package/es/collapse-item/CollapseItem.d.ts +25 -0
  10. package/es/collapse-item/index.d.ts +18 -0
  11. package/es/content-panel/ContentPanel.d.ts +46 -0
  12. package/es/content-panel/ContentPanel.mjs +72 -0
  13. package/es/content-panel/index.css +1 -0
  14. package/es/content-panel/index.d.ts +33 -0
  15. package/es/content-panel/index.less +54 -0
  16. package/es/content-panel/index.mjs +8 -0
  17. package/es/content-panel/style/index.mjs +11 -0
  18. package/es/content-panel/style/less.mjs +11 -0
  19. package/es/content-panel/var.css +0 -0
  20. package/es/content-panel/var.less +3 -0
  21. package/es/dialog/Dialog.d.ts +4 -0
  22. package/es/dialog/Dialog.mjs +14 -1
  23. package/es/dialog/function-call.d.ts +2 -0
  24. package/es/dialog/types.d.ts +2 -0
  25. package/es/field/Field.d.ts +25 -0
  26. package/es/field/Field.mjs +1 -1
  27. package/es/field/index.d.ts +18 -0
  28. package/es/index.d.ts +6 -1
  29. package/es/index.mjs +16 -1
  30. package/es/info-card/InfoCard.d.ts +1 -0
  31. package/es/info-card/InfoCard.mjs +1 -0
  32. package/es/label/Label.d.ts +67 -0
  33. package/es/label/Label.mjs +22 -7
  34. package/es/label/index.css +1 -1
  35. package/es/label/index.d.ts +45 -0
  36. package/es/label/index.less +19 -0
  37. package/es/label/var.less +4 -1
  38. package/es/loading/Loading.mjs +18 -21
  39. package/es/material-action-bar/MaterialActionBar.d.ts +66 -0
  40. package/es/material-action-bar/MaterialActionBar.mjs +132 -0
  41. package/es/material-action-bar/index.css +1 -0
  42. package/es/material-action-bar/index.d.ts +58 -0
  43. package/es/material-action-bar/index.less +33 -0
  44. package/es/material-action-bar/index.mjs +8 -0
  45. package/es/material-action-bar/style/index.mjs +19 -0
  46. package/es/material-action-bar/style/less.mjs +19 -0
  47. package/es/material-add/MaterialAdd.mjs +12 -7
  48. package/es/material-add/index.css +1 -1
  49. package/es/material-add/index.less +7 -5
  50. package/es/material-add/style/index.mjs +7 -0
  51. package/es/material-add/style/less.mjs +7 -0
  52. package/es/material-detail/MaterialDetail.d.ts +64 -0
  53. package/es/material-detail/MaterialDetail.mjs +192 -0
  54. package/es/material-detail/index.css +1 -0
  55. package/es/material-detail/index.d.ts +40 -0
  56. package/es/material-detail/index.less +20 -0
  57. package/es/material-detail/index.mjs +8 -0
  58. package/es/material-detail/style/index.mjs +11 -0
  59. package/es/material-detail/style/less.mjs +11 -0
  60. package/es/material-display-bar/MaterialDisplayBar.d.ts +159 -0
  61. package/es/material-display-bar/MaterialDisplayBar.mjs +109 -0
  62. package/es/material-display-bar/index.css +1 -0
  63. package/es/material-display-bar/index.d.ts +103 -0
  64. package/es/material-display-bar/index.less +113 -0
  65. package/es/material-display-bar/index.mjs +8 -0
  66. package/es/material-display-bar/style/index.mjs +11 -0
  67. package/es/material-display-bar/style/less.mjs +11 -0
  68. package/es/material-display-bar/var.css +0 -0
  69. package/es/material-display-bar/var.less +12 -0
  70. package/es/rate/RateCell.mjs +4 -1
  71. package/es/rate/index.css +1 -1
  72. package/es/rate/index.less +16 -3
  73. package/es/search/Search.d.ts +14 -1
  74. package/es/search/Search.mjs +5 -3
  75. package/es/search/index.css +1 -1
  76. package/es/search/index.d.ts +9 -0
  77. package/es/search/index.less +10 -0
  78. package/es/search/types.d.ts +1 -0
  79. package/es/step/index.css +1 -1
  80. package/es/step/var.less +2 -2
  81. package/es/style/base.css +1 -1
  82. package/es/style/css-variables.css +1 -1
  83. package/es/style/var.less +1 -1
  84. package/es/title-bar/TitleBar.d.ts +85 -0
  85. package/es/title-bar/TitleBar.mjs +62 -0
  86. package/es/title-bar/index.css +1 -0
  87. package/es/title-bar/index.d.ts +60 -0
  88. package/es/title-bar/index.less +25 -0
  89. package/es/title-bar/index.mjs +8 -0
  90. package/es/title-bar/style/index.mjs +4 -0
  91. package/es/title-bar/style/less.mjs +4 -0
  92. package/es/title-bar/var.css +0 -0
  93. package/es/title-bar/var.less +6 -0
  94. package/es/tree-select/TreeSelect.d.ts +13 -0
  95. package/es/tree-select/TreeSelect.mjs +4 -2
  96. package/es/tree-select/index.css +1 -1
  97. package/es/tree-select/index.d.ts +9 -0
  98. package/es/tree-select/index.less +6 -0
  99. package/lib/cell/Cell.d.ts +34 -1
  100. package/lib/cell/Cell.js +46 -10
  101. package/lib/cell/index.css +1 -1
  102. package/lib/cell/index.d.ts +20 -1
  103. package/lib/cell/index.less +19 -0
  104. package/lib/cell/var.less +1 -1
  105. package/lib/collapse-item/CollapseItem.d.ts +25 -0
  106. package/lib/collapse-item/index.d.ts +18 -0
  107. package/lib/content-panel/ContentPanel.d.ts +46 -0
  108. package/lib/content-panel/ContentPanel.js +91 -0
  109. package/lib/content-panel/index.css +1 -0
  110. package/lib/content-panel/index.d.ts +33 -0
  111. package/lib/content-panel/index.js +37 -0
  112. package/lib/content-panel/index.less +54 -0
  113. package/lib/content-panel/style/index.js +11 -0
  114. package/lib/content-panel/style/less.js +11 -0
  115. package/lib/content-panel/var.css +0 -0
  116. package/lib/content-panel/var.less +3 -0
  117. package/lib/dialog/Dialog.d.ts +4 -0
  118. package/lib/dialog/Dialog.js +13 -0
  119. package/lib/dialog/function-call.d.ts +2 -0
  120. package/lib/dialog/types.d.ts +2 -0
  121. package/lib/dog1.jpg +0 -0
  122. package/lib/dog2.jpg +0 -0
  123. package/lib/dog3.jpg +0 -0
  124. package/lib/field/Field.d.ts +25 -0
  125. package/lib/field/Field.js +1 -1
  126. package/lib/field/index.d.ts +18 -0
  127. package/lib/index.css +1 -1
  128. package/lib/index.d.ts +6 -1
  129. package/lib/index.js +16 -1
  130. package/lib/index.less +6 -1
  131. package/lib/info-card/InfoCard.d.ts +1 -0
  132. package/lib/info-card/InfoCard.js +1 -0
  133. package/lib/label/Label.d.ts +67 -0
  134. package/lib/label/Label.js +21 -6
  135. package/lib/label/index.css +1 -1
  136. package/lib/label/index.d.ts +45 -0
  137. package/lib/label/index.less +19 -0
  138. package/lib/label/var.less +4 -1
  139. package/lib/loading/Loading.js +18 -21
  140. package/lib/material-action-bar/MaterialActionBar.d.ts +66 -0
  141. package/lib/material-action-bar/MaterialActionBar.js +151 -0
  142. package/lib/material-action-bar/index.css +1 -0
  143. package/lib/material-action-bar/index.d.ts +58 -0
  144. package/lib/material-action-bar/index.js +37 -0
  145. package/lib/material-action-bar/index.less +33 -0
  146. package/lib/material-action-bar/style/index.js +19 -0
  147. package/lib/material-action-bar/style/less.js +19 -0
  148. package/lib/material-add/MaterialAdd.js +12 -7
  149. package/lib/material-add/index.css +1 -1
  150. package/lib/material-add/index.less +7 -5
  151. package/lib/material-add/style/index.js +7 -0
  152. package/lib/material-add/style/less.js +7 -0
  153. package/lib/material-detail/MaterialDetail.d.ts +64 -0
  154. package/lib/material-detail/MaterialDetail.js +211 -0
  155. package/lib/material-detail/index.css +1 -0
  156. package/lib/material-detail/index.d.ts +40 -0
  157. package/lib/material-detail/index.js +37 -0
  158. package/lib/material-detail/index.less +20 -0
  159. package/lib/material-detail/style/index.js +11 -0
  160. package/lib/material-detail/style/less.js +11 -0
  161. package/lib/material-display-bar/MaterialDisplayBar.d.ts +159 -0
  162. package/lib/material-display-bar/MaterialDisplayBar.js +128 -0
  163. package/lib/material-display-bar/index.css +1 -0
  164. package/lib/material-display-bar/index.d.ts +103 -0
  165. package/lib/material-display-bar/index.js +37 -0
  166. package/lib/material-display-bar/index.less +113 -0
  167. package/lib/material-display-bar/style/index.js +11 -0
  168. package/lib/material-display-bar/style/less.js +11 -0
  169. package/lib/material-display-bar/var.css +0 -0
  170. package/lib/material-display-bar/var.less +12 -0
  171. package/lib/rate/RateCell.js +4 -1
  172. package/lib/rate/index.css +1 -1
  173. package/lib/rate/index.less +16 -3
  174. package/lib/search/Search.d.ts +14 -1
  175. package/lib/search/Search.js +5 -3
  176. package/lib/search/index.css +1 -1
  177. package/lib/search/index.d.ts +9 -0
  178. package/lib/search/index.less +10 -0
  179. package/lib/search/types.d.ts +1 -0
  180. package/lib/step/index.css +1 -1
  181. package/lib/step/var.less +2 -2
  182. package/lib/style/base.css +1 -1
  183. package/lib/style/css-variables.css +1 -1
  184. package/lib/style/var.less +1 -1
  185. package/lib/title-bar/TitleBar.d.ts +85 -0
  186. package/lib/title-bar/TitleBar.js +81 -0
  187. package/lib/title-bar/index.css +1 -0
  188. package/lib/title-bar/index.d.ts +60 -0
  189. package/lib/title-bar/index.js +37 -0
  190. package/lib/title-bar/index.less +25 -0
  191. package/lib/title-bar/style/index.js +4 -0
  192. package/lib/title-bar/style/less.js +4 -0
  193. package/lib/title-bar/var.css +0 -0
  194. package/lib/title-bar/var.less +6 -0
  195. package/lib/tree-select/TreeSelect.d.ts +13 -0
  196. package/lib/tree-select/TreeSelect.js +3 -1
  197. package/lib/tree-select/index.css +1 -1
  198. package/lib/tree-select/index.d.ts +9 -0
  199. package/lib/tree-select/index.less +6 -0
  200. package/lib/vant.cjs.js +1641 -1218
  201. package/lib/vant.es.js +1641 -1218
  202. package/lib/vant.js +1641 -1218
  203. package/lib/vant.min.js +1 -1
  204. package/lib/web-types.json +1 -1
  205. package/package.json +6 -2
  206. package/skills/use-persagy-vant/references/business-component-catalog.md +8 -3
  207. package/skills/use-persagy-vant/references/component-catalog.md +7 -4
  208. package/skills/use-persagy-vant/references/component-documentation.md +1 -1
  209. package/skills/use-persagy-vant/references/design-interaction-baseline.md +3 -3
  210. package/skills/use-persagy-vant/references/page-recipes.md +18 -5
  211. package/skills/use-persagy-vant/references/reuse-policy.md +1 -1
  212. package/skills/use-persagy-vant/references/usage-patterns.md +9 -1
@@ -0,0 +1,113 @@
1
+ @import './var.less';
2
+
3
+ :root {
4
+ --van-material-display-bar-padding: @material-detail-padding;
5
+ --van-material-display-bar-radius: @material-detail-radius;
6
+ --van-material-display-bar-gap: @material-detail-gap;
7
+ --van-material-display-bar-fields-gap: @material-detail-fields-gap;
8
+ --van-material-display-bar-title-color: @material-detail-title-color;
9
+ --van-material-display-bar-title-font-size: @material-detail-title-font-size;
10
+ --van-material-display-bar-title-line-height: @material-detail-title-line-height;
11
+ --van-material-display-bar-title-gap: @material-detail-title-gap;
12
+ --van-material-display-bar-title-icon-size: @material-detail-title-icon-size;
13
+ --van-material-display-bar-quantity-color: @material-detail-quantity-color;
14
+ --van-material-display-bar-quantity-gap: @material-detail-quantity-gap;
15
+ --van-material-display-bar-quantity-label-gap: @material-detail-quantity-label-gap;
16
+ }
17
+
18
+ .van-material-display-bar {
19
+ overflow: hidden;
20
+ background: var(--van-white);
21
+
22
+ &--rounded { border-radius: var(--van-material-display-bar-radius); }
23
+
24
+ &__body {
25
+ display: flex;
26
+ flex-direction: column;
27
+ gap: var(--van-material-display-bar-gap);
28
+ padding: var(--van-material-display-bar-padding);
29
+ }
30
+
31
+ &__header,
32
+ &__quantity,
33
+ &__title {
34
+ display: flex;
35
+ align-items: center;
36
+ }
37
+
38
+ &__header {
39
+ justify-content: space-between;
40
+ gap: var(--van-padding-sm);
41
+ min-width: 0;
42
+ }
43
+
44
+ &__title {
45
+ min-width: 0;
46
+ gap: var(--van-material-display-bar-title-gap);
47
+ padding: 0;
48
+ color: var(--van-material-display-bar-title-color);
49
+ font: inherit;
50
+ font-size: var(--van-material-display-bar-title-font-size);
51
+ font-weight: 400;
52
+ line-height: var(--van-material-display-bar-title-line-height);
53
+ text-align: left;
54
+ background: transparent;
55
+ border: 0;
56
+ cursor: pointer;
57
+
58
+ &:active { opacity: var(--van-active-opacity); }
59
+ }
60
+
61
+ &__title-arrow {
62
+ flex: none;
63
+ color: var(--van-material-display-bar-title-color);
64
+ font-size: var(--van-material-display-bar-title-icon-size);
65
+ }
66
+
67
+ &__quantity {
68
+ flex: none;
69
+ gap: var(--van-material-display-bar-quantity-gap);
70
+ color: var(--van-material-display-bar-title-color);
71
+ font-size: var(--van-material-display-bar-title-font-size);
72
+ line-height: var(--van-material-display-bar-title-line-height);
73
+ white-space: nowrap;
74
+
75
+ strong {
76
+ color: var(--van-material-display-bar-quantity-color);
77
+ font-weight: var(--van-font-weight-bold);
78
+ }
79
+ }
80
+
81
+ &__quantity-label { margin-right: var(--van-material-display-bar-quantity-label-gap); }
82
+
83
+ &__stock-insufficient {
84
+ flex: none;
85
+ color: var(--van-red-500);
86
+ font-size: var(--van-font-size-sm);
87
+ line-height: var(--van-line-height-md);
88
+ white-space: nowrap;
89
+ }
90
+
91
+ &__fields { display: flex; flex-direction: column; gap: var(--van-material-display-bar-fields-gap); width: 100%; }
92
+
93
+ &__divider.van-divider {
94
+ margin: 0 var(--van-padding-md);
95
+ }
96
+
97
+ &__bottom { display: flex; flex-direction: column; gap: var(--van-material-display-bar-gap); }
98
+
99
+ &__swipe-cell {
100
+ overflow: hidden;
101
+ background: var(--van-gray-2);
102
+
103
+ &--rounded { border-radius: var(--van-material-display-bar-radius); }
104
+ }
105
+
106
+ &__delete {
107
+ width: calc(100% - 8px);
108
+ height: 100%;
109
+ margin: 0 4px;
110
+ border: 0;
111
+ border-radius: 8px;
112
+ }
113
+ }
@@ -0,0 +1,8 @@
1
+ import { withInstall } from "../utils/index.mjs";
2
+ import _MaterialDisplayBar from "./MaterialDisplayBar.mjs";
3
+ const MaterialDisplayBar = withInstall(_MaterialDisplayBar);
4
+ var stdin_default = MaterialDisplayBar;
5
+ export {
6
+ MaterialDisplayBar,
7
+ stdin_default as default
8
+ };
@@ -0,0 +1,11 @@
1
+ import "../../style/base.css";
2
+ import "../../badge/index.css";
3
+ import "../../icon/index.css";
4
+ import "../../image/index.css";
5
+ import "../../tag/index.css";
6
+ import "../../label/index.css";
7
+ import "../../loading/index.css";
8
+ import "../../button/index.css";
9
+ import "../../divider/index.css";
10
+ import "../../swipe-cell/index.css";
11
+ import "../index.css";
@@ -0,0 +1,11 @@
1
+ import "../../style/base.less";
2
+ import "../../badge/index.less";
3
+ import "../../icon/index.less";
4
+ import "../../image/index.less";
5
+ import "../../tag/index.less";
6
+ import "../../label/index.less";
7
+ import "../../loading/index.less";
8
+ import "../../button/index.less";
9
+ import "../../divider/index.less";
10
+ import "../../swipe-cell/index.less";
11
+ import "../index.less";
File without changes
@@ -0,0 +1,12 @@
1
+ @material-detail-padding: 10px var(--van-padding-md);
2
+ @material-detail-radius: var(--van-border-radius-lg);
3
+ @material-detail-gap: 4px;
4
+ @material-detail-fields-gap: 0;
5
+ @material-detail-title-color: var(--van-gray-8);
6
+ @material-detail-title-font-size: var(--van-font-size-md);
7
+ @material-detail-title-line-height: var(--van-line-height-lg);
8
+ @material-detail-title-gap: 2px;
9
+ @material-detail-title-icon-size: 12px;
10
+ @material-detail-quantity-color: var(--van-orange-700);
11
+ @material-detail-quantity-gap: 2px;
12
+ @material-detail-quantity-label-gap: 4px;
@@ -45,7 +45,10 @@ var stdin_default = defineComponent({
45
45
  "title": props.title,
46
46
  "required": props.required,
47
47
  "border": props.border,
48
- "class": bem(props.layout)
48
+ "class": bem({
49
+ [props.layout]: true
50
+ }),
51
+ "valueClass": bem("value")
49
52
  }, {
50
53
  value: () => _createVNode("div", {
51
54
  "class": bem("content")
package/es/rate/index.css CHANGED
@@ -1 +1 @@
1
- :root{--van-rate-icon-size: 20px;--van-rate-icon-gutter: var(--van-padding-base);--van-rate-icon-void-color: var(--van-gray-5);--van-rate-icon-full-color: var(--van-orange-500);--van-rate-icon-disabled-color: var(--van-gray-5)}.van-rate{display:inline-flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-wrap:wrap}.van-rate__item{position:relative}.van-rate__item:not(:last-child){padding-right:var(--van-rate-icon-gutter)}.van-rate__icon{display:block;width:1em;color:var(--van-rate-icon-void-color);font-size:var(--van-rate-icon-size)}.van-rate__icon--half{position:absolute;top:0;left:0;overflow:hidden}.van-rate__icon--full{color:var(--van-rate-icon-full-color)}.van-rate__icon--disabled{color:var(--van-rate-icon-disabled-color)}.van-rate--disabled{cursor:not-allowed}.van-rate--readonly{cursor:default}.van-rate-cell__content{display:flex;align-items:center}.van-rate-cell--default .van-cell__title{flex:none}.van-rate-cell--default .van-cell__value{display:flex;align-items:center;margin-left:var(--van-padding-sm);text-align:left}.van-rate-cell__description{margin-left:var(--van-padding-sm);color:var(--van-text-color-2);font-size:var(--van-font-size-md);line-height:var(--van-cell-line-height);white-space:nowrap}.van-rate-cell--between .van-cell__value{display:flex;justify-content:flex-end}
1
+ :root{--van-rate-icon-size: 20px;--van-rate-icon-gutter: var(--van-padding-base);--van-rate-icon-void-color: var(--van-gray-5);--van-rate-icon-full-color: var(--van-orange-500);--van-rate-icon-disabled-color: var(--van-gray-5)}.van-rate{display:inline-flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-wrap:wrap}.van-rate__item{position:relative}.van-rate__item:not(:last-child){padding-right:var(--van-rate-icon-gutter)}.van-rate__icon{display:block;width:1em;color:var(--van-rate-icon-void-color);font-size:var(--van-rate-icon-size)}.van-rate__icon--half{position:absolute;top:0;left:0;overflow:hidden}.van-rate__icon--full{color:var(--van-rate-icon-full-color)}.van-rate__icon--disabled{color:var(--van-rate-icon-disabled-color)}.van-rate--disabled{cursor:not-allowed}.van-rate--readonly{cursor:default}.van-rate-cell__content{display:flex;align-items:center}.van-rate-cell .van-rate{flex:none;flex-wrap:nowrap}.van-rate-cell--default .van-cell__title{flex:none}.van-rate-cell--default .van-rate-cell__value{display:flex;flex:none;min-width:auto;align-items:center;margin-left:6px;overflow:visible;text-align:left}.van-rate-cell__description{margin-left:var(--van-padding-sm);color:var(--van-text-color-2);font-size:var(--van-font-size-md);line-height:var(--van-cell-line-height);white-space:nowrap}.van-rate-cell--between .van-rate-cell__value{display:flex;flex:none;min-width:auto;justify-content:flex-end;overflow:visible}
@@ -59,15 +59,25 @@
59
59
  align-items: center;
60
60
  }
61
61
 
62
+ // Rate cells follow the 5-star single-line layout defined for form rows.
63
+ // Keep this constraint local so standalone Rate instances can still wrap.
64
+ .van-rate {
65
+ flex: none;
66
+ flex-wrap: nowrap;
67
+ }
68
+
62
69
  &--default {
63
70
  .van-cell__title {
64
71
  flex: none;
65
72
  }
66
73
 
67
- .van-cell__value {
74
+ .van-rate-cell__value {
68
75
  display: flex;
76
+ flex: none;
77
+ min-width: auto;
69
78
  align-items: center;
70
- margin-left: var(--van-padding-sm);
79
+ margin-left: 6px;
80
+ overflow: visible;
71
81
  text-align: left;
72
82
  }
73
83
  }
@@ -81,9 +91,12 @@
81
91
  }
82
92
 
83
93
  &--between {
84
- .van-cell__value {
94
+ .van-rate-cell__value {
85
95
  display: flex;
96
+ flex: none;
97
+ min-width: auto;
86
98
  justify-content: flex-end;
99
+ overflow: visible;
87
100
  }
88
101
  }
89
102
  }
@@ -1,5 +1,5 @@
1
1
  import { type ExtractPropTypes } from 'vue';
2
- import type { SearchShape } from './types';
2
+ import type { SearchShape, SearchVariant } from './types';
3
3
  declare const searchProps: {
4
4
  id: StringConstructor;
5
5
  name: StringConstructor;
@@ -51,6 +51,10 @@ declare const searchProps: {
51
51
  type: import("vue").PropType<SearchShape>;
52
52
  default: SearchShape;
53
53
  };
54
+ variant: {
55
+ type: import("vue").PropType<SearchVariant>;
56
+ default: SearchVariant;
57
+ };
54
58
  leftIcon: {
55
59
  type: import("vue").PropType<string>;
56
60
  default: string;
@@ -115,6 +119,10 @@ declare const _default: import("vue").DefineComponent<{
115
119
  type: import("vue").PropType<SearchShape>;
116
120
  default: SearchShape;
117
121
  };
122
+ variant: {
123
+ type: import("vue").PropType<SearchVariant>;
124
+ default: SearchVariant;
125
+ };
118
126
  leftIcon: {
119
127
  type: import("vue").PropType<string>;
120
128
  default: string;
@@ -177,6 +185,10 @@ declare const _default: import("vue").DefineComponent<{
177
185
  type: import("vue").PropType<SearchShape>;
178
186
  default: SearchShape;
179
187
  };
188
+ variant: {
189
+ type: import("vue").PropType<SearchVariant>;
190
+ default: SearchVariant;
191
+ };
180
192
  leftIcon: {
181
193
  type: import("vue").PropType<string>;
182
194
  default: string;
@@ -211,6 +223,7 @@ declare const _default: import("vue").DefineComponent<{
211
223
  formatTrigger: import("../field").FieldFormatTrigger;
212
224
  error: boolean;
213
225
  readonly: boolean;
226
+ variant: SearchVariant;
214
227
  showAction: boolean;
215
228
  }>;
216
229
  export default _default;
@@ -7,7 +7,8 @@ import { Field } from "../field/index.mjs";
7
7
  const [name, bem, t] = createNamespace("search");
8
8
  const searchProps = extend({}, fieldSharedProps, {
9
9
  label: String,
10
- shape: makeStringProp("square"),
10
+ shape: makeStringProp("round"),
11
+ variant: makeStringProp("default"),
11
12
  leftIcon: makeStringProp("search"),
12
13
  clearable: truthProp,
13
14
  actionText: String,
@@ -101,10 +102,11 @@ var stdin_default = defineComponent({
101
102
  var _a;
102
103
  return _createVNode("div", {
103
104
  "class": bem({
104
- "show-action": props.showAction
105
+ "show-action": props.showAction,
106
+ pure: props.variant === "pure"
105
107
  }),
106
108
  "style": {
107
- background: props.background
109
+ background: props.variant === "default" ? props.background : void 0
108
110
  }
109
111
  }, [(_a = slots.left) == null ? void 0 : _a.call(slots), _createVNode("div", {
110
112
  "class": bem("content", props.shape)
@@ -1 +1 @@
1
- :root{--van-search-padding: 10px var(--van-padding-sm);--van-search-background-color: var(--van-background-color-light);--van-search-content-background-color: var(--van-gray-1);--van-search-input-height: 34px;--van-search-label-padding: 0 5px;--van-search-label-color: var(--van-text-color);--van-search-label-font-size: var(--van-font-size-md);--van-search-left-icon-color: var(--van-gray-6);--van-search-action-padding: 0 var(--van-padding-xs);--van-search-action-text-color: var(--van-text-color);--van-search-action-font-size: var(--van-font-size-md)}.van-search{display:flex;align-items:center;box-sizing:border-box;padding:var(--van-search-padding);background:var(--van-search-background-color)}.van-search__content{display:flex;flex:1;padding-left:var(--van-padding-sm);background:var(--van-search-content-background-color);border-radius:var(--van-border-radius-sm)}.van-search__content--round{border-radius:var(--van-border-radius-max)}.van-search__label{padding:var(--van-search-label-padding);color:var(--van-search-label-color);font-size:var(--van-search-label-font-size);line-height:var(--van-search-input-height)}.van-search__field{flex:1;align-items:center;padding:0 var(--van-padding-xs) 0 0;height:var(--van-search-input-height);background-color:transparent}.van-search__field .van-field__left-icon{color:var(--van-search-left-icon-color)}.van-search--show-action{padding-right:0}.van-search input::-webkit-search-decoration,.van-search input::-webkit-search-cancel-button,.van-search input::-webkit-search-results-button,.van-search input::-webkit-search-results-decoration{display:none}.van-search__action{padding:var(--van-search-action-padding);color:var(--van-search-action-text-color);font-size:var(--van-search-action-font-size);line-height:var(--van-search-input-height);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.van-search__action:active{background-color:var(--van-active-color)}
1
+ :root{--van-search-padding: 10px var(--van-padding-sm);--van-search-background-color: var(--van-background-color-light);--van-search-content-background-color: var(--van-gray-1);--van-search-input-height: 34px;--van-search-label-padding: 0 5px;--van-search-label-color: var(--van-text-color);--van-search-label-font-size: var(--van-font-size-md);--van-search-left-icon-color: var(--van-gray-6);--van-search-action-padding: 0 var(--van-padding-xs);--van-search-action-text-color: var(--van-text-color);--van-search-action-font-size: var(--van-font-size-md)}.van-search{display:flex;align-items:center;box-sizing:border-box;padding:var(--van-search-padding);background:var(--van-search-background-color)}.van-search--pure{padding:0;background:transparent}.van-search--pure .van-search__content{background:var(--van-white);border-radius:var(--van-border-radius-max)}.van-search__content{display:flex;flex:1;padding-left:var(--van-padding-sm);background:var(--van-search-content-background-color);border-radius:var(--van-border-radius-sm)}.van-search__content--round{border-radius:var(--van-border-radius-max)}.van-search__label{padding:var(--van-search-label-padding);color:var(--van-search-label-color);font-size:var(--van-search-label-font-size);line-height:var(--van-search-input-height)}.van-search__field{flex:1;align-items:center;padding:0 var(--van-padding-xs) 0 0;height:var(--van-search-input-height);background-color:transparent}.van-search__field .van-field__left-icon{color:var(--van-search-left-icon-color)}.van-search--show-action{padding-right:0}.van-search input::-webkit-search-decoration,.van-search input::-webkit-search-cancel-button,.van-search input::-webkit-search-results-button,.van-search input::-webkit-search-results-decoration{display:none}.van-search__action{padding:var(--van-search-action-padding);color:var(--van-search-action-text-color);font-size:var(--van-search-action-font-size);line-height:var(--van-search-input-height);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.van-search__action:active{background-color:var(--van-active-color)}
@@ -50,6 +50,10 @@ export declare const Search: import("../utils").WithInstall<import("vue").Define
50
50
  type: import("vue").PropType<import("./types").SearchShape>;
51
51
  default: import("./types").SearchShape;
52
52
  };
53
+ variant: {
54
+ type: import("vue").PropType<import("./types").SearchVariant>;
55
+ default: import("./types").SearchVariant;
56
+ };
53
57
  leftIcon: {
54
58
  type: import("vue").PropType<string>;
55
59
  default: string;
@@ -112,6 +116,10 @@ export declare const Search: import("../utils").WithInstall<import("vue").Define
112
116
  type: import("vue").PropType<import("./types").SearchShape>;
113
117
  default: import("./types").SearchShape;
114
118
  };
119
+ variant: {
120
+ type: import("vue").PropType<import("./types").SearchVariant>;
121
+ default: import("./types").SearchVariant;
122
+ };
115
123
  leftIcon: {
116
124
  type: import("vue").PropType<string>;
117
125
  default: string;
@@ -146,6 +154,7 @@ export declare const Search: import("../utils").WithInstall<import("vue").Define
146
154
  formatTrigger: import("..").FieldFormatTrigger;
147
155
  error: boolean;
148
156
  readonly: boolean;
157
+ variant: import("./types").SearchVariant;
149
158
  showAction: boolean;
150
159
  }>>;
151
160
  export default Search;
@@ -21,6 +21,16 @@
21
21
  padding: var(--van-search-padding);
22
22
  background: var(--van-search-background-color);
23
23
 
24
+ &--pure {
25
+ padding: 0;
26
+ background: transparent;
27
+
28
+ .van-search__content {
29
+ background: var(--van-white);
30
+ border-radius: var(--van-border-radius-max);
31
+ }
32
+ }
33
+
24
34
  &__content {
25
35
  display: flex;
26
36
  flex: 1;
@@ -1,6 +1,7 @@
1
1
  import type { ComponentPublicInstance } from 'vue';
2
2
  import type { SearchProps } from './Search';
3
3
  export declare type SearchShape = 'square' | 'round';
4
+ export declare type SearchVariant = 'pure' | 'default';
4
5
  export declare type SearchExpose = {
5
6
  focus: () => void;
6
7
  blur: () => void;
package/es/step/index.css CHANGED
@@ -1 +1 @@
1
- :root{--van-step-text-color: var(--van-text-color-2);--van-step-active-color: var(--van-success-color);--van-step-process-text-color: var(--van-text-color);--van-step-font-size: var(--van-font-size-md);--van-step-line-color: var(--van-border-color);--van-step-finish-line-color: var(--van-success-color);--van-step-finish-text-color: var(--van-text-color);--van-step-icon-size: 12px;--van-step-circle-size: 5px;--van-step-circle-color: var(--van-gray-6);--van-step-horizontal-title-font-size: var(--van-font-size-sm)}.van-step{position:relative;flex:1;color:var(--van-step-text-color);font-size:var(--van-step-font-size)}.van-step__circle{display:block;width:var(--van-step-circle-size);height:var(--van-step-circle-size);background-color:var(--van-step-circle-color);border-radius:50%}.van-step__line{position:absolute;background-color:var(--van-step-line-color);transition:background-color var(--van-animation-duration-base)}.van-step--horizontal{float:left}.van-step--horizontal:first-child .van-step__title{margin-left:0;transform:none}.van-step--horizontal:last-child{position:absolute;right:1px;width:auto}.van-step--horizontal:last-child .van-step__title{margin-left:0;transform:none}.van-step--horizontal:last-child .van-step__circle-container{right:-9px;left:auto}.van-step--horizontal .van-step__circle-container{position:absolute;top:30px;left:calc(var(--van-padding-xs) * -1);z-index:1;padding:0 var(--van-padding-xs);background-color:var(--van-background-color-light);transform:translateY(-50%)}.van-step--horizontal .van-step__title{display:inline-block;margin-left:3px;font-size:var(--van-step-horizontal-title-font-size);transform:translate(-50%)}.van-step--horizontal .van-step__line{top:30px;left:0;width:100%;height:1px}.van-step--horizontal .van-step__icon{display:block;font-size:var(--van-step-icon-size)}.van-step--horizontal .van-step--process{color:var(--van-step-process-text-color)}.van-step--vertical{display:block;float:none;padding:10px 10px 10px 0;line-height:var(--van-line-height-sm)}.van-step--vertical:not(:last-child):after{border-bottom-width:1px}.van-step--vertical .van-step__circle-container{position:absolute;top:19px;left:-15px;z-index:1;font-size:var(--van-step-icon-size);line-height:1;transform:translate(-50%,-50%)}.van-step--vertical .van-step__line{top:16px;left:-15px;width:1px;height:100%}.van-step:last-child .van-step__line{width:0}.van-step--finish{color:var(--van-step-finish-text-color)}.van-step--finish .van-step__circle,.van-step--finish .van-step__line{background-color:var(--van-step-finish-line-color)}.van-step__icon,.van-step__title{transition:color var(--van-animation-duration-base)}.van-step__icon--active,.van-step__title--active,.van-step__icon--finish,.van-step__title--finish{color:var(--van-step-active-color)}
1
+ :root{--van-step-text-color: var(--van-text-color-2);--van-step-active-color: var(--van-primary-color);--van-step-process-text-color: var(--van-text-color);--van-step-font-size: var(--van-font-size-md);--van-step-line-color: var(--van-border-color);--van-step-finish-line-color: var(--van-primary-color);--van-step-finish-text-color: var(--van-text-color);--van-step-icon-size: 12px;--van-step-circle-size: 5px;--van-step-circle-color: var(--van-gray-6);--van-step-horizontal-title-font-size: var(--van-font-size-sm)}.van-step{position:relative;flex:1;color:var(--van-step-text-color);font-size:var(--van-step-font-size)}.van-step__circle{display:block;width:var(--van-step-circle-size);height:var(--van-step-circle-size);background-color:var(--van-step-circle-color);border-radius:50%}.van-step__line{position:absolute;background-color:var(--van-step-line-color);transition:background-color var(--van-animation-duration-base)}.van-step--horizontal{float:left}.van-step--horizontal:first-child .van-step__title{margin-left:0;transform:none}.van-step--horizontal:last-child{position:absolute;right:1px;width:auto}.van-step--horizontal:last-child .van-step__title{margin-left:0;transform:none}.van-step--horizontal:last-child .van-step__circle-container{right:-9px;left:auto}.van-step--horizontal .van-step__circle-container{position:absolute;top:30px;left:calc(var(--van-padding-xs) * -1);z-index:1;padding:0 var(--van-padding-xs);background-color:var(--van-background-color-light);transform:translateY(-50%)}.van-step--horizontal .van-step__title{display:inline-block;margin-left:3px;font-size:var(--van-step-horizontal-title-font-size);transform:translate(-50%)}.van-step--horizontal .van-step__line{top:30px;left:0;width:100%;height:1px}.van-step--horizontal .van-step__icon{display:block;font-size:var(--van-step-icon-size)}.van-step--horizontal .van-step--process{color:var(--van-step-process-text-color)}.van-step--vertical{display:block;float:none;padding:10px 10px 10px 0;line-height:var(--van-line-height-sm)}.van-step--vertical:not(:last-child):after{border-bottom-width:1px}.van-step--vertical .van-step__circle-container{position:absolute;top:19px;left:-15px;z-index:1;font-size:var(--van-step-icon-size);line-height:1;transform:translate(-50%,-50%)}.van-step--vertical .van-step__line{top:16px;left:-15px;width:1px;height:100%}.van-step:last-child .van-step__line{width:0}.van-step--finish{color:var(--van-step-finish-text-color)}.van-step--finish .van-step__circle,.van-step--finish .van-step__line{background-color:var(--van-step-finish-line-color)}.van-step__icon,.van-step__title{transition:color var(--van-animation-duration-base)}.van-step__icon--active,.van-step__title--active,.van-step__icon--finish,.van-step__title--finish{color:var(--van-step-active-color)}
package/es/step/var.less CHANGED
@@ -1,11 +1,11 @@
1
1
  @import '../style/var.less';
2
2
 
3
3
  @step-text-color: var(--van-text-color-2);
4
- @step-active-color: var(--van-success-color);
4
+ @step-active-color: var(--van-primary-color);
5
5
  @step-process-text-color: var(--van-text-color);
6
6
  @step-font-size: var(--van-font-size-md);
7
7
  @step-line-color: var(--van-border-color);
8
- @step-finish-line-color: var(--van-success-color);
8
+ @step-finish-line-color: var(--van-primary-color);
9
9
  @step-finish-text-color: var(--van-text-color);
10
10
  @step-icon-size: 12px;
11
11
  @step-circle-size: 5px;
package/es/style/base.css CHANGED
@@ -1 +1 @@
1
- :root{--van-black: #1b2129;--van-white: #fff;--van-gray-1: #f7f9fa;--van-gray-2: #f1f4f6;--van-gray-3: #edf1f5;--van-gray-4: #e1e5eb;--van-gray-5: #c4c9cf;--van-gray-6: #8b949e;--van-gray-7: #626c78;--van-gray-8: #2e3742;--van-red: #f55047;--van-orange: #ffb800;--van-orange-dark: #1b2129;--van-orange-light: #fffbe8;--van-green: #3fbe72;--van-blue: #246fe5;--van-blue-900: #1034b2;--van-blue-800: #1241bf;--van-blue-700: #1b4acc;--van-blue-600: #215dd9;--van-blue-500: #246fe5;--van-blue-400: #2481f2;--van-blue-300: #64a6f7;--van-blue-200: #9fc9fb;--van-blue-100: #d9ebff;--van-blue-50: #ebf6ff;--van-green-900: #13753f;--van-green-800: #0f8843;--van-green-700: #0c9b4a;--van-green-600: #15ae55;--van-green-500: #3fbe72;--van-green-400: #69cd90;--van-green-300: #8edbab;--van-green-200: #b6e9c7;--van-green-100: #daf7e1;--van-green-50: #ebffeb;--van-red-900: #b80000;--van-red-800: #c71412;--van-red-700: #d72824;--van-red-600: #e63c35;--van-red-500: #f55047;--van-red-400: #f8766f;--van-red-300: #fa9b96;--van-red-200: #fdc1be;--van-red-100: #ffe6e5;--van-red-50: #fff5f5;--van-orange-900: #cc5300;--van-orange-800: #d96c00;--van-orange-700: #e68600;--van-orange-600: #f29f00;--van-orange-500: #ffb800;--van-orange-400: #ffcc47;--van-orange-300: #ffd873;--van-orange-200: #ffe399;--van-orange-100: #fff0cc;--van-orange-50: #fffbe6;--van-grey-50: #f7f9fa;--van-grey-100: #f1f4f6;--van-grey-200: #e8ecf0;--van-grey-300: #e1e5eb;--van-grey-400: #c4c9cf;--van-grey-500: #8b949e;--van-grey-600: #626c78;--van-grey-700: #424c59;--van-grey-800: #2e3742;--van-grey-900: #1b2129;--van-gradient-red: linear-gradient(to right, #ff6034, #ee0a24);--van-gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);--van-primary-color: var(--van-blue);--van-success-color: var(--van-green);--van-danger-color: var(--van-red);--van-warning-color: var(--van-orange);--van-text-color: var(--van-gray-8);--van-text-color-2: var(--van-gray-6);--van-text-color-3: var(--van-gray-5);--van-text-link-color: #576b95;--van-active-color: var(--van-gray-2);--van-active-opacity: .6;--van-disabled-opacity: .5;--van-background-color: var(--van-gray-1);--van-background-color-light: var(--van-white);--van-background-color-black: var(--van-black);--van-padding-base: 4px;--van-padding-xs: 8px;--van-padding-sm: 12px;--van-padding-md: 16px;--van-padding-lg: 24px;--van-padding-xl: 32px;--van-font-size-xs: 10px;--van-font-size-sm: 12px;--van-font-size-md: 14px;--van-font-size-lg: 16px;--van-font-size-xl: 20px;--van-font-weight-bold: 500;--van-line-height-xs: 14px;--van-line-height-sm: 18px;--van-line-height-md: 20px;--van-line-height-lg: 22px;--van-line-height-xl: 24px;--van-base-font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--van-price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;--van-animation-duration-base: .3s;--van-animation-duration-fast: .2s;--van-animation-timing-function-enter: ease-out;--van-animation-timing-function-leave: ease-in;--van-border-color: var(--van-gray-3);--van-border-width-base: 1px;--van-border-radius-sm: 2px;--van-border-radius-md: 4px;--van-border-radius-lg: 8px;--van-border-radius-max: 999px}:root.van-theme-dark{--van-text-color: #f1f4f6;--van-text-color-2: #c4c9cf;--van-text-color-3: #8b949e;--van-active-color: #2e3742;--van-background-color: #151a20;--van-background-color-light: #1b2129;--van-border-color: #424c59}html{-webkit-tap-highlight-color:transparent}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Segoe UI,Arial,Roboto,PingFang SC,miui,Hiragino Sans GB,Microsoft Yahei,sans-serif}a{text-decoration:none}input,button,textarea{color:inherit;font:inherit}a:focus,input:focus,button:focus,textarea:focus,[class*=van-]:focus{outline:none}ol,ul{margin:0;padding:0;list-style:none}@keyframes van-slide-up-enter{0%{transform:translate3d(0,100%,0)}}@keyframes van-slide-up-leave{to{transform:translate3d(0,100%,0)}}@keyframes van-slide-down-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes van-slide-down-leave{to{transform:translate3d(0,-100%,0)}}@keyframes van-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes van-slide-left-leave{to{transform:translate3d(-100%,0,0)}}@keyframes van-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes van-slide-right-leave{to{transform:translate3d(100%,0,0)}}@keyframes van-fade-in{0%{opacity:0}to{opacity:1}}@keyframes van-fade-out{0%{opacity:1}to{opacity:0}}@keyframes van-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.van-fade-enter-active{animation:var(--van-animation-duration-base) van-fade-in both var(--van-animation-timing-function-enter)}.van-fade-leave-active{animation:var(--van-animation-duration-base) van-fade-out both var(--van-animation-timing-function-leave)}.van-slide-up-enter-active{animation:van-slide-up-enter var(--van-animation-duration-base) both var(--van-animation-timing-function-enter)}.van-slide-up-leave-active{animation:van-slide-up-leave var(--van-animation-duration-base) both var(--van-animation-timing-function-leave)}.van-slide-down-enter-active{animation:van-slide-down-enter var(--van-animation-duration-base) both var(--van-animation-timing-function-enter)}.van-slide-down-leave-active{animation:van-slide-down-leave var(--van-animation-duration-base) both var(--van-animation-timing-function-leave)}.van-slide-left-enter-active{animation:van-slide-left-enter var(--van-animation-duration-base) both var(--van-animation-timing-function-enter)}.van-slide-left-leave-active{animation:van-slide-left-leave var(--van-animation-duration-base) both var(--van-animation-timing-function-leave)}.van-slide-right-enter-active{animation:van-slide-right-enter var(--van-animation-duration-base) both var(--van-animation-timing-function-enter)}.van-slide-right-leave-active{animation:van-slide-right-leave var(--van-animation-duration-base) both var(--van-animation-timing-function-leave)}.van-clearfix:after{display:table;clear:both;content:""}.van-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.van-multi-ellipsis--l2{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical}.van-multi-ellipsis--l3{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical}.van-safe-area-top{padding-top:constant(safe-area-inset-top);padding-top:env(safe-area-inset-top)}.van-safe-area-bottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.van-haptics-feedback{cursor:pointer}.van-haptics-feedback:active{opacity:var(--van-active-opacity)}[class*=van-hairline]:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--van-border-color);transform:scale(.5)}.van-hairline,.van-hairline--top,.van-hairline--left,.van-hairline--right,.van-hairline--bottom,.van-hairline--surround,.van-hairline--top-bottom{position:relative}.van-hairline--top:after{border-top-width:1px}.van-hairline--left:after{border-left-width:1px}.van-hairline--right:after{border-right-width:1px}.van-hairline--bottom:after{border-bottom-width:1px}.van-hairline--top-bottom:after,.van-hairline-unset--top-bottom:after{border-width:1px 0}.van-hairline--surround:after{border-width:1px}
1
+ :root{--van-black: #1b2129;--van-white: #fff;--van-gray-1: #f7f9fa;--van-gray-2: #f1f4f6;--van-gray-3: #edf1f5;--van-gray-4: #e1e5eb;--van-gray-5: #c4c9cf;--van-gray-6: #8b949e;--van-gray-7: #626c78;--van-gray-8: #2e3742;--van-red: #f55047;--van-orange: #ffb800;--van-orange-dark: #1b2129;--van-orange-light: #fffbe8;--van-green: #3fbe72;--van-blue: #246fe5;--van-blue-900: #1034b2;--van-blue-800: #1241bf;--van-blue-700: #1b4acc;--van-blue-600: #215dd9;--van-blue-500: #246fe5;--van-blue-400: #2481f2;--van-blue-300: #64a6f7;--van-blue-200: #9fc9fb;--van-blue-100: #d9ebff;--van-blue-50: #ebf6ff;--van-green-900: #13753f;--van-green-800: #0f8843;--van-green-700: #0c9b4a;--van-green-600: #15ae55;--van-green-500: #3fbe72;--van-green-400: #69cd90;--van-green-300: #8edbab;--van-green-200: #b6e9c7;--van-green-100: #daf7e1;--van-green-50: #ebffeb;--van-red-900: #b80000;--van-red-800: #c71412;--van-red-700: #d72824;--van-red-600: #e63c35;--van-red-500: #f55047;--van-red-400: #f8766f;--van-red-300: #fa9b96;--van-red-200: #fdc1be;--van-red-100: #ffe6e5;--van-red-50: #fff5f5;--van-orange-900: #cc5300;--van-orange-800: #d96c00;--van-orange-700: #e68600;--van-orange-600: #f29f00;--van-orange-500: #ffb800;--van-orange-400: #ffcc47;--van-orange-300: #ffd873;--van-orange-200: #ffe399;--van-orange-100: #fff0cc;--van-orange-50: #fffbe6;--van-grey-50: #f7f9fa;--van-grey-100: #f1f4f6;--van-grey-200: #e8ecf0;--van-grey-300: #e1e5eb;--van-grey-400: #c4c9cf;--van-grey-500: #8b949e;--van-grey-600: #626c78;--van-grey-700: #424c59;--van-grey-800: #2e3742;--van-grey-900: #1b2129;--van-gradient-red: linear-gradient(to right, #ff6034, #ee0a24);--van-gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);--van-primary-color: var(--van-blue);--van-success-color: var(--van-green);--van-danger-color: var(--van-red);--van-warning-color: var(--van-orange);--van-text-color: var(--van-gray-8);--van-text-color-2: var(--van-gray-6);--van-text-color-3: var(--van-gray-5);--van-text-link-color: #576b95;--van-active-color: var(--van-gray-2);--van-active-opacity: .6;--van-disabled-opacity: .5;--van-background-color: var(--van-gray-1);--van-background-color-light: var(--van-white);--van-background-color-black: var(--van-black);--van-padding-base: 4px;--van-padding-xs: 8px;--van-padding-sm: 12px;--van-padding-md: 16px;--van-padding-lg: 24px;--van-padding-xl: 32px;--van-font-size-xs: 10px;--van-font-size-sm: 12px;--van-font-size-md: 14px;--van-font-size-lg: 16px;--van-font-size-xl: 20px;--van-font-weight-bold: 500;--van-line-height-xs: 14px;--van-line-height-sm: 18px;--van-line-height-md: 20px;--van-line-height-lg: 22px;--van-line-height-xl: 24px;--van-base-font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--van-price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;--van-animation-duration-base: .3s;--van-animation-duration-fast: .2s;--van-animation-timing-function-enter: ease-out;--van-animation-timing-function-leave: ease-in;--van-border-color: var(--van-gray-4);--van-border-width-base: 1px;--van-border-radius-sm: 2px;--van-border-radius-md: 4px;--van-border-radius-lg: 8px;--van-border-radius-max: 999px}:root.van-theme-dark{--van-text-color: #f1f4f6;--van-text-color-2: #c4c9cf;--van-text-color-3: #8b949e;--van-active-color: #2e3742;--van-background-color: #151a20;--van-background-color-light: #1b2129;--van-border-color: #424c59}html{-webkit-tap-highlight-color:transparent}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Segoe UI,Arial,Roboto,PingFang SC,miui,Hiragino Sans GB,Microsoft Yahei,sans-serif}a{text-decoration:none}input,button,textarea{color:inherit;font:inherit}a:focus,input:focus,button:focus,textarea:focus,[class*=van-]:focus{outline:none}ol,ul{margin:0;padding:0;list-style:none}@keyframes van-slide-up-enter{0%{transform:translate3d(0,100%,0)}}@keyframes van-slide-up-leave{to{transform:translate3d(0,100%,0)}}@keyframes van-slide-down-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes van-slide-down-leave{to{transform:translate3d(0,-100%,0)}}@keyframes van-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes van-slide-left-leave{to{transform:translate3d(-100%,0,0)}}@keyframes van-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes van-slide-right-leave{to{transform:translate3d(100%,0,0)}}@keyframes van-fade-in{0%{opacity:0}to{opacity:1}}@keyframes van-fade-out{0%{opacity:1}to{opacity:0}}@keyframes van-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.van-fade-enter-active{animation:var(--van-animation-duration-base) van-fade-in both var(--van-animation-timing-function-enter)}.van-fade-leave-active{animation:var(--van-animation-duration-base) van-fade-out both var(--van-animation-timing-function-leave)}.van-slide-up-enter-active{animation:van-slide-up-enter var(--van-animation-duration-base) both var(--van-animation-timing-function-enter)}.van-slide-up-leave-active{animation:van-slide-up-leave var(--van-animation-duration-base) both var(--van-animation-timing-function-leave)}.van-slide-down-enter-active{animation:van-slide-down-enter var(--van-animation-duration-base) both var(--van-animation-timing-function-enter)}.van-slide-down-leave-active{animation:van-slide-down-leave var(--van-animation-duration-base) both var(--van-animation-timing-function-leave)}.van-slide-left-enter-active{animation:van-slide-left-enter var(--van-animation-duration-base) both var(--van-animation-timing-function-enter)}.van-slide-left-leave-active{animation:van-slide-left-leave var(--van-animation-duration-base) both var(--van-animation-timing-function-leave)}.van-slide-right-enter-active{animation:van-slide-right-enter var(--van-animation-duration-base) both var(--van-animation-timing-function-enter)}.van-slide-right-leave-active{animation:van-slide-right-leave var(--van-animation-duration-base) both var(--van-animation-timing-function-leave)}.van-clearfix:after{display:table;clear:both;content:""}.van-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.van-multi-ellipsis--l2{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical}.van-multi-ellipsis--l3{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical}.van-safe-area-top{padding-top:constant(safe-area-inset-top);padding-top:env(safe-area-inset-top)}.van-safe-area-bottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.van-haptics-feedback{cursor:pointer}.van-haptics-feedback:active{opacity:var(--van-active-opacity)}[class*=van-hairline]:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--van-border-color);transform:scale(.5)}.van-hairline,.van-hairline--top,.van-hairline--left,.van-hairline--right,.van-hairline--bottom,.van-hairline--surround,.van-hairline--top-bottom{position:relative}.van-hairline--top:after{border-top-width:1px}.van-hairline--left:after{border-left-width:1px}.van-hairline--right:after{border-right-width:1px}.van-hairline--bottom:after{border-bottom-width:1px}.van-hairline--top-bottom:after,.van-hairline-unset--top-bottom:after{border-width:1px 0}.van-hairline--surround:after{border-width:1px}
@@ -1 +1 @@
1
- :root{--van-black: #1b2129;--van-white: #fff;--van-gray-1: #f7f9fa;--van-gray-2: #f1f4f6;--van-gray-3: #edf1f5;--van-gray-4: #e1e5eb;--van-gray-5: #c4c9cf;--van-gray-6: #8b949e;--van-gray-7: #626c78;--van-gray-8: #2e3742;--van-red: #f55047;--van-orange: #ffb800;--van-orange-dark: #1b2129;--van-orange-light: #fffbe8;--van-green: #3fbe72;--van-blue: #246fe5;--van-blue-900: #1034b2;--van-blue-800: #1241bf;--van-blue-700: #1b4acc;--van-blue-600: #215dd9;--van-blue-500: #246fe5;--van-blue-400: #2481f2;--van-blue-300: #64a6f7;--van-blue-200: #9fc9fb;--van-blue-100: #d9ebff;--van-blue-50: #ebf6ff;--van-green-900: #13753f;--van-green-800: #0f8843;--van-green-700: #0c9b4a;--van-green-600: #15ae55;--van-green-500: #3fbe72;--van-green-400: #69cd90;--van-green-300: #8edbab;--van-green-200: #b6e9c7;--van-green-100: #daf7e1;--van-green-50: #ebffeb;--van-red-900: #b80000;--van-red-800: #c71412;--van-red-700: #d72824;--van-red-600: #e63c35;--van-red-500: #f55047;--van-red-400: #f8766f;--van-red-300: #fa9b96;--van-red-200: #fdc1be;--van-red-100: #ffe6e5;--van-red-50: #fff5f5;--van-orange-900: #cc5300;--van-orange-800: #d96c00;--van-orange-700: #e68600;--van-orange-600: #f29f00;--van-orange-500: #ffb800;--van-orange-400: #ffcc47;--van-orange-300: #ffd873;--van-orange-200: #ffe399;--van-orange-100: #fff0cc;--van-orange-50: #fffbe6;--van-grey-50: #f7f9fa;--van-grey-100: #f1f4f6;--van-grey-200: #e8ecf0;--van-grey-300: #e1e5eb;--van-grey-400: #c4c9cf;--van-grey-500: #8b949e;--van-grey-600: #626c78;--van-grey-700: #424c59;--van-grey-800: #2e3742;--van-grey-900: #1b2129;--van-gradient-red: linear-gradient(to right, #ff6034, #ee0a24);--van-gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);--van-primary-color: var(--van-blue);--van-success-color: var(--van-green);--van-danger-color: var(--van-red);--van-warning-color: var(--van-orange);--van-text-color: var(--van-gray-8);--van-text-color-2: var(--van-gray-6);--van-text-color-3: var(--van-gray-5);--van-text-link-color: #576b95;--van-active-color: var(--van-gray-2);--van-active-opacity: .6;--van-disabled-opacity: .5;--van-background-color: var(--van-gray-1);--van-background-color-light: var(--van-white);--van-background-color-black: var(--van-black);--van-padding-base: 4px;--van-padding-xs: 8px;--van-padding-sm: 12px;--van-padding-md: 16px;--van-padding-lg: 24px;--van-padding-xl: 32px;--van-font-size-xs: 10px;--van-font-size-sm: 12px;--van-font-size-md: 14px;--van-font-size-lg: 16px;--van-font-size-xl: 20px;--van-font-weight-bold: 500;--van-line-height-xs: 14px;--van-line-height-sm: 18px;--van-line-height-md: 20px;--van-line-height-lg: 22px;--van-line-height-xl: 24px;--van-base-font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--van-price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;--van-animation-duration-base: .3s;--van-animation-duration-fast: .2s;--van-animation-timing-function-enter: ease-out;--van-animation-timing-function-leave: ease-in;--van-border-color: var(--van-gray-3);--van-border-width-base: 1px;--van-border-radius-sm: 2px;--van-border-radius-md: 4px;--van-border-radius-lg: 8px;--van-border-radius-max: 999px}:root.van-theme-dark{--van-text-color: #f1f4f6;--van-text-color-2: #c4c9cf;--van-text-color-3: #8b949e;--van-active-color: #2e3742;--van-background-color: #151a20;--van-background-color-light: #1b2129;--van-border-color: #424c59}
1
+ :root{--van-black: #1b2129;--van-white: #fff;--van-gray-1: #f7f9fa;--van-gray-2: #f1f4f6;--van-gray-3: #edf1f5;--van-gray-4: #e1e5eb;--van-gray-5: #c4c9cf;--van-gray-6: #8b949e;--van-gray-7: #626c78;--van-gray-8: #2e3742;--van-red: #f55047;--van-orange: #ffb800;--van-orange-dark: #1b2129;--van-orange-light: #fffbe8;--van-green: #3fbe72;--van-blue: #246fe5;--van-blue-900: #1034b2;--van-blue-800: #1241bf;--van-blue-700: #1b4acc;--van-blue-600: #215dd9;--van-blue-500: #246fe5;--van-blue-400: #2481f2;--van-blue-300: #64a6f7;--van-blue-200: #9fc9fb;--van-blue-100: #d9ebff;--van-blue-50: #ebf6ff;--van-green-900: #13753f;--van-green-800: #0f8843;--van-green-700: #0c9b4a;--van-green-600: #15ae55;--van-green-500: #3fbe72;--van-green-400: #69cd90;--van-green-300: #8edbab;--van-green-200: #b6e9c7;--van-green-100: #daf7e1;--van-green-50: #ebffeb;--van-red-900: #b80000;--van-red-800: #c71412;--van-red-700: #d72824;--van-red-600: #e63c35;--van-red-500: #f55047;--van-red-400: #f8766f;--van-red-300: #fa9b96;--van-red-200: #fdc1be;--van-red-100: #ffe6e5;--van-red-50: #fff5f5;--van-orange-900: #cc5300;--van-orange-800: #d96c00;--van-orange-700: #e68600;--van-orange-600: #f29f00;--van-orange-500: #ffb800;--van-orange-400: #ffcc47;--van-orange-300: #ffd873;--van-orange-200: #ffe399;--van-orange-100: #fff0cc;--van-orange-50: #fffbe6;--van-grey-50: #f7f9fa;--van-grey-100: #f1f4f6;--van-grey-200: #e8ecf0;--van-grey-300: #e1e5eb;--van-grey-400: #c4c9cf;--van-grey-500: #8b949e;--van-grey-600: #626c78;--van-grey-700: #424c59;--van-grey-800: #2e3742;--van-grey-900: #1b2129;--van-gradient-red: linear-gradient(to right, #ff6034, #ee0a24);--van-gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);--van-primary-color: var(--van-blue);--van-success-color: var(--van-green);--van-danger-color: var(--van-red);--van-warning-color: var(--van-orange);--van-text-color: var(--van-gray-8);--van-text-color-2: var(--van-gray-6);--van-text-color-3: var(--van-gray-5);--van-text-link-color: #576b95;--van-active-color: var(--van-gray-2);--van-active-opacity: .6;--van-disabled-opacity: .5;--van-background-color: var(--van-gray-1);--van-background-color-light: var(--van-white);--van-background-color-black: var(--van-black);--van-padding-base: 4px;--van-padding-xs: 8px;--van-padding-sm: 12px;--van-padding-md: 16px;--van-padding-lg: 24px;--van-padding-xl: 32px;--van-font-size-xs: 10px;--van-font-size-sm: 12px;--van-font-size-md: 14px;--van-font-size-lg: 16px;--van-font-size-xl: 20px;--van-font-weight-bold: 500;--van-line-height-xs: 14px;--van-line-height-sm: 18px;--van-line-height-md: 20px;--van-line-height-lg: 22px;--van-line-height-xl: 24px;--van-base-font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--van-price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;--van-animation-duration-base: .3s;--van-animation-duration-fast: .2s;--van-animation-timing-function-enter: ease-out;--van-animation-timing-function-leave: ease-in;--van-border-color: var(--van-gray-4);--van-border-width-base: 1px;--van-border-radius-sm: 2px;--van-border-radius-md: 4px;--van-border-radius-lg: 8px;--van-border-radius-max: 999px}:root.van-theme-dark{--van-text-color: #f1f4f6;--van-text-color-2: #c4c9cf;--van-text-color-3: #8b949e;--van-active-color: #2e3742;--van-background-color: #151a20;--van-background-color-light: #1b2129;--van-border-color: #424c59}
package/es/style/var.less CHANGED
@@ -129,7 +129,7 @@
129
129
  @animation-timing-function-leave: ease-in;
130
130
 
131
131
  // Border
132
- @border-color: var(--van-gray-3);
132
+ @border-color: var(--van-gray-4);
133
133
  @border-width-base: 1px;
134
134
  @border-radius-sm: 2px;
135
135
  @border-radius-md: 4px;
@@ -0,0 +1,85 @@
1
+ import { type ExtractPropTypes, type PropType } from 'vue';
2
+ export declare type TitleBarSize = 'default' | 'mini';
3
+ declare const titleBarProps: {
4
+ title: {
5
+ type: PropType<string>;
6
+ default: string;
7
+ };
8
+ description: {
9
+ type: PropType<string>;
10
+ default: string;
11
+ };
12
+ icon: StringConstructor;
13
+ showIcon: BooleanConstructor;
14
+ showDescription: BooleanConstructor;
15
+ showArrow: BooleanConstructor;
16
+ size: {
17
+ type: PropType<TitleBarSize>;
18
+ default: TitleBarSize;
19
+ };
20
+ expandable: BooleanConstructor;
21
+ modelValue: {
22
+ type: BooleanConstructor;
23
+ default: true;
24
+ };
25
+ };
26
+ export declare type TitleBarProps = ExtractPropTypes<typeof titleBarProps>;
27
+ declare const _default: import("vue").DefineComponent<{
28
+ title: {
29
+ type: PropType<string>;
30
+ default: string;
31
+ };
32
+ description: {
33
+ type: PropType<string>;
34
+ default: string;
35
+ };
36
+ icon: StringConstructor;
37
+ showIcon: BooleanConstructor;
38
+ showDescription: BooleanConstructor;
39
+ showArrow: BooleanConstructor;
40
+ size: {
41
+ type: PropType<TitleBarSize>;
42
+ default: TitleBarSize;
43
+ };
44
+ expandable: BooleanConstructor;
45
+ modelValue: {
46
+ type: BooleanConstructor;
47
+ default: true;
48
+ };
49
+ }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "change" | "update:modelValue")[], "click" | "change" | "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
50
+ title: {
51
+ type: PropType<string>;
52
+ default: string;
53
+ };
54
+ description: {
55
+ type: PropType<string>;
56
+ default: string;
57
+ };
58
+ icon: StringConstructor;
59
+ showIcon: BooleanConstructor;
60
+ showDescription: BooleanConstructor;
61
+ showArrow: BooleanConstructor;
62
+ size: {
63
+ type: PropType<TitleBarSize>;
64
+ default: TitleBarSize;
65
+ };
66
+ expandable: BooleanConstructor;
67
+ modelValue: {
68
+ type: BooleanConstructor;
69
+ default: true;
70
+ };
71
+ }>> & {
72
+ onChange?: ((...args: any[]) => any) | undefined;
73
+ onClick?: ((...args: any[]) => any) | undefined;
74
+ "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
75
+ }, {
76
+ title: string;
77
+ size: TitleBarSize;
78
+ modelValue: boolean;
79
+ description: string;
80
+ expandable: boolean;
81
+ showArrow: boolean;
82
+ showDescription: boolean;
83
+ showIcon: boolean;
84
+ }>;
85
+ export default _default;
@@ -0,0 +1,62 @@
1
+ import { defineComponent, createVNode as _createVNode } from "vue";
2
+ import { Icon } from "../icon/index.mjs";
3
+ import { createNamespace, makeStringProp, truthProp } from "../utils/index.mjs";
4
+ const [name, bem] = createNamespace("title-bar");
5
+ const titleBarProps = {
6
+ title: makeStringProp(""),
7
+ description: makeStringProp(""),
8
+ icon: String,
9
+ showIcon: Boolean,
10
+ showDescription: Boolean,
11
+ showArrow: Boolean,
12
+ size: makeStringProp("default"),
13
+ expandable: Boolean,
14
+ modelValue: truthProp
15
+ };
16
+ var stdin_default = defineComponent({
17
+ name,
18
+ props: titleBarProps,
19
+ emits: ["update:modelValue", "change", "click"],
20
+ setup(props, {
21
+ slots,
22
+ emit
23
+ }) {
24
+ const toggle = () => {
25
+ if (!props.expandable)
26
+ return;
27
+ const value = !props.modelValue;
28
+ emit("update:modelValue", value);
29
+ emit("change", value);
30
+ };
31
+ return () => {
32
+ var _a, _b, _c;
33
+ return _createVNode("section", {
34
+ "class": bem({
35
+ mini: props.size === "mini",
36
+ expandable: props.expandable
37
+ })
38
+ }, [_createVNode("button", {
39
+ "type": "button",
40
+ "class": bem("header"),
41
+ "aria-expanded": props.expandable ? props.modelValue : void 0,
42
+ "onClick": (event) => {
43
+ emit("click", event);
44
+ toggle();
45
+ }
46
+ }, [props.showIcon && props.icon && _createVNode(Icon, {
47
+ "name": props.icon,
48
+ "class": bem("icon")
49
+ }, null), _createVNode("span", {
50
+ "class": bem("text")
51
+ }, [_createVNode("strong", null, [((_a = slots.title) == null ? void 0 : _a.call(slots)) || props.title]), props.size !== "mini" && props.showDescription && props.description && _createVNode("span", null, [((_b = slots.description) == null ? void 0 : _b.call(slots)) || props.description])]), (props.showArrow || props.expandable) && _createVNode(Icon, {
52
+ "name": "arrow-up",
53
+ "class": bem("arrow", {
54
+ expanded: props.expandable && props.modelValue
55
+ })
56
+ }, null)]), (!props.expandable || props.modelValue) && ((_c = slots.default) == null ? void 0 : _c.call(slots))]);
57
+ };
58
+ }
59
+ });
60
+ export {
61
+ stdin_default as default
62
+ };
@@ -0,0 +1 @@
1
+ :root{--van-title-bar-padding: 12px var(--van-padding-md) 4px;--van-title-bar-gap: 4px;--van-title-bar-title-color: var(--van-gray-8);--van-title-bar-description-color: var(--van-gray-6)}.van-title-bar{color:var(--van-title-bar-title-color)}.van-title-bar__header{display:flex;align-items:flex-start;width:100%;padding:var(--van-title-bar-padding);color:inherit;font:inherit;text-align:left;background:transparent;border:0}.van-title-bar--expandable .van-title-bar__header{cursor:pointer}.van-title-bar--expandable .van-title-bar__header:active{background:var(--van-active-color)}.van-title-bar__icon{flex:none;margin:3px 4px 0 0;font-size:16px}.van-title-bar__text{display:flex;flex:1;flex-direction:column;min-width:0}.van-title-bar__text strong{overflow:hidden;font-size:var(--van-font-size-md);font-weight:var(--van-font-weight-bold);line-height:var(--van-line-height-lg);text-overflow:ellipsis;white-space:nowrap}.van-title-bar__text>span{overflow:hidden;color:var(--van-title-bar-description-color);font-size:var(--van-font-size-sm);font-weight:400;line-height:var(--van-line-height-md);text-overflow:ellipsis;white-space:nowrap}.van-title-bar__arrow{flex:none;margin:4px 0 0 8px;color:var(--van-gray-6);font-size:14px;transition:transform var(--van-animation-duration-fast);transform:rotate(180deg)}.van-title-bar__arrow--expanded{transform:rotate(0)}.van-title-bar--mini .van-title-bar__header{padding-top:12px;padding-bottom:4px}.van-title-bar--mini .van-title-bar__text strong{font-size:var(--van-font-size-sm);line-height:var(--van-line-height-md)}.van-title-bar--mini .van-title-bar__icon{margin-top:3px;font-size:14px}.van-title-bar--mini .van-title-bar__arrow{margin-top:3px}