@neovici/cosmoz-queue 3.2.0 → 3.2.1
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/list/render-list-core.d.ts +2 -1
- package/dist/list/render-list-core.d.ts.map +1 -1
- package/dist/list/render-list-core.js +2 -1
- package/dist/queue/index.d.ts +1 -1
- package/dist/queue/index.d.ts.map +1 -1
- package/dist/queue/index.js +1 -1
- package/dist/queue/omnitable.d.ts +3 -1
- package/dist/queue/omnitable.d.ts.map +1 -1
- package/dist/queue/omnitable.js +4 -3
- package/dist/queue/queue.d.ts.map +1 -1
- package/dist/queue/queue.js +6 -1
- package/dist/queue/render.js +2 -2
- package/dist/queue/style.d.ts +10 -1
- package/dist/queue/style.d.ts.map +1 -1
- package/dist/queue/style.js +12 -2
- package/package.json +1 -1
|
@@ -16,11 +16,12 @@ export interface RenderListCoreProps<TItem extends object> {
|
|
|
16
16
|
selectedItems: TItem[];
|
|
17
17
|
}) => Renderable;
|
|
18
18
|
compareItemsFn?: (a: TItem, b: TItem) => boolean;
|
|
19
|
+
rowPartFn?: (item: TItem, index: number) => string | undefined;
|
|
19
20
|
}
|
|
20
21
|
export interface RenderListCore<TColumns extends Columns, TItem extends object> extends UseListCoreResult<TColumns, TItem>, RenderListCoreProps<TItem> {
|
|
21
22
|
}
|
|
22
23
|
export declare const renderColumns: <T extends Columns>(columns: T) => import("../types/lit").LitRenderable[];
|
|
23
|
-
export declare const renderListCore: <TColumns extends Columns, TItem extends object>({ settingsId, hashParam, enabledColumns, csvFilename, exposedParts, data$, noLocal, miniBreakpoint, sortOn, setSortOn, descending, setDescending, groupOn, setGroupOn, selectedItems, setSelectedItems, setVisibleItems, hasItems, setFilters, setIsMini, columns, actions, dialog, open, content, loadMore, compareItemsFn, }: RenderListCore<TColumns, TItem>) => (import("lit-html/directive.js").DirectiveResult<new (_partInfo: import("lit-html/directive.js").PartInfo) => import("lit-html/directives/until.js").UntilDirective<import("lit-html").TemplateResult<1> | Promise<symbol | {
|
|
24
|
+
export declare const renderListCore: <TColumns extends Columns, TItem extends object>({ settingsId, hashParam, enabledColumns, csvFilename, exposedParts, data$, noLocal, miniBreakpoint, sortOn, setSortOn, descending, setDescending, groupOn, setGroupOn, selectedItems, setSelectedItems, setVisibleItems, hasItems, setFilters, setIsMini, columns, actions, dialog, open, content, loadMore, compareItemsFn, rowPartFn, }: RenderListCore<TColumns, TItem>) => (import("lit-html/directive.js").DirectiveResult<new (_partInfo: import("lit-html/directive.js").PartInfo) => import("lit-html/directives/until.js").UntilDirective<import("lit-html").TemplateResult<1> | Promise<symbol | {
|
|
24
25
|
toString(): string;
|
|
25
26
|
} | readonly import("@neovici/cosmoz-form").Renderable[] | null | undefined>>> | undefined)[];
|
|
26
27
|
//# sourceMappingURL=render-list-core.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render-list-core.d.ts","sourceRoot":"","sources":["../../src/list/render-list-core.ts"],"names":[],"mappings":"AACA,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAKrD,OAAO,EAAE,MAAM,EAAiB,MAAM,YAAY,CAAC;AACnD,OAAO,KAAK,EAAU,OAAO,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEpD,MAAM,WAAW,mBAAmB,CAAC,KAAK,SAAS,MAAM;IACxD,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,OAAO,CAAC,EAAE,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE,CAAC;IAC/B,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,aAAa,EAAE,KAAK,EAAE,CAAA;KAAE,KAAK,UAAU,CAAC;IAC3D,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,KAAK,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"render-list-core.d.ts","sourceRoot":"","sources":["../../src/list/render-list-core.ts"],"names":[],"mappings":"AACA,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAKrD,OAAO,EAAE,MAAM,EAAiB,MAAM,YAAY,CAAC;AACnD,OAAO,KAAK,EAAU,OAAO,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEpD,MAAM,WAAW,mBAAmB,CAAC,KAAK,SAAS,MAAM;IACxD,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,OAAO,CAAC,EAAE,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE,CAAC;IAC/B,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,aAAa,EAAE,KAAK,EAAE,CAAA;KAAE,KAAK,UAAU,CAAC;IAC3D,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,KAAK,OAAO,CAAC;IACjD,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;CAC/D;AAED,MAAM,WAAW,cAAc,CAAC,QAAQ,SAAS,OAAO,EAAE,KAAK,SAAS,MAAM,CAC7E,SAAQ,iBAAiB,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,mBAAmB,CAAC,KAAK,CAAC;CAAG;AAE1E,eAAO,MAAM,aAAa,GAAI,CAAC,SAAS,OAAO,EAAE,SAAS,CAAC,2CAGzD,CAAC;AAEH,eAAO,MAAM,cAAc,GAAI,QAAQ,SAAS,OAAO,EAAE,KAAK,SAAS,MAAM,EAAE,2UAkC5E,cAAc,CAAC,QAAQ,EAAE,KAAK,CAAC;;6FA4CjC,CAAC"}
|
|
@@ -8,7 +8,7 @@ import { when } from 'lit-html/directives/when.js';
|
|
|
8
8
|
import { renderActions } from '../actions';
|
|
9
9
|
import { renderLoadMore } from './more/render-more';
|
|
10
10
|
export const renderColumns = (columns) => Object.entries(columns).map(([name, column]) => column.render({ ...column, name }));
|
|
11
|
-
export const renderListCore = ({ settingsId, hashParam, enabledColumns, csvFilename, exposedParts, data$, noLocal = true, miniBreakpoint, sortOn, setSortOn, descending, setDescending, groupOn, setGroupOn, selectedItems, setSelectedItems, setVisibleItems, hasItems, setFilters, setIsMini, columns, actions, dialog, open, content, loadMore, compareItemsFn, }) => [
|
|
11
|
+
export const renderListCore = ({ settingsId, hashParam, enabledColumns, csvFilename, exposedParts = 'itemRow, itemRow-active', data$, noLocal = true, miniBreakpoint, sortOn, setSortOn, descending, setDescending, groupOn, setGroupOn, selectedItems, setSelectedItems, setVisibleItems, hasItems, setFilters, setIsMini, columns, actions, dialog, open, content, loadMore, compareItemsFn, rowPartFn, }) => [
|
|
12
12
|
html `<cosmoz-omnitable
|
|
13
13
|
id="omnitable"
|
|
14
14
|
?no-local=${noLocal}
|
|
@@ -21,6 +21,7 @@ export const renderListCore = ({ settingsId, hashParam, enabledColumns, csvFilen
|
|
|
21
21
|
guard([], () => (a, b) => a.id === b.id)}
|
|
22
22
|
.settingsId=${settingsId}
|
|
23
23
|
exportparts=${exposedParts}
|
|
24
|
+
.rowPartFn=${rowPartFn}
|
|
24
25
|
@visible-data-changed=${lift(setVisibleItems)}
|
|
25
26
|
@filters-changed=${lift(setFilters)}
|
|
26
27
|
.selectedItems=${selectedItems}
|
package/dist/queue/index.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ export { itemClick } from './item-click';
|
|
|
9
9
|
export { default as omnitable } from './omnitable';
|
|
10
10
|
export { usePagination } from './pagination';
|
|
11
11
|
export { queue } from './queue';
|
|
12
|
-
export { base, default as renderStyles } from './style';
|
|
12
|
+
export { base, queueStyle, default as renderStyles } from './style';
|
|
13
13
|
export { actions$, mapActions, noActions, default as useFetchActions, } from './use-fetch-actions';
|
|
14
14
|
export type { Item, Props } from './use-fetch-actions';
|
|
15
15
|
export { useListSSE } from './use-list-sse';
|
|
@@ -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,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAElD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAEzC,cAAc,UAAU,CAAC;AAEzB,mBAAmB,SAAS,CAAC;AAC7B,mBAAmB,aAAa,CAAC;AAGjC,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,OAAO,IAAI,YAAY,EAAE,MAAM,SAAS,CAAC;
|
|
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,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAElD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAEzC,cAAc,UAAU,CAAC;AAEzB,mBAAmB,SAAS,CAAC;AAC7B,mBAAmB,aAAa,CAAC;AAGjC,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
|
@@ -12,7 +12,7 @@ export { usePagination } from './pagination';
|
|
|
12
12
|
// Queue core
|
|
13
13
|
export { queue } from './queue';
|
|
14
14
|
// Styling
|
|
15
|
-
export { base, default as renderStyles } from './style';
|
|
15
|
+
export { base, queueStyle, default as renderStyles } from './style';
|
|
16
16
|
// Fetch actions
|
|
17
17
|
export { actions$, mapActions, noActions, default as useFetchActions, } from './use-fetch-actions';
|
|
18
18
|
// SSE
|
|
@@ -3,6 +3,8 @@ import { Rec } from '@neovici/cosmoz-utils/object';
|
|
|
3
3
|
import { Ref } from '@pionjs/pion';
|
|
4
4
|
interface Props<I> {
|
|
5
5
|
exposedParts?: string;
|
|
6
|
+
/** Appended to each row's `part` list (forwarded to the omnitable's rowPartFn). */
|
|
7
|
+
rowPartFn?: (item: I, index: number) => string | undefined;
|
|
6
8
|
settingsId?: string;
|
|
7
9
|
data$?: Promise<I[]>;
|
|
8
10
|
onData?: (v: I[]) => void;
|
|
@@ -14,6 +16,6 @@ interface Props<I> {
|
|
|
14
16
|
onSort?: (v: string) => void;
|
|
15
17
|
ref?: Ref<HTMLElement | undefined>;
|
|
16
18
|
}
|
|
17
|
-
declare const omnitable: <I extends Rec>({ exposedParts, settingsId, data$, onData, selected, onSelected, descending, onDescending, sortOn, onSort, ref: omnitableRef, }: Props<I>, content?: unknown) => import("lit-html").TemplateResult<1>;
|
|
19
|
+
declare const omnitable: <I extends Rec>({ exposedParts, rowPartFn, settingsId, data$, onData, selected, onSelected, descending, onDescending, sortOn, onSort, ref: omnitableRef, }: Props<I>, content?: unknown) => import("lit-html").TemplateResult<1>;
|
|
18
20
|
export default omnitable;
|
|
19
21
|
//# sourceMappingURL=omnitable.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"omnitable.d.ts","sourceRoot":"","sources":["../../src/queue/omnitable.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"omnitable.d.ts","sourceRoot":"","sources":["../../src/queue/omnitable.ts"],"names":[],"mappings":"AAAA,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,GAAG,EAAE,MAAM,8BAA8B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAQnC,UAAU,KAAK,CAAC,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mFAAmF;IACnF,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IAC3D,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;IAErB,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,EAAE,CAAC;IACf,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;IAE9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAEpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAE7B,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC;CACnC;AA0BD,QAAA,MAAM,SAAS,GAAI,CAAC,SAAS,GAAG,EAC/B,4IAaG,KAAK,CAAC,CAAC,CAAC,EACX,UAAU,OAAO,yCAqBjB,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
package/dist/queue/omnitable.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
+
import '@neovici/cosmoz-omnitable';
|
|
1
2
|
import { html } from 'lit-html';
|
|
2
3
|
import { guard } from 'lit-html/directives/guard.js';
|
|
4
|
+
import { ref } from 'lit-html/directives/ref.js';
|
|
3
5
|
import { until } from 'lit-html/directives/until.js';
|
|
4
6
|
import { when } from 'lit-html/directives/when.js';
|
|
5
|
-
import '@neovici/cosmoz-omnitable';
|
|
6
7
|
import { updateWith } from '../util/polymer-property-changed-event.js';
|
|
7
|
-
import { ref } from 'lit-html/directives/ref.js';
|
|
8
8
|
const loading$$ = (data$, loading) => guard([data$, loading], () => when(data$, (data$) => until(data$?.then(() => false, () => false), true), () => loading));
|
|
9
9
|
const data$$ = (data$, data) => guard([data$, data], () => when(data$, () => until(data$, []), () => data));
|
|
10
|
-
const omnitable = ({ exposedParts, settingsId, data$, onData, selected, onSelected, descending, onDescending, sortOn, onSort, ref: omnitableRef, }, content) => html `
|
|
10
|
+
const omnitable = ({ exposedParts = 'itemRow, itemRow-active', rowPartFn, settingsId, data$, onData, selected, onSelected, descending, onDescending, sortOn, onSort, ref: omnitableRef, }, content) => html `
|
|
11
11
|
<cosmoz-omnitable
|
|
12
12
|
${ref((el) => {
|
|
13
13
|
if (omnitableRef)
|
|
@@ -18,6 +18,7 @@ const omnitable = ({ exposedParts, settingsId, data$, onData, selected, onSelect
|
|
|
18
18
|
.data=${data$$(data$)}
|
|
19
19
|
?loading=${loading$$(data$)}
|
|
20
20
|
exportparts=${exposedParts}
|
|
21
|
+
.rowPartFn=${rowPartFn}
|
|
21
22
|
.sortOn=${sortOn}
|
|
22
23
|
@sort-on-changed=${updateWith(onSort)}
|
|
23
24
|
.descending=${descending}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"queue.d.ts","sourceRoot":"","sources":["../../src/queue/queue.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"queue.d.ts","sourceRoot":"","sources":["../../src/queue/queue.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE/C,OAAO,EAAe,WAAW,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAErC,OAAO,QAAQ,EAAE,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEjD,KAAK,UAAU,CAAC,CAAC,IAAI,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;AACpD,KAAK,SAAS,CAAC,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,GAAG;IAChD,GAAG,EAAE,cAAc,CAAC;IACpB,IAAI,EAAE,CAAC,CAAC;CACR,CAAC;AAEF;;;;GAIG;AACH,MAAM,WAAW,WAAW;IAC3B,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACzB,OAAO,CAAC,EAAE,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,KAAK,CAAC,CAAC,EAAE,CAAC,CACnB,SACC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,IAAI,GAAG,KAAK,GAAG,UAAU,CAAC,EAC5C,IAAI,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,GAAG,cAAc,GAAG,QAAQ,CAAC;IAC/D,IAAI,EAAE,CACL,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EACzB,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG;QAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;KAAE,KACpD,cAAc,CAAC;IACpB,IAAI,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,cAAc,CAAC;IACzE,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,cAAc,CAAC;IAC3E,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,mGAAmG;IACnG,KAAK,CAAC,EAAE,WAAW,CAAC;CACpB;AAMD,eAAO,MAAM,KAAK,GAAI,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,sBAsHjD,CAAC"}
|
package/dist/queue/queue.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { useCallback } from '@pionjs/pion';
|
|
1
2
|
import { updateWith } from '../util/polymer-property-changed-event.js';
|
|
2
3
|
import { renderQueue } from './render';
|
|
3
4
|
import useAsyncAction from './use-async-action';
|
|
@@ -13,6 +14,10 @@ export const queue = (props) => {
|
|
|
13
14
|
});
|
|
14
15
|
const { index, hideActions, items, setItems, setSelected, totalAvailable, setTotalAvailable, onItemClick, nav, tabnav, } = queueProps;
|
|
15
16
|
const { listRef, onAsyncSimpleAction } = useAsyncAction(nav);
|
|
17
|
+
// Marks the active row with the static `itemRow-active` part.
|
|
18
|
+
const rowPartFn = useCallback((row) => nav.item != null && nav.id(row) === nav.id(nav.item)
|
|
19
|
+
? 'itemRow-active'
|
|
20
|
+
: undefined, [nav.item, nav.id]);
|
|
16
21
|
const renderProps = {
|
|
17
22
|
...queueProps,
|
|
18
23
|
onAsyncSimpleAction,
|
|
@@ -41,7 +46,7 @@ export const queue = (props) => {
|
|
|
41
46
|
list: list({
|
|
42
47
|
id: 'list',
|
|
43
48
|
slot: 'previous',
|
|
44
|
-
'.
|
|
49
|
+
'.rowPartFn': rowPartFn,
|
|
45
50
|
'.settingsId': settingsId,
|
|
46
51
|
'@visible-items-changed': updateWith(setItems),
|
|
47
52
|
'@selected-items-changed': updateWith(setSelected),
|
package/dist/queue/render.js
CHANGED
|
@@ -9,7 +9,7 @@ import { guard } from 'lit-html/directives/guard.js';
|
|
|
9
9
|
import { ifDefined } from 'lit-html/directives/if-defined.js';
|
|
10
10
|
import { when } from 'lit-html/directives/when.js';
|
|
11
11
|
import { arrow } from './icon';
|
|
12
|
-
import
|
|
12
|
+
import { queueStyle } from './style';
|
|
13
13
|
const _emptySlide = {
|
|
14
14
|
id: 'empty',
|
|
15
15
|
content: nothing,
|
|
@@ -132,7 +132,7 @@ export const renderQueue = ({ header, heading, afterHeading, index, tabnav, item
|
|
|
132
132
|
`;
|
|
133
133
|
return html `
|
|
134
134
|
<style>
|
|
135
|
-
${
|
|
135
|
+
${queueStyle}
|
|
136
136
|
</style>
|
|
137
137
|
|
|
138
138
|
${when(header, (header) => header({ tabnav, heading, afterHeading, totalAvailable }), () => tabn)}
|
package/dist/queue/style.d.ts
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
export declare const base: string;
|
|
2
|
-
|
|
2
|
+
/**
|
|
3
|
+
* Static queue stylesheet, highlighted by the static `itemRow-active` part
|
|
4
|
+
* (marked on the active row via the omnitable's `rowPartFn`).
|
|
5
|
+
*/
|
|
6
|
+
export declare const queueStyle: string;
|
|
7
|
+
/**
|
|
8
|
+
* @deprecated Attach the static `queueStyle` via the pion `styleSheets` option
|
|
9
|
+
* instead. The `index` parameter is ignored.
|
|
10
|
+
*/
|
|
11
|
+
declare const _default: (_opts?: {
|
|
3
12
|
index?: number | string;
|
|
4
13
|
}) => string;
|
|
5
14
|
export default _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../src/queue/style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,QA+EhB,CAAC;
|
|
1
|
+
{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../src/queue/style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,QA+EhB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,QAkBtB,CAAC;AAEF;;;GAGG;yBAEa,QAAQ;IAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,KAAG,MAAM;AAA5D,wBAA2E"}
|
package/dist/queue/style.js
CHANGED
|
@@ -79,10 +79,14 @@ export const base = css `
|
|
|
79
79
|
display: flex;
|
|
80
80
|
}
|
|
81
81
|
`;
|
|
82
|
-
|
|
82
|
+
/**
|
|
83
|
+
* Static queue stylesheet, highlighted by the static `itemRow-active` part
|
|
84
|
+
* (marked on the active row via the omnitable's `rowPartFn`).
|
|
85
|
+
*/
|
|
86
|
+
export const queueStyle = css `
|
|
83
87
|
${base}
|
|
84
88
|
|
|
85
|
-
#list::part(itemRow
|
|
89
|
+
#list::part(itemRow-active) {
|
|
86
90
|
background: var(--cz-color-bg-tertiary);
|
|
87
91
|
}
|
|
88
92
|
|
|
@@ -98,3 +102,9 @@ export default ({ index }) => css `
|
|
|
98
102
|
display: none;
|
|
99
103
|
}
|
|
100
104
|
`;
|
|
105
|
+
/**
|
|
106
|
+
* @deprecated Attach the static `queueStyle` via the pion `styleSheets` option
|
|
107
|
+
* instead. The `index` parameter is ignored.
|
|
108
|
+
*/
|
|
109
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
110
|
+
export default (_opts) => queueStyle;
|