From f0034f67077098de4c45d97961945d8a0ab1d7d0 Mon Sep 17 00:00:00 2001 From: Kenan Yusuf Date: Fri, 8 Nov 2024 14:49:01 +0000 Subject: [PATCH] transpile existing .ts files in demos --- docs/data/charts/bars/netflixsBalanceSheet.js | 82 +++ docs/data/charts/dataset/weather.js | 90 +++ docs/data/charts/heatmap/dumbData.js | 22 + docs/data/charts/legend/tempAnomaly.js | 177 ++++++ docs/data/charts/lines/GDPperCapita.js | 31 ++ docs/data/charts/lines/basicDataset.js | 8 + .../lines/worldElectricityProduction.js | 520 ++++++++++++++++++ docs/data/charts/pie/webUsageStats.js | 70 +++ .../charts/zoom-and-pan/letterFrequency.js | 37 ++ docs/data/chartsApiPages.js | 223 ++++++++ .../data-grid/export/excelExportWorker.js | 4 + docs/data/data-grid/list-view/constants.js | 15 + docs/data/data-grid/list-view/data.js | 202 +++++++ docs/data/data-grid/list-view/utils.js | 56 ++ docs/data/dataGridApiPages.js | 30 + docs/data/datePickersApiPages.js | 235 ++++++++ docs/data/pickersAdapterOverride.js | 4 + docs/data/tree-view/datasets/employees.js | 38 ++ .../editing/editableProducts.js | 32 ++ .../rich-tree-view/editing/employees.js | 28 + .../rich-tree-view/editing/products.js | 32 ++ .../tree-item-customization/products.js | 34 ++ docs/data/treeViewApiPages.js | 29 + 23 files changed, 1999 insertions(+) create mode 100644 docs/data/charts/bars/netflixsBalanceSheet.js create mode 100644 docs/data/charts/dataset/weather.js create mode 100644 docs/data/charts/heatmap/dumbData.js create mode 100644 docs/data/charts/legend/tempAnomaly.js create mode 100644 docs/data/charts/lines/GDPperCapita.js create mode 100644 docs/data/charts/lines/basicDataset.js create mode 100644 docs/data/charts/lines/worldElectricityProduction.js create mode 100644 docs/data/charts/pie/webUsageStats.js create mode 100644 docs/data/charts/zoom-and-pan/letterFrequency.js create mode 100644 docs/data/chartsApiPages.js create mode 100644 docs/data/data-grid/export/excelExportWorker.js create mode 100644 docs/data/data-grid/list-view/constants.js create mode 100644 docs/data/data-grid/list-view/data.js create mode 100644 docs/data/data-grid/list-view/utils.js create mode 100644 docs/data/dataGridApiPages.js create mode 100644 docs/data/datePickersApiPages.js create mode 100644 docs/data/pickersAdapterOverride.js create mode 100644 docs/data/tree-view/datasets/employees.js create mode 100644 docs/data/tree-view/rich-tree-view/editing/editableProducts.js create mode 100644 docs/data/tree-view/rich-tree-view/editing/employees.js create mode 100644 docs/data/tree-view/rich-tree-view/editing/products.js create mode 100644 docs/data/tree-view/tree-item-customization/products.js create mode 100644 docs/data/treeViewApiPages.js diff --git a/docs/data/charts/bars/netflixsBalanceSheet.js b/docs/data/charts/bars/netflixsBalanceSheet.js new file mode 100644 index 0000000000000..753f3e013532c --- /dev/null +++ b/docs/data/charts/bars/netflixsBalanceSheet.js @@ -0,0 +1,82 @@ +// Data from https://finance.yahoo.com/quote/NFLX/financials/ + +const translations = { + totAss: 'Total Assets', + currAss: 'Current Assets', + nCurrAss: 'non-Current Assets', + totLia: 'Total Liabilities', + curLia: 'Current Liabilities', + nCurLia: 'non-Current Liabilities', + totEq: 'Total Equity', + capStock: 'Capital Stock', + retEarn: 'Retained Earning', + treas: 'Treasury', + nonAffect: 'non Affected', +}; + +export function addLabels(series) { + return series.map((item) => ({ + ...item, + label: translations[item.dataKey], + valueFormatter: (v) => (v ? `$ ${v.toLocaleString()}k` : '-'), + })); +} + +export const balanceSheet = [ + { + year: '2020', + totAss: 39280359, + currAss: 9761580, + nCurrAss: 29518779, + totLia: 28215119, + curLia: 7805785, + nCurLia: 20409334, + totEq: 11065240, + capStock: 3447698, + retEarn: 7573144, + treas: null, + nonAffect: 44398, + }, + { + year: '2021', + totAss: 44584663, + currAss: 8069825, + nCurrAss: 36514838, + totLia: 28735415, + curLia: 8488966, + nCurLia: 20246449, + totEq: 15849248, + capStock: 4024561, + retEarn: 12689372, + treas: 824190, + nonAffect: -40495, + }, + { + year: '2022', + totAss: 48594768, + currAss: 9266473, + nCurrAss: 39328295, + totLia: 27817367, + curLia: 7930974, + nCurLia: 19886393, + totEq: 20777401, + capStock: 4637601, + retEarn: 17181296, + treas: 824190, + nonAffect: -217306, + }, + { + year: '2023', + totAss: 48731992, + currAss: 9918133, + nCurrAss: 38813859, + totLia: 28143679, + curLia: 8860655, + nCurLia: 19283024, + totEq: 20588313, + capStock: 5145172, + retEarn: 22589286, + treas: 6922200, + nonAffect: -223945, + }, +]; diff --git a/docs/data/charts/dataset/weather.js b/docs/data/charts/dataset/weather.js new file mode 100644 index 0000000000000..9eb2105690f83 --- /dev/null +++ b/docs/data/charts/dataset/weather.js @@ -0,0 +1,90 @@ +export const dataset = [ + { + london: 59, + paris: 57, + newYork: 86, + seoul: 21, + month: 'Jan', + }, + { + london: 50, + paris: 52, + newYork: 78, + seoul: 28, + month: 'Feb', + }, + { + london: 47, + paris: 53, + newYork: 106, + seoul: 41, + month: 'Mar', + }, + { + london: 54, + paris: 56, + newYork: 92, + seoul: 73, + month: 'Apr', + }, + { + london: 57, + paris: 69, + newYork: 92, + seoul: 99, + month: 'May', + }, + { + london: 60, + paris: 63, + newYork: 103, + seoul: 144, + month: 'June', + }, + { + london: 59, + paris: 60, + newYork: 105, + seoul: 319, + month: 'July', + }, + { + london: 65, + paris: 60, + newYork: 106, + seoul: 249, + month: 'Aug', + }, + { + london: 51, + paris: 51, + newYork: 95, + seoul: 131, + month: 'Sept', + }, + { + london: 60, + paris: 65, + newYork: 97, + seoul: 55, + month: 'Oct', + }, + { + london: 67, + paris: 64, + newYork: 76, + seoul: 48, + month: 'Nov', + }, + { + london: 61, + paris: 70, + newYork: 103, + seoul: 25, + month: 'Dec', + }, +]; + +export function valueFormatter(value) { + return `${value}mm`; +} diff --git a/docs/data/charts/heatmap/dumbData.js b/docs/data/charts/heatmap/dumbData.js new file mode 100644 index 0000000000000..7af927d58c60b --- /dev/null +++ b/docs/data/charts/heatmap/dumbData.js @@ -0,0 +1,22 @@ +export const data = [ + [0, 0, 10], + [0, 1, 20], + [0, 2, 40], + [0, 3, 90], + [0, 4, 70], + [1, 0, 30], + [1, 1, 50], + [1, 2, 10], + [1, 3, 70], + [1, 4, 40], + [2, 0, 50], + [2, 1, 20], + [2, 2, 90], + [2, 3, 20], + [2, 4, 70], + [3, 0, 40], + [3, 1, 50], + [3, 2, 20], + [3, 3, 70], + [3, 4, 90], +]; diff --git a/docs/data/charts/legend/tempAnomaly.js b/docs/data/charts/legend/tempAnomaly.js new file mode 100644 index 0000000000000..fe651b02323fa --- /dev/null +++ b/docs/data/charts/legend/tempAnomaly.js @@ -0,0 +1,177 @@ +export const dataset = [ + { year: new Date(1850, 0, 1), anomaly: -0.4177114 }, + { year: new Date(1851, 0, 1), anomaly: -0.2333498 }, + { year: new Date(1852, 0, 1), anomaly: -0.22939907 }, + { year: new Date(1853, 0, 1), anomaly: -0.27035445 }, + { year: new Date(1854, 0, 1), anomaly: -0.29152083 }, + { year: new Date(1855, 0, 1), anomaly: -0.29691675 }, + { year: new Date(1856, 0, 1), anomaly: -0.32035372 }, + { year: new Date(1857, 0, 1), anomaly: -0.46723005 }, + { year: new Date(1858, 0, 1), anomaly: -0.3887657 }, + { year: new Date(1859, 0, 1), anomaly: -0.28126517 }, + { year: new Date(1860, 0, 1), anomaly: -0.39016518 }, + { year: new Date(1861, 0, 1), anomaly: -0.42911294 }, + { year: new Date(1862, 0, 1), anomaly: -0.5363694 }, + { year: new Date(1863, 0, 1), anomaly: -0.34424406 }, + { year: new Date(1864, 0, 1), anomaly: -0.46546507 }, + { year: new Date(1865, 0, 1), anomaly: -0.33248132 }, + { year: new Date(1866, 0, 1), anomaly: -0.3412875 }, + { year: new Date(1867, 0, 1), anomaly: -0.35699412 }, + { year: new Date(1868, 0, 1), anomaly: -0.35182714 }, + { year: new Date(1869, 0, 1), anomaly: -0.31659195 }, + { year: new Date(1870, 0, 1), anomaly: -0.32792753 }, + { year: new Date(1871, 0, 1), anomaly: -0.36856276 }, + { year: new Date(1872, 0, 1), anomaly: -0.32811058 }, + { year: new Date(1873, 0, 1), anomaly: -0.3412969 }, + { year: new Date(1874, 0, 1), anomaly: -0.3732512 }, + { year: new Date(1875, 0, 1), anomaly: -0.37562594 }, + { year: new Date(1876, 0, 1), anomaly: -0.4241099 }, + { year: new Date(1877, 0, 1), anomaly: -0.10110884 }, + { year: new Date(1878, 0, 1), anomaly: -0.011315192 }, + { year: new Date(1879, 0, 1), anomaly: -0.30363432 }, + { year: new Date(1880, 0, 1), anomaly: -0.31583205 }, + { year: new Date(1881, 0, 1), anomaly: -0.23224552 }, + { year: new Date(1882, 0, 1), anomaly: -0.29553008 }, + { year: new Date(1883, 0, 1), anomaly: -0.3464744 }, + { year: new Date(1884, 0, 1), anomaly: -0.49232006 }, + { year: new Date(1885, 0, 1), anomaly: -0.47112358 }, + { year: new Date(1886, 0, 1), anomaly: -0.42090362 }, + { year: new Date(1887, 0, 1), anomaly: -0.49878576 }, + { year: new Date(1888, 0, 1), anomaly: -0.37937889 }, + { year: new Date(1889, 0, 1), anomaly: -0.24989556 }, + { year: new Date(1890, 0, 1), anomaly: -0.50685817 }, + { year: new Date(1891, 0, 1), anomaly: -0.40131494 }, + { year: new Date(1892, 0, 1), anomaly: -0.5075585 }, + { year: new Date(1893, 0, 1), anomaly: -0.49461922 }, + { year: new Date(1894, 0, 1), anomaly: -0.48376393 }, + { year: new Date(1895, 0, 1), anomaly: -0.4487516 }, + { year: new Date(1896, 0, 1), anomaly: -0.28400728 }, + { year: new Date(1897, 0, 1), anomaly: -0.25980017 }, + { year: new Date(1898, 0, 1), anomaly: -0.48579213 }, + { year: new Date(1899, 0, 1), anomaly: -0.35543364 }, + { year: new Date(1900, 0, 1), anomaly: -0.2344939 }, + { year: new Date(1901, 0, 1), anomaly: -0.29341024 }, + { year: new Date(1902, 0, 1), anomaly: -0.43895653 }, + { year: new Date(1903, 0, 1), anomaly: -0.5332871 }, + { year: new Date(1904, 0, 1), anomaly: -0.59751105 }, + { year: new Date(1905, 0, 1), anomaly: -0.40779322 }, + { year: new Date(1906, 0, 1), anomaly: -0.31910878 }, + { year: new Date(1907, 0, 1), anomaly: -0.5040763 }, + { year: new Date(1908, 0, 1), anomaly: -0.5138197 }, + { year: new Date(1909, 0, 1), anomaly: -0.53568715 }, + { year: new Date(1910, 0, 1), anomaly: -0.5309095 }, + { year: new Date(1911, 0, 1), anomaly: -0.539079 }, + { year: new Date(1912, 0, 1), anomaly: -0.47553864 }, + { year: new Date(1913, 0, 1), anomaly: -0.4670111 }, + { year: new Date(1914, 0, 1), anomaly: -0.26243657 }, + { year: new Date(1915, 0, 1), anomaly: -0.19167219 }, + { year: new Date(1916, 0, 1), anomaly: -0.42002314 }, + { year: new Date(1917, 0, 1), anomaly: -0.5428197 }, + { year: new Date(1918, 0, 1), anomaly: -0.4243641 }, + { year: new Date(1919, 0, 1), anomaly: -0.32528907 }, + { year: new Date(1920, 0, 1), anomaly: -0.29835507 }, + { year: new Date(1921, 0, 1), anomaly: -0.24044435 }, + { year: new Date(1922, 0, 1), anomaly: -0.3390137 }, + { year: new Date(1923, 0, 1), anomaly: -0.31768188 }, + { year: new Date(1924, 0, 1), anomaly: -0.3118017 }, + { year: new Date(1925, 0, 1), anomaly: -0.28214198 }, + { year: new Date(1926, 0, 1), anomaly: -0.122555 }, + { year: new Date(1927, 0, 1), anomaly: -0.2291136 }, + { year: new Date(1928, 0, 1), anomaly: -0.20646581 }, + { year: new Date(1929, 0, 1), anomaly: -0.39244303 }, + { year: new Date(1930, 0, 1), anomaly: -0.17680542 }, + { year: new Date(1931, 0, 1), anomaly: -0.103397675 }, + { year: new Date(1932, 0, 1), anomaly: -0.14546171 }, + { year: new Date(1933, 0, 1), anomaly: -0.32234442 }, + { year: new Date(1934, 0, 1), anomaly: -0.17433685 }, + { year: new Date(1935, 0, 1), anomaly: -0.20605923 }, + { year: new Date(1936, 0, 1), anomaly: -0.16952094 }, + { year: new Date(1937, 0, 1), anomaly: -0.019198947 }, + { year: new Date(1938, 0, 1), anomaly: -0.012200737 }, + { year: new Date(1939, 0, 1), anomaly: -0.040797204 }, + { year: new Date(1940, 0, 1), anomaly: 0.07593582 }, + { year: new Date(1941, 0, 1), anomaly: 0.0381293 }, + { year: new Date(1942, 0, 1), anomaly: 0.0014060677 }, + { year: new Date(1943, 0, 1), anomaly: 0.0064215823 }, + { year: new Date(1944, 0, 1), anomaly: 0.14410514 }, + { year: new Date(1945, 0, 1), anomaly: 0.043088354 }, + { year: new Date(1946, 0, 1), anomaly: -0.11881461 }, + { year: new Date(1947, 0, 1), anomaly: -0.09120561 }, + { year: new Date(1948, 0, 1), anomaly: -0.12466127 }, + { year: new Date(1949, 0, 1), anomaly: -0.14380223 }, + { year: new Date(1950, 0, 1), anomaly: -0.2266218 }, + { year: new Date(1951, 0, 1), anomaly: -0.06115396 }, + { year: new Date(1952, 0, 1), anomaly: 0.015354548 }, + { year: new Date(1953, 0, 1), anomaly: 0.07763075 }, + { year: new Date(1954, 0, 1), anomaly: -0.11675023 }, + { year: new Date(1955, 0, 1), anomaly: -0.19730994 }, + { year: new Date(1956, 0, 1), anomaly: -0.26316562 }, + { year: new Date(1957, 0, 1), anomaly: -0.035334915 }, + { year: new Date(1958, 0, 1), anomaly: -0.017632563 }, + { year: new Date(1959, 0, 1), anomaly: -0.048004813 }, + { year: new Date(1960, 0, 1), anomaly: -0.11545958 }, + { year: new Date(1961, 0, 1), anomaly: -0.019999769 }, + { year: new Date(1962, 0, 1), anomaly: -0.06404272 }, + { year: new Date(1963, 0, 1), anomaly: -0.036810614 }, + { year: new Date(1964, 0, 1), anomaly: -0.30586153 }, + { year: new Date(1965, 0, 1), anomaly: -0.20442048 }, + { year: new Date(1966, 0, 1), anomaly: -0.1488976 }, + { year: new Date(1967, 0, 1), anomaly: -0.117539294 }, + { year: new Date(1968, 0, 1), anomaly: -0.16864756 }, + { year: new Date(1969, 0, 1), anomaly: -0.03138624 }, + { year: new Date(1970, 0, 1), anomaly: -0.08506408 }, + { year: new Date(1971, 0, 1), anomaly: -0.20588905 }, + { year: new Date(1972, 0, 1), anomaly: -0.09379131 }, + { year: new Date(1973, 0, 1), anomaly: 0.04995016 }, + { year: new Date(1974, 0, 1), anomaly: -0.17252657 }, + { year: new Date(1975, 0, 1), anomaly: -0.110754214 }, + { year: new Date(1976, 0, 1), anomaly: -0.2158369 }, + { year: new Date(1977, 0, 1), anomaly: 0.1030885 }, + { year: new Date(1978, 0, 1), anomaly: 0.0052559716 }, + { year: new Date(1979, 0, 1), anomaly: 0.09085814 }, + { year: new Date(1980, 0, 1), anomaly: 0.19607204 }, + { year: new Date(1981, 0, 1), anomaly: 0.25001204 }, + { year: new Date(1982, 0, 1), anomaly: 0.034268282 }, + { year: new Date(1983, 0, 1), anomaly: 0.22380984 }, + { year: new Date(1984, 0, 1), anomaly: 0.04799352 }, + { year: new Date(1985, 0, 1), anomaly: 0.049729742 }, + { year: new Date(1986, 0, 1), anomaly: 0.09568698 }, + { year: new Date(1987, 0, 1), anomaly: 0.2430264 }, + { year: new Date(1988, 0, 1), anomaly: 0.2821517 }, + { year: new Date(1989, 0, 1), anomaly: 0.1792503 }, + { year: new Date(1990, 0, 1), anomaly: 0.36058238 }, + { year: new Date(1991, 0, 1), anomaly: 0.33889654 }, + { year: new Date(1992, 0, 1), anomaly: 0.12489683 }, + { year: new Date(1993, 0, 1), anomaly: 0.16570719 }, + { year: new Date(1994, 0, 1), anomaly: 0.23354979 }, + { year: new Date(1995, 0, 1), anomaly: 0.37686613 }, + { year: new Date(1996, 0, 1), anomaly: 0.27668938 }, + { year: new Date(1997, 0, 1), anomaly: 0.4223085 }, + { year: new Date(1998, 0, 1), anomaly: 0.5773417 }, + { year: new Date(1999, 0, 1), anomaly: 0.32448497 }, + { year: new Date(2000, 0, 1), anomaly: 0.33108476 }, + { year: new Date(2001, 0, 1), anomaly: 0.48928034 }, + { year: new Date(2002, 0, 1), anomaly: 0.5434665 }, + { year: new Date(2003, 0, 1), anomaly: 0.54417014 }, + { year: new Date(2004, 0, 1), anomaly: 0.46737072 }, + { year: new Date(2005, 0, 1), anomaly: 0.6068625 }, + { year: new Date(2006, 0, 1), anomaly: 0.5725527 }, + { year: new Date(2007, 0, 1), anomaly: 0.5917013 }, + { year: new Date(2008, 0, 1), anomaly: 0.46564984 }, + { year: new Date(2009, 0, 1), anomaly: 0.5967816 }, + { year: new Date(2010, 0, 1), anomaly: 0.6803714 }, + { year: new Date(2011, 0, 1), anomaly: 0.53769773 }, + { year: new Date(2012, 0, 1), anomaly: 0.57760704 }, + { year: new Date(2013, 0, 1), anomaly: 0.6235753 }, + { year: new Date(2014, 0, 1), anomaly: 0.67287165 }, + { year: new Date(2015, 0, 1), anomaly: 0.8251144 }, + { year: new Date(2016, 0, 1), anomaly: 0.9329271 }, + { year: new Date(2017, 0, 1), anomaly: 0.84517425 }, + { year: new Date(2018, 0, 1), anomaly: 0.76265407 }, + { year: new Date(2019, 0, 1), anomaly: 0.8910726 }, + { year: new Date(2020, 0, 1), anomaly: 0.9229205 }, + { year: new Date(2021, 0, 1), anomaly: 0.76190555 }, + { year: new Date(2022, 0, 1), anomaly: 0.8013053 }, + { year: new Date(2023, 0, 1), anomaly: 1.1003127 }, + { year: new Date(2024, 0, 1), anomaly: 1.2314565 }, +]; diff --git a/docs/data/charts/lines/GDPperCapita.js b/docs/data/charts/lines/GDPperCapita.js new file mode 100644 index 0000000000000..eb5babd81d4dc --- /dev/null +++ b/docs/data/charts/lines/GDPperCapita.js @@ -0,0 +1,31 @@ +export const dataset = [ + { date: new Date(1990, 0, 1), fr: 28129, gb: 26189, dl: 25391 }, + { date: new Date(1991, 0, 1), fr: 28294.264, gb: 25792.014, dl: 26769.96 }, + { date: new Date(1992, 0, 1), fr: 28619.805, gb: 25790.186, dl: 27385.055 }, + { date: new Date(1993, 0, 1), fr: 28336.16, gb: 26349.342, dl: 27250.701 }, + { date: new Date(1994, 0, 1), fr: 28907.977, gb: 27277.543, dl: 28140.057 }, + { date: new Date(1995, 0, 1), fr: 29418.863, gb: 27861.215, dl: 28868.945 }, + { date: new Date(1996, 0, 1), fr: 29736.645, gb: 28472.248, dl: 29349.982 }, + { date: new Date(1997, 0, 1), fr: 30341.807, gb: 29259.764, dl: 30186.945 }, + { date: new Date(1998, 0, 1), fr: 31323.078, gb: 30077.385, dl: 31129.584 }, + { date: new Date(1999, 0, 1), fr: 32284.611, gb: 30932.537, dl: 32087.604 }, + { date: new Date(2000, 0, 1), fr: 33409.68, gb: 31946.037, dl: 33367.285 }, + { date: new Date(2001, 0, 1), fr: 33920.098, gb: 32660.441, dl: 34260.29 }, + { date: new Date(2002, 0, 1), fr: 34152.773, gb: 33271.3, dl: 34590.93 }, + { date: new Date(2003, 0, 1), fr: 34292.03, gb: 34232.426, dl: 34716.44 }, + { date: new Date(2004, 0, 1), fr: 35093.824, gb: 34865.78, dl: 35528.715 }, + { date: new Date(2005, 0, 1), fr: 35495.465, gb: 35623.625, dl: 36205.574 }, + { date: new Date(2006, 0, 1), fr: 36166.16, gb: 36214.07, dl: 38014.137 }, + { date: new Date(2007, 0, 1), fr: 36845.684, gb: 36816.676, dl: 39752.207 }, + { date: new Date(2008, 0, 1), fr: 36761.793, gb: 36264.79, dl: 40715.434 }, + { date: new Date(2009, 0, 1), fr: 35534.926, gb: 34402.36, dl: 38962.938 }, + { date: new Date(2010, 0, 1), fr: 36086.727, gb: 34754.473, dl: 41109.582 }, + { date: new Date(2011, 0, 1), fr: 36691, gb: 34971, dl: 43189 }, + { date: new Date(2012, 0, 1), fr: 36571, gb: 35185, dl: 43320 }, + { date: new Date(2013, 0, 1), fr: 36632, gb: 35618, dl: 43413 }, + { date: new Date(2014, 0, 1), fr: 36527, gb: 36436, dl: 43922 }, + { date: new Date(2015, 0, 1), fr: 36827, gb: 36941, dl: 44293 }, + { date: new Date(2016, 0, 1), fr: 37124, gb: 37334, dl: 44689 }, + { date: new Date(2017, 0, 1), fr: 37895, gb: 37782.83, dl: 45619.785 }, + { date: new Date(2018, 0, 1), fr: 38515.918, gb: 38058.086, dl: 46177.617 }, +]; diff --git a/docs/data/charts/lines/basicDataset.js b/docs/data/charts/lines/basicDataset.js new file mode 100644 index 0000000000000..ef59c6d6d807e --- /dev/null +++ b/docs/data/charts/lines/basicDataset.js @@ -0,0 +1,8 @@ +export const dataset = [ + { x: 1, y: 2 }, + { x: 2, y: 5.5 }, + { x: 3, y: 2 }, + { x: 5, y: 8.5 }, + { x: 8, y: 1.5 }, + { x: 10, y: 5 }, +]; diff --git a/docs/data/charts/lines/worldElectricityProduction.js b/docs/data/charts/lines/worldElectricityProduction.js new file mode 100644 index 0000000000000..4807f7ef87fff --- /dev/null +++ b/docs/data/charts/lines/worldElectricityProduction.js @@ -0,0 +1,520 @@ +export const keyToLabel = { + coal: 'Electricity from coal (TWh)', + gas: 'Electricity from gas (TWh)', + oil: 'Electricity from oil (TWh)', + nuclear: 'Electricity from nuclear (TWh)', + hydro: 'Electricity from hydro (TWh)', + wind: 'Electricity from wind (TWh)', + solar: 'Electricity from solar (TWh)', + bio: 'Electricity from bioenergy (TWh)', + other: 'Other renewables excluding bioenergy (TWh)', +}; + +export const colors = { + other: 'lightgray', + bio: 'lightgreen', + solar: 'yellow', + wind: 'lightblue', + hydro: 'blue', + nuclear: 'orange', + oil: 'darkgrey', + gas: 'gray', + coal: 'black', +}; + +export const worldElectricityProduction = [ + { + country: 'World', + year: 1985, + other: 0, + bio: 0, + solar: 0.011747475, + wind: 0.064220205, + hydro: 1979.2446, + nuclear: 1488.9216, + oil: 1110.7847, + gas: 1426.3086, + coal: 3748.3848, + }, + { + country: 'World', + year: 1986, + other: 0, + bio: 0, + solar: 0.015183838, + wind: 0.13883132, + hydro: 2006.0651, + nuclear: 1594.7357, + oil: 1168.3097, + gas: 1432.6683, + coal: 3839.0095, + }, + { + country: 'World', + year: 1987, + other: 0, + bio: 0, + solar: 0.01060303, + wind: 0.19537677, + hydro: 2033.1884, + nuclear: 1734.7332, + oil: 1183.1947, + gas: 1516.4941, + coal: 4058.0767, + }, + { + country: 'World', + year: 1988, + other: 0, + bio: 0, + solar: 0.01019596, + wind: 0.3315798, + hydro: 2098.3518, + nuclear: 1891.2493, + oil: 1256.5684, + gas: 1540.9414, + coal: 4200.6743, + }, + { + country: 'World', + year: 1989, + other: 0, + bio: 0, + solar: 0.26222324, + wind: 2.6497767, + hydro: 2087.588, + nuclear: 1945.0106, + oil: 1350.2358, + gas: 1728.5189, + coal: 4376.982, + }, + { + country: 'World', + year: 1990, + other: 0, + bio: 0, + solar: 0.38834995, + wind: 3.6324706, + hydro: 2158.854, + nuclear: 2000.596, + oil: 1364.6844, + gas: 1789.7031, + coal: 4460.2417, + }, + { + country: 'World', + year: 1991, + other: 0, + bio: 0, + solar: 0.5053229, + wind: 4.086107, + hydro: 2208.702, + nuclear: 2096.3098, + oil: 1349.9071, + gas: 1815.2444, + coal: 4557.0664, + }, + { + country: 'World', + year: 1992, + other: 0, + bio: 0, + solar: 0.4666791, + wind: 4.732812, + hydro: 2208.4592, + nuclear: 2112.223, + oil: 1328.2163, + gas: 1829.3868, + coal: 4649.9165, + }, + { + country: 'World', + year: 1993, + other: 0, + bio: 0, + solar: 0.5566775, + wind: 5.704169, + hydro: 2341.4597, + nuclear: 2184.9646, + oil: 1266.6155, + gas: 1863.8153, + coal: 4727.899, + }, + { + country: 'World', + year: 1994, + other: 0, + bio: 0, + solar: 0.5969829, + wind: 7.13173, + hydro: 2356.203, + nuclear: 2225.9788, + oil: 1302.1187, + gas: 1925.1002, + coal: 4891.904, + }, + { + country: 'World', + year: 1995, + other: 0, + bio: 0, + solar: 0.63888276, + wind: 8.272123, + hydro: 2483.6868, + nuclear: 2322.5298, + oil: 1259.9452, + gas: 2036.3821, + coal: 5038.9316, + }, + { + country: 'World', + year: 1996, + other: 0, + bio: 0, + solar: 0.69922996, + wind: 9.215601, + hydro: 2517.03, + nuclear: 2406.615, + oil: 1245.6957, + gas: 2101.594, + coal: 5279.661, + }, + { + country: 'World', + year: 1997, + other: 0, + bio: 0, + solar: 0.7496558, + wind: 12.028216, + hydro: 2561.359, + nuclear: 2390.0642, + oil: 1244.647, + gas: 2271.0615, + coal: 5395.626, + }, + { + country: 'World', + year: 1998, + other: 0, + bio: 0, + solar: 0.811852, + wind: 15.92926, + hydro: 2581.1204, + nuclear: 2431.1948, + oil: 1294.6146, + gas: 2408.5476, + coal: 5511.2935, + }, + { + country: 'World', + year: 1999, + other: 0, + bio: 0, + solar: 0.9052879, + wind: 21.226898, + hydro: 2600.65, + nuclear: 2523.7056, + oil: 1266.6599, + gas: 2600.75, + coal: 5630.859, + }, + { + country: 'World', + year: 2000, + other: 52.37, + bio: 148.65, + solar: 1.08, + wind: 31.16, + hydro: 2621.36, + nuclear: 2507.43, + oil: 1209.51, + gas: 2681.11, + coal: 5719.12, + }, + { + country: 'World', + year: 2001, + other: 52.6, + bio: 143.1, + solar: 1.35, + wind: 38.16, + hydro: 2561.04, + nuclear: 2573.71, + oil: 1197.6, + gas: 2827.65, + coal: 5801.14, + }, + { + country: 'World', + year: 2002, + other: 54.08, + bio: 156.61, + solar: 1.69, + wind: 52.04, + hydro: 2601.39, + nuclear: 2601.89, + oil: 1175.58, + gas: 3033.78, + coal: 6056.12, + }, + { + country: 'World', + year: 2003, + other: 56.07, + bio: 167.91, + solar: 2.07, + wind: 63.43, + hydro: 2602.33, + nuclear: 2577.71, + oil: 1198.2, + gas: 3165.78, + coal: 6458.61, + }, + { + country: 'World', + year: 2004, + other: 57.94, + bio: 184.54, + solar: 2.71, + wind: 85.26, + hydro: 2796.69, + nuclear: 2682.73, + oil: 1177.47, + gas: 3408.19, + coal: 6697.61, + }, + { + country: 'World', + year: 2005, + other: 58.74, + bio: 208.44, + solar: 3.78, + wind: 103.89, + hydro: 2895.17, + nuclear: 2686.95, + oil: 1186.13, + gas: 3579.99, + coal: 7040.85, + }, + { + country: 'World', + year: 2006, + other: 60.11, + bio: 220.96, + solar: 5.11, + wind: 132.79, + hydro: 3001.53, + nuclear: 2721.42, + oil: 1097.06, + gas: 3792.38, + coal: 7439.88, + }, + { + country: 'World', + year: 2007, + other: 62.87, + bio: 243.14, + solar: 6.92, + wind: 170.91, + hydro: 3046.18, + nuclear: 2666.92, + oil: 1119.39, + gas: 4109.47, + coal: 7931.82, + }, + { + country: 'World', + year: 2008, + other: 65.97, + bio: 258.44, + solar: 11.36, + wind: 220.07, + hydro: 3231.07, + nuclear: 2656.04, + oil: 1078.99, + gas: 4210.51, + coal: 7927.59, + }, + { + country: 'World', + year: 2009, + other: 68.02, + bio: 279.55, + solar: 19.19, + wind: 275.88, + hydro: 3229.55, + nuclear: 2619, + oil: 1005.12, + gas: 4247.72, + coal: 7817.32, + }, + { + country: 'World', + year: 2010, + other: 68.38, + bio: 322.22, + solar: 31.05, + wind: 345.99, + hydro: 3412.33, + nuclear: 2686.44, + oil: 1011.78, + gas: 4701.27, + coal: 8358.6, + }, + { + country: 'World', + year: 2011, + other: 69.67, + bio: 342.44, + solar: 61.85, + wind: 440.39, + hydro: 3479.25, + nuclear: 2575.35, + oil: 1103.87, + gas: 4767.24, + coal: 8814.17, + }, + { + country: 'World', + year: 2012, + other: 70.88, + bio: 370.87, + solar: 95.18, + wind: 529.11, + hydro: 3645.02, + nuclear: 2403.21, + oil: 1157.13, + gas: 5042.66, + coal: 8855.83, + }, + { + country: 'World', + year: 2013, + other: 72.58, + bio: 402.92, + solar: 131.42, + wind: 641.17, + hydro: 3776.88, + nuclear: 2418.44, + oil: 1118.61, + gas: 4939.52, + coal: 9306.75, + }, + { + country: 'World', + year: 2014, + other: 77.68, + bio: 438.47, + solar: 196.46, + wind: 716.51, + hydro: 3865.63, + nuclear: 2472.7, + oil: 1063.74, + gas: 5096.07, + coal: 9495.57, + }, + { + country: 'World', + year: 2015, + other: 81.57, + bio: 475.79, + solar: 254.87, + wind: 828.37, + hydro: 3870.04, + nuclear: 2502.45, + oil: 1068.09, + gas: 5418.55, + coal: 9160.63, + }, + { + country: 'World', + year: 2016, + other: 83.91, + bio: 483.77, + solar: 329.15, + wind: 959.65, + hydro: 3996.54, + nuclear: 2540.48, + oil: 1004.96, + gas: 5669.08, + coal: 9226.85, + }, + { + country: 'World', + year: 2017, + other: 86.39, + bio: 515.07, + solar: 444.54, + wind: 1136.41, + hydro: 4053.96, + nuclear: 2566.22, + oil: 913.07, + gas: 5791.83, + coal: 9518.91, + }, + { + country: 'World', + year: 2018, + other: 89.54, + bio: 546.21, + solar: 570.57, + wind: 1265.29, + hydro: 4174.81, + nuclear: 2619.57, + oil: 841.34, + gas: 6015.24, + coal: 9899.44, + }, + { + country: 'World', + year: 2019, + other: 91.15, + bio: 575.5, + solar: 701.19, + wind: 1419.51, + hydro: 4220.11, + nuclear: 2724.08, + oil: 776.78, + gas: 6176.34, + coal: 9680.92, + }, + { + country: 'World', + year: 2020, + other: 94.16, + bio: 602.57, + solar: 850.89, + wind: 1587.13, + hydro: 4341.1, + nuclear: 2634.69, + oil: 741, + gas: 6132.47, + coal: 9292.9, + }, + { + country: 'World', + year: 2021, + other: 95, + bio: 663.78, + solar: 1040.06, + wind: 1849.4, + hydro: 4244.57, + nuclear: 2740.78, + oil: 793.53, + gas: 6326, + coal: 10081.8, + }, + { + country: 'World', + year: 2022, + other: 99.74, + bio: 677.57, + solar: 1289.27, + wind: 2139.23, + hydro: 4326.76, + nuclear: 2610.04, + oil: 884.98, + gas: 6309.46, + coal: 10190.71, + }, +]; diff --git a/docs/data/charts/pie/webUsageStats.js b/docs/data/charts/pie/webUsageStats.js new file mode 100644 index 0000000000000..b8a888253dcf4 --- /dev/null +++ b/docs/data/charts/pie/webUsageStats.js @@ -0,0 +1,70 @@ +// Data derived from https://gs.statcounter.com/os-market-share/desktop/worldwide/2023 +// And https://gs.statcounter.com/os-market-share/mobile/worldwide/2023 +// And https://gs.statcounter.com/platform-market-share/desktop-mobile-tablet/worldwide/2023 +// For the month of December 2023 + +export const desktopOS = [ + { + label: 'Windows', + value: 72.72, + }, + { + label: 'OS X', + value: 16.38, + }, + { + label: 'Linux', + value: 3.83, + }, + { + label: 'Chrome OS', + value: 2.42, + }, + { + label: 'Other', + value: 4.65, + }, +]; + +export const mobileOS = [ + { + label: 'Android', + value: 70.48, + }, + { + label: 'iOS', + value: 28.8, + }, + { + label: 'Other', + value: 0.71, + }, +]; + +export const platforms = [ + { + label: 'Mobile', + value: 59.12, + }, + { + label: 'Desktop', + value: 40.88, + }, +]; + +const normalize = (v, v2) => Number.parseFloat(((v * v2) / 100).toFixed(2)); + +export const mobileAndDesktopOS = [ + ...mobileOS.map((v) => ({ + ...v, + label: v.label === 'Other' ? 'Other (Mobile)' : v.label, + value: normalize(v.value, platforms[0].value), + })), + ...desktopOS.map((v) => ({ + ...v, + label: v.label === 'Other' ? 'Other (Desktop)' : v.label, + value: normalize(v.value, platforms[1].value), + })), +]; + +export const valueFormatter = (item) => `${item.value}%`; diff --git a/docs/data/charts/zoom-and-pan/letterFrequency.js b/docs/data/charts/zoom-and-pan/letterFrequency.js new file mode 100644 index 0000000000000..43e294a10c55e --- /dev/null +++ b/docs/data/charts/zoom-and-pan/letterFrequency.js @@ -0,0 +1,37 @@ +export const letterFrequency = [ + { letter: 'A', frequency: 8.2 }, + { letter: 'B', frequency: 1.5 }, + { letter: 'C', frequency: 2.8 }, + { letter: 'D', frequency: 4.3 }, + { letter: 'E', frequency: 12.7 }, + { letter: 'F', frequency: 2.2 }, + { letter: 'G', frequency: 2.0 }, + { letter: 'H', frequency: 6.1 }, + { letter: 'I', frequency: 7.0 }, + { letter: 'J', frequency: 0.15 }, + { letter: 'K', frequency: 0.77 }, + { letter: 'L', frequency: 4.0 }, + { letter: 'M', frequency: 2.4 }, + { letter: 'N', frequency: 6.7 }, + { letter: 'O', frequency: 7.5 }, + { letter: 'P', frequency: 1.9 }, + { letter: 'Q', frequency: 0.095 }, + { letter: 'R', frequency: 6.0 }, + { letter: 'S', frequency: 6.3 }, + { letter: 'T', frequency: 9.1 }, + { letter: 'U', frequency: 2.8 }, + { letter: 'V', frequency: 0.98 }, + { letter: 'W', frequency: 2.4 }, + { letter: 'X', frequency: 0.15 }, + { letter: 'Y', frequency: 2.0 }, + { letter: 'Z', frequency: 0.074 }, +]; + +export const dataset = letterFrequency.sort((a, b) => b.frequency - a.frequency); + +export function valueFormatter(value) { + if (value === null) { + return `?`; + } + return `${(value / 100).toLocaleString(undefined, { style: 'percent', maximumFractionDigits: 2 })}`; +} diff --git a/docs/data/chartsApiPages.js b/docs/data/chartsApiPages.js new file mode 100644 index 0000000000000..bd10df71c216e --- /dev/null +++ b/docs/data/chartsApiPages.js @@ -0,0 +1,223 @@ +const chartsApiPages = [ + { + pathname: '/x/api/charts/animated-area', + title: 'AnimatedArea', + }, + { + pathname: '/x/api/charts/animated-line', + title: 'AnimatedLine', + }, + { + pathname: '/x/api/charts/area-element', + title: 'AreaElement', + }, + { + pathname: '/x/api/charts/area-plot', + title: 'AreaPlot', + }, + { + pathname: '/x/api/charts/bar-chart', + title: 'BarChart', + }, + { + pathname: '/x/api/charts/bar-chart-pro', + title: 'BarChartPro', + plan: 'pro', + }, + { + pathname: '/x/api/charts/bar-element', + title: 'BarElement', + }, + { + pathname: '/x/api/charts/bar-label', + title: 'BarLabel', + }, + { + pathname: '/x/api/charts/bar-plot', + title: 'BarPlot', + }, + { + pathname: '/x/api/charts/chart-container', + title: 'ChartContainer', + }, + { + pathname: '/x/api/charts/chart-container-pro', + title: 'ChartContainerPro', + plan: 'pro', + }, + { + pathname: '/x/api/charts/charts-axis', + title: 'ChartsAxis', + }, + { + pathname: '/x/api/charts/charts-axis-highlight', + title: 'ChartsAxisHighlight', + }, + { + pathname: '/x/api/charts/charts-clip-path', + title: 'ChartsClipPath', + }, + { + pathname: '/x/api/charts/charts-grid', + title: 'ChartsGrid', + }, + { + pathname: '/x/api/charts/charts-legend', + title: 'ChartsLegend', + }, + { + pathname: '/x/api/charts/charts-on-axis-click-handler', + title: 'ChartsOnAxisClickHandler', + }, + { + pathname: '/x/api/charts/charts-reference-line', + title: 'ChartsReferenceLine', + }, + { + pathname: '/x/api/charts/charts-surface', + title: 'ChartsSurface', + }, + { + pathname: '/x/api/charts/charts-text', + title: 'ChartsText', + }, + { + pathname: '/x/api/charts/charts-tooltip', + title: 'ChartsTooltip', + }, + { + pathname: '/x/api/charts/charts-voronoi-handler', + title: 'ChartsVoronoiHandler', + }, + { + pathname: '/x/api/charts/charts-x-axis', + title: 'ChartsXAxis', + }, + { + pathname: '/x/api/charts/charts-y-axis', + title: 'ChartsYAxis', + }, + { + pathname: '/x/api/charts/continuous-color-legend', + title: 'ContinuousColorLegend', + }, + { + pathname: '/x/api/charts/default-charts-axis-tooltip-content', + title: 'DefaultChartsAxisTooltipContent', + }, + { + pathname: '/x/api/charts/default-charts-item-tooltip-content', + title: 'DefaultChartsItemTooltipContent', + }, + { + pathname: '/x/api/charts/default-charts-legend', + title: 'DefaultChartsLegend', + }, + { + pathname: '/x/api/charts/default-heatmap-tooltip', + title: 'DefaultHeatmapTooltip', + plan: 'pro', + }, + { + pathname: '/x/api/charts/gauge', + title: 'Gauge', + }, + { + pathname: '/x/api/charts/gauge-container', + title: 'GaugeContainer', + }, + { + pathname: '/x/api/charts/heatmap', + title: 'Heatmap', + plan: 'pro', + }, + { + pathname: '/x/api/charts/heatmap-plot', + title: 'HeatmapPlot', + plan: 'pro', + }, + { + pathname: '/x/api/charts/line-chart', + title: 'LineChart', + }, + { + pathname: '/x/api/charts/line-chart-pro', + title: 'LineChartPro', + plan: 'pro', + }, + { + pathname: '/x/api/charts/line-element', + title: 'LineElement', + }, + { + pathname: '/x/api/charts/line-highlight-element', + title: 'LineHighlightElement', + }, + { + pathname: '/x/api/charts/line-highlight-plot', + title: 'LineHighlightPlot', + }, + { + pathname: '/x/api/charts/line-plot', + title: 'LinePlot', + }, + { + pathname: '/x/api/charts/mark-element', + title: 'MarkElement', + }, + { + pathname: '/x/api/charts/mark-plot', + title: 'MarkPlot', + }, + { + pathname: '/x/api/charts/pie-arc', + title: 'PieArc', + }, + { + pathname: '/x/api/charts/pie-arc-label', + title: 'PieArcLabel', + }, + { + pathname: '/x/api/charts/pie-arc-label-plot', + title: 'PieArcLabelPlot', + }, + { + pathname: '/x/api/charts/pie-arc-plot', + title: 'PieArcPlot', + }, + { + pathname: '/x/api/charts/piecewise-color-legend', + title: 'PiecewiseColorLegend', + }, + { + pathname: '/x/api/charts/pie-chart', + title: 'PieChart', + }, + { + pathname: '/x/api/charts/pie-plot', + title: 'PiePlot', + }, + { + pathname: '/x/api/charts/scatter', + title: 'Scatter', + }, + { + pathname: '/x/api/charts/scatter-chart', + title: 'ScatterChart', + }, + { + pathname: '/x/api/charts/scatter-chart-pro', + title: 'ScatterChartPro', + plan: 'pro', + }, + { + pathname: '/x/api/charts/scatter-plot', + title: 'ScatterPlot', + }, + { + pathname: '/x/api/charts/spark-line-chart', + title: 'SparkLineChart', + }, +]; + +export default chartsApiPages; diff --git a/docs/data/data-grid/export/excelExportWorker.js b/docs/data/data-grid/export/excelExportWorker.js new file mode 100644 index 0000000000000..fa46ebc24e1e0 --- /dev/null +++ b/docs/data/data-grid/export/excelExportWorker.js @@ -0,0 +1,4 @@ +// Used in ExcelExportWithWebWorker demo +import { setupExcelExportWebWorker } from '@mui/x-data-grid-premium'; + +setupExcelExportWebWorker(); diff --git a/docs/data/data-grid/list-view/constants.js b/docs/data/data-grid/list-view/constants.js new file mode 100644 index 0000000000000..367df998d6374 --- /dev/null +++ b/docs/data/data-grid/list-view/constants.js @@ -0,0 +1,15 @@ +export const FILE_TYPES = [ + 'pdf', + 'docx', + 'txt', + 'mp4', + 'mov', + 'webm', + 'jpg', + 'jpeg', + 'png', + 'gif', + 'tiff', + 'webp', + 'zip', +]; diff --git a/docs/data/data-grid/list-view/data.js b/docs/data/data-grid/list-view/data.js new file mode 100644 index 0000000000000..39537f00c1f53 --- /dev/null +++ b/docs/data/data-grid/list-view/data.js @@ -0,0 +1,202 @@ +import { randomId } from '@mui/x-data-grid-generator'; + +export const INITIAL_ROWS = [ + { + id: randomId(), + type: 'zip', + name: 'archive.zip', + description: 'Compressed archive of project files', + size: 128_313_213, + createdBy: 'Kenan Yusuf', + createdAt: new Date('2023-09-15T08:30:00').toISOString(), + updatedAt: new Date('2023-09-15T08:30:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'docx', + name: 'invoice-322.docx', + description: 'Invoice document for client 322', + size: 1_694_986, + createdBy: 'José Freitas', + createdAt: new Date('2024-01-18T11:30:00').toISOString(), + updatedAt: new Date().toISOString(), // Today + state: 'uploaded', + }, + { + id: randomId(), + type: 'png', + name: 'screenshot_2024-02-14_12-34-56.png', + description: 'Screenshot of application interface', + size: 522_078, + createdBy: 'José Freitas', + createdAt: new Date('2024-02-14T12:35:16').toISOString(), + updatedAt: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000).toISOString(), // Last week + state: 'uploaded', + }, + { + id: randomId(), + type: 'mp4', + name: 'strategy-meeting.mp4', + description: 'Recording of the strategy planning meeting', + size: 2_442_044, + createdBy: 'José Freitas', + createdAt: new Date('2023-12-05T15:40:30').toISOString(), + updatedAt: new Date(Date.now() - 20 * 24 * 60 * 60 * 1000).toISOString(), // Last month + state: 'uploaded', + }, + { + id: randomId(), + type: 'docx', + name: 'project-proposal.docx', + description: 'Detailed project proposal document', + size: 3_567_890, + createdBy: 'Olivier Tassinari', + createdAt: new Date('2024-03-01T09:15:00').toISOString(), + updatedAt: new Date('2024-03-02T14:30:45').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'png', + name: 'logo-design-final.png', + description: 'Final version of the company logo design', + size: 1_234_567, + createdBy: 'Kenan Yusuf', + createdAt: new Date('2024-02-28T16:20:00').toISOString(), + updatedAt: new Date('2024-02-28T16:20:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'mp4', + name: 'product-demo.mp4', + description: 'Video demonstration of the new product features', + size: 15_789_012, + createdBy: 'Olivier Tassinari', + createdAt: new Date('2024-02-25T11:45:00').toISOString(), + updatedAt: new Date(Date.now() - 60 * 24 * 60 * 60 * 1000).toISOString(), // Last 3 months + state: 'uploaded', + }, + { + id: randomId(), + type: 'zip', + name: 'project-assets.zip', + description: 'Compressed folder containing all project assets', + size: 87_654_321, + createdBy: 'José Freitas', + createdAt: new Date('2024-03-03T13:00:00').toISOString(), + updatedAt: new Date('2024-03-03T13:00:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'docx', + name: 'meeting-minutes-2024-03-10.docx', + description: 'Minutes from the team meeting on March 10, 2024', + size: 567_890, + createdBy: 'Kenan Yusuf', + createdAt: new Date('2024-03-10T14:00:00').toISOString(), + updatedAt: new Date('2024-03-10T16:30:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'png', + name: 'ui-mockup-v2.png', + description: 'Updated user interface mockup', + size: 3_456_789, + createdBy: 'Olivier Tassinari', + createdAt: new Date('2024-03-05T10:20:00').toISOString(), + updatedAt: new Date('2024-03-05T10:20:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'mp4', + name: 'user-feedback-session.mp4', + description: 'Recording of user feedback session', + size: 234_567_890, + createdBy: 'José Freitas', + createdAt: new Date('2024-03-08T13:45:00').toISOString(), + updatedAt: new Date('2024-03-08T15:30:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'zip', + name: 'legacy-codebase.zip', + description: 'Archive of the legacy project codebase', + size: 567_890_123, + createdBy: 'Kenan Yusuf', + createdAt: new Date('2024-02-20T09:00:00').toISOString(), + updatedAt: new Date('2024-02-20T09:00:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'docx', + name: 'q1-2024-report.docx', + description: 'Quarterly report for Q1 2024', + size: 4_567_890, + createdBy: 'Olivier Tassinari', + createdAt: new Date('2024-03-31T23:59:59').toISOString(), + updatedAt: new Date('2024-04-01T10:15:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'png', + name: 'data-visualization.png', + description: 'Chart showing project progress', + size: 789_012, + createdBy: 'José Freitas', + createdAt: new Date('2024-03-15T11:30:00').toISOString(), + updatedAt: new Date('2024-03-15T11:30:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'mp4', + name: 'code-review-session.mp4', + description: 'Recording of code review meeting', + size: 345_678_901, + createdBy: 'Kenan Yusuf', + createdAt: new Date('2024-03-20T14:00:00').toISOString(), + updatedAt: new Date('2024-03-20T16:45:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'zip', + name: 'design-assets-v3.zip', + description: 'Compressed folder of updated design assets', + size: 98_765_432, + createdBy: 'Olivier Tassinari', + createdAt: new Date('2024-03-25T09:30:00').toISOString(), + updatedAt: new Date('2024-03-25T09:30:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'docx', + name: 'api-documentation.docx', + description: 'Comprehensive API documentation', + size: 2_345_678, + createdBy: 'José Freitas', + createdAt: new Date('2024-03-28T16:20:00').toISOString(), + updatedAt: new Date('2024-03-29T11:45:00').toISOString(), + state: 'uploaded', + }, + { + id: randomId(), + type: 'png', + name: 'error-screenshot.png', + description: 'Screenshot of error message for debugging', + size: 345_678, + createdBy: 'Kenan Yusuf', + createdAt: new Date('2024-03-30T08:15:00').toISOString(), + updatedAt: new Date('2024-03-30T08:15:00').toISOString(), + state: 'uploaded', + }, +]; diff --git a/docs/data/data-grid/list-view/utils.js b/docs/data/data-grid/list-view/utils.js new file mode 100644 index 0000000000000..8e75f8418c0ff --- /dev/null +++ b/docs/data/data-grid/list-view/utils.js @@ -0,0 +1,56 @@ +export function formatDate(value) { + if (!value) { + return '—'; + } + const date = new Date(value); + const formatter = new Intl.DateTimeFormat('en-US', { + month: 'short', + day: '2-digit', + year: 'numeric', + hour: '2-digit', + minute: '2-digit', + }); + return formatter.format(date); +} + +export function formatSize(size) { + const units = ['B', 'KB', 'MB', 'GB', 'TB']; + let unitIndex = 0; + let formattedSize = size; + + while (formattedSize >= 1024 && unitIndex < units.length - 1) { + formattedSize /= 1024; + unitIndex += 1; + } + + return `${formattedSize.toFixed(2)} ${units[unitIndex]}`; +} + +export function stringToColor(string) { + let hash = 0; + let i; + + /* eslint-disable no-bitwise */ + for (i = 0; i < string.length; i += 1) { + hash = string.charCodeAt(i) + ((hash << 5) - hash); + } + + let color = '#'; + + for (i = 0; i < 3; i += 1) { + const value = (hash >> (i * 8)) & 0xff; + color += `00${value.toString(16)}`.slice(-2); + } + /* eslint-enable no-bitwise */ + + return color; +} + +export function stringAvatar(name) { + return { + sx: { + bgcolor: stringToColor(name), + }, + children: `${name.split(' ')[0][0]}${name.split(' ')[1][0]}`, + }; +} diff --git a/docs/data/dataGridApiPages.js b/docs/data/dataGridApiPages.js new file mode 100644 index 0000000000000..3015186991964 --- /dev/null +++ b/docs/data/dataGridApiPages.js @@ -0,0 +1,30 @@ +const dataGridApiPages = [ + { + pathname: '/x/api/data-grid/data-grid', + title: 'DataGrid', + }, + { + pathname: '/x/api/data-grid/data-grid-premium', + title: 'DataGridPremium', + plan: 'premium', + }, + { + pathname: '/x/api/data-grid/data-grid-pro', + title: 'DataGridPro', + plan: 'pro', + }, + { + pathname: '/x/api/data-grid/grid-filter-form', + title: 'GridFilterForm', + }, + { + pathname: '/x/api/data-grid/grid-filter-panel', + title: 'GridFilterPanel', + }, + { + pathname: '/x/api/data-grid/grid-toolbar-quick-filter', + title: 'GridToolbarQuickFilter', + }, +]; + +export default dataGridApiPages; diff --git a/docs/data/datePickersApiPages.js b/docs/data/datePickersApiPages.js new file mode 100644 index 0000000000000..ac4110fd31b50 --- /dev/null +++ b/docs/data/datePickersApiPages.js @@ -0,0 +1,235 @@ +const datePickersApiPages = [ + { + pathname: '/x/api/date-pickers/date-calendar', + title: 'DateCalendar', + }, + { + pathname: '/x/api/date-pickers/date-field', + title: 'DateField', + }, + { + pathname: '/x/api/date-pickers/date-picker', + title: 'DatePicker', + }, + { + pathname: '/x/api/date-pickers/date-picker-toolbar', + title: 'DatePickerToolbar', + }, + { + pathname: '/x/api/date-pickers/date-range-calendar', + title: 'DateRangeCalendar', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/date-range-picker', + title: 'DateRangePicker', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/date-range-picker-day', + title: 'DateRangePickerDay', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/date-range-picker-toolbar', + title: 'DateRangePickerToolbar', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/date-time-field', + title: 'DateTimeField', + }, + { + pathname: '/x/api/date-pickers/date-time-picker', + title: 'DateTimePicker', + }, + { + pathname: '/x/api/date-pickers/date-time-picker-tabs', + title: 'DateTimePickerTabs', + }, + { + pathname: '/x/api/date-pickers/date-time-picker-toolbar', + title: 'DateTimePickerToolbar', + }, + { + pathname: '/x/api/date-pickers/date-time-range-picker', + title: 'DateTimeRangePicker', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/date-time-range-picker-tabs', + title: 'DateTimeRangePickerTabs', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/date-time-range-picker-toolbar', + title: 'DateTimeRangePickerToolbar', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/day-calendar-skeleton', + title: 'DayCalendarSkeleton', + }, + { + pathname: '/x/api/date-pickers/desktop-date-picker', + title: 'DesktopDatePicker', + }, + { + pathname: '/x/api/date-pickers/desktop-date-range-picker', + title: 'DesktopDateRangePicker', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/desktop-date-time-picker', + title: 'DesktopDateTimePicker', + }, + { + pathname: '/x/api/date-pickers/desktop-date-time-range-picker', + title: 'DesktopDateTimeRangePicker', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/desktop-time-picker', + title: 'DesktopTimePicker', + }, + { + pathname: '/x/api/date-pickers/digital-clock', + title: 'DigitalClock', + }, + { + pathname: '/x/api/date-pickers/localization-provider', + title: 'LocalizationProvider', + }, + { + pathname: '/x/api/date-pickers/mobile-date-picker', + title: 'MobileDatePicker', + }, + { + pathname: '/x/api/date-pickers/mobile-date-range-picker', + title: 'MobileDateRangePicker', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/mobile-date-time-picker', + title: 'MobileDateTimePicker', + }, + { + pathname: '/x/api/date-pickers/mobile-date-time-range-picker', + title: 'MobileDateTimeRangePicker', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/mobile-time-picker', + title: 'MobileTimePicker', + }, + { + pathname: '/x/api/date-pickers/month-calendar', + title: 'MonthCalendar', + }, + { + pathname: '/x/api/date-pickers/multi-input-date-range-field', + title: 'MultiInputDateRangeField', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/multi-input-date-time-range-field', + title: 'MultiInputDateTimeRangeField', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/multi-input-time-range-field', + title: 'MultiInputTimeRangeField', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/multi-section-digital-clock', + title: 'MultiSectionDigitalClock', + }, + { + pathname: '/x/api/date-pickers/pickers-action-bar', + title: 'PickersActionBar', + }, + { + pathname: '/x/api/date-pickers/pickers-calendar-header', + title: 'PickersCalendarHeader', + }, + { + pathname: '/x/api/date-pickers/pickers-day', + title: 'PickersDay', + }, + { + pathname: '/x/api/date-pickers/pickers-layout', + title: 'PickersLayout', + }, + { + pathname: '/x/api/date-pickers/pickers-range-calendar-header', + title: 'PickersRangeCalendarHeader', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/pickers-section-list', + title: 'PickersSectionList', + }, + { + pathname: '/x/api/date-pickers/pickers-shortcuts', + title: 'PickersShortcuts', + }, + { + pathname: '/x/api/date-pickers/pickers-text-field', + title: 'PickersTextField', + }, + { + pathname: '/x/api/date-pickers/single-input-date-range-field', + title: 'SingleInputDateRangeField', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/single-input-date-time-range-field', + title: 'SingleInputDateTimeRangeField', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/single-input-time-range-field', + title: 'SingleInputTimeRangeField', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/static-date-picker', + title: 'StaticDatePicker', + }, + { + pathname: '/x/api/date-pickers/static-date-range-picker', + title: 'StaticDateRangePicker', + plan: 'pro', + }, + { + pathname: '/x/api/date-pickers/static-date-time-picker', + title: 'StaticDateTimePicker', + }, + { + pathname: '/x/api/date-pickers/static-time-picker', + title: 'StaticTimePicker', + }, + { + pathname: '/x/api/date-pickers/time-clock', + title: 'TimeClock', + }, + { + pathname: '/x/api/date-pickers/time-field', + title: 'TimeField', + }, + { + pathname: '/x/api/date-pickers/time-picker', + title: 'TimePicker', + }, + { + pathname: '/x/api/date-pickers/time-picker-toolbar', + title: 'TimePickerToolbar', + }, + { + pathname: '/x/api/date-pickers/year-calendar', + title: 'YearCalendar', + }, +]; + +export default datePickersApiPages; diff --git a/docs/data/pickersAdapterOverride.js b/docs/data/pickersAdapterOverride.js new file mode 100644 index 0000000000000..e8e2f780391a9 --- /dev/null +++ b/docs/data/pickersAdapterOverride.js @@ -0,0 +1,4 @@ +// This module override mark all the date object in the doc to be any instead of Date | Dayjs | Moment | DateTime. +// That way we can use date library methods without casting the date object to a specific type. + +export {}; diff --git a/docs/data/tree-view/datasets/employees.js b/docs/data/tree-view/datasets/employees.js new file mode 100644 index 0000000000000..c11515cf4fbae --- /dev/null +++ b/docs/data/tree-view/datasets/employees.js @@ -0,0 +1,38 @@ +export const EMPLOYEES_DATASET = [ + { + id: '0', + label: 'Sarah', + }, + { + id: '1', + label: 'Thomas', + children: [ + { id: '2', label: 'Robert' }, + { id: '3', label: 'Karen' }, + { id: '4', label: 'Nancy' }, + { id: '5', label: 'Daniel' }, + { id: '6', label: 'Christopher' }, + { id: '7', label: 'Donald' }, + ], + }, + { + id: '8', + label: 'Mary', + children: [ + { + id: '9', + label: 'Jennifer', + children: [{ id: '10', label: 'Anna' }], + }, + { id: '11', label: 'Michael' }, + { + id: '12', + label: 'Linda', + children: [ + { id: '13', label: 'Elizabeth' }, + { id: '14', label: 'William' }, + ], + }, + ], + }, +]; diff --git a/docs/data/tree-view/rich-tree-view/editing/editableProducts.js b/docs/data/tree-view/rich-tree-view/editing/editableProducts.js new file mode 100644 index 0000000000000..f34a7b652d408 --- /dev/null +++ b/docs/data/tree-view/rich-tree-view/editing/editableProducts.js @@ -0,0 +1,32 @@ +export const MUI_X_PRODUCTS = [ + { + id: 'grid', + label: 'Data Grid', + children: [ + { id: 'grid-community', label: '@mui/x-data-grid editable', editable: true }, + { id: 'grid-pro', label: '@mui/x-data-grid-pro editable', editable: true }, + { id: 'grid-premium', label: '@mui/x-data-grid-premium' }, + ], + }, + { + id: 'pickers', + label: 'Date and Time pickers', + children: [ + { + id: 'pickers-community', + label: '@mui/x-date-pickers', + }, + { id: 'pickers-pro', label: '@mui/x-date-pickers-pro' }, + ], + }, + { + id: 'charts', + label: 'Charts', + children: [{ id: 'charts-community', label: '@mui/x-charts' }], + }, + { + id: 'tree-view', + label: 'Tree View', + children: [{ id: 'tree-view-community', label: '@mui/x-tree-view' }], + }, +]; diff --git a/docs/data/tree-view/rich-tree-view/editing/employees.js b/docs/data/tree-view/rich-tree-view/editing/employees.js new file mode 100644 index 0000000000000..df8b8474725e9 --- /dev/null +++ b/docs/data/tree-view/rich-tree-view/editing/employees.js @@ -0,0 +1,28 @@ +export const EMPLOYEES = [ + { + id: '1', + firstName: 'Jane', + lastName: 'Doe', + editable: true, + children: [ + { id: '1.1', firstName: 'Elena', lastName: 'Kim', editable: true }, + { id: '1.2', firstName: 'Noah', lastName: 'Rodriguez', editable: true }, + { id: '1.3', firstName: 'Maya', lastName: 'Patel', editable: true }, + ], + }, + { + id: '2', + firstName: 'Liam', + lastName: 'Clarke', + editable: true, + children: [ + { + id: '2.1', + firstName: 'Ethan', + lastName: 'Lee', + editable: true, + }, + { id: '2.2', firstName: 'Ava', lastName: 'Jones', editable: true }, + ], + }, +]; diff --git a/docs/data/tree-view/rich-tree-view/editing/products.js b/docs/data/tree-view/rich-tree-view/editing/products.js new file mode 100644 index 0000000000000..384f68c38b0b7 --- /dev/null +++ b/docs/data/tree-view/rich-tree-view/editing/products.js @@ -0,0 +1,32 @@ +export const MUI_X_PRODUCTS = [ + { + id: 'grid', + label: 'Data Grid', + children: [ + { id: 'grid-community', label: '@mui/x-data-grid' }, + { id: 'grid-pro', label: '@mui/x-data-grid-pro' }, + { id: 'grid-premium', label: '@mui/x-data-grid-premium' }, + ], + }, + { + id: 'pickers', + label: 'Date and Time pickers', + children: [ + { + id: 'pickers-community', + label: '@mui/x-date-pickers', + }, + { id: 'pickers-pro', label: '@mui/x-date-pickers-pro' }, + ], + }, + { + id: 'charts', + label: 'Charts', + children: [{ id: 'charts-community', label: '@mui/x-charts' }], + }, + { + id: 'tree-view', + label: 'Tree View', + children: [{ id: 'tree-view-community', label: '@mui/x-tree-view' }], + }, +]; diff --git a/docs/data/tree-view/tree-item-customization/products.js b/docs/data/tree-view/tree-item-customization/products.js new file mode 100644 index 0000000000000..3572ec795c90f --- /dev/null +++ b/docs/data/tree-view/tree-item-customization/products.js @@ -0,0 +1,34 @@ +export const MUI_X_PRODUCTS = [ + { + id: 'grid', + label: 'Data Grid', + editable: true, + children: [ + { id: 'grid-community', label: '@mui/x-data-grid', editable: true }, + { id: 'grid-pro', label: '@mui/x-data-grid-pro', editable: true }, + { id: 'grid-premium', label: '@mui/x-data-grid-premium', editable: true }, + ], + }, + { + id: 'pickers', + label: 'Date and Time pickers', + children: [ + { + id: 'pickers-community', + label: '@mui/x-date-pickers', + disabled: true, + }, + { id: 'pickers-pro', label: '@mui/x-date-pickers-pro', editable: true }, + ], + }, + { + id: 'charts', + label: 'Charts', + children: [{ id: 'charts-community', label: '@mui/x-charts' }], + }, + { + id: 'tree-view', + label: 'Tree View', + children: [{ id: 'tree-view-community', label: '@mui/x-tree-view' }], + }, +]; diff --git a/docs/data/treeViewApiPages.js b/docs/data/treeViewApiPages.js new file mode 100644 index 0000000000000..6950cfce8505c --- /dev/null +++ b/docs/data/treeViewApiPages.js @@ -0,0 +1,29 @@ +const treeViewApiPages = [ + { + pathname: '/x/api/tree-view/rich-tree-view', + title: 'RichTreeView', + }, + { + pathname: '/x/api/tree-view/rich-tree-view-pro', + title: 'RichTreeViewPro', + plan: 'pro', + }, + { + pathname: '/x/api/tree-view/simple-tree-view', + title: 'SimpleTreeView', + }, + { + pathname: '/x/api/tree-view/tree-item', + title: 'TreeItem', + }, + { + pathname: '/x/api/tree-view/tree-item-drag-and-drop-overlay', + title: 'TreeItemDragAndDropOverlay', + }, + { + pathname: '/x/api/tree-view/tree-item-icon', + title: 'TreeItemIcon', + }, +]; + +export default treeViewApiPages;