@synerise/ds-subject NPM

id: subject

title: Subject

Subject UI Component

Installation

npm i @synerise/ds-subject
or
yarn add @synerise/ds-subject

Usage

import Subject from '@synerise/ds-subject'

<Subject
    texts={{
        noResults: 'No results',
        searchPlaceholder: 'Search'
    }}
    onSelectItem={(item) => {}
    onShowPreview={() => {}}
    type='event'
    placeholder='Choose event'
    iconPlaceholder={<VarTypeStringM />}
    selectedItem={undefined}
    items={[
        {
          id: 1,
          name: `Attribute 1`,
          icon: <NotificationsM />,
        },
        {
          id: 2,
          name: `Attribute 2`,
          icon: <NotificationsM />,
        }
    ]}
  />

Demo

API

| --------- | ------ | ------ | ----- | | getPopupContainerOverride | Popup container function for child tooltips and dropdowns | (trigger: HTMLElement | null) => HTMLElement; | - | | iconPlaceholder | Icon for empty selected item | React.ReactNode | - | | items | Array of available subjects | SubjectItem[] | [] | | onActivate | Callback called when user opens dropdown | (fieldType: string) => void | - | | onDeactivate | Callback called when user closes dropdown | () => void | - | | onSelectItem | Callback called when user select new subject | ( SubjectItem) => void; | - | | onShowPreview | Callback called when user clicks on Show Preview button | () => void \ undefined | - | | placeholder | Placeholder for empty selected item | string \ React.ReactNode; | - | | Property | Description | Type | Default | | selectedItem? | Selected item | SubjectItem \ undefined; | undefined | | texts | Object with translations | TEXTS | - | | type? | Type of subject parameter \ context \ event | SubjectType | parameter |

SubjectItem

Property	Description	Type	Default
icon	Icon of subject item	React.ReactNode	-
id	Id of subject item	React.ReactText	-
name	Name of subject item	string	-

TEXTS

Property	Description	Type	Default
noResults	No results info	string	-
searchPlaceholder	Search box placeholder	string	-

@synerise/ds-button @synerise/ds-dropdown @synerise/ds-icon @synerise/ds-list-item @synerise/ds-result @synerise/ds-scrollbar @synerise/ds-utils uuid

@infinitebrahmanuniverse/nolb-_syn @everything-registry/sub-chunk-890 @zalastax/nolb-_syn @synerise/ds-condition @synerise/design-system

7 months ago

7 months ago

7 months ago

5 months ago

6 months ago

6 months ago

6 months ago

7 months ago

7 months ago

7 months ago

8 months ago

5 months ago

5 months ago

4 months ago

5 months ago

5 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

9 months ago

9 months ago

9 months ago

9 months ago

10 months ago

11 months ago

11 months ago

11 months ago

11 months ago

12 months ago

12 months ago

11 months ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago