UNPKG

@kiwicom/orbit-components

Version:

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com's products.

48 lines 2.93 kB
import * as React from "react"; import type { Props } from "./types"; /** * @orbit-doc-start * README * ---------- * # CallOutBanner * * To implement CallOutBanner component into your project you'll need to add the import: * * ```jsx * import CallOutBanner from "@kiwicom/orbit-components/lib/CallOutBanner"; * ``` * * After adding import into your project you can use it simply like: * * ```jsx * <CallOutBanner>Hello World!</CallOutBanner> * ``` * * ## Props * * Table below contains all types of the props available in the CallOutBanner component. * * | Name | Type | Default | Description | * | :----------- | :----------------------------------- | :------ | :------------------------------------------------------------------------------------- | * | actions | `React.Node` | | Actions - especially Buttons of the CallOutBanner that will be rendered on the bottom. | * | children | `React.Node` | | The children of the CallOutBanner. | * | dataTest | `string` | | Optional prop for testing purposes. | * | id | `string` | | Set `id` for `CallOutBanner` | * | description | `Translation` | | The displayed description of the CallOutBanner. | * | illustration | `React.Element<typeof Illustration>` | | The displayed Illustration of the CallOutBanner. | * | onClick | `() => void \| Promise` | | Function for handling onClick callback. See [functional specs](#functional-specs). | * | tabIndex | `string \| number` | | Specifies the tab order of an element. | * | **title** | `Translation` | | The displayed title of the CallOutBanner. | * * ## Functional specs * * - When you pass some `onClick` callback, the CallOutBanner will be actionable. That means that it will be possible to click on it and it will have proper elevation level. * * - By default, the `tabIndex` is null, so it's not possible to focus it. If you either pass `onClick` or specify custom `tabIndex`, the CallOutBanner will be focus-able. * * * @orbit-doc-end */ declare const CallOutBanner: ({ children, illustration, actions, title, onClick, tabIndex, description, dataTest, id, }: Props) => React.JSX.Element; export default CallOutBanner; //# sourceMappingURL=index.d.ts.map