diff --git a/CHANGELOG.md b/CHANGELOG.md index 599aa1b..8906b8e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,7 @@ ### Added - Added `disabled` prop to `Radio` #425 by @namakshenas +- Added `lineSize` prop to `Burger` #432 by @ChinoUkaegbu ### Fixed - Fixed closing of Popovers when clicking outside. #423 by @magicmq diff --git a/README.md b/README.md index 459819c..2084a87 100644 --- a/README.md +++ b/README.md @@ -43,7 +43,7 @@ app = Dash(__name__, external_stylesheets=dmc.styles.ALL) app.layout = dmc.MantineProvider( [ - dmc.DatePicker( + dmc.DatePickerInput( id="date-picker", label="Start Date", description="You can also provide a description", diff --git a/src/ts/components/core/Burger.tsx b/src/ts/components/core/Burger.tsx index 47d46c7..4c6d493 100644 --- a/src/ts/components/core/Burger.tsx +++ b/src/ts/components/core/Burger.tsx @@ -17,6 +17,8 @@ interface Props size?: MantineSize | (string & {}) | number; /** Key of `theme.colors` of any valid CSS value, by default `theme.white` in dark color scheme and `theme.black` in light */ color?: MantineColor; + /** Height of the burger lines */ + lineSize?: number; /** State of the burger, when `true` burger is transformed into X, `false` by default */ opened?: boolean; /** `transition-duration` property value in ms, `300` by default */ @@ -25,7 +27,7 @@ interface Props transitionTimingFunction?: string; } -/** Burger */ +/** The Burger component renders a customizable hamburger menu button which can toggle between open and closed states. */ const Burger = (props: Props) => { const { setProps, diff --git a/tests/test_burger.py b/tests/test_burger.py new file mode 100644 index 0000000..8d2cc9a --- /dev/null +++ b/tests/test_burger.py @@ -0,0 +1,39 @@ +from dash import Dash, html, Output, Input, _dash_renderer, callback +import dash_mantine_components as dmc + +_dash_renderer._set_react_version("18.2.0") + + +def test_001bu_burger(dash_duo): + app = Dash(__name__) + + app.layout = dmc.MantineProvider( + html.Div( + [dmc.Burger(id="burger-button", opened=False, lineSize=2, ), dmc.Text(id="burger-state", mt="md")] + ) + ) + + @callback(Output("burger-state", "children"), Input("burger-button", "opened")) + def is_open(opened): + return str(opened) + + dash_duo.start_server(app) + + # Wait for the app to load + dash_duo.wait_for_text_to_equal("#burger-state", "False") + + # Open Burger + burger = dash_duo.find_element("#burger-button") + burger.click() + + # Verify the Burger opens when clicking the button + dash_duo.wait_for_text_to_equal("#burger-state", "True") + + # Close Popover + burger.click() + + # Verify the Burger closes when clicked again + dash_duo.wait_for_text_to_equal("#burger-state", "False") + + assert dash_duo.get_logs() == [] +