@operato/data-grist 9.0.0-beta.0 → 9.0.0-beta.10
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/CHANGELOG.md +44 -0
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/src/accumulator/accumulator.d.ts +1 -1
- package/dist/src/accumulator/accumulator.js.map +1 -1
- package/dist/src/configure/column-builder.d.ts +1 -1
- package/dist/src/configure/column-builder.js +5 -5
- package/dist/src/configure/column-builder.js.map +1 -1
- package/dist/src/configure/config-builder.d.ts +1 -1
- package/dist/src/configure/config-builder.js +6 -6
- package/dist/src/configure/config-builder.js.map +1 -1
- package/dist/src/configure/filters-option-builder.d.ts +1 -1
- package/dist/src/configure/filters-option-builder.js.map +1 -1
- package/dist/src/configure/imex-option-builder.d.ts +1 -1
- package/dist/src/configure/imex-option-builder.js.map +1 -1
- package/dist/src/configure/list-option-builder.d.ts +1 -1
- package/dist/src/configure/list-option-builder.js.map +1 -1
- package/dist/src/configure/rows-option-builder.d.ts +1 -1
- package/dist/src/configure/rows-option-builder.js +2 -2
- package/dist/src/configure/rows-option-builder.js.map +1 -1
- package/dist/src/configure/tree-option-builder.d.ts +1 -1
- package/dist/src/configure/tree-option-builder.js.map +1 -1
- package/dist/src/configure/zero-config.d.ts +1 -1
- package/dist/src/configure/zero-config.js.map +1 -1
- package/dist/src/data-card/data-card-field.d.ts +1 -1
- package/dist/src/data-card/data-card-field.js +39 -7
- package/dist/src/data-card/data-card-field.js.map +1 -1
- package/dist/src/data-card/data-card-gutter-menu.js +46 -2
- package/dist/src/data-card/data-card-gutter-menu.js.map +1 -1
- package/dist/src/data-card/data-card-gutter.d.ts +1 -1
- package/dist/src/data-card/data-card-gutter.js +39 -7
- package/dist/src/data-card/data-card-gutter.js.map +1 -1
- package/dist/src/data-card/data-card.d.ts +3 -3
- package/dist/src/data-card/data-card.js +47 -11
- package/dist/src/data-card/data-card.js.map +1 -1
- package/dist/src/data-card/event-handlers/record-card-click-handler.d.ts +1 -1
- package/dist/src/data-card/event-handlers/record-card-click-handler.js.map +1 -1
- package/dist/src/data-card/event-handlers/record-card-dblclick-handler.d.ts +1 -1
- package/dist/src/data-card/event-handlers/record-card-dblclick-handler.js.map +1 -1
- package/dist/src/data-card/record-card.d.ts +5 -5
- package/dist/src/data-card/record-card.js +70 -19
- package/dist/src/data-card/record-card.js.map +1 -1
- package/dist/src/data-consumer.d.ts +1 -1
- package/dist/src/data-consumer.js.map +1 -1
- package/dist/src/data-grid/data-grid-accum-field.d.ts +1 -1
- package/dist/src/data-grid/data-grid-accum-field.js +63 -12
- package/dist/src/data-grid/data-grid-accum-field.js.map +1 -1
- package/dist/src/data-grid/data-grid-body.d.ts +4 -4
- package/dist/src/data-grid/data-grid-body.js +125 -32
- package/dist/src/data-grid/data-grid-body.js.map +1 -1
- package/dist/src/data-grid/data-grid-field.d.ts +1 -1
- package/dist/src/data-grid/data-grid-field.js +112 -17
- package/dist/src/data-grid/data-grid-field.js.map +1 -1
- package/dist/src/data-grid/data-grid-footer.d.ts +1 -1
- package/dist/src/data-grid/data-grid-footer.js +21 -6
- package/dist/src/data-grid/data-grid-footer.js.map +1 -1
- package/dist/src/data-grid/data-grid-header.d.ts +1 -1
- package/dist/src/data-grid/data-grid-header.js +73 -16
- package/dist/src/data-grid/data-grid-header.js.map +1 -1
- package/dist/src/data-grid/data-grid.d.ts +7 -7
- package/dist/src/data-grid/data-grid.js +52 -12
- package/dist/src/data-grid/data-grid.js.map +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-click-handler.d.ts +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-click-handler.js.map +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-contextmenu-handler.d.ts +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-contextmenu-handler.js.map +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-dblclick-handler.d.ts +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-dblclick-handler.js.map +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-focus-change-handler.d.ts +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-focus-change-handler.js.map +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-keydown-handler.d.ts +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-keydown-handler.js.map +1 -1
- package/dist/src/data-grist.d.ts +8 -8
- package/dist/src/data-grist.js +308 -91
- package/dist/src/data-grist.js.map +1 -1
- package/dist/src/data-list/data-list-field.d.ts +1 -1
- package/dist/src/data-list/data-list-field.js +39 -7
- package/dist/src/data-list/data-list-field.js.map +1 -1
- package/dist/src/data-list/data-list-gutter.d.ts +1 -1
- package/dist/src/data-list/data-list-gutter.js +39 -7
- package/dist/src/data-list/data-list-gutter.js.map +1 -1
- package/dist/src/data-list/data-list.d.ts +2 -2
- package/dist/src/data-list/data-list.js +46 -10
- package/dist/src/data-list/data-list.js.map +1 -1
- package/dist/src/data-list/event-handlers/record-partial-click-handler.d.ts +1 -1
- package/dist/src/data-list/event-handlers/record-partial-click-handler.js.map +1 -1
- package/dist/src/data-list/event-handlers/record-partial-dblclick-handler.d.ts +1 -1
- package/dist/src/data-list/event-handlers/record-partial-dblclick-handler.js.map +1 -1
- package/dist/src/data-list/event-handlers/record-partial-long-press-handler.d.ts +1 -1
- package/dist/src/data-list/event-handlers/record-partial-long-press-handler.js.map +1 -1
- package/dist/src/data-list/record-partial.d.ts +4 -4
- package/dist/src/data-list/record-partial.js +58 -17
- package/dist/src/data-list/record-partial.js.map +1 -1
- package/dist/src/data-manipulator.d.ts +1 -1
- package/dist/src/data-manipulator.js +31 -6
- package/dist/src/data-manipulator.js.map +1 -1
- package/dist/src/data-provider.js +90 -9
- package/dist/src/data-provider.js.map +1 -1
- package/dist/src/data-report/data-report-body.d.ts +2 -2
- package/dist/src/data-report/data-report-body.js +42 -10
- package/dist/src/data-report/data-report-body.js.map +1 -1
- package/dist/src/data-report/data-report-component.d.ts +3 -3
- package/dist/src/data-report/data-report-component.js +42 -10
- package/dist/src/data-report/data-report-component.js.map +1 -1
- package/dist/src/data-report/data-report-field.d.ts +1 -1
- package/dist/src/data-report/data-report-field.js +46 -9
- package/dist/src/data-report/data-report-field.js.map +1 -1
- package/dist/src/data-report/data-report-header.js +41 -8
- package/dist/src/data-report/data-report-header.js.map +1 -1
- package/dist/src/data-report/event-handlers/data-report-body-click-handler.d.ts +1 -1
- package/dist/src/data-report/event-handlers/data-report-body-click-handler.js.map +1 -1
- package/dist/src/data-report/event-handlers/data-report-body-dblclick-handler.d.ts +1 -1
- package/dist/src/data-report/event-handlers/data-report-body-dblclick-handler.js.map +1 -1
- package/dist/src/data-report/event-handlers/data-report-body-keydown-handler.d.ts +1 -1
- package/dist/src/data-report/event-handlers/data-report-body-keydown-handler.js.map +1 -1
- package/dist/src/data-report.d.ts +4 -4
- package/dist/src/data-report.js +88 -16
- package/dist/src/data-report.js.map +1 -1
- package/dist/src/editors/index.d.ts +1 -1
- package/dist/src/editors/index.js +1 -1
- package/dist/src/editors/index.js.map +1 -1
- package/dist/src/editors/ox-grist-editor-multiple-select.js +9 -4
- package/dist/src/editors/ox-grist-editor-multiple-select.js.map +1 -1
- package/dist/src/editors/ox-grist-editor-tree.d.ts +1 -1
- package/dist/src/editors/ox-grist-editor-tree.js +9 -4
- package/dist/src/editors/ox-grist-editor-tree.js.map +1 -1
- package/dist/src/editors/ox-grist-editor.d.ts +2 -2
- package/dist/src/editors/ox-grist-editor.js +49 -4
- package/dist/src/editors/ox-grist-editor.js.map +1 -1
- package/dist/src/editors/ox-input-tree.d.ts +1 -1
- package/dist/src/editors/ox-input-tree.js +37 -3
- package/dist/src/editors/ox-input-tree.js.map +1 -1
- package/dist/src/editors/registry.d.ts +2 -2
- package/dist/src/editors/registry.js +19 -19
- package/dist/src/editors/registry.js.map +1 -1
- package/dist/src/empty-note.js +28 -2
- package/dist/src/empty-note.js.map +1 -1
- package/dist/src/filters/filter-input.d.ts +1 -1
- package/dist/src/filters/filter-input.js.map +1 -1
- package/dist/src/filters/filter-range-date.d.ts +1 -1
- package/dist/src/filters/filter-range-date.js.map +1 -1
- package/dist/src/filters/filter-range-number.d.ts +1 -1
- package/dist/src/filters/filter-range-number.js.map +1 -1
- package/dist/src/filters/filter-select-buttons.d.ts +1 -1
- package/dist/src/filters/filter-select-buttons.js.map +1 -1
- package/dist/src/filters/filter-select.d.ts +1 -1
- package/dist/src/filters/filter-select.js +1 -1
- package/dist/src/filters/filter-select.js.map +1 -1
- package/dist/src/filters/filters-form.d.ts +1 -2
- package/dist/src/filters/filters-form.js +91 -15
- package/dist/src/filters/filters-form.js.map +1 -1
- package/dist/src/filters/index.d.ts +8 -8
- package/dist/src/filters/index.js +8 -8
- package/dist/src/filters/index.js.map +1 -1
- package/dist/src/formatters/index.d.ts +1 -1
- package/dist/src/formatters/index.js +1 -1
- package/dist/src/formatters/index.js.map +1 -1
- package/dist/src/formatters/registry.js +4 -4
- package/dist/src/formatters/registry.js.map +1 -1
- package/dist/src/gutters/gutter-button.d.ts +1 -1
- package/dist/src/gutters/gutter-button.js.map +1 -1
- package/dist/src/gutters/gutter-dirty.d.ts +1 -1
- package/dist/src/gutters/gutter-dirty.js +16 -2
- package/dist/src/gutters/gutter-dirty.js.map +1 -1
- package/dist/src/gutters/gutter-row-selector.d.ts +1 -1
- package/dist/src/gutters/gutter-row-selector.js.map +1 -1
- package/dist/src/gutters/gutter-sequence.d.ts +9 -9
- package/dist/src/gutters/gutter-sequence.js.map +1 -1
- package/dist/src/gutters/index.d.ts +1 -1
- package/dist/src/gutters/index.js +1 -1
- package/dist/src/gutters/index.js.map +1 -1
- package/dist/src/gutters/registry.d.ts +1 -1
- package/dist/src/gutters/registry.js +4 -4
- package/dist/src/gutters/registry.js.map +1 -1
- package/dist/src/handlers/contextmenu-tree-mutation.d.ts +2 -2
- package/dist/src/handlers/contextmenu-tree-mutation.js.map +1 -1
- package/dist/src/handlers/index.d.ts +1 -1
- package/dist/src/handlers/index.js +1 -1
- package/dist/src/handlers/index.js.map +1 -1
- package/dist/src/handlers/move-down.d.ts +2 -2
- package/dist/src/handlers/move-down.js.map +1 -1
- package/dist/src/handlers/move-up.d.ts +2 -2
- package/dist/src/handlers/move-up.js.map +1 -1
- package/dist/src/handlers/record-copy.d.ts +2 -2
- package/dist/src/handlers/record-copy.js.map +1 -1
- package/dist/src/handlers/record-delete.d.ts +2 -2
- package/dist/src/handlers/record-delete.js.map +1 -1
- package/dist/src/handlers/record-view-handler.d.ts +2 -2
- package/dist/src/handlers/record-view-handler.js.map +1 -1
- package/dist/src/handlers/registry.d.ts +1 -1
- package/dist/src/handlers/registry.js +8 -8
- package/dist/src/handlers/registry.js.map +1 -1
- package/dist/src/handlers/select-row-toggle.d.ts +2 -2
- package/dist/src/handlers/select-row-toggle.js.map +1 -1
- package/dist/src/handlers/select-row.d.ts +2 -2
- package/dist/src/handlers/select-row.js.map +1 -1
- package/dist/src/index.d.ts +14 -14
- package/dist/src/index.js +14 -14
- package/dist/src/index.js.map +1 -1
- package/dist/src/personalizer/index.d.ts +1 -1
- package/dist/src/personalizer/index.js +1 -1
- package/dist/src/personalizer/index.js.map +1 -1
- package/dist/src/personalizer/ox-grist-filter-personalizer.js +20 -4
- package/dist/src/personalizer/ox-grist-filter-personalizer.js.map +1 -1
- package/dist/src/personalizer/ox-grist-personalizer.js +20 -4
- package/dist/src/personalizer/ox-grist-personalizer.js.map +1 -1
- package/dist/src/record-view/event-handlers/record-view-body-click-handler.d.ts +1 -1
- package/dist/src/record-view/event-handlers/record-view-body-click-handler.js.map +1 -1
- package/dist/src/record-view/event-handlers/record-view-body-keydown-handler.d.ts +1 -1
- package/dist/src/record-view/event-handlers/record-view-body-keydown-handler.js.map +1 -1
- package/dist/src/record-view/index.d.ts +2 -2
- package/dist/src/record-view/index.js +2 -2
- package/dist/src/record-view/index.js.map +1 -1
- package/dist/src/record-view/ox-record-creator.d.ts +3 -3
- package/dist/src/record-view/ox-record-creator.js +40 -7
- package/dist/src/record-view/ox-record-creator.js.map +1 -1
- package/dist/src/record-view/record-view-body.d.ts +2 -2
- package/dist/src/record-view/record-view-body.js +35 -9
- package/dist/src/record-view/record-view-body.js.map +1 -1
- package/dist/src/record-view/record-view-handler.d.ts +6 -6
- package/dist/src/record-view/record-view-handler.js.map +1 -1
- package/dist/src/record-view/record-view.d.ts +4 -4
- package/dist/src/record-view/record-view.js +36 -10
- package/dist/src/record-view/record-view.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-boolean.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-boolean.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-color.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-color.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-date.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-date.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-file.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-file.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-image.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-image.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-json5.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-json5.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-link.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-link.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-password.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-password.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-progress.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-progress.js +8 -3
- package/dist/src/renderers/ox-grist-renderer-progress.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-select.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-select.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-text.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-text.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-textarea.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-textarea.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-tree.d.ts +1 -1
- package/dist/src/renderers/ox-grist-renderer-tree.js +20 -4
- package/dist/src/renderers/ox-grist-renderer-tree.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer.d.ts +2 -2
- package/dist/src/renderers/ox-grist-renderer.js +43 -4
- package/dist/src/renderers/ox-grist-renderer.js.map +1 -1
- package/dist/src/sorters/sorters-control.d.ts +1 -1
- package/dist/src/sorters/sorters-control.js +26 -5
- package/dist/src/sorters/sorters-control.js.map +1 -1
- package/dist/src/types.d.ts +11 -11
- package/dist/src/types.js.map +1 -1
- package/dist/src/utils/index.d.ts +2 -2
- package/dist/src/utils/index.js +2 -2
- package/dist/src/utils/index.js.map +1 -1
- package/dist/src/utils/list-param.d.ts +1 -1
- package/dist/src/utils/list-param.js +1 -1
- package/dist/src/utils/list-param.js.map +1 -1
- package/dist/stories/accumulator-format.stories.js +1 -1
- package/dist/stories/accumulator-format.stories.js.map +1 -1
- package/dist/stories/barcode-input-filter.stories.js +1 -1
- package/dist/stories/barcode-input-filter.stories.js.map +1 -1
- package/dist/stories/bounded-select-filters.stories.js +1 -1
- package/dist/stories/bounded-select-filters.stories.js.map +1 -1
- package/dist/stories/bounded-select-record.stories.js +1 -1
- package/dist/stories/bounded-select-record.stories.js.map +1 -1
- package/dist/stories/click-event-custom.stories.js +1 -1
- package/dist/stories/click-event-custom.stories.js.map +1 -1
- package/dist/stories/click-event.stories.js +1 -1
- package/dist/stories/click-event.stories.js.map +1 -1
- package/dist/stories/creatable-only-column.stories.js +1 -1
- package/dist/stories/creatable-only-column.stories.js.map +1 -1
- package/dist/stories/default-filters.stories.js +1 -1
- package/dist/stories/default-filters.stories.js.map +1 -1
- package/dist/stories/dynamic-editable.stories.js +1 -1
- package/dist/stories/dynamic-editable.stories.js.map +1 -1
- package/dist/stories/empty-sorters.stories.js +1 -1
- package/dist/stories/empty-sorters.stories.js.map +1 -1
- package/dist/stories/explicit-fetch.stories.js +1 -1
- package/dist/stories/explicit-fetch.stories.js.map +1 -1
- package/dist/stories/fixed-column.stories.js +1 -1
- package/dist/stories/fixed-column.stories.js.map +1 -1
- package/dist/stories/grid-setting.stories.js +1 -1
- package/dist/stories/grid-setting.stories.js.map +1 -1
- package/dist/stories/grist-modes.stories.js +1 -1
- package/dist/stories/grist-modes.stories.js.map +1 -1
- package/dist/stories/group-header.stories.js +1 -1
- package/dist/stories/group-header.stories.js.map +1 -1
- package/dist/stories/record-view.stories.js +1 -1
- package/dist/stories/record-view.stories.js.map +1 -1
- package/dist/stories/textarea.stories.js +1 -1
- package/dist/stories/textarea.stories.js.map +1 -1
- package/dist/stories/tree-column-with-checkbox.stories.js +1 -1
- package/dist/stories/tree-column-with-checkbox.stories.js.map +1 -1
- package/dist/stories/tree-column.stories.js +1 -1
- package/dist/stories/tree-column.stories.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/index.ts +1 -1
- package/package.json +12 -11
@@ -1,18 +1,49 @@
|
|
1
1
|
import { __decorate } from "tslib";
|
2
2
|
import '@material/web/icon/icon.js';
|
3
|
-
import '../empty-note';
|
4
|
-
import './record-card';
|
3
|
+
import '../empty-note.js';
|
4
|
+
import './record-card.js';
|
5
5
|
import { css, html } from 'lit';
|
6
6
|
import { customElement, property, state } from 'lit/decorators.js';
|
7
|
-
import { DataManipulator } from '../data-manipulator';
|
7
|
+
import { DataManipulator } from '../data-manipulator.js';
|
8
8
|
let DataCard = class DataCard extends DataManipulator {
|
9
9
|
constructor() {
|
10
10
|
super(...arguments);
|
11
|
-
this
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
11
|
+
Object.defineProperty(this, "empty", {
|
12
|
+
enumerable: true,
|
13
|
+
configurable: true,
|
14
|
+
writable: true,
|
15
|
+
value: void 0
|
16
|
+
});
|
17
|
+
Object.defineProperty(this, "_records", {
|
18
|
+
enumerable: true,
|
19
|
+
configurable: true,
|
20
|
+
writable: true,
|
21
|
+
value: []
|
22
|
+
});
|
23
|
+
Object.defineProperty(this, "isTop", {
|
24
|
+
enumerable: true,
|
25
|
+
configurable: true,
|
26
|
+
writable: true,
|
27
|
+
value: false
|
28
|
+
});
|
29
|
+
Object.defineProperty(this, "_total", {
|
30
|
+
enumerable: true,
|
31
|
+
configurable: true,
|
32
|
+
writable: true,
|
33
|
+
value: 0
|
34
|
+
});
|
35
|
+
Object.defineProperty(this, "_limit", {
|
36
|
+
enumerable: true,
|
37
|
+
configurable: true,
|
38
|
+
writable: true,
|
39
|
+
value: 20
|
40
|
+
});
|
41
|
+
Object.defineProperty(this, "_page", {
|
42
|
+
enumerable: true,
|
43
|
+
configurable: true,
|
44
|
+
writable: true,
|
45
|
+
value: 1
|
46
|
+
});
|
16
47
|
}
|
17
48
|
firstUpdated(changes) {
|
18
49
|
this.isTop = true;
|
@@ -79,8 +110,12 @@ let DataCard = class DataCard extends DataManipulator {
|
|
79
110
|
return this;
|
80
111
|
}
|
81
112
|
};
|
82
|
-
DataCard
|
83
|
-
|
113
|
+
Object.defineProperty(DataCard, "styles", {
|
114
|
+
enumerable: true,
|
115
|
+
configurable: true,
|
116
|
+
writable: true,
|
117
|
+
value: [
|
118
|
+
css `
|
84
119
|
:host {
|
85
120
|
overflow-y: auto;
|
86
121
|
padding: var(--spacing-medium);
|
@@ -132,7 +167,8 @@ DataCard.styles = [
|
|
132
167
|
}
|
133
168
|
}
|
134
169
|
`
|
135
|
-
]
|
170
|
+
]
|
171
|
+
});
|
136
172
|
__decorate([
|
137
173
|
property({ type: Boolean })
|
138
174
|
], DataCard.prototype, "empty", void 0);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"data-card.js","sourceRoot":"","sources":["../../../src/data-card/data-card.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,
|
1
|
+
{"version":3,"file":"data-card.js","sourceRoot":"","sources":["../../../src/data-card/data-card.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '../empty-note.js'\nimport './record-card.js'\n\nimport { PropertyValues, css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { DataManipulator } from '../data-manipulator.js'\nimport { GristRecord } from '../types.js'\n\n@customElement('ox-card')\nexport class DataCard extends DataManipulator {\n static styles = [\n css`\n :host {\n overflow-y: auto;\n padding: var(--spacing-medium);\n\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n grid-template-rows: min-content;\n grid-gap: var(--spacing-large);\n }\n\n [selected-row] {\n background-color: var(--grid-record-selected-background-color);\n }\n\n #upward {\n --md-icon-size: var(--icon-size-large);\n position: absolute;\n top: var(--data-card-fab-position-vertical);\n right: var(--data-card-fab-position-horizontal);\n background-color: rgba(255, 255, 255, 0.7);\n border-radius: var(--md-sys-shape-corner-large);\n color: var(--data-card-fab-color);\n box-shadow: var(--data-card-fab-shadow);\n padding: var(--spacing-small);\n }\n\n slot {\n width: 100%;\n }\n\n ox-empty-note {\n display: block;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n\n [card][emphasized-row],\n [card][emphasized-row][focused] {\n background-color: var(--grid-record-emphasized-background-color);\n color: var(--grid-record-emphasized-color);\n }\n\n @media screen and (max-width: 460px) {\n #setting {\n grid-template-columns: 1fr;\n grid-template-rows: 1fr 1fr;\n }\n }\n `\n ]\n\n @property({ type: Boolean }) empty?: boolean\n\n @state() private _records: GristRecord[] = []\n @state() private isTop: boolean = false\n\n private _total: number = 0\n private _limit: number = 20\n private _page: number = 1\n\n firstUpdated(changes: PropertyValues<this>) {\n this.isTop = true\n\n /* infinite scrolling */\n this.addEventListener('scroll', e => {\n const totalScrollHeight = this.scrollHeight\n const screenHeight = this.offsetHeight\n const currentScrollTop = this.scrollTop\n\n if (totalScrollHeight <= screenHeight + currentScrollTop + 1) {\n /* 마지막 페이지까지 계속 페이지를 증가시킨다. */\n var lastPage = Math.ceil(this._total / this._limit)\n\n if (this._page < lastPage) {\n this.dispatchEvent(new CustomEvent('attach-page', { bubbles: true, composed: true }))\n }\n }\n\n this.isTop = this.scrollTop == 0\n })\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('config')) {\n this._records = []\n this._page = 1\n }\n\n if (changes.has('data')) {\n this._records = this.data.records\n this._total = this.data.total || 0\n this._limit = this.data.limit || 20\n this._page = this.data.page || 0\n }\n }\n\n render() {\n var { classifier } = this.config.rows\n var records = this._records || []\n\n if (this.config && this.config.rows.appendable) {\n records = [...records, { __dirty__: '+' }]\n }\n\n return html`\n ${records.map((record, rowIndex) => {\n var { emphasized } = classifier.call(null, record, rowIndex) || {}\n\n return html`\n <ox-record-card\n .config=${this.config}\n .data=${this.data}\n .record=${record}\n .rowIndex=${rowIndex}\n .emphasized=${emphasized}\n ?selected-row=${record['__selected__']}\n ?dirty=${record['__dirty__']}\n card\n ></ox-record-card>\n `\n })}\n ${this.empty ? html` <ox-empty-note title=\"NO RECORDS\"></ox-empty-note> ` : html``}\n ${this.isTop\n ? html``\n : html` <md-icon id=\"upward\" @click=${(e: Event) => this.gotoTop(e)}>arrow_upward</md-icon> `}\n `\n }\n\n gotoTop(e: Event) {\n this.scrollTop = 0\n\n e.stopPropagation()\n }\n\n get pullToRefreshTarget() {\n return this\n }\n}\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"record-card-click-handler.js","sourceRoot":"","sources":["../../../../src/data-card/event-handlers/record-card-click-handler.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAAmB,CAAa;IACpE,CAAC,CAAC,eAAe,EAAE,CAAA;IAEnB,uEAAuE;IACvE,IAAI,MAAM,GAAI,CAAC,CAAC,MAAkB,CAAC,OAAO,CAAC,+BAA+B,CAAmC,CAAA;IAC7G,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,IAAI,EAAE,CAAA;IAEvC,6BAA6B;IAC7B,IAAI,MAAM,EAAE,CAAC;QACX,IAAI,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC,QAAQ,CAAA;QAC/B,IAAI,KAAK,EAAE,CAAC;YACV,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;YAC5E,OAAM;QACR,CAAC;IACH,CAAC;IAED,2BAA2B;IAC3B,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAA;IACpD,IAAI,SAAS,EAAE,CAAC;QACd,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;IAClF,CAAC;SAAM,CAAC;QACN,uCAAuC;QACvC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,eAAe,EAAE,CAAA;IACrD,CAAC;AACH,CAAC","sourcesContent":["import { DataCardField } from '../data-card-field'\nimport { DataCardGutter } from '../data-card-gutter'\nimport { RecordCard } from '../record-card'\n\n/**\n * ox-record-card 의 click handler\n *\n * - handler의 this 는 ox-record-card임.\n */\nexport function recordCardClickHandler(this: RecordCard, e: MouseEvent): void {\n e.stopPropagation()\n\n /* target should be [content] or 'ox-card-field' or 'ox-card-gutter' */\n var target = (e.target as Element).closest('ox-card-field, ox-card-gutter') as DataCardField | DataCardGutter\n var { column, rowIndex } = target || {}\n\n /* do column click handler */\n if (column) {\n var { click } = column.handlers\n if (click) {\n click(this.config.columns, this.data, column, this.record, rowIndex, target)\n return\n }\n }\n\n /* do rows click handler */\n var { click: rowsClick } = this.config.rows.handlers\n if (rowsClick) {\n rowsClick(this.config.columns, this.data, column, this.record, rowIndex, target)\n } else {\n /* content 가 클릭된 경우 - 레코드뷰 팝업을 실행한다. */\n this.config.rows.editable && this.popupRecordView()\n }\n}\n"]}
|
1
|
+
{"version":3,"file":"record-card-click-handler.js","sourceRoot":"","sources":["../../../../src/data-card/event-handlers/record-card-click-handler.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAAmB,CAAa;IACpE,CAAC,CAAC,eAAe,EAAE,CAAA;IAEnB,uEAAuE;IACvE,IAAI,MAAM,GAAI,CAAC,CAAC,MAAkB,CAAC,OAAO,CAAC,+BAA+B,CAAmC,CAAA;IAC7G,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,IAAI,EAAE,CAAA;IAEvC,6BAA6B;IAC7B,IAAI,MAAM,EAAE,CAAC;QACX,IAAI,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC,QAAQ,CAAA;QAC/B,IAAI,KAAK,EAAE,CAAC;YACV,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;YAC5E,OAAM;QACR,CAAC;IACH,CAAC;IAED,2BAA2B;IAC3B,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAA;IACpD,IAAI,SAAS,EAAE,CAAC;QACd,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;IAClF,CAAC;SAAM,CAAC;QACN,uCAAuC;QACvC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,eAAe,EAAE,CAAA;IACrD,CAAC;AACH,CAAC","sourcesContent":["import { DataCardField } from '../data-card-field.js'\nimport { DataCardGutter } from '../data-card-gutter.js'\nimport { RecordCard } from '../record-card.js'\n\n/**\n * ox-record-card 의 click handler\n *\n * - handler의 this 는 ox-record-card임.\n */\nexport function recordCardClickHandler(this: RecordCard, e: MouseEvent): void {\n e.stopPropagation()\n\n /* target should be [content] or 'ox-card-field' or 'ox-card-gutter' */\n var target = (e.target as Element).closest('ox-card-field, ox-card-gutter') as DataCardField | DataCardGutter\n var { column, rowIndex } = target || {}\n\n /* do column click handler */\n if (column) {\n var { click } = column.handlers\n if (click) {\n click(this.config.columns, this.data, column, this.record, rowIndex, target)\n return\n }\n }\n\n /* do rows click handler */\n var { click: rowsClick } = this.config.rows.handlers\n if (rowsClick) {\n rowsClick(this.config.columns, this.data, column, this.record, rowIndex, target)\n } else {\n /* content 가 클릭된 경우 - 레코드뷰 팝업을 실행한다. */\n this.config.rows.editable && this.popupRecordView()\n }\n}\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"record-card-dblclick-handler.js","sourceRoot":"","sources":["../../../../src/data-card/event-handlers/record-card-dblclick-handler.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAAmB,CAAa;IACvE,CAAC,CAAC,eAAe,EAAE,CAAA;IAEnB,uEAAuE;IACvE,IAAI,MAAM,GAAI,CAAC,CAAC,MAAkB,CAAC,OAAO,CAAC,+BAA+B,CAAmC,CAAA;IAE7G,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,IAAI,EAAE,CAAA;IAE/C,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE,CAAC;QACtC;;;;WAIG;QACH,6BAA6B;QAC7B,qCAAqC;QACrC,kFAAkF;QAClF,SAAS;IACX,CAAC;SAAM,CAAC;QACN,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAA;QAC1D,IAAI,YAAY,EAAE,CAAC;YACjB,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;QAChF,CAAC;IACH,CAAC;AACH,CAAC","sourcesContent":["import { DataCardField } from '../data-card-field'\nimport { DataCardGutter } from '../data-card-gutter'\nimport { RecordCard } from '../record-card'\n\n/**\n * ox-record-card 의 dblclick handler\n *\n * - handler의 this 는 ox-record-card임.\n */\nexport function recordCardDblClickHandler(this: RecordCard, e: MouseEvent): void {\n e.stopPropagation()\n\n /* target should be [content] or 'ox-card-field' or 'ox-card-gutter' */\n var target = (e.target as Element).closest('ox-card-field, ox-card-gutter') as DataCardField | DataCardGutter\n\n var { column, record, rowIndex } = target || {}\n\n if (column && column.type == 'gutter') {\n /*\n * Gutter가 클릭된 경우\n * TODO ox-record-card의 dblclick handling의 성능을 확인하고,\n * gutter에 dblclick를 적용할 수 있는 지 확인한 후에 활성화하자.\n */\n /* do column click handler */\n // var { dblclick } = column.handlers\n // dblclick && dblclick(this.columns, this.data, column, record, rowIndex, target)\n // return\n } else {\n var { dblclick: rowsDblClick } = this.config.rows.handlers\n if (rowsDblClick) {\n rowsDblClick(this.config.columns, this.data, column, record, rowIndex, target)\n }\n }\n}\n"]}
|
1
|
+
{"version":3,"file":"record-card-dblclick-handler.js","sourceRoot":"","sources":["../../../../src/data-card/event-handlers/record-card-dblclick-handler.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAAmB,CAAa;IACvE,CAAC,CAAC,eAAe,EAAE,CAAA;IAEnB,uEAAuE;IACvE,IAAI,MAAM,GAAI,CAAC,CAAC,MAAkB,CAAC,OAAO,CAAC,+BAA+B,CAAmC,CAAA;IAE7G,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,IAAI,EAAE,CAAA;IAE/C,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE,CAAC;QACtC;;;;WAIG;QACH,6BAA6B;QAC7B,qCAAqC;QACrC,kFAAkF;QAClF,SAAS;IACX,CAAC;SAAM,CAAC;QACN,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAA;QAC1D,IAAI,YAAY,EAAE,CAAC;YACjB,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;QAChF,CAAC;IACH,CAAC;AACH,CAAC","sourcesContent":["import { DataCardField } from '../data-card-field.js'\nimport { DataCardGutter } from '../data-card-gutter.js'\nimport { RecordCard } from '../record-card.js'\n\n/**\n * ox-record-card 의 dblclick handler\n *\n * - handler의 this 는 ox-record-card임.\n */\nexport function recordCardDblClickHandler(this: RecordCard, e: MouseEvent): void {\n e.stopPropagation()\n\n /* target should be [content] or 'ox-card-field' or 'ox-card-gutter' */\n var target = (e.target as Element).closest('ox-card-field, ox-card-gutter') as DataCardField | DataCardGutter\n\n var { column, record, rowIndex } = target || {}\n\n if (column && column.type == 'gutter') {\n /*\n * Gutter가 클릭된 경우\n * TODO ox-record-card의 dblclick handling의 성능을 확인하고,\n * gutter에 dblclick를 적용할 수 있는 지 확인한 후에 활성화하자.\n */\n /* do column click handler */\n // var { dblclick } = column.handlers\n // dblclick && dblclick(this.columns, this.data, column, record, rowIndex, target)\n // return\n } else {\n var { dblclick: rowsDblClick } = this.config.rows.handlers\n if (rowsDblClick) {\n rowsDblClick(this.config.columns, this.data, column, record, rowIndex, target)\n }\n }\n}\n"]}
|
@@ -1,10 +1,10 @@
|
|
1
1
|
import '@material/web/icon/icon.js';
|
2
|
-
import '
|
3
|
-
import '
|
4
|
-
import './data-card-gutter';
|
5
|
-
import './data-card-gutter-menu';
|
6
|
-
import { GristConfig, GristData, GristRecord } from '../types';
|
2
|
+
import '../record-view/record-view.js';
|
3
|
+
import './data-card-field.js';
|
4
|
+
import './data-card-gutter.js';
|
5
|
+
import './data-card-gutter-menu.js';
|
7
6
|
import { LitElement, PropertyValues } from 'lit';
|
7
|
+
import { GristConfig, GristData, GristRecord } from '../types.js';
|
8
8
|
export declare class RecordCard extends LitElement {
|
9
9
|
static styles: import("lit").CSSResult[];
|
10
10
|
config: GristConfig;
|
@@ -1,15 +1,15 @@
|
|
1
1
|
import { __decorate } from "tslib";
|
2
2
|
import '@material/web/icon/icon.js';
|
3
|
-
import '
|
4
|
-
import '
|
5
|
-
import './data-card-gutter';
|
6
|
-
import './data-card-gutter-menu';
|
3
|
+
import '../record-view/record-view.js';
|
4
|
+
import './data-card-field.js';
|
5
|
+
import './data-card-gutter.js';
|
6
|
+
import './data-card-gutter-menu.js';
|
7
7
|
import { LitElement, css, html } from 'lit';
|
8
|
-
import { ZERO_CONFIG, ZERO_DATA, ZERO_RECORD } from '../configure/zero-config';
|
9
8
|
import { customElement, property } from 'lit/decorators.js';
|
10
|
-
import {
|
11
|
-
import {
|
12
|
-
import {
|
9
|
+
import { ZERO_CONFIG, ZERO_DATA, ZERO_RECORD } from '../configure/zero-config.js';
|
10
|
+
import { RecordViewHandler } from '../record-view/record-view-handler.js';
|
11
|
+
import { recordCardClickHandler } from './event-handlers/record-card-click-handler.js';
|
12
|
+
import { recordCardDblClickHandler } from './event-handlers/record-card-dblclick-handler.js';
|
13
13
|
// TODO 로케일 설정에 따라서 포맷이 바뀌도록 해야한다.
|
14
14
|
const OPTIONS = {
|
15
15
|
year: 'numeric',
|
@@ -34,18 +34,64 @@ const formatter = getSafeFormatter(navigator.language, OPTIONS);
|
|
34
34
|
let RecordCard = class RecordCard extends LitElement {
|
35
35
|
constructor() {
|
36
36
|
super(...arguments);
|
37
|
-
this
|
38
|
-
|
39
|
-
|
40
|
-
|
37
|
+
Object.defineProperty(this, "config", {
|
38
|
+
enumerable: true,
|
39
|
+
configurable: true,
|
40
|
+
writable: true,
|
41
|
+
value: ZERO_CONFIG
|
42
|
+
});
|
43
|
+
Object.defineProperty(this, "data", {
|
44
|
+
enumerable: true,
|
45
|
+
configurable: true,
|
46
|
+
writable: true,
|
47
|
+
value: ZERO_DATA
|
48
|
+
});
|
49
|
+
Object.defineProperty(this, "record", {
|
50
|
+
enumerable: true,
|
51
|
+
configurable: true,
|
52
|
+
writable: true,
|
53
|
+
value: ZERO_RECORD
|
54
|
+
});
|
55
|
+
Object.defineProperty(this, "rowIndex", {
|
56
|
+
enumerable: true,
|
57
|
+
configurable: true,
|
58
|
+
writable: true,
|
59
|
+
value: -1
|
60
|
+
});
|
41
61
|
/*
|
42
62
|
* row-selector를 사용자가 변경할 때, record-card의 update를 유도하기 위해 selected-row attribute를 property에 추가함.
|
43
63
|
* (이를 해주지 않으면, 리스트 refresh 경우에 selected-row checkbox가 클리어되지 않는 현상이 발생함.)
|
44
64
|
*/
|
45
|
-
this
|
46
|
-
|
47
|
-
|
48
|
-
|
65
|
+
Object.defineProperty(this, "selectedRow", {
|
66
|
+
enumerable: true,
|
67
|
+
configurable: true,
|
68
|
+
writable: true,
|
69
|
+
value: false
|
70
|
+
});
|
71
|
+
Object.defineProperty(this, "emphasized", {
|
72
|
+
enumerable: true,
|
73
|
+
configurable: true,
|
74
|
+
writable: true,
|
75
|
+
value: false
|
76
|
+
});
|
77
|
+
Object.defineProperty(this, "_recordView", {
|
78
|
+
enumerable: true,
|
79
|
+
configurable: true,
|
80
|
+
writable: true,
|
81
|
+
value: void 0
|
82
|
+
});
|
83
|
+
Object.defineProperty(this, "clickHandler", {
|
84
|
+
enumerable: true,
|
85
|
+
configurable: true,
|
86
|
+
writable: true,
|
87
|
+
value: recordCardClickHandler.bind(this)
|
88
|
+
});
|
89
|
+
Object.defineProperty(this, "dblclickHandler", {
|
90
|
+
enumerable: true,
|
91
|
+
configurable: true,
|
92
|
+
writable: true,
|
93
|
+
value: recordCardDblClickHandler.bind(this)
|
94
|
+
});
|
49
95
|
}
|
50
96
|
firstUpdated() {
|
51
97
|
/*
|
@@ -168,8 +214,12 @@ let RecordCard = class RecordCard extends LitElement {
|
|
168
214
|
});
|
169
215
|
}
|
170
216
|
};
|
171
|
-
RecordCard
|
172
|
-
|
217
|
+
Object.defineProperty(RecordCard, "styles", {
|
218
|
+
enumerable: true,
|
219
|
+
configurable: true,
|
220
|
+
writable: true,
|
221
|
+
value: [
|
222
|
+
css `
|
173
223
|
:host {
|
174
224
|
display: flex;
|
175
225
|
flex-direction: column;
|
@@ -262,7 +312,8 @@ RecordCard.styles = [
|
|
262
312
|
color: var(--data-card-item-disc-color, var(--md-sys-color-tertiary));
|
263
313
|
}
|
264
314
|
`
|
265
|
-
]
|
315
|
+
]
|
316
|
+
});
|
266
317
|
__decorate([
|
267
318
|
property({ type: Object })
|
268
319
|
], RecordCard.prototype, "config", void 0);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"record-card.js","sourceRoot":"","sources":["../../../src/data-card/record-card.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,mBAAmB,CAAA;AAC1B,OAAO,gBAAgB,CAAA;AACvB,OAAO,oBAAoB,CAAA;AAC3B,OAAO,yBAAyB,CAAA;AAGhC,OAAO,EAAE,UAAU,EAAkB,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAC9E,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAA;AACtE,OAAO,EAAE,sBAAsB,EAAE,MAAM,4CAA4C,CAAA;AACnF,OAAO,EAAE,yBAAyB,EAAE,MAAM,+CAA+C,CAAA;AAEzF,kCAAkC;AAClC,MAAM,OAAO,GAA+B;IAC1C,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,SAAS;IAChB,GAAG,EAAE,SAAS;IACd,IAAI,EAAE,SAAS;IACf,MAAM,EAAE,SAAS;IACjB,MAAM,EAAE,SAAS;IACjB,MAAM,EAAE,KAAK;IACb,kCAAkC;CACnC,CAAA;AAED,SAAS,gBAAgB,CAAC,MAAc,EAAE,OAAmC;IAC3E,IAAI,CAAC;QACH,MAAM,UAAU,GAAG,MAAM,IAAI,OAAO,CAAA;QACpC,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,OAAO,CAAC,CAAA;IACrD,CAAC;IAAC,OAAO,CAAC,EAAE,CAAC;QACX,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE,OAAO,CAAC,CAAA;IAClD,CAAC;AACH,CAAC;AAED,MAAM,SAAS,GAAG,gBAAgB,CAAC,SAAS,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;AAGxD,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QAiGuB,WAAM,GAAgB,WAAW,CAAA;QACjC,SAAI,GAAc,SAAS,CAAA;QAC3B,WAAM,GAAgB,WAAW,CAAA;QACjC,aAAQ,GAAW,CAAC,CAAC,CAAA;QACjD;;;WAGG;QACqD,gBAAW,GAAY,KAAK,CAAA;QACpD,eAAU,GAAQ,KAAK,CAAA;QAG/C,iBAAY,GAAG,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAkB,CAAA;QACjE,oBAAe,GAAG,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAkB,CAAA;IAoJjF,CAAC;IAlJC,YAAY;QACV;;;UAGE;QACF,4DAA4D;QAC5D,2FAA2F;QAC3F,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,CAAA;QAC5D,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,eAAe,CAAC,CAAA;QAElE,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC,CAAA;IACzE,CAAC;IAED,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YAC9C,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;QACvC,CAAC;QAED,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAA;QAElC,IAAI,CAAC,CAAC,UAAU,EAAE,CAAC;YACjB,IAAI,CAAC,YAAY,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAA;YAEvC,IAAI,MAAM,CAAC,QAAQ,IAAI,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC;gBAC1C,MAAM,CAAC,eAAe,EAAE,eAAe,CAAC,GAAG,UAAsB,CAAA;gBACjE,eAAe,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,2CAA2C,EAAE,eAAe,CAAC,CAAA;gBACvG,eAAe,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,gCAAgC,EAAE,eAAe,CAAC,CAAA;YAC9F,CAAC;QACH,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,eAAe,CAAC,gBAAgB,CAAC,CAAA;QACxC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;QAC1B,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAA;QAC9B,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,MAAM,CAAA;QACrC,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,IAAI,EAAE,CAAA;QAEjD,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,CAAA;QACpH,MAAM,YAAY,GAChB,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,CAAA;QAEnG,MAAM,eAAe,GAAG,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;QAEhG,MAAM,OAAO,GAAG,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,QAAQ,IAAI,MAAM,CAAC,OAAO,CAAC,CAAA;QAE3F,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,EAAE,CAAC;YAC/B,IAAI,SAAS,CAAA;YAEb,QAAQ,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;gBACjC,KAAK,GAAG;oBACN,SAAS,GAAG,MAAM,CAAA;oBAClB,MAAK;gBACP,KAAK,GAAG;oBACN,SAAS,GAAG,KAAK,CAAA;oBACjB,MAAK;gBACP,KAAK,GAAG;oBACN,SAAS,GAAG,QAAQ,CAAA;oBACpB,MAAK;YACT,CAAC;QACH,CAAC;QAED,OAAO,IAAI,CAAA;QACP,SAAS,CAAC,CAAC,CAAC,IAAI,CAAA,mBAAmB,SAAS,aAAa,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE;QAClE,eAAe;YACf,CAAC,CAAC,IAAI,CAAA;;wBAEU,QAAQ;sBACV,eAAe;sBACf,MAAM;qBACP,MAAM,CAAC,CAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,IAAI,KAAI,EAAE,CAAC;4BAC5B;YACpB,CAAC,CAAC,IAAI,CAAA,EAAE;;;;YAIJ,WAAW,CAAC,GAAG,CACf,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE,CAAC,IAAI,CAAA;;4BAEL,QAAQ;0BACV,MAAM;0BACN,MAAM;yBACP,MAAM,CAAC,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,KAAI,EAAE,CAAC;wBAC3B,GAAG,IAAI,CAAC;wBACR,GAAG,IAAI,CAAC;;aAEnB,CACF;;UAED,YAAY,CAAC,MAAM,GAAG,CAAC;YACvB,CAAC,CAAC,IAAI,CAAA;;kBAEE,YAAY,CAAC,GAAG,CAChB,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE,CAAC,IAAI,CAAA;;kCAEL,QAAQ;gCACV,MAAM;gCACN,MAAM;+BACP,MAAM,CAAC,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,KAAI,EAAE,CAAC;;mBAEtC,CACF;;aAEJ;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;;;;UAIR,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;YACrB,OAAO,IAAI,CAAA;;0BAEK,QAAQ;wBACV,MAAM;wBACN,MAAM;uBACP,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC;;WAE/B,CAAA;QACH,CAAC,CAAC;;KAEL,CAAA;IACH,CAAC;IAED,eAAe;QACb,IAAI,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAA;QACrD,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAA;QAEnC,wCAAwC;QACxC,IAAI,OAAO,KAAK,IAAI,QAAQ,EAAE,CAAC;YAC7B,IAAI,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,UAAU,CAAC,CAAA;YAC1E,KAAK,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,CAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,cAAc,CAAC,CAAA;QACjG,CAAC;QAED,IAAI,CAAC,WAAW,GAAG,iBAAiB,CAClC,IAAI,CAAC,MAAM,CAAC,OAAO,EACnB,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,QAAQ,EACb,IAAI,EACJ;YACE,KAAK;SACN,EACD,GAAG,EAAE;YACH,OAAO,IAAI,CAAC,WAAW,CAAA;QACzB,CAAC,CACF,CAAA;IACH,CAAC;;AAhQM,iBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4FF;CACF,AA9FY,CA8FZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAA4B;AAC3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAsB;AAKO;IAAvD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;+CAA6B;AACpD;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;8CAAwB;AA1G5C,UAAU;IADtB,aAAa,CAAC,gBAAgB,CAAC;GACnB,UAAU,CAkQtB","sourcesContent":["import '@material/web/icon/icon.js'\nimport './data-card-field'\nimport '../record-view'\nimport './data-card-gutter'\nimport './data-card-gutter-menu'\n\nimport { GristConfig, GristData, GristRecord } from '../types'\nimport { LitElement, PropertyValues, css, html } from 'lit'\nimport { ZERO_CONFIG, ZERO_DATA, ZERO_RECORD } from '../configure/zero-config'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { RecordViewHandler } from '../record-view/record-view-handler'\nimport { recordCardClickHandler } from './event-handlers/record-card-click-handler'\nimport { recordCardDblClickHandler } from './event-handlers/record-card-dblclick-handler'\n\n// TODO 로케일 설정에 따라서 포맷이 바뀌도록 해야한다.\nconst OPTIONS: Intl.DateTimeFormatOptions = {\n year: 'numeric',\n month: 'numeric',\n day: 'numeric',\n hour: 'numeric',\n minute: 'numeric',\n second: 'numeric',\n hour12: false\n // timeZone: 'America/Los_Angeles'\n}\n\nfunction getSafeFormatter(locale: string, options: Intl.DateTimeFormatOptions) {\n try {\n const safeLocale = locale || 'en-US'\n return new Intl.DateTimeFormat(safeLocale, options)\n } catch (e) {\n return new Intl.DateTimeFormat('en-US', options)\n }\n}\n\nconst formatter = getSafeFormatter(navigator.language, OPTIONS)\n\n@customElement('ox-record-card')\nexport class RecordCard extends LitElement {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n position: relative;\n background-color: var(--data-card-record-card-background-color);\n border-radius: var(--data-card-record-card-border-radius);\n border: var(--data-card-record-card-border);\n height: min-content;\n padding: var(--spacing-small) var(--spacing-none);\n }\n\n :host(:hover) {\n background-color: var(--md-sys-color-surface);\n border: var(--data-card-record-card-border-hover);\n box-shadow: var(--data-card-record-card-boxshadow-hover);\n }\n\n :host([dirty])::before {\n content: '';\n position: absolute;\n left: var(--spacing-none);\n top: var(--spacing-none);\n\n width: var(--spacing-none);\n height: var(--spacing-none);\n border-top: var(--grid-record-dirty-border-top);\n border-right: var(--grid-record-dirty-border-left);\n }\n\n :host[emphasized-row] {\n background-color: var(--grid-record-emphasized-background-color);\n color: var(--grid-record-emphasized-color);\n }\n\n [dirty] {\n position: absolute;\n margin: var(--spacing-none);\n height: 20px;\n\n font: var(--grid-record-dirty-icon-font);\n text-indent: 1px;\n left: var(--spacing-none);\n top: var(--spacing-none);\n color: var(--grid-record-dirty-color, var(--md-sys-color-error));\n }\n\n [thumbnail] {\n height: var(--data-card-thumbnail-height);\n border-top-left-radius: var(--data-card-record-card-border-radius);\n border-top-right-radius: var(--data-card-record-card-border-radius);\n overflow: hidden;\n }\n\n [content] {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-tiny);\n margin: var(--data-card-item-margin);\n }\n\n [brief] {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-tiny);\n overflow: hidden;\n }\n\n [gutters] {\n display: flex;\n flex-direction: row;\n gap: var(--spacing-small);\n margin: var(--spacing-small) var(--spacing-medium);\n justify-content: end;\n align-items: stretch;\n }\n\n ox-card-field {\n font: var(--data-card-item-etc-font);\n color: var(--data-card-item-etc-color, var(--md-sys-color-on-surface));\n }\n\n ox-card-field[name] {\n font: var(--data-card-item-name-font);\n color: var(--data-card-item-name-color, var(--md-sys-color-secondary));\n }\n\n ox-card-field[desc] {\n font: var(--data-card-item-disc-font);\n color: var(--data-card-item-disc-color, var(--md-sys-color-tertiary));\n }\n `\n ]\n\n @property({ type: Object }) config: GristConfig = ZERO_CONFIG\n @property({ type: Object }) data: GristData = ZERO_DATA\n @property({ type: Object }) record: GristRecord = ZERO_RECORD\n @property({ type: Number }) rowIndex: number = -1\n /*\n * row-selector를 사용자가 변경할 때, record-card의 update를 유도하기 위해 selected-row attribute를 property에 추가함.\n * (이를 해주지 않으면, 리스트 refresh 경우에 selected-row checkbox가 클리어되지 않는 현상이 발생함.)\n */\n @property({ type: Boolean, attribute: 'selected-row' }) selectedRow: boolean = false\n @property({ attribute: false }) emphasized: any = false\n\n private _recordView: any\n private clickHandler = recordCardClickHandler.bind(this) as EventListener\n private dblclickHandler = recordCardDblClickHandler.bind(this) as EventListener\n\n firstUpdated() {\n /*\n long-press\n TODO. performance를 확인한 후에 활성화하자.\n */\n // longpressable(this.renderRoot.querySelector('[content]'))\n // this.renderRoot.addEventListener('long-press', recordPartialLongPressHandler.bind(this))\n this.renderRoot.addEventListener('click', this.clickHandler)\n this.renderRoot.addEventListener('dblclick', this.dblclickHandler)\n\n this.addEventListener('show-record-view', () => this.popupRecordView())\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('record') && this._recordView) {\n this._recordView.record = this.record\n }\n\n const emphasized = this.emphasized\n\n if (!!emphasized) {\n this.setAttribute('emphasized-row', '')\n\n if (Symbol.iterator in Object(emphasized)) {\n const [backgroundColor, foregroundColor] = emphasized as string[]\n backgroundColor && this.style.setProperty('--grid-record-emphasized-background-color', backgroundColor)\n foregroundColor && this.style.setProperty('--grid-record-emphasized-color', foregroundColor)\n }\n } else {\n this.removeAttribute('emphasized-row')\n }\n }\n\n render() {\n const record = this.record\n const rowIndex = this.rowIndex\n const { columns, list } = this.config\n const { thumbnail, fields, details } = list || {}\n\n const briefFields = fields.map(field => columns.find(column => column.name == field)).filter(column => column) || []\n const detailFields =\n details.map(field => columns.find(column => column.name == field)).filter(column => column) || []\n\n const thumbnailColumn = thumbnail ? columns.find(column => column.name == thumbnail) : undefined\n\n const gutters = (columns || []).filter(column => column.type == 'gutter' && column.forList)\n\n if (this.hasAttribute('dirty')) {\n var dirtyIcon\n\n switch (this.record['__dirty__']) {\n case 'M':\n dirtyIcon = 'done'\n break\n case '+':\n dirtyIcon = 'add'\n break\n case '-':\n dirtyIcon = 'remove'\n break\n }\n }\n\n return html`\n ${dirtyIcon ? html` <md-icon dirty>${dirtyIcon}</md-icon> ` : html``}\n ${thumbnailColumn\n ? html` <ox-card-field\n thumbnail\n .rowIndex=${rowIndex}\n .column=${thumbnailColumn}\n .record=${record}\n .value=${record[thumbnailColumn?.name || '']}\n ></ox-card-field>`\n : html``}\n\n <div content>\n <div brief>\n ${briefFields.map(\n (column, idx) => html`\n <ox-card-field\n .rowIndex=${rowIndex}\n .column=${column}\n .record=${record}\n .value=${record[column?.name || '']}\n ?name=${idx == 0}\n ?desc=${idx == 1}\n ></ox-card-field>\n `\n )}\n </div>\n ${detailFields.length > 0\n ? html`\n <div detail>\n ${detailFields.map(\n (column, idx) => html`\n <ox-card-field\n .rowIndex=${rowIndex}\n .column=${column}\n .record=${record}\n .value=${record[column?.name || '']}\n ></ox-card-field>\n `\n )}\n </div>\n `\n : html``}\n </div>\n\n <div gutters>\n ${gutters.map(gutter => {\n return html`\n <ox-card-gutter\n .rowIndex=${rowIndex}\n .column=${gutter}\n .record=${record}\n .value=${record[gutter.name]}\n ></ox-card-gutter>\n `\n })}\n </div>\n `\n }\n\n popupRecordView() {\n var titleField = this.config.list.fields[0] || 'name'\n var title = this.record[titleField]\n\n /* field가 오브젝트형인 경우에는 렌더러를 타이틀로 사용한다. */\n if (typeof title == 'object') {\n var column = this.config.columns.find(column => column.name == titleField)\n title = column?.record.renderer(title, column, this.record, this.rowIndex, this /* cautious */)\n }\n\n this._recordView = RecordViewHandler(\n this.config.columns,\n this.record,\n this.rowIndex,\n this,\n {\n title\n },\n () => {\n delete this._recordView\n }\n )\n }\n}\n"]}
|
1
|
+
{"version":3,"file":"record-card.js","sourceRoot":"","sources":["../../../src/data-card/record-card.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '../record-view/record-view.js'\nimport './data-card-field.js'\nimport './data-card-gutter.js'\nimport './data-card-gutter-menu.js'\n\nimport { LitElement, PropertyValues, css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { GristConfig, GristData, GristRecord } from '../types.js'\nimport { ZERO_CONFIG, ZERO_DATA, ZERO_RECORD } from '../configure/zero-config.js'\nimport { RecordViewHandler } from '../record-view/record-view-handler.js'\nimport { recordCardClickHandler } from './event-handlers/record-card-click-handler.js'\nimport { recordCardDblClickHandler } from './event-handlers/record-card-dblclick-handler.js'\n\n// TODO 로케일 설정에 따라서 포맷이 바뀌도록 해야한다.\nconst OPTIONS: Intl.DateTimeFormatOptions = {\n year: 'numeric',\n month: 'numeric',\n day: 'numeric',\n hour: 'numeric',\n minute: 'numeric',\n second: 'numeric',\n hour12: false\n // timeZone: 'America/Los_Angeles'\n}\n\nfunction getSafeFormatter(locale: string, options: Intl.DateTimeFormatOptions) {\n try {\n const safeLocale = locale || 'en-US'\n return new Intl.DateTimeFormat(safeLocale, options)\n } catch (e) {\n return new Intl.DateTimeFormat('en-US', options)\n }\n}\n\nconst formatter = getSafeFormatter(navigator.language, OPTIONS)\n\n@customElement('ox-record-card')\nexport class RecordCard extends LitElement {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n position: relative;\n background-color: var(--data-card-record-card-background-color);\n border-radius: var(--data-card-record-card-border-radius);\n border: var(--data-card-record-card-border);\n height: min-content;\n padding: var(--spacing-small) var(--spacing-none);\n }\n\n :host(:hover) {\n background-color: var(--md-sys-color-surface);\n border: var(--data-card-record-card-border-hover);\n box-shadow: var(--data-card-record-card-boxshadow-hover);\n }\n\n :host([dirty])::before {\n content: '';\n position: absolute;\n left: var(--spacing-none);\n top: var(--spacing-none);\n\n width: var(--spacing-none);\n height: var(--spacing-none);\n border-top: var(--grid-record-dirty-border-top);\n border-right: var(--grid-record-dirty-border-left);\n }\n\n :host[emphasized-row] {\n background-color: var(--grid-record-emphasized-background-color);\n color: var(--grid-record-emphasized-color);\n }\n\n [dirty] {\n position: absolute;\n margin: var(--spacing-none);\n height: 20px;\n\n font: var(--grid-record-dirty-icon-font);\n text-indent: 1px;\n left: var(--spacing-none);\n top: var(--spacing-none);\n color: var(--grid-record-dirty-color, var(--md-sys-color-error));\n }\n\n [thumbnail] {\n height: var(--data-card-thumbnail-height);\n border-top-left-radius: var(--data-card-record-card-border-radius);\n border-top-right-radius: var(--data-card-record-card-border-radius);\n overflow: hidden;\n }\n\n [content] {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-tiny);\n margin: var(--data-card-item-margin);\n }\n\n [brief] {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-tiny);\n overflow: hidden;\n }\n\n [gutters] {\n display: flex;\n flex-direction: row;\n gap: var(--spacing-small);\n margin: var(--spacing-small) var(--spacing-medium);\n justify-content: end;\n align-items: stretch;\n }\n\n ox-card-field {\n font: var(--data-card-item-etc-font);\n color: var(--data-card-item-etc-color, var(--md-sys-color-on-surface));\n }\n\n ox-card-field[name] {\n font: var(--data-card-item-name-font);\n color: var(--data-card-item-name-color, var(--md-sys-color-secondary));\n }\n\n ox-card-field[desc] {\n font: var(--data-card-item-disc-font);\n color: var(--data-card-item-disc-color, var(--md-sys-color-tertiary));\n }\n `\n ]\n\n @property({ type: Object }) config: GristConfig = ZERO_CONFIG\n @property({ type: Object }) data: GristData = ZERO_DATA\n @property({ type: Object }) record: GristRecord = ZERO_RECORD\n @property({ type: Number }) rowIndex: number = -1\n /*\n * row-selector를 사용자가 변경할 때, record-card의 update를 유도하기 위해 selected-row attribute를 property에 추가함.\n * (이를 해주지 않으면, 리스트 refresh 경우에 selected-row checkbox가 클리어되지 않는 현상이 발생함.)\n */\n @property({ type: Boolean, attribute: 'selected-row' }) selectedRow: boolean = false\n @property({ attribute: false }) emphasized: any = false\n\n private _recordView: any\n private clickHandler = recordCardClickHandler.bind(this) as EventListener\n private dblclickHandler = recordCardDblClickHandler.bind(this) as EventListener\n\n firstUpdated() {\n /*\n long-press\n TODO. performance를 확인한 후에 활성화하자.\n */\n // longpressable(this.renderRoot.querySelector('[content]'))\n // this.renderRoot.addEventListener('long-press', recordPartialLongPressHandler.bind(this))\n this.renderRoot.addEventListener('click', this.clickHandler)\n this.renderRoot.addEventListener('dblclick', this.dblclickHandler)\n\n this.addEventListener('show-record-view', () => this.popupRecordView())\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('record') && this._recordView) {\n this._recordView.record = this.record\n }\n\n const emphasized = this.emphasized\n\n if (!!emphasized) {\n this.setAttribute('emphasized-row', '')\n\n if (Symbol.iterator in Object(emphasized)) {\n const [backgroundColor, foregroundColor] = emphasized as string[]\n backgroundColor && this.style.setProperty('--grid-record-emphasized-background-color', backgroundColor)\n foregroundColor && this.style.setProperty('--grid-record-emphasized-color', foregroundColor)\n }\n } else {\n this.removeAttribute('emphasized-row')\n }\n }\n\n render() {\n const record = this.record\n const rowIndex = this.rowIndex\n const { columns, list } = this.config\n const { thumbnail, fields, details } = list || {}\n\n const briefFields = fields.map(field => columns.find(column => column.name == field)).filter(column => column) || []\n const detailFields =\n details.map(field => columns.find(column => column.name == field)).filter(column => column) || []\n\n const thumbnailColumn = thumbnail ? columns.find(column => column.name == thumbnail) : undefined\n\n const gutters = (columns || []).filter(column => column.type == 'gutter' && column.forList)\n\n if (this.hasAttribute('dirty')) {\n var dirtyIcon\n\n switch (this.record['__dirty__']) {\n case 'M':\n dirtyIcon = 'done'\n break\n case '+':\n dirtyIcon = 'add'\n break\n case '-':\n dirtyIcon = 'remove'\n break\n }\n }\n\n return html`\n ${dirtyIcon ? html` <md-icon dirty>${dirtyIcon}</md-icon> ` : html``}\n ${thumbnailColumn\n ? html` <ox-card-field\n thumbnail\n .rowIndex=${rowIndex}\n .column=${thumbnailColumn}\n .record=${record}\n .value=${record[thumbnailColumn?.name || '']}\n ></ox-card-field>`\n : html``}\n\n <div content>\n <div brief>\n ${briefFields.map(\n (column, idx) => html`\n <ox-card-field\n .rowIndex=${rowIndex}\n .column=${column}\n .record=${record}\n .value=${record[column?.name || '']}\n ?name=${idx == 0}\n ?desc=${idx == 1}\n ></ox-card-field>\n `\n )}\n </div>\n ${detailFields.length > 0\n ? html`\n <div detail>\n ${detailFields.map(\n (column, idx) => html`\n <ox-card-field\n .rowIndex=${rowIndex}\n .column=${column}\n .record=${record}\n .value=${record[column?.name || '']}\n ></ox-card-field>\n `\n )}\n </div>\n `\n : html``}\n </div>\n\n <div gutters>\n ${gutters.map(gutter => {\n return html`\n <ox-card-gutter\n .rowIndex=${rowIndex}\n .column=${gutter}\n .record=${record}\n .value=${record[gutter.name]}\n ></ox-card-gutter>\n `\n })}\n </div>\n `\n }\n\n popupRecordView() {\n var titleField = this.config.list.fields[0] || 'name'\n var title = this.record[titleField]\n\n /* field가 오브젝트형인 경우에는 렌더러를 타이틀로 사용한다. */\n if (typeof title == 'object') {\n var column = this.config.columns.find(column => column.name == titleField)\n title = column?.record.renderer(title, column, this.record, this.rowIndex, this /* cautious */)\n }\n\n this._recordView = RecordViewHandler(\n this.config.columns,\n this.record,\n this.rowIndex,\n this,\n {\n title\n },\n () => {\n delete this._recordView\n }\n )\n }\n}\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"data-consumer.js","sourceRoot":"","sources":["../../src/data-consumer.ts"],"names":[],"mappings":"","sourcesContent":["import { FetchHandler, GristData } from './types'\n\nexport interface DataConsumer extends EventTarget {\n data: any\n _data: GristData\n mode: 'GRID' | 'LIST' | 'CARD' | 'REPORT'\n checkDirties(): void\n fetchHandler?: FetchHandler\n showSpinner(): void\n hideSpinner(): void\n}\n"]}
|
1
|
+
{"version":3,"file":"data-consumer.js","sourceRoot":"","sources":["../../src/data-consumer.ts"],"names":[],"mappings":"","sourcesContent":["import { FetchHandler, GristData } from './types.js'\n\nexport interface DataConsumer extends EventTarget {\n data: any\n _data: GristData\n mode: 'GRID' | 'LIST' | 'CARD' | 'REPORT'\n checkDirties(): void\n fetchHandler?: FetchHandler\n showSpinner(): void\n hideSpinner(): void\n}\n"]}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import { LitElement, PropertyValues, TemplateResult } from 'lit';
|
2
|
-
import { ColumnConfig, GristRecord } from '../types';
|
2
|
+
import { ColumnConfig, GristRecord } from '../types.js';
|
3
3
|
export declare class DataGridAccumField extends LitElement {
|
4
4
|
static styles: import("lit").CSSResult[];
|
5
5
|
align: string;
|
@@ -1,20 +1,66 @@
|
|
1
1
|
import { __decorate } from "tslib";
|
2
2
|
import { css, html, LitElement, nothing } from 'lit';
|
3
3
|
import { customElement, property } from 'lit/decorators.js';
|
4
|
-
import { ZERO_COLUMN } from '../configure/zero-config';
|
4
|
+
import { ZERO_COLUMN } from '../configure/zero-config.js';
|
5
5
|
import { i18next } from '@operato/i18n';
|
6
6
|
const DEFAULT_TEXT_ALIGN = 'left';
|
7
7
|
let DataGridAccumField = class DataGridAccumField extends LitElement {
|
8
8
|
constructor() {
|
9
9
|
super(...arguments);
|
10
|
-
this
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
this
|
17
|
-
|
10
|
+
Object.defineProperty(this, "align", {
|
11
|
+
enumerable: true,
|
12
|
+
configurable: true,
|
13
|
+
writable: true,
|
14
|
+
value: DEFAULT_TEXT_ALIGN
|
15
|
+
});
|
16
|
+
Object.defineProperty(this, "record", {
|
17
|
+
enumerable: true,
|
18
|
+
configurable: true,
|
19
|
+
writable: true,
|
20
|
+
value: {}
|
21
|
+
});
|
22
|
+
Object.defineProperty(this, "column", {
|
23
|
+
enumerable: true,
|
24
|
+
configurable: true,
|
25
|
+
writable: true,
|
26
|
+
value: ZERO_COLUMN
|
27
|
+
});
|
28
|
+
Object.defineProperty(this, "rowIndex", {
|
29
|
+
enumerable: true,
|
30
|
+
configurable: true,
|
31
|
+
writable: true,
|
32
|
+
value: -1
|
33
|
+
});
|
34
|
+
Object.defineProperty(this, "columnIndex", {
|
35
|
+
enumerable: true,
|
36
|
+
configurable: true,
|
37
|
+
writable: true,
|
38
|
+
value: 0
|
39
|
+
});
|
40
|
+
Object.defineProperty(this, "editing", {
|
41
|
+
enumerable: true,
|
42
|
+
configurable: true,
|
43
|
+
writable: true,
|
44
|
+
value: false
|
45
|
+
});
|
46
|
+
Object.defineProperty(this, "value", {
|
47
|
+
enumerable: true,
|
48
|
+
configurable: true,
|
49
|
+
writable: true,
|
50
|
+
value: {}
|
51
|
+
});
|
52
|
+
Object.defineProperty(this, "emphasized", {
|
53
|
+
enumerable: true,
|
54
|
+
configurable: true,
|
55
|
+
writable: true,
|
56
|
+
value: false
|
57
|
+
});
|
58
|
+
Object.defineProperty(this, "fixed", {
|
59
|
+
enumerable: true,
|
60
|
+
configurable: true,
|
61
|
+
writable: true,
|
62
|
+
value: void 0
|
63
|
+
});
|
18
64
|
}
|
19
65
|
render() {
|
20
66
|
if (!this.column || !this.column.accumulator) {
|
@@ -54,8 +100,12 @@ let DataGridAccumField = class DataGridAccumField extends LitElement {
|
|
54
100
|
}
|
55
101
|
}
|
56
102
|
};
|
57
|
-
DataGridAccumField
|
58
|
-
|
103
|
+
Object.defineProperty(DataGridAccumField, "styles", {
|
104
|
+
enumerable: true,
|
105
|
+
configurable: true,
|
106
|
+
writable: true,
|
107
|
+
value: [
|
108
|
+
css `
|
59
109
|
:host {
|
60
110
|
display: flex;
|
61
111
|
|
@@ -98,7 +148,8 @@ DataGridAccumField.styles = [
|
|
98
148
|
font-size: 1.5em;
|
99
149
|
}
|
100
150
|
`
|
101
|
-
]
|
151
|
+
]
|
152
|
+
});
|
102
153
|
__decorate([
|
103
154
|
property({ type: String, attribute: true })
|
104
155
|
], DataGridAccumField.prototype, "align", void 0);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"data-grid-accum-field.js","sourceRoot":"","sources":["../../../src/data-grid/data-grid-accum-field.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkC,OAAO,EAAE,MAAM,KAAK,CAAA;AACpF,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,WAAW,EAAE,MAAM,
|
1
|
+
{"version":3,"file":"data-grid-accum-field.js","sourceRoot":"","sources":["../../../src/data-grid/data-grid-accum-field.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, PropertyValues, TemplateResult, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ZERO_COLUMN } from '../configure/zero-config.js'\nimport { AccumulatorObject, ColumnConfig, GristRecord } from '../types.js'\nimport { i18next } from '@operato/i18n'\n\nconst DEFAULT_TEXT_ALIGN = 'left'\n\n@customElement('ox-grid-accum-field')\nexport class DataGridAccumField extends LitElement {\n static styles = [\n css`\n :host {\n display: flex;\n\n align-items: center;\n justify-content: var(--data-grid-field-justify-content, flex-start);\n position: relative;\n\n white-space: nowrap;\n background-color: var(--md-sys-color-primary-container);\n border: var(--grid-record-border-bottom);\n border-width: 1px 0;\n padding: var(--spacing-small);\n\n font-size: var(--grid-record-wide-fontsize);\n color: var(--md-sys-color-primary);\n font-weight: var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500));\n\n min-height: 30px;\n box-sizing: border-box;\n }\n\n span,\n pre {\n display: block;\n text-overflow: ellipsis;\n overflow: hidden;\n }\n\n * {\n margin: 0;\n text-align: var(--data-grid-field-text-align);\n }\n\n *[center] {\n flex: none;\n margin: 0 auto;\n }\n\n md-icon {\n font-size: 1.5em;\n }\n `\n ]\n\n @property({ type: String, attribute: true }) align = DEFAULT_TEXT_ALIGN\n @property({ type: Object }) record: GristRecord = {}\n @property({ type: Object }) column: ColumnConfig = ZERO_COLUMN\n @property({ type: Number }) rowIndex = -1\n @property({ type: Number }) columnIndex = 0\n @property({ type: Boolean }) editing = false\n @property({ type: Object }) value = {}\n @property({ attribute: false }) emphasized: any = false\n @property({ type: String, attribute: true }) fixed?: string\n\n render(): TemplateResult {\n if (!this.column || !this.column.accumulator) {\n return this.columnIndex == 0 ? html`<md-icon>functions</md-icon>` : html`${nothing}`\n }\n\n var { value, column, record, rowIndex } = this\n var { renderer } = column.record\n\n // tag가 true이면 value 앞에 (sum) 같은 태그 생성\n var { accumulator } = column\n let tag = ''\n if (typeof accumulator === 'object' && typeof accumulator.type === 'string' && accumulator?.tag) {\n tag = `(${i18next.t(`label.accumulator_${accumulator.type}`)})`\n }\n\n return html`${tag} ${renderer?.call(this, value, column, record, rowIndex, this)}`\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('column')) {\n var align = this.column.record.align || DEFAULT_TEXT_ALIGN\n if (align != DEFAULT_TEXT_ALIGN) {\n let justify = 'center'\n switch (align) {\n case 'right':\n justify = 'flex-end'\n break\n }\n this.style.setProperty('--data-grid-field-justify-content', justify)\n this.style.setProperty('--data-grid-field-text-align', align)\n }\n }\n\n if (changes.has('fixed')) {\n if (this.fixed) {\n this.style.left = this.fixed + 'px'\n } else {\n this.style.left = 'unset'\n }\n }\n }\n}\n"]}
|
@@ -1,8 +1,8 @@
|
|
1
|
-
import './data-grid-field';
|
2
|
-
import './data-grid-accum-field';
|
1
|
+
import './data-grid-field.js';
|
2
|
+
import './data-grid-accum-field.js';
|
3
3
|
import { LitElement, PropertyValues } from 'lit';
|
4
|
-
import { ColumnConfig, GristConfig, GristData, GristRecord } from '../types';
|
5
|
-
import { DataGridField } from './data-grid-field';
|
4
|
+
import { ColumnConfig, GristConfig, GristData, GristRecord } from '../types.js';
|
5
|
+
import { DataGridField } from './data-grid-field.js';
|
6
6
|
export declare class DataGridBody extends LitElement {
|
7
7
|
debounce: import("lodash").DebouncedFunc<(scrollTop: number, clientHeight: number) => void>;
|
8
8
|
static styles: import("lit").CSSResult[];
|