@grafana/ui
Version:
Grafana Components Library
1 lines • 4.18 kB
Source Map (JSON)
{"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":";;;;AAMO,MAAM,iBAAA,GAAoB,CAAC,YAAA,KAA0D;AAC1F,EAAA,OAAO,aAAa,MAAA,CAAO,CAAC,KAAuB,EAAE,KAAA,EAAO,OAAM,KAAM;AACtE,IAAA,GAAA,CAAI,IAAA,CAAK;AAAA,MACP,KAAA;AAAA,MACA,MAAM,kBAAA,CAAmB;AAAA,KAC1B,CAAA;AACD,IAAA,OAAO,KAAA,CAAM,MAAA,CAAO,CAACA,IAAAA,EAAK,IAAA,KAAS;AACjC,MAAAA,IAAAA,CAAI,KAAK,IAAI,CAAA;AACb,MAAA,OAAOA,IAAAA;AAAA,IACT,GAAG,GAAG,CAAA;AAAA,EACR,CAAA,EAAG,EAAE,CAAA;AACP;AAEO,MAAM,qBAAA,GAAwB,CAAC,QAAA,KAAuC;AAC3E,EAAA,OAAO,QAAA,CAAS,MAAA,CAAO,CAAC,OAAA,EAAS,OAAA,KAAY;AAC3C,IAAA,OAAO,QAAQ,MAAA,GAAS,OAAA,CAAQ,KAAA,CAAM,MAAA,GAAS,QAAQ,KAAA,GAAQ,OAAA;AAAA,EACjE,GAAG,EAAE,CAAA;AACP;AAEO,MAAM,kBAAA,GAAqB,CAAC,KAAA,EAAsB,QAAA,EAA4B,YAAA,KAAyB;AAC5G,EAAA,MAAM,IAAA,GAAO,cAAc,YAAA,EAAc;AAAA,IACvC,IAAA,EAAM,MAAM,UAAA,CAAW,mBAAA;AAAA,IACvB,QAAA,EAAU,KAAA,CAAM,UAAA,CAAW,SAAA,CAAU,QAAA;AAAA,IACrC,UAAA,EAAY;AAAA,GACb,CAAA;AAED,EAAA,MAAM,SAAA,GAAY,kBAAA,CAAmB,IAAA,CAAK,KAAA,EAAO,KAAK,CAAA;AACtD,EAAA,MAAM,UAAA,GAAa,mBAAA,CAAoB,IAAA,CAAK,MAAA,EAAQ,KAAK,CAAA;AACzD,EAAA,MAAM,UAAA,GAAa,mBAAA,CAAoB,UAAA,EAAY,QAAQ,CAAA;AAE3D,EAAA,OAAO;AAAA,IACL,SAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF;AACF;AAEO,MAAM,mBAAA,GAAsB,CAAC,kBAAA,EAA4B,KAAA,KAAyB;AACvF,EAAA,MAAM,iBAAA,GAAoB,KAAA,CAAM,OAAA,CAAQ,QAAA,GAAW,CAAA;AACnD,EAAA,MAAM,aAAa,kBAAA,GAAqB,iBAAA;AAExC,EAAA,OAAO,UAAA;AACT;AAEO,MAAM,kBAAA,GAAqB,CAAC,iBAAA,EAA2B,KAAA,KAAyB;AACrF,EAAA,MAAM,eAAA,GAAkB,KAAA,CAAM,OAAA,CAAQ,QAAA,GAAW,CAAA;AACjD,EAAA,MAAM,QAAA,GAAW,GAAA;AACjB,EAAA,MAAM,SAAA,GAAY,KAAK,GAAA,CAAI,IAAA,CAAK,IAAI,iBAAA,GAAoB,eAAA,EAAiB,GAAG,CAAA,EAAG,QAAQ,CAAA;AAEvF,EAAA,OAAO,SAAA;AACT;AAEO,MAAM,mBAAA,GAAsB,CAAC,UAAA,EAAoB,QAAA,KAA+B;AACrF,EAAA,MAAM,mBAAA,GAAsB,IAAA,CAAK,GAAA,CAAI,QAAA,CAAS,QAAQ,EAAE,CAAA;AACxD,EAAA,MAAM,SAAA,GAAY,GAAA;AAClB,EAAA,MAAM,cAAc,mBAAA,GAAsB,UAAA;AAC1C,EAAA,MAAM,UAAA,GAAa,IAAA,CAAK,GAAA,CAAI,WAAA,EAAa,SAAS,CAAA;AAElD,EAAA,OAAO,UAAA;AACT;;;;"}