scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in fix/STAY-133 (pull request #3313)

Browse Source 
Fix/STAY-133

* fix: Add static summary buttons row on add ancillary flow

* fix: refactor handling of modals

* fix: refactor file structure for add ancillary flow

* Merged in chore/replace-deprecated-body (pull request #3300)

Replace deprecated <Body> with <Typography>

* chore: replace deprecated body component

* refactor: replace Body component with Typography across various components

* merge

Approved-by: Bianca Widstam
Approved-by: Matilda Landström


Approved-by: Bianca Widstam
Approved-by: Matilda Landström
This commit is contained in:
Christel Westerberg
2025-12-11 07:29:36 +00:00
parent 5bcbc23732
commit cd8b30f2ec
35 changed files with 208 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/design-system/lib/components/Modal/index.tsx
View File

@@ -41,11 +41,13 @@ function InnerModal({
withActions,
hideHeader,
className,
contentClassName,
}: PropsWithChildren<InnerModalProps>) {
const intl = useIntl()
const contentClassNames = modalContentVariants({
withActions,
className: contentClassName,
})
function modalStateHandler(newAnimationState: AnimationState) {
@@ -155,6 +157,7 @@ export default function Modal({
withActions = false,
hideHeader = false,
className = '',
contentClassName = '',
}: PropsWithChildren<ModalProps>) {
const [animation, setAnimation] = useState<AnimationState>(
AnimationStateEnum.visible
@@ -188,6 +191,7 @@ export default function Modal({
withActions={withActions}
hideHeader={hideHeader}
className={className}
contentClassName={contentClassName}
>
{children}
</InnerModal>

21
packages/design-system/lib/components/Modal/modal.module.css
View File

@@ -33,7 +33,7 @@
display: flex;
align-items: flex-start;
position: relative;
padding: var(--Space-x3) var(--Space-x7) 0 var(--Space-x3);
padding: var(--Space-x2) var(--Space-x7) var(--Space-x1) var(--Space-x2);
}
.content {
@@ -49,13 +49,13 @@
}
.contentWithoutActions {
padding: 0 var(--Space-x3) var(--Space-x4);
padding: 0 var(--Space-x2) var(--Space-x3);
}
.close {
position: absolute;
top: var(--Space-x2);
right: var(--Space-x2);
top: var(--Space-x1);
right: var(--Space-x1);
}
.verticalCenter {
@@ -80,4 +80,17 @@
.dialog {
max-height: 90dvh;
}
.header {
padding: var(--Space-x3) var(--Space-x7) var(--Space-x1) var(--Space-x3);
}
.contentWithoutActions {
padding: 0 var(--Space-x3) var(--Space-x4);
}
.close {
top: var(--Space-x2);
right: var(--Space-x2);
}
}

1
packages/design-system/lib/components/Modal/modal.ts
View File

@@ -15,6 +15,7 @@ export type ModalProps = {
withActions?: boolean
hideHeader?: boolean
className?: string
contentClassName?: string
} & (
| {
trigger: JSX.Element