Работа с Next

Раздел описывает варианты и нюансы подключения библиотеки в рамках работы с NextJs.

RSC - React Server Components (App router)

Библиотека поддерживает работу с RSC только при явном использовании директивы 'use client'.

'use client'

import { Button } from '@salutejs/plasma-homeds';

...

Подключение тем

Ниже представлены различные способы подключения темы в проект:

Styled Components

info

Прежде всего убедитесь, что у вас правильно настроена работа со Styled Components.

Для справки: официальный пример работающей реализации.

import type { AppProps } from "next/app";
import { plasma_homeds__light } from '@salutejs/plasma-themes';
import { createGlobalStyle } from "styled-components";

const PlasmaTheme = createGlobalStyle(plasma_homeds__light);

export default function App({ Component, pageProps }: AppProps) {
  return (
      <>
        <PlasmaTheme />

        <Component {...pageProps} />
      </>
  );
}

Работа с компонентами

Библиотека поставляет компоненты в формате Styled Components.

Пример со Styled Components

import React from 'react';
import { Button } from '@salutejs/plasma-homeds'

export default function Home() {
  return (
    <div>
        <Button>Button</Button>
    </div>
  );
}