@refinedev/antd
Advanced tools
@refinedev/antd - npm Package Compare versions
Comparing version 5.18.2 to 5.19.0
| export interface IThemedLayoutContext { | ||
| siderVisible: boolean; | ||
| drawerSiderVisible: boolean; | ||
| setSiderVisible?: (visible: boolean) => void; | ||
| setDrawerSiderVisible?: (visible: boolean) => void; | ||
| siderCollapsed: boolean; | ||
| setSiderCollapsed: (visible: boolean) => void; | ||
| mobileSiderOpen: boolean; | ||
| setMobileSiderOpen: (visible: boolean) => void; | ||
| } | ||
| //# sourceMappingURL=IThemedLayoutContext.d.ts.map |
@@ -9,2 +9,3 @@ export * from "./form"; | ||
| export * from "./useSiderVisible"; | ||
| export * from "./useThemedLayoutContext"; | ||
| //# sourceMappingURL=index.d.ts.map |
@@ -1,4 +0,11 @@ | ||
| import { IThemedLayoutContext } from "@contexts/themedLayoutContext/IThemedLayoutContext"; | ||
| export declare type UseSiderVisibleType = IThemedLayoutContext; | ||
| export declare type UseSiderVisibleType = { | ||
| siderVisible: boolean; | ||
| drawerSiderVisible: boolean; | ||
| setSiderVisible: (visible: boolean) => void; | ||
| setDrawerSiderVisible: (visible: boolean) => void; | ||
| }; | ||
| /** | ||
| * @deprecated Please use `useThemedLayoutContext` instead. | ||
| */ | ||
| export declare const useSiderVisible: () => UseSiderVisibleType; | ||
| //# sourceMappingURL=index.d.ts.map |
| { | ||
| "name": "@refinedev/antd", | ||
| "version": "5.18.2", | ||
| "version": "5.19.0", | ||
| "description": "refine is a React-based framework for building internal tools, rapidly. It ships with Ant Design System, an enterprise-level UI toolkit.", | ||
@@ -28,3 +28,3 @@ "private": false, | ||
| "@refinedev/ui-tests": "^1.5.0", | ||
| "@refinedev/core": "^4.14.3", | ||
| "@refinedev/core": "^4.16.3", | ||
| "@esbuild-plugins/node-resolve": "^0.1.4", | ||
@@ -51,3 +51,3 @@ "@testing-library/jest-dom": "^5.16.4", | ||
| "dependencies": { | ||
| "@ant-design/icons": "^5.0.1", | ||
| "@ant-design/icons": "5.0.1", | ||
| "@ant-design/pro-layout": "7.8.3", | ||
@@ -54,0 +54,0 @@ "@refinedev/ui-types": "^1.16.0", |
@@ -15,4 +15,3 @@ <br/> | ||
| <a href="https://refine.dev/blog/">Blog</a> | | ||
| <a href="https://refine.dev/docs/">Documentation</a> | | ||
| <a href="https://github.com/refinedev/refine/projects/1">Roadmap</a> | ||
| <a href="https://refine.dev/docs/">Documentation</a> | ||
| </div> | ||
@@ -28,3 +27,2 @@ </div> | ||
| [](https://discord.gg/refine) | ||
@@ -37,8 +35,4 @@ [](https://twitter.com/refine_dev) | ||
| <div align="center"> | ||
| [](https://github.com/refinedev/awesome-refine) | ||
@@ -52,4 +46,2 @@ [](https://codeclimate.com/github/pankod/refine/maintainability) | ||
| </div> | ||
@@ -65,25 +57,21 @@ | ||
| ## What is refine? | ||
| ## What is refine? | ||
| **refine** is a React-based framework for the rapid ✨ development of web applications. | ||
| **refine** is a React-based framework for the rapid ✨ development of web applications. | ||
| It eliminates repetitive tasks demanded by **CRUD** operations and provides industry standard solutions for critical parts like **authentication**, **access control**, **routing**, **networking**, **state management**, and **i18n**. | ||
| **refine** is *headless by design*, thereby offering unlimited styling and customization options. | ||
| **refine** is _headless by design_, thereby offering unlimited styling and customization options. | ||
| ## What do you mean by "headless" ? | ||
| Instead of being a limited set of pre-styled components, **refine** is a collection of helper `hooks`, `components`, and `providers`. They are all decoupled from *UI components* and *business logic*, so that they never keep you from customizing your *UI* or coding your own flow. | ||
| Instead of being a limited set of pre-styled components, **refine** is a collection of helper `hooks`, `components`, and `providers`. They are all decoupled from _UI components_ and _business logic_, so that they never keep you from customizing your _UI_ or coding your own flow. | ||
| **refine** seamlessly works with any **custom design** or **UI framework** that you favor. For convenience, it ships with ready-made integrations for [Ant Design System](https://ant.design/), [Material UI](https://mui.com/), [Mantine](https://mantine.dev/), and [Chakra UI](https://chakra-ui.com/). | ||
| ## Use cases | ||
| **refine** shines on *data-intensive⚡* applications like **admin panels**, **dashboards** and **internal tools**. Thanks to the built-in **SSR support**, **refine** can also power *customer-facing* applications like **storefronts**. | ||
| **refine** shines on _data-intensive⚡_ applications like **admin panels**, **dashboards** and **internal tools**. Thanks to the built-in **SSR support**, **refine** can also power _customer-facing_ applications like **storefronts**. | ||
| You can take a look at some live examples that can be built using **refine** from scratch: | ||
| <a href="https://s.refine.dev/readme-admin-panel" target="_blank"> | ||
@@ -93,3 +81,2 @@ <img src="https://user-images.githubusercontent.com/18739364/204285956-cc20fa11-b769-4bd5-b8f6-9c05a283ac85.gif" style="width:267px;" /> | ||
| <a href="https://s.refine.dev/readme-medium-clone" target="_blank"> | ||
@@ -99,3 +86,2 @@ <img src="https://user-images.githubusercontent.com/18739364/204285047-8f24f1f4-65ea-4952-83ed-81e92cdd5b90.gif" style="width:200px;" /> | ||
| <a href="https://s.refine.dev/readme-ssr-storefront" target="_blank"> | ||
@@ -105,7 +91,5 @@ <img src="https://user-images.githubusercontent.com/18739364/204285039-1ce0cb06-fbf8-4704-89c9-2e004620c9a8.gif" style="width:200px;" /> | ||
| <br/> | ||
| <br/> | ||
| [👉 Refer to most popular real use case examples](https://refine.dev/examples/) | ||
@@ -115,5 +99,2 @@ | ||
| ## Key Features | ||
@@ -150,3 +131,3 @@ | ||
| The fastest way to get started with **refine** is by using the `create refine-app` project starter tool. | ||
| Run the following command to create a new **refine** project configured with [Ant Design System](https://ant.design/) as the default UI framework: | ||
| Run the following command to create a new **refine** project configured with [Ant Design System](https://ant.design/) as the default UI framework: | ||
@@ -167,4 +148,2 @@ ``` | ||
| <a href="http://localhost:3000"></a> | ||
@@ -174,6 +153,6 @@ | ||
| Let's consume a public `fake REST API` and add two resources (*blog_posts*, *categories*) to our project. Replace the contents of `src/App.tsx` with the following code: | ||
| Let's consume a public `fake REST API` and add two resources (_blog_posts_, _categories_) to our project. Replace the contents of `src/App.tsx` with the following code: | ||
| ```tsx title="src/App.tsx" | ||
| import { Refine } from '@refinedev/core'; | ||
| import { Refine } from "@refinedev/core"; | ||
| import { | ||
@@ -183,11 +162,11 @@ notificationProvider, | ||
| ThemedLayout, | ||
| } from '@refinedev/antd'; | ||
| import routerProvider, { NavigateToResource } from '@refinedev/react-router-v6'; | ||
| import dataProvider from '@refinedev/simple-rest'; | ||
| } from "@refinedev/antd"; | ||
| import routerProvider, { NavigateToResource } from "@refinedev/react-router-v6"; | ||
| import dataProvider from "@refinedev/simple-rest"; | ||
| import { BrowserRouter, Routes, Route, Outlet } from 'react-router-dom'; | ||
| import { BrowserRouter, Routes, Route, Outlet } from "react-router-dom"; | ||
| import { AntdInferencer } from '@refinedev/inferencer/antd'; | ||
| import { AntdInferencer } from "@refinedev/inferencer/antd"; | ||
| import '@refinedev/antd/dist/reset.css'; | ||
| import "@refinedev/antd/dist/reset.css"; | ||
@@ -199,17 +178,17 @@ const App: React.FC = () => { | ||
| routerProvider={routerProvider} | ||
| dataProvider={dataProvider('https://api.fake-rest.refine.dev')} | ||
| dataProvider={dataProvider("https://api.fake-rest.refine.dev")} | ||
| notificationProvider={notificationProvider} | ||
| resources={[ | ||
| { | ||
| name: 'blog_posts', | ||
| list: '/blog-posts', | ||
| show: '/blog-posts/show/:id', | ||
| create: '/blog-posts/create', | ||
| edit: '/blog-posts/edit/:id', | ||
| name: "blog_posts", | ||
| list: "/blog-posts", | ||
| show: "/blog-posts/show/:id", | ||
| create: "/blog-posts/create", | ||
| edit: "/blog-posts/edit/:id", | ||
| meta: { canDelete: true }, | ||
| }, | ||
| { | ||
| name: 'categories', | ||
| list: '/categories', | ||
| show: '/categories/show/:id', | ||
| name: "categories", | ||
| list: "/categories", | ||
| show: "/categories/show/:id", | ||
| }, | ||
@@ -259,9 +238,4 @@ ]} | ||
| 🚀 Thanks to **refine Inferencer package**, it guesses the configuration to use for the `list`, `show`, `create`, and `edit` pages based on the data fetched from the API and generates the pages automatically. | ||
| 🚀 Thanks to **refine Inferencer package**, it guesses the configuration to use for the `list`, `show`, `create`, and `edit` pages based on the data fetched from the API and generates the pages automatically. | ||
| Now, you should see the output as a table populated with `blog_post` & `category` data: | ||
@@ -288,5 +262,2 @@ | ||
| ## Roadmap | ||
| You can find refine's <a href="https://github.com/refinedev/refine/projects/1">Public Roadmap here!</a> | ||
| ## Stargazers | ||
@@ -298,11 +269,6 @@ | ||
| [👉 Refer to contribution docs for more information](https://refine.dev/docs/contributing/#ways-to-contribute) | ||
| [👉 Refer to contribution docs for more information](https://refine.dev/docs/contributing/#ways-to-contribute) | ||
| If you have any doubts related to the project or want to discuss something, then join our [Discord Server](https://discord.gg/refine). | ||
| ## Our ♥️ Contributors | ||
@@ -309,0 +275,0 @@ |
| export interface IThemedLayoutContext { | ||
| siderVisible: boolean; | ||
| drawerSiderVisible: boolean; | ||
| setSiderVisible?: (visible: boolean) => void; | ||
| setDrawerSiderVisible?: (visible: boolean) => void; | ||
| siderCollapsed: boolean; | ||
| setSiderCollapsed: (visible: boolean) => void; | ||
| mobileSiderOpen: boolean; | ||
| setMobileSiderOpen: (visible: boolean) => void; | ||
| } |
@@ -9,1 +9,2 @@ export * from "./form"; | ||
| export * from "./useSiderVisible"; | ||
| export * from "./useThemedLayoutContext"; |
| import { useContext } from "react"; | ||
| import { ThemedLayoutContext } from "@contexts"; | ||
| import { IThemedLayoutContext } from "@contexts/themedLayoutContext/IThemedLayoutContext"; | ||
| export type UseSiderVisibleType = IThemedLayoutContext; | ||
| export type UseSiderVisibleType = { | ||
| siderVisible: boolean; | ||
| drawerSiderVisible: boolean; | ||
| setSiderVisible: (visible: boolean) => void; | ||
| setDrawerSiderVisible: (visible: boolean) => void; | ||
| }; | ||
| /** | ||
| * @deprecated Please use `useThemedLayoutContext` instead. | ||
| */ | ||
| export const useSiderVisible = (): UseSiderVisibleType => { | ||
| const { | ||
| siderVisible, | ||
| setSiderVisible, | ||
| drawerSiderVisible, | ||
| setDrawerSiderVisible, | ||
| mobileSiderOpen, | ||
| siderCollapsed, | ||
| setMobileSiderOpen, | ||
| setSiderCollapsed, | ||
| } = useContext(ThemedLayoutContext); | ||
| return { | ||
| siderVisible, | ||
| setSiderVisible, | ||
| drawerSiderVisible, | ||
| setDrawerSiderVisible, | ||
| siderVisible: mobileSiderOpen, | ||
| setSiderVisible: setMobileSiderOpen, | ||
| drawerSiderVisible: siderCollapsed, | ||
| setDrawerSiderVisible: setSiderCollapsed, | ||
| }; | ||
| }; |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.36%
2561449
- Number of package files
- increased by0.88%
342
- Lines of code
- increased by0.36%
10971
Worsened metrics
- Number of lines in readme file
- decreased by-11.33%
266
Dependency changes
+ Added@ant-design/icons@5.0.1(transitive)
Updated@ant-design/icons@5.0.1