fluent-svelte-extra 2.0.6 → 2.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -7,7 +7,7 @@ export let open = false;
|
|
|
7
7
|
/** Determines if the flyout can be closed using conventional user interaction. */
|
|
8
8
|
export let closable = true;
|
|
9
9
|
/** Controls if the flyout will be closed when clicking a standard variant item. Only applies if `closable` is set to `true`. */
|
|
10
|
-
export let closeOnSelect =
|
|
10
|
+
export let closeOnSelect = false;
|
|
11
11
|
/** Direction that the flyout will be opened from. */
|
|
12
12
|
export let placement = "top";
|
|
13
13
|
/** Alignment of the menu along the clickable target's given axis. */
|
|
@@ -77,7 +77,12 @@ setContext("closeFlyout", event => {
|
|
|
77
77
|
use:arrowNavigation={{ preventTab: true }}
|
|
78
78
|
on:click={e => e.stopPropagation()}
|
|
79
79
|
>
|
|
80
|
-
<MenuFlyoutSurface
|
|
80
|
+
<MenuFlyoutSurface
|
|
81
|
+
bind:element={menuElement}
|
|
82
|
+
bind:this={menu}
|
|
83
|
+
{...$$restProps}
|
|
84
|
+
{acrylic}
|
|
85
|
+
>
|
|
81
86
|
<slot name="flyout" />
|
|
82
87
|
</MenuFlyoutSurface>
|
|
83
88
|
</div>
|
|
@@ -90,4 +95,4 @@ setContext("closeFlyout", event => {
|
|
|
90
95
|
{/if}
|
|
91
96
|
</div>
|
|
92
97
|
|
|
93
|
-
<style >.menu-flyout-wrapper{display:inline-block;height:auto;position:relative}.menu-flyout-backdrop{height:100%;left:0;position:fixed;top:0;width:100%;z-index:9999}.menu-flyout-anchor{position:absolute;z-index:10000}.menu-flyout-anchor.placement-top{--fds-menu-flyout-transition-offset:50%;bottom:calc(100% + var(--fds-menu-flyout-offset))}.menu-flyout-anchor.placement-bottom{top:calc(100% + var(--fds-menu-flyout-offset))}.menu-flyout-anchor.placement-left{right:calc(100% + var(--fds-menu-flyout-offset))}.menu-flyout-anchor.placement-right{left:calc(100% + var(--fds-menu-flyout-offset))}.menu-flyout-anchor.placement-bottom.alignment-start,.menu-flyout-anchor.placement-top.alignment-start{inset-inline-start:0}.menu-flyout-anchor.placement-bottom.alignment-end,.menu-flyout-anchor.placement-top.alignment-end{inset-inline-end:0}.menu-flyout-anchor.placement-bottom.alignment-center,.menu-flyout-anchor.placement-top.alignment-center{inset-inline-start:50%;transform:translateX(-50%)}.menu-flyout-anchor.placement-left.alignment-start,.menu-flyout-anchor.placement-right.alignment-start{inset-block-start:0}.menu-flyout-anchor.placement-left.alignment-end,.menu-flyout-anchor.placement-right.alignment-end{inset-block-end:0}.menu-flyout-anchor.placement-left.alignment-center,.menu-flyout-anchor.placement-right.alignment-center{inset-block-start:50%;transform:translateY(-50%)}</style>
|
|
98
|
+
<style >.menu-flyout-wrapper{display:inline-block;height:auto;position:relative}.menu-flyout-backdrop{height:100%;left:0;position:fixed;top:0;width:100%;z-index:9999}.menu-flyout-anchor{position:absolute;z-index:10000}.menu-flyout-anchor.placement-top{--fds-menu-flyout-transition-offset:50%;bottom:calc(100% + var(--fds-menu-flyout-offset))}.menu-flyout-anchor.placement-bottom{top:calc(100% + var(--fds-menu-flyout-offset))}.menu-flyout-anchor.placement-left{right:calc(100% + var(--fds-menu-flyout-offset))}.menu-flyout-anchor.placement-right{left:calc(100% + var(--fds-menu-flyout-offset))}.menu-flyout-anchor.placement-bottom.alignment-start,.menu-flyout-anchor.placement-top.alignment-start{inset-inline-start:0}.menu-flyout-anchor.placement-bottom.alignment-end,.menu-flyout-anchor.placement-top.alignment-end{inset-inline-end:0}.menu-flyout-anchor.placement-bottom.alignment-center,.menu-flyout-anchor.placement-top.alignment-center{inset-inline-start:50%;transform:translateX(-50%)}.menu-flyout-anchor.placement-left.alignment-start,.menu-flyout-anchor.placement-right.alignment-start{inset-block-start:0}.menu-flyout-anchor.placement-left.alignment-end,.menu-flyout-anchor.placement-right.alignment-end{inset-block-end:0}.menu-flyout-anchor.placement-left.alignment-center,.menu-flyout-anchor.placement-right.alignment-center{inset-block-start:50%;transform:translateY(-50%)}</style>
|
package/package.json
CHANGED