@operato/shell 1.12.7 → 1.13.9
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 +17 -0
- package/dist/src/actions/route.d.ts +24 -1
- package/dist/src/actions/route.js +30 -1
- package/dist/src/actions/route.js.map +1 -1
- package/dist/src/app/pages/page-view.d.ts +58 -0
- package/dist/src/app/pages/page-view.js +52 -1
- package/dist/src/app/pages/page-view.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +4 -4
- package/src/actions/route.ts +30 -1
- package/src/app/pages/page-view.ts +63 -1
- package/yarn-error.log +0 -17015
package/CHANGELOG.md
CHANGED
@@ -3,6 +3,23 @@
|
|
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
|
+
### [1.13.9](https://github.com/hatiolab/operato/compare/v1.13.8...v1.13.9) (2024-01-17)
|
7
|
+
|
8
|
+
|
9
|
+
### :bug: Bug Fix
|
10
|
+
|
11
|
+
* comment for libraries ([f18b096](https://github.com/hatiolab/operato/commit/f18b096a85257d915739af4df9595ee8779297a6))
|
12
|
+
|
13
|
+
|
14
|
+
|
15
|
+
### [1.12.9](https://github.com/hatiolab/operato/compare/v1.12.8...v1.12.9) (2024-01-04)
|
16
|
+
|
17
|
+
**Note:** Version bump only for package @operato/shell
|
18
|
+
|
19
|
+
|
20
|
+
|
21
|
+
|
22
|
+
|
6
23
|
### [1.12.7](https://github.com/hatiolab/operato/compare/v1.12.6...v1.12.7) (2024-01-03)
|
7
24
|
|
8
25
|
**Note:** Version bump only for package @operato/shell
|
@@ -1,12 +1,23 @@
|
|
1
1
|
/**
|
2
|
+
* Navigate to a page using one of two methods:
|
3
|
+
* 1. Using a page link: <a href='page'>goto page</a> (equivalent to route(page))
|
4
|
+
* 2. Using the navigate('page') function.
|
5
|
+
*
|
2
6
|
* 페이지를 이동하는 방법으로는 다음 두가지가 있다.
|
3
7
|
* 1. page link를 사용하는 방법 <a href='page'>goto page</a>
|
4
8
|
* 이 방법은 route(page)와 동일하다.
|
5
9
|
* 2. navigate('page')를 사용하는 방법
|
6
10
|
*
|
7
|
-
* @param
|
11
|
+
* @param location - The path of the page to navigate to.
|
12
|
+
* @param replace - Optional. If true, replaces the current page in the browser's history.
|
8
13
|
*/
|
9
14
|
export declare const navigate: (location: string, replace?: boolean) => void;
|
15
|
+
/**
|
16
|
+
* Navigate to a page with optional query parameters, and dispatch a Redux action to load the page.
|
17
|
+
*
|
18
|
+
* @param pathInfo - Object containing pathname, search, and optional params.
|
19
|
+
* @param dispatch - Redux dispatch function.
|
20
|
+
*/
|
10
21
|
export declare const navigateWithSilence: ({ pathname: path, search, params }: {
|
11
22
|
pathname: string;
|
12
23
|
search?: string | undefined;
|
@@ -14,7 +25,19 @@ export declare const navigateWithSilence: ({ pathname: path, search, params }: {
|
|
14
25
|
[key: string]: any;
|
15
26
|
} | undefined;
|
16
27
|
}) => (dispatch: any) => void;
|
28
|
+
/**
|
29
|
+
* Load a page by dispatching a Redux action, and handle page navigation if necessary.
|
30
|
+
*
|
31
|
+
* @param page - The page to load.
|
32
|
+
* @param id - The associated resource ID.
|
33
|
+
* @param params - Additional parameters to pass to the page.
|
34
|
+
*/
|
17
35
|
export declare const loadPage: (page: string, id: string, params: {
|
18
36
|
[key: string]: any;
|
19
37
|
}) => (dispatch: any) => void;
|
38
|
+
/**
|
39
|
+
* Route to a given URL by creating a link element and triggering a click event.
|
40
|
+
*
|
41
|
+
* @param url - The URL to route to.
|
42
|
+
*/
|
20
43
|
export declare const route: (url: string) => void;
|
@@ -2,12 +2,17 @@ import { getPathInfo } from '@operato/utils';
|
|
2
2
|
import { HOMEPAGE, UPDATE_PAGE } from '../actions/const';
|
3
3
|
import { store } from '../store';
|
4
4
|
/**
|
5
|
+
* Navigate to a page using one of two methods:
|
6
|
+
* 1. Using a page link: <a href='page'>goto page</a> (equivalent to route(page))
|
7
|
+
* 2. Using the navigate('page') function.
|
8
|
+
*
|
5
9
|
* 페이지를 이동하는 방법으로는 다음 두가지가 있다.
|
6
10
|
* 1. page link를 사용하는 방법 <a href='page'>goto page</a>
|
7
11
|
* 이 방법은 route(page)와 동일하다.
|
8
12
|
* 2. navigate('page')를 사용하는 방법
|
9
13
|
*
|
10
|
-
* @param
|
14
|
+
* @param location - The path of the page to navigate to.
|
15
|
+
* @param replace - Optional. If true, replaces the current page in the browser's history.
|
11
16
|
*/
|
12
17
|
export const navigate = (location, replace) => {
|
13
18
|
if (replace)
|
@@ -16,6 +21,12 @@ export const navigate = (location, replace) => {
|
|
16
21
|
history.pushState({}, '', location);
|
17
22
|
window.dispatchEvent(new Event('popstate'));
|
18
23
|
};
|
24
|
+
/**
|
25
|
+
* Navigate to a page with optional query parameters, and dispatch a Redux action to load the page.
|
26
|
+
*
|
27
|
+
* @param pathInfo - Object containing pathname, search, and optional params.
|
28
|
+
* @param dispatch - Redux dispatch function.
|
29
|
+
*/
|
19
30
|
export const navigateWithSilence = ({ pathname: path, search, params }) => (dispatch) => {
|
20
31
|
const { path: pathname } = getPathInfo(path);
|
21
32
|
const reg = /\/([^\/]+)\/*([^\/]*)/;
|
@@ -33,6 +44,12 @@ export const navigateWithSilence = ({ pathname: path, search, params }) => (disp
|
|
33
44
|
// you can do here
|
34
45
|
dispatch(loadPage(page, id, params));
|
35
46
|
};
|
47
|
+
/**
|
48
|
+
* Preload a page by performing any necessary preprocessing before loading.
|
49
|
+
*
|
50
|
+
* @param page - The page to preload.
|
51
|
+
* @returns - The new page path or routing result after preprocessing.
|
52
|
+
*/
|
36
53
|
const _preLoadPage = (page) => {
|
37
54
|
/*
|
38
55
|
* _preLoadPage 에서는 page를 load하기 전처리를 수행한다.
|
@@ -51,6 +68,13 @@ const _preLoadPage = (page) => {
|
|
51
68
|
}
|
52
69
|
}
|
53
70
|
};
|
71
|
+
/**
|
72
|
+
* Load a page by dispatching a Redux action, and handle page navigation if necessary.
|
73
|
+
*
|
74
|
+
* @param page - The page to load.
|
75
|
+
* @param id - The associated resource ID.
|
76
|
+
* @param params - Additional parameters to pass to the page.
|
77
|
+
*/
|
54
78
|
export const loadPage = (page, id, params) => (dispatch) => {
|
55
79
|
var newPage = _preLoadPage(page);
|
56
80
|
if (page !== newPage && newPage.indexOf('/') == 0) {
|
@@ -67,6 +91,11 @@ export const loadPage = (page, id, params) => (dispatch) => {
|
|
67
91
|
params
|
68
92
|
});
|
69
93
|
};
|
94
|
+
/**
|
95
|
+
* Route to a given URL by creating a link element and triggering a click event.
|
96
|
+
*
|
97
|
+
* @param url - The URL to route to.
|
98
|
+
*/
|
70
99
|
export const route = (url) => {
|
71
100
|
const link = document.createElement('a');
|
72
101
|
link.setAttribute('href', url);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"route.js","sourceRoot":"","sources":["../../../src/actions/route.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAE5C,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC
|
1
|
+
{"version":3,"file":"route.js","sourceRoot":"","sources":["../../../src/actions/route.ts"],"names":[],"mappings":"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","sourcesContent":["import { getPathInfo } from '@operato/utils'\n\nimport { HOMEPAGE, UPDATE_PAGE } from '../actions/const'\nimport { store } from '../store'\n\n/**\n * Navigate to a page using one of two methods:\n * 1. Using a page link: <a href='page'>goto page</a> (equivalent to route(page))\n * 2. Using the navigate('page') function.\n *\n * 페이지를 이동하는 방법으로는 다음 두가지가 있다.\n * 1. page link를 사용하는 방법 <a href='page'>goto page</a>\n * 이 방법은 route(page)와 동일하다.\n * 2. navigate('page')를 사용하는 방법\n *\n * @param location - The path of the page to navigate to.\n * @param replace - Optional. If true, replaces the current page in the browser's history.\n */\nexport const navigate = (location: string, replace?: boolean) => {\n if (replace) history.replaceState(history.state, '', location)\n else history.pushState({}, '', location)\n\n window.dispatchEvent(new Event('popstate'))\n}\n\n/**\n * Navigate to a page with optional query parameters, and dispatch a Redux action to load the page.\n *\n * @param pathInfo - Object containing pathname, search, and optional params.\n * @param dispatch - Redux dispatch function.\n */\nexport const navigateWithSilence =\n ({ pathname: path, search, params }: { pathname: string; search?: string; params?: { [key: string]: any } }) =>\n (dispatch: any) => {\n const { path: pathname } = getPathInfo(path)\n\n const reg = /\\/([^\\/]+)\\/*([^\\/]*)/\n const decodePath = decodeURIComponent(pathname!)\n const matchReturn = decodePath.match(reg) || []\n const page = matchReturn[1] || HOMEPAGE\n const id = matchReturn[2]\n\n if (!params) {\n params = {}\n\n new URLSearchParams(search).forEach((value, key) => {\n params![key] = value\n })\n }\n\n // Any other info you might want to extract from the path (like page type),\n // you can do here\n dispatch(loadPage(page, id, params))\n }\n\n/**\n * Preload a page by performing any necessary preprocessing before loading.\n *\n * @param page - The page to preload.\n * @returns - The new page path or routing result after preprocessing.\n */\nconst _preLoadPage = (page: any) => {\n /*\n * _preLoadPage 에서는 page를 load하기 전처리를 수행한다.\n * 예를 들면, page dynamic import 또는 page re-routing\n */\n var state: any = store.getState()\n\n /* override 기능을 위해서 dependency 관계의 역순으로 route를 실행한다. */\n var modules = state.app.modules\n if (modules) {\n for (let i = modules.length - 1; i >= 0; i--) {\n let factoryModule = modules[i]\n let _page = factoryModule.route && factoryModule.route(page)\n if (_page) {\n return _page\n }\n }\n }\n}\n\n/**\n * Load a page by dispatching a Redux action, and handle page navigation if necessary.\n *\n * @param page - The page to load.\n * @param id - The associated resource ID.\n * @param params - Additional parameters to pass to the page.\n */\nexport const loadPage = (page: string, id: string, params: { [key: string]: any }) => (dispatch: any) => {\n var newPage = _preLoadPage(page)\n\n if (page !== newPage && newPage.indexOf('/') == 0) {\n dispatch(\n navigateWithSilence({\n pathname: id ? `${newPage}/${id}` : newPage,\n params\n })\n )\n return\n }\n\n dispatch({\n type: UPDATE_PAGE,\n page: newPage,\n resourceId: id,\n params\n })\n}\n\n/**\n * Route to a given URL by creating a link element and triggering a click event.\n *\n * @param url - The URL to route to.\n */\nexport const route = (url: string) => {\n const link = document.createElement('a')\n\n link.setAttribute('href', url)\n\n document.body.appendChild(link)\n link.click()\n document.body.removeChild(link)\n}\n"]}
|
@@ -1,17 +1,75 @@
|
|
1
1
|
import { LitElement, PropertyValues } from 'lit';
|
2
|
+
/**
|
3
|
+
* PageView is a base class for creating page elements with lifecycle management.
|
4
|
+
* Subclasses can extend PageView to define custom behavior and handle page lifecycle events.
|
5
|
+
*/
|
2
6
|
export declare class PageView extends LitElement {
|
7
|
+
/**
|
8
|
+
* Determines whether the page can be deactivated. Subclasses can override this method
|
9
|
+
* to implement custom deactivation logic.
|
10
|
+
* @returns A Promise that resolves to true if the page can be deactivated, or false otherwise.
|
11
|
+
*/
|
3
12
|
canDeactivate(): Promise<boolean>;
|
13
|
+
/**
|
14
|
+
* Determines whether the page should update. This method is called whenever there are
|
15
|
+
* changes to the page's properties.
|
16
|
+
* @param changes - A map of changed property values.
|
17
|
+
* @returns True if the page should update, or false otherwise.
|
18
|
+
*/
|
4
19
|
shouldUpdate(changes: PropertyValues<this>): boolean;
|
20
|
+
/**
|
21
|
+
* Indicates whether the page is currently active.
|
22
|
+
*/
|
5
23
|
active: boolean;
|
24
|
+
/**
|
25
|
+
* Stores information about the page's lifecycle.
|
26
|
+
*/
|
6
27
|
lifecycle: any;
|
28
|
+
/**
|
29
|
+
* The context path for the page.
|
30
|
+
*/
|
7
31
|
contextPath?: string;
|
8
32
|
_oldLifecycleInfo$: any;
|
33
|
+
/**
|
34
|
+
* Handles page updates and lifecycle events. Subclasses can override this method
|
35
|
+
* to implement custom logic for initializing, updating, and disposing of the page.
|
36
|
+
* @param changes - A map of changed properties.
|
37
|
+
* @param force - If true, forces an update of the page.
|
38
|
+
*/
|
9
39
|
pageUpdate(changes?: any, force?: boolean): Promise<void>;
|
40
|
+
/**
|
41
|
+
* Resets the page. Subclasses can override this method to perform custom reset logic.
|
42
|
+
*/
|
10
43
|
pageReset(): Promise<void>;
|
44
|
+
/**
|
45
|
+
* Disposes of the page. Subclasses can override this method to perform custom disposal logic.
|
46
|
+
*/
|
11
47
|
pageDispose(): Promise<void>;
|
48
|
+
/**
|
49
|
+
* Initializes the page. Subclasses can override this method to perform custom initialization logic.
|
50
|
+
* @param pageInfo - Information about the page's state.
|
51
|
+
*/
|
12
52
|
pageInitialized(pageInfo: any): void;
|
53
|
+
/**
|
54
|
+
* Handles page updates and changes in properties.
|
55
|
+
* Subclasses can override this method to implement custom update logic.
|
56
|
+
* @param changes - A map of changed properties.
|
57
|
+
* @param after - The current state of the page.
|
58
|
+
* @param before - The previous state of the page.
|
59
|
+
*/
|
13
60
|
pageUpdated(changes: any, after: any, before: any): void;
|
61
|
+
/**
|
62
|
+
* Handles the disposal of the page. Subclasses can override this method
|
63
|
+
* to implement custom disposal logic.
|
64
|
+
* @param pageInfo - Information about the page's state.
|
65
|
+
*/
|
14
66
|
pageDisposed(pageInfo: any): void;
|
15
67
|
updateContext(override?: any): void;
|
68
|
+
/**
|
69
|
+
* Updates the context of the page. Subclasses can override the `context` getter
|
70
|
+
* to provide specific context information for the page. The context will be updated
|
71
|
+
* using the `updateContext` method inherited from PageView.
|
72
|
+
* @param override - An optional object with context properties to override.
|
73
|
+
*/
|
16
74
|
get context(): {};
|
17
75
|
}
|
@@ -17,15 +17,32 @@ function diff(after, before) {
|
|
17
17
|
});
|
18
18
|
return changed && changes;
|
19
19
|
}
|
20
|
+
/**
|
21
|
+
* PageView is a base class for creating page elements with lifecycle management.
|
22
|
+
* Subclasses can extend PageView to define custom behavior and handle page lifecycle events.
|
23
|
+
*/
|
20
24
|
export class PageView extends LitElement {
|
21
25
|
constructor() {
|
22
26
|
super(...arguments);
|
27
|
+
/**
|
28
|
+
* Indicates whether the page is currently active.
|
29
|
+
*/
|
23
30
|
this.active = false;
|
24
31
|
}
|
32
|
+
/**
|
33
|
+
* Determines whether the page can be deactivated. Subclasses can override this method
|
34
|
+
* to implement custom deactivation logic.
|
35
|
+
* @returns A Promise that resolves to true if the page can be deactivated, or false otherwise.
|
36
|
+
*/
|
25
37
|
async canDeactivate() {
|
26
38
|
return Promise.resolve(true);
|
27
39
|
}
|
28
|
-
|
40
|
+
/**
|
41
|
+
* Determines whether the page should update. This method is called whenever there are
|
42
|
+
* changes to the page's properties.
|
43
|
+
* @param changes - A map of changed property values.
|
44
|
+
* @returns True if the page should update, or false otherwise.
|
45
|
+
*/
|
29
46
|
shouldUpdate(changes) {
|
30
47
|
var active = String(this.active) == 'true';
|
31
48
|
var { active: oldActive = false } = this._oldLifecycleInfo$ || {};
|
@@ -47,6 +64,12 @@ export class PageView extends LitElement {
|
|
47
64
|
return active;
|
48
65
|
}
|
49
66
|
/* lifecycle */
|
67
|
+
/**
|
68
|
+
* Handles page updates and lifecycle events. Subclasses can override this method
|
69
|
+
* to implement custom logic for initializing, updating, and disposing of the page.
|
70
|
+
* @param changes - A map of changed properties.
|
71
|
+
* @param force - If true, forces an update of the page.
|
72
|
+
*/
|
50
73
|
async pageUpdate(changes = {}, force = false) {
|
51
74
|
var before = this._oldLifecycleInfo$ || {};
|
52
75
|
var after = {
|
@@ -96,6 +119,9 @@ export class PageView extends LitElement {
|
|
96
119
|
after.active && this.updateContext();
|
97
120
|
}
|
98
121
|
}
|
122
|
+
/**
|
123
|
+
* Resets the page. Subclasses can override this method to perform custom reset logic.
|
124
|
+
*/
|
99
125
|
async pageReset() {
|
100
126
|
var { initialized } = this._oldLifecycleInfo$ || {};
|
101
127
|
if (initialized) {
|
@@ -103,13 +129,32 @@ export class PageView extends LitElement {
|
|
103
129
|
await this.pageUpdate({}, true);
|
104
130
|
}
|
105
131
|
}
|
132
|
+
/**
|
133
|
+
* Disposes of the page. Subclasses can override this method to perform custom disposal logic.
|
134
|
+
*/
|
106
135
|
async pageDispose() {
|
107
136
|
await this.pageUpdate({
|
108
137
|
initialized: false
|
109
138
|
});
|
110
139
|
}
|
140
|
+
/**
|
141
|
+
* Initializes the page. Subclasses can override this method to perform custom initialization logic.
|
142
|
+
* @param pageInfo - Information about the page's state.
|
143
|
+
*/
|
111
144
|
pageInitialized(pageInfo) { }
|
145
|
+
/**
|
146
|
+
* Handles page updates and changes in properties.
|
147
|
+
* Subclasses can override this method to implement custom update logic.
|
148
|
+
* @param changes - A map of changed properties.
|
149
|
+
* @param after - The current state of the page.
|
150
|
+
* @param before - The previous state of the page.
|
151
|
+
*/
|
112
152
|
pageUpdated(changes, after, before) { }
|
153
|
+
/**
|
154
|
+
* Handles the disposal of the page. Subclasses can override this method
|
155
|
+
* to implement custom disposal logic.
|
156
|
+
* @param pageInfo - Information about the page's state.
|
157
|
+
*/
|
113
158
|
pageDisposed(pageInfo) { }
|
114
159
|
/* context */
|
115
160
|
updateContext(override) {
|
@@ -118,6 +163,12 @@ export class PageView extends LitElement {
|
|
118
163
|
context: override ? { ...this.context, ...override } : this.context
|
119
164
|
});
|
120
165
|
}
|
166
|
+
/**
|
167
|
+
* Updates the context of the page. Subclasses can override the `context` getter
|
168
|
+
* to provide specific context information for the page. The context will be updated
|
169
|
+
* using the `updateContext` method inherited from PageView.
|
170
|
+
* @param override - An optional object with context properties to override.
|
171
|
+
*/
|
121
172
|
get context() {
|
122
173
|
return {};
|
123
174
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"page-view.js","sourceRoot":"","sources":["../../../../src/app/pages/page-view.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAA;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,OAAO,MAAM,mBAAmB,CAAA;AAEvC,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAEnC,SAAS,IAAI,CAAC,KAAU,EAAE,MAAW;IACnC,IAAI,OAAO,GAAG,KAAK,CAAA;IACnB,IAAI,OAAO,GAA2B,EAAE,CAAA;IAExC,MAAM,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,UAAU,GAAG;QACrD,IAAI,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;QAC5B,IAAI,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,CAAA;QAE1B,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,SAAS,CAAC,EAAE,CAAC;YACpC,OAAO,CAAC,GAAG,CAAC,GAAG,SAAS,CAAA;YACxB,OAAO,GAAG,IAAI,CAAA;QAChB,CAAC;IACH,CAAC,CAAC,CAAA;IAEF,OAAO,OAAO,IAAI,OAAO,CAAA;AAC3B,CAAC;AAED,MAAM,OAAO,QAAS,SAAQ,UAAU;IAAxC;;
|
1
|
+
{"version":3,"file":"page-view.js","sourceRoot":"","sources":["../../../../src/app/pages/page-view.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport isEqual from 'lodash-es/isEqual'\n\nimport { UPDATE_CONTEXT } from '../../actions/const'\nimport { store } from '../../store'\n\nfunction diff(after: any, before: any): any {\n var changed = false\n var changes: { [key: string]: any } = {}\n\n Object.getOwnPropertyNames(after).forEach(function (key) {\n let before_val = before[key]\n let after_val = after[key]\n\n if (!isEqual(before_val, after_val)) {\n changes[key] = after_val\n changed = true\n }\n })\n\n return changed && changes\n}\n\n/**\n * PageView is a base class for creating page elements with lifecycle management.\n * Subclasses can extend PageView to define custom behavior and handle page lifecycle events.\n */\nexport class PageView extends LitElement {\n /**\n * Determines whether the page can be deactivated. Subclasses can override this method\n * to implement custom deactivation logic.\n * @returns A Promise that resolves to true if the page can be deactivated, or false otherwise.\n */\n async canDeactivate(): Promise<boolean> {\n return Promise.resolve(true)\n }\n\n /**\n * Determines whether the page should update. This method is called whenever there are\n * changes to the page's properties.\n * @param changes - A map of changed property values.\n * @returns True if the page should update, or false otherwise.\n */\n shouldUpdate(changes: PropertyValues<this>) {\n var active = String(this.active) == 'true'\n var { active: oldActive = false } = this._oldLifecycleInfo$ || {}\n\n /*\n * page lifecycle\n * case 1. page가 새로 activate 되었다.\n * case 2. page가 active 상태에서 lifecycle 정보가 바뀌었다.\n **/\n if (active) {\n this.pageUpdate({\n active\n })\n } else if (oldActive) {\n this.pageUpdate({\n active\n })\n }\n\n return active\n }\n\n /**\n * Indicates whether the page is currently active.\n */\n @property({ type: Boolean }) active: boolean = false\n\n /**\n * Stores information about the page's lifecycle.\n */\n @property({ type: Object }) lifecycle: any\n\n /**\n * The context path for the page.\n */\n @property({ type: String, attribute: 'context-path' }) contextPath?: string\n\n _oldLifecycleInfo$: any\n\n /* lifecycle */\n\n /**\n * Handles page updates and lifecycle events. Subclasses can override this method\n * to implement custom logic for initializing, updating, and disposing of the page.\n * @param changes - A map of changed properties.\n * @param force - If true, forces an update of the page.\n */\n async pageUpdate(changes: any = {}, force: boolean = false) {\n var before = this._oldLifecycleInfo$ || {}\n\n var after = {\n ...before,\n ...this.lifecycle,\n contextPath: this.contextPath,\n ...changes\n }\n\n if (!('initialized' in changes) && after.active && !before.initialized) {\n after.initialized = true\n }\n\n if (force) {\n after.updated = Date.now()\n }\n\n var changed = diff(after, before)\n if (!changed) {\n return\n }\n\n this._oldLifecycleInfo$ = after\n\n /* page의 이미 초기화된 상태에서 contextPath가 바뀐다면, 무조건 page가 리셋되어야 한다. */\n if (before.initialized && changed.contextPath) {\n await this.pageReset()\n return\n }\n\n if (changed.initialized) {\n await this.pageInitialized(after)\n }\n\n if ('initialized' in changed) {\n if (changed.initialized) {\n /*\n * 방금 초기화된 경우라면, 엘리먼트들이 만들어지지 않았을 가능성이 있으므로,\n * 다음 animationFrame에서 pageUpdated 콜백을 호출한다.\n */\n requestAnimationFrame(async () => {\n await this.pageUpdated(changed, after, before)\n /* active page인 경우에는, page Context 갱신도 필요할 것이다. */\n after.active && this.updateContext()\n })\n } else {\n await this.pageDisposed(after)\n }\n } else {\n await this.pageUpdated(changed, after, before)\n /* active page인 경우에는, page Context 갱신도 필요할 것이다. */\n after.active && this.updateContext()\n }\n }\n\n /**\n * Resets the page. Subclasses can override this method to perform custom reset logic.\n */\n async pageReset() {\n var { initialized } = this._oldLifecycleInfo$ || {}\n\n if (initialized) {\n await this.pageDispose()\n await this.pageUpdate({}, true)\n }\n }\n\n /**\n * Disposes of the page. Subclasses can override this method to perform custom disposal logic.\n */\n async pageDispose() {\n await this.pageUpdate({\n initialized: false\n })\n }\n\n /**\n * Initializes the page. Subclasses can override this method to perform custom initialization logic.\n * @param pageInfo - Information about the page's state.\n */\n pageInitialized(pageInfo: any) {}\n\n /**\n * Handles page updates and changes in properties.\n * Subclasses can override this method to implement custom update logic.\n * @param changes - A map of changed properties.\n * @param after - The current state of the page.\n * @param before - The previous state of the page.\n */\n pageUpdated(changes: any, after: any, before: any) {}\n\n /**\n * Handles the disposal of the page. Subclasses can override this method\n * to implement custom disposal logic.\n * @param pageInfo - Information about the page's state.\n */\n pageDisposed(pageInfo: any) {}\n\n /* context */\n updateContext(override?: any) {\n store.dispatch({\n type: UPDATE_CONTEXT,\n context: override ? { ...this.context, ...override } : this.context\n })\n }\n\n /**\n * Updates the context of the page. Subclasses can override the `context` getter\n * to provide specific context information for the page. The context will be updated\n * using the `updateContext` method inherited from PageView.\n * @param override - An optional object with context properties to override.\n */\n get context() {\n return {}\n }\n}\n"]}
|