Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

prompt improvement #31

Merged
merged 8 commits into from
Jan 26, 2024
Merged

prompt improvement #31

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
3c54615
reorder the prompt representation so that it is configurable with css
tonyfast Jan 16, 2024
0410390
use label on textarea and fieldset on outputs
tonyfast Jan 17, 2024
b596d5f
aria labelledby soure area.
tonyfast Jan 18, 2024
fed106e
make the prompts configurable from the nbconvert
tonyfast Jan 19, 2024
aeb6ab7
move source label to the execution count column
tonyfast Jan 19, 2024
b3dc703
suppress markdown prompts with css
tonyfast Jan 21, 2024
4c0ba9f
mkae the prompt properties configurable
tonyfast Jan 21, 2024
694a14c
hide execution count when none
tonyfast Jan 26, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 18 additions & 4 deletions nbconvert_a11y/exporter.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,11 @@ class A11yExporter(PostProcess, HTMLExporter):
code_theme = Enum(list(THEMES), "gh-high", help="an accessible pygments dark/light theme").tag(
config=True
)
# TF: id love for these definitions to have their own parent class.
prompt_in = CUnicode("In").tag(config=True)
prompt_out = CUnicode("Out").tag(config=True)
prompt_left = CUnicode("[").tag(config=True)
prompt_right = CUnicode("]").tag(config=True)

def __init__(self, *args, **kwargs) -> None:
super().__init__(*args, **kwargs)
Expand Down Expand Up @@ -127,6 +132,7 @@ def default_config(self):
return c

def from_notebook_node(self, nb, resources=None, **kw):
# this is trash and needs serious fixing
resources = resources or {}
resources["include_axe"] = self.include_axe
resources["include_settings"] = self.include_settings
Expand All @@ -139,6 +145,10 @@ def from_notebook_node(self, nb, resources=None, **kw):
resources["code_theme"] = THEMES[self.code_theme]
resources["axe_url"] = self.axe_url
resources["include_sa11y"] = self.include_sa11y
resources["prompt_in"] = self.prompt_in
resources["prompt_out"] = self.prompt_out
resources["prompt_left"] = self.prompt_left
resources["prompt_right"] = self.prompt_right

return super().from_notebook_node(nb, resources, **kw)

Expand Down Expand Up @@ -229,8 +239,10 @@ def mdtoc(html):
id = header.attrs.get("id")
if not id:
from slugify import slugify

id = slugify(header.string)
if header.string:
id = slugify(header.string)
else:
continue

# there is missing logistics for managely role=heading
# adding code group semantics will motivate this addition
Expand All @@ -251,8 +263,10 @@ def heading_links(html):
id = header.attrs.get("id")
if not id:
from slugify import slugify

id = slugify(header.string)
if header.string:
id = slugify(header.string)
else:
continue

link = soupify(f"""<a href="#{id}">{header.string}</a>""").body.a
header.clear()
Expand Down
55 changes: 30 additions & 25 deletions nbconvert_a11y/templates/a11y/components/cell.html.j2
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,23 +30,21 @@ that would include talking to the kernel. #}
{% endmacro %}

{% macro cell_execution_count(i, execution_count, hidden=False) %}
<output form="cell-{{i}}" name="execution_count" id="cell-{{i}}-execution_count"
{{hide(hidden)}}>#{{execution_count}}</output>
<label id="cell-{{i}}-source-label">
<span>{{resources.prompt_in}}</span>
<span aria-hidden="true">{{resources.prompt_left}}</span>
<span>{{execution_count}}</span>
<span aria-hidden="true">{{resources.prompt_right}}</span>
</label>
{% endmacro %}


{% macro cell_source(i, source, cell_type, execution_count, hidden=False) %}
{% set label -%}
<span id="cell-{{i}}-source-label">
<span>In</span><span aria-hidden="true">[</span><span>{{execution_count}}</span><span aria-hidden="true">]</span>
</span>
{%- endset %}
<details open aria-labelledby="cell-{{i}}-source-label" {{hide(hidden)}}>
<summary inert>{{label}}</summary>
<textarea form="cell-{{i}}" id="cell-{{i}}-source" name="source" rows="{{source.splitlines().__len__()}}"
aria-labelledby="cell-{{i}}-source-label nb-source-label" readonly>{{source}}</textarea>
<textarea form="cell-{{i}}" id="cell-{{i}}-source" name="source" rows="{{source.splitlines().__len__()}}"
aria-labelledby="cell-{{i}}-source-label nb-source-label" readonly>{{source}}</textarea>
<div role="group" aria-labelledby="nb-source-label">
{{highlight(source, cell_type)}}
</details>
</div>
{% endmacro %}

{% macro cell_metadata(i, metadata, hidden=False) %}
Expand All @@ -64,23 +62,30 @@ that would include talking to the kernel. #}

{%- macro cell_output(i, cell, source, outputs, cell_type, execution_count, hidden=False) -%}
{% set CODE = cell_type == "code" %}
{% set label %}{% if CODE and outputs %}Out<span aria-hidden="true">[</span>{{execution_count}}<span
aria-hidden="true">]</span>{% else %}Cell {{i}}{% endif %}{% endset %}
<span hidden id="cell-{{i}}-outputs-len">{{outputs.__len__()}} outputs</span>
{% if CODE and outputs %}
{% if outputs %}
<details open aria-labelledby="cell-{{i}}-outputs-label" {{hide(hidden)}}>
<summary inert id="cell-{{i}}-outputs-label" aria-describedby="nb-outputs-desc">{{label}}</summary>
{% if CODE %}
{% if not outputs %}
<span class="visually-hidden" id="cell-{{i}}-outputs-len">In {{execution_count}} has {{outputs.__len__()}}
outputs.</span>
{% else %}
{# the following span should get its own column in the table #}
<fieldset {{hide(hidden)}} data-outputs="{{outputs.__len__()}}">
<legend id="cell-{{i}}-outputs-label" aria-describedby="nb-outputs-desc">
<span>{{resources.prompt_out}}</span>
<span aria-hidden="true">{{resources.prompt_left}}</span>
<span>{{execution_count}}</span>
<span aria-hidden="true">{{resources.prompt_right}}</span>
</legend>
<span class="visually-hidden" id="cell-{{i}}-outputs-len">has {{outputs.__len__()}} output{% if outputs.__len__()>1
%}s{% endif %}</span>
{% if outputs %}
{# the output description should mention the number of outputs
saying zero outputs should be an option. a cell without an output is probably a violation. #}
{{cell_display_priority(i, outputs, cell)}}
</details>
{% endif %}
</fieldset>
{% endif %}
{% elif cell_type=="markdown" %}
<details open aria-labelledby="cell-{{i}}-outputs-label" {{hide(hidden)}}>
<summary hidden inert id="cell-{{i}}-outputs-label">{{label}}</summary>
{{ markdown(source) | strip_files_prefix }}
</details>
{% else %}
{{ markdown(source) | strip_files_prefix }}
{% endif %}
{%- endmacro -%}

Expand Down
15 changes: 10 additions & 5 deletions nbconvert_a11y/templates/a11y/static/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
--nb-line-height: 1.5;
}


body {
font-size: var(--nb-font-size);
font-family: var(--nb-font-family);
Expand Down Expand Up @@ -78,7 +79,7 @@ textarea[name=source] {


#nb-dialogs details:not([open])~dialog:not([open]):not(:focus-within):not(:active),
legend:not(:focus-within):not(:active),
/* legend:not(:focus-within):not(:active), */
details.log:not([open])+table,
.visually-hidden:not(:focus-within):not(:active) {
clip: rect(0 0 0 0);
Expand Down Expand Up @@ -116,9 +117,13 @@ dialog form>* {
font-size: max(44px, var(--nb-font-size));
}

.wcag-a details>summary[inert]~textarea[name=source],
.wcag-aa details>summary[inert]~textarea[name=source],
.wcag-aaa details>summary[inert]~textarea[name=source]~*,
details>summary:not([inert])~textarea[name=source]~* {
.wcag-a textarea[name=source],
.wcag-aa textarea[name=source],
.wcag-aaa textarea[name=source]~* {
display: none;
}

fieldset[data-outputs="0"],
.markdown > .nb-execution_count {
display: none;
}
6 changes: 3 additions & 3 deletions nbconvert_a11y/templates/a11y/table.html.j2
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,8 @@ cell_form, cell_source, cell_metadata, cell_output with context%}
data-loc="{{cell.source.splitlines().__len__()}}" {% if cell.cell_type=="code" %} {% endif %}
data-index="{{loop.index}}">
<td role="none" class="nb-anchor">{{cell_anchor(loop.index, cell.cell_type)}}</td>
<td role="none" class="nb-execution_count" hidden>{{cell_execution_count(loop.index, cell.execution_count)}}
<td role="none" class="nb-execution_count" {{hide(cell.cell_type=="markdown" or cell.execution_count==None)}}>
{{cell_execution_count(loop.index, cell.execution_count)}}
</td>
<td role="none" class="nb-cell_type" hidden>{{cell_cell_type(loop.index, cell.cell_type)}}</td>
<td role="none" class="nb-toolbar" hidden>{{cell_form(loop.index)}}</td>
Expand All @@ -38,7 +39,7 @@ cell_form, cell_source, cell_metadata, cell_output with context%}
{% block body_loop %}
{# the most consistent implementation would connect the input visibility to a form #}
<table id="cells" role="presentation">
<tbody role="list">
<tbody role="list" aria-labelledby="nb-notebook-label nb-cells-label">
<tr hidden>
{% for col in COLUMNS %}
<th scope="col">{{col}}</th>
Expand Down Expand Up @@ -66,7 +67,6 @@ cell_form, cell_source, cell_metadata, cell_output with context%}
<td class="nb-toolbar"></td>
<td class="nb-metadata">{# list keys #}</td>
<td class="nb-loc">{{count_loc(nb)}}</td>

</tr>
<tr class="code">
<th scope="row">code cells</th>
Expand Down
Loading