@medyll/idae-slotui-svelte 0.47.0 → 0.59.0

package/dist/base/alert/Alert.demo.svelte

@@ -1,19 +1,17 @@
-<script lang="ts">
-	import ComponentDemo from '../demoer/DemoerComponent.svelte';
-	import Button from '../../controls/button/Button.svelte';
-	import Alert from './Alert.svelte';
-	import Demoer from '../demoer/Demoer.svelte';
-	import DemoPage from '../demoer/DemoPage.svelte';
-	import { parameters, componentArgs } from './types.js';
-
-	let code1 = `
+<script lang="ts">import ComponentDemo from "../demoer/DemoerComponent.svelte";
+import Button from "../../controls/button/Button.svelte";
+import Alert from "./Alert.svelte";
+import Demoer from "../demoer/Demoer.svelte";
+import DemoPage from "../demoer/DemoPage.svelte";
+import { parameters, componentArgs } from "./types.js";
+let code1 = `
 <Alert {...activeParams}>
 	Simple alert with a button
 	{#snippet topButtonSlot()}
 		<Button>button</Button>
 	{/snippet}
 </Alert>`;
-	let code2 = `
+let code2 = `
 <Alert />	`;
 </script>
 

package/dist/base/alert/Alert.svelte

@@ -1,59 +1,51 @@
-<script lang="ts">
-	import { fade } from 'svelte/transition';
-	import Divider from '../divider/Divider.svelte';
-	import Button from '../../controls/button/Button.svelte';
-	import type { ElementProps, ExpandProps } from '../../types/index.js';
-	import type { AlertProps } from './types.js';
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-	import IconButton from '../../controls/button/IconButton.svelte';
-
-	export const actions: Record<'open' | 'toggle' | 'close', Function> = {
-		open,
-		toggle,
-		close
-	};
-
-	let {
-		class: className,
-		message,
-		draggable = false,
-		level = $bindable<ElementProps['levels']>('info'),
-		isOpen = $bindable<boolean>(false),
-		element = $bindable<HTMLDialogElement>(),
-		children,
-		alertTopButton,
-		alertMessage,
-		alertButtonZone,
-		alertButtonClose
-	}: ExpandProps<AlertProps> = $props();
-
-	const handleClick = (event: Event) => {
-		if ((event?.target as Element)?.getAttribute('data-close')) {
-			event.stopPropagation();
-			actions.close();
-		}
-	};
-
-	$effect(() => {
-		if (element) {
-			element.addEventListener('click', handleClick, true);
-		}
-		return () => {
-			if (element) {
-				element.removeEventListener('click', handleClick);
-			}
-		};
-	});
-
-	function open() {
-		isOpen = true;
-	}
-	function toggle() {
-		isOpen = !isOpen;
-	}
-	function close() {
-		isOpen = false;
-	}
+<script lang="ts">import { fade } from "svelte/transition";
+import Divider from "../divider/Divider.svelte";
+import Button from "../../controls/button/Button.svelte";
+import Slotted from "../../utils/slotted/Slotted.svelte";
+import IconButton from "../../controls/button/IconButton.svelte";
+export const actions = {
+  open,
+  toggle,
+  close
+};
+let {
+  class: className,
+  message,
+  draggable = false,
+  level = $bindable("info"),
+  isOpen = $bindable(false),
+  element = $bindable(),
+  children,
+  alertTopButton,
+  alertMessage,
+  alertButtonZone,
+  alertButtonClose
+} = $props();
+const handleClick = (event) => {
+  if (event?.target?.getAttribute("data-close")) {
+    event.stopPropagation();
+    actions.close();
+  }
+};
+$effect(() => {
+  if (element) {
+    element.addEventListener("click", handleClick, true);
+  }
+  return () => {
+    if (element) {
+      element.removeEventListener("click", handleClick);
+    }
+  };
+});
+function open() {
+  isOpen = true;
+}
+function toggle() {
+  isOpen = !isOpen;
+}
+function close() {
+  isOpen = false;
+}
 </script>
 
 {#if isOpen}

package/dist/base/alert/Alert.svelte.d.ts

@@ -1,18 +1,5 @@
 import type { ElementProps } from '../../types/index.js';
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const Alert: $$__sveltets_2_IsomorphicComponent<{
+declare const Alert: import("svelte").Component<{
     level?: ElementProps["levels"] | undefined;
     message?: string | undefined;
     draggable?: boolean | undefined;
@@ -32,9 +19,7 @@ declare const Alert: $$__sveltets_2_IsomorphicComponent<{
     hideMinWidth?: string | undefined;
     hideMinHeight?: string | undefined;
 }, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {
     actions: Record<"open" | "toggle" | "close", Function>;
 }, "level" | "isOpen" | "element">;
-type Alert = InstanceType<typeof Alert>;
+type Alert = ReturnType<typeof Alert>;
 export default Alert;

package/dist/base/avatar/Avatar.demo.svelte

@@ -1,18 +1,14 @@
-<script lang="ts">
-	import ComponentDemo from '../demoer/DemoerComponent.svelte';
-	import Demoer from '../demoer/Demoer.svelte';
-	import DemoPage from '../demoer/DemoPage.svelte';
-	import Icon from '../icon/Icon.svelte';
-	import Avatar from './Avatar.svelte';
-
-	import { parameters, componentArgs } from './types.js';
-
-	let code1 = `
+<script lang="ts">import ComponentDemo from "../demoer/DemoerComponent.svelte";
+import Demoer from "../demoer/Demoer.svelte";
+import DemoPage from "../demoer/DemoPage.svelte";
+import Icon from "../icon/Icon.svelte";
+import Avatar from "./Avatar.svelte";
+import { parameters, componentArgs } from "./types.js";
+let code1 = `
 <Avatar>
 	<Icon icon={activeParams?.icon} />
 </Avatar>`;
-
-	let code2 = `
+let code2 = `
 	<Avatar icon={icon} />`;
 </script>
 

package/dist/base/avatar/Avatar.preview.svelte

@@ -1,6 +1,5 @@
-<script lang="ts">
-	import Icon from '../icon/Icon.svelte';
-	import Avatar from './Avatar.svelte';
+<script lang="ts">import Icon from "../icon/Icon.svelte";
+import Avatar from "./Avatar.svelte";
 </script>
 
 <Avatar size="tiny" class="marg-4"><Icon icon="user" /></Avatar>

package/dist/base/avatar/Avatar.svelte

@@ -1,27 +1,22 @@
-<script lang="ts">
-	import Icon from '../icon/Icon.svelte';
-	import type { ExpandProps } from '../../types/index.js';
-	import type { AvatarProps } from './types.js';
-	import Content from '../../utils/content/Content.svelte';
-
-	let {
-		icon = 'icon-park-outline:avatar',
-		size,
-		iconSize,
-		class: className = '',
-		element = $bindable(),
-		children,
-		avatarBadge,
-		...rest
-	}: ExpandProps<AvatarProps> = $props();
-
-	const sizes = {
-		tiny: '2rem',
-		small: '4rem',
-		medium: '8rem',
-		large: '12rem',
-		full: '100%'
-	};
+<script lang="ts">import Icon from "../icon/Icon.svelte";
+import Content from "../../utils/content/Content.svelte";
+let {
+  icon = "icon-park-outline:avatar",
+  size,
+  iconSize,
+  class: className = "",
+  element = $bindable(),
+  children,
+  avatarBadge,
+  ...rest
+} = $props();
+const sizes = {
+  tiny: "2rem",
+  small: "4rem",
+  medium: "8rem",
+  large: "12rem",
+  full: "100%"
+};
 </script>
 
 <Content

package/dist/base/avatar/Avatar.svelte.d.ts

@@ -1,17 +1,4 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const Avatar: $$__sveltets_2_IsomorphicComponent<{
+declare const Avatar: import("svelte").Component<{
     'anchor-for'?: string | undefined;
     element?: HTMLElement | undefined;
     class?: string | undefined;
@@ -26,8 +13,6 @@ declare const Avatar: $$__sveltets_2_IsomorphicComponent<{
     size?: import("../../types/index.js").ElementProps["width"] | undefined;
     iconSize?: import("../../types/index.js").ElementProps["iconSize"] | undefined;
     avatarBadge?: import("svelte").Snippet | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "element">;
-type Avatar = InstanceType<typeof Avatar>;
+}, {}, "element">;
+type Avatar = ReturnType<typeof Avatar>;
 export default Avatar;

package/dist/base/backdrop/Backdrop.demo.svelte

@@ -1,14 +1,11 @@
-<script lang="ts">
-	import ComponentDemo from '../demoer/DemoerComponent.svelte';
-	import Demoer from '../demoer/Demoer.svelte';
-	import DemoPage from '../demoer/DemoPage.svelte';
-	import { defaultsArgs } from '../demoer/demoer.utils.js';
-	import Backdrop from './Backdrop.svelte';
-	import { BackdropDemoValues } from './types.js';
-
-	import { parameters, componentArgs } from './types.js';
-
-	let codeSlot = `
+<script lang="ts">import ComponentDemo from "../demoer/DemoerComponent.svelte";
+import Demoer from "../demoer/Demoer.svelte";
+import DemoPage from "../demoer/DemoPage.svelte";
+import { defaultsArgs } from "../demoer/demoer.utils.js";
+import Backdrop from "./Backdrop.svelte";
+import { BackdropDemoValues } from "./types.js";
+import { parameters, componentArgs } from "./types.js";
+let codeSlot = `
 	<Backdrop
 		flow="relative"
 		onclick={()=>{}}> 
@@ -18,8 +15,7 @@
 			</div>
 		</div>
 	</Backdrop>`;
-
-	let BackdropRef: Backdrop;
+let BackdropRef;
 </script>
 
 <ComponentDemo component="Backdrop">

package/dist/base/backdrop/Backdrop.svelte

@@ -1,48 +1,40 @@
-<script lang="ts">
-	import { fade } from 'svelte/transition';
-	import Icon from '../icon/Icon.svelte';
-	import type { CommonProps, ExpandProps } from '../../types/index.js';
-	import type { BackdropProps } from './types.js';
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-
-	/** Backdrop controller */
-	export const actions = {
-		close: () => {
-			isOpen = false;
-		},
-		open: () => {
-			isOpen = true;
-		}
-	};
-
-	let {
-		class: className,
-		style,
-		flow = 'fixed',
-		autoClose = false,
-		isOpen = $bindable(),
-		onclick,
-		isLoading = false,
-		element,
-		elementContent,
-		elementContentInner,
-		component,
-		componentProps,
-		classes = {},
-		children,
-		backdropLoading
-	}: BackdropProps = $props();
-
-	$effect(() => {
-		element?.addEventListener('click', testAutoClose);
-		elementContentInner?.addEventListener('click', (event) => {
-			event.stopPropagation();
-		});
-	});
-
-	function testAutoClose() {
-		if (autoClose) isOpen = false;
-	}
+<script lang="ts">import { fade } from "svelte/transition";
+import Icon from "../icon/Icon.svelte";
+import Slotted from "../../utils/slotted/Slotted.svelte";
+export const actions = {
+  close: () => {
+    isOpen = false;
+  },
+  open: () => {
+    isOpen = true;
+  }
+};
+let {
+  class: className,
+  style,
+  flow = "fixed",
+  autoClose = false,
+  isOpen = $bindable(),
+  onclick,
+  isLoading = false,
+  element,
+  elementContent,
+  elementContentInner,
+  component,
+  componentProps,
+  classes = {},
+  children,
+  backdropLoading
+} = $props();
+$effect(() => {
+  element?.addEventListener("click", testAutoClose);
+  elementContentInner?.addEventListener("click", (event) => {
+    event.stopPropagation();
+  });
+});
+function testAutoClose() {
+  if (autoClose) isOpen = false;
+}
 </script>
 
 {#if isOpen}

package/dist/base/backdrop/Backdrop.svelte.d.ts

@@ -1,24 +1,9 @@
 import type { BackdropProps } from './types.js';
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const Backdrop: $$__sveltets_2_IsomorphicComponent<BackdropProps<any, any>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {
+declare const Backdrop: import("svelte").Component<BackdropProps<any, any>, {
     /** Backdrop controller */ actions: {
         close: () => void;
         open: () => void;
     };
 }, "isOpen">;
-type Backdrop = InstanceType<typeof Backdrop>;
+type Backdrop = ReturnType<typeof Backdrop>;
 export default Backdrop;

package/dist/base/badge/Badge.svelte

@@ -1,25 +1,21 @@
-<script lang="ts">
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-	import type { BadgeProps } from './types.js';
-
-	let {
-		value,
-		ceiling,
-		element,
-		position = { x: 'right', y: 'top' },
-		children
-	}: BadgeProps = $props();
-
-	const xM = {
-		left: 'left:0',
-		right: 'right:0',
-		center: 'left:50%;transformation:translate(-50%,0)'
-	};
-	const yM = {
-		top: 'top:0',
-		bottom: 'bottom:0',
-		center: 'top:50%;transformation:translate(0,-50%)'
-	};
+<script lang="ts">import Slotted from "../../utils/slotted/Slotted.svelte";
+let {
+  value,
+  ceiling,
+  element,
+  position = { x: "right", y: "top" },
+  children
+} = $props();
+const xM = {
+  left: "left:0",
+  right: "right:0",
+  center: "left:50%;transformation:translate(-50%,0)"
+};
+const yM = {
+  top: "top:0",
+  bottom: "bottom:0",
+  center: "top:50%;transformation:translate(0,-50%)"
+};
 </script>
 
 {#if value > ceiling}

package/dist/base/badge/Badge.svelte.d.ts

@@ -1,19 +1,4 @@
 import type { BadgeProps } from './types.js';
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const Badge: $$__sveltets_2_IsomorphicComponent<BadgeProps, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type Badge = InstanceType<typeof Badge>;
+declare const Badge: import("svelte").Component<BadgeProps, {}, "">;
+type Badge = ReturnType<typeof Badge>;
 export default Badge;

package/dist/base/box/Box.demo.svelte

@@ -1,15 +1,12 @@
-<script lang="ts">
-	import Box from './Box.svelte';
-	import Icon from '../icon/Icon.svelte';
-	import ComponentDemo from '../demoer/DemoerComponent.svelte';
-	import Demoer from '../demoer/Demoer.svelte';
-	import DemoPage from '../demoer/DemoPage.svelte';
-	import { BoxDemoValues } from './types.js';
-	import { defaultsArgs } from '../demoer/demoer.utils.js';
-
-	import { parameters, componentArgs } from './types.js';
-
-	let code = `
+<script lang="ts">import Box from "./Box.svelte";
+import Icon from "../icon/Icon.svelte";
+import ComponentDemo from "../demoer/DemoerComponent.svelte";
+import Demoer from "../demoer/Demoer.svelte";
+import DemoPage from "../demoer/DemoPage.svelte";
+import { BoxDemoValues } from "./types.js";
+import { defaultsArgs } from "../demoer/demoer.utils.js";
+import { parameters, componentArgs } from "./types.js";
+let code = `
 <Box>
 	{#snippet titleBarTitle()}
 		<span>Title of the box</span>

package/dist/base/box/Box.svelte

@@ -1,47 +1,39 @@
-<script lang="ts">
-	import TitleBar from '../titleBar/TitleBar.svelte';
-	import Icon from '../icon/Icon.svelte';
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-	import type { BoxProps } from './types.js';
-	import type { ExpandProps } from '../../types/index.js';
-	import Content from '../../utils/content/Content.svelte';
-
-	/** box actions */
-	export const actions = {
-		open,
-		toggle,
-		close
-	};
-
-	let {
-		class: className = '',
-		element = $bindable(),
-		style = '',
-		isOpen = $bindable(true),
-		showCloseControl = true,
-		hasMenu = false,
-		title,
-		icon,
-		content,
-		bottomZone,
-		children,
-		titleBarTitle,
-		titleBarIcon,
-		boxBottomZone,
-		...rest
-	}: ExpandProps<BoxProps> = $props();
-
-	function open() {
-		isOpen = true;
-	}
-	function toggle() {
-		isOpen = !isOpen;
-	}
-	function close() {
-		isOpen = false;
-	}
-
-	let closer = !showCloseControl ? {} : { onClose: () => actions.close() };
+<script lang="ts">import TitleBar from "../titleBar/TitleBar.svelte";
+import Icon from "../icon/Icon.svelte";
+import Slotted from "../../utils/slotted/Slotted.svelte";
+import Content from "../../utils/content/Content.svelte";
+export const actions = {
+  open,
+  toggle,
+  close
+};
+let {
+  class: className = "",
+  element = $bindable(),
+  style = "",
+  isOpen = $bindable(true),
+  showCloseControl = true,
+  hasMenu = false,
+  title,
+  icon,
+  content,
+  bottomZone,
+  children,
+  titleBarTitle,
+  titleBarIcon,
+  boxBottomZone,
+  ...rest
+} = $props();
+function open() {
+  isOpen = true;
+}
+function toggle() {
+  isOpen = !isOpen;
+}
+function close() {
+  isOpen = false;
+}
+let closer = !showCloseControl ? {} : { onClose: () => actions.close() };
 </script>
 
 {#if isOpen}

package/dist/base/box/Box.svelte.d.ts

@@ -1,17 +1,4 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const Box: $$__sveltets_2_IsomorphicComponent<{
+declare const Box: import("svelte").Component<{
     element?: HTMLDivElement | undefined;
     style?: string | undefined;
     isOpen: boolean;
@@ -33,13 +20,11 @@ declare const Box: $$__sveltets_2_IsomorphicComponent<{
     hideMinWidth?: string | undefined;
     hideMinHeight?: string | undefined;
 }, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {
     /** box actions */ actions: {
         open: () => void;
         toggle: () => void;
         close: () => void;
     };
 }, "isOpen" | "element">;
-type Box = InstanceType<typeof Box>;
+type Box = ReturnType<typeof Box>;
 export default Box;