npm - @amedia/brick-mcp - Versions diffs - 0.0.1-LLM-DOCS → 0.0.1-NEW-PATH-1 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (65) hide show

package/README.md +241 -98
package/dist/data/components/brick-actions.json +6 -0
package/dist/data/components/brick-alt-teaser.json +10 -0
package/dist/data/components/brick-avatar.json +11 -0
package/dist/data/components/brick-button.json +12 -0
package/dist/data/components/brick-card.json +10 -0
package/dist/data/components/brick-carousel.json +11 -0
package/dist/data/components/brick-classnames.json +10 -0
package/dist/data/components/brick-countdown.json +7 -0
package/dist/data/components/brick-dialog.json +11 -0
package/dist/data/components/brick-fonts.json +10 -0
package/dist/data/components/brick-helloworld.json +7 -0
package/dist/data/components/brick-icon.json +10 -0
package/dist/data/components/brick-icons.json +11 -0
package/dist/data/components/brick-illustrations.json +7 -0
package/dist/data/components/brick-image.json +10 -0
package/dist/data/components/brick-input.json +12 -0
package/{data → dist/data}/components/brick-mcp.json +1 -1
package/dist/data/components/brick-nifs.json +7 -0
package/{data → dist/data}/components/brick-pill.json +1 -1
package/{data → dist/data}/components/brick-player.json +1 -1
package/dist/data/components/brick-published.json +7 -0
package/{data → dist/data}/components/brick-share.json +1 -1
package/{data → dist/data}/components/brick-stepper.json +1 -1
package/{data → dist/data}/components/brick-tab.json +1 -1
package/{data → dist/data}/components/brick-tabs.json +1 -1
package/{data → dist/data}/components/brick-tag.json +1 -1
package/{data → dist/data}/components/brick-teaser-player.json +1 -1
package/{data → dist/data}/components/brick-teaser-reels.json +1 -1
package/{data → dist/data}/components/brick-teaser.json +1 -1
package/{data → dist/data}/components/brick-textarea.json +1 -1
package/{data → dist/data}/components/brick-toast.json +1 -1
package/{data → dist/data}/components/brick-toggle.json +1 -1
package/{data → dist/data}/components/brick-tokens.json +1 -1
package/{data → dist/data}/components/brick-tooltip.json +1 -1
package/{data → dist/data}/components-metadata.json +29 -29
package/dist/data/components.json +321 -0
package/dist/http.js +311 -0
package/dist/http.js.map +7 -0
package/dist/index.js +52 -81
package/dist/index.js.map +4 -4
package/package.json +3 -6
package/scripts/generate-data.js +37 -40
package/data/components/brick-actions.md +0 -59
package/data/components/brick-alt-teaser.md +0 -253
package/data/components/brick-avatar.md +0 -265
package/data/components/brick-button.md +0 -364
package/data/components/brick-card.md +0 -329
package/data/components/brick-carousel.md +0 -330
package/data/components/brick-classnames.md +0 -150
package/data/components/brick-countdown.md +0 -179
package/data/components/brick-dialog.md +0 -418
package/data/components/brick-fonts.md +0 -335
package/data/components/brick-helloworld.md +0 -202
package/data/components/brick-icon.md +0 -271
package/data/components/brick-icons.md +0 -430
package/data/components/brick-illustrations.md +0 -552
package/data/components/brick-image.md +0 -335
package/data/components/brick-input.md +0 -521
package/data/components/brick-nifs.md +0 -163
package/data/components/brick-published.json +0 -7
package/data/tokens-documentation.json +0 -7
/package/{data → dist/data}/components/brick-template.json +0 -0
/package/{data → dist/data}/components/brick-themes.json +0 -0
/package/{data → dist/data}/tokens.json +0 -0

package/data/components/brick-fonts.md DELETED Viewed

@@ -1,335 +0,0 @@
----
-name: brick-fonts
-version: 2.0.2
-category: Resources
-tags: [fonts, typography, web-fonts, font-face, css, theming, woff2]
-use_cases: [typography, branding, theme-implementation, font-loading, multi-brand]
-related: [brick-tokens]
----
-# Brick Fonts
-Distribution package for Amedia's web fonts, providing theme-specific font files and font-face CSS declarations optimized for CDN delivery via Eik.
-## Key Capabilities
-- Serves font files (.woff2) and font-face CSS for 5 different Amedia themes
-- Optimized font delivery via Eik CDN (assets.acdn.no)
-- Supports version pinning for performance optimization
-- Uses font-display: swap for improved loading performance
-- Includes both proprietary and open-source fonts
-- Automatic integration with Maelstrom-served applications
-## Supported Themes and Font Families
-### Alfa
-- National2 (light, regular, italic, medium, bold)
-- National2 Narrow (regular, bold)
-- Open Sans (300, 400, 700 with italic variants)
-- Playfair Display (variable font 400-900)
-- Tiempos Text
-### Bravo
-- National2 (light, regular, italic, medium, bold)
-- National2 Narrow (regular, bold, extrabold)
-- Open Sans (300, 400, 700 with italic variants)
-- Playfair Display (variable font 400-900)
-- Merriweather (bold)
-- Tiempos Headline
-### Charlie
-- National2 (multiple weights)
-- National2 Narrow
-- Open Sans
-- Playfair Display
-- Tiempos Headline (regular, bold)
-- Tiempos Text
-### Nettavisen
-- FaktorTittel (regular, medium, black)
-- FaktorSans (regular, bold, italic)
-- FaktorSerif (regular, bold with italic variants)
-- Open Sans (300, 400, 700 with italic variants)
-### Alt
-- ALT Rund Display
-- ALT Rund Text
-- Crimson Pro
-## Installation Methods
-### Via Maelstrom (Automatic)
-If your application is served through Maelstrom, fonts are automatically available. Simply use font-family declarations in your CSS:
-```css
-body {
-  font-family: 'National2', sans-serif;
-}
-h1 {
-  font-family: 'Playfair Display', serif;
-}
-```
-### Via CDN Link (Manual)
-For applications not using Maelstrom, include the font-face CSS via link element:
-```html
-<!-- Using version alias (easier to update) -->
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/bravo/font-face.css">
-<!-- Using pinned version (better performance) -->
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/2.0.2/css/nettavisen/font-face.css">
-```
-### Via NPM
-```bash
-npm install @amedia/brick-fonts
-```
-```javascript
-import { bravo, nettavisen } from '@amedia/brick-fonts';
-// Exports paths to sample font files for testing
-```
-## CDN URLs by Theme
-```
-https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/alfa/font-face.css
-https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/bravo/font-face.css
-https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/charlie/font-face.css
-https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/nettavisen/font-face.css
-https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/alt/font-face.css
-```
-## Examples
-### Basic Theme Font Loading
-```html
-<!DOCTYPE html>
-<html>
-<head>
-  <link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/2.0.2/css/bravo/font-face.css">
-  <style>
-    body {
-      font-family: 'National2', sans-serif;
-      font-weight: 400;
-    }
-    h1 {
-      font-family: 'National2 Narrow', sans-serif;
-      font-weight: 700;
-    }
-  </style>
-</head>
-<body>
-  <h1>Headline with National2 Narrow</h1>
-  <p>Body text with National2</p>
-</body>
-</html>
-```
-### Multiple Theme Support (Multi-brand Application)
-```html
-<head>
-  <!-- Load fonts for multiple brands -->
-  <link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/2.0.2/css/bravo/font-face.css">
-  <link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/2.0.2/css/nettavisen/font-face.css">
-  <style>
-    .bravo-theme {
-      font-family: 'National2', sans-serif;
-    }
-    .nettavisen-theme {
-      font-family: 'FaktorSans', sans-serif;
-    }
-    .nettavisen-theme h1 {
-      font-family: 'FaktorTittel', sans-serif;
-      font-weight: 900;
-    }
-  </style>
-</head>
-```
-### Using Variable Fonts
-```css
-.headline {
-  font-family: 'Playfair Display', serif;
-  font-weight: 600; /* Any value between 400-900 */
-}
-.subheadline {
-  font-family: 'Playfair Display', serif;
-  font-weight: 800; /* Smoothly interpolated */
-}
-```
-### Storybook Configuration
-```html
-<!-- .storybook/preview-head.html -->
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/alfa/font-face.css">
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/bravo/font-face.css">
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/charlie/font-face.css">
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/nettavisen/font-face.css">
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/alt/font-face.css">
-```
-## Performance Optimization
-### Version Pinning vs Aliasing
-**Using version alias (v2)**
-```html
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/v2/css/bravo/font-face.css">
-```
-- Easier to maintain (automatic updates to latest v2.x.x)
-- Performance cost: creates critical request chain (alias → CSS → font files)
-- Lighthouse may warn about chained requests
-**Using pinned version (2.0.2)**
-```html
-<link rel="stylesheet" href="https://assets.acdn.no/pkg/@amedia/brick-fonts/2.0.2/css/bravo/font-face.css">
-```
-- Better performance (direct CSS → font files)
-- Requires manual version updates
-- Recommended for production
-### Font Loading Strategy
-All fonts use `font-display: swap` which:
-- Shows fallback font immediately
-- Swaps to web font when loaded
-- Prevents invisible text (FOIT)
-- Improves perceived performance
-## Font File Structure
-### CSS Files
-```
-css/
-├── alfa/
-│   └── font-face.css
-├── bravo/
-│   └── font-face.css
-├── charlie/
-│   └── font-face.css
-├── nettavisen/
-│   └── font-face.css
-└── alt/
-    └── font-face.css
-```
-### Font Files
-```
-fonts/
-├── alfa/
-│   ├── national-2-light.woff2
-│   ├── national-2-regular.woff2
-│   └── ... (24 total files)
-├── bravo/
-│   ├── national-2-bold.woff2
-│   ├── national-2-narrow-regular.woff2
-│   └── ... (19 total files)
-├── charlie/
-│   └── ... (23 total files)
-├── nettavisen/
-│   ├── FaktorSans-Bold.woff2
-│   ├── FaktorSerif-RegularItalic.woff2
-│   └── ... (16 total files)
-└── alt/
-    └── ... (6 total files)
-```
-## Font-Face Example (Bravo Theme)
-```css
-@font-face {
-  font-family: 'National2';
-  src: url('https://assets.acdn.no/pkg/@amedia/brick-fonts/2.0.1/fonts/bravo/national-2-regular.woff2');
-  font-weight: 400;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: 'National2';
-  src: url('https://assets.acdn.no/pkg/@amedia/brick-fonts/2.0.1/fonts/bravo/national-2-bold.woff2');
-  font-weight: 700;
-  font-style: normal;
-  font-display: swap;
-}
-```
-## Technical Details
-- **Package Type**: Asset distribution (fonts + CSS)
-- **Format**: WOFF2 (Web Open Font Format 2)
-- **Distribution**: Eik CDN (https://assets.acdn.no)
-- **Build System**: Custom Node.js build script
-- **Dependencies**: None (standalone asset package)
-## Adding New Fonts
-1. Add .woff2 file(s) to appropriate theme directory in `fonts/`
-2. Add @font-face rule to matching theme in `css/`
-3. Ensure font-weight and font-style match the font file characteristics
-4. Use [wakamaifondue.com](https://wakamaifondue.com/) to analyze font capabilities
-5. Create changeset and publish new version
-6. Eik automatically publishes both CSS and font files
-## License Information
-### Proprietary Fonts
-- National2, National2 Narrow
-- Faktor (FaktorTittel, FaktorSans, FaktorSerif)
-- ALT Rund (Display, Text)
-- Tiempos (Headline, Text)
-- Merriweather
-- Bespoke fonts
-Contact licensing team for details.
-### Open Source Fonts
-**Open Sans**
-- License: SIL Open Font License (OFL)
-- Source: [Google Fonts](https://github.com/googlefonts/opensans)
-**Playfair Display**
-- License: SIL Open Font License (OFL)
-- Source: [GitHub](https://github.com/clauseggers/Playfair)
-**Crimson Pro**
-- License: SIL Open Font License (OFL)
-## Important Notes
-- Font files are served from Eik CDN, not from npm package
-- The npm package only contains path references, not actual font files
-- All fonts use .woff2 format for optimal compression
-- Font-display: swap is used for all fonts to improve loading performance
-- Version 2.0.0 removed CommonJS builds (ESM only)
-- Automatic integration with Maelstrom removes need for manual link tags
-## Tools for Font Development
-- [wakamaifondue.com](https://wakamaifondue.com/) - Analyze font file capabilities
-- [WhatFont Chrome Extension](https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm) - Identify fonts on web pages
-## Version
-Current version: 2.0.2
-### Recent Changes
-- 2.0.2: Better fallback font for National2 Narrow
-- 2.0.1: Changed font-display from auto to swap for better loading performance
-- 2.0.0: Removed CommonJS build (ESM only)

package/data/components/brick-helloworld.md DELETED Viewed

@@ -1,202 +0,0 @@
----
-name: brick-helloworld
-version: 2.0.2
-selector: brick-helloworld-v2
-category: Development
-tags: [example, demo, development, tutorial, web-components, template, getting-started]
-use_cases: [learning-brick-components, testing-build-process, understanding-component-anatomy, server-side-rendering-examples, client-side-rendering-examples]
-related: [brick-input, brick-toggle, brick-template]
----
-# Brick Helloworld
-A demonstration component showcasing the anatomy and usage patterns of Brick components, used for testing and educational purposes.
-## Key Capabilities
-- Demonstrates both server-side and client-side rendering patterns
-- Shows template processing with named template slots
-- Integrates with other Brick components (brick-input, brick-toggle)
-- Illustrates mirrored props and observed attributes
-- Provides examples of Stitches styling integration
-- Serves as a reference implementation for new Brick components
-## Props/Attributes
-| Attribute | Type | Default | Required | Description |
-|-----------|------|---------|----------|-------------|
-| `data-text` | string | undefined | no | Text content to display in the component |
-| `data-version` | string | undefined | no | Version string used for styling variants |
-| `is-rendered` | boolean | false | no | Indicates if markup was rendered server-side |
-| `children-rendered` | string | undefined | no | Internal attribute set when child components finish rendering |
-## Examples
-### Basic Usage - Template Literals
-```html
-<brick-helloworld-v2 data-text="Hello, World!" data-version="v2">
-  <template name="content">
-    <p>I am a paragraph inside a template named content</p>
-  </template>
-</brick-helloworld-v2>
-```
-### JavaScript createElement
-```javascript
-const el = document.createElement('brick-helloworld-v2');
-el.dataset.text = 'The quick brown fox jumps over the lazy dog';
-el.dataset.version = 'v2';
-document.body.appendChild(el);
-```
-### Server-Side Rendering
-```javascript
-import { renderBrickHelloworld, getCssText } from '@amedia/brick-helloworld/template';
-const markup = renderBrickHelloworld({
-  dataText: 'The quick brown fox jumps over the lazy dog',
-  dataVersion: 'v2',
-  isRendered: true
-});
-// Include the styles
-const css = `<style>${getCssText()}</style>`;
-```
-### Client-Side Import
-```javascript
-// Via npm
-import '@amedia/brick-helloworld';
-// Via Eik CDN
-import 'https://assets.acdn.no/pkg/@amedia/brick-helloworld/v2/brick-helloworld.js';
-```
-### Using Template Slots
-```html
-<brick-helloworld-v2 data-text="Main content" data-version="v2">
-  <template name="content">
-    <div class="custom-content">
-      <h2>Custom Template Content</h2>
-      <p>This content is processed by the component</p>
-    </div>
-  </template>
-</brick-helloworld-v2>
-```
-## Framework Integration
-### Node.js (>=18) - HTTPS Imports
-```javascript
-// Using HTTPS imports (Node.js >= 18)
-import { renderBrickHelloworld, getCssText } from 'https://assets.acdn.no/pkg/@amedia/brick-helloworld/v2/template.js';
-const html = renderBrickHelloworld({
-  dataText: 'Server rendered content',
-  dataVersion: 'v2'
-});
-```
-## Programmatic Usage
-```javascript
-import { BrickHelloworld } from '@amedia/brick-helloworld';
-const component = new BrickHelloworld();
-component.dataText = 'Programmatically set text';
-component.dataVersion = 'v2';
-document.body.appendChild(component);
-```
-## Common Patterns
-### Hybrid Server/Client Rendering
-When markup is rendered server-side with `isRendered: true`, the component will not recreate the DOM client-side but will still attach event listeners and process templates:
-```html
-<!-- Server-rendered HTML -->
-<brick-helloworld-v2 data-version="v2" data-text="Content" is-rendered>
-  <div class="hello-v2">Content
-    <div class="hello-v2">v2</div>
-  </div>
-  <!-- Child components rendered server-side -->
-</brick-helloworld-v2>
-<!-- Client-side script -->
-<script type="module" src="https://assets.acdn.no/pkg/@amedia/brick-helloworld/v2/brick-helloworld.js"></script>
-```
-### Template Processing
-The component demonstrates how to process named template slots and move content:
-```javascript
-// Component processes template[name="content"]
-// and moves it into a div wrapper
-processTemplates() {
-  const templateContent = this.querySelector('template[name="content"]');
-  if (templateContent) {
-    const range = document.createRange();
-    range.selectNodeContents(templateContent.content);
-    const contentWrapper = document.createElement('div');
-    range.surroundContents(contentWrapper);
-    this.appendChild(contentWrapper);
-    templateContent.remove();
-  }
-}
-```
-### Component Composition
-Shows integration with other Brick components:
-```html
-<brick-helloworld-v2 data-text="Form Example" data-version="v2">
-  <!-- brick-input and brick-toggle are automatically included -->
-</brick-helloworld-v2>
-```
-## Technical Details
-- **Custom Element**: `brick-helloworld-v2`
-- **Base Class**: BrickElement (from @amedia/brick-template)
-- **Dependencies**: @amedia/brick-tokens, @amedia/brick-template, @amedia/brick-input, @amedia/brick-toggle
-- **Renders as**: Custom element with internal div structure
-- **Styling**: Stitches-based styling with variant support
-- **Mirrored Props**: `data-text`, `data-version` (automatically synced between attributes and properties)
-- **Observed Attributes**: `children-rendered`
-## Important Notes
-- This is a demonstration/example component primarily for development and testing purposes
-- Not intended for production use cases - serves as a reference implementation
-- Demonstrates the complete anatomy of a Brick component including build configuration
-- Used for testing release workflows, publishing, and build processes
-- Template processing occurs after children are rendered (via `children-rendered` attribute)
-- The component automatically includes brick-input and brick-toggle as child dependencies
-- Server-side rendering requires the `/template` export path
-- CSS is automatically injected when used client-side, but must be manually included for SSR via `getCssText()`
-## Installation
-```bash
-npm install @amedia/brick-helloworld
-```
-## Version
-Current version: 2.0.2
-## Package Exports
-- **ESM (Node)**: `dist/index.mjs`
-- **CommonJS (Node)**: `dist/index.js`
-- **Browser Bundle (Eik)**: `dist/eik/brick-helloworld.js`
-- **Template (SSR)**: `template/index.mjs`