@flatbiz/antd 4.4.33 → 4.4.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm/ace-editor-xml/index.js +1 -1
- package/esm/ace-editor-xml/index.js.map +1 -1
- package/esm/anchor-steps/index.js +1 -1
- package/esm/anchor-steps/index.js.map +1 -1
- package/esm/block-layout/index.css +1 -0
- package/esm/block-layout/index.js +5 -0
- package/esm/block-layout/index.js.map +1 -0
- package/esm/bootstrap/index.js +2 -1
- package/esm/bootstrap/index.js.map +1 -1
- package/esm/card-layout/index.css +1 -1
- package/esm/card-layout/index.js +2 -1
- package/esm/card-layout/index.js.map +1 -1
- package/esm/drag-form-list/index.css +1 -1
- package/esm/drag-form-list/index.js +2 -1
- package/esm/drag-form-list/index.js.map +1 -1
- package/esm/easy-table/index.css +1 -1
- package/esm/easy-table/index.js +4 -1
- package/esm/easy-table/index.js.map +1 -1
- package/esm/fba-app/index.css +1 -1
- package/esm/fba-app/index.js +2 -1
- package/esm/fba-app/index.js.map +1 -1
- package/esm/form-grid/index.js +1 -1
- package/esm/form-grid/index.js.map +1 -1
- package/esm/index.css +0 -1
- package/esm/index.js +2 -1
- package/esm/label-value-render/index.js +1 -1
- package/esm/label-value-render/index.js.map +1 -1
- package/esm/mention-editor/index.js +1 -1
- package/esm/mention-editor/index.js.map +1 -1
- package/esm/mentions-wrapper/index.js.map +1 -1
- package/esm/pdf/index.js +1 -1
- package/esm/pdf/index.js.map +1 -1
- package/esm/pdf-preview/index.css +1 -1
- package/esm/pdf-preview/index.js +1 -1
- package/esm/pdf-preview/index.js.map +1 -1
- package/index.d.ts +55 -23
- package/package.json +1 -1
- package/esm/index-1f45bfd5.js +0 -3
- package/esm/index-1f45bfd5.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/form-grid/form-col.tsx","@flatbiz/antd/src/form-grid/form-operate-col.tsx","@flatbiz/antd/src/form-grid/utils.ts","@flatbiz/antd/src/form-grid/form-row.tsx","@flatbiz/antd/src/form-grid/index.ts"],"sourcesContent":["import { Col } from 'antd';\nimport { ReactNode } from 'react';\nconst forceAloneRowGrid = { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 };\nexport type FormColProps = {\n /** 栅格占位格数,替换lg、xl、xxl默认数据 */\n span?: number;\n /** 屏幕 < 576px */\n xs?: number;\n /** 屏幕 ≥ 576px */\n sm?: number;\n /** 屏幕 ≥ 768px */\n md?: number;\n /** 屏幕 ≥ 992px */\n lg?: number;\n /** 屏幕 ≥ 1200px */\n xl?: number;\n /** 屏幕 ≥ 1600px */\n xxl?: number;\n /** 强制单独一行 */\n forceAloneRow?: boolean;\n children?: ReactNode | ReactNode[];\n hidden?: boolean;\n};\n\n/**\n * 网格响应式布局,默认值:{ xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 }\n *```\n * 1. 设置 span 栅格占位格数,替换lg、xl、xxl默认数据,不替换xs、sm布局数据\n * 2. grid 自定义响应式网格布局\n * xs: 屏幕 < 576px\n * sm: 屏幕 ≥ 576px\n * md: 屏幕 ≥ 768px\n * lg: 屏幕 ≥ 992px\n * xl: 屏幕 ≥ 1200px\n * xxl: 屏幕 ≥ 1600px\n * ```\n */\nexport const FormCol = (props: FormColProps) => {\n const { forceAloneRow, hidden, ...otherProps } = props;\n const forceGrid = forceAloneRow ? forceAloneRowGrid : otherProps;\n if (hidden) return null;\n return <Col {...forceGrid}>{props.children}</Col>;\n};\n\nFormCol['domTypeName'] = 'FormCol';\n","import { classNames } from '@dimjs/utils';\nimport { Col, Form, Row, RowProps, Space, SpaceProps } from 'antd';\nimport { ReactElement, useMemo } from 'react';\n\nconst fullGrid = { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 };\nexport type FormOperateColProps = {\n className?: string;\n leftList?: Array<ReactElement | null>;\n rightList?: Array<ReactElement | null>;\n // left、right 对齐方式,优先级最高\n justify?: RowProps['justify'];\n /** 强制单独一行 */\n forceAloneRow?: boolean;\n hidden?: boolean;\n leftSpaceProps?: SpaceProps;\n rightSpaceProps?: SpaceProps;\n};\n\n/**\n * FormOperateCol 布局说明\n * ```\n * 1. 网格数以及位置为动态计算,不支持 xs、sm、md等\n * 2. 如果FormRow只有一行col,则OperateCol会在当前行剩余网格内居左对齐\n * 3. 如果同时设置 leftList、rightList,则此cell会强制独占一行,并左右布局\n * 4. 如果只设置 leftList、rightList其中一个,则会在最后一行剩余网格内居右对齐\n * ```\n */\nexport const FormOperateCol = (props: FormOperateColProps) => {\n const {\n leftList,\n rightList,\n rowColTotal,\n justify,\n forceAloneRow,\n hidden,\n leftSpaceProps,\n rightSpaceProps,\n ...otherProps\n } = props as FormOperateColProps & {\n rowColTotal: number;\n };\n const _leftList = (leftList || []).filter(Boolean);\n const _rightList = (rightList || []).filter(Boolean);\n const hasAll = _leftList.length > 0 && _rightList.length > 0;\n const forceGrid = forceAloneRow || hasAll ? fullGrid : {};\n\n const colJustify = useMemo(() => {\n if (justify) return justify;\n if (hasAll) return 'space-between';\n if (forceAloneRow) return 'end';\n if (rowColTotal === 1) return 'start';\n return 'end';\n }, [forceAloneRow, hasAll, justify, rowColTotal]);\n\n const className = classNames(props.className, 'v-form-col-operate');\n\n if (hidden) return null;\n\n return (\n <Col {...otherProps} {...forceGrid} className={className}>\n <Form.Item>\n <Row justify={colJustify} wrap={false}>\n <Space\n {...leftSpaceProps}\n className={classNames('v-form-col-operate-left', leftSpaceProps?.className)}\n >\n {_leftList.map((item) => item)}\n </Space>\n <Space\n {...rightSpaceProps}\n style={{ overflowX: 'auto', ...rightSpaceProps?.style }}\n className={classNames('v-form-col-operate-right', rightSpaceProps?.className)}\n >\n {_rightList?.map((item) => item)}\n </Space>\n </Row>\n </Form.Item>\n </Col>\n );\n};\n\nFormOperateCol['domTypeName'] = 'FormOperateCol';\n","/**\n * 用于计算 operateCol 所占用网格数\n * ```\n * col网格数据 [8,8,8,12,24,0,8] => [[8,8,8],[12],[24],[0,8]],分组后计算operateCol所在行中剩余网格数\n * ```\n * @returns\n */\nexport const calculateOperateGrid = (gridList: number[], operateColIndex: number) => {\n try {\n const groupList = [] as { index: number; value: number }[][];\n const getGroupItem = function (index) {\n const value = gridList[index];\n return { index, value: value > 24 ? 24 : value };\n };\n let condition = true;\n let groupItemList = [] as { index: number; value: number }[];\n let currentIndex = 0;\n let total = 0;\n while (condition) {\n const currentValue = gridList[currentIndex];\n groupItemList.push(getGroupItem(currentIndex));\n if (currentValue >= 24) {\n groupList.push(groupItemList);\n groupItemList = [];\n total = 0;\n } else if (currentIndex === gridList.length - 1) {\n groupList.push(groupItemList);\n } else {\n total += currentValue;\n if (total >= 24) {\n groupList.push(groupItemList);\n groupItemList = [];\n total = 0;\n }\n }\n currentIndex = currentIndex + 1;\n if (currentIndex >= gridList.length) {\n condition = false;\n }\n }\n const hasOperateList =\n groupList.find((item) => !!item.find((temp) => temp.index === operateColIndex)) || [];\n let hasOperateTotal = 0;\n let hasOperateIndex = 0;\n hasOperateList.forEach((item, index) => {\n if (item.index === operateColIndex) hasOperateIndex = index;\n if (item.index < operateColIndex) {\n hasOperateTotal = hasOperateTotal + item.value;\n }\n });\n if (hasOperateTotal === 24 || hasOperateTotal === 0) {\n hasOperateList[hasOperateIndex].value = 24;\n } else {\n hasOperateList[hasOperateIndex].value = 24 - hasOperateTotal;\n }\n\n return {\n gridList: groupList.reduce((a, b) => a.concat(b)).map((temp) => temp.value),\n gridGroupList: groupList,\n };\n } catch (error) {\n return {\n gridList,\n gridGroupList: [],\n };\n }\n};\n","import { toArray, valueIsEqual } from '@flatbiz/utils';\nimport { Row, RowProps } from 'antd';\nimport { cloneElement, isValidElement, ReactElement, ReactNode, useMemo } from 'react';\nimport { useResponsivePoint } from '../fba-hooks/use-responsive-point';\nimport { calculateOperateGrid } from './utils';\n\nexport type FormRowProps = RowProps & {\n children?: ReactNode | ReactNode[];\n /**\n * default = { xs: 24, sm: 12, md: 8, lg: 8, xl: 8, xxl: 6 };\n * small = { xs: 24, sm: 12, md: 8, lg: 6, xl: 6, xxl: 6 };\n */\n gridSize?: 'default' | 'small';\n};\nconst defaultGrid = { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 };\nconst defaultSmallGrid = { xs: 24, sm: 12, md: 8, lg: 6, xl: 6, xxl: 6 };\n\n/**\n * FormItem网格响应式布局\n *```\n * 1. 应用场景:Form条件布局\n * 2. 子元素只能是 FormGrid.Col、FormGrid.OperateCol,其他会被忽略\n * 3. 所有子元素中只能存在一个 FormGrid.OperateCol\n */\nexport const FormRow = (props: FormRowProps) => {\n const { gridSize, ...otherProps } = props;\n const screenType = useResponsivePoint() || 'md';\n\n const childrenList = toArray<ReactElement>(props.children).filter((item) => {\n if (!item || !isValidElement(item)) return false;\n return valueIsEqual(item.type['domTypeName'], ['FormOperateCol', 'FormCol']);\n });\n const defaultGridSize = gridSize === 'small' ? defaultSmallGrid : defaultGrid;\n console.log('screenType', screenType, defaultGridSize[screenType]);\n\n const { gridList, gridGroupList } = useMemo(() => {\n const operateColIndex = childrenList.findIndex((item) => {\n return item.type['domTypeName'] === 'FormOperateCol';\n });\n if (screenType === undefined) {\n return { gridList: [] as number[], gridGroupList: [] };\n }\n const _currentGridList = childrenList.map((temp, index) => {\n if (index === operateColIndex) return 0;\n const span = temp.props?.span as number;\n if (['md', 'sm', 'xs'].includes(screenType)) {\n const innerSpan = temp.props?.[screenType] || defaultGridSize[screenType];\n if (screenType == 'md' && span) {\n return span > innerSpan ? span : innerSpan;\n }\n return innerSpan;\n }\n return temp.props?.[screenType] || span || defaultGridSize[screenType];\n });\n if (operateColIndex < 0) {\n return { gridList: _currentGridList, gridGroupList: [] };\n }\n return calculateOperateGrid(_currentGridList, operateColIndex);\n }, [childrenList, defaultGridSize, screenType]);\n\n // if (!screenType) return <Fragment>{props.children}</Fragment>;\n return (\n <Row {...otherProps}>\n {childrenList.map((item, index) => {\n const itemProps = { ...defaultGridSize, ...item.props };\n const newProps = {\n key: index,\n ...itemProps,\n [screenType]: gridList[index] || itemProps[screenType],\n };\n if (item.type['domTypeName'] === 'FormOperateCol') {\n newProps['rowColTotal'] = gridGroupList.length;\n }\n return cloneElement(item, newProps);\n })}\n </Row>\n );\n};\n","import { FormCol } from './form-col';\nimport { FormOperateCol } from './form-operate-col';\nimport { FormRow } from './form-row';\n\nexport const FormGrid = {\n /**\n * FormItem网格响应式布局\n *```\n * 1. 应用场景:Form条件布局\n * 2. 子元素只能是 FormGrid.Col、FormGrid.OperateCol,其他会被忽略\n * 3. 所有子元素中只能存在一个 FormGrid.OperateCol\n */\n Row: FormRow,\n /**\n * 网格响应式布局,默认值:{ xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 }\n *```\n * 1. 设置 span 栅格占位格数,替换lg、xl、xxl默认数据,不替换xs、sm布局数据\n * 2. grid 自定义响应式网格布局\n * xs: 屏幕 < 576px\n * sm: 屏幕 ≥ 576px\n * md: 屏幕 ≥ 768px\n * lg: 屏幕 ≥ 992px\n * xl: 屏幕 ≥ 1200px\n * xxl: 屏幕 ≥ 1600px\n * ```\n */\n Col: FormCol,\n /**\n * FormOperateCol 布局说明\n * ```\n * 1. 网格数以及位置为动态计算,不支持 xs、sm、md等\n * 2. 如果FormRow只有一行col,则OperateCol会在当前行剩余网格内居左对齐\n * 3. 如果同时设置 leftList、rightList,则此cell会强制独占一行,并左右布局\n * 4. 如果只设置 leftList、rightList其中一个,则会在最后一行剩余网格内居右对齐\n * ```\n */\n OperateCol: FormOperateCol,\n};\n"],"names":["forceAloneRowGrid","xs","sm","md","lg","xl","xxl","FormCol","props","forceAloneRow","hidden","otherProps","_objectWithoutPropertiesLoose","_excluded","forceGrid","_jsx","Col","_extends","children","fullGrid","FormOperateCol","_ref","leftList","rightList","rowColTotal","justify","leftSpaceProps","rightSpaceProps","_leftList","filter","Boolean","_rightList","hasAll","length","colJustify","useMemo","className","_classNames","Form","Item","_jsxs","Row","wrap","Space","map","item","style","overflowX","calculateOperateGrid","gridList","operateColIndex","groupList","getGroupItem","index","value","condition","groupItemList","currentIndex","total","currentValue","push","hasOperateList","find","temp","hasOperateTotal","hasOperateIndex","forEach","reduce","a","b","concat","gridGroupList","error","defaultGrid","defaultSmallGrid","FormRow","gridSize","screenType","useResponsivePoint","childrenList","toArray","isValidElement","valueIsEqual","type","defaultGridSize","console","log","_useMemo","findIndex","undefined","_currentGridList","_temp$props","_temp$props3","span","includes","_temp$props2","innerSpan","_extends2","itemProps","newProps","key","cloneElement","FormGrid","OperateCol"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/form-grid/form-col.tsx","@flatbiz/antd/src/form-grid/form-operate-col.tsx","@flatbiz/antd/src/form-grid/utils.ts","@flatbiz/antd/src/form-grid/form-row.tsx","@flatbiz/antd/src/form-grid/index.ts"],"sourcesContent":["import { Col } from 'antd';\nimport { ReactNode } from 'react';\nconst forceAloneRowGrid = { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 };\nexport type FormColProps = {\n /** 栅格占位格数,替换lg、xl、xxl默认数据 */\n span?: number;\n /** 屏幕 < 576px */\n xs?: number;\n /** 屏幕 ≥ 576px */\n sm?: number;\n /** 屏幕 ≥ 768px */\n md?: number;\n /** 屏幕 ≥ 992px */\n lg?: number;\n /** 屏幕 ≥ 1200px */\n xl?: number;\n /** 屏幕 ≥ 1600px */\n xxl?: number;\n /** 强制单独一行 */\n forceAloneRow?: boolean;\n children?: ReactNode | ReactNode[];\n hidden?: boolean;\n};\n\n/**\n * 网格响应式布局,默认值:{ xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 }\n *```\n * 1. 设置 span 栅格占位格数,替换lg、xl、xxl默认数据,不替换xs、sm布局数据\n * 2. grid 自定义响应式网格布局\n * xs: 屏幕 < 576px\n * sm: 屏幕 ≥ 576px\n * md: 屏幕 ≥ 768px\n * lg: 屏幕 ≥ 992px\n * xl: 屏幕 ≥ 1200px\n * xxl: 屏幕 ≥ 1600px\n * ```\n */\nexport const FormCol = (props: FormColProps) => {\n const { forceAloneRow, hidden, ...otherProps } = props;\n const forceGrid = forceAloneRow ? forceAloneRowGrid : otherProps;\n if (hidden) return null;\n return <Col {...forceGrid}>{props.children}</Col>;\n};\n\nFormCol['domTypeName'] = 'FormCol';\n","import { classNames } from '@dimjs/utils';\nimport { Col, Form, Row, RowProps, Space, SpaceProps } from 'antd';\nimport { ReactElement, useMemo } from 'react';\n\nconst fullGrid = { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 };\nexport type FormOperateColProps = {\n className?: string;\n leftList?: Array<ReactElement | null>;\n rightList?: Array<ReactElement | null>;\n // left、right 对齐方式,优先级最高\n justify?: RowProps['justify'];\n /** 强制单独一行 */\n forceAloneRow?: boolean;\n hidden?: boolean;\n leftSpaceProps?: SpaceProps;\n rightSpaceProps?: SpaceProps;\n};\n\n/**\n * FormOperateCol 布局说明\n * ```\n * 1. 网格数以及位置为动态计算,不支持 xs、sm、md等\n * 2. 如果FormRow只有一行col,则OperateCol会在当前行剩余网格内居左对齐\n * 3. 如果同时设置 leftList、rightList,则此cell会强制独占一行,并左右布局\n * 4. 如果只设置 leftList、rightList其中一个,则会在最后一行剩余网格内居右对齐\n * ```\n */\nexport const FormOperateCol = (props: FormOperateColProps) => {\n const {\n leftList,\n rightList,\n rowColTotal,\n justify,\n forceAloneRow,\n hidden,\n leftSpaceProps,\n rightSpaceProps,\n ...otherProps\n } = props as FormOperateColProps & {\n rowColTotal: number;\n };\n const _leftList = (leftList || []).filter(Boolean);\n const _rightList = (rightList || []).filter(Boolean);\n const hasAll = _leftList.length > 0 && _rightList.length > 0;\n const forceGrid = forceAloneRow || hasAll ? fullGrid : {};\n\n const colJustify = useMemo(() => {\n if (justify) return justify;\n if (hasAll) return 'space-between';\n if (forceAloneRow) return 'end';\n if (rowColTotal === 1) return 'start';\n return 'end';\n }, [forceAloneRow, hasAll, justify, rowColTotal]);\n\n const className = classNames(props.className, 'v-form-col-operate');\n\n if (hidden) return null;\n\n return (\n <Col {...otherProps} {...forceGrid} className={className}>\n <Form.Item>\n <Row justify={colJustify} wrap={false}>\n <Space\n {...leftSpaceProps}\n className={classNames('v-form-col-operate-left', leftSpaceProps?.className)}\n >\n {_leftList.map((item) => item)}\n </Space>\n <Space\n {...rightSpaceProps}\n style={{ overflowX: 'auto', ...rightSpaceProps?.style }}\n className={classNames('v-form-col-operate-right', rightSpaceProps?.className)}\n >\n {_rightList?.map((item) => item)}\n </Space>\n </Row>\n </Form.Item>\n </Col>\n );\n};\n\nFormOperateCol['domTypeName'] = 'FormOperateCol';\n","/**\n * 用于计算 operateCol 所占用网格数\n * ```\n * col网格数据 [8,8,8,12,24,0,8] => [[8,8,8],[12],[24],[0,8]],分组后计算operateCol所在行中剩余网格数\n * ```\n * @returns\n */\nexport const calculateOperateGrid = (gridList: number[], operateColIndex: number) => {\n try {\n const groupList = [] as { index: number; value: number }[][];\n const getGroupItem = function (index) {\n const value = gridList[index];\n return { index, value: value > 24 ? 24 : value };\n };\n let condition = true;\n let groupItemList = [] as { index: number; value: number }[];\n let currentIndex = 0;\n let total = 0;\n while (condition) {\n const currentValue = gridList[currentIndex];\n groupItemList.push(getGroupItem(currentIndex));\n if (currentValue >= 24) {\n groupList.push(groupItemList);\n groupItemList = [];\n total = 0;\n } else if (currentIndex === gridList.length - 1) {\n groupList.push(groupItemList);\n } else {\n total += currentValue;\n if (total >= 24) {\n groupList.push(groupItemList);\n groupItemList = [];\n total = 0;\n }\n }\n currentIndex = currentIndex + 1;\n if (currentIndex >= gridList.length) {\n condition = false;\n }\n }\n const hasOperateList =\n groupList.find((item) => !!item.find((temp) => temp.index === operateColIndex)) || [];\n let hasOperateTotal = 0;\n let hasOperateIndex = 0;\n hasOperateList.forEach((item, index) => {\n if (item.index === operateColIndex) hasOperateIndex = index;\n if (item.index < operateColIndex) {\n hasOperateTotal = hasOperateTotal + item.value;\n }\n });\n if (hasOperateTotal === 24 || hasOperateTotal === 0) {\n hasOperateList[hasOperateIndex].value = 24;\n } else {\n hasOperateList[hasOperateIndex].value = 24 - hasOperateTotal;\n }\n\n return {\n gridList: groupList.reduce((a, b) => a.concat(b)).map((temp) => temp.value),\n gridGroupList: groupList,\n };\n } catch (error) {\n return {\n gridList,\n gridGroupList: [],\n };\n }\n};\n","import { toArray, valueIsEqual } from '@flatbiz/utils';\nimport { Row, RowProps } from 'antd';\nimport { cloneElement, isValidElement, ReactElement, ReactNode, useMemo } from 'react';\nimport { useResponsivePoint } from '../fba-hooks/use-responsive-point';\nimport { calculateOperateGrid } from './utils';\n\nexport type FormRowProps = RowProps & {\n children?: ReactNode | ReactNode[];\n /**\n * default = { xs: 24, sm: 12, md: 8, lg: 8, xl: 8, xxl: 6 };\n * small = { xs: 24, sm: 12, md: 8, lg: 6, xl: 6, xxl: 6 };\n */\n gridSize?: 'default' | 'small';\n};\nconst defaultGrid = { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 };\nconst defaultSmallGrid = { xs: 24, sm: 12, md: 8, lg: 6, xl: 6, xxl: 6 };\n\n/**\n * FormItem网格响应式布局\n *```\n * 1. 应用场景:Form条件布局\n * 2. 子元素只能是 FormGrid.Col、FormGrid.OperateCol,其他会被忽略\n * 3. 所有子元素中只能存在一个 FormGrid.OperateCol\n */\nexport const FormRow = (props: FormRowProps) => {\n const { gridSize, ...otherProps } = props;\n const screenType = useResponsivePoint() || 'md';\n\n const childrenList = toArray<ReactElement>(props.children).filter((item) => {\n if (!item || !isValidElement(item)) return false;\n return valueIsEqual(item.type['domTypeName'], ['FormOperateCol', 'FormCol']);\n });\n const defaultGridSize = gridSize === 'small' ? defaultSmallGrid : defaultGrid;\n\n const { gridList, gridGroupList } = useMemo(() => {\n const operateColIndex = childrenList.findIndex((item) => {\n return item.type['domTypeName'] === 'FormOperateCol';\n });\n if (screenType === undefined) {\n return { gridList: [] as number[], gridGroupList: [] };\n }\n const _currentGridList = childrenList.map((temp, index) => {\n if (index === operateColIndex) return 0;\n const span = temp.props?.span as number;\n if (['md', 'sm', 'xs'].includes(screenType)) {\n const innerSpan = temp.props?.[screenType] || defaultGridSize[screenType];\n if (screenType == 'md' && span) {\n return span > innerSpan ? span : innerSpan;\n }\n return innerSpan;\n }\n return temp.props?.[screenType] || span || defaultGridSize[screenType];\n });\n if (operateColIndex < 0) {\n return { gridList: _currentGridList, gridGroupList: [] };\n }\n return calculateOperateGrid(_currentGridList, operateColIndex);\n }, [childrenList, defaultGridSize, screenType]);\n\n // if (!screenType) return <Fragment>{props.children}</Fragment>;\n return (\n <Row {...otherProps}>\n {childrenList.map((item, index) => {\n const itemProps = { ...defaultGridSize, ...item.props };\n const newProps = {\n key: index,\n ...itemProps,\n [screenType]: gridList[index] || itemProps[screenType],\n };\n if (item.type['domTypeName'] === 'FormOperateCol') {\n newProps['rowColTotal'] = gridGroupList.length;\n }\n return cloneElement(item, newProps);\n })}\n </Row>\n );\n};\n","import { FormCol } from './form-col';\nimport { FormOperateCol } from './form-operate-col';\nimport { FormRow } from './form-row';\n\nexport const FormGrid = {\n /**\n * FormItem网格响应式布局\n *```\n * 1. 应用场景:Form条件布局\n * 2. 子元素只能是 FormGrid.Col、FormGrid.OperateCol,其他会被忽略\n * 3. 所有子元素中只能存在一个 FormGrid.OperateCol\n */\n Row: FormRow,\n /**\n * 网格响应式布局,默认值:{ xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 }\n *```\n * 1. 设置 span 栅格占位格数,替换lg、xl、xxl默认数据,不替换xs、sm布局数据\n * 2. grid 自定义响应式网格布局\n * xs: 屏幕 < 576px\n * sm: 屏幕 ≥ 576px\n * md: 屏幕 ≥ 768px\n * lg: 屏幕 ≥ 992px\n * xl: 屏幕 ≥ 1200px\n * xxl: 屏幕 ≥ 1600px\n * ```\n */\n Col: FormCol,\n /**\n * FormOperateCol 布局说明\n * ```\n * 1. 网格数以及位置为动态计算,不支持 xs、sm、md等\n * 2. 如果FormRow只有一行col,则OperateCol会在当前行剩余网格内居左对齐\n * 3. 如果同时设置 leftList、rightList,则此cell会强制独占一行,并左右布局\n * 4. 如果只设置 leftList、rightList其中一个,则会在最后一行剩余网格内居右对齐\n * ```\n */\n OperateCol: FormOperateCol,\n};\n"],"names":["forceAloneRowGrid","xs","sm","md","lg","xl","xxl","FormCol","props","forceAloneRow","hidden","otherProps","_objectWithoutPropertiesLoose","_excluded","forceGrid","_jsx","Col","_extends","children","fullGrid","FormOperateCol","_ref","leftList","rightList","rowColTotal","justify","leftSpaceProps","rightSpaceProps","_leftList","filter","Boolean","_rightList","hasAll","length","colJustify","useMemo","className","_classNames","Form","Item","_jsxs","Row","wrap","Space","map","item","style","overflowX","calculateOperateGrid","gridList","operateColIndex","groupList","getGroupItem","index","value","condition","groupItemList","currentIndex","total","currentValue","push","hasOperateList","find","temp","hasOperateTotal","hasOperateIndex","forEach","reduce","a","b","concat","gridGroupList","error","defaultGrid","defaultSmallGrid","FormRow","gridSize","screenType","useResponsivePoint","childrenList","toArray","isValidElement","valueIsEqual","type","defaultGridSize","_useMemo","findIndex","undefined","_currentGridList","_temp$props","_temp$props3","span","includes","_temp$props2","innerSpan","_extends2","itemProps","newProps","key","cloneElement","FormGrid","OperateCol"],"mappings":";mcAEA,IAAMA,EAAoB,CAAEC,GAAI,GAAIC,GAAI,GAAIC,GAAI,GAAIC,GAAI,GAAIC,GAAI,GAAIC,IAAK,IAmClE,IAAMC,EAAU,SAAVA,EAAWC,GACtB,IAAQC,EAAyCD,EAAzCC,cAAeC,EAA0BF,EAA1BE,OAAWC,EAAUC,EAAKJ,EAAKK,GACtD,IAAMC,EAAYL,EAAgBT,EAAoBW,EACtD,GAAID,EAAQ,OAAO,KACnB,OAAOK,EAACC,EAAGC,KAAKH,EAAS,CAAAI,SAAGV,EAAMU,WACpC,EAEAX,EAAQ,eAAiB,6HCxCzB,IAAMY,EAAW,CAAElB,GAAI,GAAIC,GAAI,GAAIC,GAAI,GAAIC,GAAI,GAAIC,GAAI,GAAIC,IAAK,IAuBzD,IAAMc,EAAiB,SAAjBA,EAAkBZ,GAC7B,IAAAa,EAUIb,EATFc,EAAQD,EAARC,SACAC,EAASF,EAATE,UACAC,EAAWH,EAAXG,YACAC,EAAOJ,EAAPI,QACAhB,EAAaY,EAAbZ,cACAC,EAAMW,EAANX,OACAgB,EAAcL,EAAdK,eACAC,EAAeN,EAAfM,gBACGhB,EAAUC,EAAAS,EAAAR,GAIf,IAAMe,GAAaN,GAAY,IAAIO,OAAOC,SAC1C,IAAMC,GAAcR,GAAa,IAAIM,OAAOC,SAC5C,IAAME,EAASJ,EAAUK,OAAS,GAAKF,EAAWE,OAAS,EAC3D,IAAMnB,EAAYL,GAAiBuB,EAASb,EAAW,CAAA,EAEvD,IAAMe,EAAaC,GAAQ,WACzB,GAAIV,EAAS,OAAOA,EACpB,GAAIO,EAAQ,MAAO,gBACnB,GAAIvB,EAAe,MAAO,MAC1B,GAAIe,IAAgB,EAAG,MAAO,QAC9B,MAAO,KACR,GAAE,CAACf,EAAeuB,EAAQP,EAASD,IAEpC,IAAMY,EAAYC,EAAW7B,EAAM4B,UAAW,sBAE9C,GAAI1B,EAAQ,OAAO,KAEnB,OACEK,EAACC,EAAGC,EAAKN,CAAAA,EAAAA,EAAgBG,EAAS,CAAEsB,UAAWA,EAAUlB,SACvDH,EAACuB,EAAKC,KAAI,CAAArB,SACRsB,EAACC,EAAG,CAAChB,QAASS,EAAYQ,KAAM,MAAMxB,UACpCH,EAAC4B,EAAK1B,KACAS,EAAc,CAClBU,UAAWC,EAAW,0BAA2BX,GAAAA,UAAAA,EAAAA,EAAgBU,WAAWlB,SAE3EU,EAAUgB,KAAI,SAACC,GAAI,OAAKA,CAAI,OAE/B9B,EAAC4B,EAAK1B,KACAU,EAAe,CACnBmB,MAAK7B,EAAA,CAAI8B,UAAW,QAAWpB,GAAe,UAAA,EAAfA,EAAiBmB,OAChDV,UAAWC,EAAW,2BAA4BV,GAAAA,UAAAA,EAAAA,EAAiBS,WAAWlB,SAE7Ea,GAAAA,UAAAA,EAAAA,EAAYa,KAAI,SAACC,GAAI,OAAKA,CAAI,cAM3C,EAEAzB,EAAe,eAAiB,iBC1EzB,IAAM4B,EAAuB,SAAvBA,EAAwBC,EAAoBC,GACvD,IACE,IAAMC,EAAY,GAClB,IAAMC,EAAe,SAAfA,EAAyBC,GAC7B,IAAMC,EAAQL,EAASI,GACvB,MAAO,CAAEA,MAAAA,EAAOC,MAAOA,EAAQ,GAAK,GAAKA,IAE3C,IAAIC,EAAY,KAChB,IAAIC,EAAgB,GACpB,IAAIC,EAAe,EACnB,IAAIC,EAAQ,EACZ,MAAOH,EAAW,CAChB,IAAMI,EAAeV,EAASQ,GAC9BD,EAAcI,KAAKR,EAAaK,IAChC,GAAIE,GAAgB,GAAI,CACtBR,EAAUS,KAAKJ,GACfA,EAAgB,GAChBE,EAAQ,CACT,MAAM,GAAID,IAAiBR,EAAShB,OAAS,EAAG,CAC/CkB,EAAUS,KAAKJ,EACjB,KAAO,CACLE,GAASC,EACT,GAAID,GAAS,GAAI,CACfP,EAAUS,KAAKJ,GACfA,EAAgB,GAChBE,EAAQ,CACV,CACF,CACAD,EAAeA,EAAe,EAC9B,GAAIA,GAAgBR,EAAShB,OAAQ,CACnCsB,EAAY,KACd,CACF,CACA,IAAMM,EACJV,EAAUW,MAAK,SAACjB,GAAI,QAAOA,EAAKiB,MAAK,SAACC,GAAI,OAAKA,EAAKV,QAAUH,IAAgB,KAAK,GACrF,IAAIc,EAAkB,EACtB,IAAIC,EAAkB,EACtBJ,EAAeK,SAAQ,SAACrB,EAAMQ,GAC5B,GAAIR,EAAKQ,QAAUH,EAAiBe,EAAkBZ,EACtD,GAAIR,EAAKQ,MAAQH,EAAiB,CAChCc,EAAkBA,EAAkBnB,EAAKS,KAC3C,CACF,IACA,GAAIU,IAAoB,IAAMA,IAAoB,EAAG,CACnDH,EAAeI,GAAiBX,MAAQ,EAC1C,KAAO,CACLO,EAAeI,GAAiBX,MAAQ,GAAKU,CAC/C,CAEA,MAAO,CACLf,SAAUE,EAAUgB,QAAO,SAACC,EAAGC,GAAC,OAAKD,EAAEE,OAAOD,EAAE,IAAEzB,KAAI,SAACmB,GAAI,OAAKA,EAAKT,SACrEiB,cAAepB,EAElB,CAAC,MAAOqB,GACP,MAAO,CACLvB,SAAAA,EACAsB,cAAe,GAEnB,CACF,qBCpDA,IAAME,EAAc,CAAExE,GAAI,GAAIC,GAAI,GAAIC,GAAI,GAAIC,GAAI,EAAGC,GAAI,EAAGC,IAAK,GACjE,IAAMoE,EAAmB,CAAEzE,GAAI,GAAIC,GAAI,GAAIC,GAAI,EAAGC,GAAI,EAAGC,GAAI,EAAGC,IAAK,GAS9D,IAAMqE,EAAU,SAAVA,EAAWnE,GACtB,IAAQoE,EAA4BpE,EAA5BoE,SAAajE,EAAUC,EAAKJ,EAAKK,GACzC,IAAMgE,EAAaC,KAAwB,KAE3C,IAAMC,EAAeC,EAAsBxE,EAAMU,UAAUW,QAAO,SAACgB,GACjE,IAAKA,IAASoC,EAAepC,GAAO,OAAO,MAC3C,OAAOqC,EAAarC,EAAKsC,KAAK,eAAgB,CAAC,iBAAkB,WACnE,IACA,IAAMC,EAAkBR,IAAa,QAAUF,EAAmBD,EAElE,IAAAY,EAAoClD,GAAQ,WAC1C,IAAMe,EAAkB6B,EAAaO,WAAU,SAACzC,GAC9C,OAAOA,EAAKsC,KAAK,iBAAmB,gBACtC,IACA,GAAIN,IAAeU,UAAW,CAC5B,MAAO,CAAEtC,SAAU,GAAgBsB,cAAe,GACpD,CACA,IAAMiB,EAAmBT,EAAanC,KAAI,SAACmB,EAAMV,GAAU,IAAAoC,EAAAC,EACzD,GAAIrC,IAAUH,EAAiB,OAAO,EACtC,IAAMyC,GAAIF,EAAG1B,EAAKvD,QAAK,UAAA,EAAViF,EAAYE,KACzB,GAAI,CAAC,KAAM,KAAM,MAAMC,SAASf,GAAa,CAAA,IAAAgB,EAC3C,IAAMC,IAAYD,EAAA9B,EAAKvD,QAALqF,UAAAA,EAAAA,EAAahB,KAAeO,EAAgBP,GAC9D,GAAIA,GAAc,MAAQc,EAAM,CAC9B,OAAOA,EAAOG,EAAYH,EAAOG,CACnC,CACA,OAAOA,CACT,CACA,QAAOJ,EAAA3B,EAAKvD,QAALkF,UAAAA,EAAAA,EAAab,KAAec,GAAQP,EAAgBP,EAC7D,IACA,GAAI3B,EAAkB,EAAG,CACvB,MAAO,CAAED,SAAUuC,EAAkBjB,cAAe,GACtD,CACA,OAAOvB,EAAqBwC,EAAkBtC,EAC/C,GAAE,CAAC6B,EAAcK,EAAiBP,IAvB3B5B,EAAQoC,EAARpC,SAAUsB,EAAac,EAAbd,cA0BlB,OACExD,EAAC0B,EAAGxB,KAAKN,EAAU,CAAAO,SAChB6D,EAAanC,KAAI,SAACC,EAAMQ,GAAU,IAAA0C,EACjC,IAAMC,EAAS/E,EAAA,CAAA,EAAQmE,EAAoBvC,EAAKrC,OAChD,IAAMyF,EAAQhF,EAAA,CACZiF,IAAK7C,GACF2C,GAASD,KAAAA,EACXlB,GAAa5B,EAASI,IAAU2C,EAAUnB,GAAWkB,IAExD,GAAIlD,EAAKsC,KAAK,iBAAmB,iBAAkB,CACjDc,EAAS,eAAiB1B,EAActC,MAC1C,CACA,OAAOkE,EAAatD,EAAMoD,QAIlC,ECxEO,IAAMG,EAAW,CAQtB3D,IAAKkC,EAcL3D,IAAKT,EAUL8F,WAAYjF"}
|
package/esm/index.css
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.block-layout{background-color:var(--block-bg-color)}.light-theme .block-layout{color:rgba(0,0,0,.88)}.dark-theme .block-layout{color:hsla(0,0%,100%,.85)}
|
package/esm/index.js
CHANGED
|
@@ -16,6 +16,7 @@ import './amount-fen-input/index.css';
|
|
|
16
16
|
import './amount-fen-input-form-item/index.css';
|
|
17
17
|
import './anchor-steps/index.css';
|
|
18
18
|
import './gap/index.css';
|
|
19
|
+
import './block-layout/index.css';
|
|
19
20
|
import './bootstrap/index.css';
|
|
20
21
|
import './fba-app/index.css';
|
|
21
22
|
import './box-grid/index.css';
|
|
@@ -123,5 +124,5 @@ import './tree-selector-wrapper/index.css';
|
|
|
123
124
|
import './tree-wrapper/index.css';
|
|
124
125
|
import './index.css';
|
|
125
126
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
126
|
-
export{AceEditorGroovy}from"./ace-editor-groovy/index.js";export{AceEditorJava}from"./ace-editor-java/index.js";export{AceEditorJson}from"./ace-editor-json/index.js";export{AceEditorMysql}from"./ace-editor-mysql/index.js";export{AceEditorXml}from"./ace-editor-xml/index.js";export{AlertWrapper}from"./alert-wrapper/index.js";export{AmountFenInput}from"./amount-fen-input/index.js";export{AmountFenInputFormItem}from"./amount-fen-input-form-item/index.js";export{AnchorSteps}from"./anchor-steps/index.js";export{
|
|
127
|
+
export{AceEditorGroovy}from"./ace-editor-groovy/index.js";export{AceEditorJava}from"./ace-editor-java/index.js";export{AceEditorJson}from"./ace-editor-json/index.js";export{AceEditorMysql}from"./ace-editor-mysql/index.js";export{AceEditorXml}from"./ace-editor-xml/index.js";export{AlertWrapper}from"./alert-wrapper/index.js";export{AmountFenInput}from"./amount-fen-input/index.js";export{AmountFenInputFormItem}from"./amount-fen-input-form-item/index.js";export{AnchorSteps}from"./anchor-steps/index.js";export{BlockLayout}from"./block-layout/index.js";export{Bootstrap}from"./bootstrap/index.js";export{BoxGrid,useBoxBreakpoint}from"./box-grid/index.js";export{ButtonOperate,ButtonOperateItemContent}from"./button-operate/index.js";export{ButtonWrapper}from"./button-wrapper/index.js";export{CardLayout}from"./card-layout/index.js";export{CardWrapper}from"./card-wrapper/index.js";export{CascaderWrapper}from"./cascader-wrapper/index.js";export{CheckList}from"./check-list/index.js";export{CheckboxWrapper}from"./checkbox-wrapper/index.js";export{ColorPickerWrapper}from"./color-picker-wrapper/index.js";export{C as ConfigProviderWrapper}from"./index-7f4ad045.js";export{createDrawerWrapperModel}from"./create-drawer-wrapper-model/index.js";export{createModalWrapperModel}from"./create-modal-wrapper-model/index.js";export{CssNodeHover}from"./css-node-hover/index.js";export{DataRender}from"./data-render/index.js";export{DatePickerWrapper}from"./date-picker-wrapper/index.js";export{DateRangePickerWrapper}from"./date-range-picker-wrapper/index.js";export{DateRangePickerWrapperFormItem}from"./date-range-picker-wrapper-form-item/index.js";export{dialogAlert}from"./dialog-alert/index.js";export{dialogConfirm}from"./dialog-confirm/index.js";export{dialogDrawer}from"./dialog-drawer/index.js";export{DialogDrawerContent}from"./dialog-drawer-content/index.js";export{dialogLoading}from"./dialog-loading/index.js";export{dialogModal}from"./dialog-modal/index.js";export{DragCollapse}from"./drag-collapse/index.js";export{DragCollapseFormList}from"./drag-collapse-form-list/index.js";export{DragEditableTable}from"./drag-editable-table/index.js";export{DragFormList}from"./drag-form-list/index.js";export{DragTable}from"./drag-table/index.js";export{DrawerWrapper}from"./drawer-wrapper/index.js";export{DropdownMenuWrapper}from"./dropdown-menu-wrapper/index.js";export{dynamicNode}from"./dynamic-node/index.js";export{EasyForm}from"./easy-form/index.js";export{EasyTable}from"./easy-table/index.js";export{EditableField}from"./editable-field/index.js";export{EditableFieldProvider}from"./editable-field-provider/index.js";export{EditableTable}from"./editable-table/index.js";export{EditorWrapper}from"./editor-wrapper/index.js";export{ErrorBoundaryWrapper}from"./error-boundary-wrapper/index.js";export{FbaApp}from"./fba-app/index.js";export{fbaHooks}from"./fba-hooks/index.js";export{fbaUtils}from"./fba-utils/index.js";export{FileExport}from"./file-export/index.js";export{FileImport}from"./file-import/index.js";export{FileSelect}from"./file-select/index.js";export{FlexLayout}from"./flex-layout/index.js";export{FormGrid}from"./form-grid/index.js";export{FormItemGroup}from"./form-item-group/index.js";export{FormItemHidden}from"./form-item-hidden/index.js";export{FormItemText}from"./form-item-text/index.js";export{FormItemWrapper}from"./form-item-wrapper/index.js";export{FormListWrapper}from"./form-list-wrapper/index.js";export{FormWrapper}from"./form-wrapper/index.js";export{Gap}from"./gap/index.js";export{IconWrapper}from"./icon-wrapper/index.js";export{InputSearchWrapper}from"./input-search-wrapper/index.js";export{InputTextAreaWrapper}from"./input-text-area-wrapper/index.js";export{InputWrapper}from"./input-wrapper/index.js";export{JsonEditor}from"./json-editor/index.js";export{LabelValueLayout}from"./label-value-layout/index.js";export{LabelValueRender}from"./label-value-render/index.js";export{LocalLoading}from"./local-loading/index.js";export{MentionEditor}from"./mention-editor/index.js";export{MentionsWrapper}from"./mentions-wrapper/index.js";export{ModalAction}from"./modal-action/index.js";export{ModalWrapper}from"./modal-wrapper/index.js";export{PageFixedFooter}from"./page-fixed-footer/index.js";export{Page404}from"./page404/index.js";export{P as PaginationWrapper}from"./index-6677fbfc.js";export{Pdf}from"./pdf/index.js";export{PdfPreview}from"./pdf-preview/index.js";export{Permission}from"./permission/index.js";export{preDefinedClassName}from"./pre-defined-class-name/index.js";export{RadioGroupWrapper}from"./radio-group-wrapper/index.js";export{RelationTree}from"./relation-tree/index.js";export{RequestStatus}from"./request-status/index.js";export{RichTextEditor}from"./rich-text-editor/index.js";export{RichTextViewer}from"./rich-text-viewer/index.js";export{RollLocationCenter}from"./roll-location-center/index.js";export{RollLocationInView}from"./roll-location-in-view/index.js";export{RuleDescribe}from"./rule-describe/index.js";export{SearchForm}from"./search-form/index.js";export{SearchMenu}from"./search-menu/index.js";export{SelectorWrapper}from"./selector-wrapper/index.js";export{SelectorWrapperSearch}from"./selector-wrapper-search/index.js";export{SelectorWrapperSimple}from"./selector-wrapper-simple/index.js";export{SimpleLayout}from"./simple-layout/index.js";export{SmsCountDown}from"./sms-count-down/index.js";export{SplitWrapper}from"./split-wrapper/index.js";export{styles}from"./styles/index.js";export{SvgHttpView}from"./svg-http-view/index.js";export{SwitchConfirmWrapper}from"./switch-confirm-wrapper/index.js";export{SwitchWrapper}from"./switch-wrapper/index.js";export{tableCellRender}from"./table-cell-render/index.js";export{TableScrollbar}from"./table-scrollbar/index.js";export{TableTitleTooltip}from"./table-title-tooltip/index.js";export{TabsWrapper}from"./tabs-wrapper/index.js";export{TagGroup}from"./tag-group/index.js";export{TagListSelect}from"./tag-list-select/index.js";export{TagWrapper}from"./tag-wrapper/index.js";export{TextCssEllipsis}from"./text-css-ellipsis/index.js";export{TextOverflow}from"./text-overflow/index.js";export{TextOverflowRender}from"./text-overflow-render/index.js";export{TextSymbolWrapper}from"./text-symbol-wrapper/index.js";export{TimePickerWrapper}from"./time-picker-wrapper/index.js";export{TimeRangePickerWrapper}from"./time-range-picker-wrapper/index.js";export{TimeRangePickerWrapperFormItem}from"./time-range-picker-wrapper-form-item/index.js";export{TipsTitle}from"./tips-title/index.js";export{TipsWrapper}from"./tips-wrapper/index.js";export{TreeSelectorWrapper}from"./tree-selector-wrapper/index.js";export{TreeWrapper}from"./tree-wrapper/index.js";export{UploadWrapper}from"./upload-wrapper/index.js";import"./_rollupPluginBabelHelpers-a0769acd.js";import"@dimjs/utils/cjs/class-names";import"@wove/react/cjs/hooks";import"@dimjs/lang/cjs/is-object";import"@flatbiz/utils";import"react";import"react-ace";import"ace-builds/src-noconflict/ext-language_tools";import"ace-builds/src-noconflict/mode-groovy";import"ace-builds/src-noconflict/snippets/groovy";import"react/jsx-runtime";import"ace-builds/src-noconflict/mode-java";import"ace-builds/src-noconflict/snippets/java";import"ace-builds/src-noconflict/mode-json";import"ace-builds/src-noconflict/snippets/json";import"sql-formatter";import"ace-builds/src-noconflict/mode-mysql";import"ace-builds/src-noconflict/snippets/mysql";import"antd";import"xml-formatter";import"ace-builds/src-noconflict/mode-xml";import"ace-builds/src-noconflict/snippets/xml";import"@dimjs/utils/cjs/get";import"@dimjs/lang/cjs/is-number";import"ahooks";import"@ant-design/icons/es/icons/MoreOutlined";import"@dimjs/lang/cjs/is-undefined";import"@dimjs/lang/cjs/is-plain-object";import"@dimjs/lang/cjs/is-string";import"@dimjs/lang/cjs/is-promise";import"@ant-design/icons/es/icons/LoadingOutlined";import"@dimjs/lang/cjs/is-array";import"@dimjs/utils/cjs/extend";import"@ant-design/icons/es/icons/RedoOutlined";import"@dimjs/model";import"@dimjs/model-react";import"@wove/react/cjs/create-ctx";import"@ant-design/icons/es/icons/CloseCircleOutlined";import"antd/es/locale/en_US";import"antd/es/locale/zh_CN";import"dayjs";import"dayjs/locale/en";import"dayjs/locale/zh-cn";import"dayjs/plugin/advancedFormat";import"dayjs/plugin/customParseFormat";import"dayjs/plugin/localeData";import"dayjs/plugin/utc";import"dayjs/plugin/weekday";import"dayjs/plugin/weekOfYear";import"dayjs/plugin/weekYear";import"./time-53b3f55f.js";import"react-dom/client";import"./context-1f2093c6.js";import"./dom-4d04aa64.js";import"@dimjs/lang/cjs/is-null";import"@dimjs/utils/cjs/array";import"@dnd-kit/core";import"@dnd-kit/sortable";import"@ant-design/icons/es/icons/DragOutlined";import"@dnd-kit/utilities";import"@dnd-kit/modifiers";import"@ant-design/icons/es/icons/SaveOutlined";import"@ant-design/icons/es/icons/ExclamationCircleFilled";import"@ant-design/icons/es/icons/DownOutlined";import"@ant-design/icons/es/icons/UpOutlined";import"react-is";import"./use-responsive-point-21b8c601.js";import"@ant-design/icons/es/icons/SettingOutlined";import"@ant-design/icons/es/icons/CloseOutlined";import"@ant-design/icons/es/icons/CheckOutlined";import"@ant-design/icons/es/icons/EditOutlined";import"./context-25d0b686.js";import"@ant-design/icons/es/icons/PlusOutlined";import"@dimjs/lang/cjs/is-boolean";import"@ant-design/icons/es/icons/DeleteOutlined";import"@wove/react/cjs/editor";import"@ant-design/icons/es/icons/QuestionCircleFilled";import"@dimjs/lang/cjs/is-deep-equal";import"@tinymce/tinymce-react";import"@ant-design/icons/es/icons/PlusCircleOutlined";import"@ant-design/icons/es/icons/FullscreenOutlined";import"@dimjs/utils/cjs/json";import"pubsub-js";import"react-split";import"@dimjs/lang/cjs/is-empty";import"@ant-design/icons/es/icons/QuestionCircleOutlined";import"dayjs/plugin/isSameOrAfter";import"dayjs/plugin/isSameOrBefore";import"@ant-design/icons/es/icons/CaretDownFilled";import"dequal";import"@dimjs/utils/cjs/tree";import"react-dom";
|
|
127
128
|
//# sourceMappingURL=index.js.map
|
|
@@ -6,5 +6,5 @@ import './../text-symbol-wrapper/index.css';
|
|
|
6
6
|
import './../tips-wrapper/index.css';
|
|
7
7
|
import './index.css';
|
|
8
8
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
9
|
-
import{hooks as e}from"@wove/react/cjs/hooks";import{classNames as r}from"@dimjs/utils/cjs/class-names";import{_ as l}from"../_rollupPluginBabelHelpers-a0769acd.js";import{useState as i,useMemo as t,Fragment as
|
|
9
|
+
import{hooks as e}from"@wove/react/cjs/hooks";import{classNames as r}from"@dimjs/utils/cjs/class-names";import{_ as l}from"../_rollupPluginBabelHelpers-a0769acd.js";import{useState as i,useMemo as t,Fragment as a}from"react";import{arrayTotal as s,isUndefinedOrNull as n}from"@flatbiz/utils";import{BoxGrid as o}from"../box-grid/index.js";import{fbaHooks as u}from"../fba-hooks/index.js";import{TextOverflow as p}from"../text-overflow/index.js";import{TextSymbolWrapper as m}from"../text-symbol-wrapper/index.js";import{TipsWrapper as d}from"../tips-wrapper/index.js";import{jsx as f,jsxs as v}from"react/jsx-runtime";import"@dimjs/lang/cjs/is-number";import"ahooks";import"@dimjs/lang/cjs/is-array";import"../use-responsive-point-21b8c601.js";import"antd";import"@dimjs/lang/cjs/is-string";import"@ant-design/icons/es/icons/QuestionCircleOutlined";var c=function e(r){var i=[];var t=0;var a=[];for(var n=0;n<r.length;n++){var o=r[n];var u=o.grid;var p=l({},o,{grid:u});if(t+u<=24&&u>0){t+=u;a.push(p)}else{i.push(a);t=u;a=[p]}}if(a.length>0){i.push(a)}if(i.length>0){i=i.map((function(e,r){if(e.length===1){e[0].grid=24}else{var l=s(e,"grid");var t=e[e.length-1];if(l<24){t.grid=24-l+t.grid}}if(r===i.length-1){return e.map((function(e){e.isLast=true;return e}))}return e}))}var m=[];i.forEach((function(e){m=m.concat(e)}));return m};var x=function s(x){var h=u.useResponsivePoint()||"";var g=i(),b=g[0],j=g[1];var y=x.column,w=x.forceColumn,k=x.labelAlign,B=x.labelWidth,N=x.options,C=x.border,P=x.width;var R=n(x.ellipsis)?true:x.ellipsis;var S=!C?h==="xs"||b==="xs":false;var T=t((function(){if(w){var e=24/w;return{xs:e,sm:e,md:e,lg:e,xl:e,xxl:e}}var r={1:{xs:24,sm:24,md:24,lg:24,xl:24,xxl:24},2:{xs:24,sm:12,md:12,lg:12,xl:12,xxl:12},3:{xs:24,sm:12,md:12,lg:8,xl:8,xxl:8},4:{xs:24,sm:12,md:12,lg:6,xl:6,xxl:6}};return!y?r[4]:r[y]}),[y,w]);var q=t((function(){if(!b)return undefined;var e=[];N.forEach((function(r){if(!r.hidden){var i=undefined;if(r.span){i=r.span*6;if(b==="xs"){i=24}else if(b==="sm"){i=i>12?i:12}}e.push(l({},r,{grid:i?i:T[b]}))}}));return c(e.filter(Boolean))}),[b,T,N]);var E=C?"":":";var L=function e(){return q==null?void 0:q.map((function(e,i){var t=n(e.ellipsis)?R:e.ellipsis;var s=S?undefined:B||100;var u=""+e.label+E;if(e.tips&&t){u=f(d,{tipType:"tooltip",tooltipProps:{title:e.tips},children:f(p,{text:u})})}else if(e.tips){u=f(d,{tipType:"tooltip",tooltipProps:{title:e.tips},children:u})}else if(t){u=f(p,{text:u})}return f(o.Col,l({},T,{span:e.grid,className:r("label-value-tr",{"label-value-last-tr":e.isLast}),children:!e.replenish?v(a,{children:[f("span",{className:"label-value-label",style:l({width:s},x.labelStyle),children:e.required?f(m,{text:u,symbolType:"required"}):u}),t?f("span",{className:"label-value-value",style:x.valueStyle,children:f(p,{text:e.value})}):f("span",{className:"label-value-value",style:l({wordBreak:"break-all"},x.valueStyle),children:e.value})]}):f(a,{})}),i)})).filter(Boolean)};var _=e.useCallbackRef((function(e){j(e)}));var z=t((function(){if(["xs","sm"].includes(h)||!P){return{}}return{width:P}}),[h]);var A=k||(C?"left":"right");return f(o.Row,{style:l({},z,x.style),className:r("label-value-render","label-value-render-"+A,{"label-value-render-border":C,"label-value-render-vertical":S},x.className),gutter:C?[0,0]:[30,0],onBoxBreakpointChange:_,children:L()})};export{x as LabelValueRender};
|
|
10
10
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/label-value-render/utils.ts","@flatbiz/antd/src/label-value-render/label-value.tsx"],"sourcesContent":["import { arrayTotal } from '@flatbiz/utils';\nimport { TLabelValueRenderItem } from './types';\n\nexport const getRenderGrid = (dataList: TLabelValueRenderItem[]) => {\n let results: TLabelValueRenderItem[][] = [];\n\n let currentSum = 0;\n let currentArr: TLabelValueRenderItem[] = [];\n for (let i = 0; i < dataList.length; i++) {\n const item = dataList[i];\n const grid = item.grid as number;\n const temp = {\n ...item,\n grid: grid,\n } as TLabelValueRenderItem;\n if (currentSum + grid <= 24 && grid > 0) {\n currentSum += grid;\n currentArr.push(temp);\n } else {\n results.push(currentArr);\n currentSum = grid;\n currentArr = [temp];\n }\n }\n\n if (currentArr.length > 0) {\n results.push(currentArr);\n }\n if (results.length > 0) {\n results = results.map((item, index) => {\n if (item.length === 1) {\n item[0].grid = 24;\n } else {\n const total = arrayTotal(item, 'grid');\n const lastItem = item[item.length - 1];\n if (total < 24) {\n lastItem.grid = 24 - total + lastItem.grid;\n }\n }\n if (index === results.length - 1) {\n return item.map((temp) => {\n temp.isLast = true;\n return temp;\n });\n }\n return item;\n });\n }\n\n let resultsFt: TLabelValueRenderItem[] = [];\n results.forEach((item) => {\n resultsFt = resultsFt.concat(item);\n });\n console.log('resultsFt', resultsFt);\n return resultsFt;\n};\n","import { CSSProperties, Fragment, ReactElement, useMemo, useState } from 'react';\n\nimport { classNames } from '@dimjs/utils';\nimport { isUndefinedOrNull } from '@flatbiz/utils';\nimport { hooks } from '@wove/react';\nimport { BoxGrid } from '../box-grid';\nimport { TBoxBreakpoint } from '../box-grid/type';\nimport { fbaHooks } from '../fba-hooks';\nimport { TextOverflow } from '../text-overflow';\nimport { TextSymbolWrapper } from '../text-symbol-wrapper';\nimport { TipsWrapper } from '../tips-wrapper';\nimport './style.less';\nimport { TLabelValueItem, TLabelValueRenderItem } from './types';\nimport { getRenderGrid } from './utils';\n\nexport type LabelValueRenderProps = {\n className?: string;\n style?: CSSProperties;\n /**\n * 定义一行显示几列, 默认值:4\n * ```\n * 1. 当外层宽度尺寸大于 992px(lg) 时,一行显示几列\n * 1. 当外层宽度尺寸小于992px(lg),为xs、sm、md情况下不受column值影响,响应式布局\n * 2. 宽度尺寸定义\n * xs: 宽度 < 576px\n * sm: 宽度 ≥ 576px\n * md: 宽度 ≥ 768px\n * lg: 宽度 ≥ 992px\n * xl: 宽度 ≥ 1200px\n * xxl: 宽度 ≥ 1600px\n * 3. 列数尺寸定义\n * {\n * 1: { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 },\n * 2: { xs: 24, sm: 12, md: 12, lg: 12, xl: 12, xxl: 12 },\n * 3: { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 8 },\n * 4: { xs: 24, sm: 12, md: 12, lg: 6, xl: 6, xxl: 6 },\n * };\n * ```\n */\n column?: 1 | 2 | 3 | 4;\n /**\n * 强制定义一行显示几列,不考虑响应式\n * ```\n * 1. 优先级大于column\n * 2. 建议优先使用column配置\n * ```\n */\n forceColumn?: 1 | 2 | 3 | 4;\n /** 数据源配置 */\n options: TLabelValueItem[];\n /**\n * 超过宽度将自动省略,默认值:true\n */\n ellipsis?: boolean;\n /** 是否添加边框 */\n border?: boolean;\n /** label对齐方式 */\n labelAlign?: 'left' | 'right' | 'center';\n /** label 宽度,默认值:100 */\n labelWidth?: number;\n width?: number;\n /** label 样式 */\n labelStyle?: CSSProperties;\n /** value 样式 */\n valueStyle?: CSSProperties;\n};\n\n/**\n * label+value 列表布局\n * ```\n * 1. 可设置超出隐藏、必填标识、设置隐藏、添加说明标签等功能\n * 2. 可自定义设置占用网格列数\n * 3. 内置响应式布局\n * ```\n */\nexport const LabelValueRender = (props: LabelValueRenderProps) => {\n const screenType = fbaHooks.useResponsivePoint() || '';\n const [breakpoint, setBreakpoint] = useState<TBoxBreakpoint>();\n\n const { column, forceColumn, labelAlign, labelWidth, options, border, width } = props;\n\n const ellipsis = isUndefinedOrNull(props.ellipsis) ? true : props.ellipsis;\n\n const isVertical = !border ? screenType === 'xs' || breakpoint === 'xs' : false;\n\n const gridSize = useMemo(() => {\n if (forceColumn) {\n const num = 24 / forceColumn;\n return { xs: num, sm: num, md: num, lg: num, xl: num, xxl: num };\n }\n const columnMap = {\n 1: { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 },\n 2: { xs: 24, sm: 12, md: 12, lg: 12, xl: 12, xxl: 12 },\n 3: { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 8 },\n 4: { xs: 24, sm: 12, md: 12, lg: 6, xl: 6, xxl: 6 },\n };\n return !column ? columnMap[4] : columnMap[column];\n }, [column, forceColumn]);\n\n const renderList = useMemo(() => {\n if (!breakpoint) return undefined;\n const dataListNew: TLabelValueRenderItem[] = [];\n options.forEach((item) => {\n if (!item.hidden) {\n let grid: number | undefined = undefined;\n if (item.span) {\n grid = item.span * 6;\n if (breakpoint === 'xs') {\n grid = 24;\n } else if (breakpoint === 'sm') {\n grid = grid > 12 ? grid : 12;\n }\n }\n dataListNew.push({\n ...item,\n grid: grid ? grid : gridSize[breakpoint],\n });\n }\n });\n return getRenderGrid(dataListNew.filter(Boolean));\n }, [breakpoint, gridSize, options]);\n\n const colon = border ? '' : ':';\n\n const getFormRowChildren = () => {\n return renderList\n ?.map((item, index) => {\n const ellipsisFt = isUndefinedOrNull(item.ellipsis) ? ellipsis : item.ellipsis;\n\n const width = isVertical ? undefined : labelWidth || 100;\n\n let labelContent: ReactElement | string = `${item.label}${colon}`;\n\n if (item.tips && ellipsisFt) {\n labelContent = (\n <TipsWrapper tipType=\"tooltip\" tooltipProps={{ title: item.tips }}>\n <TextOverflow text={labelContent as unknown as string} />\n </TipsWrapper>\n );\n } else if (item.tips) {\n labelContent = (\n <TipsWrapper tipType=\"tooltip\" tooltipProps={{ title: item.tips }}>\n {labelContent}\n </TipsWrapper>\n );\n } else if (ellipsisFt) {\n labelContent = <TextOverflow text={labelContent as unknown as string} />;\n }\n\n return (\n <BoxGrid.Col\n key={index}\n {...gridSize}\n span={item.grid}\n className={classNames('label-value-tr', { 'label-value-last-tr': item.isLast })}\n >\n {!item.replenish ? (\n <Fragment>\n <span className=\"label-value-label\" style={{ width, ...props.labelStyle }}>\n {item.required ? (\n <TextSymbolWrapper text={labelContent} symbolType=\"required\" />\n ) : (\n labelContent\n )}\n </span>\n {ellipsisFt ? (\n <span className=\"label-value-value\" style={props.valueStyle}>\n <TextOverflow text={item.value as string} />\n </span>\n ) : (\n <span\n className=\"label-value-value\"\n style={{\n wordBreak: 'break-all',\n ...props.valueStyle,\n }}\n >\n {item.value}\n </span>\n )}\n </Fragment>\n ) : (\n <Fragment />\n )}\n </BoxGrid.Col>\n );\n })\n .filter(Boolean);\n };\n\n const onBoxBreakpointChange = hooks.useCallbackRef((breakpoint: TBoxBreakpoint) => {\n setBreakpoint(breakpoint);\n });\n\n const innerStyle = useMemo(() => {\n /** 小屏幕不控制宽度 */\n if (['xs', 'sm'].includes(screenType) || !width) {\n return {};\n }\n return { width };\n }, [screenType]);\n\n const align = labelAlign || (border ? 'left' : 'right');\n\n return (\n <BoxGrid.Row\n style={{ ...innerStyle, ...props.style }}\n className={classNames(\n 'label-value-render',\n `label-value-render-${align}`,\n {\n 'label-value-render-border': border,\n 'label-value-render-vertical': isVertical,\n },\n props.className,\n )}\n gutter={border ? [0, 0] : [30, 0]}\n onBoxBreakpointChange={onBoxBreakpointChange}\n >\n {getFormRowChildren()}\n </BoxGrid.Row>\n );\n};\n"],"names":["getRenderGrid","dataList","results","currentSum","currentArr","i","length","item","grid","temp","_extends","push","map","index","total","arrayTotal","lastItem","isLast","resultsFt","forEach","concat","console","log","LabelValueRender","props","screenType","fbaHooks","useResponsivePoint","_useState","useState","breakpoint","setBreakpoint","column","forceColumn","labelAlign","labelWidth","options","border","width","ellipsis","isUndefinedOrNull","isVertical","gridSize","useMemo","num","xs","sm","md","lg","xl","xxl","columnMap","renderList","undefined","dataListNew","hidden","span","filter","Boolean","colon","getFormRowChildren","ellipsisFt","labelContent","label","tips","_jsx","TipsWrapper","tipType","tooltipProps","title","children","TextOverflow","text","BoxGrid","Col","className","_classNames","replenish","_jsxs","Fragment","style","labelStyle","required","TextSymbolWrapper","symbolType","valueStyle","value","wordBreak","onBoxBreakpointChange","_hooks","useCallbackRef","innerStyle","includes","align","Row","gutter"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/label-value-render/utils.ts","@flatbiz/antd/src/label-value-render/label-value.tsx"],"sourcesContent":["import { arrayTotal } from '@flatbiz/utils';\nimport { TLabelValueRenderItem } from './types';\n\nexport const getRenderGrid = (dataList: TLabelValueRenderItem[]) => {\n let results: TLabelValueRenderItem[][] = [];\n\n let currentSum = 0;\n let currentArr: TLabelValueRenderItem[] = [];\n for (let i = 0; i < dataList.length; i++) {\n const item = dataList[i];\n const grid = item.grid as number;\n const temp = {\n ...item,\n grid: grid,\n } as TLabelValueRenderItem;\n if (currentSum + grid <= 24 && grid > 0) {\n currentSum += grid;\n currentArr.push(temp);\n } else {\n results.push(currentArr);\n currentSum = grid;\n currentArr = [temp];\n }\n }\n\n if (currentArr.length > 0) {\n results.push(currentArr);\n }\n if (results.length > 0) {\n results = results.map((item, index) => {\n if (item.length === 1) {\n item[0].grid = 24;\n } else {\n const total = arrayTotal(item, 'grid');\n const lastItem = item[item.length - 1];\n if (total < 24) {\n lastItem.grid = 24 - total + lastItem.grid;\n }\n }\n if (index === results.length - 1) {\n return item.map((temp) => {\n temp.isLast = true;\n return temp;\n });\n }\n return item;\n });\n }\n\n let resultsFt: TLabelValueRenderItem[] = [];\n results.forEach((item) => {\n resultsFt = resultsFt.concat(item);\n });\n return resultsFt;\n};\n","import { CSSProperties, Fragment, ReactElement, useMemo, useState } from 'react';\n\nimport { classNames } from '@dimjs/utils';\nimport { isUndefinedOrNull } from '@flatbiz/utils';\nimport { hooks } from '@wove/react';\nimport { BoxGrid } from '../box-grid';\nimport { TBoxBreakpoint } from '../box-grid/type';\nimport { fbaHooks } from '../fba-hooks';\nimport { TextOverflow } from '../text-overflow';\nimport { TextSymbolWrapper } from '../text-symbol-wrapper';\nimport { TipsWrapper } from '../tips-wrapper';\nimport './style.less';\nimport { TLabelValueItem, TLabelValueRenderItem } from './types';\nimport { getRenderGrid } from './utils';\n\nexport type LabelValueRenderProps = {\n className?: string;\n style?: CSSProperties;\n /**\n * 定义一行显示几列, 默认值:4\n * ```\n * 1. 当外层宽度尺寸大于 992px(lg) 时,一行显示几列\n * 1. 当外层宽度尺寸小于992px(lg),为xs、sm、md情况下不受column值影响,响应式布局\n * 2. 宽度尺寸定义\n * xs: 宽度 < 576px\n * sm: 宽度 ≥ 576px\n * md: 宽度 ≥ 768px\n * lg: 宽度 ≥ 992px\n * xl: 宽度 ≥ 1200px\n * xxl: 宽度 ≥ 1600px\n * 3. 列数尺寸定义\n * {\n * 1: { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 },\n * 2: { xs: 24, sm: 12, md: 12, lg: 12, xl: 12, xxl: 12 },\n * 3: { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 8 },\n * 4: { xs: 24, sm: 12, md: 12, lg: 6, xl: 6, xxl: 6 },\n * };\n * ```\n */\n column?: 1 | 2 | 3 | 4;\n /**\n * 强制定义一行显示几列,不考虑响应式\n * ```\n * 1. 优先级大于column\n * 2. 建议优先使用column配置\n * ```\n */\n forceColumn?: 1 | 2 | 3 | 4;\n /** 数据源配置 */\n options: TLabelValueItem[];\n /**\n * 超过宽度将自动省略,默认值:true\n */\n ellipsis?: boolean;\n /** 是否添加边框 */\n border?: boolean;\n /** label对齐方式 */\n labelAlign?: 'left' | 'right' | 'center';\n /** label 宽度,默认值:100 */\n labelWidth?: number;\n width?: number;\n /** label 样式 */\n labelStyle?: CSSProperties;\n /** value 样式 */\n valueStyle?: CSSProperties;\n};\n\n/**\n * label+value 列表布局\n * ```\n * 1. 可设置超出隐藏、必填标识、设置隐藏、添加说明标签等功能\n * 2. 可自定义设置占用网格列数\n * 3. 内置响应式布局\n * ```\n */\nexport const LabelValueRender = (props: LabelValueRenderProps) => {\n const screenType = fbaHooks.useResponsivePoint() || '';\n const [breakpoint, setBreakpoint] = useState<TBoxBreakpoint>();\n\n const { column, forceColumn, labelAlign, labelWidth, options, border, width } = props;\n\n const ellipsis = isUndefinedOrNull(props.ellipsis) ? true : props.ellipsis;\n\n const isVertical = !border ? screenType === 'xs' || breakpoint === 'xs' : false;\n\n const gridSize = useMemo(() => {\n if (forceColumn) {\n const num = 24 / forceColumn;\n return { xs: num, sm: num, md: num, lg: num, xl: num, xxl: num };\n }\n const columnMap = {\n 1: { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 },\n 2: { xs: 24, sm: 12, md: 12, lg: 12, xl: 12, xxl: 12 },\n 3: { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 8 },\n 4: { xs: 24, sm: 12, md: 12, lg: 6, xl: 6, xxl: 6 },\n };\n return !column ? columnMap[4] : columnMap[column];\n }, [column, forceColumn]);\n\n const renderList = useMemo(() => {\n if (!breakpoint) return undefined;\n const dataListNew: TLabelValueRenderItem[] = [];\n options.forEach((item) => {\n if (!item.hidden) {\n let grid: number | undefined = undefined;\n if (item.span) {\n grid = item.span * 6;\n if (breakpoint === 'xs') {\n grid = 24;\n } else if (breakpoint === 'sm') {\n grid = grid > 12 ? grid : 12;\n }\n }\n dataListNew.push({\n ...item,\n grid: grid ? grid : gridSize[breakpoint],\n });\n }\n });\n return getRenderGrid(dataListNew.filter(Boolean));\n }, [breakpoint, gridSize, options]);\n\n const colon = border ? '' : ':';\n\n const getFormRowChildren = () => {\n return renderList\n ?.map((item, index) => {\n const ellipsisFt = isUndefinedOrNull(item.ellipsis) ? ellipsis : item.ellipsis;\n\n const width = isVertical ? undefined : labelWidth || 100;\n\n let labelContent: ReactElement | string = `${item.label}${colon}`;\n\n if (item.tips && ellipsisFt) {\n labelContent = (\n <TipsWrapper tipType=\"tooltip\" tooltipProps={{ title: item.tips }}>\n <TextOverflow text={labelContent as unknown as string} />\n </TipsWrapper>\n );\n } else if (item.tips) {\n labelContent = (\n <TipsWrapper tipType=\"tooltip\" tooltipProps={{ title: item.tips }}>\n {labelContent}\n </TipsWrapper>\n );\n } else if (ellipsisFt) {\n labelContent = <TextOverflow text={labelContent as unknown as string} />;\n }\n\n return (\n <BoxGrid.Col\n key={index}\n {...gridSize}\n span={item.grid}\n className={classNames('label-value-tr', { 'label-value-last-tr': item.isLast })}\n >\n {!item.replenish ? (\n <Fragment>\n <span className=\"label-value-label\" style={{ width, ...props.labelStyle }}>\n {item.required ? (\n <TextSymbolWrapper text={labelContent} symbolType=\"required\" />\n ) : (\n labelContent\n )}\n </span>\n {ellipsisFt ? (\n <span className=\"label-value-value\" style={props.valueStyle}>\n <TextOverflow text={item.value as string} />\n </span>\n ) : (\n <span\n className=\"label-value-value\"\n style={{\n wordBreak: 'break-all',\n ...props.valueStyle,\n }}\n >\n {item.value}\n </span>\n )}\n </Fragment>\n ) : (\n <Fragment />\n )}\n </BoxGrid.Col>\n );\n })\n .filter(Boolean);\n };\n\n const onBoxBreakpointChange = hooks.useCallbackRef((breakpoint: TBoxBreakpoint) => {\n setBreakpoint(breakpoint);\n });\n\n const innerStyle = useMemo(() => {\n /** 小屏幕不控制宽度 */\n if (['xs', 'sm'].includes(screenType) || !width) {\n return {};\n }\n return { width };\n }, [screenType]);\n\n const align = labelAlign || (border ? 'left' : 'right');\n\n return (\n <BoxGrid.Row\n style={{ ...innerStyle, ...props.style }}\n className={classNames(\n 'label-value-render',\n `label-value-render-${align}`,\n {\n 'label-value-render-border': border,\n 'label-value-render-vertical': isVertical,\n },\n props.className,\n )}\n gutter={border ? [0, 0] : [30, 0]}\n onBoxBreakpointChange={onBoxBreakpointChange}\n >\n {getFormRowChildren()}\n </BoxGrid.Row>\n );\n};\n"],"names":["getRenderGrid","dataList","results","currentSum","currentArr","i","length","item","grid","temp","_extends","push","map","index","total","arrayTotal","lastItem","isLast","resultsFt","forEach","concat","LabelValueRender","props","screenType","fbaHooks","useResponsivePoint","_useState","useState","breakpoint","setBreakpoint","column","forceColumn","labelAlign","labelWidth","options","border","width","ellipsis","isUndefinedOrNull","isVertical","gridSize","useMemo","num","xs","sm","md","lg","xl","xxl","columnMap","renderList","undefined","dataListNew","hidden","span","filter","Boolean","colon","getFormRowChildren","ellipsisFt","labelContent","label","tips","_jsx","TipsWrapper","tipType","tooltipProps","title","children","TextOverflow","text","BoxGrid","Col","className","_classNames","replenish","_jsxs","Fragment","style","labelStyle","required","TextSymbolWrapper","symbolType","valueStyle","value","wordBreak","onBoxBreakpointChange","_hooks","useCallbackRef","innerStyle","includes","align","Row","gutter"],"mappings":"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"}
|
|
@@ -2,5 +2,5 @@
|
|
|
2
2
|
import './../fba-hooks/index.css';
|
|
3
3
|
import './index.css';
|
|
4
4
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
5
|
-
import{a as r,_ as e}from"../_rollupPluginBabelHelpers-a0769acd.js";import{hooks as n}from"@wove/react/cjs/hooks";import{Flex as o,Button as t}from"antd";import{useRef as a,useMemo as i}from"react";import{MentionsWrapper as l}from"../mentions-wrapper/index.js";import{jsxs as u,jsx as c}from"react/jsx-runtime";import"@flatbiz/utils";import"ahooks";import"../fba-hooks/index.js";import"@dimjs/lang/cjs/is-array";import"../use-responsive-point-21b8c601.js";var p=["prefix","operations"];var s=function s(v){var f=a({});var m=a();var d=a(0);var h=v.prefix,g=v.operations,x=g===void 0?[]:g,C=r(v,p);var j=function r(e){var n=v.value||"";var o=(B==null?void 0:B.selectionStart)||d.current;var t=(e.codeAdapter==null?void 0:e.codeAdapter())||""+e.codePrefix+k(e.codePrefix);var a=t.length+((h==null?void 0:h.length)||0)+2;if(n){n=n.slice(0,o)+y(t)+n.slice(o)}else{n=y(t)}v.onChange==null?void 0:v.onChange(n);if(v.onSelectParam){v.onSelectParam({code:t,type:e.type,value:undefined},h)}d.current+=a};var b=function r(e){var n;d.current=((n=v.value)==null?void 0:n.length)||0;if(v.onBlur){v.onBlur(e)}};var y=n.useCallbackRef((function(r){return(h||"")+"{"+r+"}"}));var k=n.useCallbackRef((function(r){var e=f.current;if(e[r]>=0){e[r]+=1}else{e[r]=0}return e[r]}));var B=i((function(){return m.current?m.current.getInputInstance():null}),[m.current]);var P=i((function(){var r=(v.params||[]).map((function(r){return y(r.code)}));var e=new Set(r);return Array.from(e)}),[v.params]);return u("div",{children:[x&&x.length>0&&c(o,{gap:4,style:{marginBottom:8},children:x.map((function(r){return c(t,{type:"text",icon:r.icon,onClick:function e(){return j(r)},children:r.label&&c("span",{children:r.label})},r.type)}))}),c(l,e({},C,{ref:m,prefix:h,options:P,value:v.value,onBlur:b,onChange:v.onChange,onCursorChange:function r(e){d.current=e}}))]})};export{s as
|
|
5
|
+
import{a as r,_ as e}from"../_rollupPluginBabelHelpers-a0769acd.js";import{hooks as n}from"@wove/react/cjs/hooks";import{Flex as o,Button as t}from"antd";import{useRef as a,useMemo as i}from"react";import{MentionsWrapper as l}from"../mentions-wrapper/index.js";import{jsxs as u,jsx as c}from"react/jsx-runtime";import"@flatbiz/utils";import"ahooks";import"../fba-hooks/index.js";import"@dimjs/lang/cjs/is-array";import"../use-responsive-point-21b8c601.js";var p=["prefix","operations"];var s=function s(v){var f=a({});var m=a();var d=a(0);var h=v.prefix,g=v.operations,x=g===void 0?[]:g,C=r(v,p);var j=function r(e){var n=v.value||"";var o=(B==null?void 0:B.selectionStart)||d.current;var t=(e.codeAdapter==null?void 0:e.codeAdapter())||""+e.codePrefix+k(e.codePrefix);var a=t.length+((h==null?void 0:h.length)||0)+2;if(n){n=n.slice(0,o)+y(t)+n.slice(o)}else{n=y(t)}v.onChange==null?void 0:v.onChange(n);if(v.onSelectParam){v.onSelectParam({code:t,type:e.type,value:undefined},h)}d.current+=a};var b=function r(e){var n;d.current=((n=v.value)==null?void 0:n.length)||0;if(v.onBlur){v.onBlur(e)}};var y=n.useCallbackRef((function(r){return(h||"")+"{"+r+"}"}));var k=n.useCallbackRef((function(r){var e=f.current;if(e[r]>=0){e[r]+=1}else{e[r]=0}return e[r]}));var B=i((function(){return m.current?m.current.getInputInstance():null}),[m.current]);var P=i((function(){var r=(v.params||[]).map((function(r){return y(r.code)}));var e=new Set(r);return Array.from(e)}),[v.params]);return u("div",{children:[x&&x.length>0&&c(o,{gap:4,style:{marginBottom:8},children:x.map((function(r){return c(t,{type:"text",icon:r.icon,onClick:function e(){return j(r)},children:r.label&&c("span",{children:r.label})},r.type)}))}),c(l,e({},C,{ref:m,prefix:h,options:P,value:v.value,onBlur:b,onChange:v.onChange,onCursorChange:function r(e){d.current=e}}))]})};export{s as MentionEditor};
|
|
6
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/mention-editor/
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/mention-editor/mention-editor.tsx"],"sourcesContent":["import { type TAny } from '@flatbiz/utils';\nimport { hooks } from '@wove/react';\nimport { Button, Flex } from 'antd';\nimport { useMemo, useRef, type ReactElement } from 'react';\nimport { MentionsWrapper, type MentionsWrapperProps } from '../mentions-wrapper/mentions';\nimport { type ParamItem } from './types';\n\nexport type OperationPresetProps = {\n /** icon */\n icon: ReactElement;\n /** 模版参数文案 */\n label?: string;\n /** 模版参数类型 */\n type: string;\n /** 自增code前缀 */\n codePrefix: string;\n /** 自定义生成模版参数code */\n codeAdapter?: () => string | undefined;\n};\n\nexport type MentionEditorProps = Omit<MentionsWrapperProps, 'prefix'> & {\n /**\n * onChange\n * @item 点击的预设模版参数\n */\n onSelectParam?: (item: ParamItem, prefix?: string) => void;\n /** 模版参数前缀 & | $ */\n prefix?: string;\n /** editor 支持添加的模版参数类型 */\n operations?: OperationPresetProps[];\n /** 模版参数列表 */\n params?: ParamItem[] | undefined;\n};\n\n/**\n * 基于MentionWrapper封装的模版字符串配置组件\n * 1. 提供变量,数字,链接等可选的模版参数\n * 2. 不同类型模版参数可配置多个\n * 3. mention 会根据 传入的params自动推断出关键字\n * 4. 模版参数建议都以${_xxx}为格式\n * 5. Demo: https://fex.qa.tcshuke.com/docs/admin/main/widget?key=mention-editor\n */\nexport const MentionEditor = (props: MentionEditorProps) => {\n const iMap = useRef<Record<string, number>>({});\n const mentionRef = useRef<TAny>();\n const curPosition = useRef<number>(0);\n\n const { prefix, operations = [], ...otherProps } = props;\n\n const onAddParam = (opt: OperationPresetProps) => {\n let content = props.value || '';\n const position = inputInstance?.selectionStart || curPosition.current;\n const param = opt.codeAdapter?.() || `${opt.codePrefix}${getIndex(opt.codePrefix)}`;\n const addPos = param.length + (prefix?.length || 0) + 2;\n if (content) {\n content = content.slice(0, position) + getOptionCode(param) + content.slice(position);\n } else {\n content = getOptionCode(param);\n }\n props.onChange?.(content);\n if (props.onSelectParam) {\n props.onSelectParam(\n {\n code: param,\n type: opt.type as any,\n value: undefined,\n },\n prefix,\n );\n }\n curPosition.current += addPos;\n };\n\n const onInputBlur = (e) => {\n curPosition.current = props.value?.length || 0;\n if (props.onBlur) {\n props.onBlur(e);\n }\n };\n\n const getOptionCode = hooks.useCallbackRef((code: string) => {\n return (prefix || '') + '{' + code + '}';\n });\n\n const getIndex = hooks.useCallbackRef((code) => {\n const indexMap = iMap.current;\n if (indexMap[code] >= 0) {\n indexMap[code] += 1;\n } else {\n indexMap[code] = 0;\n }\n return indexMap[code];\n });\n\n const inputInstance = useMemo(() => {\n return mentionRef.current ? mentionRef.current.getInputInstance() : null;\n }, [mentionRef.current]);\n\n const options = useMemo(() => {\n const options = (props.params || []).map((item) => getOptionCode(item.code));\n const optionSet = new Set(options);\n return Array.from(optionSet);\n }, [props.params]);\n\n return (\n <div>\n {operations && operations.length > 0 && (\n <Flex gap={4} style={{ marginBottom: 8 }}>\n {operations.map((operation) => {\n return (\n <Button\n key={operation.type}\n type=\"text\"\n icon={operation.icon}\n onClick={() => onAddParam(operation)}\n >\n {operation.label && <span>{operation.label}</span>}\n </Button>\n );\n })}\n </Flex>\n )}\n <MentionsWrapper\n {...otherProps}\n ref={mentionRef}\n prefix={prefix}\n options={options}\n value={props.value}\n onBlur={onInputBlur}\n onChange={props.onChange}\n onCursorChange={(position) => {\n curPosition.current = position;\n }}\n />\n </div>\n );\n};\n"],"names":["MentionEditor","props","iMap","useRef","mentionRef","curPosition","prefix","_props$operations","operations","otherProps","_objectWithoutPropertiesLoose","_excluded","onAddParam","opt","content","value","position","inputInstance","selectionStart","current","param","codeAdapter","codePrefix","getIndex","addPos","length","slice","getOptionCode","onChange","onSelectParam","code","type","undefined","onInputBlur","e","_props$value","onBlur","_hooks","useCallbackRef","indexMap","useMemo","getInputInstance","options","params","map","item","optionSet","Set","Array","from","_jsxs","children","_jsx","Flex","gap","style","marginBottom","operation","Button","icon","onClick","label","MentionsWrapper","_extends","ref","onCursorChange"],"mappings":";0eA0CaA,EAAgB,SAAhBA,EAAiBC,GAC5B,IAAMC,EAAOC,EAA+B,CAAA,GAC5C,IAAMC,EAAaD,IACnB,IAAME,EAAcF,EAAe,GAEnC,IAAQG,EAA2CL,EAA3CK,OAAMC,EAAqCN,EAAnCO,WAAAA,EAAUD,SAAG,EAAA,GAAEA,EAAKE,EAAUC,EAAKT,EAAKU,GAExD,IAAMC,EAAa,SAAbA,EAAcC,GAClB,IAAIC,EAAUb,EAAMc,OAAS,GAC7B,IAAMC,GAAWC,GAAa,UAAA,EAAbA,EAAeC,iBAAkBb,EAAYc,QAC9D,IAAMC,GAAQP,EAAIQ,aAAW,UAAA,EAAfR,EAAIQ,gBAAsBR,GAAAA,EAAIS,WAAaC,EAASV,EAAIS,YACtE,IAAME,EAASJ,EAAMK,SAAUnB,GAAAA,UAAAA,EAAAA,EAAQmB,SAAU,GAAK,EACtD,GAAIX,EAAS,CACXA,EAAUA,EAAQY,MAAM,EAAGV,GAAYW,EAAcP,GAASN,EAAQY,MAAMV,EAC9E,KAAO,CACLF,EAAUa,EAAcP,EAC1B,CACAnB,EAAM2B,UAAN3B,UAAAA,EAAAA,EAAM2B,SAAWd,GACjB,GAAIb,EAAM4B,cAAe,CACvB5B,EAAM4B,cACJ,CACEC,KAAMV,EACNW,KAAMlB,EAAIkB,KACVhB,MAAOiB,WAET1B,EAEJ,CACAD,EAAYc,SAAWK,GAGzB,IAAMS,EAAc,SAAdA,EAAeC,GAAM,IAAAC,EACzB9B,EAAYc,UAAUgB,EAAAlC,EAAMc,QAANoB,UAAAA,EAAAA,EAAaV,SAAU,EAC7C,GAAIxB,EAAMmC,OAAQ,CAChBnC,EAAMmC,OAAOF,EACf,GAGF,IAAMP,EAAgBU,EAAMC,gBAAe,SAACR,GAC1C,OAAQxB,GAAU,IAAM,IAAMwB,EAAO,GACvC,IAEA,IAAMP,EAAWc,EAAMC,gBAAe,SAACR,GACrC,IAAMS,EAAWrC,EAAKiB,QACtB,GAAIoB,EAAST,IAAS,EAAG,CACvBS,EAAST,IAAS,CACpB,KAAO,CACLS,EAAST,GAAQ,CACnB,CACA,OAAOS,EAAST,EAClB,IAEA,IAAMb,EAAgBuB,GAAQ,WAC5B,OAAOpC,EAAWe,QAAUf,EAAWe,QAAQsB,mBAAqB,IACtE,GAAG,CAACrC,EAAWe,UAEf,IAAMuB,EAAUF,GAAQ,WACtB,IAAME,GAAWzC,EAAM0C,QAAU,IAAIC,KAAI,SAACC,GAAI,OAAKlB,EAAckB,EAAKf,SACtE,IAAMgB,EAAY,IAAIC,IAAIL,GAC1B,OAAOM,MAAMC,KAAKH,EACpB,GAAG,CAAC7C,EAAM0C,SAEV,OACEO,EAAA,MAAA,CAAAC,SAAA,CACG3C,GAAcA,EAAWiB,OAAS,GACjC2B,EAACC,EAAI,CAACC,IAAK,EAAGC,MAAO,CAAEC,aAAc,GAAIL,SACtC3C,EAAWoC,KAAI,SAACa,GACf,OACEL,EAACM,EAAM,CAEL3B,KAAK,OACL4B,KAAMF,EAAUE,KAChBC,QAAS,SAAAA,IAAA,OAAMhD,EAAW6C,EAAW,EAAAN,SAEpCM,EAAUI,OAAST,EAAA,OAAA,CAAAD,SAAOM,EAAUI,SALhCJ,EAAU1B,WAWzBqB,EAACU,EAAeC,KACVtD,EAAU,CACduD,IAAK5D,EACLE,OAAQA,EACRoC,QAASA,EACT3B,MAAOd,EAAMc,MACbqB,OAAQH,EACRL,SAAU3B,EAAM2B,SAChBqC,eAAgB,SAAAA,EAACjD,GACfX,EAAYc,QAAUH,CACxB,OAIR"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/mentions-wrapper/utils.ts","@flatbiz/antd/src/mentions-wrapper/mentions.tsx"],"sourcesContent":["import { type OverallKeyWordsPosition } from './types';\n\nexport const getOverallKeyWordsPosition = (params: { overallKeyWords: string[]; value?: string }) => {\n if (!params.value || !params.overallKeyWords.length) return [];\n const overallKeyWordsNew = Array.from(new Set(params.overallKeyWords || []));\n const positionItem: OverallKeyWordsPosition[][] = [];\n overallKeyWordsNew.forEach((item) => {\n if (!params.value?.includes(item)) return;\n const newItem = item\n .replace(/\\$/g, '\\\\$')\n .replace(/\\{/g, '\\\\{')\n .replace(/\\}/g, '\\\\}')\n .replace(/\\]/g, '\\\\]')\n .replace(/\\[/g, '\\\\[');\n const regex = new RegExp(newItem, 'g');\n const positions: number[] = [];\n let match;\n // console.log\n while ((match = regex.exec(params.value)) !== null) {\n positions.push(match.index as number);\n }\n const innerList: OverallKeyWordsPosition[] = [];\n positions.forEach((temp) => {\n innerList.push({ start: temp + 1, end: temp + item.length });\n });\n positionItem.push(innerList);\n });\n return positionItem;\n};\n\n/**\n * 判断光标是否处在关键词位置内\n */\nexport const judgmentCursorInKeyWordsPosition = (params: {\n keyWordsPosition: OverallKeyWordsPosition[][];\n cursorPosition: number;\n}) => {\n for (let index = 0; index < params.keyWordsPosition.length; index++) {\n const element = params.keyWordsPosition[index].find((temp) => {\n return params.cursorPosition >= temp.start && params.cursorPosition < temp.end;\n });\n if (element) return element;\n }\n return undefined;\n};\n","import { toArray, type TAny } from '@flatbiz/utils';\nimport { hooks } from '@wove/react';\nimport { useEventListener } from 'ahooks';\nimport { Mentions, type MentionProps } from 'antd';\nimport { forwardRef, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { fbaHooks } from '../fba-hooks';\nimport { getOverallKeyWordsPosition, judgmentCursorInKeyWordsPosition } from './utils';\n\nexport type MentionsWrapperRef = {\n getInputInstance: () => any;\n};\nexport type MentionsWrapperProps = Omit<\n MentionProps,\n | 'value'\n | 'onChange'\n | 'onClick'\n | 'onCursorChange'\n | 'options'\n | 'id'\n | 'split'\n | 'validateSearch'\n | 'ref'\n | 'prefix'\n> & {\n value?: string;\n onChange?: (value?: string) => void;\n /** 设置列表提示关键字,例如:@、$等 */\n prefix?: string | string[];\n onClick?: (value?: string) => void;\n /** 光标移动回调 */\n onCursorChange?: (position: number) => void;\n /**\n * 输入框内整体关键词列表\n * ```\n * 整体关键词交互\n * 1. 光标可整体移动\n * 2. 光标不会存在关键词内部\n * 3. 删除时,整体删除\n * ```\n */\n options?: string[];\n};\n\n/**\n * 基于Antd Mentions进行二次封装,可实现输入内关键字整体控制,包括光标移动、关键词删除等\n * ```\n * 可实现\n * 1. 控制光标输入\n * 2. 可设置关键词,光标不会出现在关键词内部\n * 3. 可整体删除关键词\n *\n * 应用场景例如:\n * 1. 公式输入\n * (【xx金额1】+【xx金额2】)*2\n * <MentionsWrapper prefix=\"$\" options={['【xx金额1】', '【xx金额2】']}/>\n *\n * 2. 短信模板设置\n * 您的订单号为${订单号},订单交易时间为${订单时间}\n * <MentionsWrapper prefix=\"$\" options={['${订单号}', '${订单时间}']}/>\n *\n * demo:https://fex.qa.tcshuke.com/docs/admin/main/other/widget\n * ```\n *\n */\nexport const MentionsWrapper = forwardRef<MentionsWrapperRef, MentionsWrapperProps>(\n (props: MentionsWrapperProps, ref) => {\n const { value, onChange, onClick, onCursorChange, onSelect, options, prefix, ...otherProps } = props;\n const id = hooks.useId(undefined, 'overall-input');\n const inputInnerRef = useRef<TAny>();\n const [cursorPosition, setCursorPosition] = useState(0);\n const invalidOnChangeRef = useRef(false);\n const valueNew = value || '';\n /** 关键词位置 */\n const overallKeyWordsPosition = useMemo(() => {\n if (options) {\n return getOverallKeyWordsPosition({\n overallKeyWords: options || [],\n value: valueNew,\n });\n }\n return [];\n }, [options, valueNew]);\n\n const getInputInstance = () => {\n return inputInnerRef.current?.textarea;\n };\n\n fbaHooks.useEffectCustom(() => {\n onCursorChange?.(cursorPosition || 0);\n }, [cursorPosition]);\n\n useEventListener(\n 'keydown',\n (ev) => {\n const selectionStart = getInputInstance()?.selectionStart as number;\n const selectionEnd = getInputInstance()?.selectionEnd as number;\n if (['ArrowLeft', 'ArrowRight'].includes(ev.code)) {\n let positionValue = 0;\n if (ev.code === 'ArrowLeft') {\n if (selectionStart - 1 < 0) return;\n positionValue = selectionStart - 1;\n setCursorPosition(positionValue);\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: positionValue,\n });\n if (targret) {\n getInputInstance()?.setSelectionRange(targret.start, targret.start);\n }\n } else if (ev.code === 'ArrowRight') {\n if (selectionStart + 1 > valueNew.length) return;\n positionValue = selectionStart + 1;\n setCursorPosition(positionValue);\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: positionValue,\n });\n if (targret) {\n getInputInstance()?.setSelectionRange(targret.end - 1, targret.end - 1);\n }\n }\n } else if (ev.code === 'Backspace') {\n /** 选中关键字/关键字+文字 的情况,直接删除 */\n if (selectionStart !== selectionEnd) {\n return;\n }\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: selectionStart - 1,\n });\n if (targret) {\n invalidOnChangeRef.current = true;\n const result = valueNew.substring(0, targret.start - 1) + valueNew.substring(targret.end);\n setTimeout(() => {\n getInputInstance()?.setSelectionRange(targret.start - 1, targret.start - 1);\n }, 50);\n if (!result) {\n invalidOnChangeRef.current = false;\n }\n onChange?.(result);\n }\n }\n },\n {\n target: () => {\n return document.querySelector(`#${id}`);\n },\n },\n );\n\n useEventListener(\n 'keyup',\n (ev) => {\n const selectionStart = getInputInstance()?.selectionStart || 0;\n if (['ArrowUp', 'ArrowDown'].includes(ev.code)) {\n setCursorPosition(selectionStart);\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: selectionStart,\n });\n if (targret) {\n if (selectionStart - targret.start < targret.end - selectionStart) {\n getInputInstance()?.setSelectionRange(targret.start - 1, targret.start - 1);\n } else {\n getInputInstance()?.setSelectionRange(targret.end, targret.end);\n }\n }\n }\n },\n {\n target: () => {\n return document.querySelector(`#${id}`);\n },\n },\n );\n\n const onInputChange = hooks.useCallbackRef((value) => {\n if (otherProps.disabled) return;\n if (invalidOnChangeRef.current) {\n invalidOnChangeRef.current = false;\n return;\n }\n const selectionStart = getInputInstance()?.selectionStart || 0;\n setCursorPosition(selectionStart);\n onChange?.(value);\n });\n\n const onInputClick = hooks.useCallbackRef((event) => {\n const selectionStart = getInputInstance()?.selectionStart || 0;\n setCursorPosition(selectionStart);\n onClick?.(event.target.value);\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: selectionStart,\n });\n if (targret) {\n if (selectionStart - targret.start < targret.end - selectionStart) {\n getInputInstance()?.setSelectionRange(targret.start - 1, targret.start - 1);\n } else {\n getInputInstance()?.setSelectionRange(targret.end, targret.end);\n }\n }\n });\n\n const onHandleSelect = (options, prefix) => {\n const addPos: number = options.value?.length || 0;\n setCursorPosition((prePos) => prePos + addPos);\n if (onSelect) {\n onSelect(options, prefix);\n }\n };\n\n const mentionOptions = useMemo(() => {\n const prefixList = toArray<string>(prefix);\n return (\n options?.map((item) => {\n let opValue = item;\n for (let index = 0; index < prefixList.length; index++) {\n const element = prefixList[index];\n if (opValue.startsWith(element)) {\n opValue = opValue.replace(element, '');\n break;\n }\n }\n return { label: opValue, value: opValue };\n }) || []\n );\n }, [options, prefix]);\n\n useImperativeHandle(ref, () => {\n return {\n getInputInstance,\n };\n });\n\n return (\n <Mentions\n notFoundContent={<div>暂无数据</div>}\n rows={3}\n {...otherProps}\n prefix={prefix}\n style={{ width: '100%', ...otherProps.style }}\n id={id}\n value={valueNew}\n ref={inputInnerRef}\n onSelect={onHandleSelect}\n onChange={onInputChange}\n onClick={onInputClick}\n split=\"\"\n validateSearch={(text: string) => {\n if (!mentionOptions.length) return false;\n const target = mentionOptions.find((item) => text.indexOf(item.value) >= 0);\n return target && text.length > target.value.length ? false : true;\n }}\n options={mentionOptions}\n />\n );\n },\n);\n"],"names":["getOverallKeyWordsPosition","params","value","overallKeyWords","length","overallKeyWordsNew","Array","from","Set","positionItem","forEach","item","_params$value","includes","newItem","replace","regex","RegExp","positions","match","exec","push","index","innerList","temp","start","end","judgmentCursorInKeyWordsPosition","keyWordsPosition","element","find","cursorPosition","undefined","MentionsWrapper","forwardRef","props","ref","onChange","onClick","onCursorChange","onSelect","options","prefix","otherProps","_objectWithoutPropertiesLoose","_excluded","id","_hooks","useId","inputInnerRef","useRef","_useState","useState","setCursorPosition","invalidOnChangeRef","valueNew","overallKeyWordsPosition","useMemo","getInputInstance","_inputInnerRef$curren","current","textarea","fbaHooks","useEffectCustom","useEventListener","ev","_getInputInstance","_getInputInstance2","selectionStart","selectionEnd","code","positionValue","targret","_getInputInstance3","setSelectionRange","_getInputInstance4","result","substring","setTimeout","_getInputInstance5","target","document","querySelector","_getInputInstance6","_getInputInstance7","_getInputInstance8","onInputChange","useCallbackRef","_getInputInstance9","disabled","onInputClick","event","_getInputInstance10","_getInputInstance11","_getInputInstance12","onHandleSelect","_options$value","addPos","prePos","mentionOptions","prefixList","toArray","map","opValue","startsWith","label","useImperativeHandle","_jsx","Mentions","_extends","notFoundContent","children","rows","style","width","split","validateSearch","text","indexOf"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/mentions-wrapper/utils.ts","@flatbiz/antd/src/mentions-wrapper/mentions.tsx"],"sourcesContent":["import { type OverallKeyWordsPosition } from './types';\n\nexport const getOverallKeyWordsPosition = (params: { overallKeyWords: string[]; value?: string }) => {\n if (!params.value || !params.overallKeyWords.length) return [];\n const overallKeyWordsNew = Array.from(new Set(params.overallKeyWords || []));\n const positionItem: OverallKeyWordsPosition[][] = [];\n overallKeyWordsNew.forEach((item) => {\n if (!params.value?.includes(item)) return;\n const newItem = item\n .replace(/\\$/g, '\\\\$')\n .replace(/\\{/g, '\\\\{')\n .replace(/\\}/g, '\\\\}')\n .replace(/\\]/g, '\\\\]')\n .replace(/\\[/g, '\\\\[');\n const regex = new RegExp(newItem, 'g');\n const positions: number[] = [];\n let match;\n while ((match = regex.exec(params.value)) !== null) {\n positions.push(match.index as number);\n }\n const innerList: OverallKeyWordsPosition[] = [];\n positions.forEach((temp) => {\n innerList.push({ start: temp + 1, end: temp + item.length });\n });\n positionItem.push(innerList);\n });\n return positionItem;\n};\n\n/**\n * 判断光标是否处在关键词位置内\n */\nexport const judgmentCursorInKeyWordsPosition = (params: {\n keyWordsPosition: OverallKeyWordsPosition[][];\n cursorPosition: number;\n}) => {\n for (let index = 0; index < params.keyWordsPosition.length; index++) {\n const element = params.keyWordsPosition[index].find((temp) => {\n return params.cursorPosition >= temp.start && params.cursorPosition < temp.end;\n });\n if (element) return element;\n }\n return undefined;\n};\n","import { toArray, type TAny } from '@flatbiz/utils';\nimport { hooks } from '@wove/react';\nimport { useEventListener } from 'ahooks';\nimport { Mentions, type MentionProps } from 'antd';\nimport { forwardRef, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { fbaHooks } from '../fba-hooks';\nimport { getOverallKeyWordsPosition, judgmentCursorInKeyWordsPosition } from './utils';\n\nexport type MentionsWrapperRef = {\n getInputInstance: () => any;\n};\nexport type MentionsWrapperProps = Omit<\n MentionProps,\n | 'value'\n | 'onChange'\n | 'onClick'\n | 'onCursorChange'\n | 'options'\n | 'id'\n | 'split'\n | 'validateSearch'\n | 'ref'\n | 'prefix'\n> & {\n value?: string;\n onChange?: (value?: string) => void;\n /** 设置列表提示关键字,例如:@、$等 */\n prefix?: string | string[];\n onClick?: (value?: string) => void;\n /** 光标移动回调 */\n onCursorChange?: (position: number) => void;\n /**\n * 输入框内整体关键词列表\n * ```\n * 整体关键词交互\n * 1. 光标可整体移动\n * 2. 光标不会存在关键词内部\n * 3. 删除时,整体删除\n * ```\n */\n options?: string[];\n};\n\n/**\n * 基于Antd Mentions进行二次封装,可实现输入内关键字整体控制,包括光标移动、关键词删除等\n * ```\n * 可实现\n * 1. 控制光标输入\n * 2. 可设置关键词,光标不会出现在关键词内部\n * 3. 可整体删除关键词\n *\n * 应用场景例如:\n * 1. 公式输入\n * (【xx金额1】+【xx金额2】)*2\n * <MentionsWrapper prefix=\"$\" options={['【xx金额1】', '【xx金额2】']}/>\n *\n * 2. 短信模板设置\n * 您的订单号为${订单号},订单交易时间为${订单时间}\n * <MentionsWrapper prefix=\"$\" options={['${订单号}', '${订单时间}']}/>\n *\n * demo:https://fex.qa.tcshuke.com/docs/admin/main/other/widget\n * ```\n *\n */\nexport const MentionsWrapper = forwardRef<MentionsWrapperRef, MentionsWrapperProps>(\n (props: MentionsWrapperProps, ref) => {\n const { value, onChange, onClick, onCursorChange, onSelect, options, prefix, ...otherProps } = props;\n const id = hooks.useId(undefined, 'overall-input');\n const inputInnerRef = useRef<TAny>();\n const [cursorPosition, setCursorPosition] = useState(0);\n const invalidOnChangeRef = useRef(false);\n const valueNew = value || '';\n /** 关键词位置 */\n const overallKeyWordsPosition = useMemo(() => {\n if (options) {\n return getOverallKeyWordsPosition({\n overallKeyWords: options || [],\n value: valueNew,\n });\n }\n return [];\n }, [options, valueNew]);\n\n const getInputInstance = () => {\n return inputInnerRef.current?.textarea;\n };\n\n fbaHooks.useEffectCustom(() => {\n onCursorChange?.(cursorPosition || 0);\n }, [cursorPosition]);\n\n useEventListener(\n 'keydown',\n (ev) => {\n const selectionStart = getInputInstance()?.selectionStart as number;\n const selectionEnd = getInputInstance()?.selectionEnd as number;\n if (['ArrowLeft', 'ArrowRight'].includes(ev.code)) {\n let positionValue = 0;\n if (ev.code === 'ArrowLeft') {\n if (selectionStart - 1 < 0) return;\n positionValue = selectionStart - 1;\n setCursorPosition(positionValue);\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: positionValue,\n });\n if (targret) {\n getInputInstance()?.setSelectionRange(targret.start, targret.start);\n }\n } else if (ev.code === 'ArrowRight') {\n if (selectionStart + 1 > valueNew.length) return;\n positionValue = selectionStart + 1;\n setCursorPosition(positionValue);\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: positionValue,\n });\n if (targret) {\n getInputInstance()?.setSelectionRange(targret.end - 1, targret.end - 1);\n }\n }\n } else if (ev.code === 'Backspace') {\n /** 选中关键字/关键字+文字 的情况,直接删除 */\n if (selectionStart !== selectionEnd) {\n return;\n }\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: selectionStart - 1,\n });\n if (targret) {\n invalidOnChangeRef.current = true;\n const result = valueNew.substring(0, targret.start - 1) + valueNew.substring(targret.end);\n setTimeout(() => {\n getInputInstance()?.setSelectionRange(targret.start - 1, targret.start - 1);\n }, 50);\n if (!result) {\n invalidOnChangeRef.current = false;\n }\n onChange?.(result);\n }\n }\n },\n {\n target: () => {\n return document.querySelector(`#${id}`);\n },\n },\n );\n\n useEventListener(\n 'keyup',\n (ev) => {\n const selectionStart = getInputInstance()?.selectionStart || 0;\n if (['ArrowUp', 'ArrowDown'].includes(ev.code)) {\n setCursorPosition(selectionStart);\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: selectionStart,\n });\n if (targret) {\n if (selectionStart - targret.start < targret.end - selectionStart) {\n getInputInstance()?.setSelectionRange(targret.start - 1, targret.start - 1);\n } else {\n getInputInstance()?.setSelectionRange(targret.end, targret.end);\n }\n }\n }\n },\n {\n target: () => {\n return document.querySelector(`#${id}`);\n },\n },\n );\n\n const onInputChange = hooks.useCallbackRef((value) => {\n if (otherProps.disabled) return;\n if (invalidOnChangeRef.current) {\n invalidOnChangeRef.current = false;\n return;\n }\n const selectionStart = getInputInstance()?.selectionStart || 0;\n setCursorPosition(selectionStart);\n onChange?.(value);\n });\n\n const onInputClick = hooks.useCallbackRef((event) => {\n const selectionStart = getInputInstance()?.selectionStart || 0;\n setCursorPosition(selectionStart);\n onClick?.(event.target.value);\n const targret = judgmentCursorInKeyWordsPosition({\n keyWordsPosition: overallKeyWordsPosition,\n cursorPosition: selectionStart,\n });\n if (targret) {\n if (selectionStart - targret.start < targret.end - selectionStart) {\n getInputInstance()?.setSelectionRange(targret.start - 1, targret.start - 1);\n } else {\n getInputInstance()?.setSelectionRange(targret.end, targret.end);\n }\n }\n });\n\n const onHandleSelect = (options, prefix) => {\n const addPos: number = options.value?.length || 0;\n setCursorPosition((prePos) => prePos + addPos);\n if (onSelect) {\n onSelect(options, prefix);\n }\n };\n\n const mentionOptions = useMemo(() => {\n const prefixList = toArray<string>(prefix);\n return (\n options?.map((item) => {\n let opValue = item;\n for (let index = 0; index < prefixList.length; index++) {\n const element = prefixList[index];\n if (opValue.startsWith(element)) {\n opValue = opValue.replace(element, '');\n break;\n }\n }\n return { label: opValue, value: opValue };\n }) || []\n );\n }, [options, prefix]);\n\n useImperativeHandle(ref, () => {\n return {\n getInputInstance,\n };\n });\n\n return (\n <Mentions\n notFoundContent={<div>暂无数据</div>}\n rows={3}\n {...otherProps}\n prefix={prefix}\n style={{ width: '100%', ...otherProps.style }}\n id={id}\n value={valueNew}\n ref={inputInnerRef}\n onSelect={onHandleSelect}\n onChange={onInputChange}\n onClick={onInputClick}\n split=\"\"\n validateSearch={(text: string) => {\n if (!mentionOptions.length) return false;\n const target = mentionOptions.find((item) => text.indexOf(item.value) >= 0);\n return target && text.length > target.value.length ? false : true;\n }}\n options={mentionOptions}\n />\n );\n },\n);\n"],"names":["getOverallKeyWordsPosition","params","value","overallKeyWords","length","overallKeyWordsNew","Array","from","Set","positionItem","forEach","item","_params$value","includes","newItem","replace","regex","RegExp","positions","match","exec","push","index","innerList","temp","start","end","judgmentCursorInKeyWordsPosition","keyWordsPosition","element","find","cursorPosition","undefined","MentionsWrapper","forwardRef","props","ref","onChange","onClick","onCursorChange","onSelect","options","prefix","otherProps","_objectWithoutPropertiesLoose","_excluded","id","_hooks","useId","inputInnerRef","useRef","_useState","useState","setCursorPosition","invalidOnChangeRef","valueNew","overallKeyWordsPosition","useMemo","getInputInstance","_inputInnerRef$curren","current","textarea","fbaHooks","useEffectCustom","useEventListener","ev","_getInputInstance","_getInputInstance2","selectionStart","selectionEnd","code","positionValue","targret","_getInputInstance3","setSelectionRange","_getInputInstance4","result","substring","setTimeout","_getInputInstance5","target","document","querySelector","_getInputInstance6","_getInputInstance7","_getInputInstance8","onInputChange","useCallbackRef","_getInputInstance9","disabled","onInputClick","event","_getInputInstance10","_getInputInstance11","_getInputInstance12","onHandleSelect","_options$value","addPos","prePos","mentionOptions","prefixList","toArray","map","opValue","startsWith","label","useImperativeHandle","_jsx","Mentions","_extends","notFoundContent","children","rows","style","width","split","validateSearch","text","indexOf"],"mappings":"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"}
|
package/esm/pdf/index.js
CHANGED
|
@@ -2,5 +2,5 @@
|
|
|
2
2
|
import './../fba-hooks/index.css';
|
|
3
3
|
import './index.css';
|
|
4
4
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
5
|
-
import{classNames as r}from"@dimjs/utils/cjs/class-names";import{Result as e,Spin as t}from"antd";import{useState as n}from"react";import{fbaHooks as o}from"../fba-hooks/index.js";import{createCtx as a}from"@wove/react/cjs/create-ctx";import{jsx as i,jsxs as s}from"react/jsx-runtime";import{_ as c}from"../_rollupPluginBabelHelpers-a0769acd.js";import{hooks as
|
|
5
|
+
import{classNames as r}from"@dimjs/utils/cjs/class-names";import{Result as e,Spin as t}from"antd";import{useState as n}from"react";import{fbaHooks as o}from"../fba-hooks/index.js";import{createCtx as a}from"@wove/react/cjs/create-ctx";import{jsx as i,jsxs as s}from"react/jsx-runtime";import{_ as c}from"../_rollupPluginBabelHelpers-a0769acd.js";import{hooks as l}from"@wove/react/cjs/hooks";import"@dimjs/lang/cjs/is-array";import"@flatbiz/utils";import"../use-responsive-point-21b8c601.js";var u=a(),d=u[0],m=u[1];var f=function a(s){var c=n(),l=c[0],u=c[1];var d=n(),f=d[0],v=d[1];o.useEffectCustomAsync((function(){return new Promise((function(r,e){var t,n,o,a;t=globalThis,n=t.pdfjsLib;n.GlobalWorkerOptions.workerSrc="//file.40017.cn/tcsk/react/pdf@3.2.146/pdf.worker.min.js";var i=function(){try{return r()}catch(r){return e(r)}};var c=function(r){try{console.error(r);s.onLoadError==null?void 0:s.onLoadError(r);v(r);return i()}catch(r){return e(r)}};try{o=n.getDocument(s.pdfUrl);return Promise.resolve(o.promise).then((function(r){try{a=r;u(a);s.onLoadSuccess==null?void 0:s.onLoadSuccess(a);return i()}catch(r){return c(r)}}),c)}catch(r){c(r)}}))}),[s.pdfUrl]);var p=function r(){return l};if(f){if(s.error){return typeof s.error==="function"?s.error(f):s.error}return i(e,{status:"error",title:"PDF加载异常",subTitle:f==null?void 0:f.message})}if(l){return i(m,{value:{getPdfInstance:p},children:i("div",{className:r("v-pdf-document",s.className),children:s.children})})}return i("div",{className:"v-pdf-document-init-loading",children:i(t,{})})};var v=function e(a){var u=d();var m=u.getPdfInstance();var f=l.useId(undefined,"v-pdf-page-"+a.pageNumber);var v=n(true),p=v[0],h=v[1];var g=m.numPages;o.useEffectCustom((function(){m.getPage(a.pageNumber).then((function(r){var e=a.scale||1;var t=r.getViewport({scale:e});var n=a.width;var o=document.getElementById(f);var i=o.getContext("2d");if(n&&!a.scale){var s=n/t.width;t=r.getViewport({scale:s})}var c=window.devicePixelRatio;c=c<=1?96/72:c;o.width=Math.floor(t.width*c);o.height=Math.floor(t.height*c);o.style.width=t.width+"px";o.style.height=t.height+"px";var l={transform:[c,0,0,c,0,0],canvasContext:i,viewport:t};var u=r.render(l);u.promise.then((function(){a.onRenderSuccess==null?void 0:a.onRenderSuccess({width:t.width,height:t.height,scale:e,pageNumber:a.pageNumber,page:r},m);h(false)})).catch((function(r){console.error(r==null?void 0:r.message);a.onRenderError==null?void 0:a.onRenderError(r,m);h(false)}))}))}),[m,a.scale,a.pageNumber]);var w=typeof a.gap==="undefined"?10:a.gap;var b=g!==a.pageNumber?{marginBottom:w}:{};return s("div",{className:r("v-pdf-page",a.className),style:c({},b,a.style),onClick:a.onClick,children:[i(t,{spinning:p,children:i("canvas",{id:f})}),a.children]})};var p={Document:f,Page:v};export{p as Pdf};
|
|
6
6
|
//# sourceMappingURL=index.js.map
|
package/esm/pdf/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/pdf/context.ts","@flatbiz/antd/src/pdf/document.tsx","@flatbiz/antd/src/pdf/page.tsx","@flatbiz/antd/src/pdf/index.ts"],"sourcesContent":["import { createCtx } from '@wove/react';\n\ntype CtxProps = {\n getPdfInstance: () => any;\n};\n\nexport const [getCtx, CtxProvider] = createCtx<CtxProps>();\n","import { classNames } from '@dimjs/utils';\nimport { Result, Spin } from 'antd';\nimport { ReactElement, ReactNode, useState } from 'react';\nimport { fbaHooks } from '../fba-hooks';\nimport { CtxProvider } from './context';\nimport './style.less';\n\ntype PdfProps = {\n pdfUrl: string;\n onLoadError?: (error: any) => void;\n onLoadSuccess?: (pdfInstance: any) => void;\n children: ReactNode;\n error?: ReactElement | ((error) => ReactElement);\n className?: string;\n};\n\nexport const PdfDocument = (props: PdfProps) => {\n const [pdfInstance, setPdfInstance] = useState<any>();\n const [errorInst, setErrorInst] = useState<any>();\n\n fbaHooks.useEffectCustomAsync(async () => {\n var { pdfjsLib } = globalThis as any;\n pdfjsLib.GlobalWorkerOptions.workerSrc = '//file.40017.cn/tcsk/react/pdf@3.2.146/pdf.worker.min.js';\n try {\n var loadingTask = pdfjsLib.getDocument(props.pdfUrl);\n const pdfInstance = await loadingTask.promise;\n setPdfInstance(pdfInstance);\n props.onLoadSuccess?.(pdfInstance);\n } catch (error: any) {\n console.error(error);\n props.onLoadError?.(error);\n setErrorInst(error);\n }\n }, [props.pdfUrl]);\n\n const getPdfInstance = () => {\n return pdfInstance;\n };\n\n if (errorInst) {\n if (props.error) {\n return typeof props.error === 'function' ? props.error(errorInst) : props.error;\n }\n return <Result status=\"error\" title=\"PDF加载异常\" subTitle={errorInst?.message}></Result>;\n }\n\n if (pdfInstance) {\n return (\n <CtxProvider value={{ getPdfInstance }}>\n <div className={classNames('v-pdf-document', props.className)}>{props.children}</div>\n </CtxProvider>\n );\n }\n\n return (\n <div className=\"v-pdf-document-init-loading\">\n <Spin />\n </div>\n );\n};\n","import { classNames } from '@dimjs/utils';\nimport { hooks } from '@wove/react';\nimport { Spin } from 'antd';\nimport { CSSProperties, ReactNode, useState } from 'react';\nimport { fbaHooks } from '../fba-hooks';\nimport { getCtx } from './context';\nimport './style.less';\n\ntype PdfProps = {\n onRenderSuccess?: (pageInstance: any, pdfInstance: any) => void;\n onRenderError?: (error: any, pdfInstance: any) => void;\n /** pdf page宽度,高度根据比例适配 */\n width?: number;\n /** 缩放比例,默认值:1,配置此参数后 width 属性失效,例如:1、0.6、0.8 */\n scale?: number;\n /** pdf页面上下之间的间隙,默认值10 */\n gap?: number;\n /** 页码 */\n pageNumber: number;\n children?: ReactNode;\n onClick?: (e) => void;\n className?: string;\n style?: CSSProperties;\n};\n\nexport const PdfPage = (props: PdfProps) => {\n const ctx = getCtx();\n const pdfInstance = ctx.getPdfInstance();\n const id = hooks.useId(undefined, `v-pdf-page-${props.pageNumber}`);\n const [spinning, setSpinning] = useState(true);\n\n const numPages = pdfInstance.numPages as number;\n\n fbaHooks.useEffectCustom(() => {\n pdfInstance.getPage(props.pageNumber).then(function (page) {\n const scale = props.scale || 1;\n let viewport = page.getViewport({ scale: scale });\n const customWidth = props.width;\n\n
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/pdf/context.ts","@flatbiz/antd/src/pdf/document.tsx","@flatbiz/antd/src/pdf/page.tsx","@flatbiz/antd/src/pdf/index.ts"],"sourcesContent":["import { createCtx } from '@wove/react';\n\ntype CtxProps = {\n getPdfInstance: () => any;\n};\n\nexport const [getCtx, CtxProvider] = createCtx<CtxProps>();\n","import { classNames } from '@dimjs/utils';\nimport { Result, Spin } from 'antd';\nimport { ReactElement, ReactNode, useState } from 'react';\nimport { fbaHooks } from '../fba-hooks';\nimport { CtxProvider } from './context';\nimport './style.less';\n\ntype PdfProps = {\n pdfUrl: string;\n onLoadError?: (error: any) => void;\n onLoadSuccess?: (pdfInstance: any) => void;\n children: ReactNode;\n error?: ReactElement | ((error) => ReactElement);\n className?: string;\n};\n\nexport const PdfDocument = (props: PdfProps) => {\n const [pdfInstance, setPdfInstance] = useState<any>();\n const [errorInst, setErrorInst] = useState<any>();\n\n fbaHooks.useEffectCustomAsync(async () => {\n var { pdfjsLib } = globalThis as any;\n pdfjsLib.GlobalWorkerOptions.workerSrc = '//file.40017.cn/tcsk/react/pdf@3.2.146/pdf.worker.min.js';\n try {\n var loadingTask = pdfjsLib.getDocument(props.pdfUrl);\n const pdfInstance = await loadingTask.promise;\n setPdfInstance(pdfInstance);\n props.onLoadSuccess?.(pdfInstance);\n } catch (error: any) {\n console.error(error);\n props.onLoadError?.(error);\n setErrorInst(error);\n }\n }, [props.pdfUrl]);\n\n const getPdfInstance = () => {\n return pdfInstance;\n };\n\n if (errorInst) {\n if (props.error) {\n return typeof props.error === 'function' ? props.error(errorInst) : props.error;\n }\n return <Result status=\"error\" title=\"PDF加载异常\" subTitle={errorInst?.message}></Result>;\n }\n\n if (pdfInstance) {\n return (\n <CtxProvider value={{ getPdfInstance }}>\n <div className={classNames('v-pdf-document', props.className)}>{props.children}</div>\n </CtxProvider>\n );\n }\n\n return (\n <div className=\"v-pdf-document-init-loading\">\n <Spin />\n </div>\n );\n};\n","import { classNames } from '@dimjs/utils';\nimport { hooks } from '@wove/react';\nimport { Spin } from 'antd';\nimport { CSSProperties, ReactNode, useState } from 'react';\nimport { fbaHooks } from '../fba-hooks';\nimport { getCtx } from './context';\nimport './style.less';\n\ntype PdfProps = {\n onRenderSuccess?: (pageInstance: any, pdfInstance: any) => void;\n onRenderError?: (error: any, pdfInstance: any) => void;\n /** pdf page宽度,高度根据比例适配 */\n width?: number;\n /** 缩放比例,默认值:1,配置此参数后 width 属性失效,例如:1、0.6、0.8 */\n scale?: number;\n /** pdf页面上下之间的间隙,默认值10 */\n gap?: number;\n /** 页码 */\n pageNumber: number;\n children?: ReactNode;\n onClick?: (e) => void;\n className?: string;\n style?: CSSProperties;\n};\n\nexport const PdfPage = (props: PdfProps) => {\n const ctx = getCtx();\n const pdfInstance = ctx.getPdfInstance();\n const id = hooks.useId(undefined, `v-pdf-page-${props.pageNumber}`);\n const [spinning, setSpinning] = useState(true);\n\n const numPages = pdfInstance.numPages as number;\n\n fbaHooks.useEffectCustom(() => {\n pdfInstance.getPage(props.pageNumber).then(function (page) {\n const scale = props.scale || 1;\n let viewport = page.getViewport({ scale: scale });\n const customWidth = props.width;\n\n const canvas = document.getElementById(id) as any;\n const context = canvas.getContext('2d');\n\n if (customWidth && !props.scale) {\n const ratio = customWidth / viewport.width;\n viewport = page.getViewport({ scale: ratio });\n }\n let cssUnits = window.devicePixelRatio;\n cssUnits = cssUnits <= 1 ? 96 / 72 : cssUnits;\n canvas.width = Math.floor(viewport.width * cssUnits);\n canvas.height = Math.floor(viewport.height * cssUnits);\n\n canvas.style.width = viewport.width + 'px';\n canvas.style.height = viewport.height + 'px';\n\n const renderContext = {\n transform: [cssUnits, 0, 0, cssUnits, 0, 0],\n canvasContext: context,\n viewport: viewport,\n };\n const renderTask = page.render(renderContext);\n renderTask.promise\n .then(function () {\n props.onRenderSuccess?.(\n {\n width: viewport.width,\n height: viewport.height,\n scale: scale,\n pageNumber: props.pageNumber,\n page,\n },\n pdfInstance,\n );\n setSpinning(false);\n })\n .catch((error: any) => {\n console.error(error?.message);\n props.onRenderError?.(error, pdfInstance);\n setSpinning(false);\n });\n });\n }, [pdfInstance, props.scale, props.pageNumber]);\n\n const gap = typeof props.gap === 'undefined' ? 10 : props.gap;\n\n const style = numPages !== props.pageNumber ? { marginBottom: gap } : {};\n\n return (\n <div\n className={classNames('v-pdf-page', props.className)}\n style={{\n ...style,\n ...props.style,\n }}\n onClick={props.onClick}\n >\n <Spin spinning={spinning}>\n <canvas id={id}></canvas>\n </Spin>\n {props.children}\n </div>\n );\n};\n","import { PdfDocument } from './document';\nimport { PdfPage } from './page';\n\n/**\n * pdf预览\n * ```\n * 使用方式:在cdn.ts中引入 '//file.40017.cn/tcsk/react/pdf@3.2.146/pdf.min.js'\n * Git: https://github.com/mozilla/pdfjs-dist/tree/master\n * Demo: https://fex.qa.tcshuke.com/docs/admin/main/file/pdf\n * Demo: https://fex.qa.tcshuke.com/docs/admin/main/file/pdf-seal\n * ```\n */\nexport const Pdf = {\n Document: PdfDocument,\n Page: PdfPage,\n};\n"],"names":["_createCtx","_createCtx2","getCtx","CtxProvider","PdfDocument","props","_useState","useState","pdfInstance","setPdfInstance","_useState2","errorInst","setErrorInst","fbaHooks","useEffectCustomAsync","Promise","$return","$error","_ref","pdfjsLib","loadingTask","_pdfInstance","globalThis","GlobalWorkerOptions","workerSrc","$Try_1_Post","$boundEx","$Try_1_Catch","error","console","onLoadError","getDocument","pdfUrl","resolve","promise","then","$await_2","onLoadSuccess","getPdfInstance","_jsx","Result","status","title","subTitle","message","value","children","className","_classNames","Spin","PdfPage","ctx","id","_hooks","useId","undefined","pageNumber","spinning","setSpinning","numPages","useEffectCustom","getPage","page","scale","viewport","getViewport","customWidth","width","canvas","document","getElementById","context","getContext","ratio","cssUnits","window","devicePixelRatio","Math","floor","height","style","renderContext","transform","canvasContext","renderTask","render","onRenderSuccess","catch","onRenderError","gap","marginBottom","_jsxs","_extends","onClick","Pdf","Document","Page"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.v-pdf-preview-document{display:flex;height:100%;overflow:hidden}.v-pdf-preview-navigation{background-color:#ececec;border-radius:5px;overflow-y:auto;text-align:center}.v-pdf-preview-content{background-color:#fff;flex:1;overflow-y:auto}.v-pdf-preview-navigation-page{border:2px solid transparent;border-radius:5px;cursor:pointer;overflow:hidden}.v-pdf-preview-navigation-active .v-pdf-preview-navigation-page{border:2px solid #1890ff;opacity:1}.v-pdf-preview-navigation-pagination{color:#858585;
|
|
1
|
+
.v-pdf-preview-document{display:flex;height:100%;overflow:hidden}.v-pdf-preview-navigation{background-color:#ececec;border-radius:5px;overflow-y:auto;text-align:center}.v-pdf-preview-content{background-color:#fff;flex:1;overflow-y:auto}.v-pdf-page.v-pdf-preview-navigation-page{border:2px solid transparent;border-radius:5px;cursor:pointer;overflow:hidden}.v-pdf-page.v-pdf-preview-navigation-page canvas{box-shadow:none}.v-pdf-preview-navigation-active .v-pdf-preview-navigation-page{border:2px solid #1890ff;opacity:1}.v-pdf-preview-navigation-active .v-pdf-preview-navigation-pagination{color:#000}.v-pdf-preview-navigation-pagination{color:#858585;padding-bottom:10px;padding-top:6px}.v-pdf-preview-navigation>.roll-location-in-view{align-items:center;display:flex;flex-direction:column;height:calc(100% - 10px);margin-top:10px}.v-pdf-page canvas{box-shadow:0 10px 10px 10px rgba(0,0,0,.03)}
|
package/esm/pdf-preview/index.js
CHANGED
|
@@ -4,5 +4,5 @@ import './../fba-hooks/index.css';
|
|
|
4
4
|
import './../roll-location-in-view/index.css';
|
|
5
5
|
import './index.css';
|
|
6
6
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
7
|
-
import{classNames as e}from"@dimjs/utils/cjs/class-names";import{hooks as
|
|
7
|
+
import{classNames as e}from"@dimjs/utils/cjs/class-names";import{hooks as i}from"@wove/react/cjs/hooks";import{generateIntArray as a}from"@flatbiz/utils";import{Result as r}from"antd";import{useState as n,useRef as t,useMemo as o}from"react";import{Pdf as c}from"../pdf/index.js";import{RollLocationInView as s}from"../roll-location-in-view/index.js";import{jsx as l,jsxs as v}from"react/jsx-runtime";import"../fba-hooks/index.js";import"../_rollupPluginBabelHelpers-a0769acd.js";import"@dimjs/lang/cjs/is-array";import"../use-responsive-point-21b8c601.js";import"@wove/react/cjs/create-ctx";import"ahooks";var d=function i(r){var n=typeof r.navigationWidth==="undefined"?200:r.navigationWidth;return l(s,{activeKey:""+r.activeNumber,behavior:"auto",style:{width:n},renderList:a(1,r.numPages+1).map((function(i){return{activeKey:""+i,render:v("div",{className:e("v-pdf-preview-navigation-content",{"v-pdf-preview-navigation-active":i===r.activeNumber}),children:[l(c.Page,{pageNumber:i,gap:0,scale:r.scale||.2,className:e("v-pdf-preview-navigation-page"),onClick:function e(){r.onChangeActiveNumber(i);var a=document.querySelector("#"+r.pdfContentNodeId);if(a){if(i===1){a.scrollTo(0,0)}else{var n=r.pdfPageListHeightScope[i-1][0];a.scrollTo(0,n)}}}}),v("div",{className:"v-pdf-preview-navigation-pagination",children:["- ",i," -"]})]},i)}}))})};var p=function s(p){var u=n(0),f=u[0],m=u[1];var g=t(null);var h=n(1),N=h[0],b=h[1];var j=n(0),w=j[0],P=j[1];var y=10;var x=i.useCallbackRef((function(e){m(e.numPages)}));var C=o((function(){if(!f)return[];var e=[];a(0,f).forEach((function(i){if(i===0){e.push([0,w])}else{var a=w*i+i*y;e.push([a,a+w])}}));return e}),[f,w]);var S=function e(i){var a;var r=i.target.scrollTop;var n=(a=g.current)==null?void 0:a.clientHeight;for(var t=0;t<C.length;t++){var o=C[t];if(o[1]-r>=n/2){b(t+1);break}}};var k=i.useId(undefined,"pdf-content-node");return v(c.Document,{pdfUrl:p.pdfUrl,onLoadSuccess:x,error:l(r,{status:"500",title:"PDF加载异常",subTitle:"PDF地址:"+p.pdfUrl}),className:e("v-pdf-preview-document",p.className),children:[!p.hiddenNavigation?l("div",{className:"v-pdf-preview-navigation",children:l(d,{numPages:f,activeNumber:N,onChangeActiveNumber:b,scale:p.navigationScale,navigationWidth:p.navigationWidth,pdfPageListHeightScope:C,pdfContentNodeId:k})}):null,l("div",{className:"v-pdf-preview-content",onScroll:S,ref:g,id:k,children:f>0?a(1,f+1).map((function(e){return l(c.Page,{pageNumber:e,scale:p.scale,gap:y,onRenderSuccess:function e(i){var a=Math.floor(i.height);P(a)},style:{display:"flex",justifyContent:"center"}},e)})):null})]})};export{p as PdfPreview};
|
|
8
8
|
//# sourceMappingURL=index.js.map
|