1
0
mirror of https://github.com/devcode-it/openstamanager.git synced 2025-06-05 22:09:38 +02:00

feat: Aggiunti Manager dei principali componenti con stato

This commit is contained in:
Maicol Battistini
2022-03-16 23:59:26 +01:00
parent 3d84995c5a
commit f0d9f416cc
8 changed files with 106 additions and 0 deletions

View File

@@ -0,0 +1,35 @@
import {CircularProgress} from '@material/mwc-circular-progress';
import {Manager} from './Manager';
export class CircularProgressManager extends Manager {
static selector = 'mwc-circular-progress';
static filter = (element: CircularProgress) => element.closest('mwc-button').type !== 'loading-button';
constructor(private loading: CircularProgress) {
}
public show() {
this.loading.open();
}
public hide() {
this.loading.close();
}
public get indeterminate(): boolean {
return this.loading.indeterminate;
}
public set indeterminate(value: boolean) {
this.loading.indeterminate = value;
}
public get progress(): number {
return this.loading.progress;
}
public set progress(value: number) {
this.loading.progress = value;
}
}

View File

@@ -0,0 +1,18 @@
import {Dialog} from '@material/mwc-dialog';
import {Manager} from './Manager';
export class DialogManager extends Manager {
static selector = 'dialog';
constructor(private dialog: Dialog) {
}
public show(dialog: Dialog) {
this.dialog.show();
}
public hide() {
this.dialog.close();
}
}

View File

@@ -0,0 +1,13 @@
import {Button} from '@material/mwc-button';
import {CircularProgress} from '@material/mwc-circular-progress';
import {CircularProgressManager} from '@osm/Components/Managers';
export class LoadingButtonManager extends CircularProgressManager {
static selector = 'mwc-button[type="loading-button"]';
private loading: CircularProgress;
constructor(private button: Button) {
this.loading = button.querySelector('mwc-circular-progress');
}
}

View File

@@ -0,0 +1,4 @@
export abstract class Manager {
abstract static selector: string;
static filter: (element: HTMLElement) => boolean = () => true;
}

View File

@@ -0,0 +1,8 @@
/**
* @file Automatically generated by barrelsby.
*/
export * from './CircularProgressManager';
export * from './DialogManager';
export * from './LoadingButtonManager';
export * from './Manager';

View File

@@ -8,6 +8,7 @@ export * from './extend';
export * from './InertiaLink';
export * from './layout';
export * from './LoadingButton';
export * from './Managers';
export * from './Mdi';
export * from './Page';
export * from './Pages';

View File

@@ -10,6 +10,11 @@ import {Menu as MWCMenu} from '@material/mwc-menu';
import $ from 'cash-dom';
import {IconButton} from './WebComponents';
import {
CircularProgressManager,
DialogManager,
LoadingButtonManager
} from '@osm/Components/Managers';
/**
* Handles the click event of the trigger button of a MWC Dialog or Menu.
@@ -45,6 +50,19 @@ function loadTriggers() {
}
}
function loadManagers() {
const managers = [DialogManager, CircularProgressManager, LoadingButtonManager];
for (const Manager of managers) {
for (const element of document.querySelectorAll<HTMLElement>(Manager.selector)) {
// eslint-disable-next-line unicorn/no-array-callback-reference
if (Manager.filter(element)) {
app.components[element.id] = new Manager(element);
}
}
}
}
/**
* Better forms accessibility
* @example https://codesandbox.io/s/test-mwc-button-form-submit-zqgo5i?file=/src/index.ts
@@ -70,6 +88,7 @@ function betterFormsAccessibility() {
Inertia.on('navigate', () => {
loadTriggers();
betterFormsAccessibility();
loadManagers();
// Remove the ugly underline under mwc button text when inside <a> tags.
$('a')

View File

@@ -18,6 +18,11 @@ import {LinearProgress as MWCLinearProgress} from '@material/mwc-linear-progress
import {List as MWCList} from '@material/mwc-list';
import {ListItem as MWCListItem} from '@material/mwc-list/mwc-list-item.js';
import {Menu as MWCMenu} from '@material/mwc-menu';
import {
CircularProgressManager,
DialogManager,
LoadingButtonManager
} from '@osm/Components/Managers';
import type cash from 'cash-dom';
import type Mithril from 'mithril';
import type router from 'ziggy-js';
@@ -36,10 +41,13 @@ import {
TopAppBar
} from './WebComponents';
type ComponentManager = CircularProgressManager | DialogManager | LoadingButtonManager;
declare global {
const route: typeof router;
let app: {
components: Record<string, ComponentManager>
events: Record<string, Event>,
locale: string,
modules: OpenSTAManager.Modules,