sv5ui 2.0.0 → 2.2.0

package/dist/Tooltip/Tooltip.svelte

@@ -1,151 +0,0 @@
-<script lang="ts" module>
-    import type { TooltipProps } from './tooltip.types.js'
-
-    export type Props = TooltipProps
-</script>
-
-<script lang="ts">
-    import { Tooltip } from 'bits-ui'
-    import { tooltipVariants, tooltipDefaults } from './tooltip.variants.js'
-    import { getComponentConfig } from '../config.js'
-    import Kbd from '../Kbd/Kbd.svelte'
-
-    const config = getComponentConfig('tooltip', tooltipDefaults)
-
-    let {
-        ref = $bindable(null),
-        open = $bindable(false),
-        onOpenChange,
-        delayDuration,
-        disableHoverableContent,
-        disableCloseOnTriggerClick,
-        ignoreNonKeyboardFocus,
-        disabled = false,
-        side = 'bottom',
-        sideOffset = 8,
-        align = 'center',
-        alignOffset = 0,
-        avoidCollisions = true,
-        collisionBoundary,
-        collisionPadding = 8,
-        sticky = 'partial',
-        hideWhenDetached = false,
-        onEscapeKeydown,
-        forceMount,
-        text,
-        kbds,
-        arrow = false,
-        transition = config.defaultVariants.transition ?? true,
-        portal = true,
-        ui,
-        class: className,
-        children,
-        content: contentSlot,
-        ...restProps
-    }: Props = $props()
-
-    // Pre-compute booleans
-    const hasText = $derived(!!text)
-    const hasKbds = $derived(!!kbds?.length)
-    const hasContent = $derived(hasText || hasKbds || !!contentSlot)
-
-    // Compute variant classes
-    const variantSlots = $derived(tooltipVariants({ transition }))
-    const kbdsSize = (config.slots.kbdsSize ?? 'sm') as 'sm' | 'md' | 'lg'
-    const classes = $derived({
-        content: variantSlots.content({ class: [config.slots.content, ui?.content] }),
-        arrow: variantSlots.arrow({ class: [config.slots.arrow, ui?.arrow] }),
-        text: variantSlots.text({ class: [config.slots.text, ui?.text] }),
-        kbds: variantSlots.kbds({ class: [config.slots.kbds, ui?.kbds] })
-    })
-
-    // Arrow props
-    const arrowProps = $derived.by(() => {
-        if (typeof arrow === 'object') {
-            return { width: 12, height: 6, ...arrow }
-        }
-        return { width: 12, height: 6 }
-    })
-</script>
-
-{#snippet tooltipContent()}
-    {#if contentSlot}
-        {@render contentSlot()}
-    {:else}
-        {#if hasText}
-            <span class={classes.text}>{text}</span>
-        {/if}
-
-        {#if hasKbds}
-            <span class={classes.kbds}>
-                {#each kbds as kbd, index (index)}
-                    {#if index > 0}
-                        <span class="mx-0.5 text-inverse-on-surface/60">·</span>
-                    {/if}
-                    {#if typeof kbd === 'string'}
-                        <Kbd value={kbd} size={kbdsSize} variant="soft" color="surface" />
-                    {:else}
-                        <Kbd size={kbdsSize} variant="soft" color="surface" {...kbd} />
-                    {/if}
-                {/each}
-            </span>
-        {/if}
-    {/if}
-{/snippet}
-
-{#snippet tooltipContentEl()}
-    <Tooltip.Content
-        bind:ref
-        {side}
-        {sideOffset}
-        {align}
-        {alignOffset}
-        {avoidCollisions}
-        {collisionBoundary}
-        {collisionPadding}
-        {sticky}
-        {hideWhenDetached}
-        {onEscapeKeydown}
-        {forceMount}
-        class={classes.content}
-        {...restProps}
-    >
-        {@render tooltipContent()}
-
-        {#if arrow}
-            <Tooltip.Arrow
-                width={arrowProps.width}
-                height={arrowProps.height}
-                class={classes.arrow}
-            />
-        {/if}
-    </Tooltip.Content>
-{/snippet}
-
-<Tooltip.Provider {delayDuration} {disableHoverableContent}>
-    <Tooltip.Root
-        bind:open
-        {onOpenChange}
-        {disableCloseOnTriggerClick}
-        {ignoreNonKeyboardFocus}
-        disabled={disabled || !hasContent}
-    >
-        {#if children}
-            <Tooltip.Trigger>
-                {#snippet child({ props })}
-                    <span {...props} class={className as string}>
-                        {@render children({ open })}
-                    </span>
-                {/snippet}
-            </Tooltip.Trigger>
-        {/if}
-
-        {#if portal}
-            <Tooltip.Portal>
-                {@render tooltipContentEl()}
-            </Tooltip.Portal>
-        {:else}
-            {@render tooltipContentEl()}
-        {/if}
-    </Tooltip.Root>
-</Tooltip.Provider>

package/dist/Tooltip/TooltipTestWrapper.svelte

@@ -1,8 +0,0 @@
-<script lang="ts">
-    import Tooltip from './Tooltip.svelte'
-    import type { TooltipProps } from './tooltip.types.js'
-
-    let props: TooltipProps = $props()
-</script>
-
-<Tooltip {...props} />

package/dist/User/User.svelte

@@ -1,98 +0,0 @@
-<script lang="ts" module>
-    import type { UserProps } from './user.types.js'
-
-    export type Props = UserProps
-</script>
-
-<script lang="ts">
-    import { userVariants, userDefaults } from './user.variants.js'
-    import { getComponentConfig } from '../config.js'
-    import Avatar from '../Avatar/Avatar.svelte'
-    import Chip from '../Chip/Chip.svelte'
-    import Link from '../Link/Link.svelte'
-
-    const config = getComponentConfig('user', userDefaults)
-
-    let {
-        ref = $bindable(null),
-        as = 'div',
-        ui,
-        name,
-        description,
-        avatar,
-        chip,
-        size = config.defaultVariants.size,
-        orientation = config.defaultVariants.orientation,
-        href,
-        class: className,
-        avatarSlot,
-        nameSlot,
-        descriptionSlot,
-        ...restProps
-    }: Props = $props()
-
-    const isClickable = $derived(!!href || !!restProps.onclick)
-
-    const classes = $derived.by(() => {
-        const slots = userVariants({ size, orientation, clickable: isClickable })
-        return {
-            root: slots.root({ class: [config.slots.root, className, ui?.root] }),
-            wrapper: slots.wrapper({ class: [config.slots.wrapper, ui?.wrapper] }),
-            name: slots.name({ class: [config.slots.name, ui?.name] }),
-            description: slots.description({ class: [config.slots.description, ui?.description] }),
-            avatar: slots.avatar({ class: [config.slots.avatar, ui?.avatar] })
-        }
-    })
-
-    const mergedAvatarProps = $derived(
-        avatar ? { alt: name, size: size as typeof avatar.size, ...avatar } : undefined
-    )
-
-    const chipProps = $derived(chip && avatar ? (chip === true ? {} : chip) : null)
-</script>
-
-{#snippet userContent()}
-    {#if avatarSlot}
-        {@render avatarSlot()}
-    {:else if mergedAvatarProps}
-        {#if chipProps}
-            <Chip {size} inset {...chipProps}>
-                <Avatar {...mergedAvatarProps} class={classes.avatar} />
-            </Chip>
-        {:else}
-            <Avatar {...mergedAvatarProps} class={classes.avatar} />
-        {/if}
-    {/if}
-
-    {#if name || description || nameSlot || descriptionSlot}
-        <div class={classes.wrapper}>
-            {#if nameSlot}
-                {@render nameSlot()}
-            {:else if name}
-                <p class={classes.name}>{name}</p>
-            {/if}
-
-            {#if descriptionSlot}
-                {@render descriptionSlot()}
-            {:else if description}
-                <p class={classes.description}>{description}</p>
-            {/if}
-        </div>
-    {/if}
-{/snippet}
-
-{#if href}
-    <Link bind:ref {href} raw class={classes.root} data-orientation={orientation} {...restProps}>
-        {@render userContent()}
-    </Link>
-{:else}
-    <svelte:element
-        this={as}
-        bind:this={ref}
-        class={classes.root}
-        data-orientation={orientation}
-        {...restProps}
-    >
-        {@render userContent()}
-    </svelte:element>
-{/if}

package/dist/hooks/HookContextProbe.svelte

@@ -1,7 +0,0 @@
-<script lang="ts">
-    import { useFormField } from './useFormField.svelte.js'
-
-    const ctx = useFormField()
-</script>
-
-<div data-name={ctx?.name ?? 'none'} data-has={String(!!ctx)}>probe</div>

package/dist/hooks/HookContextProvider.svelte

@@ -1,9 +0,0 @@
-<script lang="ts">
-    import { setContext } from 'svelte'
-    import { FORM_FIELD_CONTEXT_KEY } from './useFormField.svelte.js'
-    import HookContextProbe from './HookContextProbe.svelte'
-
-    setContext(FORM_FIELD_CONTEXT_KEY, { name: 'email', size: 'md', ariaId: 'ff' })
-</script>
-
-<HookContextProbe />

package/dist/hooks/HookEmitProbe.svelte

@@ -1,14 +0,0 @@
-<script lang="ts">
-    import { useFormFieldEmit } from './useFormField.svelte.js'
-
-    const emit = useFormFieldEmit()
-
-    function fireAll() {
-        emit.onBlur()
-        emit.onFocus()
-        emit.onChange()
-        emit.onInput()
-    }
-</script>
-
-<button data-testid="fire" onclick={fireAll}>fire</button>