@jupyter/web-components
Version:
A component library for building extensions in Jupyter frontends.
57 lines (56 loc) • 1.72 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 } from '@microsoft/fast-element';
import { NumberField, numberFieldTemplate as template } from '@microsoft/fast-foundation';
import { numberFieldStyles as styles } from './number-field.styles.js';
/**
* Number field class
*
* @public
* @tagname jp-number-field
*/
class JupyterNumberField extends NumberField {
constructor() {
super(...arguments);
/**
* The appearance of the element.
*
* @public
* @remarks
* HTML Attribute: appearance
*/
this.appearance = 'outline';
}
}
__decorate([
attr
], JupyterNumberField.prototype, "appearance", void 0);
/**
* A function that returns a {@link @microsoft/fast-foundation#NumberField} registration for configuring the component with a DesignSystem.
* Implements {@link @microsoft/fast-foundation#numberFieldTemplate}
*
*
* @public
* @remarks
* Generates HTML Element: `<jp-number-field>`
*
* {@link https://developer.mozilla.org/en-US/docs/Web/API/ShadowRoot/delegatesFocus | delegatesFocus}
*/
export const jpNumberField = JupyterNumberField.compose({
baseName: 'number-field',
baseClass: NumberField,
styles,
template,
shadowOptions: {
delegatesFocus: true
},
stepDownGlyph: /* html */ `
<span class="step-down-glyph" part="step-down-glyph"></span>
`,
stepUpGlyph: /* html */ `
<span class="step-up-glyph" part="step-up-glyph"></span>
`
});
export { JupyterNumberField as NumberField, styles as numberFieldStyles };