cmat 0.0.19 → 0.0.21
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/components/x6-angular-shape/index.d.ts +5 -0
- package/components/x6-angular-shape/node.d.ts +11 -0
- package/components/x6-angular-shape/public-api.d.ts +3 -0
- package/components/x6-angular-shape/registry.d.ts +13 -0
- package/components/x6-angular-shape/view.d.ts +16 -0
- package/fesm2022/cmat-components-adapter.mjs +9 -9
- package/fesm2022/cmat-components-breadcrumb.mjs +9 -9
- package/fesm2022/cmat-components-card.mjs +3 -3
- package/fesm2022/cmat-components-carousel.mjs +12 -12
- package/fesm2022/cmat-components-cascade.mjs +9 -9
- package/fesm2022/cmat-components-chip-input.mjs +3 -3
- package/fesm2022/cmat-components-custom-formly.mjs +87 -87
- package/fesm2022/cmat-components-date-range.mjs +3 -3
- package/fesm2022/cmat-components-drawer.mjs +6 -6
- package/fesm2022/cmat-components-fullscreen.mjs +3 -3
- package/fesm2022/cmat-components-highlight.mjs +6 -6
- package/fesm2022/cmat-components-image-viewer.mjs +3 -3
- package/fesm2022/cmat-components-json-editor.mjs +3 -3
- package/fesm2022/cmat-components-knob-input.mjs +3 -3
- package/fesm2022/cmat-components-masonry.mjs +3 -3
- package/fesm2022/cmat-components-material-color-picker.mjs +3 -3
- package/fesm2022/cmat-components-material-datetimepicker.mjs +42 -42
- package/fesm2022/cmat-components-navigation.mjs +39 -39
- package/fesm2022/cmat-components-opt-input.mjs +3 -3
- package/fesm2022/cmat-components-org-chart.mjs +9 -9
- package/fesm2022/cmat-components-pagination.mjs +12 -12
- package/fesm2022/cmat-components-password-strength.mjs +9 -9
- package/fesm2022/cmat-components-popover.mjs +9 -9
- package/fesm2022/cmat-components-progress-bar.mjs +3 -3
- package/fesm2022/cmat-components-rating.mjs +3 -3
- package/fesm2022/cmat-components-select-search.mjs +11 -11
- package/fesm2022/cmat-components-select-search.mjs.map +1 -1
- package/fesm2022/cmat-components-select-table.mjs +3 -3
- package/fesm2022/cmat-components-select-tree.mjs +3 -3
- package/fesm2022/cmat-components-speed-dial.mjs +9 -9
- package/fesm2022/cmat-components-timeline.mjs +12 -12
- package/fesm2022/cmat-components-toast.mjs +9 -9
- package/fesm2022/cmat-components-transfer-picker.mjs +18 -18
- package/fesm2022/cmat-components-treetable.mjs +6 -6
- package/fesm2022/cmat-components-upload.mjs +9 -9
- package/fesm2022/cmat-components-x6-angular-shape.mjs +183 -0
- package/fesm2022/cmat-components-x6-angular-shape.mjs.map +1 -0
- package/fesm2022/cmat-directives-animate-on-scroll.mjs +6 -6
- package/fesm2022/cmat-directives-arrow-cursor.mjs +3 -3
- package/fesm2022/cmat-directives-autofocus.mjs +3 -3
- package/fesm2022/cmat-directives-data-exporter.mjs +21 -21
- package/fesm2022/cmat-directives-debounce.mjs +9 -9
- package/fesm2022/cmat-directives-digit-only.mjs +6 -6
- package/fesm2022/cmat-directives-equal-validator.mjs +3 -3
- package/fesm2022/cmat-lib-mock-api.mjs +6 -6
- package/fesm2022/cmat-pipes-bytes.mjs +3 -3
- package/fesm2022/cmat-pipes-date-format.mjs +3 -3
- package/fesm2022/cmat-pipes-find-by-key.mjs +3 -3
- package/fesm2022/cmat-pipes-group-by.mjs +3 -3
- package/fesm2022/cmat-pipes-keys.mjs +3 -3
- package/fesm2022/cmat-pipes-secure.mjs +3 -3
- package/fesm2022/cmat-pipes-uppercase.mjs +3 -3
- package/fesm2022/cmat-services-alert.mjs +3 -3
- package/fesm2022/cmat-services-config.mjs +6 -6
- package/fesm2022/cmat-services-confirmation.mjs +6 -6
- package/fesm2022/cmat-services-data.mjs +3 -3
- package/fesm2022/cmat-services-export-as.mjs +3 -3
- package/fesm2022/cmat-services-loading.mjs +6 -6
- package/fesm2022/cmat-services-local-storage.mjs +3 -3
- package/fesm2022/cmat-services-media-watcher.mjs +3 -3
- package/fesm2022/cmat-services-platform.mjs +3 -3
- package/fesm2022/cmat-services-splash-screen.mjs +3 -3
- package/fesm2022/cmat-services-title.mjs +3 -3
- package/fesm2022/cmat-services-translation.mjs +3 -3
- package/fesm2022/cmat-services-utils.mjs +3 -3
- package/package.json +35 -31
|
@@ -511,8 +511,8 @@ class CmatDateRangeComponent {
|
|
|
511
511
|
// If meridiem doesn't exist, create a moment using 24-hours format and return in
|
|
512
512
|
return dayjs(value, 'HH:mm').second(0);
|
|
513
513
|
}
|
|
514
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
515
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
514
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatDateRangeComponent, deps: [{ token: i1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
515
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.1", type: CmatDateRangeComponent, isStandalone: true, selector: "cmat-date-range", inputs: { readonly: "readonly", dateFormat: "dateFormat", timeFormat: "timeFormat", timeRange: "timeRange", range: "range" }, outputs: { rangeChanged: "rangeChanged" }, providers: [
|
|
516
516
|
{
|
|
517
517
|
provide: NG_VALUE_ACCESSOR,
|
|
518
518
|
useExisting: forwardRef(() => CmatDateRangeComponent),
|
|
@@ -520,7 +520,7 @@ class CmatDateRangeComponent {
|
|
|
520
520
|
}
|
|
521
521
|
], viewQueries: [{ propertyName: "_matMonthView1", first: true, predicate: ["matMonthView1"], descendants: true }, { propertyName: "_matMonthView2", first: true, predicate: ["matMonthView2"], descendants: true }, { propertyName: "_pickerPanelOrigin", first: true, predicate: ["pickerPanelOrigin"], descendants: true, read: ElementRef }, { propertyName: "_pickerPanel", first: true, predicate: ["pickerPanel"], descendants: true }], exportAs: ["cmatDateRange"], ngImport: i0, template: "<div #pickerPanelOrigin role=\"presentation\" class=\"range\" (click)=\"openPickerPanel()\">\r\n\r\n <div class=\"start\">\r\n <div class=\"date\">{{range.startDate}}</div>\r\n @if (range.startTime) {\r\n <div class=\"time\">{{range.startTime}}</div>\r\n }\r\n </div>\r\n\r\n <div class=\"separator\">-</div>\r\n\r\n <div class=\"end\">\r\n <div class=\"date\">{{range.endDate}}</div>\r\n @if (range.endTime) {\r\n <div class=\"time\">{{range.endTime}}</div>\r\n }\r\n </div>\r\n\r\n</div>\r\n\r\n<ng-template #pickerPanel>\r\n\r\n <!-- Start -->\r\n <div class=\"start\">\r\n\r\n <div class=\"month\">\r\n <div class=\"month-header\">\r\n <button type=\"button\" class=\"previous-button\" mat-icon-button tabindex=\"1\" (click)=\"prev()\">\r\n <mat-icon [svgIcon]=\"'heroicons_outline:chevron-left'\"></mat-icon>\r\n </button>\r\n <div class=\"month-label\">{{getMonthLabel(1)}}</div>\r\n </div>\r\n <mat-month-view #matMonthView1 [dateFilter]=\"dateFilter()\" [dateClass]=\"dateClass()\"\r\n [(activeDate)]=\"activeDates.month1\" (click)=\"$event.stopImmediatePropagation()\"\r\n (selectedChange)=\"onSelectedDateChange($event)\">\r\n </mat-month-view>\r\n </div>\r\n\r\n @if (timeRange) {\r\n <mat-form-field class=\"time start-time\">\r\n <input matInput tabindex=\"3\" [autocomplete]=\"'off'\" [formControl]=\"startTimeFormControl\"\r\n (blur)=\"updateStartTime($event)\">\r\n <mat-label>\u5F00\u59CB\u65F6\u95F4</mat-label>\r\n </mat-form-field>\r\n }\r\n\r\n </div>\r\n\r\n <!-- End -->\r\n <div class=\"end\">\r\n\r\n <div class=\"month\">\r\n <div class=\"month-header\">\r\n <div class=\"month-label\">{{getMonthLabel(2)}}</div>\r\n <button type=\"button\" class=\"next-button\" mat-icon-button tabindex=\"2\" (click)=\"next()\">\r\n <mat-icon [svgIcon]=\"'heroicons_outline:chevron-right'\"></mat-icon>\r\n </button>\r\n </div>\r\n <mat-month-view #matMonthView2 [dateFilter]=\"dateFilter()\" [dateClass]=\"dateClass()\"\r\n [(activeDate)]=\"activeDates.month2\" (click)=\"$event.stopImmediatePropagation()\"\r\n (selectedChange)=\"onSelectedDateChange($event)\">\r\n </mat-month-view>\r\n </div>\r\n\r\n @if (timeRange) {\r\n <mat-form-field class=\"time end-time\">\r\n <input matInput tabindex=\"4\" [formControl]=\"endTimeFormControl\" (blur)=\"updateEndTime($event)\">\r\n <mat-label>\u7ED3\u675F\u65F6\u95F4</mat-label>\r\n </mat-form-field>\r\n }\r\n\r\n </div>\r\n\r\n </ng-template>", styles: ["cmat-date-range{display:flex}cmat-date-range .range{display:flex;width:100%;align-items:center;height:48px;min-height:48px;max-height:48px;cursor:pointer}cmat-date-range .range .start,cmat-date-range .range .end{display:flex;align-items:center;height:100%;padding:0 16px;border-radius:6px;border-width:1px;line-height:1}cmat-date-range .range .date{white-space:nowrap}cmat-date-range .range .date+.time{margin-left:8px}cmat-date-range .range .time{white-space:nowrap}cmat-date-range .separator{margin:0 8px}.cmat-date-range-panel{border-radius:4px;padding:24px}.cmat-date-range-panel .start,.cmat-date-range-panel .end{display:flex;flex-direction:column}.cmat-date-range-panel .start .month,.cmat-date-range-panel .end .month{max-width:196px;min-width:196px;width:196px}.cmat-date-range-panel .start .month .month-header,.cmat-date-range-panel .end .month .month-header{position:relative;display:flex;align-items:center;justify-content:center;height:32px;margin-bottom:16px}.cmat-date-range-panel .start .month .month-header .previous-button,.cmat-date-range-panel .start .month .month-header .next-button,.cmat-date-range-panel .end .month .month-header .previous-button,.cmat-date-range-panel .end .month .month-header .next-button{position:absolute;width:24px!important;height:24px!important;min-height:24px!important;max-height:24px!important;line-height:24px!important}.cmat-date-range-panel .start .month .month-header .previous-button,.cmat-date-range-panel .end .month .month-header .previous-button{left:0}.cmat-date-range-panel .start .month .month-header .next-button,.cmat-date-range-panel .end .month .month-header .next-button{right:0}.cmat-date-range-panel .start .month .month-header .month-label,.cmat-date-range-panel .end .month .month-header .month-label{font-weight:500}.cmat-date-range-panel .start .month mat-month-view,.cmat-date-range-panel .end .month mat-month-view{display:flex;min-height:188px}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table{width:100%;border-collapse:collapse}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody tr[aria-hidden=true],.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody tr[aria-hidden=true]{display:none!important}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody tr:first-child td:first-child[aria-hidden=true],.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody tr:first-child td:first-child[aria-hidden=true]{visibility:hidden;pointer-events:none;opacity:0}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody tr td .mat-calendar-body-cell-content,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody tr td .mat-calendar-body-cell-content{background-color:transparent!important}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-today,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-today{border:none!important}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell{width:28px!important;height:28px!important;padding:2px!important}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell.cmat-date-range:before,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell.cmat-date-range:before{content:\"\";position:absolute;inset:2px 0}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell.cmat-date-range.cmat-date-range-start:before,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell.cmat-date-range.cmat-date-range-start:before{border-radius:999px 0 0 999px}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell.cmat-date-range.cmat-date-range-start.cmat-date-range-end:before,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell.cmat-date-range.cmat-date-range-start.cmat-date-range-end:before{right:2px;border-radius:999px}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell.cmat-date-range.cmat-date-range-end:before,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell.cmat-date-range.cmat-date-range-end:before{border-radius:0 999px 999px 0}.cmat-date-range-panel .start .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell .mat-calendar-body-cell-content,.cmat-date-range-panel .end .month mat-month-view .mat-calendar-table tbody .mat-calendar-body-cell .mat-calendar-body-cell-content{position:relative;top:0;left:0;width:24px;height:24px;font-size:12px}.cmat-date-range-panel .time{width:100%;max-width:196px}.cmat-date-range-panel .start{align-items:flex-start;margin-right:20px}.cmat-date-range-panel .start .month .month-label{margin-left:8px}.cmat-date-range-panel .end{align-items:flex-end;margin-left:20px}.cmat-date-range-panel .end .month .month-label{margin-right:8px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i5.MatMonthView, selector: "mat-month-view", inputs: ["activeDate", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName", "activeDrag"], outputs: ["selectedChange", "_userSelection", "dragStarted", "dragEnded", "activeDateChange"], exportAs: ["matMonthView"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
522
522
|
}
|
|
523
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
523
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatDateRangeComponent, decorators: [{
|
|
524
524
|
type: Component,
|
|
525
525
|
args: [{ selector: 'cmat-date-range', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatDateRange', providers: [
|
|
526
526
|
{
|
|
@@ -34,10 +34,10 @@ class CmatDrawerService {
|
|
|
34
34
|
getComponent(name) {
|
|
35
35
|
return this._componentRegistry.get(name);
|
|
36
36
|
}
|
|
37
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
38
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.
|
|
37
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatDrawerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
38
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatDrawerService, providedIn: 'root' }); }
|
|
39
39
|
}
|
|
40
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
40
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatDrawerService, decorators: [{
|
|
41
41
|
type: Injectable,
|
|
42
42
|
args: [{
|
|
43
43
|
providedIn: 'root'
|
|
@@ -298,10 +298,10 @@ class CmatDrawerComponent {
|
|
|
298
298
|
// Execute the observable
|
|
299
299
|
this.openedChanged.next(open);
|
|
300
300
|
}
|
|
301
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
302
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
301
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatDrawerComponent, deps: [{ token: i1.AnimationBuilder }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: CmatDrawerService }, { token: i3.CmatUtilsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
302
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.1", type: CmatDrawerComponent, isStandalone: true, selector: "cmat-drawer", inputs: { fixed: "fixed", mode: "mode", name: "name", opened: "opened", position: "position", transparentOverlay: "transparentOverlay" }, outputs: { fixedChanged: "fixedChanged", modeChanged: "modeChanged", openedChanged: "openedChanged", positionChanged: "positionChanged" }, host: { listeners: { "mouseenter": "onMouseenter()", "mouseleave": "onMouseleave()" }, properties: { "class": "this.classList", "style": "this.styleList" } }, exportAs: ["cmatDrawer"], usesOnChanges: true, ngImport: i0, template: "<div class=\"cmat-drawer-content\">\r\n <ng-content></ng-content>\r\n</div>", styles: ["cmat-drawer{position:relative;display:flex;flex-direction:column;flex:1 1 auto;width:320px;min-width:320px;max-width:320px;z-index:300;box-shadow:0 2px 8px #00000059}cmat-drawer.cmat-drawer-animations-enabled{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:visibility,margin-left,margin-right,transform,width,max-width,min-width}cmat-drawer.cmat-drawer-animations-enabled .cmat-drawer-content{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:width,max-width,min-width}cmat-drawer.cmat-drawer-mode-over{position:absolute;top:0;bottom:0}cmat-drawer.cmat-drawer-mode-over.cmat-drawer-fixed{position:fixed}cmat-drawer.cmat-drawer-position-left.cmat-drawer-mode-side{margin-left:-320px}cmat-drawer.cmat-drawer-position-left.cmat-drawer-mode-side.cmat-drawer-opened{margin-left:0}cmat-drawer.cmat-drawer-position-left.cmat-drawer-mode-over{left:0;transform:translate3d(-100%,0,0)}cmat-drawer.cmat-drawer-position-left.cmat-drawer-mode-over.cmat-drawer-opened{transform:translateZ(0)}cmat-drawer.cmat-drawer-position-left .cmat-drawer-content{left:0}cmat-drawer.cmat-drawer-position-right.cmat-drawer-mode-side{margin-right:-320px}cmat-drawer.cmat-drawer-position-right.cmat-drawer-mode-side.cmat-drawer-opened{margin-right:0}cmat-drawer.cmat-drawer-position-right.cmat-drawer-mode-over{right:0;transform:translate3d(100%,0,0)}cmat-drawer.cmat-drawer-position-right.cmat-drawer-mode-over.cmat-drawer-opened{transform:translateZ(0)}cmat-drawer.cmat-drawer-position-right .cmat-drawer-content{right:0}cmat-drawer .cmat-drawer-content{position:absolute;display:flex;flex:1 1 auto;top:0;bottom:0;width:100%;height:100%;overflow:hidden}.cmat-drawer-overlay{position:absolute;inset:0;z-index:299;opacity:1;background-color:#0009}.cmat-drawer-overlay.cmat-drawer-overlay-fixed{position:fixed}.cmat-drawer-overlay.cmat-drawer-overlay-transparent{background-color:transparent}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
303
303
|
}
|
|
304
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
304
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatDrawerComponent, decorators: [{
|
|
305
305
|
type: Component,
|
|
306
306
|
args: [{ selector: 'cmat-drawer', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatDrawer', standalone: true, template: "<div class=\"cmat-drawer-content\">\r\n <ng-content></ng-content>\r\n</div>", styles: ["cmat-drawer{position:relative;display:flex;flex-direction:column;flex:1 1 auto;width:320px;min-width:320px;max-width:320px;z-index:300;box-shadow:0 2px 8px #00000059}cmat-drawer.cmat-drawer-animations-enabled{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:visibility,margin-left,margin-right,transform,width,max-width,min-width}cmat-drawer.cmat-drawer-animations-enabled .cmat-drawer-content{transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);transition-property:width,max-width,min-width}cmat-drawer.cmat-drawer-mode-over{position:absolute;top:0;bottom:0}cmat-drawer.cmat-drawer-mode-over.cmat-drawer-fixed{position:fixed}cmat-drawer.cmat-drawer-position-left.cmat-drawer-mode-side{margin-left:-320px}cmat-drawer.cmat-drawer-position-left.cmat-drawer-mode-side.cmat-drawer-opened{margin-left:0}cmat-drawer.cmat-drawer-position-left.cmat-drawer-mode-over{left:0;transform:translate3d(-100%,0,0)}cmat-drawer.cmat-drawer-position-left.cmat-drawer-mode-over.cmat-drawer-opened{transform:translateZ(0)}cmat-drawer.cmat-drawer-position-left .cmat-drawer-content{left:0}cmat-drawer.cmat-drawer-position-right.cmat-drawer-mode-side{margin-right:-320px}cmat-drawer.cmat-drawer-position-right.cmat-drawer-mode-side.cmat-drawer-opened{margin-right:0}cmat-drawer.cmat-drawer-position-right.cmat-drawer-mode-over{right:0;transform:translate3d(100%,0,0)}cmat-drawer.cmat-drawer-position-right.cmat-drawer-mode-over.cmat-drawer-opened{transform:translateZ(0)}cmat-drawer.cmat-drawer-position-right .cmat-drawer-content{right:0}cmat-drawer .cmat-drawer-content{position:absolute;display:flex;flex:1 1 auto;top:0;bottom:0;width:100%;height:100%;overflow:hidden}.cmat-drawer-overlay{position:absolute;inset:0;z-index:299;opacity:1;background-color:#0009}.cmat-drawer-overlay.cmat-drawer-overlay-fixed{position:fixed}.cmat-drawer-overlay.cmat-drawer-overlay-transparent{background-color:transparent}\n"] }]
|
|
307
307
|
}], ctorParameters: () => [{ type: i1.AnimationBuilder }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: CmatDrawerService }, { type: i3.CmatUtilsService }], propDecorators: { fixed: [{
|
|
@@ -28,10 +28,10 @@ class CmatFullscreenComponent {
|
|
|
28
28
|
});
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
32
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
31
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatFullscreenComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
32
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.1", type: CmatFullscreenComponent, isStandalone: true, selector: "cmat-fullscreen", inputs: { iconTpl: "iconTpl", tooltip: "tooltip" }, exportAs: ["cmatFullscreen"], ngImport: i0, template: "<!-- Button -->\r\n<button type=\"button\" mat-icon-button [matTooltip]=\"tooltip || '\u5207\u6362\u5168\u5C4F'\" (click)=\"toggleFullscreen()\">\r\n <ng-container [ngTemplateOutlet]=\"iconTpl || defaultIconTpl\"></ng-container>\r\n</button>\r\n\r\n<!-- Default icon -->\r\n<ng-template #defaultIconTpl>\r\n <mat-icon [svgIcon]=\"'heroicons_outline:arrows-pointing-out'\"></mat-icon>\r\n</ng-template>", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
33
33
|
}
|
|
34
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
34
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatFullscreenComponent, decorators: [{
|
|
35
35
|
type: Component,
|
|
36
36
|
args: [{ selector: 'cmat-fullscreen', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatFullscreen', imports: [MatButtonModule, MatTooltipModule, NgTemplateOutlet, MatIconModule], template: "<!-- Button -->\r\n<button type=\"button\" mat-icon-button [matTooltip]=\"tooltip || '\u5207\u6362\u5168\u5C4F'\" (click)=\"toggleFullscreen()\">\r\n <ng-container [ngTemplateOutlet]=\"iconTpl || defaultIconTpl\"></ng-container>\r\n</button>\r\n\r\n<!-- Default icon -->\r\n<ng-template #defaultIconTpl>\r\n <mat-icon [svgIcon]=\"'heroicons_outline:arrows-pointing-out'\"></mat-icon>\r\n</ng-template>" }]
|
|
37
37
|
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
@@ -38,10 +38,10 @@ class CmatHighlightService {
|
|
|
38
38
|
// indentation, join them together and return it
|
|
39
39
|
return lines.map(line => line.substring(indentation)).join('\n');
|
|
40
40
|
}
|
|
41
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
42
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.
|
|
41
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatHighlightService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
42
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatHighlightService, providedIn: 'root' }); }
|
|
43
43
|
}
|
|
44
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
44
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatHighlightService, decorators: [{
|
|
45
45
|
type: Injectable,
|
|
46
46
|
args: [{
|
|
47
47
|
providedIn: 'root'
|
|
@@ -108,10 +108,10 @@ class CmatHighlightComponent {
|
|
|
108
108
|
// Detect the changes
|
|
109
109
|
this._viewRef.detectChanges();
|
|
110
110
|
}
|
|
111
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
112
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
111
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatHighlightComponent, deps: [{ token: i1.DomSanitizer }, { token: i0.ElementRef }, { token: CmatHighlightService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
112
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.1", type: CmatHighlightComponent, isStandalone: true, selector: "textarea[cmat-highlight]", inputs: { code: "code", lang: "lang" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["cmatHighlight"], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\r\n\r\n<ng-template let-highlightedCode=\"highlightedCode\" let-lang=\"lang\">\r\n <div class=\"cmat-highlight cmat-highlight-code-container\">\r\n <pre [ngClass]=\"'language-' + lang\"><code [ngClass]=\"'language-' + lang\" [innerHTML]=\"highlightedCode\"></code>\r\n </pre>\r\n </div>\r\n</ng-template>", styles: ["textarea[cmat-highlight]{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
113
113
|
}
|
|
114
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
114
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatHighlightComponent, decorators: [{
|
|
115
115
|
type: Component,
|
|
116
116
|
args: [{ selector: 'textarea[cmat-highlight]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatHighlight', imports: [NgClass], template: "<ng-content></ng-content>\r\n\r\n<ng-template let-highlightedCode=\"highlightedCode\" let-lang=\"lang\">\r\n <div class=\"cmat-highlight cmat-highlight-code-container\">\r\n <pre [ngClass]=\"'language-' + lang\"><code [ngClass]=\"'language-' + lang\" [innerHTML]=\"highlightedCode\"></code>\r\n </pre>\r\n </div>\r\n</ng-template>", styles: ["textarea[cmat-highlight]{display:none}\n"] }]
|
|
117
117
|
}], ctorParameters: () => [{ type: i1.DomSanitizer }, { type: i0.ElementRef }, { type: CmatHighlightService }, { type: i0.ViewContainerRef }], propDecorators: { code: [{
|
|
@@ -153,15 +153,15 @@ class CmatImageComponent {
|
|
|
153
153
|
imageError(event) {
|
|
154
154
|
this.imageErrorEvent.emit(event);
|
|
155
155
|
}
|
|
156
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
157
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
156
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatImageComponent, deps: [{ token: DOCUMENT }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
157
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.1", type: CmatImageComponent, isStandalone: true, selector: "cmat-image", inputs: { imageClass: "imageClass", imageStyle: "imageStyle", src: "src", srcSet: "srcSet", previewImageSrc: "previewImageSrc", previewImageSrcSet: "previewImageSrcSet", alt: "alt", width: "width", height: "height", loading: "loading", appendTo: "appendTo", preview: ["preview", "preview", booleanAttribute], showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { previewShowChange: "previewShowChange", imageErrorEvent: "imageErrorEvent" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "mask", first: true, predicate: ["mask"], descendants: true }, { propertyName: "previewButton", first: true, predicate: ["previewButton"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], ngImport: i0, template: "<span [ngClass]=\"{ 'cmat-image-preview-container ': preview }\">\r\n <img [attr.src]=\"src\" [attr.srcset]=\"srcSet\" [attr.alt]=\"alt\" [attr.width]=\"width\" [attr.height]=\"height\"\r\n [attr.loading]=\"loading\" [ngStyle]=\"imageStyle\" [class]=\"imageClass\" (error)=\"imageError($event)\" />\r\n @if(preview){\r\n <div class=\"cmat-image-preview-indicator\" role=\"presentation\" (click)=\"onImageClick()\">\r\n <button #previewButton mat-icon-button>\r\n <mat-icon class=\"text-white\" [svgIcon]=\"'heroicons_solid:eye'\"></mat-icon>\r\n </button>\r\n </div>\r\n }\r\n\r\n @if(maskVisible){\r\n <div #mask class=\"cmat-image-mask image-overlay image-overlay-enter\" role=\"dialog\" [attr.aria-modal]=\"maskVisible\"\r\n (click)=\"closePreview()\" (keydown)=\"onMaskKeydown($event)\">\r\n <div class=\"cmat-image-toolbar\" role=\"presentation\" (click)=\"handleToolbarClick($event)\">\r\n <button mat-icon-button (click)=\"rotateRight()\">\r\n <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_right'\"></mat-icon>\r\n </button>\r\n <button mat-icon-button (click)=\"rotateLeft()\">\r\n <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_left'\"></mat-icon>\r\n </button>\r\n <button mat-icon-button [disabled]=\"isZoomOutDisabled\" (click)=\"zoomOut()\">\r\n <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_out'\"></mat-icon>\r\n </button>\r\n <button mat-icon-button [disabled]=\"isZoomInDisabled\" (click)=\"zoomIn()\">\r\n <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_in'\"></mat-icon>\r\n </button>\r\n <button #closeButton mat-icon-button (click)=\"closePreview()\">\r\n <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:close'\"></mat-icon>\r\n </button>\r\n </div>\r\n @if(previewVisible){\r\n <div role=\"presentation\"\r\n [@animation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n (@animation.start)=\"onAnimationStart($event)\" (@animation.done)=\"onAnimationEnd($event)\"\r\n (click)=\"onPreviewImageClick($event)\">\r\n <img class=\"cmat-image-preview\" alt=\"image\" [attr.src]=\"previewImageSrc ? previewImageSrc : src\"\r\n [attr.srcset]=\"previewImageSrcSet\" [ngStyle]=\"imagePreviewStyle()\" />\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n</span>", styles: ["cmat-image .cmat-image-mask{display:flex;align-items:center;justify-content:center}cmat-image .cmat-image-preview-container{position:relative;display:inline-block;line-height:0}cmat-image .cmat-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}cmat-image .cmat-image-preview-container:hover>.cmat-image-preview-indicator{opacity:1;cursor:pointer;background-color:#00000080}cmat-image .cmat-image-preview-container>img{cursor:pointer}cmat-image .cmat-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1;padding:.5rem}cmat-image .cmat-image-preview{transition:transform .15s;max-width:100vw;max-height:100vh}cmat-image .image-overlay{background-color:#0006;transition-duration:.2s;position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:99}cmat-image .image-overlay-enter{animation:image-overlay-enter-animation .15s forwards}cmat-image .image-overlay-leave{animation:image-overlay-leave-animation .15s forwards}@keyframes image-overlay-enter-animation{0%{background-color:transparent}to{background-color:#000000e6}}@keyframes image-overlay-leave-animation{0%{background-color:#000000e6}to{background-color:transparent}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], animations: [
|
|
158
158
|
trigger('animation', [
|
|
159
159
|
transition('void => visible', [style({ transform: 'scale(0.7)', opacity: 0 }), animate('{{showTransitionParams}}')]),
|
|
160
160
|
transition('visible => void', [animate('{{hideTransitionParams}}', style({ transform: 'scale(0.7)', opacity: 0 }))])
|
|
161
161
|
])
|
|
162
162
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
163
163
|
}
|
|
164
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
164
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatImageComponent, decorators: [{
|
|
165
165
|
type: Component,
|
|
166
166
|
args: [{ selector: 'cmat-image', animations: [
|
|
167
167
|
trigger('animation', [
|
|
@@ -156,10 +156,10 @@ class CmatJsonEditorComponent {
|
|
|
156
156
|
this.pathChanged.emit(st);
|
|
157
157
|
}
|
|
158
158
|
}
|
|
159
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
160
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
159
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatJsonEditorComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
160
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.1", type: CmatJsonEditorComponent, isStandalone: true, selector: "cmat-json-editor", inputs: { options: "options", data: "data" }, outputs: { contentChanged: "contentChanged", pathChanged: "pathChanged" }, viewQueries: [{ propertyName: "jsonEditorContainer", first: true, predicate: ["jsonEditorContainer"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: '<div class="cmat-jsoneditor" [id]="id" #jsonEditorContainer></div>', isInline: true, styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
161
161
|
}
|
|
162
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
162
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatJsonEditorComponent, decorators: [{
|
|
163
163
|
type: Component,
|
|
164
164
|
args: [{ selector: 'cmat-json-editor', template: '<div class="cmat-jsoneditor" [id]="id" #jsonEditorContainer></div>', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [], styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}\n"] }]
|
|
165
165
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { jsonEditorContainer: [{
|
|
@@ -322,12 +322,12 @@ class CmatKnobInputComponent {
|
|
|
322
322
|
valueToDisplay() {
|
|
323
323
|
return this.valueTemplate.replace('{value}', this.value.toString());
|
|
324
324
|
}
|
|
325
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
326
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
325
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatKnobInputComponent, deps: [{ token: i1.NgControl, optional: true, self: true }, { token: DOCUMENT }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
326
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.1", type: CmatKnobInputComponent, isStandalone: true, selector: "cmat-knob-input", inputs: { id: "id", valueColor: "valueColor", rangeColor: "rangeColor", textColor: "textColor", valueTemplate: "valueTemplate", name: "name", size: "size", step: "step", min: "min", max: "max", strokeWidth: "strokeWidth", showValue: "showValue", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "keydown": "onKeyDown($event)", "mousedown": "onMouseDown($event)", "mouseup": "onMouseUp($event)", "touchstart": "onTouchStart($event)", "touchend": "onTouchEnd($event)" }, properties: { "attr.id": "this.id" } }, providers: [
|
|
327
327
|
{ provide: MatFormFieldControl, useExisting: CmatKnobInputComponent }
|
|
328
328
|
], viewQueries: [{ propertyName: "_knobElementRef", first: true, predicate: ["knob"], descendants: true }], exportAs: ["cmatKnobInput"], ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\r\n<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n<div #knob [class.cmat-knob-disabled]=\"disabled\" (focusin)=\"onFocusIn()\" (focusout)=\"onFocusOut($event)\">\r\n <svg viewBox=\"0 0 100 100\" role=\"slider\" [style.width]=\"size + 'px'\" [style.height]=\"size + 'px'\"\r\n [attr.aria-valuemin]=\"min\" [attr.aria-valuemax]=\"max\" [attr.aria-valuenow]=\"value\"\r\n [attr.tabindex]=\"disabled ? -1 : 0\" (click)=\"onClick($event)\">\r\n <path class=\"knob-range\" [attr.d]=\"rangePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"rangeColor\">\r\n </path>\r\n <path class=\"knob-value\" [attr.d]=\"valuePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"valueColor\">\r\n </path>\r\n @if(showValue){\r\n <text text-anchor=\"middle\" class=\"knob-text\" [attr.x]=\"50\" [attr.y]=\"57\" [attr.fill]=\"textColor\"\r\n [attr.name]=\"name\">{{ valueToDisplay() }}</text>\r\n }\r\n </svg>\r\n</div>", styles: ["cmat-knob-input .knob-range{fill:none;transition:stroke .1s ease-in}cmat-knob-input .knob-value{animation-name:dash-frame;animation-fill-mode:forwards;fill:none}cmat-knob-input .knob-text{font-size:1.3rem;text-align:center}cmat-knob-input .cmat-knob-disabled{opacity:.6}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
329
329
|
}
|
|
330
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
330
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatKnobInputComponent, decorators: [{
|
|
331
331
|
type: Component,
|
|
332
332
|
args: [{ selector: 'cmat-knob-input', providers: [
|
|
333
333
|
{ provide: MatFormFieldControl, useExisting: CmatKnobInputComponent }
|
|
@@ -37,10 +37,10 @@ class CmatMasonryComponent {
|
|
|
37
37
|
this.distributedColumns[i % this.columns].items.push(this.items[i]);
|
|
38
38
|
}
|
|
39
39
|
}
|
|
40
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
41
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
40
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatMasonryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
41
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.1", type: CmatMasonryComponent, isStandalone: true, selector: "cmat-masonry", inputs: { columnsTemplate: "columnsTemplate", columns: "columns", items: "items" }, exportAs: ["cmatMasonry"], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex p-2\">\r\n <ng-container *ngTemplateOutlet=\"columnsTemplate; context: { $implicit: distributedColumns }\"></ng-container>\r\n</div>", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: cmatAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
42
42
|
}
|
|
43
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatMasonryComponent, decorators: [{
|
|
44
44
|
type: Component,
|
|
45
45
|
args: [{ selector: 'cmat-masonry', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: cmatAnimations, exportAs: 'cmatMasonry', imports: [NgTemplateOutlet], template: "<div class=\"flex p-2\">\r\n <ng-container *ngTemplateOutlet=\"columnsTemplate; context: { $implicit: distributedColumns }\"></ng-container>\r\n</div>" }]
|
|
46
46
|
}], propDecorators: { columnsTemplate: [{
|
|
@@ -142,10 +142,10 @@ class CmatMaterialColorPickerComponent {
|
|
|
142
142
|
this.view = 'hues';
|
|
143
143
|
}
|
|
144
144
|
}
|
|
145
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
146
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
145
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatMaterialColorPickerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
146
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.1", type: CmatMaterialColorPickerComponent, isStandalone: true, selector: "cmat-material-color-picker", inputs: { color: "color", title: "title", readonly: "readonly" }, outputs: { colorChanged: "colorChanged" }, providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR], exportAs: ["cmatMaterialColorPicker"], ngImport: i0, template: "<div class=\"rounded\" [ngClass]=\"selectedColor.color\">\r\n <mat-select value=\"init\" panelClass=\"min-w-64\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n <mat-select-trigger class=\"flex p-1\">\r\n <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n </mat-select-trigger>\r\n\r\n <header class=\"shadow flex flex-row content-between justify-between p-2\" [ngClass]=\"'accent'\">\r\n <button type=\"button\" mat-icon-button class=\"secondary-text\" aria-label=\"\u8C03\u8272\u677F\"\r\n [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n </button>\r\n <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n <button type=\"button\" mat-icon-button class=\"remove-color-button secondary-text\" aria-label=\"\u79FB\u9664\u989C\u8272\"\r\n matTooltip=\"\u79FB\u9664\u989C\u8272\" (click)=\"removeColor()\">\r\n <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n </button>\r\n </header>\r\n\r\n <div class=\"flex flex-wrap w-60 m-2\">\r\n <mat-option value=\"init\" class=\"hidden\">\u521D\u59CB\u5316</mat-option>\r\n <div>\r\n @switch (view) {\r\n @case ('palettes') {\r\n <div>\r\n <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n @for (palette of palettes; track $index) {\r\n <div role=\"presentation\"\r\n class=\"cursor-pointer\" (click)=\"selectPalette(palette)\">\r\n <mat-option\r\n class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent hover:opacity-50\"\r\n [value]=\"selectedPalette\">\r\n @if (selectedColor.color===palette + '-' + selectedHue) {\r\n <mat-icon class=\"absolute m-3 text-white\"\r\n [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n }\r\n <span class=\"flex w-10 h-10 m-1 rounded-full\"\r\n [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n </mat-option>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @case ('hues') {\r\n <div>\r\n <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n @for (hue of hues; track $index) {\r\n <div role=\"presentation\" class=\"cursor-pointer\"\r\n (click)=\"selectHue(hue)\">\r\n <mat-option\r\n class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent hover:opacity-50\"\r\n [value]=\"selectedHue\">\r\n @if (selectedColor.color===selectedPalette + '-' + hue) {\r\n <mat-icon class=\"absolute m-3 text-white\"\r\n [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n }\r\n <span class=\"flex w-10 h-10 m-1 rounded-full\"\r\n [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n </mat-option>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n </mat-select>\r\n</div>", styles: ["cmat-material-color-picker .mat-mdc-select-arrow-wrapper{display:none!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], animations: cmatAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
147
147
|
}
|
|
148
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
148
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: CmatMaterialColorPickerComponent, decorators: [{
|
|
149
149
|
type: Component,
|
|
150
150
|
args: [{ selector: 'cmat-material-color-picker', animations: cmatAnimations, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatMaterialColorPicker', providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR], imports: [NgClass, MatSelectModule, MatIconModule, MatButtonModule, MatTooltipModule], template: "<div class=\"rounded\" [ngClass]=\"selectedColor.color\">\r\n <mat-select value=\"init\" panelClass=\"min-w-64\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n <mat-select-trigger class=\"flex p-1\">\r\n <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n </mat-select-trigger>\r\n\r\n <header class=\"shadow flex flex-row content-between justify-between p-2\" [ngClass]=\"'accent'\">\r\n <button type=\"button\" mat-icon-button class=\"secondary-text\" aria-label=\"\u8C03\u8272\u677F\"\r\n [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n </button>\r\n <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n <button type=\"button\" mat-icon-button class=\"remove-color-button secondary-text\" aria-label=\"\u79FB\u9664\u989C\u8272\"\r\n matTooltip=\"\u79FB\u9664\u989C\u8272\" (click)=\"removeColor()\">\r\n <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n </button>\r\n </header>\r\n\r\n <div class=\"flex flex-wrap w-60 m-2\">\r\n <mat-option value=\"init\" class=\"hidden\">\u521D\u59CB\u5316</mat-option>\r\n <div>\r\n @switch (view) {\r\n @case ('palettes') {\r\n <div>\r\n <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n @for (palette of palettes; track $index) {\r\n <div role=\"presentation\"\r\n class=\"cursor-pointer\" (click)=\"selectPalette(palette)\">\r\n <mat-option\r\n class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent hover:opacity-50\"\r\n [value]=\"selectedPalette\">\r\n @if (selectedColor.color===palette + '-' + selectedHue) {\r\n <mat-icon class=\"absolute m-3 text-white\"\r\n [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n }\r\n <span class=\"flex w-10 h-10 m-1 rounded-full\"\r\n [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n </mat-option>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @case ('hues') {\r\n <div>\r\n <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n @for (hue of hues; track $index) {\r\n <div role=\"presentation\" class=\"cursor-pointer\"\r\n (click)=\"selectHue(hue)\">\r\n <mat-option\r\n class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent hover:opacity-50\"\r\n [value]=\"selectedHue\">\r\n @if (selectedColor.color===selectedPalette + '-' + hue) {\r\n <mat-icon class=\"absolute m-3 text-white\"\r\n [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n }\r\n <span class=\"flex w-10 h-10 m-1 rounded-full\"\r\n [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n </mat-option>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n </mat-select>\r\n</div>", styles: ["cmat-material-color-picker .mat-mdc-select-arrow-wrapper{display:none!important}\n"] }]
|
|
151
151
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { colorChanged: [{
|