@progressio_resources/gravity-design-system 2.0.6 → 2.0.8
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/esm2022/lib/components/gravity-attach-file/gravity-attach-file.component.mjs +2 -2
- package/esm2022/lib/components/gravity-button/gravity-button.component.mjs +5 -3
- package/esm2022/lib/components/gravity-calendar/gravity-calendar.component.mjs +40 -13
- package/esm2022/lib/components/gravity-calendar/gravity-month-picker/gravity-month-picker.component.mjs +136 -0
- package/esm2022/lib/components/gravity-text-field/gravity-text-field.component.mjs +1 -1
- package/esm2022/lib/gravity-design-system.module.mjs +4 -1
- package/fesm2022/progressio_resources-gravity-design-system.mjs +179 -16
- package/fesm2022/progressio_resources-gravity-design-system.mjs.map +1 -1
- package/lib/components/gravity-button/gravity-button.component.d.ts +4 -3
- package/lib/components/gravity-calendar/gravity-calendar.component.d.ts +13 -2
- package/lib/components/gravity-calendar/gravity-month-picker/gravity-month-picker.component.d.ts +40 -0
- package/lib/components/gravity-text-field/gravity-text-field.component.d.ts +1 -1
- package/lib/gravity-design-system.module.d.ts +15 -14
- package/package.json +1 -1
- package/src/lib/styles/foundations/colors/themes/_hero.theme.scss +21 -21
|
@@ -36,15 +36,17 @@ class GravityButtonComponent {
|
|
|
36
36
|
this.size = "md";
|
|
37
37
|
}
|
|
38
38
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
39
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityButtonComponent, selector: "gravity-button", inputs: { cypressTag: "cypressTag", disabled: "disabled", iconName: "iconName", isLoading: "isLoading", size: "size", type: "type" }, ngImport: i0, template: "<button [attr.data-cy]=\"cypressTag\" class=\"gravity-button-{{type}} gravity-size-{{size}} hr-label md-bold\"\n [disabled]=\"disabled\" [style]=\"isLoading ? {'pointer-events': 'none'} : {}\">\n <ng-container *ngIf=\"!isLoading\">\n <gravity-icon class=\"placement-left\" [customIconColorVariable]=\"'var(--button-text-color)'\"\n [hoverIcon]=\"false\" [iconName]=\"iconName\" *ngIf=\"iconName\"></gravity-icon>\n <ng-content></ng-content>\n </ng-container>\n <ng-container *ngIf=\"isLoading\">\n <ngb-progressbar [animated]=\"true\" [striped]=\"true\" [value]=\"100\"></ngb-progressbar>\n </ng-container>\n</button>\n", styles: [":host{display:block;width:max-content}.gravity-button,.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]){align-items:center;display:flex;border-style:solid;border-width:.125rem;border-radius:.625rem;box-shadow:0 3px 6px #00000029;cursor:pointer;height:var(--button-height);justify-content:center;min-width:-moz-fit-content;min-width:fit-content;width:100%}.gravity-button.gravity-size-md,.gravity-size-md.gravity-button-style,.gravity-size-md.gravity-button-primary[disabled],.gravity-size-md.gravity-button-secondary[disabled],.gravity-size-md.gravity-button-tertiary[disabled],.gravity-size-md.gravity-button-positive[disabled],.gravity-size-md.gravity-button-negative[disabled],.gravity-size-md.gravity-button-alternative[disabled],.gravity-size-md.gravity-button-disabled,.gravity-size-md.gravity-button-alternative:not([disabled]),.gravity-size-md.gravity-button-negative:not([disabled]),.gravity-size-md.gravity-button-positive:not([disabled]),.gravity-size-md.gravity-button-tertiary:not([disabled]),.gravity-size-md.gravity-button-secondary:not([disabled]),.gravity-size-md.gravity-button-primary:not([disabled]){--button-height: 2.75rem}.gravity-button.gravity-size-sm,.gravity-size-sm.gravity-button-style,.gravity-size-sm.gravity-button-primary[disabled],.gravity-size-sm.gravity-button-secondary[disabled],.gravity-size-sm.gravity-button-tertiary[disabled],.gravity-size-sm.gravity-button-positive[disabled],.gravity-size-sm.gravity-button-negative[disabled],.gravity-size-sm.gravity-button-alternative[disabled],.gravity-size-sm.gravity-button-disabled,.gravity-size-sm.gravity-button-alternative:not([disabled]),.gravity-size-sm.gravity-button-negative:not([disabled]),.gravity-size-sm.gravity-button-positive:not([disabled]),.gravity-size-sm.gravity-button-tertiary:not([disabled]),.gravity-size-sm.gravity-button-secondary:not([disabled]),.gravity-size-sm.gravity-button-primary:not([disabled]){--button-height: 2rem}.gravity-button gravity-icon.placement-left,.gravity-button-style gravity-icon.placement-left,.gravity-button-primary[disabled] gravity-icon.placement-left,.gravity-button-secondary[disabled] gravity-icon.placement-left,.gravity-button-tertiary[disabled] gravity-icon.placement-left,.gravity-button-positive[disabled] gravity-icon.placement-left,.gravity-button-negative[disabled] gravity-icon.placement-left,.gravity-button-alternative[disabled] gravity-icon.placement-left,.gravity-button-disabled gravity-icon.placement-left,.gravity-button-alternative:not([disabled]) gravity-icon.placement-left,.gravity-button-negative:not([disabled]) gravity-icon.placement-left,.gravity-button-positive:not([disabled]) gravity-icon.placement-left,.gravity-button-tertiary:not([disabled]) gravity-icon.placement-left,.gravity-button-secondary:not([disabled]) gravity-icon.placement-left,.gravity-button-primary:not([disabled]) gravity-icon.placement-left{margin-right:.5rem}.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]){background-color:var(--button-background-color);border-color:var(--button-border-color)}.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]),.gravity-button-style p,.gravity-button-primary[disabled] p,.gravity-button-secondary[disabled] p,.gravity-button-tertiary[disabled] p,.gravity-button-positive[disabled] p,.gravity-button-negative[disabled] p,.gravity-button-alternative[disabled] p,.gravity-button-disabled p,.gravity-button-alternative:not([disabled]) p,.gravity-button-negative:not([disabled]) p,.gravity-button-positive:not([disabled]) p,.gravity-button-tertiary:not([disabled]) p,.gravity-button-secondary:not([disabled]) p,.gravity-button-primary:not([disabled]) p{color:var(--button-text-color)}.gravity-button-style ngb-progressbar ::ng-deep .progress-bar,.gravity-button-primary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-secondary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-tertiary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-positive[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-negative[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-alternative[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-disabled ngb-progressbar ::ng-deep .progress-bar,.gravity-button-alternative:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-negative:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-positive:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-tertiary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-secondary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-primary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar{background-color:var(--progressbar-color)}.gravity-button-primary:not([disabled]){--button-background-color: var(--bg-button-active-primary);--button-border-color: var(--bg-button-active-primary);--button-text-color: var(--on-bg-button-active-primary);--progressbar-color: var(--bg-button-active-primary)}.gravity-button-primary:not([disabled]):hover{--button-background-color: var(--bg-button-hover-primary);--button-border-color: var(--bg-button-hover-primary);--button-text-color: var(--on-bg-button-hover-primary)}.gravity-button-primary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-primary);--button-border-color: var(--bg-button-pressed-primary);--button-text-color: var(--on-bg-button-pressed-primary)}.gravity-button-secondary:not([disabled]){--button-background-color: var(--bg-button-active-secondary);--button-border-color: var(--outline-button-active-secondary);--button-text-color: var(--on-bg-button-active-secondary);--progressbar-color: var(--on-bg-button-active-secondary)}.gravity-button-secondary:not([disabled]):hover{--button-background-color: var(--bg-button-hover-secondary);--button-border-color: var(--outline-button-hover-secondary);--button-text-color: var(--on-bg-button-hover-secondary)}.gravity-button-secondary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-secondary);--button-border-color: var(--outline-button-pressed-secondary);--button-text-color: var(--on-bg-button-pressed-secondary)}.gravity-button-tertiary:not([disabled]){--button-background-color: var(--bg-button-active-tertiary);--button-border-color: var(--bg-button-active-tertiary);--button-text-color: var(--on-bg-button-active-tertiary);--progressbar-color: var(--bg-button-active-tertiary)}.gravity-button-tertiary:not([disabled]):hover{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}.gravity-button-tertiary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-tertiary);--button-border-color: var(--bg-button-pressed-tertiary);--button-text-color: var(--on-bg-button-pressed-tertiary)}.gravity-button-positive:not([disabled]){--button-background-color: var(--bg-button-active-positive);--button-border-color: var(--bg-button-active-positive);--button-text-color: var(--on-bg-button-active-positive);--progressbar-color: var(--bg-button-active-positive)}.gravity-button-positive:not([disabled]):hover{--button-background-color: var(--bg-button-hover-positive);--button-border-color: var(--bg-button-hover-positive);--button-text-color: var(--on-bg-button-hover-positive)}.gravity-button-positive:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-positive);--button-border-color: var(--bg-button-pressed-positive);--button-text-color: var(--on-bg-button-pressed-positive)}.gravity-button-negative:not([disabled]){--button-background-color: var(--bg-button-active-negative);--button-border-color: var(--bg-button-active-negative);--button-text-color: var(--on-bg-button-active-negative);--progressbar-color: var(--bg-button-active-negative)}.gravity-button-negative:not([disabled]):hover{--button-background-color: var(--bg-button-hover-negative);--button-border-color: var(--bg-button-hover-negative);--button-text-color: var(--on-bg-button-hover-negative)}.gravity-button-negative:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-negative);--button-border-color: var(--bg-button-pressed-negative);--button-text-color: var(--on-bg-button-pressed-negative)}.gravity-button-alternative:not([disabled]){--button-background-color: var(--bg-button-active-alternative);--button-border-color: var(--bg-button-active-alternative);--button-text-color: var(--on-bg-button-active-alternative);--progressbar-color: var(--bg-button-active-alternative)}.gravity-button-alternative:not([disabled]):hover{--button-background-color: var(--bg-button-hover-alternative);--button-border-color: var(--bg-button-hover-alternative);--button-text-color: var(--on-bg-button-hover-alternative)}.gravity-button-alternative:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-alternative);--button-border-color: var(--bg-button-pressed-alternative);--button-text-color: var(--on-bg-button-pressed-alternative)}.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled{--button-background-color: var(--bg-disabled);--button-border-color: var(--bg-disabled);--button-text-color: var(--on-bg-disabled);--progressbar-color: var(--bg-disabled);cursor:default}ngb-progressbar{width:100%}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$2.NgbProgressbar, selector: "ngb-progressbar", inputs: ["max", "animated", "ariaLabel", "striped", "showValue", "textType", "type", "value", "height"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "hoverIcon"] }] }); }
|
|
39
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityButtonComponent, selector: "gravity-button", inputs: { cypressTag: "cypressTag", disabled: "disabled", customState: "customState", iconName: "iconName", isLoading: "isLoading", size: "size", type: "type" }, ngImport: i0, template: "<button [attr.data-cy]=\"cypressTag\" [disabled]=\"disabled\" [style]=\"isLoading ? {'pointer-events': 'none'} : {}\"\n class=\"border-radius-sm gravity-button-{{type}} gravity-size-{{size}} hr-label {{size}}-bold {{customState}}\">\n <ng-container *ngIf=\"!isLoading\">\n <gravity-icon [customIconColorVariable]=\"'var(--button-text-color)'\"\n [hoverIcon]=\"false\" [iconName]=\"iconName\" *ngIf=\"iconName\"></gravity-icon>\n <span class=\"button-content-wrapper\">\n <ng-content></ng-content>\n </span>\n </ng-container>\n <ng-container *ngIf=\"isLoading\">\n <ngb-progressbar [animated]=\"true\" [striped]=\"true\" [value]=\"100\"></ngb-progressbar>\n </ng-container>\n</button>\n", styles: [":host{display:block;width:max-content}.gravity-button,.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]){align-items:center;display:flex;border-style:solid;cursor:pointer;min-width:-moz-fit-content;min-width:fit-content;width:100%}.gravity-button.gravity-size-sm,.gravity-size-sm.gravity-button-style,.gravity-size-sm.gravity-button-primary[disabled],.gravity-size-sm.gravity-button-secondary[disabled],.gravity-size-sm.gravity-button-tertiary[disabled],.gravity-size-sm.gravity-button-positive[disabled],.gravity-size-sm.gravity-button-negative[disabled],.gravity-size-sm.gravity-button-alternative[disabled],.gravity-size-sm.gravity-button-disabled,.gravity-size-sm.gravity-button-alternative:not([disabled]),.gravity-size-sm.gravity-button-negative:not([disabled]),.gravity-size-sm.gravity-button-positive:not([disabled]),.gravity-size-sm.gravity-button-tertiary:not([disabled]),.gravity-size-sm.gravity-button-secondary:not([disabled]),.gravity-size-sm.gravity-button-primary:not([disabled]){border-width:.0625rem;height:1.8125rem;padding:.625rem .75rem}.gravity-button.gravity-size-sm gravity-icon,.gravity-size-sm.gravity-button-style gravity-icon,.gravity-size-sm.gravity-button-primary[disabled] gravity-icon,.gravity-size-sm.gravity-button-secondary[disabled] gravity-icon,.gravity-size-sm.gravity-button-tertiary[disabled] gravity-icon,.gravity-size-sm.gravity-button-positive[disabled] gravity-icon,.gravity-size-sm.gravity-button-negative[disabled] gravity-icon,.gravity-size-sm.gravity-button-alternative[disabled] gravity-icon,.gravity-size-sm.gravity-button-disabled gravity-icon,.gravity-size-sm.gravity-button-alternative:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-negative:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-positive:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-tertiary:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-secondary:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-primary:not([disabled]) gravity-icon{--icon-height: .5625rem;--icon-width: .5625rem}.gravity-button.gravity-size-sm gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-style gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-primary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-secondary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-tertiary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-positive[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-negative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-alternative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-disabled gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-alternative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-negative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-positive:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-tertiary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-secondary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-primary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty){margin-left:.3125rem}.gravity-button.gravity-size-md,.gravity-size-md.gravity-button-style,.gravity-size-md.gravity-button-primary[disabled],.gravity-size-md.gravity-button-secondary[disabled],.gravity-size-md.gravity-button-tertiary[disabled],.gravity-size-md.gravity-button-positive[disabled],.gravity-size-md.gravity-button-negative[disabled],.gravity-size-md.gravity-button-alternative[disabled],.gravity-size-md.gravity-button-disabled,.gravity-size-md.gravity-button-alternative:not([disabled]),.gravity-size-md.gravity-button-negative:not([disabled]),.gravity-size-md.gravity-button-positive:not([disabled]),.gravity-size-md.gravity-button-tertiary:not([disabled]),.gravity-size-md.gravity-button-secondary:not([disabled]),.gravity-size-md.gravity-button-primary:not([disabled]){border-width:.125rem;height:2.3125rem;padding:.75rem .875rem}.gravity-button.gravity-size-md gravity-icon,.gravity-size-md.gravity-button-style gravity-icon,.gravity-size-md.gravity-button-primary[disabled] gravity-icon,.gravity-size-md.gravity-button-secondary[disabled] gravity-icon,.gravity-size-md.gravity-button-tertiary[disabled] gravity-icon,.gravity-size-md.gravity-button-positive[disabled] gravity-icon,.gravity-size-md.gravity-button-negative[disabled] gravity-icon,.gravity-size-md.gravity-button-alternative[disabled] gravity-icon,.gravity-size-md.gravity-button-disabled gravity-icon,.gravity-size-md.gravity-button-alternative:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-negative:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-positive:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-tertiary:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-secondary:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-primary:not([disabled]) gravity-icon{--icon-height: .8125rem;--icon-width: .8125rem}.gravity-button.gravity-size-md gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-style gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-primary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-secondary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-tertiary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-positive[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-negative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-alternative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-disabled gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-alternative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-negative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-positive:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-tertiary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-secondary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-primary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty){margin-left:.3125rem}.gravity-button.gravity-size-lg,.gravity-size-lg.gravity-button-style,.gravity-size-lg.gravity-button-primary[disabled],.gravity-size-lg.gravity-button-secondary[disabled],.gravity-size-lg.gravity-button-tertiary[disabled],.gravity-size-lg.gravity-button-positive[disabled],.gravity-size-lg.gravity-button-negative[disabled],.gravity-size-lg.gravity-button-alternative[disabled],.gravity-size-lg.gravity-button-disabled,.gravity-size-lg.gravity-button-alternative:not([disabled]),.gravity-size-lg.gravity-button-negative:not([disabled]),.gravity-size-lg.gravity-button-positive:not([disabled]),.gravity-size-lg.gravity-button-tertiary:not([disabled]),.gravity-size-lg.gravity-button-secondary:not([disabled]),.gravity-size-lg.gravity-button-primary:not([disabled]){border-width:.125rem;height:3rem;padding:.875rem 1rem}.gravity-button.gravity-size-lg gravity-icon,.gravity-size-lg.gravity-button-style gravity-icon,.gravity-size-lg.gravity-button-primary[disabled] gravity-icon,.gravity-size-lg.gravity-button-secondary[disabled] gravity-icon,.gravity-size-lg.gravity-button-tertiary[disabled] gravity-icon,.gravity-size-lg.gravity-button-positive[disabled] gravity-icon,.gravity-size-lg.gravity-button-negative[disabled] gravity-icon,.gravity-size-lg.gravity-button-alternative[disabled] gravity-icon,.gravity-size-lg.gravity-button-disabled gravity-icon,.gravity-size-lg.gravity-button-alternative:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-negative:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-positive:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-tertiary:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-secondary:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-primary:not([disabled]) gravity-icon{--icon-height: 1.25rem;--icon-width: 1.25rem}.gravity-button.gravity-size-lg gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-style gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-primary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-secondary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-tertiary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-positive[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-negative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-alternative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-disabled gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-alternative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-negative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-positive:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-tertiary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-secondary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-primary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty){margin-left:.625rem}.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]){background-color:var(--button-background-color);border-color:var(--button-border-color)}.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]),.gravity-button-style p,.gravity-button-primary[disabled] p,.gravity-button-secondary[disabled] p,.gravity-button-tertiary[disabled] p,.gravity-button-positive[disabled] p,.gravity-button-negative[disabled] p,.gravity-button-alternative[disabled] p,.gravity-button-disabled p,.gravity-button-alternative:not([disabled]) p,.gravity-button-negative:not([disabled]) p,.gravity-button-positive:not([disabled]) p,.gravity-button-tertiary:not([disabled]) p,.gravity-button-secondary:not([disabled]) p,.gravity-button-primary:not([disabled]) p{color:var(--button-text-color)}.gravity-button-style ngb-progressbar ::ng-deep .progress-bar,.gravity-button-primary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-secondary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-tertiary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-positive[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-negative[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-alternative[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-disabled ngb-progressbar ::ng-deep .progress-bar,.gravity-button-alternative:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-negative:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-positive:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-tertiary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-secondary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-primary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar{background-color:var(--progressbar-color)}.gravity-button-primary:not([disabled]),.gravity-button-primary:not([disabled]).active{--button-background-color: var(--bg-button-active-primary);--button-border-color: var(--bg-button-active-primary);--button-text-color: var(--on-bg-button-active-primary);--progressbar-color: var(--bg-button-active-primary)}.gravity-button-primary:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-primary:not([disabled]).hover{--button-background-color: var(--bg-button-hover-primary);--button-border-color: var(--bg-button-hover-primary);--button-text-color: var(--on-bg-button-hover-primary)}.gravity-button-primary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-primary);--button-border-color: var(--bg-button-pressed-primary);--button-text-color: var(--on-bg-button-pressed-primary)}.gravity-button-secondary:not([disabled]),.gravity-button-secondary:not([disabled]).active{--button-background-color: var(--bg-button-active-secondary);--button-border-color: var(--outline-button-active-secondary);--button-text-color: var(--on-bg-button-active-secondary);--progressbar-color: var(--on-bg-button-active-secondary)}.gravity-button-secondary:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-secondary:not([disabled]).hover{--button-background-color: var(--bg-button-hover-secondary);--button-border-color: var(--outline-button-hover-secondary);--button-text-color: var(--on-bg-button-hover-secondary)}.gravity-button-secondary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-secondary);--button-border-color: var(--outline-button-pressed-secondary);--button-text-color: var(--on-bg-button-pressed-secondary)}.gravity-button-tertiary:not([disabled]),.gravity-button-tertiary:not([disabled]).active{--button-background-color: var(--bg-button-active-tertiary);--button-border-color: var(--bg-button-active-tertiary);--button-text-color: var(--on-bg-button-active-tertiary);--progressbar-color: var(--bg-button-active-tertiary)}.gravity-button-tertiary:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-tertiary:not([disabled]).hover{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}.gravity-button-tertiary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-tertiary);--button-border-color: var(--bg-button-pressed-tertiary);--button-text-color: var(--on-bg-button-pressed-tertiary)}.gravity-button-positive:not([disabled]),.gravity-button-positive:not([disabled]).active{--button-background-color: var(--bg-button-active-positive);--button-border-color: var(--bg-button-active-positive);--button-text-color: var(--on-bg-button-active-positive);--progressbar-color: var(--bg-button-active-positive)}.gravity-button-positive:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-positive:not([disabled]).hover{--button-background-color: var(--bg-button-hover-positive);--button-border-color: var(--bg-button-hover-positive);--button-text-color: var(--on-bg-button-hover-positive)}.gravity-button-positive:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-positive);--button-border-color: var(--bg-button-pressed-positive);--button-text-color: var(--on-bg-button-pressed-positive)}.gravity-button-negative:not([disabled]),.gravity-button-negative:not([disabled]).active{--button-background-color: var(--bg-button-active-negative);--button-border-color: var(--bg-button-active-negative);--button-text-color: var(--on-bg-button-active-negative);--progressbar-color: var(--bg-button-active-negative)}.gravity-button-negative:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-negative:not([disabled]).hover{--button-background-color: var(--bg-button-hover-negative);--button-border-color: var(--bg-button-hover-negative);--button-text-color: var(--on-bg-button-hover-negative)}.gravity-button-negative:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-negative);--button-border-color: var(--bg-button-pressed-negative);--button-text-color: var(--on-bg-button-pressed-negative)}.gravity-button-alternative:not([disabled]),.gravity-button-alternative:not([disabled]).active{--button-background-color: var(--bg-button-active-alternative);--button-border-color: var(--bg-button-active-alternative);--button-text-color: var(--on-bg-button-active-alternative);--progressbar-color: var(--bg-button-active-alternative)}.gravity-button-alternative:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-alternative:not([disabled]).hover{--button-background-color: var(--bg-button-hover-alternative);--button-border-color: var(--bg-button-hover-alternative);--button-text-color: var(--on-bg-button-hover-alternative)}.gravity-button-alternative:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-alternative);--button-border-color: var(--bg-button-pressed-alternative);--button-text-color: var(--on-bg-button-pressed-alternative)}.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled{--button-background-color: var(--bg-disabled);--button-border-color: var(--bg-disabled);--button-text-color: var(--on-bg-disabled);--progressbar-color: var(--bg-disabled);cursor:default}ngb-progressbar{width:100%}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$2.NgbProgressbar, selector: "ngb-progressbar", inputs: ["max", "animated", "ariaLabel", "striped", "showValue", "textType", "type", "value", "height"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "hoverIcon"] }] }); }
|
|
40
40
|
}
|
|
41
41
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityButtonComponent, decorators: [{
|
|
42
42
|
type: Component,
|
|
43
|
-
args: [{ selector: 'gravity-button', template: "<button [attr.data-cy]=\"cypressTag\" class=\"gravity-button-{{type}} gravity-size-{{size}} hr-label md-bold\"\n [disabled]=\"disabled\" [style]=\"isLoading ? {'pointer-events': 'none'} : {}\">\n <ng-container *ngIf=\"!isLoading\">\n <gravity-icon class=\"placement-left\" [customIconColorVariable]=\"'var(--button-text-color)'\"\n [hoverIcon]=\"false\" [iconName]=\"iconName\" *ngIf=\"iconName\"></gravity-icon>\n <ng-content></ng-content>\n </ng-container>\n <ng-container *ngIf=\"isLoading\">\n <ngb-progressbar [animated]=\"true\" [striped]=\"true\" [value]=\"100\"></ngb-progressbar>\n </ng-container>\n</button>\n", styles: [":host{display:block;width:max-content}.gravity-button,.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]){align-items:center;display:flex;border-style:solid;border-width:.125rem;border-radius:.625rem;box-shadow:0 3px 6px #00000029;cursor:pointer;height:var(--button-height);justify-content:center;min-width:-moz-fit-content;min-width:fit-content;width:100%}.gravity-button.gravity-size-md,.gravity-size-md.gravity-button-style,.gravity-size-md.gravity-button-primary[disabled],.gravity-size-md.gravity-button-secondary[disabled],.gravity-size-md.gravity-button-tertiary[disabled],.gravity-size-md.gravity-button-positive[disabled],.gravity-size-md.gravity-button-negative[disabled],.gravity-size-md.gravity-button-alternative[disabled],.gravity-size-md.gravity-button-disabled,.gravity-size-md.gravity-button-alternative:not([disabled]),.gravity-size-md.gravity-button-negative:not([disabled]),.gravity-size-md.gravity-button-positive:not([disabled]),.gravity-size-md.gravity-button-tertiary:not([disabled]),.gravity-size-md.gravity-button-secondary:not([disabled]),.gravity-size-md.gravity-button-primary:not([disabled]){--button-height: 2.75rem}.gravity-button.gravity-size-sm,.gravity-size-sm.gravity-button-style,.gravity-size-sm.gravity-button-primary[disabled],.gravity-size-sm.gravity-button-secondary[disabled],.gravity-size-sm.gravity-button-tertiary[disabled],.gravity-size-sm.gravity-button-positive[disabled],.gravity-size-sm.gravity-button-negative[disabled],.gravity-size-sm.gravity-button-alternative[disabled],.gravity-size-sm.gravity-button-disabled,.gravity-size-sm.gravity-button-alternative:not([disabled]),.gravity-size-sm.gravity-button-negative:not([disabled]),.gravity-size-sm.gravity-button-positive:not([disabled]),.gravity-size-sm.gravity-button-tertiary:not([disabled]),.gravity-size-sm.gravity-button-secondary:not([disabled]),.gravity-size-sm.gravity-button-primary:not([disabled]){--button-height: 2rem}.gravity-button gravity-icon.placement-left,.gravity-button-style gravity-icon.placement-left,.gravity-button-primary[disabled] gravity-icon.placement-left,.gravity-button-secondary[disabled] gravity-icon.placement-left,.gravity-button-tertiary[disabled] gravity-icon.placement-left,.gravity-button-positive[disabled] gravity-icon.placement-left,.gravity-button-negative[disabled] gravity-icon.placement-left,.gravity-button-alternative[disabled] gravity-icon.placement-left,.gravity-button-disabled gravity-icon.placement-left,.gravity-button-alternative:not([disabled]) gravity-icon.placement-left,.gravity-button-negative:not([disabled]) gravity-icon.placement-left,.gravity-button-positive:not([disabled]) gravity-icon.placement-left,.gravity-button-tertiary:not([disabled]) gravity-icon.placement-left,.gravity-button-secondary:not([disabled]) gravity-icon.placement-left,.gravity-button-primary:not([disabled]) gravity-icon.placement-left{margin-right:.5rem}.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]){background-color:var(--button-background-color);border-color:var(--button-border-color)}.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]),.gravity-button-style p,.gravity-button-primary[disabled] p,.gravity-button-secondary[disabled] p,.gravity-button-tertiary[disabled] p,.gravity-button-positive[disabled] p,.gravity-button-negative[disabled] p,.gravity-button-alternative[disabled] p,.gravity-button-disabled p,.gravity-button-alternative:not([disabled]) p,.gravity-button-negative:not([disabled]) p,.gravity-button-positive:not([disabled]) p,.gravity-button-tertiary:not([disabled]) p,.gravity-button-secondary:not([disabled]) p,.gravity-button-primary:not([disabled]) p{color:var(--button-text-color)}.gravity-button-style ngb-progressbar ::ng-deep .progress-bar,.gravity-button-primary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-secondary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-tertiary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-positive[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-negative[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-alternative[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-disabled ngb-progressbar ::ng-deep .progress-bar,.gravity-button-alternative:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-negative:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-positive:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-tertiary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-secondary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-primary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar{background-color:var(--progressbar-color)}.gravity-button-primary:not([disabled]){--button-background-color: var(--bg-button-active-primary);--button-border-color: var(--bg-button-active-primary);--button-text-color: var(--on-bg-button-active-primary);--progressbar-color: var(--bg-button-active-primary)}.gravity-button-primary:not([disabled]):hover{--button-background-color: var(--bg-button-hover-primary);--button-border-color: var(--bg-button-hover-primary);--button-text-color: var(--on-bg-button-hover-primary)}.gravity-button-primary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-primary);--button-border-color: var(--bg-button-pressed-primary);--button-text-color: var(--on-bg-button-pressed-primary)}.gravity-button-secondary:not([disabled]){--button-background-color: var(--bg-button-active-secondary);--button-border-color: var(--outline-button-active-secondary);--button-text-color: var(--on-bg-button-active-secondary);--progressbar-color: var(--on-bg-button-active-secondary)}.gravity-button-secondary:not([disabled]):hover{--button-background-color: var(--bg-button-hover-secondary);--button-border-color: var(--outline-button-hover-secondary);--button-text-color: var(--on-bg-button-hover-secondary)}.gravity-button-secondary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-secondary);--button-border-color: var(--outline-button-pressed-secondary);--button-text-color: var(--on-bg-button-pressed-secondary)}.gravity-button-tertiary:not([disabled]){--button-background-color: var(--bg-button-active-tertiary);--button-border-color: var(--bg-button-active-tertiary);--button-text-color: var(--on-bg-button-active-tertiary);--progressbar-color: var(--bg-button-active-tertiary)}.gravity-button-tertiary:not([disabled]):hover{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}.gravity-button-tertiary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-tertiary);--button-border-color: var(--bg-button-pressed-tertiary);--button-text-color: var(--on-bg-button-pressed-tertiary)}.gravity-button-positive:not([disabled]){--button-background-color: var(--bg-button-active-positive);--button-border-color: var(--bg-button-active-positive);--button-text-color: var(--on-bg-button-active-positive);--progressbar-color: var(--bg-button-active-positive)}.gravity-button-positive:not([disabled]):hover{--button-background-color: var(--bg-button-hover-positive);--button-border-color: var(--bg-button-hover-positive);--button-text-color: var(--on-bg-button-hover-positive)}.gravity-button-positive:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-positive);--button-border-color: var(--bg-button-pressed-positive);--button-text-color: var(--on-bg-button-pressed-positive)}.gravity-button-negative:not([disabled]){--button-background-color: var(--bg-button-active-negative);--button-border-color: var(--bg-button-active-negative);--button-text-color: var(--on-bg-button-active-negative);--progressbar-color: var(--bg-button-active-negative)}.gravity-button-negative:not([disabled]):hover{--button-background-color: var(--bg-button-hover-negative);--button-border-color: var(--bg-button-hover-negative);--button-text-color: var(--on-bg-button-hover-negative)}.gravity-button-negative:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-negative);--button-border-color: var(--bg-button-pressed-negative);--button-text-color: var(--on-bg-button-pressed-negative)}.gravity-button-alternative:not([disabled]){--button-background-color: var(--bg-button-active-alternative);--button-border-color: var(--bg-button-active-alternative);--button-text-color: var(--on-bg-button-active-alternative);--progressbar-color: var(--bg-button-active-alternative)}.gravity-button-alternative:not([disabled]):hover{--button-background-color: var(--bg-button-hover-alternative);--button-border-color: var(--bg-button-hover-alternative);--button-text-color: var(--on-bg-button-hover-alternative)}.gravity-button-alternative:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-alternative);--button-border-color: var(--bg-button-pressed-alternative);--button-text-color: var(--on-bg-button-pressed-alternative)}.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled{--button-background-color: var(--bg-disabled);--button-border-color: var(--bg-disabled);--button-text-color: var(--on-bg-disabled);--progressbar-color: var(--bg-disabled);cursor:default}ngb-progressbar{width:100%}\n"] }]
|
|
43
|
+
args: [{ selector: 'gravity-button', template: "<button [attr.data-cy]=\"cypressTag\" [disabled]=\"disabled\" [style]=\"isLoading ? {'pointer-events': 'none'} : {}\"\n class=\"border-radius-sm gravity-button-{{type}} gravity-size-{{size}} hr-label {{size}}-bold {{customState}}\">\n <ng-container *ngIf=\"!isLoading\">\n <gravity-icon [customIconColorVariable]=\"'var(--button-text-color)'\"\n [hoverIcon]=\"false\" [iconName]=\"iconName\" *ngIf=\"iconName\"></gravity-icon>\n <span class=\"button-content-wrapper\">\n <ng-content></ng-content>\n </span>\n </ng-container>\n <ng-container *ngIf=\"isLoading\">\n <ngb-progressbar [animated]=\"true\" [striped]=\"true\" [value]=\"100\"></ngb-progressbar>\n </ng-container>\n</button>\n", styles: [":host{display:block;width:max-content}.gravity-button,.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]){align-items:center;display:flex;border-style:solid;cursor:pointer;min-width:-moz-fit-content;min-width:fit-content;width:100%}.gravity-button.gravity-size-sm,.gravity-size-sm.gravity-button-style,.gravity-size-sm.gravity-button-primary[disabled],.gravity-size-sm.gravity-button-secondary[disabled],.gravity-size-sm.gravity-button-tertiary[disabled],.gravity-size-sm.gravity-button-positive[disabled],.gravity-size-sm.gravity-button-negative[disabled],.gravity-size-sm.gravity-button-alternative[disabled],.gravity-size-sm.gravity-button-disabled,.gravity-size-sm.gravity-button-alternative:not([disabled]),.gravity-size-sm.gravity-button-negative:not([disabled]),.gravity-size-sm.gravity-button-positive:not([disabled]),.gravity-size-sm.gravity-button-tertiary:not([disabled]),.gravity-size-sm.gravity-button-secondary:not([disabled]),.gravity-size-sm.gravity-button-primary:not([disabled]){border-width:.0625rem;height:1.8125rem;padding:.625rem .75rem}.gravity-button.gravity-size-sm gravity-icon,.gravity-size-sm.gravity-button-style gravity-icon,.gravity-size-sm.gravity-button-primary[disabled] gravity-icon,.gravity-size-sm.gravity-button-secondary[disabled] gravity-icon,.gravity-size-sm.gravity-button-tertiary[disabled] gravity-icon,.gravity-size-sm.gravity-button-positive[disabled] gravity-icon,.gravity-size-sm.gravity-button-negative[disabled] gravity-icon,.gravity-size-sm.gravity-button-alternative[disabled] gravity-icon,.gravity-size-sm.gravity-button-disabled gravity-icon,.gravity-size-sm.gravity-button-alternative:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-negative:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-positive:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-tertiary:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-secondary:not([disabled]) gravity-icon,.gravity-size-sm.gravity-button-primary:not([disabled]) gravity-icon{--icon-height: .5625rem;--icon-width: .5625rem}.gravity-button.gravity-size-sm gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-style gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-primary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-secondary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-tertiary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-positive[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-negative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-alternative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-disabled gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-alternative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-negative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-positive:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-tertiary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-secondary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-sm.gravity-button-primary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty){margin-left:.3125rem}.gravity-button.gravity-size-md,.gravity-size-md.gravity-button-style,.gravity-size-md.gravity-button-primary[disabled],.gravity-size-md.gravity-button-secondary[disabled],.gravity-size-md.gravity-button-tertiary[disabled],.gravity-size-md.gravity-button-positive[disabled],.gravity-size-md.gravity-button-negative[disabled],.gravity-size-md.gravity-button-alternative[disabled],.gravity-size-md.gravity-button-disabled,.gravity-size-md.gravity-button-alternative:not([disabled]),.gravity-size-md.gravity-button-negative:not([disabled]),.gravity-size-md.gravity-button-positive:not([disabled]),.gravity-size-md.gravity-button-tertiary:not([disabled]),.gravity-size-md.gravity-button-secondary:not([disabled]),.gravity-size-md.gravity-button-primary:not([disabled]){border-width:.125rem;height:2.3125rem;padding:.75rem .875rem}.gravity-button.gravity-size-md gravity-icon,.gravity-size-md.gravity-button-style gravity-icon,.gravity-size-md.gravity-button-primary[disabled] gravity-icon,.gravity-size-md.gravity-button-secondary[disabled] gravity-icon,.gravity-size-md.gravity-button-tertiary[disabled] gravity-icon,.gravity-size-md.gravity-button-positive[disabled] gravity-icon,.gravity-size-md.gravity-button-negative[disabled] gravity-icon,.gravity-size-md.gravity-button-alternative[disabled] gravity-icon,.gravity-size-md.gravity-button-disabled gravity-icon,.gravity-size-md.gravity-button-alternative:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-negative:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-positive:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-tertiary:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-secondary:not([disabled]) gravity-icon,.gravity-size-md.gravity-button-primary:not([disabled]) gravity-icon{--icon-height: .8125rem;--icon-width: .8125rem}.gravity-button.gravity-size-md gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-style gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-primary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-secondary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-tertiary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-positive[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-negative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-alternative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-disabled gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-alternative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-negative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-positive:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-tertiary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-secondary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-md.gravity-button-primary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty){margin-left:.3125rem}.gravity-button.gravity-size-lg,.gravity-size-lg.gravity-button-style,.gravity-size-lg.gravity-button-primary[disabled],.gravity-size-lg.gravity-button-secondary[disabled],.gravity-size-lg.gravity-button-tertiary[disabled],.gravity-size-lg.gravity-button-positive[disabled],.gravity-size-lg.gravity-button-negative[disabled],.gravity-size-lg.gravity-button-alternative[disabled],.gravity-size-lg.gravity-button-disabled,.gravity-size-lg.gravity-button-alternative:not([disabled]),.gravity-size-lg.gravity-button-negative:not([disabled]),.gravity-size-lg.gravity-button-positive:not([disabled]),.gravity-size-lg.gravity-button-tertiary:not([disabled]),.gravity-size-lg.gravity-button-secondary:not([disabled]),.gravity-size-lg.gravity-button-primary:not([disabled]){border-width:.125rem;height:3rem;padding:.875rem 1rem}.gravity-button.gravity-size-lg gravity-icon,.gravity-size-lg.gravity-button-style gravity-icon,.gravity-size-lg.gravity-button-primary[disabled] gravity-icon,.gravity-size-lg.gravity-button-secondary[disabled] gravity-icon,.gravity-size-lg.gravity-button-tertiary[disabled] gravity-icon,.gravity-size-lg.gravity-button-positive[disabled] gravity-icon,.gravity-size-lg.gravity-button-negative[disabled] gravity-icon,.gravity-size-lg.gravity-button-alternative[disabled] gravity-icon,.gravity-size-lg.gravity-button-disabled gravity-icon,.gravity-size-lg.gravity-button-alternative:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-negative:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-positive:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-tertiary:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-secondary:not([disabled]) gravity-icon,.gravity-size-lg.gravity-button-primary:not([disabled]) gravity-icon{--icon-height: 1.25rem;--icon-width: 1.25rem}.gravity-button.gravity-size-lg gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-style gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-primary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-secondary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-tertiary[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-positive[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-negative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-alternative[disabled] gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-disabled gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-alternative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-negative:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-positive:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-tertiary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-secondary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty),.gravity-size-lg.gravity-button-primary:not([disabled]) gravity-icon+span.button-content-wrapper:not(:empty){margin-left:.625rem}.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]){background-color:var(--button-background-color);border-color:var(--button-border-color)}.gravity-button-style,.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled,.gravity-button-alternative:not([disabled]),.gravity-button-negative:not([disabled]),.gravity-button-positive:not([disabled]),.gravity-button-tertiary:not([disabled]),.gravity-button-secondary:not([disabled]),.gravity-button-primary:not([disabled]),.gravity-button-style p,.gravity-button-primary[disabled] p,.gravity-button-secondary[disabled] p,.gravity-button-tertiary[disabled] p,.gravity-button-positive[disabled] p,.gravity-button-negative[disabled] p,.gravity-button-alternative[disabled] p,.gravity-button-disabled p,.gravity-button-alternative:not([disabled]) p,.gravity-button-negative:not([disabled]) p,.gravity-button-positive:not([disabled]) p,.gravity-button-tertiary:not([disabled]) p,.gravity-button-secondary:not([disabled]) p,.gravity-button-primary:not([disabled]) p{color:var(--button-text-color)}.gravity-button-style ngb-progressbar ::ng-deep .progress-bar,.gravity-button-primary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-secondary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-tertiary[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-positive[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-negative[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-alternative[disabled] ngb-progressbar ::ng-deep .progress-bar,.gravity-button-disabled ngb-progressbar ::ng-deep .progress-bar,.gravity-button-alternative:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-negative:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-positive:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-tertiary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-secondary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar,.gravity-button-primary:not([disabled]) ngb-progressbar ::ng-deep .progress-bar{background-color:var(--progressbar-color)}.gravity-button-primary:not([disabled]),.gravity-button-primary:not([disabled]).active{--button-background-color: var(--bg-button-active-primary);--button-border-color: var(--bg-button-active-primary);--button-text-color: var(--on-bg-button-active-primary);--progressbar-color: var(--bg-button-active-primary)}.gravity-button-primary:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-primary:not([disabled]).hover{--button-background-color: var(--bg-button-hover-primary);--button-border-color: var(--bg-button-hover-primary);--button-text-color: var(--on-bg-button-hover-primary)}.gravity-button-primary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-primary);--button-border-color: var(--bg-button-pressed-primary);--button-text-color: var(--on-bg-button-pressed-primary)}.gravity-button-secondary:not([disabled]),.gravity-button-secondary:not([disabled]).active{--button-background-color: var(--bg-button-active-secondary);--button-border-color: var(--outline-button-active-secondary);--button-text-color: var(--on-bg-button-active-secondary);--progressbar-color: var(--on-bg-button-active-secondary)}.gravity-button-secondary:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-secondary:not([disabled]).hover{--button-background-color: var(--bg-button-hover-secondary);--button-border-color: var(--outline-button-hover-secondary);--button-text-color: var(--on-bg-button-hover-secondary)}.gravity-button-secondary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-secondary);--button-border-color: var(--outline-button-pressed-secondary);--button-text-color: var(--on-bg-button-pressed-secondary)}.gravity-button-tertiary:not([disabled]),.gravity-button-tertiary:not([disabled]).active{--button-background-color: var(--bg-button-active-tertiary);--button-border-color: var(--bg-button-active-tertiary);--button-text-color: var(--on-bg-button-active-tertiary);--progressbar-color: var(--bg-button-active-tertiary)}.gravity-button-tertiary:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-tertiary:not([disabled]).hover{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}.gravity-button-tertiary:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-tertiary);--button-border-color: var(--bg-button-pressed-tertiary);--button-text-color: var(--on-bg-button-pressed-tertiary)}.gravity-button-positive:not([disabled]),.gravity-button-positive:not([disabled]).active{--button-background-color: var(--bg-button-active-positive);--button-border-color: var(--bg-button-active-positive);--button-text-color: var(--on-bg-button-active-positive);--progressbar-color: var(--bg-button-active-positive)}.gravity-button-positive:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-positive:not([disabled]).hover{--button-background-color: var(--bg-button-hover-positive);--button-border-color: var(--bg-button-hover-positive);--button-text-color: var(--on-bg-button-hover-positive)}.gravity-button-positive:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-positive);--button-border-color: var(--bg-button-pressed-positive);--button-text-color: var(--on-bg-button-pressed-positive)}.gravity-button-negative:not([disabled]),.gravity-button-negative:not([disabled]).active{--button-background-color: var(--bg-button-active-negative);--button-border-color: var(--bg-button-active-negative);--button-text-color: var(--on-bg-button-active-negative);--progressbar-color: var(--bg-button-active-negative)}.gravity-button-negative:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-negative:not([disabled]).hover{--button-background-color: var(--bg-button-hover-negative);--button-border-color: var(--bg-button-hover-negative);--button-text-color: var(--on-bg-button-hover-negative)}.gravity-button-negative:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-negative);--button-border-color: var(--bg-button-pressed-negative);--button-text-color: var(--on-bg-button-pressed-negative)}.gravity-button-alternative:not([disabled]),.gravity-button-alternative:not([disabled]).active{--button-background-color: var(--bg-button-active-alternative);--button-border-color: var(--bg-button-active-alternative);--button-text-color: var(--on-bg-button-active-alternative);--progressbar-color: var(--bg-button-active-alternative)}.gravity-button-alternative:not([disabled]):not(.active):not(.pressed):hover,.gravity-button-alternative:not([disabled]).hover{--button-background-color: var(--bg-button-hover-alternative);--button-border-color: var(--bg-button-hover-alternative);--button-text-color: var(--on-bg-button-hover-alternative)}.gravity-button-alternative:not([disabled]).pressed{--button-background-color: var(--bg-button-pressed-alternative);--button-border-color: var(--bg-button-pressed-alternative);--button-text-color: var(--on-bg-button-pressed-alternative)}.gravity-button-primary[disabled],.gravity-button-secondary[disabled],.gravity-button-tertiary[disabled],.gravity-button-positive[disabled],.gravity-button-negative[disabled],.gravity-button-alternative[disabled],.gravity-button-disabled{--button-background-color: var(--bg-disabled);--button-border-color: var(--bg-disabled);--button-text-color: var(--on-bg-disabled);--progressbar-color: var(--bg-disabled);cursor:default}ngb-progressbar{width:100%}\n"] }]
|
|
44
44
|
}], propDecorators: { cypressTag: [{
|
|
45
45
|
type: Input
|
|
46
46
|
}], disabled: [{
|
|
47
47
|
type: Input
|
|
48
|
+
}], customState: [{
|
|
49
|
+
type: Input
|
|
48
50
|
}], iconName: [{
|
|
49
51
|
type: Input
|
|
50
52
|
}], isLoading: [{
|
|
@@ -994,9 +996,143 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
994
996
|
}]
|
|
995
997
|
}] });
|
|
996
998
|
|
|
999
|
+
class GravityMonthPickerComponent {
|
|
1000
|
+
constructor() {
|
|
1001
|
+
this.closeCalendar = new EventEmitter();
|
|
1002
|
+
this.monthSelected = new EventEmitter();
|
|
1003
|
+
this.currentLang = 'en';
|
|
1004
|
+
this.monthsEn = ["Jan", "Feb", "Mar", "Apr", "May", "June", "July", "Aug", "Sept", "Oct", "Nov", "Dec"];
|
|
1005
|
+
this.monthsEs = ["En", "Feb", "Mar", "Abr", "May", "Jun", "Jul", "Ag", "Set", "Oct", "Nov", "Dic"];
|
|
1006
|
+
this.isShowingCalendar = false;
|
|
1007
|
+
this.isShowingMonths = true;
|
|
1008
|
+
this.monthPickerData = {};
|
|
1009
|
+
this.monthIndex = new Date().getUTCMonth();
|
|
1010
|
+
this.yearDisplayed = new Date().getUTCFullYear();
|
|
1011
|
+
this.yearBase = GravityMonthPickerComponent.getYearsRangeBase(this.yearDisplayed);
|
|
1012
|
+
}
|
|
1013
|
+
ngOnInit() {
|
|
1014
|
+
if (this.monthConfig?.customMonthDate) {
|
|
1015
|
+
this.monthPickerData.month = this.monthConfig.customMonthDate.month;
|
|
1016
|
+
this.monthPickerData.year = this.monthConfig.customMonthDate.year;
|
|
1017
|
+
}
|
|
1018
|
+
}
|
|
1019
|
+
showCalendar() {
|
|
1020
|
+
this.isShowingCalendar = true;
|
|
1021
|
+
}
|
|
1022
|
+
hideCalendar() {
|
|
1023
|
+
this.isShowingCalendar = false;
|
|
1024
|
+
}
|
|
1025
|
+
updateYear(changeRange, newYear) {
|
|
1026
|
+
if (changeRange) {
|
|
1027
|
+
this.yearDisplayed += changeRange;
|
|
1028
|
+
}
|
|
1029
|
+
else if (newYear) {
|
|
1030
|
+
this.yearDisplayed = newYear;
|
|
1031
|
+
}
|
|
1032
|
+
this.yearBase = GravityMonthPickerComponent.getYearsRangeBase(this.yearDisplayed);
|
|
1033
|
+
}
|
|
1034
|
+
addYear() {
|
|
1035
|
+
this.updateYear(this.isShowingMonths ? 1 : 10);
|
|
1036
|
+
}
|
|
1037
|
+
subtractYear() {
|
|
1038
|
+
this.updateYear(this.isShowingMonths ? -1 : -10);
|
|
1039
|
+
}
|
|
1040
|
+
changeYear(newYear, disabled) {
|
|
1041
|
+
if (!disabled) {
|
|
1042
|
+
this.updateYear(null, newYear);
|
|
1043
|
+
this.isShowingMonths = true;
|
|
1044
|
+
}
|
|
1045
|
+
}
|
|
1046
|
+
static getYearsRangeBase(year) {
|
|
1047
|
+
return (year - year % 10) - 1;
|
|
1048
|
+
}
|
|
1049
|
+
changeMonth(monthIndex, disabled) {
|
|
1050
|
+
if (!disabled) {
|
|
1051
|
+
this.monthPickerData.month = monthIndex + 1;
|
|
1052
|
+
this.monthPickerData.year = this.yearDisplayed;
|
|
1053
|
+
this.isShowingCalendar = false;
|
|
1054
|
+
this.closeCalendar.emit(false);
|
|
1055
|
+
this.monthSelected.emit(this.monthPickerData);
|
|
1056
|
+
}
|
|
1057
|
+
}
|
|
1058
|
+
getMonths() {
|
|
1059
|
+
switch (this.currentLang) {
|
|
1060
|
+
case 'es':
|
|
1061
|
+
return this.monthsEs;
|
|
1062
|
+
default:
|
|
1063
|
+
return this.monthsEn;
|
|
1064
|
+
}
|
|
1065
|
+
}
|
|
1066
|
+
getDisabled(currentIndex) {
|
|
1067
|
+
let minMonthDisabled = false;
|
|
1068
|
+
if (this.monthConfig?.minMonthDate) {
|
|
1069
|
+
if (this.isShowingMonths) {
|
|
1070
|
+
minMonthDisabled = this.yearDisplayed < this.monthConfig.minMonthDate.year || (this.yearDisplayed == this.monthConfig.minMonthDate.year && currentIndex + 1 < this.monthConfig.minMonthDate.month);
|
|
1071
|
+
}
|
|
1072
|
+
else {
|
|
1073
|
+
minMonthDisabled = this.yearBase + currentIndex < this.monthConfig.minMonthDate.year;
|
|
1074
|
+
}
|
|
1075
|
+
}
|
|
1076
|
+
let maxMonthDisabled = false;
|
|
1077
|
+
if (this.monthConfig?.maxMonthDate) {
|
|
1078
|
+
if (this.isShowingMonths) {
|
|
1079
|
+
maxMonthDisabled = this.yearDisplayed > this.monthConfig.maxMonthDate.year || (this.yearDisplayed == this.monthConfig.maxMonthDate.year && currentIndex + 1 > this.monthConfig.maxMonthDate.month);
|
|
1080
|
+
}
|
|
1081
|
+
else {
|
|
1082
|
+
maxMonthDisabled = this.yearBase + currentIndex > this.monthConfig.maxMonthDate.year;
|
|
1083
|
+
}
|
|
1084
|
+
}
|
|
1085
|
+
return minMonthDisabled || maxMonthDisabled;
|
|
1086
|
+
}
|
|
1087
|
+
getArrowDisabled(arrow) {
|
|
1088
|
+
if (arrow == 'left' && this.monthConfig?.minMonthDate) {
|
|
1089
|
+
if (this.isShowingMonths) {
|
|
1090
|
+
return this.yearDisplayed <= this.monthConfig.minMonthDate.year;
|
|
1091
|
+
}
|
|
1092
|
+
else {
|
|
1093
|
+
return this.yearBase < this.monthConfig.minMonthDate.year;
|
|
1094
|
+
}
|
|
1095
|
+
}
|
|
1096
|
+
if (arrow == 'right' && this.monthConfig?.maxMonthDate) {
|
|
1097
|
+
if (this.isShowingMonths) {
|
|
1098
|
+
return this.yearDisplayed >= this.monthConfig.maxMonthDate.year;
|
|
1099
|
+
}
|
|
1100
|
+
else {
|
|
1101
|
+
return this.yearBase + 12 > this.monthConfig.maxMonthDate.year;
|
|
1102
|
+
}
|
|
1103
|
+
}
|
|
1104
|
+
}
|
|
1105
|
+
onDocumentClick() {
|
|
1106
|
+
if (this.isShowingCalendar) {
|
|
1107
|
+
this.isShowingCalendar = false;
|
|
1108
|
+
this.closeCalendar.emit(false);
|
|
1109
|
+
}
|
|
1110
|
+
}
|
|
1111
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityMonthPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1112
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityMonthPickerComponent, selector: "gravity-month-picker", inputs: { currentLang: "currentLang", monthConfig: "monthConfig" }, outputs: { closeCalendar: "closeCalendar", monthSelected: "monthSelected" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, ngImport: i0, template: "<ng-container *ngIf=\"isShowingCalendar\">\n <div class=\"calendar-header\">\n <div class=\"month-picker-arrow month-picker-arrow-previous\">\n <button class=\"hr-label sm-regular\" [disabled]=\"getArrowDisabled('left')\" (click)=\"subtractYear()\">\n <span></span>\n </button>\n </div>\n <div class=\"hr-label md-regular month-picker-year\">\n <span (click)=\"$event.stopPropagation(); isShowingMonths = false\" *ngIf=\"isShowingMonths\">\n {{yearDisplayed}}\n </span>\n <span (click)=\"$event.stopPropagation(); isShowingMonths = true\" *ngIf=\"!isShowingMonths\">\n {{yearBase + 1}} - {{yearBase + 10}}\n </span>\n </div>\n <div class=\"month-picker-arrow month-picker-arrow-next\">\n <button class=\"hr-label sm-regular\" [disabled]=\"getArrowDisabled('right')\" (click)=\"addYear()\">\n <span></span>\n </button>\n </div>\n </div>\n <div class=\"calendar-body hr-label sm-regular\">\n <article [class.active]=\"(isShowingMonths && monthPickerData.month == i + 1 && monthPickerData.year == yearDisplayed) || (!isShowingMonths && monthPickerData.year == i + yearBase)\"\n [class.disabled]=\"getDisabled(i)\"\n (click)=\"isShowingMonths ? changeMonth(i, getDisabled(i)) : changeYear(i + yearBase, getDisabled(i))\"\n *ngFor=\"let month of getMonths(); let i = index\">\n <span *ngIf=\"isShowingMonths\">{{month}}</span>\n <span *ngIf=\"!isShowingMonths\">{{i + yearBase}}</span>\n </article>\n </div>\n</ng-container>\n", styles: ["@charset \"UTF-8\";.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:50%}:host{background-color:var(--bg-calender-primary);border-radius:.625rem;box-shadow:0 0 10px #aaa;color:var(--on-bg-calender-primary);left:2.6rem;position:absolute;top:77%;width:15rem;z-index:1055}.calendar-header{align-items:center;background-color:var(--bg-calendar-nav-primary);border-top-left-radius:.625rem;border-top-right-radius:.625rem;color:var(--on-bg-calendar-nav-primary);display:flex;height:3.125rem;min-width:15rem;padding:.625rem}.month-picker-arrow{display:flex;flex:1 1 auto;height:2rem;margin:0;padding-left:0;padding-right:0;width:2rem}.month-picker-arrow button{background-color:var(--bg-calendar-nav-primary);border:none;border-radius:50%;color:var(--arrow-calendar-active-primary);cursor:pointer;height:2rem;margin:0;outline:none;padding:0;width:2rem}.month-picker-arrow button span{border:none;display:inline-block;font-size:1.75rem;height:100%;line-height:1;margin:0;position:relative;transform:none;width:100%}.month-picker-arrow button:not([disabled]):hover{background-color:var(--bg-arrow-calendar-hover-primary);color:var(--arrow-calendar-hover-primary)}.month-picker-arrow button[disabled]{color:var(--arrow-calendar-disabled-primary);cursor:not-allowed}.month-picker-arrow.month-picker-arrow-previous button span:before{content:\"\\2039\"}.month-picker-arrow.month-picker-arrow-next button span:after{content:\"\\203a\"}.month-picker-year{cursor:pointer}.month-picker-arrow-next{justify-content:flex-end}.calendar-body{display:flex;flex-wrap:wrap;justify-content:space-between;min-width:15rem;padding:.625rem;text-align:center}.calendar-body article{align-items:center;border-radius:50%;cursor:pointer;display:flex;height:2.5rem;justify-content:center;margin-inline:.25rem;width:2.5rem}.calendar-body article:not(.disabled):hover{background-color:var(--bg-number-calendar-hover-primary);color:var(--number-calendar-hover-primary)}.calendar-body article.active{background-color:var(--bg-number-calendar-pressed-primary)!important;color:var(--number-calendar-pressed-primary)!important}.calendar-body article.disabled{color:var(--number-calendar-disabled-primary);cursor:default}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
1113
|
+
}
|
|
1114
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityMonthPickerComponent, decorators: [{
|
|
1115
|
+
type: Component,
|
|
1116
|
+
args: [{ selector: 'gravity-month-picker', template: "<ng-container *ngIf=\"isShowingCalendar\">\n <div class=\"calendar-header\">\n <div class=\"month-picker-arrow month-picker-arrow-previous\">\n <button class=\"hr-label sm-regular\" [disabled]=\"getArrowDisabled('left')\" (click)=\"subtractYear()\">\n <span></span>\n </button>\n </div>\n <div class=\"hr-label md-regular month-picker-year\">\n <span (click)=\"$event.stopPropagation(); isShowingMonths = false\" *ngIf=\"isShowingMonths\">\n {{yearDisplayed}}\n </span>\n <span (click)=\"$event.stopPropagation(); isShowingMonths = true\" *ngIf=\"!isShowingMonths\">\n {{yearBase + 1}} - {{yearBase + 10}}\n </span>\n </div>\n <div class=\"month-picker-arrow month-picker-arrow-next\">\n <button class=\"hr-label sm-regular\" [disabled]=\"getArrowDisabled('right')\" (click)=\"addYear()\">\n <span></span>\n </button>\n </div>\n </div>\n <div class=\"calendar-body hr-label sm-regular\">\n <article [class.active]=\"(isShowingMonths && monthPickerData.month == i + 1 && monthPickerData.year == yearDisplayed) || (!isShowingMonths && monthPickerData.year == i + yearBase)\"\n [class.disabled]=\"getDisabled(i)\"\n (click)=\"isShowingMonths ? changeMonth(i, getDisabled(i)) : changeYear(i + yearBase, getDisabled(i))\"\n *ngFor=\"let month of getMonths(); let i = index\">\n <span *ngIf=\"isShowingMonths\">{{month}}</span>\n <span *ngIf=\"!isShowingMonths\">{{i + yearBase}}</span>\n </article>\n </div>\n</ng-container>\n", styles: ["@charset \"UTF-8\";.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:50%}:host{background-color:var(--bg-calender-primary);border-radius:.625rem;box-shadow:0 0 10px #aaa;color:var(--on-bg-calender-primary);left:2.6rem;position:absolute;top:77%;width:15rem;z-index:1055}.calendar-header{align-items:center;background-color:var(--bg-calendar-nav-primary);border-top-left-radius:.625rem;border-top-right-radius:.625rem;color:var(--on-bg-calendar-nav-primary);display:flex;height:3.125rem;min-width:15rem;padding:.625rem}.month-picker-arrow{display:flex;flex:1 1 auto;height:2rem;margin:0;padding-left:0;padding-right:0;width:2rem}.month-picker-arrow button{background-color:var(--bg-calendar-nav-primary);border:none;border-radius:50%;color:var(--arrow-calendar-active-primary);cursor:pointer;height:2rem;margin:0;outline:none;padding:0;width:2rem}.month-picker-arrow button span{border:none;display:inline-block;font-size:1.75rem;height:100%;line-height:1;margin:0;position:relative;transform:none;width:100%}.month-picker-arrow button:not([disabled]):hover{background-color:var(--bg-arrow-calendar-hover-primary);color:var(--arrow-calendar-hover-primary)}.month-picker-arrow button[disabled]{color:var(--arrow-calendar-disabled-primary);cursor:not-allowed}.month-picker-arrow.month-picker-arrow-previous button span:before{content:\"\\2039\"}.month-picker-arrow.month-picker-arrow-next button span:after{content:\"\\203a\"}.month-picker-year{cursor:pointer}.month-picker-arrow-next{justify-content:flex-end}.calendar-body{display:flex;flex-wrap:wrap;justify-content:space-between;min-width:15rem;padding:.625rem;text-align:center}.calendar-body article{align-items:center;border-radius:50%;cursor:pointer;display:flex;height:2.5rem;justify-content:center;margin-inline:.25rem;width:2.5rem}.calendar-body article:not(.disabled):hover{background-color:var(--bg-number-calendar-hover-primary);color:var(--number-calendar-hover-primary)}.calendar-body article.active{background-color:var(--bg-number-calendar-pressed-primary)!important;color:var(--number-calendar-pressed-primary)!important}.calendar-body article.disabled{color:var(--number-calendar-disabled-primary);cursor:default}\n"] }]
|
|
1117
|
+
}], ctorParameters: function () { return []; }, propDecorators: { closeCalendar: [{
|
|
1118
|
+
type: Output,
|
|
1119
|
+
args: ['closeCalendar']
|
|
1120
|
+
}], monthSelected: [{
|
|
1121
|
+
type: Output,
|
|
1122
|
+
args: ['monthSelected']
|
|
1123
|
+
}], currentLang: [{
|
|
1124
|
+
type: Input
|
|
1125
|
+
}], monthConfig: [{
|
|
1126
|
+
type: Input
|
|
1127
|
+
}], onDocumentClick: [{
|
|
1128
|
+
type: HostListener,
|
|
1129
|
+
args: ['document:click', ['$event']]
|
|
1130
|
+
}] } });
|
|
1131
|
+
|
|
997
1132
|
class GravityCalendarComponent {
|
|
998
1133
|
constructor() {
|
|
999
1134
|
this.calendarResponse = new EventEmitter();
|
|
1135
|
+
this.calendarType = 'date';
|
|
1000
1136
|
this.currentLang = 'en';
|
|
1001
1137
|
this.state = "enabled";
|
|
1002
1138
|
this.supportTextType = "neutro";
|
|
@@ -1006,20 +1142,20 @@ class GravityCalendarComponent {
|
|
|
1006
1142
|
this.customDateFlag = '';
|
|
1007
1143
|
}
|
|
1008
1144
|
ngOnChanges(changes) {
|
|
1009
|
-
if (this.
|
|
1010
|
-
if (this.
|
|
1011
|
-
let dateWithoutDays = new Date(new Date().setDate(new Date().getDate() - this.
|
|
1145
|
+
if (this.datesConfig) {
|
|
1146
|
+
if (this.datesConfig.defaultDays) {
|
|
1147
|
+
let dateWithoutDays = new Date(new Date().setDate(new Date().getDate() - this.datesConfig.defaultDays));
|
|
1012
1148
|
this.focusCustomDate(dateWithoutDays);
|
|
1013
1149
|
}
|
|
1014
|
-
if (this.
|
|
1015
|
-
let date = this.
|
|
1150
|
+
if (this.datesConfig.customDate) {
|
|
1151
|
+
let date = this.datesConfig.customDate == 'today' ? (new Date()) : this.datesConfig.customDate;
|
|
1016
1152
|
this.focusCustomDate(date);
|
|
1017
1153
|
}
|
|
1018
|
-
if (this.
|
|
1019
|
-
this.minDate = GravityCalendarComponent.formatDateToNgbDateStruct(this.
|
|
1154
|
+
if (this.datesConfig.minDate) {
|
|
1155
|
+
this.minDate = GravityCalendarComponent.formatDateToNgbDateStruct(this.datesConfig.minDate);
|
|
1020
1156
|
}
|
|
1021
|
-
if (this.
|
|
1022
|
-
let date = this.
|
|
1157
|
+
if (this.datesConfig.maxDate) {
|
|
1158
|
+
let date = this.datesConfig.maxDate == 'today' ? (new Date()) : this.datesConfig.maxDate;
|
|
1023
1159
|
this.maxDate = GravityCalendarComponent.formatDateToNgbDateStruct(date);
|
|
1024
1160
|
}
|
|
1025
1161
|
}
|
|
@@ -1060,6 +1196,15 @@ class GravityCalendarComponent {
|
|
|
1060
1196
|
ngbDate.year
|
|
1061
1197
|
].join('/');
|
|
1062
1198
|
}
|
|
1199
|
+
static formatMonthDate(monthDate) {
|
|
1200
|
+
if (!monthDate) {
|
|
1201
|
+
return null;
|
|
1202
|
+
}
|
|
1203
|
+
return [
|
|
1204
|
+
(monthDate.month < 10 ? ('0' + monthDate.month) : monthDate.month),
|
|
1205
|
+
monthDate.year
|
|
1206
|
+
].join('/');
|
|
1207
|
+
}
|
|
1063
1208
|
static formatTSDate(date) {
|
|
1064
1209
|
if (!date) {
|
|
1065
1210
|
return null;
|
|
@@ -1080,23 +1225,36 @@ class GravityCalendarComponent {
|
|
|
1080
1225
|
static convertNgbDateToDate(date) {
|
|
1081
1226
|
return new Date(date.year, (date.month - 1), date.day);
|
|
1082
1227
|
}
|
|
1228
|
+
static convertMonthDateToDate(date) {
|
|
1229
|
+
return new Date(date.year, (date.month - 1));
|
|
1230
|
+
}
|
|
1231
|
+
handleMonthPickerResponse(response) {
|
|
1232
|
+
this.selectedDateInput = GravityCalendarComponent.formatMonthDate(response);
|
|
1233
|
+
this.selectedDate = GravityCalendarComponent.convertMonthDateToDate(response);
|
|
1234
|
+
this.monthPickerInput.nativeElement.value = this.selectedDateInput;
|
|
1235
|
+
this.calendarResponse.emit(this.selectedDate);
|
|
1236
|
+
}
|
|
1083
1237
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1084
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityCalendarComponent, selector: "gravity-calendar", inputs: { currentLang: "currentLang", cypressTag: "cypressTag",
|
|
1238
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityCalendarComponent, selector: "gravity-calendar", inputs: { calendarType: "calendarType", currentLang: "currentLang", cypressTag: "cypressTag", datesConfig: "datesConfig", label: "label", monthConfig: "monthConfig", required: "required", state: "state", supportTextContent: "supportTextContent", supportTextType: "supportTextType" }, outputs: { calendarResponse: "response" }, viewQueries: [{ propertyName: "datePicker", first: true, predicate: ["datePicker"], descendants: true }, { propertyName: "datepickerInput", first: true, predicate: ["datepickerInput"], descendants: true }, { propertyName: "monthPickerInput", first: true, predicate: ["monthPickerInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!selectedDate && !focusInput && !calendarOpened\"\n [class.focused]=\"focusInput || calendarOpened\"\n [class.full-input]=\"selectedDate && !focusInput && !calendarOpened\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-calendar-field {{state}}\" [class.empty]=\"!selectedDate && !focusInput && !calendarOpened\"\n [class.focused]=\"focusInput || calendarOpened\" [class.full-input]=\"selectedDate && !focusInput && !calendarOpened\">\n <gravity-icon class=\"placement-left\" [hoverIcon]=\"false\" [iconName]=\"'calendar'\"></gravity-icon>\n <ng-container *ngIf=\"calendarType == 'date'\">\n <input [attr.data-cy]=\"cypressTag\"\n [disabled]=\"state == 'disabled' ? true : null\"\n [readonly]=\"state != 'disabled' ? true : null\"\n\n (blur)=\"focusInput = false\"\n (closed)=\"calendarOpened = false\"\n (dateSelect)=\"updateSelectedDate($event)\"\n (focus)=\"focusInput = true\"\n\n class=\"hr-label md-regular\"\n ngbDatepicker\n placeholder=\"Select your date\"\n\n [container]=\"'body'\"\n [datepickerClass]=\"'gravity-datepicker-dialog'\"\n [maxDate]=\"maxDate ? maxDate : null\"\n [minDate]=\"minDate ? minDate : null\"\n [navigation]=\"'arrows'\"\n [showWeekNumbers]=\"true\"\n\n #datepickerInput\n #datePicker=\"ngbDatepicker\">\n <span (click)=\"datePicker.open(); calendarOpened = true\" *ngIf=\"!calendarOpened && state == 'enabled'\"></span>\n <span (click)=\"datePicker.close(); calendarOpened = false\" *ngIf=\"calendarOpened && state == 'enabled'\"></span>\n </ng-container>\n <ng-container *ngIf=\"calendarType == 'month'\">\n <input [attr.data-cy]=\"cypressTag\"\n [disabled]=\"state == 'disabled' ? true : null\"\n [readonly]=\"state != 'disabled' ? true : null\"\n\n (blur)=\"focusInput = false\"\n (focus)=\"focusInput = true\"\n\n class=\"hr-label md-regular\"\n placeholder=\"Select your month\"\n\n #monthPickerInput>\n <span (click)=\"$event.stopPropagation(); gravityMonthPicker.showCalendar(); calendarOpened = true\"\n *ngIf=\"!calendarOpened && state == 'enabled'\"></span>\n <span (click)=\"$event.stopPropagation(); gravityMonthPicker.hideCalendar(); calendarOpened = false\"\n *ngIf=\"calendarOpened && state == 'enabled'\"></span>\n <gravity-month-picker #gravityMonthPicker\n\n [currentLang]=\"currentLang\"\n [monthConfig]=\"monthConfig\"\n\n (click)=\"$event.stopPropagation()\"\n (closeCalendar)=\"calendarOpened = false\"\n (monthSelected)=\"handleMonthPickerResponse($event)\"></gravity-month-picker>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:50%}.text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-calendar-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;height:3rem;max-height:3rem;min-height:1.5rem;padding:.75rem 1rem;position:relative}.gravity-calendar-field gravity-icon.placement-left{margin-right:.5rem}.gravity-calendar-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-calendar-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-calendar-field span{cursor:pointer;height:100%;left:0;position:absolute;width:100%}.gravity-calendar-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-calendar-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-calendar-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-calendar-field.empty.disabled gravity-icon{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-calendar-field.full-input.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-calendar-field.full-input.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-calendar-field.full-input.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-calendar-field.full-input.disabled gravity-icon{--icon-color: var(--input-text-full-disabled-primary)}.gravity-calendar-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-calendar-field.readonly gravity-icon{--icon-color: var(--input-text-full-read-only-primary)}.gravity-calendar-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "hoverIcon"] }, { kind: "component", type: GravityMonthPickerComponent, selector: "gravity-month-picker", inputs: ["currentLang", "monthConfig"], outputs: ["closeCalendar", "monthSelected"] }] }); }
|
|
1085
1239
|
}
|
|
1086
1240
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityCalendarComponent, decorators: [{
|
|
1087
1241
|
type: Component,
|
|
1088
|
-
args: [{ selector: 'gravity-calendar', template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!selectedDate && !focusInput && !calendarOpened\"\n [class.focused]=\"focusInput || calendarOpened\"
|
|
1242
|
+
args: [{ selector: 'gravity-calendar', template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!selectedDate && !focusInput && !calendarOpened\"\n [class.focused]=\"focusInput || calendarOpened\"\n [class.full-input]=\"selectedDate && !focusInput && !calendarOpened\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-calendar-field {{state}}\" [class.empty]=\"!selectedDate && !focusInput && !calendarOpened\"\n [class.focused]=\"focusInput || calendarOpened\" [class.full-input]=\"selectedDate && !focusInput && !calendarOpened\">\n <gravity-icon class=\"placement-left\" [hoverIcon]=\"false\" [iconName]=\"'calendar'\"></gravity-icon>\n <ng-container *ngIf=\"calendarType == 'date'\">\n <input [attr.data-cy]=\"cypressTag\"\n [disabled]=\"state == 'disabled' ? true : null\"\n [readonly]=\"state != 'disabled' ? true : null\"\n\n (blur)=\"focusInput = false\"\n (closed)=\"calendarOpened = false\"\n (dateSelect)=\"updateSelectedDate($event)\"\n (focus)=\"focusInput = true\"\n\n class=\"hr-label md-regular\"\n ngbDatepicker\n placeholder=\"Select your date\"\n\n [container]=\"'body'\"\n [datepickerClass]=\"'gravity-datepicker-dialog'\"\n [maxDate]=\"maxDate ? maxDate : null\"\n [minDate]=\"minDate ? minDate : null\"\n [navigation]=\"'arrows'\"\n [showWeekNumbers]=\"true\"\n\n #datepickerInput\n #datePicker=\"ngbDatepicker\">\n <span (click)=\"datePicker.open(); calendarOpened = true\" *ngIf=\"!calendarOpened && state == 'enabled'\"></span>\n <span (click)=\"datePicker.close(); calendarOpened = false\" *ngIf=\"calendarOpened && state == 'enabled'\"></span>\n </ng-container>\n <ng-container *ngIf=\"calendarType == 'month'\">\n <input [attr.data-cy]=\"cypressTag\"\n [disabled]=\"state == 'disabled' ? true : null\"\n [readonly]=\"state != 'disabled' ? true : null\"\n\n (blur)=\"focusInput = false\"\n (focus)=\"focusInput = true\"\n\n class=\"hr-label md-regular\"\n placeholder=\"Select your month\"\n\n #monthPickerInput>\n <span (click)=\"$event.stopPropagation(); gravityMonthPicker.showCalendar(); calendarOpened = true\"\n *ngIf=\"!calendarOpened && state == 'enabled'\"></span>\n <span (click)=\"$event.stopPropagation(); gravityMonthPicker.hideCalendar(); calendarOpened = false\"\n *ngIf=\"calendarOpened && state == 'enabled'\"></span>\n <gravity-month-picker #gravityMonthPicker\n\n [currentLang]=\"currentLang\"\n [monthConfig]=\"monthConfig\"\n\n (click)=\"$event.stopPropagation()\"\n (closeCalendar)=\"calendarOpened = false\"\n (monthSelected)=\"handleMonthPickerResponse($event)\"></gravity-month-picker>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:50%}.text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}label.focused{--text-field-label-color: var(--label-text-full-enabled-pressed-primary)}.gravity-calendar-field{align-items:center;background-color:var(--text-field-input-field-background-color);border:1px solid var(--text-field-input-field-border-color);border-radius:.625rem;display:flex;height:3rem;max-height:3rem;min-height:1.5rem;padding:.75rem 1rem;position:relative}.gravity-calendar-field gravity-icon.placement-left{margin-right:.5rem}.gravity-calendar-field input{background-color:transparent;border:none;box-shadow:none;color:var(--text-field-input-field-input-color);line-height:0;outline:none;padding:0;width:100%}.gravity-calendar-field input::placeholder{color:var(--text-field-input-field-placeholder-color)}.gravity-calendar-field span{cursor:pointer;height:100%;left:0;position:absolute;width:100%}.gravity-calendar-field.empty.enabled{--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-field-empty-enabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-enabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-enabled-primary)}.gravity-calendar-field.empty.enabled:hover{--text-field-input-field-background-color: var(--bg-field-empty-enabled-hover-primary)}.gravity-calendar-field.empty.disabled{--text-field-input-field-background-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-border-color: var(--bg-field-empty-disabled-primary);--text-field-input-field-input-color: var(--placeholder-empty-disabled-primary);--text-field-input-field-placeholder-color: var(--placeholder-empty-disabled-primary)}.gravity-calendar-field.empty.disabled gravity-icon{--icon-color: var(--placeholder-empty-disabled-primary)}.gravity-calendar-field.full-input.enabled{--text-field-input-field-background-color: var(--bg-field-full-enabled-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-primary);--text-field-input-field-input-color: var(--input-text-full-enabled-primary)}.gravity-calendar-field.full-input.enabled:hover{--text-field-input-field-background-color: var(--bg-field-full-enabled-hover-primary)}.gravity-calendar-field.full-input.disabled{--text-field-input-field-background-color: var(--bg-field-full-disabled-primary);--text-field-input-field-border-color: var(--bg-field-full-disabled-primary);--text-field-input-field-input-color: var(--input-text-full-disabled-primary)}.gravity-calendar-field.full-input.disabled gravity-icon{--icon-color: var(--input-text-full-disabled-primary)}.gravity-calendar-field.readonly{--text-field-input-field-background-color: var(--bg-field-full-read-only-primary);--text-field-input-field-border-color: var(--bg-field-full-read-only-primary);--text-field-input-field-input-color: var(--input-text-full-read-only-primary)}.gravity-calendar-field.readonly gravity-icon{--icon-color: var(--input-text-full-read-only-primary)}.gravity-calendar-field.focused:not(.readonly){--text-field-input-field-background-color: var(--bg-field-full-enabled-pressed-primary);--text-field-input-field-border-color: var(--outline-field-full-enabled-pressed-primary);--text-field-input-field-input-color: var(--placeholder-full-enabled-pressed-primary)}\n"] }]
|
|
1089
1243
|
}], propDecorators: { calendarResponse: [{
|
|
1090
1244
|
type: Output,
|
|
1091
1245
|
args: ['response']
|
|
1246
|
+
}], calendarType: [{
|
|
1247
|
+
type: Input
|
|
1092
1248
|
}], currentLang: [{
|
|
1093
1249
|
type: Input
|
|
1094
1250
|
}], cypressTag: [{
|
|
1095
1251
|
type: Input
|
|
1096
|
-
}],
|
|
1252
|
+
}], datesConfig: [{
|
|
1097
1253
|
type: Input
|
|
1098
1254
|
}], label: [{
|
|
1099
1255
|
type: Input
|
|
1256
|
+
}], monthConfig: [{
|
|
1257
|
+
type: Input
|
|
1100
1258
|
}], required: [{
|
|
1101
1259
|
type: Input
|
|
1102
1260
|
}], state: [{
|
|
@@ -1111,6 +1269,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
1111
1269
|
}], datepickerInput: [{
|
|
1112
1270
|
type: ViewChild,
|
|
1113
1271
|
args: ['datepickerInput', { static: false }]
|
|
1272
|
+
}], monthPickerInput: [{
|
|
1273
|
+
type: ViewChild,
|
|
1274
|
+
args: ['monthPickerInput', { static: false }]
|
|
1114
1275
|
}] } });
|
|
1115
1276
|
|
|
1116
1277
|
class GravityRadioButtonComponent {
|
|
@@ -1300,11 +1461,11 @@ class GravityAttachFileComponent {
|
|
|
1300
1461
|
this.fileValueResponse.emit('');
|
|
1301
1462
|
}
|
|
1302
1463
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityAttachFileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1303
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityAttachFileComponent, selector: "gravity-attach-file", inputs: { currentLang: "currentLang", cypressTag: "cypressTag", label: "label", required: "required", state: "state", supportTextContent: "supportTextContent", supportTextType: "supportTextType" }, outputs: { fileValueResponse: "response" }, ngImport: i0, template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\" *ngIf=\"label\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-attach-file {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\">\n <ng-container *ngIf=\"!file\">\n <input autocomplete=\"off\" class=\"hr-label md-regular\" hidden id=\"fileInput\" type=\"file\"\n [attr.data-cy]=\"cypressTag\"\n [attr.disabled]=\"state == 'disabled' ? true : null\"\n [attr.readonly]=\"state == 'readonly' ? true : null\"\n\n (change)=\"handleFileInput($event)\">\n <label for=\"fileInput\">\n <gravity-button [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{label}}\n </gravity-button>\n </label>\n </ng-container>\n <ng-container *ngIf=\"file\">\n <label>\n <gravity-button (click)=\"removeFile()\" [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{currentLang == 'en' ? 'Remove file' : 'Remover archivo'}}\n </gravity-button>\n </label>\n <h3>{{currentLang == 'en' ? 'File' : 'Archivo'}}: {{file.name}}</h3>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}.gravity-attach-file{align-items:center;display:flex}.gravity-attach-file label{cursor:pointer}.gravity-attach-file label:hover gravity-button ::ng-deep button{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}gravity-button
|
|
1464
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityAttachFileComponent, selector: "gravity-attach-file", inputs: { currentLang: "currentLang", cypressTag: "cypressTag", label: "label", required: "required", state: "state", supportTextContent: "supportTextContent", supportTextType: "supportTextType" }, outputs: { fileValueResponse: "response" }, ngImport: i0, template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\" *ngIf=\"label\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-attach-file {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\">\n <ng-container *ngIf=\"!file\">\n <input autocomplete=\"off\" class=\"hr-label md-regular\" hidden id=\"fileInput\" type=\"file\"\n [attr.data-cy]=\"cypressTag\"\n [attr.disabled]=\"state == 'disabled' ? true : null\"\n [attr.readonly]=\"state == 'readonly' ? true : null\"\n\n (change)=\"handleFileInput($event)\">\n <label for=\"fileInput\">\n <gravity-button [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{label}}\n </gravity-button>\n </label>\n </ng-container>\n <ng-container *ngIf=\"file\">\n <label>\n <gravity-button (click)=\"removeFile()\" [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{currentLang == 'en' ? 'Remove file' : 'Remover archivo'}}\n </gravity-button>\n </label>\n <h3>{{currentLang == 'en' ? 'File' : 'Archivo'}}: {{file.name}}</h3>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}.gravity-attach-file{align-items:center;display:flex}.gravity-attach-file label{cursor:pointer}.gravity-attach-file label:hover gravity-button ::ng-deep button{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}gravity-button,gravity-button ::ng-deep button{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityButtonComponent, selector: "gravity-button", inputs: ["cypressTag", "disabled", "customState", "iconName", "isLoading", "size", "type"] }] }); }
|
|
1304
1465
|
}
|
|
1305
1466
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityAttachFileComponent, decorators: [{
|
|
1306
1467
|
type: Component,
|
|
1307
|
-
args: [{ selector: 'gravity-attach-file', template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\" *ngIf=\"label\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-attach-file {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\">\n <ng-container *ngIf=\"!file\">\n <input autocomplete=\"off\" class=\"hr-label md-regular\" hidden id=\"fileInput\" type=\"file\"\n [attr.data-cy]=\"cypressTag\"\n [attr.disabled]=\"state == 'disabled' ? true : null\"\n [attr.readonly]=\"state == 'readonly' ? true : null\"\n\n (change)=\"handleFileInput($event)\">\n <label for=\"fileInput\">\n <gravity-button [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{label}}\n </gravity-button>\n </label>\n </ng-container>\n <ng-container *ngIf=\"file\">\n <label>\n <gravity-button (click)=\"removeFile()\" [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{currentLang == 'en' ? 'Remove file' : 'Remover archivo'}}\n </gravity-button>\n </label>\n <h3>{{currentLang == 'en' ? 'File' : 'Archivo'}}: {{file.name}}</h3>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}.gravity-attach-file{align-items:center;display:flex}.gravity-attach-file label{cursor:pointer}.gravity-attach-file label:hover gravity-button ::ng-deep button{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}gravity-button
|
|
1468
|
+
args: [{ selector: 'gravity-attach-file', template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\" *ngIf=\"label\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-attach-file {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\">\n <ng-container *ngIf=\"!file\">\n <input autocomplete=\"off\" class=\"hr-label md-regular\" hidden id=\"fileInput\" type=\"file\"\n [attr.data-cy]=\"cypressTag\"\n [attr.disabled]=\"state == 'disabled' ? true : null\"\n [attr.readonly]=\"state == 'readonly' ? true : null\"\n\n (change)=\"handleFileInput($event)\">\n <label for=\"fileInput\">\n <gravity-button [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{label}}\n </gravity-button>\n </label>\n </ng-container>\n <ng-container *ngIf=\"file\">\n <label>\n <gravity-button (click)=\"removeFile()\" [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{currentLang == 'en' ? 'Remove file' : 'Remover archivo'}}\n </gravity-button>\n </label>\n <h3>{{currentLang == 'en' ? 'File' : 'Archivo'}}: {{file.name}}</h3>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}.gravity-attach-file{align-items:center;display:flex}.gravity-attach-file label{cursor:pointer}.gravity-attach-file label:hover gravity-button ::ng-deep button{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}gravity-button,gravity-button ::ng-deep button{pointer-events:none}\n"] }]
|
|
1308
1469
|
}], propDecorators: { fileValueResponse: [{
|
|
1309
1470
|
type: Output,
|
|
1310
1471
|
args: ['response']
|
|
@@ -1333,6 +1494,7 @@ class GravityDesignSystemModule {
|
|
|
1333
1494
|
GravityDialogComponent,
|
|
1334
1495
|
GravityDropdownListComponent,
|
|
1335
1496
|
GravityIconComponent,
|
|
1497
|
+
GravityMonthPickerComponent,
|
|
1336
1498
|
GravityNotificationComponent,
|
|
1337
1499
|
GravityNotificationInstantContainerComponent,
|
|
1338
1500
|
GravityRadioButtonComponent,
|
|
@@ -1380,6 +1542,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
1380
1542
|
GravityDialogComponent,
|
|
1381
1543
|
GravityDropdownListComponent,
|
|
1382
1544
|
GravityIconComponent,
|
|
1545
|
+
GravityMonthPickerComponent,
|
|
1383
1546
|
GravityNotificationComponent,
|
|
1384
1547
|
GravityNotificationInstantContainerComponent,
|
|
1385
1548
|
GravityRadioButtonComponent,
|