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.
- package/README.md +11 -12
- package/bin/persagy-vant.mjs +63 -0
- package/es/cell/Cell.d.ts +34 -1
- package/es/cell/Cell.mjs +48 -12
- package/es/cell/index.css +1 -1
- package/es/cell/index.d.ts +20 -1
- package/es/cell/index.less +19 -0
- package/es/cell/var.less +1 -1
- package/es/collapse-item/CollapseItem.d.ts +25 -0
- package/es/collapse-item/index.d.ts +18 -0
- package/es/content-panel/ContentPanel.d.ts +46 -0
- package/es/content-panel/ContentPanel.mjs +72 -0
- package/es/content-panel/index.css +1 -0
- package/es/content-panel/index.d.ts +33 -0
- package/es/content-panel/index.less +54 -0
- package/es/content-panel/index.mjs +8 -0
- package/es/content-panel/style/index.mjs +11 -0
- package/es/content-panel/style/less.mjs +11 -0
- package/es/content-panel/var.css +0 -0
- package/es/content-panel/var.less +3 -0
- package/es/dialog/Dialog.d.ts +4 -0
- package/es/dialog/Dialog.mjs +14 -1
- package/es/dialog/function-call.d.ts +2 -0
- package/es/dialog/types.d.ts +2 -0
- package/es/field/Field.d.ts +25 -0
- package/es/field/Field.mjs +1 -1
- package/es/field/index.d.ts +18 -0
- package/es/index.d.ts +6 -1
- package/es/index.mjs +16 -1
- package/es/info-card/InfoCard.d.ts +1 -0
- package/es/info-card/InfoCard.mjs +1 -0
- package/es/label/Label.d.ts +67 -0
- package/es/label/Label.mjs +22 -7
- package/es/label/index.css +1 -1
- package/es/label/index.d.ts +45 -0
- package/es/label/index.less +19 -0
- package/es/label/var.less +4 -1
- package/es/loading/Loading.mjs +18 -21
- package/es/material-action-bar/MaterialActionBar.d.ts +66 -0
- package/es/material-action-bar/MaterialActionBar.mjs +132 -0
- package/es/material-action-bar/index.css +1 -0
- package/es/material-action-bar/index.d.ts +58 -0
- package/es/material-action-bar/index.less +33 -0
- package/es/material-action-bar/index.mjs +8 -0
- package/es/material-action-bar/style/index.mjs +19 -0
- package/es/material-action-bar/style/less.mjs +19 -0
- package/es/material-add/MaterialAdd.mjs +12 -7
- package/es/material-add/index.css +1 -1
- package/es/material-add/index.less +7 -5
- package/es/material-add/style/index.mjs +7 -0
- package/es/material-add/style/less.mjs +7 -0
- package/es/material-detail/MaterialDetail.d.ts +64 -0
- package/es/material-detail/MaterialDetail.mjs +192 -0
- package/es/material-detail/index.css +1 -0
- package/es/material-detail/index.d.ts +40 -0
- package/es/material-detail/index.less +20 -0
- package/es/material-detail/index.mjs +8 -0
- package/es/material-detail/style/index.mjs +11 -0
- package/es/material-detail/style/less.mjs +11 -0
- package/es/material-display-bar/MaterialDisplayBar.d.ts +159 -0
- package/es/material-display-bar/MaterialDisplayBar.mjs +109 -0
- package/es/material-display-bar/index.css +1 -0
- package/es/material-display-bar/index.d.ts +103 -0
- package/es/material-display-bar/index.less +113 -0
- package/es/material-display-bar/index.mjs +8 -0
- package/es/material-display-bar/style/index.mjs +11 -0
- package/es/material-display-bar/style/less.mjs +11 -0
- package/es/material-display-bar/var.css +0 -0
- package/es/material-display-bar/var.less +12 -0
- package/es/rate/RateCell.mjs +4 -1
- package/es/rate/index.css +1 -1
- package/es/rate/index.less +16 -3
- package/es/search/Search.d.ts +14 -1
- package/es/search/Search.mjs +5 -3
- package/es/search/index.css +1 -1
- package/es/search/index.d.ts +9 -0
- package/es/search/index.less +10 -0
- package/es/search/types.d.ts +1 -0
- package/es/step/index.css +1 -1
- package/es/step/var.less +2 -2
- package/es/style/base.css +1 -1
- package/es/style/css-variables.css +1 -1
- package/es/style/var.less +1 -1
- package/es/title-bar/TitleBar.d.ts +85 -0
- package/es/title-bar/TitleBar.mjs +62 -0
- package/es/title-bar/index.css +1 -0
- package/es/title-bar/index.d.ts +60 -0
- package/es/title-bar/index.less +25 -0
- package/es/title-bar/index.mjs +8 -0
- package/es/title-bar/style/index.mjs +4 -0
- package/es/title-bar/style/less.mjs +4 -0
- package/es/title-bar/var.css +0 -0
- package/es/title-bar/var.less +6 -0
- package/es/tree-select/TreeSelect.d.ts +13 -0
- package/es/tree-select/TreeSelect.mjs +4 -2
- package/es/tree-select/index.css +1 -1
- package/es/tree-select/index.d.ts +9 -0
- package/es/tree-select/index.less +6 -0
- package/lib/cell/Cell.d.ts +34 -1
- package/lib/cell/Cell.js +46 -10
- package/lib/cell/index.css +1 -1
- package/lib/cell/index.d.ts +20 -1
- package/lib/cell/index.less +19 -0
- package/lib/cell/var.less +1 -1
- package/lib/collapse-item/CollapseItem.d.ts +25 -0
- package/lib/collapse-item/index.d.ts +18 -0
- package/lib/content-panel/ContentPanel.d.ts +46 -0
- package/lib/content-panel/ContentPanel.js +91 -0
- package/lib/content-panel/index.css +1 -0
- package/lib/content-panel/index.d.ts +33 -0
- package/lib/content-panel/index.js +37 -0
- package/lib/content-panel/index.less +54 -0
- package/lib/content-panel/style/index.js +11 -0
- package/lib/content-panel/style/less.js +11 -0
- package/lib/content-panel/var.css +0 -0
- package/lib/content-panel/var.less +3 -0
- package/lib/dialog/Dialog.d.ts +4 -0
- package/lib/dialog/Dialog.js +13 -0
- package/lib/dialog/function-call.d.ts +2 -0
- package/lib/dialog/types.d.ts +2 -0
- package/lib/dog1.jpg +0 -0
- package/lib/dog2.jpg +0 -0
- package/lib/dog3.jpg +0 -0
- package/lib/field/Field.d.ts +25 -0
- package/lib/field/Field.js +1 -1
- package/lib/field/index.d.ts +18 -0
- package/lib/index.css +1 -1
- package/lib/index.d.ts +6 -1
- package/lib/index.js +16 -1
- package/lib/index.less +6 -1
- package/lib/info-card/InfoCard.d.ts +1 -0
- package/lib/info-card/InfoCard.js +1 -0
- package/lib/label/Label.d.ts +67 -0
- package/lib/label/Label.js +21 -6
- package/lib/label/index.css +1 -1
- package/lib/label/index.d.ts +45 -0
- package/lib/label/index.less +19 -0
- package/lib/label/var.less +4 -1
- package/lib/loading/Loading.js +18 -21
- package/lib/material-action-bar/MaterialActionBar.d.ts +66 -0
- package/lib/material-action-bar/MaterialActionBar.js +151 -0
- package/lib/material-action-bar/index.css +1 -0
- package/lib/material-action-bar/index.d.ts +58 -0
- package/lib/material-action-bar/index.js +37 -0
- package/lib/material-action-bar/index.less +33 -0
- package/lib/material-action-bar/style/index.js +19 -0
- package/lib/material-action-bar/style/less.js +19 -0
- package/lib/material-add/MaterialAdd.js +12 -7
- package/lib/material-add/index.css +1 -1
- package/lib/material-add/index.less +7 -5
- package/lib/material-add/style/index.js +7 -0
- package/lib/material-add/style/less.js +7 -0
- package/lib/material-detail/MaterialDetail.d.ts +64 -0
- package/lib/material-detail/MaterialDetail.js +211 -0
- package/lib/material-detail/index.css +1 -0
- package/lib/material-detail/index.d.ts +40 -0
- package/lib/material-detail/index.js +37 -0
- package/lib/material-detail/index.less +20 -0
- package/lib/material-detail/style/index.js +11 -0
- package/lib/material-detail/style/less.js +11 -0
- package/lib/material-display-bar/MaterialDisplayBar.d.ts +159 -0
- package/lib/material-display-bar/MaterialDisplayBar.js +128 -0
- package/lib/material-display-bar/index.css +1 -0
- package/lib/material-display-bar/index.d.ts +103 -0
- package/lib/material-display-bar/index.js +37 -0
- package/lib/material-display-bar/index.less +113 -0
- package/lib/material-display-bar/style/index.js +11 -0
- package/lib/material-display-bar/style/less.js +11 -0
- package/lib/material-display-bar/var.css +0 -0
- package/lib/material-display-bar/var.less +12 -0
- package/lib/rate/RateCell.js +4 -1
- package/lib/rate/index.css +1 -1
- package/lib/rate/index.less +16 -3
- package/lib/search/Search.d.ts +14 -1
- package/lib/search/Search.js +5 -3
- package/lib/search/index.css +1 -1
- package/lib/search/index.d.ts +9 -0
- package/lib/search/index.less +10 -0
- package/lib/search/types.d.ts +1 -0
- package/lib/step/index.css +1 -1
- package/lib/step/var.less +2 -2
- package/lib/style/base.css +1 -1
- package/lib/style/css-variables.css +1 -1
- package/lib/style/var.less +1 -1
- package/lib/title-bar/TitleBar.d.ts +85 -0
- package/lib/title-bar/TitleBar.js +81 -0
- package/lib/title-bar/index.css +1 -0
- package/lib/title-bar/index.d.ts +60 -0
- package/lib/title-bar/index.js +37 -0
- package/lib/title-bar/index.less +25 -0
- package/lib/title-bar/style/index.js +4 -0
- package/lib/title-bar/style/less.js +4 -0
- package/lib/title-bar/var.css +0 -0
- package/lib/title-bar/var.less +6 -0
- package/lib/tree-select/TreeSelect.d.ts +13 -0
- package/lib/tree-select/TreeSelect.js +3 -1
- package/lib/tree-select/index.css +1 -1
- package/lib/tree-select/index.d.ts +9 -0
- package/lib/tree-select/index.less +6 -0
- package/lib/vant.cjs.js +1641 -1218
- package/lib/vant.es.js +1641 -1218
- package/lib/vant.js +1641 -1218
- package/lib/vant.min.js +1 -1
- package/lib/web-types.json +1 -1
- package/package.json +6 -2
- package/skills/use-persagy-vant/references/business-component-catalog.md +8 -3
- package/skills/use-persagy-vant/references/component-catalog.md +7 -4
- package/skills/use-persagy-vant/references/component-documentation.md +1 -1
- package/skills/use-persagy-vant/references/design-interaction-baseline.md +3 -3
- package/skills/use-persagy-vant/references/page-recipes.md +18 -5
- package/skills/use-persagy-vant/references/reuse-policy.md +1 -1
- 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;
|
package/es/rate/RateCell.mjs
CHANGED
|
@@ -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(
|
|
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:
|
|
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}
|
package/es/rate/index.less
CHANGED
|
@@ -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:
|
|
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
|
}
|
package/es/search/Search.d.ts
CHANGED
|
@@ -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;
|
package/es/search/Search.mjs
CHANGED
|
@@ -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("
|
|
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)
|
package/es/search/index.css
CHANGED
|
@@ -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)}
|
package/es/search/index.d.ts
CHANGED
|
@@ -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;
|
package/es/search/index.less
CHANGED
|
@@ -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;
|
package/es/search/types.d.ts
CHANGED
|
@@ -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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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
|
@@ -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}
|