ngwr 12.2.0 → 13.0.1
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 +14 -5
- package/fesm2022/ngwr-border-glow.mjs.map +1 -1
- package/fesm2022/ngwr-breadcrumbs.mjs +15 -4
- 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-context-menu.mjs +6 -2
- package/fesm2022/ngwr-context-menu.mjs.map +1 -1
- package/fesm2022/ngwr-date-picker.mjs +8 -0
- package/fesm2022/ngwr-date-picker.mjs.map +1 -1
- package/fesm2022/ngwr-dialog.mjs +22 -16
- package/fesm2022/ngwr-dialog.mjs.map +1 -1
- package/fesm2022/ngwr-directives.mjs +5 -2
- package/fesm2022/ngwr-directives.mjs.map +1 -1
- package/fesm2022/ngwr-drag-drop.mjs +2 -2
- package/fesm2022/ngwr-drag-drop.mjs.map +1 -1
- package/fesm2022/ngwr-drawer.mjs +24 -18
- package/fesm2022/ngwr-drawer.mjs.map +1 -1
- package/fesm2022/ngwr-dropdown.mjs +6 -2
- package/fesm2022/ngwr-dropdown.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-fuzzy-text.mjs +21 -4
- package/fesm2022/ngwr-fuzzy-text.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 +11 -4
- package/fesm2022/ngwr-gradient-text.mjs.map +1 -1
- package/fesm2022/ngwr-icon-adapters-feather.mjs +11 -0
- package/fesm2022/ngwr-icon-adapters-feather.mjs.map +1 -1
- package/fesm2022/ngwr-icon-adapters-lucide.mjs +22 -2
- package/fesm2022/ngwr-icon-adapters-lucide.mjs.map +1 -1
- package/fesm2022/ngwr-icon.mjs +474 -37
- package/fesm2022/ngwr-icon.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-markdown.mjs +63 -11
- package/fesm2022/ngwr-markdown.mjs.map +1 -1
- package/fesm2022/ngwr-marquee.mjs +2 -2
- package/fesm2022/ngwr-marquee.mjs.map +1 -1
- package/fesm2022/ngwr-overlay.mjs +36 -7
- package/fesm2022/ngwr-overlay.mjs.map +1 -1
- package/fesm2022/ngwr-pagination.mjs +1 -1
- package/fesm2022/ngwr-pagination.mjs.map +1 -1
- package/fesm2022/ngwr-qr.mjs +38 -1
- package/fesm2022/ngwr-qr.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 +12 -5
- 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-tabs.mjs +6 -2
- package/fesm2022/ngwr-tabs.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-utils.mjs +107 -1
- package/fesm2022/ngwr-utils.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 +4 -4
- 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 +3 -3
- 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-breadcrumbs.d.ts +1 -0
- 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-fuzzy-text.d.ts +5 -0
- package/types/ngwr-icon-adapters-feather.d.ts +11 -0
- package/types/ngwr-icon.d.ts +42 -1
- 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-shiny-text.d.ts +1 -0
- 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-utils.d.ts +47 -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
|
@@ -52,7 +52,7 @@ class WrGlitchText {
|
|
|
52
52
|
afterShadow = computed(() => (this.enableShadows() ? '-5px 0 var(--wr-color-danger)' : 'none'), /* @ts-ignore */
|
|
53
53
|
...(ngDevMode ? [{ debugName: "afterShadow" }] : /* istanbul ignore next */ []));
|
|
54
54
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrGlitchText, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
55
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: WrGlitchText, isStandalone: true, selector: "wr-glitch-text", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, speed: { classPropertyName: "speed", publicName: "speed", isSignal: true, isRequired: false, transformFunction: null }, enableShadows: { classPropertyName: "enableShadows", publicName: "enableShadows", isSignal: true, isRequired: false, transformFunction: null }, enableOnHover: { classPropertyName: "enableOnHover", publicName: "enableOnHover", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.wr-glitch-text--hover-only": "enableOnHover()", "style.--wr-glitch-text-before-duration": "(speed() * 2) + 's'", "style.--wr-glitch-text-after-duration": "(speed() * 3) + 's'", "style.--wr-glitch-text-before-shadow": "beforeShadow()", "style.--wr-glitch-text-after-shadow": "afterShadow()", "style.--wr-glitch-text-bg": "background() || null" }, classAttribute: "wr-glitch-text" }, ngImport: i0, template: "<!--\n Two elements on purpose. The torn clones are `::before` / `::after` whose glyphs\n come from `content: attr(data-text)`, and CSS generated content IS exposed to the\n accessibility tree \u2014 so with the pseudos on the host the string was announced\n three times, and a heading or link wrapping this computed its name as\n \"404 404 404\". The clones now hang off their own `aria-hidden` layer instead:\n the same split `wr-blur-text` and `wr-circular-text` use \u2014 one readable copy,\n one decorative layer taken out of the tree with a single `aria-hidden`.\n\n `__clones` comes second and is absolutely positioned, so it contributes nothing\n to layout and still paints over the label, exactly as the host's own pseudos did.\n-->\n<span class=\"wr-glitch-text__label\">{{ text() }}</span>\n<span class=\"wr-glitch-text__clones\" aria-hidden=\"true\" [attr.data-text]=\"text()\"></span>\n", 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-glitch-text{--wr-glitch-text-before-duration: 2s;--wr-glitch-text-after-duration: 3s;--wr-glitch-text-before-shadow: 5px 0 var(--wr-color-info);--wr-glitch-text-after-shadow: -5px 0 var(--wr-color-danger);position:relative;display:inline-block;white-space:nowrap;-webkit-user-select:none;user-select:none;font-weight:900;color:var(--wr-color-on-surface, #0f172a)}.wr-glitch-text__clones{position:absolute;inset:0}.wr-glitch-text__clones:before,.wr-glitch-text__clones:after{content:attr(data-text);position:absolute;top:0;color:inherit;background-color:var(--wr-glitch-text-bg, transparent);overflow:hidden;clip-path:inset(0 0 0 0)}.wr-glitch-text:not(.wr-glitch-text--hover-only) .wr-glitch-text__clones:before{left:-10px;text-shadow:var(--wr-glitch-text-before-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-before-duration) infinite linear alternate-reverse}.wr-glitch-text:not(.wr-glitch-text--hover-only) .wr-glitch-text__clones:after{left:10px;text-shadow:var(--wr-glitch-text-after-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-after-duration) infinite linear alternate-reverse}.wr-glitch-text--hover-only .wr-glitch-text__clones:before,.wr-glitch-text--hover-only .wr-glitch-text__clones:after{content:\"\";opacity:0;animation:none}.wr-glitch-text--hover-only:hover .wr-glitch-text__clones:before{content:attr(data-text);opacity:1;left:-10px;text-shadow:var(--wr-glitch-text-before-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-before-duration) infinite linear alternate-reverse}.wr-glitch-text--hover-only:hover .wr-glitch-text__clones:after{content:attr(data-text);opacity:1;left:10px;text-shadow:var(--wr-glitch-text-after-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-after-duration) infinite linear alternate-reverse}@media(prefers-reduced-motion:reduce){.wr-glitch-text__clones:before,.wr-glitch-text__clones:after{content:\"\"!important;opacity:0!important;animation:none!important}}@keyframes wr-glitch-text-tear{0%{clip-path:inset(20% 0 50% 0)}5%{clip-path:inset(10% 0 60% 0)}10%{clip-path:inset(15% 0 55% 0)}15%{clip-path:inset(25% 0 35% 0)}20%{clip-path:inset(30% 0 40% 0)}25%{clip-path:inset(40% 0 20% 0)}30%{clip-path:inset(10% 0 60% 0)}35%{clip-path:inset(15% 0 55% 0)}40%{clip-path:inset(25% 0 35% 0)}45%{clip-path:inset(30% 0 40% 0)}50%{clip-path:inset(20% 0 50% 0)}55%{clip-path:inset(10% 0 60% 0)}60%{clip-path:inset(15% 0 55% 0)}65%{clip-path:inset(25% 0 35% 0)}70%{clip-path:inset(30% 0 40% 0)}75%{clip-path:inset(40% 0 20% 0)}80%{clip-path:inset(20% 0 50% 0)}85%{clip-path:inset(10% 0 60% 0)}90%{clip-path:inset(15% 0 55% 0)}95%{clip-path:inset(25% 0 35% 0)}to{clip-path:inset(30% 0 40% 0)}}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
55
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: WrGlitchText, isStandalone: true, selector: "wr-glitch-text", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, speed: { classPropertyName: "speed", publicName: "speed", isSignal: true, isRequired: false, transformFunction: null }, enableShadows: { classPropertyName: "enableShadows", publicName: "enableShadows", isSignal: true, isRequired: false, transformFunction: null }, enableOnHover: { classPropertyName: "enableOnHover", publicName: "enableOnHover", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.wr-glitch-text--hover-only": "enableOnHover()", "style.--wr-glitch-text-before-duration": "(speed() * 2) + 's'", "style.--wr-glitch-text-after-duration": "(speed() * 3) + 's'", "style.--wr-glitch-text-before-shadow": "beforeShadow()", "style.--wr-glitch-text-after-shadow": "afterShadow()", "style.--wr-glitch-text-bg": "background() || null" }, classAttribute: "wr-glitch-text" }, ngImport: i0, template: "<!--\n Two elements on purpose. The torn clones are `::before` / `::after` whose glyphs\n come from `content: attr(data-text)`, and CSS generated content IS exposed to the\n accessibility tree \u2014 so with the pseudos on the host the string was announced\n three times, and a heading or link wrapping this computed its name as\n \"404 404 404\". The clones now hang off their own `aria-hidden` layer instead:\n the same split `wr-blur-text` and `wr-circular-text` use \u2014 one readable copy,\n one decorative layer taken out of the tree with a single `aria-hidden`.\n\n `__clones` comes second and is absolutely positioned, so it contributes nothing\n to layout and still paints over the label, exactly as the host's own pseudos did.\n-->\n<span class=\"wr-glitch-text__label\">{{ text() }}</span>\n<span class=\"wr-glitch-text__clones\" aria-hidden=\"true\" [attr.data-text]=\"text()\"></span>\n", styles: [".wr-glitch-text{--wr-glitch-text-before-duration: 2s;--wr-glitch-text-after-duration: 3s;--wr-glitch-text-before-shadow: 5px 0 var(--wr-color-info);--wr-glitch-text-after-shadow: -5px 0 var(--wr-color-danger);position:relative;display:inline-block;white-space:nowrap;-webkit-user-select:none;user-select:none;font-weight:900;color:var(--wr-color-on-surface, #0f172a)}.wr-glitch-text__clones{position:absolute;inset:0}.wr-glitch-text__clones:before,.wr-glitch-text__clones:after{content:attr(data-text);position:absolute;top:0;color:inherit;background-color:var(--wr-glitch-text-bg, transparent);overflow:hidden;clip-path:inset(0 0 0 0)}.wr-glitch-text:not(.wr-glitch-text--hover-only) .wr-glitch-text__clones:before{left:-10px;text-shadow:var(--wr-glitch-text-before-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-before-duration) infinite linear alternate-reverse}.wr-glitch-text:not(.wr-glitch-text--hover-only) .wr-glitch-text__clones:after{left:10px;text-shadow:var(--wr-glitch-text-after-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-after-duration) infinite linear alternate-reverse}.wr-glitch-text--hover-only .wr-glitch-text__clones:before,.wr-glitch-text--hover-only .wr-glitch-text__clones:after{content:\"\";opacity:0;animation:none}.wr-glitch-text--hover-only:hover .wr-glitch-text__clones:before{content:attr(data-text);opacity:1;left:-10px;text-shadow:var(--wr-glitch-text-before-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-before-duration) infinite linear alternate-reverse}.wr-glitch-text--hover-only:hover .wr-glitch-text__clones:after{content:attr(data-text);opacity:1;left:10px;text-shadow:var(--wr-glitch-text-after-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-after-duration) infinite linear alternate-reverse}@media(prefers-reduced-motion:reduce){.wr-glitch-text__clones:before,.wr-glitch-text__clones:after{content:\"\"!important;opacity:0!important;animation:none!important}}@keyframes wr-glitch-text-tear{0%{clip-path:inset(20% 0 50% 0)}5%{clip-path:inset(10% 0 60% 0)}10%{clip-path:inset(15% 0 55% 0)}15%{clip-path:inset(25% 0 35% 0)}20%{clip-path:inset(30% 0 40% 0)}25%{clip-path:inset(40% 0 20% 0)}30%{clip-path:inset(10% 0 60% 0)}35%{clip-path:inset(15% 0 55% 0)}40%{clip-path:inset(25% 0 35% 0)}45%{clip-path:inset(30% 0 40% 0)}50%{clip-path:inset(20% 0 50% 0)}55%{clip-path:inset(10% 0 60% 0)}60%{clip-path:inset(15% 0 55% 0)}65%{clip-path:inset(25% 0 35% 0)}70%{clip-path:inset(30% 0 40% 0)}75%{clip-path:inset(40% 0 20% 0)}80%{clip-path:inset(20% 0 50% 0)}85%{clip-path:inset(10% 0 60% 0)}90%{clip-path:inset(15% 0 55% 0)}95%{clip-path:inset(25% 0 35% 0)}to{clip-path:inset(30% 0 40% 0)}}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
56
56
|
}
|
|
57
57
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrGlitchText, decorators: [{
|
|
58
58
|
type: Component,
|
|
@@ -64,7 +64,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
|
|
|
64
64
|
'[style.--wr-glitch-text-before-shadow]': 'beforeShadow()',
|
|
65
65
|
'[style.--wr-glitch-text-after-shadow]': 'afterShadow()',
|
|
66
66
|
'[style.--wr-glitch-text-bg]': 'background() || null',
|
|
67
|
-
}, template: "<!--\n Two elements on purpose. The torn clones are `::before` / `::after` whose glyphs\n come from `content: attr(data-text)`, and CSS generated content IS exposed to the\n accessibility tree \u2014 so with the pseudos on the host the string was announced\n three times, and a heading or link wrapping this computed its name as\n \"404 404 404\". The clones now hang off their own `aria-hidden` layer instead:\n the same split `wr-blur-text` and `wr-circular-text` use \u2014 one readable copy,\n one decorative layer taken out of the tree with a single `aria-hidden`.\n\n `__clones` comes second and is absolutely positioned, so it contributes nothing\n to layout and still paints over the label, exactly as the host's own pseudos did.\n-->\n<span class=\"wr-glitch-text__label\">{{ text() }}</span>\n<span class=\"wr-glitch-text__clones\" aria-hidden=\"true\" [attr.data-text]=\"text()\"></span>\n", 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-glitch-text{--wr-glitch-text-before-duration: 2s;--wr-glitch-text-after-duration: 3s;--wr-glitch-text-before-shadow: 5px 0 var(--wr-color-info);--wr-glitch-text-after-shadow: -5px 0 var(--wr-color-danger);position:relative;display:inline-block;white-space:nowrap;-webkit-user-select:none;user-select:none;font-weight:900;color:var(--wr-color-on-surface, #0f172a)}.wr-glitch-text__clones{position:absolute;inset:0}.wr-glitch-text__clones:before,.wr-glitch-text__clones:after{content:attr(data-text);position:absolute;top:0;color:inherit;background-color:var(--wr-glitch-text-bg, transparent);overflow:hidden;clip-path:inset(0 0 0 0)}.wr-glitch-text:not(.wr-glitch-text--hover-only) .wr-glitch-text__clones:before{left:-10px;text-shadow:var(--wr-glitch-text-before-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-before-duration) infinite linear alternate-reverse}.wr-glitch-text:not(.wr-glitch-text--hover-only) .wr-glitch-text__clones:after{left:10px;text-shadow:var(--wr-glitch-text-after-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-after-duration) infinite linear alternate-reverse}.wr-glitch-text--hover-only .wr-glitch-text__clones:before,.wr-glitch-text--hover-only .wr-glitch-text__clones:after{content:\"\";opacity:0;animation:none}.wr-glitch-text--hover-only:hover .wr-glitch-text__clones:before{content:attr(data-text);opacity:1;left:-10px;text-shadow:var(--wr-glitch-text-before-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-before-duration) infinite linear alternate-reverse}.wr-glitch-text--hover-only:hover .wr-glitch-text__clones:after{content:attr(data-text);opacity:1;left:10px;text-shadow:var(--wr-glitch-text-after-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-after-duration) infinite linear alternate-reverse}@media(prefers-reduced-motion:reduce){.wr-glitch-text__clones:before,.wr-glitch-text__clones:after{content:\"\"!important;opacity:0!important;animation:none!important}}@keyframes wr-glitch-text-tear{0%{clip-path:inset(20% 0 50% 0)}5%{clip-path:inset(10% 0 60% 0)}10%{clip-path:inset(15% 0 55% 0)}15%{clip-path:inset(25% 0 35% 0)}20%{clip-path:inset(30% 0 40% 0)}25%{clip-path:inset(40% 0 20% 0)}30%{clip-path:inset(10% 0 60% 0)}35%{clip-path:inset(15% 0 55% 0)}40%{clip-path:inset(25% 0 35% 0)}45%{clip-path:inset(30% 0 40% 0)}50%{clip-path:inset(20% 0 50% 0)}55%{clip-path:inset(10% 0 60% 0)}60%{clip-path:inset(15% 0 55% 0)}65%{clip-path:inset(25% 0 35% 0)}70%{clip-path:inset(30% 0 40% 0)}75%{clip-path:inset(40% 0 20% 0)}80%{clip-path:inset(20% 0 50% 0)}85%{clip-path:inset(10% 0 60% 0)}90%{clip-path:inset(15% 0 55% 0)}95%{clip-path:inset(25% 0 35% 0)}to{clip-path:inset(30% 0 40% 0)}}\n"] }]
|
|
67
|
+
}, template: "<!--\n Two elements on purpose. The torn clones are `::before` / `::after` whose glyphs\n come from `content: attr(data-text)`, and CSS generated content IS exposed to the\n accessibility tree \u2014 so with the pseudos on the host the string was announced\n three times, and a heading or link wrapping this computed its name as\n \"404 404 404\". The clones now hang off their own `aria-hidden` layer instead:\n the same split `wr-blur-text` and `wr-circular-text` use \u2014 one readable copy,\n one decorative layer taken out of the tree with a single `aria-hidden`.\n\n `__clones` comes second and is absolutely positioned, so it contributes nothing\n to layout and still paints over the label, exactly as the host's own pseudos did.\n-->\n<span class=\"wr-glitch-text__label\">{{ text() }}</span>\n<span class=\"wr-glitch-text__clones\" aria-hidden=\"true\" [attr.data-text]=\"text()\"></span>\n", styles: [".wr-glitch-text{--wr-glitch-text-before-duration: 2s;--wr-glitch-text-after-duration: 3s;--wr-glitch-text-before-shadow: 5px 0 var(--wr-color-info);--wr-glitch-text-after-shadow: -5px 0 var(--wr-color-danger);position:relative;display:inline-block;white-space:nowrap;-webkit-user-select:none;user-select:none;font-weight:900;color:var(--wr-color-on-surface, #0f172a)}.wr-glitch-text__clones{position:absolute;inset:0}.wr-glitch-text__clones:before,.wr-glitch-text__clones:after{content:attr(data-text);position:absolute;top:0;color:inherit;background-color:var(--wr-glitch-text-bg, transparent);overflow:hidden;clip-path:inset(0 0 0 0)}.wr-glitch-text:not(.wr-glitch-text--hover-only) .wr-glitch-text__clones:before{left:-10px;text-shadow:var(--wr-glitch-text-before-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-before-duration) infinite linear alternate-reverse}.wr-glitch-text:not(.wr-glitch-text--hover-only) .wr-glitch-text__clones:after{left:10px;text-shadow:var(--wr-glitch-text-after-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-after-duration) infinite linear alternate-reverse}.wr-glitch-text--hover-only .wr-glitch-text__clones:before,.wr-glitch-text--hover-only .wr-glitch-text__clones:after{content:\"\";opacity:0;animation:none}.wr-glitch-text--hover-only:hover .wr-glitch-text__clones:before{content:attr(data-text);opacity:1;left:-10px;text-shadow:var(--wr-glitch-text-before-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-before-duration) infinite linear alternate-reverse}.wr-glitch-text--hover-only:hover .wr-glitch-text__clones:after{content:attr(data-text);opacity:1;left:10px;text-shadow:var(--wr-glitch-text-after-shadow);animation:wr-glitch-text-tear var(--wr-glitch-text-after-duration) infinite linear alternate-reverse}@media(prefers-reduced-motion:reduce){.wr-glitch-text__clones:before,.wr-glitch-text__clones:after{content:\"\"!important;opacity:0!important;animation:none!important}}@keyframes wr-glitch-text-tear{0%{clip-path:inset(20% 0 50% 0)}5%{clip-path:inset(10% 0 60% 0)}10%{clip-path:inset(15% 0 55% 0)}15%{clip-path:inset(25% 0 35% 0)}20%{clip-path:inset(30% 0 40% 0)}25%{clip-path:inset(40% 0 20% 0)}30%{clip-path:inset(10% 0 60% 0)}35%{clip-path:inset(15% 0 55% 0)}40%{clip-path:inset(25% 0 35% 0)}45%{clip-path:inset(30% 0 40% 0)}50%{clip-path:inset(20% 0 50% 0)}55%{clip-path:inset(10% 0 60% 0)}60%{clip-path:inset(15% 0 55% 0)}65%{clip-path:inset(25% 0 35% 0)}70%{clip-path:inset(30% 0 40% 0)}75%{clip-path:inset(40% 0 20% 0)}80%{clip-path:inset(20% 0 50% 0)}85%{clip-path:inset(10% 0 60% 0)}90%{clip-path:inset(15% 0 55% 0)}95%{clip-path:inset(25% 0 35% 0)}to{clip-path:inset(30% 0 40% 0)}}\n"] }]
|
|
68
68
|
}], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: true }] }], speed: [{ type: i0.Input, args: [{ isSignal: true, alias: "speed", required: false }] }], enableShadows: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableShadows", required: false }] }], enableOnHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableOnHover", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }] } });
|
|
69
69
|
|
|
70
70
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-glitch-text.mjs","sources":["../../../projects/lib/glitch-text/glitch-text.ts","../../../projects/lib/glitch-text/glitch-text.html","../../../projects/lib/glitch-text/ngwr-glitch-text.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 * Angular adaptation of the GlitchText effect by David Haz / reactbits.dev.\n * Original: https://www.reactbits.dev/text-animations/glitch-text\n *\n * Pure CSS — two `::before` / `::after` clones offset by ±10px with\n * coloured `text-shadow`s, both running a clip-path keyframe to slice\n * random horizontal bands. The clones hang off an `aria-hidden` layer\n * rather than the host, because generated content is announced.\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input } from '@angular/core';\n\nimport { numAttr } from 'ngwr/utils';\n\n/**\n * Glitchy text effect — colour-split horizontal-tear glitch on the\n * provided text. Defaults to playing constantly; toggle `[enableOnHover]`\n * to make it idle until the user hovers.\n *\n * @example\n * ```html\n * <wr-glitch-text text=\"404\" />\n * <wr-glitch-text text=\"ERROR\" [speed]=\"0.5\" [enableOnHover]=\"true\" />\n * ```\n *\n * @see https://www.reactbits.dev/text-animations/glitch-text\n */\n@Component({\n selector: 'wr-glitch-text',\n templateUrl: './glitch-text.html',\n styleUrl: './glitch-text.scss',\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'wr-glitch-text',\n '[class.wr-glitch-text--hover-only]': 'enableOnHover()',\n '[style.--wr-glitch-text-before-duration]': \"(speed() * 2) + 's'\",\n '[style.--wr-glitch-text-after-duration]': \"(speed() * 3) + 's'\",\n '[style.--wr-glitch-text-before-shadow]': 'beforeShadow()',\n '[style.--wr-glitch-text-after-shadow]': 'afterShadow()',\n '[style.--wr-glitch-text-bg]': 'background() || null',\n },\n})\nexport class WrGlitchText {\n /** Text to glitch. Required — the value populates `data-text` for the pseudo clones. */\n readonly text = input.required<string>();\n\n /** Time multiplier — higher = slower glitching. @default 1 */\n readonly speed = input(1, { transform: numAttr(1) });\n\n /** Show the red / cyan colour-split shadows. @default true */\n readonly enableShadows = input(true, { transform: coerceBooleanProperty });\n\n /** Only glitch on hover (idle until then). @default true */\n readonly enableOnHover = input(true, { transform: coerceBooleanProperty });\n\n /**\n * Surface colour for the clone slices. Pass the colour of the surface the\n * component sits on so the slicing illusion masks cleanly; leave unset\n * (transparent) on the page canvas. @default '' (transparent)\n */\n readonly background = input('');\n\n protected readonly beforeShadow = computed(() => (this.enableShadows() ? '5px 0 var(--wr-color-info)' : 'none'));\n protected readonly afterShadow = computed(() => (this.enableShadows() ? '-5px 0 var(--wr-color-danger)' : 'none'));\n}\n","<!--\n Two elements on purpose. The torn clones are `::before` / `::after` whose glyphs\n come from `content: attr(data-text)`, and CSS generated content IS exposed to the\n accessibility tree — so with the pseudos on the host the string was announced\n three times, and a heading or link wrapping this computed its name as\n \"404 404 404\". The clones now hang off their own `aria-hidden` layer instead:\n the same split `wr-blur-text` and `wr-circular-text` use — one readable copy,\n one decorative layer taken out of the tree with a single `aria-hidden`.\n\n `__clones` comes second and is absolutely positioned, so it contributes nothing\n to layout and still paints over the label, exactly as the host's own pseudos did.\n-->\n<span class=\"wr-glitch-text__label\">{{ text() }}</span>\n<span class=\"wr-glitch-text__clones\" aria-hidden=\"true\" [attr.data-text]=\"text()\"></span>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAAA;;;;;;;;;;;;;AAaG;AAOH;;;;;;;;;;;;AAYG;MAgBU,YAAY,CAAA;;IAEd,IAAI,GAAG,KAAK,CAAC,QAAQ;6EAAU;;AAG/B,IAAA,KAAK,GAAG,KAAK,CAAC,CAAC,EAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,OAAA,EAAA,8BAAA,EAAA,CAAA,EAAI,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC,EAAA,CAAG;;IAG3C,aAAa,GAAG,KAAK,CAAC,IAAI,qFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAGjE,aAAa,GAAG,KAAK,CAAC,IAAI,qFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;AAE1E;;;;AAIG;IACM,UAAU,GAAG,KAAK,CAAC,EAAE;mFAAC;AAEZ,IAAA,YAAY,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,aAAa,EAAE,GAAG,4BAA4B,GAAG,MAAM,CAAC;qFAAC;AAC7F,IAAA,WAAW,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,aAAa,EAAE,GAAG,+BAA+B,GAAG,MAAM,CAAC;oFAAC;uGArBvG,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,ooCChDzB,+4BAcA,EAAA,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"ngwr-glitch-text.mjs","sources":["../../../projects/lib/glitch-text/glitch-text.ts","../../../projects/lib/glitch-text/glitch-text.html","../../../projects/lib/glitch-text/ngwr-glitch-text.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 * Angular adaptation of the GlitchText effect by David Haz / reactbits.dev.\n * Original: https://www.reactbits.dev/text-animations/glitch-text\n *\n * Pure CSS — two `::before` / `::after` clones offset by ±10px with\n * coloured `text-shadow`s, both running a clip-path keyframe to slice\n * random horizontal bands. The clones hang off an `aria-hidden` layer\n * rather than the host, because generated content is announced.\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input } from '@angular/core';\n\nimport { numAttr } from 'ngwr/utils';\n\n/**\n * Glitchy text effect — colour-split horizontal-tear glitch on the\n * provided text. Defaults to playing constantly; toggle `[enableOnHover]`\n * to make it idle until the user hovers.\n *\n * @example\n * ```html\n * <wr-glitch-text text=\"404\" />\n * <wr-glitch-text text=\"ERROR\" [speed]=\"0.5\" [enableOnHover]=\"true\" />\n * ```\n *\n * @see https://www.reactbits.dev/text-animations/glitch-text\n */\n@Component({\n selector: 'wr-glitch-text',\n templateUrl: './glitch-text.html',\n styleUrl: './glitch-text.scss',\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'wr-glitch-text',\n '[class.wr-glitch-text--hover-only]': 'enableOnHover()',\n '[style.--wr-glitch-text-before-duration]': \"(speed() * 2) + 's'\",\n '[style.--wr-glitch-text-after-duration]': \"(speed() * 3) + 's'\",\n '[style.--wr-glitch-text-before-shadow]': 'beforeShadow()',\n '[style.--wr-glitch-text-after-shadow]': 'afterShadow()',\n '[style.--wr-glitch-text-bg]': 'background() || null',\n },\n})\nexport class WrGlitchText {\n /** Text to glitch. Required — the value populates `data-text` for the pseudo clones. */\n readonly text = input.required<string>();\n\n /** Time multiplier — higher = slower glitching. @default 1 */\n readonly speed = input(1, { transform: numAttr(1) });\n\n /** Show the red / cyan colour-split shadows. @default true */\n readonly enableShadows = input(true, { transform: coerceBooleanProperty });\n\n /** Only glitch on hover (idle until then). @default true */\n readonly enableOnHover = input(true, { transform: coerceBooleanProperty });\n\n /**\n * Surface colour for the clone slices. Pass the colour of the surface the\n * component sits on so the slicing illusion masks cleanly; leave unset\n * (transparent) on the page canvas. @default '' (transparent)\n */\n readonly background = input('');\n\n protected readonly beforeShadow = computed(() => (this.enableShadows() ? '5px 0 var(--wr-color-info)' : 'none'));\n protected readonly afterShadow = computed(() => (this.enableShadows() ? '-5px 0 var(--wr-color-danger)' : 'none'));\n}\n","<!--\n Two elements on purpose. The torn clones are `::before` / `::after` whose glyphs\n come from `content: attr(data-text)`, and CSS generated content IS exposed to the\n accessibility tree — so with the pseudos on the host the string was announced\n three times, and a heading or link wrapping this computed its name as\n \"404 404 404\". The clones now hang off their own `aria-hidden` layer instead:\n the same split `wr-blur-text` and `wr-circular-text` use — one readable copy,\n one decorative layer taken out of the tree with a single `aria-hidden`.\n\n `__clones` comes second and is absolutely positioned, so it contributes nothing\n to layout and still paints over the label, exactly as the host's own pseudos did.\n-->\n<span class=\"wr-glitch-text__label\">{{ text() }}</span>\n<span class=\"wr-glitch-text__clones\" aria-hidden=\"true\" [attr.data-text]=\"text()\"></span>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAAA;;;;;;;;;;;;;AAaG;AAOH;;;;;;;;;;;;AAYG;MAgBU,YAAY,CAAA;;IAEd,IAAI,GAAG,KAAK,CAAC,QAAQ;6EAAU;;AAG/B,IAAA,KAAK,GAAG,KAAK,CAAC,CAAC,EAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,OAAA,EAAA,8BAAA,EAAA,CAAA,EAAI,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC,EAAA,CAAG;;IAG3C,aAAa,GAAG,KAAK,CAAC,IAAI,qFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAGjE,aAAa,GAAG,KAAK,CAAC,IAAI,qFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;AAE1E;;;;AAIG;IACM,UAAU,GAAG,KAAK,CAAC,EAAE;mFAAC;AAEZ,IAAA,YAAY,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,aAAa,EAAE,GAAG,4BAA4B,GAAG,MAAM,CAAC;qFAAC;AAC7F,IAAA,WAAW,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,aAAa,EAAE,GAAG,+BAA+B,GAAG,MAAM,CAAC;oFAAC;uGArBvG,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,ooCChDzB,+4BAcA,EAAA,MAAA,EAAA,CAAA,unFAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FDkCa,YAAY,EAAA,UAAA,EAAA,CAAA;kBAfxB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,gBAAgB,EAAA,aAAA,EAGX,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,KAAK,EAAE,gBAAgB;AACvB,wBAAA,oCAAoC,EAAE,iBAAiB;AACvD,wBAAA,0CAA0C,EAAE,qBAAqB;AACjE,wBAAA,yCAAyC,EAAE,qBAAqB;AAChE,wBAAA,wCAAwC,EAAE,gBAAgB;AAC1D,wBAAA,uCAAuC,EAAE,eAAe;AACxD,wBAAA,6BAA6B,EAAE,sBAAsB;AACtD,qBAAA,EAAA,QAAA,EAAA,+4BAAA,EAAA,MAAA,EAAA,CAAA,unFAAA,CAAA,EAAA;;;AE9CH;;AAEG;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
3
|
import { input, computed, ViewEncapsulation, Component } from '@angular/core';
|
|
4
|
-
import { numAttr } from 'ngwr/utils';
|
|
4
|
+
import { numAttr, isSafeCssValue } from 'ngwr/utils';
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* @license
|
|
@@ -53,7 +53,14 @@ class WrGradientText {
|
|
|
53
53
|
/** Bounce back-and-forth instead of restarting. @default true */
|
|
54
54
|
yoyo = input(true, { ...(ngDevMode ? { debugName: "yoyo" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
|
|
55
55
|
gradient = computed(() => {
|
|
56
|
-
|
|
56
|
+
// The stops are JOINED into the gradient below and published as
|
|
57
|
+
// `--wr-gradient-text-image`, which the stylesheet substitutes into
|
|
58
|
+
// `background-image`. An entry that closes the library's own paren escapes
|
|
59
|
+
// into a sibling background layer, so one unsafe stop discards the palette
|
|
60
|
+
// rather than being repaired in place — a half-validated gradient is worse
|
|
61
|
+
// to look at than the default one.
|
|
62
|
+
const raw = this.colors();
|
|
63
|
+
const cols = raw.length > 0 && raw.every(color => isSafeCssValue(color)) ? raw : DEFAULT_COLORS;
|
|
57
64
|
// Duplicate the first colour at the end for seamless looping.
|
|
58
65
|
const stops = [...cols, cols[0]].join(', ');
|
|
59
66
|
const angle = this.directionAngle();
|
|
@@ -84,7 +91,7 @@ class WrGradientText {
|
|
|
84
91
|
}
|
|
85
92
|
}
|
|
86
93
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrGradientText, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
87
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrGradientText, isStandalone: true, selector: "wr-gradient-text", inputs: { colors: { classPropertyName: "colors", publicName: "colors", isSignal: true, isRequired: false, transformFunction: null }, animationSpeed: { classPropertyName: "animationSpeed", publicName: "animationSpeed", isSignal: true, isRequired: false, transformFunction: null }, showBorder: { classPropertyName: "showBorder", publicName: "showBorder", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, pauseOnHover: { classPropertyName: "pauseOnHover", publicName: "pauseOnHover", isSignal: true, isRequired: false, transformFunction: null }, yoyo: { classPropertyName: "yoyo", publicName: "yoyo", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.wr-gradient-text--border": "showBorder()", "class.wr-gradient-text--pause-on-hover": "pauseOnHover()", "class.wr-gradient-text--yoyo": "yoyo()", "class.wr-gradient-text--vertical": "direction() === 'vertical'", "class.wr-gradient-text--diagonal": "direction() === 'diagonal'", "style.--wr-gradient-text-image": "gradient()", "style.--wr-gradient-text-size": "size()", "style.--wr-gradient-text-duration": "animationSpeed() + 's'" }, classAttribute: "wr-gradient-text" }, ngImport: i0, template: "@if (showBorder()) {\n <span class=\"wr-gradient-text__border\" aria-hidden=\"true\"></span>\n}\n<span class=\"wr-gradient-text__text\">\n <ng-content />\n</span>\n", 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-gradient-text{--wr-gradient-text-image: linear-gradient(to right, #5227ff, #ff9ffc, #b497cf, #5227ff);--wr-gradient-text-size: 300% 100%;--wr-gradient-text-duration: 8s;position:relative;display:inline-flex;align-items:center;justify-content:center;margin:0;font-weight:500;line-height:1.25;overflow:hidden}.wr-gradient-text--border{padding:.35rem .75rem;border-radius:1.25rem}.wr-gradient-text__text{position:relative;z-index:2;display:inline-block;background-image:var(--wr-gradient-text-image);background-size:var(--wr-gradient-text-size);background-position:0% 50%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wr-gradient-text-horizontal var(--wr-gradient-text-duration) linear infinite}.wr-gradient-text__border{position:absolute;inset:0;border-radius:inherit;background-image:var(--wr-gradient-text-image);background-size:var(--wr-gradient-text-size);background-position:0% 50%;animation:wr-gradient-text-horizontal var(--wr-gradient-text-duration) linear infinite;z-index:0;pointer-events:none}.wr-gradient-text__border:before{content:\"\";position:absolute;inset:1px;border-radius:inherit;background-color:var(--wr-color-surface, #fff);z-index:1}.wr-gradient-text--vertical .wr-gradient-text__text,.wr-gradient-text--vertical .wr-gradient-text__border{background-position:50% 0%;animation-name:wr-gradient-text-vertical}.wr-gradient-text--diagonal .wr-gradient-text__text,.wr-gradient-text--diagonal .wr-gradient-text__border{background-position:0% 50%;animation-name:wr-gradient-text-horizontal}.wr-gradient-text--yoyo .wr-gradient-text__text,.wr-gradient-text--yoyo .wr-gradient-text__border{animation-direction:alternate}.wr-gradient-text--pause-on-hover:hover .wr-gradient-text__text,.wr-gradient-text--pause-on-hover:hover .wr-gradient-text__border{animation-play-state:paused}@keyframes wr-gradient-text-horizontal{0%{background-position:0% 50%}to{background-position:100% 50%}}@keyframes wr-gradient-text-vertical{0%{background-position:50% 0%}to{background-position:50% 100%}}@media(prefers-reduced-motion:reduce){.wr-gradient-text__text,.wr-gradient-text__border{animation:none!important}}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
94
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrGradientText, isStandalone: true, selector: "wr-gradient-text", inputs: { colors: { classPropertyName: "colors", publicName: "colors", isSignal: true, isRequired: false, transformFunction: null }, animationSpeed: { classPropertyName: "animationSpeed", publicName: "animationSpeed", isSignal: true, isRequired: false, transformFunction: null }, showBorder: { classPropertyName: "showBorder", publicName: "showBorder", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, pauseOnHover: { classPropertyName: "pauseOnHover", publicName: "pauseOnHover", isSignal: true, isRequired: false, transformFunction: null }, yoyo: { classPropertyName: "yoyo", publicName: "yoyo", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.wr-gradient-text--border": "showBorder()", "class.wr-gradient-text--pause-on-hover": "pauseOnHover()", "class.wr-gradient-text--yoyo": "yoyo()", "class.wr-gradient-text--vertical": "direction() === 'vertical'", "class.wr-gradient-text--diagonal": "direction() === 'diagonal'", "style.--wr-gradient-text-image": "gradient()", "style.--wr-gradient-text-size": "size()", "style.--wr-gradient-text-duration": "animationSpeed() + 's'" }, classAttribute: "wr-gradient-text" }, ngImport: i0, template: "@if (showBorder()) {\n <span class=\"wr-gradient-text__border\" aria-hidden=\"true\"></span>\n}\n<span class=\"wr-gradient-text__text\">\n <ng-content />\n</span>\n", styles: [".wr-gradient-text{--wr-gradient-text-image: linear-gradient(to right, #5227ff, #ff9ffc, #b497cf, #5227ff);--wr-gradient-text-size: 300% 100%;--wr-gradient-text-duration: 8s;position:relative;display:inline-flex;align-items:center;justify-content:center;margin:0;font-weight:500;line-height:1.25;overflow:hidden}.wr-gradient-text--border{padding:.35rem .75rem;border-radius:1.25rem}.wr-gradient-text__text{position:relative;z-index:2;display:inline-block;background-image:var(--wr-gradient-text-image);background-size:var(--wr-gradient-text-size);background-position:0% 50%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wr-gradient-text-horizontal var(--wr-gradient-text-duration) linear infinite}.wr-gradient-text__border{position:absolute;inset:0;border-radius:inherit;background-image:var(--wr-gradient-text-image);background-size:var(--wr-gradient-text-size);background-position:0% 50%;animation:wr-gradient-text-horizontal var(--wr-gradient-text-duration) linear infinite;z-index:0;pointer-events:none}.wr-gradient-text__border:before{content:\"\";position:absolute;inset:1px;border-radius:inherit;background-color:var(--wr-color-surface, #fff);z-index:1}.wr-gradient-text--vertical .wr-gradient-text__text,.wr-gradient-text--vertical .wr-gradient-text__border{background-position:50% 0%;animation-name:wr-gradient-text-vertical}.wr-gradient-text--diagonal .wr-gradient-text__text,.wr-gradient-text--diagonal .wr-gradient-text__border{background-position:0% 50%;animation-name:wr-gradient-text-horizontal}.wr-gradient-text--yoyo .wr-gradient-text__text,.wr-gradient-text--yoyo .wr-gradient-text__border{animation-direction:alternate}.wr-gradient-text--pause-on-hover:hover .wr-gradient-text__text,.wr-gradient-text--pause-on-hover:hover .wr-gradient-text__border{animation-play-state:paused}@keyframes wr-gradient-text-horizontal{0%{background-position:0% 50%}to{background-position:100% 50%}}@keyframes wr-gradient-text-vertical{0%{background-position:50% 0%}to{background-position:50% 100%}}@media(prefers-reduced-motion:reduce){.wr-gradient-text__text,.wr-gradient-text__border{animation:none!important}}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
88
95
|
}
|
|
89
96
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrGradientText, decorators: [{
|
|
90
97
|
type: Component,
|
|
@@ -98,7 +105,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
|
|
|
98
105
|
'[style.--wr-gradient-text-image]': 'gradient()',
|
|
99
106
|
'[style.--wr-gradient-text-size]': 'size()',
|
|
100
107
|
'[style.--wr-gradient-text-duration]': "animationSpeed() + 's'",
|
|
101
|
-
}, template: "@if (showBorder()) {\n <span class=\"wr-gradient-text__border\" aria-hidden=\"true\"></span>\n}\n<span class=\"wr-gradient-text__text\">\n <ng-content />\n</span>\n", 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-gradient-text{--wr-gradient-text-image: linear-gradient(to right, #5227ff, #ff9ffc, #b497cf, #5227ff);--wr-gradient-text-size: 300% 100%;--wr-gradient-text-duration: 8s;position:relative;display:inline-flex;align-items:center;justify-content:center;margin:0;font-weight:500;line-height:1.25;overflow:hidden}.wr-gradient-text--border{padding:.35rem .75rem;border-radius:1.25rem}.wr-gradient-text__text{position:relative;z-index:2;display:inline-block;background-image:var(--wr-gradient-text-image);background-size:var(--wr-gradient-text-size);background-position:0% 50%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wr-gradient-text-horizontal var(--wr-gradient-text-duration) linear infinite}.wr-gradient-text__border{position:absolute;inset:0;border-radius:inherit;background-image:var(--wr-gradient-text-image);background-size:var(--wr-gradient-text-size);background-position:0% 50%;animation:wr-gradient-text-horizontal var(--wr-gradient-text-duration) linear infinite;z-index:0;pointer-events:none}.wr-gradient-text__border:before{content:\"\";position:absolute;inset:1px;border-radius:inherit;background-color:var(--wr-color-surface, #fff);z-index:1}.wr-gradient-text--vertical .wr-gradient-text__text,.wr-gradient-text--vertical .wr-gradient-text__border{background-position:50% 0%;animation-name:wr-gradient-text-vertical}.wr-gradient-text--diagonal .wr-gradient-text__text,.wr-gradient-text--diagonal .wr-gradient-text__border{background-position:0% 50%;animation-name:wr-gradient-text-horizontal}.wr-gradient-text--yoyo .wr-gradient-text__text,.wr-gradient-text--yoyo .wr-gradient-text__border{animation-direction:alternate}.wr-gradient-text--pause-on-hover:hover .wr-gradient-text__text,.wr-gradient-text--pause-on-hover:hover .wr-gradient-text__border{animation-play-state:paused}@keyframes wr-gradient-text-horizontal{0%{background-position:0% 50%}to{background-position:100% 50%}}@keyframes wr-gradient-text-vertical{0%{background-position:50% 0%}to{background-position:50% 100%}}@media(prefers-reduced-motion:reduce){.wr-gradient-text__text,.wr-gradient-text__border{animation:none!important}}\n"] }]
|
|
108
|
+
}, template: "@if (showBorder()) {\n <span class=\"wr-gradient-text__border\" aria-hidden=\"true\"></span>\n}\n<span class=\"wr-gradient-text__text\">\n <ng-content />\n</span>\n", styles: [".wr-gradient-text{--wr-gradient-text-image: linear-gradient(to right, #5227ff, #ff9ffc, #b497cf, #5227ff);--wr-gradient-text-size: 300% 100%;--wr-gradient-text-duration: 8s;position:relative;display:inline-flex;align-items:center;justify-content:center;margin:0;font-weight:500;line-height:1.25;overflow:hidden}.wr-gradient-text--border{padding:.35rem .75rem;border-radius:1.25rem}.wr-gradient-text__text{position:relative;z-index:2;display:inline-block;background-image:var(--wr-gradient-text-image);background-size:var(--wr-gradient-text-size);background-position:0% 50%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wr-gradient-text-horizontal var(--wr-gradient-text-duration) linear infinite}.wr-gradient-text__border{position:absolute;inset:0;border-radius:inherit;background-image:var(--wr-gradient-text-image);background-size:var(--wr-gradient-text-size);background-position:0% 50%;animation:wr-gradient-text-horizontal var(--wr-gradient-text-duration) linear infinite;z-index:0;pointer-events:none}.wr-gradient-text__border:before{content:\"\";position:absolute;inset:1px;border-radius:inherit;background-color:var(--wr-color-surface, #fff);z-index:1}.wr-gradient-text--vertical .wr-gradient-text__text,.wr-gradient-text--vertical .wr-gradient-text__border{background-position:50% 0%;animation-name:wr-gradient-text-vertical}.wr-gradient-text--diagonal .wr-gradient-text__text,.wr-gradient-text--diagonal .wr-gradient-text__border{background-position:0% 50%;animation-name:wr-gradient-text-horizontal}.wr-gradient-text--yoyo .wr-gradient-text__text,.wr-gradient-text--yoyo .wr-gradient-text__border{animation-direction:alternate}.wr-gradient-text--pause-on-hover:hover .wr-gradient-text__text,.wr-gradient-text--pause-on-hover:hover .wr-gradient-text__border{animation-play-state:paused}@keyframes wr-gradient-text-horizontal{0%{background-position:0% 50%}to{background-position:100% 50%}}@keyframes wr-gradient-text-vertical{0%{background-position:50% 0%}to{background-position:50% 100%}}@media(prefers-reduced-motion:reduce){.wr-gradient-text__text,.wr-gradient-text__border{animation:none!important}}\n"] }]
|
|
102
109
|
}], propDecorators: { colors: [{ type: i0.Input, args: [{ isSignal: true, alias: "colors", required: false }] }], animationSpeed: [{ type: i0.Input, args: [{ isSignal: true, alias: "animationSpeed", required: false }] }], showBorder: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBorder", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], pauseOnHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "pauseOnHover", required: false }] }], yoyo: [{ type: i0.Input, args: [{ isSignal: true, alias: "yoyo", required: false }] }] } });
|
|
103
110
|
|
|
104
111
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-gradient-text.mjs","sources":["../../../projects/lib/gradient-text/gradient-text.ts","../../../projects/lib/gradient-text/gradient-text.html","../../../projects/lib/gradient-text/ngwr-gradient-text.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 * Angular adaptation of the GradientText effect by David Haz / reactbits.dev.\n * Original: https://www.reactbits.dev/text-animations/gradient-text\n *\n * The reactbits version uses `motion/react` to drive `background-position`\n * via rAF. This port is pure CSS — same effect via keyframes on\n * `background-position`, parameterised by inputs.\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input } from '@angular/core';\n\nimport { numAttr } from 'ngwr/utils';\n\nimport type { WrGradientTextDirection } from './interfaces';\n\nconst DEFAULT_COLORS: readonly string[] = ['#5227FF', '#FF9FFC', '#B497CF'];\n\n/**\n * Animated multi-stop gradient text. The gradient slides across the text\n * via `background-clip: text`. Optional `[showBorder]` wraps the text in\n * a dark pill with the same animated gradient as a border ring.\n *\n * @example\n * ```html\n * <wr-gradient-text>Hello, ngwr!</wr-gradient-text>\n * <wr-gradient-text\n * [colors]=\"['#5227FF', '#FF9FFC', '#B497CF']\"\n * direction=\"diagonal\"\n * [animationSpeed]=\"6\"\n * [showBorder]=\"true\"\n * >\n * Premium feature\n * </wr-gradient-text>\n * ```\n *\n * @see https://www.reactbits.dev/text-animations/gradient-text\n */\n@Component({\n selector: 'wr-gradient-text',\n templateUrl: './gradient-text.html',\n styleUrl: './gradient-text.scss',\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'wr-gradient-text',\n '[class.wr-gradient-text--border]': 'showBorder()',\n '[class.wr-gradient-text--pause-on-hover]': 'pauseOnHover()',\n '[class.wr-gradient-text--yoyo]': 'yoyo()',\n '[class.wr-gradient-text--vertical]': \"direction() === 'vertical'\",\n '[class.wr-gradient-text--diagonal]': \"direction() === 'diagonal'\",\n '[style.--wr-gradient-text-image]': 'gradient()',\n '[style.--wr-gradient-text-size]': 'size()',\n '[style.--wr-gradient-text-duration]': \"animationSpeed() + 's'\",\n },\n})\nexport class WrGradientText {\n /** Gradient stops. @default ['#5227FF', '#FF9FFC', '#B497CF'] */\n readonly colors = input<readonly string[]>(DEFAULT_COLORS);\n\n /** Seconds per full sweep (or per half if `[yoyo]` is on). @default 8 */\n readonly animationSpeed = input(8, { transform: numAttr(8) });\n\n /** Wrap the text in a dark pill with the gradient as a border. @default false */\n readonly showBorder = input(false, { transform: coerceBooleanProperty });\n\n /** Gradient slide direction. @default 'horizontal' */\n readonly direction = input<WrGradientTextDirection>('horizontal');\n\n /** Pause the animation while hovered. @default false */\n readonly pauseOnHover = input(false, { transform: coerceBooleanProperty });\n\n /** Bounce back-and-forth instead of restarting. @default true */\n readonly yoyo = input(true, { transform: coerceBooleanProperty });\n\n protected readonly gradient = computed(() => {\n const
|
|
1
|
+
{"version":3,"file":"ngwr-gradient-text.mjs","sources":["../../../projects/lib/gradient-text/gradient-text.ts","../../../projects/lib/gradient-text/gradient-text.html","../../../projects/lib/gradient-text/ngwr-gradient-text.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 * Angular adaptation of the GradientText effect by David Haz / reactbits.dev.\n * Original: https://www.reactbits.dev/text-animations/gradient-text\n *\n * The reactbits version uses `motion/react` to drive `background-position`\n * via rAF. This port is pure CSS — same effect via keyframes on\n * `background-position`, parameterised by inputs.\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input } from '@angular/core';\n\nimport { isSafeCssValue, numAttr } from 'ngwr/utils';\n\nimport type { WrGradientTextDirection } from './interfaces';\n\nconst DEFAULT_COLORS: readonly string[] = ['#5227FF', '#FF9FFC', '#B497CF'];\n\n/**\n * Animated multi-stop gradient text. The gradient slides across the text\n * via `background-clip: text`. Optional `[showBorder]` wraps the text in\n * a dark pill with the same animated gradient as a border ring.\n *\n * @example\n * ```html\n * <wr-gradient-text>Hello, ngwr!</wr-gradient-text>\n * <wr-gradient-text\n * [colors]=\"['#5227FF', '#FF9FFC', '#B497CF']\"\n * direction=\"diagonal\"\n * [animationSpeed]=\"6\"\n * [showBorder]=\"true\"\n * >\n * Premium feature\n * </wr-gradient-text>\n * ```\n *\n * @see https://www.reactbits.dev/text-animations/gradient-text\n */\n@Component({\n selector: 'wr-gradient-text',\n templateUrl: './gradient-text.html',\n styleUrl: './gradient-text.scss',\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'wr-gradient-text',\n '[class.wr-gradient-text--border]': 'showBorder()',\n '[class.wr-gradient-text--pause-on-hover]': 'pauseOnHover()',\n '[class.wr-gradient-text--yoyo]': 'yoyo()',\n '[class.wr-gradient-text--vertical]': \"direction() === 'vertical'\",\n '[class.wr-gradient-text--diagonal]': \"direction() === 'diagonal'\",\n '[style.--wr-gradient-text-image]': 'gradient()',\n '[style.--wr-gradient-text-size]': 'size()',\n '[style.--wr-gradient-text-duration]': \"animationSpeed() + 's'\",\n },\n})\nexport class WrGradientText {\n /** Gradient stops. @default ['#5227FF', '#FF9FFC', '#B497CF'] */\n readonly colors = input<readonly string[]>(DEFAULT_COLORS);\n\n /** Seconds per full sweep (or per half if `[yoyo]` is on). @default 8 */\n readonly animationSpeed = input(8, { transform: numAttr(8) });\n\n /** Wrap the text in a dark pill with the gradient as a border. @default false */\n readonly showBorder = input(false, { transform: coerceBooleanProperty });\n\n /** Gradient slide direction. @default 'horizontal' */\n readonly direction = input<WrGradientTextDirection>('horizontal');\n\n /** Pause the animation while hovered. @default false */\n readonly pauseOnHover = input(false, { transform: coerceBooleanProperty });\n\n /** Bounce back-and-forth instead of restarting. @default true */\n readonly yoyo = input(true, { transform: coerceBooleanProperty });\n\n protected readonly gradient = computed(() => {\n // The stops are JOINED into the gradient below and published as\n // `--wr-gradient-text-image`, which the stylesheet substitutes into\n // `background-image`. An entry that closes the library's own paren escapes\n // into a sibling background layer, so one unsafe stop discards the palette\n // rather than being repaired in place — a half-validated gradient is worse\n // to look at than the default one.\n const raw = this.colors();\n const cols = raw.length > 0 && raw.every(color => isSafeCssValue(color)) ? raw : DEFAULT_COLORS;\n // Duplicate the first colour at the end for seamless looping.\n const stops = [...cols, cols[0]].join(', ');\n const angle = this.directionAngle();\n return `linear-gradient(${angle}, ${stops})`;\n });\n\n protected readonly size = computed(() => {\n switch (this.direction()) {\n case 'vertical':\n return '100% 300%';\n case 'diagonal':\n return '300% 300%';\n case 'horizontal':\n default:\n return '300% 100%';\n }\n });\n\n private directionAngle(): string {\n switch (this.direction()) {\n case 'vertical':\n return 'to bottom';\n case 'diagonal':\n return 'to bottom right';\n case 'horizontal':\n default:\n return 'to right';\n }\n }\n}\n\nexport type { WrGradientTextDirection } from './interfaces';\n","@if (showBorder()) {\n <span class=\"wr-gradient-text__border\" aria-hidden=\"true\"></span>\n}\n<span class=\"wr-gradient-text__text\">\n <ng-content />\n</span>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAAA;;;;;;;;;;;;AAYG;AASH,MAAM,cAAc,GAAsB,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC;AAE3E;;;;;;;;;;;;;;;;;;;AAmBG;MAkBU,cAAc,CAAA;;IAEhB,MAAM,GAAG,KAAK,CAAoB,cAAc;+EAAC;;AAGjD,IAAA,cAAc,GAAG,KAAK,CAAC,CAAC,EAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,8BAAA,EAAA,CAAA,EAAI,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC,EAAA,CAAG;;IAGpD,UAAU,GAAG,KAAK,CAAC,KAAK,kFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAG/D,SAAS,GAAG,KAAK,CAA0B,YAAY;kFAAC;;IAGxD,YAAY,GAAG,KAAK,CAAC,KAAK,oFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAGjE,IAAI,GAAG,KAAK,CAAC,IAAI,4EAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;AAE9C,IAAA,QAAQ,GAAG,QAAQ,CAAC,MAAK;;;;;;;AAO1C,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,EAAE;AACzB,QAAA,MAAM,IAAI,GAAG,GAAG,CAAC,MAAM,GAAG,CAAC,IAAI,GAAG,CAAC,KAAK,CAAC,KAAK,IAAI,cAAc,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,cAAc;;AAE/F,QAAA,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;AAC3C,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE;AACnC,QAAA,OAAO,CAAA,gBAAA,EAAmB,KAAK,CAAA,EAAA,EAAK,KAAK,GAAG;IAC9C,CAAC;iFAAC;AAEiB,IAAA,IAAI,GAAG,QAAQ,CAAC,MAAK;AACtC,QAAA,QAAQ,IAAI,CAAC,SAAS,EAAE;AACtB,YAAA,KAAK,UAAU;AACb,gBAAA,OAAO,WAAW;AACpB,YAAA,KAAK,UAAU;AACb,gBAAA,OAAO,WAAW;AACpB,YAAA,KAAK,YAAY;AACjB,YAAA;AACE,gBAAA,OAAO,WAAW;;IAExB,CAAC;6EAAC;IAEM,cAAc,GAAA;AACpB,QAAA,QAAQ,IAAI,CAAC,SAAS,EAAE;AACtB,YAAA,KAAK,UAAU;AACb,gBAAA,OAAO,WAAW;AACpB,YAAA,KAAK,UAAU;AACb,gBAAA,OAAO,iBAAiB;AAC1B,YAAA,KAAK,YAAY;AACjB,YAAA;AACE,gBAAA,OAAO,UAAU;;IAEvB;uGAxDW,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAd,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,u2CC5D3B,wKAMA,EAAA,MAAA,EAAA,CAAA,mmEAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FDsDa,cAAc,EAAA,UAAA,EAAA,CAAA;kBAjB1B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,EAAA,aAAA,EAGb,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,KAAK,EAAE,kBAAkB;AACzB,wBAAA,kCAAkC,EAAE,cAAc;AAClD,wBAAA,0CAA0C,EAAE,gBAAgB;AAC5D,wBAAA,gCAAgC,EAAE,QAAQ;AAC1C,wBAAA,oCAAoC,EAAE,4BAA4B;AAClE,wBAAA,oCAAoC,EAAE,4BAA4B;AAClE,wBAAA,kCAAkC,EAAE,YAAY;AAChD,wBAAA,iCAAiC,EAAE,QAAQ;AAC3C,wBAAA,qCAAqC,EAAE,wBAAwB;AAChE,qBAAA,EAAA,QAAA,EAAA,wKAAA,EAAA,MAAA,EAAA,CAAA,mmEAAA,CAAA,EAAA;;;AE1DH;;AAEG;;;;"}
|
|
@@ -34,6 +34,17 @@ const SVG_ATTRS = [
|
|
|
34
34
|
*
|
|
35
35
|
* provideWrIcons([feather('plus', featherIcons.plus)]);
|
|
36
36
|
* ```
|
|
37
|
+
*
|
|
38
|
+
* `innerSvg` is **markup**, not text — that is the shape upstream ships and the
|
|
39
|
+
* reason this adapter exists — so it is interpolated into the envelope
|
|
40
|
+
* verbatim. There is no escaping to add here: escaped markup is not markup.
|
|
41
|
+
* A `</svg>` in that input therefore closes the envelope early, and everything
|
|
42
|
+
* after it is a sibling of the icon rather than a child. Nothing executes
|
|
43
|
+
* regardless, because `<wr-icon>` never assigns the result to `innerHTML` — it
|
|
44
|
+
* rebuilds the first `<svg>` root from an allowlist and drops the rest. Feed
|
|
45
|
+
* this a map fetched at runtime and the sanitizer is what stands between it and
|
|
46
|
+
* the app's origin; feed it the `icons.json` from your own node_modules and
|
|
47
|
+
* neither matters.
|
|
37
48
|
*/
|
|
38
49
|
function feather(name, innerSvg) {
|
|
39
50
|
return { name, data: `<svg ${SVG_ATTRS}>${innerSvg}</svg>` };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-icon-adapters-feather.mjs","sources":["../../../projects/lib/icon/adapters/feather/adapter.ts","../../../projects/lib/icon/adapters/feather/public-api.ts","../../../projects/lib/icon/adapters/feather/ngwr-icon-adapters-feather.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 type { WrIconDef } from 'ngwr/icon';\n\n/**\n * Default SVG attributes Feather applies to every icon. Kept identical\n * to what `feather.replace()` emits in the browser so visual parity\n * with upstream is preserved.\n */\nconst SVG_ATTRS = [\n 'xmlns=\"http://www.w3.org/2000/svg\"',\n 'width=\"24\"',\n 'height=\"24\"',\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 'class=\"wr-icon__svg feather\"',\n].join(' ');\n\n/**\n * Wrap a single Feather icon (inner SVG markup) in a {@link WrIconDef}\n * envelope. Pair with the upstream `icons.json` map.\n *\n * @example\n * ```ts\n * import { feather } from 'ngwr/icon/adapters/feather';\n * // feather-icons ships an inner-SVG-only map under dist/icons.json:\n * // { \"plus\": \"<line .../><line .../>\", \"trash\": \"...\", ... }\n * import featherIcons from 'feather-icons/dist/icons.json';\n *\n * provideWrIcons([feather('plus', featherIcons.plus)]);\n * ```\n */\nfunction feather(name: string, innerSvg: string): WrIconDef {\n return { name, data: `<svg ${SVG_ATTRS}>${innerSvg}</svg>` };\n}\n\n/**\n * Bulk variant — pass a `{ alias: innerSvg }` object. Aliases (the\n * keys) become the registry names so you can use shorter or\n * project-specific names.\n *\n * @example\n * ```ts\n * import { featherIcons } from 'ngwr/icon/adapters/feather';\n * import featherSource from 'feather-icons/dist/icons.json';\n *\n * provideWrIcons(featherIcons({\n * plus: featherSource.plus,\n * trash: featherSource.trash,\n * x: featherSource.x,\n * }));\n * ```\n */\nfunction featherIcons(icons: Record<string, string>): WrIconDef[] {\n return Object.entries(icons).map(([name, innerSvg]) => feather(name, innerSvg));\n}\n\nexport { feather, featherIcons };\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\nexport { feather, featherIcons } from './adapter';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"AAAA;;;;;AAKG;AAIH;;;;AAIG;AACH,MAAM,SAAS,GAAG;IAChB,oCAAoC;IACpC,YAAY;IACZ,aAAa;IACb,qBAAqB;IACrB,aAAa;IACb,uBAAuB;IACvB,kBAAkB;IAClB,wBAAwB;IACxB,yBAAyB;IACzB,8BAA8B;AAC/B,CAAA,CAAC,IAAI,CAAC,GAAG,CAAC;AAEX
|
|
1
|
+
{"version":3,"file":"ngwr-icon-adapters-feather.mjs","sources":["../../../projects/lib/icon/adapters/feather/adapter.ts","../../../projects/lib/icon/adapters/feather/public-api.ts","../../../projects/lib/icon/adapters/feather/ngwr-icon-adapters-feather.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 type { WrIconDef } from 'ngwr/icon';\n\n/**\n * Default SVG attributes Feather applies to every icon. Kept identical\n * to what `feather.replace()` emits in the browser so visual parity\n * with upstream is preserved.\n */\nconst SVG_ATTRS = [\n 'xmlns=\"http://www.w3.org/2000/svg\"',\n 'width=\"24\"',\n 'height=\"24\"',\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 'class=\"wr-icon__svg feather\"',\n].join(' ');\n\n/**\n * Wrap a single Feather icon (inner SVG markup) in a {@link WrIconDef}\n * envelope. Pair with the upstream `icons.json` map.\n *\n * @example\n * ```ts\n * import { feather } from 'ngwr/icon/adapters/feather';\n * // feather-icons ships an inner-SVG-only map under dist/icons.json:\n * // { \"plus\": \"<line .../><line .../>\", \"trash\": \"...\", ... }\n * import featherIcons from 'feather-icons/dist/icons.json';\n *\n * provideWrIcons([feather('plus', featherIcons.plus)]);\n * ```\n *\n * `innerSvg` is **markup**, not text — that is the shape upstream ships and the\n * reason this adapter exists — so it is interpolated into the envelope\n * verbatim. There is no escaping to add here: escaped markup is not markup.\n * A `</svg>` in that input therefore closes the envelope early, and everything\n * after it is a sibling of the icon rather than a child. Nothing executes\n * regardless, because `<wr-icon>` never assigns the result to `innerHTML` — it\n * rebuilds the first `<svg>` root from an allowlist and drops the rest. Feed\n * this a map fetched at runtime and the sanitizer is what stands between it and\n * the app's origin; feed it the `icons.json` from your own node_modules and\n * neither matters.\n */\nfunction feather(name: string, innerSvg: string): WrIconDef {\n return { name, data: `<svg ${SVG_ATTRS}>${innerSvg}</svg>` };\n}\n\n/**\n * Bulk variant — pass a `{ alias: innerSvg }` object. Aliases (the\n * keys) become the registry names so you can use shorter or\n * project-specific names.\n *\n * @example\n * ```ts\n * import { featherIcons } from 'ngwr/icon/adapters/feather';\n * import featherSource from 'feather-icons/dist/icons.json';\n *\n * provideWrIcons(featherIcons({\n * plus: featherSource.plus,\n * trash: featherSource.trash,\n * x: featherSource.x,\n * }));\n * ```\n */\nfunction featherIcons(icons: Record<string, string>): WrIconDef[] {\n return Object.entries(icons).map(([name, innerSvg]) => feather(name, innerSvg));\n}\n\nexport { feather, featherIcons };\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\nexport { feather, featherIcons } from './adapter';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"AAAA;;;;;AAKG;AAIH;;;;AAIG;AACH,MAAM,SAAS,GAAG;IAChB,oCAAoC;IACpC,YAAY;IACZ,aAAa;IACb,qBAAqB;IACrB,aAAa;IACb,uBAAuB;IACvB,kBAAkB;IAClB,wBAAwB;IACxB,yBAAyB;IACzB,8BAA8B;AAC/B,CAAA,CAAC,IAAI,CAAC,GAAG,CAAC;AAEX;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;AACH,SAAS,OAAO,CAAC,IAAY,EAAE,QAAgB,EAAA;IAC7C,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAA,KAAA,EAAQ,SAAS,CAAA,CAAA,EAAI,QAAQ,CAAA,MAAA,CAAQ,EAAE;AAC9D;AAEA;;;;;;;;;;;;;;;;AAgBG;AACH,SAAS,YAAY,CAAC,KAA6B,EAAA;IACjD,OAAO,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,QAAQ,CAAC,KAAK,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;AACjF;;AC3EA;;;;;AAKG;;ACLH;;AAEG;;;;"}
|
|
@@ -64,10 +64,30 @@ function lucide(name, children) {
|
|
|
64
64
|
function lucideIcons(icons) {
|
|
65
65
|
return Object.entries(icons).map(([name, node]) => lucide(name, node));
|
|
66
66
|
}
|
|
67
|
+
/**
|
|
68
|
+
* A tag or attribute name that can only ever be a name.
|
|
69
|
+
*
|
|
70
|
+
* `renderChild` builds markup by concatenation, so a name carrying a quote, a
|
|
71
|
+
* space or an `=` does not become a strangely-named attribute — it closes the
|
|
72
|
+
* one being written and opens whatever comes next, which is how
|
|
73
|
+
* `{ 'href': 'x" onerror="…' }`'s sibling, a hostile KEY, injects a handler
|
|
74
|
+
* through an API whose signature says `Record<string, string | number>`.
|
|
75
|
+
* Escaping cannot help a name: `onerror` is a perfectly valid name and the only
|
|
76
|
+
* honest serialisation of it is `onerror="…"`. So names are constrained and
|
|
77
|
+
* values are escaped, and it is {@link sanitizeIcon} at the render sink that
|
|
78
|
+
* refuses `onerror` itself.
|
|
79
|
+
*/
|
|
80
|
+
const NAME_RE = /^[A-Za-z_][\w.:-]*$/;
|
|
81
|
+
/** The four characters that can leave an attribute value or a tag body. */
|
|
82
|
+
function escapeAttribute(value) {
|
|
83
|
+
return String(value).replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"');
|
|
84
|
+
}
|
|
67
85
|
function renderChild([tag, attrs]) {
|
|
86
|
+
if (!NAME_RE.test(tag))
|
|
87
|
+
return '';
|
|
68
88
|
const rendered = Object.entries(attrs)
|
|
69
|
-
.filter((entry) => entry[1] !== undefined)
|
|
70
|
-
.map(([key, value]) => `${key}="${value}"`)
|
|
89
|
+
.filter((entry) => entry[1] !== undefined && NAME_RE.test(entry[0]))
|
|
90
|
+
.map(([key, value]) => `${key}="${escapeAttribute(value)}"`)
|
|
71
91
|
.join(' ');
|
|
72
92
|
return `<${tag} ${rendered}/>`;
|
|
73
93
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-icon-adapters-lucide.mjs","sources":["../../../projects/lib/icon/adapters/lucide/adapter.ts","../../../projects/lib/icon/adapters/lucide/public-api.ts","../../../projects/lib/icon/adapters/lucide/ngwr-icon-adapters-lucide.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 type { WrIconDef } from 'ngwr/icon';\n\n/**\n * Shape of a `lucide` icon export — an array of `[tag, attrs]` tuples\n * representing the inner SVG children. The outer `<svg>` wrapper is\n * added by the adapter when converting to a {@link WrIconDef}.\n */\ntype LucideIconNode = readonly (readonly [string, Record<string, string | number | undefined>])[];\n\n/**\n * Default SVG attributes Lucide applies to every icon. Kept identical\n * to what the `lucide` package's `createElement` would emit so visual\n * parity with upstream is preserved.\n */\nconst SVG_ATTRS = [\n 'xmlns=\"http://www.w3.org/2000/svg\"',\n 'width=\"24\"',\n 'height=\"24\"',\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 'class=\"wr-icon__svg lucide\"',\n].join(' ');\n\n/**\n * Wrap a single Lucide icon in the {@link WrIconDef} envelope. Use this\n * when you need fine-grained control over the registered name, or when\n * the bulk {@link lucideIcons} helper isn't a good fit.\n *\n * @example\n * ```ts\n * import { Plus } from 'lucide';\n * import { lucide } from 'ngwr/icon/adapters/lucide';\n *\n * provideWrIcons([lucide('plus', Plus)]);\n * ```\n */\nfunction lucide(name: string, children: LucideIconNode): WrIconDef {\n const inner = children.map(renderChild).join('');\n return { name, data: `<svg ${SVG_ATTRS}>${inner}</svg>` };\n}\n\n/**\n * Wrap a bag of Lucide icons in one shot. Keys become the registered\n * names **verbatim** — exactly what you pass to `<wr-icon name>` — matching\n * the singular `lucide()` helper and the other adapters. Kebab-case by\n * convention, so quote multi-word keys (`'chevron-down'`). Values are the\n * upstream IconNode tuples.\n *\n * Tree-shaking: every `Plus`, `Trash`, … import lives in *your* file\n * — ngwr ships only this wrapper, not the icon data. Unused icons in\n * `lucide` itself get dropped by the bundler.\n *\n * @example\n * ```ts\n * import { Plus, Trash, ChevronDown } from 'lucide';\n * import { lucideIcons } from 'ngwr/icon/adapters/lucide';\n *\n * bootstrapApplication(AppComponent, {\n * providers: [\n * provideWrIcons(lucideIcons({ plus: Plus, trash: Trash, 'chevron-down': ChevronDown })),\n * ],\n * });\n * ```\n */\nfunction lucideIcons(icons: Record<string, LucideIconNode>): WrIconDef[] {\n return Object.entries(icons).map(([name, node]) => lucide(name, node));\n}\n\nfunction renderChild([tag, attrs]: readonly [string, Record<string, string | number | undefined>]): string {\n const rendered = Object.entries(attrs)\n .filter((entry): entry is [string, string | number] => entry[1] !== undefined)\n .map(([key, value]) => `${key}=\"${value}\"`)\n .join(' ');\n return `<${tag} ${rendered}/>`;\n}\n\nexport { lucide, lucideIcons, type LucideIconNode };\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\nexport { lucide, lucideIcons, type LucideIconNode } from './adapter';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"AAAA;;;;;AAKG;AAWH;;;;AAIG;AACH,MAAM,SAAS,GAAG;IAChB,oCAAoC;IACpC,YAAY;IACZ,aAAa;IACb,qBAAqB;IACrB,aAAa;IACb,uBAAuB;IACvB,kBAAkB;IAClB,wBAAwB;IACxB,yBAAyB;IACzB,6BAA6B;AAC9B,CAAA,CAAC,IAAI,CAAC,GAAG,CAAC;AAEX;;;;;;;;;;;;AAYG;AACH,SAAS,MAAM,CAAC,IAAY,EAAE,QAAwB,EAAA;AACpD,IAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;IAChD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAA,KAAA,EAAQ,SAAS,CAAA,CAAA,EAAI,KAAK,CAAA,MAAA,CAAQ,EAAE;AAC3D;AAEA;;;;;;;;;;;;;;;;;;;;;;AAsBG;AACH,SAAS,WAAW,CAAC,KAAqC,EAAA;IACxD,OAAO,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;AACxE;AAEA,SAAS,WAAW,CAAC,CAAC,GAAG,EAAE,KAAK,CAAiE,EAAA;AAC/F,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK;
|
|
1
|
+
{"version":3,"file":"ngwr-icon-adapters-lucide.mjs","sources":["../../../projects/lib/icon/adapters/lucide/adapter.ts","../../../projects/lib/icon/adapters/lucide/public-api.ts","../../../projects/lib/icon/adapters/lucide/ngwr-icon-adapters-lucide.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 type { WrIconDef } from 'ngwr/icon';\n\n/**\n * Shape of a `lucide` icon export — an array of `[tag, attrs]` tuples\n * representing the inner SVG children. The outer `<svg>` wrapper is\n * added by the adapter when converting to a {@link WrIconDef}.\n */\ntype LucideIconNode = readonly (readonly [string, Record<string, string | number | undefined>])[];\n\n/**\n * Default SVG attributes Lucide applies to every icon. Kept identical\n * to what the `lucide` package's `createElement` would emit so visual\n * parity with upstream is preserved.\n */\nconst SVG_ATTRS = [\n 'xmlns=\"http://www.w3.org/2000/svg\"',\n 'width=\"24\"',\n 'height=\"24\"',\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 'class=\"wr-icon__svg lucide\"',\n].join(' ');\n\n/**\n * Wrap a single Lucide icon in the {@link WrIconDef} envelope. Use this\n * when you need fine-grained control over the registered name, or when\n * the bulk {@link lucideIcons} helper isn't a good fit.\n *\n * @example\n * ```ts\n * import { Plus } from 'lucide';\n * import { lucide } from 'ngwr/icon/adapters/lucide';\n *\n * provideWrIcons([lucide('plus', Plus)]);\n * ```\n */\nfunction lucide(name: string, children: LucideIconNode): WrIconDef {\n const inner = children.map(renderChild).join('');\n return { name, data: `<svg ${SVG_ATTRS}>${inner}</svg>` };\n}\n\n/**\n * Wrap a bag of Lucide icons in one shot. Keys become the registered\n * names **verbatim** — exactly what you pass to `<wr-icon name>` — matching\n * the singular `lucide()` helper and the other adapters. Kebab-case by\n * convention, so quote multi-word keys (`'chevron-down'`). Values are the\n * upstream IconNode tuples.\n *\n * Tree-shaking: every `Plus`, `Trash`, … import lives in *your* file\n * — ngwr ships only this wrapper, not the icon data. Unused icons in\n * `lucide` itself get dropped by the bundler.\n *\n * @example\n * ```ts\n * import { Plus, Trash, ChevronDown } from 'lucide';\n * import { lucideIcons } from 'ngwr/icon/adapters/lucide';\n *\n * bootstrapApplication(AppComponent, {\n * providers: [\n * provideWrIcons(lucideIcons({ plus: Plus, trash: Trash, 'chevron-down': ChevronDown })),\n * ],\n * });\n * ```\n */\nfunction lucideIcons(icons: Record<string, LucideIconNode>): WrIconDef[] {\n return Object.entries(icons).map(([name, node]) => lucide(name, node));\n}\n\n/**\n * A tag or attribute name that can only ever be a name.\n *\n * `renderChild` builds markup by concatenation, so a name carrying a quote, a\n * space or an `=` does not become a strangely-named attribute — it closes the\n * one being written and opens whatever comes next, which is how\n * `{ 'href': 'x\" onerror=\"…' }`'s sibling, a hostile KEY, injects a handler\n * through an API whose signature says `Record<string, string | number>`.\n * Escaping cannot help a name: `onerror` is a perfectly valid name and the only\n * honest serialisation of it is `onerror=\"…\"`. So names are constrained and\n * values are escaped, and it is {@link sanitizeIcon} at the render sink that\n * refuses `onerror` itself.\n */\nconst NAME_RE = /^[A-Za-z_][\\w.:-]*$/;\n\n/** The four characters that can leave an attribute value or a tag body. */\nfunction escapeAttribute(value: string | number): string {\n return String(value).replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/\"/g, '"');\n}\n\nfunction renderChild([tag, attrs]: readonly [string, Record<string, string | number | undefined>]): string {\n if (!NAME_RE.test(tag)) return '';\n\n const rendered = Object.entries(attrs)\n .filter((entry): entry is [string, string | number] => entry[1] !== undefined && NAME_RE.test(entry[0]))\n .map(([key, value]) => `${key}=\"${escapeAttribute(value)}\"`)\n .join(' ');\n return `<${tag} ${rendered}/>`;\n}\n\nexport { lucide, lucideIcons, type LucideIconNode };\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\nexport { lucide, lucideIcons, type LucideIconNode } from './adapter';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"AAAA;;;;;AAKG;AAWH;;;;AAIG;AACH,MAAM,SAAS,GAAG;IAChB,oCAAoC;IACpC,YAAY;IACZ,aAAa;IACb,qBAAqB;IACrB,aAAa;IACb,uBAAuB;IACvB,kBAAkB;IAClB,wBAAwB;IACxB,yBAAyB;IACzB,6BAA6B;AAC9B,CAAA,CAAC,IAAI,CAAC,GAAG,CAAC;AAEX;;;;;;;;;;;;AAYG;AACH,SAAS,MAAM,CAAC,IAAY,EAAE,QAAwB,EAAA;AACpD,IAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;IAChD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAA,KAAA,EAAQ,SAAS,CAAA,CAAA,EAAI,KAAK,CAAA,MAAA,CAAQ,EAAE;AAC3D;AAEA;;;;;;;;;;;;;;;;;;;;;;AAsBG;AACH,SAAS,WAAW,CAAC,KAAqC,EAAA;IACxD,OAAO,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;AACxE;AAEA;;;;;;;;;;;;AAYG;AACH,MAAM,OAAO,GAAG,qBAAqB;AAErC;AACA,SAAS,eAAe,CAAC,KAAsB,EAAA;AAC7C,IAAA,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC;AACjH;AAEA,SAAS,WAAW,CAAC,CAAC,GAAG,EAAE,KAAK,CAAiE,EAAA;AAC/F,IAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AAAE,QAAA,OAAO,EAAE;AAEjC,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK;SAClC,MAAM,CAAC,CAAC,KAAK,KAAyC,KAAK,CAAC,CAAC,CAAC,KAAK,SAAS,IAAI,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AACtG,SAAA,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,KAAK,CAAA,EAAG,GAAG,CAAA,EAAA,EAAK,eAAe,CAAC,KAAK,CAAC,GAAG;SAC1D,IAAI,CAAC,GAAG,CAAC;AACZ,IAAA,OAAO,CAAA,CAAA,EAAI,GAAG,CAAA,CAAA,EAAI,QAAQ,IAAI;AAChC;;AC3GA;;;;;AAKG;;ACLH;;AAEG;;;;"}
|