open-index/open-npm huggingface dataset:
npm package: @reffuse/extension-lazyref
Description: Extension to integrate `@typed/lazy-ref` with Reffuse.
Latest version: 0.1.4

# LazyRef extension for Reffuse

Extension to integrate `@typed/lazy-ref` with Reffuse.

## Peer dependencies
- `@typed/lazy-ref`
- `reffuse` 0.1.3+
- `effect` 3.13+
- `react` & `@types/react` 19+
npm package: @reffuse/extension-query
Description: TanStack Query style hooks for Reffuse.
Latest version: 0.1.5

# Reffuse Query

TanStack Query style hooks for Reffuse.

## Peer dependencies
- `reffuse` 0.1.3+
- `effect` 3.13+
- `@effect/platform` & `@effect/platform-browser`
- `react` & `@types/react` 19+
- `@typed/async-data`
npm package: @refina/repl
Description: Refina REPL as a Vue 3 component
Author: Evan You
Latest version: 0.0.9

# @refina/repl

Refina REPL as a Vue 3 component.

**This is a fork of [vue-repl](https://github.com/vuejs/repl)**

Most of the Vue features are preserved to make it easy to merge upstream changes.

Please refer to the [original README](https://github.com/vuejs/repl/blob/main/README.md) for more information.
npm package: @refinedev/altogic
Description: refine Altogic data provider. refine is a React-based framework for building internal tools, rapidly. It ships with Ant Design System, an enterprise-level UI toolkit.
Author: refine
Latest version: 4.1.5

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img src="https://refine.ams3.cdn.digitaloceanspaces.com/refine_logo.png"  align="center" />
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**. 

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About 

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

  refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

For more detailed information and usage, refer to the [refine data provider documentation](https://refine.dev/docs/core/providers/data-provider).

## Install

```
npm install @refinedev/altogic
```
npm package: @refinedev/cli
Description: Refine CLI tool, streamlining the development of Refine applications.
Author: refine
Latest version: 2.16.52

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[Refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Install

```
npm install @refinedev/cli
```
npm package: @refinedev/cloud
Description: refine cloud
Author: refine
Latest version: 9.1.0

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img src="https://refine.ams3.cdn.digitaloceanspaces.com/refine_logo.png"  align="center" />
    </a>
</div>
<br/>
<div align="center"><strong>refine</strong> is a <a href="https://reactjs.org/">React</a>-based framework for building internal tools, rapidly. ✨ It ships with <a href="https://ant.design/">Ant Design System</a>, an enterprise-level UI toolkit.</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>
npm package: @refinedev/codemod
Description: Codemod scripts for Refine, automating code transformations and migrations.
Author: refine
Latest version: 4.4.3

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub><br />
  <sub>CLI is forked from <a href="https://github.com/vercel/next.js/tree/canary/packages/next-codemod">next-codemod</a></sub>
</div>

## About Refine

[**refine**](https://refine.dev/) offers lots of out-of-the box functionality for rapid development, without compromising extreme customizability. Use-cases include, but are not limited to _admin panels_, _B2B applications_ and _dashboards_.

## About This Tool

This is a code migration tool for refine to handle breaking changes that emerge between major versions. It makes it seamless to upgrade your project between breaking changes. It parses your project's code and transforms it automatically so you don't have to.

## How to use

To see available options, run:

```sh
npx @refinedev/codemod --help
```

## General usage

In terminal, get inside your project root folder with `cd` and initialize `refine-codemod`:

```sh
npx @refinedev/codemod
```
npm package: @refinedev/connect
Description: refine connect
Author: refine
Latest version: 1.0.4

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img src="https://refine.ams3.cdn.digitaloceanspaces.com/refine_logo.png"  align="center" />
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**. 

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>
npm package: @refinedev/devtools
Description: refine devtools offers a set of features from monitoring to quickly prototyping a UI.
Author: refine
Latest version: 2.0.5

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>

---

![refine devtools](https://github.com/refinedev/refine/assets/1110414/15ed6907-d0c8-4213-9024-2f6b0a09968f)

We're releasing refine devtools in beta. refine devtools is designed to help you debug and develop your refine apps. It will be a collection of features including monitoring queries and mutations, testing out inferencer generated codes, adding and updating refine packages from the UI and more. 🤯

## Usage

Install latest version of `@refinedev/cli`:

```bash
npm install @refinedev/cli@latest
```

Install `@refinedev/devtools` with `@refinedev/cli`

```bash
npm run refine devtools init
```

> 🚨 If you don't have `@refinedev/cli` installed already, you can follow the [installation guide](https://refine.dev/docs/packages/cli/#how-to-add-to-an-existing-project) to add it to your project.

![devtools-install](https://github.com/refinedev/refine/assets/23058882/7d7341cc-1edd-4cf3-b330-1796c6a8afc5)

Ta-da! 🎉 Everything is ready now, you can use the refine devtools in your project! 🕶

> Devtools only works in development mode and have no overhead on production builds. You don't need to do anything special to exclude DevTools from your bundle.
npm package: @refinedev/devtools-internal
Description: refine devtools offers a set of features from monitoring to quickly prototyping a UI.
Author: refine
Latest version: 2.0.2

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

This package is an internal package and a part of the `@refinedev/devtools` package.

For more detailed information an usage, refer to the [refine devtools documentation](https://refine.dev/docs/packages/devtools)

## Install

```
npm install @refinedev/devtools
```
npm package: @refinedev/devtools-server
Description: refine devtools offers a set of features from monitoring to quickly prototyping a UI.
Author: refine
Latest version: 2.0.2

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

This package is an internal package and a part of the `@refinedev/devtools` package.

For more detailed information an usage, refer to the [refine devtools documentation](https://refine.dev/docs/packages/devtools)

## Install

```
npm install @refinedev/devtools
```
npm package: @refinedev/devtools-shared
Description: refine devtools offers a set of features from monitoring to quickly prototyping a UI.
Author: refine
Latest version: 2.0.2

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

This package is an internal package and a part of the `@refinedev/devtools` package.

For more detailed information an usage, refer to the [refine devtools documentation](https://refine.dev/docs/packages/devtools)

## Install

```
npm install @refinedev/devtools
```
npm package: @refinedev/devtools-ui
Description: refine devtools offers a set of features from monitoring to quickly prototyping a UI.
Author: refine
Latest version: 2.0.3

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

Refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

This package is an internal package and a part of the `@refinedev/devtools` package.

For more detailed information an usage, refer to the [refine devtools documentation](https://refine.dev/docs/packages/devtools)

## Install

```
npm install @refinedev/devtools
```
npm package: @refinedev/nextjs-router
Description: React Router v6 support for Refine, with full routing capabilities.
Author: refine
Latest version: 7.0.5

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev/">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

For more detailed information and usage, refer to the [refine router provider documentation](https://refine.dev/docs/core/providers/router-provider/).
npm package: @refinedev/react-router
Description: React Router support for Refine, with full routing capabilities.
Author: refine
Latest version: 2.0.4

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev/">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

For more detailed information and usage, refer to the [refine router provider documentation](https://refine.dev/docs/core/providers/router-provider/).
npm package: @refinedev/react-router-v6
Description: React Router v6 support for Refine, with full routing capabilities.
Author: refine
Latest version: 4.6.2

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev/">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

For more detailed information and usage, refer to the [refine router provider documentation](https://refine.dev/docs/core/providers/router-provider/).
npm package: @refinedev/remix-router
Description: Remix router integration package for Refine.
Author: refine
Latest version: 4.0.4

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev/">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>
<br/>
<div align="center">refine is an open-source, headless React framework for developers building enterprise web applications.

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[refine](https://refine.dev/) is **headless by design**, offering unlimited styling and customization options. Moreover, refine ships with ready-made integrations for [Ant Design](https://ant.design/), [Material UI](https://mui.com/material-ui/getting-started/overview/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/) for convenience.

refine has connectors for 15+ backend services, including REST API, [GraphQL](https://graphql.org/), and popular services like [Airtable](https://www.airtable.com/), [Strapi](https://strapi.io/), [Supabase](https://supabase.com/), [Firebase](https://firebase.google.com/), and [Directus](https://directus.io/)

[Refer to documentation for more info about refine&#8594](https://refine.dev/docs/)
[Step up to refine tutorials &#8594](https://refine.dev/docs/tutorial/introduction/index/)

## Documentation

For more detailed information and usage, refer to the [refine router provider documentation](https://refine.dev/docs/core/providers/router-provider/).

## Install

```
npm install @refinedev/remix-router
```
npm package: @refinedev/rest
Description: REST Data Provider for Refine, enabling seamless REST API interactions.
Author: refine
Latest version: 2.1.1

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img alt="refine logo" src="https://refine.ams3.cdn.digitaloceanspaces.com/readme/refine-readme-banner.png">
    </a>
</div>

<br/>

<div align="center">
    <a href="https://refine.dev">Home Page</a> |
    <a href="https://discord.gg/refine">Discord</a> |
    <a href="https://refine.dev/examples/">Examples</a> |
    <a href="https://refine.dev/blog/">Blog</a> |
    <a href="https://refine.dev/docs/">Documentation</a>

<br/>
<br/>

[![Discord](https://img.shields.io/discord/837692625737613362.svg?label=&logo=discord&logoColor=ffffff&color=7389D8&labelColor=6A7EC2)](https://discord.gg/refine)
[![Twitter Follow](https://img.shields.io/twitter/follow/refine_dev?style=social)](https://twitter.com/refine_dev)

<a href="https://www.producthunt.com/posts/refine-3?utm_source=badge-top-post-badge&utm_medium=badge&utm_souce=badge-refine&#0045;3" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/top-post-badge.svg?post_id=362220&theme=light&period=daily" alt="refine - 100&#0037;&#0032;open&#0032;source&#0032;React&#0032;framework&#0032;to&#0032;build&#0032;web&#0032;apps&#0032;3x&#0032;faster | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>

</div>

<br/>

<div align="center">refine is an open-source, headless React framework for developers building enterprise internal tools, admin panels, dashboards, B2B applications.

<br/>

It eliminates repetitive tasks in CRUD operations and provides industry-standard solutions for critical project components like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**.

</div>

# Refine REST data provider

## Installation & Usage

```
npm install @refinedev/rest
```

```tsx

```

## Documentation

- For more detailed information and usage, refer to the [refine data provider documentation](https://refine.dev/docs/core/providers/data-provider).
- [Refer to Refine rest docs.](https://refine.dev/docs/packages/documentation/data-providers/rest/).
- [Refer to documentation for more info about refine](https://refine.dev/docs/).
- [Step up to refine tutorials](https://refine.dev/docs/tutorial/introduction/index/).
npm package: @refinedev/sdk
Description: refine sdk. refine is a React-based framework for building internal tools, rapidly. It ships with Ant Design System, an enterprise-level UI toolkit.
Author: refine
Latest version: 1.1.0

<div align="center" style="margin: 30px;">
    <a href="https://refine.dev">
    <img src="https://refine.ams3.cdn.digitaloceanspaces.com/refine_logo.png"  align="center" />
    </a>
</div>
<br/>
<div align="center"><strong>refine</strong> is a <a href="https://reactjs.org/">React</a>-based framework for building internal tools, rapidly. ✨ It ships with <a href="https://ant.design/">Ant Design System</a>, an enterprise-level UI toolkit.</div>
<br/>

<div align="center">
  <sub>Created by <a href="https://refine.dev">refine</a></sub>
</div>

## About

[**refine**](https://refine.dev/) offers lots of out-of-the box functionality for rapid development, without compromising extreme customizability. Use-cases include, but are not limited to *admin panels*, *B2B applications* and *dashboards*.

## Install

```
npm install @refinedev/sdk
```
npm package: @refinedwiki/grunt-atlassian-soy-compiler
Description: Adds a Grunt step to compile Soy Templates using the Atlassian Soy Template Compiler
Latest version: 2.0.6

# grunt-atlassian-soy-compiler

Uses Atlassian's Soy compiler to compile Soy files to JS.

## Getting Started
This plugin requires Grunt `>=1.0.0`

If you haven't used [Grunt](http://gruntjs.com/) before, be sure to check out the [Getting Started](http://gruntjs.com/getting-started) guide, as it explains how to create a [Gruntfile](http://gruntjs.com/sample-gruntfile) as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

```
$ npm install --save-dev @refinedwiki/grunt-atlassian-soy-compiler
```

## Usage

```js
require('load-grunt-tasks')(grunt); // npm install --save-dev load-grunt-tasks

grunt.initConfig({
    soy: {
        options: {
          propertiesFiles: [path.join('properties', 'strings.properties')]
        },
        default: {
          src: '.', // Must be the root in order for propertis to work
          dest: path.join('build', 'soy'),
          glob: path.join('public', 'templates', '*.soy'),
          translationTarget: true
        },
    }
});

grunt.registerTask('default', ['soy']);
```

### Options

#### propertiesFiles
Type: `Array`

A list of .properties files containing translations

### Task properties

#### skipTranslations
Type: `Boolean`
Default: `false`

If it's true the task uses the supplied `propertiesFiles` verbatim. Otherwise the task expects the target to be named after the language (For example de_DE) and uses that to search for the relevant .properties file. The target for the default language should be named default.

#### src
Type: `String`

This must be a directory that includes both the directory with properties as well as the directory with the Soy files
 
#### glob
Type: `String`

The glob used to find Soy files
npm package: @refinenative/expo-router
Description: refine expo-router provider
Author: abdellah711
Latest version: 0.1.12

> this project is still in development, and not ready for production use yet.

<br/>
<br/>
<br/>

<div align="center" style="margin: 30px;">
<a href="https://refine.dev/">
  <img src="./logo.png"   style="width:350px;" align="center" />
</a>
<br />
<br />


<br />

<strong>Build web and native crud apps 3x faster by leveraging the power of React Native and [Refine](https://refine.dev/).</strong><br>An open-source React native framework developed to make cross-platform development easier.
<br />
<br />
</div>


## How to use
Start by creating a new expo project using the expo-cli, and add expo-router to your project, you can follow the [official documentation](https://expo.github.io/router/docs/) for more details.

After that, install the following packages:

```sh
yarn add @refinenative/expo-router @refinenative/react-native-paper @refinedev/simple-rest @refinedev/core
```

Then, inside your _layout.tsx_ file, add the following code:

```tsx
import { Refine } from '@refinedev/core'
import dataProvider from "@refinedev/simple-rest";
import routerProvider, { DrawerLayout } from '@refinenative/expo-router'
import { DrawerContent, ReactNavigationThemeProvider, Header } from '@refinenative/react-native-paper';

export default function layout() {
    return (
        <Refine
            routerProvider={routerProvider}
            options={{
                reactQuery: {
                    devtoolConfig: Platform.OS === "web" ? undefined : false,
                },
                disableTelemetry: true
            }}
            dataProvider={dataProvider("https://api.fake-rest.refine.dev")}
            resources={[
                {
                    name: "blog_posts",
                    list: "/blog-posts",
                    show: "/blog-posts/show/:id",
                    create: "/blog-posts/create",
                    edit: "/blog-posts/edit/:id",
                    meta: {
                        canDelete: true,
                        icon: 'calendar'
                    }
                },
            ]}
        >
            <ReactNavigationThemeProvider>
                <DrawerLayout
                    DrawerContent={() => <DrawerContent />}
                    Header={Header}
                />
            </ReactNavigationThemeProvider>
        </Refine>
    )
}
```

Now you can start using the features of Refine just like you would do in a web project.

## TODO
[] Write unit tests
<br/>
[] Automate the build & release process
<br/>
[] Add more examples
<br/>
[] Write documentation
<br/>
[] Add more features to @refinenative/react-native-paper
<br/>
[] Support react-navigation and other navigation libraries
<br/>
[] Build an inferencer for react-native-paper
<br/>
[] Support other UI libraries like react-native-elements

## Contribution
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.








## License

Licensed under the MIT License
npm package: @refinenative/react-native-paper
Description: react native paper components for refine apps
Author: abdellah711
Latest version: 0.1.12

> this project is still in development, and not ready for production use yet.

<br/>
<br/>
<br/>

<div align="center" style="margin: 30px;">
<a href="https://refine.dev/">
  <img src="./logo.png"   style="width:350px;" align="center" />
</a>
<br />
<br />


<br />

<strong>Build web and native crud apps 3x faster by leveraging the power of React Native and [Refine](https://refine.dev/).</strong><br>An open-source React native framework developed to make cross-platform development easier.
<br />
<br />
</div>


## How to use
Start by creating a new expo project using the expo-cli, and add expo-router to your project, you can follow the [official documentation](https://expo.github.io/router/docs/) for more details.

After that, install the following packages:

```sh
yarn add @refinenative/expo-router @refinenative/react-native-paper @refinedev/simple-rest @refinedev/core
```

Then, inside your _layout.tsx_ file, add the following code:

```tsx
import { Refine } from '@refinedev/core'
import dataProvider from "@refinedev/simple-rest";
import routerProvider, { DrawerLayout } from '@refinenative/expo-router'
import { DrawerContent, ReactNavigationThemeProvider, Header } from '@refinenative/react-native-paper';

export default function layout() {
    return (
        <Refine
            routerProvider={routerProvider}
            options={{
                reactQuery: {
                    devtoolConfig: Platform.OS === "web" ? undefined : false,
                },
                disableTelemetry: true
            }}
            dataProvider={dataProvider("https://api.fake-rest.refine.dev")}
            resources={[
                {
                    name: "blog_posts",
                    list: "/blog-posts",
                    show: "/blog-posts/show/:id",
                    create: "/blog-posts/create",
                    edit: "/blog-posts/edit/:id",
                    meta: {
                        canDelete: true,
                        icon: 'calendar'
                    }
                },
            ]}
        >
            <ReactNavigationThemeProvider>
                <DrawerLayout
                    DrawerContent={() => <DrawerContent />}
                    Header={Header}
                />
            </ReactNavigationThemeProvider>
        </Refine>
    )
}
```

Now you can start using the features of Refine just like you would do in a web project.

## TODO
[] Write unit tests
<br/>
[] Automate the build & release process
<br/>
[] Add more examples
<br/>
[] Write documentation
<br/>
[] Add more features to @refinenative/react-native-paper
<br/>
[] Support react-navigation and other navigation libraries
<br/>
[] Build an inferencer for react-native-paper
<br/>
[] Support other UI libraries like react-native-elements

## Contribution
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.








## License

Licensed under the MIT License
npm package: @refinist/prettier-config
Description: Out-of-the-box prettier configuration
Author: Jeff Wang
Latest version: 1.2.0

# @refinist/prettier-config

[![npm](https://img.shields.io/npm/v/@refinist/prettier-config.svg?colorA=56b3b4&colorB=f7ba3e)](https://npmjs.com/package/@refinist/prettier-config)

Prettier config

## Features

- 📏 2 spaces (default)
- 🔚 Semicolons
- 🔤 Single quotes
- ❌ No trailing commas
- 🏹 Avoid arrow parentheses
- 🌐 Ignore HTML whitespace sensitivity
- 🚫 Ignore common files (`node_modules`, `dist`, `pnpm-lock.yaml`...)，refer to [#4708](https://github.com/prettier/prettier/issues/4708#issuecomment-1448705672)
- ⚡ Faster JS/TS parsing with [Oxc](https://github.com/nicolo-ribaudo/prettier/tree/nicolo/plugin-oxc/packages/plugin-oxc)
- 🎨 With Tailwind CSS plugin (optional)

## Install

Using pnpm, yarn, or npm

```bash
# with pnpm
pnpm add -D @refinist/prettier-config

# with yarn
yarn add -D @refinist/prettier-config

# with npm
npm i -D @refinist/prettier-config
```

## Usage

### Basic

```json
// package.json
{
  "prettier": "@refinist/prettier-config"
}
```

Or in `prettier.config.js`:

```js
// prettier.config.js
import config from '@refinist/prettier-config';
/** @type {import('prettier').Config} */
export default {
  ...config

  /* your custom config */
};
```

### With Tailwind CSS

If you're using Tailwind CSS, use the variant with the plugin:

```json
// package.json
{
  "prettier": "@refinist/prettier-config/with-tailwindcss"
}
```

Or in `prettier.config.js`:

```js
// prettier.config.js
import config from '@refinist/prettier-config/with-tailwindcss';
/** @type {import('prettier').Config & import('@refinist/prettier-config/plugin-tailwindcss').PluginOptions} */
export default {
  ...config

  /* your custom config */
};
```

For more details about the Tailwind CSS plugin options, see the [prettier-plugin-tailwindcss documentation](https://github.com/tailwindlabs/prettier-plugin-tailwindcss).

Generally, prettier works together with eslint. Check out [@refinist/eslint-config](https://github.com/refinist/eslint-config?tab=readme-ov-file#-prettier-config) for more configuration details.

Inspired by [@sxzz](https://github.com/sxzz)

## License

[MIT](./LICENSE)

Copyright (c) 2025-present, Zhifeng (Jeff) Wang
npm package: @refinist/tw4-config
Description: Tailwind CSS v4 configuration, providing out-of-the-box mobile and modern web development solutions.
Author: Jeff Wang
Latest version: 0.0.3

# 🎨 @refinist/tw4-config

[![npm](https://img.shields.io/npm/v/@refinist/tw4-config.svg?labelColor=00bcff&color=000000)](https://npmjs.com/package/@refinist/tw4-config) [![size](https://img.badgesize.io/https://unpkg.com/@refinist/tw4-config?compression=gzip&labelColor=00bcff&color=000000)](https://unpkg.com/@refinist/tw4-config)

Tailwind CSS v4 配置，提供开箱即用的移动端和现代 Web 开发解决方案。

> [English Documentation](./README.md) | 中文文档

## ✨ 特性

### 🚫 1. 移除 Tailwind CSS Preflight

默认移除了 Tailwind 的 Preflight 样式重置，只引入了 `theme.css` 和 `utilities.css`，避免与现有项目样式冲突。

### 📱 2. 移动端安全区域支持

提供完整的 safe-area-inset-bottom 解决方案，兼容 Android 和 iOS 设备：

**🔧 基础类：**

- `saib-pb` - 底部安全区域内边距
- `saib-mb` - 底部安全区域外边距
- `saib-b` - 底部安全区域定位距离

**⚡ 动态类（支持任意值和裸值）：**

- `saib-pb-*` - 底部内边距 + 安全区域，如`saib-pb-2`(`padding-bottom: calc(var(--saib-spacing) * 2) /* 0.5rem = 8px */`), `saib-pb-[24px]`
- `saib-mb-*` - 底部外边距 + 安全区域，如`saib-mb-2`(`margin-bottom: calc(var(--saib-spacing) * 2) /* 0.5rem = 8px */`), `saib-mb-[24px]`
- `saib-b-*` - 底部定位 + 安全区域，如`saib-b-2`(`bottom: calc(var(--saib-spacing) * 2) /* 0.5rem = 8px */`), `saib-b-[24px]`

```html
<!-- 基础使用 -->
<div class="saib-pb-2">底部内边距 8px + 安全区域</div>
<div class="saib-mb-2">底部外边距 8px + 安全区域</div>
<div class="fixed saib-b-2">底部定位 8px + 安全区域</div>
```

### 🔄 3. 增强的 flex-1 类

改进了 `flex-1` 类的实现，解决了内部内容宽度/高度过宽导致容器被撑开的问题：

```css
.flex-1 {
  flex: 1;
  min-width: 0; /* 防止水平方向内容撑开 */
}

.flex-col > .flex-1 {
  min-width: auto;
  min-height: 0; /* 防止垂直方向内容撑开 */
}
```

### ✂️ 4. 文本省略号工具类

提供开箱即用的单行文本省略功能：

```html
<div class="text-overflow-ellipsis">
  这是一段很长的文本，超出部分会显示省略号...
</div>
```

### 💡 更多想法，正在路上...

## 📦 安装

```bash
# npm
npm install @refinist/tw4-config

# pnpm
pnpm install @refinist/tw4-config

# yarn
yarn add @refinist/tw4-config

# bun
bun add @refinist/tw4-config
```

## 🚀 使用

```css
@import '@refinist/tw4-config';
```

考虑到很多 UI 框架都有自己的 `reset` 样式，所以没有引入 `Preflight`，如果你需要使用 `Preflight`，请自行引入 👇

```css
@import '@refinist/tw4-config';
@import 'tailwindcss/preflight.css' layer(base);
```

## 🌍 兼容性说明

- ✅ 安全区域功能兼容支持 `constant()` 和 `env()` 的现代浏览器
- 🤖 Android 设备无安全区域时会使用 0.1px 的默认值确保计算正确
- 🔧 所有功能都基于现代 CSS 特性，建议在支持 CSS 自定义属性的浏览器中使用

## 📄 License

[MIT](./LICENSE)

Copyright (c) 2025-present, Zhifeng (Jeff) Wang
npm package: @refinist/vue-amap
Description: Using Vue3 component to use Amap
Author: Jeff Wang
Latest version: 0.0.3

# vue-amap [![npm](https://img.shields.io/npm/v/@refinist/vue-amap.svg?style=flat&colorA=2b99ff&colorB=387aff)](https://npmjs.com/package/@refinist/vue-amap)

Using Vue3 component to use Amap

## Features

TODO

## Usage

TODO