flipper-ui 0.27.0 → 0.27.2

package/core/Experimental/Sidebar/Sidebar.stories.js

@@ -1,51 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.sidebar = exports.loading = exports["default"] = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _SidebarV = _interopRequireDefault(require("./SidebarV2"));
-var _Home = _interopRequireDefault(require("@material-ui/icons/Home"));
-var _Computer = _interopRequireDefault(require("@material-ui/icons/Computer"));
-var _Edit = _interopRequireDefault(require("@material-ui/icons/Edit"));
-var loading = function loading() {
-  return /*#__PURE__*/_react["default"].createElement(_SidebarV["default"], {
-    loading: true,
-    options: []
-  });
-};
-exports.loading = loading;
-var sidebar = function sidebar() {
-  return /*#__PURE__*/_react["default"].createElement(_SidebarV["default"], {
-    options: [{
-      icon: /*#__PURE__*/_react["default"].createElement(_Home["default"], null),
-      name: 'Home',
-      label: 'Home',
-      route: '/'
-    }, {
-      icon: /*#__PURE__*/_react["default"].createElement(_Computer["default"], null),
-      name: 'Computer',
-      label: 'Computer',
-      route: '/computer'
-    }],
-    extraOptions: [{
-      icon: /*#__PURE__*/_react["default"].createElement(_Edit["default"], null),
-      name: 'Edit',
-      label: 'edit',
-      route: '/edit'
-    }],
-    handleGoTo: function handleGoTo(foo, bar) {
-      return function () {
-        alert(foo + ' ' + bar);
-      };
-    }
-  });
-};
-exports.sidebar = sidebar;
-var _default = {
-  title: 'v2/Sidebar',
-  component: _SidebarV["default"]
-};
-exports["default"] = _default;

package/core/Experimental/Sidebar/index.d.ts

@@ -1 +0,0 @@
-export { default } from './SidebarV2';

package/core/Experimental/Sidebar/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _SidebarV["default"];
-  }
-});
-var _SidebarV = _interopRequireDefault(require("./SidebarV2"));

package/core/Experimental/Sidebar/sidebar.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/core/Experimental/Sidebar/sidebar.spec.js

@@ -1,129 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var React = _interopRequireWildcard(require("react"));
-var _react2 = require("@testing-library/react");
-var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-var _SidebarV = _interopRequireDefault(require("./SidebarV2"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var options = [{
-  icon: /*#__PURE__*/React.createElement("svg", null),
-  label: 'Option-1',
-  name: 'option1',
-  route: '/option1'
-}, {
-  icon: /*#__PURE__*/React.createElement("svg", null),
-  label: 'Option-2',
-  name: 'option2',
-  route: '/option2'
-}];
-describe('Sidebar', function () {
-  it('renders the options', function () {
-    (0, _react2.render)( /*#__PURE__*/React.createElement(_SidebarV["default"], {
-      options: options
-    }));
-    options.forEach(function (option) {
-      expect(_react2.screen.getByTitle(option.label)).toBeDefined();
-    });
-  });
-  it('calls handleGoTo when an option is clicked', function () {
-    var handleGoTo = jest.fn();
-    (0, _react2.render)( /*#__PURE__*/React.createElement(_SidebarV["default"], {
-      options: options,
-      handleGoTo: handleGoTo
-    }));
-    var expandBtn = _react2.screen.getByTestId('sidebar-option-option1');
-    expandBtn.addEventListener('click', function (event) {
-      return event.preventDefault();
-    }, false);
-    _userEvent["default"].click(expandBtn);
-    expect(handleGoTo).toHaveBeenCalledWith('option1', '/option1');
-  });
-  it('renders extraOptions when provided', function () {
-    var extraOptions = [{
-      icon: /*#__PURE__*/React.createElement("svg", null),
-      label: 'Extra Option 1',
-      name: 'extraOption1',
-      route: '/extraOption1'
-    }, {
-      icon: /*#__PURE__*/React.createElement("svg", null),
-      label: 'Extra Option 2',
-      name: 'extraOption2',
-      route: '/extraOption2'
-    }];
-    (0, _react2.render)( /*#__PURE__*/React.createElement(_SidebarV["default"], {
-      options: options,
-      extraOptions: extraOptions
-    }));
-    extraOptions.forEach(function (option) {
-      expect(_react2.screen.getByTitle(option.label)).toBeDefined();
-    });
-  });
-  it('renders a skeleton when loading', function () {
-    (0, _react2.render)( /*#__PURE__*/React.createElement(_SidebarV["default"], {
-      options: options,
-      loading: true
-    }));
-    expect(_react2.screen.queryAllByRole('skeleton')).toHaveLength(6);
-  });
-  it('should show labels when expanded', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
-    var handleGoTo, expandBtn;
-    return _regenerator["default"].wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            handleGoTo = jest.fn();
-            (0, _react2.render)( /*#__PURE__*/React.createElement(_SidebarV["default"], {
-              options: options,
-              handleGoTo: handleGoTo
-            }));
-            expandBtn = _react2.screen.getByTestId('sidebar-button');
-            _userEvent["default"].click(expandBtn);
-            _context.next = 6;
-            return (0, _react2.waitFor)(function () {
-              var labels = options.map(function (option) {
-                return _react2.screen.getByTestId("list-item-".concat(option.label));
-              });
-              labels.forEach(function (label) {
-                return expect(label).toBeDefined();
-              });
-            });
-          case 6:
-          case "end":
-            return _context.stop();
-        }
-      }
-    }, _callee);
-  })));
-  it('should now show labels when collapsed', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
-    var handleGoTo;
-    return _regenerator["default"].wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            handleGoTo = jest.fn();
-            (0, _react2.render)( /*#__PURE__*/React.createElement(_SidebarV["default"], {
-              options: options,
-              handleGoTo: handleGoTo
-            }));
-            _context2.next = 4;
-            return (0, _react2.waitFor)(function () {
-              var labels = options.map(function (option) {
-                return _react2.screen.queryByTestId("list-item-".concat(option.label));
-              });
-              labels.forEach(function (label) {
-                return expect(label).toBeNull();
-              });
-            });
-          case 4:
-          case "end":
-            return _context2.stop();
-        }
-      }
-    }, _callee2);
-  })));
-});

package/core/Experimental/index.d.ts

@@ -1,5 +0,0 @@
-export { default as SidebarV2 } from './Sidebar';
-export { default as FabV2 } from './Fab';
-export { default as ButtonV2 } from './Button';
-export { default as DialogV2 } from './Dialog';
-export { default as CardV2 } from './Card';

package/core/Experimental/index.js

@@ -1,41 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "ButtonV2", {
-  enumerable: true,
-  get: function get() {
-    return _Button["default"];
-  }
-});
-Object.defineProperty(exports, "CardV2", {
-  enumerable: true,
-  get: function get() {
-    return _Card["default"];
-  }
-});
-Object.defineProperty(exports, "DialogV2", {
-  enumerable: true,
-  get: function get() {
-    return _Dialog["default"];
-  }
-});
-Object.defineProperty(exports, "FabV2", {
-  enumerable: true,
-  get: function get() {
-    return _Fab["default"];
-  }
-});
-Object.defineProperty(exports, "SidebarV2", {
-  enumerable: true,
-  get: function get() {
-    return _Sidebar["default"];
-  }
-});
-var _Sidebar = _interopRequireDefault(require("./Sidebar"));
-var _Fab = _interopRequireDefault(require("./Fab"));
-var _Button = _interopRequireDefault(require("./Button"));
-var _Dialog = _interopRequireDefault(require("./Dialog"));
-var _Card = _interopRequireDefault(require("./Card"));

package/stories/Advertise.stories.js

@@ -1,25 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Advertise = _interopRequireDefault(require("../core/Advertise"));
-var _default = {
-  title: 'Advertise',
-  component: _Advertise["default"]
-};
-exports["default"] = _default;
-var Template = function Template(args) {
-  return /*#__PURE__*/_react["default"].createElement(_Advertise["default"], args);
-};
-var Default = Template.bind({});
-exports.Default = Default;
-Default.args = {
-  comment: 'Be like water. You put water into a cup. \
-        It becomes the cup. You put water into a bottle. It becomes the bottle.',
-  author: 'Bruce Lee',
-  children: 'Advertise'
-};

package/stories/AutoComplete.stories.js

@@ -1,119 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.WithSubheader = exports.OpeningWhenFocused = exports.Default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
-var _AutoComplete = _interopRequireDefault(require("../core/AutoComplete"));
-var _ListItem = _interopRequireDefault(require("../core/ListItem"));
-var _TextField = _interopRequireDefault(require("../core/TextField"));
-var _Typography = _interopRequireDefault(require("../core/Typography"));
-var _default = {
-  title: 'AutoComplete',
-  component: _AutoComplete["default"]
-};
-exports["default"] = _default;
-var Template = function Template(args) {
-  return /*#__PURE__*/_react["default"].createElement(_AutoComplete["default"], args);
-};
-var Default = Template.bind({});
-exports.Default = Default;
-Default.args = {
-  suggestions: [{
-    value: 'rock',
-    label: 'Rock'
-  }, {
-    value: 'pop',
-    label: 'Pop'
-  }, {
-    value: 'classic',
-    label: 'Classic'
-  }],
-  renderInput: function renderInput(props) {
-    return /*#__PURE__*/_react["default"].createElement(_TextField["default"], (0, _extends2["default"])({
-      fullWidth: true,
-      placeholder: "Music genres"
-    }, props));
-  },
-  renderSuggestion: function renderSuggestion(item, props, selected) {
-    return /*#__PURE__*/_react["default"].createElement(_ListItem["default"], (0, _extends2["default"])({
-      key: item,
-      selected: selected
-    }, props), item.label);
-  },
-  onChange: function onChange() {
-    return null;
-  }
-};
-var OpeningWhenFocused = function OpeningWhenFocused() {
-  return /*#__PURE__*/_react["default"].createElement(_AutoComplete["default"], {
-    openOnFocus: true,
-    value: {
-      value: 'classic',
-      label: 'Classic'
-    },
-    suggestions: [{
-      value: 'rock',
-      label: 'Rock'
-    }, {
-      value: 'pop',
-      label: 'Pop'
-    }, {
-      value: 'classic',
-      label: 'Classic'
-    }],
-    renderInput: function renderInput(props) {
-      return /*#__PURE__*/_react["default"].createElement(_TextField["default"], (0, _extends2["default"])({
-        fullWidth: true,
-        placeholder: "Music genres"
-      }, props));
-    },
-    renderSuggestion: function renderSuggestion(item, props, selected) {
-      return /*#__PURE__*/_react["default"].createElement(_ListItem["default"], (0, _extends2["default"])({
-        selected: selected
-      }, props), item.label);
-    },
-    onChange: function onChange() {
-      return null;
-    }
-  });
-};
-exports.OpeningWhenFocused = OpeningWhenFocused;
-var WithSubheader = function WithSubheader() {
-  return /*#__PURE__*/_react["default"].createElement(_AutoComplete["default"], {
-    openOnFocus: true,
-    suggestions: [{
-      label: 'Genres',
-      subheader: true
-    }, {
-      value: 'rock',
-      label: 'Rock'
-    }, {
-      value: 'pop',
-      label: 'Pop'
-    }, {
-      value: 'classic',
-      label: 'Classic'
-    }],
-    renderInput: function renderInput(props) {
-      return /*#__PURE__*/_react["default"].createElement(_TextField["default"], (0, _extends2["default"])({
-        fullWidth: true,
-        placeholder: "Music genres"
-      }, props));
-    },
-    renderSuggestion: function renderSuggestion(item, props, selected) {
-      return item.subheader ? /*#__PURE__*/_react["default"].createElement(_ListItem["default"], null, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        variant: "caption"
-      }, item.label)) : /*#__PURE__*/_react["default"].createElement(_ListItem["default"], (0, _extends2["default"])({}, props, {
-        selected: selected
-      }), item.label || item);
-    },
-    onChange: function onChange() {
-      return null;
-    }
-  });
-};
-exports.WithSubheader = WithSubheader;

package/stories/AutoCompleteLab.stories.js

@@ -1,55 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
-var _AutoComplete = _interopRequireDefault(require("../core/AutoComplete"));
-var _TextField = _interopRequireDefault(require("../core/TextField"));
-var _lab = require("@material-ui/lab");
-var _default = {
-  title: 'AutoCompleteLab',
-  component: _AutoComplete["default"]
-};
-exports["default"] = _default;
-var Default = function Default() {
-  return /*#__PURE__*/_react["default"].createElement(_lab.Autocomplete, {
-    options: [{
-      label: 'Anemone',
-      value: 'forget-me-not'
-    }, {
-      label: 'Forget me not',
-      value: 'anemone'
-    }, {
-      label: 'Snapdragon',
-      value: 'snapdragon'
-    }, {
-      label: 'Sunflower',
-      value: 'sunflower'
-    }, {
-      label: 'Rose',
-      value: 'rose'
-    }],
-    getOptionLabel: function getOptionLabel(option) {
-      return option.label;
-    },
-    style: {
-      width: 300
-    },
-    renderInput: function renderInput(props) {
-      return /*#__PURE__*/_react["default"].createElement(_TextField["default"], (0, _extends2["default"])({}, props, {
-        label: "Flowers",
-        placeholder: "Flowers",
-        variant: "outlined",
-        fullWidth: true
-      }));
-    },
-    onChange: function onChange() {
-      return null;
-    }
-  });
-};
-exports.Default = Default;

package/stories/Avatar.stories.js

@@ -1,38 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.WithChuildren = exports.Primary = exports.Default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Avatar = _interopRequireDefault(require("../core/Avatar"));
-var _default = {
-  title: 'Avatar',
-  component: _Avatar["default"],
-  argTypes: {
-    backgroundColor: {
-      control: 'color'
-    },
-    children: {
-      control: 'text'
-    }
-  }
-};
-exports["default"] = _default;
-var Template = function Template(args) {
-  return /*#__PURE__*/_react["default"].createElement(_Avatar["default"], args);
-};
-var Default = Template.bind({});
-exports.Default = Default;
-var Primary = Template.bind({});
-exports.Primary = Primary;
-Primary.args = {
-  primary: true
-};
-var WithChuildren = Template.bind({});
-exports.WithChuildren = WithChuildren;
-WithChuildren.args = {
-  children: 'W',
-  primary: true
-};

package/stories/Badge.stories.js

@@ -1,56 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.WithDot = exports.Secondary = exports.Primary = exports.Default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Badge = _interopRequireDefault(require("../core/Badge"));
-var _Button = _interopRequireDefault(require("../core/Button"));
-var _default = {
-  title: 'Badge',
-  component: _Badge["default"],
-  argTypes: {
-    backgroundColor: {
-      control: 'color'
-    },
-    counter: {
-      control: 'number'
-    }
-  }
-};
-exports["default"] = _default;
-var Template = function Template(args) {
-  return /*#__PURE__*/_react["default"].createElement(_Badge["default"], args);
-};
-var Default = Template.bind({});
-exports.Default = Default;
-Default.args = {
-  counter: 2,
-  children: 'Badge'
-};
-var Primary = Template.bind({});
-exports.Primary = Primary;
-Primary.args = {
-  counter: 2,
-  color: 'primary',
-  children: 'Badge'
-};
-var Secondary = Template.bind({});
-exports.Secondary = Secondary;
-Secondary.args = {
-  counter: 150,
-  color: 'secondary',
-  children: /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-    variant: "outlined"
-  }, "Try changing the counter to Zero")
-};
-var WithDot = Template.bind({});
-exports.WithDot = WithDot;
-WithDot.args = {
-  counter: 1,
-  variant: 'dot',
-  color: 'primary',
-  children: 'Badge'
-};

package/stories/Box.stories.js

@@ -1,23 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Box = _interopRequireDefault(require("../core/Box"));
-var _default = {
-  title: 'Box',
-  component: _Box["default"]
-};
-exports["default"] = _default;
-var Template = function Template(args) {
-  return /*#__PURE__*/_react["default"].createElement(_Box["default"], args);
-};
-var Default = Template.bind({});
-exports.Default = Default;
-Default.args = {
-  margin: 25,
-  children: 'Open the box and think outside of it.'
-};

package/stories/Breadcrumb.stories.js

@@ -1,34 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Link = _interopRequireDefault(require("../core/Link"));
-var _Breadcrumb = _interopRequireDefault(require("../core/Breadcrumb"));
-var _default = {
-  title: 'Breadcrumb',
-  component: _Breadcrumb["default"],
-  argTypes: {
-    backgroundColor: {
-      control: 'color'
-    }
-  }
-};
-exports["default"] = _default;
-var Template = function Template(args) {
-  return /*#__PURE__*/_react["default"].createElement(_Breadcrumb["default"], args);
-};
-var Default = Template.bind({});
-exports.Default = Default;
-Default.args = {
-  children: /*#__PURE__*/_react["default"].createElement(_Breadcrumb["default"], null, /*#__PURE__*/_react["default"].createElement(_Link["default"], {
-    color: "inherit",
-    href: "#"
-  }, "Flipper-ui"), /*#__PURE__*/_react["default"].createElement(_Link["default"], {
-    color: "inherit",
-    href: "#"
-  }, "Breadcrumb"))
-};