paris 0.23.0 → 0.24.0

package/dist/stories/input/Input.d.ts

@@ -0,0 +1,57 @@
+import { ComponentPropsWithoutRef, FC } from 'react';
+import { Enhancer } from '../../types/Enhancer';
+import { FieldProps } from '../field';
+import { TextProps } from '../text';
+export type InputProps = {
+    /**
+     * This is required for accessibility. If the label is not a string, you should provide an `aria-label` prop directly to specify the text used for accessibility
+     */
+    label: React.ReactNode;
+    /**
+     * The status of the input field.
+     * @default default
+     */
+    status?: 'default' | 'error' | 'success';
+    /**
+     * The input type. All HTML5 input types are supported, but some may require additional props to be set for full accessibility or aesthetic.
+     * @default text
+     */
+    type?: 'button' | 'checkbox' | 'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'hidden' | 'image' | 'month' | 'number' | 'password' | 'radio' | 'range' | 'reset' | 'search' | 'submit' | 'tel' | 'text' | 'time' | 'url' | 'week';
+    /**
+     * The placeholder for the input.
+     */
+    placeholder?: string;
+    /**
+     * An icon or other element to render before the Input element. A `{ size }` argument is passed that should be used to determine the width & height of the content displayed.
+     */
+    startEnhancer?: Enhancer;
+    /**
+     * An icon or other element to render after the Input element. A `{ size }` argument is passed that should be used to determine the width & height of the content displayed.
+     */
+    endEnhancer?: Enhancer;
+    /**
+     * Prop overrides for other rendered elements. Overrides for the input itself should be passed directly to the component.
+     */
+    overrides?: {
+        container?: ComponentPropsWithoutRef<'div'>;
+        label?: TextProps<'label'>;
+        description?: TextProps<'p'>;
+        startEnhancerContainer?: ComponentPropsWithoutRef<'div'>;
+        endEnhancerContainer?: ComponentPropsWithoutRef<'div'>;
+    };
+} & FieldProps;
+/**
+ * An `Input` is used to collect user input, such as text, numbers, or dates.
+ *
+ * > `overrides` available: `container`, `label`, `description`, `startEnhancerContainer`, `endEnhancerContainer`
+ *
+ * <hr />
+ *
+ * To use the `Input` component, import it as follows:
+ *
+ * ```js
+ * import { Input } from 'paris/input';
+ * ```
+ * @constructor
+ */
+export declare const Input: FC<InputProps & ComponentPropsWithoutRef<'input'>>;

package/dist/stories/input/Input.js

@@ -0,0 +1,108 @@
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { clsx } from 'clsx';
+import { forwardRef, useId } from 'react';
+import { MemoizedEnhancer } from '../../helpers/renderEnhancer.js';
+import { Field } from '../field/Field.js';
+import 'pte';
+import { theme } from '../theme/themes.js';
+import inputStyles from './Input.module.scss.js';
+
+const Input = forwardRef(
+  ({
+    label,
+    status,
+    type,
+    hideLabel,
+    description,
+    hideDescription,
+    descriptionPosition,
+    startEnhancer,
+    endEnhancer,
+    disabled,
+    overrides,
+    ...props
+  }, ref) => {
+    const inputID = useId();
+    return /* @__PURE__ */ jsx(
+      Field,
+      {
+        htmlFor: inputID,
+        label,
+        hideLabel,
+        description,
+        hideDescription,
+        disabled,
+        descriptionPosition,
+        overrides: {
+          container: {
+            ...overrides?.container,
+            className: clsx(
+              // styles.fieldContainer,
+              overrides?.container?.className
+            )
+          },
+          label: overrides?.label,
+          description: overrides?.description
+        },
+        children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: inputStyles.inputContainer,
+            "data-status": disabled ? "disabled" : status || "default",
+            children: [
+              !!startEnhancer && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  ...overrides?.startEnhancerContainer,
+                  className: clsx(inputStyles.enhancer, overrides?.startEnhancerContainer?.className),
+                  "data-status": disabled ? "disabled" : status || "default",
+                  children: !!startEnhancer && /* @__PURE__ */ jsx(
+                    MemoizedEnhancer,
+                    {
+                      enhancer: startEnhancer,
+                      size: parseInt(theme.typography.styles.paragraphSmall.fontSize, 10)
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx("div", { className: inputStyles.inputScaleWrapper, children: /* @__PURE__ */ jsx(
+                "input",
+                {
+                  ...props,
+                  id: inputID,
+                  ref,
+                  type: type || "text",
+                  "aria-label": typeof label === "string" ? label : props["aria-label"],
+                  "aria-describedby": `${inputID}-description`,
+                  "aria-disabled": disabled,
+                  "data-status": disabled ? "disabled" : status || "default",
+                  readOnly: disabled,
+                  className: clsx(props.className, inputStyles.input)
+                }
+              ) }),
+              !!endEnhancer && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  ...overrides?.endEnhancerContainer,
+                  className: clsx(inputStyles.enhancer, overrides?.endEnhancerContainer?.className),
+                  "data-status": disabled ? "disabled" : status || "default",
+                  children: !!endEnhancer && /* @__PURE__ */ jsx(
+                    MemoizedEnhancer,
+                    {
+                      enhancer: endEnhancer,
+                      size: parseInt(theme.typography.styles.paragraphSmall.fontSize, 10)
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        )
+      }
+    );
+  }
+);
+
+export { Input };
+//# sourceMappingURL=Input.js.map

package/dist/stories/input/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","sources":["../../../src/stories/input/Input.tsx"],"sourcesContent":["'use client';\n\nimport { clsx } from 'clsx';\nimport type { ComponentPropsWithoutRef, FC, ForwardedRef } from 'react';\nimport { forwardRef, useId } from 'react';\nimport { MemoizedEnhancer } from '../../helpers/renderEnhancer';\nimport type { Enhancer } from '../../types/Enhancer';\nimport type { FieldProps } from '../field';\nimport { Field } from '../field';\nimport type { TextProps } from '../text';\nimport { theme } from '../theme';\nimport styles from './Input.module.scss';\n\nexport type InputProps = {\n    /**\n     * This is required for accessibility. If the label is not a string, you should provide an `aria-label` prop directly to specify the text used for accessibility\n     */\n    label: React.ReactNode;\n    /**\n     * The status of the input field.\n     * @default default\n     */\n    status?: 'default' | 'error' | 'success';\n    /**\n     * The input type. All HTML5 input types are supported, but some may require additional props to be set for full accessibility or aesthetic.\n     * @default text\n     */\n    type?:\n        | 'button'\n        | 'checkbox'\n        | 'color'\n        | 'date'\n        | 'datetime-local'\n        | 'email'\n        | 'file'\n        | 'hidden'\n        | 'image'\n        | 'month'\n        | 'number'\n        | 'password'\n        | 'radio'\n        | 'range'\n        | 'reset'\n        | 'search'\n        | 'submit'\n        | 'tel'\n        | 'text'\n        | 'time'\n        | 'url'\n        | 'week';\n    /**\n     * The placeholder for the input.\n     */\n    placeholder?: string;\n    /**\n     * An icon or other element to render before the Input element. A `{ size }` argument is passed that should be used to determine the width & height of the content displayed.\n     */\n    startEnhancer?: Enhancer;\n    /**\n     * An icon or other element to render after the Input element. A `{ size }` argument is passed that should be used to determine the width & height of the content displayed.\n     */\n    endEnhancer?: Enhancer;\n    /**\n     * Prop overrides for other rendered elements. Overrides for the input itself should be passed directly to the component.\n     */\n    overrides?: {\n        container?: ComponentPropsWithoutRef<'div'>;\n        label?: TextProps<'label'>;\n        description?: TextProps<'p'>;\n        startEnhancerContainer?: ComponentPropsWithoutRef<'div'>;\n        endEnhancerContainer?: ComponentPropsWithoutRef<'div'>;\n    };\n} & FieldProps;\n\n/**\n * An `Input` is used to collect user input, such as text, numbers, or dates.\n *\n * > `overrides` available: `container`, `label`, `description`, `startEnhancerContainer`, `endEnhancerContainer`\n *\n * <hr />\n *\n * To use the `Input` component, import it as follows:\n *\n * ```js\n * import { Input } from 'paris/input';\n * ```\n * @constructor\n */\nexport const Input: FC<InputProps & ComponentPropsWithoutRef<'input'>> = forwardRef(\n    (\n        {\n            label,\n            status,\n            type,\n            hideLabel,\n            description,\n            hideDescription,\n            descriptionPosition,\n            startEnhancer,\n            endEnhancer,\n            disabled,\n            overrides,\n            ...props\n        },\n        ref: ForwardedRef<HTMLInputElement>,\n    ) => {\n        const inputID = useId();\n        return (\n            <Field\n                htmlFor={inputID}\n                label={label}\n                hideLabel={hideLabel}\n                description={description}\n                hideDescription={hideDescription}\n                disabled={disabled}\n                descriptionPosition={descriptionPosition}\n                overrides={{\n                    container: {\n                        ...overrides?.container,\n                        className: clsx(\n                            // styles.fieldContainer,\n                            overrides?.container?.className,\n                        ),\n                    },\n                    label: overrides?.label,\n                    description: overrides?.description,\n                }}\n            >\n                <div\n                    className={styles.inputContainer}\n                    // data-status={status}\n                    // data-disabled={disabled}\n                    data-status={disabled ? 'disabled' : status || 'default'}\n                >\n                    {!!startEnhancer && (\n                        <div\n                            {...overrides?.startEnhancerContainer}\n                            className={clsx(styles.enhancer, overrides?.startEnhancerContainer?.className)}\n                            data-status={disabled ? 'disabled' : status || 'default'}\n                        >\n                            {!!startEnhancer && (\n                                <MemoizedEnhancer\n                                    enhancer={startEnhancer}\n                                    size={parseInt(theme.typography.styles.paragraphSmall.fontSize, 10)}\n                                />\n                            )}\n                        </div>\n                    )}\n                    <div className={styles.inputScaleWrapper}>\n                        <input\n                            {...props}\n                            id={inputID}\n                            ref={ref}\n                            type={type || 'text'}\n                            aria-label={typeof label === 'string' ? label : props['aria-label']}\n                            aria-describedby={`${inputID}-description`}\n                            aria-disabled={disabled}\n                            data-status={disabled ? 'disabled' : status || 'default'}\n                            readOnly={disabled}\n                            className={clsx(props.className, styles.input)}\n                        />\n                    </div>\n                    {!!endEnhancer && (\n                        <div\n                            {...overrides?.endEnhancerContainer}\n                            className={clsx(styles.enhancer, overrides?.endEnhancerContainer?.className)}\n                            data-status={disabled ? 'disabled' : status || 'default'}\n                        >\n                            {!!endEnhancer && (\n                                <MemoizedEnhancer\n                                    enhancer={endEnhancer}\n                                    size={parseInt(theme.typography.styles.paragraphSmall.fontSize, 10)}\n                                />\n                            )}\n                        </div>\n                    )}\n                </div>\n            </Field>\n        );\n    },\n);\n"],"names":["styles"],"mappings":"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"}

package/dist/stories/input/Input.module.css

@@ -0,0 +1,165 @@
+.paris_inputContainer_a8TwY {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 12px;
+  min-height: 34px;
+  background-color: var(--pte-new-colors-inputFill);
+  width: 100%;
+  padding: calc(6px - var(--pte-typography-verticalMetricsAdjust)) 13px 6px;
+  font-size: var(--pte-typography-styles-paragraphSmall-fontSize);
+  font-style: var(--pte-typography-styles-paragraphSmall-fontStyle);
+  font-weight: var(--pte-typography-styles-paragraphSmall-fontWeight);
+  letter-spacing: var(--pte-typography-styles-paragraphSmall-letterSpacing);
+  line-height: var(--pte-typography-styles-paragraphSmall-lineHeight);
+  text-transform: var(--pte-typography-styles-paragraphSmall-textTransform);
+  border-width: 1px;
+  border-style: solid;
+  border-color: var(--pte-new-colors-inputFill);
+  border-radius: var(--pte-borders-radius-rectangle);
+  transition: var(--pte-animations-interaction);
+}
+.paris_inputContainer_a8TwY:focus-within {
+  outline: none;
+  border-color: var(--pte-new-colors-inputBorderFocus);
+  background-color: var(--pte-new-colors-inputFillFocus);
+}
+.paris_inputContainer_a8TwY[data-status=disabled] {
+  border-color: var(--pte-new-colors-inputFillDisabled);
+  background-color: var(--pte-new-colors-inputFillDisabled);
+  color: var(--pte-new-colors-contentDisabled);
+  pointer-events: none;
+  cursor: default;
+}
+.paris_inputContainer_a8TwY[data-status=disabled]:focus-within {
+  border-color: var(--pte-new-colors-inputFillDisabled) !important;
+}
+.paris_inputContainer_a8TwY[data-status=error] {
+  border-color: var(--pte-new-colors-inputBorderNegative);
+  background-color: var(--pte-new-colors-inputFillNegative);
+  color: var(--pte-new-colors-contentNegative);
+}
+.paris_inputContainer_a8TwY[data-status=error]:focus-within {
+  color: var(--pte-new-colors-contentPrimary);
+}
+.paris_inputContainer_a8TwY[data-status=success] {
+  border-color: var(--pte-new-colors-contentPositive);
+  background-color: var(--pte-new-colors-backgroundPositive);
+  color: var(--pte-new-colors-contentPositive);
+}
+.paris_inputContainer_a8TwY[data-status=success]:focus-within {
+  color: var(--pte-new-colors-contentPrimary);
+}
+.paris_inputContainer_a8TwY input[type=color], .paris_inputContainer_a8TwY input[type=date], .paris_inputContainer_a8TwY input[type=datetime], .paris_inputContainer_a8TwY input[type=datetime-local], .paris_inputContainer_a8TwY input[type=email], .paris_inputContainer_a8TwY input[type=month], .paris_inputContainer_a8TwY input[type=number], .paris_inputContainer_a8TwY input[type=password], .paris_inputContainer_a8TwY input[type=search], .paris_inputContainer_a8TwY input[type=tel], .paris_inputContainer_a8TwY input[type=text], .paris_inputContainer_a8TwY input[type=time], .paris_inputContainer_a8TwY input[type=url], .paris_inputContainer_a8TwY input[type=week], .paris_inputContainer_a8TwY select:focus, .paris_inputContainer_a8TwY textarea {
+  font-size: 16px;
+  transform: scale(0.875);
+  transform-origin: left center;
+  width: 114.2857142857%;
+}
+.paris_inputContainer_a8TwY input, .paris_inputContainer_a8TwY textarea {
+  background-color: transparent;
+  padding: 0;
+  margin: 0;
+  border: none;
+  outline: none;
+}
+.paris_inputContainer_a8TwY input::placeholder, .paris_inputContainer_a8TwY textarea::placeholder {
+  color: var(--pte-new-colors-contentTertiary);
+}
+.paris_inputContainer_a8TwY input[aria-disabled=true], .paris_inputContainer_a8TwY textarea[aria-disabled=true] {
+  color: var(--pte-new-colors-contentDisabled);
+  cursor: default;
+}
+.paris_inputContainer_a8TwY input[aria-disabled=true]::placeholder, .paris_inputContainer_a8TwY textarea[aria-disabled=true]::placeholder {
+  color: var(--pte-new-colors-contentDisabled);
+}
+.paris_inputContainer_a8TwY input[type=color]::-webkit-color-swatch, .paris_inputContainer_a8TwY textarea[type=color]::-webkit-color-swatch {
+  border: 1px solid var(--pte-new-colors-inputBorderFocus);
+  border-radius: var(--pte-borders-radius-circle);
+}
+.paris_inputContainer_a8TwY input[type=color]::-webkit-color-swatch-wrapper, .paris_inputContainer_a8TwY textarea[type=color]::-webkit-color-swatch-wrapper {
+  width: 16px;
+  height: 100%;
+}
+.paris_inputContainer_a8TwY input[type=file]::-webkit-file-upload-button, .paris_inputContainer_a8TwY textarea[type=file]::-webkit-file-upload-button {
+  display: none;
+}
+.paris_inputContainer_a8TwY input[data-status=disabled], .paris_inputContainer_a8TwY textarea[data-status=disabled] {
+  color: var(--pte-new-colors-contentDisabled);
+}
+.paris_inputContainer_a8TwY input[data-status=disabled]::placeholder, .paris_inputContainer_a8TwY textarea[data-status=disabled]::placeholder {
+  color: var(--pte-new-colors-contentDisabled);
+}
+.paris_inputContainer_a8TwY input[data-status=error], .paris_inputContainer_a8TwY textarea[data-status=error] {
+  color: var(--pte-new-colors-contentNegative);
+}
+.paris_inputContainer_a8TwY input[data-status=error]::placeholder, .paris_inputContainer_a8TwY textarea[data-status=error]::placeholder {
+  color: var(--pte-new-colors-contentNegative);
+}
+.paris_inputContainer_a8TwY input[data-status=success], .paris_inputContainer_a8TwY textarea[data-status=success] {
+  color: var(--pte-new-colors-contentPositive);
+}
+.paris_inputContainer_a8TwY input[data-status=success]::placeholder, .paris_inputContainer_a8TwY textarea[data-status=success]::placeholder {
+  color: var(--pte-new-colors-contentPositive);
+}
+
+.paris_inputScaleWrapper_XVKDd {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+}
+
+.paris_enhancer_dWZ5z {
+  display: flex;
+  color: var(--pte-new-colors-contentSecondary);
+  margin-block-start: -0.5px;
+  font-size: var(--pte-typography-styles-paragraphSmall-fontSize);
+  font-style: var(--pte-typography-styles-paragraphSmall-fontStyle);
+  font-weight: var(--pte-typography-styles-paragraphSmall-fontWeight);
+  letter-spacing: var(--pte-typography-styles-paragraphSmall-letterSpacing);
+  line-height: var(--pte-typography-styles-paragraphSmall-lineHeight);
+  text-transform: var(--pte-typography-styles-paragraphSmall-textTransform);
+}
+.paris_enhancer_dWZ5z[data-status=disabled] {
+  color: var(--pte-new-colors-contentDisabled);
+}
+.paris_enhancer_dWZ5z[data-status=error] {
+  color: var(--pte-new-colors-contentNegative);
+}
+.paris_enhancer_dWZ5z[data-status=success] {
+  color: var(--pte-new-colors-contentPositive);
+}
+
+.paris_container_4aoux {
+  width: 100%;
+  user-select: var(--pte-utils-defaultUserSelect);
+  cursor: default;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.paris_labelContainer_23crm {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  align-items: flex-start;
+  justify-content: flex-start;
+}
+
+.paris_label_3aOoG.paris_label_3aOoG {
+  color: var(--pte-new-colors-contentPrimary);
+  font-weight: var(--pte-typography-fontWeights-medium);
+}
+
+.paris_description_XO-Hx.paris_description_XO-Hx {
+  color: var(--pte-new-colors-contentTertiary);
+}
+
+.paris_hidden_NLeJu {
+  display: none;
+}
+
+.paris_input_Pjdom::-webkit-calendar-picker-indicator {
+  display: none;
+}

package/dist/stories/input/Input.module.scss.js

@@ -0,0 +1,23 @@
+import './Input.module.css';const inputContainer = "paris_inputContainer_a8TwY";
+const inputScaleWrapper = "paris_inputScaleWrapper_XVKDd";
+const enhancer = "paris_enhancer_dWZ5z";
+const container = "paris_container_4aoux";
+const labelContainer = "paris_labelContainer_23crm";
+const label = "paris_label_3aOoG";
+const description = "paris_description_XO-Hx";
+const hidden = "paris_hidden_NLeJu";
+const input = "paris_input_Pjdom";
+const inputStyles = {
+	inputContainer: inputContainer,
+	inputScaleWrapper: inputScaleWrapper,
+	enhancer: enhancer,
+	container: container,
+	labelContainer: labelContainer,
+	label: label,
+	description: description,
+	hidden: hidden,
+	input: input
+};
+
+export { container, inputStyles as default, description, enhancer, hidden, input, inputContainer, inputScaleWrapper, label, labelContainer };
+//# sourceMappingURL=Input.module.scss.js.map

package/dist/stories/input/Input.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/stories/input/index.js

@@ -0,0 +1,2 @@
+export { Input } from './Input.js';
+//# sourceMappingURL=index.js.map

package/dist/stories/input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/stories/markdown/Markdown.d.ts

@@ -0,0 +1,36 @@
+import { FC } from 'react';
+import { TextProps } from '../text';
+export type MarkdownSize = Extract<TextProps['kind'], 'paragraphLarge' | 'paragraphMedium' | 'paragraphSmall' | 'paragraphXSmall' | 'paragraphXXSmall'>;
+export type MarkdownProps = {
+    /** The markdown string to render. */
+    children: string;
+    /** An optional CSS class name for the wrapper element. */
+    className?: string;
+    /**
+     * The base text size for body content (paragraphs, list items, inline text).
+     * Maps to Paris paragraph typography variants. Headings and labels are unaffected.
+     * @default 'paragraphSmall'
+     */
+    size?: MarkdownSize;
+};
+/**
+ * A `Markdown` component renders a markdown string using Paris design system components.
+ *
+ * It supports GitHub-flavored markdown (tables, task lists, strikethrough, footnotes)
+ * and HTML passthrough for elements like `<kbd>`, `<mark>`, `<details>`, and `<dl>`.
+ *
+ * <hr />
+ *
+ * To use this component, import it as follows:
+ *
+ * ```tsx
+ * import { Markdown } from 'paris/markdown';
+ *
+ * export const Example: FC = () => (
+ *     <Markdown>{`# Hello World\n\nThis is **bold** and *italic* text.`}</Markdown>
+ * );
+ * ```
+ *
+ * @constructor
+ */
+export declare const Markdown: FC<MarkdownProps>;

package/dist/stories/markdown/Markdown.js

@@ -0,0 +1,141 @@
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { clsx } from 'clsx';
+import { memo, useMemo, Children, isValidElement } from 'react';
+import ReactMarkdown from 'react-markdown';
+import rehypeRaw from 'rehype-raw';
+import remarkGfm from 'remark-gfm';
+import { Accordion } from '../accordion/Accordion.js';
+import { Callout } from '../callout/Callout.js';
+import { StyledLink } from '../styledlink/StyledLink.js';
+import { Text } from '../text/Text.js';
+import 'pte';
+import { pvar } from '../theme/themes.js';
+import styles from './Markdown.module.scss.js';
+
+const smallerSize = {
+  paragraphLarge: "paragraphMedium",
+  paragraphMedium: "paragraphSmall",
+  paragraphSmall: "paragraphXSmall",
+  paragraphXSmall: "paragraphXXSmall",
+  paragraphXXSmall: "paragraphXXSmall"
+};
+function extractText(children) {
+  return Children.toArray(children).map((child) => {
+    if (typeof child === "string") return child;
+    if (typeof child === "number") return String(child);
+    if (isValidElement(child) && child.props?.children) {
+      return extractText(child.props.children);
+    }
+    return "";
+  }).join("");
+}
+const headingConfig = {
+  1: { kind: "headingLarge", as: "h1" },
+  2: { kind: "headingMedium", as: "h2" },
+  3: { kind: "headingSmall", as: "h3" },
+  4: { kind: "headingXSmall", as: "h4" },
+  5: { kind: "headingXXSmall", as: "h5" },
+  6: { kind: "labelMedium", as: "h6" }
+};
+function createHeading(level) {
+  const { kind, as } = headingConfig[level];
+  const HeadingComponent = ({ children }) => {
+    const id = extractText(children).toLowerCase().replace(/\s+/g, "-").replace(/[^\w-]/g, "");
+    return /* @__PURE__ */ jsx(Text, { as, kind, className: styles.heading, id, children });
+  };
+  return HeadingComponent;
+}
+function createMarkdownComponents(size) {
+  const ddSize = smallerSize[size];
+  return {
+    // ── Headings ──────────────────────────────────────────────
+    h1: createHeading(1),
+    h2: createHeading(2),
+    h3: createHeading(3),
+    h4: createHeading(4),
+    h5: createHeading(5),
+    h6: createHeading(6),
+    // ── Paragraphs & inline text ─────────────────────────────
+    p: ({ children }) => /* @__PURE__ */ jsx(Text, { as: "p", kind: size, className: styles.paragraph, children }),
+    strong: ({ children }) => /* @__PURE__ */ jsx(Text, { as: "span", kind: size, weight: "semibold", children }),
+    em: ({ children }) => /* @__PURE__ */ jsx(Text, { as: "span", kind: size, fontStyle: "italic", children }),
+    del: ({ children }) => /* @__PURE__ */ jsx("span", { className: styles.strikethrough, children }),
+    // ── Links & images ───────────────────────────────────────
+    a: ({ href, children }) => /* @__PURE__ */ jsx(StyledLink, { href, target: "_blank", rel: "noopener noreferrer", children }),
+    img: ({ src, alt }) => /* @__PURE__ */ jsx("span", { className: styles.imageWrapper, children: /* @__PURE__ */ jsx("img", { src, alt: alt || "", className: styles.image, loading: "lazy" }) }),
+    // ── Blockquotes ──────────────────────────────────────────
+    blockquote: ({ children }) => /* @__PURE__ */ jsx(Callout, { variant: "default", icon: null, className: styles.blockquote, children }),
+    // ── Horizontal rules ─────────────────────────────────────
+    hr: () => /* @__PURE__ */ jsx("hr", { className: styles.hr }),
+    // ── Lists ────────────────────────────────────────────────
+    ul: ({ children, className }) => {
+      const isTaskList = className === "contains-task-list";
+      return /* @__PURE__ */ jsx("ul", { className: clsx(styles.list, styles.unorderedList, isTaskList && styles.taskList), children });
+    },
+    ol: ({ children, start }) => /* @__PURE__ */ jsx("ol", { className: clsx(styles.list, styles.orderedList), start, children }),
+    li: ({ children, className }) => {
+      const isTask = className === "task-list-item";
+      return /* @__PURE__ */ jsx("li", { className: clsx(styles.listItem, isTask && styles.taskListItem), children });
+    },
+    // ── Code ─────────────────────────────────────────────────
+    code: ({ children, className }) => {
+      const languageMatch = className?.match(/language-(\w+)/);
+      const isBlock = !!languageMatch;
+      if (isBlock) {
+        return /* @__PURE__ */ jsxs("div", { className: styles.codeBlockWrapper, children: [
+          languageMatch?.[1] && /* @__PURE__ */ jsx("div", { className: styles.codeLanguage, children: /* @__PURE__ */ jsx(Text, { as: "span", kind: "labelXSmall", weight: "medium", children: languageMatch[1] }) }),
+          /* @__PURE__ */ jsx("code", { className: clsx(styles.codeBlock, className), children })
+        ] });
+      }
+      return /* @__PURE__ */ jsx("code", { className: styles.inlineCode, children });
+    },
+    pre: ({ children }) => /* @__PURE__ */ jsx("pre", { className: styles.pre, children }),
+    // ── Tables ───────────────────────────────────────────────
+    table: ({ children }) => /* @__PURE__ */ jsx("div", { className: styles.tableWrapper, children: /* @__PURE__ */ jsx("table", { className: styles.table, children }) }),
+    thead: ({ children }) => /* @__PURE__ */ jsx("thead", { className: styles.thead, children }),
+    tbody: ({ children }) => /* @__PURE__ */ jsx("tbody", { className: styles.tbody, children }),
+    tr: ({ children }) => /* @__PURE__ */ jsx("tr", { className: styles.tr, children }),
+    th: ({ children, style }) => /* @__PURE__ */ jsx("th", { className: styles.th, style, children: /* @__PURE__ */ jsx(Text, { as: "span", kind: "labelXSmall", weight: "semibold", children }) }),
+    td: ({ children, style }) => /* @__PURE__ */ jsx("td", { className: styles.td, style, children }),
+    // ── HTML passthrough elements ────────────────────────────
+    details: ({ children }) => {
+      const childArray = Children.toArray(children);
+      let summaryContent = "Details";
+      const bodyContent = [];
+      for (const child of childArray) {
+        if (isValidElement(child) && child.type === "summary") {
+          summaryContent = child.props.children;
+        } else {
+          bodyContent.push(child);
+        }
+      }
+      return /* @__PURE__ */ jsx(Accordion, { title: summaryContent, kind: "card", size: "small", children: /* @__PURE__ */ jsx("div", { className: styles.accordionBody, children: bodyContent }) });
+    },
+    summary: () => null,
+    kbd: ({ children }) => /* @__PURE__ */ jsx("kbd", { className: styles.kbd, children }),
+    sup: ({ children }) => /* @__PURE__ */ jsx("sup", { className: styles.sup, children }),
+    sub: ({ children }) => /* @__PURE__ */ jsx("sub", { className: styles.sub, children }),
+    mark: ({ children }) => /* @__PURE__ */ jsx("mark", { className: styles.mark, children }),
+    // ── Definition lists (HTML passthrough) ──────────────────
+    dl: ({ children }) => /* @__PURE__ */ jsx("dl", { className: styles.dl, children }),
+    dt: ({ children }) => /* @__PURE__ */ jsx("dt", { className: styles.dt, children: /* @__PURE__ */ jsx(Text, { as: "span", kind: size, weight: "semibold", children }) }),
+    dd: ({ children }) => /* @__PURE__ */ jsx("dd", { className: styles.dd, children: /* @__PURE__ */ jsx(Text, { as: "span", kind: ddSize, color: pvar("new.colors.contentSecondary"), children }) })
+  };
+}
+const Markdown = memo(({ children, className, size = "paragraphSmall" }) => {
+  const components = useMemo(() => createMarkdownComponents(size), [size]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: clsx(styles.markdown, className),
+      style: {
+        "--markdown-base-font-size": `var(--pte-new-typography-styles-${size}-fontSize)`
+      },
+      children: /* @__PURE__ */ jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], rehypePlugins: [rehypeRaw], components, children })
+    }
+  );
+});
+
+export { Markdown };
+//# sourceMappingURL=Markdown.js.map