Merge pull request #2454 from coingaming/MDS-722

fix: add Loader to Docs, align colours [MDS-722]
coingaming · Oct 31, 2023 · fbefb96 · fbefb96
2 parents 699f81c + 7e31ad1
commit fbefb96
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 0 deletions.
diff --git a/docs/app/components/server/loader/description.md b/docs/app/components/server/loader/description.md
@@ -0,0 +1 @@
+Loaders provide a visual cue that an action is processing awaiting a course of change or a result.
diff --git a/docs/app/components/server/loader/examples/Default.tsx b/docs/app/components/server/loader/examples/Default.tsx
@@ -0,0 +1,5 @@
+import Loader from '@heathmont/moon-base-tw/lib/loader/Loader';
+
+export const Default = () => <Loader />;
+
+export default Default;
diff --git a/docs/app/components/server/loader/page.tsx b/docs/app/components/server/loader/page.tsx
@@ -0,0 +1,22 @@
+import { Default } from '@/app/components/server/loader/examples/Default';
+import ExampleSection from '@/app/components/shared/ExampleSection';
+import QuickNav from '@/app/components/shared/QuickNav';
+import { getExamples } from '@/app/utils/getExamples';
+import { MDX } from '@/components/MDX';
+
+export default async function Home() {
+  const { server } = await getExamples();
+  const examplesList = Object.keys(server.loader.examples);
+  return (
+    <div className="w-full max-w-7xl flex flex-col gap-4 text-moon-14">
+      <h1 className="font-medium text-moon-32">Loader</h1>
+      <MDX markdown={server.loader.description} />
+      <QuickNav items={examplesList} />
+      <ExampleSection
+        title="Default"
+        component={<Default />}
+        code={server.loader.examples.Default}
+      />
+    </div>
+  );
+}
diff --git a/docs/app/components/types.ts b/docs/app/components/types.ts
@@ -48,6 +48,12 @@ export interface Examples {
         Default: 'string';
       };
     };
+    loader: {
+      description: 'string';
+      examples: {
+        Default: 'string';
+      };
+    };
     tag: {
       description: 'string';
       examples: {
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		Loaders provide a visual cue that an action is processing awaiting a course of change or a result.