@selfcommunity/react-ui
Version:
React UI Components to integrate a Community created with SelfCommunity Platform.
82 lines (73 loc) • 2.39 kB
TypeScript
import React from 'react';
import { TypographyProps } from '@mui/material';
import { WidgetProps } from '../../components/Widget';
export interface BaseItemProps extends Pick<WidgetProps, Exclude<keyof WidgetProps, 'id'>> {
/**
* Id of user object
* @default null
*/
id?: string;
/**
* Overrides or extends the styles applied to the component.
* @default null
*/
className?: string;
/**
* Image to insert into the item
* @default null
*/
image?: React.ReactNode;
/**
* If true, the children won't be wrapped by a Typography component.
* This can be useful to render an alternative Typography variant by wrapping the children (or primary) text, and optional secondary text with the Typography component.
* @default false
*/
disableTypography?: boolean;
/**
* The main content element
*/
primary?: React.ReactNode;
/**
* Props to spread to Primary Typography
* @default {component: 'span', variant: 'body1'}
*/
primaryTypographyProps?: TypographyProps;
/**
* The secondary content element.
*/
secondary?: React.ReactNode;
/**
* Props to spread to Secondary Typography
* @default {component: 'p', variant: 'body2'}
*/
secondaryTypographyProps?: TypographyProps;
/**
* The actions of the item
*/
actions?: React.ReactNode;
/**
* Any other properties
*/
[p: string]: any;
}
/**
* > API documentation for the Community-JS BaseItem component. Learn about the available props and the CSS API.
#### Import
```jsx
import {BaseItem} from '@selfcommunity/react-ui';
```
#### Component Name
The name `BaseItem` can be used when providing style overrides in the theme.
#### CSS
|Rule Name|Global class|Description|
|---|---|---|
|root|.SCBaseItem-root|Styles applied to the root element.|
|content|.SCBaseItem-content|Styles applied to the content element.|
|image|.SCBaseItem-image|Styles applied to image section.|
|text|.SCBaseItem-text|Styles applied to text section.|
|primary|.SCBaseItem-primary|Styles applied to primary section.|
|secondary|.SCBaseItem-secondary|Styles applied to secondary section.|
|actions|.SCBaseItem-actions|Styles applied to actions section.|
* @param inProps
*/
export default function BaseItem(inProps: BaseItemProps): JSX.Element;