@skewedaspect/sleekspace-ui 0.9.0 → 0.9.1

package/src/utils/slots.ts

@@ -0,0 +1,75 @@
+//----------------------------------------------------------------------------------------------------------------------
+// Slot Utilities
+//
+// Helpers for inspecting Vue slot content. The common case: a component renders a wrapper div (or gates a
+// fallback) based on whether a slot was passed. Checking `slots.foo` truthy only tells you a slot *function*
+// exists; it doesn't tell you whether calling it produces anything. A slot whose content resolves to only
+// comments, whitespace text, or a falsy `v-if` still evaluates truthy but renders nothing, which leaves
+// behind empty wrappers that pick up gap/padding and distort layout.
+//----------------------------------------------------------------------------------------------------------------------
+
+import { Comment, Fragment, Text, type VNode } from 'vue';
+
+//----------------------------------------------------------------------------------------------------------------------
+
+// Accepts any slot-shaped callable. Covers both `Slot` (from useSlots) and the narrower
+// `(props) => unknown` signatures that `defineSlots<...>()` produces for typed slots.
+type SlotLike = (...args : any[]) => unknown;
+
+//----------------------------------------------------------------------------------------------------------------------
+
+export function hasRenderableContent(vnodes : VNode[]) : boolean
+{
+    return vnodes.some((vnode) =>
+    {
+        if(vnode.type === Comment) { return false; }
+
+        if(vnode.type === Text)
+        {
+            return typeof vnode.children === 'string' && vnode.children.trim().length > 0;
+        }
+
+        if(vnode.type === Fragment && Array.isArray(vnode.children))
+        {
+            return hasRenderableContent(vnode.children as VNode[]);
+        }
+
+        return true;
+    });
+}
+
+//----------------------------------------------------------------------------------------------------------------------
+
+export function hasSlotContent(slot : SlotLike | undefined, props ?: Record<string, unknown>) : boolean
+{
+    if(!slot) { return false; }
+    return hasRenderableContent(slot(props) as VNode[]);
+}
+
+//----------------------------------------------------------------------------------------------------------------------
+
+export function filterRenderableVNodes(vnodes : VNode[]) : VNode[]
+{
+    return vnodes.flatMap((vnode) =>
+    {
+        if(vnode.type === Comment) { return []; }
+
+        if(vnode.type === Text)
+        {
+            if(typeof vnode.children === 'string' && vnode.children.trim().length > 0)
+            {
+                return [ vnode ];
+            }
+            return [];
+        }
+
+        if(vnode.type === Fragment && Array.isArray(vnode.children))
+        {
+            return filterRenderableVNodes(vnode.children as VNode[]);
+        }
+
+        return [ vnode ];
+    });
+}
+
+//----------------------------------------------------------------------------------------------------------------------

package/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "http://json.schemastore.org/web-types",
   "framework": "vue",
   "name": "@skewedaspect/sleekspace-ui",
-  "version": "0.9.0",
+  "version": "0.9.1",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -2414,6 +2414,16 @@
                 "type": "number"
               },
               "default": "1"
+            },
+            {
+              "name": "showSteppers",
+              "required": false,
+              "description": "When true, renders the increment/decrement stepper buttons on the right side of the\ninput. Set to false for a plain numeric text field (users can still use arrow keys\nand type values directly).",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "true"
             }
           ],
           "source": {