Skip to content

Commit 69007ac

Browse files
pip-install-pythonpip-install-python
committed
updated removed prometheus and updated dash-dynamic-grid-layout
1 parent 66663b8 commit 69007ac

File tree

7 files changed

+235
-193
lines changed

7 files changed

+235
-193
lines changed

‎assets/main.css

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -189,3 +189,10 @@ img[alt=logo] { width: 300px; height: 200px; align-content: center; }
189189
--tr-hover-bg: #434547;
190190
}
191191

192+
.main-container {
193+
overflow: auto;
194+
}
195+
196+
.grid-container {
197+
height: 100%;
198+
}

‎docker-compose.yml

Lines changed: 0 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -6,38 +6,3 @@ services:
66
- "8550:8550"
77
networks:
88
- monitoring_network
9-
10-
grafana:
11-
image: grafana/grafana:latest
12-
ports:
13-
- "3000:3000"
14-
volumes:
15-
- grafana-storage:/var/lib/grafana
16-
environment:
17-
- GF_SECURITY_ADMIN_USER=${GF_ADMIN_USER:-admin}
18-
- GF_SECURITY_ADMIN_PASSWORD=${GF_ADMIN_PASSWORD:-admin}
19-
networks:
20-
- monitoring_network
21-
22-
prometheus:
23-
image: prom/prometheus:latest
24-
volumes:
25-
- ./prometheus.yml:/etc/prometheus/prometheus.yml
26-
- prometheus_data:/prometheus
27-
command:
28-
- '--config.file=/etc/prometheus/prometheus.yml'
29-
- '--storage.tsdb.path=/prometheus'
30-
- '--web.console.libraries=/usr/share/prometheus/console_libraries'
31-
- '--web.console.templates=/usr/share/prometheus/consoles'
32-
ports:
33-
- "9090:9090"
34-
networks:
35-
- monitoring_network
36-
37-
volumes:
38-
grafana-storage:
39-
prometheus_data:
40-
41-
networks:
42-
monitoring_network:
43-
driver: bridge

‎docs/dash_dynamic_grid_layout/dash_dynamic_grid_layout.md

Lines changed: 44 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -12,15 +12,20 @@ icon: uim:grid
1212

1313
Dash Dynamic Grid Layout is a Dash component library that provides a flexible grid layout system for arranging and moving components within a Dash application.
1414

15+
Special thanks to [BSd3v](https://github.com/BSd3v) for contributing the improvements and bug fixes making this a much more polished project.
16+
1517
.. exec::docs.dash_dynamic_grid_layout.example
1618
:code: false
19+
1720
## Features
1821

1922
- Drag-and-drop functionality for rearranging components
2023
- Resizable grid items
2124
- Customizable layout with responsive breakpoints
2225
- Option to add or remove items dynamically
2326
- Customizable drag handles for each item
27+
- Persistence of component state
28+
- Local, memory, or session storage for persistence
2429

2530
```bash
2631
pip install dash-dynamic-grid-layout
@@ -34,31 +39,51 @@ Here's a basic example of how to use the DashGridLayout component:
3439
.. exec::docs.dash_dynamic_grid_layout.intro
3540

3641
## Prop Reference
42+
3743
### DashGridLayout
3844

39-
| Property | Type | Default | Description |
40-
|------------------|--------|---------|---------------------------------------------------------------|
41-
| id | string | - | The ID used to identify this component in Dash callbacks |
42-
| children | list | - | A list of dash components to be rendered in the grid |
43-
| currentLayout | list | [] | The current layout of the grid items |
44-
| rowHeight | number | 100 | The height of a single row in pixels |
45-
| cols | dict | { lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 } | An object containing breakpoints and column numbers |
46-
| compactType | string | 'vertical' | Compaction type. Can be 'vertical', 'horizontal', or null |
47-
| showRemoveButton | bool | True | Whether to show remove buttons for grid items |
48-
| showResizeHandles| bool | True | Whether to show resize handles for grid items |
45+
DashGridLayout is a flexible grid layout system for arranging and moving components within a Dash application. These are the properties available for the DashGridLayout component:
46+
47+
| Property | Type | Default | Description |
48+
|-------------------|---------|-----------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------|
49+
| id | string | - | The ID used to identify this component in Dash callbacks. |
50+
| className | string | 'layout' | CSS class name for the grid layout. |
51+
| rowHeight | number | 100 | The height of a single row in pixels. |
52+
| cols | object | {lg: 12, md: 10, sm: 6, xs: 4, xxs: 2} | An object containing breakpoints and column numbers. |
53+
| style | object | - | Inline styles for the grid layout. |
54+
| itemCount | number | - | The number of items in the grid. |
55+
| itemToRemove | any | '' | The item in the grid that should be removed when triggered. |
56+
| compactType | string | 'vertical' | Compaction type. Can be 'vertical', 'horizontal', or null. |
57+
| showRemoveButton | boolean | true | Whether to show remove buttons for grid items. |
58+
| showResizeHandles | boolean | true | Whether to show resize handles for grid items. |
59+
| persistence | boolean | - | Whether to persist the component's state. |
60+
| persisted_props | array | ['itemLayout'] | List of props to persist. |
61+
| persistence_type | string | 'local' | Type of persistence. Can be 'local', 'memory', or 'session'. |
62+
| items | array | [] | List of items to be rendered in the grid. |
63+
| itemLayout | array | [] | Layout configuration for each item. Each item should be an object with shape {i: string, x: number, y: number, w: number, h: number}. |
64+
| currentLayout | array | [] | The current layout of the grid items. Each item should be an object with shape {i: string, x: number, y: number, w: number, h: number}. |
65+
| breakpoints | object | {lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0} | Breakpoints for responsive layout. |
66+
| breakpointData | object | - | Data about the current breakpoint and columns. Shape: {newBreakpoint: string, newCols: number}. |
67+
68+
## Callbacks
69+
70+
| Property | Description |
71+
|----------|-----------------------------------------|
72+
| setProps | Callback function to update Dash props. |
4973

5074
### DraggableWrapper
5175

52-
| Property | Type | Default | Description |
53-
|------------------|--------|---------------|--------------------------------------------------|
54-
| children | node | - | The content to be wrapped and made draggable |
55-
| handleBackground | string | "rgb(85,85,85)"| Background color of the drag handle |
56-
| handleColor | string | "white" | Text color of the drag handle |
57-
| handleText | string | "Drag here" | Text to display in the drag handle |
76+
DraggableWrapper is a component that wraps other components and makes them draggable. These are the properties available for the DraggableWrapper component:
77+
78+
| Property | Type | Default | Description |
79+
|------------------|--------|-----------------|----------------------------------------------|
80+
| children | node | - | The content to be wrapped and made draggable |
81+
| handleBackground | string | "rgb(85,85,85)" | Background color of the drag handle |
82+
| handleColor | string | "white" | Text color of the drag handle |
83+
| handleText | string | "Drag here" | Text to display in the drag handle |
84+
5885
### Contributing
5986
Contributions are welcome! Please feel free to submit a Pull Request.
6087

61-
Special thanks to [BSd3v](https://github.com/BSd3v) for contributing the improvements and bug fixes making this a much more polished project.
62-
6388
### License
64-
This project is licensed under the MIT License.
89+
This project is licensed under the MIT License.

0 commit comments

Comments
 (0)