diff --git a/apps/client/package.json b/apps/client/package.json index 4cb9a126c..01ac3f056 100644 --- a/apps/client/package.json +++ b/apps/client/package.json @@ -4,7 +4,7 @@ "private": true, "type": "module", "dependencies": { - "@base-ui-components/react": "1.0.0-beta.3", + "@base-ui-components/react": "1.0.0-beta.4", "@dnd-kit/core": "^6.3.1", "@dnd-kit/sortable": "^10.0.0", "@dnd-kit/utilities": "^3.2.2", diff --git a/apps/client/src/common/components/select/Select.module.scss b/apps/client/src/common/components/select/Select.module.scss index 70aa3af22..26bf9f129 100644 --- a/apps/client/src/common/components/select/Select.module.scss +++ b/apps/client/src/common/components/select/Select.module.scss @@ -62,8 +62,6 @@ padding: 2px; border-radius: $component-border-radius-md; color: $ui-white; - overflow-y: auto; - max-height: 20rem; border: 1px solid $gray-1000; &[data-side='start'] { @@ -73,6 +71,16 @@ } } +.list { + box-sizing: border-box; + position: relative; + padding-block: 0.25rem; + overflow-y: auto; + max-height: 20rem; + max-height: var(--available-height); + scroll-padding-block: 1.5rem; +} + .item { box-sizing: border-box; outline: 0; diff --git a/apps/client/src/common/components/select/Select.tsx b/apps/client/src/common/components/select/Select.tsx index 13faf5926..076daa674 100644 --- a/apps/client/src/common/components/select/Select.tsx +++ b/apps/client/src/common/components/select/Select.tsx @@ -31,14 +31,17 @@ export default function Select({ options, fluid, size = 'medium', ...selectRo - {options.map(({ disabled, label, value }) => ( - - - - - {label} - - ))} + + + {options.map(({ disabled, label, value }) => ( + + + + + {label} + + ))} + diff --git a/apps/client/src/features/sharing/GenerateLinkForm.tsx b/apps/client/src/features/sharing/GenerateLinkForm.tsx index a54730254..3f1022e35 100644 --- a/apps/client/src/features/sharing/GenerateLinkForm.tsx +++ b/apps/client/src/features/sharing/GenerateLinkForm.tsx @@ -225,6 +225,7 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, presets, is setValue('lockNav', checked, { shouldDirty: true })} disabled={watch('lockConfig')} @@ -239,6 +240,7 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, presets, is { if (checked) { @@ -254,6 +256,7 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, presets, is setValue('authenticate', checked, { shouldDirty: true })} /> diff --git a/e2e/tests/features/206-url-preset.spec.ts b/e2e/tests/features/206-url-preset.spec.ts index 8b6e5866b..c8431cecb 100644 --- a/e2e/tests/features/206-url-preset.spec.ts +++ b/e2e/tests/features/206-url-preset.spec.ts @@ -92,12 +92,13 @@ test.describe('URL Preset', () => { // select options await page.getByRole('combobox').filter({ hasText: 'Timer' }).click(); await page.getByText('URL Preset: testing').click(); - await page.locator('button[name="lockNav"]').click(); - await page.locator('button[name="lockConfig"]').click(); + await page.getByTestId('lockNav').click(); + await page.getByTestId('lockConfig').click(); // create and verify link await page.getByRole('button', { name: 'Create share link' }).click(); await expect(page.getByTestId('copy-link')).toContainText('/preset/testing'); + await expect(page.getByTestId('copy-link')).toContainText('/preset/testing'); await expect(page.getByTestId('copy-link')).toContainText('n=1'); // verify the preset @@ -140,7 +141,7 @@ test.describe('Sharing from cuesheet', () => { await page.getByRole('textbox').fill('cuesheet-read-test'); await page.getByText('Custom write').click(); await page.getByText('Custom read').click(); - await page.locator('button[name="lockNav"]').click(); + await page.getByTestId('lockNav').click(); await page.getByTestId('write-flag').click(); await page.getByTestId('write-cue').click(); await page.getByTestId('write-title').click(); @@ -184,7 +185,7 @@ test.describe('Sharing from cuesheet', () => { await page.getByRole('textbox').fill('cuesheet-scope-test'); await page.getByText('Custom write').click(); await page.getByText('Custom read').click(); - await page.locator('button[name="lockNav"]').click(); + await page.getByTestId('lockNav').click(); await page.getByTestId('write-flag').click(); await page.getByTestId('write-cue').click(); await page.getByTestId('write-timeStart').click(); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 18d780c73..9a262bb9c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -96,8 +96,8 @@ importers: apps/client: dependencies: '@base-ui-components/react': - specifier: 1.0.0-beta.3 - version: 1.0.0-beta.3(@types/react@19.1.12)(react-dom@19.1.1(react@19.1.1))(react@19.1.1) + specifier: 1.0.0-beta.4 + version: 1.0.0-beta.4(@types/react@19.1.12)(react-dom@19.1.1(react@19.1.1))(react@19.1.1) '@dnd-kit/core': specifier: ^6.3.1 version: 6.3.1(react-dom@19.1.1(react@19.1.1))(react@19.1.1) @@ -699,8 +699,8 @@ packages: peerDependencies: '@babel/core': ^7.0.0-0 - '@babel/runtime@7.28.3': - resolution: {integrity: sha512-9uIQ10o0WGdpP6GDhXcdOJPJuDgFtIDtN/9+ArJQ2NAfAmiuhTQdzkaTGR33v43GYS2UrSA0eX2pPPHoFVvpxA==} + '@babel/runtime@7.28.4': + resolution: {integrity: sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==} engines: {node: '>=6.9.0'} '@babel/template@7.22.15': @@ -743,8 +743,8 @@ packages: resolution: {integrity: sha512-ruv7Ae4J5dUYULmeXw1gmb7rYRz57OWCPM57pHojnLq/3Z1CK2lNSLTCVjxVk1F/TZHwOZZrOWi0ur95BbLxNQ==} engines: {node: '>=6.9.0'} - '@base-ui-components/react@1.0.0-beta.3': - resolution: {integrity: sha512-4sAq6zmDA9ixV2HRjjeM1+tSEw5R6nvGjXUQmFoQnC3DZLEUdwO94gWDmUDdpoDuChn27jdbaJs9F0Ih4w2UAA==} + '@base-ui-components/react@1.0.0-beta.4': + resolution: {integrity: sha512-sPYKj26gbFHD2ZsrMYqQshXnMuomBodzPn+d0dDxWieTj232XCQ9QGt9fU9l5SDGC9hi8s24lDlg9FXPSI7T8A==} engines: {node: '>=14.0.0'} peerDependencies: '@types/react': ^17 || ^18 || ^19 @@ -754,8 +754,8 @@ packages: '@types/react': optional: true - '@base-ui-components/utils@0.1.1': - resolution: {integrity: sha512-HWXZA8upEKgrdL1rQqxWu1H+2tB2cXzY2jCxvgnpUv3eoWN2jldhXxMZnXIjZF7jahGxSWXfSIM/qskiTWFFxA==} + '@base-ui-components/utils@0.1.2': + resolution: {integrity: sha512-aEitDGpMsYO2qnSpYOwZNykn9Rzn2ioyEVk2fyDRH7t+TIHVKpp9CeV7SPTq43M9mMSDxQ+7UeZJVkrj2dCVIQ==} peerDependencies: '@types/react': ^17 || ^18 || ^19 react: ^17 || ^18 || ^19 @@ -5646,7 +5646,7 @@ snapshots: '@babel/core': 7.27.4 '@babel/helper-plugin-utils': 7.27.1 - '@babel/runtime@7.28.3': {} + '@babel/runtime@7.28.4': {} '@babel/template@7.22.15': dependencies: @@ -5732,10 +5732,10 @@ snapshots: '@babel/helper-string-parser': 7.27.1 '@babel/helper-validator-identifier': 7.27.1 - '@base-ui-components/react@1.0.0-beta.3(@types/react@19.1.12)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)': + '@base-ui-components/react@1.0.0-beta.4(@types/react@19.1.12)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)': dependencies: - '@babel/runtime': 7.28.3 - '@base-ui-components/utils': 0.1.1(@types/react@19.1.12)(react-dom@19.1.1(react@19.1.1))(react@19.1.1) + '@babel/runtime': 7.28.4 + '@base-ui-components/utils': 0.1.2(@types/react@19.1.12)(react-dom@19.1.1(react@19.1.1))(react@19.1.1) '@floating-ui/react-dom': 2.1.6(react-dom@19.1.1(react@19.1.1))(react@19.1.1) '@floating-ui/utils': 0.2.10 react: 19.1.1 @@ -5746,9 +5746,9 @@ snapshots: optionalDependencies: '@types/react': 19.1.12 - '@base-ui-components/utils@0.1.1(@types/react@19.1.12)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)': + '@base-ui-components/utils@0.1.2(@types/react@19.1.12)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)': dependencies: - '@babel/runtime': 7.28.3 + '@babel/runtime': 7.28.4 '@floating-ui/utils': 0.2.10 react: 19.1.1 react-dom: 19.1.1(react@19.1.1)