@deephaven/components 0.82.0 → 0.82.1-beta.2

package/dist/ComboBox.d.ts

@@ -1,120 +0,0 @@
-/**
- * Combobox that combines a input box with a searchable dropdown menu
- *
- * props:
- * @param {array} options :[{
- *    title: 'option title for display',
- *    value: 'option value' //option value
- * }]
- * @param {string} inputPlaceholder place holder for the input box
- * @param {string} searchPlaceholder place holder for the search box in drop down search box
- * @param {boolean} disabled disable both input & drop down
- *
- *
- */
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import memoize from 'memoizee';
-import { PopperOptions } from 'popper.js';
-import SearchInput from './SearchInput';
-import { Popper } from './popper';
-import './ComboBox.scss';
-interface ComboBoxOption {
-    title: string;
-    value: string;
-}
-interface ComboBoxProps {
-    options: ComboBoxOption[];
-    popperOptions: PopperOptions;
-    onChange: (value: string) => void;
-    inputPlaceholder: string;
-    searchPlaceholder: string;
-    disabled: boolean;
-    className: string;
-    defaultValue: string;
-    spellCheck: boolean;
-    onEnter: () => void;
-    'data-testid'?: string;
-}
-interface ComboBoxState {
-    value: string;
-    filter: string;
-    filteredOptions: ComboBoxOption[];
-    keyboardOptionIndex: number;
-    menuIsOpen: boolean;
-    inputWidth: number;
-}
-declare enum MENU_NAVIGATION_DIRECTION {
-    UP = "UP",
-    DOWN = "DOWN"
-}
-declare class ComboBox extends Component<ComboBoxProps, ComboBoxState> {
-    static MENU_NAVIGATION_DIRECTION: typeof MENU_NAVIGATION_DIRECTION;
-    static DROP_DOWN_MENU_HEIGHT: number;
-    static propTypes: {
-        options: PropTypes.Validator<(PropTypes.InferProps<{
-            title: PropTypes.Validator<string>;
-            value: PropTypes.Validator<string>;
-        }> | null | undefined)[]>;
-        popperOptions: PropTypes.Requireable<PropTypes.InferProps<{
-            title: PropTypes.Validator<string>;
-            value: PropTypes.Validator<string>;
-        }>>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        inputPlaceholder: PropTypes.Requireable<string>;
-        searchPlaceholder: PropTypes.Requireable<string>;
-        disabled: PropTypes.Requireable<boolean>;
-        className: PropTypes.Requireable<string>;
-        defaultValue: PropTypes.Requireable<string>;
-        spellCheck: PropTypes.Requireable<boolean>;
-        onEnter: PropTypes.Requireable<(...args: any[]) => any>;
-        'data-testid': PropTypes.Requireable<string>;
-    };
-    static defaultProps: {
-        onChange(): void;
-        inputPlaceholder: string;
-        searchPlaceholder: string;
-        disabled: boolean;
-        className: string;
-        defaultValue: string;
-        popperOptions: null;
-        spellCheck: boolean;
-        onEnter(): void;
-        'data-testid': undefined;
-    };
-    constructor(props: ComboBoxProps);
-    componentDidUpdate(): void;
-    popper: React.RefObject<Popper>;
-    cbContainer: React.RefObject<HTMLDivElement>;
-    toggleButton: React.RefObject<HTMLButtonElement>;
-    menuContainer: React.RefObject<HTMLDivElement>;
-    input: React.RefObject<HTMLInputElement>;
-    searchInput: React.RefObject<SearchInput>;
-    setInputWidth(): void;
-    getCachedFilteredOptions: ((options: ComboBoxOption[], input: string) => ComboBoxOption[]) & memoize.Memoized<(options: ComboBoxOption[], input: string) => ComboBoxOption[]>;
-    focus(): void;
-    resetValue(): void;
-    updateInputValue(value: string): void;
-    handleResize(): void;
-    handleMenuKeyDown(event: React.KeyboardEvent): void;
-    handleMenuNavigation(direction: MENU_NAVIGATION_DIRECTION): void;
-    handleInputKeyDown(event: React.KeyboardEvent): void;
-    handleInputChange(event: React.ChangeEvent<HTMLInputElement>): void;
-    handleOptionClick(event: React.MouseEvent<HTMLButtonElement>): void;
-    handleOptionFocus(event: React.FocusEvent<HTMLButtonElement>): void;
-    handleFilterChange(event: React.ChangeEvent<HTMLInputElement>): void;
-    handleMenuBlur(event: React.FocusEvent): void;
-    handleInputBlur(event: React.FocusEvent<HTMLInputElement>): void;
-    handleMenuOpened(): void;
-    handleMenuExited(): void;
-    toggleMenu(event: React.MouseEvent<HTMLButtonElement>): void;
-    openMenu(): void;
-    closeMenu(focusInput?: boolean): void;
-    updateKeyboardIndex(): void;
-    scrollOptionIntoView(): void;
-    renderMenuElement(): JSX.Element;
-    renderOptions(): React.ReactNode;
-    render(): JSX.Element;
-}
-export default ComboBox;
-//# sourceMappingURL=ComboBox.d.ts.map

package/dist/ComboBox.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../src/ComboBox.tsx"],"names":[],"mappings":"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"}

package/dist/ComboBox.js

@@ -1,497 +0,0 @@
-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) { _defineProperty(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; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-/**
- * Combobox that combines a input box with a searchable dropdown menu
- *
- * props:
- * @param {array} options :[{
- *    title: 'option title for display',
- *    value: 'option value' //option value
- * }]
- * @param {string} inputPlaceholder place holder for the input box
- * @param {string} searchPlaceholder place holder for the search box in drop down search box
- * @param {boolean} disabled disable both input & drop down
- *
- *
- */
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import memoize from 'memoizee';
-import classNames from 'classnames';
-import SearchInput from "./SearchInput.js";
-import { Popper } from "./popper/index.js";
-import "./ComboBox.css";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-var MENU_NAVIGATION_DIRECTION;
-(function (MENU_NAVIGATION_DIRECTION) {
-  MENU_NAVIGATION_DIRECTION["UP"] = "UP";
-  MENU_NAVIGATION_DIRECTION["DOWN"] = "DOWN";
-})(MENU_NAVIGATION_DIRECTION || (MENU_NAVIGATION_DIRECTION = {}));
-class ComboBox extends Component {
-  constructor(props) {
-    super(props);
-    _defineProperty(this, "popper", void 0);
-    _defineProperty(this, "cbContainer", void 0);
-    _defineProperty(this, "toggleButton", void 0);
-    _defineProperty(this, "menuContainer", void 0);
-    _defineProperty(this, "input", void 0);
-    _defineProperty(this, "searchInput", void 0);
-    _defineProperty(this, "getCachedFilteredOptions", memoize((options, input) => options.filter(option => option.title.toLowerCase().indexOf(input.toLowerCase()) >= 0 || option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0)));
-    this.state = {
-      value: '',
-      filter: '',
-      filteredOptions: props.options,
-      keyboardOptionIndex: -1,
-      menuIsOpen: false,
-      inputWidth: 100
-    };
-    this.toggleMenu = this.toggleMenu.bind(this);
-    this.handleMenuKeyDown = this.handleMenuKeyDown.bind(this);
-    this.handleMenuBlur = this.handleMenuBlur.bind(this);
-    this.closeMenu = this.closeMenu.bind(this);
-    this.handleInputChange = this.handleInputChange.bind(this);
-    this.handleInputKeyDown = this.handleInputKeyDown.bind(this);
-    this.handleInputBlur = this.handleInputBlur.bind(this);
-    this.handleFilterChange = this.handleFilterChange.bind(this);
-    this.handleOptionClick = this.handleOptionClick.bind(this);
-    this.handleOptionFocus = this.handleOptionFocus.bind(this);
-    this.handleMenuOpened = this.handleMenuOpened.bind(this);
-    this.handleMenuExited = this.handleMenuExited.bind(this);
-    this.popper = /*#__PURE__*/React.createRef();
-    this.cbContainer = /*#__PURE__*/React.createRef();
-    this.toggleButton = /*#__PURE__*/React.createRef();
-    this.menuContainer = /*#__PURE__*/React.createRef();
-    this.input = /*#__PURE__*/React.createRef();
-    this.searchInput = /*#__PURE__*/React.createRef();
-  }
-  componentDidUpdate() {
-    var {
-      menuIsOpen,
-      keyboardOptionIndex
-    } = this.state;
-    if (menuIsOpen && keyboardOptionIndex >= 0) {
-      this.scrollOptionIntoView();
-    }
-  }
-  setInputWidth() {
-    if (this.cbContainer.current) {
-      this.setState({
-        inputWidth: this.cbContainer.current.getBoundingClientRect().width
-      });
-    }
-  }
-  focus() {
-    var _this$input$current;
-    (_this$input$current = this.input.current) === null || _this$input$current === void 0 ? void 0 : _this$input$current.focus();
-  }
-  resetValue() {
-    this.setState({
-      value: ''
-    });
-  }
-  updateInputValue(value) {
-    var {
-      onChange
-    } = this.props;
-    this.setState({
-      value
-    });
-    onChange(value);
-  }
-  handleResize() {
-    this.setInputWidth();
-  }
-  handleMenuKeyDown(event) {
-    var _menuOptions$keyboard, _this$input$current2;
-    var {
-      filter,
-      filteredOptions,
-      keyboardOptionIndex
-    } = this.state;
-    var {
-      options
-    } = this.props;
-    var menuOptions = filter ? filteredOptions : options;
-    switch (event.key) {
-      case 'Enter':
-        if (((_menuOptions$keyboard = menuOptions[keyboardOptionIndex]) === null || _menuOptions$keyboard === void 0 ? void 0 : _menuOptions$keyboard.value) != null) {
-          this.updateInputValue(menuOptions[keyboardOptionIndex].value);
-        }
-        this.closeMenu();
-        (_this$input$current2 = this.input.current) === null || _this$input$current2 === void 0 ? void 0 : _this$input$current2.focus();
-        event.stopPropagation();
-        event.preventDefault();
-        break;
-      case 'ArrowUp':
-        this.handleMenuNavigation(ComboBox.MENU_NAVIGATION_DIRECTION.UP);
-        event.stopPropagation();
-        event.preventDefault();
-        break;
-      case 'ArrowDown':
-        this.handleMenuNavigation(ComboBox.MENU_NAVIGATION_DIRECTION.DOWN);
-        event.stopPropagation();
-        event.preventDefault();
-        break;
-      case 'Escape':
-        if (filter !== '') {
-          this.setState({
-            filter: ''
-          });
-          event.stopPropagation(); // Don't trigger blur on input element
-        } else {
-          this.closeMenu();
-        }
-        break;
-      case 'Tab':
-        if (!event.shiftKey && keyboardOptionIndex === menuOptions.length - 1) {
-          this.closeMenu();
-        }
-        break;
-      default:
-        break;
-    }
-  }
-  handleMenuNavigation(direction) {
-    var {
-      filter,
-      filteredOptions,
-      keyboardOptionIndex
-    } = this.state;
-    var {
-      options
-    } = this.props;
-    var menuOptions = filter ? filteredOptions : options;
-    var menuOptionsLength = menuOptions.length;
-    var delta = 0;
-    switch (direction) {
-      case ComboBox.MENU_NAVIGATION_DIRECTION.UP:
-        delta = -1;
-        break;
-      case ComboBox.MENU_NAVIGATION_DIRECTION.DOWN:
-        delta = 1;
-        break;
-    }
-    if (delta !== 0) {
-      this.setState({
-        keyboardOptionIndex: (keyboardOptionIndex + delta + menuOptionsLength) % menuOptionsLength
-      });
-    }
-  }
-  handleInputKeyDown(event) {
-    var {
-      onEnter
-    } = this.props;
-    var {
-      menuIsOpen
-    } = this.state;
-    if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
-      if (!menuIsOpen) {
-        this.openMenu();
-      }
-    } else if (event.key === 'Enter') {
-      onEnter();
-    }
-  }
-  handleInputChange(event) {
-    this.updateInputValue(event.target.value);
-  }
-  handleOptionClick(event) {
-    var _this$input$current3;
-    var optionIndex = Number(event.currentTarget.value);
-    var {
-      filter,
-      filteredOptions
-    } = this.state;
-    var {
-      options
-    } = this.props;
-    var menuOptions = filter ? filteredOptions : options;
-    this.updateInputValue(menuOptions[optionIndex].value);
-    this.closeMenu();
-    (_this$input$current3 = this.input.current) === null || _this$input$current3 === void 0 ? void 0 : _this$input$current3.focus();
-  }
-  handleOptionFocus(event) {
-    this.setState({
-      keyboardOptionIndex: Number(event.target.value)
-    });
-  }
-  handleFilterChange(event) {
-    var _this$popper$current;
-    var {
-      options
-    } = this.props;
-    var filter = event.target.value;
-    var filteredOptions = this.getCachedFilteredOptions(options, filter);
-    this.setState({
-      filter,
-      filteredOptions,
-      keyboardOptionIndex: 0
-    });
-    (_this$popper$current = this.popper.current) === null || _this$popper$current === void 0 ? void 0 : _this$popper$current.scheduleUpdate();
-  }
-  handleMenuBlur(event) {
-    // close if menu blurs, unless its an internal option or the toggleButton which triggers close via click
-    if (event.relatedTarget instanceof Element && this.popper.current != null && this.popper.current.element.contains(event.relatedTarget) || event.relatedTarget === this.toggleButton.current) {
-      return;
-    }
-    this.closeMenu(false);
-  }
-  handleInputBlur(event) {
-    // if blur event is caused by focusing on search input or open menu by keyboard, don't close the menu
-    var {
-      menuIsOpen
-    } = this.state;
-    if (menuIsOpen && event.relatedTarget instanceof Element && this.popper.current != null && this.popper.current.element.contains(event.relatedTarget)) {
-      return;
-    }
-    this.closeMenu(false);
-  }
-  handleMenuOpened() {
-    var _this$searchInput$cur;
-    this.scrollOptionIntoView();
-    (_this$searchInput$cur = this.searchInput.current) === null || _this$searchInput$cur === void 0 ? void 0 : _this$searchInput$cur.focus();
-  }
-  handleMenuExited() {
-    var {
-      menuIsOpen
-    } = this.state;
-    if (menuIsOpen) {
-      var _this$popper$current2;
-      this.setState({
-        menuIsOpen: false
-      });
-      (_this$popper$current2 = this.popper.current) === null || _this$popper$current2 === void 0 ? void 0 : _this$popper$current2.hide();
-    }
-    this.setState({
-      filter: ''
-    });
-  }
-  toggleMenu(event) {
-    var {
-      menuIsOpen
-    } = this.state;
-    if (menuIsOpen) {
-      this.closeMenu();
-    } else {
-      this.openMenu();
-    }
-    event.stopPropagation();
-  }
-  openMenu() {
-    this.updateKeyboardIndex();
-    this.setInputWidth();
-    this.setState({
-      menuIsOpen: true
-    });
-    window.requestAnimationFrame(() => {
-      var _this$popper$current3;
-      (_this$popper$current3 = this.popper.current) === null || _this$popper$current3 === void 0 ? void 0 : _this$popper$current3.show();
-    });
-  }
-  closeMenu() {
-    var _this$popper$current4;
-    var focusInput = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-    this.setState({
-      menuIsOpen: false
-    });
-    if (focusInput) {
-      var _this$input$current4;
-      (_this$input$current4 = this.input.current) === null || _this$input$current4 === void 0 ? void 0 : _this$input$current4.focus();
-    }
-    (_this$popper$current4 = this.popper.current) === null || _this$popper$current4 === void 0 ? void 0 : _this$popper$current4.hide();
-  }
-  updateKeyboardIndex() {
-    var {
-      value,
-      filter,
-      filteredOptions
-    } = this.state;
-    var {
-      options
-    } = this.props;
-    var menuOptions = filter ? filteredOptions : options;
-    var valueIndex = menuOptions.findIndex(option => option.value === value);
-    this.setState({
-      keyboardOptionIndex: valueIndex
-    });
-  }
-  scrollOptionIntoView() {
-    var _this$menuContainer$c;
-    var activeOption = (_this$menuContainer$c = this.menuContainer.current) === null || _this$menuContainer$c === void 0 ? void 0 : _this$menuContainer$c.querySelector('.cb-option-btn.keyboard-active');
-    if (activeOption instanceof HTMLElement) {
-      activeOption.scrollIntoView({
-        block: 'nearest',
-        inline: 'nearest'
-      });
-    }
-  }
-  renderMenuElement() {
-    var {
-      searchPlaceholder
-    } = this.props;
-    var {
-      filter,
-      inputWidth
-    } = this.state;
-    return /*#__PURE__*/_jsxs("div", {
-      className: "cb-menu-container",
-      ref: this.menuContainer,
-      role: "presentation",
-      onKeyDown: this.handleMenuKeyDown,
-      onClick: event => {
-        event.stopPropagation();
-      },
-      style: {
-        width: inputWidth
-      },
-      onBlur: this.handleMenuBlur,
-      children: [/*#__PURE__*/_jsx("div", {
-        className: "cb-search-input-container",
-        children: /*#__PURE__*/_jsx(SearchInput, {
-          value: filter,
-          ref: this.searchInput,
-          onChange: this.handleFilterChange,
-          className: "cb-search-input",
-          placeholder: searchPlaceholder
-        })
-      }), /*#__PURE__*/_jsx("div", {
-        className: "cb-options-container",
-        children: /*#__PURE__*/_jsx("div", {
-          className: "cb-options",
-          children: this.renderOptions()
-        })
-      })]
-    });
-  }
-  renderOptions() {
-    var {
-      options
-    } = this.props;
-    var {
-      keyboardOptionIndex,
-      filter,
-      filteredOptions
-    } = this.state;
-    var menuOptions = filter ? filteredOptions : options;
-    return menuOptions.map((option, index) => {
-      var key = "option-".concat(index, "-").concat(option.value);
-      return /*#__PURE__*/_jsx("button", {
-        type: "button",
-        value: index,
-        className: classNames('cb-option-btn', {
-          'keyboard-active': keyboardOptionIndex === index
-        }),
-        onClick: this.handleOptionClick,
-        onFocus: this.handleOptionFocus,
-        children: option.title
-      }, key);
-    });
-  }
-  render() {
-    var {
-      options,
-      inputPlaceholder,
-      disabled,
-      className,
-      defaultValue,
-      spellCheck,
-      'data-testid': dataTestId
-    } = this.props;
-    var {
-      value
-    } = this.state;
-    var {
-      popperOptions
-    } = this.props;
-    popperOptions = _objectSpread({
-      placement: 'bottom-end',
-      modifiers: {
-        preventOverflow: {
-          enabled: false
-        }
-      }
-    }, popperOptions);
-    return /*#__PURE__*/_jsxs("div", {
-      className: "input-group cb-container",
-      ref: this.cbContainer,
-      children: [/*#__PURE__*/_jsx("input", {
-        value: value || defaultValue,
-        className: classNames('form-control', className, 'cb-input'),
-        ref: this.input,
-        onChange: this.handleInputChange,
-        placeholder: inputPlaceholder || (options[0] != null ? options[0].title : undefined),
-        disabled: disabled,
-        onBlur: this.handleInputBlur,
-        onKeyDown: this.handleInputKeyDown,
-        spellCheck: spellCheck,
-        "data-testid": dataTestId !== undefined ? "".concat(dataTestId, "-input") : undefined
-      }), /*#__PURE__*/_jsx("div", {
-        className: "input-group-append cb-dropdown",
-        children: /*#__PURE__*/_jsxs("button", {
-          // Mimic React Spectrum where dropdown button is not a tab stop
-          tabIndex: -1,
-          type: "button",
-          className: "btn cb-btn form-control",
-          ref: this.toggleButton,
-          onClick: this.toggleMenu,
-          onKeyDown: this.handleInputKeyDown,
-          disabled: disabled,
-          "data-testid": dataTestId !== undefined ? "".concat(dataTestId, "-btn") : undefined,
-          children: [/*#__PURE__*/_jsx("span", {
-            className: "cb-caret"
-          }), /*#__PURE__*/_jsx(Popper, {
-            ref: this.popper,
-            options: popperOptions,
-            className: classNames('combobox interactive'),
-            onEntered: this.handleMenuOpened,
-            onExited: this.handleMenuExited,
-            children: this.renderMenuElement()
-          })]
-        })
-      })]
-    });
-  }
-}
-_defineProperty(ComboBox, "MENU_NAVIGATION_DIRECTION", MENU_NAVIGATION_DIRECTION);
-_defineProperty(ComboBox, "DROP_DOWN_MENU_HEIGHT", 200);
-_defineProperty(ComboBox, "propTypes", {
-  options: PropTypes.arrayOf(PropTypes.shape({
-    title: PropTypes.string.isRequired,
-    value: PropTypes.string.isRequired
-  })).isRequired,
-  popperOptions: PropTypes.shape({
-    title: PropTypes.string.isRequired,
-    value: PropTypes.string.isRequired
-  }),
-  onChange: PropTypes.func,
-  inputPlaceholder: PropTypes.string,
-  searchPlaceholder: PropTypes.string,
-  disabled: PropTypes.bool,
-  className: PropTypes.string,
-  defaultValue: PropTypes.string,
-  spellCheck: PropTypes.bool,
-  onEnter: PropTypes.func,
-  'data-testid': PropTypes.string
-});
-_defineProperty(ComboBox, "defaultProps", {
-  onChange() {
-    // no-op
-  },
-  inputPlaceholder: '',
-  searchPlaceholder: 'Search',
-  disabled: false,
-  className: '',
-  defaultValue: '',
-  popperOptions: null,
-  spellCheck: true,
-  onEnter() {
-    // no-op
-  },
-  'data-testid': undefined
-});
-export default ComboBox;
-//# sourceMappingURL=ComboBox.js.map