@neovici/cosmoz-queue 2.11.5 → 3.0.0-beta.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/render.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/queue/render.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/queue/render.ts"],"names":[],"mappings":"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"}
|
package/dist/queue/render.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import '@neovici/cosmoz-button';
|
|
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';
|
|
@@ -13,7 +14,8 @@ const _emptySlide = {
|
|
|
13
14
|
animation: slideInRight,
|
|
14
15
|
};
|
|
15
16
|
const emptySlide = () => _emptySlide;
|
|
16
|
-
export const renderNav = ({ next, prev, }) => html ` <button
|
|
17
|
+
export const renderNav = ({ next, prev, }) => html ` <cosmoz-button
|
|
18
|
+
variant="secondary"
|
|
17
19
|
class="button-nav prev"
|
|
18
20
|
title="${t('Previous item')}"
|
|
19
21
|
?disabled=${!prev}
|
|
@@ -21,8 +23,9 @@ export const renderNav = ({ next, prev, }) => html ` <button
|
|
|
21
23
|
@click=${prev}
|
|
22
24
|
>
|
|
23
25
|
${arrow}
|
|
24
|
-
</button>
|
|
25
|
-
<button
|
|
26
|
+
</cosmoz-button>
|
|
27
|
+
<cosmoz-button
|
|
28
|
+
variant="secondary"
|
|
26
29
|
title="${t('Next item')}"
|
|
27
30
|
class="button-nav next"
|
|
28
31
|
?disabled=${!next}
|
|
@@ -30,7 +33,7 @@ export const renderNav = ({ next, prev, }) => html ` <button
|
|
|
30
33
|
@click=${next}
|
|
31
34
|
>
|
|
32
35
|
${arrow}
|
|
33
|
-
</button>`;
|
|
36
|
+
</cosmoz-button>`;
|
|
34
37
|
export const renderPagination = (pagination) => {
|
|
35
38
|
if (!pagination)
|
|
36
39
|
return nothing;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../src/queue/style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../src/queue/style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,QA2JhB,CAAC;yBAEc,WAAW;IAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE;AAAtD,wBAkBE"}
|
package/dist/queue/style.js
CHANGED
|
@@ -3,41 +3,51 @@ export const base = css `
|
|
|
3
3
|
:host {
|
|
4
4
|
display: flex;
|
|
5
5
|
flex-direction: column;
|
|
6
|
-
height: 100
|
|
6
|
+
height: calc(100% - var(--cz-spacing) * 6);
|
|
7
7
|
position: relative;
|
|
8
|
-
font-size:
|
|
8
|
+
font-size: var(--cz-text-sm);
|
|
9
|
+
line-height: var(--cz-text-sm-line-height);
|
|
10
|
+
padding-block: calc(var(--cz-spacing) * 3) 0;
|
|
11
|
+
padding-inline: calc(var(--cz-spacing) * 3);
|
|
12
|
+
border: 1px solid var(--cz-color-border-primary);
|
|
13
|
+
background: var(--cz-color-bg-secondary);
|
|
14
|
+
border-radius: var(--cz-radius-xl);
|
|
15
|
+
margin-inline: calc(var(--cz-spacing) * 3);
|
|
9
16
|
}
|
|
10
17
|
|
|
11
18
|
.tabn {
|
|
12
|
-
--cosmoz-tabs-bg-color: var(--cz-bg-color);
|
|
13
19
|
box-shadow: none;
|
|
14
20
|
position: relative;
|
|
15
|
-
color: #959ba5;
|
|
16
21
|
}
|
|
17
22
|
.tabn-tab {
|
|
18
23
|
flex: 0 1 0.000001px;
|
|
19
24
|
flex: 0 1 min-content;
|
|
20
25
|
padding: 11px 16px;
|
|
21
26
|
background: inherit;
|
|
27
|
+
color: var(--cz-color-gray-400);
|
|
22
28
|
}
|
|
23
29
|
.tabn-tab:first-of-type {
|
|
24
30
|
margin-left: auto;
|
|
25
31
|
}
|
|
32
|
+
|
|
26
33
|
.tabn-tab[active] {
|
|
27
|
-
color: var(--cz-
|
|
34
|
+
color: var(--cz-color-text-primary);
|
|
28
35
|
box-shadow: none;
|
|
29
36
|
}
|
|
37
|
+
.tabn-tab:hover {
|
|
38
|
+
color: red;
|
|
39
|
+
}
|
|
30
40
|
.tabn-heading {
|
|
31
|
-
font-size:
|
|
32
|
-
font-weight:
|
|
33
|
-
line-height:
|
|
34
|
-
color: var(--cz-
|
|
41
|
+
font-size: var(--cz-text-lg);
|
|
42
|
+
font-weight: var(--cz-font-weight-semibold);
|
|
43
|
+
line-height: var(--cz-text-lg-line-height);
|
|
44
|
+
color: var(--cz-color-text-secondary);
|
|
35
45
|
margin-left: 18px;
|
|
36
46
|
white-space: nowrap;
|
|
37
47
|
}
|
|
38
48
|
.tabn-stats {
|
|
39
|
-
margin: 0
|
|
40
|
-
color: var(--cz-text-
|
|
49
|
+
margin: 0 calc(var(--cz-spacing) * 4);
|
|
50
|
+
color: var(--cz-color-text-secondary);
|
|
41
51
|
white-space: nowrap;
|
|
42
52
|
}
|
|
43
53
|
|
|
@@ -52,7 +62,7 @@ export const base = css `
|
|
|
52
62
|
cursor: col-resize;
|
|
53
63
|
flex: none;
|
|
54
64
|
display: flex;
|
|
55
|
-
background: var(--cz-
|
|
65
|
+
background: var(--cz-color-gray-200);
|
|
56
66
|
z-index: 2;
|
|
57
67
|
position: relative;
|
|
58
68
|
}
|
|
@@ -60,14 +70,14 @@ export const base = css `
|
|
|
60
70
|
content: '';
|
|
61
71
|
display: block;
|
|
62
72
|
flex: none;
|
|
63
|
-
background: var(--cz-
|
|
73
|
+
background: var(--cz-color-gray-300);
|
|
64
74
|
width: 1px;
|
|
65
75
|
margin-left: auto;
|
|
66
76
|
pointer-events: none;
|
|
67
77
|
}
|
|
68
78
|
.gutter:hover::before {
|
|
69
|
-
background: var(--cz-
|
|
70
|
-
box-shadow: -1px 0 0 1px var(--cz-
|
|
79
|
+
background: var(--cz-color-bg-brand-secondary);
|
|
80
|
+
box-shadow: -1px 0 0 1px var(--cz-color-bg-brand-secondary);
|
|
71
81
|
}
|
|
72
82
|
.gutter:hover::after {
|
|
73
83
|
content: '';
|
|
@@ -99,35 +109,6 @@ export const base = css `
|
|
|
99
109
|
flex: none;
|
|
100
110
|
}
|
|
101
111
|
|
|
102
|
-
.button-nav {
|
|
103
|
-
flex: none;
|
|
104
|
-
width: 40px;
|
|
105
|
-
height: 40px;
|
|
106
|
-
cursor: pointer;
|
|
107
|
-
outline: none;
|
|
108
|
-
background-color: var(--cz-button-nav-bg, #fff);
|
|
109
|
-
border-radius: 500px;
|
|
110
|
-
border: solid 1px var(--cz-button-nav-border, #a4abae);
|
|
111
|
-
font-size: 1.08em;
|
|
112
|
-
letter-spacing: -0.01em;
|
|
113
|
-
padding: 0 10px;
|
|
114
|
-
text-transform: none;
|
|
115
|
-
display: flex;
|
|
116
|
-
flex-direction: row;
|
|
117
|
-
align-items: center;
|
|
118
|
-
justify-content: center;
|
|
119
|
-
color: var(--cz-button-nav-color, #343434);
|
|
120
|
-
font-weight: normal;
|
|
121
|
-
margin: 0 0.29em;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
.button-nav[disabled] {
|
|
125
|
-
opacity: 0.5;
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
.button-nav:active {
|
|
129
|
-
background: var(--cz-button-nav-active-bg, rgba(52, 52, 52, 0.4));
|
|
130
|
-
}
|
|
131
112
|
.button-nav.prev,
|
|
132
113
|
.button-page.prev,
|
|
133
114
|
.page-prev {
|
|
@@ -178,15 +159,13 @@ export default ({ index }) => css `
|
|
|
178
159
|
${base}
|
|
179
160
|
|
|
180
161
|
#list::part(itemRow-${index || '0'}) {
|
|
181
|
-
background: var(
|
|
182
|
-
--cosmoz-omnitable-highlight-color,
|
|
183
|
-
rgba(80, 138, 239, 0.4)
|
|
184
|
-
);
|
|
162
|
+
background: var(--cz-color-bg-tertiary);
|
|
185
163
|
}
|
|
186
164
|
|
|
187
165
|
:host([data-mobile]) .tabn-heading {
|
|
188
|
-
font-size:
|
|
189
|
-
|
|
166
|
+
font-size: var(--cz-text-sm);
|
|
167
|
+
line-height: var(--cz-text-sm-line-height);
|
|
168
|
+
margin-left: calc(var(--cz-spacing) * 3);
|
|
190
169
|
}
|
|
191
170
|
:host([data-mobile]) .tabn-tab {
|
|
192
171
|
padding: 10px;
|
|
@@ -29,7 +29,7 @@ interface Opts<I> extends ReturnType<typeof useListState<I>>, Pick<UseTabsOption
|
|
|
29
29
|
split?: SplitOpts;
|
|
30
30
|
}
|
|
31
31
|
declare const useQueue: <I>({ id, api, tabHashParam, idHashParam, fallback, onActivate, split, ...thru }: Opts<I>) => {
|
|
32
|
-
tabnav: import("@neovici/cosmoz-tabs/next
|
|
32
|
+
tabnav: import("@neovici/cosmoz-tabs/next").Result<{
|
|
33
33
|
readonly name: "overview";
|
|
34
34
|
readonly title: string;
|
|
35
35
|
readonly disabled: false;
|
|
@@ -89,7 +89,7 @@ declare const useQueue: <I>({ id, api, tabHashParam, idHashParam, fallback, onAc
|
|
|
89
89
|
};
|
|
90
90
|
export type UseQueue<I> = Omit<Parameters<typeof useQueue<I>>[0], keyof ReturnType<typeof useListState<I>>>;
|
|
91
91
|
declare const _default: <I>(thru: UseQueue<I>) => {
|
|
92
|
-
tabnav: import("@neovici/cosmoz-tabs/next
|
|
92
|
+
tabnav: import("@neovici/cosmoz-tabs/next").Result<{
|
|
93
93
|
readonly name: "overview";
|
|
94
94
|
readonly title: string;
|
|
95
95
|
readonly disabled: false;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neovici/cosmoz-queue",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.0-beta.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",
|
|
@@ -63,11 +63,13 @@
|
|
|
63
63
|
"./list/more/render": "./dist/list/more/render-more.js"
|
|
64
64
|
},
|
|
65
65
|
"dependencies": {
|
|
66
|
+
"@neovici/cosmoz-button": "^1.1.0",
|
|
66
67
|
"@neovici/cosmoz-form": "^1.0.1 || ^2.0.0 || ^3.2.0-beta.1",
|
|
67
68
|
"@neovici/cosmoz-omnitable": "^16.0.3 || ^17.0.0 || ^18.6.0",
|
|
68
69
|
"@neovici/cosmoz-router": "^11.2.8",
|
|
69
70
|
"@neovici/cosmoz-slider": "^5.2.1",
|
|
70
|
-
"@neovici/cosmoz-tabs": "^
|
|
71
|
+
"@neovici/cosmoz-tabs": "^10.0.0-beta.1",
|
|
72
|
+
"@neovici/cosmoz-tokens": "^3.4.0",
|
|
71
73
|
"@neovici/cosmoz-utils": "^6.22.0",
|
|
72
74
|
"@pionjs/pion": "^2.10.0",
|
|
73
75
|
"i18next": ">=23.0.0 <27.0.0",
|