docs: styles & property name fix

purescraps · May 18, 2024 · 2bc484b · 2bc484b
1 parent ea45f36
commit 2bc484b
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git a/docs/src/Playground.tsx b/docs/src/Playground.tsx
@@ -15,6 +15,7 @@ import {
 } from '@mantine/core';
 import { Editor, useMonaco } from '@monaco-editor/react';
 import {
+  IconFileExport,
   IconHtml,
   IconJson,
   IconSettingsAutomation,
@@ -33,7 +34,7 @@ export function Playground() {
   const [html, setHtml] = useState('');
   const [htmlFileContents, setHtmlFileContents] = useState<string | null>(null);
   const { configIsValid, result } = usePureHtml({
-    inputHTML: htmlFileContents ?? html,
+    inputHtml: htmlFileContents ?? html,
     configYaml: config,
   });
   const onHtmlFileChange = useCallback(
@@ -124,9 +125,10 @@ export function Playground() {
                   <FileInput
                     accept="text/html"
                     clearable
-                    label="Select an HTML file"
+                    placeholder="Select a file"
                     m="sm"
-                    mt="0"
+                    mt="xs"
+                    leftSection={<IconFileExport />}
                     onChange={onHtmlFileChange}
                   />
                 </Paper>

diff --git a/docs/src/hooks/usePureHtml.ts b/docs/src/hooks/usePureHtml.ts
@@ -10,10 +10,10 @@ export interface UsePureHtml {
 }
 
 export function usePureHtml({
-  inputHTML,
+  inputHtml,
   configYaml,
 }: {
-  inputHTML: string;
+  inputHtml: string;
   configYaml: string;
 }): UsePureHtml {
   const [state, setState] = useState<UsePureHtml>({
@@ -22,8 +22,8 @@ export function usePureHtml({
   });
   // cache cheerio.load call for handling big HTMLs
   const input = useMemo<cheerio.Root | null>(
-    () => (inputHTML ? load(inputHTML) : null),
-    [inputHTML]
+    () => (inputHtml ? load(inputHtml) : null),
+    [inputHtml]
   );
   const [config, setConfig] = useState<unknown>(null);