ngwr 14.3.0 → 14.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/avatar/styles/_index.scss +4 -2
- package/badge/styles/_index.scss +4 -1
- package/badge/styles/_tag.scss +3 -0
- package/cascader/styles/_rules.scss +3 -0
- package/command-palette/styles/_index.scss +23 -0
- package/context-menu/styles/_index.scss +13 -1
- package/fesm2022/ngwr-action-sheet.mjs +3 -3
- package/fesm2022/ngwr-affix.mjs +17 -4
- package/fesm2022/ngwr-affix.mjs.map +1 -1
- package/fesm2022/ngwr-alert.mjs +4 -4
- package/fesm2022/ngwr-alert.mjs.map +1 -1
- package/fesm2022/ngwr-anchor.mjs +3 -3
- package/fesm2022/ngwr-aurora.mjs +3 -3
- package/fesm2022/ngwr-avatar.mjs +3 -3
- package/fesm2022/ngwr-back-top.mjs +3 -3
- package/fesm2022/ngwr-badge.mjs +6 -6
- package/fesm2022/ngwr-bar-chart-testing.mjs +18 -2
- package/fesm2022/ngwr-bar-chart-testing.mjs.map +1 -1
- package/fesm2022/ngwr-bar-chart.mjs +3 -3
- package/fesm2022/ngwr-blur-text.mjs +3 -3
- package/fesm2022/ngwr-border-glow.mjs +3 -3
- package/fesm2022/ngwr-breadcrumbs.mjs +6 -6
- package/fesm2022/ngwr-burger.mjs +3 -3
- package/fesm2022/ngwr-button.mjs +6 -6
- package/fesm2022/ngwr-calendar-heatmap-testing.mjs +12 -9
- package/fesm2022/ngwr-calendar-heatmap-testing.mjs.map +1 -1
- package/fesm2022/ngwr-calendar-heatmap.mjs +35 -7
- package/fesm2022/ngwr-calendar-heatmap.mjs.map +1 -1
- package/fesm2022/ngwr-calendar.mjs +32 -4
- package/fesm2022/ngwr-calendar.mjs.map +1 -1
- package/fesm2022/ngwr-card.mjs +9 -9
- package/fesm2022/ngwr-carousel.mjs +6 -6
- package/fesm2022/ngwr-cascader-testing.mjs +87 -17
- package/fesm2022/ngwr-cascader-testing.mjs.map +1 -1
- package/fesm2022/ngwr-cascader.mjs +63 -4
- package/fesm2022/ngwr-cascader.mjs.map +1 -1
- package/fesm2022/ngwr-checkbox-testing.mjs +13 -2
- package/fesm2022/ngwr-checkbox-testing.mjs.map +1 -1
- package/fesm2022/ngwr-checkbox.mjs +42 -7
- package/fesm2022/ngwr-checkbox.mjs.map +1 -1
- package/fesm2022/ngwr-circular-text.mjs +3 -3
- package/fesm2022/ngwr-click-spark.mjs +3 -3
- package/fesm2022/ngwr-clipboard.mjs +3 -3
- package/fesm2022/ngwr-collapse.mjs +9 -9
- package/fesm2022/ngwr-color-picker.mjs +6 -6
- package/fesm2022/ngwr-command-palette.mjs +16 -3
- package/fesm2022/ngwr-command-palette.mjs.map +1 -1
- package/fesm2022/ngwr-compare.mjs +3 -3
- package/fesm2022/ngwr-confetti.mjs +3 -3
- package/fesm2022/ngwr-context-menu.mjs +12 -12
- package/fesm2022/ngwr-cookie.mjs +3 -3
- package/fesm2022/ngwr-counter.mjs +6 -6
- package/fesm2022/ngwr-date-adapters-fns.mjs +3 -3
- package/fesm2022/ngwr-date-adapters-luxon.mjs +3 -3
- package/fesm2022/ngwr-date-picker.mjs +81 -26
- package/fesm2022/ngwr-date-picker.mjs.map +1 -1
- package/fesm2022/ngwr-date.mjs +3 -3
- package/fesm2022/ngwr-decrypt-text.mjs +3 -3
- package/fesm2022/ngwr-density.mjs +6 -6
- package/fesm2022/ngwr-descriptions.mjs +6 -6
- package/fesm2022/ngwr-dialog.mjs +15 -15
- package/fesm2022/ngwr-directives.mjs +12 -12
- package/fesm2022/ngwr-divider.mjs +3 -3
- package/fesm2022/ngwr-donut-chart-testing.mjs +18 -2
- package/fesm2022/ngwr-donut-chart-testing.mjs.map +1 -1
- package/fesm2022/ngwr-donut-chart.mjs +4 -4
- package/fesm2022/ngwr-donut-chart.mjs.map +1 -1
- package/fesm2022/ngwr-drag-drop.mjs +6 -6
- package/fesm2022/ngwr-drawer.mjs +18 -18
- package/fesm2022/ngwr-dropdown.mjs +32 -14
- package/fesm2022/ngwr-dropdown.mjs.map +1 -1
- package/fesm2022/ngwr-empty.mjs +3 -3
- package/fesm2022/ngwr-event-calendar.mjs +6 -6
- package/fesm2022/ngwr-falling-text.mjs +3 -3
- package/fesm2022/ngwr-file-upload.mjs +18 -5
- package/fesm2022/ngwr-file-upload.mjs.map +1 -1
- package/fesm2022/ngwr-form.mjs +66 -14
- package/fesm2022/ngwr-form.mjs.map +1 -1
- package/fesm2022/ngwr-fuzzy-text.mjs +3 -3
- package/fesm2022/ngwr-gauge-testing.mjs +16 -2
- package/fesm2022/ngwr-gauge-testing.mjs.map +1 -1
- package/fesm2022/ngwr-gauge.mjs +3 -3
- package/fesm2022/ngwr-glitch-text.mjs +3 -3
- package/fesm2022/ngwr-gradient-text.mjs +3 -3
- package/fesm2022/ngwr-hotkey.mjs +6 -6
- package/fesm2022/ngwr-i18n-ar.mjs +2 -0
- package/fesm2022/ngwr-i18n-ar.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-cs.mjs +2 -0
- package/fesm2022/ngwr-i18n-cs.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-de.mjs +2 -0
- package/fesm2022/ngwr-i18n-de.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-en.mjs +14 -2
- package/fesm2022/ngwr-i18n-en.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-es.mjs +2 -0
- package/fesm2022/ngwr-i18n-es.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-fr.mjs +2 -0
- package/fesm2022/ngwr-i18n-fr.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-he.mjs +2 -0
- package/fesm2022/ngwr-i18n-he.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-hi.mjs +2 -0
- package/fesm2022/ngwr-i18n-hi.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-id.mjs +2 -0
- package/fesm2022/ngwr-i18n-id.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-it.mjs +2 -0
- package/fesm2022/ngwr-i18n-it.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-ja.mjs +2 -0
- package/fesm2022/ngwr-i18n-ja.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-ko.mjs +2 -0
- package/fesm2022/ngwr-i18n-ko.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-nl.mjs +2 -0
- package/fesm2022/ngwr-i18n-nl.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-pl.mjs +2 -0
- package/fesm2022/ngwr-i18n-pl.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-pt.mjs +2 -0
- package/fesm2022/ngwr-i18n-pt.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-ru.mjs +2 -0
- package/fesm2022/ngwr-i18n-ru.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-sv.mjs +2 -0
- package/fesm2022/ngwr-i18n-sv.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-tr.mjs +2 -0
- package/fesm2022/ngwr-i18n-tr.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-uk.mjs +2 -0
- package/fesm2022/ngwr-i18n-uk.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-vi.mjs +2 -0
- package/fesm2022/ngwr-i18n-vi.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-zh-TW.mjs +2 -0
- package/fesm2022/ngwr-i18n-zh-TW.mjs.map +1 -1
- package/fesm2022/ngwr-i18n-zh.mjs +2 -0
- package/fesm2022/ngwr-i18n-zh.mjs.map +1 -1
- package/fesm2022/ngwr-i18n.mjs +9 -9
- package/fesm2022/ngwr-icon.mjs +6 -6
- package/fesm2022/ngwr-image-cropper.mjs +3 -3
- package/fesm2022/ngwr-input-number.mjs +15 -6
- package/fesm2022/ngwr-input-number.mjs.map +1 -1
- package/fesm2022/ngwr-input-otp.mjs +38 -6
- package/fesm2022/ngwr-input-otp.mjs.map +1 -1
- package/fesm2022/ngwr-input.mjs +15 -15
- package/fesm2022/ngwr-keyboard.mjs +3 -3
- package/fesm2022/ngwr-knob-testing.mjs +11 -3
- package/fesm2022/ngwr-knob-testing.mjs.map +1 -1
- package/fesm2022/ngwr-knob.mjs +19 -4
- package/fesm2022/ngwr-knob.mjs.map +1 -1
- package/fesm2022/ngwr-layout.mjs +15 -15
- package/fesm2022/ngwr-lightbox.mjs +3 -3
- package/fesm2022/ngwr-line-chart-testing.mjs +18 -2
- package/fesm2022/ngwr-line-chart-testing.mjs.map +1 -1
- package/fesm2022/ngwr-line-chart.mjs +22 -4
- package/fesm2022/ngwr-line-chart.mjs.map +1 -1
- package/fesm2022/ngwr-list.mjs +6 -6
- package/fesm2022/ngwr-loading-bar.mjs +6 -6
- package/fesm2022/ngwr-markdown.mjs +6 -6
- package/fesm2022/ngwr-marquee.mjs +3 -3
- package/fesm2022/ngwr-media.mjs +3 -3
- package/fesm2022/ngwr-mention.mjs +6 -6
- package/fesm2022/ngwr-meta.mjs +6 -6
- package/fesm2022/ngwr-meter-group.mjs +3 -3
- package/fesm2022/ngwr-overlay.mjs +6 -6
- package/fesm2022/ngwr-page-header.mjs +3 -3
- package/fesm2022/ngwr-pagination.mjs +33 -6
- package/fesm2022/ngwr-pagination.mjs.map +1 -1
- package/fesm2022/ngwr-pipes.mjs +21 -21
- package/fesm2022/ngwr-platform.mjs +9 -9
- package/fesm2022/ngwr-popconfirm.mjs +6 -6
- package/fesm2022/ngwr-popover.mjs +29 -11
- package/fesm2022/ngwr-popover.mjs.map +1 -1
- package/fesm2022/ngwr-progress.mjs +3 -3
- package/fesm2022/ngwr-pull-to-refresh.mjs +3 -3
- package/fesm2022/ngwr-qr.mjs +3 -3
- package/fesm2022/ngwr-radio.mjs +6 -6
- package/fesm2022/ngwr-rating-testing.mjs +12 -3
- package/fesm2022/ngwr-rating-testing.mjs.map +1 -1
- package/fesm2022/ngwr-rating.mjs +19 -4
- package/fesm2022/ngwr-rating.mjs.map +1 -1
- package/fesm2022/ngwr-result.mjs +13 -13
- package/fesm2022/ngwr-result.mjs.map +1 -1
- package/fesm2022/ngwr-rotating-text.mjs +3 -3
- package/fesm2022/ngwr-schema-form.mjs +40 -4
- package/fesm2022/ngwr-schema-form.mjs.map +1 -1
- package/fesm2022/ngwr-scroll.mjs +3 -3
- package/fesm2022/ngwr-segmented.mjs +3 -3
- package/fesm2022/ngwr-select.mjs +9 -9
- package/fesm2022/ngwr-shiny-text.mjs +6 -6
- package/fesm2022/ngwr-sidebar.mjs +3 -3
- package/fesm2022/ngwr-skeleton.mjs +3 -3
- package/fesm2022/ngwr-slider.mjs +18 -5
- package/fesm2022/ngwr-slider.mjs.map +1 -1
- package/fesm2022/ngwr-sparkline.mjs +3 -3
- package/fesm2022/ngwr-speed-dial.mjs +3 -3
- package/fesm2022/ngwr-spinner.mjs +3 -3
- package/fesm2022/ngwr-splash-cursor.mjs +3 -3
- package/fesm2022/ngwr-split-text.mjs +3 -3
- package/fesm2022/ngwr-splitter.mjs +3 -3
- package/fesm2022/ngwr-spotlight-card.mjs +6 -6
- package/fesm2022/ngwr-squircle.mjs +28 -9
- package/fesm2022/ngwr-squircle.mjs.map +1 -1
- package/fesm2022/ngwr-star-border.mjs +3 -3
- package/fesm2022/ngwr-statistic.mjs +20 -13
- package/fesm2022/ngwr-statistic.mjs.map +1 -1
- package/fesm2022/ngwr-stepper.mjs +6 -6
- package/fesm2022/ngwr-storage.mjs +3 -3
- package/fesm2022/ngwr-switch.mjs +3 -3
- package/fesm2022/ngwr-table.mjs +18 -18
- package/fesm2022/ngwr-tabs-router.mjs +3 -3
- package/fesm2022/ngwr-tabs.mjs +6 -6
- package/fesm2022/ngwr-textarea.mjs +3 -3
- package/fesm2022/ngwr-theme.mjs +3 -3
- package/fesm2022/ngwr-tilt-card.mjs +6 -6
- package/fesm2022/ngwr-timeline.mjs +6 -6
- package/fesm2022/ngwr-toast.mjs +10 -10
- package/fesm2022/ngwr-toast.mjs.map +1 -1
- package/fesm2022/ngwr-toolbar.mjs +3 -3
- package/fesm2022/ngwr-tour.mjs +6 -6
- package/fesm2022/ngwr-transfer.mjs +88 -11
- package/fesm2022/ngwr-transfer.mjs.map +1 -1
- package/fesm2022/ngwr-tree-testing.mjs +24 -0
- package/fesm2022/ngwr-tree-testing.mjs.map +1 -1
- package/fesm2022/ngwr-tree.mjs +72 -7
- package/fesm2022/ngwr-tree.mjs.map +1 -1
- package/fesm2022/ngwr-typewriter.mjs +3 -3
- package/fesm2022/ngwr-typography.mjs +3 -3
- package/fesm2022/ngwr-version.mjs +1 -1
- package/fesm2022/ngwr-version.mjs.map +1 -1
- package/fesm2022/ngwr-virtual-scroll.mjs +3 -3
- package/fesm2022/ngwr-waves.mjs +3 -3
- package/fesm2022/ngwr-window.mjs +12 -12
- package/form/styles/_index.scss +63 -0
- package/i18n/ar.json +4 -2
- package/i18n/cs.json +4 -2
- package/i18n/de.json +4 -2
- package/i18n/en.json +6 -4
- package/i18n/es.json +4 -2
- package/i18n/fr.json +4 -2
- package/i18n/he.json +4 -2
- package/i18n/hi.json +4 -2
- package/i18n/id.json +4 -2
- package/i18n/it.json +4 -2
- package/i18n/ja.json +4 -2
- package/i18n/ko.json +4 -2
- package/i18n/nl.json +4 -2
- package/i18n/pl.json +4 -2
- package/i18n/pt.json +4 -2
- package/i18n/ru.json +4 -2
- package/i18n/sv.json +4 -2
- package/i18n/tr.json +4 -2
- package/i18n/uk.json +4 -2
- package/i18n/vi.json +4 -2
- package/i18n/zh-TW.json +4 -2
- package/i18n/zh.json +4 -2
- package/input-otp/styles/_index.scss +5 -1
- package/line-chart/styles/_index.scss +5 -3
- package/llms-full.txt +1 -1
- package/markdown/styles/_index.scss +4 -1
- package/mention/styles/_index.scss +22 -1
- package/package.json +1 -1
- package/radio/styles/_index.scss +3 -0
- package/result/styles/_index.scss +12 -0
- package/schematics/migrations/v14/index.js +6 -3
- package/schematics/migrations.json +1 -1
- package/schematics/ng-add/index.js +34 -5
- package/segmented/styles/_index.scss +4 -1
- package/select/styles/_index.scss +20 -1
- package/statistic/styles/_index.scss +4 -0
- package/stepper/styles/_index.scss +36 -0
- package/switch/styles/_index.scss +3 -0
- package/table/styles/_index.scss +12 -0
- package/tabs/styles/_index.scss +4 -1
- package/textarea/styles/_index.scss +6 -1
- package/theme/styles/_colors.scss +11 -0
- package/theme/styles/_contrast.scss +136 -0
- package/theme/styles/_index.scss +1 -0
- package/theme/styles/_mixins.scss +15 -8
- package/timeline/styles/_index.scss +28 -1
- package/toast/styles/_index.scss +11 -0
- package/tree/styles/_index.scss +27 -1
- package/types/ngwr-badge.d.ts +1 -1
- package/types/ngwr-bar-chart-testing.d.ts +11 -1
- package/types/ngwr-button.d.ts +1 -1
- package/types/ngwr-calendar-heatmap-testing.d.ts +10 -5
- package/types/ngwr-calendar-heatmap.d.ts +22 -0
- package/types/ngwr-calendar.d.ts +21 -0
- package/types/ngwr-cascader-testing.d.ts +74 -17
- package/types/ngwr-cascader.d.ts +28 -0
- package/types/ngwr-checkbox-testing.d.ts +12 -1
- package/types/ngwr-checkbox.d.ts +10 -0
- package/types/ngwr-clipboard.d.ts +1 -1
- package/types/ngwr-confetti.d.ts +1 -1
- package/types/ngwr-cookie.d.ts +1 -1
- package/types/ngwr-date-adapters-fns.d.ts +1 -1
- package/types/ngwr-date-adapters-luxon.d.ts +1 -1
- package/types/ngwr-date.d.ts +9 -3
- package/types/ngwr-density.d.ts +1 -1
- package/types/ngwr-dialog.d.ts +1 -1
- package/types/ngwr-donut-chart-testing.d.ts +11 -1
- package/types/ngwr-drawer.d.ts +1 -1
- package/types/ngwr-dropdown.d.ts +16 -0
- package/types/ngwr-file-upload.d.ts +11 -0
- package/types/ngwr-form.d.ts +25 -0
- package/types/ngwr-gauge-testing.d.ts +9 -1
- package/types/ngwr-hotkey.d.ts +1 -1
- package/types/ngwr-i18n.d.ts +1 -1
- package/types/ngwr-input-number.d.ts +12 -2
- package/types/ngwr-input-otp.d.ts +12 -0
- package/types/ngwr-knob-testing.d.ts +11 -3
- package/types/ngwr-knob.d.ts +13 -0
- package/types/ngwr-line-chart-testing.d.ts +11 -1
- package/types/ngwr-line-chart.d.ts +18 -0
- package/types/ngwr-loading-bar.d.ts +1 -1
- package/types/ngwr-markdown.d.ts +1 -1
- package/types/ngwr-media.d.ts +1 -1
- package/types/ngwr-meta.d.ts +1 -1
- package/types/ngwr-overlay.d.ts +2 -2
- package/types/ngwr-pagination.d.ts +16 -0
- package/types/ngwr-platform.d.ts +3 -3
- package/types/ngwr-popover.d.ts +16 -0
- package/types/ngwr-rating-testing.d.ts +12 -3
- package/types/ngwr-rating.d.ts +13 -0
- package/types/ngwr-scroll.d.ts +1 -1
- package/types/ngwr-squircle.d.ts +22 -3
- package/types/ngwr-statistic.d.ts +0 -1
- package/types/ngwr-storage.d.ts +1 -1
- package/types/ngwr-theme.d.ts +1 -1
- package/types/ngwr-toast.d.ts +1 -1
- package/types/ngwr-tour.d.ts +1 -1
- package/types/ngwr-transfer.d.ts +52 -0
- package/types/ngwr-tree-testing.d.ts +20 -0
- package/types/ngwr-tree.d.ts +41 -0
- package/types/ngwr-version.d.ts +1 -1
- package/types/ngwr-window.d.ts +1 -1
- package/typography/styles/_index.scss +26 -4
package/fesm2022/ngwr-date.mjs
CHANGED
|
@@ -847,10 +847,10 @@ class WrNativeDateAdapter extends WrDateAdapter {
|
|
|
847
847
|
return null;
|
|
848
848
|
return out;
|
|
849
849
|
}
|
|
850
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
851
|
-
static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.
|
|
850
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrNativeDateAdapter, deps: [], target: i0.ɵɵFactoryTarget.Service });
|
|
851
|
+
static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: WrNativeDateAdapter });
|
|
852
852
|
}
|
|
853
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
853
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrNativeDateAdapter, decorators: [{
|
|
854
854
|
type: Service
|
|
855
855
|
}] });
|
|
856
856
|
|
|
@@ -398,10 +398,10 @@ class WrDecryptText {
|
|
|
398
398
|
})
|
|
399
399
|
.join('');
|
|
400
400
|
}
|
|
401
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
402
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
401
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDecryptText, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
402
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrDecryptText, isStandalone: true, selector: "wr-decrypt-text", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, speed: { classPropertyName: "speed", publicName: "speed", isSignal: true, isRequired: false, transformFunction: null }, maxIterations: { classPropertyName: "maxIterations", publicName: "maxIterations", isSignal: true, isRequired: false, transformFunction: null }, sequential: { classPropertyName: "sequential", publicName: "sequential", isSignal: true, isRequired: false, transformFunction: null }, revealDirection: { classPropertyName: "revealDirection", publicName: "revealDirection", isSignal: true, isRequired: false, transformFunction: null }, useOriginalCharsOnly: { classPropertyName: "useOriginalCharsOnly", publicName: "useOriginalCharsOnly", isSignal: true, isRequired: false, transformFunction: null }, characters: { classPropertyName: "characters", publicName: "characters", isSignal: true, isRequired: false, transformFunction: null }, animateOn: { classPropertyName: "animateOn", publicName: "animateOn", isSignal: true, isRequired: false, transformFunction: null }, clickMode: { classPropertyName: "clickMode", publicName: "clickMode", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "click": "onClick()" }, classAttribute: "wr-decrypt-text" }, ngImport: i0, template: "<span class=\"wr-decrypt-text__sr-only\">{{ text() }}</span>\n<span aria-hidden=\"true\">\n @for (c of chars(); track $index) {\n <span [class]=\"c.revealed ? 'wr-decrypt-text__char' : 'wr-decrypt-text__char wr-decrypt-text__char--encrypted'\">{{\n c.ch\n }}</span>\n }\n</span>\n", styles: [".wr-decrypt-text{display:inline-block;white-space:pre-wrap}.wr-decrypt-text__sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0}.wr-decrypt-text__char{display:inline}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
403
403
|
}
|
|
404
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
404
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDecryptText, decorators: [{
|
|
405
405
|
type: Component,
|
|
406
406
|
args: [{ selector: 'wr-decrypt-text', encapsulation: ViewEncapsulation.None, host: {
|
|
407
407
|
class: 'wr-decrypt-text',
|
|
@@ -89,10 +89,10 @@ class WrDensity {
|
|
|
89
89
|
return;
|
|
90
90
|
this.storage.set(this.config.storageKey, density);
|
|
91
91
|
}
|
|
92
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
93
|
-
static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.
|
|
92
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDensity, deps: [], target: i0.ɵɵFactoryTarget.Service });
|
|
93
|
+
static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: WrDensity });
|
|
94
94
|
}
|
|
95
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
95
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDensity, decorators: [{
|
|
96
96
|
type: Service
|
|
97
97
|
}], ctorParameters: () => [] });
|
|
98
98
|
|
|
@@ -126,10 +126,10 @@ class WrDensityDirective {
|
|
|
126
126
|
this.host.nativeElement.setAttribute(this.config.attribute, this.wrDensity());
|
|
127
127
|
});
|
|
128
128
|
}
|
|
129
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
130
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.
|
|
129
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDensityDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
130
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: WrDensityDirective, isStandalone: true, selector: "[wrDensity]", inputs: { wrDensity: { classPropertyName: "wrDensity", publicName: "wrDensity", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
|
|
131
131
|
}
|
|
132
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
132
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDensityDirective, decorators: [{
|
|
133
133
|
type: Directive,
|
|
134
134
|
args: [{
|
|
135
135
|
selector: '[wrDensity]',
|
|
@@ -50,10 +50,10 @@ class WrDescriptions {
|
|
|
50
50
|
return parts.join(' ');
|
|
51
51
|
}, /* @ts-ignore */
|
|
52
52
|
...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
|
|
53
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
54
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
53
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDescriptions, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
54
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrDescriptions, isStandalone: true, selector: "wr-descriptions", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, inline: { classPropertyName: "inline", publicName: "inline", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "@if (title()) {\n <div class=\"wr-descriptions__title\">{{ title() }}</div>\n}\n<!--\n A plain <div> with ARIA term/definition roles on the item, not a <dl>:\n the rows are their own component, so the real DOM is\n `<dl><wr-description-item><dt>\u2026` \u2014 which the HTML content model forbids and\n which breaks the term/definition association in AT. `role=\"term\"` /\n `role=\"definition\"` carry the same semantics with no required parent, so they\n survive the component boundary (and `display: contents` on the row).\n-->\n<div class=\"wr-descriptions__list\">\n <ng-content />\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
|
|
55
55
|
}
|
|
56
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
56
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDescriptions, decorators: [{
|
|
57
57
|
type: Component,
|
|
58
58
|
args: [{ selector: 'wr-descriptions', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, template: "@if (title()) {\n <div class=\"wr-descriptions__title\">{{ title() }}</div>\n}\n<!--\n A plain <div> with ARIA term/definition roles on the item, not a <dl>:\n the rows are their own component, so the real DOM is\n `<dl><wr-description-item><dt>\u2026` \u2014 which the HTML content model forbids and\n which breaks the term/definition association in AT. `role=\"term\"` /\n `role=\"definition\"` carry the same semantics with no required parent, so they\n survive the component boundary (and `display: contents` on the row).\n-->\n<div class=\"wr-descriptions__list\">\n <ng-content />\n</div>\n" }]
|
|
59
59
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], inline: [{ type: i0.Input, args: [{ isSignal: true, alias: "inline", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }] } });
|
|
@@ -71,10 +71,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
|
|
|
71
71
|
class WrDescriptionItem {
|
|
72
72
|
label = input('', /* @ts-ignore */
|
|
73
73
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
74
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
75
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.
|
|
74
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDescriptionItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
75
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: WrDescriptionItem, isStandalone: true, selector: "wr-description-item", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-descriptions__row" }, ngImport: i0, template: "<div class=\"wr-descriptions__label\" role=\"term\">{{ label() }}</div><div class=\"wr-descriptions__value\" role=\"definition\"><ng-content /></div>", isInline: true, encapsulation: i0.ViewEncapsulation.None });
|
|
76
76
|
}
|
|
77
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
77
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDescriptionItem, decorators: [{
|
|
78
78
|
type: Component,
|
|
79
79
|
args: [{
|
|
80
80
|
selector: 'wr-description-item',
|
package/fesm2022/ngwr-dialog.mjs
CHANGED
|
@@ -357,10 +357,10 @@ class WrDialog {
|
|
|
357
357
|
const resolved = this.i18n?.t('dialog.close');
|
|
358
358
|
return !resolved || resolved === 'dialog.close' ? 'Close dialog' : resolved;
|
|
359
359
|
}
|
|
360
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
361
|
-
static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.
|
|
360
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialog, deps: [], target: i0.ɵɵFactoryTarget.Service });
|
|
361
|
+
static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: WrDialog });
|
|
362
362
|
}
|
|
363
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
363
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialog, decorators: [{
|
|
364
364
|
type: Service
|
|
365
365
|
}] });
|
|
366
366
|
|
|
@@ -386,10 +386,10 @@ class WrDialogTitle {
|
|
|
386
386
|
id = `wr-dialog-title-${++uid}`;
|
|
387
387
|
/** @internal */
|
|
388
388
|
elementRef = inject((ElementRef));
|
|
389
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
390
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
389
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialogTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
390
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: WrDialogTitle, isStandalone: true, selector: "[wrDialogTitle]", host: { properties: { "attr.id": "id" }, classAttribute: "wr-dialog__title" }, ngImport: i0 });
|
|
391
391
|
}
|
|
392
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
392
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialogTitle, decorators: [{
|
|
393
393
|
type: Directive,
|
|
394
394
|
args: [{
|
|
395
395
|
selector: '[wrDialogTitle]',
|
|
@@ -422,10 +422,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
|
|
|
422
422
|
* ```
|
|
423
423
|
*/
|
|
424
424
|
class WrDialogContent {
|
|
425
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
426
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
425
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialogContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
426
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: WrDialogContent, isStandalone: true, selector: "[wrDialogContent]", host: { classAttribute: "wr-dialog__content" }, hostDirectives: [{ directive: i1.CdkScrollable }], ngImport: i0 });
|
|
427
427
|
}
|
|
428
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
428
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialogContent, decorators: [{
|
|
429
429
|
type: Directive,
|
|
430
430
|
args: [{
|
|
431
431
|
selector: '[wrDialogContent]',
|
|
@@ -461,10 +461,10 @@ class WrDialogFooter {
|
|
|
461
461
|
...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
|
|
462
462
|
classes = computed(() => `wr-dialog__footer wr-dialog__footer--${this.align()}`, /* @ts-ignore */
|
|
463
463
|
...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
|
|
464
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
465
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.
|
|
464
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialogFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
465
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: WrDialogFooter, isStandalone: true, selector: "[wrDialogFooter]", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0 });
|
|
466
466
|
}
|
|
467
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
467
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialogFooter, decorators: [{
|
|
468
468
|
type: Directive,
|
|
469
469
|
args: [{
|
|
470
470
|
selector: '[wrDialogFooter]',
|
|
@@ -502,10 +502,10 @@ class WrDialogClose {
|
|
|
502
502
|
onClick() {
|
|
503
503
|
this.ref?.close(this.result());
|
|
504
504
|
}
|
|
505
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
506
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.
|
|
505
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialogClose, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
506
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: WrDialogClose, isStandalone: true, selector: "[wrDialogClose]", inputs: { result: { classPropertyName: "result", publicName: "wrDialogClose", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
|
|
507
507
|
}
|
|
508
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
508
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDialogClose, decorators: [{
|
|
509
509
|
type: Directive,
|
|
510
510
|
args: [{
|
|
511
511
|
selector: '[wrDialogClose]',
|
|
@@ -35,10 +35,10 @@ class WrAutofocus {
|
|
|
35
35
|
}
|
|
36
36
|
});
|
|
37
37
|
}
|
|
38
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
39
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.
|
|
38
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrAutofocus, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
39
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: WrAutofocus, isStandalone: true, selector: "[wrAutofocus]", inputs: { wrAutofocus: { classPropertyName: "wrAutofocus", publicName: "wrAutofocus", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
|
|
40
40
|
}
|
|
41
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
41
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrAutofocus, decorators: [{
|
|
42
42
|
type: Directive,
|
|
43
43
|
args: [{ selector: '[wrAutofocus]' }]
|
|
44
44
|
}], ctorParameters: () => [], propDecorators: { wrAutofocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrAutofocus", required: false }] }] } });
|
|
@@ -109,10 +109,10 @@ class WrAutosize {
|
|
|
109
109
|
node.style.height = `${next}px`;
|
|
110
110
|
node.style.overflowY = node.scrollHeight + border > max ? 'auto' : 'hidden';
|
|
111
111
|
}
|
|
112
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
113
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.
|
|
112
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrAutosize, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
113
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: WrAutosize, isStandalone: true, selector: "textarea[wrAutosize]", inputs: { minRows: { classPropertyName: "minRows", publicName: "minRows", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "input": "onInput()" }, properties: { "style.overflow": "'hidden'", "style.resize": "'none'" } }, ngImport: i0 });
|
|
114
114
|
}
|
|
115
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
115
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrAutosize, decorators: [{
|
|
116
116
|
type: Directive,
|
|
117
117
|
args: [{
|
|
118
118
|
selector: 'textarea[wrAutosize]',
|
|
@@ -160,10 +160,10 @@ class WrClickOutside {
|
|
|
160
160
|
});
|
|
161
161
|
});
|
|
162
162
|
}
|
|
163
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
164
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
163
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrClickOutside, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
164
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: WrClickOutside, isStandalone: true, selector: "[wrClickOutside]", outputs: { wrClickOutside: "wrClickOutside" }, ngImport: i0 });
|
|
165
165
|
}
|
|
166
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
166
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrClickOutside, decorators: [{
|
|
167
167
|
type: Directive,
|
|
168
168
|
args: [{ selector: '[wrClickOutside]' }]
|
|
169
169
|
}], ctorParameters: () => [], propDecorators: { wrClickOutside: [{ type: i0.Output, args: ["wrClickOutside"] }] } });
|
|
@@ -260,10 +260,10 @@ class WrCopyToClipboard {
|
|
|
260
260
|
previous.focus();
|
|
261
261
|
}
|
|
262
262
|
}
|
|
263
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
264
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.
|
|
263
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCopyToClipboard, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
264
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: WrCopyToClipboard, isStandalone: true, selector: "[wrCopyToClipboard]", inputs: { wrCopyToClipboard: { classPropertyName: "wrCopyToClipboard", publicName: "wrCopyToClipboard", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { copied: "copied", copyFailed: "copyFailed" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
|
|
265
265
|
}
|
|
266
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
266
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCopyToClipboard, decorators: [{
|
|
267
267
|
type: Directive,
|
|
268
268
|
args: [{ selector: '[wrCopyToClipboard]', host: { '(click)': 'onClick()' } }]
|
|
269
269
|
}], propDecorators: { wrCopyToClipboard: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrCopyToClipboard", required: true }] }], copied: [{ type: i0.Output, args: ["copied"] }], copyFailed: [{ type: i0.Output, args: ["copyFailed"] }] } });
|
|
@@ -110,10 +110,10 @@ class WrDivider {
|
|
|
110
110
|
else
|
|
111
111
|
el.removeAttribute('aria-label');
|
|
112
112
|
}
|
|
113
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
114
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.
|
|
113
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
114
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: WrDivider, isStandalone: true, selector: "wr-divider", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "separator" }, properties: { "class": "classes()", "style.--wr-divider-width.px": "width()" } }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
|
|
115
115
|
}
|
|
116
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
116
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDivider, decorators: [{
|
|
117
117
|
type: Component,
|
|
118
118
|
args: [{
|
|
119
119
|
selector: 'wr-divider',
|
|
@@ -83,9 +83,25 @@ class WrDonutChartHarness extends ComponentHarness {
|
|
|
83
83
|
const center = await this.locatorForOptional('.wr-donut-chart__center-label')();
|
|
84
84
|
return center ? center.text() : null;
|
|
85
85
|
}
|
|
86
|
-
/**
|
|
86
|
+
/**
|
|
87
|
+
* The chart's outer size in pixels, read off the `style` ATTRIBUTE.
|
|
88
|
+
*
|
|
89
|
+
* NOT `getCssValue()`, which is `getComputedStyle()` — the same rule this
|
|
90
|
+
* file's class note already states and this method alone broke. A computed
|
|
91
|
+
* read answers from the LAID-OUT box, so it agrees with the inline value in
|
|
92
|
+
* jsdom (which lays nothing out and echoes the declaration) and disagrees in a
|
|
93
|
+
* browser, where sub-pixel rounding turns a declared 240 into 239.5. A harness
|
|
94
|
+
* that answers differently in the two places it runs is worse than one that
|
|
95
|
+
* refuses.
|
|
96
|
+
*/
|
|
87
97
|
async getSize() {
|
|
88
|
-
|
|
98
|
+
const style = await (await this.locatorFor('.wr-donut-chart__surface')()).getAttribute('style');
|
|
99
|
+
const match = /width:\s*([\d.]+)px/.exec(style ?? '');
|
|
100
|
+
if (!match) {
|
|
101
|
+
throw new Error(`WrDonutChartHarness.getSize(): no inline width on .wr-donut-chart__surface (style: "${style ?? ''}"). ` +
|
|
102
|
+
'The component writes one unconditionally, so its absence is the bug rather than a zero.');
|
|
103
|
+
}
|
|
104
|
+
return Number.parseFloat(match[1]);
|
|
89
105
|
}
|
|
90
106
|
}
|
|
91
107
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-donut-chart-testing.mjs","sources":["../../../projects/lib/donut-chart/testing/wr-donut-chart-harness.ts","../../../projects/lib/donut-chart/testing/ngwr-donut-chart-testing.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 { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';\n\nimport type { WrDonutChartHarnessFilters, WrDonutChartLegendEntry } from './interfaces';\n\n/**\n * Test harness for `<wr-donut-chart>`.\n *\n * **The ring itself is unreadable, and that is by design.** The slices are SVG\n * paths inside a `role=\"img\"` drawing: a screen reader is given that drawing's\n * `aria-label` and nothing else, and a spec cannot get a label or a value off a\n * path's `d`. {@link getLegend} is where the numbers are — which is also the\n * argument for keeping `showLegend` on, since with it off the only other text is\n * whatever {@link getCenterValue} and {@link getCenterLabel} were given.\n *\n * The name is read off the `<svg>` rather than off the surface that wraps it, and\n * the two are not interchangeable: `img` makes its whole subtree presentational, so\n * a name on the wrapper would take the centre text down with it.\n *\n * {@link getSliceCount} is therefore the one thing the ring answers: how many\n * wedges were drawn. Compare it with the legend's length to catch a slice that was\n * filtered out of one and not the other.\n *\n * @example\n * ```ts\n * const chart = await loader.getHarness(WrDonutChartHarness);\n *\n * expect(await chart.getSliceCount()).toBe(3);\n * expect(await chart.getLegend()).toEqual([\n * { label: 'Direct', value: '48' },\n * { label: 'Search', value: '32' },\n * { label: 'Social', value: '20' },\n * ]);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrDonutChartHarness extends ComponentHarness {\n static hostSelector = 'wr-donut-chart';\n\n /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n static with(options: WrDonutChartHarnessFilters = {}): HarnessPredicate<WrDonutChartHarness> {\n return new HarnessPredicate(WrDonutChartHarness, options)\n .addOption('ariaLabel', options.ariaLabel, (harness, label) =>\n HarnessPredicate.stringMatches(harness.getAccessibleName(), label)\n )\n .addOption('sliceLabel', options.sliceLabel, async (harness, label) => {\n for (const entry of await harness.getLegend()) {\n if (await HarnessPredicate.stringMatches(entry.label, label)) return true;\n }\n return false;\n });\n }\n\n /** The name the ring announces — the whole chart's, since the slices announce nothing. */\n async getAccessibleName(): Promise<string | null> {\n return (await this.locatorFor('.wr-donut-chart__surface svg')()).getAttribute('aria-label');\n }\n\n /** How many wedges were drawn. */\n async getSliceCount(): Promise<number> {\n return (await this.locatorForAll('.wr-donut-chart__surface path')()).length;\n }\n\n /** Whether the legend is rendered (`showLegend`, and at least one slice). */\n async hasLegend(): Promise<boolean> {\n return (await this.locatorForOptional('.wr-donut-chart__legend')()) !== null;\n }\n\n /** The legend rows in order — the only textual form the data has. */\n async getLegend(): Promise<WrDonutChartLegendEntry[]> {\n const labels = await this.locatorForAll('.wr-donut-chart__legend-label')();\n const values = await this.locatorForAll('.wr-donut-chart__legend-value')();\n\n return Promise.all(\n labels.map(async (label, index) => ({\n label: await label.text(),\n value: (await values[index]?.text()) ?? '',\n }))\n );\n }\n\n /** The big number in the middle, or `null` when the chart has none. */\n async getCenterValue(): Promise<string | null> {\n const center = await this.locatorForOptional('.wr-donut-chart__center-value')();\n return center ? center.text() : null;\n }\n\n /** The caption under the centre value, or `null`. */\n async getCenterLabel(): Promise<string | null> {\n const center = await this.locatorForOptional('.wr-donut-chart__center-label')();\n return center ? center.text() : null;\n }\n\n
|
|
1
|
+
{"version":3,"file":"ngwr-donut-chart-testing.mjs","sources":["../../../projects/lib/donut-chart/testing/wr-donut-chart-harness.ts","../../../projects/lib/donut-chart/testing/ngwr-donut-chart-testing.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 { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';\n\nimport type { WrDonutChartHarnessFilters, WrDonutChartLegendEntry } from './interfaces';\n\n/**\n * Test harness for `<wr-donut-chart>`.\n *\n * **The ring itself is unreadable, and that is by design.** The slices are SVG\n * paths inside a `role=\"img\"` drawing: a screen reader is given that drawing's\n * `aria-label` and nothing else, and a spec cannot get a label or a value off a\n * path's `d`. {@link getLegend} is where the numbers are — which is also the\n * argument for keeping `showLegend` on, since with it off the only other text is\n * whatever {@link getCenterValue} and {@link getCenterLabel} were given.\n *\n * The name is read off the `<svg>` rather than off the surface that wraps it, and\n * the two are not interchangeable: `img` makes its whole subtree presentational, so\n * a name on the wrapper would take the centre text down with it.\n *\n * {@link getSliceCount} is therefore the one thing the ring answers: how many\n * wedges were drawn. Compare it with the legend's length to catch a slice that was\n * filtered out of one and not the other.\n *\n * @example\n * ```ts\n * const chart = await loader.getHarness(WrDonutChartHarness);\n *\n * expect(await chart.getSliceCount()).toBe(3);\n * expect(await chart.getLegend()).toEqual([\n * { label: 'Direct', value: '48' },\n * { label: 'Search', value: '32' },\n * { label: 'Social', value: '20' },\n * ]);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrDonutChartHarness extends ComponentHarness {\n static hostSelector = 'wr-donut-chart';\n\n /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n static with(options: WrDonutChartHarnessFilters = {}): HarnessPredicate<WrDonutChartHarness> {\n return new HarnessPredicate(WrDonutChartHarness, options)\n .addOption('ariaLabel', options.ariaLabel, (harness, label) =>\n HarnessPredicate.stringMatches(harness.getAccessibleName(), label)\n )\n .addOption('sliceLabel', options.sliceLabel, async (harness, label) => {\n for (const entry of await harness.getLegend()) {\n if (await HarnessPredicate.stringMatches(entry.label, label)) return true;\n }\n return false;\n });\n }\n\n /** The name the ring announces — the whole chart's, since the slices announce nothing. */\n async getAccessibleName(): Promise<string | null> {\n return (await this.locatorFor('.wr-donut-chart__surface svg')()).getAttribute('aria-label');\n }\n\n /** How many wedges were drawn. */\n async getSliceCount(): Promise<number> {\n return (await this.locatorForAll('.wr-donut-chart__surface path')()).length;\n }\n\n /** Whether the legend is rendered (`showLegend`, and at least one slice). */\n async hasLegend(): Promise<boolean> {\n return (await this.locatorForOptional('.wr-donut-chart__legend')()) !== null;\n }\n\n /** The legend rows in order — the only textual form the data has. */\n async getLegend(): Promise<WrDonutChartLegendEntry[]> {\n const labels = await this.locatorForAll('.wr-donut-chart__legend-label')();\n const values = await this.locatorForAll('.wr-donut-chart__legend-value')();\n\n return Promise.all(\n labels.map(async (label, index) => ({\n label: await label.text(),\n value: (await values[index]?.text()) ?? '',\n }))\n );\n }\n\n /** The big number in the middle, or `null` when the chart has none. */\n async getCenterValue(): Promise<string | null> {\n const center = await this.locatorForOptional('.wr-donut-chart__center-value')();\n return center ? center.text() : null;\n }\n\n /** The caption under the centre value, or `null`. */\n async getCenterLabel(): Promise<string | null> {\n const center = await this.locatorForOptional('.wr-donut-chart__center-label')();\n return center ? center.text() : null;\n }\n\n /**\n * The chart's outer size in pixels, read off the `style` ATTRIBUTE.\n *\n * NOT `getCssValue()`, which is `getComputedStyle()` — the same rule this\n * file's class note already states and this method alone broke. A computed\n * read answers from the LAID-OUT box, so it agrees with the inline value in\n * jsdom (which lays nothing out and echoes the declaration) and disagrees in a\n * browser, where sub-pixel rounding turns a declared 240 into 239.5. A harness\n * that answers differently in the two places it runs is worse than one that\n * refuses.\n */\n async getSize(): Promise<number> {\n const style = await (await this.locatorFor('.wr-donut-chart__surface')()).getAttribute('style');\n const match = /width:\\s*([\\d.]+)px/.exec(style ?? '');\n if (!match) {\n throw new Error(\n `WrDonutChartHarness.getSize(): no inline width on .wr-donut-chart__surface (style: \"${style ?? ''}\"). ` +\n 'The component writes one unconditionally, so its absence is the bug rather than a zero.'\n );\n }\n return Number.parseFloat(match[1]);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -138,12 +138,12 @@ class WrDonutChart {
|
|
|
138
138
|
'Z',
|
|
139
139
|
].join(' ');
|
|
140
140
|
}
|
|
141
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
142
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
141
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDonutChart, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
142
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrDonutChart, isStandalone: true, selector: "wr-donut-chart", inputs: { segments: { classPropertyName: "segments", publicName: "segments", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, thickness: { classPropertyName: "thickness", publicName: "thickness", isSignal: true, isRequired: false, transformFunction: null }, showLegend: { classPropertyName: "showLegend", publicName: "showLegend", isSignal: true, isRequired: false, transformFunction: null }, centerValue: { classPropertyName: "centerValue", publicName: "centerValue", isSignal: true, isRequired: false, transformFunction: null }, centerLabel: { classPropertyName: "centerLabel", publicName: "centerLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-donut-chart" }, ngImport: i0, template: "<div class=\"wr-donut-chart__surface\" [style.width.px]=\"size()\">\n <!-- The name sits on the DRAWING, not on this wrapper. `img` is a\n children-presentational role, so with it out here WebKit dropped the whole\n subtree \u2014 including the centre value and label, which are real text and are\n the headline datum the legend does not carry. -->\n <svg viewBox=\"0 0 100 100\" role=\"img\" [attr.aria-label]=\"resolvedAriaLabel()\">\n <!-- Every slice is stroked in the SURFACE colour, so adjacent arcs are\n separated by a visible gap rather than by the boundary between two\n fills. Without it the only thing dividing two slices is the colour\n change itself, and the default palette's entries sit within about\n 1.06:1 of each other in relative luminance \u2014 for a reader who cannot\n separate hue, two neighbours merge into one arc and the chart reads as\n having fewer slices than it has. A gap is a shape, and it survives\n greyscale, printing and a monochrome display. -->\n @for (slice of slices(); track $index) {\n <path\n [attr.d]=\"slice.path\"\n [attr.fill]=\"slice.color\"\n stroke=\"var(--wr-color-surface)\"\n stroke-width=\"1\"\n stroke-linejoin=\"round\"\n />\n }\n </svg>\n @if (centerValue() || centerLabel()) {\n <div class=\"wr-donut-chart__center\">\n @if (centerValue()) {\n <div class=\"wr-donut-chart__center-value\">{{ centerValue() }}</div>\n }\n @if (centerLabel()) {\n <div class=\"wr-donut-chart__center-label\">{{ centerLabel() }}</div>\n }\n </div>\n }\n</div>\n\n@if (showLegend() && slices().length > 0) {\n <ul class=\"wr-donut-chart__legend\">\n @for (slice of slices(); track $index) {\n <li class=\"wr-donut-chart__legend-item\">\n <span class=\"wr-donut-chart__swatch\" [style.background]=\"slice.color\"></span>\n <span class=\"wr-donut-chart__legend-label\">{{ slice.label }}</span>\n <span class=\"wr-donut-chart__legend-value\">{{ slice.value }}</span>\n </li>\n }\n </ul>\n}\n", encapsulation: i0.ViewEncapsulation.None });
|
|
143
143
|
}
|
|
144
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
144
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDonutChart, decorators: [{
|
|
145
145
|
type: Component,
|
|
146
|
-
args: [{ selector: 'wr-donut-chart', encapsulation: ViewEncapsulation.None, host: { class: 'wr-donut-chart' }, template: "<div class=\"wr-donut-chart__surface\" [style.width.px]=\"size()\">\n <!-- The name sits on the DRAWING, not on this wrapper. `img` is a\n children-presentational role, so with it out here WebKit dropped the whole\n subtree \u2014 including the centre value and label, which are real text and are\n the headline datum the legend does not carry. -->\n <svg viewBox=\"0 0 100 100\" role=\"img\" [attr.aria-label]=\"resolvedAriaLabel()\">\n @for (slice of slices(); track $index) {\n <path
|
|
146
|
+
args: [{ selector: 'wr-donut-chart', encapsulation: ViewEncapsulation.None, host: { class: 'wr-donut-chart' }, template: "<div class=\"wr-donut-chart__surface\" [style.width.px]=\"size()\">\n <!-- The name sits on the DRAWING, not on this wrapper. `img` is a\n children-presentational role, so with it out here WebKit dropped the whole\n subtree \u2014 including the centre value and label, which are real text and are\n the headline datum the legend does not carry. -->\n <svg viewBox=\"0 0 100 100\" role=\"img\" [attr.aria-label]=\"resolvedAriaLabel()\">\n <!-- Every slice is stroked in the SURFACE colour, so adjacent arcs are\n separated by a visible gap rather than by the boundary between two\n fills. Without it the only thing dividing two slices is the colour\n change itself, and the default palette's entries sit within about\n 1.06:1 of each other in relative luminance \u2014 for a reader who cannot\n separate hue, two neighbours merge into one arc and the chart reads as\n having fewer slices than it has. A gap is a shape, and it survives\n greyscale, printing and a monochrome display. -->\n @for (slice of slices(); track $index) {\n <path\n [attr.d]=\"slice.path\"\n [attr.fill]=\"slice.color\"\n stroke=\"var(--wr-color-surface)\"\n stroke-width=\"1\"\n stroke-linejoin=\"round\"\n />\n }\n </svg>\n @if (centerValue() || centerLabel()) {\n <div class=\"wr-donut-chart__center\">\n @if (centerValue()) {\n <div class=\"wr-donut-chart__center-value\">{{ centerValue() }}</div>\n }\n @if (centerLabel()) {\n <div class=\"wr-donut-chart__center-label\">{{ centerLabel() }}</div>\n }\n </div>\n }\n</div>\n\n@if (showLegend() && slices().length > 0) {\n <ul class=\"wr-donut-chart__legend\">\n @for (slice of slices(); track $index) {\n <li class=\"wr-donut-chart__legend-item\">\n <span class=\"wr-donut-chart__swatch\" [style.background]=\"slice.color\"></span>\n <span class=\"wr-donut-chart__legend-label\">{{ slice.label }}</span>\n <span class=\"wr-donut-chart__legend-value\">{{ slice.value }}</span>\n </li>\n }\n </ul>\n}\n" }]
|
|
147
147
|
}], propDecorators: { segments: [{ type: i0.Input, args: [{ isSignal: true, alias: "segments", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], thickness: [{ type: i0.Input, args: [{ isSignal: true, alias: "thickness", required: false }] }], showLegend: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLegend", required: false }] }], centerValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "centerValue", required: false }] }], centerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "centerLabel", required: false }] }] } });
|
|
148
148
|
|
|
149
149
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngwr-donut-chart.mjs","sources":["../../../projects/lib/donut-chart/donut-chart.ts","../../../projects/lib/donut-chart/donut-chart.html","../../../projects/lib/donut-chart/ngwr-donut-chart.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input } from '@angular/core';\n\nimport { useI18nText } from 'ngwr/i18n';\n\nimport type { WrDonutSegment } from './interfaces';\n\n/**\n * A segment's contribution to the ring. `Math.max(0, NaN)` is NaN, and the running total\n * carries it forward — so one non-finite datum used to take out its own arc AND every arc\n * after it, writing the literal text `NaN` into the path `d`.\n */\nfunction weight(value: number): number {\n return Number.isFinite(value) ? Math.max(0, value) : 0;\n}\n\nconst FALLBACK_COLORS = [\n 'var(--wr-color-primary)',\n 'var(--wr-color-secondary)',\n 'var(--wr-color-success)',\n 'var(--wr-color-warning)',\n 'var(--wr-color-danger)',\n 'var(--wr-color-medium)',\n];\n\n/**\n * Donut chart. Set `thickness` to 0 for a solid pie. Optional center\n * text via inputs.\n *\n * @example\n * ```html\n * <wr-donut-chart [segments]=\"[\n * { label: 'Used', value: 60 },\n * { label: 'Free', value: 40 }\n * ]\" centerLabel=\"Disk\" centerValue=\"60%\" />\n * ```\n *\n * @see https://ngwr.dev/reference/components/donut-chart\n */\n@Component({\n selector: 'wr-donut-chart',\n templateUrl: './donut-chart.html',\n encapsulation: ViewEncapsulation.None,\n host: { class: 'wr-donut-chart' },\n})\nexport class WrDonutChart {\n readonly segments = input<readonly WrDonutSegment[]>([]);\n\n /**\n * Accessible name of the drawing. The arcs carry no text and the legend is optional, so\n * with `showLegend: false` this and the centre text are the whole of what a screen reader\n * gets. Falls back to `donutChart.label`.\n */\n readonly ariaLabel = input<string | null>(null);\n\n protected readonly resolvedAriaLabel = useI18nText(this.ariaLabel, 'donutChart.label', 'Donut chart');\n\n /** Diameter in CSS pixels. @default 200 */\n readonly size = input(200, { transform: (v: unknown): number => Math.max(48, coerceNumberProperty(v, 200)) });\n\n /** Inner-ring thickness as a percent of radius (0–100). `0` = solid pie. @default 30 */\n readonly thickness = input(30, {\n transform: (v: unknown): number => Math.min(100, Math.max(0, coerceNumberProperty(v, 30))),\n });\n\n /** Show the legend under the chart. @default true */\n readonly showLegend = input(true, { transform: coerceBooleanProperty });\n\n /** Bold value text in the center. */\n readonly centerValue = input<string>('');\n\n /** Smaller label under the value. */\n readonly centerLabel = input<string>('');\n\n // Drawn in a 100×100 viewBox.\n private readonly outerR = 50;\n\n protected readonly innerR = computed(() => {\n const thickness = this.thickness();\n // 0 = solid pie: fill all the way to the center, not a zero-width ring.\n if (thickness === 0) return 0;\n return this.outerR * (1 - thickness / 100);\n });\n\n protected readonly total = computed(() => {\n const sum = this.segments().reduce((acc, s) => acc + weight(s.value), 0);\n return sum > 0 ? sum : 1;\n });\n\n /** Resolved slices ready for the template — each carries its arc path. */\n protected readonly slices = computed(() => {\n const total = this.total();\n let cumulative = 0;\n return this.segments().map((s, i) => {\n const value = weight(s.value);\n const startAngle = (cumulative / total) * Math.PI * 2;\n cumulative += value;\n const endAngle = (cumulative / total) * Math.PI * 2;\n return {\n label: s.label,\n value,\n color: s.color ?? FALLBACK_COLORS[i % FALLBACK_COLORS.length],\n path: this.arcPath(startAngle, endAngle),\n percent: (value / total) * 100,\n };\n });\n });\n\n // Helpers\n\n /** SVG path for one donut slice using outer and inner arcs. */\n private arcPath(start: number, end: number): string {\n const cx = 50;\n const cy = 50;\n const ro = this.outerR;\n const ri = this.innerR();\n const sweep = end - start;\n if (sweep <= 0) return '';\n // Full-circle slice — two halves so the arc can render.\n if (sweep >= Math.PI * 2 - 1e-6) {\n const path = [\n `M ${cx + ro} ${cy}`,\n `A ${ro} ${ro} 0 1 1 ${cx - ro} ${cy}`,\n `A ${ro} ${ro} 0 1 1 ${cx + ro} ${cy}`,\n ];\n if (ri > 0) {\n path.push(`M ${cx + ri} ${cy}`, `A ${ri} ${ri} 0 1 0 ${cx - ri} ${cy}`, `A ${ri} ${ri} 0 1 0 ${cx + ri} ${cy}`);\n }\n return path.join(' ');\n }\n const largeArc = sweep > Math.PI ? 1 : 0;\n const sox = cx + ro * Math.cos(start);\n const soy = cy + ro * Math.sin(start);\n const eox = cx + ro * Math.cos(end);\n const eoy = cy + ro * Math.sin(end);\n if (ri === 0) {\n return `M ${cx} ${cy} L ${sox.toFixed(2)} ${soy.toFixed(2)} A ${ro} ${ro} 0 ${largeArc} 1 ${eox.toFixed(2)} ${eoy.toFixed(2)} Z`;\n }\n const eix = cx + ri * Math.cos(end);\n const eiy = cy + ri * Math.sin(end);\n const six = cx + ri * Math.cos(start);\n const siy = cy + ri * Math.sin(start);\n return [\n `M ${sox.toFixed(2)} ${soy.toFixed(2)}`,\n `A ${ro} ${ro} 0 ${largeArc} 1 ${eox.toFixed(2)} ${eoy.toFixed(2)}`,\n `L ${eix.toFixed(2)} ${eiy.toFixed(2)}`,\n `A ${ri} ${ri} 0 ${largeArc} 0 ${six.toFixed(2)} ${siy.toFixed(2)}`,\n 'Z',\n ].join(' ');\n }\n}\n\nexport type { WrDonutSegment } from './interfaces';\n","<div class=\"wr-donut-chart__surface\" [style.width.px]=\"size()\">\n <!-- The name sits on the DRAWING, not on this wrapper. `img` is a\n children-presentational role, so with it out here WebKit dropped the whole\n subtree — including the centre value and label, which are real text and are\n the headline datum the legend does not carry. -->\n <svg viewBox=\"0 0 100 100\" role=\"img\" [attr.aria-label]=\"resolvedAriaLabel()\">\n @for (slice of slices(); track $index) {\n <path [attr.d]=\"slice.path\" [attr.fill]=\"slice.color\" />\n }\n </svg>\n @if (centerValue() || centerLabel()) {\n <div class=\"wr-donut-chart__center\">\n @if (centerValue()) {\n <div class=\"wr-donut-chart__center-value\">{{ centerValue() }}</div>\n }\n @if (centerLabel()) {\n <div class=\"wr-donut-chart__center-label\">{{ centerLabel() }}</div>\n }\n </div>\n }\n</div>\n\n@if (showLegend() && slices().length > 0) {\n <ul class=\"wr-donut-chart__legend\">\n @for (slice of slices(); track $index) {\n <li class=\"wr-donut-chart__legend-item\">\n <span class=\"wr-donut-chart__swatch\" [style.background]=\"slice.color\"></span>\n <span class=\"wr-donut-chart__legend-label\">{{ slice.label }}</span>\n <span class=\"wr-donut-chart__legend-value\">{{ slice.value }}</span>\n </li>\n }\n </ul>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ngwr-donut-chart.mjs","sources":["../../../projects/lib/donut-chart/donut-chart.ts","../../../projects/lib/donut-chart/donut-chart.html","../../../projects/lib/donut-chart/ngwr-donut-chart.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input } from '@angular/core';\n\nimport { useI18nText } from 'ngwr/i18n';\n\nimport type { WrDonutSegment } from './interfaces';\n\n/**\n * A segment's contribution to the ring. `Math.max(0, NaN)` is NaN, and the running total\n * carries it forward — so one non-finite datum used to take out its own arc AND every arc\n * after it, writing the literal text `NaN` into the path `d`.\n */\nfunction weight(value: number): number {\n return Number.isFinite(value) ? Math.max(0, value) : 0;\n}\n\nconst FALLBACK_COLORS = [\n 'var(--wr-color-primary)',\n 'var(--wr-color-secondary)',\n 'var(--wr-color-success)',\n 'var(--wr-color-warning)',\n 'var(--wr-color-danger)',\n 'var(--wr-color-medium)',\n];\n\n/**\n * Donut chart. Set `thickness` to 0 for a solid pie. Optional center\n * text via inputs.\n *\n * @example\n * ```html\n * <wr-donut-chart [segments]=\"[\n * { label: 'Used', value: 60 },\n * { label: 'Free', value: 40 }\n * ]\" centerLabel=\"Disk\" centerValue=\"60%\" />\n * ```\n *\n * @see https://ngwr.dev/reference/components/donut-chart\n */\n@Component({\n selector: 'wr-donut-chart',\n templateUrl: './donut-chart.html',\n encapsulation: ViewEncapsulation.None,\n host: { class: 'wr-donut-chart' },\n})\nexport class WrDonutChart {\n readonly segments = input<readonly WrDonutSegment[]>([]);\n\n /**\n * Accessible name of the drawing. The arcs carry no text and the legend is optional, so\n * with `showLegend: false` this and the centre text are the whole of what a screen reader\n * gets. Falls back to `donutChart.label`.\n */\n readonly ariaLabel = input<string | null>(null);\n\n protected readonly resolvedAriaLabel = useI18nText(this.ariaLabel, 'donutChart.label', 'Donut chart');\n\n /** Diameter in CSS pixels. @default 200 */\n readonly size = input(200, { transform: (v: unknown): number => Math.max(48, coerceNumberProperty(v, 200)) });\n\n /** Inner-ring thickness as a percent of radius (0–100). `0` = solid pie. @default 30 */\n readonly thickness = input(30, {\n transform: (v: unknown): number => Math.min(100, Math.max(0, coerceNumberProperty(v, 30))),\n });\n\n /** Show the legend under the chart. @default true */\n readonly showLegend = input(true, { transform: coerceBooleanProperty });\n\n /** Bold value text in the center. */\n readonly centerValue = input<string>('');\n\n /** Smaller label under the value. */\n readonly centerLabel = input<string>('');\n\n // Drawn in a 100×100 viewBox.\n private readonly outerR = 50;\n\n protected readonly innerR = computed(() => {\n const thickness = this.thickness();\n // 0 = solid pie: fill all the way to the center, not a zero-width ring.\n if (thickness === 0) return 0;\n return this.outerR * (1 - thickness / 100);\n });\n\n protected readonly total = computed(() => {\n const sum = this.segments().reduce((acc, s) => acc + weight(s.value), 0);\n return sum > 0 ? sum : 1;\n });\n\n /** Resolved slices ready for the template — each carries its arc path. */\n protected readonly slices = computed(() => {\n const total = this.total();\n let cumulative = 0;\n return this.segments().map((s, i) => {\n const value = weight(s.value);\n const startAngle = (cumulative / total) * Math.PI * 2;\n cumulative += value;\n const endAngle = (cumulative / total) * Math.PI * 2;\n return {\n label: s.label,\n value,\n color: s.color ?? FALLBACK_COLORS[i % FALLBACK_COLORS.length],\n path: this.arcPath(startAngle, endAngle),\n percent: (value / total) * 100,\n };\n });\n });\n\n // Helpers\n\n /** SVG path for one donut slice using outer and inner arcs. */\n private arcPath(start: number, end: number): string {\n const cx = 50;\n const cy = 50;\n const ro = this.outerR;\n const ri = this.innerR();\n const sweep = end - start;\n if (sweep <= 0) return '';\n // Full-circle slice — two halves so the arc can render.\n if (sweep >= Math.PI * 2 - 1e-6) {\n const path = [\n `M ${cx + ro} ${cy}`,\n `A ${ro} ${ro} 0 1 1 ${cx - ro} ${cy}`,\n `A ${ro} ${ro} 0 1 1 ${cx + ro} ${cy}`,\n ];\n if (ri > 0) {\n path.push(`M ${cx + ri} ${cy}`, `A ${ri} ${ri} 0 1 0 ${cx - ri} ${cy}`, `A ${ri} ${ri} 0 1 0 ${cx + ri} ${cy}`);\n }\n return path.join(' ');\n }\n const largeArc = sweep > Math.PI ? 1 : 0;\n const sox = cx + ro * Math.cos(start);\n const soy = cy + ro * Math.sin(start);\n const eox = cx + ro * Math.cos(end);\n const eoy = cy + ro * Math.sin(end);\n if (ri === 0) {\n return `M ${cx} ${cy} L ${sox.toFixed(2)} ${soy.toFixed(2)} A ${ro} ${ro} 0 ${largeArc} 1 ${eox.toFixed(2)} ${eoy.toFixed(2)} Z`;\n }\n const eix = cx + ri * Math.cos(end);\n const eiy = cy + ri * Math.sin(end);\n const six = cx + ri * Math.cos(start);\n const siy = cy + ri * Math.sin(start);\n return [\n `M ${sox.toFixed(2)} ${soy.toFixed(2)}`,\n `A ${ro} ${ro} 0 ${largeArc} 1 ${eox.toFixed(2)} ${eoy.toFixed(2)}`,\n `L ${eix.toFixed(2)} ${eiy.toFixed(2)}`,\n `A ${ri} ${ri} 0 ${largeArc} 0 ${six.toFixed(2)} ${siy.toFixed(2)}`,\n 'Z',\n ].join(' ');\n }\n}\n\nexport type { WrDonutSegment } from './interfaces';\n","<div class=\"wr-donut-chart__surface\" [style.width.px]=\"size()\">\n <!-- The name sits on the DRAWING, not on this wrapper. `img` is a\n children-presentational role, so with it out here WebKit dropped the whole\n subtree — including the centre value and label, which are real text and are\n the headline datum the legend does not carry. -->\n <svg viewBox=\"0 0 100 100\" role=\"img\" [attr.aria-label]=\"resolvedAriaLabel()\">\n <!-- Every slice is stroked in the SURFACE colour, so adjacent arcs are\n separated by a visible gap rather than by the boundary between two\n fills. Without it the only thing dividing two slices is the colour\n change itself, and the default palette's entries sit within about\n 1.06:1 of each other in relative luminance — for a reader who cannot\n separate hue, two neighbours merge into one arc and the chart reads as\n having fewer slices than it has. A gap is a shape, and it survives\n greyscale, printing and a monochrome display. -->\n @for (slice of slices(); track $index) {\n <path\n [attr.d]=\"slice.path\"\n [attr.fill]=\"slice.color\"\n stroke=\"var(--wr-color-surface)\"\n stroke-width=\"1\"\n stroke-linejoin=\"round\"\n />\n }\n </svg>\n @if (centerValue() || centerLabel()) {\n <div class=\"wr-donut-chart__center\">\n @if (centerValue()) {\n <div class=\"wr-donut-chart__center-value\">{{ centerValue() }}</div>\n }\n @if (centerLabel()) {\n <div class=\"wr-donut-chart__center-label\">{{ centerLabel() }}</div>\n }\n </div>\n }\n</div>\n\n@if (showLegend() && slices().length > 0) {\n <ul class=\"wr-donut-chart__legend\">\n @for (slice of slices(); track $index) {\n <li class=\"wr-donut-chart__legend-item\">\n <span class=\"wr-donut-chart__swatch\" [style.background]=\"slice.color\"></span>\n <span class=\"wr-donut-chart__legend-label\">{{ slice.label }}</span>\n <span class=\"wr-donut-chart__legend-value\">{{ slice.value }}</span>\n </li>\n }\n </ul>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -253,10 +253,10 @@ class WrSortableList {
|
|
|
253
253
|
position(index) {
|
|
254
254
|
return { index: index + 1, total: this.items().length };
|
|
255
255
|
}
|
|
256
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
257
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrSortableList, isStandalone: true, selector: "wr-sortable-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, lockAxis: { classPropertyName: "lockAxis", publicName: "lockAxis", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", reorder: "reorder" }, host: { classAttribute: "wr-sortable-list" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: (TemplateRef), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "rowEls", predicate: ["row"], descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n `role=\"list\"` / `role=\"listitem\"` rather than the bare divs this used to be:\n every row is a tab stop now, and a focusable element with no role at all is\n announced as loose text. The list role is also what gives the reader the\n position of the row focus lands on.\n-->\n<div\n cdkDropList\n role=\"list\"\n class=\"wr-sortable-list__list\"\n [cdkDropListOrientation]=\"orientation()\"\n [cdkDropListDisabled]=\"disabled()\"\n (cdkDropListDropped)=\"onDrop($event)\"\n>\n @for (item of items(); track trackBy()($index, item)) {\n <div\n #row\n cdkDrag\n role=\"listitem\"\n class=\"wr-sortable-list__item\"\n [class.wr-sortable-list__item--grabbed]=\"grabbedIndex() === $index\"\n [attr.tabindex]=\"disabled() ? null : 0\"\n [attr.aria-describedby]=\"disabled() ? null : keyHelpId\"\n [cdkDragDisabled]=\"disabled()\"\n [cdkDragLockAxis]=\"lockAxis() ?? null\"\n [cdkDragStartDelay]=\"dragStartDelay()\"\n (keydown)=\"onRowKeydown($event, $index)\"\n (focusout)=\"onRowFocusout()\"\n >\n <ng-container *ngTemplateOutlet=\"rowTemplate(); context: { $implicit: item, index: $index }\" />\n </div>\n }\n</div>\n\n<!--\n The key model, on every row rather than once on the container: focus lands on\n a row and never on the list itself, so a description hung on the list would\n never be read out.\n-->\n<p class=\"wr-sortable-list__sr-only\" [id]=\"keyHelpId\">{{ resolvedKeyHelp() }}</p>\n\n<!--\n Position announcements, written by the keyboard path only \u2014 a drag already\n gives sighted feedback, and announcing every pointer move would flood the\n region.\n-->\n<p class=\"wr-sortable-list__sr-only\" role=\"status\">{{ announcement() }}</p>\n", styles: [".wr-btn: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-table__sort-btn: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-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{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-sortable-list{display:block}.wr-sortable-list__list{display:flex;flex-direction:column;gap:var(--wr-sortable-list-gap, .5rem)}.wr-sortable-list__item{cursor:grab;-webkit-user-select:none;user-select:none;transition:box-shadow .18s ease}.wr-sortable-list__item.cdk-drag-disabled{cursor:default}.wr-sortable-list__item:active{cursor:grabbing}.wr-sortable-list__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-sortable-list__item--grabbed{cursor:grabbing;box-shadow:0 6px 12px rgba(var(--wr-color-backdrop-rgb),.22)}.wr-sortable-list__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.wr-sortable-list[orientation=horizontal] .wr-sortable-list__list,.wr-sortable-list[data-orientation=horizontal] .wr-sortable-list__list{flex-direction:row}.wr-drag-handle{cursor:grab;display:inline-flex;align-items:center;justify-content:center;color:rgba(var(--wr-color-on-surface-rgb),.45);transition:color .15s ease}@media(pointer:coarse){.wr-drag-handle{position:relative}.wr-drag-handle:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-drag-handle:hover{color:var(--wr-color-on-surface)}.wr-drag-handle:active{cursor:grabbing}.cdk-drag-preview.wr-sortable-list__item{box-sizing:border-box;color:var(--wr-color-on-surface);font-family:var(--wr-font-family-base);transition:none;filter:drop-shadow(0 8px 12px rgba(var(--wr-color-backdrop-rgb),.24)) drop-shadow(0 2px 3px rgba(var(--wr-color-backdrop-rgb),.16))}.wr-sortable-list .cdk-drag-placeholder{opacity:.35;background:var(--wr-color-fill-strong);border-radius:var(--wr-border-radius-base);outline:1px dashed rgba(var(--wr-color-on-surface-rgb),.25);outline-offset:-1px}.cdk-drag-animating.wr-sortable-list__item{transition:transform .18s var(--wr-ease-spring)}.wr-sortable-list__list.cdk-drop-list-dragging .wr-sortable-list__item:not(.cdk-drag-placeholder){transition:transform .18s var(--wr-ease-spring)}\n"], dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
256
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrSortableList, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
257
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrSortableList, isStandalone: true, selector: "wr-sortable-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, lockAxis: { classPropertyName: "lockAxis", publicName: "lockAxis", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", reorder: "reorder" }, host: { classAttribute: "wr-sortable-list" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: (TemplateRef), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "rowEls", predicate: ["row"], descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n `role=\"list\"` / `role=\"listitem\"` rather than the bare divs this used to be:\n every row is a tab stop now, and a focusable element with no role at all is\n announced as loose text. The list role is also what gives the reader the\n position of the row focus lands on.\n-->\n<div\n cdkDropList\n role=\"list\"\n class=\"wr-sortable-list__list\"\n [cdkDropListOrientation]=\"orientation()\"\n [cdkDropListDisabled]=\"disabled()\"\n (cdkDropListDropped)=\"onDrop($event)\"\n>\n @for (item of items(); track trackBy()($index, item)) {\n <div\n #row\n cdkDrag\n role=\"listitem\"\n class=\"wr-sortable-list__item\"\n [class.wr-sortable-list__item--grabbed]=\"grabbedIndex() === $index\"\n [attr.tabindex]=\"disabled() ? null : 0\"\n [attr.aria-describedby]=\"disabled() ? null : keyHelpId\"\n [cdkDragDisabled]=\"disabled()\"\n [cdkDragLockAxis]=\"lockAxis() ?? null\"\n [cdkDragStartDelay]=\"dragStartDelay()\"\n (keydown)=\"onRowKeydown($event, $index)\"\n (focusout)=\"onRowFocusout()\"\n >\n <ng-container *ngTemplateOutlet=\"rowTemplate(); context: { $implicit: item, index: $index }\" />\n </div>\n }\n</div>\n\n<!--\n The key model, on every row rather than once on the container: focus lands on\n a row and never on the list itself, so a description hung on the list would\n never be read out.\n-->\n<p class=\"wr-sortable-list__sr-only\" [id]=\"keyHelpId\">{{ resolvedKeyHelp() }}</p>\n\n<!--\n Position announcements, written by the keyboard path only \u2014 a drag already\n gives sighted feedback, and announcing every pointer move would flood the\n region.\n-->\n<p class=\"wr-sortable-list__sr-only\" role=\"status\">{{ announcement() }}</p>\n", styles: [".wr-btn: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-table__sort-btn: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-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{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-sortable-list{display:block}.wr-sortable-list__list{display:flex;flex-direction:column;gap:var(--wr-sortable-list-gap, .5rem)}.wr-sortable-list__item{cursor:grab;-webkit-user-select:none;user-select:none;transition:box-shadow .18s ease}.wr-sortable-list__item.cdk-drag-disabled{cursor:default}.wr-sortable-list__item:active{cursor:grabbing}.wr-sortable-list__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-sortable-list__item--grabbed{cursor:grabbing;box-shadow:0 6px 12px rgba(var(--wr-color-backdrop-rgb),.22)}.wr-sortable-list__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.wr-sortable-list[orientation=horizontal] .wr-sortable-list__list,.wr-sortable-list[data-orientation=horizontal] .wr-sortable-list__list{flex-direction:row}.wr-drag-handle{cursor:grab;display:inline-flex;align-items:center;justify-content:center;color:rgba(var(--wr-color-on-surface-rgb),.45);transition:color .15s ease}@media(pointer:coarse){.wr-drag-handle{position:relative}.wr-drag-handle:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-drag-handle:hover{color:var(--wr-color-on-surface)}.wr-drag-handle:active{cursor:grabbing}.cdk-drag-preview.wr-sortable-list__item{box-sizing:border-box;color:var(--wr-color-on-surface);font-family:var(--wr-font-family-base);transition:none;filter:drop-shadow(0 8px 12px rgba(var(--wr-color-backdrop-rgb),.24)) drop-shadow(0 2px 3px rgba(var(--wr-color-backdrop-rgb),.16))}.wr-sortable-list .cdk-drag-placeholder{opacity:.35;background:var(--wr-color-fill-strong);border-radius:var(--wr-border-radius-base);outline:1px dashed rgba(var(--wr-color-on-surface-rgb),.25);outline-offset:-1px}.cdk-drag-animating.wr-sortable-list__item{transition:transform .18s var(--wr-ease-spring)}.wr-sortable-list__list.cdk-drop-list-dragging .wr-sortable-list__item:not(.cdk-drag-placeholder){transition:transform .18s var(--wr-ease-spring)}\n"], dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
258
258
|
}
|
|
259
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
259
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrSortableList, decorators: [{
|
|
260
260
|
type: Component,
|
|
261
261
|
args: [{ selector: 'wr-sortable-list', encapsulation: ViewEncapsulation.None, imports: [CdkDropList, CdkDrag, NgTemplateOutlet], host: { class: 'wr-sortable-list' }, template: "<!--\n `role=\"list\"` / `role=\"listitem\"` rather than the bare divs this used to be:\n every row is a tab stop now, and a focusable element with no role at all is\n announced as loose text. The list role is also what gives the reader the\n position of the row focus lands on.\n-->\n<div\n cdkDropList\n role=\"list\"\n class=\"wr-sortable-list__list\"\n [cdkDropListOrientation]=\"orientation()\"\n [cdkDropListDisabled]=\"disabled()\"\n (cdkDropListDropped)=\"onDrop($event)\"\n>\n @for (item of items(); track trackBy()($index, item)) {\n <div\n #row\n cdkDrag\n role=\"listitem\"\n class=\"wr-sortable-list__item\"\n [class.wr-sortable-list__item--grabbed]=\"grabbedIndex() === $index\"\n [attr.tabindex]=\"disabled() ? null : 0\"\n [attr.aria-describedby]=\"disabled() ? null : keyHelpId\"\n [cdkDragDisabled]=\"disabled()\"\n [cdkDragLockAxis]=\"lockAxis() ?? null\"\n [cdkDragStartDelay]=\"dragStartDelay()\"\n (keydown)=\"onRowKeydown($event, $index)\"\n (focusout)=\"onRowFocusout()\"\n >\n <ng-container *ngTemplateOutlet=\"rowTemplate(); context: { $implicit: item, index: $index }\" />\n </div>\n }\n</div>\n\n<!--\n The key model, on every row rather than once on the container: focus lands on\n a row and never on the list itself, so a description hung on the list would\n never be read out.\n-->\n<p class=\"wr-sortable-list__sr-only\" [id]=\"keyHelpId\">{{ resolvedKeyHelp() }}</p>\n\n<!--\n Position announcements, written by the keyboard path only \u2014 a drag already\n gives sighted feedback, and announcing every pointer move would flood the\n region.\n-->\n<p class=\"wr-sortable-list__sr-only\" role=\"status\">{{ announcement() }}</p>\n", styles: [".wr-btn: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-table__sort-btn: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-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{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-sortable-list{display:block}.wr-sortable-list__list{display:flex;flex-direction:column;gap:var(--wr-sortable-list-gap, .5rem)}.wr-sortable-list__item{cursor:grab;-webkit-user-select:none;user-select:none;transition:box-shadow .18s ease}.wr-sortable-list__item.cdk-drag-disabled{cursor:default}.wr-sortable-list__item:active{cursor:grabbing}.wr-sortable-list__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-sortable-list__item--grabbed{cursor:grabbing;box-shadow:0 6px 12px rgba(var(--wr-color-backdrop-rgb),.22)}.wr-sortable-list__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.wr-sortable-list[orientation=horizontal] .wr-sortable-list__list,.wr-sortable-list[data-orientation=horizontal] .wr-sortable-list__list{flex-direction:row}.wr-drag-handle{cursor:grab;display:inline-flex;align-items:center;justify-content:center;color:rgba(var(--wr-color-on-surface-rgb),.45);transition:color .15s ease}@media(pointer:coarse){.wr-drag-handle{position:relative}.wr-drag-handle:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-drag-handle:hover{color:var(--wr-color-on-surface)}.wr-drag-handle:active{cursor:grabbing}.cdk-drag-preview.wr-sortable-list__item{box-sizing:border-box;color:var(--wr-color-on-surface);font-family:var(--wr-font-family-base);transition:none;filter:drop-shadow(0 8px 12px rgba(var(--wr-color-backdrop-rgb),.24)) drop-shadow(0 2px 3px rgba(var(--wr-color-backdrop-rgb),.16))}.wr-sortable-list .cdk-drag-placeholder{opacity:.35;background:var(--wr-color-fill-strong);border-radius:var(--wr-border-radius-base);outline:1px dashed rgba(var(--wr-color-on-surface-rgb),.25);outline-offset:-1px}.cdk-drag-animating.wr-sortable-list__item{transition:transform .18s var(--wr-ease-spring)}.wr-sortable-list__list.cdk-drop-list-dragging .wr-sortable-list__item:not(.cdk-drag-placeholder){transition:transform .18s var(--wr-ease-spring)}\n"] }]
|
|
262
262
|
}], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }, { type: i0.Output, args: ["itemsChange"] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], lockAxis: [{ type: i0.Input, args: [{ isSignal: true, alias: "lockAxis", required: false }] }], dragStartDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragStartDelay", required: false }] }], trackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackBy", required: false }] }], reorder: [{ type: i0.Output, args: ["reorder"] }], rowTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], rowEls: [{ type: i0.ViewChildren, args: ['row', { isSignal: true }] }] } });
|
|
@@ -285,10 +285,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
|
|
|
285
285
|
* ```
|
|
286
286
|
*/
|
|
287
287
|
class WrDragHandle {
|
|
288
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
289
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
288
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDragHandle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
289
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: WrDragHandle, isStandalone: true, selector: "[wrDragHandle]", host: { classAttribute: "wr-drag-handle" }, hostDirectives: [{ directive: i1.CdkDragHandle }], ngImport: i0 });
|
|
290
290
|
}
|
|
291
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
291
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrDragHandle, decorators: [{
|
|
292
292
|
type: Directive,
|
|
293
293
|
args: [{
|
|
294
294
|
selector: '[wrDragHandle]',
|