Files
DSMMG/storybook/stories/Menu.stories.tsx
T
Dinawo 133feff75d
Release / Release / open changeset PR (push) Has been cancelled
CI / Build, typecheck, test, a11y (push) Has been cancelled
feat(v1): bloquants release v1 — tests, stories, visual regression, gouvernance, publishing
6 chantiers v1 sur 7 livrés (DataTable refonte reportée car nécessite
2-3j en propre — TanStack Table + virtualisation + filter builder).

v1-A — Tests (4 → 22 fichiers) :
- Avatar, AvatarGroup, UserCard, MetricCard, ProfileHeader, Tooltip,
  Sheet, Drawer, Slider, ToggleGroup, Tabs, Pagination, Accordion,
  Switch, Badge, ConfirmDialog, Popover, Menu, Text, PricingCard,
  FeatureCard, Toast — chacun avec render + clavier + axe-core.

v1-B — Storybook (7 → 23 fichiers) :
- Avatar, UserCard, ProfileHeader, MetricCard, PricingCard,
  FeatureCard, Sheet (4 sides), HoverCard, Slider, ToggleGroup,
  Menu+ContextMenu, Toast (avec démo "Empiler 5"), Tabs,
  Pagination, Accordion, Badge.

v1-D — Visual regression Playwright :
- playwright.config.ts (light + dark, threshold strict 0.2)
- e2e/visual.spec.ts (20 stories critiques)
- Step CI + upload report en cas de fail

v1-E — Site doc Starlight rempli :
- 11 pages composants détaillées (Button, Input, Tooltip, Dialog,
  Toast, Avatar, ThemePicker, MetricCard, PricingCard, ToggleGroup,
  Slider) avec API, anatomie, do/don't, A11y.

v1-F — Publishing Verdaccio :
- verdaccio/config.yaml, docker-compose.verdaccio.yml, .npmrc
- README setup local + déploiement prod + backups + sécurité

v1-G — Gouvernance :
- LICENSE, CONTRIBUTING.md, CODE_OF_CONDUCT.md, SECURITY.md
- CODEOWNERS, PR template, 3 issue templates (bug/feature/rfc)

Bug fix bonus : tooltip dark mode (text-primary comme bg + text-inverse
comme texte → blanc-sur-blanc invisible). Remplacé par neutral-900/0
en light + bg-raised/text-primary en dark.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-04 22:29:35 +02:00

45 lines
1.4 KiB
TypeScript

import type { Meta, StoryObj } from "@storybook/react";
import { Menu, ContextMenu, Button } from "@managemate/react";
const meta = {
title: "Overlays/Menu",
component: Menu,
tags: ["autodocs"],
} satisfies Meta<typeof Menu>;
export default meta;
type Story = StoryObj<typeof meta>;
const items = [
{ label: "Voir le détail", icon: "eye-line" as const, shortcut: "↵" },
{ label: "Modifier", icon: "edit-line" as const, shortcut: "E" },
{ label: "Dupliquer", icon: "file-copy-line" as const, shortcut: "⌘D" },
{ type: "divider" } as const,
{ type: "label", label: "Visibilité" } as const,
{ label: "Partager", icon: "share-line" as const },
{ label: "Archiver", icon: "inbox-line" as const },
{ type: "divider" } as const,
{ label: "Supprimer", icon: "delete-bin-line" as const, danger: true, shortcut: "⌫" },
];
export const Default: Story = {
render: () => (
<Menu trigger={<Button variant="tertiary" icon="more-2-line">Actions</Button>} items={items} />
),
};
export const Context: Story = {
name: "ContextMenu — clic droit",
render: () => (
<ContextMenu items={items}>
<div style={{
display: "grid", placeItems: "center", height: 140,
border: "2px dashed var(--mmg-color-border)", borderRadius: "var(--mmg-radius-md)",
color: "var(--mmg-color-text-tertiary)", cursor: "context-menu",
}}>
Clic droit ici
</div>
</ContextMenu>
),
};