UNPKG

@grafana/ui

Version:
1 lines 4.16 kB
{"version":3,"file":"typeahead.mjs","sources":["../../../src/utils/typeahead.ts"],"sourcesContent":["import { default as calculateSize } from 'calculate-size';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { CompletionItemGroup, CompletionItem, CompletionItemKind } from '../types/completion';\n\nexport const flattenGroupItems = (groupedItems: CompletionItemGroup[]): CompletionItem[] => {\n return groupedItems.reduce((all: CompletionItem[], { items, label }) => {\n all.push({\n label,\n kind: CompletionItemKind.GroupTitle,\n });\n return items.reduce((all, item) => {\n all.push(item);\n return all;\n }, all);\n }, []);\n};\n\nexport const calculateLongestLabel = (allItems: CompletionItem[]): string => {\n return allItems.reduce((longest, current) => {\n return longest.length < current.label.length ? current.label : longest;\n }, '');\n};\n\nexport const calculateListSizes = (theme: GrafanaTheme2, allItems: CompletionItem[], longestLabel: string) => {\n const size = calculateSize(longestLabel, {\n font: theme.typography.fontFamilyMonospace,\n fontSize: theme.typography.bodySmall.fontSize,\n fontWeight: 'normal',\n });\n\n const listWidth = calculateListWidth(size.width, theme);\n const itemHeight = calculateItemHeight(size.height, theme);\n const listHeight = calculateListHeight(itemHeight, allItems);\n\n return {\n listWidth,\n listHeight,\n itemHeight,\n };\n};\n\nexport const calculateItemHeight = (longestLabelHeight: number, theme: GrafanaTheme2) => {\n const horizontalPadding = theme.spacing.gridSize * 2;\n const itemHeight = longestLabelHeight + horizontalPadding;\n\n return itemHeight;\n};\n\nexport const calculateListWidth = (longestLabelWidth: number, theme: GrafanaTheme2) => {\n const verticalPadding = theme.spacing.gridSize * 3;\n const maxWidth = 800;\n const listWidth = Math.min(Math.max(longestLabelWidth + verticalPadding, 200), maxWidth);\n\n return listWidth;\n};\n\nexport const calculateListHeight = (itemHeight: number, allItems: CompletionItem[]) => {\n const numberOfItemsToShow = Math.min(allItems.length, 10);\n const minHeight = 100;\n const totalHeight = numberOfItemsToShow * itemHeight;\n const listHeight = Math.max(totalHeight, minHeight);\n\n return listHeight;\n};\n"],"names":["all"],"mappings":";;;AAMa,MAAA,iBAAA,GAAoB,CAAC,YAA0D,KAAA;AAC1F,EAAA,OAAO,aAAa,MAAO,CAAA,CAAC,KAAuB,EAAE,KAAA,EAAO,OAAY,KAAA;AACtE,IAAA,GAAA,CAAI,IAAK,CAAA;AAAA,MACP,KAAA;AAAA,MACA,MAAM,kBAAmB,CAAA;AAAA,KAC1B,CAAA;AACD,IAAA,OAAO,KAAM,CAAA,MAAA,CAAO,CAACA,IAAAA,EAAK,IAAS,KAAA;AACjC,MAAAA,IAAAA,CAAI,KAAK,IAAI,CAAA;AACb,MAAOA,OAAAA,IAAAA;AAAA,OACN,GAAG,CAAA;AAAA,GACR,EAAG,EAAE,CAAA;AACP;AAEa,MAAA,qBAAA,GAAwB,CAAC,QAAuC,KAAA;AAC3E,EAAA,OAAO,QAAS,CAAA,MAAA,CAAO,CAAC,OAAA,EAAS,OAAY,KAAA;AAC3C,IAAA,OAAO,QAAQ,MAAS,GAAA,OAAA,CAAQ,KAAM,CAAA,MAAA,GAAS,QAAQ,KAAQ,GAAA,OAAA;AAAA,KAC9D,EAAE,CAAA;AACP;AAEO,MAAM,kBAAqB,GAAA,CAAC,KAAsB,EAAA,QAAA,EAA4B,YAAyB,KAAA;AAC5G,EAAM,MAAA,IAAA,GAAO,cAAc,YAAc,EAAA;AAAA,IACvC,IAAA,EAAM,MAAM,UAAW,CAAA,mBAAA;AAAA,IACvB,QAAA,EAAU,KAAM,CAAA,UAAA,CAAW,SAAU,CAAA,QAAA;AAAA,IACrC,UAAY,EAAA;AAAA,GACb,CAAA;AAED,EAAA,MAAM,SAAY,GAAA,kBAAA,CAAmB,IAAK,CAAA,KAAA,EAAO,KAAK,CAAA;AACtD,EAAA,MAAM,UAAa,GAAA,mBAAA,CAAoB,IAAK,CAAA,MAAA,EAAQ,KAAK,CAAA;AACzD,EAAM,MAAA,UAAA,GAAa,mBAAoB,CAAA,UAAA,EAAY,QAAQ,CAAA;AAE3D,EAAO,OAAA;AAAA,IACL,SAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF;AACF;AAEa,MAAA,mBAAA,GAAsB,CAAC,kBAAA,EAA4B,KAAyB,KAAA;AACvF,EAAM,MAAA,iBAAA,GAAoB,KAAM,CAAA,OAAA,CAAQ,QAAW,GAAA,CAAA;AACnD,EAAA,MAAM,aAAa,kBAAqB,GAAA,iBAAA;AAExC,EAAO,OAAA,UAAA;AACT;AAEa,MAAA,kBAAA,GAAqB,CAAC,iBAAA,EAA2B,KAAyB,KAAA;AACrF,EAAM,MAAA,eAAA,GAAkB,KAAM,CAAA,OAAA,CAAQ,QAAW,GAAA,CAAA;AACjD,EAAA,MAAM,QAAW,GAAA,GAAA;AACjB,EAAM,MAAA,SAAA,GAAY,KAAK,GAAI,CAAA,IAAA,CAAK,IAAI,iBAAoB,GAAA,eAAA,EAAiB,GAAG,CAAA,EAAG,QAAQ,CAAA;AAEvF,EAAO,OAAA,SAAA;AACT;AAEa,MAAA,mBAAA,GAAsB,CAAC,UAAA,EAAoB,QAA+B,KAAA;AACrF,EAAA,MAAM,mBAAsB,GAAA,IAAA,CAAK,GAAI,CAAA,QAAA,CAAS,QAAQ,EAAE,CAAA;AACxD,EAAA,MAAM,SAAY,GAAA,GAAA;AAClB,EAAA,MAAM,cAAc,mBAAsB,GAAA,UAAA;AAC1C,EAAA,MAAM,UAAa,GAAA,IAAA,CAAK,GAAI,CAAA,WAAA,EAAa,SAAS,CAAA;AAElD,EAAO,OAAA,UAAA;AACT;;;;"}