open-index/open-npm huggingface dataset:
npm package: @nguyentc21/event-listener
Description: A simple Event Listener for JavaScript projects
Author: Nguyen Tc
Latest version: 1.0.3

# @nguyentc21/event-listener

A simple Event Listener for JavaScript projects

## Installation

```sh
yarn add @nguyentc21/event-listener
```

## Usage

| Method                   | Return                                                 | description                     |
|--------------------------|--------------------------------------------------------|---------------------------------|
| addListener on           | EventId \| undefined                                   | return undefined means error    |
| removeListener rm        | boolean                                                | true on success otherwise false |
| removeAllListeners rmAll | undefined                                              |                                 |
| emitListener emit        | any                                                    |                                 |
| getListenerList          | ({ id: EventId, description?: string } \| undefined)[] |                                 |                                    |

```tsx
import EventListener from '@nguyentc21/event-listener';

type EventDataType = {
  'open-modal': ModalDataType;
  'open-toast': undefined;
  /// ...
};
const MyEventListener = new EventListener<EventDataType>('MY-LISTENERS');
export default MyEventListener;
```

```tsx
// ...
import MyEventListener from '../MyEventListener';
// ...

const MyToast = (props: Props) => {
  // ...
  useEffect(() => {
    // Add event listener "open-toast"
    MyEventListener.on('open-toast', (data) => {
      // ... Do "open-toast" action
    });
    () => {
      // Remove event listener "open-toast"
      MyEventListener.rm('open-toast');
    };
  }, []);
};
// ...

// ...
const OtherView = (props: Props) => {
  // ...
  const _openToast = () => {
    MyEventListener.emit('open-toast', 'Hello');
  };
};
// ...
```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---
npm package: @nguyentc21/react-native-indicators
Description: description for the package
Author: Nguyen Tc
Latest version: 0.1.2

# react-native-indicators

![](https://raw.githubusercontent.com/nguyentc21/react-native-indicators/master/assets/react_native_indicators_exp.gif)

This library serves as an alternative to [react-native-indicators](https://www.npmjs.com/package/react-native-indicators), offering a modernized codebase, improved TypeScript integrations, and additional configuration options.
It was originally inspired by the design and features of the original package.

## Installation

```sh
npm install react-native-indicators
```

### Dependencies
- [react-native-reanimated v3.x](https://docs.swmansion.com/react-native-reanimated/)

## Usage

```js
import {
  ActivityIndicator,
  AsteriskIndicator,
  BallIndicator,
  BarIndicator,
  BullEyeIndicator,
  DotIndicator,
  PulseIndicator,
  WaveIndicator
} from 'react-native-indicators';
import {
  SpinnerContainer,
  ImageColorLooper,
  ViewColorLooper,
  // ColorLooperIndicator,
  // Indicator,
} from 'react-native-indicators';
```
[See example code](https://github.com/nguyentc21/react-native-indicators/blob/master/example/index.tsx)

## Contributing

- [Development workflow](CONTRIBUTING.md#development-workflow)
- [Sending a pull request](CONTRIBUTING.md#sending-a-pull-request)
- [Code of conduct](CODE_OF_CONDUCT.md)

## License

MIT

---

Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
npm package: @nguyentc21/react-native-modal-view
Description: React native Modal view
Author: Nguyen Tc
Latest version: 2.0.5

# @nguyentc21/react-native-modal-view

React native Modal view

## Installation

```sh
yarn add @nguyentc21/react-native-modal-view
```

## Usage

```tsx
import ModalSection from '@nguyentc21/react-native-modal-view';
// ...
const App = () => {
  return (
    // ...

    <ModalSection // should be on bottom
      enable
      // safeAreaInsets={safeAreaInsets}
      // keyboardHeight={keyboardHeight}
      // defaultModalProps={{
      //   blurToClose: true,
      //   styles: {
      //     backgroundColor: '#eeeeee',
      //     borderRadius: 0,
      //     borderTopLeftRadius: 0,
      //     borderTopRightRadius: 0,
      //   },
      //   contentContainerStyle: {
      //     padding: 20,
      //   },
      // }}
    />
  );
};
// ...
```

```tsx
// ...
import { NestedModal } from '@nguyentc21/react-native-modal-view';

const ModalContent = () => {
  const [countState, setCountState] = useState(0);
  return (
    <>
      <Text>count: {countState}</Text>
      <View>
        <Pressable
          onPress={() => {
            setCountState((_c) => _c + 1);
          }}>
          count + 1
        </Pressable>
      </View>
    </>
  );
};
const NiceView = (props: Props) => {
  const [nestedModalVisible, setNestedModalVisible] = useState(false);
  // ...
  return (
    // ...
    <NestedModal
      visible={nestedModalVisible}
      close={() => setNestedModalVisible(false)}>
      <ModalContent />
    </NestedModal>
  );
};
```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---

Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
npm package: @nguyentc21/react-native-tooltip
Description: Simple tooltip for React native app
Author: Nguyen Tc
Latest version: 2.0.6

# @nguyentc21/react-native-tooltip

Simple tooltip for React native app

## Installation

```sh
yarn add @nguyentc21/react-native-tooltip
```

This Tooltip is built on [@nguyentc21/react-native-modal-view](https://github.com/nguyentc21/react-native-modal-view). So you must install it first.

```sh
yarn add @nguyentc21/react-native-modal-view
```

## Usage

```tsx
import ModalSection from '@nguyentc21/react-native-modal-view';
// ...
const App = () => {
  return (
    // ...
    <ModalSection // should be on bottom
      enable
    />
  );
};
// ...
```

```tsx
import Tooltip from '@nguyentc21/react-native-tooltip';
// ...
export function NiceView(props: Props) {
  // ...
  return (
    // ...
    <Tooltip
      placement="bottom"
      content={
        <Text
          style={[styles.text, { color: colors.RED40, textAlign: 'center' }]}
        >
          Tooltip content.
        </Text>
      }
    >
      <Text>Press me to see the tooltip!</Text>
    </Tooltip>
  );
}
// ...
```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---

Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
npm package: @nguyenthang9720/mobile-sic-sdk
Description: mobilesdk to sign csr
Author: bnnsoftvn
Latest version: 3.1.5

# @bnnsoftvn/mobilesdk

# B1 Tạo mới một Project React Native

`$ npx react-native init MyApp`

`$ cd MyApp`

`$ npm i @bnnsoftvn/mobile-sic-sdk`

`$ npm i @bnnsoftvn/react-native-biometrics-sic`

`$ npm i react-native-device-info`


# B2 example code

```js
import { GenerateSad_V2 } from '@bnnsoftvn/mobile-sic-sdk';
import DeviceInfo from 'react-native-device-info';
import React, { useState } from 'react';
import { TouchableOpacity, Text, View, StyleSheet, ActivityIndicator } from 'react-native';

const App = () => {
  const [loading, setLoading] = useState(false);

  // Async function to fetch data
  const handlePress = async () => {
    setLoading(true);
    try {
      var uniqueId = DeviceInfo.getUniqueId();
        var json = {
            "userid": "122280280231231",
            "deviceid": uniqueId,
            "format": 1,
            "sad": "eyJ0cmFuc2FjdGlvbl9pZCI6ImQ3YWUxM2FiLTVhNDQtNGUxMS1hOGZjLWEzOGZjODgxZThmNCIsIm9yaWdpbmF0b3JfaWQiOiJOZ3V54buFbiBWxINuIFRlc3QiLCJ1c2VyX2lkIjoiUElEWTlKVlhKT0hYN04iLCJjZXJ0aWZpY2F0ZV9pZCI6Ijg3NTkwQjI1NTkyNjQxNjIyQkQ2RTQ0ODgxNjEzNDY2MkQxNzZBRCIsInNhbHQiOiJiMjk3N2ZhMy1hZWUzLTQyZDYtYmE2Zi02OTQ2ZmZmZTFiNzMiLCJkZXZpY2VfaWQiOiJkNWs5MmJYdlFoZXVuWFhEcUdtSG44OkFQQTkxYkc1SDFLbjg3Z293TnM1U0RGSDRrc0ZQWXBUbjBjZ1U2WmgtdERBdFdnOHdPdmhnX3RBZ3N0X1RlRmNxa3NxWXc5WXFXekg5WmdoV3drQ2dodmpTaWx3YnE5a1lKWVFjY1VBYkJrZDlGaE9IejdrQzJvIiwibnVtYmVyX3NpZ25hdHVyZXMiOjEsImRvY3VtZW50cyI6W1tbW11dLFtbXV1dXSwidmFsaWRpdHlfcGVyaW9kIjp7InZhbGlkX2Zyb20iOltdLCJ2YWxpZF90byI6W119fQ"
          }
          console.log(GenerateSad_V2);
          var sig = await GenerateSad_V2(json);
          console.log(sig);
    } catch (error) {
      console.log('Error fetching data');
    }
    setLoading(false);
  };

  return (
    <View style={styles.container}>
      <TouchableOpacity style={styles.button} onPress={handlePress} disabled={loading}>
        {loading ? <ActivityIndicator color="#fff" /> : <Text style={styles.buttonText}>Fetch Data</Text>}
      </TouchableOpacity>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  button: {
    backgroundColor: '#007BFF',
    paddingVertical: 12,
    paddingHorizontal: 20,
    borderRadius: 8,
  },
  buttonText: {
    color: '#fff',
    fontSize: 16,
  },
});

export default App;

```
# B3 Start App

`$ npx react-native start`
npm package: @nguyenthang9720/react-native-biometrics-sic
Description: React Native biometric functionality for signing and encryption
Author: Ngô Tuấn Tài
Latest version: 3.0.21


# react-native-biometrics-sic

React native biometrics is a simple bridge to native iOS and Android keystore management.  It allows you to create public private key pairs that are stored in native keystores and protected by biometric authentication.  Those keys can then be retrieved later, after proper authentication, and used to create a cryptographic signature.