0.1.21

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@intended/intended-ui",
-  "version": "0.1.19",
+  "version": "0.1.21",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@intended/intended-ui",
-      "version": "0.1.19",
+      "version": "0.1.21",
       "license": "MIT",
       "dependencies": {
         "polished": "^4.1.3",

package.json

@@ -2,7 +2,7 @@
   "name": "@intended/intended-ui",
   "description": "Storybook UI library for Intended Link",
   "license": "MIT",
-  "version": "0.1.19",
+  "version": "0.1.21",
   "private": false,
   "main": "dist/index.js",
   "repository": "https://git.silentsilas.com/Intended/attendant.git",

src/stories/Select.stories.tsx

@@ -16,4 +16,10 @@ const Template: ComponentStory<typeof Select> = (args: SelectProps) => (
 );
 
 export const Default = Template.bind({});
-Default.args = { id: "testId" };
+Default.args = { 
+  children: [
+    "<option value='github'>Github</option>",
+    "<option value='facebook'>Facebook</option>"
+  ],
+  id: "testId" 
+};

src/stories/Select.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from "react";
+import React, { FC, ReactNode } from "react";
 import styled from "styled-components";
 import CSS from "csstype";
 
@@ -11,18 +11,17 @@ import {
 } from "../shared/styles";
 
 export interface SelectProps {
+  children: ReactNode | null;
   style?: CSS.Properties;
   id: string;
   value?: string;
   onChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
 }
 
-const Select: FC<SelectProps> = ({ style, id, value = "github", onChange }) => {
+const Select: FC<SelectProps> = ({ children, style, id, value = "github", onChange }) => {
   return (
     <StyledSelect style={style} id={id} value={value} onChange={onChange}>
-      <option value="github">Github</option>
-      <option value="facebook">Facebook</option>
-      <option value="Google">Google</option>
+      { children }
     </StyledSelect>
   );
 };