base-ui
Base UI
Overview
Use this skill as a navigation hub for Base UI. Load the specific reference files when needed.
Start Here
- Read
references/overview.mdfor install, portal isolation, iOS 26 Safari, and LLM docs access. - Pick components from
references/components.md. - Choose guidance by need: styling, composition, customization, animation, forms, TypeScript, or utils.
Reference Map
references/overview.md: install, portals, iOS 26 Safari, LLM docs, project context.references/components.md: full component and utility index with .md doc links.references/styling.md: className/state, data attributes, CSS variables, style prop, Tailwind/CSS Modules/CSS-in-JS patterns.references/composition.md: render prop usage, ref forwarding, nesting render props.references/customization.md: Base UI events, eventDetails, cancel/allowPropagation, preventBaseUIHandler, controlled vs uncontrolled.references/animation.md: data attributes, transitions vs animations, Motion/AnimatePresence, keepMounted, getAnimations.references/forms.md: Form/Field patterns, constraint validation, server-side errors, RHF/TanStack integration.references/typescript.md: Props/State namespaces, ChangeEventDetails/Reason, actionsRef types, useRender types.
More from noklip-io/agent-skills
three-js
|
71react-19
>
58gsap
Use when implementing web animations, timeline sequencing, scroll-triggered animations, SVG animations, layout transitions, or using GSAP, ScrollTrigger, ScrollSmoother, SplitText, Flip, DrawSVG, MorphSVG, MotionPath, or @gsap/react useGSAP hook.
51theatre-js
Use when implementing motion design, timeline animations, visual animation editors, animating Three.js/R3F scenes, creating keyframe animations, or using Theatre.js, @theatre/core, @theatre/studio, @theatre/r3f, theatric, or building animation tooling for the web.
38payload
Use when working with Payload CMS projects (payload.config.ts, collections, fields, hooks, access control, Payload API). Use when debugging validation errors, security issues, relationship queries, transactions, or hook behavior.
36nuqs
Use when implementing URL query state in React, managing search params, syncing state with URL, building filterable/sortable lists, pagination with URL state, or using nuqs/useQueryState/useQueryStates hooks in Next.js, Remix, React Router, or plain React.
35