solid-tom-ui 0.1.0
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 +247 -0
- package/dist/components/avatar/avatar.d.ts +14 -0
- package/dist/components/avatar/avatar.d.ts.map +1 -0
- package/dist/components/avatar/avatar.js +2 -0
- package/dist/components/avatar/avatar.js.map +1 -0
- package/dist/components/avatar/avatar.types.d.ts +18 -0
- package/dist/components/avatar/avatar.types.d.ts.map +1 -0
- package/dist/components/avatar/index.d.ts +2 -0
- package/dist/components/avatar/index.d.ts.map +1 -0
- package/dist/components/badge/badge.d.ts +12 -0
- package/dist/components/badge/badge.d.ts.map +1 -0
- package/dist/components/badge/badge.js +2 -0
- package/dist/components/badge/badge.js.map +1 -0
- package/dist/components/badge/badge.types.d.ts +10 -0
- package/dist/components/badge/badge.types.d.ts.map +1 -0
- package/dist/components/badge/index.d.ts +3 -0
- package/dist/components/badge/index.d.ts.map +1 -0
- package/dist/components/blank/blank.d.ts +5 -0
- package/dist/components/blank/blank.d.ts.map +1 -0
- package/dist/components/blank/blank.js +2 -0
- package/dist/components/blank/blank.js.map +1 -0
- package/dist/components/blank/index.d.ts +2 -0
- package/dist/components/blank/index.d.ts.map +1 -0
- package/dist/components/breadcrumb/breadcrumb.d.ts +11 -0
- package/dist/components/breadcrumb/breadcrumb.d.ts.map +1 -0
- package/dist/components/breadcrumb/breadcrumb.js +2 -0
- package/dist/components/breadcrumb/breadcrumb.js.map +1 -0
- package/dist/components/breadcrumb/index.d.ts +2 -0
- package/dist/components/breadcrumb/index.d.ts.map +1 -0
- package/dist/components/button/button.d.ts +19 -0
- package/dist/components/button/button.d.ts.map +1 -0
- package/dist/components/button/button.js +2 -0
- package/dist/components/button/button.js.map +1 -0
- package/dist/components/button/button.types.d.ts +30 -0
- package/dist/components/button/button.types.d.ts.map +1 -0
- package/dist/components/button/index.d.ts +2 -0
- package/dist/components/button/index.d.ts.map +1 -0
- package/dist/components/carousel/carousel.d.ts +4 -0
- package/dist/components/carousel/carousel.d.ts.map +1 -0
- package/dist/components/carousel/carousel.js +2 -0
- package/dist/components/carousel/carousel.js.map +1 -0
- package/dist/components/carousel/carousel.types.d.ts +36 -0
- package/dist/components/carousel/carousel.types.d.ts.map +1 -0
- package/dist/components/carousel/index.d.ts +3 -0
- package/dist/components/carousel/index.d.ts.map +1 -0
- package/dist/components/chat-bubble/chatBubble.d.ts +11 -0
- package/dist/components/chat-bubble/chatBubble.d.ts.map +1 -0
- package/dist/components/chat-bubble/chatBubble.js +2 -0
- package/dist/components/chat-bubble/chatBubble.js.map +1 -0
- package/dist/components/chat-bubble/chatBubble.type.d.ts +12 -0
- package/dist/components/chat-bubble/chatBubble.type.d.ts.map +1 -0
- package/dist/components/chat-bubble/index.d.ts +2 -0
- package/dist/components/chat-bubble/index.d.ts.map +1 -0
- package/dist/components/checkbox/checkbox.d.ts +22 -0
- package/dist/components/checkbox/checkbox.d.ts.map +1 -0
- package/dist/components/checkbox/checkbox.js +2 -0
- package/dist/components/checkbox/checkbox.js.map +1 -0
- package/dist/components/checkbox/index.d.ts +3 -0
- package/dist/components/checkbox/index.d.ts.map +1 -0
- package/dist/components/collapse/collapse.d.ts +12 -0
- package/dist/components/collapse/collapse.d.ts.map +1 -0
- package/dist/components/collapse/collapse.js +2 -0
- package/dist/components/collapse/collapse.js.map +1 -0
- package/dist/components/collapse/collapse.types.d.ts +17 -0
- package/dist/components/collapse/collapse.types.d.ts.map +1 -0
- package/dist/components/collapse/index.d.ts +2 -0
- package/dist/components/collapse/index.d.ts.map +1 -0
- package/dist/components/context-menu/context-menu.d.ts +4 -0
- package/dist/components/context-menu/context-menu.d.ts.map +1 -0
- package/dist/components/context-menu/context-menu.js +2 -0
- package/dist/components/context-menu/context-menu.js.map +1 -0
- package/dist/components/context-menu/context-menu.store.d.ts +14 -0
- package/dist/components/context-menu/context-menu.store.d.ts.map +1 -0
- package/dist/components/context-menu/context-menu.store.js +2 -0
- package/dist/components/context-menu/context-menu.store.js.map +1 -0
- package/dist/components/context-menu/context-menu.types.d.ts +51 -0
- package/dist/components/context-menu/context-menu.types.d.ts.map +1 -0
- package/dist/components/context-menu/index.d.ts +4 -0
- package/dist/components/context-menu/index.d.ts.map +1 -0
- package/dist/components/diff/diff.d.ts +9 -0
- package/dist/components/diff/diff.d.ts.map +1 -0
- package/dist/components/diff/diff.js +2 -0
- package/dist/components/diff/diff.js.map +1 -0
- package/dist/components/diff/index.d.ts +2 -0
- package/dist/components/diff/index.d.ts.map +1 -0
- package/dist/components/divider/divider.d.ts +5 -0
- package/dist/components/divider/divider.d.ts.map +1 -0
- package/dist/components/divider/divider.js +2 -0
- package/dist/components/divider/divider.js.map +1 -0
- package/dist/components/divider/divider.types.d.ts +16 -0
- package/dist/components/divider/divider.types.d.ts.map +1 -0
- package/dist/components/divider/index.d.ts +3 -0
- package/dist/components/divider/index.d.ts.map +1 -0
- package/dist/components/drawer/drawer.d.ts +6 -0
- package/dist/components/drawer/drawer.d.ts.map +1 -0
- package/dist/components/drawer/drawer.js +2 -0
- package/dist/components/drawer/drawer.js.map +1 -0
- package/dist/components/drawer/drawer.types.d.ts +19 -0
- package/dist/components/drawer/drawer.types.d.ts.map +1 -0
- package/dist/components/drawer/index.d.ts +3 -0
- package/dist/components/drawer/index.d.ts.map +1 -0
- package/dist/components/dropdown/dropdown.d.ts +11 -0
- package/dist/components/dropdown/dropdown.d.ts.map +1 -0
- package/dist/components/dropdown/dropdown.js +2 -0
- package/dist/components/dropdown/dropdown.js.map +1 -0
- package/dist/components/dropdown/dropdown.store.d.ts +8 -0
- package/dist/components/dropdown/dropdown.store.d.ts.map +1 -0
- package/dist/components/dropdown/dropdown.store.js +2 -0
- package/dist/components/dropdown/dropdown.store.js.map +1 -0
- package/dist/components/dropdown/dropdown.types.d.ts +15 -0
- package/dist/components/dropdown/dropdown.types.d.ts.map +1 -0
- package/dist/components/dropdown/index.d.ts +3 -0
- package/dist/components/dropdown/index.d.ts.map +1 -0
- package/dist/components/dynamic-icon/DynamicIcon.d.ts +8 -0
- package/dist/components/dynamic-icon/DynamicIcon.d.ts.map +1 -0
- package/dist/components/dynamic-icon/index.d.ts +2 -0
- package/dist/components/dynamic-icon/index.d.ts.map +1 -0
- package/dist/components/float-button/float-button.d.ts +5 -0
- package/dist/components/float-button/float-button.d.ts.map +1 -0
- package/dist/components/float-button/float-button.js +2 -0
- package/dist/components/float-button/float-button.js.map +1 -0
- package/dist/components/float-button/float-button.types.d.ts +42 -0
- package/dist/components/float-button/float-button.types.d.ts.map +1 -0
- package/dist/components/float-button/index.d.ts +2 -0
- package/dist/components/float-button/index.d.ts.map +1 -0
- package/dist/components/hover-3d-image/hover-3d-example.d.ts +3 -0
- package/dist/components/hover-3d-image/hover-3d-example.d.ts.map +1 -0
- package/dist/components/hover-3d-image/hover-3d-image.d.ts +13 -0
- package/dist/components/hover-3d-image/hover-3d-image.d.ts.map +1 -0
- package/dist/components/hover-3d-image/hover-3d-image.js +2 -0
- package/dist/components/hover-3d-image/hover-3d-image.js.map +1 -0
- package/dist/components/hover-3d-image/index.d.ts +2 -0
- package/dist/components/hover-3d-image/index.d.ts.map +1 -0
- package/dist/components/iframe/index.d.ts +7 -0
- package/dist/components/iframe/index.d.ts.map +1 -0
- package/dist/components/image-preview/image-preview.d.ts +25 -0
- package/dist/components/image-preview/image-preview.d.ts.map +1 -0
- package/dist/components/image-preview/image-preview.js +2 -0
- package/dist/components/image-preview/image-preview.js.map +1 -0
- package/dist/components/image-preview/index.d.ts +3 -0
- package/dist/components/image-preview/index.d.ts.map +1 -0
- package/dist/components/indicator/index.d.ts +3 -0
- package/dist/components/indicator/index.d.ts.map +1 -0
- package/dist/components/indicator/indicator.d.ts +4 -0
- package/dist/components/indicator/indicator.d.ts.map +1 -0
- package/dist/components/indicator/indicator.js +2 -0
- package/dist/components/indicator/indicator.js.map +1 -0
- package/dist/components/indicator/indicator.types.d.ts +18 -0
- package/dist/components/indicator/indicator.types.d.ts.map +1 -0
- package/dist/components/input/index.d.ts +2 -0
- package/dist/components/input/index.d.ts.map +1 -0
- package/dist/components/input/input.d.ts +17 -0
- package/dist/components/input/input.d.ts.map +1 -0
- package/dist/components/input/input.js +2 -0
- package/dist/components/input/input.js.map +1 -0
- package/dist/components/input/input.types.d.ts +76 -0
- package/dist/components/input/input.types.d.ts.map +1 -0
- package/dist/components/input/input.utils.d.ts +16 -0
- package/dist/components/input/input.utils.d.ts.map +1 -0
- package/dist/components/input/input.utils.js +2 -0
- package/dist/components/input/input.utils.js.map +1 -0
- package/dist/components/input/variants/input-color.d.ts +4 -0
- package/dist/components/input/variants/input-color.d.ts.map +1 -0
- package/dist/components/input/variants/input-color.js +2 -0
- package/dist/components/input/variants/input-color.js.map +1 -0
- package/dist/components/input/variants/input-date.d.ts +4 -0
- package/dist/components/input/variants/input-date.d.ts.map +1 -0
- package/dist/components/input/variants/input-date.js +2 -0
- package/dist/components/input/variants/input-date.js.map +1 -0
- package/dist/components/input/variants/input-number.d.ts +4 -0
- package/dist/components/input/variants/input-number.d.ts.map +1 -0
- package/dist/components/input/variants/input-number.js +2 -0
- package/dist/components/input/variants/input-number.js.map +1 -0
- package/dist/components/input/variants/input-otp.d.ts +5 -0
- package/dist/components/input/variants/input-otp.d.ts.map +1 -0
- package/dist/components/input/variants/input-otp.js +2 -0
- package/dist/components/input/variants/input-otp.js.map +1 -0
- package/dist/components/input/variants/input-password.d.ts +4 -0
- package/dist/components/input/variants/input-password.d.ts.map +1 -0
- package/dist/components/input/variants/input-password.js +2 -0
- package/dist/components/input/variants/input-password.js.map +1 -0
- package/dist/components/input/variants/input-radio.d.ts +22 -0
- package/dist/components/input/variants/input-radio.d.ts.map +1 -0
- package/dist/components/input/variants/input-radio.js +2 -0
- package/dist/components/input/variants/input-radio.js.map +1 -0
- package/dist/components/input/variants/input-range.d.ts +4 -0
- package/dist/components/input/variants/input-range.d.ts.map +1 -0
- package/dist/components/input/variants/input-range.js +2 -0
- package/dist/components/input/variants/input-range.js.map +1 -0
- package/dist/components/input/variants/input-text.d.ts +4 -0
- package/dist/components/input/variants/input-text.d.ts.map +1 -0
- package/dist/components/input/variants/input-text.js +2 -0
- package/dist/components/input/variants/input-text.js.map +1 -0
- package/dist/components/input/variants/input-textarea.d.ts +4 -0
- package/dist/components/input/variants/input-textarea.d.ts.map +1 -0
- package/dist/components/input/variants/input-textarea.js +2 -0
- package/dist/components/input/variants/input-textarea.js.map +1 -0
- package/dist/components/loading/index.d.ts +3 -0
- package/dist/components/loading/index.d.ts.map +1 -0
- package/dist/components/loading/loading.d.ts +32 -0
- package/dist/components/loading/loading.d.ts.map +1 -0
- package/dist/components/loading/loading.js +2 -0
- package/dist/components/loading/loading.js.map +1 -0
- package/dist/components/mansory/index.d.ts +3 -0
- package/dist/components/mansory/index.d.ts.map +1 -0
- package/dist/components/mansory/mansory.d.ts +4 -0
- package/dist/components/mansory/mansory.d.ts.map +1 -0
- package/dist/components/mansory/mansory.js +2 -0
- package/dist/components/mansory/mansory.js.map +1 -0
- package/dist/components/mansory/mansory.types.d.ts +27 -0
- package/dist/components/mansory/mansory.types.d.ts.map +1 -0
- package/dist/components/menu/index.d.ts +4 -0
- package/dist/components/menu/index.d.ts.map +1 -0
- package/dist/components/menu/menu.d.ts +11 -0
- package/dist/components/menu/menu.d.ts.map +1 -0
- package/dist/components/menu/menu.data-example.d.ts +7 -0
- package/dist/components/menu/menu.data-example.d.ts.map +1 -0
- package/dist/components/menu/menu.js +2 -0
- package/dist/components/menu/menu.js.map +1 -0
- package/dist/components/menu/menu.types.d.ts +74 -0
- package/dist/components/menu/menu.types.d.ts.map +1 -0
- package/dist/components/modal/index.d.ts +3 -0
- package/dist/components/modal/index.d.ts.map +1 -0
- package/dist/components/modal/modal.d.ts +28 -0
- package/dist/components/modal/modal.d.ts.map +1 -0
- package/dist/components/modal/modal.js +2 -0
- package/dist/components/modal/modal.js.map +1 -0
- package/dist/components/modal/modalContext.d.ts +8 -0
- package/dist/components/modal/modalContext.d.ts.map +1 -0
- package/dist/components/modal/modalContext.js +2 -0
- package/dist/components/modal/modalContext.js.map +1 -0
- package/dist/components/pagination/index.d.ts +3 -0
- package/dist/components/pagination/index.d.ts.map +1 -0
- package/dist/components/pagination/pagination.d.ts +4 -0
- package/dist/components/pagination/pagination.d.ts.map +1 -0
- package/dist/components/pagination/pagination.js +2 -0
- package/dist/components/pagination/pagination.js.map +1 -0
- package/dist/components/pagination/pagination.types.d.ts +88 -0
- package/dist/components/pagination/pagination.types.d.ts.map +1 -0
- package/dist/components/progress-bar/index.d.ts +4 -0
- package/dist/components/progress-bar/index.d.ts.map +1 -0
- package/dist/components/progress-bar/progress-bar.d.ts +8 -0
- package/dist/components/progress-bar/progress-bar.d.ts.map +1 -0
- package/dist/components/progress-bar/progress-bar.js +2 -0
- package/dist/components/progress-bar/progress-bar.js.map +1 -0
- package/dist/components/progress-bar/progress-bar.types.d.ts +20 -0
- package/dist/components/progress-bar/progress-bar.types.d.ts.map +1 -0
- package/dist/components/qr-code/index.d.ts +3 -0
- package/dist/components/qr-code/index.d.ts.map +1 -0
- package/dist/components/qr-code/qr-code.d.ts +4 -0
- package/dist/components/qr-code/qr-code.d.ts.map +1 -0
- package/dist/components/qr-code/qr-code.js +2 -0
- package/dist/components/qr-code/qr-code.js.map +1 -0
- package/dist/components/qr-code/qr-code.types.d.ts +42 -0
- package/dist/components/qr-code/qr-code.types.d.ts.map +1 -0
- package/dist/components/rating/index.d.ts +2 -0
- package/dist/components/rating/index.d.ts.map +1 -0
- package/dist/components/rating/rating.d.ts +4 -0
- package/dist/components/rating/rating.d.ts.map +1 -0
- package/dist/components/rating/rating.js +2 -0
- package/dist/components/rating/rating.js.map +1 -0
- package/dist/components/rating/rating.types.d.ts +33 -0
- package/dist/components/rating/rating.types.d.ts.map +1 -0
- package/dist/components/select/index.d.ts +3 -0
- package/dist/components/select/index.d.ts.map +1 -0
- package/dist/components/select/select.d.ts +12 -0
- package/dist/components/select/select.d.ts.map +1 -0
- package/dist/components/select/select.js +2 -0
- package/dist/components/select/select.js.map +1 -0
- package/dist/components/select/select.types.d.ts +134 -0
- package/dist/components/select/select.types.d.ts.map +1 -0
- package/dist/components/select-zone/index.d.ts +3 -0
- package/dist/components/select-zone/index.d.ts.map +1 -0
- package/dist/components/select-zone/select-zone.d.ts +5 -0
- package/dist/components/select-zone/select-zone.d.ts.map +1 -0
- package/dist/components/select-zone/select-zone.js +2 -0
- package/dist/components/select-zone/select-zone.js.map +1 -0
- package/dist/components/select-zone/select-zone.types.d.ts +58 -0
- package/dist/components/select-zone/select-zone.types.d.ts.map +1 -0
- package/dist/components/skeleton/index.d.ts +3 -0
- package/dist/components/skeleton/index.d.ts.map +1 -0
- package/dist/components/skeleton/skeleton.d.ts +25 -0
- package/dist/components/skeleton/skeleton.d.ts.map +1 -0
- package/dist/components/skeleton/skeleton.js +2 -0
- package/dist/components/skeleton/skeleton.js.map +1 -0
- package/dist/components/slider/index.d.ts +2 -0
- package/dist/components/slider/index.d.ts.map +1 -0
- package/dist/components/slider/slider.d.ts +4 -0
- package/dist/components/slider/slider.d.ts.map +1 -0
- package/dist/components/slider/slider.js +2 -0
- package/dist/components/slider/slider.js.map +1 -0
- package/dist/components/slider/slider.types.d.ts +32 -0
- package/dist/components/slider/slider.types.d.ts.map +1 -0
- package/dist/components/splitter/index.d.ts +3 -0
- package/dist/components/splitter/index.d.ts.map +1 -0
- package/dist/components/splitter/splitter.d.ts +7 -0
- package/dist/components/splitter/splitter.d.ts.map +1 -0
- package/dist/components/splitter/splitter.js +2 -0
- package/dist/components/splitter/splitter.js.map +1 -0
- package/dist/components/splitter/splitter.types.d.ts +64 -0
- package/dist/components/splitter/splitter.types.d.ts.map +1 -0
- package/dist/components/steps/index.d.ts +3 -0
- package/dist/components/steps/index.d.ts.map +1 -0
- package/dist/components/steps/steps.d.ts +29 -0
- package/dist/components/steps/steps.d.ts.map +1 -0
- package/dist/components/steps/steps.js +2 -0
- package/dist/components/steps/steps.js.map +1 -0
- package/dist/components/swap/index.d.ts +2 -0
- package/dist/components/swap/index.d.ts.map +1 -0
- package/dist/components/swap/swap.d.ts +11 -0
- package/dist/components/swap/swap.d.ts.map +1 -0
- package/dist/components/swap/swap.js +2 -0
- package/dist/components/swap/swap.js.map +1 -0
- package/dist/components/switch/index.d.ts +3 -0
- package/dist/components/switch/index.d.ts.map +1 -0
- package/dist/components/switch/switch.d.ts +11 -0
- package/dist/components/switch/switch.d.ts.map +1 -0
- package/dist/components/switch/switch.js +2 -0
- package/dist/components/switch/switch.js.map +1 -0
- package/dist/components/switch/switch.types.d.ts +23 -0
- package/dist/components/switch/switch.types.d.ts.map +1 -0
- package/dist/components/tab/index.d.ts +3 -0
- package/dist/components/tab/index.d.ts.map +1 -0
- package/dist/components/tab/tab.d.ts +4 -0
- package/dist/components/tab/tab.d.ts.map +1 -0
- package/dist/components/tab/tab.js +2 -0
- package/dist/components/tab/tab.js.map +1 -0
- package/dist/components/tab/tab.types.d.ts +51 -0
- package/dist/components/tab/tab.types.d.ts.map +1 -0
- package/dist/components/table/index.d.ts +4 -0
- package/dist/components/table/index.d.ts.map +1 -0
- package/dist/components/table/index.js +1 -0
- package/dist/components/table/table.d.ts +10 -0
- package/dist/components/table/table.d.ts.map +1 -0
- package/dist/components/table/table.js +2 -0
- package/dist/components/table/table.js.map +1 -0
- package/dist/components/table/table.types.d.ts +155 -0
- package/dist/components/table/table.types.d.ts.map +1 -0
- package/dist/components/text-rotate/index.d.ts +3 -0
- package/dist/components/text-rotate/index.d.ts.map +1 -0
- package/dist/components/text-rotate/text-rotate.d.ts +12 -0
- package/dist/components/text-rotate/text-rotate.d.ts.map +1 -0
- package/dist/components/text-rotate/text-rotate.js +2 -0
- package/dist/components/text-rotate/text-rotate.js.map +1 -0
- package/dist/components/timeline/index.d.ts +3 -0
- package/dist/components/timeline/index.d.ts.map +1 -0
- package/dist/components/timeline/timeline.d.ts +4 -0
- package/dist/components/timeline/timeline.d.ts.map +1 -0
- package/dist/components/timeline/timeline.js +2 -0
- package/dist/components/timeline/timeline.js.map +1 -0
- package/dist/components/timeline/timeline.types.d.ts +55 -0
- package/dist/components/timeline/timeline.types.d.ts.map +1 -0
- package/dist/components/toast/icons/ErrorIcon.d.ts +4 -0
- package/dist/components/toast/icons/ErrorIcon.d.ts.map +1 -0
- package/dist/components/toast/icons/ErrorIcon.js +2 -0
- package/dist/components/toast/icons/ErrorIcon.js.map +1 -0
- package/dist/components/toast/icons/IconCircle.d.ts +9 -0
- package/dist/components/toast/icons/IconCircle.d.ts.map +1 -0
- package/dist/components/toast/icons/IconCircle.js +2 -0
- package/dist/components/toast/icons/IconCircle.js.map +1 -0
- package/dist/components/toast/icons/InfoIcon.d.ts +4 -0
- package/dist/components/toast/icons/InfoIcon.d.ts.map +1 -0
- package/dist/components/toast/icons/InfoIcon.js +2 -0
- package/dist/components/toast/icons/InfoIcon.js.map +1 -0
- package/dist/components/toast/icons/LoaderIcon.d.ts +4 -0
- package/dist/components/toast/icons/LoaderIcon.d.ts.map +1 -0
- package/dist/components/toast/icons/LoaderIcon.js +2 -0
- package/dist/components/toast/icons/LoaderIcon.js.map +1 -0
- package/dist/components/toast/icons/SuccessIcon.d.ts +4 -0
- package/dist/components/toast/icons/SuccessIcon.d.ts.map +1 -0
- package/dist/components/toast/icons/SuccessIcon.js +2 -0
- package/dist/components/toast/icons/SuccessIcon.js.map +1 -0
- package/dist/components/toast/icons/WarningIcon.d.ts +4 -0
- package/dist/components/toast/icons/WarningIcon.d.ts.map +1 -0
- package/dist/components/toast/icons/WarningIcon.js +2 -0
- package/dist/components/toast/icons/WarningIcon.js.map +1 -0
- package/dist/components/toast/icons/index.d.ts +4 -0
- package/dist/components/toast/icons/index.d.ts.map +1 -0
- package/dist/components/toast/index.d.ts +3 -0
- package/dist/components/toast/index.d.ts.map +1 -0
- package/dist/components/toast/toast.d.ts +7 -0
- package/dist/components/toast/toast.d.ts.map +1 -0
- package/dist/components/toast/toast.js +2 -0
- package/dist/components/toast/toast.js.map +1 -0
- package/dist/components/toast/toast.store.d.ts +17 -0
- package/dist/components/toast/toast.store.d.ts.map +1 -0
- package/dist/components/toast/toast.store.js +2 -0
- package/dist/components/toast/toast.store.js.map +1 -0
- package/dist/components/toast/toast.type.d.ts +72 -0
- package/dist/components/toast/toast.type.d.ts.map +1 -0
- package/dist/components/tooltip/index.d.ts +4 -0
- package/dist/components/tooltip/index.d.ts.map +1 -0
- package/dist/components/tooltip/tooltip.d.ts +11 -0
- package/dist/components/tooltip/tooltip.d.ts.map +1 -0
- package/dist/components/tooltip/tooltip.js +2 -0
- package/dist/components/tooltip/tooltip.js.map +1 -0
- package/dist/components/tooltip/tooltip.types.d.ts +39 -0
- package/dist/components/tooltip/tooltip.types.d.ts.map +1 -0
- package/dist/components/tour/index.d.ts +3 -0
- package/dist/components/tour/index.d.ts.map +1 -0
- package/dist/components/tour/tour.d.ts +3 -0
- package/dist/components/tour/tour.d.ts.map +1 -0
- package/dist/components/tour/tour.js +9 -0
- package/dist/components/tour/tour.js.map +1 -0
- package/dist/components/tour/tour.types.d.ts +35 -0
- package/dist/components/tour/tour.types.d.ts.map +1 -0
- package/dist/components/upload/index.d.ts +3 -0
- package/dist/components/upload/index.d.ts.map +1 -0
- package/dist/components/upload/upload.d.ts +3 -0
- package/dist/components/upload/upload.d.ts.map +1 -0
- package/dist/components/upload/upload.js +2 -0
- package/dist/components/upload/upload.js.map +1 -0
- package/dist/components/upload/upload.types.d.ts +95 -0
- package/dist/components/upload/upload.types.d.ts.map +1 -0
- package/dist/components/z-index/index.d.ts +4 -0
- package/dist/components/z-index/index.d.ts.map +1 -0
- package/dist/components/z-index/z-index.context.d.ts +17 -0
- package/dist/components/z-index/z-index.context.d.ts.map +1 -0
- package/dist/components/z-index/z-index.context.js +2 -0
- package/dist/components/z-index/z-index.context.js.map +1 -0
- package/dist/components/z-index/z-index.d.ts +20 -0
- package/dist/components/z-index/z-index.d.ts.map +1 -0
- package/dist/components/z-index/z-index.js +2 -0
- package/dist/components/z-index/z-index.js.map +1 -0
- package/dist/components/z-index/z-index.store.d.ts +14 -0
- package/dist/components/z-index/z-index.store.d.ts.map +1 -0
- package/dist/components/z-index/z-index.store.js +2 -0
- package/dist/components/z-index/z-index.store.js.map +1 -0
- package/dist/components/z-index/z-index.types.d.ts +51 -0
- package/dist/components/z-index/z-index.types.d.ts.map +1 -0
- package/dist/components/z-index/z-index.types.js +2 -0
- package/dist/components/z-index/z-index.types.js.map +1 -0
- package/dist/lib.d.ts +48 -0
- package/dist/lib.d.ts.map +1 -0
- package/dist/lib.js +1 -0
- package/dist/solid-ui.css +94 -0
- package/dist/type.d.ts +4 -0
- package/dist/type.d.ts.map +1 -0
- package/dist/utils/cn.d.ts +3 -0
- package/dist/utils/cn.d.ts.map +1 -0
- package/dist/utils/cn.js +2 -0
- package/dist/utils/cn.js.map +1 -0
- package/dist/utils/element-tracker.js +2 -0
- package/dist/utils/element-tracker.js.map +1 -0
- package/dist/utils/helper.d.ts +32 -0
- package/dist/utils/helper.d.ts.map +1 -0
- package/dist/utils/helper.js +2 -0
- package/dist/utils/helper.js.map +1 -0
- package/dist/utils/hoc.js +2 -0
- package/dist/utils/hoc.js.map +1 -0
- package/package.json +131 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"drawer.js","names":["Component","createEffect","createSignal","mergeProps","on","onCleanup","Show","X","cn","ZIndex","ZIndexType","conditionalRender","DrawerType","drawerIds","setDrawerIds","drawerCloseCallbacks","Map","globalKeyDownHandler","e","KeyboardEvent","key","topId","at","get","registerDrawer","id","cb","size","document","addEventListener","set","unregisterDrawer","delete","removeEventListener","PANEL_PLACEMENT_CLASS","Record","left","right","top","bottom","ComponentDrawer","p","placement","closeOnOutsideClick","closable","mask","maskBlur","preRender","open","onClose","drawerId","Math","random","toString","slice","ids","filter","unregisterDrawerOnUnmount","isHorizontal","panelStyle","s","width","height","handleOverlayClick","_$createComponent","type","MODAL","blockScroll","position","inset","class","wrapper","children","when","_el$","_tmpl$","$$click","_$effect","_$className","_$memo","_el$2","_tmpl$2","_el$3","_tmpl$4","_el$6","firstChild","stopPropagation","_$insert","_el$4","_tmpl$3","_$addEventListener","closeButton","header","_el$5","Element","body","footer","_el$7","_p$","_v$","panel","_v$2","_v$3","t","_$style","a","undefined","Drawer","_$delegateEvents"],"sources":["../../../src/components/drawer/drawer.tsx"],"sourcesContent":["import { Component, createEffect, createSignal, mergeProps, on, onCleanup, Show } from 'solid-js';\nimport X from 'lucide-solid/icons/x';\n\nimport { cn } from '@/utils/cn';\nimport { ZIndex, ZIndexType } from '../z-index';\nimport { conditionalRender } from '@/utils/hoc';\nimport { DrawerType } from './drawer.types';\n\n// Global ESC key handler — shared across all drawer instances (mirrors modal pattern)\nconst [drawerIds, setDrawerIds] = createSignal<string[]>([]);\nconst drawerCloseCallbacks = new Map<string, () => void>();\n\nfunction globalKeyDownHandler(e: KeyboardEvent) {\n if (e.key !== 'Escape') return;\n const topId = drawerIds().at(-1);\n if (topId) drawerCloseCallbacks.get(topId)?.();\n}\n\nfunction registerDrawer(id: string, cb: () => void) {\n if (drawerCloseCallbacks.size === 0) {\n document.addEventListener('keydown', globalKeyDownHandler);\n }\n drawerCloseCallbacks.set(id, cb);\n}\n\nfunction unregisterDrawer(id: string) {\n drawerCloseCallbacks.delete(id);\n if (drawerCloseCallbacks.size === 0) {\n document.removeEventListener('keydown', globalKeyDownHandler);\n }\n}\n\nconst PANEL_PLACEMENT_CLASS: Record<string, string> = {\n left: 'dr02-left',\n right: 'dr02-right',\n top: 'dr02-top',\n bottom: 'dr02-bottom',\n};\n\nconst ComponentDrawer: Component<DrawerType> = p => {\n p = mergeProps(\n {\n placement: 'left',\n closeOnOutsideClick: true,\n closable: true,\n mask: true,\n maskBlur: false,\n preRender: false,\n open: false,\n onClose: () => {},\n } as DrawerType,\n p,\n );\n\n const drawerId = Math.random().toString(36).slice(2);\n\n createEffect(\n on(\n () => p.open,\n open => {\n if (open) {\n if (drawerId !== drawerIds().at(-1)) {\n setDrawerIds(ids => [...ids, drawerId]);\n }\n registerDrawer(drawerId, () => p.onClose());\n } else {\n unregisterDrawer(drawerId);\n setDrawerIds(ids => ids.filter(id => id !== drawerId));\n }\n },\n ),\n );\n\n onCleanup(function unregisterDrawerOnUnmount() {\n unregisterDrawer(drawerId);\n setDrawerIds(ids => ids.filter(id => id !== drawerId));\n });\n\n const isHorizontal = () => p.placement === 'left' || p.placement === 'right';\n\n const panelStyle = () => {\n const s: Record<string, string> = {};\n if (isHorizontal() && p.width) {\n s['width'] = p.width;\n } else if (!isHorizontal() && p.height) {\n s['height'] = p.height;\n }\n return s;\n };\n\n const handleOverlayClick = () => {\n if (p.closeOnOutsideClick) p.onClose();\n };\n\n return (\n <ZIndex\n type={ZIndexType.MODAL}\n open={p.open ?? false}\n blockScroll\n preRender={p.preRender}\n position={{ inset: '0' }}\n class={cn('pointer-events-none', p.class?.wrapper)}\n >\n {/* Backdrop overlay */}\n <Show when={p.mask}>\n <div\n class={cn(p.maskBlur ? 'dr01-blur' : 'dr01', 'pointer-events-auto')}\n onClick={handleOverlayClick}\n />\n </Show>\n\n {/* Invisible hit-area khi tắt mask nhưng vẫn closeOnOutsideClick */}\n <Show when={!p.mask && p.closeOnOutsideClick}>\n <div class=\"pointer-events-auto fixed inset-0\" onClick={handleOverlayClick} />\n </Show>\n\n {/* Panel */}\n <div\n class={cn(\n 'dr02',\n PANEL_PLACEMENT_CLASS[p.placement!],\n 'pointer-events-auto',\n p.class?.panel,\n )}\n style={panelStyle()}\n onClick={e => e.stopPropagation()}\n >\n {/* Close button */}\n <Show when={p.closable}>\n <button class={cn('dr03', p.class?.closeButton)} onClick={p.onClose} aria-label=\"Close\">\n <X size={16} />\n </button>\n </Show>\n\n {/* Header */}\n <Show when={p.header}>\n <div class={cn('dr04', p.class?.header)}>{p.header as Element}</div>\n </Show>\n\n {/* Body */}\n <div class={cn('dr05', p.class?.body)}>\n <Show when={p.body}>{p.body as Element}</Show>\n </div>\n\n {/* Footer */}\n <Show when={p.footer}>\n <div class={cn('dr06', p.class?.footer)}>{p.footer as Element}</div>\n </Show>\n </div>\n </ZIndex>\n );\n};\n\nexport const Drawer = conditionalRender(ComponentDrawer, { preRender: 'preRender', when: 'open' });\nexport { ComponentDrawer };\n"],"mappings":"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"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { SolidComponent } from '../../type';
|
|
2
|
+
export type DrawerPlacement = 'left' | 'right' | 'top' | 'bottom';
|
|
3
|
+
export type DrawerType = {
|
|
4
|
+
open: boolean;
|
|
5
|
+
onClose: () => void;
|
|
6
|
+
placement?: DrawerPlacement;
|
|
7
|
+
width?: string;
|
|
8
|
+
height?: string;
|
|
9
|
+
closeOnOutsideClick?: boolean;
|
|
10
|
+
closable?: boolean;
|
|
11
|
+
mask?: boolean;
|
|
12
|
+
maskBlur?: boolean;
|
|
13
|
+
header?: SolidComponent;
|
|
14
|
+
body?: SolidComponent;
|
|
15
|
+
footer?: SolidComponent;
|
|
16
|
+
preRender?: boolean;
|
|
17
|
+
class?: Partial<Record<'wrapper' | 'panel' | 'header' | 'body' | 'footer' | 'closeButton', string>>;
|
|
18
|
+
};
|
|
19
|
+
//# sourceMappingURL=drawer.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"drawer.types.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/drawer.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAExC,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;AAElE,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;CACrG,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AACnD,YAAY,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { VariantProps } from 'class-variance-authority';
|
|
2
|
+
import { ParentComponent } from 'solid-js';
|
|
3
|
+
import { DropdownProps } from './dropdown.types';
|
|
4
|
+
declare const variants: (props?: ({
|
|
5
|
+
position?: "top" | "bottom" | "left" | "right" | null | undefined;
|
|
6
|
+
align?: "start" | "end" | "center" | null | undefined;
|
|
7
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
8
|
+
export type DropdownVariantsProps = VariantProps<typeof variants>;
|
|
9
|
+
export declare const Dropdown: ParentComponent<DropdownProps>;
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=dropdown.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAO,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAOL,eAAe,EAEhB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,QAAA,MAAM,QAAQ;;;8EAcZ,CAAC;AACH,MAAM,MAAM,qBAAqB,GAAG,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC;AASlE,eAAO,MAAM,QAAQ,EAAE,eAAe,CAAC,aAAa,CAoHnD,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../../utils/cn.js";import{ZIndexType as t}from"../z-index/z-index.types.js";import{ZIndex as n}from"../z-index/z-index.js";import{trackElement as r,untrackElement as i}from"../../utils/element-tracker.js";import{dropdownStore as a}from"./dropdown.store.js";import{addEventListener as o,className as s,createComponent as c,delegateEvents as l,effect as u,insert as d,memo as f,setAttribute as p,style as m,template as h,use as g}from"solid-js/web";import{cva as _}from"class-variance-authority";import{createContext as v,createEffect as y,createSignal as b,createUniqueId as x,mergeProps as S,onCleanup as C,useContext as w}from"solid-js";var T=h(`<div>`),E=h(`<div><div>`),D=h(`<div class=dp02>`),O=v(!1);_(``,{variants:{position:{top:`dropdown-top`,bottom:`dropdown-bottom`,left:`dropdown-left`,right:`dropdown-right`},align:{start:`dropdown-start`,center:`dropdown-center`,end:`dropdown-end`}}});var k=l=>{let h=S({position:`bottom`,align:`start`,blockScroll:!0,closeAll:!1},l),_=w(O),v=()=>h.closeAll||_,k=x(),A=()=>h.open!==void 0,j,[M,N]=b(null),P=()=>{let e=j.getBoundingClientRect();N({top:e.top,left:e.left,width:e.width,height:e.height})},F=()=>A()?!!h.open:a.isOpen(k);y(function(){if(!F()){i(j);return}r(j,e=>N(e)),C(function(){i(j)})}),y(function(){A()&&(h.open?(P(),a.open(k)):a.close(k))}),C(function(){a.close(k),i(j)});let I=()=>{a.isOpen(k)?a.close(k):(P(),a.open(k))},L=()=>v()?a.closeAll():a.close(k),R=()=>{let e=M();return e?{"--nd-t":`${e.top}px`,"--nd-l":`${e.left}px`,"--nd-w":`${e.width}px`,"--nd-h":`${e.height}px`}:{}};return[(()=>{var t=T();return o(t,`click`,A()?void 0:I,!0),g(e=>{j=e;let t=h.ref;typeof t==`function`&&t(e)},t),d(t,()=>h.triggerElement),u(()=>s(t,e(`dp01`,h.class?.trigger))),t})(),c(n,{get open(){return F()},get type(){return t.DROPDOWN},get blockScroll(){return h.blockScroll},get class(){return e(`inset-0`,_&&`pointer-events-none`)},get customValue(){return h.zIndex},get children(){return[f(()=>!_&&(()=>{var e=D();return e.$$click=L,e})()),(()=>{var t=E(),n=t.firstChild;return d(n,c(O.Provider,{get value(){return v()},get children(){return h.children}})),u(r=>{var i=e(`dp03`,h.class?.anchor),a=h.position,o=h.align,c=R(),l=e(`dp04`,h.class?.content);return i!==r.e&&s(t,r.e=i),a!==r.t&&p(t,`data-pos`,r.t=a),o!==r.a&&p(t,`data-align`,r.a=o),r.o=m(t,c,r.o),l!==r.i&&s(n,r.i=l),r},{e:void 0,t:void 0,a:void 0,o:void 0,i:void 0}),t})()]}})]};l([`click`]);export{k as Dropdown};
|
|
2
|
+
//# sourceMappingURL=dropdown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.js","names":["cn","trackElement","untrackElement","ZIndex","ZIndexType","cva","VariantProps","createContext","createEffect","createSignal","createUniqueId","mergeProps","onCleanup","ParentComponent","useContext","dropdownStore","DropdownProps","CloseAllContext","variants","position","top","bottom","left","right","align","start","center","end","DropdownVariantsProps","TriggerRect","width","height","Dropdown","props","p","const","blockScroll","closeAll","parentCloseAll","shouldCloseAll","id","isControlled","open","undefined","triggerRef","HTMLDivElement","rect","setRect","captureRect","r","getBoundingClientRect","isOpen","trackTrigger","untrackTrigger","handleControlledOpen","close","closeDropdownOnUnmount","toggle","anchorStyle","Record","_el$","_tmpl$","_$addEventListener","_$use","el","ref","_$insert","triggerElement","Element","_$effect","_$className","class","trigger","_$createComponent","type","DROPDOWN","customValue","zIndex","children","_$memo","_el$4","_tmpl$3","$$click","_el$2","_tmpl$2","_el$3","firstChild","Provider","value","_p$","_v$","anchor","_v$2","_v$3","_v$4","_v$5","content","e","t","_$setAttribute","a","o","_$style","i","_$delegateEvents"],"sources":["../../../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { trackElement, untrackElement } from '@/utils/element-tracker';\r\nimport { ZIndex, ZIndexType } from '@components/z-index';\r\nimport { cva, VariantProps } from 'class-variance-authority';\r\nimport {\r\n createContext,\r\n createEffect,\r\n createSignal,\r\n createUniqueId,\r\n mergeProps,\r\n onCleanup,\r\n ParentComponent,\r\n useContext,\r\n} from 'solid-js';\r\nimport { dropdownStore } from './dropdown.store';\r\nimport { DropdownProps } from './dropdown.types';\r\n\r\n/** Context truyền `closeAll` từ dropdown root xuống tất cả dropdown con */\r\nconst CloseAllContext = createContext(false);\r\n\r\nconst variants = cva('', {\r\n variants: {\r\n position: {\r\n top: 'dropdown-top',\r\n bottom: 'dropdown-bottom',\r\n left: 'dropdown-left',\r\n right: 'dropdown-right',\r\n },\r\n align: {\r\n start: 'dropdown-start',\r\n center: 'dropdown-center',\r\n end: 'dropdown-end',\r\n },\r\n },\r\n});\r\nexport type DropdownVariantsProps = VariantProps<typeof variants>;\r\n\r\ntype TriggerRect = {\r\n top: number;\r\n left: number;\r\n width: number;\r\n height: number;\r\n};\r\n\r\nexport const Dropdown: ParentComponent<DropdownProps> = props => {\r\n const p = mergeProps(\r\n {\r\n position: 'bottom' as const,\r\n align: 'start' as const,\r\n blockScroll: true,\r\n closeAll: false,\r\n },\r\n props,\r\n );\r\n\r\n // Kế thừa closeAll từ dropdown cha nếu có\r\n const parentCloseAll = useContext(CloseAllContext);\r\n const shouldCloseAll = () => p.closeAll || parentCloseAll;\r\n\r\n const id = createUniqueId();\r\n const isControlled = () => p.open !== undefined;\r\n\r\n let triggerRef!: HTMLDivElement;\r\n const [rect, setRect] = createSignal<TriggerRect | null>(null);\r\n\r\n const captureRect = () => {\r\n const r = triggerRef.getBoundingClientRect();\r\n setRect({ top: r.top, left: r.left, width: r.width, height: r.height });\r\n };\r\n\r\n const isOpen = () => {\r\n if (isControlled()) return !!p.open;\r\n return dropdownStore.isOpen(id);\r\n };\r\n\r\n createEffect(function trackTrigger() {\r\n if (!isOpen()) {\r\n untrackElement(triggerRef);\r\n return;\r\n }\r\n trackElement(triggerRef, r => setRect(r));\r\n onCleanup(function untrackTrigger() {\r\n untrackElement(triggerRef);\r\n });\r\n });\r\n\r\n createEffect(function handleControlledOpen() {\r\n if (!isControlled()) return;\r\n if (p.open) {\r\n captureRect();\r\n dropdownStore.open(id);\r\n } else {\r\n dropdownStore.close(id);\r\n }\r\n });\r\n\r\n onCleanup(function closeDropdownOnUnmount() {\r\n dropdownStore.close(id);\r\n untrackElement(triggerRef);\r\n });\r\n\r\n const toggle = () => {\r\n if (dropdownStore.isOpen(id)) {\r\n dropdownStore.close(id);\r\n } else {\r\n captureRect();\r\n dropdownStore.open(id);\r\n }\r\n };\r\n\r\n const close = () => (shouldCloseAll() ? dropdownStore.closeAll() : dropdownStore.close(id));\r\n\r\n const anchorStyle = () => {\r\n const r = rect();\r\n if (!r) return {};\r\n return {\r\n '--nd-t': `${r.top}px`,\r\n '--nd-l': `${r.left}px`,\r\n '--nd-w': `${r.width}px`,\r\n '--nd-h': `${r.height}px`,\r\n } as Record<string, string>;\r\n };\r\n return (\r\n <>\r\n <div\r\n ref={el => {\r\n triggerRef = el;\r\n const ref = p.ref;\r\n if (typeof ref === 'function') ref(el);\r\n }}\r\n class={cn('dp01', p.class?.trigger)}\r\n onClick={isControlled() ? undefined : toggle}\r\n >\r\n {p.triggerElement as Element}\r\n </div>\r\n\r\n <ZIndex\r\n open={isOpen()}\r\n type={ZIndexType.DROPDOWN}\r\n blockScroll={p.blockScroll}\r\n class={cn('inset-0', parentCloseAll && 'pointer-events-none')}\r\n customValue={p.zIndex}\r\n >\r\n {!parentCloseAll && <div class=\"dp02\" onClick={close} />}\r\n\r\n <div\r\n class={cn('dp03', p.class?.anchor)}\r\n data-pos={p.position}\r\n data-align={p.align}\r\n style={anchorStyle()}\r\n >\r\n <div class={cn('dp04', p.class?.content)}>\r\n <CloseAllContext.Provider value={shouldCloseAll()}>\r\n {p.children}\r\n </CloseAllContext.Provider>\r\n </div>\r\n </div>\r\n </ZIndex>\r\n </>\r\n );\r\n};\r\n"],"mappings":"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"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare const dropdownStore: {
|
|
2
|
+
openIds: import('solid-js').Accessor<ReadonlySet<string>>;
|
|
3
|
+
open: (id: string) => ReadonlySet<string>;
|
|
4
|
+
close: (id: string) => ReadonlySet<string>;
|
|
5
|
+
closeAll: () => Set<string>;
|
|
6
|
+
isOpen: (id: string) => boolean;
|
|
7
|
+
};
|
|
8
|
+
//# sourceMappingURL=dropdown.store.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.store.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.store.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,aAAa;;eAEb,MAAM;gBAOL,MAAM;;iBAQL,MAAM;CACpB,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{createSignal as e}from"solid-js";var[t,n]=e(new Set,{equals:!1}),r={openIds:t,open:e=>n(t=>{if(t.has(e))return t;let n=new Set(t);return n.add(e),n}),close:e=>n(t=>{if(!t.has(e))return t;let n=new Set(t);return n.delete(e),n}),closeAll:()=>n(new Set),isOpen:e=>t().has(e)};export{r as dropdownStore};
|
|
2
|
+
//# sourceMappingURL=dropdown.store.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.store.js","names":[],"sources":["../../../src/components/dropdown/dropdown.store.ts"],"sourcesContent":["import { createSignal } from 'solid-js';\r\n\r\nconst [openIds, setOpenIds] = createSignal<ReadonlySet<string>>(new Set(), { equals: false });\r\n\r\nexport const dropdownStore = {\r\n openIds,\r\n open: (id: string) =>\r\n setOpenIds(prev => {\r\n if (prev.has(id)) return prev;\r\n const next = new Set(prev);\r\n next.add(id);\r\n return next;\r\n }),\r\n close: (id: string) =>\r\n setOpenIds(prev => {\r\n if (!prev.has(id)) return prev;\r\n const next = new Set(prev);\r\n next.delete(id);\r\n return next;\r\n }),\r\n closeAll: () => setOpenIds(new Set<string>()),\r\n isOpen: (id: string) => openIds().has(id),\r\n};"],"mappings":"wCAEA,GAAM,CAAC,EAAS,GAAc,EAAkC,IAAI,IAAO,CAAE,OAAQ,GAAO,CAAC,CAEhF,EAAgB,CAC3B,UACA,KAAO,GACL,EAAW,GAAQ,CACjB,GAAI,EAAK,IAAI,EAAG,CAAE,OAAO,EACzB,IAAM,EAAO,IAAI,IAAI,EAAK,CAE1B,OADA,EAAK,IAAI,EAAG,CACL,GACP,CACJ,MAAQ,GACN,EAAW,GAAQ,CACjB,GAAI,CAAC,EAAK,IAAI,EAAG,CAAE,OAAO,EAC1B,IAAM,EAAO,IAAI,IAAI,EAAK,CAE1B,OADA,EAAK,OAAO,EAAG,CACR,GACP,CACJ,aAAgB,EAAW,IAAI,IAAc,CAC7C,OAAS,GAAe,GAAS,CAAC,IAAI,EAAG,CAC1C"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { SolidComponent } from '../../type';
|
|
2
|
+
import { DropdownVariantsProps } from './dropdown';
|
|
3
|
+
export type DropdownProps = {
|
|
4
|
+
ref?: HTMLDivElement | ((el: HTMLDivElement) => void);
|
|
5
|
+
triggerElement: SolidComponent;
|
|
6
|
+
open?: boolean;
|
|
7
|
+
class?: Partial<Record<'anchor' | 'trigger' | 'content', string>>;
|
|
8
|
+
position?: DropdownVariantsProps['position'];
|
|
9
|
+
align?: DropdownVariantsProps['align'];
|
|
10
|
+
zIndex?: number;
|
|
11
|
+
blockScroll?: boolean;
|
|
12
|
+
/** Khi true, click backdrop sẽ đóng toàn bộ dropdown đang mở (hữu ích cho dropdown cấp 1 trong nested menu) */
|
|
13
|
+
closeAll?: boolean;
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=dropdown.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.types.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAEnD,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,CAAC,EAAE,cAAc,GAAG,CAAC,CAAC,EAAE,EAAE,cAAc,KAAK,IAAI,CAAC,CAAC;IACtD,cAAc,EAAE,cAAc,CAAC;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,QAAQ,GAAG,SAAS,GAAG,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IAClE,QAAQ,CAAC,EAAE,qBAAqB,CAAC,UAAU,CAAC,CAAC;IAC7C,KAAK,CAAC,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,+GAA+G;IAC/G,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { JSX, Component } from 'solid-js';
|
|
2
|
+
interface DynamicIconProps extends JSX.SvgSVGAttributes<SVGSVGElement> {
|
|
3
|
+
name: string;
|
|
4
|
+
size?: number;
|
|
5
|
+
}
|
|
6
|
+
export declare const DynamicIcon: Component<DynamicIconProps>;
|
|
7
|
+
export {};
|
|
8
|
+
//# sourceMappingURL=DynamicIcon.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DynamicIcon.d.ts","sourceRoot":"","sources":["../../../src/components/dynamic-icon/DynamicIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,EAAE,SAAS,EAAQ,MAAM,UAAU,CAAC;AAG3C,UAAU,gBAAiB,SAAQ,GAAG,CAAC,gBAAgB,CAAC,aAAa,CAAC;IACpE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAQD,eAAO,MAAM,WAAW,EAAE,SAAS,CAAC,gBAAgB,CASnD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dynamic-icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Component } from 'solid-js';
|
|
2
|
+
import { FloatButtonProps } from './float-button.types';
|
|
3
|
+
export declare function renderAnimateClass(animate: string | undefined): string;
|
|
4
|
+
export declare const FloatButton: Component<FloatButtonProps>;
|
|
5
|
+
//# sourceMappingURL=float-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"float-button.d.ts","sourceRoot":"","sources":["../../../src/components/float-button/float-button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAwC,KAAK,SAAS,EAAE,MAAM,UAAU,CAAC;AAEhF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAa7D,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,MAAM,GAAG,SAAS,UAW7D;AA0BD,eAAO,MAAM,WAAW,EAAE,SAAS,CAAC,gBAAgB,CAwFnD,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../../utils/cn.js";import{Button as t}from"../button/button.js";import{addEventListener as n,className as r,createComponent as i,delegateEvents as a,effect as o,insert as s,memo as c,setStyleProperty as l,template as u}from"solid-js/web";import{For as d,Match as f,Show as p,Switch as m,mergeProps as h}from"solid-js";var g=u(`<div class="absolute -top-2 -right-2"><div>`),_=u(`<div>`),v=u(`<div><div class=relative>`),y=u(`<div class="float-menu flex flex-col items-end">`),b=u(`<div><div class=relative tabindex=0></div><div class=fab-close><div class="float-close btn btn-circle btn-error">`),x=u(`<div class="flex gap-2">`),S={type:`default`,color:`var(--color-warning)`,size:24,animate:`none`,closeIcon:{label:`Close`,icon:`X`}};function C(e){return e?{ripple:`animate-ripple`,pulse:`animate-pulse`,bounce:`animate-bounce`,heartBeat:`animate-heartBeat`,headShake:`animate-headShake`,swing:`animate-swing`,jello:`animate-jello`}[e]:``}function w(e){return e>=1e4?`px-1 translate-x-2`:e>=1e3?`px-1 translate-x-1 -translate-y-1`:e>=100?`px-1`:`w-5`}var T=t=>(()=>{var n=g(),i=n.firstChild;return s(i,(()=>{var e=c(()=>!!t.badge?.count);return()=>e()&&(()=>{var e=_();return s(e,()=>t.badge?.count),e})()})()),o(()=>r(i,e(`bg-error flex h-5 cursor-pointer rounded-full text-xs text-white *:m-auto`,w(t.badge?.count),t.badge?.animate&&`animate-${t.badge?.animate}`,t.badge?.class))),n})(),E=a=>{let u=h(S,a),g=`${u.size}px`;return i(m,{get children(){return[i(f,{get when(){return u.type===`single`},get children(){var a=v(),c=a.firstChild;return n(a,`click`,u.onClickOpen,!0),s(c,i(t,{get icon(){return u.icon},variant:`solid`,shape:`circle`,get class(){return e(`fab-open border-0`,C(u.animate))},tabIndex:0,get style(){return{"background-color":u.color,width:g,height:g,"--innner-color":u.color,"--btn-color":u.color}}}),null),s(c,i(p,{get when(){return u.badge?.count},get children(){return i(T,{get badge(){return u.badge}})}}),null),o(()=>r(a,e(`fab pointer-events-auto`,u.class))),a}}),i(f,{get when(){return u.type!==`single`},get children(){var a=b(),h=a.firstChild,_=h.nextSibling,v=_.firstChild;return s(h,i(t,{get icon(){return u.icon},variant:`solid`,shape:`circle`,get class(){return e(`fab-open border-0`,C(u.animate))},get style(){return{"background-color":u.color,width:g,height:g,"--innner-color":u.color}}}),null),s(h,i(p,{get when(){return u.badge?.count},get children(){return i(T,{get badge(){return u.badge}})}}),null),s(_,(()=>{var e=c(()=>u.type===`default`);return()=>e()&&u.closeIcon?.label})(),v),n(v,`click`,u.closeIcon?.onClickClose,!0),l(v,`width`,g),l(v,`height`,g),s(v,()=>u.closeIcon?.icon??`orange`),s(a,i(m,{get children(){return[i(f,{get when(){return u.type===`default`},get children(){var e=y();return s(e,i(d,{get each(){return u.actions},children:e=>(()=>{var t=x();return s(t,e),t})()})),e}}),i(f,{get when(){return u.type===`flower`},get children(){return i(d,{get each(){return u.actions},children:(e,t)=>{if(t()>3){console.warn(`Chỉ có thể nhận tối đa 4 component. Cần xóa các Component sau: `,e);return}return e}})}})]}}),null),o(()=>r(a,e(`fab`,u.type===`flower`&&`fab-flower`,u.class))),a}})]}})};a([`click`]);export{E as FloatButton};
|
|
2
|
+
//# sourceMappingURL=float-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"float-button.js","names":["cn","For","Match","mergeProps","Show","Switch","Component","Button","FloatButtonProps","DEFAULT_PROPS","type","color","size","animate","closeIcon","label","icon","renderAnimateClass","AnimateInfinite","Record","ripple","pulse","bounce","heartBeat","headShake","swing","jello","renderBadgeWidth","count","FloatButtonBadge","badge","p","_el$","_tmpl$","_el$2","firstChild","_$insert","_c$","_$memo","_el$3","_tmpl$2","_$effect","_$className","class","FloatButton","props","_$createComponent","children","when","_el$4","_tmpl$3","_el$5","_$addEventListener","onClickOpen","variant","shape","tabIndex","style","width","height","_el$6","_tmpl$5","_el$7","_el$8","nextSibling","_el$9","_c$2","onClickClose","_$setStyleProperty","Element","_el$0","_tmpl$4","each","actions","item","_el$1","_tmpl$6","index","console","warn","_$delegateEvents"],"sources":["../../../src/components/float-button/float-button.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { For, Match, mergeProps, Show, Switch, type Component } from 'solid-js';\r\nimport { Button } from '../button';\r\nimport type { FloatButtonProps } from './float-button.types';\r\n\r\nconst DEFAULT_PROPS: FloatButtonProps = {\r\n type: 'default',\r\n color: 'var(--color-warning)',\r\n size: 24,\r\n animate: 'none',\r\n closeIcon: {\r\n label: 'Close',\r\n icon: 'X',\r\n },\r\n};\r\n\r\nexport function renderAnimateClass(animate: string | undefined) {\r\n const AnimateInfinite: Record<string, string> = {\r\n ripple: 'animate-ripple',\r\n pulse: 'animate-pulse',\r\n bounce: 'animate-bounce',\r\n heartBeat: 'animate-heartBeat',\r\n headShake: 'animate-headShake',\r\n swing: 'animate-swing',\r\n jello: 'animate-jello',\r\n };\r\n return animate ? AnimateInfinite[animate] : '';\r\n}\r\nfunction renderBadgeWidth(count: number): string {\r\n if (count >= 10_000) return 'px-1 translate-x-2';\r\n if (count >= 1000) return 'px-1 translate-x-1 -translate-y-1';\r\n if (count >= 100) return 'px-1';\r\n return 'w-5';\r\n}\r\nconst FloatButtonBadge: Component<{\r\n badge?: FloatButtonProps['badge'];\r\n}> = p => {\r\n return (\r\n <div class=\"absolute -top-2 -right-2\">\r\n <div\r\n class={cn(\r\n 'bg-error flex h-5 cursor-pointer rounded-full text-xs text-white *:m-auto',\r\n renderBadgeWidth(p.badge?.count!),\r\n p.badge?.animate && `animate-${p.badge?.animate}`,\r\n p.badge?.class,\r\n )}\r\n >\r\n {p.badge?.count && <div>{p.badge?.count}</div>}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nexport const FloatButton: Component<FloatButtonProps> = props => {\r\n const p = mergeProps(DEFAULT_PROPS, props);\r\n const size = `${p.size}px`;\r\n\r\n return (\r\n <Switch>\r\n <Match when={p.type === 'single'}>\r\n <div class={cn('fab pointer-events-auto', p.class)} onClick={p.onClickOpen}>\r\n <div class=\"relative\">\r\n <Button\r\n icon={p.icon}\r\n variant=\"solid\"\r\n shape=\"circle\"\r\n class={cn('fab-open border-0', renderAnimateClass(p.animate))}\r\n tabIndex={0}\r\n style={{\r\n 'background-color': p.color,\r\n width: size,\r\n height: size,\r\n ['--innner-color']: p.color,\r\n ['--btn-color']: p.color,\r\n }}\r\n />\r\n <Show when={p.badge?.count}>\r\n <FloatButtonBadge badge={p.badge} />\r\n </Show>\r\n </div>\r\n </div>\r\n </Match>\r\n <Match when={p.type !== 'single'}>\r\n <div class={cn('fab', p.type === 'flower' && 'fab-flower', p.class)}>\r\n <div class=\"relative\" tabIndex={0}>\r\n <Button\r\n icon={p.icon}\r\n variant=\"solid\"\r\n shape=\"circle\"\r\n class={cn('fab-open border-0', renderAnimateClass(p.animate))}\r\n style={{\r\n 'background-color': p.color,\r\n width: size,\r\n height: size,\r\n ['--innner-color']: p.color,\r\n }}\r\n />\r\n <Show when={p.badge?.count}>\r\n <FloatButtonBadge badge={p.badge} />\r\n </Show>\r\n </div>\r\n\r\n <div class=\"fab-close\">\r\n {p.type === 'default' && p.closeIcon?.label}\r\n <div\r\n class=\"float-close btn btn-circle btn-error\"\r\n style={{ width: size, height: size }}\r\n onClick={p.closeIcon?.onClickClose}\r\n >\r\n {(p.closeIcon?.icon as Element) ?? 'orange'}\r\n </div>\r\n </div>\r\n <Switch>\r\n <Match when={p.type === 'default'}>\r\n <div class=\"float-menu flex flex-col items-end\">\r\n <For each={p.actions}>\r\n {item => {\r\n return <div class=\"flex gap-2\">{item as Element}</div>;\r\n }}\r\n </For>\r\n </div>\r\n </Match>\r\n <Match when={p.type === 'flower'}>\r\n <For each={p.actions}>\r\n {(item, index) => {\r\n if (index() > 3) {\r\n console.warn(\r\n 'Chỉ có thể nhận tối đa 4 component. Cần xóa các Component sau: ',\r\n item,\r\n );\r\n return;\r\n }\r\n return <>{item}</>;\r\n }}\r\n </For>\r\n </Match>\r\n </Switch>\r\n </div>\r\n </Match>\r\n </Switch>\r\n );\r\n};\r\n"],"mappings":"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"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { SolidComponent } from '../../type';
|
|
2
|
+
type FloatButtonBaseProps = {
|
|
3
|
+
color?: string;
|
|
4
|
+
size?: number;
|
|
5
|
+
icon?: SolidComponent;
|
|
6
|
+
animate?: 'ripple' | 'pulse' | 'bounce' | 'heartBeat' | 'headShake' | 'swing' | 'jello' | 'none';
|
|
7
|
+
class?: string;
|
|
8
|
+
onClickOpen?: (e: MouseEvent) => void;
|
|
9
|
+
badge?: {
|
|
10
|
+
class?: string;
|
|
11
|
+
count?: number;
|
|
12
|
+
animate?: 'bounce' | 'heartBeat' | 'swing' | 'jello' | 'none';
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
type FloatButtonSingleProps = FloatButtonBaseProps & {
|
|
16
|
+
type: 'single';
|
|
17
|
+
};
|
|
18
|
+
type CloseIcon = {
|
|
19
|
+
label: string;
|
|
20
|
+
icon: SolidComponent;
|
|
21
|
+
color?: string;
|
|
22
|
+
onClickClose?: (e: MouseEvent) => void;
|
|
23
|
+
};
|
|
24
|
+
type FloatButtonDefaultProps = FloatButtonBaseProps & {
|
|
25
|
+
type: 'default';
|
|
26
|
+
actions?: Array<SolidComponent>;
|
|
27
|
+
} & {
|
|
28
|
+
closeIcon?: CloseIcon;
|
|
29
|
+
};
|
|
30
|
+
type FloatButtonFlowerProps = FloatButtonBaseProps & {
|
|
31
|
+
type: 'flower';
|
|
32
|
+
/**
|
|
33
|
+
* Danh sách các action buttons
|
|
34
|
+
* @warning Nên truyền actions là các button hình tròn và tối đa 4 button để tránh vỡ giao diện
|
|
35
|
+
*/
|
|
36
|
+
actions?: Array<SolidComponent>;
|
|
37
|
+
} & {
|
|
38
|
+
closeIcon?: CloseIcon;
|
|
39
|
+
};
|
|
40
|
+
export type FloatButtonProps = FloatButtonSingleProps | FloatButtonDefaultProps | FloatButtonFlowerProps;
|
|
41
|
+
export {};
|
|
42
|
+
//# sourceMappingURL=float-button.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"float-button.types.d.ts","sourceRoot":"","sources":["../../../src/components/float-button/float-button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAGxC,KAAK,oBAAoB,GAAG;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,WAAW,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;IACjG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACtC,KAAK,CAAC,EAAE;QACN,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,OAAO,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;KAC/D,CAAC;CACH,CAAC;AAGF,KAAK,sBAAsB,GAAG,oBAAoB,GAAG;IACnD,IAAI,EAAE,QAAQ,CAAC;CAChB,CAAC;AACF,KAAK,SAAS,GAAG;IACf,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CACxC,CAAC;AAGF,KAAK,uBAAuB,GAAG,oBAAoB,GAAG;IACpD,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC;CACjC,GAAG;IAAE,SAAS,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC;AAI9B,KAAK,sBAAsB,GAAG,oBAAoB,GAAG;IACnD,IAAI,EAAE,QAAQ,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC;CACjC,GAAG;IAAE,SAAS,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC;AAE9B,MAAM,MAAM,gBAAgB,GACxB,sBAAsB,GACtB,uBAAuB,GACvB,sBAAsB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/float-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hover-3d-example.d.ts","sourceRoot":"","sources":["../../../src/components/hover-3d-image/hover-3d-example.tsx"],"names":[],"mappings":"AAEA,QAAA,MAAM,cAAc,sCA8GnB,CAAC;AAEF,OAAO,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Image } from '../../utils/helper';
|
|
2
|
+
import { Component } from 'solid-js';
|
|
3
|
+
import { ImagePreviewProps } from '../image-preview/image-preview';
|
|
4
|
+
export declare const Hover3DImage: Component<{
|
|
5
|
+
image: Image;
|
|
6
|
+
/** Bật/tắt tính năng click để preview ảnh. @default true */
|
|
7
|
+
preview?: boolean | {
|
|
8
|
+
enabled: true;
|
|
9
|
+
previewOptions?: ImagePreviewProps;
|
|
10
|
+
};
|
|
11
|
+
class?: Partial<Record<'root' | 'figure' | 'image', string>>;
|
|
12
|
+
}>;
|
|
13
|
+
//# sourceMappingURL=hover-3d-image.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hover-3d-image.d.ts","sourceRoot":"","sources":["../../../src/components/hover-3d-image/hover-3d-image.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAEvC,OAAO,EAAE,SAAS,EAAsB,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE,eAAO,MAAM,YAAY,EAAE,SAAS,CAAC;IACnC,KAAK,EAAE,KAAK,CAAC;IACb,4DAA4D;IAC5D,OAAO,CAAC,EAAE,OAAO,GAAG;QAAE,OAAO,EAAE,IAAI,CAAC;QAAC,cAAc,CAAC,EAAE,iBAAiB,CAAA;KAAE,CAAC;IAC1E,KAAK,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,GAAG,QAAQ,GAAG,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;CAC9D,CAiCA,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../../utils/cn.js";import{ImagePreview as t}from"../image-preview/image-preview.js";import{className as n,createComponent as r,delegateEvents as i,effect as a,memo as o,mergeProps as s,spread as c,template as l}from"solid-js/web";import{Show as u,createSignal as d}from"solid-js";var f=l(`<div><figure><img></figure><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div>`),p=i=>{let[l,p]=d(!1),m=()=>i.preview!==!1;return[(()=>{var t=f(),r=t.firstChild,o=r.firstChild;return t.$$click=()=>m()&&p(!0),c(o,s(()=>i.image),!1,!1),a(a=>{var o=e(`hover-3d`,m()&&`cursor-zoom-in`,i.class?.root),s=e(`rounded-2xl`,i.class?.figure);return o!==a.e&&n(t,a.e=o),s!==a.t&&n(r,a.t=s),a},{e:void 0,t:void 0}),t})(),r(u,{get when(){return l()},get children(){return r(t,s({get src(){return i.image.src},get imageName(){return o(()=>typeof i.image.alt==`string`)()?i.image.alt:void 0},onClose:()=>p(!1)},()=>typeof i.preview==`object`?i.preview.previewOptions:void 0))}})]};i([`click`]);export{p as Hover3DImage};
|
|
2
|
+
//# sourceMappingURL=hover-3d-image.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hover-3d-image.js","names":["cn","Image","ImagePreview","Component","createSignal","Show","ImagePreviewProps","Hover3DImage","image","preview","enabled","previewOptions","class","Partial","Record","p","open","setOpen","previewEnabled","_el$","_tmpl$","_el$2","firstChild","_el$3","$$click","_$spread","_$mergeProps","_$effect","_p$","_v$","root","_v$2","figure","e","_$className","t","undefined","_$createComponent","when","children","src","imageName","_$memo","alt","onClose","_$delegateEvents"],"sources":["../../../src/components/hover-3d-image/hover-3d-image.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { Image } from '@/utils/helper';\r\nimport { ImagePreview } from '@components/image-preview';\r\nimport { Component, createSignal, Show } from 'solid-js';\r\nimport { ImagePreviewProps } from '../image-preview/image-preview';\r\n\r\nexport const Hover3DImage: Component<{\r\n image: Image;\r\n /** Bật/tắt tính năng click để preview ảnh. @default true */\r\n preview?: boolean | { enabled: true; previewOptions?: ImagePreviewProps };\r\n class?: Partial<Record<'root' | 'figure' | 'image', string>>;\r\n}> = p => {\r\n const [open, setOpen] = createSignal(false);\r\n const previewEnabled = () => p.preview !== false;\r\n\r\n return (\r\n <>\r\n <div\r\n class={cn('hover-3d', previewEnabled() && 'cursor-zoom-in', p.class?.root)}\r\n onClick={() => previewEnabled() && setOpen(true)}\r\n >\r\n <figure class={cn('rounded-2xl', p.class?.figure)}>\r\n <img {...p.image} />\r\n </figure>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n </div>\r\n\r\n <Show when={open()}>\r\n <ImagePreview\r\n src={p.image.src}\r\n imageName={typeof p.image.alt === 'string' ? p.image.alt : undefined}\r\n onClose={() => setOpen(false)}\r\n {...(typeof p.preview === 'object' ? p.preview.previewOptions : undefined)}\r\n />\r\n </Show>\r\n </>\r\n );\r\n};\r\n"],"mappings":"qaAMaO,EAKRQ,GAAK,CACR,GAAM,CAACC,EAAMC,GAAWb,EAAa,GAAM,CACrCc,MAAuBH,EAAEN,UAAY,GAE3C,MAAA,MAAA,CAAA,IAAAU,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAAAC,EAAAF,EAAAC,WAMuD,MANvDH,GAAAK,YAIqBN,GAAgB,EAAID,EAAQ,GAAK,CAAAQ,EAAAF,EAAAG,MAGrCX,EAAEP,MAAK,CAAA,GAAA,GAAA,CAAAmB,EAAAC,GAAA,CAAA,IAAAC,EAJX7B,EAAG,WAAYkB,GAAgB,EAAI,iBAAkBH,EAAEH,OAAOkB,KAAK,CAAAC,EAG3D/B,EAAG,cAAee,EAAEH,OAAOoB,OAAO,CAAA,OAAAH,IAAAD,EAAAK,GAAAC,EAAAf,EAAAS,EAAAK,EAAAJ,EAAA,CAAAE,IAAAH,EAAAO,GAAAD,EAAAb,EAAAO,EAAAO,EAAAJ,EAAA,CAAAH,GAAA,CAAAK,EAAAG,IAAAA,GAAAD,EAAAC,IAAAA,GAAA,CAAA,CAAAjB,KAAA,CAAAkB,EAalDhC,EAAI,CAAA,IAACiC,MAAI,CAAA,OAAEtB,GAAM,EAAA,IAAAuB,UAAA,CAAA,OAAAF,EACfnC,EAAYwB,EAAA,CAAA,IACXc,KAAG,CAAA,OAAEzB,EAAEP,MAAMgC,KAAG,IAChBC,WAAS,CAAA,OAAEC,MAAA,OAAO3B,EAAEP,MAAMmC,KAAQ,SAAQ,EAAA,CAAG5B,EAAEP,MAAMmC,IAAMP,IAAAA,IAC3DQ,YAAe3B,EAAQ,GAAK,CAAC,KACxB,OAAOF,EAAEN,SAAY,SAAWM,EAAEN,QAAQE,eAAiByB,IAAAA,GAAS,CAAA,EAAA,CAAA,CAAA,EAKjFS,EAAA,CAAA,QAAA,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/hover-3d-image/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/iframe/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAExC,OAAO,EAAE,SAAS,EAA0B,MAAM,UAAU,CAAC;AAG7D,eAAO,MAAM,MAAM,EAAE,SAAS,CAAC;IAAE,OAAO,EAAE,cAAc,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CA8BzE,CAAC"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
type ImagePreviewClassProps = {
|
|
2
|
+
backdrop?: string;
|
|
3
|
+
close?: string;
|
|
4
|
+
box?: string;
|
|
5
|
+
img?: string;
|
|
6
|
+
toolbar?: string;
|
|
7
|
+
toolBtn?: string;
|
|
8
|
+
zoomLabel?: string;
|
|
9
|
+
infoPopup?: string;
|
|
10
|
+
};
|
|
11
|
+
export type ImagePreviewProps = {
|
|
12
|
+
src: string;
|
|
13
|
+
imageName?: string;
|
|
14
|
+
size?: string;
|
|
15
|
+
createdAt?: Date | string;
|
|
16
|
+
modifiedAt?: Date | string;
|
|
17
|
+
onClose: () => void;
|
|
18
|
+
closeOnBackdrop?: boolean;
|
|
19
|
+
closeOnEsc?: boolean;
|
|
20
|
+
class?: ImagePreviewClassProps;
|
|
21
|
+
zIndex?: number;
|
|
22
|
+
};
|
|
23
|
+
export declare function ImagePreview(p: ImagePreviewProps): import("solid-js").JSX.Element;
|
|
24
|
+
export {};
|
|
25
|
+
//# sourceMappingURL=image-preview.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"image-preview.d.ts","sourceRoot":"","sources":["../../../src/components/image-preview/image-preview.tsx"],"names":[],"mappings":"AAaA,KAAK,sBAAsB,GAAG;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC1B,UAAU,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,sBAAsB,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AA8BF,wBAAgB,YAAY,CAAC,CAAC,EAAE,iBAAiB,kCA4QhD"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../../utils/cn.js";import{ZIndexType as t}from"../z-index/z-index.types.js";import{ZIndex as n}from"../z-index/z-index.js";import{addEventListener as r,className as i,createComponent as a,delegateEvents as o,effect as s,insert as c,memo as l,setAttribute as u,setStyleProperty as ee,template as d,use as f}from"solid-js/web";import{Show as p,createSignal as m,mergeProps as h,onCleanup as g,onMount as _}from"solid-js";import v from"lucide-solid/icons/x";import y from"lucide-solid/icons/flip-horizontal-2";import b from"lucide-solid/icons/flip-vertical-2";import x from"lucide-solid/icons/info";import S from"lucide-solid/icons/maximize-2";import C from"lucide-solid/icons/rotate-ccw";import w from"lucide-solid/icons/rotate-cw";import T from"lucide-solid/icons/zoom-in";import E from"lucide-solid/icons/zoom-out";var D=d(`<div class="flex items-start gap-2"><span class="w-24 shrink-0 text-white/40"></span><span class="min-w-0 break-all text-white/90">`),O=d(`<div class=img07>`),k=d(`<div><p class="mb-2 text-xs font-semibold tracking-wide text-white/50 uppercase">Thông tin ảnh</p><div class="flex flex-col gap-1.5 text-xs">`),A=d(`<div class=relative><button title="Thông tin ảnh">`),j=d(`<div><button></button><div><img></div><div><button title="Lật dọc"></button><button title="Lật ngang"></button><div class=img07></div><button title="Xoay ngược chiều kim đồng hồ"></button><button title="Xoay thuận chiều kim đồng hồ"></button><div class=img07></div><button title="Thu nhỏ"></button><span>%</span><button title="Phóng to"></button><div class=img07></div><button title="Reset về 100%">`),M=.25,N=.25,P=4;function te(e){if(!e)return;let t=e instanceof Date?e:new Date(e);return isNaN(t.getTime())?String(e):t.toLocaleString(`vi-VN`,{day:`2-digit`,month:`2-digit`,year:`numeric`,hour:`2-digit`,minute:`2-digit`})}function F(e){return a(p,{get when(){return e.value},get children(){var t=D(),n=t.firstChild,r=n.nextSibling;return c(n,()=>e.label),c(r,()=>e.value),t}})}function I(o){o=h({closeOnBackdrop:!1,closeOnEsc:!0},o);let[d,D]=m(0),[I,L]=m(!1),[R,z]=m(!1),[B,V]=m(1),[H,U]=m(0),[W,G]=m(0),[K,q]=m(!1),[J,ne]=m(!1),[Y,re]=m(null),ie=0,ae=0,oe=0,se=0,ce=()=>B()>1,le=()=>{let e=I()?-B():B(),t=R()?-B():B();return`translate(${H()}px, ${W()}px) rotate(${d()}deg) scale(${e}, ${t})`},ue=()=>V(e=>Math.min(+(e+M).toFixed(2),P)),de=()=>{let e=Math.max(+(B()-M).toFixed(2),N);V(e),e<=1&&(U(0),G(0))},fe=()=>{V(1),U(0),G(0),D(0),L(!1),z(!1)},pe=()=>{D(e=>e+90),U(0),G(0)},me=()=>{D(e=>e-90),U(0),G(0)},he=()=>L(e=>!e),ge=()=>z(e=>!e),_e=e=>{ce()&&(e.preventDefault(),e.currentTarget.setPointerCapture(e.pointerId),q(!0),ie=e.clientX,ae=e.clientY,oe=H(),se=W())},ve=e=>{K()&&(U(oe+e.clientX-ie),G(se+e.clientY-ae))},ye=()=>q(!1),X,Z,Q,$;_(()=>{let e=e=>{e.preventDefault();let t=e.deltaY<0?M:-M,n=B(),r=Math.min(Math.max(+(n+t).toFixed(2),N),P);if(r===n)return;let i=Z.getBoundingClientRect(),a=e.clientX-i.left-i.width/2,o=e.clientY-i.top-i.height/2,s=r/n-1;V(r),U(e=>e-(a-e)*s),G(e=>e-(o-e)*s),r<=1&&(U(0),G(0))},t=e=>{e.key===`Escape`&&(o.closeOnEsc??!0)&&(e.stopImmediatePropagation(),o.onClose())},n=e=>{if(!J())return;let t=e.target;!Q?.contains(t)&&!$?.contains(t)&&ne(!1)},r=e=>e.preventDefault();X.addEventListener(`wheel`,r,{passive:!1}),Z.addEventListener(`wheel`,e,{passive:!1}),document.addEventListener(`pointerdown`,n),document.addEventListener(`keydown`,t,{capture:!0}),g(function(){X.removeEventListener(`wheel`,r),Z.removeEventListener(`wheel`,e),document.removeEventListener(`pointerdown`,n),document.removeEventListener(`keydown`,t,{capture:!0})})});let be=()=>!!(o.imageName||o.size||o.createdAt||o.modifiedAt);return a(n,{open:!0,get type(){return t.MODAL},blockScroll:!0,positioning:`fixed`,preRender:!1,get customValue(){return o.zIndex},class:`inset-0`,get children(){var t=j(),n=t.firstChild,m=n.nextSibling,h=m.firstChild,g=m.nextSibling,_=g.firstChild,D=_.nextSibling,M=D.nextSibling.nextSibling,L=M.nextSibling,z=L.nextSibling.nextSibling,V=z.nextSibling,H=V.firstChild,U=V.nextSibling,W=U.nextSibling.nextSibling;r(t,`click`,o.closeOnBackdrop?o.onClose:void 0,!0);var G=X;typeof G==`function`?f(G,t):X=t,r(n,`click`,o.onClose,!0),c(n,a(v,{size:20})),m.addEventListener(`pointercancel`,ye),m.$$pointerup=ye,m.$$pointermove=ve,m.$$pointerdown=_e,m.$$click=e=>e.stopPropagation();var q=Z;return typeof q==`function`?f(q,m):Z=m,h.addEventListener(`load`,e=>{let t=e.currentTarget;re({w:t.naturalWidth,h:t.naturalHeight})}),u(h,`draggable`,!1),g.$$click=e=>e.stopPropagation(),_.$$click=ge,c(_,a(b,{size:16})),D.$$click=he,c(D,a(y,{size:16})),M.$$click=me,c(M,a(C,{size:16})),L.$$click=pe,c(L,a(w,{size:16})),z.$$click=de,c(z,a(E,{size:16})),c(V,()=>Math.round(B()*100),H),U.$$click=ue,c(U,a(T,{size:16})),W.$$click=fe,c(W,a(S,{size:16})),c(g,a(p,{get when(){return be()},get children(){return[O(),(()=>{var t=A(),n=t.firstChild;n.$$click=()=>ne(e=>!e);var r=$;return typeof r==`function`?f(r,n):$=n,c(n,a(x,{size:16})),c(t,a(p,{get when(){return J()},get children(){var t=k(),n=t.firstChild.nextSibling,r=Q;return typeof r==`function`?f(r,t):Q=t,c(n,a(F,{label:`Tên file`,get value(){return o.imageName}}),null),c(n,a(F,{label:`Kích thước`,get value(){return o.size}}),null),c(n,a(F,{label:`Dimension`,get value(){return l(()=>!!Y())()?`${Y().w} × ${Y().h} px`:void 0}}),null),c(n,a(F,{label:`Ngày tạo`,get value(){return te(o.createdAt)}}),null),c(n,a(F,{label:`Ngày sửa`,get value(){return te(o.modifiedAt)}}),null),s(()=>i(t,e(`img09`,o.class?.infoPopup))),t}}),null),s(()=>i(n,e(`img06`,J()&&`bg-white/20 text-white`,o.class?.toolBtn))),t})()]}}),null),s(r=>{var a=e(`img01`,o.class?.backdrop),s=e(`img02`,o.class?.close),c=e(`img03`,ce()&&(K()?`cursor-grabbing`:`cursor-grab`),o.class?.box),l=o.src,f=o.imageName,p=e(`img04`,K()&&`img04--drag`,o.class?.img),v=le(),y=e(`img05`,o.class?.toolbar),b=e(`img06`,o.class?.toolBtn),x=e(`img06`,o.class?.toolBtn),S=e(`img06`,o.class?.toolBtn),C=e(`img06`,o.class?.toolBtn),w=e(`img06`,o.class?.toolBtn),T=B()<=N,E=e(`img08`,o.class?.zoomLabel),O=e(`img06`,o.class?.toolBtn),k=B()>=P,A=e(`img06`,o.class?.toolBtn),j=B()===1&&d()===0&&!I()&&!R();return a!==r.e&&i(t,r.e=a),s!==r.t&&i(n,r.t=s),c!==r.a&&i(m,r.a=c),l!==r.o&&u(h,`src`,r.o=l),f!==r.i&&u(h,`alt`,r.i=f),p!==r.n&&i(h,r.n=p),v!==r.s&&ee(h,`transform`,r.s=v),y!==r.h&&i(g,r.h=y),b!==r.r&&i(_,r.r=b),x!==r.d&&i(D,r.d=x),S!==r.l&&i(M,r.l=S),C!==r.u&&i(L,r.u=C),w!==r.c&&i(z,r.c=w),T!==r.w&&(z.disabled=r.w=T),E!==r.m&&i(V,r.m=E),O!==r.f&&i(U,r.f=O),k!==r.y&&(U.disabled=r.y=k),A!==r.g&&i(W,r.g=A),j!==r.p&&(W.disabled=r.p=j),r},{e:void 0,t:void 0,a:void 0,o:void 0,i:void 0,n:void 0,s:void 0,h:void 0,r:void 0,d:void 0,l:void 0,u:void 0,c:void 0,w:void 0,m:void 0,f:void 0,y:void 0,g:void 0,p:void 0}),t}})}o([`click`,`pointerdown`,`pointermove`,`pointerup`]);export{I as ImagePreview};
|
|
2
|
+
//# sourceMappingURL=image-preview.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"image-preview.js","names":["cn","ZIndex","ZIndexType","FlipHorizontal2","FlipVertical2","Info","Maximize2","RotateCcw","RotateCw","X","ZoomIn","ZoomOut","createSignal","mergeProps","onCleanup","onMount","Show","ImagePreviewClassProps","backdrop","close","box","img","toolbar","toolBtn","zoomLabel","infoPopup","ImagePreviewProps","src","imageName","size","createdAt","Date","modifiedAt","onClose","closeOnBackdrop","closeOnEsc","class","zIndex","ZOOM_STEP","ZOOM_MIN","ZOOM_MAX","formatDate","value","undefined","d","isNaN","getTime","String","toLocaleString","day","month","year","hour","minute","InfoRow","props","label","_$createComponent","when","children","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_$insert","ImagePreview","p","rotate","setRotate","flipH","setFlipH","flipV","setFlipV","scale","setScale","offsetX","setOffsetX","offsetY","setOffsetY","isDragging","setIsDragging","showInfo","setShowInfo","naturalSize","setNaturalSize","w","h","dragStartX","dragStartY","dragStartOffsetX","dragStartOffsetY","canPan","imgTransform","sx","sy","zoomIn","s","Math","min","toFixed","zoomOut","next","max","resetView","rotateCw","r","rotateCcw","doFlipH","v","doFlipV","onPointerDown","e","PointerEvent","preventDefault","currentTarget","HTMLElement","setPointerCapture","pointerId","clientX","clientY","onPointerMove","onPointerUp","backdropRef","HTMLDivElement","boxRef","infoPopupRef","infoBtnRef","HTMLButtonElement","onWheel","WheelEvent","delta","deltaY","oldScale","newScale","rect","getBoundingClientRect","cx","left","width","cy","top","height","ratio","ox","oy","onKeyDown","KeyboardEvent","key","stopImmediatePropagation","onDocPointerDown","target","Node","contains","preventScroll","addEventListener","passive","document","capture","removePreviewEventListeners","removeEventListener","hasInfo","open","type","MODAL","blockScroll","positioning","preRender","customValue","_el$4","_tmpl$5","_el$5","_el$6","_el$7","_el$8","_el$9","_el$0","_el$1","_el$10","_el$11","_el$12","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_$addEventListener","_ref$","_$use","$$pointerup","$$pointermove","$$pointerdown","$$click","stopPropagation","_ref$2","HTMLImageElement","naturalWidth","naturalHeight","_$setAttribute","round","_tmpl$2","_el$20","_tmpl$4","_el$21","_ref$3","_el$22","_tmpl$3","_el$23","_el$24","_ref$4","_$memo","_$effect","_$className","_p$","_v$","_v$2","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","_v$0","_v$1","_v$10","_v$11","_v$12","_v$13","_v$14","_v$15","_v$16","_v$17","t","a","o","i","n","_$setStyleProperty","l","u","c","disabled","m","f","y","g","_$delegateEvents"],"sources":["../../../src/components/image-preview/image-preview.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { ZIndex, ZIndexType } from '@components/z-index';\r\nimport FlipHorizontal2 from 'lucide-solid/icons/flip-horizontal-2';\r\nimport FlipVertical2 from 'lucide-solid/icons/flip-vertical-2';\r\nimport Info from 'lucide-solid/icons/info';\r\nimport Maximize2 from 'lucide-solid/icons/maximize-2';\r\nimport RotateCcw from 'lucide-solid/icons/rotate-ccw';\r\nimport RotateCw from 'lucide-solid/icons/rotate-cw';\r\nimport X from 'lucide-solid/icons/x';\r\nimport ZoomIn from 'lucide-solid/icons/zoom-in';\r\nimport ZoomOut from 'lucide-solid/icons/zoom-out';\r\nimport { createSignal, mergeProps, onCleanup, onMount, Show } from 'solid-js';\r\n\r\ntype ImagePreviewClassProps = {\r\n backdrop?: string;\r\n close?: string;\r\n box?: string;\r\n img?: string;\r\n toolbar?: string;\r\n toolBtn?: string;\r\n zoomLabel?: string;\r\n infoPopup?: string;\r\n};\r\n\r\nexport type ImagePreviewProps = {\r\n src: string;\r\n imageName?: string;\r\n size?: string;\r\n createdAt?: Date | string;\r\n modifiedAt?: Date | string;\r\n onClose: () => void;\r\n closeOnBackdrop?: boolean;\r\n closeOnEsc?: boolean;\r\n class?: ImagePreviewClassProps;\r\n zIndex?: number;\r\n};\r\n\r\nconst ZOOM_STEP = 0.25;\r\nconst ZOOM_MIN = 0.25;\r\nconst ZOOM_MAX = 4;\r\n\r\nfunction formatDate(value: Date | string | undefined): string | undefined {\r\n if (!value) return undefined;\r\n const d = value instanceof Date ? value : new Date(value);\r\n if (isNaN(d.getTime())) return String(value);\r\n return d.toLocaleString('vi-VN', {\r\n day: '2-digit',\r\n month: '2-digit',\r\n year: 'numeric',\r\n hour: '2-digit',\r\n minute: '2-digit',\r\n });\r\n}\r\n\r\nfunction InfoRow(props: { label: string; value: string | undefined }) {\r\n return (\r\n <Show when={props.value}>\r\n <div class=\"flex items-start gap-2\">\r\n <span class=\"w-24 shrink-0 text-white/40\">{props.label}</span>\r\n <span class=\"min-w-0 break-all text-white/90\">{props.value}</span>\r\n </div>\r\n </Show>\r\n );\r\n}\r\n\r\nexport function ImagePreview(p: ImagePreviewProps) {\r\n p = mergeProps({ closeOnBackdrop: false, closeOnEsc: true }, p);\r\n const [rotate, setRotate] = createSignal(0);\r\n const [flipH, setFlipH] = createSignal(false);\r\n const [flipV, setFlipV] = createSignal(false);\r\n const [scale, setScale] = createSignal(1);\r\n const [offsetX, setOffsetX] = createSignal(0);\r\n const [offsetY, setOffsetY] = createSignal(0);\r\n const [isDragging, setIsDragging] = createSignal(false);\r\n const [showInfo, setShowInfo] = createSignal(false);\r\n const [naturalSize, setNaturalSize] = createSignal<{ w: number; h: number } | null>(null);\r\n\r\n let dragStartX = 0;\r\n let dragStartY = 0;\r\n let dragStartOffsetX = 0;\r\n let dragStartOffsetY = 0;\r\n\r\n const canPan = () => scale() > 1;\r\n\r\n const imgTransform = () => {\r\n const sx = flipH() ? -scale() : scale();\r\n const sy = flipV() ? -scale() : scale();\r\n return `translate(${offsetX()}px, ${offsetY()}px) rotate(${rotate()}deg) scale(${sx}, ${sy})`;\r\n };\r\n\r\n const zoomIn = () => setScale(s => Math.min(+(s + ZOOM_STEP).toFixed(2), ZOOM_MAX));\r\n\r\n const zoomOut = () => {\r\n const next = Math.max(+(scale() - ZOOM_STEP).toFixed(2), ZOOM_MIN);\r\n setScale(next);\r\n if (next <= 1) {\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n }\r\n };\r\n\r\n const resetView = () => {\r\n setScale(1);\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n setRotate(0);\r\n setFlipH(false);\r\n setFlipV(false);\r\n };\r\n\r\n const rotateCw = () => {\r\n setRotate(r => r + 90);\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n };\r\n const rotateCcw = () => {\r\n setRotate(r => r - 90);\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n };\r\n const doFlipH = () => setFlipH(v => !v);\r\n const doFlipV = () => setFlipV(v => !v);\r\n\r\n const onPointerDown = (e: PointerEvent) => {\r\n if (!canPan()) return;\r\n e.preventDefault();\r\n (e.currentTarget as HTMLElement).setPointerCapture(e.pointerId);\r\n setIsDragging(true);\r\n dragStartX = e.clientX;\r\n dragStartY = e.clientY;\r\n dragStartOffsetX = offsetX();\r\n dragStartOffsetY = offsetY();\r\n };\r\n\r\n const onPointerMove = (e: PointerEvent) => {\r\n if (!isDragging()) return;\r\n setOffsetX(dragStartOffsetX + e.clientX - dragStartX);\r\n setOffsetY(dragStartOffsetY + e.clientY - dragStartY);\r\n };\r\n\r\n const onPointerUp = () => setIsDragging(false);\r\n\r\n let backdropRef!: HTMLDivElement;\r\n let boxRef!: HTMLDivElement;\r\n let infoPopupRef!: HTMLDivElement;\r\n let infoBtnRef!: HTMLButtonElement;\r\n\r\n onMount(() => {\r\n const onWheel = (e: WheelEvent) => {\r\n e.preventDefault();\r\n const delta = e.deltaY < 0 ? ZOOM_STEP : -ZOOM_STEP;\r\n const oldScale = scale();\r\n const newScale = Math.min(Math.max(+(oldScale + delta).toFixed(2), ZOOM_MIN), ZOOM_MAX);\r\n if (newScale === oldScale) return;\r\n\r\n const rect = boxRef.getBoundingClientRect();\r\n const cx = e.clientX - rect.left - rect.width / 2;\r\n const cy = e.clientY - rect.top - rect.height / 2;\r\n const ratio = newScale / oldScale - 1;\r\n\r\n setScale(newScale);\r\n setOffsetX(ox => ox - (cx - ox) * ratio);\r\n setOffsetY(oy => oy - (cy - oy) * ratio);\r\n\r\n if (newScale <= 1) {\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n }\r\n };\r\n\r\n const onKeyDown = (e: KeyboardEvent) => {\r\n if (e.key === 'Escape' && (p.closeOnEsc ?? true)) {\r\n e.stopImmediatePropagation();\r\n p.onClose();\r\n }\r\n };\r\n\r\n const onDocPointerDown = (e: PointerEvent) => {\r\n if (!showInfo()) return;\r\n const target = e.target as Node;\r\n if (!infoPopupRef?.contains(target) && !infoBtnRef?.contains(target)) {\r\n setShowInfo(false);\r\n }\r\n };\r\n\r\n const preventScroll = (e: WheelEvent) => e.preventDefault();\r\n backdropRef.addEventListener('wheel', preventScroll, { passive: false });\r\n boxRef.addEventListener('wheel', onWheel, { passive: false });\r\n document.addEventListener('pointerdown', onDocPointerDown);\r\n document.addEventListener('keydown', onKeyDown, { capture: true });\r\n\r\n onCleanup(function removePreviewEventListeners() {\r\n backdropRef.removeEventListener('wheel', preventScroll);\r\n boxRef.removeEventListener('wheel', onWheel);\r\n document.removeEventListener('pointerdown', onDocPointerDown);\r\n document.removeEventListener('keydown', onKeyDown, { capture: true });\r\n });\r\n });\r\n\r\n const hasInfo = () => !!(p.imageName || p.size || p.createdAt || p.modifiedAt);\r\n\r\n return (\r\n <ZIndex\r\n open={true}\r\n type={ZIndexType.MODAL}\r\n blockScroll={true}\r\n positioning=\"fixed\"\r\n preRender={false}\r\n customValue={p.zIndex}\r\n class=\"inset-0\"\r\n >\r\n <div\r\n ref={backdropRef}\r\n class={cn('img01', p.class?.backdrop)}\r\n onClick={p.closeOnBackdrop ? p.onClose : undefined}\r\n >\r\n <button class={cn('img02', p.class?.close)} onClick={p.onClose}>\r\n <X size={20} />\r\n </button>\r\n\r\n <div\r\n ref={boxRef}\r\n class={cn(\r\n 'img03',\r\n canPan() && (isDragging() ? 'cursor-grabbing' : 'cursor-grab'),\r\n p.class?.box,\r\n )}\r\n onClick={e => e.stopPropagation()}\r\n onPointerDown={onPointerDown}\r\n onPointerMove={onPointerMove}\r\n onPointerUp={onPointerUp}\r\n onPointerCancel={onPointerUp}\r\n >\r\n <img\r\n src={p.src}\r\n alt={p.imageName}\r\n class={cn('img04', isDragging() && 'img04--drag', p.class?.img)}\r\n style={{ transform: imgTransform() }}\r\n draggable={false}\r\n onLoad={e => {\r\n const img = e.currentTarget as HTMLImageElement;\r\n setNaturalSize({ w: img.naturalWidth, h: img.naturalHeight });\r\n }}\r\n />\r\n </div>\r\n\r\n <div class={cn('img05', p.class?.toolbar)} onClick={e => e.stopPropagation()}>\r\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipV} title=\"Lật dọc\">\r\n <FlipVertical2 size={16} />\r\n </button>\r\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipH} title=\"Lật ngang\">\r\n <FlipHorizontal2 size={16} />\r\n </button>\r\n <div class=\"img07\" />\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={rotateCcw}\r\n title=\"Xoay ngược chiều kim đồng hồ\"\r\n >\r\n <RotateCcw size={16} />\r\n </button>\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={rotateCw}\r\n title=\"Xoay thuận chiều kim đồng hồ\"\r\n >\r\n <RotateCw size={16} />\r\n </button>\r\n <div class=\"img07\" />\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={zoomOut}\r\n title=\"Thu nhỏ\"\r\n disabled={scale() <= ZOOM_MIN}\r\n >\r\n <ZoomOut size={16} />\r\n </button>\r\n <span class={cn('img08', p.class?.zoomLabel)}>{Math.round(scale() * 100)}%</span>\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={zoomIn}\r\n title=\"Phóng to\"\r\n disabled={scale() >= ZOOM_MAX}\r\n >\r\n <ZoomIn size={16} />\r\n </button>\r\n <div class=\"img07\" />\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={resetView}\r\n title=\"Reset về 100%\"\r\n disabled={scale() === 1 && rotate() === 0 && !flipH() && !flipV()}\r\n >\r\n <Maximize2 size={16} />\r\n </button>\r\n\r\n <Show when={hasInfo()}>\r\n <div class=\"img07\" />\r\n <div class=\"relative\">\r\n <button\r\n ref={infoBtnRef}\r\n class={cn('img06', showInfo() && 'bg-white/20 text-white', p.class?.toolBtn)}\r\n onClick={() => setShowInfo(v => !v)}\r\n title=\"Thông tin ảnh\"\r\n >\r\n <Info size={16} />\r\n </button>\r\n\r\n <Show when={showInfo()}>\r\n <div ref={infoPopupRef} class={cn('img09', p.class?.infoPopup)}>\r\n <p class=\"mb-2 text-xs font-semibold tracking-wide text-white/50 uppercase\">\r\n Thông tin ảnh\r\n </p>\r\n <div class=\"flex flex-col gap-1.5 text-xs\">\r\n <InfoRow label=\"Tên file\" value={p.imageName} />\r\n <InfoRow label=\"Kích thước\" value={p.size} />\r\n <InfoRow\r\n label=\"Dimension\"\r\n value={\r\n naturalSize() ? `${naturalSize()!.w} × ${naturalSize()!.h} px` : undefined\r\n }\r\n />\r\n <InfoRow label=\"Ngày tạo\" value={formatDate(p.createdAt)} />\r\n <InfoRow label=\"Ngày sửa\" value={formatDate(p.modifiedAt)} />\r\n </div>\r\n </div>\r\n </Show>\r\n </div>\r\n </Show>\r\n </div>\r\n </div>\r\n </ZIndex>\r\n );\r\n}\r\n"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/image-preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/indicator/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"indicator.d.ts","sourceRoot":"","sources":["../../../src/components/indicator/indicator.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAoB,MAAM,UAAU,CAAC;AACvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAwBxD,eAAO,MAAM,SAAS,EAAE,SAAS,CAAC,cAAc,CAsB/C,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../../utils/cn.js";import{getColor as t}from"../../utils/helper.js";import{className as n,createComponent as r,effect as i,insert as a,setStyleProperty as o,template as s}from"solid-js/web";import{Show as c,mergeProps as l}from"solid-js";var u=s(`<span>`),d=s(`<div>`),f={count:0,showExact:!1,color:`error`,top:0,right:0};function p(e,t){return e>99&&!t?`99+`:String(e)}function m(e){return e.length>2}function h(e){return typeof e==`number`?`${e}px`:e}var g=s=>{let g=l(f,s),_=()=>p(g.count,g.showExact),v=()=>m(_());return(()=>{var s=d();return a(s,()=>g.children,null),a(s,r(c,{get when(){return g.count>0},get children(){var r=u();return a(r,_),i(i=>{var a=e(`in02`,v()?`in04`:`in03`,t(g.color),g.class?.badge),s=h(g.top),c=h(g.right);return a!==i.e&&n(r,i.e=a),s!==i.t&&o(r,`--in-top`,i.t=s),c!==i.a&&o(r,`--in-right`,i.a=c),i},{e:void 0,t:void 0,a:void 0}),r}}),null),i(()=>n(s,e(`in01`,g.class?.root))),s})()};export{g as Indicator};
|
|
2
|
+
//# sourceMappingURL=indicator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"indicator.js","names":["cn","getColor","Component","mergeProps","Show","IndicatorProps","BaseColorProps","DEFAULT_PROPS","count","showExact","color","top","right","formatCount","String","isPill","text","length","toPx","value","Indicator","props","p","label","pill","_el$","_tmpl$2","_$insert","children","_$createComponent","when","_el$2","_tmpl$","_$effect","_p$","_v$","class","badge","_v$2","_v$3","e","_$className","t","_$setStyleProperty","a","undefined","root"],"sources":["../../../src/components/indicator/indicator.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { getColor } from '@utils/helper';\nimport { Component, mergeProps, Show } from 'solid-js';\nimport type { IndicatorProps } from './indicator.types';\nimport type { BaseColorProps } from '@/type';\n\nconst DEFAULT_PROPS = {\n count: 0,\n showExact: false,\n color: 'error' as BaseColorProps,\n top: 0,\n right: 0,\n};\n\nfunction formatCount(count: number, showExact: boolean): string {\n if (count > 99 && !showExact) return '99+';\n return String(count);\n}\n\nfunction isPill(text: string): boolean {\n return text.length > 2;\n}\n\nfunction toPx(value: number | string): string {\n return typeof value === 'number' ? `${value}px` : value;\n}\n\nexport const Indicator: Component<IndicatorProps> = props => {\n const p = mergeProps(DEFAULT_PROPS, props);\n\n const label = () => formatCount(p.count, p.showExact);\n const pill = () => isPill(label());\n\n return (\n <div class={cn('in01', p.class?.root)}>\n {p.children}\n <Show when={p.count > 0}>\n <span\n class={cn('in02', pill() ? 'in04' : 'in03', getColor(p.color), p.class?.badge)}\n style={{\n '--in-top': toPx(p.top),\n '--in-right': toPx(p.right),\n }}\n >\n {label()}\n </span>\n </Show>\n </div>\n );\n};\n"],"mappings":"iSAMMO,EAAgB,CACpBC,MAAO,EACPC,UAAW,GACXC,MAAO,QACPC,IAAK,EACLC,MAAO,EACR,CAED,SAASC,EAAYL,EAAeC,EAA4B,CAE9D,OADID,EAAQ,IAAM,CAACC,EAAkB,MAC9BK,OAAON,EAAM,CAGtB,SAASO,EAAOC,EAAuB,CACrC,OAAOA,EAAKC,OAAS,EAGvB,SAASC,EAAKC,EAAgC,CAC5C,OAAO,OAAOA,GAAU,SAAW,GAAGA,EAAK,IAAOA,EAGpD,IAAaC,EAAuCC,GAAS,CAC3D,IAAMC,EAAInB,EAAWI,EAAec,EAAM,CAEpCE,MAAcV,EAAYS,EAAEd,MAAOc,EAAEb,UAAU,CAC/Ce,MAAaT,EAAOQ,GAAO,CAAC,CAElC,WAAA,CAAA,IAAAE,EAAAC,GAAA,CACuC,OADvCC,EAAAF,MAEKH,EAAEM,SAAQ,KAAA,CAAAD,EAAAF,EAAAI,EACVzB,EAAI,CAAA,IAAC0B,MAAI,CAAA,OAAER,EAAEd,MAAQ,GAAC,IAAAoB,UAAA,CAAA,IAAAG,EAAAC,GAAA,CAKU,OALVL,EAAAI,EAQlBR,EAAK,CAAAU,EAAAC,GAAA,CAAA,IAAAC,EANCnC,EAAG,OAAQwB,GAAM,CAAG,OAAS,OAAQvB,EAASqB,EAAEZ,MAAM,CAAEY,EAAEc,OAAOC,MAAM,CAAAC,EAEhEpB,EAAKI,EAAEX,IAAI,CAAA4B,EACTrB,EAAKI,EAAEV,MAAM,CAAA,OAAAuB,IAAAD,EAAAM,GAAAC,EAAAV,EAAAG,EAAAM,EAAAL,EAAA,CAAAG,IAAAJ,EAAAQ,GAAAC,EAAAZ,EAAA,WAAAG,EAAAQ,EAAAJ,EAAA,CAAAC,IAAAL,EAAAU,GAAAD,EAAAZ,EAAA,aAAAG,EAAAU,EAAAL,EAAA,CAAAL,GAAA,CAAAM,EAAAK,IAAAA,GAAAH,EAAAG,IAAAA,GAAAD,EAAAC,IAAAA,GAAA,CAAA,CAAAd,GAAA,CAAA,CAAA,KAAA,CAAAE,MAAAQ,EAAAhB,EAPvBzB,EAAG,OAAQsB,EAAEc,OAAOU,KAAK,CAAA,CAAA,CAAArB,KAAA"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { BaseColorProps } from '../../type';
|
|
2
|
+
export interface IndicatorProps {
|
|
3
|
+
/** Số thông báo cần hiển thị */
|
|
4
|
+
count?: number;
|
|
5
|
+
/** Hiển thị chính xác số lớn thay vì cắt ngắn thành 99+ (mặc định: false) */
|
|
6
|
+
showExact?: boolean;
|
|
7
|
+
/** Màu sắc của badge (mặc định: 'error') */
|
|
8
|
+
color?: BaseColorProps;
|
|
9
|
+
/** Vị trí top tính từ góc (mặc định: 0) */
|
|
10
|
+
top?: number | string;
|
|
11
|
+
/** Vị trí right tính từ góc (mặc định: 0) */
|
|
12
|
+
right?: number | string;
|
|
13
|
+
/** Tùy chỉnh class cho từng slot */
|
|
14
|
+
class?: Partial<Record<'root' | 'badge', string>>;
|
|
15
|
+
/** Nội dung bên trong (element cha cần position: relative) */
|
|
16
|
+
children?: import('solid-js').JSX.Element;
|
|
17
|
+
}
|
|
18
|
+
//# sourceMappingURL=indicator.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"indicator.types.d.ts","sourceRoot":"","sources":["../../../src/components/indicator/indicator.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAE7C,MAAM,WAAW,cAAc;IAC7B,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6EAA6E;IAC7E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,oCAAoC;IACpC,KAAK,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,GAAG,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;IAClD,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,OAAO,UAAU,EAAE,GAAG,CAAC,OAAO,CAAC;CAC3C"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Component } from 'solid-js';
|
|
2
|
+
import { InputColorProps, InputDateProps, InputNumberProps, InputOTPProps, InputPasswordProps, InputRangeProps, InputTextAreaProps, InputTextProps } from './input.types';
|
|
3
|
+
import { InputRadioProps } from './variants/input-radio';
|
|
4
|
+
type InputProps = InputTextProps | InputColorProps | InputDateProps | InputNumberProps | InputPasswordProps | InputRangeProps | InputTextAreaProps | InputOTPProps | InputRadioProps;
|
|
5
|
+
export declare const Input: Component<InputProps> & {
|
|
6
|
+
Text: Component<InputTextProps>;
|
|
7
|
+
TextArea: Component<InputTextAreaProps>;
|
|
8
|
+
Color: Component<InputColorProps>;
|
|
9
|
+
Date: Component<InputDateProps>;
|
|
10
|
+
Number: Component<InputNumberProps>;
|
|
11
|
+
Password: Component<InputPasswordProps>;
|
|
12
|
+
Range: Component<InputRangeProps>;
|
|
13
|
+
OTP: Component<InputOTPProps>;
|
|
14
|
+
Radio: Component<InputRadioProps>;
|
|
15
|
+
};
|
|
16
|
+
export type { InputVariantsProps, TextAreaVariantsProps } from './input.utils';
|
|
17
|
+
//# sourceMappingURL=input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAwB,MAAM,UAAU,CAAC;AAC3D,OAAO,KAAK,EACV,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,aAAa,EACb,kBAAkB,EAClB,eAAe,EACf,kBAAkB,EAClB,cAAc,EACf,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAyBzD,KAAK,UAAU,GACX,cAAc,GACd,eAAe,GACf,cAAc,GACd,gBAAgB,GAChB,kBAAkB,GAClB,eAAe,GACf,kBAAkB,GAClB,aAAa,GACb,eAAe,CAAC;AAEpB,eAAO,MAAM,KAAK,EAAE,SAAS,CAAC,UAAU,CAAC,GAAG;IAC1C,IAAI,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IAChC,QAAQ,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;IACxC,KAAK,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IAClC,IAAI,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IAChC,MAAM,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACpC,QAAQ,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;IACxC,KAAK,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IAClC,GAAG,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IAC9B,KAAK,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;CAgCnC,CAAC;AAWF,YAAY,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC"}
|