-
#6021
55cd0662b1e3ff8f8410eba812e80130afe75d14
Thanks @JayBhensdadia! - fix: ensure Sider component handles various resource name formats correctlyUpdated Sider component to correctly handle lowercase and camelcased resource names, enhancing usability and functionality.
Fixes #6004
-
#6064
b516c18b828ba8823561d0fefc4afe02b45ce332
Thanks @aliemir! - fix(auto-save-indicator): replace reservedkey
prop withtranslationKey
in components<AutoSaveIndicator />
components from UI libraries have been using a<Message />
component internally that uses akey
prop. Sincekey
is a reserved prop in React, it was causing a warning in the console. This change replaces thekey
prop withtranslationKey
to avoid the warning.Resolves #6067
-
6bd14228760d3e1e205ea9248e427f9afa2ec046
Thanks @BatuhanW! - feat: use global values by default for app title and app iconNow
<Refine />
component acceptsoptions.title
prop that can be used to set app icon and app name globally. For<ThemedLayoutV2 />
and<AuthPage />
components, these values will be used by default. While users can useoptions.title
to pass global values for app icon and app name, option to override through<ThemedTitleV2 />
component is still available for users to override these values in specific use cases.import { Refine } from "@refinedev/core"; const MyIcon = () => <svg>{/* ... */}</svg>; const App = () => { return ( <Refine options={{ title: { icon: <MyIcon />, text: "Refine App", }, }} > {/* ... */} </Refine> ); };
Then,
<ThemedLayoutV2 />
and<AuthPage />
components will display<MyIcon />
and"Refine App"
as app icon and app name respectively.
-
6bd14228760d3e1e205ea9248e427f9afa2ec046
Thanks @BatuhanW! - chore: addedtype
qualifier to imports used as type only.- import { A } from "./example.ts"; + import type { A } from "./example.ts";
-
Updated dependencies [
6bd14228760d3e1e205ea9248e427f9afa2ec046
,6bd14228760d3e1e205ea9248e427f9afa2ec046
]:- @refinedev/ui-types@1.22.9
-
#5945
903ea231538b00ce02ddc9394c72848ec1e90772
Thanks @aliemir! - feat: use global values by default for app title and app iconNow
<Refine />
component acceptsoptions.title
prop that can be used to set app icon and app name globally. For<ThemedLayoutV2 />
and<AuthPage />
components, these values will be used by default. While users can useoptions.title
to pass global values for app icon and app name, option to override through<ThemedTitleV2 />
component is still available for users to override these values in specific use cases.import { Refine } from "@refinedev/core"; const MyIcon = () => <svg>{/* ... */}</svg>; const App = () => { return ( <Refine options={{ title: { icon: <MyIcon />, text: "Refine App", }, }} > {/* ... */} </Refine> ); };
Then,
<ThemedLayoutV2 />
and<AuthPage />
components will display<MyIcon />
and"Refine App"
as app icon and app name respectively.
-
#5945
90930b381d8d369c63bc59beedf69c391875166d
Thanks @aliemir! - chore: addedtype
qualifier to imports used as type only.- import { A } from "./example.ts"; + import type { A } from "./example.ts";
-
Updated dependencies [
903ea231538b00ce02ddc9394c72848ec1e90772
,90930b381d8d369c63bc59beedf69c391875166d
]:- @refinedev/ui-types@1.22.8
-
#5928
db9756e7908
Thanks @aliemir! - fix: type errors on typescript <5Due to the changes in #5881, typescript users below version 5 are facing type errors. This PR fixes the type errors by updating the file extensions required by the
d.mts
declaration files to provide a compatible declarations for both typescript 4 and 5 users. -
Updated dependencies [
db9756e7908
]:- @refinedev/ui-types@1.22.7
-
#5881
ba719f6ea26
Thanks @aliemir! - fix: declaration files in node10, node16 and nodenext module resolutions -
Updated dependencies [
ba719f6ea26
]:- @refinedev/ui-types@1.22.6
-
#5761
399911617b2
Thanks @aliemir! - Migrated from outdated@tabler/icons@1
to@tabler/icons-react@3
to make sure we're using the latest available version of the library without requiring users to pin to a deprecated version.If your project doesn't include
@tabler/icons
you won't be affected by this change. If you're using@tabler/icons@1
in your project, you may need to update your dependency to latest version of@tabler/icons-react
to avoid conflicting dependencies. Practically, this should not introduce any breaking changes to your project and all the icons in@tabler/icons@1
should also be available in the latest version of@tabler/icons-react
.
-
#5737
4e8188a6652
Thanks @aliemir! - chore: updated content ofREADME.md
to include installation, usage and scaffolding instructions. -
#5765
0c197d82393
Thanks @aliemir! - fix:@tabler/icons-react
imports in CJS buildsimports from
@tabler/icons-react
end up requiring the ESM build in CJS environments, to prevent this we've added added an esbuild plugin to replace the imports with the correct path for CJS bundles. -
#5765
0c197d82393
Thanks @aliemir! - refactor: package bundles and package.json configuration for exportsPreviously, Refine packages had exported ESM and CJS bundles with same
.js
extension and same types for both with.d.ts
extensions. This was causing issues with bundlers and compilers to pick up the wrong files for the wrong environment. Now we're outputting ESM bundles with.mjs
extension and CJS bundles with.cjs
extension. Also types are now exported with both.d.mts
and.d.cts
extensions.In older versions ESM and CJS outputs of some packages were using wrong imports/requires to dependencies causing errors in some environments. This will be fixed since now we're also enforcing the module type with extensions.
Above mentioned changes also supported with changes in
package.json
files of the packages to support the new extensions and types. All Refine packages now includeexports
fields in their configuration to make sure the correct bundle is picked up by the bundlers and compilers. -
#5765
0c197d82393
Thanks @aliemir! - fix:dayjs
imports in ESM bundlesdayjs imports in ESM bundles were not being correctly resolved, this has been fixed by adding an esbuild plugin to replace the imports with the correct path for ESM bundles.
-
#5765
0c197d82393
Thanks @aliemir! - Fixed thelodash-es
imports for ESM builds to access the exports properly. -
#5714
38f129f40ee
Thanks @aliemir! - Due to the bug fix made in the@refinedev/core
,onFinishAutoSave
's returned promise can now reject and should be handled accordingly. UpdateduseForm
's auto save handler to catch the rejection without breaking the application.Additionally due to the same changes,
onFinish
should also be handled accordingly. UpdateduseForm
'ssaveButtonProps.onClick
to catch the rejection without breaking the application. -
#5754
56ed144a0f5
Thanks @alicanerdurmaz! - chore: TypeScript upgraded to v5.x.x. #5752 -
#5765
0c197d82393
Thanks @aliemir! - fix: broken eslint plugin for removing test ids from componentsEslint plugin to remove test ids from components was broken and might miss some test ids to be included in the bundles.
-
#5808
10ba9c34490
Thanks @aliemir! - refactor: moved internal logic of buttons to respective hooks from@refinedev/core
We've moved the internal logic of buttons to their respective hooks in the
@refinedev/core
package to ensure consistency and reduce duplication. This change will make it easier to manage and maintain the buttons across different UI integrations of Refine. This will also benefit the users who want to customize the buttons viaswizzle
option or create their own buttons withouth having to duplicate the logic. -
#5755
404b2ef5e1b
Thanks @BatuhanW! - fix: incorrect type imports -
Updated dependencies [
0c197d82393
,56ed144a0f5
]:- @refinedev/ui-types@1.22.5
- #5695
79865affa1c
Thanks @BatuhanW! - chore: apply biome format and fix lint errors.
- #5573
546df06482
Thanks @alicanerdurmaz! - chore: add "use client" directive to exported files to work with nextjs app router
-
#5568
f1244819ad
Thanks @alicanerdurmaz! - feat:notificationProvider
is deprecated due to consistent naming convention between UI libraries. Please useuseNotificationProvider
export as your notification provider. #5567 -
#5564
1bb7d30888
Thanks @alicanerdurmaz! - feat:<ThemedTitleV2 />'s
default icon updated.
-
#5429
3bc130e475
Thanks @alicanerdurmaz! - fix:useNotification.close("notification-key")
not working. Resolves #5433 -
#5465
00e00cbd98
Thanks @aliemir! - Fixed the type issue betweenremark-gfm
andreact-markdown
. #5463
-
#5425
190af9fce2
Thanks @aliemir! - Updated@refinedev/core
peer dependencies to latest (^4.46.1
) -
Updated dependencies [
190af9fce2
]:- @refinedev/ui-types@1.22.4
-
#5307
f8e407f850
Thanks @jackprogramsjp! - feat: addedhideForm
props forLoginPage
andRegisterPage
forAuthPage
feature.Now with the
hideForm
props feature, you can be able to hide the forms (like email/password) to only show the OAuth providers. This avoids having to make your own entire AuthPage.
-
#5269
a23a0945d3
Thanks @BatuhanW! - feat: add "autoComplete" field for Login pages. -
#5325
7ff54b2060
Thanks @alicanerdurmaz! - fix:<AuthPage />
styling issues on mobile screens.chore: new tests are added to
<AuthPage />
.
- #5259
eac3df87ffb
Thanks @aliemir! - Updated<AutoSaveIndicator />
component to extend the<AutoSaveIndicator />
from@refinedev/core
with custom elements and render appropriate element based on the state.
-
#5199
2b8d658a17a
Thanks @aliemir! - Updated the return type of theuseSelect
hook to only include properties that actually being returned from the hook. Previously, the return type included all properties of theSelect
component, which was not correct. -
#5199
2b8d658a17a
Thanks @aliemir! - NowuseSelect
hook accepts 4th generic typeTOption
which allows you to change the type of options. By defaultTOption
will be equal toBaseOption
type which is{ label: any; value: any; }
. If you want to change the type of options, you can do it like this:In PR #5160 the type convertion of the options are tried to be resolved by string conversion. This is not correct due to the fact that the
value
property of the option can be of any type. This was breaking the connection between the forms and the select inputs.This change is reverted in the
@refinedev/core
, now changed the types and the logic to reflect the correct values of options with the ability to change it via 4th generic typeTOption
ofuseSelect
hook.Mantine's
<Select />
component only allows values to bestring
. In a case of avalue
not beingstring
, you'll be able to manipulate the options via mapping the options before using them.Here's how to get the proper types for the options and fix the value type issue:
import { Select } from "@mantine/core"; import { HttpError } from "@refinedev/core"; import { useSelect } from "@refinedev/mantine"; type IPost = { id: number; title: string; description: string; }; type IOption = { value: IPost["id"]; label: IPost["title"] }; const MyComponent = () => { const { selectProps } = useSelect<IPost, HttpError, IPost, IOption>({ resource: "posts", }); // This will result in `selectProps.data` to be of type `IOption[]`. // <Select /> will not accept `value` as `number` so you'll have to map the options. return ( <Select {...selectProps} data={selectProps.data.map((option) => ({ ...option, value: option.value.toString(), }))} /> ); };
-
#5201
760cfbaaa2a
Thanks @aliemir! - Updated initial value setting logic inuseForm
to handle nested objects properly.
-
#5199
2b8d658a17a
Thanks @aliemir! - Updated the return type of theuseSelect
hook to only include properties that actually being returned from the hook. Previously, the return type included all properties of theSelect
component, which was not correct. -
#5199
2b8d658a17a
Thanks @aliemir! - NowuseSelect
hook accepts 4th generic typeTOption
which allows you to change the type of options. By defaultTOption
will be equal toBaseOption
type which is{ label: any; value: any; }
. If you want to change the type of options, you can do it like this:In PR #5160 the type convertion of the options are tried to be resolved by string conversion. This is not correct due to the fact that the
value
property of the option can be of any type. This was breaking the connection between the forms and the select inputs.This change is reverted in the
@refinedev/core
, now changed the types and the logic to reflect the correct values of options with the ability to change it via 4th generic typeTOption
ofuseSelect
hook.Mantine's
<Select />
component only allows values to bestring
. In a case of avalue
not beingstring
, you'll be able to manipulate the options via mapping the options before using them.Here's how to get the proper types for the options and fix the value type issue:
import { Select } from "@mantine/core"; import { HttpError } from "@refinedev/core"; import { useSelect } from "@refinedev/mantine"; type IPost = { id: number; title: string; description: string; }; type IOption = { value: IPost["id"]; label: IPost["title"] }; const MyComponent = () => { const { selectProps } = useSelect<IPost, HttpError, IPost, IOption>({ resource: "posts", }); // This will result in `selectProps.data` to be of type `IOption[]`. // <Select /> will not accept `value` as `number` so you'll have to map the options. return ( <Select {...selectProps} data={selectProps.data.map((option) => ({ ...option, value: option.value.toString(), }))} /> ); };
-
#5201
760cfbaaa2a
Thanks @aliemir! - Updated initial value setting logic inuseForm
to handle nested objects properly.
- #5188
fc276fe53db
Thanks @BatuhanW! - chore: update README installation command
- #5188
fc276fe53db
Thanks @BatuhanW! - chore: update README installation command
-
#5026
a605e4cd318
Thanks @alicanerdurmaz! - feat: deprecated<ThemedLayout />
and<Layout />
components removed fromswizzle
. From now on, users can swizzle<ThemedLayoutV2 />
component instead.feat: swizzled
<ThemedLayoutV2 />
component destination changed tosrc/components/layout/
fromsrc/components/themedLayout
.
-
#5026
a605e4cd318
Thanks @alicanerdurmaz! - feat: deprecated<ThemedLayout />
and<Layout />
components removed fromswizzle
. From now on, users can swizzle<ThemedLayoutV2 />
component instead.feat: swizzled
<ThemedLayoutV2 />
component destination changed tosrc/components/layout/
fromsrc/components/themedLayout
.
-
#5022
80513a4e42f
Thanks @BatuhanW! - chore: update README.md- fix grammar errors.
- make all README.md files consistent.
- add code example code snippets.
-
#5022
80513a4e42f
Thanks @BatuhanW! - chore: update README.md- fix grammar errors.
- make all README.md files consistent.
- add code example code snippets.
- #4975
ff66a862e46
Thanks @aliemir! - Updated dependency of@tabler/icons
tov1.119.0
to fix the issue of using misconfigured versions. (Fixes #4921)
- #4975
ff66a862e46
Thanks @aliemir! - Updated dependency of@tabler/icons
tov1.119.0
to fix the issue of using misconfigured versions. (Fixes #4921)
- #4964
85b1ac0db5f
Thanks @BatuhanW! - chore: update @refinedev/core peer dependency versions.
- #4964
85b1ac0db5f
Thanks @BatuhanW! - chore: update @refinedev/core peer dependency versions.
- #4903
e327cadc011
Thanks @yildirayunlu! - feat: addinvalidateOnUnmount
prop touseForm
hook. feat: addinvalidateOnUnmount
andinvalidateOnClose
prop touseModalForm
anduseDrawerForm
hooks. From now on, you can use the use this props to invalidate queries upon unmount or close.
- #4903
e327cadc011
Thanks @yildirayunlu! - feat: addinvalidateOnUnmount
prop touseForm
hook. feat: addinvalidateOnUnmount
andinvalidateOnClose
prop touseModalForm
anduseDrawerForm
hooks. From now on, you can use the use this props to invalidate queries upon unmount or close.
-
#4953
07dd28d4142
Thanks @alicanerdurmaz! - fixed: broken Mantine documentation links on JSDoc. -
Updated dependencies [
04837c62077
]:- @refinedev/ui-types@1.22.2
-
#4953
07dd28d4142
Thanks @alicanerdurmaz! - fixed: broken Mantine documentation links on JSDoc. -
Updated dependencies [
04837c62077
]:- @refinedev/ui-types@1.22.1
- #4948
8e5efffbb23
Thanks @aliemir! - Keep the hook and component names in builds for better debugging.
- #4948
8e5efffbb23
Thanks @aliemir! - Keep the hook and component names in builds for better debugging.
-
#4788
38680378c7a
Thanks @salihozdemir! - fix: fix incorrect usage of collapse icon in<HeaderV2 />
fix: render user avatar and name in
<HeaderV2 />
based on user data fromauthProvider
.
-
#4788
38680378c7a
Thanks @salihozdemir! - fix: fix incorrect usage of collapse icon in<HeaderV2 />
fix: render user avatar and name in
<HeaderV2 />
based on user data fromauthProvider
.
- #4775
3052fb22449
Thanks @alicanerdurmaz! - fixed:<RefreshButton />
does not refresh content #4618. From now,<RefreshButton />
usesuseInvalidate
hook to refresh data instead ofuseOne
.
-
#4773
2af96197629
Thanks @alicanerdurmaz! - fixed: antduseModalForm
sends request twice whensyncWithLocation
is true -
Updated dependencies [
3052fb22449
]:- @refinedev/ui-types@1.22.0
- #4775
3052fb22449
Thanks @alicanerdurmaz! - fixed:<RefreshButton />
does not refresh content #4618. From now,<RefreshButton />
usesuseInvalidate
hook to refresh data instead ofuseOne
.
-
#4773
2af96197629
Thanks @alicanerdurmaz! - fixed: antduseModalForm
sends request twice whensyncWithLocation
is true -
Updated dependencies [
3052fb22449
]:- @refinedev/ui-types@1.21.0
- #4741
026ccf34356
Thanks @aliemir! - AddedsideEffects: false
topackage.json
to help bundlers tree-shake unused code.
- #4741
026ccf34356
Thanks @aliemir! - AddedsideEffects: false
topackage.json
to help bundlers tree-shake unused code.
-
#4652
96af6d25b7a
Thanks @alicanerdurmaz! - feat: when thedataProvider
returns rejected promise witherrors
field,useForm
will automatically update the error state with the rejectederrors
field.Refer to the server-side form validation documentation for more information. →
-
#4591
f8891ead2bd
Thanks @yildirayunlu! - feat:autoSave
feature forEdit
. useForm, useDrawerForm, useModalForm, useStepsForm hooks now acceptautoSave
object.enabled
is a boolean value anddebounce
is a number value in milliseconds.debounce
is optional and default value is1000
.const { autoSaveProps } = useForm({ refineCoreProps: { autoSave: { enabled: true, debounce: 2000, // not required, default is 1000 }, } }); return ( <Edit saveButtonProps={saveButtonProps} // pass autoSaveProps to Edit component autoSaveProps={autoSaveProps} > // form fields </Edit> );
feat: Add
<AutoSaveIndicator>
component. It comes automatically whenautoSaveProps
is given to theEdit
page. However, this component can be used to position it in a different place.import { AutoSaveIndicator } from "@refinedev/mantine"; const { autoSaveProps } = useForm({ refineCoreProps: { autoSave: { enabled: true, debounce: 2000, // not required, default is 1000 }, } }); return ( <div> <AutoSaveIndicator {...autoSaveProps}> </div> );
- Updated dependencies [
f8891ead2bd
]:- @refinedev/ui-types@1.20.0
-
#4652
96af6d25b7a
Thanks @alicanerdurmaz! - feat: when thedataProvider
returns rejected promise witherrors
field,useForm
will automatically update the error state with the rejectederrors
field.Refer to the server-side form validation documentation for more information. →
-
#4591
f8891ead2bd
Thanks @yildirayunlu! - feat:autoSave
feature forEdit
. useForm, useDrawerForm, useModalForm, useStepsForm hooks now acceptautoSave
object.enabled
is a boolean value anddebounce
is a number value in milliseconds.debounce
is optional and default value is1000
.const { autoSaveProps } = useForm({ refineCoreProps: { autoSave: { enabled: true, debounce: 2000, // not required, default is 1000 }, } }); return ( <Edit saveButtonProps={saveButtonProps} // pass autoSaveProps to Edit component autoSaveProps={autoSaveProps} > // form fields </Edit> );
feat: Add
<AutoSaveIndicator>
component. It comes automatically whenautoSaveProps
is given to theEdit
page. However, this component can be used to position it in a different place.import { AutoSaveIndicator } from "@refinedev/mantine"; const { autoSaveProps } = useForm({ refineCoreProps: { autoSave: { enabled: true, debounce: 2000, // not required, default is 1000 }, } }); return ( <div> <AutoSaveIndicator {...autoSaveProps}> </div> );
- Updated dependencies [
f8891ead2bd
]:- @refinedev/ui-types@1.19.0
-
#4629
58cc48b7b8f
Thanks @alicanerdurmaz! - fixed:description
prop does not show up in Mantine notification. With this fix, you can now usedescription
prop to show a description in the notification.import { useNotification } from "@refinedev/core"; const { open } = useNotification(); open?.({ description: "This is a description", message: "This is a message", type: "progress", });
-
#4629
58cc48b7b8f
Thanks @alicanerdurmaz! - fixed:description
prop does not show up in Mantine notification. With this fix, you can now usedescription
prop to show a description in the notification.import { useNotification } from "@refinedev/core"; const { open } = useNotification(); open?.({ description: "This is a description", message: "This is a message", type: "progress", });
-
#4502
c7872ca621f
Thanks @Mr0nline! - feat: ability to tweak active sider items navigationVisiting active sider items triggers page reloads due to them being links. We can now provide activeItemDisabled prop to disable such reloads.
- Updated dependencies [
c7872ca621f
]:- @refinedev/ui-types@1.18.0
-
#4502
c7872ca621f
Thanks @Mr0nline! - feat: ability to tweak active sider items navigationVisiting active sider items triggers page reloads due to them being links. We can now provide activeItemDisabled prop to disable such reloads.
- Updated dependencies [
c7872ca621f
]:- @refinedev/ui-types@1.17.0
-
#4523
18d446b1069
Thanks @yildirayunlu! - feat: implement following hooks haveuseLoadingOvertime
hook
-
#4527
ceadcd29fc9
Thanks @salihozdemir! - fix: prioritization of forgottenidentifier
If
identifier
is provided, it will be used instead ofname
.import { DeleteButton } from "@refinedev/mantine"; <DeleteButton resource="identifier-value" recordItemId="123" />;
fix: use translate keys with
identifier
Previously, the translate keys were generated using resource
name
. This caused issues when you had multipleresource
usage with the same name. Now thetranslate
keys are generated usingidentifier
if it's present.
-
#4523
18d446b1069
Thanks @yildirayunlu! - feat: implement following hooks haveuseLoadingOvertime
hook
-
#4527
ceadcd29fc9
Thanks @salihozdemir! - fix: prioritization of forgottenidentifier
If
identifier
is provided, it will be used instead ofname
.import { DeleteButton } from "@refinedev/mantine"; <DeleteButton resource="identifier-value" recordItemId="123" />;
fix: use translate keys with
identifier
Previously, the translate keys were generated using resource
name
. This caused issues when you had multipleresource
usage with the same name. Now thetranslate
keys are generated usingidentifier
if it's present.
-
#4449
cc84d61bc5c
Thanks @BatuhanW! - feat: updated Create, List, Show, Edit, Delete, Clone buttons to respect new globalaccessControlProvider
configuration.fix: Delete button's text wasn't rendered as
reason
field ofaccessControlProvider
.Given the following
can
method:const accessControlProvider: IAccessControlContext = { can: async (): Promise<CanReturnType> => { return { can: false, reason: "Access Denied!" }; }, };
If user is unauthorized,
Delete
button's text should beAccess Denied!
instead of defaultDelete
.This is the default behaviour for Create, List, Show, Edit, Delete, Clone buttons already.
-
#4449
cc84d61bc5c
Thanks @BatuhanW! - feat: updated Create, List, Show, Edit, Delete, Clone buttons to respect new globalaccessControlProvider
configuration.fix: Delete button's text wasn't rendered as
reason
field ofaccessControlProvider
.Given the following
can
method:const accessControlProvider: IAccessControlContext = { can: async (): Promise<CanReturnType> => { return { can: false, reason: "Access Denied!" }; }, };
If user is unauthorized,
Delete
button's text should beAccess Denied!
instead of defaultDelete
.This is the default behaviour for Create, List, Show, Edit, Delete, Clone buttons already.
- #4431
c29a3618cf6
Thanks @aliemir! - Updated the TSDoc comments to fix the broken links in the documentation.
- #4431
c29a3618cf6
Thanks @aliemir! - Updated the TSDoc comments to fix the broken links in the documentation.
-
#4404
f67967e8c87
Thanks @salihozdemir! - refactor: fix name and state inconsistency in<ThemedLayoutV2>
useSiderVisible
is deprecated, instead we created a new hookuseThemedLayoutContext
for it.useThemedLayoutContext
similar touseSiderVisible
but it returns more meaningful state names. However,useSiderVisible
is still available for backward compatibility.Updated
Sider
andHamburgerMenu
components usinguseThemedLayoutContext
.import { useThemedLayoutContext } from "@refinedev/mantine"; const { siderCollapsed, setSiderCollapsed, mobileSiderOpen, setMobileSiderOpen, } = useThemedLayoutContext();
-
#4404
f67967e8c87
Thanks @salihozdemir! - refactor: fix name and state inconsistency in<ThemedLayoutV2>
useSiderVisible
is deprecated, instead we created a new hookuseThemedLayoutContext
for it.useThemedLayoutContext
similar touseSiderVisible
but it returns more meaningful state names. However,useSiderVisible
is still available for backward compatibility.Updated
Sider
andHamburgerMenu
components usinguseThemedLayoutContext
.import { useThemedLayoutContext } from "@refinedev/mantine"; const { siderCollapsed, setSiderCollapsed, mobileSiderOpen, setMobileSiderOpen, } = useThemedLayoutContext();
- #4391
5fcc36c0272
Thanks @alicanerdurmaz! - added: name attribute to input fields inforgotPassword
,register
andupdatePassword
forms
- #4391
5fcc36c0272
Thanks @alicanerdurmaz! - added: name attribute to input fields inforgotPassword
,register
andupdatePassword
forms
- #4316
4690c627e05
Thanks @yildirayunlu! - fix: fixedclassName
for easier selection of all buttons and titles of CRUD components
- #4316
4690c627e05
Thanks @yildirayunlu! - fix: fixedclassName
for easier selection of all buttons and titles of CRUD components
-
#4306
e6eb4dea627
Thanks @yildirayunlu! - feat:syncWithLocation.syncId
default totrue
foruseModalForm
. -
#4303
0c569f42b4e
Thanks @alicanerdurmaz! - feat: added default button props into the renderer functionsheaderButtons
andfooterButtons
in CRUD components. Now, customization of the header and footer buttons can be achieved without losing the default functionality.import { DeleteButton, EditButton, ListButton, RefreshButton, Show, } from "@refinedev/mantine"; const PostShow = () => { return ( <Show headerButtons={({ deleteButtonProps, editButtonProps, listButtonProps, refreshButtonProps, }) => { return ( <> {/* custom components */} {listButtonProps && ( <ListButton {...listButtonProps} meta={{ foo: "bar" }} /> )} {editButtonProps && ( <EditButton {...editButtonProps} meta={{ foo: "bar" }} /> )} {deleteButtonProps && ( <DeleteButton {...deleteButtonProps} meta={{ foo: "bar" }} /> )} <RefreshButton {...refreshButtonProps} meta={{ foo: "bar" }} /> </> ); }} > {/* ... */} </Show> ); };
-
#4312
9a5f79186c1
Thanks @yildirayunlu! - feat: addedclassName
for easier selection of all buttons and titles of CRUD components -
Updated dependencies [
0c569f42b4e
,9a5f79186c1
]:- @refinedev/ui-types@1.16.0
-
#4306
e6eb4dea627
Thanks @yildirayunlu! - feat:syncWithLocation.syncId
default totrue
foruseModalForm
. -
#4303
0c569f42b4e
Thanks @alicanerdurmaz! - feat: added default button props into the renderer functionsheaderButtons
andfooterButtons
in CRUD components. Now, customization of the header and footer buttons can be achieved without losing the default functionality.import { DeleteButton, EditButton, ListButton, RefreshButton, Show, } from "@refinedev/mantine"; const PostShow = () => { return ( <Show headerButtons={({ deleteButtonProps, editButtonProps, listButtonProps, refreshButtonProps, }) => { return ( <> {/* custom components */} {listButtonProps && ( <ListButton {...listButtonProps} meta={{ foo: "bar" }} /> )} {editButtonProps && ( <EditButton {...editButtonProps} meta={{ foo: "bar" }} /> )} {deleteButtonProps && ( <DeleteButton {...deleteButtonProps} meta={{ foo: "bar" }} /> )} <RefreshButton {...refreshButtonProps} meta={{ foo: "bar" }} /> </> ); }} > {/* ... */} </Show> ); };
-
#4312
9a5f79186c1
Thanks @yildirayunlu! - feat: addedclassName
for easier selection of all buttons and titles of CRUD components -
Updated dependencies [
0c569f42b4e
,9a5f79186c1
]:- @refinedev/ui-types@1.15.0
-
#4295
7f24a6a2b14
Thanks @salihozdemir! - chore: bump to latest version of@refinedev/ui-types
-
Updated dependencies [
dc62abc890f
]:- @refinedev/ui-types@1.14.0
- #4295
7f24a6a2b14
Thanks @salihozdemir! - chore: bump to latest version of@refinedev/ui-types
-
#4277
7172c1b42d2
Thanks @salihozdemir! - fix: renamed the<ThemedHeaderV2/>
propisSticky
tosticky
To provide backwards compatibility, the old prop name is still supported, but it is deprecated and will be removed in the next major version.
Example:
import { Refine } from "@refinedev/core"; import { ThemedLayoutV2, ThemedHeaderV2 } from "@refinedev/antd"; // or @refinedev/chakra-ui, @refinedev/mui, @refinedev/mantine const App: React.FC = () => { return ( <Refine ... > <ThemedLayoutV2 Header={() => <ThemedHeaderV2 sticky />} > {/* ... */} </ThemedLayoutV2> </Refine> ); };
-
#4277
7172c1b42d2
Thanks @salihozdemir! - fix: renamed the<ThemedHeaderV2/>
propisSticky
tosticky
To provide backwards compatibility, the old prop name is still supported, but it is deprecated and will be removed in the next major version.
Example:
import { Refine } from "@refinedev/core"; import { ThemedLayoutV2, ThemedHeaderV2 } from "@refinedev/antd"; // or @refinedev/chakra-ui, @refinedev/mui, @refinedev/mantine const App: React.FC = () => { return ( <Refine ... > <ThemedLayoutV2 Header={() => <ThemedHeaderV2 sticky />} > {/* ... */} </ThemedLayoutV2> </Refine> ); };
-
#4277
7172c1b42d2
Thanks @salihozdemir! - fix: renamed the<ThemedHeaderV2/>
propisSticky
tosticky
To provide backwards compatibility, the old prop name is still supported, but it is deprecated and will be removed in the next major version.
Example:
import { Refine } from "@refinedev/core"; import { ThemedLayoutV2, ThemedHeaderV2 } from "@refinedev/antd"; // or @refinedev/chakra-ui, @refinedev/mui, @refinedev/mantine const App: React.FC = () => { return ( <Refine ... > <ThemedLayoutV2 Header={() => <ThemedHeaderV2 sticky />} > {/* ... */} </ThemedLayoutV2> </Refine> ); };
- #4255
9694245718c
Thanks @alicanerdurmaz! - fixed:ThemedLayoutContextProvider
import path in internal usage.
- #4255
9694245718c
Thanks @alicanerdurmaz! - fixed:ThemedLayoutContextProvider
import path in internal usage.
- #4241
fbe109b5a8b
Thanks @salihozdemir! - Added new generic types to theuseForm
hooks. Now you can pass the query types and the mutation types to the hook.
- #4241
fbe109b5a8b
Thanks @salihozdemir! - Added new generic types to theuseForm
hooks. Now you can pass the query types and the mutation types to the hook.
-
#4232
c99bc0ad7f7
Thanks @alicanerdurmaz! - feat:initialSiderCollapsed
added toRefineThemedLayoutV2Props
to control initial state of<ThemedSiderV2>
. From now on, you can control the initial collapsed state of<ThemedSiderV2>
by passing theinitialSiderCollapsed
prop to<ThemedLayoutV2>
.<ThemedLayoutV2 initialSiderCollapsed={true} // This will make the sider collapsed by default > {/* .. */} </ThemedLayoutV2>
-
#4209
3f4b5fef76f
Thanks @yildirayunlu! - feat: addisSticky
prop toThemedHeaderV2
componentimport { ThemedHeaderV2, ThemedLayoutV2 } from "@refinedev/mantine"; const CustomHeader = () => <ThemedHeaderV2 isSticky={true} />; const App = () => ( <Refine> // ... <ThemedLayoutV2 Header={CustomHeader}> <Outlet /> </ThemedLayoutV2> // ... </Refine> );
-
#4223
c2ca3a67b22
Thanks @aliemir! - Fixed theErrorComponent
height overflow issue which was causing header to be unresponsive. -
Updated dependencies [
c99bc0ad7f7
,3f4b5fef76f
]:- @refinedev/ui-types@1.12.0
-
#4232
c99bc0ad7f7
Thanks @alicanerdurmaz! - feat:initialSiderCollapsed
added toRefineThemedLayoutV2Props
to control initial state of<ThemedSiderV2>
. From now on, you can control the initial collapsed state of<ThemedSiderV2>
by passing theinitialSiderCollapsed
prop to<ThemedLayoutV2>
.<ThemedLayoutV2 initialSiderCollapsed={true} // This will make the sider collapsed by default > {/* .. */} </ThemedLayoutV2>
-
#4209
3f4b5fef76f
Thanks @yildirayunlu! - feat: addisSticky
prop toThemedHeaderV2
componentimport { ThemedHeaderV2, ThemedLayoutV2 } from "@refinedev/mantine"; const CustomHeader = () => <ThemedHeaderV2 isSticky={true} />; const App = () => ( <Refine> // ... <ThemedLayoutV2 Header={CustomHeader}> <Outlet /> </ThemedLayoutV2> // ... </Refine> );
-
#4223
c2ca3a67b22
Thanks @aliemir! - Fixed theErrorComponent
height overflow issue which was causing header to be unresponsive. -
Updated dependencies [
c99bc0ad7f7
,3f4b5fef76f
]:- @refinedev/ui-types@1.11.0
-
#4176
13448252cd7
Thanks @yildirayunlu! - feat: addThemedLayoutV2
andHamburgerMenu
componentThemeLayout
is deprecated. AddedThemedLayoutV2
instead. This update fixed some UI problems in the layout. Also, with the new<HamburgerMenu />
component, it's easier to collapse/uncollapse theSider
.See here for detailed migration guideline.
-
#4176
13448252cd7
Thanks @yildirayunlu! - feat: addThemedLayoutV2
andHamburgerMenu
componentThemeLayout
is deprecated. AddedThemedLayoutV2
instead. This update fixed some UI problems in the layout. Also, with the new<HamburgerMenu />
component, it's easier to collapse/uncollapse theSider
.See here for detailed migration guideline.
-
#4113
1c13602e308
Thanks @salihozdemir! - Added missing third generic parameter to hooks which are usinguseQuery
internally.For example:
import { useOne, HttpError } from "@refinedev/core"; const { data } = useOne<{ count: string }, HttpError, { count: number }>({ resource: "product-count", queryOptions: { select: (rawData) => { return { data: { count: Number(rawData?.data?.count), }, }; }, }, }); console.log(typeof data?.data.count); // number
-
#4131
0e7ee8876df
Thanks @alicanerdurmaz! - - Fixed:<ThemedSider>
logout icon alignment.<LogoutButton>
icon changed to<IconPower>
fromIconLogout
.
- #4113
1c13602e308
Thanks @salihozdemir! - Updated the generic type name of hooks that useuseQuery
to synchronize generic type names withtanstack-query
.
- #4122
a36b17e86ba
Thanks @alicanerdurmaz! - - Fixed:warnWhenUnsavedChanges
was throwing even when there were no changes.
- #4122
a36b17e86ba
Thanks @alicanerdurmaz! - - Fixed:warnWhenUnsavedChanges
was throwing even when there were no changes.
- #4120
1f310bd7b69
Thanks @aliemir! - Fix brokenuseModalForm
withcreate
actions.
- #4120
1f310bd7b69
Thanks @aliemir! - Fix brokenuseModalForm
withcreate
actions.
- #4072
fad40e6237f
Thanks @alicanerdurmaz! - -<Layout>
is deprecated. use<ThemedLayout>
instead with 100% backward compatibility. - https://refine.dev/docs/api-reference/mantine/components/mantine-themed-layout
- #4114
afdaed3dd83
Thanks @aliemir! - UpdateduseModalForm
hook'smodal.show
method to check if there's anid
present or provided. If there is, it will continue to show the modal. If not, the modal will not show. (Resolves #4062)
- #4072
fad40e6237f
Thanks @alicanerdurmaz! - -<Layout>
is deprecated. use<ThemedLayout>
instead with 100% backward compatibility. - https://refine.dev/docs/api-reference/mantine/components/mantine-themed-layout
- #4114
afdaed3dd83
Thanks @aliemir! - UpdateduseModalForm
hook'smodal.show
method to check if there's anid
present or provided. If there is, it will continue to show the modal. If not, the modal will not show. (Resolves #4062)
-
#4076
0c787747f38
Thanks @alicanerdurmaz! - - ThewrapperStyles
properties of<ThemedSider>
's<ThemedTitle>
have been moved to the parent component. As a result, it is now possible to pass a custom<Title>
component to<ThemedLayout>
that will be styled correctly. -
#4083
7dbb4b0d400
Thanks @alicanerdurmaz! - -ThemedTitle
cursor is now a pointer when hovering over the logo.
-
#4076
0c787747f38
Thanks @alicanerdurmaz! - - ThewrapperStyles
properties of<ThemedSider>
's<ThemedTitle>
have been moved to the parent component. As a result, it is now possible to pass a custom<Title>
component to<ThemedLayout>
that will be styled correctly. -
#4083
7dbb4b0d400
Thanks @alicanerdurmaz! - -ThemedTitle
cursor is now a pointer when hovering over the logo.
-
#3996
327be2be623
Thanks @alicanerdurmaz! - -RefineThemes
added. It contains predefined colors for the Mantine components.import { Refine } from "@refinedev/core"; import { RefineThemes } from "@refinedev/mantine"; import dataProvider from "@refinedev/simple-rest"; const App = () => { // --- return ( <MantineProvider theme={RefineThemes.Magenta}> <Refine dataProvider={dataProvider("YOUR_API_URL")}> {/** your app here */} </Refine> </MantineProvider> ); };
- default title with icon added to
AuthPage
. It uses<ThemedTitle>
component from@refinedev/mantine
. You can remove it by settingtitle
prop tofalse
.
import { AuthPage, ThemedTitle } from "@refinedev/mantine"; const MyLoginPage = () => { return ( <AuthPage type="login" title={ <ThemedTitle title="My Title" icon={<img src="https://refine.dev/img/logo.png" />} /> } /> ); };
title
prop added toAuthPage
'srenderContent
prop to use in the custom content.
import { Box, Text } from "@mantine/core"; import { AuthPage } from "@refinedev/mantine"; const MyLoginPage = () => { return ( <AuthPage contentProps={{ style: { width: "400px", }, }} renderContent={(content: React.ReactNode, title: React.ReactNode) => { return ( <Box bg="white" borderRadius="md" px="5" display="flex" flexDirection="column" justifyContent="center" alignItems="center" > {title} <Text>Extra Header</Text> {content} <Text>Extra Footer</Text> </Box> ); }} /> ); };
-
<ThemedLayout>
,<ThemedSider>
,<ThemedTitle>
,<ThemedHeader>
created to use theme colors. -
<EditButton>
in<Show>
color changed tobrand
. -
<CreateButton>
color changed tobrand
. -
<AuthPage>
component uses colors from the theme. -
<ThemedTitle>
added toAuthPage
- default title with icon added to
- #3974
4dcc20d6a60
Thanks @salihozdemir! - Deprecated theWelcomePage
component. It'll be used from@refinedev/core
instead.
-
#3996
327be2be623
Thanks @alicanerdurmaz! - -RefineThemes
added. It contains predefined colors for the Mantine components.import { Refine } from "@refinedev/core"; import { RefineThemes } from "@refinedev/mantine"; import dataProvider from "@refinedev/simple-rest"; const App = () => { // --- return ( <MantineProvider theme={RefineThemes.Magenta}> <Refine dataProvider={dataProvider("YOUR_API_URL")}> {/** your app here */} </Refine> </MantineProvider> ); };
- default title with icon added to
AuthPage
. It uses<ThemedTitle>
component from@refinedev/mantine
. You can remove it by settingtitle
prop tofalse
.
import { AuthPage, ThemedTitle } from "@refinedev/mantine"; const MyLoginPage = () => { return ( <AuthPage type="login" title={ <ThemedTitle title="My Title" icon={<img src="https://refine.dev/img/logo.png" />} /> } /> ); };
title
prop added toAuthPage
'srenderContent
prop to use in the custom content.
import { Box, Text } from "@mantine/core"; import { AuthPage } from "@refinedev/mantine"; const MyLoginPage = () => { return ( <AuthPage contentProps={{ style: { width: "400px", }, }} renderContent={(content: React.ReactNode, title: React.ReactNode) => { return ( <Box bg="white" borderRadius="md" px="5" display="flex" flexDirection="column" justifyContent="center" alignItems="center" > {title} <Text>Extra Header</Text> {content} <Text>Extra Footer</Text> </Box> ); }} /> ); };
-
<ThemedLayout>
,<ThemedSider>
,<ThemedTitle>
,<ThemedHeader>
created to use theme colors. -
<EditButton>
in<Show>
color changed tobrand
. -
<CreateButton>
color changed tobrand
. -
<AuthPage>
component uses colors from the theme. -
<ThemedTitle>
added toAuthPage
- default title with icon added to
- #3974
4dcc20d6a60
Thanks @salihozdemir! - Deprecated theWelcomePage
component. It'll be used from@refinedev/core
instead.
-
#3975
b1e6e32f9a1
Thanks @alicanerdurmaz! - - Fixed the unsaved changes dialog is popping up unexpectedly when the user clicks the logs out.- The `<ThemedSider>`'s `onClick` handler was changed to use the `window.confirm` API to manage the confirmation dialog.
<RefineThemes>
colors updated to match the new theme colors.
-
Updated dependencies [
2798f715361
]:- @refinedev/ui-types@1.5.0
-
#3975
b1e6e32f9a1
Thanks @alicanerdurmaz! - - Fixed the unsaved changes dialog is popping up unexpectedly when the user clicks the logs out.- The `<ThemedSider>`'s `onClick` handler was changed to use the `window.confirm` API to manage the confirmation dialog.
<RefineThemes>
colors updated to match the new theme colors.
-
Updated dependencies [
2798f715361
]:- @refinedev/ui-types@1.4.0
- #3956
c54714ed9ab
Thanks @salihozdemir! - Fixed an issue where the<NumberField />
component would throw an error if thevalue
prop was set toundefined
.
- #3956
c54714ed9ab
Thanks @salihozdemir! - Fixed an issue where the<NumberField />
component would throw an error if thevalue
prop was set toundefined
.
- #3954
7dc9686f83b
Thanks @salihozdemir! - Fixed an issue where the form dirty state was not reset after setting initial values. This caused the form to be dirty even though changes were not made. For this reason, the<UnSavedChangesNotifier>
always warned when user tried to leave page.
-
#3948
b4950503334
Thanks @salihozdemir! - Fixed the unsaved changes dialog is popping up unexpectedly when the user clicks the delete button or logs out, when the form is dirty.- The
<DeleteButton>
already has a confirmation dialog, so the alert was removed. - The
<Sider>
'sonClick
handler was changed to use thewindow.confirm
API to manage the confirmation dialog.
- The
-
#3948
b4950503334
Thanks @salihozdemir! - Fixed the unsaved changes dialog is popping up unexpectedly when the user clicks the delete button or logs out, when the form is dirty.- The
<DeleteButton>
already has a confirmation dialog, so the alert was removed. - The
<Sider>
'sonClick
handler was changed to use thewindow.confirm
API to manage the confirmation dialog.
- The
- #3912
0ffe70308b2
Thanks @alicanerdurmaz! - -title
prop added toAuthPage
'srenderContent
prop to use in the custom content.title
prop added toAuthPage
to render a custom title.⚠️ These features have not been implemented yet. Only types were added. It will be implemented in the next release.
- Updated dependencies [
0ffe70308b2
]:- @refinedev/ui-types@1.3.0
- #3912
0ffe70308b2
Thanks @alicanerdurmaz! - -title
prop added toAuthPage
'srenderContent
prop to use in the custom content.title
prop added toAuthPage
to render a custom title.⚠️ These features have not been implemented yet. Only types were added. It will be implemented in the next release.
- Updated dependencies [
0ffe70308b2
]:- @refinedev/ui-types@1.2.0
-
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk!
meta
prop is added. To ensure backward compatibility,metaData
prop will be used ifmeta
prop is not provided. -
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk! Updated the components to match the changes in routing system of
@refinedev/core
.This includes
meta
props in buttons andSider
component.meta
property can be used to pass additional parameters to the navigation paths.For a
posts
resource definition like this:<Refine resources={[ { name: "posts", list: "/posts", show: "/:authorId/posts/:id", } ]} >
You can pass
authorId
to theShowButton
component like this:<ShowButton resource="posts" id="1" meta={{ authorId: 123 }}>
This will navigate to
/123/posts/1
path.useModalForm
hook now supportsyncWithLocation
prop. This prop can be used to sync the visibility state of them with the location via query params.You can pass a boolean or an object with
key
andsyncId
properties.-
key
is used to define the query param key. Default value is inferred from the resource and the action. For exampleposts-create
forposts
resource andcreate
action. -
syncId
is used to include theid
property in the query param key. Default value isfalse
. This is useful foredit
andclone
actions.
ignoreAccessControlProvider
prop is removed from buttons. -
-
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk!
useSelect
'ssort
prop is now deprecated. Usesorters
prop instead.
useSelect({ - sort, + sorters, })
-
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk!
<ReadyPage>
isnow deprecated.- Created a
<WelcomePage>
component to welcome users.
-
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk!
@refinedev/codemod
package handles the breaking changes for your project automatically, without any manual steps. It migrates your project from3.x.x
to4.x.x
.Just
cd
into root folder of your project (wherepackage.json
is contained) and run this command:npx @refinedev/codemod@latest refine3-to-refine4
And it's done. Now your project uses
refine@4.x.x
.All Mantine components re-exported from
@refinedev/mantine
have been removed. You should import them from Mantine packages directly.If the packages are not installed, you can install them with your package manager:
You don't have to install all of these packages below. Only install the packages you use.
npm install @mantine/core@5 @emotion/react @mantine/hooks@5 @mantine/notifications@5 @mantine/form@5 # or pnpm add @mantine/core@5 @emotion/react @mantine/hooks@5 @mantine/notifications@5 @mantine/form@5 # or yarn add @mantine/core@5 @emotion/react @mantine/hooks@5 @mantine/notifications@5 @mantine/form@5
After that, you can import them from related packages directly.
- import { - MantineProvider, - NotificationsProvider, - TextInput, - Select, - List, - useSelect, - } from "@refinedev/mantine"; + import { useSelect, List } from "@refinedev/mantine"; + import { MantineProvider, TextInput, Select } from "@mantine/core"; + import { NotificationsProvider } from "@mantine/notifications";
-
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk! Added legacy auth provider and new auth provider support to all components and hooks.
-
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk! Updated buttons with
resource
property.resourceNameOrRouteName
is now deprecated but kept working until next major version. -
Thanks @aliemir, @alicanerdurmaz, @batuhanW, @salihozdemir, @yildirayunlu, @recepkutuk! Moving to the
@refinedev
scope 🎉🎉Moved to the
@refinedev
scope and updated our packages to use the new scope. From now on, all packages will be published under the@refinedev
scope with their new names.Now, we're also removing the
refine
prefix from all packages. So, the@pankod/refine-core
package is now@refinedev/core
,@pankod/refine-antd
is now@refinedev/antd
, and so on.
- #3822
0baa99ba787
Thanks @BatuhanW! - - refine v4 release announcement added to "postinstall". - refine v4 is released 🎉 The new version is 100% backward compatible. You can upgrade to v4 with a single command! See the migration guide here: https://refine.dev/docs/migration-guide/3x-to-4x
- Updated dependencies [
0baa99ba787
]:- @pankod/refine-ui-types@0.16.0
- #3822
0baa99ba787
Thanks @BatuhanW! - - refine v4 release announcement added to "postinstall". - refine v4 is released 🎉 The new version is 100% backward compatible. You can upgrade to v4 with a single command! See the migration guide here: https://refine.dev/docs/migration-guide/3x-to-4x
- Updated dependencies [
0baa99ba787
]:- @pankod/refine-ui-types@0.15.0
- #3606
00c9a5c471a
Thanks @aliemir! - Fixed the issue withdisabled
state inDeleteButton
's still opening the popover.
- #3606
00c9a5c471a
Thanks @aliemir! - Fixed the issue withdisabled
state inDeleteButton
's still opening the popover.
- #3382
6604586b030
Thanks @alicanerdurmaz! - added: description ofStepProps
to the jsDoc of theuseStepForm
hook.
- #3382
6604586b030
Thanks @alicanerdurmaz! - added: description ofStepProps
to the jsDoc of theuseStepForm
hook.
- #3396
bb2774e3941
Thanks @omeraplak! - fix:onSubmit
is set to nullable on<AuthPage>
- #3396
bb2774e3941
Thanks @omeraplak! - fix:onSubmit
is set to nullable on<AuthPage>
- #3228
5aabfa19493
Thanks @aliemir! - Fixed useForm's saveButtonProps.onClick event type
- #3228
5aabfa19493
Thanks @aliemir! - Fixed useForm's saveButtonProps.onClick event type
-
#3220
b867497f469
Thanks @aliemir! - Updated image links inREADME.MD
with CDN -
Updated dependencies [
b867497f469
]:- @pankod/refine-ui-types@0.14.2
-
#3220
b867497f469
Thanks @aliemir! - Updated image links inREADME.MD
with CDN -
Updated dependencies [
b867497f469
]:- @pankod/refine-ui-types@0.14.1
- #3159
af2eefb32a4
Thanks @aliemir! - UpdatedLoginPage
andReadyPage
to use refine logos from CDN rather than bundled svg files.
- #3159
af2eefb32a4
Thanks @aliemir! - UpdatedLoginPage
andReadyPage
to use refine logos from CDN rather than bundled svg files.
- #3128
db1000a7628
Thanks @alicanerdurmaz! - Fixed:crud
components import path changed to relative path due to export issues on build.
- #3128
db1000a7628
Thanks @alicanerdurmaz! - Fixed:crud
components import path changed to relative path due to export issues on build.
- #3109
16549ed3012
Thanks @aliemir! - Updatedswizzle
items and their messages to include extra information and usage examples.
- #3109
16549ed3012
Thanks @aliemir! - Updatedswizzle
items and their messages to include extra information and usage examples.
- #3062
6c2ed708a9a
Thanks @aliemir! - - Updated components and their type imports to make them compatible withswizzle
feature.- Added
refine.config.js
to configure theswizzle
feature.
- Added
- #3062
6c2ed708a9a
Thanks @aliemir! - - Updated components and their type imports to make them compatible withswizzle
feature.- Added
refine.config.js
to configure theswizzle
feature.
- Added
-
#3027
177d0a764fe
Thanks @aliemir! - FixLayout
component forTable
overflows.Table
was not respecting the flex layout even insideScrollArea
component. This was causing the table to overflow the parent container. -
#3027
177d0a764fe
Thanks @aliemir! - Fixed shrink issue for Layout -
#3027
177d0a764fe
Thanks @aliemir! - Added...rest
props toMarkdownField
component -
#3027
177d0a764fe
Thanks @aliemir! - FixedTagField
prop types.
-
#3027
177d0a764fe
Thanks @aliemir! - FixLayout
component forTable
overflows.Table
was not respecting the flex layout even insideScrollArea
component. This was causing the table to overflow the parent container. -
#3027
177d0a764fe
Thanks @aliemir! - Fixed shrink issue for Layout -
#3027
177d0a764fe
Thanks @aliemir! - Added...rest
props toMarkdownField
component -
#3027
177d0a764fe
Thanks @aliemir! - FixedTagField
prop types.
- #3011
593531713c3
Thanks @aliemir! - Fixed<NumberField />
type for missingvalue
prop type, which was erroring out when using<NumberField />
.
- #3011
593531713c3
Thanks @aliemir! - Fixed<NumberField />
type for missingvalue
prop type, which was erroring out when using<NumberField />
.
-
#2969
a9459550a4
Thanks @omeraplak! - FixedtransformValues
generics inuseForm
,useModalForm
anduseStepForm
hooks. -
#2969
a9459550a4
Thanks @omeraplak! - Fixed peerDependencies of packages
-
#2969
a9459550a4
Thanks @omeraplak! - FixedtransformValues
generics inuseForm
,useModalForm
anduseStepForm
hooks. -
#2969
a9459550a4
Thanks @omeraplak! - Fixed peerDependencies of packages
- #2970
513c078df1
Thanks @salihozdemir! - Added padding to ReadyPage component.
- #2970
513c078df1
Thanks @salihozdemir! - Added padding to ReadyPage component.
-
#2872
da3fc4a702
Thanks @TDP17! - Feat: Added ability to manage breadcrumb component globally via optionsThe option set in individual CRUD components takes priority over the global option
-
#2872
da3fc4a702
Thanks @TDP17! - Feat: Added ability to manage breadcrumb component globally via optionsThe option set in individual CRUD components takes priority over the global option
-
#2857
1d8b1820f4
Thanks @salihozdemir! - Fixed the<ReadyPage />
mobile view. -
#2857
1d8b1820f4
Thanks @salihozdemir! - Fixed the<ErrorComponent />
responsive view.
-
#2857
1d8b1820f4
Thanks @salihozdemir! - Fixed the<ReadyPage />
mobile view. -
#2857
1d8b1820f4
Thanks @salihozdemir! - Fixed the<ErrorComponent />
responsive view.
- #2869
d64e4a02c3
Thanks @alicanerdurmaz! - chore: @mantine/* package version fixed to 5.5.6 due to useForm issue
- #2856
21d0f19863
Thanks @alicanerdurmaz! - fixed: Mantine UserFormInput requires 2 type argument(s).
- #2856
21d0f19863
Thanks @alicanerdurmaz! - fixed: Mantine UserFormInput requires 2 type argument(s).
-
#2839
5388a338ab
Thanks @aliemir! - DeprecationignoreAccessControlProvider
prop on buttons is deprecated. UseaccessContro.enabled
instead.Features
accessControl.enabled
prop is added to buttons to enable/disable access control for buttons.accessControl.hideIfUnauthorized
prop is added to buttons to hide the button if access is denied. -
#2836
e43e9a17ae
Thanks @alicanerdurmaz! - added locales prop to date fields
-
#2838
f7968fa16f
Thanks @aliemir! - Fixed #2828 - Buttons were not respecting access control when navigating to a new page. Now, if button is disabled, it will not also block the navigation not just the onClick event. -
#2818
295fc2f773
Thanks @salihozdemir! - Added missingTitle
component export. -
Updated dependencies [
476285e342
,5388a338ab
,e43e9a17ae
]:- @pankod/refine-ui-types@0.14.0
- #2836
e43e9a17ae
Thanks @alicanerdurmaz! - added locales prop to date fields
- Updated dependencies [
e43e9a17ae
]:- @pankod/refine-ui-types@0.13.0
-
#2839
5388a338ab
Thanks @aliemir! - DeprecationignoreAccessControlProvider
prop on buttons is deprecated. UseaccessContro.enabled
instead.Features
accessControl.enabled
prop is added to buttons to enable/disable access control for buttons.accessControl.hideIfUnauthorized
prop is added to buttons to hide the button if access is denied.
-
#2838
f7968fa16f
Thanks @aliemir! - Fixed #2828 - Buttons were not respecting access control when navigating to a new page. Now, if button is disabled, it will not also block the navigation not just the onClick event. -
#2818
295fc2f773
Thanks @salihozdemir! - Added missingTitle
component export. -
Updated dependencies [
476285e342
,5388a338ab
]:- @pankod/refine-ui-types@0.12.0
-
- Updated the default false icon for the BooleanField component to be a cross instead of a minus.
- Updated the TextField export name to be "TextField" instead of "TextFieldComponent".
- Fixed the tsdoc links for the field components.
- #2799
78b61da700
Thanks @salihozdemir! - - Updated the default false icon for the BooleanField component to be a cross instead of a minus.- Updated the TextField export name to be "TextField" instead of "TextFieldComponent".
- Fixed the tsdoc links for the field components.
- Add primary color to
<SaveButton/>
's<ActionIcon/>
component.
- #2758
3960549907
Thanks @salihozdemir! - Add primary color to<SaveButton/>
's<ActionIcon/>
component.
- Fixed incorrectly used hooks in AuthPage component
- #2769
501aebe997
Thanks @dgelineau! - Fixed incorrectly used hooks in AuthPage component
- Fixed responsive design for mobile devices
- #2748
0eaddb65ee
Thanks @salihozdemir! - Fixed responsive design for mobile devices
-
- Added
<LoadingOverlay />
component to basic view components. - Update
goBack
prop usage, now it can be passed to<ActionButton />
's children. - Fixed the issue that when
title
prop is passed to basic views, the back button is not shown. - Default title size decreased from
h2
toh3
.
- Added
- Updated dependencies []:
- @pankod/refine-ui-types@0.11.4
- #2718
d78d2a2a99
Thanks @salihozdemir! - - Added<LoadingOverlay />
component to basic view components.- Update
goBack
prop usage, now it can be passed to<ActionButton />
's children. - Fixed the issue that when
title
prop is passed to basic views, the back button is not shown. - Default title size decreased from
h2
toh3
.
- Update
- Updated dependencies [
d78d2a2a99
]:- @pankod/refine-ui-types@0.11.3
- Fixed
providers
property empty array state in<AuthPage />
component
- Fixed
providers
property empty array state in<AuthPage />
component
- #2712
c434055011
Thanks @omeraplak! - Fixedproviders
property empty array state in<AuthPage />
component
- Updated
formProps
property on<AuthPage />
component
- Added
clearable
prop touseSelect
hook that istrue
by default.
- #2663
c624a52b23
Thanks @yildirayunlu! - UpdatedformProps
property on<AuthPage />
component
- #2701
ddd9eb3aff
Thanks @salihozdemir! - Addedclearable
prop touseSelect
hook that istrue
by default.
-
- Added new component core and mantine support.
- Move Auth types
@pankod/refine-ui-types
to@pankod/refine-core
- #2627
c5fb45d61f
Thanks @yildirayunlu! - - Added new component core and mantine support.- Move Auth types
@pankod/refine-ui-types
to@pankod/refine-core
- Move Auth types
- First release of
@pankod/refine-mantine
🎉
- #2505
a4dbb63c88
Thanks @salihozdemir! - First release of@pankod/refine-mantine
🎉
- Updated dependencies []:
- @pankod/refine-ui-types@0.11.0
- Updated dependencies [
a65525de6f
]:- @pankod/refine-ui-types@0.10.0
- Updated dependencies []:
- @pankod/refine-ui-types@0.9.0
- Updated dependencies [
ad99916d6d
]:- @pankod/refine-ui-types@0.8.0
-
Fixed version of react-router to
6.3.0
-
Updated dependencies []:
- @pankod/refine-ui-types@0.7.0
- #2501
4095a578d4
Thanks @omeraplak! - Fixed version of react-router to6.3.0