From 9d18ff94ee894a5a7ba392a2fbe8dd76b89b5978 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Sun, 13 Oct 2024 20:10:43 +0200 Subject: [PATCH 1/4] [examples] Avoid git diff when playing with examples --- examples/.gitignore | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/examples/.gitignore b/examples/.gitignore index e0f7d4b6d4..d11ce49a15 100644 --- a/examples/.gitignore +++ b/examples/.gitignore @@ -1 +1,3 @@ -**/yarn.lock +package-lock.json +pnpm-lock.yaml +yarn.lock From 0b5da679016467bbdd28d60825aad808c0ea576b Mon Sep 17 00:00:00 2001 From: atomiks Date: Mon, 14 Oct 2024 12:45:34 +1100 Subject: [PATCH 2/4] =?UTF-8?q?[Checkbox][Switch]=20Split=20data-state=20i?= =?UTF-8?q?nto=20data-checked,=20data-unchecked=E2=80=A6=20(#721)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../css/index.js | 6 ++--- .../css/index.tsx | 6 ++--- .../system/index.js | 6 ++--- .../system/index.tsx | 6 ++--- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- .../UnstyledCheckboxGroupNested.js | 6 ++--- .../UnstyledCheckboxGroupNested.tsx | 6 ++--- .../checkbox/UnstyledCheckboxIndeterminate.js | 8 +++--- .../UnstyledCheckboxIndeterminate.tsx | 8 +++--- .../UnstyledCheckboxIndeterminateGroup.js | 6 ++--- .../UnstyledCheckboxIndeterminateGroup.tsx | 6 ++--- .../css-modules/index.js | 6 ++--- .../css-modules/index.tsx | 6 ++--- .../system/index.js | 6 ++--- .../system/index.tsx | 6 ++--- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- .../css-modules/styles.module.css | 6 ++--- .../system/index.js | 6 ++--- .../system/index.tsx | 6 ++--- .../src/Checkbox/Root/CheckboxRoot.test.tsx | 26 ++++++++++++------- .../utils/useCustomStyleHookMapping.ts | 16 +++++++----- .../src/Switch/Root/SwitchRoot.test.tsx | 20 +++++++++----- packages/mui-base/src/Switch/styleHooks.ts | 12 ++++++++- 25 files changed, 109 insertions(+), 79 deletions(-) diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js index 7a8dff8d43..6bd20db611 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js @@ -100,7 +100,7 @@ function Styles() { outline-offset: 2px; } - .Checkbox[data-state="checked"] { + .Checkbox[data-checked] { border-color: ${grey[800]}; background: ${grey[800]}; } @@ -112,7 +112,7 @@ function Styles() { color: ${grey[100]}; } - .Checkbox-indicator[data-state="checked"] { + .Checkbox-indicator[data-checked] { visibility: visible; } @@ -131,7 +131,7 @@ function Styles() { outline-offset: 2px; } - .Checkbox[data-state="checked"] { + .Checkbox[data-checked] { border-color: ${grey[300]}; background: ${grey[300]}; } diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx index ad487a0379..3d7b05826b 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx @@ -100,7 +100,7 @@ function Styles() { outline-offset: 2px; } - .Checkbox[data-state="checked"] { + .Checkbox[data-checked] { border-color: ${grey[800]}; background: ${grey[800]}; } @@ -112,7 +112,7 @@ function Styles() { color: ${grey[100]}; } - .Checkbox-indicator[data-state="checked"] { + .Checkbox-indicator[data-checked] { visibility: visible; } @@ -131,7 +131,7 @@ function Styles() { outline-offset: 2px; } - .Checkbox[data-state="checked"] { + .Checkbox[data-checked] { border-color: ${grey[300]}; background: ${grey[300]}; } diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js index 22affdf91d..1033cfc870 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js @@ -98,7 +98,7 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state="checked"], &[data-state="mixed"] { + &[data-checked], &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -132,8 +132,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` visibility: hidden; color: ${grey[100]}; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx index d3e65b1c75..a83acafc02 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx @@ -98,7 +98,7 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state="checked"], &[data-state="mixed"] { + &[data-checked], &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -132,8 +132,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` visibility: hidden; color: ${grey[100]}; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js index f058738f57..577e7db15f 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js @@ -104,7 +104,7 @@ const Indicator = React.forwardRef(function Indicator(props, ref) { ref={ref} className={(state) => classNames( - 'h-full inline-block invisible data-[state=checked]:visible text-gray-100', + 'h-full inline-block invisible data-[checked]:visible text-gray-100', typeof props.className === 'function' ? props.className(state) : props.className, diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx index 5c06154618..3169ca830f 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx @@ -99,7 +99,7 @@ const Indicator = React.forwardRef classNames( - 'h-full inline-block invisible data-[state=checked]:visible text-gray-100', + 'h-full inline-block invisible data-[checked]:visible text-gray-100', typeof props.className === 'function' ? props.className(state) : props.className, diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js index ffe0f68836..c70d40384f 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js @@ -89,7 +89,7 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state="checked"], &[data-state="mixed"] { + &[data-checked], &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -141,8 +141,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` visibility: hidden; color: ${grey[100]}; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx index 2a212b9e98..13326baf0b 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx @@ -89,7 +89,7 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state="checked"], &[data-state="mixed"] { + &[data-checked], &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -143,8 +143,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` visibility: hidden; color: ${grey[100]}; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js index 167666851f..786d49acc6 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js @@ -52,8 +52,8 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -84,8 +84,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` display: inline-block; visibility: hidden; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx index 2a41d48536..3b9e87f9a0 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx @@ -52,8 +52,8 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -86,8 +86,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` display: inline-block; visibility: hidden; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js index d80db2e23b..44234bb4c9 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js @@ -101,7 +101,7 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state="checked"], &[data-state="mixed"] { + &[data-checked], &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -153,8 +153,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` visibility: hidden; color: ${grey[100]}; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx index 4f8cb9e500..f6907fe196 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx @@ -101,7 +101,7 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state="checked"], &[data-state="mixed"] { + &[data-checked], &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -155,8 +155,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` visibility: hidden; color: ${grey[100]}; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js index 1b5d63a53f..b4a264dad6 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js @@ -92,7 +92,7 @@ function Styles() { outline-offset: 2px; } - .Checkbox[data-state="checked"] { + .Checkbox[data-checked] { border-color: ${grey[800]}; background: ${grey[800]}; } @@ -104,7 +104,7 @@ function Styles() { color: ${isDarkMode ? grey[900] : grey[100]}; } - .Checkbox-indicator[data-state="checked"] { + .Checkbox-indicator[data-checked] { visibility: visible; } @@ -118,7 +118,7 @@ function Styles() { border-color: ${grey[500]}; } - .Checkbox[data-state="checked"] { + .Checkbox[data-checked] { border-color: ${grey[300]}; background: ${grey[300]}; } diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx index 130758f8f7..758acd41b7 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx @@ -92,7 +92,7 @@ function Styles() { outline-offset: 2px; } - .Checkbox[data-state="checked"] { + .Checkbox[data-checked] { border-color: ${grey[800]}; background: ${grey[800]}; } @@ -104,7 +104,7 @@ function Styles() { color: ${isDarkMode ? grey[900] : grey[100]}; } - .Checkbox-indicator[data-state="checked"] { + .Checkbox-indicator[data-checked] { visibility: visible; } @@ -118,7 +118,7 @@ function Styles() { border-color: ${grey[500]}; } - .Checkbox[data-state="checked"] { + .Checkbox[data-checked] { border-color: ${grey[300]}; background: ${grey[300]}; } diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js index 517b2c2625..d5004c166a 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js @@ -66,7 +66,7 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state="checked"], &[data-state="mixed"] { + &[data-checked], &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -100,8 +100,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` display: inline-block; visibility: hidden; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx index f3990ce3c5..599539a6ef 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx @@ -66,7 +66,7 @@ const Checkbox = styled(BaseCheckbox.Root)( outline-offset: 2px; } - &[data-state="checked"], &[data-state="mixed"] { + &[data-checked], &[data-indeterminate] { border-color: transparent; background: ${blue[600]}; } @@ -100,8 +100,8 @@ const Indicator = styled(BaseCheckbox.Indicator)` display: inline-block; visibility: hidden; - &[data-state='checked'], - &[data-state='mixed'] { + &[data-checked], + &[data-indeterminate] { visibility: visible; } `; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js index d85f45e48e..f27426ca21 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js @@ -76,7 +76,7 @@ const Indicator = React.forwardRef(function Indicator(props, ref) { ref={ref} className={(state) => classNames( - 'h-full inline-block invisible data-[state=checked]:visible text-gray-100', + 'h-full inline-block invisible data-[checked]:visible text-gray-100', typeof props.className === 'function' ? props.className(state) : props.className, diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx index 43d903023b..595509db45 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx @@ -71,7 +71,7 @@ const Indicator = React.forwardRef classNames( - 'h-full inline-block invisible data-[state=checked]:visible text-gray-100', + 'h-full inline-block invisible data-[checked]:visible text-gray-100', typeof props.className === 'function' ? props.className(state) : props.className, diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/styles.module.css b/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/styles.module.css index d0b25a5991..37dde94ecb 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/styles.module.css +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/styles.module.css @@ -42,12 +42,12 @@ } } - &[data-state='checked'] { + &[data-checked] { border: none; background: var(--cyan-500); } - &[data-state='checked']:not([data-disabled]):hover { + &[data-checked]:not([data-disabled]):hover { background: var(--cyan-700); } } @@ -73,7 +73,7 @@ } } -.thumb[data-state='checked'] { +.thumb[data-checked] { left: 18px; background-color: #fff; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.js b/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.js index bac7657604..12d3ea815e 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.js +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.js @@ -72,12 +72,12 @@ const Switch = styled(BaseSwitch.Root)( box-shadow: 0 0 0 3px ${theme.palette.mode === 'dark' ? blue[700] : blue[200]}; } - &[data-state="checked"] { + &[data-checked] { border: none; background: ${blue[500]}; } - &[data-state="checked"]:not([data-disabled]):hover { + &[data-checked]:not([data-disabled]):hover { background: ${blue[700]}; } `, @@ -101,7 +101,7 @@ const Thumb = styled(BaseSwitch.Thumb)( theme.palette.mode === 'dark' ? 'rgba(0, 0, 0, 0.25)' : 'rgba(0, 0, 0, 0.1)' }; - &[data-state="checked"] { + &[data-checked] { left: 18px; background-color: #fff; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.tsx b/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.tsx index bac7657604..12d3ea815e 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.tsx +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.tsx @@ -72,12 +72,12 @@ const Switch = styled(BaseSwitch.Root)( box-shadow: 0 0 0 3px ${theme.palette.mode === 'dark' ? blue[700] : blue[200]}; } - &[data-state="checked"] { + &[data-checked] { border: none; background: ${blue[500]}; } - &[data-state="checked"]:not([data-disabled]):hover { + &[data-checked]:not([data-disabled]):hover { background: ${blue[700]}; } `, @@ -101,7 +101,7 @@ const Thumb = styled(BaseSwitch.Thumb)( theme.palette.mode === 'dark' ? 'rgba(0, 0, 0, 0.25)' : 'rgba(0, 0, 0, 0.1)' }; - &[data-state="checked"] { + &[data-checked] { left: 18px; background-color: #fff; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); diff --git a/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx b/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx index 5f136f54be..169a0f38aa 100644 --- a/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx +++ b/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx @@ -17,7 +17,7 @@ describe('', () => { describe('extra props', () => { it('can override the built-in attributes', async () => { - const { container } = await render(); + const { container } = await render(); expect(container.firstElementChild as HTMLElement).to.have.attribute('role', 'switch'); }); }); @@ -156,11 +156,6 @@ describe('', () => { expect(checkbox).to.have.attribute('aria-checked', 'mixed'); }); - it('should not set the `data-indeterminate` attribute', async () => { - const { getAllByRole } = await render(); - expect(getAllByRole('checkbox')[0]).to.not.have.attribute('data-indeterminate', 'true'); - }); - it('should not have the aria attribute when `indeterminate` is not set', async () => { const { getAllByRole } = await render(); expect(getAllByRole('checkbox')[0]).not.to.have.attribute('aria-checked', 'mixed'); @@ -185,7 +180,7 @@ describe('', () => { }); it('should place the style hooks on the root and the indicator', async () => { - const { getAllByRole } = await render( + const { getAllByRole, setProps } = await render( , @@ -194,15 +189,28 @@ describe('', () => { const [checkbox] = getAllByRole('checkbox'); const indicator = checkbox.querySelector('span'); - expect(checkbox).to.have.attribute('data-state', 'checked'); + expect(checkbox).to.have.attribute('data-checked', ''); + expect(checkbox).not.to.have.attribute('data-unchecked'); + expect(checkbox).to.have.attribute('data-disabled', 'true'); expect(checkbox).to.have.attribute('data-readonly', 'true'); expect(checkbox).to.have.attribute('data-required', 'true'); - expect(indicator).to.have.attribute('data-state', 'checked'); + expect(indicator).to.have.attribute('data-checked', ''); + expect(indicator).not.to.have.attribute('data-unchecked'); + expect(indicator).to.have.attribute('data-disabled', 'true'); expect(indicator).to.have.attribute('data-readonly', 'true'); expect(indicator).to.have.attribute('data-required', 'true'); + + setProps({ disabled: false, readOnly: false }); + fireEvent.click(checkbox); + + expect(checkbox).to.have.attribute('data-unchecked', ''); + expect(checkbox).not.to.have.attribute('data-checked'); + + expect(indicator).to.have.attribute('data-unchecked', ''); + expect(indicator).not.to.have.attribute('data-checked'); }); it('should set the name attribute on the input', async () => { diff --git a/packages/mui-base/src/Checkbox/utils/useCustomStyleHookMapping.ts b/packages/mui-base/src/Checkbox/utils/useCustomStyleHookMapping.ts index d0b604d65e..7b2d06cfc0 100644 --- a/packages/mui-base/src/Checkbox/utils/useCustomStyleHookMapping.ts +++ b/packages/mui-base/src/Checkbox/utils/useCustomStyleHookMapping.ts @@ -6,16 +6,20 @@ import type { CheckboxRoot } from '../Root/CheckboxRoot'; export function useCustomStyleHookMapping(ownerState: CheckboxRoot.OwnerState) { return React.useMemo>( () => ({ - // `data-state="mixed"` is used to style the checkbox when it's indeterminate - indeterminate: () => null, - checked(value) { - let state = value ? 'checked' : 'unchecked'; + checked(value): Record { if (ownerState.indeterminate) { - state = 'mixed'; + // `data-indeterminate` is already handled by the `indeterminate` prop. + return {}; + } + + if (value) { + return { + 'data-checked': '', + }; } return { - 'data-state': state, + 'data-unchecked': '', }; }, }), diff --git a/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx b/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx index ecfc916451..110ee301e2 100644 --- a/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx +++ b/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; -import { act, screen } from '@mui/internal-test-utils'; +import { act, fireEvent, screen } from '@mui/internal-test-utils'; import * as Switch from '@base_ui/react/Switch'; import { userEvent } from '@testing-library/user-event'; import { describeConformance, createRenderer } from '#test-utils'; @@ -72,9 +72,8 @@ describe('', () => { describe('extra props', () => { it('should override the built-in attributes', async () => { - await render(); + await render(); expect(screen.getByTestId('switch')).to.have.attribute('role', 'checkbox'); - expect(screen.getByTestId('switch')).to.have.attribute('data-state', 'checked'); }); }); @@ -247,7 +246,7 @@ describe('', () => { }); it('should place the style hooks on the root and the thumb', async () => { - await render( + const { setProps } = await render( , @@ -256,15 +255,24 @@ describe('', () => { const switchElement = screen.getByRole('switch'); const thumb = screen.getByTestId('thumb'); - expect(switchElement).to.have.attribute('data-state', 'checked'); + expect(switchElement).to.have.attribute('data-checked', ''); expect(switchElement).to.have.attribute('data-disabled', 'true'); expect(switchElement).to.have.attribute('data-readonly', 'true'); expect(switchElement).to.have.attribute('data-required', 'true'); - expect(thumb).to.have.attribute('data-state', 'checked'); + expect(thumb).to.have.attribute('data-checked', ''); expect(thumb).to.have.attribute('data-disabled', 'true'); expect(thumb).to.have.attribute('data-readonly', 'true'); expect(thumb).to.have.attribute('data-required', 'true'); + + setProps({ disabled: false, readOnly: false }); + fireEvent.click(switchElement); + + expect(switchElement).to.have.attribute('data-unchecked', ''); + expect(switchElement).not.to.have.attribute('data-checked'); + + expect(thumb).to.have.attribute('data-unchecked', ''); + expect(thumb).not.to.have.attribute('data-checked'); }); it('should set the name attribute on the input', async () => { diff --git a/packages/mui-base/src/Switch/styleHooks.ts b/packages/mui-base/src/Switch/styleHooks.ts index 0c8fd40aba..c95bcd792a 100644 --- a/packages/mui-base/src/Switch/styleHooks.ts +++ b/packages/mui-base/src/Switch/styleHooks.ts @@ -2,5 +2,15 @@ import type { SwitchRoot } from './Root/SwitchRoot'; import type { CustomStyleHookMapping } from '../utils/getStyleHookProps'; export const styleHookMapping: CustomStyleHookMapping = { - checked: (value) => ({ 'data-state': value ? 'checked' : 'unchecked' }), + checked(value): Record { + if (value) { + return { + 'data-checked': '', + }; + } + + return { + 'data-unchecked': '', + }; + }, }; From d86a97c4daa83ea0fe3ccb3f4456f243e1cb19ab Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Dudak?= Date: Mon, 14 Oct 2024 09:26:42 +0200 Subject: [PATCH 3/4] [core] Improve DX of importing Base UI components (#700) --- docs/app/DocsProviders.tsx | 2 +- .../app/experiments/collapsible-accordion.tsx | 2 +- docs/app/experiments/collapsible-framer.tsx | 2 +- .../collapsible-hidden-until-found.tsx | 2 +- docs/app/experiments/collapsible.tsx | 2 +- docs/app/experiments/dialog.tsx | 2 +- docs/app/experiments/menu-anchor-el.tsx | 2 +- docs/app/experiments/menu-anchor-ref.tsx | 2 +- docs/app/experiments/progress.tsx | 2 +- .../slider-change-committed-lag.tsx | 2 +- docs/app/experiments/slider-marks.tsx | 5 +- docs/app/experiments/slider-template.tsx | 2 +- docs/app/experiments/slider-tooltip.tsx | 4 +- docs/app/experiments/slider.tsx | 5 +- docs/app/experiments/tabs.tsx | 2 +- docs/app/experiments/tooltip.tsx | 2 +- docs/data/api/alert-dialog-backdrop.json | 2 +- docs/data/api/alert-dialog-close.json | 2 +- docs/data/api/alert-dialog-description.json | 2 +- docs/data/api/alert-dialog-popup.json | 2 +- docs/data/api/alert-dialog-root.json | 2 +- docs/data/api/alert-dialog-title.json | 2 +- docs/data/api/alert-dialog-trigger.json | 2 +- docs/data/api/checkbox-group-root.json | 2 +- docs/data/api/checkbox-indicator.json | 2 +- docs/data/api/checkbox-root.json | 2 +- docs/data/api/collapsible-content.json | 2 +- docs/data/api/collapsible-root.json | 2 +- docs/data/api/collapsible-trigger.json | 2 +- docs/data/api/dialog-backdrop.json | 2 +- docs/data/api/dialog-close.json | 4 +- docs/data/api/dialog-description.json | 2 +- docs/data/api/dialog-popup.json | 4 +- docs/data/api/dialog-root.json | 2 +- docs/data/api/dialog-title.json | 4 +- docs/data/api/dialog-trigger.json | 2 +- docs/data/api/field-control.json | 4 +- docs/data/api/field-description.json | 2 +- docs/data/api/field-error.json | 2 +- docs/data/api/field-label.json | 2 +- docs/data/api/field-root.json | 2 +- docs/data/api/field-validity.json | 2 +- docs/data/api/fieldset-legend.json | 2 +- docs/data/api/fieldset-root.json | 2 +- docs/data/api/form-root.json | 2 +- docs/data/api/menu-arrow.json | 2 +- .../api/menu-checkbox-item-indicator.json | 2 +- docs/data/api/menu-checkbox-item.json | 2 +- docs/data/api/menu-group-label.json | 2 +- docs/data/api/menu-group.json | 2 +- docs/data/api/menu-item.json | 2 +- docs/data/api/menu-popup.json | 2 +- docs/data/api/menu-positioner.json | 2 +- docs/data/api/menu-radio-group.json | 2 +- docs/data/api/menu-radio-item-indicator.json | 2 +- docs/data/api/menu-radio-item.json | 4 +- docs/data/api/menu-root.json | 2 +- docs/data/api/menu-separator.json | 4 +- docs/data/api/menu-trigger.json | 2 +- docs/data/api/number-field-decrement.json | 2 +- docs/data/api/number-field-group.json | 2 +- docs/data/api/number-field-increment.json | 2 +- docs/data/api/number-field-input.json | 2 +- docs/data/api/number-field-root.json | 2 +- .../api/number-field-scrub-area-cursor.json | 2 +- docs/data/api/number-field-scrub-area.json | 2 +- docs/data/api/popover-arrow.json | 2 +- docs/data/api/popover-backdrop.json | 2 +- docs/data/api/popover-close.json | 2 +- docs/data/api/popover-description.json | 2 +- docs/data/api/popover-popup.json | 2 +- docs/data/api/popover-positioner.json | 2 +- docs/data/api/popover-root.json | 2 +- docs/data/api/popover-title.json | 2 +- docs/data/api/popover-trigger.json | 2 +- docs/data/api/preview-card-arrow.json | 2 +- docs/data/api/preview-card-backdrop.json | 2 +- docs/data/api/preview-card-popup.json | 2 +- docs/data/api/preview-card-positioner.json | 2 +- docs/data/api/preview-card-root.json | 2 +- docs/data/api/preview-card-trigger.json | 2 +- docs/data/api/progress-indicator.json | 2 +- docs/data/api/progress-root.json | 2 +- docs/data/api/progress-track.json | 2 +- docs/data/api/radio-group-root.json | 2 +- docs/data/api/radio-indicator.json | 2 +- docs/data/api/radio-root.json | 2 +- docs/data/api/separator-root.json | 2 +- docs/data/api/slider-control.json | 2 +- docs/data/api/slider-indicator.json | 2 +- docs/data/api/slider-output.json | 2 +- docs/data/api/slider-root.json | 2 +- docs/data/api/slider-thumb.json | 4 +- docs/data/api/slider-track.json | 4 +- docs/data/api/switch-root.json | 2 +- docs/data/api/switch-thumb.json | 4 +- docs/data/api/tab-indicator.json | 2 +- docs/data/api/tab-panel.json | 2 +- docs/data/api/tab.json | 2 +- docs/data/api/tabs-list.json | 2 +- docs/data/api/tabs-root.json | 2 +- docs/data/api/tooltip-arrow.json | 2 +- docs/data/api/tooltip-popup.json | 2 +- docs/data/api/tooltip-positioner.json | 2 +- docs/data/api/tooltip-provider.json | 2 +- docs/data/api/tooltip-root.json | 2 +- docs/data/api/tooltip-trigger.json | 2 +- .../css-modules/index.js | 2 +- .../css-modules/index.tsx | 2 +- .../AlertDialogIntroduction/system/index.js | 2 +- .../AlertDialogIntroduction/system/index.tsx | 2 +- .../AlertDialogIntroduction/tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- .../AlertDialogWithTransitions.js | 2 +- .../AlertDialogWithTransitions.tsx | 2 +- .../alert-dialog/NestedAlertDialogs.js | 2 +- .../alert-dialog/NestedAlertDialogs.tsx | 2 +- .../css/index.js | 6 +-- .../css/index.tsx | 6 +-- .../system/index.js | 6 +-- .../system/index.tsx | 6 +-- .../tailwind/index.js | 6 +-- .../tailwind/index.tsx | 6 +-- .../UnstyledCheckboxGroupNested.js | 6 +-- .../UnstyledCheckboxGroupNested.tsx | 6 +-- .../checkbox-group/checkbox-group.mdx | 2 +- .../checkbox/UnstyledCheckboxIndeterminate.js | 2 +- .../UnstyledCheckboxIndeterminate.tsx | 2 +- .../UnstyledCheckboxIndeterminateGroup.js | 2 +- .../UnstyledCheckboxIndeterminateGroup.tsx | 2 +- .../css-modules/index.js | 2 +- .../css-modules/index.tsx | 2 +- .../system/index.js | 2 +- .../system/index.tsx | 2 +- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- .../collapsible/CssAnimatedCollapsible.js | 2 +- .../collapsible/CssAnimatedCollapsible.tsx | 2 +- .../collapsible/CssTransitionCollapsible.js | 2 +- .../collapsible/CssTransitionCollapsible.tsx | 2 +- .../UnstyledCollapsibleIntroduction.js | 2 +- .../UnstyledCollapsibleIntroduction.tsx | 2 +- .../dialog/DialogWithTransitions.js | 2 +- .../dialog/DialogWithTransitions.tsx | 2 +- docs/data/components/dialog/NestedDialogs.js | 2 +- docs/data/components/dialog/NestedDialogs.tsx | 2 +- .../css-modules/index.js | 2 +- .../css-modules/index.tsx | 2 +- .../system/index.js | 2 +- .../system/index.tsx | 2 +- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- .../components/field/UnstyledFieldAsync.js | 2 +- .../components/field/UnstyledFieldAsync.tsx | 2 +- .../UnstyledFieldIntroduction/system/index.js | 2 +- .../system/index.tsx | 2 +- .../components/field/UnstyledFieldPassword.js | 2 +- .../field/UnstyledFieldPassword.tsx | 2 +- .../field/UnstyledFieldServerError.js | 2 +- .../field/UnstyledFieldServerError.tsx | 2 +- .../system/index.js | 4 +- .../system/index.tsx | 4 +- .../form/FormIntroduction/system/index.js | 6 +-- .../form/FormIntroduction/system/index.tsx | 6 +-- docs/data/components/form/form.mdx | 4 +- docs/data/components/menu/CheckboxItems.js | 2 +- docs/data/components/menu/CheckboxItems.tsx | 2 +- .../menu/MenuIntroduction/css-modules/Menu.js | 2 +- .../MenuIntroduction/css-modules/Menu.tsx | 2 +- .../menu/MenuIntroduction/system/index.js | 2 +- .../menu/MenuIntroduction/system/index.tsx | 2 +- .../menu/MenuIntroduction/tailwind/index.js | 2 +- .../menu/MenuIntroduction/tailwind/index.tsx | 2 +- docs/data/components/menu/NestedMenu.js | 2 +- docs/data/components/menu/NestedMenu.tsx | 2 +- docs/data/components/menu/RadioItems.js | 2 +- docs/data/components/menu/RadioItems.tsx | 2 +- .../number-field/UnstyledNumberFieldFormat.js | 2 +- .../UnstyledNumberFieldFormat.tsx | 2 +- .../css-modules/index.js | 2 +- .../css-modules/index.tsx | 2 +- .../system/index.js | 4 +- .../system/index.tsx | 4 +- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- .../number-field/UnstyledNumberFieldScrub.js | 2 +- .../number-field/UnstyledNumberFieldScrub.tsx | 2 +- .../UnstyledNumberFieldWheelScrub.js | 2 +- .../UnstyledNumberFieldWheelScrub.tsx | 2 +- .../system/index.js | 2 +- .../system/index.tsx | 2 +- .../popover/UnstyledPopoverTransition.js | 2 +- .../popover/UnstyledPopoverTransition.tsx | 2 +- .../system/index.js | 2 +- .../system/index.tsx | 2 +- .../UnstyledPreviewCardTransition.js | 2 +- .../UnstyledPreviewCardTransition.tsx | 2 +- .../progress/IndeterminateProgress.js | 2 +- .../progress/IndeterminateProgress.tsx | 2 +- docs/data/components/progress/RtlProgress.js | 2 +- docs/data/components/progress/RtlProgress.tsx | 2 +- .../css-modules/index.js | 2 +- .../css-modules/index.tsx | 2 +- .../system/index.js | 2 +- .../system/index.tsx | 2 +- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- .../system/index.js | 4 +- .../system/index.tsx | 4 +- .../separator/SeparatorIntroduction.js | 2 +- .../separator/SeparatorIntroduction.tsx | 2 +- docs/data/components/slider/RangeSlider.js | 2 +- docs/data/components/slider/RangeSlider.tsx | 2 +- docs/data/components/slider/RtlSlider.js | 2 +- docs/data/components/slider/RtlSlider.tsx | 2 +- .../css-modules/index.js | 2 +- .../css-modules/index.tsx | 2 +- .../system/index.js | 2 +- .../system/index.tsx | 2 +- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- docs/data/components/slider/VerticalSlider.js | 2 +- .../data/components/slider/VerticalSlider.tsx | 2 +- .../css-modules/index.js | 2 +- .../css-modules/index.tsx | 2 +- .../system/index.js | 2 +- .../system/index.tsx | 2 +- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- docs/data/components/tabs/IndicatorBubble.js | 2 +- docs/data/components/tabs/IndicatorBubble.tsx | 2 +- .../components/tabs/IndicatorUnderline.js | 2 +- .../components/tabs/IndicatorUnderline.tsx | 2 +- .../components/tabs/KeyboardNavigation.js | 2 +- .../components/tabs/KeyboardNavigation.tsx | 2 +- .../css-modules/index.js | 2 +- .../css-modules/index.tsx | 2 +- .../UnstyledTabsIntroduction/system/index.js | 2 +- .../UnstyledTabsIntroduction/system/index.tsx | 2 +- .../tailwind/index.js | 2 +- .../tailwind/index.tsx | 2 +- .../components/tabs/UnstyledTabsRouting.js | 2 +- .../components/tabs/UnstyledTabsRouting.tsx | 2 +- .../tooltip/UnstyledTooltipDelayGroup.js | 2 +- .../tooltip/UnstyledTooltipDelayGroup.tsx | 2 +- .../tooltip/UnstyledTooltipFollowCursor.js | 2 +- .../tooltip/UnstyledTooltipFollowCursor.tsx | 2 +- .../system/index.js | 2 +- .../system/index.tsx | 2 +- .../tooltip/UnstyledTooltipTransition.js | 2 +- .../tooltip/UnstyledTooltipTransition.tsx | 2 +- .../accessibility/FocusRing.js | 2 +- .../accessibility/FocusRing.tsx | 2 +- .../PackageManagerSnippetCode.tsx | 2 +- .../PackageManagerSnippetRoot.tsx | 2 +- docs/src/components/DocsVersionSelector.tsx | 2 +- .../content/InstallationInstructions.tsx | 2 +- docs/src/components/demo/Demo.tsx | 2 +- docs/src/components/demo/DemoFileSelector.tsx | 2 +- docs/src/design-system/Tooltip.tsx | 2 +- .../Backdrop/AlertDialogBackdrop.test.tsx | 2 +- .../Close/AlertDialogClose.test.tsx | 2 +- .../AlertDialogDescription.test.tsx | 2 +- .../Popup/AlertDialogPopup.test.tsx | 2 +- .../Title/AlertDialogTitle.test.tsx | 2 +- .../Trigger/AlertDialogTrigger.test.tsx | 2 +- .../mui-base/src/AlertDialog/index.barrel.ts | 7 --- .../mui-base/src/AlertDialog/index.parts.ts | 7 +++ packages/mui-base/src/AlertDialog/index.ts | 8 +-- .../Indicator/CheckboxIndicator.test.tsx | 2 +- .../src/Checkbox/Root/CheckboxRoot.test.tsx | 2 +- .../mui-base/src/Checkbox/index.barrel.ts | 2 - packages/mui-base/src/Checkbox/index.parts.ts | 2 + packages/mui-base/src/Checkbox/index.ts | 3 +- .../Parent/useCheckboxGroupParent.test.tsx | 4 +- .../Root/CheckboxGroupRoot.test.tsx | 4 +- .../src/CheckboxGroup/index.barrel.ts | 1 - .../mui-base/src/CheckboxGroup/index.parts.ts | 1 + packages/mui-base/src/CheckboxGroup/index.ts | 2 +- .../Content/CollapsibleContent.test.tsx | 4 +- .../Collapsible/Root/CollapsibleRoot.test.tsx | 2 +- .../Trigger/CollapsibleTrigger.test.tsx | 4 +- .../mui-base/src/Collapsible/index.parts.ts | 3 ++ packages/mui-base/src/Collapsible/index.ts | 10 +--- .../Dialog/Backdrop/DialogBackdrop.test.tsx | 2 +- .../src/Dialog/Close/DialogClose.test.tsx | 2 +- .../Description/DialogDescription.test.tsx | 2 +- .../src/Dialog/Popup/DialogPopup.test.tsx | 2 +- .../src/Dialog/Root/DialogRoot.test.tsx | 2 +- .../src/Dialog/Title/DialogTitle.test.tsx | 2 +- .../src/Dialog/Trigger/DialogTrigger.test.tsx | 2 +- packages/mui-base/src/Dialog/index.barrel.ts | 7 --- packages/mui-base/src/Dialog/index.parts.ts | 7 +++ packages/mui-base/src/Dialog/index.ts | 8 +-- .../src/Field/Control/FieldControl.test.tsx | 2 +- .../Description/FieldDescription.test.tsx | 14 +++--- .../src/Field/Error/FieldError.test.tsx | 2 +- .../src/Field/Label/FieldLabel.test.tsx | 14 +++--- .../src/Field/Root/FieldRoot.test.tsx | 14 +++--- .../src/Field/Validity/FieldValidity.test.tsx | 2 +- packages/mui-base/src/Field/index.barrel.ts | 8 --- packages/mui-base/src/Field/index.parts.ts | 8 +++ packages/mui-base/src/Field/index.ts | 9 +--- .../Fieldset/Legend/FieldsetLegend.test.tsx | 2 +- .../src/Fieldset/Root/FieldsetRoot.test.tsx | 2 +- .../mui-base/src/Fieldset/index.barrel.ts | 2 - packages/mui-base/src/Fieldset/index.parts.ts | 2 + packages/mui-base/src/Fieldset/index.ts | 3 +- .../mui-base/src/Form/Root/FormRoot.test.tsx | 4 +- packages/mui-base/src/Form/index.barrel.ts | 1 - packages/mui-base/src/Form/index.parts.ts | 1 + packages/mui-base/src/Form/index.ts | 2 +- .../src/Menu/Arrow/MenuArrow.test.tsx | 2 +- .../CheckboxItem/MenuCheckboxItem.test.tsx | 2 +- .../MenuCheckboxItemIndicator.test.tsx | 2 +- .../src/Menu/Group/MenuGroup.test.tsx | 2 +- .../Menu/GroupLabel/MenuGroupLabel.test.tsx | 2 +- .../mui-base/src/Menu/Item/MenuItem.test.tsx | 2 +- .../src/Menu/Popup/MenuPopup.test.tsx | 2 +- .../Menu/Positioner/MenuPositioner.test.tsx | 2 +- .../Menu/RadioGroup/MenuRadioGroup.test.tsx | 2 +- .../src/Menu/RadioItem/MenuRadioItem.test.tsx | 2 +- .../MenuRadioItemIndicator.test.tsx | 2 +- .../mui-base/src/Menu/Root/MenuRoot.test.tsx | 2 +- .../src/Menu/Trigger/MenuTrigger.test.tsx | 2 +- packages/mui-base/src/Menu/index.barrel.ts | 14 ------ packages/mui-base/src/Menu/index.parts.ts | 15 ++++++ packages/mui-base/src/Menu/index.ts | 16 +----- .../Decrement/NumberFieldDecrement.test.tsx | 2 +- .../Group/NumberFieldGroup.test.tsx | 2 +- .../Increment/NumberFieldIncrement.test.tsx | 2 +- .../Input/NumberFieldInput.test.tsx | 2 +- .../NumberField/Root/NumberFieldRoot.test.tsx | 2 +- .../ScrubArea/NumberFieldScrubArea.test.tsx | 2 +- .../NumberFieldScrubAreaCursor.test.tsx | 2 +- .../mui-base/src/NumberField/index.barrel.ts | 7 --- .../mui-base/src/NumberField/index.parts.ts | 7 +++ packages/mui-base/src/NumberField/index.ts | 8 +-- .../src/Popover/Arrow/PopoverArrow.test.tsx | 2 +- .../Popover/Backdrop/PopoverBackdrop.test.tsx | 2 +- .../src/Popover/Close/PopoverClose.test.tsx | 2 +- .../Description/PopoverDescription.test.tsx | 2 +- .../src/Popover/Popup/PopoverPopup.test.tsx | 2 +- .../Positioner/PopoverPositioner.test.tsx | 2 +- .../src/Popover/Root/PopoverRoot.test.tsx | 2 +- .../src/Popover/Title/PopoverTitle.test.tsx | 2 +- .../Popover/Trigger/PopoverTrigger.test.tsx | 2 +- packages/mui-base/src/Popover/index.barrel.ts | 9 ---- packages/mui-base/src/Popover/index.parts.ts | 9 ++++ packages/mui-base/src/Popover/index.ts | 10 +--- .../Arrow/PreviewCardArrow.test.tsx | 2 +- .../Backdrop/PreviewCardBackdrop.test.tsx | 2 +- .../Popup/PreviewCardPopup.test.tsx | 2 +- .../Positioner/PreviewCardPositioner.test.tsx | 2 +- .../PreviewCard/Root/PreviewCardRoot.test.tsx | 2 +- .../Trigger/PreviewCardTrigger.test.tsx | 2 +- .../mui-base/src/PreviewCard/index.barrel.ts | 6 --- .../mui-base/src/PreviewCard/index.parts.ts | 6 +++ packages/mui-base/src/PreviewCard/index.ts | 7 +-- .../Indicator/ProgressIndicator.test.tsx | 2 +- .../src/Progress/Root/ProgressRoot.test.tsx | 2 +- .../src/Progress/Track/ProgressTrack.test.tsx | 2 +- .../mui-base/src/Progress/index.barrel.ts | 8 --- packages/mui-base/src/Progress/index.parts.ts | 8 +++ packages/mui-base/src/Progress/index.ts | 9 +--- .../Radio/Indicator/RadioIndicator.test.tsx | 2 +- .../src/Radio/Root/RadioRoot.test.tsx | 2 +- packages/mui-base/src/Radio/index.barrel.ts | 2 - packages/mui-base/src/Radio/index.parts.ts | 2 + packages/mui-base/src/Radio/index.ts | 3 +- .../RadioGroup/Root/RadioGroupRoot.test.tsx | 4 +- .../mui-base/src/RadioGroup/index.barrel.ts | 1 - .../mui-base/src/RadioGroup/index.parts.ts | 1 + packages/mui-base/src/RadioGroup/index.ts | 2 +- .../src/Separator/Root/SeparatorRoot.test.tsx | 2 +- .../mui-base/src/Separator/index.barrel.ts | 1 - .../mui-base/src/Separator/index.parts.ts | 1 + packages/mui-base/src/Separator/index.ts | 2 +- .../src/Slider/Control/SliderControl.test.tsx | 4 +- .../Slider/Indicator/SliderIndicator.test.tsx | 4 +- .../src/Slider/Output/SliderOutput.test.tsx | 4 +- .../src/Slider/Root/SliderRoot.test.tsx | 2 +- .../src/Slider/Thumb/SliderThumb.test.tsx | 4 +- .../src/Slider/Track/SliderTrack.test.tsx | 4 +- .../{index.barrel.ts => index.parts.ts} | 29 +++++++---- packages/mui-base/src/Slider/index.ts | 50 +------------------ .../src/Switch/Root/SwitchRoot.test.tsx | 2 +- .../src/Switch/Thumb/SwitchThumb.test.tsx | 2 +- packages/mui-base/src/Switch/index.barrel.ts | 2 - packages/mui-base/src/Switch/index.parts.ts | 2 + packages/mui-base/src/Switch/index.ts | 3 +- .../mui-base/src/Tabs/Root/TabsRoot.test.tsx | 2 +- packages/mui-base/src/Tabs/Tab/Tab.test.tsx | 2 +- .../mui-base/src/Tabs/Tab/useTab.test.tsx | 2 +- .../Tabs/TabIndicator/TabIndicator.test.tsx | 2 +- .../src/Tabs/TabPanel/TabPanel.test.tsx | 2 +- .../src/Tabs/TabPanel/useTabPanel.test.tsx | 2 +- .../src/Tabs/TabsList/TabsList.test.tsx | 2 +- .../src/Tabs/TabsList/useTabsList.test.tsx | 2 +- packages/mui-base/src/Tabs/index.barrel.ts | 5 -- packages/mui-base/src/Tabs/index.parts.ts | 5 ++ packages/mui-base/src/Tabs/index.ts | 6 +-- .../src/Tooltip/Arrow/TooltipArrow.test.tsx | 2 +- .../src/Tooltip/Popup/TooltipPopup.test.tsx | 2 +- .../Positioner/TooltipPositioner.test.tsx | 2 +- .../Tooltip/Provider/TooltipProvider.test.tsx | 2 +- .../src/Tooltip/Root/TooltipRoot.test.tsx | 2 +- .../Tooltip/Trigger/TooltipTrigger.test.tsx | 2 +- packages/mui-base/src/Tooltip/index.barrel.ts | 6 --- packages/mui-base/src/Tooltip/index.parts.ts | 6 +++ packages/mui-base/src/Tooltip/index.ts | 7 +-- packages/mui-base/src/index.ts | 32 +++++++----- .../config/getComponentImports.ts | 4 +- 413 files changed, 565 insertions(+), 694 deletions(-) delete mode 100644 packages/mui-base/src/AlertDialog/index.barrel.ts create mode 100644 packages/mui-base/src/AlertDialog/index.parts.ts delete mode 100644 packages/mui-base/src/Checkbox/index.barrel.ts create mode 100644 packages/mui-base/src/Checkbox/index.parts.ts delete mode 100644 packages/mui-base/src/CheckboxGroup/index.barrel.ts create mode 100644 packages/mui-base/src/CheckboxGroup/index.parts.ts create mode 100644 packages/mui-base/src/Collapsible/index.parts.ts delete mode 100644 packages/mui-base/src/Dialog/index.barrel.ts create mode 100644 packages/mui-base/src/Dialog/index.parts.ts delete mode 100644 packages/mui-base/src/Field/index.barrel.ts create mode 100644 packages/mui-base/src/Field/index.parts.ts delete mode 100644 packages/mui-base/src/Fieldset/index.barrel.ts create mode 100644 packages/mui-base/src/Fieldset/index.parts.ts delete mode 100644 packages/mui-base/src/Form/index.barrel.ts create mode 100644 packages/mui-base/src/Form/index.parts.ts delete mode 100644 packages/mui-base/src/Menu/index.barrel.ts create mode 100644 packages/mui-base/src/Menu/index.parts.ts delete mode 100644 packages/mui-base/src/NumberField/index.barrel.ts create mode 100644 packages/mui-base/src/NumberField/index.parts.ts delete mode 100644 packages/mui-base/src/Popover/index.barrel.ts create mode 100644 packages/mui-base/src/Popover/index.parts.ts delete mode 100644 packages/mui-base/src/PreviewCard/index.barrel.ts create mode 100644 packages/mui-base/src/PreviewCard/index.parts.ts delete mode 100644 packages/mui-base/src/Progress/index.barrel.ts create mode 100644 packages/mui-base/src/Progress/index.parts.ts delete mode 100644 packages/mui-base/src/Radio/index.barrel.ts create mode 100644 packages/mui-base/src/Radio/index.parts.ts delete mode 100644 packages/mui-base/src/RadioGroup/index.barrel.ts create mode 100644 packages/mui-base/src/RadioGroup/index.parts.ts delete mode 100644 packages/mui-base/src/Separator/index.barrel.ts create mode 100644 packages/mui-base/src/Separator/index.parts.ts rename packages/mui-base/src/Slider/{index.barrel.ts => index.parts.ts} (53%) delete mode 100644 packages/mui-base/src/Switch/index.barrel.ts create mode 100644 packages/mui-base/src/Switch/index.parts.ts delete mode 100644 packages/mui-base/src/Tabs/index.barrel.ts create mode 100644 packages/mui-base/src/Tabs/index.parts.ts delete mode 100644 packages/mui-base/src/Tooltip/index.barrel.ts create mode 100644 packages/mui-base/src/Tooltip/index.parts.ts diff --git a/docs/app/DocsProviders.tsx b/docs/app/DocsProviders.tsx index 7caa4a4eff..39b504c7cb 100644 --- a/docs/app/DocsProviders.tsx +++ b/docs/app/DocsProviders.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { DemoVariantSelectorProvider } from 'docs-base/src/components/demo/DemoVariantSelectorProvider'; import { PackageManagerSnippetProvider } from 'docs-base/src/blocks/PackageManagerSnippet/PackageManagerSnippetProvider'; diff --git a/docs/app/experiments/collapsible-accordion.tsx b/docs/app/experiments/collapsible-accordion.tsx index fa14e5ac60..65e531eb02 100644 --- a/docs/app/experiments/collapsible-accordion.tsx +++ b/docs/app/experiments/collapsible-accordion.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; const TRANSITION_DURATION = '350ms'; diff --git a/docs/app/experiments/collapsible-framer.tsx b/docs/app/experiments/collapsible-framer.tsx index 92682ab303..3e53809494 100644 --- a/docs/app/experiments/collapsible-framer.tsx +++ b/docs/app/experiments/collapsible-framer.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; import { motion } from 'framer-motion'; export default function CollapsibleFramer() { diff --git a/docs/app/experiments/collapsible-hidden-until-found.tsx b/docs/app/experiments/collapsible-hidden-until-found.tsx index cfa9e0484f..46b3ce2953 100644 --- a/docs/app/experiments/collapsible-hidden-until-found.tsx +++ b/docs/app/experiments/collapsible-hidden-until-found.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; const DURATION = '350ms'; diff --git a/docs/app/experiments/collapsible.tsx b/docs/app/experiments/collapsible.tsx index 55d3477a41..a1e2429a65 100644 --- a/docs/app/experiments/collapsible.tsx +++ b/docs/app/experiments/collapsible.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; const DURATION = '350ms'; diff --git a/docs/app/experiments/dialog.tsx b/docs/app/experiments/dialog.tsx index c1dd9fe760..9d72f1bf8b 100644 --- a/docs/app/experiments/dialog.tsx +++ b/docs/app/experiments/dialog.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import clsx from 'clsx'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; // eslint-disable-next-line no-restricted-imports import { useTransitionStatus } from '@base_ui/react/utils/useTransitionStatus'; import { animated as springAnimated, useSpring, useSpringRef } from '@react-spring/web'; diff --git a/docs/app/experiments/menu-anchor-el.tsx b/docs/app/experiments/menu-anchor-el.tsx index 883bd9a72a..bad4bdc474 100644 --- a/docs/app/experiments/menu-anchor-el.tsx +++ b/docs/app/experiments/menu-anchor-el.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; export default function Page() { const [anchorEl, setAnchor] = React.useState(null); diff --git a/docs/app/experiments/menu-anchor-ref.tsx b/docs/app/experiments/menu-anchor-ref.tsx index e375b201de..68d67f7e8d 100644 --- a/docs/app/experiments/menu-anchor-ref.tsx +++ b/docs/app/experiments/menu-anchor-ref.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; export default function Page() { const anchor = React.useRef(null); diff --git a/docs/app/experiments/progress.tsx b/docs/app/experiments/progress.tsx index 1db6f0dc53..230fb3e45e 100644 --- a/docs/app/experiments/progress.tsx +++ b/docs/app/experiments/progress.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Progress from '@base_ui/react/Progress'; +import { Progress } from '@base_ui/react/Progress'; const VAL1 = 33; diff --git a/docs/app/experiments/slider-change-committed-lag.tsx b/docs/app/experiments/slider-change-committed-lag.tsx index 8ced35a40a..673b39ad78 100644 --- a/docs/app/experiments/slider-change-committed-lag.tsx +++ b/docs/app/experiments/slider-change-committed-lag.tsx @@ -2,7 +2,7 @@ // https://github.com/mui/material-ui/issues/41739 // to cross check whether this issue would still occur in the new API import * as React from 'react'; -import * as Slider from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; import { Styles } from './slider'; export default function App() { diff --git a/docs/app/experiments/slider-marks.tsx b/docs/app/experiments/slider-marks.tsx index 2026be9b07..04194347ca 100644 --- a/docs/app/experiments/slider-marks.tsx +++ b/docs/app/experiments/slider-marks.tsx @@ -1,7 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Slider from '@base_ui/react/Slider'; -import { useSliderContext } from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; const STOPS = [ { @@ -33,7 +32,7 @@ function getSliderThumbAriaValueText(value: number) { // for "inverted track", the track/rail can be styled with CSS but a prop is needed to flip the "mark active" state function MarkWithLabel(props: { index: number; value: number; label: string; inverted?: boolean }) { const { index, value, label, inverted = false } = props; - const { direction, values } = useSliderContext(); + const { direction, values } = Slider.useSliderContext(); const isRtl = direction === 'rtl'; const isFilled = inverted ? value >= values[0] : values[0] >= value; return ( diff --git a/docs/app/experiments/slider-template.tsx b/docs/app/experiments/slider-template.tsx index 33bee84cf1..7472d3a329 100644 --- a/docs/app/experiments/slider-template.tsx +++ b/docs/app/experiments/slider-template.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Slider from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; import { Styles } from './slider'; export default function App() { diff --git a/docs/app/experiments/slider-tooltip.tsx b/docs/app/experiments/slider-tooltip.tsx index d221b5c637..2d8b140855 100644 --- a/docs/app/experiments/slider-tooltip.tsx +++ b/docs/app/experiments/slider-tooltip.tsx @@ -1,8 +1,8 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Slider from '@base_ui/react/Slider'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Slider } from '@base_ui/react/Slider'; +import { Tooltip } from '@base_ui/react/Tooltip'; function useIsDarkMode() { const theme = useTheme(); diff --git a/docs/app/experiments/slider.tsx b/docs/app/experiments/slider.tsx index 449930434d..3e8d29dc83 100644 --- a/docs/app/experiments/slider.tsx +++ b/docs/app/experiments/slider.tsx @@ -1,8 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Slider from '@base_ui/react/Slider'; -import { useSliderContext } from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; export default function App() { const [val1, setVal1] = React.useState(50); @@ -233,7 +232,7 @@ function Label(props: any) { const defaultId = React.useId(); const labelId = idProp ?? defaultId; - const { subitems } = useSliderContext(); + const { subitems } = Slider.useSliderContext(); const htmlFor = Array.from(subitems.values()) .reduce((acc, item) => { diff --git a/docs/app/experiments/tabs.tsx b/docs/app/experiments/tabs.tsx index c787815133..36c8271b53 100644 --- a/docs/app/experiments/tabs.tsx +++ b/docs/app/experiments/tabs.tsx @@ -2,7 +2,7 @@ /* eslint-disable react/no-danger */ import * as React from 'react'; import { css, styled } from '@mui/system'; -import * as BaseTabs from '@base_ui/react/Tabs'; +import { Tabs as BaseTabs } from '@base_ui/react/Tabs'; export default function UnstyledTabsIntroduction() { const [v, sv] = React.useState(0); diff --git a/docs/app/experiments/tooltip.tsx b/docs/app/experiments/tooltip.tsx index 7a6cf11d4d..40f010864c 100644 --- a/docs/app/experiments/tooltip.tsx +++ b/docs/app/experiments/tooltip.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled, keyframes } from '@mui/system'; import { motion, AnimatePresence } from 'framer-motion'; diff --git a/docs/data/api/alert-dialog-backdrop.json b/docs/data/api/alert-dialog-backdrop.json index e4c113258d..4a4cadeae5 100644 --- a/docs/data/api/alert-dialog-backdrop.json +++ b/docs/data/api/alert-dialog-backdrop.json @@ -6,7 +6,7 @@ }, "name": "AlertDialogBackdrop", "imports": [ - "import * as AlertDialog from '@base_ui/react/AlertDialog';\nconst AlertDialogBackdrop = AlertDialog.Backdrop;" + "import { AlertDialog } from '@base_ui/react/AlertDialog';\nconst AlertDialogBackdrop = AlertDialog.Backdrop;" ], "classes": [], "spread": true, diff --git a/docs/data/api/alert-dialog-close.json b/docs/data/api/alert-dialog-close.json index ed0de8e5c0..04e289d03a 100644 --- a/docs/data/api/alert-dialog-close.json +++ b/docs/data/api/alert-dialog-close.json @@ -5,7 +5,7 @@ }, "name": "AlertDialogClose", "imports": [ - "import * as AlertDialog from '@base_ui/react/AlertDialog';\nconst AlertDialogClose = AlertDialog.Close;" + "import { AlertDialog } from '@base_ui/react/AlertDialog';\nconst AlertDialogClose = AlertDialog.Close;" ], "classes": [], "spread": true, diff --git a/docs/data/api/alert-dialog-description.json b/docs/data/api/alert-dialog-description.json index 4004c33a33..ac3110306d 100644 --- a/docs/data/api/alert-dialog-description.json +++ b/docs/data/api/alert-dialog-description.json @@ -5,7 +5,7 @@ }, "name": "AlertDialogDescription", "imports": [ - "import * as AlertDialog from '@base_ui/react/AlertDialog';\nconst AlertDialogDescription = AlertDialog.Description;" + "import { AlertDialog } from '@base_ui/react/AlertDialog';\nconst AlertDialogDescription = AlertDialog.Description;" ], "classes": [], "spread": true, diff --git a/docs/data/api/alert-dialog-popup.json b/docs/data/api/alert-dialog-popup.json index 4e06422802..902e31c784 100644 --- a/docs/data/api/alert-dialog-popup.json +++ b/docs/data/api/alert-dialog-popup.json @@ -7,7 +7,7 @@ }, "name": "AlertDialogPopup", "imports": [ - "import * as AlertDialog from '@base_ui/react/AlertDialog';\nconst AlertDialogPopup = AlertDialog.Popup;" + "import { AlertDialog } from '@base_ui/react/AlertDialog';\nconst AlertDialogPopup = AlertDialog.Popup;" ], "classes": [], "spread": true, diff --git a/docs/data/api/alert-dialog-root.json b/docs/data/api/alert-dialog-root.json index dddc81760d..8e3b7c6638 100644 --- a/docs/data/api/alert-dialog-root.json +++ b/docs/data/api/alert-dialog-root.json @@ -7,7 +7,7 @@ }, "name": "AlertDialogRoot", "imports": [ - "import * as AlertDialog from '@base_ui/react/AlertDialog';\nconst AlertDialogRoot = AlertDialog.Root;" + "import { AlertDialog } from '@base_ui/react/AlertDialog';\nconst AlertDialogRoot = AlertDialog.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/alert-dialog-title.json b/docs/data/api/alert-dialog-title.json index 7d11d2f33c..7ad51049ee 100644 --- a/docs/data/api/alert-dialog-title.json +++ b/docs/data/api/alert-dialog-title.json @@ -5,7 +5,7 @@ }, "name": "AlertDialogTitle", "imports": [ - "import * as AlertDialog from '@base_ui/react/AlertDialog';\nconst AlertDialogTitle = AlertDialog.Title;" + "import { AlertDialog } from '@base_ui/react/AlertDialog';\nconst AlertDialogTitle = AlertDialog.Title;" ], "classes": [], "spread": true, diff --git a/docs/data/api/alert-dialog-trigger.json b/docs/data/api/alert-dialog-trigger.json index e785893339..9e32aadbae 100644 --- a/docs/data/api/alert-dialog-trigger.json +++ b/docs/data/api/alert-dialog-trigger.json @@ -5,7 +5,7 @@ }, "name": "AlertDialogTrigger", "imports": [ - "import * as AlertDialog from '@base_ui/react/AlertDialog';\nconst AlertDialogTrigger = AlertDialog.Trigger;" + "import { AlertDialog } from '@base_ui/react/AlertDialog';\nconst AlertDialogTrigger = AlertDialog.Trigger;" ], "classes": [], "spread": true, diff --git a/docs/data/api/checkbox-group-root.json b/docs/data/api/checkbox-group-root.json index d7a9319d07..b030723dc8 100644 --- a/docs/data/api/checkbox-group-root.json +++ b/docs/data/api/checkbox-group-root.json @@ -11,7 +11,7 @@ }, "name": "CheckboxGroupRoot", "imports": [ - "import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';\nconst CheckboxGroupRoot = CheckboxGroup.Root;" + "import { CheckboxGroup } from '@base_ui/react/CheckboxGroup';\nconst CheckboxGroupRoot = CheckboxGroup.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/checkbox-indicator.json b/docs/data/api/checkbox-indicator.json index 14420a5b90..042044e63c 100644 --- a/docs/data/api/checkbox-indicator.json +++ b/docs/data/api/checkbox-indicator.json @@ -6,7 +6,7 @@ }, "name": "CheckboxIndicator", "imports": [ - "import * as Checkbox from '@base_ui/react/Checkbox';\nconst CheckboxIndicator = Checkbox.Indicator;" + "import { Checkbox } from '@base_ui/react/Checkbox';\nconst CheckboxIndicator = Checkbox.Indicator;" ], "classes": [], "spread": true, diff --git a/docs/data/api/checkbox-root.json b/docs/data/api/checkbox-root.json index 7e2138278c..a9dff6d981 100644 --- a/docs/data/api/checkbox-root.json +++ b/docs/data/api/checkbox-root.json @@ -23,7 +23,7 @@ }, "name": "CheckboxRoot", "imports": [ - "import * as Checkbox from '@base_ui/react/Checkbox';\nconst CheckboxRoot = Checkbox.Root;" + "import { Checkbox } from '@base_ui/react/Checkbox';\nconst CheckboxRoot = Checkbox.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/collapsible-content.json b/docs/data/api/collapsible-content.json index f756bd0bd8..e44ca41c5f 100644 --- a/docs/data/api/collapsible-content.json +++ b/docs/data/api/collapsible-content.json @@ -9,7 +9,7 @@ }, "name": "CollapsibleContent", "imports": [ - "import * as Collapsible from '@base_ui/react/Collapsible';\nconst CollapsibleContent = Collapsible.Content;" + "import { Collapsible } from '@base_ui/react/Collapsible';\nconst CollapsibleContent = Collapsible.Content;" ], "classes": [], "spread": true, diff --git a/docs/data/api/collapsible-root.json b/docs/data/api/collapsible-root.json index 4e1abe2c46..911399fe45 100644 --- a/docs/data/api/collapsible-root.json +++ b/docs/data/api/collapsible-root.json @@ -10,7 +10,7 @@ }, "name": "CollapsibleRoot", "imports": [ - "import * as Collapsible from '@base_ui/react/Collapsible';\nconst CollapsibleRoot = Collapsible.Root;" + "import { Collapsible } from '@base_ui/react/Collapsible';\nconst CollapsibleRoot = Collapsible.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/collapsible-trigger.json b/docs/data/api/collapsible-trigger.json index 0aa32c8e70..784494b73a 100644 --- a/docs/data/api/collapsible-trigger.json +++ b/docs/data/api/collapsible-trigger.json @@ -5,7 +5,7 @@ }, "name": "CollapsibleTrigger", "imports": [ - "import * as Collapsible from '@base_ui/react/Collapsible';\nconst CollapsibleTrigger = Collapsible.Trigger;" + "import { Collapsible } from '@base_ui/react/Collapsible';\nconst CollapsibleTrigger = Collapsible.Trigger;" ], "classes": [], "spread": true, diff --git a/docs/data/api/dialog-backdrop.json b/docs/data/api/dialog-backdrop.json index 041757b2b5..9a48a406a5 100644 --- a/docs/data/api/dialog-backdrop.json +++ b/docs/data/api/dialog-backdrop.json @@ -6,7 +6,7 @@ }, "name": "DialogBackdrop", "imports": [ - "import * as Dialog from '@base_ui/react/Dialog';\nconst DialogBackdrop = Dialog.Backdrop;" + "import { Dialog } from '@base_ui/react/Dialog';\nconst DialogBackdrop = Dialog.Backdrop;" ], "classes": [], "spread": true, diff --git a/docs/data/api/dialog-close.json b/docs/data/api/dialog-close.json index f3c98f9ce0..1229ef4450 100644 --- a/docs/data/api/dialog-close.json +++ b/docs/data/api/dialog-close.json @@ -4,9 +4,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "DialogClose", - "imports": [ - "import * as Dialog from '@base_ui/react/Dialog';\nconst DialogClose = Dialog.Close;" - ], + "imports": ["import { Dialog } from '@base_ui/react/Dialog';\nconst DialogClose = Dialog.Close;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/dialog-description.json b/docs/data/api/dialog-description.json index 8733b10c70..8d2a1cf80a 100644 --- a/docs/data/api/dialog-description.json +++ b/docs/data/api/dialog-description.json @@ -5,7 +5,7 @@ }, "name": "DialogDescription", "imports": [ - "import * as Dialog from '@base_ui/react/Dialog';\nconst DialogDescription = Dialog.Description;" + "import { Dialog } from '@base_ui/react/Dialog';\nconst DialogDescription = Dialog.Description;" ], "classes": [], "spread": true, diff --git a/docs/data/api/dialog-popup.json b/docs/data/api/dialog-popup.json index 3072b9ff3c..4bb1be663a 100644 --- a/docs/data/api/dialog-popup.json +++ b/docs/data/api/dialog-popup.json @@ -6,9 +6,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "DialogPopup", - "imports": [ - "import * as Dialog from '@base_ui/react/Dialog';\nconst DialogPopup = Dialog.Popup;" - ], + "imports": ["import { Dialog } from '@base_ui/react/Dialog';\nconst DialogPopup = Dialog.Popup;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/dialog-root.json b/docs/data/api/dialog-root.json index 20a26cb4fc..3e8b87e708 100644 --- a/docs/data/api/dialog-root.json +++ b/docs/data/api/dialog-root.json @@ -8,7 +8,7 @@ "open": { "type": { "name": "bool" } } }, "name": "DialogRoot", - "imports": ["import * as Dialog from '@base_ui/react/Dialog';\nconst DialogRoot = Dialog.Root;"], + "imports": ["import { Dialog } from '@base_ui/react/Dialog';\nconst DialogRoot = Dialog.Root;"], "classes": [], "spread": true, "themeDefaultProps": null, diff --git a/docs/data/api/dialog-title.json b/docs/data/api/dialog-title.json index 5a9cfb7e43..a05f6bd49d 100644 --- a/docs/data/api/dialog-title.json +++ b/docs/data/api/dialog-title.json @@ -4,9 +4,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "DialogTitle", - "imports": [ - "import * as Dialog from '@base_ui/react/Dialog';\nconst DialogTitle = Dialog.Title;" - ], + "imports": ["import { Dialog } from '@base_ui/react/Dialog';\nconst DialogTitle = Dialog.Title;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/dialog-trigger.json b/docs/data/api/dialog-trigger.json index 08ba0d1edb..10f8f51398 100644 --- a/docs/data/api/dialog-trigger.json +++ b/docs/data/api/dialog-trigger.json @@ -5,7 +5,7 @@ }, "name": "DialogTrigger", "imports": [ - "import * as Dialog from '@base_ui/react/Dialog';\nconst DialogTrigger = Dialog.Trigger;" + "import { Dialog } from '@base_ui/react/Dialog';\nconst DialogTrigger = Dialog.Trigger;" ], "classes": [], "spread": true, diff --git a/docs/data/api/field-control.json b/docs/data/api/field-control.json index 7932e11fc8..fe0b98ff5d 100644 --- a/docs/data/api/field-control.json +++ b/docs/data/api/field-control.json @@ -5,9 +5,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "FieldControl", - "imports": [ - "import * as Field from '@base_ui/react/Field';\nconst FieldControl = Field.Control;" - ], + "imports": ["import { Field } from '@base_ui/react/Field';\nconst FieldControl = Field.Control;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/field-description.json b/docs/data/api/field-description.json index 4654b11ac8..88400bc52b 100644 --- a/docs/data/api/field-description.json +++ b/docs/data/api/field-description.json @@ -5,7 +5,7 @@ }, "name": "FieldDescription", "imports": [ - "import * as Field from '@base_ui/react/Field';\nconst FieldDescription = Field.Description;" + "import { Field } from '@base_ui/react/Field';\nconst FieldDescription = Field.Description;" ], "classes": [], "spread": true, diff --git a/docs/data/api/field-error.json b/docs/data/api/field-error.json index b52587e68b..b80033d4b2 100644 --- a/docs/data/api/field-error.json +++ b/docs/data/api/field-error.json @@ -11,7 +11,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "FieldError", - "imports": ["import * as Field from '@base_ui/react/Field';\nconst FieldError = Field.Error;"], + "imports": ["import { Field } from '@base_ui/react/Field';\nconst FieldError = Field.Error;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/field-label.json b/docs/data/api/field-label.json index feebb4e277..87db1074c1 100644 --- a/docs/data/api/field-label.json +++ b/docs/data/api/field-label.json @@ -4,7 +4,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "FieldLabel", - "imports": ["import * as Field from '@base_ui/react/Field';\nconst FieldLabel = Field.Label;"], + "imports": ["import { Field } from '@base_ui/react/Field';\nconst FieldLabel = Field.Label;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/field-root.json b/docs/data/api/field-root.json index 946b4cc5bb..a9cdf945a9 100644 --- a/docs/data/api/field-root.json +++ b/docs/data/api/field-root.json @@ -13,7 +13,7 @@ } }, "name": "FieldRoot", - "imports": ["import * as Field from '@base_ui/react/Field';\nconst FieldRoot = Field.Root;"], + "imports": ["import { Field } from '@base_ui/react/Field';\nconst FieldRoot = Field.Root;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/field-validity.json b/docs/data/api/field-validity.json index 39bbdadb2d..3e7b3c8d9c 100644 --- a/docs/data/api/field-validity.json +++ b/docs/data/api/field-validity.json @@ -2,7 +2,7 @@ "props": {}, "name": "FieldValidity", "imports": [ - "import * as Field from '@base_ui/react/Field';\nconst FieldValidity = Field.Validity;" + "import { Field } from '@base_ui/react/Field';\nconst FieldValidity = Field.Validity;" ], "classes": [], "spread": true, diff --git a/docs/data/api/fieldset-legend.json b/docs/data/api/fieldset-legend.json index 08643190ff..abebed30df 100644 --- a/docs/data/api/fieldset-legend.json +++ b/docs/data/api/fieldset-legend.json @@ -5,7 +5,7 @@ }, "name": "FieldsetLegend", "imports": [ - "import * as Fieldset from '@base_ui/react/Fieldset';\nconst FieldsetLegend = Fieldset.Legend;" + "import { Fieldset } from '@base_ui/react/Fieldset';\nconst FieldsetLegend = Fieldset.Legend;" ], "classes": [], "spread": true, diff --git a/docs/data/api/fieldset-root.json b/docs/data/api/fieldset-root.json index cd34d7cfc4..7434ad43b9 100644 --- a/docs/data/api/fieldset-root.json +++ b/docs/data/api/fieldset-root.json @@ -5,7 +5,7 @@ }, "name": "FieldsetRoot", "imports": [ - "import * as Fieldset from '@base_ui/react/Fieldset';\nconst FieldsetRoot = Fieldset.Root;" + "import { Fieldset } from '@base_ui/react/Fieldset';\nconst FieldsetRoot = Fieldset.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/form-root.json b/docs/data/api/form-root.json index a7517e42e1..afcada8794 100644 --- a/docs/data/api/form-root.json +++ b/docs/data/api/form-root.json @@ -6,7 +6,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "FormRoot", - "imports": ["import * as Form from '@base_ui/react/Form';\nconst FormRoot = Form.Root;"], + "imports": ["import { Form } from '@base_ui/react/Form';\nconst FormRoot = Form.Root;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/menu-arrow.json b/docs/data/api/menu-arrow.json index 026e242c14..39bf1b7732 100644 --- a/docs/data/api/menu-arrow.json +++ b/docs/data/api/menu-arrow.json @@ -5,7 +5,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "MenuArrow", - "imports": ["import * as Menu from '@base_ui/react/Menu';\nconst MenuArrow = Menu.Arrow;"], + "imports": ["import { Menu } from '@base_ui/react/Menu';\nconst MenuArrow = Menu.Arrow;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/menu-checkbox-item-indicator.json b/docs/data/api/menu-checkbox-item-indicator.json index aaf1adec7d..ae9716f80f 100644 --- a/docs/data/api/menu-checkbox-item-indicator.json +++ b/docs/data/api/menu-checkbox-item-indicator.json @@ -6,7 +6,7 @@ }, "name": "MenuCheckboxItemIndicator", "imports": [ - "import * as Menu from '@base_ui/react/Menu';\nconst MenuCheckboxItemIndicator = Menu.CheckboxItemIndicator;" + "import { Menu } from '@base_ui/react/Menu';\nconst MenuCheckboxItemIndicator = Menu.CheckboxItemIndicator;" ], "classes": [], "spread": true, diff --git a/docs/data/api/menu-checkbox-item.json b/docs/data/api/menu-checkbox-item.json index c622f69014..71f0dc291c 100644 --- a/docs/data/api/menu-checkbox-item.json +++ b/docs/data/api/menu-checkbox-item.json @@ -8,7 +8,7 @@ }, "name": "MenuCheckboxItem", "imports": [ - "import * as Menu from '@base_ui/react/Menu';\nconst MenuCheckboxItem = Menu.CheckboxItem;" + "import { Menu } from '@base_ui/react/Menu';\nconst MenuCheckboxItem = Menu.CheckboxItem;" ], "classes": [], "spread": true, diff --git a/docs/data/api/menu-group-label.json b/docs/data/api/menu-group-label.json index f25161ff1b..31f344174e 100644 --- a/docs/data/api/menu-group-label.json +++ b/docs/data/api/menu-group-label.json @@ -5,7 +5,7 @@ }, "name": "MenuGroupLabel", "imports": [ - "import * as Menu from '@base_ui/react/Menu';\nconst MenuGroupLabel = Menu.GroupLabel;" + "import { Menu } from '@base_ui/react/Menu';\nconst MenuGroupLabel = Menu.GroupLabel;" ], "classes": [], "spread": true, diff --git a/docs/data/api/menu-group.json b/docs/data/api/menu-group.json index 5ef36cb045..a0c0074ede 100644 --- a/docs/data/api/menu-group.json +++ b/docs/data/api/menu-group.json @@ -5,7 +5,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "MenuGroup", - "imports": ["import * as Menu from '@base_ui/react/Menu';\nconst MenuGroup = Menu.Group;"], + "imports": ["import { Menu } from '@base_ui/react/Menu';\nconst MenuGroup = Menu.Group;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/menu-item.json b/docs/data/api/menu-item.json index 639cb25160..de2ce393b1 100644 --- a/docs/data/api/menu-item.json +++ b/docs/data/api/menu-item.json @@ -7,7 +7,7 @@ "onClick": { "type": { "name": "func" } } }, "name": "MenuItem", - "imports": ["import * as Menu from '@base_ui/react/Menu';\nconst MenuItem = Menu.Item;"], + "imports": ["import { Menu } from '@base_ui/react/Menu';\nconst MenuItem = Menu.Item;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/menu-popup.json b/docs/data/api/menu-popup.json index 49cc98f616..ad8b18e3be 100644 --- a/docs/data/api/menu-popup.json +++ b/docs/data/api/menu-popup.json @@ -5,7 +5,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "MenuPopup", - "imports": ["import * as Menu from '@base_ui/react/Menu';\nconst MenuPopup = Menu.Popup;"], + "imports": ["import { Menu } from '@base_ui/react/Menu';\nconst MenuPopup = Menu.Popup;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/menu-positioner.json b/docs/data/api/menu-positioner.json index 6356647f8d..c92652b6f5 100644 --- a/docs/data/api/menu-positioner.json +++ b/docs/data/api/menu-positioner.json @@ -50,7 +50,7 @@ }, "name": "MenuPositioner", "imports": [ - "import * as Menu from '@base_ui/react/Menu';\nconst MenuPositioner = Menu.Positioner;" + "import { Menu } from '@base_ui/react/Menu';\nconst MenuPositioner = Menu.Positioner;" ], "classes": [], "spread": true, diff --git a/docs/data/api/menu-radio-group.json b/docs/data/api/menu-radio-group.json index 7c93dbc878..5e70dafa46 100644 --- a/docs/data/api/menu-radio-group.json +++ b/docs/data/api/menu-radio-group.json @@ -9,7 +9,7 @@ }, "name": "MenuRadioGroup", "imports": [ - "import * as Menu from '@base_ui/react/Menu';\nconst MenuRadioGroup = Menu.RadioGroup;" + "import { Menu } from '@base_ui/react/Menu';\nconst MenuRadioGroup = Menu.RadioGroup;" ], "classes": [], "spread": true, diff --git a/docs/data/api/menu-radio-item-indicator.json b/docs/data/api/menu-radio-item-indicator.json index 9cd21ccb58..eb88d1bfd4 100644 --- a/docs/data/api/menu-radio-item-indicator.json +++ b/docs/data/api/menu-radio-item-indicator.json @@ -6,7 +6,7 @@ }, "name": "MenuRadioItemIndicator", "imports": [ - "import * as Menu from '@base_ui/react/Menu';\nconst MenuRadioItemIndicator = Menu.RadioItemIndicator;" + "import { Menu } from '@base_ui/react/Menu';\nconst MenuRadioItemIndicator = Menu.RadioItemIndicator;" ], "classes": [], "spread": true, diff --git a/docs/data/api/menu-radio-item.json b/docs/data/api/menu-radio-item.json index fc3ac0f340..04a1482ed0 100644 --- a/docs/data/api/menu-radio-item.json +++ b/docs/data/api/menu-radio-item.json @@ -8,9 +8,7 @@ "onClick": { "type": { "name": "func" } } }, "name": "MenuRadioItem", - "imports": [ - "import * as Menu from '@base_ui/react/Menu';\nconst MenuRadioItem = Menu.RadioItem;" - ], + "imports": ["import { Menu } from '@base_ui/react/Menu';\nconst MenuRadioItem = Menu.RadioItem;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/menu-root.json b/docs/data/api/menu-root.json index d79474fbb9..216ed45442 100644 --- a/docs/data/api/menu-root.json +++ b/docs/data/api/menu-root.json @@ -19,7 +19,7 @@ } }, "name": "MenuRoot", - "imports": ["import * as Menu from '@base_ui/react/Menu';\nconst MenuRoot = Menu.Root;"], + "imports": ["import { Menu } from '@base_ui/react/Menu';\nconst MenuRoot = Menu.Root;"], "classes": [], "spread": true, "themeDefaultProps": null, diff --git a/docs/data/api/menu-separator.json b/docs/data/api/menu-separator.json index b61e1d1418..afb282bf21 100644 --- a/docs/data/api/menu-separator.json +++ b/docs/data/api/menu-separator.json @@ -5,9 +5,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "MenuSeparator", - "imports": [ - "import * as Menu from '@base_ui/react/Menu';\nconst MenuSeparator = Menu.Separator;" - ], + "imports": ["import { Menu } from '@base_ui/react/Menu';\nconst MenuSeparator = Menu.Separator;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/menu-trigger.json b/docs/data/api/menu-trigger.json index 05e73a2a82..f8f82aa2e0 100644 --- a/docs/data/api/menu-trigger.json +++ b/docs/data/api/menu-trigger.json @@ -7,7 +7,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "MenuTrigger", - "imports": ["import * as Menu from '@base_ui/react/Menu';\nconst MenuTrigger = Menu.Trigger;"], + "imports": ["import { Menu } from '@base_ui/react/Menu';\nconst MenuTrigger = Menu.Trigger;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/number-field-decrement.json b/docs/data/api/number-field-decrement.json index cd1e3cea37..4a622144a6 100644 --- a/docs/data/api/number-field-decrement.json +++ b/docs/data/api/number-field-decrement.json @@ -5,7 +5,7 @@ }, "name": "NumberFieldDecrement", "imports": [ - "import * as NumberField from '@base_ui/react/NumberField';\nconst NumberFieldDecrement = NumberField.Decrement;" + "import { NumberField } from '@base_ui/react/NumberField';\nconst NumberFieldDecrement = NumberField.Decrement;" ], "classes": [], "spread": true, diff --git a/docs/data/api/number-field-group.json b/docs/data/api/number-field-group.json index fc0aa6bafd..c5538cf2aa 100644 --- a/docs/data/api/number-field-group.json +++ b/docs/data/api/number-field-group.json @@ -5,7 +5,7 @@ }, "name": "NumberFieldGroup", "imports": [ - "import * as NumberField from '@base_ui/react/NumberField';\nconst NumberFieldGroup = NumberField.Group;" + "import { NumberField } from '@base_ui/react/NumberField';\nconst NumberFieldGroup = NumberField.Group;" ], "classes": [], "spread": true, diff --git a/docs/data/api/number-field-increment.json b/docs/data/api/number-field-increment.json index ccf741caea..b895d9a1ea 100644 --- a/docs/data/api/number-field-increment.json +++ b/docs/data/api/number-field-increment.json @@ -5,7 +5,7 @@ }, "name": "NumberFieldIncrement", "imports": [ - "import * as NumberField from '@base_ui/react/NumberField';\nconst NumberFieldIncrement = NumberField.Increment;" + "import { NumberField } from '@base_ui/react/NumberField';\nconst NumberFieldIncrement = NumberField.Increment;" ], "classes": [], "spread": true, diff --git a/docs/data/api/number-field-input.json b/docs/data/api/number-field-input.json index e2252d7710..5131ab443d 100644 --- a/docs/data/api/number-field-input.json +++ b/docs/data/api/number-field-input.json @@ -5,7 +5,7 @@ }, "name": "NumberFieldInput", "imports": [ - "import * as NumberField from '@base_ui/react/NumberField';\nconst NumberFieldInput = NumberField.Input;" + "import { NumberField } from '@base_ui/react/NumberField';\nconst NumberFieldInput = NumberField.Input;" ], "classes": [], "spread": true, diff --git a/docs/data/api/number-field-root.json b/docs/data/api/number-field-root.json index 5b3e34aca7..eb10206299 100644 --- a/docs/data/api/number-field-root.json +++ b/docs/data/api/number-field-root.json @@ -33,7 +33,7 @@ }, "name": "NumberFieldRoot", "imports": [ - "import * as NumberField from '@base_ui/react/NumberField';\nconst NumberFieldRoot = NumberField.Root;" + "import { NumberField } from '@base_ui/react/NumberField';\nconst NumberFieldRoot = NumberField.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/number-field-scrub-area-cursor.json b/docs/data/api/number-field-scrub-area-cursor.json index 095efebcb8..006077f922 100644 --- a/docs/data/api/number-field-scrub-area-cursor.json +++ b/docs/data/api/number-field-scrub-area-cursor.json @@ -5,7 +5,7 @@ }, "name": "NumberFieldScrubAreaCursor", "imports": [ - "import * as NumberField from '@base_ui/react/NumberField';\nconst NumberFieldScrubAreaCursor = NumberField.ScrubAreaCursor;" + "import { NumberField } from '@base_ui/react/NumberField';\nconst NumberFieldScrubAreaCursor = NumberField.ScrubAreaCursor;" ], "classes": [], "spread": true, diff --git a/docs/data/api/number-field-scrub-area.json b/docs/data/api/number-field-scrub-area.json index f4c83c1085..e328020db8 100644 --- a/docs/data/api/number-field-scrub-area.json +++ b/docs/data/api/number-field-scrub-area.json @@ -11,7 +11,7 @@ }, "name": "NumberFieldScrubArea", "imports": [ - "import * as NumberField from '@base_ui/react/NumberField';\nconst NumberFieldScrubArea = NumberField.ScrubArea;" + "import { NumberField } from '@base_ui/react/NumberField';\nconst NumberFieldScrubArea = NumberField.ScrubArea;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-arrow.json b/docs/data/api/popover-arrow.json index 278c8cfd65..3e9eb76f28 100644 --- a/docs/data/api/popover-arrow.json +++ b/docs/data/api/popover-arrow.json @@ -6,7 +6,7 @@ }, "name": "PopoverArrow", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverArrow = Popover.Arrow;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverArrow = Popover.Arrow;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-backdrop.json b/docs/data/api/popover-backdrop.json index c2c9ea7605..62b24c08c9 100644 --- a/docs/data/api/popover-backdrop.json +++ b/docs/data/api/popover-backdrop.json @@ -10,7 +10,7 @@ }, "name": "PopoverBackdrop", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverBackdrop = Popover.Backdrop;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverBackdrop = Popover.Backdrop;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-close.json b/docs/data/api/popover-close.json index 31957848c9..cc6e27f185 100644 --- a/docs/data/api/popover-close.json +++ b/docs/data/api/popover-close.json @@ -5,7 +5,7 @@ }, "name": "PopoverClose", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverClose = Popover.Close;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverClose = Popover.Close;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-description.json b/docs/data/api/popover-description.json index b3eeb77f99..6fdaf51d51 100644 --- a/docs/data/api/popover-description.json +++ b/docs/data/api/popover-description.json @@ -5,7 +5,7 @@ }, "name": "PopoverDescription", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverDescription = Popover.Description;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverDescription = Popover.Description;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-popup.json b/docs/data/api/popover-popup.json index 06a36805b0..7a5894df8e 100644 --- a/docs/data/api/popover-popup.json +++ b/docs/data/api/popover-popup.json @@ -5,7 +5,7 @@ }, "name": "PopoverPopup", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverPopup = Popover.Popup;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverPopup = Popover.Popup;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-positioner.json b/docs/data/api/popover-positioner.json index adc5433259..dc1d42a20d 100644 --- a/docs/data/api/popover-positioner.json +++ b/docs/data/api/popover-positioner.json @@ -50,7 +50,7 @@ }, "name": "PopoverPositioner", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverPositioner = Popover.Positioner;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverPositioner = Popover.Positioner;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-root.json b/docs/data/api/popover-root.json index 29da12e967..a18b9808e1 100644 --- a/docs/data/api/popover-root.json +++ b/docs/data/api/popover-root.json @@ -14,7 +14,7 @@ }, "name": "PopoverRoot", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverRoot = Popover.Root;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverRoot = Popover.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-title.json b/docs/data/api/popover-title.json index 239fcf2910..b4661b4faf 100644 --- a/docs/data/api/popover-title.json +++ b/docs/data/api/popover-title.json @@ -5,7 +5,7 @@ }, "name": "PopoverTitle", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverTitle = Popover.Title;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverTitle = Popover.Title;" ], "classes": [], "spread": true, diff --git a/docs/data/api/popover-trigger.json b/docs/data/api/popover-trigger.json index cd6204789f..b4b5fb84c1 100644 --- a/docs/data/api/popover-trigger.json +++ b/docs/data/api/popover-trigger.json @@ -5,7 +5,7 @@ }, "name": "PopoverTrigger", "imports": [ - "import * as Popover from '@base_ui/react/Popover';\nconst PopoverTrigger = Popover.Trigger;" + "import { Popover } from '@base_ui/react/Popover';\nconst PopoverTrigger = Popover.Trigger;" ], "classes": [], "spread": true, diff --git a/docs/data/api/preview-card-arrow.json b/docs/data/api/preview-card-arrow.json index a37473e607..bd8d29a514 100644 --- a/docs/data/api/preview-card-arrow.json +++ b/docs/data/api/preview-card-arrow.json @@ -6,7 +6,7 @@ }, "name": "PreviewCardArrow", "imports": [ - "import * as PreviewCard from '@base_ui/react/PreviewCard';\nconst PreviewCardArrow = PreviewCard.Arrow;" + "import { PreviewCard } from '@base_ui/react/PreviewCard';\nconst PreviewCardArrow = PreviewCard.Arrow;" ], "classes": [], "spread": true, diff --git a/docs/data/api/preview-card-backdrop.json b/docs/data/api/preview-card-backdrop.json index ef40f420f1..131edeaef7 100644 --- a/docs/data/api/preview-card-backdrop.json +++ b/docs/data/api/preview-card-backdrop.json @@ -7,7 +7,7 @@ }, "name": "PreviewCardBackdrop", "imports": [ - "import * as PreviewCard from '@base_ui/react/PreviewCard';\nconst PreviewCardBackdrop = PreviewCard.Backdrop;" + "import { PreviewCard } from '@base_ui/react/PreviewCard';\nconst PreviewCardBackdrop = PreviewCard.Backdrop;" ], "classes": [], "spread": true, diff --git a/docs/data/api/preview-card-popup.json b/docs/data/api/preview-card-popup.json index 3d1b7e10a0..18778886b6 100644 --- a/docs/data/api/preview-card-popup.json +++ b/docs/data/api/preview-card-popup.json @@ -5,7 +5,7 @@ }, "name": "PreviewCardPopup", "imports": [ - "import * as PreviewCard from '@base_ui/react/PreviewCard';\nconst PreviewCardPopup = PreviewCard.Popup;" + "import { PreviewCard } from '@base_ui/react/PreviewCard';\nconst PreviewCardPopup = PreviewCard.Popup;" ], "classes": [], "spread": true, diff --git a/docs/data/api/preview-card-positioner.json b/docs/data/api/preview-card-positioner.json index ae28e1f9c6..bf14a1c1ea 100644 --- a/docs/data/api/preview-card-positioner.json +++ b/docs/data/api/preview-card-positioner.json @@ -50,7 +50,7 @@ }, "name": "PreviewCardPositioner", "imports": [ - "import * as PreviewCard from '@base_ui/react/PreviewCard';\nconst PreviewCardPositioner = PreviewCard.Positioner;" + "import { PreviewCard } from '@base_ui/react/PreviewCard';\nconst PreviewCardPositioner = PreviewCard.Positioner;" ], "classes": [], "spread": true, diff --git a/docs/data/api/preview-card-root.json b/docs/data/api/preview-card-root.json index 02a5916f07..df36fdd356 100644 --- a/docs/data/api/preview-card-root.json +++ b/docs/data/api/preview-card-root.json @@ -13,7 +13,7 @@ }, "name": "PreviewCardRoot", "imports": [ - "import * as PreviewCard from '@base_ui/react/PreviewCard';\nconst PreviewCardRoot = PreviewCard.Root;" + "import { PreviewCard } from '@base_ui/react/PreviewCard';\nconst PreviewCardRoot = PreviewCard.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/preview-card-trigger.json b/docs/data/api/preview-card-trigger.json index 4fa0b2fa94..c6052f1b78 100644 --- a/docs/data/api/preview-card-trigger.json +++ b/docs/data/api/preview-card-trigger.json @@ -5,7 +5,7 @@ }, "name": "PreviewCardTrigger", "imports": [ - "import * as PreviewCard from '@base_ui/react/PreviewCard';\nconst PreviewCardTrigger = PreviewCard.Trigger;" + "import { PreviewCard } from '@base_ui/react/PreviewCard';\nconst PreviewCardTrigger = PreviewCard.Trigger;" ], "classes": [], "spread": true, diff --git a/docs/data/api/progress-indicator.json b/docs/data/api/progress-indicator.json index 533523f185..8e5bbc7cdb 100644 --- a/docs/data/api/progress-indicator.json +++ b/docs/data/api/progress-indicator.json @@ -5,7 +5,7 @@ }, "name": "ProgressIndicator", "imports": [ - "import * as Progress from '@base_ui/react/Progress';\nconst ProgressIndicator = Progress.Indicator;" + "import { Progress } from '@base_ui/react/Progress';\nconst ProgressIndicator = Progress.Indicator;" ], "classes": [], "spread": true, diff --git a/docs/data/api/progress-root.json b/docs/data/api/progress-root.json index 125c799f7f..f1bac0daeb 100644 --- a/docs/data/api/progress-root.json +++ b/docs/data/api/progress-root.json @@ -29,7 +29,7 @@ }, "name": "ProgressRoot", "imports": [ - "import * as Progress from '@base_ui/react/Progress';\nconst ProgressRoot = Progress.Root;" + "import { Progress } from '@base_ui/react/Progress';\nconst ProgressRoot = Progress.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/progress-track.json b/docs/data/api/progress-track.json index 22ed962223..fb0b9370b6 100644 --- a/docs/data/api/progress-track.json +++ b/docs/data/api/progress-track.json @@ -5,7 +5,7 @@ }, "name": "ProgressTrack", "imports": [ - "import * as Progress from '@base_ui/react/Progress';\nconst ProgressTrack = Progress.Track;" + "import { Progress } from '@base_ui/react/Progress';\nconst ProgressTrack = Progress.Track;" ], "classes": [], "spread": true, diff --git a/docs/data/api/radio-group-root.json b/docs/data/api/radio-group-root.json index c18ad3f6c6..064787ec88 100644 --- a/docs/data/api/radio-group-root.json +++ b/docs/data/api/radio-group-root.json @@ -12,7 +12,7 @@ }, "name": "RadioGroupRoot", "imports": [ - "import * as RadioGroup from '@base_ui/react/RadioGroup';\nconst RadioGroupRoot = RadioGroup.Root;" + "import { RadioGroup } from '@base_ui/react/RadioGroup';\nconst RadioGroupRoot = RadioGroup.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/radio-indicator.json b/docs/data/api/radio-indicator.json index 871ffdf1e1..2ddde1f260 100644 --- a/docs/data/api/radio-indicator.json +++ b/docs/data/api/radio-indicator.json @@ -6,7 +6,7 @@ }, "name": "RadioIndicator", "imports": [ - "import * as Radio from '@base_ui/react/Radio';\nconst RadioIndicator = Radio.Indicator;" + "import { Radio } from '@base_ui/react/Radio';\nconst RadioIndicator = Radio.Indicator;" ], "classes": [], "spread": true, diff --git a/docs/data/api/radio-root.json b/docs/data/api/radio-root.json index 277bbc8074..342dc2694b 100644 --- a/docs/data/api/radio-root.json +++ b/docs/data/api/radio-root.json @@ -8,7 +8,7 @@ "required": { "type": { "name": "bool" }, "default": "false" } }, "name": "RadioRoot", - "imports": ["import * as Radio from '@base_ui/react/Radio';\nconst RadioRoot = Radio.Root;"], + "imports": ["import { Radio } from '@base_ui/react/Radio';\nconst RadioRoot = Radio.Root;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/separator-root.json b/docs/data/api/separator-root.json index 3ecf0bed9f..ec0c91e377 100644 --- a/docs/data/api/separator-root.json +++ b/docs/data/api/separator-root.json @@ -5,7 +5,7 @@ }, "name": "SeparatorRoot", "imports": [ - "import * as Separator from '@base_ui/react/Separator';\nconst SeparatorRoot = Separator.Root;" + "import { Separator } from '@base_ui/react/Separator';\nconst SeparatorRoot = Separator.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/slider-control.json b/docs/data/api/slider-control.json index a5a029fd21..d48aef56c0 100644 --- a/docs/data/api/slider-control.json +++ b/docs/data/api/slider-control.json @@ -5,7 +5,7 @@ }, "name": "SliderControl", "imports": [ - "import * as Slider from '@base_ui/react/Slider';\nconst SliderControl = Slider.Control;" + "import { Slider } from '@base_ui/react/Slider';\nconst SliderControl = Slider.Control;" ], "classes": [], "spread": true, diff --git a/docs/data/api/slider-indicator.json b/docs/data/api/slider-indicator.json index f56dec0339..f84c3ee221 100644 --- a/docs/data/api/slider-indicator.json +++ b/docs/data/api/slider-indicator.json @@ -5,7 +5,7 @@ }, "name": "SliderIndicator", "imports": [ - "import * as Slider from '@base_ui/react/Slider';\nconst SliderIndicator = Slider.Indicator;" + "import { Slider } from '@base_ui/react/Slider';\nconst SliderIndicator = Slider.Indicator;" ], "classes": [], "spread": true, diff --git a/docs/data/api/slider-output.json b/docs/data/api/slider-output.json index 674878e398..63690fe610 100644 --- a/docs/data/api/slider-output.json +++ b/docs/data/api/slider-output.json @@ -5,7 +5,7 @@ }, "name": "SliderOutput", "imports": [ - "import * as Slider from '@base_ui/react/Slider';\nconst SliderOutput = Slider.Output;" + "import { Slider } from '@base_ui/react/Slider';\nconst SliderOutput = Slider.Output;" ], "classes": [], "spread": true, diff --git a/docs/data/api/slider-root.json b/docs/data/api/slider-root.json index 6c83045dcb..9bf64ced01 100644 --- a/docs/data/api/slider-root.json +++ b/docs/data/api/slider-root.json @@ -42,7 +42,7 @@ } }, "name": "SliderRoot", - "imports": ["import * as Slider from '@base_ui/react/Slider';\nconst SliderRoot = Slider.Root;"], + "imports": ["import { Slider } from '@base_ui/react/Slider';\nconst SliderRoot = Slider.Root;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/slider-thumb.json b/docs/data/api/slider-thumb.json index 17027ffd04..c0af6817d8 100644 --- a/docs/data/api/slider-thumb.json +++ b/docs/data/api/slider-thumb.json @@ -17,9 +17,7 @@ "render": { "type": { "name": "union", "description": "func
| node" } } }, "name": "SliderThumb", - "imports": [ - "import * as Slider from '@base_ui/react/Slider';\nconst SliderThumb = Slider.Thumb;" - ], + "imports": ["import { Slider } from '@base_ui/react/Slider';\nconst SliderThumb = Slider.Thumb;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/slider-track.json b/docs/data/api/slider-track.json index e226d779a8..eb2d844414 100644 --- a/docs/data/api/slider-track.json +++ b/docs/data/api/slider-track.json @@ -4,9 +4,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "SliderTrack", - "imports": [ - "import * as Slider from '@base_ui/react/Slider';\nconst SliderTrack = Slider.Track;" - ], + "imports": ["import { Slider } from '@base_ui/react/Slider';\nconst SliderTrack = Slider.Track;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/switch-root.json b/docs/data/api/switch-root.json index ab1c15cd36..125ef04119 100644 --- a/docs/data/api/switch-root.json +++ b/docs/data/api/switch-root.json @@ -18,7 +18,7 @@ "required": { "type": { "name": "bool" }, "default": "false" } }, "name": "SwitchRoot", - "imports": ["import * as Switch from '@base_ui/react/Switch';\nconst SwitchRoot = Switch.Root;"], + "imports": ["import { Switch } from '@base_ui/react/Switch';\nconst SwitchRoot = Switch.Root;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/switch-thumb.json b/docs/data/api/switch-thumb.json index 7da6d60ff7..a64466e39d 100644 --- a/docs/data/api/switch-thumb.json +++ b/docs/data/api/switch-thumb.json @@ -4,9 +4,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "SwitchThumb", - "imports": [ - "import * as Switch from '@base_ui/react/Switch';\nconst SwitchThumb = Switch.Thumb;" - ], + "imports": ["import { Switch } from '@base_ui/react/Switch';\nconst SwitchThumb = Switch.Thumb;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/tab-indicator.json b/docs/data/api/tab-indicator.json index e6661a7748..54f4e04e13 100644 --- a/docs/data/api/tab-indicator.json +++ b/docs/data/api/tab-indicator.json @@ -5,7 +5,7 @@ "renderBeforeHydration": { "type": { "name": "bool" }, "default": "false" } }, "name": "TabIndicator", - "imports": ["import * as Tabs from '@base_ui/react/Tabs';\nconst TabIndicator = Tabs.Indicator;"], + "imports": ["import { Tabs } from '@base_ui/react/Tabs';\nconst TabIndicator = Tabs.Indicator;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/tab-panel.json b/docs/data/api/tab-panel.json index dc09c16d64..6221e09bd0 100644 --- a/docs/data/api/tab-panel.json +++ b/docs/data/api/tab-panel.json @@ -6,7 +6,7 @@ "value": { "type": { "name": "any" } } }, "name": "TabPanel", - "imports": ["import * as Tabs from '@base_ui/react/Tabs';\nconst TabPanel = Tabs.Panel;"], + "imports": ["import { Tabs } from '@base_ui/react/Tabs';\nconst TabPanel = Tabs.Panel;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/tab.json b/docs/data/api/tab.json index 02c7d764cb..9fbe333f58 100644 --- a/docs/data/api/tab.json +++ b/docs/data/api/tab.json @@ -5,7 +5,7 @@ "value": { "type": { "name": "any" } } }, "name": "Tab", - "imports": ["import * as Tabs from '@base_ui/react/Tabs';\nconst Tab = Tabs.Tab;"], + "imports": ["import { Tabs } from '@base_ui/react/Tabs';\nconst Tab = Tabs.Tab;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/tabs-list.json b/docs/data/api/tabs-list.json index c6f0fd0e78..c9d641eaeb 100644 --- a/docs/data/api/tabs-list.json +++ b/docs/data/api/tabs-list.json @@ -6,7 +6,7 @@ "render": { "type": { "name": "union", "description": "element
| func" } } }, "name": "TabsList", - "imports": ["import * as Tabs from '@base_ui/react/Tabs';\nconst TabsList = Tabs.List;"], + "imports": ["import { Tabs } from '@base_ui/react/Tabs';\nconst TabsList = Tabs.List;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/tabs-root.json b/docs/data/api/tabs-root.json index 1560c4cc23..4be24aeb81 100644 --- a/docs/data/api/tabs-root.json +++ b/docs/data/api/tabs-root.json @@ -15,7 +15,7 @@ "value": { "type": { "name": "any" } } }, "name": "TabsRoot", - "imports": ["import * as Tabs from '@base_ui/react/Tabs';\nconst TabsRoot = Tabs.Root;"], + "imports": ["import { Tabs } from '@base_ui/react/Tabs';\nconst TabsRoot = Tabs.Root;"], "classes": [], "spread": true, "themeDefaultProps": true, diff --git a/docs/data/api/tooltip-arrow.json b/docs/data/api/tooltip-arrow.json index b0c2e7756b..25368d286a 100644 --- a/docs/data/api/tooltip-arrow.json +++ b/docs/data/api/tooltip-arrow.json @@ -6,7 +6,7 @@ }, "name": "TooltipArrow", "imports": [ - "import * as Tooltip from '@base_ui/react/Tooltip';\nconst TooltipArrow = Tooltip.Arrow;" + "import { Tooltip } from '@base_ui/react/Tooltip';\nconst TooltipArrow = Tooltip.Arrow;" ], "classes": [], "spread": true, diff --git a/docs/data/api/tooltip-popup.json b/docs/data/api/tooltip-popup.json index d9fb393ef9..7cba917a82 100644 --- a/docs/data/api/tooltip-popup.json +++ b/docs/data/api/tooltip-popup.json @@ -5,7 +5,7 @@ }, "name": "TooltipPopup", "imports": [ - "import * as Tooltip from '@base_ui/react/Tooltip';\nconst TooltipPopup = Tooltip.Popup;" + "import { Tooltip } from '@base_ui/react/Tooltip';\nconst TooltipPopup = Tooltip.Popup;" ], "classes": [], "spread": true, diff --git a/docs/data/api/tooltip-positioner.json b/docs/data/api/tooltip-positioner.json index 3d29c4807b..23ca83cce3 100644 --- a/docs/data/api/tooltip-positioner.json +++ b/docs/data/api/tooltip-positioner.json @@ -50,7 +50,7 @@ }, "name": "TooltipPositioner", "imports": [ - "import * as Tooltip from '@base_ui/react/Tooltip';\nconst TooltipPositioner = Tooltip.Positioner;" + "import { Tooltip } from '@base_ui/react/Tooltip';\nconst TooltipPositioner = Tooltip.Positioner;" ], "classes": [], "spread": true, diff --git a/docs/data/api/tooltip-provider.json b/docs/data/api/tooltip-provider.json index aecb4bf44b..3454a0ef25 100644 --- a/docs/data/api/tooltip-provider.json +++ b/docs/data/api/tooltip-provider.json @@ -6,7 +6,7 @@ }, "name": "TooltipProvider", "imports": [ - "import * as Tooltip from '@base_ui/react/Tooltip';\nconst TooltipProvider = Tooltip.Provider;" + "import { Tooltip } from '@base_ui/react/Tooltip';\nconst TooltipProvider = Tooltip.Provider;" ], "classes": [], "spread": true, diff --git a/docs/data/api/tooltip-root.json b/docs/data/api/tooltip-root.json index 268cce71d0..fb548b9ca8 100644 --- a/docs/data/api/tooltip-root.json +++ b/docs/data/api/tooltip-root.json @@ -21,7 +21,7 @@ }, "name": "TooltipRoot", "imports": [ - "import * as Tooltip from '@base_ui/react/Tooltip';\nconst TooltipRoot = Tooltip.Root;" + "import { Tooltip } from '@base_ui/react/Tooltip';\nconst TooltipRoot = Tooltip.Root;" ], "classes": [], "spread": true, diff --git a/docs/data/api/tooltip-trigger.json b/docs/data/api/tooltip-trigger.json index d7727ec84b..e9b46eea5e 100644 --- a/docs/data/api/tooltip-trigger.json +++ b/docs/data/api/tooltip-trigger.json @@ -5,7 +5,7 @@ }, "name": "TooltipTrigger", "imports": [ - "import * as Tooltip from '@base_ui/react/Tooltip';\nconst TooltipTrigger = Tooltip.Trigger;" + "import { Tooltip } from '@base_ui/react/Tooltip';\nconst TooltipTrigger = Tooltip.Trigger;" ], "classes": [], "spread": true, diff --git a/docs/data/components/alert-dialog/AlertDialogIntroduction/css-modules/index.js b/docs/data/components/alert-dialog/AlertDialogIntroduction/css-modules/index.js index dfece4502d..73a50d374c 100644 --- a/docs/data/components/alert-dialog/AlertDialogIntroduction/css-modules/index.js +++ b/docs/data/components/alert-dialog/AlertDialogIntroduction/css-modules/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import classes from './styles.module.css'; export default function AlertDialogIntroduction() { diff --git a/docs/data/components/alert-dialog/AlertDialogIntroduction/css-modules/index.tsx b/docs/data/components/alert-dialog/AlertDialogIntroduction/css-modules/index.tsx index dfece4502d..73a50d374c 100644 --- a/docs/data/components/alert-dialog/AlertDialogIntroduction/css-modules/index.tsx +++ b/docs/data/components/alert-dialog/AlertDialogIntroduction/css-modules/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import classes from './styles.module.css'; export default function AlertDialogIntroduction() { diff --git a/docs/data/components/alert-dialog/AlertDialogIntroduction/system/index.js b/docs/data/components/alert-dialog/AlertDialogIntroduction/system/index.js index d61c8a6af0..72336480b6 100644 --- a/docs/data/components/alert-dialog/AlertDialogIntroduction/system/index.js +++ b/docs/data/components/alert-dialog/AlertDialogIntroduction/system/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import { styled } from '@mui/system'; export default function AlertDialogIntroduction() { diff --git a/docs/data/components/alert-dialog/AlertDialogIntroduction/system/index.tsx b/docs/data/components/alert-dialog/AlertDialogIntroduction/system/index.tsx index d61c8a6af0..72336480b6 100644 --- a/docs/data/components/alert-dialog/AlertDialogIntroduction/system/index.tsx +++ b/docs/data/components/alert-dialog/AlertDialogIntroduction/system/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import { styled } from '@mui/system'; export default function AlertDialogIntroduction() { diff --git a/docs/data/components/alert-dialog/AlertDialogIntroduction/tailwind/index.js b/docs/data/components/alert-dialog/AlertDialogIntroduction/tailwind/index.js index 282a7bada9..a01762d0d8 100644 --- a/docs/data/components/alert-dialog/AlertDialogIntroduction/tailwind/index.js +++ b/docs/data/components/alert-dialog/AlertDialogIntroduction/tailwind/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; export default function UnstyledDialogIntroduction() { return ( diff --git a/docs/data/components/alert-dialog/AlertDialogIntroduction/tailwind/index.tsx b/docs/data/components/alert-dialog/AlertDialogIntroduction/tailwind/index.tsx index c667df7e4f..17c58e16a1 100644 --- a/docs/data/components/alert-dialog/AlertDialogIntroduction/tailwind/index.tsx +++ b/docs/data/components/alert-dialog/AlertDialogIntroduction/tailwind/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; export default function UnstyledDialogIntroduction() { return ( diff --git a/docs/data/components/alert-dialog/AlertDialogWithTransitions.js b/docs/data/components/alert-dialog/AlertDialogWithTransitions.js index e1a4044c40..321e5e713a 100644 --- a/docs/data/components/alert-dialog/AlertDialogWithTransitions.js +++ b/docs/data/components/alert-dialog/AlertDialogWithTransitions.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseAlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog as BaseAlertDialog } from '@base_ui/react/AlertDialog'; import { styled } from '@mui/system'; export default function AlertDialogWithTransitions() { diff --git a/docs/data/components/alert-dialog/AlertDialogWithTransitions.tsx b/docs/data/components/alert-dialog/AlertDialogWithTransitions.tsx index e1a4044c40..321e5e713a 100644 --- a/docs/data/components/alert-dialog/AlertDialogWithTransitions.tsx +++ b/docs/data/components/alert-dialog/AlertDialogWithTransitions.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseAlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog as BaseAlertDialog } from '@base_ui/react/AlertDialog'; import { styled } from '@mui/system'; export default function AlertDialogWithTransitions() { diff --git a/docs/data/components/alert-dialog/NestedAlertDialogs.js b/docs/data/components/alert-dialog/NestedAlertDialogs.js index 3e54627ca1..4fc25e829f 100644 --- a/docs/data/components/alert-dialog/NestedAlertDialogs.js +++ b/docs/data/components/alert-dialog/NestedAlertDialogs.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseAlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog as BaseAlertDialog } from '@base_ui/react/AlertDialog'; import { styled } from '@mui/system'; export default function NestedAlertDialogs() { diff --git a/docs/data/components/alert-dialog/NestedAlertDialogs.tsx b/docs/data/components/alert-dialog/NestedAlertDialogs.tsx index 3e54627ca1..4fc25e829f 100644 --- a/docs/data/components/alert-dialog/NestedAlertDialogs.tsx +++ b/docs/data/components/alert-dialog/NestedAlertDialogs.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseAlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog as BaseAlertDialog } from '@base_ui/react/AlertDialog'; import { styled } from '@mui/system'; export default function NestedAlertDialogs() { diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js index 6bd20db611..c98646c9e6 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js @@ -1,8 +1,8 @@ 'use client'; import * as React from 'react'; -import * as Checkbox from '@base_ui/react/Checkbox'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Field from '@base_ui/react/Field'; +import { Checkbox } from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Field } from '@base_ui/react/Field'; export default function UnstyledCheckboxIndeterminateGroup() { return ( diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx index 3d7b05826b..6354c14fd3 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx @@ -1,8 +1,8 @@ 'use client'; import * as React from 'react'; -import * as Checkbox from '@base_ui/react/Checkbox'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Field from '@base_ui/react/Field'; +import { Checkbox } from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Field } from '@base_ui/react/Field'; export default function UnstyledCheckboxIndeterminateGroup() { return ( diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js index 1033cfc870..e9a4e28e44 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js @@ -1,9 +1,9 @@ 'use client'; import * as React from 'react'; import { css, styled } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Field from '@base_ui/react/Field'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Field } from '@base_ui/react/Field'; export default function UnstyledCheckboxIndeterminateGroup() { return ( diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx index a83acafc02..3cf31369e5 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx @@ -1,9 +1,9 @@ 'use client'; import * as React from 'react'; import { css, styled } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Field from '@base_ui/react/Field'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Field } from '@base_ui/react/Field'; export default function UnstyledCheckboxIndeterminateGroup() { return ( diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js index 577e7db15f..2dd01a12d6 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js @@ -2,9 +2,9 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { useTheme } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Field from '@base_ui/react/Field'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Field } from '@base_ui/react/Field'; function classNames(...classes) { return classes.filter(Boolean).join(' '); diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx index 3169ca830f..a0a666edf4 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx @@ -1,9 +1,9 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Field from '@base_ui/react/Field'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Field } from '@base_ui/react/Field'; function classNames(...classes: Array) { return classes.filter(Boolean).join(' '); diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js index c70d40384f..9201619d6d 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js @@ -1,8 +1,8 @@ 'use client'; import * as React from 'react'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Field from '@base_ui/react/Field'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; const colors = ['red', 'green', 'blue']; diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx index 13326baf0b..649d3e5d8f 100644 --- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx +++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx @@ -1,8 +1,8 @@ 'use client'; import * as React from 'react'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Field from '@base_ui/react/Field'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; const colors = ['red', 'green', 'blue']; diff --git a/docs/data/components/checkbox-group/checkbox-group.mdx b/docs/data/components/checkbox-group/checkbox-group.mdx index e113cb30c7..851d14b84a 100644 --- a/docs/data/components/checkbox-group/checkbox-group.mdx +++ b/docs/data/components/checkbox-group/checkbox-group.mdx @@ -39,7 +39,7 @@ Checkbox Group is composed of a `Root` component and `Checkbox` components: `Field` components are used to label the Checkbox Group and individual Checkboxes: ```jsx -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; ``` ```tsx diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js index 786d49acc6..edb83d1019 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; export default function UnstyledCheckboxIndeterminate() { return ( diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx index 3b9e87f9a0..07c87a75c6 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; export default function UnstyledCheckboxIndeterminate() { return ( diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js index 44234bb4c9..7415e06370 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; const colors = ['Red', 'Green', 'Blue']; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx index f6907fe196..3c60042b8a 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; const colors = ['Red', 'Green', 'Blue']; diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js index b4a264dad6..a5b0de642d 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Checkbox from '@base_ui/react/Checkbox'; +import { Checkbox } from '@base_ui/react/Checkbox'; import { useTheme } from '@mui/system'; export default function UnstyledCheckboxIntroduction() { diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx index 758acd41b7..1605c4e7cc 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Checkbox from '@base_ui/react/Checkbox'; +import { Checkbox } from '@base_ui/react/Checkbox'; import { useTheme } from '@mui/system'; export default function UnstyledCheckboxIntroduction() { diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js index d5004c166a..b4e424d547 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; export default function UnstyledSwitchIntroduction() { return ( diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx index 599539a6ef..155601a9fb 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; export default function UnstyledSwitchIntroduction() { return ( diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js index f27426ca21..42197c24eb 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; import { useTheme } from '@mui/system'; function classNames(...classes) { diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx index 595509db45..9175a5bf8c 100644 --- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx +++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseCheckbox from '@base_ui/react/Checkbox'; +import { Checkbox as BaseCheckbox } from '@base_ui/react/Checkbox'; import { useTheme } from '@mui/system'; function classNames(...classes: Array) { diff --git a/docs/data/components/collapsible/CssAnimatedCollapsible.js b/docs/data/components/collapsible/CssAnimatedCollapsible.js index fe5e8fd2d9..78f52dab8a 100644 --- a/docs/data/components/collapsible/CssAnimatedCollapsible.js +++ b/docs/data/components/collapsible/CssAnimatedCollapsible.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; export default function CssAnimatedCollapsible() { const [open, setOpen] = React.useState(true); diff --git a/docs/data/components/collapsible/CssAnimatedCollapsible.tsx b/docs/data/components/collapsible/CssAnimatedCollapsible.tsx index fe5e8fd2d9..78f52dab8a 100644 --- a/docs/data/components/collapsible/CssAnimatedCollapsible.tsx +++ b/docs/data/components/collapsible/CssAnimatedCollapsible.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; export default function CssAnimatedCollapsible() { const [open, setOpen] = React.useState(true); diff --git a/docs/data/components/collapsible/CssTransitionCollapsible.js b/docs/data/components/collapsible/CssTransitionCollapsible.js index 164082bb74..0243c54177 100644 --- a/docs/data/components/collapsible/CssTransitionCollapsible.js +++ b/docs/data/components/collapsible/CssTransitionCollapsible.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; export default function CssTransitionCollapsible() { const [open, setOpen] = React.useState(true); diff --git a/docs/data/components/collapsible/CssTransitionCollapsible.tsx b/docs/data/components/collapsible/CssTransitionCollapsible.tsx index 164082bb74..0243c54177 100644 --- a/docs/data/components/collapsible/CssTransitionCollapsible.tsx +++ b/docs/data/components/collapsible/CssTransitionCollapsible.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; export default function CssTransitionCollapsible() { const [open, setOpen] = React.useState(true); diff --git a/docs/data/components/collapsible/UnstyledCollapsibleIntroduction.js b/docs/data/components/collapsible/UnstyledCollapsibleIntroduction.js index e829370f9c..40515a2d27 100644 --- a/docs/data/components/collapsible/UnstyledCollapsibleIntroduction.js +++ b/docs/data/components/collapsible/UnstyledCollapsibleIntroduction.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled, useTheme, Box } from '@mui/system'; -import * as BaseCollapsible from '@base_ui/react/Collapsible'; +import { Collapsible as BaseCollapsible } from '@base_ui/react/Collapsible'; const Collapsible = BaseCollapsible.Root; diff --git a/docs/data/components/collapsible/UnstyledCollapsibleIntroduction.tsx b/docs/data/components/collapsible/UnstyledCollapsibleIntroduction.tsx index e829370f9c..40515a2d27 100644 --- a/docs/data/components/collapsible/UnstyledCollapsibleIntroduction.tsx +++ b/docs/data/components/collapsible/UnstyledCollapsibleIntroduction.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled, useTheme, Box } from '@mui/system'; -import * as BaseCollapsible from '@base_ui/react/Collapsible'; +import { Collapsible as BaseCollapsible } from '@base_ui/react/Collapsible'; const Collapsible = BaseCollapsible.Root; diff --git a/docs/data/components/dialog/DialogWithTransitions.js b/docs/data/components/dialog/DialogWithTransitions.js index 7b219eb985..933fe38fa7 100644 --- a/docs/data/components/dialog/DialogWithTransitions.js +++ b/docs/data/components/dialog/DialogWithTransitions.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseDialog from '@base_ui/react/Dialog'; +import { Dialog as BaseDialog } from '@base_ui/react/Dialog'; import { styled } from '@mui/system'; export default function DialogWithTransitions() { diff --git a/docs/data/components/dialog/DialogWithTransitions.tsx b/docs/data/components/dialog/DialogWithTransitions.tsx index 7b219eb985..933fe38fa7 100644 --- a/docs/data/components/dialog/DialogWithTransitions.tsx +++ b/docs/data/components/dialog/DialogWithTransitions.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseDialog from '@base_ui/react/Dialog'; +import { Dialog as BaseDialog } from '@base_ui/react/Dialog'; import { styled } from '@mui/system'; export default function DialogWithTransitions() { diff --git a/docs/data/components/dialog/NestedDialogs.js b/docs/data/components/dialog/NestedDialogs.js index 1ecbc04465..b154fdf961 100644 --- a/docs/data/components/dialog/NestedDialogs.js +++ b/docs/data/components/dialog/NestedDialogs.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseDialog from '@base_ui/react/Dialog'; +import { Dialog as BaseDialog } from '@base_ui/react/Dialog'; import { styled } from '@mui/system'; export default function NestedDialogs() { diff --git a/docs/data/components/dialog/NestedDialogs.tsx b/docs/data/components/dialog/NestedDialogs.tsx index 1ecbc04465..b154fdf961 100644 --- a/docs/data/components/dialog/NestedDialogs.tsx +++ b/docs/data/components/dialog/NestedDialogs.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseDialog from '@base_ui/react/Dialog'; +import { Dialog as BaseDialog } from '@base_ui/react/Dialog'; import { styled } from '@mui/system'; export default function NestedDialogs() { diff --git a/docs/data/components/dialog/UnstyledDialogIntroduction/css-modules/index.js b/docs/data/components/dialog/UnstyledDialogIntroduction/css-modules/index.js index 9e9eaab474..e6868505f4 100644 --- a/docs/data/components/dialog/UnstyledDialogIntroduction/css-modules/index.js +++ b/docs/data/components/dialog/UnstyledDialogIntroduction/css-modules/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import classes from './styles.module.css'; export default function UnstyledDialogIntroduction() { diff --git a/docs/data/components/dialog/UnstyledDialogIntroduction/css-modules/index.tsx b/docs/data/components/dialog/UnstyledDialogIntroduction/css-modules/index.tsx index 9e9eaab474..e6868505f4 100644 --- a/docs/data/components/dialog/UnstyledDialogIntroduction/css-modules/index.tsx +++ b/docs/data/components/dialog/UnstyledDialogIntroduction/css-modules/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import classes from './styles.module.css'; export default function UnstyledDialogIntroduction() { diff --git a/docs/data/components/dialog/UnstyledDialogIntroduction/system/index.js b/docs/data/components/dialog/UnstyledDialogIntroduction/system/index.js index 4129596a8f..6627436c72 100644 --- a/docs/data/components/dialog/UnstyledDialogIntroduction/system/index.js +++ b/docs/data/components/dialog/UnstyledDialogIntroduction/system/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { styled } from '@mui/system'; export default function UnstyledDialogIntroduction() { diff --git a/docs/data/components/dialog/UnstyledDialogIntroduction/system/index.tsx b/docs/data/components/dialog/UnstyledDialogIntroduction/system/index.tsx index 4129596a8f..6627436c72 100644 --- a/docs/data/components/dialog/UnstyledDialogIntroduction/system/index.tsx +++ b/docs/data/components/dialog/UnstyledDialogIntroduction/system/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { styled } from '@mui/system'; export default function UnstyledDialogIntroduction() { diff --git a/docs/data/components/dialog/UnstyledDialogIntroduction/tailwind/index.js b/docs/data/components/dialog/UnstyledDialogIntroduction/tailwind/index.js index f4ebdf05b9..988a1e274b 100644 --- a/docs/data/components/dialog/UnstyledDialogIntroduction/tailwind/index.js +++ b/docs/data/components/dialog/UnstyledDialogIntroduction/tailwind/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; export default function UnstyledDialogIntroduction() { return ( diff --git a/docs/data/components/dialog/UnstyledDialogIntroduction/tailwind/index.tsx b/docs/data/components/dialog/UnstyledDialogIntroduction/tailwind/index.tsx index 5b07e97241..b1127efec9 100644 --- a/docs/data/components/dialog/UnstyledDialogIntroduction/tailwind/index.tsx +++ b/docs/data/components/dialog/UnstyledDialogIntroduction/tailwind/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; export default function UnstyledDialogIntroduction() { return ( diff --git a/docs/data/components/field/UnstyledFieldAsync.js b/docs/data/components/field/UnstyledFieldAsync.js index 92d0baa382..e966a060ed 100644 --- a/docs/data/components/field/UnstyledFieldAsync.js +++ b/docs/data/components/field/UnstyledFieldAsync.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; const cache = new Map(); diff --git a/docs/data/components/field/UnstyledFieldAsync.tsx b/docs/data/components/field/UnstyledFieldAsync.tsx index d560b2107f..60f064b3e3 100644 --- a/docs/data/components/field/UnstyledFieldAsync.tsx +++ b/docs/data/components/field/UnstyledFieldAsync.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; const cache = new Map(); diff --git a/docs/data/components/field/UnstyledFieldIntroduction/system/index.js b/docs/data/components/field/UnstyledFieldIntroduction/system/index.js index e0f42d8ce5..a1dd1e4513 100644 --- a/docs/data/components/field/UnstyledFieldIntroduction/system/index.js +++ b/docs/data/components/field/UnstyledFieldIntroduction/system/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; export default function UnstyledFieldIntroduction() { diff --git a/docs/data/components/field/UnstyledFieldIntroduction/system/index.tsx b/docs/data/components/field/UnstyledFieldIntroduction/system/index.tsx index e0f42d8ce5..a1dd1e4513 100644 --- a/docs/data/components/field/UnstyledFieldIntroduction/system/index.tsx +++ b/docs/data/components/field/UnstyledFieldIntroduction/system/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; export default function UnstyledFieldIntroduction() { diff --git a/docs/data/components/field/UnstyledFieldPassword.js b/docs/data/components/field/UnstyledFieldPassword.js index ccc729cd0c..2e233b17f1 100644 --- a/docs/data/components/field/UnstyledFieldPassword.js +++ b/docs/data/components/field/UnstyledFieldPassword.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; function validate(value) { diff --git a/docs/data/components/field/UnstyledFieldPassword.tsx b/docs/data/components/field/UnstyledFieldPassword.tsx index 1181ef90e5..63adfbdf95 100644 --- a/docs/data/components/field/UnstyledFieldPassword.tsx +++ b/docs/data/components/field/UnstyledFieldPassword.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; function validate(value: string) { diff --git a/docs/data/components/field/UnstyledFieldServerError.js b/docs/data/components/field/UnstyledFieldServerError.js index a9875b9e88..24e281a835 100644 --- a/docs/data/components/field/UnstyledFieldServerError.js +++ b/docs/data/components/field/UnstyledFieldServerError.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; export default function UnstyledFieldServerError() { diff --git a/docs/data/components/field/UnstyledFieldServerError.tsx b/docs/data/components/field/UnstyledFieldServerError.tsx index 35a880e849..edca241ac6 100644 --- a/docs/data/components/field/UnstyledFieldServerError.tsx +++ b/docs/data/components/field/UnstyledFieldServerError.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; type Status = 'initial' | 'loading' | 'success' | 'error'; diff --git a/docs/data/components/fieldset/UnstyledFieldsetIntroduction/system/index.js b/docs/data/components/fieldset/UnstyledFieldsetIntroduction/system/index.js index fc0380e070..24178b06b3 100644 --- a/docs/data/components/fieldset/UnstyledFieldsetIntroduction/system/index.js +++ b/docs/data/components/fieldset/UnstyledFieldsetIntroduction/system/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; -import * as Fieldset from '@base_ui/react/Fieldset'; +import { Field } from '@base_ui/react/Field'; +import { Fieldset } from '@base_ui/react/Fieldset'; import { styled } from '@mui/system'; export default function UnstyledFieldsetIntroduction() { diff --git a/docs/data/components/fieldset/UnstyledFieldsetIntroduction/system/index.tsx b/docs/data/components/fieldset/UnstyledFieldsetIntroduction/system/index.tsx index fc0380e070..24178b06b3 100644 --- a/docs/data/components/fieldset/UnstyledFieldsetIntroduction/system/index.tsx +++ b/docs/data/components/fieldset/UnstyledFieldsetIntroduction/system/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; -import * as Fieldset from '@base_ui/react/Fieldset'; +import { Field } from '@base_ui/react/Field'; +import { Fieldset } from '@base_ui/react/Fieldset'; import { styled } from '@mui/system'; export default function UnstyledFieldsetIntroduction() { diff --git a/docs/data/components/form/FormIntroduction/system/index.js b/docs/data/components/form/FormIntroduction/system/index.js index 2e3d2a2c87..a36554850a 100644 --- a/docs/data/components/form/FormIntroduction/system/index.js +++ b/docs/data/components/form/FormIntroduction/system/index.js @@ -1,9 +1,9 @@ 'use client'; import * as React from 'react'; -import * as Form from '@base_ui/react/Form'; -import * as Fieldset from '@base_ui/react/Fieldset'; -import * as Field from '@base_ui/react/Field'; +import { Form } from '@base_ui/react/Form'; +import { Fieldset } from '@base_ui/react/Fieldset'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; export default function FormIntroduction() { diff --git a/docs/data/components/form/FormIntroduction/system/index.tsx b/docs/data/components/form/FormIntroduction/system/index.tsx index be54ebd504..e4b3bb49ec 100644 --- a/docs/data/components/form/FormIntroduction/system/index.tsx +++ b/docs/data/components/form/FormIntroduction/system/index.tsx @@ -1,9 +1,9 @@ 'use client'; import * as React from 'react'; -import * as Form from '@base_ui/react/Form'; -import * as Fieldset from '@base_ui/react/Fieldset'; -import * as Field from '@base_ui/react/Field'; +import { Form } from '@base_ui/react/Form'; +import { Fieldset } from '@base_ui/react/Fieldset'; +import { Field } from '@base_ui/react/Field'; import { styled } from '@mui/system'; type Status = 'initial' | 'loading' | 'success' | 'error'; diff --git a/docs/data/components/form/form.mdx b/docs/data/components/form/form.mdx index 72eaf9a5a2..999b0bcaf8 100644 --- a/docs/data/components/form/form.mdx +++ b/docs/data/components/form/form.mdx @@ -37,8 +37,8 @@ Forms are implemented using a `Root` component and `Field` components: Forms are intended to be used with the `Field` component, which provides labeling and validation for individual form controls. These are nested inside `Form.Root`: ```ts -import * as Form from '@base_ui/react/Form'; -import * as Field from '@base_ui/react/Field'; +import { Form } from '@base_ui/react/Form'; +import { Field } from '@base_ui/react/Field'; ``` ```jsx diff --git a/docs/data/components/menu/CheckboxItems.js b/docs/data/components/menu/CheckboxItems.js index 8b316c8b4d..0dd752b869 100644 --- a/docs/data/components/menu/CheckboxItems.js +++ b/docs/data/components/menu/CheckboxItems.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { styled } from '@mui/system'; export default function CheckboxItems() { diff --git a/docs/data/components/menu/CheckboxItems.tsx b/docs/data/components/menu/CheckboxItems.tsx index 930e8c7093..1efbbd4ded 100644 --- a/docs/data/components/menu/CheckboxItems.tsx +++ b/docs/data/components/menu/CheckboxItems.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { styled } from '@mui/system'; export default function CheckboxItems() { diff --git a/docs/data/components/menu/MenuIntroduction/css-modules/Menu.js b/docs/data/components/menu/MenuIntroduction/css-modules/Menu.js index d5c3d1b7f9..37fec5c5a0 100644 --- a/docs/data/components/menu/MenuIntroduction/css-modules/Menu.js +++ b/docs/data/components/menu/MenuIntroduction/css-modules/Menu.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; -import * as BaseMenu from '@base_ui/react/Menu'; +import { Menu as BaseMenu } from '@base_ui/react/Menu'; import classes from './Menu.module.css'; export const Menu = BaseMenu.Root; diff --git a/docs/data/components/menu/MenuIntroduction/css-modules/Menu.tsx b/docs/data/components/menu/MenuIntroduction/css-modules/Menu.tsx index 81ee796e8d..87def4d726 100644 --- a/docs/data/components/menu/MenuIntroduction/css-modules/Menu.tsx +++ b/docs/data/components/menu/MenuIntroduction/css-modules/Menu.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseMenu from '@base_ui/react/Menu'; +import { Menu as BaseMenu } from '@base_ui/react/Menu'; import classes from './Menu.module.css'; export const Menu = BaseMenu.Root; diff --git a/docs/data/components/menu/MenuIntroduction/system/index.js b/docs/data/components/menu/MenuIntroduction/system/index.js index 945f5bd820..3b7dca224d 100644 --- a/docs/data/components/menu/MenuIntroduction/system/index.js +++ b/docs/data/components/menu/MenuIntroduction/system/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { styled } from '@mui/system'; export default function MenuIntroduction() { diff --git a/docs/data/components/menu/MenuIntroduction/system/index.tsx b/docs/data/components/menu/MenuIntroduction/system/index.tsx index 587097e711..a45fce9797 100644 --- a/docs/data/components/menu/MenuIntroduction/system/index.tsx +++ b/docs/data/components/menu/MenuIntroduction/system/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { styled } from '@mui/system'; export default function MenuIntroduction() { diff --git a/docs/data/components/menu/MenuIntroduction/tailwind/index.js b/docs/data/components/menu/MenuIntroduction/tailwind/index.js index c88827b7e7..74361643e0 100644 --- a/docs/data/components/menu/MenuIntroduction/tailwind/index.js +++ b/docs/data/components/menu/MenuIntroduction/tailwind/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/menu/MenuIntroduction/tailwind/index.tsx b/docs/data/components/menu/MenuIntroduction/tailwind/index.tsx index 61821bb4a3..c1203da2e1 100644 --- a/docs/data/components/menu/MenuIntroduction/tailwind/index.tsx +++ b/docs/data/components/menu/MenuIntroduction/tailwind/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/menu/NestedMenu.js b/docs/data/components/menu/NestedMenu.js index 82d31a8227..32a7cca1f3 100644 --- a/docs/data/components/menu/NestedMenu.js +++ b/docs/data/components/menu/NestedMenu.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { styled } from '@mui/system'; export default function NestedMenu() { diff --git a/docs/data/components/menu/NestedMenu.tsx b/docs/data/components/menu/NestedMenu.tsx index 9eb43acaf5..b13f069b10 100644 --- a/docs/data/components/menu/NestedMenu.tsx +++ b/docs/data/components/menu/NestedMenu.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { styled } from '@mui/system'; export default function NestedMenu() { diff --git a/docs/data/components/menu/RadioItems.js b/docs/data/components/menu/RadioItems.js index 314d6f34db..e00fdf1fd3 100644 --- a/docs/data/components/menu/RadioItems.js +++ b/docs/data/components/menu/RadioItems.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { styled } from '@mui/system'; export default function RadioItems() { diff --git a/docs/data/components/menu/RadioItems.tsx b/docs/data/components/menu/RadioItems.tsx index 314d6f34db..e00fdf1fd3 100644 --- a/docs/data/components/menu/RadioItems.tsx +++ b/docs/data/components/menu/RadioItems.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { styled } from '@mui/system'; export default function RadioItems() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldFormat.js b/docs/data/components/number-field/UnstyledNumberFieldFormat.js index 6354175c3b..250b324265 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldFormat.js +++ b/docs/data/components/number-field/UnstyledNumberFieldFormat.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; import { styled, css } from '@mui/system'; export default function UnstyledNumberFieldFormat() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldFormat.tsx b/docs/data/components/number-field/UnstyledNumberFieldFormat.tsx index 6354175c3b..250b324265 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldFormat.tsx +++ b/docs/data/components/number-field/UnstyledNumberFieldFormat.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; import { styled, css } from '@mui/system'; export default function UnstyledNumberFieldFormat() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/css-modules/index.js b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/css-modules/index.js index f4919cd483..799163407e 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/css-modules/index.js +++ b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/css-modules/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as NumberField from '@base_ui/react/NumberField'; +import { NumberField } from '@base_ui/react/NumberField'; import { useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/css-modules/index.tsx b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/css-modules/index.tsx index f4919cd483..799163407e 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/css-modules/index.tsx +++ b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/css-modules/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as NumberField from '@base_ui/react/NumberField'; +import { NumberField } from '@base_ui/react/NumberField'; import { useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/system/index.js b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/system/index.js index 0ecfce83ea..d93b97b1fa 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/system/index.js +++ b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/system/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; -import * as Field from '@base_ui/react/Field'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; +import { Field } from '@base_ui/react/Field'; import { css, styled, useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/system/index.tsx b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/system/index.tsx index 0ecfce83ea..d93b97b1fa 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/system/index.tsx +++ b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/system/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; -import * as Field from '@base_ui/react/Field'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; +import { Field } from '@base_ui/react/Field'; import { css, styled, useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/tailwind/index.js b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/tailwind/index.js index 7fb70bffe1..465c128cbe 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/tailwind/index.js +++ b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/tailwind/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; -import * as BaseNumberField from '@base_ui/react/NumberField'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; import { useTheme } from '@mui/system'; function classNames(...classes) { diff --git a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/tailwind/index.tsx b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/tailwind/index.tsx index a93e48dcbf..2fddd401f1 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldIntroduction/tailwind/index.tsx +++ b/docs/data/components/number-field/UnstyledNumberFieldIntroduction/tailwind/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; import { useTheme } from '@mui/system'; function classNames(...classes: Array) { diff --git a/docs/data/components/number-field/UnstyledNumberFieldScrub.js b/docs/data/components/number-field/UnstyledNumberFieldScrub.js index 164de5acf1..e1a458e479 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldScrub.js +++ b/docs/data/components/number-field/UnstyledNumberFieldScrub.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; import { styled } from '@mui/system'; export default function UnstyledNumberFieldScrub() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldScrub.tsx b/docs/data/components/number-field/UnstyledNumberFieldScrub.tsx index 164de5acf1..e1a458e479 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldScrub.tsx +++ b/docs/data/components/number-field/UnstyledNumberFieldScrub.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; import { styled } from '@mui/system'; export default function UnstyledNumberFieldScrub() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldWheelScrub.js b/docs/data/components/number-field/UnstyledNumberFieldWheelScrub.js index b0ef9a2b74..f452ec03a4 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldWheelScrub.js +++ b/docs/data/components/number-field/UnstyledNumberFieldWheelScrub.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; import { styled } from '@mui/system'; export default function UnstyledNumberFieldWheelScrub() { diff --git a/docs/data/components/number-field/UnstyledNumberFieldWheelScrub.tsx b/docs/data/components/number-field/UnstyledNumberFieldWheelScrub.tsx index b0ef9a2b74..f452ec03a4 100644 --- a/docs/data/components/number-field/UnstyledNumberFieldWheelScrub.tsx +++ b/docs/data/components/number-field/UnstyledNumberFieldWheelScrub.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseNumberField from '@base_ui/react/NumberField'; +import { NumberField as BaseNumberField } from '@base_ui/react/NumberField'; import { styled } from '@mui/system'; export default function UnstyledNumberFieldWheelScrub() { diff --git a/docs/data/components/popover/UnstyledPopoverIntroduction/system/index.js b/docs/data/components/popover/UnstyledPopoverIntroduction/system/index.js index 38d2d2de2a..dc7cdccd45 100644 --- a/docs/data/components/popover/UnstyledPopoverIntroduction/system/index.js +++ b/docs/data/components/popover/UnstyledPopoverIntroduction/system/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { styled } from '@mui/system'; export default function UnstyledPopoverIntroduction() { diff --git a/docs/data/components/popover/UnstyledPopoverIntroduction/system/index.tsx b/docs/data/components/popover/UnstyledPopoverIntroduction/system/index.tsx index 38d2d2de2a..dc7cdccd45 100644 --- a/docs/data/components/popover/UnstyledPopoverIntroduction/system/index.tsx +++ b/docs/data/components/popover/UnstyledPopoverIntroduction/system/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { styled } from '@mui/system'; export default function UnstyledPopoverIntroduction() { diff --git a/docs/data/components/popover/UnstyledPopoverTransition.js b/docs/data/components/popover/UnstyledPopoverTransition.js index 5e50a7e09c..b0af183593 100644 --- a/docs/data/components/popover/UnstyledPopoverTransition.js +++ b/docs/data/components/popover/UnstyledPopoverTransition.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { styled } from '@mui/system'; export default function UnstyledPopoverTransition() { diff --git a/docs/data/components/popover/UnstyledPopoverTransition.tsx b/docs/data/components/popover/UnstyledPopoverTransition.tsx index 5e50a7e09c..b0af183593 100644 --- a/docs/data/components/popover/UnstyledPopoverTransition.tsx +++ b/docs/data/components/popover/UnstyledPopoverTransition.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { styled } from '@mui/system'; export default function UnstyledPopoverTransition() { diff --git a/docs/data/components/preview-card/UnstyledPreviewCardIntroduction/system/index.js b/docs/data/components/preview-card/UnstyledPreviewCardIntroduction/system/index.js index e7506c5c75..98e97754b0 100644 --- a/docs/data/components/preview-card/UnstyledPreviewCardIntroduction/system/index.js +++ b/docs/data/components/preview-card/UnstyledPreviewCardIntroduction/system/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { styled } from '@mui/system'; export default function UnstyledPreviewCardIntroduction() { diff --git a/docs/data/components/preview-card/UnstyledPreviewCardIntroduction/system/index.tsx b/docs/data/components/preview-card/UnstyledPreviewCardIntroduction/system/index.tsx index e7506c5c75..98e97754b0 100644 --- a/docs/data/components/preview-card/UnstyledPreviewCardIntroduction/system/index.tsx +++ b/docs/data/components/preview-card/UnstyledPreviewCardIntroduction/system/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { styled } from '@mui/system'; export default function UnstyledPreviewCardIntroduction() { diff --git a/docs/data/components/preview-card/UnstyledPreviewCardTransition.js b/docs/data/components/preview-card/UnstyledPreviewCardTransition.js index 346ba7917e..0c40c75881 100644 --- a/docs/data/components/preview-card/UnstyledPreviewCardTransition.js +++ b/docs/data/components/preview-card/UnstyledPreviewCardTransition.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { styled } from '@mui/system'; export default function UnstyledPreviewCardTransition() { diff --git a/docs/data/components/preview-card/UnstyledPreviewCardTransition.tsx b/docs/data/components/preview-card/UnstyledPreviewCardTransition.tsx index 346ba7917e..0c40c75881 100644 --- a/docs/data/components/preview-card/UnstyledPreviewCardTransition.tsx +++ b/docs/data/components/preview-card/UnstyledPreviewCardTransition.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { styled } from '@mui/system'; export default function UnstyledPreviewCardTransition() { diff --git a/docs/data/components/progress/IndeterminateProgress.js b/docs/data/components/progress/IndeterminateProgress.js index b3195b7a1f..2b81c447f5 100644 --- a/docs/data/components/progress/IndeterminateProgress.js +++ b/docs/data/components/progress/IndeterminateProgress.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseProgress from '@base_ui/react/Progress'; +import { Progress as BaseProgress } from '@base_ui/react/Progress'; import { Box, styled, keyframes, css } from '@mui/system'; export default function IndeterminateProgress() { diff --git a/docs/data/components/progress/IndeterminateProgress.tsx b/docs/data/components/progress/IndeterminateProgress.tsx index b3195b7a1f..2b81c447f5 100644 --- a/docs/data/components/progress/IndeterminateProgress.tsx +++ b/docs/data/components/progress/IndeterminateProgress.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseProgress from '@base_ui/react/Progress'; +import { Progress as BaseProgress } from '@base_ui/react/Progress'; import { Box, styled, keyframes, css } from '@mui/system'; export default function IndeterminateProgress() { diff --git a/docs/data/components/progress/RtlProgress.js b/docs/data/components/progress/RtlProgress.js index 1c95abdc82..6654e62b65 100644 --- a/docs/data/components/progress/RtlProgress.js +++ b/docs/data/components/progress/RtlProgress.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseProgress from '@base_ui/react/Progress'; +import { Progress as BaseProgress } from '@base_ui/react/Progress'; import { Box, styled } from '@mui/system'; export default function RtlProgress() { diff --git a/docs/data/components/progress/RtlProgress.tsx b/docs/data/components/progress/RtlProgress.tsx index 1c95abdc82..6654e62b65 100644 --- a/docs/data/components/progress/RtlProgress.tsx +++ b/docs/data/components/progress/RtlProgress.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseProgress from '@base_ui/react/Progress'; +import { Progress as BaseProgress } from '@base_ui/react/Progress'; import { Box, styled } from '@mui/system'; export default function RtlProgress() { diff --git a/docs/data/components/progress/UnstyledProgressIntroduction/css-modules/index.js b/docs/data/components/progress/UnstyledProgressIntroduction/css-modules/index.js index bee6da9c00..5a2c23b5a6 100644 --- a/docs/data/components/progress/UnstyledProgressIntroduction/css-modules/index.js +++ b/docs/data/components/progress/UnstyledProgressIntroduction/css-modules/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Progress from '@base_ui/react/Progress'; +import { Progress } from '@base_ui/react/Progress'; export default function UnstyledProgressIntroduction() { return ( diff --git a/docs/data/components/progress/UnstyledProgressIntroduction/css-modules/index.tsx b/docs/data/components/progress/UnstyledProgressIntroduction/css-modules/index.tsx index bee6da9c00..5a2c23b5a6 100644 --- a/docs/data/components/progress/UnstyledProgressIntroduction/css-modules/index.tsx +++ b/docs/data/components/progress/UnstyledProgressIntroduction/css-modules/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Progress from '@base_ui/react/Progress'; +import { Progress } from '@base_ui/react/Progress'; export default function UnstyledProgressIntroduction() { return ( diff --git a/docs/data/components/progress/UnstyledProgressIntroduction/system/index.js b/docs/data/components/progress/UnstyledProgressIntroduction/system/index.js index 750a30a67e..435d7d43b1 100644 --- a/docs/data/components/progress/UnstyledProgressIntroduction/system/index.js +++ b/docs/data/components/progress/UnstyledProgressIntroduction/system/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled, useTheme, Box } from '@mui/system'; -import * as BaseProgress from '@base_ui/react/Progress'; +import { Progress as BaseProgress } from '@base_ui/react/Progress'; export default function UnstyledProgressIntroduction() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/progress/UnstyledProgressIntroduction/system/index.tsx b/docs/data/components/progress/UnstyledProgressIntroduction/system/index.tsx index 750a30a67e..435d7d43b1 100644 --- a/docs/data/components/progress/UnstyledProgressIntroduction/system/index.tsx +++ b/docs/data/components/progress/UnstyledProgressIntroduction/system/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled, useTheme, Box } from '@mui/system'; -import * as BaseProgress from '@base_ui/react/Progress'; +import { Progress as BaseProgress } from '@base_ui/react/Progress'; export default function UnstyledProgressIntroduction() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.js b/docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.js index 65cdae0d48..41cc11ec57 100644 --- a/docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.js +++ b/docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.js @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { useTheme } from '@mui/system'; -import * as BaseProgress from '@base_ui/react/Progress'; +import { Progress as BaseProgress } from '@base_ui/react/Progress'; export default function UnstyledProgressIntroduction() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.tsx b/docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.tsx index badde71617..650a4198de 100644 --- a/docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.tsx +++ b/docs/data/components/progress/UnstyledProgressIntroduction/tailwind/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as BaseProgress from '@base_ui/react/Progress'; +import { Progress as BaseProgress } from '@base_ui/react/Progress'; export default function UnstyledProgressIntroduction() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/radio-group/UnstyledRadioGroupIntroduction/system/index.js b/docs/data/components/radio-group/UnstyledRadioGroupIntroduction/system/index.js index 37a96630af..f1e246848f 100644 --- a/docs/data/components/radio-group/UnstyledRadioGroupIntroduction/system/index.js +++ b/docs/data/components/radio-group/UnstyledRadioGroupIntroduction/system/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as RadioGroup from '@base_ui/react/RadioGroup'; -import * as Radio from '@base_ui/react/Radio'; +import { RadioGroup } from '@base_ui/react/RadioGroup'; +import { Radio } from '@base_ui/react/Radio'; import { styled } from '@mui/system'; export default function UnstyledRadioGroupIntroduction() { diff --git a/docs/data/components/radio-group/UnstyledRadioGroupIntroduction/system/index.tsx b/docs/data/components/radio-group/UnstyledRadioGroupIntroduction/system/index.tsx index 37a96630af..f1e246848f 100644 --- a/docs/data/components/radio-group/UnstyledRadioGroupIntroduction/system/index.tsx +++ b/docs/data/components/radio-group/UnstyledRadioGroupIntroduction/system/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; -import * as RadioGroup from '@base_ui/react/RadioGroup'; -import * as Radio from '@base_ui/react/Radio'; +import { RadioGroup } from '@base_ui/react/RadioGroup'; +import { Radio } from '@base_ui/react/Radio'; import { styled } from '@mui/system'; export default function UnstyledRadioGroupIntroduction() { diff --git a/docs/data/components/separator/SeparatorIntroduction.js b/docs/data/components/separator/SeparatorIntroduction.js index d22184c6d7..fdacf29656 100644 --- a/docs/data/components/separator/SeparatorIntroduction.js +++ b/docs/data/components/separator/SeparatorIntroduction.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Separator from '@base_ui/react/Separator'; +import { Separator } from '@base_ui/react/Separator'; import { styled } from '@mui/system'; export default function SeparatorIntroduction() { diff --git a/docs/data/components/separator/SeparatorIntroduction.tsx b/docs/data/components/separator/SeparatorIntroduction.tsx index d22184c6d7..fdacf29656 100644 --- a/docs/data/components/separator/SeparatorIntroduction.tsx +++ b/docs/data/components/separator/SeparatorIntroduction.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Separator from '@base_ui/react/Separator'; +import { Separator } from '@base_ui/react/Separator'; import { styled } from '@mui/system'; export default function SeparatorIntroduction() { diff --git a/docs/data/components/slider/RangeSlider.js b/docs/data/components/slider/RangeSlider.js index f8b56822b3..43c1a01582 100644 --- a/docs/data/components/slider/RangeSlider.js +++ b/docs/data/components/slider/RangeSlider.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled, useTheme, Box } from '@mui/system'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; export default function RangeSlider() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/slider/RangeSlider.tsx b/docs/data/components/slider/RangeSlider.tsx index ddb0cdabaa..53279eade9 100644 --- a/docs/data/components/slider/RangeSlider.tsx +++ b/docs/data/components/slider/RangeSlider.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled, useTheme, Box } from '@mui/system'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; export default function RangeSlider() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/slider/RtlSlider.js b/docs/data/components/slider/RtlSlider.js index 13c3d16caf..472dce4697 100644 --- a/docs/data/components/slider/RtlSlider.js +++ b/docs/data/components/slider/RtlSlider.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; import { styled, useTheme, Box } from '@mui/system'; export default function RtlSlider() { diff --git a/docs/data/components/slider/RtlSlider.tsx b/docs/data/components/slider/RtlSlider.tsx index 62f0aea2dd..31961f6289 100644 --- a/docs/data/components/slider/RtlSlider.tsx +++ b/docs/data/components/slider/RtlSlider.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; import { styled, useTheme, Box } from '@mui/system'; export default function RtlSlider() { diff --git a/docs/data/components/slider/UnstyledSliderIntroduction/css-modules/index.js b/docs/data/components/slider/UnstyledSliderIntroduction/css-modules/index.js index 966ce832a2..c5c0546f44 100644 --- a/docs/data/components/slider/UnstyledSliderIntroduction/css-modules/index.js +++ b/docs/data/components/slider/UnstyledSliderIntroduction/css-modules/index.js @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { useTheme } from '@mui/system'; -import * as Slider from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; export default function UnstyledSliderIntroduction() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/slider/UnstyledSliderIntroduction/css-modules/index.tsx b/docs/data/components/slider/UnstyledSliderIntroduction/css-modules/index.tsx index d69cde9cf5..a7ca9c845a 100644 --- a/docs/data/components/slider/UnstyledSliderIntroduction/css-modules/index.tsx +++ b/docs/data/components/slider/UnstyledSliderIntroduction/css-modules/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Slider from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; export default function UnstyledSliderIntroduction() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/slider/UnstyledSliderIntroduction/system/index.js b/docs/data/components/slider/UnstyledSliderIntroduction/system/index.js index dc0b9eec02..61da914e59 100644 --- a/docs/data/components/slider/UnstyledSliderIntroduction/system/index.js +++ b/docs/data/components/slider/UnstyledSliderIntroduction/system/index.js @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { styled, useTheme, Box } from '@mui/system'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; export default function UnstyledSliderIntroduction() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/slider/UnstyledSliderIntroduction/system/index.tsx b/docs/data/components/slider/UnstyledSliderIntroduction/system/index.tsx index 4d971a0cd1..3e07ad98a9 100644 --- a/docs/data/components/slider/UnstyledSliderIntroduction/system/index.tsx +++ b/docs/data/components/slider/UnstyledSliderIntroduction/system/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled, useTheme, Box } from '@mui/system'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; export default function UnstyledSliderIntroduction() { // Replace this with your app logic for determining dark mode diff --git a/docs/data/components/slider/UnstyledSliderIntroduction/tailwind/index.js b/docs/data/components/slider/UnstyledSliderIntroduction/tailwind/index.js index 5f1c308619..5e06ad386d 100644 --- a/docs/data/components/slider/UnstyledSliderIntroduction/tailwind/index.js +++ b/docs/data/components/slider/UnstyledSliderIntroduction/tailwind/index.js @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { useTheme } from '@mui/system'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; function classNames(...classes) { return classes.filter(Boolean).join(' '); diff --git a/docs/data/components/slider/UnstyledSliderIntroduction/tailwind/index.tsx b/docs/data/components/slider/UnstyledSliderIntroduction/tailwind/index.tsx index f079c3ad49..232b324362 100644 --- a/docs/data/components/slider/UnstyledSliderIntroduction/tailwind/index.tsx +++ b/docs/data/components/slider/UnstyledSliderIntroduction/tailwind/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; function classNames(...classes: Array) { return classes.filter(Boolean).join(' '); diff --git a/docs/data/components/slider/VerticalSlider.js b/docs/data/components/slider/VerticalSlider.js index 13c57c833c..0548448e78 100644 --- a/docs/data/components/slider/VerticalSlider.js +++ b/docs/data/components/slider/VerticalSlider.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; -import * as Slider from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; import { useTheme } from '@mui/system'; export default function VerticalSlider() { diff --git a/docs/data/components/slider/VerticalSlider.tsx b/docs/data/components/slider/VerticalSlider.tsx index a535eb341c..e38e7c64a9 100644 --- a/docs/data/components/slider/VerticalSlider.tsx +++ b/docs/data/components/slider/VerticalSlider.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Slider from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; import { useTheme } from '@mui/system'; export default function VerticalSlider() { diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/index.js b/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/index.js index d48f24dbea..3ad7b327dc 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/index.js +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Switch from '@base_ui/react/Switch'; +import { Switch } from '@base_ui/react/Switch'; import classes from './styles.module.css'; export default function UnstyledSwitchIntroduction() { diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/index.tsx b/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/index.tsx index d48f24dbea..3ad7b327dc 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/index.tsx +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/css-modules/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Switch from '@base_ui/react/Switch'; +import { Switch } from '@base_ui/react/Switch'; import classes from './styles.module.css'; export default function UnstyledSwitchIntroduction() { diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.js b/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.js index 12d3ea815e..c8ca0841b0 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.js +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as BaseSwitch from '@base_ui/react/Switch'; +import { Switch as BaseSwitch } from '@base_ui/react/Switch'; export default function UnstyledSwitchIntroduction() { return ( diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.tsx b/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.tsx index 12d3ea815e..c8ca0841b0 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.tsx +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/system/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as BaseSwitch from '@base_ui/react/Switch'; +import { Switch as BaseSwitch } from '@base_ui/react/Switch'; export default function UnstyledSwitchIntroduction() { return ( diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/tailwind/index.js b/docs/data/components/switch/UnstyledSwitchIntroduction/tailwind/index.js index 9343aef64d..53e9b4b232 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/tailwind/index.js +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/tailwind/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseSwitch from '@base_ui/react/Switch'; +import { Switch as BaseSwitch } from '@base_ui/react/Switch'; import { useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/switch/UnstyledSwitchIntroduction/tailwind/index.tsx b/docs/data/components/switch/UnstyledSwitchIntroduction/tailwind/index.tsx index d3c6a6a13f..36874d8928 100644 --- a/docs/data/components/switch/UnstyledSwitchIntroduction/tailwind/index.tsx +++ b/docs/data/components/switch/UnstyledSwitchIntroduction/tailwind/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseSwitch from '@base_ui/react/Switch'; +import { Switch as BaseSwitch } from '@base_ui/react/Switch'; import { useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/tabs/IndicatorBubble.js b/docs/data/components/tabs/IndicatorBubble.js index 6866800e4e..80ce1ffbde 100644 --- a/docs/data/components/tabs/IndicatorBubble.js +++ b/docs/data/components/tabs/IndicatorBubble.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { css, styled } from '@mui/system'; -import * as BaseTabs from '@base_ui/react/Tabs'; +import { Tabs as BaseTabs } from '@base_ui/react/Tabs'; export default function IndicatorBubble() { return ( diff --git a/docs/data/components/tabs/IndicatorBubble.tsx b/docs/data/components/tabs/IndicatorBubble.tsx index 6866800e4e..80ce1ffbde 100644 --- a/docs/data/components/tabs/IndicatorBubble.tsx +++ b/docs/data/components/tabs/IndicatorBubble.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { css, styled } from '@mui/system'; -import * as BaseTabs from '@base_ui/react/Tabs'; +import { Tabs as BaseTabs } from '@base_ui/react/Tabs'; export default function IndicatorBubble() { return ( diff --git a/docs/data/components/tabs/IndicatorUnderline.js b/docs/data/components/tabs/IndicatorUnderline.js index cf78e34dd7..441448e034 100644 --- a/docs/data/components/tabs/IndicatorUnderline.js +++ b/docs/data/components/tabs/IndicatorUnderline.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { css, styled } from '@mui/system'; -import * as BaseTabs from '@base_ui/react/Tabs'; +import { Tabs as BaseTabs } from '@base_ui/react/Tabs'; export default function IndicatorUnderline() { return ( diff --git a/docs/data/components/tabs/IndicatorUnderline.tsx b/docs/data/components/tabs/IndicatorUnderline.tsx index cf78e34dd7..441448e034 100644 --- a/docs/data/components/tabs/IndicatorUnderline.tsx +++ b/docs/data/components/tabs/IndicatorUnderline.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { css, styled } from '@mui/system'; -import * as BaseTabs from '@base_ui/react/Tabs'; +import { Tabs as BaseTabs } from '@base_ui/react/Tabs'; export default function IndicatorUnderline() { return ( diff --git a/docs/data/components/tabs/KeyboardNavigation.js b/docs/data/components/tabs/KeyboardNavigation.js index 163f1229c6..47d402c908 100644 --- a/docs/data/components/tabs/KeyboardNavigation.js +++ b/docs/data/components/tabs/KeyboardNavigation.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; export default function KeyboardNavigation() { return ( diff --git a/docs/data/components/tabs/KeyboardNavigation.tsx b/docs/data/components/tabs/KeyboardNavigation.tsx index 163f1229c6..47d402c908 100644 --- a/docs/data/components/tabs/KeyboardNavigation.tsx +++ b/docs/data/components/tabs/KeyboardNavigation.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; export default function KeyboardNavigation() { return ( diff --git a/docs/data/components/tabs/UnstyledTabsIntroduction/css-modules/index.js b/docs/data/components/tabs/UnstyledTabsIntroduction/css-modules/index.js index 1044ae5137..ba96422e66 100644 --- a/docs/data/components/tabs/UnstyledTabsIntroduction/css-modules/index.js +++ b/docs/data/components/tabs/UnstyledTabsIntroduction/css-modules/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; export default function UnstyledTabsIntroduction() { return ( diff --git a/docs/data/components/tabs/UnstyledTabsIntroduction/css-modules/index.tsx b/docs/data/components/tabs/UnstyledTabsIntroduction/css-modules/index.tsx index 1044ae5137..ba96422e66 100644 --- a/docs/data/components/tabs/UnstyledTabsIntroduction/css-modules/index.tsx +++ b/docs/data/components/tabs/UnstyledTabsIntroduction/css-modules/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { useTheme } from '@mui/system'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; export default function UnstyledTabsIntroduction() { return ( diff --git a/docs/data/components/tabs/UnstyledTabsIntroduction/system/index.js b/docs/data/components/tabs/UnstyledTabsIntroduction/system/index.js index aea0b9744c..021c449cb6 100644 --- a/docs/data/components/tabs/UnstyledTabsIntroduction/system/index.js +++ b/docs/data/components/tabs/UnstyledTabsIntroduction/system/index.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; export default function UnstyledTabsIntroduction() { return ( diff --git a/docs/data/components/tabs/UnstyledTabsIntroduction/system/index.tsx b/docs/data/components/tabs/UnstyledTabsIntroduction/system/index.tsx index aea0b9744c..021c449cb6 100644 --- a/docs/data/components/tabs/UnstyledTabsIntroduction/system/index.tsx +++ b/docs/data/components/tabs/UnstyledTabsIntroduction/system/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { styled } from '@mui/system'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; export default function UnstyledTabsIntroduction() { return ( diff --git a/docs/data/components/tabs/UnstyledTabsIntroduction/tailwind/index.js b/docs/data/components/tabs/UnstyledTabsIntroduction/tailwind/index.js index d8bd50d5bf..fe9fc56258 100644 --- a/docs/data/components/tabs/UnstyledTabsIntroduction/tailwind/index.js +++ b/docs/data/components/tabs/UnstyledTabsIntroduction/tailwind/index.js @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import clsx from 'clsx'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/tabs/UnstyledTabsIntroduction/tailwind/index.tsx b/docs/data/components/tabs/UnstyledTabsIntroduction/tailwind/index.tsx index 92957ad454..609491d86d 100644 --- a/docs/data/components/tabs/UnstyledTabsIntroduction/tailwind/index.tsx +++ b/docs/data/components/tabs/UnstyledTabsIntroduction/tailwind/index.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import clsx from 'clsx'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { useTheme } from '@mui/system'; function useIsDarkMode() { diff --git a/docs/data/components/tabs/UnstyledTabsRouting.js b/docs/data/components/tabs/UnstyledTabsRouting.js index 5bd42b9d89..5782a0785d 100644 --- a/docs/data/components/tabs/UnstyledTabsRouting.js +++ b/docs/data/components/tabs/UnstyledTabsRouting.js @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { MemoryRouter, Route, diff --git a/docs/data/components/tabs/UnstyledTabsRouting.tsx b/docs/data/components/tabs/UnstyledTabsRouting.tsx index fff226d17d..0ff86ac06f 100644 --- a/docs/data/components/tabs/UnstyledTabsRouting.tsx +++ b/docs/data/components/tabs/UnstyledTabsRouting.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { MemoryRouter, Route, diff --git a/docs/data/components/tooltip/UnstyledTooltipDelayGroup.js b/docs/data/components/tooltip/UnstyledTooltipDelayGroup.js index cfe835f234..e886d41b76 100644 --- a/docs/data/components/tooltip/UnstyledTooltipDelayGroup.js +++ b/docs/data/components/tooltip/UnstyledTooltipDelayGroup.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled } from '@mui/system'; export default function UnstyledTooltipDelayGroup() { diff --git a/docs/data/components/tooltip/UnstyledTooltipDelayGroup.tsx b/docs/data/components/tooltip/UnstyledTooltipDelayGroup.tsx index cfe835f234..e886d41b76 100644 --- a/docs/data/components/tooltip/UnstyledTooltipDelayGroup.tsx +++ b/docs/data/components/tooltip/UnstyledTooltipDelayGroup.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled } from '@mui/system'; export default function UnstyledTooltipDelayGroup() { diff --git a/docs/data/components/tooltip/UnstyledTooltipFollowCursor.js b/docs/data/components/tooltip/UnstyledTooltipFollowCursor.js index 1d8e8265a0..cd2f93ed03 100644 --- a/docs/data/components/tooltip/UnstyledTooltipFollowCursor.js +++ b/docs/data/components/tooltip/UnstyledTooltipFollowCursor.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled } from '@mui/system'; export default function UnstyledTooltipFollowCursor() { diff --git a/docs/data/components/tooltip/UnstyledTooltipFollowCursor.tsx b/docs/data/components/tooltip/UnstyledTooltipFollowCursor.tsx index 1d8e8265a0..cd2f93ed03 100644 --- a/docs/data/components/tooltip/UnstyledTooltipFollowCursor.tsx +++ b/docs/data/components/tooltip/UnstyledTooltipFollowCursor.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled } from '@mui/system'; export default function UnstyledTooltipFollowCursor() { diff --git a/docs/data/components/tooltip/UnstyledTooltipIntroduction/system/index.js b/docs/data/components/tooltip/UnstyledTooltipIntroduction/system/index.js index 6d2492f1c7..f729f37638 100644 --- a/docs/data/components/tooltip/UnstyledTooltipIntroduction/system/index.js +++ b/docs/data/components/tooltip/UnstyledTooltipIntroduction/system/index.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled } from '@mui/system'; export default function UnstyledTooltipIntroduction() { diff --git a/docs/data/components/tooltip/UnstyledTooltipIntroduction/system/index.tsx b/docs/data/components/tooltip/UnstyledTooltipIntroduction/system/index.tsx index 6d2492f1c7..f729f37638 100644 --- a/docs/data/components/tooltip/UnstyledTooltipIntroduction/system/index.tsx +++ b/docs/data/components/tooltip/UnstyledTooltipIntroduction/system/index.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled } from '@mui/system'; export default function UnstyledTooltipIntroduction() { diff --git a/docs/data/components/tooltip/UnstyledTooltipTransition.js b/docs/data/components/tooltip/UnstyledTooltipTransition.js index 1ac008c3da..d07593a933 100644 --- a/docs/data/components/tooltip/UnstyledTooltipTransition.js +++ b/docs/data/components/tooltip/UnstyledTooltipTransition.js @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled } from '@mui/system'; export default function UnstyledTooltipTransition() { diff --git a/docs/data/components/tooltip/UnstyledTooltipTransition.tsx b/docs/data/components/tooltip/UnstyledTooltipTransition.tsx index 1ac008c3da..d07593a933 100644 --- a/docs/data/components/tooltip/UnstyledTooltipTransition.tsx +++ b/docs/data/components/tooltip/UnstyledTooltipTransition.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { styled } from '@mui/system'; export default function UnstyledTooltipTransition() { diff --git a/docs/data/getting-started/accessibility/FocusRing.js b/docs/data/getting-started/accessibility/FocusRing.js index d115f561cd..24d3c25be7 100644 --- a/docs/data/getting-started/accessibility/FocusRing.js +++ b/docs/data/getting-started/accessibility/FocusRing.js @@ -1,6 +1,6 @@ import * as React from 'react'; import { styled, alpha, Box } from '@mui/system'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; export default function FocusRing() { return ( diff --git a/docs/data/getting-started/accessibility/FocusRing.tsx b/docs/data/getting-started/accessibility/FocusRing.tsx index d115f561cd..24d3c25be7 100644 --- a/docs/data/getting-started/accessibility/FocusRing.tsx +++ b/docs/data/getting-started/accessibility/FocusRing.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { styled, alpha, Box } from '@mui/system'; -import * as BaseSlider from '@base_ui/react/Slider'; +import { Slider as BaseSlider } from '@base_ui/react/Slider'; export default function FocusRing() { return ( diff --git a/docs/src/blocks/PackageManagerSnippet/PackageManagerSnippetCode.tsx b/docs/src/blocks/PackageManagerSnippet/PackageManagerSnippetCode.tsx index e2d74a1f12..1fd44aa06a 100644 --- a/docs/src/blocks/PackageManagerSnippet/PackageManagerSnippetCode.tsx +++ b/docs/src/blocks/PackageManagerSnippet/PackageManagerSnippetCode.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; export function PackageManagerSnippetCode(props: PackageManagerSnippetCode.Props) { const { value, children } = props; diff --git a/docs/src/blocks/PackageManagerSnippet/PackageManagerSnippetRoot.tsx b/docs/src/blocks/PackageManagerSnippet/PackageManagerSnippetRoot.tsx index a9d8e6c234..cd230bc1cc 100644 --- a/docs/src/blocks/PackageManagerSnippet/PackageManagerSnippetRoot.tsx +++ b/docs/src/blocks/PackageManagerSnippet/PackageManagerSnippetRoot.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; // eslint-disable-next-line no-restricted-imports import { useEnhancedEffect } from '@base_ui/react/utils/useEnhancedEffect'; import { usePackageManagerSnippetContext } from './PackageManagerSnippetProvider'; diff --git a/docs/src/components/DocsVersionSelector.tsx b/docs/src/components/DocsVersionSelector.tsx index f1bb24dea1..9ec9fdd785 100644 --- a/docs/src/components/DocsVersionSelector.tsx +++ b/docs/src/components/DocsVersionSelector.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import { SelectIcon } from 'docs-base/src/icons/Select'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import classes from './DocsVersionSelector.module.css'; export interface DocumentationVersion { diff --git a/docs/src/components/content/InstallationInstructions.tsx b/docs/src/components/content/InstallationInstructions.tsx index c7f5bfcdb6..63d9e1f190 100644 --- a/docs/src/components/content/InstallationInstructions.tsx +++ b/docs/src/components/content/InstallationInstructions.tsx @@ -27,7 +27,7 @@ export function InstallationInstructions(props: InstallationInstructionsProps) {

Once you have the package installed, import the component.

         {componentNames
-          .map((name) => `import * as ${name} from '@base_ui/react/${name}';`)
+          .map((name) => `import { ${name} } from '@base_ui/react/${name}';`)
           .join('\n')}
diff --git a/docs/src/components/demo/Demo.tsx b/docs/src/components/demo/Demo.tsx index cfeb7b6a86..519e82adbf 100644 --- a/docs/src/components/demo/Demo.tsx +++ b/docs/src/components/demo/Demo.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import clsx from 'clsx'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; import { ErrorBoundary } from 'react-error-boundary'; import * as BaseDemo from 'docs-base/src/blocks/Demo'; import { CopyIcon } from 'docs-base/src/icons/Copy'; diff --git a/docs/src/components/demo/DemoFileSelector.tsx b/docs/src/components/demo/DemoFileSelector.tsx index c15610dc3b..ad9bc98b35 100644 --- a/docs/src/components/demo/DemoFileSelector.tsx +++ b/docs/src/components/demo/DemoFileSelector.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import clsx from 'clsx'; import { DemoContext } from 'docs-base/src/blocks/Demo'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import classes from './DemoFileSelector.module.css'; export interface DemoFileSelectorProps { diff --git a/docs/src/design-system/Tooltip.tsx b/docs/src/design-system/Tooltip.tsx index c18a043e4f..c887c66de7 100644 --- a/docs/src/design-system/Tooltip.tsx +++ b/docs/src/design-system/Tooltip.tsx @@ -1,6 +1,6 @@ 'use client'; import * as React from 'react'; -import * as BaseTooltip from '@base_ui/react/Tooltip'; +import { Tooltip as BaseTooltip } from '@base_ui/react/Tooltip'; import classes from './Tooltip.module.css'; export function Tooltip(props: Tooltip.Props) { diff --git a/packages/mui-base/src/AlertDialog/Backdrop/AlertDialogBackdrop.test.tsx b/packages/mui-base/src/AlertDialog/Backdrop/AlertDialogBackdrop.test.tsx index 323a65516c..dc7e7ebc30 100644 --- a/packages/mui-base/src/AlertDialog/Backdrop/AlertDialogBackdrop.test.tsx +++ b/packages/mui-base/src/AlertDialog/Backdrop/AlertDialogBackdrop.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/AlertDialog/Close/AlertDialogClose.test.tsx b/packages/mui-base/src/AlertDialog/Close/AlertDialogClose.test.tsx index 65f4bba906..7490ada7a1 100644 --- a/packages/mui-base/src/AlertDialog/Close/AlertDialogClose.test.tsx +++ b/packages/mui-base/src/AlertDialog/Close/AlertDialogClose.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/AlertDialog/Description/AlertDialogDescription.test.tsx b/packages/mui-base/src/AlertDialog/Description/AlertDialogDescription.test.tsx index da704e271d..802229101a 100644 --- a/packages/mui-base/src/AlertDialog/Description/AlertDialogDescription.test.tsx +++ b/packages/mui-base/src/AlertDialog/Description/AlertDialogDescription.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/AlertDialog/Popup/AlertDialogPopup.test.tsx b/packages/mui-base/src/AlertDialog/Popup/AlertDialogPopup.test.tsx index 40fec96725..e11cd0b2aa 100644 --- a/packages/mui-base/src/AlertDialog/Popup/AlertDialogPopup.test.tsx +++ b/packages/mui-base/src/AlertDialog/Popup/AlertDialogPopup.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/AlertDialog/Title/AlertDialogTitle.test.tsx b/packages/mui-base/src/AlertDialog/Title/AlertDialogTitle.test.tsx index 44ba27380f..d2711e623e 100644 --- a/packages/mui-base/src/AlertDialog/Title/AlertDialogTitle.test.tsx +++ b/packages/mui-base/src/AlertDialog/Title/AlertDialogTitle.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/AlertDialog/Trigger/AlertDialogTrigger.test.tsx b/packages/mui-base/src/AlertDialog/Trigger/AlertDialogTrigger.test.tsx index c06bb9ea50..a4dc6cc128 100644 --- a/packages/mui-base/src/AlertDialog/Trigger/AlertDialogTrigger.test.tsx +++ b/packages/mui-base/src/AlertDialog/Trigger/AlertDialogTrigger.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as AlertDialog from '@base_ui/react/AlertDialog'; +import { AlertDialog } from '@base_ui/react/AlertDialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/AlertDialog/index.barrel.ts b/packages/mui-base/src/AlertDialog/index.barrel.ts deleted file mode 100644 index 281822c580..0000000000 --- a/packages/mui-base/src/AlertDialog/index.barrel.ts +++ /dev/null @@ -1,7 +0,0 @@ -export { AlertDialogBackdrop } from './Backdrop/AlertDialogBackdrop'; -export { AlertDialogClose } from './Close/AlertDialogClose'; -export { AlertDialogDescription } from './Description/AlertDialogDescription'; -export { AlertDialogPopup } from './Popup/AlertDialogPopup'; -export { AlertDialogRoot } from './Root/AlertDialogRoot'; -export { AlertDialogTitle } from './Title/AlertDialogTitle'; -export { AlertDialogTrigger } from './Trigger/AlertDialogTrigger'; diff --git a/packages/mui-base/src/AlertDialog/index.parts.ts b/packages/mui-base/src/AlertDialog/index.parts.ts new file mode 100644 index 0000000000..ad0f1a228c --- /dev/null +++ b/packages/mui-base/src/AlertDialog/index.parts.ts @@ -0,0 +1,7 @@ +export { AlertDialogBackdrop as Backdrop } from './Backdrop/AlertDialogBackdrop'; +export { AlertDialogClose as Close } from './Close/AlertDialogClose'; +export { AlertDialogDescription as Description } from './Description/AlertDialogDescription'; +export { AlertDialogPopup as Popup } from './Popup/AlertDialogPopup'; +export { AlertDialogRoot as Root } from './Root/AlertDialogRoot'; +export { AlertDialogTitle as Title } from './Title/AlertDialogTitle'; +export { AlertDialogTrigger as Trigger } from './Trigger/AlertDialogTrigger'; diff --git a/packages/mui-base/src/AlertDialog/index.ts b/packages/mui-base/src/AlertDialog/index.ts index ad0f1a228c..766a0ca54b 100644 --- a/packages/mui-base/src/AlertDialog/index.ts +++ b/packages/mui-base/src/AlertDialog/index.ts @@ -1,7 +1 @@ -export { AlertDialogBackdrop as Backdrop } from './Backdrop/AlertDialogBackdrop'; -export { AlertDialogClose as Close } from './Close/AlertDialogClose'; -export { AlertDialogDescription as Description } from './Description/AlertDialogDescription'; -export { AlertDialogPopup as Popup } from './Popup/AlertDialogPopup'; -export { AlertDialogRoot as Root } from './Root/AlertDialogRoot'; -export { AlertDialogTitle as Title } from './Title/AlertDialogTitle'; -export { AlertDialogTrigger as Trigger } from './Trigger/AlertDialogTrigger'; +export * as AlertDialog from './index.parts'; diff --git a/packages/mui-base/src/Checkbox/Indicator/CheckboxIndicator.test.tsx b/packages/mui-base/src/Checkbox/Indicator/CheckboxIndicator.test.tsx index 7dbca304df..1bcc780c2e 100644 --- a/packages/mui-base/src/Checkbox/Indicator/CheckboxIndicator.test.tsx +++ b/packages/mui-base/src/Checkbox/Indicator/CheckboxIndicator.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Checkbox from '@base_ui/react/Checkbox'; +import { Checkbox } from '@base_ui/react/Checkbox'; import { createRenderer, describeConformance } from '#test-utils'; import { CheckboxRootContext } from '../Root/CheckboxRootContext'; diff --git a/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx b/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx index 169a0f38aa..40a9eccbe6 100644 --- a/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx +++ b/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { act, fireEvent } from '@mui/internal-test-utils'; -import * as Checkbox from '@base_ui/react/Checkbox'; +import { Checkbox } from '@base_ui/react/Checkbox'; import { createRenderer, describeConformance } from '#test-utils'; const isJSDOM = /jsdom/.test(window.navigator.userAgent); diff --git a/packages/mui-base/src/Checkbox/index.barrel.ts b/packages/mui-base/src/Checkbox/index.barrel.ts deleted file mode 100644 index 5a27a441dc..0000000000 --- a/packages/mui-base/src/Checkbox/index.barrel.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { CheckboxRoot } from './Root/CheckboxRoot'; -export { CheckboxIndicator } from './Indicator/CheckboxIndicator'; diff --git a/packages/mui-base/src/Checkbox/index.parts.ts b/packages/mui-base/src/Checkbox/index.parts.ts new file mode 100644 index 0000000000..c046f6b441 --- /dev/null +++ b/packages/mui-base/src/Checkbox/index.parts.ts @@ -0,0 +1,2 @@ +export { CheckboxRoot as Root } from './Root/CheckboxRoot'; +export { CheckboxIndicator as Indicator } from './Indicator/CheckboxIndicator'; diff --git a/packages/mui-base/src/Checkbox/index.ts b/packages/mui-base/src/Checkbox/index.ts index c046f6b441..4e96104ea3 100644 --- a/packages/mui-base/src/Checkbox/index.ts +++ b/packages/mui-base/src/Checkbox/index.ts @@ -1,2 +1 @@ -export { CheckboxRoot as Root } from './Root/CheckboxRoot'; -export { CheckboxIndicator as Indicator } from './Indicator/CheckboxIndicator'; +export * as Checkbox from './index.parts'; diff --git a/packages/mui-base/src/CheckboxGroup/Parent/useCheckboxGroupParent.test.tsx b/packages/mui-base/src/CheckboxGroup/Parent/useCheckboxGroupParent.test.tsx index a3ae0e9fc7..98cb90bfd4 100644 --- a/packages/mui-base/src/CheckboxGroup/Parent/useCheckboxGroupParent.test.tsx +++ b/packages/mui-base/src/CheckboxGroup/Parent/useCheckboxGroupParent.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { createRenderer, fireEvent, screen } from '@mui/internal-test-utils'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Checkbox from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Checkbox } from '@base_ui/react/Checkbox'; import { expect } from 'chai'; describe('useCheckboxGroupParent', () => { diff --git a/packages/mui-base/src/CheckboxGroup/Root/CheckboxGroupRoot.test.tsx b/packages/mui-base/src/CheckboxGroup/Root/CheckboxGroupRoot.test.tsx index 402769c6aa..e7011b524c 100644 --- a/packages/mui-base/src/CheckboxGroup/Root/CheckboxGroupRoot.test.tsx +++ b/packages/mui-base/src/CheckboxGroup/Root/CheckboxGroupRoot.test.tsx @@ -1,8 +1,8 @@ import * as React from 'react'; import { expect } from 'chai'; import { createRenderer, screen, fireEvent } from '@mui/internal-test-utils'; -import * as CheckboxGroup from '@base_ui/react/CheckboxGroup'; -import * as Checkbox from '@base_ui/react/Checkbox'; +import { CheckboxGroup } from '@base_ui/react/CheckboxGroup'; +import { Checkbox } from '@base_ui/react/Checkbox'; import { describeConformance } from '../../../test/describeConformance'; describe('', () => { diff --git a/packages/mui-base/src/CheckboxGroup/index.barrel.ts b/packages/mui-base/src/CheckboxGroup/index.barrel.ts deleted file mode 100644 index 2f4786b2a0..0000000000 --- a/packages/mui-base/src/CheckboxGroup/index.barrel.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './Root/CheckboxGroupRoot'; diff --git a/packages/mui-base/src/CheckboxGroup/index.parts.ts b/packages/mui-base/src/CheckboxGroup/index.parts.ts new file mode 100644 index 0000000000..dd08fe5b48 --- /dev/null +++ b/packages/mui-base/src/CheckboxGroup/index.parts.ts @@ -0,0 +1 @@ +export { CheckboxGroupRoot as Root } from './Root/CheckboxGroupRoot'; diff --git a/packages/mui-base/src/CheckboxGroup/index.ts b/packages/mui-base/src/CheckboxGroup/index.ts index dd08fe5b48..da7ae148df 100644 --- a/packages/mui-base/src/CheckboxGroup/index.ts +++ b/packages/mui-base/src/CheckboxGroup/index.ts @@ -1 +1 @@ -export { CheckboxGroupRoot as Root } from './Root/CheckboxGroupRoot'; +export * as CheckboxGroup from './index.parts'; diff --git a/packages/mui-base/src/Collapsible/Content/CollapsibleContent.test.tsx b/packages/mui-base/src/Collapsible/Content/CollapsibleContent.test.tsx index 2fa98e940e..435562e031 100644 --- a/packages/mui-base/src/Collapsible/Content/CollapsibleContent.test.tsx +++ b/packages/mui-base/src/Collapsible/Content/CollapsibleContent.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { createRenderer } from '@mui/internal-test-utils'; -import * as Collapsible from '@base_ui/react/Collapsible'; -import { CollapsibleContext } from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; +import { CollapsibleContext } from '../Root/CollapsibleContext'; import { describeConformance } from '../../../test/describeConformance'; const contextValue: Collapsible.Root.Context = { diff --git a/packages/mui-base/src/Collapsible/Root/CollapsibleRoot.test.tsx b/packages/mui-base/src/Collapsible/Root/CollapsibleRoot.test.tsx index d1395b0c28..ec5888e7f9 100644 --- a/packages/mui-base/src/Collapsible/Root/CollapsibleRoot.test.tsx +++ b/packages/mui-base/src/Collapsible/Root/CollapsibleRoot.test.tsx @@ -3,7 +3,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { createRenderer, act } from '@mui/internal-test-utils'; -import * as Collapsible from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; import { describeConformance } from '../../../test/describeConformance'; describe('', () => { diff --git a/packages/mui-base/src/Collapsible/Trigger/CollapsibleTrigger.test.tsx b/packages/mui-base/src/Collapsible/Trigger/CollapsibleTrigger.test.tsx index 13ffe3567a..0e7a77d5d4 100644 --- a/packages/mui-base/src/Collapsible/Trigger/CollapsibleTrigger.test.tsx +++ b/packages/mui-base/src/Collapsible/Trigger/CollapsibleTrigger.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { createRenderer } from '@mui/internal-test-utils'; -import * as Collapsible from '@base_ui/react/Collapsible'; -import { CollapsibleContext } from '@base_ui/react/Collapsible'; +import { Collapsible } from '@base_ui/react/Collapsible'; +import { CollapsibleContext } from '../Root/CollapsibleContext'; import { describeConformance } from '../../../test/describeConformance'; const contextValue: Collapsible.Root.Context = { diff --git a/packages/mui-base/src/Collapsible/index.parts.ts b/packages/mui-base/src/Collapsible/index.parts.ts new file mode 100644 index 0000000000..3736ae4deb --- /dev/null +++ b/packages/mui-base/src/Collapsible/index.parts.ts @@ -0,0 +1,3 @@ +export { CollapsibleRoot as Root } from './Root/CollapsibleRoot'; +export { CollapsibleTrigger as Trigger } from './Trigger/CollapsibleTrigger'; +export { CollapsibleContent as Content } from './Content/CollapsibleContent'; diff --git a/packages/mui-base/src/Collapsible/index.ts b/packages/mui-base/src/Collapsible/index.ts index facd5dee24..6d2cba0c78 100644 --- a/packages/mui-base/src/Collapsible/index.ts +++ b/packages/mui-base/src/Collapsible/index.ts @@ -1,9 +1 @@ -export { CollapsibleRoot as Root } from './Root/CollapsibleRoot'; -export { useCollapsibleRoot } from './Root/useCollapsibleRoot'; -export { CollapsibleContext, useCollapsibleContext } from './Root/CollapsibleContext'; - -export { CollapsibleTrigger as Trigger } from './Trigger/CollapsibleTrigger'; -export { useCollapsibleTrigger } from './Trigger/useCollapsibleTrigger'; - -export { CollapsibleContent as Content } from './Content/CollapsibleContent'; -export { useCollapsibleContent } from './Content/useCollapsibleContent'; +export * as Collapsible from './index.parts'; diff --git a/packages/mui-base/src/Dialog/Backdrop/DialogBackdrop.test.tsx b/packages/mui-base/src/Dialog/Backdrop/DialogBackdrop.test.tsx index f59fdf0fe4..8dead2426f 100644 --- a/packages/mui-base/src/Dialog/Backdrop/DialogBackdrop.test.tsx +++ b/packages/mui-base/src/Dialog/Backdrop/DialogBackdrop.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Dialog/Close/DialogClose.test.tsx b/packages/mui-base/src/Dialog/Close/DialogClose.test.tsx index f91456aa7f..511b620089 100644 --- a/packages/mui-base/src/Dialog/Close/DialogClose.test.tsx +++ b/packages/mui-base/src/Dialog/Close/DialogClose.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Dialog/Description/DialogDescription.test.tsx b/packages/mui-base/src/Dialog/Description/DialogDescription.test.tsx index 31ce4b1588..3bc0abdb06 100644 --- a/packages/mui-base/src/Dialog/Description/DialogDescription.test.tsx +++ b/packages/mui-base/src/Dialog/Description/DialogDescription.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Dialog/Popup/DialogPopup.test.tsx b/packages/mui-base/src/Dialog/Popup/DialogPopup.test.tsx index 056effacd7..7f1114b7ce 100644 --- a/packages/mui-base/src/Dialog/Popup/DialogPopup.test.tsx +++ b/packages/mui-base/src/Dialog/Popup/DialogPopup.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { describeConformance, createRenderer } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx b/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx index 0c7afd8481..6ae50fd2a2 100644 --- a/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx +++ b/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { act, fireEvent, waitFor } from '@mui/internal-test-utils'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { createRenderer } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Dialog/Title/DialogTitle.test.tsx b/packages/mui-base/src/Dialog/Title/DialogTitle.test.tsx index 726da92fb3..92e6f96797 100644 --- a/packages/mui-base/src/Dialog/Title/DialogTitle.test.tsx +++ b/packages/mui-base/src/Dialog/Title/DialogTitle.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Dialog/Trigger/DialogTrigger.test.tsx b/packages/mui-base/src/Dialog/Trigger/DialogTrigger.test.tsx index 07594a959c..14eff99a00 100644 --- a/packages/mui-base/src/Dialog/Trigger/DialogTrigger.test.tsx +++ b/packages/mui-base/src/Dialog/Trigger/DialogTrigger.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Dialog from '@base_ui/react/Dialog'; +import { Dialog } from '@base_ui/react/Dialog'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Dialog/index.barrel.ts b/packages/mui-base/src/Dialog/index.barrel.ts deleted file mode 100644 index b12eac69e0..0000000000 --- a/packages/mui-base/src/Dialog/index.barrel.ts +++ /dev/null @@ -1,7 +0,0 @@ -export { DialogBackdrop } from './Backdrop/DialogBackdrop'; -export { DialogClose } from './Close/DialogClose'; -export { DialogDescription } from './Description/DialogDescription'; -export { DialogPopup } from './Popup/DialogPopup'; -export { DialogRoot } from './Root/DialogRoot'; -export { DialogTitle } from './Title/DialogTitle'; -export { DialogTrigger } from './Trigger/DialogTrigger'; diff --git a/packages/mui-base/src/Dialog/index.parts.ts b/packages/mui-base/src/Dialog/index.parts.ts new file mode 100644 index 0000000000..f242e5602e --- /dev/null +++ b/packages/mui-base/src/Dialog/index.parts.ts @@ -0,0 +1,7 @@ +export { DialogBackdrop as Backdrop } from './Backdrop/DialogBackdrop'; +export { DialogClose as Close } from './Close/DialogClose'; +export { DialogDescription as Description } from './Description/DialogDescription'; +export { DialogPopup as Popup } from './Popup/DialogPopup'; +export { DialogRoot as Root } from './Root/DialogRoot'; +export { DialogTitle as Title } from './Title/DialogTitle'; +export { DialogTrigger as Trigger } from './Trigger/DialogTrigger'; diff --git a/packages/mui-base/src/Dialog/index.ts b/packages/mui-base/src/Dialog/index.ts index f242e5602e..823c17d24f 100644 --- a/packages/mui-base/src/Dialog/index.ts +++ b/packages/mui-base/src/Dialog/index.ts @@ -1,7 +1 @@ -export { DialogBackdrop as Backdrop } from './Backdrop/DialogBackdrop'; -export { DialogClose as Close } from './Close/DialogClose'; -export { DialogDescription as Description } from './Description/DialogDescription'; -export { DialogPopup as Popup } from './Popup/DialogPopup'; -export { DialogRoot as Root } from './Root/DialogRoot'; -export { DialogTitle as Title } from './Title/DialogTitle'; -export { DialogTrigger as Trigger } from './Trigger/DialogTrigger'; +export * as Dialog from './index.parts'; diff --git a/packages/mui-base/src/Field/Control/FieldControl.test.tsx b/packages/mui-base/src/Field/Control/FieldControl.test.tsx index 677cac06af..cf6187722a 100644 --- a/packages/mui-base/src/Field/Control/FieldControl.test.tsx +++ b/packages/mui-base/src/Field/Control/FieldControl.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { createRenderer } from '@mui/internal-test-utils'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { describeConformance } from '../../../test/describeConformance'; describe('', () => { diff --git a/packages/mui-base/src/Field/Description/FieldDescription.test.tsx b/packages/mui-base/src/Field/Description/FieldDescription.test.tsx index 56ade9fbfe..c0aa55deca 100644 --- a/packages/mui-base/src/Field/Description/FieldDescription.test.tsx +++ b/packages/mui-base/src/Field/Description/FieldDescription.test.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; -import * as Checkbox from '@base_ui/react/Checkbox'; -import * as Switch from '@base_ui/react/Switch'; -import * as NumberField from '@base_ui/react/NumberField'; -import * as Slider from '@base_ui/react/Slider'; -import * as RadioGroup from '@base_ui/react/RadioGroup'; -import * as Radio from '@base_ui/react/Radio'; +import { Field } from '@base_ui/react/Field'; +import { Checkbox } from '@base_ui/react/Checkbox'; +import { Switch } from '@base_ui/react/Switch'; +import { NumberField } from '@base_ui/react/NumberField'; +import { Slider } from '@base_ui/react/Slider'; +import { RadioGroup } from '@base_ui/react/RadioGroup'; +import { Radio } from '@base_ui/react/Radio'; import { createRenderer, screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { describeConformance } from '../../../test/describeConformance'; diff --git a/packages/mui-base/src/Field/Error/FieldError.test.tsx b/packages/mui-base/src/Field/Error/FieldError.test.tsx index 0fb6ea967b..1255e35983 100644 --- a/packages/mui-base/src/Field/Error/FieldError.test.tsx +++ b/packages/mui-base/src/Field/Error/FieldError.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { createRenderer, fireEvent, screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; import { describeConformance } from '../../../test/describeConformance'; describe('', () => { diff --git a/packages/mui-base/src/Field/Label/FieldLabel.test.tsx b/packages/mui-base/src/Field/Label/FieldLabel.test.tsx index c1cf8d6453..39424f57cb 100644 --- a/packages/mui-base/src/Field/Label/FieldLabel.test.tsx +++ b/packages/mui-base/src/Field/Label/FieldLabel.test.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; -import * as Checkbox from '@base_ui/react/Checkbox'; -import * as Switch from '@base_ui/react/Switch'; -import * as NumberField from '@base_ui/react/NumberField'; -import * as Slider from '@base_ui/react/Slider'; -import * as RadioGroup from '@base_ui/react/RadioGroup'; -import * as Radio from '@base_ui/react/Radio'; +import { Field } from '@base_ui/react/Field'; +import { Checkbox } from '@base_ui/react/Checkbox'; +import { Switch } from '@base_ui/react/Switch'; +import { NumberField } from '@base_ui/react/NumberField'; +import { Slider } from '@base_ui/react/Slider'; +import { RadioGroup } from '@base_ui/react/RadioGroup'; +import { Radio } from '@base_ui/react/Radio'; import { createRenderer, screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { describeConformance } from '../../../test/describeConformance'; diff --git a/packages/mui-base/src/Field/Root/FieldRoot.test.tsx b/packages/mui-base/src/Field/Root/FieldRoot.test.tsx index a488d80536..8fe0d8b657 100644 --- a/packages/mui-base/src/Field/Root/FieldRoot.test.tsx +++ b/packages/mui-base/src/Field/Root/FieldRoot.test.tsx @@ -1,11 +1,11 @@ import * as React from 'react'; -import * as Field from '@base_ui/react/Field'; -import * as Checkbox from '@base_ui/react/Checkbox'; -import * as Switch from '@base_ui/react/Switch'; -import * as NumberField from '@base_ui/react/NumberField'; -import * as Slider from '@base_ui/react/Slider'; -import * as RadioGroup from '@base_ui/react/RadioGroup'; -import * as Radio from '@base_ui/react/Radio'; +import { Field } from '@base_ui/react/Field'; +import { Checkbox } from '@base_ui/react/Checkbox'; +import { Switch } from '@base_ui/react/Switch'; +import { NumberField } from '@base_ui/react/NumberField'; +import { Slider } from '@base_ui/react/Slider'; +import { RadioGroup } from '@base_ui/react/RadioGroup'; +import { Radio } from '@base_ui/react/Radio'; import userEvent from '@testing-library/user-event'; import { act, diff --git a/packages/mui-base/src/Field/Validity/FieldValidity.test.tsx b/packages/mui-base/src/Field/Validity/FieldValidity.test.tsx index 8974a440bb..98ba936da0 100644 --- a/packages/mui-base/src/Field/Validity/FieldValidity.test.tsx +++ b/packages/mui-base/src/Field/Validity/FieldValidity.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { createRenderer, fireEvent, screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { spy } from 'sinon'; -import * as Field from '@base_ui/react/Field'; +import { Field } from '@base_ui/react/Field'; describe('', () => { const { render } = createRenderer(); diff --git a/packages/mui-base/src/Field/index.barrel.ts b/packages/mui-base/src/Field/index.barrel.ts deleted file mode 100644 index e9604532cf..0000000000 --- a/packages/mui-base/src/Field/index.barrel.ts +++ /dev/null @@ -1,8 +0,0 @@ -export * from './Root/FieldRoot'; -export * from './Label/FieldLabel'; -export * from './Error/FieldError'; -export * from './Description/FieldDescription'; -export * from './Control/FieldControl'; -export * from './Validity/FieldValidity'; - -export type { FieldValidityData } from './Root/FieldRoot'; diff --git a/packages/mui-base/src/Field/index.parts.ts b/packages/mui-base/src/Field/index.parts.ts new file mode 100644 index 0000000000..caded13966 --- /dev/null +++ b/packages/mui-base/src/Field/index.parts.ts @@ -0,0 +1,8 @@ +export { FieldRoot as Root } from './Root/FieldRoot'; +export { FieldLabel as Label } from './Label/FieldLabel'; +export { FieldError as Error } from './Error/FieldError'; +export { FieldDescription as Description } from './Description/FieldDescription'; +export { FieldControl as Control } from './Control/FieldControl'; +export { FieldValidity as Validity } from './Validity/FieldValidity'; + +export type { FieldValidityData as ValidityData } from './Root/FieldRoot'; diff --git a/packages/mui-base/src/Field/index.ts b/packages/mui-base/src/Field/index.ts index caded13966..45425dec2e 100644 --- a/packages/mui-base/src/Field/index.ts +++ b/packages/mui-base/src/Field/index.ts @@ -1,8 +1 @@ -export { FieldRoot as Root } from './Root/FieldRoot'; -export { FieldLabel as Label } from './Label/FieldLabel'; -export { FieldError as Error } from './Error/FieldError'; -export { FieldDescription as Description } from './Description/FieldDescription'; -export { FieldControl as Control } from './Control/FieldControl'; -export { FieldValidity as Validity } from './Validity/FieldValidity'; - -export type { FieldValidityData as ValidityData } from './Root/FieldRoot'; +export * as Field from './index.parts'; diff --git a/packages/mui-base/src/Fieldset/Legend/FieldsetLegend.test.tsx b/packages/mui-base/src/Fieldset/Legend/FieldsetLegend.test.tsx index 101280858e..44b65dc34a 100644 --- a/packages/mui-base/src/Fieldset/Legend/FieldsetLegend.test.tsx +++ b/packages/mui-base/src/Fieldset/Legend/FieldsetLegend.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { createRenderer, screen } from '@mui/internal-test-utils'; -import * as Fieldset from '@base_ui/react/Fieldset'; +import { Fieldset } from '@base_ui/react/Fieldset'; import { expect } from 'chai'; import { describeConformance } from '../../../test/describeConformance'; diff --git a/packages/mui-base/src/Fieldset/Root/FieldsetRoot.test.tsx b/packages/mui-base/src/Fieldset/Root/FieldsetRoot.test.tsx index a397f47d9c..1172c88a78 100644 --- a/packages/mui-base/src/Fieldset/Root/FieldsetRoot.test.tsx +++ b/packages/mui-base/src/Fieldset/Root/FieldsetRoot.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { createRenderer } from '@mui/internal-test-utils'; -import * as Fieldset from '@base_ui/react/Fieldset'; +import { Fieldset } from '@base_ui/react/Fieldset'; import { describeConformance } from '../../../test/describeConformance'; describe('', () => { diff --git a/packages/mui-base/src/Fieldset/index.barrel.ts b/packages/mui-base/src/Fieldset/index.barrel.ts deleted file mode 100644 index b5a4cbaf40..0000000000 --- a/packages/mui-base/src/Fieldset/index.barrel.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './Root/FieldsetRoot'; -export * from './Legend/FieldsetLegend'; diff --git a/packages/mui-base/src/Fieldset/index.parts.ts b/packages/mui-base/src/Fieldset/index.parts.ts new file mode 100644 index 0000000000..ee2ae05cbc --- /dev/null +++ b/packages/mui-base/src/Fieldset/index.parts.ts @@ -0,0 +1,2 @@ +export { FieldsetRoot as Root } from './Root/FieldsetRoot'; +export { FieldsetLegend as Legend } from './Legend/FieldsetLegend'; diff --git a/packages/mui-base/src/Fieldset/index.ts b/packages/mui-base/src/Fieldset/index.ts index ee2ae05cbc..1320ce1903 100644 --- a/packages/mui-base/src/Fieldset/index.ts +++ b/packages/mui-base/src/Fieldset/index.ts @@ -1,2 +1 @@ -export { FieldsetRoot as Root } from './Root/FieldsetRoot'; -export { FieldsetLegend as Legend } from './Legend/FieldsetLegend'; +export * as Fieldset from './index.parts'; diff --git a/packages/mui-base/src/Form/Root/FormRoot.test.tsx b/packages/mui-base/src/Form/Root/FormRoot.test.tsx index ae08084c84..bfaca78d85 100644 --- a/packages/mui-base/src/Form/Root/FormRoot.test.tsx +++ b/packages/mui-base/src/Form/Root/FormRoot.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import * as Form from '@base_ui/react/Form'; -import * as Field from '@base_ui/react/Field'; +import { Form } from '@base_ui/react/Form'; +import { Field } from '@base_ui/react/Field'; import { expect } from 'chai'; import { createRenderer, fireEvent, screen } from '@mui/internal-test-utils'; import { describeConformance } from '../../../test/describeConformance'; diff --git a/packages/mui-base/src/Form/index.barrel.ts b/packages/mui-base/src/Form/index.barrel.ts deleted file mode 100644 index acab7f4296..0000000000 --- a/packages/mui-base/src/Form/index.barrel.ts +++ /dev/null @@ -1 +0,0 @@ -export { FormRoot } from './Root/FormRoot'; diff --git a/packages/mui-base/src/Form/index.parts.ts b/packages/mui-base/src/Form/index.parts.ts new file mode 100644 index 0000000000..896025accf --- /dev/null +++ b/packages/mui-base/src/Form/index.parts.ts @@ -0,0 +1 @@ +export { FormRoot as Root } from './Root/FormRoot'; diff --git a/packages/mui-base/src/Form/index.ts b/packages/mui-base/src/Form/index.ts index 896025accf..75652f7f18 100644 --- a/packages/mui-base/src/Form/index.ts +++ b/packages/mui-base/src/Form/index.ts @@ -1 +1 @@ -export { FormRoot as Root } from './Root/FormRoot'; +export * as Form from './index.parts'; diff --git a/packages/mui-base/src/Menu/Arrow/MenuArrow.test.tsx b/packages/mui-base/src/Menu/Arrow/MenuArrow.test.tsx index 231e31d1e8..ac92bb6332 100644 --- a/packages/mui-base/src/Menu/Arrow/MenuArrow.test.tsx +++ b/packages/mui-base/src/Menu/Arrow/MenuArrow.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Menu/CheckboxItem/MenuCheckboxItem.test.tsx b/packages/mui-base/src/Menu/CheckboxItem/MenuCheckboxItem.test.tsx index 9593007d2c..b8b598b18a 100644 --- a/packages/mui-base/src/Menu/CheckboxItem/MenuCheckboxItem.test.tsx +++ b/packages/mui-base/src/Menu/CheckboxItem/MenuCheckboxItem.test.tsx @@ -4,7 +4,7 @@ import { spy } from 'sinon'; import userEvent from '@testing-library/user-event'; import { fireEvent, act, waitFor } from '@mui/internal-test-utils'; import { FloatingRootContext, FloatingTree } from '@floating-ui/react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { describeConformance, createRenderer } from '../../../test'; import { MenuRootContext } from '../Root/MenuRootContext'; diff --git a/packages/mui-base/src/Menu/CheckboxItemIndicator/MenuCheckboxItemIndicator.test.tsx b/packages/mui-base/src/Menu/CheckboxItemIndicator/MenuCheckboxItemIndicator.test.tsx index dd0cfefae8..7699225663 100644 --- a/packages/mui-base/src/Menu/CheckboxItemIndicator/MenuCheckboxItemIndicator.test.tsx +++ b/packages/mui-base/src/Menu/CheckboxItemIndicator/MenuCheckboxItemIndicator.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Menu/Group/MenuGroup.test.tsx b/packages/mui-base/src/Menu/Group/MenuGroup.test.tsx index 93d0e37d02..d21fa87b86 100644 --- a/packages/mui-base/src/Menu/Group/MenuGroup.test.tsx +++ b/packages/mui-base/src/Menu/Group/MenuGroup.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Menu/GroupLabel/MenuGroupLabel.test.tsx b/packages/mui-base/src/Menu/GroupLabel/MenuGroupLabel.test.tsx index ec699ef3ad..335aa8f2e2 100644 --- a/packages/mui-base/src/Menu/GroupLabel/MenuGroupLabel.test.tsx +++ b/packages/mui-base/src/Menu/GroupLabel/MenuGroupLabel.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { createRenderer, describeConformance } from '#test-utils'; import { MenuGroupContext } from '../Group/MenuGroupContext'; diff --git a/packages/mui-base/src/Menu/Item/MenuItem.test.tsx b/packages/mui-base/src/Menu/Item/MenuItem.test.tsx index ccb335ca15..1195d4f175 100644 --- a/packages/mui-base/src/Menu/Item/MenuItem.test.tsx +++ b/packages/mui-base/src/Menu/Item/MenuItem.test.tsx @@ -4,7 +4,7 @@ import { spy } from 'sinon'; import userEvent from '@testing-library/user-event'; import { act, waitFor } from '@mui/internal-test-utils'; import { FloatingRootContext, FloatingTree } from '@floating-ui/react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { describeConformance, createRenderer } from '#test-utils'; import { MenuRootContext } from '../Root/MenuRootContext'; diff --git a/packages/mui-base/src/Menu/Popup/MenuPopup.test.tsx b/packages/mui-base/src/Menu/Popup/MenuPopup.test.tsx index 64951f945b..cf59048817 100644 --- a/packages/mui-base/src/Menu/Popup/MenuPopup.test.tsx +++ b/packages/mui-base/src/Menu/Popup/MenuPopup.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { FloatingRootContext, FloatingTree } from '@floating-ui/react'; import { createRenderer, describeConformance } from '#test-utils'; import { MenuPositionerContext } from '../Positioner/MenuPositionerContext'; diff --git a/packages/mui-base/src/Menu/Positioner/MenuPositioner.test.tsx b/packages/mui-base/src/Menu/Positioner/MenuPositioner.test.tsx index 6e9664d359..70adbf1421 100644 --- a/packages/mui-base/src/Menu/Positioner/MenuPositioner.test.tsx +++ b/packages/mui-base/src/Menu/Positioner/MenuPositioner.test.tsx @@ -3,7 +3,7 @@ import { expect } from 'chai'; import { FloatingRootContext, FloatingTree } from '@floating-ui/react'; import userEvent from '@testing-library/user-event'; import { flushMicrotasks } from '@mui/internal-test-utils'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { describeConformance, createRenderer } from '#test-utils'; import { MenuRootContext } from '../Root/MenuRootContext'; diff --git a/packages/mui-base/src/Menu/RadioGroup/MenuRadioGroup.test.tsx b/packages/mui-base/src/Menu/RadioGroup/MenuRadioGroup.test.tsx index 0116f9c17d..d3dc7223cf 100644 --- a/packages/mui-base/src/Menu/RadioGroup/MenuRadioGroup.test.tsx +++ b/packages/mui-base/src/Menu/RadioGroup/MenuRadioGroup.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Menu/RadioItem/MenuRadioItem.test.tsx b/packages/mui-base/src/Menu/RadioItem/MenuRadioItem.test.tsx index 7819cbc12e..0a0c1e1c42 100644 --- a/packages/mui-base/src/Menu/RadioItem/MenuRadioItem.test.tsx +++ b/packages/mui-base/src/Menu/RadioItem/MenuRadioItem.test.tsx @@ -4,7 +4,7 @@ import { spy } from 'sinon'; import userEvent from '@testing-library/user-event'; import { fireEvent, act, waitFor } from '@mui/internal-test-utils'; import { FloatingRootContext, FloatingTree } from '@floating-ui/react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { describeConformance, createRenderer } from '#test-utils'; import { MenuRadioGroupContext } from '../RadioGroup/MenuRadioGroupContext'; import { MenuRootContext } from '../Root/MenuRootContext'; diff --git a/packages/mui-base/src/Menu/RadioItemIndicator/MenuRadioItemIndicator.test.tsx b/packages/mui-base/src/Menu/RadioItemIndicator/MenuRadioItemIndicator.test.tsx index 023aa4437a..429b7b793b 100644 --- a/packages/mui-base/src/Menu/RadioItemIndicator/MenuRadioItemIndicator.test.tsx +++ b/packages/mui-base/src/Menu/RadioItemIndicator/MenuRadioItemIndicator.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Menu/Root/MenuRoot.test.tsx b/packages/mui-base/src/Menu/Root/MenuRoot.test.tsx index b3b41ad617..591247046d 100644 --- a/packages/mui-base/src/Menu/Root/MenuRoot.test.tsx +++ b/packages/mui-base/src/Menu/Root/MenuRoot.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { act, flushMicrotasks, waitFor } from '@mui/internal-test-utils'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import userEvent from '@testing-library/user-event'; import { spy } from 'sinon'; import { createRenderer } from '#test-utils'; diff --git a/packages/mui-base/src/Menu/Trigger/MenuTrigger.test.tsx b/packages/mui-base/src/Menu/Trigger/MenuTrigger.test.tsx index 16b2500104..1ee5120718 100644 --- a/packages/mui-base/src/Menu/Trigger/MenuTrigger.test.tsx +++ b/packages/mui-base/src/Menu/Trigger/MenuTrigger.test.tsx @@ -3,7 +3,7 @@ import { expect } from 'chai'; import { FloatingRootContext, FloatingTree } from '@floating-ui/react'; import userEvent from '@testing-library/user-event'; import { act } from '@mui/internal-test-utils'; -import * as Menu from '@base_ui/react/Menu'; +import { Menu } from '@base_ui/react/Menu'; import { describeConformance, createRenderer } from '#test-utils'; import { MenuRootContext } from '../Root/MenuRootContext'; diff --git a/packages/mui-base/src/Menu/index.barrel.ts b/packages/mui-base/src/Menu/index.barrel.ts deleted file mode 100644 index 166bf5c678..0000000000 --- a/packages/mui-base/src/Menu/index.barrel.ts +++ /dev/null @@ -1,14 +0,0 @@ -export { MenuArrow } from './Arrow/MenuArrow'; -export { MenuCheckboxItem } from './CheckboxItem/MenuCheckboxItem'; -export { MenuCheckboxItemIndicator } from './CheckboxItemIndicator/MenuCheckboxItemIndicator'; -export { MenuGroup } from './Group/MenuGroup'; -export { MenuGroupLabel } from './GroupLabel/MenuGroupLabel'; -export { MenuItem } from './Item/MenuItem'; -export { MenuPopup } from './Popup/MenuPopup'; -export { MenuPositioner } from './Positioner/MenuPositioner'; -export { MenuRadioGroup } from './RadioGroup/MenuRadioGroup'; -export { MenuRadioItem } from './RadioItem/MenuRadioItem'; -export { MenuRadioItemIndicator } from './RadioItemIndicator/MenuRadioItemIndicator'; -export { MenuRoot } from './Root/MenuRoot'; -export { MenuTrigger } from './Trigger/MenuTrigger'; -export { SubmenuTrigger } from './SubmenuTrigger/SubmenuTrigger'; diff --git a/packages/mui-base/src/Menu/index.parts.ts b/packages/mui-base/src/Menu/index.parts.ts new file mode 100644 index 0000000000..ac63a706d5 --- /dev/null +++ b/packages/mui-base/src/Menu/index.parts.ts @@ -0,0 +1,15 @@ +export { MenuArrow as Arrow } from './Arrow/MenuArrow'; +export { MenuCheckboxItem as CheckboxItem } from './CheckboxItem/MenuCheckboxItem'; +export { MenuCheckboxItemIndicator as CheckboxItemIndicator } from './CheckboxItemIndicator/MenuCheckboxItemIndicator'; +export { MenuGroup as Group } from './Group/MenuGroup'; +export { MenuGroupLabel as GroupLabel } from './GroupLabel/MenuGroupLabel'; +export { MenuItem as Item } from './Item/MenuItem'; +export { MenuPopup as Popup } from './Popup/MenuPopup'; +export { MenuPositioner as Positioner } from './Positioner/MenuPositioner'; +export { MenuRadioGroup as RadioGroup } from './RadioGroup/MenuRadioGroup'; +export { MenuRadioItem as RadioItem } from './RadioItem/MenuRadioItem'; +export { MenuRadioItemIndicator as RadioItemIndicator } from './RadioItemIndicator/MenuRadioItemIndicator'; +export { MenuRoot as Root } from './Root/MenuRoot'; +export { MenuTrigger as Trigger } from './Trigger/MenuTrigger'; +export { SeparatorRoot as Separator } from '../Separator/Root/SeparatorRoot'; +export { SubmenuTrigger } from './SubmenuTrigger/SubmenuTrigger'; diff --git a/packages/mui-base/src/Menu/index.ts b/packages/mui-base/src/Menu/index.ts index ac63a706d5..515d1290d8 100644 --- a/packages/mui-base/src/Menu/index.ts +++ b/packages/mui-base/src/Menu/index.ts @@ -1,15 +1 @@ -export { MenuArrow as Arrow } from './Arrow/MenuArrow'; -export { MenuCheckboxItem as CheckboxItem } from './CheckboxItem/MenuCheckboxItem'; -export { MenuCheckboxItemIndicator as CheckboxItemIndicator } from './CheckboxItemIndicator/MenuCheckboxItemIndicator'; -export { MenuGroup as Group } from './Group/MenuGroup'; -export { MenuGroupLabel as GroupLabel } from './GroupLabel/MenuGroupLabel'; -export { MenuItem as Item } from './Item/MenuItem'; -export { MenuPopup as Popup } from './Popup/MenuPopup'; -export { MenuPositioner as Positioner } from './Positioner/MenuPositioner'; -export { MenuRadioGroup as RadioGroup } from './RadioGroup/MenuRadioGroup'; -export { MenuRadioItem as RadioItem } from './RadioItem/MenuRadioItem'; -export { MenuRadioItemIndicator as RadioItemIndicator } from './RadioItemIndicator/MenuRadioItemIndicator'; -export { MenuRoot as Root } from './Root/MenuRoot'; -export { MenuTrigger as Trigger } from './Trigger/MenuTrigger'; -export { SeparatorRoot as Separator } from '../Separator/Root/SeparatorRoot'; -export { SubmenuTrigger } from './SubmenuTrigger/SubmenuTrigger'; +export * as Menu from './index.parts'; diff --git a/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx b/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx index 9b9811abcf..2ca25b1556 100644 --- a/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx +++ b/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { screen, fireEvent } from '@mui/internal-test-utils'; -import * as NumberField from '@base_ui/react/NumberField'; +import { NumberField } from '@base_ui/react/NumberField'; import { createRenderer, describeConformance } from '#test-utils'; import { CHANGE_VALUE_TICK_DELAY, START_AUTO_CHANGE_DELAY } from '../utils/constants'; import { NumberFieldContext } from '../Root/NumberFieldContext'; diff --git a/packages/mui-base/src/NumberField/Group/NumberFieldGroup.test.tsx b/packages/mui-base/src/NumberField/Group/NumberFieldGroup.test.tsx index 140c668655..bda5d52f10 100644 --- a/packages/mui-base/src/NumberField/Group/NumberFieldGroup.test.tsx +++ b/packages/mui-base/src/NumberField/Group/NumberFieldGroup.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { screen } from '@mui/internal-test-utils'; -import * as NumberField from '@base_ui/react/NumberField'; +import { NumberField } from '@base_ui/react/NumberField'; import { createRenderer, describeConformance } from '#test-utils'; import { NumberFieldContext } from '../Root/NumberFieldContext'; diff --git a/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx b/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx index e2153caa9d..dc90a68574 100644 --- a/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx +++ b/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { screen, fireEvent } from '@mui/internal-test-utils'; -import * as NumberField from '@base_ui/react/NumberField'; +import { NumberField } from '@base_ui/react/NumberField'; import { createRenderer, describeConformance } from '#test-utils'; import { CHANGE_VALUE_TICK_DELAY, START_AUTO_CHANGE_DELAY } from '../utils/constants'; import { NumberFieldContext } from '../Root/NumberFieldContext'; diff --git a/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx b/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx index b9c97f0936..46ef5531e3 100644 --- a/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx +++ b/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { act, screen, fireEvent } from '@mui/internal-test-utils'; -import * as NumberField from '@base_ui/react/NumberField'; +import { NumberField } from '@base_ui/react/NumberField'; import { createRenderer, describeConformance } from '#test-utils'; import { NumberFieldContext } from '../Root/NumberFieldContext'; diff --git a/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx b/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx index 24b9547e17..f9f0e6aae2 100644 --- a/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx +++ b/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { act, screen, fireEvent } from '@mui/internal-test-utils'; -import * as NumberFieldBase from '@base_ui/react/NumberField'; +import { NumberField as NumberFieldBase } from '@base_ui/react/NumberField'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/NumberField/ScrubArea/NumberFieldScrubArea.test.tsx b/packages/mui-base/src/NumberField/ScrubArea/NumberFieldScrubArea.test.tsx index a368ea7916..26a6937304 100644 --- a/packages/mui-base/src/NumberField/ScrubArea/NumberFieldScrubArea.test.tsx +++ b/packages/mui-base/src/NumberField/ScrubArea/NumberFieldScrubArea.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { screen, waitFor } from '@mui/internal-test-utils'; -import * as NumberField from '@base_ui/react/NumberField'; +import { NumberField } from '@base_ui/react/NumberField'; import { createRenderer, describeConformance } from '#test-utils'; import { isWebKit } from '../../utils/detectBrowser'; import { NumberFieldContext } from '../Root/NumberFieldContext'; diff --git a/packages/mui-base/src/NumberField/ScrubAreaCursor/NumberFieldScrubAreaCursor.test.tsx b/packages/mui-base/src/NumberField/ScrubAreaCursor/NumberFieldScrubAreaCursor.test.tsx index 4b577113b5..de3ef46f0d 100644 --- a/packages/mui-base/src/NumberField/ScrubAreaCursor/NumberFieldScrubAreaCursor.test.tsx +++ b/packages/mui-base/src/NumberField/ScrubAreaCursor/NumberFieldScrubAreaCursor.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { screen } from '@mui/internal-test-utils'; -import * as NumberField from '@base_ui/react/NumberField'; +import { NumberField } from '@base_ui/react/NumberField'; import { createRenderer, describeConformance } from '#test-utils'; import { isWebKit } from '../../utils/detectBrowser'; import { NumberFieldContext } from '../Root/NumberFieldContext'; diff --git a/packages/mui-base/src/NumberField/index.barrel.ts b/packages/mui-base/src/NumberField/index.barrel.ts deleted file mode 100644 index c11c363b24..0000000000 --- a/packages/mui-base/src/NumberField/index.barrel.ts +++ /dev/null @@ -1,7 +0,0 @@ -export { NumberFieldRoot } from './Root/NumberFieldRoot'; -export { NumberFieldGroup } from './Group/NumberFieldGroup'; -export { NumberFieldIncrement } from './Increment/NumberFieldIncrement'; -export { NumberFieldDecrement } from './Decrement/NumberFieldDecrement'; -export { NumberFieldInput } from './Input/NumberFieldInput'; -export { NumberFieldScrubArea } from './ScrubArea/NumberFieldScrubArea'; -export { NumberFieldScrubAreaCursor } from './ScrubAreaCursor/NumberFieldScrubAreaCursor'; diff --git a/packages/mui-base/src/NumberField/index.parts.ts b/packages/mui-base/src/NumberField/index.parts.ts new file mode 100644 index 0000000000..1f0f7cd871 --- /dev/null +++ b/packages/mui-base/src/NumberField/index.parts.ts @@ -0,0 +1,7 @@ +export { NumberFieldRoot as Root } from './Root/NumberFieldRoot'; +export { NumberFieldGroup as Group } from './Group/NumberFieldGroup'; +export { NumberFieldIncrement as Increment } from './Increment/NumberFieldIncrement'; +export { NumberFieldDecrement as Decrement } from './Decrement/NumberFieldDecrement'; +export { NumberFieldInput as Input } from './Input/NumberFieldInput'; +export { NumberFieldScrubArea as ScrubArea } from './ScrubArea/NumberFieldScrubArea'; +export { NumberFieldScrubAreaCursor as ScrubAreaCursor } from './ScrubAreaCursor/NumberFieldScrubAreaCursor'; diff --git a/packages/mui-base/src/NumberField/index.ts b/packages/mui-base/src/NumberField/index.ts index 1f0f7cd871..e97deaf602 100644 --- a/packages/mui-base/src/NumberField/index.ts +++ b/packages/mui-base/src/NumberField/index.ts @@ -1,7 +1 @@ -export { NumberFieldRoot as Root } from './Root/NumberFieldRoot'; -export { NumberFieldGroup as Group } from './Group/NumberFieldGroup'; -export { NumberFieldIncrement as Increment } from './Increment/NumberFieldIncrement'; -export { NumberFieldDecrement as Decrement } from './Decrement/NumberFieldDecrement'; -export { NumberFieldInput as Input } from './Input/NumberFieldInput'; -export { NumberFieldScrubArea as ScrubArea } from './ScrubArea/NumberFieldScrubArea'; -export { NumberFieldScrubAreaCursor as ScrubAreaCursor } from './ScrubAreaCursor/NumberFieldScrubAreaCursor'; +export * as NumberField from './index.parts'; diff --git a/packages/mui-base/src/Popover/Arrow/PopoverArrow.test.tsx b/packages/mui-base/src/Popover/Arrow/PopoverArrow.test.tsx index f65456fa2d..3a4642d492 100644 --- a/packages/mui-base/src/Popover/Arrow/PopoverArrow.test.tsx +++ b/packages/mui-base/src/Popover/Arrow/PopoverArrow.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Popover/Backdrop/PopoverBackdrop.test.tsx b/packages/mui-base/src/Popover/Backdrop/PopoverBackdrop.test.tsx index 4ac40c8778..98dccd1c0d 100644 --- a/packages/mui-base/src/Popover/Backdrop/PopoverBackdrop.test.tsx +++ b/packages/mui-base/src/Popover/Backdrop/PopoverBackdrop.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Popover/Close/PopoverClose.test.tsx b/packages/mui-base/src/Popover/Close/PopoverClose.test.tsx index afae2d7421..c1c5f89d84 100644 --- a/packages/mui-base/src/Popover/Close/PopoverClose.test.tsx +++ b/packages/mui-base/src/Popover/Close/PopoverClose.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { fireEvent, screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { createRenderer, describeConformance } from '#test-utils'; diff --git a/packages/mui-base/src/Popover/Description/PopoverDescription.test.tsx b/packages/mui-base/src/Popover/Description/PopoverDescription.test.tsx index ee77306db8..0a50267667 100644 --- a/packages/mui-base/src/Popover/Description/PopoverDescription.test.tsx +++ b/packages/mui-base/src/Popover/Description/PopoverDescription.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { createRenderer, describeConformance } from '#test-utils'; diff --git a/packages/mui-base/src/Popover/Popup/PopoverPopup.test.tsx b/packages/mui-base/src/Popover/Popup/PopoverPopup.test.tsx index 6475a31627..f3f3b6809b 100644 --- a/packages/mui-base/src/Popover/Popup/PopoverPopup.test.tsx +++ b/packages/mui-base/src/Popover/Popup/PopoverPopup.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { createRenderer, describeConformance } from '#test-utils'; diff --git a/packages/mui-base/src/Popover/Positioner/PopoverPositioner.test.tsx b/packages/mui-base/src/Popover/Positioner/PopoverPositioner.test.tsx index 826b63acb8..f784a5109b 100644 --- a/packages/mui-base/src/Popover/Positioner/PopoverPositioner.test.tsx +++ b/packages/mui-base/src/Popover/Positioner/PopoverPositioner.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { createRenderer, describeConformance } from '#test-utils'; import { screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; diff --git a/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx b/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx index 1beb906953..029c349c1e 100644 --- a/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx +++ b/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { fireEvent, flushMicrotasks, screen, waitFor } from '@mui/internal-test-utils'; import userEvent from '@testing-library/user-event'; import { expect } from 'chai'; diff --git a/packages/mui-base/src/Popover/Title/PopoverTitle.test.tsx b/packages/mui-base/src/Popover/Title/PopoverTitle.test.tsx index 9898507ba9..3b039e6c25 100644 --- a/packages/mui-base/src/Popover/Title/PopoverTitle.test.tsx +++ b/packages/mui-base/src/Popover/Title/PopoverTitle.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { createRenderer, describeConformance } from '#test-utils'; diff --git a/packages/mui-base/src/Popover/Trigger/PopoverTrigger.test.tsx b/packages/mui-base/src/Popover/Trigger/PopoverTrigger.test.tsx index 2a6f1879ac..9bb0c77738 100644 --- a/packages/mui-base/src/Popover/Trigger/PopoverTrigger.test.tsx +++ b/packages/mui-base/src/Popover/Trigger/PopoverTrigger.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Popover from '@base_ui/react/Popover'; +import { Popover } from '@base_ui/react/Popover'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Popover/index.barrel.ts b/packages/mui-base/src/Popover/index.barrel.ts deleted file mode 100644 index d970c32aba..0000000000 --- a/packages/mui-base/src/Popover/index.barrel.ts +++ /dev/null @@ -1,9 +0,0 @@ -export { PopoverRoot } from './Root/PopoverRoot'; -export { PopoverTrigger } from './Trigger/PopoverTrigger'; -export { PopoverPositioner } from './Positioner/PopoverPositioner'; -export { PopoverPopup } from './Popup/PopoverPopup'; -export { PopoverArrow } from './Arrow/PopoverArrow'; -export { PopoverBackdrop } from './Backdrop/PopoverBackdrop'; -export { PopoverTitle } from './Title/PopoverTitle'; -export { PopoverDescription } from './Description/PopoverDescription'; -export { PopoverClose } from './Close/PopoverClose'; diff --git a/packages/mui-base/src/Popover/index.parts.ts b/packages/mui-base/src/Popover/index.parts.ts new file mode 100644 index 0000000000..a025e39621 --- /dev/null +++ b/packages/mui-base/src/Popover/index.parts.ts @@ -0,0 +1,9 @@ +export { PopoverRoot as Root } from './Root/PopoverRoot'; +export { PopoverTrigger as Trigger } from './Trigger/PopoverTrigger'; +export { PopoverPositioner as Positioner } from './Positioner/PopoverPositioner'; +export { PopoverPopup as Popup } from './Popup/PopoverPopup'; +export { PopoverArrow as Arrow } from './Arrow/PopoverArrow'; +export { PopoverBackdrop as Backdrop } from './Backdrop/PopoverBackdrop'; +export { PopoverTitle as Title } from './Title/PopoverTitle'; +export { PopoverDescription as Description } from './Description/PopoverDescription'; +export { PopoverClose as Close } from './Close/PopoverClose'; diff --git a/packages/mui-base/src/Popover/index.ts b/packages/mui-base/src/Popover/index.ts index a025e39621..9d2d8d70b5 100644 --- a/packages/mui-base/src/Popover/index.ts +++ b/packages/mui-base/src/Popover/index.ts @@ -1,9 +1 @@ -export { PopoverRoot as Root } from './Root/PopoverRoot'; -export { PopoverTrigger as Trigger } from './Trigger/PopoverTrigger'; -export { PopoverPositioner as Positioner } from './Positioner/PopoverPositioner'; -export { PopoverPopup as Popup } from './Popup/PopoverPopup'; -export { PopoverArrow as Arrow } from './Arrow/PopoverArrow'; -export { PopoverBackdrop as Backdrop } from './Backdrop/PopoverBackdrop'; -export { PopoverTitle as Title } from './Title/PopoverTitle'; -export { PopoverDescription as Description } from './Description/PopoverDescription'; -export { PopoverClose as Close } from './Close/PopoverClose'; +export * as Popover from './index.parts'; diff --git a/packages/mui-base/src/PreviewCard/Arrow/PreviewCardArrow.test.tsx b/packages/mui-base/src/PreviewCard/Arrow/PreviewCardArrow.test.tsx index 5fa3656de1..4ba368f3c8 100644 --- a/packages/mui-base/src/PreviewCard/Arrow/PreviewCardArrow.test.tsx +++ b/packages/mui-base/src/PreviewCard/Arrow/PreviewCardArrow.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/PreviewCard/Backdrop/PreviewCardBackdrop.test.tsx b/packages/mui-base/src/PreviewCard/Backdrop/PreviewCardBackdrop.test.tsx index 92bba7d844..41bef53f61 100644 --- a/packages/mui-base/src/PreviewCard/Backdrop/PreviewCardBackdrop.test.tsx +++ b/packages/mui-base/src/PreviewCard/Backdrop/PreviewCardBackdrop.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/PreviewCard/Popup/PreviewCardPopup.test.tsx b/packages/mui-base/src/PreviewCard/Popup/PreviewCardPopup.test.tsx index b7568d8e5f..9f417277cc 100644 --- a/packages/mui-base/src/PreviewCard/Popup/PreviewCardPopup.test.tsx +++ b/packages/mui-base/src/PreviewCard/Popup/PreviewCardPopup.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { createRenderer, describeConformance } from '#test-utils'; diff --git a/packages/mui-base/src/PreviewCard/Positioner/PreviewCardPositioner.test.tsx b/packages/mui-base/src/PreviewCard/Positioner/PreviewCardPositioner.test.tsx index 30ce4ce86a..1c57cda678 100644 --- a/packages/mui-base/src/PreviewCard/Positioner/PreviewCardPositioner.test.tsx +++ b/packages/mui-base/src/PreviewCard/Positioner/PreviewCardPositioner.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx b/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx index 14d80b1e64..b379c31fe4 100644 --- a/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx +++ b/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { act, fireEvent, screen, flushMicrotasks } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { spy } from 'sinon'; diff --git a/packages/mui-base/src/PreviewCard/Trigger/PreviewCardTrigger.test.tsx b/packages/mui-base/src/PreviewCard/Trigger/PreviewCardTrigger.test.tsx index 8afd7ddc5c..6051aafcc2 100644 --- a/packages/mui-base/src/PreviewCard/Trigger/PreviewCardTrigger.test.tsx +++ b/packages/mui-base/src/PreviewCard/Trigger/PreviewCardTrigger.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as PreviewCard from '@base_ui/react/PreviewCard'; +import { PreviewCard } from '@base_ui/react/PreviewCard'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/PreviewCard/index.barrel.ts b/packages/mui-base/src/PreviewCard/index.barrel.ts deleted file mode 100644 index 685af207d5..0000000000 --- a/packages/mui-base/src/PreviewCard/index.barrel.ts +++ /dev/null @@ -1,6 +0,0 @@ -export { PreviewCardRoot } from './Root/PreviewCardRoot'; -export { PreviewCardTrigger } from './Trigger/PreviewCardTrigger'; -export { PreviewCardPositioner } from './Positioner/PreviewCardPositioner'; -export { PreviewCardPopup } from './Popup/PreviewCardPopup'; -export { PreviewCardArrow } from './Arrow/PreviewCardArrow'; -export { PreviewCardBackdrop } from './Backdrop/PreviewCardBackdrop'; diff --git a/packages/mui-base/src/PreviewCard/index.parts.ts b/packages/mui-base/src/PreviewCard/index.parts.ts new file mode 100644 index 0000000000..291940ad66 --- /dev/null +++ b/packages/mui-base/src/PreviewCard/index.parts.ts @@ -0,0 +1,6 @@ +export { PreviewCardRoot as Root } from './Root/PreviewCardRoot'; +export { PreviewCardTrigger as Trigger } from './Trigger/PreviewCardTrigger'; +export { PreviewCardPositioner as Positioner } from './Positioner/PreviewCardPositioner'; +export { PreviewCardPopup as Popup } from './Popup/PreviewCardPopup'; +export { PreviewCardArrow as Arrow } from './Arrow/PreviewCardArrow'; +export { PreviewCardBackdrop as Backdrop } from './Backdrop/PreviewCardBackdrop'; diff --git a/packages/mui-base/src/PreviewCard/index.ts b/packages/mui-base/src/PreviewCard/index.ts index 291940ad66..848affb96f 100644 --- a/packages/mui-base/src/PreviewCard/index.ts +++ b/packages/mui-base/src/PreviewCard/index.ts @@ -1,6 +1 @@ -export { PreviewCardRoot as Root } from './Root/PreviewCardRoot'; -export { PreviewCardTrigger as Trigger } from './Trigger/PreviewCardTrigger'; -export { PreviewCardPositioner as Positioner } from './Positioner/PreviewCardPositioner'; -export { PreviewCardPopup as Popup } from './Popup/PreviewCardPopup'; -export { PreviewCardArrow as Arrow } from './Arrow/PreviewCardArrow'; -export { PreviewCardBackdrop as Backdrop } from './Backdrop/PreviewCardBackdrop'; +export * as PreviewCard from './index.parts'; diff --git a/packages/mui-base/src/Progress/Indicator/ProgressIndicator.test.tsx b/packages/mui-base/src/Progress/Indicator/ProgressIndicator.test.tsx index 33256bf379..a2012fb4c2 100644 --- a/packages/mui-base/src/Progress/Indicator/ProgressIndicator.test.tsx +++ b/packages/mui-base/src/Progress/Indicator/ProgressIndicator.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Progress from '@base_ui/react/Progress'; +import { Progress } from '@base_ui/react/Progress'; import { createRenderer, describeConformance } from '#test-utils'; import { ProgressRootContext } from '../Root/ProgressRootContext'; diff --git a/packages/mui-base/src/Progress/Root/ProgressRoot.test.tsx b/packages/mui-base/src/Progress/Root/ProgressRoot.test.tsx index 1e9e12fca3..344f4d9819 100644 --- a/packages/mui-base/src/Progress/Root/ProgressRoot.test.tsx +++ b/packages/mui-base/src/Progress/Root/ProgressRoot.test.tsx @@ -1,6 +1,6 @@ import { expect } from 'chai'; import * as React from 'react'; -import * as Progress from '@base_ui/react/Progress'; +import { Progress } from '@base_ui/react/Progress'; import { createRenderer, describeConformance } from '#test-utils'; import type { ProgressRoot } from './ProgressRoot'; diff --git a/packages/mui-base/src/Progress/Track/ProgressTrack.test.tsx b/packages/mui-base/src/Progress/Track/ProgressTrack.test.tsx index 197207bfae..27e8c204a4 100644 --- a/packages/mui-base/src/Progress/Track/ProgressTrack.test.tsx +++ b/packages/mui-base/src/Progress/Track/ProgressTrack.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Progress from '@base_ui/react/Progress'; +import { Progress } from '@base_ui/react/Progress'; import { createRenderer, describeConformance } from '#test-utils'; import { ProgressRootContext } from '../Root/ProgressRootContext'; diff --git a/packages/mui-base/src/Progress/index.barrel.ts b/packages/mui-base/src/Progress/index.barrel.ts deleted file mode 100644 index 677acec64c..0000000000 --- a/packages/mui-base/src/Progress/index.barrel.ts +++ /dev/null @@ -1,8 +0,0 @@ -export { ProgressRoot } from './Root/ProgressRoot'; -export { ProgressTrack } from './Track/ProgressTrack'; -export { ProgressIndicator } from './Indicator/ProgressIndicator'; - -export type { - ProgressStatus as Status, - ProgressDirection as Direction, -} from './Root/useProgressRoot'; diff --git a/packages/mui-base/src/Progress/index.parts.ts b/packages/mui-base/src/Progress/index.parts.ts new file mode 100644 index 0000000000..5e0d1453f4 --- /dev/null +++ b/packages/mui-base/src/Progress/index.parts.ts @@ -0,0 +1,8 @@ +export { ProgressRoot as Root } from './Root/ProgressRoot'; +export { ProgressTrack as Track } from './Track/ProgressTrack'; +export { ProgressIndicator as Indicator } from './Indicator/ProgressIndicator'; + +export type { + ProgressStatus as Status, + ProgressDirection as Direction, +} from './Root/useProgressRoot'; diff --git a/packages/mui-base/src/Progress/index.ts b/packages/mui-base/src/Progress/index.ts index 5e0d1453f4..ee913fe81a 100644 --- a/packages/mui-base/src/Progress/index.ts +++ b/packages/mui-base/src/Progress/index.ts @@ -1,8 +1 @@ -export { ProgressRoot as Root } from './Root/ProgressRoot'; -export { ProgressTrack as Track } from './Track/ProgressTrack'; -export { ProgressIndicator as Indicator } from './Indicator/ProgressIndicator'; - -export type { - ProgressStatus as Status, - ProgressDirection as Direction, -} from './Root/useProgressRoot'; +export * as Progress from './index.parts'; diff --git a/packages/mui-base/src/Radio/Indicator/RadioIndicator.test.tsx b/packages/mui-base/src/Radio/Indicator/RadioIndicator.test.tsx index d2d03649d1..9250c941fa 100644 --- a/packages/mui-base/src/Radio/Indicator/RadioIndicator.test.tsx +++ b/packages/mui-base/src/Radio/Indicator/RadioIndicator.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { createRenderer } from '@mui/internal-test-utils'; -import * as Radio from '@base_ui/react/Radio'; +import { Radio } from '@base_ui/react/Radio'; import { describeConformance } from '../../../test/describeConformance'; describe('', () => { diff --git a/packages/mui-base/src/Radio/Root/RadioRoot.test.tsx b/packages/mui-base/src/Radio/Root/RadioRoot.test.tsx index cc117d3580..75fac1a111 100644 --- a/packages/mui-base/src/Radio/Root/RadioRoot.test.tsx +++ b/packages/mui-base/src/Radio/Root/RadioRoot.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { createRenderer } from '@mui/internal-test-utils'; -import * as Radio from '@base_ui/react/Radio'; +import { Radio } from '@base_ui/react/Radio'; import { describeConformance } from '../../../test/describeConformance'; describe('', () => { diff --git a/packages/mui-base/src/Radio/index.barrel.ts b/packages/mui-base/src/Radio/index.barrel.ts deleted file mode 100644 index dc4fbc653a..0000000000 --- a/packages/mui-base/src/Radio/index.barrel.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { RadioRoot } from './Root/RadioRoot'; -export { RadioIndicator } from './Indicator/RadioIndicator'; diff --git a/packages/mui-base/src/Radio/index.parts.ts b/packages/mui-base/src/Radio/index.parts.ts new file mode 100644 index 0000000000..e5baf0747d --- /dev/null +++ b/packages/mui-base/src/Radio/index.parts.ts @@ -0,0 +1,2 @@ +export { RadioRoot as Root } from './Root/RadioRoot'; +export { RadioIndicator as Indicator } from './Indicator/RadioIndicator'; diff --git a/packages/mui-base/src/Radio/index.ts b/packages/mui-base/src/Radio/index.ts index e5baf0747d..19f101399e 100644 --- a/packages/mui-base/src/Radio/index.ts +++ b/packages/mui-base/src/Radio/index.ts @@ -1,2 +1 @@ -export { RadioRoot as Root } from './Root/RadioRoot'; -export { RadioIndicator as Indicator } from './Indicator/RadioIndicator'; +export * as Radio from './index.parts'; diff --git a/packages/mui-base/src/RadioGroup/Root/RadioGroupRoot.test.tsx b/packages/mui-base/src/RadioGroup/Root/RadioGroupRoot.test.tsx index ff9cc5b449..8336d7c4ec 100644 --- a/packages/mui-base/src/RadioGroup/Root/RadioGroupRoot.test.tsx +++ b/packages/mui-base/src/RadioGroup/Root/RadioGroupRoot.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import * as RadioGroup from '@base_ui/react/RadioGroup'; -import * as Radio from '@base_ui/react/Radio'; +import { RadioGroup } from '@base_ui/react/RadioGroup'; +import { Radio } from '@base_ui/react/Radio'; import { expect } from 'chai'; import { spy } from 'sinon'; import { createRenderer, act, screen, fireEvent } from '@mui/internal-test-utils'; diff --git a/packages/mui-base/src/RadioGroup/index.barrel.ts b/packages/mui-base/src/RadioGroup/index.barrel.ts deleted file mode 100644 index 3d7b2c9369..0000000000 --- a/packages/mui-base/src/RadioGroup/index.barrel.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './Root/RadioGroupRoot'; diff --git a/packages/mui-base/src/RadioGroup/index.parts.ts b/packages/mui-base/src/RadioGroup/index.parts.ts new file mode 100644 index 0000000000..f78d654570 --- /dev/null +++ b/packages/mui-base/src/RadioGroup/index.parts.ts @@ -0,0 +1 @@ +export { RadioGroupRoot as Root } from './Root/RadioGroupRoot'; diff --git a/packages/mui-base/src/RadioGroup/index.ts b/packages/mui-base/src/RadioGroup/index.ts index f78d654570..4dd85fb1eb 100644 --- a/packages/mui-base/src/RadioGroup/index.ts +++ b/packages/mui-base/src/RadioGroup/index.ts @@ -1 +1 @@ -export { RadioGroupRoot as Root } from './Root/RadioGroupRoot'; +export * as RadioGroup from './index.parts'; diff --git a/packages/mui-base/src/Separator/Root/SeparatorRoot.test.tsx b/packages/mui-base/src/Separator/Root/SeparatorRoot.test.tsx index a6b54ae71d..9edbcbd325 100644 --- a/packages/mui-base/src/Separator/Root/SeparatorRoot.test.tsx +++ b/packages/mui-base/src/Separator/Root/SeparatorRoot.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Separator from '@base_ui/react/Separator'; +import { Separator } from '@base_ui/react/Separator'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Separator/index.barrel.ts b/packages/mui-base/src/Separator/index.barrel.ts deleted file mode 100644 index 92574247cc..0000000000 --- a/packages/mui-base/src/Separator/index.barrel.ts +++ /dev/null @@ -1 +0,0 @@ -export { SeparatorRoot } from './Root/SeparatorRoot'; diff --git a/packages/mui-base/src/Separator/index.parts.ts b/packages/mui-base/src/Separator/index.parts.ts new file mode 100644 index 0000000000..01851cba2b --- /dev/null +++ b/packages/mui-base/src/Separator/index.parts.ts @@ -0,0 +1 @@ +export { SeparatorRoot as Root } from './Root/SeparatorRoot'; diff --git a/packages/mui-base/src/Separator/index.ts b/packages/mui-base/src/Separator/index.ts index 01851cba2b..da5e8c68cb 100644 --- a/packages/mui-base/src/Separator/index.ts +++ b/packages/mui-base/src/Separator/index.ts @@ -1 +1 @@ -export { SeparatorRoot as Root } from './Root/SeparatorRoot'; +export * as Separator from './index.parts'; diff --git a/packages/mui-base/src/Slider/Control/SliderControl.test.tsx b/packages/mui-base/src/Slider/Control/SliderControl.test.tsx index 45f5c31eb3..c09ba78a14 100644 --- a/packages/mui-base/src/Slider/Control/SliderControl.test.tsx +++ b/packages/mui-base/src/Slider/Control/SliderControl.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import * as Slider from '@base_ui/react/Slider'; -import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; +import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider/index.parts'; import { createRenderer, describeConformance } from '#test-utils'; const NOOP = () => {}; diff --git a/packages/mui-base/src/Slider/Indicator/SliderIndicator.test.tsx b/packages/mui-base/src/Slider/Indicator/SliderIndicator.test.tsx index b5f19049ba..979b288ed8 100644 --- a/packages/mui-base/src/Slider/Indicator/SliderIndicator.test.tsx +++ b/packages/mui-base/src/Slider/Indicator/SliderIndicator.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import * as Slider from '@base_ui/react/Slider'; -import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; +import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider/index.parts'; import { createRenderer, describeConformance } from '#test-utils'; const NOOP = () => {}; diff --git a/packages/mui-base/src/Slider/Output/SliderOutput.test.tsx b/packages/mui-base/src/Slider/Output/SliderOutput.test.tsx index fac49ee9e3..62d26e9c52 100644 --- a/packages/mui-base/src/Slider/Output/SliderOutput.test.tsx +++ b/packages/mui-base/src/Slider/Output/SliderOutput.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Slider from '@base_ui/react/Slider'; -import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; +import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider/index.parts'; import { createRenderer, describeConformance } from '#test-utils'; const NOOP = () => {}; diff --git a/packages/mui-base/src/Slider/Root/SliderRoot.test.tsx b/packages/mui-base/src/Slider/Root/SliderRoot.test.tsx index 6a1741c2b7..e6ca53c50f 100644 --- a/packages/mui-base/src/Slider/Root/SliderRoot.test.tsx +++ b/packages/mui-base/src/Slider/Root/SliderRoot.test.tsx @@ -2,7 +2,7 @@ import { expect } from 'chai'; import * as React from 'react'; import { spy, stub } from 'sinon'; import { act, fireEvent, screen } from '@mui/internal-test-utils'; -import * as Slider from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; import { createRenderer, describeConformance } from '#test-utils'; import type { SliderRootProps } from './SliderRoot.types'; diff --git a/packages/mui-base/src/Slider/Thumb/SliderThumb.test.tsx b/packages/mui-base/src/Slider/Thumb/SliderThumb.test.tsx index 3d65198534..c04cf8180d 100644 --- a/packages/mui-base/src/Slider/Thumb/SliderThumb.test.tsx +++ b/packages/mui-base/src/Slider/Thumb/SliderThumb.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import * as Slider from '@base_ui/react/Slider'; -import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; +import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider/index.parts'; import { createRenderer, describeConformance } from '#test-utils'; const NOOP = () => {}; diff --git a/packages/mui-base/src/Slider/Track/SliderTrack.test.tsx b/packages/mui-base/src/Slider/Track/SliderTrack.test.tsx index a28829b12e..382583c216 100644 --- a/packages/mui-base/src/Slider/Track/SliderTrack.test.tsx +++ b/packages/mui-base/src/Slider/Track/SliderTrack.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import * as Slider from '@base_ui/react/Slider'; -import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider'; +import { Slider } from '@base_ui/react/Slider'; +import { SliderProvider, type SliderProviderValue } from '@base_ui/react/Slider/index.parts'; import { createRenderer, describeConformance } from '#test-utils'; const NOOP = () => {}; diff --git a/packages/mui-base/src/Slider/index.barrel.ts b/packages/mui-base/src/Slider/index.parts.ts similarity index 53% rename from packages/mui-base/src/Slider/index.barrel.ts rename to packages/mui-base/src/Slider/index.parts.ts index 79a640ba70..be5d9c2dc2 100644 --- a/packages/mui-base/src/Slider/index.barrel.ts +++ b/packages/mui-base/src/Slider/index.parts.ts @@ -1,9 +1,18 @@ -export { SliderRoot } from './Root/SliderRoot'; -export type * from './Root/SliderRoot.types'; +export { SliderRoot as Root } from './Root/SliderRoot'; +export type { + SliderRootOwnerState as SliderOwnerState, + SliderRootProps as RootProps, + UseSliderParameters, + UseSliderReturnValue, + SliderContextValue, + SliderProviderValue, + SliderThumbMetadata, + Axis, +} from './Root/SliderRoot.types'; export { useSliderRoot } from './Root/useSliderRoot'; export * from './Root/SliderProvider'; -export { SliderOutput } from './Output/SliderOutput'; +export { SliderOutput as Output } from './Output/SliderOutput'; export type { SliderOutputProps as OutputProps, UseSliderOutputParameters, @@ -11,7 +20,7 @@ export type { } from './Output/SliderOutput.types'; export { useSliderOutput } from './Output/useSliderOutput'; -export { SliderControl } from './Control/SliderControl'; +export { SliderControl as Control } from './Control/SliderControl'; export type { SliderControlProps as ControlProps, UseSliderControlParameters, @@ -19,19 +28,19 @@ export type { } from './Control/SliderControl.types'; export { useSliderControl } from './Control/useSliderControl'; -export { SliderTrack } from './Track/SliderTrack'; -export type { SliderTrackProps } from './Track/SliderTrack.types'; +export { SliderTrack as Track } from './Track/SliderTrack'; +export type { SliderTrackProps as TrackProps } from './Track/SliderTrack.types'; -export { SliderThumb } from './Thumb/SliderThumb'; +export { SliderThumb as Thumb } from './Thumb/SliderThumb'; export type { - SliderThumbOwnerState, - SliderThumbProps, + SliderThumbOwnerState as ThumbOwnerState, + SliderThumbProps as ThumbProps, UseSliderThumbParameters, UseSliderThumbReturnValue, } from './Thumb/SliderThumb.types'; export { useSliderThumb } from './Thumb/useSliderThumb'; -export { SliderIndicator } from './Indicator/SliderIndicator'; +export { SliderIndicator as Indicator } from './Indicator/SliderIndicator'; export type { SliderIndicatorProps as IndicatorProps, UseSliderIndicatorParameters, diff --git a/packages/mui-base/src/Slider/index.ts b/packages/mui-base/src/Slider/index.ts index be5d9c2dc2..953696abeb 100644 --- a/packages/mui-base/src/Slider/index.ts +++ b/packages/mui-base/src/Slider/index.ts @@ -1,49 +1 @@ -export { SliderRoot as Root } from './Root/SliderRoot'; -export type { - SliderRootOwnerState as SliderOwnerState, - SliderRootProps as RootProps, - UseSliderParameters, - UseSliderReturnValue, - SliderContextValue, - SliderProviderValue, - SliderThumbMetadata, - Axis, -} from './Root/SliderRoot.types'; -export { useSliderRoot } from './Root/useSliderRoot'; -export * from './Root/SliderProvider'; - -export { SliderOutput as Output } from './Output/SliderOutput'; -export type { - SliderOutputProps as OutputProps, - UseSliderOutputParameters, - UseSliderOutputReturnValue, -} from './Output/SliderOutput.types'; -export { useSliderOutput } from './Output/useSliderOutput'; - -export { SliderControl as Control } from './Control/SliderControl'; -export type { - SliderControlProps as ControlProps, - UseSliderControlParameters, - UseSliderControlReturnValue, -} from './Control/SliderControl.types'; -export { useSliderControl } from './Control/useSliderControl'; - -export { SliderTrack as Track } from './Track/SliderTrack'; -export type { SliderTrackProps as TrackProps } from './Track/SliderTrack.types'; - -export { SliderThumb as Thumb } from './Thumb/SliderThumb'; -export type { - SliderThumbOwnerState as ThumbOwnerState, - SliderThumbProps as ThumbProps, - UseSliderThumbParameters, - UseSliderThumbReturnValue, -} from './Thumb/SliderThumb.types'; -export { useSliderThumb } from './Thumb/useSliderThumb'; - -export { SliderIndicator as Indicator } from './Indicator/SliderIndicator'; -export type { - SliderIndicatorProps as IndicatorProps, - UseSliderIndicatorParameters, - UseSliderIndicatorReturnValue, -} from './Indicator/SliderIndicator.types'; -export { useSliderIndicator } from './Indicator/useSliderIndicator'; +export * as Slider from './index.parts'; diff --git a/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx b/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx index 110ee301e2..0a612b9982 100644 --- a/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx +++ b/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { act, fireEvent, screen } from '@mui/internal-test-utils'; -import * as Switch from '@base_ui/react/Switch'; +import { Switch } from '@base_ui/react/Switch'; import { userEvent } from '@testing-library/user-event'; import { describeConformance, createRenderer } from '#test-utils'; diff --git a/packages/mui-base/src/Switch/Thumb/SwitchThumb.test.tsx b/packages/mui-base/src/Switch/Thumb/SwitchThumb.test.tsx index 9e49e094b7..8f002d66b7 100644 --- a/packages/mui-base/src/Switch/Thumb/SwitchThumb.test.tsx +++ b/packages/mui-base/src/Switch/Thumb/SwitchThumb.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Switch from '@base_ui/react/Switch'; +import { Switch } from '@base_ui/react/Switch'; import { createRenderer, describeConformance } from '#test-utils'; import { SwitchRootContext } from '../Root/SwitchRootContext'; diff --git a/packages/mui-base/src/Switch/index.barrel.ts b/packages/mui-base/src/Switch/index.barrel.ts deleted file mode 100644 index f717fab5ad..0000000000 --- a/packages/mui-base/src/Switch/index.barrel.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { SwitchRoot } from './Root/SwitchRoot'; -export { SwitchThumb } from './Thumb/SwitchThumb'; diff --git a/packages/mui-base/src/Switch/index.parts.ts b/packages/mui-base/src/Switch/index.parts.ts new file mode 100644 index 0000000000..7edb4a4336 --- /dev/null +++ b/packages/mui-base/src/Switch/index.parts.ts @@ -0,0 +1,2 @@ +export { SwitchRoot as Root } from './Root/SwitchRoot'; +export { SwitchThumb as Thumb } from './Thumb/SwitchThumb'; diff --git a/packages/mui-base/src/Switch/index.ts b/packages/mui-base/src/Switch/index.ts index 7edb4a4336..4b7a983cb3 100644 --- a/packages/mui-base/src/Switch/index.ts +++ b/packages/mui-base/src/Switch/index.ts @@ -1,2 +1 @@ -export { SwitchRoot as Root } from './Root/SwitchRoot'; -export { SwitchThumb as Thumb } from './Thumb/SwitchThumb'; +export * as Switch from './index.parts'; diff --git a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx index 24900b5a28..30be9b3508 100644 --- a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx +++ b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { act, fireEvent, screen } from '@mui/internal-test-utils'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Tabs/Tab/Tab.test.tsx b/packages/mui-base/src/Tabs/Tab/Tab.test.tsx index 328052085d..5a899d1fb5 100644 --- a/packages/mui-base/src/Tabs/Tab/Tab.test.tsx +++ b/packages/mui-base/src/Tabs/Tab/Tab.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { createRenderer, describeConformance } from '#test-utils'; import { TabsListProviderValue, TabsListProvider } from '../TabsList/TabsListProvider'; import { TabsRootContext } from '../Root/TabsRootContext'; diff --git a/packages/mui-base/src/Tabs/Tab/useTab.test.tsx b/packages/mui-base/src/Tabs/Tab/useTab.test.tsx index 34b550ee9b..7d7e5a3041 100644 --- a/packages/mui-base/src/Tabs/Tab/useTab.test.tsx +++ b/packages/mui-base/src/Tabs/Tab/useTab.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { createRenderer, screen, fireEvent } from '@mui/internal-test-utils'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { useTab } from './useTab'; describe('useTab', () => { diff --git a/packages/mui-base/src/Tabs/TabIndicator/TabIndicator.test.tsx b/packages/mui-base/src/Tabs/TabIndicator/TabIndicator.test.tsx index 7cfbe38a87..16b755f0df 100644 --- a/packages/mui-base/src/Tabs/TabIndicator/TabIndicator.test.tsx +++ b/packages/mui-base/src/Tabs/TabIndicator/TabIndicator.test.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { waitFor } from '@mui/internal-test-utils'; import { createRenderer, describeConformance } from '#test-utils'; diff --git a/packages/mui-base/src/Tabs/TabPanel/TabPanel.test.tsx b/packages/mui-base/src/Tabs/TabPanel/TabPanel.test.tsx index b17e0b994b..727044873a 100644 --- a/packages/mui-base/src/Tabs/TabPanel/TabPanel.test.tsx +++ b/packages/mui-base/src/Tabs/TabPanel/TabPanel.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { createRenderer, describeConformance } from '#test-utils'; import { TabsProvider, TabsProviderValue } from '../Root/TabsProvider'; diff --git a/packages/mui-base/src/Tabs/TabPanel/useTabPanel.test.tsx b/packages/mui-base/src/Tabs/TabPanel/useTabPanel.test.tsx index 3e9b644a92..bbbe3ba408 100644 --- a/packages/mui-base/src/Tabs/TabPanel/useTabPanel.test.tsx +++ b/packages/mui-base/src/Tabs/TabPanel/useTabPanel.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { createRenderer, screen, fireEvent } from '@mui/internal-test-utils'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { useTabPanel } from './useTabPanel'; describe('useTabPanel', () => { diff --git a/packages/mui-base/src/Tabs/TabsList/TabsList.test.tsx b/packages/mui-base/src/Tabs/TabsList/TabsList.test.tsx index 959a65bca9..9f040541c5 100644 --- a/packages/mui-base/src/Tabs/TabsList/TabsList.test.tsx +++ b/packages/mui-base/src/Tabs/TabsList/TabsList.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { act } from '@mui/internal-test-utils'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { createRenderer, describeConformance } from '#test-utils'; import { TabsRootContext } from '../Root/TabsRootContext'; diff --git a/packages/mui-base/src/Tabs/TabsList/useTabsList.test.tsx b/packages/mui-base/src/Tabs/TabsList/useTabsList.test.tsx index 5efc61429e..7a89c7d6df 100644 --- a/packages/mui-base/src/Tabs/TabsList/useTabsList.test.tsx +++ b/packages/mui-base/src/Tabs/TabsList/useTabsList.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; import { createRenderer, screen, fireEvent } from '@mui/internal-test-utils'; -import * as Tabs from '@base_ui/react/Tabs'; +import { Tabs } from '@base_ui/react/Tabs'; import { useTabsList } from './useTabsList'; describe('useTabsList', () => { diff --git a/packages/mui-base/src/Tabs/index.barrel.ts b/packages/mui-base/src/Tabs/index.barrel.ts deleted file mode 100644 index d8c499e9e6..0000000000 --- a/packages/mui-base/src/Tabs/index.barrel.ts +++ /dev/null @@ -1,5 +0,0 @@ -export { TabsRoot } from './Root/TabsRoot'; -export { Tab } from './Tab/Tab'; -export { TabIndicator } from './TabIndicator/TabIndicator'; -export { TabPanel } from './TabPanel/TabPanel'; -export { TabsList } from './TabsList/TabsList'; diff --git a/packages/mui-base/src/Tabs/index.parts.ts b/packages/mui-base/src/Tabs/index.parts.ts new file mode 100644 index 0000000000..acb9d122d3 --- /dev/null +++ b/packages/mui-base/src/Tabs/index.parts.ts @@ -0,0 +1,5 @@ +export { TabsRoot as Root } from './Root/TabsRoot'; +export { Tab } from './Tab/Tab'; +export { TabIndicator as Indicator } from './TabIndicator/TabIndicator'; +export { TabPanel as Panel } from './TabPanel/TabPanel'; +export { TabsList as List } from './TabsList/TabsList'; diff --git a/packages/mui-base/src/Tabs/index.ts b/packages/mui-base/src/Tabs/index.ts index acb9d122d3..10ed66c376 100644 --- a/packages/mui-base/src/Tabs/index.ts +++ b/packages/mui-base/src/Tabs/index.ts @@ -1,5 +1 @@ -export { TabsRoot as Root } from './Root/TabsRoot'; -export { Tab } from './Tab/Tab'; -export { TabIndicator as Indicator } from './TabIndicator/TabIndicator'; -export { TabPanel as Panel } from './TabPanel/TabPanel'; -export { TabsList as List } from './TabsList/TabsList'; +export * as Tabs from './index.parts'; diff --git a/packages/mui-base/src/Tooltip/Arrow/TooltipArrow.test.tsx b/packages/mui-base/src/Tooltip/Arrow/TooltipArrow.test.tsx index 53fda0b478..f7311dd8d6 100644 --- a/packages/mui-base/src/Tooltip/Arrow/TooltipArrow.test.tsx +++ b/packages/mui-base/src/Tooltip/Arrow/TooltipArrow.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Tooltip/Popup/TooltipPopup.test.tsx b/packages/mui-base/src/Tooltip/Popup/TooltipPopup.test.tsx index 8841512bb5..b0fa70b6cb 100644 --- a/packages/mui-base/src/Tooltip/Popup/TooltipPopup.test.tsx +++ b/packages/mui-base/src/Tooltip/Popup/TooltipPopup.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { createRenderer, describeConformance } from '#test-utils'; diff --git a/packages/mui-base/src/Tooltip/Positioner/TooltipPositioner.test.tsx b/packages/mui-base/src/Tooltip/Positioner/TooltipPositioner.test.tsx index 7d8af1460e..eba09c7535 100644 --- a/packages/mui-base/src/Tooltip/Positioner/TooltipPositioner.test.tsx +++ b/packages/mui-base/src/Tooltip/Positioner/TooltipPositioner.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Tooltip/Provider/TooltipProvider.test.tsx b/packages/mui-base/src/Tooltip/Provider/TooltipProvider.test.tsx index 9fd5b8acb6..503541aff9 100644 --- a/packages/mui-base/src/Tooltip/Provider/TooltipProvider.test.tsx +++ b/packages/mui-base/src/Tooltip/Provider/TooltipProvider.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { screen, fireEvent, flushMicrotasks } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { createRenderer } from '#test-utils'; diff --git a/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx b/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx index a73c749016..809bc2ce66 100644 --- a/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx +++ b/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { act, fireEvent, flushMicrotasks, screen } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { spy } from 'sinon'; diff --git a/packages/mui-base/src/Tooltip/Trigger/TooltipTrigger.test.tsx b/packages/mui-base/src/Tooltip/Trigger/TooltipTrigger.test.tsx index d030237d1c..c3406649dd 100644 --- a/packages/mui-base/src/Tooltip/Trigger/TooltipTrigger.test.tsx +++ b/packages/mui-base/src/Tooltip/Trigger/TooltipTrigger.test.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import * as Tooltip from '@base_ui/react/Tooltip'; +import { Tooltip } from '@base_ui/react/Tooltip'; import { createRenderer, describeConformance } from '#test-utils'; describe('', () => { diff --git a/packages/mui-base/src/Tooltip/index.barrel.ts b/packages/mui-base/src/Tooltip/index.barrel.ts deleted file mode 100644 index 79e7247ec7..0000000000 --- a/packages/mui-base/src/Tooltip/index.barrel.ts +++ /dev/null @@ -1,6 +0,0 @@ -export { TooltipRoot } from './Root/TooltipRoot'; -export { TooltipTrigger } from './Trigger/TooltipTrigger'; -export { TooltipPositioner } from './Positioner/TooltipPositioner'; -export { TooltipPopup } from './Popup/TooltipPopup'; -export { TooltipArrow } from './Arrow/TooltipArrow'; -export { TooltipProvider } from './Provider/TooltipProvider'; diff --git a/packages/mui-base/src/Tooltip/index.parts.ts b/packages/mui-base/src/Tooltip/index.parts.ts new file mode 100644 index 0000000000..00ec741c91 --- /dev/null +++ b/packages/mui-base/src/Tooltip/index.parts.ts @@ -0,0 +1,6 @@ +export { TooltipRoot as Root } from './Root/TooltipRoot'; +export { TooltipTrigger as Trigger } from './Trigger/TooltipTrigger'; +export { TooltipPositioner as Positioner } from './Positioner/TooltipPositioner'; +export { TooltipPopup as Popup } from './Popup/TooltipPopup'; +export { TooltipArrow as Arrow } from './Arrow/TooltipArrow'; +export { TooltipProvider as Provider } from './Provider/TooltipProvider'; diff --git a/packages/mui-base/src/Tooltip/index.ts b/packages/mui-base/src/Tooltip/index.ts index 00ec741c91..6fb3a4251d 100644 --- a/packages/mui-base/src/Tooltip/index.ts +++ b/packages/mui-base/src/Tooltip/index.ts @@ -1,6 +1 @@ -export { TooltipRoot as Root } from './Root/TooltipRoot'; -export { TooltipTrigger as Trigger } from './Trigger/TooltipTrigger'; -export { TooltipPositioner as Positioner } from './Positioner/TooltipPositioner'; -export { TooltipPopup as Popup } from './Popup/TooltipPopup'; -export { TooltipArrow as Arrow } from './Arrow/TooltipArrow'; -export { TooltipProvider as Provider } from './Provider/TooltipProvider'; +export * as Tooltip from './index.parts'; diff --git a/packages/mui-base/src/index.ts b/packages/mui-base/src/index.ts index c8ae7fc381..5c2fbaeff3 100644 --- a/packages/mui-base/src/index.ts +++ b/packages/mui-base/src/index.ts @@ -1,13 +1,19 @@ -export * from './AlertDialog/index.barrel'; -export * from './Checkbox/index.barrel'; -export * from './CheckboxGroup/index.barrel'; -export * from './Dialog/index.barrel'; -export * from './Menu/index.barrel'; -export * from './NumberField/index.barrel'; -export * from './Popover/index.barrel'; -export * from './Progress/index.barrel'; -export * from './Separator/index.barrel'; -export * from './Slider/index.barrel'; -export * from './Switch/index.barrel'; -export * from './Tabs/index.barrel'; -export * from './Tooltip/index.barrel'; +export * from './AlertDialog'; +export * from './Checkbox'; +export * from './CheckboxGroup'; +export * from './Collapsible'; +export * from './Dialog'; +export * from './Field'; +export * from './Fieldset'; +export * from './Form'; +export * from './Menu'; +export * from './NumberField'; +export * from './Popover'; +export * from './PreviewCard'; +export * from './Progress'; +export * from './RadioGroup'; +export * from './Separator'; +export * from './Slider'; +export * from './Switch'; +export * from './Tabs'; +export * from './Tooltip'; diff --git a/scripts/buildApiDocs/config/getComponentImports.ts b/scripts/buildApiDocs/config/getComponentImports.ts index 4e2968527b..0e88f6fcc0 100644 --- a/scripts/buildApiDocs/config/getComponentImports.ts +++ b/scripts/buildApiDocs/config/getComponentImports.ts @@ -27,7 +27,7 @@ export function getComponentImports(name: string, filename: string) { if (Object.keys(componentExportExceptions).includes(name)) { return [ - `import * as ${componentDirectory} from '@base_ui/react/${componentDirectory}';\nconst ${name} = ${componentDirectory}.${componentExportExceptions[name]};`, + `import { ${componentDirectory} } from '@base_ui/react/${componentDirectory}';\nconst ${name} = ${componentDirectory}.${componentExportExceptions[name]};`, ]; } @@ -35,7 +35,7 @@ export function getComponentImports(name: string, filename: string) { // cases like Switch/SwitchTrack.tsx const childName = name.slice(componentDirectory.length); return [ - `import * as ${componentDirectory} from '@base_ui/react/${componentDirectory}';\nconst ${name} = ${componentDirectory}.${childName};`, + `import { ${componentDirectory} } from '@base_ui/react/${componentDirectory}';\nconst ${name} = ${componentDirectory}.${childName};`, ]; } From 006f8fdaac12d3879d358c35d97363cf7381c0db Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Dudak?= Date: Mon, 14 Oct 2024 10:33:05 +0200 Subject: [PATCH 4/4] [core] Restore development playground (#701) --- .gitignore | 3 +- docs/app/not-found.tsx | 15 +++++++- docs/app/playground/[slug]/page.tsx | 53 ++++++++++++++++++++++++++++ docs/src/blocks/GoogleAnalytics.tsx | 20 +++++++++++ docs/src/blocks/GoogleTagManager.tsx | 29 +++------------ 5 files changed, 94 insertions(+), 26 deletions(-) create mode 100644 docs/app/playground/[slug]/page.tsx diff --git a/.gitignore b/.gitignore index a48dc934e1..af81c2c90b 100644 --- a/.gitignore +++ b/.gitignore @@ -14,7 +14,8 @@ /coverage /docs/.env.local /docs/export -/docs/pages/playground/ +/docs/app/playground/* +!/docs/app/playground/\[slug\] /docs/public/feed/ /examples/**/.cache /test/bundling/fixtures/*/yarn.lock diff --git a/docs/app/not-found.tsx b/docs/app/not-found.tsx index d676eb675c..fd8e66cc50 100644 --- a/docs/app/not-found.tsx +++ b/docs/app/not-found.tsx @@ -1,5 +1,18 @@ import * as React from 'react'; +import { AppBar } from 'docs-base/src/components/AppBar'; +import { Navigation } from 'docs-base/src/components/Navigation'; +import routes from 'docs-base/data/pages'; +import classes from './(content)/styles.module.css'; + export default function NotFound() { - return

Page not found

; + return ( + + + +
+

Page not found

+
+ + ); } diff --git a/docs/app/playground/[slug]/page.tsx b/docs/app/playground/[slug]/page.tsx new file mode 100644 index 0000000000..f4be320ee8 --- /dev/null +++ b/docs/app/playground/[slug]/page.tsx @@ -0,0 +1,53 @@ +import * as React from 'react'; +import { type Metadata } from 'next'; +import { notFound } from 'next/navigation'; +import { type Dirent } from 'node:fs'; +import { basename, extname } from 'node:path'; +import { readdir } from 'node:fs/promises'; + +interface Props { + params: { + slug: string; + }; +} + +const DUMMY_SLUG = '_'; + +export default async function Page(props: Props) { + const { + params: { slug }, + } = props; + + if (slug === DUMMY_SLUG) { + notFound(); + } + + try { + const Playground = (await import(`../${slug}.tsx`)).default; + return ; + } catch (error) { + notFound(); + } +} + +export async function generateStaticParams() { + const routes = (await readdir('app/playground', { withFileTypes: true })) + .filter( + (entry: Dirent) => entry.name.endsWith('.tsx') && entry.name !== 'page.tsx' && entry.isFile(), + ) + .map((entry: Dirent) => ({ slug: basename(entry.name, extname(entry.name)) })); + + if (routes.length === 0) { + return [{ slug: DUMMY_SLUG }]; + } + + return routes; +} + +export async function generateMetadata({ params }: Props): Promise { + const { slug } = params; + + return { + title: `${slug} - Playground`, + }; +} diff --git a/docs/src/blocks/GoogleAnalytics.tsx b/docs/src/blocks/GoogleAnalytics.tsx index a1e83a8c5a..ce97cdcf26 100644 --- a/docs/src/blocks/GoogleAnalytics.tsx +++ b/docs/src/blocks/GoogleAnalytics.tsx @@ -1,6 +1,7 @@ 'use client'; import * as React from 'react'; import { useMediaQuery } from '@base_ui/react/useMediaQuery'; +import useEnhancedEffect from '@mui/utils/useEnhancedEffect'; let boundDataGaListener = false; @@ -19,6 +20,25 @@ const GoogleAnalytics = React.memo(function GoogleAnalytics(props: GoogleAnalyti userLanguage, } = props; + useEnhancedEffect(() => { + // @ts-expect-error + window.dataLayer = window.dataLayer || []; + + function gtag(...args: unknown[]) { + // @ts-expect-error + window.dataLayer.push(...args); + } + + window.gtag = gtag; + + gtag('js', new Date()); + + // eslint-disable-next-line no-template-curly-in-string + gtag('config', '${id}', { + send_page_view: false, + }); + }, []); + React.useEffect(() => { if (!boundDataGaListener) { boundDataGaListener = true; diff --git a/docs/src/blocks/GoogleTagManager.tsx b/docs/src/blocks/GoogleTagManager.tsx index 3888df0720..1ea6f5904c 100644 --- a/docs/src/blocks/GoogleTagManager.tsx +++ b/docs/src/blocks/GoogleTagManager.tsx @@ -8,29 +8,10 @@ interface GoogleTagManagerProps { export function GoogleTagManager(props: React.PropsWithChildren) { const { id } = props; return ( - -