@apify/ui-library 1.148.0 → 1.148.1-featuremigrateapifyuilibrary-48563e.21

package/dist/components/code/inline_code/inline_code.js

@@ -0,0 +1,45 @@
+import { theme } from "../../../design_system/theme.js";
+import { TextShared } from "../../text/text_shared.js";
+import { useCopyToClipboard } from "../../../utils/copy_to_clipboard.js";
+import styled, { css } from "styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CheckIcon, CopyIcon } from "@apify/ui-icons";
+//#region src/components/code/inline_code/inline_code.tsx
+var inlineCodeStyles = css`
+    width: fit-content;
+    padding: ${theme.space.space2} 0.6rem;
+    background-color: ${theme.color.neutral.backgroundMuted};
+    border-radius: ${theme.radius.radius8};
+    border: 1px solid ${theme.color.neutral.border};
+`;
+var CopyButtonWrapper = styled.div`
+    display: inline-flex;
+    cursor: pointer;
+    vertical-align: text-top;
+    margin-left: ${theme.space.space4};
+`;
+var CopyButton = ({ text }) => {
+	const { isCopied, copyToClipboard } = useCopyToClipboard();
+	return /* @__PURE__ */ jsx(CopyButtonWrapper, {
+		role: "button",
+		onClick: async () => copyToClipboard(text),
+		title: "Copy to clipboard",
+		children: isCopied ? /* @__PURE__ */ jsx(CheckIcon, { size: "16" }) : /* @__PURE__ */ jsx(CopyIcon, { size: "16" })
+	});
+};
+var Wrapper = styled.span`
+    code {
+        ${inlineCodeStyles}
+    }
+`;
+var InlineCode = ({ children, size, withCopyButton, ...props }) => /* @__PURE__ */ jsx(Wrapper, {
+	...props,
+	children: /* @__PURE__ */ jsxs(TextShared, {
+		type: "code",
+		as: "code",
+		size,
+		children: [children, withCopyButton && /* @__PURE__ */ jsx(CopyButton, { text: children?.toString() ?? "" })]
+	})
+});
+//#endregion
+export { InlineCode, inlineCodeStyles };

package/dist/components/code/one_light_theme.d.ts

@@ -0,0 +1,3 @@
+import { PrismTheme } from 'prism-react-renderer';
+export declare const oneLightTheme: PrismTheme;
+//# sourceMappingURL=one_light_theme.d.ts.map

package/dist/components/code/one_light_theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"one_light_theme.d.ts","sourceRoot":"","sources":["../../../src/components/code/one_light_theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAEvD,eAAO,MAAM,aAAa,EAAE,UA6F3B,CAAC"}

package/dist/components/code/one_light_theme.js

@@ -0,0 +1,96 @@
+//#region src/components/code/one_light_theme.ts
+var oneLightTheme = {
+	plain: {
+		backgroundColor: "hsl(230, 1%, 98%)",
+		color: "hsl(230, 8%, 24%)"
+	},
+	styles: [
+		{
+			types: [
+				"comment",
+				"prolog",
+				"cdata"
+			],
+			style: { color: "hsl(230, 4%, 64%)" }
+		},
+		{
+			types: ["doctype", "entity"],
+			style: { color: "hsl(230, 8%, 24%)" }
+		},
+		{
+			types: [
+				"attr-name",
+				"class-name",
+				"boolean",
+				"constant",
+				"number",
+				"atrule"
+			],
+			style: { color: "hsl(35, 99%, 36%)" }
+		},
+		{
+			types: ["keyword"],
+			style: { color: "hsl(301, 63%, 40%)" }
+		},
+		{
+			types: [
+				"property",
+				"tag",
+				"symbol",
+				"deleted",
+				"important"
+			],
+			style: { color: "hsl(5, 74%, 59%)" }
+		},
+		{
+			types: ["punctuation"],
+			style: { color: "hsl(230, 6%, 44%)" }
+		},
+		{
+			types: [
+				"selector",
+				"string",
+				"char",
+				"builtin",
+				"inserted",
+				"regex",
+				"attr-value"
+			],
+			style: { color: "hsl(119, 34%, 47%)" }
+		},
+		{
+			types: [
+				"variable",
+				"operator",
+				"function"
+			],
+			style: { color: "hsl(221, 87%, 60%)" }
+		},
+		{
+			types: ["url"],
+			style: { color: "hsl(198, 99%, 37%)" }
+		},
+		{
+			types: ["deleted"],
+			style: { textDecorationLine: "line-through" }
+		},
+		{
+			types: ["inserted"],
+			style: { textDecorationLine: "underline" }
+		},
+		{
+			types: ["italic"],
+			style: { fontStyle: "italic" }
+		},
+		{
+			types: ["important", "bold"],
+			style: { fontWeight: "bold" }
+		},
+		{
+			types: ["important"],
+			style: { color: "hsl(230, 8%, 24%)" }
+		}
+	]
+};
+//#endregion
+export { oneLightTheme };

package/dist/components/code/one_line_code/one_line_code.d.ts

@@ -0,0 +1,31 @@
+import { HttpMethod } from '@apify-packages/types';
+import { BoxProps } from '../../box';
+import { SharedTextSize } from '../../text/text_shared';
+export declare const oneLineCodeClassNames: {
+    gradientWrapper: string;
+    scrollableWrapper: string;
+    methodChip: string;
+    gradient: string;
+    buttons: string;
+};
+export type TrackingBundleDataObject = {
+    trackingId: string;
+    trackingData?: Record<string, unknown>;
+};
+export type OneLineCodeTrackingBundle = Partial<Record<'secret' | 'copy' | 'action', TrackingBundleDataObject>>;
+export type OneLineCodeProps = Omit<BoxProps, 'children'> & {
+    children: string;
+    language?: string;
+    size?: SharedTextSize;
+    httpMethod?: HttpMethod;
+    actionButtonLabel?: string;
+    onActionButtonClick?: () => Promise<void> | void;
+    fullWidth?: boolean;
+    secretPlaceholder?: string;
+    secret?: string;
+    disabled?: boolean;
+    hideCopyButton?: boolean;
+    trackingBundle?: OneLineCodeTrackingBundle;
+};
+export declare function OneLineCode({ children, language, size, httpMethod, actionButtonLabel, onActionButtonClick, fullWidth, secretPlaceholder, secret, disabled, hideCopyButton, trackingBundle, ...rest }: OneLineCodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=one_line_code.d.ts.map

package/dist/components/code/one_line_code/one_line_code.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"one_line_code.d.ts","sourceRoot":"","sources":["../../../../src/components/code/one_line_code/one_line_code.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAGxD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAO7D,eAAO,MAAM,qBAAqB;;;;;;CAMjC,CAAC;AAgHF,MAAM,MAAM,wBAAwB,GAAG;IACnC,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAC1C,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,OAAO,CAAC,MAAM,CAAC,QAAQ,GAAG,MAAM,GAAG,QAAQ,EAAE,wBAAwB,CAAC,CAAC,CAAC;AAEhH,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IACxD,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,yBAAyB,CAAC;CAC9C,CAAC;AAEF,wBAAgB,WAAW,CAAC,EACxB,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,UAAU,EACV,iBAAiB,EACjB,mBAAmB,EACnB,SAAS,EACT,iBAAyB,EACzB,MAAM,EACN,QAAQ,EACR,cAAc,EACd,cAAc,EACd,GAAG,IAAI,EACV,EAAE,gBAAgB,2CAuElB"}

package/dist/components/code/one_line_code/one_line_code.js

@@ -0,0 +1,176 @@
+import { theme } from "../../../design_system/theme.js";
+import { TextShared } from "../../text/text_shared.js";
+import { ActionButton, CopyButton } from "../action_button.js";
+import { PrismSyntaxHighlighter } from "../prism_highlighter.js";
+import { SyntaxHighlighterBaseStylesWrapper } from "../code_block/code_block.styled.js";
+import { getBashLinePrefixes } from "../code_block/utils.js";
+import styled, { css } from "styled-components";
+import { useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { EyeIcon, EyeOffIcon } from "@apify/ui-icons";
+//#region src/components/code/one_line_code/one_line_code.tsx
+var oneLineCodeClassNames = {
+	gradientWrapper: "OneLineCode-GradientWrapper",
+	scrollableWrapper: "OneLineCode-ScrollableWrapper",
+	methodChip: "OneLineCode-MethodChip",
+	gradient: "OneLineCode-Gradient",
+	buttons: "OneLineCode-Buttons"
+};
+var HTML_METHOD_CHIP_STYLES = {
+	GET: "primary",
+	POST: "success",
+	PUT: "warning",
+	DELETE: "danger",
+	HEAD: "neutral",
+	PATCH: "neutral",
+	OPTIONS: "neutral"
+};
+function getChipStyles(httpMethod) {
+	const styles = theme.color[HTML_METHOD_CHIP_STYLES[httpMethod]];
+	return css`
+        background-color: ${styles.chipBackground};
+        color: ${"chipText" in styles ? styles.chipText : styles.text};
+    `;
+}
+var OneLineCodeWrapper = styled(SyntaxHighlighterBaseStylesWrapper)`
+    display: flex;
+    padding-right: ${theme.space.space16} !important;
+    ${({ $fitContent }) => $fitContent && css`
+            width: fit-content;
+        `}
+
+    ${({ $disabled }) => $disabled && css`
+            opacity: 0.5;
+            cursor: not-allowed;
+        `}
+
+    height: 4.6rem;
+
+    .${oneLineCodeClassNames.buttons} {
+        display: flex;
+        align-items: center;
+        gap: ${theme.space.space8};
+    }
+
+    .${oneLineCodeClassNames.methodChip} {
+        padding: 0 ${theme.space.space4};
+        border-radius: ${theme.radius.radius6};
+        height: 2.4rem;
+        ${({ $httpMethod }) => $httpMethod && getChipStyles($httpMethod)}
+        display: flex;
+        align-items: center;
+    }
+
+    .${oneLineCodeClassNames.gradientWrapper} {
+        position: relative;
+        flex: 1;
+        min-width: 0;
+        display: flex;
+
+        .${oneLineCodeClassNames.gradient} {
+            position: absolute;
+            right: 0;
+            top: 0;
+            bottom: 0;
+            width: 4rem;
+            z-index: 5;
+            background: linear-gradient(to right, transparent, ${theme.color.neutral.backgroundMuted} 3rem);
+        }
+    }
+
+    .${oneLineCodeClassNames.scrollableWrapper} {
+        flex: 1;
+        overflow-x: auto;
+        overflow-y: hidden;
+        display: flex;
+        align-items: center;
+        gap: ${theme.space.space16};
+        padding: 0 ${theme.space.space8} !important;
+        margin-left: ${theme.space.space8} !important;
+        height: 100%;
+
+        scrollbar-width: thin;
+        scrollbar-color: ${theme.color.neutral.border} transparent;
+
+        pre {
+            display: flex;
+            flex: 1;
+            align-items: center;
+            height: 100%;
+
+            code {
+                height: 100%;
+                display: flex;
+                align-items: center;
+
+                & > div {
+                    padding-right: ${theme.space.space16};
+                }
+            }
+        }
+    }
+`;
+function OneLineCode({ children, language, size, httpMethod, actionButtonLabel, onActionButtonClick, fullWidth, secretPlaceholder = "***", secret, disabled, hideCopyButton, trackingBundle, ...rest }) {
+	const hasSecret = secret !== void 0;
+	const [showSecret, setShowSecret] = useState(false);
+	const codeWithSecret = useMemo(() => {
+		if (!hasSecret) return children;
+		return children.replace(secretPlaceholder, secret);
+	}, [
+		children,
+		secret,
+		hasSecret,
+		secretPlaceholder
+	]);
+	const code = showSecret ? codeWithSecret : children;
+	const showBashPrefixes = language === "bash";
+	const linePrefixes = useMemo(() => showBashPrefixes ? getBashLinePrefixes(code, [1], true) : {}, [showBashPrefixes, code]);
+	return /* @__PURE__ */ jsxs(OneLineCodeWrapper, {
+		$httpMethod: httpMethod,
+		$fullWidth: fullWidth,
+		$showBashPrefixes: showBashPrefixes,
+		$disabled: disabled,
+		...rest,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: oneLineCodeClassNames.gradientWrapper,
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: oneLineCodeClassNames.scrollableWrapper,
+				children: [httpMethod && /* @__PURE__ */ jsx(TextShared, {
+					className: oneLineCodeClassNames.methodChip,
+					as: "div",
+					children: httpMethod
+				}), /* @__PURE__ */ jsx(PrismSyntaxHighlighter, {
+					language,
+					size,
+					linePrefixes,
+					code,
+					isSingleLine: true
+				})]
+			}), /* @__PURE__ */ jsx("div", { className: oneLineCodeClassNames.gradient })]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: oneLineCodeClassNames.buttons,
+			children: [
+				hasSecret && /* @__PURE__ */ jsx(ActionButton, {
+					onClick: () => setShowSecret((prev) => !prev),
+					trackingId: trackingBundle?.secret?.trackingId,
+					trackingData: trackingBundle?.secret?.trackingData,
+					"data-test": "toggle-visibility-button",
+					children: showSecret ? /* @__PURE__ */ jsx(EyeOffIcon, { size: "16" }) : /* @__PURE__ */ jsx(EyeIcon, { size: "16" })
+				}),
+				!hideCopyButton && /* @__PURE__ */ jsx(CopyButton, {
+					code: codeWithSecret,
+					trackingId: trackingBundle?.copy?.trackingId,
+					trackingData: trackingBundle?.copy?.trackingData
+				}),
+				!!onActionButtonClick && /* @__PURE__ */ jsx(ActionButton, {
+					onClick: onActionButtonClick,
+					trackingId: trackingBundle?.action?.trackingId,
+					trackingData: trackingBundle?.action?.trackingData,
+					children: actionButtonLabel
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { OneLineCode, oneLineCodeClassNames };

package/dist/components/code/prism_highlighter.d.ts

@@ -0,0 +1,35 @@
+import { HighlightProps } from 'prism-react-renderer';
+import { ReactNode } from 'react';
+import { SharedTextSize } from '../text';
+export declare const CodeHighlighterLinePrefix: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<(import('..').SharedTextProps & import('react').RefAttributes<HTMLElement | undefined>) & import('styled-components/dist/types').BaseObject, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>, import('styled-components/dist/types').BaseObject>, import('styled-components/dist/types').BaseObject>> & string;
+export declare const CodeHighlighterLineBashPrefix: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components').FastOmit<import('styled-components').FastOmit<import('../text/text_shared').TransientSharedTextProps & import('..').TransientTextBaseProps & import('..').MarginSpacingProps & import('..').PaddingSpacingProps & {
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+    onClick?: (e: React.MouseEvent) => void;
+    id?: string;
+    title?: string;
+} & {
+    as?: React.ElementType;
+} & import('react').RefAttributes<HTMLElement | undefined>, keyof import('react').ClassAttributes<HTMLSpanElement> | keyof import('react').HTMLAttributes<HTMLSpanElement>> & import('react').ClassAttributes<HTMLSpanElement> & import('react').HTMLAttributes<HTMLSpanElement>, never>, never> | import('styled-components').FastOmit<import('styled-components').FastOmit<import('styled-components').FastOmit<import('../text/text_shared').TransientSharedTextProps & import('..').TransientTextBaseProps & import('..').MarginSpacingProps & import('..').PaddingSpacingProps & {
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+    onClick?: (e: React.MouseEvent) => void;
+    id?: string;
+    title?: string;
+} & {
+    as: "ol";
+    start?: number;
+} & import('react').RefAttributes<HTMLElement | undefined>, keyof import('react').ClassAttributes<HTMLSpanElement> | keyof import('react').HTMLAttributes<HTMLSpanElement>> & import('react').ClassAttributes<HTMLSpanElement> & import('react').HTMLAttributes<HTMLSpanElement>, never>, never>, {
+    $isOneLine?: boolean;
+}>> & string;
+export declare const PrismSyntaxHighlighter: import('react').ForwardRefExoticComponent<Omit<HighlightProps, "children" | "language"> & {
+    size?: SharedTextSize;
+    linePrefixes?: Record<string, ReactNode>;
+    highlightLines?: number[];
+    language?: string;
+    className?: string;
+    isSingleLine: boolean;
+} & import('react').RefAttributes<HTMLPreElement>>;
+//# sourceMappingURL=prism_highlighter.d.ts.map

package/dist/components/code/prism_highlighter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prism_highlighter.d.ts","sourceRoot":"","sources":["../../../src/components/code/prism_highlighter.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAE3D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AA2J9C,eAAO,MAAM,yBAAyB,8jBAQrC,CAAC;AAEF,eAAO,MAAM,6BAA6B;;;;;;;;;;;;;;;;;;;;iBAAoD,OAAO;YAEpG,CAAC;AAWF,eAAO,MAAM,sBAAsB;WARxB,cAAc;mBACN,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC;qBACvB,MAAM,EAAE;eACd,MAAM;gBACL,MAAM;kBACJ,OAAO;kDAiDxB,CAAC"}

package/dist/components/code/prism_highlighter.js

@@ -0,0 +1,257 @@
+import { theme } from "../../design_system/theme.js";
+import { TextShared } from "../text/text_shared.js";
+import { useSharedUiDependencies } from "../../ui_dependency_provider.js";
+import { oneLightTheme } from "./one_light_theme.js";
+import styled, { css } from "styled-components";
+import { forwardRef, useMemo, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx$1 from "clsx";
+import _ from "lodash";
+import { Highlight, Prism, themes } from "prism-react-renderer";
+//#region src/components/code/prism_highlighter.tsx
+(typeof global !== "undefined" ? global : window).Prism = Prism;
+var HIGHLIGHT_BACKGROUND_COLOR = "rgba(22, 114, 235, 0.05)";
+var loadLanguages = async () => {
+	await Promise.all([
+		import("prismjs/components/prism-bash.js"),
+		import("prismjs/components/prism-rust.js"),
+		import("prismjs/components/prism-bash.js"),
+		import("prismjs/components/prism-docker.js"),
+		import("prismjs/components/prism-http.js"),
+		import("prismjs/components/prism-javascript.js"),
+		import("prismjs/components/prism-json.js"),
+		import("prismjs/components/prism-markup.js"),
+		import("prismjs/components/prism-typescript.js"),
+		import("prismjs/components/prism-xml-doc.js"),
+		import("prismjs/components/prism-yaml.js"),
+		import("./prism_python.js")
+	]);
+};
+loadLanguages();
+/**
+* Detects the language of the code based on common keywords. We need it for user-generated content
+* @param code The code to analyze.
+*/
+var useDetectedLanguage = (code, passedLanguage) => useMemo(() => {
+	if (passedLanguage) return passedLanguage;
+	const scored = [
+		{
+			lang: "rust",
+			keywords: [
+				"fn main()",
+				"let mut",
+				"println!",
+				"pub struct",
+				"use std::"
+			]
+		},
+		{
+			lang: "http",
+			keywords: [
+				"GET /",
+				"POST /",
+				"HTTP/1.1",
+				"Host:",
+				"Content-Type:"
+			]
+		},
+		{
+			lang: "bash",
+			keywords: [
+				"#!/bin/bash",
+				"echo ",
+				"cd ",
+				"ls"
+			]
+		},
+		{
+			lang: "markup",
+			keywords: [
+				"<div",
+				"<span",
+				"<html",
+				"<!DOCTYPE",
+				"</"
+			]
+		},
+		{
+			lang: "xml-doc",
+			keywords: [
+				"<?xml",
+				"<doc",
+				"<summary",
+				"</doc>"
+			]
+		},
+		{
+			lang: "yaml",
+			keywords: [
+				"version:",
+				"services:",
+				"name:"
+			]
+		},
+		{
+			lang: "docker",
+			keywords: [
+				"FROM ",
+				"RUN ",
+				"CMD ",
+				"ENTRYPOINT",
+				"EXPOSE"
+			]
+		},
+		{
+			lang: "python",
+			keywords: [
+				"def ",
+				"import ",
+				"print(",
+				"self",
+				"None"
+			]
+		},
+		{
+			lang: "javascript",
+			keywords: [
+				"function",
+				"const",
+				"let",
+				"=>",
+				"console.log",
+				"var"
+			]
+		},
+		{
+			lang: "typescript",
+			keywords: [
+				"interface ",
+				"type ",
+				": string",
+				": number",
+				"as const"
+			]
+		}
+	].map((test) => {
+		let score = 0;
+		for (const kw of test.keywords) if (code.includes(kw)) score += 1;
+		return {
+			lang: test.lang,
+			score
+		};
+	});
+	const max = _.maxBy(scored, "score");
+	if (max?.score && max.score > 0) return max.lang;
+}, [code, passedLanguage]);
+var PreWrapper = styled.pre`
+    width: 100%;
+    position: relative;
+    z-index: 2;
+    padding: ${({ $isSingleLine }) => $isSingleLine ? 0 : `${theme.space.space16} 0`};
+    margin: 0;
+    overflow: auto;
+
+    code {
+        min-width: 100%;
+        display: inline-block;
+        vertical-align: middle;
+
+        /* The following CSS deal with https://github.com/apify/apify-core/issues/20920 */
+        ${({ $isSingleLine }) => $isSingleLine ? css`
+                      overflow-y: hidden;
+                      scrollbar-width: none;
+                  ` : css`
+                      scrollbar-width: thin;
+                      overflow: hidden;
+                  `};
+
+        *,
+        *::before,
+        *::after {
+            text-shadow: none !important;
+            font-style: normal !important;
+            font-family: inherit !important;
+            font-size: inherit !important;
+            font-weight: inherit !important;
+            line-height: inherit !important;
+            background-color: transparent !important;
+        }
+
+        & > div {
+            display: block;
+
+            &.highlighted {
+                background-color: ${HIGHLIGHT_BACKGROUND_COLOR} !important;
+                border-left: 6px solid ${theme.color.neutral.border} !important;
+                padding-left: ${({ $hasLinePrefixes }) => $hasLinePrefixes ? "0.2" : "1"}rem;
+            }
+
+            ${({ $isSingleLine }) => !$isSingleLine && css`
+                    &:hover {
+                        background-color: ${HIGHLIGHT_BACKGROUND_COLOR} !important;
+                        border-left: 6px solid ${theme.color.neutral.border} !important;
+                        padding-left: ${({ $hasLinePrefixes }) => $hasLinePrefixes ? "0.2" : "1"}rem;
+                    }
+                `}
+
+            ${({ $isSingleLine }) => $isSingleLine ? css`
+                          white-space: nowrap;
+                          vertical-align: text-top;
+                      ` : css`
+                          padding-left: ${({ $hasLinePrefixes }) => $hasLinePrefixes ? theme.space.space8 : theme.space.space16};
+                          padding-right: ${theme.space.space16};
+
+                          &:hover {
+                              background-color: ${HIGHLIGHT_BACKGROUND_COLOR} !important;
+                              border-left: 6px solid ${theme.color.neutral.border} !important;
+                              padding-left: ${({ $hasLinePrefixes }) => $hasLinePrefixes ? "0.2" : "1"}rem;
+                          }
+                      `}
+        }
+    }
+`;
+var CodeHighlighterLinePrefix = styled(TextShared).attrs({ as: "span" })`
+    display: inline-block;
+    margin-right: ${theme.space.space16};
+    text-align: right;
+    min-width: ${theme.space.space24};
+    color: ${({ color }) => color || theme.color.neutral.textSubtle};
+    user-select: none;
+    -webkit-user-select: none;
+`;
+var CodeHighlighterLineBashPrefix = styled(CodeHighlighterLinePrefix)`
+    min-width: ${({ $isOneLine }) => $isOneLine ? "unset" : theme.space.space16} !important;
+`;
+var PrismSyntaxHighlighter = forwardRef(({ size = "regular", linePrefixes = {}, highlightLines = [], language, className, isSingleLine, ...rest }, ref) => {
+	const { uiTheme } = useSharedUiDependencies();
+	const hasLinePrefixes = !_.isEmpty(linePrefixes);
+	const highlightedLinesObject = useRef(Object.fromEntries(highlightLines.map((e) => [e, true])));
+	const effectiveLanguage = useDetectedLanguage(rest.code || "", language) ?? "javascript";
+	return /* @__PURE__ */ jsx(Highlight, {
+		theme: uiTheme === "DARK" ? themes.nightOwl : oneLightTheme,
+		language: effectiveLanguage,
+		...rest,
+		children: ({ className: prismClassName, tokens, getLineProps, getTokenProps }) => /* @__PURE__ */ jsx(PreWrapper, {
+			tabIndex: 0,
+			className: clsx$1(className, prismClassName),
+			$hasLinePrefixes: hasLinePrefixes,
+			$isSingleLine: isSingleLine,
+			"data-test": "code-block-code",
+			ref,
+			children: /* @__PURE__ */ jsx(TextShared, {
+				size,
+				type: "code",
+				as: "code",
+				children: tokens.map((line, i) => /* @__PURE__ */ jsxs("div", {
+					...getLineProps({
+						line,
+						className: highlightedLinesObject.current[i + 1] ? "highlighted" : ""
+					}),
+					children: [hasLinePrefixes && (linePrefixes[i + 1] || /* @__PURE__ */ jsx(CodeHighlighterLinePrefix, {})), line.map((token, key) => /* @__PURE__ */ jsx("span", { ...getTokenProps({ token }) }, key))]
+				}, i))
+			})
+		})
+	});
+});
+//#endregion
+export { CodeHighlighterLineBashPrefix, CodeHighlighterLinePrefix, PrismSyntaxHighlighter };

package/dist/components/code/prism_python.d.ts

@@ -0,0 +1 @@
+//# sourceMappingURL=prism_python.d.ts.map

package/dist/components/code/prism_python.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prism_python.d.ts","sourceRoot":"","sources":["../../../src/components/code/prism_python.ts"],"names":[],"mappings":""}