### Kaggle Page Load Timing and Stylesheet Handling

Source: https://kaggle.com/carlolepelaars

Sets page request start and end times, captures initial page load time, and defines the JupyterLab path. It also dynamically updates the 'media' attribute of asynchronously loaded stylesheets to 'all' once they are ready, improving rendering performance.

```javascript
window["pageRequestStartTime"] = 1753349493210;
window["pageRequestEndTime"] = 1753349493220;
window["initialPageLoadStartTime"] = new Date().getTime();
window.KAGGLE_JUPYTERLAB_PATH = "/static/assets/jupyterlab-v4/jupyterlab-index-c627dac300f0e757be07.html";

const styleSheetIds = ["async-google-font-1", "async-google-font-2"];
styleSheetIds.forEach(function (id) {
  document.getElementById(id).addEventListener("load", function() {
    this.media = "all";
  });
});
```

--------------------------------

### Highlight.js and MathJax Configuration

Source: https://carlo.ai/books

Configures Highlight.js for code syntax highlighting with a copy button plugin and sets up MathJax for rendering mathematical formulas.

```javascript
hljs.addPlugin(new CopyButtonPlugin());
hljs.configure({'cssSelector': 'pre code:not([data-highlighted="yes"])'});
htmx.onLoad(hljs.highlightAll);
MathJax.Hub.Config({
  tex2jax: {
    inlineMath: [['$','$'], ['\\(','\\)']],
    displayMath: [['$$','$$'], ['\\[','\\]']],
    processEscapes: true
  }
});
```

--------------------------------

### Code Highlighting and MathJax Configuration

Source: https://carlo.ai/q4p

Configures Highlight.js for code block highlighting with a copy button plugin and integrates MathJax for rendering mathematical formulas, supporting inline and display math.

```javascript
hljs.addPlugin(new CopyButtonPlugin());
hljs.configure({'cssSelector': 'pre code:not([data-highlighted="yes"])'});
htmx.onLoad(hljs.highlightAll);
MathJax.Hub.Config({
  tex2jax: {
    inlineMath: [['$','$'], ['\\(','\\)']],
    displayMath: [['$$','$$'], ['\\[','\\]']],
    processEscapes: true
  }
});
```

--------------------------------

### Quantum Circuit Conversion with skq

Source: https://carlo.ai/q4p

Demonstrates the functionality of the skq library for converting quantum circuits between different quantum computing frameworks. This allows users to run circuits on various cloud providers without vendor lock-in.

```Python
from skq import QuantumCircuit

# Assume 'my_circuit' is a QuantumCircuit object built using skq
# For example:
# my_circuit = QuantumCircuit(2)
# my_circuit.h(0)
# my_circuit.cx(0, 1)

# Convert to Qiskit
# qiskit_circuit = my_circuit.to_qiskit()

# Convert to Pennylane
# pennylane_circuit = my_circuit.to_pennylane()

# Convert to OpenQASM
# openqasm_code = my_circuit.to_openqasm()

# The actual conversion code would involve specific method calls on the skq circuit object.
```

--------------------------------

### Code Highlighting and MathJax Configuration

Source: https://carlo.ai/posts

Configures highlight.js for code block highlighting with a copy button plugin and initializes MathJax for rendering mathematical formulas.

```javascript
hljs.addPlugin(new CopyButtonPlugin());
hljs.configure({'cssSelector': 'pre code:not([data-highlighted="yes"])'});
htmx.onLoad(hljs.highlightAll);
MathJax.Hub.Config({
  tex2jax: {
    inlineMath: [['$','$'], ['\\(','\\)']],
    displayMath: [['$$','$$'], ['\\[','\\]']],
    processEscapes: true
  }
});
```

--------------------------------

### Website Theme Toggling and Persistence

Source: https://carlo.ai/til

Manages website theme (light/dark) using CSS variables and local storage. Includes functions to set and toggle themes.

```javascript
function setTheme(theme) { document.documentElement.setAttribute('data-theme', theme); localStorage.setItem('theme', theme); }
function toggleDarkMode() { const currentTheme = document.documentElement.getAttribute('data-theme'); const newTheme = currentTheme === 'dark' ? 'light' : 'dark'; setTheme(newTheme); }
(function() { const savedTheme = localStorage.getItem('theme') || 'light'; setTheme(savedTheme); })();
```

--------------------------------

### Perfect Numbers Primer

Source: https://carlo.ai/til

This TIL post provides a primer on perfect numbers and explains how to generate them. It touches upon mathematical concepts.

```APIDOC
Perfect Numbers:
  Description: A primer on perfect numbers and how to generate them.
  Topics: Mathematics, Number Theory
  Date: Feb 20 2025
```

--------------------------------

### Quantum Computing Fundamentals with NumPy

Source: https://carlo.ai/q4p

Illustrates how NumPy can be used as a foundational library for simulating quantum algorithms and performing essential linear algebra operations. Quantum states and operations are represented using NumPy arrays.

```Python
import numpy as np

# Example: Representing a qubit state vector
# |0> state
qubit_0 = np.array([1, 0])
# |1> state
qubit_1 = np.array([0, 1])

# Example: Hadamard gate matrix
H = 1/np.sqrt(2) * np.array([[1, 1], [1, -1]])

# Applying Hadamard gate to |0> state
superposition_state = np.dot(H, qubit_0)

# print(superposition_state) # Output: [0.70710678 0.70710678]

# Quantum algorithms often involve matrix multiplication and complex number arithmetic, both well-supported by NumPy.
```

--------------------------------

### Navigation Bar Styling

Source: https://carlo.ai/q4p

Provides CSS for a responsive navigation bar, including styling for links, hover effects, and layout adjustments for smaller screens.

```css
.navbar { background-color: var(--navbar-bg); color: var(--navbar-text); padding: 0.5rem 1rem; box-shadow: 0 2px 4px rgba(0,0,0,0.1); display: flex; justify-content: space-between; align-items: center; }
.nav-left, .nav-right { display: flex; align-items: center; }
.nav-list { list-style-type: none; padding: 0; margin: 0; display: flex; }
.nav-list li { margin-right: 15px; }
.nav-list a, .name-container { color: var(--navbar-text); text-decoration: none; font-weight: bold; text-transform: uppercase; letter-spacing: 1px; transition: color 0.3s ease, background-color 0.3s ease; font-size: 14px; padding: 5px 10px; border-radius: 5px; }
.nav-list a:hover, .name-container:hover { color: var(--navbar-hover-text); background-color: var(--navbar-hover-bg); }
.name-container { text-align: right; cursor: pointer; }
.tagline { font-size: 12px; font-weight: normal; text-transform: none; letter-spacing: normal; }
@media (max-width: 768px) {
  .nav-list { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; }
}
.nav-right { display: flex; align-items: center; gap: 15px; }
.dark-mode-toggle { margin-left: 10px; }
```

--------------------------------

### Highlight.js Configuration

Source: https://carlo.ai/thesis

Configures Highlight.js for syntax highlighting, adding a copy button plugin and specifying which code blocks to highlight.

```javascript
hljs.addPlugin(new CopyButtonPlugin());
hljs.configure({'cssSelector': 'pre code:not([data-highlighted="yes"])'});
htmx.onLoad(hljs.highlightAll);
```

--------------------------------

### CSS Styling for Application Layout

Source: https://carlo.ai/tools

Provides styling rules for the application's layout, including body, content, footer, social links, and dark mode toggle. Ensures responsive design and visual appeal.

```css
body { line-height: 1.6; margin: 0; padding: 0; display: flex; flex-direction: column; min-height: 100vh; }
.content { width: 95%; margin: auto; padding: 20px; flex: 1; margin-bottom: 60px; }
.footer { text-align: center; padding: 20px; background-color: var(--navbar-bg); color: var(--navbar-text); position: fixed; bottom: 0; left: 0; right: 0; display: flex; justify-content: center; align-items: center; gap: 20px; }
.footer a, .footer a i { color: var(--navbar-text); text-decoration: none; font-size: 24px; transition: color 0.3s ease; }
.footer a:hover, .footer a:hover i { color: var(--navbar-hover-text); }
[data-theme="light"] .footer a:hover, [data-theme="light"] .footer a:hover i { color: #000000; }
[data-theme="dark"] .footer a:hover, [data-theme="dark"] .footer a:hover i { color: #000000; }
.dark-mode-toggle { background-color: var(--background-color); color: var(--text-color); border: 1px solid var(--text-color); padding: 5px 10px; cursor: pointer; transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; }
.dark-mode-toggle:hover { background-color: var(--text-color); color: var(--background-color); border-color: var(--background-color); }
.footer img { transition: filter 0.2s ease; }
.footer img:hover { filter: hue-rotate(85deg) brightness(1.1); /* This transforms orange to green */ }
.copyright-text { font-size: 12px; }
```

--------------------------------

### Google Analytics Initialization

Source: https://carlo.ai/q4p

Initializes Google Analytics (gtag.js) for page view tracking and event sending. Includes error handling for robust execution.

```javascript
try { window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-JVDVJFFNCL'); gtag('event', 'page_view'); } catch (error) { console.error('GA Error:', error); }
```

--------------------------------

### CSS Theming and Dark Mode

Source: https://carlo.ai/q4p

Defines CSS variables for light and dark themes, including background, text, and navbar colors. Implements a JavaScript function to toggle between themes and persist the choice in local storage.

```css
:root { --pico-font-size: 100%; --background-color: #ffffff; --text-color: #000000; --navbar-bg: #007bff; --navbar-text: #ffffff; --navbar-hover-bg: #000000; --navbar-hover-text: #ffffff; --border-color: #333333; }
[data-theme="dark"] { --background-color: #1a1a1a; --text-color: #ffffff; --navbar-bg: #0056b3; --navbar-text: #ffffff; --navbar-hover-bg: #000000; --navbar-hover-text: #ffffff; --border-color: #eaeaea; }
```

```javascript
function setTheme(theme) { document.documentElement.setAttribute('data-theme', theme); localStorage.setItem('theme', theme); }
function toggleDarkMode() { const currentTheme = document.documentElement.getAttribute('data-theme'); const newTheme = currentTheme === 'dark' ? 'light' : 'dark'; setTheme(newTheme); }
(function() { const savedTheme = localStorage.getItem('theme') || 'light'; setTheme(savedTheme); })();
```

--------------------------------

### Anchor Link Generation

Source: https://carlo.ai/q4p

Adds anchor links ('#') to headers (h1-h4) on page load. Generates unique IDs for headers if they don't exist and makes the anchor link visible on hover.

```javascript
document.addEventListener("DOMContentLoaded", () => {
  const skipPaths = ['/posts', '/til', '/tools'];
  const currentPath = window.location.pathname;
  if (skipPaths.includes(currentPath) || skipPaths.includes(currentPath.replace(/\/$/, ''))) {
    return;
  }
  document.querySelectorAll("h1, h2, h3, h4").forEach(header => {
    if (!header.id) {
      header.id = header.textContent.toLowerCase()
        .replace(/\s+/g, '-')
        .replace(/[^\w-\s]/g, '')
        .replace(/^-+|-+$/g, '');
    }
    const headerText = header.innerHTML;
    header.innerHTML = `<span style="position: relative; display: inline-block;">${headerText}<a href="#${header.id}" class="anchor-link">#</a></span>`;
  });
});
```

--------------------------------

### Marimo Snippets in FastHTML

Source: https://carlo.ai/til

This TIL post discusses running interactive Python apps inline in web apps using Marimo and FastHTML. No code snippet is provided in the source text.

```APIDOC
Marimo Snippets in FastHTML:
  Description: Run interactive Python apps inline in web apps using FastHTML.
  Topics: Python, Web Development, Marimo, FastHTML
  Date: Mar 22
```

--------------------------------

### TIL Overview and Grid Layout

Source: https://carlo.ai/til

Styles the main content area for TIL posts, including a grid layout for individual TIL items. Defines spacing and borders for each item.

```css
.til-overview { margin: 0 auto; }
.til-grid { display: grid; gap: 2rem; margin-top: 2rem; }
.til-item { display: flex; align-items: start; gap: 1rem; padding: 1rem; border: 1px solid #eaeaea; border-radius: 8px; }
.til-text { flex: 1; }
.til-image { width: 150px; height: 150px; object-fit: cover; border-radius: 8px; }
```

--------------------------------

### Highlight.js and MathJax Integration

Source: https://carlo.ai/tools

Configures Highlight.js for code syntax highlighting with a copy button plugin and integrates MathJax for rendering mathematical formulas. It ensures that code blocks are highlighted and math expressions are processed correctly on page load.

```javascript
hljs.addPlugin(new CopyButtonPlugin());
hljs.configure({'cssSelector': 'pre code:not([data-highlighted="yes"])'});
htmx.onLoad(hljs.highlightAll);
MathJax.Hub.Config({
  tex2jax: {
    inlineMath: [['$', '$']],
    displayMath: [['$$', '$$']],
    processEscapes: true
  }
});
```

--------------------------------

### Google Tag Manager Initialization

Source: https://buymeacoffee.com/carlolepelaars

Initializes Google Tag Manager (GTM) for website analytics and tracking. It loads the GTM script asynchronously, enabling event tracking and data collection for the page.

```javascript
window.dataLayer = window.dataLayer || [];
function gtag() {
  dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-JVDVJFFNCL');
```

--------------------------------

### Google Analytics Initialization

Source: https://carlo.ai/posts

Initializes Google Analytics tracking by pushing a page view event. Includes error handling for robust execution.

```javascript
try {
  window.dataLayer = window.dataLayer || [];
  function gtag() {
    dataLayer.push(arguments);
  }
  gtag('js', new Date());
  gtag('config', 'G-JVDVJFFNCL');
  gtag('event', 'page_view');
} catch (error) {
  console.error('GA Error:', error);
}
```

--------------------------------

### Markdown Parsing with Marked.js

Source: https://carlo.ai/til

This snippet demonstrates how to initialize the Marked.js library to parse Markdown content within HTML elements. It listens for the DOMContentLoaded event to ensure the HTML is fully loaded before attempting to parse.

```JavaScript
document.addEventListener('DOMContentLoaded', (event) => {
  document.querySelectorAll('.marked').forEach((el) => {
    el.innerHTML = marked.parse(el.textContent);
  });
});
```

--------------------------------

### CSS Variables for Theming

Source: https://carlo.ai/tools

Defines CSS custom properties for theming, including base styles and dark mode overrides. This allows for dynamic theme switching based on user preference or system settings.

```css
:root { --pico-font-size: 100%; }
:root { --background-color: #ffffff; --text-color: #000000; --navbar-bg: #007bff; --navbar-text: #ffffff; --navbar-hover-bg: #000000; --navbar-hover-text: #ffffff; --border-color: #333333; }
[data-theme="dark"] { --background-color: #1a1a1a; --text-color: #ffffff; --navbar-bg: #0056b3; --navbar-text: #ffffff; --navbar-hover-bg: #000000; --navbar-hover-text: #ffffff; --border-color: #eaeaea; }
```

--------------------------------

### Serialize Query String Options

Source: https://buymeacoffee.com/carlolepelaars

Handles the serialization of URL query string parameters. It processes various configuration options such as encoding, filtering, delimiters, and character sets to construct a valid query string. Supports custom encoders and formatters.

```javascript
function(t,r,e,n){var o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{};if("string"==typeof t?t=t.split("."):"object"==typeof t&&null!==t?t=Object.keys(t):t="",void 0===r&&(r={}),void 0===e&&(e={}),void 0===n&&(n={}),o.arrayFormat in h?r.arrayFormat=o.arrayFormat:o.arrayFormat&&"indices"in o?r.arrayFormat=o.arrayFormat:r.arrayFormat=o.arrayFormat||"indices",r.sort=o.sort||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.encode=o.encode||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.comma=","===r.delimiter?r.delimiter:o.comma||r.delimiter,r.comma=o.comma||r.delimiter,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r.filter=o.filter||null,r.strictNullHandling=o.strictNullHandling||null,r.skipNulls=o.skipNulls||null,r.sort=o.sort||null,r.arrayFormat=o.arrayFormat||null,r.addQueryPrefix=o.addQueryPrefix||null,r.encode=o.encode||null,r.encodeValuesOnly=o.encodeValuesOnly||null,r.charset=o.charset||null,r.charsetSentinel=o.charsetSentinel||null,r.delimiter=o.delimiter||null,r.format=o.format||null,r.formatter=o.formatter||null,r.serializeDate=o.serializeDate||null,r.ignoreQueryPrefix=o.ignoreQueryPrefix||null,r.allowDots=o.allowDots||null,r.encoder=o.encoder||null,r
```

--------------------------------

### Highlight.js and HTMX Integration

Source: https://carlo.ai/

Configures Highlight.js for code syntax highlighting and integrates it with HTMX for dynamic content loading. It sets up a copy button plugin and ensures highlighting occurs after HTMX loads content.

```javascript
hljs.addPlugin(new CopyButtonPlugin());
hljs.configure({'cssSelector': 'pre code:not([data-highlighted="yes"])'});
htmx.onLoad(hljs.highlightAll);
```

--------------------------------

### Google Analytics Initialization

Source: https://carlo.ai/books

Initializes Google Analytics (gtag.js) and sends a page_view event. Includes error handling for script loading.

```javascript
try { window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-JVDVJFFNCL'); gtag('event', 'page_view'); } catch (error) { console.error('GA Error:', error); }
```