Compare commits

...

7 commits

Author SHA1 Message Date
Mizah a858ee31c6 Added doc comment to alert()
Some checks failed
Check SPDX-License-Identifier / check-spdx-license-id (push) Has been cancelled
Check copyright year / check_copyright_year (push) Has been cancelled
Publish Docker image (develop) / Build (linux/amd64) (push) Has been cancelled
Publish Docker image (develop) / Build (linux/arm64) (push) Has been cancelled
Dockle / dockle (push) Has been cancelled
Lint / pnpm_install (push) Has been cancelled
Storybook / build (push) Has been cancelled
Test (frontend) / vitest (20.16.0) (push) Has been cancelled
Test (frontend) / e2e (chrome, 20.16.0) (push) Has been cancelled
Test (production install and build) / production (20.16.0) (push) Has been cancelled
Publish Docker image (develop) / merge (push) Has been cancelled
Lint / lint (backend) (push) Has been cancelled
Lint / lint (frontend) (push) Has been cancelled
Lint / lint (frontend-embed) (push) Has been cancelled
Lint / lint (frontend-shared) (push) Has been cancelled
Lint / lint (misskey-bubble-game) (push) Has been cancelled
Lint / lint (misskey-js) (push) Has been cancelled
Lint / lint (misskey-reversi) (push) Has been cancelled
Lint / lint (sw) (push) Has been cancelled
Lint / typecheck (backend) (push) Has been cancelled
Lint / typecheck (misskey-js) (push) Has been cancelled
Lint / typecheck (sw) (push) Has been cancelled
2024-11-17 14:34:54 +02:00
Mizah 0bd7ed8191 Added doc comment to toast() 2024-11-17 14:34:47 +02:00
Mizah ee574ae154 Added doc comment to pageWindow 2024-11-17 14:34:39 +02:00
Mizah a505f36252 Added doc comment to popup 2024-11-17 14:34:31 +02:00
Mizah a516383c66 Added internal comments to popup() 2024-11-17 14:34:21 +02:00
Mizah 1613dafc39 Added docs to z-index generator. 2024-11-17 14:23:44 +02:00
Mizah 8457fa9b3b Added docs to popup list and popup id counter. 2024-11-17 14:23:31 +02:00

View file

@ -136,7 +136,16 @@ export function promiseDialog<T extends Promise<any>>(
return promise; return promise;
} }
/**
* Counter for generating unique popup IDs.
* @type {number}
*/
let popupIdCount = 0; let popupIdCount = 0;
/**
* A reactive list of the currently opened popups. This is used in a Vue component
* in a v-for loop to render the popups.
*/
export const popups = ref<{ export const popups = ref<{
id: number; id: number;
component: Component; component: Component;
@ -144,12 +153,23 @@ export const popups = ref<{
events: Record<string, any>; events: Record<string, any>;
}[]>([]); }[]>([]);
/**
* An object containing z-index values for different priority levels.
*/
const zIndexes = { const zIndexes = {
veryLow: 500000, veryLow: 500000,
low: 1000000, low: 1000000,
middle: 2000000, middle: 2000000,
high: 3000000, high: 3000000,
}; };
/**
* Claims a z-index value for a given priority level.
* Increments the z-index value for the specified priority by 100 and returns the new value.
*
* @param {keyof typeof zIndexes} [priority='low'] - The priority level for which to claim a z-index.
* @returns {number} The new z-index value for the specified priority.
*/
export function claimZIndex(priority: keyof typeof zIndexes = 'low'): number { export function claimZIndex(priority: keyof typeof zIndexes = 'low'): number {
zIndexes[priority] += 100; zIndexes[priority] += 100;
return zIndexes[priority]; return zIndexes[priority];
@ -177,6 +197,15 @@ type EmitsExtractor<T> = {
[K in keyof T as K extends `onVnode${string}` ? never : K extends `on${infer E}` ? Uncapitalize<E> : K extends string ? never : K]: T[K]; [K in keyof T as K extends `onVnode${string}` ? never : K extends `on${infer E}` ? Uncapitalize<E> : K extends string ? never : K]: T[K];
}; };
/**
* Opens a popup with the specified component, props, and events.
*
* @template T - The type of the component.
* @param {T} component - The Vue component to display in the popup.
* @param {ComponentProps<T>} props - The props to pass to the component.
* @param {ComponentEmit<T>} [events={}] - The events to bind to the component.
* @returns {{ dispose: () => void }} An object containing a dispose function to close the popup.
*/
export function popup<T extends Component>( export function popup<T extends Component>(
component: T, component: T,
props: ComponentProps<T>, props: ComponentProps<T>,
@ -184,13 +213,18 @@ export function popup<T extends Component>(
): { dispose: () => void } { ): { dispose: () => void } {
markRaw(component); markRaw(component);
// Generate a unique ID for this popup.
const id = ++popupIdCount; const id = ++popupIdCount;
// On disposal, remove this popup from the list of open popups.
const dispose = () => { const dispose = () => {
// このsetTimeoutが無いと挙動がおかしくなる(autocompleteが閉じなくなる)。Vueのバグ // このsetTimeoutが無いと挙動がおかしくなる(autocompleteが閉じなくなる)。Vueのバグ
window.setTimeout(() => { window.setTimeout(() => {
popups.value = popups.value.filter(p => p.id !== id); popups.value = popups.value.filter(p => p.id !== id);
}, 0); }, 0);
}; };
// Bundle the component, props, and events into a state object.
const state = { const state = {
component, component,
props, props,
@ -198,13 +232,19 @@ export function popup<T extends Component>(
id, id,
}; };
// Add the popup to the list of open popups.
popups.value.push(state); popups.value.push(state);
// Return a function that can be called to close the popup.
return { return {
dispose, dispose,
}; };
} }
/**
* Open the page with the given path in a pop-up window.
* @param path The path of the page to open.
*/
export function pageWindow(path: string) { export function pageWindow(path: string) {
const { dispose } = popup(MkPageWindow, { const { dispose } = popup(MkPageWindow, {
initialPath: path, initialPath: path,
@ -213,6 +253,11 @@ export function pageWindow(path: string) {
}); });
} }
/**
* Displays a toast message to the user.
*
* @param {string} message - The message to display in the toast.
*/
export function toast(message: string) { export function toast(message: string) {
const { dispose } = popup(MkToast, { const { dispose } = popup(MkToast, {
message, message,
@ -221,6 +266,15 @@ export function toast(message: string) {
}); });
} }
/**
* Displays an alert dialog to the user.
*
* @param {Object} props - The properties for the alert dialog.
* @param {'error' | 'info' | 'success' | 'warning' | 'waiting' | 'question'} [props.type] - The type of the alert.
* @param {string} [props.title] - The title of the alert dialog.
* @param {string} [props.text] - The text content of the alert dialog.
* @returns {Promise<void>} A promise that resolves when the alert dialog is closed.
*/
export function alert(props: { export function alert(props: {
type?: 'error' | 'info' | 'success' | 'warning' | 'waiting' | 'question'; type?: 'error' | 'info' | 'success' | 'warning' | 'waiting' | 'question';
title?: string; title?: string;