From 2789f1226a0fdf3d2f51c12d3a17c27ceb666a50 Mon Sep 17 00:00:00 2001 From: Edward Fitz Abucay Date: Sat, 21 Dec 2024 01:06:22 +0800 Subject: [PATCH] docs(chakra-ui-v3): add integration package for Chakra UI v3 This commit adds the integration support package link for Chakra UI v3. This is to support the latest version of Chakra UI. Signed-off-by: Edward Fitz Abucay --- .../docs/packages/list-of-packages/index.md | 1 + .../assets/integration-icons/chakra-v3.tsx | 44 +++++++++++++++++++ .../src/assets/integration-icons/index.ts | 1 + documentation/src/assets/integrations.ts | 17 +++++++ .../src/pages/integrations/index.tsx | 6 +++ 5 files changed, 69 insertions(+) create mode 100644 documentation/src/assets/integration-icons/chakra-v3.tsx diff --git a/documentation/docs/packages/list-of-packages/index.md b/documentation/docs/packages/list-of-packages/index.md index 2078bb10c5cd..0bc9c8dd0b04 100644 --- a/documentation/docs/packages/list-of-packages/index.md +++ b/documentation/docs/packages/list-of-packages/index.md @@ -79,3 +79,4 @@ To learn more about Live Providers, check out [Realtime](/docs/guides-concepts/r - [`@refine-auth/kinde-react`](https://github.com/hirenf14/refine-auth-kinde-react) - Support for [Kinde](https://kinde.com) authentication. - [`refine-pocketbase`](https://github.com/kruschid/refine-pocketbase) - Connector for backends created with [PocketBase](https://pocketbase.io/). Also has auth provider and live provider supports. - [`refine-postgrest-ts`](https://github.com/ffimnsr/refine-postgrest-ts) - Connector for [PostgREST](https://postgrest.org) backends. +- [`refine-chakra-ui-v3-ts`](https://github.com/ffimnsr/refine-chakra-ui-v3-ts) - Integration for [Chakra UI v3](https://www.chakra-ui.com). diff --git a/documentation/src/assets/integration-icons/chakra-v3.tsx b/documentation/src/assets/integration-icons/chakra-v3.tsx new file mode 100644 index 000000000000..94edf21ddba2 --- /dev/null +++ b/documentation/src/assets/integration-icons/chakra-v3.tsx @@ -0,0 +1,44 @@ +import * as React from "react"; +import type { SVGProps } from "react"; + +const SvgChakrav3 = ({ + withBrandColor = true, + ...props +}: SVGProps & { withBrandColor?: boolean }) => ( + + + + + + + + + + + + + + +); + +export default SvgChakrav3; diff --git a/documentation/src/assets/integration-icons/index.ts b/documentation/src/assets/integration-icons/index.ts index 67226bf9345c..2f32ef0cdacd 100644 --- a/documentation/src/assets/integration-icons/index.ts +++ b/documentation/src/assets/integration-icons/index.ts @@ -3,6 +3,7 @@ export { default as Airtable } from "./airtable"; export { default as Antd } from "./antd"; export { default as Appwrite } from "./appwrite"; export { default as Chakra } from "./chakra"; +export { default as Chakrav3 } from "./chakra-v3"; export { default as Directus } from "./directus"; export { default as Dp } from "./dp"; export { default as Elide } from "./elide"; diff --git a/documentation/src/assets/integrations.ts b/documentation/src/assets/integrations.ts index b2d00e49b4c1..41119b6852ce 100644 --- a/documentation/src/assets/integrations.ts +++ b/documentation/src/assets/integrations.ts @@ -35,6 +35,7 @@ import { PocketBase, ShadCnUI, PostgREST, + Chakrav3, } from "./integration-icons"; export const integrations: IntegrationsType = { @@ -151,6 +152,22 @@ export const integrations: IntegrationsType = { status: "stable", }, ], + "community-ui-framework-packages": [ + { + name: "Chakra UI v3", + icon: Chakrav3, + description: + " Chakra UI v3 Framework support. 20+ framework-specific components incl. Layout, Feedback, and CRUD components.", + url: "https://www.npmjs.com/package/@ffimnsr/refine-chakra-ui-v3", + status: "stable", + contributors: [ + { + name: "ffimnsr", + url: "https://github.com/ffimnsr", + }, + ], + }, + ], "community-data-provider-packages": [ { name: "Directus Data Provider", diff --git a/documentation/src/pages/integrations/index.tsx b/documentation/src/pages/integrations/index.tsx index 7c5771b565db..55f97e9fe396 100644 --- a/documentation/src/pages/integrations/index.tsx +++ b/documentation/src/pages/integrations/index.tsx @@ -47,6 +47,7 @@ const Integrations: React.FC = () => { const { communityPackages, dataProviderPackages, + communityUiFrameworkPackages, communityDataProviderPackages, frameworks, integrations, @@ -56,6 +57,8 @@ const Integrations: React.FC = () => { return { uiPackages: integrationsData["ui-framework-packages"], dataProviderPackages: integrationsData["data-provider-packages"], + communityUiFrameworkPackages: + integrationsData["community-ui-framework-packages"], communityDataProviderPackages: integrationsData["community-data-provider-packages"], frameworks: integrationsData["frameworks"], @@ -103,6 +106,9 @@ const Integrations: React.FC = () => { Data Provider Packages + UI Framework Packages by the Community ❤️ + + Data Provider Packages by the Community ❤️