UNPKG

@appbaseio/reactivesearch-vue

Version:

A Vue UI components library for building search experiences

332 lines (314 loc) 11.8 kB
'use strict'; var reactivecore = require('@appbaseio/reactivecore'); var constants = require('@appbaseio/reactivecore/lib/utils/constants'); var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-1a877b17.js'); var redux = require('redux'); // Credit to React-Redux for this util function // https://github.com/reactjs/react-redux/blob/573db0bfc8d1d50fdb6e2a98bd8a7d4675fecf11/src/utils/shallowEqual.js var hasOwn = Object.prototype.hasOwnProperty; function is(x, y) { if (x === y) { return x !== 0 || y !== 0 || 1 / x === 1 / y; } // eslint-disable-next-line return x !== x && y !== y; } function shallowEqual(objA, objB) { if (is(objA, objB)) return true; if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) { return false; } var keysA = Object.keys(objA); var keysB = Object.keys(objB); if (keysA.length !== keysB.length) return false; for (var i = 0; i < keysA.length; i += 1) { if (!hasOwn.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) { return false; } } return true; } var defaultMapState = function defaultMapState() { return {}; }; var defaultMapDispatch = {}; var normalizeMapState = function normalizeMapState(mapState) { if (typeof mapState === 'function') return mapState; if (mapState === Object(mapState)) { return function (state, ownProps) { return Object.keys(mapState).filter(function (key) { return typeof mapState[key] === 'function'; }).reduce(function (map, key) { var _extends2; return _rollupPluginBabelHelpers._extends({}, map, (_extends2 = {}, _extends2[key] = mapState[key](state, ownProps), _extends2)); }, {}); }; } throw new Error('[revux] - mapState provided to connect is invalid'); }; // eslint-disable-next-line var connector = function connector(_mapState, mapDispatch) { if (_mapState === void 0) { _mapState = defaultMapState; } if (mapDispatch === void 0) { mapDispatch = defaultMapDispatch; } return function (component) { var mapState = normalizeMapState(_mapState); return { name: "connect-" + component.name, mixins: [component], inject: ['$$store'], data: function data() { var merged = _rollupPluginBabelHelpers._extends({}, mapState(this.$$store.getState(), this.$props || {}), redux.bindActionCreators(mapDispatch, this.$$store.dispatch)); return Object.keys(merged).reduce(function (data, key) { var _extends3; return _rollupPluginBabelHelpers._extends({}, data, (_extends3 = {}, _extends3[key] = merged[key], _extends3)); }, {}); }, created: function created() { var _this = this; var getMappedState = function getMappedState(state) { return mapState(state, _this.$props || {}); }; var observeStore = function observeStore(store, select, onChange) { var currentState = select(store.getState()); return store.subscribe(function () { var nextState = select(store.getState()); if (!shallowEqual(currentState, nextState)) { var previousState = currentState; currentState = nextState; onChange(currentState, previousState); } }); }; this._unsubscribe = observeStore(this.$$store, getMappedState, function (newState) { Object.keys(newState).forEach(function (key) { _this[key] = newState[key]; }); }); }, beforeUnmount: function beforeUnmount() { this._unsubscribe(); } }; }; }; var defaultQueryUtil = reactivecore.helper.updateDefaultQuery, customQueryUtil = reactivecore.helper.updateCustomQuery, isEqual = reactivecore.helper.isEqual; // TODO // import { storeKey } from '@appbaseio/reactivecore'; var connect = function connect() { return connector.apply(void 0, arguments); }; var X_SEARCH_CLIENT = 'ReactiveSearch Vue'; var composeThemeObject = function composeThemeObject(ownTheme, userThemeParam) { if (ownTheme === void 0) { ownTheme = {}; } if (userThemeParam === void 0) { userThemeParam = {}; } var userTheme = {}; if (typeof userThemeParam !== 'boolean' && Object.keys(userThemeParam).length) { userTheme = _rollupPluginBabelHelpers._extends({}, userThemeParam); } return { typography: _rollupPluginBabelHelpers._extends({}, ownTheme.typography, userTheme.typography), colors: _rollupPluginBabelHelpers._extends({}, ownTheme.colors, userTheme.colors), component: _rollupPluginBabelHelpers._extends({}, ownTheme.component, userTheme.component) }; }; /** * To determine wether an element is a function * @param {any} element */ var isFunction = function isFunction(element) { return typeof element === 'function'; }; // parses current array (i.e. this.$props.value) for `onChange` callback for multi-* components function parseValueArray(objectValues, currentValue) { var selectedValues; if (Array.isArray(objectValues)) { selectedValues = [].concat(objectValues); } else { var keys = Object.keys(objectValues); selectedValues = keys.map(function (key) { return objectValues[key] ? key : null; }); } if (selectedValues.includes(currentValue)) { return selectedValues.filter(function (item) { return item !== currentValue; }); } return [].concat(selectedValues, [currentValue]); } /** * Extracts the render prop from props or slot and returns a valid JSX element * @param {Object} data * @param _ref */ var getComponent = function getComponent(data, _ref) { if (data === void 0) { data = {}; } if (_ref === void 0) { _ref = {}; } var _ref2 = _ref.$slots || _ref.$props, render = _ref2.render; if (render) return render(data); return null; }; /** * To determine whether a component has render prop or slot defined or not * @returns {Boolean} */ var hasCustomRenderer = function hasCustomRenderer(_ref) { if (_ref === void 0) { _ref = {}; } var _ref3 = _ref.$slots || _ref.$props, render = _ref3.render; return Boolean(render); }; var getValidPropsKeys = function getValidPropsKeys(props) { if (props === void 0) { props = {}; } return Object.keys(props).filter(function (i) { return constants.validProps.includes(i); }); }; var isEvent = function isEvent(candidate) { return !!(candidate && candidate.stopPropagation && candidate.preventDefault); }; var updateDefaultQuery = function updateDefaultQuery(componentId, setDefaultQuery, props, value) { defaultQueryUtil(componentId, _rollupPluginBabelHelpers._extends({}, props, { setDefaultQuery: setDefaultQuery }), value); }; var updateCustomQuery = function updateCustomQuery(componentId, setCustomQuery, props, value) { customQueryUtil(componentId, _rollupPluginBabelHelpers._extends({}, props, { setCustomQuery: setCustomQuery }), value); }; /** * @param {Function} newVal * @param {Function} oldVal * @param {any} value * @param {Object} props */ var isQueryIdentical = function isQueryIdentical(newVal, oldVal, value, props) { if (typeof newVal !== 'function' || typeof oldVal !== 'function') return true; // to not call original defaultQuery and customQuery, as here we are only comparing return isEqual(oldVal(value, props), newVal(value, props)); }; /** * To get the camel case string from kebab case * @returns {string} */ var getCamelCase = function getCamelCase(str) { if (str === void 0) { str = ''; } var propsWhichRequirePascalCase = ['u-r-l-params']; var arr = str.split('-'); var capital = arr.map(function (item, index) { return index ? item.charAt(0).toUpperCase() + item.slice(1).toLowerCase() : item; }); // ^-- change here. var capitalString = capital.join(''); if (propsWhichRequirePascalCase.includes(str)) capitalString = capitalString[0].toUpperCase() + capitalString.substring(1); return capitalString || ''; }; var isEmpty = function isEmpty(val) { return !(val && val.length && Object.keys(val).length); }; function isNumeric(value) { return /^-?\d+$/.test(value); } // check if passed shortcut a key combination function isHotkeyCombination(hotkey) { return typeof hotkey === 'string' && hotkey.indexOf('+') !== -1; } // used for getting correct string char from keycode passed // the below algebraic expression is used to get the correct ascii code out of the e.which || e.keycode returned value // since the keyboards doesn't understand ascii but scan codes and they differ for certain keys such as '/' // stackoverflow ref: https://stackoverflow.com/a/29811987/10822996 function getCharFromCharCode(passedCharCode) { var which = passedCharCode; var chrCode = which - 48 * Math.floor(which / 48); return String.fromCharCode(which >= 96 ? chrCode : which); } // used for parsing focusshortcuts for keycodes passed as string, eg: 'ctrl+/' is same as 'ctrl+47' // returns focusShortcuts containing appropriate key charsas depicted on keyboards function parseFocusShortcuts(focusShortcutsArray) { if (isEmpty(focusShortcutsArray)) return []; var parsedFocusShortcutsArray = []; focusShortcutsArray.forEach(function (element) { if (typeof element === 'string') { if (isHotkeyCombination(element)) { // splitting the combination into pieces var splitCombination = element.split('+'); var parsedSplitCombination = []; // parsedCombination would have all the keycodes converted into chars var parsedCombination = ''; for (var i = 0; i < splitCombination.length; i += 1) { if (isNumeric(splitCombination[i])) { parsedSplitCombination.push(getCharFromCharCode(+splitCombination[i])); } else { parsedSplitCombination.push(splitCombination[i]); } } parsedCombination = parsedSplitCombination.join('+'); parsedFocusShortcutsArray.push(parsedCombination); } else if (isNumeric(element)) { parsedFocusShortcutsArray.push(getCharFromCharCode(+element)); } else { // single char shortcut, eg: '/' parsedFocusShortcutsArray.push(element); } } else { // if not a string the the shortcut is assumed to be a keycode parsedFocusShortcutsArray.push(getCharFromCharCode(element)); } }); return parsedFocusShortcutsArray; } var MODIFIER_KEYS = ['shift', 'ctrl', 'alt', 'control', 'option', 'cmd', 'command']; // filter out modifierkeys such as ctrl, alt, command, shift from focusShortcuts prop function extractModifierKeysFromFocusShortcuts(focusShortcutsArray) { return focusShortcutsArray.filter(function (shortcutKey) { return MODIFIER_KEYS.includes(shortcutKey); }); } function decodeHtml(str) { if (typeof str !== 'string') { return str; } return str.replace(/&#([0-9]{1,3});/gi, function (match, numStr) { var num = parseInt(numStr, 10); // read num as normal number return String.fromCharCode(num); }); } exports.X_SEARCH_CLIENT = X_SEARCH_CLIENT; exports.composeThemeObject = composeThemeObject; exports.connect = connect; exports.decodeHtml = decodeHtml; exports.extractModifierKeysFromFocusShortcuts = extractModifierKeysFromFocusShortcuts; exports.getCamelCase = getCamelCase; exports.getComponent = getComponent; exports.getValidPropsKeys = getValidPropsKeys; exports.hasCustomRenderer = hasCustomRenderer; exports.isEmpty = isEmpty; exports.isEvent = isEvent; exports.isFunction = isFunction; exports.isQueryIdentical = isQueryIdentical; exports.parseFocusShortcuts = parseFocusShortcuts; exports.parseValueArray = parseValueArray; exports.updateCustomQuery = updateCustomQuery; exports.updateDefaultQuery = updateDefaultQuery;