xt-element-ui 1.0.4 → 1.0.6

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/lib/index.umd.js CHANGED
@@ -1,13 +1,13 @@
1
1
  (function webpackUniversalModuleDefinition(root, factory) {
2
2
  if(typeof exports === 'object' && typeof module === 'object')
3
- module.exports = factory(require("ElementUI"), require("Vue"));
3
+ module.exports = factory();
4
4
  else if(typeof define === 'function' && define.amd)
5
- define("xt-element-ui", ["ElementUI", "Vue"], factory);
5
+ define("xt-element-ui", [], factory);
6
6
  else if(typeof exports === 'object')
7
- exports["xt-element-ui"] = factory(require("ElementUI"), require("Vue"));
7
+ exports["xt-element-ui"] = factory();
8
8
  else
9
- root["xt-element-ui"] = factory(root["ElementUI"], root["Vue"]);
10
- })((typeof self !== 'undefined' ? self : this), function(__WEBPACK_EXTERNAL_MODULE__5f72__, __WEBPACK_EXTERNAL_MODULE__8bbf__) {
9
+ root["xt-element-ui"] = factory();
10
+ })((typeof self !== 'undefined' ? self : this), function() {
11
11
  return /******/ (function(modules) { // webpackBootstrap
12
12
  /******/ // The module cache
13
13
  /******/ var installedModules = {};
@@ -96,24 +96,11 @@ return /******/ (function(modules) { // webpackBootstrap
96
96
  /************************************************************************/
97
97
  /******/ ({
98
98
 
99
- /***/ "0fae":
99
+ /***/ "27fd":
100
100
  /***/ (function(module, exports, __webpack_require__) {
101
101
 
102
102
  // extracted by mini-css-extract-plugin
103
-
104
- /***/ }),
105
-
106
- /***/ "5f72":
107
- /***/ (function(module, exports) {
108
-
109
- module.exports = __WEBPACK_EXTERNAL_MODULE__5f72__;
110
-
111
- /***/ }),
112
-
113
- /***/ "8bbf":
114
- /***/ (function(module, exports) {
115
-
116
- module.exports = __WEBPACK_EXTERNAL_MODULE__8bbf__;
103
+ module.exports = {"xtColorPrimary":"#409EFF","xtColorSuccess":"#67C23A","xtColorWarning":"#E6A23C","xtColorDanger":"#F56C6C","xtColorInfo":"#909399","xtColorPrimaryLight3":"#79BBFF","xtColorPrimaryLight5":"#A0CFFF","xtColorPrimaryLight7":"#C6E2FF","xtColorPrimaryLight8":"#D9ECFF","xtColorPrimaryLight9":"#ECF5FF","xtColorTextPrimary":"#303133","xtColorTextRegular":"#606266","xtColorTextSecondary":"#909399","xtColorTextPlaceholder":"#C0C4CC","xtColorTextDisabled":"#C0C4CC","xtColorBgPrimary":"#ffffff","xtColorBgSecondary":"#f5f7fa","xtColorBgHover":"#f5f5f5","xtColorBgContainer":"#f5f7fa","xtColorBgOverlay":"#ffffff","xtColorBorder":"#DCDFE6","xtColorBorderLight":"#E4E7ED","xtColorBorderLighter":"#EBEEF5","xtColorBorderExtraLight":"#F2F6FC","xtFontSizeExtraLarge":"20px","xtFontSizeLarge":"18px","xtFontSizeMedium":"16px","xtFontSizeBase":"14px","xtFontSizeSmall":"13px","xtFontSizeExtraSmall":"12px","xtSpacingXs":"4px","xtSpacingSm":"8px","xtSpacingMd":"12px","xtSpacingLg":"16px","xtSpacingXl":"20px","xtBorderRadiusBase":"4px","xtBorderRadiusSmall":"2px","xtBorderRadiusRound":"20px","xtBorderRadiusCircle":"50%","xtShadowSm":"0 2px 4px rgba(0, 0, 0, 0.04)","xtShadowMd":"0 4px 12px rgba(0, 0, 0, 0.08)","xtShadowLg":"0 8px 24px rgba(0, 0, 0, 0.12)","xtTransitionDuration":"0.3s","xtTransitionDurationFast":"0.2s"};
117
104
 
118
105
  /***/ }),
119
106
 
@@ -125,16 +112,18 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__8bbf__;
125
112
  __webpack_require__.r(__webpack_exports__);
126
113
 
127
114
  // EXPORTS
128
- __webpack_require__.d(__webpack_exports__, "getConfig", function() { return /* reexport */ getConfig; });
129
- __webpack_require__.d(__webpack_exports__, "setConfig", function() { return /* reexport */ setConfig; });
130
- __webpack_require__.d(__webpack_exports__, "setTheme", function() { return /* reexport */ setTheme; });
131
- __webpack_require__.d(__webpack_exports__, "setSize", function() { return /* reexport */ setSize; });
132
- __webpack_require__.d(__webpack_exports__, "setPrimaryColor", function() { return /* reexport */ setPrimaryColor; });
133
- __webpack_require__.d(__webpack_exports__, "getTheme", function() { return /* reexport */ getTheme; });
134
- __webpack_require__.d(__webpack_exports__, "getSize", function() { return /* reexport */ getSize; });
135
- __webpack_require__.d(__webpack_exports__, "getPrimaryColor", function() { return /* reexport */ getPrimaryColor; });
136
- __webpack_require__.d(__webpack_exports__, "resetConfig", function() { return /* reexport */ resetConfig; });
137
- __webpack_require__.d(__webpack_exports__, "onConfigChange", function() { return /* reexport */ onConfigChange; });
115
+ __webpack_require__.d(__webpack_exports__, "utils", function() { return /* reexport */ utils; });
116
+ __webpack_require__.d(__webpack_exports__, "variables", function() { return /* reexport */ export_default.a; });
117
+ __webpack_require__.d(__webpack_exports__, "getConfig", function() { return /* reexport */ src_getConfig; });
118
+ __webpack_require__.d(__webpack_exports__, "setConfig", function() { return /* reexport */ src_setConfig; });
119
+ __webpack_require__.d(__webpack_exports__, "setTheme", function() { return /* reexport */ src_setTheme; });
120
+ __webpack_require__.d(__webpack_exports__, "setSize", function() { return /* reexport */ src_setSize; });
121
+ __webpack_require__.d(__webpack_exports__, "setPrimaryColor", function() { return /* reexport */ src_setPrimaryColor; });
122
+ __webpack_require__.d(__webpack_exports__, "getTheme", function() { return /* reexport */ src_getTheme; });
123
+ __webpack_require__.d(__webpack_exports__, "getSize", function() { return /* reexport */ src_getSize; });
124
+ __webpack_require__.d(__webpack_exports__, "getPrimaryColor", function() { return /* reexport */ src_getPrimaryColor; });
125
+ __webpack_require__.d(__webpack_exports__, "resetConfig", function() { return /* reexport */ src_resetConfig; });
126
+ __webpack_require__.d(__webpack_exports__, "onConfigChange", function() { return /* reexport */ src_onConfigChange; });
138
127
 
139
128
  // CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
140
129
  // This file is imported into lib/wc client bundles.
@@ -152,18 +141,136 @@ if (typeof window !== 'undefined') {
152
141
  // Indicate to webpack that this file can be concatenated
153
142
  /* harmony default export */ var setPublicPath = (null);
154
143
 
155
- // EXTERNAL MODULE: external "Vue"
156
- var external_Vue_ = __webpack_require__("8bbf");
157
- var external_Vue_default = /*#__PURE__*/__webpack_require__.n(external_Vue_);
158
-
159
- // EXTERNAL MODULE: external "ElementUI"
160
- var external_ElementUI_ = __webpack_require__("5f72");
161
- var external_ElementUI_default = /*#__PURE__*/__webpack_require__.n(external_ElementUI_);
144
+ // EXTERNAL MODULE: ./src/styles/export.scss
145
+ var styles_export = __webpack_require__("27fd");
146
+ var export_default = /*#__PURE__*/__webpack_require__.n(styles_export);
162
147
 
163
- // EXTERNAL MODULE: ./node_modules/element-ui/lib/theme-chalk/index.css
164
- var theme_chalk = __webpack_require__("0fae");
165
-
166
- // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"7d921827-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/button/index.vue?vue&type=template&id=0ad9d4c9
148
+ // CONCATENATED MODULE: ./src/utils/index.js
149
+
150
+ // 默认配置
151
+ const defaultConfig = {
152
+ theme: 'light',
153
+ size: 'medium',
154
+ primaryColor: '#1890ff'
155
+ }
156
+
157
+ // 当前配置
158
+ let currentConfig = { ...defaultConfig }
159
+
160
+ // 配置变更事件处理
161
+ const configChangeListeners = []
162
+
163
+ const emitConfigChange = function(key, value) {
164
+ configChangeListeners.forEach(listener => {
165
+ listener(key, value)
166
+ })
167
+ }
168
+
169
+ // 获取所有配置
170
+ const getConfig = function() {
171
+ return { ...currentConfig }
172
+ }
173
+
174
+ // 设置全局配置
175
+ const setConfig = function(config) {
176
+ if (typeof config !== 'object' || config === null) {
177
+ console.warn('[XtElementUI] setConfig 必须传入对象参数')
178
+ return
179
+ }
180
+
181
+ if (config.theme !== undefined) {
182
+ setTheme(config.theme)
183
+ }
184
+ if (config.size !== undefined) {
185
+ setSize(config.size)
186
+ }
187
+ if (config.primaryColor !== undefined) {
188
+ setPrimaryColor(config.primaryColor)
189
+ }
190
+ }
191
+
192
+
193
+ // 设置主题
194
+ const setTheme = function(theme) {
195
+ const validThemes = ['light', 'dark', 'compact']
196
+ if (!validThemes.includes(theme)) {
197
+ console.warn(`[XtElementUI] 无效的主题值: ${theme},可选值: ${validThemes.join(', ')}`)
198
+ return
199
+ }
200
+
201
+ currentConfig.theme = theme
202
+ document.documentElement.setAttribute('data-theme', theme)
203
+ emitConfigChange('theme', theme)
204
+ }
205
+
206
+ // 设置字体大小
207
+ const setSize = function(size) {
208
+ const validSizes = ['small', 'medium', 'large']
209
+ if (!validSizes.includes(size)) {
210
+ console.warn(`[XtElementUI] 无效的大小值: ${size},可选值: ${validSizes.join(', ')}`)
211
+ return
212
+ }
213
+
214
+ currentConfig.size = size
215
+ document.documentElement.setAttribute('data-size', size)
216
+ emitConfigChange('size', size)
217
+ }
218
+
219
+ // 设置主色调
220
+ const setPrimaryColor = function(color) {
221
+ // 简单的颜色格式验证
222
+ const colorRegex = /^#[0-9A-Fa-f]{6}$|^#[0-9A-Fa-f]{3}$/
223
+ if (!colorRegex.test(color)) {
224
+ console.warn(`[XtElementUI] 无效的颜色值: ${color},请使用十六进制颜色格式,如 #1890ff`)
225
+ return
226
+ }
227
+
228
+ currentConfig.primaryColor = color
229
+ document.documentElement.style.setProperty('--xt-color-primary', color)
230
+ emitConfigChange('primaryColor', color)
231
+ }
232
+
233
+ // 获取当前主题
234
+ const getTheme = function() {
235
+ return currentConfig.theme
236
+ }
237
+
238
+ // 获取当前字体大小
239
+ const getSize = function() {
240
+ return currentConfig.size
241
+ }
242
+
243
+ // 获取当前主色调
244
+ const getPrimaryColor = function() {
245
+ return currentConfig.primaryColor
246
+ }
247
+
248
+ // 重置为默认配置
249
+ const resetConfig = function() {
250
+ setConfig(defaultConfig)
251
+ }
252
+
253
+ // 监听配置变更
254
+ const onConfigChange = function(listener) {
255
+ if (typeof listener === 'function') {
256
+ configChangeListeners.push(listener)
257
+ return function() {
258
+ const index = configChangeListeners.indexOf(listener)
259
+ if (index > -1) {
260
+ configChangeListeners.splice(index, 1)
261
+ }
262
+ }
263
+ } else {
264
+ console.warn('[XtElementUI] onConfigChange 必须传入函数')
265
+ }
266
+ }
267
+
268
+ /* harmony default export */ var utils = ({
269
+ setTheme,
270
+ setSize,
271
+ setPrimaryColor
272
+ });
273
+ // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"a978fd84-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/button/index.vue?vue&type=template&id=0ad9d4c9
167
274
  var render = function render(){var _vm=this,_c=_vm._self._c;return _c('el-button',{on:{"click":_vm.handleClick}},[_vm._t("default")],2)
168
275
  }
169
276
  var staticRenderFns = []
@@ -305,7 +412,7 @@ var component = normalizeComponent(
305
412
  // CONCATENATED MODULE: ./src/components/button/index.js
306
413
 
307
414
  /* harmony default export */ var src_components_button = (components_button);
308
- // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"7d921827-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/input/index.vue?vue&type=template&id=fe9146e4
415
+ // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"a978fd84-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/input/index.vue?vue&type=template&id=fe9146e4
309
416
  var inputvue_type_template_id_fe9146e4_render = function render(){var _vm=this,_c=_vm._self._c;return _c('el-input',{attrs:{"value":_vm.value,"placeholder":_vm.placeholder},on:{"input":function($event){return _vm.$emit('input', $event)}}})
310
417
  }
311
418
  var inputvue_type_template_id_fe9146e4_staticRenderFns = []
@@ -352,15 +459,8 @@ var input_component = normalizeComponent(
352
459
 
353
460
  /* harmony default export */ var components_input = (input);
354
461
  // CONCATENATED MODULE: ./src/index.js
355
- // 导入 Vue
356
-
462
+ // 导入 SCSS 变量(通过 CSS Modules :export 导出)
357
463
 
358
- // 在导入 Element UI 之前,先将 Vue 设置为全局变量
359
- if (typeof window !== 'undefined') {
360
- window.Vue = external_Vue_default.a
361
- }
362
-
363
- // 导入 Element UI 并注册
364
464
 
365
465
 
366
466
 
@@ -375,9 +475,6 @@ const components = [
375
475
  ]
376
476
 
377
477
 
378
- // 注册 Element UI
379
- external_Vue_default.a.use(external_ElementUI_default.a)
380
-
381
478
  // 定义 install 方法,Vue.use() 会自动调用
382
479
  const install = function (Vue) {
383
480
  if (install.installed) return
@@ -387,6 +484,7 @@ const install = function (Vue) {
387
484
  components.forEach(component => {
388
485
  Vue.component(component.name, component)
389
486
  })
487
+ Vue.prototype.$utils = utils
390
488
  }
391
489
 
392
490
  // 支持全局 script 标签引入
@@ -402,117 +500,118 @@ if (typeof window !== 'undefined' && window.Vue) {
402
500
  Input: components_input
403
501
  });
404
502
 
503
+ // 导出工具函数和变量
504
+
405
505
 
406
506
  // 默认配置
407
- const defaultConfig = {
507
+ const src_defaultConfig = {
408
508
  theme: 'light',
409
509
  size: 'medium',
410
510
  primaryColor: '#1890ff'
411
511
  }
412
512
 
413
513
  // 当前配置
414
- let currentConfig = { ...defaultConfig }
514
+ let src_currentConfig = { ...src_defaultConfig }
415
515
 
416
516
  // 配置变更事件处理
417
- const configChangeListeners = []
517
+ const src_configChangeListeners = []
418
518
 
419
- const emitConfigChange = function(key, value) {
420
- configChangeListeners.forEach(listener => {
519
+ const src_emitConfigChange = function(key, value) {
520
+ src_configChangeListeners.forEach(listener => {
421
521
  listener(key, value)
422
522
  })
423
523
  }
424
524
 
425
525
  // 获取所有配置
426
- const getConfig = function() {
427
- return { ...currentConfig }
526
+ const src_getConfig = function() {
527
+ return { ...src_currentConfig }
428
528
  }
429
529
 
430
530
  // 设置全局配置
431
- const setConfig = function(config) {
531
+ const src_setConfig = function(config) {
432
532
  if (typeof config !== 'object' || config === null) {
433
533
  console.warn('[XtElementUI] setConfig 必须传入对象参数')
434
534
  return
435
535
  }
436
536
 
437
537
  if (config.theme !== undefined) {
438
- setTheme(config.theme)
538
+ src_setTheme(config.theme)
439
539
  }
440
540
  if (config.size !== undefined) {
441
- setSize(config.size)
541
+ src_setSize(config.size)
442
542
  }
443
543
  if (config.primaryColor !== undefined) {
444
- setPrimaryColor(config.primaryColor)
544
+ src_setPrimaryColor(config.primaryColor)
445
545
  }
446
546
  }
447
547
 
448
- // 设置主题
449
- const setTheme = function(theme) {
450
- const validThemes = ['light', 'dark', 'compact']
548
+ // 设置主题(只控制颜色)
549
+ const src_setTheme = function(theme) {
550
+ const validThemes = ['light', 'dark']
451
551
  if (!validThemes.includes(theme)) {
452
552
  console.warn(`[XtElementUI] 无效的主题值: ${theme},可选值: ${validThemes.join(', ')}`)
453
553
  return
454
554
  }
455
555
 
456
- currentConfig.theme = theme
556
+ src_currentConfig.theme = theme
457
557
  document.documentElement.setAttribute('data-theme', theme)
458
- emitConfigChange('theme', theme)
558
+ src_emitConfigChange('theme', theme)
459
559
  }
460
560
 
461
- // 设置字体大小
462
- const setSize = function(size) {
561
+ // 设置字体大小和间距
562
+ const src_setSize = function(size) {
463
563
  const validSizes = ['small', 'medium', 'large']
464
564
  if (!validSizes.includes(size)) {
465
565
  console.warn(`[XtElementUI] 无效的大小值: ${size},可选值: ${validSizes.join(', ')}`)
466
566
  return
467
567
  }
468
568
 
469
- currentConfig.size = size
569
+ src_currentConfig.size = size
470
570
  document.documentElement.setAttribute('data-size', size)
471
- emitConfigChange('size', size)
571
+ src_emitConfigChange('size', size)
472
572
  }
473
573
 
474
574
  // 设置主色调
475
- const setPrimaryColor = function(color) {
476
- // 简单的颜色格式验证
575
+ const src_setPrimaryColor = function(color) {
477
576
  const colorRegex = /^#[0-9A-Fa-f]{6}$|^#[0-9A-Fa-f]{3}$/
478
577
  if (!colorRegex.test(color)) {
479
578
  console.warn(`[XtElementUI] 无效的颜色值: ${color},请使用十六进制颜色格式,如 #1890ff`)
480
579
  return
481
580
  }
482
581
 
483
- currentConfig.primaryColor = color
582
+ src_currentConfig.primaryColor = color
484
583
  document.documentElement.style.setProperty('--xt-color-primary', color)
485
- emitConfigChange('primaryColor', color)
584
+ src_emitConfigChange('primaryColor', color)
486
585
  }
487
586
 
488
587
  // 获取当前主题
489
- const getTheme = function() {
490
- return currentConfig.theme
588
+ const src_getTheme = function() {
589
+ return src_currentConfig.theme
491
590
  }
492
591
 
493
592
  // 获取当前字体大小
494
- const getSize = function() {
495
- return currentConfig.size
593
+ const src_getSize = function() {
594
+ return src_currentConfig.size
496
595
  }
497
596
 
498
597
  // 获取当前主色调
499
- const getPrimaryColor = function() {
500
- return currentConfig.primaryColor
598
+ const src_getPrimaryColor = function() {
599
+ return src_currentConfig.primaryColor
501
600
  }
502
601
 
503
602
  // 重置为默认配置
504
- const resetConfig = function() {
505
- setConfig(defaultConfig)
603
+ const src_resetConfig = function() {
604
+ src_setConfig(src_defaultConfig)
506
605
  }
507
606
 
508
607
  // 监听配置变更
509
- const onConfigChange = function(listener) {
608
+ const src_onConfigChange = function(listener) {
510
609
  if (typeof listener === 'function') {
511
- configChangeListeners.push(listener)
610
+ src_configChangeListeners.push(listener)
512
611
  return function() {
513
- const index = configChangeListeners.indexOf(listener)
612
+ const index = src_configChangeListeners.indexOf(listener)
514
613
  if (index > -1) {
515
- configChangeListeners.splice(index, 1)
614
+ src_configChangeListeners.splice(index, 1)
516
615
  }
517
616
  }
518
617
  } else {
@@ -1 +1 @@
1
- (function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("ElementUI"),require("Vue")):"function"===typeof define&&define.amd?define("xt-element-ui",["ElementUI","Vue"],t):"object"===typeof exports?exports["xt-element-ui"]=t(require("ElementUI"),require("Vue")):e["xt-element-ui"]=t(e["ElementUI"],e["Vue"])})("undefined"!==typeof self?self:this,(function(e,t){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var r=t[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(o,r,function(t){return e[t]}.bind(null,r));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s="fb15")}({"0fae":function(e,t,n){},"5f72":function(t,n){t.exports=e},"8bbf":function(e,n){e.exports=t},fb15:function(e,t,n){"use strict";if(n.r(t),n.d(t,"getConfig",(function(){return z})),n.d(t,"setConfig",(function(){return V})),n.d(t,"setTheme",(function(){return X})),n.d(t,"setSize",(function(){return P})),n.d(t,"setPrimaryColor",(function(){return T})),n.d(t,"getTheme",(function(){return k})),n.d(t,"getSize",(function(){return R})),n.d(t,"getPrimaryColor",(function(){return q})),n.d(t,"resetConfig",(function(){return A})),n.d(t,"onConfigChange",(function(){return M})),"undefined"!==typeof window){var o=window.document.currentScript,r=o&&o.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);r&&(n.p=r[1])}var i=n("8bbf"),u=n.n(i),f=n("5f72"),c=n.n(f),l=(n("0fae"),function(){var e=this,t=e._self._c;return t("el-button",{on:{click:e.handleClick}},[e._t("default")],2)}),s=[],a={name:"XtButton",methods:{handleClick(){this.$emit("click")}}},d=a;function p(e,t,n,o,r,i,u,f){var c,l="function"===typeof e?e.options:e;if(t&&(l.render=t,l.staticRenderFns=n,l._compiled=!0),o&&(l.functional=!0),i&&(l._scopeId="data-v-"+i),u?(c=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"===typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),r&&r.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(u)},l._ssrRegister=c):r&&(c=f?function(){r.call(this,(l.functional?this.parent:this).$root.$options.shadowRoot)}:r),c)if(l.functional){l._injectStyles=c;var s=l.render;l.render=function(e,t){return c.call(t),s(e,t)}}else{var a=l.beforeCreate;l.beforeCreate=a?[].concat(a,c):[c]}return{exports:e,options:l}}var m=p(d,l,s,!1,null,null,null),h=m.exports,y=h,b=function(){var e=this,t=e._self._c;return t("el-input",{attrs:{value:e.value,placeholder:e.placeholder},on:{input:function(t){return e.$emit("input",t)}}})},_=[],v={name:"XtInput",props:{value:[String,Number],placeholder:{type:String,default:"请输入内容"}}},g=v,C=p(g,b,_,!1,null,null,null),w=C.exports,x=w;"undefined"!==typeof window&&(window.Vue=u.a);const E=[y,x];u.a.use(c.a);const $=function(e){$.installed||($.installed=!0,E.forEach(t=>{e.component(t.name,t)}))};"undefined"!==typeof window&&window.Vue&&$(window.Vue);var j={install:$,Button:y,Input:x};const S={theme:"light",size:"medium",primaryColor:"#1890ff"};let I={...S};const U=[],O=function(e,t){U.forEach(n=>{n(e,t)})},z=function(){return{...I}},V=function(e){"object"===typeof e&&null!==e?(void 0!==e.theme&&X(e.theme),void 0!==e.size&&P(e.size),void 0!==e.primaryColor&&T(e.primaryColor)):console.warn("[XtElementUI] setConfig 必须传入对象参数")},X=function(e){const t=["light","dark","compact"];t.includes(e)?(I.theme=e,document.documentElement.setAttribute("data-theme",e),O("theme",e)):console.warn(`[XtElementUI] 无效的主题值: ${e},可选值: ${t.join(", ")}`)},P=function(e){const t=["small","medium","large"];t.includes(e)?(I.size=e,document.documentElement.setAttribute("data-size",e),O("size",e)):console.warn(`[XtElementUI] 无效的大小值: ${e},可选值: ${t.join(", ")}`)},T=function(e){const t=/^#[0-9A-Fa-f]{6}$|^#[0-9A-Fa-f]{3}$/;t.test(e)?(I.primaryColor=e,document.documentElement.style.setProperty("--xt-color-primary",e),O("primaryColor",e)):console.warn(`[XtElementUI] 无效的颜色值: ${e},请使用十六进制颜色格式,如 #1890ff`)},k=function(){return I.theme},R=function(){return I.size},q=function(){return I.primaryColor},A=function(){V(S)},M=function(e){if("function"===typeof e)return U.push(e),function(){const t=U.indexOf(e);t>-1&&U.splice(t,1)};console.warn("[XtElementUI] onConfigChange 必须传入函数")};t["default"]=j}})}));
1
+ (function(t,e){"object"===typeof exports&&"object"===typeof module?module.exports=e():"function"===typeof define&&define.amd?define("xt-element-ui",[],e):"object"===typeof exports?exports["xt-element-ui"]=e():t["xt-element-ui"]=e()})("undefined"!==typeof self?self:this,(function(){return function(t){var e={};function n(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},n.r=function(t){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"===typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(o,r,function(e){return t[e]}.bind(null,r));return o},n.n=function(t){var e=t&&t.__esModule?function(){return t["default"]}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s="fb15")}({"27fd":function(t,e,n){t.exports={xtColorPrimary:"#409EFF",xtColorSuccess:"#67C23A",xtColorWarning:"#E6A23C",xtColorDanger:"#F56C6C",xtColorInfo:"#909399",xtColorPrimaryLight3:"#79BBFF",xtColorPrimaryLight5:"#A0CFFF",xtColorPrimaryLight7:"#C6E2FF",xtColorPrimaryLight8:"#D9ECFF",xtColorPrimaryLight9:"#ECF5FF",xtColorTextPrimary:"#303133",xtColorTextRegular:"#606266",xtColorTextSecondary:"#909399",xtColorTextPlaceholder:"#C0C4CC",xtColorTextDisabled:"#C0C4CC",xtColorBgPrimary:"#ffffff",xtColorBgSecondary:"#f5f7fa",xtColorBgHover:"#f5f5f5",xtColorBgContainer:"#f5f7fa",xtColorBgOverlay:"#ffffff",xtColorBorder:"#DCDFE6",xtColorBorderLight:"#E4E7ED",xtColorBorderLighter:"#EBEEF5",xtColorBorderExtraLight:"#F2F6FC",xtFontSizeExtraLarge:"20px",xtFontSizeLarge:"18px",xtFontSizeMedium:"16px",xtFontSizeBase:"14px",xtFontSizeSmall:"13px",xtFontSizeExtraSmall:"12px",xtSpacingXs:"4px",xtSpacingSm:"8px",xtSpacingMd:"12px",xtSpacingLg:"16px",xtSpacingXl:"20px",xtBorderRadiusBase:"4px",xtBorderRadiusSmall:"2px",xtBorderRadiusRound:"20px",xtBorderRadiusCircle:"50%",xtShadowSm:"0 2px 4px rgba(0, 0, 0, 0.04)",xtShadowMd:"0 4px 12px rgba(0, 0, 0, 0.08)",xtShadowLg:"0 8px 24px rgba(0, 0, 0, 0.12)",xtTransitionDuration:"0.3s",xtTransitionDurationFast:"0.2s"}},fb15:function(t,e,n){"use strict";if(n.r(e),n.d(e,"utils",(function(){return p})),n.d(e,"variables",(function(){return l.a})),n.d(e,"getConfig",(function(){return O})),n.d(e,"setConfig",(function(){return R})),n.d(e,"setTheme",(function(){return U})),n.d(e,"setSize",(function(){return D})),n.d(e,"setPrimaryColor",(function(){return M})),n.d(e,"getTheme",(function(){return k})),n.d(e,"getSize",(function(){return V})),n.d(e,"getPrimaryColor",(function(){return N})),n.d(e,"resetConfig",(function(){return H})),n.d(e,"onConfigChange",(function(){return W})),"undefined"!==typeof window){var o=window.document.currentScript,r=o&&o.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);r&&(n.p=r[1])}var i=n("27fd"),l=n.n(i);const u={theme:"light",size:"medium",primaryColor:"#1890ff"};let a={...u};const c=[],f=function(t,e){c.forEach(n=>{n(t,e)})},s=function(t){const e=["light","dark","compact"];e.includes(t)?(a.theme=t,document.documentElement.setAttribute("data-theme",t),f("theme",t)):console.warn(`[XtElementUI] 无效的主题值: ${t},可选值: ${e.join(", ")}`)},d=function(t){const e=["small","medium","large"];e.includes(t)?(a.size=t,document.documentElement.setAttribute("data-size",t),f("size",t)):console.warn(`[XtElementUI] 无效的大小值: ${t},可选值: ${e.join(", ")}`)},m=function(t){const e=/^#[0-9A-Fa-f]{6}$|^#[0-9A-Fa-f]{3}$/;e.test(t)?(a.primaryColor=t,document.documentElement.style.setProperty("--xt-color-primary",t),f("primaryColor",t)):console.warn(`[XtElementUI] 无效的颜色值: ${t},请使用十六进制颜色格式,如 #1890ff`)};var p={setTheme:s,setSize:d,setPrimaryColor:m},x=function(){var t=this,e=t._self._c;return e("el-button",{on:{click:t.handleClick}},[t._t("default")],2)},C=[],h={name:"XtButton",methods:{handleClick(){this.$emit("click")}}},g=h;function y(t,e,n,o,r,i,l,u){var a,c="function"===typeof t?t.options:t;if(e&&(c.render=e,c.staticRenderFns=n,c._compiled=!0),o&&(c.functional=!0),i&&(c._scopeId="data-v-"+i),l?(a=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"===typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),r&&r.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(l)},c._ssrRegister=a):r&&(a=u?function(){r.call(this,(c.functional?this.parent:this).$root.$options.shadowRoot)}:r),a)if(c.functional){c._injectStyles=a;var f=c.render;c.render=function(t,e){return a.call(e),f(t,e)}}else{var s=c.beforeCreate;c.beforeCreate=s?[].concat(s,a):[a]}return{exports:t,options:c}}var S=y(g,x,C,!1,null,null,null),E=S.exports,b=E,v=function(){var t=this,e=t._self._c;return e("el-input",{attrs:{value:t.value,placeholder:t.placeholder},on:{input:function(e){return t.$emit("input",e)}}})},F=[],_={name:"XtInput",props:{value:[String,Number],placeholder:{type:String,default:"请输入内容"}}},$=_,w=y($,v,F,!1,null,null,null),z=w.exports,B=z;const P=[b,B],j=function(t){j.installed||(j.installed=!0,P.forEach(e=>{t.component(e.name,e)}),t.prototype.$utils=p)};"undefined"!==typeof window&&window.Vue&&j(window.Vue);var T={install:j,Button:b,Input:B};const X={theme:"light",size:"medium",primaryColor:"#1890ff"};let I={...X};const L=[],A=function(t,e){L.forEach(n=>{n(t,e)})},O=function(){return{...I}},R=function(t){"object"===typeof t&&null!==t?(void 0!==t.theme&&U(t.theme),void 0!==t.size&&D(t.size),void 0!==t.primaryColor&&M(t.primaryColor)):console.warn("[XtElementUI] setConfig 必须传入对象参数")},U=function(t){const e=["light","dark"];e.includes(t)?(I.theme=t,document.documentElement.setAttribute("data-theme",t),A("theme",t)):console.warn(`[XtElementUI] 无效的主题值: ${t},可选值: ${e.join(", ")}`)},D=function(t){const e=["small","medium","large"];e.includes(t)?(I.size=t,document.documentElement.setAttribute("data-size",t),A("size",t)):console.warn(`[XtElementUI] 无效的大小值: ${t},可选值: ${e.join(", ")}`)},M=function(t){const e=/^#[0-9A-Fa-f]{6}$|^#[0-9A-Fa-f]{3}$/;e.test(t)?(I.primaryColor=t,document.documentElement.style.setProperty("--xt-color-primary",t),A("primaryColor",t)):console.warn(`[XtElementUI] 无效的颜色值: ${t},请使用十六进制颜色格式,如 #1890ff`)},k=function(){return I.theme},V=function(){return I.size},N=function(){return I.primaryColor},H=function(){R(X)},W=function(t){if("function"===typeof t)return L.push(t),function(){const e=L.indexOf(t);e>-1&&L.splice(e,1)};console.warn("[XtElementUI] onConfigChange 必须传入函数")};e["default"]=T}})}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "xt-element-ui",
3
- "version": "1.0.4",
3
+ "version": "1.0.6",
4
4
  "description": "基于 Vue2.7 + ElementUI 的组件库",
5
5
  "main": "lib/index.common.js",
6
6
  "module": "lib/index.esm.js",
@@ -32,6 +32,6 @@
32
32
  ],
33
33
  "dependencies": {
34
34
  "vue-server-renderer": "^2.7.14",
35
- "xt-element-ui": "^1.0.3"
35
+ "xt-element-ui": "^1.0.5"
36
36
  }
37
37
  }
package/src/index.js CHANGED
@@ -1,14 +1,7 @@
1
- // 导入 Vue
2
- import Vue from 'vue'
1
+ // 导入 SCSS 变量(通过 CSS Modules :export 导出)
2
+ import variables from './styles/export.scss'
3
3
 
4
- // 在导入 Element UI 之前,先将 Vue 设置为全局变量
5
- if (typeof window !== 'undefined') {
6
- window.Vue = Vue
7
- }
8
-
9
- // 导入 Element UI 并注册
10
- import Element from 'element-ui'
11
- import 'element-ui/lib/theme-chalk/index.css'
4
+ import utils from './utils/index'
12
5
 
13
6
  // 导入组件
14
7
  import Button from './components/button'
@@ -21,9 +14,6 @@ const components = [
21
14
  ]
22
15
 
23
16
 
24
- // 注册 Element UI
25
- Vue.use(Element)
26
-
27
17
  // 定义 install 方法,Vue.use() 会自动调用
28
18
  const install = function (Vue) {
29
19
  if (install.installed) return
@@ -33,6 +23,7 @@ const install = function (Vue) {
33
23
  components.forEach(component => {
34
24
  Vue.component(component.name, component)
35
25
  })
26
+ Vue.prototype.$utils = utils
36
27
  }
37
28
 
38
29
  // 支持全局 script 标签引入
@@ -48,6 +39,11 @@ export default {
48
39
  Input
49
40
  }
50
41
 
42
+ // 导出工具函数和变量
43
+ export {
44
+ utils,
45
+ variables
46
+ }
51
47
 
52
48
  // 默认配置
53
49
  const defaultConfig = {
@@ -91,9 +87,9 @@ export const setConfig = function(config) {
91
87
  }
92
88
  }
93
89
 
94
- // 设置主题
90
+ // 设置主题(只控制颜色)
95
91
  export const setTheme = function(theme) {
96
- const validThemes = ['light', 'dark', 'compact']
92
+ const validThemes = ['light', 'dark']
97
93
  if (!validThemes.includes(theme)) {
98
94
  console.warn(`[XtElementUI] 无效的主题值: ${theme},可选值: ${validThemes.join(', ')}`)
99
95
  return
@@ -104,7 +100,7 @@ export const setTheme = function(theme) {
104
100
  emitConfigChange('theme', theme)
105
101
  }
106
102
 
107
- // 设置字体大小
103
+ // 设置字体大小和间距
108
104
  export const setSize = function(size) {
109
105
  const validSizes = ['small', 'medium', 'large']
110
106
  if (!validSizes.includes(size)) {
@@ -119,7 +115,6 @@ export const setSize = function(size) {
119
115
 
120
116
  // 设置主色调
121
117
  export const setPrimaryColor = function(color) {
122
- // 简单的颜色格式验证
123
118
  const colorRegex = /^#[0-9A-Fa-f]{6}$|^#[0-9A-Fa-f]{3}$/
124
119
  if (!colorRegex.test(color)) {
125
120
  console.warn(`[XtElementUI] 无效的颜色值: ${color},请使用十六进制颜色格式,如 #1890ff`)
@@ -0,0 +1,86 @@
1
+ @use './variables.scss' as *;
2
+
3
+ // SCSS 变量导出给 JavaScript 使用
4
+ :export {
5
+ // ===========================
6
+ // 主色调系列
7
+ // ===========================
8
+ xtColorPrimary: #{$xt-color-primary}; // 主颜色 - Element UI 标准蓝色
9
+ xtColorSuccess: #{$xt-color-success}; // 成功色 - Element UI 标准绿色
10
+ xtColorWarning: #{$xt-color-warning}; // 警告色 - Element UI 标准橙色
11
+ xtColorDanger: #{$xt-color-danger}; // 危险色 - Element UI 标准红色
12
+ xtColorInfo: #{$xt-color-info}; // 信息色 - Element UI 标准灰色
13
+
14
+ // 主色调浅色系列
15
+ xtColorPrimaryLight3: #{$xt-color-primary-light-3}; // 主色浅色 30%
16
+ xtColorPrimaryLight5: #{$xt-color-primary-light-5}; // 主色浅色 50%
17
+ xtColorPrimaryLight7: #{$xt-color-primary-light-7}; // 主色浅色 70%
18
+ xtColorPrimaryLight8: #{$xt-color-primary-light-8}; // 主色浅色 80%
19
+ xtColorPrimaryLight9: #{$xt-color-primary-light-9}; // 主色浅色 90%
20
+
21
+ // ===========================
22
+ // 文字颜色
23
+ // ===========================
24
+ xtColorTextPrimary: #{$xt-color-text-primary}; // 主要文字颜色 - 最深
25
+ xtColorTextRegular: #{$xt-color-text-regular}; // 常规文字颜色 - 中等
26
+ xtColorTextSecondary: #{$xt-color-text-secondary}; // 次要文字颜色 - 较浅
27
+ xtColorTextPlaceholder: #{$xt-color-text-placeholder}; // 占位符文字颜色
28
+ xtColorTextDisabled: #{$xt-color-text-disabled}; // 禁用状态文字颜色
29
+
30
+ // ===========================
31
+ // 背景颜色
32
+ // ===========================
33
+ xtColorBgPrimary: #{$xt-color-bg-primary}; // 主背景色 - 白色
34
+ xtColorBgSecondary: #{$xt-color-bg-secondary}; // 次要背景色 - 浅灰
35
+ xtColorBgHover: #{$xt-color-bg-hover}; // 悬停背景色
36
+ xtColorBgContainer: #{$xt-color-bg-container}; // 容器背景色
37
+ xtColorBgOverlay: #{$xt-color-bg-overlay}; // 浮层背景色
38
+
39
+ // ===========================
40
+ // 边框颜色
41
+ // ===========================
42
+ xtColorBorder: #{$xt-color-border}; // 边框颜色 - 标准
43
+ xtColorBorderLight: #{$xt-color-border-light}; // 边框浅色
44
+ xtColorBorderLighter: #{$xt-color-border-lighter}; // 边框更浅色
45
+ xtColorBorderExtraLight: #{$xt-color-border-extra-light}; // 边框极浅色
46
+
47
+ // ===========================
48
+ // 字体大小
49
+ // ===========================
50
+ xtFontSizeExtraLarge: #{$xt-font-size-extra-large}; // 特大字体
51
+ xtFontSizeLarge: #{$xt-font-size-large}; // 大字体
52
+ xtFontSizeMedium: #{$xt-font-size-medium}; // 中等字体
53
+ xtFontSizeBase: #{$xt-font-size-base}; // 基准字体
54
+ xtFontSizeSmall: #{$xt-font-size-small}; // 小字体
55
+ xtFontSizeExtraSmall: #{$xt-font-size-extra-small}; // 特小字体
56
+
57
+ // ===========================
58
+ // 间距
59
+ // ===========================
60
+ xtSpacingXs: #{$xt-spacing-xs}; // 最小间距
61
+ xtSpacingSm: #{$xt-spacing-sm}; // 小间距
62
+ xtSpacingMd: #{$xt-spacing-md}; // 中间距
63
+ xtSpacingLg: #{$xt-spacing-lg}; // 大间距
64
+ xtSpacingXl: #{$xt-spacing-xl}; // 特大间距
65
+
66
+ // ===========================
67
+ // 圆角
68
+ // ===========================
69
+ xtBorderRadiusBase: #{$xt-border-radius-base}; // 基准圆角
70
+ xtBorderRadiusSmall: #{$xt-border-radius-small}; // 小圆角
71
+ xtBorderRadiusRound: #{$xt-border-radius-round}; // 圆角(胶囊状)
72
+ xtBorderRadiusCircle: #{$xt-border-radius-circle}; // 圆形
73
+
74
+ // ===========================
75
+ // 阴影
76
+ // ===========================
77
+ xtShadowSm: #{$xt-shadow-sm}; // 小阴影
78
+ xtShadowMd: #{$xt-shadow-md}; // 中等阴影
79
+ xtShadowLg: #{$xt-shadow-lg}; // 大阴影
80
+
81
+ // ===========================
82
+ // 过渡动画
83
+ // ===========================
84
+ xtTransitionDuration: #{$xt-transition-duration}; // 默认过渡时长
85
+ xtTransitionDurationFast: #{$xt-transition-duration-fast}; // 快速过渡时长
86
+ }
@@ -1,4 +1,4 @@
1
- @import './variables.scss';
1
+ @use './variables.scss' as *;
2
2
 
3
3
  /* Element UI 风格主题 */
4
4
  :root {