-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
40 changed files
with
3,884 additions
and
8 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,178 @@ | ||
| { | ||
| "cells": [ | ||
| { | ||
| "cell_type": "markdown", | ||
| "id": "Hbol", | ||
| "metadata": {}, | ||
| "source": [ | ||
| "# Arrays and Dictionaries" | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "markdown", | ||
| "id": "MJUe", | ||
| "metadata": {}, | ||
| "source": [ | ||
| "Use `mo.ui.array` and `mo.ui.dictionary` to create UI elements that wrap\n", | ||
| "other elements.\n", | ||
| "\n", | ||
| "Because UI elements must be assigned to global variables,\n", | ||
| "these functions are required when the set of elements to create is not\n", | ||
| "known until runtime." | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "code", | ||
| "execution_count": null, | ||
| "id": "vblA", | ||
| "metadata": {}, | ||
| "outputs": [], | ||
| "source": [ | ||
| "create = mo.ui.button(label=\"Create new collections\")" | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "code", | ||
| "execution_count": null, | ||
| "id": "bkHC", | ||
| "metadata": {}, | ||
| "outputs": [], | ||
| "source": [ | ||
| "create.center()" | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "markdown", | ||
| "id": "lEQa", | ||
| "metadata": {}, | ||
| "source": [ | ||
| "UI Elements ..." | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "code", | ||
| "execution_count": null, | ||
| "id": "PKri", | ||
| "metadata": {}, | ||
| "outputs": [], | ||
| "source": [ | ||
| "create\n", | ||
| "\n", | ||
| "array = mo.ui.array(\n", | ||
| " [mo.ui.text()]\n", | ||
| " + [mo.ui.slider(1, 10) for _ in range(0, random.randint(2, 5))],\n", | ||
| ")\n", | ||
| "dictionary = mo.ui.dictionary(\n", | ||
| " {str(i): mo.ui.slider(1, 10) for i in range(0, random.randint(2, 5))}\n", | ||
| ")\n", | ||
| "\n", | ||
| "mo.hstack([array, dictionary], justify=\"space-around\")" | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "markdown", | ||
| "id": "Xref", | ||
| "metadata": {}, | ||
| "source": [ | ||
| "... and their values" | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "code", | ||
| "execution_count": null, | ||
| "id": "SFPL", | ||
| "metadata": {}, | ||
| "outputs": [], | ||
| "source": [ | ||
| "mo.hstack([array.value, dictionary.value], justify=\"space-around\")" | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "markdown", | ||
| "id": "BYtC", | ||
| "metadata": {}, | ||
| "source": [ | ||
| "Key difference between marimo dict and standard python dict:\n", | ||
| "\n", | ||
| "The main reason to use `mo.ui.dictionary` is for reactive execution — when you interact with an element in a `mo.ui.dictionary`, all cells that reference the `mo.ui.dictionary` run automatically, just like all other ui elements. When you use a regular dictionary, you don't get this reactivity." | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "code", | ||
| "execution_count": null, | ||
| "id": "RGSE", | ||
| "metadata": {}, | ||
| "outputs": [], | ||
| "source": [ | ||
| "create\n", | ||
| "\n", | ||
| "slider = mo.ui.slider(1, 10, show_value=True)\n", | ||
| "text = mo.ui.text()\n", | ||
| "date = mo.ui.date()\n", | ||
| "\n", | ||
| "mo_d = mo.ui.dictionary(\n", | ||
| " {\n", | ||
| " \"slider\": slider,\n", | ||
| " \"text\": text,\n", | ||
| " \"date\": date,\n", | ||
| " }\n", | ||
| ")\n", | ||
| "\n", | ||
| "py_d = {\n", | ||
| " \"slider\": slider,\n", | ||
| " \"text\": text,\n", | ||
| " \"date\": date,\n", | ||
| "}\n", | ||
| "\n", | ||
| "mo.hstack(\n", | ||
| " [\n", | ||
| " mo.vstack([\"marimo dict\", mo_d]),\n", | ||
| " mo.vstack([\"original elements\", mo.vstack([slider, text, date])]),\n", | ||
| " mo.vstack([\"python dict\", py_d]),\n", | ||
| " ],\n", | ||
| " justify=\"space-around\",\n", | ||
| ")" | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "code", | ||
| "execution_count": null, | ||
| "id": "Kclp", | ||
| "metadata": {}, | ||
| "outputs": [], | ||
| "source": [ | ||
| "mo_d_ref = {k: mo_d[k].value for k in mo_d.value.keys()}\n", | ||
| "py_d_ref = {k: py_d[k].value for k in py_d.keys()}\n", | ||
| "mo.hstack(\n", | ||
| " [\n", | ||
| " mo.vstack([\"reference of marimo dict\", mo_d_ref]),\n", | ||
| " mo.vstack([\"reference of python dict\", py_d_ref]),\n", | ||
| " ],\n", | ||
| " justify=\"space-around\",\n", | ||
| ")" | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "markdown", | ||
| "id": "emfo", | ||
| "metadata": {}, | ||
| "source": [ | ||
| "Notice that when you interact with the UI elements in the marimo dict, the reference of marimo dict updates automatically. However, when you interact with the elements in the python dict, you need to manually re-run the cell to see the updated values." | ||
| ] | ||
| }, | ||
| { | ||
| "cell_type": "code", | ||
| "execution_count": null, | ||
| "id": "Hstk", | ||
| "metadata": {}, | ||
| "outputs": [], | ||
| "source": [ | ||
| "import marimo as mo\n", | ||
| "import random" | ||
| ] | ||
| } | ||
| ], | ||
| "metadata": {}, | ||
| "nbformat": 4, | ||
| "nbformat_minor": 5 | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,102 @@ | ||
|
|
||
| __generated_with = "0.9.30" | ||
|
|
||
| # %% | ||
| import marimo as mo | ||
| import random | ||
|
|
||
| # %% | ||
| mo.md( | ||
| """ | ||
| Use `mo.ui.array` and `mo.ui.dictionary` to create UI elements that wrap | ||
| other elements. | ||
| Because UI elements must be assigned to global variables, | ||
| these functions are required when the set of elements to create is not | ||
| known until runtime. | ||
| """ | ||
| ) | ||
|
|
||
| # %% | ||
| mo.md( | ||
| r""" | ||
| Key difference between marimo dict and standard python dict: | ||
| The main reason to use `mo.ui.dictionary` is for reactive execution — when you interact with an element in a `mo.ui.dictionary`, all cells that reference the `mo.ui.dictionary` run automatically, just like all other ui elements. When you use a regular dictionary, you don't get this reactivity. | ||
| """ | ||
| ) | ||
|
|
||
| # %% | ||
| create = mo.ui.button(label="Create new collections") | ||
|
|
||
| # %% | ||
| mo.md("""UI Elements ...""") | ||
|
|
||
| # %% | ||
| mo.md(r"""Notice that when you interact with the UI elements in the marimo dict, the reference of marimo dict updates automatically. However, when you interact with the elements in the python dict, you need to manually re-run the cell to see the updated values.""") | ||
|
|
||
| # %% | ||
| mo.md("""... and their values""") | ||
|
|
||
| # %% | ||
| mo.md("""# Arrays and Dictionaries""") | ||
|
|
||
| # %% | ||
| create.center() | ||
|
|
||
| # %% | ||
| create | ||
|
|
||
| slider = mo.ui.slider(1, 10, show_value=True) | ||
| text = mo.ui.text() | ||
| date = mo.ui.date() | ||
|
|
||
| mo_d = mo.ui.dictionary( | ||
| { | ||
| "slider": slider, | ||
| "text": text, | ||
| "date": date, | ||
| } | ||
| ) | ||
|
|
||
| py_d = { | ||
| "slider": slider, | ||
| "text": text, | ||
| "date": date, | ||
| } | ||
|
|
||
| mo.hstack( | ||
| [ | ||
| mo.vstack(["marimo dict", mo_d]), | ||
| mo.vstack(["original elements", mo.vstack([slider, text, date])]), | ||
| mo.vstack(["python dict", py_d]), | ||
| ], | ||
| justify="space-around", | ||
| ) | ||
|
|
||
| # %% | ||
| create | ||
|
|
||
| array = mo.ui.array( | ||
| [mo.ui.text()] | ||
| + [mo.ui.slider(1, 10) for _ in range(0, random.randint(2, 5))], | ||
| ) | ||
| dictionary = mo.ui.dictionary( | ||
| {str(i): mo.ui.slider(1, 10) for i in range(0, random.randint(2, 5))} | ||
| ) | ||
|
|
||
| mo.hstack([array, dictionary], justify="space-around") | ||
|
|
||
| # %% | ||
| mo_d_ref = {k: mo_d[k].value for k in mo_d.value.keys()} | ||
| py_d_ref = {k: py_d[k].value for k in py_d.keys()} | ||
| mo.hstack( | ||
| [ | ||
| mo.vstack(["reference of marimo dict", mo_d_ref]), | ||
| mo.vstack(["reference of python dict", py_d_ref]), | ||
| ], | ||
| justify="space-around", | ||
| ) | ||
|
|
||
| # %% | ||
| mo.hstack([array.value, dictionary.value], justify="space-around") |
Oops, something went wrong.