root
/
grafana
mirror of https://github.com/grafana/grafana.git
1
0
Fork 0
Code Issues Actions 243 Packages Projects Releases Wiki Activity

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
This commit is contained in:
Jack Westbrook 2025-03-12 14:14:32 +01:00 committed by GitHub
parent dcba71a0b0
commit c9f563e576
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
182 changed files with 527 additions and 743 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

590
.betterer.results
View File

File diff suppressed because it is too large Load Diff

10
packages/README.md
View File

@ -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

4
packages/grafana-plugin-configs/tsconfig.json
View File

@ -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

16
packages/grafana-ui/package.json
View File

@ -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",

104
packages/grafana-ui/src/internal/index.ts Normal file
View File

@ -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';

2
public/app/core/components/AppChrome/TopBar/TopSearchBarCommandPaletteTrigger.tsx
View File

@ -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';

6
public/app/core/components/GraphNG/GraphNG.tsx
View File

@ -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';

2
public/app/core/components/Indent/Indent.tsx
View File

@ -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;

3
public/app/core/components/NestedFolderPicker/NestedFolderList.tsx
View File

@ -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';

2
public/app/core/components/NestedFolderPicker/Trigger.tsx
View File

@ -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
public/app/core/components/OptionsUI/color.tsx
View File

@ -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;

2
public/app/core/components/OptionsUI/registry.tsx
View File

@ -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';

4
public/app/core/components/OptionsUI/slider.tsx
View File

@ -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
public/app/core/components/PasswordField/PasswordField.tsx
View File

@ -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'> {}

2
public/app/core/components/RolePicker/RoleMenuGroupOption.tsx
View File

@ -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
public/app/core/components/RolePicker/RoleMenuOption.tsx
View File

@ -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';

2
public/app/core/components/RolePicker/RolePickerInput.tsx
View File

@ -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
public/app/core/components/RolePicker/RolePickerMenu.tsx
View File

@ -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';

2
public/app/core/components/RolePicker/RolePickerSubMenu.tsx
View File

@ -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';

5
public/app/core/components/TimeSeries/TimeSeries.tsx
View File

@ -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';

12
public/app/core/components/TimeSeries/utils.ts
View File

@ -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));

2
public/app/core/components/TimelineChart/utils.ts
View File

@ -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';

2
public/app/core/context/ModalsContextProvider.tsx
View File

@ -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';

2
public/app/core/core.ts
View File

@ -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';

10
public/app/features/actions/ActionEditor.tsx
View File

@ -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';

3
public/app/features/actions/ActionEditorModalContent.tsx
View File

@ -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';

6
public/app/features/actions/ParamsEditor.tsx
View File

@ -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';

2
public/app/features/admin/AdminOrgsTable.tsx
View File

@ -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
public/app/features/admin/AdminSettingsTable.tsx
View File

@ -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';

2
public/app/features/admin/UserListPublicDashboardPage/DashboardsListModalButton.tsx
View File

@ -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
public/app/features/admin/UserListPublicDashboardPage/DeleteUserModalButton.tsx
View File

@ -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';

2
public/app/features/admin/UserListPublicDashboardPage/UserListPublicDashboardPage.tsx
View File

@ -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';

2
public/app/features/alerting/unified/components/GrafanaAlertmanagerDeliveryWarning.tsx
View File

@ -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';

2
public/app/features/alerting/unified/components/rule-editor/CloudAlertPreview.tsx
View File

@ -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';

3
public/app/features/alerting/unified/components/rule-editor/GrafanaAlertStatePicker.tsx
View File

@ -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'> & {

2
public/app/features/alerting/unified/components/rule-editor/alert-rule-form/simplifiedRouting/route-settings/RouteSettings.tsx
View File

@ -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,

2
public/app/features/alerting/unified/components/rules/RuleConfigStatus.tsx
View File

@ -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';

3
public/app/features/alerting/unified/home/PluginIntegrations.tsx
View File

@ -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';

2
public/app/features/alerting/unified/plugins/PluginOriginBadge.tsx
View File

@ -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';

2
public/app/features/browse-dashboards/components/NameCell.tsx
View File

@ -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';

3
public/app/features/canvas/elements/metricValue.tsx
View File

@ -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';

3
public/app/features/dashboard-scene/sharing/ShareButton/share-externally/EmailShare/ConfigEmailSharing/ConfigEmailSharing.tsx
View File

@ -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';

3
public/app/features/dashboard-scene/sharing/ShareButton/share-externally/EmailShare/ConfigEmailSharing/EmailListConfiguration.tsx
View File

@ -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
public/app/features/dashboard-scene/sharing/ShareButton/share-externally/EmailShare/CreateEmailSharing.tsx
View File

@ -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';

3
public/app/features/dashboard-scene/sharing/ShareButton/share-externally/ShareConfiguration.tsx
View File

@ -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
public/app/features/dashboard-scene/sharing/ShareButton/share-snapshot/UpsertSnapshot.tsx
View File

@ -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';

5
public/app/features/dashboard-scene/sharing/ShareDrawer/ShareDrawerConfirmAction.tsx
View File

@ -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
public/app/features/dashboard/components/PanelEditor/OverrideCategoryTitle.tsx
View File

@ -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;

3
public/app/features/dashboard/components/PanelEditor/PanelHeaderCorner.tsx
View File

@ -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';

25
public/app/features/dashboard/components/PanelEditor/PanelNotSupported.tsx
View File

@ -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>
);
}

3
public/app/features/dashboard/components/PanelEditor/VisualizationSelectPane.tsx
View File

@ -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
public/app/features/dashboard/components/PublicDashboardNotAvailable/PublicDashboardNotAvailable.tsx
View File

@ -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';

18
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/ConfigPublicDashboard.tsx
View File

@ -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>
);
}

15
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/Configuration.tsx
View File

@ -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>
</>

2
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/CreatePublicDashboard/AcknowledgeCheckboxes.tsx
View File

@ -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';

2
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/NoUpsertPermissionsAlert.tsx
View File

@ -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;

2
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/SaveDashboardChangesAlert.tsx
View File

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

2
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/UnsupportedDataSourcesAlert.tsx
View File

@ -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;

2
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/UnsupportedTemplateVariablesAlert.tsx
View File

@ -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;

2
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/SharePublicDashboard.tsx
View File

@ -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';

2
public/app/features/dashboard/components/SubMenu/AnnotationPicker.tsx
View File

@ -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';

4
public/app/features/dashboard/components/SubMenu/DashboardLinksDashboard.tsx
View File

@ -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';

2
public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderNotice.tsx
View File

@ -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;

2
public/app/features/dashboard/state/DashboardMigrator.ts
View File

@ -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 {

2
public/app/features/dimensions/editors/BackgroundSizeEditor.tsx
View File

@ -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>> = [

2
public/app/features/dimensions/editors/ColorDimensionEditor.tsx
View File

@ -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',

2
public/app/features/dimensions/editors/ResourceDimensionEditor.tsx
View File

@ -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';

2
public/app/features/dimensions/editors/ResourcePicker.tsx
View File

@ -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';

2
public/app/features/dimensions/editors/ScalarDimensionEditor.tsx
View File

@ -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';

2
public/app/features/dimensions/editors/ScaleDimensionEditor.tsx
View File

@ -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';

2
public/app/features/dimensions/editors/TextDimensionEditor.tsx
View File

@ -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';

2
public/app/features/explore/ContentOutline/ContentOutlineItemButton.tsx
View File

@ -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;

2
public/app/features/explore/Explore.tsx
View File

@ -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';

2
public/app/features/explore/Logs/Logs.tsx
View File

@ -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
public/app/features/explore/Logs/LogsColumnSearch.tsx
View File

@ -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 {

2
public/app/features/explore/Logs/LogsTable.tsx
View File

@ -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
public/app/features/explore/Logs/LogsTableActiveFields.tsx
View File

@ -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';

2
public/app/features/explore/Logs/LogsTableAvailableFields.tsx
View File

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

2
public/app/features/explore/Logs/LogsTableMultiSelect.tsx
View File

@ -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';

2
public/app/features/explore/Logs/LogsTableWrap.tsx
View File

@ -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
public/app/features/explore/PrometheusListView/ItemLabels.tsx
View File

@ -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';

2
public/app/features/explore/PrometheusListView/ItemValues.tsx
View File

@ -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';

2
public/app/features/explore/PrometheusListView/RawListContainer.tsx
View File

@ -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';

2
public/app/features/explore/PrometheusListView/RawListItem.tsx
View File

@ -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';

2
public/app/features/explore/PrometheusListView/RawListItemAttributes.tsx
View File

@ -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';

2
public/app/features/explore/TraceView/components/TracePageHeader/SearchBar/NextPrevResult.tsx
View File

@ -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';

2
public/app/features/explore/TraceView/components/TracePageHeader/SearchBar/TracePageSearchBar.tsx
View File

@ -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';

2
public/app/features/library-panels/components/LibraryPanelCard/LibraryPanelCard.tsx
View File

@ -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';

2
public/app/features/manage-dashboards/components/PublicDashboardListTable/DeletePublicDashboardButton.tsx
View File

@ -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
public/app/features/manage-dashboards/components/PublicDashboardListTable/DeletePublicDashboardModal.tsx
View File

@ -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
public/app/features/manage-dashboards/components/SnapshotListTableRow.tsx
View File

@ -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';

2
public/app/features/migrate-to-cloud/onprem/NameCell.tsx
View File

@ -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';

2
public/app/features/migrate-to-cloud/shared/AlertWithTraceID.tsx
View File

@ -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;

2
public/app/features/panel/components/VizTypePicker/PanelTypeCard.tsx
View File

@ -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 {

2
public/app/features/playlist/PlaylistCard.tsx
View File

@ -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
public/app/features/playlist/PlaylistPageList.tsx
View File

@ -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';

2
public/app/features/plugins/admin/components/PluginListItem.tsx
View File

@ -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';

2
public/app/features/plugins/loader/sharedDependencies.ts
View File

@ -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,

2
public/app/features/sandbox/BenchmarksPage.tsx
View File

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

3
public/app/features/search/page/components/SearchResultsTable.tsx
View File

@ -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