@cimpress/react-components
Version:
React components to support the MCP styleguide
111 lines • 4.18 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const react_components_1 = require("@cimpress/react-components");
const drawer_jsx_1 = __importDefault(require("!raw-loader!./drawer.jsx"));
const drawer_jsx_2 = __importDefault(require("./drawer.jsx"));
const TabbedComponentDoc_1 = __importDefault(require("../../shared/TabbedComponentDoc"));
const DrawerDocs = () => {
const propInfos = [
{
name: 'show',
type: 'boolean (required)',
default: '',
description: 'Controls whether or not the drawer is displayed.',
},
{
name: 'position',
type: 'string',
default: 'right',
description: 'The side of the screen on which to display the drawer; one of "left" or "right".',
},
{
name: 'autoResize',
type: 'boolean',
default: 'true',
description: 'Whether to resize the drawer proportionally on window resize.',
},
{
name: 'size',
type: 'number',
default: '0.3',
description: `Width/height of drawer depending on drawer position i.e. [left, right] or [top, bottom] .
If autoResize is true, size is a fraction of window width/height; otherwise, size is in pixels.`,
},
{
name: 'header',
type: 'node',
default: '',
description: 'Header for the drawer. If no header is provided, the drawer will not render with a header section.',
},
{
name: 'footer',
type: 'node',
default: '',
description: `Footer for the drawer. Any buttons with actions should go here.
If no footer is provided, the drawer will not render with a footer section.`,
},
{
name: 'children',
type: 'node',
default: '',
description: "Body of the drawer. By default, this area will be vertically scrollable if it doesn't fit on the page.",
},
{
name: 'closeOnClickOutside',
type: 'boolean',
default: 'false',
description: 'Controls whether or not the drawer should close when a click occurs outside of the component.',
},
{
name: 'onRequestHide',
type: 'function',
default: '',
description: 'Function to be called when the drawer wants to close.',
},
{
name: 'headerStyle',
type: 'object',
default: '',
description: 'Inline styles to be applied to the drawer header div.',
},
{
name: 'footerStyle',
type: 'object',
default: '',
description: 'Inline styles to be applied to the drawer footer div.',
},
{
name: 'bodyStyle',
type: 'object',
default: '',
description: 'Inline styles to be applied to the drawer body div.',
},
{
name: 'style',
type: 'object',
default: '',
description: 'Inline styles to be applied to the root drawer div.',
},
{
name: 'className',
type: 'string',
default: '',
description: 'Additional class names to be applied to the drawer.',
},
{
name: 'zIndex',
type: 'number',
default: '1040',
description: 'z-index value to be be used for Drawer wrapper',
},
];
return (react_1.default.createElement(TabbedComponentDoc_1.default, { name: "Drawer", propInfos: propInfos },
react_1.default.createElement(drawer_jsx_2.default, null),
react_1.default.createElement(react_components_1.CodeExample, { code: drawer_jsx_1.default })));
};
exports.default = DrawerDocs;
//# sourceMappingURL=index.js.map