From 766586889c5001892920f4e7c7297e67e13f3d90 Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 29 Jun 2026 17:34:14 +0300 Subject: [PATCH 1/2] [update] normalize internal links convention - rewrite doc-to-doc links as root-relative `path.md` (drop `../` climbing, leading `/`, the `/spreadsheet/` baseUrl prefix, dir-style trailing slashes, and stray `.md/` before anchors) - switch overview tables to root-relative empty-label links `[](api/X.md)`, keep `@getshort(../X.md)` file-relative - point folder-index targets at their URL: homepage `/`, themes `/themes/` - update `onEmptyLinkMatch`: resolve empty-label targets from docs root and emit root-absolute href without `.md`; comment out editUrl - verified via Docusaurus build: no broken links or anchors --- docs/angular_integration.md | 8 +- docs/api/eventsbus_on_method.md | 2 +- docs/api/overview/eventbus_overview.md | 6 +- docs/api/overview/events_overview.md | 30 ++++---- docs/api/overview/export_overview.md | 4 +- docs/api/overview/methods_overview.md | 80 ++++++++++---------- docs/api/overview/properties_overview.md | 22 +++--- docs/api/overview/selection_overview.md | 10 +-- docs/api/overview/sheetmanager_overview.md | 14 ++-- docs/api/spreadsheet_addformula_method.md | 2 +- docs/api/spreadsheet_clear_method.md | 2 +- docs/api/spreadsheet_freezecols_method.md | 4 +- docs/api/spreadsheet_freezerows_method.md | 4 +- docs/api/spreadsheet_hidecols_method.md | 2 +- docs/api/spreadsheet_hiderows_method.md | 2 +- docs/api/spreadsheet_localization_config.md | 2 +- docs/api/spreadsheet_parse_method.md | 4 +- docs/api/spreadsheet_showcols_method.md | 2 +- docs/api/spreadsheet_showrows_method.md | 2 +- docs/api/spreadsheet_toolbarblocks_config.md | 2 +- docs/api/spreadsheet_unfreezecols_method.md | 4 +- docs/api/spreadsheet_unfreezerows_method.md | 4 +- docs/functions.md | 2 +- docs/guides.md | 2 +- docs/how_to_start.md | 2 +- docs/index.md | 2 +- docs/initialization.md | 2 +- docs/localization.md | 2 +- docs/migration.md | 8 +- docs/number_formatting.md | 4 +- docs/react/events.md | 34 ++++----- docs/react/index.md | 22 +++--- docs/react/installation.md | 2 +- docs/react/localization.md | 8 +- docs/react/nextjs.md | 6 +- docs/react/overview.md | 10 +-- docs/react/props.md | 30 ++++---- docs/react/quick-start.md | 10 +-- docs/react/state/index.md | 6 +- docs/react/state/redux-toolkit.md | 8 +- docs/react/state/state-management-basics.md | 2 +- docs/react/themes.md | 6 +- docs/react/types.md | 4 +- docs/svelte_integration.md | 8 +- docs/themes/base_themes_configuration.md | 4 +- docs/vuejs_integration.md | 8 +- docs/whats_new.md | 78 +++++++++---------- docs/work_with_cells.md | 2 +- docs/working_with_cells.md | 2 +- docusaurus.config.js | 14 +++- 50 files changed, 254 insertions(+), 246 deletions(-) diff --git a/docs/angular_integration.md b/docs/angular_integration.md index 1c403a7b..cdc7130a 100644 --- a/docs/angular_integration.md +++ b/docs/angular_integration.md @@ -53,7 +53,7 @@ Now you should get the DHTMLX Spreadsheet source code. First of all, stop the ap ### Step 1. Package installation -Download the [**trial Spreadsheet package**](/how_to_start/#installing-spreadsheet-via-npm-or-yarn) and follow steps mentioned in the README file. Note that trial Spreadsheet is available 30 days only. +Download the [**trial Spreadsheet package**](how_to_start.md#installing-spreadsheet-via-npm-or-yarn) and follow steps mentioned in the README file. Note that trial Spreadsheet is available 30 days only. ### Step 2. Component creation @@ -178,7 +178,7 @@ export function getData(): any { } ~~~ -Then open the ***spreadsheet.component.ts*** file. Import the file with data and apply it using the [`parse()`](/api/spreadsheet_parse_method/) method within the `ngOnInit()` method, as shown below. +Then open the ***spreadsheet.component.ts*** file. Import the file with data and apply it using the [`parse()`](api/spreadsheet_parse_method.md) method within the `ngOnInit()` method, as shown below. ~~~jsx {2,18,21} title="spreadsheet.component.ts" import { Spreadsheet } from "@dhx/trial-spreadsheet"; @@ -210,11 +210,11 @@ export class SpreadsheetComponent implements OnInit, OnDestroy { } ~~~ -Now the Spreadsheet component is ready to use. When the element will be added to the page, it will initialize the Spreadsheet with data. You can provide necessary configuration settings as well. Visit our [Spreadsheet API docs](spreadsheet/api/overview/events_overview.md) to check the full list of available properties. +Now the Spreadsheet component is ready to use. When the element will be added to the page, it will initialize the Spreadsheet with data. You can provide necessary configuration settings as well. Visit our [Spreadsheet API docs](api/overview/events_overview.md) to check the full list of available properties. #### Handling events -When a user makes some action in the Spreadsheet, it invokes an event. You can use these events to detect the action and run the desired code for it. See the [full list of events](/spreadsheet/api/overview/events_overview/). +When a user makes some action in the Spreadsheet, it invokes an event. You can use these events to detect the action and run the desired code for it. See the [full list of events](api/overview/events_overview.md). Open the **spreadsheet.component.ts** file and complete the `ngOnInit()` method as in: diff --git a/docs/api/eventsbus_on_method.md b/docs/api/eventsbus_on_method.md index 97139e27..7d3abedd 100644 --- a/docs/api/eventsbus_on_method.md +++ b/docs/api/eventsbus_on_method.md @@ -35,7 +35,7 @@ spreadsheet.events.on("StyleChange", function(id){ ~~~ :::info -See the full list of the Spreadsheet events [here](api/api_overview.md/#spreadsheet-events). +See the full list of the Spreadsheet events [here](api/api_overview.md#spreadsheet-events). You can attach several handlers to the same event and all of them will be executed. If some of handlers return *false*, the related operations will be blocked. Event handlers are processed in the same order that they are attached. ::: diff --git a/docs/api/overview/eventbus_overview.md b/docs/api/overview/eventbus_overview.md index 4c76f9c2..5cfb089e 100644 --- a/docs/api/overview/eventbus_overview.md +++ b/docs/api/overview/eventbus_overview.md @@ -8,7 +8,7 @@ description: You can check an Event Bus methods overview of the DHTMLX JavaScrip | Name | Description | | ---------------------------------- | ----------------------------------------- | -| [](../eventsbus_detach_method.md) | @getshort(../eventsbus_detach_method.md) | -| [](../eventsbus_fire_method.md) | @getshort(../eventsbus_fire_method.md) | -| [](../eventsbus_on_method.md) | @getshort(../eventsbus_on_method.md) | +| [](api/eventsbus_detach_method.md) | @getshort(../eventsbus_detach_method.md) | +| [](api/eventsbus_fire_method.md) | @getshort(../eventsbus_fire_method.md) | +| [](api/eventsbus_on_method.md) | @getshort(../eventsbus_on_method.md) | diff --git a/docs/api/overview/events_overview.md b/docs/api/overview/events_overview.md index b2fc3887..85cc579b 100644 --- a/docs/api/overview/events_overview.md +++ b/docs/api/overview/events_overview.md @@ -8,18 +8,18 @@ description: You can have an Events overview of the DHTMLX JavaScript Spreadshee | Name | Description | | :--------------------------------------------- | :---------------------------------------------------- | -| [](../spreadsheet_afteraction_event.md) | @getshort(../spreadsheet_afteraction_event.md) | -| [](../spreadsheet_afterclear_event.md) | @getshort(../spreadsheet_afterclear_event.md) | -| [](../spreadsheet_afterdataloaded_event.md) | @getshort(../spreadsheet_afterdataloaded_event.md) | -| [](../spreadsheet_aftereditend_event.md) | @getshort(../spreadsheet_aftereditend_event.md) | -| [](../spreadsheet_aftereditstart_event.md) | @getshort(../spreadsheet_aftereditstart_event.md) | -| [](../spreadsheet_afterfocusset_event.md) | @getshort(../spreadsheet_afterfocusset_event.md) | -| [](../spreadsheet_afterselectionset_event.md) | @getshort(../spreadsheet_afterselectionset_event.md) | -| [](../spreadsheet_aftersheetchange_event.md) | @getshort(../spreadsheet_aftersheetchange_event.md) | -| [](../spreadsheet_beforeaction_event.md) | @getshort(../spreadsheet_beforeaction_event.md) | -| [](../spreadsheet_beforeclear_event.md) | @getshort(../spreadsheet_beforeclear_event.md) | -| [](../spreadsheet_beforeeditend_event.md) | @getshort(../spreadsheet_beforeeditend_event.md) | -| [](../spreadsheet_beforeeditstart_event.md) | @getshort(../spreadsheet_beforeeditstart_event.md) | -| [](../spreadsheet_beforefocusset_event.md) | @getshort(../spreadsheet_beforefocusset_event.md) | -| [](../spreadsheet_beforeselectionset_event.md) | @getshort(../spreadsheet_beforeselectionset_event.md) | -| [](../spreadsheet_beforesheetchange_event.md) | @getshort(../spreadsheet_beforesheetchange_event.md) | \ No newline at end of file +| [](api/spreadsheet_afteraction_event.md) | @getshort(../spreadsheet_afteraction_event.md) | +| [](api/spreadsheet_afterclear_event.md) | @getshort(../spreadsheet_afterclear_event.md) | +| [](api/spreadsheet_afterdataloaded_event.md) | @getshort(../spreadsheet_afterdataloaded_event.md) | +| [](api/spreadsheet_aftereditend_event.md) | @getshort(../spreadsheet_aftereditend_event.md) | +| [](api/spreadsheet_aftereditstart_event.md) | @getshort(../spreadsheet_aftereditstart_event.md) | +| [](api/spreadsheet_afterfocusset_event.md) | @getshort(../spreadsheet_afterfocusset_event.md) | +| [](api/spreadsheet_afterselectionset_event.md) | @getshort(../spreadsheet_afterselectionset_event.md) | +| [](api/spreadsheet_aftersheetchange_event.md) | @getshort(../spreadsheet_aftersheetchange_event.md) | +| [](api/spreadsheet_beforeaction_event.md) | @getshort(../spreadsheet_beforeaction_event.md) | +| [](api/spreadsheet_beforeclear_event.md) | @getshort(../spreadsheet_beforeclear_event.md) | +| [](api/spreadsheet_beforeeditend_event.md) | @getshort(../spreadsheet_beforeeditend_event.md) | +| [](api/spreadsheet_beforeeditstart_event.md) | @getshort(../spreadsheet_beforeeditstart_event.md) | +| [](api/spreadsheet_beforefocusset_event.md) | @getshort(../spreadsheet_beforefocusset_event.md) | +| [](api/spreadsheet_beforeselectionset_event.md) | @getshort(../spreadsheet_beforeselectionset_event.md) | +| [](api/spreadsheet_beforesheetchange_event.md) | @getshort(../spreadsheet_beforesheetchange_event.md) | \ No newline at end of file diff --git a/docs/api/overview/export_overview.md b/docs/api/overview/export_overview.md index 5a9586b6..2b72faa1 100644 --- a/docs/api/overview/export_overview.md +++ b/docs/api/overview/export_overview.md @@ -8,5 +8,5 @@ description: You can check an Export methods overview of the DHTMLX JavaScript S | Name | Description | | ----------------------------- | ------------------------------------ | -| [](../export_json_method.md) | @getshort(../export_json_method.md) | -| [](../export_xlsx_method.md) | @getshort(../export_xlsx_method.md) | +| [](api/export_json_method.md) | @getshort(../export_json_method.md) | +| [](api/export_xlsx_method.md) | @getshort(../export_xlsx_method.md) | diff --git a/docs/api/overview/methods_overview.md b/docs/api/overview/methods_overview.md index cb50cdbe..2dc43702 100644 --- a/docs/api/overview/methods_overview.md +++ b/docs/api/overview/methods_overview.md @@ -8,43 +8,43 @@ description: You can check a Methods overview of the DHTMLX JavaScript Spreadshe | Name | Description | | :------------------------------------------ | :------------------------------------------------- | -| [](../spreadsheet_addcolumn_method.md) | @getshort(../spreadsheet_addcolumn_method.md) | -| [](../spreadsheet_addformula_method.md) | @getshort(../spreadsheet_addformula_method.md) | -| [](../spreadsheet_addrow_method.md) | @getshort(../spreadsheet_addrow_method.md) | -| [](../spreadsheet_clear_method.md) | @getshort(../spreadsheet_clear_method.md) | -| [](../spreadsheet_deletecolumn_method.md) | @getshort(../spreadsheet_deletecolumn_method.md) | -| [](../spreadsheet_deleterow_method.md) | @getshort(../spreadsheet_deleterow_method.md) | -| [](../spreadsheet_eachcell_method.md) | @getshort(../spreadsheet_eachcell_method.md) | -| [](../spreadsheet_endedit_method.md) | @getshort(../spreadsheet_endedit_method.md) | -| [](../spreadsheet_fitcolumn_method.md) | @getshort(../spreadsheet_fitcolumn_method.md) | -| [](../spreadsheet_freezecols_method.md) | @getshort(../spreadsheet_freezecols_method.md) | -| [](../spreadsheet_freezerows_method.md) | @getshort(../spreadsheet_freezerows_method.md) | -| [](../spreadsheet_getfilter_method.md) | @getshort(../spreadsheet_getfilter_method.md) | -| [](../spreadsheet_getformat_method.md) | @getshort(../spreadsheet_getformat_method.md) | -| [](../spreadsheet_getformula_method.md) | @getshort(../spreadsheet_getformula_method.md) | -| [](../spreadsheet_getstyle_method.md) | @getshort(../spreadsheet_getstyle_method.md) | -| [](../spreadsheet_hidecols_method.md) | @getshort(../spreadsheet_hidecols_method.md) | -| [](../spreadsheet_hiderows_method.md) | @getshort(../spreadsheet_hiderows_method.md) | -| [](../spreadsheet_hidesearch_method.md) | @getshort(../spreadsheet_hidesearch_method.md) | -| [](../spreadsheet_getvalue_method.md) | @getshort(../spreadsheet_getvalue_method.md) | -| [](../spreadsheet_insertlink_method.md) | @getshort(../spreadsheet_insertlink_method.md) | -| [](../spreadsheet_islocked_method.md) | @getshort(../spreadsheet_islocked_method.md) | -| [](../spreadsheet_load_method.md) | @getshort(../spreadsheet_load_method.md) | -| [](../spreadsheet_lock_method.md) | @getshort(../spreadsheet_lock_method.md) | -| [](../spreadsheet_mergecells_method.md) | @getshort(../spreadsheet_mergecells_method.md) | -| [](../spreadsheet_parse_method.md) | @getshort(../spreadsheet_parse_method.md) | -| [](../spreadsheet_redo_method.md) | @getshort(../spreadsheet_redo_method.md) | -| [](../spreadsheet_search_method.md) | @getshort(../spreadsheet_search_method.md) | -| [](../spreadsheet_serialize_method.md) | @getshort(../spreadsheet_serialize_method.md) | -| [](../spreadsheet_setfilter_method.md) | @getshort(../spreadsheet_setfilter_method.md) | -| [](../spreadsheet_setformat_method.md) | @getshort(../spreadsheet_setformat_method.md) | -| [](../spreadsheet_setstyle_method.md) | @getshort(../spreadsheet_setstyle_method.md) | -| [](../spreadsheet_setvalidation_method.md) | @getshort(../spreadsheet_setvalidation_method.md) | -| [](../spreadsheet_setvalue_method.md) | @getshort(../spreadsheet_setvalue_method.md) | -| [](../spreadsheet_showcols_method.md) | @getshort(../spreadsheet_showcols_method.md) | -| [](../spreadsheet_showrows_method.md) | @getshort(../spreadsheet_showrows_method.md) | -| [](../spreadsheet_startedit_method.md) | @getshort(../spreadsheet_startedit_method.md) | -| [](../spreadsheet_undo_method.md) | @getshort(../spreadsheet_undo_method.md) | -| [](../spreadsheet_unfreezecols_method.md) | @getshort(../spreadsheet_unfreezecols_method.md) | -| [](../spreadsheet_unfreezerows_method.md) | @getshort(../spreadsheet_unfreezerows_method.md) | -| [](../spreadsheet_unlock_method.md) | @getshort(../spreadsheet_unlock_method.md) | \ No newline at end of file +| [](api/spreadsheet_addcolumn_method.md) | @getshort(../spreadsheet_addcolumn_method.md) | +| [](api/spreadsheet_addformula_method.md) | @getshort(../spreadsheet_addformula_method.md) | +| [](api/spreadsheet_addrow_method.md) | @getshort(../spreadsheet_addrow_method.md) | +| [](api/spreadsheet_clear_method.md) | @getshort(../spreadsheet_clear_method.md) | +| [](api/spreadsheet_deletecolumn_method.md) | @getshort(../spreadsheet_deletecolumn_method.md) | +| [](api/spreadsheet_deleterow_method.md) | @getshort(../spreadsheet_deleterow_method.md) | +| [](api/spreadsheet_eachcell_method.md) | @getshort(../spreadsheet_eachcell_method.md) | +| [](api/spreadsheet_endedit_method.md) | @getshort(../spreadsheet_endedit_method.md) | +| [](api/spreadsheet_fitcolumn_method.md) | @getshort(../spreadsheet_fitcolumn_method.md) | +| [](api/spreadsheet_freezecols_method.md) | @getshort(../spreadsheet_freezecols_method.md) | +| [](api/spreadsheet_freezerows_method.md) | @getshort(../spreadsheet_freezerows_method.md) | +| [](api/spreadsheet_getfilter_method.md) | @getshort(../spreadsheet_getfilter_method.md) | +| [](api/spreadsheet_getformat_method.md) | @getshort(../spreadsheet_getformat_method.md) | +| [](api/spreadsheet_getformula_method.md) | @getshort(../spreadsheet_getformula_method.md) | +| [](api/spreadsheet_getstyle_method.md) | @getshort(../spreadsheet_getstyle_method.md) | +| [](api/spreadsheet_hidecols_method.md) | @getshort(../spreadsheet_hidecols_method.md) | +| [](api/spreadsheet_hiderows_method.md) | @getshort(../spreadsheet_hiderows_method.md) | +| [](api/spreadsheet_hidesearch_method.md) | @getshort(../spreadsheet_hidesearch_method.md) | +| [](api/spreadsheet_getvalue_method.md) | @getshort(../spreadsheet_getvalue_method.md) | +| [](api/spreadsheet_insertlink_method.md) | @getshort(../spreadsheet_insertlink_method.md) | +| [](api/spreadsheet_islocked_method.md) | @getshort(../spreadsheet_islocked_method.md) | +| [](api/spreadsheet_load_method.md) | @getshort(../spreadsheet_load_method.md) | +| [](api/spreadsheet_lock_method.md) | @getshort(../spreadsheet_lock_method.md) | +| [](api/spreadsheet_mergecells_method.md) | @getshort(../spreadsheet_mergecells_method.md) | +| [](api/spreadsheet_parse_method.md) | @getshort(../spreadsheet_parse_method.md) | +| [](api/spreadsheet_redo_method.md) | @getshort(../spreadsheet_redo_method.md) | +| [](api/spreadsheet_search_method.md) | @getshort(../spreadsheet_search_method.md) | +| [](api/spreadsheet_serialize_method.md) | @getshort(../spreadsheet_serialize_method.md) | +| [](api/spreadsheet_setfilter_method.md) | @getshort(../spreadsheet_setfilter_method.md) | +| [](api/spreadsheet_setformat_method.md) | @getshort(../spreadsheet_setformat_method.md) | +| [](api/spreadsheet_setstyle_method.md) | @getshort(../spreadsheet_setstyle_method.md) | +| [](api/spreadsheet_setvalidation_method.md) | @getshort(../spreadsheet_setvalidation_method.md) | +| [](api/spreadsheet_setvalue_method.md) | @getshort(../spreadsheet_setvalue_method.md) | +| [](api/spreadsheet_showcols_method.md) | @getshort(../spreadsheet_showcols_method.md) | +| [](api/spreadsheet_showrows_method.md) | @getshort(../spreadsheet_showrows_method.md) | +| [](api/spreadsheet_startedit_method.md) | @getshort(../spreadsheet_startedit_method.md) | +| [](api/spreadsheet_undo_method.md) | @getshort(../spreadsheet_undo_method.md) | +| [](api/spreadsheet_unfreezecols_method.md) | @getshort(../spreadsheet_unfreezecols_method.md) | +| [](api/spreadsheet_unfreezerows_method.md) | @getshort(../spreadsheet_unfreezerows_method.md) | +| [](api/spreadsheet_unlock_method.md) | @getshort(../spreadsheet_unlock_method.md) | \ No newline at end of file diff --git a/docs/api/overview/properties_overview.md b/docs/api/overview/properties_overview.md index c3b89a1f..c7d84d98 100644 --- a/docs/api/overview/properties_overview.md +++ b/docs/api/overview/properties_overview.md @@ -8,15 +8,15 @@ description: You can check a Properties overview of the DHTMLX JavaScript Spread | Name | Description | | --------------------------------------------- | ---------------------------------------------------- | -| [](../spreadsheet_colscount_config.md) | @getshort(../spreadsheet_colscount_config.md) | -| [](../spreadsheet_editline_config.md) | @getshort(../spreadsheet_editline_config.md) | -| [](../spreadsheet_exportmodulepath_config.md) | @getshort(../spreadsheet_exportmodulepath_config.md) | -| [](../spreadsheet_formats_config.md) | @getshort(../spreadsheet_formats_config.md) | -| [](../spreadsheet_importmodulepath_config.md) | @getshort(../spreadsheet_importmodulepath_config.md) | -| [](../spreadsheet_localization_config.md) | @getshort(../spreadsheet_localization_config.md) | -| [](../spreadsheet_menu_config.md) | @getshort(../spreadsheet_menu_config.md) | -| [](../spreadsheet_multisheets_config.md) | @getshort(../spreadsheet_multisheets_config.md) | -| [](../spreadsheet_readonly_config.md) | @getshort(../spreadsheet_readonly_config.md) | -| [](../spreadsheet_rowscount_config.md) | @getshort(../spreadsheet_rowscount_config.md) | -| [](../spreadsheet_toolbarblocks_config.md) | @getshort(../spreadsheet_toolbarblocks_config.md) | +| [](api/spreadsheet_colscount_config.md) | @getshort(../spreadsheet_colscount_config.md) | +| [](api/spreadsheet_editline_config.md) | @getshort(../spreadsheet_editline_config.md) | +| [](api/spreadsheet_exportmodulepath_config.md) | @getshort(../spreadsheet_exportmodulepath_config.md) | +| [](api/spreadsheet_formats_config.md) | @getshort(../spreadsheet_formats_config.md) | +| [](api/spreadsheet_importmodulepath_config.md) | @getshort(../spreadsheet_importmodulepath_config.md) | +| [](api/spreadsheet_localization_config.md) | @getshort(../spreadsheet_localization_config.md) | +| [](api/spreadsheet_menu_config.md) | @getshort(../spreadsheet_menu_config.md) | +| [](api/spreadsheet_multisheets_config.md) | @getshort(../spreadsheet_multisheets_config.md) | +| [](api/spreadsheet_readonly_config.md) | @getshort(../spreadsheet_readonly_config.md) | +| [](api/spreadsheet_rowscount_config.md) | @getshort(../spreadsheet_rowscount_config.md) | +| [](api/spreadsheet_toolbarblocks_config.md) | @getshort(../spreadsheet_toolbarblocks_config.md) | diff --git a/docs/api/overview/selection_overview.md b/docs/api/overview/selection_overview.md index 8310e875..53061618 100644 --- a/docs/api/overview/selection_overview.md +++ b/docs/api/overview/selection_overview.md @@ -8,8 +8,8 @@ description: You can check a Selection methods overview of the DHTMLX JavaScript | Name | Description | | :--------------------------------------------- | :---------------------------------------------------- | -| [](../selection_getfocusedcell_method.md) | @getshort(../selection_getfocusedcell_method.md) | -| [](../selection_getselectedcell_method.md) | @getshort(../selection_getselectedcell_method.md) | -| [](../selection_removeselectedcell_method.md) | @getshort(../selection_removeselectedcell_method.md) | -| [](../selection_setfocusedcell_method.md) | @getshort(../selection_setfocusedcell_method.md) | -| [](../selection_setselectedcell_method.md) | @getshort(../selection_setselectedcell_method.md) | +| [](api/selection_getfocusedcell_method.md) | @getshort(../selection_getfocusedcell_method.md) | +| [](api/selection_getselectedcell_method.md) | @getshort(../selection_getselectedcell_method.md) | +| [](api/selection_removeselectedcell_method.md) | @getshort(../selection_removeselectedcell_method.md) | +| [](api/selection_setfocusedcell_method.md) | @getshort(../selection_setfocusedcell_method.md) | +| [](api/selection_setselectedcell_method.md) | @getshort(../selection_setselectedcell_method.md) | diff --git a/docs/api/overview/sheetmanager_overview.md b/docs/api/overview/sheetmanager_overview.md index d2247905..11498829 100644 --- a/docs/api/overview/sheetmanager_overview.md +++ b/docs/api/overview/sheetmanager_overview.md @@ -8,10 +8,10 @@ description: You can check a Sheet Manager API overview of the DHTMLX JavaScript | Name | Description | | :---------------------------------------- | :----------------------------------------------- | -| [](../sheetmanager_add_method.md) | @getshort(../sheetmanager_add_method.md) | -| [](../sheetmanager_clear_method.md) | @getshort(../sheetmanager_clear_method.md) | -| [](../sheetmanager_get_method.md) | @getshort(../sheetmanager_get_method.md) | -| [](../sheetmanager_getactive_method.md) | @getshort(../sheetmanager_getactive_method.md) | -| [](../sheetmanager_getall_method.md) | @getshort(../sheetmanager_getall_method.md) | -| [](../sheetmanager_remove_method.md) | @getshort(../sheetmanager_remove_method.md) | -| [](../sheetmanager_setactive_method.md) | @getshort(../sheetmanager_setactive_method.md) | +| [](api/sheetmanager_add_method.md) | @getshort(../sheetmanager_add_method.md) | +| [](api/sheetmanager_clear_method.md) | @getshort(../sheetmanager_clear_method.md) | +| [](api/sheetmanager_get_method.md) | @getshort(../sheetmanager_get_method.md) | +| [](api/sheetmanager_getactive_method.md) | @getshort(../sheetmanager_getactive_method.md) | +| [](api/sheetmanager_getall_method.md) | @getshort(../sheetmanager_getall_method.md) | +| [](api/sheetmanager_remove_method.md) | @getshort(../sheetmanager_remove_method.md) | +| [](api/sheetmanager_setactive_method.md) | @getshort(../sheetmanager_setactive_method.md) | diff --git a/docs/api/spreadsheet_addformula_method.md b/docs/api/spreadsheet_addformula_method.md index f67c267e..b689c852 100644 --- a/docs/api/spreadsheet_addformula_method.md +++ b/docs/api/spreadsheet_addformula_method.md @@ -52,4 +52,4 @@ spreadsheet.parse([ **Related sample:** [Spreadsheet. Add custom formula](https://snippet.dhtmlx.com/wvxdlahp) -**Related articles:** [Formulas and functions](/functions/#custom-formulas) +**Related articles:** [Formulas and functions](functions.md#custom-formulas) diff --git a/docs/api/spreadsheet_clear_method.md b/docs/api/spreadsheet_clear_method.md index 85be4732..f49a8fe6 100644 --- a/docs/api/spreadsheet_clear_method.md +++ b/docs/api/spreadsheet_clear_method.md @@ -28,6 +28,6 @@ spreadsheet.clear(); **Change log:** Added in v4.2 -**Related articles:** [Clearing spreadsheet](working_with_ssheet.md/#clearing-spreadsheet) +**Related articles:** [Clearing spreadsheet](working_with_ssheet.md#clearing-spreadsheet) **Related sample:** [Spreadsheet. Clear](https://snippet.dhtmlx.com/szmtjn72) diff --git a/docs/api/spreadsheet_freezecols_method.md b/docs/api/spreadsheet_freezecols_method.md index 5a6f7c0b..7c34a912 100644 --- a/docs/api/spreadsheet_freezecols_method.md +++ b/docs/api/spreadsheet_freezecols_method.md @@ -27,9 +27,9 @@ spreadsheet.freezeCols("B2"); // the columns up to the "B" column will be fixed spreadsheet.freezeCols("sheet2!B2"); // the columns up to the "B" column in "sheet2" will be fixed ~~~ -**Related articles:** [Work with Spreadsheet](working_with_ssheet.md/#freezingunfreezing-rows-and-columns) +**Related articles:** [Work with Spreadsheet](working_with_ssheet.md#freezingunfreezing-rows-and-columns) -**Related API:** [`unfreezeCols()`](api/spreadsheet_unfreezecols_method.md/) +**Related API:** [`unfreezeCols()`](api/spreadsheet_unfreezecols_method.md) **Related sample:** [Spreadsheet. Freezing columns and rows via API](https://snippet.dhtmlx.com/a12xd1mn) diff --git a/docs/api/spreadsheet_freezerows_method.md b/docs/api/spreadsheet_freezerows_method.md index dde77289..a4ef9116 100644 --- a/docs/api/spreadsheet_freezerows_method.md +++ b/docs/api/spreadsheet_freezerows_method.md @@ -27,9 +27,9 @@ spreadsheet.freezeRows("B2"); // the rows up to the "2" row will be fixed spreadsheet.freezeRows("sheet2!B2"); // the rows up to the "2" row in "sheet2" will be fixed ~~~ -**Related articles:** [Work with Spreadsheet](working_with_ssheet.md/#freezingunfreezing-rows-and-columns) +**Related articles:** [Work with Spreadsheet](working_with_ssheet.md#freezingunfreezing-rows-and-columns) -**Related API:** [`unfreezeRows()`](api/spreadsheet_unfreezerows_method.md/) +**Related API:** [`unfreezeRows()`](api/spreadsheet_unfreezerows_method.md) **Related sample:** [Spreadsheet. Freezing columns and rows via API](https://snippet.dhtmlx.com/a12xd1mn) diff --git a/docs/api/spreadsheet_hidecols_method.md b/docs/api/spreadsheet_hidecols_method.md index b8dd25e9..edf46cf4 100644 --- a/docs/api/spreadsheet_hidecols_method.md +++ b/docs/api/spreadsheet_hidecols_method.md @@ -29,7 +29,7 @@ spreadsheet.hideCols("B2:C2"); // the "B" and "C" columns will be hidden ~~~ -**Related articles:** [Work with Spreadsheet](working_with_ssheet.md/#hidingshowing-rows-and-columns) +**Related articles:** [Work with Spreadsheet](working_with_ssheet.md#hidingshowing-rows-and-columns) **Related API:** [`showCols()`](api/spreadsheet_showcols_method.md) diff --git a/docs/api/spreadsheet_hiderows_method.md b/docs/api/spreadsheet_hiderows_method.md index e8e70070..62223315 100644 --- a/docs/api/spreadsheet_hiderows_method.md +++ b/docs/api/spreadsheet_hiderows_method.md @@ -28,7 +28,7 @@ spreadsheet.hideRows("sheet2!B2"); // the "2" row in "sheet2" will be hidden spreadsheet.hideRows("B2:C4"); // the rows from "2" to "4" will be hidden ~~~ -**Related articles:** [Work with Spreadsheet](working_with_ssheet.md/#hidingshowing-rows-and-columns) +**Related articles:** [Work with Spreadsheet](working_with_ssheet.md#hidingshowing-rows-and-columns) **Related API:** [`showRows()`](api/spreadsheet_showrows_method.md) diff --git a/docs/api/spreadsheet_localization_config.md b/docs/api/spreadsheet_localization_config.md index 40d79fb0..8a2c811d 100644 --- a/docs/api/spreadsheet_localization_config.md +++ b/docs/api/spreadsheet_localization_config.md @@ -83,4 +83,4 @@ DHTMLX Spreadsheet uses the following characters for setting a date format: **Change log:** - Added in v5.1 -**Related article:** [Number, date, time, currency localization](spreadsheet/number_formatting.md#number-date-time-currency-localization) \ No newline at end of file +**Related article:** [Number, date, time, currency localization](number_formatting.md#number-date-time-currency-localization) \ No newline at end of file diff --git a/docs/api/spreadsheet_parse_method.md b/docs/api/spreadsheet_parse_method.md index 0aa550dc..d444f980 100644 --- a/docs/api/spreadsheet_parse_method.md +++ b/docs/api/spreadsheet_parse_method.md @@ -95,7 +95,7 @@ If you need to create a data set *for one sheet* only, specify data as an **arra - `cell` - (required) the id of a cell that is formed as "id of the column + id of the row", e.g. A1 - `value` - (required) the value of a cell - `css` - (optional) the name of the CSS class -- `format` - (optional) the name of the [default number format](number_formatting.md/#default-number-formats) or of a [custom format](number_formatting.md#formats-customization) that you've added to apply to the cell value +- `format` - (optional) the name of the [default number format](number_formatting.md#default-number-formats) or of a [custom format](number_formatting.md#formats-customization) that you've added to apply to the cell value - `editor` - (optional) an object with configuration settings for the editor of a cell: - `type` - (required) the type of the cell editor: "select" - `options` - (required) either a range of cells ("A1:B8") or an array of string values @@ -121,7 +121,7 @@ If you need to create a data set *for several sheets* at once, specify data as a - `cell` - (required) the id of a cell that is formed as "id of the column + id of the row", e.g. A1 - `value` - (required) the value of a cell - `css` - (optional) the name of the CSS class - - `format` - (optional) the name of the [default number format](number_formatting.md/#default-number-formats) or of a [custom format](number_formatting.md#formats-customization) that you've added to apply to the cell value + - `format` - (optional) the name of the [default number format](number_formatting.md#default-number-formats) or of a [custom format](number_formatting.md#formats-customization) that you've added to apply to the cell value - `editor` - (optional) an object with configuration settings for the editor of a cell: - `type` - (required) the type of the cell editor: "select" - `options` - (required) either a range of cells ("A1:B8") or an array of string values diff --git a/docs/api/spreadsheet_showcols_method.md b/docs/api/spreadsheet_showcols_method.md index 4a4fd6da..9828ff07 100644 --- a/docs/api/spreadsheet_showcols_method.md +++ b/docs/api/spreadsheet_showcols_method.md @@ -28,7 +28,7 @@ spreadsheet.showCols("sheet2!B2"); // the "B" column in "sheet2" will become vis spreadsheet.showCols("B2:C2"); // the "B" and "C" columns will become visible again ~~~ -**Related articles:** [Work with Spreadsheet](working_with_ssheet.md/#hidingshowing-rows-and-columns) +**Related articles:** [Work with Spreadsheet](working_with_ssheet.md#hidingshowing-rows-and-columns) **Related API:** [`hideCols()`](api/spreadsheet_hidecols_method.md) diff --git a/docs/api/spreadsheet_showrows_method.md b/docs/api/spreadsheet_showrows_method.md index 3782aec2..172c6d24 100644 --- a/docs/api/spreadsheet_showrows_method.md +++ b/docs/api/spreadsheet_showrows_method.md @@ -28,7 +28,7 @@ spreadsheet.showRows("sheet2!B2"); // the "2" row in "sheet2" will become visibl spreadsheet.showRows("B2:C2"); // the rows from "2" to "4" will become visible again ~~~ -**Related articles:** [Work with Spreadsheet](working_with_ssheet.md/#hidingshowing-rows-and-columns) +**Related articles:** [Work with Spreadsheet](working_with_ssheet.md#hidingshowing-rows-and-columns) **Related API:** [`hideRows()`](api/spreadsheet_hiderows_method.md) diff --git a/docs/api/spreadsheet_toolbarblocks_config.md b/docs/api/spreadsheet_toolbarblocks_config.md index 6d263e34..f23824c9 100644 --- a/docs/api/spreadsheet_toolbarblocks_config.md +++ b/docs/api/spreadsheet_toolbarblocks_config.md @@ -56,7 +56,7 @@ const spreadsheet = new dhx.Spreadsheet("spreadsheet_container", { }); ~~~ -Check how you can [customize the toolbar](customization.md/#toolbar). +Check how you can [customize the toolbar](customization.md#toolbar). **Change log:** diff --git a/docs/api/spreadsheet_unfreezecols_method.md b/docs/api/spreadsheet_unfreezecols_method.md index 9cda7d04..613a5cd3 100644 --- a/docs/api/spreadsheet_unfreezecols_method.md +++ b/docs/api/spreadsheet_unfreezecols_method.md @@ -27,9 +27,9 @@ spreadsheet.unfreezeCols(); // fixed columns in the current sheet will be unfroz spreadsheet.unfreezeCols("sheet2!A1"); // fixed columns in "sheet2" will be unfrozen ~~~ -**Related articles:** [Work with Spreadsheet](working_with_ssheet.md/#freezingunfreezing-rows-and-columns) +**Related articles:** [Work with Spreadsheet](working_with_ssheet.md#freezingunfreezing-rows-and-columns) -**Related API:** [`freezeCols()`](api/spreadsheet_freezecols_method.md/) +**Related API:** [`freezeCols()`](api/spreadsheet_freezecols_method.md) **Related sample:** [Spreadsheet. Freezing columns and rows via API](https://snippet.dhtmlx.com/a12xd1mn) diff --git a/docs/api/spreadsheet_unfreezerows_method.md b/docs/api/spreadsheet_unfreezerows_method.md index 7d72afdb..fd63351b 100644 --- a/docs/api/spreadsheet_unfreezerows_method.md +++ b/docs/api/spreadsheet_unfreezerows_method.md @@ -27,9 +27,9 @@ spreadsheet.unfreezeRows(); // fixed rows in the current sheet will be unfrozen spreadsheet.unfreezeRows("sheet2!A1"); // fixed rows in "sheet2" will be unfrozen ~~~ -**Related articles:** [Work with Spreadsheet](working_with_ssheet.md/#freezingunfreezing-rows-and-columns) +**Related articles:** [Work with Spreadsheet](working_with_ssheet.md#freezingunfreezing-rows-and-columns) -**Related API:** [`freezeRows()`](api/spreadsheet_freezerows_method.md/) +**Related API:** [`freezeRows()`](api/spreadsheet_freezerows_method.md) **Related sample:** [Spreadsheet. Freezing columns and rows via API](https://snippet.dhtmlx.com/a12xd1mn) diff --git a/docs/functions.md b/docs/functions.md index af45830a..1013d61e 100644 --- a/docs/functions.md +++ b/docs/functions.md @@ -1450,7 +1450,7 @@ When you enter a formula, a popup with description of the function and its param Check the example in our [snippet tool](https://snippet.dhtmlx.com/wux2b35b). -You can modify the default locale for the popup with formula parameters and add a custom locale. Check the details in the [Localization](localization.md/#default-locale-for-formulas) guide. +You can modify the default locale for the popup with formula parameters and add a custom locale. Check the details in the [Localization](localization.md#default-locale-for-formulas) guide. ## Custom formulas diff --git a/docs/guides.md b/docs/guides.md index ee2293ea..b921481e 100644 --- a/docs/guides.md +++ b/docs/guides.md @@ -33,7 +33,7 @@ Shows the ways of loading data into Spreadsheet, handling events and using main ### Frameworks & integrations -- [React Spreadsheet](/react/) - official React component with props, events, and TypeScript support +- [React Spreadsheet](react.md) - official React component with props, events, and TypeScript support - [Integration with Angular](angular_integration.md) - GitHub demo of using Spreadsheet in an Angular app - [Integration with Svelte](svelte_integration.md) - GitHub demo of using Spreadsheet in a Svelte app - [Integration with Vue.js](vuejs_integration.md) - GitHub demo of using Spreadsheet in a Vue app diff --git a/docs/how_to_start.md b/docs/how_to_start.md index 5eb4b4f1..fd25bd71 100644 --- a/docs/how_to_start.md +++ b/docs/how_to_start.md @@ -142,6 +142,6 @@ spreadsheet.parse(data); That's all. Just four simple steps and you have a handy tool for work with data in the tabular form. Now you can start working with your data or keep exploring the inner world of DHTMLX Spreadsheet. -- [](index.md) +- [Spreadsheet overview](/) - [](guides.md) - [](api/api_overview.md) diff --git a/docs/index.md b/docs/index.md index f5de9de2..62a747cf 100644 --- a/docs/index.md +++ b/docs/index.md @@ -10,7 +10,7 @@ description: You can have an overview of the JavaScript Spreadsheet library in t DHTMLX Spreadsheet is a client-side JavaScript component that allows editing and formatting data in spreadsheets online. It includes a configurable toolbar, handy menu and context menu, and adjustable grid, supports hot keys navigation, loads data both from external and local sources, provides the ability to localize interface into the desired language. :::tip -There is a [User Guide](guides/#user-guides) provided to make work with Spreadsheet easy for your end users +There is a [User Guide](guides.md#user-guides) provided to make work with Spreadsheet easy for your end users ::: ## Spreadsheet structure diff --git a/docs/initialization.md b/docs/initialization.md index e20d67c9..9c3879b4 100644 --- a/docs/initialization.md +++ b/docs/initialization.md @@ -61,7 +61,7 @@ const spreadsheet = new dhx.Spreadsheet("spreadsheet", { ### Configuration properties -See the full list of [properties](api/api_overview.md/#spreadsheet-properties) that you can specify in the Spreadsheet configuration object in the [Spreadsheet API overview](api/api_overview.md/#spreadsheet-properties) article. +See the full list of [properties](api/api_overview.md#spreadsheet-properties) that you can specify in the Spreadsheet configuration object in the [Spreadsheet API overview](api/api_overview.md#spreadsheet-properties) article. You can set configuration options during initialization as the second parameter of the constructor: diff --git a/docs/localization.md b/docs/localization.md index 39e928e0..ad7f9c20 100644 --- a/docs/localization.md +++ b/docs/localization.md @@ -218,7 +218,7 @@ const en = { }; ~~~ -[Check the full default locale for formulas](/formulas_locale/). +[Check the full default locale for formulas](formulas_locale.md). **Related sample**: [Spreadsheet. Localization](https://snippet.dhtmlx.com/yn5hyyim?mode=wide) diff --git a/docs/migration.md b/docs/migration.md index a542e59b..5d120eb5 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -21,7 +21,7 @@ The following properties of `ISpreadsheetConfig` are deprecated and removed. Che The following methods of the `ISpreadsheet` instance are deprecated and removed. -Use the new [`sheets` module (Sheet Manager) API](/api/overview/sheetmanager_overview/) instead: +Use the new [`sheets` module (Sheet Manager) API](api/overview/sheetmanager_overview.md) instead:
@@ -100,7 +100,7 @@ spreadsheet.unfreezeCols(); // fixed columns in the current sheet will be unfroz spreadsheet.unfreezeCols("sheet2!A1"); // fixed columns in "sheet2" will be unfrozen ~~~ -- new action is added: [`toggleFreeze`](api/overview/actions_overview.md/#list-of-actions) +- new action is added: [`toggleFreeze`](api/overview/actions_overview.md#list-of-actions) ~~~jsx title="From v5.2" // using the `toggleFreeze` action with the beforeAction/afterAction events @@ -216,7 +216,7 @@ At the moment, there is a set of events which must be used in an old way as they ## 4.1 -> 4.2 -In v4.2, the [Align](customization.md/#default-controls) block of the Spreadsheet toolbar is divided into two sub-blocks: Horizontal align and Vertical align. Thus, the list of ids of the default controls of the Align block is changed and extended: +In v4.2, the [Align](customization.md#default-controls) block of the Spreadsheet toolbar is divided into two sub-blocks: Horizontal align and Vertical align. Thus, the list of ids of the default controls of the Align block is changed and extended: `Before v4.2`: @@ -242,7 +242,7 @@ The **Vertical align** sub-block of the **Align** block: ### Localization -Note, that the [locale options](localization.md/) for the **Align** block have been also updated: +Note, that the [locale options](localization.md) for the **Align** block have been also updated: `Before v4.2`: diff --git a/docs/number_formatting.md b/docs/number_formatting.md index a1a61abd..cdd97757 100644 --- a/docs/number_formatting.md +++ b/docs/number_formatting.md @@ -69,7 +69,7 @@ spreadsheet.parse({ }); ~~~ -Check [the full list of available characters used to make formats](/api/spreadsheet_localization_config/#characters-for-setting-date-format). +Check [the full list of available characters used to make formats](api/spreadsheet_localization_config.md#characters-for-setting-date-format). ## Time format @@ -96,7 +96,7 @@ spreadsheet.parse({ ## Number, date, time, currency localization -With Spreadsheet configuration options, you can localize time and date, specify the necessary currency sign and provide the desired decimal and thousands separators. All these settings are available in the [`localization`](spreadsheet/api/spreadsheet_localization_config.md) property. It is an object with the following properties: +With Spreadsheet configuration options, you can localize time and date, specify the necessary currency sign and provide the desired decimal and thousands separators. All these settings are available in the [`localization`](api/spreadsheet_localization_config.md) property. It is an object with the following properties: - **decimal** - (optional) the symbol used as a decimal separator, **"."** (a period) by default
Possible values are `"." | ","` - **thousands** - (optional) the symbol used as a thousands separator, **","** (a comma) by default
Possible values are `"." | "," | " " | ""` diff --git a/docs/react/events.md b/docs/react/events.md index c6aceae7..8b2c5893 100644 --- a/docs/react/events.md +++ b/docs/react/events.md @@ -9,7 +9,7 @@ description: "Event callback props for ReactSpreadsheet: actions, selection, edi All event callbacks are optional props. "Before" callbacks can return `false` to cancel the operation. :::note -The React wrapper uses `onCamelCase` prop names (e.g. `onAfterAction`) while the JS Spreadsheet API uses `camelCase` event names on the event bus (e.g. `afterAction`). See the [JS API Events Reference](/api/overview/events_overview/) for the imperative API. +The React wrapper uses `onCamelCase` prop names (e.g. `onAfterAction`) while the JS Spreadsheet API uses `camelCase` event names on the event bus (e.g. `afterAction`). See the [JS API Events Reference](api/overview/events_overview.md) for the imperative API. ::: ## Action events @@ -18,8 +18,8 @@ Fired for any user action (cell edits, formatting, structural changes, etc.). | Prop | Cancellable | Description | |------|:-----------:|-------------| -| `onBeforeAction` | Yes | Fires before any user action executes. Return `false` to cancel. Handler: [`BeforeActionHandler`](/react/types#handler-type-aliases). JS API: [`beforeAction`](/api/spreadsheet_beforeaction_event/). | -| `onAfterAction` | No | Fires after any user action completes. Handler: [`AfterActionHandler`](/react/types#handler-type-aliases). JS API: [`afterAction`](/api/spreadsheet_afteraction_event/). | +| `onBeforeAction` | Yes | Fires before any user action executes. Return `false` to cancel. Handler: [`BeforeActionHandler`](react/types.md#handler-type-aliases). JS API: [`beforeAction`](api/spreadsheet_beforeaction_event.md). | +| `onAfterAction` | No | Fires after any user action completes. Handler: [`AfterActionHandler`](react/types.md#handler-type-aliases). JS API: [`afterAction`](api/spreadsheet_afteraction_event.md). | **Example: Block row deletion** @@ -51,12 +51,12 @@ Fired when the cell selection or focus changes. | Prop | Cancellable | Description | |------|:-----------:|-------------| -| `onBeforeSelectionSet` | Yes | Fires before a cell is added to the selection. Handler: [`BeforeCellHandler`](/react/types#handler-type-aliases). JS API: [`beforeSelectionSet`](/api/spreadsheet_beforeselectionset_event/). | -| `onAfterSelectionSet` | No | Fires after a cell is added to the selection. Handler: [`AfterCellHandler`](/react/types#handler-type-aliases). JS API: [`afterSelectionSet`](/api/spreadsheet_afterselectionset_event/). | -| `onBeforeSelectionRemove` | Yes | Fires before a cell is removed from the selection. Handler: [`BeforeCellHandler`](/react/types#handler-type-aliases). | -| `onAfterSelectionRemove` | No | Fires after a cell is removed from the selection. Handler: [`AfterCellHandler`](/react/types#handler-type-aliases). | -| `onBeforeFocusSet` | Yes | Fires before the focused cell changes. Handler: [`BeforeCellHandler`](/react/types#handler-type-aliases). JS API: [`beforeFocusSet`](/api/spreadsheet_beforefocusset_event/). | -| `onAfterFocusSet` | No | Fires after the focused cell changes. Handler: [`AfterCellHandler`](/react/types#handler-type-aliases). JS API: [`afterFocusSet`](/api/spreadsheet_afterfocusset_event/). | +| `onBeforeSelectionSet` | Yes | Fires before a cell is added to the selection. Handler: [`BeforeCellHandler`](react/types.md#handler-type-aliases). JS API: [`beforeSelectionSet`](api/spreadsheet_beforeselectionset_event.md). | +| `onAfterSelectionSet` | No | Fires after a cell is added to the selection. Handler: [`AfterCellHandler`](react/types.md#handler-type-aliases). JS API: [`afterSelectionSet`](api/spreadsheet_afterselectionset_event.md). | +| `onBeforeSelectionRemove` | Yes | Fires before a cell is removed from the selection. Handler: [`BeforeCellHandler`](react/types.md#handler-type-aliases). | +| `onAfterSelectionRemove` | No | Fires after a cell is removed from the selection. Handler: [`AfterCellHandler`](react/types.md#handler-type-aliases). | +| `onBeforeFocusSet` | Yes | Fires before the focused cell changes. Handler: [`BeforeCellHandler`](react/types.md#handler-type-aliases). JS API: [`beforeFocusSet`](api/spreadsheet_beforefocusset_event.md). | +| `onAfterFocusSet` | No | Fires after the focused cell changes. Handler: [`AfterCellHandler`](react/types.md#handler-type-aliases). JS API: [`afterFocusSet`](api/spreadsheet_afterfocusset_event.md). | **Example: Track selected cell** @@ -77,10 +77,10 @@ Fired when cell editing begins or ends. | Prop | Cancellable | Description | |------|:-----------:|-------------| -| `onBeforeEditStart` | Yes | Fires before cell editing begins. Handler: [`BeforeEditHandler`](/react/types#handler-type-aliases). JS API: [`beforeEditStart`](/api/spreadsheet_beforeeditstart_event/). | -| `onAfterEditStart` | No | Fires after cell editing begins. Handler: [`AfterEditHandler`](/react/types#handler-type-aliases). JS API: [`afterEditStart`](/api/spreadsheet_aftereditstart_event/). | -| `onBeforeEditEnd` | Yes | Fires before cell editing ends. Return `false` to cancel and keep editing. Handler: [`BeforeEditHandler`](/react/types#handler-type-aliases). JS API: [`beforeEditEnd`](/api/spreadsheet_beforeeditend_event/). | -| `onAfterEditEnd` | No | Fires after cell editing ends and the value is committed. Handler: [`AfterEditHandler`](/react/types#handler-type-aliases). JS API: [`afterEditEnd`](/api/spreadsheet_aftereditend_event/). | +| `onBeforeEditStart` | Yes | Fires before cell editing begins. Handler: [`BeforeEditHandler`](react/types.md#handler-type-aliases). JS API: [`beforeEditStart`](api/spreadsheet_beforeeditstart_event.md). | +| `onAfterEditStart` | No | Fires after cell editing begins. Handler: [`AfterEditHandler`](react/types.md#handler-type-aliases). JS API: [`afterEditStart`](api/spreadsheet_aftereditstart_event.md). | +| `onBeforeEditEnd` | Yes | Fires before cell editing ends. Return `false` to cancel and keep editing. Handler: [`BeforeEditHandler`](react/types.md#handler-type-aliases). JS API: [`beforeEditEnd`](api/spreadsheet_beforeeditend_event.md). | +| `onAfterEditEnd` | No | Fires after cell editing ends and the value is committed. Handler: [`AfterEditHandler`](react/types.md#handler-type-aliases). JS API: [`afterEditEnd`](api/spreadsheet_aftereditend_event.md). | **Example: Validate before committing** @@ -101,8 +101,8 @@ Fired when the active sheet tab changes. | Prop | Cancellable | Description | |------|:-----------:|-------------| -| `onBeforeSheetChange` | Yes | Fires before the active sheet changes. Handler: [`BeforeSheetHandler`](/react/types#handler-type-aliases). JS API: [`beforeSheetChange`](/api/spreadsheet_beforesheetchange_event/). | -| `onAfterSheetChange` | No | Fires after the active sheet changes. Handler: [`AfterSheetHandler`](/react/types#handler-type-aliases). JS API: [`afterSheetChange`](/api/spreadsheet_aftersheetchange_event/). | +| `onBeforeSheetChange` | Yes | Fires before the active sheet changes. Handler: [`BeforeSheetHandler`](react/types.md#handler-type-aliases). JS API: [`beforeSheetChange`](api/spreadsheet_beforesheetchange_event.md). | +| `onAfterSheetChange` | No | Fires after the active sheet changes. Handler: [`AfterSheetHandler`](react/types.md#handler-type-aliases). JS API: [`afterSheetChange`](api/spreadsheet_aftersheetchange_event.md). | **Example: Track active sheet** @@ -121,7 +121,7 @@ Fired when spreadsheet data is loaded. | Prop | Description | |------|-------------| -| `onAfterDataLoaded` | Fires after data loading completes (via `sheets` or `loadUrl`). JS API: [`afterDataLoaded`](/api/spreadsheet_afterdataloaded_event/). | +| `onAfterDataLoaded` | Fires after data loading completes (via `sheets` or `loadUrl`). JS API: [`afterDataLoaded`](api/spreadsheet_afterdataloaded_event.md). | **Example: Show loading state** @@ -140,7 +140,7 @@ Fired during user input in cells or the formula bar. | Prop | Description | |------|-------------| -| `onGroupFill` | Fires during auto-fill (drag-fill) operations. Handler: `(focusedCell: string, selectedCell: string) => void`. JS API: [`groupFill`](/api/spreadsheet_groupfill_event/). | +| `onGroupFill` | Fires during auto-fill (drag-fill) operations. Handler: `(focusedCell: string, selectedCell: string) => void`. JS API: [`groupFill`](api/spreadsheet_groupfill_event.md). | | `onEditLineInput` | Fires on input in the formula/edit line. Handler: `(value: string) => void`. | | `onCellInput` | Fires on input in a cell during editing. Handler: `(cell: string, value: string) => void`. | diff --git a/docs/react/index.md b/docs/react/index.md index 2746c4be..c435d5b5 100644 --- a/docs/react/index.md +++ b/docs/react/index.md @@ -10,8 +10,8 @@ The official declarative React wrapper for DHTMLX Spreadsheet. Build spreadsheet ## Get started -- [Installation](/react/installation/) - install the evaluation or commercial package -- [Quick start](/react/quick-start/) - build your first spreadsheet app step by step +- [Installation](react/installation.md) - install the evaluation or commercial package +- [Quick start](react/quick-start.md) - build your first spreadsheet app step by step - [Online examples](https://dhtmlx.com/react/demos/spreadsheet/) - check live demos of React Spreadsheet features :::info @@ -20,26 +20,26 @@ You can also explore the [GitHub demo repository](https://github.com/DHTMLX/reac ## API reference -- [Props reference](/react/props/) - all component props with types and defaults -- [Events reference](/react/events/) - event callback props grouped by category -- [Types reference](/react/types/) - TypeScript interfaces, enums, and type aliases +- [Props reference](react/props.md) - all component props with types and defaults +- [Events reference](react/events.md) - event callback props grouped by category +- [Types reference](react/types.md) - TypeScript interfaces, enums, and type aliases ## Data model -The [`sheets`](/react/props#data-props) prop is the single source of truth for all spreadsheet data. Each sheet is a [`SheetData`](/react/types#sheetdata) object containing cells, row/column configuration, merged ranges, frozen panes, filters, and sorting. +The [`sheets`](react/props.md#data-props) prop is the single source of truth for all spreadsheet data. Each sheet is a [`SheetData`](react/types.md#sheetdata) object containing cells, row/column configuration, merged ranges, frozen panes, filters, and sorting. ## State management Learn how to keep spreadsheet data in sync with your application state: -- [State management basics](/react/state/state-management-basics/) - controlled props, event callbacks, the ref escape hatch -- [Redux toolkit](/react/state/redux-toolkit/) - step-by-step integration guide +- [State management basics](react/state/state-management-basics.md) - controlled props, event callbacks, the ref escape hatch +- [Redux toolkit](react/state/redux-toolkit.md) - step-by-step integration guide ## Framework integrations -- [Next.js](/react/nextjs/) - using React Spreadsheet with Next.js App Router +- [Next.js](react/nextjs.md) - using React Spreadsheet with Next.js App Router ## Theming and localization -- [Themes](/react/themes/) - built-in themes and custom CSS overrides -- [Localization](/react/localization/) - UI translations and number/date formatting +- [Themes](react/themes.md) - built-in themes and custom CSS overrides +- [Localization](react/localization.md) - UI translations and number/date formatting diff --git a/docs/react/installation.md b/docs/react/installation.md index 1c57f191..0afa317b 100644 --- a/docs/react/installation.md +++ b/docs/react/installation.md @@ -81,4 +81,4 @@ TypeScript type definitions are bundled with the package. No additional `@types/ ## Next steps -- [Quick start](/react/quick-start/) - build your first spreadsheet app step by step +- [Quick start](react/quick-start.md) - build your first spreadsheet app step by step diff --git a/docs/react/localization.md b/docs/react/localization.md index eb3dcff7..1a5de5e8 100644 --- a/docs/react/localization.md +++ b/docs/react/localization.md @@ -19,7 +19,7 @@ These props are independent: you can use either or both. ## UI localization (spreadsheetLocale) -The `spreadsheetLocale` prop accepts a [`SpreadsheetLocale`](/react/types#spreadsheetlocale) object with two properties: +The `spreadsheetLocale` prop accepts a [`SpreadsheetLocale`](react/types.md#spreadsheetlocale) object with two properties: - `locale` - a `Record` of UI string overrides - `formulas` - a `Record` of localized formula names grouped by category @@ -52,7 +52,7 @@ const locale: SpreadsheetLocale = { ## Number/date formatting (localization) -The `localization` prop controls how numbers and dates are displayed: decimal separators, currency symbols, date patterns, etc. It uses the same format as the DHTMLX Spreadsheet [`localization`](/api/spreadsheet_localization_config/) configuration property. +The `localization` prop controls how numbers and dates are displayed: decimal separators, currency symbols, date patterns, etc. It uses the same format as the DHTMLX Spreadsheet [`localization`](api/spreadsheet_localization_config.md) configuration property. ~~~tsx @@ -38,9 +38,9 @@ These props are applied immediately without destroying the widget. No data loss | Prop | Type | Description | |------|------|-------------| -| `rowsCount` | `number` | Number of rows in the grid. See JS API: [`rowsCount`](/api/spreadsheet_rowscount_config/). | -| `colsCount` | `number` | Number of columns in the grid. See JS API: [`colsCount`](/api/spreadsheet_colscount_config/). | -| `readonly` | `boolean` | Enable read-only mode. See JS API: [`readonly`](/api/spreadsheet_readonly_config/). | +| `rowsCount` | `number` | Number of rows in the grid. See JS API: [`rowsCount`](api/spreadsheet_rowscount_config.md). | +| `colsCount` | `number` | Number of columns in the grid. See JS API: [`colsCount`](api/spreadsheet_colscount_config.md). | +| `readonly` | `boolean` | Enable read-only mode. See JS API: [`readonly`](api/spreadsheet_readonly_config.md). | ## Data props @@ -48,7 +48,7 @@ The `sheets` prop is the single source of truth for all spreadsheet content. Cha | Prop | Type | Description | |------|------|-------------| -| `sheets` | [`SheetData[]`](/react/types#sheetdata) | The single source of truth for all spreadsheet data. Each entry represents a sheet with its cells, structure, and metadata. Changes are applied incrementally. | +| `sheets` | [`SheetData[]`](react/types.md#sheetdata) | The single source of truth for all spreadsheet data. Each entry represents a sheet with its cells, structure, and metadata. Changes are applied incrementally. | | `styles` | `Record>` | Shared CSS style definitions referenced by `CellData.css`. Keys are class names, values are CSS property maps. See [Styles example](#styles-example). | | `activeSheet` | `Id` | Id of the active (visible) sheet. Changing this switches the displayed sheet tab. | @@ -62,7 +62,7 @@ Controls the search bar state from outside the component. Use it together with ` | Prop | Type | Description | |------|------|-------------| -| `search` | [`SearchConfig`](/react/types#searchconfig) | Controlled search state. Pass a `SearchConfig` object to trigger/update search. Pass `undefined` to dismiss the search bar. | +| `search` | [`SearchConfig`](react/types.md#searchconfig) | Controlled search state. Pass a `SearchConfig` object to trigger/update search. Pass `undefined` to dismiss the search bar. | ## Data loading props @@ -79,7 +79,7 @@ Controls the visual theme applied to the spreadsheet. Since `theme` is a runtime | Prop | Type | Description | |------|------|-------------| -| `theme` | [`SpreadsheetTheme`](/react/types#spreadsheettheme) | Color theme. Built-in values: `"light"`, `"dark"`, `"contrast-light"`, `"contrast-dark"`. Also accepts custom theme name strings. See [Themes](/react/themes/). | +| `theme` | [`SpreadsheetTheme`](react/types.md#spreadsheettheme) | Color theme. Built-in values: `"light"`, `"dark"`, `"contrast-light"`, `"contrast-dark"`. Also accepts custom theme name strings. See [Themes](react/themes.md). | ## Container props diff --git a/docs/react/quick-start.md b/docs/react/quick-start.md index 9eaf99ec..8ff50ff9 100644 --- a/docs/react/quick-start.md +++ b/docs/react/quick-start.md @@ -21,7 +21,7 @@ cd my-spreadsheet-app npm install @dhtmlx/trial-react-spreadsheet ~~~ -For other package variants, see [Installation](/react/installation/). +For other package variants, see [Installation](react/installation.md). ## Create demo data @@ -99,9 +99,9 @@ Open the URL shown in your terminal (typically `http://localhost:5173`) to see t ## Related API and guides -- [Props reference](/react/props/) - configure the spreadsheet behavior -- [Events reference](/react/events/) - respond to user actions -- [Types reference](/react/types/) - TypeScript interfaces and enums -- [Data & state management](/react/state/) - manage spreadsheet data in application state +- [Props reference](react/props.md) - configure the spreadsheet behavior +- [Events reference](react/events.md) - respond to user actions +- [Types reference](react/types.md) - TypeScript interfaces and enums +- [Data & state management](react/state.md) - manage spreadsheet data in application state You can also explore the [GitHub demo repository](https://github.com/DHTMLX/react-spreadsheet-examples) for a complete working example. diff --git a/docs/react/state/index.md b/docs/react/state/index.md index aa1bc9d0..6d0b4faf 100644 --- a/docs/react/state/index.md +++ b/docs/react/state/index.md @@ -10,12 +10,12 @@ This section covers patterns for managing spreadsheet data in sync with your app ## Start here -- [State management basics](/react/state/state-management-basics/) - core patterns: controlled props, event callbacks, the ref escape hatch, and performance tips +- [State management basics](react/state/state-management-basics.md) - core patterns: controlled props, event callbacks, the ref escape hatch, and performance tips ## State library guides -- [Redux Toolkit](/react/state/redux-toolkit/) - step-by-step integration with Redux Toolkit +- [Redux Toolkit](react/state/redux-toolkit.md) - step-by-step integration with Redux Toolkit ## Key concept -The `sheets` prop is the **single source of truth** for all spreadsheet data. Pass an array of [`SheetData`](/react/types#sheetdata) objects, and the wrapper diffs your data against the current widget state, applying only the changes. Use immutable updates (spread operators, functional `setState` updaters) so React can detect changes efficiently. +The `sheets` prop is the **single source of truth** for all spreadsheet data. Pass an array of [`SheetData`](react/types.md#sheetdata) objects, and the wrapper diffs your data against the current widget state, applying only the changes. Use immutable updates (spread operators, functional `setState` updaters) so React can detect changes efficiently. diff --git a/docs/react/state/redux-toolkit.md b/docs/react/state/redux-toolkit.md index 3ccbc245..72741ef5 100644 --- a/docs/react/state/redux-toolkit.md +++ b/docs/react/state/redux-toolkit.md @@ -11,7 +11,7 @@ This tutorial shows how to manage spreadsheet data in a Redux Toolkit store. ## Prerequisites - Familiarity with React, TypeScript, and [Redux Toolkit](https://redux-toolkit.js.org/) basics -- Completed the [State management basics](/react/state/state-management-basics/) guide +- Completed the [State management basics](react/state/state-management-basics.md) guide ## Setup @@ -178,6 +178,6 @@ const getCellValue = (cell: string) => { ## Related API and guides -- [Props reference](/react/props/) - all component props -- [Events reference](/react/events/) - event callback props -- [State management basics](/react/state/state-management-basics/) - core patterns +- [Props reference](react/props.md) - all component props +- [Events reference](react/events.md) - event callback props +- [State management basics](react/state/state-management-basics.md) - core patterns diff --git a/docs/react/state/state-management-basics.md b/docs/react/state/state-management-basics.md index 6f29d752..f9528c59 100644 --- a/docs/react/state/state-management-basics.md +++ b/docs/react/state/state-management-basics.md @@ -84,7 +84,7 @@ function App() { ## The ref escape hatch -For operations that don't map to declarative props, use the [`SpreadsheetRef`](/react/types#spreadsheetref) to access the underlying widget instance: +For operations that don't map to declarative props, use the [`SpreadsheetRef`](react/types.md#spreadsheetref) to access the underlying widget instance: - **Serialize data:** `ref.current?.instance?.serialize()` - **Undo/redo:** `ref.current?.instance?.undo()` / `ref.current?.instance?.redo()` diff --git a/docs/react/themes.md b/docs/react/themes.md index e4e27b70..7091fb48 100644 --- a/docs/react/themes.md +++ b/docs/react/themes.md @@ -10,7 +10,7 @@ React Spreadsheet ships with four built-in themes and supports custom themes thr ## Built-in themes -The [`SpreadsheetTheme`](/react/types#spreadsheettheme) type defines four built-in themes: +The [`SpreadsheetTheme`](react/types.md#spreadsheettheme) type defines four built-in themes: - `"light"` (default) - `"dark"` @@ -89,5 +89,5 @@ import "./custom-theme.css"; ## Related guides - [Themes](/themes/) - built-in theme overview for DHTMLX Spreadsheet -- [Base themes configuration](/themes/base_themes_configuration/) - configuring base themes -- [Custom theme](/themes/custom_theme/) - creating custom themes +- [Base themes configuration](themes/base_themes_configuration.md) - configuring base themes +- [Custom theme](themes/custom_theme.md) - creating custom themes diff --git a/docs/react/types.md b/docs/react/types.md index ee998265..2f98706e 100644 --- a/docs/react/types.md +++ b/docs/react/types.md @@ -150,7 +150,7 @@ Built-in color themes. Also accepts custom theme name strings. ## IExecuteConfig -Action execution configuration passed to [`onBeforeAction`](/react/events/#action-events) / [`onAfterAction`](/react/events/#action-events). Shape varies by action type. +Action execution configuration passed to [`onBeforeAction`](react/events.md#action-events) / [`onAfterAction`](react/events.md#action-events). Shape varies by action type. | Property | Type | Description | |----------|------|-------------| @@ -192,7 +192,7 @@ ref.current?.instance?.redo(); ## Actions enum -Known spreadsheet action identifiers. Used in [`onBeforeAction`](/react/events/#action-events) / [`onAfterAction`](/react/events/#action-events) for type-safe action matching. The `| string` union on handler params allows forward-compatibility with future actions. +Known spreadsheet action identifiers. Used in [`onBeforeAction`](react/events.md#action-events) / [`onAfterAction`](react/events.md#action-events) for type-safe action matching. The `| string` union on handler params allows forward-compatibility with future actions. | Value | Description | |-------|-------------| diff --git a/docs/svelte_integration.md b/docs/svelte_integration.md index 41a2a8f3..df32e52b 100644 --- a/docs/svelte_integration.md +++ b/docs/svelte_integration.md @@ -58,7 +58,7 @@ Now you should get the DHTMLX Spreadsheet source code. First of all, stop the ap ### Step 1. Package installation -Download the [**trial Spreadsheet package**](/how_to_start/#installing-spreadsheet-via-npm-or-yarn) and follow steps mentioned in the README file. Note that trial Spreadsheet is available 30 days only. +Download the [**trial Spreadsheet package**](how_to_start.md#installing-spreadsheet-via-npm-or-yarn) and follow steps mentioned in the README file. Note that trial Spreadsheet is available 30 days only. ### Step 2. Component creation @@ -196,7 +196,7 @@ Then open the ***App.svelte*** file, import data, and pass it into the new creat ~~~ -Go to the ***Spreadsheet.svelte*** file and apply the passed **props** to the Spreadsheet via the [`parse()`](/api/spreadsheet_parse_method/) method: +Go to the ***Spreadsheet.svelte*** file and apply the passed **props** to the Spreadsheet via the [`parse()`](api/spreadsheet_parse_method.md) method: ~~~html {6,13} title="Spreadsheet.svelte"