lutra 0.0.33 → 0.1.0

package/dist/display/Details.svelte.d.ts

@@ -1,27 +0,0 @@
-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;
-    z_$$bindings?: Bindings;
-}
-declare const Details: $$__sveltets_2_IsomorphicComponent<{
-    /** The summary of the element. Can be a string or a snippet. */
-    summary: string | Snippet;
-    /** Contain the element in a box. */
-    contained?: boolean;
-    /** Round the corners of the element if contained. */
-    rounded?: boolean;
-    /** Whether the details are open. */
-    open?: boolean;
-    /** The content of the element. */
-    children: Snippet;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type Details = InstanceType<typeof Details>;
-export default Details;

package/dist/display/Hero.svelte

@@ -1,50 +0,0 @@
-<script lang="ts">import { setContext } from "svelte";
-let {
-  children,
-  pad = true,
-  center = false,
-  fullWidth = false,
-  contained = false
-} = $props();
-</script>
-
-<section class="Hero" class:pad class:fullWidth class:center class:contained>
-    <main>
-        {@render children()}
-    </main>
-</section>
-
-<style>
-    .Hero {
-        background: var(--bg, var(--bg-subtle));
-        container-type: inline-size;
-        text-wrap: balance;
-    }
-    .Hero.contained main {
-        max-inline-size: var(--max-inline-size, 1560px);
-    }
-    /** Header areas where h1 is followed by h2 */
-    .Hero :global(h1:has(+ h2)) {
-        margin-block-end: 1rem;
-    }
-    .Hero :global(h1 + h2) {
-        color: var(--text-subtle);
-        margin-block-start: 0rem;
-    }
-    .Hero {
-        block-size: 100%;
-        margin-inline: 0;
-    }
-    .Hero.fullWidth {
-        inline-size: 100cqi;
-        margin-inline: calc(50% - 50cqi);
-        min-inline-size: 100%;
-    }
-    .Hero.center main {
-        margin-inline: auto;
-    }
-    .Hero.pad {
-        padding-block: var(--padding, var(--padding-block, 4rem));
-        padding-inline: var(--padding, var(--padding-inline, 4rem));
-    }
-</style>

package/dist/display/Hero.svelte.d.ts

@@ -1,26 +0,0 @@
-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;
-    z_$$bindings?: Bindings;
-}
-declare const Hero: $$__sveltets_2_IsomorphicComponent<{
-    children: Snippet;
-    /** Add padding to the container. Pass in either a boolean or an array of booleans to specify padding on the block and inline axes. */
-    pad?: boolean | [boolean, boolean] | [boolean, boolean, boolean] | [boolean, boolean, boolean, boolean] | string | [string, string] | [string, string, string] | [string, string, string, string];
-    /** Center the content. */
-    center?: boolean;
-    /** Make the hero full width to the container (nearest element with `container-type: inline-size;`) */
-    fullWidth?: boolean;
-    /** Contain the hero to the container (nearest element with `container-type: inline-size;`) */
-    contained?: boolean;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type Hero = InstanceType<typeof Hero>;
-export default Hero;

package/dist/display/Icon.svelte

@@ -1,39 +0,0 @@
-<script lang="ts">import { isComponent, isSnippet } from "../utils/isSnippet.js";
-let {
-  icon,
-  alt
-} = $props();
-let Icon = icon;
-</script>
-
-<span class="Icon" aria-label="icon">
-    {#if typeof icon === "string"}
-        <img src={icon} alt={alt ? alt : 'Icon'} width="100%" height="100%" />
-    {:else}
-        <Icon />
-    {/if}
-</span>
-
-<style>
-    .Icon {
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 1em;
-        line-height: inherit;
-        width: max(
-            var(--icon-width,
-                var(--icon-height, 1rem)
-            ), 16px);
-        height: max(var(--icon-height, auto), 16px);
-        overflow: clip;
-        vertical-align: var(--vertical-align, text-bottom);
-        cursor: var(--cursor, default);
-    }
-    img,
-    .Icon :global(svg) {
-        width: 100%;
-        height: auto;
-        display: block;
-    }
-</style>

package/dist/display/Icon.svelte.d.ts

@@ -1,19 +0,0 @@
-import type { Component } 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;
-    z_$$bindings?: Bindings;
-}
-declare const Icon: $$__sveltets_2_IsomorphicComponent<{
-    icon: string | Component;
-    alt?: string;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type Icon = InstanceType<typeof Icon>;
-export default Icon;

package/dist/display/IconButton.svelte

@@ -1,91 +0,0 @@
-<script lang="ts">import Icon from "./Icon.svelte";
-import { fly } from "svelte/transition";
-import { popBezier, popBezierInverse } from "../utils/transitions.js";
-let {
-  icon,
-  disabled,
-  children,
-  onclick,
-  mask = true
-} = $props();
-</script>
-
-{#snippet inside()}
-    <span class="IconMask" class:mask>
-        {#key icon}
-            <span class="IconContent" in:fly={{ duration: 250, y: -32, easing: popBezier }} out:fly={{ duration: 250, y: 32, easing: popBezierInverse }}>
-                <Icon {icon} --cursor="pointer" />
-                {#if children}
-                    <span class="Text">
-                        {@render children()}
-                    </span>
-                {/if}
-            </span>
-        {/key}
-    </span>
-{/snippet}
-
-{#if onclick}
-    <button type="button" {disabled} class="IconButton" {onclick}>
-        {@render inside()}
-    </button>
-{:else}
-    <span class="IconButton">
-        {@render inside()}
-    </span>
-{/if}
-
-<style>
-    .IconButton {
-        display: inline-flex;
-        align-items: stretch;
-        color: inherit;
-        opacity: 1;
-        background-color: var(--field-bg);
-        transition: background-color 0.04s;
-        border-radius: var(--field-radius);
-    }
-    .IconButton:hover {
-        background-color: var(--menu-bg-hover);
-    }
-    .IconButton:active {
-        scale: 1;
-    }
-    button.IconButton {
-        border: none;
-        background: none;
-        cursor: pointer;
-        color: var(--text);
-    }
-    .IconMask {
-        height: 100%;
-        padding-inline: calc(var(--padding, 0.75em) * 0.8);
-        padding-block: calc(var(--padding, 0.75em) * 0.8);
-        display: inline-grid;
-        gap: 0.5rem;
-        grid-template: "icon";
-        align-items: center;
-    }
-    .IconMask.mask {
-        -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 35%, rgba(0, 0, 0, 1) 65%, rgba(0, 0, 0, 0));
-        mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 35%, rgba(0, 0, 0, 1) 65%, rgba(0, 0, 0, 0));
-    }
-    .IconContent {
-        grid-area: icon;
-        display: inline-flex;
-        gap: 0.5rem;
-        align-items: center;
-    }
-    @media(max-width: 960px) {
-        .IconMask {
-            padding-inline: calc(var(--padding, 0.75em) * 0.75);
-            padding-block: calc(var(--padding, 0.75em) * 0.75);
-        }
-    }
-    @media(max-width: 320px) {
-        .IconMask {
-            padding-inline: calc(var(--padding, 0.75em) * 0.6);
-            padding-block: calc(var(--padding, 0.75em) * 0.6);
-        }
-    }
-</style>

package/dist/display/IconButton.svelte.d.ts

@@ -1,27 +0,0 @@
-import type { Component, 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;
-    z_$$bindings?: Bindings;
-}
-declare const IconButton: $$__sveltets_2_IsomorphicComponent<{
-    /** The icon to display. */
-    icon: string | Component;
-    /** The children to display. */
-    children?: Snippet;
-    /** The onclick event. */
-    onclick?: (event: MouseEvent) => void;
-    /** Whether the button is disabled. */
-    disabled?: boolean;
-    /** Whether to mask the content. */
-    mask?: boolean;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type IconButton = InstanceType<typeof IconButton>;
-export default IconButton;

package/dist/display/Image.svelte

@@ -1,91 +0,0 @@
-<script lang="ts">import { decode } from "blurhash";
-import { fade } from "svelte/transition";
-let {
-  hash,
-  width,
-  height,
-  aspectRatio,
-  fit,
-  src,
-  srcset,
-  alt,
-  style,
-  class: className
-} = $props();
-let canvas = $state(null);
-let el = $state(null);
-let elWidth = $state(32);
-let elHeight = $state(32);
-if (!src && srcset) {
-  const [src1] = srcset.split(", ");
-  src = src1.split(" ")[0];
-}
-if (!style) {
-  style = `aspect-ratio: ${aspectRatio};`;
-} else {
-  style += ` aspect-ratio: ${aspectRatio};`;
-}
-let decoded = $state(false);
-let loaded = $state(false);
-const onload = () => {
-  loaded = true;
-};
-$effect(() => {
-  if (hash) {
-    setTimeout(() => {
-      const pixels = decode(hash, elWidth, elHeight);
-      const ctx = canvas.getContext("2d");
-      const imageData = ctx.createImageData(elWidth, elHeight);
-      imageData.data.set(pixels);
-      ctx.putImageData(imageData, 0, 0);
-      decoded = true;
-    }, 0);
-  }
-});
-</script>
-
-<div class="BlurHashImage" class:loaded>
-    <img
-        bind:this={el}
-        bind:clientWidth={elWidth}
-        bind:clientHeight={elHeight}
-        onload={onload}
-        src={src}
-        srcset={srcset}
-        alt={alt}
-        width={width}
-        height={height}
-        style={style}
-        class="{className} {fit}"
-    />
-    {#if !loaded && hash}
-        <canvas class:decoded out:fade={{ duration: 100 }} width={elWidth} height={elHeight} bind:this={canvas}></canvas>
-    {/if}
-</div>
-
-<style>
-    .BlurHashImage {
-        position: relative;
-        display: grid;
-        grid-template-areas: "img";
-    }
-    canvas {
-        z-index: 2;
-        opacity: 0;
-        width: 100%;
-        grid-area: img;
-        transition: opacity 200ms;
-    }
-    canvas.decoded {
-        opacity: 1;
-    }
-    img {
-        z-index: 1;
-        grid-area: img;
-        display: inline-block;
-        vertical-align: middle;
-    }
-    img.cover { object-fit: cover; }
-    img.contain { object-fit: contain; }
-    img.scale-down { object-fit: scale-down; }
-</style>

package/dist/display/Image.svelte.d.ts

@@ -1,26 +0,0 @@
-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;
-    z_$$bindings?: Bindings;
-}
-declare const Image: $$__sveltets_2_IsomorphicComponent<{
-    hash?: string;
-    aspectRatio?: string;
-    fit?: "cover" | "contain" | "scale-down";
-    src?: string;
-    srcset?: string;
-    alt?: string;
-    width?: string | number;
-    height?: string | number;
-    style?: string;
-    class?: string;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "">;
-type Image = InstanceType<typeof Image>;
-export default Image;