@grafana/scenes 6.30.2--canary.1224.17164693951.0 → 6.30.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,15 @@
1
+ # v6.30.3 (Mon Aug 25 2025)
2
+
3
+ #### 🐛 Bug Fix
4
+
5
+ - AdHocFilters: Fix hidden filters in new combobox layout [#1216](https://github.com/grafana/scenes/pull/1216) ([@mdvictor](https://github.com/mdvictor))
6
+
7
+ #### Authors: 1
8
+
9
+ - Victor Marin ([@mdvictor](https://github.com/mdvictor))
10
+
11
+ ---
12
+
1
13
  # v6.30.1 (Wed Aug 20 2025)
2
14
 
3
15
  #### 🐛 Bug Fix
@@ -29,7 +29,7 @@ const AdHocFiltersComboboxRenderer = memo(function AdHocFiltersComboboxRenderer2
29
29
  }
30
30
  ) : null
31
31
  ),
32
- filters.map((filter, index) => /* @__PURE__ */ React.createElement(
32
+ filters.filter((filter) => !filter.hidden).map((filter, index) => /* @__PURE__ */ React.createElement(
33
33
  AdHocFilterPill,
34
34
  {
35
35
  key: `${index}-${filter.key}`,
@@ -1 +1 @@
1
- {"version":3,"file":"AdHocFiltersComboboxRenderer.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersComboboxRenderer.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { Icon, useStyles2 } from '@grafana/ui';\nimport React, { memo, useRef } from 'react';\nimport { AdHocFiltersVariable } from '../AdHocFiltersVariable';\nimport { AdHocFilterPill } from './AdHocFilterPill';\nimport { AdHocFiltersAlwaysWipCombobox } from './AdHocFiltersAlwaysWipCombobox';\n\ninterface Props {\n model: AdHocFiltersVariable;\n}\n\nexport const AdHocFiltersComboboxRenderer = memo(function AdHocFiltersComboboxRenderer({ model }: Props) {\n const { originFilters, filters, readOnly } = model.useState();\n const styles = useStyles2(getStyles);\n\n // ref that focuses on the always wip filter input\n // defined in the combobox component via useImperativeHandle\n const focusOnWipInputRef = useRef<() => void>();\n\n return (\n <div\n className={cx(styles.comboboxWrapper, { [styles.comboboxFocusOutline]: !readOnly })}\n onClick={() => {\n focusOnWipInputRef.current?.();\n }}\n >\n <Icon name=\"filter\" className={styles.filterIcon} size=\"lg\" />\n\n {originFilters?.map((filter, index) =>\n filter.origin ? (\n <AdHocFilterPill\n key={`${index}-${filter.key}`}\n filter={filter}\n model={model}\n focusOnWipInputRef={focusOnWipInputRef.current}\n />\n ) : null\n )}\n\n {filters.map((filter, index) => (\n <AdHocFilterPill\n key={`${index}-${filter.key}`}\n filter={filter}\n model={model}\n readOnly={readOnly || filter.readOnly}\n focusOnWipInputRef={focusOnWipInputRef.current}\n />\n ))}\n\n {!readOnly ? <AdHocFiltersAlwaysWipCombobox model={model} ref={focusOnWipInputRef} /> : null}\n </div>\n );\n});\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n comboboxWrapper: css({\n display: 'flex',\n flexWrap: 'wrap',\n alignItems: 'center',\n columnGap: theme.spacing(1),\n rowGap: theme.spacing(0.5),\n minHeight: theme.spacing(4),\n backgroundColor: theme.components.input.background,\n border: `1px solid ${theme.colors.border.strong}`,\n borderRadius: theme.shape.radius.default,\n paddingInline: theme.spacing(1),\n paddingBlock: theme.spacing(0.5),\n flexGrow: 1,\n }),\n comboboxFocusOutline: css({\n '&:focus-within': {\n outline: '2px dotted transparent',\n outlineOffset: '2px',\n boxShadow: `0 0 0 2px ${theme.colors.background.canvas}, 0 0 0px 4px ${theme.colors.primary.main}`,\n transitionTimingFunction: `cubic-bezier(0.19, 1, 0.22, 1)`,\n transitionDuration: '0.2s',\n transitionProperty: 'outline, outline-offset, box-shadow',\n zIndex: 2,\n },\n }),\n filterIcon: css({\n color: theme.colors.text.secondary,\n alignSelf: 'center',\n }),\n});\n"],"names":["AdHocFiltersComboboxRenderer"],"mappings":"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"}
1
+ {"version":3,"file":"AdHocFiltersComboboxRenderer.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersComboboxRenderer.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { Icon, useStyles2 } from '@grafana/ui';\nimport React, { memo, useRef } from 'react';\nimport { AdHocFiltersVariable } from '../AdHocFiltersVariable';\nimport { AdHocFilterPill } from './AdHocFilterPill';\nimport { AdHocFiltersAlwaysWipCombobox } from './AdHocFiltersAlwaysWipCombobox';\n\ninterface Props {\n model: AdHocFiltersVariable;\n}\n\nexport const AdHocFiltersComboboxRenderer = memo(function AdHocFiltersComboboxRenderer({ model }: Props) {\n const { originFilters, filters, readOnly } = model.useState();\n const styles = useStyles2(getStyles);\n\n // ref that focuses on the always wip filter input\n // defined in the combobox component via useImperativeHandle\n const focusOnWipInputRef = useRef<() => void>();\n\n return (\n <div\n className={cx(styles.comboboxWrapper, { [styles.comboboxFocusOutline]: !readOnly })}\n onClick={() => {\n focusOnWipInputRef.current?.();\n }}\n >\n <Icon name=\"filter\" className={styles.filterIcon} size=\"lg\" />\n\n {originFilters?.map((filter, index) =>\n filter.origin ? (\n <AdHocFilterPill\n key={`${index}-${filter.key}`}\n filter={filter}\n model={model}\n focusOnWipInputRef={focusOnWipInputRef.current}\n />\n ) : null\n )}\n\n {filters\n .filter((filter) => !filter.hidden)\n .map((filter, index) => (\n <AdHocFilterPill\n key={`${index}-${filter.key}`}\n filter={filter}\n model={model}\n readOnly={readOnly || filter.readOnly}\n focusOnWipInputRef={focusOnWipInputRef.current}\n />\n ))}\n\n {!readOnly ? <AdHocFiltersAlwaysWipCombobox model={model} ref={focusOnWipInputRef} /> : null}\n </div>\n );\n});\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n comboboxWrapper: css({\n display: 'flex',\n flexWrap: 'wrap',\n alignItems: 'center',\n columnGap: theme.spacing(1),\n rowGap: theme.spacing(0.5),\n minHeight: theme.spacing(4),\n backgroundColor: theme.components.input.background,\n border: `1px solid ${theme.colors.border.strong}`,\n borderRadius: theme.shape.radius.default,\n paddingInline: theme.spacing(1),\n paddingBlock: theme.spacing(0.5),\n flexGrow: 1,\n }),\n comboboxFocusOutline: css({\n '&:focus-within': {\n outline: '2px dotted transparent',\n outlineOffset: '2px',\n boxShadow: `0 0 0 2px ${theme.colors.background.canvas}, 0 0 0px 4px ${theme.colors.primary.main}`,\n transitionTimingFunction: `cubic-bezier(0.19, 1, 0.22, 1)`,\n transitionDuration: '0.2s',\n transitionProperty: 'outline, outline-offset, box-shadow',\n zIndex: 2,\n },\n }),\n filterIcon: css({\n color: theme.colors.text.secondary,\n alignSelf: 'center',\n }),\n});\n"],"names":["AdHocFiltersComboboxRenderer"],"mappings":"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"}
package/dist/index.js CHANGED
@@ -5646,7 +5646,7 @@ const AdHocFiltersComboboxRenderer = React.memo(function AdHocFiltersComboboxRen
5646
5646
  }
5647
5647
  ) : null
5648
5648
  ),
5649
- filters.map((filter, index) => /* @__PURE__ */ React__default.default.createElement(
5649
+ filters.filter((filter) => !filter.hidden).map((filter, index) => /* @__PURE__ */ React__default.default.createElement(
5650
5650
  AdHocFilterPill,
5651
5651
  {
5652
5652
  key: `${index}-${filter.key}`,