Updated the existing InputLabel story to include an required label.

danskernesdigitalebibliotek · Jul 12, 2024 · feb31d2 · feb31d2
1 parent 75940ea
commit feb31d2
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/src/stories/Library/input-label/InputLabel.stories.tsx b/src/stories/Library/input-label/InputLabel.stories.tsx
@@ -11,6 +11,9 @@ export default {
     text: {
       defaultValue: "Her er en label",
     },
+    required: {
+      defaultValue: false,
+    },
   },
   parameters: {
     layout: "padded",
@@ -22,3 +25,10 @@ const Template: ComponentStory<DropdownProps> = (args) => (
 );
 
 export const InputLabel = Template.bind({});
+
+export const RequiredInputLabel = Template.bind({});
+
+RequiredInputLabel.args = {
+  text: "Her er en required label",
+  required: true,
+};
diff --git a/src/stories/Library/input-label/InputLabel.tsx b/src/stories/Library/input-label/InputLabel.tsx
@@ -1,7 +1,9 @@
 export type InputLabelProps = {
   text: string;
+  required?: boolean;
 };
 
-export const InputLabel: React.FC<InputLabelProps> = ({ text }) => {
-  return <label className="input-label">{text}</label>;
+export const InputLabel: React.FC<InputLabelProps> = ({ text, required }) => {
+  const labelClass = `input-label ${required ? "input-label--required" : ""}`;
+  return <label className={labelClass}>{text}</label>;
 };