windmill-components 1.448.50 → 1.472.1

package/package/components/common/menu/MenuItem.svelte

@@ -1,11 +0,0 @@
-<!-- svelte-ignore a11y-click-events-have-key-events -->
-<!-- svelte-ignore a11y-no-static-element-interactions -->
-<div on:click class="py-1">
-	<span
-		class="text-secondary block px-4 py-2 text-sm hover:bg-surface-hover hover:text-primary"
-		role="menuitem"
-		tabindex="-1"
-	>
-		<slot />
-	</span>
-</div>

package/package/components/common/menu/MenuItem.svelte.d.ts

@@ -1,31 +0,0 @@
-/** @typedef {typeof __propDef.props}  MenuItemProps */
-/** @typedef {typeof __propDef.events}  MenuItemEvents */
-/** @typedef {typeof __propDef.slots}  MenuItemSlots */
-export default class MenuItem extends SvelteComponent<{
-    [x: string]: never;
-}, {
-    click: MouseEvent;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> {
-}
-export type MenuItemProps = typeof __propDef.props;
-export type MenuItemEvents = typeof __propDef.events;
-export type MenuItemSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: never;
-    };
-    events: {
-        click: MouseEvent;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export {};

package/package/components/common/menu/MenuV2.svelte

@@ -1,51 +0,0 @@
-<script>import { Menu, MenuButton, MenuItems, Transition } from '@rgossiaux/svelte-headlessui';
-import Portal from '../../Portal.svelte';
-import { offset, flip, shift } from 'svelte-floating-ui/dom';
-import { createFloatingActions } from 'svelte-floating-ui';
-import { twMerge } from 'tailwind-merge';
-import ResolveOpen from './ResolveOpen.svelte';
-export let placement = 'bottom-start';
-export let justifyEnd = false;
-export let lightMode = false;
-export let maxHeight = 900;
-export let disabled = false;
-const [floatingRef, floatingContent] = createFloatingActions({
-    strategy: 'fixed',
-    middleware: [offset(), flip(), shift()],
-    placement: placement
-});
-</script>
-
-<Menu let:open as="div" class="relative hover:z-50 flex w-full h-8">
-	<ResolveOpen {open} on:open on:close />
-	<div use:floatingRef class="w-full">
-		<MenuButton class={twMerge('w-full', justifyEnd ? 'flex justify-end' : '')} disabled={disabled}>
-			<slot name="trigger" />
-		</MenuButton>
-	</div>
-	<Portal name="menu-v2">
-		<div use:floatingContent class="z-[6000]">
-			<Transition
-				{open}
-				enter="transition ease-out duration-[25ms]"
-				enterFrom="transform opacity-0 scale-95"
-				enterTo="transform opacity-100 scale-100"
-				leave="transition ease-in duration-[25ms]"
-				leaveFrom="transform opacity-100 scale-100"
-				leaveTo="transform opacity-0 scale-95"
-			>
-				<MenuItems
-					class={twMerge(
-						'border w-56 origin-top-right rounded-md shadow-md focus:outline-none overflow-y-auto',
-						lightMode ? 'bg-surface-inverse' : 'bg-surface'
-					)}
-					style="max-height: {maxHeight}px;"
-				>
-					<div class="my-1">
-						<slot />
-					</div>
-				</MenuItems>
-			</Transition>
-		</div>
-	</Portal>
-</Menu>

package/package/components/common/menu/MenuV2.svelte.d.ts

@@ -1,26 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        placement?: any;
-        justifyEnd?: boolean | undefined;
-        lightMode?: boolean | undefined;
-        maxHeight?: number | undefined;
-        disabled?: boolean | undefined;
-    };
-    events: {
-        open: CustomEvent<any>;
-        close: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        trigger: {};
-        default: {};
-    };
-};
-export type MenuV2Props = typeof __propDef.props;
-export type MenuV2Events = typeof __propDef.events;
-export type MenuV2Slots = typeof __propDef.slots;
-export default class MenuV2 extends SvelteComponent<MenuV2Props, MenuV2Events, MenuV2Slots> {
-}
-export {};

package/package/components/common/menu/ResolveOpen.svelte

@@ -1,12 +0,0 @@
-<script>import { createEventDispatcher } from 'svelte';
-const dispatch = createEventDispatcher();
-export let open = false;
-$: {
-    if (open) {
-        dispatch('open');
-    }
-    else {
-        dispatch('close');
-    }
-}
-</script>

package/package/components/common/menu/ResolveOpen.svelte.d.ts

@@ -1,19 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        open?: boolean | undefined;
-    };
-    events: {
-        open: CustomEvent<any>;
-        close: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ResolveOpenProps = typeof __propDef.props;
-export type ResolveOpenEvents = typeof __propDef.events;
-export type ResolveOpenSlots = typeof __propDef.slots;
-export default class ResolveOpen extends SvelteComponent<ResolveOpenProps, ResolveOpenEvents, ResolveOpenSlots> {
-}
-export {};

package/package/components/common/modal/AlwaysMountedModal.svelte

@@ -1,71 +0,0 @@
-<script>import Portal from '../../Portal.svelte';
-import { twMerge } from 'tailwind-merge';
-import { clickOutside } from '../../../utils';
-import { X } from 'lucide-svelte';
-import { getContext } from 'svelte';
-export let title;
-export let style = '';
-export let css = {};
-const { mode } = getContext('AppViewerContext');
-let isOpen = false;
-export function close() {
-    isOpen = false;
-}
-export function open() {
-    isOpen = true;
-}
-</script>
-
-<Portal name="always-mounted" target="#app-editor-top-level-drawer">
-	<div
-		class={twMerge(
-			`${
-				$mode == 'dnd' ? 'absolute' : 'fixed'
-			} top-0 bottom-0 left-0 right-0 transition-all duration-50 overflow-hidden`,
-			isOpen ? 'z-[1100] bg-black bg-opacity-60' : 'hidden'
-		)}
-	>
-		<div class="flex min-h-full items-center justify-center p-4">
-			<div
-				style={css?.popup?.style}
-				class={twMerge(
-					'bg-surface max-w-5xl m-24 overflow-y-auto rounded-lg relative',
-					css?.popup?.class,
-					'wm-modal-form-popup'
-				)}
-				use:clickOutside
-				on:click_outside={() => {
-					close()
-				}}
-			>
-				<div class="px-4 py-2 border-b flex justify-between items-center">
-					<div>{title}</div>
-					<div class="w-8">
-						<button
-							on:click={() => {
-								isOpen = false
-							}}
-							class="hover:bg-surface-hover bg-surface-secondary rounded-full w-8 h-8 flex items-center justify-center transition-all"
-						>
-							<X class="text-tertiary" />
-						</button>
-					</div>
-				</div>
-
-				<!-- svelte-ignore a11y-click-events-have-key-events -->
-				<!-- svelte-ignore a11y-no-static-element-interactions -->
-				<div class="relative bg-surface rounded-md" on:click|stopPropagation={() => {}}>
-					<div
-						class={twMerge(
-							'max-w-screen-lg max-h-screen-80 overflow-auto flex flex-col',
-							$$props.class
-						)}
-						{style}
-					>
-						<slot />
-					</div>
-				</div>
-			</div>
-		</div>
-	</div></Portal
->

package/package/components/common/modal/AlwaysMountedModal.svelte.d.ts

@@ -1,25 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-        title: string;
-        style?: string | undefined;
-        css?: any;
-        close?: (() => void) | undefined;
-        open?: (() => void) | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export type AlwaysMountedModalProps = typeof __propDef.props;
-export type AlwaysMountedModalEvents = typeof __propDef.events;
-export type AlwaysMountedModalSlots = typeof __propDef.slots;
-export default class AlwaysMountedModal extends SvelteComponent<AlwaysMountedModalProps, AlwaysMountedModalEvents, AlwaysMountedModalSlots> {
-    get close(): () => void;
-    get open(): () => void;
-}
-export {};

package/package/components/common/modal/Modal.svelte

@@ -1,98 +0,0 @@
-<script>import { createEventDispatcher } from 'svelte';
-import { fade } from 'svelte/transition';
-import Button from '../button/Button.svelte';
-import Badge from '../badge/Badge.svelte';
-import { twMerge } from 'tailwind-merge';
-export let title;
-export let open = false;
-let c = '';
-export { c as class };
-export let style = '';
-export let cancelText = undefined;
-const dispatch = createEventDispatcher();
-function onKeyDown(event) {
-    if (open) {
-        switch (event.key) {
-            case 'Enter':
-                event.stopPropagation();
-                event.preventDefault();
-                dispatch('confirmed');
-                break;
-            case 'Escape':
-                event.stopPropagation();
-                event.preventDefault();
-                open = false;
-                dispatch('canceled');
-                break;
-        }
-    }
-}
-function fadeFast(node) {
-    return fade(node, { duration: 100 });
-}
-</script>
-
-<svelte:window on:keydown={onKeyDown} />
-
-{#if open}
-	<!-- svelte-ignore a11y-click-events-have-key-events -->
-	<!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
-	<div
-		on:click={() => (open = false)}
-		transition:fadeFast|local
-		class={'absolute top-0 bottom-0 left-0 right-0 z-[9999]'}
-		role="dialog"
-	>
-		<div
-			class={twMerge(
-				'fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity',
-				open ? 'ease-out duration-300 opacity-100' : 'ease-in duration-200 opacity-0'
-			)}
-		/>
-
-		<div class="fixed inset-0 z-10 overflow-y-auto">
-			<div class="flex min-h-full items-center justify-center p-4">
-				<!-- svelte-ignore a11y-no-static-element-interactions -->
-				<div
-					on:click|stopPropagation
-					class={twMerge(
-						'relative transform overflow-hidden rounded-lg bg-surface px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-lg sm:p-6',
-						c,
-						open
-							? 'ease-out duration-300 opacity-100 translate-y-0 sm:scale-100'
-							: 'ease-in duration-200 opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95'
-					)}
-					{style}
-				>
-					<div class="flex">
-						<div class="ml-4 text-left flex-1">
-							<div class="flex flex-row items-center justify-between">
-								<h3>{title}</h3>
-								<slot name="settings" />
-							</div>
-
-							<div class="mt-4 text-sm text-tertiary">
-								<slot />
-							</div>
-						</div>
-					</div>
-					<div class="flex items-center space-x-2 flex-row-reverse space-x-reverse mt-4">
-						<slot name="actions" />
-						<Button
-							on:click={() => {
-								dispatch('canceled')
-								open = false
-							}}
-							color="light"
-							size="sm"
-						>
-							<span class="inline-flex gap-2"
-								>{cancelText ?? 'Cancel'}<Badge color="dark-gray">Escape</Badge></span
-							>
-						</Button>
-					</div>
-				</div>
-			</div>
-		</div>
-	</div>
-{/if}

package/package/components/common/modal/Modal.svelte.d.ts

@@ -1,28 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        title: string;
-        open?: boolean | undefined;
-        class?: string | undefined;
-        style?: string | undefined;
-        cancelText?: string | undefined;
-    };
-    events: {
-        click: MouseEvent;
-        canceled: CustomEvent<any>;
-        confirmed: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        settings: {};
-        default: {};
-        actions: {};
-    };
-};
-export type ModalProps = typeof __propDef.props;
-export type ModalEvents = typeof __propDef.events;
-export type ModalSlots = typeof __propDef.slots;
-export default class Modal extends SvelteComponent<ModalProps, ModalEvents, ModalSlots> {
-}
-export {};

package/package/components/common/modal/Modal2.svelte

@@ -1,101 +0,0 @@
-<script>import Portal from '../../Portal.svelte';
-import { twMerge } from 'tailwind-merge';
-import { clickOutside } from '../../../utils';
-import { X } from 'lucide-svelte';
-import List from '../layout/List.svelte';
-import { fade } from 'svelte/transition';
-export let title;
-export let css = {};
-export let target = '';
-export let isOpen = false;
-export let fixedSize = 'md';
-// Add size mapping with custom pixel values
-const sizeStyles = {
-    xs: { width: '400px', height: '250px' },
-    sm: { width: '600px', height: '400px' },
-    md: { width: '800px', height: '500px' },
-    lg: { width: '1400px', height: '720px' },
-    xl: { width: '1600px', height: '800px' },
-    xxl: { width: '1600px', height: '1000px' }
-};
-export function close() {
-    isOpen = false;
-}
-export function open() {
-    isOpen = true;
-}
-function handleKeyDown(event) {
-    if (event.key === 'Escape') {
-        event.preventDefault();
-        event.stopPropagation();
-        close();
-    }
-}
-function fadeFast(node) {
-    return fade(node, { duration: 200 });
-}
-</script>
-
-<svelte:window on:keydown={handleKeyDown} />
-
-{#if isOpen}
-	<Portal name="always-mounted" {target}>
-		<div
-			class={'fixed top-0 bottom-0 left-0 right-0 transition-all overflow-auto z-[1100] bg-black bg-opacity-60 w-full h-full'}
-			transition:fadeFast|local
-		>
-			<div class="flex min-h-full items-center justify-center p-8">
-				<div
-					style={`width: ${sizeStyles[fixedSize].width}; height: ${sizeStyles[fixedSize].height}; ${
-						css?.popup?.style || ''
-					}`}
-					class={twMerge(
-						'max-h-screen-80 max-w-screen-80 rounded-lg relative bg-surface pt-2 px-4 pb-4',
-						css?.popup?.class,
-						'wm-modal-form-popup'
-					)}
-					use:clickOutside
-					on:click_outside={() => {
-						close()
-					}}
-				>
-					<List gap="md">
-						<div class="flex w-full">
-							<List horizontal justify="between">
-								<h3>{title}</h3>
-								<div class="grow w-min-0">
-									<List horizontal justify="between">
-										<div class="min-w-0 grow">
-											<slot name="header-left" />
-										</div>
-										<div class="min-w-0 grow-0 justify-end">
-											<List horizontal justify="end">
-												<slot name="header-right" />
-												<div class="w-8">
-													<button
-														on:click={() => {
-															isOpen = false
-														}}
-														class="hover:bg-surface-hover rounded-full w-8 h-8 flex items-center justify-center transition-all"
-													>
-														<X class="text-tertiary " />
-													</button>
-												</div>
-											</List>
-										</div>
-									</List>
-								</div>
-							</List>
-						</div>
-
-						<!-- svelte-ignore a11y-click-events-have-key-events -->
-						<!-- svelte-ignore a11y-no-static-element-interactions -->
-						<div class="w-full flex grow min-h-0" on:click|stopPropagation={() => {}}>
-							<slot />
-						</div>
-					</List>
-				</div>
-			</div>
-		</div>
-	</Portal>
-{/if}

package/package/components/common/modal/Modal2.svelte.d.ts

@@ -1,28 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        title: string;
-        css?: any;
-        target?: string | undefined;
-        isOpen?: boolean | undefined;
-        fixedSize?: "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | undefined;
-        close?: (() => void) | undefined;
-        open?: (() => void) | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        'header-left': {};
-        'header-right': {};
-        default: {};
-    };
-};
-export type Modal2Props = typeof __propDef.props;
-export type Modal2Events = typeof __propDef.events;
-export type Modal2Slots = typeof __propDef.slots;
-export default class Modal2 extends SvelteComponent<Modal2Props, Modal2Events, Modal2Slots> {
-    get close(): () => void;
-    get open(): () => void;
-}
-export {};

package/package/components/common/popup/Popup.svelte

@@ -1,66 +0,0 @@
-<script>import { Popover, PopoverButton, PopoverPanel, Transition } from '@rgossiaux/svelte-headlessui';
-import ConditionalPortal from '../drawer/ConditionalPortal.svelte';
-import { createFloatingActions } from 'svelte-floating-ui';
-export let floatingConfig = {
-    strategy: 'absolute',
-    placement: 'bottom-start'
-};
-export let containerClasses = 'rounded-lg shadow-md border p-4 bg-surface';
-export let floatingClasses = '';
-const [floatingRef, floatingContent] = createFloatingActions(floatingConfig);
-export let blockOpen = false;
-export let shouldUsePortal = true;
-export let target = undefined;
-export let noTransition = false;
-export let popupHover = false;
-export let preventPopupClosingOnClickInside = false;
-export let disabled = false;
-</script>
-
-<Popover on:close class="leading-none">
-	<PopoverButton let:open {disabled}>
-		<div use:floatingRef>
-			<slot name="button" {open} />
-		</div>
-	</PopoverButton>
-	<ConditionalPortal condition={shouldUsePortal} {target}>
-		<!-- svelte-ignore a11y-no-static-element-interactions -->
-		<!-- svelte-ignore a11y-mouse-events-have-key-events -->
-		<!-- svelte-ignore a11y-click-events-have-key-events -->
-		<div
-			use:floatingContent
-			class={`z5000 ${floatingClasses}`}
-			on:mouseenter={() => {
-				popupHover = true
-			}}
-			on:mouseleave={() => {
-				popupHover = false
-			}}
-			on:click={(e) => preventPopupClosingOnClickInside && e.stopPropagation()}
-		>
-			{#if !noTransition}
-				<Transition
-					show={blockOpen || undefined}
-					enter="transition ease-out duration-200"
-					enterFrom="opacity-0 translate-y-1"
-					enterTo="opacity-100 translate-y-0"
-					leave="transition ease-in duration-150"
-					leaveFrom="opacity-100 translate-y-0"
-					leaveTo="opacity-0 translate-y-1"
-				>
-					<PopoverPanel let:close static={blockOpen}>
-						<div class={containerClasses}>
-							<slot {close} />
-						</div>
-					</PopoverPanel>
-				</Transition>
-			{:else}
-				<PopoverPanel focus={false} let:close static={blockOpen}>
-					<div class={containerClasses}>
-						<slot {close} />
-					</div>
-				</PopoverPanel>
-			{/if}
-		</div>
-	</ConditionalPortal>
-</Popover>

package/package/components/common/popup/Popup.svelte.d.ts

@@ -1,35 +0,0 @@
-import { SvelteComponent } from "svelte";
-import { type ComputeConfig } from 'svelte-floating-ui';
-declare const __propDef: {
-    props: {
-        floatingConfig?: ComputeConfig | undefined;
-        containerClasses?: string | undefined;
-        floatingClasses?: string | undefined;
-        blockOpen?: boolean | undefined;
-        shouldUsePortal?: boolean | undefined;
-        target?: string | HTMLElement | undefined;
-        noTransition?: boolean | undefined;
-        popupHover?: boolean | undefined;
-        preventPopupClosingOnClickInside?: boolean | undefined;
-        disabled?: boolean | undefined;
-    };
-    events: {
-        close: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        button: {
-            open: boolean;
-        };
-        default: {
-            close: (focusableElement: HTMLElement | null) => void;
-        };
-    };
-};
-export type PopupProps = typeof __propDef.props;
-export type PopupEvents = typeof __propDef.events;
-export type PopupSlots = typeof __propDef.slots;
-export default class Popup extends SvelteComponent<PopupProps, PopupEvents, PopupSlots> {
-}
-export {};

package/package/components/common/popup/PopupV2.svelte

@@ -1,58 +0,0 @@
-<script>import Portal from '../../Portal.svelte';
-import { clickOutside } from '../../../utils';
-import { createFloatingActions } from 'svelte-floating-ui';
-export let floatingConfig = {
-    strategy: 'absolute',
-    //@ts-ignore
-    placement: 'bottom-center'
-};
-export let open = false;
-export let target = undefined;
-// export let containerClasses: string = 'rounded-lg shadow-md border p-4 bg-surface'
-// export let floatingClasses: string = ''
-const [floatingRef, floatingContent] = createFloatingActions(floatingConfig);
-function close(div) {
-    open = false;
-}
-let acceptClickoutside = false;
-function pointerup() {
-    setTimeout(() => {
-        acceptClickoutside = true;
-    }, 100);
-}
-function pointerdown() {
-    if (acceptClickoutside && open) {
-        open = false;
-    }
-    else {
-        acceptClickoutside = false;
-        open = true;
-    }
-}
-</script>
-
-<div use:floatingRef>
-	<slot {pointerup} {pointerdown} name="button" />
-</div>
-
-<Portal name="popup-v2" {target}>
-	{#if open}
-		<div
-			class="border rounded-lg shadow-lg bg-surface z5000"
-			style="position:absolute"
-			use:floatingContent
-		>
-			<div
-				use:clickOutside
-				on:click_outside={() => {
-					if (acceptClickoutside) {
-						acceptClickoutside = false
-						open = false
-					}
-				}}
-			>
-				<slot {close} />
-			</div>
-		</div>
-	{/if}
-</Portal>