xt-element-ui 1.3.3 → 1.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/CHANGELOG.md +72 -72
  2. package/LICENSE +21 -21
  3. package/README.md +240 -240
  4. package/docs/README.md +100 -100
  5. package/docs/components/base/xt-button.md +114 -114
  6. package/docs/components/base/xt-card-item.md +104 -104
  7. package/docs/components/base/xt-card.md +108 -108
  8. package/docs/components/base/xt-config-provider.md +199 -199
  9. package/docs/components/base/xt-flex-box.md +115 -115
  10. package/docs/components/base/xt-grid-box.md +302 -302
  11. package/docs/components/base/xt-input.md +150 -150
  12. package/docs/components/base/xt-map-provider.md +23 -23
  13. package/docs/components/base/xt-map.md +331 -331
  14. package/docs/components/base/xt-step-price.md +165 -165
  15. package/docs/components/base/xt-text.md +212 -212
  16. package/docs/components/base/xt-time.md +165 -165
  17. package/docs/components/extend/ex-bar.md +67 -67
  18. package/docs/components/extend/ex-button.md +62 -62
  19. package/docs/components/extend/ex-card.md +86 -86
  20. package/docs/components/extend/ex-chart.md +463 -463
  21. package/docs/components/extend/ex-icon.md +189 -189
  22. package/docs/components/extend/ex-line.md +70 -70
  23. package/docs/components/extend/ex-multi.md +155 -155
  24. package/docs/components/extend/ex-pie.md +69 -69
  25. package/docs/components/extend/ex-select-tree.md +210 -210
  26. package/docs/components/extend/ex-table.md +590 -590
  27. package/docs/components/extend/ex-upload.md +134 -134
  28. package/docs/components/utils/size.md +147 -147
  29. package/docs/components/utils/theme.md +182 -182
  30. package/lib/index.common.js +4112 -4122
  31. package/lib/index.umd.js +4072 -4081
  32. package/lib/index.umd.min.js +3 -3
  33. package/package.json +80 -81
  34. package/src/components/ex-button/index.js +7 -7
  35. package/src/components/ex-button/index.vue +66 -66
  36. package/src/components/ex-button/style/index.scss +67 -67
  37. package/src/components/ex-card/index.js +7 -7
  38. package/src/components/ex-card/index.vue +68 -68
  39. package/src/components/ex-card/style/index.scss +73 -73
  40. package/src/components/ex-chart/index.js +7 -7
  41. package/src/components/ex-chart/index.vue +136 -136
  42. package/src/components/ex-date-picker/index.js +7 -7
  43. package/src/components/ex-icon/index.js +7 -7
  44. package/src/components/ex-icon/index.vue +168 -168
  45. package/src/components/ex-icon/style/index.scss +7 -7
  46. package/src/components/ex-page/index.js +7 -7
  47. package/src/components/ex-select-tree/index.js +7 -7
  48. package/src/components/ex-table/ExTableCell.vue +22 -22
  49. package/src/components/ex-table/index.js +7 -7
  50. package/src/components/ex-table/virtualScrollData.js +35 -35
  51. package/src/components/ex-upload/index.js +7 -7
  52. package/src/components/index.scss +39 -39
  53. package/src/components/xt-button/index.js +7 -7
  54. package/src/components/xt-button/index.vue +97 -97
  55. package/src/components/xt-card/index.js +7 -7
  56. package/src/components/xt-card/style/index.scss +48 -48
  57. package/src/components/xt-card-item/index.js +7 -7
  58. package/src/components/xt-card-item/style/index copy.scss +71 -71
  59. package/src/components/xt-card-item/style/index.scss +82 -82
  60. package/src/components/xt-config-provider/index.js +7 -7
  61. package/src/components/xt-config-provider/index.vue +362 -362
  62. package/src/components/xt-config-provider/style/index.scss +11 -11
  63. package/src/components/xt-flex-box/index.js +7 -7
  64. package/src/components/xt-flex-box/style/index.scss +81 -81
  65. package/src/components/xt-grid-box/index.js +7 -7
  66. package/src/components/xt-grid-box/style/index.scss +92 -92
  67. package/src/components/xt-grid-item/index.js +7 -7
  68. package/src/components/xt-grid-item/index.vue +106 -106
  69. package/src/components/xt-input/index.js +7 -7
  70. package/src/components/xt-input/index.vue +66 -66
  71. package/src/components/xt-input/style/index.scss +84 -84
  72. package/src/components/xt-map/adapters/amap.js +235 -235
  73. package/src/components/xt-map/adapters/baidu.js +254 -254
  74. package/src/components/xt-map/adapters/base.js +267 -267
  75. package/src/components/xt-map/adapters/index.js +29 -29
  76. package/src/components/xt-map/adapters/tianditu.js +242 -242
  77. package/src/components/xt-map/config/xt-map-config.js +197 -197
  78. package/src/components/xt-map/index.js +8 -8
  79. package/src/components/xt-map/index.vue +351 -351
  80. package/src/components/xt-map/loaders/script-loader.js +114 -114
  81. package/src/components/xt-map/provider.vue +200 -200
  82. package/src/components/xt-map/style/index.scss +77 -77
  83. package/src/components/xt-map-provider/index.js +8 -8
  84. package/src/components/xt-step-price/index.js +10 -10
  85. package/src/components/xt-step-price/index.vue +272 -272
  86. package/src/components/xt-step-price/style/index.scss +123 -123
  87. package/src/components/xt-step-price-item/index.js +7 -7
  88. package/src/components/xt-step-price-item/index.vue +187 -187
  89. package/src/components/xt-text/index.js +7 -7
  90. package/src/components/xt-text/index.vue +1 -1
  91. package/src/components/xt-text/style/index.scss +92 -92
  92. package/src/components/xt-time/index.js +7 -7
  93. package/src/components/xt-time/index.vue +313 -313
  94. package/src/components/xt-time/style/index.scss +23 -23
  95. package/src/config/element-registry.js +135 -135
  96. package/src/index.js +162 -178
  97. package/src/styles/css-variables.scss +257 -257
  98. package/src/styles/theme/background.scss +5 -5
  99. package/src/styles/theme/border-radius.scss +3 -3
  100. package/src/styles/theme/borders.scss +3 -3
  101. package/src/styles/theme/colors.scss +101 -101
  102. package/src/styles/theme/component-variables.scss +69 -69
  103. package/src/styles/theme/dark-variables.scss +28 -28
  104. package/src/styles/theme/font.scss +12 -12
  105. package/src/styles/theme/index.scss +11 -11
  106. package/src/styles/theme/shadows.scss +2 -2
  107. package/src/styles/theme/spacing.scss +4 -4
  108. package/src/styles/theme/transitions.scss +2 -2
  109. package/src/styles/theme/typography.scss +4 -4
  110. package/src/styles/variables-export.scss +85 -85
  111. package/src/utils/index.js +191 -202
package/docs/components/base/xt-text.md CHANGED
@@ -1,212 +1,212 @@
1
- ## XtText 文本组件
2
-
3
- 文本组件用于展示不同样式的文本内容。
4
-
5
- ## 基本用法
6
-
7
- ::: demo 基本用法
8
- ```vue
9
- <template>
10
- <XtText type="primary">主要文本</XtText>
11
- </template>
12
- ```
13
- :::
14
-
15
- ## 属性说明
16
- | 属性 | 类型 | 默认值 | 可选值 | 说明 |
17
- |------|------|--------|--------|------|
18
- | `type` | String | - | `primary`、`success`、`warning`、`danger` | 文本颜色类型 |
19
- | `size` | String | base | `extra-large`、`large`、`medium`、`base`、`small`、`extra-small` | 字体大小 |
20
- | `bold` | Boolean | false | - | 是否加粗 |
21
- | `letterSpacing` | String / Number | - | - | 字间距 |
22
- | `money` | Boolean | false | - | 是否启用金额格式化 |
23
- | `value` | Number / String | - | - | 金额数值 |
24
- | `currency` | String | CNY | `CNY`、`USD`、`EUR`、`JPY`、`GBP`、`AUD`、`CAD` | 货币类型 |
25
- | `decimals` | Number | 2 | 0-10 | 小数位数 |
26
- | `locale` | String | zh-CN | - | 语言环境 |
27
- | `showSign` | Boolean | false | - | 是否显示正负号 |
28
- | `prefix` | String | - | - | 自定义前缀 |
29
- | `suffix` | String | - | - | 自定义后缀 |
30
-
31
- ## 示例
32
-
33
- ### 不同类型的文本
34
- ::: demo 不同类型的文本
35
- ```vue
36
- <template>
37
- <div style="display: flex; gap: 16px;">
38
- <XtText type="primary">主要文本</XtText>
39
- <XtText type="success">成功文本</XtText>
40
- <XtText type="warning">警告文本</XtText>
41
- <XtText type="danger">危险文本</XtText>
42
- </div>
43
- </template>
44
- ```
45
- :::
46
-
47
- ### 不同字体大小
48
- ::: demo 不同字体大小
49
- ```vue
50
- <template>
51
- <div style="display: flex; flex-direction: column; gap: 8px;">
52
- <XtText size="extra-large">特大号文本</XtText>
53
- <XtText size="large">大号文本</XtText>
54
- <XtText size="medium">中号文本</XtText>
55
- <XtText size="base">基准文本</XtText>
56
- <XtText size="small">小号文本</XtText>
57
- <XtText size="extra-small">特小号文本</XtText>
58
- </div>
59
- </template>
60
- ```
61
- :::
62
-
63
- ### 加粗文本
64
-
65
- ::: demo 加粗文本
66
- ```vue
67
- <template>
68
- <div style="display: flex; flex-direction: column; gap: 8px;">
69
- <XtText bold>普通加粗文本</XtText>
70
- <XtText type="primary" bold>主要加粗文本</XtText>
71
- </div>
72
- </template>
73
- ```
74
- :::
75
-
76
- ### 字间距
77
- ::: demo 字间距
78
- ```vue
79
- <template>
80
- <div style="display: flex; flex-direction: column; gap: 8px;">
81
- <XtText>正常字间距</XtText>
82
- <XtText :letterSpacing="4">宽字距文本</XtText>
83
- <XtText letterSpacing="8px">更宽字距文本</XtText>
84
- </div>
85
- </template>
86
- ```
87
- :::
88
-
89
- ### 组合使用
90
-
91
- ::: demo 组合使用
92
- ```vue
93
- <template>
94
- <div style="display: flex; flex-direction: column; gap: 8px;">
95
- <XtText type="success" bold>成功加粗文本</XtText>
96
- <XtText type="danger" :letterSpacing="2">危险宽字距文本</XtText>
97
- <XtText type="warning" bold :letterSpacing="3">警告加粗宽字距</XtText>
98
- </div>
99
- </template>
100
- ```
101
- :::
102
-
103
- ### 段落文本
104
-
105
- ::: demo 段落文本
106
- ```vue
107
- <template>
108
- <p>
109
- 这是一段普通文本，其中包含
110
- <XtText type="primary">高亮的主要文本</XtText>
111
- 和
112
- <XtText type="danger">危险提示文本</XtText>。
113
- </p>
114
- </template>
115
- ```
116
- :::
117
-
118
- ### 数据展示
119
-
120
- ::: demo 数据展示
121
- ```vue
122
- <template>
123
- <div style="display: flex; align-items: baseline; gap: 8px;">
124
- <XtText type="primary" bold style="font-size: 24px;">¥1,234.56</XtText>
125
- <XtText type="warning" :letterSpacing="1">本月已节省¥520</XtText>
126
- </div>
127
- </template>
128
- ```
129
- :::
130
-
131
- ### 金额格式化
132
- ::: demo 金额格式化
133
- ```vue
134
- <template>
135
- <div style="display: flex; flex-direction: column; gap: 12px;">
136
- <div>
137
- <span style="color: #909399; margin-right: 16px;">人民币：</span>
138
- <XtText money :value="123456.78" type="primary" bold></XtText>
139
- </div>
140
- <div>
141
- <span style="color: #909399; margin-right: 16px;">美元：</span>
142
- <XtText money :value="123456.78" currency="USD"></XtText>
143
- </div>
144
- <div>
145
- <span style="color: #909399; margin-right: 16px;">欧元：</span>
146
- <XtText money :value="123456.78" currency="EUR" locale="de-DE"></XtText>
147
- </div>
148
- <div>
149
- <span style="color: #909399; margin-right: 16px;">日元：</span>
150
- <XtText money :value="123456" currency="JPY" :decimals="0"></XtText>
151
- </div>
152
- </div>
153
- </template>
154
- ```
155
- :::
156
-
157
- ### 金额显示正负号
158
- ::: demo 金额显示正负号
159
- ```vue
160
- <template>
161
- <div style="display: flex; flex-direction: column; gap: 8px;">
162
- <div>
163
- <span style="color: #909399; margin-right: 16px;">收入：</span>
164
- <XtText money :value="5000" showSign type="success"></XtText>
165
- </div>
166
- <div>
167
- <span style="color: #909399; margin-right: 16px;">支出：</span>
168
- <XtText money :value="-2300" showSign type="danger"></XtText>
169
- </div>
170
- </div>
171
- </template>
172
- ```
173
- :::
174
-
175
- ### 自定义前缀后缀
176
-
177
- ::: demo 自定义前缀后缀
178
- ```vue
179
- <template>
180
- <div style="display: flex; flex-direction: column; gap: 8px;">
181
- <div>
182
- <XtText money :value="1000" prefix="合计：" suffix=" 元整" type="primary"></XtText>
183
- </div>
184
- <div>
185
- <XtText money :value="98.5" prefix="折扣价：" type="warning"></XtText>
186
- </div>
187
- </div>
188
- </template>
189
- ```
190
- :::
191
-
192
- ### 金额样式组合
193
-
194
- ::: demo 金额样式组合
195
- ```vue
196
- <template>
197
- <div style="display: flex; flex-direction: column; gap: 12px;">
198
- <div style="font-size: 28px;">
199
- <XtText money :value="1234567.89" type="primary" bold></XtText>
200
- </div>
201
- <div>
202
- <span style="color: #909399;">今日收益：</span>
203
- <XtText money :value="1258.67" showSign type="success"></XtText>
204
- </div>
205
- <div>
206
- <span style="color: #909399;">累计支出：</span>
207
- <XtText money :value="-8920.30" showSign type="danger"></XtText>
208
- </div>
209
- </div>
210
- </template>
211
- ```
212
- :::
1
+ ## XtText 文本组件
2
+
3
+ 文本组件用于展示不同样式的文本内容。
4
+
5
+ ## 基本用法
6
+
7
+ ::: demo 基本用法
8
+ ```vue
9
+ <template>
10
+ <XtText type="primary">主要文本</XtText>
11
+ </template>
12
+ ```
13
+ :::
14
+
15
+ ## 属性说明
16
+ | 属性 | 类型 | 默认值 | 可选值 | 说明 |
17
+ |------|------|--------|--------|------|
18
+ | `type` | String | - | `primary`、`success`、`warning`、`danger` | 文本颜色类型 |
19
+ | `size` | String | base | `extra-large`、`large`、`medium`、`base`、`small`、`extra-small` | 字体大小 |
20
+ | `bold` | Boolean | false | - | 是否加粗 |
21
+ | `letterSpacing` | String / Number | - | - | 字间距 |
22
+ | `money` | Boolean | false | - | 是否启用金额格式化 |
23
+ | `value` | Number / String | - | - | 金额数值 |
24
+ | `currency` | String | CNY | `CNY`、`USD`、`EUR`、`JPY`、`GBP`、`AUD`、`CAD` | 货币类型 |
25
+ | `decimals` | Number | 2 | 0-10 | 小数位数 |
26
+ | `locale` | String | zh-CN | - | 语言环境 |
27
+ | `showSign` | Boolean | false | - | 是否显示正负号 |
28
+ | `prefix` | String | - | - | 自定义前缀 |
29
+ | `suffix` | String | - | - | 自定义后缀 |
30
+
31
+ ## 示例
32
+
33
+ ### 不同类型的文本
34
+ ::: demo 不同类型的文本
35
+ ```vue
36
+ <template>
37
+ <div style="display: flex; gap: 16px;">
38
+ <XtText type="primary">主要文本</XtText>
39
+ <XtText type="success">成功文本</XtText>
40
+ <XtText type="warning">警告文本</XtText>
41
+ <XtText type="danger">危险文本</XtText>
42
+ </div>
43
+ </template>
44
+ ```
45
+ :::
46
+
47
+ ### 不同字体大小
48
+ ::: demo 不同字体大小
49
+ ```vue
50
+ <template>
51
+ <div style="display: flex; flex-direction: column; gap: 8px;">
52
+ <XtText size="extra-large">特大号文本</XtText>
53
+ <XtText size="large">大号文本</XtText>
54
+ <XtText size="medium">中号文本</XtText>
55
+ <XtText size="base">基准文本</XtText>
56
+ <XtText size="small">小号文本</XtText>
57
+ <XtText size="extra-small">特小号文本</XtText>
58
+ </div>
59
+ </template>
60
+ ```
61
+ :::
62
+
63
+ ### 加粗文本
64
+
65
+ ::: demo 加粗文本
66
+ ```vue
67
+ <template>
68
+ <div style="display: flex; flex-direction: column; gap: 8px;">
69
+ <XtText bold>普通加粗文本</XtText>
70
+ <XtText type="primary" bold>主要加粗文本</XtText>
71
+ </div>
72
+ </template>
73
+ ```
74
+ :::
75
+
76
+ ### 字间距
77
+ ::: demo 字间距
78
+ ```vue
79
+ <template>
80
+ <div style="display: flex; flex-direction: column; gap: 8px;">
81
+ <XtText>正常字间距</XtText>
82
+ <XtText :letterSpacing="4">宽字距文本</XtText>
83
+ <XtText letterSpacing="8px">更宽字距文本</XtText>
84
+ </div>
85
+ </template>
86
+ ```
87
+ :::
88
+
89
+ ### 组合使用
90
+
91
+ ::: demo 组合使用
92
+ ```vue
93
+ <template>
94
+ <div style="display: flex; flex-direction: column; gap: 8px;">
95
+ <XtText type="success" bold>成功加粗文本</XtText>
96
+ <XtText type="danger" :letterSpacing="2">危险宽字距文本</XtText>
97
+ <XtText type="warning" bold :letterSpacing="3">警告加粗宽字距</XtText>
98
+ </div>
99
+ </template>
100
+ ```
101
+ :::
102
+
103
+ ### 段落文本
104
+
105
+ ::: demo 段落文本
106
+ ```vue
107
+ <template>
108
+ <p>
109
+ 这是一段普通文本，其中包含
110
+ <XtText type="primary">高亮的主要文本</XtText>
111
+ 和
112
+ <XtText type="danger">危险提示文本</XtText>。
113
+ </p>
114
+ </template>
115
+ ```
116
+ :::
117
+
118
+ ### 数据展示
119
+
120
+ ::: demo 数据展示
121
+ ```vue
122
+ <template>
123
+ <div style="display: flex; align-items: baseline; gap: 8px;">
124
+ <XtText type="primary" bold style="font-size: 24px;">¥1,234.56</XtText>
125
+ <XtText type="warning" :letterSpacing="1">本月已节省¥520</XtText>
126
+ </div>
127
+ </template>
128
+ ```
129
+ :::
130
+
131
+ ### 金额格式化
132
+ ::: demo 金额格式化
133
+ ```vue
134
+ <template>
135
+ <div style="display: flex; flex-direction: column; gap: 12px;">
136
+ <div>
137
+ <span style="color: #909399; margin-right: 16px;">人民币：</span>
138
+ <XtText money :value="123456.78" type="primary" bold></XtText>
139
+ </div>
140
+ <div>
141
+ <span style="color: #909399; margin-right: 16px;">美元：</span>
142
+ <XtText money :value="123456.78" currency="USD"></XtText>
143
+ </div>
144
+ <div>
145
+ <span style="color: #909399; margin-right: 16px;">欧元：</span>
146
+ <XtText money :value="123456.78" currency="EUR" locale="de-DE"></XtText>
147
+ </div>
148
+ <div>
149
+ <span style="color: #909399; margin-right: 16px;">日元：</span>
150
+ <XtText money :value="123456" currency="JPY" :decimals="0"></XtText>
151
+ </div>
152
+ </div>
153
+ </template>
154
+ ```
155
+ :::
156
+
157
+ ### 金额显示正负号
158
+ ::: demo 金额显示正负号
159
+ ```vue
160
+ <template>
161
+ <div style="display: flex; flex-direction: column; gap: 8px;">
162
+ <div>
163
+ <span style="color: #909399; margin-right: 16px;">收入：</span>
164
+ <XtText money :value="5000" showSign type="success"></XtText>
165
+ </div>
166
+ <div>
167
+ <span style="color: #909399; margin-right: 16px;">支出：</span>
168
+ <XtText money :value="-2300" showSign type="danger"></XtText>
169
+ </div>
170
+ </div>
171
+ </template>
172
+ ```
173
+ :::
174
+
175
+ ### 自定义前缀后缀
176
+
177
+ ::: demo 自定义前缀后缀
178
+ ```vue
179
+ <template>
180
+ <div style="display: flex; flex-direction: column; gap: 8px;">
181
+ <div>
182
+ <XtText money :value="1000" prefix="合计：" suffix=" 元整" type="primary"></XtText>
183
+ </div>
184
+ <div>
185
+ <XtText money :value="98.5" prefix="折扣价：" type="warning"></XtText>
186
+ </div>
187
+ </div>
188
+ </template>
189
+ ```
190
+ :::
191
+
192
+ ### 金额样式组合
193
+
194
+ ::: demo 金额样式组合
195
+ ```vue
196
+ <template>
197
+ <div style="display: flex; flex-direction: column; gap: 12px;">
198
+ <div style="font-size: 28px;">
199
+ <XtText money :value="1234567.89" type="primary" bold></XtText>
200
+ </div>
201
+ <div>
202
+ <span style="color: #909399;">今日收益：</span>
203
+ <XtText money :value="1258.67" showSign type="success"></XtText>
204
+ </div>
205
+ <div>
206
+ <span style="color: #909399;">累计支出：</span>
207
+ <XtText money :value="-8920.30" showSign type="danger"></XtText>
208
+ </div>
209
+ </div>
210
+ </template>
211
+ ```
212
+ :::