@neovici/cosmoz-queue 2.11.5 → 2.12.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.
@@ -15,7 +15,6 @@ export type { Item, Props } from './use-fetch-actions';
15
15
  export { useListSSE } from './use-list-sse';
16
16
  export { default as useDataNav } from './use-data-nav';
17
17
  export { useMobile } from './use-mobile';
18
- export { default as useSplit } from './use-split';
19
18
  export { default as useTabs } from './use-tabs';
20
19
  export { filter, notify, useList, useListState } from './use-list';
21
20
  //# sourceMappingURL=index.d.ts.map
@@ -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;AAGxD,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,QAAQ,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,YAAY,CAAC;AAGhD,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,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,OAAO,IAAI,YAAY,EAAE,MAAM,SAAS,CAAC;AAGxD,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"}
@@ -20,7 +20,6 @@ export { useListSSE } from './use-list-sse';
20
20
  // Navigation & layout hooks
21
21
  export { default as useDataNav } from './use-data-nav';
22
22
  export { useMobile } from './use-mobile';
23
- export { default as useSplit } from './use-split';
24
23
  export { default as useTabs } from './use-tabs';
25
24
  // List hooks
26
25
  export { filter, notify, useList, useListState } from './use-list';
@@ -7,7 +7,7 @@ type ViewProps<I> = Omit<QueueProps<I>, 'nav'> & {
7
7
  nav: TemplateResult;
8
8
  item: I;
9
9
  };
10
- interface Props<I, D> extends Pick<UseQueue<I>, 'id' | 'api' | 'fallback' | 'split'>, Pick<RenderQueue<I, D>, 'details' | 'afterHeading'> {
10
+ interface Props<I, D> extends Pick<UseQueue<I>, 'id' | 'api' | 'fallback'>, Pick<RenderQueue<I, D>, 'details' | 'afterHeading'> {
11
11
  list: (thru: Record<string, any>, props: QueueProps<I> & {
12
12
  onRef: (el?: Element) => void;
13
13
  }) => TemplateResult;
@@ -1 +1 @@
1
- {"version":3,"file":"queue.d.ts","sourceRoot":"","sources":["../../src/queue/queue.ts"],"names":[],"mappings":"AAAA,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,UAAU,KAAK,CAAC,CAAC,EAAE,CAAC,CACnB,SACC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,IAAI,GAAG,KAAK,GAAG,UAAU,GAAG,OAAO,CAAC,EACtD,IAAI,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,GAAG,cAAc,CAAC;IACpD,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;CACxB;AAMD,eAAO,MAAM,KAAK,GAAI,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,sBA8FjD,CAAC"}
1
+ {"version":3,"file":"queue.d.ts","sourceRoot":"","sources":["../../src/queue/queue.ts"],"names":[],"mappings":"AAAA,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,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,CAAC;IACpD,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;CACxB;AAMD,eAAO,MAAM,KAAK,GAAI,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,sBA8FjD,CAAC"}
@@ -3,14 +3,13 @@ import { renderQueue } from './render';
3
3
  import useAsyncAction from './use-async-action';
4
4
  import useQueue from './use-queue';
5
5
  export const queue = (props) => {
6
- const { heading, afterHeading, settingsId, idHashParam = 'qid', tabHashParam = 'qtab', id, api, details, list, view, loader, pagination, fallback, split, } = props;
6
+ const { heading, afterHeading, settingsId, idHashParam = 'qid', tabHashParam = 'qtab', id, api, details, list, view, loader, pagination, fallback, } = props;
7
7
  const queueProps = useQueue({
8
8
  id,
9
9
  api,
10
10
  idHashParam,
11
11
  tabHashParam,
12
12
  fallback,
13
- split,
14
13
  });
15
14
  const { index, hideActions, items, setItems, setSelected, totalAvailable, setTotalAvailable, onItemClick, nav, tabnav, } = queueProps;
16
15
  const { listRef, onAsyncSimpleAction } = useAsyncAction(nav);
@@ -28,8 +27,10 @@ export const queue = (props) => {
28
27
  totalAvailable,
29
28
  nav,
30
29
  pagination,
30
+ persistKey: settingsId ? `${settingsId}-split` : undefined,
31
31
  list: list({
32
32
  id: 'list',
33
+ slot: 'previous',
33
34
  '.exposedParts': `itemRow, itemRow-${index}`,
34
35
  '.settingsId': settingsId,
35
36
  '@visible-items-changed': updateWith(setItems),
@@ -1,3 +1,4 @@
1
+ import '@neovici/cosmoz-resizable';
1
2
  import { RenderTabs } from '@neovici/cosmoz-tabs/next/index.js';
2
3
  import { nothing, TemplateResult } from 'lit-html';
3
4
  import type { Pagination } from './types';
@@ -64,11 +65,12 @@ export interface RenderQueue<I, D> extends Pick<RenderView<I, D>, 'renderItem' |
64
65
  totalAvailable?: number;
65
66
  list: TemplateResult;
66
67
  pagination?: Pagination;
68
+ persistKey?: string;
67
69
  tabnav: RenderTabs<Tab>;
68
70
  nav: Omit<RenderSlide<I, D>, 'renderItem' | 'renderLoader' | 'details'> & Pick<RenderView<I, D>, 'details'> & {
69
71
  index: number;
70
72
  };
71
73
  }
72
- export declare const renderQueue: <I, D>({ heading, afterHeading, index, tabnav, items, totalAvailable, nav, list, renderLoader, renderItem, details, pagination: _pagination, }: RenderQueue<I, D>) => TemplateResult<1>;
74
+ export declare const renderQueue: <I, D>({ heading, afterHeading, index, tabnav, items, totalAvailable, nav, list, renderLoader, renderItem, details, pagination: _pagination, persistKey, }: RenderQueue<I, D>) => TemplateResult<1>;
73
75
  export {};
74
76
  //# sourceMappingURL=render.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/queue/render.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/queue/render.ts"],"names":[],"mappings":"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"}
@@ -1,3 +1,4 @@
1
+ import '@neovici/cosmoz-resizable';
1
2
  import { slideInLeft, slideInRight } from '@neovici/cosmoz-slider';
2
3
  import { renderTabs } from '@neovici/cosmoz-tabs/next/index.js';
3
4
  import { lazyUntil } from '@neovici/cosmoz-utils/directives/lazy-until';
@@ -101,7 +102,7 @@ export const renderSlide = ({ id, forward, item, ...thru }) => item
101
102
  animation: forward ? slideInRight : slideInLeft,
102
103
  }
103
104
  : emptySlide();
104
- export const renderQueue = ({ heading, afterHeading, index, tabnav, items, totalAvailable, nav, list, renderLoader, renderItem, details = nav?.details, pagination: _pagination, }) => {
105
+ export const renderQueue = ({ heading, afterHeading, index, tabnav, items, totalAvailable, nav, list, renderLoader, renderItem, details = nav?.details, pagination: _pagination, persistKey, }) => {
105
106
  const activeTab = tabnav.active?.name;
106
107
  const pagination = _pagination
107
108
  ? { ..._pagination, totalAvailable }
@@ -125,12 +126,17 @@ export const renderQueue = ({ heading, afterHeading, index, tabnav, items, total
125
126
  ${renderPagination(pagination)}
126
127
  </cosmoz-tabs-next>
127
128
 
128
- <div class="split" data-active=${activeTab}>
129
+ <cosmoz-resizable-view
130
+ data-active=${activeTab}
131
+ direction="horizontal"
132
+ persist=${persistKey}
133
+ >
129
134
  ${list}
130
135
  <cosmoz-slider
131
136
  id="queue"
137
+ slot="next"
132
138
  .slide=${when(activeTab !== 'overview', () => renderSlide({ ...nav, renderLoader, renderItem, details }), emptySlide)}
133
139
  ></cosmoz-slider>
134
- </div>
140
+ </cosmoz-resizable-view>
135
141
  `;
136
142
  };
@@ -1 +1 @@
1
- {"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../src/queue/style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,QA8KhB,CAAC;yBAEc,WAAW;IAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE;AAAtD,wBAoBE"}
1
+ {"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../src/queue/style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,QAkIhB,CAAC;yBAEc,WAAW;IAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE;AAAtD,wBAoBE"}
@@ -41,62 +41,18 @@ export const base = css `
41
41
  white-space: nowrap;
42
42
  }
43
43
 
44
- .split {
45
- display: flex;
46
- flex: auto;
47
- flex-direction: row;
48
- min-height: 0;
49
- }
50
-
51
- .gutter {
52
- cursor: col-resize;
53
- flex: none;
54
- display: flex;
55
- background: var(--cz-queue-gutter-bg, var(--cz-header-bg-color, #fff));
56
- z-index: 2;
57
- position: relative;
58
- }
59
- .gutter::before {
60
- content: '';
61
- display: block;
62
- flex: none;
63
- background: var(--cz-queue-gutter-bg, var(--cz-header-bg-color, #bbb));
64
- width: 1px;
65
- margin-left: auto;
66
- pointer-events: none;
67
- }
68
- .gutter:hover::before {
69
- background: var(--cz-accent-color);
70
- box-shadow: -1px 0 0 1px var(--cz-accent-color);
71
- }
72
- .gutter:hover::after {
73
- content: '';
74
- display: block;
75
- position: absolute;
76
- top: 0;
77
- left: -2px;
78
- right: -2px;
79
- bottom: 0;
80
- }
81
-
82
44
  #list {
83
- min-width: 0;
84
- }
85
- #list,
86
- #queue {
87
- flex: auto;
45
+ flex-basis: 25%;
46
+ min-width: 300px;
88
47
  }
89
48
 
90
49
  [data-active='split'] .view-core::part(header-bg) {
91
50
  border-top-left-radius: 0;
92
51
  }
93
52
 
94
- [data-active='overview'] .view-core,
53
+ [data-active='overview'] #queue,
95
54
  [data-active='queue'] #list {
96
- display: none;
97
- }
98
- [data-active='overview'] #queue {
99
- flex: none;
55
+ display: none !important;
100
56
  }
101
57
 
102
58
  .button-nav {
@@ -1,5 +1,4 @@
1
1
  import { useListState } from './use-list';
2
- import { SplitOpts } from './use-split';
3
2
  import { Options as UseTabsOptions } from './use-tabs';
4
3
  interface Opts<I> extends ReturnType<typeof useListState<I>>, Pick<UseTabsOptions<I>, 'fallback'> {
5
4
  tabHashParam?: string;
@@ -26,9 +25,10 @@ interface Opts<I> extends ReturnType<typeof useListState<I>>, Pick<UseTabsOption
26
25
  */
27
26
  api?: (id: string, item: I) => string;
28
27
  id?: (i: I) => string;
29
- split?: SplitOpts;
28
+ /** @deprecated Split sizing is now controlled via CSS */
29
+ split?: Record<string, unknown>;
30
30
  }
31
- declare const useQueue: <I>({ id, api, tabHashParam, idHashParam, fallback, onActivate, split, ...thru }: Opts<I>) => {
31
+ declare const useQueue: <I>({ id, api, tabHashParam, idHashParam, fallback, onActivate, ...thru }: Opts<I>) => {
32
32
  tabnav: import("@neovici/cosmoz-tabs/next/use-tabs.js").Result<{
33
33
  readonly name: "overview";
34
34
  readonly title: string;
@@ -80,6 +80,8 @@ declare const useQueue: <I>({ id, api, tabHashParam, idHashParam, fallback, onAc
80
80
  prev: (() => void) | undefined;
81
81
  next: (() => void) | undefined;
82
82
  };
83
+ /** @deprecated Split sizing is now controlled via CSS */
84
+ split?: Record<string, unknown>;
83
85
  totalAvailable: number | undefined;
84
86
  setTotalAvailable: import("@pionjs/pion").StateUpdater<number | undefined>;
85
87
  items: I[];
@@ -140,6 +142,8 @@ declare const _default: <I>(thru: UseQueue<I>) => {
140
142
  prev: (() => void) | undefined;
141
143
  next: (() => void) | undefined;
142
144
  };
145
+ /** @deprecated Split sizing is now controlled via CSS */
146
+ split?: Record<string, unknown>;
143
147
  totalAvailable: number | undefined;
144
148
  setTotalAvailable: import("@pionjs/pion").StateUpdater<number | undefined>;
145
149
  items: I[];
@@ -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,OAAiB,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAClD,OAAgB,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,YAAY,CAAC;AAyDhE,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;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,QAAA,MAAM,QAAQ,GAAI,CAAC,EAAE,8EASlB,IAAI,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA2CH,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBArC7B,KAAK;oBAtBA,MAAM;;;;;;;;;;;;;;;;;;;AA2DlB,wBACgD"}
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;AAyDhE,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;IACtB,yDAAyD;IACzD,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAChC;AAED,QAAA,MAAM,QAAQ,GAAI,CAAC,EAAE,uEAQlB,IAAI,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA0CH,KAAK;oBArBA,MAAM;;;;;;;;;;;;IAjCjB,yDAAyD;YACjD,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;;;;;;;CAmF/B,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBArC7B,KAAK;oBArBA,MAAM;;;;;;;;;;;;IAjCjB,yDAAyD;YACjD,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;;;;;;;;AA0FhC,wBACgD"}
@@ -6,7 +6,6 @@ import { useMobile } from './use-mobile';
6
6
  import useDataNav from './use-data-nav';
7
7
  import useKeyNav from './use-key-nav';
8
8
  import { useListState } from './use-list';
9
- import useSplit from './use-split';
10
9
  import useTabs from './use-tabs';
11
10
  import useUpdates from './use-updates';
12
11
  import { getItems, normalizeHeaders } from './util';
@@ -29,7 +28,7 @@ const useQNav = ({ id, api, items, ...thru }) => {
29
28
  });
30
29
  return { ...pass, id, details };
31
30
  };
32
- const useQueue = ({ id = _id, api, tabHashParam, idHashParam, fallback, onActivate, split, ...thru }) => {
31
+ const useQueue = ({ id = _id, api, tabHashParam, idHashParam, fallback, onActivate, ...thru }) => {
33
32
  const { items: _items, selected } = thru, mobile = useMobile(), items = useMemo(() => normalizeHeaders(_items), [_items]), queueItems = useMemo(() => getItems(items, selected), [items, selected]), { tabnav, activeTab } = useTabs({
34
33
  items: queueItems,
35
34
  hashParam: tabHashParam,
@@ -50,7 +49,6 @@ const useQueue = ({ id = _id, api, tabHashParam, idHashParam, fallback, onActiva
50
49
  setItem(items[Math.min(idx + 1, items.length - 1)]);
51
50
  }, [item, id, items]);
52
51
  useKeyNav({ activeTab, ...nav });
53
- useSplit({ activeTab, ...split });
54
52
  useUpdates({ ensue, ...nav });
55
53
  return {
56
54
  ...thru,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@neovici/cosmoz-queue",
3
- "version": "2.11.5",
3
+ "version": "2.12.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",
@@ -53,7 +53,6 @@
53
53
  ".": "./dist/index.js",
54
54
  "./use-queue": "./dist/queue/use-queue.js",
55
55
  "./use-tabs": "./dist/queue/use-tabs.js",
56
- "./use-split": "./dist/queue/use-split.js",
57
56
  "./use-data-nav": "./dist/queue/use-data-nav.js",
58
57
  "./use-list": "./dist/queue/use-list.js",
59
58
  "./util/fetch": "./dist/util/fetch/fetch.js",
@@ -65,14 +64,14 @@
65
64
  "dependencies": {
66
65
  "@neovici/cosmoz-form": "^1.0.1 || ^2.0.0 || ^3.2.0-beta.1",
67
66
  "@neovici/cosmoz-omnitable": "^16.0.3 || ^17.0.0 || ^18.6.0",
67
+ "@neovici/cosmoz-resizable": "^2.0.0",
68
68
  "@neovici/cosmoz-router": "^11.2.8",
69
69
  "@neovici/cosmoz-slider": "^5.2.1",
70
70
  "@neovici/cosmoz-tabs": "^9.3.2",
71
71
  "@neovici/cosmoz-utils": "^6.22.0",
72
72
  "@pionjs/pion": "^2.10.0",
73
73
  "i18next": ">=23.0.0 <27.0.0",
74
- "lit-html": "^3.3.1",
75
- "split.js": "^1.6.5"
74
+ "lit-html": "^3.3.1"
76
75
  },
77
76
  "devDependencies": {
78
77
  "@changesets/cli": "^2.31.0",
@@ -87,16 +86,15 @@
87
86
  "@storybook/web-components-vite": "^10.0.0",
88
87
  "@types/node": "^22.10.2",
89
88
  "@types/react": "^19.2.13",
90
- "@types/split.js": "^1.6.0",
91
89
  "@vitest/browser": "^4.0.0",
92
90
  "@vitest/browser-playwright": "^4.0.0",
93
91
  "esbuild": "^0.27.0",
94
92
  "http-server": "^14.1.1",
95
93
  "husky": "^9.0.11",
96
94
  "jsdom": "^26.0.0",
97
- "playwright": "^1.60.0",
98
95
  "storybook": "^10.0.0",
99
96
  "typescript": "^5.4.3",
97
+ "@playwright/test": "1.60.0",
100
98
  "vitest": "^4.0.0"
101
99
  }
102
100
  }
@@ -1,8 +0,0 @@
1
- import Split from 'split.js';
2
- export type SplitOpts = Pick<Split.Options, 'sizes' | 'minSize' | 'expandToMin' | 'snapOffset'>;
3
- interface Opts extends SplitOpts {
4
- activeTab: string;
5
- }
6
- declare const _default: ({ activeTab, ...opts }: Opts) => void;
7
- export default _default;
8
- //# sourceMappingURL=use-split.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"use-split.d.ts","sourceRoot":"","sources":["../../src/queue/use-split.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,UAAU,CAAC;AAE7B,MAAM,MAAM,SAAS,GAAG,IAAI,CAC3B,KAAK,CAAC,OAAO,EACb,OAAO,GAAG,SAAS,GAAG,aAAa,GAAG,YAAY,CAClD,CAAC;AAEF,UAAU,IAAK,SAAQ,SAAS;IAC/B,SAAS,EAAE,MAAM,CAAC;CAClB;yBAEe,wBAAwB,IAAI;AAA5C,wBAyBE"}
@@ -1,30 +0,0 @@
1
- import { useRef, useEffect } from '@pionjs/pion';
2
- import { useMeta } from '@neovici/cosmoz-utils/hooks/use-meta';
3
- import { useHost } from '@neovici/cosmoz-utils/hooks/use-host';
4
- import Split from 'split.js';
5
- export default ({ activeTab, ...opts }) => {
6
- const splitRef = useRef(undefined);
7
- const host = useHost();
8
- const meta = useMeta(opts);
9
- useEffect(() => {
10
- if (activeTab !== 'split')
11
- return;
12
- const root = host.shadowRoot;
13
- const list = root.querySelector('#list');
14
- const queue = root.querySelector('#queue');
15
- const listMinWidth = Array.isArray(meta.minSize)
16
- ? meta.minSize[0]
17
- : undefined;
18
- if (listMinWidth != null && list) {
19
- list.style.minWidth = `${listMinWidth}px`;
20
- }
21
- splitRef.current = Split([list, queue], {
22
- gutterSize: 2,
23
- ...meta,
24
- });
25
- return () => {
26
- splitRef.current?.destroy();
27
- list.style.minWidth = '';
28
- };
29
- }, [activeTab]);
30
- };