Skip to main content
Glama

list_flux_components

Retrieve all available Flux UI components to access documentation and examples for the design system.

Instructions

Get a list of all available Flux UI components

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault

No arguments

Implementation Reference

  • src/index.ts:101-109 (registration)
    Registration of the list_flux_components tool, including its description and empty input schema (no parameters required).
    { name: "list_flux_components", description: "Get a list of all available Flux UI components", inputSchema: { type: "object", properties: {}, required: [], }, },
  • src/index.ts:157-158 (registration)
    Dispatch case in CallToolRequestSchema handler that routes to the tool's implementation method.
    case "list_flux_components": return await this.handleListComponents();
  • Core implementation of the list_flux_components tool. Fetches the Flux UI components page, scrapes anchor links starting with /components/, extracts component names from URLs, caches the list, and returns an array of {name, url} objects.
    private async handleListComponents() { try { if (!this.componentsListCache) { // Fetch the main components page or sidebar structure // This needs inspection of fluxui.dev to find the component list reliably // Let's assume we fetch the base URL and look for links starting with /components/ const response = await this.axiosInstance.get(`${this.FLUX_DOCS_URL}/components`); const $ = cheerio.load(response.data); const components: ComponentInfo[] = []; const componentUrls = new Set<string>(); // Avoid duplicates // Look for links within the navigation or main content area // Adjust selector based on actual site structure $('a[href^="/components/"]').each((_, element) => { const link = $(element); const url = link.attr("href"); if (url && url !== "/components" && !componentUrls.has(url)) { // Basic check to avoid the parent page // Extract name from URL const parts = url.split("/").filter(part => part); // filter removes empty strings const name = parts[parts.length - 1]; if (name && !name.includes('#')) { // Basic check for valid component name componentUrls.add(url); components.push({ name, description: "", // Will be populated when fetching details url: `${this.FLUX_DOCS_URL}${url}`, }); } } }); // Sort components alphabetically by name components.sort((a, b) => a.name.localeCompare(b.name)); this.componentsListCache = components; } return this.createSuccessResponse( this.componentsListCache.map(c => ({ name: c.name, url: c.url })) // Return only name and URL for list ); } catch (error) { this.handleAxiosError(error, "Failed to fetch Flux UI components list"); } }

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/iannuttall/flux-ui-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server