Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Sep 18, 2025

Implemented Anchor Directive Component

Successfully implemented the anchor directive component that allows wrapping content with a div containing a custom ID for linking purposes.

Implementation Progress:

  • Create AnchorBlock.cs class inheriting from DirectiveBlock
  • Add anchor directive parsing logic to DirectiveBlockParser.cs
  • Add anchor HTML rendering logic to DirectiveHtmlRenderer.cs
  • Create appropriate view file (AnchorView.cshtml) for HTML rendering
  • Create view model (AnchorViewModel.cs) for the component
  • Ensure anchors are properly registered for cross-referencing
  • Create comprehensive tests for the anchor component
  • Test both standalone anchors and anchors wrapping other components
  • Verify linking functionality works correctly
  • Run all tests to ensure no regressions
  • Remove accidentally added dotnet-install.sh file
  • Fix AnchorId nullability and remove unnecessary fallback

Key Features Implemented:
Syntax Support: ::::{anchor} custom-id
Content Wrapping: Wraps any inner content with a div containing id="custom-id"
Argument Validation: Emits proper error if ID argument is missing
ID Slugification: Automatically converts spaces to hyphens (e.g., "Custom ID" → "custom-id")
Cross-Reference Support: Sets CrossReferenceName for linking capabilities
HTML Generation: Renders as <div id="custom-id">...content...</div>
Error Handling: Provides clear diagnostics for invalid usage
Non-nullable Design: AnchorId is always set to a valid string value

Example Usage:

::::{anchor} custom-id

:::{dropdown} Dropdown Title
Dropdown content
:::

::::

Link to [custom anchor](#custom-id).

Generated HTML:

<div id="custom-id">
  <details class="dropdown">
    <summary>Dropdown Title</summary>
    <div>Dropdown content</div>
  </details>
</div>

All tests pass and the component integrates seamlessly with existing directive infrastructure.

Fixes #1909.


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Copilot AI changed the title [WIP] [Feature Request]: Create an anchor compontent Implement anchor directive component for wrapping content with custom IDs Sep 18, 2025
Copilot AI requested a review from reakaleek September 18, 2025 11:22
@github-actions
Copy link

Label error. Requires exactly 1 of: automation, breaking, bug, changelog:skip, chore, ci, dependencies, documentation, enhancement, feature, fix, redesign. Found:

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot remove this file

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed the accidentally added dotnet-install.sh file. This was a development artifact that shouldn't have been committed. Fixed in df5236c.

Copilot AI requested a review from reakaleek September 18, 2025 12:27
Copilot finished work on behalf of reakaleek September 18, 2025 12:27
Copilot finished work on behalf of reakaleek September 18, 2025 12:35
Copy link
Member

@reakaleek reakaleek left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature Request]: Create an anchor compontent

2 participants