chore: import upstream snapshot with attribution

2026-07-13 13:32:57 +08:00
commit cd420f9332
4811 changed files with 884702 additions and 0 deletions
@@ -0,0 +1,89 @@
+import { MagnifyingGlassIcon } from "@heroicons/react/20/solid";
+import { Form } from "@remix-run/react";
+import { MainCenteredContainer } from "~/components/layout/AppLayout";
+import { Fieldset } from "~/components/primitives/Fieldset";
+import { Input } from "~/components/primitives/Input";
+import { InputGroup } from "~/components/primitives/InputGroup";
+import { Label } from "~/components/primitives/Label";
+import { ShortcutKey } from "~/components/primitives/ShortcutKey";
+
+export default function Story() {
+  return (
+    <MainCenteredContainer>
+      <div>
+        <Form>
+          <Fieldset>
+            <InputGroup>
+              <Label>Medium search input</Label>
+              <Input
+                placeholder="Search"
+                required={true}
+                icon={MagnifyingGlassIcon}
+                accessory={
+                  <ShortcutKey shortcut={{ key: "k", modifiers: ["meta"] }} variant="small" />
+                }
+              />
+            </InputGroup>
+
+            <InputGroup>
+              <Label>Small search input</Label>
+              <Input
+                placeholder="Search"
+                required={true}
+                variant="small"
+                icon={MagnifyingGlassIcon}
+                accessory={
+                  <ShortcutKey shortcut={{ key: "k", modifiers: ["meta"] }} variant="small" />
+                }
+                fullWidth={false}
+              />
+            </InputGroup>
+            <InputGroup>
+              <Label>Tertiary search input</Label>
+              <Input
+                placeholder="Search"
+                required={true}
+                variant="tertiary"
+                icon={MagnifyingGlassIcon}
+                fullWidth={false}
+              />
+            </InputGroup>
+            <InputGroup>
+              <Label variant="small">This is a small label</Label>
+              <Input
+                placeholder="Search"
+                required={true}
+                icon={MagnifyingGlassIcon}
+                accessory={
+                  <ShortcutKey shortcut={{ key: "k", modifiers: ["meta"] }} variant="small" />
+                }
+              />
+            </InputGroup>
+            <InputGroup>
+              <Label variant="medium">This is a medium label</Label>
+              <Input
+                placeholder="Search"
+                required={true}
+                icon={MagnifyingGlassIcon}
+                accessory={
+                  <ShortcutKey shortcut={{ key: "k", modifiers: ["meta"] }} variant="small" />
+                }
+              />
+            </InputGroup>
+            <InputGroup>
+              <Label variant="large">This is a large label</Label>
+              <Input
+                placeholder="Search"
+                required={true}
+                icon={MagnifyingGlassIcon}
+                accessory={
+                  <ShortcutKey shortcut={{ key: "k", modifiers: ["meta"] }} variant="small" />
+                }
+              />
+            </InputGroup>
+          </Fieldset>
+        </Form>
+      </div>
+    </MainCenteredContainer>
+  );
+}