@operato/shell 7.1.30 β†’ 7.1.32

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/.editorconfig DELETED
@@ -1,29 +0,0 @@
1
- # EditorConfig helps developers define and maintain consistent
2
- # coding styles between different editors and IDEs
3
- # editorconfig.org
4
-
5
- root = true
6
-
7
-
8
- [*]
9
-
10
- # Change these settings to your own preference
11
- indent_style = space
12
- indent_size = 2
13
-
14
- # We recommend you to keep these unchanged
15
- end_of_line = lf
16
- charset = utf-8
17
- trim_trailing_whitespace = true
18
- insert_final_newline = true
19
-
20
- [*.md]
21
- trim_trailing_whitespace = false
22
-
23
- [*.json]
24
- indent_size = 2
25
-
26
- [*.{html,js,md}]
27
- block_comment_start = /**
28
- block_comment = *
29
- block_comment_end = */
@@ -1,3 +0,0 @@
1
- module.exports = {
2
- stories: ['../dist/stories/**/*.stories.{js,md,mdx}'],
3
- };
@@ -1,52 +0,0 @@
1
- import { i18next } from '@operato/i18n'
2
-
3
- export const globalTypes = {
4
- locale: {
5
- name: 'Locale',
6
- description: 'Internationalization locale',
7
- toolbar: {
8
- icon: 'globe',
9
- items: [
10
- { value: 'en', right: 'πŸ‡ΊπŸ‡Έ', title: 'English' },
11
- { value: 'ko', right: 'πŸ‡°πŸ‡·', title: 'ν•œκ΅­μ–΄' },
12
- { value: 'zh', right: 'πŸ‡¨πŸ‡³', title: 'δΈ­ζ–‡' },
13
- { value: 'ja', right: 'πŸ‡―πŸ‡΅', title: 'ζ—₯本θͺž' },
14
- { value: 'ms', right: 'πŸ‡²πŸ‡Ύ', title: 'Bahasa Melayu' }
15
- ],
16
- showName: true
17
- }
18
- },
19
- theme: {
20
- name: 'Theme',
21
- description: 'Global theme for components',
22
- toolbar: {
23
- icon: 'paintbrush',
24
- items: [
25
- { value: 'light', title: 'Light' },
26
- { value: 'dark', title: 'Dark' }
27
- ],
28
- showName: true
29
- }
30
- }
31
- }
32
-
33
- export const decorators = [
34
- (Story, context) => {
35
- const { locale, theme } = context.globals
36
-
37
- if (locale) {
38
- i18next.changeLanguage(locale)
39
- }
40
-
41
- // Set the theme class for the document
42
- if (theme === 'dark') {
43
- document.documentElement.classList.add('dark')
44
- document.documentElement.classList.remove('light')
45
- } else {
46
- document.documentElement.classList.add('light')
47
- document.documentElement.classList.remove('dark')
48
- }
49
-
50
- return Story()
51
- }
52
- ]
@@ -1,8 +0,0 @@
1
- import { storybookPlugin } from '@web/dev-server-storybook';
2
- import baseConfig from '../web-dev-server.config.mjs';
3
-
4
- export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
5
- ...baseConfig,
6
- open: '/',
7
- plugins: [storybookPlugin({ type: 'web-components' }), ...baseConfig.plugins],
8
- });
package/demo/index.html DELETED
@@ -1,44 +0,0 @@
1
- <!doctype html>
2
- <html lang="en-GB">
3
- <head>
4
- <meta charset="utf-8" />
5
- <style>
6
- body {
7
- background: #fafafa;
8
- --ox-checkbox-size: 12px;
9
- }
10
-
11
- #demo {
12
- position: relative;
13
- height: 300px;
14
- background-color: lightgray;
15
- vertical-align: middle;
16
- }
17
- </style>
18
- <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
19
- <link
20
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
21
- rel="stylesheet"
22
- />
23
- <link
24
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
25
- rel="stylesheet"
26
- />
27
- <link
28
- href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
29
- rel="stylesheet"
30
- />
31
- </head>
32
- <body>
33
- <div id="demo"></div>
34
-
35
- <script type="module">
36
- import { html, render } from 'lit'
37
- import '@material/web/icon/icon.js'
38
-
39
- const parent = document.querySelector('#demo')
40
-
41
- render(html``, parent)
42
- </script>
43
- </body>
44
- </html>
@@ -1,23 +0,0 @@
1
- export const UPDATE_MODULES = 'UPDATE_MODULES'
2
- export const UPDATE_BASE_URL = 'UPDATE_BASE_URL'
3
- export const UPDATE_CONTEXT_PATH = 'UPDATE_CONTEXT_PATH'
4
- export const SET_DOMAINS = 'SET-DOMAINS'
5
-
6
- export const updateDomains =
7
- (
8
- domains: {
9
- name: string
10
- subdomain: string
11
- }[],
12
- domain: {
13
- name: string
14
- subdomain: string
15
- }
16
- ) =>
17
- (dispatch: any) => {
18
- dispatch({
19
- type: SET_DOMAINS,
20
- domains,
21
- domain
22
- })
23
- }
@@ -1,15 +0,0 @@
1
- import { setActiveRequestCounterCallback } from '@operato/graphql'
2
- import { store } from '../store'
3
-
4
- export const UPDATE_BUSY = 'UPDATE_BUSY'
5
-
6
- setActiveRequestCounterCallback((count: number) => {
7
- store.dispatch(updateBusy(count != 0) as any)
8
- })
9
-
10
- export const updateBusy = (busy: boolean) => (dispatch: any) => {
11
- dispatch({
12
- type: UPDATE_BUSY,
13
- busy
14
- })
15
- }
@@ -1,8 +0,0 @@
1
- export const UPDATE_PAGE = 'UPDATE_PAGE'
2
- export const UPDATE_CONTEXT = 'UPDATE_CONTEXT'
3
- export const UPDATE_ACTIVE_PAGE = 'UPDATE_ACTIVE_PAGE'
4
-
5
- export const REGISTER_NAVIGATION_CALLBACK = 'REGISTER_NAVIGATION_CALLBACK'
6
- export const UNREGISTER_NAVIGATION_CALLBACK = 'UNREGISTER_NAVIGATION_CALLBACK'
7
-
8
- export const HOMEPAGE = ''
@@ -1,4 +0,0 @@
1
- export * from './app'
2
- export * from './route'
3
- export * from './busy'
4
- export * from './const'
@@ -1,126 +0,0 @@
1
- import { getPathInfo } from '@operato/utils'
2
-
3
- import { HOMEPAGE, UPDATE_PAGE } from '../actions/const'
4
- import { store } from '../store'
5
-
6
- /**
7
- * Navigate to a page using one of two methods:
8
- * 1. Using a page link: <a href='page'>goto page</a> (equivalent to route(page))
9
- * 2. Using the navigate('page') function.
10
- *
11
- * νŽ˜μ΄μ§€λ₯Ό μ΄λ™ν•˜λŠ” λ°©λ²•μœΌλ‘œλŠ” λ‹€μŒ 두가지가 μžˆλ‹€.
12
- * 1. page linkλ₯Ό μ‚¬μš©ν•˜λŠ” 방법 <a href='page'>goto page</a>
13
- * 이 방법은 route(page)와 λ™μΌν•˜λ‹€.
14
- * 2. navigate('page')λ₯Ό μ‚¬μš©ν•˜λŠ” 방법
15
- *
16
- * @param location - The path of the page to navigate to.
17
- * @param replace - Optional. If true, replaces the current page in the browser's history.
18
- */
19
- export const navigate = (location: string, replace?: boolean) => {
20
- if (replace) history.replaceState(history.state, '', location)
21
- else history.pushState({}, '', location)
22
-
23
- window.dispatchEvent(new Event('popstate'))
24
- }
25
-
26
- /**
27
- * Navigate to a page with optional query parameters, and dispatch a Redux action to load the page.
28
- *
29
- * @param pathInfo - Object containing pathname, search, and optional params.
30
- * @param dispatch - Redux dispatch function.
31
- */
32
- export const navigateWithSilence =
33
- ({ pathname: path, search, params }: { pathname: string; search?: string; params?: { [key: string]: any } }) =>
34
- (dispatch: any) => {
35
- const { path: pathname } = getPathInfo(path)
36
-
37
- const reg = /\/([^\/]+)\/*([^\/]*)/
38
- const decodePath = decodeURIComponent(pathname!)
39
- const matchReturn = decodePath.match(reg) || []
40
- const page = matchReturn[1] || HOMEPAGE
41
- const id = matchReturn[2]
42
-
43
- if (!params) {
44
- params = {}
45
-
46
- new URLSearchParams(search).forEach((value, key) => {
47
- params![key] = value
48
- })
49
- }
50
-
51
- // Any other info you might want to extract from the path (like page type),
52
- // you can do here
53
- dispatch(loadPage(page, id, params))
54
- }
55
-
56
- /**
57
- * Preload a page by performing any necessary preprocessing before loading.
58
- *
59
- * @param page - The page to preload.
60
- * @returns - The new page path or routing result after preprocessing.
61
- */
62
- const _preLoadPage = async (page: any) => {
63
- /*
64
- * _preLoadPage μ—μ„œλŠ” pageλ₯Ό loadν•˜κΈ° μ „μ²˜λ¦¬λ₯Ό μˆ˜ν–‰ν•œλ‹€.
65
- * 예λ₯Ό λ“€λ©΄, page dynamic import λ˜λŠ” page re-routing
66
- */
67
- var state: any = store.getState()
68
-
69
- /* override κΈ°λŠ₯을 μœ„ν•΄μ„œ dependency κ΄€κ³„μ˜ μ—­μˆœμœΌλ‘œ routeλ₯Ό μ‹€ν–‰ν•œλ‹€. */
70
- var modules = state.app.modules
71
- if (modules) {
72
- for (let i = modules.length - 1; i >= 0; i--) {
73
- let module = modules[i]
74
- let _page = module.route && (await module.route(page, module))
75
- if (_page) {
76
- return _page
77
- }
78
- }
79
- }
80
- }
81
-
82
- /**
83
- * Load a page by dispatching a Redux action, and handle page navigation if necessary.
84
- *
85
- * @param page - The page to load.
86
- * @param id - The associated resource ID.
87
- * @param params - Additional parameters to pass to the page.
88
- */
89
- export const loadPage = (page: string, id: string, params: { [key: string]: any }) => async (dispatch: any) => {
90
- var newPage = await _preLoadPage(page)
91
-
92
- if (page !== newPage && newPage.indexOf('/') == 0) {
93
- dispatch(
94
- navigateWithSilence({
95
- pathname: id ? `${newPage}/${id}` : newPage,
96
- params
97
- })
98
- )
99
- return
100
- }
101
-
102
- dispatch({
103
- type: UPDATE_PAGE,
104
- page: newPage,
105
- resourceId: id,
106
- params
107
- })
108
- }
109
-
110
- /**
111
- * Route to a given URL by creating a link element and triggering a click event.
112
- * This approach does not work properly in a mobile environment and therefore should not be used.
113
- *
114
- * @deprecated
115
- *
116
- * @param url - The URL to route to.
117
- */
118
- export const route = (url: string) => {
119
- const link = document.createElement('a')
120
-
121
- link.setAttribute('href', url)
122
-
123
- document.body.appendChild(link)
124
- link.click()
125
- document.body.removeChild(link)
126
- }
@@ -1,114 +0,0 @@
1
- import { css } from 'lit'
2
-
3
- export const AppStyle = css`
4
- :host {
5
- display: grid;
6
-
7
- grid-template-rows: var(--app-grid-template-rows, auto 1fr auto);
8
- grid-template-columns: var(--app-grid-template-columns, auto 1fr auto);
9
- grid-template-areas: var(--app-grid-template-area, 'header header header' 'nav main aside' 'nav footer aside');
10
- grid-gap: var(--app-grid-gap, 0em);
11
-
12
- max-width: 100vw;
13
- width: 100vw;
14
- height: 100vh;
15
- height: 100dvh;
16
- }
17
-
18
- ox-header-bar {
19
- grid-area: header;
20
- }
21
-
22
- ox-nav-bar {
23
- grid-area: nav;
24
- }
25
-
26
- div {
27
- grid-area: main;
28
-
29
- display: flex;
30
- flex-direction: column;
31
- overflow: hidden;
32
- }
33
-
34
- main {
35
- flex: 1;
36
-
37
- display: flex;
38
- flex-direction: row;
39
- overflow: hidden;
40
- }
41
-
42
- ox-aside-bar {
43
- grid-area: aside;
44
- }
45
-
46
- ox-footer-bar {
47
- grid-area: footer;
48
- }
49
-
50
- main > * {
51
- flex: 1;
52
- }
53
-
54
- main > *:not([active]) {
55
- display: none;
56
- }
57
-
58
- [hidden] {
59
- display: none;
60
- }
61
-
62
- ox-snack-bar {
63
- z-index: 1000;
64
- }
65
-
66
- @media print {
67
- :host {
68
- width: 100%;
69
- height: 100%;
70
- min-height: 100vh;
71
- min-height: 100dvh;
72
-
73
- max-width: unset;
74
- width: unset;
75
- height: unset;
76
- height: unset;
77
- }
78
-
79
- main {
80
- /* important for printing!!! */
81
- display: block;
82
- flex: unset;
83
- overflow: visible;
84
- }
85
-
86
- ox-page-header-bar {
87
- display: none;
88
- }
89
-
90
- ox-page-footer-bar {
91
- display: none;
92
- }
93
-
94
- ox-header-bar {
95
- display: none;
96
- }
97
-
98
- ox-nav-bar {
99
- display: none;
100
- }
101
-
102
- ox-aside-bar {
103
- display: none;
104
- }
105
-
106
- ox-footer-bar {
107
- display: none;
108
- }
109
-
110
- ox-snack-bar {
111
- display: none;
112
- }
113
- }
114
- `