Skip to content

Commit e336efc

Browse files
benjamin-lyonbenjamin-lyon
authored
Merge branch 'main' into feat/improve-no-items-found-styling
2 parents bb26ccc + af6153c commit e336efc

14 files changed

Lines changed: 296 additions & 121 deletions

File tree

‎.github/workflows/conventional-pr-title.yaml‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
name: Enforce Conventional PR Title
2+
3+
on:
4+
pull_request:
5+
types: [ opened, edited, reopened, synchronize ]
6+
7+
permissions: { }
8+
9+
jobs:
10+
pr-title:
11+
runs-on: ubuntu-latest
12+
permissions:
13+
contents: read
14+
pull-requests: write
15+
steps:
16+
- name: Check PR title
17+
uses: amannn/action-semantic-pull-request@v6
18+
env:
19+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
20+
with:
21+
types: |
22+
feat
23+
fix
24+
chore
25+
docs
26+
refactor
27+
test
28+
ci
29+
build
30+
perf
31+
revert
32+
style
33+
requireScope: false

‎.storybook/addons/GitHubSearchAddon/preset.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { dirname, join } from 'node:path';
2+
import { fileURLToPath } from 'node:url';
3+
4+
const __dirname = dirname(fileURLToPath(import.meta.url));
5+
6+
export const managerEntries = (entry = []) => [
7+
...entry,
8+
join(__dirname, 'manager.js'),
9+
];

‎.storybook/addons/SpacingsAddon/preset.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { dirname, join } from 'node:path';
2+
import { fileURLToPath } from 'node:url';
3+
4+
const __dirname = dirname(fileURLToPath(import.meta.url));
5+
6+
export const managerEntries = (entry = []) => [
7+
...entry,
8+
join(__dirname, 'manager.js'),
9+
];

‎.storybook/addons/ThemeAddon/preset.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { dirname, join } from 'node:path';
2+
import { fileURLToPath } from 'node:url';
3+
4+
const __dirname = dirname(fileURLToPath(import.meta.url));
5+
6+
export const managerEntries = (entry = []) => [
7+
...entry,
8+
join(__dirname, 'manager.js'),
9+
];

‎.storybook/main.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,9 @@ const config: StorybookConfig = {
99
'@storybook/addon-links',
1010
'@storybook/addon-designs',
1111
'@storybook/addon-docs',
12-
'./addons/GitHubSearchAddon/manager.js',
13-
'./addons/ThemeAddon/manager.js',
14-
'./addons/SpacingsAddon/manager.js',
12+
import.meta.resolve('./addons/GitHubSearchAddon/preset.js'),
13+
import.meta.resolve('./addons/ThemeAddon/preset.js'),
14+
import.meta.resolve('./addons/SpacingsAddon/preset.js'),
1515
],
1616
core: {},
1717
framework: {

‎.storybook/preview.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ import { sb } from 'storybook/test';
2323
import './index.css';
2424

2525
// Register mocks
26-
sb.mock(import('../src/providers/AuthProvider/AuthProvider'), {
26+
sb.mock(import('../src/providers/AuthProvider/AuthProvider.tsx'), {
2727
spy: true,
2828
});
2929

‎bun.lock‎

Lines changed: 165 additions & 89 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -57,12 +57,12 @@
5757
"@equinor/subsurface-app-management": "5.4.7",
5858
"@eslint/js": "^9.22.0",
5959
"@faker-js/faker": "^9.6.0",
60-
"@storybook/addon-coverage": "^2.0.0",
61-
"@storybook/addon-designs": "^10.0.2",
62-
"@storybook/addon-docs": "^9.1.10",
63-
"@storybook/addon-links": "^9.1.10",
64-
"@storybook/addon-vitest": "^9.1.10",
65-
"@storybook/react-vite": "^9.1.10",
60+
"@storybook/addon-coverage": "^3.0.1",
61+
"@storybook/addon-designs": "^11.1.3",
62+
"@storybook/addon-docs": "^10.4.6",
63+
"@storybook/addon-links": "^10.4.6",
64+
"@storybook/addon-vitest": "^10.4.6",
65+
"@storybook/react-vite": "^10.4.6",
6666
"@tanstack/react-query": "^5.67.2",
6767
"@testing-library/dom": "^10.4.0",
6868
"@testing-library/jest-dom": "^6.6.3",
@@ -86,7 +86,7 @@
8686
"eslint-plugin-react": "^7.37.4",
8787
"eslint-plugin-react-hooks": "^5.2.0",
8888
"eslint-plugin-simple-import-sort": "^12.1.1",
89-
"eslint-plugin-storybook": "^9.1.1",
89+
"eslint-plugin-storybook": "^10.4.6",
9090
"jest-environment-jsdom": "^29.7.0",
9191
"jest-styled-components": "^7.2.0",
9292
"msw": "^2.13.3",
@@ -98,7 +98,7 @@
9898
"react-dom": "^19.0.0",
9999
"resize-observer-polyfill": "^1.5.1",
100100
"resolve-tspaths": "^0.8.23",
101-
"storybook": "^9.1.10",
101+
"storybook": "^10.4.6",
102102
"tsdown": "^0.14.2",
103103
"typescript": "^6.0.2",
104104
"typescript-eslint": "^8.58.2",

‎src/molecules/Select/PersistentComboBox/PersistentComboBox.stories.tsx‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ import {
1010
PersistentComboBox,
1111
PersistentComboBoxProps,
1212
} from './PersistentComboBox';
13-
import { spacings } from 'src/atoms';
1413
import {
1514
SelectedState,
1615
SelectOption,
@@ -88,6 +87,16 @@ const FAKE_ITEMS_WITH_CHILDREN = [
8887
.map((_, grandchildIndex) => ({
8988
label: `${faker.animal.fish()} (Grandchild ${childIndex + 1}.${grandchildIndex + 1})`,
9089
value: faker.string.uuid(),
90+
...(childIndex === 0 && grandchildIndex === 0
91+
? {
92+
children: new Array(2)
93+
.fill(0)
94+
.map((_, greatGrandchildIndex) => ({
95+
label: `${faker.animal.fish()} (Great-Grandchild ${childIndex + 1}.${grandchildIndex + 1}.${greatGrandchildIndex + 1})`,
96+
value: faker.string.uuid(),
97+
})),
98+
}
99+
: {}),
91100
})),
92101
})),
93102
},
@@ -226,8 +235,6 @@ export const SmallParent: Story = {
226235
<div
227236
style={{
228237
height: '500px',
229-
padding: spacings.large,
230-
backgroundColor: 'lightcyan',
231238
}}
232239
>
233240
<PersistentComboBoxWithState {...args} />
@@ -269,8 +276,6 @@ export const LargeParent: Story = {
269276
<div
270277
style={{
271278
height: '1000px',
272-
padding: spacings.large,
273-
backgroundColor: 'lightcyan',
274279
}}
275280
>
276281
<PersistentComboBoxWithState {...args} />
@@ -286,8 +291,6 @@ export const MaxHeight: Story = {
286291
<div
287292
style={{
288293
height: '1000px',
289-
padding: spacings.large,
290-
backgroundColor: 'lightcyan',
291294
}}
292295
>
293296
<PersistentComboBoxWithState {...args} />

‎src/molecules/Select/Select.styles.ts‎

Lines changed: 30 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -193,10 +193,18 @@ const Section = styled.section`
193193
}
194194
> .amplify-combo-box-chip {
195195
cursor: not-allowed;
196-
background: ${colors.interactive.disabled__fill.rgba};
196+
background: ${colors.interactive.disabled__fill.rgba} !important;
197197
color: ${colors.interactive.disabled__text.rgba};
198-
> svg {
198+
outline: 1px solid ${colors.interactive.disabled__border.rgba};
199+
200+
&:hover {
201+
outline: 1px solid ${colors.interactive.disabled__border.rgba};
202+
}
203+
204+
> .content > svg {
199205
fill: ${colors.interactive.disabled__text.rgba};
206+
display: none;
207+
200208
&:hover {
201209
cursor: not-allowed;
202210
background: none;
@@ -298,9 +306,11 @@ interface PersistentComboBoxWrapperProps {
298306
const PersistentComboBoxWrapper = styled.div<PersistentComboBoxWrapperProps>`
299307
position: relative;
300308
isolation: isolate;
309+
display: flex;
310+
flex-direction: column;
301311
border: 1px solid ${colors.ui.background__heavy.rgba};
302312
border-radius: ${shape.corners.borderRadius};
303-
overflow: auto;
313+
overflow: hidden;
304314
background-color: ${colors.ui.background__default.rgba};
305315
height: ${
306316
({ $shouldShowLabel, $maxHeight }) => {
@@ -316,6 +326,12 @@ const PersistentStickyWrapper = styled.div`
316326
z-index: 1;
317327
`;
318328

329+
const PersistentListScrollArea = styled.div`
330+
flex: 1;
331+
min-height: 0;
332+
overflow: auto;
333+
`;
334+
319335
const PersistentListItem = styled.button`
320336
width: 100%;
321337
display: flex;
@@ -401,17 +417,26 @@ const MenuItemWrapper = styled.div`
401417
gap: ${spacings.small};
402418
`;
403419

404-
const SmallButton = styled(Button)`
420+
const smallSquare = css`
405421
width: 36px;
406422
height: 36px;
407423
flex-shrink: 0;
408424
`;
409425

426+
const SmallButton = styled(Button)`
427+
${smallSquare}
428+
`;
429+
430+
const ChevronPlaceholder = styled.div`
431+
${smallSquare}
432+
`;
433+
410434
export {
411435
Button,
412436
ClearButton,
413437
Container,
414438
PersistentGroupsWrapper,
439+
PersistentListScrollArea,
415440
PersistentStickyWrapper,
416441
GroupTitle,
417442
MenuItemSpacer,
@@ -426,6 +451,7 @@ export {
426451
Section,
427452
MenuItemWrapper,
428453
SmallButton,
454+
ChevronPlaceholder,
429455
StyledMenuItem,
430456
ValueText,
431457
};

0 commit comments

Comments
 (0)