@operato/data-grist 10.8.1 → 10.9.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/CHANGELOG.md +29 -0
- package/dist/src/data-card/data-card.d.ts +6 -0
- package/dist/src/data-card/data-card.js +12 -3
- package/dist/src/data-card/data-card.js.map +1 -1
- package/dist/src/data-grid/data-grid-body.d.ts +7 -0
- package/dist/src/data-grid/data-grid-body.js +15 -0
- package/dist/src/data-grid/data-grid-body.js.map +1 -1
- package/dist/src/data-grid/data-grid-field.d.ts +21 -0
- package/dist/src/data-grid/data-grid-field.js +311 -4
- package/dist/src/data-grid/data-grid-field.js.map +1 -1
- package/dist/src/data-grid/data-grid-header.js +16 -28
- package/dist/src/data-grid/data-grid-header.js.map +1 -1
- package/dist/src/data-grid/data-grid.d.ts +6 -0
- package/dist/src/data-grid/data-grid.js +9 -18
- package/dist/src/data-grid/data-grid.js.map +1 -1
- package/dist/src/data-grist.d.ts +25 -0
- package/dist/src/data-grist.js +74 -2
- package/dist/src/data-grist.js.map +1 -1
- package/dist/src/data-list/data-list.d.ts +6 -0
- package/dist/src/data-list/data-list.js +12 -3
- package/dist/src/data-list/data-list.js.map +1 -1
- package/dist/src/editors/ox-grist-editor-json5.d.ts +1 -0
- package/dist/src/editors/ox-grist-editor-json5.js +2 -0
- package/dist/src/editors/ox-grist-editor-json5.js.map +1 -1
- package/dist/src/editors/ox-grist-editor.d.ts +14 -0
- package/dist/src/editors/ox-grist-editor.js +36 -0
- package/dist/src/editors/ox-grist-editor.js.map +1 -1
- package/dist/src/editors/registry.d.ts +10 -0
- package/dist/src/editors/registry.js +16 -0
- package/dist/src/editors/registry.js.map +1 -1
- package/dist/test/row-hover-visible.test.js +26 -14
- package/dist/test/row-hover-visible.test.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +6 -6
- package/test/row-hover-visible.test.ts +30 -14
- package/translations/en.json +12 -10
- package/translations/ja.json +11 -9
- package/translations/ko.json +12 -10
- package/translations/ms.json +11 -9
- package/translations/zh.json +11 -9
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,35 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [10.9.0](https://github.com/hatiolab/operato/compare/v10.8.1...v10.9.0) (2026-09-05)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### :sparkles: Styling
|
|
10
|
+
|
|
11
|
+
* **data-grist:** 빈 표의 말을 사람 말로 바꾼다 ([180b6b2](https://github.com/hatiolab/operato/commit/180b6b20aa8fdc5e5ea504f408bba2432c8cc23d))
|
|
12
|
+
* **data-grist:** 팝업 표식을 마우스 올렸을 때만 보인다 ([cf166b3](https://github.com/hatiolab/operato/commit/cf166b3e0115d29798960f6142e7c749f12cb692))
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
### :rocket: New Features
|
|
16
|
+
|
|
17
|
+
* **data-grist, popup:** 표식은 값의 빈자리에, 팝업은 닫히면 제자리로 ([cdcd84c](https://github.com/hatiolab/operato/commit/cdcd84c53cdb12ba0664cc9d2bb4c8238e4ea9f4))
|
|
18
|
+
* **data-grist:** 고칠 수 있는 칸에 표식을 두고, 모양이 어디서 고치는지 말한다 ([561fd61](https://github.com/hatiolab/operato/commit/561fd610a842242cb4ceef940ea47b3c41a125c6))
|
|
19
|
+
* **data-grist:** 팝업으로 고치는 칸에 표식을 둔다 ([69fae8f](https://github.com/hatiolab/operato/commit/69fae8f92024bd59ac21e90b9b2837be95f222cf))
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
### :bug: Bug Fix
|
|
23
|
+
|
|
24
|
+
* **context, data-grist:** 야간 모드에서 안 보이던 두 자리 ([a87a76f](https://github.com/hatiolab/operato/commit/a87a76f7499938de603397d7f7cceb58927ccffa))
|
|
25
|
+
* **data-grist:** classifier 가 없는 열에서 던지던 것을 막는다 ([37f689d](https://github.com/hatiolab/operato/commit/37f689dc54955cb796b5b64aeff83942c753b715))
|
|
26
|
+
* **data-grist:** 빈 목록 안내를 세 모드가 함께 쓰게 한다 ([8cd4975](https://github.com/hatiolab/operato/commit/8cd49751f14a2db1d02be56e1e311e8fa004691b))
|
|
27
|
+
* **data-grist:** 빈 목록 안내를 조회 후에만 낸다 ([70101fe](https://github.com/hatiolab/operato/commit/70101fe828dec91258ee62a153ac6915404d0ee2))
|
|
28
|
+
* **data-grist:** 빈 표가 「아직 없다」와 「걸린 것이 없다」를 갈라 말한다 ([2ccd3f5](https://github.com/hatiolab/operato/commit/2ccd3f5a97a20a7776a8569153a545c656f19c8b))
|
|
29
|
+
* **data-grist:** 숫자 칸의 편집기가 왼쪽으로 튀었다 — 정렬이 입력 요소에 안 닿았다 ([68a49f3](https://github.com/hatiolab/operato/commit/68a49f327ebafe38c557ac0cee594eeab5ee5a59))
|
|
30
|
+
* **data-grist:** 편집 중에도 팝업 표식을 남긴다 ([9c6fefa](https://github.com/hatiolab/operato/commit/9c6fefa03f49df912720d4420469b7b4711bda05)), closes [#262e38](https://github.com/hatiolab/operato/issues/262e38)
|
|
31
|
+
* **data-grist:** 표식을 고칠 수 있는 칸에만, 그리고 방해되지 않게 둔다 ([05ae962](https://github.com/hatiolab/operato/commit/05ae962e3035a202e75ab395090c8230166cb179))
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
|
|
6
35
|
### [10.8.1](https://github.com/hatiolab/operato/compare/v10.8.0...v10.8.1) (2026-09-04)
|
|
7
36
|
|
|
8
37
|
**Note:** Version bump only for package @operato/data-grist
|
|
@@ -6,6 +6,12 @@ import { DataManipulator } from '../data-manipulator.js';
|
|
|
6
6
|
export declare class DataCard extends DataManipulator {
|
|
7
7
|
static styles: import("lit").CSSResult[];
|
|
8
8
|
empty?: boolean;
|
|
9
|
+
/** 비었을 때 무슨 말을 하나 — 판단은 data-grist 가 하고 여기서는 그리기만 한다. */
|
|
10
|
+
emptyNote?: {
|
|
11
|
+
icon?: string;
|
|
12
|
+
title: string;
|
|
13
|
+
description?: string;
|
|
14
|
+
};
|
|
9
15
|
private _records;
|
|
10
16
|
private isTop;
|
|
11
17
|
private _total;
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
|
-
import i18next from 'i18next';
|
|
3
2
|
import '@material/web/icon/icon.js';
|
|
4
3
|
import '../empty-note.js';
|
|
5
4
|
import './record-card.js';
|
|
6
|
-
import { css, html } from 'lit';
|
|
5
|
+
import { css, html, nothing } from 'lit';
|
|
7
6
|
import { customElement, property, state } from 'lit/decorators.js';
|
|
8
7
|
import { DataManipulator } from '../data-manipulator.js';
|
|
9
8
|
let DataCard = class DataCard extends DataManipulator {
|
|
@@ -45,6 +44,7 @@ let DataCard = class DataCard extends DataManipulator {
|
|
|
45
44
|
}
|
|
46
45
|
}
|
|
47
46
|
render() {
|
|
47
|
+
var _a, _b, _c, _d, _e, _f;
|
|
48
48
|
var { classifier } = this.config.rows;
|
|
49
49
|
var records = this._records || [];
|
|
50
50
|
if (this.config && this.config.rows.appendable) {
|
|
@@ -66,7 +66,13 @@ let DataCard = class DataCard extends DataManipulator {
|
|
|
66
66
|
></ox-record-card>
|
|
67
67
|
`;
|
|
68
68
|
})}
|
|
69
|
-
${this.empty
|
|
69
|
+
${this.empty
|
|
70
|
+
? html `<ox-empty-note
|
|
71
|
+
icon=${(_b = (_a = this.emptyNote) === null || _a === void 0 ? void 0 : _a.icon) !== null && _b !== void 0 ? _b : nothing}
|
|
72
|
+
title=${(_d = (_c = this.emptyNote) === null || _c === void 0 ? void 0 : _c.title) !== null && _d !== void 0 ? _d : ''}
|
|
73
|
+
description=${(_f = (_e = this.emptyNote) === null || _e === void 0 ? void 0 : _e.description) !== null && _f !== void 0 ? _f : nothing}
|
|
74
|
+
></ox-empty-note>`
|
|
75
|
+
: html ``}
|
|
70
76
|
${this.isTop
|
|
71
77
|
? html ``
|
|
72
78
|
: html ` <md-icon id="upward" @click=${(e) => this.gotoTop(e)}>arrow_upward</md-icon> `}
|
|
@@ -137,6 +143,9 @@ DataCard.styles = [
|
|
|
137
143
|
__decorate([
|
|
138
144
|
property({ type: Boolean })
|
|
139
145
|
], DataCard.prototype, "empty", void 0);
|
|
146
|
+
__decorate([
|
|
147
|
+
property({ type: Object })
|
|
148
|
+
], DataCard.prototype, "emptyNote", void 0);
|
|
140
149
|
__decorate([
|
|
141
150
|
state()
|
|
142
151
|
], DataCard.prototype, "_records", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-card.js","sourceRoot":"","sources":["../../../src/data-card/data-card.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"data-card.js","sourceRoot":"","sources":["../../../src/data-card/data-card.ts"],"names":[],"mappings":";AACA,OAAO,4BAA4B,CAAA;AACnC,OAAO,kBAAkB,CAAA;AACzB,OAAO,kBAAkB,CAAA;AAEzB,OAAO,EAAkB,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAIjD,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,eAAe;IAAtC;;QA6DY,aAAQ,GAAkB,EAAE,CAAA;QAC5B,UAAK,GAAY,KAAK,CAAA;QAE/B,WAAM,GAAW,CAAC,CAAA;QAClB,WAAM,GAAW,EAAE,CAAA;QACnB,UAAK,GAAW,CAAC,CAAA;IAqF3B,CAAC;IAnFC,YAAY,CAAC,OAA6B;QACxC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;QAEjB,wBAAwB;QACxB,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE;YAClC,MAAM,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAA;YAC3C,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,CAAA;YACtC,MAAM,gBAAgB,GAAG,IAAI,CAAC,SAAS,CAAA;YAEvC,IAAI,iBAAiB,IAAI,YAAY,GAAG,gBAAgB,GAAG,CAAC,EAAE,CAAC;gBAC7D,8BAA8B;gBAC9B,IAAI,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,CAAA;gBAEnD,IAAI,IAAI,CAAC,KAAK,GAAG,QAAQ,EAAE,CAAC;oBAC1B,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,aAAa,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;gBACvF,CAAC;YACH,CAAC;YAED,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,IAAI,CAAC,CAAA;QAClC,CAAC,CAAC,CAAA;IACJ,CAAC;IAED,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC1B,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAA;YAClB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAA;QAChB,CAAC;QAED,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;YACxB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAA;YACjC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,CAAA;YAClC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;YACnC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAA;QAClC,CAAC;IACH,CAAC;IAED,MAAM;;QACJ,IAAI,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAA;QACrC,IAAI,OAAO,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAA;QAEjC,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;YAC/C,OAAO,GAAG,CAAC,GAAG,OAAO,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,CAAA;QAC5C,CAAC;QAED,OAAO,IAAI,CAAA;QACP,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE;YACjC,IAAI,EAAE,UAAU,EAAE,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,IAAI,EAAE,CAAA;YAElE,OAAO,IAAI,CAAA;;sBAEG,IAAI,CAAC,MAAM;oBACb,IAAI,CAAC,IAAI;sBACP,MAAM;wBACJ,QAAQ;0BACN,UAAU;4BACR,MAAM,CAAC,cAAc,CAAC;qBAC7B,MAAM,CAAC,WAAW,CAAC;;;SAG/B,CAAA;QACH,CAAC,CAAC;QACA,IAAI,CAAC,KAAK;YACV,CAAC,CAAC,IAAI,CAAA;mBACK,MAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,IAAI,mCAAI,OAAO;oBAC9B,MAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,KAAK,mCAAI,EAAE;0BACrB,MAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,WAAW,mCAAI,OAAO;4BACpC;YACpB,CAAC,CAAC,IAAI,CAAA,EAAE;QACR,IAAI,CAAC,KAAK;YACV,CAAC,CAAC,IAAI,CAAA,EAAE;YACR,CAAC,CAAC,IAAI,CAAA,gCAAgC,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,0BAA0B;KAChG,CAAA;IACH,CAAC;IAED,OAAO,CAAC,CAAQ;QACd,IAAI,CAAC,SAAS,GAAG,CAAC,CAAA;QAElB,CAAC,CAAC,eAAe,EAAE,CAAA;IACrB,CAAC;IAED,IAAI,mBAAmB;QACrB,OAAO,IAAI,CAAA;IACb,CAAC;;AArJM,eAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAmDF;CACF,AArDY,CAqDZ;AAE4B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uCAAgB;AAGhB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAmE;AAE7E;IAAhB,KAAK,EAAE;0CAAqC;AAC5B;IAAhB,KAAK,EAAE;uCAA+B;AA9D5B,QAAQ;IADpB,aAAa,CAAC,SAAS,CAAC;GACZ,QAAQ,CAuJpB","sourcesContent":["import i18next from 'i18next'\nimport '@material/web/icon/icon.js'\nimport '../empty-note.js'\nimport './record-card.js'\n\nimport { PropertyValues, css, html, nothing } 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 /** 비었을 때 무슨 말을 하나 — 판단은 data-grist 가 하고 여기서는 그리기만 한다. */\n @property({ type: Object }) emptyNote?: { icon?: string; title: string; description?: string }\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\n ? html`<ox-empty-note\n icon=${this.emptyNote?.icon ?? nothing}\n title=${this.emptyNote?.title ?? ''}\n description=${this.emptyNote?.description ?? nothing}\n ></ox-empty-note>`\n : 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"]}
|
|
@@ -49,6 +49,13 @@ export declare class DataGridBody extends LitElement {
|
|
|
49
49
|
private setHoveredRow;
|
|
50
50
|
private markRow;
|
|
51
51
|
getFieldByIndex(rowIndex: number, columnIndex: number, residue?: boolean): DataGridField | undefined;
|
|
52
|
+
/**
|
|
53
|
+
* 칸의 **팝업 표식**을 눌렀다 — 그 칸의 편집을 연다.
|
|
54
|
+
*
|
|
55
|
+
* 더블클릭과 같은 자리로 들어간다. 표식은 한 번 누르는 22px 표적이고, 33px 줄에서 더블클릭을
|
|
56
|
+
* 겨누는 것보다 쉽다. 더블클릭도 그대로 둔다 — 이미 아는 사람의 길을 막지 않는다.
|
|
57
|
+
*/
|
|
58
|
+
private onStartEdit;
|
|
52
59
|
startEditTarget(row: number, column: number, valueWith?: string | null): void;
|
|
53
60
|
shouldUpdate(changes: any): boolean;
|
|
54
61
|
updated(changes: PropertyValues<this>): void;
|
|
@@ -206,6 +206,8 @@ let DataGridBody = class DataGridBody extends LitElement {
|
|
|
206
206
|
firstUpdated() {
|
|
207
207
|
// TODO issue #13
|
|
208
208
|
// this.addEventListener('scroll', this.handleOnScroll.bind(this))
|
|
209
|
+
/* 칸의 팝업 표식을 누르면 그 칸의 편집을 연다(onStartEdit). */
|
|
210
|
+
this.addEventListener('start-edit', this.onStartEdit.bind(this));
|
|
209
211
|
/* focus() 를 받을 수 있도록 함. */
|
|
210
212
|
this.setAttribute('tabindex', '-1');
|
|
211
213
|
/* 한글 IME composition을 위한 숨겨진 input 버퍼 설정 */
|
|
@@ -437,6 +439,19 @@ let DataGridBody = class DataGridBody extends LitElement {
|
|
|
437
439
|
}
|
|
438
440
|
return this.renderRoot.children.item(rowIndex * (columns + 1) /* 1 means last dummy column */ + ((columnIndex + columns) % columns));
|
|
439
441
|
}
|
|
442
|
+
/**
|
|
443
|
+
* 칸의 **팝업 표식**을 눌렀다 — 그 칸의 편집을 연다.
|
|
444
|
+
*
|
|
445
|
+
* 더블클릭과 같은 자리로 들어간다. 표식은 한 번 누르는 22px 표적이고, 33px 줄에서 더블클릭을
|
|
446
|
+
* 겨누는 것보다 쉽다. 더블클릭도 그대로 둔다 — 이미 아는 사람의 길을 막지 않는다.
|
|
447
|
+
*/
|
|
448
|
+
onStartEdit(e) {
|
|
449
|
+
const { row, column } = e.detail || {};
|
|
450
|
+
if (isNaN(row) || isNaN(column)) {
|
|
451
|
+
return;
|
|
452
|
+
}
|
|
453
|
+
this.startEditTarget(row, column);
|
|
454
|
+
}
|
|
440
455
|
startEditTarget(row, column, valueWith = null) {
|
|
441
456
|
var { editable } = this.columns.filter(column => !column.hidden)[column].record;
|
|
442
457
|
if (typeof editable === 'function') {
|