list-categories

Instructions

Implementation Reference

• src/index.ts:165-182 (registration)

  Tool registration using server.tool() with name 'list-categories'. Registers the tool with empty schema object {} (no input parameters).

  // Tool 3: List all categories
  server.tool(
    "list-categories",
    "List all design system categories",
    {},
    async () => {
      const categories = Object.keys(designSystemData);
      
      return {
        content: [
          {
            type: "text",
            text: `Available design system categories: ${categories.join(", ")}`,
          },
        ],
      };
    },
  );

• src/index.ts:166-182 (handler)

  The handler function for list-categories. It reads keys from designSystemData object and returns them as a comma-separated list of available categories.

  server.tool(
    "list-categories",
    "List all design system categories",
    {},
    async () => {
      const categories = Object.keys(designSystemData);
      
      return {
        content: [
          {
            type: "text",
            text: `Available design system categories: ${categories.join(", ")}`,
          },
        ],
      };
    },
  );

• src/index.ts:168-168 (schema)

  Empty input schema object {} - this tool takes no arguments.

  "List all design system categories",

• src/design-system-data.ts:123-319 (helper)

  The designSystemData object (of type DesignSystemData) whose keys are listed by the list-categories handler. Contains categories: branding, content-style-guide, accessibility, layouts, patterns, components, and coding-guides.

  export const designSystemData: DesignSystemData = {
    branding: {
      'logo-and-favicon': {
        title: 'Logo and Favicon',
        body: 'Use the Appian logo and favicon to support branding guidelines.',
        filePath: 'docs/branding/logo-and-favicon.md'
      },
      'colors': {
        title: 'Colors',
        body: 'The following is the complete color palette with named colors and their corresponding hex codes:',
        filePath: 'docs/branding/colors.md'
      },
      'icons': {
        title: 'Icons',
        body: 'The following icons are available for use in Appian Solutions. Icons are organized by category to help you select the most appropriate icon for your use case.',
        filePath: 'docs/branding/icons.md'
      },
      'typography': {
        title: 'Typography',
        body: 'Guidance on heading styles and how to use them in your interfaces',
        filePath: 'docs/branding/typography.md'
      },
      'approach-to-ai': {
        title: 'Approach to AI',
        body: 'Guidelines for incorporating AI elements in app design',
        filePath: 'docs/branding/approach-to-ai.md'
      }
    },
    'content-style-guide': {
      'voice-and-tone': {
        title: 'Voice and Tone Principles',
        body: 'Content guidance for Appian Solution UIs',
        filePath: 'docs/content-style-guide/voice-and-tone.md'
      }
    },
    accessibility: {
      'checklist': {
        title: 'Accessibility Checklist',
        body: 'Guidance for how to make your interfaces accessible',
        filePath: 'docs/accessibility/checklist.md'
      }
    },
    layouts: {
      'dashboards': {
        title: 'Dashboards',
        body: 'Provide actionable insights from business data',
        filePath: 'docs/layouts/dashboards.md'
      },
      'empty-states': {
        title: 'Empty States',
        body: 'Used to depict when the UI has no content to display. Empty states can be used to communicate intent and action with your user. A well designed empty state makes a great first impression, guides the user so that they complete their tasks intuitively and minimizes confusion.',
        filePath: 'docs/layouts/empty-states.md'
      },
      'forms': {
        title: 'Forms',
        body: 'Facilitate user input by using the appropriate form style and input types for each scenario',
        filePath: 'docs/layouts/forms.md'
      },
      'grids': {
        title: 'Grids',
        body: 'Display tabular information in a scannable and digestible format',
        filePath: 'docs/layouts/grids.md'
      },
      'landing-pages': {
        title: 'Landing Pages',
        body: 'Personalized home pages to show the most important content and actions for users',
        filePath: 'docs/layouts/landing-pages.md'
      },
      'messaging-module': {
        title: 'Messaging Module',
        body: 'Tool used to communicate with internal users. Good for when you need to search, have multiple threads, and attach multiple attachments.',
        filePath: 'docs/layouts/messaging-module.md'
      },
      'pane-layouts': {
        title: 'Pane Layouts',
        body: 'Use `a!PaneLayout()` to display independently scrolling sections within the interface',
        filePath: 'docs/layouts/pane-layouts.md'
      },
      'record-views': {
        title: 'Record Views',
        body: 'Display information about a record in an interface',
        filePath: 'docs/layouts/record-views.md'
      }
    },
    patterns: {
      'banners': {
        title: 'Banners',
        body: 'Banners are visual elements used to display important information or messages to users',
        filePath: 'docs/patterns/banners.md'
      },
      'calendar-widget': {
        title: 'Calendar Widget',
        body: 'Calendar Widgets are used to display a calendar / scheduling interaction',
        filePath: 'docs/patterns/calendar-widget.md'
      },
      'cards-as-choices': {
        title: 'Cards as Choices',
        body: 'Cards as choices present a set of distinct options to a user in a visually engaging, easily scannable format. This pattern serves as an alternative to radio buttons or dropdowns, especially when choices benefit from descriptive text, icons, or images.',
        filePath: 'docs/patterns/cards-as-choices.md'
      },
      'charts': {
        title: 'Charts',
        body: 'Charts can be a useful tool in interfaces to get a high level view of data and the state of processes in a visual manner.',
        filePath: 'docs/patterns/charts.md'
      },
      'comment-thread': {
        title: 'Comment Thread',
        body: 'Comment threads display a chronological list of messages from different users on a single record',
        filePath: 'docs/patterns/comment-thread.md'
      },
      'document-summary': {
        title: 'Document Summary',
        body: 'Allow users to preview a document while easily scanning for relevant document details and actions',
        filePath: 'docs/patterns/document-summary.md'
      },
      'document-cards': {
        title: 'Document Cards',
        body: 'Cards that represent documents and their respective actions',
        filePath: 'docs/patterns/document-cards.md'
      },
      'inline-dialog': {
        title: 'Inline Dialog',
        body: 'Inline Dialogs are used to quickly perform an action on item in a list with at most 3 to 4 form fields. Avoid using this pattern for lists that may have a long list of fields. In those cases, use a dialog instead.',
        filePath: 'docs/patterns/inline-dialog.md'
      },
      'key-performance-indicators': {
        title: 'Key Performance Indicators',
        body: 'KPIs or Key Performance Indicators are meant to show a quick and high level snapshot of organizational performance over time or in meeting their measurable goals.',
        filePath: 'docs/patterns/key-performance-indicators.md'
      },
      'notifications': {
        title: 'Notifications',
        body: 'Notifications are used to inform users about events in a solution',
        filePath: 'docs/patterns/notifications.md'
      },
      'pick-list': {
        title: 'Pick List',
        body: 'Pick Lists are used on a form to allow users to select one or more items from a long list and additional metadata is helpful',
        filePath: 'docs/patterns/pick-list.md'
      }
    },
    components: {
      'breadcrumbs': {
        title: 'Breadcrumbs',
        body: 'Breadcrumbs display the user\'s current location within the application\'s hierarchy, allowing them to navigate back to higher-level pages.',
        filePath: 'docs/components/breadcrumbs.md'
      },
      'buttons': {
        title: 'Buttons',
        body: 'A button allows users to trigger an action, such as submitting a form, opening a dialog, or navigating to another page.',
        filePath: 'docs/components/buttons.md'
      },
      'cards': {
        title: 'Cards Guidance',
        body: 'Cards are containers used to group content together. They allow the user to view information and take actions.',
        filePath: 'docs/components/cards.md'
      },
      'confirmation-dialog': {
        title: 'Confirmation Dialog',
        body: 'Confirmation dialogs are used to present the user with a directive action to prevent adverse situations',
        filePath: 'docs/components/confirmation-dialog.md'
      },
      'milestones': {
        title: 'Milestones',
        body: 'Wizard milestones provide a guided experience to help users complete their tasks. Milestones should clearly identify each step in the process as well as the user\'s progress through those steps.',
        filePath: 'docs/components/milestones.md'
      },
      'more-less-link': {
        title: 'More / Less Link',
        body: 'More / Less Links are used to display a certain amount of text content and provide a link for the user to expand and view additional information. It prevents clutter in an interface that might be prone to long text.',
        filePath: 'docs/components/more-less-link.md'
      },
      'tabs': {
        title: 'Tabs',
        body: 'Tabs are used to navigate between alternate views within a user interface',
        filePath: 'docs/components/tabs.md'
      },
      'tags': {
        title: 'Tags',
        body: 'Tags are visual indicators used to highlight notable attributes of items and draw viewer attention to important characteristics. They provide quick, scannable context without overwhelming the interface.',
        filePath: 'docs/components/tags.md'
      },
      'selections': {
        title: 'Selections',
        body: 'Internal component for selection interfaces.',
        filePath: 'docs/components/selections.md',
        source: 'internal'
      }
    },
    'coding-guides': {
      'sail-coding-guide': {
        title: 'SAIL Coding Guide',
        body: 'Comprehensive guide for generating valid Appian SAIL interfaces using documented components and best practices.',
        filePath: 'docs/SAIL_CODING_GUIDE.md'
      }
    }
  };