Container

<ts-container> vv0.4.0

The ts-container component.

Open in Storybook for interactive demos.

Preview

<ts-container size="lg">Content</ts-container>

Properties

Property	Attribute	Type	Default	Description
padding	padding	boolean	true	Whether to apply horizontal padding.
size	size	"full" | "lg" | "md" | "sm" | "xl"	'lg'	The maximum width of the container.

Slots

Name	Description
*(default)*	Default slot for container content.

CSS Parts

Use ::part() to style internal elements:

Part	Description
base	The container element.

ts-container::part(base) {
  /* your custom styles */
}

Usage

HTML

<ts-container size="lg">Content</ts-container>

React

import { TsContainer } from '@tessera-ui/react';

<TsContainer padding size="lg">Content</TsContainer>