Files
blockly/core/toolbox/separator.ts
Maribeth Bottorff 037eb59b89 chore: Lint TsDoc. (#6353)
* chore: add linting for tsdoc

* chore: don't require types on return

* chore: remove redundant fileoverview from ts

* chore: change return to returns and add some newlines

* chore: remove license tag

* chore: don't require params/return docs

* chore: remove spurious struct tags

* Revert "chore: change return to returns and add some newlines"

This reverts commit d6d8656a45.

* chore: don't auto-add param names

* chore: disable require-param bc it breaks on this

* return to returns and add line breaks

* chore: configure additional jsdoc rules

* chore: run format

* Revert "chore: remove license tag"

This reverts commit 173455588a.

* chore: allow license tag format

* chore: only require jsdoc on exported items

* chore: add missing jsdoc or silence where needed

* chore: run format

* chore: lint fixes
2022-08-23 14:27:22 -07:00

105 lines
2.5 KiB
TypeScript

/**
* @license
* Copyright 2020 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
/**
* A separator used for separating toolbox categories.
*
* @class
*/
import * as goog from '../../closure/goog/goog.js';
goog.declareModuleId('Blockly.ToolboxSeparator');
import * as Css from '../css.js';
import type {IToolbox} from '../interfaces/i_toolbox.js';
import * as registry from '../registry.js';
import * as dom from '../utils/dom.js';
import type * as toolbox from '../utils/toolbox.js';
import {ToolboxItem} from './toolbox_item.js';
/**
* Class for a toolbox separator. This is the thin visual line that appears on
* the toolbox. This item is not interactable.
*
* @alias Blockly.ToolboxSeparator
*/
export class ToolboxSeparator extends ToolboxItem {
/** Name used for registering a toolbox separator. */
static registrationName = 'sep';
/** All the CSS class names that are used to create a separator. */
protected cssConfig_: CssConfig = {'container': 'blocklyTreeSeparator'};
private htmlDiv_: HTMLDivElement|null = null;
/**
* @param separatorDef The information needed to create a separator.
* @param toolbox The parent toolbox for the separator.
*/
constructor(separatorDef: toolbox.SeparatorInfo, toolbox: IToolbox) {
super(separatorDef, toolbox);
const cssConfig =
separatorDef['cssconfig'] || (separatorDef as any)['cssConfig'];
Object.assign(this.cssConfig_, cssConfig);
}
override init() {
this.createDom_();
}
/**
* Creates the DOM for a separator.
*
* @returns The parent element for the separator.
*/
protected createDom_(): HTMLDivElement {
const container = (document.createElement('div'));
dom.addClass(container, this.cssConfig_['container']!);
this.htmlDiv_ = container;
return container;
}
override getDiv() {
return this.htmlDiv_ as HTMLDivElement;
}
override dispose() {
dom.removeNode(this.htmlDiv_ as HTMLDivElement);
}
}
export namespace ToolboxSeparator {
export interface CssConfig {
container: string|undefined;
}
}
export type CssConfig = ToolboxSeparator.CssConfig;
/** CSS for Toolbox. See css.js for use. */
Css.register(`
.blocklyTreeSeparator {
border-bottom: solid #e5e5e5 1px;
height: 0;
margin: 5px 0;
}
.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
border-right: solid #e5e5e5 1px;
border-bottom: none;
height: auto;
margin: 0 5px 0 5px;
padding: 5px 0;
width: 0;
}
`);
registry.register(
registry.Type.TOOLBOX_ITEM, ToolboxSeparator.registrationName,
ToolboxSeparator);