@sheinx/shineout-style 3.3.6-beta.2 → 3.3.6-beta.4

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 (9) hide show
  1. package/cjs/tooltip/tooltip.d.ts.map +1 -1
  2. package/cjs/tooltip/tooltip.js +91 -90
  3. package/cjs/version.d.ts +1 -1
  4. package/cjs/version.js +1 -1
  5. package/esm/tooltip/tooltip.d.ts.map +1 -1
  6. package/esm/tooltip/tooltip.js +91 -90
  7. package/esm/version.d.ts +1 -1
  8. package/esm/version.js +1 -1
  9. package/package.json +3 -3
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;AA+C9C,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,cAAc,CAgLhD,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;AA+C9C,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,cAAc,CAoMhD,CAAC;AAEF,eAAe,YAAY,CAAC"}
package/cjs/tooltip/tooltip.js CHANGED
@@ -89,7 +89,8 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
89
89
  backgroundColor: _theme.default.tooltipDangerBackgroundColor,
90
90
  color: _theme.default.tooltipDangerColor
91
91
  },
92
- '&::before': {
92
+ // '&::before': {
93
+ '& $arrow': {
93
94
  'z-index': 1,
94
95
  position: 'absolute',
95
96
  content: '" "',
@@ -104,19 +105,13 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
104
105
  },
105
106
  '&[data-soui-position^="bottom"]': {
106
107
  marginTop: arrowGap - 2,
107
- '&::before': {
108
- top: '0',
109
- left: '0',
110
- right: '0',
111
- margin: 'auto'
112
- },
113
- '&[dir=ltr]::before': {
108
+ '&[dir=ltr] $arrow': {
114
109
  transform: 'translate(0, -50%) rotate(-45deg)'
115
110
  },
116
- '&[dir=rtl]::before': {
111
+ '&[dir=rtl] $arrow': {
117
112
  transform: 'translate(0, -50%) rotate(45deg)'
118
113
  },
119
- '&::after': {
114
+ '& $arrow::after': {
120
115
  top: arrowGap * -1,
121
116
  left: '0',
122
117
  right: '0',
@@ -128,105 +123,105 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
128
123
  },
129
124
  '&[data-soui-position^="top"]': {
130
125
  marginTop: (arrowGap - 2) * -1,
131
- '&::before': {
132
- bottom: '0',
133
- transform: 'translate(0, 50%) rotate(135deg)',
134
- left: '0',
135
- right: '0',
136
- margin: 'auto'
137
- },
138
- '&[dir=ltr]::before': {
126
+ '&[dir=ltr] $arrow': {
139
127
  transform: 'translate(0, 50%) rotate(135deg)'
140
128
  },
141
- '&[dir=rtl]::before': {
129
+ '&[dir=rtl] $arrow': {
142
130
  transform: 'translate(0, 50%) rotate(-135deg)'
143
- },
144
- '&::after': {
145
- bottom: arrowGap * -1,
146
- left: '0',
147
- right: '0',
148
- content: '" "',
149
- display: 'block',
150
- height: arrowGap,
151
- position: 'absolute'
152
131
  }
132
+ // '&::before': {
133
+ // bottom: '0',
134
+ // transform: 'translate(0, 50%) rotate(135deg)',
135
+ // left: '0',
136
+ // right: '0',
137
+ // margin: 'auto',
138
+ // },
139
+ // '&[dir=ltr]::before': {
140
+ // transform: 'translate(0, 50%) rotate(135deg)',
141
+ // },
142
+ // '&[dir=rtl]::before': {
143
+ // transform: 'translate(0, 50%) rotate(-135deg)',
144
+ // },
145
+ // '&::after': {
146
+ // bottom: arrowGap * -1,
147
+ // left: '0',
148
+ // right: '0',
149
+ // content: '" "',
150
+ // display: 'block',
151
+ // height: arrowGap,
152
+ // position: 'absolute',
153
+ // },
153
154
  },
154
155
  '&[data-soui-position^="left"]': {
155
156
  marginLeft: (arrowGap - 2) * -1,
156
- '&[dir=ltr]': {
157
- marginLeft: (arrowGap - 2) * -1
158
- },
159
- '&[dir=rtl]': {
160
- marginRight: (arrowGap - 2) * -1
161
- },
162
- '&::before': {
163
- right: 0,
164
- top: '0',
165
- bottom: '0',
166
- margin: 'auto'
167
- },
168
- '&[dir=ltr]::before': {
157
+ '&[dir=ltr] $arrow': {
169
158
  transform: 'translate(50%, 0) rotate(45deg)'
170
159
  },
171
- '&[dir=rtl]::before': {
160
+ '&[dir=rtl] $arrow': {
172
161
  transform: 'translate(50%, 0) rotate(135deg)'
173
- },
174
- '&::after': {
175
- left: arrowGap * -1,
176
- top: '0',
177
- bottom: '0',
178
- content: '" "',
179
- display: 'block',
180
- width: arrowGap,
181
- position: 'absolute'
182
162
  }
163
+
164
+ // '&[dir=ltr]': { marginLeft: (arrowGap - 2) * -1 },
165
+ // '&[dir=rtl]': { marginRight: (arrowGap - 2) * -1 },
166
+ // '&::before': {
167
+ // right: 0,
168
+ // top: '0',
169
+ // bottom: '0',
170
+ // margin: 'auto',
171
+ // },
172
+ // '&[dir=ltr]::before': {
173
+ // transform: 'translate(50%, 0) rotate(45deg)',
174
+ // },
175
+ // '&[dir=rtl]::before': {
176
+ // transform: 'translate(50%, 0) rotate(135deg)',
177
+ // },
178
+ // '&::after': {
179
+ // left: arrowGap * -1,
180
+ // top: '0',
181
+ // bottom: '0',
182
+ // content: '" "',
183
+ // display: 'block',
184
+ // width: arrowGap,
185
+ // position: 'absolute',
186
+ // },
183
187
  },
184
188
  '&[data-soui-position^="right"]': {
185
189
  marginLeft: arrowGap - 2,
186
- '&[dir=ltr]': {
187
- marginLeft: arrowGap - 2
188
- },
189
- '&[dir=rtl]': {
190
- marginRight: arrowGap - 2
191
- },
192
- '&::before': {
193
- left: '0',
194
- top: '0',
195
- bottom: '0',
196
- margin: 'auto'
197
- },
198
- '&[dir=ltr]::before': {
190
+ '&[dir=ltr] $arrow': {
199
191
  transform: 'translate(-50%, 0) rotate(-135deg)'
200
192
  },
201
- '&[dir=rtl]::before': {
193
+ '&[dir=rtl] $arrow': {
202
194
  transform: 'translate(-50%, 0) rotate(-45deg)'
203
- },
204
- '&::after': {
205
- left: arrowGap * -1,
206
- top: '0',
207
- bottom: '0',
208
- content: '" "',
209
- display: 'block',
210
- width: arrowGap,
211
- position: 'absolute'
212
195
  }
213
- },
214
- '&&[data-soui-position$="-left"]::before': {
215
- left: arrowMargin,
216
- right: 'auto'
217
- },
218
- '&&[data-soui-position$="-right"]::before': {
219
- right: arrowMargin,
220
- left: 'auto'
221
- },
222
- '&&[data-soui-position$="-top"]::before': {
223
- top: arrowMargin,
224
- bottom: 'auto'
225
- },
226
- '&&[data-soui-position$="-bottom"]::before': {
227
- bottom: arrowMargin,
228
- top: 'auto'
196
+
197
+ // '&[dir=ltr]': { marginLeft: arrowGap - 2 },
198
+ // '&[dir=rtl]': { marginRight: arrowGap - 2 },
199
+ // '&::before': {
200
+ // left: '0',
201
+ // top: '0',
202
+ // bottom: '0',
203
+ // margin: 'auto',
204
+ // },
205
+ // '&[dir=ltr]::before': {
206
+ // transform: 'translate(-50%, 0) rotate(-135deg)',
207
+ // },
208
+ // '&[dir=rtl]::before': {
209
+ // transform: 'translate(-50%, 0) rotate(-45deg)',
210
+ // },
211
+ // '&::after': {
212
+ // left: arrowGap * -1,
213
+ // top: '0',
214
+ // bottom: '0',
215
+ // content: '" "',
216
+ // display: 'block',
217
+ // width: arrowGap,
218
+ // position: 'absolute',
219
+ // },
229
220
  }
221
+ // '&&[data-soui-position$="-left"]::before': { left: arrowMargin, right: 'auto' },
222
+ // '&&[data-soui-position$="-right"]::before': { right: arrowMargin, left: 'auto' },
223
+ // '&&[data-soui-position$="-top"]::before': { top: arrowMargin, bottom: 'auto' },
224
+ // '&&[data-soui-position$="-bottom"]::before': { bottom: arrowMargin, top: 'auto' },
230
225
  },
231
226
  wrapperOpen: {
232
227
  display: 'block',
@@ -246,6 +241,12 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
246
241
  target: {
247
242
  display: 'inline-block'
248
243
  },
244
+ arrow: {
245
+ // before
246
+ '&::before': {
247
+ content: "''"
248
+ }
249
+ },
249
250
  content: {
250
251
  padding: "".concat(_theme.default.tooltipPaddingY, " ").concat(_theme.default.tooltipPaddingX),
251
252
  fontSize: _theme.default.tooltipFontSize
package/cjs/version.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- declare const _default: "3.3.6-beta.2";
1
+ declare const _default: "3.3.6-beta.4";
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.3.6-beta.2';
7
+ var _default = exports.default = '3.3.6-beta.4';
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;AA+C9C,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,cAAc,CAgLhD,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;AA+C9C,QAAA,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,cAAc,CAoMhD,CAAC;AAEF,eAAe,YAAY,CAAC"}
package/esm/tooltip/tooltip.js CHANGED
@@ -82,7 +82,8 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
82
82
  backgroundColor: token.tooltipDangerBackgroundColor,
83
83
  color: token.tooltipDangerColor
84
84
  },
85
- '&::before': {
85
+ // '&::before': {
86
+ '& $arrow': {
86
87
  'z-index': 1,
87
88
  position: 'absolute',
88
89
  content: '" "',
@@ -97,19 +98,13 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
97
98
  },
98
99
  '&[data-soui-position^="bottom"]': {
99
100
  marginTop: arrowGap - 2,
100
- '&::before': {
101
- top: '0',
102
- left: '0',
103
- right: '0',
104
- margin: 'auto'
105
- },
106
- '&[dir=ltr]::before': {
101
+ '&[dir=ltr] $arrow': {
107
102
  transform: 'translate(0, -50%) rotate(-45deg)'
108
103
  },
109
- '&[dir=rtl]::before': {
104
+ '&[dir=rtl] $arrow': {
110
105
  transform: 'translate(0, -50%) rotate(45deg)'
111
106
  },
112
- '&::after': {
107
+ '& $arrow::after': {
113
108
  top: arrowGap * -1,
114
109
  left: '0',
115
110
  right: '0',
@@ -121,105 +116,105 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
121
116
  },
122
117
  '&[data-soui-position^="top"]': {
123
118
  marginTop: (arrowGap - 2) * -1,
124
- '&::before': {
125
- bottom: '0',
126
- transform: 'translate(0, 50%) rotate(135deg)',
127
- left: '0',
128
- right: '0',
129
- margin: 'auto'
130
- },
131
- '&[dir=ltr]::before': {
119
+ '&[dir=ltr] $arrow': {
132
120
  transform: 'translate(0, 50%) rotate(135deg)'
133
121
  },
134
- '&[dir=rtl]::before': {
122
+ '&[dir=rtl] $arrow': {
135
123
  transform: 'translate(0, 50%) rotate(-135deg)'
136
- },
137
- '&::after': {
138
- bottom: arrowGap * -1,
139
- left: '0',
140
- right: '0',
141
- content: '" "',
142
- display: 'block',
143
- height: arrowGap,
144
- position: 'absolute'
145
124
  }
125
+ // '&::before': {
126
+ // bottom: '0',
127
+ // transform: 'translate(0, 50%) rotate(135deg)',
128
+ // left: '0',
129
+ // right: '0',
130
+ // margin: 'auto',
131
+ // },
132
+ // '&[dir=ltr]::before': {
133
+ // transform: 'translate(0, 50%) rotate(135deg)',
134
+ // },
135
+ // '&[dir=rtl]::before': {
136
+ // transform: 'translate(0, 50%) rotate(-135deg)',
137
+ // },
138
+ // '&::after': {
139
+ // bottom: arrowGap * -1,
140
+ // left: '0',
141
+ // right: '0',
142
+ // content: '" "',
143
+ // display: 'block',
144
+ // height: arrowGap,
145
+ // position: 'absolute',
146
+ // },
146
147
  },
147
148
  '&[data-soui-position^="left"]': {
148
149
  marginLeft: (arrowGap - 2) * -1,
149
- '&[dir=ltr]': {
150
- marginLeft: (arrowGap - 2) * -1
151
- },
152
- '&[dir=rtl]': {
153
- marginRight: (arrowGap - 2) * -1
154
- },
155
- '&::before': {
156
- right: 0,
157
- top: '0',
158
- bottom: '0',
159
- margin: 'auto'
160
- },
161
- '&[dir=ltr]::before': {
150
+ '&[dir=ltr] $arrow': {
162
151
  transform: 'translate(50%, 0) rotate(45deg)'
163
152
  },
164
- '&[dir=rtl]::before': {
153
+ '&[dir=rtl] $arrow': {
165
154
  transform: 'translate(50%, 0) rotate(135deg)'
166
- },
167
- '&::after': {
168
- left: arrowGap * -1,
169
- top: '0',
170
- bottom: '0',
171
- content: '" "',
172
- display: 'block',
173
- width: arrowGap,
174
- position: 'absolute'
175
155
  }
156
+
157
+ // '&[dir=ltr]': { marginLeft: (arrowGap - 2) * -1 },
158
+ // '&[dir=rtl]': { marginRight: (arrowGap - 2) * -1 },
159
+ // '&::before': {
160
+ // right: 0,
161
+ // top: '0',
162
+ // bottom: '0',
163
+ // margin: 'auto',
164
+ // },
165
+ // '&[dir=ltr]::before': {
166
+ // transform: 'translate(50%, 0) rotate(45deg)',
167
+ // },
168
+ // '&[dir=rtl]::before': {
169
+ // transform: 'translate(50%, 0) rotate(135deg)',
170
+ // },
171
+ // '&::after': {
172
+ // left: arrowGap * -1,
173
+ // top: '0',
174
+ // bottom: '0',
175
+ // content: '" "',
176
+ // display: 'block',
177
+ // width: arrowGap,
178
+ // position: 'absolute',
179
+ // },
176
180
  },
177
181
  '&[data-soui-position^="right"]': {
178
182
  marginLeft: arrowGap - 2,
179
- '&[dir=ltr]': {
180
- marginLeft: arrowGap - 2
181
- },
182
- '&[dir=rtl]': {
183
- marginRight: arrowGap - 2
184
- },
185
- '&::before': {
186
- left: '0',
187
- top: '0',
188
- bottom: '0',
189
- margin: 'auto'
190
- },
191
- '&[dir=ltr]::before': {
183
+ '&[dir=ltr] $arrow': {
192
184
  transform: 'translate(-50%, 0) rotate(-135deg)'
193
185
  },
194
- '&[dir=rtl]::before': {
186
+ '&[dir=rtl] $arrow': {
195
187
  transform: 'translate(-50%, 0) rotate(-45deg)'
196
- },
197
- '&::after': {
198
- left: arrowGap * -1,
199
- top: '0',
200
- bottom: '0',
201
- content: '" "',
202
- display: 'block',
203
- width: arrowGap,
204
- position: 'absolute'
205
188
  }
206
- },
207
- '&&[data-soui-position$="-left"]::before': {
208
- left: arrowMargin,
209
- right: 'auto'
210
- },
211
- '&&[data-soui-position$="-right"]::before': {
212
- right: arrowMargin,
213
- left: 'auto'
214
- },
215
- '&&[data-soui-position$="-top"]::before': {
216
- top: arrowMargin,
217
- bottom: 'auto'
218
- },
219
- '&&[data-soui-position$="-bottom"]::before': {
220
- bottom: arrowMargin,
221
- top: 'auto'
189
+
190
+ // '&[dir=ltr]': { marginLeft: arrowGap - 2 },
191
+ // '&[dir=rtl]': { marginRight: arrowGap - 2 },
192
+ // '&::before': {
193
+ // left: '0',
194
+ // top: '0',
195
+ // bottom: '0',
196
+ // margin: 'auto',
197
+ // },
198
+ // '&[dir=ltr]::before': {
199
+ // transform: 'translate(-50%, 0) rotate(-135deg)',
200
+ // },
201
+ // '&[dir=rtl]::before': {
202
+ // transform: 'translate(-50%, 0) rotate(-45deg)',
203
+ // },
204
+ // '&::after': {
205
+ // left: arrowGap * -1,
206
+ // top: '0',
207
+ // bottom: '0',
208
+ // content: '" "',
209
+ // display: 'block',
210
+ // width: arrowGap,
211
+ // position: 'absolute',
212
+ // },
222
213
  }
214
+ // '&&[data-soui-position$="-left"]::before': { left: arrowMargin, right: 'auto' },
215
+ // '&&[data-soui-position$="-right"]::before': { right: arrowMargin, left: 'auto' },
216
+ // '&&[data-soui-position$="-top"]::before': { top: arrowMargin, bottom: 'auto' },
217
+ // '&&[data-soui-position$="-bottom"]::before': { bottom: arrowMargin, top: 'auto' },
223
218
  },
224
219
  wrapperOpen: {
225
220
  display: 'block',
@@ -239,6 +234,12 @@ var tooltipStyle = _objectSpread(_objectSpread({}, animation), {}, {
239
234
  target: {
240
235
  display: 'inline-block'
241
236
  },
237
+ arrow: {
238
+ // before
239
+ '&::before': {
240
+ content: "''"
241
+ }
242
+ },
242
243
  content: {
243
244
  padding: "".concat(token.tooltipPaddingY, " ").concat(token.tooltipPaddingX),
244
245
  fontSize: token.tooltipFontSize
package/esm/version.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- declare const _default: "3.3.6-beta.2";
1
+ declare const _default: "3.3.6-beta.4";
2
2
  export default _default;
3
3
  //# sourceMappingURL=version.d.ts.map
package/esm/version.js CHANGED
@@ -1 +1 @@
1
- export default '3.3.6-beta.2';
1
+ export default '3.3.6-beta.4';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sheinx/shineout-style",
3
- "version": "3.3.6-beta.2",
3
+ "version": "3.3.6-beta.4",
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.3.6-beta.2",
21
- "@sheinx/base": "3.3.6-beta.2"
20
+ "@sheinx/theme": "3.3.6-beta.4",
21
+ "@sheinx/base": "3.3.6-beta.4"
22
22
  },
23
23
  "peerDependencies": {
24
24
  "core-js": ">=3"