nuance-ui 0.1.21 → 0.1.23

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.
package/dist/module.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "compatibility": {
5
5
  "nuxt": "^4.0.0"
6
6
  },
7
- "version": "0.1.21",
7
+ "version": "0.1.23",
8
8
  "builder": {
9
9
  "@nuxt/module-builder": "1.0.2",
10
10
  "unbuild": "3.6.1"
@@ -47,5 +47,5 @@ export declare const useRovingFocus: () => {
47
47
  getItems: () => HTMLElement[];
48
48
  focusElement: (element?: HTMLElement) => void;
49
49
  onItemUnmount: (element: HTMLElement | null | undefined) => void;
50
- };
50
+ } | undefined;
51
51
  export {};
@@ -1,9 +1,8 @@
1
- import { createStrictInjection } from "@nui/helpers";
2
- import { unrefElement } from "@vueuse/core";
1
+ import { createInjectionState, unrefElement } from "@vueuse/core";
3
2
  import { nextTick, ref, watch } from "vue";
4
3
  const SELECT_ATTR = "data-roving-item";
5
4
  const injectionKey = Symbol("roving-focus");
6
- const [useProvide, useState] = createStrictInjection(({ list, loop, orientation, attr = SELECT_ATTR }) => {
5
+ const [useProvide, useState] = createInjectionState(({ list, loop, orientation, attr = SELECT_ATTR }) => {
7
6
  const activeIx = ref(-1);
8
7
  const init = () => activeIx.value = 0;
9
8
  const getItems = () => Array.from(
@@ -83,8 +82,7 @@ const [useProvide, useState] = createStrictInjection(({ list, loop, orientation,
83
82
  onItemUnmount
84
83
  };
85
84
  }, {
86
- injectionKey,
87
- name: "RovingFocus"
85
+ injectionKey
88
86
  });
89
87
  export const useProvideRovingFocus = useProvide;
90
88
  export const useRovingFocus = useState;
@@ -3,14 +3,14 @@ import { unrefElement } from "@vueuse/core";
3
3
  import { computed, onBeforeUnmount, useTemplateRef } from "vue";
4
4
  import Renderless from "../renderless/renderless.vue";
5
5
  import { useRovingFocus } from "./_lib/context";
6
- const { focus, focusElement, orientation, attr, onItemUnmount } = useRovingFocus();
6
+ const { focus, focusElement, orientation, attr, onItemUnmount } = useRovingFocus() ?? {};
7
7
  const isVertical = computed(() => orientation === "vertical" || orientation === "both");
8
8
  const isHorizontal = computed(() => orientation === "horizontal" || orientation === "both");
9
- const attrs = computed(() => ({ [attr]: "" }));
9
+ const attrs = computed(() => attr ? { [attr]: "" } : {});
10
10
  const ref = useTemplateRef("item");
11
11
  onBeforeUnmount(() => {
12
12
  const el = unrefElement(ref);
13
- onItemUnmount(el);
13
+ onItemUnmount?.(el);
14
14
  });
15
15
  </script>
16
16
 
@@ -19,13 +19,13 @@ onBeforeUnmount(() => {
19
19
  v-bind='attrs'
20
20
  ref='item'
21
21
  :tabindex='-1'
22
- @keydown.up.prevent='isVertical && focus("prev", $event.currentTarget)'
23
- @keydown.down.prevent='isVertical && focus("next", $event.currentTarget)'
24
- @keydown.left.prevent='isHorizontal && focus("prev", $event.currentTarget)'
25
- @keydown.right.prevent='isHorizontal && focus("next", $event.currentTarget)'
26
- @keydown.home.prevent='focus("first")'
27
- @keydown.end.prevent='focus("last")'
28
- @click.prevent='focusElement($event.currentTarget)'
22
+ @keydown.up.prevent='isVertical && focus?.("prev", $event.currentTarget)'
23
+ @keydown.down.prevent='isVertical && focus?.("next", $event.currentTarget)'
24
+ @keydown.left.prevent='isHorizontal && focus?.("prev", $event.currentTarget)'
25
+ @keydown.right.prevent='isHorizontal && focus?.("next", $event.currentTarget)'
26
+ @keydown.home.prevent='focus?.("first")'
27
+ @keydown.end.prevent='focus?.("last")'
28
+ @click.prevent='focusElement?.($event.currentTarget)'
29
29
  >
30
30
  <slot />
31
31
  </Renderless>
@@ -1,5 +1,5 @@
1
1
  import type { Ref } from 'vue';
2
2
  export declare function useTreeItemHandlers(path: string, isFolder: Ref<boolean>, expanded: Ref<boolean>): {
3
3
  handleClick: (event: MouseEvent) => void;
4
- handleKeyDown: (event: KeyboardEvent) => void;
4
+ handleKeyDown: (event: KeyboardEvent) => any;
5
5
  };
@@ -1,5 +1,5 @@
1
1
  import type { NuanceColor } from '@nui/types';
2
- import type { AsyncData } from '#app';
2
+ import type { AsyncData, NuxtError } from '#app';
3
3
  import type { FetchError } from 'ofetch';
4
4
  export interface TreeModels {
5
5
  active: string | null;
@@ -14,7 +14,7 @@ export interface TreeEmits {
14
14
  * Required pass instance of `useFetch`/`useAsyncData` with `{ immediate: false }`
15
15
  * Root path will be queried immediate with path `/`
16
16
  */
17
- export type TreeLoader = (path: string) => AsyncData<TreeItem[], FetchError<any>>;
17
+ export type TreeLoader = (path: string) => AsyncData<TreeItem[] | undefined, FetchError<any> | NuxtError | undefined | null>;
18
18
  export type TreeItemType = 'file' | 'directory';
19
19
  export interface TreeItem {
20
20
  /** @IconifyIcon */
@@ -56,7 +56,7 @@ export declare function flatTree<T extends string = string>(tree: TreeNode<T>[])
56
56
  *
57
57
  * @template T - The type of node values
58
58
  * @param {TreeNode<T>[]} tree - The tree to search in
59
- * @param {T} value - The value of the parent node
59
+ * @param {T} path - The path of the parent node
60
60
  * @returns {T[]} Array of all descendant values (empty if node not found or has no children)
61
61
  * @example
62
62
  * const tree = [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nuance-ui",
3
- "version": "0.1.21",
3
+ "version": "0.1.23",
4
4
  "description": "A UI Library for Modern Web Apps, powered by Vue.",
5
5
  "repository": {
6
6
  "type": "git",