update order of storybook categories
This commit is contained in:
parent
43c4326afd
commit
808b4b8f9e
19 changed files with 235 additions and 626 deletions
|
|
@ -1,89 +0,0 @@
|
|||
import type { Meta, StoryObj } from '@storybook/angular';
|
||||
import { AlertBox } from 'sae-lib/alert-box/alert-box';
|
||||
import { moduleMetadata } from '@storybook/angular';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
const meta: Meta<AlertBox> = {
|
||||
title: 'UI/Feedback/AlertBox',
|
||||
component: AlertBox,
|
||||
tags: ['autodocs'],
|
||||
decorators: [
|
||||
moduleMetadata({
|
||||
imports: [CommonModule],
|
||||
providers: []
|
||||
})
|
||||
],
|
||||
argTypes: {
|
||||
message: {
|
||||
control: 'text',
|
||||
description: 'Message à afficher dans l\'alerte'
|
||||
},
|
||||
_alertKind: {
|
||||
control: 'select',
|
||||
options: ['info', 'success', 'primary', 'secondary', 'warning', 'danger', 'error'],
|
||||
description: 'Type d\'alerte'
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
export default meta;
|
||||
type Story = StoryObj<AlertBox>;
|
||||
|
||||
export const Warning: Story = {
|
||||
args: {
|
||||
message: 'Ceci est un message d\'avertissement',
|
||||
_alertKind: 'warning'
|
||||
},
|
||||
};
|
||||
|
||||
export const Success: Story = {
|
||||
args: {
|
||||
message: 'Opération réussie !',
|
||||
_alertKind: 'success'
|
||||
},
|
||||
};
|
||||
|
||||
export const Info: Story = {
|
||||
args: {
|
||||
message: 'Information importante',
|
||||
_alertKind: 'info'
|
||||
},
|
||||
};
|
||||
|
||||
export const Primary: Story = {
|
||||
args: {
|
||||
message: 'Message principal',
|
||||
_alertKind: 'primary'
|
||||
},
|
||||
};
|
||||
|
||||
export const Secondary: Story = {
|
||||
args: {
|
||||
message: 'Message secondaire',
|
||||
_alertKind: 'secondary'
|
||||
},
|
||||
};
|
||||
|
||||
export const Danger: Story = {
|
||||
args: {
|
||||
message: 'Attention danger !',
|
||||
_alertKind: 'danger'
|
||||
},
|
||||
};
|
||||
|
||||
export const ErrorState: Story = {
|
||||
args: {
|
||||
message: 'Une erreur est survenue',
|
||||
_alertKind: 'error'
|
||||
},
|
||||
};
|
||||
|
||||
export const WithContent: Story = {
|
||||
args: {
|
||||
_alertKind: 'warning'
|
||||
},
|
||||
render: (args) => ({
|
||||
props: args,
|
||||
template: `<sae-alert-box [_alertKind]="'warning'">Contenu personnalisé via ng-content</sae-alert-box>`
|
||||
})
|
||||
};
|
||||
|
|
@ -12,31 +12,15 @@ We'll use a three-level hierarchy to organize our stories:
|
|||
|
||||
## Top-level Categories
|
||||
|
||||
- **UI**: Basic UI components that can be used across the application
|
||||
- Buttons
|
||||
- Inputs
|
||||
- Feedback
|
||||
- Layout
|
||||
- Navigation
|
||||
- Display
|
||||
- **fondations**: Foundational elements of the design system
|
||||
- couleurs (Colors)
|
||||
|
||||
- **Chatbot**: Components specific to the chatbot functionality
|
||||
- Conversation
|
||||
- Messages
|
||||
- Input
|
||||
- Actions
|
||||
- Feedback
|
||||
- **composants**: Basic UI components that can be used across the application
|
||||
- boutons (Buttons)
|
||||
- inputs (Input fields)
|
||||
|
||||
- **App**: Full application components or pages
|
||||
- Pages
|
||||
- Layouts
|
||||
- Features
|
||||
|
||||
- **Design**: Design system components and tokens
|
||||
- Colors
|
||||
- Typography
|
||||
- Spacing
|
||||
- Icons
|
||||
- **patterns**: Complex UI patterns and compositions
|
||||
- breadcrumbs (Navigation breadcrumbs)
|
||||
|
||||
## Naming Convention
|
||||
|
||||
|
|
@ -56,15 +40,15 @@ For example:
|
|||
|
||||
| Current Title | New Title |
|
||||
|---------------|-----------|
|
||||
| Components/MainButton | UI/Buttons/MainButton |
|
||||
| Components/AlertBox | UI/Feedback/AlertBox |
|
||||
| Chatbot/ConversationItem | Chatbot/Conversation/ConversationItem |
|
||||
| Chatbot/ExportChatButton | Chatbot/Actions/ExportChatButton |
|
||||
| Components/MessageBox | Chatbot/Messages/MessageBox |
|
||||
| Components/PromptInput | Chatbot/Input/PromptInput |
|
||||
| Navigation/DsNavbar | UI/Navigation/Navbar |
|
||||
| Components/Logo | Design/Brand/Logo |
|
||||
| Components/ColorDisplay | Design/Colors/ColorDisplay |
|
||||
| UI/Buttons/MainButton | composants/boutons/MainButton |
|
||||
| UI/Buttons/ToggleButton | composants/boutons/ToggleButton |
|
||||
| UI/Inputs/PromptInput | composants/inputs/PromptInput |
|
||||
| UI/Feedback/AlertBox | composants/feedback/AlertBox |
|
||||
| Design/Colors/ColorDisplay | fondations/couleurs/ColorDisplay |
|
||||
| UI/Navigation/Navbar | patterns/breadcrumbs/Navbar |
|
||||
| Chatbot/Conversation/ConversationItem | composants/conversation/ConversationItem |
|
||||
| Chatbot/Actions/ExportChatButton | composants/boutons/ExportChatButton |
|
||||
| Chatbot/Messages/MessageBox | composants/conversation/MessageBox |
|
||||
|
||||
## Implementation
|
||||
|
||||
|
|
|
|||
|
|
@ -13,36 +13,55 @@ const {execSync} = require('child_process');
|
|||
|
||||
// Define the mapping from old categories to new categories
|
||||
const categoryMapping = {
|
||||
// UI Components
|
||||
// UI Components to composants/boutons
|
||||
'UI/Buttons/ExportChatButton': 'composants/boutons/ExportChatButton',
|
||||
'UI/Buttons/MainButton': 'composants/boutons/MainButton',
|
||||
'UI/Buttons/ToggleButton': 'composants/boutons/ToggleButton',
|
||||
'Chatbot/Actions/ExportChatButton': 'composants/boutons/ExportChatButton',
|
||||
'Components/Buttons/ExportChatButton': 'composants/boutons/ExportChatButton',
|
||||
'Components/MainButton': 'composants/boutons/MainButton',
|
||||
'Components/ToggleButton': 'composants/boutons/ToggleButton',
|
||||
'Components/FeedbackButton': 'composants/boutons/FeedbackButton',
|
||||
|
||||
'Chatbot/ExportChatButton': 'UI/Buttons/ExportChatButton',
|
||||
'Components/MainButton': 'UI/Buttons/MainButton',
|
||||
'Components/AlertBox': 'UI/Feedback/AlertBox',
|
||||
'Components/Logo': 'Design/Brand/Logo',
|
||||
'Components/ColorDisplay': 'Design/Colors/ColorDisplay',
|
||||
'Components/FeedbackButton': 'UI/Feedback/FeedbackButton',
|
||||
'Components/ToggleButton': 'UI/Buttons/ToggleButton',
|
||||
// UI Feedback to composants/feedback
|
||||
'UI/Feedback/AlertBox': 'composants/feedback/AlertBox',
|
||||
'UI/Feedback/FeedbackButton': 'composants/boutons/FeedbackButton',
|
||||
'Components/AlertBox': 'composants/feedback/AlertBox',
|
||||
|
||||
// Chatbot Components
|
||||
'Chatbot/ConversationItem': 'Chatbot/Conversation/ConversationItem',
|
||||
'Chatbot/WarningBugs': 'Chatbot/Feedback/WarningBugs',
|
||||
'Components/MessageBox': 'Chatbot/Messages/MessageBox',
|
||||
'Components/PromptInput': 'Chatbot/Input/PromptInput',
|
||||
'Components/NewInput': 'Chatbot/Input/NewInput',
|
||||
'Components/SourceBlock': 'Chatbot/Sources/SourceBlock',
|
||||
// Design to fondations
|
||||
'Design/Colors/ColorDisplay': 'fondations/couleurs/ColorDisplay',
|
||||
'Design/Brand/Logo': 'fondations/brand/Logo',
|
||||
'Components/Logo': 'fondations/brand/Logo',
|
||||
'Components/ColorDisplay': 'fondations/couleurs/ColorDisplay',
|
||||
|
||||
// Navigation
|
||||
'Navigation/DsNavbar': 'UI/Navigation/Navbar',
|
||||
// UI Navigation to patterns/breadcrumbs
|
||||
'UI/Navigation/Navbar': 'patterns/breadcrumbs/Navbar',
|
||||
'Navigation/DsNavbar': 'patterns/breadcrumbs/Navbar',
|
||||
|
||||
// Chatbot Components to composants
|
||||
'Chatbot/Conversation/ConversationItem': 'composants/conversation/ConversationItem',
|
||||
'Chatbot/Feedback/WarningBugs': 'composants/feedback/WarningBugs',
|
||||
'Chatbot/Messages/MessageBox': 'composants/conversation/MessageBox',
|
||||
'Chatbot/Input/PromptInput': 'composants/inputs/PromptInput',
|
||||
'Chatbot/Input/NewInput': 'composants/inputs/NewInput',
|
||||
'Chatbot/Sources/SourceBlock': 'composants/conversation/SourceBlock',
|
||||
'Chatbot/ConversationItem': 'composants/conversation/ConversationItem',
|
||||
'Chatbot/WarningBugs': 'composants/feedback/WarningBugs',
|
||||
'Components/MessageBox': 'composants/conversation/MessageBox',
|
||||
'Components/PromptInput': 'composants/inputs/PromptInput',
|
||||
'Components/NewInput': 'composants/inputs/NewInput',
|
||||
'Components/SourceBlock': 'composants/conversation/SourceBlock',
|
||||
|
||||
// App
|
||||
'App/Chatbot': 'App/Features/Chatbot',
|
||||
'App/Features/Chatbot': 'composants/conversation/Chatbot',
|
||||
'App/Chatbot': 'composants/conversation/Chatbot',
|
||||
};
|
||||
|
||||
// Find all story files
|
||||
const findStoryFiles = () => {
|
||||
try {
|
||||
const result = execSync(
|
||||
'find /home/poule/encrypted/stockage-syncable/www/development/html/ng-implementation/old-sae-airwatch/src -name "*.stories.ts"'
|
||||
'find /home/poule/encrypted/stockage-syncable/www/development/html/ng-implementation/airwatch/src -name "*.stories.ts"'
|
||||
).toString();
|
||||
return result.split('\n').filter(Boolean);
|
||||
} catch (error) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue