Skip to content

Commit

Permalink
Merge pull request #15205 from maruthumj/placeholder-issue
Browse files Browse the repository at this point in the history
Bug #15168 - placeholder overflow fix
  • Loading branch information
cetincakiroglu committed Apr 9, 2024
2 parents 8a5416e + d05d4c4 commit 6158353
Show file tree
Hide file tree
Showing 7 changed files with 47 additions and 37 deletions.
6 changes: 2 additions & 4 deletions api-generator/build-apidoc.ts
Original file line number Diff line number Diff line change
Expand Up @@ -94,10 +94,8 @@ async function main() {
readonly: prop.flags.isReadonly,
type: prop.getSignature && prop.getSignature.type ? prop.getSignature.type.toString() : prop.type ? prop.type.toString() : null,
default: prop.type && prop.type.name === 'boolean' && !prop.defaultValue ? 'false' : prop.defaultValue ? prop.defaultValue.replace(/^'|'$/g, '') : undefined,
description: ((prop.getSignature?.comment?.summary || prop.setSignature?.comment?.summary) || prop.comment?.summary)?.map((s) => s.text || '').join(' '),
deprecated: getDeprecatedText(prop.getSignature)
|| getDeprecatedText(prop.setSignature)
|| getDeprecatedText(prop)
description: (prop.getSignature?.comment?.summary || prop.setSignature?.comment?.summary || prop.comment?.summary)?.map((s) => s.text || '').join(' '),
deprecated: getDeprecatedText(prop.getSignature) || getDeprecatedText(prop.setSignature) || getDeprecatedText(prop)
});
});
doc[name]['components'][componentName]['props'] = props;
Expand Down
1 change: 1 addition & 0 deletions src/app/components/calendar/calendar.css
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
.p-calendar .p-inputtext {
flex: 1 1 auto;
width: 1%;
text-overflow: ellipsis;
}

.p-calendar-w-btn .p-inputtext {
Expand Down
4 changes: 2 additions & 2 deletions src/app/components/calendar/calendar.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1903,7 +1903,7 @@ describe('Calendar', () => {
});

it('should allow changing time when min and max date times are within the hour', () => {
const event = { preventDefault: () => { } };
const event = { preventDefault: () => {} };
const now = new Date('2023-01-01T12:14:00.000Z'); // 1 minute before max date
const minDate = new Date('2023-01-01T11:45:00.000Z'); // quarter to now date hour
const maxDate = new Date('2023-01-01T12:15:01.000Z'); // quarter past now date hour, 1 minute and 1 second after now date
Expand Down Expand Up @@ -1940,5 +1940,5 @@ describe('Calendar', () => {
calendar.incrementHour(event);
calendar.updateTime();
expect((calendar.value as Date).toISOString()).toBe(maxDateISO);
})
});
});
42 changes: 21 additions & 21 deletions src/app/components/calendar/calendar.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2499,7 +2499,7 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor {
};

constrainTime(hour: number, minute: number, second: number, pm: boolean) {
let returnTimeTriple: number[] = [ hour, minute, second ]
let returnTimeTriple: number[] = [hour, minute, second];
let value = this.value;
const convertedHour = this.convertTo24Hour(hour, pm);
const isRange = this.isRangeSelection(),
Expand All @@ -2520,7 +2520,9 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor {
const valueDateString = value ? value.toDateString() : null;
let isMinDate = this.minDate && valueDateString && this.minDate.toDateString() === valueDateString;
let isMaxDate = this.maxDate && valueDateString && this.maxDate.toDateString() === valueDateString;
switch (true) { // intentional fall through
switch (
true // intentional fall through
) {
case isMinDate && this.minDate.getHours() > convertedHour:
returnTimeTriple[0] = this.minDate.getHours();
case isMinDate && this.minDate.getHours() === convertedHour && this.minDate.getMinutes() > minute:
Expand All @@ -2543,16 +2545,15 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor {
const prevHour = this.currentHour ?? 0;
let newHour = (this.currentHour ?? 0) + this.stepHour;
let newPM = this.pm;
if (this.hourFormat == '24')
newHour = newHour >= 24 ? newHour - 24 : newHour;
if (this.hourFormat == '24') newHour = newHour >= 24 ? newHour - 24 : newHour;
else if (this.hourFormat == '12') {
// Before the AM/PM break, now after
if (prevHour < 12 && newHour > 11) {
newPM = !this.pm;
}
newHour = newHour >= 13 ? newHour - 12 : newHour;
}
[ this.currentHour, this.currentMinute, this.currentSecond ] = this.constrainTime(newHour, this.currentMinute!, this.currentSecond!, newPM!);
[this.currentHour, this.currentMinute, this.currentSecond] = this.constrainTime(newHour, this.currentMinute!, this.currentSecond!, newPM!);
this.pm = newPM;
event.preventDefault();
}
Expand Down Expand Up @@ -2615,47 +2616,46 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor {
}

decrementHour(event: any) {
let newHour = ( this.currentHour ?? 0 ) - this.stepHour;
let newHour = (this.currentHour ?? 0) - this.stepHour;
let newPM = this.pm;
if (this.hourFormat == '24')
newHour = newHour < 0 ? 24 + newHour : newHour;
if (this.hourFormat == '24') newHour = newHour < 0 ? 24 + newHour : newHour;
else if (this.hourFormat == '12') {
// If we were at noon/midnight, then switch
if (this.currentHour === 12) {
newPM = !this.pm;
}
newHour = newHour <= 0 ? 12 + newHour : newHour;
}
[ this.currentHour, this.currentMinute, this.currentSecond ] = this.constrainTime(newHour, this.currentMinute!, this.currentSecond!, newPM!);
[this.currentHour, this.currentMinute, this.currentSecond] = this.constrainTime(newHour, this.currentMinute!, this.currentSecond!, newPM!);
this.pm = newPM;
event.preventDefault();
}

incrementMinute(event: any) {
let newMinute = ( this.currentMinute ?? 0 ) + this.stepMinute;
let newMinute = (this.currentMinute ?? 0) + this.stepMinute;
newMinute = newMinute > 59 ? newMinute - 60 : newMinute;
[ this.currentHour, this.currentMinute, this.currentSecond ] = this.constrainTime(this.currentHour, newMinute, this.currentSecond!, this.pm!);
[this.currentHour, this.currentMinute, this.currentSecond] = this.constrainTime(this.currentHour, newMinute, this.currentSecond!, this.pm!);
event.preventDefault();
}

decrementMinute(event: any) {
let newMinute = ( this.currentMinute ?? 0 ) - this.stepMinute;
let newMinute = (this.currentMinute ?? 0) - this.stepMinute;
newMinute = newMinute < 0 ? 60 + newMinute : newMinute;
[ this.currentHour, this.currentMinute, this.currentSecond ] = this.constrainTime(this.currentHour, newMinute, this.currentSecond, this.pm);
[this.currentHour, this.currentMinute, this.currentSecond] = this.constrainTime(this.currentHour, newMinute, this.currentSecond, this.pm);
event.preventDefault();
}

incrementSecond(event: any) {
let newSecond = <any>this.currentSecond + this.stepSecond;
newSecond = newSecond > 59 ? newSecond - 60 : newSecond;
[ this.currentHour, this.currentMinute, this.currentSecond ] = this.constrainTime(this.currentHour, this.currentMinute, newSecond, this.pm);
[this.currentHour, this.currentMinute, this.currentSecond] = this.constrainTime(this.currentHour, this.currentMinute, newSecond, this.pm);
event.preventDefault();
}

decrementSecond(event: any) {
let newSecond = <any>this.currentSecond - this.stepSecond;
newSecond = newSecond < 0 ? 60 + newSecond : newSecond;
[ this.currentHour, this.currentMinute, this.currentSecond ] = this.constrainTime(this.currentHour, this.currentMinute, newSecond, this.pm);
[this.currentHour, this.currentMinute, this.currentSecond] = this.constrainTime(this.currentHour, this.currentMinute, newSecond, this.pm);
event.preventDefault();
}

Expand Down Expand Up @@ -2694,7 +2694,7 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor {

toggleAMPM(event: any) {
const newPM = !this.pm;
[ this.currentHour, this.currentMinute, this.currentSecond ] = this.constrainTime(this.currentHour, this.currentMinute, this.currentSecond, newPM);
[this.currentHour, this.currentMinute, this.currentSecond] = this.constrainTime(this.currentHour, this.currentMinute, this.currentSecond, newPM);
this.pm = newPM;
this.updateTime();
event.preventDefault();
Expand Down Expand Up @@ -2729,11 +2729,11 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor {
isValidSelection(value: any): boolean {
if (this.isSingleSelection()) {
return this.isSelectable(value.getDate(), value.getMonth(), value.getFullYear(), false);
}
let isValid = value.every((v: any) => this.isSelectable(v.getDate(), v.getMonth(), v.getFullYear(), false));
if (isValid && this.isRangeSelection()) {
isValid = value.length === 1 || (value.length > 1 && value[1] >= value[0]);
}
}
let isValid = value.every((v: any) => this.isSelectable(v.getDate(), v.getMonth(), v.getFullYear(), false));
if (isValid && this.isRangeSelection()) {
isValid = value.length === 1 || (value.length > 1 && value[1] >= value[0]);
}
return isValid;
}

Expand Down
2 changes: 1 addition & 1 deletion src/app/components/inputotp/inputotp.ts
Original file line number Diff line number Diff line change
Expand Up @@ -300,7 +300,7 @@ export class InputOtp implements AfterContentInit {
break;
}
}

onPaste(event) {
let paste = event.clipboardData.getData('text');

Expand Down
2 changes: 1 addition & 1 deletion src/app/components/treeselect/treeselect.ts
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,7 @@ export const TREESELECT_VALUE_ACCESSOR: any = {
</span>
</button>
</div>
<div class="p-treeselect-items-wrapper" [ngStyle]="{ 'max-height': scrollHeight }" >
<div class="p-treeselect-items-wrapper" [ngStyle]="{ 'max-height': scrollHeight }">
<p-tree
#tree
[value]="options"
Expand Down
27 changes: 19 additions & 8 deletions src/app/showcase/doc/treeselect/virtualscrolldoc.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,19 +4,30 @@ import { NodeService } from '../../service/nodeservice';

@Component({
selector: 'virtual-scroll-doc',
template: `
<app-docsectiontext>
<p>VirtualScrolling is an efficient way of rendering the options by displaying a small subset of data in the viewport at any time. When dealing with huge number of options, it is suggested to enable VirtualScrolling to avoid performance
issues. Usage is simple as setting <i>virtualScroll</i> property to true and defining <i>virtualScrollItemSize</i> to specify the height of an item.</p>
template: ` <app-docsectiontext>
<p>
VirtualScrolling is an efficient way of rendering the options by displaying a small subset of data in the viewport at any time. When dealing with huge number of options, it is suggested to enable VirtualScrolling to avoid performance
issues. Usage is simple as setting <i>virtualScroll</i> property to true and defining <i>virtualScrollItemSize</i> to specify the height of an item.
</p>
</app-docsectiontext>
<div class="card flex justify-content-center">
<p-treeSelect class="w-full md:w-20rem" containerStyleClass="w-full" [(ngModel)]="selectedNodes" [options]="nodes" display="chip" [metaKeySelection]="false" selectionMode="checkbox" placeholder="Select Item"
[virtualScroll]="true" [virtualScrollItemSize]="46" [virtualScrollOptions]="{ scrollHeight: '200px' }"></p-treeSelect>
<p-treeSelect
class="w-full md:w-20rem"
containerStyleClass="w-full"
[(ngModel)]="selectedNodes"
[options]="nodes"
display="chip"
[metaKeySelection]="false"
selectionMode="checkbox"
placeholder="Select Item"
[virtualScroll]="true"
[virtualScrollItemSize]="46"
[virtualScrollOptions]="{ scrollHeight: '200px' }"
></p-treeSelect>
</div>
<app-code [code]="code" selector="tree-select-virtual-scroll-demo"></app-code>`
})
export class VirtualScrollDoc {

nodes!: any[];

selectedNodes: any;
Expand Down Expand Up @@ -49,6 +60,6 @@ export class TreeSelectVirtualScrollDemo {
}
}`,

service: ['NodeService'],
service: ['NodeService']
};
}

0 comments on commit 6158353

Please sign in to comment.