Skip to content

refactor: remove nested modifier and unused multiline prop from unordered list mixins and stories #3113

New issue

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

Sign up for GitHub

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

Already on GitHub? Sign in to your account

Draft
pixelgitter wants to merge 6 commits into
base: main
Choose a base branch
from
Draft

refactor: remove nested modifier and unused multiline prop from unordered list mixins and stories #3113

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
69f33f4
refactor: remove nested modifier and multiline prop from unordered li…
pixelgitter Apr 10, 2026
d727980
refactor: add changeset for removal of redundant nested modifier in U…
pixelgitter Apr 10, 2026
7fd4551
fix: updated packages with known security issues
pixelgitter Apr 10, 2026
1d94211
Merge branch 'main' into fix/ul-removal-nested-modifier
Apr 13, 2026
3a6e998
chore: remove unneeded changeset for storybook-css
eslook Apr 13, 2026
ec37b87
feat: remove nested token from unordered-list
Apr 13, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/grumpy-gifts-chew.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@utrecht/unordered-list-css": patch
Copy link
Copy Markdown
Member

@Robbert Robbert Apr 13, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
"@utrecht/unordered-list-css": patch
"@utrecht/unordered-list-css": major

---

The --nested modifier of the UnorderedList became redundant after refactoring the component. The nested lists now have the correct spacing without using the modifier.
5 changes: 5 additions & 0 deletions .changeset/witty-pumas-arrive.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@utrecht/design-tokens": major
---

Removed `utrecht.unordered-list.nested.padding-inline-start` token. The `nested` token of the UnorderedList became redundant after refactoring the component. The nested lists now have the correct spacing without using the token.
7 changes: 0 additions & 7 deletions components/unordered-list/src/_mixin.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,13 +41,6 @@
--utrecht-space-around: 1;
}

@mixin utrecht-unordered-list--nested {
padding-inline-start: var(
--utrecht-unordered-list-nested-padding-inline-start,
var(--utrecht-unordered-list-padding-inline-start, 1ch)
);
}

@mixin utrecht-unordered-list__item {
margin-block-end: var(--utrecht-unordered-list-item-margin-block-end);
margin-block-start: var(--utrecht-unordered-list-item-margin-block-start);
Expand Down
5 changes: 0 additions & 5 deletions components/unordered-list/src/index.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,11 +19,6 @@
@include utrecht-unordered-list--distanced;
}

.utrecht-unordered-list--nested,
.utrecht-unordered-list--html-content ul {
@include utrecht-unordered-list--nested;
}

.utrecht-unordered-list--html-content > li,
.utrecht-unordered-list--html-content ul > li,
.utrecht-unordered-list__item {
Expand Down
4 changes: 2 additions & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,8 @@
"@commitlint/cli": "19.3.0",
"@commitlint/config-conventional": "19.2.2",
"@lerna-lite/cli": "3.5.1",
"@nrwl/cli": "15.9.7",
"@nrwl/nx-cloud": "15.3.5",
"@nrwl/cli": "15.9.3",
"@nrwl/nx-cloud": "19.1.3",
Copy link
Copy Markdown
Member

@Robbert Robbert Apr 13, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Waarom past deze PR dependencies aan, is dat de bedoeling?

If anything, denk ik dat nx verwijderd kan worden

"@nrwl/web": "15.9.7",
"@nrwl/workspace": "15.9.7",
"@typescript-eslint/eslint-plugin": "8.56.1",
Expand Down
2 changes: 0 additions & 2 deletions packages/storybook-css/src/UnorderedList.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -351,7 +351,6 @@ export const CenterMultiline: Story = {
export const CenterMultilineNested: Story = {
args: {
center: true,
multiline: true,
Copy link
Copy Markdown
Contributor

@eslook eslook Apr 13, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Did you remove this on purpose? Since the story id and story name still imply 'multiline'

items: createNestedItems(1, 4, true),
},
name: 'Center (multiline, nested 4 levels)',
Expand Down Expand Up @@ -417,7 +416,6 @@ export const NarrowContainerCenter: Story = {
export const NarrowContainerCenterLongText: Story = {
args: {
center: true,
multiline: true,
Copy link
Copy Markdown
Contributor

@eslook eslook Apr 13, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Did you remove this on purpose? Since the story name still implies 'multiline'

Copy link
Copy Markdown
Member

@Robbert Robbert Apr 13, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Dit moet denk ik wel teruggezet worden inderdaad

Copy link
Copy Markdown
Contributor Author

@pixelgitter pixelgitter Apr 14, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Voor zover ik heb gezien werd er niks gedaan met de multiline argument. Als een zin lang is, gaat deze automatisch op multiline. Om die reden heb ik deze verwijderd.

items: [
{
children:
Expand Down
13 changes: 2 additions & 11 deletions packages/storybook-css/src/UnorderedList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@ interface UnorderedListStoryProps extends UnorderedListProps {
center?: boolean;
items?: UnorderedListItemData[];
htmlContent?: boolean;
nested?: boolean;
level?: number;
}

Expand All @@ -28,20 +27,12 @@ const HTMLList = ({ items }: { items: UnorderedListItemData[] }) => (
</ul>
);

export const UnorderedListStory = ({
children,
center,
items,
htmlContent,
nested,
level = 1,
}: UnorderedListStoryProps) => {
export const UnorderedListStory = ({ children, center, items, htmlContent, level = 1 }: UnorderedListStoryProps) => {
return (
<UnorderedList
className={clsx(`utrecht-unordered-list--level-${level}`, {
'utrecht-unordered-list--center': center,
'utrecht-unordered-list--html-content': htmlContent,
'utrecht-unordered-list--nested': nested,
})}
>
{children}
Expand All @@ -55,7 +46,7 @@ export const UnorderedListStory = ({
: items?.map(({ children: subChildren, items: subItems }) => (
<UnorderedListItem key={`${subChildren}`}>
{subChildren}
{subItems && UnorderedListStory({ items: subItems, nested: true, level: level + 1 })}
{subItems && UnorderedListStory({ items: subItems, level: level + 1 })}
</UnorderedListItem>
))}
</UnorderedList>
Expand Down
Loading
Loading