@amedia/brick-mcp 0.0.1-LLM-DOCS → 0.0.1-NEW-PATH-1

package/data/components/brick-input.md

@@ -1,521 +0,0 @@
----
-name: brick-input
-version: 3.0.9
-selector: brick-input-v3
-category: Forms
-tags: [input, form-control, text-field, validation, form-element, user-input]
-use_cases: [forms, authentication, search, checkout, user-registration, contact-forms, surveys, data-entry]
-related: [brick-tokens, brick-form]
----
-
-# Brick Input
-
-A web component that renders accessible input fields with labels, validation support, and comprehensive attribute options for all standard HTML input types.
-
-## Key Capabilities
-
-- Supports all standard HTML input types (text, email, password, number, date, checkbox, radio, etc.)
-- Built-in label management with optional visual hiding (screen-reader accessible)
-- Pattern-based validation with error messages and aria-live announcements
-- Help text and optional field indicators
-- Automatic asterisk addition for required radio/checkbox groups
-- Full accessibility support with ARIA attributes
-- SSR compatible with hydration support
-- Framework-agnostic web component
-
-## Props/Attributes
-
-| Attribute | Type | Default | Required | Description |
-|-----------|------|---------|----------|-------------|
-| `type` | `'text' \| 'email' \| 'password' \| 'number' \| 'date' \| 'checkbox' \| 'radio' \| 'tel' \| 'url' \| 'search' \| 'file' \| 'color' \| 'range' \| 'time' \| 'button' \| 'submit' \| 'reset' \| 'hidden' \| 'image'` | `'text'` | yes | Type of input field to render |
-| `data-label-text` | string | - | recommended | Label text for the input field |
-| `data-id` | string | - | no | ID for the input element |
-| `data-name` | string | - | no | Name attribute for form submission |
-| `data-value` | string | - | no | Initial value of the input |
-| `data-placeholder` | string | - | no | Placeholder text |
-| `data-required` | boolean | `false` | no | Marks the field as required |
-| `data-disabled` | boolean | `false` | no | Disables the input |
-| `data-readonly` | boolean | `false` | no | Makes the input read-only |
-| `data-label-hidden` | boolean | `false` | no | Visually hides label (still accessible to screen readers) |
-| `data-pattern` | string | - | no | Regex pattern for validation (text, password, search, tel, url, email) |
-| `data-errortext` | string | `'Feltet må fylles ut korrekt.'` | no | Error message shown on validation failure |
-| `data-helptext` | string | - | no | Helper text displayed below the input |
-| `data-optionaltext` | string | - | no | Text to indicate optional fields (e.g., "optional") |
-| `data-min` | string | - | no | Minimum value (for number, date, range) |
-| `data-max` | string | - | no | Maximum value (for number, date, range) |
-| `data-minlength` | string | - | no | Minimum character length |
-| `data-maxlength` | string | - | no | Maximum character length |
-| `data-step` | string | - | no | Step value for number/range inputs |
-| `data-size` | string | - | no | Size of the input field |
-| `data-autocomplete` | string | - | no | Autocomplete attribute value |
-| `data-autofocus` | boolean | `false` | no | Auto-focus the input on page load |
-| `data-spellcheck` | boolean | `false` | no | Enable spellcheck |
-| `data-checked` | boolean | `false` | no | Initial checked state (checkbox, radio) |
-| `data-accept` | string | - | no | Accepted file types (for file inputs) |
-| `data-multiple` | boolean | `false` | no | Allow multiple file selection or options |
-| `data-src` | string | - | no | Image source (for image type) |
-| `data-alt` | string | - | no | Alt text (for image type) |
-| `data-list` | string | - | no | ID of datalist element for autocomplete suggestions |
-
-## Examples
-
-### Basic Text Input
-
-```html
-<brick-input-v3
-  data-type="text"
-  data-label-text="First Name"
-  data-id="firstname"
-  data-name="firstname"
-  data-required="true">
-</brick-input-v3>
-```
-
-### Email Input with Validation
-
-```html
-<brick-input-v3
-  data-type="email"
-  data-label-text="Email Address"
-  data-id="email"
-  data-name="email"
-  data-required="true"
-  data-placeholder="you@example.com"
-  data-errortext="Please enter a valid email address"
-  data-helptext="We'll never share your email">
-</brick-input-v3>
-```
-
-### Password Input
-
-```html
-<brick-input-v3
-  data-type="password"
-  data-label-text="Password"
-  data-id="password"
-  data-name="password"
-  data-required="true"
-  data-minlength="8"
-  data-pattern="^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$"
-  data-errortext="Password must be at least 8 characters with letters and numbers">
-</brick-input-v3>
-```
-
-### Number Input with Range
-
-```html
-<brick-input-v3
-  data-type="number"
-  data-label-text="Age"
-  data-id="age"
-  data-name="age"
-  data-min="18"
-  data-max="120"
-  data-required="true">
-</brick-input-v3>
-```
-
-### Checkbox Input
-
-```html
-<brick-input-v3
-  data-type="checkbox"
-  data-label-text="I accept the terms and conditions"
-  data-id="terms"
-  data-name="terms"
-  data-value="accepted"
-  data-required="true">
-</brick-input-v3>
-```
-
-### Radio Button Group
-
-```html
-<!-- Radio buttons should be wrapped in a fieldset with legend -->
-<fieldset>
-  <legend>Select an option</legend>
-
-  <brick-input-v3
-    data-type="radio"
-    data-label-text="Option 1"
-    data-id="option1"
-    data-name="choice"
-    data-value="1"
-    data-required="true">
-  </brick-input-v3>
-
-  <brick-input-v3
-    data-type="radio"
-    data-label-text="Option 2"
-    data-id="option2"
-    data-name="choice"
-    data-value="2"
-    data-required="true">
-  </brick-input-v3>
-</fieldset>
-```
-
-### Date Input
-
-```html
-<brick-input-v3
-  data-type="date"
-  data-label-text="Date of Birth"
-  data-id="dob"
-  data-name="dob"
-  data-min="1900-01-01"
-  data-max="2025-12-31"
-  data-required="true">
-</brick-input-v3>
-```
-
-### Search Input
-
-```html
-<brick-input-v3
-  data-type="search"
-  data-label-text="Search"
-  data-label-hidden="true"
-  data-id="search"
-  data-name="q"
-  data-placeholder="Search articles...">
-</brick-input-v3>
-```
-
-### File Upload
-
-```html
-<brick-input-v3
-  data-type="file"
-  data-label-text="Upload Document"
-  data-id="document"
-  data-name="document"
-  data-accept=".pdf,.doc,.docx"
-  data-multiple="true">
-</brick-input-v3>
-```
-
-### Input with Datalist (Autocomplete)
-
-```html
-<brick-input-v3
-  data-type="text"
-  data-label-text="Choose a browser"
-  data-id="browser"
-  data-name="browser"
-  data-list="browsers">
-</brick-input-v3>
-
-<datalist id="browsers">
-  <option value="Chrome">
-  <option value="Firefox">
-  <option value="Safari">
-  <option value="Edge">
-</datalist>
-```
-
-### Optional Field
-
-```html
-<brick-input-v3
-  data-type="text"
-  data-label-text="Middle Name"
-  data-id="middlename"
-  data-name="middlename"
-  data-optionaltext="(optional)">
-</brick-input-v3>
-```
-
-### Phone Number with Pattern
-
-```html
-<brick-input-v3
-  data-type="tel"
-  data-label-text="Phone Number"
-  data-id="phone"
-  data-name="phone"
-  data-pattern="[0-9]{8}"
-  data-placeholder="12345678"
-  data-errortext="Please enter a valid 8-digit phone number"
-  data-required="true">
-</brick-input-v3>
-```
-
-## Framework Integration
-
-### Svelte
-
-```svelte
-<script>
-  import '@amedia/brick-input';
-
-  let email = '';
-
-  function handleChange(event) {
-    email = event.target.value;
-    console.log('Email changed:', email);
-  }
-</script>
-
-<brick-input-v3
-  data-type="email"
-  data-label-text="Email"
-  data-id="email"
-  data-name="email"
-  data-required="true"
-  onchange={handleChange}
-/>
-```
-
-### React
-
-```javascript
-import '@amedia/brick-input';
-
-function MyForm() {
-  const handleChange = (e) => {
-    console.log('Value:', e.target.value);
-  };
-
-  return (
-    <brick-input-v3
-      data-type="text"
-      data-label-text="Username"
-      data-id="username"
-      data-name="username"
-      data-required="true"
-      onChange={handleChange}
-    />
-  );
-}
-```
-
-## Programmatic Usage
-
-```javascript
-import { BrickInput } from '@amedia/brick-input';
-
-const input = new BrickInput({
-  type: 'email',
-  labelText: 'Email Address',
-  id: 'email',
-  name: 'email',
-  required: true,
-  placeholder: 'you@example.com'
-});
-
-// Set change handler
-input.onChange = (event) => {
-  console.log('Value changed:', event.target.value);
-};
-
-// Add to DOM
-document.querySelector('form').appendChild(input);
-```
-
-## Server-Side Rendering
-
-```javascript
-import { renderBrickInput } from '@amedia/brick-input/template';
-
-const inputHTML = renderBrickInput({
-  type: 'text',
-  labelText: 'First Name',
-  id: 'firstname',
-  name: 'firstname',
-  required: true
-});
-
-// Include CSS file in your HTML
-// <link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-input/v3/css/styles.css">
-```
-
-## Accessibility
-
-- **WCAG 2.1 AA** compliant
-- Labels are always associated with inputs via `for` attribute
-- `data-label-hidden` provides visually hidden labels that remain accessible to screen readers
-- Error messages announced via `aria-live` regions
-- Required fields automatically get asterisks for radio/checkbox groups
-- Pattern validation triggers on blur with screen reader announcements
-- All standard ARIA attributes supported through native HTML input
-- Keyboard navigation fully supported
-- Focus states clearly visible
-
-## Validation
-
-Validation is triggered on `blur` event for inputs with a `data-pattern` attribute:
-
-```html
-<brick-input-v3
-  data-type="text"
-  data-label-text="Username"
-  data-pattern="^[a-zA-Z0-9_]{3,16}$"
-  data-errortext="Username must be 3-16 characters (letters, numbers, underscore only)">
-</brick-input-v3>
-```
-
-**Supported types for pattern validation:**
-- text
-- password
-- search
-- tel
-- url
-- email
-
-Error messages are:
-- Displayed visually below the input
-- Announced to screen readers via aria-live="polite"
-- Only shown after the user has interacted with the field (on blur)
-
-## Common Patterns
-
-### Login Form
-
-```html
-<form>
-  <brick-input-v3
-    data-type="email"
-    data-label-text="Email"
-    data-id="login-email"
-    data-name="email"
-    data-autocomplete="email"
-    data-required="true">
-  </brick-input-v3>
-
-  <brick-input-v3
-    data-type="password"
-    data-label-text="Password"
-    data-id="login-password"
-    data-name="password"
-    data-autocomplete="current-password"
-    data-required="true">
-  </brick-input-v3>
-
-  <button type="submit">Log In</button>
-</form>
-```
-
-### Registration Form
-
-```html
-<form>
-  <brick-input-v3
-    data-type="text"
-    data-label-text="Full Name"
-    data-id="fullname"
-    data-name="fullname"
-    data-autocomplete="name"
-    data-required="true">
-  </brick-input-v3>
-
-  <brick-input-v3
-    data-type="email"
-    data-label-text="Email"
-    data-id="email"
-    data-name="email"
-    data-autocomplete="email"
-    data-required="true">
-  </brick-input-v3>
-
-  <brick-input-v3
-    data-type="password"
-    data-label-text="Password"
-    data-id="password"
-    data-name="password"
-    data-autocomplete="new-password"
-    data-minlength="8"
-    data-required="true">
-  </brick-input-v3>
-
-  <brick-input-v3
-    data-type="checkbox"
-    data-label-text="I agree to the terms and conditions"
-    data-id="terms"
-    data-name="terms"
-    data-required="true">
-  </brick-input-v3>
-
-  <button type="submit">Register</button>
-</form>
-```
-
-### Search Box
-
-```html
-<form role="search">
-  <brick-input-v3
-    data-type="search"
-    data-label-text="Search"
-    data-label-hidden="true"
-    data-id="search"
-    data-name="q"
-    data-placeholder="Search articles..."
-    data-autocomplete="off">
-  </brick-input-v3>
-
-  <button type="submit">Search</button>
-</form>
-```
-
-### Contact Form
-
-```html
-<form>
-  <brick-input-v3
-    data-type="text"
-    data-label-text="Name"
-    data-id="contact-name"
-    data-name="name"
-    data-required="true">
-  </brick-input-v3>
-
-  <brick-input-v3
-    data-type="email"
-    data-label-text="Email"
-    data-id="contact-email"
-    data-name="email"
-    data-required="true">
-  </brick-input-v3>
-
-  <brick-input-v3
-    data-type="tel"
-    data-label-text="Phone"
-    data-id="contact-phone"
-    data-name="phone"
-    data-optionaltext="(optional)">
-  </brick-input-v3>
-
-  <button type="submit">Send</button>
-</form>
-```
-
-## Technical Details
-
-- **Custom Element**: `brick-input-v3`
-- **Base Class**: BrickElement
-- **Dependencies**:
-  - @amedia/brick-tokens (design tokens and utilities)
-  - @amedia/brick-template (base class)
-- **Renders as**: Various `<input>` types wrapped with `<label>`
-- **SSR Compatible**: Yes, with hydration support
-- **Framework**: Framework-agnostic web component
-
-## Important Notes
-
-- The `type` attribute is required - defaults to `'text'` if not provided
-- Use `data-label-text` for accessibility - it creates proper label associations
-- Use `data-label-hidden` to visually hide labels while keeping them accessible to screen readers
-- Pattern validation only works with: text, password, search, tel, url, and email types
-- For radio buttons and checkboxes, wrap groups in a `<fieldset>` with a `<legend>`
-- Required radio/checkbox groups automatically get asterisks added to their parent legend
-- Error messages are announced to screen readers via aria-live regions
-- Validation triggers on blur (when user leaves the field)
-- The component provides an `onChange` setter/getter for custom change handling
-- Checkbox and radio inputs automatically manage their `checked` attribute on change
-- Version 3.0.0 removed the `getCssText` export - use CSS files instead
-- Version 2.0.0 changed the onChange event to bubble up correctly
-
-## Version
-
-Current version: 3.0.9

package/data/components/brick-nifs.md

@@ -1,163 +0,0 @@
----
-name: brick-nifs
-version: 0.0.7
-selector: brick-nifs-v0
-category: Data Display
-tags: [sports, live-scores, websocket, real-time, nifs, football, soccer]
-use_cases: [sports-coverage, live-match-updates, football-scores, real-time-events]
-related: [brick-teaser]
----
-
-# Brick Nifs
-
-A specialized component for displaying live sports match scores and updates from the NIFS (Norwegian sports data) API via WebSocket connections.
-
-## Key Capabilities
-
-- Real-time match score updates via WebSocket connection to NIFS API
-- Automatic fetching of initial match data from NIFS v2 API
-- Integration with brick-teaser components to display live scores as breaking news
-- Automatic cleanup of WebSocket connections on component removal
-- Support for both 45-minute (half-time) and 90-minute (full-time) scores
-- Event-driven architecture using custom events to update related components
-
-## Props/Attributes
-
-| Attribute | Type | Default | Required | Description |
-|-----------|------|---------|----------|-------------|
-| `data-nifsid` | string | - | yes | The NIFS match ID to track and display live updates for |
-
-## Examples
-
-### Basic Live Match Score Tracking
-
-Track a single football match and display live score updates:
-
-```html
-<brick-nifs-v0 data-nifsid="12345"></brick-nifs-v0>
-```
-
-### Integration with Brick Teaser
-
-Display live match scores on teaser components by matching the external ID:
-
-```html
-<brick-nifs-v0 data-nifsid="12345"></brick-nifs-v0>
-
-<brick-teaser-v16
-  data-external-id="12345"
-  data-title="Norway vs Sweden"
-  data-href="/sport/match/12345">
-</brick-teaser-v16>
-```
-
-When the match score updates, the brick-nifs component will dispatch a custom event that brick-teaser components listen for, automatically displaying the score as breaking news text.
-
-### Multiple Match Tracking
-
-Track multiple matches on the same page:
-
-```html
-<brick-nifs-v0 data-nifsid="12345"></brick-nifs-v0>
-<brick-nifs-v0 data-nifsid="67890"></brick-nifs-v0>
-
-<brick-teaser-v16
-  data-external-id="12345"
-  data-title="Norway vs Sweden">
-</brick-teaser-v16>
-
-<brick-teaser-v16
-  data-external-id="67890"
-  data-title="Denmark vs Finland">
-</brick-teaser-v16>
-```
-
-## How It Works
-
-### Initial Score Fetch
-
-When the component connects to the DOM, it:
-1. Retrieves the `data-nifsid` attribute
-2. Fetches initial match data from `https://v2api.nifs.no/matches/{matchId}/`
-3. Extracts the current score (90-minute or 45-minute)
-4. If a score exists (non-zero), dispatches a custom event to update related brick-teaser components
-
-### Real-Time Updates
-
-The component establishes a WebSocket connection to `wss://websocket.nifs.no/socket.io/`:
-1. Joins the match room using the NIFS match ID
-2. Sends ping messages every 2.5 seconds to keep the connection alive
-3. Listens for `updateMatchEvent` and `updateImportantEvents` messages
-4. Parses the score data and dispatches custom events to update brick-teaser components
-
-### Event-Driven Integration
-
-The component dispatches `brick-teaser:attribute` custom events with the following structure:
-
-```javascript
-{
-  bubbles: true,
-  cancelable: true,
-  composed: false,
-  detail: {
-    attributeName: 'data-breaking-news-text',
-    attributeValue: '2 - 1', // Current score
-    key: 'data-external-id',
-    keyValue: '12345' // Match ID
-  }
-}
-```
-
-Any brick-teaser component with a matching `data-external-id` will receive this event and update its breaking news text with the live score.
-
-## Programmatic Usage
-
-```javascript
-import { BrickNifs } from '@amedia/brick-nifs';
-
-// The component is automatically registered as 'brick-nifs-v0'
-const nifsComponent = document.createElement('brick-nifs-v0');
-nifsComponent.dataset.nifsid = '12345';
-document.body.appendChild(nifsComponent);
-```
-
-## Technical Details
-
-- **Custom Element**: `brick-nifs-v0`
-- **Base Class**: BrickElement
-- **Dependencies**: [@amedia/brick-template]
-- **Renders as**: Custom element (no visual output, data-only component)
-- **WebSocket**: Persistent connection to NIFS WebSocket API
-- **API**: NIFS v2 REST API for initial data fetch
-
-## Important Notes
-
-### No Visual Output
-
-This component does not render any visible content. It acts as a data provider and event dispatcher for other components (primarily brick-teaser).
-
-### WebSocket Connection Management
-
-- A single WebSocket connection is created per component instance
-- The connection sends ping messages every 2.5 seconds to stay alive
-- The connection is automatically cleaned up when the component is removed from the DOM via `disconnectedCallback()`
-- Each instance joins its specific match room on the NIFS WebSocket server
-
-### Score Format
-
-The component prioritizes scores in this order:
-1. 90-minute score (full-time)
-2. 45-minute score (half-time)
-3. Falls back to 0 if no score is available
-
-### External ID Matching
-
-For the live score integration to work, brick-teaser components must have a `data-external-id` attribute that matches the `data-nifsid` of the brick-nifs component.
-
-### Event Targeting
-
-The custom events are dispatched to ALL brick-teaser elements with a matching `data-external-id`, allowing multiple teasers on the same page to display the same live score.
-
-## Version
-
-Current version: 0.0.7

package/data/components/brick-published.json

@@ -1,7 +0,0 @@
-{
-  "name": "brick-published",
-  "version": "4.0.1",
-  "selector": "brick-published-v4",
-  "description": "brick-published",
-  "mdx": "import {\n  Meta,\n  Canvas,\n  Source,\n  Controls,\n  Markdown,\n} from '@storybook/addon-docs/blocks';\n\nimport * as BrickStories from './brick-published.stories';\n\nimport ReadMe from '../README.md?raw';\n\n<brick-style></brick-style>;\n\n<Meta of={BrickStories} />\n\n# brick-published\n\n## Purpose\n\nThe `brick-published` component displays publication dates in a semantic and accessible way.\n\nIt wraps a `<time>` element with proper datetime attributes to provide both human-readable and machine-readable publication timestamps. This component is commonly used in articles, blog posts, and news content to indicate when content was published or last modified.\n\n- Semantic HTML using the `<time>` element\n- Support for both publication and modification dates via `itemprop` attribute\n- Flexible date display formatting while maintaining ISO 8601 datetime attributes\n- Server-side rendering support\n- Consistent styling across different contexts\n\n<Canvas of={BrickStories.Published} sourceState=\"shown\" />\n\n## Accessibility\n\nThe `brick-published` component follows web accessibility best practices:\n\n### Semantic Structure\n\n- Uses the native `<time>` element which provides semantic meaning to assistive technologies\n- Includes proper `datetime` attribute in ISO 8601 format for machine readability\n- Uses `itemprop` attribute for structured data (schema.org microdata)\n- Follows WCAG 2.2 guidelines for meaningful content structure\n- Uses semantic markup that doesn't require additional ARIA attributes\n- Provides both human-readable display text and machine-readable datetime values\n\n### Screen Reader Support\n\n- The component structure ensures screen readers can properly announce the publication date\n- The label (e.g., \"Published:\") provides clear context before the date\n- The `datetime` attribute allows assistive technologies to interpret the exact timestamp\n\n## Usage\n\nThe `brick-published` component can be used in multiple ways depending on your rendering approach:\n\n<Source language=\"js\" code={'npm install @amedia/brick-published'} />\n\n### Server side rendering\n\nRender the markup serverside\n\n#### Import and render from '@amedia/brick-published/template'\n\n<Source\n  language=\"javascript\"\n  code={`import { renderBrickPublished } from '@amedia/brick-published/template';`}\n/>\n\n<Source\n  language=\"javascript\"\n  code={`const markup = renderPublished({\n      dataDatetime: '2022-04-22T12:00:00.000+0200',\n      dataLabel: 'Publisert:',\n      dataDisplayDate: '22.04.23 12:01',\n      dataItemprop: 'datePublished',\n    })\n`}\n/>\n\n### Client side\n\n#### Import\n\n<Source\n  language=\"javascript\"\n  code={`\n    import 'https://assets.acdn.no/pkg/@amedia/brick-published/v4/brick-published.js';\n  `}\n/>\n\n#### Create the DOM element\n\nIf the markup is not rendered serverside, there are two options creating markup client side.\n\nExample: Template literals\nThe simplest way is using template literals, passing the appropriate data-attributes.\n\n<Source\n  language=\"html\"\n  code={`<brick-published-v4\n    data-label=\"Publisert:\" data-display-date=\"22.04.23 12:01\" data-datetime=\"2022-04-22T12:00:00.000+0200\" data-itemprop=\"datePublished\"\n></brick-published-v4>`}\n/>\n\nExample: Using javascript\nCreating the element using javascript, setting dataset properties.\n\n<Source\n  language=\"javascript\"\n  code={`\n  const el = document.createElement('brick-published-v4');\n  el.setAttribute('data-label', 'Publisert:');\n  el.setAttribute('data-display-date', '22.04.23 12:01');\n  el.setAttribute('data-datetime', '2022-04-22T12:00:00.000+0200');\n  el.setAttribute('data-itemprop', 'datePublished');\n  document.body.appendChild(el);\n  `}\n/>\n\n## Attributes overview for brick-published\n\nAll dataset attributes are synced to camelcased properties.\n\n<Controls />\n<Canvas />\n\n## Styling and CSS Properties\n\n🤝 brick-published is styled using CSS properties that must exist on the page.\n\nCSS Custom Properties can be used to customize the visual appearance. It is recommended to use the existing variants before resorting to custom properties.\n\nMake sure you scope the overrides.\n\n<div className=\"note\">\n  <span>Note</span>\n  It is your responsibilty to validate that your overrides adhere to the **WCAG\n  2.1 AA** guidelines.\n</div>\n\n<table>\n  <thead>\n    <tr>\n      <th>Property</th>\n      <th>Description</th>\n      <th>Default</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <td>\n        <code>--b-published-color-fg</code>\n      </td>\n      <td>\n        You can set the background svg of the avatar using this property.\n        Example: \"--b-published-color-fg:var(--brick-colors-baseInvertedFg);\"\n      </td>\n      <td>\n        <code>var(--brick-colors-baseFg)</code>\n      </td>\n    </tr>\n  </tbody>\n</table>\n\n<Markdown>{ReadMe}</Markdown>\n"
-}