vira 33.7.0 → 33.9.0

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

@@ -29,6 +29,12 @@ export type ViraCheckboxInputs = {
     fillWhenChecked: boolean;
     /** The checkbox will be filled with a form error color when it is unchecked. */
     fillWhenUnchecked: boolean;
+    /**
+     * Renders the checkbox in its checked colors with a dash instead of a check mark, and sets
+     * `aria-checked` to `mixed`. Takes precedence over `value` for rendering only: clicking still
+     * dispatches the negation of `value`.
+     */
+    isIndeterminate: boolean;
 }>;
 /**
  * A custom checkbox.

package/dist/elements/vira-checkbox.element.js

@@ -170,6 +170,7 @@ export const ViraCheckbox = defineViraElement()({
             }
         }
         const hasLabel = !!inputs.label || state.hasSlottedLabel;
+        const isIndeterminate = !!inputs.isIndeterminate;
         const labelTemplate = html `
             <span
                 class="label-text ${classMap({
@@ -203,13 +204,13 @@ export const ViraCheckbox = defineViraElement()({
                 ${labelTemplate}
                 <span
                     class="custom-checkbox ${classMap({
-            checked: inputs.value,
+            checked: inputs.value || isIndeterminate,
             disabled: !!inputs.isDisabled,
             error: !!inputs.hasError,
         })}"
                     role="checkbox"
                     aria-label=${ifDefined((check.isString(inputs.label) && inputs.label) || undefined)}
-                    aria-checked=${inputs.value ? 'true' : 'false'}
+                    aria-checked=${isIndeterminate ? 'mixed' : inputs.value ? 'true' : 'false'}
                     aria-disabled=${inputs.isDisabled ? 'true' : 'false'}
                     tabindex=${inputs.isDisabled ? '-1' : '0'}
                     ${attributes(inputs.attributePassthrough?.['custom-checkbox'])}
@@ -217,7 +218,9 @@ export const ViraCheckbox = defineViraElement()({
                     ${listenToActivate(updateValue)}
                 >
                     <${ViraIcon.assign({
-            icon: internalLucideIcons.Check16,
+            icon: isIndeterminate
+                ? internalLucideIcons.Minus16
+                : internalLucideIcons.Check16,
             fitContainer: true,
         })}
                         ${attributes(inputs.attributePassthrough?.[ViraIcon.tagName])}

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

@@ -52,6 +52,19 @@ export declare const ViraDropdown: import("element-vir").DeclarativeElementDefin
      * @default 24
      */
     menuHoverScrollSpeed: number;
+    /**
+     * When `isSearchable` is `true`, renders at most this many of the matching options (counted
+     * across groups, in their given order) followed by a hint row stating how many more exist.
+     * When omitted, all matching options are rendered.
+     */
+    maxShownOptions: number;
+    /**
+     * Creates the text of the hint row shown when `maxShownOptions` hides some matching
+     * options.
+     *
+     * @default hiddenCount => `+${hiddenCount}, type to narrow your search`
+     */
+    hiddenOptionsText: (hiddenCount: number) => string;
 }>, {
     isOpen: boolean;
     shouldSelectOnMouseUp: boolean;
@@ -69,4 +82,4 @@ export declare const ViraDropdown: import("element-vir").DeclarativeElementDefin
     selectedValuesChange: import("element-vir").DefineElementEvent<string[]>;
     /** `true` when the popover just opened, `false` when it just closed. */
     openChange: import("element-vir").DefineElementEvent<boolean>;
-}, "vira-dropdown-", "vira-dropdown-", readonly [], readonly ["leadingIcon", "prefixText", "searchInput", "trigger"]>;
+}, "vira-dropdown-", "vira-dropdown-", readonly [], readonly ["hiddenOptionsHint", "leadingIcon", "prefixText", "searchInput", "trigger"]>;

package/dist/elements/vira-dropdown.element.js

@@ -26,6 +26,7 @@ import { ViraIcon } from './vira-icon.element.js';
 export const ViraDropdown = defineViraElement()({
     tagName: 'vira-dropdown',
     testIds: [
+        'hiddenOptionsHint',
         'leadingIcon',
         'prefixText',
         'searchInput',
@@ -147,7 +148,8 @@ export const ViraDropdown = defineViraElement()({
         }
 
         .option-group-label,
-        .no-options {
+        .no-options,
+        .hidden-options-hint {
             ${noUserSelect};
             text-align: left;
         }
@@ -158,7 +160,8 @@ export const ViraDropdown = defineViraElement()({
             font-weight: ${viraFormCssVars['vira-form-label-font-weight'].value};
         }
 
-        .no-options {
+        .no-options,
+        .hidden-options-hint {
             cursor: default;
             opacity: 0.6;
             /* Aligns with the label text of each ViraMenuItem, past its check icon. */
@@ -304,6 +307,29 @@ export const ViraDropdown = defineViraElement()({
         const filteredFlatOptions = filteredOptions.flatMap((entry) => {
             return isViraDropdownOptionGroup(entry) ? entry.options : [entry];
         });
+        let remainingShownCount = inputs.isSearchable
+            ? (inputs.maxShownOptions ?? Infinity)
+            : Infinity;
+        /** `filteredOptions` truncated to `maxShownOptions` options, dropping emptied groups. */
+        const shownOptions = remainingShownCount < filteredFlatOptions.length
+            ? filterMap(filteredOptions, (entry) => {
+                const options = (isViraDropdownOptionGroup(entry) ? entry.options : [entry]).slice(0, Math.max(remainingShownCount, 0));
+                remainingShownCount -= options.length;
+                if (!options.length) {
+                    return undefined;
+                }
+                return isViraDropdownOptionGroup(entry)
+                    ? {
+                        ...entry,
+                        options,
+                    }
+                    : entry;
+            }, check.isTruthy)
+            : filteredOptions;
+        const hiddenOptionsCount = filteredFlatOptions.length -
+            shownOptions.flatMap((entry) => {
+                return isViraDropdownOptionGroup(entry) ? entry.options : [entry];
+            }).length;
         function findSearchInput() {
             const searchInput = host.shadowRoot.querySelector('.search-input');
             return searchInput instanceof HTMLInputElement ? searchInput : undefined;
@@ -352,7 +378,7 @@ export const ViraDropdown = defineViraElement()({
                   `;
         }
         /** Drag-select actions in the same order as the rendered menu items. */
-        const menuItemActions = filteredOptions.flatMap((entry) => {
+        const menuItemActions = shownOptions.flatMap((entry) => {
             const options = isViraDropdownOptionGroup(entry) ? entry.options : [entry];
             const optionActions = options.map((option) => {
                 return option.disabled
@@ -404,7 +430,7 @@ export const ViraDropdown = defineViraElement()({
         })}
             >
                 ${filteredFlatOptions.length
-            ? filteredOptions.map((entry) => {
+            ? shownOptions.map((entry) => {
                 return isViraDropdownOptionGroup(entry)
                     ? html `
                                     ${renderGroupLabel(entry)} ${renderOptionEntries(entry.options)}
@@ -414,6 +440,25 @@ export const ViraDropdown = defineViraElement()({
             : html `
                           <div class="no-options">${inputs.noOptionsText}</div>
                       `}
+                ${hiddenOptionsCount
+            ? html `
+                          <div
+                              class="hidden-options-hint"
+                              ${testId(testIds.hiddenOptionsHint)}
+                              ${listen('mousedown', (event) => {
+                /** Keeps focus in the search input. */
+                event.preventDefault();
+            })}
+                              ${listen('click', (event) => {
+                /** ViraPopoverTrigger closes on any click inside its popover. */
+                event.stopPropagation();
+            })}
+                          >
+                              ${inputs.hiddenOptionsText?.(hiddenOptionsCount) ??
+                `+${hiddenOptionsCount}, type to narrow your search`}
+                          </div>
+                      `
+            : nothing}
             </${ViraMenu}>
         `;
         const triggerTemplate = html `

package/dist/icons/internal-lucide-icons.d.ts

@@ -13,6 +13,7 @@ export declare const internalLucideIcons: {
     Eye16: import("./icon-svg.js").ViraIconSvg<"Eye">;
     EyeOff16: import("./icon-svg.js").ViraIconSvg<"EyeOff">;
     GripVertical16: import("./icon-svg.js").ViraIconSvg<"GripVertical">;
+    Minus16: import("./icon-svg.js").ViraIconSvg<"Minus">;
     Plus16: import("./icon-svg.js").ViraIconSvg<"Plus">;
     X16: import("./icon-svg.js").ViraIconSvg<"X">;
     X24: import("./icon-svg.js").ViraIconSvg<"X">;

package/dist/icons/internal-lucide-icons.js

@@ -7,6 +7,7 @@ import { LucideCopyIcon } from './lucide/copy.icon.js';
 import { LucideEyeOffIcon } from './lucide/eye-off.icon.js';
 import { LucideEyeIcon } from './lucide/eye.icon.js';
 import { LucideGripVerticalIcon } from './lucide/grip-vertical.icon.js';
+import { LucideMinusIcon } from './lucide/minus.icon.js';
 import { LucidePlusIcon } from './lucide/plus.icon.js';
 import { LucideXIcon } from './lucide/x.icon.js';
 import { createSizedIcon } from './sized-icon.js';
@@ -25,6 +26,7 @@ export const internalLucideIcons = {
     Eye16: LucideEyeIcon,
     EyeOff16: LucideEyeOffIcon,
     GripVertical16: LucideGripVerticalIcon,
+    Minus16: LucideMinusIcon,
     Plus16: LucidePlusIcon,
     X16: LucideXIcon,
     X24: createSizedIcon(LucideXIcon, 24),

package/dist/icons/lucide/belarusian-ruble.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `BelarusianRuble` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/belarusian-ruble
+ */
+export declare const LucideBelarusianRubleIcon: import("../icon-svg.js").ViraIconSvg<"BelarusianRuble">;

package/dist/icons/lucide/belarusian-ruble.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { BelarusianRuble as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `BelarusianRuble` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/belarusian-ruble
+ */
+export const LucideBelarusianRubleIcon = createLucideIcon({
+    name: 'BelarusianRuble',
+    svg,
+});

package/dist/icons/lucide/calendar-chevrons-left.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `CalendarChevronsLeft` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/calendar-chevrons-left
+ */
+export declare const LucideCalendarChevronsLeftIcon: import("../icon-svg.js").ViraIconSvg<"CalendarChevronsLeft">;

package/dist/icons/lucide/calendar-chevrons-left.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { CalendarChevronsLeft as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `CalendarChevronsLeft` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/calendar-chevrons-left
+ */
+export const LucideCalendarChevronsLeftIcon = createLucideIcon({
+    name: 'CalendarChevronsLeft',
+    svg,
+});

package/dist/icons/lucide/certificate.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `Certificate` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/certificate
+ */
+export declare const LucideCertificateIcon: import("../icon-svg.js").ViraIconSvg<"Certificate">;

package/dist/icons/lucide/certificate.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { Certificate as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `Certificate` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/certificate
+ */
+export const LucideCertificateIcon = createLucideIcon({
+    name: 'Certificate',
+    svg,
+});

package/dist/icons/lucide/circle-fading-play.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `CircleFadingPlay` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/circle-fading-play
+ */
+export declare const LucideCircleFadingPlayIcon: import("../icon-svg.js").ViraIconSvg<"CircleFadingPlay">;

package/dist/icons/lucide/circle-fading-play.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { CircleFadingPlay as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `CircleFadingPlay` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/circle-fading-play
+ */
+export const LucideCircleFadingPlayIcon = createLucideIcon({
+    name: 'CircleFadingPlay',
+    svg,
+});

package/dist/icons/lucide/cpu-ai.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `CpuAi` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/cpu-ai
+ */
+export declare const LucideCpuAiIcon: import("../icon-svg.js").ViraIconSvg<"CpuAi">;

package/dist/icons/lucide/cpu-ai.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { CpuAi as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `CpuAi` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/cpu-ai
+ */
+export const LucideCpuAiIcon = createLucideIcon({
+    name: 'CpuAi',
+    svg,
+});

package/dist/icons/lucide/eighth-note.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `EighthNote` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/eighth-note
+ */
+export declare const LucideEighthNoteIcon: import("../icon-svg.js").ViraIconSvg<"EighthNote">;

package/dist/icons/lucide/eighth-note.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { EighthNote as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `EighthNote` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/eighth-note
+ */
+export const LucideEighthNoteIcon = createLucideIcon({
+    name: 'EighthNote',
+    svg,
+});

package/dist/icons/lucide/eighth-notes.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `EighthNotes` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/eighth-notes
+ */
+export declare const LucideEighthNotesIcon: import("../icon-svg.js").ViraIconSvg<"EighthNotes">;

package/dist/icons/lucide/eighth-notes.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { EighthNotes as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `EighthNotes` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/eighth-notes
+ */
+export const LucideEighthNotesIcon = createLucideIcon({
+    name: 'EighthNotes',
+    svg,
+});

package/dist/icons/lucide/folder-user.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `FolderUser` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/folder-user
+ */
+export declare const LucideFolderUserIcon: import("../icon-svg.js").ViraIconSvg<"FolderUser">;

package/dist/icons/lucide/folder-user.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { FolderUser as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `FolderUser` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/folder-user
+ */
+export const LucideFolderUserIcon = createLucideIcon({
+    name: 'FolderUser',
+    svg,
+});

package/dist/icons/lucide/folder-users.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `FolderUsers` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/folder-users
+ */
+export declare const LucideFolderUsersIcon: import("../icon-svg.js").ViraIconSvg<"FolderUsers">;

package/dist/icons/lucide/folder-users.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { FolderUsers as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `FolderUsers` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/folder-users
+ */
+export const LucideFolderUsersIcon = createLucideIcon({
+    name: 'FolderUsers',
+    svg,
+});

package/dist/icons/lucide/graph-star.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `GraphStar` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/graph-star
+ */
+export declare const LucideGraphStarIcon: import("../icon-svg.js").ViraIconSvg<"GraphStar">;

package/dist/icons/lucide/graph-star.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { GraphStar as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `GraphStar` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/graph-star
+ */
+export const LucideGraphStarIcon = createLucideIcon({
+    name: 'GraphStar',
+    svg,
+});

package/dist/icons/lucide/guitar-electric.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `GuitarElectric` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/guitar-electric
+ */
+export declare const LucideGuitarElectricIcon: import("../icon-svg.js").ViraIconSvg<"GuitarElectric">;

package/dist/icons/lucide/guitar-electric.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { GuitarElectric as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `GuitarElectric` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/guitar-electric
+ */
+export const LucideGuitarElectricIcon = createLucideIcon({
+    name: 'GuitarElectric',
+    svg,
+});

package/dist/icons/lucide/half-note.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `HalfNote` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/half-note
+ */
+export declare const LucideHalfNoteIcon: import("../icon-svg.js").ViraIconSvg<"HalfNote">;

package/dist/icons/lucide/half-note.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { HalfNote as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `HalfNote` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/half-note
+ */
+export const LucideHalfNoteIcon = createLucideIcon({
+    name: 'HalfNote',
+    svg,
+});

package/dist/icons/lucide/index.d.ts

@@ -157,6 +157,7 @@ export * from './beef-off.icon.js';
 export * from './beef.icon.js';
 export * from './beer-off.icon.js';
 export * from './beer.icon.js';
+export * from './belarusian-ruble.icon.js';
 export * from './bell-check.icon.js';
 export * from './bell-dot.icon.js';
 export * from './bell-electric.icon.js';
@@ -269,6 +270,7 @@ export * from './calendar-arrow-down.icon.js';
 export * from './calendar-arrow-up.icon.js';
 export * from './calendar-check-2.icon.js';
 export * from './calendar-check.icon.js';
+export * from './calendar-chevrons-left.icon.js';
 export * from './calendar-chevrons-right.icon.js';
 export * from './calendar-clock.icon.js';
 export * from './calendar-cog.icon.js';
@@ -316,6 +318,7 @@ export * from './castle.icon.js';
 export * from './cat.icon.js';
 export * from './cctv-off.icon.js';
 export * from './cctv.icon.js';
+export * from './certificate.icon.js';
 export * from './chart-area.icon.js';
 export * from './chart-bar-big.icon.js';
 export * from './chart-bar-decreasing.icon.js';
@@ -393,6 +396,7 @@ export * from './circle-ellipsis.icon.js';
 export * from './circle-equal.icon.js';
 export * from './circle-euro.icon.js';
 export * from './circle-fading-arrow-up.icon.js';
+export * from './circle-fading-play.icon.js';
 export * from './circle-fading-plus.icon.js';
 export * from './circle-gauge.icon.js';
 export * from './circle-minus.icon.js';
@@ -518,6 +522,7 @@ export * from './corner-right-down.icon.js';
 export * from './corner-right-up.icon.js';
 export * from './corner-up-left.icon.js';
 export * from './corner-up-right.icon.js';
+export * from './cpu-ai.icon.js';
 export * from './cpu.icon.js';
 export * from './creative-commons.icon.js';
 export * from './credit-card-check.icon.js';
@@ -602,6 +607,8 @@ export * from './eclipse.icon.js';
 export * from './egg-fried.icon.js';
 export * from './egg-off.icon.js';
 export * from './egg.icon.js';
+export * from './eighth-note.icon.js';
+export * from './eighth-notes.icon.js';
 export * from './eject.icon.js';
 export * from './ellipse.icon.js';
 export * from './ellipsis-vertical.icon.js';
@@ -744,6 +751,8 @@ export * from './folder-symlink.icon.js';
 export * from './folder-sync.icon.js';
 export * from './folder-tree.icon.js';
 export * from './folder-up.icon.js';
+export * from './folder-user.icon.js';
+export * from './folder-users.icon.js';
 export * from './folder-x.icon.js';
 export * from './folder.icon.js';
 export * from './folders.icon.js';
@@ -805,6 +814,7 @@ export * from './goal.icon.js';
 export * from './gpu.icon.js';
 export * from './graduation-cap.icon.js';
 export * from './grape.icon.js';
+export * from './graph-star.icon.js';
 export * from './grid-2x2-check.icon.js';
 export * from './grid-2x2-plus.icon.js';
 export * from './grid-2x2-x.icon.js';
@@ -816,7 +826,9 @@ export * from './grip-vertical.icon.js';
 export * from './grip.icon.js';
 export * from './groceries.icon.js';
 export * from './group.icon.js';
+export * from './guitar-electric.icon.js';
 export * from './guitar.icon.js';
+export * from './half-note.icon.js';
 export * from './ham.icon.js';
 export * from './hamburger.icon.js';
 export * from './hammer.icon.js';
@@ -1059,6 +1071,7 @@ export * from './message-circle-off.icon.js';
 export * from './message-circle-plus.icon.js';
 export * from './message-circle-question-mark.icon.js';
 export * from './message-circle-reply.icon.js';
+export * from './message-circle-text.icon.js';
 export * from './message-circle-warning.icon.js';
 export * from './message-circle-x.icon.js';
 export * from './message-circle.icon.js';
@@ -1147,10 +1160,6 @@ export * from './move-up-right.icon.js';
 export * from './move-up.icon.js';
 export * from './move-vertical.icon.js';
 export * from './move.icon.js';
-export * from './music-2.icon.js';
-export * from './music-3.icon.js';
-export * from './music-4.icon.js';
-export * from './music.icon.js';
 export * from './navigation-2-off.icon.js';
 export * from './navigation-2.icon.js';
 export * from './navigation-off.icon.js';
@@ -1234,6 +1243,7 @@ export * from './pencil-sparkles.icon.js';
 export * from './pencil.icon.js';
 export * from './pentagon.icon.js';
 export * from './percent.icon.js';
+export * from './perfume-bottle.icon.js';
 export * from './person-standing.icon.js';
 export * from './phi.icon.js';
 export * from './philippine-peso.icon.js';
@@ -1417,6 +1427,7 @@ export * from './separator-horizontal.icon.js';
 export * from './separator-vertical.icon.js';
 export * from './server-cog.icon.js';
 export * from './server-crash.icon.js';
+export * from './server-nas.icon.js';
 export * from './server-off.icon.js';
 export * from './server-plus.icon.js';
 export * from './server.icon.js';
@@ -1472,6 +1483,7 @@ export * from './signature.icon.js';
 export * from './signpost-big.icon.js';
 export * from './signpost.icon.js';
 export * from './siren.icon.js';
+export * from './sixteenth-notes.icon.js';
 export * from './skip-back.icon.js';
 export * from './skip-forward.icon.js';
 export * from './skull.icon.js';
@@ -1781,6 +1793,8 @@ export * from './user-shield.icon.js';
 export * from './user-star.icon.js';
 export * from './user-x.icon.js';
 export * from './user.icon.js';
+export * from './users-collaboration.icon.js';
+export * from './users-round-collaboration.icon.js';
 export * from './users-round.icon.js';
 export * from './users.icon.js';
 export * from './utensils-crossed.icon.js';

package/dist/icons/lucide/index.js

@@ -157,6 +157,7 @@ export * from './beef-off.icon.js';
 export * from './beef.icon.js';
 export * from './beer-off.icon.js';
 export * from './beer.icon.js';
+export * from './belarusian-ruble.icon.js';
 export * from './bell-check.icon.js';
 export * from './bell-dot.icon.js';
 export * from './bell-electric.icon.js';
@@ -269,6 +270,7 @@ export * from './calendar-arrow-down.icon.js';
 export * from './calendar-arrow-up.icon.js';
 export * from './calendar-check-2.icon.js';
 export * from './calendar-check.icon.js';
+export * from './calendar-chevrons-left.icon.js';
 export * from './calendar-chevrons-right.icon.js';
 export * from './calendar-clock.icon.js';
 export * from './calendar-cog.icon.js';
@@ -316,6 +318,7 @@ export * from './castle.icon.js';
 export * from './cat.icon.js';
 export * from './cctv-off.icon.js';
 export * from './cctv.icon.js';
+export * from './certificate.icon.js';
 export * from './chart-area.icon.js';
 export * from './chart-bar-big.icon.js';
 export * from './chart-bar-decreasing.icon.js';
@@ -393,6 +396,7 @@ export * from './circle-ellipsis.icon.js';
 export * from './circle-equal.icon.js';
 export * from './circle-euro.icon.js';
 export * from './circle-fading-arrow-up.icon.js';
+export * from './circle-fading-play.icon.js';
 export * from './circle-fading-plus.icon.js';
 export * from './circle-gauge.icon.js';
 export * from './circle-minus.icon.js';
@@ -518,6 +522,7 @@ export * from './corner-right-down.icon.js';
 export * from './corner-right-up.icon.js';
 export * from './corner-up-left.icon.js';
 export * from './corner-up-right.icon.js';
+export * from './cpu-ai.icon.js';
 export * from './cpu.icon.js';
 export * from './creative-commons.icon.js';
 export * from './credit-card-check.icon.js';
@@ -602,6 +607,8 @@ export * from './eclipse.icon.js';
 export * from './egg-fried.icon.js';
 export * from './egg-off.icon.js';
 export * from './egg.icon.js';
+export * from './eighth-note.icon.js';
+export * from './eighth-notes.icon.js';
 export * from './eject.icon.js';
 export * from './ellipse.icon.js';
 export * from './ellipsis-vertical.icon.js';
@@ -744,6 +751,8 @@ export * from './folder-symlink.icon.js';
 export * from './folder-sync.icon.js';
 export * from './folder-tree.icon.js';
 export * from './folder-up.icon.js';
+export * from './folder-user.icon.js';
+export * from './folder-users.icon.js';
 export * from './folder-x.icon.js';
 export * from './folder.icon.js';
 export * from './folders.icon.js';
@@ -805,6 +814,7 @@ export * from './goal.icon.js';
 export * from './gpu.icon.js';
 export * from './graduation-cap.icon.js';
 export * from './grape.icon.js';
+export * from './graph-star.icon.js';
 export * from './grid-2x2-check.icon.js';
 export * from './grid-2x2-plus.icon.js';
 export * from './grid-2x2-x.icon.js';
@@ -816,7 +826,9 @@ export * from './grip-vertical.icon.js';
 export * from './grip.icon.js';
 export * from './groceries.icon.js';
 export * from './group.icon.js';
+export * from './guitar-electric.icon.js';
 export * from './guitar.icon.js';
+export * from './half-note.icon.js';
 export * from './ham.icon.js';
 export * from './hamburger.icon.js';
 export * from './hammer.icon.js';
@@ -1059,6 +1071,7 @@ export * from './message-circle-off.icon.js';
 export * from './message-circle-plus.icon.js';
 export * from './message-circle-question-mark.icon.js';
 export * from './message-circle-reply.icon.js';
+export * from './message-circle-text.icon.js';
 export * from './message-circle-warning.icon.js';
 export * from './message-circle-x.icon.js';
 export * from './message-circle.icon.js';
@@ -1147,10 +1160,6 @@ export * from './move-up-right.icon.js';
 export * from './move-up.icon.js';
 export * from './move-vertical.icon.js';
 export * from './move.icon.js';
-export * from './music-2.icon.js';
-export * from './music-3.icon.js';
-export * from './music-4.icon.js';
-export * from './music.icon.js';
 export * from './navigation-2-off.icon.js';
 export * from './navigation-2.icon.js';
 export * from './navigation-off.icon.js';
@@ -1234,6 +1243,7 @@ export * from './pencil-sparkles.icon.js';
 export * from './pencil.icon.js';
 export * from './pentagon.icon.js';
 export * from './percent.icon.js';
+export * from './perfume-bottle.icon.js';
 export * from './person-standing.icon.js';
 export * from './phi.icon.js';
 export * from './philippine-peso.icon.js';
@@ -1417,6 +1427,7 @@ export * from './separator-horizontal.icon.js';
 export * from './separator-vertical.icon.js';
 export * from './server-cog.icon.js';
 export * from './server-crash.icon.js';
+export * from './server-nas.icon.js';
 export * from './server-off.icon.js';
 export * from './server-plus.icon.js';
 export * from './server.icon.js';
@@ -1472,6 +1483,7 @@ export * from './signature.icon.js';
 export * from './signpost-big.icon.js';
 export * from './signpost.icon.js';
 export * from './siren.icon.js';
+export * from './sixteenth-notes.icon.js';
 export * from './skip-back.icon.js';
 export * from './skip-forward.icon.js';
 export * from './skull.icon.js';
@@ -1781,6 +1793,8 @@ export * from './user-shield.icon.js';
 export * from './user-star.icon.js';
 export * from './user-x.icon.js';
 export * from './user.icon.js';
+export * from './users-collaboration.icon.js';
+export * from './users-round-collaboration.icon.js';
 export * from './users-round.icon.js';
 export * from './users.icon.js';
 export * from './utensils-crossed.icon.js';

package/dist/icons/lucide/message-circle-text.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `MessageCircleText` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/message-circle-text
+ */
+export declare const LucideMessageCircleTextIcon: import("../icon-svg.js").ViraIconSvg<"MessageCircleText">;

package/dist/icons/lucide/message-circle-text.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { MessageCircleText as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `MessageCircleText` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/message-circle-text
+ */
+export const LucideMessageCircleTextIcon = createLucideIcon({
+    name: 'MessageCircleText',
+    svg,
+});

package/dist/icons/lucide/perfume-bottle.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `PerfumeBottle` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/perfume-bottle
+ */
+export declare const LucidePerfumeBottleIcon: import("../icon-svg.js").ViraIconSvg<"PerfumeBottle">;

package/dist/icons/lucide/perfume-bottle.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { PerfumeBottle as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `PerfumeBottle` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/perfume-bottle
+ */
+export const LucidePerfumeBottleIcon = createLucideIcon({
+    name: 'PerfumeBottle',
+    svg,
+});

package/dist/icons/lucide/server-nas.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `ServerNas` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/server-nas
+ */
+export declare const LucideServerNasIcon: import("../icon-svg.js").ViraIconSvg<"ServerNas">;

package/dist/icons/lucide/server-nas.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { ServerNas as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `ServerNas` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/server-nas
+ */
+export const LucideServerNasIcon = createLucideIcon({
+    name: 'ServerNas',
+    svg,
+});

package/dist/icons/lucide/sixteenth-notes.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `SixteenthNotes` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/sixteenth-notes
+ */
+export declare const LucideSixteenthNotesIcon: import("../icon-svg.js").ViraIconSvg<"SixteenthNotes">;

package/dist/icons/lucide/sixteenth-notes.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { SixteenthNotes as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `SixteenthNotes` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/sixteenth-notes
+ */
+export const LucideSixteenthNotesIcon = createLucideIcon({
+    name: 'SixteenthNotes',
+    svg,
+});

package/dist/icons/lucide/users-collaboration.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `UsersCollaboration` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/users-collaboration
+ */
+export declare const LucideUsersCollaborationIcon: import("../icon-svg.js").ViraIconSvg<"UsersCollaboration">;

package/dist/icons/lucide/users-collaboration.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { UsersCollaboration as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `UsersCollaboration` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/users-collaboration
+ */
+export const LucideUsersCollaborationIcon = createLucideIcon({
+    name: 'UsersCollaboration',
+    svg,
+});

package/dist/icons/lucide/users-round-collaboration.icon.d.ts

@@ -0,0 +1,8 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+/**
+ * Lucide's `UsersRoundCollaboration` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/users-round-collaboration
+ */
+export declare const LucideUsersRoundCollaborationIcon: import("../icon-svg.js").ViraIconSvg<"UsersRoundCollaboration">;

package/dist/icons/lucide/users-round-collaboration.icon.js

@@ -0,0 +1,13 @@
+/** This file is automatically updated by generate-lucide-icons.ts */
+import { UsersRoundCollaboration as svg } from 'lucide-static';
+import { createLucideIcon } from '../lucide-icon.js';
+/**
+ * Lucide's `UsersRoundCollaboration` icon, rendered at 16px.
+ *
+ * @category Lucide Icon
+ * @see https://lucide.dev/icons/users-round-collaboration
+ */
+export const LucideUsersRoundCollaborationIcon = createLucideIcon({
+    name: 'UsersRoundCollaboration',
+    svg,
+});

package/dist/util/popover-manager.js

@@ -46,7 +46,13 @@ export function isTextInputActive() {
  */
 export function isMouseEventOnScrollbar(event) {
     const target = event.composedPath()[0];
-    if (!(target instanceof Element)) {
+    if (!(target instanceof Element) ||
+        /**
+         * Inline boxes cannot have scrollbars. Firefox still reports a nonzero scroll size for them
+         * while their client size is always 0, so without this every click on inline content (such
+         * as a `<b>` in a dropdown label) looks like a scrollbar click.
+         */
+        globalThis.getComputedStyle(target).display === 'inline') {
         return false;
     }
     const rect = target.getBoundingClientRect();

package/dist/util/shared-text-input-logic.js

@@ -26,12 +26,11 @@ function isAllowed({ value: rawValue, allowed, blocked }) {
             input: value,
             matcher: allowed,
         });
-    const isBlockedCharacter = blocked
-        ? doesMatch({
+    const isBlockedCharacter = !!blocked &&
+        doesMatch({
             input: value,
             matcher: blocked,
-        })
-        : false;
+        });
     return isAllowedCharacter && !isBlockedCharacter;
 }
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "vira",
-    "version": "33.7.0",
+    "version": "33.9.0",
     "description": "A simple and highly versatile design system using element-vir.",
     "keywords": [
         "design",
@@ -38,9 +38,9 @@
         "test:docs": "virmator docs check"
     },
     "dependencies": {
-        "@augment-vir/assert": "^32.5.0",
-        "@augment-vir/common": "^32.5.0",
-        "@augment-vir/web": "^32.5.0",
+        "@augment-vir/assert": "^32.6.0",
+        "@augment-vir/common": "^32.6.0",
+        "@augment-vir/web": "^32.6.0",
         "@electrovir/color": "^2.0.0",
         "@electrovir/local-storage-client": "^0.1.1",
         "date-vir": "^9.4.0",
@@ -48,15 +48,15 @@
         "json-schema-to-ts": "^3.1.1",
         "lit": "^3.3.3",
         "lit-css-vars": "^3.6.3",
-        "lucide-static": "1.55.0",
+        "lucide-static": "1.59.0",
         "object-shape-tester": "^6.15.1",
         "observavir": "^2.4.2",
         "page-active": "^1.0.4",
-        "spa-router-vir": "^6.8.0",
+        "spa-router-vir": "^6.9.0",
         "typed-event-target": "^4.3.4"
     },
     "devDependencies": {
-        "@augment-vir/test": "^32.5.0",
+        "@augment-vir/test": "^32.6.0",
         "@web/dev-server-esbuild": "^2.0.0",
         "@web/test-runner": "^1.0.0",
         "@web/test-runner-commands": "^1.0.1",

package/dist/icons/lucide/music-2.icon.d.ts

@@ -1,8 +0,0 @@
-/** This file is automatically updated by generate-lucide-icons.ts */
-/**
- * Lucide's `Music2` icon, rendered at 16px.
- *
- * @category Lucide Icon
- * @see https://lucide.dev/icons/music-2
- */
-export declare const LucideMusic2Icon: import("../icon-svg.js").ViraIconSvg<"Music2">;

package/dist/icons/lucide/music-2.icon.js

@@ -1,13 +0,0 @@
-/** This file is automatically updated by generate-lucide-icons.ts */
-import { Music2 as svg } from 'lucide-static';
-import { createLucideIcon } from '../lucide-icon.js';
-/**
- * Lucide's `Music2` icon, rendered at 16px.
- *
- * @category Lucide Icon
- * @see https://lucide.dev/icons/music-2
- */
-export const LucideMusic2Icon = createLucideIcon({
-    name: 'Music2',
-    svg,
-});

package/dist/icons/lucide/music-3.icon.d.ts

@@ -1,8 +0,0 @@
-/** This file is automatically updated by generate-lucide-icons.ts */
-/**
- * Lucide's `Music3` icon, rendered at 16px.
- *
- * @category Lucide Icon
- * @see https://lucide.dev/icons/music-3
- */
-export declare const LucideMusic3Icon: import("../icon-svg.js").ViraIconSvg<"Music3">;

package/dist/icons/lucide/music-3.icon.js

@@ -1,13 +0,0 @@
-/** This file is automatically updated by generate-lucide-icons.ts */
-import { Music3 as svg } from 'lucide-static';
-import { createLucideIcon } from '../lucide-icon.js';
-/**
- * Lucide's `Music3` icon, rendered at 16px.
- *
- * @category Lucide Icon
- * @see https://lucide.dev/icons/music-3
- */
-export const LucideMusic3Icon = createLucideIcon({
-    name: 'Music3',
-    svg,
-});

package/dist/icons/lucide/music-4.icon.d.ts

@@ -1,8 +0,0 @@
-/** This file is automatically updated by generate-lucide-icons.ts */
-/**
- * Lucide's `Music4` icon, rendered at 16px.
- *
- * @category Lucide Icon
- * @see https://lucide.dev/icons/music-4
- */
-export declare const LucideMusic4Icon: import("../icon-svg.js").ViraIconSvg<"Music4">;

package/dist/icons/lucide/music-4.icon.js

@@ -1,13 +0,0 @@
-/** This file is automatically updated by generate-lucide-icons.ts */
-import { Music4 as svg } from 'lucide-static';
-import { createLucideIcon } from '../lucide-icon.js';
-/**
- * Lucide's `Music4` icon, rendered at 16px.
- *
- * @category Lucide Icon
- * @see https://lucide.dev/icons/music-4
- */
-export const LucideMusic4Icon = createLucideIcon({
-    name: 'Music4',
-    svg,
-});

package/dist/icons/lucide/music.icon.d.ts

@@ -1,8 +0,0 @@
-/** This file is automatically updated by generate-lucide-icons.ts */
-/**
- * Lucide's `Music` icon, rendered at 16px.
- *
- * @category Lucide Icon
- * @see https://lucide.dev/icons/music
- */
-export declare const LucideMusicIcon: import("../icon-svg.js").ViraIconSvg<"Music">;

package/dist/icons/lucide/music.icon.js

@@ -1,13 +0,0 @@
-/** This file is automatically updated by generate-lucide-icons.ts */
-import { Music as svg } from 'lucide-static';
-import { createLucideIcon } from '../lucide-icon.js';
-/**
- * Lucide's `Music` icon, rendered at 16px.
- *
- * @category Lucide Icon
- * @see https://lucide.dev/icons/music
- */
-export const LucideMusicIcon = createLucideIcon({
-    name: 'Music',
-    svg,
-});