Foundational Primitives
The base elements of the PPT component library.
Base
All PPT components inherit from the Base Component, which provides foundational styling, interactivity flags, and resize observation.
Base Parameters
Text content to display inside the panel.
Generic Base Implementation
I am a generic PPT component (technically a ppt-text-panel). I inherit all base behaviors.
Try toggling my interactive state or dragging my bottom right corner to resize me.
View Source Code
<ppt-container>
<ppt-text-panel interactive="true" resizable="true">
<h3 style="margin-top: 0;">Generic Base Implementation</h3>
<p>I am a generic PPT component (technically a ppt-text-panel). I inherit all base behaviors.</p>
<p>Try toggling my interactive state or dragging my bottom right corner to resize me.</p>
</ppt-text-panel>
</ppt-container>Title
A lightweight, dedicated component for rendering semantic titles. It automatically scales and supports dynamic text.
Parameters
Controls whether the component responds to mouse/touch events. Disabling this applies 60% opacity and pointer-events: none.
The text displayed as the title.
View Source Code
<ppt-container>
<ppt-title text="Hello World!"></ppt-title>
</ppt-container>Panel
A dedicated component for holding textual content. Its layout and sizing are determined by its parent container, but it can also be configured to float as a draggable overlay.
Parameters (Primary Panel)
Text content to display inside the panel.
I am a responsive sibling element. When the primary panel floats, I will expand to fill all remaining space!
View Source Code
<ppt-container>
<ppt-text-panel resizable="true" style="width: 50%;">
<span>I am the primary editable panel.</span>
</ppt-text-panel>
</ppt-container>