fluent-svelte-extra 2.1.7 → 2.1.9

package/GridView/GridViewItem.svelte

@@ -7,6 +7,7 @@ const dispatch = createEventDispatcher();
 export let selected = false;
 export let group = "";
 export let singleSelect = false;
+export let disableUnselectionIfGrouped = false;
 const id = Math.random();
 /**
  * Sets the selected state of the grid view item.
@@ -26,6 +27,13 @@ function setSelected(value, __depth) {
     }
     selected = value;
 }
+function handleInteraction() {
+    if (disableUnselectionIfGrouped && group.length > 0 && selected) {
+        return;
+    }
+    setSelected(!selected, false);
+    dispatch("change", { selected: selected });
+}
 if (group.length) {
     const getAvailableGroupItems = (_a = getKey(`group:${group}`)) !== null && _a !== void 0 ? _a : [];
     getAvailableGroupItems.push({
@@ -42,14 +50,10 @@ if (group.length) {
 	class:selected
 	{...$$restProps}
 	tabindex="0"
-	on:click={() => {
-		setSelected(!selected, false);
-		dispatch("change", { selected: selected });
-	}}
+	on:click={handleInteraction}
 	on:keydown={e => {
 		if (e.key !== "Enter") return;
-		setSelected(!selected, false);
-		dispatch("change", { selected: selected });
+		handleInteraction();
 	}}
 >
 	{#if !singleSelect}
@@ -58,6 +62,10 @@ if (group.length) {
 				tabindex="-1"
 				bind:checked={selected}
 				on:change={() => {
+					if (disableUnselectionIfGrouped && group.length > 0 && !selected) {
+						selected = true;
+						return;
+					}
 					dispatch("change", { selected: !selected });
 				}}
 			/>

package/GridView/GridViewItem.svelte.d.ts

@@ -5,6 +5,7 @@ declare const __propDef: {
         selected?: boolean;
         group?: string;
         singleSelect?: boolean;
+        disableUnselectionIfGrouped?: boolean;
     };
     events: {
         change: CustomEvent<any>;

package/MenuFlyout/MenuFlyoutWrapper.scss

@@ -61,4 +61,4 @@
 			}
 		}
 	}
-}
+}

package/Portal/Portal.svelte

@@ -0,0 +1,27 @@
+<script >export let query;
+export let destroyable = true;
+export let teleportToTop = false;
+export let style = "";
+function teleport(node) {
+    let teleportContainer = document.querySelector(query);
+    if (teleportToTop && teleportContainer.firstChild) {
+        teleportContainer.insertBefore(node, teleportContainer.firstChild);
+    }
+    else {
+        teleportContainer.appendChild(node);
+    }
+    if (destroyable) {
+        return {
+            destroy() {
+                node.remove();
+            }
+        };
+    }
+}
+</script>
+
+<div class="portal" use:teleport {style}>
+	<slot></slot>
+</div>
+
+<style>.portal{display:contents}</style>

package/Portal/Portal.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        query: string;
+        destroyable?: boolean;
+        teleportToTop?: boolean;
+        style?: string;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export declare type PortalProps = typeof __propDef.props;
+export declare type PortalEvents = typeof __propDef.events;
+export declare type PortalSlots = typeof __propDef.slots;
+export default class Portal extends SvelteComponentTyped<PortalProps, PortalEvents, PortalSlots> {
+}
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fluent-svelte-extra",
-  "version": "2.1.7",
+  "version": "2.1.9",
   "description": "A faithful implementation of Microsoft's Fluent Design System in Svelte.",
   "homepage": "https://github.com/OpenAnime/fluent-svelte-extra",
   "license": "MIT",
@@ -135,6 +135,7 @@
     "./NumberBox/NumberBox.svelte": "./NumberBox/NumberBox.svelte",
     "./PersonPicture/PersonPicture.scss": "./PersonPicture/PersonPicture.scss",
     "./PersonPicture/PersonPicture.svelte": "./PersonPicture/PersonPicture.svelte",
+    "./Portal/Portal.svelte": "./Portal/Portal.svelte",
     "./ProgressBar/ProgressBar.scss": "./ProgressBar/ProgressBar.scss",
     "./ProgressBar/ProgressBar.svelte": "./ProgressBar/ProgressBar.svelte",
     "./ProgressRing/ProgressRing.scss": "./ProgressRing/ProgressRing.scss",