@docubook/create 1.15.2 → 1.16.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docubook/create",
-  "version": "1.15.2",
+  "version": "1.16.0",
   "description": "CLI to create DocuBook projects",
   "main": "src/index.js",
   "type": "module",

package/src/dist/.vscode/image-link.code-snippets

@@ -2,7 +2,7 @@
     "DocuImage": {
       "prefix": "image",
       "body": [
-        "![${1:Alt text for the image}](${2:https://via.placeholder.com/150})"
+        "![${1:Alt text for the image}](${2:/images/example-img.png})"
       ],
       "description": "Snippet untuk menampilkan image komponen."
     },

package/src/dist/app/page.tsx

@@ -25,7 +25,7 @@ export default function Home() {
             )}
           >
             <AnimatedShinyText className="inline-flex items-center justify-center px-4 py-1 transition ease-out hover:text-neutral-100 hover:duration-300 hover:dark:text-neutral-200">
-              <span>🚀 New Version - Release v1.15.2</span>
+              <span>🚀 New Version - Release v1.16.0</span>
               <ArrowRightIcon className="ml-1 size-3 transition-transform duration-300 ease-in-out group-hover:translate-x-0.5" />
             </AnimatedShinyText>
           </div>

package/src/dist/components/contexts/AccordionContext.ts

@@ -0,0 +1,4 @@
+import { createContext } from 'react';
+
+// Create a context to check if a component is inside an accordion group
+export const AccordionGroupContext = createContext<{ inGroup: boolean } | null>(null);

package/src/dist/components/markdown/AccordionGroupMdx.tsx

@@ -0,0 +1,31 @@
+"use client"
+
+import React, { ReactNode } from "react";
+import clsx from "clsx";
+import { AccordionGroupContext } from "@/components/contexts/AccordionContext";
+
+interface AccordionGroupProps {
+  children: ReactNode;
+  className?: string;
+}
+
+const AccordionGroup: React.FC<AccordionGroupProps> = ({ children, className }) => {
+
+  return (
+    // Wrap all children with the AccordionGroupContext.Provider
+    // so that any nested accordions know they are inside a group.
+    // This enables group-specific behavior in child components.
+    <AccordionGroupContext.Provider value={{ inGroup: true }}>
+      <div
+        className={clsx(
+          "border rounded-lg overflow-hidden",
+          className
+        )}
+      >
+        {children}
+      </div>
+    </AccordionGroupContext.Provider>
+  );
+};
+
+export default AccordionGroup;

package/src/dist/components/markdown/AccordionMdx.tsx

@@ -1,30 +1,44 @@
 "use client";
 
-import { ReactNode, useState } from 'react';
+import { ReactNode, useState, useContext } from 'react';
 import { ChevronRight } from 'lucide-react';
+import * as Icons from "lucide-react";
 import { cn } from '@/lib/utils';
+import { AccordionGroupContext } from '@/components/contexts/AccordionContext'; 
 
 type AccordionProps = {
     title: string;
     children?: ReactNode;
     defaultOpen?: boolean;
-    className?: string;
+    icon?: keyof typeof Icons;
 };
 
-const Accordion = ({
+const Accordion: React.FC<AccordionProps> = ({
     title,
     children,
     defaultOpen = false,
-    className,
+    icon,
 }: AccordionProps) => {
+    const groupContext = useContext(AccordionGroupContext);
+    const isInGroup = groupContext?.inGroup === true;
     const [isOpen, setIsOpen] = useState(defaultOpen);
+    const Icon = icon ? (Icons[icon] as React.FC<{ className?: string }>) : null;
 
+    // The main wrapper div for the accordion.
+    // All styling logic for the accordion container is handled here.
     return (
-        <div className={cn("border rounded-lg overflow-hidden", className)}>
+        <div 
+            className={cn(
+                // Style for STANDALONE: full card with border & shadow
+                !isInGroup && "border rounded-lg shadow-sm",
+                // Style for IN GROUP: only a bottom border separator
+                isInGroup && "border-b last:border-b-0 border-border"
+            )}
+        >
             <button
                 type="button"
                 onClick={() => setIsOpen(!isOpen)}
-                className="flex items-center my-auto space-x-2 space-y-2 w-full px-4 h-12 transition-colors bg-background dark:hover:bg-muted/50 hover:bg-muted/15"
+                className="flex items-center space-x-2 w-full px-4 h-12 transition-colors bg-muted/40 dark:bg-muted/20 hover:bg-muted/70 dark:hover:bg-muted/70"
             >
                 <ChevronRight
                     className={cn(
@@ -32,11 +46,12 @@ const Accordion = ({
                         isOpen && "rotate-90"
                     )}
                 />
-                <h3 className="font-medium text-base text-foreground pb-2">{title}</h3>
+                {Icon && <Icon className="text-foreground w-4 h-4"/> }
+                <h3 className="font-medium text-base text-foreground m-0">{title}</h3>
             </button>
 
             {isOpen && (
-                <div className="px-4 py-3 border-t dark:bg-muted/50 bg-muted/15">
+                <div className="px-4 py-3 dark:bg-muted/10 bg-muted/15">
                     {children}
                 </div>
             )}
@@ -44,4 +59,4 @@ const Accordion = ({
     );
 };
 
-export default Accordion;
+export default Accordion;

package/src/dist/contents/docs/api-reference/delete/index.mdx

@@ -42,11 +42,11 @@ example note :
 displaying an image in markdown format :
 
 ```plaintext
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 ```
 
 render as :
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 
 For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page.
 

package/src/dist/contents/docs/api-reference/fetch/index.mdx

@@ -42,11 +42,11 @@ example note :
 displaying an image in markdown format :
 
 ```plaintext
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 ```
 
 render as :
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 
 For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page.
 

package/src/dist/contents/docs/api-reference/get/index.mdx

@@ -42,11 +42,11 @@ example note :
 displaying an image in markdown format :
 
 ```plaintext
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 ```
 
 render as :
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 
 For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page.
 

package/src/dist/contents/docs/api-reference/post/index.mdx

@@ -42,11 +42,11 @@ example note :
 displaying an image in markdown format :
 
 ```plaintext
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 ```
 
 render as :
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 
 For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page.
 

package/src/dist/contents/docs/getting-started/development/index.mdx

@@ -42,11 +42,11 @@ example note :
 displaying an image in markdown format :
 
 ```plaintext
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 ```
 
 render as :
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 
 For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page.
 

package/src/dist/contents/docs/getting-started/introduction/index.mdx

@@ -42,11 +42,11 @@ example note :
 displaying an image in markdown format :
 
 ```plaintext
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 ```
 
 render as :
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 
 For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page.
 
@@ -60,4 +60,15 @@ date : 10-12-2024
 image : example-img.png
 ---
   ```
-</Note>
+</Note>
+
+<Accordion title="Code Block" defaultOpen={true} icon="Code">
+    ```javascript:main.js showLineNumbers {3-4}
+    function isRocketAboutToCrash() {
+        // Check if the rocket is stable
+        if (!isStable()) {
+            NoCrash(); // Prevent the crash
+        }
+    }
+    ```
+</Accordion>

package/src/dist/contents/docs/getting-started/quick-start-guide/index.mdx

@@ -42,11 +42,11 @@ example note :
 displaying an image in markdown format :
 
 ```plaintext
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 ```
 
 render as :
-![Alt text for the image](https://via.placeholder.com/150)
+![Alt text for the image](/images/example-img.png)
 
 For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page.
 

package/src/dist/docu.json

@@ -70,14 +70,7 @@
               "items": [
                       { "title": "Introduction", "href": "/introduction" },
                       { "title": "Quick Start Guide", "href": "/quick-start-guide" },
-                      { "title": "Development", "href": "/development" },
-                      {
-                              "title": "Config",
-                              "href": "/config",
-                              "items": [
-                                      { "title": "Sub Config", "href": "/subconfig" }
-                              ]
-                      }
+                      { "title": "Development", "href": "/development" }
               ]
       },
       {
@@ -98,10 +91,10 @@
       },
       {
       "title": "Changelog",
-      "href": "/Changelog",
+      "href": "/changelog",
       "noLink": true,
       "context": {
-              "icon": "Hystory",
+              "icon": "History",
               "description": "Update and Changes",
               "title": "Release"
               },

package/src/dist/lib/markdown.ts

@@ -45,6 +45,7 @@ import CardGroup from "@/components/markdown/CardGroupMdx";
 import Kbd from "@/components/markdown/KeyboardMdx";
 import { Release, Changes } from "@/components/markdown/ReleaseMdx";
 import { File, Files, Folder } from "@/components/markdown/FileTreeMdx";
+import AccordionGroup from "@/components/markdown/AccordionGroupMdx";
 
 // add custom components
 const components = {
@@ -73,6 +74,7 @@ const components = {
   File,
   Files,
   Folder,
+  AccordionGroup
 };
 
 // can be used for other pages like blogs, Guides etc

package/src/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "docubook",
-  "version": "1.15.2",
+  "version": "1.16.0",
   "private": true,
   "scripts": {
     "dev": "next dev",