flipper-ui 0.25.16 → 0.26.0

package/.babelrc.js

@@ -0,0 +1,119 @@
+const toKebabCase = (str) =>
+  str.replace(
+    /([a-z])?([A-Z])/g,
+    (m, g1, g2) => (g1 ? g1 + '-' : '') + g2.toLowerCase()
+  )
+
+const reactVisModules = { 
+    AbstractSeries: 'plot/series/abstract-series',
+    ArcSeries: 'plot/series/arc-series',
+    AreaSeries: 'plot/series/area-series',
+    Borders: 'plot/borders',
+    ChartLabel: 'plot/chart-label',
+    CircularGridLines: 'plot/circular-grid-lines',
+    ContourSeries: 'plot/series/contour-series',
+    Crosshair: 'plot/crosshair',
+    CustomSVGSeries: 'plot/series/custom-svg-series',
+    DecorativeAxis: 'plot/axis/decorative-axis',
+    GradientDefs: 'plot/gradient-defs',
+    GridLines: 'plot/grid-lines',
+    HeatmapSeries: 'plot/series/heatmap-series',
+    HexbinSeries: 'plot/series/hexbin-series',
+    Highlight: 'plot/highlight',
+    Hint: 'plot/hint',
+    HorizontalBarSeries: 'plot/series/horizontal-bar-series',
+    HorizontalBarSeriesCanvas: 'plot/series/horizontal-bar-series-canvas',
+    HorizontalGridLines: 'plot/horizontal-grid-lines',
+    HorizontalRectSeries: 'plot/series/horizontal-rect-series',
+    HorizontalRectSeriesCanvas: 'plot/series/horizontal-rect-series-canvas',
+    LabelSeries: 'plot/series/label-series',
+    LineMarkSeries: 'plot/series/line-mark-series',
+    LineMarkSeriesCanvas: 'plot/series/line-mark-series-canvas',
+    LineSeries: 'plot/series/line-series',
+    LineSeriesCanvas: 'plot/series/line-series-canvas',
+    MarkSeries: 'plot/series/mark-series',
+    MarkSeriesCanvas: 'plot/series/mark-series-canvas',
+    PolygonSeries: 'plot/series/polygon-series',
+    VerticalBarSeries: 'plot/series/vertical-bar-series',
+    VerticalBarSeriesCanvas: 'plot/series/vertical-bar-series-canvas',
+    VerticalGridLines: 'plot/vertical-grid-lines',
+    VerticalRectSeries: 'plot/series/vertical-rect-series',
+    VerticalRectSeriesCanvas: 'plot/series/vertical-rect-series-canvas',
+    Voronoi: 'plot/voronoi',
+    RectSeries: 'plot/series/rect-series',
+    RectSeriesCanvas: 'plot/series/rect-series-canvas',
+    WhiskerSeries: 'plot/series/whisker-series',
+    XYPlot: 'plot/xy-plot',
+    XAxis: 'plot/axis/x-axis',
+    YAxis: 'plot/axis/y-axis',
+    ContinuousColorLegend: 'legends/continuous-color-legend',
+    ContinuousSizeLegend: 'legends/continuous-size-legend',
+    DiscreteColorLegend: 'legends/discrete-color-legend',
+    SearchableDiscreteColorLegend: 'legends/searchable-discrete-color-legend',
+    ParallelCoordinates: 'parallel-coordinates',
+    RadarChart: 'radar-chart',
+    RadialChart: 'radial-chart',
+    Sankey: 'sankey',
+    Sunburst: 'sunburst',
+    Treemap: 'treemap',
+    makeHeightFlexible: 'make-vis-flexible',
+    makeVisFlexible: 'make-vis-flexible',
+    makeWidthFlexible: 'make-vis-flexible',
+    FlexibleXYPlot: 'make-vis-flexible',
+    FlexibleWidthXYPlot: 'make-vis-flexible',
+    FlexibleHeightXYPlot: 'make-vis-flexible',
+    AxisUtils: 'utils/axis-utils',
+    ScaleUtils: 'utils/scales-utils'
+}
+
+module.exports = {
+  "plugins": [
+    [
+      "transform-imports", {
+        "@material-ui/icons": {
+          "transform": "@material-ui/icons/${member}",
+          "preventFullImport": true
+        },
+        "@material-ui/core": {
+          "transform": "@material-ui/core/${member}",
+          "preventFullImport": true
+        },
+        "@material-ui/styles": {
+          "transform": "@material-ui/styles/${member}",
+          "preventFullImport": true
+        },
+        "../icons": {
+          "transform": "@material-ui/icons/${member}",
+          "preventFullImport": true
+        },
+        "../charts": {
+          "transform": "flipper-ui/charts/${member}",
+          "preventFullImport": true
+        },
+        "react-vis": {
+          "transform": importName => `react-vis/es/${reactVisModules[importName]}`,
+          "preventFullImport": true
+        },
+        "date-fns/locale": {
+          "transform": importName =>`date-fns/locale/${toKebabCase(importName)}`,
+          "preventFullImport": true 
+        },
+        "date-fns": {
+          "transform": "date-fns/${member}",
+          "preventFullImport": true
+        },
+        "ramda": {
+          "transform": "ramda/es/${member}",
+          "preventFullImport": true
+        },
+      }
+    ],
+    "@babel/plugin-transform-runtime",
+    "transform-class-properties"
+  ],
+  "presets": [
+    "@babel/env",
+    "@babel/react",
+    "@babel/typescript"
+  ]
+}

package/.eslintignore

@@ -0,0 +1 @@
+dist/*

package/.eslintrc.json

@@ -0,0 +1,209 @@
+{
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "jsx": true,
+        "useJSXTextNode": true
+    },
+    "extends": [
+        "plugin:@typescript-eslint/recommended",
+        "plugin:react/recommended",
+        "eslint:recommended",
+        "prettier",
+        "prettier/@typescript-eslint",
+        "plugin:ramda/recommended"
+    ],
+    "rules": {
+        "template-curly-spacing": "off",
+        "no-sequences": "error",
+        "spaced-comment": [
+            "error",
+            "always"
+        ],
+        "key-spacing": [
+            "error",
+            {
+                "mode": "strict"
+            }
+        ],
+        "max-len": [
+            "error",
+            {
+                "code": 85
+            }
+        ],
+        "max-lines": [
+            "error",
+            {
+                "max": 350,
+                "skipBlankLines": true
+            }
+        ],
+        "prefer-const": [
+            "error",
+            {
+                "destructuring": "all"
+            }
+        ],
+        "no-var": "error",
+        "newline-before-return": "error",
+        "arrow-parens": [
+            "error",
+            "as-needed"
+        ],
+        "no-bitwise": "error",
+        "max-classes-per-file": "error",
+        "no-duplicate-imports": "error",
+        "lines-between-class-members": [
+            "error",
+            "always"
+        ],
+        "padding-line-between-statements": [
+            "error",
+            {
+                "blankLine": "always",
+                "prev": "*",
+                "next": "return"
+            }
+        ],
+        "sort-imports": [
+            "error",
+            {
+                "ignoreCase": true,
+                "ignoreDeclarationSort": true,
+                "ignoreMemberSort": true,
+                "memberSyntaxSortOrder": [
+                    "none",
+                    "all",
+                    "multiple",
+                    "single"
+                ]
+            }
+        ],
+        "no-irregular-whitespace": "error",
+        "space-before-blocks": "error",
+        "no-multi-spaces": "error",
+        "no-trailing-spaces": "error",
+        "no-whitespace-before-property": "error",
+        "curly": "error",
+        "no-undef": "off",
+        "no-case-declarations": "off",
+        "indent": "off",
+        "no-unused-vars": [
+            "off"
+        ],
+        "no-console": [
+            "error",
+            {
+                "allow": [
+                    "log",
+                    "error"
+                ]
+            }
+        ],
+        "comma-dangle": [
+            "error",
+            "never"
+        ],
+        "semi": [
+            "error",
+            "never"
+        ],
+        "no-multiple-empty-lines": [
+            "error",
+            {
+                "max": 1
+            }
+        ],
+        "quotes": [
+            "error",
+            "single"
+        ],
+        "eol-last": [
+            "error",
+            "always"
+        ],
+        "no-new-wrappers": "error",
+        "arrow-spacing": [
+            "error",
+            {
+                "after": true,
+                "before": true
+            }
+        ],
+        "object-curly-spacing": [
+            "error",
+            "always"
+        ],
+        "react/jsx-closing-bracket-location": [
+            1,
+            {
+                "selfClosing": "line-aligned",
+                "nonEmpty": "after-props"
+            }
+        ],
+        "react/prop-types": "off",
+        "react/display-name": "off",
+        "react/jsx-boolean-value": "off",
+        "react/jsx-wrap-multilines": "off",
+        "react/jsx-curly-spacing": [
+            "error",
+            {
+                "when": "always",
+                "children": true
+            }
+        ],
+        "react/no-unescaped-entities": "off",
+        "prefer-arrow/prefer-arrow-functions": [
+            "warn",
+            {
+                "disallowPrototype": true,
+                "singleReturnOnly": true,
+                "classPropertiesAllowed": false
+            }
+        ],
+        "@typescript-eslint/no-unused-vars": [
+            "error",
+            {
+                "ignoreRestSiblings": true
+            }
+        ],
+        "@typescript-eslint/no-explicit-any": "error",
+        "@typescript-eslint/class-name-casing": "error",
+        "@typescript-eslint/member-ordering": [
+            "error",
+            {
+                "classes": [
+                    "public-static-field",
+                    "public-instance-field",
+                    "private-static-field",
+                    "private-instance-field",
+                    "private-constructor",
+                    "public-constructor",
+                    "private-instance-method",
+                    "protected-instance-method",
+                    "public-instance-method"
+                ]
+            }
+        ],
+        "@typescript-eslint/prefer-interface": "off",
+        "@typescript-eslint/explicit-member-accessibility": "off",
+        "@typescript-eslint/no-var-requires": "off",
+        "@typescript-eslint/no-non-null-assertion": "off",
+        "@typescript-eslint/no-object-literal-type-assertion": "off",
+        "@typescript-eslint/interface-name-prefix": "off",
+        "@typescript-eslint/array-type": "off",
+        "@typescript-eslint/explicit-function-return-type": "off"
+    },
+    "plugins": [
+        "react",
+        "prefer-arrow",
+        "@typescript-eslint",
+        "ramda"
+    ],
+    "settings": {
+        "react": {
+            "pragma": "React",
+            "version": "16.8.6"
+        }
+    }
+}

package/.github/workflows/build.yml

@@ -0,0 +1,25 @@
+name: Node.js CI
+
+on: [push]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [18.x]
+
+    steps:
+      - uses: actions/checkout@v1
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v1
+        with:
+          node-version: ${{ matrix.node-version }}
+      - run: yarn
+      - run: yarn lint
+      - run: yarn build
+      - run: yarn test
+        env:
+          CI: true

package/.github/workflows/publish-s3.yml

@@ -0,0 +1,27 @@
+name: Deploy
+
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v1
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 18
+          registry-url: https://registry.npmjs.org/
+      - run: |
+          yarn
+          yarn docs:build
+      - name: Configure AWS credentials
+        uses: aws-actions/configure-aws-credentials@v1.6.1
+        with:
+          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY }}
+          aws-secret-access-key: ${{ secrets.AWS_ACCESS_SECRET }}
+          aws-region: 'us-east-1'
+      - name: Deploy to S3
+        run: aws s3 sync docs s3://flipper-ui.ngi.com.br --delete

package/.github/workflows/release.yml

@@ -0,0 +1,24 @@
+name: Release
+
+on:
+  release:
+    types: [created]
+
+jobs:
+
+  publish-npm:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          registry-url: https://registry.npmjs.org/
+      - run: yarn
+      - run: yarn build
+      - run: node pre-publish.js
+      - run: echo $(NODE_AUTH_TOKEN)
+      - run: npm config set -- '//registry.npmjs.org/:_authToken' "${NPM_AUTH_TOKEN}"
+      - run: npm publish dist --access public
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/.prettierrc

@@ -0,0 +1,8 @@
+{
+    "trailingComma": "none",
+    "tabWidth": 4,
+    "semi": false,
+    "jsxBracketSameLine": true,
+    "jsxSingleQuote": true,
+    "singleQuote": true
+}

package/.storybook/main.js

@@ -0,0 +1,10 @@
+module.exports = {
+    stories: [
+        '../src/**/*.stories.mdx',
+        '../src/**/*.stories.@(js|jsx|ts|tsx)'
+    ],
+    core: {
+        builder: 'webpack5'
+    },
+    addons: ['@storybook/addon-links', '@storybook/addon-essentials']
+}

package/.storybook/preview-head.html

@@ -0,0 +1 @@
+<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" />

package/.storybook/preview.js

@@ -0,0 +1,9 @@
+export const parameters = {
+  actions: { argTypesRegex: "^on[A-Z].*" },
+  controls: {
+    matchers: {
+      color: /(background|color)$/i,
+      date: /Date$/,
+    },
+  },
+}

package/.tool-versions

@@ -0,0 +1 @@
+nodejs 18.12.1

package/.vscode/settings.json

@@ -0,0 +1,21 @@
+{
+  "eslint.packageManager": "yarn",
+  "eslint.enable": true,
+  "eslint.autoFixOnSave": true,
+  "eslint.validate": [
+      "javascript",
+      "javascriptreact",
+      {
+        "language": "typescript",
+        "autoFix": true
+      },
+      {
+        "language": "typescriptreact",
+        "autoFix": true
+      }
+  ],
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": true
+  }
+}

package/.vscode/snippets/typescriptreact.json

@@ -0,0 +1,89 @@
+{
+    "React class": {
+        "prefix": "react class",
+        "body": [
+            "import React, { Component } from 'react'",
+            "",
+            "class ${TM_FILENAME_BASE} extends Component {",
+            "    public render() {",
+            "        return ${1:null}",
+            "    }",
+            "}",
+            "",
+            "export default ${TM_FILENAME_BASE}",
+            ""
+        ],
+        "description": "Creates a React Class with TypeScript"
+    },
+    "React class with props": {
+        "prefix": "react class with props",
+        "body": [
+            "import React, { Component } from 'react'",
+            "",
+            "interface IProps {",
+            "    ${1:definitions}",
+            "}",
+            "",
+            "class ${TM_FILENAME_BASE} extends Component<IProps> {",
+            "    public render() {",
+            "        return ${2:null}",
+            "    }",
+            "}",
+            "",
+            "export default ${TM_FILENAME_BASE}",
+            ""
+        ],
+        "description": "Creates a React Class with TypeScript"
+    },
+    "React SFC": {
+        "prefix": "react sfc",
+        "body": [
+            "import React, { SFC } from 'react'",
+            "",
+            "const ${TM_FILENAME_BASE}: SFC = () =>",
+            "    <${1:div} />",
+            "",
+            "export default ${TM_FILENAME_BASE}",
+            ""
+        ],
+        "description": "Creates a SFC with no props"
+    },
+    "React SFC with Props": {
+        "prefix": "react sfc with props",
+        "body": [
+            "import React, { SFC } from 'react'",
+            "",
+            "interface IProps {",
+            "    ${1:definitions}",
+            "}",
+            "",
+            "const ${TM_FILENAME_BASE}: SFC<IProps> = props =>",
+            "    <${2:div} { ...props } />",
+            "",
+            "export default ${TM_FILENAME_BASE}",
+            ""
+        ],
+        "description": "Creates a SFC with props"
+    },
+    "React constructor": {
+        "prefix": "react constructor",
+        "body": [
+            "constructor(props) {",
+            "    super(props)",
+            "    this.state = {",
+            "        ${1:definitions}",
+            "    }",
+            "}"
+        ],
+        "description": "Creates a React Constructor"
+    },
+    "React event handler": {
+        "prefix": "react event handler",
+        "body": [
+            "public handle${1:name} = (${2:params}) => {",
+            "    ${3:content}",
+            "}"
+        ],
+        "description": "Creates a React event handler"
+    }
+}

package/.wakatime-project

@@ -0,0 +1 @@
+@p&d/flipper-ui

package/{colors.js → dist/colors.js}

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.GREY = exports.DARK = exports.success = exports.warning = exports.error = exports.text = exports.transparent = exports.black = exports.white = exports.silver = exports.background = exports.primary = void 0;
+exports.white = exports.warning = exports.transparent = exports.text = exports.success = exports.silver = exports.primary = exports.error = exports.black = exports.background = exports.GREY = exports.DARK = void 0;
 var primary = {
   dark: '#00695C',
   light: '#B2DFDB',
@@ -37,8 +37,9 @@ var error = {
 exports.error = error;
 var warning = '#FFC107';
 exports.warning = warning;
-var success = '#4CAF50'; // Table gradient hover colors with opacity
+var success = '#4CAF50';
 
+// Table gradient hover colors with opacity
 exports.success = success;
 var DARK = 'rgba(189,189,189,0)';
 exports.DARK = DARK;

package/{core → dist/core}/Advertise.js

@@ -1,61 +1,39 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _colors = require("../colors");
-
 var _Paper = _interopRequireDefault(require("./Paper"));
-
 var _Typography = _interopRequireDefault(require("./Typography"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _templateObject() {
-  var data = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    flex-direction: column;\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
+var _excluded = ["comment", "author", "padding", "commentStyle", "authorStyle"];
+var _templateObject;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var styles = {
   border: {
     borderLeft: "1px solid ".concat(_colors.background.dark)
   }
 };
-var Paper = (0, _styledComponents["default"])(_Paper["default"])(_templateObject());
-
+var Paper = (0, _styledComponents["default"])(_Paper["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    flex-direction: column;\n"])));
 var Advertise = function Advertise(_ref) {
   var comment = _ref.comment,
-      author = _ref.author,
-      _ref$padding = _ref.padding,
-      padding = _ref$padding === void 0 ? 4 : _ref$padding,
-      _ref$commentStyle = _ref.commentStyle,
-      commentStyle = _ref$commentStyle === void 0 ? {} : _ref$commentStyle,
-      _ref$authorStyle = _ref.authorStyle,
-      authorStyle = _ref$authorStyle === void 0 ? {} : _ref$authorStyle,
-      otherProps = (0, _objectWithoutProperties2["default"])(_ref, ["comment", "author", "padding", "commentStyle", "authorStyle"]);
+    author = _ref.author,
+    _ref$padding = _ref.padding,
+    padding = _ref$padding === void 0 ? 4 : _ref$padding,
+    _ref$commentStyle = _ref.commentStyle,
+    commentStyle = _ref$commentStyle === void 0 ? {} : _ref$commentStyle,
+    _ref$authorStyle = _ref.authorStyle,
+    authorStyle = _ref$authorStyle === void 0 ? {} : _ref$authorStyle,
+    otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
   return /*#__PURE__*/_react["default"].createElement(Paper, (0, _extends2["default"])({
     padding: padding
   }, otherProps), /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
@@ -69,6 +47,5 @@ var Advertise = function Advertise(_ref) {
     style: _objectSpread(_objectSpread({}, styles.border), authorStyle)
   }, author));
 };
-
 var _default = Advertise;
 exports["default"] = _default;