From 040ba1ea218d2ddbcb9f7ebc819c5a1dc7c8d3d8 Mon Sep 17 00:00:00 2001
From: Samuel Arbibe <samuel.arbibe@gmail.com>
Date: Fri, 17 Nov 2023 14:17:20 +0000
Subject: [PATCH] GITBOOK-5: No subject

---
 docs/SUMMARY.md                               | 21 +++++++++++--------
 .../item/README.md                            |  0
 .../item/useitem.md                           |  0
 .../row/README.md                             |  0
 .../row/subrow.md                             |  6 +++---
 .../row/userow.md                             |  0
 .../timelinecontext/README.md                 |  2 +-
 .../timelinecontext/usetimelinecontext.md     |  0
 docs/examples/basic.md                        |  3 +++
 docs/guide/overview.md                        | 20 ------------------
 10 files changed, 19 insertions(+), 33 deletions(-)
 rename docs/{api-documentation => documentation}/item/README.md (100%)
 rename docs/{api-documentation => documentation}/item/useitem.md (100%)
 rename docs/{api-documentation => documentation}/row/README.md (100%)
 rename docs/{api-documentation => documentation}/row/subrow.md (96%)
 rename docs/{api-documentation => documentation}/row/userow.md (100%)
 rename docs/{api-documentation => documentation}/timelinecontext/README.md (99%)
 rename docs/{api-documentation => documentation}/timelinecontext/usetimelinecontext.md (100%)
 create mode 100644 docs/examples/basic.md
 delete mode 100644 docs/guide/overview.md

diff --git a/docs/SUMMARY.md b/docs/SUMMARY.md
index 1531818..04a9358 100644
--- a/docs/SUMMARY.md
+++ b/docs/SUMMARY.md
@@ -6,14 +6,17 @@
 
 * [Introduction](guide/introduction.md)
 * [Installation](guide/installation.md)
-* [Overview](guide/overview.md)
 
-## API Documentation
+## Documentation
 
-* [TimelineContext](api-documentation/timelinecontext/README.md)
-  * [useTimelineContext](api-documentation/timelinecontext/usetimelinecontext.md)
-* [Row](api-documentation/row/README.md)
-  * [useRow](api-documentation/row/userow.md)
-  * [Subrow](api-documentation/row/subrow.md)
-* [Item](api-documentation/item/README.md)
-  * [useItem](api-documentation/item/useitem.md)
+* [TimelineContext](documentation/timelinecontext/README.md)
+  * [useTimelineContext](documentation/timelinecontext/usetimelinecontext.md)
+* [Row](documentation/row/README.md)
+  * [useRow](documentation/row/userow.md)
+  * [Subrow](documentation/row/subrow.md)
+* [Item](documentation/item/README.md)
+  * [useItem](documentation/item/useitem.md)
+
+## Examples
+
+* [Basic](examples/basic.md)
diff --git a/docs/api-documentation/item/README.md b/docs/documentation/item/README.md
similarity index 100%
rename from docs/api-documentation/item/README.md
rename to docs/documentation/item/README.md
diff --git a/docs/api-documentation/item/useitem.md b/docs/documentation/item/useitem.md
similarity index 100%
rename from docs/api-documentation/item/useitem.md
rename to docs/documentation/item/useitem.md
diff --git a/docs/api-documentation/row/README.md b/docs/documentation/row/README.md
similarity index 100%
rename from docs/api-documentation/row/README.md
rename to docs/documentation/row/README.md
diff --git a/docs/api-documentation/row/subrow.md b/docs/documentation/row/subrow.md
similarity index 96%
rename from docs/api-documentation/row/subrow.md
rename to docs/documentation/row/subrow.md
index a13d4c9..20c36ce 100644
--- a/docs/api-documentation/row/subrow.md
+++ b/docs/documentation/row/subrow.md
@@ -9,14 +9,14 @@ Each item in that stack should be rendered inside a subrow of some kind, that wi
 <pre class="language-tsx" data-title="Timeline.tsx"><code class="lang-tsx">function Timeline(props: TimelineProps) {  
   const { setTimelineRef, style, timeframe } = useTimelineContext()
 
-  const groupedRows = useMemo(
+  const groupedSubrows = useMemo(
 <strong>    () => groupItemsToSubrows(items, timeframe),
-</strong>    [items, timeline.timeframe]
+</strong>    [items, timeframe]
   )
 
   return (
     &#x3C;div ref={setTimelineRef} style={style}>
-      {rows.map((row) => 
+      {props.rows.map((row) => 
         &#x3C;Row key={row.id} id={row.id} sidebar={&#x3C;Sidebar row={row} />}>
           {groupedSubrows[row.id]?.map((subrow, index) => 
             &#x3C;div key={`${row.id}-${index}`}>
diff --git a/docs/api-documentation/row/userow.md b/docs/documentation/row/userow.md
similarity index 100%
rename from docs/api-documentation/row/userow.md
rename to docs/documentation/row/userow.md
diff --git a/docs/api-documentation/timelinecontext/README.md b/docs/documentation/timelinecontext/README.md
similarity index 99%
rename from docs/api-documentation/timelinecontext/README.md
rename to docs/documentation/timelinecontext/README.md
index b3e2095..b5c6d04 100644
--- a/docs/api-documentation/timelinecontext/README.md
+++ b/docs/documentation/timelinecontext/README.md
@@ -153,7 +153,7 @@ You will need to wrap your timeline and all of its component in a `<TimelineCont
 {% code title="App.tsx" overflow="wrap" %}
 ```tsx
 function App(){
-  const [row, setRow] = useRows()
+  const [rows, setRows] = useRows()
   const [items, setItems] = useItems()
   const [timeframe, setTimeframe] = useState(DEFAULT_TIMEFRAME)
   
diff --git a/docs/api-documentation/timelinecontext/usetimelinecontext.md b/docs/documentation/timelinecontext/usetimelinecontext.md
similarity index 100%
rename from docs/api-documentation/timelinecontext/usetimelinecontext.md
rename to docs/documentation/timelinecontext/usetimelinecontext.md
diff --git a/docs/examples/basic.md b/docs/examples/basic.md
new file mode 100644
index 0000000..c39d422
--- /dev/null
+++ b/docs/examples/basic.md
@@ -0,0 +1,3 @@
+# Basic
+
+{% embed url="https://codesandbox.io/p/sandbox/github/samuelarbibe/dnd-timeline/tree/main/examples/basic?embed=1&file=/src/App.tsx" %}
diff --git a/docs/guide/overview.md b/docs/guide/overview.md
deleted file mode 100644
index 1a407f9..0000000
--- a/docs/guide/overview.md
+++ /dev/null
@@ -1,20 +0,0 @@
-# Overview
-
-`dnd-timeline` is a hook library, that provides you a few hooks and one context to build your own timeline.
-
-Here are the different components and their role:
-
-### `TimelineContext`
-
-This context holds all the relevant state to manage a timeline. This context is also responsible wrapping you code with the [`DndContext`](https://docs.dndkit.com/api-documentation/context-provider) provided by `dnd-kit`
-
-The context is also responsible for calling the callbacks you provide it, for the events that happen in the timeline.
-
-The library is fully controlled, so you are responsible for managing state and state-updates.
-
-### `useTimelineContext`
-
-A hook to access different helper functions and the context's values. These helpers and values will help you customize you timeline.
-
-### `useRow`
-