@fusion.dev/helix-headless 0.139.0 → 0.140.0

package/dist/area-chart/root/area-chart-root.js

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { CHART_PLOT, customElement, drawTooltip, formatNumbers, HelixElement, linear, linePath, MixinChartSource, PLOT_HEIGHT, PLOT_WIDTH, seriesIndex, ticks, } from '@fusion.dev/helix-core';
+import { CHART_PLOT, customElement, drawTooltip, formatNumbers, HelixElement, linear, linePath, MixinChartSource, PLOT_HEIGHT, PLOT_WIDTH, reportRuntime, seriesIndex, ticks, } from '@fusion.dev/helix-core';
 import { html, nothing, svg } from 'lit';
 import { property } from 'lit/decorators.js';
 import '../../tooltip/index.js';
@@ -58,10 +58,14 @@ let HelixHeadlessAreaChart = class HelixHeadlessAreaChart extends MixinChartSour
             return;
         }
         this.warnedAboutNegatives = true;
-        console.warn(`<${this.localName}> read a negative number and drew it as none. Its bands are parts of a ` +
-            'total, and a part cannot be less than nothing: a band drawn below its neighbor would say ' +
-            'the part took some of the one beneath it away. A series that crosses zero is a line, so ' +
-            'reach for the line chart in this tier instead.');
+        reportRuntime({
+            kind: 'negative-value',
+            message: `<${this.localName}> read a negative number and drew it as none. Its bands are parts of a ` +
+                'total, and a part cannot be less than nothing: a band drawn below its neighbor would say ' +
+                'the part took some of the one beneath it away. A series that crosses zero is a line, so ' +
+                'reach for the line chart in this tier instead.',
+            tag: this.localName,
+        });
     }
     render() {
         const rows = this.sourceRows;

package/dist/avatar/group/avatar-group.js

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { customElement, HelixElement, hostAria } from '@fusion.dev/helix-core';
+import { customElement, HelixElement, hostAria, reportRuntime } from '@fusion.dev/helix-core';
 import { html } from 'lit';
 import { property } from 'lit/decorators.js';
 export const FOLDS_UP_TO = 12;
@@ -35,9 +35,13 @@ let HelixHeadlessAvatarGroup = class HelixHeadlessAvatarGroup extends HelixEleme
         const limit = this.max ?? 0;
         if (limit > FOLDS_UP_TO && this.avatars.length > limit && !this.warned) {
             this.warned = true;
-            console.warn(`<${this.localName}> has max="${this.max}", past the ${FOLDS_UP_TO} the fold is written for, ` +
-                'so every avatar is shown and none are counted. Lower `max`, or hand the group the ' +
-                'avatars you want shown.');
+            reportRuntime({
+                kind: 'max-past-fold',
+                message: `<${this.localName}> has max="${this.max}", past the ${FOLDS_UP_TO} the fold is written for, ` +
+                    'so every avatar is shown and none are counted. Lower `max`, or hand the group the ' +
+                    'avatars you want shown.',
+                tag: this.localName,
+            });
         }
     }
     render() {

package/dist/data-table/root/data-table-root.js

@@ -5,7 +5,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 var HelixHeadlessDataTable_1;
-import { customElement, fillTemplate, formatNumbers, HelixElement, HelixFilterEvent, HelixNavigateEvent, HelixReorderEvent, HelixSelectEvent, HelixSortEvent, hostAria, inlineStep, isRtl, MixinCollection, markRegion, requestChange, VirtualizeController, writtenList, } from '@fusion.dev/helix-core';
+import { customElement, fillTemplate, formatNumbers, HelixElement, HelixFilterEvent, HelixNavigateEvent, HelixReorderEvent, HelixSelectEvent, HelixSortEvent, hostAria, inlineStep, isRtl, MixinCollection, markRegion, reportRuntime, requestChange, VirtualizeController, writtenList, } from '@fusion.dev/helix-core';
 import { nothing } from 'lit';
 import { property, state } from 'lit/decorators.js';
 import { repeat } from 'lit/directives/repeat.js';
@@ -308,10 +308,14 @@ let HelixHeadlessDataTable = class HelixHeadlessDataTable extends MixinCollectio
             return;
         }
         this.warnedAboutSize = true;
-        console.warn(`<${this.localName}> is drawing ${drawn} rows at once, which is past the ${HelixHeadlessDataTable_1.COMFORTABLE} ` +
-            'it stays responsive to: every row is rendered, so this costs roughly 37 microseconds each and ' +
-            'crosses an interaction budget around 2,700. Set `page-size` to paginate, or `mode="server"` ' +
-            'to hand it one page at a time with `total` describing the whole result.');
+        reportRuntime({
+            kind: 'too-many-rows',
+            message: `<${this.localName}> is drawing ${drawn} rows at once, which is past the ${HelixHeadlessDataTable_1.COMFORTABLE} ` +
+                'it stays responsive to: every row is rendered, so this costs roughly 37 microseconds each and ' +
+                'crosses an interaction budget around 2,700. Set `page-size` to paginate, or `mode="server"` ' +
+                'to hand it one page at a time with `total` describing the whole result.',
+            tag: this.localName,
+        });
     }
     get view() {
         if (this.mode === 'server') {
@@ -414,7 +418,11 @@ let HelixHeadlessDataTable = class HelixHeadlessDataTable extends MixinCollectio
         }
         if (this.selectable && !this.warnedAboutKey && typeof window !== 'undefined') {
             this.warnedAboutKey = true;
-            console.warn(`<${this.localName} selectable> has no \`row-key\`, so it knows each row by its place in the result, and a sort, a filter or new data selects a different row than the one that was chosen. Set \`row-key\` to the field that identifies a row.`);
+            reportRuntime({
+                kind: 'missing-row-key',
+                message: `<${this.localName} selectable> has no \`row-key\`, so it knows each row by its place in the result, and a sort, a filter or new data selects a different row than the one that was chosen. Set \`row-key\` to the field that identifies a row.`,
+                tag: this.localName,
+            });
         }
         return String(place);
     }

package/dist/filter-input/field/filter-field.js

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { customElement, HelixElement } from '@fusion.dev/helix-core';
+import { customElement, HelixElement, reportRuntime } from '@fusion.dev/helix-core';
 import { nothing } from 'lit';
 import { property } from 'lit/decorators.js';
 import { DEFAULT_FILTER_OPERATORS } from '../grammar.js';
@@ -21,7 +21,11 @@ let HelixHeadlessFilterField = class HelixHeadlessFilterField extends HelixEleme
     get defaultOperator() {
         const marked = this.operators.filter((operator) => operator.default);
         if (marked.length > 1) {
-            console.warn(`\`${this.name || 'A filter field'}\` names ${marked.length} default operators, and a chip can only leave one unwritten. Mark one.`);
+            reportRuntime({
+                kind: 'two-default-operators',
+                message: `\`${this.name || 'A filter field'}\` names ${marked.length} default operators, and a chip can only leave one unwritten. Mark one.`,
+                tag: this.localName,
+            });
         }
         return marked[0] ?? null;
     }

package/dist/rating/root/rating-root.js

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { valueAsNumber as asNumber, customElement, numberAsValue as fromNumber, HelixFormElement, KeyboardNavigationController, MixinControllerValue, MixinField, } from '@fusion.dev/helix-core';
+import { valueAsNumber as asNumber, customElement, numberAsValue as fromNumber, HelixFormElement, KeyboardNavigationController, MixinControllerValue, MixinField, reportRuntime, } from '@fusion.dev/helix-core';
 import { html, nothing } from 'lit';
 import { property, state } from 'lit/decorators.js';
 let HelixHeadlessRating = class HelixHeadlessRating extends MixinControllerValue(MixinField(HelixFormElement)) {
@@ -169,9 +169,13 @@ let HelixHeadlessRating = class HelixHeadlessRating extends MixinControllerValue
         this.sync();
         if (this.floor !== this.min && !this.warned) {
             this.warned = true;
-            console.warn(`<${this.localName}> has min="${this.min}", which is not a score between 0 and its max of ` +
-                `${this.max}, so the lowest score it offers is ${this.floor}. Put min inside the marks, ` +
-                'or move max.');
+            reportRuntime({
+                kind: 'min-out-of-range',
+                message: `<${this.localName}> has min="${this.min}", which is not a score between 0 and its max of ` +
+                    `${this.max}, so the lowest score it offers is ${this.floor}. Put min inside the marks, ` +
+                    'or move max.',
+                tag: this.localName,
+            });
         }
     }
     willUpdate(changed) {

package/dist/tooltip/root/tooltip-root.js

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { anchorElement, customElement, elementById, HelixElement, hostAria, MixinControllerOpen, PopoverController, } from '@fusion.dev/helix-core';
+import { anchorElement, customElement, elementById, HelixElement, hostAria, MixinControllerOpen, PopoverController, reportRuntime, } from '@fusion.dev/helix-core';
 import { html } from 'lit';
 import { property, state } from 'lit/decorators.js';
 const GENERIC = new Set(['div', 'p', 'section', 'span']);
@@ -175,17 +175,25 @@ let HelixHeadlessTooltip = class HelixHeadlessTooltip extends MixinControllerOpe
         }
         this.audited = true;
         if (this.for === '') {
-            console.warn(`<${this.localName}> is wrapping its trigger rather than naming one, so its text ` +
-                "reaches no screen reader: a description in this element's shadow root cannot be " +
-                'referenced from a trigger in the light DOM. Give this tooltip an `id`, set `for` to ' +
-                'the trigger\'s id, and add `aria-describedby="<that id>"` to the trigger.');
+            reportRuntime({
+                kind: 'wrapped-trigger',
+                message: `<${this.localName}> is wrapping its trigger rather than naming one, so its text ` +
+                    "reaches no screen reader: a description in this element's shadow root cannot be " +
+                    'referenced from a trigger in the light DOM. Give this tooltip an `id`, set `for` to ' +
+                    'the trigger\'s id, and add `aria-describedby="<that id>"` to the trigger.',
+                tag: this.localName,
+            });
             return;
         }
         const trigger = this.named;
         if (!trigger) {
-            console.warn(`<${this.localName} for="${this.for}"> found no element with that id in its own tree, ` +
-                'so it has nothing to describe and nothing to point at. Ids resolve per tree: an ' +
-                'element inside another shadow root is not reachable from here.');
+            reportRuntime({
+                kind: 'missing-trigger',
+                message: `<${this.localName} for="${this.for}"> found no element with that id in its own tree, ` +
+                    'so it has nothing to describe and nothing to point at. Ids resolve per tree: an ' +
+                    'element inside another shadow root is not reachable from here.',
+                tag: this.localName,
+            });
             return;
         }
         const names = `${trigger.getAttribute('aria-describedby') ?? ''} ${trigger.getAttribute('aria-labelledby') ?? ''}`
@@ -194,10 +202,14 @@ let HelixHeadlessTooltip = class HelixHeadlessTooltip extends MixinControllerOpe
         if (this.id !== '' && names.includes(this.id)) {
             return;
         }
-        console.warn(`<${this.localName} for="${this.for}"> is not read out with its trigger. The link is ` +
-            'written from the trigger, not from here: give this tooltip an `id` and add ' +
-            '`aria-describedby="<that id>"` to the element it names. Written in your own markup ' +
-            'it survives server rendering, which is why this element will not write it for you.');
+        reportRuntime({
+            kind: 'unlinked-trigger',
+            message: `<${this.localName} for="${this.for}"> is not read out with its trigger. The link is ` +
+                'written from the trigger, not from here: give this tooltip an `id` and add ' +
+                '`aria-describedby="<that id>"` to the element it names. Written in your own markup ' +
+                'it survives server rendering, which is why this element will not write it for you.',
+            tag: this.localName,
+        });
     }
     connectedCallback() {
         super.connectedCallback();

package/dist/video/root/video-root.js

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { activeCue, adoptTrack, CueController, captionsAmong, captionTracks, copiesOf, customElement, drawIcon, FullscreenController, fillTemplate, HelixElement, HelixNextEvent, HelixPreviousEvent, IdleController, MediaSessionController, onUnlessFalse, RemotePlaybackController, SKIP_SECONDS, sameCopies, showCaption, writtenList, writtenNumbers, } from '@fusion.dev/helix-core';
+import { activeCue, adoptTrack, CueController, captionsAmong, captionTracks, copiesOf, customElement, drawIcon, FullscreenController, fillTemplate, HelixElement, HelixNextEvent, HelixPreviousEvent, IdleController, MediaSessionController, onUnlessFalse, RemotePlaybackController, reportRuntime, SKIP_SECONDS, sameCopies, showCaption, writtenList, writtenNumbers, } from '@fusion.dev/helix-core';
 import { airplay, arrowClockwise, arrowCounterClockwise, closedCaptioning, cornersIn, cornersOut, dotsThreeVertical, download, gauge, pause, pictureInPicture, play, skipBack, skipForward, speakerHigh, speakerX, } from '@fusion.dev/helix-icons';
 import { nothing } from 'lit';
 import { property, state } from 'lit/decorators.js';
@@ -378,7 +378,12 @@ let HelixHeadlessVideo = class HelixHeadlessVideo extends HelixElement {
             await video.requestPictureInPicture();
         }
         catch (error) {
-            console.warn(`<${this.localName}> could not enter picture in picture. A press has to come from the reader, and one window holds it at a time.`, error);
+            reportRuntime({
+                detail: error,
+                kind: 'picture-in-picture-refused',
+                message: `<${this.localName}> could not enter picture in picture. A press has to come from the reader, and one window holds it at a time.`,
+                tag: this.localName,
+            });
         }
     }
     willUpdate(changed) {