chatbot-groq-LLM-demo.ipynb

{
  "cells": [
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "view-in-github"
      },
      "source": [
        "<a href=\"https://colab.research.google.com/github/toche7/PromptEngforDeveloper/blob/main/PromptLab7_ChatBot.ipynb\" target=\"_parent\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "r896v3OndCEF"
      },
      "source": [
        "# Topping Steak Restaurant ChatBot\n"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": null,
      "metadata": {
        "id": "L-o4lTlydG0f",
        "colab": {
          "base_uri": "https://localhost:8080/"
        },
        "outputId": "4aedd862-951a-464b-a3a6-204efd128231"
      },
      "outputs": [
        {
          "output_type": "stream",
          "name": "stdout",
          "text": [
            "\u001b[?25l   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m0.0/103.5 kB\u001b[0m \u001b[31m?\u001b[0m eta \u001b[36m-:--:--\u001b[0m\r\u001b[2K   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m103.5/103.5 kB\u001b[0m \u001b[31m3.5 MB/s\u001b[0m eta \u001b[36m0:00:00\u001b[0m\n",
            "\u001b[2K   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m75.6/75.6 kB\u001b[0m \u001b[31m2.6 MB/s\u001b[0m eta \u001b[36m0:00:00\u001b[0m\n",
            "\u001b[2K   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m77.9/77.9 kB\u001b[0m \u001b[31m3.1 MB/s\u001b[0m eta \u001b[36m0:00:00\u001b[0m\n",
            "\u001b[2K   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m58.3/58.3 kB\u001b[0m \u001b[31m2.8 MB/s\u001b[0m eta \u001b[36m0:00:00\u001b[0m\n",
            "\u001b[?25h"
          ]
        }
      ],
      "source": [
        "# !pip -q install python-dotenv\n",
        "!pip -q install groq"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": null,
      "metadata": {
        "id": "juDU_CDxdWTe"
      },
      "outputs": [],
      "source": [
        "#========google.colab=======================\n",
        "from google.colab import userdata\n",
        "secret_key = userdata.get('GROQ_API_KEY')\n",
        "\n",
        "#===== create Groq object=================\n",
        "from groq import Groq\n",
        "clientGroq = Groq(\n",
        "    api_key= secret_key,\n",
        ")"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": null,
      "metadata": {
        "id": "6exzOuy-dr5E"
      },
      "outputs": [],
      "source": [
        "def get_completion(prompt, model= \"llama3-70b-8192\", clientGroq = clientGroq):\n",
        "    messages = [{\"role\": \"user\", \"content\": prompt}]\n",
        "    response = clientGroq.chat.completions.create(\n",
        "        model=model,\n",
        "        messages=messages,\n",
        "        temperature=0,\n",
        "        max_tokens= 4000,\n",
        "        top_p = 0.5\n",
        "    )\n",
        "    return response.choices[0].message.content\n",
        "\n",
        "\n",
        "def get_completion_from_messages(messages, model= \"llama3-70b-8192\", clientGroq = clientGroq, temperature=0):\n",
        "    response = clientGroq.chat.completions.create(\n",
        "        model=model,\n",
        "        messages=messages,\n",
        "        temperature=temperature,\n",
        "        max_tokens= 4000,\n",
        "        top_p = 0.5\n",
        "    )\n",
        "    return response.choices[0].message.content\n"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": null,
      "metadata": {
        "id": "qEMvxGmkhdql"
      },
      "outputs": [],
      "source": [
        "def collect_messages(_):\n",
        "    prompt = inp.value_input\n",
        "    inp.value = ''\n",
        "    context.append({'role':'user', 'content':f\"{prompt}\"})\n",
        "    response = get_completion_from_messages(context)\n",
        "    context.append({'role':'assistant', 'content':f\"{response}\"})\n",
        "    panels.append(\n",
        "        pn.Row('User:', pn.pane.Markdown(prompt, width=600)))\n",
        "    panels.append(\n",
        "        pn.Row('Assistant:', pn.pane.Markdown(response, width=600, styles={'background-color': '#F6F6F6'})))\n",
        "\n",
        "    return pn.Column(*panels)\n"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "NTc_ozuWZbti"
      },
      "source": [
        "## Project: Build Your Order Bot\n"
      ]
    },
    {
      "cell_type": "code",
      "source": [
        "import panel as pn  # GUI\n",
        "panels = [] # collect display\n",
        "\n",
        "context = [ {'role':'system', 'content':\"\"\"\n",
        "You are Topping Steakhouse Order Bot, an automated service to collect orders for a Steak House restaurant. \\\n",
        "You first greet the customer with content, \\\n",
        "Welcome to Topping Steakhouse, \\\n",
        "\n",
        "where culinary excellence meets a passion for premium quality! At Topping, \\\n",
        "we pride ourselves on serving the finest steaks, meticulously prepared using a blend of natural imported ingredients and locally sourced produce. \\\n",
        "Our mission is to provide an unforgettable dining experience that captures the essence of nature’s bounty in every bite. \\\n",
        "\n",
        "Our cozy and elegant atmosphere, combined with our commitment to exceptional service, \\\n",
        "makes Topping the perfect place for family gatherings, romantic dinners, or a casual meal with friends. \\\n",
        "Join us at Topping Steakhouse and savor the flavors of perfection! \\\n",
        "\n",
        "You will introduce menu with this. \\\n",
        "- Classic Ribeye Steak is A tender, juicy ribeye steak grilled to perfection, served with garlic mashed potatoes and sautéed seasonal vegetables. \\\n",
        "- T-Bone Steak is A hearty T-bone steak cooked to your liking, accompanied by a baked potato loaded with sour cream, chives, and bacon bits. \\\n",
        "- Filet Mignon is A succulent filet mignon wrapped in bacon, served with creamy horseradish sauce, roasted Brussels sprouts, and a side of truffle fries. \\\n",
        "- New York Strip is A flavorful New York strip steak, paired with a classic Caesar salad and a side of sweet potato fries. \\\n",
        "- Steak Diane is A Tender medallions of beef cooked in a rich, cognac-infused Diane sauce, served with wild rice pilaf and steamed asparagus. \\\n",
        "- Peppercorn-Crusted Sirloin is A sirloin steak encrusted with cracked black peppercorns, drizzled with a brandy cream sauce, and served with a side of herb-roasted potatoes. \\\n",
        "- Surf and Turf is A perfect pairing of a juicy steak and a lobster tail, served with drawn butter, garlic butter shrimp, and a side of grilled vegetables. \\\n",
        "- Steak Frites is A classic French-inspired dish featuring a tender steak served with a generous portion of crispy French fries and a side of Béarnaise sauce. \\\n",
        "- Teriyaki Beef Skewers is A Marinated beef skewers grilled to perfection, served with jasmine rice and a tangy Asian slaw. \\\n",
        "- Vegetarian Grilled Portobello is A hearty portobello mushroom marinated and grilled, served with quinoa salad and a balsamic glaze. \\\n",
        "\n",
        "You can create questions to discover customer preferences, for example, \\\n",
        "- Do you have a preference for a specific type of steak or preparation style?\" \\\n",
        "- Are you in the mood for something classic, like a ribeye, or perhaps something a bit more unique, like our peppercorn-crusted sirloin?\" \\\n",
        "- Do you enjoy your steak with particular sides or sauces?\" \\\n",
        "- Are there any dietary preferences or restrictions we should be aware of?\" \\\n",
        "\n",
        "and then asks if it's a pickup or delivery. \\\n",
        "You wait to collect the entire order, then summarize it and check for a final time if the customer wants to add anything else. If it's a delivery, you ask for an address. \\\n",
        "Finally you collect the payment.\\\n",
        "Make sure to clarify all options, extras and sizes to uniquely \\\n",
        "identify the item from the menu.\\\n",
        "You respond in a short, very conversational friendly style. \\\n",
        "The menu includes \\\n",
        "\n",
        "\"\"\"} ]  # accumulate messages\n",
        "\n",
        "css = \"\"\"\n",
        ".bk.pn-scroll {\n",
        "  overflow: auto !important;\n",
        "  height: 500px; /* Adjust based on the desired visible area of the dashboard */\n",
        "}\n",
        "\"\"\"\n",
        "\n",
        "pn.extension(raw_css=[css])\n",
        "\n",
        "inp = pn.widgets.TextInput(value=\"Hi\", placeholder='Enter text here…')\n",
        "button_conversation = pn.widgets.Button(name=\"Chat!\")\n",
        "\n",
        "interactive_conversation = pn.bind(collect_messages, button_conversation)\n",
        "\n",
        "dashboard = pn.Column(\n",
        "    inp,\n",
        "    pn.Row(button_conversation),\n",
        "    pn.panel(interactive_conversation, loading_indicator=True, height=500),\n",
        "    css_classes=[\"pn-scroll\"]\n",
        ")\n",
        "\n",
        "dashboard.servable()"
      ],
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 621
        },
        "id": "gvdmXQ3ov-65",
        "outputId": "c15f8e8d-1a86-4ae6-b8bb-1928fa6d877f"
      },
      "execution_count": null,
      "outputs": [
        {
          "output_type": "stream",
          "name": "stderr",
          "text": [
            "<ipython-input-17-9d48dfca7307>:52: UserWarning: Using Panel interactively in Colab notebooks requires the jupyter_bokeh package to be installed. Install it with:\n",
            "\n",
            "    !pip install jupyter_bokeh\n",
            "\n",
            "and try again.\n",
            "  pn.extension(raw_css=[css])\n"
          ]
        },
        {
          "output_type": "display_data",
          "data": {
            "application/javascript": [
              "(function(root) {\n",
              "  function now() {\n",
              "    return new Date();\n",
              "  }\n",
              "\n",
              "  var force = true;\n",
              "  var py_version = '3.4.2'.replace('rc', '-rc.').replace('.dev', '-dev.');\n",
              "  var reloading = false;\n",
              "  var Bokeh = root.Bokeh;\n",
              "\n",
              "  if (typeof (root._bokeh_timeout) === \"undefined\" || force) {\n",
              "    root._bokeh_timeout = Date.now() + 5000;\n",
              "    root._bokeh_failed_load = false;\n",
              "  }\n",
              "\n",
              "  function run_callbacks() {\n",
              "    try {\n",
              "      root._bokeh_onload_callbacks.forEach(function(callback) {\n",
              "        if (callback != null)\n",
              "          callback();\n",
              "      });\n",
              "    } finally {\n",
              "      delete root._bokeh_onload_callbacks;\n",
              "    }\n",
              "    console.debug(\"Bokeh: all callbacks have finished\");\n",
              "  }\n",
              "\n",
              "  function load_libs(css_urls, js_urls, js_modules, js_exports, callback) {\n",
              "    if (css_urls == null) css_urls = [];\n",
              "    if (js_urls == null) js_urls = [];\n",
              "    if (js_modules == null) js_modules = [];\n",
              "    if (js_exports == null) js_exports = {};\n",
              "\n",
              "    root._bokeh_onload_callbacks.push(callback);\n",
              "\n",
              "    if (root._bokeh_is_loading > 0) {\n",
              "      console.debug(\"Bokeh: BokehJS is being loaded, scheduling callback at\", now());\n",
              "      return null;\n",
              "    }\n",
              "    if (js_urls.length === 0 && js_modules.length === 0 && Object.keys(js_exports).length === 0) {\n",
              "      run_callbacks();\n",
              "      return null;\n",
              "    }\n",
              "    if (!reloading) {\n",
              "      console.debug(\"Bokeh: BokehJS not loaded, scheduling load and callback at\", now());\n",
              "    }\n",
              "\n",
              "    function on_load() {\n",
              "      root._bokeh_is_loading--;\n",
              "      if (root._bokeh_is_loading === 0) {\n",
              "        console.debug(\"Bokeh: all BokehJS libraries/stylesheets loaded\");\n",
              "        run_callbacks()\n",
              "      }\n",
              "    }\n",
              "    window._bokeh_on_load = on_load\n",
              "\n",
              "    function on_error() {\n",
              "      console.error(\"failed to load \" + url);\n",
              "    }\n",
              "\n",
              "    var skip = [];\n",
              "    if (window.requirejs) {\n",
              "      window.requirejs.config({'packages': {}, 'paths': {}, 'shim': {}});\n",
              "      root._bokeh_is_loading = css_urls.length + 0;\n",
              "    } else {\n",
              "      root._bokeh_is_loading = css_urls.length + js_urls.length + js_modules.length + Object.keys(js_exports).length;\n",
              "    }\n",
              "\n",
              "    var existing_stylesheets = []\n",
              "    var links = document.getElementsByTagName('link')\n",
              "    for (var i = 0; i < links.length; i++) {\n",
              "      var link = links[i]\n",
              "      if (link.href != null) {\n",
              "\texisting_stylesheets.push(link.href)\n",
              "      }\n",
              "    }\n",
              "    for (var i = 0; i < css_urls.length; i++) {\n",
              "      var url = css_urls[i];\n",
              "      if (existing_stylesheets.indexOf(url) !== -1) {\n",
              "\ton_load()\n",
              "\tcontinue;\n",
              "      }\n",
              "      const element = document.createElement(\"link\");\n",
              "      element.onload = on_load;\n",
              "      element.onerror = on_error;\n",
              "      element.rel = \"stylesheet\";\n",
              "      element.type = \"text/css\";\n",
              "      element.href = url;\n",
              "      console.debug(\"Bokeh: injecting link tag for BokehJS stylesheet: \", url);\n",
              "      document.body.appendChild(element);\n",
              "    }    var existing_scripts = []\n",
              "    var scripts = document.getElementsByTagName('script')\n",
              "    for (var i = 0; i < scripts.length; i++) {\n",
              "      var script = scripts[i]\n",
              "      if (script.src != null) {\n",
              "\texisting_scripts.push(script.src)\n",
              "      }\n",
              "    }\n",
              "    for (var i = 0; i < js_urls.length; i++) {\n",
              "      var url = js_urls[i];\n",
              "      if (skip.indexOf(url) !== -1 || existing_scripts.indexOf(url) !== -1) {\n",
              "\tif (!window.requirejs) {\n",
              "\t  on_load();\n",
              "\t}\n",
              "\tcontinue;\n",
              "      }\n",
              "      var element = document.createElement('script');\n",
              "      element.onload = on_load;\n",
              "      element.onerror = on_error;\n",
              "      element.async = false;\n",
              "      element.src = url;\n",
              "      console.debug(\"Bokeh: injecting script tag for BokehJS library: \", url);\n",
              "      document.head.appendChild(element);\n",
              "    }\n",
              "    for (var i = 0; i < js_modules.length; i++) {\n",
              "      var url = js_modules[i];\n",
              "      if (skip.indexOf(url) !== -1 || existing_scripts.indexOf(url) !== -1) {\n",
              "\tif (!window.requirejs) {\n",
              "\t  on_load();\n",
              "\t}\n",
              "\tcontinue;\n",
              "      }\n",
              "      var element = document.createElement('script');\n",
              "      element.onload = on_load;\n",
              "      element.onerror = on_error;\n",
              "      element.async = false;\n",
              "      element.src = url;\n",
              "      element.type = \"module\";\n",
              "      console.debug(\"Bokeh: injecting script tag for BokehJS library: \", url);\n",
              "      document.head.appendChild(element);\n",
              "    }\n",
              "    for (const name in js_exports) {\n",
              "      var url = js_exports[name];\n",
              "      if (skip.indexOf(url) >= 0 || root[name] != null) {\n",
              "\tif (!window.requirejs) {\n",
              "\t  on_load();\n",
              "\t}\n",
              "\tcontinue;\n",
              "      }\n",
              "      var element = document.createElement('script');\n",
              "      element.onerror = on_error;\n",
              "      element.async = false;\n",
              "      element.type = \"module\";\n",
              "      console.debug(\"Bokeh: injecting script tag for BokehJS library: \", url);\n",
              "      element.textContent = `\n",
              "      import ${name} from \"${url}\"\n",
              "      window.${name} = ${name}\n",
              "      window._bokeh_on_load()\n",
              "      `\n",
              "      document.head.appendChild(element);\n",
              "    }\n",
              "    if (!js_urls.length && !js_modules.length) {\n",
              "      on_load()\n",
              "    }\n",
              "  };\n",
              "\n",
              "  function inject_raw_css(css) {\n",
              "    const element = document.createElement(\"style\");\n",
              "    element.appendChild(document.createTextNode(css));\n",
              "    document.body.appendChild(element);\n",
              "  }\n",
              "\n",
              "  var js_urls = [\"https://cdn.bokeh.org/bokeh/release/bokeh-3.4.2.min.js\", \"https://cdn.bokeh.org/bokeh/release/bokeh-gl-3.4.2.min.js\", \"https://cdn.bokeh.org/bokeh/release/bokeh-widgets-3.4.2.min.js\", \"https://cdn.bokeh.org/bokeh/release/bokeh-tables-3.4.2.min.js\", \"https://cdn.holoviz.org/panel/1.4.4/dist/panel.min.js\"];\n",
              "  var js_modules = [];\n",
              "  var js_exports = {};\n",
              "  var css_urls = [];\n",
              "  var inline_js = [    function(Bokeh) {\n",
              "      inject_raw_css(\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\");\n",
              "    },    function(Bokeh) {\n",
              "      Bokeh.set_log_level(\"info\");\n",
              "    },\n",
              "function(Bokeh) {} // ensure no trailing comma for IE\n",
              "  ];\n",
              "\n",
              "  function run_inline_js() {\n",
              "    if ((root.Bokeh !== undefined) || (force === true)) {\n",
              "      for (var i = 0; i < inline_js.length; i++) {\n",
              "\ttry {\n",
              "          inline_js[i].call(root, root.Bokeh);\n",
              "\t} catch(e) {\n",
              "\t  if (!reloading) {\n",
              "\t    throw e;\n",
              "\t  }\n",
              "\t}\n",
              "      }\n",
              "      // Cache old bokeh versions\n",
              "      if (Bokeh != undefined && !reloading) {\n",
              "\tvar NewBokeh = root.Bokeh;\n",
              "\tif (Bokeh.versions === undefined) {\n",
              "\t  Bokeh.versions = new Map();\n",
              "\t}\n",
              "\tif (NewBokeh.version !== Bokeh.version) {\n",
              "\t  Bokeh.versions.set(NewBokeh.version, NewBokeh)\n",
              "\t}\n",
              "\troot.Bokeh = Bokeh;\n",
              "      }} else if (Date.now() < root._bokeh_timeout) {\n",
              "      setTimeout(run_inline_js, 100);\n",
              "    } else if (!root._bokeh_failed_load) {\n",
              "      console.log(\"Bokeh: BokehJS failed to load within specified timeout.\");\n",
              "      root._bokeh_failed_load = true;\n",
              "    }\n",
              "    root._bokeh_is_initializing = false\n",
              "  }\n",
              "\n",
              "  function load_or_wait() {\n",
              "    // Implement a backoff loop that tries to ensure we do not load multiple\n",
              "    // versions of Bokeh and its dependencies at the same time.\n",
              "    // In recent versions we use the root._bokeh_is_initializing flag\n",
              "    // to determine whether there is an ongoing attempt to initialize\n",
              "    // bokeh, however for backward compatibility we also try to ensure\n",
              "    // that we do not start loading a newer (Panel>=1.0 and Bokeh>3) version\n",
              "    // before older versions are fully initialized.\n",
              "    if (root._bokeh_is_initializing && Date.now() > root._bokeh_timeout) {\n",
              "      root._bokeh_is_initializing = false;\n",
              "      root._bokeh_onload_callbacks = undefined;\n",
              "      console.log(\"Bokeh: BokehJS was loaded multiple times but one version failed to initialize.\");\n",
              "      load_or_wait();\n",
              "    } else if (root._bokeh_is_initializing || (typeof root._bokeh_is_initializing === \"undefined\" && root._bokeh_onload_callbacks !== undefined)) {\n",
              "      setTimeout(load_or_wait, 100);\n",
              "    } else {\n",
              "      root._bokeh_is_initializing = true\n",
              "      root._bokeh_onload_callbacks = []\n",
              "      var bokeh_loaded = Bokeh != null && (Bokeh.version === py_version || (Bokeh.versions !== undefined && Bokeh.versions.has(py_version)));\n",
              "      if (!reloading && !bokeh_loaded) {\n",
              "\troot.Bokeh = undefined;\n",
              "      }\n",
              "      load_libs(css_urls, js_urls, js_modules, js_exports, function() {\n",
              "\tconsole.debug(\"Bokeh: BokehJS plotting callback run at\", now());\n",
              "\trun_inline_js();\n",
              "      });\n",
              "    }\n",
              "  }\n",
              "  // Give older versions of the autoload script a head-start to ensure\n",
              "  // they initialize before we start loading newer version.\n",
              "  setTimeout(load_or_wait, 100)\n",
              "}(window));"
            ],
            "application/vnd.holoviews_load.v0+json": "(function(root) {\n  function now() {\n    return new Date();\n  }\n\n  var force = true;\n  var py_version = '3.4.2'.replace('rc', '-rc.').replace('.dev', '-dev.');\n  var reloading = false;\n  var Bokeh = root.Bokeh;\n\n  if (typeof (root._bokeh_timeout) === \"undefined\" || force) {\n    root._bokeh_timeout = Date.now() + 5000;\n    root._bokeh_failed_load = false;\n  }\n\n  function run_callbacks() {\n    try {\n      root._bokeh_onload_callbacks.forEach(function(callback) {\n        if (callback != null)\n          callback();\n      });\n    } finally {\n      delete root._bokeh_onload_callbacks;\n    }\n    console.debug(\"Bokeh: all callbacks have finished\");\n  }\n\n  function load_libs(css_urls, js_urls, js_modules, js_exports, callback) {\n    if (css_urls == null) css_urls = [];\n    if (js_urls == null) js_urls = [];\n    if (js_modules == null) js_modules = [];\n    if (js_exports == null) js_exports = {};\n\n    root._bokeh_onload_callbacks.push(callback);\n\n    if (root._bokeh_is_loading > 0) {\n      console.debug(\"Bokeh: BokehJS is being loaded, scheduling callback at\", now());\n      return null;\n    }\n    if (js_urls.length === 0 && js_modules.length === 0 && Object.keys(js_exports).length === 0) {\n      run_callbacks();\n      return null;\n    }\n    if (!reloading) {\n      console.debug(\"Bokeh: BokehJS not loaded, scheduling load and callback at\", now());\n    }\n\n    function on_load() {\n      root._bokeh_is_loading--;\n      if (root._bokeh_is_loading === 0) {\n        console.debug(\"Bokeh: all BokehJS libraries/stylesheets loaded\");\n        run_callbacks()\n      }\n    }\n    window._bokeh_on_load = on_load\n\n    function on_error() {\n      console.error(\"failed to load \" + url);\n    }\n\n    var skip = [];\n    if (window.requirejs) {\n      window.requirejs.config({'packages': {}, 'paths': {}, 'shim': {}});\n      root._bokeh_is_loading = css_urls.length + 0;\n    } else {\n      root._bokeh_is_loading = css_urls.length + js_urls.length + js_modules.length + Object.keys(js_exports).length;\n    }\n\n    var existing_stylesheets = []\n    var links = document.getElementsByTagName('link')\n    for (var i = 0; i < links.length; i++) {\n      var link = links[i]\n      if (link.href != null) {\n\texisting_stylesheets.push(link.href)\n      }\n    }\n    for (var i = 0; i < css_urls.length; i++) {\n      var url = css_urls[i];\n      if (existing_stylesheets.indexOf(url) !== -1) {\n\ton_load()\n\tcontinue;\n      }\n      const element = document.createElement(\"link\");\n      element.onload = on_load;\n      element.onerror = on_error;\n      element.rel = \"stylesheet\";\n      element.type = \"text/css\";\n      element.href = url;\n      console.debug(\"Bokeh: injecting link tag for BokehJS stylesheet: \", url);\n      document.body.appendChild(element);\n    }    var existing_scripts = []\n    var scripts = document.getElementsByTagName('script')\n    for (var i = 0; i < scripts.length; i++) {\n      var script = scripts[i]\n      if (script.src != null) {\n\texisting_scripts.push(script.src)\n      }\n    }\n    for (var i = 0; i < js_urls.length; i++) {\n      var url = js_urls[i];\n      if (skip.indexOf(url) !== -1 || existing_scripts.indexOf(url) !== -1) {\n\tif (!window.requirejs) {\n\t  on_load();\n\t}\n\tcontinue;\n      }\n      var element = document.createElement('script');\n      element.onload = on_load;\n      element.onerror = on_error;\n      element.async = false;\n      element.src = url;\n      console.debug(\"Bokeh: injecting script tag for BokehJS library: \", url);\n      document.head.appendChild(element);\n    }\n    for (var i = 0; i < js_modules.length; i++) {\n      var url = js_modules[i];\n      if (skip.indexOf(url) !== -1 || existing_scripts.indexOf(url) !== -1) {\n\tif (!window.requirejs) {\n\t  on_load();\n\t}\n\tcontinue;\n      }\n      var element = document.createElement('script');\n      element.onload = on_load;\n      element.onerror = on_error;\n      element.async = false;\n      element.src = url;\n      element.type = \"module\";\n      console.debug(\"Bokeh: injecting script tag for BokehJS library: \", url);\n      document.head.appendChild(element);\n    }\n    for (const name in js_exports) {\n      var url = js_exports[name];\n      if (skip.indexOf(url) >= 0 || root[name] != null) {\n\tif (!window.requirejs) {\n\t  on_load();\n\t}\n\tcontinue;\n      }\n      var element = document.createElement('script');\n      element.onerror = on_error;\n      element.async = false;\n      element.type = \"module\";\n      console.debug(\"Bokeh: injecting script tag for BokehJS library: \", url);\n      element.textContent = `\n      import ${name} from \"${url}\"\n      window.${name} = ${name}\n      window._bokeh_on_load()\n      `\n      document.head.appendChild(element);\n    }\n    if (!js_urls.length && !js_modules.length) {\n      on_load()\n    }\n  };\n\n  function inject_raw_css(css) {\n    const element = document.createElement(\"style\");\n    element.appendChild(document.createTextNode(css));\n    document.body.appendChild(element);\n  }\n\n  var js_urls = [\"https://cdn.bokeh.org/bokeh/release/bokeh-3.4.2.min.js\", \"https://cdn.bokeh.org/bokeh/release/bokeh-gl-3.4.2.min.js\", \"https://cdn.bokeh.org/bokeh/release/bokeh-widgets-3.4.2.min.js\", \"https://cdn.bokeh.org/bokeh/release/bokeh-tables-3.4.2.min.js\", \"https://cdn.holoviz.org/panel/1.4.4/dist/panel.min.js\"];\n  var js_modules = [];\n  var js_exports = {};\n  var css_urls = [];\n  var inline_js = [    function(Bokeh) {\n      inject_raw_css(\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\");\n    },    function(Bokeh) {\n      Bokeh.set_log_level(\"info\");\n    },\nfunction(Bokeh) {} // ensure no trailing comma for IE\n  ];\n\n  function run_inline_js() {\n    if ((root.Bokeh !== undefined) || (force === true)) {\n      for (var i = 0; i < inline_js.length; i++) {\n\ttry {\n          inline_js[i].call(root, root.Bokeh);\n\t} catch(e) {\n\t  if (!reloading) {\n\t    throw e;\n\t  }\n\t}\n      }\n      // Cache old bokeh versions\n      if (Bokeh != undefined && !reloading) {\n\tvar NewBokeh = root.Bokeh;\n\tif (Bokeh.versions === undefined) {\n\t  Bokeh.versions = new Map();\n\t}\n\tif (NewBokeh.version !== Bokeh.version) {\n\t  Bokeh.versions.set(NewBokeh.version, NewBokeh)\n\t}\n\troot.Bokeh = Bokeh;\n      }} else if (Date.now() < root._bokeh_timeout) {\n      setTimeout(run_inline_js, 100);\n    } else if (!root._bokeh_failed_load) {\n      console.log(\"Bokeh: BokehJS failed to load within specified timeout.\");\n      root._bokeh_failed_load = true;\n    }\n    root._bokeh_is_initializing = false\n  }\n\n  function load_or_wait() {\n    // Implement a backoff loop that tries to ensure we do not load multiple\n    // versions of Bokeh and its dependencies at the same time.\n    // In recent versions we use the root._bokeh_is_initializing flag\n    // to determine whether there is an ongoing attempt to initialize\n    // bokeh, however for backward compatibility we also try to ensure\n    // that we do not start loading a newer (Panel>=1.0 and Bokeh>3) version\n    // before older versions are fully initialized.\n    if (root._bokeh_is_initializing && Date.now() > root._bokeh_timeout) {\n      root._bokeh_is_initializing = false;\n      root._bokeh_onload_callbacks = undefined;\n      console.log(\"Bokeh: BokehJS was loaded multiple times but one version failed to initialize.\");\n      load_or_wait();\n    } else if (root._bokeh_is_initializing || (typeof root._bokeh_is_initializing === \"undefined\" && root._bokeh_onload_callbacks !== undefined)) {\n      setTimeout(load_or_wait, 100);\n    } else {\n      root._bokeh_is_initializing = true\n      root._bokeh_onload_callbacks = []\n      var bokeh_loaded = Bokeh != null && (Bokeh.version === py_version || (Bokeh.versions !== undefined && Bokeh.versions.has(py_version)));\n      if (!reloading && !bokeh_loaded) {\n\troot.Bokeh = undefined;\n      }\n      load_libs(css_urls, js_urls, js_modules, js_exports, function() {\n\tconsole.debug(\"Bokeh: BokehJS plotting callback run at\", now());\n\trun_inline_js();\n      });\n    }\n  }\n  // Give older versions of the autoload script a head-start to ensure\n  // they initialize before we start loading newer version.\n  setTimeout(load_or_wait, 100)\n}(window));"
          },
          "metadata": {}
        },
        {
          "output_type": "display_data",
          "data": {
            "application/vnd.holoviews_load.v0+json": "\nif ((window.PyViz === undefined) || (window.PyViz instanceof HTMLElement)) {\n  window.PyViz = {comms: {}, comm_status:{}, kernels:{}, receivers: {}, plot_index: []}\n}\n\n\n    function JupyterCommManager() {\n    }\n\n    JupyterCommManager.prototype.register_target = function(plot_id, comm_id, msg_handler) {\n      if (window.comm_manager || ((window.Jupyter !== undefined) && (Jupyter.notebook.kernel != null))) {\n        var comm_manager = window.comm_manager || Jupyter.notebook.kernel.comm_manager;\n        comm_manager.register_target(comm_id, function(comm) {\n          comm.on_msg(msg_handler);\n        });\n      } else if ((plot_id in window.PyViz.kernels) && (window.PyViz.kernels[plot_id])) {\n        window.PyViz.kernels[plot_id].registerCommTarget(comm_id, function(comm) {\n          comm.onMsg = msg_handler;\n        });\n      } else if (typeof google != 'undefined' && google.colab.kernel != null) {\n        google.colab.kernel.comms.registerTarget(comm_id, (comm) => {\n          var messages = comm.messages[Symbol.asyncIterator]();\n          function processIteratorResult(result) {\n            var message = result.value;\n            console.log(message)\n            var content = {data: message.data, comm_id};\n            var buffers = []\n            for (var buffer of message.buffers || []) {\n              buffers.push(new DataView(buffer))\n            }\n            var metadata = message.metadata || {};\n            var msg = {content, buffers, metadata}\n            msg_handler(msg);\n            return messages.next().then(processIteratorResult);\n          }\n          return messages.next().then(processIteratorResult);\n        })\n      }\n    }\n\n    JupyterCommManager.prototype.get_client_comm = function(plot_id, comm_id, msg_handler) {\n      if (comm_id in window.PyViz.comms) {\n        return window.PyViz.comms[comm_id];\n      } else if (window.comm_manager || ((window.Jupyter !== undefined) && (Jupyter.notebook.kernel != null))) {\n        var comm_manager = window.comm_manager || Jupyter.notebook.kernel.comm_manager;\n        var comm = comm_manager.new_comm(comm_id, {}, {}, {}, comm_id);\n        if (msg_handler) {\n          comm.on_msg(msg_handler);\n        }\n      } else if ((plot_id in window.PyViz.kernels) && (window.PyViz.kernels[plot_id])) {\n        var comm = window.PyViz.kernels[plot_id].connectToComm(comm_id);\n        comm.open();\n        if (msg_handler) {\n          comm.onMsg = msg_handler;\n        }\n      } else if (typeof google != 'undefined' && google.colab.kernel != null) {\n        var comm_promise = google.colab.kernel.comms.open(comm_id)\n        comm_promise.then((comm) => {\n          window.PyViz.comms[comm_id] = comm;\n          if (msg_handler) {\n            var messages = comm.messages[Symbol.asyncIterator]();\n            function processIteratorResult(result) {\n              var message = result.value;\n              var content = {data: message.data};\n              var metadata = message.metadata || {comm_id};\n              var msg = {content, metadata}\n              msg_handler(msg);\n              return messages.next().then(processIteratorResult);\n            }\n            return messages.next().then(processIteratorResult);\n          }\n        }) \n        var sendClosure = (data, metadata, buffers, disposeOnDone) => {\n          return comm_promise.then((comm) => {\n            comm.send(data, metadata, buffers, disposeOnDone);\n          });\n        };\n        var comm = {\n          send: sendClosure\n        };\n      }\n      window.PyViz.comms[comm_id] = comm;\n      return comm;\n    }\n    window.PyViz.comm_manager = new JupyterCommManager();\n    \n\n\nvar JS_MIME_TYPE = 'application/javascript';\nvar HTML_MIME_TYPE = 'text/html';\nvar EXEC_MIME_TYPE = 'application/vnd.holoviews_exec.v0+json';\nvar CLASS_NAME = 'output';\n\n/**\n * Render data to the DOM node\n */\nfunction render(props, node) {\n  var div = document.createElement(\"div\");\n  var script = document.createElement(\"script\");\n  node.appendChild(div);\n  node.appendChild(script);\n}\n\n/**\n * Handle when a new output is added\n */\nfunction handle_add_output(event, handle) {\n  var output_area = handle.output_area;\n  var output = handle.output;\n  if ((output.data == undefined) || (!output.data.hasOwnProperty(EXEC_MIME_TYPE))) {\n    return\n  }\n  var id = output.metadata[EXEC_MIME_TYPE][\"id\"];\n  var toinsert = output_area.element.find(\".\" + CLASS_NAME.split(' ')[0]);\n  if (id !== undefined) {\n    var nchildren = toinsert.length;\n    var html_node = toinsert[nchildren-1].children[0];\n    html_node.innerHTML = output.data[HTML_MIME_TYPE];\n    var scripts = [];\n    var nodelist = html_node.querySelectorAll(\"script\");\n    for (var i in nodelist) {\n      if (nodelist.hasOwnProperty(i)) {\n        scripts.push(nodelist[i])\n      }\n    }\n\n    scripts.forEach( function (oldScript) {\n      var newScript = document.createElement(\"script\");\n      var attrs = [];\n      var nodemap = oldScript.attributes;\n      for (var j in nodemap) {\n        if (nodemap.hasOwnProperty(j)) {\n          attrs.push(nodemap[j])\n        }\n      }\n      attrs.forEach(function(attr) { newScript.setAttribute(attr.name, attr.value) });\n      newScript.appendChild(document.createTextNode(oldScript.innerHTML));\n      oldScript.parentNode.replaceChild(newScript, oldScript);\n    });\n    if (JS_MIME_TYPE in output.data) {\n      toinsert[nchildren-1].children[1].textContent = output.data[JS_MIME_TYPE];\n    }\n    output_area._hv_plot_id = id;\n    if ((window.Bokeh !== undefined) && (id in Bokeh.index)) {\n      window.PyViz.plot_index[id] = Bokeh.index[id];\n    } else {\n      window.PyViz.plot_index[id] = null;\n    }\n  } else if (output.metadata[EXEC_MIME_TYPE][\"server_id\"] !== undefined) {\n    var bk_div = document.createElement(\"div\");\n    bk_div.innerHTML = output.data[HTML_MIME_TYPE];\n    var script_attrs = bk_div.children[0].attributes;\n    for (var i = 0; i < script_attrs.length; i++) {\n      toinsert[toinsert.length - 1].childNodes[1].setAttribute(script_attrs[i].name, script_attrs[i].value);\n    }\n    // store reference to server id on output_area\n    output_area._bokeh_server_id = output.metadata[EXEC_MIME_TYPE][\"server_id\"];\n  }\n}\n\n/**\n * Handle when an output is cleared or removed\n */\nfunction handle_clear_output(event, handle) {\n  var id = handle.cell.output_area._hv_plot_id;\n  var server_id = handle.cell.output_area._bokeh_server_id;\n  if (((id === undefined) || !(id in PyViz.plot_index)) && (server_id !== undefined)) { return; }\n  var comm = window.PyViz.comm_manager.get_client_comm(\"hv-extension-comm\", \"hv-extension-comm\", function () {});\n  if (server_id !== null) {\n    comm.send({event_type: 'server_delete', 'id': server_id});\n    return;\n  } else if (comm !== null) {\n    comm.send({event_type: 'delete', 'id': id});\n  }\n  delete PyViz.plot_index[id];\n  if ((window.Bokeh !== undefined) & (id in window.Bokeh.index)) {\n    var doc = window.Bokeh.index[id].model.document\n    doc.clear();\n    const i = window.Bokeh.documents.indexOf(doc);\n    if (i > -1) {\n      window.Bokeh.documents.splice(i, 1);\n    }\n  }\n}\n\n/**\n * Handle kernel restart event\n */\nfunction handle_kernel_cleanup(event, handle) {\n  delete PyViz.comms[\"hv-extension-comm\"];\n  window.PyViz.plot_index = {}\n}\n\n/**\n * Handle update_display_data messages\n */\nfunction handle_update_output(event, handle) {\n  handle_clear_output(event, {cell: {output_area: handle.output_area}})\n  handle_add_output(event, handle)\n}\n\nfunction register_renderer(events, OutputArea) {\n  function append_mime(data, metadata, element) {\n    // create a DOM node to render to\n    var toinsert = this.create_output_subarea(\n    metadata,\n    CLASS_NAME,\n    EXEC_MIME_TYPE\n    );\n    this.keyboard_manager.register_events(toinsert);\n    // Render to node\n    var props = {data: data, metadata: metadata[EXEC_MIME_TYPE]};\n    render(props, toinsert[0]);\n    element.append(toinsert);\n    return toinsert\n  }\n\n  events.on('output_added.OutputArea', handle_add_output);\n  events.on('output_updated.OutputArea', handle_update_output);\n  events.on('clear_output.CodeCell', handle_clear_output);\n  events.on('delete.Cell', handle_clear_output);\n  events.on('kernel_ready.Kernel', handle_kernel_cleanup);\n\n  OutputArea.prototype.register_mime_type(EXEC_MIME_TYPE, append_mime, {\n    safe: true,\n    index: 0\n  });\n}\n\nif (window.Jupyter !== undefined) {\n  try {\n    var events = require('base/js/events');\n    var OutputArea = require('notebook/js/outputarea').OutputArea;\n    if (OutputArea.prototype.mime_types().indexOf(EXEC_MIME_TYPE) == -1) {\n      register_renderer(events, OutputArea);\n    }\n  } catch(err) {\n  }\n}\n",
            "application/javascript": [
              "\n",
              "if ((window.PyViz === undefined) || (window.PyViz instanceof HTMLElement)) {\n",
              "  window.PyViz = {comms: {}, comm_status:{}, kernels:{}, receivers: {}, plot_index: []}\n",
              "}\n",
              "\n",
              "\n",
              "    function JupyterCommManager() {\n",
              "    }\n",
              "\n",
              "    JupyterCommManager.prototype.register_target = function(plot_id, comm_id, msg_handler) {\n",
              "      if (window.comm_manager || ((window.Jupyter !== undefined) && (Jupyter.notebook.kernel != null))) {\n",
              "        var comm_manager = window.comm_manager || Jupyter.notebook.kernel.comm_manager;\n",
              "        comm_manager.register_target(comm_id, function(comm) {\n",
              "          comm.on_msg(msg_handler);\n",
              "        });\n",
              "      } else if ((plot_id in window.PyViz.kernels) && (window.PyViz.kernels[plot_id])) {\n",
              "        window.PyViz.kernels[plot_id].registerCommTarget(comm_id, function(comm) {\n",
              "          comm.onMsg = msg_handler;\n",
              "        });\n",
              "      } else if (typeof google != 'undefined' && google.colab.kernel != null) {\n",
              "        google.colab.kernel.comms.registerTarget(comm_id, (comm) => {\n",
              "          var messages = comm.messages[Symbol.asyncIterator]();\n",
              "          function processIteratorResult(result) {\n",
              "            var message = result.value;\n",
              "            console.log(message)\n",
              "            var content = {data: message.data, comm_id};\n",
              "            var buffers = []\n",
              "            for (var buffer of message.buffers || []) {\n",
              "              buffers.push(new DataView(buffer))\n",
              "            }\n",
              "            var metadata = message.metadata || {};\n",
              "            var msg = {content, buffers, metadata}\n",
              "            msg_handler(msg);\n",
              "            return messages.next().then(processIteratorResult);\n",
              "          }\n",
              "          return messages.next().then(processIteratorResult);\n",
              "        })\n",
              "      }\n",
              "    }\n",
              "\n",
              "    JupyterCommManager.prototype.get_client_comm = function(plot_id, comm_id, msg_handler) {\n",
              "      if (comm_id in window.PyViz.comms) {\n",
              "        return window.PyViz.comms[comm_id];\n",
              "      } else if (window.comm_manager || ((window.Jupyter !== undefined) && (Jupyter.notebook.kernel != null))) {\n",
              "        var comm_manager = window.comm_manager || Jupyter.notebook.kernel.comm_manager;\n",
              "        var comm = comm_manager.new_comm(comm_id, {}, {}, {}, comm_id);\n",
              "        if (msg_handler) {\n",
              "          comm.on_msg(msg_handler);\n",
              "        }\n",
              "      } else if ((plot_id in window.PyViz.kernels) && (window.PyViz.kernels[plot_id])) {\n",
              "        var comm = window.PyViz.kernels[plot_id].connectToComm(comm_id);\n",
              "        comm.open();\n",
              "        if (msg_handler) {\n",
              "          comm.onMsg = msg_handler;\n",
              "        }\n",
              "      } else if (typeof google != 'undefined' && google.colab.kernel != null) {\n",
              "        var comm_promise = google.colab.kernel.comms.open(comm_id)\n",
              "        comm_promise.then((comm) => {\n",
              "          window.PyViz.comms[comm_id] = comm;\n",
              "          if (msg_handler) {\n",
              "            var messages = comm.messages[Symbol.asyncIterator]();\n",
              "            function processIteratorResult(result) {\n",
              "              var message = result.value;\n",
              "              var content = {data: message.data};\n",
              "              var metadata = message.metadata || {comm_id};\n",
              "              var msg = {content, metadata}\n",
              "              msg_handler(msg);\n",
              "              return messages.next().then(processIteratorResult);\n",
              "            }\n",
              "            return messages.next().then(processIteratorResult);\n",
              "          }\n",
              "        }) \n",
              "        var sendClosure = (data, metadata, buffers, disposeOnDone) => {\n",
              "          return comm_promise.then((comm) => {\n",
              "            comm.send(data, metadata, buffers, disposeOnDone);\n",
              "          });\n",
              "        };\n",
              "        var comm = {\n",
              "          send: sendClosure\n",
              "        };\n",
              "      }\n",
              "      window.PyViz.comms[comm_id] = comm;\n",
              "      return comm;\n",
              "    }\n",
              "    window.PyViz.comm_manager = new JupyterCommManager();\n",
              "    \n",
              "\n",
              "\n",
              "var JS_MIME_TYPE = 'application/javascript';\n",
              "var HTML_MIME_TYPE = 'text/html';\n",
              "var EXEC_MIME_TYPE = 'application/vnd.holoviews_exec.v0+json';\n",
              "var CLASS_NAME = 'output';\n",
              "\n",
              "/**\n",
              " * Render data to the DOM node\n",
              " */\n",
              "function render(props, node) {\n",
              "  var div = document.createElement(\"div\");\n",
              "  var script = document.createElement(\"script\");\n",
              "  node.appendChild(div);\n",
              "  node.appendChild(script);\n",
              "}\n",
              "\n",
              "/**\n",
              " * Handle when a new output is added\n",
              " */\n",
              "function handle_add_output(event, handle) {\n",
              "  var output_area = handle.output_area;\n",
              "  var output = handle.output;\n",
              "  if ((output.data == undefined) || (!output.data.hasOwnProperty(EXEC_MIME_TYPE))) {\n",
              "    return\n",
              "  }\n",
              "  var id = output.metadata[EXEC_MIME_TYPE][\"id\"];\n",
              "  var toinsert = output_area.element.find(\".\" + CLASS_NAME.split(' ')[0]);\n",
              "  if (id !== undefined) {\n",
              "    var nchildren = toinsert.length;\n",
              "    var html_node = toinsert[nchildren-1].children[0];\n",
              "    html_node.innerHTML = output.data[HTML_MIME_TYPE];\n",
              "    var scripts = [];\n",
              "    var nodelist = html_node.querySelectorAll(\"script\");\n",
              "    for (var i in nodelist) {\n",
              "      if (nodelist.hasOwnProperty(i)) {\n",
              "        scripts.push(nodelist[i])\n",
              "      }\n",
              "    }\n",
              "\n",
              "    scripts.forEach( function (oldScript) {\n",
              "      var newScript = document.createElement(\"script\");\n",
              "      var attrs = [];\n",
              "      var nodemap = oldScript.attributes;\n",
              "      for (var j in nodemap) {\n",
              "        if (nodemap.hasOwnProperty(j)) {\n",
              "          attrs.push(nodemap[j])\n",
              "        }\n",
              "      }\n",
              "      attrs.forEach(function(attr) { newScript.setAttribute(attr.name, attr.value) });\n",
              "      newScript.appendChild(document.createTextNode(oldScript.innerHTML));\n",
              "      oldScript.parentNode.replaceChild(newScript, oldScript);\n",
              "    });\n",
              "    if (JS_MIME_TYPE in output.data) {\n",
              "      toinsert[nchildren-1].children[1].textContent = output.data[JS_MIME_TYPE];\n",
              "    }\n",
              "    output_area._hv_plot_id = id;\n",
              "    if ((window.Bokeh !== undefined) && (id in Bokeh.index)) {\n",
              "      window.PyViz.plot_index[id] = Bokeh.index[id];\n",
              "    } else {\n",
              "      window.PyViz.plot_index[id] = null;\n",
              "    }\n",
              "  } else if (output.metadata[EXEC_MIME_TYPE][\"server_id\"] !== undefined) {\n",
              "    var bk_div = document.createElement(\"div\");\n",
              "    bk_div.innerHTML = output.data[HTML_MIME_TYPE];\n",
              "    var script_attrs = bk_div.children[0].attributes;\n",
              "    for (var i = 0; i < script_attrs.length; i++) {\n",
              "      toinsert[toinsert.length - 1].childNodes[1].setAttribute(script_attrs[i].name, script_attrs[i].value);\n",
              "    }\n",
              "    // store reference to server id on output_area\n",
              "    output_area._bokeh_server_id = output.metadata[EXEC_MIME_TYPE][\"server_id\"];\n",
              "  }\n",
              "}\n",
              "\n",
              "/**\n",
              " * Handle when an output is cleared or removed\n",
              " */\n",
              "function handle_clear_output(event, handle) {\n",
              "  var id = handle.cell.output_area._hv_plot_id;\n",
              "  var server_id = handle.cell.output_area._bokeh_server_id;\n",
              "  if (((id === undefined) || !(id in PyViz.plot_index)) && (server_id !== undefined)) { return; }\n",
              "  var comm = window.PyViz.comm_manager.get_client_comm(\"hv-extension-comm\", \"hv-extension-comm\", function () {});\n",
              "  if (server_id !== null) {\n",
              "    comm.send({event_type: 'server_delete', 'id': server_id});\n",
              "    return;\n",
              "  } else if (comm !== null) {\n",
              "    comm.send({event_type: 'delete', 'id': id});\n",
              "  }\n",
              "  delete PyViz.plot_index[id];\n",
              "  if ((window.Bokeh !== undefined) & (id in window.Bokeh.index)) {\n",
              "    var doc = window.Bokeh.index[id].model.document\n",
              "    doc.clear();\n",
              "    const i = window.Bokeh.documents.indexOf(doc);\n",
              "    if (i > -1) {\n",
              "      window.Bokeh.documents.splice(i, 1);\n",
              "    }\n",
              "  }\n",
              "}\n",
              "\n",
              "/**\n",
              " * Handle kernel restart event\n",
              " */\n",
              "function handle_kernel_cleanup(event, handle) {\n",
              "  delete PyViz.comms[\"hv-extension-comm\"];\n",
              "  window.PyViz.plot_index = {}\n",
              "}\n",
              "\n",
              "/**\n",
              " * Handle update_display_data messages\n",
              " */\n",
              "function handle_update_output(event, handle) {\n",
              "  handle_clear_output(event, {cell: {output_area: handle.output_area}})\n",
              "  handle_add_output(event, handle)\n",
              "}\n",
              "\n",
              "function register_renderer(events, OutputArea) {\n",
              "  function append_mime(data, metadata, element) {\n",
              "    // create a DOM node to render to\n",
              "    var toinsert = this.create_output_subarea(\n",
              "    metadata,\n",
              "    CLASS_NAME,\n",
              "    EXEC_MIME_TYPE\n",
              "    );\n",
              "    this.keyboard_manager.register_events(toinsert);\n",
              "    // Render to node\n",
              "    var props = {data: data, metadata: metadata[EXEC_MIME_TYPE]};\n",
              "    render(props, toinsert[0]);\n",
              "    element.append(toinsert);\n",
              "    return toinsert\n",
              "  }\n",
              "\n",
              "  events.on('output_added.OutputArea', handle_add_output);\n",
              "  events.on('output_updated.OutputArea', handle_update_output);\n",
              "  events.on('clear_output.CodeCell', handle_clear_output);\n",
              "  events.on('delete.Cell', handle_clear_output);\n",
              "  events.on('kernel_ready.Kernel', handle_kernel_cleanup);\n",
              "\n",
              "  OutputArea.prototype.register_mime_type(EXEC_MIME_TYPE, append_mime, {\n",
              "    safe: true,\n",
              "    index: 0\n",
              "  });\n",
              "}\n",
              "\n",
              "if (window.Jupyter !== undefined) {\n",
              "  try {\n",
              "    var events = require('base/js/events');\n",
              "    var OutputArea = require('notebook/js/outputarea').OutputArea;\n",
              "    if (OutputArea.prototype.mime_types().indexOf(EXEC_MIME_TYPE) == -1) {\n",
              "      register_renderer(events, OutputArea);\n",
              "    }\n",
              "  } catch(err) {\n",
              "  }\n",
              "}\n"
            ]
          },
          "metadata": {}
        },
        {
          "output_type": "display_data",
          "data": {
            "text/html": [
              "<style>*[data-root-id],\n",
              "*[data-root-id] > * {\n",
              "  box-sizing: border-box;\n",
              "  font-family: var(--jp-ui-font-family);\n",
              "  font-size: var(--jp-ui-font-size1);\n",
              "  color: var(--vscode-editor-foreground, var(--jp-ui-font-color1));\n",
              "}\n",
              "\n",
              "/* Override VSCode background color */\n",
              ".cell-output-ipywidget-background:has(\n",
              "    > .cell-output-ipywidget-background > .lm-Widget > *[data-root-id]\n",
              "  ),\n",
              ".cell-output-ipywidget-background:has(> .lm-Widget > *[data-root-id]) {\n",
              "  background-color: transparent !important;\n",
              "}\n",
              "</style>"
            ]
          },
          "metadata": {}
        },
        {
          "output_type": "display_data",
          "data": {
            "text/html": [
              "<div id='40041457-0bf5-4230-92a5-3af21fa05320'>\n",
              "  <div id=\"b296ed0b-90b4-4b52-9157-3c48979cd3f4\" data-root-id=\"40041457-0bf5-4230-92a5-3af21fa05320\" style=\"display: contents;\"></div>\n",
              "</div>\n",
              "<script type=\"application/javascript\">(function(root) {\n",
              "  var docs_json = {\"d621c8af-1d92-4895-9fae-65a8375108db\":{\"version\":\"3.4.2\",\"title\":\"Bokeh Application\",\"roots\":[{\"type\":\"object\",\"name\":\"panel.models.browser.BrowserInfo\",\"id\":\"40041457-0bf5-4230-92a5-3af21fa05320\"},{\"type\":\"object\",\"name\":\"panel.models.comm_manager.CommManager\",\"id\":\"be4a2fe3-2325-42d2-a1ea-5d9f7b227714\",\"attributes\":{\"plot_id\":\"40041457-0bf5-4230-92a5-3af21fa05320\",\"comm_id\":\"40b3116b58d240959c8f7a72b539ee8a\",\"client_comm_id\":\"54cfb288165d404dac4ed22e41151a69\"}}],\"defs\":[{\"type\":\"model\",\"name\":\"ReactiveHTML1\"},{\"type\":\"model\",\"name\":\"FlexBox1\",\"properties\":[{\"name\":\"align_content\",\"kind\":\"Any\",\"default\":\"flex-start\"},{\"name\":\"align_items\",\"kind\":\"Any\",\"default\":\"flex-start\"},{\"name\":\"flex_direction\",\"kind\":\"Any\",\"default\":\"row\"},{\"name\":\"flex_wrap\",\"kind\":\"Any\",\"default\":\"wrap\"},{\"name\":\"gap\",\"kind\":\"Any\",\"default\":\"\"},{\"name\":\"justify_content\",\"kind\":\"Any\",\"default\":\"flex-start\"}]},{\"type\":\"model\",\"name\":\"FloatPanel1\",\"properties\":[{\"name\":\"config\",\"kind\":\"Any\",\"default\":{\"type\":\"map\"}},{\"name\":\"contained\",\"kind\":\"Any\",\"default\":true},{\"name\":\"position\",\"kind\":\"Any\",\"default\":\"right-top\"},{\"name\":\"offsetx\",\"kind\":\"Any\",\"default\":null},{\"name\":\"offsety\",\"kind\":\"Any\",\"default\":null},{\"name\":\"theme\",\"kind\":\"Any\",\"default\":\"primary\"},{\"name\":\"status\",\"kind\":\"Any\",\"default\":\"normalized\"}]},{\"type\":\"model\",\"name\":\"GridStack1\",\"properties\":[{\"name\":\"mode\",\"kind\":\"Any\",\"default\":\"warn\"},{\"name\":\"ncols\",\"kind\":\"Any\",\"default\":null},{\"name\":\"nrows\",\"kind\":\"Any\",\"default\":null},{\"name\":\"allow_resize\",\"kind\":\"Any\",\"default\":true},{\"name\":\"allow_drag\",\"kind\":\"Any\",\"default\":true},{\"name\":\"state\",\"kind\":\"Any\",\"default\":[]}]},{\"type\":\"model\",\"name\":\"drag1\",\"properties\":[{\"name\":\"slider_width\",\"kind\":\"Any\",\"default\":5},{\"name\":\"slider_color\",\"kind\":\"Any\",\"default\":\"black\"},{\"name\":\"value\",\"kind\":\"Any\",\"default\":50}]},{\"type\":\"model\",\"name\":\"click1\",\"properties\":[{\"name\":\"terminal_output\",\"kind\":\"Any\",\"default\":\"\"},{\"name\":\"debug_name\",\"kind\":\"Any\",\"default\":\"\"},{\"name\":\"clears\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"FastWrapper1\",\"properties\":[{\"name\":\"object\",\"kind\":\"Any\",\"default\":null},{\"name\":\"style\",\"kind\":\"Any\",\"default\":null}]},{\"type\":\"model\",\"name\":\"NotificationAreaBase1\",\"properties\":[{\"name\":\"js_events\",\"kind\":\"Any\",\"default\":{\"type\":\"map\"}},{\"name\":\"position\",\"kind\":\"Any\",\"default\":\"bottom-right\"},{\"name\":\"_clear\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"NotificationArea1\",\"properties\":[{\"name\":\"js_events\",\"kind\":\"Any\",\"default\":{\"type\":\"map\"}},{\"name\":\"notifications\",\"kind\":\"Any\",\"default\":[]},{\"name\":\"position\",\"kind\":\"Any\",\"default\":\"bottom-right\"},{\"name\":\"_clear\",\"kind\":\"Any\",\"default\":0},{\"name\":\"types\",\"kind\":\"Any\",\"default\":[{\"type\":\"map\",\"entries\":[[\"type\",\"warning\"],[\"background\",\"#ffc107\"],[\"icon\",{\"type\":\"map\",\"entries\":[[\"className\",\"fas fa-exclamation-triangle\"],[\"tagName\",\"i\"],[\"color\",\"white\"]]}]]},{\"type\":\"map\",\"entries\":[[\"type\",\"info\"],[\"background\",\"#007bff\"],[\"icon\",{\"type\":\"map\",\"entries\":[[\"className\",\"fas fa-info-circle\"],[\"tagName\",\"i\"],[\"color\",\"white\"]]}]]}]}]},{\"type\":\"model\",\"name\":\"Notification\",\"properties\":[{\"name\":\"background\",\"kind\":\"Any\",\"default\":null},{\"name\":\"duration\",\"kind\":\"Any\",\"default\":3000},{\"name\":\"icon\",\"kind\":\"Any\",\"default\":null},{\"name\":\"message\",\"kind\":\"Any\",\"default\":\"\"},{\"name\":\"notification_type\",\"kind\":\"Any\",\"default\":null},{\"name\":\"_destroyed\",\"kind\":\"Any\",\"default\":false}]},{\"type\":\"model\",\"name\":\"TemplateActions1\",\"properties\":[{\"name\":\"open_modal\",\"kind\":\"Any\",\"default\":0},{\"name\":\"close_modal\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"BootstrapTemplateActions1\",\"properties\":[{\"name\":\"open_modal\",\"kind\":\"Any\",\"default\":0},{\"name\":\"close_modal\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"TemplateEditor1\",\"properties\":[{\"name\":\"layout\",\"kind\":\"Any\",\"default\":[]}]},{\"type\":\"model\",\"name\":\"MaterialTemplateActions1\",\"properties\":[{\"name\":\"open_modal\",\"kind\":\"Any\",\"default\":0},{\"name\":\"close_modal\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"copy_to_clipboard1\",\"properties\":[{\"name\":\"fill\",\"kind\":\"Any\",\"default\":\"none\"},{\"name\":\"value\",\"kind\":\"Any\",\"default\":null}]}]}};\n",
              "  var render_items = [{\"docid\":\"d621c8af-1d92-4895-9fae-65a8375108db\",\"roots\":{\"40041457-0bf5-4230-92a5-3af21fa05320\":\"b296ed0b-90b4-4b52-9157-3c48979cd3f4\"},\"root_ids\":[\"40041457-0bf5-4230-92a5-3af21fa05320\"]}];\n",
              "  var docs = Object.values(docs_json)\n",
              "  if (!docs) {\n",
              "    return\n",
              "  }\n",
              "  const py_version = docs[0].version.replace('rc', '-rc.').replace('.dev', '-dev.')\n",
              "  async function embed_document(root) {\n",
              "    var Bokeh = get_bokeh(root)\n",
              "    await Bokeh.embed.embed_items_notebook(docs_json, render_items);\n",
              "    for (const render_item of render_items) {\n",
              "      for (const root_id of render_item.root_ids) {\n",
              "\tconst id_el = document.getElementById(root_id)\n",
              "\tif (id_el.children.length && id_el.children[0].hasAttribute('data-root-id')) {\n",
              "\t  const root_el = id_el.children[0]\n",
              "\t  root_el.id = root_el.id + '-rendered'\n",
              "\t  for (const child of root_el.children) {\n",
              "            // Ensure JupyterLab does not capture keyboard shortcuts\n",
              "            // see: https://jupyterlab.readthedocs.io/en/4.1.x/extension/notebook.html#keyboard-interaction-model\n",
              "\t    child.setAttribute('data-lm-suppress-shortcuts', 'true')\n",
              "\t  }\n",
              "\t}\n",
              "      }\n",
              "    }\n",
              "  }\n",
              "  function get_bokeh(root) {\n",
              "    if (root.Bokeh === undefined) {\n",
              "      return null\n",
              "    } else if (root.Bokeh.version !== py_version) {\n",
              "      if (root.Bokeh.versions === undefined || !root.Bokeh.versions.has(py_version)) {\n",
              "\treturn null\n",
              "      }\n",
              "      return root.Bokeh.versions.get(py_version);\n",
              "    } else if (root.Bokeh.version === py_version) {\n",
              "      return root.Bokeh\n",
              "    }\n",
              "    return null\n",
              "  }\n",
              "  function is_loaded(root) {\n",
              "    var Bokeh = get_bokeh(root)\n",
              "    return (Bokeh != null && Bokeh.Panel !== undefined)\n",
              "  }\n",
              "  if (is_loaded(root)) {\n",
              "    embed_document(root);\n",
              "  } else {\n",
              "    var attempts = 0;\n",
              "    var timer = setInterval(function(root) {\n",
              "      if (is_loaded(root)) {\n",
              "        clearInterval(timer);\n",
              "        embed_document(root);\n",
              "      } else if (document.readyState == \"complete\") {\n",
              "        attempts++;\n",
              "        if (attempts > 200) {\n",
              "          clearInterval(timer);\n",
              "\t  var Bokeh = get_bokeh(root)\n",
              "\t  if (Bokeh == null || Bokeh.Panel == null) {\n",
              "            console.warn(\"Panel: ERROR: Unable to run Panel code because Bokeh or Panel library is missing\");\n",
              "\t  } else {\n",
              "\t    console.warn(\"Panel: WARNING: Attempting to render but not all required libraries could be resolved.\")\n",
              "\t    embed_document(root)\n",
              "\t  }\n",
              "        }\n",
              "      }\n",
              "    }, 25, root)\n",
              "  }\n",
              "})(window);</script>"
            ],
            "application/vnd.holoviews_exec.v0+json": ""
          },
          "metadata": {
            "application/vnd.holoviews_exec.v0+json": {
              "id": "40041457-0bf5-4230-92a5-3af21fa05320"
            }
          }
        },
        {
          "output_type": "display_data",
          "data": {},
          "metadata": {}
        },
        {
          "output_type": "execute_result",
          "data": {
            "text/html": [
              "<div id='575cc1c4-5bae-4f82-8c13-639903191cd3'>\n",
              "  <div id=\"cc5c9dc5-2727-4dd9-bb8b-036b68936650\" data-root-id=\"575cc1c4-5bae-4f82-8c13-639903191cd3\" style=\"display: contents;\"></div>\n",
              "</div>\n",
              "<script type=\"application/javascript\">(function(root) {\n",
              "  var docs_json = {\"0afd6965-c3d2-4a61-b186-2dc0a20cad36\":{\"version\":\"3.4.2\",\"title\":\"Bokeh Application\",\"roots\":[{\"type\":\"object\",\"name\":\"panel.models.layout.Column\",\"id\":\"575cc1c4-5bae-4f82-8c13-639903191cd3\",\"attributes\":{\"name\":\"Column00591\",\"css_classes\":[\"pn-scroll\"],\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"type\":\"object\",\"name\":\"ImportedStyleSheet\",\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\",\"attributes\":{\"url\":\"https://cdn.holoviz.org/panel/1.4.4/dist/css/loading.css\"}},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"type\":\"object\",\"name\":\"ImportedStyleSheet\",\"id\":\"bc537a44-ffb3-4735-b409-46a3ea5a6682\",\"attributes\":{\"url\":\"https://cdn.holoviz.org/panel/1.4.4/dist/css/listpanel.css\"}},{\"type\":\"object\",\"name\":\"ImportedStyleSheet\",\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\",\"attributes\":{\"url\":\"https://cdn.holoviz.org/panel/1.4.4/dist/bundled/theme/default.css\"}},{\"type\":\"object\",\"name\":\"ImportedStyleSheet\",\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\",\"attributes\":{\"url\":\"https://cdn.holoviz.org/panel/1.4.4/dist/bundled/theme/native.css\"}}],\"margin\":0,\"align\":\"start\",\"children\":[{\"type\":\"object\",\"name\":\"TextInput\",\"id\":\"ef488e65-3e8c-47ff-b5ef-b3b9b9abaed4\",\"attributes\":{\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"width\":300,\"min_width\":300,\"margin\":[5,10],\"align\":\"start\",\"placeholder\":\"Enter text here\\u2026\",\"max_length\":5000}},{\"type\":\"object\",\"name\":\"Row\",\"id\":\"bf7f6223-b2de-4ea2-bdd0-1ab400959628\",\"attributes\":{\"name\":\"Row00573\",\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"bc537a44-ffb3-4735-b409-46a3ea5a6682\"},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"margin\":0,\"align\":\"start\",\"children\":[{\"type\":\"object\",\"name\":\"panel.models.widgets.Button\",\"id\":\"7685a7aa-9437-4900-bc98-4830e8cc737e\",\"attributes\":{\"js_event_callbacks\":{\"type\":\"map\",\"entries\":[[\"button_click\",[{\"type\":\"object\",\"name\":\"CustomJS\",\"id\":\"89f83143-89b5-49da-b94a-102e69b76f31\",\"attributes\":{\"tags\":[[138170197580992,[null,\"event:button_click\"],[null,\"loading\"]]],\"args\":{\"type\":\"map\",\"entries\":[[\"bidirectional\",false],[\"properties\",{\"type\":\"map\",\"entries\":[[\"event:button_click\",\"loading\"]]}],[\"source\",{\"id\":\"7685a7aa-9437-4900-bc98-4830e8cc737e\"}],[\"target\",{\"type\":\"object\",\"name\":\"panel.models.layout.Column\",\"id\":\"8431be5c-6b47-4af6-bacb-4b71b571ca6c\",\"attributes\":{\"name\":\"Column00578\",\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"bc537a44-ffb3-4735-b409-46a3ea5a6682\"},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"height\":500,\"min_height\":500,\"margin\":0,\"align\":\"start\",\"children\":[{\"type\":\"object\",\"name\":\"panel.models.layout.Column\",\"id\":\"e423c44a-56ce-4709-9dd1-1bb15414f4c3\",\"attributes\":{\"name\":\"Column00590\",\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"bc537a44-ffb3-4735-b409-46a3ea5a6682\"},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"margin\":0,\"align\":\"start\",\"children\":[{\"type\":\"object\",\"name\":\"Row\",\"id\":\"8d00dabe-c902-44e6-a898-7f10b8640379\",\"attributes\":{\"name\":\"Row00584\",\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"bc537a44-ffb3-4735-b409-46a3ea5a6682\"},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"margin\":0,\"align\":\"start\",\"children\":[{\"type\":\"object\",\"name\":\"panel.models.markup.HTML\",\"id\":\"70e02e76-93fa-4ce1-bd5e-aa836b168390\",\"attributes\":{\"css_classes\":[\"markdown\"],\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"type\":\"object\",\"name\":\"ImportedStyleSheet\",\"id\":\"a21b6aeb-ea40-433c-99c5-498f56d2aa0f\",\"attributes\":{\"url\":\"https://cdn.holoviz.org/panel/1.4.4/dist/css/markdown.css\"}},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"margin\":[5,10],\"align\":\"start\",\"text\":\"&lt;p&gt;User:&lt;/p&gt;\\n\"}},{\"type\":\"object\",\"name\":\"panel.models.markup.HTML\",\"id\":\"0621e2b1-c670-4ac3-8bef-bdcf7b2f2233\",\"attributes\":{\"css_classes\":[\"markdown\"],\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"a21b6aeb-ea40-433c-99c5-498f56d2aa0f\"},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"width\":600,\"min_width\":600,\"margin\":[5,10],\"align\":\"start\"}}]}},{\"type\":\"object\",\"name\":\"Row\",\"id\":\"79e81b5b-e56c-4350-8eb8-3c6bf4f66221\",\"attributes\":{\"name\":\"Row00589\",\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"bc537a44-ffb3-4735-b409-46a3ea5a6682\"},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"margin\":0,\"align\":\"start\",\"children\":[{\"type\":\"object\",\"name\":\"panel.models.markup.HTML\",\"id\":\"f7f6674c-4bf8-4dea-9bf3-d8975c6656b0\",\"attributes\":{\"css_classes\":[\"markdown\"],\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"a21b6aeb-ea40-433c-99c5-498f56d2aa0f\"},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"margin\":[5,10],\"align\":\"start\",\"text\":\"&lt;p&gt;Assistant:&lt;/p&gt;\\n\"}},{\"type\":\"object\",\"name\":\"panel.models.markup.HTML\",\"id\":\"37cb1e80-17d7-4e17-a34b-c681fe772fe0\",\"attributes\":{\"css_classes\":[\"markdown\"],\"styles\":{\"type\":\"map\",\"entries\":[[\"background-color\",\"#F6F6F6\"]]},\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"id\":\"a21b6aeb-ea40-433c-99c5-498f56d2aa0f\"},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"width\":600,\"min_width\":600,\"margin\":[5,10],\"align\":\"start\",\"text\":\"&lt;p&gt;Welcome to Topping Steakhouse, where culinary excellence meets a passion for premium quality! At Topping, we pride ourselves on serving the finest steaks, meticulously prepared using a blend of natural imported ingredients and locally sourced produce. Our mission is to provide an unforgettable dining experience that captures the essence of nature\\u2019s bounty in every bite.&lt;/p&gt;\\n&lt;p&gt;Our cozy and elegant atmosphere, combined with our commitment to exceptional service, makes Topping the perfect place for family gatherings, romantic dinners, or a casual meal with friends. Join us at Topping Steakhouse and savor the flavors of perfection!&lt;/p&gt;\\n&lt;p&gt;Let&#x27;s take a look at our menu:&lt;/p&gt;\\n&lt;ul&gt;\\n&lt;li&gt;Classic Ribeye Steak&lt;/li&gt;\\n&lt;li&gt;T-Bone Steak&lt;/li&gt;\\n&lt;li&gt;Filet Mignon&lt;/li&gt;\\n&lt;li&gt;New York Strip&lt;/li&gt;\\n&lt;li&gt;Steak Diane&lt;/li&gt;\\n&lt;li&gt;Peppercorn-Crusted Sirloin&lt;/li&gt;\\n&lt;li&gt;Surf and Turf&lt;/li&gt;\\n&lt;li&gt;Steak Frites&lt;/li&gt;\\n&lt;li&gt;Teriyaki Beef Skewers&lt;/li&gt;\\n&lt;li&gt;Vegetarian Grilled Portobello&lt;/li&gt;\\n&lt;/ul&gt;\\n&lt;p&gt;What can I get for you today? Do you have a preference for a specific type of steak or preparation style?&lt;/p&gt;\\n\"}}]}}]}}]}}]]},\"code\":\"\\n    if ('event:button_click'.startsWith('event:')) {\\n      var value = true\\n    } else {\\n      var value = source['event:button_click'];\\n      value = value;\\n    }\\n    if (typeof value !== 'boolean' || source.labels !== ['Loading']) {\\n      value = true\\n    }\\n    var css_classes = target.css_classes.slice()\\n    var loading_css = ['pn-loading', 'pn-arc']\\n    if (value) {\\n      for (var css of loading_css) {\\n        if (!(css in css_classes)) {\\n          css_classes.push(css)\\n        }\\n      }\\n    } else {\\n     for (var css of loading_css) {\\n        var index = css_classes.indexOf(css)\\n        if (index > -1) {\\n          css_classes.splice(index, 1)\\n        }\\n      }\\n    }\\n    target['css_classes'] = css_classes\\n    \"}}]]]},\"subscribed_events\":{\"type\":\"set\",\"entries\":[\"button_click\"]},\"css_classes\":[\"solid\"],\"stylesheets\":[\"\\n:host(.pn-loading):before, .pn-loading:before {\\n  background-color: #c3c3c3;\\n  mask-size: auto calc(min(50%, 400px));\\n  -webkit-mask-size: auto calc(min(50%, 400px));\\n}\",{\"id\":\"9f0185d6-d2b6-44ca-8e18-c0bfb40b9034\"},\"\\n.pn-scroll {\\n  overflow: auto !important;\\n  height: 500px; /* Adjust based on the desired visible area of the dashboard */\\n}\\n\",{\"type\":\"object\",\"name\":\"ImportedStyleSheet\",\"id\":\"47e0df66-2157-4274-b989-314f629928a9\",\"attributes\":{\"url\":\"https://cdn.holoviz.org/panel/1.4.4/dist/css/button.css\"}},{\"id\":\"644f61ef-01e6-48c6-aec6-89528be0b927\"},{\"id\":\"738165f7-ff29-4c07-9662-69be55149f0f\"}],\"margin\":[5,10],\"align\":\"start\",\"label\":\"Chat!\"}}]}},{\"id\":\"8431be5c-6b47-4af6-bacb-4b71b571ca6c\"}]}},{\"type\":\"object\",\"name\":\"panel.models.comm_manager.CommManager\",\"id\":\"5867f8fa-3855-4239-a34b-4ddd1c4e6db6\",\"attributes\":{\"plot_id\":\"575cc1c4-5bae-4f82-8c13-639903191cd3\",\"comm_id\":\"31ac767f88b24c00874a96cb1076db8a\",\"client_comm_id\":\"7a4a811d57d5488fb8dedad6d9788efb\"}}],\"defs\":[{\"type\":\"model\",\"name\":\"ReactiveHTML1\"},{\"type\":\"model\",\"name\":\"FlexBox1\",\"properties\":[{\"name\":\"align_content\",\"kind\":\"Any\",\"default\":\"flex-start\"},{\"name\":\"align_items\",\"kind\":\"Any\",\"default\":\"flex-start\"},{\"name\":\"flex_direction\",\"kind\":\"Any\",\"default\":\"row\"},{\"name\":\"flex_wrap\",\"kind\":\"Any\",\"default\":\"wrap\"},{\"name\":\"gap\",\"kind\":\"Any\",\"default\":\"\"},{\"name\":\"justify_content\",\"kind\":\"Any\",\"default\":\"flex-start\"}]},{\"type\":\"model\",\"name\":\"FloatPanel1\",\"properties\":[{\"name\":\"config\",\"kind\":\"Any\",\"default\":{\"type\":\"map\"}},{\"name\":\"contained\",\"kind\":\"Any\",\"default\":true},{\"name\":\"position\",\"kind\":\"Any\",\"default\":\"right-top\"},{\"name\":\"offsetx\",\"kind\":\"Any\",\"default\":null},{\"name\":\"offsety\",\"kind\":\"Any\",\"default\":null},{\"name\":\"theme\",\"kind\":\"Any\",\"default\":\"primary\"},{\"name\":\"status\",\"kind\":\"Any\",\"default\":\"normalized\"}]},{\"type\":\"model\",\"name\":\"GridStack1\",\"properties\":[{\"name\":\"mode\",\"kind\":\"Any\",\"default\":\"warn\"},{\"name\":\"ncols\",\"kind\":\"Any\",\"default\":null},{\"name\":\"nrows\",\"kind\":\"Any\",\"default\":null},{\"name\":\"allow_resize\",\"kind\":\"Any\",\"default\":true},{\"name\":\"allow_drag\",\"kind\":\"Any\",\"default\":true},{\"name\":\"state\",\"kind\":\"Any\",\"default\":[]}]},{\"type\":\"model\",\"name\":\"drag1\",\"properties\":[{\"name\":\"slider_width\",\"kind\":\"Any\",\"default\":5},{\"name\":\"slider_color\",\"kind\":\"Any\",\"default\":\"black\"},{\"name\":\"value\",\"kind\":\"Any\",\"default\":50}]},{\"type\":\"model\",\"name\":\"click1\",\"properties\":[{\"name\":\"terminal_output\",\"kind\":\"Any\",\"default\":\"\"},{\"name\":\"debug_name\",\"kind\":\"Any\",\"default\":\"\"},{\"name\":\"clears\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"FastWrapper1\",\"properties\":[{\"name\":\"object\",\"kind\":\"Any\",\"default\":null},{\"name\":\"style\",\"kind\":\"Any\",\"default\":null}]},{\"type\":\"model\",\"name\":\"NotificationAreaBase1\",\"properties\":[{\"name\":\"js_events\",\"kind\":\"Any\",\"default\":{\"type\":\"map\"}},{\"name\":\"position\",\"kind\":\"Any\",\"default\":\"bottom-right\"},{\"name\":\"_clear\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"NotificationArea1\",\"properties\":[{\"name\":\"js_events\",\"kind\":\"Any\",\"default\":{\"type\":\"map\"}},{\"name\":\"notifications\",\"kind\":\"Any\",\"default\":[]},{\"name\":\"position\",\"kind\":\"Any\",\"default\":\"bottom-right\"},{\"name\":\"_clear\",\"kind\":\"Any\",\"default\":0},{\"name\":\"types\",\"kind\":\"Any\",\"default\":[{\"type\":\"map\",\"entries\":[[\"type\",\"warning\"],[\"background\",\"#ffc107\"],[\"icon\",{\"type\":\"map\",\"entries\":[[\"className\",\"fas fa-exclamation-triangle\"],[\"tagName\",\"i\"],[\"color\",\"white\"]]}]]},{\"type\":\"map\",\"entries\":[[\"type\",\"info\"],[\"background\",\"#007bff\"],[\"icon\",{\"type\":\"map\",\"entries\":[[\"className\",\"fas fa-info-circle\"],[\"tagName\",\"i\"],[\"color\",\"white\"]]}]]}]}]},{\"type\":\"model\",\"name\":\"Notification\",\"properties\":[{\"name\":\"background\",\"kind\":\"Any\",\"default\":null},{\"name\":\"duration\",\"kind\":\"Any\",\"default\":3000},{\"name\":\"icon\",\"kind\":\"Any\",\"default\":null},{\"name\":\"message\",\"kind\":\"Any\",\"default\":\"\"},{\"name\":\"notification_type\",\"kind\":\"Any\",\"default\":null},{\"name\":\"_destroyed\",\"kind\":\"Any\",\"default\":false}]},{\"type\":\"model\",\"name\":\"TemplateActions1\",\"properties\":[{\"name\":\"open_modal\",\"kind\":\"Any\",\"default\":0},{\"name\":\"close_modal\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"BootstrapTemplateActions1\",\"properties\":[{\"name\":\"open_modal\",\"kind\":\"Any\",\"default\":0},{\"name\":\"close_modal\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"TemplateEditor1\",\"properties\":[{\"name\":\"layout\",\"kind\":\"Any\",\"default\":[]}]},{\"type\":\"model\",\"name\":\"MaterialTemplateActions1\",\"properties\":[{\"name\":\"open_modal\",\"kind\":\"Any\",\"default\":0},{\"name\":\"close_modal\",\"kind\":\"Any\",\"default\":0}]},{\"type\":\"model\",\"name\":\"copy_to_clipboard1\",\"properties\":[{\"name\":\"fill\",\"kind\":\"Any\",\"default\":\"none\"},{\"name\":\"value\",\"kind\":\"Any\",\"default\":null}]}]}};\n",
              "  var render_items = [{\"docid\":\"0afd6965-c3d2-4a61-b186-2dc0a20cad36\",\"roots\":{\"575cc1c4-5bae-4f82-8c13-639903191cd3\":\"cc5c9dc5-2727-4dd9-bb8b-036b68936650\"},\"root_ids\":[\"575cc1c4-5bae-4f82-8c13-639903191cd3\"]}];\n",
              "  var docs = Object.values(docs_json)\n",
              "  if (!docs) {\n",
              "    return\n",
              "  }\n",
              "  const py_version = docs[0].version.replace('rc', '-rc.').replace('.dev', '-dev.')\n",
              "  async function embed_document(root) {\n",
              "    var Bokeh = get_bokeh(root)\n",
              "    await Bokeh.embed.embed_items_notebook(docs_json, render_items);\n",
              "    for (const render_item of render_items) {\n",
              "      for (const root_id of render_item.root_ids) {\n",
              "\tconst id_el = document.getElementById(root_id)\n",
              "\tif (id_el.children.length && id_el.children[0].hasAttribute('data-root-id')) {\n",
              "\t  const root_el = id_el.children[0]\n",
              "\t  root_el.id = root_el.id + '-rendered'\n",
              "\t  for (const child of root_el.children) {\n",
              "            // Ensure JupyterLab does not capture keyboard shortcuts\n",
              "            // see: https://jupyterlab.readthedocs.io/en/4.1.x/extension/notebook.html#keyboard-interaction-model\n",
              "\t    child.setAttribute('data-lm-suppress-shortcuts', 'true')\n",
              "\t  }\n",
              "\t}\n",
              "      }\n",
              "    }\n",
              "  }\n",
              "  function get_bokeh(root) {\n",
              "    if (root.Bokeh === undefined) {\n",
              "      return null\n",
              "    } else if (root.Bokeh.version !== py_version) {\n",
              "      if (root.Bokeh.versions === undefined || !root.Bokeh.versions.has(py_version)) {\n",
              "\treturn null\n",
              "      }\n",
              "      return root.Bokeh.versions.get(py_version);\n",
              "    } else if (root.Bokeh.version === py_version) {\n",
              "      return root.Bokeh\n",
              "    }\n",
              "    return null\n",
              "  }\n",
              "  function is_loaded(root) {\n",
              "    var Bokeh = get_bokeh(root)\n",
              "    return (Bokeh != null && Bokeh.Panel !== undefined)\n",
              "  }\n",
              "  if (is_loaded(root)) {\n",
              "    embed_document(root);\n",
              "  } else {\n",
              "    var attempts = 0;\n",
              "    var timer = setInterval(function(root) {\n",
              "      if (is_loaded(root)) {\n",
              "        clearInterval(timer);\n",
              "        embed_document(root);\n",
              "      } else if (document.readyState == \"complete\") {\n",
              "        attempts++;\n",
              "        if (attempts > 200) {\n",
              "          clearInterval(timer);\n",
              "\t  var Bokeh = get_bokeh(root)\n",
              "\t  if (Bokeh == null || Bokeh.Panel == null) {\n",
              "            console.warn(\"Panel: ERROR: Unable to run Panel code because Bokeh or Panel library is missing\");\n",
              "\t  } else {\n",
              "\t    console.warn(\"Panel: WARNING: Attempting to render but not all required libraries could be resolved.\")\n",
              "\t    embed_document(root)\n",
              "\t  }\n",
              "        }\n",
              "      }\n",
              "    }, 25, root)\n",
              "  }\n",
              "})(window);</script>"
            ],
            "application/vnd.holoviews_exec.v0+json": "",
            "text/plain": [
              "Column(css_classes=['pn-scroll'])\n",
              "    [0] TextInput(placeholder='Enter text here…')\n",
              "    [1] Row\n",
              "        [0] Button(name='Chat!')\n",
              "    [2] ParamFunction(function, _pane=Column, defer_load=False, height=500, loading_indicator=True)"
            ]
          },
          "metadata": {
            "application/vnd.holoviews_exec.v0+json": {
              "id": "575cc1c4-5bae-4f82-8c13-639903191cd3"
            }
          },
          "execution_count": 17
        }
      ]
    }
  ],
  "metadata": {
    "colab": {
      "provenance": []
    },
    "kernelspec": {
      "display_name": "Python 3",
      "name": "python3"
    },
    "language_info": {
      "codemirror_mode": {
        "name": "ipython",
        "version": 3
      },
      "file_extension": ".py",
      "mimetype": "text/x-python",
      "name": "python",
      "nbconvert_exporter": "python",
      "pygments_lexer": "ipython3",
      "version": "3.10.13"
    }
  },
  "nbformat": 4,
  "nbformat_minor": 0
}