@ulu/frontend-vue 0.1.0-beta.9 → 0.1.1-beta.2
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/{breakpoints-BbkGNxxt.js → breakpoints-DfGETUy5.js} +1 -1
- package/dist/frontend-vue.css +1 -1
- package/dist/frontend-vue.js +79 -68
- package/dist/index-94HkwBnP.js +7595 -0
- package/lib/components/collapsible/UluAccordion.vue +71 -53
- package/lib/components/collapsible/UluAccordionGroup.vue +54 -0
- package/lib/components/collapsible/UluCollapsible.vue +144 -0
- package/lib/components/collapsible/UluDropdown.vue +29 -29
- package/lib/components/collapsible/UluOverflowPopover.vue +1 -1
- package/lib/components/elements/UluBadge.vue +51 -28
- package/lib/components/elements/UluBadgeStack.vue +8 -13
- package/lib/components/elements/UluButtonVerbose.vue +119 -0
- package/lib/components/elements/UluCard.vue +1 -1
- package/lib/components/elements/UluDefinitionList.vue +14 -17
- package/lib/components/elements/UluExternalLink.vue +21 -27
- package/lib/components/elements/UluIcon.vue +11 -1
- package/lib/components/elements/UluList.vue +53 -55
- package/lib/components/elements/UluSpokeSpinner.vue +12 -18
- package/lib/components/elements/UluTag.vue +35 -35
- package/lib/components/forms/UluFileDisplay.vue +49 -31
- package/lib/components/forms/UluFormFile.vue +37 -24
- package/lib/components/forms/UluFormMessage.vue +13 -10
- package/lib/components/forms/UluFormSelect.vue +28 -16
- package/lib/components/forms/UluFormText.vue +24 -15
- package/lib/components/forms/UluSearchForm.vue +11 -10
- package/lib/components/forms/UluSelectableMenu.vue +99 -0
- package/lib/components/index.js +4 -3
- package/lib/components/layout/UluTitleRail.vue +18 -0
- package/lib/components/layout/UluWhenBreakpoint.vue +9 -0
- package/lib/components/navigation/UluBreadcrumb.vue +9 -2
- package/lib/components/navigation/UluMenu.vue +8 -3
- package/lib/components/navigation/UluMenuStack.vue +3 -1
- package/lib/components/navigation/UluPager.vue +102 -0
- package/lib/components/systems/facets/ExampleFacetsWithPagination.vue +119 -0
- package/lib/components/systems/facets/UluFacetsFilterLists.vue +91 -0
- package/lib/components/systems/facets/UluFacetsFilterPopovers.vue +125 -0
- package/lib/components/systems/facets/UluFacetsFilterSelects.vue +71 -0
- package/lib/components/systems/facets/UluFacetsHeaderLayout.vue +24 -0
- package/lib/components/systems/facets/UluFacetsList.vue +62 -34
- package/lib/components/systems/facets/UluFacetsResults.vue +63 -0
- package/lib/components/systems/facets/UluFacetsSearch.vue +27 -50
- package/lib/components/systems/facets/UluFacetsSidebarLayout.vue +70 -0
- package/lib/components/systems/facets/UluFacetsSort.vue +45 -0
- package/lib/components/systems/facets/_facets.scss +2 -3
- package/lib/components/systems/facets/_mock-data.js +40 -0
- package/lib/components/systems/facets/useFacets.js +268 -0
- package/lib/components/systems/index.js +13 -2
- package/lib/components/systems/scroll-anchors/UluScrollAnchors.vue +2 -1
- package/lib/components/systems/skeleton/UluShowSkeleton.vue +9 -8
- package/lib/components/systems/skeleton/UluSkeletonContent.vue +39 -43
- package/lib/components/systems/skeleton/UluSkeletonMedia.vue +4 -6
- package/lib/components/systems/skeleton/UluSkeletonText.vue +27 -0
- package/lib/components/systems/slider/UluImageSlideShow.vue +1 -1
- package/lib/components/systems/slider/UluSlideShow.vue +8 -3
- package/lib/components/systems/table-sticky/UluTableSticky.vue +7 -7
- package/lib/components/systems/table-sticky/UluTableStickyTable.vue +3 -3
- package/lib/components/visualizations/UluAnimateNumber.vue +7 -1
- package/lib/components/visualizations/UluProgressBar.vue +148 -74
- package/lib/components/visualizations/UluProgressCircle.vue +159 -0
- package/lib/composables/index.js +3 -1
- package/lib/composables/useDocumentTitle.js +61 -0
- package/lib/composables/usePagination.js +122 -0
- package/lib/index.js +1 -0
- package/lib/plugins/core/index.js +6 -1
- package/lib/plugins/popovers/UluPopover.vue +8 -3
- package/lib/plugins/toast/UluToast.vue +1 -1
- package/lib/plugins/toast/UluToastDisplay.vue +19 -2
- package/lib/utils/dom.js +12 -0
- package/lib/utils/index.js +2 -0
- package/lib/utils/{vue-router.js → router.js} +114 -30
- package/package.json +17 -11
- package/types/components/systems/facets/_mock-data.d.ts +18 -0
- package/types/components/systems/facets/_mock-data.d.ts.map +1 -0
- package/types/components/systems/facets/useFacets.d.ts +39 -0
- package/types/components/systems/facets/useFacets.d.ts.map +1 -0
- package/types/components/systems/index.d.ts +1 -1
- package/types/composables/index.d.ts +2 -0
- package/types/composables/useDocumentTitle.d.ts +22 -0
- package/types/composables/useDocumentTitle.d.ts.map +1 -0
- package/types/composables/usePageTitle.d.ts +19 -0
- package/types/composables/usePageTitle.d.ts.map +1 -0
- package/types/composables/usePagination.d.ts +25 -0
- package/types/composables/usePagination.d.ts.map +1 -0
- package/types/index.d.ts +1 -0
- package/types/plugins/core/index.d.ts.map +1 -1
- package/types/utils/dom.d.ts +1 -0
- package/types/utils/dom.d.ts.map +1 -1
- package/types/utils/index.d.ts +3 -0
- package/types/utils/index.d.ts.map +1 -0
- package/types/utils/router.d.ts +144 -0
- package/types/utils/router.d.ts.map +1 -0
- package/dist/index-D3Uc6T5M.js +0 -6469
- package/lib/components/collapsible/UluCollapsibleRegion.vue +0 -278
- package/lib/components/forms/UluCheckboxMenu.vue +0 -36
- package/lib/components/systems/facets/UluFacets.vue +0 -380
- package/lib/components/systems/skeleton/UluSkeletonTextInline.vue +0 -9
- package/lib/components/visualizations/UluProgressDonut.vue +0 -97
- package/lib/utils/placeholder.js +0 -6
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<TransitionGroup
|
|
4
4
|
class="toast-container"
|
|
5
5
|
:class="classes"
|
|
6
|
-
name="toast"
|
|
6
|
+
name="toast-animation"
|
|
7
7
|
tag="div"
|
|
8
8
|
>
|
|
9
9
|
<component
|
|
@@ -32,4 +32,21 @@
|
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
|
-
</script>
|
|
35
|
+
</script>
|
|
36
|
+
|
|
37
|
+
<style lang="css">
|
|
38
|
+
.toast-animation-move,
|
|
39
|
+
.toast-animation-enter-active,
|
|
40
|
+
.toast-animation-leave-active {
|
|
41
|
+
transition: all 0.3s ease;
|
|
42
|
+
}
|
|
43
|
+
.toast-animation-enter-from,
|
|
44
|
+
.toast-animation-leave-to {
|
|
45
|
+
opacity: 0;
|
|
46
|
+
transform: translateX(30px);
|
|
47
|
+
}
|
|
48
|
+
.toast-animation-leave-active {
|
|
49
|
+
position: absolute;
|
|
50
|
+
width: 100%;
|
|
51
|
+
}
|
|
52
|
+
</style>
|
package/lib/utils/dom.js
CHANGED
|
@@ -11,4 +11,16 @@ export function refToElement(value) {
|
|
|
11
11
|
} else if (typeof value === 'object' && '$el' in value) {
|
|
12
12
|
return value.$el;
|
|
13
13
|
}
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
let idCounter = 0;
|
|
18
|
+
|
|
19
|
+
export function newId(prefix = "ulu-id") {
|
|
20
|
+
const id = `${ prefix }-${ ++idCounter }`;
|
|
21
|
+
if (typeof document !== 'undefined' && document.getElementById(id)) {
|
|
22
|
+
// In the unlikely event of a collision (e.g., SSR), recurse.
|
|
23
|
+
return generateUid(prefix);
|
|
24
|
+
}
|
|
25
|
+
return id;
|
|
14
26
|
}
|
|
@@ -1,9 +1,29 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* This Module Creates Menus from route or router config
|
|
3
3
|
* - Note: Functions prefixed with "$" work with $route objects (running application, provided by vue-router ie $router, useRoute, etc),
|
|
4
|
-
* @module
|
|
4
|
+
* @module router-utils
|
|
5
5
|
*/
|
|
6
6
|
|
|
7
|
+
/**
|
|
8
|
+
* Resolves a route's title from its meta.
|
|
9
|
+
* - If `meta.title` is a function, it's called with the `currentRoute` (or the route itself).
|
|
10
|
+
* - Otherwise, `meta.title` is returned.
|
|
11
|
+
* This function is the single source of truth for resolving titles from route configuration.
|
|
12
|
+
* @param {object} route The route or route match object.
|
|
13
|
+
* @param {object} [currentRoute] The current route from `useRoute()`, passed to functional titles.
|
|
14
|
+
* @returns {string|undefined} The resolved title, or undefined if not found.
|
|
15
|
+
*/
|
|
16
|
+
export function getRouteTitle(route, currentRoute) {
|
|
17
|
+
const meta = route?.meta || {};
|
|
18
|
+
let title = meta.title;
|
|
19
|
+
|
|
20
|
+
if (typeof title === "function") {
|
|
21
|
+
title = title(currentRoute || route);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
return title;
|
|
25
|
+
}
|
|
26
|
+
|
|
7
27
|
/**
|
|
8
28
|
* Route Menu Item
|
|
9
29
|
* @typedef {Object} RouteMenuItem
|
|
@@ -21,21 +41,55 @@
|
|
|
21
41
|
*/
|
|
22
42
|
export function createBaseMenu(routes, options) {
|
|
23
43
|
const defaults = {
|
|
24
|
-
qualifier
|
|
44
|
+
qualifier(route, parentPath) {
|
|
45
|
+
if (!parentPath) {
|
|
46
|
+
return isStaticBaseRoute(route);
|
|
47
|
+
} else {
|
|
48
|
+
return isStaticRoute(route);
|
|
49
|
+
}
|
|
50
|
+
},
|
|
25
51
|
sort: sortByWeight,
|
|
26
|
-
item: {}
|
|
52
|
+
item: {},
|
|
53
|
+
includeChildren: false
|
|
27
54
|
};
|
|
28
55
|
const opts = Object.assign({}, defaults, options);
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
56
|
+
const getItemPath = (r, parentPath) => parentPath ? `${ parentPath }/${ r.path }` : r.path;
|
|
57
|
+
const toMenuItems = (currentRoutes, parentPath = null) => {
|
|
58
|
+
return currentRoutes
|
|
59
|
+
.filter(r => opts.qualifier(r, parentPath))
|
|
60
|
+
.map(r => {
|
|
61
|
+
const menuRoute = r.children ? getChildIndexRoute(r.children) : r;
|
|
62
|
+
const children = r.children ? r.children.filter(child => child.path !== "") : false;
|
|
63
|
+
const item = createMenuItem(menuRoute, getItemPath(r, parentPath), opts.item);
|
|
64
|
+
if (opts.includeChildren && children.length) {
|
|
65
|
+
item.children = toMenuItems(children, item.path);
|
|
66
|
+
}
|
|
67
|
+
return item;
|
|
68
|
+
})
|
|
69
|
+
.sort(opts.sort);
|
|
70
|
+
};
|
|
71
|
+
return toMenuItems(routes);
|
|
37
72
|
}
|
|
38
73
|
|
|
74
|
+
/**
|
|
75
|
+
* Returns menu flat (no parent children)
|
|
76
|
+
*/
|
|
77
|
+
export function flattenMenu(menu) {
|
|
78
|
+
function flatten(items) {
|
|
79
|
+
const result = [];
|
|
80
|
+
for (const item of items) {
|
|
81
|
+
const newItem = { ...item };
|
|
82
|
+
delete newItem.children;
|
|
83
|
+
result.push(newItem);
|
|
84
|
+
if (item.children) {
|
|
85
|
+
result.push(...flatten(item.children));
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
return result;
|
|
89
|
+
}
|
|
90
|
+
return flatten(menu);
|
|
91
|
+
}
|
|
92
|
+
|
|
39
93
|
/**
|
|
40
94
|
* Print out a section's menu based on path
|
|
41
95
|
* @param {*} routes All routes
|
|
@@ -53,7 +107,6 @@ export function createSectionMenu(routes, sectionPath, options) {
|
|
|
53
107
|
};
|
|
54
108
|
const opts = Object.assign({}, defaults, options);
|
|
55
109
|
const base = routes.find(r => r.path !== "/" && sectionPath.includes(r.path));
|
|
56
|
-
// Go through each item and
|
|
57
110
|
const getSection = (current, previous, path) => {
|
|
58
111
|
if (current.children) {
|
|
59
112
|
const child = current.children.find(c => c.path.includes(sectionPath));
|
|
@@ -74,20 +127,6 @@ export function createSectionMenu(routes, sectionPath, options) {
|
|
|
74
127
|
.sort(opts.sort);
|
|
75
128
|
}
|
|
76
129
|
|
|
77
|
-
/**
|
|
78
|
-
* For a given route this will return the route that renders. For routes without
|
|
79
|
-
* children this is the route itself for those with children (first child with empty path)
|
|
80
|
-
* @param {Object} route Route object to resolve
|
|
81
|
-
* @returns {Object} Resolved route
|
|
82
|
-
*/
|
|
83
|
-
// export function resolveRouteIndex(route) {
|
|
84
|
-
// if (route.children) {
|
|
85
|
-
// return getChildIndexRoute(route.children);
|
|
86
|
-
// } else {
|
|
87
|
-
// return route;
|
|
88
|
-
// }
|
|
89
|
-
// }
|
|
90
|
-
|
|
91
130
|
/**
|
|
92
131
|
* For a given array of child routes return the index
|
|
93
132
|
* @param {Array} children Children array of routes
|
|
@@ -96,6 +135,7 @@ export function createSectionMenu(routes, sectionPath, options) {
|
|
|
96
135
|
export function getChildIndexRoute(children) {
|
|
97
136
|
return children.find(r => r.path === "");
|
|
98
137
|
}
|
|
138
|
+
|
|
99
139
|
/**
|
|
100
140
|
* Creates common menu item structure from route, pulls title and weight from meta (on route or index child)
|
|
101
141
|
* @param {Object} route Route
|
|
@@ -115,9 +155,10 @@ export function createMenuItem(route, routePath = route.path, options) {
|
|
|
115
155
|
if (opts.indexMeta && route.children) {
|
|
116
156
|
meta = Object.assign({}, meta, getChildIndexRoute(route.children)?.meta);
|
|
117
157
|
}
|
|
158
|
+
const routeWithMergedMeta = { ...route, meta };
|
|
118
159
|
const item = {
|
|
119
160
|
path: routePath,
|
|
120
|
-
title:
|
|
161
|
+
title: getRouteTitle(routeWithMergedMeta, route) || "Missing Title",
|
|
121
162
|
weight: meta?.weight || 0,
|
|
122
163
|
meta
|
|
123
164
|
};
|
|
@@ -126,23 +167,26 @@ export function createMenuItem(route, routePath = route.path, options) {
|
|
|
126
167
|
}
|
|
127
168
|
return item;
|
|
128
169
|
}
|
|
170
|
+
|
|
129
171
|
/**
|
|
130
|
-
* Test if route is static (doesn't
|
|
172
|
+
* Test if route is static (doesn't include parameters)
|
|
131
173
|
* @param {Object} route Route object to test
|
|
132
174
|
* @returns {Boolean} Whether or not this route is static (not dynamic)
|
|
133
175
|
*/
|
|
134
176
|
export function isStaticRoute(route) {
|
|
135
177
|
return !route.path.includes("/:");
|
|
136
178
|
}
|
|
179
|
+
|
|
137
180
|
/**
|
|
138
181
|
*
|
|
139
182
|
* @param {Object} route Route object to test
|
|
140
183
|
* @returns {Boolean} Whether or not this route is a static base route
|
|
141
184
|
*/
|
|
142
185
|
export function isStaticBaseRoute(route) {
|
|
143
|
-
const matches = route.path.match(/\//) || [];
|
|
186
|
+
const matches = route.path.match(/\//g) || [];
|
|
144
187
|
return isStaticRoute(route) && matches.length === 1;
|
|
145
188
|
}
|
|
189
|
+
|
|
146
190
|
/**
|
|
147
191
|
* Function to make normal <a> behave as router links instread of page reload
|
|
148
192
|
* @param {Object} router Router instance (ie src/router) to push routes to
|
|
@@ -159,6 +203,7 @@ export function nativeLinkRouter(router, event) {
|
|
|
159
203
|
}
|
|
160
204
|
}
|
|
161
205
|
}
|
|
206
|
+
|
|
162
207
|
/**
|
|
163
208
|
* Returns the child routes for base route
|
|
164
209
|
* @param {Object} route Route Object
|
|
@@ -167,6 +212,7 @@ export function nativeLinkRouter(router, event) {
|
|
|
167
212
|
export function $getRouteChildren(route, parent = $getParentRoute(route)) {
|
|
168
213
|
return parent?.children;
|
|
169
214
|
}
|
|
215
|
+
|
|
170
216
|
/**
|
|
171
217
|
* Returns the route's parent
|
|
172
218
|
* @param {Object} route Route Object
|
|
@@ -216,4 +262,42 @@ export function $createSectionMenu(route, options) {
|
|
|
216
262
|
.filter(includeIndex(opts.includeIndex))
|
|
217
263
|
.map(r => createMenuItem(r, `${ parent.path }/${ r.path }`, opts.item))
|
|
218
264
|
.sort(opts.sort);
|
|
219
|
-
}
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
/**
|
|
268
|
+
* For a given $route, this will generate a breadcrumb trail.
|
|
269
|
+
* It iterates through `route.matched` to build the trail.
|
|
270
|
+
* - Falls back to `meta.title` (string or function).
|
|
271
|
+
* - Skips routes where `meta.breadcrumb` is set to `false`.
|
|
272
|
+
* - Avoids duplicate crumbs for nested routes with empty paths.
|
|
273
|
+
* @param {Object} route The Vue Router `$route` object.
|
|
274
|
+
* @returns {Array.<{title: String, to: Object, current: Boolean}>} An array of breadcrumb items.
|
|
275
|
+
*/
|
|
276
|
+
export function $createBreadcrumb(route) {
|
|
277
|
+
const { matched, path: currentPath } = route;
|
|
278
|
+
let prevPath;
|
|
279
|
+
|
|
280
|
+
const crumbs = matched.reduce((arr, match, index) => {
|
|
281
|
+
if (match.meta?.breadcrumb === false) {
|
|
282
|
+
return arr;
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
if (match.path === prevPath) {
|
|
286
|
+
return arr;
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
const isLast = index === matched.length - 1;
|
|
290
|
+
const title = getRouteTitle(match, route) || "Missing Title";
|
|
291
|
+
|
|
292
|
+
arr.push({
|
|
293
|
+
title,
|
|
294
|
+
to: { path: isLast ? currentPath : match.path },
|
|
295
|
+
current: isLast,
|
|
296
|
+
});
|
|
297
|
+
|
|
298
|
+
prevPath = match.path;
|
|
299
|
+
return arr;
|
|
300
|
+
}, []);
|
|
301
|
+
|
|
302
|
+
return crumbs;
|
|
303
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ulu/frontend-vue",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1-beta.2",
|
|
4
4
|
"description": "A modular and tree-shakeable Vue 3 component library for the Ulu frontend",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"files": [
|
|
@@ -11,7 +11,8 @@
|
|
|
11
11
|
"module": "./lib/index.js",
|
|
12
12
|
"exports": {
|
|
13
13
|
".": {
|
|
14
|
-
"import": "./lib/index.js"
|
|
14
|
+
"import": "./lib/index.js",
|
|
15
|
+
"types": "./types/index.d.ts"
|
|
15
16
|
},
|
|
16
17
|
"./dist": {
|
|
17
18
|
"import": "./dist/frontend-vue.js"
|
|
@@ -19,9 +20,10 @@
|
|
|
19
20
|
"./*": "./lib/*",
|
|
20
21
|
"./scss": "./lib/_index.scss"
|
|
21
22
|
},
|
|
23
|
+
"types": "./types/index.d.ts",
|
|
22
24
|
"typesVersions": {
|
|
23
25
|
"*": {
|
|
24
|
-
"
|
|
26
|
+
"*": [
|
|
25
27
|
"./types/*"
|
|
26
28
|
]
|
|
27
29
|
}
|
|
@@ -35,7 +37,8 @@
|
|
|
35
37
|
"docs:build": "storybook build -o docs",
|
|
36
38
|
"build": "vite build",
|
|
37
39
|
"types": "npx tsc",
|
|
38
|
-
"deploy": "npm run types && npm run build && npm run docs:build"
|
|
40
|
+
"deploy": "npm run types && npm run build && npm run docs:build",
|
|
41
|
+
"update-contexts": "rm -rf .ctx && mkdir -p .ctx/frontend && cp -R node_modules/@ulu/frontend/scss node_modules/@ulu/frontend/js .ctx/frontend/"
|
|
39
42
|
},
|
|
40
43
|
"keywords": [
|
|
41
44
|
"vue",
|
|
@@ -56,13 +59,15 @@
|
|
|
56
59
|
"homepage": "https://github.com/Jscherbe/frontend-vue#readme",
|
|
57
60
|
"peerDependencies": {
|
|
58
61
|
"@headlessui/vue": "^1.7.23",
|
|
59
|
-
"@ulu/frontend": "^0.1.0-beta.
|
|
62
|
+
"@ulu/frontend": "^0.1.0-beta.112",
|
|
63
|
+
"@unhead/vue": "^2.0.11",
|
|
60
64
|
"vue": "^3.5.17",
|
|
61
|
-
"vue-router": "^4.5.1"
|
|
65
|
+
"vue-router": "^4.5.1",
|
|
66
|
+
"@formkit/auto-animate" : "^0.9.0"
|
|
62
67
|
},
|
|
63
68
|
"optionalDependencies": {
|
|
64
|
-
"gsap": "^3.13.0",
|
|
65
69
|
"fuse.js": "^6.6.2",
|
|
70
|
+
"gsap": "^3.13.0",
|
|
66
71
|
"vue3-dropzone": "^2.2.1"
|
|
67
72
|
},
|
|
68
73
|
"dependencies": {
|
|
@@ -75,10 +80,11 @@
|
|
|
75
80
|
"@fortawesome/free-solid-svg-icons": "^6.7.2",
|
|
76
81
|
"@fortawesome/vue-fontawesome": "^3.0.8",
|
|
77
82
|
"@storybook/addon-docs": "^9.1.1",
|
|
78
|
-
"@storybook/addon-links": "^9.1.1",
|
|
79
83
|
"@storybook/addon-essentials": "^9.0.0-alpha.12",
|
|
84
|
+
"@storybook/addon-links": "^9.1.1",
|
|
80
85
|
"@storybook/vue3-vite": "^9.1.1",
|
|
81
|
-
"@ulu/frontend": "^0.1.0-beta.
|
|
86
|
+
"@ulu/frontend": "^0.1.0-beta.112",
|
|
87
|
+
"@unhead/vue": "^2.0.11",
|
|
82
88
|
"@vitejs/plugin-vue": "^6.0.0",
|
|
83
89
|
"ollama": "^0.5.16",
|
|
84
90
|
"react": "^19.1.1",
|
|
@@ -86,12 +92,12 @@
|
|
|
86
92
|
"sass-embedded": "^1.89.2",
|
|
87
93
|
"storybook": "^9.1.1",
|
|
88
94
|
"storybook-addon-vue-mdx": "^2.0.2",
|
|
95
|
+
"typescript": "^5.3.3",
|
|
89
96
|
"vite": "^7.0.0",
|
|
90
97
|
"vue-router": "^4.5.1",
|
|
91
|
-
"
|
|
98
|
+
"@formkit/auto-animate" : "^0.9.0"
|
|
92
99
|
},
|
|
93
100
|
"volta": {
|
|
94
101
|
"node": "22.17.0"
|
|
95
102
|
}
|
|
96
103
|
}
|
|
97
|
-
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export const initialMockFacets: {
|
|
2
|
+
name: string;
|
|
3
|
+
uid: string;
|
|
4
|
+
open: boolean;
|
|
5
|
+
children: {
|
|
6
|
+
uid: string;
|
|
7
|
+
label: string;
|
|
8
|
+
}[];
|
|
9
|
+
}[];
|
|
10
|
+
export const mockItems: {
|
|
11
|
+
id: number;
|
|
12
|
+
title: string;
|
|
13
|
+
description: string;
|
|
14
|
+
category: string[];
|
|
15
|
+
author: string[];
|
|
16
|
+
date: Date;
|
|
17
|
+
}[];
|
|
18
|
+
//# sourceMappingURL=_mock-data.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"_mock-data.d.ts","sourceRoot":"","sources":["../../../../lib/components/systems/facets/_mock-data.js"],"names":[],"mappings":"AAAA;;;;;;;;IAwBE;AAEF;;;;;;;IAaE"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A composable for handling client-side faceted search, filtering, and sorting.
|
|
3
|
+
* @param {import('vue').Ref<Array<Object>>} allItems - A Vue ref containing the full list of items to be processed.
|
|
4
|
+
* @param {Object} options - Configuration options for the composable.
|
|
5
|
+
* @param {Array} [options.initialFacets] - The initial configuration for the facets. Can be generated automatically if `facetFields` is provided.
|
|
6
|
+
* @param {Array} [options.facetFields] - A simpler configuration to automatically generate facets from items. Each item can have `uid`, `name`, `open`, `getValue` and `getLabel`.
|
|
7
|
+
* @param {String} [options.initialSearchValue=''] - The initial value for the search input.
|
|
8
|
+
* @param {String} [options.initialSortType='az'] - The initial sort type.
|
|
9
|
+
* @param {Boolean} [options.noDefaultSorts=false] - If true, the default 'A-Z' and 'Z-A' sorts will not be included.
|
|
10
|
+
* @param {Object} [options.extraSortTypes={}] - Additional sort types to be merged with the default ones.
|
|
11
|
+
* @param {Object} [options.searchOptions={}] - Configuration options for Fuse.js.
|
|
12
|
+
* @param {Function} [options.getItemFacet] - A function to retrieve facet information from an item. Should always return an array of values.
|
|
13
|
+
* @param {Function} [options.getSortValue] - A function to get the value to sort by from an item.
|
|
14
|
+
*/
|
|
15
|
+
export function useFacets(allItems: import("vue").Ref<Array<any>>, options?: {
|
|
16
|
+
initialFacets?: any[];
|
|
17
|
+
facetFields?: any[];
|
|
18
|
+
initialSearchValue?: string;
|
|
19
|
+
initialSortType?: string;
|
|
20
|
+
noDefaultSorts?: boolean;
|
|
21
|
+
extraSortTypes?: any;
|
|
22
|
+
searchOptions?: any;
|
|
23
|
+
getItemFacet?: Function;
|
|
24
|
+
getSortValue?: Function;
|
|
25
|
+
}): {
|
|
26
|
+
facets: import("vue").Ref<any, any>;
|
|
27
|
+
searchValue: import("vue").Ref<string, string>;
|
|
28
|
+
selectedSort: import("vue").Ref<string, string>;
|
|
29
|
+
sortTypes: import("vue").ComputedRef<any>;
|
|
30
|
+
displayItems: import("vue").ComputedRef<any>;
|
|
31
|
+
selectedFacets: import("vue").ComputedRef<any[]>;
|
|
32
|
+
clearFilters: () => void;
|
|
33
|
+
handleFacetChange: ({ groupUid, facetUid, selected }: {
|
|
34
|
+
groupUid: any;
|
|
35
|
+
facetUid: any;
|
|
36
|
+
selected: any;
|
|
37
|
+
}) => void;
|
|
38
|
+
};
|
|
39
|
+
//# sourceMappingURL=useFacets.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFacets.d.ts","sourceRoot":"","sources":["../../../../lib/components/systems/facets/useFacets.js"],"names":[],"mappings":"AA2CA;;;;;;;;;;;;;GAaG;AACH,oCAZW,OAAO,KAAK,EAAE,GAAG,CAAC,KAAK,KAAQ,CAAC,YAExC;IAAwB,aAAa;IACb,WAAW;IACV,kBAAkB;IAClB,eAAe;IACd,cAAc;IACf,cAAc;IACd,aAAa;IACX,YAAY;IACZ,YAAY;CACzC;;;;;;;;;;;;;EAmNA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export { useFacets } from "./facets/useFacets.js";
|
|
2
2
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -3,4 +3,6 @@ export { useModifiers } from "./useModifiers.js";
|
|
|
3
3
|
export { useWindowResize } from "./useWindowResize.js";
|
|
4
4
|
export { useRequiredInject } from "./useRequiredInject.js";
|
|
5
5
|
export { useBreakpointManager } from "./useBreakpointManager.js";
|
|
6
|
+
export { usePagination } from "./usePagination.js";
|
|
7
|
+
export { useDocumentTitle } from "./useDocumentTitle.js";
|
|
6
8
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A composable to manage the document title.
|
|
3
|
+
*
|
|
4
|
+
* When called with a `title` option, it sets a dynamic title for the current page.
|
|
5
|
+
* This is for use within specific components.
|
|
6
|
+
*
|
|
7
|
+
* When called without a `title` option (typically in App.vue), it manages the
|
|
8
|
+
* document title for the whole app, using titles from components or route meta.
|
|
9
|
+
*
|
|
10
|
+
* @param {object} options
|
|
11
|
+
* @param {import('vue').Ref<string> | string} [options.title] - The dynamic title to set for the current page.
|
|
12
|
+
* @param {string} [options.titleTemplate='%s'] - The template for the document title, e.g., '%s | My Site'.
|
|
13
|
+
* @param {Function} [options.useRoute=defaultUseRoute] - Injectable `useRoute` for testing.
|
|
14
|
+
* @param {Function} [options.useHead=defaultUseHead] - Injectable `useHead` for testing.
|
|
15
|
+
*/
|
|
16
|
+
export function useDocumentTitle(options?: {
|
|
17
|
+
title?: import("vue").Ref<string> | string;
|
|
18
|
+
titleTemplate?: string;
|
|
19
|
+
useRoute?: Function;
|
|
20
|
+
useHead?: Function;
|
|
21
|
+
}): void;
|
|
22
|
+
//# sourceMappingURL=useDocumentTitle.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDocumentTitle.d.ts","sourceRoot":"","sources":["../../lib/composables/useDocumentTitle.js"],"names":[],"mappings":"AAQA;;;;;;;;;;;;;;GAcG;AACH,2CALG;IAAqD,KAAK,GAAlD,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,GAAG,MAAM;IACjB,aAAa,GAA9B,MAAM;IACa,QAAQ;IACR,OAAO;CACpC,QAsCA"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A composable to set the title for the current page/route from within its component.
|
|
3
|
+
* This provides a single source of truth for a page's title, which can be
|
|
4
|
+
* consumed by various parts of the application (e.g., breadcrumbs, document title).
|
|
5
|
+
* @param {import('vue').Ref<string> | string} title The title to set for the current page. Can be a ref, computed, or a plain string.
|
|
6
|
+
* @param {{ useRoute: Function }} options For dependency injection in tests/stories.
|
|
7
|
+
*/
|
|
8
|
+
export function usePageTitle(title: import("vue").Ref<string> | string, { useRoute }?: {
|
|
9
|
+
useRoute: Function;
|
|
10
|
+
}): void;
|
|
11
|
+
/**
|
|
12
|
+
* Gets the dynamically set page title for a given path.
|
|
13
|
+
* For internal use by consumers like breadcrumb or document title utilities.
|
|
14
|
+
* @param {string} path The route path to look up.
|
|
15
|
+
* @returns {string | undefined}
|
|
16
|
+
*/
|
|
17
|
+
export function getPageTitle(path: string): string | undefined;
|
|
18
|
+
export const pageTitles: {};
|
|
19
|
+
//# sourceMappingURL=usePageTitle.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePageTitle.d.ts","sourceRoot":"","sources":["../../lib/composables/usePageTitle.js"],"names":[],"mappings":"AAOA;;;;;;GAMG;AACH,oCAHW,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,GAAG,MAAM,iBAClC;IAAE,QAAQ,WAAU;CAAE,QAchC;AAED;;;;;GAKG;AACH,mCAHW,MAAM,GACJ,MAAM,GAAG,SAAS,CAI9B;AA/BD,4BAAuC"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A Vue composable for handling pagination logic.
|
|
3
|
+
* It interacts with vue-router to keep the current page in the URL query string.
|
|
4
|
+
*
|
|
5
|
+
* @param {import('vue').Ref<Array<any>>} items - A ref containing the full list of items to be paginated.
|
|
6
|
+
* @param {number} itemsPerPage - The number of items to display per page.
|
|
7
|
+
* @returns {{
|
|
8
|
+
* currentPage: import('vue').ComputedRef<number>,
|
|
9
|
+
* totalPages: import('vue').ComputedRef<number>,
|
|
10
|
+
* paginatedItems: import('vue').ComputedRef<Array<any>>,
|
|
11
|
+
* pagerItems: import('vue').ComputedRef<object|null>,
|
|
12
|
+
* pagerEllipses: import('vue').ComputedRef<{previous: boolean, next: boolean}>
|
|
13
|
+
* }} - An object containing reactive properties for pagination.
|
|
14
|
+
*/
|
|
15
|
+
export function usePagination(items: import("vue").Ref<Array<any>>, itemsPerPage: number): {
|
|
16
|
+
currentPage: import("vue").ComputedRef<number>;
|
|
17
|
+
totalPages: import("vue").ComputedRef<number>;
|
|
18
|
+
paginatedItems: import("vue").ComputedRef<Array<any>>;
|
|
19
|
+
pagerItems: import("vue").ComputedRef<object | null>;
|
|
20
|
+
pagerEllipses: import("vue").ComputedRef<{
|
|
21
|
+
previous: boolean;
|
|
22
|
+
next: boolean;
|
|
23
|
+
}>;
|
|
24
|
+
};
|
|
25
|
+
//# sourceMappingURL=usePagination.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePagination.d.ts","sourceRoot":"","sources":["../../lib/composables/usePagination.js"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;GAaG;AACH,qCAVW,OAAO,KAAK,EAAE,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,gBAC7B,MAAM,GACJ;IACR,WAAW,EAAE,OAAO,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/C,UAAU,EAAE,OAAO,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9C,cAAc,EAAE,OAAO,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC;IACtD,UAAU,EAAE,OAAO,KAAK,EAAE,WAAW,CAAC,MAAM,GAAC,IAAI,CAAC,CAAC;IACnD,aAAa,EAAE,OAAO,KAAK,EAAE,WAAW,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,OAAO,CAAA;KAAC,CAAC,CAAA;CAC7E,CA0GH"}
|
package/types/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/plugins/core/index.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/plugins/core/index.js"],"names":[],"mappings":"AAkCA,mEAyDC;AA3DD,gCAA0D"}
|
package/types/utils/dom.d.ts
CHANGED
package/types/utils/dom.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../lib/utils/dom.js"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,oCAHW,WAAW,MAAO,GAChB,WAAW,CASvB"}
|
|
1
|
+
{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../lib/utils/dom.js"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,oCAHW,WAAW,MAAO,GAChB,WAAW,CASvB;AAKD,4CAOC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/utils/index.js"],"names":[],"mappings":""}
|