@lobehub/ui/es/Markdown/components/MarkdownTable/index.mjs.map

Lobe UI is an open-source UI component library for building AIGC web apps

{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/Markdown/components/MarkdownTable/index.tsx"],"sourcesContent":["'use client';\n\nimport { createStyles } from 'antd-style';\nimport { memo, useCallback, useRef } from 'react';\n\nimport CopyButton from '@/CopyButton';\n\nimport { hastTableToMarkdown } from './hastTableToMarkdown';\n\nconst useStyles = createStyles(({ css, token }) => ({\n  copyButton: css`\n    position: absolute;\n    z-index: 1;\n\n    /* Vertical center of the header row = top padding (0.75em) + half of\n       the text line-box (line-height * 0.5em). Pulling the button up by\n       50% of its own height with transform parks it on that exact line. */\n    inset-block-start: calc(0.75em + (var(--lobe-markdown-line-height) * 0.5em));\n    inset-inline-end: 0.5em;\n    transform: translateY(-50%);\n\n    opacity: 0;\n    background: ${token.colorBgContainer};\n    box-shadow: 0 0 0 1px ${token.colorBorderSecondary};\n\n    transition: opacity ${token.motionDurationMid} ${token.motionEaseInOut};\n  `,\n  wrapper: css`\n    position: relative;\n\n    display: block;\n\n    width: max-content;\n    max-width: 100%;\n    margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n\n    &:hover .table-copy-button,\n    &:focus-within .table-copy-button {\n      opacity: 1;\n    }\n\n    /* Hand spacing to the wrapper so the absolutely-positioned copy\n       button anchors against the visible table edge instead of empty\n       margin space. */\n    > table {\n      margin-block: 0;\n    }\n\n    /* Reserve room for the copy button so right-aligned header text\n       doesn't slide under it. */\n    > table thead th:last-child {\n      padding-inline-end: calc(1em + 32px);\n    }\n  `,\n}));\n\ninterface MarkdownTableProps {\n  children?: React.ReactNode;\n  node?: any;\n}\n\nconst MarkdownTable = memo<MarkdownTableProps>(({ node, children, ...rest }) => {\n  const { styles, cx } = useStyles();\n  const nodeRef = useRef(node);\n  nodeRef.current = node;\n\n  const getMarkdown = useCallback(() => hastTableToMarkdown(nodeRef.current), []);\n\n  return (\n    <div className={styles.wrapper}>\n      <CopyButton\n        className={cx(styles.copyButton, 'table-copy-button')}\n        content={getMarkdown}\n        glass={false}\n        size={{ blockSize: 24, size: 14 }}\n        title=\"Copy table\"\n        variant=\"filled\"\n      />\n      <table {...rest}>{children}</table>\n    </div>\n  );\n});\n\nMarkdownTable.displayName = 'MarkdownTable';\n\nexport default MarkdownTable;\n"],"mappings":";;;;;;;AASA,MAAM,YAAY,cAAc,EAAE,KAAK,aAAa;CAClD,YAAY,GAAG;;;;;;;;;;;;kBAYC,MAAM,iBAAiB;4BACb,MAAM,qBAAqB;;0BAE7B,MAAM,kBAAkB,GAAG,MAAM,gBAAgB;;CAEzE,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2Bb,EAAE;AAOH,MAAM,gBAAgB,MAA0B,EAAE,MAAM,UAAU,GAAG,WAAW;CAC9E,MAAM,EAAE,QAAQ,OAAO,WAAW;CAClC,MAAM,UAAU,OAAO,KAAK;AAC5B,SAAQ,UAAU;CAElB,MAAM,cAAc,kBAAkB,oBAAoB,QAAQ,QAAQ,EAAE,EAAE,CAAC;AAE/E,QACE,qBAAC,OAAD;EAAK,WAAW,OAAO;YAAvB,CACE,oBAAC,YAAD;GACE,WAAW,GAAG,OAAO,YAAY,oBAAoB;GACrD,SAAS;GACT,OAAO;GACP,MAAM;IAAE,WAAW;IAAI,MAAM;IAAI;GACjC,OAAM;GACN,SAAQ;GACR,CAAA,EACF,oBAAC,SAAD;GAAO,GAAI;GAAO;GAAiB,CAAA,CAC/B;;EAER;AAEF,cAAc,cAAc"}