@nubisco/ui 2.0.1 → 2.2.0

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 (36) hide show
  1. package/README.md +7 -0
  2. package/dist/components/InfoHint.d.ts +47 -0
  3. package/dist/components/InfoHint.vue.d.ts +41 -0
  4. package/dist/components/InfoHint.vue.d.ts.map +1 -0
  5. package/dist/components/UserMenu.d.ts +22 -1
  6. package/dist/components/UserMenu.vue.d.ts +5 -2
  7. package/dist/components/UserMenu.vue.d.ts.map +1 -1
  8. package/dist/components/UserMenuMark.vue.d.ts +4 -0
  9. package/dist/components/UserMenuMark.vue.d.ts.map +1 -0
  10. package/dist/components/Walkthrough.d.ts +156 -0
  11. package/dist/components/Walkthrough.vue.d.ts +66 -0
  12. package/dist/components/Walkthrough.vue.d.ts.map +1 -0
  13. package/dist/components/index.d.ts.map +1 -1
  14. package/dist/composables/useReducedMotion.composable.d.ts +13 -0
  15. package/dist/composables/useReducedMotion.composable.d.ts.map +1 -0
  16. package/dist/composables/useWalkthrough.composable.d.ts +19 -0
  17. package/dist/composables/useWalkthrough.composable.d.ts.map +1 -0
  18. package/dist/directives/TourStep.directive.d.ts +4 -0
  19. package/dist/directives/TourStep.directive.d.ts.map +1 -0
  20. package/dist/global.d.ts +6 -0
  21. package/dist/index.cjs +9 -9
  22. package/dist/index.mjs +10352 -9289
  23. package/dist/main.d.ts +10 -1
  24. package/dist/main.d.ts.map +1 -1
  25. package/dist/ui.css +1 -1
  26. package/dist/utils/anchorPosition.helper.d.ts +50 -0
  27. package/dist/utils/anchorPosition.helper.d.ts.map +1 -0
  28. package/dist/utils/tourTarget.helper.d.ts +19 -0
  29. package/dist/utils/tourTarget.helper.d.ts.map +1 -0
  30. package/dist/utils/walkthroughStorage.helper.d.ts +22 -0
  31. package/dist/utils/walkthroughStorage.helper.d.ts.map +1 -0
  32. package/package.json +1 -1
  33. package/src/styles/_theme.scss +26 -0
  34. package/src/utils/anchorPosition.helper.ts +164 -0
  35. package/src/utils/tourTarget.helper.ts +71 -0
  36. package/src/utils/walkthroughStorage.helper.ts +83 -0
package/README.md CHANGED
@@ -210,6 +210,13 @@ Most component libraries impose styling opinions that are hard to override. Nubi
210
210
  | :-------- | :-------------------------------------------------------- |
211
211
  | `NbTabs` | Tab bar with optional panels, line and contained variants |
212
212
 
213
+ ### Onboarding
214
+
215
+ | Component | Description |
216
+ | :-------------- | :-------------------------------------------------------------------------------- |
217
+ | `NbInfoHint` | Discreet info affordance revealing a description on hover, focus or tap |
218
+ | `NbWalkthrough` | Guided product tour: spotlight, coach-mark popover, versioned per-user completion |
219
+
213
220
  ---
214
221
 
215
222
  ## Grid System
@@ -0,0 +1,47 @@
1
+ import type { TAnchorSide } from '../utils/anchorPosition.helper'
2
+
3
+ /**
4
+ * Side the hint popover prefers. It is a preference, not a guarantee: the
5
+ * popover flips and clamps itself to stay inside the viewport.
6
+ */
7
+ type TInfoHintPlacement = `${TAnchorSide}`
8
+
9
+ interface IInfoHintProps {
10
+ /**
11
+ * Plain-text description. Ignored when the default slot is used, which is
12
+ * the escape hatch for rich content (lists, formulas, inline code).
13
+ */
14
+ text?: string
15
+ /** Optional bold heading above the body. */
16
+ title?: string
17
+ /**
18
+ * Glossary / documentation identifier for the concept being explained. The
19
+ * library never resolves it — it is echoed back on the `activate` event and
20
+ * mirrored to `data-term`, so an app can map it to a central glossary or
21
+ * deep-link into its docs without the component knowing anything about
22
+ * either.
23
+ */
24
+ term?: string
25
+ /** Preferred popover side. Flipped automatically when it does not fit. */
26
+ placement?: TInfoHintPlacement
27
+ /** Icon size in pixels, matching NbIcon's numeric `size`. */
28
+ size?: number
29
+ /** Any icon name NbIcon accepts. Defaults to the Phosphor `info` glyph. */
30
+ icon?: string
31
+ /**
32
+ * Accessible name for the trigger button. Override it when the hint sits
33
+ * next to an ambiguous value so screen-reader users hear what it explains,
34
+ * e.g. `label="About the archived status"`.
35
+ */
36
+ label?: string
37
+ /** Delay in ms before a hover opens the popover. */
38
+ openDelay?: number
39
+ /** Delay in ms before leaving the trigger closes the popover. */
40
+ closeDelay?: number
41
+ /** Teleport target for the popover. */
42
+ teleportTo?: string
43
+ /** Renders the icon inert and suppresses the popover. */
44
+ disabled?: boolean
45
+ }
46
+
47
+ export type { TInfoHintPlacement, IInfoHintProps }
@@ -0,0 +1,41 @@
1
+ import type { IInfoHintProps } from './InfoHint.d';
2
+ declare function open(): void;
3
+ declare function close(): void;
4
+ declare var __VLS_12: {};
5
+ type __VLS_Slots = {} & {
6
+ default?: (props: typeof __VLS_12) => any;
7
+ };
8
+ declare const __VLS_base: import("vue").DefineComponent<IInfoHintProps, {
9
+ open: typeof open;
10
+ close: typeof close;
11
+ isOpen: import("vue").Ref<boolean, boolean>;
12
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
13
+ close: () => any;
14
+ open: () => any;
15
+ activate: (term: string | undefined) => any;
16
+ }, string, import("vue").PublicProps, Readonly<IInfoHintProps> & Readonly<{
17
+ onClose?: (() => any) | undefined;
18
+ onOpen?: (() => any) | undefined;
19
+ onActivate?: ((term: string | undefined) => any) | undefined;
20
+ }>, {
21
+ size: number;
22
+ label: string;
23
+ title: string;
24
+ text: string;
25
+ icon: string;
26
+ disabled: boolean;
27
+ term: string;
28
+ placement: import("./InfoHint.d").TInfoHintPlacement;
29
+ openDelay: number;
30
+ closeDelay: number;
31
+ teleportTo: string;
32
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
33
+ declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
34
+ declare const _default: typeof __VLS_export;
35
+ export default _default;
36
+ type __VLS_WithSlots<T, S> = T & {
37
+ new (): {
38
+ $slots: S;
39
+ };
40
+ };
41
+ //# sourceMappingURL=InfoHint.vue.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"InfoHint.vue.d.ts","sourceRoot":"","sources":["../../src/components/InfoHint.vue"],"names":[],"mappings":"AA0bA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAyFlD,iBAAS,IAAI,SAWZ;AAED,iBAAS,KAAK,SAMb;AA+PD,QAAA,IAAI,QAAQ,IAAY,CAAE;AAC1B,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAQhD,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;6EAKd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
@@ -16,6 +16,15 @@ interface IUserMenuAccount {
16
16
 
17
17
  type TUserMenuPlacement = 'right-end' | 'top-start'
18
18
 
19
+ /**
20
+ * How the menu signs itself as a Nubisco Platform product.
21
+ *
22
+ * A union rather than a boolean because a third mode, `'hub'` (the same
23
+ * lockup, but a real link to the Nubisco Platform product page), lands once
24
+ * that page exists.
25
+ */
26
+ type TUserMenuBrand = 'footer' | 'none'
27
+
19
28
  interface IUserMenuProps {
20
29
  /** The identity the product is signed in as (header of the menu). */
21
30
  user: IUserMenuUser
@@ -35,9 +44,21 @@ interface IUserMenuProps {
35
44
  showAccountActions?: boolean
36
45
  /** Hide the Profile entry when the product has no profile page. */
37
46
  showProfile?: boolean
47
+ /**
48
+ * The Nubisco Platform lockup at the foot of the panel. `'footer'` renders a
49
+ * non-interactive signature; `'none'` renders nothing, for white-label
50
+ * deployments and for hosts that are not Nubisco products.
51
+ */
52
+ brand?: TUserMenuBrand
38
53
  /** Where the panel opens relative to the trigger. */
39
54
  placement?: TUserMenuPlacement
40
55
  disabled?: boolean
41
56
  }
42
57
 
43
- export { IUserMenuUser, IUserMenuAccount, TUserMenuPlacement, IUserMenuProps }
58
+ export {
59
+ IUserMenuUser,
60
+ IUserMenuAccount,
61
+ TUserMenuPlacement,
62
+ TUserMenuBrand,
63
+ IUserMenuProps,
64
+ }
@@ -6,11 +6,13 @@ declare var __VLS_1: {
6
6
  toggle: typeof toggle;
7
7
  }, __VLS_37: {
8
8
  close: typeof close;
9
- };
9
+ }, __VLS_49: {};
10
10
  type __VLS_Slots = {} & {
11
11
  trigger?: (props: typeof __VLS_1) => any;
12
12
  } & {
13
13
  default?: (props: typeof __VLS_37) => any;
14
+ } & {
15
+ brand?: (props: typeof __VLS_49) => any;
14
16
  };
15
17
  declare const __VLS_base: import("vue").DefineComponent<IUserMenuProps, {
16
18
  open: import("vue").Ref<boolean, boolean>;
@@ -36,11 +38,12 @@ declare const __VLS_base: import("vue").DefineComponent<IUserMenuProps, {
36
38
  "onSign-out"?: (() => any) | undefined;
37
39
  }>, {
38
40
  disabled: boolean;
41
+ placement: import("./UserMenu.d").TUserMenuPlacement;
39
42
  accounts: IUserMenuAccount[];
40
43
  accountsUnknown: boolean;
41
44
  showAccountActions: boolean;
42
45
  showProfile: boolean;
43
- placement: import("./UserMenu.d").TUserMenuPlacement;
46
+ brand: import("./UserMenu.d").TUserMenuBrand;
44
47
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
45
48
  declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
46
49
  declare const _default: typeof __VLS_export;
@@ -1 +1 @@
1
- {"version":3,"file":"UserMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/UserMenu.vue"],"names":[],"mappings":"AA8bA,OAAO,KAAK,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAiGpE,iBAAS,MAAM,SASd;AAED,iBAAS,KAAK,SAIb;AAmWD,QAAA,IAAI,OAAO;;;CAAU,EAAE,QAAQ;;CAAY,CAAE;AAC7C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAQhD,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6EAKd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
1
+ {"version":3,"file":"UserMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/UserMenu.vue"],"names":[],"mappings":"AAufA,OAAO,KAAK,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAiHpE,iBAAS,MAAM,SASd;AAED,iBAAS,KAAK,SAIb;AAwYD,QAAA,IAAI,OAAO;;;CAAU,EAAE,QAAQ;;CAAW,EAAE,QAAQ,IAAY,CAAE;AAClE,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC7C;IAAE,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAQ9C,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6EAKd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
@@ -0,0 +1,4 @@
1
+ declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
2
+ declare const _default: typeof __VLS_export;
3
+ export default _default;
4
+ //# sourceMappingURL=UserMenuMark.vue.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"UserMenuMark.vue.d.ts","sourceRoot":"","sources":["../../src/components/UserMenuMark.vue"],"names":[],"mappings":"AA2jBA,QAAA,MAAM,YAAY,+QAChB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
@@ -0,0 +1,156 @@
1
+ import type { ComputedRef, Ref } from 'vue'
2
+ import type { TAnchorSide } from '../utils/anchorPosition.helper'
3
+
4
+ /**
5
+ * Preferred side for the step popover. `auto` lets the placement algorithm
6
+ * pick, which is the sane default for targets whose position depends on
7
+ * viewport size (a sidebar that collapses, a toolbar that wraps).
8
+ */
9
+ type TWalkthroughPlacement = `${TAnchorSide}` | 'auto'
10
+
11
+ /** How a run ended. Recorded alongside the version in storage. */
12
+ type TWalkthroughOutcome = 'finish' | 'skip'
13
+
14
+ /**
15
+ * Anything that can resolve to the element a step points at.
16
+ *
17
+ * A bare string is looked up as a tour-step id first (`v-nb-tour-step` /
18
+ * `data-nb-tour-step`) and only then as a CSS selector, so the stable-id
19
+ * convention wins over brittle structural selectors without needing a
20
+ * separate prop.
21
+ */
22
+ type TWalkthroughTarget =
23
+ | string
24
+ | HTMLElement
25
+ | (() => HTMLElement | null | undefined)
26
+ | Ref<HTMLElement | null | undefined>
27
+
28
+ interface IWalkthroughStep {
29
+ /**
30
+ * Element to spotlight. Omit it for an intro or outro step: the popover is
31
+ * then centred on the viewport with no cut-out.
32
+ */
33
+ target?: TWalkthroughTarget
34
+ title?: string
35
+ /** Plain-text body. The component's `step` slot overrides it for rich content. */
36
+ body?: string
37
+ placement?: TWalkthroughPlacement
38
+ /** Extra pixels of breathing room between the target and the cut-out edge. */
39
+ padding?: number
40
+ /** Optional stable identifier, echoed on `step-change` for analytics. */
41
+ id?: string
42
+ }
43
+
44
+ interface IWalkthrough {
45
+ /** Stable identifier for this tour. Used as the storage key. */
46
+ id: string
47
+ /**
48
+ * Bump when the tour's content changes materially. A user who completed
49
+ * version 1 is shown version 2 again; a user who completed version 2 is not.
50
+ */
51
+ version: number
52
+ steps: IWalkthroughStep[]
53
+ }
54
+
55
+ interface IWalkthroughRecord {
56
+ version: number
57
+ outcome: TWalkthroughOutcome
58
+ /** ISO-8601 timestamp. */
59
+ completedAt: string
60
+ }
61
+
62
+ /**
63
+ * Persistence seam. The default implementation is localStorage-backed; an app
64
+ * can hand in one that talks to its own API without changing a single call
65
+ * site, which is the point of keeping reads async-tolerant.
66
+ */
67
+ interface IWalkthroughStorage {
68
+ get(
69
+ id: string,
70
+ ): IWalkthroughRecord | null | Promise<IWalkthroughRecord | null>
71
+ set(id: string, record: IWalkthroughRecord): void | Promise<void>
72
+ remove(id: string): void | Promise<void>
73
+ }
74
+
75
+ interface IWalkthroughOptions {
76
+ storage?: IWalkthroughStorage
77
+ /** Callbacks mirror the component's events, for imperative (non-template) use. */
78
+ onFinish?: (walkthrough: IWalkthrough) => void
79
+ onSkip?: (walkthrough: IWalkthrough, stepIndex: number) => void
80
+ onStepChange?: (step: IWalkthroughStep, index: number) => void
81
+ }
82
+
83
+ interface IWalkthroughController {
84
+ active: Ref<boolean>
85
+ stepIndex: Ref<number>
86
+ step: ComputedRef<IWalkthroughStep | undefined>
87
+ steps: ComputedRef<IWalkthroughStep[]>
88
+ stepCount: ComputedRef<number>
89
+ isFirst: ComputedRef<boolean>
90
+ isLast: ComputedRef<boolean>
91
+ walkthrough: ComputedRef<IWalkthrough>
92
+ /** Start at step 0 regardless of stored completion. */
93
+ start: () => void
94
+ /** Clear the stored record, then start. Use from a "replay the tour" menu item. */
95
+ restart: () => Promise<void>
96
+ next: () => void
97
+ back: () => void
98
+ goTo: (index: number) => void
99
+ /** End the run as completed and persist it. */
100
+ finish: () => Promise<void>
101
+ /** End the run as skipped and persist it. */
102
+ skip: () => Promise<void>
103
+ /** Start only when no record exists for the current version. */
104
+ maybeAutoStart: () => Promise<boolean>
105
+ /** True when a stored record covers the current version or newer. */
106
+ isCompleted: () => Promise<boolean>
107
+ /** Forget the stored record without starting. */
108
+ reset: () => Promise<void>
109
+ }
110
+
111
+ interface IWalkthroughLabels {
112
+ back: string
113
+ next: string
114
+ skip: string
115
+ done: string
116
+ /** Progress line. Receives the 1-based step number and the total. */
117
+ progress: (current: number, total: number) => string
118
+ /** Accessible name for the overlay dialog. */
119
+ dialog: string
120
+ }
121
+
122
+ interface IWalkthroughProps {
123
+ /** The tour definition. Required unless a `controller` is supplied. */
124
+ walkthrough?: IWalkthrough
125
+ /**
126
+ * A controller from `useWalkthrough()`. Pass one when the tour must be
127
+ * started from outside the template (a help menu, a router guard); omit it
128
+ * and the component creates its own.
129
+ */
130
+ controller?: IWalkthroughController
131
+ /** Run `maybeAutoStart()` on mount. Ignored when `controller` is provided. */
132
+ autoStart?: boolean
133
+ /** Storage adapter. Ignored when `controller` is provided. */
134
+ storage?: IWalkthroughStorage
135
+ /** Partial label overrides, for localisation. */
136
+ labels?: Partial<IWalkthroughLabels>
137
+ teleportTo?: string
138
+ /** Clicking the dimmed area skips the tour. Off by default: too easy to hit by accident. */
139
+ closeOnScrim?: boolean
140
+ /** Default cut-out padding, overridable per step. */
141
+ padding?: number
142
+ }
143
+
144
+ export type {
145
+ TWalkthroughPlacement,
146
+ TWalkthroughOutcome,
147
+ TWalkthroughTarget,
148
+ IWalkthroughStep,
149
+ IWalkthrough,
150
+ IWalkthroughRecord,
151
+ IWalkthroughStorage,
152
+ IWalkthroughOptions,
153
+ IWalkthroughController,
154
+ IWalkthroughLabels,
155
+ IWalkthroughProps,
156
+ }
@@ -0,0 +1,66 @@
1
+ import type { IWalkthrough, IWalkthroughLabels, IWalkthroughProps, IWalkthroughStep } from './Walkthrough.d';
2
+ declare function onNext(): void;
3
+ declare function onBack(): void;
4
+ declare function handleFinish(): Promise<void>;
5
+ declare function onSkip(): Promise<void>;
6
+ declare var __VLS_7: {
7
+ step: IWalkthroughStep | undefined;
8
+ index: number;
9
+ total: number;
10
+ }, __VLS_9: {
11
+ step: IWalkthroughStep | undefined;
12
+ index: number;
13
+ total: number;
14
+ }, __VLS_11: {
15
+ step: IWalkthroughStep | undefined;
16
+ index: number;
17
+ total: number;
18
+ back: typeof onBack;
19
+ next: typeof onNext;
20
+ skip: typeof onSkip;
21
+ };
22
+ type __VLS_Slots = {} & {
23
+ header?: (props: typeof __VLS_7) => any;
24
+ } & {
25
+ step?: (props: typeof __VLS_9) => any;
26
+ } & {
27
+ actions?: (props: typeof __VLS_11) => any;
28
+ };
29
+ declare const __VLS_base: import("vue").DefineComponent<IWalkthroughProps, {
30
+ start: () => void;
31
+ restart: () => Promise<void>;
32
+ next: () => void;
33
+ back: () => void;
34
+ skip: typeof onSkip;
35
+ finish: typeof handleFinish;
36
+ goTo: (index: number) => void;
37
+ active: import("vue").Ref<boolean, boolean>;
38
+ stepIndex: import("vue").Ref<number, number>;
39
+ controller: import("./Walkthrough.d").IWalkthroughController;
40
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
41
+ finish: (walkthrough: IWalkthrough) => any;
42
+ skip: (walkthrough: IWalkthrough, index: number) => any;
43
+ "step-change": (step: IWalkthroughStep, index: number) => any;
44
+ }, string, import("vue").PublicProps, Readonly<IWalkthroughProps> & Readonly<{
45
+ onFinish?: ((walkthrough: IWalkthrough) => any) | undefined;
46
+ onSkip?: ((walkthrough: IWalkthrough, index: number) => any) | undefined;
47
+ "onStep-change"?: ((step: IWalkthroughStep, index: number) => any) | undefined;
48
+ }>, {
49
+ autoStart: boolean;
50
+ storage: import("./Walkthrough.d").IWalkthroughStorage;
51
+ teleportTo: string;
52
+ labels: Partial<IWalkthroughLabels>;
53
+ walkthrough: IWalkthrough;
54
+ controller: import("./Walkthrough.d").IWalkthroughController;
55
+ closeOnScrim: boolean;
56
+ padding: number;
57
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
58
+ declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
59
+ declare const _default: typeof __VLS_export;
60
+ export default _default;
61
+ type __VLS_WithSlots<T, S> = T & {
62
+ new (): {
63
+ $slots: S;
64
+ };
65
+ };
66
+ //# sourceMappingURL=Walkthrough.vue.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Walkthrough.vue.d.ts","sourceRoot":"","sources":["../../src/components/Walkthrough.vue"],"names":[],"mappings":"AAyrBA,OAAO,KAAK,EACV,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EACjB,MAAM,iBAAiB,CAAA;AAiRxB,iBAAS,MAAM,SAOd;AAED,iBAAS,MAAM,SAGd;AAED,iBAAe,YAAY,kBAI1B;AAED,iBAAe,MAAM,kBAKpB;AAkWD,QAAA,IAAI,OAAO;;;;CAAU,EAAE,OAAO;;;;CAAU,EAAE,QAAQ;;;;;;;CAAY,CAAE;AAChE,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC3C;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GACzC;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAOhD,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;6EAKd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;;iBAoIf,GAAG;;AADlB,wBAMC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;;iBAwIf,GAAG;;AADlB,wBAMC"}
@@ -0,0 +1,13 @@
1
+ /**
2
+ * Reactive `prefers-reduced-motion` state.
3
+ *
4
+ * CSS media queries cover styling, but the walkthrough also has to choose a
5
+ * `scrollIntoView` behaviour and decide whether to animate the spotlight
6
+ * between targets, and those are script decisions. Reading the preference
7
+ * reactively (rather than once at setup) matters because the user can flip
8
+ * the OS setting while a tour is running.
9
+ */
10
+ export declare function useReducedMotion(): Readonly<import("vue").Ref<boolean, boolean>>;
11
+ /** One-shot check for code paths outside a reactive scope. */
12
+ export declare function prefersReducedMotion(): boolean;
13
+ //# sourceMappingURL=useReducedMotion.composable.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useReducedMotion.composable.d.ts","sourceRoot":"","sources":["../../src/composables/useReducedMotion.composable.ts"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,kDAyB/B;AAED,8DAA8D;AAC9D,wBAAgB,oBAAoB,IAAI,OAAO,CAI9C"}
@@ -0,0 +1,19 @@
1
+ import { type MaybeRefOrGetter } from 'vue';
2
+ import type { IWalkthrough, IWalkthroughController, IWalkthroughOptions } from '../components/Walkthrough.d';
3
+ /**
4
+ * The walkthrough state machine, with no rendering attached.
5
+ *
6
+ * Splitting it from `<NbWalkthrough>` is what makes a tour startable from
7
+ * places that have no template of their own — a help menu handler, a router
8
+ * guard, an onboarding checklist — and makes the interesting behaviour
9
+ * (version-gated auto-start, step advancement, persistence) testable without
10
+ * mounting anything.
11
+ *
12
+ * @example
13
+ * const tour = useWalkthrough(introTour)
14
+ * onMounted(() => tour.maybeAutoStart())
15
+ * // …later, from a "Show me around" menu item:
16
+ * tour.restart()
17
+ */
18
+ export declare function useWalkthrough(source: MaybeRefOrGetter<IWalkthrough>, options?: IWalkthroughOptions): IWalkthroughController;
19
+ //# sourceMappingURL=useWalkthrough.composable.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useWalkthrough.composable.d.ts","sourceRoot":"","sources":["../../src/composables/useWalkthrough.composable.ts"],"names":[],"mappings":"AAAA,OAAO,EAA0B,KAAK,gBAAgB,EAAE,MAAM,KAAK,CAAA;AACnE,OAAO,KAAK,EACV,YAAY,EACZ,sBAAsB,EACtB,mBAAmB,EAGpB,MAAM,4BAA4B,CAAA;AAKnC;;;;;;;;;;;;;;GAcG;AAEH,wBAAgB,cAAc,CAC5B,MAAM,EAAE,gBAAgB,CAAC,YAAY,CAAC,EACtC,OAAO,GAAE,mBAAwB,GAChC,sBAAsB,CAuHxB"}
@@ -0,0 +1,4 @@
1
+ import type { App } from 'vue';
2
+ declare const tourStepDirective: (app: App) => void;
3
+ export default tourStepDirective;
4
+ //# sourceMappingURL=TourStep.directive.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TourStep.directive.d.ts","sourceRoot":"","sources":["../../src/directives/TourStep.directive.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAoB,MAAM,KAAK,CAAA;AAoBhD,QAAA,MAAM,iBAAiB,GAAI,KAAK,GAAG,SAQlC,CAAA;AAED,eAAe,iBAAiB,CAAA"}
package/dist/global.d.ts CHANGED
@@ -29,6 +29,7 @@ import GanttChart from './components/Charts/GanttChart.vue'
29
29
  import Grid from './components/Grid.vue'
30
30
  import Icon from './components/Icon.vue'
31
31
  import ImageCropper from './components/ImageCropper.vue'
32
+ import InfoHint from './components/InfoHint.vue'
32
33
  import InterpolationChart from './components/Charts/InterpolationChart.vue'
33
34
  import JsonTree from './components/JsonTree.vue'
34
35
  import Label from './components/Label.vue'
@@ -66,6 +67,8 @@ import Toast from './components/Toast.vue'
66
67
  import Tree from './components/Tree.vue'
67
68
  import TreeNode from './components/TreeNode.vue'
68
69
  import UserMenu from './components/UserMenu.vue'
70
+ import UserMenuMark from './components/UserMenuMark.vue'
71
+ import Walkthrough from './components/Walkthrough.vue'
69
72
 
70
73
  declare module 'vue' {
71
74
  interface GlobalComponents {
@@ -98,6 +101,7 @@ declare module 'vue' {
98
101
  NbGrid: typeof Grid
99
102
  NbIcon: typeof Icon
100
103
  NbImageCropper: typeof ImageCropper
104
+ NbInfoHint: typeof InfoHint
101
105
  NbInterpolationChart: typeof InterpolationChart
102
106
  NbJsonTree: typeof JsonTree
103
107
  NbLabel: typeof Label
@@ -135,6 +139,8 @@ declare module 'vue' {
135
139
  NbTree: typeof Tree
136
140
  NbTreeNode: typeof TreeNode
137
141
  NbUserMenu: typeof UserMenu
142
+ NbUserMenuMark: typeof UserMenuMark
143
+ NbWalkthrough: typeof Walkthrough
138
144
  }
139
145
  }
140
146