@grafana/ui/dist/esm/components/ElementSelectionContext/ElementSelectionContext.mjs.map

Grafana Components Library

{"version":3,"file":"ElementSelectionContext.mjs","sources":["../../../../src/components/ElementSelectionContext/ElementSelectionContext.tsx"],"sourcesContent":["import React, { createContext, useCallback, useContext } from 'react';\n\nexport interface ElementSelectionOnSelectOptions {\n  /** If specified, this will ignore the shift key press */\n  multi?: boolean;\n\n  /** If true, this will make sure the element is selected */\n  force?: boolean;\n}\n\n/** @alpha */\nexport interface ElementSelectionContextState {\n  /**\n   * Turn on selection mode & show selection state\n   */\n  enabled?: boolean;\n  /** List of currently selected elements */\n  selected: ElementSelectionContextItem[];\n  onSelect: (item: ElementSelectionContextItem, options: ElementSelectionOnSelectOptions) => void;\n  onClear: () => void;\n}\n\nexport interface ElementSelectionContextItem {\n  id: string;\n}\n\nexport const ElementSelectionContext = createContext<ElementSelectionContextState | undefined>(undefined);\n\nexport interface UseElementSelectionResult {\n  isSelected?: boolean;\n  isSelectable?: boolean;\n  onSelect?: (evt: React.MouseEvent, options?: ElementSelectionOnSelectOptions) => void;\n  onClear?: () => void;\n}\n\nexport function useElementSelection(id: string | undefined): UseElementSelectionResult {\n  if (!id) {\n    return {};\n  }\n\n  const context = useContext(ElementSelectionContext);\n  if (!context) {\n    return {};\n  }\n\n  const isSelected = context.selected.some((item) => item.id === id);\n  const onSelect = useCallback(\n    (evt: React.MouseEvent, options: ElementSelectionOnSelectOptions = {}) => {\n      if (!context.enabled) {\n        return;\n      }\n\n      // To prevent this click form clearing the selection\n      evt.stopPropagation();\n\n      // Prevent text selection caused by shift click\n      if (evt.shiftKey) {\n        evt.preventDefault();\n        window.getSelection()?.empty();\n      }\n\n      context.onSelect({ id }, { ...options, multi: options.multi ?? evt.shiftKey });\n    },\n    [context, id]\n  );\n\n  const onClear = useCallback(() => {\n    if (!context.enabled) {\n      return;\n    }\n\n    context.onClear();\n  }, [context]);\n\n  return { isSelected, onSelect, onClear, isSelectable: context.enabled };\n}\n"],"names":[],"mappings":";;;AA0BO,MAAM,uBAAA,GAA0B,cAAwD,KAAA,CAAS;AASjG,SAAS,oBAAoB,EAAA,EAAmD;AACrF,EAAA,IAAI,CAAC,EAAA,EAAI;AACP,IAAA,OAAO,EAAC;AAAA,EACV;AAEA,EAAA,MAAM,OAAA,GAAU,WAAW,uBAAuB,CAAA;AAClD,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,OAAO,EAAC;AAAA,EACV;AAEA,EAAA,MAAM,UAAA,GAAa,QAAQ,QAAA,CAAS,IAAA,CAAK,CAAC,IAAA,KAAS,IAAA,CAAK,OAAO,EAAE,CAAA;AACjE,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,GAAA,EAAuB,OAAA,GAA2C,EAAC,KAAM;AA/C9E,MAAA,IAAA,EAAA,EAAA,EAAA;AAgDM,MAAA,IAAI,CAAC,QAAQ,OAAA,EAAS;AACpB,QAAA;AAAA,MACF;AAGA,MAAA,GAAA,CAAI,eAAA,EAAgB;AAGpB,MAAA,IAAI,IAAI,QAAA,EAAU;AAChB,QAAA,GAAA,CAAI,cAAA,EAAe;AACnB,QAAA,CAAA,EAAA,GAAA,MAAA,CAAO,YAAA,OAAP,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAuB,KAAA,EAAA;AAAA,MACzB;AAEA,MAAA,OAAA,CAAQ,QAAA,CAAS,EAAE,EAAA,EAAG,EAAG,EAAE,GAAG,OAAA,EAAS,KAAA,EAAA,CAAO,EAAA,GAAA,OAAA,CAAQ,KAAA,KAAR,IAAA,GAAA,EAAA,GAAiB,GAAA,CAAI,UAAU,CAAA;AAAA,IAC/E,CAAA;AAAA,IACA,CAAC,SAAS,EAAE;AAAA,GACd;AAEA,EAAA,MAAM,OAAA,GAAU,YAAY,MAAM;AAChC,IAAA,IAAI,CAAC,QAAQ,OAAA,EAAS;AACpB,MAAA;AAAA,IACF;AAEA,IAAA,OAAA,CAAQ,OAAA,EAAQ;AAAA,EAClB,CAAA,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,EAAA,OAAO,EAAE,UAAA,EAAY,QAAA,EAAU,OAAA,EAAS,YAAA,EAAc,QAAQ,OAAA,EAAQ;AACxE;;;;"}