[Toolkit] Delay/hide the "Community Kits" feature, minor fixes

Author: Kocal

src/Toolkit/README.md

@@ -10,7 +10,7 @@ https://github.com/symfony/ux to create issues or submit pull requests.
 
 ## Resources
 
--   [Documentation](https://symfony.com/bundles/ux-toolkit/current/index.html)
+-   [Documentation](https://ux.symfony.com/bundles/toolkit)
 -   [Report issues](https://github.com/symfony/ux/issues) and
     [send Pull Requests](https://github.com/symfony/ux/pulls)
     in the [main Symfony UX repository](https://github.com/symfony/ux)

src/Toolkit/doc/index.rst

@@ -1,7 +1,7 @@
 {
     "$schema": "../../../schema-kit-recipe-v1.json",
     "type": "component",
-    "name": "AlertDialog",
+    "name": "Alert Dialog",
     "description": "A modal dialog that interrupts the user with important content and expects a response.",
     "copy-files": {
         "assets/": "assets/",

src/Toolkit/kits/shadcn/AlertDialog/manifest.json

@@ -1,7 +1,7 @@
 {
     "$schema": "../../../schema-kit-recipe-v1.json",
     "type": "component",
-    "name": "AspectRatio",
+    "name": "Aspect Ratio",
     "description": "A container that maintains a specific width-to-height ratio for its content.",
     "copy-files": {
         "templates/": "templates/"

src/Toolkit/kits/shadcn/AspectRatio/manifest.json

@@ -98,5 +98,3 @@ In your `assets/styles/app.css`, after the TailwindCSS imports, add the followin
     }
 }
 ```
-
-And voilà! You are now ready to use Shadcn components in your Symfony project.

src/Toolkit/kits/shadcn/INSTALL.md

@@ -117,12 +117,7 @@ protected function execute(InputInterface $input, OutputInterface $output): int
             } elseif (1 === $availableKitsCount) {
                 $kit = $availableKits[0];
             } else {
-                $io->error(
-                    null === $recipeName
-                    ? 'It seems that no local kits are available and it should not happens. Please open an issue on https://github.com/symfony/ux to report this.'
-                    : \sprintf("The recipe \"%s\" does not exist in any official kits.\n\nYou can try to run one of the following commands to interactively install recipes:\n%s\n\nOr you can try one of the community kits https://github.com/search?q=topic:ux-toolkit&type=repositories", $recipeName, implode("\n", array_map(fn (string $availableKitName) => \sprintf('$ bin/console %s --kit %s', $this->getName(), $availableKitName), $availableKitNames)))
-                );
-
+                $io->error('It seems that no official kits are available and it should not happens. Please open an issue on https://github.com/symfony/ux to report this.');
                 return Command::FAILURE;
             }
         } else {

src/Toolkit/src/Command/InstallCommand.php

@@ -1,4 +1,7 @@
-.SidebarNav {}
+.SidebarNav {
+    position: sticky;
+    top: 0px
+}
 
 .SidebarNav_Heading {
     font-weight: 600;
@@ -8,6 +11,10 @@
 .SidebarNav_Item {
     border-radius: .5rem;
     transition: background-color 100ms ease-in-out;
+
+    & + & {
+        margin-top: .1rem;
+    }
 }
 .SidebarNav_Item.active,
 .SidebarNav_Item:hover {

ux.symfony.com/assets/styles/components/_SidebarNav.scss

@@ -34,16 +34,6 @@ public function __construct(
     ) {
     }
 
-    #[Route('/toolkit/kits/{kit}/components/')]
-    public function listComponents(ToolkitKitId $kit): Response
-    {
-        // TODO: implementing listing in the future :D
-
-        return $this->redirectToRoute('app_toolkit_kit', [
-            'kit' => $kit->value,
-        ], Response::HTTP_FOUND);
-    }
-
     #[Route('/toolkit/kits/{kitId}/components/{componentName}', name: 'app_toolkit_component')]
     public function showComponent(ToolkitKitId $kitId, string $componentName): Response
     {

ux.symfony.com/src/Controller/Toolkit/ComponentsController.php

@@ -79,15 +79,19 @@ tree templates/components
                 </div>
             {% endfor %}
 
-            <div class="PackageBox">
+            <div class="PackageBox" style="position: relative">
+                <span style="position: absolute; background-color: #e9c502; transform: rotate(-10deg); padding: 3px 8px; top: 10px; left: 0; font-size: 20px; font-weight: bold;">
+                    🚧 <abbr title="Work In Progress">WIP</abbr>!
+                </span>
+
                 <div class="PackageBox_logo" style="--color: #24292f;">
                     <twig:ux:icon name="flowbite:users-group-solid" style="color: #fff; width: 50%; height: 50%;" />
                 </div>
                 <div class="PackageBox_content">
                     <h2 class="PackageBox_title">
-                        <a href="https://github.com/search?q=topic%3Aux-toolkit&type=repositories" rel="external" class="PackageBox_link">
+                        {# <a href="https://github.com/search?q=topic%3Aux-toolkit&type=repositories" rel="external" class="PackageBox_link"> #}
                             Community Kits
-                        </a>
+                        {# </a> #}
                     </h2>
 
                     <div class="PackageBox_description">