@medyll/idae-slotui-svelte 0.47.0 → 0.58.0

package/dist/base/breadCrumb/BreadCrumb.svelte

@@ -1,15 +1,11 @@
-<script lang="ts">
-	import type { ExpandProps } from '../../types/index.js';
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-	import type { BreadCrumbProps } from './types.js';
-
-	let {
-		class: className,
-		element,
-		children,
-		style,
-		breadList = []
-	}: ExpandProps<BreadCrumbProps> = $props();
+<script lang="ts">import Slotted from "../../utils/slotted/Slotted.svelte";
+let {
+  class: className,
+  element,
+  children,
+  style,
+  breadList = []
+} = $props();
 </script>
 
 <nav bind:this={element} class="breadCrumb {className ?? ''}" {style}>

package/dist/base/cartouche/Cartouche.demo.svelte

@@ -1,14 +1,11 @@
-<script lang="ts">
-	import Cartouche from './Cartouche.svelte';
-	import Demoer from '../demoer/Demoer.svelte';
-	import DemoPage from '../demoer/DemoPage.svelte';
-	import Icon from '../icon/Icon.svelte';
-	import Button from '../../controls/button/Button.svelte';
-	import ComponentDemo from '../demoer/DemoerComponent.svelte';
-
-	import { parameters, componentArgs } from './types.js';
-
-	let code1 = `
+<script lang="ts">import Cartouche from "./Cartouche.svelte";
+import Demoer from "../demoer/Demoer.svelte";
+import DemoPage from "../demoer/DemoPage.svelte";
+import Icon from "../icon/Icon.svelte";
+import Button from "../../controls/button/Button.svelte";
+import ComponentDemo from "../demoer/DemoerComponent.svelte";
+import { parameters, componentArgs } from "./types.js";
+let code1 = `
 <Cartouche  class="marg-tb-1">
 	{#snippet cartoucheButtons()}
 		<Button size="medium">a button</Button>
@@ -24,8 +21,7 @@
 	{/snippet}
 	<div class="pad-2 border-t">Some <br />Cartouche <br />content</div>
 </Cartouche>`;
-
-	let code2 = `
+let code2 = `
 	<Cartouche 
 		class="marg-tb-1" />`;
 </script>

package/dist/base/cartouche/Cartouche.svelte

@@ -1,55 +1,47 @@
-<script lang="ts">
-	import { slide } from 'svelte/transition';
-	import Icon from '../icon/Icon.svelte';
-	import Button from '../../controls/button/Button.svelte';
-	import IconButton from '../../controls/button/IconButton.svelte';
-	import type { CartoucheClasses, CartoucheProps } from './types.js';
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-	import type { ExpandProps } from '../../types/index.js';
-
-	export const actions = {
-		open,
-		toggle,
-		close
-	};
-
-	let {
-		class: className = '',
-		classes = {} as CartoucheClasses,
-		style = undefined,
-		element = $bindable(),
-		primary,
-		secondary,
-		icon,
-		stacked = false,
-		component,
-		componentProps = {},
-		keepCartoucheContent = true,
-		showTitleDivider = false,
-		bordered = false,
-		children,
-		cartoucheIcon,
-		cartouchePrimary,
-		cartoucheSecondary,
-		cartoucheButtons,
-		isOpen = $bindable(),
-		dense,
-		tall = "small"
-	}: ExpandProps<CartoucheProps> = $props();
-
-	function open() {
-		isOpen = true;
-	}
-	function toggle(event: Event) {
-		isOpen = !isOpen;
-	}
-	function close() {
-		isOpen = false;
-	}
-
-	const chevronIcon = $derived(!isOpen ? 'chevron-down' : 'chevron-up');
-
-	let Component = $state(component);
+<script lang="ts">import { slide } from "svelte/transition";
+import Icon from "../icon/Icon.svelte";
+import Button from "../../controls/button/Button.svelte";
+import IconButton from "../../controls/button/IconButton.svelte";
+import Slotted from "../../utils/slotted/Slotted.svelte";
+export const actions = {
+  open,
+  toggle,
+  close
+};
+let {
+  class: className = "",
+  classes = {},
+  style = void 0,
+  element = $bindable(),
+  primary,
+  secondary,
+  icon,
+  stacked = false,
+  component,
+  componentProps = {},
+  keepCartoucheContent = true,
+  showTitleDivider = false,
+  bordered = false,
+  children,
+  cartoucheIcon,
+  cartouchePrimary,
+  cartoucheSecondary,
+  cartoucheButtons,
+  isOpen = $bindable(),
+  dense,
+  tall = "small"
+} = $props();
+function open() {
+  isOpen = true;
+}
+function toggle(event) {
+  isOpen = !isOpen;
+}
+function close() {
+  isOpen = false;
+}
+const chevronIcon = $derived(!isOpen ? "chevron-down" : "chevron-up");
+let Component = $state(component);
 </script>
 
 <!-- svelte-ignore a11y_click_events_have_key_events -->

package/dist/base/cartouche/Cartouche.svelte.d.ts

@@ -1,19 +1,6 @@
 import { SvelteComponent } from "svelte";
 import type { CartoucheClasses } 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 Cartouche: $$__sveltets_2_IsomorphicComponent<{
+declare const Cartouche: import("svelte").Component<{
     'anchor-for'?: string | undefined;
     element?: (HTMLElement & HTMLDivElement) | undefined;
     class?: string | undefined;
@@ -43,13 +30,11 @@ declare const Cartouche: $$__sveltets_2_IsomorphicComponent<{
     cartoucheSecondary?: import("svelte").Snippet | undefined;
     cartoucheButtons?: import("svelte").Snippet | undefined;
 }, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {
     actions: {
         open: () => void;
         toggle: (event: Event) => void;
         close: () => void;
     };
 }, "isOpen" | "element">;
-type Cartouche = InstanceType<typeof Cartouche>;
+type Cartouche = ReturnType<typeof Cartouche>;
 export default Cartouche;

package/dist/base/chipper/Chipper.demo.svelte

@@ -1,24 +1,20 @@
-<script lang="ts">
-	import ComponentDemo from '../demoer/DemoerComponent.svelte';
-	import Demoer from '../demoer/Demoer.svelte';
-	import DemoPage from '../demoer/DemoPage.svelte';
-	import { chipperDemoValues, type ChipperProps } from './types.js';
-	import { defaultsArgs } from '../demoer/demoer.utils.js';
-	import Chipper from './Chipper.svelte';
-
-	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 { chipperDemoValues } from "./types.js";
+import { defaultsArgs } from "../demoer/demoer.utils.js";
+import Chipper from "./Chipper.svelte";
+import { parameters, componentArgs } from "./types.js";
+let codeSlot = `
 <Chipper >
 	<div class="pad-2">some content</div>
 	{#snippet chipperChip()}
 		<div class="theme-bg-primary radius-small w-full h-full"></div>
 	{/snippet}
 </Chipper>`;
-
-	let codeProps = `
+let codeProps = `
 <Chipper
-	content="<div class='pad'>Some props html content<\/div>"
+	content="<div class='pad'>Some props html content</div>"
 	color="red" />`;
 </script>
 

package/dist/base/chipper/Chipper.svelte

@@ -1,22 +1,17 @@
-<script lang="ts">
-	import type { CommonProps, ElementProps, ExpandProps } from '../../types/index.js';
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-	import type { ChipperProps } from './types.js';
-
-	let {
-		class: className = '',
-		style,
-		element = $bindable<HTMLDivElement>(),
-		position = 'bottom',
-		theme: status = 'primary',
-		color = '',
-		content = '',
-		showChip = true,
-		chipperChip,
-		children
-	}: ExpandProps<ChipperProps> = $props();
-
-	let cssColor = $derived(color ?? (status ? `var(--sld-color-${status})` : ''));
+<script lang="ts">import Slotted from "../../utils/slotted/Slotted.svelte";
+let {
+  class: className = "",
+  style,
+  element = $bindable(),
+  position = "bottom",
+  theme: status = "primary",
+  color = "",
+  content = "",
+  showChip = true,
+  chipperChip,
+  children
+} = $props();
+let cssColor = $derived(color ?? (status ? `var(--sld-color-${status})` : ""));
 </script>
 
 <div bind:this={element} style="{style};position:relative;" class="chipper {className} ">

package/dist/base/chipper/Chipper.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 Chipper: $$__sveltets_2_IsomorphicComponent<{
+declare const Chipper: import("svelte").Component<{
     position?: ElementProps["position"] | undefined;
     theme?: "primary" | "secondary" | "tertiary" | "success" | "warning" | "danger" | "light" | "medium" | "dark" | undefined;
     color?: string | undefined;
@@ -29,8 +16,6 @@ declare const Chipper: $$__sveltets_2_IsomorphicComponent<{
     hideMinWidth?: string | undefined;
     hideMinHeight?: string | undefined;
     children?: import("svelte").Snippet<[any]> | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "element">;
-type Chipper = InstanceType<typeof Chipper>;
+}, {}, "element">;
+type Chipper = ReturnType<typeof Chipper>;
 export default Chipper;

package/dist/base/columner/Column.svelte

@@ -1,42 +1,34 @@
-<script lang="ts">
-	import { getContext, tick } from 'svelte';
-	import type { ColumnProps, ColumnerStoreType } from './types.js';
-	import { resizer } from '../../utils/uses/resizer/resizer.js';
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-	import { onEvent } from '../../utils/uses/event.js';
-
-	let columner = getContext<ColumnerStoreType>('columner');
-
-	let {
-		class: className = '',
-		element = $bindable(),
-		style = '',
-		columnId = crypto.randomUUID() as string,
-		bottomSlot,
-		drawerTop,
-		children,
-		...rest
-	}: ColumnProps = $props();
-
-	if (!$columner[columnId]) {
-		$columner[columnId] = {
-			columnId: Object.keys($columner).length,
-			state: 'default',
-			defaultStyle: {}
-		};
-	}
-
-	let width: string;
-
-	function resizeStart() {}
-
-	async function resizeOn(data: CustomEvent<{ width: any }>) {
-		await tick();
-		width = data.detail.width + 'px';
-		// $dataListContext.columns[field].width = data.detail.width + 'px';
-	}
-
-	function resizeEnd() {}
+<script lang="ts">import { getContext, tick } from "svelte";
+import { resizer } from "../../utils/uses/resizer/resizer.js";
+import Slotted from "../../utils/slotted/Slotted.svelte";
+import { onEvent } from "../../utils/uses/event.js";
+let columner = getContext("columner");
+let {
+  class: className = "",
+  element = $bindable(),
+  style = "",
+  columnId = crypto.randomUUID(),
+  bottomSlot,
+  drawerTop,
+  children,
+  ...rest
+} = $props();
+if (!$columner[columnId]) {
+  $columner[columnId] = {
+    columnId: Object.keys($columner).length,
+    state: "default",
+    defaultStyle: {}
+  };
+}
+let width;
+function resizeStart() {
+}
+async function resizeOn(data) {
+  await tick();
+  width = data.detail.width + "px";
+}
+function resizeEnd() {
+}
 </script>
 
 <div

package/dist/base/columner/Column.svelte.d.ts

@@ -1,19 +1,4 @@
 import type { ColumnProps } 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 Column: $$__sveltets_2_IsomorphicComponent<ColumnProps, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "element">;
-type Column = InstanceType<typeof Column>;
+declare const Column: import("svelte").Component<ColumnProps, {}, "element">;
+type Column = ReturnType<typeof Column>;
 export default Column;

package/dist/base/columner/Columner.demo.svelte

@@ -1,7 +1,6 @@
-<script lang="ts">
-	import ComponentDemo from '../demoer/DemoerComponent.svelte';
-	import Column from './Column.svelte';
-	import Columner from './Columner.svelte';
+<script lang="ts">import ComponentDemo from "../demoer/DemoerComponent.svelte";
+import Column from "./Column.svelte";
+import Columner from "./Columner.svelte";
 </script>
 
 todo

package/dist/base/columner/Columner.svelte

@@ -1,15 +1,8 @@
-<script lang="ts">
-	import type { ExpandProps } from '../../types/index.js';
-	import type { ColumnerStoreType } from './types.js';
-	import { setContext, type Snippet } from 'svelte';
-	import { writable } from 'svelte/store';
-
-	const columner = writable<ColumnerStoreType>({});
-	setContext('columner', columner);
-	type Props = {
-		children: Snippet;
-	};
-	let { children, ...restProps }: ExpandProps<Props> = $props();
+<script lang="ts">import { setContext } from "svelte";
+import { writable } from "svelte/store";
+const columner = writable({});
+setContext("columner", columner);
+let { children, ...restProps } = $props();
 </script>
 
 <div class="columner" {...restProps}>

package/dist/base/columner/Columner.svelte.d.ts

@@ -1,21 +1,6 @@
 import { type Snippet } from 'svelte';
-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 Columner: $$__sveltets_2_IsomorphicComponent<{
+declare const Columner: import("svelte").Component<{
     children: Snippet;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type Columner = InstanceType<typeof Columner>;
+}, {}, "">;
+type Columner = ReturnType<typeof Columner>;
 export default Columner;

package/dist/base/contentSwitcher/ContentSwitcher.demo.svelte

@@ -1,14 +1,11 @@
-<script lang="ts">
-	import ComponentDemo from '../demoer/DemoerComponent.svelte';
-	import { Demoer } from '../../../sitedata/slotuiComponents.js';
-	import Icon from '../icon/Icon.svelte';
-	import DemoPage from '../demoer/DemoPage.svelte';
-	import ContentSwitcher from './ContentSwitcher.svelte';
-	import { contentSwitcherDemoValues } from './types.js';
-
-	import { parameters, componentArgs } from './types.js';
-
-	const code = `
+<script lang="ts">import ComponentDemo from "../demoer/DemoerComponent.svelte";
+import { Demoer } from "../../../sitedata/slotuiComponents.js";
+import Icon from "../icon/Icon.svelte";
+import DemoPage from "../demoer/DemoPage.svelte";
+import ContentSwitcher from "./ContentSwitcher.svelte";
+import { contentSwitcherDemoValues } from "./types.js";
+import { parameters, componentArgs } from "./types.js";
+const code = `
 <ContentSwitcher {...activeParams} class="marg-tb-1">
     {#snippet contentSwitcherTogglerIcon()}
         <Icon icon="mdi:tree" />

package/dist/base/contentSwitcher/ContentSwitcher.svelte

@@ -1,43 +1,33 @@
-<script lang="ts">
-	import IconButton from '../../controls/button/IconButton.svelte';
-	import Button from '../../controls/button/Button.svelte';
-	import Slotted from '../../utils/slotted/Slotted.svelte';
-	import type { ContentSwitcherProps } from './types.js';
-	import type { ExpandProps } from '../../types/index.js';
-
-	let {
-		class: className = '',
-		element = undefined,
-		style,
-		icon = 'toggle',
-		iconback = 'chevron-left',
-		parent = undefined,
-		contentSwitcherTogglerIcon: togglerIcon,
-		contentSwitcherBackIcon: backIcon,
-		contentSwitcherReveal
-	}: ExpandProps<ContentSwitcherProps> = $props();
-
-	let visibleSate: boolean = $state(false);
-	let thisRef: any;
-	let realParent: HTMLElement | null = $derived(parent ?? element?.parentElement ?? null);
-
-	function handleClick(event: MouseEvent) {
-		visibleSate = !visibleSate;
-		if (!element || !realParent) return false;
-		const children: HTMLCollection = realParent?.children;
-
-		// iterate over all child nodes
-		Array.from(children).forEach((li: any) => {
-			//li.style.transform = visibleSate ? 'scale(0,0)' : '';
-			li.style.display = visibleSate ? 'none' : '';
-		});
-
-		if (visibleSate) {
-			realParent.appendChild(thisRef);
-		} else {
-			element.appendChild(thisRef);
-		}
-	}
+<script lang="ts">import IconButton from "../../controls/button/IconButton.svelte";
+import Button from "../../controls/button/Button.svelte";
+import Slotted from "../../utils/slotted/Slotted.svelte";
+let {
+  class: className = "",
+  element = void 0,
+  style,
+  icon = "toggle",
+  iconback = "chevron-left",
+  parent = void 0,
+  contentSwitcherTogglerIcon: togglerIcon,
+  contentSwitcherBackIcon: backIcon,
+  contentSwitcherReveal
+} = $props();
+let visibleSate = $state(false);
+let thisRef;
+let realParent = $derived(parent ?? element?.parentElement ?? null);
+function handleClick(event) {
+  visibleSate = !visibleSate;
+  if (!element || !realParent) return false;
+  const children = realParent?.children;
+  Array.from(children).forEach((li) => {
+    li.style.display = visibleSate ? "none" : "";
+  });
+  if (visibleSate) {
+    realParent.appendChild(thisRef);
+  } else {
+    element.appendChild(thisRef);
+  }
+}
 </script>
 
 <!-- svelte-ignore a11y_click_events_have_key_events -->

package/dist/base/contentSwitcher/ContentSwitcher.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 ContentSwitcher: $$__sveltets_2_IsomorphicComponent<{
+declare const ContentSwitcher: import("svelte").Component<{
     'anchor-for'?: string | undefined;
     element?: (HTMLElement & HTMLDivElement) | undefined;
     class?: string | undefined;
@@ -28,8 +15,6 @@ declare const ContentSwitcher: $$__sveltets_2_IsomorphicComponent<{
     contentSwitcherTogglerIcon?: import("svelte").Snippet | undefined;
     contentSwitcherBackIcon?: import("svelte").Snippet | undefined;
     contentSwitcherReveal?: import("svelte").Snippet | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type ContentSwitcher = InstanceType<typeof ContentSwitcher>;
+}, {}, "">;
+type ContentSwitcher = ReturnType<typeof ContentSwitcher>;
 export default ContentSwitcher;

package/dist/base/debug/Debug.svelte

@@ -1,17 +1,14 @@
-<script lang="ts">
-	import Cartouche from '../cartouche/Cartouche.svelte';
-	import type TabsItemsProps from '../../navigation/tabs/Tabs.svelte';
-
-	const items: TabsItemsProps = [
-		{ label: 'theTitle', code: 'theTitle1' },
-		{ label: 'theTitle bis', code: 'theTitle2' },
-		{
-			label: 'theTitle ter',
-			code: 'theTitle3',
-			component: Cartouche,
-			componentProps: { label: 'dynamic' }
-		}
-	];
+<script lang="ts">import Cartouche from "../cartouche/Cartouche.svelte";
+const items = [
+  { label: "theTitle", code: "theTitle1" },
+  { label: "theTitle bis", code: "theTitle2" },
+  {
+    label: "theTitle ter",
+    code: "theTitle3",
+    component: Cartouche,
+    componentProps: { label: "dynamic" }
+  }
+];
 </script>
 
 <div style="padding:0.5rem">