NV Elements Catalog Starters Repo System Themes About Getting Started Changelog Metrics Support Accessibility Contributions Requests Migration Deprecations Integrations Installation MCP CLI Lint Angular Bundles Extensions Go Hugo Import Maps Lit NextJS Nuxt Preact React SolidJS Svelte TypeScript Vue Foundations Typography Iconography Themes Design Tokens Size & Space Objects Interactions Support Status Color Animation Fonts Layers Custom Layout Horizontal Vertical Grid Popovers i18n Visualization View Transitions Elements Accordion Alert Avatar Badge Breadcrumb Button Button Group Card Chat Message Checkbox Color Combobox Copy Button Datagrid Integrations Column Action Column Alignment Column Fixed Column width Container Card Display Settings Footer Heatmap Keynav Multi Select Pagination Panel Detail Panel Grid Performance Placeholder Row Action Row Groups Row Sort Scroll Height Single Select Stripe Date Datetime Dialog Divider Dot Drawer Dropdown Dropdown Group Dropzone File Forms Validation Actions Control Icon Icon Button Input Input Group Logo Menu Month Notification Page Page Header Page Loader Pagination Panel Progressive Filter Chip Progress Bar Progress Ring Password Preferences Input Pulse Radio Range Resize Handle Search Select Skeleton Sort Button Sparkline Star Rating Steps Switch Tabs Tag Textarea Time Toast Toggletip Toolbar Tooltip Tree Week Patterns Authentication Browse Dashboard Editor Empty States Heatmap Keyboard Shortcut Logging Media Onboarding Panel Responsive Search Subheader Trend Code Codeblock Monaco Input Diff Input Editor Diff Editor Problems Markdown Markdown CSS Utility Labs Responsive Layout Viewport Container Patterns Forms API Design Properties & Attributes Slots Registration CustomEvents Stateless Composition Styles Packaging Glossary Logs Internal Guidelines Agent Harness Documentation Examples TypeScript Testing Unit Testing Accessibility Testing Lighthouse Testing SSR Testing Visual Testing Troubleshooting Component Creation Internal Examples All Examples
Labs projects are experimental packages available for early feedback.

Elements Lint

The @nvidia-elements/lint package is a utility library that provides Elements-specific lint rules to enforce best practices and prevent common errors when using Elements

If not yet done, install NodeJS. NodeJS is a JavaScript runtime that has a large ecosystem of tooling and packages for Web Development. Once installed the Node Package Manager (NPM) will be available for use.

ESLint

To apply the default recommended configs import elementsRecommended.

Or optionally import language specific configurations.

Severity

You can adjust rules individually for lint severity. By default all rules use error.

Rules

Rule Description Language Severity @nvidia-elements/lint/no-complex-popovers Disallow excessive DOM complexity inside popover elements. HTML error @nvidia-elements/lint/no-deprecated-attributes Disallow use of deprecated attributes in HTML. HTML error @nvidia-elements/lint/no-deprecated-css-imports Disallow use of deprecated CSS import paths. CSS error @nvidia-elements/lint/no-deprecated-css-variable Disallow use of deprecated --nve-* CSS theme variables. CSS error @nvidia-elements/lint/no-deprecated-global-attributes Disallow use of deprecated global utility attributes in HTML. HTML error @nvidia-elements/lint/no-deprecated-icon-names Disallow use of deprecated icon names. HTML error @nvidia-elements/lint/no-deprecated-packages Disallow usage of deprecated packages. JSON error @nvidia-elements/lint/no-deprecated-popover-attributes Disallow use of deprecated popover attributes. HTML error @nvidia-elements/lint/no-deprecated-slots Disallow use of deprecated slot APIs. HTML error @nvidia-elements/lint/no-deprecated-tags Disallow use of deprecated elements in HTML. HTML error @nvidia-elements/lint/no-invalid-event-listeners Disallow inline event handler attributes in HTML. HTML error @nvidia-elements/lint/no-invalid-invoker-triggers Disallow use of invoker trigger attributes on non-button nve-* elements. HTML error @nvidia-elements/lint/no-missing-control-label Require form controls to have an accessible label. HTML error @nvidia-elements/lint/no-missing-gap-space Require gap spacing on row and column layouts. HTML off @nvidia-elements/lint/no-missing-icon-name Require icon elements to have an icon name attribute. HTML error @nvidia-elements/lint/no-missing-popover-trigger Require popover elements to have a corresponding trigger element. HTML error @nvidia-elements/lint/no-missing-slotted-elements Disallow use of missing slotted elements. HTML error @nvidia-elements/lint/no-nested-container-types Require nested container components to use flat container mode. HTML error @nvidia-elements/lint/no-restricted-attributes Disallow use of invalid API attributes or utility attributes on custom HTML element tags. HTML error @nvidia-elements/lint/no-restricted-page-sizing Disallow custom height or width styles on nve-page. HTML error @nvidia-elements/lint/no-unexpected-attribute-value Disallow use of invalid attribute values for nve-* elements. HTML error @nvidia-elements/lint/no-unexpected-css-value Disallow use of invalid CSS values. CSS error @nvidia-elements/lint/no-unexpected-css-variable Disallow use of invalid CSS theme variables. CSS error @nvidia-elements/lint/no-unexpected-global-attribute-value Disallow use of invalid attribute values in HTML. HTML error @nvidia-elements/lint/no-unexpected-input-type Disallow slotted input elements with a type that does not match the parent Elements component. HTML error @nvidia-elements/lint/no-unexpected-library-dependencies Disallow incorrect dependency usage of @nve packages in consuming libraries. JSON error @nvidia-elements/lint/no-unexpected-slot-value Disallow use of invalid slot values in HTML. HTML error @nvidia-elements/lint/no-unexpected-style-customization Disallow use of style customization in Elements playground template. HTML off @nvidia-elements/lint/no-unknown-css-variable Disallow use of unknown --nve-* CSS theme variables. CSS error @nvidia-elements/lint/no-unknown-tags Disallow use of unknown nve-* tags. HTML error @nvidia-elements/lint/no-unstyled-typography Require typography elements to have nve-text styling applied. HTML error