import { BreakpointsTokenType } from '../../types/design-token.type';
import { GapType, ResponsiveType, MarginType, FlexDirectionType, FlexAlignItemType, FlexJustifyContentType, FlexWrapType } from '../../types/ui.type';
import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/component-usage-runtime-metrics';
import { FlexBasisType, FlexGrowType, FlexShrinkType, FlexType } from '../vega-box/interface';
import { PageResizeObserverSlimmer } from '../../helpers/slimmers/page-resize-observer-slimmer';
/**
 * @vegaVersion 1.0.4
 */
export declare class VegaFlex {
  protected readonly globalSlimmers: GlobalSlimmers;
  protected vegaComponentUsageRuntimeMetricsSlimmer: VegaComponentUsageRuntimeMetricsSlimmer<HTMLVegaFlexElement>;
  protected readonly pageResizeSlimmer: PageResizeObserverSlimmer;
  host: HTMLVegaFlexElement;
  currentBreakpoint: BreakpointsTokenType;
  /**
   * Determines the gap (spacing) within the flex container.
   *
   * It can be provided as a spacing value, such as `size-12` or `size-24`.
   *
   * Alternatively, it can be set as a responsive map using key-value pairs
   *    to define different gaps for various breakpoints,
   *    where the `default` key is required.
   *
   * @vegaVersion 1.0.4
   */
  gap: ResponsiveType<GapType>;
  /**
   * Determines the margin (spacing) around the flex container.
   *
   * It can be provided as a spacing value, such as `size-16` or `size-24`.
   *
   * Alternatively, it can be set as a responsive map using key-value pairs
   *    to define different margins for various breakpoints.
   *    When using a responsive map, the `default` key is required.
   *
   * @vegaVersion 1.3.0
   */
  margin: ResponsiveType<MarginType>;
  /**
   * Determines the breakpoint at which the flex direction transitions from
   *    row-based layout to column-based layout, or vice versa.
   *
   * @deprecated Please use the `direction` property instead.
   * @vegaVersion 1.0.4
   */
  breakpoint: BreakpointsTokenType | 'None';
  /**
   * Specifies the flex direction.
   *
   * @vegaVersion 1.3.0
   */
  direction: ResponsiveType<FlexDirectionType>;
  /**
   * Controls the alignment of items within the flex container.
   *
   * @vegaVersion 1.49.0
   */
  alignItems: ResponsiveType<FlexAlignItemType>;
  /**
   * Controls the alignment of content items and the distribution of
   *    space between and around them within the flex container.
   *
   * @vegaVersion 1.3.0
   */
  justifyContent: ResponsiveType<FlexJustifyContentType>;
  /**
   * Determines whether flex items are confined to a single line or can wrap onto multiple lines based on available space.
   *
   * @vegaVersion 2.6.0
   */
  flexWrap: ResponsiveType<FlexWrapType>;
  /**
   * Specifies how the box adjusts its size, growth, and alignment within a flex container.
   *
   * @vegaVersion 2.26.0
   * @nativeTypeRedirection https://developer.mozilla.org/en-US/docs/Web/CSS/flex
   */
  flex: ResponsiveType<FlexType>;
  /**
   * Specifies the box's base size, defining its initial
   *    width or height in a flex container.
   *
   * @vegaVersion 2.26.0
   * @nativeTypeRedirection https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis
   */
  flexBasis: ResponsiveType<FlexBasisType>;
  /**
   * Specifies how the box grows to fill available space in a flex container.
   *
   * @vegaVersion 2.26.0
   * @nativeTypeRedirection https://developer.mozilla.org/en-US/docs/Web/CSS/flex-grow
   */
  flexGrow: ResponsiveType<FlexGrowType>;
  /**
   * Specifies how much the box shrinks to fit within a flex container.
   *
   * @vegaVersion 2.26.0
   * @nativeTypeRedirection https://developer.mozilla.org/en-US/docs/Web/CSS/flex-shrink
   */
  flexShrink: ResponsiveType<FlexShrinkType>;
  /**
   * Specifies whether to use the native flex layout.
   *
   * @deprecated This property will be removed soon and vega-flex will only support native-based flex behaviors.
   *
   * @vegaVersion 1.10.0
   */
  useNativeFlex: boolean;
  render(): VegaFlex;
}