Grafana UI: Use package.json exports for internal code (#101815)

* feat(grafana-ui): introduce development exports to prevent importing from grafana/ui/src

* refactor(theme-generation): move theme templates into scripts so themes continue to build

* refactor(frontend): replace  grafana/ui paths that use nested src with /internal or /unstable

* chore(betterer): update better results file

* feat(grafana-ui): support enterprise, remove Text component from internal

* docs(packages): update readme with exporting code conventions
pull/102032/head
Jack Westbrook 4 months ago committed by GitHub
parent dcba71a0b0
commit c9f563e576
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 588
      .betterer.results
  2. 10
      packages/README.md
  3. 4
      packages/grafana-plugin-configs/tsconfig.json
  4. 16
      packages/grafana-ui/package.json
  5. 104
      packages/grafana-ui/src/internal/index.ts
  6. 2
      public/app/core/components/AppChrome/TopBar/TopSearchBarCommandPaletteTrigger.tsx
  7. 6
      public/app/core/components/GraphNG/GraphNG.tsx
  8. 2
      public/app/core/components/Indent/Indent.tsx
  9. 3
      public/app/core/components/NestedFolderPicker/NestedFolderList.tsx
  10. 2
      public/app/core/components/NestedFolderPicker/Trigger.tsx
  11. 2
      public/app/core/components/OptionsUI/color.tsx
  12. 2
      public/app/core/components/OptionsUI/registry.tsx
  13. 4
      public/app/core/components/OptionsUI/slider.tsx
  14. 2
      public/app/core/components/PasswordField/PasswordField.tsx
  15. 2
      public/app/core/components/RolePicker/RoleMenuGroupOption.tsx
  16. 2
      public/app/core/components/RolePicker/RoleMenuOption.tsx
  17. 2
      public/app/core/components/RolePicker/RolePickerInput.tsx
  18. 2
      public/app/core/components/RolePicker/RolePickerMenu.tsx
  19. 2
      public/app/core/components/RolePicker/RolePickerSubMenu.tsx
  20. 5
      public/app/core/components/TimeSeries/TimeSeries.tsx
  21. 12
      public/app/core/components/TimeSeries/utils.ts
  22. 2
      public/app/core/components/TimelineChart/utils.ts
  23. 2
      public/app/core/context/ModalsContextProvider.tsx
  24. 2
      public/app/core/core.ts
  25. 10
      public/app/features/actions/ActionEditor.tsx
  26. 3
      public/app/features/actions/ActionEditorModalContent.tsx
  27. 6
      public/app/features/actions/ParamsEditor.tsx
  28. 2
      public/app/features/admin/AdminOrgsTable.tsx
  29. 2
      public/app/features/admin/AdminSettingsTable.tsx
  30. 2
      public/app/features/admin/UserListPublicDashboardPage/DashboardsListModalButton.tsx
  31. 2
      public/app/features/admin/UserListPublicDashboardPage/DeleteUserModalButton.tsx
  32. 2
      public/app/features/admin/UserListPublicDashboardPage/UserListPublicDashboardPage.tsx
  33. 2
      public/app/features/alerting/unified/components/GrafanaAlertmanagerDeliveryWarning.tsx
  34. 2
      public/app/features/alerting/unified/components/rule-editor/CloudAlertPreview.tsx
  35. 3
      public/app/features/alerting/unified/components/rule-editor/GrafanaAlertStatePicker.tsx
  36. 2
      public/app/features/alerting/unified/components/rule-editor/alert-rule-form/simplifiedRouting/route-settings/RouteSettings.tsx
  37. 2
      public/app/features/alerting/unified/components/rules/RuleConfigStatus.tsx
  38. 3
      public/app/features/alerting/unified/home/PluginIntegrations.tsx
  39. 2
      public/app/features/alerting/unified/plugins/PluginOriginBadge.tsx
  40. 2
      public/app/features/browse-dashboards/components/NameCell.tsx
  41. 3
      public/app/features/canvas/elements/metricValue.tsx
  42. 3
      public/app/features/dashboard-scene/sharing/ShareButton/share-externally/EmailShare/ConfigEmailSharing/ConfigEmailSharing.tsx
  43. 3
      public/app/features/dashboard-scene/sharing/ShareButton/share-externally/EmailShare/ConfigEmailSharing/EmailListConfiguration.tsx
  44. 3
      public/app/features/dashboard-scene/sharing/ShareButton/share-externally/EmailShare/CreateEmailSharing.tsx
  45. 3
      public/app/features/dashboard-scene/sharing/ShareButton/share-externally/ShareConfiguration.tsx
  46. 3
      public/app/features/dashboard-scene/sharing/ShareButton/share-snapshot/UpsertSnapshot.tsx
  47. 5
      public/app/features/dashboard-scene/sharing/ShareDrawer/ShareDrawerConfirmAction.tsx
  48. 2
      public/app/features/dashboard/components/PanelEditor/OverrideCategoryTitle.tsx
  49. 3
      public/app/features/dashboard/components/PanelEditor/PanelHeaderCorner.tsx
  50. 25
      public/app/features/dashboard/components/PanelEditor/PanelNotSupported.tsx
  51. 3
      public/app/features/dashboard/components/PanelEditor/VisualizationSelectPane.tsx
  52. 2
      public/app/features/dashboard/components/PublicDashboardNotAvailable/PublicDashboardNotAvailable.tsx
  53. 18
      public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/ConfigPublicDashboard.tsx
  54. 15
      public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/Configuration.tsx
  55. 2
      public/app/features/dashboard/components/ShareModal/SharePublicDashboard/CreatePublicDashboard/AcknowledgeCheckboxes.tsx
  56. 2
      public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/NoUpsertPermissionsAlert.tsx
  57. 2
      public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/SaveDashboardChangesAlert.tsx
  58. 2
      public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/UnsupportedDataSourcesAlert.tsx
  59. 2
      public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/UnsupportedTemplateVariablesAlert.tsx
  60. 2
      public/app/features/dashboard/components/ShareModal/SharePublicDashboard/SharePublicDashboard.tsx
  61. 2
      public/app/features/dashboard/components/SubMenu/AnnotationPicker.tsx
  62. 4
      public/app/features/dashboard/components/SubMenu/DashboardLinksDashboard.tsx
  63. 2
      public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderNotice.tsx
  64. 2
      public/app/features/dashboard/state/DashboardMigrator.ts
  65. 2
      public/app/features/dimensions/editors/BackgroundSizeEditor.tsx
  66. 2
      public/app/features/dimensions/editors/ColorDimensionEditor.tsx
  67. 2
      public/app/features/dimensions/editors/ResourceDimensionEditor.tsx
  68. 2
      public/app/features/dimensions/editors/ResourcePicker.tsx
  69. 2
      public/app/features/dimensions/editors/ScalarDimensionEditor.tsx
  70. 2
      public/app/features/dimensions/editors/ScaleDimensionEditor.tsx
  71. 2
      public/app/features/dimensions/editors/TextDimensionEditor.tsx
  72. 2
      public/app/features/explore/ContentOutline/ContentOutlineItemButton.tsx
  73. 2
      public/app/features/explore/Explore.tsx
  74. 2
      public/app/features/explore/Logs/Logs.tsx
  75. 2
      public/app/features/explore/Logs/LogsColumnSearch.tsx
  76. 2
      public/app/features/explore/Logs/LogsTable.tsx
  77. 2
      public/app/features/explore/Logs/LogsTableActiveFields.tsx
  78. 2
      public/app/features/explore/Logs/LogsTableAvailableFields.tsx
  79. 2
      public/app/features/explore/Logs/LogsTableMultiSelect.tsx
  80. 2
      public/app/features/explore/Logs/LogsTableWrap.tsx
  81. 2
      public/app/features/explore/PrometheusListView/ItemLabels.tsx
  82. 2
      public/app/features/explore/PrometheusListView/ItemValues.tsx
  83. 2
      public/app/features/explore/PrometheusListView/RawListContainer.tsx
  84. 2
      public/app/features/explore/PrometheusListView/RawListItem.tsx
  85. 2
      public/app/features/explore/PrometheusListView/RawListItemAttributes.tsx
  86. 2
      public/app/features/explore/TraceView/components/TracePageHeader/SearchBar/NextPrevResult.tsx
  87. 2
      public/app/features/explore/TraceView/components/TracePageHeader/SearchBar/TracePageSearchBar.tsx
  88. 2
      public/app/features/library-panels/components/LibraryPanelCard/LibraryPanelCard.tsx
  89. 2
      public/app/features/manage-dashboards/components/PublicDashboardListTable/DeletePublicDashboardButton.tsx
  90. 2
      public/app/features/manage-dashboards/components/PublicDashboardListTable/DeletePublicDashboardModal.tsx
  91. 2
      public/app/features/manage-dashboards/components/SnapshotListTableRow.tsx
  92. 2
      public/app/features/migrate-to-cloud/onprem/NameCell.tsx
  93. 2
      public/app/features/migrate-to-cloud/shared/AlertWithTraceID.tsx
  94. 2
      public/app/features/panel/components/VizTypePicker/PanelTypeCard.tsx
  95. 2
      public/app/features/playlist/PlaylistCard.tsx
  96. 2
      public/app/features/playlist/PlaylistPageList.tsx
  97. 2
      public/app/features/plugins/admin/components/PluginListItem.tsx
  98. 2
      public/app/features/plugins/loader/sharedDependencies.ts
  99. 2
      public/app/features/sandbox/BenchmarksPage.tsx
  100. 3
      public/app/features/search/page/components/SearchResultsTable.tsx
  101. Some files were not shown because too many files have changed in this diff Show More

File diff suppressed because it is too large Load Diff

@ -1,6 +1,14 @@
# Grafana frontend packages
This document contains information about Grafana frontend package versioning and releases.
## Exporting code conventions
`@grafana/ui` makes use of `exports` in package.json to define three entrypoints that Grafana core and Grafana plugins can access. Before exposing anything in this package please consider the table below.
| Entrypoint Name | Import Path | Description | Available to Grafana | Available to plugins |
| --------------- | ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------- | -------------------- |
| `./` | `@grafana/ui` | The public API entrypoint. If the code is stable and you want to share it everywhere, this is the place to export it. | ✅ | ✅ |
| `./unstable` | `@grafana/ui/unstable` | The public API entrypoint for all experimental code. If you want to iterate and test code from Grafana and plugins, this is the place to export it. | ✅ | ✅ |
| `./internal` | `@grafana/ui/internal` | The private API entrypoint for internal code shared with Grafana. If you need to import code in Grafana but don't want to expose it to plugins, this is the place to export it. | ✅ | ❌ |
## Versioning

@ -3,12 +3,14 @@
"jsx": "react-jsx",
"alwaysStrict": true,
"declaration": false,
"resolveJsonModule": true
"resolveJsonModule": true,
"moduleResolution": "bundler"
},
"ts-node": {
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"moduleResolution": "Node",
"esModuleInterop": true
},
"transpileOnly": true

@ -18,6 +18,22 @@
},
"main": "src/index.ts",
"types": "src/index.ts",
"module": "src/index.ts",
"exports": {
"./package.json": "./package.json",
".": {
"import": "./src/index.ts",
"require": "./src/index.ts"
},
"./internal": {
"import": "./src/internal/index.ts",
"require": "./src/internal/index.ts"
},
"./unstable": {
"import": "./src/unstable.ts",
"require": "./src/unstable.ts"
}
},
"publishConfig": {
"main": "./dist/cjs/index.cjs",
"module": "./dist/esm/index.mjs",

@ -0,0 +1,104 @@
/**
* This file is used to share internal grafana/ui code with Grafana core.
* Note that these exports are also used within Enterprise.
*
* Through the exports declared in package.json we can import this code in core Grafana and the grafana/ui
* package will continue to be able to access all code when it's published to npm as it's private to the package.
*
* During the yarn pack lifecycle the exports[./internal] property is deleted from the package.json
* preventing the code from being importable by plugins or other npm packages making it truly "internal".
*
*/
export { UPlotChart } from '../components/uPlot/Plot';
export { type AxisProps, UPLOT_AXIS_FONT_SIZE, timeUnitSize } from '../components/uPlot/config/UPlotAxisBuilder';
export {
type Renderers,
UPlotConfigBuilder,
type UPlotConfigPrepFn,
} from '../components/uPlot/config/UPlotConfigBuilder';
export { type ScaleProps } from '../components/uPlot/config/UPlotScaleBuilder';
export {
pluginLog,
preparePlotData2,
getStackingGroups,
getDisplayValuesForCalcs,
type StackingGroup,
} from '../components/uPlot/utils';
export { hasVisibleLegendSeries, PlotLegend } from '../components/uPlot/PlotLegend';
export { getScaleGradientFn } from '../components/uPlot/config/gradientFills';
export { buildScaleKey } from '../components/uPlot/internal';
export { CloseButton } from '../components/uPlot/plugins/CloseButton';
export { type TimeRange2, TooltipHoverMode } from '../components/uPlot/plugins/TooltipPlugin2';
export type { FacetedData, FacetSeries } from '../components/uPlot/types';
export { getResponsiveStyle, type ResponsiveProp } from '../components/Layout/utils/responsiveness';
export { ColorSwatch } from '../components/ColorPicker/ColorSwatch';
export { FieldNamePicker } from '../components/MatchersUI/FieldNamePicker';
export { comparisonOperationOptions } from '../components/MatchersUI/FieldValueMatcher';
export {
frameHasName,
getFrameFieldsDisplayNames,
useFieldDisplayNames,
useSelectOptions,
} from '../components/MatchersUI/utils';
export type { FieldMatcherUIRegistryItem } from '../components/MatchersUI/types';
export { RefIDMultiPicker, RefIDPicker, stringsToRegexp } from '../components/MatchersUI/FieldsByFrameRefIdMatcher';
export { allFieldTypeIconOptions } from '../components/MatchersUI/FieldTypeMatcherEditor';
export { getStyles as getSliderStyles } from '../components/Slider/styles';
export { getSelectStyles } from '../components/Select/getSelectStyles';
export type { Props as InputProps } from '../components/Input/Input';
export type { ModalsContextState } from '../components/Modal/ModalsContext';
export { getModalStyles } from '../components/Modal/getModalStyles';
export { MultiValueRemove, type MultiValueRemoveProps } from '../components/Select/MultiValue';
export { getSvgSize } from '../components/Icon/utils';
export { LoadingIndicator } from '../components/PanelChrome/LoadingIndicator';
export { type ButtonLinkProps, getButtonStyles } from '../components/Button';
export {
type TableSortByFieldState,
type TableFieldOptions,
TableCellDisplayMode,
FILTER_FOR_OPERATOR,
FILTER_OUT_OPERATOR,
} from '../components/Table/types';
export { defaultSparklineCellConfig } from '../components/Table/SparklineCell';
export { TableCell } from '../components/Table/TableCell';
export { useTableStyles } from '../components/Table/styles';
export { migrateTableDisplayModeToCellOptions } from '../components/Table/utils';
export { type DataLinksContextMenuApi } from '../components/DataLinks/DataLinksContextMenu';
export { MenuDivider } from '../components/Menu/MenuDivider';
export { AbstractList } from '../components/List/AbstractList';
export type { HttpSettingsBaseProps, AzureAuthSettings } from '../components/DataSourceSettings/types';
export { TimeZoneOffset, formatUtcOffset } from '../components/DateTimePickers/TimeZonePicker/TimeZoneOffset';
export { TimeZoneTitle } from '../components/DateTimePickers/TimeZonePicker/TimeZoneTitle';
export type { CodeEditorProps } from '../components/Monaco/types';
export { type Props as InlineFieldProps } from '../components/Forms/InlineField';
export { DataLinkSuggestions } from '../components/DataLinks/DataLinkSuggestions';
export { type Props as AlertProps } from '../components/Alert/Alert';
export { type TooltipPlacement } from '../components/Tooltip';
export { ConfirmContent, type ConfirmContentProps } from '../components/ConfirmModal/ConfirmContent';
export { EmotionPerfTest } from '../components/ThemeDemos/EmotionPerfTest';
export { VizTooltipContent } from '../components/VizTooltip/VizTooltipContent';
export { VizTooltipFooter } from '../components/VizTooltip/VizTooltipFooter';
export { VizTooltipHeader } from '../components/VizTooltip/VizTooltipHeader';
export { VizTooltipWrapper } from '../components/VizTooltip/VizTooltipWrapper';
export { VizTooltipRow } from '../components/VizTooltip/VizTooltipRow';
export { getContentItems } from '../components/VizTooltip/utils';
export { ColorIndicator, ColorPlacement, type VizTooltipItem } from '../components/VizTooltip/types';
export { mapMouseEventToMode } from '../components/VizLegend/utils';
export { getFocusStyles, getMouseFocusStyles, getTooltipContainerStyles } from '../themes/mixins';
export { optsWithHideZeros } from '../options/builder/tooltip';
export { StackingEditor } from '../options/builder/stacking';
export { addHideFrom } from '../options/builder/hideSeries';
export { ScaleDistributionEditor } from '../options/builder/axis';
export { useComponentInstanceId } from '../utils/useComponetInstanceId';
export { closePopover } from '../utils/closePopover';
export { flattenTokens } from '../slate-plugins/slate-prism';

@ -5,7 +5,7 @@ import { useMemo, useState } from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { getInputStyles, Icon, Text, ToolbarButton, useStyles2, useTheme2 } from '@grafana/ui';
import { getFocusStyles } from '@grafana/ui/src/themes/mixins';
import { getFocusStyles } from '@grafana/ui/internal';
import { useMediaQueryChange } from 'app/core/hooks/useMediaQueryChange';
import { t } from 'app/core/internationalization';
import { getModKey } from 'app/core/utils/browser';

@ -16,11 +16,7 @@ import {
} from '@grafana/data';
import { DashboardCursorSync, VizLegendOptions } from '@grafana/schema';
import { Themeable2, VizLayout } from '@grafana/ui';
import { UPlotChart } from '@grafana/ui/src/components/uPlot/Plot';
import { AxisProps } from '@grafana/ui/src/components/uPlot/config/UPlotAxisBuilder';
import { Renderers, UPlotConfigBuilder } from '@grafana/ui/src/components/uPlot/config/UPlotConfigBuilder';
import { ScaleProps } from '@grafana/ui/src/components/uPlot/config/UPlotScaleBuilder';
import { pluginLog } from '@grafana/ui/src/components/uPlot/utils';
import { UPlotChart, AxisProps, Renderers, UPlotConfigBuilder, ScaleProps, pluginLog } from '@grafana/ui/internal';
import { GraphNGLegendEvent, XYFieldMatchers } from './types';
import { preparePlotFrame as defaultPreparePlotFrame } from './utils';

@ -3,7 +3,7 @@ import * as React from 'react';
import { GrafanaTheme2, ThemeSpacingTokens } from '@grafana/data';
import { useStyles2 } from '@grafana/ui';
import { getResponsiveStyle, ResponsiveProp } from '@grafana/ui/src/components/Layout/utils/responsiveness';
import { getResponsiveStyle, ResponsiveProp } from '@grafana/ui/internal';
interface IndentProps {
children?: React.ReactNode;

@ -6,8 +6,7 @@ import { FixedSizeList as List } from 'react-window';
import InfiniteLoader from 'react-window-infinite-loader';
import { GrafanaTheme2 } from '@grafana/data';
import { IconButton, useStyles2 } from '@grafana/ui';
import { Text } from '@grafana/ui/src/components/Text/Text';
import { IconButton, useStyles2, Text } from '@grafana/ui';
import { Indent } from 'app/core/components/Indent/Indent';
import { Trans } from 'app/core/internationalization';
import { childrenByParentUIDSelector, rootItemsSelector } from 'app/features/browse-dashboards/state';

@ -4,7 +4,7 @@ import * as React from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { Icon, getInputStyles, useTheme2, Text } from '@grafana/ui';
import { getFocusStyles, getMouseFocusStyles } from '@grafana/ui/src/themes/mixins';
import { getFocusStyles, getMouseFocusStyles } from '@grafana/ui/internal';
import { Trans, t } from 'app/core/internationalization';
import { FolderPickerSkeleton } from './Skeleton';

@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data';
import { useTheme2, useStyles2, ColorPicker, IconButton } from '@grafana/ui';
import { ColorSwatch } from '@grafana/ui/src/components/ColorPicker/ColorSwatch';
import { ColorSwatch } from '@grafana/ui/internal';
export interface ColorValueEditorSettings {
placeholder?: string;

@ -32,7 +32,7 @@ import {
import { actionsOverrideProcessor } from '@grafana/data/src/field/overrides/processors';
import { FieldConfig } from '@grafana/schema';
import { RadioButtonGroup, TimeZonePicker, Switch } from '@grafana/ui';
import { FieldNamePicker } from '@grafana/ui/src/components/MatchersUI/FieldNamePicker';
import { FieldNamePicker } from '@grafana/ui/internal';
import { ThresholdsValueEditor } from 'app/features/dimensions/editors/ThresholdsEditor/thresholds';
import { ValueMappingsEditor } from 'app/features/dimensions/editors/ValueMappingsEditor/ValueMappingsEditor';

@ -5,7 +5,7 @@ import { useCallback, useEffect, useRef, useState } from 'react';
import { StandardEditorProps, GrafanaTheme2, SliderFieldConfigSettings } from '@grafana/data';
import { useTheme2 } from '@grafana/ui';
import { getStyles } from '@grafana/ui/src/components/Slider/styles';
import { getSliderStyles } from '@grafana/ui/internal';
import { NumberInput } from './NumberInput';
@ -86,7 +86,7 @@ export const SliderValueEditor = ({ value, onChange, item }: Props) => {
);
// Styles
const styles = getStyles(theme, isHorizontal, Boolean(marks));
const styles = getSliderStyles(theme, isHorizontal, Boolean(marks));
const stylesSlider = getStylesSlider(theme, inputWidth);
const sliderInputClassNames = !isHorizontal ? [styles.sliderInputVertical] : [];

@ -2,7 +2,7 @@ import { forwardRef, useState } from 'react';
import { selectors } from '@grafana/e2e-selectors';
import { Input, IconButton } from '@grafana/ui';
import { Props as InputProps } from '@grafana/ui/src/components/Input/Input';
import { InputProps } from '@grafana/ui/internal';
interface Props extends Omit<InputProps, 'type'> {}

@ -3,7 +3,7 @@ import { FormEvent, memo } from 'react';
import * as React from 'react';
import { Checkbox, Portal, useStyles2, useTheme2 } from '@grafana/ui';
import { getSelectStyles } from '@grafana/ui/src/components/Select/getSelectStyles';
import { getSelectStyles } from '@grafana/ui/internal';
import { getStyles } from './styles';

@ -2,7 +2,7 @@ import { cx } from '@emotion/css';
import { forwardRef, FormEvent } from 'react';
import { Checkbox, Icon, Tooltip, useStyles2, useTheme2 } from '@grafana/ui';
import { getSelectStyles } from '@grafana/ui/src/components/Select/getSelectStyles';
import { getSelectStyles } from '@grafana/ui/internal';
import { Role } from 'app/types';
import { getStyles } from './styles';

@ -4,7 +4,7 @@ import * as React from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { useStyles2, getInputStyles, sharedInputStyle, Tooltip, Icon, Spinner } from '@grafana/ui';
import { getFocusStyles } from '@grafana/ui/src/themes/mixins';
import { getFocusStyles } from '@grafana/ui/internal';
import { Trans } from 'app/core/internationalization';
import { Role } from '../../../types';

@ -2,7 +2,7 @@ import { css, cx } from '@emotion/css';
import { useEffect, useRef, useState } from 'react';
import { Button, ScrollContainer, Stack, TextLink, useStyles2, useTheme2 } from '@grafana/ui';
import { getSelectStyles } from '@grafana/ui/src/components/Select/getSelectStyles';
import { getSelectStyles } from '@grafana/ui/internal';
import { Trans } from 'app/core/internationalization';
import { OrgRole, Role } from 'app/types';

@ -1,7 +1,7 @@
import { cx } from '@emotion/css';
import { Button, ScrollContainer, Stack, useStyles2, useTheme2 } from '@grafana/ui';
import { getSelectStyles } from '@grafana/ui/src/components/Select/getSelectStyles';
import { getSelectStyles } from '@grafana/ui/internal';
import { Trans } from 'app/core/internationalization';
import { Role } from 'app/types';

@ -1,9 +1,8 @@
import { Component } from 'react';
import { DataFrame, TimeRange } from '@grafana/data';
import { hasVisibleLegendSeries, PlotLegend } from '@grafana/ui/src/components/uPlot/PlotLegend';
import { UPlotConfigBuilder } from '@grafana/ui/src/components/uPlot/config/UPlotConfigBuilder';
import { withTheme2 } from '@grafana/ui/src/themes/ThemeContext';
import { withTheme2 } from '@grafana/ui';
import { hasVisibleLegendSeries, PlotLegend, UPlotConfigBuilder } from '@grafana/ui/internal';
import { GraphNG, GraphNGProps, PropDiffFn } from '../GraphNG/GraphNG';

@ -59,10 +59,14 @@ for (let i = 0; i < BIN_INCRS.length; i++) {
BIN_INCRS[i] = 2 ** i;
}
import { UPlotConfigBuilder, UPlotConfigPrepFn } from '@grafana/ui/src/components/uPlot/config/UPlotConfigBuilder';
import { getScaleGradientFn } from '@grafana/ui/src/components/uPlot/config/gradientFills';
import { buildScaleKey } from '@grafana/ui/src/components/uPlot/internal';
import { getStackingGroups, preparePlotData2 } from '@grafana/ui/src/components/uPlot/utils';
import {
UPlotConfigBuilder,
UPlotConfigPrepFn,
getScaleGradientFn,
buildScaleKey,
getStackingGroups,
preparePlotData2,
} from '@grafana/ui/internal';
const defaultFormatter = (v: any, decimals: DecimalCount = 1) => (v == null ? '-' : v.toFixed(decimals));

@ -33,7 +33,7 @@ import {
MappingType,
} from '@grafana/schema';
import { FIXED_UNIT, UPlotConfigBuilder, UPlotConfigPrepFn, VizLegendItem } from '@grafana/ui';
import { preparePlotData2, getStackingGroups } from '@grafana/ui/src/components/uPlot/utils';
import { preparePlotData2, getStackingGroups } from '@grafana/ui/internal';
import { getConfig, TimelineCoreOptions } from './timeline';

@ -4,7 +4,7 @@ import * as React from 'react';
import { textUtil } from '@grafana/data';
import { locationService } from '@grafana/runtime';
import { ConfirmModal, ConfirmModalProps, ModalsContext } from '@grafana/ui';
import { ModalsContextState } from '@grafana/ui/src/components/Modal/ModalsContext';
import { ModalsContextState } from '@grafana/ui/internal';
import { ShowConfirmModalEvent, ShowModalReactEvent } from 'app/types/events';
import appEvents from '../app_events';

@ -1,4 +1,4 @@
import { colors, JsonExplorer } from '@grafana/ui/';
import { colors, JsonExplorer } from '@grafana/ui';
import appEvents from './app_events';
import { profiler } from './profiler';

@ -2,14 +2,8 @@ import { css } from '@emotion/css';
import { memo } from 'react';
import { Action, GrafanaTheme2, httpMethodOptions, HttpRequestMethod, VariableSuggestion } from '@grafana/data';
import { Switch } from '@grafana/ui/';
import { Field } from '@grafana/ui/src/components/Forms/Field';
import { InlineField } from '@grafana/ui/src/components/Forms/InlineField';
import { InlineFieldRow } from '@grafana/ui/src/components/Forms/InlineFieldRow';
import { RadioButtonGroup } from '@grafana/ui/src/components/Forms/RadioButtonGroup/RadioButtonGroup';
import { JSONFormatter } from '@grafana/ui/src/components/JSONFormatter/JSONFormatter';
import { useStyles2 } from '@grafana/ui/src/themes';
import { t } from '@grafana/ui/src/utils/i18n';
import { Switch, Field, InlineField, InlineFieldRow, RadioButtonGroup, JSONFormatter, useStyles2 } from '@grafana/ui';
import { t } from 'app/core/internationalization';
import { HTMLElementType, SuggestionsInput } from '../transformers/suggestionsInput/SuggestionsInput';

@ -1,8 +1,7 @@
import { useState } from 'react';
import { Action, DataFrame, VariableSuggestion } from '@grafana/data';
import { Button } from '@grafana/ui/src/components/Button';
import { Modal } from '@grafana/ui/src/components/Modal/Modal';
import { Button, Modal } from '@grafana/ui';
import { Trans } from 'app/core/internationalization';
import { ActionEditor } from './ActionEditor';

@ -2,11 +2,7 @@ import { css } from '@emotion/css';
import { useEffect, useState } from 'react';
import { contentTypeOptions, GrafanaTheme2, VariableSuggestion } from '@grafana/data';
import { IconButton } from '@grafana/ui/src/components/IconButton/IconButton';
import { Input } from '@grafana/ui/src/components/Input/Input';
import { Stack } from '@grafana/ui/src/components/Layout/Stack/Stack';
import { Select } from '@grafana/ui/src/components/Select/Select';
import { useStyles2 } from '@grafana/ui/src/themes';
import { IconButton, Input, Stack, Select, useStyles2 } from '@grafana/ui';
import { SuggestionsInput } from '../transformers/suggestionsInput/SuggestionsInput';

@ -4,7 +4,7 @@ import Skeleton from 'react-loading-skeleton';
import { GrafanaTheme2 } from '@grafana/data';
import { Button, ConfirmModal, useStyles2 } from '@grafana/ui';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/src/unstable';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/unstable';
import { contextSrv } from 'app/core/core';
import { Trans } from 'app/core/internationalization';
import { AccessControlAction, Organization } from 'app/types';

@ -2,7 +2,7 @@ import { Fragment } from 'react';
import Skeleton from 'react-loading-skeleton';
import { ScrollContainer, Text } from '@grafana/ui';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/src/unstable';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/unstable';
import { Settings } from './AdminSettings';

@ -3,7 +3,7 @@ import { css, cx } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/src';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { config } from '@grafana/runtime';
import { Button, LoadingPlaceholder, Modal, ModalsController, useStyles2 } from '@grafana/ui/src';
import { Button, LoadingPlaceholder, Modal, ModalsController, useStyles2 } from '@grafana/ui';
import { Trans, t } from 'app/core/internationalization';
import {
generatePublicDashboardConfigUrl,

@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/src';
import { config } from '@grafana/runtime';
import { Button, Modal, ModalsController, useStyles2 } from '@grafana/ui/src';
import { Button, Modal, ModalsController, useStyles2 } from '@grafana/ui';
import { Trans, t } from 'app/core/internationalization';
import { SessionUser } from 'app/features/dashboard/components/ShareModal/SharePublicDashboard/SharePublicDashboardUtils';

@ -1,5 +1,5 @@
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { Icon, Stack, Tag, Tooltip } from '@grafana/ui/src';
import { Icon, Stack, Tag, Tooltip } from '@grafana/ui';
import { Page } from 'app/core/components/Page/Page';
import { Trans, t } from 'app/core/internationalization';

@ -1,7 +1,7 @@
import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/src';
import { Alert, useStyles2 } from '@grafana/ui/src';
import { Alert, useStyles2 } from '@grafana/ui';
import { AlertmanagerChoice } from '../../../../plugins/datasource/alertmanager/types';
import { alertmanagerApi } from '../api/alertmanagerApi';

@ -1,7 +1,7 @@
import { css } from '@emotion/css';
import { DataFrame, GrafanaTheme2 } from '@grafana/data/src';
import { Icon, TagList, Tooltip, useStyles2 } from '@grafana/ui/src';
import { Icon, TagList, Tooltip, useStyles2 } from '@grafana/ui';
import { labelsToTags } from '../../utils/labels';
import { AlertStateTag } from '../rules/AlertStateTag';

@ -1,8 +1,7 @@
import { useMemo } from 'react';
import { SelectableValue } from '@grafana/data';
import { Select } from '@grafana/ui';
import { SelectBaseProps } from '@grafana/ui/src/components/Select/types';
import { Select, SelectBaseProps } from '@grafana/ui';
import { GrafanaAlertStateDecision } from 'app/types/unified-alerting-dto';
type Props = Omit<SelectBaseProps<GrafanaAlertStateDecision>, 'options'> & {

@ -5,7 +5,7 @@ import { Controller, useFormContext } from 'react-hook-form';
import { GrafanaTheme2, SelectableValue } from '@grafana/data';
import { Field, FieldValidationMessage, InlineField, MultiSelect, Stack, Switch, Text, useStyles2 } from '@grafana/ui';
import { MultiValueRemove, MultiValueRemoveProps } from '@grafana/ui/src/components/Select/MultiValue';
import { MultiValueRemove, MultiValueRemoveProps } from '@grafana/ui/internal';
import { RuleFormValues } from 'app/features/alerting/unified/types/rule-form';
import {
commonGroupByOptions,

@ -3,7 +3,7 @@ import { useMemo } from 'react';
import { GrafanaTheme2 } from '@grafana/data/src';
import { config } from '@grafana/runtime/src';
import { Icon, Tooltip, useStyles2 } from '@grafana/ui/src';
import { Icon, Tooltip, useStyles2 } from '@grafana/ui';
import { CombinedRule } from '../../../../../types/unified-alerting';
import { checkEvaluationIntervalGlobalLimit } from '../../utils/config';

@ -1,8 +1,7 @@
import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/';
import { Stack, Text } from '@grafana/ui';
import { useStyles2 } from '@grafana/ui/';
import { Stack, Text, useStyles2 } from '@grafana/ui';
import { useAlertingHomePageExtensions } from '../plugins/useAlertingHomePageExtensions';

@ -1,7 +1,7 @@
import { useAsync } from 'react-use';
import { Badge, IconSize, Tooltip } from '@grafana/ui';
import { getSvgSize } from '@grafana/ui/src/components/Icon/utils';
import { getSvgSize } from '@grafana/ui/internal';
import { getPluginSettings } from '../../../plugins/pluginSettings';

@ -4,7 +4,7 @@ import Skeleton from 'react-loading-skeleton';
import { GrafanaTheme2 } from '@grafana/data';
import { reportInteraction } from '@grafana/runtime';
import { Icon, IconButton, Link, Spinner, useStyles2, Text } from '@grafana/ui';
import { getSvgSize } from '@grafana/ui/src/components/Icon/utils';
import { getSvgSize } from '@grafana/ui/internal';
import { t } from 'app/core/internationalization';
import { getIconForItem } from 'app/features/search/service/utils';

@ -6,8 +6,7 @@ import { of } from 'rxjs';
import { DataFrame, FieldNamePickerConfigSettings, GrafanaTheme2, StandardEditorsRegistryItem } from '@grafana/data';
import { TextDimensionMode } from '@grafana/schema';
import { usePanelContext, useStyles2 } from '@grafana/ui';
import { FieldNamePicker } from '@grafana/ui/src/components/MatchersUI/FieldNamePicker';
import { frameHasName, getFrameFieldsDisplayNames } from '@grafana/ui/src/components/MatchersUI/utils';
import { FieldNamePicker, frameHasName, getFrameFieldsDisplayNames } from '@grafana/ui/internal';
import { DimensionContext } from 'app/features/dimensions/context';
import { ColorDimensionEditor } from 'app/features/dimensions/editors/ColorDimensionEditor';
import { TextDimensionEditor } from 'app/features/dimensions/editors/TextDimensionEditor';

@ -1,8 +1,7 @@
import { useForm } from 'react-hook-form';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
import { Button, Divider, Field, FieldSet, Icon, Stack, Tooltip } from '@grafana/ui';
import { Input } from '@grafana/ui/src/components/Input/Input';
import { Button, Divider, Field, FieldSet, Icon, Input, Stack, Tooltip } from '@grafana/ui';
import { contextSrv } from 'app/core/core';
import { t, Trans } from 'app/core/internationalization';
import { publicDashboardApi, useAddRecipientMutation } from 'app/features/dashboard/api/publicDashboardApi';

@ -2,8 +2,7 @@ import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
import { Dropdown, Field, Icon, Menu, Spinner, Stack, Text, useStyles2 } from '@grafana/ui';
import { IconButton } from '@grafana/ui/';
import { Dropdown, Field, Icon, IconButton, Menu, Spinner, Stack, Text, useStyles2 } from '@grafana/ui';
import { t } from 'app/core/internationalization';
import {
useReshareAccessToRecipientMutation,

@ -3,8 +3,7 @@ import { useForm } from 'react-hook-form';
import { GrafanaTheme2 } from '@grafana/data';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
import { Button, Checkbox, FieldSet, Spinner, Stack } from '@grafana/ui';
import { useStyles2 } from '@grafana/ui/';
import { Button, Checkbox, FieldSet, Spinner, Stack, useStyles2 } from '@grafana/ui';
import { contextSrv } from 'app/core/core';
import { t, Trans } from 'app/core/internationalization';
import { useCreatePublicDashboardMutation } from 'app/features/dashboard/api/publicDashboardApi';

@ -4,8 +4,7 @@ import { Controller, useForm } from 'react-hook-form';
import { GrafanaTheme2 } from '@grafana/data';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
import { sceneGraph } from '@grafana/scenes';
import { FieldSet, Icon, Label, Spinner, Stack, Text, TimeRangeLabel, Tooltip, useStyles2 } from '@grafana/ui';
import { Switch } from '@grafana/ui/src/components/Switch/Switch';
import { FieldSet, Icon, Label, Spinner, Stack, Switch, Text, TimeRangeLabel, Tooltip, useStyles2 } from '@grafana/ui';
import { contextSrv } from 'app/core/core';
import { t, Trans } from 'app/core/internationalization';
import { publicDashboardApi, useUpdatePublicDashboardMutation } from 'app/features/dashboard/api/publicDashboardApi';

@ -3,8 +3,7 @@ import { PropsWithChildren } from 'react';
import { GrafanaTheme2, SelectableValue } from '@grafana/data';
import { SceneObjectRef, VizPanel } from '@grafana/scenes';
import { Alert, Button, Divider, Field, RadioButtonGroup, Stack, Text, useStyles2 } from '@grafana/ui';
import { Input } from '@grafana/ui/src/components/Input/Input';
import { Alert, Button, Divider, Field, Input, RadioButtonGroup, Stack, Text, useStyles2 } from '@grafana/ui';
import { t, Trans } from 'app/core/internationalization';
import { getExpireOptions } from '../../ShareSnapshotTab';

@ -1,9 +1,8 @@
import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data';
import { Spinner, Stack, Text } from '@grafana/ui';
import { IconButton, useStyles2 } from '@grafana/ui/';
import { ConfirmContent, ConfirmContentProps } from '@grafana/ui/src/components/ConfirmModal/ConfirmContent';
import { IconButton, useStyles2, Spinner, Stack, Text } from '@grafana/ui';
import { ConfirmContent, ConfirmContentProps } from '@grafana/ui/internal';
import { t } from 'app/core/internationalization';
export function ShareDrawerConfirmAction({

@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import { FieldConfigOptionsRegistry, GrafanaTheme2, ConfigOverrideRule } from '@grafana/data';
import { Button, HorizontalGroup, Icon, useStyles2 } from '@grafana/ui';
import { FieldMatcherUIRegistryItem } from '@grafana/ui/src/components/MatchersUI/types';
import { FieldMatcherUIRegistryItem } from '@grafana/ui/internal';
interface Props {
isExpanded: boolean;

@ -5,8 +5,7 @@ import { renderMarkdown, LinkModelSupplier, ScopedVars, IconName } from '@grafan
import { GrafanaTheme2 } from '@grafana/data/';
import { selectors } from '@grafana/e2e-selectors';
import { locationService, getTemplateSrv } from '@grafana/runtime';
import { Tooltip, PopoverContent, Icon, Themeable2, withTheme2 } from '@grafana/ui';
import { useStyles2 } from '@grafana/ui/';
import { Tooltip, PopoverContent, Icon, Themeable2, withTheme2, useStyles2 } from '@grafana/ui';
import { getTimeSrv, TimeSrv } from 'app/features/dashboard/services/TimeSrv';
import { PanelModel } from 'app/features/dashboard/state/PanelModel';
import { InspectTab } from 'app/features/inspector/types';

@ -1,8 +1,7 @@
import { useCallback } from 'react';
import { locationService } from '@grafana/runtime';
import { Button, VerticalGroup } from '@grafana/ui';
import { Layout } from '@grafana/ui/src/components/Layout/Layout';
import { Button, Stack } from '@grafana/ui';
import { PanelEditorTabId } from './types';
@ -16,15 +15,17 @@ export function PanelNotSupported({ message }: Props): JSX.Element {
}, []);
return (
<Layout justify="center" style={{ marginTop: '100px' }}>
<VerticalGroup spacing="md">
<h2>{message}</h2>
<div>
<Button size="md" variant="secondary" icon="arrow-left" onClick={onBackToQueries}>
Go back to Queries
</Button>
</div>
</VerticalGroup>
</Layout>
<div style={{ marginTop: '100px' }}>
<Stack direction="row" justifyContent="center">
<Stack direction="column" gap={2}>
<h2>{message}</h2>
<div>
<Button size="md" variant="secondary" icon="arrow-left" onClick={onBackToQueries}>
Go back to Queries
</Button>
</div>
</Stack>
</Stack>
</div>
);
}

@ -4,8 +4,7 @@ import { useLocalStorage } from 'react-use';
import { GrafanaTheme2, PanelData, SelectableValue } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { Button, FilterInput, RadioButtonGroup, ScrollContainer, useStyles2 } from '@grafana/ui';
import { Field } from '@grafana/ui/src/components/Forms/Field';
import { Button, Field, FilterInput, RadioButtonGroup, ScrollContainer, useStyles2 } from '@grafana/ui';
import { LS_VISUALIZATION_SELECT_TAB_KEY } from 'app/core/constants';
import { PanelLibraryOptionsGroup } from 'app/features/library-panels/components/PanelLibraryOptionsGroup/PanelLibraryOptionsGroup';
import { VisualizationSuggestions } from 'app/features/panel/components/VizTypePicker/VisualizationSuggestions';

@ -2,7 +2,7 @@ import { css, cx } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/src';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { useStyles2 } from '@grafana/ui/src';
import { useStyles2 } from '@grafana/ui';
import { Branding } from '../../../../core/components/Branding/Branding';
import { getLoginStyles } from '../../../../core/components/Login/LoginLayout';

@ -9,12 +9,12 @@ import {
Field,
HorizontalGroup,
Input,
Stack,
Label,
ModalsController,
Switch,
useStyles2,
} from '@grafana/ui/src';
import { Layout } from '@grafana/ui/src/components/Layout/Layout';
} from '@grafana/ui';
import { Trans, t } from 'app/core/internationalization';
import {
useDeletePublicDashboardMutation,
@ -167,7 +167,7 @@ export function ConfigPublicDashboardBase({
</Field>
<Field className={styles.fieldSpace}>
<Layout>
<Stack>
<Switch
{...register('isPaused')}
disabled={disableInputs}
@ -186,7 +186,7 @@ export function ConfigPublicDashboardBase({
>
<Trans i18nKey="public-dashboard.config.pause-sharing-dashboard-label">Pause sharing dashboard</Trans>
</Label>
</Layout>
</Stack>
</Field>
<Field className={styles.fieldSpace}>
@ -207,10 +207,10 @@ export function ConfigPublicDashboardBase({
</SettingsBar>
</Field>
<Layout
orientation={isDesktop ? 0 : 1}
justify={isDesktop ? 'flex-end' : 'flex-start'}
align={isDesktop ? 'center' : 'normal'}
<Stack
direction={isDesktop ? 'row' : 'column'}
justifyContent={isDesktop ? 'flex-end' : 'flex-start'}
alignItems={isDesktop ? 'center' : 'stretch'}
>
<HorizontalGroup justify="flex-end">
<Button
@ -225,7 +225,7 @@ export function ConfigPublicDashboardBase({
<Trans i18nKey="public-dashboard.config.revoke-public-URL-button">Revoke public URL</Trans>
</Button>
</HorizontalGroup>
</Layout>
</Stack>
</div>
);
}

@ -2,8 +2,7 @@ import { UseFormRegister } from 'react-hook-form';
import { TimeRange } from '@grafana/data/src';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { FieldSet, Label, Switch, TimeRangeInput, VerticalGroup } from '@grafana/ui/src';
import { Layout } from '@grafana/ui/src/components/Layout/Layout';
import { FieldSet, Label, Switch, TimeRangeInput, Stack, VerticalGroup } from '@grafana/ui';
import { Trans, t } from 'app/core/internationalization';
import { DashboardInteractions } from 'app/features/dashboard-scene/utils/interactions';
@ -26,7 +25,7 @@ export const Configuration = ({
<>
<FieldSet disabled={disabled}>
<VerticalGroup spacing="md">
<Layout orientation={1} spacing="xs" justify="space-between">
<Stack direction="column" gap={0.5} justifyContent="space-between">
<Label
description={t(
'public-dashboard.settings-configuration.default-time-range-label-desc',
@ -38,8 +37,8 @@ export const Configuration = ({
</Trans>
</Label>
<TimeRangeInput value={timeRange} disabled onChange={() => {}} />
</Layout>
<Layout orientation={0} spacing="sm">
</Stack>
<Stack direction="row" gap={0.5}>
<Switch
{...register('isTimeSelectionEnabled')}
data-testid={selectors.EnableTimeRangeSwitch}
@ -60,8 +59,8 @@ export const Configuration = ({
Time range picker enabled
</Trans>
</Label>
</Layout>
<Layout orientation={0} spacing="sm">
</Stack>
<Stack direction="row" gap={0.5}>
<Switch
{...register('isAnnotationsEnabled')}
onChange={(e) => {
@ -80,7 +79,7 @@ export const Configuration = ({
>
<Trans i18nKey="public-dashboard.settings-configuration.show-annotations-label">Show annotations</Trans>
</Label>
</Layout>
</Stack>
</VerticalGroup>
</FieldSet>
</>

@ -3,7 +3,7 @@ import { UseFormRegister } from 'react-hook-form';
import { GrafanaTheme2 } from '@grafana/data/src';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { Checkbox, FieldSet, HorizontalGroup, LinkButton, useStyles2, VerticalGroup } from '@grafana/ui/src';
import { Checkbox, FieldSet, HorizontalGroup, LinkButton, useStyles2, VerticalGroup } from '@grafana/ui';
import { t, Trans } from 'app/core/internationalization';
import { SharePublicDashboardAcknowledgmentInputs } from './CreatePublicDashboard';

@ -1,6 +1,6 @@
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { config } from '@grafana/runtime';
import { Alert } from '@grafana/ui/src';
import { Alert } from '@grafana/ui';
import { Trans, t } from 'app/core/internationalization';
const selectors = e2eSelectors.pages.ShareDashboardModal.PublicDashboard;

@ -1,4 +1,4 @@
import { Alert } from '@grafana/ui/src';
import { Alert } from '@grafana/ui';
import { t } from 'app/core/internationalization';
export const SaveDashboardChangesAlert = () => (

@ -4,7 +4,7 @@ import cx from 'classnames';
import { GrafanaTheme2 } from '@grafana/data/src';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { config } from '@grafana/runtime';
import { Alert, useStyles2 } from '@grafana/ui/src';
import { Alert, useStyles2 } from '@grafana/ui';
import { Trans, t } from 'app/core/internationalization';
const selectors = e2eSelectors.pages.ShareDashboardModal.PublicDashboard;

@ -1,5 +1,5 @@
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
import { Alert } from '@grafana/ui/src';
import { Alert } from '@grafana/ui';
import { Trans, t } from 'app/core/internationalization';
const selectors = e2eSelectors.pages.ShareDashboardModal.PublicDashboard;

@ -1,7 +1,7 @@
import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/src';
import { Spinner, useStyles2 } from '@grafana/ui/src';
import { Spinner, useStyles2 } from '@grafana/ui';
import { useGetPublicDashboardQuery } from 'app/features/dashboard/api/publicDashboardApi';
import { publicDashboardPersisted } from 'app/features/dashboard/components/ShareModal/SharePublicDashboard/SharePublicDashboardUtils';
import { ShareModalTabProps } from 'app/features/dashboard/components/ShareModal/types';

@ -4,7 +4,7 @@ import { useEffect, useState } from 'react';
import { AnnotationQuery, EventBus, GrafanaTheme2 } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { InlineField, InlineFieldRow, InlineSwitch, useStyles2 } from '@grafana/ui';
import { LoadingIndicator } from '@grafana/ui/src/components/PanelChrome/LoadingIndicator';
import { LoadingIndicator } from '@grafana/ui/internal';
import { AnnotationQueryFinished, AnnotationQueryStarted } from '../../../../types/events';
import { getDashboardQueryRunner } from '../../../query/state/DashboardQueryRunner/DashboardQueryRunner';

@ -6,8 +6,8 @@ import { GrafanaTheme2, ScopedVars } from '@grafana/data';
import { sanitize, sanitizeUrl } from '@grafana/data/src/text/sanitize';
import { selectors } from '@grafana/e2e-selectors';
import { DashboardLink } from '@grafana/schema';
import { Dropdown, Icon, Button, Menu, ScrollContainer, useStyles2 } from '@grafana/ui';
import { ButtonLinkProps, LinkButton } from '@grafana/ui/src/components/Button';
import { Dropdown, Icon, LinkButton, Button, Menu, ScrollContainer, useStyles2 } from '@grafana/ui';
import { ButtonLinkProps } from '@grafana/ui/internal';
import { getBackendSrv } from 'app/core/services/backend_srv';
import { DashboardSearchItem } from 'app/features/search/types';

@ -3,7 +3,7 @@ import * as React from 'react';
import { GrafanaTheme2, QueryResultMetaNotice } from '@grafana/data';
import { Icon, ToolbarButton, Tooltip, useStyles2 } from '@grafana/ui';
import { getFocusStyles, getMouseFocusStyles } from '@grafana/ui/src/themes/mixins';
import { getFocusStyles, getMouseFocusStyles } from '@grafana/ui/internal';
interface Props {
notice: QueryResultMetaNotice;

@ -32,7 +32,7 @@ import { mergeTransformer } from '@grafana/data/src/transformations/transformers
import { getDataSourceSrv, setDataSourceSrv } from '@grafana/runtime';
import { DataTransformerConfig } from '@grafana/schema';
import { AxisPlacement, GraphFieldConfig } from '@grafana/ui';
import { migrateTableDisplayModeToCellOptions } from '@grafana/ui/src/components/Table/utils';
import { migrateTableDisplayModeToCellOptions } from '@grafana/ui/internal';
import { getAllOptionEditors, getAllStandardFieldConfigs } from 'app/core/components/OptionsUI/registry';
import { config } from 'app/core/config';
import {

@ -1,7 +1,7 @@
import { useCallback } from 'react';
import { SelectableValue, StandardEditorProps } from '@grafana/data';
import { InlineField, InlineFieldRow, RadioButtonGroup } from '@grafana/ui/src';
import { InlineField, InlineFieldRow, RadioButtonGroup } from '@grafana/ui';
import { BackgroundImageSize } from 'app/plugins/panel/canvas/panelcfg.gen';
const options: Array<SelectableValue<BackgroundImageSize>> = [

@ -4,7 +4,7 @@ import { useCallback } from 'react';
import { GrafanaTheme2, SelectableValue, StandardEditorProps, FieldNamePickerBaseNameMode } from '@grafana/data';
import { ColorDimensionConfig } from '@grafana/schema';
import { Select, ColorPicker, useStyles2 } from '@grafana/ui';
import { useFieldDisplayNames, useSelectOptions } from '@grafana/ui/src/components/MatchersUI/utils';
import { useFieldDisplayNames, useSelectOptions } from '@grafana/ui/internal';
const fixedColorOption: SelectableValue<string> = {
label: 'Fixed color',

@ -4,7 +4,7 @@ import * as React from 'react';
import { FieldNamePickerConfigSettings, StandardEditorProps, StandardEditorsRegistryItem } from '@grafana/data';
import { ResourceDimensionConfig, ResourceDimensionMode } from '@grafana/schema';
import { InlineField, InlineFieldRow, RadioButtonGroup } from '@grafana/ui';
import { FieldNamePicker } from '@grafana/ui/src/components/MatchersUI/FieldNamePicker';
import { FieldNamePicker } from '@grafana/ui/internal';
import { getPublicOrAbsoluteUrl, ResourceFolderName } from '..';
import { MediaType, ResourceDimensionOptions, ResourcePickerSize } from '../types';

@ -14,7 +14,7 @@ import {
useStyles2,
useTheme2,
} from '@grafana/ui';
import { closePopover } from '@grafana/ui/src/utils/closePopover';
import { closePopover } from '@grafana/ui/internal';
import { SanitizedSVG } from 'app/core/components/SVG/SanitizedSVG';
import { getPublicOrAbsoluteUrl } from '../resource';

@ -4,7 +4,7 @@ import { useCallback } from 'react';
import { FieldType, GrafanaTheme2, SelectableValue, StandardEditorProps } from '@grafana/data';
import { ScalarDimensionMode, ScalarDimensionConfig } from '@grafana/schema';
import { InlineField, InlineFieldRow, RadioButtonGroup, Select, useStyles2 } from '@grafana/ui';
import { useFieldDisplayNames, useSelectOptions } from '@grafana/ui/src/components/MatchersUI/utils';
import { useFieldDisplayNames, useSelectOptions } from '@grafana/ui/internal';
import { NumberInput } from 'app/core/components/OptionsUI/NumberInput';
import { ScalarDimensionOptions } from '../types';

@ -4,7 +4,7 @@ import { useCallback, useMemo } from 'react';
import { GrafanaTheme2, SelectableValue, StandardEditorProps } from '@grafana/data';
import { ScaleDimensionConfig } from '@grafana/schema';
import { InlineField, InlineFieldRow, Select, useStyles2 } from '@grafana/ui';
import { useFieldDisplayNames, useSelectOptions } from '@grafana/ui/src/components/MatchersUI/utils';
import { useFieldDisplayNames, useSelectOptions } from '@grafana/ui/internal';
import { NumberInput } from 'app/core/components/OptionsUI/NumberInput';
import { validateScaleOptions, validateScaleConfig } from '../scale';

@ -8,7 +8,7 @@ import {
} from '@grafana/data';
import { TextDimensionConfig, TextDimensionMode } from '@grafana/schema';
import { Button, InlineField, InlineFieldRow, RadioButtonGroup } from '@grafana/ui';
import { FieldNamePicker } from '@grafana/ui/src/components/MatchersUI/FieldNamePicker';
import { FieldNamePicker } from '@grafana/ui/internal';
import { StringValueEditor } from 'app/core/components/OptionsUI/string';
import { TextDimensionOptions } from '../types';

@ -4,7 +4,7 @@ import * as React from 'react';
import { IconName, isIconName, GrafanaTheme2 } from '@grafana/data';
import { Button, Icon, Tooltip, useTheme2 } from '@grafana/ui';
import { TooltipPlacement } from '@grafana/ui/src/components/Tooltip';
import { TooltipPlacement } from '@grafana/ui/internal';
type CommonProps = {
contentOutlineExpanded?: boolean;

@ -29,7 +29,7 @@ import {
Themeable2,
withTheme2,
} from '@grafana/ui';
import { FILTER_FOR_OPERATOR, FILTER_OUT_OPERATOR } from '@grafana/ui/src/components/Table/types';
import { FILTER_FOR_OPERATOR, FILTER_OUT_OPERATOR } from '@grafana/ui/internal';
import { supportedFeatures } from 'app/core/history/richHistoryStorageProvider';
import { MIXED_DATASOURCE_NAME } from 'app/plugins/datasource/mixed/MixedDataSource';
import { StoreState } from 'app/types';

@ -48,7 +48,7 @@ import {
Themeable2,
withTheme2,
} from '@grafana/ui';
import { mapMouseEventToMode } from '@grafana/ui/src/components/VizLegend/utils';
import { mapMouseEventToMode } from '@grafana/ui/internal';
import { Trans } from 'app/core/internationalization';
import store from 'app/core/store';
import { createAndCopyShortLink, getLogsPermalinkRange } from 'app/core/utils/shortLinks';

@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import * as React from 'react';
import { GrafanaTheme2 } from '@grafana/data/src';
import { Field, Input, useTheme2 } from '@grafana/ui/src';
import { Field, Input, useTheme2 } from '@grafana/ui';
function getStyles(theme: GrafanaTheme2) {
return {

@ -19,7 +19,7 @@ import {
} from '@grafana/data';
import { config } from '@grafana/runtime';
import { AdHocFilterItem, Table } from '@grafana/ui';
import { FILTER_FOR_OPERATOR, FILTER_OUT_OPERATOR } from '@grafana/ui/src/components/Table/types';
import { FILTER_FOR_OPERATOR, FILTER_OUT_OPERATOR } from '@grafana/ui/internal';
import { LogsFrame } from 'app/features/logs/logsFrame';
import { getFieldLinksForExplore } from '../utils/links';

@ -2,7 +2,7 @@ import { css, cx } from '@emotion/css';
import { DragDropContext, Draggable, DraggableProvided, Droppable, DropResult } from '@hello-pangea/dnd';
import { GrafanaTheme2 } from '@grafana/data/src';
import { useTheme2 } from '@grafana/ui/src';
import { useTheme2 } from '@grafana/ui';
import { LogsTableEmptyFields } from './LogsTableEmptyFields';
import { LogsTableNavField } from './LogsTableNavField';

@ -1,4 +1,4 @@
import { useTheme2 } from '@grafana/ui/src';
import { useTheme2 } from '@grafana/ui';
import { getLogsFieldsStyles } from './LogsTableActiveFields';
import { LogsTableEmptyFields } from './LogsTableEmptyFields';

@ -1,7 +1,7 @@
import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/src';
import { useTheme2 } from '@grafana/ui/src';
import { useTheme2 } from '@grafana/ui';
import { LogsTableActiveFields } from './LogsTableActiveFields';
import { LogsTableAvailableFields } from './LogsTableAvailableFields';

@ -14,7 +14,7 @@ import {
TimeRange,
} from '@grafana/data';
import { reportInteraction } from '@grafana/runtime/src';
import { InlineField, Select, Themeable2 } from '@grafana/ui/';
import { InlineField, Select, Themeable2 } from '@grafana/ui';
import { parseLogsFrame } from '../../logs/logsFrame';

@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import { Field, GrafanaTheme2 } from '@grafana/data/';
import { InstantQueryRefIdIndex } from '@grafana/prometheus';
import { useStyles2 } from '@grafana/ui/';
import { useStyles2 } from '@grafana/ui';
import { rawListItemColumnWidth } from './RawListItem';

@ -1,7 +1,7 @@
import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/';
import { useStyles2 } from '@grafana/ui/';
import { useStyles2 } from '@grafana/ui';
import { rawListItemColumnWidth, rawListPaddingToHoldSpaceForCopyIcon, RawListValue } from './RawListItem';
import { RawPrometheusListItemEmptyValue } from './utils/getRawPrometheusListItemsFromDataFrame';

@ -6,7 +6,7 @@ import { VariableSizeList as List } from 'react-window';
import { DataFrame, Field as DataFrameField } from '@grafana/data/';
import { reportInteraction } from '@grafana/runtime/src';
import { Field, Switch } from '@grafana/ui/';
import { Field, Switch } from '@grafana/ui';
import { ItemLabels } from './ItemLabels';
import RawListItem from './RawListItem';

@ -4,7 +4,7 @@ import { useCopyToClipboard } from 'react-use';
import { Field, GrafanaTheme2 } from '@grafana/data/';
import { isValidLegacyName, utf8Support } from '@grafana/prometheus/src/utf8_support';
import { reportInteraction } from '@grafana/runtime/src';
import { IconButton, useStyles2 } from '@grafana/ui/';
import { IconButton, useStyles2 } from '@grafana/ui';
import { ItemLabels } from './ItemLabels';
import { ItemValues } from './ItemValues';

@ -1,7 +1,7 @@
import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/';
import { useStyles2 } from '@grafana/ui/';
import { useStyles2 } from '@grafana/ui';
import { RawListValue } from './RawListItem';

@ -20,7 +20,7 @@ import * as React from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { config, reportInteraction } from '@grafana/runtime';
import { Icon, PopoverContent, Tooltip, useTheme2 } from '@grafana/ui';
import { getButtonStyles } from '@grafana/ui/src/components/Button';
import { getButtonStyles } from '@grafana/ui/internal';
import { Trace } from '../../types';

@ -17,7 +17,7 @@ import { memo, Dispatch, SetStateAction, useMemo } from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { Button, Switch, useStyles2 } from '@grafana/ui';
import { getButtonStyles } from '@grafana/ui/src/components/Button';
import { getButtonStyles } from '@grafana/ui/internal';
import { SearchProps } from '../../../useSearch';
import { Trace } from '../../types';

@ -5,7 +5,7 @@ import Skeleton from 'react-loading-skeleton';
import { GrafanaTheme2 } from '@grafana/data';
import { config } from '@grafana/runtime';
import { Icon, Link, useStyles2 } from '@grafana/ui';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/src/unstable';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/unstable';
import { getPanelPluginNotFound } from 'app/features/panel/components/PanelPluginError';
import { PanelTypeCard } from 'app/features/panel/components/VizTypePicker/PanelTypeCard';

@ -1,7 +1,7 @@
import * as React from 'react';
import { config } from '@grafana/runtime';
import { Button, ModalsController, ButtonProps } from '@grafana/ui/src';
import { Button, ModalsController, ButtonProps } from '@grafana/ui';
import { t } from 'app/core/internationalization';
import { useDeletePublicDashboardMutation } from 'app/features/dashboard/api/publicDashboardApi';
import { DashboardModel } from 'app/features/dashboard/state/DashboardModel';

@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data/src';
import { config } from '@grafana/runtime';
import { ConfirmModal, useStyles2 } from '@grafana/ui/src';
import { ConfirmModal, useStyles2 } from '@grafana/ui';
import { t } from 'app/core/internationalization';
const Body = () => {

@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import Skeleton from 'react-loading-skeleton';
import { Button, LinkButton, useStyles2 } from '@grafana/ui';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/src/unstable';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/unstable';
import { t, Trans } from 'app/core/internationalization';
import { contextSrv } from 'app/core/services/context_srv';
import { Snapshot } from 'app/features/dashboard/services/SnapshotSrv';

@ -5,7 +5,7 @@ import Skeleton from 'react-loading-skeleton';
import { DataSourceInstanceSettings } from '@grafana/data';
import { config } from '@grafana/runtime';
import { CellProps, Stack, Text, Icon, useStyles2 } from '@grafana/ui';
import { getSvgSize } from '@grafana/ui/src/components/Icon/utils';
import { getSvgSize } from '@grafana/ui/internal';
import { Trans } from 'app/core/internationalization';
import { useGetFolderQuery } from 'app/features/browse-dashboards/api/browseDashboardsAPI';

@ -1,6 +1,6 @@
import { isFetchError } from '@grafana/runtime';
import { Alert, Stack, Text } from '@grafana/ui';
import { Props as AlertProps } from '@grafana/ui/src/components/Alert/Alert';
import { AlertProps } from '@grafana/ui/internal';
interface AlertWithTraceIDProps extends AlertProps {
error?: unknown;

@ -6,7 +6,7 @@ import Skeleton from 'react-loading-skeleton';
import { GrafanaTheme2, isUnsignedPluginSignature, PanelPluginMeta, PluginState } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { IconButton, PluginSignatureBadge, useStyles2 } from '@grafana/ui';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/src/unstable';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/unstable';
import { PluginStateInfo } from 'app/features/plugins/components/PluginStateInfo';
interface Props {

@ -3,7 +3,7 @@ import Skeleton from 'react-loading-skeleton';
import { GrafanaTheme2 } from '@grafana/data';
import { Button, Card, LinkButton, ModalsController, Stack, useStyles2 } from '@grafana/ui';
import { attachSkeleton, SkeletonComponent } from '@grafana/ui/src/unstable';
import { attachSkeleton, SkeletonComponent } from '@grafana/ui/unstable';
import { t, Trans } from 'app/core/internationalization';
import { contextSrv } from 'app/core/services/context_srv';
import { DashNavButton } from 'app/features/dashboard/components/DashNav/DashNavButton';

@ -2,7 +2,7 @@ import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data';
import { useStyles2 } from '@grafana/ui';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/src/unstable';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/unstable';
import { PlaylistCard } from './PlaylistCard';
import { Playlist } from './types';

@ -4,7 +4,7 @@ import Skeleton from 'react-loading-skeleton';
import { GrafanaTheme2 } from '@grafana/data';
import { locationService, reportInteraction } from '@grafana/runtime';
import { Badge, Icon, Stack, useStyles2 } from '@grafana/ui';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/src/unstable';
import { SkeletonComponent, attachSkeleton } from '@grafana/ui/unstable';
import { CatalogPlugin, PluginIconName } from '../types';

@ -54,7 +54,7 @@ export const sharedDependenciesMap = {
'@grafana/runtime/unstable': () => import('@grafana/runtime/src/unstable'),
'@grafana/slate-react': () => import('slate-react'),
'@grafana/ui': grafanaUI,
'@grafana/ui/unstable': () => import('@grafana/ui/src/unstable'),
'@grafana/ui/unstable': () => import('@grafana/ui/unstable'),
'@kusto/monaco-kusto': () => import('@kusto/monaco-kusto'),
'app/core/app_events': {
default: appEvents,

@ -1,4 +1,4 @@
import { EmotionPerfTest } from '@grafana/ui/src/components/ThemeDemos/EmotionPerfTest';
import { EmotionPerfTest } from '@grafana/ui/internal';
export const BenchmarksPage = () => {
return <EmotionPerfTest />;

@ -9,8 +9,7 @@ import { Observable } from 'rxjs';
import { Field, GrafanaTheme2 } from '@grafana/data';
import { TableCellHeight } from '@grafana/schema';
import { useStyles2, useTheme2 } from '@grafana/ui';
import { TableCell } from '@grafana/ui/src/components/Table/TableCell';
import { useTableStyles } from '@grafana/ui/src/components/Table/styles';
import { useTableStyles, TableCell } from '@grafana/ui/internal';
import { useCustomFlexLayout } from 'app/features/browse-dashboards/components/customFlexTableLayout';
import { useSearchKeyboardNavigation } from '../../hooks/useSearchKeyboardSelection';

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save