From c25f9ad9aed65cd31711caa9d7cf81e234568425 Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Wed, 29 Nov 2023 23:21:15 -0800
Subject: [PATCH] Add the work-in-progress Bergamot widget to the basics page.

---
 content/blog/01_types_basics.md | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/content/blog/01_types_basics.md b/content/blog/01_types_basics.md
index 1a2e7af..0c3f638 100644
--- a/content/blog/01_types_basics.md
+++ b/content/blog/01_types_basics.md
@@ -6,6 +6,9 @@ series: "Everything I Know About Types"
 draft: true
 ---
 
+{{< katex_component_js >}}
+{{< bergamot_js_css >}}
+
 It's finally time to start looking at types. As I mentioned, I want
 to take an approach that draws a variety of examples from the real
 world - I'd like to talk about examples from real programming
@@ -436,3 +439,12 @@ and already be up-to-speed on a big chunk of the content.
 | {{< latex >}}n : \text{number} {{< /latex >}}| Number literals have type \\(\\text{number}\\) |
 | {{< latex >}}\frac{e_1 : \text{string}\quad e_2 : \text{string}}{e_1+e_2 : \text{string}} {{< /latex >}}| Adding strings gives a string |
 | {{< latex >}}\frac{e_1 : \text{number}\quad e_2 : \text{number}}{e_1+e_2 : \text{number}} {{< /latex >}}| Adding numbers gives a number |
+
+#### Playground
+{{< bergamot_widget id="widget-one" query="" >}}
+TInt @ type(intlit(?n), tint) <-;
+TString @ type(strlit(?s), tstr) <-;
+TPlusI @ type(plus(?e_1, ?e_2), tint) <- type(?e_1, tint), type(?e_2, tint);
+TPlusS @ type(plus(?e_1, ?e_2), tstr) <- type(?e_1, tstr), type(?e_2, tstr);
+{{< /bergamot_widget >}}
+