diff --git a/.release-please-manifest.json b/.release-please-manifest.json
index ac9f4a28d..233dc57da 100644
--- a/.release-please-manifest.json
+++ b/.release-please-manifest.json
@@ -1,4 +1,4 @@
{
- "packages/core": "3.4.0",
+ "packages/core": "3.5.0",
"packages/tokens": "2.0.1"
}
diff --git a/README.md b/README.md
index 7ce089131..3be154f32 100644
--- a/README.md
+++ b/README.md
@@ -23,7 +23,7 @@
| ------- | ------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------- |
| Core | [`@juntossomosmais/atomium`](https://github.com/juntossomosmais/atomium/pkgs/npm/atomium) |
| [README](./packages/core/README.md) |
| React | [`@juntossomosmais/atomium/react`](https://github.com/juntossomosmais/atomium/pkgs/npm/atomium) |
| [README](./packages/react/README.md) |
-| Vue | [`@juntossomosmais/atomium/vue`](https://github.com/juntossomosmais/atomium/pkgs/npm/atomium) |
| [README](./packages/react/README.md) |
+| Vue | [`@juntossomosmais/atomium/vue`](https://github.com/juntossomosmais/atomium/pkgs/npm/atomium) |
| [README](./packages/vue/README.md) |
| Tokens | [`@juntossomosmais/atomium-tokens`](https://github.com/juntossomosmais/atomium/pkgs/npm/atomium-tokens) |
| [README](./packages/tokens/README.md) |
## About
@@ -151,7 +151,7 @@ To locally test Atomium using NPM Link, follow the steps below:
Build the Atomium libraries by running the following command in the root directory of the Atomium project
```bash
-npm run core:build
+npm run build
```
Link the Atomium libraries by navigating to the `node_modules/@juntossomosmais/atomium` directory
diff --git a/packages/core/CHANGELOG.md b/packages/core/CHANGELOG.md
index 26b4d19b1..c6586e5b8 100644
--- a/packages/core/CHANGELOG.md
+++ b/packages/core/CHANGELOG.md
@@ -1,5 +1,12 @@
# Changelog
+## [3.5.0](https://github.com/juntossomosmais/atomium/compare/atomium-v3.4.0...atomium-v3.5.0) (2025-02-12)
+
+
+### Features
+
+* **modal:** add can-dismiss property to control modal dismissal ([#700](https://github.com/juntossomosmais/atomium/issues/700)) ([6b7640f](https://github.com/juntossomosmais/atomium/commit/6b7640f10eb71a30024ffed35b6addfa698b0615))
+
## [3.4.0](https://github.com/juntossomosmais/atomium/compare/atomium-v3.3.0...atomium-v3.4.0) (2025-02-11)
diff --git a/packages/core/package.json b/packages/core/package.json
index 0d8dce209..851d5ce8f 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
{
"name": "@juntossomosmais/atomium",
- "version": "3.4.0",
+ "version": "3.5.0",
"description": "Core of web components for Atomium",
"repository": {
"type": "git",
diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts
index afde1d29d..abceac28e 100644
--- a/packages/core/src/components.d.ts
+++ b/packages/core/src/components.d.ts
@@ -210,11 +210,13 @@ export namespace Components {
}
interface AtomModal {
"alertType"?: 'alert' | 'error';
+ "canDismiss"?: boolean;
"disablePrimaryButton": boolean;
"disableSecondaryButton": boolean;
"hasDivider": boolean;
"hasFooter": boolean;
"headerTitle": string;
+ "idName"?: string;
"isOpen": boolean;
"primaryButtonText"?: string;
"progress"?: number;
@@ -996,11 +998,13 @@ declare namespace LocalJSX {
}
interface AtomModal {
"alertType"?: 'alert' | 'error';
+ "canDismiss"?: boolean;
"disablePrimaryButton"?: boolean;
"disableSecondaryButton"?: boolean;
"hasDivider"?: boolean;
"hasFooter"?: boolean;
"headerTitle"?: string;
+ "idName"?: string;
"isOpen"?: boolean;
"onAtomCloseClick"?: (event: AtomModalCustomEvent) => void;
"onAtomDidDismiss"?: (event: AtomModalCustomEvent) => void;
diff --git a/packages/core/src/components/modal/modal.spec.ts b/packages/core/src/components/modal/modal.spec.ts
index e8bc593fd..5637419fc 100644
--- a/packages/core/src/components/modal/modal.spec.ts
+++ b/packages/core/src/components/modal/modal.spec.ts
@@ -82,6 +82,7 @@ describe('atom-modal', () => {
expect(page.root?.innerHTML).not.toContain('isopen')
})
+
it('should render modal opened if is open is set to true', async () => {
page = await newSpecPage({
components: [AtomModal],
@@ -146,6 +147,7 @@ describe('atom-modal', () => {
expect(spyPrimary).toHaveBeenCalled()
expect(spySecondary).toHaveBeenCalled()
})
+
it('should render progress bar when progress is passed even if it is zero', async () => {
await page.setContent(`
@@ -172,6 +174,7 @@ describe('atom-modal', () => {
''
)
})
+
it('should emit atomIsOpenChange when is open changes', async () => {
const isOpenChangeSpy = jest.fn()
@@ -185,4 +188,43 @@ describe('atom-modal', () => {
expect(isOpenChangeSpy).toHaveBeenCalled()
expect(isOpenChangeSpy.mock.calls[0][0].detail).toBe(true)
})
+
+ it('should render not can close modal when prop.canDismiss is set to true', async () => {
+ page = await newSpecPage({
+ components: [AtomModal],
+ html: `
+
+ Modal content
+
+ `,
+ })
+
+ expect(page.root?.innerHTML).toContain('candismiss')
+ })
+
+ it('should render not can close modal when prop.canDismiss is set to false', async () => {
+ page = await newSpecPage({
+ components: [AtomModal],
+ html: `
+
+ Modal content
+
+ `,
+ })
+
+ expect(page.root?.innerHTML).not.toContain('candismiss')
+ })
+
+ it('should render the modal with the specified id when the idName prop is set', async () => {
+ page = await newSpecPage({
+ components: [AtomModal],
+ html: `
+
+ Modal content
+
+ `,
+ })
+
+ expect(page.root?.innerHTML).toContain('modal-id')
+ })
})
diff --git a/packages/core/src/components/modal/modal.tsx b/packages/core/src/components/modal/modal.tsx
index defcaaf81..c87a66623 100644
--- a/packages/core/src/components/modal/modal.tsx
+++ b/packages/core/src/components/modal/modal.tsx
@@ -18,6 +18,7 @@ type AlertType = Record<'alert' | 'error', { icon: IconProps; color: string }>
scoped: true,
})
export class AtomModal {
+ @Prop() idName?: string
@Prop() trigger?: string
@Prop() headerTitle = ''
@Prop() primaryButtonText?: string
@@ -29,6 +30,7 @@ export class AtomModal {
@Prop() disablePrimaryButton = false
@Prop() disableSecondaryButton = false
@Prop({ mutable: true }) isOpen = false
+ @Prop({ mutable: true }) canDismiss?: boolean
@Event() atomCloseClick: EventEmitter
@Event() atomDidDismiss: EventEmitter
@@ -88,6 +90,7 @@ export class AtomModal {
aria-describedby='atom-modal__content'
ref={(el) => (this.modal = el as HTMLIonModalElement)}
trigger={this.trigger}
+ id={this.idName}
class={{
'atom-modal': true,
'atom-modal--progress': !!this.progress,
@@ -96,6 +99,7 @@ export class AtomModal {
onDidDismiss={this.handleDidDismiss}
onDidPresent={this.handleDidPresent}
isOpen={this.isOpen}
+ canDismiss={this.canDismiss}
part='modal'
>