From eb1e0595e97e57a5eb0b960a823066b50608cbff Mon Sep 17 00:00:00 2001 From: Gol-Orit Date: Mon, 9 Sep 2024 10:08:30 +0300 Subject: [PATCH 1/8] Added Anima section to documentation --- .../material-ui-for-figma/material-ui-for-figma.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index 1d4321641f5655..0c8b087f8a886e 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -100,3 +100,15 @@ If you need to replace a single component that's been updated, there are a coupl ## Feedback and bug reports If you've got any feedback, we'd love to [hear from you](https://github.com/mui/mui-design-kits/discussions/84). + + +## Integrations + +### Anima + +With Anima, you can effortlessly transform your Figma designs into Material UI code. The platform intelligently matches your design components to MUI, ensuring that the code generated is clean, reusable, and production-ready. Anima supports both Figma and VS Code, so you can choose the workflow that suits you best. + +- Use the [Anima Figma Plugin](https://www.figma.com/community/plugin/857346721138427857/anima-figma-to-code-react-html-vue-css-tailwind-devmode-inspect-react-html-vue-css) to convert your designs directly in Figma. +- Use the [Anima VS Code Extension (Frontier)](https://marketplace.visualstudio.com/items?itemName=AnimaApp.vscode-anima) to seamlessly generate and edit Material UI code in your development environment. + +Visit the [Anima](https://www.animaapp.com/) for more details. \ No newline at end of file From 9d1881ccac41422cdc9600dd14beb9ce60cb904e Mon Sep 17 00:00:00 2001 From: Gol-Orit Date: Mon, 9 Sep 2024 10:27:25 +0300 Subject: [PATCH 2/8] Format code with Prettier --- .../material-ui-for-figma/material-ui-for-figma.md | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index 0c8b087f8a886e..d1ab448a5ff527 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -101,14 +101,13 @@ If you need to replace a single component that's been updated, there are a coupl If you've got any feedback, we'd love to [hear from you](https://github.com/mui/mui-design-kits/discussions/84). - ## Integrations -### Anima +### Anima With Anima, you can effortlessly transform your Figma designs into Material UI code. The platform intelligently matches your design components to MUI, ensuring that the code generated is clean, reusable, and production-ready. Anima supports both Figma and VS Code, so you can choose the workflow that suits you best. - Use the [Anima Figma Plugin](https://www.figma.com/community/plugin/857346721138427857/anima-figma-to-code-react-html-vue-css-tailwind-devmode-inspect-react-html-vue-css) to convert your designs directly in Figma. - Use the [Anima VS Code Extension (Frontier)](https://marketplace.visualstudio.com/items?itemName=AnimaApp.vscode-anima) to seamlessly generate and edit Material UI code in your development environment. -Visit the [Anima](https://www.animaapp.com/) for more details. \ No newline at end of file +Visit the [Anima](https://www.animaapp.com/) for more details. From e35312e8d19026b006f1f0c6f13eb9531ab707f4 Mon Sep 17 00:00:00 2001 From: GoOrit-Anima Date: Mon, 9 Sep 2024 11:05:39 +0300 Subject: [PATCH 3/8] Apply suggestions from code review followed guidance Signed-off-by: GoOrit-Anima --- .../material-ui-for-figma/material-ui-for-figma.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index d1ab448a5ff527..a0eb15e817f07b 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -105,7 +105,7 @@ If you've got any feedback, we'd love to [hear from you](https://github.com/mui/ ### Anima -With Anima, you can effortlessly transform your Figma designs into Material UI code. The platform intelligently matches your design components to MUI, ensuring that the code generated is clean, reusable, and production-ready. Anima supports both Figma and VS Code, so you can choose the workflow that suits you best. +With Anima, you can effortlessly transform your Figma designs into Material UI code. The platform intelligently matches your design components to MUI, ensuring that the code generated is clean, reusable, and production-ready. Anima supports both Figma and VS Code, so you can choose the workflow that suits you best. - Use the [Anima Figma Plugin](https://www.figma.com/community/plugin/857346721138427857/anima-figma-to-code-react-html-vue-css-tailwind-devmode-inspect-react-html-vue-css) to convert your designs directly in Figma. - Use the [Anima VS Code Extension (Frontier)](https://marketplace.visualstudio.com/items?itemName=AnimaApp.vscode-anima) to seamlessly generate and edit Material UI code in your development environment. From 904ca7a90f5004b9ef673e33af42fad43f3bca58 Mon Sep 17 00:00:00 2001 From: GoOrit-Anima Date: Mon, 9 Sep 2024 11:07:47 +0300 Subject: [PATCH 4/8] Update material-ui-for-figma.md Added option+space Signed-off-by: GoOrit-Anima --- .../material-ui-for-figma/material-ui-for-figma.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index a0eb15e817f07b..8089abf7cf2198 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -108,6 +108,6 @@ If you've got any feedback, we'd love to [hear from you](https://github.com/mui/ With Anima, you can effortlessly transform your Figma designs into Material UI code. The platform intelligently matches your design components to MUI, ensuring that the code generated is clean, reusable, and production-ready. Anima supports both Figma and VS Code, so you can choose the workflow that suits you best. - Use the [Anima Figma Plugin](https://www.figma.com/community/plugin/857346721138427857/anima-figma-to-code-react-html-vue-css-tailwind-devmode-inspect-react-html-vue-css) to convert your designs directly in Figma. -- Use the [Anima VS Code Extension (Frontier)](https://marketplace.visualstudio.com/items?itemName=AnimaApp.vscode-anima) to seamlessly generate and edit Material UI code in your development environment. +- Use the [Anima VS Code Extension (Frontier)](https://marketplace.visualstudio.com/items?itemName=AnimaApp.vscode-anima) to seamlessly generate and edit Material UI code in your development environment. Visit the [Anima](https://www.animaapp.com/) for more details. From 88d45eaa5b3906a08a8adb28213394fb19aaaf9c Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Mon, 9 Sep 2024 12:33:00 +0200 Subject: [PATCH 5/8] Update docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md Signed-off-by: Olivier Tassinari --- .../material-ui-for-figma/material-ui-for-figma.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index 8089abf7cf2198..7ed86cf43bfb5f 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -105,7 +105,9 @@ If you've got any feedback, we'd love to [hear from you](https://github.com/mui/ ### Anima -With Anima, you can effortlessly transform your Figma designs into Material UI code. The platform intelligently matches your design components to MUI, ensuring that the code generated is clean, reusable, and production-ready. Anima supports both Figma and VS Code, so you can choose the workflow that suits you best. +With Anima, you can effortlessly transform your Figma designs into Material UI code. +The platform intelligently matches your design components to MUI, ensuring that the code generated is clean, reusable, and production-ready. +Anima supports both Figma and VS Code, so you can choose the workflow that suits you best. - Use the [Anima Figma Plugin](https://www.figma.com/community/plugin/857346721138427857/anima-figma-to-code-react-html-vue-css-tailwind-devmode-inspect-react-html-vue-css) to convert your designs directly in Figma. - Use the [Anima VS Code Extension (Frontier)](https://marketplace.visualstudio.com/items?itemName=AnimaApp.vscode-anima) to seamlessly generate and edit Material UI code in your development environment. From 6735e72fc52cc21cbb321ec85781b6cfaa326986 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Mon, 9 Sep 2024 12:37:43 +0200 Subject: [PATCH 6/8] Update docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md Signed-off-by: Olivier Tassinari --- .../material-ui-for-figma/material-ui-for-figma.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index 7ed86cf43bfb5f..4f60098ebb05f9 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -106,7 +106,7 @@ If you've got any feedback, we'd love to [hear from you](https://github.com/mui/ ### Anima With Anima, you can effortlessly transform your Figma designs into Material UI code. -The platform intelligently matches your design components to MUI, ensuring that the code generated is clean, reusable, and production-ready. +Anima intelligently matches your design components in Figma to the most relevant code API, ensuring that the code generated is clean, reusable, and production-ready. Anima supports both Figma and VS Code, so you can choose the workflow that suits you best. - Use the [Anima Figma Plugin](https://www.figma.com/community/plugin/857346721138427857/anima-figma-to-code-react-html-vue-css-tailwind-devmode-inspect-react-html-vue-css) to convert your designs directly in Figma. From 64a2fcc9dd2f3936b32a84131e336ec2ae1b5e49 Mon Sep 17 00:00:00 2001 From: zanivan Date: Mon, 9 Sep 2024 15:27:51 -0300 Subject: [PATCH 7/8] Add blank line --- .../material-ui-for-figma/material-ui-for-figma.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index d0154ba866ec95..5cf69d82ab6d9f 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -113,6 +113,7 @@ Anima supports both Figma and VS Code, so you can choose the workflow that suits - Use the [Anima VS Code Extension (Frontier)](https://marketplace.visualstudio.com/items?itemName=AnimaApp.vscode-anima) to seamlessly generate and edit Material UI code in your development environment. Visit the [Anima](https://www.animaapp.com/) for more details. + ### Quest [Quest](https://www.quest.ai/) provides a native integration with this design kit. From cd1a7936b67221880fb7edf6683b9c2829faa23f Mon Sep 17 00:00:00 2001 From: GoOrit-Anima Date: Tue, 10 Sep 2024 08:48:38 +0300 Subject: [PATCH 8/8] Update docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md Signed-off-by: GoOrit-Anima --- .../material-ui-for-figma/material-ui-for-figma.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index 5cf69d82ab6d9f..a3f1f948fcf60e 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -112,7 +112,7 @@ Anima supports both Figma and VS Code, so you can choose the workflow that suits - Use the [Anima Figma Plugin](https://www.figma.com/community/plugin/857346721138427857/anima-figma-to-code-react-html-vue-css-tailwind-devmode-inspect-react-html-vue-css) to convert your designs directly in Figma. - Use the [Anima VS Code Extension (Frontier)](https://marketplace.visualstudio.com/items?itemName=AnimaApp.vscode-anima) to seamlessly generate and edit Material UI code in your development environment. -Visit the [Anima](https://www.animaapp.com/) for more details. +Visit [Anima](https://www.animaapp.com/) for more details. ### Quest