docs: update visually-hidden

trendmicro-frontend · Nov 19, 2023 · eb356cf · eb356cf
1 parent e13b11e
commit eb356cf
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 8 deletions.
diff --git a/packages/react-docs/pages/components/visually-hidden/basic.js b/packages/react-docs/pages/components/visually-hidden/basic.js
@@ -0,0 +1,13 @@
+import { Button, Icon, VisuallyHidden } from '@tonic-ui/react';
+import React from 'react';
+
+const App = () => (
+  <Button variant="secondary">
+    <VisuallyHidden>
+      Checkmark
+    </VisuallyHidden>
+    <Icon icon="check" />
+  </Button>
+);
+
+export default App;
diff --git a/...pages/components/visually-hidden.page.mdx → ...components/visually-hidden/index.page.mdx b/...pages/components/visually-hidden.page.mdx → ...components/visually-hidden/index.page.mdx
@@ -12,14 +12,7 @@ import { VisuallyHidden } from '@tonic-ui/react';
 
 The text `Checkmark` is visually hidden from the icon button, but it is still readable by screen readers.
 
-```jsx
-<Button variant="secondary">
-  <VisuallyHidden>
-    Checkmark
-  </VisuallyHidden>
-  <Icon icon="check" />
-</Button>
-```
+{render('./basic')}
 
 ## Props