@king-design/vue 3.1.0-beta.1 → 3.1.0-beta.2

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.
@@ -123,11 +123,11 @@ export function makeStyles(k) {
123
123
  }), "&.", k, "-disabled{.", k, "-colorpicker-color{background:", colorpicker.disabled.bgColor, ";border-color:", colorpicker.disabled.borderColor, ";cursor:", colorpicker.disabled.cursor, ";}}");
124
124
  }
125
125
  export function makePanelStyles(k) {
126
- return /*#__PURE__*/css("padding:", colorpicker.panel.padding, ";width:", colorpicker.panel.width, ";.", k, "-colorpicker-saturation{height:", colorpicker.panel.saturationHeight, ";position:relative;overflow:hidden;user-select:none;}.", k, "-colorpicker-white,.", k, "-colorpicker-black{position:absolute;width:100%;height:100%;}.", k, "-colorpicker-white{background:linear-gradient(90deg, #fff, rgba(255, 255, 255, 0));}.", k, "-colorpicker-black{background:linear-gradient(0, #000, rgba(0, 0, 0, 0));}.", k, "-colorpicker-pointer{position:absolute;}.", k, "-colorpicker-circle{width:", colorpicker.panel.circle.width, ";height:", colorpicker.panel.circle.width, ";box-shadow:", colorpicker.panel.circle.boxShadow, ";border-radius:50%;transform:translate(-50%, -50%);}.", k, "-colorpicker-controls{display:flex;margin-top:", colorpicker.panel.gutter, ";}.", k, "-colorpicker-sliders{flex:1;.", k, "-slider{margin-bottom:", colorpicker.panel.gutter, ";}.", k, "-slider-tra.", k, "-wrapper,.", k, "-slider-track{height:", colorpicker.slider.height, ";}.", k, "-slider-tra.", k, "-wrapper{cursor:", colorpicker.slider.cursor, ";}.", k, "-slider-track{border-radius:", colorpicker.slider.borderRadius, ";margin:0 calc(", colorpicker.slider.thumb.width, " / 2 + 1px);background-color:transparent;}.", k, "-slider-bar{background:transparent;}.", k, "-slider-thumb{height:", colorpicker.slider.thumb.height, ";width:", colorpicker.slider.thumb.width, ";border:", colorpicker.slider.thumb.border, ";border-radius:", colorpicker.slider.thumb.borderRadius, ";box-shadow:", colorpicker.slider.thumb.boxShadow, ";&:focus,&:hover{transform:", colorpicker.slider.thumb.hover.transform, ";cursor:", colorpicker.slider.thumb.hover.cursor, ";background-color:", colorpicker.slider.thumb.hover.bgColor, ";}}}.", k, "-colorpicker-hue{.", k, "-slider-tra.", k, "-wrapper{background:linear-gradient(90deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red);}}.", k, "-colorpicker-alpha{background-size:contain;}.", k, "-colorpicker-alpha-bg{background-image:url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMElEQVQ4T2N89uzZfwY8QFJSEp80A+OoAcMiDP7//483HTx//hx/Ohg1gIFx6IcBALl+VXknOCvFAAAAAElFTkSuQmCC\");}.", k, "-colorpicker-color-wrapper{width:", colorpicker.color.width, ";height:", colorpicker.color.height, ";border-radius:", colorpicker.color.borderRadius, ";margin-left:", colorpicker.panel.gutter, ";overflow:hidden;}.", k, "-colorpicker-color{height:100%;box-shadow:", colorpicker.color.boxShadow, ";}.", k, "-colorpicker-input.", k, "-small{.", k, "-input-inner{height:", colorpicker.input.height, ";line-height:", colorpicker.input.height, ";padding:", colorpicker.input.padding, ";font-size:", colorpicker.panel.fontSize, ";}}.", k, "-colorpicker-text{text-align:center;font-size:", colorpicker.panel.fontSize, ";padding:", colorpicker.input.textPadding, ";}.", k, "-colorpicker-presets{border-top:", colorpicker.presets.delimiter, ";margin:0 -", colorpicker.panel.padding, ";overflow:hidden;}.", k, "-colorpicker-preset-color-wrapper{float:left;border-radius:", colorpicker.presets.borderRadius, ";cursor:pointer;overflow:hidden;margin:", colorpicker.panel.padding, " 0 0 ", colorpicker.panel.padding, ";}.", k, "-colorpicker-preset-color{width:", colorpicker.presets.width, ";height:", colorpicker.presets.height, ";box-shadow:", colorpicker.presets.boxShadow, ";}.", k, "-colorpicker-drag{cursor:ew-resize;user-select:none;}");
126
+ return /*#__PURE__*/css("padding:", colorpicker.panel.padding, ";width:", colorpicker.panel.width, ";.", k, "-colorpicker-saturation{height:", colorpicker.panel.saturationHeight, ";position:relative;overflow:hidden;user-select:none;}.", k, "-colorpicker-white,.", k, "-colorpicker-black{position:absolute;width:100%;height:100%;}.", k, "-colorpicker-white{background:linear-gradient(90deg, #fff, rgba(255, 255, 255, 0));}.", k, "-colorpicker-black{background:linear-gradient(0, #000, rgba(0, 0, 0, 0));}.", k, "-colorpicker-pointer{position:absolute;}.", k, "-colorpicker-circle{width:", colorpicker.panel.circle.width, ";height:", colorpicker.panel.circle.width, ";box-shadow:", colorpicker.panel.circle.boxShadow, ";border-radius:50%;transform:translate(-50%, -50%);}.", k, "-colorpicker-controls{display:flex;margin-top:", colorpicker.panel.gutter, ";}.", k, "-colorpicker-sliders{flex:1;.", k, "-slider{margin-bottom:", colorpicker.panel.gutter, ";}.", k, "-slider-track-wrapper,.", k, "-slider-track{height:", colorpicker.slider.height, ";}.", k, "-slider-track-wrapper{cursor:", colorpicker.slider.cursor, ";}.", k, "-slider-track{border-radius:", colorpicker.slider.borderRadius, ";margin:0 calc(", colorpicker.slider.thumb.width, " / 2 + 1px);background-color:transparent;}.", k, "-slider-bar{background:transparent;}.", k, "-slider-thumb{height:", colorpicker.slider.thumb.height, ";width:", colorpicker.slider.thumb.width, ";border:", colorpicker.slider.thumb.border, ";border-radius:", colorpicker.slider.thumb.borderRadius, ";box-shadow:", colorpicker.slider.thumb.boxShadow, ";&:focus,&:hover{transform:", colorpicker.slider.thumb.hover.transform, ";cursor:", colorpicker.slider.thumb.hover.cursor, ";background-color:", colorpicker.slider.thumb.hover.bgColor, ";}}}.", k, "-colorpicker-hue{.", k, "-slider-track-wrapper{background:linear-gradient(90deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red);}}.", k, "-colorpicker-alpha{background-size:contain;}.", k, "-colorpicker-alpha-bg{background-image:url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMElEQVQ4T2N89uzZfwY8QFJSEp80A+OoAcMiDP7//483HTx//hx/Ohg1gIFx6IcBALl+VXknOCvFAAAAAElFTkSuQmCC\");}.", k, "-colorpicker-color-wrapper{width:", colorpicker.color.width, ";height:", colorpicker.color.height, ";border-radius:", colorpicker.color.borderRadius, ";margin-left:", colorpicker.panel.gutter, ";overflow:hidden;}.", k, "-colorpicker-color{height:100%;box-shadow:", colorpicker.color.boxShadow, ";}.", k, "-colorpicker-input.", k, "-small{.", k, "-input-inner{height:", colorpicker.input.height, ";line-height:", colorpicker.input.height, ";padding:", colorpicker.input.padding, ";font-size:", colorpicker.panel.fontSize, ";}}.", k, "-colorpicker-text{text-align:center;font-size:", colorpicker.panel.fontSize, ";padding:", colorpicker.input.textPadding, ";}.", k, "-colorpicker-presets{border-top:", colorpicker.presets.delimiter, ";margin:0 -", colorpicker.panel.padding, ";overflow:hidden;}.", k, "-colorpicker-preset-color-wrapper{float:left;border-radius:", colorpicker.presets.borderRadius, ";cursor:pointer;overflow:hidden;margin:", colorpicker.panel.padding, " 0 0 ", colorpicker.panel.padding, ";}.", k, "-colorpicker-preset-color{width:", colorpicker.presets.width, ";height:", colorpicker.presets.height, ";box-shadow:", colorpicker.presets.boxShadow, ";}.", k, "-colorpicker-drag{cursor:ew-resize;user-select:none;}");
127
127
  }
128
128
  export function makeAlphaBgColor(_ref, k) {
129
129
  var r = _ref.r,
130
130
  g = _ref.g,
131
131
  b = _ref.b;
132
- return /*#__PURE__*/css(".", k, "-slider-tra.", k, "-wrapper{background:linear-gradient(to right, rgba(", r, ", ", g, ", ", b, ", 0) 0%, rgb(", r, ", ", g, ", ", b, ") 100%);}");
132
+ return /*#__PURE__*/css(".", k, "-slider-track-wrapper{background:linear-gradient(to right, rgba(", r, ", ", g, ", ", b, ", 0) 0%, rgb(", r, ", ", g, ", ", b, ") 100%);}");
133
133
  }
@@ -57,15 +57,19 @@ function createFakeElement(value) {
57
57
 
58
58
  function clipboardCopy(text) {
59
59
  try {
60
- navigator.clipboard.writeText(text);
61
- return true;
60
+ if (navigator.clipboard
61
+ /* && window.isSecureContext */
62
+ ) {
63
+ navigator.clipboard.writeText(text);
64
+ return true;
65
+ }
62
66
  } catch (e) {
63
67
  if (process.env.NODE_ENV !== 'production') {
64
68
  console.log(e);
65
69
  }
66
-
67
- return false;
68
70
  }
71
+
72
+ return false;
69
73
  }
70
74
 
71
75
  function commandCopy(text) {
@@ -4,6 +4,7 @@ import { getRestProps } from '../utils';
4
4
  import { Input } from '../input';
5
5
  import { Icon } from '../icon';
6
6
  import { makeStyles } from './styles';
7
+ import { Tooltip } from '../tooltip';
7
8
  export default function ($props, $blocks, $__proto__) {
8
9
  var _classNameObj;
9
10
 
@@ -25,11 +26,13 @@ export default function ($props, $blocks, $__proto__) {
25
26
  var classNameObj = (_classNameObj = {}, _classNameObj[k + "-editable"] = true, _classNameObj[k + "-editing"] = editing, _classNameObj[k + "-disabled"] = disabled, _classNameObj[k + "-invalid"] = invalid, _classNameObj[className] = className, _classNameObj[makeStyles(k)] = true, _classNameObj);
26
27
  return _$cv('div', _extends({}, getRestProps(this), {
27
28
  'className': _$cn(classNameObj)
28
- }), [!disabled && !editing ? _$cc(Icon, {
29
- 'className': _$cn(k + "-icon-edit " + k + "-editable-icon"),
30
- 'title': tip,
31
- 'ev-click': this.edit,
32
- 'hoverable': true
29
+ }), [!disabled && !editing ? _$cc(Tooltip, {
30
+ 'content': tip,
31
+ 'children': _$cc(Icon, {
32
+ 'className': _$cn(k + "-icon-edit " + k + "-editable-icon"),
33
+ 'ev-click': this.edit,
34
+ 'hoverable': true
35
+ })
33
36
  }) : undefined, _$ce(2, 'div', !editing ? children : _$cc(Input, {
34
37
  'size': 'small',
35
38
  'defaultValue': value,
@@ -5,6 +5,7 @@ export interface AsideProps {
5
5
  fixed?: boolean;
6
6
  theme?: MenuProps['theme'];
7
7
  width?: number | string;
8
+ collapsedWidth?: number | string;
8
9
  }
9
10
  export declare class Aside extends Component<AsideProps> {
10
11
  static template: string | import("intact").Template<any>;
@@ -10,7 +10,8 @@ var typeDefs = {
10
10
  collapse: Boolean,
11
11
  fixed: Boolean,
12
12
  theme: themes,
13
- width: [Number, String]
13
+ width: [Number, String],
14
+ collapsedWidth: [Number, String]
14
15
  };
15
16
 
16
17
  var defaults = function defaults() {
@@ -44,10 +45,11 @@ export var Aside = /*#__PURE__*/function (_Component) {
44
45
  var _this$get = this.get(),
45
46
  fixed = _this$get.fixed,
46
47
  width = _this$get.width,
47
- collapse = _this$get.collapse;
48
+ collapse = _this$get.collapse,
49
+ collapsedWidth = _this$get.collapsedWidth;
48
50
 
49
51
  var style = addStyle(this.get('style'), {
50
- width: !collapse ? getStyle(width) : getCollapseWidth()
52
+ width: !collapse ? getStyle(width) : getCollapseWidth(collapsedWidth)
51
53
  });
52
54
  if (!fixed) return style;
53
55
 
@@ -5,6 +5,7 @@ import template from './template.vdt';
5
5
  import { LAYOUT, getStyle, BODY } from './helpers';
6
6
  import { addStyle } from '../utils';
7
7
  import { useConfigContext } from '../config';
8
+ import { makeBodyStyles } from './styles';
8
9
  export var Body = /*#__PURE__*/function (_Component) {
9
10
  _inheritsLoose(Body, _Component);
10
11
 
@@ -36,7 +37,7 @@ export var Body = /*#__PURE__*/function (_Component) {
36
37
  className = _this$get.className;
37
38
 
38
39
  var k = this.config.k;
39
- return _ref = {}, _ref[k + "-layout-body"] = true, _ref[className] = className, _ref;
40
+ return _ref = {}, _ref[k + "-layout-body"] = true, _ref[className] = className, _ref[makeBodyStyles(k)] = true, _ref;
40
41
  };
41
42
 
42
43
  _proto.getStyles = function getStyles() {
@@ -1,6 +1,7 @@
1
1
  import '../../styles/global';
2
2
  export declare const themes: readonly ["light", "dark", "white"];
3
- export declare function getCollapseWidth(): string;
3
+ export declare function getCollapseWidth(collapsedWidth?: string | number): string;
4
4
  export declare function makeLayoutStyles(k: string): string;
5
5
  export declare function makeHeaderStyles(k: string): string;
6
6
  export declare function makeAsideStyles(k: string): string;
7
+ export declare function makeBodyStyles(k: string): string;
@@ -4,6 +4,8 @@ import { theme, setDefault } from '../../styles/theme';
4
4
  import { deepDefaults, getLeft, setAlpha } from '../../styles/utils';
5
5
  import '../../styles/global';
6
6
  import { menu } from '../menu/styles';
7
+ import { isNullOrUndefined } from 'intact-shared';
8
+ import { getStyle } from './helpers';
7
9
  var sizes = ['small', 'large'];
8
10
  export var themes = ['light', 'dark', 'white'];
9
11
  var defaults = {
@@ -61,8 +63,8 @@ setDefault(function () {
61
63
  layout: defaults
62
64
  }).layout;
63
65
  });
64
- export function getCollapseWidth() {
65
- return layout.collapsedWidth;
66
+ export function getCollapseWidth(collapsedWidth) {
67
+ return isNullOrUndefined(collapsedWidth) ? layout.collapsedWidth : getStyle(collapsedWidth);
66
68
  }
67
69
  export function makeLayoutStyles(k) {
68
70
  return /*#__PURE__*/css("display:flex;flex-direction:column;flex:1;transition:padding-left ", layout.transition, ";&.", k, "-has-aside{flex-direction:row;}.", k, "-layout-footer{padding:", layout.footerPadding, ";}.", k, "-layout-body{flex:1;}");
@@ -80,4 +82,7 @@ export function makeAsideStyles(k) {
80
82
  var styles = layout[theme];
81
83
  return /*#__PURE__*/css("&.", k, "-", theme, "{background:", styles.bgColor, ";color:", styles.color, ";border-right:", styles.border, ";}");
82
84
  }), " &.", k, "-fixed{position:fixed;overflow:auto;left:0;top:0;bottom:0;z-index:", theme.midZIndex, ";}.", k, "-menu{width:auto!important;}");
85
+ }
86
+ export function makeBodyStyles(k) {
87
+ return /*#__PURE__*/css("transition:padding-left ", layout.transition, ";");
83
88
  }
@@ -31,7 +31,7 @@ export function useParse() {
31
31
  }
32
32
 
33
33
  if (props.collapse) {
34
- asideWidth = getCollapseWidth();
34
+ asideWidth = getCollapseWidth(props.collapsedWidth);
35
35
  }
36
36
 
37
37
  if (props.fixed) {
@@ -136,5 +136,5 @@ export function makeTitleStyles(k) {
136
136
  }
137
137
  export function makeItemStyles(k) {
138
138
  var item = menu.item;
139
- return /*#__PURE__*/css(".", k, "-menu-title{cursor:pointer;height:", menu.item.height, ";transition:all ", menu.transition, ";&:hover{color:", menu.item.hoverColor, ";}}.", k, "-menu-name{flex:1;display:flex;align-items:center;min-width:0;span{overflow:hidden;text-overflow:ellipsis;min-width:0;}}.", k, "-menu-arrow{transition:transform ", menu.transition, ";margin-left:", menu.icon.gap, ";}&.", k, "-expanded{>.", k, "-menu-title{color:", menu.item.hoverColor, ";.", k, "-menu-arrow{transform:rotateX(180deg);}}}&.", k, "-highlighted{>.", k, "-menu-title{color:", menu.item.hoverColor, ";}}&.", k, "-active{>.", k, "-menu-title{color:", menu.item.hoverColor, "!important;background:", menu.item.activeBgColor, ";}}&.", k, "-disabled{>.", k, "-menu-title{color:", menu.item.disabledColor, "!important;cursor:not-allowed;}}.", k, "-menu-dot{font-size:", menu.item.dotFontSize, ";transform:scale(.4);}");
139
+ return /*#__PURE__*/css(".", k, "-menu-title{cursor:pointer;height:", menu.item.height, ";transition:all ", menu.transition, ";&:hover{color:", menu.item.hoverColor, ";}}.", k, "-menu-name{flex:1;display:flex;align-items:center;min-width:0;span{overflow:hidden;text-overflow:ellipsis;min-width:0;}}.", k, "-menu-arrow{transition:transform ", menu.transition, ";margin:0 0 0 ", menu.icon.gap, ";}&.", k, "-expanded{>.", k, "-menu-title{color:", menu.item.hoverColor, ";.", k, "-menu-arrow{transform:rotateX(180deg);}}}&.", k, "-highlighted{>.", k, "-menu-title{color:", menu.item.hoverColor, ";}}&.", k, "-active{>.", k, "-menu-title{color:", menu.item.hoverColor, "!important;background:", menu.item.activeBgColor, ";}}&.", k, "-disabled{>.", k, "-menu-title{color:", menu.item.disabledColor, "!important;cursor:not-allowed;}}.", k, "-menu-dot{font-size:", menu.item.dotFontSize, ";transform:scale(.4);}");
140
140
  }
@@ -57,7 +57,7 @@ export function makeMessagesStyles(k) {
57
57
  export function makeMessageStyles(k) {
58
58
  var _context;
59
59
 
60
- return /*#__PURE__*/css("text-align:center;width:100%;font-size:", message.fontSize, ";color:", message.color, ";.", k, "-message-container{display:inline-block;box-shadow:", message.boxShadow, ";border-radius:", message.borderRadius, ";margin-bottom:", message.gap, ";pointer-events:all;min-width:", message.minWidth, ";max-width:", message.maxWidth, ";position:relative;text-align:", message.textAlign, ";min-height:", message.minHeight, ";}.", k, "-message-wrapper{position:relative;display:inline-block;&.", k, "-with-icon{padding-left:calc(", message.icon.left, " + 14px);}}.", k, "-message-content{display:inline-block;padding:", message.padding, ";vertical-align:middle;word-break:bre.", k, "-word;word-wrap:bre.", k, "-word;}.", k, "-message-close{vertical-align:middle;position:absolute;right:0;top:0;&:hover{background:none;}}.", k, "-message-icon{position:absolute;left:", message.icon.left, ";top:", message.icon.top, ";font-size:", message.icon.fontSize, ";}", _mapInstanceProperty(_context = ['info', 'error', 'success', 'warning']).call(_context, function (type) {
60
+ return /*#__PURE__*/css("text-align:center;width:100%;font-size:", message.fontSize, ";color:", message.color, ";.", k, "-message-container{display:inline-block;box-shadow:", message.boxShadow, ";border-radius:", message.borderRadius, ";margin-bottom:", message.gap, ";pointer-events:all;min-width:", message.minWidth, ";max-width:", message.maxWidth, ";position:relative;text-align:", message.textAlign, ";min-height:", message.minHeight, ";}.", k, "-message-wrapper{position:relative;display:inline-block;&.", k, "-with-icon{padding-left:calc(", message.icon.left, " + 14px);}}.", k, "-message-content{display:inline-block;padding:", message.padding, ";vertical-align:middle;word-break:break-word;word-wrap:break-word;}.", k, "-message-close{vertical-align:middle;position:absolute;right:0;top:0;&:hover{background:none;}}.", k, "-message-icon{position:absolute;left:", message.icon.left, ";top:", message.icon.top, ";font-size:", message.icon.fontSize, ";}", _mapInstanceProperty(_context = ['info', 'error', 'success', 'warning']).call(_context, function (type) {
61
61
  var color = theme.color[type === 'error' ? 'danger' : type];
62
62
  return /*#__PURE__*/css("&.", k, "-", type, "{.", k, "-message-container{background:", palette(color, -4), ";}.", k, "-message-icon{color:", color, ";}}");
63
63
  }), "&.transition-enter-from,&.transition-leave-to{opacity:0;transform:", message.transform, ";}&.transition-enter-active,&.transition-leave-active{transition:transform ", message.transition, ",opacity ", message.transition, ";}&.transition-move{transition:transform ", message.transition, ";}");
@@ -174,7 +174,7 @@ setDefault(function () {
174
174
  }).select;
175
175
  });
176
176
  export default function makeStyles(k) {
177
- return /*#__PURE__*/css("display:inline-flex;align-items:center;vertical-align:middle;position:relative;width:", select.width, ";cursor:pointer;outline:none;border:", select.border, ";background:", select.bgColor, ";transition:border ", select.transition, ",background ", select.transition, ",box-shadow ", select.transition, ";border-radius:", select.borderRadius, ";.", k, "-select-main{flex:1;min-width:0;}.", k, "-select-prefix,.", k, "-select-suffix{display:flex;align-items:center;position:relative;}.", k, "-select-suffix{margin-left:", select.suffixGap, ";}.", k, "-select-placeholder{color:", select.placeholderColor, ";user-select:none;}.", k, "-input .", k, "-input-inner{background:transparent;}&.", k, "-fluid{width:100%;}.", k, "-select-clear{opacity:0;transition:opacity ", select.transition, ",color ", select.transition, "!important;pointer-events:none;position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%, -50%);}&:hover{border:", select.hoverBorder, ";.", k, "-select-clear.", k, "-show{opacity:1;pointer-events:all;+.", k, "-select-suffix-icon{opacity:0;}}}.", k, "-select-suffix-icon{display:inline-flex;align-items:center;transition:opacity ", select.transition, ";}.", k, "-select-arrow{display:inline-block;transition:transform ", select.transition, ";}&.", k, "-dropdown-open{border:", select.focusBorder, ";.", k, "-select-arrow{transform:rotateX(180deg);}}&:focus{outline:none;border:", select.focusBorder, ";}.", k, "-tags{padding:3px 0;}.", k, "-tag{word-break:bre.", k, "-word;height:auto;max-width:calc(100% - ", getRight(select.tag.margin), " - 1px);}", _mapInstanceProperty(sizes).call(sizes, function (size) {
177
+ return /*#__PURE__*/css("display:inline-flex;align-items:center;vertical-align:middle;position:relative;width:", select.width, ";cursor:pointer;outline:none;border:", select.border, ";background:", select.bgColor, ";transition:border ", select.transition, ",background ", select.transition, ",box-shadow ", select.transition, ";border-radius:", select.borderRadius, ";.", k, "-select-main{flex:1;min-width:0;}.", k, "-select-prefix,.", k, "-select-suffix{display:flex;align-items:center;position:relative;}.", k, "-select-suffix{margin-left:", select.suffixGap, ";}.", k, "-select-placeholder{color:", select.placeholderColor, ";user-select:none;}.", k, "-input .", k, "-input-inner{background:transparent;}&.", k, "-fluid{width:100%;}.", k, "-select-clear{opacity:0;transition:opacity ", select.transition, ",color ", select.transition, "!important;pointer-events:none;position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%, -50%);}&:hover{border:", select.hoverBorder, ";.", k, "-select-clear.", k, "-show{opacity:1;pointer-events:all;+.", k, "-select-suffix-icon{opacity:0;}}}.", k, "-select-suffix-icon{display:inline-flex;align-items:center;transition:opacity ", select.transition, ";}.", k, "-select-arrow{display:inline-block;transition:transform ", select.transition, ";}&.", k, "-dropdown-open{border:", select.focusBorder, ";.", k, "-select-arrow{transform:rotateX(180deg);}}&:focus{outline:none;border:", select.focusBorder, ";}.", k, "-tags{padding:3px 0;}.", k, "-tag{word-break:break-word;height:auto;max-width:calc(100% - ", getRight(select.tag.margin), " - 1px);}", _mapInstanceProperty(sizes).call(sizes, function (size) {
178
178
  var styles = select[size];
179
179
  var className = /*#__PURE__*/css("font-size:", styles.fontSize, ";min-height:", styles.height, ";padding:", styles.padding, ";");
180
180
  if (size === 'default') return className;
@@ -35,7 +35,7 @@ export default function ($props, $blocks, $__proto__) {
35
35
  }
36
36
  }
37
37
 
38
- var _getClassAndStyleForF = getClassAndStyleForFixed(props, offset, checkType),
38
+ var _getClassAndStyleForF = getClassAndStyleForFixed(props, offset, k, checkType),
39
39
  className = _getClassAndStyleForF.className,
40
40
  style = _getClassAndStyleForF.style;
41
41
 
@@ -66,7 +66,7 @@ export default function ($props, $blocks, $__proto__) {
66
66
  'children': function children(offsetMap) {
67
67
  var _classNameObj, _$cn2, _$cn4;
68
68
 
69
- var _getClassAndStyleForF = getClassAndStyleForFixed(_this.get(), offsetMap[key], checkType),
69
+ var _getClassAndStyleForF = getClassAndStyleForFixed(_this.get(), offsetMap[key], k, checkType),
70
70
  className = _getClassAndStyleForF.className,
71
71
  style = _getClassAndStyleForF.style;
72
72
 
@@ -102,7 +102,7 @@ setDefault(function () {
102
102
  }).table;
103
103
  });
104
104
  export function makeStyles(k) {
105
- return /*#__PURE__*/css("font-size:", table.fontSize, ";color:", table.color, ";position:relative;z-index:0;.", k, "-table-wrapper{border-bottom:", table.border, ";overflow:auto;border-radius:", table.borderRadius, ";}table{width:100%;border-spacing:0;table-layout:fixed;td,th{transition:all ", table.transition, ";}}thead{text-align:", table.thead.textAlign, ";font-size:", table.thead.fontSize, ";font-weight:", table.thead.fontWeight, ";position:sticky;top:0;z-index:2;tr{height:", table.thead.height, ";&:not(:last-of-type) th{border-bottom:", table.border, ";}}}th{padding:", table.thead.padding, ";position:relative;background:", table.thead.bgColor, ";line-height:normal;&:before{content:'';height:", table.thead.delimiterHeight, ";position:absolute;background-color:", table.thead.delimiterColor, ";width:1px;left:1px;top:50%;transform:translateY(-50%);}&:first-of-type:before{display:none;}}.", k, "-table-title{display:inline-flex;align-items:center;max-width:100%;color:", table.thead.color, ";}.", k, "-table-title-text{flex:1;display:inline-flex;line-height:1.4;}tbody{tr{&:hover td{background:", table.tbody.hoverBgcolor, ";}&:last-of-type td{border-bottom-color:transparent;}}}td{padding:", table.tbody.padding, ";border-bottom:", table.border, ";background:", table.bgColor, ";word-wrap:bre.", k, "-word;}.", k, "-fixed-left,.", k, "-fixed-right{position:sticky;z-index:1;&:after{content:'';display:block;transition:box-shadow ", table.transition, ";position:absolute;top:0;bottom:0px;width:10px;pointer-events:none;}}.", k, "-fixed-left:after{right:-11px;}.", k, "-fixed-right:after{left:-11px;}&.", k, "-scroll-left .", k, "-fixed-right:after{box-shadow:", table.fixRightShadow, ";}&.", k, "-scroll-right .", k, "-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}&.", k, "-scroll-middle{.", k, "-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}.", k, "-fixed-right:after{box-shadow:", table.fixRightShadow, ";}}.", k, "-fixed-right+.", k, "-fixed-right:after{display:none;}.", k, "-table-affix-header{position:sticky;top:0;left:0;.", k, "-affix-wrapper{overflow:hidden;}&.", k, "-fixed{position:relative;}}&.", k, "-border,&.", k, "-grid{.", k, "-table-wrapper{border-top:", table.border, ";border-left:", table.border, ";border-right:", table.border, ";}}&.", k, "-grid{td:not(:last-of-type),th:not(:last-of-type){border-right:", table.border, ";}th:before{display:none;}}&.", k, "-stripe{tr:nth-child(even):not(:hover) td{background:", table.stripeBgColor, ";}}.", k, "-table-group{margin-left:", table.group.gap, ";}.", k, "-table-check{.", k, "-checkbox,.", k, "-radio{position:relative;top:-1px;}}.", k, "-column-sortable{cursor:pointer;}.", k, "-column-sort{.", k, "-icon{display:block;height:", _sortInstanceProperty(table).iconHeight, ";line-height:", _sortInstanceProperty(table).iconHeight, ";margin:0 0 1px ", _sortInstanceProperty(table).gap, ";}&.", k, "-desc .", k, "-icon.", k, "-desc,&.", k, "-asc .", k, "-icon.", k, "-asc{color:", _sortInstanceProperty(table).enabledColor, ";}}.", k, "-table-spin.", k, "-overlay{z-index:2;}.", k, "-table-empty{text-align:center;}tr.", k, "-expand{td{padding:0;background:#fdfcff;}}&.", k, "-with-expand{tr:not(.", k, "-expand){td{border-bottom:none;}}}.", k, "-table-expand{border-top:", table.border, ";box-sizing:content-box;}tbody tr.", k, "-selected td{background:", table.selectedBgColor, ";}.", k, "-table-arrow{margin-right:", table.arrow.gap, ";transition:transform ", table.transition, ";position:relative;top:-1px;}tr.", k, "-spreaded{.", k, "-table-arrow{transform:rotate(90deg);}}.", k, "-table-resize{height:100%;width:", table.resizeWidth, ";position:absolute;top:0;left:-1px;cursor:ew-resize;}tr.", k, "-dragging{opacity:", table.draggingOpacity, ";}.", k, "-table-scrollbar{overflow-x:auto;overflow-y:hidden;}.", k, "-table-scrollbar-inner{height:1px;}", _mapInstanceProperty(aligns).call(aligns, function (type) {
105
+ return /*#__PURE__*/css("font-size:", table.fontSize, ";color:", table.color, ";position:relative;z-index:0;.", k, "-table-wrapper{border-bottom:", table.border, ";overflow:auto;border-radius:", table.borderRadius, ";}table{width:100%;border-spacing:0;table-layout:fixed;td,th{transition:all ", table.transition, ";}}thead{text-align:", table.thead.textAlign, ";font-size:", table.thead.fontSize, ";font-weight:", table.thead.fontWeight, ";position:sticky;top:0;z-index:2;tr{height:", table.thead.height, ";&:not(:last-of-type) th{border-bottom:", table.border, ";}}}th{padding:", table.thead.padding, ";position:relative;background:", table.thead.bgColor, ";line-height:normal;&:before{content:'';height:", table.thead.delimiterHeight, ";position:absolute;background-color:", table.thead.delimiterColor, ";width:1px;left:1px;top:50%;transform:translateY(-50%);}&:first-of-type:before{display:none;}}.", k, "-table-title{display:inline-flex;align-items:center;max-width:100%;color:", table.thead.color, ";}.", k, "-table-title-text{flex:1;display:inline-flex;line-height:1.4;}tbody{tr{&:hover td{background:", table.tbody.hoverBgcolor, ";}&:last-of-type td{border-bottom-color:transparent;}}}td{padding:", table.tbody.padding, ";border-bottom:", table.border, ";background:", table.bgColor, ";word-wrap:break-word;}.", k, "-fixed-left,.", k, "-fixed-right{position:sticky;z-index:1;&:after{content:'';display:block;transition:box-shadow ", table.transition, ";position:absolute;top:0;bottom:0px;width:10px;pointer-events:none;}}.", k, "-fixed-left:after{right:-11px;}.", k, "-fixed-right:after{left:-11px;}&.", k, "-scroll-left .", k, "-fixed-right:after{box-shadow:", table.fixRightShadow, ";}&.", k, "-scroll-right .", k, "-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}&.", k, "-scroll-middle{.", k, "-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}.", k, "-fixed-right:after{box-shadow:", table.fixRightShadow, ";}}.", k, "-fixed-right+.", k, "-fixed-right:after{display:none;}.", k, "-table-affix-header{position:sticky;top:0;left:0;.", k, "-affix-wrapper{overflow:hidden;}&.", k, "-fixed{position:relative;}}&.", k, "-border,&.", k, "-grid{.", k, "-table-wrapper{border-top:", table.border, ";border-left:", table.border, ";border-right:", table.border, ";}}&.", k, "-grid{td:not(:last-of-type),th:not(:last-of-type){border-right:", table.border, ";}th:before{display:none;}}&.", k, "-stripe{tr:nth-child(even):not(:hover) td{background:", table.stripeBgColor, ";}}.", k, "-table-group{margin-left:", table.group.gap, ";}.", k, "-table-check{.", k, "-checkbox,.", k, "-radio{position:relative;top:-1px;}}.", k, "-column-sortable{cursor:pointer;}.", k, "-column-sort{.", k, "-icon{display:block;height:", _sortInstanceProperty(table).iconHeight, ";line-height:", _sortInstanceProperty(table).iconHeight, ";margin:0 0 1px ", _sortInstanceProperty(table).gap, ";}&.", k, "-desc .", k, "-icon.", k, "-desc,&.", k, "-asc .", k, "-icon.", k, "-asc{color:", _sortInstanceProperty(table).enabledColor, ";}}.", k, "-table-spin.", k, "-overlay{z-index:2;}.", k, "-table-empty{text-align:center;}tr.", k, "-expand{td{padding:0;background:#fdfcff;}}&.", k, "-with-expand{tr:not(.", k, "-expand){td{border-bottom:none;}}}.", k, "-table-expand{border-top:", table.border, ";box-sizing:content-box;}tbody tr.", k, "-selected td{background:", table.selectedBgColor, ";}.", k, "-table-arrow{margin-right:", table.arrow.gap, ";transition:transform ", table.transition, ";position:relative;top:-1px;}tr.", k, "-spreaded{.", k, "-table-arrow{transform:rotate(90deg);}}.", k, "-table-resize{height:100%;width:", table.resizeWidth, ";position:absolute;top:0;left:-1px;cursor:ew-resize;}tr.", k, "-dragging{opacity:", table.draggingOpacity, ";}.", k, "-table-scrollbar{overflow-x:auto;overflow-y:hidden;}.", k, "-table-scrollbar-inner{height:1px;}", _mapInstanceProperty(aligns).call(aligns, function (type) {
106
106
  return /*#__PURE__*/css(".", k, "-align-", type, "{text-align:", type, ";}");
107
107
  }), ">.", k, "-pagination{margin:16px 0;}");
108
108
  }
@@ -16,7 +16,7 @@ export declare function useFixedColumns(getColumns: () => VNodeComponentClass<Ta
16
16
  getHasFixedLeft: () => boolean;
17
17
  getOffsetMap: () => Record<Key, number>;
18
18
  };
19
- export declare function getClassAndStyleForFixed({ className, fixed, align }: Props<TableColumnProps>, offset: number, checkType?: TableProps['checkType']): {
19
+ export declare function getClassAndStyleForFixed({ className, fixed, align }: Props<TableColumnProps>, offset: number, k: string, checkType?: TableProps['checkType']): {
20
20
  className: string;
21
21
  style: {
22
22
  [x: string]: string;
@@ -121,7 +121,7 @@ export function useFixedColumns(getColumns, _ref, widthMap) {
121
121
  }
122
122
  };
123
123
  }
124
- export function getClassAndStyleForFixed(_ref2, offset, checkType) {
124
+ export function getClassAndStyleForFixed(_ref2, offset, k, checkType) {
125
125
  var _cx, _ref3;
126
126
 
127
127
  var className = _ref2.className,
@@ -129,7 +129,7 @@ export function getClassAndStyleForFixed(_ref2, offset, checkType) {
129
129
  align = _ref2.align;
130
130
  var extraOffset = checkType && checkType !== 'none' && fixed === 'left' ? 40 : 0;
131
131
  return {
132
- className: cx((_cx = {}, _cx[className] = !!className, _cx["k-fixed-" + fixed] = !!fixed, _cx["k-align-" + align] = !!align, _cx)),
132
+ className: cx((_cx = {}, _cx[className] = !!className, _cx[k + "-fixed-" + fixed] = !!fixed, _cx[k + "-align-" + align] = !!align, _cx)),
133
133
  style: fixed ? (_ref3 = {}, _ref3[fixed] = offset + extraOffset + "px", _ref3) : null
134
134
  };
135
135
  }
@@ -60,7 +60,7 @@ export default function makeStyles(k) {
60
60
  var arrowLong = tooltip.arrow.width;
61
61
  var arrowShort = "calc(" + arrowLong + " - 1px)"; // use &.${k}-tooltip-content to override css in dropdown menu
62
62
 
63
- return /*#__PURE__*/css("&.", k, "-tooltip-content{max-width:", tooltip.maxWidth, ";min-width:0;padding:", tooltip.padding, ";line-height:", tooltip.lineHeight, ";word-wrap:bre.", k, "-word;pointer-events:none;box-shadow:", tooltip.boxShadow, ";&.", k, "-hoverable,&.", k, "-always{pointer-events:all;}.", k, "-tooltip-arrow{pointer-events:none;&:before,&{position:absolute;display:block;border-style:solid;border-color:transparent;}&:before{content:' ';}&.", k, "-top,&.", k, "-bottom{&:before,&{border-width:", arrowLong, " ", arrowShort, ";}&:before{left:calc(-1 * ", arrowShort, ");}}&.", k, "-top{top:calc(-2 * ", arrowLong, ");&:before{top:calc(-", arrowLong, " + 1px);}}&.", k, "-bottom{bottom:calc(-2 * ", arrowLong, ");&:before{bottom:calc(-", arrowLong, " + 1px);}}&.", k, "-left,&.", k, "-right{&:before,&{border-width:", arrowShort, " ", arrowLong, ";}&:before{top:calc(-1 * ", arrowShort, ");}}&.", k, "-left{left:calc(-2 * ", arrowLong, ");&:before{left:calc(-", arrowLong, " + 1px);}}&.", k, "-right{right:calc(-2 * ", arrowLong, ");&:before{right:calc(-", arrowLong, " + 1px);}}}", _mapInstanceProperty(themes).call(themes, function (theme) {
63
+ return /*#__PURE__*/css("&.", k, "-tooltip-content{max-width:", tooltip.maxWidth, ";min-width:0;padding:", tooltip.padding, ";line-height:", tooltip.lineHeight, ";word-wrap:break-word;pointer-events:none;box-shadow:", tooltip.boxShadow, ";&.", k, "-hoverable,&.", k, "-always{pointer-events:all;}.", k, "-tooltip-arrow{pointer-events:none;&:before,&{position:absolute;display:block;border-style:solid;border-color:transparent;}&:before{content:' ';}&.", k, "-top,&.", k, "-bottom{&:before,&{border-width:", arrowLong, " ", arrowShort, ";}&:before{left:calc(-1 * ", arrowShort, ");}}&.", k, "-top{top:calc(-2 * ", arrowLong, ");&:before{top:calc(-", arrowLong, " + 1px);}}&.", k, "-bottom{bottom:calc(-2 * ", arrowLong, ");&:before{bottom:calc(-", arrowLong, " + 1px);}}&.", k, "-left,&.", k, "-right{&:before,&{border-width:", arrowShort, " ", arrowLong, ";}&:before{top:calc(-1 * ", arrowShort, ");}}&.", k, "-left{left:calc(-2 * ", arrowLong, ");&:before{left:calc(-", arrowLong, " + 1px);}}&.", k, "-right{right:calc(-2 * ", arrowLong, ");&:before{right:calc(-", arrowLong, " + 1px);}}}", _mapInstanceProperty(themes).call(themes, function (theme) {
64
64
  var _context;
65
65
 
66
66
  var borderColor;
package/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @king-design v3.1.0-beta.1
2
+ * @king-design v3.1.0-beta.2
3
3
  *
4
4
  * Copyright (c) Kingsoft Cloud
5
5
  * Released under the MIT License
@@ -60,7 +60,7 @@ export * from './components/tree';
60
60
  export * from './components/treeSelect';
61
61
  export * from './components/upload';
62
62
  export * from './components/wave';
63
- export declare const version = "3.1.0-beta.1";
63
+ export declare const version = "3.1.0-beta.2";
64
64
 
65
65
 
66
66
  export {normalize} from 'intact-vue-next';
package/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @king-design v3.1.0-beta.1
2
+ * @king-design v3.1.0-beta.2
3
3
  *
4
4
  * Copyright (c) Kingsoft Cloud
5
5
  * Released under the MIT License
@@ -62,7 +62,7 @@ export * from './components/tree';
62
62
  export * from './components/treeSelect';
63
63
  export * from './components/upload';
64
64
  export * from './components/wave';
65
- export var version = '3.1.0-beta.1';
65
+ export var version = '3.1.0-beta.2';
66
66
  /* generate end */
67
67
 
68
68
  export {normalize} from 'intact-vue-next';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@king-design/vue",
3
- "version": "3.1.0-beta.1",
3
+ "version": "3.1.0-beta.2",
4
4
  "description": "King-Design UI components for Vue3.0.",
5
5
  "keywords": [
6
6
  "component",