Merge pull request #270 from dabapps/collapse-fixes-v2-0.8.x

Collapse fixes v2 0.8.x
dabapps · Sep 18, 2018 · f3e7aff · f3e7aff
2 parents 6fc12e3 + c7736de
commit f3e7aff
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 33 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -2,5 +2,8 @@
   "extends": [
     "dabapps/base",
     "dabapps/commonjs"
-  ]
+  ],
+  "rules": {
+    "prettier/prettier": 0
+  }
 }
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@dabapps/roe",
-  "version": "0.8.37",
+  "version": "0.8.38",
   "description": "A Collection of React Components for Project Development",
   "main": "dist/js/index.js",
   "types": "dist/js/index.d.ts",
@@ -71,7 +71,7 @@
     "enzyme-adapter-react-15": "1.0.5",
     "enzyme-to-json": "3.2.2",
     "eslint": "3.19.0",
-    "eslint-config-dabapps": "github:dabapps/eslint-config-dabapps",
+    "eslint-config-dabapps": "github:dabapps/eslint-config-dabapps#v4.0.0",
     "http-server": "0.9.0",
     "jest": "20.0.3",
     "less-loader": "4.0.5",

diff --git a/src/ts/components/collapse.tsx b/src/ts/components/collapse.tsx
@@ -122,7 +122,7 @@ export class Collapse extends PureComponent<CollapseProps, CollapseState> {
       fadeHeight = DEFAULT_FADE_HEIGHT,
       open,
       maxCollapsedHeight,
-      minHeight = 'auto',
+      minHeight = null,
       animationDuration = DEFAULT_DURATION,
       component: Component = 'div',
       ...remainingProps
@@ -132,7 +132,7 @@ export class Collapse extends PureComponent<CollapseProps, CollapseState> {
 
     const collapseStyle = {
       minHeight,
-      maxHeight: opened ? 'auto' : height,
+      maxHeight: opened ? null : height,
       position: 'relative' as 'relative',
       overflow: 'hidden' as 'hidden',
       transition: `ease-in-out ${animationDuration}ms max-height`

diff --git a/tests/__snapshots__/collapse.tsx.snap b/tests/__snapshots__/collapse.tsx.snap
@@ -10,8 +10,8 @@ exports[`Collapse should close to custom height 1`] = `
     className="clearfix collapse collapse-open"
     style={
       Object {
-        "maxHeight": "auto",
-        "minHeight": "auto",
+        "maxHeight": null,
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -32,7 +32,7 @@ exports[`Collapse should close to custom height 2`] = `
     style={
       Object {
         "maxHeight": 500,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -68,7 +68,7 @@ exports[`Collapse should close to custom height 3`] = `
     style={
       Object {
         "maxHeight": 100,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -104,7 +104,7 @@ exports[`Collapse should close to custom height 4`] = `
     style={
       Object {
         "maxHeight": 100,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -138,8 +138,8 @@ exports[`Collapse should close to default height 1`] = `
     className="clearfix collapse collapse-open"
     style={
       Object {
-        "maxHeight": "auto",
-        "minHeight": "auto",
+        "maxHeight": null,
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -159,7 +159,7 @@ exports[`Collapse should close to default height 2`] = `
     style={
       Object {
         "maxHeight": 500,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -194,7 +194,7 @@ exports[`Collapse should close to default height 3`] = `
     style={
       Object {
         "maxHeight": 0,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -229,7 +229,7 @@ exports[`Collapse should close to default height 4`] = `
     style={
       Object {
         "maxHeight": 0,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -260,7 +260,7 @@ exports[`Collapse should match snapshot when collapsed 1`] = `
   style={
     Object {
       "maxHeight": 0,
-      "minHeight": "auto",
+      "minHeight": null,
       "overflow": "hidden",
       "position": "relative",
       "transition": "ease-in-out 200ms max-height",
@@ -274,8 +274,8 @@ exports[`Collapse should match snapshot when expanded 1`] = `
   className="clearfix collapse collapse-open"
   style={
     Object {
-      "maxHeight": "auto",
-      "minHeight": "auto",
+      "maxHeight": null,
+      "minHeight": null,
       "overflow": "hidden",
       "position": "relative",
       "transition": "ease-in-out 200ms max-height",
@@ -290,7 +290,7 @@ exports[`Collapse should match snapshot with custom animation duration 1`] = `
   style={
     Object {
       "maxHeight": 0,
-      "minHeight": "auto",
+      "minHeight": null,
       "overflow": "hidden",
       "position": "relative",
       "transition": "ease-in-out 100ms max-height",
@@ -305,7 +305,7 @@ exports[`Collapse should match snapshot with custom collapsed height 1`] = `
   style={
     Object {
       "maxHeight": 100,
-      "minHeight": "auto",
+      "minHeight": null,
       "overflow": "hidden",
       "position": "relative",
       "transition": "ease-in-out 200ms max-height",
@@ -335,7 +335,7 @@ exports[`Collapse should match snapshot with customized fade out 1`] = `
   style={
     Object {
       "maxHeight": 0,
-      "minHeight": "auto",
+      "minHeight": null,
       "overflow": "hidden",
       "position": "relative",
       "transition": "ease-in-out 200ms max-height",
@@ -365,7 +365,7 @@ exports[`Collapse should match snapshot with fade out 1`] = `
   style={
     Object {
       "maxHeight": 0,
-      "minHeight": "auto",
+      "minHeight": null,
       "overflow": "hidden",
       "position": "relative",
       "transition": "ease-in-out 200ms max-height",
@@ -400,7 +400,7 @@ exports[`Collapse should open from custom height 1`] = `
     style={
       Object {
         "maxHeight": 100,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -436,7 +436,7 @@ exports[`Collapse should open from custom height 2`] = `
     style={
       Object {
         "maxHeight": 100,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -472,7 +472,7 @@ exports[`Collapse should open from custom height 3`] = `
     style={
       Object {
         "maxHeight": 500,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -507,8 +507,8 @@ exports[`Collapse should open from custom height 4`] = `
     className="clearfix collapse collapse-open"
     style={
       Object {
-        "maxHeight": "auto",
-        "minHeight": "auto",
+        "maxHeight": null,
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -528,7 +528,7 @@ exports[`Collapse should open from default height 1`] = `
     style={
       Object {
         "maxHeight": 0,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -563,7 +563,7 @@ exports[`Collapse should open from default height 2`] = `
     style={
       Object {
         "maxHeight": 0,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -598,7 +598,7 @@ exports[`Collapse should open from default height 3`] = `
     style={
       Object {
         "maxHeight": 500,
-        "minHeight": "auto",
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -632,8 +632,8 @@ exports[`Collapse should open from default height 4`] = `
     className="clearfix collapse collapse-open"
     style={
       Object {
-        "maxHeight": "auto",
-        "minHeight": "auto",
+        "maxHeight": null,
+        "minHeight": null,
         "overflow": "hidden",
         "position": "relative",
         "transition": "ease-in-out 200ms max-height",
@@ -649,7 +649,7 @@ exports[`Collapse should take regular element attributes 1`] = `
   style={
     Object {
       "maxHeight": 0,
-      "minHeight": "auto",
+      "minHeight": null,
       "overflow": "hidden",
       "position": "relative",
       "transition": "ease-in-out 200ms max-height",