@furystack/shades-common-components 3.0.4 → 3.1.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/components/app-bar-link.js +39 -0
- package/dist/components/app-bar-link.js.map +1 -0
- package/dist/components/app-bar.js +1 -2
- package/dist/components/app-bar.js.map +1 -1
- package/dist/components/data-grid/body.js +6 -26
- package/dist/components/data-grid/body.js.map +1 -1
- package/dist/components/data-grid/data-grid-row.js +62 -0
- package/dist/components/data-grid/data-grid-row.js.map +1 -0
- package/dist/components/data-grid/data-grid.js +16 -17
- package/dist/components/data-grid/data-grid.js.map +1 -1
- package/dist/components/data-grid/footer.js +8 -6
- package/dist/components/data-grid/footer.js.map +1 -1
- package/dist/components/data-grid/header.js +1 -1
- package/dist/components/data-grid/header.js.map +1 -1
- package/dist/components/data-grid/index.js +1 -0
- package/dist/components/data-grid/index.js.map +1 -1
- package/dist/components/data-grid/selection-cell.js +32 -0
- package/dist/components/data-grid/selection-cell.js.map +1 -0
- package/dist/components/grid.js +1 -3
- package/dist/components/grid.js.map +1 -1
- package/dist/components/index.js +1 -0
- package/dist/components/index.js.map +1 -1
- package/dist/components/paper.js +1 -1
- package/dist/components/paper.js.map +1 -1
- package/dist/services/collection-service.js +80 -2
- package/dist/services/collection-service.js.map +1 -1
- package/package.json +7 -6
- package/src/components/app-bar-link.tsx +44 -0
- package/src/components/app-bar.tsx +1 -2
- package/src/components/data-grid/body.tsx +15 -40
- package/src/components/data-grid/data-grid-row.tsx +88 -0
- package/src/components/data-grid/data-grid.tsx +25 -32
- package/src/components/data-grid/footer.tsx +22 -20
- package/src/components/data-grid/header.tsx +1 -1
- package/src/components/data-grid/index.tsx +1 -0
- package/src/components/data-grid/selection-cell.tsx +32 -0
- package/src/components/grid.tsx +1 -1
- package/src/components/index.ts +1 -0
- package/src/components/paper.tsx +1 -1
- package/src/services/collection-service.ts +88 -2
- package/tsconfig.json +2 -1
- package/tsconfig.tsbuildinfo +1 -1
- package/types/components/animations.d.ts +2 -2
- package/types/components/animations.d.ts.map +1 -1
- package/types/components/app-bar-link.d.ts +3 -0
- package/types/components/app-bar-link.d.ts.map +1 -0
- package/types/components/app-bar.d.ts.map +1 -1
- package/types/components/data-grid/body.d.ts +0 -2
- package/types/components/data-grid/body.d.ts.map +1 -1
- package/types/components/data-grid/data-grid-row.d.ts +15 -0
- package/types/components/data-grid/data-grid-row.d.ts.map +1 -0
- package/types/components/data-grid/data-grid.d.ts +4 -9
- package/types/components/data-grid/data-grid.d.ts.map +1 -1
- package/types/components/data-grid/footer.d.ts.map +1 -1
- package/types/components/data-grid/index.d.ts +1 -0
- package/types/components/data-grid/index.d.ts.map +1 -1
- package/types/components/data-grid/selection-cell.d.ts +6 -0
- package/types/components/data-grid/selection-cell.d.ts.map +1 -0
- package/types/components/index.d.ts +1 -0
- package/types/components/index.d.ts.map +1 -1
- package/types/services/collection-service.d.ts +4 -1
- package/types/services/collection-service.d.ts.map +1 -1
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.AppBarLink = void 0;
|
|
4
|
+
const shades_1 = require("@furystack/shades");
|
|
5
|
+
const path_to_regexp_1 = require("path-to-regexp");
|
|
6
|
+
const services_1 = require("../services");
|
|
7
|
+
exports.AppBarLink = (0, shades_1.Shade)({
|
|
8
|
+
getInitialState: () => ({ isActive: false }),
|
|
9
|
+
resources: ({ injector, props, updateState, element, getState }) => {
|
|
10
|
+
const updateColor = () => {
|
|
11
|
+
const { isActive } = getState();
|
|
12
|
+
const themeProviderService = injector.getInstance(services_1.ThemeProviderService);
|
|
13
|
+
const theme = themeProviderService.theme.getValue();
|
|
14
|
+
const el = element.querySelector('a');
|
|
15
|
+
const backgroundColor = isActive ? theme.button.active : 'rgba(128, 128, 128, 0.05)';
|
|
16
|
+
el.style.backgroundColor = backgroundColor;
|
|
17
|
+
el.style.color = themeProviderService.getTextColor(backgroundColor);
|
|
18
|
+
};
|
|
19
|
+
return [
|
|
20
|
+
injector.getInstance(shades_1.LocationService).onLocationChanged.subscribe(async (currentUrl) => {
|
|
21
|
+
const isActive = !!(0, path_to_regexp_1.match)(props.href)(currentUrl);
|
|
22
|
+
updateState({ isActive }, false);
|
|
23
|
+
updateColor();
|
|
24
|
+
}, true),
|
|
25
|
+
];
|
|
26
|
+
},
|
|
27
|
+
shadowDomName: 'shade-app-bar-link',
|
|
28
|
+
render: ({ children, props }) => {
|
|
29
|
+
return ((0, shades_1.createComponent)(shades_1.RouteLink, { style: {
|
|
30
|
+
display: 'flex',
|
|
31
|
+
height: '100%',
|
|
32
|
+
textDecoration: 'none',
|
|
33
|
+
alignItems: 'center',
|
|
34
|
+
padding: '0 8px',
|
|
35
|
+
...props.style,
|
|
36
|
+
}, ...props }, children));
|
|
37
|
+
},
|
|
38
|
+
});
|
|
39
|
+
//# sourceMappingURL=app-bar-link.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"app-bar-link.js","sourceRoot":"","sources":["../../src/components/app-bar-link.tsx"],"names":[],"mappings":";;;AAAA,8CAAsG;AACtG,mDAAsC;AACtC,0CAAkD;AAErC,QAAA,UAAU,GAAG,IAAA,cAAK,EAAwC;IACrE,eAAe,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;IAC5C,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE;QACjE,MAAM,WAAW,GAAG,GAAG,EAAE;YACvB,MAAM,EAAE,QAAQ,EAAE,GAAG,QAAQ,EAAE,CAAA;YAC/B,MAAM,oBAAoB,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAA;YACvE,MAAM,KAAK,GAAG,oBAAoB,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAA;YACnD,MAAM,EAAE,GAAG,OAAO,CAAC,aAAa,CAAC,GAAG,CAAgB,CAAA;YACpD,MAAM,eAAe,GAAG,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,2BAA2B,CAAA;YAEpF,EAAE,CAAC,KAAK,CAAC,eAAe,GAAG,eAAe,CAAA;YAC1C,EAAE,CAAC,KAAK,CAAC,KAAK,GAAG,oBAAoB,CAAC,YAAY,CAAC,eAAe,CAAC,CAAA;QACrE,CAAC,CAAA;QACD,OAAO;YACL,QAAQ,CAAC,WAAW,CAAC,wBAAe,CAAC,CAAC,iBAAiB,CAAC,SAAS,CAAC,KAAK,EAAE,UAAU,EAAE,EAAE;gBACrF,MAAM,QAAQ,GAAG,CAAC,CAAC,IAAA,sBAAK,EAAC,KAAK,CAAC,IAAc,CAAC,CAAC,UAAU,CAAC,CAAA;gBAC1D,WAAW,CAAC,EAAE,QAAQ,EAAE,EAAE,KAAK,CAAC,CAAA;gBAChC,WAAW,EAAE,CAAA;YACf,CAAC,EAAE,IAAI,CAAC;SACT,CAAA;IACH,CAAC;IACD,aAAa,EAAE,oBAAoB;IACnC,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE;QAC9B,OAAO,CACL,8BAAC,kBAAS,IACR,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,MAAM,EAAE,MAAM;gBACd,cAAc,EAAE,MAAM;gBACtB,UAAU,EAAE,QAAQ;gBACpB,OAAO,EAAE,OAAO;gBAChB,GAAG,KAAK,CAAC,KAAK;aACf,KACG,KAAK,IAER,QAAQ,CACC,CACb,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
|
|
@@ -14,7 +14,7 @@ exports.AppBar = (0, shades_1.Shade)({
|
|
|
14
14
|
constructed: ({ element }) => {
|
|
15
15
|
const container = element.children[0];
|
|
16
16
|
requestAnimationFrame(() => {
|
|
17
|
-
container.style.padding = '8px 8px'
|
|
17
|
+
// container.style.padding = '8px 8px'
|
|
18
18
|
container.style.opacity = '1';
|
|
19
19
|
});
|
|
20
20
|
},
|
|
@@ -28,7 +28,6 @@ exports.AppBar = (0, shades_1.Shade)({
|
|
|
28
28
|
alignItems: 'center',
|
|
29
29
|
boxShadow: '0 0 12px rgba(0,0,0,0.6)',
|
|
30
30
|
transition: 'opacity .35s cubic-bezier(0.550, 0.085, 0.680, 0.530), padding .2s cubic-bezier(0.550, 0.085, 0.680, 0.530)',
|
|
31
|
-
padding: '6px 16px',
|
|
32
31
|
opacity: '0',
|
|
33
32
|
position: 'fixed',
|
|
34
33
|
zIndex: '1',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"app-bar.js","sourceRoot":"","sources":["../../src/components/app-bar.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAC1D,+EAAyE;AAE5D,QAAA,MAAM,GAAG,IAAA,cAAK,EAAC;IAC1B,aAAa,EAAE,eAAe;IAC9B,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;QACpC,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;YAC/D,CAAC;YAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAiB,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS,CAAA;QACtE,CAAC,EAAE,IAAI,CAAC,EAAE,mBAAmB;KAC9B;IACD,WAAW,EAAE,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;QAC3B,MAAM,SAAS,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAgB,CAAA;QACpD,qBAAqB,CAAC,GAAG,EAAE;YACzB,
|
|
1
|
+
{"version":3,"file":"app-bar.js","sourceRoot":"","sources":["../../src/components/app-bar.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAC1D,+EAAyE;AAE5D,QAAA,MAAM,GAAG,IAAA,cAAK,EAAC;IAC1B,aAAa,EAAE,eAAe;IAC9B,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;QACpC,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;YAC/D,CAAC;YAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAiB,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS,CAAA;QACtE,CAAC,EAAE,IAAI,CAAC,EAAE,mBAAmB;KAC9B;IACD,WAAW,EAAE,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;QAC3B,MAAM,SAAS,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAgB,CAAA;QACpD,qBAAqB,CAAC,GAAG,EAAE;YACzB,sCAAsC;YACtC,SAAS,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAA;QAC/B,CAAC,CAAC,CAAA;IACJ,CAAC;IACD,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;QACvB,OAAO,CACL,uCACE,KAAK,EAAE;gBACL,KAAK,EAAE,MAAM;gBACb,UAAU,EAAE,uBAAuB;gBACnC,cAAc,EAAE,YAAY;gBAC5B,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,YAAY;gBAC5B,UAAU,EAAE,QAAQ;gBACpB,SAAS,EAAE,0BAA0B;gBACrC,UAAU,EACR,6GAA6G;gBAC/G,OAAO,EAAE,GAAG;gBACZ,QAAQ,EAAE,OAAO;gBACjB,MAAM,EAAE,GAAG;aACZ,IAEA,QAAQ,CACL,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
|
|
@@ -3,22 +3,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.DataGridBody = void 0;
|
|
4
4
|
const shades_1 = require("@furystack/shades");
|
|
5
5
|
const loader_1 = require("../loader");
|
|
6
|
+
const data_grid_row_1 = require("./data-grid-row");
|
|
6
7
|
exports.DataGridBody = (0, shades_1.Shade)({
|
|
7
8
|
getInitialState: ({ props }) => ({
|
|
8
9
|
data: props.service.data.getValue().entries,
|
|
9
|
-
selection: props.service.selection.getValue(),
|
|
10
|
-
focus: props.service.focus.getValue(),
|
|
11
10
|
isLoading: props.service.isLoading.getValue(),
|
|
12
11
|
}),
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
props.service.selection.subscribe((selection) => updateState({ selection })),
|
|
18
|
-
props.service.isLoading.subscribe((isLoading) => updateState({ isLoading })),
|
|
19
|
-
];
|
|
20
|
-
return () => disposables.map((d) => d.dispose());
|
|
21
|
-
},
|
|
12
|
+
resources: ({ props, updateState }) => [
|
|
13
|
+
props.service.data.subscribe((data) => updateState({ data: data.entries })),
|
|
14
|
+
props.service.isLoading.subscribe((isLoading) => updateState({ isLoading })),
|
|
15
|
+
],
|
|
22
16
|
shadowDomName: 'shade-data-grid-body',
|
|
23
17
|
render: ({ getState, props, element }) => {
|
|
24
18
|
var _a;
|
|
@@ -31,21 +25,7 @@ exports.DataGridBody = (0, shades_1.Shade)({
|
|
|
31
25
|
if (!((_a = state.data) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
32
26
|
return (0, shades_1.createComponent)("div", null, " - No Data - ");
|
|
33
27
|
}
|
|
34
|
-
return ((0, shades_1.createComponent)(
|
|
35
|
-
background: state.selection.includes(entry) ? 'rgba(128,128,128,0.3)' : 'transparent',
|
|
36
|
-
filter: state.focus === entry ? 'brightness(1.5)' : 'brightness(1)',
|
|
37
|
-
cursor: 'default',
|
|
38
|
-
boxShadow: '2px 1px 0px rgba(255,255,255,0.07)',
|
|
39
|
-
fontSize: '0.8em',
|
|
40
|
-
}, onclick: () => {
|
|
41
|
-
if (getState().focus !== entry) {
|
|
42
|
-
props.service.focus.setValue(entry);
|
|
43
|
-
props.service.selection.setValue([entry]);
|
|
44
|
-
}
|
|
45
|
-
}, ondblclick: () => { var _a; return (_a = props.onDoubleClick) === null || _a === void 0 ? void 0 : _a.call(props, entry); } }, props.columns.map((column) => {
|
|
46
|
-
var _a, _b, _c, _d;
|
|
47
|
-
return ((0, shades_1.createComponent)("td", { style: { padding: '0.5em', ...props.style } }, ((_b = (_a = props.rowComponents) === null || _a === void 0 ? void 0 : _a[column]) === null || _b === void 0 ? void 0 : _b.call(_a, entry, state)) || ((_d = (_c = props.rowComponents) === null || _c === void 0 ? void 0 : _c.default) === null || _d === void 0 ? void 0 : _d.call(_c, entry, state)) || ((0, shades_1.createComponent)("span", null, entry[column]))));
|
|
48
|
-
}))))));
|
|
28
|
+
return ((0, shades_1.createComponent)(shades_1.createFragment, null, state.data.map((entry) => ((0, shades_1.createComponent)(data_grid_row_1.DataGridRow, { columns: props.columns, entry: entry, service: props.service, rowComponents: props.rowComponents })))));
|
|
49
29
|
},
|
|
50
30
|
});
|
|
51
31
|
//# sourceMappingURL=body.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"body.js","sourceRoot":"","sources":["../../../src/components/data-grid/body.tsx"],"names":[],"mappings":";;;AACA,
|
|
1
|
+
{"version":3,"file":"body.js","sourceRoot":"","sources":["../../../src/components/data-grid/body.tsx"],"names":[],"mappings":";;;AACA,8CAAwF;AAExF,sCAAkC;AAClC,mDAA6C;AAehC,QAAA,YAAY,GAAsF,IAAA,cAAK,EAGlH;IACA,eAAe,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;QAC/B,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,OAAO;QAC3C,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE;KAC9C,CAAC;IACF,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC;QACrC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC;QAC3E,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,WAAW,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC;KAC7E;IACD,aAAa,EAAE,sBAAsB;IACrC,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;;QACvC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,iBAAiB,CAAA;QACzC,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;QAExB,IAAI,KAAK,CAAC,SAAS,EAAE;YACnB,OAAO,CACL,uCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE;gBAE5G,8BAAC,eAAM,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,GAAI,CAClD,CACP,CAAA;SACF;QAED,IAAI,CAAC,CAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,MAAM,CAAA,EAAE;YACvB,OAAO,2DAAwB,CAAA;SAChC;QAED,OAAO,CACL,6DACG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACzB,8BAAC,2BAAW,IACV,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,aAAa,EAAE,KAAK,CAAC,aAAa,GACrB,CAChB,CAAC,CACD,CACJ,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DataGridRow = void 0;
|
|
4
|
+
const shades_1 = require("@furystack/shades");
|
|
5
|
+
exports.DataGridRow = (0, shades_1.Shade)({
|
|
6
|
+
getInitialState: ({ props }) => ({
|
|
7
|
+
focus: props.service.focusedEntry.getValue(),
|
|
8
|
+
selection: props.service.selection.getValue(),
|
|
9
|
+
}),
|
|
10
|
+
shadowDomName: 'shades-data-grid-row',
|
|
11
|
+
resources: ({ props, element }) => [
|
|
12
|
+
props.service.focusedEntry.subscribe((newEntry) => {
|
|
13
|
+
var _a, _b, _c, _d;
|
|
14
|
+
if (newEntry === props.entry) {
|
|
15
|
+
element.style.filter = 'brightness(1.5)';
|
|
16
|
+
element.style.fontWeight = 'bolder';
|
|
17
|
+
const headerHeight = ((_b = (_a = element.closest('table')) === null || _a === void 0 ? void 0 : _a.querySelector('th')) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().height) || 42;
|
|
18
|
+
const parent = element.closest('.shade-grid-wrapper');
|
|
19
|
+
const maxTop = element.offsetTop - headerHeight;
|
|
20
|
+
const currentTop = parent.scrollTop;
|
|
21
|
+
if (maxTop < currentTop) {
|
|
22
|
+
parent.scrollTo({ top: maxTop, behavior: 'smooth' });
|
|
23
|
+
}
|
|
24
|
+
const footerHeight = ((_d = (_c = element.closest('shade-data-grid')) === null || _c === void 0 ? void 0 : _c.querySelector('shade-data-grid-footer')) === null || _d === void 0 ? void 0 : _d.getBoundingClientRect().height) ||
|
|
25
|
+
42;
|
|
26
|
+
const visibleMaxTop = parent.clientHeight - footerHeight; // parent.getBoundingClientRect().height - footerHeight - headerHeight
|
|
27
|
+
const desiredMaxTop = element.offsetTop + element.clientHeight;
|
|
28
|
+
if (desiredMaxTop > visibleMaxTop) {
|
|
29
|
+
parent.scrollTo({ top: desiredMaxTop - visibleMaxTop, behavior: 'smooth' });
|
|
30
|
+
}
|
|
31
|
+
// ;(element as any).scrollIntoView({ inline: 'nearest', block: 'nearest', behavior: 'smooth' })
|
|
32
|
+
}
|
|
33
|
+
else {
|
|
34
|
+
element.style.filter = 'brightness(1)';
|
|
35
|
+
element.style.fontWeight = 'inherit';
|
|
36
|
+
}
|
|
37
|
+
}),
|
|
38
|
+
props.service.selection.subscribe((selection) => {
|
|
39
|
+
if (selection.includes(props.entry)) {
|
|
40
|
+
element.style.background = 'rgba(128,128,128,0.1)';
|
|
41
|
+
}
|
|
42
|
+
else {
|
|
43
|
+
element.style.background = 'none';
|
|
44
|
+
}
|
|
45
|
+
}),
|
|
46
|
+
],
|
|
47
|
+
render: ({ getState, props, element }) => {
|
|
48
|
+
const state = getState();
|
|
49
|
+
const { entry, rowComponents, columns } = props;
|
|
50
|
+
element.style.display = 'table-row';
|
|
51
|
+
element.style.cursor = 'default';
|
|
52
|
+
element.style.userSelect = 'none';
|
|
53
|
+
element.onclick = () => {
|
|
54
|
+
props.service.focusedEntry.setValue(props.entry);
|
|
55
|
+
};
|
|
56
|
+
return ((0, shades_1.createComponent)(shades_1.createFragment, null, columns.map((column) => {
|
|
57
|
+
var _a, _b;
|
|
58
|
+
return ((0, shades_1.createComponent)("td", { style: { padding: '0.5em' } }, ((_a = rowComponents === null || rowComponents === void 0 ? void 0 : rowComponents[column]) === null || _a === void 0 ? void 0 : _a.call(rowComponents, entry, state)) || ((_b = rowComponents === null || rowComponents === void 0 ? void 0 : rowComponents.default) === null || _b === void 0 ? void 0 : _b.call(rowComponents, entry, state)) || ((0, shades_1.createComponent)("span", null, entry[column]))));
|
|
59
|
+
})));
|
|
60
|
+
},
|
|
61
|
+
});
|
|
62
|
+
//# sourceMappingURL=data-grid-row.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"data-grid-row.js","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid-row.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,18 +2,15 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.DataGrid = void 0;
|
|
4
4
|
const shades_1 = require("@furystack/shades");
|
|
5
|
-
const styles_1 = require("../styles");
|
|
6
5
|
const header_1 = require("./header");
|
|
7
6
|
const body_1 = require("./body");
|
|
8
7
|
const footer_1 = require("./footer");
|
|
9
8
|
const services_1 = require("../../services");
|
|
10
9
|
exports.DataGrid = (0, shades_1.Shade)({
|
|
11
10
|
shadowDomName: 'shade-data-grid',
|
|
12
|
-
|
|
13
|
-
constructed: ({ props, updateState, injector, element }) => {
|
|
11
|
+
resources: ({ injector, element, props }) => {
|
|
14
12
|
const tp = injector.getInstance(services_1.ThemeProviderService);
|
|
15
|
-
|
|
16
|
-
props.service.error.subscribe((error) => updateState({ error })),
|
|
13
|
+
return [
|
|
17
14
|
tp.theme.subscribe((t) => {
|
|
18
15
|
const headers = element.querySelectorAll('th');
|
|
19
16
|
const { r, g, b } = tp.getRgbFromColorString(t.background.paper);
|
|
@@ -22,19 +19,20 @@ exports.DataGrid = (0, shades_1.Shade)({
|
|
|
22
19
|
header.style.backgroundColor = `rgba(${r}, ${g}, ${b}, 0.3)`;
|
|
23
20
|
});
|
|
24
21
|
}),
|
|
25
|
-
|
|
26
|
-
|
|
22
|
+
new services_1.ClickAwayService(element, () => {
|
|
23
|
+
props.service.hasFocus.setValue(false);
|
|
24
|
+
}),
|
|
27
25
|
];
|
|
28
|
-
return () => Promise.all(subscriptions.map((s) => s.dispose()));
|
|
29
26
|
},
|
|
30
|
-
|
|
27
|
+
constructed: ({ props }) => {
|
|
28
|
+
window.addEventListener('keydown', (ev) => {
|
|
29
|
+
props.service.handleKeyDown(ev);
|
|
30
|
+
});
|
|
31
|
+
},
|
|
32
|
+
render: ({ props, injector }) => {
|
|
31
33
|
var _a, _b, _c;
|
|
32
34
|
const tp = injector.getInstance(services_1.ThemeProviderService);
|
|
33
35
|
const theme = tp.theme.getValue();
|
|
34
|
-
const state = getState();
|
|
35
|
-
if (state.error) {
|
|
36
|
-
return (0, shades_1.createComponent)("div", { style: { color: styles_1.colors.error.main } }, JSON.stringify(state.error));
|
|
37
|
-
}
|
|
38
36
|
const { r, g, b } = tp.getRgbFromColorString(theme.background.paper);
|
|
39
37
|
const headerStyle = {
|
|
40
38
|
backgroundColor: `rgba(${r}, ${g}, ${b}, 0.3)`,
|
|
@@ -56,15 +54,16 @@ exports.DataGrid = (0, shades_1.Shade)({
|
|
|
56
54
|
height: '100%',
|
|
57
55
|
overflow: 'auto',
|
|
58
56
|
zIndex: '1',
|
|
57
|
+
}, onclick: () => {
|
|
58
|
+
props.service.hasFocus.setValue(true);
|
|
59
59
|
} },
|
|
60
|
-
(0, shades_1.createComponent)("table", { style: { width: '100%',
|
|
60
|
+
(0, shades_1.createComponent)("table", { style: { width: '100%', maxHeight: 'calc(100% - 4em)', position: 'relative' } },
|
|
61
61
|
(0, shades_1.createComponent)("thead", null,
|
|
62
62
|
(0, shades_1.createComponent)("tr", null, props.columns.map((column) => {
|
|
63
63
|
var _a, _b, _c, _d;
|
|
64
|
-
return ((0, shades_1.createComponent)("th", { style: headerStyle }, ((_b = (_a = props.headerComponents) === null || _a === void 0 ? void 0 : _a[column]) === null || _b === void 0 ? void 0 : _b.call(_a, column,
|
|
65
|
-
((_d = (_c = props.headerComponents) === null || _c === void 0 ? void 0 : _c.default) === null || _d === void 0 ? void 0 : _d.call(_c, column, state)) || ((0, shades_1.createComponent)(header_1.DataGridHeader, { field: column, collectionService: props.service }))));
|
|
64
|
+
return ((0, shades_1.createComponent)("th", { style: headerStyle }, ((_b = (_a = props.headerComponents) === null || _a === void 0 ? void 0 : _a[column]) === null || _b === void 0 ? void 0 : _b.call(_a, column)) || ((_d = (_c = props.headerComponents) === null || _c === void 0 ? void 0 : _c.default) === null || _d === void 0 ? void 0 : _d.call(_c, column)) || ((0, shades_1.createComponent)(header_1.DataGridHeader, { field: column, collectionService: props.service }))));
|
|
66
65
|
}))),
|
|
67
|
-
(0, shades_1.createComponent)(body_1.DataGridBody, { columns: props.columns, service: props.service, rowComponents: props.rowComponents, style: (_c = props.styles) === null || _c === void 0 ? void 0 : _c.cell
|
|
66
|
+
(0, shades_1.createComponent)(body_1.DataGridBody, { columns: props.columns, service: props.service, rowComponents: props.rowComponents, style: (_c = props.styles) === null || _c === void 0 ? void 0 : _c.cell })),
|
|
68
67
|
(0, shades_1.createComponent)(footer_1.DataGridFooter, { service: props.service })));
|
|
69
68
|
},
|
|
70
69
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-grid.js","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid.tsx"],"names":[],"mappings":";;;AAAA,8CAAwE;AAGxE,
|
|
1
|
+
{"version":3,"file":"data-grid.js","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.DataGridFooter = exports.dataGridItemsPerPage = void 0;
|
|
4
4
|
const shades_1 = require("@furystack/shades");
|
|
5
5
|
const services_1 = require("../../services");
|
|
6
|
-
exports.dataGridItemsPerPage = [10, 20, 25, 50, 100];
|
|
6
|
+
exports.dataGridItemsPerPage = [10, 20, 25, 50, 100, Infinity];
|
|
7
7
|
exports.DataGridFooter = (0, shades_1.Shade)({
|
|
8
8
|
shadowDomName: 'shade-data-grid-footer',
|
|
9
9
|
getInitialState: ({ props }) => ({
|
|
@@ -24,9 +24,10 @@ exports.DataGridFooter = (0, shades_1.Shade)({
|
|
|
24
24
|
const state = getState();
|
|
25
25
|
const currentQuerySettings = props.service.querySettings.getValue();
|
|
26
26
|
const currentPage = Math.ceil(currentQuerySettings.skip || 0) / (currentQuerySettings.top || 1);
|
|
27
|
+
const currentEntriesPerPage = currentQuerySettings.top || Infinity;
|
|
27
28
|
const theme = injector.getInstance(services_1.ThemeProviderService).theme.getValue();
|
|
28
29
|
return ((0, shades_1.createComponent)("div", { className: "pager", style: {
|
|
29
|
-
|
|
30
|
+
backdropFilter: 'blur(10px)',
|
|
30
31
|
color: theme.text.secondary,
|
|
31
32
|
position: 'sticky',
|
|
32
33
|
bottom: '0',
|
|
@@ -35,15 +36,16 @@ exports.DataGridFooter = (0, shades_1.Shade)({
|
|
|
35
36
|
padding: '1em',
|
|
36
37
|
alignItems: 'center',
|
|
37
38
|
} },
|
|
38
|
-
(0, shades_1.createComponent)("div", null,
|
|
39
|
+
currentEntriesPerPage !== Infinity && ((0, shades_1.createComponent)("div", null,
|
|
39
40
|
"Goto page",
|
|
40
41
|
(0, shades_1.createComponent)("select", { style: { margin: '0 1em' }, onchange: (ev) => {
|
|
41
42
|
const value = parseInt(ev.target.value, 10);
|
|
42
43
|
const currentQuery = props.service.querySettings.getValue();
|
|
43
44
|
props.service.querySettings.setValue({ ...currentQuery, skip: (currentQuery.top || 0) * value });
|
|
44
|
-
} }, [
|
|
45
|
+
} }, [
|
|
46
|
+
...new Array(Math.ceil(state.data.count / (props.service.querySettings.getValue().top || Infinity))),
|
|
47
|
+
].map((_val, index) => ((0, shades_1.createComponent)("option", { value: index.toString(), selected: currentPage === index }, (index + 1).toString())))))),
|
|
45
48
|
(0, shades_1.createComponent)("div", null,
|
|
46
|
-
' ',
|
|
47
49
|
"Show",
|
|
48
50
|
(0, shades_1.createComponent)("select", { style: { margin: '0 1em' }, onchange: (ev) => {
|
|
49
51
|
const value = parseInt(ev.currentTarget.value, 10);
|
|
@@ -52,7 +54,7 @@ exports.DataGridFooter = (0, shades_1.Shade)({
|
|
|
52
54
|
top: value,
|
|
53
55
|
skip: currentPage * value,
|
|
54
56
|
});
|
|
55
|
-
} }, exports.dataGridItemsPerPage.map((no) => ((0, shades_1.createComponent)("option", { value: no.toString(), selected: no ===
|
|
57
|
+
} }, exports.dataGridItemsPerPage.map((no) => ((0, shades_1.createComponent)("option", { value: no.toString(), selected: no === currentEntriesPerPage }, no.toString())))),
|
|
56
58
|
"items per page")));
|
|
57
59
|
},
|
|
58
60
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../src/components/data-grid/footer.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAC1D,6CAAqD;AAGxC,QAAA,oBAAoB,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../src/components/data-grid/footer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -15,7 +15,7 @@ exports.DataGridHeader = (0, shades_1.Shade)({
|
|
|
15
15
|
...currentSettings,
|
|
16
16
|
filter: {
|
|
17
17
|
...currentSettings.filter,
|
|
18
|
-
[props.field]:
|
|
18
|
+
[props.field]: { $regex: value },
|
|
19
19
|
},
|
|
20
20
|
};
|
|
21
21
|
props.collectionService.querySettings.setValue(newSettings);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header.js","sourceRoot":"","sources":["../../../src/components/data-grid/header.tsx"],"names":[],"mappings":";;;AACA,8CAAwE;AACxE,4CAA2C;AAE3C,oCAAgC;AAanB,QAAA,cAAc,GAGE,IAAA,cAAK,EAA0D;IAC1F,aAAa,EAAE,kBAAkB;IACjC,eAAe,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;QAC/B,aAAa,EAAE,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,EAAE;QAC/D,cAAc,EAAE,KAAK;QACrB,iBAAiB,EAAE,IAAA,gBAAQ,EAAC,CAAC,KAAa,EAAE,EAAE;YAC5C,MAAM,eAAe,GAAG,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAA;YACxE,MAAM,WAAW,GAA8B;gBAC7C,GAAG,eAAe;gBAClB,MAAM,EAAE;oBACN,GAAG,eAAe,CAAC,MAAM;oBACzB,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"header.js","sourceRoot":"","sources":["../../../src/components/data-grid/header.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/data-grid/index.tsx"],"names":[],"mappings":";;;AAAA,sDAA2B"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/data-grid/index.tsx"],"names":[],"mappings":";;;AAAA,sDAA2B;AAC3B,2DAAgC"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.SelectionCell = void 0;
|
|
4
|
+
const shades_1 = require("@furystack/shades");
|
|
5
|
+
exports.SelectionCell = (0, shades_1.Shade)({
|
|
6
|
+
shadowDomName: 'shades-data-grid-selection-cell',
|
|
7
|
+
resources: ({ props, element }) => [
|
|
8
|
+
props.service.selection.subscribe((selection) => {
|
|
9
|
+
if (selection.includes(props.entry)) {
|
|
10
|
+
;
|
|
11
|
+
element.firstChild.checked = true;
|
|
12
|
+
}
|
|
13
|
+
else {
|
|
14
|
+
;
|
|
15
|
+
element.firstChild.checked = false;
|
|
16
|
+
}
|
|
17
|
+
}),
|
|
18
|
+
],
|
|
19
|
+
render: ({ props }) => {
|
|
20
|
+
return ((0, shades_1.createComponent)("input", { onchange: (ev) => {
|
|
21
|
+
if (ev.target.checked) {
|
|
22
|
+
props.service.selection.setValue([...props.service.selection.getValue(), props.entry]);
|
|
23
|
+
}
|
|
24
|
+
else {
|
|
25
|
+
props.service.selection.setValue([
|
|
26
|
+
...props.service.selection.getValue().filter((entry) => entry !== props.entry),
|
|
27
|
+
]);
|
|
28
|
+
}
|
|
29
|
+
}, type: "checkbox", checked: props.service.selection.getValue().includes(props.entry) ? true : false }));
|
|
30
|
+
},
|
|
31
|
+
});
|
|
32
|
+
//# sourceMappingURL=selection-cell.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"selection-cell.js","sourceRoot":"","sources":["../../../src/components/data-grid/selection-cell.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAG7C,QAAA,aAAa,GAAG,IAAA,cAAK,EAAkD;IAClF,aAAa,EAAE,iCAAiC;IAChD,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;QACjC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,EAAE,EAAE;YAC9C,IAAI,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;gBACnC,CAAC;gBAAC,OAAO,CAAC,UAA+B,CAAC,OAAO,GAAG,IAAI,CAAA;aACzD;iBAAM;gBACL,CAAC;gBAAC,OAAO,CAAC,UAA+B,CAAC,OAAO,GAAG,KAAK,CAAA;aAC1D;QACH,CAAC,CAAC;KACH;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;QACpB,OAAO,CACL,yCACE,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;gBACf,IAAK,EAAE,CAAC,MAA2B,CAAC,OAAO,EAAE;oBAC3C,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAA;iBACvF;qBAAM;oBACL,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC;wBAC/B,GAAG,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,CAAC;qBAC/E,CAAC,CAAA;iBACH;YACH,CAAC,EACD,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,GAChF,CACH,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
|
package/dist/components/grid.js
CHANGED
|
@@ -38,9 +38,7 @@ exports.Grid = (0, shades_1.Shade)({
|
|
|
38
38
|
(0, shades_1.createComponent)("thead", null,
|
|
39
39
|
(0, shades_1.createComponent)("tr", null, props.columns.map((column) => {
|
|
40
40
|
var _a, _b, _c, _d;
|
|
41
|
-
return ((0, shades_1.createComponent)("th", { style: headerStyle },
|
|
42
|
-
((_b = (_a = props.headerComponents) === null || _a === void 0 ? void 0 : _a[column]) === null || _b === void 0 ? void 0 : _b.call(_a, column)) || ((_d = (_c = props.headerComponents) === null || _c === void 0 ? void 0 : _c.default) === null || _d === void 0 ? void 0 : _d.call(_c, column)) || ((0, shades_1.createComponent)("span", null, column)),
|
|
43
|
-
' '));
|
|
41
|
+
return ((0, shades_1.createComponent)("th", { style: headerStyle }, ((_b = (_a = props.headerComponents) === null || _a === void 0 ? void 0 : _a[column]) === null || _b === void 0 ? void 0 : _b.call(_a, column)) || ((_d = (_c = props.headerComponents) === null || _c === void 0 ? void 0 : _c.default) === null || _d === void 0 ? void 0 : _d.call(_c, column)) || ((0, shades_1.createComponent)("span", null, column))));
|
|
44
42
|
}))),
|
|
45
43
|
(0, shades_1.createComponent)("tbody", null, props.entries.map((entry) => ((0, shades_1.createComponent)("tr", null, props.columns.map((column) => {
|
|
46
44
|
var _a, _b, _c, _d, _e;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../src/components/grid.tsx"],"names":[],"mappings":";;;AAAA,8CAAwE;AACxE,0CAAkD;AAuBrC,QAAA,IAAI,GAA8E,IAAA,cAAK,EAAC;IACnG,aAAa,EAAE,YAAY;IAC3B,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;QACpC,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;YAC/D,MAAM,OAAO,GAAG,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAA;YAC9C,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;gBACzB,MAAM,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS,CAAA;gBACrC,MAAM,CAAC,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC,UAAU,CAAC,KAAK,CAAA;YAC9C,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC;KACH;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;;QAC9B,MAAM,KAAK,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAA;QACzE,MAAM,WAAW,GAAiC;YAChD,OAAO,EAAE,UAAU;YACnB,eAAe,EAAE,KAAK,CAAC,UAAU,CAAC,KAAK;YACvC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS;YAC3B,YAAY,EAAE,KAAK;YACnB,GAAG,EAAE,GAAG;YACR,QAAQ,EAAE,QAAQ;YAClB,MAAM,EAAE,SAAS;YACjB,WAAW,EAAE,iBAAiB;YAC9B,GAAG,MAAA,KAAK,CAAC,MAAM,0CAAE,MAAM;SACxB,CAAA;QACD,OAAO,CACL,uCACE,SAAS,EAAC,oBAAoB,EAC9B,KAAK,EAAE;gBACL,GAAG,MAAA,KAAK,CAAC,MAAM,0CAAE,OAAO;gBACxB,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,QAAQ,EAAE,MAAM;aACjB;YAED,yCAAO,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE;gBACnD;oBACE,0CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;;wBAC5B,OAAO,CACL,sCAAI,KAAK,EAAE,WAAW
|
|
1
|
+
{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../src/components/grid.tsx"],"names":[],"mappings":";;;AAAA,8CAAwE;AACxE,0CAAkD;AAuBrC,QAAA,IAAI,GAA8E,IAAA,cAAK,EAAC;IACnG,aAAa,EAAE,YAAY;IAC3B,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;QACpC,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;YAC/D,MAAM,OAAO,GAAG,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAA;YAC9C,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;gBACzB,MAAM,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS,CAAA;gBACrC,MAAM,CAAC,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC,UAAU,CAAC,KAAK,CAAA;YAC9C,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC;KACH;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;;QAC9B,MAAM,KAAK,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAA;QACzE,MAAM,WAAW,GAAiC;YAChD,OAAO,EAAE,UAAU;YACnB,eAAe,EAAE,KAAK,CAAC,UAAU,CAAC,KAAK;YACvC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS;YAC3B,YAAY,EAAE,KAAK;YACnB,GAAG,EAAE,GAAG;YACR,QAAQ,EAAE,QAAQ;YAClB,MAAM,EAAE,SAAS;YACjB,WAAW,EAAE,iBAAiB;YAC9B,GAAG,MAAA,KAAK,CAAC,MAAM,0CAAE,MAAM;SACxB,CAAA;QACD,OAAO,CACL,uCACE,SAAS,EAAC,oBAAoB,EAC9B,KAAK,EAAE;gBACL,GAAG,MAAA,KAAK,CAAC,MAAM,0CAAE,OAAO;gBACxB,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,QAAQ,EAAE,MAAM;aACjB;YAED,yCAAO,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE;gBACnD;oBACE,0CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;;wBAC5B,OAAO,CACL,sCAAI,KAAK,EAAE,WAAW,IACnB,CAAA,MAAA,MAAA,KAAK,CAAC,gBAAgB,0CAAG,MAAM,CAAC,mDAAG,MAAM,CAAC,MAAI,MAAA,MAAA,KAAK,CAAC,gBAAgB,0CAAE,OAAO,mDAAG,MAAM,CAAC,CAAA,IAAI,CAC1F,4CAAO,MAAM,CAAQ,CACtB,CACE,CACN,CAAA;oBACH,CAAC,CAAC,CACC,CACC;gBACR,6CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAC5B,0CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;;oBAAC,OAAA,CAC7B,sCAAI,KAAK,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,IAAI,IAC1B,CAAA,MAAA,MAAA,KAAK,CAAC,aAAa,0CAAG,MAAM,CAAC,mDAAG,KAAK,CAAC,MAAI,MAAA,MAAA,KAAK,CAAC,aAAa,0CAAE,OAAO,mDAAG,KAAK,CAAC,CAAA,IAAI,CAClF,4CAAO,KAAK,CAAC,MAAM,CAAC,CAAQ,CAC7B,CACE,CACN,CAAA;iBAAA,CAAC,CACC,CACN,CAAC,CACI,CACF,CACJ,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
|
package/dist/components/index.js
CHANGED
|
@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
const tslib_1 = require("tslib");
|
|
4
4
|
tslib_1.__exportStar(require("./animations"), exports);
|
|
5
5
|
tslib_1.__exportStar(require("./app-bar"), exports);
|
|
6
|
+
tslib_1.__exportStar(require("./app-bar-link"), exports);
|
|
6
7
|
tslib_1.__exportStar(require("./autocomplete"), exports);
|
|
7
8
|
tslib_1.__exportStar(require("./avatar"), exports);
|
|
8
9
|
tslib_1.__exportStar(require("./button"), exports);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":";;;AAAA,uDAA4B;AAC5B,oDAAyB;AACzB,yDAA8B;AAC9B,mDAAwB;AACxB,mDAAwB;AACxB,sDAA2B;AAC3B,gDAAqB;AACrB,iDAAsB;AACtB,kDAAuB;AACvB,kDAAuB;AACvB,sDAA2B;AAC3B,kDAAuB;AACvB,mDAAwB;AACxB,oDAAyB;AACzB,iDAAsB;AACtB,mDAAwB;AACxB,4DAAiC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":";;;AAAA,uDAA4B;AAC5B,oDAAyB;AACzB,yDAA8B;AAC9B,yDAA8B;AAC9B,mDAAwB;AACxB,mDAAwB;AACxB,sDAA2B;AAC3B,gDAAqB;AACrB,iDAAsB;AACtB,kDAAuB;AACvB,kDAAuB;AACvB,sDAA2B;AAC3B,kDAAuB;AACvB,mDAAwB;AACxB,oDAAyB;AACzB,iDAAsB;AACtB,mDAAwB;AACxB,4DAAiC"}
|
package/dist/components/paper.js
CHANGED
|
@@ -24,7 +24,7 @@ exports.Paper = (0, shades_1.Shade)({
|
|
|
24
24
|
color: themeProvider.theme.getValue().text.secondary,
|
|
25
25
|
margin: '8px',
|
|
26
26
|
padding: '6px 16px',
|
|
27
|
-
...
|
|
27
|
+
...props === null || props === void 0 ? void 0 : props.style,
|
|
28
28
|
} }, children));
|
|
29
29
|
},
|
|
30
30
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"paper.js","sourceRoot":"","sources":["../../src/components/paper.tsx"],"names":[],"mappings":";;;AAAA,8CAA0E;AAC1E,+EAAyE;AAE5D,QAAA,KAAK,GAAG,IAAA,cAAK,EAA6D;IACrF,aAAa,EAAE,aAAa;IAC5B,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE;QACnC,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAA;QAChE,OAAO;YACL,aAAa,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,QAAQ,EAAE,EAAE;gBACzC,CAAC;gBAAC,OAAO,CAAC,UAA6B,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CACnF;gBAAC,OAAO,CAAC,UAA6B,CAAC,KAAK,CAAC,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,SAAS,CAAA;YACrG,CAAC,CAAC;SACH,CAAA;IACH,CAAC;IACD,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QACxC,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAA;QAChE,OAAO,CACL,0CACM,KAAK,EACT,KAAK,EAAE;gBACL,YAAY,EAAE,KAAK;gBACnB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,SAAS,MAAM,KAAK,CAAC,SAAS,oBAAoB,CAAC,CAAC,CAAC,EAAE;gBACjG,eAAe,EAAE,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,UAAU,CAAC,KAAK;gBAChE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,SAAS;gBACpD,MAAM,EAAE,KAAK;gBACb,OAAO,EAAE,UAAU;gBACnB,GAAG,
|
|
1
|
+
{"version":3,"file":"paper.js","sourceRoot":"","sources":["../../src/components/paper.tsx"],"names":[],"mappings":";;;AAAA,8CAA0E;AAC1E,+EAAyE;AAE5D,QAAA,KAAK,GAAG,IAAA,cAAK,EAA6D;IACrF,aAAa,EAAE,aAAa;IAC5B,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE;QACnC,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAA;QAChE,OAAO;YACL,aAAa,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,QAAQ,EAAE,EAAE;gBACzC,CAAC;gBAAC,OAAO,CAAC,UAA6B,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CACnF;gBAAC,OAAO,CAAC,UAA6B,CAAC,KAAK,CAAC,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,SAAS,CAAA;YACrG,CAAC,CAAC;SACH,CAAA;IACH,CAAC;IACD,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QACxC,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAA;QAChE,OAAO,CACL,0CACM,KAAK,EACT,KAAK,EAAE;gBACL,YAAY,EAAE,KAAK;gBACnB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,SAAS,MAAM,KAAK,CAAC,SAAS,oBAAoB,CAAC,CAAC,CAAC,EAAE;gBACjG,eAAe,EAAE,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,UAAU,CAAC,KAAK;gBAChE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,SAAS;gBACpD,MAAM,EAAE,KAAK;gBACb,OAAO,EAAE,UAAU;gBACnB,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK;aAChB,IAEA,QAAQ,CACL,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
|
|
@@ -10,16 +10,18 @@ class CollectionService {
|
|
|
10
10
|
this.data = new utils_1.ObservableValue({ count: 0, entries: [] });
|
|
11
11
|
this.error = new utils_1.ObservableValue(undefined);
|
|
12
12
|
this.isLoading = new utils_1.ObservableValue(false);
|
|
13
|
-
this.
|
|
13
|
+
this.focusedEntry = new utils_1.ObservableValue();
|
|
14
14
|
this.selection = new utils_1.ObservableValue([]);
|
|
15
|
+
this.searchTerm = new utils_1.ObservableValue('');
|
|
16
|
+
this.hasFocus = new utils_1.ObservableValue(false);
|
|
15
17
|
this.querySettings = new utils_1.ObservableValue(defaultSettings);
|
|
16
18
|
this.getEntries = (0, utils_1.debounce)(async (options) => {
|
|
17
19
|
await this.loadLock.acquire();
|
|
18
20
|
try {
|
|
21
|
+
this.error.setValue(undefined);
|
|
19
22
|
this.isLoading.setValue(true);
|
|
20
23
|
const result = await fetch(options);
|
|
21
24
|
this.data.setValue(result);
|
|
22
|
-
this.error.setValue(undefined);
|
|
23
25
|
return result;
|
|
24
26
|
}
|
|
25
27
|
catch (error) {
|
|
@@ -39,6 +41,82 @@ class CollectionService {
|
|
|
39
41
|
this.error.dispose();
|
|
40
42
|
this.isLoading.dispose();
|
|
41
43
|
}
|
|
44
|
+
handleKeyDown(ev) {
|
|
45
|
+
const { entries } = this.data.getValue();
|
|
46
|
+
const hasFocus = this.hasFocus.getValue();
|
|
47
|
+
const selectedEntries = this.selection.getValue();
|
|
48
|
+
const focusedEntry = this.focusedEntry.getValue();
|
|
49
|
+
const searchTerm = this.searchTerm.getValue();
|
|
50
|
+
switch (ev.key) {
|
|
51
|
+
case ' ':
|
|
52
|
+
ev.preventDefault();
|
|
53
|
+
focusedEntry &&
|
|
54
|
+
this.selection.setValue(selectedEntries.includes(focusedEntry)
|
|
55
|
+
? selectedEntries.filter((e) => e !== focusedEntry)
|
|
56
|
+
: [...selectedEntries, focusedEntry]);
|
|
57
|
+
break;
|
|
58
|
+
case '*':
|
|
59
|
+
this.selection.setValue(entries.filter((e) => !selectedEntries.includes(e)));
|
|
60
|
+
break;
|
|
61
|
+
case '+':
|
|
62
|
+
this.selection.setValue(entries);
|
|
63
|
+
break;
|
|
64
|
+
case '-':
|
|
65
|
+
this.selection.setValue([]);
|
|
66
|
+
break;
|
|
67
|
+
case 'Insert':
|
|
68
|
+
focusedEntry &&
|
|
69
|
+
(this.selection.getValue().includes(focusedEntry)
|
|
70
|
+
? this.selection.setValue([...this.selection.getValue().filter((e) => e !== focusedEntry)])
|
|
71
|
+
: this.selection.setValue([...this.selection.getValue(), focusedEntry]));
|
|
72
|
+
this.focusedEntry.setValue(entries[entries.findIndex((e) => e === this.focusedEntry.getValue()) + 1]);
|
|
73
|
+
break;
|
|
74
|
+
case 'ArrowUp':
|
|
75
|
+
ev.preventDefault();
|
|
76
|
+
this.focusedEntry.setValue(entries[Math.max(0, entries.findIndex((e) => e === focusedEntry) - 1)]);
|
|
77
|
+
break;
|
|
78
|
+
case 'ArrowDown':
|
|
79
|
+
ev.preventDefault();
|
|
80
|
+
this.focusedEntry.setValue(entries[Math.min(entries.length - 1, entries.findIndex((e) => e === focusedEntry) + 1)]);
|
|
81
|
+
break;
|
|
82
|
+
case 'Home': {
|
|
83
|
+
this.focusedEntry.setValue(entries[0]);
|
|
84
|
+
break;
|
|
85
|
+
}
|
|
86
|
+
case 'End': {
|
|
87
|
+
this.focusedEntry.setValue(entries[entries.length - 1]);
|
|
88
|
+
break;
|
|
89
|
+
}
|
|
90
|
+
case 'Enter': {
|
|
91
|
+
// this.activate(focusedEntry)
|
|
92
|
+
break;
|
|
93
|
+
}
|
|
94
|
+
case 'Backspace': {
|
|
95
|
+
// this.currentWorkDir.goUp()
|
|
96
|
+
break;
|
|
97
|
+
}
|
|
98
|
+
case 'Tab': {
|
|
99
|
+
this.hasFocus.setValue(!hasFocus);
|
|
100
|
+
break;
|
|
101
|
+
}
|
|
102
|
+
case 'Escape': {
|
|
103
|
+
this.searchTerm.setValue('');
|
|
104
|
+
this.selection.setValue([]);
|
|
105
|
+
break;
|
|
106
|
+
}
|
|
107
|
+
default:
|
|
108
|
+
if (ev.key.length === 1 && new RegExp(/[a-zA-z0-9]/).test(ev.key)) {
|
|
109
|
+
const newSearchExpression = searchTerm + ev.key;
|
|
110
|
+
// TODO: implement search
|
|
111
|
+
// const newFocusedEntry = entries.find((e) => e.name.startsWith(newSearchExpression))
|
|
112
|
+
// this.focus.setValue(newFocusedEntry)
|
|
113
|
+
this.searchTerm.setValue(newSearchExpression);
|
|
114
|
+
}
|
|
115
|
+
else {
|
|
116
|
+
console.log(`Handler for '${ev.key}' not registered`);
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
}
|
|
42
120
|
}
|
|
43
121
|
exports.CollectionService = CollectionService;
|
|
44
122
|
//# sourceMappingURL=collection-service.js.map
|