Make UI Shell HeaderAction panel transition configurable (#419)

* fix(ui-shell): remove fly transition from hamburger menu

* feat(header-action): make panel transition configurable

* chore: rebuild types, docs

* docs(ui-shell): document transition prop in Header app switcher example
This commit is contained in:
Eric Liu 2020-11-26 17:14:07 -08:00 committed by GitHub
commit f4c940d5ee
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
31 changed files with 244 additions and 160 deletions

View file

@ -20,6 +20,7 @@
Column,
} from "../types";
import SettingsAdjust20 from "carbon-icons-svelte/lib/SettingsAdjust20";
import { quintOut } from "svelte/easing";
let isSideNavOpen = false;
let isOpen = false;
@ -32,7 +33,10 @@
<HeaderUtilities>
<HeaderActionSearch />
<HeaderGlobalAction aria-label="Settings" icon="{SettingsAdjust20}" />
<HeaderAction bind:isOpen>
<HeaderAction
bind:isOpen
transition="{{ duration: 400, easing: quintOut }}"
>
<HeaderPanelLinks>
<HeaderPanelDivider>Switcher subject 1</HeaderPanelDivider>
<HeaderPanelLink>Switcher item 1</HeaderPanelLink>