@sheinx/shineout-style 3.7.5 → 3.8.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.
Files changed (45) hide show
  1. package/cjs/cascader/cascader.d.ts.map +1 -1
  2. package/cjs/cascader/cascader.js +78 -92
  3. package/cjs/form/form-item.d.ts.map +1 -1
  4. package/cjs/form/form-item.js +0 -5
  5. package/cjs/popover/popover.d.ts.map +1 -1
  6. package/cjs/popover/popover.js +18 -3
  7. package/cjs/select/select.d.ts.map +1 -1
  8. package/cjs/select/select.js +51 -68
  9. package/cjs/skeleton/skeleton.d.ts.map +1 -1
  10. package/cjs/skeleton/skeleton.js +2 -2
  11. package/cjs/tag/tag.d.ts.map +1 -1
  12. package/cjs/tag/tag.js +1 -2
  13. package/cjs/tooltip/tooltip.d.ts +50 -0
  14. package/cjs/tooltip/tooltip.d.ts.map +1 -1
  15. package/cjs/tooltip/tooltip.js +23 -21
  16. package/cjs/tree-select/tree-select.d.ts.map +1 -1
  17. package/cjs/tree-select/tree-select.js +70 -90
  18. package/cjs/upload/upload.d.ts.map +1 -1
  19. package/cjs/upload/upload.js +2 -6
  20. package/cjs/version.d.ts +1 -1
  21. package/cjs/version.d.ts.map +1 -1
  22. package/cjs/version.js +1 -1
  23. package/esm/cascader/cascader.d.ts.map +1 -1
  24. package/esm/cascader/cascader.js +78 -92
  25. package/esm/form/form-item.d.ts.map +1 -1
  26. package/esm/form/form-item.js +0 -5
  27. package/esm/popover/popover.d.ts.map +1 -1
  28. package/esm/popover/popover.js +18 -3
  29. package/esm/select/select.d.ts.map +1 -1
  30. package/esm/select/select.js +51 -68
  31. package/esm/skeleton/skeleton.d.ts.map +1 -1
  32. package/esm/skeleton/skeleton.js +3 -1
  33. package/esm/tag/tag.d.ts.map +1 -1
  34. package/esm/tag/tag.js +1 -2
  35. package/esm/tooltip/tooltip.d.ts +50 -0
  36. package/esm/tooltip/tooltip.d.ts.map +1 -1
  37. package/esm/tooltip/tooltip.js +22 -20
  38. package/esm/tree-select/tree-select.d.ts.map +1 -1
  39. package/esm/tree-select/tree-select.js +70 -90
  40. package/esm/upload/upload.d.ts.map +1 -1
  41. package/esm/upload/upload.js +2 -6
  42. package/esm/version.d.ts +1 -1
  43. package/esm/version.d.ts.map +1 -1
  44. package/esm/version.js +1 -1
  45. package/package.json +3 -3
@@ -1 +1 @@
1
- {"version":3,"file":"cascader.d.ts","sourceRoot":"","sources":["cascader.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,MAAM,MAAM,iBAAiB,GAAG,MAAM,eAAe,CAAC;AA+DtD,QAAA,MAAM,aAAa,EAAE,QAAQ,CAAC,iBAAiB,CAuhB9C,CAAC;AAEF,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"cascader.d.ts","sourceRoot":"","sources":["cascader.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,MAAM,MAAM,iBAAiB,GAAG,MAAM,eAAe,CAAC;AAuDtD,QAAA,MAAM,aAAa,EAAE,QAAQ,CAAC,iBAAiB,CAkgB9C,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -58,12 +58,6 @@ var inputBorder = (0, _inputBorder.default)('wrapper', inputBorderToken);
58
58
  var wrapper = inputBorder.wrapper,
59
59
  wrapperDisabled = inputBorder.wrapperDisabled,
60
60
  resetWrapper = _objectWithoutProperties(inputBorder, ["wrapper", "wrapperDisabled"]);
61
- var selectTagHeightCssvar = "--select-tag-height";
62
- var selectSmallTagHeightCssvar = "--select-small-tag-height";
63
- var selectLargeTagHeightCssvar = "--select-large-tag-height";
64
- var selectTagHeight = "var(".concat(selectTagHeightCssvar, ")");
65
- var selectSmallTagHeight = "var(".concat(selectSmallTagHeightCssvar, ")");
66
- var selectLargeTagHeight = "var(".concat(selectLargeTagHeightCssvar, ")");
67
61
  var cascaderStyle = _objectSpread(_objectSpread({
68
62
  rootClass: {},
69
63
  wrapperEmpty: {},
@@ -73,100 +67,95 @@ var cascaderStyle = _objectSpread(_objectSpread({
73
67
  width: '100%',
74
68
  outline: 'none',
75
69
  cursor: 'pointer'
76
- }, wrapper), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, selectTagHeightCssvar, _theme.default.selectTagHeight), selectSmallTagHeightCssvar, _theme.default.selectSmallTagHeight), selectLargeTagHeightCssvar, _theme.default.selectLargeTagHeight), '&$wrapperInnerTitle', {
77
- '& $placeholder,$ellipsis,$space,input': {
78
- marginTop: 0,
79
- marginBottom: 0
80
- },
81
- '& $tag': {
82
- marginTop: 0,
83
- marginBottom: _theme.default.selectInnerTitleMarginY,
84
- paddingTop: 0,
85
- paddingBottom: 0,
86
- height: selectTagHeight,
87
- border: 'none',
88
- '& *': {
89
- lineHeight: selectTagHeight
70
+ }, wrapper), {}, {
71
+ '&$wrapperInnerTitle': {
72
+ '& $placeholder,$ellipsis,$space,input': {
73
+ marginTop: 0,
74
+ marginBottom: 0
75
+ },
76
+ '& $tag': {
77
+ marginTop: 0,
78
+ paddingTop: 0,
79
+ paddingBottom: 0,
80
+ height: _theme.default.lineHeightDynamic,
81
+ border: 'none',
82
+ '& *': {
83
+ lineHeight: _theme.default.lineHeightDynamic
84
+ }
85
+ },
86
+ '&$wrapperSmall $tag': {
87
+ height: 18,
88
+ marginBottom: 2,
89
+ '&$tag *': {
90
+ lineHeight: '18px'
91
+ }
90
92
  }
91
93
  },
92
- '&$wrapperSmall $tag': {
93
- height: selectSmallTagHeight,
94
- marginBottom: 2,
95
- '&$tag *': {
96
- lineHeight: selectSmallTagHeight
94
+ '&$wrapperSmall': {
95
+ '& $tag': {
96
+ height: 18,
97
+ lineHeight: '16px',
98
+ marginTop: 1,
99
+ marginBottom: 1
100
+ },
101
+ '& $placeholder,$ellipsis,$space,input': {
102
+ marginTop: 0,
103
+ marginBottom: 0
104
+ },
105
+ '& $optionInner': {
106
+ paddingTop: _theme.default.cascaderSmallOptionInnerPaddingY,
107
+ paddingBottom: _theme.default.cascaderSmallOptionInnerPaddingY,
108
+ paddingLeft: _theme.default.cascaderSmallOptionInnerPaddingX,
109
+ // padding: `${token.cascaderSmallOptionInnerPaddingY} ${token.cascaderSmallOptionInnerPaddingX}`,
110
+ fontSize: _theme.default.cascaderSmallFontSize
111
+ },
112
+ '& $clearIcon': {
113
+ right: _theme.default.cascaderSmallPaddingX
97
114
  }
98
115
  },
99
- '&$wrapperLarge $tag': {
100
- height: selectLargeTagHeight,
101
- marginBottom: 2,
102
- '&$tag *': {
103
- lineHeight: selectLargeTagHeight
116
+ '&$wrapperLarge': {
117
+ '& $placeholder,$ellipsis,$space,input': {
118
+ marginTop: _theme.default.cascaderLargePlaceholderMarginY,
119
+ marginBottom: _theme.default.cascaderLargePlaceholderMarginY
120
+ },
121
+ '& $arrowIcon': {
122
+ width: _theme.default.cascaderLargeFontSize
123
+ },
124
+ '& $optionInner': {
125
+ // padding: `${token.cascaderLargeOptionInnerPaddingY} ${token.cascaderLargeOptionInnerPaddingX}`,
126
+ paddingTop: _theme.default.cascaderLargeOptionInnerPaddingY,
127
+ paddingBottom: _theme.default.cascaderLargeOptionInnerPaddingY,
128
+ paddingLeft: _theme.default.cascaderLargeOptionInnerPaddingX,
129
+ fontSize: _theme.default.cascaderLargeFontSize
130
+ },
131
+ '& $clearIcon': {
132
+ right: _theme.default.cascaderLargePaddingX
104
133
  }
105
- }
106
- }), '&$wrapperSmall', {
107
- '& $tag': {
108
- height: selectSmallTagHeight,
109
- lineHeight: '16px',
110
- marginTop: 1,
111
- marginBottom: 1
112
- },
113
- '& $placeholder,$ellipsis,$space,input': {
114
- marginTop: 0,
115
- marginBottom: 0
116
134
  },
117
- '& $optionInner': {
118
- paddingTop: _theme.default.cascaderSmallOptionInnerPaddingY,
119
- paddingBottom: _theme.default.cascaderSmallOptionInnerPaddingY,
120
- paddingLeft: _theme.default.cascaderSmallOptionInnerPaddingX,
121
- // padding: `${token.cascaderSmallOptionInnerPaddingY} ${token.cascaderSmallOptionInnerPaddingX}`,
122
- fontSize: _theme.default.cascaderSmallFontSize
123
- },
124
- '& $clearIcon': {
125
- right: _theme.default.cascaderSmallPaddingX
126
- }
127
- }), '&$wrapperLarge', {
128
- '& $tag': {
129
- height: selectLargeTagHeight,
130
- '& *': {
131
- lineHeight: selectLargeTagHeight
135
+ // hover
136
+ '&:hover': _objectSpread(_objectSpread({}, wrapper['&:hover']), {}, {
137
+ '& $clearIcon': {
138
+ display: 'inline-block'
139
+ },
140
+ '&$clearable:not($wrapperEmpty)': {
141
+ '& :not($compressedIcon)$arrowIcon': {
142
+ display: 'none'
143
+ },
144
+ '& $compressedIcon': {
145
+ display: 'none'
146
+ }
132
147
  }
148
+ }),
149
+ '&:has($pickerWrapperShow)': {
150
+ borderColor: _theme.default.cascaderFocusBorderColor
133
151
  },
134
- '& $placeholder,$ellipsis,$space,input': {
135
- marginTop: _theme.default.cascaderLargePlaceholderMarginY,
136
- marginBottom: _theme.default.cascaderLargePlaceholderMarginY
137
- },
138
- '& $arrowIcon': {
139
- width: _theme.default.cascaderLargeFontSize
140
- },
141
- '& $optionInner': {
142
- // padding: `${token.cascaderLargeOptionInnerPaddingY} ${token.cascaderLargeOptionInnerPaddingX}`,
143
- paddingTop: _theme.default.cascaderLargeOptionInnerPaddingY,
144
- paddingBottom: _theme.default.cascaderLargeOptionInnerPaddingY,
145
- paddingLeft: _theme.default.cascaderLargeOptionInnerPaddingX,
146
- fontSize: _theme.default.cascaderLargeFontSize
147
- },
148
- '& $clearIcon': {
149
- right: _theme.default.cascaderLargePaddingX
150
- }
151
- }), '&:hover', _objectSpread(_objectSpread({}, wrapper['&:hover']), {}, {
152
- '& $clearIcon': {
153
- display: 'inline-block'
154
- },
155
- '&$clearable:not($wrapperEmpty)': {
156
- '& :not($compressedIcon)$arrowIcon': {
157
- display: 'none'
158
- },
159
- '& $compressedIcon': {
152
+ // not wrapperFocus
153
+ '&:not($wrapperFocus)': {
154
+ '& $clearIcon': {
160
155
  display: 'none'
161
156
  }
162
157
  }
163
- })), '&:has($pickerWrapperShow)', {
164
- borderColor: _theme.default.cascaderFocusBorderColor
165
- }), '&:not($wrapperFocus)', {
166
- '& $clearIcon': {
167
- display: 'none'
168
- }
169
- })),
158
+ }),
170
159
  virtual: {
171
160
  '& $filterList': {
172
161
  overflow: 'hidden'
@@ -299,9 +288,6 @@ var cascaderStyle = _objectSpread(_objectSpread({
299
288
  },
300
289
  compressedWrapper: {
301
290
  width: 0,
302
- overflow: 'hidden'
303
- },
304
- compressedBoundWrapper: {
305
291
  overflow: 'auto'
306
292
  },
307
293
  controlMouse: {
@@ -1 +1 @@
1
- {"version":3,"file":"form-item.d.ts","sourceRoot":"","sources":["form-item.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAYxC,QAAA,MAAM,aAAa,EAAE,QAAQ,CAAC,MAAM,eAAe,CAwJlD,CAAC;AAEF,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"form-item.d.ts","sourceRoot":"","sources":["form-item.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAYxC,QAAA,MAAM,aAAa,EAAE,QAAQ,CAAC,MAAM,eAAe,CAmJlD,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -144,11 +144,6 @@ var formItemStyle = _objectSpread(_objectSpread({
144
144
  top: '2px'
145
145
  }
146
146
  },
147
- wrapperHideRequired: {
148
- '& $label::before': {
149
- display: 'none'
150
- }
151
- },
152
147
  wrapperKeepHeight: {
153
148
  marginBottom: _theme.default.formItemTipMinHeight,
154
149
  '&$wrapperTip': {
@@ -1 +1 @@
1
- {"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["popover.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C,MAAM,MAAM,gBAAgB,GAAG,MAAM,cAAc,CAAC;AAUpD,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,gBAAgB,CA4K5C,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["popover.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,MAAM,MAAM,gBAAgB,GAAG,MAAM,cAAc,CAAC;AAUpD,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,gBAAgB,CAyL5C,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -5,8 +5,11 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _theme = _interopRequireDefault(require("@sheinx/theme"));
8
+ var _tooltip = require("../tooltip/tooltip");
8
9
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
10
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
11
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
12
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
10
13
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
11
14
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
12
15
  function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
@@ -16,7 +19,7 @@ var extraArrowGap = 'var(--popover-arrow-gap-extra, 0px)';
16
19
  var arrowMargin = '8px';
17
20
  var poyfillPos = "calc((".concat(hideArrowGap, " + ").concat(extraArrowGap, ") * -1)");
18
21
  var poyfillHeight = "calc((".concat(hideArrowGap, " + ").concat(extraArrowGap, "))");
19
- var popoverStyle = {
22
+ var popoverStyle = _objectSpread(_objectSpread({}, _tooltip.tooltipAnimation), {}, {
20
23
  rootClass: {},
21
24
  wrapper: {
22
25
  display: 'none',
@@ -177,7 +180,19 @@ var popoverStyle = {
177
180
  }
178
181
  },
179
182
  wrapperOpen: {
180
- display: 'block'
183
+ display: 'block',
184
+ '&[data-soui-position^="bottom"]': {
185
+ animation: '$fadeIn 200ms ease, $moveBottom 200ms cubic-bezier(0.22, 0.61, 0.36, 1)'
186
+ },
187
+ '&[data-soui-position^="top"]': {
188
+ animation: '$fadeIn 200ms ease, $moveTop 200ms cubic-bezier(0.22, 0.61, 0.36, 1);'
189
+ },
190
+ '&[data-soui-position^="left"]': {
191
+ animation: '$fadeIn 200ms ease, $moveLeft 200ms cubic-bezier(0.22, 0.61, 0.36, 1);'
192
+ },
193
+ '&[data-soui-position^="right"]': {
194
+ animation: '$fadeIn 200ms ease, $moveRight 200ms cubic-bezier(0.22, 0.61, 0.36, 1);'
195
+ }
181
196
  },
182
197
  arrow: {},
183
198
  hideArrow: {},
@@ -209,5 +224,5 @@ var popoverStyle = {
209
224
  footer: {
210
225
  textAlign: 'right'
211
226
  }
212
- };
227
+ });
213
228
  var _default = exports.default = popoverStyle;
@@ -1 +1 @@
1
- {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["select.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAGxC,MAAM,MAAM,eAAe,GAAG,MAAM,aAAa,CAAC;AA+DlD,QAAA,MAAM,WAAW,EAAE,QAAQ,CAAC,eAAe,CAgjB1C,CAAC;AAEF,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["select.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAGxC,MAAM,MAAM,eAAe,GAAG,MAAM,aAAa,CAAC;AAuDlD,QAAA,MAAM,WAAW,EAAE,QAAQ,CAAC,eAAe,CA2hB1C,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -58,12 +58,6 @@ var inputBorder = (0, _inputBorder.default)('wrapper', inputBorderToken);
58
58
  var wrapper = inputBorder.wrapper,
59
59
  wrapperDisabled = inputBorder.wrapperDisabled,
60
60
  resetWrapper = _objectWithoutProperties(inputBorder, ["wrapper", "wrapperDisabled"]);
61
- var selectTagHeightCssvar = "--select-tag-height";
62
- var selectSmallTagHeightCssvar = "--select-small-tag-height";
63
- var selectLargeTagHeightCssvar = "--select-large-tag-height";
64
- var selectTagHeight = "var(".concat(selectTagHeightCssvar, ")");
65
- var selectSmallTagHeight = "var(".concat(selectSmallTagHeightCssvar, ")");
66
- var selectLargeTagHeight = "var(".concat(selectLargeTagHeightCssvar, ")");
67
61
  var selectStyle = _objectSpread(_objectSpread({
68
62
  rootClass: {},
69
63
  wrapper: _objectSpread(_objectSpread({
@@ -72,76 +66,68 @@ var selectStyle = _objectSpread(_objectSpread({
72
66
  width: '100%',
73
67
  outline: 'none',
74
68
  cursor: 'pointer'
75
- }, wrapper), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, selectTagHeightCssvar, _theme.default.selectTagHeight), selectSmallTagHeightCssvar, _theme.default.selectSmallTagHeight), selectLargeTagHeightCssvar, _theme.default.selectLargeTagHeight), '&$wrapperInnerTitle', {
76
- '& $placeholder,$ellipsis,$space,input': {
77
- marginTop: 0,
78
- marginBottom: 0
79
- },
80
- '& $tag': {
81
- marginTop: 0,
82
- marginBottom: _theme.default.selectInnerTitleMarginY,
83
- paddingTop: 0,
84
- paddingBottom: 0,
85
- height: selectTagHeight,
86
- border: 'none',
87
- '& *': {
88
- lineHeight: selectTagHeight
69
+ }, wrapper), {}, {
70
+ '&$wrapperInnerTitle': {
71
+ '& $placeholder,$ellipsis,$space,input': {
72
+ marginTop: 0,
73
+ marginBottom: 0
74
+ },
75
+ '& $tag': {
76
+ marginTop: 0,
77
+ paddingTop: 0,
78
+ paddingBottom: 0,
79
+ height: _theme.default.lineHeightDynamic,
80
+ border: 'none',
81
+ '& *': {
82
+ lineHeight: _theme.default.lineHeightDynamic
83
+ }
84
+ },
85
+ '&$wrapperSmall $tag': {
86
+ height: 18,
87
+ marginBottom: 2,
88
+ '&$tag *': {
89
+ lineHeight: '18px'
90
+ }
89
91
  }
90
92
  },
91
- '&$wrapperSmall $tag': {
92
- height: selectSmallTagHeight,
93
- marginBottom: 2,
94
- '&$tag *': {
95
- lineHeight: selectSmallTagHeight
93
+ '&$wrapperSmall': {
94
+ '& $tag': {
95
+ height: 18,
96
+ lineHeight: '16px',
97
+ marginTop: 1,
98
+ marginBottom: 1
99
+ },
100
+ '& $placeholder,$ellipsis,$space,input': {
101
+ marginTop: 0,
102
+ marginBottom: 0
96
103
  }
97
104
  },
98
- '&$wrapperLarge $tag': {
99
- height: selectLargeTagHeight,
100
- marginBottom: 2,
101
- '&$tag *': {
102
- lineHeight: selectLargeTagHeight
105
+ '&$wrapperLarge': {
106
+ '& $placeholder,$ellipsis,$space,input': {
107
+ marginTop: _theme.default.selectLargePlaceholderMarginY,
108
+ marginBottom: _theme.default.selectLargePlaceholderMarginY
109
+ },
110
+ '& $arrowIcon': {
111
+ width: _theme.default.selectLargeFontSize
103
112
  }
104
- }
105
- }), '&$wrapperSmall', {
106
- '& $tag': {
107
- height: selectSmallTagHeight,
108
- lineHeight: '16px',
109
- marginTop: 1,
110
- marginBottom: 1
111
113
  },
112
- '& $placeholder,$ellipsis,$space,input': {
113
- marginTop: 0,
114
- marginBottom: 0
115
- }
116
- }), '&$wrapperLarge', {
117
- '& $tag': {
118
- height: selectLargeTagHeight,
119
- '& *': {
120
- lineHeight: selectLargeTagHeight
114
+ '&:hover': _objectSpread(_objectSpread({}, wrapper['&:hover']), {}, {
115
+ cursor: 'pointer',
116
+ '&$clearable:not($wrapperEmpty):not($wrapperDisabled)': {
117
+ '& $clearIcon': {
118
+ display: 'block'
119
+ },
120
+ '& $arrowIcon': {
121
+ display: 'none'
122
+ }
121
123
  }
122
- },
123
- '& $placeholder,$ellipsis,$space,input': {
124
- marginTop: _theme.default.selectLargePlaceholderMarginY,
125
- marginBottom: _theme.default.selectLargePlaceholderMarginY
126
- },
127
- '& $arrowIcon': {
128
- width: _theme.default.selectLargeFontSize
129
- }
130
- }), '&:hover', _objectSpread(_objectSpread({}, wrapper['&:hover']), {}, {
131
- cursor: 'pointer',
132
- '&$clearable:not($wrapperEmpty):not($wrapperDisabled)': {
124
+ }),
125
+ '&:not($wrapperEmpty):not($wrapperOpen)': {
133
126
  '& $clearIcon': {
134
- display: 'block'
135
- },
136
- '& $arrowIcon': {
137
127
  display: 'none'
138
128
  }
139
129
  }
140
- })), '&:not($wrapperEmpty):not($wrapperOpen)', {
141
- '& $clearIcon': {
142
- display: 'none'
143
- }
144
- })),
130
+ }),
145
131
  wrapperEmpty: {},
146
132
  wrapperOpen: {},
147
133
  wrapperDisabled: _objectSpread(_objectSpread({}, wrapperDisabled), {}, {
@@ -270,9 +256,6 @@ var selectStyle = _objectSpread(_objectSpread({
270
256
  },
271
257
  compressedWrapper: {
272
258
  width: 0,
273
- overflow: 'hidden'
274
- },
275
- compressedBoundWrapper: {
276
259
  overflow: 'auto'
277
260
  },
278
261
  controlMouse: {
@@ -1 +1 @@
1
- {"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["skeleton.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAU9C,MAAM,MAAM,iBAAiB,GAAG,MAAM,eAAe,CAAC;AAEtD,QAAA,MAAM,aAAa,EAAE,QAAQ,CAAC,iBAAiB,CA0F9C,CAAC;AAEF,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["skeleton.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAU9C,MAAM,MAAM,iBAAiB,GAAG,MAAM,eAAe,CAAC;AAEtD,QAAA,MAAM,aAAa,EAAE,QAAQ,CAAC,iBAAiB,CA0F9C,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -11,7 +11,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
11
11
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
12
12
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
13
13
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
14
- function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
14
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } // import token from '@sheinx/theme';
15
15
  var animation = {
16
16
  '@keyframes skeleton-animation': {
17
17
  '0%': {
@@ -29,7 +29,7 @@ var skeletonStyle = _objectSpread(_objectSpread({}, animation), {}, {
29
29
  },
30
30
  animation: {
31
31
  '& $textItem, & $image, & $buttonItem': {
32
- backgroundImage: "linear-gradient(90deg, ".concat(_theme.default.skeletonAnimationFromColor, " 25%, ").concat(_theme.default.skeletonAnimationToColor, " 37%, ").concat(_theme.default.skeletonAnimationFromColor, " 63%)"),
32
+ background: "linear-gradient(90deg, ".concat(_theme.default.skeletonAnimationFromColor, " 25%, ").concat(_theme.default.skeletonAnimationToColor, " 37%, ").concat(_theme.default.skeletonAnimationFromColor, " 63%)"),
33
33
  backgroundSize: '400% 100%',
34
34
  animation: '$skeleton-animation 1.4s ease infinite'
35
35
  }
@@ -1 +1 @@
1
- {"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAkJ1C,QAAA,MAAM,QAAQ,EAAE,QAAQ,CAAC,MAAM,UAAU,CA4MxC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1
+ {"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAkJ1C,QAAA,MAAM,QAAQ,EAAE,QAAQ,CAAC,MAAM,UAAU,CA2MxC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
package/cjs/tag/tag.js CHANGED
@@ -208,8 +208,7 @@ var TagStyle = {
208
208
  alignItems: 'center',
209
209
  display: 'inline-flex',
210
210
  cursor: 'pointer',
211
- height: _theme.default.lineHeightDynamic,
212
- maxHeight: '100%'
211
+ height: _theme.default.lineHeightDynamic
213
212
  },
214
213
  closeIconWrapper: {
215
214
  display: 'inline-flex',
@@ -1,5 +1,55 @@
1
1
  import { JsStyles } from '../jss-style';
2
2
  import { TooltipClasses } from '@sheinx/base';
3
+ export declare const tooltipAnimation: {
4
+ '@keyframes fadeIn': {
5
+ '0%': {
6
+ opacity: number;
7
+ };
8
+ '100%': {
9
+ opacity: number;
10
+ };
11
+ };
12
+ '@keyframes moveRight': {
13
+ '0%': {
14
+ transformOrigin: string;
15
+ transform: string;
16
+ };
17
+ '100%': {
18
+ transformOrigin: string;
19
+ transform: string;
20
+ };
21
+ };
22
+ '@keyframes moveLeft': {
23
+ '0%': {
24
+ transformOrigin: string;
25
+ transform: string;
26
+ };
27
+ '100%': {
28
+ transformOrigin: string;
29
+ transform: string;
30
+ };
31
+ };
32
+ '@keyframes moveTop': {
33
+ '0%': {
34
+ transformOrigin: string;
35
+ transform: string;
36
+ };
37
+ '100%': {
38
+ transformOrigin: string;
39
+ transform: string;
40
+ };
41
+ };
42
+ '@keyframes moveBottom': {
43
+ '0%': {
44
+ transformOrigin: string;
45
+ transform: string;
46
+ };
47
+ '100%': {
48
+ transformOrigin: string;
49
+ transform: string;
50
+ };
51
+ };
52
+ };
3
53
  declare const tooltipStyle: JsStyles<keyof TooltipClasses>;
4
54
  export default tooltipStyle;
5
55
  //# sourceMappingURL=tooltip.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["tooltip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAqD9C,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,cAAc,CAkOhD,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["tooltip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAK9C,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiD5B,CAAC;AACF,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,cAAc,CAkOhD,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.default = void 0;
6
+ exports.tooltipAnimation = exports.default = void 0;
7
7
  var _theme = _interopRequireDefault(require("@sheinx/theme"));
8
8
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
9
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
@@ -14,7 +14,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
14
14
  function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
15
15
  var arrowGap = 12;
16
16
  var arrowHeight = 8;
17
- var animation = {
17
+ var tooltipAnimation = exports.tooltipAnimation = {
18
18
  '@keyframes fadeIn': {
19
19
  '0%': {
20
20
  opacity: 0
@@ -25,46 +25,48 @@ var animation = {
25
25
  },
26
26
  '@keyframes moveRight': {
27
27
  '0%': {
28
- marginLeft: '0'
28
+ transformOrigin: 'left center',
29
+ transform: "var(--soui-popup-transform) scale(0.5)"
29
30
  },
30
31
  '100%': {
31
- marginLeft: '9px'
32
+ transformOrigin: 'left center',
33
+ transform: "var(--soui-popup-transform) scale(1)"
32
34
  }
33
35
  },
34
36
  '@keyframes moveLeft': {
35
37
  '0%': {
36
- opacity: 0,
37
- marginRight: '0'
38
+ transformOrigin: 'right center',
39
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(0.5)"
38
40
  },
39
41
  '100%': {
40
- opacity: 1,
41
- marginRight: '10px'
42
+ transformOrigin: 'right center',
43
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(1)"
42
44
  }
43
45
  },
44
46
  '@keyframes moveTop': {
45
47
  '0%': {
46
- opacity: 0,
47
- marginTop: '0'
48
+ transformOrigin: 'center bottom',
49
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(0.5)"
48
50
  },
49
51
  '100%': {
50
- opacity: 1,
51
- marginTop: -10
52
+ transformOrigin: 'center bottom',
53
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(1)"
52
54
  }
53
55
  },
54
56
  '@keyframes moveBottom': {
55
57
  '0%': {
56
- opacity: 0,
57
- marginTop: '0'
58
+ transformOrigin: 'center top',
59
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(0.5)"
58
60
  },
59
61
  '100%': {
60
- opacity: 1,
61
- marginTop: 10
62
+ transformOrigin: 'center top',
63
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(1)"
62
64
  }
63
65
  }
64
66
  };
65
67
  var tooltipStyle = _objectSpread(_objectSpread({
66
68
  rootClass: {}
67
- }, animation), {}, {
69
+ }, tooltipAnimation), {}, {
68
70
  wrapper: {
69
71
  display: 'none',
70
72
  cursor: 'pointer',
@@ -224,7 +226,7 @@ var tooltipStyle = _objectSpread(_objectSpread({
224
226
  position: 'absolute'
225
227
  },
226
228
  '&[data-soui-position^="bottom"]': {
227
- animation: '$fadeIn .3s ease, $moveBottom .3s cubic-bezier(.71,1.7,.77,1.24);',
229
+ animation: '$fadeIn 200ms ease, $moveBottom 200ms cubic-bezier(0.22, 0.61, 0.36, 1)',
228
230
  '&::after': {
229
231
  width: '100%',
230
232
  height: arrowGap,
@@ -233,7 +235,7 @@ var tooltipStyle = _objectSpread(_objectSpread({
233
235
  }
234
236
  },
235
237
  '&[data-soui-position^="top"]': {
236
- animation: '$fadeIn .3s ease, $moveTop .3s cubic-bezier(.71,1.7,.77,1.24);',
238
+ animation: '$fadeIn 200ms ease, $moveTop 200ms cubic-bezier(0.22, 0.61, 0.36, 1);',
237
239
  '&::after': {
238
240
  width: '100%',
239
241
  height: arrowGap,
@@ -242,7 +244,7 @@ var tooltipStyle = _objectSpread(_objectSpread({
242
244
  }
243
245
  },
244
246
  '&[data-soui-position^="left"]': {
245
- animation: '$fadeIn .3s ease, $moveLeft .3s cubic-bezier(.71,1.7,.77,1.24);',
247
+ animation: '$fadeIn 200ms ease, $moveLeft 200ms cubic-bezier(0.22, 0.61, 0.36, 1);',
246
248
  '&::after': {
247
249
  width: arrowGap,
248
250
  height: '100%',
@@ -252,7 +254,7 @@ var tooltipStyle = _objectSpread(_objectSpread({
252
254
  }
253
255
  },
254
256
  '&[data-soui-position^="right"]': {
255
- animation: '$fadeIn .3s ease, $moveRight .3s cubic-bezier(.71,1.7,.77,1.24);',
257
+ animation: '$fadeIn 200ms ease, $moveRight 200ms cubic-bezier(0.22, 0.61, 0.36, 1);',
256
258
  '&::after': {
257
259
  width: arrowGap,
258
260
  height: '100%',