@sit-onyx/headless 0.5.0-dev-20260113131929 → 0.5.0-dev-20260113162422

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 (11) hide show
  1. package/dist/composables/calendar/createCalendar.d.ts +1 -1
  2. package/dist/composables/comboBox/SelectOnlyCombobox.d.vue.ts +1 -81
  3. package/dist/composables/comboBox/TestCombobox.d.vue.ts +1 -81
  4. package/dist/composables/comboBox/createComboBox.d.ts +1 -81
  5. package/dist/composables/dataGrid/createDataGrid.d.ts +2 -2
  6. package/dist/composables/helpers/useOutsideClick.d.ts +2 -1
  7. package/dist/composables/menuButton/createMenuButton.d.ts +2 -2
  8. package/dist/composables/slider/createSlider.d.ts +2 -2
  9. package/dist/index.js +13 -7
  10. package/dist/utils/builder.d.ts +5 -4
  11. package/package.json +1 -1
package/dist/composables/calendar/createCalendar.d.ts CHANGED
@@ -33,7 +33,7 @@ export declare const _unstableCreateCalendar: (options: CreateCalendarOptions) =
33
33
  table: {
34
34
  role: string;
35
35
  onKeydown: (event: KeyboardEvent) => Promise<void>;
36
- ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null>;
36
+ ref: import('vue').WritableComputedRef<HTMLElement | null, HTMLElement | null>;
37
37
  };
38
38
  cell: import('vue').ComputedRef<(cell: {
39
39
  date: Date;
package/dist/composables/comboBox/SelectOnlyCombobox.d.vue.ts CHANGED
@@ -208,87 +208,7 @@ declare const _default: import('@vue/runtime-core').DefineComponent<{}, {
208
208
  onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
209
209
  onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
210
210
  onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
211
- ref?: import('@vue/reactivity').Ref<Element | ({
212
- $: import('@vue/runtime-core').ComponentInternalInstance;
213
- $data: {};
214
- $props: {};
215
- $attrs: {
216
- [x: string]: unknown;
217
- };
218
- $refs: {
219
- [x: string]: unknown;
220
- };
221
- $slots: Readonly<{
222
- [name: string]: import('@vue/runtime-core').Slot<any> | undefined;
223
- }>;
224
- $root: import('@vue/runtime-core').ComponentPublicInstance | null;
225
- $parent: import('@vue/runtime-core').ComponentPublicInstance | null;
226
- $host: Element | null;
227
- $emit: (event: string, ...args: any[]) => void;
228
- $el: any;
229
- $options: import('@vue/runtime-core').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import('@vue/runtime-core').ComponentProvideOptions> & {
230
- beforeCreate?: (() => void) | (() => void)[];
231
- created?: (() => void) | (() => void)[];
232
- beforeMount?: (() => void) | (() => void)[];
233
- mounted?: (() => void) | (() => void)[];
234
- beforeUpdate?: (() => void) | (() => void)[];
235
- updated?: (() => void) | (() => void)[];
236
- activated?: (() => void) | (() => void)[];
237
- deactivated?: (() => void) | (() => void)[];
238
- beforeDestroy?: (() => void) | (() => void)[];
239
- beforeUnmount?: (() => void) | (() => void)[];
240
- destroyed?: (() => void) | (() => void)[];
241
- unmounted?: (() => void) | (() => void)[];
242
- renderTracked?: ((e: import('@vue/reactivity').DebuggerEvent) => void) | ((e: import('@vue/reactivity').DebuggerEvent) => void)[];
243
- renderTriggered?: ((e: import('@vue/reactivity').DebuggerEvent) => void) | ((e: import('@vue/reactivity').DebuggerEvent) => void)[];
244
- errorCaptured?: ((err: unknown, instance: import('@vue/runtime-core').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('@vue/runtime-core').ComponentPublicInstance | null, info: string) => boolean | void)[];
245
- };
246
- $forceUpdate: () => void;
247
- $nextTick: typeof import('@vue/runtime-core').nextTick;
248
- $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('@vue/runtime-core').WatchOptions): import('@vue/reactivity').WatchStopHandle;
249
- } & Readonly<{}> & Omit<{}, never> & import('@vue/reactivity').ShallowUnwrapRef<{}> & {} & import('@vue/runtime-core').ComponentCustomProperties & {} & {
250
- $el: Element;
251
- }) | null, Element | ({
252
- $: import('@vue/runtime-core').ComponentInternalInstance;
253
- $data: {};
254
- $props: {};
255
- $attrs: {
256
- [x: string]: unknown;
257
- };
258
- $refs: {
259
- [x: string]: unknown;
260
- };
261
- $slots: Readonly<{
262
- [name: string]: import('@vue/runtime-core').Slot<any> | undefined;
263
- }>;
264
- $root: import('@vue/runtime-core').ComponentPublicInstance | null;
265
- $parent: import('@vue/runtime-core').ComponentPublicInstance | null;
266
- $host: Element | null;
267
- $emit: (event: string, ...args: any[]) => void;
268
- $el: any;
269
- $options: import('@vue/runtime-core').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import('@vue/runtime-core').ComponentProvideOptions> & {
270
- beforeCreate?: (() => void) | (() => void)[];
271
- created?: (() => void) | (() => void)[];
272
- beforeMount?: (() => void) | (() => void)[];
273
- mounted?: (() => void) | (() => void)[];
274
- beforeUpdate?: (() => void) | (() => void)[];
275
- updated?: (() => void) | (() => void)[];
276
- activated?: (() => void) | (() => void)[];
277
- deactivated?: (() => void) | (() => void)[];
278
- beforeDestroy?: (() => void) | (() => void)[];
279
- beforeUnmount?: (() => void) | (() => void)[];
280
- destroyed?: (() => void) | (() => void)[];
281
- unmounted?: (() => void) | (() => void)[];
282
- renderTracked?: ((e: import('@vue/reactivity').DebuggerEvent) => void) | ((e: import('@vue/reactivity').DebuggerEvent) => void)[];
283
- renderTriggered?: ((e: import('@vue/reactivity').DebuggerEvent) => void) | ((e: import('@vue/reactivity').DebuggerEvent) => void)[];
284
- errorCaptured?: ((err: unknown, instance: import('@vue/runtime-core').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('@vue/runtime-core').ComponentPublicInstance | null, info: string) => boolean | void)[];
285
- };
286
- $forceUpdate: () => void;
287
- $nextTick: typeof import('@vue/runtime-core').nextTick;
288
- $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('@vue/runtime-core').WatchOptions): import('@vue/reactivity').WatchStopHandle;
289
- } & Readonly<{}> & Omit<{}, never> & import('@vue/reactivity').ShallowUnwrapRef<{}> & {} & import('@vue/runtime-core').ComponentCustomProperties & {} & {
290
- $el: Element;
291
- }) | null> | undefined;
211
+ ref?: import('@vue/reactivity').Ref<import('../../index.js', { with: { "resolution-mode": "import" } }).VueTemplateRefElement<Element>, import('../../index.js', { with: { "resolution-mode": "import" } }).VueTemplateRefElement<Element>> | undefined;
292
212
  }>;
293
213
  input: import('@vue/reactivity').ComputedRef<{
294
214
  "aria-autocomplete"?: "none" | undefined;
package/dist/composables/comboBox/TestCombobox.d.vue.ts CHANGED
@@ -208,87 +208,7 @@ declare const _default: import('@vue/runtime-core').DefineComponent<{}, {
208
208
  onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
209
209
  onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
210
210
  onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
211
- ref?: import('@vue/reactivity').Ref<Element | ({
212
- $: import('@vue/runtime-core').ComponentInternalInstance;
213
- $data: {};
214
- $props: {};
215
- $attrs: {
216
- [x: string]: unknown;
217
- };
218
- $refs: {
219
- [x: string]: unknown;
220
- };
221
- $slots: Readonly<{
222
- [name: string]: import('@vue/runtime-core').Slot<any> | undefined;
223
- }>;
224
- $root: import('@vue/runtime-core').ComponentPublicInstance | null;
225
- $parent: import('@vue/runtime-core').ComponentPublicInstance | null;
226
- $host: Element | null;
227
- $emit: (event: string, ...args: any[]) => void;
228
- $el: any;
229
- $options: import('@vue/runtime-core').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import('@vue/runtime-core').ComponentProvideOptions> & {
230
- beforeCreate?: (() => void) | (() => void)[];
231
- created?: (() => void) | (() => void)[];
232
- beforeMount?: (() => void) | (() => void)[];
233
- mounted?: (() => void) | (() => void)[];
234
- beforeUpdate?: (() => void) | (() => void)[];
235
- updated?: (() => void) | (() => void)[];
236
- activated?: (() => void) | (() => void)[];
237
- deactivated?: (() => void) | (() => void)[];
238
- beforeDestroy?: (() => void) | (() => void)[];
239
- beforeUnmount?: (() => void) | (() => void)[];
240
- destroyed?: (() => void) | (() => void)[];
241
- unmounted?: (() => void) | (() => void)[];
242
- renderTracked?: ((e: import('@vue/reactivity').DebuggerEvent) => void) | ((e: import('@vue/reactivity').DebuggerEvent) => void)[];
243
- renderTriggered?: ((e: import('@vue/reactivity').DebuggerEvent) => void) | ((e: import('@vue/reactivity').DebuggerEvent) => void)[];
244
- errorCaptured?: ((err: unknown, instance: import('@vue/runtime-core').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('@vue/runtime-core').ComponentPublicInstance | null, info: string) => boolean | void)[];
245
- };
246
- $forceUpdate: () => void;
247
- $nextTick: typeof import('@vue/runtime-core').nextTick;
248
- $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('@vue/runtime-core').WatchOptions): import('@vue/reactivity').WatchStopHandle;
249
- } & Readonly<{}> & Omit<{}, never> & import('@vue/reactivity').ShallowUnwrapRef<{}> & {} & import('@vue/runtime-core').ComponentCustomProperties & {} & {
250
- $el: Element;
251
- }) | null, Element | ({
252
- $: import('@vue/runtime-core').ComponentInternalInstance;
253
- $data: {};
254
- $props: {};
255
- $attrs: {
256
- [x: string]: unknown;
257
- };
258
- $refs: {
259
- [x: string]: unknown;
260
- };
261
- $slots: Readonly<{
262
- [name: string]: import('@vue/runtime-core').Slot<any> | undefined;
263
- }>;
264
- $root: import('@vue/runtime-core').ComponentPublicInstance | null;
265
- $parent: import('@vue/runtime-core').ComponentPublicInstance | null;
266
- $host: Element | null;
267
- $emit: (event: string, ...args: any[]) => void;
268
- $el: any;
269
- $options: import('@vue/runtime-core').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import('@vue/runtime-core').ComponentProvideOptions> & {
270
- beforeCreate?: (() => void) | (() => void)[];
271
- created?: (() => void) | (() => void)[];
272
- beforeMount?: (() => void) | (() => void)[];
273
- mounted?: (() => void) | (() => void)[];
274
- beforeUpdate?: (() => void) | (() => void)[];
275
- updated?: (() => void) | (() => void)[];
276
- activated?: (() => void) | (() => void)[];
277
- deactivated?: (() => void) | (() => void)[];
278
- beforeDestroy?: (() => void) | (() => void)[];
279
- beforeUnmount?: (() => void) | (() => void)[];
280
- destroyed?: (() => void) | (() => void)[];
281
- unmounted?: (() => void) | (() => void)[];
282
- renderTracked?: ((e: import('@vue/reactivity').DebuggerEvent) => void) | ((e: import('@vue/reactivity').DebuggerEvent) => void)[];
283
- renderTriggered?: ((e: import('@vue/reactivity').DebuggerEvent) => void) | ((e: import('@vue/reactivity').DebuggerEvent) => void)[];
284
- errorCaptured?: ((err: unknown, instance: import('@vue/runtime-core').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('@vue/runtime-core').ComponentPublicInstance | null, info: string) => boolean | void)[];
285
- };
286
- $forceUpdate: () => void;
287
- $nextTick: typeof import('@vue/runtime-core').nextTick;
288
- $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('@vue/runtime-core').WatchOptions): import('@vue/reactivity').WatchStopHandle;
289
- } & Readonly<{}> & Omit<{}, never> & import('@vue/reactivity').ShallowUnwrapRef<{}> & {} & import('@vue/runtime-core').ComponentCustomProperties & {} & {
290
- $el: Element;
291
- }) | null> | undefined;
211
+ ref?: import('@vue/reactivity').Ref<import('../../index.js', { with: { "resolution-mode": "import" } }).VueTemplateRefElement<Element>, import('../../index.js', { with: { "resolution-mode": "import" } }).VueTemplateRefElement<Element>> | undefined;
292
212
  }>;
293
213
  input: import('@vue/reactivity').ComputedRef<{
294
214
  "aria-autocomplete"?: "list" | undefined;
package/dist/composables/comboBox/createComboBox.d.ts CHANGED
@@ -276,87 +276,7 @@ export declare const createComboBox: <TValue extends ListboxValue, TAutoComplete
276
276
  onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
277
277
  onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
278
278
  onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
279
- ref?: Ref<Element | ({
280
- $: import('vue').ComponentInternalInstance;
281
- $data: {};
282
- $props: {};
283
- $attrs: {
284
- [x: string]: unknown;
285
- };
286
- $refs: {
287
- [x: string]: unknown;
288
- };
289
- $slots: Readonly<{
290
- [name: string]: import('vue').Slot<any> | undefined;
291
- }>;
292
- $root: import('vue').ComponentPublicInstance | null;
293
- $parent: import('vue').ComponentPublicInstance | null;
294
- $host: Element | null;
295
- $emit: (event: string, ...args: any[]) => void;
296
- $el: any;
297
- $options: import('vue').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import('vue').ComponentProvideOptions> & {
298
- beforeCreate?: (() => void) | (() => void)[];
299
- created?: (() => void) | (() => void)[];
300
- beforeMount?: (() => void) | (() => void)[];
301
- mounted?: (() => void) | (() => void)[];
302
- beforeUpdate?: (() => void) | (() => void)[];
303
- updated?: (() => void) | (() => void)[];
304
- activated?: (() => void) | (() => void)[];
305
- deactivated?: (() => void) | (() => void)[];
306
- beforeDestroy?: (() => void) | (() => void)[];
307
- beforeUnmount?: (() => void) | (() => void)[];
308
- destroyed?: (() => void) | (() => void)[];
309
- unmounted?: (() => void) | (() => void)[];
310
- renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
311
- renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
312
- errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
313
- };
314
- $forceUpdate: () => void;
315
- $nextTick: typeof import('vue').nextTick;
316
- $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
317
- } & Readonly<{}> & Omit<{}, never> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
318
- $el: Element;
319
- }) | null, Element | ({
320
- $: import('vue').ComponentInternalInstance;
321
- $data: {};
322
- $props: {};
323
- $attrs: {
324
- [x: string]: unknown;
325
- };
326
- $refs: {
327
- [x: string]: unknown;
328
- };
329
- $slots: Readonly<{
330
- [name: string]: import('vue').Slot<any> | undefined;
331
- }>;
332
- $root: import('vue').ComponentPublicInstance | null;
333
- $parent: import('vue').ComponentPublicInstance | null;
334
- $host: Element | null;
335
- $emit: (event: string, ...args: any[]) => void;
336
- $el: any;
337
- $options: import('vue').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import('vue').ComponentProvideOptions> & {
338
- beforeCreate?: (() => void) | (() => void)[];
339
- created?: (() => void) | (() => void)[];
340
- beforeMount?: (() => void) | (() => void)[];
341
- mounted?: (() => void) | (() => void)[];
342
- beforeUpdate?: (() => void) | (() => void)[];
343
- updated?: (() => void) | (() => void)[];
344
- activated?: (() => void) | (() => void)[];
345
- deactivated?: (() => void) | (() => void)[];
346
- beforeDestroy?: (() => void) | (() => void)[];
347
- beforeUnmount?: (() => void) | (() => void)[];
348
- destroyed?: (() => void) | (() => void)[];
349
- unmounted?: (() => void) | (() => void)[];
350
- renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
351
- renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
352
- errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
353
- };
354
- $forceUpdate: () => void;
355
- $nextTick: typeof import('vue').nextTick;
356
- $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
357
- } & Readonly<{}> & Omit<{}, never> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
358
- $el: Element;
359
- }) | null> | undefined;
279
+ ref?: Ref<import('../../utils/builder.js').VueTemplateRefElement<Element>, import('../../utils/builder.js').VueTemplateRefElement<Element>> | undefined;
360
280
  }>;
361
281
  /**
362
282
  * An input that controls another element, that can dynamically pop-up to help the user set the value of the input.
package/dist/composables/dataGrid/createDataGrid.d.ts CHANGED
@@ -48,7 +48,7 @@ export declare const createDataGrid: <Lazy extends boolean = false>(options: Cre
48
48
  id: string;
49
49
  };
50
50
  table: import('vue').ComputedRef<{
51
- ref: import('../../utils/builder.js').HeadlessElRef<HTMLTableElement | null>;
51
+ ref: import('vue').WritableComputedRef<HTMLTableElement | null, HTMLTableElement | null>;
52
52
  onFocusin: (event: FocusEvent) => void;
53
53
  onKeydown: (event: KeyboardEvent) => void;
54
54
  role: string;
@@ -64,7 +64,7 @@ export declare const createDataGrid: <Lazy extends boolean = false>(options: Cre
64
64
  };
65
65
  td: import('vue').ComputedRef<({ rowId, colKey, colIndex }: TdOptions<Lazy>) => {
66
66
  tabindex: string;
67
- ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null> | undefined;
67
+ ref: import('vue').WritableComputedRef<HTMLElement | null, HTMLElement | null> | undefined;
68
68
  "data-onyx-col-key": string;
69
69
  "aria-colindex": number | undefined;
70
70
  role: string;
package/dist/composables/helpers/useOutsideClick.d.ts CHANGED
@@ -1,10 +1,11 @@
1
1
  import { MaybeRefOrGetter, Ref } from 'vue';
2
+ import { VueTemplateRefElement } from '../../utils/builder.js';
2
3
  import { Arrayable, Nullable } from '../../utils/types.js';
3
4
  export type UseOutsideClickOptions<TCheckOnTab extends boolean | undefined = undefined> = {
4
5
  /**
5
6
  * HTML element of the component where clicks should be ignored
6
7
  */
7
- inside: MaybeRefOrGetter<Arrayable<Nullable<HTMLElement>>>;
8
+ inside: MaybeRefOrGetter<Arrayable<Nullable<VueTemplateRefElement<HTMLElement>>>>;
8
9
  /**
9
10
  * Callback when an outside click occurred.
10
11
  */
package/dist/composables/menuButton/createMenuButton.d.ts CHANGED
@@ -33,7 +33,7 @@ export declare const createMenuButton: (options: CreateMenuButtonOptions) => {
33
33
  onMouseleave?: (() => void) | undefined;
34
34
  id: string;
35
35
  onKeydown: (event: KeyboardEvent) => void;
36
- ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null>;
36
+ ref: import('vue').WritableComputedRef<HTMLElement | null, HTMLElement | null>;
37
37
  }>;
38
38
  button: import('vue').ComputedRef<{
39
39
  readonly "aria-controls": string;
@@ -46,7 +46,7 @@ export declare const createMenuButton: (options: CreateMenuButtonOptions) => {
46
46
  }>;
47
47
  menu: {
48
48
  id: string;
49
- ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null>;
49
+ ref: import('vue').WritableComputedRef<HTMLElement | null, HTMLElement | null>;
50
50
  role: string;
51
51
  "aria-labelledby": string;
52
52
  onClick: () => void;
package/dist/composables/slider/createSlider.d.ts CHANGED
@@ -253,7 +253,7 @@ export declare const createSlider: <TValue extends SliderValue>(options: CreateS
253
253
  onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
254
254
  onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
255
255
  onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
256
- ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null>;
256
+ ref: import('vue').WritableComputedRef<HTMLElement | null, HTMLElement | null>;
257
257
  }>;
258
258
  /**
259
259
  * Individual thumb elements for each value (span)
@@ -466,7 +466,7 @@ export declare const createSlider: <TValue extends SliderValue>(options: CreateS
466
466
  type: string;
467
467
  step: number;
468
468
  disabled: boolean | undefined;
469
- ref: import('../../utils/builder.js').HeadlessElRef<HTMLElement | null> | undefined;
469
+ ref: import('vue').WritableComputedRef<HTMLElement | null, HTMLElement | null> | undefined;
470
470
  }>;
471
471
  /**
472
472
  * Single Mark element inside the rail
package/dist/index.js CHANGED
@@ -4,16 +4,18 @@ function createElRef() {
4
4
  const elementRef = shallowRef(null);
5
5
  return computed({
6
6
  set: (ref2) => {
7
- const element = Array.isArray(ref2) ? ref2.at(0) : ref2;
8
- if (element != null && "$el" in element) {
9
- elementRef.value = element.$el;
10
- } else {
11
- elementRef.value = element ?? null;
12
- }
7
+ const element = Array.isArray(ref2) ? ref2[0] : ref2;
8
+ elementRef.value = getNativeElement(element);
13
9
  },
14
10
  get: () => elementRef.value
15
11
  });
16
12
  }
13
+ const getNativeElement = (element) => {
14
+ if (element && typeof element === "object" && "$el" in element) {
15
+ return element.$el;
16
+ }
17
+ return element ?? null;
18
+ };
17
19
  function getISOWeekNumber(date) {
18
20
  const d = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));
19
21
  const dayNum = d.getUTCDay() || 7;
@@ -390,7 +392,10 @@ const useOutsideClick = ({
390
392
  if (!target) return true;
391
393
  const raw = toValue(inside);
392
394
  const elements = Array.isArray(raw) ? raw : [raw];
393
- return !elements.some((element) => element?.contains(target));
395
+ return !elements.some((element) => {
396
+ const nativeEl = getNativeElement(element);
397
+ return nativeEl?.contains(target);
398
+ });
394
399
  };
395
400
  const clickListener = (event) => {
396
401
  if (isOutsideClick(event.target)) onOutsideClick(event);
@@ -1424,6 +1429,7 @@ export {
1424
1429
  createToggletip,
1425
1430
  createTooltip,
1426
1431
  debounce,
1432
+ getNativeElement,
1427
1433
  isPrintableCharacter,
1428
1434
  useGlobalEventListener,
1429
1435
  useOutsideClick,
package/dist/utils/builder.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { ComponentPublicInstance, HTMLAttributes, MaybeRef, Ref, WritableComputedRef } from 'vue';
1
+ import { HTMLAttributes, MaybeRef, Ref, WritableComputedRef } from 'vue';
2
2
  import { IfDefined } from './types.js';
3
3
  type DataAttributes = {
4
4
  [name: `data-${string}`]: string | undefined;
@@ -56,9 +56,9 @@ export type HeadlessComposable<Elements extends HeadlessElements, State extends
56
56
  * ```
57
57
  */
58
58
  export declare const createBuilder: <Args extends unknown[] = unknown[], Elements extends HeadlessElements = HeadlessElements, State extends HeadlessState | undefined = undefined, Internals extends object | undefined = undefined>(builder: (...args: Args) => HeadlessComposable<Elements, State, Internals>) => (...args: Args) => HeadlessComposable<Elements, State, Internals>;
59
- type VueTemplateRefElement<E extends Element> = E | (ComponentPublicInstance & {
59
+ export type VueTemplateRefElement<E extends Element> = E | {
60
60
  $el: E;
61
- }) | null;
61
+ } | null;
62
62
  type VueTemplateRef<E extends Element> = Ref<VueTemplateRefElement<E>>;
63
63
  export declare const HeadlessElRefSymbol: unique symbol;
64
64
  export type HeadlessElRef<E extends Element | null> = WritableComputedRef<E | null> & {
@@ -85,5 +85,6 @@ export type HeadlessElRef<E extends Element | null> = WritableComputedRef<E | nu
85
85
  * });
86
86
  * ```
87
87
  */
88
- export declare function createElRef<E extends Element>(): HeadlessElRef<E | null>;
88
+ export declare function createElRef<E extends Element>(): WritableComputedRef<E | null, E | null>;
89
+ export declare const getNativeElement: <E extends Element>(element?: VueTemplateRefElement<E>) => E | null;
89
90
  export {};
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@sit-onyx/headless",
3
3
  "description": "Headless composables for Vue",
4
- "version": "0.5.0-dev-20260113131929",
4
+ "version": "0.5.0-dev-20260113162422",
5
5
  "type": "module",
6
6
  "author": "Schwarz IT KG",
7
7
  "license": "Apache-2.0",