# Plain Elements This is the documentation index for Plain Elements, an unstyled accessible UI primitives library built with TypeScript Web Components, Light DOM, and progressive enhancement. Plain Elements adds behavior to author-provided HTML without shipping styles or replacing markup. It is framework-independent, avoids Shadow DOM, and builds on platform APIs such as ``, the Popover API, and `
`/`` where they reduce implementation work and reuse browser accessibility behavior. ## Overview - [Quick start](https://plain-elements.com/docs-md/getting-started.md): Install Plain Elements, register components, and enhance existing HTML. - [Choosing a primitive](https://plain-elements.com/docs-md/overview/choosing-a-primitive.md): Decide between Dialog, Popover, Tooltip, Accordion, and Collapsible. - [Accessibility](https://plain-elements.com/docs-md/overview/accessibility.md): Accessibility behavior, author responsibilities, keyboard and focus guidance, and accessibility testing. - [About](https://plain-elements.com/docs-md/overview/about.md): Project scope, design principles, intended use, and non-goals. - [Browser support](https://plain-elements.com/docs-md/browser-support.md): Baseline target, minimum browser versions, and native API requirements. ## Components - [Dialog](https://plain-elements.com/docs-md/components/dialog.md): Modal popup behavior built on the native `` element, including trigger wiring, focus management, dismiss behavior, methods, and events. - [Popover](https://plain-elements.com/docs-md/components/popover.md): Interactive non-modal popup behavior built on the native Popover API, with focus management, ARIA wiring, dismiss behavior, and anchored positioning. - [Tooltip](https://plain-elements.com/docs-md/components/tooltip.md): Hover and focus descriptions with delays, side and alignment options, collision-aware positioning, and safe pointer paths. - [Tabs](https://plain-elements.com/docs-md/components/tabs.md): Accessible tabs with ARIA wiring, roving focus, orientation, disabled states, and automatic or manual activation. - [Accordion](https://plain-elements.com/docs-md/components/accordion.md): Grouped disclosures with `
`/`` support and an optional managed structure for measured height animation. - [Collapsible](https://plain-elements.com/docs-md/components/collapsible.md): Independent disclosure regions with ARIA wiring, disabled state, find-in-page support, methods, and events. ## Handbook - [Styling](https://plain-elements.com/docs-md/handbook/styling.md): Style components through Light DOM, native selectors, stable data attributes, and positioning variables. - [Animation](https://plain-elements.com/docs-md/handbook/animation.md): Animation lifecycle support and current component-specific animation behavior. - [React integration](https://plain-elements.com/docs-md/handbook/framework-integration.md): Use Plain Elements custom elements in React with client-only registration, JSX, typed events, and TypeScript declarations. - [llms.txt](https://plain-elements.com/docs-md/handbook/llms-txt.md): Purpose and usage of this documentation index. ## API References - [Package repository](https://github.com/k-s-h-r/plain-elements): Source code, tests, examples, plans, and TypeScript declarations. - [README](https://github.com/k-s-h-r/plain-elements#readme): Package overview, component list, installation notes, usage examples, and development commands. - [Full documentation](https://plain-elements.com/llms-full.txt): Complete English Plain Elements documentation in one Markdown-style text file. - [Utils](https://plain-elements.com/docs-md/utils/index.md): Status of planned shared utilities.