vira 28.19.4 → 28.19.6

package/dist/elements/vira-overflow-switch.element.js

@@ -1,110 +0,0 @@
-import { css, html, onDomCreated } from 'element-vir';
-import { listenTo } from 'typed-event-target';
-import { defineViraElement } from './define-vira-element.js';
-/**
- * An element switches between two slots based on their overflow.
- *
- * @category Elements
- * @see https://electrovir.github.io/vira/book/elements/vira-overflow-switch
- */
-export const ViraOverflowSwitch = defineViraElement()({
-    tagName: 'vira-overflow-switch',
-    slotNames: [
-        /** The child to render, if it fits. */
-        'large',
-        /** The child to render if the large one does not fit. */
-        'small',
-    ],
-    state() {
-        return {
-            isOverflowing: false,
-            resizeObserver: undefined,
-            /** Called on cleanup to clear all listeners. */
-            cleanup: undefined,
-        };
-    },
-    hostClasses: {
-        'vira-overflow-switch-show-small': ({ state, inputs }) => state.isOverflowing || !!inputs.useSmall,
-    },
-    styles: ({ hostClasses }) => css `
-        :host {
-            display: inline-block;
-            max-width: 100%;
-        }
-
-        .large,
-        .small {
-            display: inline-block;
-        }
-
-        .small {
-            display: none;
-        }
-
-        /**
-         * When the large content overflows, hide it but keep it in layout so we can measure it.
-         * The small content is then shown instead.
-         */
-        ${hostClasses['vira-overflow-switch-show-small'].selector} .large {
-            visibility: hidden;
-            position: absolute;
-            top: 0;
-            left: 0;
-        }
-
-        ${hostClasses['vira-overflow-switch-show-small'].selector} .small {
-            display: inline-block;
-        }
-    `,
-    cleanup({ state, updateState }) {
-        state.cleanup?.();
-        updateState({
-            cleanup: undefined,
-        });
-    },
-    render({ slotNames, updateState, inputs, host, state }) {
-        return html `
-            <div
-                class="large"
-                ${onDomCreated((largeElement) => {
-            if (!inputs.automaticallySwitch) {
-                return;
-            }
-            const overflowParams = {
-                elementToTest: largeElement,
-                host,
-                updateState,
-            };
-            const resizeObserver = new ResizeObserver(() => {
-                updateOverflowing(overflowParams);
-            });
-            resizeObserver.observe(host);
-            /**
-             * Also observe the large slot wrapper itself in case its own layout changes
-             * without host resizing.
-             */
-            resizeObserver.observe(largeElement);
-            const removeSlotChangeListener = listenTo(largeElement, 'slotchange', () => {
-                updateOverflowing(overflowParams);
-            });
-            /** Initial measurement: defer until after first layout. */
-            updateOverflowing(overflowParams);
-            state.cleanup?.();
-            updateState({
-                cleanup() {
-                    resizeObserver.disconnect();
-                    removeSlotChangeListener();
-                },
-            });
-        })}
-            >
-                <slot name=${slotNames.large}></slot>
-            </div>
-            <div class="small"><slot name=${slotNames.small}></slot></div>
-        `;
-    },
-});
-function updateOverflowing({ elementToTest, host, updateState, }) {
-    const isOverflowing = elementToTest.scrollWidth > host.clientWidth;
-    updateState({ isOverflowing });
-}

package/dist/elements/vira-progress.element.d.ts

@@ -1,18 +0,0 @@
-import { type PartialWithUndefined } from '@augment-vir/common';
-/**
- * A [`<progress>`](https://developer.mozilla.org/docs/Web/HTML/Reference/Elements/progress)
- * alternative that supports custom styling in _all_ browsers via CSS vars _and_ prevents background
- * bleed.
- *
- * @category Progress
- * @category Elements
- * @see https://electrovir.github.io/vira/book/elements/vira-progress
- */
-export declare const ViraProgress: import("element-vir").DeclarativeElementDefinition<"vira-progress", Readonly<{
-    value: number;
-} & PartialWithUndefined<{
-    /** @default 0 */
-    min: number;
-    /** @default 100 */
-    max: number;
-}>>, {}, {}, "vira-progress-", "vira-progress-border-radius" | "vira-progress-background-color" | "vira-progress-foreground-color", readonly [], readonly []>;

package/dist/elements/vira-select.element.d.ts

@@ -1,48 +0,0 @@
-import { type PartialWithUndefined } from '@augment-vir/common';
-import { type AttributeValues } from 'element-vir';
-import { type ViraIconSvg } from '../icons/index.js';
-/**
- * Options for {@link ViraSelect}.
- *
- * @category Dropdown
- * @category Elements
- * @see https://electrovir.github.io/vira/book/elements/vira-select
- */
-export type ViraSelectOption = {
-    /** A value or id, used to keep track of which option is selected. */
-    value: string;
-    label: string;
-} & PartialWithUndefined<{
-    disabled: boolean;
-}>;
-/**
- * Similar to {@link ViraDropdown} but is, instead, simply a wrapper for `<select>` and nothing more.
- *
- * @category Dropdown
- * @category Elements
- * @see https://electrovir.github.io/vira/book/elements/vira-select
- */
-export declare const ViraSelect: import("element-vir").DeclarativeElementDefinition<"vira-select", Readonly<{
-    options: ReadonlyArray<Readonly<ViraSelectOption>>;
-    /** The currently selected option value. */
-    value: undefined | string;
-} & PartialWithUndefined<{
-    icon: Readonly<ViraIconSvg>;
-    placeholder: string;
-    label: string;
-    disabled: boolean;
-    attributePassthrough: Readonly<PartialWithUndefined<{
-        label: AttributeValues;
-        select: AttributeValues;
-        option: AttributeValues;
-    }>>;
-    hasError: boolean;
-}>>, {
-    /**
-     * Used to couple the label and select together. This is not applied if no label is
-     * provided.
-     */
-    randomId: string;
-}, {
-    valueChange: import("element-vir").DefineEvent<string>;
-}, "vira-select-disabled" | "vira-select-error", "vira-select-padding-horizontal" | "vira-select-padding-vertical" | "vira-select-icon-padding", readonly [], readonly []>;

package/dist/icons/icon-color.test-helper.d.ts

@@ -1,6 +0,0 @@
-export declare enum ColorType {
-    Color = "color",
-    Fill = "fill",
-    Stroke = "stroke"
-}
-export declare function extractIconColor(element: Element, colorType: ColorType): string;

package/dist/icons/icon-color.test-helper.js

@@ -1,9 +0,0 @@
-export var ColorType;
-(function (ColorType) {
-    ColorType["Color"] = "color";
-    ColorType["Fill"] = "fill";
-    ColorType["Stroke"] = "stroke";
-})(ColorType || (ColorType = {}));
-export function extractIconColor(element, colorType) {
-    return window.getComputedStyle(element).getPropertyValue(colorType);
-}

package/dist/icons/icon-css-vars.d.ts

@@ -1,14 +0,0 @@
-/**
- * CSS vars that are supported by all Vira SVG icons.
- *
- * @category Icon
- * @category CSS Vars
- * @category Styles
- */
-export declare const viraIconCssVars: import("lit-css-vars").CssVarDefinitions<{
-    /** To be used for coloring an icon's stroke. */
-    readonly 'vira-icon-stroke-color': "currentColor";
-    /** To be used for coloring an icon's fill. */
-    readonly 'vira-icon-fill-color': "none";
-    readonly 'vira-icon-stroke-width': "1.5px";
-}>;

package/dist/icons/icon-svg.d.ts

@@ -1,27 +0,0 @@
-import { type TemplateResult } from 'element-vir';
-import { viraIconCssVars } from './icon-css-vars.js';
-/**
- * An individual Vira icon SVG definition.
- *
- * @category Icon
- */
-export type ViraIconSvg = {
-    name: string;
-    svgTemplate: TemplateResult;
-};
-/**
- * A function used to define an individual Vira icon SVG.
- *
- * @category Icon
- */
-export declare function defineIcon({ name, svgTemplate, }: {
-    name: string;
-    svgTemplate: TemplateResult;
-}): ViraIconSvg;
-/**
- * Wraps an existing icon with a specific color and outputs another icon that can be used anywhere
- * the original icon can be used.
- *
- * @category Icon
- */
-export declare function createColoredIcon(icon: ViraIconSvg, colors: Partial<Record<keyof typeof viraIconCssVars, string>>): ViraIconSvg;

package/dist/icons/icon-svg.js

@@ -1,48 +0,0 @@
-import { getObjectTypedKeys, stringify } from '@augment-vir/common';
-import Color from 'colorjs.io';
-import { html } from 'element-vir';
-import { viraIconCssVars } from './icon-css-vars.js';
-/**
- * A function used to define an individual Vira icon SVG.
- *
- * @category Icon
- */
-export function defineIcon({ name, svgTemplate, }) {
-    const iconSvg = {
-        name,
-        svgTemplate,
-    };
-    return iconSvg;
-}
-function getAssertedValidColor(input) {
-    try {
-        if (!input) {
-            throw new Error('invalid empty color');
-        }
-        return new Color(input);
-    }
-    catch {
-        throw new Error(`Invalid color: ${stringify(input)}`);
-    }
-}
-/**
- * Wraps an existing icon with a specific color and outputs another icon that can be used anywhere
- * the original icon can be used.
- *
- * @category Icon
- */
-export function createColoredIcon(icon, colors) {
-    const colorStyles = getObjectTypedKeys(colors)
-        .map((cssVarName) => {
-        const colorValue = colors[cssVarName];
-        const color = getAssertedValidColor(colorValue);
-        return `${viraIconCssVars[cssVarName].name}: ${color.toString()};`;
-    })
-        .join(' ');
-    return defineIcon({
-        name: icon.name,
-        svgTemplate: html `
-            <div style=${colorStyles}>${icon.svgTemplate}</div>
-        `,
-    });
-}

package/dist/icons/icon-svgs/bell-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A bell icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/bell24icon
- */
-export declare const Bell24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/chat-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A chat bubble icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/chat24icon
- */
-export declare const Chat24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/check-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A checkmark.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/check24icon
- */
-export declare const Check24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/chevron-down-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A chevron that points upwards. See ChevronUp24Icon or one pointing upwards.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/chevrondown24icon
- */
-export declare const ChevronDown24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/chevron-up-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A chevron that points upwards. See ChevronDown24Icon for one pointing downloads.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/chevronup24icon
- */
-export declare const ChevronUp24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/close-x-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An x icon meant to be used as a "close" button.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/closex24icon
- */
-export declare const CloseX24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/commit-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An icon that represents a single commit in git.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/commit24icon
- */
-export declare const Commit24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/copy-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An icon that represents copying something.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/copy24icon
- */
-export declare const Copy24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/document-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An icon that represents a single document file on a computer file system.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/document24icon
- */
-export declare const Document24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/document-search-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An icon that represents searching on a document or searching for a document.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/documentsearch24icon
- */
-export declare const DocumentSearch24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/double-chevron-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A icon with two opposing chevrons.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/doublechevron24icon
- */
-export declare const DoubleChevron24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/element-16.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An icon symbol that represents an HTML element.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/element16icon
- */
-export declare const Element16Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/element-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An icon symbol that represents an HTML element.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/element24icon
- */
-export declare const Element24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/external-link-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An external link icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/externallink24icon
- */
-export declare const ExternalLink24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/eye-closed-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A closed or disable eye icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/eyeclosed24icon
- */
-export declare const EyeClosed24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/eye-open-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An open eye icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/eyeopen24icon
- */
-export declare const EyeOpen24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/filter-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An icon symbol that represents filtering.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/filter24icon
- */
-export declare const Filter24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/link-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A link icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/link24icon
- */
-export declare const Link24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/loader-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A static loading icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/loader24icon
- */
-export declare const Loader24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/loader-animated-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A variation of {@link Loader24Icon} that spins on its own.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/loaderanimated24icon
- */
-export declare const LoaderAnimated24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/lock-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A lock icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/lock24icon
- */
-export declare const Lock24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/options-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An icon that represents configuration options.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/options24icon
- */
-export declare const Options24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/pencil-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A pencil icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/pencil24icon
- */
-export declare const Pencil24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/shield-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A shield icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/shield24icon
- */
-export declare const Shield24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/sort-ascending-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A icon indicating ascending sorting.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/sortascending24icon
- */
-export declare const SortAscending24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/sort-descending-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A icon indicating descending sorting.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/sortdescending24icon
- */
-export declare const SortDescending24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/speaker-loud-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A speaker icon at maximum volume.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/speakerloud24icon
- */
-export declare const SpeakerLoud24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/speaker-medium-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A speaker icon at medium volume.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/speakermedium24icon
- */
-export declare const SpeakerMedium24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/speaker-muted-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A speaker icon that is muted.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/speakermuted24icon
- */
-export declare const SpeakerMuted24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/speaker-quiet-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A speaker icon that is at minimum volume.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/speakerquiet24icon
- */
-export declare const SpeakerQuiet24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/star-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A star icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/star24icon
- */
-export declare const Star24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/status-failure-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A status icon with an x that indicates something failed (like a build pipeline).
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/statusfailure24icon
- */
-export declare const StatusFailure24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/status-in-progress-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A status icon that indicates that something is still in progress.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/statusinprogress24icon
- */
-export declare const StatusInProgress24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/status-success-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A status icon that indicates success.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/statussuccess24icon
- */
-export declare const StatusSuccess24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/status-unknown-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A status icon with a ? that indicates the status is unknown.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/statusunknown24icon
- */
-export declare const StatusUnknown24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/status-warning-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * A status icon that indicates a warning.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/statuswarning24icon
- */
-export declare const StatusWarning24Icon: import("../icon-svg.js").ViraIconSvg;

package/dist/icons/icon-svgs/upload-24.icon.d.ts

@@ -1,8 +0,0 @@
-/**
- * An upload icon.
- *
- * @category Icon
- * @category SVG
- * @see https://electrovir.github.io/vira/book/icons/upload24icon
- */
-export declare const Upload24Icon: import("../icon-svg.js").ViraIconSvg;