@rescui/select 0.1.1

package/lib/state/select/selectors.js

@@ -0,0 +1,114 @@
+import "core-js/modules/web.dom-collections.for-each.js";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+import _toConsumableArray from "@babel/runtime-corejs3/helpers/esm/toConsumableArray";
+
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, 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) { _defineProperty(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; }
+
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
+import _findIndexInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find-index";
+
+var getGroups = function getGroups(state) {
+  return state.searchString && state.searchString !== '' ? state.filteredGroups : state.groups;
+};
+
+var getCursorIndex = function getCursorIndex(state) {
+  return state.cursorIndex;
+};
+
+var isIndexMatchCursor = function isIndexMatchCursor(state, index) {
+  var cursorIndex = getCursorIndex(state);
+  if (cursorIndex === null) return false;
+  return index[0] === cursorIndex[0] && index[1] === cursorIndex[1];
+};
+
+var isEmpty = function isEmpty(state) {
+  var groups = getGroups(state);
+  return groups.length === 0 || groups.every(function (g) {
+    return !g.options || g.options.length === 0;
+  });
+};
+
+var withoutGroupsLabel = function withoutGroupsLabel(_ref) {
+  var groups = _ref.groups;
+  return groups.every(function (g) {
+    return !g.label;
+  });
+};
+
+var OptionGroupTypes = {
+  HEADER: 'header',
+  OPTION: 'option',
+  DIVIDER: 'divider'
+};
+
+function optionsNotEmpty(options) {
+  return options && options.length > 0;
+}
+
+var getPlainOptionsFromGroups = function getPlainOptionsFromGroups(groups) {
+  return groups.reduce( // eslint-disable-next-line no-shadow
+  function (acc, group, i) {
+    var _context, _context2, _context3;
+
+    return _concatInstanceProperty(acc).call(acc, _filterInstanceProperty(_context = _concatInstanceProperty(_context2 = [optionsNotEmpty(group.options) && i !== 0 && !group.label && {
+      type: OptionGroupTypes.DIVIDER
+    }, optionsNotEmpty(group.options) && group.label && {
+      type: OptionGroupTypes.HEADER,
+      label: group.label
+    }]).call(_context2, _toConsumableArray(_mapInstanceProperty(_context3 = group.options).call(_context3, function (option, j) {
+      return _objectSpread(_objectSpread({}, option), {}, {
+        index: [i, j],
+        type: OptionGroupTypes.OPTION
+      });
+    })))).call(_context, function (e) {
+      return e;
+    }));
+  }, []);
+};
+
+var getPlainOptions = function getPlainOptions(state) {
+  return getPlainOptionsFromGroups(getGroups(state));
+};
+
+function getOptionValue(option) {
+  return typeof option.value === 'string' ? option.value : option.label;
+}
+
+var getSelectedValue = function getSelectedValue(state) {
+  if (state.selected === null) {
+    return null;
+  }
+
+  var selected = Array.isArray(state.selected) ? state.selected[0] : state.selected;
+  return getOptionValue(selected);
+};
+
+var getSelected = function getSelected(state) {
+  return state.selected;
+};
+
+var getDefaultCursorIndex = function getDefaultCursorIndex(groups) {
+  if (groups.length === 0) {
+    return null;
+  }
+
+  var firstNonEmptyGroupIndex = _findIndexInstanceProperty(groups).call(groups, function (group) {
+    return group.options && group.options.length > 0;
+  });
+
+  if (firstNonEmptyGroupIndex === -1) {
+    return null;
+  }
+
+  return [firstNonEmptyGroupIndex, 0];
+};
+
+export { OptionGroupTypes, getCursorIndex, getDefaultCursorIndex, getGroups, getOptionValue, getPlainOptions, getPlainOptionsFromGroups, getSelected, getSelectedValue, isEmpty, isIndexMatchCursor, withoutGroupsLabel };

package/lib/types.d.ts

@@ -0,0 +1,51 @@
+export declare type SelectSize = 'l' | 'm' | 's';
+export declare type SelectMode = 'classic' | 'rock';
+export declare type SelectOption = {
+    label: string;
+    value?: string;
+    disabled?: boolean;
+};
+export declare type SelectOptionsGroup = {
+    label?: string;
+    disabled?: boolean;
+    options: SelectOption[];
+};
+export declare type SelectOptionOrGroup = SelectOption | SelectOptionsGroup;
+export declare type SelectOptions = SelectOptionOrGroup[];
+export declare type Groups = SelectOptionsGroup[];
+export declare type Index = [number, number];
+export declare type State = {
+    groups: Groups;
+    menuIsOpen: boolean;
+    selected: SelectOption | SelectOption[];
+    searchString: string;
+    filteredGroups: Groups;
+    cursorIndex: Index;
+    hideSelected?: boolean;
+    groupsWithoutSelected?: Groups;
+};
+export declare type PartialState = Partial<State>;
+export interface GetGroups {
+    (state: State): Groups;
+}
+export interface IsEmpty {
+    (state: State): boolean;
+}
+export declare type Overrides = {
+    getGroups?: GetGroups;
+    isEmpty?: IsEmpty;
+};
+export declare type Action = {
+    type: string;
+    [key: string]: any;
+};
+export interface SelectReducer {
+    (state: State, action: Action): State;
+}
+export declare type FilterFn = (option: SelectOption) => boolean;
+export declare type NoOptionsMessageConfig = {
+    noOptions: string;
+    nothingFound?: string;
+    loading?: string;
+};
+export declare type NoOptionsMessage = string | NoOptionsMessageConfig;

package/lib/utils.d.ts

@@ -0,0 +1,8 @@
+import { Theme } from '@rescui/ui-contexts';
+import type { SelectOptionOrGroup, SelectOptionsGroup, NoOptionsMessage, SelectSize } from './types';
+export declare function shouldOpenSelect(key: string, isTriggerTarget?: boolean): boolean;
+export declare function getEmptyMessage(isLoading: boolean, isNothingFound: boolean, noOptionsMessage: NoOptionsMessage): string;
+export declare function escapeRegex(str: string): string;
+export declare function convertToOptionGroupsIfNeeded(optionsOrGroups?: SelectOptionOrGroup[]): SelectOptionsGroup[];
+export declare const calculateMaxHeight: (size: SelectSize) => number;
+export declare const reverseTheme: (theme: Theme) => "light" | "dark";

package/lib/utils.js

@@ -0,0 +1,102 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, 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) { _defineProperty(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; }
+
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.regexp.exec.js";
+import "core-js/modules/es.string.replace.js";
+import "core-js/modules/web.dom-collections.for-each.js";
+import { ARROW_DOWN, ARROW_UP, SPACE, ENTER } from './key-codes.js';
+var DEFAULT_NO_OPTIONS_MESSAGES = {
+  noOptions: 'No options',
+  nothingFound: 'Nothing found',
+  loading: 'Loading...'
+};
+var MAX_VISIBLE_ITEMS = 5;
+var ITEM_HEIGHT_BY_SIZE = {
+  s: 32,
+  m: 40,
+  l: 52
+};
+
+var isOptionsGroup = function isOptionsGroup(optionOrGroup) {
+  return typeof optionOrGroup.options !== 'undefined';
+};
+
+function shouldOpenSelect(key) {
+  var isTriggerTarget = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  return key === ARROW_DOWN || key === ARROW_UP || (key === SPACE || key === ENTER) && isTriggerTarget;
+}
+
+function isString(s) {
+  return Object.prototype.toString.call(s) === '[object String]';
+}
+
+function getEmptyMessage(isLoading, isNothingFound, noOptionsMessage) {
+  var _ref = isString(noOptionsMessage) ? _objectSpread(_objectSpread({}, DEFAULT_NO_OPTIONS_MESSAGES), {}, {
+    noOptions: noOptionsMessage
+  }) : _objectSpread(_objectSpread({}, DEFAULT_NO_OPTIONS_MESSAGES), noOptionsMessage),
+      noOptions = _ref.noOptions,
+      nothingFound = _ref.nothingFound,
+      loading = _ref.loading;
+
+  if (isLoading) {
+    return loading;
+  } else if (isNothingFound) {
+    return nothingFound;
+  } else {
+    return noOptions;
+  }
+}
+
+function escapeRegex(str) {
+  return str.replace(/[\-\[\]\/{}()\*+?.\\^$|]/g, '\\$&');
+}
+
+function convertToOptionGroupsIfNeeded() {
+  var optionsOrGroups = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var newOptions = [];
+  var topLevelOptions = [];
+  optionsOrGroups.forEach(function (optionOrGroup) {
+    if (isOptionsGroup(optionOrGroup)) {
+      if (topLevelOptions.length) {
+        newOptions.push({
+          options: topLevelOptions
+        });
+        topLevelOptions = [];
+      }
+
+      newOptions.push(optionOrGroup);
+    } else {
+      topLevelOptions.push(optionOrGroup);
+    }
+  });
+
+  if (topLevelOptions.length) {
+    newOptions.push({
+      options: topLevelOptions
+    });
+    topLevelOptions = [];
+  }
+
+  return newOptions;
+}
+
+var calculateMaxHeight = function calculateMaxHeight(size) {
+  var itemHeight = ITEM_HEIGHT_BY_SIZE[size]; // half of item added to show that there is more items even if scroll bar hidden
+
+  return (Math.ceil(MAX_VISIBLE_ITEMS) + 0.5) * itemHeight;
+};
+
+var reverseTheme = function reverseTheme(theme) {
+  return theme === 'dark' ? 'light' : 'dark';
+};
+
+export { calculateMaxHeight, convertToOptionGroupsIfNeeded, escapeRegex, getEmptyMessage, reverseTheme, shouldOpenSelect };

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@rescui/select",
+  "version": "0.1.1",
+  "description": "",
+  "license": "Apache-2.0",
+  "author": "JetBrains",
+  "main": "lib/index.js",
+  "src:main": "src/index.ts",
+  "files": [
+    "lib",
+    "LICENSE.txt"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@babel/runtime-corejs3": "^7.14.0",
+    "@juggle/resize-observer": "3.3.0",
+    "@rescui/dropdown": "^0.2.4",
+    "@rescui/icons": "^0.6.1",
+    "@rescui/menu": "^0.4.0",
+    "@rescui/tag": "^0.3.0",
+    "@rescui/typography": "^0.7.0",
+    "classnames": "^2.2.6",
+    "core-js": "^3.9.1",
+    "just-throttle": "^4.0.1",
+    "scroll-into-view-if-needed": "2.2.20"
+  },
+  "peerDependencies": {
+    "@rescui/ui-contexts": "<1.0.0",
+    "prop-types": "^15.7.2",
+    "react": ">=16.8.0 <18"
+  },
+  "devDependencies": {
+    "@rescui/colors": "^0.1.0",
+    "@rescui/postcss-preset-library": "^0.0.4",
+    "@rescui/scripts": "^0.1.4",
+    "@rescui/visual-regression": "^0.0.1",
+    "postcss": "^8.3.0",
+    "sniffr": "^1.2.0"
+  },
+  "scripts": {
+    "build": "rescui-scripts build --css-modules"
+  },
+  "gitHead": "ed479e17beebb317d22ad5df6c3877886bb0ea01"
+}