@wlydfe/pro-ui 0.2.11 → 0.2.13

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 (62) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +119 -119
  3. package/es/components/form-item/src/index.vue.d.ts +2 -6
  4. package/es/components/form-item/src/index.vue2.mjs +6 -6
  5. package/es/components/page/src/index.vue.d.ts +54 -30
  6. package/es/components/page/src/index.vue2.mjs +3 -2
  7. package/es/components/radio/src/index.vue2.mjs +1 -1
  8. package/es/components/render/src/index.vue2.mjs +1 -1
  9. package/es/constants/page.mjs +1 -1
  10. package/es/index.css +16 -16
  11. package/es/version.d.ts +1 -1
  12. package/es/version.mjs +1 -1
  13. package/global.d.ts +29 -29
  14. package/index.js +14 -13
  15. package/index.min.js +2 -2
  16. package/index.min.mjs +2 -2
  17. package/index.mjs +14 -13
  18. package/lib/components/form-item/src/index.vue.d.ts +2 -6
  19. package/lib/components/form-item/src/index.vue2.js +6 -6
  20. package/lib/components/page/src/index.vue.d.ts +54 -30
  21. package/lib/components/page/src/index.vue2.js +3 -2
  22. package/lib/components/radio/src/index.vue2.js +1 -1
  23. package/lib/components/render/src/index.vue2.js +1 -1
  24. package/lib/constants/page.js +1 -1
  25. package/lib/{index.css → form.css} +16 -16
  26. package/lib/version.d.ts +1 -1
  27. package/lib/version.js +1 -1
  28. package/locale/en.js +1 -1
  29. package/locale/en.min.js +1 -1
  30. package/locale/en.min.mjs +1 -1
  31. package/locale/en.mjs +1 -1
  32. package/locale/ja.js +1 -1
  33. package/locale/ja.min.js +1 -1
  34. package/locale/ja.min.mjs +1 -1
  35. package/locale/ja.mjs +1 -1
  36. package/locale/ko.js +1 -1
  37. package/locale/ko.min.js +1 -1
  38. package/locale/ko.min.mjs +1 -1
  39. package/locale/ko.mjs +1 -1
  40. package/locale/zh-cn.js +1 -1
  41. package/locale/zh-cn.min.js +1 -1
  42. package/locale/zh-cn.min.mjs +1 -1
  43. package/locale/zh-cn.mjs +1 -1
  44. package/locale/zh-tw.js +1 -1
  45. package/locale/zh-tw.min.js +1 -1
  46. package/locale/zh-tw.min.mjs +1 -1
  47. package/locale/zh-tw.mjs +1 -1
  48. package/package.json +2 -2
  49. package/theme-chalk/src/breadcrumb.scss +9 -9
  50. package/theme-chalk/src/date-picker.scss +96 -96
  51. package/theme-chalk/src/descriptions.scss +41 -41
  52. package/theme-chalk/src/display-item.scss +82 -82
  53. package/theme-chalk/src/drawer-form.scss +16 -16
  54. package/theme-chalk/src/form.scss +34 -34
  55. package/theme-chalk/src/input-tag.scss +91 -91
  56. package/theme-chalk/src/layout.scss +36 -36
  57. package/theme-chalk/src/mixins/function.scss +73 -73
  58. package/theme-chalk/src/search.scss +49 -49
  59. package/theme-chalk/src/sidebar.scss +93 -93
  60. package/theme-chalk/src/steps-form.scss +18 -18
  61. package/theme-chalk/src/table.scss +170 -170
  62. package/theme-chalk/src/var/index.scss +6 -6
@@ -1,34 +1,34 @@
1
- @use 'mixins/config' as *;
2
- @use 'mixins/mixins' as *;
3
- @use 'mixins/function' as *;
4
-
5
- @include b(form) {
6
- &.no-has-label {
7
- & + .#{$el-namespace + -form-item__label} {
8
- width: 0;
9
- padding: 0;
10
- }
11
- }
12
-
13
- @include e(footer) {
14
- display: flex;
15
- justify-content: flex-end;
16
- }
17
- @include e(group__item) {
18
- margin-bottom: 20px;
19
- @include e(group__item__icon) {
20
- display: flex;
21
- align-items: center;
22
-
23
- @include elb(icon) {
24
- margin-right: 5px;
25
- }
26
- }
27
- }
28
-
29
- .#{$plus-namespace + -form-item-extra} {
30
- color: getCssVar('text-color-placeholder');
31
- font-size: getCssVar('font-size-base');
32
- margin-bottom: 18px;
33
- }
34
- }
1
+ @use 'mixins/config' as *;
2
+ @use 'mixins/mixins' as *;
3
+ @use 'mixins/function' as *;
4
+
5
+ @include b(form) {
6
+ &.no-has-label {
7
+ & + .#{$el-namespace + -form-item__label} {
8
+ width: 0;
9
+ padding: 0;
10
+ }
11
+ }
12
+
13
+ @include e(footer) {
14
+ display: flex;
15
+ justify-content: flex-end;
16
+ }
17
+ @include e(group__item) {
18
+ margin-bottom: 20px;
19
+ @include e(group__item__icon) {
20
+ display: flex;
21
+ align-items: center;
22
+
23
+ @include elb(icon) {
24
+ margin-right: 5px;
25
+ }
26
+ }
27
+ }
28
+
29
+ .#{$plus-namespace + -form-item-extra} {
30
+ color: getCssVar('text-color-placeholder');
31
+ font-size: getCssVar('font-size-base');
32
+ margin-bottom: 18px;
33
+ }
34
+ }
@@ -1,91 +1,91 @@
1
- @use 'mixins/mixins' as *;
2
- @use 'mixins/function' as *;
3
- @use 'mixins/config' as *;
4
-
5
- @include b(input-tag) {
6
- width: fit-content;
7
- max-width: 100%;
8
- display: flex;
9
- flex-wrap: wrap;
10
- align-items: center;
11
- background-color: getCssVar('fill-color-blank');
12
- box-sizing: border-box;
13
- border-radius: getCssVar('border-radius-base');
14
- border: 1px solid getCssVar('border-color');
15
- padding: 1px 2px;
16
-
17
- &:hover {
18
- border-color: getCssVar('border-color-hover');
19
- }
20
- &.is-focus {
21
- border-color: getCssVar('color-primary');
22
- }
23
-
24
- &.is-disabled {
25
- background-color: getCssVar('disabled-bg-color');
26
- cursor: not-allowed;
27
-
28
- &:hover {
29
- border-color: getCssVar('border-color');
30
- }
31
-
32
- .#{$el-namespace + -tag__close} {
33
- cursor: not-allowed;
34
-
35
- &:hover {
36
- background-color: transparent;
37
- color: getCssVar('tag-hover-color');
38
- }
39
- }
40
- }
41
-
42
- @include e(tag) {
43
- margin-right: 4px;
44
- margin-top: 1px;
45
- margin-bottom: 1px;
46
- }
47
-
48
- @include e(input) {
49
- flex: 1;
50
- min-width: 85px;
51
- box-sizing: border-box;
52
- padding: 0;
53
-
54
- @include elb(input__wrapper) {
55
- box-sizing: border-box;
56
- box-shadow: none;
57
- padding: 0 4px;
58
- }
59
- @include elb(input__inner) {
60
- line-height: 24px;
61
- height: 24px;
62
- }
63
- }
64
-
65
- @include elb(input) {
66
- &.is-disabled {
67
- @include elb(input__wrapper) {
68
- box-shadow: none;
69
- }
70
- }
71
- }
72
- }
73
-
74
- @include elb(form-item) {
75
- &.is-error {
76
- .#{$plus-namespace + -input-tag} {
77
- border-color: getCssVar('color-danger');
78
-
79
- .#{$el-namespace + -input__wrapper } {
80
- box-shadow: none;
81
-
82
- &.is-focus {
83
- box-shadow: none !important;
84
- }
85
- &:hover {
86
- box-shadow: none;
87
- }
88
- }
89
- }
90
- }
91
- }
1
+ @use 'mixins/mixins' as *;
2
+ @use 'mixins/function' as *;
3
+ @use 'mixins/config' as *;
4
+
5
+ @include b(input-tag) {
6
+ width: fit-content;
7
+ max-width: 100%;
8
+ display: flex;
9
+ flex-wrap: wrap;
10
+ align-items: center;
11
+ background-color: getCssVar('fill-color-blank');
12
+ box-sizing: border-box;
13
+ border-radius: getCssVar('border-radius-base');
14
+ border: 1px solid getCssVar('border-color');
15
+ padding: 1px 2px;
16
+
17
+ &:hover {
18
+ border-color: getCssVar('border-color-hover');
19
+ }
20
+ &.is-focus {
21
+ border-color: getCssVar('color-primary');
22
+ }
23
+
24
+ &.is-disabled {
25
+ background-color: getCssVar('disabled-bg-color');
26
+ cursor: not-allowed;
27
+
28
+ &:hover {
29
+ border-color: getCssVar('border-color');
30
+ }
31
+
32
+ .#{$el-namespace + -tag__close} {
33
+ cursor: not-allowed;
34
+
35
+ &:hover {
36
+ background-color: transparent;
37
+ color: getCssVar('tag-hover-color');
38
+ }
39
+ }
40
+ }
41
+
42
+ @include e(tag) {
43
+ margin-right: 4px;
44
+ margin-top: 1px;
45
+ margin-bottom: 1px;
46
+ }
47
+
48
+ @include e(input) {
49
+ flex: 1;
50
+ min-width: 85px;
51
+ box-sizing: border-box;
52
+ padding: 0;
53
+
54
+ @include elb(input__wrapper) {
55
+ box-sizing: border-box;
56
+ box-shadow: none;
57
+ padding: 0 4px;
58
+ }
59
+ @include elb(input__inner) {
60
+ line-height: 24px;
61
+ height: 24px;
62
+ }
63
+ }
64
+
65
+ @include elb(input) {
66
+ &.is-disabled {
67
+ @include elb(input__wrapper) {
68
+ box-shadow: none;
69
+ }
70
+ }
71
+ }
72
+ }
73
+
74
+ @include elb(form-item) {
75
+ &.is-error {
76
+ .#{$plus-namespace + -input-tag} {
77
+ border-color: getCssVar('color-danger');
78
+
79
+ .#{$el-namespace + -input__wrapper } {
80
+ box-shadow: none;
81
+
82
+ &.is-focus {
83
+ box-shadow: none !important;
84
+ }
85
+ &:hover {
86
+ box-shadow: none;
87
+ }
88
+ }
89
+ }
90
+ }
91
+ }
@@ -1,36 +1,36 @@
1
- @use 'mixins/mixins' as *;
2
- @use 'mixins/config' as *;
3
- @use 'mixins/function' as *;
4
- @use 'var/index';
5
-
6
- $layout-height: calc(100vh - var(--plus-header-height));
7
-
8
- @include b(layout) {
9
- height: 100vh;
10
- overflow: hidden;
11
-
12
- &.#{$el-namespace + -container} {
13
- flex-direction: column;
14
- }
15
-
16
- .#{$plus-namespace + -sidebar} {
17
- height: $layout-height;
18
- min-width: var(--plus-sidebar-min-width);
19
- }
20
-
21
- .#{$plus-namespace + -layout-main} {
22
- height: $layout-height;
23
- flex: 1;
24
- width: calc(100% - var(--plus-sidebar-width));
25
- }
26
-
27
- &.collapse {
28
- .#{$plus-namespace + -layout-main} {
29
- width: calc(100% - var(--plus-sidebar-min-width));
30
- }
31
- }
32
-
33
- .#{$plus-namespace + -layout-content} {
34
- padding: 0;
35
- }
36
- }
1
+ @use 'mixins/mixins' as *;
2
+ @use 'mixins/config' as *;
3
+ @use 'mixins/function' as *;
4
+ @use 'var/index';
5
+
6
+ $layout-height: calc(100vh - var(--plus-header-height));
7
+
8
+ @include b(layout) {
9
+ height: 100vh;
10
+ overflow: hidden;
11
+
12
+ &.#{$el-namespace + -container} {
13
+ flex-direction: column;
14
+ }
15
+
16
+ .#{$plus-namespace + -sidebar} {
17
+ height: $layout-height;
18
+ min-width: var(--plus-sidebar-min-width);
19
+ }
20
+
21
+ .#{$plus-namespace + -layout-main} {
22
+ height: $layout-height;
23
+ flex: 1;
24
+ width: calc(100% - var(--plus-sidebar-width));
25
+ }
26
+
27
+ &.collapse {
28
+ .#{$plus-namespace + -layout-main} {
29
+ width: calc(100% - var(--plus-sidebar-min-width));
30
+ }
31
+ }
32
+
33
+ .#{$plus-namespace + -layout-content} {
34
+ padding: 0;
35
+ }
36
+ }
@@ -1,73 +1,73 @@
1
- // fork from element-plus and rewrite
2
- @use 'sass:meta';
3
- @use 'sass:string';
4
-
5
- @use './config' as config;
6
-
7
- // BEM support Func
8
- @function selectorToString($selector) {
9
- $selector: meta.inspect($selector);
10
- $selector: string.slice($selector, 2, -2);
11
- @return $selector;
12
- }
13
-
14
- @function containsModifier($selector) {
15
- $selector: selectorToString($selector);
16
-
17
- @if string.index($selector, config.$plus-modifier-separator) {
18
- @return true;
19
- } @else {
20
- @return false;
21
- }
22
- }
23
-
24
- @function containWhenFlag($selector) {
25
- $selector: selectorToString($selector);
26
-
27
- @if string.index($selector, '.' + config.$plus-state-prefix) {
28
- @return true;
29
- } @else {
30
- @return false;
31
- }
32
- }
33
-
34
- @function containPseudoClass($selector) {
35
- $selector: selectorToString($selector);
36
-
37
- @if string.index($selector, ':') {
38
- @return true;
39
- } @else {
40
- @return false;
41
- }
42
- }
43
-
44
- @function hitAllSpecialNestRule($selector) {
45
- @return containsModifier($selector) or containWhenFlag($selector) or containPseudoClass($selector);
46
- }
47
-
48
- // join var name
49
- // joinVarName(('button', 'text-color')) => '--el-button-text-color'
50
- @function joinVarName($list) {
51
- $name: '--' + config.$el-namespace;
52
- @each $item in $list {
53
- @if $item != '' {
54
- $name: $name + '-' + $item;
55
- }
56
- }
57
- @return $name;
58
- }
59
-
60
- // getCssVarName('button', 'text-color') => '--el-button-text-color'
61
- @function getCssVarName($args...) {
62
- @return joinVarName($args);
63
- }
64
-
65
- // getCssVar('button', 'text-color') => var(--el-button-text-color)
66
- @function getCssVar($args...) {
67
- @return var(#{joinVarName($args)});
68
- }
69
-
70
- // getCssVarWithDefault(('button', 'text-color'), red) => var(--el-button-text-color, red)
71
- @function getCssVarWithDefault($args, $default) {
72
- @return var(#{joinVarName($args)}, #{$default});
73
- }
1
+ // fork from element-plus and rewrite
2
+ @use 'sass:meta';
3
+ @use 'sass:string';
4
+
5
+ @use './config' as config;
6
+
7
+ // BEM support Func
8
+ @function selectorToString($selector) {
9
+ $selector: meta.inspect($selector);
10
+ $selector: string.slice($selector, 2, -2);
11
+ @return $selector;
12
+ }
13
+
14
+ @function containsModifier($selector) {
15
+ $selector: selectorToString($selector);
16
+
17
+ @if string.index($selector, config.$plus-modifier-separator) {
18
+ @return true;
19
+ } @else {
20
+ @return false;
21
+ }
22
+ }
23
+
24
+ @function containWhenFlag($selector) {
25
+ $selector: selectorToString($selector);
26
+
27
+ @if string.index($selector, '.' + config.$plus-state-prefix) {
28
+ @return true;
29
+ } @else {
30
+ @return false;
31
+ }
32
+ }
33
+
34
+ @function containPseudoClass($selector) {
35
+ $selector: selectorToString($selector);
36
+
37
+ @if string.index($selector, ':') {
38
+ @return true;
39
+ } @else {
40
+ @return false;
41
+ }
42
+ }
43
+
44
+ @function hitAllSpecialNestRule($selector) {
45
+ @return containsModifier($selector) or containWhenFlag($selector) or containPseudoClass($selector);
46
+ }
47
+
48
+ // join var name
49
+ // joinVarName(('button', 'text-color')) => '--el-button-text-color'
50
+ @function joinVarName($list) {
51
+ $name: '--' + config.$el-namespace;
52
+ @each $item in $list {
53
+ @if $item != '' {
54
+ $name: $name + '-' + $item;
55
+ }
56
+ }
57
+ @return $name;
58
+ }
59
+
60
+ // getCssVarName('button', 'text-color') => '--el-button-text-color'
61
+ @function getCssVarName($args...) {
62
+ @return joinVarName($args);
63
+ }
64
+
65
+ // getCssVar('button', 'text-color') => var(--el-button-text-color)
66
+ @function getCssVar($args...) {
67
+ @return var(#{joinVarName($args)});
68
+ }
69
+
70
+ // getCssVarWithDefault(('button', 'text-color'), red) => var(--el-button-text-color, red)
71
+ @function getCssVarWithDefault($args, $default) {
72
+ @return var(#{joinVarName($args)}, #{$default});
73
+ }
@@ -1,49 +1,49 @@
1
- @use 'mixins/mixins' as *;
2
- @use 'mixins/config' as *;
3
-
4
- @include b(search) {
5
- .#{$plus-namespace + -form__row} {
6
- row-gap: 18px;
7
- width: 100%;
8
- }
9
-
10
- &.#{$el-namespace + -form--inline} {
11
- .#{$el-namespace + -form-item} {
12
- margin-right: 0;
13
- margin-bottom: 0;
14
- }
15
- }
16
- &.#{$el-namespace + -form--label-top} {
17
- .#{$plus-namespace + -search__button__wrapper} {
18
- .#{$el-namespace + -form-item__label} {
19
- visibility: hidden;
20
- opacity: 0;
21
- }
22
- .#{$el-namespace + -form-item__content} {
23
- justify-content: flex-end;
24
- }
25
- }
26
- }
27
-
28
- @include e(unfold) {
29
- margin-left: 12px;
30
- }
31
-
32
- @include e(button__wrapper) {
33
- flex: auto;
34
- max-width: 100%;
35
- margin-bottom: 0;
36
- display: flex;
37
- align-items: flex-start;
38
- justify-content: flex-end;
39
-
40
- &.#{$el-namespace + -form-item} {
41
- margin-right: 10px;
42
- }
43
-
44
- @include elb(form-item__content) {
45
- flex-wrap: nowrap;
46
- flex: none;
47
- }
48
- }
49
- }
1
+ @use 'mixins/mixins' as *;
2
+ @use 'mixins/config' as *;
3
+
4
+ @include b(search) {
5
+ .#{$plus-namespace + -form__row} {
6
+ row-gap: 18px;
7
+ width: 100%;
8
+ }
9
+
10
+ &.#{$el-namespace + -form--inline} {
11
+ .#{$el-namespace + -form-item} {
12
+ margin-right: 0;
13
+ margin-bottom: 0;
14
+ }
15
+ }
16
+ &.#{$el-namespace + -form--label-top} {
17
+ .#{$plus-namespace + -search__button__wrapper} {
18
+ .#{$el-namespace + -form-item__label} {
19
+ visibility: hidden;
20
+ opacity: 0;
21
+ }
22
+ .#{$el-namespace + -form-item__content} {
23
+ justify-content: flex-end;
24
+ }
25
+ }
26
+ }
27
+
28
+ @include e(unfold) {
29
+ margin-left: 12px;
30
+ }
31
+
32
+ @include e(button__wrapper) {
33
+ flex: auto;
34
+ max-width: 100%;
35
+ margin-bottom: 0;
36
+ display: flex;
37
+ align-items: flex-start;
38
+ justify-content: flex-end;
39
+
40
+ &.#{$el-namespace + -form-item} {
41
+ margin-right: 10px;
42
+ }
43
+
44
+ @include elb(form-item__content) {
45
+ flex-wrap: nowrap;
46
+ flex: none;
47
+ }
48
+ }
49
+ }