@pierre/diffs 1.0.6 → 1.0.7

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.
Files changed (42) hide show
  1. package/dist/components/FileDiff.d.ts.map +1 -1
  2. package/dist/components/FileDiff.js +3 -2
  3. package/dist/components/FileDiff.js.map +1 -1
  4. package/dist/components/FileStream.js +2 -2
  5. package/dist/components/FileStream.js.map +1 -1
  6. package/dist/components/web-components.d.ts.map +1 -1
  7. package/dist/components/web-components.js +1 -1
  8. package/dist/components/web-components.js.map +1 -1
  9. package/dist/highlighter/languages/getResolvedOrResolveLanguage.d.ts +1 -1
  10. package/dist/highlighter/languages/getResolvedOrResolveLanguage.d.ts.map +1 -1
  11. package/dist/highlighter/languages/getResolvedOrResolveLanguage.js.map +1 -1
  12. package/dist/highlighter/languages/resolveLanguage.d.ts +1 -1
  13. package/dist/highlighter/languages/resolveLanguage.d.ts.map +1 -1
  14. package/dist/highlighter/languages/resolveLanguage.js.map +1 -1
  15. package/dist/highlighter/languages/resolveLanguages.js +1 -1
  16. package/dist/highlighter/languages/resolveLanguages.js.map +1 -1
  17. package/dist/highlighter/shared_highlighter.js +1 -1
  18. package/dist/highlighter/shared_highlighter.js.map +1 -1
  19. package/dist/highlighter/themes/registerCustomCSSVariableTheme.js +1 -1
  20. package/dist/highlighter/themes/registerCustomCSSVariableTheme.js.map +1 -1
  21. package/dist/managers/ScrollSyncManager.d.ts +1 -0
  22. package/dist/managers/ScrollSyncManager.d.ts.map +1 -1
  23. package/dist/managers/ScrollSyncManager.js +14 -6
  24. package/dist/managers/ScrollSyncManager.js.map +1 -1
  25. package/dist/style.js +1 -1
  26. package/dist/style.js.map +1 -1
  27. package/dist/types.d.ts +1 -1
  28. package/dist/types.d.ts.map +1 -1
  29. package/dist/utils/formatCSSVariablePrefix.d.ts +1 -1
  30. package/dist/utils/formatCSSVariablePrefix.js +2 -2
  31. package/dist/utils/formatCSSVariablePrefix.js.map +1 -1
  32. package/dist/utils/getHighlighterThemeStyles.js +12 -12
  33. package/dist/utils/getHighlighterThemeStyles.js.map +1 -1
  34. package/dist/utils/renderDiffWithHighlighter.js +2 -2
  35. package/dist/utils/renderDiffWithHighlighter.js.map +1 -1
  36. package/dist/utils/renderFileWithHighlighter.js +2 -2
  37. package/dist/utils/renderFileWithHighlighter.js.map +1 -1
  38. package/dist/worker/worker-portable.js +18 -18
  39. package/dist/worker/worker-portable.js.map +1 -1
  40. package/dist/worker/worker.js +18 -18
  41. package/dist/worker/worker.js.map +1 -1
  42. package/package.json +2 -2
package/dist/style.js CHANGED
@@ -1,5 +1,5 @@
1
1
  //#region src/style.css
2
- var style_default = "@layer base, theme, unsafe;\n\n@layer base {\n :host {\n --diffs-bg: #fff;\n --diffs-fg: #000;\n --diffs-font-fallback:\n 'SF Mono', Monaco, Consolas, 'Ubuntu Mono', 'Liberation Mono',\n 'Courier New', monospace;\n --diffs-header-font-fallback:\n system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',\n 'Noto Sans', 'Liberation Sans', Arial, sans-serif;\n\n --diffs-mixer: light-dark(black, white);\n --diffs-gap-fallback: 8px;\n\n /*\n // Available CSS Color Overrides\n --diffs-bg-buffer-override\n --diffs-bg-hover-override\n --diffs-bg-context-override\n --diffs-bg-separator-override\n\n --diffs-fg-number-override\n --diffs-fg-number-addition-override\n --diffs-fg-number-deletion-override\n\n --diffs-deletion-color-override\n --diffs-addition-color-override\n --diffs-modified-color-override\n\n --diffs-bg-deletion-override\n --diffs-bg-deletion-number-override\n --diffs-bg-deletion-hover-override\n --diffs-bg-deletion-emphasis-override\n\n --diffs-bg-addition-override\n --diffs-bg-addition-number-override\n --diffs-bg-addition-hover-override\n --diffs-bg-addition-emphasis-override\n\n // Line Selection Color Overrides (for enableLineSelection)\n --diffs-selection-color-override\n --diffs-bg-selection-override\n --diffs-bg-selection-number-override\n --diffs-bg-selection-background-override\n --diffs-bg-selection-number-background-override\n\n // Available CSS Layout Overrides\n --diffs-gap-inline\n --diffs-gap-block\n --diffs-gap-style\n --diffs-tab-size\n */\n\n color-scheme: light dark;\n display: block;\n font-family: var(\n --diffs-header-font-family,\n var(--diffs-header-font-fallback)\n );\n font-size: var(--diffs-font-size, 13px);\n line-height: var(--diffs-line-height, 20px);\n font-feature-settings: var(--diffs-font-features);\n }\n\n /* NOTE(mdo): Some semantic HTML elements (e.g. `pre`, `code`) have default\n * user-agent styles. These must be overridden to use our custom styles. */\n pre,\n code,\n [data-error-wrapper] {\n margin: 0;\n padding: 0;\n display: block;\n outline: none;\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n }\n\n *,\n *::before,\n *::after {\n box-sizing: border-box;\n }\n\n [data-icon-sprite] {\n display: none;\n }\n\n /* NOTE(mdo): Headers and separators are within pre/code, so we need to reset\n * their font-family explicitly. */\n [data-diffs-header],\n [data-separator] {\n font-family: var(\n --diffs-header-font-family,\n var(--diffs-header-font-fallback)\n );\n }\n\n [data-file-info] {\n padding: 10px;\n font-weight: 700;\n color: var(--fg);\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n background-color: color-mix(in lab, var(--bg) 98%, var(--fg));\n border-block: 1px solid color-mix(in lab, var(--bg) 95%, var(--fg));\n }\n\n [data-diffs-header],\n [data-diffs],\n [data-error-wrapper] {\n --diffs-bg: light-dark(var(--diffs-light-bg), var(--diffs-dark-bg));\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n --diffs-bg-buffer: var(\n --diffs-bg-buffer-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer))\n )\n );\n --diffs-bg-hover: var(\n --diffs-bg-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 97%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-mixer))\n )\n );\n --diffs-bg-context: var(\n --diffs-bg-context-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 98.5%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 92.5%, var(--diffs-mixer))\n )\n );\n --diffs-bg-separator: var(\n --diffs-bg-separator-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 96%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-mixer))\n )\n );\n\n --diffs-fg: light-dark(var(--diffs-light), var(--diffs-dark));\n --diffs-fg-number: var(\n --diffs-fg-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg)),\n color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg))\n )\n );\n\n --diffs-deletion-base: var(\n --diffs-deletion-color-override,\n light-dark(\n var(\n --diffs-light-deletion-color,\n var(--diffs-deletion-color, rgb(255, 0, 0))\n ),\n var(\n --diffs-dark-deletion-color,\n var(--diffs-deletion-color, rgb(255, 0, 0))\n )\n )\n );\n --diffs-addition-base: var(\n --diffs-addition-color-override,\n light-dark(\n var(\n --diffs-light-addition-color,\n var(--diffs-addition-color, rgb(0, 255, 0))\n ),\n var(\n --diffs-dark-addition-color,\n var(--diffs-addition-color, rgb(0, 255, 0))\n )\n )\n );\n --diffs-modified-base: var(\n --diffs-modified-color-override,\n light-dark(\n var(\n --diffs-light-modified-color,\n var(--diffs-modified-color, rgb(0, 0, 255))\n ),\n var(\n --diffs-dark-modified-color,\n var(--diffs-modified-color, rgb(0, 0, 255))\n )\n )\n );\n\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n --diffs-bg-deletion: var(\n --diffs-bg-deletion-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-number: var(\n --diffs-bg-deletion-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-hover: var(\n --diffs-bg-deletion-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-emphasis: var(\n --diffs-bg-deletion-emphasis-override,\n light-dark(\n rgb(from var(--diffs-deletion-base) r g b / 0.15),\n rgb(from var(--diffs-deletion-base) r g b / 0.2)\n )\n );\n\n --diffs-bg-addition: var(\n --diffs-bg-addition-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-number: var(\n --diffs-bg-addition-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-hover: var(\n --diffs-bg-addition-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 70%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-emphasis: var(\n --diffs-bg-addition-emphasis-override,\n light-dark(\n rgb(from var(--diffs-addition-base) r g b / 0.15),\n rgb(from var(--diffs-addition-base) r g b / 0.2)\n )\n );\n\n --diffs-selection-base: var(--diffs-modified-base);\n --diffs-selection-number-fg: light-dark(\n color-mix(in lab, var(--diffs-selection-base) 65%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-selection-base) 75%, var(--diffs-mixer))\n );\n --diffs-bg-selection: var(\n --diffs-bg-selection-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 82%, var(--diffs-selection-base)),\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-selection-base))\n )\n );\n --diffs-bg-selection-number: var(\n --diffs-bg-selection-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-selection-base)),\n color-mix(in lab, var(--diffs-bg) 60%, var(--diffs-selection-base))\n )\n );\n\n background-color: var(--diffs-bg);\n color: var(--diffs-fg);\n }\n\n [data-diffs] {\n --diffs-code-grid: minmax(min-content, max-content) 1fr;\n\n [data-column-content] span {\n color: light-dark(var(--diffs-light), var(--diffs-dark));\n font-weight: var(--diffs-light-font-weight);\n font-style: var(--diffs-light-font-style);\n }\n }\n\n [data-column-content] {\n background-color: var(--diffs-line-bg, 'transparent');\n grid-column: 2 / 3;\n }\n\n [data-diffs][data-dehydrated] {\n --diffs-code-grid: minmax(min-content, max-content) minmax(0, 1fr);\n }\n\n @media (prefers-color-scheme: dark) {\n [data-diffs-header],\n [data-diffs] {\n color-scheme: dark;\n }\n\n [data-diffs] [data-column-content] span {\n font-weight: var(--diffs-dark-font-weight);\n font-style: var(--diffs-dark-font-style);\n }\n }\n\n [data-diffs-header][data-theme-type='light'],\n [data-diffs][data-theme-type='light'] {\n color-scheme: light;\n }\n\n [data-diffs][data-theme-type='light'] [data-column-content] span {\n font-weight: var(--diffs-light-font-weight);\n font-style: var(--diffs-light-font-style);\n }\n\n [data-diffs-header][data-theme-type='dark'],\n [data-diffs][data-theme-type='dark'] {\n color-scheme: dark;\n }\n\n [data-diffs][data-theme-type='dark'] [data-column-content] span {\n font-weight: var(--diffs-dark-font-weight);\n font-style: var(--diffs-dark-font-style);\n }\n\n [data-type='split'][data-overflow='wrap'] {\n display: grid;\n grid-auto-flow: dense;\n grid-template-columns: repeat(2, var(--diffs-code-grid));\n }\n\n [data-type='split'][data-overflow='scroll'] {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 2px;\n }\n\n [data-code] {\n display: block;\n display: grid;\n grid-auto-flow: dense;\n grid-template-columns: var(--diffs-code-grid);\n overflow: scroll clip;\n overscroll-behavior-x: none;\n tab-size: var(--diffs-tab-size, 2);\n align-self: flex-start;\n padding-top: var(--diffs-gap-block, var(--diffs-gap-fallback));\n padding-bottom: max(\n 0px,\n calc(var(--diffs-gap-block, var(--diffs-gap-fallback)) - 6px)\n );\n }\n\n [data-code]::-webkit-scrollbar {\n width: 0;\n height: 6px;\n }\n\n [data-code]::-webkit-scrollbar-track {\n background: transparent;\n }\n\n [data-code]::-webkit-scrollbar-thumb {\n background-color: transparent;\n border: 1px solid transparent;\n background-clip: content-box;\n border-radius: 3px;\n }\n\n [data-diffs]:hover [data-code]::-webkit-scrollbar-thumb {\n background-color: var(--diffs-bg-context);\n }\n\n [data-code]::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n\n /*\n * If we apply these rules globally it will mean that webkit will opt into the\n * standards compliant version of custom css scrollbars, which we do not want\n * because the custom stuff will look better\n */\n @supports (-moz-appearance: none) {\n [data-code] {\n scrollbar-width: thin;\n scrollbar-color: var(--diffs-bg-context) transparent;\n padding-bottom: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n }\n\n [data-diffs][data-type='split'][data-overflow='wrap'] {\n padding-block: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n\n [data-diffs-header] ~ [data-diffs] [data-code],\n [data-diffs-header] ~ [data-diffs][data-overflow='wrap'] {\n padding-top: 0;\n }\n\n [data-type='split'][data-overflow='wrap'] [data-code] {\n display: contents;\n }\n\n [data-line-annotation],\n [data-no-newline],\n [data-line] {\n position: relative;\n display: grid;\n grid-template-columns: subgrid;\n grid-column: 1 / 3;\n }\n\n [data-line-annotation][data-selected-line] {\n background-color: unset;\n\n &::before {\n content: '';\n position: sticky;\n top: 0;\n left: 0;\n display: block;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n background-color: var(--diffs-bg-selection-number);\n }\n\n [data-annotation-content] {\n background-color: var(--diffs-bg-selection);\n }\n }\n\n [data-interactive-lines] [data-line] {\n cursor: pointer;\n }\n\n [data-buffer] {\n position: sticky;\n left: 0;\n grid-column: 1 / 3;\n -webkit-user-select: none;\n user-select: none;\n /* We multiply by 1.414 (√2) to better approximate the diagonal repeat distance */\n background-image: repeating-linear-gradient(\n -45deg,\n transparent,\n transparent calc(3px * 1.414),\n var(--diffs-bg-buffer) calc(3px * 1.414),\n var(--diffs-bg-buffer) calc(4px * 1.414)\n );\n min-height: 1lh;\n width: var(--diffs-column-width, auto);\n }\n\n [data-separator] {\n grid-column: span 2;\n }\n\n [data-separator='metadata'],\n [data-separator]:empty {\n min-height: 4px;\n background-color: var(--diffs-bg-separator);\n display: grid;\n grid-template-columns: subgrid;\n }\n\n [data-separator-wrapper] {\n -webkit-user-select: none;\n user-select: none;\n fill: currentColor;\n overflow: hidden;\n }\n\n [data-separator='metadata'] [data-separator-wrapper] {\n grid-column: 2 / 3;\n width: var(--diffs-column-content-width);\n position: sticky;\n left: var(--diffs-column-number-width);\n padding: 4px 1ch;\n }\n\n [data-separator='line-info'] {\n margin-block: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n\n [data-separator='line-info'][data-separator-first] {\n margin-top: 0;\n }\n\n [data-separator='line-info'][data-separator-last] {\n margin-bottom: 0;\n }\n\n [data-separator='line-info'] [data-separator-wrapper] {\n position: sticky;\n display: flex;\n align-items: center;\n gap: 2px;\n width: auto;\n width: calc(var(--diffs-column-width) - var(--diffs-gap-fallback));\n border-radius: 6px;\n }\n\n @media (pointer: fine) {\n [data-separator-wrapper][data-separator-multi-button] {\n display: grid;\n grid-template-columns: auto minmax(0, 1fr);\n grid-template-rows: 15px 15px;\n\n [data-expand-button] {\n height: 15px;\n }\n }\n\n [data-type='split']\n [data-additions]\n [data-separator-wrapper][data-separator-multi-button] {\n grid-template-columns: minmax(0, 1fr) auto;\n }\n\n [data-type='split'] [data-additions] [data-expand-button] {\n grid-column: 2;\n }\n\n [data-type='split'] [data-additions] [data-separator-content] {\n grid-column: 1;\n }\n }\n\n [data-expand-button],\n [data-separator-content] {\n display: flex;\n align-items: center;\n background-color: var(--diffs-bg-separator);\n }\n\n [data-expand-button] {\n justify-content: center;\n flex-shrink: 0;\n cursor: pointer;\n width: 32px;\n height: 32px;\n opacity: 0.65;\n }\n\n [data-hover-slot] {\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n display: flex;\n justify-content: flex-end;\n }\n\n @media (pointer: fine) {\n [data-expand-button]:hover {\n opacity: 1;\n }\n\n [data-line]:hover {\n z-index: 2;\n }\n }\n\n [data-expand-up] [data-icon] {\n transform: scaleY(-1);\n }\n\n [data-separator-content] {\n flex: 1 1 auto;\n padding: 0 1ch;\n height: 32px;\n opacity: 0.65;\n overflow: hidden;\n justify-content: flex-start;\n\n grid-column: 2;\n grid-row: 1 / -1;\n }\n\n [data-unmodified-lines] {\n display: block;\n overflow: hidden;\n min-width: 0;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 0 1 auto;\n }\n\n [data-type='split'] [data-additions] [data-separator-content] {\n justify-content: flex-end;\n }\n\n [data-type='file']\n [data-code]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n margin-left: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n margin-right: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n width: calc(\n var(--diffs-column-width) -\n (var(--diffs-gap-inline, var(--diffs-gap-fallback)) * 2)\n );\n }\n\n [data-type='split']\n [data-deletions]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: var(--diffs-gap-fallback);\n margin-left: var(--diffs-gap-fallback);\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n [data-type='split']\n [data-additions]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: 0;\n margin-right: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n flex-direction: row-reverse;\n }\n\n [data-line] {\n background-color: var(--diffs-bg);\n color: var(--diffs-fg);\n }\n\n [data-type='split'][data-overflow='wrap'] [data-deletions] {\n [data-line-annotation],\n [data-buffer],\n [data-line],\n [data-separator] {\n grid-column: 1 / 3;\n }\n }\n\n [data-line-annotation] {\n min-height: var(--diffs-annotation-min-height, 0);\n background-color: var(--diffs-bg-context);\n z-index: 3;\n }\n\n [data-type='split'][data-overflow='wrap'] [data-additions] {\n [data-line-annotation],\n [data-buffer],\n [data-line],\n [data-separator] {\n margin-left: 2px;\n grid-column: 3 / 5;\n }\n }\n\n [data-separator='custom'] {\n display: grid;\n grid-template-columns: subgrid;\n }\n\n [data-column-content],\n [data-column-number] {\n position: relative;\n padding-inline: 1ch;\n }\n\n [data-indicators='classic'] [data-column-content] {\n padding-inline-start: 2ch;\n }\n\n [data-indicators='classic'] {\n [data-line-type='change-addition'] [data-column-content]::before,\n [data-line-type='change-deletion'] [data-column-content]::before {\n display: inline-block;\n width: 1ch;\n height: 1lh;\n position: absolute;\n top: 0;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n }\n\n [data-line-type='change-addition'] [data-column-content]::before {\n content: '+';\n color: var(--diffs-addition-base);\n }\n\n [data-line-type='change-deletion'] [data-column-content]::before {\n content: '-';\n color: var(--diffs-deletion-base);\n }\n }\n\n [data-indicators='bars'] {\n [data-line-type='change-deletion'] [data-column-number]::before,\n [data-line-type='change-addition'] [data-column-number]::before {\n content: '';\n display: block;\n width: 4px;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n }\n\n [data-line-type='change-deletion'] [data-column-number]::before {\n background-image: linear-gradient(\n 0deg,\n var(--diffs-bg-deletion) 50%,\n var(--diffs-deletion-base) 50%\n );\n background-repeat: repeat;\n background-size: 2px 2px;\n background-size: calc(1lh / round(1lh / 2px)) calc(1lh / round(1lh / 2px));\n }\n\n [data-line-type='change-addition'] [data-column-number]::before {\n background-color: var(--diffs-addition-base);\n }\n }\n\n [data-overflow='wrap'] [data-column-content],\n [data-overflow='wrap'] [data-annotation-content] {\n white-space: pre-wrap;\n word-break: break-word;\n }\n\n [data-overflow='scroll'] [data-column-content] {\n white-space: pre;\n min-height: 1lh;\n }\n\n [data-column-number] {\n grid-column: 1 / 2;\n box-sizing: content-box;\n text-align: right;\n position: sticky;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n background-color: var(--diffs-bg);\n color: var(--diffs-fg-number);\n z-index: 1;\n min-width: var(\n --diffs-min-number-column-width,\n var(--diffs-min-number-column-width-default, 3ch)\n );\n padding-left: 2ch;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n }\n\n [data-disable-line-numbers] {\n &[data-indicators='bars'] [data-column-number] {\n min-width: 4px;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n }\n\n [data-column-number] {\n border-right: none;\n min-width: 0;\n padding: 0;\n }\n\n [data-line-number-content] {\n display: none;\n }\n\n [data-hover-slot] {\n right: unset;\n left: 0;\n justify-content: flex-start;\n }\n\n &[data-indicators='bars'] [data-hover-slot] {\n /* Using 5px here because theres a 1px separator after the bar */\n left: 5px;\n }\n }\n\n [data-interactive-line-numbers] [data-column-number] {\n cursor: pointer;\n }\n\n [data-diff-span] {\n border-radius: 3px;\n -webkit-box-decoration-break: clone;\n box-decoration-break: clone;\n }\n\n [data-line-type='change-addition'] {\n [data-column-number] {\n color: var(\n --diffs-fg-number-addition-override,\n var(--diffs-addition-base)\n );\n }\n\n [data-diff-span] {\n background-color: var(--diffs-bg-addition-emphasis);\n }\n }\n\n [data-line-type='change-deletion'] {\n [data-column-number] {\n color: var(\n --diffs-fg-number-deletion-override,\n var(--diffs-deletion-base)\n );\n }\n\n [data-diff-span] {\n background-color: var(--diffs-bg-deletion-emphasis);\n }\n }\n\n [data-background] [data-line-type='change-addition'] {\n --diffs-line-bg: var(--diffs-bg-addition);\n\n [data-column-number] {\n background-color: var(--diffs-bg-addition-number);\n }\n }\n\n [data-background] [data-line-type='change-deletion'] {\n --diffs-line-bg: var(--diffs-bg-deletion);\n\n [data-column-number] {\n background-color: var(--diffs-bg-deletion-number);\n }\n }\n\n [data-line-type='context-expanded'] {\n --diffs-line-bg: var(--diffs-bg-context);\n\n [data-column-number] {\n background-color: var(--diffs-bg-context);\n }\n }\n\n /* By wrapping hovers in a pointer: fine, we ensure that mobile devices don't\n* require a double click */\n @media (pointer: fine) {\n [data-line]:hover:not([data-selected-line]) {\n [data-column-number],\n [data-column-content] {\n background-color: var(--diffs-bg-hover);\n }\n }\n\n [data-background] [data-line]:hover:not([data-selected-line]) {\n &[data-line-type='change-deletion'] [data-column-number],\n &[data-line-type='change-deletion'] [data-column-content] {\n background-color: var(--diffs-bg-deletion-hover);\n }\n\n &[data-line-type='change-addition'] [data-column-number],\n &[data-line-type='change-addition'] [data-column-content] {\n background-color: var(--diffs-bg-addition-hover);\n }\n }\n }\n\n [data-diffs-header] {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n min-height: calc(\n 1lh + (var(--diffs-gap-block, var(--diffs-gap-fallback)) * 3)\n );\n padding-inline: 16px;\n }\n\n [data-header-content] {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n min-width: 0;\n white-space: nowrap;\n }\n\n [data-header-content] [data-prev-name],\n [data-header-content] [data-title] {\n direction: rtl;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n white-space: nowrap;\n }\n\n [data-prev-name] {\n opacity: 0.7;\n }\n\n [data-rename-icon] {\n fill: currentColor;\n flex-shrink: 0;\n flex-grow: 0;\n }\n\n [data-diffs-header] [data-metadata] {\n display: flex;\n align-items: center;\n gap: 1ch;\n white-space: nowrap;\n }\n\n [data-diffs-header] [data-additions-count] {\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n color: var(--diffs-addition-base);\n }\n\n [data-diffs-header] [data-deletions-count] {\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n color: var(--diffs-deletion-base);\n }\n\n [data-no-newline] {\n -webkit-user-select: none;\n user-select: none;\n\n [data-column-content] {\n opacity: 0.6;\n }\n }\n\n [data-annotation-content] {\n position: sticky;\n left: var(--diffs-column-number-width, 0);\n grid-column: 2 / -1;\n width: var(--diffs-column-content-width, auto);\n align-self: flex-start;\n z-index: 2;\n height: 100%;\n }\n\n /* Undo some of the stuff that the 'pre' tag does */\n [data-annotation-slot] {\n text-wrap-mode: wrap;\n word-break: normal;\n white-space-collapse: collapse;\n }\n\n [data-change-icon] {\n fill: currentColor;\n flex-shrink: 0;\n }\n\n [data-change-icon='change'],\n [data-change-icon='rename-pure'],\n [data-change-icon='rename-changed'] {\n color: var(--diffs-modified-base);\n }\n\n [data-change-icon='new'] {\n color: var(--diffs-addition-base);\n }\n\n [data-change-icon='deleted'] {\n color: var(--diffs-deletion-base);\n }\n\n [data-change-icon='file'] {\n opacity: 0.6;\n }\n\n /* Line selection highlighting */\n [data-line-type='context'][data-selected-line] {\n [data-column-number] {\n color: var(--diffs-selection-number-fg);\n background-color: var(--diffs-bg-selection-number);\n }\n\n [data-column-content] {\n background-color: var(--diffs-bg-selection);\n }\n }\n\n [data-line-type='context-expanded'],\n [data-line-type='change-addition'],\n [data-line-type='change-deletion'] {\n &[data-selected-line] {\n [data-column-content] {\n background-color: light-dark(\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 82%,\n var(--diffs-selection-base)\n ),\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 75%,\n var(--diffs-selection-base)\n )\n );\n }\n\n [data-column-number] {\n color: var(--diffs-selection-number-fg);\n background-color: light-dark(\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 75%,\n var(--diffs-selection-base)\n ),\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 60%,\n var(--diffs-selection-base)\n )\n );\n }\n }\n }\n\n [data-error-wrapper] {\n overflow: auto;\n padding: var(--diffs-gap-block, var(--diffs-gap-fallback))\n var(--diffs-gap-inline, var(--diffs-gap-fallback));\n max-height: 400px;\n scrollbar-width: none;\n\n [data-error-message] {\n font-weight: bold;\n font-size: 18px;\n color: var(--diffs-deletion-base);\n }\n\n [data-error-stack] {\n color: var(--diffs-fg-number);\n }\n }\n}\n";
2
+ var style_default = "@layer base, theme, unsafe;\n\n@layer base {\n :host {\n --diffs-bg: #fff;\n --diffs-fg: #000;\n --diffs-font-fallback:\n 'SF Mono', Monaco, Consolas, 'Ubuntu Mono', 'Liberation Mono',\n 'Courier New', monospace;\n --diffs-header-font-fallback:\n system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',\n 'Noto Sans', 'Liberation Sans', Arial, sans-serif;\n\n --diffs-mixer: light-dark(black, white);\n --diffs-gap-fallback: 8px;\n\n /*\n // Available CSS Color Overrides\n --diffs-bg-buffer-override\n --diffs-bg-hover-override\n --diffs-bg-context-override\n --diffs-bg-separator-override\n\n --diffs-fg-number-override\n --diffs-fg-number-addition-override\n --diffs-fg-number-deletion-override\n\n --diffs-deletion-color-override\n --diffs-addition-color-override\n --diffs-modified-color-override\n\n --diffs-bg-deletion-override\n --diffs-bg-deletion-number-override\n --diffs-bg-deletion-hover-override\n --diffs-bg-deletion-emphasis-override\n\n --diffs-bg-addition-override\n --diffs-bg-addition-number-override\n --diffs-bg-addition-hover-override\n --diffs-bg-addition-emphasis-override\n\n // Line Selection Color Overrides (for enableLineSelection)\n --diffs-selection-color-override\n --diffs-bg-selection-override\n --diffs-bg-selection-number-override\n --diffs-bg-selection-background-override\n --diffs-bg-selection-number-background-override\n\n // Available CSS Layout Overrides\n --diffs-gap-inline\n --diffs-gap-block\n --diffs-gap-style\n --diffs-tab-size\n */\n\n color-scheme: light dark;\n display: block;\n font-family: var(\n --diffs-header-font-family,\n var(--diffs-header-font-fallback)\n );\n font-size: var(--diffs-font-size, 13px);\n line-height: var(--diffs-line-height, 20px);\n font-feature-settings: var(--diffs-font-features);\n }\n\n /* NOTE(mdo): Some semantic HTML elements (e.g. `pre`, `code`) have default\n * user-agent styles. These must be overridden to use our custom styles. */\n pre,\n code,\n [data-error-wrapper] {\n margin: 0;\n padding: 0;\n display: block;\n outline: none;\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n }\n\n *,\n *::before,\n *::after {\n box-sizing: border-box;\n }\n\n [data-icon-sprite] {\n display: none;\n }\n\n /* NOTE(mdo): Headers and separators are within pre/code, so we need to reset\n * their font-family explicitly. */\n [data-diffs-header],\n [data-separator] {\n font-family: var(\n --diffs-header-font-family,\n var(--diffs-header-font-fallback)\n );\n }\n\n [data-file-info] {\n padding: 10px;\n font-weight: 700;\n color: var(--fg);\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n background-color: color-mix(in lab, var(--bg) 98%, var(--fg));\n border-block: 1px solid color-mix(in lab, var(--bg) 95%, var(--fg));\n }\n\n [data-diffs-header],\n [data-diffs],\n [data-error-wrapper] {\n --diffs-bg: light-dark(var(--diffs-light-bg), var(--diffs-dark-bg));\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n --diffs-bg-buffer: var(\n --diffs-bg-buffer-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer))\n )\n );\n --diffs-bg-hover: var(\n --diffs-bg-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 97%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-mixer))\n )\n );\n --diffs-bg-context: var(\n --diffs-bg-context-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 98.5%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 92.5%, var(--diffs-mixer))\n )\n );\n --diffs-bg-separator: var(\n --diffs-bg-separator-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 96%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-mixer))\n )\n );\n\n --diffs-fg: light-dark(var(--diffs-light), var(--diffs-dark));\n --diffs-fg-number: var(\n --diffs-fg-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg)),\n color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg))\n )\n );\n\n --diffs-deletion-base: var(\n --diffs-deletion-color-override,\n light-dark(\n var(\n --diffs-light-deletion-color,\n var(--diffs-deletion-color, rgb(255, 0, 0))\n ),\n var(\n --diffs-dark-deletion-color,\n var(--diffs-deletion-color, rgb(255, 0, 0))\n )\n )\n );\n --diffs-addition-base: var(\n --diffs-addition-color-override,\n light-dark(\n var(\n --diffs-light-addition-color,\n var(--diffs-addition-color, rgb(0, 255, 0))\n ),\n var(\n --diffs-dark-addition-color,\n var(--diffs-addition-color, rgb(0, 255, 0))\n )\n )\n );\n --diffs-modified-base: var(\n --diffs-modified-color-override,\n light-dark(\n var(\n --diffs-light-modified-color,\n var(--diffs-modified-color, rgb(0, 0, 255))\n ),\n var(\n --diffs-dark-modified-color,\n var(--diffs-modified-color, rgb(0, 0, 255))\n )\n )\n );\n\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n --diffs-bg-deletion: var(\n --diffs-bg-deletion-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-number: var(\n --diffs-bg-deletion-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-hover: var(\n --diffs-bg-deletion-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-emphasis: var(\n --diffs-bg-deletion-emphasis-override,\n light-dark(\n rgb(from var(--diffs-deletion-base) r g b / 0.15),\n rgb(from var(--diffs-deletion-base) r g b / 0.2)\n )\n );\n\n --diffs-bg-addition: var(\n --diffs-bg-addition-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-number: var(\n --diffs-bg-addition-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-hover: var(\n --diffs-bg-addition-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 70%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-emphasis: var(\n --diffs-bg-addition-emphasis-override,\n light-dark(\n rgb(from var(--diffs-addition-base) r g b / 0.15),\n rgb(from var(--diffs-addition-base) r g b / 0.2)\n )\n );\n\n --diffs-selection-base: var(--diffs-modified-base);\n --diffs-selection-number-fg: light-dark(\n color-mix(in lab, var(--diffs-selection-base) 65%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-selection-base) 75%, var(--diffs-mixer))\n );\n --diffs-bg-selection: var(\n --diffs-bg-selection-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 82%, var(--diffs-selection-base)),\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-selection-base))\n )\n );\n --diffs-bg-selection-number: var(\n --diffs-bg-selection-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-selection-base)),\n color-mix(in lab, var(--diffs-bg) 60%, var(--diffs-selection-base))\n )\n );\n\n background-color: var(--diffs-bg);\n color: var(--diffs-fg);\n }\n\n [data-diffs] {\n --diffs-code-grid: minmax(min-content, max-content) 1fr;\n\n [data-column-content] span {\n color: light-dark(\n var(--diffs-token-light, var(--diffs-light)),\n var(--diffs-token-dark, var(--diffs-dark))\n );\n font-weight: var(--diffs-token-light-font-weight, inherit);\n font-style: var(--diffs-token-light-font-style, inherit);\n -webkit-text-decoration: var(--diffs-token-light-text-decoration, inherit);\n text-decoration: var(--diffs-token-light-text-decoration, inherit);\n }\n }\n\n /* Since span is a pretty innocuous selector, we need to make sure we don't\n * apply tokenized BG colors to diff-spans */\n [data-column-content] span:not([data-diff-span]) {\n background-color: light-dark(\n var(--diffs-token-light-bg, inherit),\n var(--diffs-token-dark-bg, inherit)\n );\n }\n\n [data-column-content] {\n background-color: var(--diffs-line-bg, 'transparent');\n grid-column: 2 / 3;\n }\n\n [data-diffs][data-dehydrated] {\n --diffs-code-grid: minmax(min-content, max-content) minmax(0, 1fr);\n }\n\n @media (prefers-color-scheme: dark) {\n [data-diffs-header],\n [data-diffs] {\n color-scheme: dark;\n }\n\n [data-diffs] [data-column-content] span {\n font-weight: var(--diffs-token-dark-font-weight, inherit);\n font-style: var(--diffs-token-dark-font-style, inherit);\n -webkit-text-decoration: var(--diffs-token-dark-text-decoration, inherit);\n text-decoration: var(--diffs-token-dark-text-decoration, inherit);\n }\n }\n\n [data-diffs-header][data-theme-type='light'],\n [data-diffs][data-theme-type='light'] {\n color-scheme: light;\n }\n\n [data-diffs][data-theme-type='light'] [data-column-content] span {\n font-weight: var(--diffs-token-light-font-weight, inherit);\n font-style: var(--diffs-token-light-font-style, inherit);\n -webkit-text-decoration: var(--diffs-token-light-text-decoration, inherit);\n text-decoration: var(--diffs-token-light-text-decoration, inherit);\n }\n\n [data-diffs-header][data-theme-type='dark'],\n [data-diffs][data-theme-type='dark'] {\n color-scheme: dark;\n }\n\n [data-diffs][data-theme-type='dark'] [data-column-content] span {\n font-weight: var(--diffs-token-dark-font-weight, inherit);\n font-style: var(--diffs-token-dark-font-style, inherit);\n -webkit-text-decoration: var(--diffs-token-dark-text-decoration, inherit);\n text-decoration: var(--diffs-token-dark-text-decoration, inherit);\n }\n\n [data-type='split'][data-overflow='wrap'] {\n display: grid;\n grid-auto-flow: dense;\n grid-template-columns: repeat(2, var(--diffs-code-grid));\n }\n\n [data-type='split'][data-overflow='scroll'] {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 2px;\n }\n\n [data-code] {\n display: block;\n display: grid;\n grid-auto-flow: dense;\n grid-template-columns: var(--diffs-code-grid);\n overflow: scroll clip;\n overscroll-behavior-x: none;\n tab-size: var(--diffs-tab-size, 2);\n align-self: flex-start;\n padding-top: var(--diffs-gap-block, var(--diffs-gap-fallback));\n padding-bottom: max(\n 0px,\n calc(var(--diffs-gap-block, var(--diffs-gap-fallback)) - 6px)\n );\n }\n\n [data-code]::-webkit-scrollbar {\n width: 0;\n height: 6px;\n }\n\n [data-code]::-webkit-scrollbar-track {\n background: transparent;\n }\n\n [data-code]::-webkit-scrollbar-thumb {\n background-color: transparent;\n border: 1px solid transparent;\n background-clip: content-box;\n border-radius: 3px;\n }\n\n [data-diffs]:hover [data-code]::-webkit-scrollbar-thumb {\n background-color: var(--diffs-bg-context);\n }\n\n [data-code]::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n\n /*\n * If we apply these rules globally it will mean that webkit will opt into the\n * standards compliant version of custom css scrollbars, which we do not want\n * because the custom stuff will look better\n */\n @supports (-moz-appearance: none) {\n [data-code] {\n scrollbar-width: thin;\n scrollbar-color: var(--diffs-bg-context) transparent;\n padding-bottom: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n }\n\n [data-diffs][data-type='split'][data-overflow='wrap'] {\n padding-block: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n\n [data-diffs-header] ~ [data-diffs] [data-code],\n [data-diffs-header] ~ [data-diffs][data-overflow='wrap'] {\n padding-top: 0;\n }\n\n [data-type='split'][data-overflow='wrap'] [data-code] {\n display: contents;\n }\n\n [data-line-annotation],\n [data-no-newline],\n [data-line] {\n position: relative;\n display: grid;\n grid-template-columns: subgrid;\n grid-column: 1 / 3;\n }\n\n [data-line-annotation][data-selected-line] {\n background-color: unset;\n\n &::before {\n content: '';\n position: sticky;\n top: 0;\n left: 0;\n display: block;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n background-color: var(--diffs-bg-selection-number);\n }\n\n [data-annotation-content] {\n background-color: var(--diffs-bg-selection);\n }\n }\n\n [data-interactive-lines] [data-line] {\n cursor: pointer;\n }\n\n [data-buffer] {\n position: sticky;\n left: 0;\n grid-column: 1 / 3;\n -webkit-user-select: none;\n user-select: none;\n /* We multiply by 1.414 (√2) to better approximate the diagonal repeat distance */\n background-image: repeating-linear-gradient(\n -45deg,\n transparent,\n transparent calc(3px * 1.414),\n var(--diffs-bg-buffer) calc(3px * 1.414),\n var(--diffs-bg-buffer) calc(4px * 1.414)\n );\n min-height: 1lh;\n width: var(--diffs-column-width, auto);\n }\n\n [data-separator] {\n grid-column: span 2;\n }\n\n [data-separator='metadata'],\n [data-separator]:empty {\n min-height: 4px;\n background-color: var(--diffs-bg-separator);\n display: grid;\n grid-template-columns: subgrid;\n }\n\n [data-separator-wrapper] {\n -webkit-user-select: none;\n user-select: none;\n fill: currentColor;\n overflow: hidden;\n }\n\n [data-separator='metadata'] [data-separator-wrapper] {\n grid-column: 2 / 3;\n width: var(--diffs-column-content-width);\n position: sticky;\n left: var(--diffs-column-number-width);\n padding: 4px 1ch;\n }\n\n [data-separator='line-info'] {\n margin-block: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n\n [data-separator='line-info'][data-separator-first] {\n margin-top: 0;\n }\n\n [data-separator='line-info'][data-separator-last] {\n margin-bottom: 0;\n }\n\n [data-separator='line-info'] [data-separator-wrapper] {\n position: sticky;\n display: flex;\n align-items: center;\n gap: 2px;\n width: auto;\n width: calc(var(--diffs-column-width) - var(--diffs-gap-fallback));\n border-radius: 6px;\n }\n\n @media (pointer: fine) {\n [data-separator-wrapper][data-separator-multi-button] {\n display: grid;\n grid-template-columns: auto minmax(0, 1fr);\n grid-template-rows: 15px 15px;\n\n [data-expand-button] {\n height: 15px;\n }\n }\n\n [data-type='split']\n [data-additions]\n [data-separator-wrapper][data-separator-multi-button] {\n grid-template-columns: minmax(0, 1fr) auto;\n }\n\n [data-type='split'] [data-additions] [data-expand-button] {\n grid-column: 2;\n }\n\n [data-type='split'] [data-additions] [data-separator-content] {\n grid-column: 1;\n }\n }\n\n [data-expand-button],\n [data-separator-content] {\n display: flex;\n align-items: center;\n background-color: var(--diffs-bg-separator);\n }\n\n [data-expand-button] {\n justify-content: center;\n flex-shrink: 0;\n cursor: pointer;\n width: 32px;\n height: 32px;\n opacity: 0.65;\n }\n\n [data-hover-slot] {\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n display: flex;\n justify-content: flex-end;\n }\n\n @media (pointer: fine) {\n [data-expand-button]:hover {\n opacity: 1;\n }\n\n [data-line]:hover {\n z-index: 2;\n }\n }\n\n [data-expand-up] [data-icon] {\n transform: scaleY(-1);\n }\n\n [data-separator-content] {\n flex: 1 1 auto;\n padding: 0 1ch;\n height: 32px;\n opacity: 0.65;\n overflow: hidden;\n justify-content: flex-start;\n\n grid-column: 2;\n grid-row: 1 / -1;\n }\n\n [data-unmodified-lines] {\n display: block;\n overflow: hidden;\n min-width: 0;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 0 1 auto;\n }\n\n [data-type='split'] [data-additions] [data-separator-content] {\n justify-content: flex-end;\n }\n\n [data-type='file']\n [data-code]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n margin-left: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n margin-right: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n width: calc(\n var(--diffs-column-width) -\n (var(--diffs-gap-inline, var(--diffs-gap-fallback)) * 2)\n );\n }\n\n [data-type='split']\n [data-deletions]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: var(--diffs-gap-fallback);\n margin-left: var(--diffs-gap-fallback);\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n [data-type='split']\n [data-additions]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: 0;\n margin-right: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n flex-direction: row-reverse;\n }\n\n [data-line] {\n background-color: var(--diffs-bg);\n color: var(--diffs-fg);\n }\n\n [data-type='split'][data-overflow='wrap'] [data-deletions] {\n [data-line-annotation],\n [data-buffer],\n [data-line],\n [data-separator] {\n grid-column: 1 / 3;\n }\n }\n\n [data-line-annotation] {\n min-height: var(--diffs-annotation-min-height, 0);\n background-color: var(--diffs-bg-context);\n z-index: 3;\n }\n\n [data-type='split'][data-overflow='wrap'] [data-additions] {\n [data-line-annotation],\n [data-buffer],\n [data-line],\n [data-separator] {\n margin-left: 2px;\n grid-column: 3 / 5;\n }\n }\n\n [data-separator='custom'] {\n display: grid;\n grid-template-columns: subgrid;\n }\n\n [data-column-content],\n [data-column-number] {\n position: relative;\n padding-inline: 1ch;\n }\n\n [data-indicators='classic'] [data-column-content] {\n padding-inline-start: 2ch;\n }\n\n [data-indicators='classic'] {\n [data-line-type='change-addition'] [data-column-content]::before,\n [data-line-type='change-deletion'] [data-column-content]::before {\n display: inline-block;\n width: 1ch;\n height: 1lh;\n position: absolute;\n top: 0;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n }\n\n [data-line-type='change-addition'] [data-column-content]::before {\n content: '+';\n color: var(--diffs-addition-base);\n }\n\n [data-line-type='change-deletion'] [data-column-content]::before {\n content: '-';\n color: var(--diffs-deletion-base);\n }\n }\n\n [data-indicators='bars'] {\n [data-line-type='change-deletion'] [data-column-number]::before,\n [data-line-type='change-addition'] [data-column-number]::before {\n content: '';\n display: block;\n width: 4px;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n }\n\n [data-line-type='change-deletion'] [data-column-number]::before {\n background-image: linear-gradient(\n 0deg,\n var(--diffs-bg-deletion) 50%,\n var(--diffs-deletion-base) 50%\n );\n background-repeat: repeat;\n background-size: 2px 2px;\n background-size: calc(1lh / round(1lh / 2px)) calc(1lh / round(1lh / 2px));\n }\n\n [data-line-type='change-addition'] [data-column-number]::before {\n background-color: var(--diffs-addition-base);\n }\n }\n\n [data-overflow='wrap'] [data-column-content],\n [data-overflow='wrap'] [data-annotation-content] {\n white-space: pre-wrap;\n word-break: break-word;\n }\n\n [data-overflow='scroll'] [data-column-content] {\n white-space: pre;\n min-height: 1lh;\n }\n\n [data-column-number] {\n grid-column: 1 / 2;\n box-sizing: content-box;\n text-align: right;\n position: sticky;\n left: 0;\n -webkit-user-select: none;\n user-select: none;\n background-color: var(--diffs-bg);\n color: var(--diffs-fg-number);\n z-index: 1;\n min-width: var(\n --diffs-min-number-column-width,\n var(--diffs-min-number-column-width-default, 3ch)\n );\n padding-left: 2ch;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n }\n\n [data-disable-line-numbers] {\n &[data-indicators='bars'] [data-column-number] {\n min-width: 4px;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n }\n\n [data-column-number] {\n border-right: none;\n min-width: 0;\n padding: 0;\n }\n\n [data-line-number-content] {\n display: none;\n }\n\n [data-hover-slot] {\n right: unset;\n left: 0;\n justify-content: flex-start;\n }\n\n &[data-indicators='bars'] [data-hover-slot] {\n /* Using 5px here because theres a 1px separator after the bar */\n left: 5px;\n }\n }\n\n [data-interactive-line-numbers] [data-column-number] {\n cursor: pointer;\n }\n\n [data-diff-span] {\n border-radius: 3px;\n -webkit-box-decoration-break: clone;\n box-decoration-break: clone;\n }\n\n [data-line-type='change-addition'] {\n [data-column-number] {\n color: var(\n --diffs-fg-number-addition-override,\n var(--diffs-addition-base)\n );\n }\n\n [data-diff-span] {\n background-color: var(--diffs-bg-addition-emphasis);\n }\n }\n\n [data-line-type='change-deletion'] {\n [data-column-number] {\n color: var(\n --diffs-fg-number-deletion-override,\n var(--diffs-deletion-base)\n );\n }\n\n [data-diff-span] {\n background-color: var(--diffs-bg-deletion-emphasis);\n }\n }\n\n [data-background] [data-line-type='change-addition'] {\n --diffs-line-bg: var(--diffs-bg-addition);\n\n [data-column-number] {\n background-color: var(--diffs-bg-addition-number);\n }\n }\n\n [data-background] [data-line-type='change-deletion'] {\n --diffs-line-bg: var(--diffs-bg-deletion);\n\n [data-column-number] {\n background-color: var(--diffs-bg-deletion-number);\n }\n }\n\n [data-line-type='context-expanded'] {\n --diffs-line-bg: var(--diffs-bg-context);\n\n [data-column-number] {\n background-color: var(--diffs-bg-context);\n }\n }\n\n /* By wrapping hovers in a pointer: fine, we ensure that mobile devices don't\n* require a double click */\n @media (pointer: fine) {\n [data-line]:hover:not([data-selected-line]) {\n [data-column-number],\n [data-column-content] {\n background-color: var(--diffs-bg-hover);\n }\n }\n\n [data-background] [data-line]:hover:not([data-selected-line]) {\n &[data-line-type='change-deletion'] [data-column-number],\n &[data-line-type='change-deletion'] [data-column-content] {\n background-color: var(--diffs-bg-deletion-hover);\n }\n\n &[data-line-type='change-addition'] [data-column-number],\n &[data-line-type='change-addition'] [data-column-content] {\n background-color: var(--diffs-bg-addition-hover);\n }\n }\n }\n\n [data-diffs-header] {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n min-height: calc(\n 1lh + (var(--diffs-gap-block, var(--diffs-gap-fallback)) * 3)\n );\n padding-inline: 16px;\n }\n\n [data-header-content] {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n min-width: 0;\n white-space: nowrap;\n }\n\n [data-header-content] [data-prev-name],\n [data-header-content] [data-title] {\n direction: rtl;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n white-space: nowrap;\n }\n\n [data-prev-name] {\n opacity: 0.7;\n }\n\n [data-rename-icon] {\n fill: currentColor;\n flex-shrink: 0;\n flex-grow: 0;\n }\n\n [data-diffs-header] [data-metadata] {\n display: flex;\n align-items: center;\n gap: 1ch;\n white-space: nowrap;\n }\n\n [data-diffs-header] [data-additions-count] {\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n color: var(--diffs-addition-base);\n }\n\n [data-diffs-header] [data-deletions-count] {\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n color: var(--diffs-deletion-base);\n }\n\n [data-no-newline] {\n -webkit-user-select: none;\n user-select: none;\n\n [data-column-content] {\n opacity: 0.6;\n }\n }\n\n [data-annotation-content] {\n position: sticky;\n left: var(--diffs-column-number-width, 0);\n grid-column: 2 / -1;\n width: var(--diffs-column-content-width, auto);\n align-self: flex-start;\n z-index: 2;\n height: 100%;\n }\n\n /* Undo some of the stuff that the 'pre' tag does */\n [data-annotation-slot] {\n text-wrap-mode: wrap;\n word-break: normal;\n white-space-collapse: collapse;\n }\n\n [data-change-icon] {\n fill: currentColor;\n flex-shrink: 0;\n }\n\n [data-change-icon='change'],\n [data-change-icon='rename-pure'],\n [data-change-icon='rename-changed'] {\n color: var(--diffs-modified-base);\n }\n\n [data-change-icon='new'] {\n color: var(--diffs-addition-base);\n }\n\n [data-change-icon='deleted'] {\n color: var(--diffs-deletion-base);\n }\n\n [data-change-icon='file'] {\n opacity: 0.6;\n }\n\n /* Line selection highlighting */\n [data-line-type='context'][data-selected-line] {\n [data-column-number] {\n color: var(--diffs-selection-number-fg);\n background-color: var(--diffs-bg-selection-number);\n }\n\n [data-column-content] {\n background-color: var(--diffs-bg-selection);\n }\n }\n\n [data-line-type='context-expanded'],\n [data-line-type='change-addition'],\n [data-line-type='change-deletion'] {\n &[data-selected-line] {\n [data-column-content] {\n background-color: light-dark(\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 82%,\n var(--diffs-selection-base)\n ),\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 75%,\n var(--diffs-selection-base)\n )\n );\n }\n\n [data-column-number] {\n color: var(--diffs-selection-number-fg);\n background-color: light-dark(\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 75%,\n var(--diffs-selection-base)\n ),\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 60%,\n var(--diffs-selection-base)\n )\n );\n }\n }\n }\n\n [data-error-wrapper] {\n overflow: auto;\n padding: var(--diffs-gap-block, var(--diffs-gap-fallback))\n var(--diffs-gap-inline, var(--diffs-gap-fallback));\n max-height: 400px;\n scrollbar-width: none;\n\n [data-error-message] {\n font-weight: bold;\n font-size: 18px;\n color: var(--diffs-deletion-base);\n }\n\n [data-error-stack] {\n color: var(--diffs-fg-number);\n }\n }\n}\n";
3
3
 
4
4
  //#endregion
5
5
  export { style_default as default };
package/dist/style.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","names":[],"sources":["../src/style.css"],"sourcesContent":["@layer base, theme, unsafe;\n\n@layer base {\n :host {\n --diffs-bg: #fff;\n --diffs-fg: #000;\n --diffs-font-fallback:\n 'SF Mono', Monaco, Consolas, 'Ubuntu Mono', 'Liberation Mono',\n 'Courier New', monospace;\n --diffs-header-font-fallback:\n system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',\n 'Noto Sans', 'Liberation Sans', Arial, sans-serif;\n\n --diffs-mixer: light-dark(black, white);\n --diffs-gap-fallback: 8px;\n\n /*\n // Available CSS Color Overrides\n --diffs-bg-buffer-override\n --diffs-bg-hover-override\n --diffs-bg-context-override\n --diffs-bg-separator-override\n\n --diffs-fg-number-override\n --diffs-fg-number-addition-override\n --diffs-fg-number-deletion-override\n\n --diffs-deletion-color-override\n --diffs-addition-color-override\n --diffs-modified-color-override\n\n --diffs-bg-deletion-override\n --diffs-bg-deletion-number-override\n --diffs-bg-deletion-hover-override\n --diffs-bg-deletion-emphasis-override\n\n --diffs-bg-addition-override\n --diffs-bg-addition-number-override\n --diffs-bg-addition-hover-override\n --diffs-bg-addition-emphasis-override\n\n // Line Selection Color Overrides (for enableLineSelection)\n --diffs-selection-color-override\n --diffs-bg-selection-override\n --diffs-bg-selection-number-override\n --diffs-bg-selection-background-override\n --diffs-bg-selection-number-background-override\n\n // Available CSS Layout Overrides\n --diffs-gap-inline\n --diffs-gap-block\n --diffs-gap-style\n --diffs-tab-size\n */\n\n color-scheme: light dark;\n display: block;\n font-family: var(\n --diffs-header-font-family,\n var(--diffs-header-font-fallback)\n );\n font-size: var(--diffs-font-size, 13px);\n line-height: var(--diffs-line-height, 20px);\n font-feature-settings: var(--diffs-font-features);\n }\n\n /* NOTE(mdo): Some semantic HTML elements (e.g. `pre`, `code`) have default\n * user-agent styles. These must be overridden to use our custom styles. */\n pre,\n code,\n [data-error-wrapper] {\n margin: 0;\n padding: 0;\n display: block;\n outline: none;\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n }\n\n *,\n *::before,\n *::after {\n box-sizing: border-box;\n }\n\n [data-icon-sprite] {\n display: none;\n }\n\n /* NOTE(mdo): Headers and separators are within pre/code, so we need to reset\n * their font-family explicitly. */\n [data-diffs-header],\n [data-separator] {\n font-family: var(\n --diffs-header-font-family,\n var(--diffs-header-font-fallback)\n );\n }\n\n [data-file-info] {\n padding: 10px;\n font-weight: 700;\n color: var(--fg);\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n background-color: color-mix(in lab, var(--bg) 98%, var(--fg));\n border-block: 1px solid color-mix(in lab, var(--bg) 95%, var(--fg));\n }\n\n [data-diffs-header],\n [data-diffs],\n [data-error-wrapper] {\n --diffs-bg: light-dark(var(--diffs-light-bg), var(--diffs-dark-bg));\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n --diffs-bg-buffer: var(\n --diffs-bg-buffer-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer))\n )\n );\n --diffs-bg-hover: var(\n --diffs-bg-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 97%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-mixer))\n )\n );\n --diffs-bg-context: var(\n --diffs-bg-context-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 98.5%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 92.5%, var(--diffs-mixer))\n )\n );\n --diffs-bg-separator: var(\n --diffs-bg-separator-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 96%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-mixer))\n )\n );\n\n --diffs-fg: light-dark(var(--diffs-light), var(--diffs-dark));\n --diffs-fg-number: var(\n --diffs-fg-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg)),\n color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg))\n )\n );\n\n --diffs-deletion-base: var(\n --diffs-deletion-color-override,\n light-dark(\n var(\n --diffs-light-deletion-color,\n var(--diffs-deletion-color, rgb(255, 0, 0))\n ),\n var(\n --diffs-dark-deletion-color,\n var(--diffs-deletion-color, rgb(255, 0, 0))\n )\n )\n );\n --diffs-addition-base: var(\n --diffs-addition-color-override,\n light-dark(\n var(\n --diffs-light-addition-color,\n var(--diffs-addition-color, rgb(0, 255, 0))\n ),\n var(\n --diffs-dark-addition-color,\n var(--diffs-addition-color, rgb(0, 255, 0))\n )\n )\n );\n --diffs-modified-base: var(\n --diffs-modified-color-override,\n light-dark(\n var(\n --diffs-light-modified-color,\n var(--diffs-modified-color, rgb(0, 0, 255))\n ),\n var(\n --diffs-dark-modified-color,\n var(--diffs-modified-color, rgb(0, 0, 255))\n )\n )\n );\n\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n --diffs-bg-deletion: var(\n --diffs-bg-deletion-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-number: var(\n --diffs-bg-deletion-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-hover: var(\n --diffs-bg-deletion-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-emphasis: var(\n --diffs-bg-deletion-emphasis-override,\n light-dark(\n rgb(from var(--diffs-deletion-base) r g b / 0.15),\n rgb(from var(--diffs-deletion-base) r g b / 0.2)\n )\n );\n\n --diffs-bg-addition: var(\n --diffs-bg-addition-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-number: var(\n --diffs-bg-addition-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-hover: var(\n --diffs-bg-addition-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 70%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-emphasis: var(\n --diffs-bg-addition-emphasis-override,\n light-dark(\n rgb(from var(--diffs-addition-base) r g b / 0.15),\n rgb(from var(--diffs-addition-base) r g b / 0.2)\n )\n );\n\n --diffs-selection-base: var(--diffs-modified-base);\n --diffs-selection-number-fg: light-dark(\n color-mix(in lab, var(--diffs-selection-base) 65%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-selection-base) 75%, var(--diffs-mixer))\n );\n --diffs-bg-selection: var(\n --diffs-bg-selection-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 82%, var(--diffs-selection-base)),\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-selection-base))\n )\n );\n --diffs-bg-selection-number: var(\n --diffs-bg-selection-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-selection-base)),\n color-mix(in lab, var(--diffs-bg) 60%, var(--diffs-selection-base))\n )\n );\n\n background-color: var(--diffs-bg);\n color: var(--diffs-fg);\n }\n\n [data-diffs] {\n --diffs-code-grid: minmax(min-content, max-content) 1fr;\n\n [data-column-content] span {\n color: light-dark(var(--diffs-light), var(--diffs-dark));\n font-weight: var(--diffs-light-font-weight);\n font-style: var(--diffs-light-font-style);\n }\n }\n\n [data-column-content] {\n background-color: var(--diffs-line-bg, 'transparent');\n grid-column: 2 / 3;\n }\n\n [data-diffs][data-dehydrated] {\n --diffs-code-grid: minmax(min-content, max-content) minmax(0, 1fr);\n }\n\n @media (prefers-color-scheme: dark) {\n [data-diffs-header],\n [data-diffs] {\n color-scheme: dark;\n }\n\n [data-diffs] [data-column-content] span {\n font-weight: var(--diffs-dark-font-weight);\n font-style: var(--diffs-dark-font-style);\n }\n }\n\n [data-diffs-header][data-theme-type='light'],\n [data-diffs][data-theme-type='light'] {\n color-scheme: light;\n }\n\n [data-diffs][data-theme-type='light'] [data-column-content] span {\n font-weight: var(--diffs-light-font-weight);\n font-style: var(--diffs-light-font-style);\n }\n\n [data-diffs-header][data-theme-type='dark'],\n [data-diffs][data-theme-type='dark'] {\n color-scheme: dark;\n }\n\n [data-diffs][data-theme-type='dark'] [data-column-content] span {\n font-weight: var(--diffs-dark-font-weight);\n font-style: var(--diffs-dark-font-style);\n }\n\n [data-type='split'][data-overflow='wrap'] {\n display: grid;\n grid-auto-flow: dense;\n grid-template-columns: repeat(2, var(--diffs-code-grid));\n }\n\n [data-type='split'][data-overflow='scroll'] {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 2px;\n }\n\n [data-code] {\n display: block;\n display: grid;\n grid-auto-flow: dense;\n grid-template-columns: var(--diffs-code-grid);\n overflow: scroll clip;\n overscroll-behavior-x: none;\n tab-size: var(--diffs-tab-size, 2);\n align-self: flex-start;\n padding-top: var(--diffs-gap-block, var(--diffs-gap-fallback));\n padding-bottom: max(\n 0px,\n calc(var(--diffs-gap-block, var(--diffs-gap-fallback)) - 6px)\n );\n }\n\n [data-code]::-webkit-scrollbar {\n width: 0;\n height: 6px;\n }\n\n [data-code]::-webkit-scrollbar-track {\n background: transparent;\n }\n\n [data-code]::-webkit-scrollbar-thumb {\n background-color: transparent;\n border: 1px solid transparent;\n background-clip: content-box;\n border-radius: 3px;\n }\n\n [data-diffs]:hover [data-code]::-webkit-scrollbar-thumb {\n background-color: var(--diffs-bg-context);\n }\n\n [data-code]::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n\n /*\n * If we apply these rules globally it will mean that webkit will opt into the\n * standards compliant version of custom css scrollbars, which we do not want\n * because the custom stuff will look better\n */\n @supports (-moz-appearance: none) {\n [data-code] {\n scrollbar-width: thin;\n scrollbar-color: var(--diffs-bg-context) transparent;\n padding-bottom: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n }\n\n [data-diffs][data-type='split'][data-overflow='wrap'] {\n padding-block: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n\n [data-diffs-header] ~ [data-diffs] [data-code],\n [data-diffs-header] ~ [data-diffs][data-overflow='wrap'] {\n padding-top: 0;\n }\n\n [data-type='split'][data-overflow='wrap'] [data-code] {\n display: contents;\n }\n\n [data-line-annotation],\n [data-no-newline],\n [data-line] {\n position: relative;\n display: grid;\n grid-template-columns: subgrid;\n grid-column: 1 / 3;\n }\n\n [data-line-annotation][data-selected-line] {\n background-color: unset;\n\n &::before {\n content: '';\n position: sticky;\n top: 0;\n left: 0;\n display: block;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n background-color: var(--diffs-bg-selection-number);\n }\n\n [data-annotation-content] {\n background-color: var(--diffs-bg-selection);\n }\n }\n\n [data-interactive-lines] [data-line] {\n cursor: pointer;\n }\n\n [data-buffer] {\n position: sticky;\n left: 0;\n grid-column: 1 / 3;\n user-select: none;\n /* We multiply by 1.414 (√2) to better approximate the diagonal repeat distance */\n background-image: repeating-linear-gradient(\n -45deg,\n transparent,\n transparent calc(3px * 1.414),\n var(--diffs-bg-buffer) calc(3px * 1.414),\n var(--diffs-bg-buffer) calc(4px * 1.414)\n );\n min-height: 1lh;\n width: var(--diffs-column-width, auto);\n }\n\n [data-separator] {\n grid-column: span 2;\n }\n\n [data-separator='metadata'],\n [data-separator]:empty {\n min-height: 4px;\n background-color: var(--diffs-bg-separator);\n display: grid;\n grid-template-columns: subgrid;\n }\n\n [data-separator-wrapper] {\n user-select: none;\n fill: currentColor;\n overflow: hidden;\n }\n\n [data-separator='metadata'] [data-separator-wrapper] {\n grid-column: 2 / 3;\n width: var(--diffs-column-content-width);\n position: sticky;\n left: var(--diffs-column-number-width);\n padding: 4px 1ch;\n }\n\n [data-separator='line-info'] {\n margin-block: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n\n [data-separator='line-info'][data-separator-first] {\n margin-top: 0;\n }\n\n [data-separator='line-info'][data-separator-last] {\n margin-bottom: 0;\n }\n\n [data-separator='line-info'] [data-separator-wrapper] {\n position: sticky;\n display: flex;\n align-items: center;\n gap: 2px;\n width: auto;\n width: calc(var(--diffs-column-width) - var(--diffs-gap-fallback));\n border-radius: 6px;\n }\n\n @media (pointer: fine) {\n [data-separator-wrapper][data-separator-multi-button] {\n display: grid;\n grid-template-columns: auto minmax(0, 1fr);\n grid-template-rows: 15px 15px;\n\n [data-expand-button] {\n height: 15px;\n }\n }\n\n [data-type='split']\n [data-additions]\n [data-separator-wrapper][data-separator-multi-button] {\n grid-template-columns: minmax(0, 1fr) auto;\n }\n\n [data-type='split'] [data-additions] [data-expand-button] {\n grid-column: 2;\n }\n\n [data-type='split'] [data-additions] [data-separator-content] {\n grid-column: 1;\n }\n }\n\n [data-expand-button],\n [data-separator-content] {\n display: flex;\n align-items: center;\n background-color: var(--diffs-bg-separator);\n }\n\n [data-expand-button] {\n justify-content: center;\n flex-shrink: 0;\n cursor: pointer;\n width: 32px;\n height: 32px;\n opacity: 0.65;\n }\n\n [data-hover-slot] {\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n display: flex;\n justify-content: flex-end;\n }\n\n @media (pointer: fine) {\n [data-expand-button]:hover {\n opacity: 1;\n }\n\n [data-line]:hover {\n z-index: 2;\n }\n }\n\n [data-expand-up] [data-icon] {\n transform: scaleY(-1);\n }\n\n [data-separator-content] {\n flex: 1 1 auto;\n padding: 0 1ch;\n height: 32px;\n opacity: 0.65;\n overflow: hidden;\n justify-content: flex-start;\n\n grid-column: 2;\n grid-row: 1 / -1;\n }\n\n [data-unmodified-lines] {\n display: block;\n overflow: hidden;\n min-width: 0;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 0 1 auto;\n }\n\n [data-type='split'] [data-additions] [data-separator-content] {\n justify-content: flex-end;\n }\n\n [data-type='file']\n [data-code]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n margin-left: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n margin-right: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n width: calc(\n var(--diffs-column-width) -\n (var(--diffs-gap-inline, var(--diffs-gap-fallback)) * 2)\n );\n }\n\n [data-type='split']\n [data-deletions]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: var(--diffs-gap-fallback);\n margin-left: var(--diffs-gap-fallback);\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n [data-type='split']\n [data-additions]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: 0;\n margin-right: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n flex-direction: row-reverse;\n }\n\n [data-line] {\n background-color: var(--diffs-bg);\n color: var(--diffs-fg);\n }\n\n [data-type='split'][data-overflow='wrap'] [data-deletions] {\n [data-line-annotation],\n [data-buffer],\n [data-line],\n [data-separator] {\n grid-column: 1 / 3;\n }\n }\n\n [data-line-annotation] {\n min-height: var(--diffs-annotation-min-height, 0);\n background-color: var(--diffs-bg-context);\n z-index: 3;\n }\n\n [data-type='split'][data-overflow='wrap'] [data-additions] {\n [data-line-annotation],\n [data-buffer],\n [data-line],\n [data-separator] {\n margin-left: 2px;\n grid-column: 3 / 5;\n }\n }\n\n [data-separator='custom'] {\n display: grid;\n grid-template-columns: subgrid;\n }\n\n [data-column-content],\n [data-column-number] {\n position: relative;\n padding-inline: 1ch;\n }\n\n [data-indicators='classic'] [data-column-content] {\n padding-inline-start: 2ch;\n }\n\n [data-indicators='classic'] {\n [data-line-type='change-addition'] [data-column-content]::before,\n [data-line-type='change-deletion'] [data-column-content]::before {\n display: inline-block;\n width: 1ch;\n height: 1lh;\n position: absolute;\n top: 0;\n left: 0;\n user-select: none;\n }\n\n [data-line-type='change-addition'] [data-column-content]::before {\n content: '+';\n color: var(--diffs-addition-base);\n }\n\n [data-line-type='change-deletion'] [data-column-content]::before {\n content: '-';\n color: var(--diffs-deletion-base);\n }\n }\n\n [data-indicators='bars'] {\n [data-line-type='change-deletion'] [data-column-number]::before,\n [data-line-type='change-addition'] [data-column-number]::before {\n content: '';\n display: block;\n width: 4px;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n user-select: none;\n }\n\n [data-line-type='change-deletion'] [data-column-number]::before {\n background-image: linear-gradient(\n 0deg,\n var(--diffs-bg-deletion) 50%,\n var(--diffs-deletion-base) 50%\n );\n background-repeat: repeat;\n background-size: 2px 2px;\n background-size: calc(1lh / round(1lh / 2px)) calc(1lh / round(1lh / 2px));\n }\n\n [data-line-type='change-addition'] [data-column-number]::before {\n background-color: var(--diffs-addition-base);\n }\n }\n\n [data-overflow='wrap'] [data-column-content],\n [data-overflow='wrap'] [data-annotation-content] {\n white-space: pre-wrap;\n word-break: break-word;\n }\n\n [data-overflow='scroll'] [data-column-content] {\n white-space: pre;\n min-height: 1lh;\n }\n\n [data-column-number] {\n grid-column: 1 / 2;\n box-sizing: content-box;\n text-align: right;\n position: sticky;\n left: 0;\n user-select: none;\n background-color: var(--diffs-bg);\n color: var(--diffs-fg-number);\n z-index: 1;\n min-width: var(\n --diffs-min-number-column-width,\n var(--diffs-min-number-column-width-default, 3ch)\n );\n padding-left: 2ch;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n }\n\n [data-disable-line-numbers] {\n &[data-indicators='bars'] [data-column-number] {\n min-width: 4px;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n }\n\n [data-column-number] {\n border-right: none;\n min-width: 0;\n padding: 0;\n }\n\n [data-line-number-content] {\n display: none;\n }\n\n [data-hover-slot] {\n right: unset;\n left: 0;\n justify-content: flex-start;\n }\n\n &[data-indicators='bars'] [data-hover-slot] {\n /* Using 5px here because theres a 1px separator after the bar */\n left: 5px;\n }\n }\n\n [data-interactive-line-numbers] [data-column-number] {\n cursor: pointer;\n }\n\n [data-diff-span] {\n border-radius: 3px;\n box-decoration-break: clone;\n }\n\n [data-line-type='change-addition'] {\n [data-column-number] {\n color: var(\n --diffs-fg-number-addition-override,\n var(--diffs-addition-base)\n );\n }\n\n [data-diff-span] {\n background-color: var(--diffs-bg-addition-emphasis);\n }\n }\n\n [data-line-type='change-deletion'] {\n [data-column-number] {\n color: var(\n --diffs-fg-number-deletion-override,\n var(--diffs-deletion-base)\n );\n }\n\n [data-diff-span] {\n background-color: var(--diffs-bg-deletion-emphasis);\n }\n }\n\n [data-background] [data-line-type='change-addition'] {\n --diffs-line-bg: var(--diffs-bg-addition);\n\n [data-column-number] {\n background-color: var(--diffs-bg-addition-number);\n }\n }\n\n [data-background] [data-line-type='change-deletion'] {\n --diffs-line-bg: var(--diffs-bg-deletion);\n\n [data-column-number] {\n background-color: var(--diffs-bg-deletion-number);\n }\n }\n\n [data-line-type='context-expanded'] {\n --diffs-line-bg: var(--diffs-bg-context);\n\n [data-column-number] {\n background-color: var(--diffs-bg-context);\n }\n }\n\n /* By wrapping hovers in a pointer: fine, we ensure that mobile devices don't\n* require a double click */\n @media (pointer: fine) {\n [data-line]:hover:not([data-selected-line]) {\n [data-column-number],\n [data-column-content] {\n background-color: var(--diffs-bg-hover);\n }\n }\n\n [data-background] [data-line]:hover:not([data-selected-line]) {\n &[data-line-type='change-deletion'] [data-column-number],\n &[data-line-type='change-deletion'] [data-column-content] {\n background-color: var(--diffs-bg-deletion-hover);\n }\n\n &[data-line-type='change-addition'] [data-column-number],\n &[data-line-type='change-addition'] [data-column-content] {\n background-color: var(--diffs-bg-addition-hover);\n }\n }\n }\n\n [data-diffs-header] {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n min-height: calc(\n 1lh + (var(--diffs-gap-block, var(--diffs-gap-fallback)) * 3)\n );\n padding-inline: 16px;\n }\n\n [data-header-content] {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n min-width: 0;\n white-space: nowrap;\n }\n\n [data-header-content] [data-prev-name],\n [data-header-content] [data-title] {\n direction: rtl;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n white-space: nowrap;\n }\n\n [data-prev-name] {\n opacity: 0.7;\n }\n\n [data-rename-icon] {\n fill: currentColor;\n flex-shrink: 0;\n flex-grow: 0;\n }\n\n [data-diffs-header] [data-metadata] {\n display: flex;\n align-items: center;\n gap: 1ch;\n white-space: nowrap;\n }\n\n [data-diffs-header] [data-additions-count] {\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n color: var(--diffs-addition-base);\n }\n\n [data-diffs-header] [data-deletions-count] {\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n color: var(--diffs-deletion-base);\n }\n\n [data-no-newline] {\n user-select: none;\n\n [data-column-content] {\n opacity: 0.6;\n }\n }\n\n [data-annotation-content] {\n position: sticky;\n left: var(--diffs-column-number-width, 0);\n grid-column: 2 / -1;\n width: var(--diffs-column-content-width, auto);\n align-self: flex-start;\n z-index: 2;\n height: 100%;\n }\n\n /* Undo some of the stuff that the 'pre' tag does */\n [data-annotation-slot] {\n text-wrap-mode: wrap;\n word-break: normal;\n white-space-collapse: collapse;\n }\n\n [data-change-icon] {\n fill: currentColor;\n flex-shrink: 0;\n }\n\n [data-change-icon='change'],\n [data-change-icon='rename-pure'],\n [data-change-icon='rename-changed'] {\n color: var(--diffs-modified-base);\n }\n\n [data-change-icon='new'] {\n color: var(--diffs-addition-base);\n }\n\n [data-change-icon='deleted'] {\n color: var(--diffs-deletion-base);\n }\n\n [data-change-icon='file'] {\n opacity: 0.6;\n }\n\n /* Line selection highlighting */\n [data-line-type='context'][data-selected-line] {\n [data-column-number] {\n color: var(--diffs-selection-number-fg);\n background-color: var(--diffs-bg-selection-number);\n }\n\n [data-column-content] {\n background-color: var(--diffs-bg-selection);\n }\n }\n\n [data-line-type='context-expanded'],\n [data-line-type='change-addition'],\n [data-line-type='change-deletion'] {\n &[data-selected-line] {\n [data-column-content] {\n background-color: light-dark(\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 82%,\n var(--diffs-selection-base)\n ),\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 75%,\n var(--diffs-selection-base)\n )\n );\n }\n\n [data-column-number] {\n color: var(--diffs-selection-number-fg);\n background-color: light-dark(\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 75%,\n var(--diffs-selection-base)\n ),\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 60%,\n var(--diffs-selection-base)\n )\n );\n }\n }\n }\n\n [data-error-wrapper] {\n overflow: auto;\n padding: var(--diffs-gap-block, var(--diffs-gap-fallback))\n var(--diffs-gap-inline, var(--diffs-gap-fallback));\n max-height: 400px;\n scrollbar-width: none;\n\n [data-error-message] {\n font-weight: bold;\n font-size: 18px;\n color: var(--diffs-deletion-base);\n }\n\n [data-error-stack] {\n color: var(--diffs-fg-number);\n }\n }\n}\n"],"mappings":";oBAAA"}
1
+ {"version":3,"file":"style.js","names":[],"sources":["../src/style.css"],"sourcesContent":["@layer base, theme, unsafe;\n\n@layer base {\n :host {\n --diffs-bg: #fff;\n --diffs-fg: #000;\n --diffs-font-fallback:\n 'SF Mono', Monaco, Consolas, 'Ubuntu Mono', 'Liberation Mono',\n 'Courier New', monospace;\n --diffs-header-font-fallback:\n system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',\n 'Noto Sans', 'Liberation Sans', Arial, sans-serif;\n\n --diffs-mixer: light-dark(black, white);\n --diffs-gap-fallback: 8px;\n\n /*\n // Available CSS Color Overrides\n --diffs-bg-buffer-override\n --diffs-bg-hover-override\n --diffs-bg-context-override\n --diffs-bg-separator-override\n\n --diffs-fg-number-override\n --diffs-fg-number-addition-override\n --diffs-fg-number-deletion-override\n\n --diffs-deletion-color-override\n --diffs-addition-color-override\n --diffs-modified-color-override\n\n --diffs-bg-deletion-override\n --diffs-bg-deletion-number-override\n --diffs-bg-deletion-hover-override\n --diffs-bg-deletion-emphasis-override\n\n --diffs-bg-addition-override\n --diffs-bg-addition-number-override\n --diffs-bg-addition-hover-override\n --diffs-bg-addition-emphasis-override\n\n // Line Selection Color Overrides (for enableLineSelection)\n --diffs-selection-color-override\n --diffs-bg-selection-override\n --diffs-bg-selection-number-override\n --diffs-bg-selection-background-override\n --diffs-bg-selection-number-background-override\n\n // Available CSS Layout Overrides\n --diffs-gap-inline\n --diffs-gap-block\n --diffs-gap-style\n --diffs-tab-size\n */\n\n color-scheme: light dark;\n display: block;\n font-family: var(\n --diffs-header-font-family,\n var(--diffs-header-font-fallback)\n );\n font-size: var(--diffs-font-size, 13px);\n line-height: var(--diffs-line-height, 20px);\n font-feature-settings: var(--diffs-font-features);\n }\n\n /* NOTE(mdo): Some semantic HTML elements (e.g. `pre`, `code`) have default\n * user-agent styles. These must be overridden to use our custom styles. */\n pre,\n code,\n [data-error-wrapper] {\n margin: 0;\n padding: 0;\n display: block;\n outline: none;\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n }\n\n *,\n *::before,\n *::after {\n box-sizing: border-box;\n }\n\n [data-icon-sprite] {\n display: none;\n }\n\n /* NOTE(mdo): Headers and separators are within pre/code, so we need to reset\n * their font-family explicitly. */\n [data-diffs-header],\n [data-separator] {\n font-family: var(\n --diffs-header-font-family,\n var(--diffs-header-font-fallback)\n );\n }\n\n [data-file-info] {\n padding: 10px;\n font-weight: 700;\n color: var(--fg);\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n background-color: color-mix(in lab, var(--bg) 98%, var(--fg));\n border-block: 1px solid color-mix(in lab, var(--bg) 95%, var(--fg));\n }\n\n [data-diffs-header],\n [data-diffs],\n [data-error-wrapper] {\n --diffs-bg: light-dark(var(--diffs-light-bg), var(--diffs-dark-bg));\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n --diffs-bg-buffer: var(\n --diffs-bg-buffer-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer))\n )\n );\n --diffs-bg-hover: var(\n --diffs-bg-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 97%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-mixer))\n )\n );\n --diffs-bg-context: var(\n --diffs-bg-context-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 98.5%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 92.5%, var(--diffs-mixer))\n )\n );\n --diffs-bg-separator: var(\n --diffs-bg-separator-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 96%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-mixer))\n )\n );\n\n --diffs-fg: light-dark(var(--diffs-light), var(--diffs-dark));\n --diffs-fg-number: var(\n --diffs-fg-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg)),\n color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg))\n )\n );\n\n --diffs-deletion-base: var(\n --diffs-deletion-color-override,\n light-dark(\n var(\n --diffs-light-deletion-color,\n var(--diffs-deletion-color, rgb(255, 0, 0))\n ),\n var(\n --diffs-dark-deletion-color,\n var(--diffs-deletion-color, rgb(255, 0, 0))\n )\n )\n );\n --diffs-addition-base: var(\n --diffs-addition-color-override,\n light-dark(\n var(\n --diffs-light-addition-color,\n var(--diffs-addition-color, rgb(0, 255, 0))\n ),\n var(\n --diffs-dark-addition-color,\n var(--diffs-addition-color, rgb(0, 255, 0))\n )\n )\n );\n --diffs-modified-base: var(\n --diffs-modified-color-override,\n light-dark(\n var(\n --diffs-light-modified-color,\n var(--diffs-modified-color, rgb(0, 0, 255))\n ),\n var(\n --diffs-dark-modified-color,\n var(--diffs-modified-color, rgb(0, 0, 255))\n )\n )\n );\n\n /* NOTE(amadeus): we cannot use 'in oklch' because current versions of cursor\n * and vscode use an older build of chrome that appears to have a bug with\n * color-mix and 'in oklch', so use 'in lab' instead */\n --diffs-bg-deletion: var(\n --diffs-bg-deletion-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-number: var(\n --diffs-bg-deletion-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-hover: var(\n --diffs-bg-deletion-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base)),\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-deletion-base))\n )\n );\n --diffs-bg-deletion-emphasis: var(\n --diffs-bg-deletion-emphasis-override,\n light-dark(\n rgb(from var(--diffs-deletion-base) r g b / 0.15),\n rgb(from var(--diffs-deletion-base) r g b / 0.2)\n )\n );\n\n --diffs-bg-addition: var(\n --diffs-bg-addition-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-number: var(\n --diffs-bg-addition-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 91%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-hover: var(\n --diffs-bg-addition-hover-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base)),\n color-mix(in lab, var(--diffs-bg) 70%, var(--diffs-addition-base))\n )\n );\n --diffs-bg-addition-emphasis: var(\n --diffs-bg-addition-emphasis-override,\n light-dark(\n rgb(from var(--diffs-addition-base) r g b / 0.15),\n rgb(from var(--diffs-addition-base) r g b / 0.2)\n )\n );\n\n --diffs-selection-base: var(--diffs-modified-base);\n --diffs-selection-number-fg: light-dark(\n color-mix(in lab, var(--diffs-selection-base) 65%, var(--diffs-mixer)),\n color-mix(in lab, var(--diffs-selection-base) 75%, var(--diffs-mixer))\n );\n --diffs-bg-selection: var(\n --diffs-bg-selection-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 82%, var(--diffs-selection-base)),\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-selection-base))\n )\n );\n --diffs-bg-selection-number: var(\n --diffs-bg-selection-number-override,\n light-dark(\n color-mix(in lab, var(--diffs-bg) 75%, var(--diffs-selection-base)),\n color-mix(in lab, var(--diffs-bg) 60%, var(--diffs-selection-base))\n )\n );\n\n background-color: var(--diffs-bg);\n color: var(--diffs-fg);\n }\n\n [data-diffs] {\n --diffs-code-grid: minmax(min-content, max-content) 1fr;\n\n [data-column-content] span {\n color: light-dark(\n var(--diffs-token-light, var(--diffs-light)),\n var(--diffs-token-dark, var(--diffs-dark))\n );\n font-weight: var(--diffs-token-light-font-weight, inherit);\n font-style: var(--diffs-token-light-font-style, inherit);\n text-decoration: var(--diffs-token-light-text-decoration, inherit);\n }\n }\n\n /* Since span is a pretty innocuous selector, we need to make sure we don't\n * apply tokenized BG colors to diff-spans */\n [data-column-content] span:not([data-diff-span]) {\n background-color: light-dark(\n var(--diffs-token-light-bg, inherit),\n var(--diffs-token-dark-bg, inherit)\n );\n }\n\n [data-column-content] {\n background-color: var(--diffs-line-bg, 'transparent');\n grid-column: 2 / 3;\n }\n\n [data-diffs][data-dehydrated] {\n --diffs-code-grid: minmax(min-content, max-content) minmax(0, 1fr);\n }\n\n @media (prefers-color-scheme: dark) {\n [data-diffs-header],\n [data-diffs] {\n color-scheme: dark;\n }\n\n [data-diffs] [data-column-content] span {\n font-weight: var(--diffs-token-dark-font-weight, inherit);\n font-style: var(--diffs-token-dark-font-style, inherit);\n text-decoration: var(--diffs-token-dark-text-decoration, inherit);\n }\n }\n\n [data-diffs-header][data-theme-type='light'],\n [data-diffs][data-theme-type='light'] {\n color-scheme: light;\n }\n\n [data-diffs][data-theme-type='light'] [data-column-content] span {\n font-weight: var(--diffs-token-light-font-weight, inherit);\n font-style: var(--diffs-token-light-font-style, inherit);\n text-decoration: var(--diffs-token-light-text-decoration, inherit);\n }\n\n [data-diffs-header][data-theme-type='dark'],\n [data-diffs][data-theme-type='dark'] {\n color-scheme: dark;\n }\n\n [data-diffs][data-theme-type='dark'] [data-column-content] span {\n font-weight: var(--diffs-token-dark-font-weight, inherit);\n font-style: var(--diffs-token-dark-font-style, inherit);\n text-decoration: var(--diffs-token-dark-text-decoration, inherit);\n }\n\n [data-type='split'][data-overflow='wrap'] {\n display: grid;\n grid-auto-flow: dense;\n grid-template-columns: repeat(2, var(--diffs-code-grid));\n }\n\n [data-type='split'][data-overflow='scroll'] {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 2px;\n }\n\n [data-code] {\n display: block;\n display: grid;\n grid-auto-flow: dense;\n grid-template-columns: var(--diffs-code-grid);\n overflow: scroll clip;\n overscroll-behavior-x: none;\n tab-size: var(--diffs-tab-size, 2);\n align-self: flex-start;\n padding-top: var(--diffs-gap-block, var(--diffs-gap-fallback));\n padding-bottom: max(\n 0px,\n calc(var(--diffs-gap-block, var(--diffs-gap-fallback)) - 6px)\n );\n }\n\n [data-code]::-webkit-scrollbar {\n width: 0;\n height: 6px;\n }\n\n [data-code]::-webkit-scrollbar-track {\n background: transparent;\n }\n\n [data-code]::-webkit-scrollbar-thumb {\n background-color: transparent;\n border: 1px solid transparent;\n background-clip: content-box;\n border-radius: 3px;\n }\n\n [data-diffs]:hover [data-code]::-webkit-scrollbar-thumb {\n background-color: var(--diffs-bg-context);\n }\n\n [data-code]::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n\n /*\n * If we apply these rules globally it will mean that webkit will opt into the\n * standards compliant version of custom css scrollbars, which we do not want\n * because the custom stuff will look better\n */\n @supports (-moz-appearance: none) {\n [data-code] {\n scrollbar-width: thin;\n scrollbar-color: var(--diffs-bg-context) transparent;\n padding-bottom: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n }\n\n [data-diffs][data-type='split'][data-overflow='wrap'] {\n padding-block: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n\n [data-diffs-header] ~ [data-diffs] [data-code],\n [data-diffs-header] ~ [data-diffs][data-overflow='wrap'] {\n padding-top: 0;\n }\n\n [data-type='split'][data-overflow='wrap'] [data-code] {\n display: contents;\n }\n\n [data-line-annotation],\n [data-no-newline],\n [data-line] {\n position: relative;\n display: grid;\n grid-template-columns: subgrid;\n grid-column: 1 / 3;\n }\n\n [data-line-annotation][data-selected-line] {\n background-color: unset;\n\n &::before {\n content: '';\n position: sticky;\n top: 0;\n left: 0;\n display: block;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n background-color: var(--diffs-bg-selection-number);\n }\n\n [data-annotation-content] {\n background-color: var(--diffs-bg-selection);\n }\n }\n\n [data-interactive-lines] [data-line] {\n cursor: pointer;\n }\n\n [data-buffer] {\n position: sticky;\n left: 0;\n grid-column: 1 / 3;\n user-select: none;\n /* We multiply by 1.414 (√2) to better approximate the diagonal repeat distance */\n background-image: repeating-linear-gradient(\n -45deg,\n transparent,\n transparent calc(3px * 1.414),\n var(--diffs-bg-buffer) calc(3px * 1.414),\n var(--diffs-bg-buffer) calc(4px * 1.414)\n );\n min-height: 1lh;\n width: var(--diffs-column-width, auto);\n }\n\n [data-separator] {\n grid-column: span 2;\n }\n\n [data-separator='metadata'],\n [data-separator]:empty {\n min-height: 4px;\n background-color: var(--diffs-bg-separator);\n display: grid;\n grid-template-columns: subgrid;\n }\n\n [data-separator-wrapper] {\n user-select: none;\n fill: currentColor;\n overflow: hidden;\n }\n\n [data-separator='metadata'] [data-separator-wrapper] {\n grid-column: 2 / 3;\n width: var(--diffs-column-content-width);\n position: sticky;\n left: var(--diffs-column-number-width);\n padding: 4px 1ch;\n }\n\n [data-separator='line-info'] {\n margin-block: var(--diffs-gap-block, var(--diffs-gap-fallback));\n }\n\n [data-separator='line-info'][data-separator-first] {\n margin-top: 0;\n }\n\n [data-separator='line-info'][data-separator-last] {\n margin-bottom: 0;\n }\n\n [data-separator='line-info'] [data-separator-wrapper] {\n position: sticky;\n display: flex;\n align-items: center;\n gap: 2px;\n width: auto;\n width: calc(var(--diffs-column-width) - var(--diffs-gap-fallback));\n border-radius: 6px;\n }\n\n @media (pointer: fine) {\n [data-separator-wrapper][data-separator-multi-button] {\n display: grid;\n grid-template-columns: auto minmax(0, 1fr);\n grid-template-rows: 15px 15px;\n\n [data-expand-button] {\n height: 15px;\n }\n }\n\n [data-type='split']\n [data-additions]\n [data-separator-wrapper][data-separator-multi-button] {\n grid-template-columns: minmax(0, 1fr) auto;\n }\n\n [data-type='split'] [data-additions] [data-expand-button] {\n grid-column: 2;\n }\n\n [data-type='split'] [data-additions] [data-separator-content] {\n grid-column: 1;\n }\n }\n\n [data-expand-button],\n [data-separator-content] {\n display: flex;\n align-items: center;\n background-color: var(--diffs-bg-separator);\n }\n\n [data-expand-button] {\n justify-content: center;\n flex-shrink: 0;\n cursor: pointer;\n width: 32px;\n height: 32px;\n opacity: 0.65;\n }\n\n [data-hover-slot] {\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n display: flex;\n justify-content: flex-end;\n }\n\n @media (pointer: fine) {\n [data-expand-button]:hover {\n opacity: 1;\n }\n\n [data-line]:hover {\n z-index: 2;\n }\n }\n\n [data-expand-up] [data-icon] {\n transform: scaleY(-1);\n }\n\n [data-separator-content] {\n flex: 1 1 auto;\n padding: 0 1ch;\n height: 32px;\n opacity: 0.65;\n overflow: hidden;\n justify-content: flex-start;\n\n grid-column: 2;\n grid-row: 1 / -1;\n }\n\n [data-unmodified-lines] {\n display: block;\n overflow: hidden;\n min-width: 0;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 0 1 auto;\n }\n\n [data-type='split'] [data-additions] [data-separator-content] {\n justify-content: flex-end;\n }\n\n [data-type='file']\n [data-code]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n margin-left: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n margin-right: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n width: calc(\n var(--diffs-column-width) -\n (var(--diffs-gap-inline, var(--diffs-gap-fallback)) * 2)\n );\n }\n\n [data-type='split']\n [data-deletions]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: var(--diffs-gap-fallback);\n margin-left: var(--diffs-gap-fallback);\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n [data-type='split']\n [data-additions]\n [data-separator='line-info']\n [data-separator-wrapper] {\n left: 0;\n margin-right: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n flex-direction: row-reverse;\n }\n\n [data-line] {\n background-color: var(--diffs-bg);\n color: var(--diffs-fg);\n }\n\n [data-type='split'][data-overflow='wrap'] [data-deletions] {\n [data-line-annotation],\n [data-buffer],\n [data-line],\n [data-separator] {\n grid-column: 1 / 3;\n }\n }\n\n [data-line-annotation] {\n min-height: var(--diffs-annotation-min-height, 0);\n background-color: var(--diffs-bg-context);\n z-index: 3;\n }\n\n [data-type='split'][data-overflow='wrap'] [data-additions] {\n [data-line-annotation],\n [data-buffer],\n [data-line],\n [data-separator] {\n margin-left: 2px;\n grid-column: 3 / 5;\n }\n }\n\n [data-separator='custom'] {\n display: grid;\n grid-template-columns: subgrid;\n }\n\n [data-column-content],\n [data-column-number] {\n position: relative;\n padding-inline: 1ch;\n }\n\n [data-indicators='classic'] [data-column-content] {\n padding-inline-start: 2ch;\n }\n\n [data-indicators='classic'] {\n [data-line-type='change-addition'] [data-column-content]::before,\n [data-line-type='change-deletion'] [data-column-content]::before {\n display: inline-block;\n width: 1ch;\n height: 1lh;\n position: absolute;\n top: 0;\n left: 0;\n user-select: none;\n }\n\n [data-line-type='change-addition'] [data-column-content]::before {\n content: '+';\n color: var(--diffs-addition-base);\n }\n\n [data-line-type='change-deletion'] [data-column-content]::before {\n content: '-';\n color: var(--diffs-deletion-base);\n }\n }\n\n [data-indicators='bars'] {\n [data-line-type='change-deletion'] [data-column-number]::before,\n [data-line-type='change-addition'] [data-column-number]::before {\n content: '';\n display: block;\n width: 4px;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n user-select: none;\n }\n\n [data-line-type='change-deletion'] [data-column-number]::before {\n background-image: linear-gradient(\n 0deg,\n var(--diffs-bg-deletion) 50%,\n var(--diffs-deletion-base) 50%\n );\n background-repeat: repeat;\n background-size: 2px 2px;\n background-size: calc(1lh / round(1lh / 2px)) calc(1lh / round(1lh / 2px));\n }\n\n [data-line-type='change-addition'] [data-column-number]::before {\n background-color: var(--diffs-addition-base);\n }\n }\n\n [data-overflow='wrap'] [data-column-content],\n [data-overflow='wrap'] [data-annotation-content] {\n white-space: pre-wrap;\n word-break: break-word;\n }\n\n [data-overflow='scroll'] [data-column-content] {\n white-space: pre;\n min-height: 1lh;\n }\n\n [data-column-number] {\n grid-column: 1 / 2;\n box-sizing: content-box;\n text-align: right;\n position: sticky;\n left: 0;\n user-select: none;\n background-color: var(--diffs-bg);\n color: var(--diffs-fg-number);\n z-index: 1;\n min-width: var(\n --diffs-min-number-column-width,\n var(--diffs-min-number-column-width-default, 3ch)\n );\n padding-left: 2ch;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n }\n\n [data-disable-line-numbers] {\n &[data-indicators='bars'] [data-column-number] {\n min-width: 4px;\n border-right: var(--diffs-gap-style, 1px solid var(--diffs-bg));\n }\n\n [data-column-number] {\n border-right: none;\n min-width: 0;\n padding: 0;\n }\n\n [data-line-number-content] {\n display: none;\n }\n\n [data-hover-slot] {\n right: unset;\n left: 0;\n justify-content: flex-start;\n }\n\n &[data-indicators='bars'] [data-hover-slot] {\n /* Using 5px here because theres a 1px separator after the bar */\n left: 5px;\n }\n }\n\n [data-interactive-line-numbers] [data-column-number] {\n cursor: pointer;\n }\n\n [data-diff-span] {\n border-radius: 3px;\n box-decoration-break: clone;\n }\n\n [data-line-type='change-addition'] {\n [data-column-number] {\n color: var(\n --diffs-fg-number-addition-override,\n var(--diffs-addition-base)\n );\n }\n\n [data-diff-span] {\n background-color: var(--diffs-bg-addition-emphasis);\n }\n }\n\n [data-line-type='change-deletion'] {\n [data-column-number] {\n color: var(\n --diffs-fg-number-deletion-override,\n var(--diffs-deletion-base)\n );\n }\n\n [data-diff-span] {\n background-color: var(--diffs-bg-deletion-emphasis);\n }\n }\n\n [data-background] [data-line-type='change-addition'] {\n --diffs-line-bg: var(--diffs-bg-addition);\n\n [data-column-number] {\n background-color: var(--diffs-bg-addition-number);\n }\n }\n\n [data-background] [data-line-type='change-deletion'] {\n --diffs-line-bg: var(--diffs-bg-deletion);\n\n [data-column-number] {\n background-color: var(--diffs-bg-deletion-number);\n }\n }\n\n [data-line-type='context-expanded'] {\n --diffs-line-bg: var(--diffs-bg-context);\n\n [data-column-number] {\n background-color: var(--diffs-bg-context);\n }\n }\n\n /* By wrapping hovers in a pointer: fine, we ensure that mobile devices don't\n* require a double click */\n @media (pointer: fine) {\n [data-line]:hover:not([data-selected-line]) {\n [data-column-number],\n [data-column-content] {\n background-color: var(--diffs-bg-hover);\n }\n }\n\n [data-background] [data-line]:hover:not([data-selected-line]) {\n &[data-line-type='change-deletion'] [data-column-number],\n &[data-line-type='change-deletion'] [data-column-content] {\n background-color: var(--diffs-bg-deletion-hover);\n }\n\n &[data-line-type='change-addition'] [data-column-number],\n &[data-line-type='change-addition'] [data-column-content] {\n background-color: var(--diffs-bg-addition-hover);\n }\n }\n }\n\n [data-diffs-header] {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n min-height: calc(\n 1lh + (var(--diffs-gap-block, var(--diffs-gap-fallback)) * 3)\n );\n padding-inline: 16px;\n }\n\n [data-header-content] {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--diffs-gap-inline, var(--diffs-gap-fallback));\n min-width: 0;\n white-space: nowrap;\n }\n\n [data-header-content] [data-prev-name],\n [data-header-content] [data-title] {\n direction: rtl;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n white-space: nowrap;\n }\n\n [data-prev-name] {\n opacity: 0.7;\n }\n\n [data-rename-icon] {\n fill: currentColor;\n flex-shrink: 0;\n flex-grow: 0;\n }\n\n [data-diffs-header] [data-metadata] {\n display: flex;\n align-items: center;\n gap: 1ch;\n white-space: nowrap;\n }\n\n [data-diffs-header] [data-additions-count] {\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n color: var(--diffs-addition-base);\n }\n\n [data-diffs-header] [data-deletions-count] {\n font-family: var(--diffs-font-family, var(--diffs-font-fallback));\n color: var(--diffs-deletion-base);\n }\n\n [data-no-newline] {\n user-select: none;\n\n [data-column-content] {\n opacity: 0.6;\n }\n }\n\n [data-annotation-content] {\n position: sticky;\n left: var(--diffs-column-number-width, 0);\n grid-column: 2 / -1;\n width: var(--diffs-column-content-width, auto);\n align-self: flex-start;\n z-index: 2;\n height: 100%;\n }\n\n /* Undo some of the stuff that the 'pre' tag does */\n [data-annotation-slot] {\n text-wrap-mode: wrap;\n word-break: normal;\n white-space-collapse: collapse;\n }\n\n [data-change-icon] {\n fill: currentColor;\n flex-shrink: 0;\n }\n\n [data-change-icon='change'],\n [data-change-icon='rename-pure'],\n [data-change-icon='rename-changed'] {\n color: var(--diffs-modified-base);\n }\n\n [data-change-icon='new'] {\n color: var(--diffs-addition-base);\n }\n\n [data-change-icon='deleted'] {\n color: var(--diffs-deletion-base);\n }\n\n [data-change-icon='file'] {\n opacity: 0.6;\n }\n\n /* Line selection highlighting */\n [data-line-type='context'][data-selected-line] {\n [data-column-number] {\n color: var(--diffs-selection-number-fg);\n background-color: var(--diffs-bg-selection-number);\n }\n\n [data-column-content] {\n background-color: var(--diffs-bg-selection);\n }\n }\n\n [data-line-type='context-expanded'],\n [data-line-type='change-addition'],\n [data-line-type='change-deletion'] {\n &[data-selected-line] {\n [data-column-content] {\n background-color: light-dark(\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 82%,\n var(--diffs-selection-base)\n ),\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 75%,\n var(--diffs-selection-base)\n )\n );\n }\n\n [data-column-number] {\n color: var(--diffs-selection-number-fg);\n background-color: light-dark(\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 75%,\n var(--diffs-selection-base)\n ),\n color-mix(\n in lab,\n var(--diffs-line-bg, var(--diffs-bg)) 60%,\n var(--diffs-selection-base)\n )\n );\n }\n }\n }\n\n [data-error-wrapper] {\n overflow: auto;\n padding: var(--diffs-gap-block, var(--diffs-gap-fallback))\n var(--diffs-gap-inline, var(--diffs-gap-fallback));\n max-height: 400px;\n scrollbar-width: none;\n\n [data-error-message] {\n font-weight: bold;\n font-size: 18px;\n color: var(--diffs-deletion-base);\n }\n\n [data-error-stack] {\n color: var(--diffs-fg-number);\n }\n }\n}\n"],"mappings":";oBAAA"}
package/dist/types.d.ts CHANGED
@@ -59,7 +59,7 @@ interface FileDiffMetadata {
59
59
  newLines?: string[];
60
60
  cacheKey?: string;
61
61
  }
62
- type SupportedLanguages = BundledLanguage | "text";
62
+ type SupportedLanguages = BundledLanguage | "text" | "ansi";
63
63
  type HunkLineType = "context" | "expanded" | "addition" | "deletion" | "metadata";
64
64
  type ThemeTypes = "system" | "light" | "dark";
65
65
  type HunkSeparators = "simple" | "metadata" | "line-info" | "custom";
package/dist/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","names":[],"sources":["../src/types.ts"],"sourcesContent":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","names":[],"sources":["../src/types.ts"],"sourcesContent":[],"mappings":"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"}
package/dist/utils/formatCSSVariablePrefix.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  //#region src/utils/formatCSSVariablePrefix.d.ts
2
- declare function formatCSSVariablePrefix(prefix?: string): string;
2
+ declare function formatCSSVariablePrefix(type: "global" | "token"): string;
3
3
  //#endregion
4
4
  export { formatCSSVariablePrefix };
5
5
  //# sourceMappingURL=formatCSSVariablePrefix.d.ts.map
package/dist/utils/formatCSSVariablePrefix.js CHANGED
@@ -1,6 +1,6 @@
1
1
  //#region src/utils/formatCSSVariablePrefix.ts
2
- function formatCSSVariablePrefix(prefix = "diffs") {
3
- return `--${prefix}-`;
2
+ function formatCSSVariablePrefix(type) {
3
+ return `--${type === "token" ? "diffs-token" : "diffs"}-`;
4
4
  }
5
5
 
6
6
  //#endregion
package/dist/utils/formatCSSVariablePrefix.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"formatCSSVariablePrefix.js","names":[],"sources":["../../src/utils/formatCSSVariablePrefix.ts"],"sourcesContent":["export function formatCSSVariablePrefix(prefix: string = 'diffs') {\n return `--${prefix}-`;\n}\n"],"mappings":";AAAA,SAAgB,wBAAwB,SAAiB,SAAS;AAChE,QAAO,KAAK,OAAO"}
1
+ {"version":3,"file":"formatCSSVariablePrefix.js","names":[],"sources":["../../src/utils/formatCSSVariablePrefix.ts"],"sourcesContent":["export function formatCSSVariablePrefix(type: 'global' | 'token') {\n return `--${type === 'token' ? 'diffs-token' : 'diffs'}-`;\n}\n"],"mappings":";AAAA,SAAgB,wBAAwB,MAA0B;AAChE,QAAO,KAAK,SAAS,UAAU,gBAAgB,QAAQ"}
package/dist/utils/getHighlighterThemeStyles.js CHANGED
@@ -8,30 +8,30 @@ function getHighlighterThemeStyles({ theme = DEFAULT_THEMES, highlighter, prefix
8
8
  const themeData = highlighter.getTheme(theme);
9
9
  styles += `color:${themeData.fg};`;
10
10
  styles += `background-color:${themeData.bg};`;
11
- styles += `${formatCSSVariablePrefix(prefix)}fg:${themeData.fg};`;
12
- styles += `${formatCSSVariablePrefix(prefix)}bg:${themeData.bg};`;
11
+ styles += `${formatCSSVariablePrefix("global")}fg:${themeData.fg};`;
12
+ styles += `${formatCSSVariablePrefix("global")}bg:${themeData.bg};`;
13
13
  styles += getThemeVariables(themeData, prefix);
14
14
  } else {
15
15
  let themeData = highlighter.getTheme(theme.dark);
16
- styles += `${formatCSSVariablePrefix(prefix)}dark:${themeData.fg};`;
17
- styles += `${formatCSSVariablePrefix(prefix)}dark-bg:${themeData.bg};`;
18
- styles += getThemeVariables(themeData, prefix, "dark");
16
+ styles += `${formatCSSVariablePrefix("global")}dark:${themeData.fg};`;
17
+ styles += `${formatCSSVariablePrefix("global")}dark-bg:${themeData.bg};`;
18
+ styles += getThemeVariables(themeData, "dark");
19
19
  themeData = highlighter.getTheme(theme.light);
20
- styles += `${formatCSSVariablePrefix(prefix)}light:${themeData.fg};`;
21
- styles += `${formatCSSVariablePrefix(prefix)}light-bg:${themeData.bg};`;
22
- styles += getThemeVariables(themeData, prefix, "light");
20
+ styles += `${formatCSSVariablePrefix("global")}light:${themeData.fg};`;
21
+ styles += `${formatCSSVariablePrefix("global")}light-bg:${themeData.bg};`;
22
+ styles += getThemeVariables(themeData, "light");
23
23
  }
24
24
  return styles;
25
25
  }
26
- function getThemeVariables(themeData, prefix, modePrefix) {
26
+ function getThemeVariables(themeData, modePrefix) {
27
27
  modePrefix = modePrefix != null ? `${modePrefix}-` : "";
28
28
  let styles = "";
29
29
  const additionGreen = themeData.colors?.["gitDecoration.addedResourceForeground"] ?? themeData.colors?.["terminal.ansiGreen"];
30
- if (additionGreen != null) styles += `${formatCSSVariablePrefix(prefix)}${modePrefix}addition-color:${additionGreen};`;
30
+ if (additionGreen != null) styles += `${formatCSSVariablePrefix("global")}${modePrefix}addition-color:${additionGreen};`;
31
31
  const deletionRed = themeData.colors?.["gitDecoration.deletedResourceForeground"] ?? themeData.colors?.["terminal.ansiRed"];
32
- if (deletionRed != null) styles += `${formatCSSVariablePrefix(prefix)}${modePrefix}deletion-color:${deletionRed};`;
32
+ if (deletionRed != null) styles += `${formatCSSVariablePrefix("global")}${modePrefix}deletion-color:${deletionRed};`;
33
33
  const modifiedBlue = themeData.colors?.["gitDecoration.modifiedResourceForeground"] ?? themeData.colors?.["terminal.ansiBlue"];
34
- if (modifiedBlue != null) styles += `${formatCSSVariablePrefix(prefix)}${modePrefix}modified-color:${modifiedBlue};`;
34
+ if (modifiedBlue != null) styles += `${formatCSSVariablePrefix("global")}${modePrefix}modified-color:${modifiedBlue};`;
35
35
  return styles;
36
36
  }
37
37
 
package/dist/utils/getHighlighterThemeStyles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"getHighlighterThemeStyles.js","names":[],"sources":["../../src/utils/getHighlighterThemeStyles.ts"],"sourcesContent":["import { DEFAULT_THEMES } from '../constants';\nimport type {\n DiffsHighlighter,\n DiffsThemeNames,\n ThemeRegistrationResolved,\n ThemesType,\n} from '../types';\nimport { formatCSSVariablePrefix } from './formatCSSVariablePrefix';\n\ninterface GetHighlighterThemeStylesProps {\n theme?: DiffsThemeNames | ThemesType;\n highlighter: DiffsHighlighter;\n prefix?: string;\n}\n\n// FIXME(amadeus): We'll probably need to\n// re-think this when it comes to removing inline\n// styles\nexport function getHighlighterThemeStyles({\n theme = DEFAULT_THEMES,\n highlighter,\n prefix,\n}: GetHighlighterThemeStylesProps): string {\n let styles = '';\n if (typeof theme === 'string') {\n const themeData = highlighter.getTheme(theme);\n styles += `color:${themeData.fg};`;\n styles += `background-color:${themeData.bg};`;\n styles += `${formatCSSVariablePrefix(prefix)}fg:${themeData.fg};`;\n styles += `${formatCSSVariablePrefix(prefix)}bg:${themeData.bg};`;\n styles += getThemeVariables(themeData, prefix);\n } else {\n let themeData = highlighter.getTheme(theme.dark);\n styles += `${formatCSSVariablePrefix(prefix)}dark:${themeData.fg};`;\n styles += `${formatCSSVariablePrefix(prefix)}dark-bg:${themeData.bg};`;\n styles += getThemeVariables(themeData, prefix, 'dark');\n\n themeData = highlighter.getTheme(theme.light);\n styles += `${formatCSSVariablePrefix(prefix)}light:${themeData.fg};`;\n styles += `${formatCSSVariablePrefix(prefix)}light-bg:${themeData.bg};`;\n styles += getThemeVariables(themeData, prefix, 'light');\n }\n return styles;\n}\n\nfunction getThemeVariables(\n themeData: ThemeRegistrationResolved,\n prefix?: string,\n modePrefix?: string\n) {\n modePrefix = modePrefix != null ? `${modePrefix}-` : '';\n let styles = '';\n const additionGreen =\n themeData.colors?.['gitDecoration.addedResourceForeground'] ??\n themeData.colors?.['terminal.ansiGreen'];\n if (additionGreen != null) {\n styles += `${formatCSSVariablePrefix(prefix)}${modePrefix}addition-color:${additionGreen};`;\n }\n const deletionRed =\n themeData.colors?.['gitDecoration.deletedResourceForeground'] ??\n themeData.colors?.['terminal.ansiRed'];\n if (deletionRed != null) {\n styles += `${formatCSSVariablePrefix(prefix)}${modePrefix}deletion-color:${deletionRed};`;\n }\n const modifiedBlue =\n themeData.colors?.['gitDecoration.modifiedResourceForeground'] ??\n themeData.colors?.['terminal.ansiBlue'];\n if (modifiedBlue != null) {\n styles += `${formatCSSVariablePrefix(prefix)}${modePrefix}modified-color:${modifiedBlue};`;\n }\n return styles;\n}\n"],"mappings":";;;;AAkBA,SAAgB,0BAA0B,EACxC,QAAQ,gBACR,aACA,UACyC;CACzC,IAAI,SAAS;AACb,KAAI,OAAO,UAAU,UAAU;EAC7B,MAAM,YAAY,YAAY,SAAS,MAAM;AAC7C,YAAU,SAAS,UAAU,GAAG;AAChC,YAAU,oBAAoB,UAAU,GAAG;AAC3C,YAAU,GAAG,wBAAwB,OAAO,CAAC,KAAK,UAAU,GAAG;AAC/D,YAAU,GAAG,wBAAwB,OAAO,CAAC,KAAK,UAAU,GAAG;AAC/D,YAAU,kBAAkB,WAAW,OAAO;QACzC;EACL,IAAI,YAAY,YAAY,SAAS,MAAM,KAAK;AAChD,YAAU,GAAG,wBAAwB,OAAO,CAAC,OAAO,UAAU,GAAG;AACjE,YAAU,GAAG,wBAAwB,OAAO,CAAC,UAAU,UAAU,GAAG;AACpE,YAAU,kBAAkB,WAAW,QAAQ,OAAO;AAEtD,cAAY,YAAY,SAAS,MAAM,MAAM;AAC7C,YAAU,GAAG,wBAAwB,OAAO,CAAC,QAAQ,UAAU,GAAG;AAClE,YAAU,GAAG,wBAAwB,OAAO,CAAC,WAAW,UAAU,GAAG;AACrE,YAAU,kBAAkB,WAAW,QAAQ,QAAQ;;AAEzD,QAAO;;AAGT,SAAS,kBACP,WACA,QACA,YACA;AACA,cAAa,cAAc,OAAO,GAAG,WAAW,KAAK;CACrD,IAAI,SAAS;CACb,MAAM,gBACJ,UAAU,SAAS,4CACnB,UAAU,SAAS;AACrB,KAAI,iBAAiB,KACnB,WAAU,GAAG,wBAAwB,OAAO,GAAG,WAAW,iBAAiB,cAAc;CAE3F,MAAM,cACJ,UAAU,SAAS,8CACnB,UAAU,SAAS;AACrB,KAAI,eAAe,KACjB,WAAU,GAAG,wBAAwB,OAAO,GAAG,WAAW,iBAAiB,YAAY;CAEzF,MAAM,eACJ,UAAU,SAAS,+CACnB,UAAU,SAAS;AACrB,KAAI,gBAAgB,KAClB,WAAU,GAAG,wBAAwB,OAAO,GAAG,WAAW,iBAAiB,aAAa;AAE1F,QAAO"}
1
+ {"version":3,"file":"getHighlighterThemeStyles.js","names":[],"sources":["../../src/utils/getHighlighterThemeStyles.ts"],"sourcesContent":["import { DEFAULT_THEMES } from '../constants';\nimport type {\n DiffsHighlighter,\n DiffsThemeNames,\n ThemeRegistrationResolved,\n ThemesType,\n} from '../types';\nimport { formatCSSVariablePrefix } from './formatCSSVariablePrefix';\n\ninterface GetHighlighterThemeStylesProps {\n theme?: DiffsThemeNames | ThemesType;\n highlighter: DiffsHighlighter;\n prefix?: string;\n}\n\n// FIXME(amadeus): We'll probably need to\n// re-think this when it comes to removing inline\n// styles\nexport function getHighlighterThemeStyles({\n theme = DEFAULT_THEMES,\n highlighter,\n prefix,\n}: GetHighlighterThemeStylesProps): string {\n let styles = '';\n if (typeof theme === 'string') {\n const themeData = highlighter.getTheme(theme);\n styles += `color:${themeData.fg};`;\n styles += `background-color:${themeData.bg};`;\n styles += `${formatCSSVariablePrefix('global')}fg:${themeData.fg};`;\n styles += `${formatCSSVariablePrefix('global')}bg:${themeData.bg};`;\n styles += getThemeVariables(themeData, prefix);\n } else {\n let themeData = highlighter.getTheme(theme.dark);\n styles += `${formatCSSVariablePrefix('global')}dark:${themeData.fg};`;\n styles += `${formatCSSVariablePrefix('global')}dark-bg:${themeData.bg};`;\n styles += getThemeVariables(themeData, 'dark');\n\n themeData = highlighter.getTheme(theme.light);\n styles += `${formatCSSVariablePrefix('global')}light:${themeData.fg};`;\n styles += `${formatCSSVariablePrefix('global')}light-bg:${themeData.bg};`;\n styles += getThemeVariables(themeData, 'light');\n }\n return styles;\n}\n\nfunction getThemeVariables(\n themeData: ThemeRegistrationResolved,\n modePrefix?: string\n) {\n modePrefix = modePrefix != null ? `${modePrefix}-` : '';\n let styles = '';\n const additionGreen =\n themeData.colors?.['gitDecoration.addedResourceForeground'] ??\n themeData.colors?.['terminal.ansiGreen'];\n if (additionGreen != null) {\n styles += `${formatCSSVariablePrefix('global')}${modePrefix}addition-color:${additionGreen};`;\n }\n const deletionRed =\n themeData.colors?.['gitDecoration.deletedResourceForeground'] ??\n themeData.colors?.['terminal.ansiRed'];\n if (deletionRed != null) {\n styles += `${formatCSSVariablePrefix('global')}${modePrefix}deletion-color:${deletionRed};`;\n }\n const modifiedBlue =\n themeData.colors?.['gitDecoration.modifiedResourceForeground'] ??\n themeData.colors?.['terminal.ansiBlue'];\n if (modifiedBlue != null) {\n styles += `${formatCSSVariablePrefix('global')}${modePrefix}modified-color:${modifiedBlue};`;\n }\n return styles;\n}\n"],"mappings":";;;;AAkBA,SAAgB,0BAA0B,EACxC,QAAQ,gBACR,aACA,UACyC;CACzC,IAAI,SAAS;AACb,KAAI,OAAO,UAAU,UAAU;EAC7B,MAAM,YAAY,YAAY,SAAS,MAAM;AAC7C,YAAU,SAAS,UAAU,GAAG;AAChC,YAAU,oBAAoB,UAAU,GAAG;AAC3C,YAAU,GAAG,wBAAwB,SAAS,CAAC,KAAK,UAAU,GAAG;AACjE,YAAU,GAAG,wBAAwB,SAAS,CAAC,KAAK,UAAU,GAAG;AACjE,YAAU,kBAAkB,WAAW,OAAO;QACzC;EACL,IAAI,YAAY,YAAY,SAAS,MAAM,KAAK;AAChD,YAAU,GAAG,wBAAwB,SAAS,CAAC,OAAO,UAAU,GAAG;AACnE,YAAU,GAAG,wBAAwB,SAAS,CAAC,UAAU,UAAU,GAAG;AACtE,YAAU,kBAAkB,WAAW,OAAO;AAE9C,cAAY,YAAY,SAAS,MAAM,MAAM;AAC7C,YAAU,GAAG,wBAAwB,SAAS,CAAC,QAAQ,UAAU,GAAG;AACpE,YAAU,GAAG,wBAAwB,SAAS,CAAC,WAAW,UAAU,GAAG;AACvE,YAAU,kBAAkB,WAAW,QAAQ;;AAEjD,QAAO;;AAGT,SAAS,kBACP,WACA,YACA;AACA,cAAa,cAAc,OAAO,GAAG,WAAW,KAAK;CACrD,IAAI,SAAS;CACb,MAAM,gBACJ,UAAU,SAAS,4CACnB,UAAU,SAAS;AACrB,KAAI,iBAAiB,KACnB,WAAU,GAAG,wBAAwB,SAAS,GAAG,WAAW,iBAAiB,cAAc;CAE7F,MAAM,cACJ,UAAU,SAAS,8CACnB,UAAU,SAAS;AACrB,KAAI,eAAe,KACjB,WAAU,GAAG,wBAAwB,SAAS,GAAG,WAAW,iBAAiB,YAAY;CAE3F,MAAM,eACJ,UAAU,SAAS,+CACnB,UAAU,SAAS;AACrB,KAAI,gBAAgB,KAClB,WAAU,GAAG,wBAAwB,SAAS,GAAG,WAAW,iBAAiB,aAAa;AAE5F,QAAO"}
package/dist/utils/renderDiffWithHighlighter.js CHANGED
@@ -305,7 +305,7 @@ function renderTwoFiles({ oldFile, newFile, oldInfo, newInfo, highlighter, oldDe
305
305
  transformers,
306
306
  decorations: void 0,
307
307
  defaultColor: false,
308
- cssVariablePrefix: formatCSSVariablePrefix()
308
+ cssVariablePrefix: formatCSSVariablePrefix("token")
309
309
  } : {
310
310
  ...options,
311
311
  lang: "text",
@@ -313,7 +313,7 @@ function renderTwoFiles({ oldFile, newFile, oldInfo, newInfo, highlighter, oldDe
313
313
  transformers,
314
314
  decorations: void 0,
315
315
  defaultColor: false,
316
- cssVariablePrefix: formatCSSVariablePrefix()
316
+ cssVariablePrefix: formatCSSVariablePrefix("token")
317
317
  };
318
318
  })();
319
319
  return {
package/dist/utils/renderDiffWithHighlighter.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"renderDiffWithHighlighter.js","names":["hunks: RenderDiffFilesResult[]","deletionSpans: [0 | 1, string][]","additionSpans: [0 | 1, string][]","oldInfo: Record<number, LineInfo | undefined>","newInfo: Record<number, LineInfo | undefined>","oldDecorations: DecorationItem[]","newDecorations: DecorationItem[]","hastConfig: CodeToHastOptions<DiffsThemeNames>"],"sources":["../../src/utils/renderDiffWithHighlighter.ts"],"sourcesContent":["import { diffChars, diffWordsWithSpace } from 'diff';\n\nimport { DEFAULT_THEMES } from '../constants';\nimport type {\n CodeToHastOptions,\n DecorationItem,\n DiffsHighlighter,\n DiffsThemeNames,\n FileContents,\n FileDiffMetadata,\n Hunk,\n LineDiffTypes,\n LineInfo,\n RenderDiffFilesResult,\n RenderDiffOptions,\n SupportedLanguages,\n ThemedDiffResult,\n} from '../types';\nimport { cleanLastNewline } from './cleanLastNewline';\nimport { createTransformerWithState } from './createTransformerWithState';\nimport { formatCSSVariablePrefix } from './formatCSSVariablePrefix';\nimport { getFiletypeFromFileName } from './getFiletypeFromFileName';\nimport { getHighlighterThemeStyles } from './getHighlighterThemeStyles';\nimport { getLineNodes } from './getLineNodes';\nimport {\n createDiffSpanDecoration,\n pushOrJoinSpan,\n} from './parseDiffDecorations';\n\nexport function renderDiffWithHighlighter(\n diff: FileDiffMetadata,\n highlighter: DiffsHighlighter,\n options: RenderDiffOptions,\n forcePlainText = false\n): ThemedDiffResult {\n const baseThemeType = (() => {\n const theme = options.theme ?? DEFAULT_THEMES;\n if (typeof theme === 'string') {\n return highlighter.getTheme(theme).type;\n }\n return undefined;\n })();\n const themeStyles = getHighlighterThemeStyles({\n theme: options.theme,\n highlighter,\n });\n // If we've received a diff with both files\n if (diff.newLines != null && diff.oldLines != null) {\n const {\n oldContent,\n newContent,\n oldInfo,\n newInfo,\n oldDecorations,\n newDecorations,\n } = processLines({\n hunks: diff.hunks,\n oldLines: diff.oldLines,\n newLines: diff.newLines,\n lineDiffType: options.lineDiffType,\n });\n const oldFile = {\n name: diff.prevName ?? diff.name,\n contents: oldContent,\n };\n const newFile = {\n name: diff.name,\n contents: newContent,\n };\n const code = renderTwoFiles({\n oldFile,\n oldInfo,\n oldDecorations,\n\n newFile,\n newInfo,\n newDecorations,\n\n highlighter,\n options,\n languageOverride: forcePlainText ? 'text' : diff.lang,\n });\n return { code, themeStyles, baseThemeType };\n }\n const hunks: RenderDiffFilesResult[] = [];\n let splitLineIndex = 0;\n let unifiedLineIndex = 0;\n for (const hunk of diff.hunks) {\n const {\n oldContent,\n newContent,\n oldInfo,\n newInfo,\n oldDecorations,\n newDecorations,\n splitLineIndex: newSplitLineIndex,\n unifiedLineIndex: newUnifiedLineIndex,\n } = processLines({\n hunks: [hunk],\n splitLineIndex,\n unifiedLineIndex,\n lineDiffType: options.lineDiffType,\n });\n const oldFile = {\n name: diff.prevName ?? diff.name,\n contents: oldContent,\n };\n const newFile = {\n name: diff.name,\n contents: newContent,\n };\n hunks.push(\n renderTwoFiles({\n oldFile,\n oldInfo,\n oldDecorations,\n\n newFile,\n newInfo,\n newDecorations,\n\n highlighter,\n options,\n languageOverride: forcePlainText ? 'text' : diff.lang,\n })\n );\n splitLineIndex = newSplitLineIndex;\n unifiedLineIndex = newUnifiedLineIndex;\n }\n\n const code = (() => {\n if (hunks.length <= 1) {\n const hunk = hunks[0] ?? { oldLines: [], newLines: [] };\n if (hunk.newLines.length === 0 || hunk.oldLines.length === 0) {\n return hunk;\n }\n }\n return { hunks };\n })();\n\n return { code, themeStyles, baseThemeType };\n}\n\ninterface ProcessLineDiffProps {\n oldLine: string | undefined;\n newLine: string | undefined;\n oldLineIndex: number;\n newLineIndex: number;\n oldDecorations: DecorationItem[];\n newDecorations: DecorationItem[];\n lineDiffType: LineDiffTypes;\n}\n\nfunction computeLineDiffDecorations({\n oldLine,\n newLine,\n oldLineIndex,\n newLineIndex,\n oldDecorations,\n newDecorations,\n lineDiffType,\n}: ProcessLineDiffProps) {\n if (oldLine == null || newLine == null || lineDiffType === 'none') {\n return;\n }\n oldLine = cleanLastNewline(oldLine);\n newLine = cleanLastNewline(newLine);\n // NOTE(amadeus): Because we visually trim trailing newlines when rendering,\n // we also gotta make sure the diff parsing doesn't include the newline\n // character that could be there...\n const lineDiff =\n lineDiffType === 'char'\n ? diffChars(oldLine, newLine)\n : diffWordsWithSpace(oldLine, newLine);\n const deletionSpans: [0 | 1, string][] = [];\n const additionSpans: [0 | 1, string][] = [];\n const enableJoin = lineDiffType === 'word-alt';\n for (const item of lineDiff) {\n const isLastItem = item === lineDiff[lineDiff.length - 1];\n if (!item.added && !item.removed) {\n pushOrJoinSpan({\n item,\n arr: deletionSpans,\n enableJoin,\n isNeutral: true,\n isLastItem,\n });\n pushOrJoinSpan({\n item,\n arr: additionSpans,\n enableJoin,\n isNeutral: true,\n isLastItem,\n });\n } else if (item.removed) {\n pushOrJoinSpan({ item, arr: deletionSpans, enableJoin, isLastItem });\n } else {\n pushOrJoinSpan({ item, arr: additionSpans, enableJoin, isLastItem });\n }\n }\n let spanIndex = 0;\n for (const span of deletionSpans) {\n if (span[0] === 1) {\n oldDecorations.push(\n createDiffSpanDecoration({\n // Decoration indexes start at 0\n line: oldLineIndex - 1,\n spanStart: spanIndex,\n spanLength: span[1].length,\n })\n );\n }\n spanIndex += span[1].length;\n }\n spanIndex = 0;\n for (const span of additionSpans) {\n if (span[0] === 1) {\n newDecorations.push(\n createDiffSpanDecoration({\n // Decoration indexes start at 0\n line: newLineIndex - 1,\n spanStart: spanIndex,\n spanLength: span[1].length,\n })\n );\n }\n spanIndex += span[1].length;\n }\n}\n\ninterface ProcessLinesProps {\n hunks: Hunk[];\n oldLines?: string[];\n newLines?: string[];\n splitLineIndex?: number;\n unifiedLineIndex?: number;\n newLineIndex?: number;\n oldLineIndex?: number;\n lineDiffType: LineDiffTypes;\n}\n\nfunction processLines({\n hunks,\n oldLines,\n newLines,\n splitLineIndex = 0,\n unifiedLineIndex = 0,\n lineDiffType,\n}: ProcessLinesProps) {\n const oldInfo: Record<number, LineInfo | undefined> = {};\n const newInfo: Record<number, LineInfo | undefined> = {};\n const oldDecorations: DecorationItem[] = [];\n const newDecorations: DecorationItem[] = [];\n let newLineIndex = 1;\n let oldLineIndex = 1;\n let newLineNumber = 1;\n let oldLineNumber = 1;\n let oldContent = '';\n let newContent = '';\n for (const hunk of hunks) {\n // If there's content prior to the hunk, lets fill it up\n while (\n oldLines != null &&\n newLines != null &&\n newLineIndex < hunk.additionStart &&\n oldLineIndex < hunk.deletionStart\n ) {\n oldInfo[oldLineIndex] = {\n type: 'context-expanded',\n lineNumber: oldLineNumber,\n altLineNumber: newLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n newInfo[newLineIndex] = {\n type: 'context-expanded',\n lineNumber: newLineNumber,\n altLineNumber: oldLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n oldContent += oldLines[oldLineIndex - 1];\n newContent += newLines[newLineIndex - 1];\n oldLineIndex++;\n newLineIndex++;\n oldLineNumber++;\n newLineNumber++;\n splitLineIndex++;\n unifiedLineIndex++;\n }\n oldLineNumber = hunk.deletionStart;\n newLineNumber = hunk.additionStart;\n\n // Lets process the actual hunk content\n for (const hunkContent of hunk.hunkContent) {\n if (hunkContent.type === 'context') {\n for (const line of hunkContent.lines) {\n oldInfo[oldLineIndex] = {\n type: 'context',\n lineNumber: oldLineNumber,\n altLineNumber: newLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n newInfo[newLineIndex] = {\n type: 'context',\n lineNumber: newLineNumber,\n altLineNumber: oldLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n oldContent += line;\n newContent += line;\n oldLineIndex++;\n newLineIndex++;\n newLineNumber++;\n oldLineNumber++;\n splitLineIndex++;\n unifiedLineIndex++;\n }\n } else {\n const len = Math.max(\n hunkContent.additions.length,\n hunkContent.deletions.length\n );\n let i = 0;\n // NOTE(amadeus): Since we iterate through deletions and additions\n // simultaneously, we have to create a secondary iterator for\n // unifiedLineIndex, and then when we're done, add the combined lengths\n // of additions/deletions to the main variable\n let _unifiedLineIndex = unifiedLineIndex;\n while (i < len) {\n const oldLine = hunkContent.deletions[i];\n const newLine = hunkContent.additions[i];\n computeLineDiffDecorations({\n newLine,\n oldLine,\n oldLineIndex,\n newLineIndex,\n oldDecorations,\n newDecorations,\n lineDiffType,\n });\n if (oldLine != null) {\n oldInfo[oldLineIndex] = {\n type: 'change-deletion',\n lineNumber: oldLineNumber,\n lineIndex: `${_unifiedLineIndex},${splitLineIndex}`,\n };\n oldContent += oldLine;\n oldLineIndex++;\n oldLineNumber++;\n }\n if (newLine != null) {\n newInfo[newLineIndex] = {\n type: 'change-addition',\n lineNumber: newLineNumber,\n lineIndex: `${_unifiedLineIndex + hunkContent.deletions.length},${splitLineIndex}`,\n };\n newContent += newLine;\n newLineIndex++;\n newLineNumber++;\n }\n splitLineIndex++;\n _unifiedLineIndex++;\n i++;\n }\n unifiedLineIndex +=\n hunkContent.additions.length + hunkContent.deletions.length;\n }\n }\n\n if (\n oldLines == null ||\n newLines == null ||\n hunk !== hunks[hunks.length - 1]\n )\n continue;\n // If we are on the last hunk, we should fully iterate through the rest\n // of the lines\n while (oldLineIndex <= oldLines.length || newLineIndex <= oldLines.length) {\n const oldLine = oldLines[oldLineIndex - 1];\n const newLine = newLines[newLineIndex - 1];\n if (oldLine == null && newLine == null) {\n break;\n }\n if (oldLine != null) {\n oldInfo[oldLineIndex] = {\n type: 'context-expanded',\n lineNumber: oldLineNumber,\n altLineNumber: newLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n oldContent += oldLine;\n oldLineIndex++;\n oldLineNumber++;\n }\n if (newLine != null) {\n newInfo[newLineIndex] = {\n type: 'context-expanded',\n lineNumber: newLineNumber,\n altLineNumber: oldLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n newContent += newLine;\n newLineIndex++;\n newLineNumber++;\n }\n splitLineIndex++;\n unifiedLineIndex++;\n }\n }\n return {\n oldContent,\n newContent,\n oldInfo,\n newInfo,\n oldDecorations,\n newDecorations,\n splitLineIndex,\n unifiedLineIndex,\n };\n}\n\ninterface RenderTwoFilesProps {\n oldFile: FileContents;\n newFile: FileContents;\n oldInfo: Record<number, LineInfo | undefined>;\n newInfo: Record<number, LineInfo | undefined>;\n oldDecorations: DecorationItem[];\n newDecorations: DecorationItem[];\n options: RenderDiffOptions;\n highlighter: DiffsHighlighter;\n languageOverride: SupportedLanguages | undefined;\n}\n\nfunction renderTwoFiles({\n oldFile,\n newFile,\n oldInfo,\n newInfo,\n highlighter,\n oldDecorations,\n newDecorations,\n languageOverride,\n options: { theme: themeOrThemes = DEFAULT_THEMES, ...options },\n}: RenderTwoFilesProps) {\n const oldLang = languageOverride ?? getFiletypeFromFileName(oldFile.name);\n const newLang = languageOverride ?? getFiletypeFromFileName(newFile.name);\n const { state, transformers } = createTransformerWithState();\n const hastConfig: CodeToHastOptions<DiffsThemeNames> = (() => {\n return typeof themeOrThemes === 'string'\n ? {\n ...options,\n // language will be overwritten for each highlight\n lang: 'text',\n theme: themeOrThemes,\n transformers,\n decorations: undefined,\n defaultColor: false,\n cssVariablePrefix: formatCSSVariablePrefix(),\n }\n : {\n ...options,\n // language will be overwritten for each highlight\n lang: 'text',\n themes: themeOrThemes,\n transformers,\n decorations: undefined,\n defaultColor: false,\n cssVariablePrefix: formatCSSVariablePrefix(),\n };\n })();\n\n const oldLines = (() => {\n if (oldFile.contents === '') {\n return [];\n }\n hastConfig.lang = oldLang;\n state.lineInfo = oldInfo;\n hastConfig.decorations = oldDecorations;\n return getLineNodes(\n highlighter.codeToHast(cleanLastNewline(oldFile.contents), hastConfig)\n );\n })();\n const newLines = (() => {\n if (newFile.contents === '') {\n return [];\n }\n hastConfig.lang = newLang;\n hastConfig.decorations = newDecorations;\n state.lineInfo = newInfo;\n return getLineNodes(\n highlighter.codeToHast(cleanLastNewline(newFile.contents), hastConfig)\n );\n })();\n\n return { oldLines, newLines };\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"renderDiffWithHighlighter.js","names":["hunks: RenderDiffFilesResult[]","deletionSpans: [0 | 1, string][]","additionSpans: [0 | 1, string][]","oldInfo: Record<number, LineInfo | undefined>","newInfo: Record<number, LineInfo | undefined>","oldDecorations: DecorationItem[]","newDecorations: DecorationItem[]","hastConfig: CodeToHastOptions<DiffsThemeNames>"],"sources":["../../src/utils/renderDiffWithHighlighter.ts"],"sourcesContent":["import { diffChars, diffWordsWithSpace } from 'diff';\n\nimport { DEFAULT_THEMES } from '../constants';\nimport type {\n CodeToHastOptions,\n DecorationItem,\n DiffsHighlighter,\n DiffsThemeNames,\n FileContents,\n FileDiffMetadata,\n Hunk,\n LineDiffTypes,\n LineInfo,\n RenderDiffFilesResult,\n RenderDiffOptions,\n SupportedLanguages,\n ThemedDiffResult,\n} from '../types';\nimport { cleanLastNewline } from './cleanLastNewline';\nimport { createTransformerWithState } from './createTransformerWithState';\nimport { formatCSSVariablePrefix } from './formatCSSVariablePrefix';\nimport { getFiletypeFromFileName } from './getFiletypeFromFileName';\nimport { getHighlighterThemeStyles } from './getHighlighterThemeStyles';\nimport { getLineNodes } from './getLineNodes';\nimport {\n createDiffSpanDecoration,\n pushOrJoinSpan,\n} from './parseDiffDecorations';\n\nexport function renderDiffWithHighlighter(\n diff: FileDiffMetadata,\n highlighter: DiffsHighlighter,\n options: RenderDiffOptions,\n forcePlainText = false\n): ThemedDiffResult {\n const baseThemeType = (() => {\n const theme = options.theme ?? DEFAULT_THEMES;\n if (typeof theme === 'string') {\n return highlighter.getTheme(theme).type;\n }\n return undefined;\n })();\n const themeStyles = getHighlighterThemeStyles({\n theme: options.theme,\n highlighter,\n });\n // If we've received a diff with both files\n if (diff.newLines != null && diff.oldLines != null) {\n const {\n oldContent,\n newContent,\n oldInfo,\n newInfo,\n oldDecorations,\n newDecorations,\n } = processLines({\n hunks: diff.hunks,\n oldLines: diff.oldLines,\n newLines: diff.newLines,\n lineDiffType: options.lineDiffType,\n });\n const oldFile = {\n name: diff.prevName ?? diff.name,\n contents: oldContent,\n };\n const newFile = {\n name: diff.name,\n contents: newContent,\n };\n const code = renderTwoFiles({\n oldFile,\n oldInfo,\n oldDecorations,\n\n newFile,\n newInfo,\n newDecorations,\n\n highlighter,\n options,\n languageOverride: forcePlainText ? 'text' : diff.lang,\n });\n return { code, themeStyles, baseThemeType };\n }\n const hunks: RenderDiffFilesResult[] = [];\n let splitLineIndex = 0;\n let unifiedLineIndex = 0;\n for (const hunk of diff.hunks) {\n const {\n oldContent,\n newContent,\n oldInfo,\n newInfo,\n oldDecorations,\n newDecorations,\n splitLineIndex: newSplitLineIndex,\n unifiedLineIndex: newUnifiedLineIndex,\n } = processLines({\n hunks: [hunk],\n splitLineIndex,\n unifiedLineIndex,\n lineDiffType: options.lineDiffType,\n });\n const oldFile = {\n name: diff.prevName ?? diff.name,\n contents: oldContent,\n };\n const newFile = {\n name: diff.name,\n contents: newContent,\n };\n hunks.push(\n renderTwoFiles({\n oldFile,\n oldInfo,\n oldDecorations,\n\n newFile,\n newInfo,\n newDecorations,\n\n highlighter,\n options,\n languageOverride: forcePlainText ? 'text' : diff.lang,\n })\n );\n splitLineIndex = newSplitLineIndex;\n unifiedLineIndex = newUnifiedLineIndex;\n }\n\n const code = (() => {\n if (hunks.length <= 1) {\n const hunk = hunks[0] ?? { oldLines: [], newLines: [] };\n if (hunk.newLines.length === 0 || hunk.oldLines.length === 0) {\n return hunk;\n }\n }\n return { hunks };\n })();\n\n return { code, themeStyles, baseThemeType };\n}\n\ninterface ProcessLineDiffProps {\n oldLine: string | undefined;\n newLine: string | undefined;\n oldLineIndex: number;\n newLineIndex: number;\n oldDecorations: DecorationItem[];\n newDecorations: DecorationItem[];\n lineDiffType: LineDiffTypes;\n}\n\nfunction computeLineDiffDecorations({\n oldLine,\n newLine,\n oldLineIndex,\n newLineIndex,\n oldDecorations,\n newDecorations,\n lineDiffType,\n}: ProcessLineDiffProps) {\n if (oldLine == null || newLine == null || lineDiffType === 'none') {\n return;\n }\n oldLine = cleanLastNewline(oldLine);\n newLine = cleanLastNewline(newLine);\n // NOTE(amadeus): Because we visually trim trailing newlines when rendering,\n // we also gotta make sure the diff parsing doesn't include the newline\n // character that could be there...\n const lineDiff =\n lineDiffType === 'char'\n ? diffChars(oldLine, newLine)\n : diffWordsWithSpace(oldLine, newLine);\n const deletionSpans: [0 | 1, string][] = [];\n const additionSpans: [0 | 1, string][] = [];\n const enableJoin = lineDiffType === 'word-alt';\n for (const item of lineDiff) {\n const isLastItem = item === lineDiff[lineDiff.length - 1];\n if (!item.added && !item.removed) {\n pushOrJoinSpan({\n item,\n arr: deletionSpans,\n enableJoin,\n isNeutral: true,\n isLastItem,\n });\n pushOrJoinSpan({\n item,\n arr: additionSpans,\n enableJoin,\n isNeutral: true,\n isLastItem,\n });\n } else if (item.removed) {\n pushOrJoinSpan({ item, arr: deletionSpans, enableJoin, isLastItem });\n } else {\n pushOrJoinSpan({ item, arr: additionSpans, enableJoin, isLastItem });\n }\n }\n let spanIndex = 0;\n for (const span of deletionSpans) {\n if (span[0] === 1) {\n oldDecorations.push(\n createDiffSpanDecoration({\n // Decoration indexes start at 0\n line: oldLineIndex - 1,\n spanStart: spanIndex,\n spanLength: span[1].length,\n })\n );\n }\n spanIndex += span[1].length;\n }\n spanIndex = 0;\n for (const span of additionSpans) {\n if (span[0] === 1) {\n newDecorations.push(\n createDiffSpanDecoration({\n // Decoration indexes start at 0\n line: newLineIndex - 1,\n spanStart: spanIndex,\n spanLength: span[1].length,\n })\n );\n }\n spanIndex += span[1].length;\n }\n}\n\ninterface ProcessLinesProps {\n hunks: Hunk[];\n oldLines?: string[];\n newLines?: string[];\n splitLineIndex?: number;\n unifiedLineIndex?: number;\n newLineIndex?: number;\n oldLineIndex?: number;\n lineDiffType: LineDiffTypes;\n}\n\nfunction processLines({\n hunks,\n oldLines,\n newLines,\n splitLineIndex = 0,\n unifiedLineIndex = 0,\n lineDiffType,\n}: ProcessLinesProps) {\n const oldInfo: Record<number, LineInfo | undefined> = {};\n const newInfo: Record<number, LineInfo | undefined> = {};\n const oldDecorations: DecorationItem[] = [];\n const newDecorations: DecorationItem[] = [];\n let newLineIndex = 1;\n let oldLineIndex = 1;\n let newLineNumber = 1;\n let oldLineNumber = 1;\n let oldContent = '';\n let newContent = '';\n for (const hunk of hunks) {\n // If there's content prior to the hunk, lets fill it up\n while (\n oldLines != null &&\n newLines != null &&\n newLineIndex < hunk.additionStart &&\n oldLineIndex < hunk.deletionStart\n ) {\n oldInfo[oldLineIndex] = {\n type: 'context-expanded',\n lineNumber: oldLineNumber,\n altLineNumber: newLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n newInfo[newLineIndex] = {\n type: 'context-expanded',\n lineNumber: newLineNumber,\n altLineNumber: oldLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n oldContent += oldLines[oldLineIndex - 1];\n newContent += newLines[newLineIndex - 1];\n oldLineIndex++;\n newLineIndex++;\n oldLineNumber++;\n newLineNumber++;\n splitLineIndex++;\n unifiedLineIndex++;\n }\n oldLineNumber = hunk.deletionStart;\n newLineNumber = hunk.additionStart;\n\n // Lets process the actual hunk content\n for (const hunkContent of hunk.hunkContent) {\n if (hunkContent.type === 'context') {\n for (const line of hunkContent.lines) {\n oldInfo[oldLineIndex] = {\n type: 'context',\n lineNumber: oldLineNumber,\n altLineNumber: newLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n newInfo[newLineIndex] = {\n type: 'context',\n lineNumber: newLineNumber,\n altLineNumber: oldLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n oldContent += line;\n newContent += line;\n oldLineIndex++;\n newLineIndex++;\n newLineNumber++;\n oldLineNumber++;\n splitLineIndex++;\n unifiedLineIndex++;\n }\n } else {\n const len = Math.max(\n hunkContent.additions.length,\n hunkContent.deletions.length\n );\n let i = 0;\n // NOTE(amadeus): Since we iterate through deletions and additions\n // simultaneously, we have to create a secondary iterator for\n // unifiedLineIndex, and then when we're done, add the combined lengths\n // of additions/deletions to the main variable\n let _unifiedLineIndex = unifiedLineIndex;\n while (i < len) {\n const oldLine = hunkContent.deletions[i];\n const newLine = hunkContent.additions[i];\n computeLineDiffDecorations({\n newLine,\n oldLine,\n oldLineIndex,\n newLineIndex,\n oldDecorations,\n newDecorations,\n lineDiffType,\n });\n if (oldLine != null) {\n oldInfo[oldLineIndex] = {\n type: 'change-deletion',\n lineNumber: oldLineNumber,\n lineIndex: `${_unifiedLineIndex},${splitLineIndex}`,\n };\n oldContent += oldLine;\n oldLineIndex++;\n oldLineNumber++;\n }\n if (newLine != null) {\n newInfo[newLineIndex] = {\n type: 'change-addition',\n lineNumber: newLineNumber,\n lineIndex: `${_unifiedLineIndex + hunkContent.deletions.length},${splitLineIndex}`,\n };\n newContent += newLine;\n newLineIndex++;\n newLineNumber++;\n }\n splitLineIndex++;\n _unifiedLineIndex++;\n i++;\n }\n unifiedLineIndex +=\n hunkContent.additions.length + hunkContent.deletions.length;\n }\n }\n\n if (\n oldLines == null ||\n newLines == null ||\n hunk !== hunks[hunks.length - 1]\n )\n continue;\n // If we are on the last hunk, we should fully iterate through the rest\n // of the lines\n while (oldLineIndex <= oldLines.length || newLineIndex <= oldLines.length) {\n const oldLine = oldLines[oldLineIndex - 1];\n const newLine = newLines[newLineIndex - 1];\n if (oldLine == null && newLine == null) {\n break;\n }\n if (oldLine != null) {\n oldInfo[oldLineIndex] = {\n type: 'context-expanded',\n lineNumber: oldLineNumber,\n altLineNumber: newLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n oldContent += oldLine;\n oldLineIndex++;\n oldLineNumber++;\n }\n if (newLine != null) {\n newInfo[newLineIndex] = {\n type: 'context-expanded',\n lineNumber: newLineNumber,\n altLineNumber: oldLineNumber,\n lineIndex: `${unifiedLineIndex},${splitLineIndex}`,\n };\n newContent += newLine;\n newLineIndex++;\n newLineNumber++;\n }\n splitLineIndex++;\n unifiedLineIndex++;\n }\n }\n return {\n oldContent,\n newContent,\n oldInfo,\n newInfo,\n oldDecorations,\n newDecorations,\n splitLineIndex,\n unifiedLineIndex,\n };\n}\n\ninterface RenderTwoFilesProps {\n oldFile: FileContents;\n newFile: FileContents;\n oldInfo: Record<number, LineInfo | undefined>;\n newInfo: Record<number, LineInfo | undefined>;\n oldDecorations: DecorationItem[];\n newDecorations: DecorationItem[];\n options: RenderDiffOptions;\n highlighter: DiffsHighlighter;\n languageOverride: SupportedLanguages | undefined;\n}\n\nfunction renderTwoFiles({\n oldFile,\n newFile,\n oldInfo,\n newInfo,\n highlighter,\n oldDecorations,\n newDecorations,\n languageOverride,\n options: { theme: themeOrThemes = DEFAULT_THEMES, ...options },\n}: RenderTwoFilesProps) {\n const oldLang = languageOverride ?? getFiletypeFromFileName(oldFile.name);\n const newLang = languageOverride ?? getFiletypeFromFileName(newFile.name);\n const { state, transformers } = createTransformerWithState();\n const hastConfig: CodeToHastOptions<DiffsThemeNames> = (() => {\n return typeof themeOrThemes === 'string'\n ? {\n ...options,\n // language will be overwritten for each highlight\n lang: 'text',\n theme: themeOrThemes,\n transformers,\n decorations: undefined,\n defaultColor: false,\n cssVariablePrefix: formatCSSVariablePrefix('token'),\n }\n : {\n ...options,\n // language will be overwritten for each highlight\n lang: 'text',\n themes: themeOrThemes,\n transformers,\n decorations: undefined,\n defaultColor: false,\n cssVariablePrefix: formatCSSVariablePrefix('token'),\n };\n })();\n\n const oldLines = (() => {\n if (oldFile.contents === '') {\n return [];\n }\n hastConfig.lang = oldLang;\n state.lineInfo = oldInfo;\n hastConfig.decorations = oldDecorations;\n return getLineNodes(\n highlighter.codeToHast(cleanLastNewline(oldFile.contents), hastConfig)\n );\n })();\n const newLines = (() => {\n if (newFile.contents === '') {\n return [];\n }\n hastConfig.lang = newLang;\n hastConfig.decorations = newDecorations;\n state.lineInfo = newInfo;\n return getLineNodes(\n highlighter.codeToHast(cleanLastNewline(newFile.contents), hastConfig)\n );\n })();\n\n return { oldLines, newLines };\n}\n"],"mappings":"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"}
package/dist/utils/renderFileWithHighlighter.js CHANGED
@@ -28,7 +28,7 @@ function renderFileWithHighlighter(file, highlighter, { theme = DEFAULT_THEMES,
28
28
  theme,
29
29
  transformers,
30
30
  defaultColor: false,
31
- cssVariablePrefix: formatCSSVariablePrefix(),
31
+ cssVariablePrefix: formatCSSVariablePrefix("token"),
32
32
  tokenizeMaxLineLength
33
33
  };
34
34
  return {
@@ -36,7 +36,7 @@ function renderFileWithHighlighter(file, highlighter, { theme = DEFAULT_THEMES,
36
36
  themes: theme,
37
37
  transformers,
38
38
  defaultColor: false,
39
- cssVariablePrefix: formatCSSVariablePrefix(),
39
+ cssVariablePrefix: formatCSSVariablePrefix("token"),
40
40
  tokenizeMaxLineLength
41
41
  };
42
42
  })();
package/dist/utils/renderFileWithHighlighter.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"renderFileWithHighlighter.js","names":["hastConfig: CodeToHastOptions<DiffsThemeNames>"],"sources":["../../src/utils/renderFileWithHighlighter.ts"],"sourcesContent":["import { DEFAULT_THEMES } from '../constants';\nimport type {\n CodeToHastOptions,\n DiffsHighlighter,\n DiffsThemeNames,\n FileContents,\n RenderFileOptions,\n ThemedFileResult,\n} from '../types';\nimport { cleanLastNewline } from './cleanLastNewline';\nimport { createTransformerWithState } from './createTransformerWithState';\nimport { formatCSSVariablePrefix } from './formatCSSVariablePrefix';\nimport { getFiletypeFromFileName } from './getFiletypeFromFileName';\nimport { getHighlighterThemeStyles } from './getHighlighterThemeStyles';\nimport { getLineNodes } from './getLineNodes';\n\nexport function renderFileWithHighlighter(\n file: FileContents,\n highlighter: DiffsHighlighter,\n { theme = DEFAULT_THEMES, tokenizeMaxLineLength }: RenderFileOptions,\n forcePlainText = false\n): ThemedFileResult {\n const { state, transformers } = createTransformerWithState();\n const lang = forcePlainText\n ? 'text'\n : (file.lang ?? getFiletypeFromFileName(file.name));\n const baseThemeType = (() => {\n if (typeof theme === 'string') {\n return highlighter.getTheme(theme).type;\n }\n return undefined;\n })();\n const themeStyles = getHighlighterThemeStyles({\n theme,\n highlighter,\n });\n state.lineInfo = (shikiLineNumber: number) => ({\n type: 'context',\n lineIndex: shikiLineNumber - 1,\n lineNumber: shikiLineNumber,\n });\n const hastConfig: CodeToHastOptions<DiffsThemeNames> = (() => {\n if (typeof theme === 'string') {\n return {\n lang,\n theme,\n transformers,\n defaultColor: false,\n cssVariablePrefix: formatCSSVariablePrefix(),\n tokenizeMaxLineLength,\n };\n }\n return {\n lang,\n themes: theme,\n transformers,\n defaultColor: false,\n cssVariablePrefix: formatCSSVariablePrefix(),\n tokenizeMaxLineLength,\n };\n })();\n return {\n code: getLineNodes(\n highlighter.codeToHast(cleanLastNewline(file.contents), hastConfig)\n ),\n themeStyles,\n baseThemeType: baseThemeType,\n };\n}\n"],"mappings":";;;;;;;;;AAgBA,SAAgB,0BACd,MACA,aACA,EAAE,QAAQ,gBAAgB,yBAC1B,iBAAiB,OACC;CAClB,MAAM,EAAE,OAAO,iBAAiB,4BAA4B;CAC5D,MAAM,OAAO,iBACT,SACC,KAAK,QAAQ,wBAAwB,KAAK,KAAK;CACpD,MAAM,uBAAuB;AAC3B,MAAI,OAAO,UAAU,SACnB,QAAO,YAAY,SAAS,MAAM,CAAC;KAGnC;CACJ,MAAM,cAAc,0BAA0B;EAC5C;EACA;EACD,CAAC;AACF,OAAM,YAAY,qBAA6B;EAC7C,MAAM;EACN,WAAW,kBAAkB;EAC7B,YAAY;EACb;CACD,MAAMA,oBAAwD;AAC5D,MAAI,OAAO,UAAU,SACnB,QAAO;GACL;GACA;GACA;GACA,cAAc;GACd,mBAAmB,yBAAyB;GAC5C;GACD;AAEH,SAAO;GACL;GACA,QAAQ;GACR;GACA,cAAc;GACd,mBAAmB,yBAAyB;GAC5C;GACD;KACC;AACJ,QAAO;EACL,MAAM,aACJ,YAAY,WAAW,iBAAiB,KAAK,SAAS,EAAE,WAAW,CACpE;EACD;EACe;EAChB"}
1
+ {"version":3,"file":"renderFileWithHighlighter.js","names":["hastConfig: CodeToHastOptions<DiffsThemeNames>"],"sources":["../../src/utils/renderFileWithHighlighter.ts"],"sourcesContent":["import { DEFAULT_THEMES } from '../constants';\nimport type {\n CodeToHastOptions,\n DiffsHighlighter,\n DiffsThemeNames,\n FileContents,\n RenderFileOptions,\n ThemedFileResult,\n} from '../types';\nimport { cleanLastNewline } from './cleanLastNewline';\nimport { createTransformerWithState } from './createTransformerWithState';\nimport { formatCSSVariablePrefix } from './formatCSSVariablePrefix';\nimport { getFiletypeFromFileName } from './getFiletypeFromFileName';\nimport { getHighlighterThemeStyles } from './getHighlighterThemeStyles';\nimport { getLineNodes } from './getLineNodes';\n\nexport function renderFileWithHighlighter(\n file: FileContents,\n highlighter: DiffsHighlighter,\n { theme = DEFAULT_THEMES, tokenizeMaxLineLength }: RenderFileOptions,\n forcePlainText = false\n): ThemedFileResult {\n const { state, transformers } = createTransformerWithState();\n const lang = forcePlainText\n ? 'text'\n : (file.lang ?? getFiletypeFromFileName(file.name));\n const baseThemeType = (() => {\n if (typeof theme === 'string') {\n return highlighter.getTheme(theme).type;\n }\n return undefined;\n })();\n const themeStyles = getHighlighterThemeStyles({\n theme,\n highlighter,\n });\n state.lineInfo = (shikiLineNumber: number) => ({\n type: 'context',\n lineIndex: shikiLineNumber - 1,\n lineNumber: shikiLineNumber,\n });\n const hastConfig: CodeToHastOptions<DiffsThemeNames> = (() => {\n if (typeof theme === 'string') {\n return {\n lang,\n theme,\n transformers,\n defaultColor: false,\n cssVariablePrefix: formatCSSVariablePrefix('token'),\n tokenizeMaxLineLength,\n };\n }\n return {\n lang,\n themes: theme,\n transformers,\n defaultColor: false,\n cssVariablePrefix: formatCSSVariablePrefix('token'),\n tokenizeMaxLineLength,\n };\n })();\n return {\n code: getLineNodes(\n highlighter.codeToHast(cleanLastNewline(file.contents), hastConfig)\n ),\n themeStyles,\n baseThemeType: baseThemeType,\n };\n}\n"],"mappings":";;;;;;;;;AAgBA,SAAgB,0BACd,MACA,aACA,EAAE,QAAQ,gBAAgB,yBAC1B,iBAAiB,OACC;CAClB,MAAM,EAAE,OAAO,iBAAiB,4BAA4B;CAC5D,MAAM,OAAO,iBACT,SACC,KAAK,QAAQ,wBAAwB,KAAK,KAAK;CACpD,MAAM,uBAAuB;AAC3B,MAAI,OAAO,UAAU,SACnB,QAAO,YAAY,SAAS,MAAM,CAAC;KAGnC;CACJ,MAAM,cAAc,0BAA0B;EAC5C;EACA;EACD,CAAC;AACF,OAAM,YAAY,qBAA6B;EAC7C,MAAM;EACN,WAAW,kBAAkB;EAC7B,YAAY;EACb;CACD,MAAMA,oBAAwD;AAC5D,MAAI,OAAO,UAAU,SACnB,QAAO;GACL;GACA;GACA;GACA,cAAc;GACd,mBAAmB,wBAAwB,QAAQ;GACnD;GACD;AAEH,SAAO;GACL;GACA,QAAQ;GACR;GACA,cAAc;GACd,mBAAmB,wBAAwB,QAAQ;GACnD;GACD;KACC;AACJ,QAAO;EACL,MAAM,aACJ,YAAY,WAAW,iBAAiB,KAAK,SAAS,EAAE,WAAW,CACpE;EACD;EACe;EAChB"}