asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: add documentation for DataTable (#11095)

Browse Source 
* docs: add documentation for DataTable

* update package versions
This commit is contained in:
Shahed Nasser
2025-01-27 11:04:46 +02:00
committed by GitHub
parent 956a50e934
commit c8fc5edadd
55 changed files with 3453 additions and 1549 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
www/apps/ui/src/specs/DataTable/DataTable.ActionCell.json Normal file
View File

@@ -0,0 +1,23 @@
{
"description": "",
"methods": [],
"displayName": "DataTable.ActionCell",
"props": {
"ctx": {
"required": true,
"tsType": {
"name": "CellContext",
"elements": [
{
"name": "TData"
},
{
"name": "unknown"
}
],
"raw": "CellContext<TData, unknown>"
},
"description": ""
}
}
}

23
www/apps/ui/src/specs/DataTable/DataTable.CommandBar.json Normal file
View File

@@ -0,0 +1,23 @@
{
"description": "This component adds a command bar to the data table, which is used\nto show commands that can be executed on the selected rows.",
"methods": [],
"displayName": "DataTable.CommandBar",
"props": {
"selectedLabel": {
"required": false,
"tsType": {
"name": "union",
"raw": "((count: number) => string) | string",
"elements": [
{
"name": "unknown"
},
{
"name": "string"
}
]
},
"description": "The label to show when items are selected. If a function is passed, \nit will be called with the count of selected items."
}
}
}

21
www/apps/ui/src/specs/DataTable/DataTable.Filter.json Normal file
View File

@@ -0,0 +1,21 @@
{
"description": "",
"methods": [],
"displayName": "DataTable.Filter",
"props": {
"id": {
"required": true,
"tsType": {
"name": "string"
},
"description": ""
},
"filter": {
"required": true,
"tsType": {
"name": "unknown"
},
"description": ""
}
}
}

18
www/apps/ui/src/specs/DataTable/DataTable.FilterBar.json Normal file
View File

@@ -0,0 +1,18 @@
{
"description": "",
"methods": [],
"displayName": "DataTable.FilterBar",
"props": {
"clearAllFiltersLabel": {
"required": false,
"tsType": {
"name": "string"
},
"description": "",
"defaultValue": {
"value": "\"Clear all\"",
"computed": false
}
}
}
}

14
www/apps/ui/src/specs/DataTable/DataTable.FilterMenu.json Normal file
View File

@@ -0,0 +1,14 @@
{
"description": "This component adds a filter menu to the data table, allowing users\nto filter the table's data.",
"methods": [],
"displayName": "DataTable.FilterMenu",
"props": {
"tooltip": {
"required": false,
"tsType": {
"name": "string"
},
"description": "The tooltip to show when hovering over the filter menu."
}
}
}

15
www/apps/ui/src/specs/DataTable/DataTable.Pagination.json Normal file
View File

@@ -0,0 +1,15 @@
{
"description": "This component adds a pagination component and functionality to the data table.",
"methods": [],
"displayName": "DataTable.Pagination",
"props": {
"translations": {
"required": false,
"tsType": {
"name": "ReactComponentProps[\"translations\"]",
"raw": "React.ComponentProps<typeof Table.Pagination>[\"translations\"]"
},
"description": "The translations for strings in the pagination component."
}
}
}

28
www/apps/ui/src/specs/DataTable/DataTable.Search.json Normal file
View File

@@ -0,0 +1,28 @@
{
"description": "This component adds a search input to the data table, allowing users\nto search through the table's data.",
"methods": [],
"displayName": "DataTable.Search",
"props": {
"autoFocus": {
"required": false,
"tsType": {
"name": "boolean"
},
"description": "If true, the search input will be focused on mount."
},
"className": {
"required": false,
"tsType": {
"name": "string"
},
"description": "Additional classes to pass to the search input."
},
"placeholder": {
"required": false,
"tsType": {
"name": "string"
},
"description": "The placeholder text to show in the search input."
}
}
}

23
www/apps/ui/src/specs/DataTable/DataTable.SelectCell.json Normal file
View File

@@ -0,0 +1,23 @@
{
"description": "",
"methods": [],
"displayName": "DataTable.SelectCell",
"props": {
"ctx": {
"required": true,
"tsType": {
"name": "DataTableCellContext",
"elements": [
{
"name": "TData"
},
{
"name": "unknown"
}
],
"raw": "DataTableCellContext<TData, unknown>"
},
"description": ""
}
}
}

24
www/apps/ui/src/specs/DataTable/DataTable.SortingIcon.json Normal file
View File

@@ -0,0 +1,24 @@
{
"description": "",
"methods": [],
"displayName": "DataTable.SortingIcon",
"props": {
"direction": {
"required": true,
"tsType": {
"name": "union",
"raw": "DataTableSortDirection | false",
"elements": [
{
"name": "DataTableSortDirection"
},
{
"name": "literal",
"value": "false"
}
]
},
"description": ""
}
}
}

14
www/apps/ui/src/specs/DataTable/DataTable.SortingMenu.json Normal file
View File

@@ -0,0 +1,14 @@
{
"description": "This component adds a sorting menu to the data table, allowing users\nto sort the table's data.",
"methods": [],
"displayName": "DataTable.SortingMenu",
"props": {
"tooltip": {
"required": false,
"tsType": {
"name": "string"
},
"description": "The tooltip to show when hovering over the sorting menu."
}
}
}

98
www/apps/ui/src/specs/DataTable/DataTable.Table.json Normal file
View File

@@ -0,0 +1,98 @@
{
"description": "This component renders the table in a data table, supporting advanced features.\nIt's useful to create tables similar to those in the Medusa Admin dashboard.",
"methods": [],
"displayName": "DataTable.Table",
"props": {
"emptyState": {
"required": false,
"tsType": {
"name": "signature",
"type": "object",
"raw": "{\n /**\n * The empty state to display when the table is filtered, but no rows are found.\n */\n filtered?: DataTableEmptyStateContent\n /**\n * The empty state to display when the table is empty.\n */\n empty?: DataTableEmptyStateContent\n}",
"signature": {
"properties": [
{
"key": "filtered",
"value": {
"name": "signature",
"type": "object",
"raw": "{\n /**\n * The heading to display in the empty state.\n */\n heading?: string\n /**\n * The description to display in the empty state.\n */\n description?: string\n /**\n * A custom component to display in the empty state, if provided it will override the heading and description.\n */\n custom?: React.ReactNode\n}",
"signature": {
"properties": [
{
"key": "heading",
"value": {
"name": "string",
"required": false
},
"description": "The heading to display in the empty state."
},
{
"key": "description",
"value": {
"name": "string",
"required": false
},
"description": "The description to display in the empty state."
},
{
"key": "custom",
"value": {
"name": "ReactReactNode",
"raw": "React.ReactNode",
"required": false
},
"description": "A custom component to display in the empty state, if provided it will override the heading and description."
}
]
},
"required": false
},
"description": "The empty state to display when the table is filtered, but no rows are found."
},
{
"key": "empty",
"value": {
"name": "signature",
"type": "object",
"raw": "{\n /**\n * The heading to display in the empty state.\n */\n heading?: string\n /**\n * The description to display in the empty state.\n */\n description?: string\n /**\n * A custom component to display in the empty state, if provided it will override the heading and description.\n */\n custom?: React.ReactNode\n}",
"signature": {
"properties": [
{
"key": "heading",
"value": {
"name": "string",
"required": false
},
"description": "The heading to display in the empty state."
},
{
"key": "description",
"value": {
"name": "string",
"required": false
},
"description": "The description to display in the empty state."
},
{
"key": "custom",
"value": {
"name": "ReactReactNode",
"raw": "React.ReactNode",
"required": false
},
"description": "A custom component to display in the empty state, if provided it will override the heading and description."
}
]
},
"required": false
},
"description": "The empty state to display when the table is empty."
}
]
}
},
"description": "The empty state to display when the table is empty."
}
}
}

35
www/apps/ui/src/specs/DataTable/DataTable.json Normal file
View File

@@ -0,0 +1,35 @@
{
"description": "This component creates a data table with filters, pagination, sorting, and more.\nIt's built on top of the `Table` component while expanding its functionality.",
"methods": [],
"displayName": "DataTable",
"props": {
"instance": {
"required": true,
"tsType": {
"name": "UseDataTableReturn",
"elements": [
{
"name": "TData"
}
],
"raw": "UseDataTableReturn<TData>"
},
"description": "The instance returned by the `useDataTable` hook."
},
"children": {
"required": false,
"tsType": {
"name": "ReactReactNode",
"raw": "React.ReactNode"
},
"description": "The children of the component."
},
"className": {
"required": false,
"tsType": {
"name": "string"
},
"description": "Additional classes to pass to the wrapper `div` of the component."
}
}
}