Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[update] the confirmDeletion parameter (missing feature) #45

Merged
merged 5 commits into from
Dec 4, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions docs/api/config/js_kanban_cardshape_config.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ cardShape?: {
attached?: boolean | { show?: boolean },
cover?: boolean | { show?: boolean },
comments?: boolean | { show?: boolean },
confirmDeletion?: boolean | { show?: boolean },
start_date?: boolean | {
show?: boolean,
format?: string
Expand Down Expand Up @@ -107,6 +108,7 @@ To configure the card appearance, in the **cardShape** object you can specify th
- `attached` - (optional) shows/hides an **attachment** field
- `cover` - (optional) shows/hides a **card picture**
- `comments` - (optional) shows/hides **comments** on cards
- `confirmDeletion` - (optional) shows/hides the **confirmation dialog** that allows users to confirm or decline the card deletion
- `start_date` - (optional) an object of parameters of a **start date** field
- `show` - (optional) shows/hides a card start date
- `format` - (optional) defines format of a card start date. The available parameters can be found [here](https://docs.dhtmlx.com/suite/calendar/api/calendar_dateformat_config/)
Expand Down Expand Up @@ -230,6 +232,7 @@ const defaultCardShape = {
start_date: { show: false },
end_date: { show: false },
users: { show: false },
confirmDeletion: { show: true },
priority: {
show: false,
values: defaultPriorities
Expand Down Expand Up @@ -270,6 +273,7 @@ const cardShape = { // card settings
attached: true,
cover: false,
comments: false,
confirmDeletion: false,
color: {
show: true,
values: cardColors
Expand Down
10 changes: 7 additions & 3 deletions docs/api/config/js_kanban_columnshape_config.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,8 @@ columnShape?: {
}),
collapsedTemplate?: template(column => {
return "The HTML template of the column header in the collapsed state";
})
}),
confirmDeletion?: boolean
};
~~~

Expand Down Expand Up @@ -90,6 +91,7 @@ To configure the columns appearance, in the **columnShape** object you can speci
- `css` - (optional) a function that returns a css class that applies to columns conditionally
- `headerTemplate` - (optional) the HTML template of the column header in the expanded state
- `collapsedTemplate` - (optional) the HTML template of the column header in the collapsed state
- `confirmDeletion` - (optional) shows/hides the **confirmation dialog** that allows users to confirm or decline the column deletion

### Default config

Expand All @@ -116,7 +118,8 @@ const columnShape = {
show: true,
items: getDefaultColumnMenuItems
},
fixedHeaders: true
fixedHeaders: true,
confirmDeletion: true
};
~~~

Expand Down Expand Up @@ -178,7 +181,8 @@ const columnShape = {
column.columnState?.cardsCount
})</div>
</div>`;
})
}),
confirmDeletion: true
};

new kanban.Kanban("#root", {
Expand Down
32 changes: 25 additions & 7 deletions docs/api/config/js_kanban_editorshape_config.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ description: You can learn about the editorShape config in the documentation of

### Usage

~~~jsx {3,8,27,40,50,71,86,95,106,115}
~~~jsx {3,8,28,42,52,73,88,97,108,117,125}
editorShape?: [
{
// common parameters for all types
Expand Down Expand Up @@ -126,15 +126,21 @@ editorShape?: [
accept?: string,
disabled?: boolean,
multiple?: boolean,
folder?: boolean
folder?: boolean,
},

// for a "comments" type only
config?: {
format?: string,
placement?: "page" | "editor",
html?: boolean
}
html?: boolean,
confirmDeletion?: boolean
},

// for a "links" type only
config?: {
confirmDeletion?: boolean
},
}, { /* other control settings */ }
];
~~~
Expand Down Expand Up @@ -343,6 +349,12 @@ interface UploadEvent extends PointerEvent {
- `"editor"` - comments will be displayed in the editor
- `"page"` - comments will be displayed in a separate panel
- `html` - (optional) - enables/disables using of the HTML markup in comments
- `confirmDeletion` - (optional) shows/hides the **confirmation dialog** that allows users to confirm or decline the comment deletion

#### - Parameters for a "links" type

- `config` - (optional) a configuration object of the **"links"** field. Here you can specify the following parameters:
- `confirmDeletion` - (optional) shows/hides the **confirmation dialog** that allows users to confirm or decline the link deletion

:::info
Unless you specify the editor settings via the `editorShape` property, the widget will apply a **defaultEditorShape** set of parameters!
Expand Down Expand Up @@ -408,7 +420,7 @@ const defaultEditorShape = [

### Example

~~~jsx {6-29,34}
~~~jsx {6-35,40}
const users = [ // user data
{ id: 1, label: "John Smith", avatar: "../assets/user.jpg" },
{ id: 2, label: "Aaron Short" }
Expand All @@ -429,13 +441,19 @@ const editorShape = [ // editor settings
config: {
format: "%M %d",
placement: "page",
html: true
html: true,
config: {
serhiipylypchuk1991 marked this conversation as resolved.
Show resolved Hide resolved
confirmDeletion: true
}
}
},
{
type: "links",
key:"links",
label: "Links"
label: "Links",
config: {
confirmDeletion: true
}
}
];

Expand Down
2 changes: 1 addition & 1 deletion docs/api/config/js_kanban_links_config.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ If you want to load new data for links dynamically, you can use the [**parse()**

### Example

~~~jsx {1-9,14}
~~~jsx {1-8,13}
const links = [
{
id: 1,
Expand Down
12 changes: 8 additions & 4 deletions docs/api/config/js_kanban_rowshape_config.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,8 @@ rowShape?: {
}, {...} // other item data
] | ({ row, rowIndex, rows, store }) => array | boolean
},
css?: (row, cards) => string
css?: (row, cards) => string,
confirmDeletion?: boolean
};
~~~

Expand Down Expand Up @@ -82,6 +83,7 @@ To configure the rows appearance, in the **rowShape** object you can specify the
:::

- `css` - a function returns a css class that applies to rows conditionally
- `confirmDeletion` - (optional) shows/hides the **confirmation dialog** that allows users to confirm or decline the row deletion

### Default config

Expand All @@ -106,13 +108,14 @@ const rowShape = {
menu: {
show: true,
items: getDefaultRowMenuItems
}
},
confirmDeletion: true
};
~~~

### Example

~~~jsx {10-42,48}
~~~jsx {10-43,48}
const changeRowColor = (row, cssClass) => board.updateRow({
id: row.id,
row: {
Expand Down Expand Up @@ -153,7 +156,8 @@ const rowShape = {
]
}
},
css: (row, cards) => row.id == "task" && cards.length < 3 ? "green" : "red"
css: (row, cards) => row.id == "task" && cards.length < 3 ? "green" : "red",
confirmDeletion: false
};

new kanban.Kanban("#root", {
Expand Down
15 changes: 10 additions & 5 deletions docs/guides/configuration.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,7 @@ The board of Kanban consists of the *cards* distributed into *columns* and *rows

- a card cover (*preview image*) via the `cover: boolean` config
- a card comment(s) via the `comments: boolean` config
- a confirmation dialog to confirm or decline the card deletion via the `confirmDeletion: boolean` config
- a card vote(s) via the `votes: boolean | { show: boolean, clicable: true }` config
- a card assignment (users) via the `users: boolean | { show: boolean, values: object, maxCount: number | false }` config

Expand Down Expand Up @@ -365,7 +366,7 @@ new kanban.Kanban("#root", {

The editor field of **comments** type can be set in the following way:

~~~jsx {3-12}
~~~jsx {3-13}
new kanban.Kanban("#root", {
editorShape: [
{
Expand All @@ -376,7 +377,8 @@ new kanban.Kanban("#root", {
dateFormat: "%M %d",
placement: "page", // or "editor"
html: true,
},
confirmDeletion: true
}
},
// settings of other fields
]
Expand All @@ -387,20 +389,23 @@ new kanban.Kanban("#root", {

The editor field of **links** type can be set in the following way:

~~~jsx {3-7}
~~~jsx {3-10}
new kanban.Kanban("#root", {
editorShape: [
{
type: "links",
key: "links",
label: "Links",
config: {
confirmDeletion: true
}
},
// settings of other fields
]
});
~~~

### Linking editor fields to card fields
### Binding editor fields to card fields

:::info
To link the editor field to the corresponding card field, you need to provide special **key** in the object of [`editorShape`](api/config/js_kanban_editorshape_config.md) property (`key: "editor_field_key"`). The value of this key needs to be set to *true* in the [`cardShape`](api/config/js_kanban_cardshape_config.md) property (for built-in card fields) or specified in the **headerFields** array (for custom card fields). You can provide the initial data of any field via this key as well.
Expand Down Expand Up @@ -506,7 +511,7 @@ new kanban.Toolbar("#toolbar", { api: board.api });

You can manage (*hide/show/customize*) the Toolbar controls using the **items** property:

~~~jsx {6-15}
~~~jsx {6-51}
// create Kanban
const board = new kanban.Kanban("#root", {...});

Expand Down
10 changes: 10 additions & 0 deletions docs/news/whats_new.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,16 @@ description: You can explore what's new in DHTMLX Kanban and its release history

If you are updating Kanban from an older version, check [Migration to newer versions](news/migration.md) for details.

## Version 1.6.1

Released on November 29, 2024

### Fixes

- Toolbar on narrow screens has a misaligned "more" icon
- `RestDataProvider` ignores headers defined via `setHeaders()`
- `RestDataProvider.getIDResolver` is not a function error

## Version 1.6

Released on November 13, 2024
Expand Down
Loading