open-index/open-npm huggingface dataset:
npm package: @novyk/sx-focus-listener
Description: ## Focus listener service for Angular
Latest version: 1.0.0-beta.1

# sx-focus-listener

## Focus listener service for Angular

Handles focus/blur from a group of elements.

If focus moves among elements in a defined group, blur event will not be fired.

Be aware that click on non-focusable elements will cause blur event (focus switch to `<body>`).


## Installation

```
$ npm i @novyk/sx-focus-listener
```
npm package: @novyk/sx-icon
Description: ## Angular SVG Icons Handler
Latest version: 1.0.0-beta.1

# sx-icon

## Angular SVG Icons Handler


## Installation

```
$ ng add @novyk/sx-icon
```


## Usage

Add icons to registry:

```typescript
constructor(
  private iconsRegistry: SxIconsRegistry,
) {}
...
this.iconsRegistry.add({name: 'star', url: '/assets/icons/star.svg'});
// or
this.iconsRegistry.add([
  {name: 'star', url: '/assets/icons/star.svg'},
  {name: 'cloud', url: '/assets/icons/cloud.svg'},
  {name: 'home', xml: '<svg ...'}
]);
```

Use in a template:
 
```html
<sx-icon name="star"></sx-icon>
```
npm package: @novyk/sx-state
Description: Simple wrapper for BehaviorSubject with Immer integration.
Latest version: 9.0.0-beta.1

# Angular state management with RxJS + Immer

Simple wrapper for BehaviorSubject with Immer integration.

StateValue automatically clones and freezes all states.

## Installation

```typescript
npm i @novyk/sx-state immer
```

## Usage

### Create `SxState`

```typescript
export class AppComponent {
  readonly data = new SxState<SomeValueInterface>(initialData);
}
```

### Get value

```typescript
this.data.value
```

### Observe value

```typescript
this.data.valueChanges
```

### Set value

```typescript
this.data.value = newData;
```

### Produce new value using Immer

Works properly only with objects and arrays in the state.

More info about Immer: https://immerjs.github.io/immer/

```typescript
this.data.produce(draft => {
  draft.entry = newEntry;
});
```

### Reset value to initial

```typescript
this.data.reset();
```

### Subscribe to another Observable

```typescript
someObervable.subscribe(this.data.observer);
```

### StateValue options

* noClone — do not clone all passed values
* noFreeze — do not freeze all passed values

```typescript
new SxState<SomeValueInterface>(initialData, {
  noClone: true,
  noFreeze: true,
});
```