feat(PixOverlay): add component story

app/stories/pix-overlay.mdx

@@ -0,0 +1,24 @@
+import { Meta, Story, ArgTypes } from '@storybook/blocks';
+import * as ComponentStories from './pix-overlay.stories';
+
+<Meta of={ComponentStories} />
+
+# Pix Overlay
+
+Un `Overlay` est un bloc non opaque venant superposer l'écran principal de l'application.
+
+Utilisé, par exemple, dans les composants `PixModal` et `PixSidebar`, il vient mettre en avant les nouveaux blocs en premier plan.
+
+Une fois ouvert, l'Overlay peut-être fermé au clic ou via la touche "Echap".
+
+  <Story of={ComponentStories.overlay} height={60} />
+
+## Usage
+
+```html
+<PixOverlay @isVisible={{true}} @onClose={{this.myCallback}} />
+```
+
+## Arguments
+
+<ArgTypes of={ComponentStories} />

app/stories/pix-overlay.stories.js

@@ -0,0 +1,26 @@
+import { hbs } from 'ember-cli-htmlbars';
+
+export default {
+  title: 'Other/Overlay',
+  argTypes: {
+    isVisible: {
+      name: 'isVisible',
+      description: "Visibilité de l'overlay",
+      type: { name: 'bool', required: false },
+      table: { defaultValue: { summary: true } },
+      control: { type: 'radio' },
+      options: [true, false],
+    },
+    onClose: {
+      name: 'onClose',
+      description: "Callback déclenché à la fermeture de l'overlay",
+    },
+  },
+};
+
+export const overlay = (args) => ({
+  template: hbs`<PixOverlay @isVisible={{this.isVisible}}>
+  Du contenu en dessous de l'overlay.
+</PixOverlay>`,
+  context: args,
+});