@sit-onyx/headless 0.5.0-dev-20260111214528 → 0.5.0-dev-20260112084701

package/dist/composables/calendar/createCalendar.d.ts

@@ -33,7 +33,7 @@ export declare const _unstableCreateCalendar: (options: CreateCalendarOptions) =
     table: {
         role: string;
         onKeydown: (event: KeyboardEvent) => Promise<void>;
-        ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement>;
+        ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null>;
     };
     cell: import('vue').ComputedRef<(cell: {
         date: Date;

package/dist/composables/dataGrid/createDataGrid.d.ts

@@ -48,7 +48,7 @@ export declare const createDataGrid: <Lazy extends boolean = false>(options: Cre
         id: string;
     };
     table: import('vue').ComputedRef<{
-        ref: import('../../utils/builder.js').HeadlessElRef<HTMLTableElement>;
+        ref: import('../../utils/builder.js').HeadlessElRef<HTMLTableElement | null>;
         onFocusin: (event: FocusEvent) => void;
         onKeydown: (event: KeyboardEvent) => void;
         role: string;
@@ -64,7 +64,7 @@ export declare const createDataGrid: <Lazy extends boolean = false>(options: Cre
     };
     td: import('vue').ComputedRef<({ rowId, colKey, colIndex }: TdOptions<Lazy>) => {
         tabindex: string;
-        ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement> | undefined;
+        ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null> | undefined;
         "data-onyx-col-key": string;
         "aria-colindex": number | undefined;
         role: string;

package/dist/composables/menuButton/createMenuButton.d.ts

@@ -33,7 +33,7 @@ export declare const createMenuButton: (options: CreateMenuButtonOptions) => {
             onMouseleave?: (() => void) | undefined;
             id: string;
             onKeydown: (event: KeyboardEvent) => void;
-            ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement>;
+            ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null>;
         }>;
         button: import('vue').ComputedRef<{
             readonly "aria-controls": string;
@@ -46,7 +46,7 @@ export declare const createMenuButton: (options: CreateMenuButtonOptions) => {
         }>;
         menu: {
             id: string;
-            ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement>;
+            ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null>;
             role: string;
             "aria-labelledby": string;
             onClick: () => void;

package/dist/composables/slider/createSlider.d.ts

@@ -256,7 +256,7 @@ export declare const _unstableCreateSlider: <TValue extends SliderValue>(options
         onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
         onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
-        ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement>;
+        ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null>;
     }>;
     /**
      * Individual thumb elements for each value (span)

package/dist/index.js

@@ -1,15 +1,14 @@
 import { shallowRef, computed, toValue, ref, watch, nextTick, reactive, onBeforeMount, watchEffect, onBeforeUnmount, unref, useId, toRef } from "vue";
 const createBuilder = (builder) => builder;
 function createElRef() {
-  const elementRef = shallowRef();
+  const elementRef = shallowRef(null);
   return computed({
-    set: (element) => {
-      if (Array.isArray(element)) {
-        elementRef.value = element.at(0);
-      } else if (element != null && "$el" in element) {
+    set: (ref2) => {
+      const element = Array.isArray(ref2) ? ref2.at(0) : ref2;
+      if (element != null && "$el" in element) {
         elementRef.value = element.$el;
       } else {
-        elementRef.value = element;
+        elementRef.value = element ?? null;
       }
     },
     get: () => elementRef.value
@@ -986,7 +985,7 @@ const _unstableCreateSlider = createBuilder(
     const draggingThumbIndex = ref();
     watch(draggingThumbIndex, (newThumbIndex) => {
       if (newThumbIndex == void 0) return;
-      Array.from(sliderRef.value.querySelectorAll('[role="slider"]')).at(newThumbIndex)?.focus();
+      Array.from(sliderRef.value?.querySelectorAll('[role="slider"]') ?? []).at(newThumbIndex)?.focus();
     });
     const shiftStep = computed(() => {
       const shiftStep2 = toValue(options.shiftStep);
@@ -1101,8 +1100,8 @@ const _unstableCreateSlider = createBuilder(
       disabled: computed(() => draggingThumbIndex.value == void 0)
     });
     const getValueFromCoordinates = (x) => {
-      const rect = sliderRef.value.getBoundingClientRect();
-      if (rect.width <= 0) return;
+      const rect = sliderRef.value?.getBoundingClientRect();
+      if (!rect || rect.width <= 0) return;
       const percent = MathUtils.clamp((x - rect.left) / rect.width, 0, 1);
       return MathUtils.percentToValue(percent, min.value, max.value);
     };

package/dist/utils/builder.d.ts

@@ -61,7 +61,7 @@ type VueTemplateRefElement<E extends Element> = E | (ComponentPublicInstance & {
 }) | null;
 type VueTemplateRef<E extends Element> = Ref<VueTemplateRefElement<E>>;
 export declare const HeadlessElRefSymbol: unique symbol;
-export type HeadlessElRef<E extends Element> = WritableComputedRef<E> & {
+export type HeadlessElRef<E extends Element | null> = WritableComputedRef<E | null> & {
     /**
      * type differentiator
      * ensures that only `createElRef` can be used for headless element ref bindings
@@ -85,5 +85,5 @@ export type HeadlessElRef<E extends Element> = WritableComputedRef<E> & {
  * });
  * ```
  */
-export declare function createElRef<E extends Element>(): HeadlessElRef<E>;
+export declare function createElRef<E extends Element>(): HeadlessElRef<E | null>;
 export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sit-onyx/headless",
   "description": "Headless composables for Vue",
-  "version": "0.5.0-dev-20260111214528",
+  "version": "0.5.0-dev-20260112084701",
   "type": "module",
   "author": "Schwarz IT KG",
   "license": "Apache-2.0",