feat: add dropdown component with appearance options and styles

apps/isa-app/stories/ui/input-controls/dropdown-button.stories.ts

@@ -0,0 +1,57 @@
+import {
+  DropdownAppearance,
+  DropdownButtonComponent,
+  DropdownOptionAppearance,
+  DropdownOptionComponent,
+} from '@isa/ui/input-controls';
+import { type Meta, type StoryObj, argsToTemplate, moduleMetadata } from '@storybook/angular';
+
+type DropdownInputProps = {
+  value: string;
+  label: string;
+  appearance: DropdownAppearance;
+  optionAppearance: DropdownOptionAppearance;
+};
+
+const meta: Meta<DropdownInputProps> = {
+  title: 'ui/input-controls/Dropdown',
+  decorators: [
+    moduleMetadata({
+      imports: [DropdownButtonComponent, DropdownOptionComponent],
+    }),
+  ],
+  argTypes: {
+    value: { control: 'text' },
+    label: { control: 'text' },
+    appearance: {
+      control: 'select',
+      options: Object.values(DropdownAppearance),
+    },
+    optionAppearance: {
+      control: 'select',
+      options: Object.values(DropdownOptionAppearance),
+    },
+  },
+  render: (args) => ({
+    props: args,
+    template: `
+        <ui-dropdown ${argsToTemplate(args)}>
+            <ui-dropdown-option value="">Select an option</ui-dropdown-option>
+            <ui-dropdown-option value="1">Option 1</ui-dropdown-option>
+            <ui-dropdown-option value="2">Option 2</ui-dropdown-option>
+            <ui-dropdown-option value="3">Option 3</ui-dropdown-option>
+        </ui-dropdown>
+    `,
+  }),
+};
+
+export default meta;
+
+type Story = StoryObj<DropdownInputProps>;
+
+export const Default: Story = {
+  args: {
+    value: undefined,
+    label: 'Label',
+  },
+};