Skip to content

Commit 35834f7

Browse files
tswasttswast
committed
Created using Colab
1 parent 790410a commit 35834f7

File tree

1 file changed

+263
-0
lines changed

1 file changed

+263
-0
lines changed

‎2025/anywidget_fallback_experiment.ipynb‎

Lines changed: 263 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,263 @@
1+
{
2+
"nbformat": 4,
3+
"nbformat_minor": 0,
4+
"metadata": {
5+
"colab": {
6+
"provenance": [],
7+
"authorship_tag": "ABX9TyPlrqI2l/2GSlYZrgwC0wn5",
8+
"include_colab_link": true
9+
},
10+
"kernelspec": {
11+
"name": "python3",
12+
"display_name": "Python 3"
13+
},
14+
"language_info": {
15+
"name": "python"
16+
},
17+
"widgets": {
18+
"application/vnd.jupyter.widget-state+json": {
19+
"f816c099762e4037aef41ec2aad8409b": {
20+
"model_module": "anywidget",
21+
"model_name": "AnyModel",
22+
"model_module_version": "~0.9.*",
23+
"state": {
24+
"_anywidget_id": "__main__.CounterWidget",
25+
"_dom_classes": [],
26+
"_esm": "\n function render({ model, el }) {\n let button = document.createElement(\"button\");\n button.innerHTML = `count is ${model.get(\"value\")}`;\n button.addEventListener(\"click\", () => {\n model.set(\"value\", model.get(\"value\") + 1);\n model.save_changes();\n });\n model.on(\"change:value\", () => {\n button.innerHTML = `count is ${model.get(\"value\")}`;\n });\n el.appendChild(button);\n }\n export default { render };\n ",
27+
"_model_module": "anywidget",
28+
"_model_module_version": "~0.9.*",
29+
"_model_name": "AnyModel",
30+
"_view_count": null,
31+
"_view_module": "anywidget",
32+
"_view_module_version": "~0.9.*",
33+
"_view_name": "AnyView",
34+
"layout": "IPY_MODEL_899796661d6a405d8802689124889135",
35+
"value": 42
36+
}
37+
},
38+
"899796661d6a405d8802689124889135": {
39+
"model_module": "@jupyter-widgets/base",
40+
"model_name": "LayoutModel",
41+
"model_module_version": "1.2.0",
42+
"state": {
43+
"_model_module": "@jupyter-widgets/base",
44+
"_model_module_version": "1.2.0",
45+
"_model_name": "LayoutModel",
46+
"_view_count": null,
47+
"_view_module": "@jupyter-widgets/base",
48+
"_view_module_version": "1.2.0",
49+
"_view_name": "LayoutView",
50+
"align_content": null,
51+
"align_items": null,
52+
"align_self": null,
53+
"border": null,
54+
"bottom": null,
55+
"display": null,
56+
"flex": null,
57+
"flex_flow": null,
58+
"grid_area": null,
59+
"grid_auto_columns": null,
60+
"grid_auto_flow": null,
61+
"grid_auto_rows": null,
62+
"grid_column": null,
63+
"grid_gap": null,
64+
"grid_row": null,
65+
"grid_template_areas": null,
66+
"grid_template_columns": null,
67+
"grid_template_rows": null,
68+
"height": null,
69+
"justify_content": null,
70+
"justify_items": null,
71+
"left": null,
72+
"margin": null,
73+
"max_height": null,
74+
"max_width": null,
75+
"min_height": null,
76+
"min_width": null,
77+
"object_fit": null,
78+
"object_position": null,
79+
"order": null,
80+
"overflow": null,
81+
"overflow_x": null,
82+
"overflow_y": null,
83+
"padding": null,
84+
"right": null,
85+
"top": null,
86+
"visibility": null,
87+
"width": null
88+
}
89+
}
90+
}
91+
}
92+
},
93+
"cells": [
94+
{
95+
"cell_type": "markdown",
96+
"metadata": {
97+
"id": "view-in-github",
98+
"colab_type": "text"
99+
},
100+
"source": [
101+
"<a href=\"https://colab.research.google.com/github/tswast/code-snippets/blob/main/2025/anywidget_fallback_experiment.ipynb\" target=\"_parent\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
102+
]
103+
},
104+
{
105+
"cell_type": "code",
106+
"execution_count": 1,
107+
"metadata": {
108+
"colab": {
109+
"base_uri": "https://localhost:8080/",
110+
"height": 100
111+
},
112+
"id": "BIFYWg43pIkP",
113+
"outputId": "3096af34-13a5-4cb7-fac2-bb4fe4de7423"
114+
},
115+
"outputs": [
116+
{
117+
"output_type": "display_data",
118+
"data": {
119+
"text/plain": [
120+
"This is the plain text representation."
121+
],
122+
"text/html": [
123+
"<h1>This is the HTML representation</h1><p>It can include formatting and tags.</p>"
124+
]
125+
},
126+
"metadata": {
127+
"text/html": {
128+
"some_key": "some_value"
129+
}
130+
}
131+
}
132+
],
133+
"source": [
134+
"from IPython.display import publish_display_data\n",
135+
"\n",
136+
"# Define the data as a dictionary where keys are MIME types\n",
137+
"# and values are the string representations of the data.\n",
138+
"data_dict = {\n",
139+
" 'text/plain': 'This is the plain text representation.',\n",
140+
" 'text/html': '<h1>This is the HTML representation</h1><p>It can include formatting and tags.</p>'\n",
141+
"}\n",
142+
"\n",
143+
"# Define metadata for the display object (optional)\n",
144+
"metadata_dict = {\n",
145+
" 'text/html': {'some_key': 'some_value'}\n",
146+
"}\n",
147+
"\n",
148+
"# Publish the data\n",
149+
"publish_display_data(data=data_dict, metadata=metadata_dict)\n"
150+
]
151+
},
152+
{
153+
"cell_type": "code",
154+
"source": [
155+
"import anywidget\n",
156+
"import traitlets\n",
157+
"from IPython.display import display, HTML\n",
158+
"\n",
159+
"class CounterWidget(anywidget.AnyWidget):\n",
160+
" _esm = \"\"\"\n",
161+
" function render({ model, el }) {\n",
162+
" let button = document.createElement(\"button\");\n",
163+
" button.innerHTML = `count is ${model.get(\"value\")}`;\n",
164+
" button.addEventListener(\"click\", () => {\n",
165+
" model.set(\"value\", model.get(\"value\") + 1);\n",
166+
" model.save_changes();\n",
167+
" });\n",
168+
" model.on(\"change:value\", () => {\n",
169+
" button.innerHTML = `count is ${model.get(\"value\")}`;\n",
170+
" });\n",
171+
" el.appendChild(button);\n",
172+
" }\n",
173+
" export default { render };\n",
174+
" \"\"\"\n",
175+
" value = traitlets.Int(0).tag(sync=True)\n",
176+
"\n",
177+
"# Display the widget\n",
178+
"widget_instance = CounterWidget(value=42)"
179+
],
180+
"metadata": {
181+
"id": "5mE9cMNUpL_v"
182+
},
183+
"execution_count": 7,
184+
"outputs": []
185+
},
186+
{
187+
"cell_type": "markdown",
188+
"source": [
189+
"What mimetype to use for anywidget?https://github.com/manzt/anywidget/blob/e3bb27ac215047e45018b3acf970af07808e1147/docs/src/pages/en/experimental.md#2-the-applicationvndjupyterwidget-viewjson-mime-type\n",
190+
"\n"
191+
],
192+
"metadata": {
193+
"id": "kr0HimgDsYOK"
194+
}
195+
},
196+
{
197+
"cell_type": "code",
198+
"execution_count": 20,
199+
"metadata": {
200+
"colab": {
201+
"base_uri": "https://localhost:8080/",
202+
"height": 38,
203+
"referenced_widgets": [
204+
"f816c099762e4037aef41ec2aad8409b",
205+
"899796661d6a405d8802689124889135"
206+
]
207+
},
208+
"outputId": "dbce0a1b-7199-4a17-bb6a-ad368f4b0f2f",
209+
"id": "64xtBzJpqbYE"
210+
},
211+
"outputs": [
212+
{
213+
"output_type": "execute_result",
214+
"data": {
215+
"text/plain": [
216+
"This is the plain text representation."
217+
],
218+
"application/vnd.jupyter.widget-view+json": {
219+
"version_major": 2,
220+
"version_minor": 1,
221+
"model_id": "f816c099762e4037aef41ec2aad8409b"
222+
},
223+
"text/html": [
224+
"<h1>This is the HTML representation</h1><p>It can include formatting and tags.</p>"
225+
]
226+
},
227+
"metadata": {
228+
"application/vnd.jupyter.widget-view+json": {
229+
"colab": {
230+
"custom_widget_manager": {
231+
"url": "https://ssl.gstatic.com/colaboratory-static/widgets/colab-cdn-widget-manager/2b70e893a8ba7c0f/manager.min.js"
232+
}
233+
}
234+
}
235+
},
236+
"execution_count": 20
237+
}
238+
],
239+
"source": [
240+
"class DataFrame:\n",
241+
" def _repr_mimebundle_(self, include=None, exclude=None):\n",
242+
" self.widget = CounterWidget(value=42)\n",
243+
" data, metadata = self.widget._repr_mimebundle_()\n",
244+
"\n",
245+
" # Add fallbacks for GitHub and VS Code\n",
246+
" data['text/html'] = '<h1>This is the HTML representation</h1><p>It can include formatting and tags.</p>'\n",
247+
" data['text/plain'] = 'This is the plain text representation.'\n",
248+
" return data, metadata\n",
249+
"\n",
250+
"DataFrame()\n"
251+
]
252+
},
253+
{
254+
"cell_type": "code",
255+
"source": [],
256+
"metadata": {
257+
"id": "foCDJ2e6qt-w"
258+
},
259+
"execution_count": null,
260+
"outputs": []
261+
}
262+
]
263+
}

0 commit comments

Comments
 (0)