@onesy/ui-react 1.0.176 → 1.0.178

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 (6) hide show
  1. package/Interaction/Interaction.d.ts +1 -0
  2. package/Interaction/Interaction.js +13 -12
  3. package/esm/Interaction/Interaction.js +12 -11
  4. package/esm/index.js +1 -1
  5. package/index.js +1 -1
  6. package/package.json +1 -1
package/Interaction/Interaction.d.ts CHANGED
@@ -15,6 +15,7 @@ export declare type IInteraction = IBaseElement & {
15
15
  wave_version?: 'simple';
16
16
  subscription?: OnesySubscription;
17
17
  clear?: any;
18
+ mobileDelay?: number;
18
19
  };
19
20
  declare const Interaction: React.FC<IInteraction>;
20
21
  export default Interaction;
package/Interaction/Interaction.js CHANGED
@@ -158,6 +158,7 @@ const Interaction = props_ => {
158
158
  subscription,
159
159
  clear,
160
160
  disabled,
161
+ mobileDelay = 150,
161
162
  className
162
163
  } = props;
163
164
  const {
@@ -232,21 +233,21 @@ const Interaction = props_ => {
232
233
  remove('mouse-down');
233
234
  removeWaves();
234
235
  };
235
- const onTouchStart = () => {
236
- onMouseUp();
236
+ const onTouchStart = event_0 => {
237
+ onMouseDown(event_0);
237
238
  onMouseIn();
238
239
  };
239
240
  const onTouchUp = () => {
240
241
  setTimeout(() => {
241
242
  onMouseUp();
242
243
  onMouseOut();
243
- }, 15);
244
+ }, mobileDelay);
244
245
  };
245
246
  const onTouchCancel = () => {
246
247
  setTimeout(() => {
247
248
  onMouseUp();
248
249
  onMouseOut();
249
- }, 15);
250
+ }, mobileDelay);
250
251
  };
251
252
  const rootDocument = (0, _utils.isEnvironment)('browser') ? ((_refs$root$current = refs.root.current) === null || _refs$root$current === void 0 ? void 0 : _refs$root$current.ownerDocument) || window.document : undefined;
252
253
  if (parent) {
@@ -281,7 +282,7 @@ const Interaction = props_ => {
281
282
  parent.removeEventListener('mouseleave', onMouseOut);
282
283
  }
283
284
  };
284
- }, [touch]);
285
+ }, [mobileDelay, touch]);
285
286
  _react.default.useEffect(() => {
286
287
  if (refs.init.current) {
287
288
  if (refs.interactions.current.length) setInteractions([]);
@@ -312,19 +313,19 @@ const Interaction = props_ => {
312
313
  _react.default.useEffect(() => {
313
314
  if (disabled && refs.interactions.current.length) setInteractions([]);
314
315
  }, [disabled]);
315
- const addWave = (event_0, overrides = {}) => {
316
+ const addWave = (event_1, overrides = {}) => {
316
317
  const origin = overrides.origin !== undefined ? overrides.origin : refs.origin.current;
317
318
  if (refs.wave.current && !refs.props.current.disabled) {
318
319
  let top = 0;
319
320
  let left = 0;
320
321
  let width = '100%';
321
322
  if (wave_version !== 'simple') {
322
- var _event_0$currentTarge, _ref;
323
- const rect = event_0 === null || event_0 === void 0 || (_event_0$currentTarge = event_0.currentTarget) === null || _event_0$currentTarge === void 0 ? void 0 : _event_0$currentTarge.getBoundingClientRect();
324
- const root = (_ref = (event_0 === null || event_0 === void 0 ? void 0 : event_0.currentTarget) || refs.root.current.parentNode) === null || _ref === void 0 ? void 0 : _ref.getBoundingClientRect();
323
+ var _event_1$currentTarge, _ref;
324
+ const rect = event_1 === null || event_1 === void 0 || (_event_1$currentTarge = event_1.currentTarget) === null || _event_1$currentTarge === void 0 ? void 0 : _event_1$currentTarge.getBoundingClientRect();
325
+ const root = (_ref = (event_1 === null || event_1 === void 0 ? void 0 : event_1.currentTarget) || refs.root.current.parentNode) === null || _ref === void 0 ? void 0 : _ref.getBoundingClientRect();
325
326
 
326
327
  // Mouse or touch event
327
- const valuesEvent = !(event_0 !== null && event_0 !== void 0 && event_0.touches) ? event_0 : event_0.touches[0];
328
+ const valuesEvent = !(event_1 !== null && event_1 !== void 0 && event_1.touches) ? event_1 : event_1.touches[0];
328
329
  const values = {
329
330
  x: valuesEvent.x !== undefined ? valuesEvent.x : valuesEvent.clientX,
330
331
  y: valuesEvent.y !== undefined ? valuesEvent.y : valuesEvent.clientY
@@ -333,8 +334,8 @@ const Interaction = props_ => {
333
334
  values.offsetY = valuesEvent.offsetY !== undefined ? valuesEvent.offsetY : values.y - rect.y;
334
335
  const w = root.width;
335
336
  const h = root.height;
336
- const x = origin === 'center' || !event_0 ? w / 2 : rect ? values.x - rect.left : values.offsetX;
337
- const y = origin === 'center' || !event_0 ? h / 2 : rect ? values.y - rect.top : values.offsetY;
337
+ const x = origin === 'center' || !event_1 ? w / 2 : rect ? values.x - rect.left : values.offsetX;
338
+ const y = origin === 'center' || !event_1 ? h / 2 : rect ? values.y - rect.top : values.offsetY;
338
339
  width = Math.round(Math.sqrt(
339
340
  // Largest sub rectangle in value
340
341
  Math.max(x ** 2 + y ** 2, Math.abs(w - x) ** 2 + y ** 2, x ** 2 + Math.abs(h - y) ** 2, Math.abs(w - x) ** 2 + Math.abs(h - y) ** 2)) * 2);
package/esm/Interaction/Interaction.js CHANGED
@@ -150,6 +150,7 @@ const Interaction = props_ => {
150
150
  subscription,
151
151
  clear,
152
152
  disabled,
153
+ mobileDelay = 150,
153
154
  className
154
155
  } = props;
155
156
  const {
@@ -223,21 +224,21 @@ const Interaction = props_ => {
223
224
  remove('mouse-down');
224
225
  removeWaves();
225
226
  };
226
- const onTouchStart = () => {
227
- onMouseUp();
227
+ const onTouchStart = event_0 => {
228
+ onMouseDown(event_0);
228
229
  onMouseIn();
229
230
  };
230
231
  const onTouchUp = () => {
231
232
  setTimeout(() => {
232
233
  onMouseUp();
233
234
  onMouseOut();
234
- }, 15);
235
+ }, mobileDelay);
235
236
  };
236
237
  const onTouchCancel = () => {
237
238
  setTimeout(() => {
238
239
  onMouseUp();
239
240
  onMouseOut();
240
- }, 15);
241
+ }, mobileDelay);
241
242
  };
242
243
  const rootDocument = isEnvironment('browser') ? refs.root.current?.ownerDocument || window.document : undefined;
243
244
  if (parent) {
@@ -272,7 +273,7 @@ const Interaction = props_ => {
272
273
  parent.removeEventListener('mouseleave', onMouseOut);
273
274
  }
274
275
  };
275
- }, [touch]);
276
+ }, [mobileDelay, touch]);
276
277
  React.useEffect(() => {
277
278
  if (refs.init.current) {
278
279
  if (refs.interactions.current.length) setInteractions([]);
@@ -302,18 +303,18 @@ const Interaction = props_ => {
302
303
  React.useEffect(() => {
303
304
  if (disabled && refs.interactions.current.length) setInteractions([]);
304
305
  }, [disabled]);
305
- const addWave = (event_0, overrides = {}) => {
306
+ const addWave = (event_1, overrides = {}) => {
306
307
  const origin = overrides.origin !== undefined ? overrides.origin : refs.origin.current;
307
308
  if (refs.wave.current && !refs.props.current.disabled) {
308
309
  let top = 0;
309
310
  let left = 0;
310
311
  let width = '100%';
311
312
  if (wave_version !== 'simple') {
312
- const rect = event_0?.currentTarget?.getBoundingClientRect();
313
- const root = (event_0?.currentTarget || refs.root.current.parentNode)?.getBoundingClientRect();
313
+ const rect = event_1?.currentTarget?.getBoundingClientRect();
314
+ const root = (event_1?.currentTarget || refs.root.current.parentNode)?.getBoundingClientRect();
314
315
 
315
316
  // Mouse or touch event
316
- const valuesEvent = !event_0?.touches ? event_0 : event_0.touches[0];
317
+ const valuesEvent = !event_1?.touches ? event_1 : event_1.touches[0];
317
318
  const values = {
318
319
  x: valuesEvent.x !== undefined ? valuesEvent.x : valuesEvent.clientX,
319
320
  y: valuesEvent.y !== undefined ? valuesEvent.y : valuesEvent.clientY
@@ -322,8 +323,8 @@ const Interaction = props_ => {
322
323
  values.offsetY = valuesEvent.offsetY !== undefined ? valuesEvent.offsetY : values.y - rect.y;
323
324
  const w = root.width;
324
325
  const h = root.height;
325
- const x = origin === 'center' || !event_0 ? w / 2 : rect ? values.x - rect.left : values.offsetX;
326
- const y = origin === 'center' || !event_0 ? h / 2 : rect ? values.y - rect.top : values.offsetY;
326
+ const x = origin === 'center' || !event_1 ? w / 2 : rect ? values.x - rect.left : values.offsetX;
327
+ const y = origin === 'center' || !event_1 ? h / 2 : rect ? values.y - rect.top : values.offsetY;
327
328
  width = Math.round(Math.sqrt(
328
329
  // Largest sub rectangle in value
329
330
  Math.max(x ** 2 + y ** 2, Math.abs(w - x) ** 2 + y ** 2, x ** 2 + Math.abs(h - y) ** 2, Math.abs(w - x) ** 2 + Math.abs(h - y) ** 2)) * 2);
package/esm/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license UiReact v1.0.175
1
+ /** @license UiReact v1.0.177
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
package/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license UiReact v1.0.175
1
+ /** @license UiReact v1.0.177
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@onesy/ui-react",
3
- "version": "1.0.176",
3
+ "version": "1.0.178",
4
4
  "description": "UI for React",
5
5
  "repository": "https://github.com/onesy-me/onesy.git",
6
6
  "author": "Lazar Erić <lazareric1@proton.me>",