Skip to content

Commit

Permalink
Rename to dnd-timeline
Browse files Browse the repository at this point in the history
  • Loading branch information
Samuel Arbibe committed Jul 7, 2023
1 parent fa4a572 commit a1b4084
Show file tree
Hide file tree
Showing 73 changed files with 1,456 additions and 2,305 deletions.
Empty file modified .eslintrc.json
100644 → 100755
Empty file.
2 changes: 1 addition & 1 deletion .github/workflows/main.yml
100644 → 100755
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ jobs:
- name: Create link
run: |
yarn link
yarn link react-gantt
yarn link dnd-timeline
- name: Publish to Chromatic
uses: chromaui/action@v1
with:
Expand Down
Empty file modified .github/workflows/size.yml
100644 → 100755
Empty file.
Empty file modified .gitignore
100644 → 100755
Empty file.
2 changes: 1 addition & 1 deletion .storybook/main.ts
100644 → 100755
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ const config: StorybookConfig = {
viteFinal: (config) => {
return mergeConfig(config, {
optimizeDeps: {
include: ['react-gantt'],
include: ['dnd-timeline'],
},
})
},
Expand Down
Empty file modified .storybook/preview.ts
100644 → 100755
Empty file.
Empty file modified .vscode/settings.json
100644 → 100755
Empty file.
Empty file modified LICENSE
100644 → 100755
Empty file.
16 changes: 8 additions & 8 deletions README.md
100644 → 100755
Original file line number Diff line number Diff line change
@@ -1,22 +1,22 @@
# Overview

## A headless gantt library, based on [`dnd-kit`](https://docs.dndkit.com/)
## A headless timeline library, based on [`dnd-kit`](https://docs.dndkit.com/)

- **Headless:** `react-gantt` is a headless-ui library, and contains 0 styling, aside from functional styling (position, z-index, etc.).
- **Headless:** `dnd-timeline` is a headless-ui library, and contains 0 styling, aside from functional styling (position, z-index, etc.).
- **Hook-based:** exposes simple hooks like `useItem` and `useRow`, that should integrate seamlessly into your existing architecture.
- **Flexible:** very slim and flexible by design. `react-gantt` exposes utility functions and positional styling, and you can use them in conjunction with you favorite libraries - styling libraries (MUI, tailwindcss, ant-design, etc.), and functional libraries (react-virtual, framer-motion, etc.)
- **Based on [`dnd-kit`](https://docs.dndkit.com/):** all features exposed by the [`dnd-kit`](https://docs.dndkit.com/) library are applicable to react-gantt.
- **Flexible:** very slim and flexible by design. `dnd-timeline` exposes utility functions and positional styling, and you can use them in conjunction with you favorite libraries - styling libraries (MUI, tailwindcss, ant-design, etc.), and functional libraries (react-virtual, framer-motion, etc.)
- **Based on [`dnd-kit`](https://docs.dndkit.com/):** all features exposed by the [`dnd-kit`](https://docs.dndkit.com/) library are applicable to dnd-timeline.
- **Performence:** renders only when needed. All the intermediate states and animations are done using css transformations, and require 0 re-renders.
- **RTL support:** `react-gantt` nativly supports RTL. simply declare one of the parent divs as rtl with `dir="rtl"`, and thats it.
- **RTL support:** `dnd-timeline` nativly supports RTL. simply declare one of the parent divs as rtl with `dir="rtl"`, and thats it.

## Features

- **Stacked rows:** Items whose relevance's intersect are stacked on top of each other inside the same row.
- **Snap to Grid:** Items snap into a pre-defined grid when dropped, that can be changed according to zoom level.
- **Time Axis:** An optional time axis can be displayed, with different markers according to zoom level.
- **Time Cursor:** An optional time cursor indicating the current time on top of the gantt.
- **Time Cursor:** An optional time cursor indicating the current time on top of the timeline.
- **Pan and zoom:** You can zoom by holding <kbd>Ctrl</kbd> and scrolling using the mouse wheel, and pan by holding <kbd>Ctrl + Shift</kbd> scrolling using the mouse wheel.
- **Dynamically disabled rows and items:** Items and Rows can be disabled according to a client-defined logic.
- **Integration with external DnD:** The gantt can be used in conjunction with other DnD interactions in you app, to drag items into and outside of the gantt.
- **Integration with external DnD:** The timeline can be used in conjunction with other DnD interactions in you app, to drag items into and outside of the timeline.

![2023-06-24 12 21 52](https://github.com/samuelarbibe/react-gantt/assets/38098325/98ec3d4a-df73-4766-8be3-4b3347c65658)
![2023-06-24 12 21 52](https://github.com/samuelarbibe/dnd-timeline/assets/38098325/98ec3d4a-df73-4766-8be3-4b3347c65658)
Loading

0 comments on commit a1b4084

Please sign in to comment.