@sheinx/shineout-style 3.8.0-beta.1 → 3.8.0-beta.3

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 (15) hide show
  1. package/cjs/popover/popover.d.ts.map +1 -1
  2. package/cjs/popover/popover.js +18 -3
  3. package/cjs/tooltip/tooltip.d.ts +50 -0
  4. package/cjs/tooltip/tooltip.d.ts.map +1 -1
  5. package/cjs/tooltip/tooltip.js +23 -21
  6. package/cjs/version.d.ts +1 -1
  7. package/cjs/version.js +1 -1
  8. package/esm/popover/popover.d.ts.map +1 -1
  9. package/esm/popover/popover.js +18 -3
  10. package/esm/tooltip/tooltip.d.ts +50 -0
  11. package/esm/tooltip/tooltip.d.ts.map +1 -1
  12. package/esm/tooltip/tooltip.js +22 -20
  13. package/esm/version.d.ts +1 -1
  14. package/esm/version.js +1 -1
  15. package/package.json +3 -3
package/cjs/popover/popover.d.ts.map CHANGED
@@ -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"}
package/cjs/popover/popover.js CHANGED
@@ -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;
package/cjs/tooltip/tooltip.d.ts CHANGED
@@ -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
package/cjs/tooltip/tooltip.d.ts.map CHANGED
@@ -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"}
package/cjs/tooltip/tooltip.js CHANGED
@@ -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%',
package/cjs/version.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- declare const _default: "3.8.0-beta.1";
1
+ declare const _default: "3.8.0-beta.3";
2
2
  export default _default;
3
3
  //# sourceMappingURL=version.d.ts.map
package/cjs/version.js CHANGED
@@ -4,4 +4,4 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
- var _default = exports.default = '3.8.0-beta.1';
7
+ var _default = exports.default = '3.8.0-beta.3';
package/esm/popover/popover.d.ts.map CHANGED
@@ -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"}
package/esm/popover/popover.js CHANGED
@@ -1,15 +1,18 @@
1
1
  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); }
2
+ 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; }
3
+ 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; }
2
4
  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; }
3
5
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
4
6
  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); }
5
7
  import token from '@sheinx/theme';
8
+ import { tooltipAnimation } from "../tooltip/tooltip";
6
9
  var cssvar = '--popover-arrow-gap';
7
10
  var hideArrowGap = "var(".concat(cssvar, ", 10px)");
8
11
  var extraArrowGap = 'var(--popover-arrow-gap-extra, 0px)';
9
12
  var arrowMargin = '8px';
10
13
  var poyfillPos = "calc((".concat(hideArrowGap, " + ").concat(extraArrowGap, ") * -1)");
11
14
  var poyfillHeight = "calc((".concat(hideArrowGap, " + ").concat(extraArrowGap, "))");
12
- var popoverStyle = {
15
+ var popoverStyle = _objectSpread(_objectSpread({}, tooltipAnimation), {}, {
13
16
  rootClass: {},
14
17
  wrapper: {
15
18
  display: 'none',
@@ -170,7 +173,19 @@ var popoverStyle = {
170
173
  }
171
174
  },
172
175
  wrapperOpen: {
173
- display: 'block'
176
+ display: 'block',
177
+ '&[data-soui-position^="bottom"]': {
178
+ animation: '$fadeIn 200ms ease, $moveBottom 200ms cubic-bezier(0.22, 0.61, 0.36, 1)'
179
+ },
180
+ '&[data-soui-position^="top"]': {
181
+ animation: '$fadeIn 200ms ease, $moveTop 200ms cubic-bezier(0.22, 0.61, 0.36, 1);'
182
+ },
183
+ '&[data-soui-position^="left"]': {
184
+ animation: '$fadeIn 200ms ease, $moveLeft 200ms cubic-bezier(0.22, 0.61, 0.36, 1);'
185
+ },
186
+ '&[data-soui-position^="right"]': {
187
+ animation: '$fadeIn 200ms ease, $moveRight 200ms cubic-bezier(0.22, 0.61, 0.36, 1);'
188
+ }
174
189
  },
175
190
  arrow: {},
176
191
  hideArrow: {},
@@ -202,5 +217,5 @@ var popoverStyle = {
202
217
  footer: {
203
218
  textAlign: 'right'
204
219
  }
205
- };
220
+ });
206
221
  export default popoverStyle;
package/esm/tooltip/tooltip.d.ts CHANGED
@@ -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
package/esm/tooltip/tooltip.d.ts.map CHANGED
@@ -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"}
package/esm/tooltip/tooltip.js CHANGED
@@ -7,7 +7,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
7
7
  import token from '@sheinx/theme';
8
8
  var arrowGap = 12;
9
9
  var arrowHeight = 8;
10
- var animation = {
10
+ export var tooltipAnimation = {
11
11
  '@keyframes fadeIn': {
12
12
  '0%': {
13
13
  opacity: 0
@@ -18,46 +18,48 @@ var animation = {
18
18
  },
19
19
  '@keyframes moveRight': {
20
20
  '0%': {
21
- marginLeft: '0'
21
+ transformOrigin: 'left center',
22
+ transform: "var(--soui-popup-transform) scale(0.5)"
22
23
  },
23
24
  '100%': {
24
- marginLeft: '9px'
25
+ transformOrigin: 'left center',
26
+ transform: "var(--soui-popup-transform) scale(1)"
25
27
  }
26
28
  },
27
29
  '@keyframes moveLeft': {
28
30
  '0%': {
29
- opacity: 0,
30
- marginRight: '0'
31
+ transformOrigin: 'right center',
32
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(0.5)"
31
33
  },
32
34
  '100%': {
33
- opacity: 1,
34
- marginRight: '10px'
35
+ transformOrigin: 'right center',
36
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(1)"
35
37
  }
36
38
  },
37
39
  '@keyframes moveTop': {
38
40
  '0%': {
39
- opacity: 0,
40
- marginTop: '0'
41
+ transformOrigin: 'center bottom',
42
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(0.5)"
41
43
  },
42
44
  '100%': {
43
- opacity: 1,
44
- marginTop: -10
45
+ transformOrigin: 'center bottom',
46
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(1)"
45
47
  }
46
48
  },
47
49
  '@keyframes moveBottom': {
48
50
  '0%': {
49
- opacity: 0,
50
- marginTop: '0'
51
+ transformOrigin: 'center top',
52
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(0.5)"
51
53
  },
52
54
  '100%': {
53
- opacity: 1,
54
- marginTop: 10
55
+ transformOrigin: 'center top',
56
+ transform: "var(--soui-popup-transform, rotate(0deg)) scale(1)"
55
57
  }
56
58
  }
57
59
  };
58
60
  var tooltipStyle = _objectSpread(_objectSpread({
59
61
  rootClass: {}
60
- }, animation), {}, {
62
+ }, tooltipAnimation), {}, {
61
63
  wrapper: {
62
64
  display: 'none',
63
65
  cursor: 'pointer',
@@ -217,7 +219,7 @@ var tooltipStyle = _objectSpread(_objectSpread({
217
219
  position: 'absolute'
218
220
  },
219
221
  '&[data-soui-position^="bottom"]': {
220
- animation: '$fadeIn .3s ease, $moveBottom .3s cubic-bezier(.71,1.7,.77,1.24);',
222
+ animation: '$fadeIn 200ms ease, $moveBottom 200ms cubic-bezier(0.22, 0.61, 0.36, 1)',
221
223
  '&::after': {
222
224
  width: '100%',
223
225
  height: arrowGap,
@@ -226,7 +228,7 @@ var tooltipStyle = _objectSpread(_objectSpread({
226
228
  }
227
229
  },
228
230
  '&[data-soui-position^="top"]': {
229
- animation: '$fadeIn .3s ease, $moveTop .3s cubic-bezier(.71,1.7,.77,1.24);',
231
+ animation: '$fadeIn 200ms ease, $moveTop 200ms cubic-bezier(0.22, 0.61, 0.36, 1);',
230
232
  '&::after': {
231
233
  width: '100%',
232
234
  height: arrowGap,
@@ -235,7 +237,7 @@ var tooltipStyle = _objectSpread(_objectSpread({
235
237
  }
236
238
  },
237
239
  '&[data-soui-position^="left"]': {
238
- animation: '$fadeIn .3s ease, $moveLeft .3s cubic-bezier(.71,1.7,.77,1.24);',
240
+ animation: '$fadeIn 200ms ease, $moveLeft 200ms cubic-bezier(0.22, 0.61, 0.36, 1);',
239
241
  '&::after': {
240
242
  width: arrowGap,
241
243
  height: '100%',
@@ -245,7 +247,7 @@ var tooltipStyle = _objectSpread(_objectSpread({
245
247
  }
246
248
  },
247
249
  '&[data-soui-position^="right"]': {
248
- animation: '$fadeIn .3s ease, $moveRight .3s cubic-bezier(.71,1.7,.77,1.24);',
250
+ animation: '$fadeIn 200ms ease, $moveRight 200ms cubic-bezier(0.22, 0.61, 0.36, 1);',
249
251
  '&::after': {
250
252
  width: arrowGap,
251
253
  height: '100%',
package/esm/version.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- declare const _default: "3.8.0-beta.1";
1
+ declare const _default: "3.8.0-beta.3";
2
2
  export default _default;
3
3
  //# sourceMappingURL=version.d.ts.map
package/esm/version.js CHANGED
@@ -1 +1 @@
1
- export default '3.8.0-beta.1';
1
+ export default '3.8.0-beta.3';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sheinx/shineout-style",
3
- "version": "3.8.0-beta.1",
3
+ "version": "3.8.0-beta.3",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -17,8 +17,8 @@
17
17
  "dependencies": {
18
18
  "jss": "10.9.2",
19
19
  "react-jss": "10.9.2",
20
- "@sheinx/theme": "3.8.0-beta.1",
21
- "@sheinx/base": "3.8.0-beta.1"
20
+ "@sheinx/theme": "3.8.0-beta.3",
21
+ "@sheinx/base": "3.8.0-beta.3"
22
22
  },
23
23
  "peerDependencies": {
24
24
  "core-js": ">=3"