diff --git a/packages/core/lib/components/Masthead.tsx b/packages/core/lib/components/Masthead.tsx new file mode 100644 index 0000000..cd69fdb --- /dev/null +++ b/packages/core/lib/components/Masthead.tsx @@ -0,0 +1,68 @@ +import { colors } from "../colors/color"; +import { Label } from "./Label"; + +export type MastheadProps = { + className?: string; +} & React.ComponentPropsWithoutRef; + +export const Masthead = ({ + className = "", + ...props +}: MastheadProps) => { + const flagStyle = { + display: "inline-block", + width: 24, + height: 16, + }; + + return ( +
+
+ + +
+
+ ); +}; + +const RepublicOfKoreaFlagIcon: React.FC<{ style?: React.CSSProperties }> = ({ + style, +}) => ( + + + + + + + + + + + +); diff --git a/packages/core/lib/index.ts b/packages/core/lib/index.ts index 758c821..e4ef997 100644 --- a/packages/core/lib/index.ts +++ b/packages/core/lib/index.ts @@ -28,6 +28,7 @@ import { Pagination } from "./components/Pagination"; import { FileUpload } from "./components/FileUpload"; import { Calendar } from "./components/Calendar"; import { Select } from "./components/Select"; +import { Masthead } from "./components/Masthead"; export { Display, Heading, Title, Body, Detail, Label, Link, colors }; export { @@ -51,4 +52,5 @@ export { FileUpload, Calendar, Select, + Masthead, }; diff --git a/stories/core/Masthead.stories.ts b/stories/core/Masthead.stories.ts new file mode 100644 index 0000000..33bead7 --- /dev/null +++ b/stories/core/Masthead.stories.ts @@ -0,0 +1,16 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { fn } from "@storybook/test"; +import { Masthead } from "../../packages/core/lib"; + +const meta = { + title: "Components/Masthead", + component: Masthead, + tags: ["autodocs"], +} satisfies Meta; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + args: {}, +};