@iobroker/gui-components 8.0.1

package/build/Theme.d.ts

@@ -0,0 +1,5 @@
+import type { IobTheme, ThemeName } from './types';
+/**
+ * The theme creation factory function.
+ */
+export declare function Theme(type: ThemeName, overrides?: Record<string, any>): IobTheme;

package/build/Theme.js

@@ -0,0 +1,344 @@
+import { createTheme, alpha } from '@mui/material/styles';
+import { orange, grey } from '@mui/material/colors';
+const step = (16 - 5) / 23 / 100;
+/**
+ * Convert hex color in the format '#rrggbb' or '#rgb' to an RGB object.
+ */
+function toInt(hex) {
+    const rgb = {
+        r: 0,
+        g: 0,
+        b: 0,
+    };
+    if (hex.length === 7) {
+        rgb.r = parseInt(hex.substring(1, 3), 16);
+        rgb.g = parseInt(hex.substring(3, 5), 16);
+        rgb.b = parseInt(hex.substring(5, 7), 16);
+    }
+    else if (hex.length === 4) {
+        const r = hex[1];
+        const g = hex[2];
+        const b = hex[3];
+        rgb.r = parseInt(r + r, 16);
+        rgb.g = parseInt(g + g, 16);
+        rgb.b = parseInt(b + b, 16);
+    }
+    return rgb;
+}
+/**
+ * Convert an RGB object to a hex color string in the format '#rrggbb'.
+ */
+function toHex(int) {
+    return `#${Math.round(int.r).toString(16)}${Math.round(int.g).toString(16)}${Math.round(int.b).toString(16)}`;
+}
+/** Returns the hex color string in the format '#rrggbb' */
+function getElevation(
+/** color in the format '#rrggbb' or '#rgb' */
+color, 
+/** overlay color in the format '#rrggbb' or '#rgb' */
+overlayColor, 
+/** elevation as an integer starting with 1 */
+elevation) {
+    const rgb = toInt(color);
+    const overlay = toInt(overlayColor);
+    rgb.r += overlay.r * (0.05 + step * (elevation - 1));
+    rgb.g += overlay.g * (0.05 + step * (elevation - 1));
+    rgb.b += overlay.b * (0.05 + step * (elevation - 1));
+    return toHex(rgb);
+}
+/**
+ * Get all 24 elevations of the given color and overlay.
+ *
+ * @param color color in the format '#rrggbb' or '#rgb'
+ * @param overlay overlay color in the format '#rrggbb' or '#rgb'
+ */
+function getElevations(color, overlay) {
+    const elevations = {};
+    for (let i = 1; i <= 24; i++) {
+        elevations[`elevation${i}`] = {
+            backgroundColor: getElevation(color, overlay, i),
+        };
+    }
+    return elevations;
+}
+/**
+ * The theme creation factory function.
+ */
+export function Theme(type, overrides) {
+    let options;
+    let localOverrides;
+    if (type === 'dark') {
+        localOverrides = {
+            MuiAppBar: {
+                colorDefault: {
+                    backgroundColor: '#272727',
+                },
+            },
+            MuiLink: {
+                root: {
+                    textTransform: 'uppercase',
+                    transition: 'color .3s ease',
+                    color: orange[200],
+                    '&:hover': {
+                        color: orange[100],
+                    },
+                },
+            },
+            MuiPaper: getElevations('#121212', '#fff'),
+        };
+        options = {
+            name: type,
+            palette: {
+                mode: 'dark',
+                background: {
+                    paper: '#121212',
+                    default: '#121212',
+                },
+                primary: {
+                    main: '#4dabf5',
+                },
+                secondary: {
+                    main: '#436a93',
+                },
+                expert: '#14bb00',
+                text: {
+                    primary: '#ffffff',
+                    secondary: '#ffffff',
+                },
+            },
+        };
+    }
+    else if (type === 'blue') {
+        localOverrides = {
+            MuiAppBar: {
+                colorDefault: {
+                    backgroundColor: '#3399CC',
+                },
+            },
+            MuiLink: {
+                root: {
+                    textTransform: 'uppercase',
+                    transition: 'color .3s ease',
+                    color: orange[400],
+                    '&:hover': {
+                        color: orange[300],
+                    },
+                },
+            },
+        };
+        options = {
+            name: type,
+            palette: {
+                mode: 'dark',
+                background: {
+                    paper: '#151d21',
+                    default: '#151d21',
+                },
+                primary: {
+                    main: '#4dabf5',
+                },
+                secondary: {
+                    main: '#436a93',
+                },
+                expert: '#14bb00',
+                text: {
+                    primary: '#ffffff',
+                    secondary: '#ffffff',
+                },
+            },
+        };
+    }
+    else if (type === 'colored') {
+        localOverrides = {
+            MuiAppBar: {
+                colorDefault: {
+                    backgroundColor: '#2a3135',
+                },
+            },
+            MuiLink: {
+                root: {
+                    textTransform: 'uppercase',
+                    transition: 'color .3s ease',
+                    color: orange[200],
+                    '&:hover': {
+                        color: orange[100],
+                    },
+                },
+            },
+            MuiPaper: getElevations('#151d21', '#fff'),
+        };
+        options = {
+            name: type,
+            palette: {
+                mode: 'light',
+                primary: {
+                    main: '#3399CC',
+                },
+                secondary: {
+                    main: '#164477',
+                },
+                expert: '#96fc96',
+            },
+        };
+    }
+    else if (type === 'PT') {
+        localOverrides = {
+            MuiAppBar: {
+                colorDefault: {
+                    backgroundColor: '#0F99DE',
+                },
+            },
+            MuiLink: {
+                root: {
+                    textTransform: 'uppercase',
+                    transition: 'color .3s ease',
+                    color: orange[400],
+                    '&:hover': {
+                        color: orange[300],
+                    },
+                },
+            },
+        };
+        options = {
+            name: type,
+            palette: {
+                mode: 'light',
+                primary: {
+                    main: '#0F99DE',
+                },
+                secondary: {
+                    main: '#88A536',
+                },
+                expert: '#BD1B24',
+            },
+        };
+    }
+    else if (type === 'DX') {
+        localOverrides = {
+            MuiAppBar: {
+                colorDefault: {
+                    backgroundColor: '#a9a9a9',
+                },
+            },
+            MuiLink: {
+                root: {
+                    textTransform: 'uppercase',
+                    transition: 'color .3s ease',
+                    color: orange[400],
+                    '&:hover': {
+                        color: orange[300],
+                    },
+                },
+            },
+        };
+        options = {
+            name: type,
+            palette: {
+                mode: 'light',
+                primary: {
+                    main: '#F5F5F7',
+                },
+                secondary: {
+                    main: '#a9a9a9',
+                },
+                expert: '#BD1B24',
+                text: {
+                    primary: '#007AFE',
+                    secondary: '#007AFE',
+                    disabled: '#007AFEAA',
+                },
+            },
+        };
+    }
+    else {
+        localOverrides = {
+            MuiLink: {
+                root: {
+                    textTransform: 'uppercase',
+                    transition: 'color .3s ease',
+                    color: orange[400],
+                    '&:hover': {
+                        color: orange[300],
+                    },
+                },
+            },
+        };
+        options = {
+            name: type,
+            palette: {
+                mode: 'light',
+                primary: {
+                    main: '#3399CC',
+                    dark: '#256c97',
+                    light: '#76d0fd',
+                },
+                secondary: {
+                    main: '#164477',
+                },
+                expert: '#14bb00',
+            },
+        };
+    }
+    options.toolbar = {
+        height: 48,
+    };
+    options.saveToolbar = {
+        background: options.palette?.primary?.main,
+        button: {
+            borderRadius: 3,
+            height: 32,
+        },
+    };
+    if (options.palette) {
+        options.palette.grey = {
+            main: grey[300],
+            dark: grey[400],
+        };
+    }
+    const theme = createTheme(options);
+    const palette = theme.palette;
+    return createTheme(theme, {
+        ...(overrides || undefined),
+        components: {
+            ...localOverrides,
+            MuiButton: {
+                variants: [
+                    {
+                        props: { variant: 'contained', color: 'grey' },
+                        style: {
+                            backgroundColor: palette.grey?.[300],
+                            color: palette.getContrastText && palette.grey?.[300]
+                                ? palette.getContrastText(palette.grey[300])
+                                : undefined,
+                        },
+                    },
+                    {
+                        props: { variant: 'outlined', color: 'grey' },
+                        style: {
+                            color: palette.text?.primary,
+                            borderColor: palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)',
+                            '&.Mui-disabled': {
+                                border: `1px solid ${palette.action?.disabledBackground}`,
+                            },
+                            '&:hover': {
+                                borderColor: palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)',
+                                backgroundColor: alpha(palette.text?.primary || '', palette.action?.hoverOpacity || 0.04),
+                            },
+                        },
+                    },
+                    {
+                        props: { variant: 'text', color: 'grey' },
+                        style: {
+                            color: palette.text?.primary,
+                            '&:hover': {
+                                backgroundColor: alpha(palette.text?.primary || '', palette.action?.hoverOpacity || 0.04),
+                            },
+                        },
+                    },
+                ],
+            },
+            ...(overrides?.components || undefined),
+        },
+    });
+}
+//# sourceMappingURL=Theme.js.map

package/build/Theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Theme.js","sourceRoot":"./src/","sources":["Theme.tsx"],"names":[],"mappings":"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","sourcesContent":["import { type CSSProperties } from 'react';\nimport { createTheme, alpha, type PaletteOptions as PaletteOptionsMui } from '@mui/material/styles';\nimport { orange, grey } from '@mui/material/colors';\n\nimport type { SimplePaletteColorOptions } from '@mui/material/styles/createPalette';\nimport type { ThemeOptions as ThemeOptionsMui } from '@mui/material/styles/createTheme';\nimport type { IobTheme, ThemeName, ThemeType } from './types';\n\nconst step = (16 - 5) / 23 / 100;\n\n/**\n * Convert hex color in the format '#rrggbb' or '#rgb' to an RGB object.\n */\nfunction toInt(hex: string): { r: number; g: number; b: number } {\n    const rgb: { r: number; g: number; b: number } = {\n        r: 0,\n        g: 0,\n        b: 0,\n    };\n\n    if (hex.length === 7) {\n        rgb.r = parseInt(hex.substring(1, 3), 16);\n        rgb.g = parseInt(hex.substring(3, 5), 16);\n        rgb.b = parseInt(hex.substring(5, 7), 16);\n    } else if (hex.length === 4) {\n        const r = hex[1];\n        const g = hex[2];\n        const b = hex[3];\n\n        rgb.r = parseInt(r + r, 16);\n        rgb.g = parseInt(g + g, 16);\n        rgb.b = parseInt(b + b, 16);\n    }\n\n    return rgb;\n}\n\n/**\n * Convert an RGB object to a hex color string in the format '#rrggbb'.\n */\nfunction toHex(int: { r: number; g: number; b: number }): string {\n    return `#${Math.round(int.r).toString(16)}${Math.round(int.g).toString(16)}${Math.round(int.b).toString(16)}`;\n}\n\n/** Returns the hex color string in the format '#rrggbb' */\nfunction getElevation(\n    /** color in the format '#rrggbb' or '#rgb' */\n    color: string,\n    /** overlay color in the format '#rrggbb' or '#rgb' */\n    overlayColor: string,\n    /** elevation as an integer starting with 1 */\n    elevation: number,\n): string {\n    const rgb: { r: number; g: number; b: number } = toInt(color);\n    const overlay: { r: number; g: number; b: number } = toInt(overlayColor);\n\n    rgb.r += overlay.r * (0.05 + step * (elevation - 1));\n    rgb.g += overlay.g * (0.05 + step * (elevation - 1));\n    rgb.b += overlay.b * (0.05 + step * (elevation - 1));\n\n    return toHex(rgb);\n}\n\n/**\n * Get all 24 elevations of the given color and overlay.\n *\n * @param color color in the format '#rrggbb' or '#rgb'\n * @param overlay overlay color in the format '#rrggbb' or '#rgb'\n */\nfunction getElevations(color: string, overlay: string): Record<string, CSSProperties> {\n    const elevations: Record<string, CSSProperties> = {};\n\n    for (let i = 1; i <= 24; i++) {\n        elevations[`elevation${i}`] = {\n            backgroundColor: getElevation(color, overlay, i),\n        };\n    }\n\n    return elevations;\n}\n\n// const buttonsPalette = () => ({\n//     palette: {\n//         // mode: \"dark\",\n//         grey: {\n//             main: grey[300],\n//             dark: grey[400],\n//         },\n//     },\n// });\n\n// const buttonsTheme = theme => ({\n//     components: {\n//         MuiButton: {\n//             variants: [\n//                 {\n//                     props: { variant: 'contained', color: 'grey' },\n//                     style: {\n//                         color: theme.palette.getContrastText(theme.palette.grey[300]),\n//                     },\n//                 },\n//                 {\n//                     props: { variant: 'outlined', color: 'grey' },\n//                     style: {\n//                         color: theme.palette.text.primary,\n//                         borderColor:\n//                             theme.palette.mode === 'light'\n//                                 ? 'rgba(0, 0, 0, 0.23)'\n//                                 : 'rgba(255, 255, 255, 0.23)',\n//                         '&.Mui-disabled': {\n//                             border: `1px solid ${theme.palette.action.disabledBackground}`,\n//                         },\n//                         '&:hover': {\n//                             borderColor:\n//                                 theme.palette.mode === 'light'\n//                                     ? 'rgba(0, 0, 0, 0.23)'\n//                                     : 'rgba(255, 255, 255, 0.23)',\n//                             backgroundColor: alpha(\n//                                 theme.palette.text.primary,\n//                                 theme.palette.action.hoverOpacity,\n//                             ),\n//                         },\n//                     },\n//                 },\n//                 {\n//                     props: { color: 'grey', variant: 'text' },\n//                     style: {\n//                         color: 'black',\n//                         '&:hover': {\n//                             backgroundColor: alpha(\n//                                 theme.palette.text.primary,\n//                                 theme.palette.action.hoverOpacity,\n//                             ),\n//                         },\n//                     },\n//                 },\n//             ],\n//         },\n//     },\n// });\n\ninterface PaletteOptions extends PaletteOptionsMui {\n    mode: ThemeType;\n    expert: string;\n    grey?: {\n        main?: string;\n        dark?: string;\n        50?: string;\n        100?: string;\n        200?: string;\n        300?: string;\n        400?: string;\n        500?: string;\n        600?: string;\n        700?: string;\n        800?: string;\n        900?: string;\n        A100?: string;\n        A200?: string;\n        A400?: string;\n        A700?: string;\n    };\n}\n\ninterface ThemeOptions extends ThemeOptionsMui {\n    name: ThemeName;\n    palette?: PaletteOptions;\n    toolbar?: CSSProperties;\n    saveToolbar?: {\n        background: string;\n        button: CSSProperties;\n    };\n}\n\n/**\n * The theme creation factory function.\n */\nexport function Theme(type: ThemeName, overrides?: Record<string, any>): IobTheme {\n    let options: ThemeOptions;\n    let localOverrides: Record<string, any>;\n\n    if (type === 'dark') {\n        localOverrides = {\n            MuiAppBar: {\n                colorDefault: {\n                    backgroundColor: '#272727',\n                },\n            },\n            MuiLink: {\n                root: {\n                    textTransform: 'uppercase',\n                    transition: 'color .3s ease',\n                    color: orange[200],\n                    '&:hover': {\n                        color: orange[100],\n                    },\n                },\n            },\n            MuiPaper: getElevations('#121212', '#fff'),\n        };\n\n        options = {\n            name: type,\n            palette: {\n                mode: 'dark',\n                background: {\n                    paper: '#121212',\n                    default: '#121212',\n                },\n                primary: {\n                    main: '#4dabf5',\n                },\n                secondary: {\n                    main: '#436a93',\n                },\n                expert: '#14bb00',\n                text: {\n                    primary: '#ffffff',\n                    secondary: '#ffffff',\n                },\n            },\n        };\n    } else if (type === 'blue') {\n        localOverrides = {\n            MuiAppBar: {\n                colorDefault: {\n                    backgroundColor: '#3399CC',\n                },\n            },\n            MuiLink: {\n                root: {\n                    textTransform: 'uppercase',\n                    transition: 'color .3s ease',\n                    color: orange[400],\n                    '&:hover': {\n                        color: orange[300],\n                    },\n                },\n            },\n        };\n\n        options = {\n            name: type,\n            palette: {\n                mode: 'dark',\n                background: {\n                    paper: '#151d21',\n                    default: '#151d21',\n                },\n                primary: {\n                    main: '#4dabf5',\n                },\n                secondary: {\n                    main: '#436a93',\n                },\n                expert: '#14bb00',\n                text: {\n                    primary: '#ffffff',\n                    secondary: '#ffffff',\n                },\n            },\n        };\n    } else if (type === 'colored') {\n        localOverrides = {\n            MuiAppBar: {\n                colorDefault: {\n                    backgroundColor: '#2a3135',\n                },\n            },\n            MuiLink: {\n                root: {\n                    textTransform: 'uppercase',\n                    transition: 'color .3s ease',\n                    color: orange[200],\n                    '&:hover': {\n                        color: orange[100],\n                    },\n                },\n            },\n            MuiPaper: getElevations('#151d21', '#fff'),\n        };\n\n        options = {\n            name: type,\n            palette: {\n                mode: 'light',\n                primary: {\n                    main: '#3399CC',\n                },\n                secondary: {\n                    main: '#164477',\n                },\n                expert: '#96fc96',\n            },\n        };\n    } else if (type === 'PT') {\n        localOverrides = {\n            MuiAppBar: {\n                colorDefault: {\n                    backgroundColor: '#0F99DE',\n                },\n            },\n            MuiLink: {\n                root: {\n                    textTransform: 'uppercase',\n                    transition: 'color .3s ease',\n                    color: orange[400],\n                    '&:hover': {\n                        color: orange[300],\n                    },\n                },\n            },\n        };\n\n        options = {\n            name: type,\n            palette: {\n                mode: 'light',\n                primary: {\n                    main: '#0F99DE',\n                },\n                secondary: {\n                    main: '#88A536',\n                },\n                expert: '#BD1B24',\n            },\n        };\n    } else if (type === 'DX') {\n        localOverrides = {\n            MuiAppBar: {\n                colorDefault: {\n                    backgroundColor: '#a9a9a9',\n                },\n            },\n            MuiLink: {\n                root: {\n                    textTransform: 'uppercase',\n                    transition: 'color .3s ease',\n                    color: orange[400],\n                    '&:hover': {\n                        color: orange[300],\n                    },\n                },\n            },\n        };\n\n        options = {\n            name: type,\n            palette: {\n                mode: 'light',\n                primary: {\n                    main: '#F5F5F7',\n                },\n                secondary: {\n                    main: '#a9a9a9',\n                },\n                expert: '#BD1B24',\n                text: {\n                    primary: '#007AFE',\n                    secondary: '#007AFE',\n                    disabled: '#007AFEAA',\n                },\n            },\n        };\n    } else {\n        localOverrides = {\n            MuiLink: {\n                root: {\n                    textTransform: 'uppercase',\n                    transition: 'color .3s ease',\n                    color: orange[400],\n                    '&:hover': {\n                        color: orange[300],\n                    },\n                },\n            },\n        };\n\n        options = {\n            name: type,\n            palette: {\n                mode: 'light',\n                primary: {\n                    main: '#3399CC',\n                    dark: '#256c97',\n                    light: '#76d0fd',\n                },\n                secondary: {\n                    main: '#164477',\n                },\n                expert: '#14bb00',\n            },\n        };\n    }\n\n    options.toolbar = {\n        height: 48,\n    };\n\n    options.saveToolbar = {\n        background: (options.palette?.primary as SimplePaletteColorOptions)?.main,\n        button: {\n            borderRadius: 3,\n            height: 32,\n        },\n    };\n\n    if (options.palette) {\n        options.palette.grey = {\n            main: grey[300],\n            dark: grey[400],\n        };\n    }\n\n    const theme: IobTheme = createTheme(options) as IobTheme;\n\n    const palette: PaletteOptions = theme.palette as PaletteOptions;\n\n    return createTheme(theme, {\n        ...(overrides || undefined),\n        components: {\n            ...localOverrides,\n            MuiButton: {\n                variants: [\n                    {\n                        props: { variant: 'contained', color: 'grey' },\n                        style: {\n                            backgroundColor: palette.grey?.[300],\n                            color:\n                                palette.getContrastText && palette.grey?.[300]\n                                    ? palette.getContrastText(palette.grey[300])\n                                    : undefined,\n                        },\n                    },\n                    {\n                        props: { variant: 'outlined', color: 'grey' },\n                        style: {\n                            color: palette.text?.primary,\n                            borderColor: palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)',\n                            '&.Mui-disabled': {\n                                border: `1px solid ${palette.action?.disabledBackground}`,\n                            },\n                            '&:hover': {\n                                borderColor:\n                                    palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)',\n                                backgroundColor: alpha(\n                                    palette.text?.primary || '',\n                                    palette.action?.hoverOpacity || 0.04,\n                                ),\n                            },\n                        },\n                    },\n                    {\n                        props: { variant: 'text', color: 'grey' },\n                        style: {\n                            color: palette.text?.primary,\n                            '&:hover': {\n                                backgroundColor: alpha(\n                                    palette.text?.primary || '',\n                                    palette.action?.hoverOpacity || 0.04,\n                                ),\n                            },\n                        },\n                    },\n                ],\n            },\n            ...(overrides?.components || undefined),\n        },\n    }) as IobTheme;\n}\n"]}

package/build/assets/devices/parseNames.js

@@ -0,0 +1,35 @@
+// this is a service script that extracts names from names.txt and places them into list.json
+/*
+const fs = require('fs');
+
+function readTxt(fileName) {
+    const text = fs.readFileSync(fileName).toString('utf8');
+    const lines = text.split('\n');
+    const langs = lines.shift().split('\t').map(l => l.toLowerCase().trim());
+
+    const result = {};
+    lines.forEach(line => {
+        const words = line.split('\t').map(w => w.trim());
+        const word = {};
+        result[words[0]] = word;
+        langs.forEach((lang, i) => {
+            word[lang] = words[i];
+        });
+    });
+    return result;
+}
+
+function mergeTexts(jsonFileName, words) {
+    const file = require(jsonFileName);
+    file.forEach(item => {
+        if (typeof item.name === 'string' && words[item.name]) {
+            item.name = words[item.name];
+        }
+    });
+    fs.writeFileSync(jsonFileName, JSON.stringify(file, null, 2));
+}
+
+const words = readTxt(__dirname + '/names.txt');
+mergeTexts(__dirname + '/list.json', words);
+*/
+//# sourceMappingURL=parseNames.js.map

package/build/assets/devices/parseNames.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"parseNames.js","sourceRoot":"./src/","sources":["assets/devices/parseNames.js"],"names":[],"mappings":"AAAA,6FAA6F;AAC7F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgCE","sourcesContent":["// this is a service script that extracts names from names.txt and places them into list.json\r\n/*\r\nconst fs = require('fs');\r\n\r\nfunction readTxt(fileName) {\r\n    const text = fs.readFileSync(fileName).toString('utf8');\r\n    const lines = text.split('\\n');\r\n    const langs = lines.shift().split('\\t').map(l => l.toLowerCase().trim());\r\n\r\n    const result = {};\r\n    lines.forEach(line => {\r\n        const words = line.split('\\t').map(w => w.trim());\r\n        const word = {};\r\n        result[words[0]] = word;\r\n        langs.forEach((lang, i) => {\r\n            word[lang] = words[i];\r\n        });\r\n    });\r\n    return result;\r\n}\r\n\r\nfunction mergeTexts(jsonFileName, words) {\r\n    const file = require(jsonFileName);\r\n    file.forEach(item => {\r\n        if (typeof item.name === 'string' && words[item.name]) {\r\n            item.name = words[item.name];\r\n        }\r\n    });\r\n    fs.writeFileSync(jsonFileName, JSON.stringify(file, null, 2));\r\n}\r\n\r\nconst words = readTxt(__dirname + '/names.txt');\r\nmergeTexts(__dirname + '/list.json', words);\r\n*/\r\n"]}