@dnb/eufemia/cjs/components/flex/ContainerDocs.js

DNB Eufemia Design System UI Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.FlexContainerProperties = void 0;
const FlexContainerProperties = exports.FlexContainerProperties = {
  direction: {
    doc: 'Direction of sub components. Can be: `horizontal` or `vertical`.',
    type: [`'horizontal'`, `'vertical'`],
    defaultValue: `'horizontal'`,
    status: 'optional'
  },
  wrap: {
    doc: 'Define if we should wrap contents if there is not enough space.',
    type: 'boolean',
    defaultValue: 'true',
    status: 'optional'
  },
  justify: {
    doc: 'Distribute sub components along the main axis (CSS `justify-content`). In horizontal direction, this controls left-to-right placement. In vertical direction, this controls top-to-bottom placement.',
    type: [`'flex-start'`, `'flex-end'`, `'center'`, `'space-between'`, `'space-around'`, `'space-evenly'`],
    defaultValue: `'flex-start'`,
    status: 'optional'
  },
  align: {
    doc: 'Align sub components along the cross axis (CSS `align-items`). In horizontal direction, this controls vertical alignment. In vertical direction, this controls horizontal alignment.',
    type: [`'flex-start'`, `'flex-end'`, `'center'`, `'stretch'`, `'baseline'`],
    defaultValue: `'flex-start'`,
    status: 'optional'
  },
  divider: {
    doc: 'How to separate sub components.',
    type: [`'space'`, `'line'`, `'line-framed'`],
    defaultValue: `'space'`,
    status: 'optional'
  },
  sizeCount: {
    doc: 'Define how many parts your layout should be divided in. Should be used in combination with a [Flex.Item](/uilib/layout/flex/item).',
    type: 'number',
    defaultValue: '12',
    status: 'optional'
  },
  gap: {
    doc: 'How much space between child items. Use `false` for no spacing. If in vertical layout: if both `rowGap` and `gap` is set, `rowGap` will be used.',
    type: [`'xx-small'`, `'x-small'`, `'small'`, `'medium'`, `'large'`, `'x-large'`, `'xx-large'`, 'false'],
    defaultValue: `'small'`,
    status: 'optional'
  },
  rowGap: {
    doc: 'How much space between rows. Use `false` for no row gap. If in vertical layout: if both `rowGap` and `gap` is set, `rowGap` will be used.',
    type: [`'xx-small'`, `'x-small'`, `'small'`, `'medium'`, `'large'`, `'x-large'`, `'xx-large'`, 'false'],
    defaultValue: `'small'`,
    status: 'optional'
  },
  element: {
    doc: 'Define the type of element.',
    type: ['string', 'React.Element'],
    defaultValue: `'div'`,
    status: 'optional'
  },
  ref: {
    doc: 'Provide a React.Ref to access the inner HTML element.',
    type: 'React.RefObject',
    defaultValue: 'undefined',
    status: 'optional'
  },
  wrapChildrenInSpace: {
    doc: 'Define if intrinsic DOM child elements such as `li` should be wrapped in `Space` to receive spacing. Set to `false` to keep them as direct descendants.',
    type: 'boolean',
    defaultValue: 'true',
    status: 'optional'
  },
  '[Space](/uilib/layout/space/properties)': {
    doc: 'Spacing properties like `top` or `bottom` are supported.',
    type: 'Various',
    status: 'optional'
  }
};
//# sourceMappingURL=ContainerDocs.js.map