Sliding Container

shadow

The wje-sliding-container page was auto-generated to keep API documentation coverage in sync with the current component set. Detailed usage and best-practice guidance will be expanded in the next content phase.

When to use

Use wje-sliding-container to compose stable page structure with clear visual and semantic hierarchy.

When not to use

Do not use layout components to handle business logic or application orchestration.

Accessibility

Preserve document semantics (header, main, aside, footer) and logical tab/focus order.

Best Practices

• Define mobile/desktop breakpoints first, then refine visual details.
• Prefer spacing tokens over ad-hoc margin/padding overrides.
• Test keyboard and screen reader behavior for overflow scenarios.

Attributes and Properties

addToHeight

Description	Sets the value of the 'add-to-height' attribute. This attribute is used to modify or adjust the height dynamically.
Attribute	add-to-height
Type	string
Default	0

animationDuration

Description	Gets the animation duration for an element. It retrieves the value of the 'animation-duration' attribute if present; otherwise, it defaults to '500'.
Attribute	animation-duration
Type	string
Default	500

animationEasing

Description	Sets the easing function for the animation.
Attribute	animation-easing
Type	string
Default	linear

direction

Description	Retrieves the direction attribute of the instance. If the direction attribute is not set, it defaults to 'right'.
Attribute	direction
Type	string
Default	right

hasOpacity

Description	Determines if the element has an 'has-opacity' attribute.
Attribute	has-opacity
Type	boolean
Default	false

maxHeight

Description	Sets the maximum height for the element.
Attribute	max-height
Type	string
Default	auto

maxWidth

Description	Sets the maximum width of an element by updating the 'max-width' attribute.
Attribute	max-width
Type	string
Default	auto

removeChildAfterClose

Description	Sets the value of the remove-child-after-close attribute. This attribute determines if a child element should be removed after a close operation.
Attribute	remove-child-after-close
Type	boolean｜string
Default	false

screenBreakPoint

Description	Retrieves the value of the 'screen-break-point' attribute.
Attribute	screen-break-point
Type	string
Default	-

trigger

Description	Retrieves the value of the 'trigger' attribute. If the attribute is not set, it defaults to 'sliding-container'.
Attribute	trigger
Type	string
Default	sliding-container

variant

Description	Sets the 'variant' attribute to the specified value.
Attribute	variant
Type	string
Default	in-place

Events

Name	Description
wje-sliding-container:beforeOpen	Emitted when the component opens.
wje-sliding-container:open	Emitted when the component is opened.
wje-sliding-container:beforeClose	Emitted when the component closes.
wje-sliding-container:afterClose	Emitted when the component closes.

Methods

open

Description	Opens the sliding container by performing necessary preparatory and transitional operations.
Signature	(e: Event) => Promise<void>

close

Description	Closes the sliding container and performs associated operations such as animations and event dispatches.
Signature	(e: Event) => Promise<void>

toggle

Description	Toggles the state between open and closed.
Signature	(e: Event) => Promise<void>

CSS Shadow Parts

Name	Description
``	Styles the element.

CSS Custom Properties

No CSS custom properties available for this component.

Slots

Name	Description
default	The default slot for the SlidingContainer.