createTitleArea(parent: HTMLElement): HTMLElement {
const titleContainer = append(parent, $('div'));
const titleLabel = append(titleContainer, $('span'));
titleLabel.id = 'myPart.title';
titleLabel.innerHTML = 'Title';
return titleContainer;
}
createContentArea(parent: HTMLElement): HTMLElement {
const contentContainer = append(parent, $('div'));
const contentSpan = append(contentContainer, $('span'));
contentSpan.id = 'myPart.content';
contentSpan.innerHTML = 'Content';
return contentContainer;
}
constructor(container: HTMLElement, options: IBaseDropdownOptions) {
super();
this._element = append(container, $('.monaco-dropdown'));
this._label = append(this._element, $('.dropdown-label'));
let labelRenderer = options.labelRenderer;
if (!labelRenderer) {
labelRenderer = (container: HTMLElement): IDisposable | null => {
container.textContent = options.label || '';
return null;
};
}
for (const event of [EventType.CLICK, EventType.MOUSE_DOWN, GestureEventType.Tap]) {
this._register(addDisposableListener(this._label, event, e => EventHelper.stop(e, true))); // prevent default click behaviour to trigger
}
for (const event of [EventType.MOUSE_DOWN, GestureEventType.Tap]) {
this._register(addDisposableListener(this._label, event, e => {
if (e instanceof MouseEvent && e.detail > 1) {
return; // prevent multiple clicks to open multiple context menus (https://github.com/Microsoft/vscode/issues/41363)
}
if (this.visible) {
this.hide();
} else {
this.show();
}
}));
}
this._register(addDisposableListener(this._label, EventType.KEY_UP, e => {
const event = new StandardKeyboardEvent(e);
if (event.equals(KeyCode.Enter) || event.equals(KeyCode.Space)) {
EventHelper.stop(e, true); // https://github.com/Microsoft/vscode/issues/57997
if (this.visible) {
this.hide();
} else {
this.show();
}
}
}));
const cleanupFn = labelRenderer(this._label);
if (cleanupFn) {
this._register(cleanupFn);
}
Gesture.addTarget(this._label);
}
function renderDashboardInsights(onDetailsToggle: Function, contributionReader: ContributionReader, container: HTMLElement): boolean {
let insights = contributionReader.dashboardInsights();
if (!insights || !insights.length) {
return false;
}
const details = $('details', { open: true, ontoggle: onDetailsToggle },
$('summary', null, localize('insights', "Dashboard Insights ({0})", insights.length)),
$('table', null,
$('tr', null,
$('th', null, localize('insightId', "Id")),
$('th', null, localize('name', "Name")),
$('th', null, localize('insight condition', "When"))
),
...insights.map(insight => $('tr', null,
$('td', null, $('code', null, insight.id)),
$('td', null, insight.contrib.name ? insight.contrib.name : insight.id),
$('td', null, insight.contrib.when),
))
)
);
append(container, details);
return true;
}
function renderDashboardTabs(onDetailsToggle: Function, contributionReader: ContributionReader, container: HTMLElement): boolean {
let tabs = contributionReader.dashboardTabs();
if (!tabs || !tabs.length) {
return false;
}
const details = $('details', { open: true, ontoggle: onDetailsToggle },
$('summary', null, localize('tabs', "Dashboard Tabs ({0})", tabs.length)),
$('table', null,
$('tr', null,
$('th', null, localize('tabId', "Id")),
$('th', null, localize('tabTitle', "Title")),
$('th', null, localize('tabDescription', "Description"))
),
...tabs.map(tab => $('tr', null,
$('td', null, $('code', null, tab.id)),
$('td', null, tab.title ? tab.title : tab.id),
$('td', null, tab.description),
))
)
);
append(container, details);
return true;
}
setup(function () {
gridview = new GridView();
const container = $('.container');
container.style.position = 'absolute';
container.style.width = `${200}px`;
container.style.height = `${200}px`;
container.appendChild(gridview.element);
});
const labelRenderer: ILabelRenderer = (el: HTMLElement): IDisposable | null => {
this.element = append(el, $('a.action-label.icon'));
addClasses(this.element, this.clazz);
this.element.tabIndex = 0;
this.element.setAttribute('role', 'button');
this.element.setAttribute('aria-haspopup', 'true');
this.element.title = this._action.label || '';
return null;
};
/**
* Returns a row either by creating a new one or reusing
* a previously released row which shares the same templateId.
*/
alloc(templateId: string): IRow {
let result = this.getTemplateCache(templateId).pop();
if (!result) {
const domNode = $('.monaco-list-row');
const renderer = this.renderers[templateId];
const templateData = renderer.renderTemplate(domNode);
result = { domNode, templateId, templateData };
}
return result;
}
constructor(container: HTMLElement, options?: ICountBadgeOptions) {
this.options = options || Object.create(null);
mixin(this.options, defaultOpts, false);
this.badgeBackground = this.options.badgeBackground;
this.badgeForeground = this.options.badgeForeground;
this.badgeBorder = this.options.badgeBorder;
this.element = append(container, $('.monaco-count-badge'));
this.titleFormat = this.options.titleFormat || '';
this.setCount(this.options.count || 0);
}
constructor(container: HTMLElement, options?: IIconLabelCreationOptions) {
this.domNode = new FastLabelNode(dom.append(container, dom.$('.monaco-icon-label')));
this.labelDescriptionContainer = new FastLabelNode(dom.append(this.domNode.element, dom.$('.monaco-icon-label-description-container')));
if (options && options.supportHighlights) {
this.labelNode = new HighlightedLabel(dom.append(this.labelDescriptionContainer.element, dom.$('a.label-name')));
} else {
this.labelNode = new FastLabelNode(dom.append(this.labelDescriptionContainer.element, dom.$('a.label-name')));
}
if (options && options.supportDescriptionHighlights) {
this.descriptionNodeFactory = () => new HighlightedLabel(dom.append(this.labelDescriptionContainer.element, dom.$('span.label-description')));
} else {
this.descriptionNodeFactory = () => new FastLabelNode(dom.append(this.labelDescriptionContainer.element, dom.$('span.label-description')));
}
}
