@nanahoshi/mona-ui 0.7.0 → 0.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/nanahoshi-mona-ui-button.mjs +10 -3
- package/fesm2022/nanahoshi-mona-ui-calendar.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-chip.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-color-gradient.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-color-picker.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-date-picker.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-datetime-picker.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-dialog.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-dropdown-button.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-editor.mjs +13 -13
- package/fesm2022/nanahoshi-mona-ui-filter.mjs +1 -1
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-cell.component-C6M8hmzY.mjs → nanahoshi-mona-ui-grid-grid-footer-cell.component-BbBPZj7t.mjs} +2 -2
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-BwwDwf6_.mjs → nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-BkISJoqL.mjs} +2 -2
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-list.component-DTqG52dg.mjs → nanahoshi-mona-ui-grid-grid-list.component-DReEfWfG.mjs} +5 -5
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-toggle.component-CaTuM3-x.mjs → nanahoshi-mona-ui-grid-grid-toggle.component-QDo6TweF.mjs} +3 -3
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-virtual-list.component-BcTk4OPK.mjs → nanahoshi-mona-ui-grid-grid-virtual-list.component-BCIs_lmz.mjs} +5 -5
- package/fesm2022/{nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-CvCis4-I.mjs → nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-DWzYyGnb.mjs} +13 -13
- package/fesm2022/nanahoshi-mona-ui-grid.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-list-box.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-notification.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-numeric-text-box.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-pager.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-sheet.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-split-button.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-splitter.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-tabs.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-text-box.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-time-picker.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-time-selector.mjs +1 -1
- package/fesm2022/nanahoshi-mona-ui-window.mjs +1 -1
- package/package.json +1 -1
- package/types/nanahoshi-mona-ui-button.d.ts +7 -1
|
@@ -225,7 +225,7 @@ class SheetComponent {
|
|
|
225
225
|
});
|
|
226
226
|
}
|
|
227
227
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
228
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SheetComponent, isStandalone: true, selector: "mona-sheet", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdropClick: { classPropertyName: "closeOnBackdropClick", publicName: "closeOnBackdropClick", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", closed: "closed" }, host: { classAttribute: "hidden" }, viewQueries: [{ propertyName: "sheetTemplate", first: true, predicate: ["sheetTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #sheetTemplate>\n <section\n cdkTrapFocus\n [cdkTrapFocusAutoCapture]=\"true\"\n [class]=\"baseClass()\"\n role=\"dialog\"\n aria-modal=\"true\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"title() ? titleId : null\"\n [attr.aria-describedby]=\"description() ? descriptionId : null\"\n [attr.aria-label]=\"!title() ? ariaLabel() : null\">\n @if (title() || description() || closable()) {\n <header [class]=\"headerClass()\">\n <div class=\"min-w-0 flex-1\">\n @if (title()) {\n <h2 [id]=\"titleId\" [class]=\"titleClass()\">{{ title() }}</h2>\n }\n @if (description()) {\n <p [id]=\"descriptionId\" [class]=\"descriptionClass()\">{{ description() }}</p>\n }\n </div>\n @if (closable()) {\n <button\n monaButton\n type=\"button\"\n look=\"ghost\"\n [iconOnly]=\"true\"\n aria-label=\"Close sheet\"\n size=\"small\"\n [class]=\"closeButtonClass()\"\n (click)=\"closeSheet()\">\n <svg lucideX [size]=\"16\"></svg>\n </button>\n }\n </header>\n }\n <div [class]=\"contentClass()\">\n <ng-content></ng-content>\n </div>\n </section>\n</ng-template>\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }] }); }
|
|
228
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SheetComponent, isStandalone: true, selector: "mona-sheet", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdropClick: { classPropertyName: "closeOnBackdropClick", publicName: "closeOnBackdropClick", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", closed: "closed" }, host: { classAttribute: "hidden" }, viewQueries: [{ propertyName: "sheetTemplate", first: true, predicate: ["sheetTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #sheetTemplate>\n <section\n cdkTrapFocus\n [cdkTrapFocusAutoCapture]=\"true\"\n [class]=\"baseClass()\"\n role=\"dialog\"\n aria-modal=\"true\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"title() ? titleId : null\"\n [attr.aria-describedby]=\"description() ? descriptionId : null\"\n [attr.aria-label]=\"!title() ? ariaLabel() : null\">\n @if (title() || description() || closable()) {\n <header [class]=\"headerClass()\">\n <div class=\"min-w-0 flex-1\">\n @if (title()) {\n <h2 [id]=\"titleId\" [class]=\"titleClass()\">{{ title() }}</h2>\n }\n @if (description()) {\n <p [id]=\"descriptionId\" [class]=\"descriptionClass()\">{{ description() }}</p>\n }\n </div>\n @if (closable()) {\n <button\n monaButton\n type=\"button\"\n look=\"ghost\"\n [iconOnly]=\"true\"\n aria-label=\"Close sheet\"\n size=\"small\"\n [class]=\"closeButtonClass()\"\n (click)=\"closeSheet()\">\n <svg lucideX [size]=\"16\"></svg>\n </button>\n }\n </header>\n }\n <div [class]=\"contentClass()\">\n <ng-content></ng-content>\n </div>\n </section>\n</ng-template>\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }] }); }
|
|
229
229
|
}
|
|
230
230
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SheetComponent, decorators: [{
|
|
231
231
|
type: Component,
|
|
@@ -371,7 +371,7 @@ class SplitButtonComponent {
|
|
|
371
371
|
});
|
|
372
372
|
}
|
|
373
373
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SplitButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
374
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SplitButtonComponent, isStandalone: true, selector: "mona-split-button", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "aria-labelledby", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, menuButtonAriaLabel: { classPropertyName: "menuButtonAriaLabel", publicName: "menuButtonAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, popupWidth: { classPropertyName: "popupWidth", publicName: "popupWidth", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClick: "buttonClick", menuItemClick: "menuItemClick" }, host: { properties: { "class": "classes()" } }, queries: [{ propertyName: "menuItemComponents", predicate: PopupMenuToken, isSignal: true }, { propertyName: "groupTemplate", first: true, predicate: SplitButtonMenuGroupTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "iconTemplate", first: true, predicate: SplitButtonMenuItemIconTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "mainButtonTextTemplate", first: true, predicate: SplitButtonTextTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "menuButtonTemplate", first: true, predicate: SplitButtonMenuButtonTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "shortcutTemplate", first: true, predicate: SplitButtonMenuItemShortcutTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "textTemplate", first: true, predicate: SplitButtonMenuItemTextTemplateDirective, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "menuButtonRef", first: true, predicate: ["menuButton"], descendants: true, isSignal: true }, { propertyName: "popupMenuRef", first: true, predicate: ["popupMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<button\n monaButton\n (click)=\"buttonClick.emit($event)\"\n [disabled]=\"disabled()\"\n [look]=\"look()\"\n [size]=\"size()\"\n [rounded]=\"rounded()\"\n class=\"rounded-tr-none rounded-br-none\"\n [attr.aria-label]=\"splitButtonAriaLabel() || null\"\n [attr.aria-labelledby]=\"ariaLabelledby() || null\"\n [tabindex]=\"disabled() ? -1 : 0\"\n #mainButton>\n @if (mainButtonTextTemplate()) {\n <ng-container [ngTemplateOutlet]=\"mainButtonTextTemplate()\"></ng-container>\n } @else {\n <span>{{ text() }}</span>\n }\n</button>\n<button\n monaButton\n [disabled]=\"disabled()\"\n [iconOnly]=\"true\"\n [look]=\"look()\"\n [size]=\"size()\"\n [rounded]=\"rounded()\"\n class=\"rounded-tl-none rounded-bl-none border-l-0\"\n [attr.aria-haspopup]=\"'menu'\"\n [attr.aria-expanded]=\"menuOpen()\"\n [attr.aria-controls]=\"menuId\"\n [attr.aria-label]=\"menuButtonAriaLabel()\"\n [tabindex]=\"disabled() ? -1 : 0\"\n #menuButton>\n @if (menuButtonTemplate()) {\n <ng-container [ngTemplateOutlet]=\"menuButtonTemplate()\"></ng-container>\n } @else {\n <svg lucideChevronDown [size]=\"16\"></svg>\n }\n</button>\n\n<mona-popup-menu\n [anchorConnectionPoint]=\"'bottomleft'\"\n [anchor]=\"mainButton\"\n [items]=\"menuItems()\"\n (menuClick)=\"onMenuItemClick($event)\"\n (open)=\"onMenuOpen()\"\n (close)=\"onMenuClose()\"\n [offset]=\"{ horizontal: 0, vertical: 2 }\"\n [popupConnectionPoint]=\"'topleft'\"\n [rounded]=\"popupMenuRounded()\"\n [size]=\"size()\"\n [target]=\"menuButton\"\n [trigger]=\"'click'\"\n [id]=\"menuId\"\n [minWidth]=\"popupWidth() || undefined\"\n #popupMenu>\n @if (groupTemplate()) {\n <ng-template monaPopupMenuGroupTemplate let-group>\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: group }\"></ng-container>\n </ng-template>\n }\n @if (iconTemplate()) {\n <ng-template monaPopupMenuIconTemplate let-item>\n <ng-container\n [ngTemplateOutlet]=\"iconTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </ng-template>\n }\n @if (shortcutTemplate()) {\n <ng-template monaPopupMenuShortcutTemplate let-item>\n <ng-container\n [ngTemplateOutlet]=\"shortcutTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </ng-template>\n }\n @if (textTemplate()) {\n <ng-template monaPopupMenuTextTemplate let-item>\n <ng-container\n [ngTemplateOutlet]=\"textTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </ng-template>\n }\n</mona-popup-menu>\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopupMenuComponent, selector: "mona-popup-menu", inputs: ["anchor", "anchorConnectionPoint", "items", "id", "minWidth", "offset", "popupConnectionPoint", "precise", "rounded", "size", "target", "trigger", "width", "class"], outputs: ["close", "menuClick", "navigate", "open"] }, { kind: "directive", type: PopupMenuGroupTemplateDirective, selector: "ng-template[monaPopupMenuGroupTemplate]" }, { kind: "directive", type: PopupMenuIconTemplateDirective, selector: "ng-template[monaPopupMenuIconTemplate]" }, { kind: "directive", type: PopupMenuShortcutTemplateDirective, selector: "ng-template[monaPopupMenuShortcutTemplate]" }, { kind: "directive", type: PopupMenuTextTemplateDirective, selector: "ng-template[monaPopupMenuTextTemplate]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }] }); }
|
|
374
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SplitButtonComponent, isStandalone: true, selector: "mona-split-button", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "aria-labelledby", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, menuButtonAriaLabel: { classPropertyName: "menuButtonAriaLabel", publicName: "menuButtonAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, popupWidth: { classPropertyName: "popupWidth", publicName: "popupWidth", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClick: "buttonClick", menuItemClick: "menuItemClick" }, host: { properties: { "class": "classes()" } }, queries: [{ propertyName: "menuItemComponents", predicate: PopupMenuToken, isSignal: true }, { propertyName: "groupTemplate", first: true, predicate: SplitButtonMenuGroupTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "iconTemplate", first: true, predicate: SplitButtonMenuItemIconTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "mainButtonTextTemplate", first: true, predicate: SplitButtonTextTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "menuButtonTemplate", first: true, predicate: SplitButtonMenuButtonTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "shortcutTemplate", first: true, predicate: SplitButtonMenuItemShortcutTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "textTemplate", first: true, predicate: SplitButtonMenuItemTextTemplateDirective, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "menuButtonRef", first: true, predicate: ["menuButton"], descendants: true, isSignal: true }, { propertyName: "popupMenuRef", first: true, predicate: ["popupMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<button\n monaButton\n (click)=\"buttonClick.emit($event)\"\n [disabled]=\"disabled()\"\n [look]=\"look()\"\n [size]=\"size()\"\n [rounded]=\"rounded()\"\n class=\"rounded-tr-none rounded-br-none\"\n [attr.aria-label]=\"splitButtonAriaLabel() || null\"\n [attr.aria-labelledby]=\"ariaLabelledby() || null\"\n [tabindex]=\"disabled() ? -1 : 0\"\n #mainButton>\n @if (mainButtonTextTemplate()) {\n <ng-container [ngTemplateOutlet]=\"mainButtonTextTemplate()\"></ng-container>\n } @else {\n <span>{{ text() }}</span>\n }\n</button>\n<button\n monaButton\n [disabled]=\"disabled()\"\n [iconOnly]=\"true\"\n [look]=\"look()\"\n [size]=\"size()\"\n [rounded]=\"rounded()\"\n class=\"rounded-tl-none rounded-bl-none border-l-0\"\n [attr.aria-haspopup]=\"'menu'\"\n [attr.aria-expanded]=\"menuOpen()\"\n [attr.aria-controls]=\"menuId\"\n [attr.aria-label]=\"menuButtonAriaLabel()\"\n [tabindex]=\"disabled() ? -1 : 0\"\n #menuButton>\n @if (menuButtonTemplate()) {\n <ng-container [ngTemplateOutlet]=\"menuButtonTemplate()\"></ng-container>\n } @else {\n <svg lucideChevronDown [size]=\"16\"></svg>\n }\n</button>\n\n<mona-popup-menu\n [anchorConnectionPoint]=\"'bottomleft'\"\n [anchor]=\"mainButton\"\n [items]=\"menuItems()\"\n (menuClick)=\"onMenuItemClick($event)\"\n (open)=\"onMenuOpen()\"\n (close)=\"onMenuClose()\"\n [offset]=\"{ horizontal: 0, vertical: 2 }\"\n [popupConnectionPoint]=\"'topleft'\"\n [rounded]=\"popupMenuRounded()\"\n [size]=\"size()\"\n [target]=\"menuButton\"\n [trigger]=\"'click'\"\n [id]=\"menuId\"\n [minWidth]=\"popupWidth() || undefined\"\n #popupMenu>\n @if (groupTemplate()) {\n <ng-template monaPopupMenuGroupTemplate let-group>\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: group }\"></ng-container>\n </ng-template>\n }\n @if (iconTemplate()) {\n <ng-template monaPopupMenuIconTemplate let-item>\n <ng-container\n [ngTemplateOutlet]=\"iconTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </ng-template>\n }\n @if (shortcutTemplate()) {\n <ng-template monaPopupMenuShortcutTemplate let-item>\n <ng-container\n [ngTemplateOutlet]=\"shortcutTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </ng-template>\n }\n @if (textTemplate()) {\n <ng-template monaPopupMenuTextTemplate let-item>\n <ng-container\n [ngTemplateOutlet]=\"textTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </ng-template>\n }\n</mona-popup-menu>\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopupMenuComponent, selector: "mona-popup-menu", inputs: ["anchor", "anchorConnectionPoint", "items", "id", "minWidth", "offset", "popupConnectionPoint", "precise", "rounded", "size", "target", "trigger", "width", "class"], outputs: ["close", "menuClick", "navigate", "open"] }, { kind: "directive", type: PopupMenuGroupTemplateDirective, selector: "ng-template[monaPopupMenuGroupTemplate]" }, { kind: "directive", type: PopupMenuIconTemplateDirective, selector: "ng-template[monaPopupMenuIconTemplate]" }, { kind: "directive", type: PopupMenuShortcutTemplateDirective, selector: "ng-template[monaPopupMenuShortcutTemplate]" }, { kind: "directive", type: PopupMenuTextTemplateDirective, selector: "ng-template[monaPopupMenuTextTemplate]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }] }); }
|
|
375
375
|
}
|
|
376
376
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SplitButtonComponent, decorators: [{
|
|
377
377
|
type: Component,
|
|
@@ -233,7 +233,7 @@ class SplitterResizerHandleComponent {
|
|
|
233
233
|
event.stopPropagation();
|
|
234
234
|
}
|
|
235
235
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SplitterResizerHandleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
236
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SplitterResizerHandleComponent, isStandalone: true, selector: "mona-splitter-resizer-handle", inputs: { nextControlsVisible: { classPropertyName: "nextControlsVisible", publicName: "nextControlsVisible", isSignal: true, isRequired: true, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: true, transformFunction: null }, previousControlsVisible: { classPropertyName: "previousControlsVisible", publicName: "previousControlsVisible", isSignal: true, isRequired: true, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { collapseNext: "collapseNext", collapsePrevious: "collapsePrevious" }, host: { properties: { "class": "baseClass()" } }, ngImport: i0, template: "@if (orientation() === \"horizontal\") {\n @if (previousControlsVisible()) {\n <button\n monaButton\n look=\"secondary\"\n [rounded]=\"'none'\"\n aria-label=\"Collapse previous pane\"\n (click)=\"collapsePrevious.emit($event)\"\n (pointerdown)=\"onPointerDown($event)\">\n <svg lucideChevronLeft [size]=\"12\"></svg>\n </button>\n }\n @if (resizable()) {\n <div class=\"flex h-6 w-0.5 bg-primary/40\"></div>\n }\n @if (nextControlsVisible()) {\n <button\n monaButton\n look=\"secondary\"\n [rounded]=\"'none'\"\n aria-label=\"Collapse next pane\"\n (click)=\"collapseNext.emit($event)\"\n (pointerdown)=\"onPointerDown($event)\">\n <svg lucideChevronRight [size]=\"12\"></svg>\n </button>\n }\n} @else {\n @if (previousControlsVisible()) {\n <button\n monaButton\n look=\"secondary\"\n [rounded]=\"'none'\"\n aria-label=\"Collapse pane above\"\n (click)=\"collapsePrevious.emit($event)\"\n (pointerdown)=\"onPointerDown($event)\">\n <svg lucideChevronUp [size]=\"12\"></svg>\n </button>\n }\n @if (resizable()) {\n <div class=\"flex h-0.5 w-6 bg-primary/40\"></div>\n }\n @if (nextControlsVisible()) {\n <button\n monaButton\n look=\"secondary\"\n [rounded]=\"'none'\"\n aria-label=\"Collapse pane below\"\n (click)=\"collapseNext.emit($event)\"\n (pointerdown)=\"onPointerDown($event)\">\n <svg lucideChevronDown [size]=\"12\"></svg>\n </button>\n }\n}\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "component", type: LucideChevronLeft, selector: "svg[lucideChevronLeft]" }, { kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }, { kind: "component", type: LucideChevronUp, selector: "svg[lucideChevronUp]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }] }); }
|
|
236
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: SplitterResizerHandleComponent, isStandalone: true, selector: "mona-splitter-resizer-handle", inputs: { nextControlsVisible: { classPropertyName: "nextControlsVisible", publicName: "nextControlsVisible", isSignal: true, isRequired: true, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: true, transformFunction: null }, previousControlsVisible: { classPropertyName: "previousControlsVisible", publicName: "previousControlsVisible", isSignal: true, isRequired: true, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { collapseNext: "collapseNext", collapsePrevious: "collapsePrevious" }, host: { properties: { "class": "baseClass()" } }, ngImport: i0, template: "@if (orientation() === \"horizontal\") {\n @if (previousControlsVisible()) {\n <button\n monaButton\n look=\"secondary\"\n [rounded]=\"'none'\"\n aria-label=\"Collapse previous pane\"\n (click)=\"collapsePrevious.emit($event)\"\n (pointerdown)=\"onPointerDown($event)\">\n <svg lucideChevronLeft [size]=\"12\"></svg>\n </button>\n }\n @if (resizable()) {\n <div class=\"flex h-6 w-0.5 bg-primary/40\"></div>\n }\n @if (nextControlsVisible()) {\n <button\n monaButton\n look=\"secondary\"\n [rounded]=\"'none'\"\n aria-label=\"Collapse next pane\"\n (click)=\"collapseNext.emit($event)\"\n (pointerdown)=\"onPointerDown($event)\">\n <svg lucideChevronRight [size]=\"12\"></svg>\n </button>\n }\n} @else {\n @if (previousControlsVisible()) {\n <button\n monaButton\n look=\"secondary\"\n [rounded]=\"'none'\"\n aria-label=\"Collapse pane above\"\n (click)=\"collapsePrevious.emit($event)\"\n (pointerdown)=\"onPointerDown($event)\">\n <svg lucideChevronUp [size]=\"12\"></svg>\n </button>\n }\n @if (resizable()) {\n <div class=\"flex h-0.5 w-6 bg-primary/40\"></div>\n }\n @if (nextControlsVisible()) {\n <button\n monaButton\n look=\"secondary\"\n [rounded]=\"'none'\"\n aria-label=\"Collapse pane below\"\n (click)=\"collapseNext.emit($event)\"\n (pointerdown)=\"onPointerDown($event)\">\n <svg lucideChevronDown [size]=\"12\"></svg>\n </button>\n }\n}\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "component", type: LucideChevronLeft, selector: "svg[lucideChevronLeft]" }, { kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }, { kind: "component", type: LucideChevronUp, selector: "svg[lucideChevronUp]" }, { kind: "component", type: LucideChevronDown, selector: "svg[lucideChevronDown]" }] }); }
|
|
237
237
|
}
|
|
238
238
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: SplitterResizerHandleComponent, decorators: [{
|
|
239
239
|
type: Component,
|
|
@@ -402,7 +402,7 @@ class TabListComponent {
|
|
|
402
402
|
});
|
|
403
403
|
}
|
|
404
404
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TabListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
405
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: TabListComponent, isStandalone: true, selector: "mona-tab-list", inputs: { closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: true, transformFunction: null }, selectedTabId: { classPropertyName: "selectedTabId", publicName: "selectedTabId", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null }, tabList: { classPropertyName: "tabList", publicName: "tabList", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selectedTabId: "selectedTabIdChange", tabClose: "tabClose", tabSelect: "tabSelect" }, host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "baseClass()" } }, viewQueries: [{ propertyName: "tabListElement", first: true, predicate: ["tabListElement"], descendants: true, isSignal: true }, { propertyName: "tabListItems", predicate: TabListItemDirective, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@if (scrollsVisible()) {\n <button\n monaButton\n look=\"link\"\n size=\"small\"\n [class]=\"scrollButtonClass()\"\n (click)=\"startScrolling(tabListElement, 'left', 'single')\"\n (pointerdown)=\"startContinuousScroll($event, tabListElement, 'left')\"\n (pointerup)=\"stopScrolling()\"\n [attr.aria-hidden]=\"true\"\n tabindex=\"-1\">\n <svg lucideChevronLeft [size]=\"16\"></svg>\n </button>\n}\n<div class=\"w-full h-full overflow-hidden\">\n <ul [class]=\"listClass()\" #tabListElement role=\"tablist\">\n @for (tab of tabList(); track tab) {\n @let selected = tab.id === selectedTabId();\n @let itemDisabled = tab.disabled || disabled();\n <li\n monaTabListItem\n [id]=\"tab.id + '-tab'\"\n [active]=\"selected\"\n [disabled]=\"itemDisabled\"\n [rounded]=\"rounded()\"\n role=\"tab\"\n [tabindex]=\"selected ? 0 : -1\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-disabled]=\"itemDisabled\"\n [attr.aria-controls]=\"tab.id + '-panel'\"\n [attr.data-selected]=\"selected\"\n [attr.data-tab-id]=\"tab.id\"\n (click)=\"onTabClick(tab, tabListElement, $event)\">\n <div>\n @if (tab.titleTemplate) {\n <ng-container [ngTemplateOutlet]=\"tab.titleTemplate\"></ng-container>\n } @else {\n <span>{{ tab.title }}</span>\n }\n </div>\n @if (tab.closable || closable()) {\n <button\n monaButton\n look=\"link\"\n [disabled]=\"itemDisabled\"\n (click)=\"onTabClose(tab, $event)\"\n class=\"px-0 h-fit ml-1 w-min\"\n tabindex=\"-1\">\n <svg lucideX [size]=\"16\"></svg>\n </button>\n }\n </li>\n }\n </ul>\n</div>\n@if (scrollsVisible()) {\n <button\n monaButton\n look=\"link\"\n size=\"small\"\n [class]=\"scrollButtonClass()\"\n (click)=\"startScrolling(tabListElement, 'right', 'single')\"\n (pointerdown)=\"startContinuousScroll($event, tabListElement, 'right')\"\n (pointerup)=\"stopScrolling()\"\n [attr.aria-hidden]=\"true\"\n tabindex=\"-1\">\n <svg lucideChevronRight [size]=\"16\"></svg>\n </button>\n}\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TabListItemDirective, selector: "li[monaTabListItem]", inputs: ["active", "disabled", "rounded"] }, { kind: "component", type: LucideChevronLeft, selector: "svg[lucideChevronLeft]" }, { kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }] }); }
|
|
405
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: TabListComponent, isStandalone: true, selector: "mona-tab-list", inputs: { closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: true, transformFunction: null }, selectedTabId: { classPropertyName: "selectedTabId", publicName: "selectedTabId", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null }, tabList: { classPropertyName: "tabList", publicName: "tabList", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selectedTabId: "selectedTabIdChange", tabClose: "tabClose", tabSelect: "tabSelect" }, host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "baseClass()" } }, viewQueries: [{ propertyName: "tabListElement", first: true, predicate: ["tabListElement"], descendants: true, isSignal: true }, { propertyName: "tabListItems", predicate: TabListItemDirective, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@if (scrollsVisible()) {\n <button\n monaButton\n look=\"link\"\n size=\"small\"\n [class]=\"scrollButtonClass()\"\n (click)=\"startScrolling(tabListElement, 'left', 'single')\"\n (pointerdown)=\"startContinuousScroll($event, tabListElement, 'left')\"\n (pointerup)=\"stopScrolling()\"\n [attr.aria-hidden]=\"true\"\n tabindex=\"-1\">\n <svg lucideChevronLeft [size]=\"16\"></svg>\n </button>\n}\n<div class=\"w-full h-full overflow-hidden\">\n <ul [class]=\"listClass()\" #tabListElement role=\"tablist\">\n @for (tab of tabList(); track tab) {\n @let selected = tab.id === selectedTabId();\n @let itemDisabled = tab.disabled || disabled();\n <li\n monaTabListItem\n [id]=\"tab.id + '-tab'\"\n [active]=\"selected\"\n [disabled]=\"itemDisabled\"\n [rounded]=\"rounded()\"\n role=\"tab\"\n [tabindex]=\"selected ? 0 : -1\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-disabled]=\"itemDisabled\"\n [attr.aria-controls]=\"tab.id + '-panel'\"\n [attr.data-selected]=\"selected\"\n [attr.data-tab-id]=\"tab.id\"\n (click)=\"onTabClick(tab, tabListElement, $event)\">\n <div>\n @if (tab.titleTemplate) {\n <ng-container [ngTemplateOutlet]=\"tab.titleTemplate\"></ng-container>\n } @else {\n <span>{{ tab.title }}</span>\n }\n </div>\n @if (tab.closable || closable()) {\n <button\n monaButton\n look=\"link\"\n [disabled]=\"itemDisabled\"\n (click)=\"onTabClose(tab, $event)\"\n class=\"px-0 h-fit ml-1 w-min\"\n tabindex=\"-1\">\n <svg lucideX [size]=\"16\"></svg>\n </button>\n }\n </li>\n }\n </ul>\n</div>\n@if (scrollsVisible()) {\n <button\n monaButton\n look=\"link\"\n size=\"small\"\n [class]=\"scrollButtonClass()\"\n (click)=\"startScrolling(tabListElement, 'right', 'single')\"\n (pointerdown)=\"startContinuousScroll($event, tabListElement, 'right')\"\n (pointerup)=\"stopScrolling()\"\n [attr.aria-hidden]=\"true\"\n tabindex=\"-1\">\n <svg lucideChevronRight [size]=\"16\"></svg>\n </button>\n}\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TabListItemDirective, selector: "li[monaTabListItem]", inputs: ["active", "disabled", "rounded"] }, { kind: "component", type: LucideChevronLeft, selector: "svg[lucideChevronLeft]" }, { kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }] }); }
|
|
406
406
|
}
|
|
407
407
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TabListComponent, decorators: [{
|
|
408
408
|
type: Component,
|
|
@@ -282,7 +282,7 @@ class TextBoxComponent {
|
|
|
282
282
|
this.touch.emit();
|
|
283
283
|
}
|
|
284
284
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TextBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
285
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: TextBoxComponent, isStandalone: true, selector: "mona-text-box", inputs: { clearButton: { classPropertyName: "clearButton", publicName: "clearButton", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, inputAttributes: { classPropertyName: "inputAttributes", publicName: "inputAttributes", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null }, inputStyle: { classPropertyName: "inputStyle", publicName: "inputStyle", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { inputBlur: "inputBlur", inputFocus: "inputFocus", touch: "touch", value: "valueChange" }, host: { properties: { "attr.data-disabled": "disabled() || null", "attr.data-readonly": "readonly() || null", "attr.data-required": "required() || null", "attr.data-invalid": "invalidInput() || null", "class": "classes()" } }, queries: [{ propertyName: "prefixTemplateList", predicate: TextBoxPrefixTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "suffixTemplateList", predicate: TextBoxSuffixTemplateDirective, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: "@for (prefixTemplate of prefixTemplateList(); track $index) {\n <span class=\"flex h-full flex-wrap items-center\">\n <ng-container *ngTemplateOutlet=\"prefixTemplate\"></ng-container>\n </span>\n}\n<input\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [placeholder]=\"placeholder()\"\n [type]=\"type()\"\n [class]=\"inputClass()\"\n [style]=\"inputStyle()\"\n [attr.aria-invalid]=\"invalidInput() ? 'true' : null\"\n [monaAttributeBinder]=\"inputAttributes()\"\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (blur)=\"onInputBlur($event)\"\n (focus)=\"inputFocus.emit($event)\"\n #input />\n\n@let textBoxValue = value();\n@if (clearButton() && textBoxValue && textBoxValue.length !== 0) {\n <button monaButton look=\"link\" size=\"small\" class=\"me-2 p-0\" aria-label=\"Clear\" (click)=\"onClearClick()\">\n <svg lucideX class=\"size-4 opacity-50 hover:opacity-90\"></svg>\n </button>\n}\n\n@for (suffixTemplate of suffixTemplateList(); track $index) {\n <span class=\"flex h-full flex-wrap items-center\">\n <ng-container *ngTemplateOutlet=\"suffixTemplate\"></ng-container>\n </span>\n}\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: AttributeBinderDirective, selector: "[monaAttributeBinder]", inputs: ["monaAttributeBinder"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }] }); }
|
|
285
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: TextBoxComponent, isStandalone: true, selector: "mona-text-box", inputs: { clearButton: { classPropertyName: "clearButton", publicName: "clearButton", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, inputAttributes: { classPropertyName: "inputAttributes", publicName: "inputAttributes", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null }, inputStyle: { classPropertyName: "inputStyle", publicName: "inputStyle", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { inputBlur: "inputBlur", inputFocus: "inputFocus", touch: "touch", value: "valueChange" }, host: { properties: { "attr.data-disabled": "disabled() || null", "attr.data-readonly": "readonly() || null", "attr.data-required": "required() || null", "attr.data-invalid": "invalidInput() || null", "class": "classes()" } }, queries: [{ propertyName: "prefixTemplateList", predicate: TextBoxPrefixTemplateDirective, read: TemplateRef, isSignal: true }, { propertyName: "suffixTemplateList", predicate: TextBoxSuffixTemplateDirective, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: "@for (prefixTemplate of prefixTemplateList(); track $index) {\n <span class=\"flex h-full flex-wrap items-center\">\n <ng-container *ngTemplateOutlet=\"prefixTemplate\"></ng-container>\n </span>\n}\n<input\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [placeholder]=\"placeholder()\"\n [type]=\"type()\"\n [class]=\"inputClass()\"\n [style]=\"inputStyle()\"\n [attr.aria-invalid]=\"invalidInput() ? 'true' : null\"\n [monaAttributeBinder]=\"inputAttributes()\"\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (blur)=\"onInputBlur($event)\"\n (focus)=\"inputFocus.emit($event)\"\n #input />\n\n@let textBoxValue = value();\n@if (clearButton() && textBoxValue && textBoxValue.length !== 0) {\n <button monaButton look=\"link\" size=\"small\" class=\"me-2 p-0\" aria-label=\"Clear\" (click)=\"onClearClick()\">\n <svg lucideX class=\"size-4 opacity-50 hover:opacity-90\"></svg>\n </button>\n}\n\n@for (suffixTemplate of suffixTemplateList(); track $index) {\n <span class=\"flex h-full flex-wrap items-center\">\n <ng-container *ngTemplateOutlet=\"suffixTemplate\"></ng-container>\n </span>\n}\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: AttributeBinderDirective, selector: "[monaAttributeBinder]", inputs: ["monaAttributeBinder"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }] }); }
|
|
286
286
|
}
|
|
287
287
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TextBoxComponent, decorators: [{
|
|
288
288
|
type: Component,
|
|
@@ -421,7 +421,7 @@ class TimePickerComponent {
|
|
|
421
421
|
useExisting: forwardRef(() => TimePickerComponent),
|
|
422
422
|
multi: false
|
|
423
423
|
}
|
|
424
|
-
], viewQueries: [{ propertyName: "timePopupTemplateRef", first: true, predicate: ["timePopupTemplate"], descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.DropdownPopupHandlerDirective }], ngImport: i0, template: "<mona-text-box\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || readonlyInput()\"\n [required]=\"required()\"\n [value]=\"currentDateString()\"\n [inputAttributes]=\"inputAttributes()\"\n [invalid]=\"invalid()\"\n [placeholder]=\"placeholder()\"\n [rounded]=\"rounded()\"\n [size]=\"size()\"\n [touched]=\"touched()\"\n [clearButton]=\"showClearButton()\"\n (valueChange)=\"onDateStringEdit($event)\"\n (inputBlur)=\"onTimeInputBlur()\">\n <ng-template monaTextBoxSuffixTemplate>\n <button\n monaButton\n look=\"ghost\"\n [iconOnly]=\"true\"\n [size]=\"size()\"\n [rounded]=\"'none'\"\n (click)=\"onTimeInputButtonClick()\"\n class=\"aspect-square h-full w-auto\"\n [attr.aria-label]=\"'Open time picker'\"\n [attr.aria-expanded]=\"expanded()\"\n [attr.aria-controls]=\"popupId\"\n [disabled]=\"disabled() || readonly()\"\n [tabindex]=\"-1\">\n <i class=\"ri-time-line\"></i>\n </button>\n </ng-template>\n</mona-text-box>\n\n<ng-template #timePopupTemplate>\n <div\n [class]=\"pickerPopupClass()\"\n [id]=\"popupId\"\n aria-modal=\"true\"\n role=\"dialog\"\n aria-label=\"Time picker\"\n cdkTrapFocus>\n <mona-time-selector\n [value]=\"value()\"\n (valueChange)=\"onTimeSelectorValueChange($event)\"\n [max]=\"max()\"\n [min]=\"min()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [hourFormat]=\"hourFormat()\"\n [hourStep]=\"hourStep()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n [size]=\"size()\"\n [rounded]=\"rounded()\"\n [showSeconds]=\"showSeconds()\"></mona-time-selector>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "component", type: TimeSelectorComponent, selector: "mona-time-selector", inputs: ["ariaLabel", "disabled", "focusOnMount", "footer", "hourFormat", "hourStep", "invalid", "max", "min", "minuteStep", "readonly", "required", "rounded", "secondStep", "showSeconds", "size", "touched", "value"], outputs: ["touch", "valueChange"] }, { kind: "component", type: TextBoxComponent, selector: "mona-text-box", inputs: ["clearButton", "disabled", "inputAttributes", "inputClass", "inputStyle", "invalid", "placeholder", "readonly", "required", "rounded", "size", "touched", "type", "class", "value"], outputs: ["inputBlur", "inputFocus", "touch", "valueChange"] }, { kind: "directive", type: TextBoxSuffixTemplateDirective, selector: "ng-template[monaTextBoxSuffixTemplate]" }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] }); }
|
|
424
|
+
], viewQueries: [{ propertyName: "timePopupTemplateRef", first: true, predicate: ["timePopupTemplate"], descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.DropdownPopupHandlerDirective }], ngImport: i0, template: "<mona-text-box\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || readonlyInput()\"\n [required]=\"required()\"\n [value]=\"currentDateString()\"\n [inputAttributes]=\"inputAttributes()\"\n [invalid]=\"invalid()\"\n [placeholder]=\"placeholder()\"\n [rounded]=\"rounded()\"\n [size]=\"size()\"\n [touched]=\"touched()\"\n [clearButton]=\"showClearButton()\"\n (valueChange)=\"onDateStringEdit($event)\"\n (inputBlur)=\"onTimeInputBlur()\">\n <ng-template monaTextBoxSuffixTemplate>\n <button\n monaButton\n look=\"ghost\"\n [iconOnly]=\"true\"\n [size]=\"size()\"\n [rounded]=\"'none'\"\n (click)=\"onTimeInputButtonClick()\"\n class=\"aspect-square h-full w-auto\"\n [attr.aria-label]=\"'Open time picker'\"\n [attr.aria-expanded]=\"expanded()\"\n [attr.aria-controls]=\"popupId\"\n [disabled]=\"disabled() || readonly()\"\n [tabindex]=\"-1\">\n <i class=\"ri-time-line\"></i>\n </button>\n </ng-template>\n</mona-text-box>\n\n<ng-template #timePopupTemplate>\n <div\n [class]=\"pickerPopupClass()\"\n [id]=\"popupId\"\n aria-modal=\"true\"\n role=\"dialog\"\n aria-label=\"Time picker\"\n cdkTrapFocus>\n <mona-time-selector\n [value]=\"value()\"\n (valueChange)=\"onTimeSelectorValueChange($event)\"\n [max]=\"max()\"\n [min]=\"min()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [hourFormat]=\"hourFormat()\"\n [hourStep]=\"hourStep()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n [size]=\"size()\"\n [rounded]=\"rounded()\"\n [showSeconds]=\"showSeconds()\"></mona-time-selector>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "component", type: TimeSelectorComponent, selector: "mona-time-selector", inputs: ["ariaLabel", "disabled", "focusOnMount", "footer", "hourFormat", "hourStep", "invalid", "max", "min", "minuteStep", "readonly", "required", "rounded", "secondStep", "showSeconds", "size", "touched", "value"], outputs: ["touch", "valueChange"] }, { kind: "component", type: TextBoxComponent, selector: "mona-text-box", inputs: ["clearButton", "disabled", "inputAttributes", "inputClass", "inputStyle", "invalid", "placeholder", "readonly", "required", "rounded", "size", "touched", "type", "class", "value"], outputs: ["inputBlur", "inputFocus", "touch", "valueChange"] }, { kind: "directive", type: TextBoxSuffixTemplateDirective, selector: "ng-template[monaTextBoxSuffixTemplate]" }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] }); }
|
|
425
425
|
}
|
|
426
426
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimePickerComponent, decorators: [{
|
|
427
427
|
type: Component,
|
|
@@ -630,7 +630,7 @@ class TimeSelectorComponent {
|
|
|
630
630
|
}
|
|
631
631
|
}
|
|
632
632
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimeSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
633
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: TimeSelectorComponent, isStandalone: true, selector: "mona-time-selector", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, focusOnMount: { classPropertyName: "focusOnMount", publicName: "focusOnMount", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, hourFormat: { classPropertyName: "hourFormat", publicName: "hourFormat", isSignal: true, isRequired: false, transformFunction: null }, hourStep: { classPropertyName: "hourStep", publicName: "hourStep", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, minuteStep: { classPropertyName: "minuteStep", publicName: "minuteStep", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, secondStep: { classPropertyName: "secondStep", publicName: "secondStep", isSignal: true, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { touch: "touch", value: "valueChange" }, host: { attributes: { "role": "group" }, listeners: { "blur": "onBlur()" }, properties: { "attr.aria-label": "ariaLabel()", "attr.aria-disabled": "disabled()", "attr.aria-invalid": "invalidState() ? 'true' : null", "attr.aria-readonly": "readonly()", "attr.aria-required": "required()", "attr.data-invalid": "invalidState() || null", "attr.data-readonly": "readonly() || null", "attr.data-required": "required() || null", "class": "baseClass()" } }, viewQueries: [{ propertyName: "hourListRef", first: true, predicate: ["hourList"], descendants: true, isSignal: true }, { propertyName: "meridiemListRef", first: true, predicate: ["meridiemList"], descendants: true, isSignal: true }, { propertyName: "minuteListRef", first: true, predicate: ["minuteList"], descendants: true, isSignal: true }, { propertyName: "secondListRef", first: true, predicate: ["secondList"], descendants: true, isSignal: true }], ngImport: i0, template: "<div [class]=\"headerClass()\">\n <div>Hr</div>\n <div>Min</div>\n @if (showSeconds()) {\n <div>Sec</div>\n }\n</div>\n\n<div [class]=\"infoContainerClass()\">\n <span>{{ navigatedDateText() }}</span>\n <button\n monaButton\n look=\"ghost\"\n [rounded]=\"rounded()\"\n [size]=\"'small'\"\n (click)=\"onNowClick($event)\"\n (keydown.enter)=\"onNowClick($event)\"\n (keydown.space)=\"onNowClick($event)\">\n Now\n </button>\n</div>\n\n<div [class]=\"listContainerClass()\">\n <ol\n #hourList\n monaTimeSelectorList\n aria-label=\"Hours\"\n [attr.aria-activedescendant]=\"`${hourListId}${navigatedDate().hour}`\"\n [active]=\"focusedList() === 'hours'\"\n [id]=\"hourListId\"\n [popupHeight]=\"computedPopupHeight()\"\n [size]=\"size()\">\n @for (h of viewHours() | timeLimiter: \"h\" : navigatedDate() : minDate() : maxDate(); track h) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"h.viewValue === hour()\"\n [value]=\"h.value\"\n [id]=\"`${hourListId}${h.value}`\"\n (click)=\"onHourChange(h.value)\">\n {{ h.viewValue | number: \"2.0\" }}\n </li>\n }\n </ol>\n <ol\n #minuteList\n monaTimeSelectorList\n aria-label=\"Minutes\"\n [attr.aria-activedescendant]=\"`${minuteListId}${navigatedDate().minute}`\"\n [active]=\"focusedList() === 'minutes'\"\n [id]=\"minuteListId\"\n [popupHeight]=\"computedPopupHeight()\"\n [size]=\"size()\">\n @for (m of minutes() | timeLimiter: \"m\" : navigatedDate() : minDate() : maxDate(); track m) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"m.value === minute()\"\n [value]=\"m.value\"\n [id]=\"`${minuteListId}${m.value}`\"\n (click)=\"onMinuteChange(m.value)\">\n {{ m.viewValue | number: \"2.0\" }}\n </li>\n }\n </ol>\n @if (showSeconds()) {\n <ol\n #secondList\n monaTimeSelectorList\n aria-label=\"Seconds\"\n [attr.aria-activedescendant]=\"`${secondListId}${navigatedDate().second}`\"\n [active]=\"focusedList() === 'seconds'\"\n [id]=\"secondListId\"\n [popupHeight]=\"computedPopupHeight()\"\n [size]=\"size()\">\n @for (s of seconds() | timeLimiter: \"s\" : navigatedDate() : minDate() : maxDate(); track s) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"s.value === second()\"\n [value]=\"s.value\"\n [id]=\"`${secondListId}${s.value}`\"\n (click)=\"onSecondChange(s.value)\">\n {{ s.value | number: \"2.0\" }}\n </li>\n }\n </ol>\n }\n @if (hourFormat() === \"12\") {\n <ol\n #meridiemList\n monaTimeSelectorList\n aria-label=\"AM/PM\"\n [attr.aria-activedescendant]=\"`${meridiemListId}${meridiem()}`\"\n [active]=\"focusedList() === 'meridiem'\"\n [id]=\"meridiemListId\"\n [popupHeight]=\"computedPopupHeight()\"\n [size]=\"size()\">\n @if (amMeridiemVisible()) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"meridiem() === 'AM'\"\n [value]=\"'AM'\"\n (click)=\"onMeridiemClick('AM')\"\n [id]=\"`${meridiemListId}AM`\">\n AM\n </li>\n }\n @if (pmMeridiemVisible()) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"meridiem() === 'PM'\"\n [value]=\"'PM'\"\n (click)=\"onMeridiemClick('PM')\"\n [id]=\"`${meridiemListId}PM`\">\n PM\n </li>\n }\n </ol>\n }\n</div>\n\n@if (footer()) {\n <div [class]=\"footerClass()\">\n <button monaButton look=\"primary\" [rounded]=\"rounded()\" [size]=\"size()\" (click)=\"onSetTimeClick()\">Set</button>\n </div>\n}\n", dependencies: [{ kind: "directive", type: TimeSelectorItemDirective, selector: "li[monaTimeSelectorItem]", inputs: ["selected", "size", "value"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: TimeSelectorListDirective, selector: "ol[monaTimeSelectorList]", inputs: ["active", "popupHeight", "size"] }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: TimeLimiterPipe, name: "timeLimiter" }] }); }
|
|
633
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: TimeSelectorComponent, isStandalone: true, selector: "mona-time-selector", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, focusOnMount: { classPropertyName: "focusOnMount", publicName: "focusOnMount", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, hourFormat: { classPropertyName: "hourFormat", publicName: "hourFormat", isSignal: true, isRequired: false, transformFunction: null }, hourStep: { classPropertyName: "hourStep", publicName: "hourStep", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, minuteStep: { classPropertyName: "minuteStep", publicName: "minuteStep", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, secondStep: { classPropertyName: "secondStep", publicName: "secondStep", isSignal: true, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { touch: "touch", value: "valueChange" }, host: { attributes: { "role": "group" }, listeners: { "blur": "onBlur()" }, properties: { "attr.aria-label": "ariaLabel()", "attr.aria-disabled": "disabled()", "attr.aria-invalid": "invalidState() ? 'true' : null", "attr.aria-readonly": "readonly()", "attr.aria-required": "required()", "attr.data-invalid": "invalidState() || null", "attr.data-readonly": "readonly() || null", "attr.data-required": "required() || null", "class": "baseClass()" } }, viewQueries: [{ propertyName: "hourListRef", first: true, predicate: ["hourList"], descendants: true, isSignal: true }, { propertyName: "meridiemListRef", first: true, predicate: ["meridiemList"], descendants: true, isSignal: true }, { propertyName: "minuteListRef", first: true, predicate: ["minuteList"], descendants: true, isSignal: true }, { propertyName: "secondListRef", first: true, predicate: ["secondList"], descendants: true, isSignal: true }], ngImport: i0, template: "<div [class]=\"headerClass()\">\n <div>Hr</div>\n <div>Min</div>\n @if (showSeconds()) {\n <div>Sec</div>\n }\n</div>\n\n<div [class]=\"infoContainerClass()\">\n <span>{{ navigatedDateText() }}</span>\n <button\n monaButton\n look=\"ghost\"\n [rounded]=\"rounded()\"\n [size]=\"'small'\"\n (click)=\"onNowClick($event)\"\n (keydown.enter)=\"onNowClick($event)\"\n (keydown.space)=\"onNowClick($event)\">\n Now\n </button>\n</div>\n\n<div [class]=\"listContainerClass()\">\n <ol\n #hourList\n monaTimeSelectorList\n aria-label=\"Hours\"\n [attr.aria-activedescendant]=\"`${hourListId}${navigatedDate().hour}`\"\n [active]=\"focusedList() === 'hours'\"\n [id]=\"hourListId\"\n [popupHeight]=\"computedPopupHeight()\"\n [size]=\"size()\">\n @for (h of viewHours() | timeLimiter: \"h\" : navigatedDate() : minDate() : maxDate(); track h) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"h.viewValue === hour()\"\n [value]=\"h.value\"\n [id]=\"`${hourListId}${h.value}`\"\n (click)=\"onHourChange(h.value)\">\n {{ h.viewValue | number: \"2.0\" }}\n </li>\n }\n </ol>\n <ol\n #minuteList\n monaTimeSelectorList\n aria-label=\"Minutes\"\n [attr.aria-activedescendant]=\"`${minuteListId}${navigatedDate().minute}`\"\n [active]=\"focusedList() === 'minutes'\"\n [id]=\"minuteListId\"\n [popupHeight]=\"computedPopupHeight()\"\n [size]=\"size()\">\n @for (m of minutes() | timeLimiter: \"m\" : navigatedDate() : minDate() : maxDate(); track m) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"m.value === minute()\"\n [value]=\"m.value\"\n [id]=\"`${minuteListId}${m.value}`\"\n (click)=\"onMinuteChange(m.value)\">\n {{ m.viewValue | number: \"2.0\" }}\n </li>\n }\n </ol>\n @if (showSeconds()) {\n <ol\n #secondList\n monaTimeSelectorList\n aria-label=\"Seconds\"\n [attr.aria-activedescendant]=\"`${secondListId}${navigatedDate().second}`\"\n [active]=\"focusedList() === 'seconds'\"\n [id]=\"secondListId\"\n [popupHeight]=\"computedPopupHeight()\"\n [size]=\"size()\">\n @for (s of seconds() | timeLimiter: \"s\" : navigatedDate() : minDate() : maxDate(); track s) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"s.value === second()\"\n [value]=\"s.value\"\n [id]=\"`${secondListId}${s.value}`\"\n (click)=\"onSecondChange(s.value)\">\n {{ s.value | number: \"2.0\" }}\n </li>\n }\n </ol>\n }\n @if (hourFormat() === \"12\") {\n <ol\n #meridiemList\n monaTimeSelectorList\n aria-label=\"AM/PM\"\n [attr.aria-activedescendant]=\"`${meridiemListId}${meridiem()}`\"\n [active]=\"focusedList() === 'meridiem'\"\n [id]=\"meridiemListId\"\n [popupHeight]=\"computedPopupHeight()\"\n [size]=\"size()\">\n @if (amMeridiemVisible()) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"meridiem() === 'AM'\"\n [value]=\"'AM'\"\n (click)=\"onMeridiemClick('AM')\"\n [id]=\"`${meridiemListId}AM`\">\n AM\n </li>\n }\n @if (pmMeridiemVisible()) {\n <li\n monaTimeSelectorItem\n [size]=\"size()\"\n [selected]=\"meridiem() === 'PM'\"\n [value]=\"'PM'\"\n (click)=\"onMeridiemClick('PM')\"\n [id]=\"`${meridiemListId}PM`\">\n PM\n </li>\n }\n </ol>\n }\n</div>\n\n@if (footer()) {\n <div [class]=\"footerClass()\">\n <button monaButton look=\"primary\" [rounded]=\"rounded()\" [size]=\"size()\" (click)=\"onSetTimeClick()\">Set</button>\n </div>\n}\n", dependencies: [{ kind: "directive", type: TimeSelectorItemDirective, selector: "li[monaTimeSelectorItem]", inputs: ["selected", "size", "value"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: TimeSelectorListDirective, selector: "ol[monaTimeSelectorList]", inputs: ["active", "popupHeight", "size"] }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: TimeLimiterPipe, name: "timeLimiter" }] }); }
|
|
634
634
|
}
|
|
635
635
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: TimeSelectorComponent, decorators: [{
|
|
636
636
|
type: Component,
|
|
@@ -709,7 +709,7 @@ class WindowContentComponent {
|
|
|
709
709
|
}
|
|
710
710
|
}
|
|
711
711
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: WindowContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
712
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: WindowContentComponent, isStandalone: true, selector: "mona-window-content", host: { attributes: { "role": "dialog" }, properties: { "class": "baseClass()", "attr.aria-labelledby": "headerId", "attr.aria-modal": "windowData.modal ?? false" } }, viewQueries: [{ propertyName: "componentAnchor", first: true, predicate: ["componentAnchor"], descendants: true, read: ViewContainerRef, isSignal: true }], hostDirectives: [{ directive: i1.CdkTrapFocus }], ngImport: i0, template: "<div [class]=\"contentContainerClass()\">\n <div\n [class]=\"titleBarClass()\"\n monaWindowDragHandler\n (dblclick)=\"onMaximizeClick()\"\n [draggable]=\"windowData.draggable\"\n [windowRef]=\"windowData.windowReference\"\n [attr.tabindex]=\"windowData.draggable ? 0 : null\"\n [attr.aria-label]=\"windowData.draggable ? 'Move window. Use arrow keys to move.' : null\">\n <div [id]=\"headerId\" [class]=\"titleContainerClass()\">\n @if (windowData.titleTemplate) {\n <ng-container [ngTemplateOutlet]=\"windowData.titleTemplate\"></ng-container>\n } @else {\n <span [class]=\"titleClass()\">{{ windowData.title ?? \"\" }}</span>\n }\n </div>\n <div [class]=\"titleBarActionClass()\">\n @if (windowData.actionTemplate) {\n <ng-container\n [ngTemplateOutlet]=\"windowData.actionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: windowData.windowReference.windowRef }\">\n </ng-container>\n }\n @let maximizeTitle = maximized() || minimized() ? \"Restore\" : \"Maximize\";\n @if (windowData.minimizable && !minimized()) {\n <button\n monaButton\n look=\"ghost\"\n size=\"small\"\n type=\"button\"\n [iconOnly]=\"true\"\n [rounded]=\"windowData.rounded\"\n [title]=\"'Minimize'\"\n aria-label=\"Minimize\"\n (dblclick)=\"$event.stopPropagation()\"\n (click)=\"onMinimizeClick()\">\n <svg lucideMinus [size]=\"16\" aria-hidden=\"true\"></svg>\n </button>\n }\n @if (windowData.maximizable) {\n <button\n monaButton\n look=\"ghost\"\n size=\"small\"\n type=\"button\"\n [iconOnly]=\"true\"\n [rounded]=\"windowData.rounded\"\n [title]=\"maximizeTitle\"\n [attr.aria-label]=\"maximizeTitle\"\n (dblclick)=\"$event.stopPropagation()\"\n (click)=\"onMaximizeClick()\">\n <svg [lucideIcon]=\"maximizeIcon()\" [size]=\"16\" aria-hidden=\"true\"></svg>\n </button>\n }\n @if (windowData.closable) {\n <button\n monaButton\n look=\"ghost\"\n size=\"small\"\n type=\"button\"\n [iconOnly]=\"true\"\n [rounded]=\"windowData.rounded\"\n title=\"Close\"\n aria-label=\"Close window\"\n (dblclick)=\"$event.stopPropagation()\"\n (click)=\"onCloseClick($event)\">\n <svg lucideX [size]=\"16\" aria-hidden=\"true\"></svg>\n </button>\n }\n </div>\n </div>\n @if (!minimized()) {\n <div [class]=\"contentClass()\">\n @switch (contentType()) {\n @case (\"template\") {\n <ng-container [ngTemplateOutlet]=\"contentTemplate()!\"></ng-container>\n }\n @case (\"component\") {\n <ng-container #componentAnchor></ng-container>\n }\n }\n </div>\n @if (windowData.footerTemplate) {\n <div>\n <ng-container [ngTemplateOutlet]=\"windowData.footerTemplate\"></ng-container>\n </div>\n }\n }\n @if (windowData.resizable && !maximized()) {\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"north\"\n tabindex=\"0\"\n aria-label=\"Resize window from the top. Use arrow keys to resize.\"\n [class]=\"'north' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"south\"\n tabindex=\"0\"\n aria-label=\"Resize window from the bottom. Use arrow keys to resize.\"\n [class]=\"'south' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"east\"\n tabindex=\"0\"\n aria-label=\"Resize window from the right. Use arrow keys to resize.\"\n [class]=\"'east' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"west\"\n tabindex=\"0\"\n aria-label=\"Resize window from the left. Use arrow keys to resize.\"\n [class]=\"'west' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"northeast\"\n tabindex=\"0\"\n aria-label=\"Resize window from the top-right corner. Use arrow keys to resize.\"\n [class]=\"'northeast' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"northwest\"\n tabindex=\"0\"\n aria-label=\"Resize window from the top-left corner. Use arrow keys to resize.\"\n [class]=\"'northwest' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"southeast\"\n tabindex=\"0\"\n aria-label=\"Resize window from the bottom-right corner. Use arrow keys to resize.\"\n [class]=\"'southeast' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"southwest\"\n tabindex=\"0\"\n aria-label=\"Resize window from the bottom-left corner. Use arrow keys to resize.\"\n [class]=\"'southwest' | monaResizePosition\"></div>\n }\n</div>\n", dependencies: [{ kind: "directive", type: WindowDragHandlerDirective, selector: "div[monaWindowDragHandler]", inputs: ["draggable", "windowRef"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: WindowResizeHandlerDirective, selector: "div[monaWindowResizeHandler]", inputs: ["direction", "maxHeight", "maxWidth", "minHeight", "minWidth", "windowRef"] }, { kind: "component", type: LucideMinus, selector: "svg[lucideMinus]" }, { kind: "component", type: LucideDynamicIcon, selector: "svg[lucideIcon]", inputs: ["lucideIcon"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "pipe", type: ResizePositionPipe, name: "monaResizePosition" }] }); }
|
|
712
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: WindowContentComponent, isStandalone: true, selector: "mona-window-content", host: { attributes: { "role": "dialog" }, properties: { "class": "baseClass()", "attr.aria-labelledby": "headerId", "attr.aria-modal": "windowData.modal ?? false" } }, viewQueries: [{ propertyName: "componentAnchor", first: true, predicate: ["componentAnchor"], descendants: true, read: ViewContainerRef, isSignal: true }], hostDirectives: [{ directive: i1.CdkTrapFocus }], ngImport: i0, template: "<div [class]=\"contentContainerClass()\">\n <div\n [class]=\"titleBarClass()\"\n monaWindowDragHandler\n (dblclick)=\"onMaximizeClick()\"\n [draggable]=\"windowData.draggable\"\n [windowRef]=\"windowData.windowReference\"\n [attr.tabindex]=\"windowData.draggable ? 0 : null\"\n [attr.aria-label]=\"windowData.draggable ? 'Move window. Use arrow keys to move.' : null\">\n <div [id]=\"headerId\" [class]=\"titleContainerClass()\">\n @if (windowData.titleTemplate) {\n <ng-container [ngTemplateOutlet]=\"windowData.titleTemplate\"></ng-container>\n } @else {\n <span [class]=\"titleClass()\">{{ windowData.title ?? \"\" }}</span>\n }\n </div>\n <div [class]=\"titleBarActionClass()\">\n @if (windowData.actionTemplate) {\n <ng-container\n [ngTemplateOutlet]=\"windowData.actionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: windowData.windowReference.windowRef }\">\n </ng-container>\n }\n @let maximizeTitle = maximized() || minimized() ? \"Restore\" : \"Maximize\";\n @if (windowData.minimizable && !minimized()) {\n <button\n monaButton\n look=\"ghost\"\n size=\"small\"\n type=\"button\"\n [iconOnly]=\"true\"\n [rounded]=\"windowData.rounded\"\n [title]=\"'Minimize'\"\n aria-label=\"Minimize\"\n (dblclick)=\"$event.stopPropagation()\"\n (click)=\"onMinimizeClick()\">\n <svg lucideMinus [size]=\"16\" aria-hidden=\"true\"></svg>\n </button>\n }\n @if (windowData.maximizable) {\n <button\n monaButton\n look=\"ghost\"\n size=\"small\"\n type=\"button\"\n [iconOnly]=\"true\"\n [rounded]=\"windowData.rounded\"\n [title]=\"maximizeTitle\"\n [attr.aria-label]=\"maximizeTitle\"\n (dblclick)=\"$event.stopPropagation()\"\n (click)=\"onMaximizeClick()\">\n <svg [lucideIcon]=\"maximizeIcon()\" [size]=\"16\" aria-hidden=\"true\"></svg>\n </button>\n }\n @if (windowData.closable) {\n <button\n monaButton\n look=\"ghost\"\n size=\"small\"\n type=\"button\"\n [iconOnly]=\"true\"\n [rounded]=\"windowData.rounded\"\n title=\"Close\"\n aria-label=\"Close window\"\n (dblclick)=\"$event.stopPropagation()\"\n (click)=\"onCloseClick($event)\">\n <svg lucideX [size]=\"16\" aria-hidden=\"true\"></svg>\n </button>\n }\n </div>\n </div>\n @if (!minimized()) {\n <div [class]=\"contentClass()\">\n @switch (contentType()) {\n @case (\"template\") {\n <ng-container [ngTemplateOutlet]=\"contentTemplate()!\"></ng-container>\n }\n @case (\"component\") {\n <ng-container #componentAnchor></ng-container>\n }\n }\n </div>\n @if (windowData.footerTemplate) {\n <div>\n <ng-container [ngTemplateOutlet]=\"windowData.footerTemplate\"></ng-container>\n </div>\n }\n }\n @if (windowData.resizable && !maximized()) {\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"north\"\n tabindex=\"0\"\n aria-label=\"Resize window from the top. Use arrow keys to resize.\"\n [class]=\"'north' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"south\"\n tabindex=\"0\"\n aria-label=\"Resize window from the bottom. Use arrow keys to resize.\"\n [class]=\"'south' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"east\"\n tabindex=\"0\"\n aria-label=\"Resize window from the right. Use arrow keys to resize.\"\n [class]=\"'east' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"west\"\n tabindex=\"0\"\n aria-label=\"Resize window from the left. Use arrow keys to resize.\"\n [class]=\"'west' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"northeast\"\n tabindex=\"0\"\n aria-label=\"Resize window from the top-right corner. Use arrow keys to resize.\"\n [class]=\"'northeast' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"northwest\"\n tabindex=\"0\"\n aria-label=\"Resize window from the top-left corner. Use arrow keys to resize.\"\n [class]=\"'northwest' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"southeast\"\n tabindex=\"0\"\n aria-label=\"Resize window from the bottom-right corner. Use arrow keys to resize.\"\n [class]=\"'southeast' | monaResizePosition\"></div>\n <div\n monaWindowResizeHandler\n [minWidth]=\"windowData.minWidth\"\n [minHeight]=\"windowData.minHeight\"\n [maxWidth]=\"windowData.maxWidth\"\n [maxHeight]=\"windowData.maxHeight\"\n [windowRef]=\"windowData.windowReference\"\n direction=\"southwest\"\n tabindex=\"0\"\n aria-label=\"Resize window from the bottom-left corner. Use arrow keys to resize.\"\n [class]=\"'southwest' | monaResizePosition\"></div>\n }\n</div>\n", dependencies: [{ kind: "directive", type: WindowDragHandlerDirective, selector: "div[monaWindowDragHandler]", inputs: ["draggable", "windowRef"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "directive", type: WindowResizeHandlerDirective, selector: "div[monaWindowResizeHandler]", inputs: ["direction", "maxHeight", "maxWidth", "minHeight", "minWidth", "windowRef"] }, { kind: "component", type: LucideMinus, selector: "svg[lucideMinus]" }, { kind: "component", type: LucideDynamicIcon, selector: "svg[lucideIcon]", inputs: ["lucideIcon"] }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "pipe", type: ResizePositionPipe, name: "monaResizePosition" }] }); }
|
|
713
713
|
}
|
|
714
714
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: WindowContentComponent, decorators: [{
|
|
715
715
|
type: Component,
|
package/package.json
CHANGED
|
@@ -80,6 +80,12 @@ declare class ButtonDirective implements ButtonVariantsInput {
|
|
|
80
80
|
* @default 0
|
|
81
81
|
*/
|
|
82
82
|
readonly tabindex: _angular_core.InputSignalWithTransform<number, string | number>;
|
|
83
|
+
/**
|
|
84
|
+
* @description Native `type` attribute of the button. Defaults to `"button"` to prevent accidental
|
|
85
|
+
* form submission; set to `"submit"` or `"reset"` explicitly when that behavior is intended.
|
|
86
|
+
* @default "button"
|
|
87
|
+
*/
|
|
88
|
+
readonly type: _angular_core.InputSignal<"button" | "reset" | "submit">;
|
|
83
89
|
/**
|
|
84
90
|
* @description Enables toggle behavior — each click flips the `selected` state and `aria-pressed` is managed.
|
|
85
91
|
* Must use `[toggleable]="true"` binding syntax, not bare attribute form.
|
|
@@ -93,7 +99,7 @@ declare class ButtonDirective implements ButtonVariantsInput {
|
|
|
93
99
|
readonly userClass: _angular_core.InputSignal<string>;
|
|
94
100
|
constructor();
|
|
95
101
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonDirective, never>;
|
|
96
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ButtonDirective, "button[monaButton]", never, { "ariaHasPopup": { "alias": "aria-haspopup"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "iconOnly": { "alias": "iconOnly"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "look": { "alias": "look"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "tabindex": { "alias": "tabindex"; "required": false; "isSignal": true; }; "toggleable": { "alias": "toggleable"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "loading": "loadingChange"; "look": "lookChange"; "selected": "selectedChange"; }, never, never, true, never>;
|
|
102
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ButtonDirective, "button[monaButton]", never, { "ariaHasPopup": { "alias": "aria-haspopup"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "iconOnly": { "alias": "iconOnly"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "look": { "alias": "look"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "tabindex": { "alias": "tabindex"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "toggleable": { "alias": "toggleable"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "loading": "loadingChange"; "look": "lookChange"; "selected": "selectedChange"; }, never, never, true, never>;
|
|
97
103
|
}
|
|
98
104
|
|
|
99
105
|
declare class ButtonService {
|