@refinedev/antd 5.18.1 → 5.19.0

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @pankod/refine-antd
 
+## 5.19.0
+
+### Minor Changes
+
+-   [#4404](https://github.com/refinedev/refine/pull/4404) [`f67967e8c87`](https://github.com/refinedev/refine/commit/f67967e8c871b2252b4c1b827de3656bf153d1ee) Thanks [@salihozdemir](https://github.com/salihozdemir)! - refactor: fix name and state inconsistency in `<ThemedLayoutV2>`
+
+    `useSiderVisible` is deprecated, instead we created a new hook `useThemedLayoutContext` for it. `useThemedLayoutContext` similar to `useSiderVisible` but it returns more meaningful state names. However, `useSiderVisible` is still available for backward compatibility.
+
+    Updated `Sider` and `HamburgerMenu` components using `useThemedLayoutContext`.
+
+    ```tsx
+    import { useThemedLayoutContext } from "@refinedev/antd";
+
+    const {
+        siderCollapsed,
+        setSiderCollapsed,
+        mobileSiderOpen,
+        setMobileSiderOpen,
+    } = useThemedLayoutContext();
+    ```
+
+## 5.18.2
+
+### Patch Changes
+
+-   [#4316](https://github.com/refinedev/refine/pull/4316) [`4690c627e05`](https://github.com/refinedev/refine/commit/4690c627e053a7e35eb8bcb1bfca808308bfa89d) Thanks [@yildirayunlu](https://github.com/yildirayunlu)! - fix: fixed `className` for easier selection of all buttons and titles of CRUD components
+
 ## 5.18.1
 
 ### Patch Changes

package/README.md

@@ -12,8 +12,7 @@
     <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> | 
-    <a href="https://github.com/refinedev/refine/projects/1">Roadmap</a>
+    <a href="https://refine.dev/docs/">Documentation</a>
 </div>
 </div>
 
@@ -24,7 +23,6 @@
 <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)
 
@@ -32,12 +30,8 @@
 
 </div>
 
-
 <div align="center">
 
-
-
-
 [![Awesome](https://github.com/refinedev/awesome-refine/raw/main/images/badge.svg)](https://github.com/refinedev/awesome-refine)
 [![Maintainability](https://api.codeclimate.com/v1/badges/99a65a191bdd26f4601c/maintainability)](https://codeclimate.com/github/pankod/refine/maintainability)
 [![Test Coverage](https://api.codeclimate.com/v1/badges/99a65a191bdd26f4601c/test_coverage)](https://codeclimate.com/github/pankod/refine/test_coverage)
@@ -46,8 +40,6 @@
 [![](https://img.shields.io/github/commit-activity/m/refinedev/refine)](https://github.com/refinedev/refine/commits/next)
 [![Contributor Covenant](https://img.shields.io/badge/Contributor%20Covenant-2.0-4baaaa.svg)](CODE_OF_CONDUCT.md)
 
-
-
 </div>
 
 <br/>
@@ -58,55 +50,44 @@
 </picture>
 </a>
 
-
-
-
-
 ## 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**.
-
-You can take a look at some live examples that can be built using **refine** from scratch:
-
 
+**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">
  <img src="https://user-images.githubusercontent.com/18739364/204285956-cc20fa11-b769-4bd5-b8f6-9c05a283ac85.gif"   style="width:267px;"  />
 </a>
 
-
  <a href="https://s.refine.dev/readme-medium-clone" target="_blank">
 <img src="https://user-images.githubusercontent.com/18739364/204285047-8f24f1f4-65ea-4952-83ed-81e92cdd5b90.gif"   style="width:200px;"  />
 </a>
 
-
  <a href="https://s.refine.dev/readme-ssr-storefront" target="_blank">
 <img src="https://user-images.githubusercontent.com/18739364/204285039-1ce0cb06-fbf8-4704-89c9-2e004620c9a8.gif"   style="width:200px;"  />
 </a>
 
-
 <br/>
 <br/>
 
-
 [👉 Refer to most popular real use case examples](https://refine.dev/examples/)
 
 [👉 More **refine** powered different usage scenarios can be found here](https://refine.dev/docs/examples/)
 
-
-
-
 ## Key Features
 
 ⚙️ Zero-config, **one-minute setup** with a **single CLI command**
@@ -138,7 +119,7 @@ You can take a look at some live examples that can be built using **refine** fro
 ## Quick Start
 
 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:
 
 ```
 npm create refine-app@latest -- --preset refine-antd
@@ -154,50 +135,48 @@ npm run dev
 
 Your **refine** application will be accessible at [http://localhost:3000](http://localhost:3000):
 
-
-
 <a href="http://localhost:3000">![Welcome on board](https://refine.ams3.cdn.digitaloceanspaces.com/website%2Fstatic%2Fimg%2Fwelcome.png)</a>
 
 <br/>
 
-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 {
     notificationProvider,
     ErrorComponent,
     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";
 
 const App: React.FC = () => {
     return (
         <BrowserRouter>
             <Refine
                 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",
                     },
                 ]}
             >
@@ -242,12 +221,7 @@ export default App;
 
 <br/>
 
-
-
-
-🚀  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:
 
@@ -270,24 +244,16 @@ You can get the auto-generated pages codes by clicking the `Show Code` button on
 
 👉 Play with interactive [Examples](https://refine.dev/docs/examples/)
 
-## Roadmap
-You can find refine's <a href="https://github.com/refinedev/refine/projects/1">Public Roadmap here!</a> 
-
 ## Stargazers
 
 [![Stargazers repo roster for refinedev/refine](https://reporoster.com/stars/refinedev/refine)](https://github.com/refinedev/refine/stargazers)
 
 ## Contribution
 
-
-
- [👉 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
 
 <a href="https://github.com/refinedev/refine/graphs/contributors">

package/dist/components/themedLayoutV2/sider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/themedLayoutV2/sider/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AA4B1B,OAAO,EAAE,8BAA8B,EAAE,MAAM,UAAU,CAAC;AAO1D,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,8BAA8B,CAyTlE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/themedLayoutV2/sider/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AA4B1B,OAAO,EAAE,8BAA8B,EAAE,MAAM,UAAU,CAAC;AAO1D,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,8BAA8B,CAsTlE,CAAC"}

package/dist/contexts/themedLayoutContext/IThemedLayoutContext.d.ts

@@ -1,7 +1,7 @@
 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

package/dist/contexts/themedLayoutContext/IThemedLayoutContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IThemedLayoutContext.d.ts","sourceRoot":"","sources":["../../../src/contexts/themedLayoutContext/IThemedLayoutContext.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,oBAAoB;IACjC,YAAY,EAAE,OAAO,CAAC;IACtB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,qBAAqB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CACtD"}
+{"version":3,"file":"IThemedLayoutContext.d.ts","sourceRoot":"","sources":["../../../src/contexts/themedLayoutContext/IThemedLayoutContext.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,oBAAoB;IACjC,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAClD"}

package/dist/contexts/themedLayoutContext/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/contexts/themedLayoutContext/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D,eAAO,MAAM,mBAAmB,qCAG9B,CAAC;AAEH,eAAO,MAAM,2BAA2B,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACnC,CAkBA,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/contexts/themedLayoutContext/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D,eAAO,MAAM,mBAAmB,qCAK9B,CAAC;AAEH,eAAO,MAAM,2BAA2B,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACnC,CAkBA,CAAC"}