fix(select): enable defaultValue to work correctly by removing rehydr…

…ation hack

package.json

@@ -6,7 +6,12 @@
   "author": "Twilio Inc.",
   "license": "MIT",
   "workspaces": {
-    "packages": ["apps/**/*", "packages/**/*", "templates/**/*", "!packages/paste-core/core-bundle/**/*"]
+    "packages": [
+      "apps/**/*",
+      "packages/**/*",
+      "templates/**/*",
+      "!packages/paste-core/core-bundle/**/*"
+    ]
   },
   "types": "./types/index.d.ts",
   "engines": {
@@ -228,5 +233,9 @@
     }
   },
   "packageManager": "[email protected]",
-  "browserslist": ["last 2 versions", "not dead", "not IE 11"]
+  "browserslist": [
+    "last 2 versions",
+    "not dead",
+    "not IE 11"
+  ]
 }

packages/paste-core/components/select/src/Select.tsx

@@ -82,11 +82,6 @@ const Select = React.forwardRef<HTMLSelectElement, SelectProps>(
     },
     ref,
   ) => {
-    const [showOptions, setShowOptions] = React.useState(false);
-    React.useEffect(() => {
-      setShowOptions(true);
-    }, []);
-
     return (
       <InputBox
         disabled={disabled}
@@ -108,7 +103,7 @@ const Select = React.forwardRef<HTMLSelectElement, SelectProps>(
             size={multiple ? size : 0}
             variant={variant}
           >
-            {showOptions && children}
+            {children}
           </SelectElement>
           {!multiple && (
             <InputChevronWrapper element={`${element}_CHEVRON_WRAPPER`}>

packages/paste-core/components/select/stories/select.stories.tsx

@@ -45,9 +45,24 @@ export const DefaultSelect = (): React.ReactNode => {
     </>
   );
 };
-
 DefaultSelect.storyName = "Select";
 
+export const DefaultValueSelect = (): React.ReactNode => {
+  const uid = useUID();
+  return (
+    <>
+      <Label htmlFor={uid}>Label</Label>
+      <Select id={uid} defaultValue="option-2" onFocus={action("handleFocus")} onBlur={action("handleBlur")}>
+        <Option value="option-1">Option 1</Option>
+        <Option value="option-2">Option 2</Option>
+        <Option value="option-3">Option 3</Option>
+        <Option value="option-4">Option 4</Option>
+      </Select>
+      <HelpText>Info that helps a user with this field.</HelpText>
+    </>
+  );
+};
+
 export const SelectRequired = (): React.ReactNode => {
   const uid = useUID();
   const [value, setValue] = React.useState("Select - Required");