ngwr 12.2.0 → 13.0.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 +11 -1
- package/border-glow/border-glow.scss +1 -1
- package/border-glow/styles/_index.scss +15 -233
- package/border-glow/styles/_rules.scss +228 -0
- package/breadcrumbs/breadcrumbs.scss +1 -1
- package/breadcrumbs/styles/_index.scss +15 -78
- package/breadcrumbs/styles/_rules.scss +84 -0
- package/card/card.scss +1 -1
- package/card/styles/_index.scss +15 -96
- package/card/styles/_rules.scss +96 -0
- package/cascader/cascader.scss +1 -1
- package/cascader/styles/_index.scss +15 -244
- package/cascader/styles/_rules.scss +261 -0
- package/checkbox/styles/_index.scss +7 -0
- package/circular-text/circular-text.scss +1 -1
- package/circular-text/styles/_index.scss +15 -63
- package/circular-text/styles/_rules.scss +58 -0
- package/color-picker/styles/_index.scss +8 -0
- package/drag-drop/sortable-list.scss +1 -1
- package/drag-drop/styles/_index.scss +14 -143
- package/drag-drop/styles/_rules.scss +151 -0
- package/falling-text/falling-text.scss +1 -1
- package/falling-text/styles/_index.scss +15 -36
- package/falling-text/styles/_rules.scss +31 -0
- package/fesm2022/ngwr-border-glow.mjs +2 -2
- package/fesm2022/ngwr-border-glow.mjs.map +1 -1
- package/fesm2022/ngwr-breadcrumbs.mjs +2 -2
- package/fesm2022/ngwr-breadcrumbs.mjs.map +1 -1
- package/fesm2022/ngwr-card.mjs +2 -2
- package/fesm2022/ngwr-card.mjs.map +1 -1
- package/fesm2022/ngwr-cascader.mjs +27 -9
- package/fesm2022/ngwr-cascader.mjs.map +1 -1
- package/fesm2022/ngwr-checkbox.mjs +86 -8
- package/fesm2022/ngwr-checkbox.mjs.map +1 -1
- package/fesm2022/ngwr-circular-text.mjs +2 -2
- package/fesm2022/ngwr-circular-text.mjs.map +1 -1
- package/fesm2022/ngwr-color-picker.mjs +57 -7
- package/fesm2022/ngwr-color-picker.mjs.map +1 -1
- package/fesm2022/ngwr-date-picker.mjs +8 -0
- package/fesm2022/ngwr-date-picker.mjs.map +1 -1
- package/fesm2022/ngwr-drag-drop.mjs +2 -2
- package/fesm2022/ngwr-drag-drop.mjs.map +1 -1
- package/fesm2022/ngwr-falling-text.mjs +2 -2
- package/fesm2022/ngwr-falling-text.mjs.map +1 -1
- package/fesm2022/ngwr-file-upload.mjs +29 -8
- package/fesm2022/ngwr-file-upload.mjs.map +1 -1
- package/fesm2022/ngwr-form.mjs +48 -1
- package/fesm2022/ngwr-form.mjs.map +1 -1
- package/fesm2022/ngwr-glitch-text.mjs +2 -2
- package/fesm2022/ngwr-glitch-text.mjs.map +1 -1
- package/fesm2022/ngwr-gradient-text.mjs +2 -2
- package/fesm2022/ngwr-gradient-text.mjs.map +1 -1
- package/fesm2022/ngwr-input-otp.mjs +41 -3
- package/fesm2022/ngwr-input-otp.mjs.map +1 -1
- package/fesm2022/ngwr-knob.mjs +17 -2
- package/fesm2022/ngwr-knob.mjs.map +1 -1
- package/fesm2022/ngwr-lightbox.mjs +2 -2
- package/fesm2022/ngwr-lightbox.mjs.map +1 -1
- package/fesm2022/ngwr-list.mjs +2 -2
- package/fesm2022/ngwr-list.mjs.map +1 -1
- package/fesm2022/ngwr-loading-bar.mjs +2 -2
- package/fesm2022/ngwr-loading-bar.mjs.map +1 -1
- package/fesm2022/ngwr-marquee.mjs +2 -2
- package/fesm2022/ngwr-marquee.mjs.map +1 -1
- package/fesm2022/ngwr-pagination.mjs +1 -1
- package/fesm2022/ngwr-pagination.mjs.map +1 -1
- package/fesm2022/ngwr-radio.mjs +63 -8
- package/fesm2022/ngwr-radio.mjs.map +1 -1
- package/fesm2022/ngwr-rating.mjs +17 -2
- package/fesm2022/ngwr-rating.mjs.map +1 -1
- package/fesm2022/ngwr-segmented.mjs +22 -3
- package/fesm2022/ngwr-segmented.mjs.map +1 -1
- package/fesm2022/ngwr-select.mjs +46 -12
- package/fesm2022/ngwr-select.mjs.map +1 -1
- package/fesm2022/ngwr-shiny-text.mjs +2 -2
- package/fesm2022/ngwr-shiny-text.mjs.map +1 -1
- package/fesm2022/ngwr-slider.mjs +21 -6
- package/fesm2022/ngwr-slider.mjs.map +1 -1
- package/fesm2022/ngwr-spotlight-card.mjs +2 -2
- package/fesm2022/ngwr-spotlight-card.mjs.map +1 -1
- package/fesm2022/ngwr-star-border.mjs +2 -2
- package/fesm2022/ngwr-star-border.mjs.map +1 -1
- package/fesm2022/ngwr-switch.mjs +44 -4
- package/fesm2022/ngwr-switch.mjs.map +1 -1
- package/fesm2022/ngwr-table.mjs +1 -1
- package/fesm2022/ngwr-table.mjs.map +1 -1
- package/fesm2022/ngwr-textarea.mjs +5 -2
- package/fesm2022/ngwr-textarea.mjs.map +1 -1
- package/fesm2022/ngwr-theme.mjs +41 -1
- package/fesm2022/ngwr-theme.mjs.map +1 -1
- package/fesm2022/ngwr-tilt-card.mjs +2 -2
- package/fesm2022/ngwr-tilt-card.mjs.map +1 -1
- package/fesm2022/ngwr-transfer.mjs +38 -6
- package/fesm2022/ngwr-transfer.mjs.map +1 -1
- package/fesm2022/ngwr-tree.mjs +33 -7
- package/fesm2022/ngwr-tree.mjs.map +1 -1
- package/fesm2022/ngwr-typewriter.mjs +2 -2
- package/fesm2022/ngwr-typewriter.mjs.map +1 -1
- package/fesm2022/ngwr-version.mjs +1 -1
- package/fesm2022/ngwr-version.mjs.map +1 -1
- package/fesm2022/ngwr-virtual-scroll.mjs +2 -2
- package/fesm2022/ngwr-virtual-scroll.mjs.map +1 -1
- package/fesm2022/ngwr-waves.mjs +2 -2
- package/fesm2022/ngwr-waves.mjs.map +1 -1
- package/file-upload/styles/_index.scss +6 -0
- package/glitch-text/glitch-text.scss +1 -1
- package/glitch-text/styles/_index.scss +14 -164
- package/glitch-text/styles/_rules.scss +160 -0
- package/gradient-text/gradient-text.scss +1 -1
- package/gradient-text/styles/_index.scss +15 -118
- package/gradient-text/styles/_rules.scss +113 -0
- package/input/styles/_index.scss +13 -0
- package/input-otp/styles/_index.scss +8 -0
- package/lightbox/lightbox.scss +1 -1
- package/lightbox/styles/_index.scss +15 -191
- package/lightbox/styles/_rules.scss +198 -0
- package/list/list.scss +1 -1
- package/list/styles/_index.scss +15 -101
- package/list/styles/_rules.scss +108 -0
- package/llms-full.txt +3 -3
- package/loading-bar/loading-bar.scss +1 -1
- package/loading-bar/styles/_index.scss +15 -33
- package/loading-bar/styles/_rules.scss +28 -0
- package/marquee/marquee.scss +1 -1
- package/marquee/styles/_index.scss +15 -155
- package/marquee/styles/_rules.scss +150 -0
- package/package.json +1 -1
- package/segmented/styles/_index.scss +8 -0
- package/select/styles/_index.scss +17 -1
- package/shiny-text/shiny-text.scss +1 -1
- package/shiny-text/styles/_index.scss +14 -105
- package/shiny-text/styles/_rules.scss +101 -0
- package/slider/styles/_index.scss +8 -0
- package/spotlight-card/spotlight-card.scss +1 -1
- package/spotlight-card/styles/_index.scss +15 -52
- package/spotlight-card/styles/_rules.scss +47 -0
- package/star-border/star-border.scss +1 -1
- package/star-border/styles/_index.scss +15 -125
- package/star-border/styles/_rules.scss +120 -0
- package/switch/styles/_index.scss +7 -0
- package/theme/styles/_dark.scss +81 -4
- package/theme/styles/_index.scss +1 -0
- package/theme/styles/_motion.scss +94 -0
- package/tilt-card/styles/_index.scss +15 -45
- package/tilt-card/styles/_rules.scss +40 -0
- package/tilt-card/tilt-card.scss +1 -1
- package/tree/styles/_index.scss +15 -1
- package/types/ngwr-cascader.d.ts +17 -1
- package/types/ngwr-checkbox.d.ts +51 -3
- package/types/ngwr-color-picker.d.ts +19 -1
- package/types/ngwr-file-upload.d.ts +18 -1
- package/types/ngwr-form.d.ts +51 -2
- package/types/ngwr-input-otp.d.ts +23 -1
- package/types/ngwr-knob.d.ts +14 -0
- package/types/ngwr-radio.d.ts +37 -2
- package/types/ngwr-rating.d.ts +14 -0
- package/types/ngwr-segmented.d.ts +18 -1
- package/types/ngwr-select.d.ts +17 -1
- package/types/ngwr-slider.d.ts +14 -1
- package/types/ngwr-switch.d.ts +26 -2
- package/types/ngwr-textarea.d.ts +3 -0
- package/types/ngwr-theme.d.ts +24 -0
- package/types/ngwr-transfer.d.ts +17 -1
- package/types/ngwr-tree.d.ts +21 -1
- package/types/ngwr-version.d.ts +1 -1
- package/typewriter/styles/_index.scss +15 -38
- package/typewriter/styles/_rules.scss +33 -0
- package/typewriter/typewriter.scss +1 -1
- package/virtual-scroll/styles/_index.scss +15 -32
- package/virtual-scroll/styles/_rules.scss +27 -0
- package/virtual-scroll/virtual-scroll.scss +1 -1
- package/waves/styles/_index.scss +15 -50
- package/waves/styles/_rules.scss +45 -0
- package/waves/waves.scss +1 -1
|
@@ -3,6 +3,7 @@ import { isPlatformBrowser } from '@angular/common';
|
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
4
|
import { input, computed, model, output, signal, viewChild, inject, PLATFORM_ID, ElementRef, effect, ViewEncapsulation, Component } from '@angular/core';
|
|
5
5
|
import { useConfigValue } from 'ngwr/config';
|
|
6
|
+
import { useFormFieldAria } from 'ngwr/form';
|
|
6
7
|
|
|
7
8
|
/**
|
|
8
9
|
* @license
|
|
@@ -74,6 +75,8 @@ class WrTextarea {
|
|
|
74
75
|
/** Resize direction, gated by `resizable` (false → 'none'). */
|
|
75
76
|
effectiveResize = computed(() => (this.resizable() ? this.resize() : 'none'), /* @ts-ignore */
|
|
76
77
|
...(ngDevMode ? [{ debugName: "effectiveResize" }] : /* istanbul ignore next */ []));
|
|
78
|
+
/** The surrounding `<wr-form-field>`'s error state. @internal */
|
|
79
|
+
fieldAria = useFormFieldAria();
|
|
77
80
|
classes = computed(() => {
|
|
78
81
|
const parts = ['wr-textarea'];
|
|
79
82
|
const size = this.resolvedSize();
|
|
@@ -208,11 +211,11 @@ class WrTextarea {
|
|
|
208
211
|
}
|
|
209
212
|
}
|
|
210
213
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrTextarea, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
211
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrTextarea, isStandalone: true, selector: "wr-textarea", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, autosize: { classPropertyName: "autosize", publicName: "autosize", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch" }, host: { properties: { "class": "classes()" } }, viewQueries: [{ propertyName: "native", first: true, predicate: ["native"], descendants: true, isSignal: true }], ngImport: i0, template: "<textarea\n #native\n class=\"wr-textarea__native\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [placeholder]=\"placeholder()\"\n [rows]=\"rows()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disabled()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (focus)=\"focused.set(true)\"\n (blur)=\"onBlur()\"\n></textarea>\n\n@if (showHandle()) {\n <!-- Custom corner grip \u2014 the lucide icon + cursor follow the `resize`\n direction. Icons inlined so no icon registration is required. -->\n <span\n [class]=\"`wr-textarea__resize wr-textarea__resize--${effectiveResize()}`\"\n aria-hidden=\"true\"\n (pointerdown)=\"startResize($event)\"\n (pointermove)=\"onResize($event)\"\n (pointerup)=\"endResize($event)\"\n (pointercancel)=\"endResize($event)\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n @switch (effectiveResize()) {\n @case ('vertical') {\n <path d=\"M12 2v20\" />\n <path d=\"m8 18 4 4 4-4\" />\n <path d=\"m8 6 4-4 4 4\" />\n }\n @case ('horizontal') {\n <path d=\"M2 12h20\" />\n <path d=\"m18 8 4 4-4 4\" />\n <path d=\"m6 8-4 4 4 4\" />\n }\n @default {\n <path d=\"M19 13v6h-6\" />\n <path d=\"M5 11V5h6\" />\n <path d=\"m5 5 14 14\" />\n }\n }\n </svg>\n </span>\n}\n", encapsulation: i0.ViewEncapsulation.None });
|
|
214
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrTextarea, isStandalone: true, selector: "wr-textarea", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, autosize: { classPropertyName: "autosize", publicName: "autosize", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch" }, host: { properties: { "class": "classes()" } }, viewQueries: [{ propertyName: "native", first: true, predicate: ["native"], descendants: true, isSignal: true }], ngImport: i0, template: "<textarea\n #native\n class=\"wr-textarea__native\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [placeholder]=\"placeholder()\"\n [rows]=\"rows()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disabled()\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (focus)=\"focused.set(true)\"\n (blur)=\"onBlur()\"\n></textarea>\n\n@if (showHandle()) {\n <!-- Custom corner grip \u2014 the lucide icon + cursor follow the `resize`\n direction. Icons inlined so no icon registration is required. -->\n <span\n [class]=\"`wr-textarea__resize wr-textarea__resize--${effectiveResize()}`\"\n aria-hidden=\"true\"\n (pointerdown)=\"startResize($event)\"\n (pointermove)=\"onResize($event)\"\n (pointerup)=\"endResize($event)\"\n (pointercancel)=\"endResize($event)\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n @switch (effectiveResize()) {\n @case ('vertical') {\n <path d=\"M12 2v20\" />\n <path d=\"m8 18 4 4 4-4\" />\n <path d=\"m8 6 4-4 4 4\" />\n }\n @case ('horizontal') {\n <path d=\"M2 12h20\" />\n <path d=\"m18 8 4 4-4 4\" />\n <path d=\"m6 8-4 4 4 4\" />\n }\n @default {\n <path d=\"M19 13v6h-6\" />\n <path d=\"M5 11V5h6\" />\n <path d=\"m5 5 14 14\" />\n }\n }\n </svg>\n </span>\n}\n", encapsulation: i0.ViewEncapsulation.None });
|
|
212
215
|
}
|
|
213
216
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrTextarea, decorators: [{
|
|
214
217
|
type: Component,
|
|
215
|
-
args: [{ selector: 'wr-textarea', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, template: "<textarea\n #native\n class=\"wr-textarea__native\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [placeholder]=\"placeholder()\"\n [rows]=\"rows()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disabled()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (focus)=\"focused.set(true)\"\n (blur)=\"onBlur()\"\n></textarea>\n\n@if (showHandle()) {\n <!-- Custom corner grip \u2014 the lucide icon + cursor follow the `resize`\n direction. Icons inlined so no icon registration is required. -->\n <span\n [class]=\"`wr-textarea__resize wr-textarea__resize--${effectiveResize()}`\"\n aria-hidden=\"true\"\n (pointerdown)=\"startResize($event)\"\n (pointermove)=\"onResize($event)\"\n (pointerup)=\"endResize($event)\"\n (pointercancel)=\"endResize($event)\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n @switch (effectiveResize()) {\n @case ('vertical') {\n <path d=\"M12 2v20\" />\n <path d=\"m8 18 4 4 4-4\" />\n <path d=\"m8 6 4-4 4 4\" />\n }\n @case ('horizontal') {\n <path d=\"M2 12h20\" />\n <path d=\"m18 8 4 4-4 4\" />\n <path d=\"m6 8-4 4 4 4\" />\n }\n @default {\n <path d=\"M19 13v6h-6\" />\n <path d=\"M5 11V5h6\" />\n <path d=\"m5 5 14 14\" />\n }\n }\n </svg>\n </span>\n}\n" }]
|
|
218
|
+
args: [{ selector: 'wr-textarea', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, template: "<textarea\n #native\n class=\"wr-textarea__native\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [placeholder]=\"placeholder()\"\n [rows]=\"rows()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disabled()\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (focus)=\"focused.set(true)\"\n (blur)=\"onBlur()\"\n></textarea>\n\n@if (showHandle()) {\n <!-- Custom corner grip \u2014 the lucide icon + cursor follow the `resize`\n direction. Icons inlined so no icon registration is required. -->\n <span\n [class]=\"`wr-textarea__resize wr-textarea__resize--${effectiveResize()}`\"\n aria-hidden=\"true\"\n (pointerdown)=\"startResize($event)\"\n (pointermove)=\"onResize($event)\"\n (pointerup)=\"endResize($event)\"\n (pointercancel)=\"endResize($event)\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n @switch (effectiveResize()) {\n @case ('vertical') {\n <path d=\"M12 2v20\" />\n <path d=\"m8 18 4 4 4-4\" />\n <path d=\"m8 6 4-4 4 4\" />\n }\n @case ('horizontal') {\n <path d=\"M2 12h20\" />\n <path d=\"m18 8 4 4-4 4\" />\n <path d=\"m6 8-4 4 4 4\" />\n }\n @default {\n <path d=\"M19 13v6h-6\" />\n <path d=\"M5 11V5h6\" />\n <path d=\"m5 5 14 14\" />\n }\n }\n </svg>\n </span>\n}\n" }]
|
|
216
219
|
}], ctorParameters: () => [], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], resize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resize", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], autosize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autosize", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touch: [{ type: i0.Output, args: ["touch"] }], native: [{ type: i0.ViewChild, args: ['native', { isSignal: true }] }] } });
|
|
217
220
|
|
|
218
221
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-textarea.mjs","sources":["../../../projects/lib/textarea/textarea.ts","../../../projects/lib/textarea/textarea.html","../../../projects/lib/textarea/ngwr-textarea.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { isPlatformBrowser } from '@angular/common';\nimport {\n Component,\n ElementRef,\n PLATFORM_ID,\n ViewEncapsulation,\n computed,\n effect,\n inject,\n input,\n model,\n output,\n signal,\n viewChild,\n} from '@angular/core';\nimport type { FormValueControl } from '@angular/forms/signals';\n\nimport { useConfigValue } from 'ngwr/config';\n\n/**\n * Multi-line text input.\n *\n * A signal-forms native control: it implements `FormValueControl<string>`, so\n * `[formField]` binds straight to its `value` model — no\n * `ControlValueAccessor` in between. `[(value)]` works standalone.\n *\n * Optional `autosize` grows the textarea with its content, capped at\n * `maxRows` if provided.\n *\n * @example\n * ```html\n * <!-- signal forms -->\n * <wr-textarea placeholder=\"Notes\" [formField]=\"form.notes\" />\n *\n * <!-- standalone two-way binding -->\n * <wr-textarea autosize [maxRows]=\"6\" [(value)]=\"text\" />\n * ```\n *\n * @see https://ngwr.dev/reference/components/textarea\n */\nexport type WrTextareaSize = 'sm' | 'md' | 'lg';\n\nexport type WrTextareaResize = 'none' | 'vertical' | 'horizontal' | 'both';\n\n@Component({\n selector: 'wr-textarea',\n templateUrl: './textarea.html',\n encapsulation: ViewEncapsulation.None,\n host: { '[class]': 'classes()' },\n})\nexport class WrTextarea implements FormValueControl<string> {\n /** Native placeholder text. @default '' */\n readonly placeholder = input<string>('');\n\n /**\n * Accessible name for the field. Falls back to the placeholder — the native\n * `<textarea>` lives inside the component, so a `<label for>` outside cannot\n * reach it.\n */\n readonly ariaLabel = input<string | null>(null);\n\n protected readonly resolvedAriaLabel = computed(() => {\n // Not `??`: an empty placeholder is no name at all, so it must fall through.\n const explicit = this.ariaLabel();\n if (explicit) return explicit;\n const placeholder = this.placeholder();\n return placeholder ? placeholder : null;\n });\n\n /**\n * Control size — shares the `--wr-control-*` contract. Unset, it falls back to\n * `provideWrConfig({ textarea: { size } })`. @default 'md'\n */\n readonly size = input<WrTextareaSize | null>(null);\n\n // `null` as the input's own default, not `'md'`: with a literal sitting there,\n // \"the template said nothing\" and \"the template said md\" are the same value, so no\n // app-wide default could ever apply. The effective default is the last argument\n // below, which is where the old inline one moved to.\n protected readonly resolvedSize = useConfigValue(this.size, c => c.textarea?.size, 'md');\n\n /** Visible row count. @default 3 */\n readonly rows = input(3, { transform: (v: unknown): number => coerceNumberProperty(v, 3) });\n\n /** Allow user resize via the corner grip. @default true */\n readonly resizable = input(true, { transform: coerceBooleanProperty });\n\n /** Resize direction of the corner grip (the grip icon adapts). @default 'vertical' */\n readonly resize = input<WrTextareaResize>('vertical');\n\n /** Read-only state. @default false */\n readonly readonly = input(false, { transform: coerceBooleanProperty });\n\n /** Grow the textarea to fit its content. @default false */\n readonly autosize = input(false, { transform: coerceBooleanProperty });\n\n /** Cap autosize at this many rows. Ignored when `autosize` is false. */\n readonly maxRows = input<number | null>(null);\n\n /**\n * Disable the textarea. Bound automatically from the field's disabled state\n * when used with `[formField]`.\n *\n * @default false\n */\n readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n /** The edited text. Bound by `[formField]`, or two-way via `[(value)]`. */\n readonly value = model<string>('');\n\n /** Emitted on blur so a bound field can mark itself touched. */\n readonly touch = output<void>();\n\n protected readonly focused = signal(false);\n\n protected readonly native = viewChild.required<ElementRef<HTMLTextAreaElement>>('native');\n\n /** Resize direction, gated by `resizable` (false → 'none'). */\n protected readonly effectiveResize = computed<WrTextareaResize>(() => (this.resizable() ? this.resize() : 'none'));\n\n protected readonly classes = computed(() => {\n const parts = ['wr-textarea'];\n const size = this.resolvedSize();\n if (size !== 'md') parts.push(`wr-textarea--${size}`);\n if (this.autosize()) parts.push('wr-textarea--no-resize');\n const resize = this.effectiveResize();\n if (resize === 'horizontal' || resize === 'both') parts.push('wr-textarea--resize-x');\n if (this.focused()) parts.push('wr-textarea--focused');\n if (this.disabled()) parts.push('wr-textarea--disabled');\n return parts.join(' ');\n });\n\n /** Show the corner grip (hidden when direction is 'none' / autosize / disabled). */\n protected readonly showHandle = computed(\n () => this.effectiveResize() !== 'none' && !this.autosize() && !this.disabled()\n );\n\n private readonly platformId = inject(PLATFORM_ID);\n private readonly isBrowser = isPlatformBrowser(this.platformId);\n private readonly hostEl = inject<ElementRef<HTMLElement>>(ElementRef);\n\n // Custom resize-grip drag state (replaces the native corner handle).\n private resizing = false;\n private resizeStartY = 0;\n private resizeStartX = 0;\n private resizeStartHeight = 0;\n private resizeStartWidth = 0;\n private resizeMinHeight = 36;\n private resizeMaxWidth = Number.POSITIVE_INFINITY;\n\n constructor() {\n // Autosize: re-fit whenever value or autosize toggles.\n effect(() => {\n if (!this.isBrowser) return;\n if (!this.autosize()) {\n // Hand the height back. Left behind, the field stays frozen at whatever\n // was last fitted and `rows` silently stops meaning anything, which reads\n // as the input having done nothing.\n this.releaseHeight();\n return;\n }\n // Read `value` to register dependency\n this.value();\n requestAnimationFrame(() => this.autofit());\n });\n }\n\n // Template handlers\n\n protected onInput(event: Event): void {\n this.value.set((event.target as HTMLTextAreaElement).value);\n }\n\n protected onBlur(): void {\n this.focused.set(false);\n this.touch.emit();\n }\n\n // Custom resize — drag the corner grip; direction comes from `effectiveResize`.\n // Pointer capture keeps move/up on the grip even when the cursor leaves it.\n protected startResize(event: PointerEvent): void {\n const el = this.native()?.nativeElement;\n if (!el) return;\n const host = this.hostEl.nativeElement;\n this.resizing = true;\n this.resizeStartY = event.clientY;\n this.resizeStartX = event.clientX;\n this.resizeStartHeight = el.offsetHeight;\n this.resizeStartWidth = host.offsetWidth;\n // Height floor = fits the current content, so shrinking never opens an\n // overflow scrollbar. Measured once, synchronously (no paint between).\n const borderY = el.offsetHeight - el.clientHeight;\n const prevHeight = el.style.height;\n el.style.height = 'auto';\n this.resizeMinHeight = el.scrollHeight + borderY;\n el.style.height = prevHeight;\n // Width ceiling = parent inner width, so horizontal drag can't overflow.\n this.resizeMaxWidth = host.parentElement?.clientWidth ?? Number.POSITIVE_INFINITY;\n (event.target as HTMLElement).setPointerCapture(event.pointerId);\n event.preventDefault();\n }\n\n protected onResize(event: PointerEvent): void {\n if (!this.resizing) return;\n const el = this.native()?.nativeElement;\n if (!el) return;\n const dir = this.effectiveResize();\n if (dir === 'vertical' || dir === 'both') {\n const h = Math.max(this.resizeMinHeight, this.resizeStartHeight + (event.clientY - this.resizeStartY));\n el.style.height = `${h}px`;\n }\n if (dir === 'horizontal' || dir === 'both') {\n const w = Math.min(\n this.resizeMaxWidth,\n Math.max(64, this.resizeStartWidth + (event.clientX - this.resizeStartX))\n );\n this.hostEl.nativeElement.style.width = `${w}px`;\n }\n }\n\n protected endResize(event: PointerEvent): void {\n if (!this.resizing) return;\n this.resizing = false;\n (event.target as HTMLElement).releasePointerCapture(event.pointerId);\n }\n\n private releaseHeight(): void {\n const el = this.native()?.nativeElement;\n if (!el) return;\n el.style.height = '';\n el.style.overflowY = '';\n }\n\n private autofit(): void {\n const el = this.native()?.nativeElement;\n if (!el) return;\n // A frame can outlive the reason it was scheduled: toggling `autosize` off\n // between the effect and the frame would otherwise fit a height nobody asked\n // for, and `releaseHeight` has already run by then.\n if (!this.autosize()) return;\n el.style.height = 'auto';\n\n const maxRows = this.maxRows();\n if (maxRows && maxRows > 0) {\n const cs = getComputedStyle(el);\n const lineHeight = parseFloat(cs.lineHeight) || parseFloat(cs.fontSize) * 1.2;\n const cap = lineHeight * maxRows;\n const next = Math.min(el.scrollHeight, cap);\n el.style.height = `${next}px`;\n el.style.overflowY = el.scrollHeight > cap ? 'auto' : 'hidden';\n } else {\n el.style.height = `${el.scrollHeight}px`;\n el.style.overflowY = 'hidden';\n }\n }\n}\n","<textarea\n #native\n class=\"wr-textarea__native\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [placeholder]=\"placeholder()\"\n [rows]=\"rows()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disabled()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (focus)=\"focused.set(true)\"\n (blur)=\"onBlur()\"\n></textarea>\n\n@if (showHandle()) {\n <!-- Custom corner grip — the lucide icon + cursor follow the `resize`\n direction. Icons inlined so no icon registration is required. -->\n <span\n [class]=\"`wr-textarea__resize wr-textarea__resize--${effectiveResize()}`\"\n aria-hidden=\"true\"\n (pointerdown)=\"startResize($event)\"\n (pointermove)=\"onResize($event)\"\n (pointerup)=\"endResize($event)\"\n (pointercancel)=\"endResize($event)\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n @switch (effectiveResize()) {\n @case ('vertical') {\n <path d=\"M12 2v20\" />\n <path d=\"m8 18 4 4 4-4\" />\n <path d=\"m8 6 4-4 4 4\" />\n }\n @case ('horizontal') {\n <path d=\"M2 12h20\" />\n <path d=\"m18 8 4 4-4 4\" />\n <path d=\"m6 8-4 4 4 4\" />\n }\n @default {\n <path d=\"M19 13v6h-6\" />\n <path d=\"M5 11V5h6\" />\n <path d=\"m5 5 14 14\" />\n }\n }\n </svg>\n </span>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;AAAA;;;;;AAKG;MAqDU,UAAU,CAAA;;IAEZ,WAAW,GAAG,KAAK,CAAS,EAAE;oFAAC;AAExC;;;;AAIG;IACM,SAAS,GAAG,KAAK,CAAgB,IAAI;kFAAC;AAE5B,IAAA,iBAAiB,GAAG,QAAQ,CAAC,MAAK;;AAEnD,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,EAAE;AACjC,QAAA,IAAI,QAAQ;AAAE,YAAA,OAAO,QAAQ;AAC7B,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,EAAE;QACtC,OAAO,WAAW,GAAG,WAAW,GAAG,IAAI;IACzC,CAAC;0FAAC;AAEF;;;AAGG;IACM,IAAI,GAAG,KAAK,CAAwB,IAAI;6EAAC;;;;;AAM/B,IAAA,YAAY,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC;;AAG/E,IAAA,IAAI,GAAG,KAAK,CAAC,CAAC,EAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,MAAA,EAAA,8BAAA,EAAA,CAAA,EAAI,SAAS,EAAE,CAAC,CAAU,KAAa,oBAAoB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;;IAGlF,SAAS,GAAG,KAAK,CAAC,IAAI,iFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAG7D,MAAM,GAAG,KAAK,CAAmB,UAAU;+EAAC;;IAG5C,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAG7D,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAG7D,OAAO,GAAG,KAAK,CAAgB,IAAI;gFAAC;AAE7C;;;;;AAKG;IACM,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAG7D,KAAK,GAAG,KAAK,CAAS,EAAE;8EAAC;;IAGzB,KAAK,GAAG,MAAM,EAAQ;IAEZ,OAAO,GAAG,MAAM,CAAC,KAAK;gFAAC;AAEvB,IAAA,MAAM,GAAG,SAAS,CAAC,QAAQ,CAAkC,QAAQ;+EAAC;;IAGtE,eAAe,GAAG,QAAQ,CAAmB,OAAO,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,MAAM,CAAC;wFAAC;AAE/F,IAAA,OAAO,GAAG,QAAQ,CAAC,MAAK;AACzC,QAAA,MAAM,KAAK,GAAG,CAAC,aAAa,CAAC;AAC7B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE;QAChC,IAAI,IAAI,KAAK,IAAI;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,gBAAgB,IAAI,CAAA,CAAE,CAAC;QACrD,IAAI,IAAI,CAAC,QAAQ,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,wBAAwB,CAAC;AACzD,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,eAAe,EAAE;AACrC,QAAA,IAAI,MAAM,KAAK,YAAY,IAAI,MAAM,KAAK,MAAM;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,uBAAuB,CAAC;QACrF,IAAI,IAAI,CAAC,OAAO,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,sBAAsB,CAAC;QACtD,IAAI,IAAI,CAAC,QAAQ,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,uBAAuB,CAAC;AACxD,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;IACxB,CAAC;gFAAC;;IAGiB,UAAU,GAAG,QAAQ,CACtC,MAAM,IAAI,CAAC,eAAe,EAAE,KAAK,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;mFAChF;AAEgB,IAAA,UAAU,GAAG,MAAM,CAAC,WAAW,CAAC;AAChC,IAAA,SAAS,GAAG,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC;AAC9C,IAAA,MAAM,GAAG,MAAM,CAA0B,UAAU,CAAC;;IAG7D,QAAQ,GAAG,KAAK;IAChB,YAAY,GAAG,CAAC;IAChB,YAAY,GAAG,CAAC;IAChB,iBAAiB,GAAG,CAAC;IACrB,gBAAgB,GAAG,CAAC;IACpB,eAAe,GAAG,EAAE;AACpB,IAAA,cAAc,GAAG,MAAM,CAAC,iBAAiB;AAEjD,IAAA,WAAA,GAAA;;QAEE,MAAM,CAAC,MAAK;YACV,IAAI,CAAC,IAAI,CAAC,SAAS;gBAAE;AACrB,YAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE;;;;gBAIpB,IAAI,CAAC,aAAa,EAAE;gBACpB;YACF;;YAEA,IAAI,CAAC,KAAK,EAAE;YACZ,qBAAqB,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE,CAAC;AAC7C,QAAA,CAAC,CAAC;IACJ;;AAIU,IAAA,OAAO,CAAC,KAAY,EAAA;QAC5B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAE,KAAK,CAAC,MAA8B,CAAC,KAAK,CAAC;IAC7D;IAEU,MAAM,GAAA;AACd,QAAA,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;AACvB,QAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;IACnB;;;AAIU,IAAA,WAAW,CAAC,KAAmB,EAAA;QACvC,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,aAAa;AACvC,QAAA,IAAI,CAAC,EAAE;YAAE;AACT,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,aAAa;AACtC,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;AACpB,QAAA,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,OAAO;AACjC,QAAA,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,OAAO;AACjC,QAAA,IAAI,CAAC,iBAAiB,GAAG,EAAE,CAAC,YAAY;AACxC,QAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,WAAW;;;QAGxC,MAAM,OAAO,GAAG,EAAE,CAAC,YAAY,GAAG,EAAE,CAAC,YAAY;AACjD,QAAA,MAAM,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC,MAAM;AAClC,QAAA,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM;QACxB,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC,YAAY,GAAG,OAAO;AAChD,QAAA,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;;AAE5B,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,EAAE,WAAW,IAAI,MAAM,CAAC,iBAAiB;QAChF,KAAK,CAAC,MAAsB,CAAC,iBAAiB,CAAC,KAAK,CAAC,SAAS,CAAC;QAChE,KAAK,CAAC,cAAc,EAAE;IACxB;AAEU,IAAA,QAAQ,CAAC,KAAmB,EAAA;QACpC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE;QACpB,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,aAAa;AACvC,QAAA,IAAI,CAAC,EAAE;YAAE;AACT,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,eAAe,EAAE;QAClC,IAAI,GAAG,KAAK,UAAU,IAAI,GAAG,KAAK,MAAM,EAAE;YACxC,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,iBAAiB,IAAI,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC;YACtG,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,CAAA,EAAG,CAAC,IAAI;QAC5B;QACA,IAAI,GAAG,KAAK,YAAY,IAAI,GAAG,KAAK,MAAM,EAAE;AAC1C,YAAA,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAChB,IAAI,CAAC,cAAc,EACnB,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,gBAAgB,IAAI,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC,CAC1E;AACD,YAAA,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,KAAK,GAAG,CAAA,EAAG,CAAC,CAAA,EAAA,CAAI;QAClD;IACF;AAEU,IAAA,SAAS,CAAC,KAAmB,EAAA;QACrC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE;AACpB,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;QACpB,KAAK,CAAC,MAAsB,CAAC,qBAAqB,CAAC,KAAK,CAAC,SAAS,CAAC;IACtE;IAEQ,aAAa,GAAA;QACnB,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,aAAa;AACvC,QAAA,IAAI,CAAC,EAAE;YAAE;AACT,QAAA,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,EAAE;AACpB,QAAA,EAAE,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE;IACzB;IAEQ,OAAO,GAAA;QACb,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,aAAa;AACvC,QAAA,IAAI,CAAC,EAAE;YAAE;;;;AAIT,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAAE;AACtB,QAAA,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM;AAExB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE;AAC9B,QAAA,IAAI,OAAO,IAAI,OAAO,GAAG,CAAC,EAAE;AAC1B,YAAA,MAAM,EAAE,GAAG,gBAAgB,CAAC,EAAE,CAAC;AAC/B,YAAA,MAAM,UAAU,GAAG,UAAU,CAAC,EAAE,CAAC,UAAU,CAAC,IAAI,UAAU,CAAC,EAAE,CAAC,QAAQ,CAAC,GAAG,GAAG;AAC7E,YAAA,MAAM,GAAG,GAAG,UAAU,GAAG,OAAO;AAChC,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,YAAY,EAAE,GAAG,CAAC;YAC3C,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,CAAA,EAAG,IAAI,IAAI;AAC7B,YAAA,EAAE,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC,YAAY,GAAG,GAAG,GAAG,MAAM,GAAG,QAAQ;QAChE;aAAO;YACL,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,EAAE,CAAC,YAAY,CAAA,EAAA,CAAI;AACxC,YAAA,EAAE,CAAC,KAAK,CAAC,SAAS,GAAG,QAAQ;QAC/B;IACF;uGA5MW,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAV,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAU,wpDC1DvB,olDAwDA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FDEa,UAAU,EAAA,UAAA,EAAA,CAAA;kBANtB,SAAS;+BACE,aAAa,EAAA,aAAA,EAER,iBAAiB,CAAC,IAAI,QAC/B,EAAE,SAAS,EAAE,WAAW,EAAE,EAAA,QAAA,EAAA,olDAAA,EAAA;usCAmEgD,QAAQ,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AE3H1F;;AAEG;;;;"}
|
|
1
|
+
{"version":3,"file":"ngwr-textarea.mjs","sources":["../../../projects/lib/textarea/textarea.ts","../../../projects/lib/textarea/textarea.html","../../../projects/lib/textarea/ngwr-textarea.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { isPlatformBrowser } from '@angular/common';\nimport {\n Component,\n ElementRef,\n PLATFORM_ID,\n ViewEncapsulation,\n computed,\n effect,\n inject,\n input,\n model,\n output,\n signal,\n viewChild,\n} from '@angular/core';\nimport type { FormValueControl } from '@angular/forms/signals';\n\nimport { useConfigValue } from 'ngwr/config';\nimport { useFormFieldAria } from 'ngwr/form';\n\n/**\n * Multi-line text input.\n *\n * A signal-forms native control: it implements `FormValueControl<string>`, so\n * `[formField]` binds straight to its `value` model — no\n * `ControlValueAccessor` in between. `[(value)]` works standalone.\n *\n * Optional `autosize` grows the textarea with its content, capped at\n * `maxRows` if provided.\n *\n * @example\n * ```html\n * <!-- signal forms -->\n * <wr-textarea placeholder=\"Notes\" [formField]=\"form.notes\" />\n *\n * <!-- standalone two-way binding -->\n * <wr-textarea autosize [maxRows]=\"6\" [(value)]=\"text\" />\n * ```\n *\n * @see https://ngwr.dev/reference/components/textarea\n */\nexport type WrTextareaSize = 'sm' | 'md' | 'lg';\n\nexport type WrTextareaResize = 'none' | 'vertical' | 'horizontal' | 'both';\n\n@Component({\n selector: 'wr-textarea',\n templateUrl: './textarea.html',\n encapsulation: ViewEncapsulation.None,\n host: { '[class]': 'classes()' },\n})\nexport class WrTextarea implements FormValueControl<string> {\n /** Native placeholder text. @default '' */\n readonly placeholder = input<string>('');\n\n /**\n * Accessible name for the field. Falls back to the placeholder — the native\n * `<textarea>` lives inside the component, so a `<label for>` outside cannot\n * reach it.\n */\n readonly ariaLabel = input<string | null>(null);\n\n protected readonly resolvedAriaLabel = computed(() => {\n // Not `??`: an empty placeholder is no name at all, so it must fall through.\n const explicit = this.ariaLabel();\n if (explicit) return explicit;\n const placeholder = this.placeholder();\n return placeholder ? placeholder : null;\n });\n\n /**\n * Control size — shares the `--wr-control-*` contract. Unset, it falls back to\n * `provideWrConfig({ textarea: { size } })`. @default 'md'\n */\n readonly size = input<WrTextareaSize | null>(null);\n\n // `null` as the input's own default, not `'md'`: with a literal sitting there,\n // \"the template said nothing\" and \"the template said md\" are the same value, so no\n // app-wide default could ever apply. The effective default is the last argument\n // below, which is where the old inline one moved to.\n protected readonly resolvedSize = useConfigValue(this.size, c => c.textarea?.size, 'md');\n\n /** Visible row count. @default 3 */\n readonly rows = input(3, { transform: (v: unknown): number => coerceNumberProperty(v, 3) });\n\n /** Allow user resize via the corner grip. @default true */\n readonly resizable = input(true, { transform: coerceBooleanProperty });\n\n /** Resize direction of the corner grip (the grip icon adapts). @default 'vertical' */\n readonly resize = input<WrTextareaResize>('vertical');\n\n /** Read-only state. @default false */\n readonly readonly = input(false, { transform: coerceBooleanProperty });\n\n /** Grow the textarea to fit its content. @default false */\n readonly autosize = input(false, { transform: coerceBooleanProperty });\n\n /** Cap autosize at this many rows. Ignored when `autosize` is false. */\n readonly maxRows = input<number | null>(null);\n\n /**\n * Disable the textarea. Bound automatically from the field's disabled state\n * when used with `[formField]`.\n *\n * @default false\n */\n readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n /** The edited text. Bound by `[formField]`, or two-way via `[(value)]`. */\n readonly value = model<string>('');\n\n /** Emitted on blur so a bound field can mark itself touched. */\n readonly touch = output<void>();\n\n protected readonly focused = signal(false);\n\n protected readonly native = viewChild.required<ElementRef<HTMLTextAreaElement>>('native');\n\n /** Resize direction, gated by `resizable` (false → 'none'). */\n protected readonly effectiveResize = computed<WrTextareaResize>(() => (this.resizable() ? this.resize() : 'none'));\n\n /** The surrounding `<wr-form-field>`'s error state. @internal */\n protected readonly fieldAria = useFormFieldAria();\n\n protected readonly classes = computed(() => {\n const parts = ['wr-textarea'];\n const size = this.resolvedSize();\n if (size !== 'md') parts.push(`wr-textarea--${size}`);\n if (this.autosize()) parts.push('wr-textarea--no-resize');\n const resize = this.effectiveResize();\n if (resize === 'horizontal' || resize === 'both') parts.push('wr-textarea--resize-x');\n if (this.focused()) parts.push('wr-textarea--focused');\n if (this.disabled()) parts.push('wr-textarea--disabled');\n return parts.join(' ');\n });\n\n /** Show the corner grip (hidden when direction is 'none' / autosize / disabled). */\n protected readonly showHandle = computed(\n () => this.effectiveResize() !== 'none' && !this.autosize() && !this.disabled()\n );\n\n private readonly platformId = inject(PLATFORM_ID);\n private readonly isBrowser = isPlatformBrowser(this.platformId);\n private readonly hostEl = inject<ElementRef<HTMLElement>>(ElementRef);\n\n // Custom resize-grip drag state (replaces the native corner handle).\n private resizing = false;\n private resizeStartY = 0;\n private resizeStartX = 0;\n private resizeStartHeight = 0;\n private resizeStartWidth = 0;\n private resizeMinHeight = 36;\n private resizeMaxWidth = Number.POSITIVE_INFINITY;\n\n constructor() {\n // Autosize: re-fit whenever value or autosize toggles.\n effect(() => {\n if (!this.isBrowser) return;\n if (!this.autosize()) {\n // Hand the height back. Left behind, the field stays frozen at whatever\n // was last fitted and `rows` silently stops meaning anything, which reads\n // as the input having done nothing.\n this.releaseHeight();\n return;\n }\n // Read `value` to register dependency\n this.value();\n requestAnimationFrame(() => this.autofit());\n });\n }\n\n // Template handlers\n\n protected onInput(event: Event): void {\n this.value.set((event.target as HTMLTextAreaElement).value);\n }\n\n protected onBlur(): void {\n this.focused.set(false);\n this.touch.emit();\n }\n\n // Custom resize — drag the corner grip; direction comes from `effectiveResize`.\n // Pointer capture keeps move/up on the grip even when the cursor leaves it.\n protected startResize(event: PointerEvent): void {\n const el = this.native()?.nativeElement;\n if (!el) return;\n const host = this.hostEl.nativeElement;\n this.resizing = true;\n this.resizeStartY = event.clientY;\n this.resizeStartX = event.clientX;\n this.resizeStartHeight = el.offsetHeight;\n this.resizeStartWidth = host.offsetWidth;\n // Height floor = fits the current content, so shrinking never opens an\n // overflow scrollbar. Measured once, synchronously (no paint between).\n const borderY = el.offsetHeight - el.clientHeight;\n const prevHeight = el.style.height;\n el.style.height = 'auto';\n this.resizeMinHeight = el.scrollHeight + borderY;\n el.style.height = prevHeight;\n // Width ceiling = parent inner width, so horizontal drag can't overflow.\n this.resizeMaxWidth = host.parentElement?.clientWidth ?? Number.POSITIVE_INFINITY;\n (event.target as HTMLElement).setPointerCapture(event.pointerId);\n event.preventDefault();\n }\n\n protected onResize(event: PointerEvent): void {\n if (!this.resizing) return;\n const el = this.native()?.nativeElement;\n if (!el) return;\n const dir = this.effectiveResize();\n if (dir === 'vertical' || dir === 'both') {\n const h = Math.max(this.resizeMinHeight, this.resizeStartHeight + (event.clientY - this.resizeStartY));\n el.style.height = `${h}px`;\n }\n if (dir === 'horizontal' || dir === 'both') {\n const w = Math.min(\n this.resizeMaxWidth,\n Math.max(64, this.resizeStartWidth + (event.clientX - this.resizeStartX))\n );\n this.hostEl.nativeElement.style.width = `${w}px`;\n }\n }\n\n protected endResize(event: PointerEvent): void {\n if (!this.resizing) return;\n this.resizing = false;\n (event.target as HTMLElement).releasePointerCapture(event.pointerId);\n }\n\n private releaseHeight(): void {\n const el = this.native()?.nativeElement;\n if (!el) return;\n el.style.height = '';\n el.style.overflowY = '';\n }\n\n private autofit(): void {\n const el = this.native()?.nativeElement;\n if (!el) return;\n // A frame can outlive the reason it was scheduled: toggling `autosize` off\n // between the effect and the frame would otherwise fit a height nobody asked\n // for, and `releaseHeight` has already run by then.\n if (!this.autosize()) return;\n el.style.height = 'auto';\n\n const maxRows = this.maxRows();\n if (maxRows && maxRows > 0) {\n const cs = getComputedStyle(el);\n const lineHeight = parseFloat(cs.lineHeight) || parseFloat(cs.fontSize) * 1.2;\n const cap = lineHeight * maxRows;\n const next = Math.min(el.scrollHeight, cap);\n el.style.height = `${next}px`;\n el.style.overflowY = el.scrollHeight > cap ? 'auto' : 'hidden';\n } else {\n el.style.height = `${el.scrollHeight}px`;\n el.style.overflowY = 'hidden';\n }\n }\n}\n","<textarea\n #native\n class=\"wr-textarea__native\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [placeholder]=\"placeholder()\"\n [rows]=\"rows()\"\n [readonly]=\"readonly()\"\n [disabled]=\"disabled()\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n (focus)=\"focused.set(true)\"\n (blur)=\"onBlur()\"\n></textarea>\n\n@if (showHandle()) {\n <!-- Custom corner grip — the lucide icon + cursor follow the `resize`\n direction. Icons inlined so no icon registration is required. -->\n <span\n [class]=\"`wr-textarea__resize wr-textarea__resize--${effectiveResize()}`\"\n aria-hidden=\"true\"\n (pointerdown)=\"startResize($event)\"\n (pointermove)=\"onResize($event)\"\n (pointerup)=\"endResize($event)\"\n (pointercancel)=\"endResize($event)\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n @switch (effectiveResize()) {\n @case ('vertical') {\n <path d=\"M12 2v20\" />\n <path d=\"m8 18 4 4 4-4\" />\n <path d=\"m8 6 4-4 4 4\" />\n }\n @case ('horizontal') {\n <path d=\"M2 12h20\" />\n <path d=\"m18 8 4 4-4 4\" />\n <path d=\"m6 8-4 4 4 4\" />\n }\n @default {\n <path d=\"M19 13v6h-6\" />\n <path d=\"M5 11V5h6\" />\n <path d=\"m5 5 14 14\" />\n }\n }\n </svg>\n </span>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/fesm2022/ngwr-theme.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DOCUMENT } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { InjectionToken, inject, signal, computed, effect, Service, makeEnvironmentProviders, provideEnvironmentInitializer } from '@angular/core';
|
|
3
|
+
import { InjectionToken, inject, signal, computed, effect, isDevMode, afterNextRender, Service, makeEnvironmentProviders, provideEnvironmentInitializer } from '@angular/core';
|
|
4
4
|
import { WrPlatform } from 'ngwr/platform';
|
|
5
5
|
import { WrStorage } from 'ngwr/storage';
|
|
6
6
|
|
|
@@ -254,6 +254,11 @@ function isThemeMode(v) {
|
|
|
254
254
|
* - Persists the selected mode via {@link WrStorage} (defaults to
|
|
255
255
|
* `localStorage`; swap the storage engine globally to change where).
|
|
256
256
|
*
|
|
257
|
+
* A configured `attribute` has to be given to the STYLESHEET too — a CSS
|
|
258
|
+
* selector cannot read a provider value — so pair it with
|
|
259
|
+
* `@use 'ngwr' with ($theme-attribute: '...')`. In dev mode the service compares
|
|
260
|
+
* the two and warns when they disagree.
|
|
261
|
+
*
|
|
257
262
|
* @example
|
|
258
263
|
* ```ts
|
|
259
264
|
* const theme = inject(WrTheme);
|
|
@@ -289,6 +294,11 @@ class WrTheme {
|
|
|
289
294
|
html.setAttribute(this.config.attribute, value);
|
|
290
295
|
this.persist(this.mode());
|
|
291
296
|
});
|
|
297
|
+
if (isDevMode() && this.platform.isBrowser) {
|
|
298
|
+
// After render, so nothing here is constructor-time DOM access — and so
|
|
299
|
+
// the stylesheet has had its chance to apply.
|
|
300
|
+
afterNextRender(() => this.warnOnAttributeMismatch());
|
|
301
|
+
}
|
|
292
302
|
}
|
|
293
303
|
/** Switch to a specific mode. */
|
|
294
304
|
set(mode) {
|
|
@@ -298,6 +308,36 @@ class WrTheme {
|
|
|
298
308
|
toggle() {
|
|
299
309
|
this.mode.set(this.resolved() === 'dark' ? 'light' : 'dark');
|
|
300
310
|
}
|
|
311
|
+
/**
|
|
312
|
+
* Dev-mode check that the STYLESHEET keys on the same attribute this service
|
|
313
|
+
* writes.
|
|
314
|
+
*
|
|
315
|
+
* `attribute` is a runtime value and a CSS selector cannot read one, so the
|
|
316
|
+
* dark block is keyed on a Sass variable (`$theme-attribute`) the consumer
|
|
317
|
+
* configures separately. That makes disagreement possible, and disagreement is
|
|
318
|
+
* silent in the worst way: the service resolves `dark`, writes the attribute,
|
|
319
|
+
* reports success — and the page stays light forever, because nothing matches.
|
|
320
|
+
*
|
|
321
|
+
* The compiled theme publishes the name it keys on as `--wr-theme-attribute`,
|
|
322
|
+
* which is what this reads. An empty value means no ngwr stylesheet is loaded
|
|
323
|
+
* (a unit test, a consumer bundling their own CSS) or that it predates v13, so
|
|
324
|
+
* the check stays quiet — it can only fire on a real mismatch, never on an
|
|
325
|
+
* absence it cannot interpret.
|
|
326
|
+
*
|
|
327
|
+
* Production builds drop the call entirely via `isDevMode()` tree-shaking.
|
|
328
|
+
*/
|
|
329
|
+
warnOnAttributeMismatch() {
|
|
330
|
+
const view = this.doc.defaultView;
|
|
331
|
+
if (!view)
|
|
332
|
+
return;
|
|
333
|
+
const declared = view.getComputedStyle(this.doc.documentElement).getPropertyValue('--wr-theme-attribute').trim();
|
|
334
|
+
if (!declared || declared === this.config.attribute)
|
|
335
|
+
return;
|
|
336
|
+
// eslint-disable-next-line no-console -- dev-mode validation
|
|
337
|
+
console.warn(`[NGWR] Theme attribute mismatch: provideWrTheme({ attribute: '${this.config.attribute}' }) ` +
|
|
338
|
+
`but the stylesheet keys its dark block on '${declared}'. Dark mode will never apply. ` +
|
|
339
|
+
`Configure both: @use 'ngwr' with ($theme-attribute: '${this.config.attribute}');`);
|
|
340
|
+
}
|
|
301
341
|
// Persistence
|
|
302
342
|
readPersisted() {
|
|
303
343
|
if (!this.config.storageKey)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-theme.mjs","sources":["../../../projects/lib/theme/colors.ts","../../../projects/lib/theme/palette.ts","../../../projects/lib/theme/wr-theme-config.ts","../../../projects/lib/theme/services/wr-theme.ts","../../../projects/lib/theme/provide-wr-theme.ts","../../../projects/lib/theme/ngwr-theme.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\n/**\n * Built-in color variants available to NGWR components.\n *\n * Kept in sync manually with the SCSS `$base-colors` map in\n * `theme/styles/_colors.scss`. Both sources must stay aligned —\n * adding a color requires updating both this array and the SCSS map.\n * Nothing enforces that, and it has already drifted once: `info` landed\n * in the map without landing here, so v8.0.0 shipped every\n * `--wr-color-info*` token — plus an `--info` modifier from each of the\n * five stylesheets that iterate the map — while this type refused the\n * value. Order matches the map so the two read as one list.\n *\n * @example\n * ```ts\n * import { WR_COLORS } from 'ngwr/theme';\n *\n * // Iterate all colors for demos or documentation\n * WR_COLORS.forEach(color => console.log(color));\n * ```\n */\nexport const WR_COLORS = [\n 'primary',\n 'secondary',\n 'success',\n 'warning',\n 'danger',\n 'info',\n 'light',\n 'medium',\n 'dark',\n] as const;\n\n/**\n * A color variant name.\n *\n * Use as an input type on components that accept a color:\n *\n * @example\n * ```ts\n * import type { WrColor } from 'ngwr/theme';\n *\n * @Component({...})\n * export class MyComponent {\n * readonly color = input<WrColor>('primary');\n * }\n * ```\n */\nexport type WrColor = (typeof WR_COLORS)[number];\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\n/**\n * The palette recipe, in TypeScript.\n *\n * `theme/styles/_colors.scss` derives seven tokens per intent from one hex, and\n * until now that arithmetic existed only in Sass — so a theme picked at RUNTIME\n * (a builder, a tenant colour from an API, a preset fetched from a registry)\n * could not reproduce it. The showcase had half of it copied by hand for its\n * own primary-colour switcher, which is the copy that drifts.\n *\n * **Seven tokens, not twelve, and that is not an omission.** The tint and ink\n * layer is written in terms of `var()`:\n *\n * ```css\n * --wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), 0.12);\n * --wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));\n * ```\n *\n * so redefining the base and its channels re-resolves `-soft`, `-soft-border`,\n * `-soft-contrast`, `-active` and `-ink` for free. A preset that also emitted\n * those would be freezing values the stylesheet is meant to keep deriving.\n *\n * **`-contrast` IS re-derived, and must be.** It picks whichever of black and\n * white scores higher against the fill, so a re-tuned intent keeps the label of\n * the colour it replaced unless something recomputes it — that is how the dark\n * theme once put white text on its lightened primary at 3.36:1.\n *\n * The LIGHT recipe only. `_dark.scss` is hand-tuned rather than derived — its\n * `dark-light` uses `color.scale(…, 70%)` where the light block uses\n * `color.adjust(…, 5%)`, and `light-light` goes -2.5% — so a generator claiming\n * to reproduce it would be lying. Feed dark seeds through the same recipe if you\n * want a derived dark theme; you will get a consistent one, not the shipped one.\n *\n * `pnpm check:theme` compiles nothing and trusts nothing: it reads the BUILT\n * stylesheet and asserts this module reproduces every one of those tokens for\n * the nine shipped intents.\n *\n * @example\n * ```ts\n * import { wrThemeTokens } from 'ngwr/theme';\n *\n * const tokens = wrThemeTokens({ primary: '#41598f' });\n * for (const [name, value] of Object.entries(tokens)) {\n * document.documentElement.style.setProperty(name, value);\n * }\n * ```\n */\n\nimport { WR_COLORS, type WrColor } from './colors';\n\n/** Lightness deltas, in PERCENTAGE POINTS, matching `color.adjust` in the SCSS. */\nconst SHADES = [\n ['dark', -5],\n ['darker', -10],\n ['light', 5],\n ['lighter', 10],\n] as const;\n\ninterface Rgb {\n readonly r: number;\n readonly g: number;\n readonly b: number;\n}\n\n/** `#rgb` / `#rrggbb` → channels. Returns `null` for anything else. */\nfunction parseHex(hex: string): Rgb | null {\n const raw = hex.trim().replace(/^#/, '');\n const full = raw.length === 3 ? [...raw].map(c => c + c).join('') : raw;\n if (!/^[0-9a-fA-F]{6}$/.test(full)) return null;\n const n = Number.parseInt(full, 16);\n /* eslint-disable no-bitwise -- unpacking a packed 24-bit colour */\n return { r: (n >> 16) & 255, g: (n >> 8) & 255, b: n & 255 };\n /* eslint-enable no-bitwise */\n}\n\nconst toHex = ({ r, g, b }: Rgb): string =>\n `#${[r, g, b].map(c => Math.round(c).toString(16).padStart(2, '0')).join('')}`;\n\nfunction rgbToHsl({ r, g, b }: Rgb): { h: number; s: number; l: number } {\n const rn = r / 255;\n const gn = g / 255;\n const bn = b / 255;\n const max = Math.max(rn, gn, bn);\n const min = Math.min(rn, gn, bn);\n const d = max - min;\n const l = (max + min) / 2;\n if (d === 0) return { h: 0, s: 0, l };\n\n const s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n let h: number;\n if (max === rn) h = (gn - bn) / d + (gn < bn ? 6 : 0);\n else if (max === gn) h = (bn - rn) / d + 2;\n else h = (rn - gn) / d + 4;\n return { h: h * 60, s, l };\n}\n\nfunction hslToRgb(h: number, s: number, l: number): Rgb {\n const c = (1 - Math.abs(2 * l - 1)) * s;\n // Two modulos, not one. `((h % 360) + 360) / 60` reads as normalisation and\n // is not: it maps 222° to sector 9.7 instead of 3.7, so every hue landed in\n // the wrong arm of the sextant table and only greys (c = x = 0) survived.\n // The parity gate caught it on the first run — `dark`'s navy came back red.\n const hp = (((h % 360) + 360) % 360) / 60;\n const x = c * (1 - Math.abs((hp % 2) - 1));\n const [rp, gp, bp] =\n hp < 1 ? [c, x, 0] : hp < 2 ? [x, c, 0] : hp < 3 ? [0, c, x] : hp < 4 ? [0, x, c] : hp < 5 ? [x, 0, c] : [c, 0, x];\n const m = l - c / 2;\n return { r: (rp + m) * 255, g: (gp + m) * 255, b: (bp + m) * 255 };\n}\n\n/** One channel, linearised per WCAG 2.x — the SCSS `_linear`. */\nfunction linear(channel: number): number {\n const s = channel / 255;\n return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;\n}\n\n/** WCAG relative luminance. */\nconst luminance = ({ r, g, b }: Rgb): number => 0.2126 * linear(r) + 0.7152 * linear(g) + 0.0722 * linear(b);\n\n/** WCAG contrast ratio between two colours. */\nfunction ratio(a: Rgb, b: Rgb): number {\n const la = luminance(a);\n const lb = luminance(b);\n return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);\n}\n\nconst BLACK: Rgb = { r: 0, g: 0, b: 0 };\nconst WHITE: Rgb = { r: 255, g: 255, b: 255 };\n\n/**\n * The readable label ON a filled intent — whichever of black and white scores\n * higher, the SCSS `_contrast()`.\n *\n * It PICKS, it does not blend, so those two values are the ceiling for every\n * intent. The comparison is `>=`, so a colour exactly at the flip point\n * (√21 ≈ 4.58 against both) takes the dark label, matching the SCSS.\n */\nfunction wrContrastFor(hex: string): string {\n const rgb = parseHex(hex);\n if (!rgb) return '#000000';\n return ratio(rgb, BLACK) >= ratio(rgb, WHITE) ? '#000000' : '#ffffff';\n}\n\n/** Shift HSL lightness by `deltaPct` PERCENTAGE POINTS, clamped — `color.adjust`. */\nfunction adjustLightness(rgb: Rgb, deltaPct: number): Rgb {\n const { h, s, l } = rgbToHsl(rgb);\n return hslToRgb(h, s, Math.min(1, Math.max(0, l + deltaPct / 100)));\n}\n\n/**\n * The seven `--wr-color-<name>*` tokens one seed produces.\n *\n * Returns an empty record for a hex it cannot parse rather than a palette built\n * on black — a silently black theme is harder to notice than a missing one.\n *\n * `name` is a shipped intent rather than any string: a token layer the\n * stylesheet never declares has nothing reading it, and a typo would otherwise\n * emit `--wr-color-primry-*` and paint nothing.\n */\nfunction wrIntentTokens(name: WrColor, seed: string): Record<string, string> {\n const rgb = parseHex(seed);\n if (!rgb) return {};\n\n const out: Record<string, string> = {\n [`--wr-color-${name}`]: toHex(rgb),\n [`--wr-color-${name}-rgb`]: `${Math.round(rgb.r)}, ${Math.round(rgb.g)}, ${Math.round(rgb.b)}`,\n [`--wr-color-${name}-contrast`]: wrContrastFor(toHex(rgb)),\n };\n for (const [suffix, delta] of SHADES) {\n out[`--wr-color-${name}-${suffix}`] = toHex(adjustLightness(rgb, delta));\n }\n return out;\n}\n\n/**\n * Every token a theme preset needs, for as many intents as it re-tunes.\n *\n * Intents left out keep the values the stylesheet compiled, so a preset that\n * only moves `primary` writes seven declarations and nothing else.\n */\nfunction wrThemeTokens(seeds: Partial<Record<WrColor, string>>): Record<string, string> {\n const out: Record<string, string> = {};\n for (const name of WR_COLORS) {\n const seed = seeds[name];\n if (seed) Object.assign(out, wrIntentTokens(name, seed));\n }\n return out;\n}\n\nexport { wrContrastFor, wrIntentTokens, wrThemeTokens };\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { InjectionToken } from '@angular/core';\n\n/** Mode the user explicitly selected. `auto` follows `prefers-color-scheme`. */\nexport type WrThemeMode = 'light' | 'dark' | 'auto';\n\n/** Resolved theme — what's actually applied to the DOM. */\nexport type WrResolvedTheme = 'light' | 'dark';\n\n/** Configuration for {@link WrTheme}. */\nexport interface WrThemeConfig {\n /** Initial mode used when no persisted value is present. @default 'auto' */\n readonly defaultMode: WrThemeMode;\n /** localStorage key for persistence. Set to `null` to disable persistence. @default 'wr-theme' */\n readonly storageKey: string | null;\n /** Attribute applied to `<html>` to expose the resolved theme. @default 'data-theme' */\n readonly attribute: string;\n}\n\nexport const DEFAULT_WR_THEME_CONFIG: WrThemeConfig = {\n defaultMode: 'auto',\n storageKey: 'wr-theme',\n attribute: 'data-theme',\n};\n\nexport const WR_THEME_CONFIG = new InjectionToken<WrThemeConfig>('WR_THEME_CONFIG', {\n factory: (): WrThemeConfig => DEFAULT_WR_THEME_CONFIG,\n});\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { DOCUMENT } from '@angular/common';\nimport { Service, type Signal, computed, effect, inject, signal } from '@angular/core';\n\nimport { WrPlatform } from 'ngwr/platform';\nimport { WrStorage } from 'ngwr/storage';\n\nimport { WR_THEME_CONFIG, type WrResolvedTheme, type WrThemeMode } from '../wr-theme-config';\n\nconst VALID_MODES: readonly WrThemeMode[] = ['light', 'dark', 'auto'];\n\nfunction isThemeMode(v: unknown): v is WrThemeMode {\n return typeof v === 'string' && (VALID_MODES as readonly string[]).includes(v);\n}\n\n/**\n * Light / dark theme manager.\n *\n * - `mode` is what the user picked (`light` | `dark` | `auto`).\n * - `resolved` is what's actually applied — `auto` resolves through\n * {@link WrPlatform.prefersDark}.\n * - Writes `[data-theme]` (or your configured attribute) on `<html>`.\n * - Persists the selected mode via {@link WrStorage} (defaults to\n * `localStorage`; swap the storage engine globally to change where).\n *\n * @example\n * ```ts\n * const theme = inject(WrTheme);\n * theme.set('dark');\n * theme.toggle();\n * theme.resolved(); // 'dark'\n * ```\n *\n * @see https://ngwr.dev/reference/services/theme\n */\n@Service()\nexport class WrTheme {\n private readonly doc = inject(DOCUMENT);\n private readonly platform = inject(WrPlatform);\n private readonly storage = inject(WrStorage);\n private readonly config = inject(WR_THEME_CONFIG);\n\n /** User-selected mode. */\n readonly mode = signal<WrThemeMode>(this.readPersisted() ?? this.config.defaultMode);\n\n /** Resolved theme actually applied to the DOM. */\n readonly resolved: Signal<WrResolvedTheme> = computed(() => {\n const m = this.mode();\n if (m === 'auto') return this.platform.prefersDark() ? 'dark' : 'light';\n return m;\n });\n\n constructor() {\n // Whenever the resolved theme changes, mirror it to the DOM + persist mode.\n effect(() => {\n const value = this.resolved();\n const html = this.doc.documentElement;\n if (html) html.setAttribute(this.config.attribute, value);\n this.persist(this.mode());\n });\n }\n\n /** Switch to a specific mode. */\n set(mode: WrThemeMode): void {\n this.mode.set(mode);\n }\n\n /** Cycle: light → dark → light (skips auto). */\n toggle(): void {\n this.mode.set(this.resolved() === 'dark' ? 'light' : 'dark');\n }\n\n // Persistence\n\n private readPersisted(): WrThemeMode | null {\n if (!this.config.storageKey) return null;\n const raw = this.storage.get<WrThemeMode>(this.config.storageKey);\n return isThemeMode(raw) ? raw : null;\n }\n\n private persist(mode: WrThemeMode): void {\n if (!this.config.storageKey) return;\n this.storage.set(this.config.storageKey, mode);\n }\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport {\n type EnvironmentProviders,\n inject,\n makeEnvironmentProviders,\n provideEnvironmentInitializer,\n} from '@angular/core';\n\nimport { WrTheme } from './services/wr-theme';\nimport { DEFAULT_WR_THEME_CONFIG, WR_THEME_CONFIG, type WrThemeConfig } from './wr-theme-config';\n\n/**\n * Configure and activate {@link WrTheme}. Config is partial — merged with\n * defaults.\n *\n * Calling this is all it takes: the initializer instantiates {@link WrTheme},\n * whose constructor effect mirrors the resolved theme onto `<html>`. Without\n * that, the service (a tree-shakable `@Service()`) would only be created once\n * something injected it, so `[data-theme]` was never written and an app that\n * followed the docs silently ignored `defaultMode: 'auto'`.\n *\n * @example\n * ```ts\n * provideWrTheme({ defaultMode: 'dark', storageKey: 'my-app-theme' })\n * ```\n */\nexport function provideWrTheme(config: Partial<WrThemeConfig> = {}): EnvironmentProviders {\n const merged: WrThemeConfig = { ...DEFAULT_WR_THEME_CONFIG, ...config };\n return makeEnvironmentProviders([\n { provide: WR_THEME_CONFIG, useValue: merged },\n provideEnvironmentInitializer(() => void inject(WrTheme)),\n ]);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ngwr-theme.mjs","sources":["../../../projects/lib/theme/colors.ts","../../../projects/lib/theme/palette.ts","../../../projects/lib/theme/wr-theme-config.ts","../../../projects/lib/theme/services/wr-theme.ts","../../../projects/lib/theme/provide-wr-theme.ts","../../../projects/lib/theme/ngwr-theme.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\n/**\n * Built-in color variants available to NGWR components.\n *\n * Kept in sync manually with the SCSS `$base-colors` map in\n * `theme/styles/_colors.scss`. Both sources must stay aligned —\n * adding a color requires updating both this array and the SCSS map.\n * Nothing enforces that, and it has already drifted once: `info` landed\n * in the map without landing here, so v8.0.0 shipped every\n * `--wr-color-info*` token — plus an `--info` modifier from each of the\n * five stylesheets that iterate the map — while this type refused the\n * value. Order matches the map so the two read as one list.\n *\n * @example\n * ```ts\n * import { WR_COLORS } from 'ngwr/theme';\n *\n * // Iterate all colors for demos or documentation\n * WR_COLORS.forEach(color => console.log(color));\n * ```\n */\nexport const WR_COLORS = [\n 'primary',\n 'secondary',\n 'success',\n 'warning',\n 'danger',\n 'info',\n 'light',\n 'medium',\n 'dark',\n] as const;\n\n/**\n * A color variant name.\n *\n * Use as an input type on components that accept a color:\n *\n * @example\n * ```ts\n * import type { WrColor } from 'ngwr/theme';\n *\n * @Component({...})\n * export class MyComponent {\n * readonly color = input<WrColor>('primary');\n * }\n * ```\n */\nexport type WrColor = (typeof WR_COLORS)[number];\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\n/**\n * The palette recipe, in TypeScript.\n *\n * `theme/styles/_colors.scss` derives seven tokens per intent from one hex, and\n * until now that arithmetic existed only in Sass — so a theme picked at RUNTIME\n * (a builder, a tenant colour from an API, a preset fetched from a registry)\n * could not reproduce it. The showcase had half of it copied by hand for its\n * own primary-colour switcher, which is the copy that drifts.\n *\n * **Seven tokens, not twelve, and that is not an omission.** The tint and ink\n * layer is written in terms of `var()`:\n *\n * ```css\n * --wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), 0.12);\n * --wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));\n * ```\n *\n * so redefining the base and its channels re-resolves `-soft`, `-soft-border`,\n * `-soft-contrast`, `-active` and `-ink` for free. A preset that also emitted\n * those would be freezing values the stylesheet is meant to keep deriving.\n *\n * **`-contrast` IS re-derived, and must be.** It picks whichever of black and\n * white scores higher against the fill, so a re-tuned intent keeps the label of\n * the colour it replaced unless something recomputes it — that is how the dark\n * theme once put white text on its lightened primary at 3.36:1.\n *\n * The LIGHT recipe only. `_dark.scss` is hand-tuned rather than derived — its\n * `dark-light` uses `color.scale(…, 70%)` where the light block uses\n * `color.adjust(…, 5%)`, and `light-light` goes -2.5% — so a generator claiming\n * to reproduce it would be lying. Feed dark seeds through the same recipe if you\n * want a derived dark theme; you will get a consistent one, not the shipped one.\n *\n * `pnpm check:theme` compiles nothing and trusts nothing: it reads the BUILT\n * stylesheet and asserts this module reproduces every one of those tokens for\n * the nine shipped intents.\n *\n * @example\n * ```ts\n * import { wrThemeTokens } from 'ngwr/theme';\n *\n * const tokens = wrThemeTokens({ primary: '#41598f' });\n * for (const [name, value] of Object.entries(tokens)) {\n * document.documentElement.style.setProperty(name, value);\n * }\n * ```\n */\n\nimport { WR_COLORS, type WrColor } from './colors';\n\n/** Lightness deltas, in PERCENTAGE POINTS, matching `color.adjust` in the SCSS. */\nconst SHADES = [\n ['dark', -5],\n ['darker', -10],\n ['light', 5],\n ['lighter', 10],\n] as const;\n\ninterface Rgb {\n readonly r: number;\n readonly g: number;\n readonly b: number;\n}\n\n/** `#rgb` / `#rrggbb` → channels. Returns `null` for anything else. */\nfunction parseHex(hex: string): Rgb | null {\n const raw = hex.trim().replace(/^#/, '');\n const full = raw.length === 3 ? [...raw].map(c => c + c).join('') : raw;\n if (!/^[0-9a-fA-F]{6}$/.test(full)) return null;\n const n = Number.parseInt(full, 16);\n /* eslint-disable no-bitwise -- unpacking a packed 24-bit colour */\n return { r: (n >> 16) & 255, g: (n >> 8) & 255, b: n & 255 };\n /* eslint-enable no-bitwise */\n}\n\nconst toHex = ({ r, g, b }: Rgb): string =>\n `#${[r, g, b].map(c => Math.round(c).toString(16).padStart(2, '0')).join('')}`;\n\nfunction rgbToHsl({ r, g, b }: Rgb): { h: number; s: number; l: number } {\n const rn = r / 255;\n const gn = g / 255;\n const bn = b / 255;\n const max = Math.max(rn, gn, bn);\n const min = Math.min(rn, gn, bn);\n const d = max - min;\n const l = (max + min) / 2;\n if (d === 0) return { h: 0, s: 0, l };\n\n const s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n let h: number;\n if (max === rn) h = (gn - bn) / d + (gn < bn ? 6 : 0);\n else if (max === gn) h = (bn - rn) / d + 2;\n else h = (rn - gn) / d + 4;\n return { h: h * 60, s, l };\n}\n\nfunction hslToRgb(h: number, s: number, l: number): Rgb {\n const c = (1 - Math.abs(2 * l - 1)) * s;\n // Two modulos, not one. `((h % 360) + 360) / 60` reads as normalisation and\n // is not: it maps 222° to sector 9.7 instead of 3.7, so every hue landed in\n // the wrong arm of the sextant table and only greys (c = x = 0) survived.\n // The parity gate caught it on the first run — `dark`'s navy came back red.\n const hp = (((h % 360) + 360) % 360) / 60;\n const x = c * (1 - Math.abs((hp % 2) - 1));\n const [rp, gp, bp] =\n hp < 1 ? [c, x, 0] : hp < 2 ? [x, c, 0] : hp < 3 ? [0, c, x] : hp < 4 ? [0, x, c] : hp < 5 ? [x, 0, c] : [c, 0, x];\n const m = l - c / 2;\n return { r: (rp + m) * 255, g: (gp + m) * 255, b: (bp + m) * 255 };\n}\n\n/** One channel, linearised per WCAG 2.x — the SCSS `_linear`. */\nfunction linear(channel: number): number {\n const s = channel / 255;\n return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;\n}\n\n/** WCAG relative luminance. */\nconst luminance = ({ r, g, b }: Rgb): number => 0.2126 * linear(r) + 0.7152 * linear(g) + 0.0722 * linear(b);\n\n/** WCAG contrast ratio between two colours. */\nfunction ratio(a: Rgb, b: Rgb): number {\n const la = luminance(a);\n const lb = luminance(b);\n return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);\n}\n\nconst BLACK: Rgb = { r: 0, g: 0, b: 0 };\nconst WHITE: Rgb = { r: 255, g: 255, b: 255 };\n\n/**\n * The readable label ON a filled intent — whichever of black and white scores\n * higher, the SCSS `_contrast()`.\n *\n * It PICKS, it does not blend, so those two values are the ceiling for every\n * intent. The comparison is `>=`, so a colour exactly at the flip point\n * (√21 ≈ 4.58 against both) takes the dark label, matching the SCSS.\n */\nfunction wrContrastFor(hex: string): string {\n const rgb = parseHex(hex);\n if (!rgb) return '#000000';\n return ratio(rgb, BLACK) >= ratio(rgb, WHITE) ? '#000000' : '#ffffff';\n}\n\n/** Shift HSL lightness by `deltaPct` PERCENTAGE POINTS, clamped — `color.adjust`. */\nfunction adjustLightness(rgb: Rgb, deltaPct: number): Rgb {\n const { h, s, l } = rgbToHsl(rgb);\n return hslToRgb(h, s, Math.min(1, Math.max(0, l + deltaPct / 100)));\n}\n\n/**\n * The seven `--wr-color-<name>*` tokens one seed produces.\n *\n * Returns an empty record for a hex it cannot parse rather than a palette built\n * on black — a silently black theme is harder to notice than a missing one.\n *\n * `name` is a shipped intent rather than any string: a token layer the\n * stylesheet never declares has nothing reading it, and a typo would otherwise\n * emit `--wr-color-primry-*` and paint nothing.\n */\nfunction wrIntentTokens(name: WrColor, seed: string): Record<string, string> {\n const rgb = parseHex(seed);\n if (!rgb) return {};\n\n const out: Record<string, string> = {\n [`--wr-color-${name}`]: toHex(rgb),\n [`--wr-color-${name}-rgb`]: `${Math.round(rgb.r)}, ${Math.round(rgb.g)}, ${Math.round(rgb.b)}`,\n [`--wr-color-${name}-contrast`]: wrContrastFor(toHex(rgb)),\n };\n for (const [suffix, delta] of SHADES) {\n out[`--wr-color-${name}-${suffix}`] = toHex(adjustLightness(rgb, delta));\n }\n return out;\n}\n\n/**\n * Every token a theme preset needs, for as many intents as it re-tunes.\n *\n * Intents left out keep the values the stylesheet compiled, so a preset that\n * only moves `primary` writes seven declarations and nothing else.\n */\nfunction wrThemeTokens(seeds: Partial<Record<WrColor, string>>): Record<string, string> {\n const out: Record<string, string> = {};\n for (const name of WR_COLORS) {\n const seed = seeds[name];\n if (seed) Object.assign(out, wrIntentTokens(name, seed));\n }\n return out;\n}\n\nexport { wrContrastFor, wrIntentTokens, wrThemeTokens };\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { InjectionToken } from '@angular/core';\n\n/** Mode the user explicitly selected. `auto` follows `prefers-color-scheme`. */\nexport type WrThemeMode = 'light' | 'dark' | 'auto';\n\n/** Resolved theme — what's actually applied to the DOM. */\nexport type WrResolvedTheme = 'light' | 'dark';\n\n/** Configuration for {@link WrTheme}. */\nexport interface WrThemeConfig {\n /** Initial mode used when no persisted value is present. @default 'auto' */\n readonly defaultMode: WrThemeMode;\n /** localStorage key for persistence. Set to `null` to disable persistence. @default 'wr-theme' */\n readonly storageKey: string | null;\n /** Attribute applied to `<html>` to expose the resolved theme. @default 'data-theme' */\n readonly attribute: string;\n}\n\nexport const DEFAULT_WR_THEME_CONFIG: WrThemeConfig = {\n defaultMode: 'auto',\n storageKey: 'wr-theme',\n attribute: 'data-theme',\n};\n\nexport const WR_THEME_CONFIG = new InjectionToken<WrThemeConfig>('WR_THEME_CONFIG', {\n factory: (): WrThemeConfig => DEFAULT_WR_THEME_CONFIG,\n});\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { DOCUMENT } from '@angular/common';\nimport { Service, type Signal, afterNextRender, computed, effect, inject, isDevMode, signal } from '@angular/core';\n\nimport { WrPlatform } from 'ngwr/platform';\nimport { WrStorage } from 'ngwr/storage';\n\nimport { WR_THEME_CONFIG, type WrResolvedTheme, type WrThemeMode } from '../wr-theme-config';\n\nconst VALID_MODES: readonly WrThemeMode[] = ['light', 'dark', 'auto'];\n\nfunction isThemeMode(v: unknown): v is WrThemeMode {\n return typeof v === 'string' && (VALID_MODES as readonly string[]).includes(v);\n}\n\n/**\n * Light / dark theme manager.\n *\n * - `mode` is what the user picked (`light` | `dark` | `auto`).\n * - `resolved` is what's actually applied — `auto` resolves through\n * {@link WrPlatform.prefersDark}.\n * - Writes `[data-theme]` (or your configured attribute) on `<html>`.\n * - Persists the selected mode via {@link WrStorage} (defaults to\n * `localStorage`; swap the storage engine globally to change where).\n *\n * A configured `attribute` has to be given to the STYLESHEET too — a CSS\n * selector cannot read a provider value — so pair it with\n * `@use 'ngwr' with ($theme-attribute: '...')`. In dev mode the service compares\n * the two and warns when they disagree.\n *\n * @example\n * ```ts\n * const theme = inject(WrTheme);\n * theme.set('dark');\n * theme.toggle();\n * theme.resolved(); // 'dark'\n * ```\n *\n * @see https://ngwr.dev/reference/services/theme\n */\n@Service()\nexport class WrTheme {\n private readonly doc = inject(DOCUMENT);\n private readonly platform = inject(WrPlatform);\n private readonly storage = inject(WrStorage);\n private readonly config = inject(WR_THEME_CONFIG);\n\n /** User-selected mode. */\n readonly mode = signal<WrThemeMode>(this.readPersisted() ?? this.config.defaultMode);\n\n /** Resolved theme actually applied to the DOM. */\n readonly resolved: Signal<WrResolvedTheme> = computed(() => {\n const m = this.mode();\n if (m === 'auto') return this.platform.prefersDark() ? 'dark' : 'light';\n return m;\n });\n\n constructor() {\n // Whenever the resolved theme changes, mirror it to the DOM + persist mode.\n effect(() => {\n const value = this.resolved();\n const html = this.doc.documentElement;\n if (html) html.setAttribute(this.config.attribute, value);\n this.persist(this.mode());\n });\n\n if (isDevMode() && this.platform.isBrowser) {\n // After render, so nothing here is constructor-time DOM access — and so\n // the stylesheet has had its chance to apply.\n afterNextRender(() => this.warnOnAttributeMismatch());\n }\n }\n\n /** Switch to a specific mode. */\n set(mode: WrThemeMode): void {\n this.mode.set(mode);\n }\n\n /** Cycle: light → dark → light (skips auto). */\n toggle(): void {\n this.mode.set(this.resolved() === 'dark' ? 'light' : 'dark');\n }\n\n /**\n * Dev-mode check that the STYLESHEET keys on the same attribute this service\n * writes.\n *\n * `attribute` is a runtime value and a CSS selector cannot read one, so the\n * dark block is keyed on a Sass variable (`$theme-attribute`) the consumer\n * configures separately. That makes disagreement possible, and disagreement is\n * silent in the worst way: the service resolves `dark`, writes the attribute,\n * reports success — and the page stays light forever, because nothing matches.\n *\n * The compiled theme publishes the name it keys on as `--wr-theme-attribute`,\n * which is what this reads. An empty value means no ngwr stylesheet is loaded\n * (a unit test, a consumer bundling their own CSS) or that it predates v13, so\n * the check stays quiet — it can only fire on a real mismatch, never on an\n * absence it cannot interpret.\n *\n * Production builds drop the call entirely via `isDevMode()` tree-shaking.\n */\n private warnOnAttributeMismatch(): void {\n const view = this.doc.defaultView;\n if (!view) return;\n\n const declared = view.getComputedStyle(this.doc.documentElement).getPropertyValue('--wr-theme-attribute').trim();\n if (!declared || declared === this.config.attribute) return;\n\n // eslint-disable-next-line no-console -- dev-mode validation\n console.warn(\n `[NGWR] Theme attribute mismatch: provideWrTheme({ attribute: '${this.config.attribute}' }) ` +\n `but the stylesheet keys its dark block on '${declared}'. Dark mode will never apply. ` +\n `Configure both: @use 'ngwr' with ($theme-attribute: '${this.config.attribute}');`\n );\n }\n\n // Persistence\n\n private readPersisted(): WrThemeMode | null {\n if (!this.config.storageKey) return null;\n const raw = this.storage.get<WrThemeMode>(this.config.storageKey);\n return isThemeMode(raw) ? raw : null;\n }\n\n private persist(mode: WrThemeMode): void {\n if (!this.config.storageKey) return;\n this.storage.set(this.config.storageKey, mode);\n }\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport {\n type EnvironmentProviders,\n inject,\n makeEnvironmentProviders,\n provideEnvironmentInitializer,\n} from '@angular/core';\n\nimport { WrTheme } from './services/wr-theme';\nimport { DEFAULT_WR_THEME_CONFIG, WR_THEME_CONFIG, type WrThemeConfig } from './wr-theme-config';\n\n/**\n * Configure and activate {@link WrTheme}. Config is partial — merged with\n * defaults.\n *\n * Calling this is all it takes: the initializer instantiates {@link WrTheme},\n * whose constructor effect mirrors the resolved theme onto `<html>`. Without\n * that, the service (a tree-shakable `@Service()`) would only be created once\n * something injected it, so `[data-theme]` was never written and an app that\n * followed the docs silently ignored `defaultMode: 'auto'`.\n *\n * @example\n * ```ts\n * provideWrTheme({ defaultMode: 'dark', storageKey: 'my-app-theme' })\n * ```\n */\nexport function provideWrTheme(config: Partial<WrThemeConfig> = {}): EnvironmentProviders {\n const merged: WrThemeConfig = { ...DEFAULT_WR_THEME_CONFIG, ...config };\n return makeEnvironmentProviders([\n { provide: WR_THEME_CONFIG, useValue: merged },\n provideEnvironmentInitializer(() => void inject(WrTheme)),\n ]);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -151,7 +151,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
|
|
|
151
151
|
*/
|
|
152
152
|
class WrTiltCard {
|
|
153
153
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrTiltCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
154
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.4", type: WrTiltCard, isStandalone: true, selector: "wr-tilt-card", host: { classAttribute: "wr-tilt-card" }, hostDirectives: [{ directive: WrTilt, inputs: ["maxTilt", "maxTilt", "perspective", "perspective", "scale", "scale", "glare", "glare"] }], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@charset \"UTF-8\";:where([class^=wr-],[class*=\" wr-\"]),:where([class^=wr-],[class*=\" wr-\"]):before,:where([class^=wr-],[class*=\" wr-\"]):after{box-sizing:border-box}:root{color-scheme:light;--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-muted-text: #5f6c7d;--wr-color-muted-text-rgb: 95, 108, 125;--wr-color-gray-50: #f8fafc;--wr-color-gray-100: #f1f5f9;--wr-color-gray-200: #e2e8f0;--wr-color-gray-300: #cbd5e1;--wr-color-gray-400: #94a3b8;--wr-color-gray-500: #64748b;--wr-color-gray-600: #475569;--wr-color-gray-700: #334155;--wr-color-gray-800: #1e293b;--wr-color-gray-900: #0f172a;--wr-color-gray-950: #020617;--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #e21a62;--wr-color-secondary-rgb: 226, 26, 98;--wr-color-secondary-contrast: #ffffff;--wr-color-secondary-dark: rgb(203.130952381, 23.369047619, 88.0833333333);--wr-color-secondary-darker: rgb(180.2619047619, 20.7380952381, 78.1666666667);--wr-color-secondary-light: rgb(231.0119047619, 46.4880952381, 112.9166666667);--wr-color-secondary-lighter: rgb(233.6428571429, 69.3571428571, 128.5);--wr-color-success: #008800;--wr-color-success-rgb: 0, 136, 0;--wr-color-success-contrast: #ffffff;--wr-color-success-dark: rgb(0, 110.5, 0);--wr-color-success-darker: #005500;--wr-color-success-light: rgb(0, 161.5, 0);--wr-color-success-lighter: #00bb00;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #000000;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #dc3137;--wr-color-danger-rgb: 220, 49, 55;--wr-color-danger-contrast: #ffffff;--wr-color-danger-dark: rgb(208.1369294606, 35.3630705394, 41.4253112033);--wr-color-danger-darker: rgb(186.3402489627, 31.6597510373, 37.0871369295);--wr-color-danger-light: rgb(223.7033195021, 70.7966804979, 76.1618257261);--wr-color-danger-lighter: rgb(227.4066390041, 92.5933609959, 97.3236514523);--wr-color-info: #3472d9;--wr-color-info-rgb: 52, 114, 217;--wr-color-info-contrast: #ffffff;--wr-color-info-dark: rgb(38.3941908714, 101.0373443983, 205.1058091286);--wr-color-info-darker: rgb(34.3734439834, 90.4564315353, 183.6265560166);--wr-color-info-light: rgb(73.479253112, 128.9190871369, 221.020746888);--wr-color-info-lighter: rgb(94.9585062241, 143.8381742739, 225.0414937759);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #000000;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #6a7683;--wr-color-medium-rgb: 106, 118, 131;--wr-color-medium-contrast: #ffffff;--wr-color-medium-dark: rgb(94.5949367089, 105.3037974684, 116.9050632911);--wr-color-medium-darker: rgb(83.1898734177, 92.6075949367, 102.8101265823);--wr-color-medium-light: rgb(118.1962025316, 130.7278481013, 144.3037974684);--wr-color-medium-lighter: rgb(132.2911392405, 143.5316455696, 155.7088607595);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684);--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-fill-subtle: rgba(var(--wr-color-light-rgb), .15);--wr-color-fill: rgba(var(--wr-color-light-rgb), .3);--wr-color-fill-strong: rgba(var(--wr-color-light-rgb), .55);--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-control-padding-y-sm: .125rem;--wr-control-padding-y-md: .25rem;--wr-control-padding-y-lg: .3125rem;--wr-control-padding-x-sm: .5rem;--wr-control-padding-x-md: .75rem;--wr-control-padding-x-lg: 1rem;--wr-control-line-height-sm: 1rem;--wr-control-line-height-md: 1.25rem;--wr-control-line-height-lg: 1.5rem;--wr-control-font-size-sm: var(--wr-text-xs);--wr-control-font-size-md: var(--wr-text-sm);--wr-control-font-size-lg: var(--wr-text-base);--wr-control-radius-sm: 5px;--wr-control-radius-md: 6px;--wr-control-radius-lg: 7px;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-disabled-opacity: .6;--wr-focus-ring-width: 2px;--wr-focus-ring-offset: 2px;--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em;--wr-focus-ring-color: var(--wr-color-primary);--wr-focus-ring-halo: rgba(var(--wr-color-primary-rgb), .25)}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-dark-light: rgb(247.5, 249, 251.4);--wr-color-dark-lighter: rgb(251.25, 252, 253.2);--wr-color-dark-dark: rgb(212.7702702703, 221.2162162162, 234.7297297297);--wr-color-dark-darker: rgb(195.5405405405, 207.4324324324, 226.4594594595);--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-light-light: rgb(33.429245283, 41.3466981132, 59.820754717);--wr-color-light-dark: rgb(47.141509434, 58.3066037736, 84.358490566);--wr-color-medium: #6d7682;--wr-color-medium-rgb: 109, 118, 130;--wr-color-medium-contrast: #ffffff;--wr-color-medium-light: rgb(121.4644351464, 130.7092050209, 143.0355648536);--wr-color-medium-lighter: rgb(135.3347280335, 143.6192468619, 154.6652719665);--wr-color-medium-dark: rgb(97.370292887, 105.410041841, 116.129707113);--wr-color-medium-darker: rgb(85.7405857741, 92.820083682, 102.2594142259);--wr-color-muted-text: #9aa6b8;--wr-color-muted-text-rgb: 154, 166, 184;--wr-color-primary: #3567ff;--wr-color-primary-contrast: #ffffff;--wr-color-primary-rgb: 53, 103, 255;--wr-color-primary-light: #547eff;--wr-color-primary-dark: #2848aa;--wr-color-primary-lighter: #7396ff;--wr-color-primary-darker: #183179;--wr-color-success: #23863c;--wr-color-success-contrast: #ffffff;--wr-color-success-rgb: 35, 134, 60;--wr-color-success-light: rgb(40.2810650888, 154.2189349112, 69.0532544379);--wr-color-success-lighter: rgb(45.5621301775, 174.4378698225, 78.1065088757);--wr-color-success-dark: rgb(29.7189349112, 113.7810650888, 50.9467455621);--wr-color-success-darker: rgb(24.4378698225, 93.5621301775, 41.8934911243);--wr-color-warning: #ffcc33;--wr-color-warning-contrast: #000000;--wr-color-warning-rgb: 255, 204, 51;--wr-color-warning-light: rgb(255, 210.375, 76.5);--wr-color-warning-lighter: rgb(255, 216.75, 102);--wr-color-warning-dark: rgb(255, 197.625, 25.5);--wr-color-warning-darker: rgb(255, 191.25, 0);--wr-color-danger: #ca4949;--wr-color-danger-contrast: #ffffff;--wr-color-danger-rgb: 202, 73, 73;--wr-color-danger-light: rgb(207.7510638298, 92.7489361702, 92.7489361702);--wr-color-danger-lighter: rgb(213.5021276596, 112.4978723404, 112.4978723404);--wr-color-danger-dark: rgb(193.229787234, 56.270212766, 56.270212766);--wr-color-danger-darker: rgb(173.4808510638, 50.5191489362, 50.5191489362);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-fill-subtle: rgba(var(--wr-color-light-rgb), .15);--wr-color-fill: rgba(var(--wr-color-light-rgb), .3);--wr-color-fill-strong: rgba(var(--wr-color-light-rgb), .55);--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark);--wr-focus-ring-color: var(--wr-color-primary);--wr-focus-ring-halo: rgba(var(--wr-color-primary-rgb), .25);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-sidebar__entry:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-sidebar__item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-anchor__link:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-collapse__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-mention-panel__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-segmented__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-back-top:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-stepper__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-window__chrome-action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-dropdown-item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-alert__close:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-tilt-card{display:block;position:relative;padding:1.5rem;border-radius:.75rem;border:1px solid var(--wr-color-outline);background:var(--wr-color-surface);color:var(--wr-color-on-surface);box-shadow:0 1px 2px rgba(var(--wr-color-backdrop-rgb),.06);transform-style:preserve-3d;transition:transform .15s ease-out}.wr-tilt-glare{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--wr-tilt-glare-x, 50%) var(--wr-tilt-glare-y, 50%),var(--wr-tilt-glare-color, rgba(var(--wr-color-on-surface-rgb), .12)),transparent 60%);mix-blend-mode:multiply}[data-theme=dark] .wr-tilt-glare{--wr-tilt-glare-color: rgb(255 255 255 / 25%);mix-blend-mode:overlay}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
154
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.4", type: WrTiltCard, isStandalone: true, selector: "wr-tilt-card", host: { classAttribute: "wr-tilt-card" }, hostDirectives: [{ directive: WrTilt, inputs: ["maxTilt", "maxTilt", "perspective", "perspective", "scale", "scale", "glare", "glare"] }], ngImport: i0, template: '<ng-content />', isInline: true, styles: [".wr-tilt-card{display:block;position:relative;padding:1.5rem;border-radius:.75rem;border:1px solid var(--wr-color-outline);background:var(--wr-color-surface);color:var(--wr-color-on-surface);box-shadow:0 1px 2px rgba(var(--wr-color-backdrop-rgb),.06);transform-style:preserve-3d;transition:transform .15s ease-out}.wr-tilt-glare{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--wr-tilt-glare-x, 50%) var(--wr-tilt-glare-y, 50%),var(--wr-tilt-glare-color, rgba(var(--wr-color-on-surface-rgb), .12)),transparent 60%);mix-blend-mode:multiply}[data-theme=dark] .wr-tilt-glare{--wr-tilt-glare-color: rgb(255 255 255 / 25%);mix-blend-mode:overlay}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
155
155
|
}
|
|
156
156
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrTiltCard, decorators: [{
|
|
157
157
|
type: Component,
|
|
@@ -160,7 +160,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
|
|
|
160
160
|
directive: WrTilt,
|
|
161
161
|
inputs: ['maxTilt', 'perspective', 'scale', 'glare'],
|
|
162
162
|
},
|
|
163
|
-
], host: { class: 'wr-tilt-card' }, styles: ["@charset \"UTF-8\";:where([class^=wr-],[class*=\" wr-\"]),:where([class^=wr-],[class*=\" wr-\"]):before,:where([class^=wr-],[class*=\" wr-\"]):after{box-sizing:border-box}:root{color-scheme:light;--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-muted-text: #5f6c7d;--wr-color-muted-text-rgb: 95, 108, 125;--wr-color-gray-50: #f8fafc;--wr-color-gray-100: #f1f5f9;--wr-color-gray-200: #e2e8f0;--wr-color-gray-300: #cbd5e1;--wr-color-gray-400: #94a3b8;--wr-color-gray-500: #64748b;--wr-color-gray-600: #475569;--wr-color-gray-700: #334155;--wr-color-gray-800: #1e293b;--wr-color-gray-900: #0f172a;--wr-color-gray-950: #020617;--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #e21a62;--wr-color-secondary-rgb: 226, 26, 98;--wr-color-secondary-contrast: #ffffff;--wr-color-secondary-dark: rgb(203.130952381, 23.369047619, 88.0833333333);--wr-color-secondary-darker: rgb(180.2619047619, 20.7380952381, 78.1666666667);--wr-color-secondary-light: rgb(231.0119047619, 46.4880952381, 112.9166666667);--wr-color-secondary-lighter: rgb(233.6428571429, 69.3571428571, 128.5);--wr-color-success: #008800;--wr-color-success-rgb: 0, 136, 0;--wr-color-success-contrast: #ffffff;--wr-color-success-dark: rgb(0, 110.5, 0);--wr-color-success-darker: #005500;--wr-color-success-light: rgb(0, 161.5, 0);--wr-color-success-lighter: #00bb00;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #000000;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #dc3137;--wr-color-danger-rgb: 220, 49, 55;--wr-color-danger-contrast: #ffffff;--wr-color-danger-dark: rgb(208.1369294606, 35.3630705394, 41.4253112033);--wr-color-danger-darker: rgb(186.3402489627, 31.6597510373, 37.0871369295);--wr-color-danger-light: rgb(223.7033195021, 70.7966804979, 76.1618257261);--wr-color-danger-lighter: rgb(227.4066390041, 92.5933609959, 97.3236514523);--wr-color-info: #3472d9;--wr-color-info-rgb: 52, 114, 217;--wr-color-info-contrast: #ffffff;--wr-color-info-dark: rgb(38.3941908714, 101.0373443983, 205.1058091286);--wr-color-info-darker: rgb(34.3734439834, 90.4564315353, 183.6265560166);--wr-color-info-light: rgb(73.479253112, 128.9190871369, 221.020746888);--wr-color-info-lighter: rgb(94.9585062241, 143.8381742739, 225.0414937759);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #000000;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #6a7683;--wr-color-medium-rgb: 106, 118, 131;--wr-color-medium-contrast: #ffffff;--wr-color-medium-dark: rgb(94.5949367089, 105.3037974684, 116.9050632911);--wr-color-medium-darker: rgb(83.1898734177, 92.6075949367, 102.8101265823);--wr-color-medium-light: rgb(118.1962025316, 130.7278481013, 144.3037974684);--wr-color-medium-lighter: rgb(132.2911392405, 143.5316455696, 155.7088607595);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684);--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-fill-subtle: rgba(var(--wr-color-light-rgb), .15);--wr-color-fill: rgba(var(--wr-color-light-rgb), .3);--wr-color-fill-strong: rgba(var(--wr-color-light-rgb), .55);--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-control-padding-y-sm: .125rem;--wr-control-padding-y-md: .25rem;--wr-control-padding-y-lg: .3125rem;--wr-control-padding-x-sm: .5rem;--wr-control-padding-x-md: .75rem;--wr-control-padding-x-lg: 1rem;--wr-control-line-height-sm: 1rem;--wr-control-line-height-md: 1.25rem;--wr-control-line-height-lg: 1.5rem;--wr-control-font-size-sm: var(--wr-text-xs);--wr-control-font-size-md: var(--wr-text-sm);--wr-control-font-size-lg: var(--wr-text-base);--wr-control-radius-sm: 5px;--wr-control-radius-md: 6px;--wr-control-radius-lg: 7px;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-disabled-opacity: .6;--wr-focus-ring-width: 2px;--wr-focus-ring-offset: 2px;--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em;--wr-focus-ring-color: var(--wr-color-primary);--wr-focus-ring-halo: rgba(var(--wr-color-primary-rgb), .25)}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-dark-light: rgb(247.5, 249, 251.4);--wr-color-dark-lighter: rgb(251.25, 252, 253.2);--wr-color-dark-dark: rgb(212.7702702703, 221.2162162162, 234.7297297297);--wr-color-dark-darker: rgb(195.5405405405, 207.4324324324, 226.4594594595);--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-light-light: rgb(33.429245283, 41.3466981132, 59.820754717);--wr-color-light-dark: rgb(47.141509434, 58.3066037736, 84.358490566);--wr-color-medium: #6d7682;--wr-color-medium-rgb: 109, 118, 130;--wr-color-medium-contrast: #ffffff;--wr-color-medium-light: rgb(121.4644351464, 130.7092050209, 143.0355648536);--wr-color-medium-lighter: rgb(135.3347280335, 143.6192468619, 154.6652719665);--wr-color-medium-dark: rgb(97.370292887, 105.410041841, 116.129707113);--wr-color-medium-darker: rgb(85.7405857741, 92.820083682, 102.2594142259);--wr-color-muted-text: #9aa6b8;--wr-color-muted-text-rgb: 154, 166, 184;--wr-color-primary: #3567ff;--wr-color-primary-contrast: #ffffff;--wr-color-primary-rgb: 53, 103, 255;--wr-color-primary-light: #547eff;--wr-color-primary-dark: #2848aa;--wr-color-primary-lighter: #7396ff;--wr-color-primary-darker: #183179;--wr-color-success: #23863c;--wr-color-success-contrast: #ffffff;--wr-color-success-rgb: 35, 134, 60;--wr-color-success-light: rgb(40.2810650888, 154.2189349112, 69.0532544379);--wr-color-success-lighter: rgb(45.5621301775, 174.4378698225, 78.1065088757);--wr-color-success-dark: rgb(29.7189349112, 113.7810650888, 50.9467455621);--wr-color-success-darker: rgb(24.4378698225, 93.5621301775, 41.8934911243);--wr-color-warning: #ffcc33;--wr-color-warning-contrast: #000000;--wr-color-warning-rgb: 255, 204, 51;--wr-color-warning-light: rgb(255, 210.375, 76.5);--wr-color-warning-lighter: rgb(255, 216.75, 102);--wr-color-warning-dark: rgb(255, 197.625, 25.5);--wr-color-warning-darker: rgb(255, 191.25, 0);--wr-color-danger: #ca4949;--wr-color-danger-contrast: #ffffff;--wr-color-danger-rgb: 202, 73, 73;--wr-color-danger-light: rgb(207.7510638298, 92.7489361702, 92.7489361702);--wr-color-danger-lighter: rgb(213.5021276596, 112.4978723404, 112.4978723404);--wr-color-danger-dark: rgb(193.229787234, 56.270212766, 56.270212766);--wr-color-danger-darker: rgb(173.4808510638, 50.5191489362, 50.5191489362);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-fill-subtle: rgba(var(--wr-color-light-rgb), .15);--wr-color-fill: rgba(var(--wr-color-light-rgb), .3);--wr-color-fill-strong: rgba(var(--wr-color-light-rgb), .55);--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark);--wr-focus-ring-color: var(--wr-color-primary);--wr-focus-ring-halo: rgba(var(--wr-color-primary-rgb), .25);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-sidebar__entry:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-sidebar__item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-anchor__link:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-collapse__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-mention-panel__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-segmented__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-back-top:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-stepper__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-window__chrome-action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-dropdown-item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-alert__close:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-tilt-card{display:block;position:relative;padding:1.5rem;border-radius:.75rem;border:1px solid var(--wr-color-outline);background:var(--wr-color-surface);color:var(--wr-color-on-surface);box-shadow:0 1px 2px rgba(var(--wr-color-backdrop-rgb),.06);transform-style:preserve-3d;transition:transform .15s ease-out}.wr-tilt-glare{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--wr-tilt-glare-x, 50%) var(--wr-tilt-glare-y, 50%),var(--wr-tilt-glare-color, rgba(var(--wr-color-on-surface-rgb), .12)),transparent 60%);mix-blend-mode:multiply}[data-theme=dark] .wr-tilt-glare{--wr-tilt-glare-color: rgb(255 255 255 / 25%);mix-blend-mode:overlay}\n"] }]
|
|
163
|
+
], host: { class: 'wr-tilt-card' }, styles: [".wr-tilt-card{display:block;position:relative;padding:1.5rem;border-radius:.75rem;border:1px solid var(--wr-color-outline);background:var(--wr-color-surface);color:var(--wr-color-on-surface);box-shadow:0 1px 2px rgba(var(--wr-color-backdrop-rgb),.06);transform-style:preserve-3d;transition:transform .15s ease-out}.wr-tilt-glare{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--wr-tilt-glare-x, 50%) var(--wr-tilt-glare-y, 50%),var(--wr-tilt-glare-color, rgba(var(--wr-color-on-surface-rgb), .12)),transparent 60%);mix-blend-mode:multiply}[data-theme=dark] .wr-tilt-glare{--wr-tilt-glare-color: rgb(255 255 255 / 25%);mix-blend-mode:overlay}\n"] }]
|
|
164
164
|
}] });
|
|
165
165
|
|
|
166
166
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-tilt-card.mjs","sources":["../../../projects/lib/tilt-card/tilt.ts","../../../projects/lib/tilt-card/tilt-card.ts","../../../projects/lib/tilt-card/ngwr-tilt-card.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { isPlatformBrowser } from '@angular/common';\nimport { DestroyRef, Directive, ElementRef, NgZone, PLATFORM_ID, effect, inject, input } from '@angular/core';\n\nimport { WrPlatform } from 'ngwr/platform';\n\n/**\n * 3D mouse-tilt on hover. Adds `perspective(…) rotateX(…) rotateY(…)` to\n * the host's transform tracking the cursor's position over it.\n *\n * @example\n * ```html\n * <div class=\"card\" wrTilt>…</div>\n * <div class=\"card\" wrTilt maxTilt=\"20\" [glare]=\"true\">…</div>\n * ```\n */\n@Directive({\n selector: '[wrTilt]',\n host: { '(pointermove)': 'onMove($event)', '(pointerleave)': 'onLeave()' },\n})\nexport class WrTilt {\n /** Maximum tilt in degrees. @default 12 */\n readonly maxTilt = input(12, { transform: (v: unknown): number => Math.max(0, coerceNumberProperty(v, 12)) });\n\n /** CSS perspective in pixels. @default 800 */\n readonly perspective = input(800, {\n transform: (v: unknown): number => Math.max(100, coerceNumberProperty(v, 800)),\n });\n\n /** Scale applied while hovered. @default 1.03 */\n readonly scale = input(1.03, { transform: (v: unknown): number => Math.max(1, coerceNumberProperty(v, 1.03)) });\n\n /** Add a moving glare highlight overlay. @default false */\n readonly glare = input(false, { transform: coerceBooleanProperty });\n\n private readonly el = inject<ElementRef<HTMLElement>>(ElementRef);\n private readonly zone = inject(NgZone);\n private readonly destroyRef = inject(DestroyRef);\n private readonly platform = inject(WrPlatform);\n private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n\n private glareEl: HTMLElement | null = null;\n private priorOverflow = '';\n private priorPosition = '';\n\n constructor() {\n const host = this.el.nativeElement;\n host.style.transformStyle = 'preserve-3d';\n host.style.transition = 'transform 0.15s ease-out';\n\n // Signal inputs are not bound yet while the constructor runs, so reading\n // `glare()` here would always see the default and the overlay would never\n // appear. Track it instead, so toggling the input at runtime works too.\n // Only in the browser: `installGlare` measures with `getComputedStyle`,\n // and the server has no layout to measure.\n if (this.isBrowser) {\n effect(() => (this.glare() ? this.installGlare() : this.removeGlare()));\n }\n\n this.destroyRef.onDestroy(() => {\n host.style.transform = '';\n this.removeGlare();\n });\n }\n\n /** @internal */\n protected onMove(event: PointerEvent): void {\n // Reduced motion: no pointer-tracking tilt — the card stays flat.\n if (this.platform.prefersReducedMotion()) return;\n this.zone.runOutsideAngular(() => {\n const host = this.el.nativeElement;\n const rect = host.getBoundingClientRect();\n const px = (event.clientX - rect.left) / rect.width;\n const py = (event.clientY - rect.top) / rect.height;\n const rx = (0.5 - py) * this.maxTilt();\n const ry = (px - 0.5) * this.maxTilt();\n host.style.transform = `perspective(${this.perspective()}px) rotateX(${rx}deg) rotateY(${ry}deg) scale(${this.scale()})`;\n if (this.glare()) {\n host.style.setProperty('--wr-tilt-glare-x', `${px * 100}%`);\n host.style.setProperty('--wr-tilt-glare-y', `${py * 100}%`);\n }\n });\n }\n\n /** @internal */\n protected onLeave(): void {\n this.el.nativeElement.style.transform = '';\n }\n\n private installGlare(): void {\n if (this.glareEl) return;\n const host = this.el.nativeElement;\n\n // Remembered, not assumed: `overflow` is written unconditionally, so it can be\n // clobbering an author's own inline value, and a blanket `removeProperty` on the\n // way out would delete it. Capturing the empty string is exactly what restores an\n // element that had none — which is the common case, and the one that used to keep\n // `overflow: hidden` for good after `[glare]` was turned back off.\n this.priorOverflow = host.style.overflow;\n this.priorPosition = host.style.position;\n\n if (getComputedStyle(host).position === 'static') host.style.position = 'relative';\n host.style.overflow = 'hidden';\n const glare = host.ownerDocument.createElement('span');\n glare.className = 'wr-tilt-glare';\n glare.setAttribute('aria-hidden', 'true');\n host.appendChild(glare);\n this.glareEl = glare;\n }\n\n private removeGlare(): void {\n if (!this.glareEl) return;\n\n const host = this.el.nativeElement;\n this.glareEl.remove();\n this.glareEl = null;\n host.style.overflow = this.priorOverflow;\n host.style.position = this.priorPosition;\n // Nothing reads these once the overlay is gone; leaving them behind only makes a\n // destroyed directive look like it is still tracking a pointer.\n host.style.removeProperty('--wr-tilt-glare-x');\n host.style.removeProperty('--wr-tilt-glare-y');\n }\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation } from '@angular/core';\n\nimport { WrTilt } from './tilt';\n\n/**\n * Card wrapper that applies the `[wrTilt]` directive out-of-the-box,\n * plus a small set of card-style defaults (radius, padding, surface).\n * Pass any inputs through — they're forwarded to the hosted directive.\n *\n * For arbitrary elements that just need the tilt behaviour, use the\n * `[wrTilt]` directive directly:\n *\n * ```html\n * <img wrTilt [maxTilt]=\"10\" src=\"…\" />\n * ```\n *\n * @example\n * ```html\n * <wr-tilt-card>\n * <h3>Hello</h3>\n * <p>Move the cursor across me.</p>\n * </wr-tilt-card>\n *\n * <wr-tilt-card [maxTilt]=\"20\" [glare]=\"true\">…</wr-tilt-card>\n * ```\n */\n@Component({\n selector: 'wr-tilt-card',\n template: '<ng-content />',\n styleUrl: './tilt-card.scss',\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [\n {\n directive: WrTilt,\n inputs: ['maxTilt', 'perspective', 'scale', 'glare'],\n },\n ],\n host: { class: 'wr-tilt-card' },\n})\nexport class WrTiltCard {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ngwr-tilt-card.mjs","sources":["../../../projects/lib/tilt-card/tilt.ts","../../../projects/lib/tilt-card/tilt-card.ts","../../../projects/lib/tilt-card/ngwr-tilt-card.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { isPlatformBrowser } from '@angular/common';\nimport { DestroyRef, Directive, ElementRef, NgZone, PLATFORM_ID, effect, inject, input } from '@angular/core';\n\nimport { WrPlatform } from 'ngwr/platform';\n\n/**\n * 3D mouse-tilt on hover. Adds `perspective(…) rotateX(…) rotateY(…)` to\n * the host's transform tracking the cursor's position over it.\n *\n * @example\n * ```html\n * <div class=\"card\" wrTilt>…</div>\n * <div class=\"card\" wrTilt maxTilt=\"20\" [glare]=\"true\">…</div>\n * ```\n */\n@Directive({\n selector: '[wrTilt]',\n host: { '(pointermove)': 'onMove($event)', '(pointerleave)': 'onLeave()' },\n})\nexport class WrTilt {\n /** Maximum tilt in degrees. @default 12 */\n readonly maxTilt = input(12, { transform: (v: unknown): number => Math.max(0, coerceNumberProperty(v, 12)) });\n\n /** CSS perspective in pixels. @default 800 */\n readonly perspective = input(800, {\n transform: (v: unknown): number => Math.max(100, coerceNumberProperty(v, 800)),\n });\n\n /** Scale applied while hovered. @default 1.03 */\n readonly scale = input(1.03, { transform: (v: unknown): number => Math.max(1, coerceNumberProperty(v, 1.03)) });\n\n /** Add a moving glare highlight overlay. @default false */\n readonly glare = input(false, { transform: coerceBooleanProperty });\n\n private readonly el = inject<ElementRef<HTMLElement>>(ElementRef);\n private readonly zone = inject(NgZone);\n private readonly destroyRef = inject(DestroyRef);\n private readonly platform = inject(WrPlatform);\n private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n\n private glareEl: HTMLElement | null = null;\n private priorOverflow = '';\n private priorPosition = '';\n\n constructor() {\n const host = this.el.nativeElement;\n host.style.transformStyle = 'preserve-3d';\n host.style.transition = 'transform 0.15s ease-out';\n\n // Signal inputs are not bound yet while the constructor runs, so reading\n // `glare()` here would always see the default and the overlay would never\n // appear. Track it instead, so toggling the input at runtime works too.\n // Only in the browser: `installGlare` measures with `getComputedStyle`,\n // and the server has no layout to measure.\n if (this.isBrowser) {\n effect(() => (this.glare() ? this.installGlare() : this.removeGlare()));\n }\n\n this.destroyRef.onDestroy(() => {\n host.style.transform = '';\n this.removeGlare();\n });\n }\n\n /** @internal */\n protected onMove(event: PointerEvent): void {\n // Reduced motion: no pointer-tracking tilt — the card stays flat.\n if (this.platform.prefersReducedMotion()) return;\n this.zone.runOutsideAngular(() => {\n const host = this.el.nativeElement;\n const rect = host.getBoundingClientRect();\n const px = (event.clientX - rect.left) / rect.width;\n const py = (event.clientY - rect.top) / rect.height;\n const rx = (0.5 - py) * this.maxTilt();\n const ry = (px - 0.5) * this.maxTilt();\n host.style.transform = `perspective(${this.perspective()}px) rotateX(${rx}deg) rotateY(${ry}deg) scale(${this.scale()})`;\n if (this.glare()) {\n host.style.setProperty('--wr-tilt-glare-x', `${px * 100}%`);\n host.style.setProperty('--wr-tilt-glare-y', `${py * 100}%`);\n }\n });\n }\n\n /** @internal */\n protected onLeave(): void {\n this.el.nativeElement.style.transform = '';\n }\n\n private installGlare(): void {\n if (this.glareEl) return;\n const host = this.el.nativeElement;\n\n // Remembered, not assumed: `overflow` is written unconditionally, so it can be\n // clobbering an author's own inline value, and a blanket `removeProperty` on the\n // way out would delete it. Capturing the empty string is exactly what restores an\n // element that had none — which is the common case, and the one that used to keep\n // `overflow: hidden` for good after `[glare]` was turned back off.\n this.priorOverflow = host.style.overflow;\n this.priorPosition = host.style.position;\n\n if (getComputedStyle(host).position === 'static') host.style.position = 'relative';\n host.style.overflow = 'hidden';\n const glare = host.ownerDocument.createElement('span');\n glare.className = 'wr-tilt-glare';\n glare.setAttribute('aria-hidden', 'true');\n host.appendChild(glare);\n this.glareEl = glare;\n }\n\n private removeGlare(): void {\n if (!this.glareEl) return;\n\n const host = this.el.nativeElement;\n this.glareEl.remove();\n this.glareEl = null;\n host.style.overflow = this.priorOverflow;\n host.style.position = this.priorPosition;\n // Nothing reads these once the overlay is gone; leaving them behind only makes a\n // destroyed directive look like it is still tracking a pointer.\n host.style.removeProperty('--wr-tilt-glare-x');\n host.style.removeProperty('--wr-tilt-glare-y');\n }\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation } from '@angular/core';\n\nimport { WrTilt } from './tilt';\n\n/**\n * Card wrapper that applies the `[wrTilt]` directive out-of-the-box,\n * plus a small set of card-style defaults (radius, padding, surface).\n * Pass any inputs through — they're forwarded to the hosted directive.\n *\n * For arbitrary elements that just need the tilt behaviour, use the\n * `[wrTilt]` directive directly:\n *\n * ```html\n * <img wrTilt [maxTilt]=\"10\" src=\"…\" />\n * ```\n *\n * @example\n * ```html\n * <wr-tilt-card>\n * <h3>Hello</h3>\n * <p>Move the cursor across me.</p>\n * </wr-tilt-card>\n *\n * <wr-tilt-card [maxTilt]=\"20\" [glare]=\"true\">…</wr-tilt-card>\n * ```\n */\n@Component({\n selector: 'wr-tilt-card',\n template: '<ng-content />',\n styleUrl: './tilt-card.scss',\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [\n {\n directive: WrTilt,\n inputs: ['maxTilt', 'perspective', 'scale', 'glare'],\n },\n ],\n host: { class: 'wr-tilt-card' },\n})\nexport class WrTiltCard {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|