@sebgroup/green-core 2.19.0-rc.20251212142916599 → 2.19.0-rc.20251217083115748

package/mcp/badge/angular.md

@@ -1,17 +0,0 @@
-# gds-badge - Angular
-
-## Import
-
-```typescript
-import { GdsBadgeComponent } from '@sebgroup/green-core-ng'
-```
-
-## Usage
-
-Use the component in your Angular templates:
-
-```html
-<gds-badge>
-  <!-- content -->
-</gds-badge>
-```

package/mcp/badge/api.md

@@ -1,36 +0,0 @@
-# gds-badge
-
-`gds-badge`
-
-**Class**: `GdsBadge`
-
-**Tag**: `<gds-badge>`
-
-
-## Properties
-
-| Name | Type | Default | Description |
-|------|------|---------|-------------|
-| `variant` | `\| 'information'     \| 'notice'     \| 'positive'     \| 'warning'     \| 'negative'     \| 'disabled'` | `'information'` | Controls the variant of the badge. Supports all valid variants like information, notice, positive, warning, negative. |
-| `size` | `'default' \| 'small'` | `'default'` | Defines the size of the badge. The default value is `default`. |
-| `notification` | `boolean` | `false` | Indicates whether the badge is in notification mode. When set to `true`, the badge will act as a notification badge with only two variants: `positive` or `negative`. |
-| `rounded` | `boolean` | `false` | Indicates whether the badge is rounded. |
-| `mainSlotOccupied` | `boolean` | `false` |  |
-| `leadSlotOccupied` | `boolean` | `false` |  |
-| `width` | `string \| undefined` | `-` | Style Expression Property that controls the `width` property. Supports space tokens and all valid CSS `width` values. |
-| `'min-width'` | `string \| undefined` | `-` | Style Expression Property that controls the `min-width` property. Supports space tokens and all valid CSS `min-width` values. |
-| `'max-width'` | `string \| undefined` | `-` | Style Expression Property that controls the `max-width` property. Supports space tokens and all valid CSS `max-width` values. |
-| `'inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `inline-size` property. Supports space tokens and all valid CSS `inline-size` values |
-| `'min-inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `min-inline-size` property. Supports space tokens and all valid CSS `min-inline-size` values. |
-| `'max-inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `max-inline-size` property. Supports space tokens and all valid CSS `max-inline-size` values. |
-| `margin` | `string \| undefined` | `-` | Style Expression Property that controls the `margin` property. Only accepts space tokens. |
-| `'margin-inline'` | `string \| undefined` | `-` | Style Expression Property that controls the `margin-inline` property. Only accepts space tokens. |
-| `'margin-block'` | `string \| undefined` | `-` | Style Expression Property that controls the `margin-block` property. Only accepts space tokens. |
-| `'align-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `align-self` property. Supports all valid CSS `align-self` values. |
-| `'justify-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `justify-self` property. Supports all valid CSS `justify-self` values. |
-| `'place-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `place-self` property. Supports all valid CSS `place-self` values. |
-| `'grid-column'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-column` property. Supports all valid CSS grid-column values. Documentation: https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column |
-| `'grid-row'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-row` property. Supports all valid CSS `grid-row` values. |
-| `'grid-area'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-area` property. Supports all valid CSS `grid-area` values. |
-| `flex` | `string \| undefined` | `-` | Style Expression Property that controls the `flex` property. Supports all valid CSS `flex` values. |
-| `order` | `string \| undefined` | `-` | Style Expression Property that controls the `order` property. Supports all valid CSS `order` values. |

package/mcp/badge/guidelines.md

@@ -1,56 +0,0 @@
-# Badge
-
-A compact visual indicator for status, counts and notifications.
-
-
-## Overview
-
-### Usage
-
-Badges are especially useful for:
-
-*   **Status indicators** – Showing that something is new, in progress, needs attention, or has been successfully completed.
-    
-*   **Counters** – Indicating the number of new messages, notifications, or tasks.
-    
-*   **Contextual highlights** – Marking a feature as beta or signaling updates users should be aware of.
-    
-
-Use badges sparingly – too many can create visual noise and reduce their impact. Always ensure that the badge color, icon and label clearly support the intended message.
-
-### Variants
-
-A set of predefined styles that convey different meanings and states through consistent visual treatment.
-
-*   **Information** – For general updates or tips that help the user understand context.
-    
-*   **Notice** – For neutral alerts or flags that are not critical but still relevant.
-    
-*   **Positive** – For confirming success or a completed action (e.g., “Active” or “Paid”).
-    
-*   **Warning** – For potential issues users should be cautious about.
-    
-*   **Negative** – For errors, failed states, or items requiring immediate attention.
-
-### Size
-
-Available in large (default) and small sizes to accommodate different UI contexts and content requirements.
-
-### Notification mode
-
-Optimised for notification indicators.
-
-### Rounded
-
-The rounded property transforms the badge's appearance by applying fully circular corners, making it ideal for numerical indicators or status markers.
-
-### Lead and trail slots
-
-The badge component supports both lead and trail slots, enabling the placement of icons or additional content before or after the main text.
-
-
-## UX Guidelines
-
-### Writing UX text for badges
-
-### Our most common statuses

package/mcp/badge/index.json

@@ -1,9 +0,0 @@
-{
-  "name": "gds-badge",
-  "files": {
-    "api": "api.md",
-    "guidelines": "guidelines.md",
-    "angular": "angular.md",
-    "react": "react.md"
-  }
-}

package/mcp/badge/react.md

@@ -1,17 +0,0 @@
-# gds-badge - React
-
-## Import
-
-```typescript
-import { GdsBadge } from '@sebgroup/green-core/react'
-```
-
-## Usage
-
-Use the component as a React JSX element:
-
-```tsx
-<GdsBadge>
-  {/* content */}
-</GdsBadge>
-```

package/mcp/blur/angular.md

@@ -1,17 +0,0 @@
-# gds-blur - Angular
-
-## Import
-
-```typescript
-import { GdsBlurComponent } from '@sebgroup/green-core-ng'
-```
-
-## Usage
-
-Use the component in your Angular templates:
-
-```html
-<gds-blur>
-  <!-- content -->
-</gds-blur>
-```

package/mcp/blur/api.md

@@ -1,12 +0,0 @@
-# gds-blur
-
-**Class**: `GdsBlur`
-
-**Tag**: `<gds-blur>`
-
-
-## Slots
-
-| Name | Description |
-|------|-------------|
-| `(default)` | Content to be blurred. |

package/mcp/blur/guidelines.md

@@ -1,3 +0,0 @@
-# Blur
-
-The Blur component is used to apply a blur effect over content, often used to obscure sensitive or background information.

package/mcp/blur/index.json

@@ -1,9 +0,0 @@
-{
-  "name": "gds-blur",
-  "files": {
-    "api": "api.md",
-    "guidelines": "guidelines.md",
-    "angular": "angular.md",
-    "react": "react.md"
-  }
-}

package/mcp/blur/react.md

@@ -1,17 +0,0 @@
-# gds-blur - React
-
-## Import
-
-```typescript
-import { GdsBlur } from '@sebgroup/green-core/react'
-```
-
-## Usage
-
-Use the component as a React JSX element:
-
-```tsx
-<GdsBlur>
-  {/* content */}
-</GdsBlur>
-```

package/mcp/breadcrumb/angular.md

@@ -1,17 +0,0 @@
-# gds-breadcrumb - Angular
-
-## Import
-
-```typescript
-import { GdsBreadcrumbComponent } from '@sebgroup/green-core-ng'
-```
-
-## Usage
-
-Use the component in your Angular templates:
-
-```html
-<gds-breadcrumb>
-  <!-- content -->
-</gds-breadcrumb>
-```

package/mcp/breadcrumb/api.md

@@ -1,30 +0,0 @@
-# gds-breadcrumb
-
-**Class**: `GdsBreadcrumb`
-
-**Tag**: `<gds-breadcrumb>`
-
-
-## Properties
-
-| Name | Type | Default | Description |
-|------|------|---------|-------------|
-| `href` | `string` | `''` | The URL that the breadcrumb item points to. |
-| `target` | `'_self' \| '_blank' \| '_parent' \| '_top' \| undefined` | `-` | Where to display the linked breadcrumb URL. Only used when href is present. |
-| `rel` | `string \| undefined` | `-` | The relationship of the linked breadcrumb URL. Defaults to "noreferrer noopener" when target is "_blank". |
-| `label` | `string` | `''` | Accessible label for the breadcrumb item. Use when visual text needs a different description. |
-| `overflow` | `boolean` | `false` | When true, the breadcrumb item will render as an overflow menu instead of a regular link. |
-
-
-## Slots
-
-| Name | Description |
-|------|-------------|
-| `(default)` | Default slot for the breadcrumb content |
-| `lead` | Optional slot for leading content (usually icons) |
-| `trail` | Optional slot for trailing content |
-
-
-## Routing Support
-
-This component supports routing via the `href` property.

package/mcp/breadcrumb/index.json

@@ -1,8 +0,0 @@
-{
-  "name": "gds-breadcrumb",
-  "files": {
-    "api": "api.md",
-    "angular": "angular.md",
-    "react": "react.md"
-  }
-}

package/mcp/breadcrumb/react.md

@@ -1,17 +0,0 @@
-# gds-breadcrumb - React
-
-## Import
-
-```typescript
-import { GdsBreadcrumb } from '@sebgroup/green-core/react'
-```
-
-## Usage
-
-Use the component as a React JSX element:
-
-```tsx
-<GdsBreadcrumb>
-  {/* content */}
-</GdsBreadcrumb>
-```

package/mcp/breadcrumbs/angular.md

@@ -1,17 +0,0 @@
-# gds-breadcrumbs - Angular
-
-## Import
-
-```typescript
-import { GdsBreadcrumbsComponent } from '@sebgroup/green-core-ng'
-```
-
-## Usage
-
-Use the component in your Angular templates:
-
-```html
-<gds-breadcrumbs>
-  <!-- content -->
-</gds-breadcrumbs>
-```

package/mcp/breadcrumbs/api.md

@@ -1,30 +0,0 @@
-# gds-breadcrumbs
-
-**Class**: `GdsBreadcrumbs`
-
-**Tag**: `<gds-breadcrumbs>`
-
-
-## Properties
-
-| Name | Type | Default | Description |
-|------|------|---------|-------------|
-| `size` | `'large' \| 'small'` | `'large'` | Controls the font-size and spacing of separators and breadcrumbs items |
-| `label` | `string` | `-` | This property allow you to set the accessible label of the breadcrumbs. If not provided, the default label is "breadcrumbs". |
-| `'align-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `align-self` property. Supports all valid CSS `align-self` values. |
-| `'justify-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `justify-self` property. Supports all valid CSS `justify-self` values. |
-| `'place-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `place-self` property. Supports all valid CSS `place-self` values. |
-| `'grid-column'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-column` property. Supports all valid CSS grid-column values. Documentation: https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column |
-| `'grid-row'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-row` property. Supports all valid CSS `grid-row` values. |
-| `'grid-area'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-area` property. Supports all valid CSS `grid-area` values. |
-| `flex` | `string \| undefined` | `-` | Style Expression Property that controls the `flex` property. Supports all valid CSS `flex` values. |
-| `order` | `string \| undefined` | `-` | Style Expression Property that controls the `order` property. Supports all valid CSS `order` values. |
-| `width` | `string \| undefined` | `-` | Style Expression Property that controls the `width` property. Supports space tokens and all valid CSS `width` values. |
-| `'min-width'` | `string \| undefined` | `-` | Style Expression Property that controls the `min-width` property. Supports space tokens and all valid CSS `min-width` values. |
-| `'max-width'` | `string \| undefined` | `-` | Style Expression Property that controls the `max-width` property. Supports space tokens and all valid CSS `max-width` values. |
-| `'inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `inline-size` property. Supports space tokens and all valid CSS `inline-size` values |
-| `'min-inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `min-inline-size` property. Supports space tokens and all valid CSS `min-inline-size` values. |
-| `'max-inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `max-inline-size` property. Supports space tokens and all valid CSS `max-inline-size` values. |
-| `margin` | `string \| undefined` | `-` | Style Expression Property that controls the `margin` property. Only accepts space tokens. |
-| `'margin-inline'` | `string \| undefined` | `-` | Style Expression Property that controls the `margin-inline` property. Only accepts space tokens. |
-| `'margin-block'` | `string \| undefined` | `-` | Style Expression Property that controls the `margin-block` property. Only accepts space tokens. |

package/mcp/breadcrumbs/guidelines.md

@@ -1,35 +0,0 @@
-# Breadcrumbs
-
-A breadcrumb is a secondary navigation showing the website hierarchy.
-
-
-## Overview
-
-### When to use it
-
-Use for sites and applications that have a substantial amount of pages present deeper down in site structures.
-
-### Desktop
-
-The full path may not take up more than one row in the layout.
-
-### Mobile
-
-For mobile views we only display the link to the parent page, as the full path tends to take too much space.
-
-The same version may be used in shallow hierarchies where there still is a need to easily move one step up, or back to the page from where you came.
-
-### Overflow
-
-The breadcrumbs component is designed with flexibility in mind, allowing developers to implement \* custom overflow solutions that best fit their specific needs.
-
-
-## UX Guidelines
-
-### Writing UX text for breadcrums
-
-### Be clear and simple
-
-### Breadcrumbs on mobile web
-
-### Breadcrumbs in native apps

package/mcp/breadcrumbs/index.json

@@ -1,9 +0,0 @@
-{
-  "name": "gds-breadcrumbs",
-  "files": {
-    "api": "api.md",
-    "guidelines": "guidelines.md",
-    "angular": "angular.md",
-    "react": "react.md"
-  }
-}

package/mcp/breadcrumbs/react.md

@@ -1,17 +0,0 @@
-# gds-breadcrumbs - React
-
-## Import
-
-```typescript
-import { GdsBreadcrumbs } from '@sebgroup/green-core/react'
-```
-
-## Usage
-
-Use the component as a React JSX element:
-
-```tsx
-<GdsBreadcrumbs>
-  {/* content */}
-</GdsBreadcrumbs>
-```

package/mcp/button/angular.md

@@ -1,25 +0,0 @@
-# gds-button - Angular
-
-## Import
-
-```typescript
-import { GdsButtonComponent } from '@sebgroup/green-core-ng'
-```
-
-## Usage
-
-Use the component in your Angular templates:
-
-```html
-<gds-button>
-  <!-- content -->
-</gds-button>
-```
-
-## Event Handling
-
-Events are emitted using Angular output syntax. Event names are converted from kebab-case to camelCase:
-
-| Web Component Event | Angular Output | Handler Example |
-|---------------------|----------------|-----------------|
-| `click` | `click` | `(click)="handler($event)"` |

package/mcp/button/api.md

@@ -1,71 +0,0 @@
-# gds-button
-
-**Class**: `GdsButton`
-
-**Tag**: `<gds-button>`
-
-
-## Properties
-
-| Name | Type | Default | Description |
-|------|------|---------|-------------|
-| `width` | `string \| undefined` | `-` | Style Expression Property that controls the `width` property. Supports space tokens and all valid CSS `width` values. |
-| `'min-width'` | `string \| undefined` | `-` | Style Expression Property that controls the `min-width` property. Supports space tokens and all valid CSS `min-width` values. |
-| `'max-width'` | `string \| undefined` | `-` | Style Expression Property that controls the `max-width` property. Supports space tokens and all valid CSS `max-width` values. |
-| `'inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `inline-size` property. Supports space tokens and all valid CSS `inline-size` values |
-| `'min-inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `min-inline-size` property. Supports space tokens and all valid CSS `min-inline-size` values. |
-| `'max-inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `max-inline-size` property. Supports space tokens and all valid CSS `max-inline-size` values. |
-| `margin` | `string \| undefined` | `-` | Style Expression Property that controls the `margin` property. Only accepts space tokens. |
-| `'margin-inline'` | `string \| undefined` | `-` | Style Expression Property that controls the `margin-inline` property. Only accepts space tokens. |
-| `'margin-block'` | `string \| undefined` | `-` | Style Expression Property that controls the `margin-block` property. Only accepts space tokens. |
-| `'align-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `align-self` property. Supports all valid CSS `align-self` values. |
-| `'justify-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `justify-self` property. Supports all valid CSS `justify-self` values. |
-| `'place-self'` | `string \| undefined` | `-` | Style Expression Property that controls the `place-self` property. Supports all valid CSS `place-self` values. |
-| `'grid-column'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-column` property. Supports all valid CSS grid-column values. Documentation: https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column |
-| `'grid-row'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-row` property. Supports all valid CSS `grid-row` values. |
-| `'grid-area'` | `string \| undefined` | `-` | Style Expression Property that controls the `grid-area` property. Supports all valid CSS `grid-area` values. |
-| `flex` | `string \| undefined` | `-` | Style Expression Property that controls the `flex` property. Supports all valid CSS `flex` values. |
-| `order` | `string \| undefined` | `-` | Style Expression Property that controls the `order` property. Supports all valid CSS `order` values. |
-| `disabled` | `boolean` | `false` | Whether the button is disabled. |
-| `'justify-content'` | `string \| undefined` | `-` | Spread the contents of the button |
-| `type` | `HTMLButtonElement['type'] \| undefined` | `-` | The type of the button. |
-| `rank` | `'primary' \| 'secondary' \| 'tertiary'` | `'primary'` | The rank of the button. Defaults to "primary". |
-| `variant` | `\| 'brand'     \| 'neutral'     \| 'positive'     \| 'negative'     \| 'notice'     \| 'warning'` | `'neutral'` | Defines which variant the button belongs to. Defaults to "neutral". |
-| `size` | `'xs' \| 'small' \| 'medium' \| 'large'` | `'medium'` | Sets the size of the button. Defaults to "medium". |
-| `label` | `string` | `''` | The label of the button. Use this to add an accessible label to the button when no text is provided in the default slot. |
-| `href` | `string` | `''` | When set, the underlying button will be rendered as an anchor element. |
-| `target` | `'_self' \| '_blank' \| '_parent' \| '_top' \| undefined` | `-` | Where to display the linked URL. Only used when href is present. |
-| `rel` | `string \| undefined` | `-` | The relationship of the linked URL as space-separated link types. Only used when href is present. Defaults to "noreferrer noopener" for security reasons when target is set. |
-| `download` | `string \| undefined` | `-` | Causes the browser to treat the linked URL as a download. Can be used with or without a filename value. Only used when href is present. |
-| `validator` | `GdsValidator \| undefined` | `-` | A validator that can be used to validate the form control and set an error message. |
-| `required` | `boolean` | `false` | The required attribute can be used to communicate to users of assistive technology that the control is required. Validation still needs to be done in a validator or equivalent. |
-| `errorMessage` | `string` | `''` | This can be used to manually control the error message that will be displayed when the control is invalid. |
-| `invalid` | `any` | `-` | Validation state of the form control. Setting this to true triggers the invalid state of the control. |
-| `value` | `any` | `-` | Get or set the value of the form control. |
-| `name` | `string` | `''` |  |
-
-
-## Events
-
-| Name | Type | Description |
-|------|------|-------------|
-| `click` | `MouseEvent` | Fired when the button is clicked. |
-
-
-## Slots
-
-| Name | Description |
-|------|-------------|
-| `(default)` | Content to be displayed as the button label. |
-| `lead` | An optional slot that allows a `gds-icon-[ICON_NAME]` element to be placed before the label. |
-| `trail` | An optional slot that allows a `gds-icon-[ICON_NAME]` element to be placed after the label. |
-
-
-## Form Control
-
-This component is a form control and inherits form-related properties and methods.
-
-
-## Routing Support
-
-This component supports routing via the `href` property.

package/mcp/button/guidelines.md

@@ -1,88 +0,0 @@
-# Button
-
-A button can be tapped or clicked to perform an action.
-
-
-## Overview
-
-### Variants and ranks
-
-Variant is used to communicate the intent of the button, such as positive, negative, notice.
-
-Rank determines the priority of the button, and can be primary, secondary or tertiary. All variants are each available in those three ranks.
-
-### Neutral
-
-This is our default button used for most cases. Carefully choose what rank to use and avoid using more than one primary button for each context.
-
-### Brand
-
-Our brand button is used in specific scenarios, such as hero areas, login or brand enforcing messages.
-
-### Negative
-
-Used for destructive actions such as "Delete". Also used for sell actions (e.g. selling stocks or funds).
-
-### Notice
-
-Use only for the notice alert and for buy actions (e.g. buying stocks or funds).
-
-### Icon button
-
-Use an icon button only when the icon is universally understood and can stand on its own, such as a close or expand icon.
-
-If the action is not immediately clear, use a regular button with a text label instead to ensure clarity and accessibility.
-
-The icon button comes in the same ranks and variants as regular buttons.
-
-### Split button
-
-⚠️ Coming soon.
-
-The split button always has a primary action. This action is most likely to be used by the customer as the default action.When users click on the primary action, it triggers this action directly, such as submitting a form, confirming a selection, or initiating a process.
-
-The users can click on the dropdown arrow to reveal a dropdown menu providing secondary or additional options.
-
-The split button comes in both primary and secondary.
-
-### Next and back button
-
-Used inside flows to signal the direction forward or backward.
-
-Back button comes in both primary and secondary state depending on what suits the content. The next button comes as primary only.
-
-### Size
-
-Buttons can be xs, small, medium or large. The default size is medium.  
-Choose size depending on context. Avoid to mix different sizes in the same context.
-
-### Desktop placements
-
-*   **Left**: In overviews and widgets, the user tends to read from top to bottom following the left side, therefore the buttons are kept to the left. Place the primary button furthest to the left.
-    
-*   **Right**: Modals and flows move the user forward (interpreted as to the right in western culture), therefore the buttons are placed to the right. Place the primary button furthest to the right.
-
-### In a mobile device
-
-*   **One button**, use the full width of the content area.
-    
-*   **Two buttons**, aim to place them side by side. It is allowed to stack them if needed.
-    
-*   **Three buttons**, consider the need for all of them. "cancel or close" might be x in the top right corner. Worst case scenario: place two buttons side by side and one tertiary button under.
-
-### Do’s and don’ts
-
-Only use one primary action in the same context of several actions.
-
-
-## UX Guidelines
-
-### Writing UX text for buttons
-
-### Use commands and requests in the button
-
-### Avoid Perform and Okay
-
-### Standard button texts
-
-### Do’s and don’ts

package/mcp/button/index.json

@@ -1,9 +0,0 @@
-{
-  "name": "gds-button",
-  "files": {
-    "api": "api.md",
-    "guidelines": "guidelines.md",
-    "angular": "angular.md",
-    "react": "react.md"
-  }
-}

package/mcp/button/react.md

@@ -1,25 +0,0 @@
-# gds-button - React
-
-## Import
-
-```typescript
-import { GdsButton } from '@sebgroup/green-core/react'
-```
-
-## Usage
-
-Use the component as a React JSX element:
-
-```tsx
-<GdsButton>
-  {/* content */}
-</GdsButton>
-```
-
-## Event Handling
-
-Events are handled using React event handler props. Event names are converted from kebab-case to camelCase with an "on" prefix:
-
-| Web Component Event | React Handler Prop | Handler Example |
-|---------------------|--------------------|-----------------|
-| `click` | `onClick` | `onClick={handler}` |

package/mcp/calendar/angular.md

@@ -1,26 +0,0 @@
-# gds-calendar - Angular
-
-## Import
-
-```typescript
-import { GdsCalendarComponent } from '@sebgroup/green-core-ng'
-```
-
-## Usage
-
-Use the component in your Angular templates:
-
-```html
-<gds-calendar>
-  <!-- content -->
-</gds-calendar>
-```
-
-## Event Handling
-
-Events are emitted using Angular output syntax. Event names are converted from kebab-case to camelCase:
-
-| Web Component Event | Angular Output | Handler Example |
-|---------------------|----------------|-----------------|
-| `change` | `change` | `(change)="handler($event)"` |
-| `gds-date-focused` | `gdsDateFocused` | `(gdsDateFocused)="handler($event)"` |