def test_upca001_upload_children_gallery(dash_dcc):
app = Dash(__name__)
app.layout = html.Div([
html.Div(id="waitfor"),
html.Label("Empty"),
dcc.Upload(),
html.Label("Button"),
dcc.Upload(html.Button("Upload File")),
html.Label("Text"),
dcc.Upload("Upload File"),
html.Label("Link"),
dcc.Upload(html.A("Upload File")),
html.Label("Style"),
dcc.Upload(
["Drag and Drop or ", html.A("Select a File")],
style={
"width": "100%",
"height": "60px",
"lineHeight": "60px",
"borderWidth": "1px",
"borderStyle": "dashed",
"borderRadius": "5px",
"textAlign": "center",
},
),
])
dash_dcc.start_server(app)
time.sleep(0.5)
dash_dcc.percy_snapshot("upca001 children gallery")
assert dash_dcc.get_logs() == []
def well_options(self) -> html.Div:
return html.Div(
style={
"marginLeft": "20px",
"marginRight": "0px",
"marginBotton": "0px"
},
children=[
html.Div(children=html.Label(children=[
html.Span("Sampling:", style={"font-weight": "bold"}),
dcc.Input(
id=self.ids("sampling"),
debounce=True,
type="number",
required=True,
value=self.sampling,
persistence=True,
persistence_type="session",
),
])),
html.Div(children=html.Label(children=[
html.Span("Nextend:", style={"font-weight": "bold"}),
dcc.Input(
id=self.ids("nextend"),
debounce=True,
type="number",
required=True,
value=self.nextend,
persistence=True,
persistence_type="session",
),
])),
],
)
def display_output(react_value, flow_value):
return html.Div([
"You have entered {} and {}".format(react_value, flow_value),
html.Hr(),
html.Label("Flow Component Docstring"),
html.Pre(dash_flow_example.ExampleFlowComponent.__doc__),
html.Hr(),
html.Label("React PropTypes Component Docstring"),
html.Pre(dash_flow_example.ExampleReactComponent.__doc__),
html.Div(id="waitfor"),
])
def intersection_option(self) -> html.Div:
options = [
{
"label": "Keep zoom state",
"value": "keep_zoom_state"
},
{
"label": "Show surface fill",
"value": "show_surface_fill"
},
]
value = ["show_surface_fill"]
if self.segyfiles:
options.append({"label": "Show seismic", "value": "show_seismic"})
if self.zonelog is not None:
options.append({"label": "Show zonelog", "value": "show_zonelog"})
value.append("show_zonelog")
return html.Div(
style=self.set_style(marginTop="20px"),
children=[
html.Label("Intersection settings",
style={"font-weight": "bold"}),
html.Label("Sampling"),
dcc.Input(
id=self.ids("sampling"),
debounce=True,
type="number",
required=True,
value=self.sampling,
persistence=True,
persistence_type="session",
),
html.Label("Extension"),
dcc.Input(
id=self.ids("nextend"),
debounce=True,
type="number",
required=True,
value=self.nextend,
persistence=True,
persistence_type="session",
),
dcc.Checklist(
id=self.ids("options"),
options=options,
value=value,
persistence=True,
persistence_type="session",
),
],
)
def test_slsl015_range_slider_no_min_max(dash_dcc):
app = Dash(__name__)
app.layout = html.Div(
[
html.Label("No Min or Max Slider"),
dcc.Slider(
id="no-min-max-step-slider",
marks={
i: "Label {}".format(i) if i == 1 else str(i)
for i in range(1, 6)
},
step=None,
value=5,
vertical=False,
),
],
style={"height": "500px"},
)
dash_dcc.start_server(app)
dash_dcc.wait_for_element("#no-min-max-step-slider")
dash_dcc.percy_snapshot("no-min-max step slider")
dash_dcc.wait_for_element(
'#no-min-max-step-slider div.rc-slider-handle[aria-valuemax="5"]')
assert dash_dcc.get_logs() == []
def test_slsl015_range_slider_step_none(dash_dcc):
app = Dash(__name__)
app.layout = html.Div(
[
html.Label("Steps = Marks Slider"),
dcc.Slider(
id="none-step-slider",
min=0,
max=6,
marks={
i: f"Label {i}" if i == 1 else str(i)
for i in range(1, 6)
},
step=None,
value=4.6,
vertical=False,
),
],
style={"height": "500px"},
)
dash_dcc.start_server(app)
dash_dcc.wait_for_element("#none-step-slider")
dash_dcc.percy_snapshot("none step slider")
dash_dcc.wait_for_element(
'#none-step-slider div.rc-slider-handle[aria-valuenow="5"]')
assert dash_dcc.get_logs() == []
def test_slsl012_vertical_slider(dash_dcc):
app = Dash(__name__)
app.layout = html.Div(
[
html.Label("Vertical Slider"),
dcc.Slider(
id="vertical-slider",
min=0,
max=9,
marks={
i: f"Label {i}" if i == 1 else str(i)
for i in range(1, 6)
},
value=5,
vertical=True,
),
],
style={"height": "500px"},
)
dash_dcc.start_server(app)
dash_dcc.wait_for_element("#vertical-slider")
dash_dcc.percy_snapshot("vertical slider")
dash_dcc.wait_for_element('#vertical-slider div[role="slider"]').click()
assert dash_dcc.get_logs() == []
def table_view_layout(self) -> html.Div:
df = self.xsec.get_intersection_dataframe(
self.wells[self.wellfiles[0]])
return html.Div(
children=[
html.Label(
id=self.ids("surface-picks-label"),
style={
"font-weight": "bold",
"textAlign": "center",
},
),
dash_table.DataTable(
id=self.ids("uncertainty-table"),
columns=[{
"name": i,
"id": i
} for i in df.columns],
data=df.to_dict("records"),
sort_action="native",
filter_action="native",
),
],
style={"marginTop": "0px"},
)
def attribute_selector(self):
return html.Div(
style={"display": "grid"},
children=[
html.Label("Surface attribute",
style={
"fontSize": 15,
"fontWeight": "bold"
}),
html.Div(
style=self.set_grid_layout("6fr 1fr"),
children=[
dcc.Dropdown(
id=self.attr_id,
options=[{
"label": attr,
"value": attr
} for attr in self.attrs],
value=self.current_selections["attribute"],
clearable=False,
persistence=True,
persistence_type="session",
style={
"fontSize": 15,
"fontWeight": "normal"
},
),
self._make_buttons(self.attr_id_btn_prev,
self.attr_id_btn_next),
],
),
],
)
def test_dtps0014_disabed_days_timeout(dash_dcc):
app = Dash(__name__)
min_date = pd.to_datetime("2010-01-01")
max_date = pd.to_datetime("2099-01-01")
disabled_days = [
x for x in pd.date_range(min_date, max_date, freq="D") if x.day != 1
]
app.layout = html.Div([
html.Label("Operating Date"),
dcc.DatePickerSingle(
id="dps",
min_date_allowed=min_date,
max_date_allowed=max_date,
disabled_days=disabled_days,
),
])
dash_dcc.start_server(app)
date = dash_dcc.wait_for_element("#dps", timeout=5)
"""
WebDriver click() function hangs at the time of the react code
execution, so it necessary to check execution time.
"""
start_time = time.time()
date.click()
assert time.time() - start_time < 5
dash_dcc.wait_for_element(".SingleDatePicker_picker", timeout=5)
assert dash_dcc.get_logs() == []
def well_points_tab_layout(self) -> html.Div:
return html.Div([
dbc.Button("Table Settings",
id=self.ids("button-open-table-settings")),
dbc.Modal(
children=[
dbc.ModalHeader("Table Settings"),
dbc.ModalBody(children=[
html.Label(
style={
"font-weight": "bold",
"textAlign": "Left",
},
children="Select Table Columns",
),
dcc.Checklist(
id=self.ids("columns-checklist"),
options=[{
"label": name,
"value": column_name
} for name, column_name in zip(
self.df_well_target_points.get_wellpoints_df().
keys().values,
self.df_well_target_points.get_wellpoints_df(
).keys().values,
)],
value=[
"Surface",
"Well",
"TVD",
"MD",
"Outlier",
"Deleted",
"Residual",
],
persistence=True,
persistence_type="session",
),
], ),
dbc.ModalFooter(children=[
dbc.Button(
"Close",
id=self.ids("button-close-table-settings"),
className="ml-auto",
),
dbc.Button(
"Apply",
id=self.ids("button-apply-columnlist"),
className="ml-auto",
),
]),
],
id=self.ids("modal-table-settings"),
size="sm",
centered=True,
backdrop=False,
fade=False,
),
html.Div(id=self.ids("well-points-table-container")),
])
def test_dtps013_disabled_days_arent_clickable(dash_dcc):
app = Dash(__name__)
app.layout = html.Div(
[
html.Label("Operating Date"),
dcc.DatePickerSingle(
id="dps",
min_date_allowed=datetime(2021, 1, 1),
max_date_allowed=datetime(2021, 1, 31),
initial_visible_month=datetime(2021, 1, 1),
disabled_days=[datetime(2021, 1, 10)],
),
],
style={
"width": "10%",
"display": "inline-block",
"marginLeft": 10,
"marginRight": 10,
"marginBottom": 10,
},
)
dash_dcc.start_server(app)
date = dash_dcc.find_element("#dps input")
assert not date.get_attribute("value")
assert not dash_dcc.select_date_single(
"dps", day=10), "Disabled days should not be clickable"
assert dash_dcc.select_date_single("dps",
day=1), "Other days should be clickable"
# open datepicker to take snapshot
date.click()
dash_dcc.percy_snapshot("dtps013 - disabled days")
def _make_search_box(self, search_term=None):
search_field = dcc.Input(
id=self.id("input"),
className="input",
type="text",
value=search_term,
placeholder="Enter a formula or mp-id…",
)
search_button = Button(
[Icon(kind="search"), html.Span(), "Search"],
kind="primary",
id=self.id("button"),
)
search = Field(
[Control(search_field),
Control(search_button)],
addons=True,
style={"marginBottom": "0"},
)
return html.Div([
html.Label("Search Materials Project:", className="mpc-label"),
search
])
def __init__(
self,
label: str = None,
vertical: bool = True,
className: str = "",
wrapper_id: str = None,
persistence: bool = True,
persistence_type: str = "session",
**kwargs: Any,
) -> None:
super().__init__()
if wrapper_id is not None:
self.id = wrapper_id
children = [html.Label(label)] if label else []
children.append(
dcc.RadioItems(
persistence=persistence,
persistence_type=persistence_type,
className=className + " webviz-block-options"
if vertical
else className,
**kwargs,
)
)
self.children = html.Div(style={"fontSize": "15px"}, children=children)
def test_slsl013_horizontal_range_slider(dash_dcc):
app = Dash(__name__)
app.layout = html.Div([
html.Label("Horizontal Range Slider"),
dcc.RangeSlider(
id="horizontal-range-slider",
min=0,
max=9,
marks={
i: "Label {}".format(i) if i == 1 else str(i)
for i in range(1, 6)
},
value=[4, 6],
),
])
dash_dcc.start_server(app)
dash_dcc.wait_for_element("#horizontal-range-slider")
dash_dcc.percy_snapshot("horizontal range slider")
dash_dcc.wait_for_element(
'#horizontal-range-slider div.rc-slider-handle-1[role="slider"]'
).click()
dash_dcc.wait_for_element(
'#horizontal-range-slider div.rc-slider-handle-2[role="slider"]'
).click()
assert dash_dcc.get_logs() == []
def selector(self, wrapper_id, dropdown_id, title, default_value, btn_prev,
btn_next):
return html.Div(
id=wrapper_id,
style={"display": "none"},
children=[
html.Label(title, style={
"fontSize": 15,
"fontWeight": "bold"
}),
html.Div(
style=self.set_grid_layout("6fr 1fr"),
children=[
dcc.Dropdown(
id=dropdown_id,
value=default_value,
clearable=False,
persistence=True,
persistence_type="session",
style={
"fontSize": 15,
"fontWeight": "normal"
},
),
self._make_buttons(btn_prev, btn_next),
],
),
],
)
def test_slsl014_vertical_range_slider(dash_dcc):
app = Dash(__name__)
app.layout = html.Div(
[
html.Label("Vertical Range Slider"),
dcc.RangeSlider(
id="vertical-range-slider",
min=0,
max=9,
marks={
i: "Label {}".format(i) if i == 1 else str(i)
for i in range(1, 6)
},
value=[4, 6],
vertical=True,
),
],
style={"height": "500px"},
)
dash_dcc.start_server(app)
dash_dcc.wait_for_element("#vertical-range-slider")
dash_dcc.percy_snapshot("vertical range slider")
dash_dcc.wait_for_element(
'#vertical-range-slider div.rc-slider-handle-1[role="slider"]').click(
)
dash_dcc.wait_for_element(
'#vertical-range-slider div.rc-slider-handle-2[role="slider"]').click(
)
assert dash_dcc.get_logs() == []
def selector(
self,
wrapper_id: str,
dropdown_id: str,
title: str,
btn_prev: str,
btn_next: str,
) -> html.Div:
return html.Div(
id=wrapper_id,
style={"display": "none"},
children=[
html.Label(title),
html.Div(
style=self.set_grid_layout("6fr 1fr"),
children=[
dcc.Dropdown(
id=dropdown_id,
clearable=False,
persistence=True,
persistence_type="session",
),
self._make_buttons(btn_prev, btn_next),
],
),
],
)
def attribute_selector(self) -> html.Div:
return html.Div(
style={"display": "grid"},
children=[
html.Label("Surface attribute"),
html.Div(
style=self.set_grid_layout("6fr 1fr"),
children=[
dcc.Dropdown(
id=self.attr_id,
options=[{
"label": attr,
"value": attr
} for attr in self.attrs],
value=self.attrs[0],
clearable=False,
persistence=True,
persistence_type="session",
),
self._make_buttons(self.attr_id_btn_prev,
self.attr_id_btn_next),
],
),
],
)
def test_dtps001_simple_click(dash_dcc):
app = Dash(__name__)
app.layout = html.Div(
[
html.Label("Operating Date"),
dcc.DatePickerSingle(
id="dps",
min_date_allowed=datetime(2010, 1, 1),
max_date_allowed=datetime(2099, 12, 31),
initial_visible_month=datetime.today().date() -
timedelta(days=1),
day_size=47,
),
],
style={
"width": "10%",
"display": "inline-block",
"marginLeft": 10,
"marginRight": 10,
"marginBottom": 10,
},
)
dash_dcc.start_server(app)
date = dash_dcc.find_element("#dps input")
assert not date.get_attribute("value")
assert dash_dcc.select_date_single(
"dps", index=3), "Component should be clickable to choose a valid date"
assert dash_dcc.get_logs() == []
def _sub_layouts(self):
search = html.Div(self._make_search_box(),
id=self.id("search_container"))
random_link = html.A("get random mp-id",
className="is-text is-size-7",
id=self.id("random"))
dropdown = dcc.Dropdown(id=self.id("dropdown"), clearable=False)
dropdown_container = html.Div(
[
html.Label("Multiple results found, please select one:"),
dropdown
],
id=self.id("dropdown-container"),
style={"display": "none"},
)
warning = html.Div(style={"display": "none"}, id=self.id("warning"))
search = html.Div([search, random_link],
style={"marginBottom": "0.75rem"})
search = html.Div([search, warning, dropdown_container])
return {"search": search}
def highlight_controls(uuid: str, tab: str) -> html.Div:
return html.Div(
style={"margin-top": "10px"},
children=[
html.Label("Data highlight criterias", className="webviz-underlined-label"),
html.Div(
children=[
wcc.Label("Absolute diff (%) above:"),
dcc.Input(
id={"id": uuid, "tab": tab, "selector": "Accept value"},
type="number",
required=True,
value=5,
persistence=True,
persistence_type="session",
),
],
),
html.Div(
children=[
wcc.Label("Ignore response values below:"),
dcc.Input(
id={"id": uuid, "tab": tab, "selector": "Ignore <"},
type="number",
required=True,
value=0,
persistence=True,
persistence_type="session",
debounce=True,
),
]
),
],
)
def __init__(
self,
label: str = None,
collapsible: bool = False,
open_details: bool = True,
wrapper_id: str = None,
persistence: bool = True,
persistence_type: str = "session",
**kwargs: Any
) -> None:
super().__init__()
if wrapper_id is not None:
self.id = wrapper_id
if collapsible:
children = [html.Summary(label)] if label else []
else:
children = [html.Label(label)] if label else []
children.append(
BaseSelect(
persistence=persistence,
persistence_type=persistence_type,
**kwargs,
)
)
if collapsible:
self.children = html.Div(
style={"fontSize": "15px"},
children=html.Details(open=open_details, children=children),
)
else:
self.children = html.Div(style={"fontSize": "15px"}, children=children)
def plot_options_layout(self) -> wcc.FlexBox:
"""Row layout of dropdowns for plot options"""
return wcc.FlexBox(children=[
html.Div(children=html.Label(children=[
html.Span("Response:", style={"font-weight": "bold"}),
dcc.Dropdown(
id=self.ids("response"),
options=[{
"label": volume_description(i),
"value": i
} for i in self.responses],
value=self.initial_response if self.initial_response in
self.responses else self.responses[0],
clearable=False,
persistence=True,
persistence_type="session",
),
])),
html.Div(children=html.Label(children=[
html.Span("Plot type:", style={"font-weight": "bold"}),
dcc.Dropdown(
id=self.ids("plot-type"),
options=[{
"label": i,
"value": i
} for i in self.plot_types],
value=self.initial_plot,
clearable=False,
persistence=True,
persistence_type="session",
),
])),
html.Div(children=html.Label(children=[
html.Span("Group by:", style={"font-weight": "bold"}),
dcc.Dropdown(
id=self.ids("group"),
options=[{
"label": i.lower().capitalize(),
"value": i
} for i in self.selectors],
value=self.initial_group,
placeholder="Not grouped",
persistence=True,
persistence_type="session",
),
])),
], )
def __realization_filters(get_uuid: Callable, realizations: List[int]) -> html.Div:
return html.Div(
children=[
html.Div(
style={"display": "inline-flex"},
children=[
html.Label(
"Realizations: ",
style={"font-weight": "bold"},
),
html.Label(
id=get_uuid(LayoutElements.REALIZATIONS_FILTER_SPAN),
style={
"margin-left": "10px",
"margin-bottom": "5px",
},
children=f"{min(realizations)}-{max(realizations)}",
),
],
),
wcc.RadioItems(
label="Statistics calculated from:",
id=get_uuid(LayoutElements.STATISTICS_FROM_RADIO_ITEMS),
style={"margin-bottom": "10px"},
options=[
{
"label": "All",
"value": StatisticsFromOptions.ALL_REALIZATIONS.value,
},
{
"label": "Selected",
"value": StatisticsFromOptions.SELECTED_REALIZATIONS.value,
},
],
value=StatisticsFromOptions.ALL_REALIZATIONS.value,
vertical=False,
),
html.Div(
children=wcc.Select(
id=get_uuid(LayoutElements.REALIZATIONS_FILTER_SELECTOR),
options=[{"label": i, "value": i} for i in realizations],
value=realizations,
size=min(10, len(realizations)),
),
),
],
)
def add_slider(self, slider_id, min_value, max_value, initial_value=None, step_size=None, label=None, mark_num=None): # noqa
"""
Creates new slider with label.
Parameters
----------
slider_id
Unique id to identify the slider.
min
Minimum value of the slider.
max
Maximum value of the slider.
initial_value (optional)
Starting value of the slider when the app is executed.
Default value is minimum value of slider.
step_size (optional)
Step size of possible values on the slider
Default value is 1/100th of range of slider
label (optional)
Label for the slider, to be shown to user
Default is slider id
mark_num (optional)
Indicators of value on slider
Default is 1/10th of range of slider
"""
if initial_value is None:
initial_value = min_value
if step_size is None:
step_size = (max_value - min_value) / 100
if label is None:
label = slider_id
if mark_num is None:
mark_num = 11
slider_id = str(slider_id)
new_slider = html.Div([
html.Label(label),
daq.Slider(
id=slider_id,
min=min_value,
max=max_value,
value=initial_value,
step=step_size,
handleLabel={"showCurrentValue": True,
"label": ' ',
"style": {"size": 0.05}},
marks={i: '{:.1f}'.format(i) for i in np.linspace( # noqa
start=min_value,
stop=max_value,
num=mark_num)},
updatemode='drag'
)
], style={'marginBottom': '2em'})
self._sliders[slider_id] = new_slider
return new_slider
def layout(self) -> html.Div:
return html.Div(
style={"marginLeft": "10px", "height": "90vh"},
children=[
html.Div(
children=[
html.Label(
"Tornado Plot",
style={
"textAlign": "center",
"font-weight": "bold",
},
),
wcc.RadioItems(
vertical=False,
id=self.ids("plot-or-table"),
options=[
{"label": "Show bars", "value": "bars"},
{
"label": "Show table",
"value": "table",
},
],
value="bars",
),
],
),
html.Div(
style={"overflowY": "auto", "height": "60vh"},
children=[
html.Div(
id=self.ids("graph-wrapper"),
style={},
children=wcc.Graph(
id=self.ids("tornado-graph"),
config={"displayModeBar": False},
),
),
html.Div(
id=self.ids("table-wrapper"),
style={"display": "none"},
children=dash_table.DataTable(
id=self.ids("tornado-table"),
style_cell={
"whiteSpace": "normal",
"height": "auto",
},
),
),
],
),
html.Hr(style={"marginTop": "10px"}),
self.settings_layout,
dcc.Store(id=self.ids("storage"), storage_type="session"),
dcc.Store(id=self.ids("click-store"), storage_type="session"),
dcc.Store(id=self.ids("high-low-storage"), storage_type="session"),
dcc.Store(id=self.ids("client-height-pixels"), storage_type="session"),
],
)
def getScatterPageLayout(statDict):
print('scatterPage.getScatterPageLayout()')
#print(' statDict:', statDict)
boxBorder = 2
statsDf = pd.DataFrame(columns=['idx', 'stat'])
statsDf['idx'] = [i for i in range(len(statDict.keys()))]
statsDf['stat'] = [x for x in statDict.keys()]
heaight = 400
scatterPageLayout = html.Div(
[
dbc.Row(
[
dbc.Col(
html.Div([
html.Label('X-Stat'),
myDashUtils.makeTable('x-stat-table', statsDf, height=heaight, defaultRow=0)
]) # div
,width=3,style={"border":boxBorder}
), # col
dbc.Col(
html.Div([
html.Label('Y-Stat'),
myDashUtils.makeTable('y-stat-table', statsDf, height=heaight, defaultRow=7)
]) # div
,width=3,style={"border":boxBorder}
), # col
# plot
dbc.Col(
html.Div([
dcc.Graph(id='life-exp-vs-gdp')
])
,width=6,style={"border":boxBorder}
), # col
]
), # row
], className = 'container') # outerdiv
#
return scatterPageLayout
def layout(self) -> html.Div:
"""Returns a table with dataframe columns and clickable color column
Add this to the layout of the plugin"""
return html.Div(
style={
"fontSize": "0.8em",
"height": "600px",
"fontColor": "black",
},
children=[
dcc.Store(
id=self.color_store_id,
data=list(self._dframe["COLOR"].values),
storage_type="session",
),
wcc.FlexBox(
style={"display": "flex"},
children=[
html.Div(
style={
"flex": 2,
"overflowY": "scroll",
"height": "550px"
},
children=dash_table.DataTable(
id={
"id": self._uuid,
"element": "table"
},
fixed_rows={"headers": True},
columns=self._columns,
style_header={
"opacity": 0.5,
},
data=self._dframe.to_dict("records"),
style_data_conditional=self.
data_style_in_table,
),
),
html.Div(
id={
"id": self._uuid,
"element": "pickerwrapper"
},
style={"flex": 1},
children=[
html.Label(
"Click on a table row to get a color picker",
style={"padding": "15px"},
)
],
),
],
),
],
)
def map_view_layout(self) -> html.Div:
return html.Div(children=[
wcc.FlexBox(children=[
html.Div(children=[
html.Label(
style={
"font-weight": "bold",
"textAlign": "center",
},
children="Select surface",
),
dcc.Dropdown(
id=self.ids("map-dropdown"),
options=[{
"label": name,
"value": name
} for name in self.surfacenames],
value=self.surfacenames[0],
clearable=False,
persistence=True,
persistence_type="session",
),
]),
], ),
html.Div(
style={
"marginTop": "0px",
"height": "800px",
"zIndex": -9999,
},
children=[
webviz_subsurface_components.LeafletMap(
id=self.ids("layered-map"),
layers=[],
unitScale={},
autoScaleMap=True,
minZoom=-19,
drawTools={
"drawMarker": False,
"drawPolygon": False,
"drawPolyline": True,
"position": "topright",
},
switch={
"value": False,
"disabled": False,
"label": "Hillshading",
},
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomright"},
),
],
),
])
