@ulu/frontend-vue 0.6.31 → 0.6.33

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.
@@ -1 +1 @@
1
- {"version":3,"file":"UluTourDisplay.vue.d.ts","sourceRoot":"","sources":["../../../lib/plugins/tour/UluTourDisplay.vue"],"names":[],"mappings":"AAmEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oCA6hBklS,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBAjW/nS,KAAK"}
1
+ {"version":3,"file":"UluTourDisplay.vue.d.ts","sourceRoot":"","sources":["../../../lib/plugins/tour/UluTourDisplay.vue"],"names":[],"mappings":"AA8EA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oCA8jByqQ,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBAvXttQ,KAAK"}
@@ -1,37 +1,37 @@
1
- import { computed as p, ref as f, watch as S, nextTick as T, onMounted as b, onUnmounted as L, createBlock as l, openBlock as o, Teleport as F, createElementBlock as y, createCommentVNode as x, unref as v, Fragment as I, resolveDynamicComponent as g, mergeProps as s, createSlots as $, withCtx as c, normalizeProps as k, createVNode as w, normalizeStyle as R } from "vue";
2
- import V from "../../components/collapsible/UluModal.vue.js";
3
- import D from "../popovers/UluPopoverBase.vue.js";
4
- import P from "./UluTourPager.vue.js";
1
+ import { computed as v, ref as f, watch as B, nextTick as T, onMounted as b, onUnmounted as z, createBlock as a, openBlock as o, Teleport as L, createElementBlock as y, createCommentVNode as x, unref as l, Fragment as F, resolveDynamicComponent as g, mergeProps as d, createSlots as $, withCtx as c, createVNode as k, normalizeStyle as I } from "vue";
2
+ import R from "../../components/collapsible/UluModal.vue.js";
3
+ import V from "../popovers/UluPopoverBase.vue.js";
4
+ import w from "./UluTourPager.vue.js";
5
5
  import _ from "./UluTourContent.vue.js";
6
- import { useTour as M } from "./useTour.js";
7
- const H = {
6
+ import { useTour as D } from "./useTour.js";
7
+ const G = {
8
8
  __name: "UluTourDisplay",
9
- setup(N) {
10
- const { api: d, state: u } = M(), t = p(() => u.active?.steps[u.stepIndex]), a = f(null), m = f(null), C = p(() => ({
9
+ setup(M) {
10
+ const { api: u, state: r } = D(), t = v(() => r.active?.steps[r.stepIndex]), i = f(null), m = f(null), C = v(() => ({
11
11
  placement: t.value?.placement || "bottom",
12
12
  arrow: !0,
13
13
  offset: 8
14
- })), E = p(() => ({
15
- ...u.active?.modalProps || {},
14
+ })), P = v(() => ({
15
+ ...r.active?.modalProps || {},
16
16
  ...t.value?.modalProps || {}
17
- })), z = p(() => ({
17
+ })), S = v(() => ({
18
18
  modifiers: "large",
19
- ...u.active?.popoverProps || {},
19
+ ...r.active?.popoverProps || {},
20
20
  ...t.value?.popoverProps || {}
21
- })), r = f(null), i = () => {
22
- if (a.value) {
23
- const e = a.value.getBoundingClientRect();
24
- r.value = {
21
+ })), p = f(null), s = () => {
22
+ if (i.value) {
23
+ const e = i.value.getBoundingClientRect();
24
+ p.value = {
25
25
  top: e.top,
26
26
  left: e.left,
27
27
  width: e.width,
28
28
  height: e.height
29
29
  };
30
30
  } else
31
- r.value = null;
32
- }, B = p(() => {
33
- if (!r.value) return {};
34
- const e = r.value;
31
+ p.value = null;
32
+ }, E = v(() => {
33
+ if (!p.value) return {};
34
+ const e = p.value;
35
35
  return {
36
36
  position: "fixed",
37
37
  top: 0,
@@ -56,35 +56,44 @@ const H = {
56
56
  )`
57
57
  };
58
58
  });
59
- return S(t, async (e) => {
59
+ return B(t, async (e) => {
60
60
  if (e?.target) {
61
61
  await T();
62
62
  const n = document.querySelector(e.target);
63
- n ? (a.value = n, m.value && m.value.update(), e.highlight && i()) : console.warn(`Tour target not found: ${e.target}`);
63
+ n ? (i.value = n, m.value && m.value.update(), e.highlight && s()) : console.warn(`Tour target not found: ${e.target}`);
64
64
  } else
65
- a.value = null, r.value = null;
65
+ i.value = null, p.value = null;
66
66
  }, { immediate: !0 }), b(() => {
67
- window.addEventListener("resize", i), window.addEventListener("scroll", i);
68
- }), L(() => {
69
- window.removeEventListener("resize", i), window.removeEventListener("scroll", i);
70
- }), (e, n) => (o(), l(F, { to: "body" }, [
71
- v(u).active ? (o(), y(I, { key: 0 }, [
72
- t.value?.component ? (o(), l(g(t.value.component), s({
67
+ window.addEventListener("resize", s), window.addEventListener("scroll", s);
68
+ }), z(() => {
69
+ window.removeEventListener("resize", s), window.removeEventListener("scroll", s);
70
+ }), (e, n) => (o(), a(L, { to: "body" }, [
71
+ l(r).active ? (o(), y(F, { key: 0 }, [
72
+ t.value?.component ? (o(), a(g(t.value.component), d({
73
73
  key: 0,
74
- "data-ulu-tour-ui": "true"
75
- }, t.value.componentProps), null, 16)) : t.value?.target ? (o(), l(D, s({
74
+ "data-ulu-tour-ui": "true",
75
+ step: t.value,
76
+ tourState: l(r),
77
+ api: l(u)
78
+ }, t.value.componentProps), null, 16, ["step", "tourState", "api"])) : t.value?.target ? (o(), a(V, d({
76
79
  key: 2,
77
80
  ref_key: "popoverBase",
78
81
  ref: m,
79
- trigger: a.value,
82
+ trigger: i.value,
80
83
  config: C.value,
81
84
  style: { zIndex: 9999 },
82
85
  isOpen: !0,
83
86
  "data-ulu-tour-ui": "true",
84
- onClose: n[1] || (n[1] = (h) => v(d).stop())
85
- }, z.value), $({
87
+ onClose: n[1] || (n[1] = (h) => l(u).stop())
88
+ }, S.value), $({
86
89
  default: c(() => [
87
- t.value?.contentComponent ? (o(), l(g(t.value.contentComponent), k(s({ key: 0 }, t.value.componentProps)), null, 16)) : (o(), l(_, {
90
+ t.value?.contentComponent ? (o(), a(g(t.value.contentComponent), d({
91
+ key: 0,
92
+ step: t.value,
93
+ tourState: l(r),
94
+ api: l(u),
95
+ "is-modal": !1
96
+ }, t.value.componentProps), null, 16, ["step", "tourState", "api"])) : (o(), a(_, {
88
97
  key: 1,
89
98
  step: t.value,
90
99
  "is-modal": !1
@@ -95,19 +104,25 @@ const H = {
95
104
  t.value?.hideFooter ? void 0 : {
96
105
  name: "footer",
97
106
  fn: c(() => [
98
- w(P)
107
+ k(w)
99
108
  ]),
100
109
  key: "0"
101
110
  }
102
- ]), 1040, ["trigger", "config"])) : (o(), l(V, s({
111
+ ]), 1040, ["trigger", "config"])) : (o(), a(R, d({
103
112
  key: 1,
104
113
  modelValue: !0,
105
114
  "data-ulu-tour-ui": "true"
106
- }, E.value, {
107
- onClose: n[0] || (n[0] = (h) => v(d).stop())
115
+ }, P.value, {
116
+ onClose: n[0] || (n[0] = (h) => l(u).stop())
108
117
  }), $({
109
118
  default: c(() => [
110
- t.value?.contentComponent ? (o(), l(g(t.value.contentComponent), k(s({ key: 0 }, t.value.componentProps)), null, 16)) : (o(), l(_, {
119
+ t.value?.contentComponent ? (o(), a(g(t.value.contentComponent), d({
120
+ key: 0,
121
+ step: t.value,
122
+ tourState: l(r),
123
+ api: l(u),
124
+ "is-modal": !0
125
+ }, t.value.componentProps), null, 16, ["step", "tourState", "api"])) : (o(), a(_, {
111
126
  key: 1,
112
127
  step: t.value,
113
128
  "is-modal": !0
@@ -118,22 +133,22 @@ const H = {
118
133
  t.value?.hideFooter ? void 0 : {
119
134
  name: "footer",
120
135
  fn: c(() => [
121
- w(P)
136
+ k(w)
122
137
  ]),
123
138
  key: "0"
124
139
  }
125
140
  ]), 1040)),
126
- t.value?.target && t.value?.highlight && r.value ? (o(), y("div", {
141
+ t.value?.target && t.value?.highlight && p.value ? (o(), y("div", {
127
142
  key: 3,
128
143
  class: "tour-highlight-backdrop",
129
- style: R(B.value),
144
+ style: I(E.value),
130
145
  "data-ulu-tour-ui": "true",
131
- onClick: n[2] || (n[2] = (h) => v(d).stop())
146
+ onClick: n[2] || (n[2] = (h) => l(u).stop())
132
147
  }, null, 4)) : x("", !0)
133
148
  ], 64)) : x("", !0)
134
149
  ]));
135
150
  }
136
151
  };
137
152
  export {
138
- H as default
153
+ G as default
139
154
  };
@@ -7,6 +7,9 @@
7
7
  v-if="currentStep?.component"
8
8
  :is="currentStep.component"
9
9
  data-ulu-tour-ui="true"
10
+ :step="currentStep"
11
+ :tourState="tourState"
12
+ :api="api"
10
13
  v-bind="currentStep.componentProps"
11
14
  />
12
15
 
@@ -21,6 +24,10 @@
21
24
  <component
22
25
  v-if="currentStep?.contentComponent"
23
26
  :is="currentStep.contentComponent"
27
+ :step="currentStep"
28
+ :tourState="tourState"
29
+ :api="api"
30
+ :is-modal="true"
24
31
  v-bind="currentStep.componentProps"
25
32
  />
26
33
  <UluTourContent v-else :step="currentStep" :is-modal="true" />
@@ -45,6 +52,10 @@
45
52
  <component
46
53
  v-if="currentStep?.contentComponent"
47
54
  :is="currentStep.contentComponent"
55
+ :step="currentStep"
56
+ :tourState="tourState"
57
+ :api="api"
58
+ :is-modal="false"
48
59
  v-bind="currentStep.componentProps"
49
60
  />
50
61
  <UluTourContent v-else :step="currentStep" :is-modal="false" />
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ulu/frontend-vue",
3
- "version": "0.6.31",
3
+ "version": "0.6.33",
4
4
  "description": "A modular, tree-shakeable Vue 3 component library for the Ulu Frontend theming system, plus general utilities for Vue development",
5
5
  "type": "module",
6
6
  "files": [