🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more
Socket
DemoInstallSign in
Socket

@vaadin/split-layout

Package Overview
Dependencies
Maintainers
12
Versions
471
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@vaadin/split-layout - npm Package Compare versions

Comparing version

to
25.0.0-alpha1

19

package.json
{
"name": "@vaadin/split-layout",
"version": "24.8.0-alpha9",
"version": "25.0.0-alpha1",
"publishConfig": {

@@ -34,17 +34,14 @@ "access": "public"

"web-components",
"web-component",
"polymer"
"web-component"
],
"dependencies": {
"@open-wc/dedupe-mixin": "^1.3.0",
"@polymer/polymer": "^3.0.0",
"@vaadin/component-base": "24.8.0-alpha9",
"@vaadin/vaadin-lumo-styles": "24.8.0-alpha9",
"@vaadin/vaadin-material-styles": "24.8.0-alpha9",
"@vaadin/vaadin-themable-mixin": "24.8.0-alpha9",
"@vaadin/component-base": "25.0.0-alpha1",
"@vaadin/vaadin-lumo-styles": "25.0.0-alpha1",
"@vaadin/vaadin-themable-mixin": "25.0.0-alpha1",
"lit": "^3.0.0"
},
"devDependencies": {
"@vaadin/chai-plugins": "24.8.0-alpha9",
"@vaadin/test-runner-commands": "24.8.0-alpha9",
"@vaadin/chai-plugins": "25.0.0-alpha1",
"@vaadin/test-runner-commands": "25.0.0-alpha1",
"@vaadin/testing-helpers": "^1.1.0",

@@ -57,3 +54,3 @@ "sinon": "^18.0.0"

],
"gitHead": "4de3809275ddfd733b0d13fd02af8faf73eb6770"
"gitHead": "b8c22a4a0c64156210d0daac96b43ae4e5526d49"
}

@@ -38,25 +38,2 @@ # @vaadin/split-layout

## Themes
Vaadin components come with two built-in [themes](https://vaadin.com/docs/latest/styling), Lumo and Material.
The [main entrypoint](https://github.com/vaadin/web-components/blob/main/packages/split-layout/vaadin-split-layout.js) of the package uses the Lumo theme.
To use the Material theme, import the component from the `theme/material` folder:
```js
import '@vaadin/split-layout/theme/material/vaadin-split-layout.js';
```
You can also import the Lumo version of the component explicitly:
```js
import '@vaadin/split-layout/theme/lumo/vaadin-split-layout.js';
```
Finally, you can import the un-themed component from the `src` folder to get a minimal starting point:
```js
import '@vaadin/split-layout/src/vaadin-split-layout.js';
```
## Contributing

@@ -63,0 +40,0 @@

@@ -6,11 +6,10 @@ /**

*/
import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
import { html, LitElement } from 'lit';
import { defineCustomElement } from '@vaadin/component-base/src/define.js';
import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
import { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
import { PolylitMixin } from '@vaadin/component-base/src/polylit-mixin.js';
import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
import { SplitLayoutMixin } from './vaadin-split-layout-mixin.js';
import { splitLayoutStyles } from './vaadin-split-layout-styles.js';
registerStyles('vaadin-split-layout', splitLayoutStyles, { moduleId: 'vaadin-split-layout-styles' });
/**

@@ -160,4 +159,13 @@ * `<vaadin-split-layout>` is a Web Component implementing a split layout for two

*/
class SplitLayout extends SplitLayoutMixin(ElementMixin(ThemableMixin(PolymerElement))) {
static get template() {
class SplitLayout extends SplitLayoutMixin(ElementMixin(ThemableMixin(PolylitMixin(LitElement)))) {
static get is() {
return 'vaadin-split-layout';
}
static get styles() {
return splitLayoutStyles;
}
/** @protected */
render() {
return html`

@@ -172,6 +180,2 @@ <slot id="primary" name="primary"></slot>

static get is() {
return 'vaadin-split-layout';
}
/**

@@ -178,0 +182,0 @@ * Fired after dragging the splitter have ended.

{
"$schema": "https://json.schemastore.org/web-types",
"name": "@vaadin/split-layout",
"version": "24.8.0-alpha9",
"version": "25.0.0-alpha1",
"description-markup": "markdown",

@@ -6,0 +6,0 @@ "contributions": {

{
"$schema": "https://json.schemastore.org/web-types",
"name": "@vaadin/split-layout",
"version": "24.8.0-alpha9",
"version": "25.0.0-alpha1",
"description-markup": "markdown",

@@ -6,0 +6,0 @@ "framework": "lit",