Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@vaadin/vaadin-list-box

Package Overview
Dependencies
Maintainers
19
Versions
250
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@vaadin/vaadin-list-box - npm Package Compare versions

Comparing version 22.0.0-alpha6 to 22.0.0-alpha7

53

package.json
{
"name": "@vaadin/vaadin-list-box",
"version": "22.0.0-alpha6",
"version": "22.0.0-alpha7",
"publishConfig": {
"access": "public"
},
"description": "vaadin-list-box",
"license": "Apache-2.0",
"repository": {
"type": "git",
"url": "https://github.com/vaadin/web-components.git",
"directory": "packages/vaadin-list-box"
},
"author": "Vaadin Ltd",
"homepage": "https://vaadin.com/components",
"bugs": {
"url": "https://github.com/vaadin/vaadin-list-box/issues"
},
"main": "vaadin-list-box.js",
"module": "vaadin-list-box.js",
"repository": "vaadin/vaadin-list-box",
"files": [
"src",
"theme",
"vaadin-*.d.ts",
"vaadin-*.js"
],
"keywords": [

@@ -15,32 +34,6 @@ "Vaadin",

],
"author": "Vaadin Ltd",
"license": "Apache-2.0",
"bugs": {
"url": "https://github.com/vaadin/vaadin-list-box/issues"
},
"homepage": "https://vaadin.com/components",
"files": [
"vaadin-*.d.ts",
"vaadin-*.js",
"src",
"theme"
],
"dependencies": {
"@polymer/polymer": "^3.0.0",
"@vaadin/vaadin-element-mixin": "^22.0.0-alpha6",
"@vaadin/vaadin-item": "^22.0.0-alpha6",
"@vaadin/vaadin-list-mixin": "^22.0.0-alpha6",
"@vaadin/vaadin-lumo-styles": "^22.0.0-alpha6",
"@vaadin/vaadin-material-styles": "^22.0.0-alpha6",
"@vaadin/vaadin-themable-mixin": "^22.0.0-alpha6"
"@vaadin/list-box": "22.0.0-alpha7"
},
"devDependencies": {
"@esm-bundle/chai": "^4.3.4",
"@vaadin/testing-helpers": "^0.3.0",
"sinon": "^9.2.1"
},
"publishConfig": {
"access": "public"
},
"gitHead": "4b136b1c7da8942960e7255f40c27859125b3a45"
"gitHead": "8e89419c6b44a1d225d5859e180d7b35e47ddb52"
}

@@ -1,82 +0,18 @@

import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
import { MultiSelectListMixin } from '@vaadin/vaadin-list-mixin/vaadin-multi-select-list-mixin.js';
import { ElementMixin } from '@vaadin/vaadin-element-mixin/vaadin-element-mixin.js';
/**
* Fired when the `items` property changes.
* @license
* Copyright (c) 2021 Vaadin Ltd.
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
*/
export type ListBoxItemsChangedEvent = CustomEvent<{ value: Array<Element> }>;
import { ListBox } from '@vaadin/list-box/src/vaadin-list-box.js';
/**
* Fired when the `selected` property changes.
* @deprecated Import `ListBox` from `@vaadin/list-box` instead.
*/
export type ListBoxSelectedChangedEvent = CustomEvent<{ value: number }>;
export type ListBoxElement = ListBox;
/**
* Fired when the `selectedValues` property changes.
* @deprecated Import `ListBox` from `@vaadin/list-box` instead.
*/
export type ListBoxSelectedValuesChangedEvent = CustomEvent<{ value: Array<number> }>;
export const ListBoxElement: typeof ListBox;
export interface ListBoxElementEventMap {
'items-changed': ListBoxItemsChangedEvent;
'selected-changed': ListBoxSelectedChangedEvent;
'selected-values-changed': ListBoxSelectedValuesChangedEvent;
}
export interface ListBoxEventMap extends HTMLElementEventMap, ListBoxElementEventMap {}
/**
* `<vaadin-list-box>` is a Web Component for creating menus.
*
* ```
* <vaadin-list-box selected="2">
* <vaadin-item>Item 1</vaadin-item>
* <vaadin-item>Item 2</vaadin-item>
* <vaadin-item>Item 3</vaadin-item>
* <vaadin-item>Item 4</vaadin-item>
* </vaadin-list-box>
* ```
*
* ### Styling
*
* The following shadow DOM parts are available for styling:
*
* Part name | Description
* ------------------|------------------------
* `items` | The items container
*
* See [Styling Components](https://vaadin.com/docs/latest/ds/customization/styling-components) documentation.
*
* @fires {CustomEvent} items-changed - Fired when the `items` property changes.
* @fires {CustomEvent} selected-changed - Fired when the `selected` property changes.
* @fires {CustomEvent} selected-values-changed - Fired when the `selectedValues` property changes.
*/
declare class ListBoxElement extends MultiSelectListMixin(ThemableMixin(ElementMixin(HTMLElement))) {
focused: Element | null;
readonly _scrollerElement: HTMLElement;
addEventListener<K extends keyof ListBoxEventMap>(
type: K,
listener: (this: ListBoxElement, ev: ListBoxEventMap[K]) => void,
options?: boolean | AddEventListenerOptions
): void;
removeEventListener<K extends keyof ListBoxEventMap>(
type: K,
listener: (this: ListBoxElement, ev: ListBoxEventMap[K]) => void,
options?: boolean | EventListenerOptions
): void;
}
declare global {
interface HTMLElementTagNameMap {
'vaadin-list-box': ListBoxElement;
}
}
export { ListBoxElement };
export * from '@vaadin/list-box/src/vaadin-list-box.js';

@@ -6,114 +6,9 @@ /**

*/
import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';
import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
import { MultiSelectListMixin } from '@vaadin/vaadin-list-mixin/vaadin-multi-select-list-mixin.js';
import { ElementMixin } from '@vaadin/vaadin-element-mixin/vaadin-element-mixin.js';
import { ListBox } from '@vaadin/list-box/src/vaadin-list-box.js';
/**
* `<vaadin-list-box>` is a Web Component for creating menus.
*
* ```
* <vaadin-list-box selected="2">
* <vaadin-item>Item 1</vaadin-item>
* <vaadin-item>Item 2</vaadin-item>
* <vaadin-item>Item 3</vaadin-item>
* <vaadin-item>Item 4</vaadin-item>
* </vaadin-list-box>
* ```
*
* ### Styling
*
* The following shadow DOM parts are available for styling:
*
* Part name | Description
* ------------------|------------------------
* `items` | The items container
*
* See [Styling Components](https://vaadin.com/docs/latest/ds/customization/styling-components) documentation.
*
* @fires {CustomEvent} items-changed - Fired when the `items` property changes.
* @fires {CustomEvent} selected-changed - Fired when the `selected` property changes.
* @fires {CustomEvent} selected-values-changed - Fired when the `selectedValues` property changes.
*
* @extends HTMLElement
* @mixes MultiSelectListMixin
* @mixes ThemableMixin
* @mixes ElementMixin
* @deprecated Import `ListBox` from `@vaadin/list-box` instead.
*/
class ListBoxElement extends ElementMixin(MultiSelectListMixin(ThemableMixin(PolymerElement))) {
static get template() {
return html`
<style>
:host {
display: flex;
}
export const ListBoxElement = ListBox;
:host([hidden]) {
display: none !important;
}
[part='items'] {
height: 100%;
width: 100%;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
</style>
<div part="items">
<slot></slot>
</div>
`;
}
static get is() {
return 'vaadin-list-box';
}
static get properties() {
return {
// We don't need to define this property since super default is vertical,
// but we don't want it to be modified, or be shown in the API docs.
/** @private */
orientation: {
readOnly: true
}
};
}
constructor() {
super();
/**
* @type {Element | null}
* @protected
*/
this.focused;
}
ready() {
super.ready();
this.setAttribute('role', 'list');
setTimeout(this._checkImport.bind(this), 2000);
}
/**
* @return {!HTMLElement}
* @protected
*/
get _scrollerElement() {
return this.shadowRoot.querySelector('[part="items"]');
}
/** @private */
_checkImport() {
var item = this.querySelector('vaadin-item');
if (item && !(item instanceof PolymerElement)) {
console.warn(`Make sure you have imported the vaadin-item element.`);
}
}
}
customElements.define(ListBoxElement.is, ListBoxElement);
export { ListBoxElement };
export * from '@vaadin/list-box/src/vaadin-list-box.js';

@@ -1,2 +0,1 @@

import './vaadin-list-box-styles.js';
import '../../src/vaadin-list-box.js';
import '@vaadin/list-box/theme/lumo/vaadin-list-box.js';

@@ -1,2 +0,1 @@

import './vaadin-list-box-styles.js';
import '../../src/vaadin-list-box.js';
import '@vaadin/list-box/theme/material/vaadin-list-box.js';
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc