×ばつ32px. Before marking ready Land #6073 and retarget this PR to main. Record the full promotion audit (B or better, zero BLOCKs) in the component-score ledger. Attach the visual contact sheet from the promotion audit. Obtain spec-owner approval for the path/terminology updates.">
Skip to content

Navigation Menu

Sign in
Sign up

feat(core): promote Drawer from lab #6071

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
imdreamrunner wants to merge 1 commit into agent/harden-lab-drawer-20260904
base: agent/harden-lab-drawer-20260904
Choose a base branch
Loading
from agent/promote-drawer-core-20260904
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
View file Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
'@astryxdesign/cli': minor
'@astryxdesign/core': minor
---

[breaking] Promote Drawer from `@astryxdesign/lab` to `@astryxdesign/core/Drawer`; run `astryx upgrade --apply` to migrate imports.
@imdreamrunner
6 changes: 3 additions & 3 deletions .github/scripts/modal-close-visibility.js
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ const TARGETS = [
},
{
component: 'Drawer (modal)',
story: 'lab-drawer--showcase',
story: 'core-drawer--showcase',
openButton: 'Open inspector',
// Reproduces the real failure condition: after the native host releases the
// top layer, this becomes the containing block for the fixed panel.
Expand All @@ -56,7 +56,7 @@ const TARGETS = [
},
{
component: 'Drawer (non-modal)',
story: 'lab-drawer--row-inspector',
story: 'core-drawer--row-inspector',
openButton: 'web-01 / us-east-1',
host: 'popover',
transformAncestor: true,
Expand All @@ -65,7 +65,7 @@ const TARGETS = [
},
{
component: 'Drawer (stacked exit)',
story: 'lab-drawer--stacked-drawers',
story: 'core-drawer--stacked-drawers',
openButton: 'Open order',
nestedButton: 'Open line item',
host: 'popover',
Expand Down
8 changes: 4 additions & 4 deletions .github/scripts/visual-gate/lib/plan.test.mjs
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ const themeOverrides = {
describe('storiesInPackages', () => {
const mixed = [
...stories,
story({id: 'lab-drawer--default', title: 'Lab/Drawer', name: 'Default', component: 'Drawer'}, '@astryxdesign/lab', false),
story({id: 'lab-stat--default', title: 'Lab/Stat', name: 'Default', component: 'Stat'}, '@astryxdesign/lab', false),
story({id: 'charts-bar--default', title: 'Charts/Bar', name: 'Default', component: 'Bar'}, '@astryxdesign/charts', false),
];

Expand Down Expand Up @@ -110,10 +110,10 @@ describe('canonicalBaselineStories', () => {
it('drops a canary component even when its story is titled under a canonical group', () => {
const labInCore = story(
{
id: 'core-drawer--default',
title: 'Core/Drawer',
id: 'core-stat--default',
title: 'Core/Stat',
name: 'Default',
component: 'Drawer',
component: 'Stat',
componentPackage: '@astryxdesign/lab',
},
'@astryxdesign/lab',
Expand Down
4 changes: 2 additions & 2 deletions .github/scripts/visual-scope.test.mjs
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,7 +167,7 @@ describe('classifyVisualScope', () => {

it('excludes Lab and records its release channel from package metadata', () => {
const result = classifyVisualScope(
['packages/lab/src/Drawer/Drawer.tsx'],
['packages/lab/src/Stat/Stat.tsx'],
root,
);
expect(result.hasStableVisual).toBe(false);
Expand All @@ -190,7 +190,7 @@ describe('classifyVisualScope', () => {
execFileSync(
process.execPath,
[SCRIPT, '--manifests', manifests, '--github-output', output],
{input: 'packages/lab/src/Drawer/Drawer.tsx\n'},
{input: 'packages/lab/src/Stat/Stat.tsx\n'},
),
).toThrow();
});
Expand Down
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,8 @@ import {
radiusVars,
spacingVars,
} from '@astryxdesign/core/theme/tokens.stylex';
import {Drawer, Stat} from '@astryxdesign/lab';
import {Drawer} from '@astryxdesign/core/Drawer';
import {Stat} from '@astryxdesign/lab';

import {
AUDIT_PROMPT,
Expand Down
View file Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

14 changes: 8 additions & 6 deletions apps/sandbox/src/app/(sandbox)/pages/motion-lab/bugs/page.tsx
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -564,7 +564,9 @@ export default function MotionBugsPage() {
<DemoCard
title="The drawer exit, cut short"
question="Slide 410ms, unmount at 250ms. Drag either slider: at what point does an exit stop being an exit?"
badges={<Badge variant="success" label="Resolved in Lab" />}>
badges={
<Badge variant="success" label="Resolved before core promotion" />
}>
<DemoBody>
<Text type="supporting">
<strong>This was the lab failure.</strong> The former implementation
Expand All @@ -574,12 +576,12 @@ export default function MotionBugsPage() {
slide never rendered.
</Text>
<Text type="supporting" color="secondary">
Lab Drawer now waits for the actual transform transition and uses a
Core Drawer now waits for the actual transform transition and uses a
computed-duration backstop in{' '}
<code>lab/Drawer/useDrawerDialogPresence.ts</code>. Theme motion can
no longer desynchronize the visual exit from native-host release;
the sliders below preserve the original failure as an interactive
explanation of why the fix matters.
<code>core/Drawer/useDrawerDialogPresence.ts</code>. Theme motion
can no longer desynchronize the visual exit from native-host
release; the sliders below preserve the original failure as an
interactive explanation of why the fix matters.
</Text>
</DemoBody>
<DemoBody>
Expand Down
3 changes: 2 additions & 1 deletion apps/sandbox/src/app/(sandbox)/templates/page.tsx
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,8 @@ import {
} from '@astryxdesign/core/theme/tokens.stylex';
import {Toolbar} from '@astryxdesign/core/Toolbar';
import {useToast} from '@astryxdesign/core/Toast';
import {Drawer, Stat} from '@astryxdesign/lab';
import {Drawer} from '@astryxdesign/core/Drawer';
import {Stat} from '@astryxdesign/lab';

import {
TEMPLATE_AUDIT_CATEGORIES,
Expand Down
2 changes: 1 addition & 1 deletion apps/storybook/rtl-audit/targets.json
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -374,7 +374,7 @@
},
{
"component": "Drawer",
"storyId": "lab-drawer--sides",
"storyId": "core-drawer--sides",
"dims": [
"D4"
],
Expand Down
4 changes: 2 additions & 2 deletions apps/storybook/stories/Drawer.stories.tsx
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

import type {Meta, StoryObj} from '@storybook/react';
import {useState} from 'react';
import {Drawer} from '@astryxdesign/lab';
import {Drawer} from '@astryxdesign/core/Drawer';
import {Button} from '@astryxdesign/core/Button';
import {CheckboxInput} from '@astryxdesign/core/CheckboxInput';
import {Divider} from '@astryxdesign/core/Divider';
Expand All @@ -12,7 +12,7 @@ import {VStack, HStack} from '@astryxdesign/core/Stack';
import {Text} from '@astryxdesign/core/Text';

const meta: Meta<typeof Drawer> = {
title: 'Lab/Drawer',
title: 'Core/Drawer',
component: Drawer,
tags: ['autodocs'],
parameters: {
Expand Down
8 changes: 4 additions & 4 deletions docs/architecture/layer-runtime.md
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ applies_to:
packages/core/src/Layer/,
packages/core/src/Popover/,
packages/core/src/Dialog/,
packages/lab/src/Drawer/,
packages/core/src/Drawer/,
packages/core/src/DropdownMenu/,
packages/core/src/Tooltip/,
packages/core/src/HoverCard/,
Expand Down Expand Up @@ -153,7 +153,7 @@ contract. The current shared stack registers present layers with `close` or
active-cycle registration sequence. `useFocusTrap` adapts an active trap with `onEscape` into
that stack.

Tooltip, HoverCard, Dialog, Lab Drawer, Popover, DropdownMenu, Lightbox, and
Tooltip, HoverCard, Dialog, Drawer, Popover, DropdownMenu, Lightbox, and
MobileNav all register with the shared stack. Tooltip and HoverCard report current DOM presence;
Popover and DropdownMenu register through `useFocusTrap`; Dialog, Lightbox, and
MobileNav additionally ask `shouldDismissOnCloseRequest()` before acting on native
Expand Down Expand Up @@ -297,8 +297,8 @@ be updated only as that work ships.
menu-cascade parent-close chain.
- Dialog families own native modal/backdrop presentation and their local channel
policies.
- Lab Drawer owns modal `showModal()` and non-modal `showPopover()` hosting while
the shared dismissal stack owns Escape and platform close routing.
- Drawer owns modal `showModal()` and non-modal `showPopover()` hosting while the
shared dismissal stack owns Escape and platform close routing.
- `LayerProvider`, `ToastContext`, `useToast`, and `ToastViewport` own current
notification state, dispatch, and viewport rendering.
- CommandPalette owns command search and selection; Dialog owns its native modal
Expand Down
6 changes: 3 additions & 3 deletions docs/families/overlay-dismissal.md
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ verified_by:
packages/core/src/Layer/useLayerDismissal.test.tsx,
packages/core/src/Layer/layerDismissalInvariants.test.tsx,
packages/core/src/Layer/layerDismissalFamilies.test.tsx,
packages/lab/src/Drawer/Drawer.test.tsx,
packages/core/src/Drawer/Drawer.test.tsx,
packages/core/src/hooks/useFocusTrap.test.tsx,
]
members:
Expand Down Expand Up @@ -90,7 +90,7 @@ this record's current membership snapshot must be updated with it.
- **Current members:** Dialog, AlertDialog, Popover, DropdownMenu,
DropdownMenuSubMenu, MoreMenu, Tooltip, HoverCard, Lightbox, MobileNav,
BottomSheet, BottomSheetSwitcher, CommandPalette, ContextMenu,
PowerSearchEditPopover, Lab Drawer, and the component-owned popup surfaces
PowerSearchEditPopover, Drawer, and the component-owned popup surfaces
listed below.
- **Component-owned input popups:** ChatComposerInput, ComplexSelector,
DateInput, DateRangeInput, DateTimeInput, Selector, MultiSelector,
Expand Down Expand Up @@ -189,7 +189,7 @@ this record's current membership snapshot must be updated with it.

| Components or surface | Adoption | Current deviation or limitation |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Dialog, AlertDialog, Popover, DropdownMenu root, MoreMenu, Lightbox, MobileNav, Lab Drawer | shared owner | none |
| Dialog, AlertDialog, Popover, DropdownMenu root, MoreMenu, Lightbox, MobileNav, Drawer | shared owner | none |
| Tooltip, HoverCard | shared owner with DOM presence reporting | Neither provides nesting depth to descendant layers |
| Focus traps with `onEscape` | shared owner through `useFocusTrap` | They provide DOM containment, not descendant depth |
| BreadcrumbItem, ChatComposerInput, ComplexSelector, DateInput, DateRangeInput, DateTimeInput, Selector, MultiSelector, PowerSearch, BaseTypeahead, Typeahead, Tokenizer, SideNavHeading, SideNavItem, TabMenu, TopNavHeading, TopNavMenu, TopNavMegaMenu, Table, Lab TourStep, Lab ChatEmojiPicker | shared owner through `usePopover` or a composed Popover owner | Adaptive BottomSheet paths inherit BottomSheet's adoption gap; Table filtering owns controlled Popover state and discards its draft on close; TourStep routes Popover close to the Tour; ChatEmojiPicker owns controlled Popover state |
Expand Down
2 changes: 1 addition & 1 deletion docs/specs/AST-027/spec.md
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -186,7 +186,7 @@ production declarations across 40 files and these current gaps:
| BottomSheet and BottomSheetSwitcher non-modal paths | Non-modal `dialog.show()` paths use static or dynamic values beginning at `1000` | **Confirmed global leaks.** A page band cannot provide dialog-layer semantics | Route non-modal hosting through Layer/native top-layer infrastructure; keep panel, handle, tint, action, and stack ordering locally isolated inside the host |

Current source already routes Tooltip, HoverCard, Popover, DropdownMenu and its
submenus, ContextMenu, CommandPalette, modal Dialog, Lab Drawer, Lightbox,
submenus, ContextMenu, CommandPalette, modal Dialog, Drawer, Lightbox,
MobileNav, Tour, Date-input layers, and RadialTooltip through Layer, native
Popover, or `showModal()`. Their cross-page mechanism is directionally
conforming. The confirmed exceptions are ChartTooltip and the non-modal
Expand Down
Loading

AltStyle によって変換されたページ (->オリジナル) /