@jupyter/web-components
Version:
A component library for building extensions in Jupyter frontends.
59 lines (58 loc) • 1.47 kB
JavaScript
// Copyright (c) Jupyter Development Team.
// Copyright (c) Microsoft Corporation.
// Distributed under the terms of the Modified BSD License.
import { __decorate } from "tslib";
import { attr, html, when } from '@microsoft/fast-element';
import { Avatar, avatarTemplate as template } from '@microsoft/fast-foundation';
import { avatarStyles as styles } from './avatar.styles.js';
/**
* Jupyter Avatar Class
*
* @public
* @tagname jp-avatar
*/
class JupyterAvatar extends Avatar {
}
__decorate([
attr({ attribute: 'src' })
], JupyterAvatar.prototype, "imgSrc", void 0);
__decorate([
attr
], JupyterAvatar.prototype, "alt", void 0);
/**
* The Jupyter Avatar Template for Images
* @public
*
*/
export const imgTemplate = html `
${when(x => x.imgSrc, html `
<img
src="${x => x.imgSrc}"
alt="${x => x.alt}"
slot="media"
class="media"
part="media"
/>
`)}
`;
/**
* A function that returns a {@link @microsoft/fast-foundation#Avatar} registration for configuring the component with a DesignSystem.
* {@link @microsoft/fast-foundation#avatarTemplate}
*
*
* @public
* @remarks
* Generates HTML Element: `<jp-avatar>`
*/
export const jpAvatar = JupyterAvatar.compose({
baseName: 'avatar',
baseClass: Avatar,
template,
styles,
media: imgTemplate,
shadowOptions: {
delegatesFocus: true
}
});
export { JupyterAvatar as Avatar };
export { styles as avatarStyles };