### Вид компонента Вид компонента задается с помощью свойства `view` : ```tsx import React from 'react'; import { Note } from '@salutejs/plasma-web'; import { IconSaluteOutline } from '@salutejs/plasma-icons'; export function App() { return (
} /> } /> } /> } /> } />
); } ``` ### Размер компонента Размер компонента задается с помощью свойства `size` . Так же можно указать собственную ширину и высоту с помощью `width` и `height` соответственно. Или же задать `stretch` чтобы `Note` занял всю доступную ширину и высоту. ```tsx import React from 'react'; import { Note } from '@salutejs/plasma-web'; export function App() { return (
); } ``` ### Размерность и положение `contentBefore` Размерность и положение `contentBefore` задается с помощью свойства `contentBeforeSizing` : ```tsx import React from 'react'; import { Note } from '@salutejs/plasma-web'; import { IconSaluteOutline } from '@salutejs/plasma-icons'; export function App() { return (
} contentBeforeSizing="fixed" /> } contentBeforeSizing="scalable" />
); } ``` ### hasClose и contolled вариант Свойство `hasClose` добавляет крестик в правом верхнем углу. При нажатии сработает функция `onCloseButtonClick` ```tsx import React from 'react'; import { Note, Button } from '@salutejs/plasma-web'; import { IconSaluteOutline } from '@salutejs/plasma-icons'; export function App() { const [state, setState] = useState(true); return (
{state && ( { setState(false); }} /> )}
); } ```