@marianmeres/stuic 1.9.1 → 1.11.0

package/dist/components/HoverExpandableWidth/HoverExpandableWidth.svelte

@@ -4,8 +4,10 @@ import { get } from "svelte/store";
 import { twMerge } from "tailwind-merge";
 import { prefersReducedMotionStore } from "../../utils/prefers-reduced-motion.js";
 import { windowSize } from "../../utils/window-size.js";
+import { DevicePointer } from "../../index.js";
 const clog = createClog("HoverExpandableWidth");
 const dispatch = createEventDispatcher();
+export let enabled = DevicePointer.isFine;
 export let shadowOpacity = 0.5;
 export let duration = 150;
 export let targetWidth = 256;
@@ -32,6 +34,8 @@ const _planDelayedExec = (_fn, _delay) => {
   }, _delay);
 };
 const _expand = () => {
+  if (!enabled)
+    return;
   if (_isExpanding || _isShrinking || _isExpanded)
     return;
   _isExpanded = true;
@@ -71,6 +75,8 @@ const _expand = () => {
   });
 };
 const _shrink = () => {
+  if (!enabled)
+    return;
   if (_isExpanding || _isShrinking || !_isExpanded)
     return;
   _isExpanded = false;

package/dist/components/HoverExpandableWidth/HoverExpandableWidth.svelte.d.ts

@@ -1,6 +1,7 @@
 import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
+        enabled?: boolean | undefined;
         shadowOpacity?: number | undefined;
         duration?: number | undefined;
         targetWidth?: number | undefined;

package/dist/index.d.ts

@@ -8,3 +8,4 @@ export { default as Drawer, createDrawerStore } from './components/Drawer/Drawer
 export { default as HoverExpandableWidth } from './components/HoverExpandableWidth/HoverExpandableWidth.svelte';
 export { default as X } from './components/X/X.svelte';
 export { windowSize, breakpoint } from './utils/window-size.js';
+export { DevicePointer } from './utils/device-pointer.js';

package/dist/index.js

@@ -15,5 +15,6 @@ export { default as Drawer, createDrawerStore } from './components/Drawer/Drawer
 export { default as HoverExpandableWidth } from './components/HoverExpandableWidth/HoverExpandableWidth.svelte';
 //
 export { default as X } from './components/X/X.svelte';
-//
+// utils
 export { windowSize, breakpoint } from './utils/window-size.js';
+export { DevicePointer } from './utils/device-pointer.js';

package/dist/utils/device-pointer.d.ts

@@ -0,0 +1,5 @@
+export declare class DevicePointer {
+    static readonly isNone: boolean;
+    static readonly isCoarse: boolean;
+    static readonly isFine: boolean;
+}

package/dist/utils/device-pointer.js

@@ -0,0 +1,9 @@
+export class DevicePointer {
+    // none - The primary input mechanism does not include a pointing device.
+    static isNone = window?.matchMedia('(any-pointer:none)').matches;
+    // coarse - The primary input mechanism includes a pointing device of limited accuracy,
+    // such as a finger on a touchscreen.
+    static isCoarse = window?.matchMedia('(any-pointer:coarse)').matches;
+    // fine - The primary input mechanism includes an accurate pointing device, such as a mouse.
+    static isFine = window?.matchMedia('(any-pointer:fine)').matches;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@marianmeres/stuic",
-	"version": "1.9.1",
+	"version": "1.11.0",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build && npm run package",