<jupyter_start><jupyter_text>Widgets Demonstration As well as providing working code that readers can experiment with, the textbook also provides a number of widgets to help explain specific concepts. This page contains a selection of these as an index. Run each cell to interact with the widget.**NOTE:** You will need to enable interactivity by pressing 'Try' in the bottom left corner of a code cell, or by viewing this page in the [IBM Quantum Experience](https://quantum-computing.ibm.com/jupyter/user/qiskit-textbook/content/widgets-index.ipynb). Interactive CodeThe most important interactive element of the textbook is the ability to change and experiment with the code. This is possible directly on the textbook webpage, but readers can also view the textbook as Jupyter notebooks where they are able to add more cells and save their changes. Interactive Python code also allows for widgets through [ipywidgets](https://ipywidgets.readthedocs.io/en/latest/), and the rest of this page is dedicated to demonstrating some of the widgets provided by the Qiskit Textbook.<jupyter_code># Click 'try' then 'run' to see the output
print("This is code works!")<jupyter_output>This is code works!<jupyter_text>Gate DemoThis widget shows the effects of a number of gates on a qubit, illustrated through the Bloch sphere. It is used a lot in [Single Qubit Gates](https://qiskit.org/textbook/ch-states/single-qubit-gates.html).<jupyter_code>from qiskit_textbook.widgets import gate_demo
gate_demo()<jupyter_output><empty_output><jupyter_text>Binary DemonstrationThis simple widget allows the reader to interact with a binary number. It is found in [The Atoms of Computation](https://qiskit.org/textbook/ch-states/atoms-computation.html).<jupyter_code>from qiskit_textbook.widgets import binary_widget
binary_widget(nbits=5)<jupyter_output><empty_output><jupyter_text>Scalable Circuit WidgetWhen working with circuits such as those in the [Quantum Fourier Transform Chapter](https://qiskit.org/textbook/ch-algorithms/quantum-fourier-transform.html), it's often useful to see how these scale to different numbers of qubits. If our function takes a circuit (`QuantumCircuit`) and a number of qubits (`int`) as positional inputs, we can see how it scales using the widget below. Try changing the code inside these functions and re-run the cell.<jupyter_code>from qiskit_textbook.widgets import scalable_circuit
from numpy import pi

def qft_rotations(circuit, n):
    """Performs qft on the first n qubits in circuit (without swaps)"""
    if n == 0:
        return circuit
    n -= 1
    circuit.h(n)
    for qubit in range(n):
        circuit.cp(pi/2**(n-qubit), qubit, n)
    # At the end of our function, we call the same function again on
    # the next qubits (we reduced n by one earlier in the function)
    qft_rotations(circuit, n)

def swap_qubits(circuit, n):
    """Reverse the order of qubits"""
    for qubit in range(n//2):
        circuit.swap(qubit, n-qubit-1)
    return circuit

def qft(circuit, n):
    """QFT on the first n qubits in circuit"""
    qft_rotations(circuit, n)
    swap_qubits(circuit, n)
    return circuit

scalable_circuit(qft)<jupyter_output><empty_output><jupyter_text>Bernstein-Vazirani WidgetThrough this widget, the reader can follow the mathematics through an instance of the [Bernstein-Vazirani algorithm](https://qiskit.org/textbook/ch-algorithms/bernstein-vazirani.html). Press the buttons to apply the different steps of the algorithm. The first argument sets the number of qubits, and the second sets the hidden binary string, then re-run the cell. You can also reveal the contents of the oracle by setting `hide_oracle=False` and re-running the cell.<jupyter_code>from qiskit_textbook.widgets import bv_widget
bv_widget(2, "11", hide_oracle=True)<jupyter_output><empty_output><jupyter_text>Deutsch-Jozsa WidgetSimilarly to the Bernstein-Vazirani widget, through the Deutsch-Jozsa widget the reader can follow the mathematics through an instance of the [Deutsch-Jozsa algorithm](https://qiskit.org/textbook/ch-algorithms/deutsch-josza.html). Press the buttons to apply the different steps of the algorithm. `case` can be "balanced" or "constant", and `size` can be "small" or "large". Re-run the cell for a randomly selected oracle. You can also reveal the contents of the oracle by setting `hide_oracle=False` and re-running the cell.<jupyter_code>from qiskit_textbook.widgets import dj_widget
dj_widget(size="large", case="balanced", hide_oracle=True)<jupyter_output><empty_output>
{'fraction_non_alphanumeric': 0.07733097657976137, 'fraction_numerical': 0.001988510826336721, 'mean_word_length': 5.175989085948158, 'pattern_counts': {'":': 0, '<': 24, '<?xml version=': 0, '>': 24, 'https://': 7, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'chain_length': '6', 'dir': 'jupyter-structured-clean-dedup', 'id': '20088', 'license': 'Apache-2.0', 'n_tokens_mistral': 1360, 'n_tokens_neox': 1280, 'n_words': 525, 'path': 'content/widgets-index.ipynb', 'repo_name': 'luke7mm/qiskit-textbook', 'size': '4526'}