Import Component

All available components are exposed in @sandlada/mdc/all.js.

import "@sandlada/mdc/all.js"

Please note that you must import the component body via import ”…” because the component body code contains the side effects of registering the component:

Example

The following code shows how to import components through import ”…” (These imports must occur on the Client Side, not the Server Side)

import "@sandlada/mdc/build/components/ripple/ripple.js"
import "@sandlada/mdc/build/components/focus-ring/focus-ring.js"
import "@sandlada/mdc/build/components/elevation/elevation.js"
import "@sandlada/mdc/build/components/icon/icon.js"
import "@sandlada/mdc/build/components/button/filled-tonal-button.js"
import "@sandlada/mdc/build/components/button/outlined-button.js"
// ...