@neovici/cosmoz-queue 3.3.1 → 3.4.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.
package/dist/queue/index.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
export { default as useAsyncAction } from './use-async-action';
|
|
2
2
|
export { default as useDataService } from './use-data-service';
|
|
3
|
-
export { default as useQueue } from './use-queue';
|
|
3
|
+
export { ACTIVE_ROW_PART, default as useQueue, useRowPartFn, } from './use-queue';
|
|
4
4
|
export { getItems, touch } from './util';
|
|
5
5
|
export * from './render';
|
|
6
6
|
export type * from './types';
|
|
7
|
-
export type
|
|
7
|
+
export type { UseQueue } from './use-queue';
|
|
8
8
|
export { itemClick } from './item-click';
|
|
9
9
|
export { default as omnitable } from './omnitable';
|
|
10
10
|
export { usePagination } from './pagination';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/queue/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/queue/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EACN,eAAe,EACf,OAAO,IAAI,QAAQ,EACnB,YAAY,GACZ,MAAM,aAAa,CAAC;AAErB,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAEzC,cAAc,UAAU,CAAC;AAEzB,mBAAmB,SAAS,CAAC;AAC7B,YAAY,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAG5C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AAGnD,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAG7C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAGhC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,SAAS,CAAC;AAGpE,OAAO,EACN,QAAQ,EACR,UAAU,EACV,SAAS,EACT,OAAO,IAAI,eAAe,GAC1B,MAAM,qBAAqB,CAAC;AAC7B,YAAY,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAGvD,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAG5C,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,YAAY,CAAC;AAGhD,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC"}
|
package/dist/queue/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export { default as useAsyncAction } from './use-async-action';
|
|
2
2
|
export { default as useDataService } from './use-data-service';
|
|
3
|
-
export { default as useQueue } from './use-queue';
|
|
3
|
+
export { ACTIVE_ROW_PART, default as useQueue, useRowPartFn, } from './use-queue';
|
|
4
4
|
export { getItems, touch } from './util';
|
|
5
5
|
export * from './render';
|
|
6
6
|
// Item interactions
|
package/dist/queue/render.js
CHANGED
|
@@ -42,7 +42,7 @@ export const renderPagination = (pagination) => {
|
|
|
42
42
|
const { pageNumber = -1, onPage } = pagination;
|
|
43
43
|
const totalPages = pagination.totalPages ??
|
|
44
44
|
Math.ceil((pagination.totalAvailable ?? 0) / (pagination.pageSize ?? 0));
|
|
45
|
-
return html ` <div class="tabn-pagination">
|
|
45
|
+
return html ` <div class="tabn-pagination" slot="stats">
|
|
46
46
|
<cosmoz-button
|
|
47
47
|
title="${t('Previous page')}"
|
|
48
48
|
class="button-page page-prev"
|
|
@@ -69,7 +69,7 @@ export const renderStats = ({ pagination, index, items, totalAvailable, nav, act
|
|
|
69
69
|
if (items.length < 1) {
|
|
70
70
|
return nothing;
|
|
71
71
|
}
|
|
72
|
-
return html `<div class="tabn-stats">
|
|
72
|
+
return html `<div class="tabn-stats" slot="stats">
|
|
73
73
|
${(() => {
|
|
74
74
|
if (pagination) {
|
|
75
75
|
const { pageNumber, pageSize } = pagination;
|
|
@@ -117,7 +117,7 @@ export const renderQueue = ({ header, heading, afterHeading, index, tabnav, item
|
|
|
117
117
|
: undefined;
|
|
118
118
|
const tabn = html `
|
|
119
119
|
<cosmoz-tabs-next class="tabn">
|
|
120
|
-
<div class="tabn-heading">${heading}${afterHeading}</div>
|
|
120
|
+
<div class="tabn-heading" slot="tabs">${heading}${afterHeading}</div>
|
|
121
121
|
${renderTabs({ ...tabnav, className: 'tabn-tab' })}
|
|
122
122
|
${renderStats({
|
|
123
123
|
pagination,
|
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
import { useListState } from './use-list';
|
|
2
2
|
import { Options as UseTabsOptions } from './use-tabs';
|
|
3
|
+
/**
|
|
4
|
+
* Part name of the active row, as marked by `useRowPartFn`.
|
|
5
|
+
*/
|
|
6
|
+
export declare const ACTIVE_ROW_PART = "itemRow-active";
|
|
7
|
+
/**
|
|
8
|
+
* Marks the active item's row with the `itemRow-active` part so the queue
|
|
9
|
+
* stylesheet can highlight it.
|
|
10
|
+
*/
|
|
11
|
+
export declare const useRowPartFn: <I>(item: I | undefined, id: (i: I) => string) => ((row: I) => string | undefined);
|
|
3
12
|
interface Opts<I> extends ReturnType<typeof useListState<I>>, Pick<UseTabsOptions<I>, 'fallback'> {
|
|
4
13
|
tabHashParam?: string;
|
|
5
14
|
idHashParam?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-queue.d.ts","sourceRoot":"","sources":["../../src/queue/use-queue.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAC1C,OAAgB,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"use-queue.d.ts","sourceRoot":"","sources":["../../src/queue/use-queue.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAC1C,OAAgB,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,YAAY,CAAC;AAMhE;;GAEG;AACH,eAAO,MAAM,eAAe,mBAAmB,CAAC;AAEhD;;;GAGG;AACH,eAAO,MAAM,YAAY,GAAI,CAAC,EAC7B,MAAM,CAAC,GAAG,SAAS,EACnB,IAAI,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,KAClB,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,GAAG,SAAS,CAKhC,CAAC;AAqDH,UAAU,IAAI,CAAC,CAAC,CACf,SACC,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC,CAAC,CAAC,EAClC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC;;;;;;;;;;;;;;;;;;OAkBG;IACH,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IACtC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC;CACtB;AAED,QAAA,MAAM,QAAQ,GAAI,CAAC,EAAE,uEAQlB,IAAI,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAhGM,MAAM,GAAG,SAAS;qBA2I3B,KAAK;oBAtBA,MAAM;;;;;;;;;;;;;;;;;;CAoDjB,CAAC;AAEF,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI,IAAI,CAC7B,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACjC,MAAM,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC,CAAC,CAAC,CACxC,CAAC;yBAEc,CAAC,EAAE,MAAM,QAAQ,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAhLpB,MAAM,GAAG,SAAS;qBA2I3B,KAAK;oBAtBA,MAAM;;;;;;;;;;;;;;;;;;;AA2DlB,wBACgD"}
|
package/dist/queue/use-queue.js
CHANGED
|
@@ -9,6 +9,15 @@ import { useListState } from './use-list';
|
|
|
9
9
|
import useTabs from './use-tabs';
|
|
10
10
|
import useUpdates from './use-updates';
|
|
11
11
|
import { getItems, normalizeHeaders } from './util';
|
|
12
|
+
/**
|
|
13
|
+
* Part name of the active row, as marked by `useRowPartFn`.
|
|
14
|
+
*/
|
|
15
|
+
export const ACTIVE_ROW_PART = 'itemRow-active';
|
|
16
|
+
/**
|
|
17
|
+
* Marks the active item's row with the `itemRow-active` part so the queue
|
|
18
|
+
* stylesheet can highlight it.
|
|
19
|
+
*/
|
|
20
|
+
export const useRowPartFn = (item, id) => useCallback((row) => item != null && id(row) === id(item) ? ACTIVE_ROW_PART : undefined, [item, id]);
|
|
12
21
|
const _id = (item) => item['id'];
|
|
13
22
|
const useQNav = ({ id, api, items, ...thru }) => {
|
|
14
23
|
// Deprecation warning
|
|
@@ -57,7 +66,7 @@ const useQueue = ({ id = _id, api, tabHashParam, idHashParam, fallback, onActiva
|
|
|
57
66
|
mobile,
|
|
58
67
|
hideActions: selected?.length > 0 && activeTab === 'split',
|
|
59
68
|
index: useMemo(() => items.indexOf(item), [item, items]),
|
|
60
|
-
rowPartFn:
|
|
69
|
+
rowPartFn: useRowPartFn(item, id),
|
|
61
70
|
onItemClick: useCallback((e) => {
|
|
62
71
|
const { item: clickedItem, index, activate: mustActivate, } = e.detail;
|
|
63
72
|
const mini = e
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neovici/cosmoz-queue",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.4.0",
|
|
4
4
|
"description": "A reusable queue component for master-detail views with list, split, and queue modes",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"web-components",
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
"@neovici/cosmoz-resizable": "^2.0.0",
|
|
69
69
|
"@neovici/cosmoz-router": "^11.2.8",
|
|
70
70
|
"@neovici/cosmoz-slider": "^5.2.1",
|
|
71
|
-
"@neovici/cosmoz-tabs": "^
|
|
71
|
+
"@neovici/cosmoz-tabs": "^11.0.1",
|
|
72
72
|
"@neovici/cosmoz-tokens": "^3.4.0 || ^4.0.0",
|
|
73
73
|
"@neovici/cosmoz-utils": "^6.22.0",
|
|
74
74
|
"@pionjs/pion": "^2.10.0",
|