Ship component registry with @lark-ui/core module

feat(popover): Add new Popover component

Adds a new Popover component based on Base UI's popover primitive. The Popover provides an accessible popup anchored to a trigger element, with support for:

• Compound component API: Popover, Popover.Trigger, Popover.Content, Popover.Title, Popover.Description, Popover.Close
• Positioning options: side (top, bottom, left, right), align (start, center, end), sideOffset
• Click-to-open by default, with optional openOnHover behavior
• Controlled mode via open and onOpenChange props
• Visual styling matching the updated Tooltip component (surface-aware background, proper light/dark mode support)

Migrate documentation site from React Router (lark-docs) to Astro (lark-docs-astro) as the primary docs platform, consolidate CI/CD pipelines, and add version display features.

Bump node to v24.12.0

Add Figma plugin for UI kit generation

• New plugin at packages/figma/ (@cloudflare/figma-plugin)
• Generates 29 component types: Badge, Banner, Button, Checkbox, Code, CodeBlock, Collapsible, Combobox, DateRangePicker, Dialog, Dropdown, Icon Library, Input, InputArea, LayerCard, LinkButton, Loader, MenuBar, Meter, Pagination, RefreshButton, Select, SensitiveInput, Surface, Switch, Switch.Group, Tabs, Text, Toast
• Each component generated with light and dark mode sections
• Icon Library generator creates all Phosphor and Cloudflare brand icons
• Parses component-registry.json and source files for variant specs
• Extracts opacity modifiers from Tailwind classes (bg-lark-brand/70 → opacity-primary-70)
• Binds fills/strokes to lark-colors variables
• Includes progress UI and validation output

feat(lark): add command-palette component

semantic color changes and more consolidation for non-text colors

feat(tooltip): Update tooltip to use bg-lark-base with proper light/dark mode support

Changes the tooltip background from a fixed dark color to a surface-aware background that adapts to light and dark modes. Implements Base UI's 3-path arrow SVG approach for pixel-perfect border alignment across color modes.

fix(lark): updated version in package.json (unintentionally downgraded)

feat(PageHeader): add optional title and description props

• Adds title?: string and description?: string props to PageHeader block
• Title renders as semantic h1 for Section 508 and WCAG 2.4.2 (Level A) compliance: "Web pages have titles that describe topic or purpose"
• Description uses max-w-prose (65ch) for optimal readability per industry standards
• Styling matches Stratus Workers & Pages implementation
• Includes comprehensive Storybook examples (WithTitle, WithTitleAndDescription, CompleteExample)

Why This Feature Matters

Without this feature, pages using only PageHeader would lack a semantic page title (h1), requiring developers to manually add titles elsewhere. This creates:

• ❌ Risk of Section 508 and WCAG 2.4.2 violations
• ❌ Compliance risk for FedRAMP High authorization (requires Section 508 conformance)
• ❌ Inconsistent title placement across pages
• ❌ Additional implementation burden on every page

With this feature, PageHeader provides a standardized way to include accessible page titles that:

• ✅ Render as semantic h1 elements (required by Section 508 and WCAG 2.4.2)
• ✅ Visually differentiate from breadcrumbs
• ✅ Work correctly with screen readers and assistive technology
• ✅ Maintain consistency across the dashboard
• ✅ Support FedRAMP High compliance requirements

Important: Breadcrumbs Are Not Page Titles

Breadcrumbs serve navigation purposes and cannot replace semantic page titles. Both should coexist:

• Page title (h1): Primary orientation, required for accessibility
• Breadcrumb trail: Secondary navigation showing site hierarchy
• Visual differentiation: Size, weight, and placement distinguish the two

References

• Section 508 Standards - Requires WCAG 2.0 Level A and AA conformance
• WCAG 2.4.2: Page Titled - Level A requirement

Add table component

• Introduce new Table component with row variants and styling options
• Add Table documentation and examples to lark-docs

lighter red in light mode

Add Label component with standardized label features for form fields

• New Label component with support for ReactNode children, optional indicator, and tooltip
• Enhanced form components (Input, Select, Checkbox, Switch, SensitiveInput, Combobox) with:
  • label prop now accepts ReactNode (not just strings)
  • required={false} shows "(optional)" text
  • labelTooltip prop for info icon with hover tooltip
• Updated Field component to use Label internally
• Added Label documentation page to lark-docs

Add Radio component for single-selection from a set of options

• New Radio.Group and Radio.Item compound components built on Base UI primitives
• Supports vertical and horizontal orientations
• Includes error, description, and disabled states
• controlPosition prop for label placement ("start" or "end")
• Full accessibility support with semantic HTML and keyboard navigation
• Documentation added to both lark-docs and lark-docs-astro sites

Add Storybook preview deployments and MR reporter system

• Storybook previews deploy to Cloudflare Workers on MR commits
• Staging deployment to storybook.staging.lark-ui.com on merge to main
• Consolidated MR comments with beta npm version and preview URL

Add variant prop to Tabs component with 'segmented' (default) and 'underline' options

Fix label not appearing in Combobox unless a description or error given.

fix bug where delete user external links were being treated as internal navigation and appending urls to domain

Fix Base UI nativeButton warning in Switch component by adding nativeButton prop to BaseSwitch.Root

Update deployment configs to enable preview urls

added a next / previous form of pagination

Modernize Active Sessions page with updated Lark design patterns

• Align border color with sidebar
  • Center arrow icon in select component

Add bg-lark-base as default background for Surface component

Fix Combobox button styles

Migrate to @base-ui/react V1

Breaking Change: Updated from @base-ui-components/react to the new @base-ui/react V1 package.

What Changed

• Package name: @base-ui-components/react → @base-ui/react
• Version: ^1.0.0-rc.0 > ^1.0.0
• All component imports updated to use the new package
• All primitive re-exports updated to use the new package
• Build configuration updated to bundle the new package

Migration Required

This is a major version bump because the underlying Base UI package has changed. While the Lark API remains the same, you'll need to:

1. Update dependencies:

   pnpm install
   

2. No code changes needed - All Lark components and primitives work exactly the same way. The package name change is internal to Lark.

For Lark Maintainers

After merging this PR, run:

# Install the new @base-ui/react package
pnpm install

# Regenerate primitive files with new package references
pnpm --filter @lark-ui/core build:primitives

# Rebuild the package
pnpm --filter @lark-ui/core build

# Run tests to verify everything works
pnpm --filter @lark-ui/core test:run

Technical Details

• Updated all imports from @base-ui-components/react/* to @base-ui/react/*
• Updated generate-primitives.ts script to reference new package
• Updated test files to check for new package name
• Updated vite.config.ts manualChunks to match new package name
• All 37 primitives will be regenerated with new imports

Add built-in Field integration to form components with automatic layout

New Features:

• Input, InputArea, SensitiveInput, Select, Checkbox, Switch, and Combobox now accept label, description, and error props for built-in Field wrapper support
• Automatic CSS-driven layout: vertical for text inputs, horizontal for checkboxes/switches using :has() selectors
• Checkbox.Group and Switch.Group compound components for managing multiple related controls with shared legend/description/error
• Storybook Code Panel enabled for better component code examples

Accessibility:

• Runtime console warnings (dev-only) when Input/Checkbox lack accessible names (label, aria-label, or aria-labelledby)
• Comprehensive JSDoc documentation with accessibility guidance and examples

Breaking Changes:

• Field component removed from public API (now internal implementation detail - use component props instead)

Migration:

// Before: Explicit Field wrapper
<Field label="Email" description="...">
  <Input placeholder="you@example.com" />
</Field>

// After: Built-in Field API (recommended)
<Input
  label="Email"
  description="..."
  placeholder="you@example.com"
/>

change error color for text component to match field input error colors

secondary-destructive button variant

fix: update changeset validation logic

• Complete semantic color tokens migrated from Stratus app

  • Document color and text-color tokens in Storybook
  • Add accessibility tests via Storybook Vitest addon
  • Add component-metadata generator for AI tooling
  • Enable linting in CI/CD (passing)
  • Apply Prettier Tailwind plugin for consistent class ordering
  • Use pnpm catalog for shared package versions
  • Semantic colors now scoped to [data-theme] and [data-mode] attributes
  • Consumers must ensure root element has these attributes for proper theming

  Migration Guide

  Add data-theme and data-mode attributes to your root element:

  // React example
  <html data-theme="lark" data-mode={isDark ? "dark" : "light"}>
  
  // Static HTML
  <html data-theme="lark" data-mode="light">
  

  • data-theme: Set to "lark" (default theme) or other theme variants like "fedramp"
  • data-mode: Set to "light" or "dark" to control color scheme

  If no data-mode is set, the system defaults to light mode.

tab and text style fixes; storybook theme select always visible

inputs with built-in fields

Bundle Base UI primitives with granular exports and fix critical compatibility issues

Primitives: Granular Exports

Added granular exports for all 37 Base UI primitives alongside the existing barrel export. This enables better tree-shaking and smaller bundle sizes when using individual primitives.

// Barrel export (imports all primitives)
import { Slider, Popover, Tooltip } from "@lark-ui/core/primitives";

// Granular exports (tree-shakeable, recommended)
import { Slider } from "@lark-ui/core/primitives/slider";
import { Popover } from "@lark-ui/core/primitives/popover";

Available primitives: accordion, alert-dialog, autocomplete, avatar, button, checkbox, checkbox-group, collapsible, combobox, context-menu, dialog, direction-provider, field, fieldset, form, input, menu, menubar, meter, navigation-menu, number-field, popover, preview-card, progress, radio, radio-group, scroll-area, select, separator, slider, switch, tabs, toast, toggle, toggle-group, toolbar, tooltip.

Build Output Improvements

Fixed critical compatibility issues with Jest and React Server Components by improving the build configuration.

Problems Fixed

1. Jest Parsing Errors - The previous build used preserveModules: true, which preserved the pnpm directory structure (node_modules/.pnpm/) in dist. This caused Jest to fail parsing ESM imports because Jest's transformIgnorePatterns blocks nested node_modules by default.
2. Missing "use client" Directives - The rollup-plugin-preserve-directives plugin only works with preserveModules: true. When bundling with preserveModules: false, all "use client" directives were stripped, breaking components in Next.js App Router (RSC).

Solutions Implemented

• Flat bundle structure - Changed to preserveModules: false to eliminate nested node_modules/.pnpm/ paths
• "use client" injection - Added output.banner to inject the directive into all output chunks (since the plugin doesn't work without preserveModules)
• Manual code splitting - Implemented manualChunks to split large vendor dependencies for better caching:
  • vendor-base-ui (598 KB, 152 KB gzipped) - Base UI components
  • vendor-styling (74 KB, 13 KB gzipped) - clsx + tailwind-merge
  • vendor-floating-ui (33 KB, 10 KB gzipped) - Floating UI positioning
  • vendor-utils (24 KB, 7 KB gzipped) - tabbable, reselect, etc.

lark cli

semantic text colors - consolidation

Removed label prop from input components. Prefer using Field to compose a label with an input.

consolidate blue text to match banner blue text across: badge, expandable, text components

consolidate on the green text tokens

Update lark package to use literal depdency versions for better yarn linking/portal support.

improve input group label to be semantic and use htmlFor

Combobox Type Fixes

• Removed any type and eslint-disable comments
• Used proper ComboboxBase.Root.Props<Value, Multiple> from base-ui's namespace
• Simplified generic parameters from 3 (ItemValue, SelectedValue, Multiple) to 2 (Value, Multiple) to match base-ui's actual API

fix remaining lint errors and increase lint warn -> error

Update reamde documentation

Consolidate AGENTS.md and CLAUDE.md LLM instructions

fix resource-list href lint errors

Improve expandable component semantics

Update Storybook imports from @storybook/react to @storybook/react-vite for Storybook 10 compatibility. Also removes generatedAt timestamp from component registry to prevent merge conflicts during rebases.

improve sensitive input component - semantics, button nesting, labelling, screen reader experience

Fix: Resolve type check errors across components/blocks/layouts Fix: Export Lark Breadcrumb as Breadcrumbs + Documentation Improvements Fix: MenuBar -Bypass the React 19 type checking issue with IconContext.Provider

improve semantics and labelling for date picker component

docs updates and semantic colors for banner

ship dark-mode color scheme styles from lark lib instead of setting it at the app

Adds Storybook 10 integration to the Lark component library for interactive component development, testing, and documentation. Includes stories for 29 components, automated plop generator updates, and documentation.

enforce button background transparency for tabs

Combobox - Adjust multiple select height with standard Lark component height

Checkbox indeterminate state

Improve development workflow with 10x faster rebuilds and comprehensive documentation

Add development mode with optimized builds, skip minification and enable incremental TypeScript compilation. Update all READMEs and contributing docs with clear guidance on Storybook (recommended) vs watch build workflows. Add story file documentation to scaffolding sections and two-terminal setup instructions for testing components in docs.

Enhance CICD to publish beta releases

Fix: Resolve type check erros across components/blocks/layouts Fix: Export Lark Breadcrumb as Breadcrumbs + Documentation Improvements Fix: MenuBar -Bypass the React 19 type checking issue with IconContext.Provider

Semantic color improvements

Improve select components

Fix Input borders

Fix exports

Compile Tailwind and Standalone CSS, update installation documentation

Adding changesets