@aceshooting/lyra-ui 3.5.0 → 3.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +111 -2
- package/custom-elements.json +50239 -41857
- package/dist/components/animated-image/animated-image.class.d.ts +131 -0
- package/dist/components/animated-image/animated-image.class.d.ts.map +1 -0
- package/dist/components/animated-image/animated-image.class.js +296 -0
- package/dist/components/animated-image/animated-image.class.js.map +1 -0
- package/dist/components/animated-image/animated-image.d.ts +2 -0
- package/dist/components/animated-image/animated-image.d.ts.map +1 -0
- package/dist/components/animated-image/animated-image.js +5 -0
- package/dist/components/animated-image/animated-image.js.map +1 -0
- package/dist/components/animated-image/animated-image.styles.d.ts +2 -0
- package/dist/components/animated-image/animated-image.styles.d.ts.map +1 -0
- package/dist/components/animated-image/animated-image.styles.js +117 -0
- package/dist/components/animated-image/animated-image.styles.js.map +1 -0
- package/dist/components/animation/animation.class.d.ts +119 -0
- package/dist/components/animation/animation.class.d.ts.map +1 -0
- package/dist/components/animation/animation.class.js +420 -0
- package/dist/components/animation/animation.class.js.map +1 -0
- package/dist/components/animation/animation.d.ts +2 -0
- package/dist/components/animation/animation.d.ts.map +1 -0
- package/dist/components/animation/animation.js +5 -0
- package/dist/components/animation/animation.js.map +1 -0
- package/dist/components/animation/animation.styles.d.ts +2 -0
- package/dist/components/animation/animation.styles.d.ts.map +1 -0
- package/dist/components/animation/animation.styles.js +18 -0
- package/dist/components/animation/animation.styles.js.map +1 -0
- package/dist/components/avatar-group/avatar-group.class.d.ts +110 -0
- package/dist/components/avatar-group/avatar-group.class.d.ts.map +1 -0
- package/dist/components/avatar-group/avatar-group.class.js +182 -0
- package/dist/components/avatar-group/avatar-group.class.js.map +1 -0
- package/dist/components/avatar-group/avatar-group.d.ts +2 -0
- package/dist/components/avatar-group/avatar-group.d.ts.map +1 -0
- package/dist/components/avatar-group/avatar-group.js +5 -0
- package/dist/components/avatar-group/avatar-group.js.map +1 -0
- package/dist/components/avatar-group/avatar-group.styles.d.ts +2 -0
- package/dist/components/avatar-group/avatar-group.styles.d.ts.map +1 -0
- package/dist/components/avatar-group/avatar-group.styles.js +112 -0
- package/dist/components/avatar-group/avatar-group.styles.js.map +1 -0
- package/dist/components/button/button.class.d.ts +5 -2
- package/dist/components/button/button.class.d.ts.map +1 -1
- package/dist/components/button/button.class.js +4 -1
- package/dist/components/button/button.class.js.map +1 -1
- package/dist/components/button/button.styles.d.ts.map +1 -1
- package/dist/components/button/button.styles.js +16 -0
- package/dist/components/button/button.styles.js.map +1 -1
- package/dist/components/calendar/calendar.class.d.ts.map +1 -1
- package/dist/components/calendar/calendar.class.js +1 -12
- package/dist/components/calendar/calendar.class.js.map +1 -1
- package/dist/components/calendar-viewer/calendar-viewer.class.d.ts +1 -1
- package/dist/components/calendar-viewer/calendar-viewer.class.d.ts.map +1 -1
- package/dist/components/calendar-viewer/calendar-viewer.class.js +2 -2
- package/dist/components/calendar-viewer/calendar-viewer.class.js.map +1 -1
- package/dist/components/chart/box-plot.class.d.ts.map +1 -1
- package/dist/components/chart/box-plot.class.js +1 -3
- package/dist/components/chart/box-plot.class.js.map +1 -1
- package/dist/components/chart/chart.class.d.ts.map +1 -1
- package/dist/components/chart/chart.class.js +1 -3
- package/dist/components/chart/chart.class.js.map +1 -1
- package/dist/components/code-editor/code-editor.styles.d.ts.map +1 -1
- package/dist/components/code-editor/code-editor.styles.js +5 -2
- package/dist/components/code-editor/code-editor.styles.js.map +1 -1
- package/dist/components/contact-viewer/contact-viewer.class.d.ts +4 -1
- package/dist/components/contact-viewer/contact-viewer.class.d.ts.map +1 -1
- package/dist/components/contact-viewer/contact-viewer.class.js +5 -2
- package/dist/components/contact-viewer/contact-viewer.class.js.map +1 -1
- package/dist/components/email-viewer/email-viewer.class.d.ts +4 -1
- package/dist/components/email-viewer/email-viewer.class.d.ts.map +1 -1
- package/dist/components/email-viewer/email-viewer.class.js +5 -2
- package/dist/components/email-viewer/email-viewer.class.js.map +1 -1
- package/dist/components/file-icon/file-icon.class.d.ts +5 -1
- package/dist/components/file-icon/file-icon.class.d.ts.map +1 -1
- package/dist/components/file-icon/file-icon.class.js +20 -2
- package/dist/components/file-icon/file-icon.class.js.map +1 -1
- package/dist/components/file-icon/file-icon.styles.d.ts.map +1 -1
- package/dist/components/file-icon/file-icon.styles.js +4 -0
- package/dist/components/file-icon/file-icon.styles.js.map +1 -1
- package/dist/components/graph/graph.class.d.ts.map +1 -1
- package/dist/components/graph/graph.class.js +1 -3
- package/dist/components/graph/graph.class.js.map +1 -1
- package/dist/components/heatmap/heatmap.class.d.ts.map +1 -1
- package/dist/components/heatmap/heatmap.class.js +1 -8
- package/dist/components/heatmap/heatmap.class.js.map +1 -1
- package/dist/components/icon/icon.styles.d.ts.map +1 -1
- package/dist/components/icon/icon.styles.js +1 -1
- package/dist/components/icon/icon.styles.js.map +1 -1
- package/dist/components/include/include.class.d.ts +104 -0
- package/dist/components/include/include.class.d.ts.map +1 -0
- package/dist/components/include/include.class.js +149 -0
- package/dist/components/include/include.class.js.map +1 -0
- package/dist/components/include/include.d.ts +2 -0
- package/dist/components/include/include.d.ts.map +1 -0
- package/dist/components/include/include.js +5 -0
- package/dist/components/include/include.js.map +1 -0
- package/dist/components/include/include.styles.d.ts +2 -0
- package/dist/components/include/include.styles.d.ts.map +1 -0
- package/dist/components/include/include.styles.js +14 -0
- package/dist/components/include/include.styles.js.map +1 -0
- package/dist/components/kbd/kbd.class.d.ts.map +1 -1
- package/dist/components/kbd/kbd.class.js +1 -11
- package/dist/components/kbd/kbd.class.js.map +1 -1
- package/dist/components/known-date/known-date.class.d.ts +208 -0
- package/dist/components/known-date/known-date.class.d.ts.map +1 -0
- package/dist/components/known-date/known-date.class.js +588 -0
- package/dist/components/known-date/known-date.class.js.map +1 -0
- package/dist/components/known-date/known-date.d.ts +2 -0
- package/dist/components/known-date/known-date.d.ts.map +1 -0
- package/dist/components/known-date/known-date.js +5 -0
- package/dist/components/known-date/known-date.js.map +1 -0
- package/dist/components/known-date/known-date.styles.d.ts +2 -0
- package/dist/components/known-date/known-date.styles.d.ts.map +1 -0
- package/dist/components/known-date/known-date.styles.js +134 -0
- package/dist/components/known-date/known-date.styles.js.map +1 -0
- package/dist/components/lightbox/lightbox.class.d.ts +187 -0
- package/dist/components/lightbox/lightbox.class.d.ts.map +1 -0
- package/dist/components/lightbox/lightbox.class.js +415 -0
- package/dist/components/lightbox/lightbox.class.js.map +1 -0
- package/dist/components/lightbox/lightbox.d.ts +3 -0
- package/dist/components/lightbox/lightbox.d.ts.map +1 -0
- package/dist/components/lightbox/lightbox.js +6 -0
- package/dist/components/lightbox/lightbox.js.map +1 -0
- package/dist/components/lightbox/lightbox.styles.d.ts +2 -0
- package/dist/components/lightbox/lightbox.styles.d.ts.map +1 -0
- package/dist/components/lightbox/lightbox.styles.js +179 -0
- package/dist/components/lightbox/lightbox.styles.js.map +1 -0
- package/dist/components/map/map.class.d.ts.map +1 -1
- package/dist/components/map/map.class.js +11 -23
- package/dist/components/map/map.class.js.map +1 -1
- package/dist/components/menu/menu.class.d.ts +1 -1
- package/dist/components/model-settings-panel/model-settings-panel.class.d.ts.map +1 -1
- package/dist/components/model-settings-panel/model-settings-panel.class.js +1 -10
- package/dist/components/model-settings-panel/model-settings-panel.class.js.map +1 -1
- package/dist/components/qr-code/qr-code-loader.d.ts +15 -0
- package/dist/components/qr-code/qr-code-loader.d.ts.map +1 -0
- package/dist/components/qr-code/qr-code-loader.js +28 -0
- package/dist/components/qr-code/qr-code-loader.js.map +1 -0
- package/dist/components/qr-code/qr-code.class.d.ts +121 -0
- package/dist/components/qr-code/qr-code.class.d.ts.map +1 -0
- package/dist/components/qr-code/qr-code.class.js +392 -0
- package/dist/components/qr-code/qr-code.class.js.map +1 -0
- package/dist/components/qr-code/qr-code.d.ts +2 -0
- package/dist/components/qr-code/qr-code.d.ts.map +1 -0
- package/dist/components/qr-code/qr-code.js +5 -0
- package/dist/components/qr-code/qr-code.js.map +1 -0
- package/dist/components/qr-code/qr-code.styles.d.ts +2 -0
- package/dist/components/qr-code/qr-code.styles.d.ts.map +1 -0
- package/dist/components/qr-code/qr-code.styles.js +48 -0
- package/dist/components/qr-code/qr-code.styles.js.map +1 -0
- package/dist/components/random-content/random-content.class.d.ts +99 -0
- package/dist/components/random-content/random-content.class.d.ts.map +1 -0
- package/dist/components/random-content/random-content.class.js +268 -0
- package/dist/components/random-content/random-content.class.js.map +1 -0
- package/dist/components/random-content/random-content.d.ts +2 -0
- package/dist/components/random-content/random-content.d.ts.map +1 -0
- package/dist/components/random-content/random-content.js +5 -0
- package/dist/components/random-content/random-content.js.map +1 -0
- package/dist/components/random-content/random-content.styles.d.ts +2 -0
- package/dist/components/random-content/random-content.styles.d.ts.map +1 -0
- package/dist/components/random-content/random-content.styles.js +94 -0
- package/dist/components/random-content/random-content.styles.js.map +1 -0
- package/dist/components/result-card/result-card.class.d.ts +9 -8
- package/dist/components/result-card/result-card.class.d.ts.map +1 -1
- package/dist/components/result-card/result-card.class.js +7 -26
- package/dist/components/result-card/result-card.class.js.map +1 -1
- package/dist/components/result-card/result-field.class.d.ts.map +1 -1
- package/dist/components/result-card/result-field.class.js +1 -11
- package/dist/components/result-card/result-field.class.js.map +1 -1
- package/dist/components/slider/slider.class.d.ts.map +1 -1
- package/dist/components/slider/slider.class.js +1 -19
- package/dist/components/slider/slider.class.js.map +1 -1
- package/dist/components/source-card/source-card.class.d.ts +8 -7
- package/dist/components/source-card/source-card.class.d.ts.map +1 -1
- package/dist/components/source-card/source-card.class.js +6 -25
- package/dist/components/source-card/source-card.class.js.map +1 -1
- package/dist/components/stat/stat.class.js +1 -1
- package/dist/components/stat/stat.class.js.map +1 -1
- package/dist/components/swatch-picker/swatch-picker.class.d.ts +55 -0
- package/dist/components/swatch-picker/swatch-picker.class.d.ts.map +1 -0
- package/dist/components/swatch-picker/swatch-picker.class.js +120 -0
- package/dist/components/swatch-picker/swatch-picker.class.js.map +1 -0
- package/dist/components/swatch-picker/swatch-picker.d.ts +2 -0
- package/dist/components/swatch-picker/swatch-picker.d.ts.map +1 -0
- package/dist/components/swatch-picker/swatch-picker.js +5 -0
- package/dist/components/swatch-picker/swatch-picker.js.map +1 -0
- package/dist/components/swatch-picker/swatch-picker.styles.d.ts +2 -0
- package/dist/components/swatch-picker/swatch-picker.styles.d.ts.map +1 -0
- package/dist/components/swatch-picker/swatch-picker.styles.js +55 -0
- package/dist/components/swatch-picker/swatch-picker.styles.js.map +1 -0
- package/dist/components/time-range/time-range.class.d.ts.map +1 -1
- package/dist/components/time-range/time-range.class.js +1 -21
- package/dist/components/time-range/time-range.class.js.map +1 -1
- package/dist/components/timeline/timeline-item.class.d.ts +120 -0
- package/dist/components/timeline/timeline-item.class.d.ts.map +1 -0
- package/dist/components/timeline/timeline-item.class.js +203 -0
- package/dist/components/timeline/timeline-item.class.js.map +1 -0
- package/dist/components/timeline/timeline-item.d.ts +3 -0
- package/dist/components/timeline/timeline-item.d.ts.map +1 -0
- package/dist/components/timeline/timeline-item.js +10 -0
- package/dist/components/timeline/timeline-item.js.map +1 -0
- package/dist/components/timeline/timeline-item.styles.d.ts +2 -0
- package/dist/components/timeline/timeline-item.styles.d.ts.map +1 -0
- package/dist/components/timeline/timeline-item.styles.js +149 -0
- package/dist/components/timeline/timeline-item.styles.js.map +1 -0
- package/dist/components/timeline/timeline.class.d.ts +59 -0
- package/dist/components/timeline/timeline.class.d.ts.map +1 -0
- package/dist/components/timeline/timeline.class.js +100 -0
- package/dist/components/timeline/timeline.class.js.map +1 -0
- package/dist/components/timeline/timeline.d.ts +2 -0
- package/dist/components/timeline/timeline.d.ts.map +1 -0
- package/dist/components/timeline/timeline.js +5 -0
- package/dist/components/timeline/timeline.js.map +1 -0
- package/dist/components/timeline/timeline.styles.d.ts +2 -0
- package/dist/components/timeline/timeline.styles.d.ts.map +1 -0
- package/dist/components/timeline/timeline.styles.js +52 -0
- package/dist/components/timeline/timeline.styles.js.map +1 -0
- package/dist/components/toast/toast-item.class.d.ts.map +1 -1
- package/dist/components/toast/toast-item.class.js +1 -3
- package/dist/components/toast/toast-item.class.js.map +1 -1
- package/dist/components/tool-param-form/tool-param-form.class.d.ts.map +1 -1
- package/dist/components/tool-param-form/tool-param-form.class.js +0 -1
- package/dist/components/tool-param-form/tool-param-form.class.js.map +1 -1
- package/dist/components/tour/tour.class.d.ts +250 -0
- package/dist/components/tour/tour.class.d.ts.map +1 -0
- package/dist/components/tour/tour.class.js +530 -0
- package/dist/components/tour/tour.class.js.map +1 -0
- package/dist/components/tour/tour.d.ts +2 -0
- package/dist/components/tour/tour.d.ts.map +1 -0
- package/dist/components/tour/tour.js +5 -0
- package/dist/components/tour/tour.js.map +1 -0
- package/dist/components/tour/tour.styles.d.ts +2 -0
- package/dist/components/tour/tour.styles.d.ts.map +1 -0
- package/dist/components/tour/tour.styles.js +165 -0
- package/dist/components/tour/tour.styles.js.map +1 -0
- package/dist/components/virtual-list/virtual-list.class.d.ts.map +1 -1
- package/dist/components/virtual-list/virtual-list.class.js +1 -3
- package/dist/components/virtual-list/virtual-list.class.js.map +1 -1
- package/dist/components/word-cloud/word-cloud.class.d.ts.map +1 -1
- package/dist/components/word-cloud/word-cloud.class.js +1 -8
- package/dist/components/word-cloud/word-cloud.class.js.map +1 -1
- package/dist/components/zoomable-frame/zoomable-frame.class.d.ts +15 -0
- package/dist/components/zoomable-frame/zoomable-frame.class.d.ts.map +1 -1
- package/dist/components/zoomable-frame/zoomable-frame.class.js +18 -0
- package/dist/components/zoomable-frame/zoomable-frame.class.js.map +1 -1
- package/dist/internal/a11y.d.ts +4 -0
- package/dist/internal/a11y.d.ts.map +1 -1
- package/dist/internal/a11y.js +17 -0
- package/dist/internal/a11y.js.map +1 -1
- package/dist/internal/canvas.d.ts +8 -0
- package/dist/internal/canvas.d.ts.map +1 -0
- package/dist/internal/canvas.js +14 -0
- package/dist/internal/canvas.js.map +1 -0
- package/dist/internal/localization.d.ts +1 -1
- package/dist/internal/localization.d.ts.map +1 -1
- package/dist/internal/localization.js +21 -2
- package/dist/internal/localization.js.map +1 -1
- package/dist/internal/motion.d.ts +5 -0
- package/dist/internal/motion.d.ts.map +1 -0
- package/dist/internal/motion.js +7 -0
- package/dist/internal/motion.js.map +1 -0
- package/dist/internal/numbers.d.ts +11 -0
- package/dist/internal/numbers.d.ts.map +1 -1
- package/dist/internal/numbers.js +21 -0
- package/dist/internal/numbers.js.map +1 -1
- package/dist/internal/positioner.d.ts +14 -0
- package/dist/internal/positioner.d.ts.map +1 -1
- package/dist/internal/positioner.js +27 -0
- package/dist/internal/positioner.js.map +1 -1
- package/dist/internal/root-registration-allowlist.d.ts +1 -1
- package/dist/internal/root-registration-allowlist.d.ts.map +1 -1
- package/dist/internal/root-registration-allowlist.js +12 -0
- package/dist/internal/root-registration-allowlist.js.map +1 -1
- package/dist/internal/rtl.d.ts +0 -11
- package/dist/internal/rtl.d.ts.map +1 -1
- package/dist/internal/rtl.js +0 -13
- package/dist/internal/rtl.js.map +1 -1
- package/dist/internal/safe-css.d.ts +15 -0
- package/dist/internal/safe-css.d.ts.map +1 -0
- package/dist/internal/safe-css.js +25 -0
- package/dist/internal/safe-css.js.map +1 -0
- package/dist/internal/strip-host-title.d.ts +24 -0
- package/dist/internal/strip-host-title.d.ts.map +1 -0
- package/dist/internal/strip-host-title.js +46 -0
- package/dist/internal/strip-host-title.js.map +1 -0
- package/dist/internal/tokens.styles.d.ts.map +1 -1
- package/dist/internal/tokens.styles.js +4 -0
- package/dist/internal/tokens.styles.js.map +1 -1
- package/dist/lyra.d.ts +37 -0
- package/dist/lyra.d.ts.map +1 -1
- package/dist/lyra.js +24 -0
- package/dist/lyra.js.map +1 -1
- package/llms-full.txt +161 -5
- package/llms.txt +5 -2
- package/package.json +43 -6
- package/vscode-css-data.json +733 -0
- package/vscode-html-data.json +10616 -0
- package/web-types.json +12206 -0
|
@@ -0,0 +1,392 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
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;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import { html } from 'lit';
|
|
8
|
+
import { property, query, state } from 'lit/decorators.js';
|
|
9
|
+
import { styleMap } from 'lit/directives/style-map.js';
|
|
10
|
+
import { LyraElement } from '../../internal/lyra-element.js';
|
|
11
|
+
import { finiteRange } from '../../internal/numbers.js';
|
|
12
|
+
import { getScratchCtx } from '../../internal/canvas.js';
|
|
13
|
+
import { loadQrCodeCached } from './qr-code-loader.js';
|
|
14
|
+
import { styles } from './qr-code.styles.js';
|
|
15
|
+
const DEFAULT_SIZE = 128;
|
|
16
|
+
const MIN_SIZE = 1;
|
|
17
|
+
/**
|
|
18
|
+
* An untrusted `size` drives the canvas backing-store allocation directly
|
|
19
|
+
* (`size * devicePixelRatio` per side, i.e. RGBA pixel data on the order of
|
|
20
|
+
* `4 * (size * dpr) ** 2` bytes). Keeping it within this bound avoids an
|
|
21
|
+
* attacker- or typo-supplied value turning a single QR code into an
|
|
22
|
+
* unbounded allocation.
|
|
23
|
+
*/
|
|
24
|
+
const MAX_SIZE = 2048;
|
|
25
|
+
const DEFAULT_RADIUS = 0;
|
|
26
|
+
const MIN_RADIUS = 0;
|
|
27
|
+
const MAX_RADIUS = 0.5;
|
|
28
|
+
const DEFAULT_ERROR_CORRECTION = 'H';
|
|
29
|
+
const ERROR_CORRECTION_LEVELS = new Set(['L', 'M', 'Q', 'H']);
|
|
30
|
+
/**
|
|
31
|
+
* The optional `qrcode` peer's own default renderer bakes a 4-module light
|
|
32
|
+
* margin around the symbol (its `renderer/utils.js`, `margin` defaults to
|
|
33
|
+
* `4`). Reproduced here so this component is scannable out of the box with
|
|
34
|
+
* zero consumer configuration -- not a public property (an ambient host CSS
|
|
35
|
+
* `padding` adds further breathing room on top of this, but is not a
|
|
36
|
+
* substitute for it).
|
|
37
|
+
*/
|
|
38
|
+
const QUIET_ZONE_MODULES = 4;
|
|
39
|
+
const FALLBACK_FILL = '#000000';
|
|
40
|
+
const FALLBACK_BACKGROUND = '#ffffff';
|
|
41
|
+
function normalizeErrorCorrection(value) {
|
|
42
|
+
const upper = value.toUpperCase();
|
|
43
|
+
return (ERROR_CORRECTION_LEVELS.has(upper) ? upper : DEFAULT_ERROR_CORRECTION);
|
|
44
|
+
}
|
|
45
|
+
const errorCorrectionConverter = {
|
|
46
|
+
fromAttribute(value) {
|
|
47
|
+
return value === null ? DEFAULT_ERROR_CORRECTION : normalizeErrorCorrection(value);
|
|
48
|
+
},
|
|
49
|
+
toAttribute(value) {
|
|
50
|
+
return normalizeErrorCorrection(value);
|
|
51
|
+
},
|
|
52
|
+
};
|
|
53
|
+
const warnedInvalidColors = new Set();
|
|
54
|
+
function warnInvalidColor(value) {
|
|
55
|
+
if (warnedInvalidColors.has(value))
|
|
56
|
+
return;
|
|
57
|
+
warnedInvalidColors.add(value);
|
|
58
|
+
console.warn(`<lyra-qr-code> could not parse "${value}" (set via --lyra-qr-code-fill/-background) as a CSS ` +
|
|
59
|
+
'color; falling back to the default.');
|
|
60
|
+
}
|
|
61
|
+
/**
|
|
62
|
+
* Validates `value` as a syntactically valid CSS `<color>` via a canvas `fillStyle` sentinel
|
|
63
|
+
* round-trip (mirrors `LyraHeatmap`'s `resolveRgb()`) and returns it unchanged when it parses --
|
|
64
|
+
* `ctx.fillStyle` already accepts the full CSS color grammar natively, so no hex/RGB decomposition
|
|
65
|
+
* is needed here, only a validity check. Falls back to `fallbackHex` (with a one-time
|
|
66
|
+
* `console.warn`, deduplicated per distinct bad value) when it doesn't.
|
|
67
|
+
*/
|
|
68
|
+
function resolveQrColor(value, fallbackHex) {
|
|
69
|
+
const ctx = getScratchCtx();
|
|
70
|
+
if (!ctx)
|
|
71
|
+
return fallbackHex;
|
|
72
|
+
const sentinel = 'rgb(1, 2, 3)';
|
|
73
|
+
ctx.fillStyle = sentinel;
|
|
74
|
+
const sentinelNormalized = ctx.fillStyle;
|
|
75
|
+
ctx.fillStyle = value;
|
|
76
|
+
if (ctx.fillStyle === sentinelNormalized && value.trim() !== sentinel) {
|
|
77
|
+
warnInvalidColor(value);
|
|
78
|
+
return fallbackHex;
|
|
79
|
+
}
|
|
80
|
+
return value;
|
|
81
|
+
}
|
|
82
|
+
/**
|
|
83
|
+
* `<lyra-qr-code>` -- encodes `value` as a QR symbol with the optional
|
|
84
|
+
* `qrcode` peer dependency (Reed-Solomon error correction and every other
|
|
85
|
+
* algorithmic step of the QR spec is delegated to that library, never
|
|
86
|
+
* hand-rolled) and draws the resulting module matrix onto a canvas itself,
|
|
87
|
+
* one square (optionally rounded) cell per module, with a light quiet-zone
|
|
88
|
+
* margin baked in around the symbol so it stays scannable out of the box
|
|
89
|
+
* with zero consumer configuration. Extra host CSS `padding` around the
|
|
90
|
+
* element adds further breathing room on top of that baked-in margin, but is
|
|
91
|
+
* not required for baseline scannability.
|
|
92
|
+
*
|
|
93
|
+
* The canvas -- not the host -- owns `role="img"` and the accessible name,
|
|
94
|
+
* since it is the one meaningful descendant here (mirrors
|
|
95
|
+
* `lyra-file-icon`'s single-image pattern rather than the composite-group
|
|
96
|
+
* pattern used by `lyra-heatmap`/`lyra-word-cloud`). The accessible name
|
|
97
|
+
* resolves, in order: `label`, then a host `aria-label` attribute (forwarded
|
|
98
|
+
* onto the canvas), then `value` itself. An empty `value` renders
|
|
99
|
+
* `[part="empty"]` instead of an `img`-role element -- there is nothing to
|
|
100
|
+
* encode or name.
|
|
101
|
+
*
|
|
102
|
+
* `--lyra-qr-code-fill`/`--lyra-qr-code-background` (dark/light modules)
|
|
103
|
+
* default to `--lyra-color-text`/`--lyra-color-surface`, which -- like every
|
|
104
|
+
* semantic token in this library -- flip under a dark theme. That means the
|
|
105
|
+
* *default* rendering under a dark theme is a polarity-inverted QR code
|
|
106
|
+
* (light modules on a dark background) rather than the conventional
|
|
107
|
+
* dark-on-light. Contrast itself stays strong in both themes (these are the
|
|
108
|
+
* app's own high-contrast text/surface pair), so human legibility is
|
|
109
|
+
* unaffected -- only third-party barcode *scanner* robustness across
|
|
110
|
+
* less-tolerant scanning apps is the residual, consumer-overridable risk. A
|
|
111
|
+
* consumer needing guaranteed cross-scanner compatibility regardless of page
|
|
112
|
+
* theme should pin `--lyra-qr-code-fill: #000` / `--lyra-qr-code-background:
|
|
113
|
+
* #fff` explicitly at the point of use.
|
|
114
|
+
*
|
|
115
|
+
* Deliberately out of scope for this component, not oversights: logo/image
|
|
116
|
+
* embedding; a finder-pattern-corner accent color; auto-shrinking to fit a
|
|
117
|
+
* narrow container (this component's `size` is a direct request for a
|
|
118
|
+
* specific rendered pixel density, like `<img width height>` -- the consumer
|
|
119
|
+
* picks a size that fits their layout, this component never second-guesses
|
|
120
|
+
* it, though it still renders correctly at its default size inside a narrow
|
|
121
|
+
* allocation); form association (`value` is caller-supplied display data the
|
|
122
|
+
* user doesn't edit through this component -- no `FormAssociated` mixin, no
|
|
123
|
+
* label/hint/error chrome, no `ElementInternals`); and any
|
|
124
|
+
* motion/`prefers-reduced-motion` branch (nothing here animates). Keyboard
|
|
125
|
+
* focus is likewise intentionally absent -- the canvas is a static image
|
|
126
|
+
* standing in for `value`, structurally like `<img>`, not an interactive
|
|
127
|
+
* grid.
|
|
128
|
+
*
|
|
129
|
+
* @customElement lyra-qr-code
|
|
130
|
+
* @csspart base - The outer wrapper, sized to `size`×`size` CSS px in every state.
|
|
131
|
+
* @csspart canvas - The rendered QR code canvas.
|
|
132
|
+
* @csspart empty - Shown when `value` is empty.
|
|
133
|
+
* @csspart loading - Shown while the optional `qrcode` peer is loading, the first time it's needed.
|
|
134
|
+
* @csspart error - Shown when the peer is missing, or `value` failed to encode.
|
|
135
|
+
* @cssprop [--lyra-qr-code-fill=var(--lyra-color-text)] - Dark/foreground module color.
|
|
136
|
+
* @cssprop [--lyra-qr-code-background=var(--lyra-color-surface)] - Light/background module color, including the quiet zone.
|
|
137
|
+
*/
|
|
138
|
+
export class LyraQrCode extends LyraElement {
|
|
139
|
+
constructor() {
|
|
140
|
+
super(...arguments);
|
|
141
|
+
/** The data to encode. Empty renders `[part="empty"]` -- no encode is attempted. */
|
|
142
|
+
this.value = '';
|
|
143
|
+
/** Accessible-name override. Falls back through `aria-label` then `value` -- see the class doc
|
|
144
|
+
* comment for the full precedence order. Caller-supplied data, not routed through `localize()`. */
|
|
145
|
+
this.label = '';
|
|
146
|
+
this._size = DEFAULT_SIZE;
|
|
147
|
+
this._radius = DEFAULT_RADIUS;
|
|
148
|
+
this._errorCorrection = DEFAULT_ERROR_CORRECTION;
|
|
149
|
+
this.loadState = { kind: 'empty' };
|
|
150
|
+
/** Injectable loader seam -- overridden directly by tests with a synchronous fake instead of
|
|
151
|
+
* needing the real `qrcode` package to load in the test browser (mirrors `LyraPdfViewer`'s
|
|
152
|
+
* `loadLibrary` field). */
|
|
153
|
+
this.loadLibrary = loadQrCodeCached;
|
|
154
|
+
this.generation = 0;
|
|
155
|
+
this.themeRefreshQueued = false;
|
|
156
|
+
this.onDprChange = () => {
|
|
157
|
+
this.watchDpr();
|
|
158
|
+
this.draw();
|
|
159
|
+
};
|
|
160
|
+
this.onColorSchemeChange = () => {
|
|
161
|
+
this.refreshTheme();
|
|
162
|
+
};
|
|
163
|
+
this.queueThemeRefresh = () => {
|
|
164
|
+
if (this.themeRefreshQueued)
|
|
165
|
+
return;
|
|
166
|
+
this.themeRefreshQueued = true;
|
|
167
|
+
queueMicrotask(() => {
|
|
168
|
+
this.themeRefreshQueued = false;
|
|
169
|
+
if (this.isConnected)
|
|
170
|
+
this.refreshTheme();
|
|
171
|
+
});
|
|
172
|
+
};
|
|
173
|
+
}
|
|
174
|
+
static { this.styles = [LyraElement.styles, styles]; }
|
|
175
|
+
/** CSS-px side length of the square canvas, clamped to `[1, 2048]`. */
|
|
176
|
+
get size() {
|
|
177
|
+
return this._size;
|
|
178
|
+
}
|
|
179
|
+
set size(value) {
|
|
180
|
+
const oldValue = this._size;
|
|
181
|
+
this._size = finiteRange(value, DEFAULT_SIZE, MIN_SIZE, MAX_SIZE);
|
|
182
|
+
this.requestUpdate('size', oldValue);
|
|
183
|
+
}
|
|
184
|
+
/** Per-module corner radius, as a fraction of one module's side length -- `0` (default) for
|
|
185
|
+
* square modules, `0.5` for fully round/pill modules. Clamped to `[0, 0.5]`. */
|
|
186
|
+
get radius() {
|
|
187
|
+
return this._radius;
|
|
188
|
+
}
|
|
189
|
+
set radius(value) {
|
|
190
|
+
const oldValue = this._radius;
|
|
191
|
+
this._radius = finiteRange(value, DEFAULT_RADIUS, MIN_RADIUS, MAX_RADIUS);
|
|
192
|
+
this.requestUpdate('radius', oldValue);
|
|
193
|
+
}
|
|
194
|
+
/** QR error-correction level. Normalized (upper-cased, validated against `L`/`M`/`Q`/`H`,
|
|
195
|
+
* falling back to `H`) on every assignment, attribute or property, so it's never a transient
|
|
196
|
+
* garbage value. */
|
|
197
|
+
get errorCorrection() {
|
|
198
|
+
return this._errorCorrection;
|
|
199
|
+
}
|
|
200
|
+
set errorCorrection(value) {
|
|
201
|
+
const oldValue = this._errorCorrection;
|
|
202
|
+
this._errorCorrection = normalizeErrorCorrection(value);
|
|
203
|
+
this.requestUpdate('errorCorrection', oldValue);
|
|
204
|
+
}
|
|
205
|
+
connectedCallback() {
|
|
206
|
+
super.connectedCallback();
|
|
207
|
+
this.watchDpr();
|
|
208
|
+
this.watchTheme();
|
|
209
|
+
}
|
|
210
|
+
disconnectedCallback() {
|
|
211
|
+
super.disconnectedCallback();
|
|
212
|
+
this.dprQuery?.removeEventListener('change', this.onDprChange);
|
|
213
|
+
this.colorSchemeQuery?.removeEventListener('change', this.onColorSchemeChange);
|
|
214
|
+
this.themeObserver?.disconnect();
|
|
215
|
+
this.themeObserver = undefined;
|
|
216
|
+
}
|
|
217
|
+
watchDpr() {
|
|
218
|
+
// A MediaQueryList's `matches` is fixed at creation time, so crossing the DPR threshold it
|
|
219
|
+
// was built for means building a fresh one for the new ratio -- remove the previous
|
|
220
|
+
// instance's listener first, or it leaks.
|
|
221
|
+
this.dprQuery?.removeEventListener('change', this.onDprChange);
|
|
222
|
+
this.dprQuery = matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`);
|
|
223
|
+
this.dprQuery.addEventListener('change', this.onDprChange);
|
|
224
|
+
}
|
|
225
|
+
watchTheme() {
|
|
226
|
+
const view = this.ownerDocument.defaultView;
|
|
227
|
+
if (!view)
|
|
228
|
+
return;
|
|
229
|
+
this.colorSchemeQuery = view.matchMedia?.('(prefers-color-scheme: dark)');
|
|
230
|
+
this.colorSchemeQuery?.addEventListener('change', this.onColorSchemeChange);
|
|
231
|
+
if (typeof MutationObserver === 'undefined')
|
|
232
|
+
return;
|
|
233
|
+
const targets = [this];
|
|
234
|
+
let parent = this.parentElement;
|
|
235
|
+
while (parent) {
|
|
236
|
+
targets.push(parent);
|
|
237
|
+
parent = parent.parentElement;
|
|
238
|
+
}
|
|
239
|
+
this.themeObserver = new MutationObserver(this.queueThemeRefresh);
|
|
240
|
+
for (const target of targets) {
|
|
241
|
+
this.themeObserver.observe(target, {
|
|
242
|
+
attributes: true,
|
|
243
|
+
attributeFilter: ['class', 'style', 'data-theme', 'data-color-scheme'],
|
|
244
|
+
});
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
updated(changed) {
|
|
248
|
+
if (changed.has('value') || changed.has('errorCorrection') || !this.hasUpdated) {
|
|
249
|
+
this.scheduleAfterUpdate(() => {
|
|
250
|
+
void this.generate();
|
|
251
|
+
});
|
|
252
|
+
return;
|
|
253
|
+
}
|
|
254
|
+
if (this.loadState.kind === 'ready' &&
|
|
255
|
+
(changed.has('size') || changed.has('radius') || changed.has('loadState'))) {
|
|
256
|
+
this.draw();
|
|
257
|
+
}
|
|
258
|
+
}
|
|
259
|
+
/** Re-encodes `value` via the optional `qrcode` peer's `create()` and caches the resulting
|
|
260
|
+
* module matrix. Redraw-only geometry changes (`size`/`radius`) and theme/DPR refreshes never
|
|
261
|
+
* call this -- see the class doc comment and `updated()`'s dispatch. */
|
|
262
|
+
async generate() {
|
|
263
|
+
const generation = ++this.generation;
|
|
264
|
+
if (!this.value) {
|
|
265
|
+
this.loadState = { kind: 'empty' };
|
|
266
|
+
return;
|
|
267
|
+
}
|
|
268
|
+
this.loadState = { kind: 'loading' };
|
|
269
|
+
const api = await this.loadLibrary();
|
|
270
|
+
if (generation !== this.generation || !this.isConnected)
|
|
271
|
+
return;
|
|
272
|
+
if (!api) {
|
|
273
|
+
this.loadState = { kind: 'error', message: this.localize('qrCodeMissingLibrary') };
|
|
274
|
+
return;
|
|
275
|
+
}
|
|
276
|
+
try {
|
|
277
|
+
const result = api.create(this.value, { errorCorrectionLevel: this.errorCorrection });
|
|
278
|
+
if (generation !== this.generation)
|
|
279
|
+
return;
|
|
280
|
+
this.loadState = { kind: 'ready', modules: result.modules };
|
|
281
|
+
}
|
|
282
|
+
catch {
|
|
283
|
+
if (generation !== this.generation)
|
|
284
|
+
return;
|
|
285
|
+
this.loadState = { kind: 'error', message: this.localize('qrCodeGenerationFailed') };
|
|
286
|
+
}
|
|
287
|
+
}
|
|
288
|
+
/** Redraws canvas content after an upstream token, theme, or DPR change -- reuses the already-
|
|
289
|
+
* cached module matrix rather than re-encoding `value`. No global theme-broadcast event exists
|
|
290
|
+
* in lyra-ui to subscribe to automatically; call this from a consumer's own theme-toggle handler. */
|
|
291
|
+
refreshTheme() {
|
|
292
|
+
this.draw();
|
|
293
|
+
}
|
|
294
|
+
fillColor() {
|
|
295
|
+
const raw = getComputedStyle(this).getPropertyValue('--lyra-qr-code-fill').trim() || FALLBACK_FILL;
|
|
296
|
+
return resolveQrColor(raw, FALLBACK_FILL);
|
|
297
|
+
}
|
|
298
|
+
backgroundColor() {
|
|
299
|
+
const raw = getComputedStyle(this).getPropertyValue('--lyra-qr-code-background').trim() || FALLBACK_BACKGROUND;
|
|
300
|
+
return resolveQrColor(raw, FALLBACK_BACKGROUND);
|
|
301
|
+
}
|
|
302
|
+
draw() {
|
|
303
|
+
if (this.loadState.kind !== 'ready')
|
|
304
|
+
return;
|
|
305
|
+
const canvas = this.canvasEl;
|
|
306
|
+
if (!canvas)
|
|
307
|
+
return;
|
|
308
|
+
const { modules } = this.loadState;
|
|
309
|
+
const dpr = window.devicePixelRatio || 1;
|
|
310
|
+
const size = this.size;
|
|
311
|
+
canvas.width = Math.round(size * dpr);
|
|
312
|
+
canvas.height = Math.round(size * dpr);
|
|
313
|
+
canvas.style.width = `${size}px`;
|
|
314
|
+
canvas.style.height = `${size}px`;
|
|
315
|
+
const ctx = canvas.getContext('2d');
|
|
316
|
+
if (!ctx)
|
|
317
|
+
return;
|
|
318
|
+
ctx.scale(dpr, dpr);
|
|
319
|
+
const background = this.backgroundColor();
|
|
320
|
+
const fill = this.fillColor();
|
|
321
|
+
ctx.fillStyle = background;
|
|
322
|
+
ctx.fillRect(0, 0, size, size);
|
|
323
|
+
const moduleCount = modules.size;
|
|
324
|
+
if (moduleCount <= 0)
|
|
325
|
+
return;
|
|
326
|
+
const moduleSize = size / (moduleCount + QUIET_ZONE_MODULES * 2);
|
|
327
|
+
const offset = QUIET_ZONE_MODULES * moduleSize;
|
|
328
|
+
const radiusPx = this.radius * moduleSize;
|
|
329
|
+
// `roundRect` is broadly supported in evergreen engines but guarded defensively for older ones
|
|
330
|
+
// (see the class doc comment's rendering rationale).
|
|
331
|
+
const canRoundRect = typeof ctx.roundRect === 'function';
|
|
332
|
+
ctx.fillStyle = fill;
|
|
333
|
+
for (let row = 0; row < moduleCount; row++) {
|
|
334
|
+
for (let col = 0; col < moduleCount; col++) {
|
|
335
|
+
if (!modules.get(row, col))
|
|
336
|
+
continue;
|
|
337
|
+
const x = offset + col * moduleSize;
|
|
338
|
+
const y = offset + row * moduleSize;
|
|
339
|
+
if (this.radius > 0 && canRoundRect) {
|
|
340
|
+
ctx.beginPath();
|
|
341
|
+
ctx.roundRect(x, y, moduleSize, moduleSize, radiusPx);
|
|
342
|
+
ctx.fill();
|
|
343
|
+
}
|
|
344
|
+
else {
|
|
345
|
+
ctx.fillRect(x, y, moduleSize, moduleSize);
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
}
|
|
349
|
+
}
|
|
350
|
+
accessibleName() {
|
|
351
|
+
return this.label || this.getAttribute('aria-label') || this.value;
|
|
352
|
+
}
|
|
353
|
+
renderBody() {
|
|
354
|
+
switch (this.loadState.kind) {
|
|
355
|
+
case 'empty':
|
|
356
|
+
return html `<div part="empty">${this.localize('noData')}</div>`;
|
|
357
|
+
case 'loading':
|
|
358
|
+
return html `<div part="loading">${this.localize('loading')}</div>`;
|
|
359
|
+
case 'error':
|
|
360
|
+
return html `<div part="error" role="alert">${this.loadState.message}</div>`;
|
|
361
|
+
case 'ready':
|
|
362
|
+
return html `<canvas part="canvas" role="img" aria-label=${this.accessibleName()}></canvas>`;
|
|
363
|
+
}
|
|
364
|
+
}
|
|
365
|
+
render() {
|
|
366
|
+
return html `<div part="base" style=${styleMap({ inlineSize: `${this.size}px`, blockSize: `${this.size}px` })}>
|
|
367
|
+
${this.renderBody()}
|
|
368
|
+
</div>`;
|
|
369
|
+
}
|
|
370
|
+
}
|
|
371
|
+
__decorate([
|
|
372
|
+
property()
|
|
373
|
+
], LyraQrCode.prototype, "value", void 0);
|
|
374
|
+
__decorate([
|
|
375
|
+
property()
|
|
376
|
+
], LyraQrCode.prototype, "label", void 0);
|
|
377
|
+
__decorate([
|
|
378
|
+
property({ type: Number })
|
|
379
|
+
], LyraQrCode.prototype, "size", null);
|
|
380
|
+
__decorate([
|
|
381
|
+
property({ type: Number })
|
|
382
|
+
], LyraQrCode.prototype, "radius", null);
|
|
383
|
+
__decorate([
|
|
384
|
+
property({ attribute: 'error-correction', converter: errorCorrectionConverter })
|
|
385
|
+
], LyraQrCode.prototype, "errorCorrection", null);
|
|
386
|
+
__decorate([
|
|
387
|
+
query('canvas')
|
|
388
|
+
], LyraQrCode.prototype, "canvasEl", void 0);
|
|
389
|
+
__decorate([
|
|
390
|
+
state()
|
|
391
|
+
], LyraQrCode.prototype, "loadState", void 0);
|
|
392
|
+
//# sourceMappingURL=qr-code.class.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"qr-code.class.js","sourceRoot":"","sources":["../../../src/components/qr-code/qr-code.class.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"qr-code.d.ts","sourceRoot":"","sources":["../../../src/components/qr-code/qr-code.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"qr-code.js","sourceRoot":"","sources":["../../../src/components/qr-code/qr-code.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,aAAa,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"qr-code.styles.d.ts","sourceRoot":"","sources":["../../../src/components/qr-code/qr-code.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBA6ClB,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `
|
|
3
|
+
:host {
|
|
4
|
+
display: inline-flex;
|
|
5
|
+
/* Dark/foreground modules. Canvas can't consume var() directly, so
|
|
6
|
+
qr-code.class.ts resolves this via getComputedStyle at draw time --
|
|
7
|
+
same resolve-via-getComputedStyle pattern as lyra-heatmap's ramp
|
|
8
|
+
endpoints. NOTE: --lyra-color-text flips under a dark theme (like
|
|
9
|
+
every semantic token in tokens.styles.ts), so the *default* rendering
|
|
10
|
+
under a dark theme is a polarity-inverted QR code (light modules on a
|
|
11
|
+
dark background), not the conventional dark-on-light -- see the class
|
|
12
|
+
doc comment. Human legibility is unaffected, but a consumer needing
|
|
13
|
+
guaranteed cross-scanner compatibility regardless of page theme
|
|
14
|
+
should pin --lyra-qr-code-fill/-background explicitly. */
|
|
15
|
+
--lyra-qr-code-fill: var(--lyra-color-text);
|
|
16
|
+
/* Light/background modules, including the quiet zone -- same pattern. */
|
|
17
|
+
--lyra-qr-code-background: var(--lyra-color-surface);
|
|
18
|
+
}
|
|
19
|
+
[part='base'] {
|
|
20
|
+
display: inline-flex;
|
|
21
|
+
align-items: center;
|
|
22
|
+
justify-content: center;
|
|
23
|
+
overflow: hidden;
|
|
24
|
+
}
|
|
25
|
+
canvas {
|
|
26
|
+
display: block;
|
|
27
|
+
}
|
|
28
|
+
[part='empty'],
|
|
29
|
+
[part='loading'],
|
|
30
|
+
[part='error'] {
|
|
31
|
+
display: flex;
|
|
32
|
+
align-items: center;
|
|
33
|
+
justify-content: center;
|
|
34
|
+
inline-size: 100%;
|
|
35
|
+
block-size: 100%;
|
|
36
|
+
padding-inline: var(--lyra-space-s);
|
|
37
|
+
font-size: var(--lyra-font-size-sm);
|
|
38
|
+
text-align: start;
|
|
39
|
+
}
|
|
40
|
+
[part='empty'],
|
|
41
|
+
[part='loading'] {
|
|
42
|
+
color: var(--lyra-color-text-quiet);
|
|
43
|
+
}
|
|
44
|
+
[part='error'] {
|
|
45
|
+
color: var(--lyra-color-danger);
|
|
46
|
+
}
|
|
47
|
+
`;
|
|
48
|
+
//# sourceMappingURL=qr-code.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"qr-code.styles.js","sourceRoot":"","sources":["../../../src/components/qr-code/qr-code.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6CxB,CAAC"}
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
import { type PropertyValues, type TemplateResult } from 'lit';
|
|
2
|
+
import { LyraElement } from '../../internal/lyra-element.js';
|
|
3
|
+
export type LyraRandomContentAnimation = 'none' | 'fade' | 'fade-up' | 'fade-down' | 'fade-left' | 'fade-right';
|
|
4
|
+
export type LyraRandomContentMode = 'unique' | 'random' | 'sequence';
|
|
5
|
+
export interface LyraRandomContentEventMap {
|
|
6
|
+
'lyra-content-change': CustomEvent<{
|
|
7
|
+
items: HTMLElement[];
|
|
8
|
+
}>;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* `<lyra-random-content>` — displays a randomly (or sequentially) chosen
|
|
12
|
+
* subset of its slotted children and hides the rest, for A/B copy testing,
|
|
13
|
+
* testimonial/quote rotation, or varying marketing copy on each render or
|
|
14
|
+
* interval without any custom JS beyond slotting the candidates.
|
|
15
|
+
*
|
|
16
|
+
* Not a form-associated control and has no textual chrome of its own — a
|
|
17
|
+
* pure content-rotation primitive over caller-supplied children, so the
|
|
18
|
+
* label/hint/error frame doesn't apply.
|
|
19
|
+
*
|
|
20
|
+
* The host renders `display: block` by default, like the rest of this
|
|
21
|
+
* family. A consumer needing an inline text-fragment swap inside a sentence
|
|
22
|
+
* can override `lyra-random-content { display: inline; }` from outside —
|
|
23
|
+
* that isn't baked in here, since `display: contents` on the host risks
|
|
24
|
+
* accessibility-tree inconsistencies across engines.
|
|
25
|
+
*
|
|
26
|
+
* There is no built-in trigger UI (no next/previous/shuffle button):
|
|
27
|
+
* selection is driven only by `autoplay`/`autoplayInterval` and the public
|
|
28
|
+
* `randomize()` method. Consequently there is no keyboard interaction and no
|
|
29
|
+
* RTL-aware arrow-key handling to implement here — that guarantee only
|
|
30
|
+
* applies to components with roving/arrow-key navigation, which this one
|
|
31
|
+
* structurally lacks.
|
|
32
|
+
*
|
|
33
|
+
* `fade-left`/`fade-right` are physical-direction transforms (matching the
|
|
34
|
+
* upstream naming this component mirrors), not "previous/next" navigational
|
|
35
|
+
* semantics like a carousel chevron, so they are deliberately **not**
|
|
36
|
+
* mirrored under `:host(:dir(rtl))`.
|
|
37
|
+
*
|
|
38
|
+
* @customElement lyra-random-content
|
|
39
|
+
* @slot - The pool of candidate children. Only direct element children are eligible.
|
|
40
|
+
* @event lyra-content-change - The displayed selection changed (first render, `randomize()`,
|
|
41
|
+
* a slot-change-triggered reselection, or an autoplay tick). `detail: { items }` is the exact
|
|
42
|
+
* array of elements now shown, in display order. Not emitted when the eligible pool is empty.
|
|
43
|
+
* @csspart base - The wrapping element around the default slot.
|
|
44
|
+
* @cssprop [--lyra-random-content-animation-duration=300ms] - Duration of the entrance animation.
|
|
45
|
+
* @cssprop [--lyra-random-content-animation-easing=ease] - Easing function for the entrance animation.
|
|
46
|
+
* @cssprop [--lyra-random-content-animation-translate=var(--lyra-size-0-5em)] - Translation distance for directional animations.
|
|
47
|
+
*/
|
|
48
|
+
export declare class LyraRandomContent extends LyraElement<LyraRandomContentEventMap> {
|
|
49
|
+
static styles: import("lit").CSSResultGroup[];
|
|
50
|
+
/** Entrance effect applied to a child the instant it becomes shown. */
|
|
51
|
+
animation: LyraRandomContentAnimation;
|
|
52
|
+
/** Whether the displayed selection automatically re-rolls on an interval. */
|
|
53
|
+
autoplay: boolean;
|
|
54
|
+
/** Milliseconds between autoplay ticks. Clamped to a 1000ms floor. */
|
|
55
|
+
autoplayInterval: number;
|
|
56
|
+
/** How many children are shown simultaneously. Clamped to at least 1 and at most the pool size. */
|
|
57
|
+
items: number;
|
|
58
|
+
/** Selection algorithm — see `randomize()`. */
|
|
59
|
+
mode: LyraRandomContentMode;
|
|
60
|
+
private slotEl?;
|
|
61
|
+
private timer?;
|
|
62
|
+
private reduceMotion;
|
|
63
|
+
private mediaQuery?;
|
|
64
|
+
private sequenceCursor;
|
|
65
|
+
private previousSelection?;
|
|
66
|
+
private lastPool;
|
|
67
|
+
private hasUpdatedOnce;
|
|
68
|
+
connectedCallback(): void;
|
|
69
|
+
disconnectedCallback(): void;
|
|
70
|
+
protected firstUpdated(): void;
|
|
71
|
+
protected updated(changed: PropertyValues): void;
|
|
72
|
+
private onMotionPreferenceChange;
|
|
73
|
+
private eligible;
|
|
74
|
+
private clampedCount;
|
|
75
|
+
private poolsEqual;
|
|
76
|
+
private shuffledPick;
|
|
77
|
+
private sameAsPrevious;
|
|
78
|
+
private selectUnique;
|
|
79
|
+
private selectSequence;
|
|
80
|
+
private computeSelectionForMode;
|
|
81
|
+
private applySelection;
|
|
82
|
+
private reselect;
|
|
83
|
+
private onSlotChange;
|
|
84
|
+
/**
|
|
85
|
+
* Selects a new set of children using the current mode. Applies
|
|
86
|
+
* `hidden`/`aria-hidden`, emits `lyra-content-change`, and returns the
|
|
87
|
+
* elements now shown. Does not reset or restart the autoplay timer.
|
|
88
|
+
*/
|
|
89
|
+
randomize: () => HTMLElement[];
|
|
90
|
+
private stopAutoplay;
|
|
91
|
+
private restartAutoplay;
|
|
92
|
+
render(): TemplateResult;
|
|
93
|
+
}
|
|
94
|
+
declare global {
|
|
95
|
+
interface HTMLElementTagNameMap {
|
|
96
|
+
'lyra-random-content': LyraRandomContent;
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
//# sourceMappingURL=random-content.class.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"random-content.class.d.ts","sourceRoot":"","sources":["../../../src/components/random-content/random-content.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9E,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAI7D,MAAM,MAAM,0BAA0B,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,WAAW,GAAG,WAAW,GAAG,YAAY,CAAC;AAChH,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,QAAQ,GAAG,UAAU,CAAC;AAErE,MAAM,WAAW,yBAAyB;IACxC,qBAAqB,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,WAAW,EAAE,CAAA;KAAE,CAAC,CAAC;CAC9D;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,qBAAa,iBAAkB,SAAQ,WAAW,CAAC,yBAAyB,CAAC;IAC3E,MAAM,CAAC,MAAM,iCAAgC;IAE7C,uEAAuE;IAC1C,SAAS,EAAE,0BAA0B,CAAU;IAE5E,6EAA6E;IACjC,QAAQ,UAAS;IAE7D,sEAAsE;IACV,gBAAgB,SAAQ;IAEpF,mGAAmG;IACvE,KAAK,SAAK;IAEtC,+CAA+C;IACnC,IAAI,EAAE,qBAAqB,CAAY;IAEpC,OAAO,CAAC,MAAM,CAAC,CAAkB;IAEhD,OAAO,CAAC,KAAK,CAAC,CAAS;IACvB,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,UAAU,CAAC,CAAiB;IACpC,OAAO,CAAC,cAAc,CAAK;IAC3B,OAAO,CAAC,iBAAiB,CAAC,CAAgB;IAC1C,OAAO,CAAC,QAAQ,CAAqB;IAOrC,OAAO,CAAC,cAAc,CAAS;IAE/B,iBAAiB,IAAI,IAAI,CAYxB;IAED,oBAAoB,IAAI,IAAI,CAK3B;IAED,SAAS,CAAC,YAAY,IAAI,IAAI,CAU7B;IAED,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAM/C;IAED,OAAO,CAAC,wBAAwB,CAG9B;IAEF,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,UAAU;IAKlB,OAAO,CAAC,YAAY;IAYpB,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,YAAY;IAYpB,OAAO,CAAC,cAAc;IAWtB,OAAO,CAAC,uBAAuB;IAY/B,OAAO,CAAC,cAAc;IAStB,OAAO,CAAC,QAAQ;IAgBhB,OAAO,CAAC,YAAY,CAWlB;IAEF;;;;OAIG;IACH,SAAS,QAAO,WAAW,EAAE,CAAoB;IAEjD,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,eAAe;IASvB,MAAM,IAAI,cAAc,CAWvB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF"}
|