mirror of
https://github.com/codex-team/editor.js
synced 2024-05-18 14:26:48 +02:00
5125f015dc
* Move popover types to separate file * tmp * open top * Fix bug with keyboard navigation * Fix bug with scroll * Fix mobile * Add popover header class * Display nested items on mobile * Refactor history * Fix positioning on desktop * Fix tests * Fix child popover indent left * Fix ts errors in popover files * Move files * Rename cn to bem * Clarify comments and rename method * Refactor popover css classes * Rename cls to css * Split popover desktop and mobile classes * Add ability to open popover to the left if not enough space to open to the right * Add nested popover test * Add popover test for mobile screens * Fix tests * Add union type for both popovers * Add global window resize event * Multiple fixes * Move nodes initialization to constructor * Rename handleShowingNestedItems to showNestedItems * Replace WindowResize with EditorMobileLayoutToggled * New doze of fixes * Review fixes * Fixes * Fixes * Make each nested popover decide itself if it should open top * Update changelog * Update changelog * Update changelog
99 lines
2.2 KiB
TypeScript
99 lines
2.2 KiB
TypeScript
/**
|
|
* Common parameters for both types of popover items: with or without confirmation
|
|
*/
|
|
interface PopoverItemBase {
|
|
/**
|
|
* Displayed text
|
|
*/
|
|
title?: string;
|
|
|
|
/**
|
|
* Item icon to be appeared near a title
|
|
*/
|
|
icon?: string;
|
|
|
|
/**
|
|
* Additional displayed text
|
|
*/
|
|
secondaryLabel?: string;
|
|
|
|
/**
|
|
* True if item should be highlighted as active
|
|
*/
|
|
isActive?: boolean;
|
|
|
|
/**
|
|
* True if item should be disabled
|
|
*/
|
|
isDisabled?: boolean;
|
|
|
|
/**
|
|
* True if popover should close once item is activated
|
|
*/
|
|
closeOnActivate?: boolean;
|
|
|
|
/**
|
|
* Item name
|
|
* Used in data attributes needed for cypress tests
|
|
*/
|
|
name?: string;
|
|
|
|
/**
|
|
* Defines whether item should toggle on click.
|
|
* Can be represented as boolean value or a string key.
|
|
* In case of string, works like radio buttons group and highlights as inactive any other item that has same toggle key value.
|
|
*/
|
|
toggle?: boolean | string;
|
|
}
|
|
|
|
/**
|
|
* Represents popover item with confirmation state configuration
|
|
*/
|
|
export interface PopoverItemWithConfirmation extends PopoverItemBase {
|
|
/**
|
|
* Popover item parameters that should be applied on item activation.
|
|
* May be used to ask user for confirmation before executing popover item activation handler.
|
|
*/
|
|
confirmation: PopoverItem;
|
|
|
|
onActivate?: never;
|
|
}
|
|
|
|
/**
|
|
* Represents popover item without confirmation state configuration
|
|
*/
|
|
export interface PopoverItemWithoutConfirmation extends PopoverItemBase {
|
|
confirmation?: never;
|
|
|
|
/**
|
|
* Popover item activation handler
|
|
*
|
|
* @param item - activated item
|
|
* @param event - event that initiated item activation
|
|
*/
|
|
onActivate: (item: PopoverItem, event?: PointerEvent) => void;
|
|
|
|
}
|
|
|
|
|
|
/**
|
|
* Represents popover item with children (nested popover items)
|
|
*/
|
|
export interface PopoverItemWithChildren extends PopoverItemBase {
|
|
confirmation?: never;
|
|
onActivate?: never;
|
|
|
|
/**
|
|
* Items of nested popover that should be open on the current item hover/click (depending on platform)
|
|
*/
|
|
children?: {
|
|
items: PopoverItem[]
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Represents single popover item
|
|
*/
|
|
export type PopoverItem = PopoverItemWithConfirmation | PopoverItemWithoutConfirmation | PopoverItemWithChildren
|
|
|