{"version":3,"file":"SpotlightAction.cjs","names":["useSpotlightContext","Highlight","UnstyledButton","Box","classes"],"sources":["../src/SpotlightAction.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  Highlight,\n  MantineColor,\n  UnstyledButton,\n  useProps,\n} from '@mantine/core';\nimport { useSpotlightContext } from './Spotlight.context';\nimport { spotlightActions } from './spotlight.store';\nimport classes from './Spotlight.module.css';\n\nexport type SpotlightActionStylesNames =\n  | 'action'\n  | 'actionLabel'\n  | 'actionDescription'\n  | 'actionSection'\n  | 'actionBody';\n\nexport interface SpotlightActionProps\n  extends BoxProps, CompoundStylesApiProps<SpotlightActionFactory>, ElementProps<'button'> {\n  /** Action label, pass string to use in default filter */\n  label?: string;\n\n  /** Action description, pass string to use in default filter */\n  description?: string;\n\n  /** Section displayed on the left side of the label, for example, icon */\n  leftSection?: React.ReactNode;\n\n  /** Section displayed on the right side of the label, for example, hotkey */\n  rightSection?: React.ReactNode;\n\n  /** Children override default action elements, if passed, label, description and sections are hidden */\n  children?: React.ReactNode;\n\n  /** Determines whether left and right sections should have dimmed styles @default true */\n  dimmedSections?: boolean;\n\n  /** Determines whether search query should be highlighted in action label @default false */\n  highlightQuery?: boolean;\n\n  /** Key of `theme.colors` of any valid CSS color that will be used to highlight search query @default 'yellow' */\n  highlightColor?: MantineColor;\n\n  /** Determines whether the spotlight should be closed when action is triggered, overrides `closeOnActionTrigger` prop set on `Spotlight` */\n  closeSpotlightOnTrigger?: boolean;\n\n  /** Keywords that are used for default filtering, not displayed anywhere, can be a string: \"react,router,javascript\" or an array: ['react', 'router', 'javascript'] */\n  keywords?: string | string[];\n}\n\nexport type SpotlightActionFactory = Factory<{\n  props: SpotlightActionProps;\n  ref: HTMLButtonElement;\n  stylesNames: SpotlightActionStylesNames;\n  compound: true;\n}>;\n\nconst defaultProps = {\n  dimmedSections: true,\n  highlightQuery: false,\n} satisfies Partial<SpotlightActionProps>;\n\nexport const SpotlightAction = factory<SpotlightActionFactory>((_props) => {\n  const props = useProps('SpotlightAction', defaultProps, _props);\n  const {\n    className,\n    style,\n    classNames,\n    styles,\n    id,\n    description,\n    label,\n    leftSection,\n    rightSection,\n    children,\n    dimmedSections,\n    highlightQuery,\n    highlightColor,\n    closeSpotlightOnTrigger,\n    onClick,\n    onMouseDown,\n    keywords,\n    vars,\n    ...others\n  } = props;\n\n  const ctx = useSpotlightContext();\n\n  const stylesApi = { classNames, styles };\n\n  const labelNode =\n    highlightQuery && typeof label === 'string' ? (\n      <Highlight\n        component=\"span\"\n        highlight={ctx.query}\n        color={highlightColor}\n        {...ctx.getStyles('actionLabel', stylesApi)}\n      >\n        {label}\n      </Highlight>\n    ) : (\n      <span {...ctx.getStyles('actionLabel', stylesApi)}>{label}</span>\n    );\n\n  return (\n    <UnstyledButton\n      data-action\n      {...ctx.getStyles('action', { className, style, ...stylesApi })}\n      {...others}\n      onMouseDown={(event) => {\n        event.preventDefault();\n        onMouseDown?.(event);\n      }}\n      onClick={(event) => {\n        onClick?.(event);\n        if (closeSpotlightOnTrigger ?? ctx.closeOnActionTrigger) {\n          spotlightActions.close(ctx.store);\n        }\n      }}\n      tabIndex={-1}\n    >\n      {children || (\n        <>\n          {leftSection && (\n            <Box\n              component=\"span\"\n              mod={{ position: 'left', dimmed: dimmedSections }}\n              {...ctx.getStyles('actionSection', stylesApi)}\n            >\n              {leftSection}\n            </Box>\n          )}\n\n          <span {...ctx.getStyles('actionBody', stylesApi)}>\n            {labelNode}\n            <span {...ctx.getStyles('actionDescription', stylesApi)}>{description}</span>\n          </span>\n\n          {rightSection && (\n            <Box\n              component=\"span\"\n              mod={{ position: 'right', dimmed: dimmedSections }}\n              {...ctx.getStyles('actionSection', stylesApi)}\n            >\n              {rightSection}\n            </Box>\n          )}\n        </>\n      )}\n    </UnstyledButton>\n  );\n});\n\nSpotlightAction.classes = classes;\nSpotlightAction.displayName = '@mantine/spotlight/SpotlightAction';\n"],"mappings":";;;;;;;AA+DA,MAAM,eAAe;CACnB,gBAAgB;CAChB,gBAAgB;AAClB;AAEA,MAAa,mBAAA,GAAA,cAAA,UAAmD,WAAW;CAEzE,MAAM,EACJ,WACA,OACA,YACA,QACA,IACA,aACA,OACA,aACA,cACA,UACA,gBACA,gBACA,gBACA,yBACA,SACA,aACA,UACA,MACA,GAAG,YAAA,GAAA,cAAA,UApBkB,mBAAmB,cAAc,MAqBhD;CAER,MAAM,MAAMA,0BAAAA,oBAAoB;CAEhC,MAAM,YAAY;EAAE;EAAY;CAAO;CAEvC,MAAM,YACJ,kBAAkB,OAAO,UAAU,WACjC,iBAAA,GAAA,kBAAA,KAACC,cAAAA,WAAD;EACE,WAAU;EACV,WAAW,IAAI;EACf,OAAO;EACP,GAAI,IAAI,UAAU,eAAe,SAAS;YAEzC;CACQ,CAAA,IAEX,iBAAA,GAAA,kBAAA,KAAC,QAAD;EAAM,GAAI,IAAI,UAAU,eAAe,SAAS;YAAI;CAAY,CAAA;CAGpE,OACE,iBAAA,GAAA,kBAAA,KAACC,cAAAA,gBAAD;EACE,eAAA;EACA,GAAI,IAAI,UAAU,UAAU;GAAE;GAAW;GAAO,GAAG;EAAU,CAAC;EAC9D,GAAI;EACJ,cAAc,UAAU;GACtB,MAAM,eAAe;GACrB,cAAc,KAAK;EACrB;EACA,UAAU,UAAU;GAClB,UAAU,KAAK;GACf,IAAI,2BAA2B,IAAI,sBACjC,wBAAA,iBAAiB,MAAM,IAAI,KAAK;EAEpC;EACA,UAAU;YAET,YACC,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;GACG,eACC,iBAAA,GAAA,kBAAA,KAACC,cAAAA,KAAD;IACE,WAAU;IACV,KAAK;KAAE,UAAU;KAAQ,QAAQ;IAAe;IAChD,GAAI,IAAI,UAAU,iBAAiB,SAAS;cAE3C;GACE,CAAA;GAGP,iBAAA,GAAA,kBAAA,MAAC,QAAD;IAAM,GAAI,IAAI,UAAU,cAAc,SAAS;cAA/C,CACG,WACD,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,GAAI,IAAI,UAAU,qBAAqB,SAAS;eAAI;IAAkB,CAAA,CACxE;;GAEL,gBACC,iBAAA,GAAA,kBAAA,KAACA,cAAAA,KAAD;IACE,WAAU;IACV,KAAK;KAAE,UAAU;KAAS,QAAQ;IAAe;IACjD,GAAI,IAAI,UAAU,iBAAiB,SAAS;cAE3C;GACE,CAAA;EAEP,EAAA,CAAA;CAEU,CAAA;AAEpB,CAAC;AAED,gBAAgB,UAAUC,yBAAAA;AAC1B,gBAAgB,cAAc"}