doui-react 1.0.0

package/lib/table/type/column.d.ts

@@ -0,0 +1,110 @@
+import { FunctionReturn } from "../../api";
+import { FormItemProps } from "../../form";
+import { ActionProps, CommonProps } from "..";
+import { componentMap } from "../component/utils";
+import { ColumnType } from 'antd/lib/table';
+import { ColumnFilterItem, TableRowSelection } from 'antd/lib/table/interface';
+import React, { ReactNode } from 'react';
+type UnionColumnType = Omit<ColumnType<any>, 'ellipsis' | 'filters'> & Omit<TableRowSelection<any>, 'type'>;
+export interface Column extends UnionColumnType {
+    /**
+     * @description 字段名
+     * @default (必选)
+     */
+    dataIndex?: string;
+    /**
+     * @description 列类型
+     */
+    type?: keyof Omit<typeof componentMap, 'default'>;
+    /**
+     * @description 列宽度
+     */
+    width?: string | number;
+    /**
+     * @description 列最小宽度
+     */
+    minWidth?: string | number;
+    /**
+     * @description 列最大宽度
+     */
+    maxWidth?: string | number;
+    /**
+     * @description 最多显示的行数
+     * @default 2
+     */
+    rows?: number;
+    /**
+     * @description 时间类型的 `Format` 格式
+     * @default YYYY-MM-DD hh:mm:ss A
+     */
+    timeFormat?: string;
+    /**
+     * @description 是否禁用
+     * @default false
+     * @link CommonProps: #commonprops
+     */
+    disabled?: boolean | ((props: CommonProps) => boolean);
+    /**
+     * @description 提示信息
+     * @link CommonProps: #commonprops
+     */
+    tooltip?: ReactNode | ((props: CommonProps) => ReactNode);
+    /**
+     * @description 点击时的回调函数
+     * @link CommonProps: #commonprops
+     */
+    onClick?(props: CommonProps): FunctionReturn<any>;
+    /**
+     * @description 是否可搜索
+     * @default false
+     */
+    search?: boolean | string[] | ((props: CustomFilterProps) => boolean);
+    /**
+     * @description 搜索框的占位符
+     * @default Search
+     */
+    placeholder?: string;
+    /**
+     * @description 是否可排序
+     * @default false
+     * @replaceAll boolean | (a, b, sortOrder) => number
+     */
+    sort?: ColumnType<any>['sorter'];
+    /**
+     * @description 筛选菜单项
+     */
+    filters?: Array<React.Key | boolean | ColumnFilterItem>;
+    filterBy?: string[] | ((props: CustomFilterProps) => boolean);
+    /**
+     * @description 操作列配置，具体项见下表
+     * @link ActionProps: #actionbutton
+     */
+    actions?: ActionProps[] | ((props: CommonProps) => ActionProps[]);
+    /**
+     * @description `editor` 的 `props`
+     * @link FormItemProps: /components/form#formitem
+     */
+    editorProps?: FormItemProps | ((props: CommonProps) => FormItemProps);
+    /**
+     * @description 自定义渲染
+     * @link RenderProps: #renderprops
+     */
+    render?: (props: RenderProps) => ReactNode;
+}
+export interface RenderProps extends Pick<CommonProps, 'current' | 'record' | 'index'> {
+    /**
+     * @description 带有 `highlight` 和 `ellipsis` 效果的组件, 一般用于自定义 `Cell` 时使用
+     */
+    component: ReactNode;
+    /**
+     * @description 通过传入的文本，获取 `Highlight` 组件
+     */
+    getHighlight(text?: string): ReactNode;
+}
+export interface CustomFilterProps {
+    current: any;
+    record: any;
+    filter: React.Key | boolean;
+}
+export type GetSearchColumn = (params: Column) => ColumnType<any>;
+export {};

package/lib/table/type/column.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/table/type/index.d.ts

@@ -0,0 +1,113 @@
+import { FunctionReturn } from "../../api";
+import { FormProps } from "../../form";
+import { ListOperation } from "../../hooks";
+import { Column } from "..";
+import { TableProps as AntdTableProps } from 'antd';
+import { ReactNode } from 'react';
+export * from './action';
+export * from './column';
+export type DataSource = any[];
+export interface TableContext {
+    /**
+     * @description 表格数据
+     */
+    dataSource: DataSource;
+    /**
+     * @description 修改表格数据
+     */
+    setDataSource(data: DataSource): void;
+    /**
+     * @description 选中的行 `key`
+     */
+    selectedRowKeys: string[];
+    /**
+     * @description 设置选中的行 `key`
+     */
+    setSelectedRowKeys(keys?: string[]): void;
+    /**
+     * @description 刷新表格
+     */
+    refresh(props?: RefreshProps): Promise<void>;
+    /**
+     * @description 操作表单的方法
+     * @link ListOperation: /components/hooks#listoperation
+     */
+    operation: ListOperation;
+    /**
+     * @description 设置表格上下文
+     */
+    setContext(state: any): void;
+    rowKey: string;
+    editorValueKey: string;
+    [key: string]: any;
+}
+export interface RefreshProps {
+    /**
+     * @description 是否只显示 loading 状态
+     * @default false
+     */
+    onlyLoading?: boolean;
+    [name: string]: any;
+}
+/**
+ * @noExtends
+ */
+export interface CommonProps extends TableContext {
+    /**
+     * @description 当前列的值
+     */
+    current?: any;
+    /**
+     * @description 当前行的值
+     */
+    record: any;
+    /**
+     * @description 当前行的索引
+     */
+    index: number;
+    [name: string]: any;
+}
+type UnionTableType = Omit<FormProps, 'onChange' | 'title'> & Omit<AntdTableProps<any>, 'columns' | 'dataSource' | 'scroll' | 'footer'>;
+/**
+ * @noExtends
+ */
+export interface TableProps extends UnionTableType {
+    /**
+     * @description 表格列配置，具体项见下表
+     * @link Column: #column
+     */
+    columns: Column[];
+    /**
+     * @description 表格数据
+     */
+    dataSource?: DataSource | ((props: any) => FunctionReturn<DataSource>);
+    /**
+     * @description 每一行的唯一标示
+     * @default id
+     */
+    rowKey?: string;
+    /**
+     * @description 表格宽度
+     * @default 100%
+     */
+    width?: number | string;
+    /**
+     * @description 空数据时显示的文本
+     * @default No data
+     */
+    emptyText?: ReactNode;
+    /**
+     * @description 表格最大高度
+     * @default 100%
+     */
+    maxHeight?: number | string;
+    /**
+     * @description 点击表格行的回调
+     * @link CommonProps: #commonprops
+     */
+    onRowClick?(props: CommonProps): FunctionReturn<void>;
+    scroll?: boolean | AntdTableProps<any>['scroll'];
+    footer?: ReactNode;
+    editorValueKey?: string;
+    autoCollectFormValue?: boolean;
+}

package/lib/table/type/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _action = require("./action");
+Object.keys(_action).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _action[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _action[key];
+    }
+  });
+});
+var _column = require("./column");
+Object.keys(_column).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _column[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _column[key];
+    }
+  });
+});

package/lib/tabs/component/constant.d.ts

@@ -0,0 +1,2 @@
+export declare const textPropKeys: string[];
+export declare const tabPropKeys: string[];

package/lib/tabs/component/constant.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.textPropKeys = exports.tabPropKeys = void 0;
+var textPropKeys = exports.textPropKeys = ['className', 'style', 'rows', 'tooltip', 'autoShowTooltip'];
+var tabPropKeys = exports.tabPropKeys = ['forceRender', 'closeIcon', 'closable', 'destroyInactiveTabPane', 'animated', 'active'];

package/lib/tabs/component/index.d.ts

@@ -0,0 +1,2 @@
+import { TabsProps } from "..";
+export declare function Tabs({ tabMaxWidth, ...props }: TabsProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/lib/tabs/component/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Tabs = Tabs;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _antd = require("antd");
+var _style = _interopRequireDefault(require("../style"));
+var _utils = require("./utils");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _excluded = ["tabMaxWidth"];
+function Tabs(_ref) {
+  var _ref$tabMaxWidth = _ref.tabMaxWidth,
+    tabMaxWidth = _ref$tabMaxWidth === void 0 ? 200 : _ref$tabMaxWidth,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var tabsProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+    items: (0, _utils.generateTabItems)(props),
+    renderTabBar: (0, _utils.getRenderTabBar)(props),
+    css: _style.default.wrapper(tabMaxWidth)
+  });
+  return (0, _jsxRuntime.jsx)(_antd.Tabs, (0, _objectSpread2.default)({}, tabsProps));
+}

package/lib/tabs/component/utils.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { TabsProps } from "..";
+import { RenderTabBar } from 'rc-tabs/lib/interface';
+type RenderTabBarProps = Parameters<RenderTabBar>[0];
+export declare function getRenderTabBar({ type, items, size, tabBarGutter, tabBarStyle }: TabsProps): (({ activeKey, onTabClick }: RenderTabBarProps) => import("@emotion/react/jsx-runtime").JSX.Element) | undefined;
+export declare function generateTabItems({ items }: TabsProps): {
+    label: import("@emotion/react/jsx-runtime").JSX.Element;
+    key: string;
+    style?: import("react").CSSProperties | undefined;
+    children?: import("react").ReactNode;
+    className?: string | undefined;
+    id?: string | undefined;
+    icon?: import("react").ReactNode;
+    prefixCls?: string | undefined;
+    disabled?: boolean | undefined;
+    animated?: boolean | undefined;
+    destroyInactiveTabPane?: boolean | undefined;
+    forceRender?: boolean | undefined;
+    closable?: boolean | undefined;
+    closeIcon?: import("react").ReactNode;
+    tabKey?: string | undefined;
+    active?: boolean | undefined;
+}[];
+export {};

package/lib/tabs/component/utils.js

@@ -0,0 +1,63 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateTabItems = generateTabItems;
+exports.getRenderTabBar = getRenderTabBar;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _radio = require("../../radio");
+var _text = require("../../text");
+var _lodash = _interopRequireDefault(require("lodash"));
+var _constant = require("./constant");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+function getRenderTabBar(_ref) {
+  var type = _ref.type,
+    items = _ref.items,
+    size = _ref.size,
+    tabBarGutter = _ref.tabBarGutter,
+    tabBarStyle = _ref.tabBarStyle;
+  if (type !== 'radio') {
+    return;
+  }
+  return function (_ref2) {
+    var activeKey = _ref2.activeKey,
+      onTabClick = _ref2.onTabClick;
+    var options = _lodash.default.map(items, function (item) {
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _lodash.default.omit(item, _constant.tabPropKeys)), {}, {
+        value: item.key
+      });
+    });
+    var radioProps = {
+      size: size,
+      options: options,
+      gap: tabBarGutter,
+      style: tabBarStyle,
+      value: activeKey,
+      onChange: onTabClick
+    };
+    return (0, _jsxRuntime.jsx)(_radio.Radio, (0, _objectSpread2.default)({}, radioProps));
+  };
+}
+function generateTabItems(_ref3) {
+  var items = _ref3.items;
+  return _lodash.default.map(items, function (item) {
+    var _parseOptionProps = parseOptionProps(item),
+      tabProps = _parseOptionProps.tabProps,
+      textProps = _parseOptionProps.textProps;
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, tabProps), {}, {
+      label: (0, _jsxRuntime.jsx)(_text.Text, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, textProps), {}, {
+        children: tabProps.label
+      }))
+    });
+  });
+}
+function parseOptionProps(props) {
+  var textProps = _lodash.default.pick(props, _constant.textPropKeys);
+  var tabProps = _lodash.default.omit(props, _constant.textPropKeys);
+  return {
+    textProps: textProps,
+    tabProps: tabProps
+  };
+}

package/lib/tabs/index.d.ts

@@ -0,0 +1,2 @@
+export * from './component';
+export * from './type';

package/lib/tabs/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _component = require("./component");
+Object.keys(_component).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _component[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _component[key];
+    }
+  });
+});
+var _type = require("./type");
+Object.keys(_type).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _type[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _type[key];
+    }
+  });
+});

package/lib/tabs/style/index.d.ts

@@ -0,0 +1,5 @@
+import { TabsProps } from "..";
+declare const style: {
+    wrapper: (tabMaxWidth: TabsProps['tabMaxWidth']) => import("@emotion/react").SerializedStyles;
+};
+export default style;

package/lib/tabs/style/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _api = require("../../api");
+var _react = require("@emotion/react");
+var _templateObject;
+var style = {
+  wrapper: function wrapper(tabMaxWidth) {
+    return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    .ant-tabs-tab-btn,\n    .", " {\n      max-width: ", ";\n    }\n\n    .ant-radio-group {\n      margin-bottom: 16px;\n    }\n  "])), (0, _api.getClassName)('radio'), (0, _api.transformValueWithStyleUnit)(tabMaxWidth));
+  }
+};
+var _default = exports.default = style;

package/lib/tabs/type/index.d.ts

@@ -0,0 +1,20 @@
+import { SelectOption } from "../../select";
+import { TabsProps as AntdTabsProps } from 'antd';
+import { TabsType } from 'antd/lib/tabs';
+import { Tab } from 'rc-tabs/lib/interface';
+export interface TabProps extends Tab, Omit<SelectOption, 'label'> {
+}
+export interface TabsProps extends Omit<AntdTabsProps, 'type'> {
+    /**
+     * @description `tab` 样式
+     * @default line
+     * @replaceAll 'line' | 'card' | 'radio' | 'editable-card'
+     */
+    type?: TabsType | 'radio';
+    /**
+     * @description `tab` 的最大宽度
+     * @default 200px
+     */
+    tabMaxWidth?: number | string;
+    items?: TabProps[];
+}

package/lib/tabs/type/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/text/component/index.d.ts

@@ -0,0 +1,3 @@
+import { TextProps } from "..";
+export declare function Text({ children, tooltip, rows, autoShowTooltip, ...props }: TextProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export * from './utils';

package/lib/text/component/index.js

@@ -0,0 +1,78 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  Text: true
+};
+exports.Text = Text;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _ = require("./..");
+var _tooltip = require("../../tooltip");
+var _antd = require("antd");
+var _style = _interopRequireDefault(require("../style"));
+var _useText2 = require("./use-text");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _utils = require("./utils");
+Object.keys(_utils).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _utils[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _utils[key];
+    }
+  });
+});
+var _excluded = ["children", "tooltip", "rows", "autoShowTooltip"];
+var Paragraph = _antd.Typography.Paragraph;
+function Text(_ref) {
+  var children = _ref.children,
+    tooltip = _ref.tooltip,
+    _ref$rows = _ref.rows,
+    rows = _ref$rows === void 0 ? 1 : _ref$rows,
+    _ref$autoShowTooltip = _ref.autoShowTooltip,
+    autoShowTooltip = _ref$autoShowTooltip === void 0 ? true : _ref$autoShowTooltip,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var _useText = (0, _useText2.useText)({
+      children: children
+    }),
+    key = _useText.key;
+  if (tooltip === false || !rows) {
+    return (0, _jsxRuntime.jsx)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({
+      css: _style.default.wordBreak
+    }, props), {}, {
+      children: children
+    }));
+  }
+  var ellipsis = {
+    rows: rows,
+    tooltip: (0, _tooltip.getTooltipProps)((0, _objectSpread2.default)({
+      align: {
+        offset: [0, 5]
+      }
+    }, (0, _.generateTooltip)(tooltip !== null && tooltip !== void 0 ? tooltip : children)))
+  };
+  if (autoShowTooltip) {
+    return (0, _jsxRuntime.jsx)(Paragraph, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+      css: _style.default.wrapper
+    }, props), {}, {
+      ellipsis: ellipsis,
+      children: children
+    }), key);
+  }
+  return (0, _jsxRuntime.jsx)(_antd.Tooltip, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, ellipsis.tooltip), {}, {
+    children: (0, _jsxRuntime.jsx)(Paragraph, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+      css: _style.default.wrapper
+    }, props), {}, {
+      ellipsis: {
+        rows: rows
+      },
+      children: children
+    }))
+  }));
+}

package/lib/text/component/use-text.d.ts

@@ -0,0 +1,4 @@
+import { TextProps } from "..";
+export declare function useText({ children }: TextProps): {
+    key: number;
+};

package/lib/text/component/use-text.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useText = useText;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _hooks = require("../../hooks");
+var _react = require("react");
+var _reactUse = require("react-use");
+function useText(_ref) {
+  var children = _ref.children;
+  var _useState = (0, _react.useState)(0),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    key = _useState2[0],
+    setKey = _useState2[1];
+  var reset = (0, _hooks.useDebounce)(setKey, 150);
+  (0, _hooks.useWindowResize)(function (_ref2) {
+    var width = _ref2.width;
+    return reset(width);
+  });
+
+  // 修复某些场景下，tooltip 会自动显示的问题
+  (0, _reactUse.useUpdateEffect)(function () {
+    reset(Date.now());
+  }, [children]);
+  return {
+    key: key
+  };
+}

package/lib/text/component/utils.d.ts

@@ -0,0 +1,3 @@
+import { TextProps } from "..";
+import type { TooltipProps } from 'antd/lib/tooltip';
+export declare function generateTooltip(tooltip: TextProps['tooltip']): TooltipProps;

package/lib/text/component/utils.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateTooltip = generateTooltip;
+var _api = require("../../api");
+function generateTooltip(tooltip) {
+  if ((0, _api.isReactNode)(tooltip)) {
+    return {
+      title: tooltip
+    };
+  }
+  return tooltip;
+}

package/lib/text/index.d.ts

@@ -0,0 +1,2 @@
+export * from './component';
+export * from './type';

package/lib/text/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _component = require("./component");
+Object.keys(_component).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _component[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _component[key];
+    }
+  });
+});
+var _type = require("./type");
+Object.keys(_type).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _type[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _type[key];
+    }
+  });
+});

package/lib/text/style/index.d.ts

@@ -0,0 +1,5 @@
+declare const style: {
+    wrapper: import("@emotion/react").SerializedStyles;
+    wordBreak: import("@emotion/react").SerializedStyles;
+};
+export default style;

package/lib/text/style/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = require("@emotion/react");
+var _templateObject, _templateObject2;
+var style = {
+  wrapper: (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    &.ant-typography {\n      color: inherit;\n      margin-bottom: 0;\n      max-width: 100%;\n    }\n  "]))),
+  wordBreak: (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n    white-space: pre-wrap;\n    word-wrap: break-word;\n    word-break: break-word;\n  "])))
+};
+var _default = exports.default = style;