persagy-vant 0.0.30 → 0.0.31
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/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 +1 -1
- 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
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}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
export declare const TitleBar: import("../utils").WithInstall<import("vue").DefineComponent<{
|
|
2
|
+
title: {
|
|
3
|
+
type: import("vue").PropType<string>;
|
|
4
|
+
default: string;
|
|
5
|
+
};
|
|
6
|
+
description: {
|
|
7
|
+
type: import("vue").PropType<string>;
|
|
8
|
+
default: string;
|
|
9
|
+
};
|
|
10
|
+
icon: StringConstructor;
|
|
11
|
+
showIcon: BooleanConstructor;
|
|
12
|
+
showDescription: BooleanConstructor;
|
|
13
|
+
showArrow: BooleanConstructor;
|
|
14
|
+
size: {
|
|
15
|
+
type: import("vue").PropType<import("./TitleBar").TitleBarSize>;
|
|
16
|
+
default: import("./TitleBar").TitleBarSize;
|
|
17
|
+
};
|
|
18
|
+
expandable: BooleanConstructor;
|
|
19
|
+
modelValue: {
|
|
20
|
+
type: BooleanConstructor;
|
|
21
|
+
default: true;
|
|
22
|
+
};
|
|
23
|
+
}, () => 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<import("vue").ExtractPropTypes<{
|
|
24
|
+
title: {
|
|
25
|
+
type: import("vue").PropType<string>;
|
|
26
|
+
default: string;
|
|
27
|
+
};
|
|
28
|
+
description: {
|
|
29
|
+
type: import("vue").PropType<string>;
|
|
30
|
+
default: string;
|
|
31
|
+
};
|
|
32
|
+
icon: StringConstructor;
|
|
33
|
+
showIcon: BooleanConstructor;
|
|
34
|
+
showDescription: BooleanConstructor;
|
|
35
|
+
showArrow: BooleanConstructor;
|
|
36
|
+
size: {
|
|
37
|
+
type: import("vue").PropType<import("./TitleBar").TitleBarSize>;
|
|
38
|
+
default: import("./TitleBar").TitleBarSize;
|
|
39
|
+
};
|
|
40
|
+
expandable: BooleanConstructor;
|
|
41
|
+
modelValue: {
|
|
42
|
+
type: BooleanConstructor;
|
|
43
|
+
default: true;
|
|
44
|
+
};
|
|
45
|
+
}>> & {
|
|
46
|
+
onChange?: ((...args: any[]) => any) | undefined;
|
|
47
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
48
|
+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
49
|
+
}, {
|
|
50
|
+
title: string;
|
|
51
|
+
size: import("./TitleBar").TitleBarSize;
|
|
52
|
+
modelValue: boolean;
|
|
53
|
+
description: string;
|
|
54
|
+
expandable: boolean;
|
|
55
|
+
showArrow: boolean;
|
|
56
|
+
showDescription: boolean;
|
|
57
|
+
showIcon: boolean;
|
|
58
|
+
}>>;
|
|
59
|
+
export default TitleBar;
|
|
60
|
+
export type { TitleBarProps, TitleBarSize } from './TitleBar';
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
@import './var.less';
|
|
2
|
+
|
|
3
|
+
:root {
|
|
4
|
+
--van-title-bar-padding: @title-bar-padding;
|
|
5
|
+
--van-title-bar-gap: @title-bar-gap;
|
|
6
|
+
--van-title-bar-title-color: @title-bar-title-color;
|
|
7
|
+
--van-title-bar-description-color: @title-bar-description-color;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.van-title-bar {
|
|
11
|
+
color: var(--van-title-bar-title-color);
|
|
12
|
+
|
|
13
|
+
&__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; }
|
|
14
|
+
&--expandable &__header { cursor: pointer; &:active { background: var(--van-active-color); } }
|
|
15
|
+
&__icon { flex: none; margin: 3px 4px 0 0; font-size: 16px; }
|
|
16
|
+
&__text { display: flex; flex: 1; flex-direction: column; min-width: 0; }
|
|
17
|
+
&__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; }
|
|
18
|
+
&__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; }
|
|
19
|
+
&__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); }
|
|
20
|
+
&__arrow--expanded { transform: rotate(0); }
|
|
21
|
+
&--mini &__header { padding-top: 12px; padding-bottom: 4px; }
|
|
22
|
+
&--mini &__text strong { font-size: var(--van-font-size-sm); line-height: var(--van-line-height-md); }
|
|
23
|
+
&--mini &__icon { margin-top: 3px; font-size: 14px; }
|
|
24
|
+
&--mini &__arrow { margin-top: 3px; }
|
|
25
|
+
}
|
|
File without changes
|
|
@@ -25,6 +25,10 @@ declare const treeSelectProps: {
|
|
|
25
25
|
cascade: BooleanConstructor;
|
|
26
26
|
selectableParent: BooleanConstructor;
|
|
27
27
|
showParentSelect: BooleanConstructor;
|
|
28
|
+
showDivider: {
|
|
29
|
+
type: BooleanConstructor;
|
|
30
|
+
default: true;
|
|
31
|
+
};
|
|
28
32
|
};
|
|
29
33
|
export declare type TreeSelectProps = ExtractPropTypes<typeof treeSelectProps>;
|
|
30
34
|
declare const _default: import("vue").DefineComponent<{
|
|
@@ -44,6 +48,10 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
44
48
|
cascade: BooleanConstructor;
|
|
45
49
|
selectableParent: BooleanConstructor;
|
|
46
50
|
showParentSelect: BooleanConstructor;
|
|
51
|
+
showDivider: {
|
|
52
|
+
type: BooleanConstructor;
|
|
53
|
+
default: true;
|
|
54
|
+
};
|
|
47
55
|
}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select" | "update:modelValue" | "update:expandedKeys" | "expand")[], "select" | "update:modelValue" | "update:expandedKeys" | "expand", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
|
|
48
56
|
items: {
|
|
49
57
|
type: PropType<TreeSelectItem[]>;
|
|
@@ -61,6 +69,10 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
61
69
|
cascade: BooleanConstructor;
|
|
62
70
|
selectableParent: BooleanConstructor;
|
|
63
71
|
showParentSelect: BooleanConstructor;
|
|
72
|
+
showDivider: {
|
|
73
|
+
type: BooleanConstructor;
|
|
74
|
+
default: true;
|
|
75
|
+
};
|
|
64
76
|
}>> & {
|
|
65
77
|
onSelect?: ((...args: any[]) => any) | undefined;
|
|
66
78
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
@@ -74,5 +86,6 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
74
86
|
expandedKeys: Numeric[];
|
|
75
87
|
selectableParent: boolean;
|
|
76
88
|
showParentSelect: boolean;
|
|
89
|
+
showDivider: boolean;
|
|
77
90
|
}>;
|
|
78
91
|
export default _default;
|
|
@@ -15,7 +15,7 @@ var __spreadValues = (a, b) => {
|
|
|
15
15
|
return a;
|
|
16
16
|
};
|
|
17
17
|
import { computed, defineComponent, Transition, createVNode as _createVNode } from "vue";
|
|
18
|
-
import { makeArrayProp, createNamespace } from "../utils/index.mjs";
|
|
18
|
+
import { makeArrayProp, createNamespace, truthProp } from "../utils/index.mjs";
|
|
19
19
|
import { Cell } from "../cell/index.mjs";
|
|
20
20
|
import { Icon } from "../icon/index.mjs";
|
|
21
21
|
const [name, bem] = createNamespace("tree-select");
|
|
@@ -26,7 +26,8 @@ const treeSelectProps = {
|
|
|
26
26
|
multiple: Boolean,
|
|
27
27
|
cascade: Boolean,
|
|
28
28
|
selectableParent: Boolean,
|
|
29
|
-
showParentSelect: Boolean
|
|
29
|
+
showParentSelect: Boolean,
|
|
30
|
+
showDivider: truthProp
|
|
30
31
|
};
|
|
31
32
|
var stdin_default = defineComponent({
|
|
32
33
|
name,
|
|
@@ -118,6 +119,7 @@ var stdin_default = defineComponent({
|
|
|
118
119
|
branch: hasChildren
|
|
119
120
|
}),
|
|
120
121
|
"title": item.text,
|
|
122
|
+
"border": props.showDivider,
|
|
121
123
|
"style": {
|
|
122
124
|
paddingLeft: `calc(var(--van-padding-md) + ${level * 16}px)`
|
|
123
125
|
},
|
package/es/tree-select/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--van-tree-select-indent: var(--van-padding-md);--van-tree-select-arrow-size: 16px;--van-tree-select-animation-duration: .24s}.van-tree-select{overflow:hidden;color:var(--van-cell-text-color);background:var(--van-white)}.van-tree-select__node{overflow:hidden}.van-tree-select__cell{min-height:44px;padding:10px var(--van-padding-md)}.van-tree-select__cell .van-cell__title-row{align-items:center}.van-tree-select__cell .van-cell__title{font-size:var(--van-font-size-md);line-height:22px}.van-tree-select__arrow{flex:none;margin-right:var(--van-padding-base);color:var(--van-gray-5);font-size:var(--van-tree-select-arrow-size);transition:transform var(--van-tree-select-animation-duration) ease}.van-tree-select__arrow--expanded{transform:rotate(0)}.van-tree-select__arrow:not(.van-tree-select__arrow--expanded){transform:rotate(-90deg)}.van-tree-select__expand-control{display:inline-flex;align-items:center;padding:0;color:inherit;font:inherit;line-height:inherit;text-align:left;background:transparent;border:0}.van-tree-select__expand-control:not(:disabled){cursor:pointer}.van-tree-select__expand-control:disabled{color:var(--van-text-color-3);cursor:not-allowed}.van-tree-select__children{overflow:hidden}.van-tree-select__indeterminate{position:relative;display:block;width:14px;height:14px;padding:0;background:var(--van-primary-color);border:0;border-radius:50%}.van-tree-select__indeterminate:after{position:absolute;top:calc(50% - 1px);right:25%;left:25%;height:2px;content:"";background:var(--van-white);border-radius:1px}.van-tree-select-expand-enter-active,.van-tree-select-expand-leave-active{overflow:hidden;transition:max-height var(--van-tree-select-animation-duration) ease,opacity var(--van-tree-select-animation-duration) ease}.van-tree-select-expand-enter-from,.van-tree-select-expand-leave-to{max-height:0;opacity:0}.van-tree-select-expand-enter-to,.van-tree-select-expand-leave-from{max-height:1000px;opacity:1}
|
|
1
|
+
:root{--van-tree-select-indent: var(--van-padding-md);--van-tree-select-arrow-size: 16px;--van-tree-select-animation-duration: .24s}.van-tree-select{overflow:hidden;color:var(--van-cell-text-color);background:var(--van-white)}.van-tree-select__node{overflow:hidden}.van-tree-select__cell{min-height:44px;padding:10px var(--van-padding-md)}.van-tree-select__cell .van-cell__title-row{align-items:center}.van-tree-select__cell .van-cell__title{font-size:var(--van-font-size-md);line-height:22px}.van-tree-select__node:not(:last-child)>.van-tree-select__cell:not(.van-cell--borderless):after{display:block}.van-tree-select__arrow{flex:none;margin-right:var(--van-padding-base);color:var(--van-gray-5);font-size:var(--van-tree-select-arrow-size);transition:transform var(--van-tree-select-animation-duration) ease}.van-tree-select__arrow--expanded{transform:rotate(0)}.van-tree-select__arrow:not(.van-tree-select__arrow--expanded){transform:rotate(-90deg)}.van-tree-select__expand-control{display:inline-flex;align-items:center;padding:0;color:inherit;font:inherit;line-height:inherit;text-align:left;background:transparent;border:0}.van-tree-select__expand-control:not(:disabled){cursor:pointer}.van-tree-select__expand-control:disabled{color:var(--van-text-color-3);cursor:not-allowed}.van-tree-select__children{overflow:hidden}.van-tree-select__indeterminate{position:relative;display:block;width:14px;height:14px;padding:0;background:var(--van-primary-color);border:0;border-radius:50%}.van-tree-select__indeterminate:after{position:absolute;top:calc(50% - 1px);right:25%;left:25%;height:2px;content:"";background:var(--van-white);border-radius:1px}.van-tree-select-expand-enter-active,.van-tree-select-expand-leave-active{overflow:hidden;transition:max-height var(--van-tree-select-animation-duration) ease,opacity var(--van-tree-select-animation-duration) ease}.van-tree-select-expand-enter-from,.van-tree-select-expand-leave-to{max-height:0;opacity:0}.van-tree-select-expand-enter-to,.van-tree-select-expand-leave-from{max-height:1000px;opacity:1}
|
|
@@ -15,6 +15,10 @@ export declare const TreeSelect: import("../utils").WithInstall<import("vue").De
|
|
|
15
15
|
cascade: BooleanConstructor;
|
|
16
16
|
selectableParent: BooleanConstructor;
|
|
17
17
|
showParentSelect: BooleanConstructor;
|
|
18
|
+
showDivider: {
|
|
19
|
+
type: BooleanConstructor;
|
|
20
|
+
default: true;
|
|
21
|
+
};
|
|
18
22
|
}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select" | "update:modelValue" | "update:expandedKeys" | "expand")[], "select" | "update:modelValue" | "update:expandedKeys" | "expand", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
19
23
|
items: {
|
|
20
24
|
type: import("vue").PropType<import("./TreeSelect").TreeSelectItem[]>;
|
|
@@ -32,6 +36,10 @@ export declare const TreeSelect: import("../utils").WithInstall<import("vue").De
|
|
|
32
36
|
cascade: BooleanConstructor;
|
|
33
37
|
selectableParent: BooleanConstructor;
|
|
34
38
|
showParentSelect: BooleanConstructor;
|
|
39
|
+
showDivider: {
|
|
40
|
+
type: BooleanConstructor;
|
|
41
|
+
default: true;
|
|
42
|
+
};
|
|
35
43
|
}>> & {
|
|
36
44
|
onSelect?: ((...args: any[]) => any) | undefined;
|
|
37
45
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
@@ -45,6 +53,7 @@ export declare const TreeSelect: import("../utils").WithInstall<import("vue").De
|
|
|
45
53
|
expandedKeys: import("../utils").Numeric[];
|
|
46
54
|
selectableParent: boolean;
|
|
47
55
|
showParentSelect: boolean;
|
|
56
|
+
showDivider: boolean;
|
|
48
57
|
}>>;
|
|
49
58
|
export default TreeSelect;
|
|
50
59
|
export type { TreeSelectItem, TreeSelectChild, TreeSelectProps, } from './TreeSelect';
|
|
@@ -21,6 +21,12 @@
|
|
|
21
21
|
.van-cell__title { font-size: var(--van-font-size-md); line-height: 22px; }
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
+
// Each Cell is wrapped by a tree node, so Cell's :last-child rule would
|
|
25
|
+
// otherwise hide every divider. Restore it between sibling tree nodes.
|
|
26
|
+
&__node:not(:last-child) > &__cell:not(.van-cell--borderless)::after {
|
|
27
|
+
display: block;
|
|
28
|
+
}
|
|
29
|
+
|
|
24
30
|
&__arrow {
|
|
25
31
|
flex: none;
|
|
26
32
|
margin-right: var(--van-padding-base);
|