open-index/open-npm huggingface dataset:
npm package: @odigos/ui-components
Description: This library contains re-usable components for various Odigos UI deployments, and a library ([ui-containers](https://github.com/odigos-io/ui-containers)).
Author: Odigos
Latest version: 0.0.93
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# Odigos UI Components

This library contains re-usable components for various Odigos UI deployments, and a library ([ui-containers](https://github.com/odigos-io/ui-containers)).

## Installation

Using **npm**:

```shell
npm i @odigos/ui-components
```

Using **yarn**:

```shell
yarn add @odigos/ui-components
```

## Usage

Wrap your app with the theme provider from [@odigos/ui-theme](https://github.com/odigos-io/ui-theme):

```tsx
import Theme from '@odigos/ui-theme'

const AppProviders = () => {
  return (
    <Theme.Provider>
      <App />
    </Theme.Provider>
  )
}
```

Import a component, and call it with it's props:

```tsx
import { Button } from '@odigos/ui-components'
import { PlusIcon } from '@odigos/ui-icons'

const App = () => {
  const handleClick = () => {
    console.log('clicked')
  }

  return (
    <Button onClick={handleClick}>
      <PlusIcon size={20} />
      Add New...
    </Button>
  )
}
```
npm package: @odigos/ui-containers
Description: This library is not re-usable, these "containers" are considered complex components that contain logic, they designed to re-use across multiple deployments of the same Odigos UI (e.g. cluster, cloud, etc.)
Author: Odigos
Latest version: 0.0.82
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# Odigos UI Containers

This library is not re-usable, these "containers" are considered complex components that contain logic, they designed to re-use across multiple deployments of the same Odigos UI (e.g. cluster, cloud, etc.)

## Installation

Using **npm**:

```shell
npm i @odigos/ui-containers
```

Using **yarn**:

```shell
yarn add @odigos/ui-containers
```

## Usage

Wrap your app with the theme provider from [@odigos/ui-theme](https://github.com/odigos-io/ui-theme):

```tsx
import Theme from '@odigos/ui-theme'

const AppProviders = () => {
  return (
    <Theme.Provider>
      <App />
    </Theme.Provider>
  )
}
```

Import a container, and call it with it's props:

```tsx
import { useEffect } from 'react'
import { NOTIFICATION_TYPE } from '@odigos/ui-utils'
import { ToastList, useNotificationStore } from '@odigos/ui-containers'

const App = () => {
  const { addNotification } = useNotificationStore()

  useEffect(() => {
    addNotification({
      type: NOTIFICATION_TYPE.SUCCESS,
      title: 'Mounted',
      message: 'App mounted successfully',
    })
  }, [])

  return <ToastList />
}
```
npm package: @odigos/ui-icons
Description: This library contains the SVG icons for some Odigos UI libraries ([ui-components](https://github.com/odigos-io/ui-components), [ui-containers](https://github.com/odigos-io/ui-containers)).
Author: Odigos
Latest version: 0.0.14
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# Odigos UI Icons

This library contains the SVG icons for some Odigos UI libraries ([ui-components](https://github.com/odigos-io/ui-components), [ui-containers](https://github.com/odigos-io/ui-containers)).

## Installation

Using **npm**:

```shell
npm i @odigos/ui-icons
```

Using **yarn**:

```shell
yarn add @odigos/ui-icons
```

## Usage

Wrap your app with the theme provider from [@odigos/ui-theme](https://github.com/odigos-io/ui-theme):

```tsx
import Theme from '@odigos/ui-theme'

const AppProviders = () => {
  return (
    <Theme.Provider>
      <App />
    </Theme.Provider>
  )
}
```

Import an icon, and call it with it's props:

```tsx
import { OdigosLogo } from '@odigos/ui-icons'

const App = () => {
  return <OdigosLogo size={100} fill='#F5F5F5' />
}
```