Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: #6682 #7247

Merged
merged 3 commits into from
Sep 25, 2024
Merged

fix: #6682 #7247

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
a62e878
fix: #6682
gcko Sep 25, 2024
1ce65ea
Make use of `DomHandler.applyStyle`method
gcko Sep 25, 2024
eb7121c
Update typing to include `string` as an option
gcko Sep 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 10 additions & 2 deletions components/lib/scrollpanel/ScrollPanel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,14 +70,22 @@ export const ScrollPanel = React.forwardRef((inProps, ref) => {
DomHandler.addClass(xBarRef.current, 'p-scrollpanel-hidden');
} else {
DomHandler.removeClass(xBarRef.current, 'p-scrollpanel-hidden');
xBarRef.current.style.cssText = 'width:' + Math.max(scrollXRatio.current * 100, 10) + '%; left:' + (contentRef.current.scrollLeft / totalWidth) * 100 + '%;bottom:' + bottom + 'px;';
DomHandler.applyStyle(xBarRef.current, {
width: Math.max(scrollXRatio.current * 100, 10) + '%',
left: (contentRef.current.scrollLeft / totalWidth) * 100 + '%',
bottom: bottom + 'px'
});
}

if (scrollYRatio.current >= 1) {
DomHandler.addClass(yBarRef.current, 'p-scrollpanel-hidden');
} else {
DomHandler.removeClass(yBarRef.current, 'p-scrollpanel-hidden');
yBarRef.current.style.cssText = 'height:' + Math.max(scrollYRatio.current * 100, 10) + '%; top: calc(' + (contentRef.current.scrollTop / totalHeight) * 100 + '% - ' + xBarRef.current.clientHeight + 'px);right:' + right + 'px;';
DomHandler.applyStyle(yBarRef.current, {
height: Math.max(scrollYRatio.current * 100, 10) + '%',
top: 'calc(' + (contentRef.current.scrollTop / totalHeight) * 100 + '% - ' + xBarRef.current.clientHeight + 'px)',
right: right + 'px'
});
}
});
};
Expand Down
4 changes: 2 additions & 2 deletions components/lib/utils/DomHandler.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1055,9 +1055,9 @@ export default class DomHandler {

static applyStyle(element, style) {
if (typeof style === 'string') {
element.style.cssText = this.style;
element.style.cssText = style;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@melloware I updated DomHandler.applyStyle to correctly "apply" the passed in style parameter.

} else {
for (let prop in this.style) {
for (let prop in style) {
element.style[prop] = style[prop];
}
}
Expand Down
2 changes: 1 addition & 1 deletion components/lib/utils/utils.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@ export declare class DomHandler {
static getCursorOffset(el: HTMLElement, prevText?: string, nextText?: string, currentText?: string): { top: any; left: any };
static invokeElementMethod(el: HTMLElement, methodName: string, arg: any): void;
static isClickable(el: HTMLElement): boolean;
static applyStyle(el: HTMLElement, style: any): void;
static applyStyle(el: HTMLElement, style: React.CSSProperties | string): void;
static exportCSV(csv: any, filename: string): void;
static saveAs(file: { name: string; url: any }): boolean;
static createInlineStyle(nonce?: string, styleContainer?: ShadowRoot | HTMLElement): HTMLStyleElement;
Expand Down
Loading