open-index/open-npm huggingface dataset:
npm package: @gernii/plugin-svelte-query
Description: Svelte Query hooks generator plugin for Kubb, creating type-safe API client hooks from OpenAPI specifications for Svelte applications.
Author: stijnvanhulle
Latest version: 4.5.17

<div align="center">
  <h1>Plugin Svelte-Query</h1>
  <a href="https://kubb.dev" target="_blank" rel="noopener noreferrer">
    <img width="180" src="https://raw.githubusercontent.com/kubb-labs/kubb/main/assets/logo.png" alt="Kubb logo">
  </a>


[![npm version][npm-version-src]][npm-version-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![Coverage][coverage-src]][coverage-href]
[![License][license-src]][license-href]
[![Sponsors][sponsors-src]][sponsors-href]
<h4>
<a href="https://codesandbox.io/s/github/kubb-labs/kubb/tree/main//examples/typescript" target="_blank">View Demo</a>
<span> · </span>
<a href="https://kubb.dev/" target="_blank">Documentation</a>
<span> · </span>
<a href="https://github.com/kubb-labs/kubb/issues/" target="_blank">Report Bug</a>
<span> · </span>
<a href="https://github.com/kubb-labs/kubb/issues/" target="_blank">Request Feature</a>
</h4>
</div>

Swagger integration for React-Query to generate all the different hooks based on an OpenAPI specification.


## Supporting Kubb

Kubb uses an MIT-licensed open source project with its ongoing development made possible entirely by the support of Sponsors. If you would like to become a sponsor, please consider:

- [Become a Sponsor on GitHub](https://github.com/sponsors/stijnvanhulle)

<p align="center">
  <a href="https://github.com/sponsors/stijnvanhulle">
    <img src="https://raw.githubusercontent.com/stijnvanhulle/sponsors/main/sponsors.svg" alt="My sponsors" />
  </a>
</p>


<!-- Badges -->

[npm-version-src]: https://img.shields.io/npm/v/@kubb/plugin-svelte-query?flat&colorA=18181B&colorB=f58517
[npm-version-href]: https://npmjs.com/package/@kubb/plugin-svelte-query
[npm-downloads-src]: https://img.shields.io/npm/dm/@kubb/plugin-svelte-query?flat&colorA=18181B&colorB=f58517
[npm-downloads-href]: https://npmjs.com/package/@kubb/plugin-svelte-query
[license-src]: https://img.shields.io/github/license/kubb-labs/kubb.svg?flat&colorA=18181B&colorB=f58517
[license-href]: https://github.com/kubb-labs/kubb/blob/main/LICENSE
[build-src]: https://img.shields.io/github/actions/workflow/status/kubb-labs/kubb/ci.yaml?style=flat&colorA=18181B&colorB=f58517
[build-href]: https://www.npmjs.com/package/@kubb/plugin-svelte-query
[minified-src]: https://img.shields.io/bundlephobia/min/@kubb/plugin-svelte-query?style=flat&colorA=18181B&colorB=f58517
[minified-href]: https://www.npmjs.com/package/@kubb/plugin-svelte-query
[coverage-src]: https://img.shields.io/codecov/c/github/kubb-labs/kubb?style=flat&colorA=18181B&colorB=f58517
[coverage-href]: https://www.npmjs.com/package/@kubb/plugin-svelte-query
[sponsors-src]: https://img.shields.io/github/sponsors/stijnvanhulle?style=flat&colorA=18181B&colorB=f58517
[sponsors-href]: https://github.com/sponsors/stijnvanhulle/
npm package: @gernotpokorny/use-awaitable-component
Description: React hook for awaiting component callback.
Author: Gernot Pokorny
Latest version: 1.0.2



# @gernotpokorny/use-awaitable-component

React hook for awaiting component callback.

## Installation

**npm**
```
npm install @gernotpokorny/use-awaitable-component
```

## Usage

```jsx
import { useState } from "react";
import useAwaitableComponent from "@gernotpokorny/use-awaitable-component";
import "./styles.css";

function Modal({ visible, onSubmit, onCancel }) {
  const [text, setText] = useState("");
  const display = visible ? "block" : "none";

  const handleSubmit = () => {
    onSubmit(text);
    setText("");
  };

  const handleCancel = () => {
    onCancel(":)");
  };

  return (
    <div className="modal" style={{ display }}>
      <div className="modal-head">This is a modal</div>
      <div className="modal-body">
        <input
          placeholder="Type something here..."
          value={text}
          onChange={(e) => setText(e.target.value)}
        />
        <button onClick={handleSubmit}>Submit</button>
      </div>
      <button className="modal-close" onClick={handleCancel}>
        X
      </button>
    </div>
  );
}

export default function App() {
  const [status, execute, resolve, reject, reset] = useAwaitableComponent();
  const showModal = status === "awaiting";

  const handleAwaitModal = async () => {
    try {
      const value = await execute();
      alert(`VALUE: ${value}`);
    } catch (err) {
      alert(`Canceled: ${err}`);
    } finally {
      reset();
    }
  };
  return (
    <div className="App">
      <div className="button-container">
        <button disabled={showModal} onClick={handleAwaitModal}>
          {showModal ? "Waiting..." : "Show Modal"}
        </button>
      </div>
      <Modal visible={showModal} onSubmit={resolve} onCancel={reject} />
    </div>
  );
}
```

## Reference
```jsx
const [status, execute, resolve, reject, reset] = useAwaitableComponent<T>();
```
| Field | Type | Descriptions |
|--|--|--|
| `status` | `'idle' \| 'awaiting' \| 'resolved' \| 'rejected'` | Current awaitable component status |
| `execute` | `() => Promise<T>` | A function to start execution |
| `resolve` | `(val?: T) => void` | A callback to call after component completed without error |
| `reject` | `(err?: any) => void` | A callback to call after component completed with error |
| `reset` | `() => void` | A function to reset status back to `idle`. This function must be called before calling `execute()` again. |
npm package: @gernsdorfer/async-component-loader
Description: > A small Angular Library to load standalone components asynchronously
Author: Lars Wiedemann
Latest version: 1.0.0

# Async Component Loader

> A small Angular Library to load standalone components asynchronously

[![Test, Lint, Build](https://github.com/gernsdorfer/async-component-loader/actions/workflows/ci.yml/badge.svg)]()
[![Publish to NPM](https://github.com/gernsdorfer/async-component-loader/actions/workflows/npm-publish.yml/badge.svg)](https://github.com/gernsdorfer/async-component-loader/actions/workflows/npm-publish.yml)
[![styled with](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
[![PRs](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)]()
[![coverage](https://img.shields.io/badge/coverage-100%25-brightgreen.svg)]()
[![async-component-loader](https://img.shields.io/endpoint?url=https://dashboard.cypress.io/badge/simple/v5fbpd/master&style=flat&logo=cypress)](https://dashboard.cypress.io/projects/v5fbpd/runs)


<hr />

- 👩‍💻 checkout the [sample app](https://github.com/gernsdorfer/async-component-loader/blob/master/apps/sample-app/)

## UI Demo

[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/gernsdorfer/async-component-loader/tree/master/apps/stackblitz-ui)

## Install

### Yarn

```bash
yarn add @gernsdorfer/async-component-loader
```

### NPM

```bash
npm install @gernsdorfer/async-component-loader
```

## Usage

1. import the `AsyncComponentLoaderComponent` into your module or component

```ts
import {AsyncComponentLoaderComponent, LazyComponentCreator} from "@gernsdorfer/async-component-loader";

@NgModule({
  // ...
  imports: [AsyncComponentLoaderComponent],
  // ...
})
```

```ts
@Component({
  selector: 'my-component',
  template: `
   <async-component-loader 
                  [lazyComponentCreator]="counterComponent"
                  [inputs]="{counter}">
    <ng-container isLoading>Loading</ng-container>
  </async-component-loader>
  `,
})
class MyComponent {
  counter = 0;
  counterComponent = new LazyComponentCreator<CounterComponent>({
      component: async () => (await import('./components/counter/counter.component')).CounterComponent,
      outputs: {
        increment: (newCount = 0) => this.counter = newCount
      }
    }
  )
}
```

That's it 🥳
npm package: @gerodrig/kg-lb_converter
Description: module to convert kilograms to pounds
Author: Gerardo Rodriguez
Latest version: 0.1.0

# Module to convert kilograms to pounds

This module was created to calculate the equivalence between kilograms and pounds. This practice was ,ade to follow up the course [Fundamentos de Javascript](https://platzi.com/clases/fundamentos-javascript-2017/) in [Platzi](https://platzi.com).

## Module overview

just input the measure and kg and the module will calculate its equivalency in pounds

## Installation

```
npm install kg-lb_converter
```

#Usage

```
import kg-lb from kg-lb_converter

kgConverter(1) // 2.20462
lbConverter(1) // 0.453592 
```

#Credits

- [Gerardo Rodriguez](https://twitter.com/oprah18?lang=es)

#License

[MIT](https://opensource.org/licenses/MIT)