@it-corp/vpbank-spotlight/cjs/Spotlight.cjs

Command center components for react and VPbank components

'use client';
'use strict';

var React = require('react');
var vpbankCore = require('@it-corp/vpbank-core');
var vpbankHooks = require('@it-corp/vpbank-hooks');
var defaultSpotlightFilter = require('./default-spotlight-filter.cjs');
var isActionsGroup = require('./is-actions-group.cjs');
var limitActions = require('./limit-actions.cjs');
var spotlight_store = require('./spotlight.store.cjs');
var SpotlightAction = require('./SpotlightAction.cjs');
var SpotlightActionsGroup = require('./SpotlightActionsGroup.cjs');
var SpotlightActionsList = require('./SpotlightActionsList.cjs');
var SpotlightEmpty = require('./SpotlightEmpty.cjs');
var SpotlightFooter = require('./SpotlightFooter.cjs');
var SpotlightRoot = require('./SpotlightRoot.cjs');
var SpotlightSearch = require('./SpotlightSearch.cjs');
var Spotlight_module = require('./Spotlight.module.css.cjs');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);

const defaultProps = {
  size: 600,
  yOffset: 80,
  limit: Infinity,
  zIndex: vpbankCore.getDefaultZIndex("max"),
  overlayProps: { backgroundOpacity: 0.35, blur: 7 },
  transitionProps: { duration: 200, transition: "pop" },
  store: spotlight_store.spotlightStore,
  filter: defaultSpotlightFilter.defaultSpotlightFilter,
  clearQueryOnClose: true,
  closeOnActionTrigger: true,
  shortcut: "mod + K",
  highlightQuery: false
};
const Spotlight = vpbankCore.factory((_props, ref) => {
  const props = vpbankCore.useProps("Spotlight", defaultProps, _props);
  const {
    searchProps,
    filter,
    query,
    onQueryChange,
    actions,
    nothingFound,
    highlightQuery,
    limit,
    ...others
  } = props;
  const [_query, setQuery] = vpbankHooks.useUncontrolled({
    value: query,
    defaultValue: "",
    finalValue: "",
    onChange: onQueryChange
  });
  const filteredActions = limitActions.limitActions(filter(_query, actions), limit).map(
    (item) => {
      if (isActionsGroup.isActionsGroup(item)) {
        const items = item.actions.map(({ id, ...actionData }) => /* @__PURE__ */ React__default.default.createElement(
          SpotlightAction.SpotlightAction,
          {
            key: id,
            highlightQuery,
            ...actionData
          }
        ));
        return /* @__PURE__ */ React__default.default.createElement(SpotlightActionsGroup.SpotlightActionsGroup, { key: item.group, label: item.group }, items);
      }
      return /* @__PURE__ */ React__default.default.createElement(
        SpotlightAction.SpotlightAction,
        {
          key: item.id,
          highlightQuery,
          ...item
        }
      );
    }
  );
  return /* @__PURE__ */ React__default.default.createElement(
    SpotlightRoot.SpotlightRoot,
    {
      ...others,
      query: _query,
      onQueryChange: setQuery,
      ref
    },
    /* @__PURE__ */ React__default.default.createElement(SpotlightSearch.SpotlightSearch, { ...searchProps }),
    /* @__PURE__ */ React__default.default.createElement(SpotlightActionsList.SpotlightActionsList, null, filteredActions, filteredActions.length === 0 && nothingFound && /* @__PURE__ */ React__default.default.createElement(SpotlightEmpty.SpotlightEmpty, null, nothingFound))
  );
});
Spotlight.classes = Spotlight_module;
Spotlight.displayName = "@it-corp/vpbank-spotlight/Spotlight";
Spotlight.Search = SpotlightSearch.SpotlightSearch;
Spotlight.ActionsList = SpotlightActionsList.SpotlightActionsList;
Spotlight.Action = SpotlightAction.SpotlightAction;
Spotlight.Empty = SpotlightEmpty.SpotlightEmpty;
Spotlight.ActionsGroup = SpotlightActionsGroup.SpotlightActionsGroup;
Spotlight.Footer = SpotlightFooter.SpotlightFooter;
Spotlight.Root = SpotlightRoot.SpotlightRoot;
Spotlight.open = spotlight_store.spotlight.open;
Spotlight.close = spotlight_store.spotlight.close;
Spotlight.toggle = spotlight_store.spotlight.toggle;

exports.Spotlight = Spotlight;
//# sourceMappingURL=Spotlight.cjs.map