@dnb/eufemia/cjs/components/card/CardDocs.js

DNB Eufemia Design System UI Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CardProperties = exports.CardListProperties = exports.CardListItemProperties = exports.CardActionProperties = void 0;
const CardProperties = exports.CardProperties = {
  outset: {
    doc: 'Whether or not to break out (using negative margins) on larger screens. Defaults to `false`.',
    type: 'boolean',
    status: 'optional'
  },
  stack: {
    doc: 'True to stack the sub components with space between. The `spacing` will default to `medium`. Defaults to `false`.',
    type: 'boolean',
    status: 'optional'
  },
  direction: {
    doc: 'Defaults to `vertical`.',
    type: ['"horizontal"', '"vertical"'],
    status: 'optional'
  },
  alignSelf: {
    doc: 'Defaults to `stretch`.',
    type: ['"flex-start"', '"flex-end"', '"center"', '"baseline"', '"stretch"'],
    status: 'optional'
  },
  title: {
    doc: 'Define a title that appears on top of the Card.',
    type: 'React.ReactNode',
    status: 'optional'
  },
  responsive: {
    doc: 'Define if the card should behave responsive. Defaults to `true`.',
    type: 'boolean',
    status: 'optional'
  },
  filled: {
    doc: 'Define if the Card should get the same background color as the outline border.',
    type: 'boolean',
    status: 'optional'
  },
  outline: {
    doc: 'Define the outline color. Defaults to `var(--card-outline-color)`.',
    type: 'string',
    status: 'optional'
  },
  outlineWidth: {
    doc: 'Define the outline width. Defaults to `var(--card-outline-width)` (`0.0625rem`).',
    type: ['string', 'number'],
    status: 'optional'
  },
  dropShadow: {
    doc: 'Define if the Card should have drop shadow. Uses Section `dropShadow`.',
    type: 'boolean',
    status: 'optional'
  },
  backgroundColor: {
    doc: 'Define the background color. Defaults to `var(--card-background-color)`.',
    type: 'string',
    status: 'optional'
  },
  element: {
    doc: 'Define the type of element. Defaults to `section`.',
    type: 'React.Element',
    status: 'optional'
  },
  children: {
    doc: 'Contents.',
    type: 'React.ReactNode',
    status: 'required'
  },
  '[Flex.Container](/uilib/layout/flex/container/properties)': {
    doc: 'Flex.Container properties.',
    type: 'Various',
    status: 'optional'
  },
  '[Flex.Item](/uilib/layout/flex/item/properties)': {
    doc: 'Flex.Item properties.',
    type: 'Various',
    status: 'optional'
  },
  '[Space](/uilib/layout/space/properties)': {
    doc: 'Spacing properties like `top` or `bottom` are supported.',
    type: ['string', 'object'],
    status: 'optional'
  }
};
const CardActionProperties = exports.CardActionProperties = {
  href: {
    doc: 'The URL to navigate to. When set, renders an anchor element.',
    type: 'string',
    status: 'optional'
  },
  to: {
    doc: 'Route path for use with a router Link component (e.g. react-router). Pass a custom `element` that accepts `to`.',
    type: 'string',
    status: 'optional'
  },
  target: {
    doc: 'The anchor target attribute.',
    type: 'string',
    status: 'optional'
  },
  rel: {
    doc: 'The anchor rel attribute.',
    type: 'string',
    status: 'optional'
  },
  element: {
    doc: 'Custom element to render as the wrapper. Defaults to `a` when `href`/`to` is set. Use this for router Link components.',
    type: ['string', 'React.Element'],
    status: 'optional'
  },
  onClick: {
    doc: 'Click handler. When used without `href`/`to`, renders a button-like wrapper with keyboard support (Enter/Space).',
    type: 'function',
    status: 'optional'
  },
  children: {
    doc: 'Contents of the Card inside the action wrapper.',
    type: 'React.ReactNode',
    status: 'required'
  },
  'Card properties': {
    doc: 'All [Card](/uilib/components/card/properties) properties are supported.',
    type: 'Various',
    status: 'optional'
  }
};
const CardListProperties = exports.CardListProperties = {
  children: {
    doc: 'Card.ListItem elements.',
    type: 'React.ReactNode',
    status: 'required'
  },
  '[Space](/uilib/layout/space/properties)': {
    doc: 'Spacing properties like `top` or `bottom` are supported.',
    type: ['string', 'object'],
    status: 'optional'
  }
};
const CardListItemProperties = exports.CardListItemProperties = {
  center: {
    doc: 'Center the content of the list item. Use `true` to always center, or `"when-small"` to center only on small screens.',
    type: ['boolean', '"when-small"'],
    status: 'optional'
  },
  children: {
    doc: 'A Card or Card.Action element.',
    type: 'React.ReactNode',
    status: 'required'
  },
  '[Space](/uilib/layout/space/properties)': {
    doc: 'Spacing properties like `top` or `bottom` are supported.',
    type: ['string', 'object'],
    status: 'optional'
  }
};
//# sourceMappingURL=CardDocs.js.map