@libs-ui/components-scroll-overlay 0.1.1-1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +138 -0
- package/demo/scroll-overlay.demo.d.ts +44 -0
- package/esm2022/demo/scroll-overlay.demo.mjs +84 -0
- package/esm2022/index.mjs +4 -0
- package/esm2022/libs-ui-components-scroll-overlay.mjs +5 -0
- package/esm2022/scroll-overlay.directive.mjs +376 -0
- package/esm2022/scroll.interface.mjs +2 -0
- package/fesm2022/libs-ui-components-scroll-overlay.mjs +464 -0
- package/fesm2022/libs-ui-components-scroll-overlay.mjs.map +1 -0
- package/index.d.ts +3 -0
- package/package.json +26 -0
- package/scroll-overlay.directive.d.ts +48 -0
- package/scroll.interface.d.ts +14 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"libs-ui-components-scroll-overlay.mjs","sources":["../../../../../libs-ui/components/scroll-overlay/src/scroll-overlay.directive.ts","../../../../../libs-ui/components/scroll-overlay/src/demo/scroll-overlay.demo.ts","../../../../../libs-ui/components/scroll-overlay/src/demo/scroll-overlay.demo.html","../../../../../libs-ui/components/scroll-overlay/src/libs-ui-components-scroll-overlay.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Directive, ElementRef, OnDestroy, Renderer2, computed, effect, inject, input, output, signal, untracked } from '@angular/core';\nimport { checkMouseOverInContainer, getDragEventByElement } from '@libs-ui/utils';\nimport { Subject, Subscription, fromEvent, interval, switchMap, takeUntil, tap } from 'rxjs';\nimport { IScrollOverlayOptions, TYPE_SCROLL_DIRECTION } from './scroll.interface';\n@Directive({\n // eslint-disable-next-line @angular-eslint/directive-selector\n selector: '[LibsUiComponentsScrollOverlayDirective]',\n standalone: true,\n})\nexport class LibsUiComponentsScrollOverlayDirective implements OnDestroy {\n // #region PROPERTY\n private readonly styles = computed(\n () => `\n .scrollbar-track{\n background-color:${this.scrollbarColor()};\n }\n .scrollbar-track:hover{\n background-color:${this.scrollbarHoverColor()};\n }\n .scrollbar-track-X {\n width:100%;\n position: absolute;\n bottom: 0;\n left: 0;\n visibility: hidden;\n cursor: pointer;\n opacity: 0;\n z-index: 1;\n transition: opacity 0.3s ease, visibility 0.3s ease;\n }\n\n .scrollbar-track-Y {\n height:100%;\n position: absolute;\n top: 0;\n right: 0;\n visibility: hidden;\n cursor: pointer;\n opacity: 0;\n z-index: 1;\n transition: opacity 0.3s ease, visibility 0.3s ease;\n }\n\n .scrollbar-thumb{\n background-color:${this.scrollThumbColor()};\n }\n .scrollbar-thumb:hover{\n background-color:${this.scrollThumbHoverColor()};\n }\n\n .scrollbar-thumb-X {\n height: calc(100% - ${this.scrollbarPadding() * 2}px);\n bottom: ${this.scrollbarPadding()}px;\n border-radius: 4px;\n cursor: grabbing;\n transition: background-color 0.3s;\n position: absolute;\n }\n\n .scrollbar-thumb-Y {\n width: calc(100% - ${this.scrollbarPadding() * 2}px);\n right: ${this.scrollbarPadding()}px;\n border-radius: 4px;\n cursor: grabbing;\n transition: background-color 0.3s;\n position: absolute;\n }\n `,\n {}\n );\n private isScrollThumb = signal<boolean>(false);\n private keepDisplayThumb = signal<boolean>(false);\n private subsX = new Subscription();\n private subsY = new Subscription();\n private scrollbarWidth = computed(() => this.options()?.scrollbarWidth ?? 10); // Chiều rộng thanh cuộn\n private scrollbarPadding = computed(() => this.options()?.scrollbarPadding ?? 2); // Chiều rộng thanh cuộn\n private scrollbarColor = computed(() => this.options()?.scrollbarColor ?? '');\n private scrollbarHoverColor = computed(() => this.options()?.scrollbarColor ?? '#CDD0D640');\n private scrollThumbColor = computed(() => this.options()?.scrollThumbColor ?? '#CDD0D6');\n private scrollThumbHoverColor = computed(() => this.options()?.scrollThumbHoverColor ?? '#9CA2AD');\n private readonly divContainer = document.createElement('div');\n private readonly trackX: HTMLElement = document.createElement('div');\n private readonly thumbX: HTMLElement = document.createElement('div');\n private readonly trackY: HTMLElement = document.createElement('div');\n private readonly thumbY: HTMLElement = document.createElement('div');\n private readonly onDestroy = new Subject<void>();\n\n // #region INPUT\n readonly debugMode = input<boolean>(false);\n readonly ignoreInit = input<boolean>(false);\n readonly classContainer = input<string, string | undefined>('', { transform: (value) => value ?? '' });\n readonly options = input<IScrollOverlayOptions | undefined>(Object.assign({}));\n readonly elementCheckScrollX = input<HTMLElement>();\n readonly elementCheckScrollY = input<HTMLElement>();\n readonly elementScroll = input<HTMLElement>();\n\n // #region OUTPUT\n readonly outScroll = output<Event>();\n readonly outScrollX = output<Event>();\n readonly outScrollY = output<Event>();\n readonly outScrollTop = output<Event>();\n readonly outScrollBottom = output<Event>();\n\n // #region INJECT\n private element = inject(ElementRef);\n private render2 = inject(Renderer2);\n\n constructor() {\n effect(() => {\n if (this.ignoreInit()) {\n return;\n }\n const options = this.options();\n this.divContainer.className = '';\n this.classContainer()\n ?.split(' ')\n .forEach((className) => {\n if (!className) {\n return;\n }\n this.divContainer.classList.add(className);\n });\n\n untracked(() => {\n this.Element.classList.toggle('overflow-hidden', options?.scrollX === 'hidden' && options?.scrollY === 'hidden');\n if (options?.scrollX !== 'hidden') {\n this.subsX.unsubscribe();\n this.trackX.className = '';\n this.thumbX.className = '';\n this.trackX.style.height = `${this.scrollbarWidth()}px`;\n this.createScrollbar('X', this.trackX, this.thumbX);\n this.bindEventsScrollBar('X', this.trackX);\n\n this.handlerDragAndDropThumb('X');\n this.handlerClickTrack('X');\n }\n\n if (options?.scrollY !== 'hidden') {\n this.trackY.className = '';\n this.thumbY.className = '';\n this.trackY.style.width = `${this.scrollbarWidth()}px`;\n this.subsY.unsubscribe();\n this.createScrollbar('Y', this.trackY, this.thumbY);\n this.bindEventsScrollBar('Y', this.trackY);\n\n this.handlerDragAndDropThumb('Y');\n this.handlerClickTrack('Y');\n }\n });\n });\n }\n\n // #region FUNCTIONS\n private get Element(): HTMLElement {\n return this.elementScroll() || this.element.nativeElement;\n }\n\n private createScrollbar(scrollDirection: TYPE_SCROLL_DIRECTION, trackEl: HTMLElement, thumbEl: HTMLElement) {\n const idStyleTag = '#id-style-tag-custom-scroll-overlay';\n const styleElCustomScrollOverlay = document.getElementById(idStyleTag);\n\n if (!styleElCustomScrollOverlay) {\n const styleEl = document.createElement('style');\n styleEl.setAttribute('id', idStyleTag);\n styleEl.innerHTML = this.styles();\n document.head.append(styleEl);\n }\n\n const stylesProperty = {\n 'box-sizing': 'border-box',\n 'scrollbar-width': 'none',\n 'scrollbar-color': 'transparent transparent',\n overflow: 'hidden',\n 'overflow-x': `${this.options()?.scrollX || 'scroll'}`,\n 'overflow-y': `${this.options()?.scrollY || 'scroll'}`,\n } as any;\n\n Object.keys(stylesProperty).forEach((key) => {\n this.render2.setStyle(this.Element, key, stylesProperty[key], 1);\n });\n\n trackEl.classList.add(`scrollbar-track`);\n trackEl.classList.add(`scrollbar-track-${scrollDirection}`);\n\n thumbEl.classList.add(`scrollbar-thumb`);\n thumbEl.classList.add(`scrollbar-thumb-${scrollDirection}`);\n trackEl.appendChild(thumbEl);\n if (this.Element.className) {\n this.Element.className.split(' ').forEach((className: string) => {\n if (\n className &&\n (['w-full', 'w-screen', 'h-full', 'h-screen', 'shrink-0'].includes(className) || className.includes('min-h-') || className.includes('min-w-') || /^(!?)(h|w)-\\[[0-9]+px\\]$/.test(className)) &&\n !this.divContainer.classList.contains(className)\n ) {\n this.divContainer.classList.add(className);\n }\n });\n if (!this.Element.className.includes('min-h-')) {\n this.divContainer.classList.add('min-h-0');\n }\n if (!this.Element.className.includes('min-w-')) {\n this.divContainer.classList.add('min-w-0');\n }\n }\n this.divContainer.appendChild(trackEl);\n\n if (!this.divContainer.style.position) {\n this.Element.parentElement?.insertBefore(this.divContainer, this.Element);\n this.divContainer.style.position = 'relative';\n }\n this.divContainer.append(this.Element);\n this.updateScrollbarSize(scrollDirection);\n }\n\n private bindEventsScrollBar(scrollDirection: TYPE_SCROLL_DIRECTION, trackEl: HTMLElement) {\n let scrollLeft = this.Element.scrollLeft;\n let scrollTop = this.Element.scrollTop;\n const subs: Subscription = fromEvent<Event>(this.Element, 'scroll')\n .pipe(\n tap((event) => {\n const target = this.Element;\n\n this.outScroll.emit(event);\n if (scrollDirection === 'X') {\n if (target.scrollLeft && target.scrollLeft + target.offsetWidth >= target.scrollWidth) {\n target.scrollLeft = target.scrollWidth - target.offsetWidth - (target.offsetWidth - target.clientWidth);\n }\n\n if (target.scrollLeft !== scrollLeft) {\n this.outScrollX.emit(event);\n }\n scrollLeft = target.scrollLeft;\n this.updateScrollbarPosition(scrollDirection);\n\n return;\n }\n\n if (target.scrollTop === scrollTop) {\n return;\n }\n this.updateScrollbarPosition(scrollDirection);\n scrollTop = target.scrollTop;\n this.outScrollY.emit(event);\n\n if (target.scrollTop === 0) {\n return this.outScrollTop.emit(event);\n }\n\n if (target.scrollHeight <= target.scrollTop + target.offsetHeight + 3) {\n return this.outScrollBottom.emit(event);\n }\n }),\n takeUntil(this.onDestroy)\n )\n .subscribe();\n\n subs.add(\n fromEvent(document, 'resize')\n .pipe(tap(this.updateScrollbarSize.bind(this, scrollDirection)), takeUntil(this.onDestroy))\n .subscribe()\n );\n\n const mouseLeave = fromEvent(this.divContainer, 'mouseleave');\n const mouseenter = fromEvent(this.divContainer, 'mouseenter');\n\n subs.add(\n mouseenter\n .pipe(\n tap(() => {\n if ((scrollDirection === 'X' && !this.options()?.scrollXOpacity0) || (scrollDirection === 'Y' && !this.options()?.scrollYOpacity0)) {\n trackEl.style.visibility = 'visible';\n trackEl.style.opacity = '1';\n }\n this.updateScrollbarSize(scrollDirection);\n }),\n switchMap(() => interval(1000).pipe(takeUntil(mouseLeave))),\n tap(this.updateScrollbarSize.bind(this, scrollDirection)),\n takeUntil(this.onDestroy)\n )\n .subscribe()\n );\n\n subs.add(\n mouseLeave\n .pipe(\n tap(() => {\n if (this.keepDisplayThumb()) {\n return;\n }\n trackEl.style.visibility = 'hidden';\n trackEl.style.opacity = '0';\n }),\n takeUntil(this.onDestroy)\n )\n .subscribe()\n );\n\n if (scrollDirection === 'X') {\n this.subsX = subs;\n\n return;\n }\n\n if (scrollDirection === 'Y') {\n this.subsY = subs;\n\n return;\n }\n }\n\n protected handlerClickTrack(scrollDirection: TYPE_SCROLL_DIRECTION) {\n const elementTrack = scrollDirection === 'X' ? this.trackX : this.trackY;\n const elementThumb = scrollDirection === 'X' ? this.thumbX : this.thumbY;\n const subs = scrollDirection === 'X' ? this.subsX : this.subsY;\n\n subs.add(\n fromEvent<MouseEvent>(elementTrack, 'click').subscribe((e) => {\n if (this.isScrollThumb()) {\n return;\n }\n if ((scrollDirection === 'X' && e.clientX < elementThumb.getBoundingClientRect().left) || (scrollDirection === 'Y' && e.clientY < elementThumb.getBoundingClientRect().top)) {\n this.updateScrollPositionByUserAction(scrollDirection, e, 'smooth', 0);\n return;\n }\n\n if (scrollDirection === 'X') {\n this.updateScrollPositionByUserAction(scrollDirection, e, 'smooth', -1 * elementThumb.getBoundingClientRect().width);\n return;\n }\n this.updateScrollPositionByUserAction(scrollDirection, e, 'smooth', -1 * elementThumb.getBoundingClientRect().height);\n })\n );\n }\n\n protected handlerDragAndDropThumb(scrollDirection: TYPE_SCROLL_DIRECTION) {\n const elementTrack = scrollDirection === 'X' ? this.trackX : this.trackY;\n const elementThumb = scrollDirection === 'X' ? this.thumbX : this.thumbY;\n const subs = scrollDirection === 'X' ? this.subsX : this.subsY;\n let lengthThumbToPointClick = 0;\n\n subs.add(\n getDragEventByElement({\n elementMouseDown: elementThumb,\n functionMouseDown: (mouseEvent: MouseEvent) => {\n this.isScrollThumb.set(true);\n this.keepDisplayThumb.set(true);\n if (scrollDirection === 'X') {\n lengthThumbToPointClick = elementThumb.getBoundingClientRect().left - mouseEvent.clientX;\n return;\n }\n lengthThumbToPointClick = elementThumb.getBoundingClientRect().top - mouseEvent.clientY;\n },\n functionMouseUp: (mouseEvent: MouseEvent) => {\n this.keepDisplayThumb.set(false);\n lengthThumbToPointClick = 0;\n if (!checkMouseOverInContainer(mouseEvent, this.Element)) {\n elementTrack.style.visibility = 'hidden';\n elementTrack.style.opacity = '0';\n }\n setTimeout(() => {\n this.isScrollThumb.set(false);\n }, 250);\n },\n onDestroy: this.onDestroy,\n }).subscribe((mouseEvent: MouseEvent) => {\n this.updateScrollPositionByUserAction(scrollDirection, mouseEvent, 'auto', lengthThumbToPointClick);\n })\n );\n }\n\n private updateScrollPositionByUserAction(scrollDirection: TYPE_SCROLL_DIRECTION, e: MouseEvent, behavior: 'auto' | 'smooth', lengthThumbToPointClick = 0) {\n e.stopPropagation();\n if (scrollDirection === 'X') {\n const containerWidth = this.Element.offsetWidth;\n const contentWidth = (this.elementCheckScrollX() || this.Element).scrollWidth;\n const thumbPosition = e.clientX - this.Element.getBoundingClientRect().left + lengthThumbToPointClick;\n const scrollLeft = (thumbPosition / (containerWidth - this.thumbX.offsetWidth)) * (contentWidth - containerWidth);\n\n this.Element.scroll({ left: scrollLeft, behavior });\n return;\n }\n const containerHeight = this.Element.offsetHeight;\n const contentHeight = (this.elementCheckScrollY() || this.Element).scrollHeight;\n const thumbPosition = e.clientY - this.Element.getBoundingClientRect().top + lengthThumbToPointClick;\n const scrollTop = (thumbPosition / (containerHeight - this.thumbY.offsetHeight)) * (contentHeight - containerHeight);\n\n this.Element.scroll({ top: scrollTop, behavior });\n }\n\n private updateScrollbarSize(scrollDirection: TYPE_SCROLL_DIRECTION) {\n if (scrollDirection === 'X') {\n const containerWidth = this.Element.offsetWidth;\n const contentWidth = (this.elementCheckScrollX() || this.Element).scrollWidth;\n const thumbWidth = (containerWidth / contentWidth) * containerWidth;\n\n this.thumbX.style.width = `${Math.max(20, thumbWidth)}px`;\n this.trackX.style.display = 'none';\n if (contentWidth > containerWidth) {\n this.trackX.style.display = 'block';\n }\n this.updateScrollbarPosition(scrollDirection);\n\n return;\n }\n\n const containerHeight = this.Element.offsetHeight;\n const contentHeight = (this.elementCheckScrollY() || this.Element).scrollHeight;\n const thumbHeight = (containerHeight / contentHeight) * containerHeight;\n\n this.thumbY.style.height = `${Math.max(20, thumbHeight)}px`;\n this.trackY.style.display = 'none';\n if (contentHeight > containerHeight) {\n this.trackY.style.display = 'block';\n }\n\n this.updateScrollbarPosition('Y');\n }\n\n private updateScrollbarPosition(scrollDirection: TYPE_SCROLL_DIRECTION) {\n if (scrollDirection === 'X') {\n const containerWidth = this.Element.offsetWidth;\n const contentWidth = (this.elementCheckScrollX() || this.Element).scrollWidth;\n const scrollLeft = this.Element.scrollLeft;\n const thumbPosition = (scrollLeft / (contentWidth - containerWidth)) * (containerWidth - this.thumbX.offsetWidth);\n\n this.thumbX.style.left = `${thumbPosition}px`;\n\n return;\n }\n const containerHeight = this.Element.offsetHeight;\n const contentHeight = (this.elementCheckScrollY() || this.Element).scrollHeight;\n const scrollTop = this.Element.scrollTop;\n const thumbPosition = (scrollTop / (contentHeight - containerHeight)) * (containerHeight - this.thumbY.offsetHeight);\n\n this.thumbY.style.top = `${thumbPosition}px`;\n }\n\n ngOnDestroy(): void {\n this.divContainer.remove();\n this.subsX.unsubscribe();\n this.subsY.unsubscribe();\n this.onDestroy.next();\n this.onDestroy.complete();\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { Component, signal } from '@angular/core';\nimport { LibsUiComponentsScrollOverlayDirective } from '../scroll-overlay.directive';\nimport { IScrollOverlayOptions } from '../scroll.interface';\n\n@Component({\n selector: 'lib-scroll-overlay-demo',\n standalone: true,\n imports: [CommonModule, LibsUiComponentsScrollOverlayDirective],\n templateUrl: './scroll-overlay.demo.html',\n styleUrls: ['./scroll-overlay.demo.scss'],\n})\nexport class LibsUiComponentsScrollOverlayDemoComponent {\n // Demo text content: generate 5000 words for vertical scrolling\n longContent = signal(Array.from({ length: 5000 }, (_, i) => `Lorem${i + 1}`).join(' '));\n // Demo horizontal content: generate 5000 words for horizontal scrolling\n longHorizontalContent = signal(Array.from({ length: 5000 }, (_, i) => `Word${i + 1}`).join(' '));\n\n // Scenario selection\n scenarioOptions = ['default', 'customStyle', 'autoHide', 'horizontal'] as const;\n selectedScenario: (typeof this.scenarioOptions)[number] = 'default';\n\n // Options signals\n customStyleOptions = signal<IScrollOverlayOptions>({ scrollbarWidth: 12, scrollbarColor: '#f3f4f6', scrollbarHoverColor: '#e5e7eb', scrollThumbColor: '#3b82f6', scrollThumbHoverColor: '#2563eb', scrollbarPadding: 4 });\n autoHideOptions = signal<IScrollOverlayOptions>({ scrollYOpacity0: true, scrollbarWidth: 8, scrollbarColor: 'transparent', scrollThumbColor: '#9ca3af', scrollThumbHoverColor: '#6b7280' });\n horizontalOptions = signal<IScrollOverlayOptions>({ scrollX: 'scroll', scrollY: 'hidden', scrollbarWidth: 8, scrollbarColor: '#f3f4f6', scrollThumbColor: '#3b82f6' });\n\n // Scroll event log\n lastEvent = signal<string>('No events yet');\n\n // Helpers\n get options(): IScrollOverlayOptions | undefined {\n switch (this.selectedScenario) {\n case 'customStyle':\n return this.customStyleOptions();\n case 'autoHide':\n return this.autoHideOptions();\n case 'horizontal':\n return this.horizontalOptions();\n default:\n return undefined;\n }\n }\n\n get content(): string {\n return this.selectedScenario === 'horizontal' ? this.longHorizontalContent() : this.longContent();\n }\n\n // Event handlers\n onScroll() {\n this.lastEvent.set('Scroll event fired');\n }\n onScrollTop() {\n this.lastEvent.set('Reached top');\n }\n onScrollBottom() {\n this.lastEvent.set('Reached bottom');\n }\n\n // API docs\n inputsDoc = [\n { name: 'options', type: 'IScrollOverlayOptions', default: 'undefined', description: 'Cấu hình tuỳ chỉnh scrollbar' },\n { name: 'debugMode', type: 'boolean', default: 'false', description: 'Bật chế độ debug' },\n { name: 'notShowScrollBarX', type: 'boolean', default: 'false', description: 'Ẩn scrollbar ngang' },\n { name: 'notShowScrollBarY', type: 'boolean', default: 'false', description: 'Ẩn scrollbar dọc' },\n ];\n outputsDoc = [\n { name: 'outScroll', type: 'Event', description: 'Bắn ra khi scroll bất kỳ' },\n { name: 'outScrollTop', type: 'Event', description: 'Bắn ra khi scroll đến top' },\n { name: 'outScrollBottom', type: 'Event', description: 'Bắn ra khi scroll đến bottom' },\n ];\n optionsDoc = [\n { name: 'scrollbarWidth', type: 'number', default: 'undefined', description: 'Chiều rộng scrollbar (px)' },\n { name: 'scrollbarColor', type: 'string', default: 'undefined', description: 'Màu track scrollbar' },\n { name: 'scrollbarHoverColor', type: 'string', default: 'undefined', description: 'Màu track khi hover' },\n { name: 'scrollThumbColor', type: 'string', default: 'undefined', description: 'Màu thumb' },\n { name: 'scrollThumbHoverColor', type: 'string', default: 'undefined', description: 'Màu thumb khi hover' },\n { name: 'scrollbarPadding', type: 'number', default: 'undefined', description: 'Padding scrollbar' },\n { name: 'scrollX', type: `'hidden' | 'scroll'`, default: 'undefined', description: 'Kiểu scroll X' },\n { name: 'scrollXOpacity0', type: 'boolean', default: 'undefined', description: 'Ẩn track X khi không hover' },\n { name: 'scrollY', type: `'hidden' | 'scroll'`, default: 'undefined', description: 'Kiểu scroll Y' },\n { name: 'scrollYOpacity0', type: 'boolean', default: 'undefined', description: 'Ẩn track Y khi không hover' },\n ];\n interfacesDoc = [{ name: 'IScrollOverlayOptions', type: 'interface', description: 'Các tuỳ chọn cấu hình scroll-overlay' }];\n\n // Installation commands\n installCommandNpm = 'npm install @libs-ui/components-scroll-overlay';\n installCommandYarn = 'yarn add @libs-ui/components-scroll-overlay';\n\n copyToClipboard(text: string) {\n navigator.clipboard.writeText(text).then(() => console.log('Copied:', text));\n }\n}\n","<div class=\"max-w-6xl mx-auto p-5 font-sans text-gray-800\">\n <header class=\"text-center py-10 bg-white rounded-lg mb-8 shadow-sm\">\n <h1 class=\"text-4xl font-bold mb-2\">Demo Scroll Overlay</h1>\n <p class=\"text-xl text-gray-500\">@libs-ui/components-scroll-overlay</p>\n </header>\n\n <main>\n <!-- Giới thiệu -->\n <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">Giới thiệu</h2>\n <p>\n <code>scroll-overlay</code>\n là một directive giúp tuỳ biến scrollbar trên bất kỳ phần tử nào trong Angular, hỗ trợ tuỳ chỉnh màu, kích thước, ẩn/hiện và sự kiện scroll.\n </p>\n </section>\n\n <!-- Cài đặt -->\n <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">Cài đặt</h2>\n <div class=\"flex items-center bg-gray-100 p-4 rounded-lg mb-4\">\n <pre class=\"flex-1 text-sm overflow-x-auto\"><code>{{ installCommandNpm }}</code></pre>\n <button\n class=\"ml-4 px-3 py-1 bg-blue-500 text-white rounded hover:bg-blue-600\"\n (click)=\"copyToClipboard(installCommandNpm)\">\n Sao chép\n </button>\n </div>\n <div class=\"flex items-center bg-gray-100 p-4 rounded-lg\">\n <pre class=\"flex-1 text-sm overflow-x-auto\"><code>{{ installCommandYarn }}</code></pre>\n <button\n class=\"ml-4 px-3 py-1 bg-blue-500 text-white rounded hover:bg-blue-600\"\n (click)=\"copyToClipboard(installCommandYarn)\">\n Sao chép\n </button>\n </div>\n </section>\n\n <!-- Demo Trực tiếp -->\n <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">Demo Trực tiếp</h2>\n <div class=\"grid grid-cols-4 gap-4 mb-6\">\n <button\n *ngFor=\"let sc of scenarioOptions\"\n (click)=\"selectedScenario = sc\"\n class=\"px-3 py-1 border rounded\"\n [class.bg-blue-500]=\"selectedScenario === sc\"\n [class.text-white]=\"selectedScenario === sc\">\n {{ sc }}\n </button>\n </div>\n <div class=\"p-4 bg-gray-50 rounded-lg h-[300px]\">\n <div\n LibsUiComponentsScrollOverlayDirective\n [options]=\"options\"\n (outScroll)=\"onScroll()\"\n (outScrollTop)=\"onScrollTop()\"\n (outScrollBottom)=\"onScrollBottom()\"\n class=\"w-full h-full\">\n <div\n class=\"p-2\"\n [innerText]=\"content\"\n [class.whitespace-pre-wrap]=\"selectedScenario !== 'horizontal'\"\n [class.whitespace-nowrap]=\"selectedScenario === 'horizontal'\"></div>\n </div>\n </div>\n <p class=\"mt-4 text-gray-700\">Sự kiện: {{ lastEvent() }}</p>\n </section>\n\n <!-- Cách sử dụng -->\n <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">Cách sử dụng</h2>\n <pre class=\"bg-gray-100 p-4 rounded-lg overflow-auto text-sm\">\n <code ngNonBindable><div LibsUiComponentsScrollOverlayDirective [options]=\"{ scrollbarWidth:12, scrollThumbColor:'#3b82f6' }\" style=\"width:300px;height:200px;overflow:auto;\">\n Nội dung dài...\n</div></code>\n </pre>\n </section>\n\n <!-- API Reference -->\n <section class=\"bg-white rounded-lg p-8 mb-8 shadow-sm\">\n <h2 class=\"text-2xl font-bold mb-5 pb-3 border-b border-gray-200\">API Reference</h2>\n <h3 class=\"text-xl font-semibold mb-3\">Inputs</h3>\n <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n <thead>\n <tr>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Tên</th>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Kiểu</th>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Mặc định</th>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Mô tả</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let input of inputsDoc\">\n <td class=\"py-2 px-4 border-b\">\n <code>{{ input.name }}</code>\n </td>\n <td class=\"py-2 px-4 border-b\">\n <code>{{ input.type }}</code>\n </td>\n <td class=\"py-2 px-4 border-b\">{{ input.default }}</td>\n <td class=\"py-2 px-4 border-b\">{{ input.description }}</td>\n </tr>\n </tbody>\n </table>\n <h3 class=\"text-xl font-semibold mb-3\">Outputs</h3>\n <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n <thead>\n <tr>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Tên</th>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Kiểu</th>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Mô tả</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let output of outputsDoc\">\n <td class=\"py-2 px-4 border-b\">\n <code>{{ output.name }}</code>\n </td>\n <td class=\"py-2 px-4 border-b\">\n <code>{{ output.type }}</code>\n </td>\n <td class=\"py-2 px-4 border-b\">{{ output.description }}</td>\n </tr>\n </tbody>\n </table>\n <h3 class=\"text-xl font-semibold mb-3\">Options</h3>\n <table class=\"min-w-full bg-white border border-gray-200 mb-6\">\n <thead>\n <tr>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Thuộc tính</th>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Kiểu</th>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Mặc định</th>\n <th class=\"py-2 px-4 border-b bg-gray-100\">Mô tả</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let opt of optionsDoc\">\n <td class=\"py-2 px-4 border-b\">\n <code>{{ opt.name }}</code>\n </td>\n <td class=\"py-2 px-4 border-b\">\n <code>{{ opt.type }}</code>\n </td>\n <td class=\"py-2 px-4 border-b\">{{ opt.default }}</td>\n <td class=\"py-2 px-4 border-b\">{{ opt.description }}</td>\n </tr>\n </tbody>\n </table>\n <h3 class=\"text-xl font-semibold mb-3\">Interfaces</h3>\n <div class=\"space-y-6\">\n <div\n *ngFor=\"let intf of interfacesDoc\"\n class=\"bg-gray-50 p-6 rounded-lg\">\n <h4 class=\"font-semibold mb-2\">{{ intf.name }}</h4>\n <pre class=\"bg-gray-100 p-4 rounded-lg overflow-auto text-sm mb-3\"><code>{{ intf.type }}</code></pre>\n <p>{{ intf.description }}</p>\n </div>\n </div>\n </section>\n </main>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/index.d.ts
ADDED
package/package.json
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@libs-ui/components-scroll-overlay",
|
|
3
|
+
"version": "0.1.1-1",
|
|
4
|
+
"peerDependencies": {
|
|
5
|
+
"@angular/core": ">=18.0.0",
|
|
6
|
+
"@libs-ui/utils": "0.1.1-1",
|
|
7
|
+
"rxjs": "~7.8.0"
|
|
8
|
+
},
|
|
9
|
+
"sideEffects": false,
|
|
10
|
+
"module": "fesm2022/libs-ui-components-scroll-overlay.mjs",
|
|
11
|
+
"typings": "index.d.ts",
|
|
12
|
+
"exports": {
|
|
13
|
+
"./package.json": {
|
|
14
|
+
"default": "./package.json"
|
|
15
|
+
},
|
|
16
|
+
".": {
|
|
17
|
+
"types": "./index.d.ts",
|
|
18
|
+
"esm2022": "./esm2022/libs-ui-components-scroll-overlay.mjs",
|
|
19
|
+
"esm": "./esm2022/libs-ui-components-scroll-overlay.mjs",
|
|
20
|
+
"default": "./fesm2022/libs-ui-components-scroll-overlay.mjs"
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"dependencies": {
|
|
24
|
+
"tslib": "^2.3.0"
|
|
25
|
+
}
|
|
26
|
+
}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { OnDestroy } from '@angular/core';
|
|
2
|
+
import { IScrollOverlayOptions, TYPE_SCROLL_DIRECTION } from './scroll.interface';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export declare class LibsUiComponentsScrollOverlayDirective implements OnDestroy {
|
|
5
|
+
private readonly styles;
|
|
6
|
+
private isScrollThumb;
|
|
7
|
+
private keepDisplayThumb;
|
|
8
|
+
private subsX;
|
|
9
|
+
private subsY;
|
|
10
|
+
private scrollbarWidth;
|
|
11
|
+
private scrollbarPadding;
|
|
12
|
+
private scrollbarColor;
|
|
13
|
+
private scrollbarHoverColor;
|
|
14
|
+
private scrollThumbColor;
|
|
15
|
+
private scrollThumbHoverColor;
|
|
16
|
+
private readonly divContainer;
|
|
17
|
+
private readonly trackX;
|
|
18
|
+
private readonly thumbX;
|
|
19
|
+
private readonly trackY;
|
|
20
|
+
private readonly thumbY;
|
|
21
|
+
private readonly onDestroy;
|
|
22
|
+
readonly debugMode: import("@angular/core").InputSignal<boolean>;
|
|
23
|
+
readonly ignoreInit: import("@angular/core").InputSignal<boolean>;
|
|
24
|
+
readonly classContainer: import("@angular/core").InputSignalWithTransform<string, string | undefined>;
|
|
25
|
+
readonly options: import("@angular/core").InputSignal<IScrollOverlayOptions | undefined>;
|
|
26
|
+
readonly elementCheckScrollX: import("@angular/core").InputSignal<HTMLElement | undefined>;
|
|
27
|
+
readonly elementCheckScrollY: import("@angular/core").InputSignal<HTMLElement | undefined>;
|
|
28
|
+
readonly elementScroll: import("@angular/core").InputSignal<HTMLElement | undefined>;
|
|
29
|
+
readonly outScroll: import("@angular/core").OutputEmitterRef<Event>;
|
|
30
|
+
readonly outScrollX: import("@angular/core").OutputEmitterRef<Event>;
|
|
31
|
+
readonly outScrollY: import("@angular/core").OutputEmitterRef<Event>;
|
|
32
|
+
readonly outScrollTop: import("@angular/core").OutputEmitterRef<Event>;
|
|
33
|
+
readonly outScrollBottom: import("@angular/core").OutputEmitterRef<Event>;
|
|
34
|
+
private element;
|
|
35
|
+
private render2;
|
|
36
|
+
constructor();
|
|
37
|
+
private get Element();
|
|
38
|
+
private createScrollbar;
|
|
39
|
+
private bindEventsScrollBar;
|
|
40
|
+
protected handlerClickTrack(scrollDirection: TYPE_SCROLL_DIRECTION): void;
|
|
41
|
+
protected handlerDragAndDropThumb(scrollDirection: TYPE_SCROLL_DIRECTION): void;
|
|
42
|
+
private updateScrollPositionByUserAction;
|
|
43
|
+
private updateScrollbarSize;
|
|
44
|
+
private updateScrollbarPosition;
|
|
45
|
+
ngOnDestroy(): void;
|
|
46
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsScrollOverlayDirective, never>;
|
|
47
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<LibsUiComponentsScrollOverlayDirective, "[LibsUiComponentsScrollOverlayDirective]", never, { "debugMode": { "alias": "debugMode"; "required": false; "isSignal": true; }; "ignoreInit": { "alias": "ignoreInit"; "required": false; "isSignal": true; }; "classContainer": { "alias": "classContainer"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "elementCheckScrollX": { "alias": "elementCheckScrollX"; "required": false; "isSignal": true; }; "elementCheckScrollY": { "alias": "elementCheckScrollY"; "required": false; "isSignal": true; }; "elementScroll": { "alias": "elementScroll"; "required": false; "isSignal": true; }; }, { "outScroll": "outScroll"; "outScrollX": "outScrollX"; "outScrollY": "outScrollY"; "outScrollTop": "outScrollTop"; "outScrollBottom": "outScrollBottom"; }, never, never, true, never>;
|
|
48
|
+
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export type TYPE_SCROLL_DIRECTION = 'X' | 'Y';
|
|
2
|
+
export type TYPE_SCROLL_OVERFLOW = 'hidden' | 'scroll';
|
|
3
|
+
export interface IScrollOverlayOptions {
|
|
4
|
+
scrollbarWidth?: number;
|
|
5
|
+
scrollbarColor?: string;
|
|
6
|
+
scrollbarHoverColor?: string;
|
|
7
|
+
scrollThumbColor?: string;
|
|
8
|
+
scrollThumbHoverColor?: string;
|
|
9
|
+
scrollbarPadding?: number;
|
|
10
|
+
scrollX?: TYPE_SCROLL_OVERFLOW;
|
|
11
|
+
scrollXOpacity0?: boolean;
|
|
12
|
+
scrollY?: TYPE_SCROLL_OVERFLOW;
|
|
13
|
+
scrollYOpacity0?: boolean;
|
|
14
|
+
}
|