@nteract/stateful-components - npm Package Compare versions

Comparing version 1.7.8 to 1.7.9

lib/outputs/index.d.ts

 import Immutable from "immutable";
 import React from "react";
 import { AppState, ContentRef } from "@nteract/core";
+declare type ScrolledValue = boolean | "auto";
 interface ComponentProps {
@@ -11,7 +12,17 @@ id: string;
     hidden: boolean;
-    expanded: boolean;
+    scrolledValue: ScrolledValue;
     outputs: Immutable.List<any>;
 }
-export declare class Outputs extends React.PureComponent<ComponentProps & StateProps> {
+declare type Props = ComponentProps & StateProps;
+interface State {
+    scrolledValueForAutoScroll: boolean;
+}
+export declare class Outputs extends React.PureComponent<Props, State> {
+    private readonly wrapperRef;
+    constructor(props: Props);
     render(): JSX.Element;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: Props, prevState: State): void;
+    updateScrolledValueForAutoScroll(): void;
+    autoScrollShouldScroll(heightOfOutputs: number): boolean;
 }
@@ -18,0 +29,0 @@ export declare const makeMapStateToProps: (initialState: AppState, ownProps: ComponentProps) => (state: AppState) => StateProps;

lib/outputs/index.js

@@ -12,7 +12,40 @@ "use strict";
 const outputs_1 = require("@nteract/outputs");
+const AUTO_SCROLL_HEIGHT_THRESHOLD = 1800;
 class Outputs extends react_1.default.PureComponent {
+    constructor(props) {
+        super(props);
+        this.state = { scrolledValueForAutoScroll: false };
+        this.wrapperRef = react_1.default.createRef();
+    }
     render() {
-        const { outputs, children, hidden, expanded } = this.props;
-        return (react_1.default.createElement("div", { className: `nteract-cell-outputs ${hidden ? "hidden" : ""} ${expanded ? "expanded" : ""}` }, outputs.map((output, index) => (react_1.default.createElement(outputs_1.Output, { output: output, key: index }, children)))));
+        const { outputs, children, hidden, scrolledValue } = this.props;
+        const computedScrolledValue = scrolledValue == "auto" ? this.state.scrolledValueForAutoScroll : scrolledValue;
+        const expanded = !computedScrolledValue;
+        return (react_1.default.createElement("div", { className: `nteract-cell-outputs ${hidden ? "hidden" : ""} ${expanded ? "expanded" : ""}`, ref: this.wrapperRef }, outputs.map((output, index) => (react_1.default.createElement(outputs_1.Output, { output: output, key: index }, children)))));
     }
+    componentDidMount() {
+        this.updateScrolledValueForAutoScroll();
+    }
+    componentDidUpdate(prevProps, prevState) {
+        this.updateScrolledValueForAutoScroll();
+    }
+    updateScrolledValueForAutoScroll() {
+        if (this.props.scrolledValue !== "auto") {
+            return;
+        }
+        const wrapperDiv = this.wrapperRef.current;
+        if (!wrapperDiv) {
+            return;
+        }
+        // Using scrollHeight instead of offsetHeight to avoid adding another wrapper div.
+        // "scrollHeight is a measurement of the height of an element's content, including content not visible on the screen due to overflow"
+        const heightOfOutputs = wrapperDiv.scrollHeight;
+        const shouldScroll = this.autoScrollShouldScroll(heightOfOutputs);
+        if (shouldScroll !== this.state.scrolledValueForAutoScroll) {
+            this.setState({ scrolledValueForAutoScroll: shouldScroll });
+        }
+    }
+    autoScrollShouldScroll(heightOfOutputs) {
+        return heightOfOutputs >= AUTO_SCROLL_HEIGHT_THRESHOLD;
+    }
 }
@@ -24,3 +57,3 @@ exports.Outputs = Outputs;
         let hidden = false;
-        let expanded = false;
+        let scrolledValue = "auto";
         const { contentRef, id } = ownProps;
@@ -35,8 +68,14 @@ const model = core_1.selectors.model(state, { contentRef });
                         cell.getIn(["metadata", "jupyter", "outputs_hidden"]);
-                expanded =
-                    cell.cell_type === "code" &&
-                        cell.getIn(["metadata", "collapsed"]) === false;
+                if (cell.cell_type === "code") {
+                    const rawScrolledValue = cell.getIn(["metadata", "scrolled"]);
+                    if (rawScrolledValue === true || rawScrolledValue === false) {
+                        scrolledValue = rawScrolledValue;
+                    }
+                    else {
+                        scrolledValue = "auto";
+                    }
+                }
             }
         }
-        return { outputs, hidden, expanded };
+        return { outputs, hidden, scrolledValue };
     };
@@ -43,0 +82,0 @@ return mapStateToProps;

package.json

 {
   "name": "@nteract/stateful-components",
-  "version": "1.7.8",
+  "version": "1.7.9",
   "description": "A collection of sub-components pre-connected to nteract's Redux state",
@@ -10,2 +10,5 @@ "keywords": [
   ],
+  "scripts": {
+    "release": "semantic-release -e semantic-release-monorepo --tag-format='@nteract/stateful-components@${version}'"
+  },
   "author": "Safia Abdalla <[e-mail]>",
@@ -23,9 +26,9 @@ "homepage": "https://github.com/nteract/nteract/tree/master/packages/stateful-components#readme",
   "dependencies": {
-    "@nteract/commutable": "^7.4.4",
-    "@nteract/core": "^15.1.8",
-    "@nteract/fixtures": "^2.3.18",
+    "@nteract/commutable": "^7.4.5",
+    "@nteract/core": "^15.1.9",
+    "@nteract/fixtures": "^2.3.19",
     "@nteract/markdown": "4.6.1",
-    "@nteract/mythic-configuration": "^1.0.10",
+    "@nteract/mythic-configuration": "^1.0.11",
     "@nteract/outputs": "^3.0.11",
-    "@nteract/presentational-components": "^3.4.10",
+    "@nteract/presentational-components": "^3.4.11",
     "immutable": "^4.0.0-rc.12",
@@ -37,3 +40,79 @@ "redux": "^4.0.4"
   },
-  "gitHead": "439bd2af1bdc4f15b32d0a5314bb36fc1a858f55"
+  "release": {
+    "plugins": [
+      [
+        "@semantic-release/commit-analyzer",
+        {
+          "preset": "conventionalcommits"
+        }
+      ],
+      [
+        "@semantic-release/release-notes-generator",
+        {
+          "preset": "conventionalcommits",
+          "presetConfig": {
+            "header": "Release Notes",
+            "types": [
+              {
+                "type": "feat",
+                "section": "Features"
+              },
+              {
+                "type": "fix",
+                "section": "Bug Fixes"
+              },
+              {
+                "type": "chore",
+                "hidden": true
+              },
+              {
+                "type": "docs",
+                "hidden": true
+              },
+              {
+                "type": "style",
+                "hidden": true
+              },
+              {
+                "type": "refactor",
+                "hidden": true
+              },
+              {
+                "type": "perf",
+                "hidden": true
+              },
+              {
+                "type": "test",
+                "hidden": true
+              }
+            ]
+          },
+          "parserOpts": {
+            "noteKeywords": [
+              "BREAKING CHANGE",
+              "BREAKING CHANGES",
+              "BREAKING"
+            ]
+          },
+          "writerOpts": {
+            "commitsSort": [
+              "subject",
+              "scope"
+            ]
+          }
+        }
+      ],
+      "@semantic-release/npm",
+      [
+        "@semantic-release/git",
+        {
+          "assets": [
+            "package.json"
+          ],
+          "message": "chore(release): ${nextRelease.version}"
+        }
+      ]
+    ]
+  },
+  "gitHead": "53c6d0ec6038dfc1124345c0385e10cff43a18c5"
 }

No alert changes

Improved metrics

Total package byte prevSize

1433722

0.57%

Lines of code

4258

2.31%

Dependency changes

• Updated

  @nteract/commutable@^7.4.5

• Updated

  @nteract/core@^15.1.9

• Updated

  @nteract/fixtures@^2.3.19

• Updated

  @nteract/mythic-configuration@^1.0.11

• Updated

  @nteract/presentational-components@^3.4.11