com.vaadin.flow.component.splitlayout.GeneratedVaadinSplitLayout Maven / Gradle / Ivy
/**
* Copyright (C) 2000-2024 Vaadin Ltd
*
* This program is available under Vaadin Commercial License and Service Terms.
*
* See for the full
* license.
*/
package com.vaadin.flow.component.splitlayout;
import java.util.stream.Collectors;
import java.util.stream.Stream;
import com.vaadin.flow.component.ClickNotifier;
import com.vaadin.flow.component.Component;
import com.vaadin.flow.component.ComponentEvent;
import com.vaadin.flow.component.ComponentEventListener;
import com.vaadin.flow.component.DomEvent;
import com.vaadin.flow.component.HasStyle;
import com.vaadin.flow.component.HasTheme;
import com.vaadin.flow.component.Tag;
import com.vaadin.flow.component.dependency.JsModule;
import com.vaadin.flow.component.dependency.NpmPackage;
import com.vaadin.flow.dom.Element;
import com.vaadin.flow.shared.Registration;
/**
*
* Description copied from corresponding location in WebComponent:
*
*
* {@code } is a Web Component implementing a split layout
* for two content elements with a draggable splitter between them.
*
*
* <vaadin-split-layout> <div>First content element</div>
* <div>Second content element</div> </vaadin-split-layout>
*
* Horizontal and Vertical Layouts
*
* By default, the split's orientation is horizontal, meaning that the content
* elements are positioned side by side in a flex container with a horizontal
* layout.
*
*
* You can change the split mode to vertical by setting the {@code orientation}
* attribute to {@code "vertical"}:
*
*
* <vaadin-split-layout orientation="vertical">
* <div>Content on the top</div> <div>Content on the
* bottom</div> </vaadin-split-layout>
*
* Layouts Combination
*
* For the layout contents, we usually use {@code
} elements in the
* examples, although you can use any other elements as well.
*
*
* For instance, in order to have a nested vertical split layout inside a
* horizontal one, you can include {@code } as a content
* element inside another split layout:
*
*
* <vaadin-split-layout> <div>First content element</div>
* <vaadin-split-layout orientation="vertical">
* <div>Second content element</div> <div>Third content
* element</div> </vaadin-split-layout> </vaadin-split-layout>
*
*
* You can also trigger the vertical mode in JavaScript by setting the property:
* {@code splitLayout.orientation = "vertical";}.
*
* Split Layout Element Height
*
* {@code } element itself is a flex container. It does not
* inherit the parent height by default, but rather sets its height depending on
* the content.
*
*
* You can use CSS to set the fixed height for the split layout, as usual with
* any block element:
*
*
* <vaadin-split-layout style="height: 200px;"> <div>First
* content element</div> <div>Second content element</div>
* </vaadin-split-layout>
*
*
* It is possible to define percentage height as well. Note that you have to set
* the parent height in order to make percentages work correctly. In the
* following example, the {@code
} is resized to fill the entire viewport,
* and the {@code } element is set to take 100% height of
* the {@code }:
*
*
* <body style="height: 100vh; margin: 0;">
* <vaadin-split-layout style="height: 100%;">
* <div>First</div> <div>Second</div>
* </vaadin-split-layout> </body>
*
*
* Alternatively, you can use a flexbox layout to make
* {@code } fill up the parent:
*
*
* <body style="height: 100vh; margin: 0; display: flex;">
* <vaadin-split-layout style="flex: 1;">
* <div>First</div> <div>Second</div>
* </vaadin-split-layout> </body>
*
* Initial Splitter Position
*
* The initial splitter position is determined from the sizes of the content
* elements inside the split layout. Therefore, changing {@code width} on the
* content elements affects the initial splitter position for the horizontal
* layouts, while {@code height} affects the vertical ones.
*
*
* Note that when the total size of the content elements does not fit the
* layout, the content elements are scaled proportionally.
*
*
* When setting initial sizes with relative units, such as percentages, it is
* recommended to assign the size for both content elements:
*
*
* <vaadin-split-layout> <div style="width: 75%;">Three
* fourths</div> <div style="width: 25%;">One
* fourth</div> </vaadin-split-layout>
*
* Size Limits
*
* The {@code min-width}/{@code min-height}, and {@code max-width}/
* {@code max-height} CSS size values for the content elements are respected and
* used to limit the splitter position when it is dragged.
*
*
* It is preferred to set the limits only for a single content element, in order
* to avoid size conflicts:
*
*
* <vaadin-split-layout> <div style="min-width: 50px; max-width:
* 150px;">First</div> <div>Second</div>
* </vaadin-split-layout>
*
* Resize Notification
*
* This element implements {@code IronResizableBehavior} to notify the nested
* resizables when the splitter is dragged. In order to define a resizable and
* receive that notification in a nested element, include
* {@code IronResizableBehavior} and listen for the {@code iron-resize} event.
*
* Styling
*
* The following shadow DOM parts are available for styling:
*
*
*
*
* Part name
* Description
* Theme for Element
*
*
*
* {@code splitter}
* Split element
* vaadin-split-layout
*
*
* {@code handle}
* The handle of the splitter
* vaadin-split-layout
*
*
*
*
* See
* ThemableMixin
* – how to apply styles for shadow parts
*
*
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@Deprecated
@Tag("vaadin-split-layout")
@NpmPackage(value = "@vaadin/polymer-legacy-adapter", version = "23.5.2")
@JsModule("@vaadin/polymer-legacy-adapter/style-modules.js")
@JsModule("@vaadin/split-layout/src/vaadin-split-layout.js")
public abstract class GeneratedVaadinSplitLayout>
extends Component implements HasStyle, ClickNotifier, HasTheme {
/**
* Adds theme variants to the component.
*
* @param variants
* theme variants to add
*
* @deprecated since v23.3, generated classes will be removed in v24. Use
* {@link SplitLayout#addThemeVariants} instead.
*/
@Deprecated
public void addThemeVariants(SplitLayoutVariant... variants) {
getThemeNames().addAll(
Stream.of(variants).map(SplitLayoutVariant::getVariantName)
.collect(Collectors.toList()));
}
/**
* Removes theme variants from the component.
*
* @param variants
* theme variants to remove
*
* @deprecated since v23.3, generated classes will be removed in v24. Use
* {@link SplitLayout#removeThemeVariants} instead.
*/
@Deprecated
public void removeThemeVariants(SplitLayoutVariant... variants) {
getThemeNames().removeAll(
Stream.of(variants).map(SplitLayoutVariant::getVariantName)
.collect(Collectors.toList()));
}
/**
*
* Description copied from corresponding location in WebComponent:
*
*
* The split layout's orientation. Possible values are:
* {@code horizontal|vertical}.
*
* This property is not synchronized automatically from the client side, so
* the returned value may not be the same as in client side.
*
*
* @return the {@code orientation} property from the webcomponent
*
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@Deprecated
protected String getOrientationString() {
return getElement().getProperty("orientation");
}
/**
*
* Description copied from corresponding location in WebComponent:
*
*
* The split layout's orientation. Possible values are:
* {@code horizontal|vertical}.
*
*
* @param orientation
* the String value to set
*
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@Deprecated
protected void setOrientation(String orientation) {
getElement().setProperty("orientation",
orientation == null ? "" : orientation);
}
/**
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@DomEvent("iron-resize")
@Deprecated
public static class IronResizeEvent>
extends ComponentEvent {
public IronResizeEvent(R source, boolean fromClient) {
super(source, fromClient);
}
}
/**
* Adds a listener for {@code iron-resize} events fired by the webcomponent.
*
* @param listener
* the listener
* @return a {@link Registration} for removing the event listener
*
* @deprecated Since 23.2, this API is deprecated, generated classes will be
* removed in v24.
*/
@SuppressWarnings({ "rawtypes", "unchecked" })
@Deprecated
protected Registration addIronResizeListener(
ComponentEventListener> listener) {
return addListener(IronResizeEvent.class,
(ComponentEventListener) listener);
}
/**
* @deprecated since v23.3, generated classes will be removed in v24. Use
* {@link SplitLayout.SplitterDragendEvent} instead.
*/
@Deprecated
@DomEvent("splitter-dragend")
public static class SplitterDragendEvent>
extends ComponentEvent {
public SplitterDragendEvent(R source, boolean fromClient) {
super(source, fromClient);
}
}
/**
* Adds a listener for {@code splitter-dragend} events fired by the
* webcomponent.
*
* @param listener
* the listener
* @return a {@link Registration} for removing the event listener
*
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@Deprecated
@SuppressWarnings({ "rawtypes", "unchecked" })
protected Registration addSplitterDragendListener(
ComponentEventListener> listener) {
return addListener(SplitLayout.SplitterDragendEvent.class,
(ComponentEventListener) listener);
}
/**
* Adds the given components as children of this component at the slot
* 'primary'.
*
* @param components
* The components to add.
* @see MDN
* page about slots
* @see Spec
* website about slots
*
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@Deprecated
protected void addToPrimary(Component... components) {
for (Component component : components) {
component.getElement().setAttribute("slot", "primary");
getElement().appendChild(component.getElement());
}
}
/**
* Adds the given components as children of this component at the slot
* 'secondary'.
*
* @param components
* The components to add.
* @see MDN
* page about slots
* @see Spec
* website about slots
*
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@Deprecated
protected void addToSecondary(Component... components) {
for (Component component : components) {
component.getElement().setAttribute("slot", "secondary");
getElement().appendChild(component.getElement());
}
}
/**
* Removes the given child components from this component.
*
* @param components
* The components to remove.
* @throws IllegalArgumentException
* if any of the components is not a child of this component.
*
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@Deprecated
protected void remove(Component... components) {
for (Component component : components) {
if (getElement().equals(component.getElement().getParent())) {
component.getElement().removeAttribute("slot");
getElement().removeChild(component.getElement());
} else {
throw new IllegalArgumentException("The given component ("
+ component + ") is not a child of this component");
}
}
}
/**
* Removes all contents from this component, this includes child components,
* text content as well as child elements that have been added directly to
* this component using the {@link Element} API.
*
* @deprecated since v23.3, generated classes will be removed in v24.
*/
@Deprecated
protected void removeAll() {
getElement().getChildren()
.forEach(child -> child.removeAttribute("slot"));
getElement().removeAllChildren();
}
}
© 2015 - 2024 Weber Informatics LLC | Privacy Policy