@radix-ng/primitives 0.50.0 → 0.51.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/collection/README.md +1 -0
- package/fesm2022/radix-ng-primitives-accordion.mjs +41 -40
- package/fesm2022/radix-ng-primitives-accordion.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-alert-dialog.mjs +22 -22
- package/fesm2022/radix-ng-primitives-alert-dialog.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-arrow.mjs +6 -6
- package/fesm2022/radix-ng-primitives-arrow.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-aspect-ratio.mjs +6 -6
- package/fesm2022/radix-ng-primitives-aspect-ratio.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-avatar.mjs +22 -22
- package/fesm2022/radix-ng-primitives-avatar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-calendar.mjs +104 -103
- package/fesm2022/radix-ng-primitives-calendar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-checkbox.mjs +51 -41
- package/fesm2022/radix-ng-primitives-checkbox.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-collapsible.mjs +28 -28
- package/fesm2022/radix-ng-primitives-collapsible.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-collection.mjs +89 -0
- package/fesm2022/radix-ng-primitives-collection.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-config.mjs +5 -5
- package/fesm2022/radix-ng-primitives-config.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-context-menu.mjs +36 -36
- package/fesm2022/radix-ng-primitives-context-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-core.mjs +33 -24
- package/fesm2022/radix-ng-primitives-core.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-cropper.mjs +54 -53
- package/fesm2022/radix-ng-primitives-cropper.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-date-field.mjs +48 -47
- package/fesm2022/radix-ng-primitives-date-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-dialog.mjs +34 -34
- package/fesm2022/radix-ng-primitives-dialog.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-dismissable-layer.mjs +31 -33
- package/fesm2022/radix-ng-primitives-dismissable-layer.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-dropdown-menu.mjs +41 -43
- package/fesm2022/radix-ng-primitives-dropdown-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-editable.mjs +20 -20
- package/fesm2022/radix-ng-primitives-editable.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-focus-guards.mjs +3 -3
- package/fesm2022/radix-ng-primitives-focus-guards.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-focus-scope.mjs +7 -7
- package/fesm2022/radix-ng-primitives-focus-scope.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-hover-card.mjs +69 -77
- package/fesm2022/radix-ng-primitives-hover-card.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-label.mjs +7 -7
- package/fesm2022/radix-ng-primitives-label.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-menu.mjs +65 -70
- package/fesm2022/radix-ng-primitives-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-menubar.mjs +31 -31
- package/fesm2022/radix-ng-primitives-menubar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-navigation-menu.mjs +113 -105
- package/fesm2022/radix-ng-primitives-navigation-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-number-field.mjs +48 -47
- package/fesm2022/radix-ng-primitives-number-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-pagination.mjs +51 -51
- package/fesm2022/radix-ng-primitives-pagination.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-popover.mjs +67 -71
- package/fesm2022/radix-ng-primitives-popover.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-popper.mjs +61 -56
- package/fesm2022/radix-ng-primitives-popper.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-portal.mjs +7 -7
- package/fesm2022/radix-ng-primitives-portal.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-presence.mjs +4 -4
- package/fesm2022/radix-ng-primitives-presence.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-progress.mjs +16 -16
- package/fesm2022/radix-ng-primitives-progress.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-radio.mjs +38 -37
- package/fesm2022/radix-ng-primitives-radio.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-roving-focus.mjs +38 -34
- package/fesm2022/radix-ng-primitives-roving-focus.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-select.mjs +41 -43
- package/fesm2022/radix-ng-primitives-select.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-select2.mjs +897 -0
- package/fesm2022/radix-ng-primitives-select2.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-separator.mjs +11 -17
- package/fesm2022/radix-ng-primitives-separator.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-slider.mjs +88 -84
- package/fesm2022/radix-ng-primitives-slider.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-stepper.mjs +55 -53
- package/fesm2022/radix-ng-primitives-stepper.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-switch.mjs +22 -30
- package/fesm2022/radix-ng-primitives-switch.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-tabs.mjs +38 -38
- package/fesm2022/radix-ng-primitives-tabs.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-time-field.mjs +63 -78
- package/fesm2022/radix-ng-primitives-time-field.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toggle-group.mjs +24 -24
- package/fesm2022/radix-ng-primitives-toggle-group.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toggle.mjs +11 -11
- package/fesm2022/radix-ng-primitives-toggle.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toolbar.mjs +31 -29
- package/fesm2022/radix-ng-primitives-toolbar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-tooltip.mjs +69 -77
- package/fesm2022/radix-ng-primitives-tooltip.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-tooltip2.mjs +57 -62
- package/fesm2022/radix-ng-primitives-tooltip2.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-visually-hidden.mjs +31 -31
- package/fesm2022/radix-ng-primitives-visually-hidden.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives.mjs.map +1 -1
- package/package.json +63 -54
- package/select2/README.md +3 -0
- package/{accordion/index.d.ts → types/radix-ng-primitives-accordion.d.ts} +61 -60
- package/{calendar/index.d.ts → types/radix-ng-primitives-calendar.d.ts} +1 -1
- package/{checkbox/index.d.ts → types/radix-ng-primitives-checkbox.d.ts} +31 -27
- package/{collapsible/index.d.ts → types/radix-ng-primitives-collapsible.d.ts} +20 -19
- package/types/radix-ng-primitives-collection.d.ts +40 -0
- package/{core/index.d.ts → types/radix-ng-primitives-core.d.ts} +6 -2
- package/{cropper/index.d.ts → types/radix-ng-primitives-cropper.d.ts} +4 -3
- package/{date-field/index.d.ts → types/radix-ng-primitives-date-field.d.ts} +4 -4
- package/{dialog/index.d.ts → types/radix-ng-primitives-dialog.d.ts} +2 -1
- package/{hover-card/index.d.ts → types/radix-ng-primitives-hover-card.d.ts} +3 -4
- package/{menu/index.d.ts → types/radix-ng-primitives-menu.d.ts} +1 -1
- package/{navigation-menu/index.d.ts → types/radix-ng-primitives-navigation-menu.d.ts} +47 -46
- package/{number-field/index.d.ts → types/radix-ng-primitives-number-field.d.ts} +13 -12
- package/{popover/index.d.ts → types/radix-ng-primitives-popover.d.ts} +3 -4
- package/{popper/index.d.ts → types/radix-ng-primitives-popper.d.ts} +1 -0
- package/{progress/index.d.ts → types/radix-ng-primitives-progress.d.ts} +2 -1
- package/{radio/index.d.ts → types/radix-ng-primitives-radio.d.ts} +1 -1
- package/{roving-focus/index.d.ts → types/radix-ng-primitives-roving-focus.d.ts} +8 -6
- package/types/radix-ng-primitives-select2.d.ts +511 -0
- package/{slider/index.d.ts → types/radix-ng-primitives-slider.d.ts} +4 -4
- package/{stepper/index.d.ts → types/radix-ng-primitives-stepper.d.ts} +17 -16
- package/{switch/index.d.ts → types/radix-ng-primitives-switch.d.ts} +3 -2
- package/{tabs/index.d.ts → types/radix-ng-primitives-tabs.d.ts} +7 -6
- package/{time-field/index.d.ts → types/radix-ng-primitives-time-field.d.ts} +4 -4
- package/{toggle-group/index.d.ts → types/radix-ng-primitives-toggle-group.d.ts} +12 -11
- package/{tooltip/index.d.ts → types/radix-ng-primitives-tooltip.d.ts} +3 -4
- package/{tooltip2/index.d.ts → types/radix-ng-primitives-tooltip2.d.ts} +4 -4
- /package/{alert-dialog/index.d.ts → types/radix-ng-primitives-alert-dialog.d.ts} +0 -0
- /package/{arrow/index.d.ts → types/radix-ng-primitives-arrow.d.ts} +0 -0
- /package/{aspect-ratio/index.d.ts → types/radix-ng-primitives-aspect-ratio.d.ts} +0 -0
- /package/{avatar/index.d.ts → types/radix-ng-primitives-avatar.d.ts} +0 -0
- /package/{config/index.d.ts → types/radix-ng-primitives-config.d.ts} +0 -0
- /package/{context-menu/index.d.ts → types/radix-ng-primitives-context-menu.d.ts} +0 -0
- /package/{dismissable-layer/index.d.ts → types/radix-ng-primitives-dismissable-layer.d.ts} +0 -0
- /package/{dropdown-menu/index.d.ts → types/radix-ng-primitives-dropdown-menu.d.ts} +0 -0
- /package/{editable/index.d.ts → types/radix-ng-primitives-editable.d.ts} +0 -0
- /package/{focus-guards/index.d.ts → types/radix-ng-primitives-focus-guards.d.ts} +0 -0
- /package/{focus-scope/index.d.ts → types/radix-ng-primitives-focus-scope.d.ts} +0 -0
- /package/{label/index.d.ts → types/radix-ng-primitives-label.d.ts} +0 -0
- /package/{menubar/index.d.ts → types/radix-ng-primitives-menubar.d.ts} +0 -0
- /package/{pagination/index.d.ts → types/radix-ng-primitives-pagination.d.ts} +0 -0
- /package/{portal/index.d.ts → types/radix-ng-primitives-portal.d.ts} +0 -0
- /package/{presence/index.d.ts → types/radix-ng-primitives-presence.d.ts} +0 -0
- /package/{select/index.d.ts → types/radix-ng-primitives-select.d.ts} +0 -0
- /package/{separator/index.d.ts → types/radix-ng-primitives-separator.d.ts} +0 -0
- /package/{toggle/index.d.ts → types/radix-ng-primitives-toggle.d.ts} +0 -0
- /package/{toolbar/index.d.ts → types/radix-ng-primitives-toolbar.d.ts} +0 -0
- /package/{visually-hidden/index.d.ts → types/radix-ng-primitives-visually-hidden.d.ts} +0 -0
- /package/{index.d.ts → types/radix-ng-primitives.d.ts} +0 -0
|
@@ -11,10 +11,10 @@ class RdxCropperCropAreaDirective {
|
|
|
11
11
|
constructor() {
|
|
12
12
|
this.rootContext = injectCropperRootContext();
|
|
13
13
|
}
|
|
14
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
15
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
14
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperCropAreaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
15
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxCropperCropAreaDirective, isStandalone: true, selector: "[rdxCropperCropArea]", host: { properties: { "style": "rootContext.getCropAreaStyle()" } }, ngImport: i0 }); }
|
|
16
16
|
}
|
|
17
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
17
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperCropAreaDirective, decorators: [{
|
|
18
18
|
type: Directive,
|
|
19
19
|
args: [{
|
|
20
20
|
selector: '[rdxCropperCropArea]',
|
|
@@ -28,10 +28,10 @@ class RdxCropperDescriptionDirective {
|
|
|
28
28
|
constructor() {
|
|
29
29
|
this.rootContext = injectCropperRootContext();
|
|
30
30
|
}
|
|
31
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
32
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
31
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperDescriptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
32
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxCropperDescriptionDirective, isStandalone: true, selector: "[rdxCropperDescription]", host: { properties: { "attr.id": "rootContext.descriptionId()" } }, ngImport: i0 }); }
|
|
33
33
|
}
|
|
34
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
34
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperDescriptionDirective, decorators: [{
|
|
35
35
|
type: Directive,
|
|
36
36
|
args: [{
|
|
37
37
|
selector: '[rdxCropperDescription]',
|
|
@@ -44,13 +44,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
|
|
|
44
44
|
class RdxCropperImageComponent {
|
|
45
45
|
constructor() {
|
|
46
46
|
this.rootContext = injectCropperRootContext();
|
|
47
|
-
this.imgClass = input(...(ngDevMode ? [undefined, { debugName: "imgClass" }] : []));
|
|
48
|
-
this.imgStyles = input(...(ngDevMode ? [undefined, { debugName: "imgStyles" }] : []));
|
|
49
|
-
this.imgClasses = computed(() => this.imgClass(), ...(ngDevMode ? [{ debugName: "imgClasses" }] : []));
|
|
50
|
-
this.imgStyless = computed(() => this.imgStyles(), ...(ngDevMode ? [{ debugName: "imgStyless" }] : []));
|
|
47
|
+
this.imgClass = input(...(ngDevMode ? [undefined, { debugName: "imgClass" }] : /* istanbul ignore next */ []));
|
|
48
|
+
this.imgStyles = input(...(ngDevMode ? [undefined, { debugName: "imgStyles" }] : /* istanbul ignore next */ []));
|
|
49
|
+
this.imgClasses = computed(() => this.imgClass(), ...(ngDevMode ? [{ debugName: "imgClasses" }] : /* istanbul ignore next */ []));
|
|
50
|
+
this.imgStyless = computed(() => this.imgStyles(), ...(ngDevMode ? [{ debugName: "imgStyless" }] : /* istanbul ignore next */ []));
|
|
51
51
|
}
|
|
52
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
53
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
52
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
53
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: RdxCropperImageComponent, isStandalone: true, selector: "[rdxCropperImage]", inputs: { imgClass: { classPropertyName: "imgClass", publicName: "imgClass", isSignal: true, isRequired: false, transformFunction: null }, imgStyles: { classPropertyName: "imgStyles", publicName: "imgStyles", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style": "rootContext.getImageWrapperStyle()" } }, ngImport: i0, template: `
|
|
54
54
|
<img
|
|
55
55
|
[class]="imgClasses()"
|
|
56
56
|
[src]="rootContext.getImageProps()['src']"
|
|
@@ -61,7 +61,7 @@ class RdxCropperImageComponent {
|
|
|
61
61
|
/>
|
|
62
62
|
`, isInline: true }); }
|
|
63
63
|
}
|
|
64
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
64
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperImageComponent, decorators: [{
|
|
65
65
|
type: Component,
|
|
66
66
|
args: [{
|
|
67
67
|
selector: '[rdxCropperImage]',
|
|
@@ -79,50 +79,50 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
|
|
|
79
79
|
/>
|
|
80
80
|
`
|
|
81
81
|
}]
|
|
82
|
-
}] });
|
|
82
|
+
}], propDecorators: { imgClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "imgClass", required: false }] }], imgStyles: [{ type: i0.Input, args: [{ isSignal: true, alias: "imgStyles", required: false }] }] } });
|
|
83
83
|
|
|
84
84
|
class RdxCropperRootDirective {
|
|
85
85
|
constructor() {
|
|
86
86
|
this.elementRef = inject((ElementRef));
|
|
87
87
|
this.CROPPER_DESC_WARN_MESSAGE = `Warning: \`Cropper\` requires a description element for accessibility.`;
|
|
88
|
-
this.image = input.required(...(ngDevMode ? [{ debugName: "image" }] : []));
|
|
89
|
-
this.cropPadding = input(25, ...(ngDevMode ?
|
|
90
|
-
this.aspectRatio = input(1, ...(ngDevMode ?
|
|
91
|
-
this.minZoom = input(1, ...(ngDevMode ?
|
|
92
|
-
this.maxZoom = input(3, ...(ngDevMode ?
|
|
93
|
-
this.zoomSensitivity = input(0.005, ...(ngDevMode ?
|
|
94
|
-
this.keyboardStep = input(10, ...(ngDevMode ?
|
|
95
|
-
this.zoom = input(undefined, ...(ngDevMode ?
|
|
88
|
+
this.image = input.required(...(ngDevMode ? [{ debugName: "image" }] : /* istanbul ignore next */ []));
|
|
89
|
+
this.cropPadding = input(25, { ...(ngDevMode ? { debugName: "cropPadding" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
90
|
+
this.aspectRatio = input(1, { ...(ngDevMode ? { debugName: "aspectRatio" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
91
|
+
this.minZoom = input(1, { ...(ngDevMode ? { debugName: "minZoom" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
92
|
+
this.maxZoom = input(3, { ...(ngDevMode ? { debugName: "maxZoom" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
93
|
+
this.zoomSensitivity = input(0.005, { ...(ngDevMode ? { debugName: "zoomSensitivity" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
94
|
+
this.keyboardStep = input(10, { ...(ngDevMode ? { debugName: "keyboardStep" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
95
|
+
this.zoom = input(undefined, { ...(ngDevMode ? { debugName: "zoom" } : /* istanbul ignore next */ {}), transform: numberAttribute });
|
|
96
96
|
this.onCropChange = output();
|
|
97
97
|
this.onZoomChange = output();
|
|
98
98
|
// State signals
|
|
99
|
-
this.imgWidth = signal(null, ...(ngDevMode ? [{ debugName: "imgWidth" }] : []));
|
|
100
|
-
this.imgHeight = signal(null, ...(ngDevMode ? [{ debugName: "imgHeight" }] : []));
|
|
101
|
-
this.cropAreaWidth = signal(0, ...(ngDevMode ? [{ debugName: "cropAreaWidth" }] : []));
|
|
102
|
-
this.cropAreaHeight = signal(0, ...(ngDevMode ? [{ debugName: "cropAreaHeight" }] : []));
|
|
103
|
-
this.imageWrapperWidth = signal(0, ...(ngDevMode ? [{ debugName: "imageWrapperWidth" }] : []));
|
|
104
|
-
this.imageWrapperHeight = signal(0, ...(ngDevMode ? [{ debugName: "imageWrapperHeight" }] : []));
|
|
105
|
-
this.offsetX = signal(0, ...(ngDevMode ? [{ debugName: "offsetX" }] : []));
|
|
106
|
-
this.offsetY = signal(0, ...(ngDevMode ? [{ debugName: "offsetY" }] : []));
|
|
107
|
-
this.internalZoom = signal(this.minZoom(), ...(ngDevMode ? [{ debugName: "internalZoom" }] : []));
|
|
108
|
-
this.isDragging = signal(false, ...(ngDevMode ? [{ debugName: "isDragging" }] : []));
|
|
109
|
-
this.descriptionId = signal(`cropper-${Math.random().toString(36).substring(2, 9)}`, ...(ngDevMode ? [{ debugName: "descriptionId" }] : []));
|
|
110
|
-
this.isZoomControlled = computed(() => this.zoom() !== undefined, ...(ngDevMode ? [{ debugName: "isZoomControlled" }] : []));
|
|
111
|
-
this.effectiveZoom = computed(() => (this.isZoomControlled() ? this.zoom() : this.internalZoom()), ...(ngDevMode ? [{ debugName: "effectiveZoom" }] : []));
|
|
99
|
+
this.imgWidth = signal(null, ...(ngDevMode ? [{ debugName: "imgWidth" }] : /* istanbul ignore next */ []));
|
|
100
|
+
this.imgHeight = signal(null, ...(ngDevMode ? [{ debugName: "imgHeight" }] : /* istanbul ignore next */ []));
|
|
101
|
+
this.cropAreaWidth = signal(0, ...(ngDevMode ? [{ debugName: "cropAreaWidth" }] : /* istanbul ignore next */ []));
|
|
102
|
+
this.cropAreaHeight = signal(0, ...(ngDevMode ? [{ debugName: "cropAreaHeight" }] : /* istanbul ignore next */ []));
|
|
103
|
+
this.imageWrapperWidth = signal(0, ...(ngDevMode ? [{ debugName: "imageWrapperWidth" }] : /* istanbul ignore next */ []));
|
|
104
|
+
this.imageWrapperHeight = signal(0, ...(ngDevMode ? [{ debugName: "imageWrapperHeight" }] : /* istanbul ignore next */ []));
|
|
105
|
+
this.offsetX = signal(0, ...(ngDevMode ? [{ debugName: "offsetX" }] : /* istanbul ignore next */ []));
|
|
106
|
+
this.offsetY = signal(0, ...(ngDevMode ? [{ debugName: "offsetY" }] : /* istanbul ignore next */ []));
|
|
107
|
+
this.internalZoom = signal(this.minZoom(), ...(ngDevMode ? [{ debugName: "internalZoom" }] : /* istanbul ignore next */ []));
|
|
108
|
+
this.isDragging = signal(false, ...(ngDevMode ? [{ debugName: "isDragging" }] : /* istanbul ignore next */ []));
|
|
109
|
+
this.descriptionId = signal(`cropper-${Math.random().toString(36).substring(2, 9)}`, ...(ngDevMode ? [{ debugName: "descriptionId" }] : /* istanbul ignore next */ []));
|
|
110
|
+
this.isZoomControlled = computed(() => this.zoom() !== undefined, ...(ngDevMode ? [{ debugName: "isZoomControlled" }] : /* istanbul ignore next */ []));
|
|
111
|
+
this.effectiveZoom = computed(() => (this.isZoomControlled() ? this.zoom() : this.internalZoom()), ...(ngDevMode ? [{ debugName: "effectiveZoom" }] : /* istanbul ignore next */ []));
|
|
112
112
|
this.zoomValueText = computed(() => {
|
|
113
113
|
const zoomPercent = this.effectiveZoom() * 100;
|
|
114
114
|
return `Zoom: ${zoomPercent.toFixed(0)}%`;
|
|
115
|
-
}, ...(ngDevMode ? [{ debugName: "zoomValueText" }] : []));
|
|
115
|
+
}, ...(ngDevMode ? [{ debugName: "zoomValueText" }] : /* istanbul ignore next */ []));
|
|
116
116
|
// Refs
|
|
117
|
-
this.dragStartPoint = signal({ x: 0, y: 0 }, ...(ngDevMode ? [{ debugName: "dragStartPoint" }] : []));
|
|
118
|
-
this.dragStartOffset = signal({ x: 0, y: 0 }, ...(ngDevMode ? [{ debugName: "dragStartOffset" }] : []));
|
|
119
|
-
this.latestRestrictedOffset = signal({ x: 0, y: 0 }, ...(ngDevMode ? [{ debugName: "latestRestrictedOffset" }] : []));
|
|
120
|
-
this.latestZoom = signal(this.minZoom(), ...(ngDevMode ? [{ debugName: "latestZoom" }] : []));
|
|
121
|
-
this.isInitialSetupDone = signal(false, ...(ngDevMode ? [{ debugName: "isInitialSetupDone" }] : []));
|
|
122
|
-
this.initialPinchDistance = signal(0, ...(ngDevMode ? [{ debugName: "initialPinchDistance" }] : []));
|
|
123
|
-
this.initialPinchZoom = signal(1, ...(ngDevMode ? [{ debugName: "initialPinchZoom" }] : []));
|
|
124
|
-
this.isPinching = signal(false, ...(ngDevMode ? [{ debugName: "isPinching" }] : []));
|
|
125
|
-
this.hasWarned = signal(false, ...(ngDevMode ? [{ debugName: "hasWarned" }] : []));
|
|
117
|
+
this.dragStartPoint = signal({ x: 0, y: 0 }, ...(ngDevMode ? [{ debugName: "dragStartPoint" }] : /* istanbul ignore next */ []));
|
|
118
|
+
this.dragStartOffset = signal({ x: 0, y: 0 }, ...(ngDevMode ? [{ debugName: "dragStartOffset" }] : /* istanbul ignore next */ []));
|
|
119
|
+
this.latestRestrictedOffset = signal({ x: 0, y: 0 }, ...(ngDevMode ? [{ debugName: "latestRestrictedOffset" }] : /* istanbul ignore next */ []));
|
|
120
|
+
this.latestZoom = signal(this.minZoom(), ...(ngDevMode ? [{ debugName: "latestZoom" }] : /* istanbul ignore next */ []));
|
|
121
|
+
this.isInitialSetupDone = signal(false, ...(ngDevMode ? [{ debugName: "isInitialSetupDone" }] : /* istanbul ignore next */ []));
|
|
122
|
+
this.initialPinchDistance = signal(0, ...(ngDevMode ? [{ debugName: "initialPinchDistance" }] : /* istanbul ignore next */ []));
|
|
123
|
+
this.initialPinchZoom = signal(1, ...(ngDevMode ? [{ debugName: "initialPinchZoom" }] : /* istanbul ignore next */ []));
|
|
124
|
+
this.isPinching = signal(false, ...(ngDevMode ? [{ debugName: "isPinching" }] : /* istanbul ignore next */ []));
|
|
125
|
+
this.hasWarned = signal(false, ...(ngDevMode ? [{ debugName: "hasWarned" }] : /* istanbul ignore next */ []));
|
|
126
126
|
afterNextRender(() => {
|
|
127
127
|
this.initializeContainerDimensions();
|
|
128
128
|
});
|
|
@@ -545,6 +545,7 @@ class RdxCropperRootDirective {
|
|
|
545
545
|
return;
|
|
546
546
|
let targetOffsetX = this.latestRestrictedOffset().x;
|
|
547
547
|
let targetOffsetY = this.latestRestrictedOffset().y;
|
|
548
|
+
// eslint-disable-next-line no-useless-assignment
|
|
548
549
|
let moved = false;
|
|
549
550
|
switch (e.key) {
|
|
550
551
|
case 'ArrowUp':
|
|
@@ -623,10 +624,10 @@ class RdxCropperRootDirective {
|
|
|
623
624
|
height: `${this.cropAreaHeight()}px`
|
|
624
625
|
};
|
|
625
626
|
}
|
|
626
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
627
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
627
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperRootDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
628
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxCropperRootDirective, isStandalone: true, selector: "[rdxCropperRoot]", inputs: { image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: true, transformFunction: null }, cropPadding: { classPropertyName: "cropPadding", publicName: "cropPadding", isSignal: true, isRequired: false, transformFunction: null }, aspectRatio: { classPropertyName: "aspectRatio", publicName: "aspectRatio", isSignal: true, isRequired: false, transformFunction: null }, minZoom: { classPropertyName: "minZoom", publicName: "minZoom", isSignal: true, isRequired: false, transformFunction: null }, maxZoom: { classPropertyName: "maxZoom", publicName: "maxZoom", isSignal: true, isRequired: false, transformFunction: null }, zoomSensitivity: { classPropertyName: "zoomSensitivity", publicName: "zoomSensitivity", isSignal: true, isRequired: false, transformFunction: null }, keyboardStep: { classPropertyName: "keyboardStep", publicName: "keyboardStep", isSignal: true, isRequired: false, transformFunction: null }, zoom: { classPropertyName: "zoom", publicName: "zoom", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCropChange: "onCropChange", onZoomChange: "onZoomChange" }, host: { attributes: { "tabindex": "0", "role": "application" }, listeners: { "mousedown": "onMouseDown($event)", "keydown": "onKeyDown($event)", "keyup": "onKeyUp($event)" }, properties: { "attr.aria-label": "\"Interactive image cropper\"", "attr.aria-describedby": "descriptionId()", "attr.aria-valuemin": "minZoom()", "attr.aria-valuemax": "maxZoom()", "attr.aria-valuenow": "effectiveZoom()", "attr.aria-valuetext": "zoomValueText()" } }, providers: [provideToken(CROPPER_ROOT_CONTEXT, RdxCropperRootDirective)], ngImport: i0 }); }
|
|
628
629
|
}
|
|
629
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
630
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperRootDirective, decorators: [{
|
|
630
631
|
type: Directive,
|
|
631
632
|
args: [{
|
|
632
633
|
selector: '[rdxCropperRoot]',
|
|
@@ -645,7 +646,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
|
|
|
645
646
|
'(keyup)': 'onKeyUp($event)'
|
|
646
647
|
}
|
|
647
648
|
}]
|
|
648
|
-
}], ctorParameters: () => [] });
|
|
649
|
+
}], ctorParameters: () => [], propDecorators: { image: [{ type: i0.Input, args: [{ isSignal: true, alias: "image", required: true }] }], cropPadding: [{ type: i0.Input, args: [{ isSignal: true, alias: "cropPadding", required: false }] }], aspectRatio: [{ type: i0.Input, args: [{ isSignal: true, alias: "aspectRatio", required: false }] }], minZoom: [{ type: i0.Input, args: [{ isSignal: true, alias: "minZoom", required: false }] }], maxZoom: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxZoom", required: false }] }], zoomSensitivity: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoomSensitivity", required: false }] }], keyboardStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "keyboardStep", required: false }] }], zoom: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoom", required: false }] }], onCropChange: [{ type: i0.Output, args: ["onCropChange"] }], onZoomChange: [{ type: i0.Output, args: ["onZoomChange"] }] } });
|
|
649
650
|
|
|
650
651
|
const _imports = [
|
|
651
652
|
RdxCropperRootDirective,
|
|
@@ -654,17 +655,17 @@ const _imports = [
|
|
|
654
655
|
RdxCropperDescriptionDirective
|
|
655
656
|
];
|
|
656
657
|
class RdxCropperModule {
|
|
657
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
658
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
658
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
659
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperModule, imports: [RdxCropperRootDirective,
|
|
659
660
|
RdxCropperImageComponent,
|
|
660
661
|
RdxCropperCropAreaDirective,
|
|
661
662
|
RdxCropperDescriptionDirective], exports: [RdxCropperRootDirective,
|
|
662
663
|
RdxCropperImageComponent,
|
|
663
664
|
RdxCropperCropAreaDirective,
|
|
664
665
|
RdxCropperDescriptionDirective] }); }
|
|
665
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
666
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperModule }); }
|
|
666
667
|
}
|
|
667
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
668
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxCropperModule, decorators: [{
|
|
668
669
|
type: NgModule,
|
|
669
670
|
args: [{
|
|
670
671
|
imports: [..._imports],
|