-
{this.success ? successIcon : failureIcon}
+
{this.success ? : failureIcon}
{this.success ? 'Verified.' : 'Failure.'}
diff --git a/src/components/session-card/readme.md b/src/components/session-card/readme.md
index 699d65c..a6bde93 100644
--- a/src/components/session-card/readme.md
+++ b/src/components/session-card/readme.md
@@ -18,12 +18,14 @@
### Depends on
+- [d-icon](../icon)
- [d-heading](../heading)
- [d-text](../text)
### Graph
```mermaid
graph TD;
+ d-session-card --> d-icon
d-session-card --> d-heading
d-session-card --> d-text
style d-session-card fill:#f9f,stroke:#333,stroke-width:4px
diff --git a/src/components/settings-menu/d-settings-menu.css b/src/components/settings-menu/d-settings-menu.css
new file mode 100644
index 0000000..5d4e87f
--- /dev/null
+++ b/src/components/settings-menu/d-settings-menu.css
@@ -0,0 +1,3 @@
+:host {
+ display: block;
+}
diff --git a/src/components/settings-menu/d-settings-menu.tsx b/src/components/settings-menu/d-settings-menu.tsx
new file mode 100644
index 0000000..7635770
--- /dev/null
+++ b/src/components/settings-menu/d-settings-menu.tsx
@@ -0,0 +1,67 @@
+import { Component, Host, Prop, h } from '@stencil/core';
+
+@Component({
+ tag: 'd-settings-menu',
+ styleUrl: 'd-settings-menu.css',
+ shadow: true,
+})
+export class DSettingsMenu {
+ @Prop() accountSettings: string;
+ @Prop() securityAndAuthentication: string;
+ @Prop() notificationsSettings: string;
+ @Prop() languages: string;
+ @Prop() support: string;
+ @Prop() privacyPolicy: string;
+ @Prop() logOut: string;
+ @Prop() version: string;
+ @Prop() developedBy: string;
+ @Prop() logoutCB: () => void;
+ @Prop() gotoLanguageSettings: () => void;
+ @Prop() openAppSettings: () => void;
+
+ render() {
+ return (
+
+
+
+
+
+ {this.accountSettings}
+
+
+
+ {this.securityAndAuthentication}
+
+
+
+ {this.notificationsSettings}
+
+
+
+ {this.languages}
+
+
+
+
+
+ {this.support}
+
+
+
+ {this.privacyPolicy}
+
+
+
+
+
+ {this.logOut}
+
+
+
+
+
+
+ );
+ }
+}
diff --git a/src/components/settings-menu/readme.md b/src/components/settings-menu/readme.md
new file mode 100644
index 0000000..e9f8ae8
--- /dev/null
+++ b/src/components/settings-menu/readme.md
@@ -0,0 +1,48 @@
+# d-settings-menu
+
+
+
+
+
+
+## Properties
+
+| Property | Attribute | Description | Type | Default |
+| --------------------------- | ----------------------------- | ----------- | ------------ | ----------- |
+| `accountSettings` | `account-settings` | | `string` | `undefined` |
+| `developedBy` | `developed-by` | | `string` | `undefined` |
+| `gotoLanguageSettings` | -- | | `() => void` | `undefined` |
+| `languages` | `languages` | | `string` | `undefined` |
+| `logOut` | `log-out` | | `string` | `undefined` |
+| `logoutCB` | -- | | `() => void` | `undefined` |
+| `notificationsSettings` | `notifications-settings` | | `string` | `undefined` |
+| `openAppSettings` | -- | | `() => void` | `undefined` |
+| `privacyPolicy` | `privacy-policy` | | `string` | `undefined` |
+| `securityAndAuthentication` | `security-and-authentication` | | `string` | `undefined` |
+| `support` | `support` | | `string` | `undefined` |
+| `version` | `version` | | `string` | `undefined` |
+
+
+## Dependencies
+
+### Depends on
+
+- [d-buttons-group](../buttons-group)
+- [d-button](../button)
+- [d-icon](../icon)
+- [d-app-details](../app-details)
+
+### Graph
+```mermaid
+graph TD;
+ d-settings-menu --> d-buttons-group
+ d-settings-menu --> d-button
+ d-settings-menu --> d-icon
+ d-settings-menu --> d-app-details
+ d-app-details --> d-text
+ style d-settings-menu fill:#f9f,stroke:#333,stroke-width:4px
+```
+
+----------------------------------------------
+
+*Built with [StencilJS](https://stenciljs.com/)*
diff --git a/src/components/settings-menu/settings-menu.stories.ts b/src/components/settings-menu/settings-menu.stories.ts
new file mode 100644
index 0000000..fadad59
--- /dev/null
+++ b/src/components/settings-menu/settings-menu.stories.ts
@@ -0,0 +1,40 @@
+import { Meta, StoryObj } from '@storybook/html';
+import type { Components } from '../../components.js';
+
+const meta = {
+ title: 'Design System/Molecule/SettingsMenu',
+ render: args => `
`,
+} satisfies Meta
;
+
+export default meta;
+type Story = StoryObj;
+
+export const Default: Story = {
+ args: {
+ accountSettings: 'Account settings',
+ securityAndAuthentication: 'Security and authentication',
+ notificationsSettings: 'Notifications settings',
+ languages: 'Languages',
+ support: 'Support',
+ privacyPolicy: 'Privacy policy',
+ logOut: 'Log out',
+ version: 'Version',
+ developedBy: 'Developed by',
+ logoutCB: () => {},
+ gotoLanguageSettings: () => {},
+ openAppSettings: () => {},
+ },
+};
diff --git a/src/components/settings-menu/test/d-settings-menu.e2e.ts b/src/components/settings-menu/test/d-settings-menu.e2e.ts
new file mode 100644
index 0000000..59cd6c1
--- /dev/null
+++ b/src/components/settings-menu/test/d-settings-menu.e2e.ts
@@ -0,0 +1,11 @@
+import { newE2EPage } from '@stencil/core/testing';
+
+describe('d-settings-menu', () => {
+ it('renders', async () => {
+ const page = await newE2EPage();
+ await page.setContent('');
+
+ const element = await page.find('d-settings-menu');
+ expect(element).toHaveClass('hydrated');
+ });
+});
diff --git a/src/components/settings-menu/test/d-settings-menu.spec.tsx b/src/components/settings-menu/test/d-settings-menu.spec.tsx
new file mode 100644
index 0000000..93e1401
--- /dev/null
+++ b/src/components/settings-menu/test/d-settings-menu.spec.tsx
@@ -0,0 +1,49 @@
+import { newSpecPage } from '@stencil/core/testing';
+import { DSettingsMenu } from '../d-settings-menu';
+
+describe('d-settings-menu', () => {
+ it('renders', async () => {
+ const page = await newSpecPage({
+ components: [DSettingsMenu],
+ html: ``,
+ });
+ expect(page.root).toEqualHtml(`
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {this.title},
+ {this.subtitle && (
+
+ {this.subtitle}
+
+ )}
+ {this.description}
+
+
Test page
pippo
+
Typography