@mantine/spotlight
Version:
Command center components for react and Mantine
90 lines (89 loc) • 4 kB
JavaScript
"use client";
const require_spotlight_store = require("./spotlight.store.cjs");
const require_is_actions_group = require("./is-actions-group.cjs");
const require_default_spotlight_filter = require("./default-spotlight-filter.cjs");
const require_limit_actions = require("./limit-actions.cjs");
const require_Spotlight_module = require("./Spotlight.module.cjs");
const require_SpotlightAction = require("./SpotlightAction.cjs");
const require_SpotlightActionsGroup = require("./SpotlightActionsGroup.cjs");
const require_SpotlightActionsList = require("./SpotlightActionsList.cjs");
const require_SpotlightEmpty = require("./SpotlightEmpty.cjs");
const require_SpotlightFooter = require("./SpotlightFooter.cjs");
const require_SpotlightRoot = require("./SpotlightRoot.cjs");
const require_SpotlightSearch = require("./SpotlightSearch.cjs");
let _mantine_hooks = require("@mantine/hooks");
let _mantine_core = require("@mantine/core");
let react_jsx_runtime = require("react/jsx-runtime");
//#region packages/@mantine/spotlight/src/Spotlight.tsx
const defaultProps = {
size: 600,
yOffset: 80,
limit: Infinity,
zIndex: (0, _mantine_core.getDefaultZIndex)("max"),
overlayProps: {
backgroundOpacity: .35,
blur: 7
},
transitionProps: {
duration: 200,
transition: "pop"
},
store: require_spotlight_store.spotlightStore,
filter: require_default_spotlight_filter.defaultSpotlightFilter,
clearQueryOnClose: true,
closeOnActionTrigger: true,
shortcut: "mod + K"
};
const Spotlight = (0, _mantine_core.factory)((_props) => {
const { searchProps, filter, query, onQueryChange, actions, nothingFound, highlightQuery, limit, scrollAreaProps, ...others } = (0, _mantine_core.useProps)("Spotlight", defaultProps, _props);
const [_query, setQuery] = (0, _mantine_hooks.useUncontrolled)({
value: query,
defaultValue: "",
finalValue: "",
onChange: onQueryChange
});
const filteredActions = require_limit_actions.limitActions(filter(_query, actions), limit).map((item) => {
if (require_is_actions_group.isActionsGroup(item)) {
const items = item.actions.map(({ id, ...actionData }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SpotlightAction.SpotlightAction, {
highlightQuery,
...actionData
}, id));
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SpotlightActionsGroup.SpotlightActionsGroup, {
label: item.group,
children: items
}, item.group);
}
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SpotlightAction.SpotlightAction, {
highlightQuery,
...item
}, item.id);
});
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_SpotlightRoot.SpotlightRoot, {
...others,
query: _query,
onQueryChange: setQuery,
children: [
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SpotlightSearch.SpotlightSearch, { ...searchProps }),
filteredActions.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SpotlightActionsList.SpotlightActionsList, {
...scrollAreaProps,
children: filteredActions
}),
filteredActions.length === 0 && nothingFound && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SpotlightEmpty.SpotlightEmpty, { children: nothingFound })
]
});
});
Spotlight.classes = require_Spotlight_module.default;
Spotlight.displayName = "@mantine/spotlight/Spotlight";
Spotlight.Search = require_SpotlightSearch.SpotlightSearch;
Spotlight.ActionsList = require_SpotlightActionsList.SpotlightActionsList;
Spotlight.Action = require_SpotlightAction.SpotlightAction;
Spotlight.Empty = require_SpotlightEmpty.SpotlightEmpty;
Spotlight.ActionsGroup = require_SpotlightActionsGroup.SpotlightActionsGroup;
Spotlight.Footer = require_SpotlightFooter.SpotlightFooter;
Spotlight.Root = require_SpotlightRoot.SpotlightRoot;
Spotlight.open = require_spotlight_store.spotlight.open;
Spotlight.close = require_spotlight_store.spotlight.close;
Spotlight.toggle = require_spotlight_store.spotlight.toggle;
//#endregion
exports.Spotlight = Spotlight;
//# sourceMappingURL=Spotlight.cjs.map