Skip to content

feat(vc-scheduler): calendar/scheduler organism #258

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
maksimzinchuk merged 2 commits into from
Jul 20, 2026
Merged

feat(vc-scheduler): calendar/scheduler organism #258

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5e00338
feat(vc-scheduler): calendar/scheduler organism
maksimzinchuk Jul 17, 2026
9ee8dfb
docs(vc-popover): drop live storybook embeds pending storybook redeploy
maksimzinchuk Jul 17, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 45 additions & 37 deletions .storybook/STORY_STANDARD.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,35 +35,35 @@ VcCard, VcWidget

**Minimum 3 stories.** Required:

| Requirement | Description |
|-------------|-------------|
| `tags: ["autodocs"]` | Enables automatic docs page |
| JSDoc on meta | 2-3 sentence component description |
| `argTypes` for all props | With `description`, `table.type`, `table.defaultValue` |
| `argTypes` for slots | With `table.category: "Slots"` |
| `parameters.docs.description.component` | With inline code usage example |
| Story: Default | Most common usage |
| Story: Variants/Sizes | If component has visual variants |
| Story: Real-World Context | Component used in a realistic scenario |
| Requirement | Description |
| --------------------------------------- | ------------------------------------------------------ |
| `tags: ["autodocs"]` | Enables automatic docs page |
| JSDoc on meta | 2-3 sentence component description |
| `argTypes` for all props | With `description`, `table.type`, `table.defaultValue` |
| `argTypes` for slots | With `table.category: "Slots"` |
| `parameters.docs.description.component` | With inline code usage example |
| Story: Default | Most common usage |
| Story: Variants/Sizes | If component has visual variants |
| Story: Real-World Context | Component used in a realistic scenario |

### Tier 2 — Standard (atoms/molecules with state and interaction)

**Applies to:** VcButton, VcBadge, VcLink, VcTooltip, VcBanner, VcInput, VcTextarea,
VcSwitch, VcCheckbox, VcRadioButton, VcSelect, VcDatePicker, VcPagination, VcToast,
VcBreadcrumbs, VcDropdown, VcMenu, VcField, VcForm, VcSlider, VcRating, VcAccordion,
VcInputCurrency, VcInputGroup, VcMultivalue, VcColorInput, VcFileUpload, VcEditor,
VcInputDropdown, VcDropdownPanel, VcCheckboxGroup, VcRadioGroup, VcImageTile
VcInputDropdown, VcPopover, VcCheckboxGroup, VcRadioGroup, VcImageTile

**Minimum 6 stories.** Everything from Tier 1, plus:

| Requirement | Description |
|-------------|-------------|
| Event argTypes | With `action()` and `table.category: "Events"` |
| Category grouping | `"Model"`, `"Data"`, `"Appearance"`, `"State"`, `"Layout"`, `"Events"`, `"Slots"` |
| Story: States | disabled, loading, error, required |
| Story: Interactive | Uses `ref`, responds to user actions |
| Story: Accessibility | Demonstrates aria-label, keyboard navigation |
| Story: Form Context | Component used within a form (if applicable) |
| Requirement | Description |
| -------------------- | --------------------------------------------------------------------------------- |
| Event argTypes | With `action()` and `table.category: "Events"` |
| Category grouping | `"Model"`, `"Data"`, `"Appearance"`, `"State"`, `"Layout"`, `"Events"`, `"Slots"` |
| Story: States | disabled, loading, error, required |
| Story: Interactive | Uses `ref`, responds to user actions |
| Story: Accessibility | Demonstrates aria-label, keyboard navigation |
| Story: Form Context | Component used within a form (if applicable) |

### Tier 3 — Complex (organisms)

Expand All @@ -72,12 +72,12 @@ VcApp, VcDynamicProperty, VcAuthLayout

**Minimum 10 stories.** Everything from Tier 2, plus:

| Requirement | Description |
|-------------|-------------|
| Feature stories | Each major feature as a separate named story |
| Edge cases | Empty state, error state, many items, long content |
| Mobile stories | If component has mobile variant |
| Composition stories | Used with other vc-shell components |
| Requirement | Description |
| ------------------- | -------------------------------------------------- |
| Feature stories | Each major feature as a separate named story |
| Edge cases | Empty state, error state, many items, long content |
| Mobile stories | If component has mobile variant |
| Composition stories | Used with other vc-shell components |

## Template

Expand Down Expand Up @@ -157,7 +157,9 @@ export const Default: Story = {
};

/** All visual variants side by side. */
export const AllVariants: Story = { /* ... */ };
export const AllVariants: Story = {
/* ... */
};

// ... more stories per tier requirements
```
Expand All @@ -182,22 +184,28 @@ Structure:
Brief description (1-2 sentences).

## When to Use

- Use case 1
- When NOT to use

## Basic Usage

(code example)

## Key Props

(table with most important props only — full list in Storybook autodocs)

## Common Patterns

(2-3 real-world code examples)

## Accessibility

(keyboard, screen reader, ARIA notes)

## Related Components

(links to related components)
```

Expand Down Expand Up @@ -225,15 +233,15 @@ Before modifying any existing story file:

Stories use functional categories instead of Atomic Design levels. Use the category that matches the component's primary purpose.

| Category | Components |
|---|---|
| **Form** | VcInput, VcTextarea, VcSelect, VcCheckbox, VcCheckboxGroup, VcRadioButton, VcRadioGroup, VcSwitch, VcDatePicker, VcInputCurrency, VcInputDropdown, VcInputGroup, VcColorInput, VcSlider, VcRating, VcFileUpload, VcEditor, VcMultivalue, VcField, VcForm |
| **Data Display** | VcDataTable, VcBadge, VcStatus, VcStatusIcon, VcLabel, VcHint, VcImage, VcVideo, VcCard, VcWidget, VcDynamicProperty, VcGallery, VcImageUpload |
| **Navigation** | VcBreadcrumbs, VcMenu, VcPagination, VcBlade, VcBladeNavigation |
| **Overlay** | VcPopup, VcTooltip, VcDropdown, VcDropdownPanel, VcToast, VcSidebar |
| **Layout** | VcContainer, VcScrollableContainer, VcRow, VcCol, VcSkeleton, VcProgress, VcIcon, VcLoading, VcApp, VcAuthLayout |
| **Action** | VcButton, VcButtonGroup, VcLink, VcBanner, VcAccordion, VcImageTile |
| **Shared** | App-level components (settings, notifications, auth pages) |
| Category | Components |
| ---------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Form** | VcInput, VcTextarea, VcSelect, VcCheckbox, VcCheckboxGroup, VcRadioButton, VcRadioGroup, VcSwitch, VcDatePicker, VcInputCurrency, VcInputDropdown, VcInputGroup, VcColorInput, VcSlider, VcRating, VcFileUpload, VcEditor, VcMultivalue, VcField, VcForm |
| **Data Display** | VcDataTable, VcBadge, VcStatus, VcStatusIcon, VcLabel, VcHint, VcImage, VcVideo, VcCard, VcWidget, VcDynamicProperty, VcGallery, VcImageUpload |
| **Navigation** | VcBreadcrumbs, VcMenu, VcPagination, VcBlade, VcBladeNavigation |
| **Overlay** | VcPopup, VcTooltip, VcDropdown, VcPopover, VcToast, VcSidebar |
| **Layout** | VcContainer, VcScrollableContainer, VcRow, VcCol, VcSkeleton, VcProgress, VcIcon, VcLoading, VcApp, VcAuthLayout |
| **Action** | VcButton, VcButtonGroup, VcLink, VcBanner, VcAccordion, VcImageTile |
| **Shared** | App-level components (settings, notifications, auth pages) |

## Automated Testing

Expand All @@ -250,8 +258,8 @@ To disable snapshot testing for a story or entire component:
```typescript
const meta = {
parameters: {
snapshot: { disable: true }, // Skip all snapshot tests for this component
visual: { disable: true }, // Skip all visual tests for this component
snapshot: { disable: true }, // Skip all snapshot tests for this component
visual: { disable: true }, // Skip all visual tests for this component
},
};
```
Expand Down
2 changes: 1 addition & 1 deletion cli/migrate/src/transforms/remove-global-components.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ const UI_COMPONENTS = new Set([
"VcDatePicker",
"VcDropdown",
"VcDropdownItem",
"VcDropdownPanel",
"VcPopover",
"VcEditor",
"VcField",
"VcFileUpload",
Expand Down
38 changes: 20 additions & 18 deletions cli/vc-app-skill/runtime/knowledge/docs/core/api/platform.docs.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,9 +31,11 @@ All clients extend `AuthApiBase` and accept an optional `baseUrl` and `http` fet
| Client | Description |
| --------------------------- | -------------------------------------------------------- |
| `ExternalSignInClient` | External authentication provider sign-in |
| `AppManifestClient` | Application manifest descriptor operations |
| `AppsClient` | Application descriptor operations |
| `AuthorizationClient` | Permission and role checking |
| `ChangeLogClient` | Platform change log / audit trail |
| `DeveloperToolsClient` | Developer-tools endpoint |
| `DiagnosticsClient` | System diagnostics and health |
| `DynamicPropertiesClient` | Dynamic property CRUD and dictionary management |
| `JobsClient` | Background job management |
Expand All @@ -46,28 +48,28 @@ All clients extend `AuthApiBase` and accept an optional `baseUrl` and `http` fet

## Key DTOs (Interfaces)

| Interface | Description |
| -------------------------------- | --------------------------------------------------------------------------------- |
| `PushNotification` | Push notification payload: `id`, `title`, `notifyType`, `isNew`, `finished`, etc. |
| `PushNotificationSearchCriteria` | Search criteria for notification queries |
| `ApplicationUser` | Platform user with roles, permissions, logins |
| `Role` | Security role with permissions |
| `Permission` | Individual permission entry |
| `DynamicProperty` | Dynamic property definition |
| `DynamicObjectProperty` | Property value bound to an object |
| `ModuleDescriptor` | Module metadata (id, version, dependencies) |
| `ChangeLogSearchCriteria` | Audit log search parameters |
| `ChangeLogSearchResult` | Paginated audit log results |
| `ObjectSettingEntry` | Setting entry with value and metadata |
| `License` | Platform license information |
| Interface | Description |
| -------------------------------- | -------------------------------------------------------------------------------- |
| `PushNotification` | Push notification payload: `id`, `title`, `notifyType`, `isNew`, `created`, etc. |
| `PushNotificationSearchCriteria` | Search criteria for notification queries |
| `ApplicationUser` | Platform user with roles, permissions, logins |
| `Role` | Security role with permissions |
| `Permission` | Individual permission entry |
| `DynamicProperty` | Dynamic property definition |
| `DynamicObjectProperty` | Property value bound to an object |
| `ModuleDescriptor` | Module metadata (id, version, dependencies) |
| `ChangeLogSearchCriteria` | Audit log search parameters |
| `ChangeLogSearchResult` | Paginated audit log results |
| `ObjectSettingEntry` | Setting entry with value and metadata |
| `License` | Platform license information |

## Base Class

```typescript
export class AuthApiBase {
authToken: string;
setAuthToken(token: string): void;
protected getBaseUrl(defaultUrl: string, baseUrl: string): string; // always returns ""
getBaseUrl(defaultUrl: string, baseUrl: string): string; // always returns ""
protected transformOptions(options: RequestInit): Promise<RequestInit>; // sets the Bearer header only if `authToken` is non-empty
}
```
Expand All @@ -86,7 +88,7 @@ const criteria: PushNotificationSearchCriteria = { take: 20, skip: 0 };
const result = await client.searchPushNotification(criteria);

console.log(`Found ${result.totalCount} notifications`);
for (const notification of result.results ?? []) {
for (const notification of result.notifyEvents ?? []) {
console.log(`${notification.title} (${notification.notifyType})`);
}
```
Expand All @@ -100,7 +102,7 @@ const securityClient = new SecurityClient();
const user = await securityClient.getCurrentUser();

console.log(`Logged in as: ${user.userName}`);
console.log(`Roles: ${user.roles?.map((r) => r.name).join(", ")}`);
console.log(`Permissions: ${user.permissions?.join(", ")}`);
console.log(`Is admin: ${user.isAdministrator}`);
```

Expand Down Expand Up @@ -142,7 +144,7 @@ import { SettingClient, ObjectSettingEntry } from "@vc-shell/framework";
const client = new SettingClient();

// Read a specific setting
const settings = await client.getValues(["VirtoCommerce.Notifications.SendGrid.ApiKey"]);
const setting = await client.getGlobalSetting("VirtoCommerce.Notifications.SendGrid.ApiKey");

// Update a setting
const entry: ObjectSettingEntry = {
Expand Down
Loading
Loading