@studio-helga/once-ui-core 1.7.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +54 -0
- package/dist/README.md +54 -0
- package/dist/components/Accordion.d.ts +25 -0
- package/dist/components/Accordion.d.ts.map +1 -0
- package/dist/components/Accordion.js +75 -0
- package/dist/components/Accordion.js.map +1 -0
- package/dist/components/Accordion.module.scss +5 -0
- package/dist/components/AccordionGroup.d.ts +16 -0
- package/dist/components/AccordionGroup.d.ts.map +1 -0
- package/dist/components/AccordionGroup.js +27 -0
- package/dist/components/AccordionGroup.js.map +1 -0
- package/dist/components/Animation.d.ts +34 -0
- package/dist/components/Animation.d.ts.map +1 -0
- package/dist/components/Animation.js +230 -0
- package/dist/components/Animation.js.map +1 -0
- package/dist/components/Arrow.d.ts +11 -0
- package/dist/components/Arrow.d.ts.map +1 -0
- package/dist/components/Arrow.js +33 -0
- package/dist/components/Arrow.js.map +1 -0
- package/dist/components/Arrow.module.scss +39 -0
- package/dist/components/ArrowNavigationContext.d.ts +33 -0
- package/dist/components/ArrowNavigationContext.d.ts.map +1 -0
- package/dist/components/ArrowNavigationContext.js +60 -0
- package/dist/components/ArrowNavigationContext.js.map +1 -0
- package/dist/components/AutoScroll.d.ts +14 -0
- package/dist/components/AutoScroll.d.ts.map +1 -0
- package/dist/components/AutoScroll.js +178 -0
- package/dist/components/AutoScroll.js.map +1 -0
- package/dist/components/AutoScroll.module.scss +9 -0
- package/dist/components/Avatar.d.ts +21 -0
- package/dist/components/Avatar.d.ts.map +1 -0
- package/dist/components/Avatar.js +54 -0
- package/dist/components/Avatar.js.map +1 -0
- package/dist/components/Avatar.module.scss +56 -0
- package/dist/components/AvatarGroup.d.ts +14 -0
- package/dist/components/AvatarGroup.d.ts.map +1 -0
- package/dist/components/AvatarGroup.js +20 -0
- package/dist/components/AvatarGroup.js.map +1 -0
- package/dist/components/AvatarGroup.module.scss +11 -0
- package/dist/components/Background.d.ts +49 -0
- package/dist/components/Background.d.ts.map +1 -0
- package/dist/components/Background.js +72 -0
- package/dist/components/Background.js.map +1 -0
- package/dist/components/Background.module.scss +23 -0
- package/dist/components/Badge.d.ts +17 -0
- package/dist/components/Badge.d.ts.map +1 -0
- package/dist/components/Badge.js +21 -0
- package/dist/components/Badge.js.map +1 -0
- package/dist/components/Badge.module.scss +67 -0
- package/dist/components/Banner.d.ts +6 -0
- package/dist/components/Banner.d.ts.map +1 -0
- package/dist/components/Banner.js +7 -0
- package/dist/components/Banner.js.map +1 -0
- package/dist/components/BlobFx.d.ts +8 -0
- package/dist/components/BlobFx.d.ts.map +1 -0
- package/dist/components/BlobFx.js +82 -0
- package/dist/components/BlobFx.js.map +1 -0
- package/dist/components/BlockQuote.d.ts +21 -0
- package/dist/components/BlockQuote.d.ts.map +1 -0
- package/dist/components/BlockQuote.js +10 -0
- package/dist/components/BlockQuote.js.map +1 -0
- package/dist/components/Button.d.ts +27 -0
- package/dist/components/Button.d.ts.map +1 -0
- package/dist/components/Button.js +25 -0
- package/dist/components/Button.js.map +1 -0
- package/dist/components/Button.module.scss +154 -0
- package/dist/components/Card.d.ts +13 -0
- package/dist/components/Card.d.ts.map +1 -0
- package/dist/components/Card.js +13 -0
- package/dist/components/Card.js.map +1 -0
- package/dist/components/Card.module.scss +7 -0
- package/dist/components/Carousel.d.ts +32 -0
- package/dist/components/Carousel.d.ts.map +1 -0
- package/dist/components/Carousel.js +156 -0
- package/dist/components/Carousel.js.map +1 -0
- package/dist/components/Carousel.module.scss +48 -0
- package/dist/components/CelebrationFx.d.ts +17 -0
- package/dist/components/CelebrationFx.d.ts.map +1 -0
- package/dist/components/CelebrationFx.js +314 -0
- package/dist/components/CelebrationFx.js.map +1 -0
- package/dist/components/Checkbox.d.ts +11 -0
- package/dist/components/Checkbox.d.ts.map +1 -0
- package/dist/components/Checkbox.js +56 -0
- package/dist/components/Checkbox.js.map +1 -0
- package/dist/components/Chip.d.ts +17 -0
- package/dist/components/Chip.d.ts.map +1 -0
- package/dist/components/Chip.js +43 -0
- package/dist/components/Chip.js.map +1 -0
- package/dist/components/Chip.module.scss +39 -0
- package/dist/components/ClientFlex.d.ts +13 -0
- package/dist/components/ClientFlex.d.ts.map +1 -0
- package/dist/components/ClientFlex.js +110 -0
- package/dist/components/ClientFlex.js.map +1 -0
- package/dist/components/ClientGrid.d.ts +13 -0
- package/dist/components/ClientGrid.d.ts.map +1 -0
- package/dist/components/ClientGrid.js +110 -0
- package/dist/components/ClientGrid.js.map +1 -0
- package/dist/components/ColorInput.d.ts +11 -0
- package/dist/components/ColorInput.d.ts.map +1 -0
- package/dist/components/ColorInput.js +78 -0
- package/dist/components/ColorInput.js.map +1 -0
- package/dist/components/Column.d.ts +7 -0
- package/dist/components/Column.d.ts.map +1 -0
- package/dist/components/Column.js +10 -0
- package/dist/components/Column.js.map +1 -0
- package/dist/components/CompareImage.d.ts +16 -0
- package/dist/components/CompareImage.d.ts.map +1 -0
- package/dist/components/CompareImage.js +58 -0
- package/dist/components/CompareImage.js.map +1 -0
- package/dist/components/CompareImage.module.scss +14 -0
- package/dist/components/ContextMenu.d.ts +22 -0
- package/dist/components/ContextMenu.d.ts.map +1 -0
- package/dist/components/ContextMenu.js +224 -0
- package/dist/components/ContextMenu.js.map +1 -0
- package/dist/components/ContextMenu.module.scss +15 -0
- package/dist/components/CountFx.d.ts +15 -0
- package/dist/components/CountFx.d.ts.map +1 -0
- package/dist/components/CountFx.js +203 -0
- package/dist/components/CountFx.js.map +1 -0
- package/dist/components/CountdownFx.d.ts +11 -0
- package/dist/components/CountdownFx.d.ts.map +1 -0
- package/dist/components/CountdownFx.js +49 -0
- package/dist/components/CountdownFx.js.map +1 -0
- package/dist/components/Cursor.d.ts +8 -0
- package/dist/components/Cursor.d.ts.map +1 -0
- package/dist/components/Cursor.js +79 -0
- package/dist/components/Cursor.js.map +1 -0
- package/dist/components/CursorCard.d.ts +13 -0
- package/dist/components/CursorCard.d.ts.map +1 -0
- package/dist/components/CursorCard.js +63 -0
- package/dist/components/CursorCard.js.map +1 -0
- package/dist/components/CursorCard.module.scss +12 -0
- package/dist/components/DateInput.d.ts +18 -0
- package/dist/components/DateInput.d.ts.map +1 -0
- package/dist/components/DateInput.js +43 -0
- package/dist/components/DateInput.js.map +1 -0
- package/dist/components/DatePicker.d.ts +33 -0
- package/dist/components/DatePicker.d.ts.map +1 -0
- package/dist/components/DatePicker.js +487 -0
- package/dist/components/DatePicker.js.map +1 -0
- package/dist/components/DatePicker.module.scss +194 -0
- package/dist/components/DateRangeInput.d.ts +15 -0
- package/dist/components/DateRangeInput.d.ts.map +1 -0
- package/dist/components/DateRangeInput.js +45 -0
- package/dist/components/DateRangeInput.js.map +1 -0
- package/dist/components/DateRangePicker.d.ts +17 -0
- package/dist/components/DateRangePicker.d.ts.map +1 -0
- package/dist/components/DateRangePicker.js +78 -0
- package/dist/components/DateRangePicker.js.map +1 -0
- package/dist/components/Dialog.d.ts +21 -0
- package/dist/components/Dialog.d.ts.map +1 -0
- package/dist/components/Dialog.js +230 -0
- package/dist/components/Dialog.js.map +1 -0
- package/dist/components/Dialog.module.scss +33 -0
- package/dist/components/Dropdown.d.ts +13 -0
- package/dist/components/Dropdown.d.ts.map +1 -0
- package/dist/components/Dropdown.js +21 -0
- package/dist/components/Dropdown.js.map +1 -0
- package/dist/components/DropdownWrapper.d.ts +29 -0
- package/dist/components/DropdownWrapper.d.ts.map +1 -0
- package/dist/components/DropdownWrapper.js +505 -0
- package/dist/components/DropdownWrapper.js.map +1 -0
- package/dist/components/DropdownWrapper.module.scss +15 -0
- package/dist/components/ElementType.d.ts +14 -0
- package/dist/components/ElementType.d.ts.map +1 -0
- package/dist/components/ElementType.js +21 -0
- package/dist/components/ElementType.js.map +1 -0
- package/dist/components/EmojiPicker.d.ts +16 -0
- package/dist/components/EmojiPicker.d.ts.map +1 -0
- package/dist/components/EmojiPicker.js +178 -0
- package/dist/components/EmojiPicker.js.map +1 -0
- package/dist/components/EmojiPicker.module.scss +14 -0
- package/dist/components/EmojiPickerDropdown.d.ts +11 -0
- package/dist/components/EmojiPickerDropdown.d.ts.map +1 -0
- package/dist/components/EmojiPickerDropdown.js +14 -0
- package/dist/components/EmojiPickerDropdown.js.map +1 -0
- package/dist/components/Fade.d.ts +19 -0
- package/dist/components/Fade.d.ts.map +1 -0
- package/dist/components/Fade.js +43 -0
- package/dist/components/Fade.js.map +1 -0
- package/dist/components/Fade.module.scss +6 -0
- package/dist/components/FadingLettersFx.d.ts +15 -0
- package/dist/components/FadingLettersFx.d.ts.map +1 -0
- package/dist/components/FadingLettersFx.js +27 -0
- package/dist/components/FadingLettersFx.js.map +1 -0
- package/dist/components/FadingLettersFx.module.scss +71 -0
- package/dist/components/Feedback.d.ts +16 -0
- package/dist/components/Feedback.d.ts.map +1 -0
- package/dist/components/Feedback.js +16 -0
- package/dist/components/Feedback.js.map +1 -0
- package/dist/components/Flex.d.ts +11 -0
- package/dist/components/Flex.d.ts.map +1 -0
- package/dist/components/Flex.js +31 -0
- package/dist/components/Flex.js.map +1 -0
- package/dist/components/FlipFx.d.ts +17 -0
- package/dist/components/FlipFx.d.ts.map +1 -0
- package/dist/components/FlipFx.js +76 -0
- package/dist/components/FlipFx.js.map +1 -0
- package/dist/components/FocusTrap.d.ts +16 -0
- package/dist/components/FocusTrap.d.ts.map +1 -0
- package/dist/components/FocusTrap.js +87 -0
- package/dist/components/FocusTrap.js.map +1 -0
- package/dist/components/GlitchFx.d.ts +12 -0
- package/dist/components/GlitchFx.d.ts.map +1 -0
- package/dist/components/GlitchFx.js +41 -0
- package/dist/components/GlitchFx.js.map +1 -0
- package/dist/components/GlitchFx.module.scss +92 -0
- package/dist/components/Grid.d.ts +11 -0
- package/dist/components/Grid.d.ts.map +1 -0
- package/dist/components/Grid.js +32 -0
- package/dist/components/Grid.js.map +1 -0
- package/dist/components/Heading.d.ts +9 -0
- package/dist/components/Heading.d.ts.map +1 -0
- package/dist/components/Heading.js +50 -0
- package/dist/components/Heading.js.map +1 -0
- package/dist/components/HoloFx.d.ts +32 -0
- package/dist/components/HoloFx.d.ts.map +1 -0
- package/dist/components/HoloFx.js +90 -0
- package/dist/components/HoloFx.js.map +1 -0
- package/dist/components/HoloFx.module.scss +32 -0
- package/dist/components/Hover.d.ts +14 -0
- package/dist/components/Hover.d.ts.map +1 -0
- package/dist/components/Hover.js +99 -0
- package/dist/components/Hover.js.map +1 -0
- package/dist/components/Hover.module.scss +12 -0
- package/dist/components/HoverCard.d.ts +5 -0
- package/dist/components/HoverCard.d.ts.map +1 -0
- package/dist/components/HoverCard.js +10 -0
- package/dist/components/HoverCard.js.map +1 -0
- package/dist/components/HoverCard.module.scss +12 -0
- package/dist/components/Icon.d.ts +18 -0
- package/dist/components/Icon.d.ts.map +1 -0
- package/dist/components/Icon.js +35 -0
- package/dist/components/Icon.js.map +1 -0
- package/dist/components/Icon.module.scss +19 -0
- package/dist/components/IconButton.d.ts +23 -0
- package/dist/components/IconButton.d.ts.map +1 -0
- package/dist/components/IconButton.js +23 -0
- package/dist/components/IconButton.js.map +1 -0
- package/dist/components/IconButton.module.scss +34 -0
- package/dist/components/InfiniteScroll.d.ts +16 -0
- package/dist/components/InfiniteScroll.d.ts.map +1 -0
- package/dist/components/InfiniteScroll.js +52 -0
- package/dist/components/InfiniteScroll.js.map +1 -0
- package/dist/components/InlineCode.d.ts +10 -0
- package/dist/components/InlineCode.d.ts.map +1 -0
- package/dist/components/InlineCode.js +12 -0
- package/dist/components/InlineCode.js.map +1 -0
- package/dist/components/InlineCode.module.scss +5 -0
- package/dist/components/Input.d.ts +24 -0
- package/dist/components/Input.d.ts.map +1 -0
- package/dist/components/Input.js +82 -0
- package/dist/components/Input.js.map +1 -0
- package/dist/components/Input.module.scss +196 -0
- package/dist/components/InteractiveDetails.d.ts +15 -0
- package/dist/components/InteractiveDetails.d.ts.map +1 -0
- package/dist/components/InteractiveDetails.js +10 -0
- package/dist/components/InteractiveDetails.js.map +1 -0
- package/dist/components/Kbd.d.ts +12 -0
- package/dist/components/Kbd.d.ts.map +1 -0
- package/dist/components/Kbd.js +7 -0
- package/dist/components/Kbd.js.map +1 -0
- package/dist/components/LetterFx.d.ts +13 -0
- package/dist/components/LetterFx.d.ts.map +1 -0
- package/dist/components/LetterFx.js +80 -0
- package/dist/components/LetterFx.js.map +1 -0
- package/dist/components/Line.d.ts +9 -0
- package/dist/components/Line.d.ts.map +1 -0
- package/dist/components/Line.js +10 -0
- package/dist/components/Line.js.map +1 -0
- package/dist/components/List.d.ts +11 -0
- package/dist/components/List.d.ts.map +1 -0
- package/dist/components/List.js +13 -0
- package/dist/components/List.js.map +1 -0
- package/dist/components/List.module.scss +5 -0
- package/dist/components/ListItem.d.ts +10 -0
- package/dist/components/ListItem.d.ts.map +1 -0
- package/dist/components/ListItem.js +13 -0
- package/dist/components/ListItem.js.map +1 -0
- package/dist/components/Logo.d.ts +18 -0
- package/dist/components/Logo.d.ts.map +1 -0
- package/dist/components/Logo.js +99 -0
- package/dist/components/Logo.js.map +1 -0
- package/dist/components/LogoCloud.d.ts +14 -0
- package/dist/components/LogoCloud.d.ts.map +1 -0
- package/dist/components/LogoCloud.js +38 -0
- package/dist/components/LogoCloud.js.map +1 -0
- package/dist/components/LogoCloud.module.scss +42 -0
- package/dist/components/Mask.d.ts +15 -0
- package/dist/components/Mask.d.ts.map +1 -0
- package/dist/components/Mask.js +107 -0
- package/dist/components/Mask.js.map +1 -0
- package/dist/components/Mask.module.scss +8 -0
- package/dist/components/MasonryGrid.d.ts +22 -0
- package/dist/components/MasonryGrid.d.ts.map +1 -0
- package/dist/components/MasonryGrid.js +53 -0
- package/dist/components/MasonryGrid.js.map +1 -0
- package/dist/components/MasonryGrid.module.scss +199 -0
- package/dist/components/MatrixFx.d.ts +27 -0
- package/dist/components/MatrixFx.d.ts.map +1 -0
- package/dist/components/MatrixFx.js +799 -0
- package/dist/components/MatrixFx.js.map +1 -0
- package/dist/components/Media.d.ts +26 -0
- package/dist/components/Media.d.ts.map +1 -0
- package/dist/components/Media.js +112 -0
- package/dist/components/Media.js.map +1 -0
- package/dist/components/Modal.d.ts +11 -0
- package/dist/components/Modal.d.ts.map +1 -0
- package/dist/components/Modal.js +72 -0
- package/dist/components/Modal.js.map +1 -0
- package/dist/components/NavIcon.d.ts +11 -0
- package/dist/components/NavIcon.d.ts.map +1 -0
- package/dist/components/NavIcon.js +11 -0
- package/dist/components/NavIcon.js.map +1 -0
- package/dist/components/NavIcon.module.scss +25 -0
- package/dist/components/NumberInput.d.ts +13 -0
- package/dist/components/NumberInput.d.ts.map +1 -0
- package/dist/components/NumberInput.js +44 -0
- package/dist/components/NumberInput.js.map +1 -0
- package/dist/components/NumberInput.module.scss +18 -0
- package/dist/components/OTPInput.d.ts +13 -0
- package/dist/components/OTPInput.d.ts.map +1 -0
- package/dist/components/OTPInput.js +71 -0
- package/dist/components/OTPInput.js.map +1 -0
- package/dist/components/OTPInput.module.scss +26 -0
- package/dist/components/OgCard.d.ts +34 -0
- package/dist/components/OgCard.d.ts.map +1 -0
- package/dist/components/OgCard.js +102 -0
- package/dist/components/OgCard.js.map +1 -0
- package/dist/components/Option.d.ts +21 -0
- package/dist/components/Option.d.ts.map +1 -0
- package/dist/components/Option.js +93 -0
- package/dist/components/Option.js.map +1 -0
- package/dist/components/Option.module.scss +47 -0
- package/dist/components/Particle.d.ts +21 -0
- package/dist/components/Particle.d.ts.map +1 -0
- package/dist/components/Particle.js +140 -0
- package/dist/components/Particle.js.map +1 -0
- package/dist/components/PasswordInput.d.ts +4 -0
- package/dist/components/PasswordInput.d.ts.map +1 -0
- package/dist/components/PasswordInput.js +12 -0
- package/dist/components/PasswordInput.js.map +1 -0
- package/dist/components/ProgressBar.d.ts +15 -0
- package/dist/components/ProgressBar.d.ts.map +1 -0
- package/dist/components/ProgressBar.js +12 -0
- package/dist/components/ProgressBar.js.map +1 -0
- package/dist/components/Pulse.d.ts +13 -0
- package/dist/components/Pulse.d.ts.map +1 -0
- package/dist/components/Pulse.js +11 -0
- package/dist/components/Pulse.js.map +1 -0
- package/dist/components/Pulse.module.scss +22 -0
- package/dist/components/RadioButton.d.ts +15 -0
- package/dist/components/RadioButton.d.ts.map +1 -0
- package/dist/components/RadioButton.js +45 -0
- package/dist/components/RadioButton.js.map +1 -0
- package/dist/components/RevealFx.d.ts +16 -0
- package/dist/components/RevealFx.d.ts.map +1 -0
- package/dist/components/RevealFx.js +83 -0
- package/dist/components/RevealFx.js.map +1 -0
- package/dist/components/RevealFx.module.scss +27 -0
- package/dist/components/Row.d.ts +7 -0
- package/dist/components/Row.d.ts.map +1 -0
- package/dist/components/Row.js +10 -0
- package/dist/components/Row.js.map +1 -0
- package/dist/components/ScrollContainer.d.ts +9 -0
- package/dist/components/ScrollContainer.d.ts.map +1 -0
- package/dist/components/ScrollContainer.js +67 -0
- package/dist/components/ScrollContainer.js.map +1 -0
- package/dist/components/ScrollLock.d.ts +8 -0
- package/dist/components/ScrollLock.d.ts.map +1 -0
- package/dist/components/ScrollLock.js +112 -0
- package/dist/components/ScrollLock.js.map +1 -0
- package/dist/components/ScrollToTop.d.ts +7 -0
- package/dist/components/ScrollToTop.d.ts.map +1 -0
- package/dist/components/ScrollToTop.js +24 -0
- package/dist/components/ScrollToTop.js.map +1 -0
- package/dist/components/ScrollToTop.module.scss +11 -0
- package/dist/components/Scroller.d.ts +14 -0
- package/dist/components/Scroller.d.ts.map +1 -0
- package/dist/components/Scroller.js +100 -0
- package/dist/components/Scroller.js.map +1 -0
- package/dist/components/Scroller.module.scss +20 -0
- package/dist/components/SegmentedControl.d.ts +18 -0
- package/dist/components/SegmentedControl.d.ts.map +1 -0
- package/dist/components/SegmentedControl.js +70 -0
- package/dist/components/SegmentedControl.js.map +1 -0
- package/dist/components/Select.d.ts +19 -0
- package/dist/components/Select.d.ts.map +1 -0
- package/dist/components/Select.js +170 -0
- package/dist/components/Select.js.map +1 -0
- package/dist/components/ServerFlex.d.ts +12 -0
- package/dist/components/ServerFlex.d.ts.map +1 -0
- package/dist/components/ServerFlex.js +282 -0
- package/dist/components/ServerFlex.js.map +1 -0
- package/dist/components/ServerGrid.d.ts +13 -0
- package/dist/components/ServerGrid.d.ts.map +1 -0
- package/dist/components/ServerGrid.js +207 -0
- package/dist/components/ServerGrid.js.map +1 -0
- package/dist/components/SharedInteractiveStyles.module.scss +91 -0
- package/dist/components/ShineFx.d.ts +13 -0
- package/dist/components/ShineFx.d.ts.map +1 -0
- package/dist/components/ShineFx.js +19 -0
- package/dist/components/ShineFx.js.map +1 -0
- package/dist/components/ShineFx.module.scss +50 -0
- package/dist/components/Skeleton.d.ts +13 -0
- package/dist/components/Skeleton.d.ts.map +1 -0
- package/dist/components/Skeleton.js +12 -0
- package/dist/components/Skeleton.js.map +1 -0
- package/dist/components/Skeleton.module.scss +120 -0
- package/dist/components/Slider.d.ts +17 -0
- package/dist/components/Slider.d.ts.map +1 -0
- package/dist/components/Slider.js +29 -0
- package/dist/components/Slider.js.map +1 -0
- package/dist/components/Slider.module.scss +75 -0
- package/dist/components/SmartLink.d.ts +18 -0
- package/dist/components/SmartLink.d.ts.map +1 -0
- package/dist/components/SmartLink.js +36 -0
- package/dist/components/SmartLink.js.map +1 -0
- package/dist/components/Spinner.d.ts +11 -0
- package/dist/components/Spinner.d.ts.map +1 -0
- package/dist/components/Spinner.js +11 -0
- package/dist/components/Spinner.js.map +1 -0
- package/dist/components/Spinner.module.scss +71 -0
- package/dist/components/SplitView.d.ts +16 -0
- package/dist/components/SplitView.d.ts.map +1 -0
- package/dist/components/SplitView.js +80 -0
- package/dist/components/SplitView.js.map +1 -0
- package/dist/components/SplitView.module.scss +18 -0
- package/dist/components/StatusIndicator.d.ts +12 -0
- package/dist/components/StatusIndicator.d.ts.map +1 -0
- package/dist/components/StatusIndicator.js +11 -0
- package/dist/components/StatusIndicator.js.map +1 -0
- package/dist/components/StatusIndicator.module.scss +72 -0
- package/dist/components/StyleOverlay.d.ts +10 -0
- package/dist/components/StyleOverlay.d.ts.map +1 -0
- package/dist/components/StyleOverlay.js +17 -0
- package/dist/components/StyleOverlay.js.map +1 -0
- package/dist/components/StyleOverlay.module.scss +18 -0
- package/dist/components/StylePanel.d.ts +8 -0
- package/dist/components/StylePanel.d.ts.map +1 -0
- package/dist/components/StylePanel.js +193 -0
- package/dist/components/StylePanel.js.map +1 -0
- package/dist/components/StylePanel.module.scss +127 -0
- package/dist/components/Swiper.d.ts +17 -0
- package/dist/components/Swiper.d.ts.map +1 -0
- package/dist/components/Swiper.js +170 -0
- package/dist/components/Swiper.js.map +1 -0
- package/dist/components/Swiper.module.scss +31 -0
- package/dist/components/Switch.d.ts +17 -0
- package/dist/components/Switch.d.ts.map +1 -0
- package/dist/components/Switch.js +33 -0
- package/dist/components/Switch.js.map +1 -0
- package/dist/components/Switch.module.scss +102 -0
- package/dist/components/Table.d.ts +16 -0
- package/dist/components/Table.d.ts.map +1 -0
- package/dist/components/Table.js +44 -0
- package/dist/components/Table.js.map +1 -0
- package/dist/components/Table.module.scss +5 -0
- package/dist/components/Tag.d.ts +16 -0
- package/dist/components/Tag.d.ts.map +1 -0
- package/dist/components/Tag.js +14 -0
- package/dist/components/Tag.js.map +1 -0
- package/dist/components/Tag.module.scss +10 -0
- package/dist/components/TagInput.d.ts +9 -0
- package/dist/components/TagInput.d.ts.map +1 -0
- package/dist/components/TagInput.js +36 -0
- package/dist/components/TagInput.js.map +1 -0
- package/dist/components/Text.d.ts +9 -0
- package/dist/components/Text.d.ts.map +1 -0
- package/dist/components/Text.js +50 -0
- package/dist/components/Text.js.map +1 -0
- package/dist/components/Textarea.d.ts +24 -0
- package/dist/components/Textarea.d.ts.map +1 -0
- package/dist/components/Textarea.js +109 -0
- package/dist/components/Textarea.js.map +1 -0
- package/dist/components/ThemeInit.d.ts +20 -0
- package/dist/components/ThemeInit.d.ts.map +1 -0
- package/dist/components/ThemeInit.js +46 -0
- package/dist/components/ThemeInit.js.map +1 -0
- package/dist/components/ThemeSwitcher.d.ts +4 -0
- package/dist/components/ThemeSwitcher.d.ts.map +1 -0
- package/dist/components/ThemeSwitcher.js +21 -0
- package/dist/components/ThemeSwitcher.js.map +1 -0
- package/dist/components/TiltFx.d.ts +10 -0
- package/dist/components/TiltFx.d.ts.map +1 -0
- package/dist/components/TiltFx.js +67 -0
- package/dist/components/TiltFx.js.map +1 -0
- package/dist/components/TiltFx.module.scss +11 -0
- package/dist/components/Timeline.d.ts +18 -0
- package/dist/components/Timeline.d.ts.map +1 -0
- package/dist/components/Timeline.js +72 -0
- package/dist/components/Timeline.js.map +1 -0
- package/dist/components/Toast.d.ts +12 -0
- package/dist/components/Toast.d.ts.map +1 -0
- package/dist/components/Toast.js +29 -0
- package/dist/components/Toast.js.map +1 -0
- package/dist/components/Toast.module.scss +11 -0
- package/dist/components/Toaster.d.ts +19 -0
- package/dist/components/Toaster.d.ts.map +1 -0
- package/dist/components/Toaster.js +47 -0
- package/dist/components/Toaster.js.map +1 -0
- package/dist/components/Toaster.module.scss +58 -0
- package/dist/components/ToggleButton.d.ts +25 -0
- package/dist/components/ToggleButton.d.ts.map +1 -0
- package/dist/components/ToggleButton.js +20 -0
- package/dist/components/ToggleButton.js.map +1 -0
- package/dist/components/ToggleButton.module.scss +73 -0
- package/dist/components/Tooltip.d.ts +13 -0
- package/dist/components/Tooltip.d.ts.map +1 -0
- package/dist/components/Tooltip.js +15 -0
- package/dist/components/Tooltip.js.map +1 -0
- package/dist/components/Tooltip.module.scss +14 -0
- package/dist/components/TypeFx.d.ts +15 -0
- package/dist/components/TypeFx.d.ts.map +1 -0
- package/dist/components/TypeFx.js +84 -0
- package/dist/components/TypeFx.js.map +1 -0
- package/dist/components/User.d.ts +16 -0
- package/dist/components/User.d.ts.map +1 -0
- package/dist/components/User.js +13 -0
- package/dist/components/User.js.map +1 -0
- package/dist/components/UserMenu.d.ts +13 -0
- package/dist/components/UserMenu.d.ts.map +1 -0
- package/dist/components/UserMenu.js +13 -0
- package/dist/components/UserMenu.js.map +1 -0
- package/dist/components/UserMenu.module.scss +14 -0
- package/dist/components/WeatherFx.d.ts +18 -0
- package/dist/components/WeatherFx.d.ts.map +1 -0
- package/dist/components/WeatherFx.js +864 -0
- package/dist/components/WeatherFx.js.map +1 -0
- package/dist/components/index.d.ts +121 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/index.js +121 -0
- package/dist/components/index.js.map +1 -0
- package/dist/contexts/DataThemeProvider.d.ts +26 -0
- package/dist/contexts/DataThemeProvider.d.ts.map +1 -0
- package/dist/contexts/DataThemeProvider.js +103 -0
- package/dist/contexts/DataThemeProvider.js.map +1 -0
- package/dist/contexts/IconProvider.d.ts +12 -0
- package/dist/contexts/IconProvider.d.ts.map +1 -0
- package/dist/contexts/IconProvider.js +20 -0
- package/dist/contexts/IconProvider.js.map +1 -0
- package/dist/contexts/LayoutProvider.d.ts +27 -0
- package/dist/contexts/LayoutProvider.d.ts.map +1 -0
- package/dist/contexts/LayoutProvider.js +96 -0
- package/dist/contexts/LayoutProvider.js.map +1 -0
- package/dist/contexts/ThemeProvider.d.ts +49 -0
- package/dist/contexts/ThemeProvider.d.ts.map +1 -0
- package/dist/contexts/ThemeProvider.js +285 -0
- package/dist/contexts/ThemeProvider.js.map +1 -0
- package/dist/contexts/ToastProvider.d.ts +24 -0
- package/dist/contexts/ToastProvider.d.ts.map +1 -0
- package/dist/contexts/ToastProvider.js +34 -0
- package/dist/contexts/ToastProvider.js.map +1 -0
- package/dist/contexts/index.d.ts +6 -0
- package/dist/contexts/index.d.ts.map +1 -0
- package/dist/contexts/index.js +6 -0
- package/dist/contexts/index.js.map +1 -0
- package/dist/css/styles.css +1 -0
- package/dist/css/styles.css.map +1 -0
- package/dist/css/tokens.css +1 -0
- package/dist/css/tokens.css.map +1 -0
- package/dist/data/emoji-data.json +16062 -0
- package/dist/hooks/index.d.ts +8 -0
- package/dist/hooks/index.d.ts.map +1 -0
- package/dist/hooks/index.js +8 -0
- package/dist/hooks/index.js.map +1 -0
- package/dist/hooks/useArrowNavigation.d.ts +23 -0
- package/dist/hooks/useArrowNavigation.d.ts.map +1 -0
- package/dist/hooks/useArrowNavigation.js +205 -0
- package/dist/hooks/useArrowNavigation.js.map +1 -0
- package/dist/hooks/useDebounce.d.ts +2 -0
- package/dist/hooks/useDebounce.d.ts.map +1 -0
- package/dist/hooks/useDebounce.js +15 -0
- package/dist/hooks/useDebounce.js.map +1 -0
- package/dist/hooks/useFetchOg.d.ts +17 -0
- package/dist/hooks/useFetchOg.d.ts.map +1 -0
- package/dist/hooks/useFetchOg.js +63 -0
- package/dist/hooks/useFetchOg.js.map +1 -0
- package/dist/hooks/useHeadingLinks.d.ts +6 -0
- package/dist/hooks/useHeadingLinks.d.ts.map +1 -0
- package/dist/hooks/useHeadingLinks.js +17 -0
- package/dist/hooks/useHeadingLinks.js.map +1 -0
- package/dist/hooks/useInViewport.d.ts +3 -0
- package/dist/hooks/useInViewport.d.ts.map +1 -0
- package/dist/hooks/useInViewport.js +19 -0
- package/dist/hooks/useInViewport.js.map +1 -0
- package/dist/hooks/useReducedMotion.d.ts +8 -0
- package/dist/hooks/useReducedMotion.d.ts.map +1 -0
- package/dist/hooks/useReducedMotion.js +44 -0
- package/dist/hooks/useReducedMotion.js.map +1 -0
- package/dist/hooks/useResponsiveClasses.d.ts +9 -0
- package/dist/hooks/useResponsiveClasses.d.ts.map +1 -0
- package/dist/hooks/useResponsiveClasses.js +250 -0
- package/dist/hooks/useResponsiveClasses.js.map +1 -0
- package/dist/hooks/useStreamingData.d.ts +24 -0
- package/dist/hooks/useStreamingData.d.ts.map +1 -0
- package/dist/hooks/useStreamingData.js +89 -0
- package/dist/hooks/useStreamingData.js.map +1 -0
- package/dist/hooks/useStreamingViewport.d.ts +25 -0
- package/dist/hooks/useStreamingViewport.d.ts.map +1 -0
- package/dist/hooks/useStreamingViewport.js +120 -0
- package/dist/hooks/useStreamingViewport.js.map +1 -0
- package/dist/icons.d.ts +5 -0
- package/dist/icons.d.ts.map +1 -0
- package/dist/icons.js +56 -0
- package/dist/icons.js.map +1 -0
- package/dist/index.d.ts +12 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +11 -0
- package/dist/index.js.map +1 -0
- package/dist/interfaces.d.ts +177 -0
- package/dist/interfaces.d.ts.map +1 -0
- package/dist/interfaces.js +2 -0
- package/dist/interfaces.js.map +1 -0
- package/dist/modules/code/CodeBlock.d.ts +6 -0
- package/dist/modules/code/CodeBlock.d.ts.map +1 -0
- package/dist/modules/code/CodeBlock.impl.d.ts +34 -0
- package/dist/modules/code/CodeBlock.impl.d.ts.map +1 -0
- package/dist/modules/code/CodeBlock.impl.js +497 -0
- package/dist/modules/code/CodeBlock.impl.js.map +1 -0
- package/dist/modules/code/CodeBlock.js +14 -0
- package/dist/modules/code/CodeBlock.js.map +1 -0
- package/dist/modules/code/CodeBlock.module.scss +43 -0
- package/dist/modules/code/CodeDiff.css +175 -0
- package/dist/modules/code/CodeHighlight.css +116 -0
- package/dist/modules/code/LineNumber.css +34 -0
- package/dist/modules/data/BarChart.d.ts +6 -0
- package/dist/modules/data/BarChart.d.ts.map +1 -0
- package/dist/modules/data/BarChart.impl.d.ts +12 -0
- package/dist/modules/data/BarChart.impl.d.ts.map +1 -0
- package/dist/modules/data/BarChart.impl.js +129 -0
- package/dist/modules/data/BarChart.impl.js.map +1 -0
- package/dist/modules/data/BarChart.js +14 -0
- package/dist/modules/data/BarChart.js.map +1 -0
- package/dist/modules/data/ChartHeader.d.ts +14 -0
- package/dist/modules/data/ChartHeader.d.ts.map +1 -0
- package/dist/modules/data/ChartHeader.js +116 -0
- package/dist/modules/data/ChartHeader.js.map +1 -0
- package/dist/modules/data/ChartStatus.d.ts +10 -0
- package/dist/modules/data/ChartStatus.d.ts.map +1 -0
- package/dist/modules/data/ChartStatus.js +10 -0
- package/dist/modules/data/ChartStatus.js.map +1 -0
- package/dist/modules/data/DataTooltip.d.ts +16 -0
- package/dist/modules/data/DataTooltip.d.ts.map +1 -0
- package/dist/modules/data/DataTooltip.js +16 -0
- package/dist/modules/data/DataTooltip.js.map +1 -0
- package/dist/modules/data/Gauge.module.css +27 -0
- package/dist/modules/data/Gradient.d.ts +32 -0
- package/dist/modules/data/Gradient.d.ts.map +1 -0
- package/dist/modules/data/Gradient.js +56 -0
- package/dist/modules/data/Gradient.js.map +1 -0
- package/dist/modules/data/Legend.d.ts +15 -0
- package/dist/modules/data/Legend.d.ts.map +1 -0
- package/dist/modules/data/Legend.js +69 -0
- package/dist/modules/data/Legend.js.map +1 -0
- package/dist/modules/data/LineBarChart.d.ts +6 -0
- package/dist/modules/data/LineBarChart.d.ts.map +1 -0
- package/dist/modules/data/LineBarChart.impl.d.ts +12 -0
- package/dist/modules/data/LineBarChart.impl.d.ts.map +1 -0
- package/dist/modules/data/LineBarChart.impl.js +124 -0
- package/dist/modules/data/LineBarChart.impl.js.map +1 -0
- package/dist/modules/data/LineBarChart.js +14 -0
- package/dist/modules/data/LineBarChart.js.map +1 -0
- package/dist/modules/data/LineChart.d.ts +6 -0
- package/dist/modules/data/LineChart.d.ts.map +1 -0
- package/dist/modules/data/LineChart.impl.d.ts +17 -0
- package/dist/modules/data/LineChart.impl.d.ts.map +1 -0
- package/dist/modules/data/LineChart.impl.js +137 -0
- package/dist/modules/data/LineChart.impl.js.map +1 -0
- package/dist/modules/data/LineChart.js +14 -0
- package/dist/modules/data/LineChart.js.map +1 -0
- package/dist/modules/data/LinearGauge.d.ts +18 -0
- package/dist/modules/data/LinearGauge.d.ts.map +1 -0
- package/dist/modules/data/LinearGauge.js +78 -0
- package/dist/modules/data/LinearGauge.js.map +1 -0
- package/dist/modules/data/PieChart.d.ts +6 -0
- package/dist/modules/data/PieChart.d.ts.map +1 -0
- package/dist/modules/data/PieChart.impl.d.ts +18 -0
- package/dist/modules/data/PieChart.impl.d.ts.map +1 -0
- package/dist/modules/data/PieChart.impl.js +100 -0
- package/dist/modules/data/PieChart.impl.js.map +1 -0
- package/dist/modules/data/PieChart.js +14 -0
- package/dist/modules/data/PieChart.js.map +1 -0
- package/dist/modules/data/RadialGauge.d.ts +25 -0
- package/dist/modules/data/RadialGauge.d.ts.map +1 -0
- package/dist/modules/data/RadialGauge.js +94 -0
- package/dist/modules/data/RadialGauge.js.map +1 -0
- package/dist/modules/data/Swatch.d.ts +9 -0
- package/dist/modules/data/Swatch.d.ts.map +1 -0
- package/dist/modules/data/Swatch.js +44 -0
- package/dist/modules/data/Swatch.js.map +1 -0
- package/dist/modules/data/index.d.ts +14 -0
- package/dist/modules/data/index.d.ts.map +1 -0
- package/dist/modules/data/index.js +14 -0
- package/dist/modules/data/index.js.map +1 -0
- package/dist/modules/data/interfaces.d.ts +53 -0
- package/dist/modules/data/interfaces.d.ts.map +1 -0
- package/dist/modules/data/interfaces.js +2 -0
- package/dist/modules/data/interfaces.js.map +1 -0
- package/dist/modules/data/rechartsLoader.d.ts +2 -0
- package/dist/modules/data/rechartsLoader.d.ts.map +1 -0
- package/dist/modules/data/rechartsLoader.js +15 -0
- package/dist/modules/data/rechartsLoader.js.map +1 -0
- package/dist/modules/data/utils/colorDistribution.d.ts +10 -0
- package/dist/modules/data/utils/colorDistribution.d.ts.map +1 -0
- package/dist/modules/data/utils/colorDistribution.js +46 -0
- package/dist/modules/data/utils/colorDistribution.js.map +1 -0
- package/dist/modules/data/utils/formatDate.d.ts +12 -0
- package/dist/modules/data/utils/formatDate.d.ts.map +1 -0
- package/dist/modules/data/utils/formatDate.js +30 -0
- package/dist/modules/data/utils/formatDate.js.map +1 -0
- package/dist/modules/index.d.ts +6 -0
- package/dist/modules/index.d.ts.map +1 -0
- package/dist/modules/index.js +7 -0
- package/dist/modules/index.js.map +1 -0
- package/dist/modules/media/MediaUpload.d.ts +6 -0
- package/dist/modules/media/MediaUpload.d.ts.map +1 -0
- package/dist/modules/media/MediaUpload.impl.d.ts +24 -0
- package/dist/modules/media/MediaUpload.impl.d.ts.map +1 -0
- package/dist/modules/media/MediaUpload.impl.js +106 -0
- package/dist/modules/media/MediaUpload.impl.js.map +1 -0
- package/dist/modules/media/MediaUpload.js +14 -0
- package/dist/modules/media/MediaUpload.js.map +1 -0
- package/dist/modules/media/MediaUpload.module.scss +24 -0
- package/dist/modules/navigation/HeadingLink.d.ts +11 -0
- package/dist/modules/navigation/HeadingLink.d.ts.map +1 -0
- package/dist/modules/navigation/HeadingLink.js +39 -0
- package/dist/modules/navigation/HeadingLink.js.map +1 -0
- package/dist/modules/navigation/HeadingLink.module.scss +15 -0
- package/dist/modules/navigation/HeadingNav.d.ts +8 -0
- package/dist/modules/navigation/HeadingNav.d.ts.map +1 -0
- package/dist/modules/navigation/HeadingNav.js +168 -0
- package/dist/modules/navigation/HeadingNav.js.map +1 -0
- package/dist/modules/navigation/Kbar.d.ts +34 -0
- package/dist/modules/navigation/Kbar.d.ts.map +1 -0
- package/dist/modules/navigation/Kbar.js +192 -0
- package/dist/modules/navigation/Kbar.js.map +1 -0
- package/dist/modules/navigation/Kbar.module.scss +60 -0
- package/dist/modules/navigation/MegaMenu.d.ts +28 -0
- package/dist/modules/navigation/MegaMenu.d.ts.map +1 -0
- package/dist/modules/navigation/MegaMenu.js +182 -0
- package/dist/modules/navigation/MegaMenu.js.map +1 -0
- package/dist/modules/navigation/MegaMenu.module.scss +14 -0
- package/dist/modules/navigation/MobileMegaMenu.d.ts +28 -0
- package/dist/modules/navigation/MobileMegaMenu.d.ts.map +1 -0
- package/dist/modules/navigation/MobileMegaMenu.js +22 -0
- package/dist/modules/navigation/MobileMegaMenu.js.map +1 -0
- package/dist/modules/navigation/index.d.ts +6 -0
- package/dist/modules/navigation/index.d.ts.map +1 -0
- package/dist/modules/navigation/index.js +6 -0
- package/dist/modules/navigation/index.js.map +1 -0
- package/dist/modules/seo/Meta.d.ts +29 -0
- package/dist/modules/seo/Meta.d.ts.map +1 -0
- package/dist/modules/seo/Meta.js +53 -0
- package/dist/modules/seo/Meta.js.map +1 -0
- package/dist/modules/seo/Schema.d.ts +19 -0
- package/dist/modules/seo/Schema.d.ts.map +1 -0
- package/dist/modules/seo/Schema.js +65 -0
- package/dist/modules/seo/Schema.js.map +1 -0
- package/dist/package.json +130 -0
- package/dist/server/index.d.ts +2 -0
- package/dist/server/index.d.ts.map +1 -0
- package/dist/server/index.js +2 -0
- package/dist/server/index.js.map +1 -0
- package/dist/server/og-utils.d.ts +20 -0
- package/dist/server/og-utils.d.ts.map +1 -0
- package/dist/server/og-utils.js +125 -0
- package/dist/server/og-utils.js.map +1 -0
- package/dist/styles/background.scss +423 -0
- package/dist/styles/border.scss +546 -0
- package/dist/styles/breakpoints.scss +28 -0
- package/dist/styles/color.scss +183 -0
- package/dist/styles/display.scss +391 -0
- package/dist/styles/flex.scss +518 -0
- package/dist/styles/global.scss +36 -0
- package/dist/styles/grid.scss +293 -0
- package/dist/styles/index.scss +14 -0
- package/dist/styles/position.scss +1549 -0
- package/dist/styles/shadow.scss +19 -0
- package/dist/styles/size.scss +53 -0
- package/dist/styles/spacing.scss +1505 -0
- package/dist/styles/typography.scss +215 -0
- package/dist/styles/utilities.scss +23 -0
- package/dist/test/dialogTestUtils.d.ts +2 -0
- package/dist/test/dialogTestUtils.d.ts.map +1 -0
- package/dist/test/dialogTestUtils.js +12 -0
- package/dist/test/dialogTestUtils.js.map +1 -0
- package/dist/test/setup.d.ts +2 -0
- package/dist/test/setup.d.ts.map +1 -0
- package/dist/test/setup.js +59 -0
- package/dist/test/setup.js.map +1 -0
- package/dist/tokens/border.scss +95 -0
- package/dist/tokens/data.scss +107 -0
- package/dist/tokens/function.scss +742 -0
- package/dist/tokens/index.scss +8 -0
- package/dist/tokens/layout.scss +275 -0
- package/dist/tokens/scheme.scss +352 -0
- package/dist/tokens/shadow.scss +7 -0
- package/dist/tokens/theme.scss +639 -0
- package/dist/tokens/typography.scss +116 -0
- package/dist/types.d.ts +25 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +16 -0
- package/dist/types.js.map +1 -0
- package/dist/utils/MissingDependency.d.ts +7 -0
- package/dist/utils/MissingDependency.d.ts.map +1 -0
- package/dist/utils/MissingDependency.js +6 -0
- package/dist/utils/MissingDependency.js.map +1 -0
- package/dist/utils/devLogger.d.ts +13 -0
- package/dist/utils/devLogger.d.ts.map +1 -0
- package/dist/utils/devLogger.js +34 -0
- package/dist/utils/devLogger.js.map +1 -0
- package/dist/utils/index.d.ts +3 -0
- package/dist/utils/index.d.ts.map +1 -0
- package/dist/utils/index.js +3 -0
- package/dist/utils/index.js.map +1 -0
- package/package.json +155 -0
package/README.md
ADDED
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
<br/>
|
|
2
|
+
|
|
3
|
+
<div align="center">
|
|
4
|
+
<picture>
|
|
5
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://docs.once-ui.com/trademarks/icon-dark.svg" width="64" height="64">
|
|
6
|
+
<source media="(prefers-color-scheme: light)" srcset="https://docs.once-ui.com/trademarks/icon-light.svg" width="64" height="64">
|
|
7
|
+
<img alt="Once UI Logo" src="https://docs.once-ui.com/trademarks/icon-dark.svg" width="64" height="64">
|
|
8
|
+
</picture><picture>
|
|
9
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://docs.once-ui.com/trademarks/type-dark.svg" width="200" height="64">
|
|
10
|
+
<source media="(prefers-color-scheme: light)" srcset="https://docs.once-ui.com/trademarks/type-light.svg" width="200" height="64">
|
|
11
|
+
<img alt="Once UI Wordmark" src="https://docs.once-ui.com/trademarks/type-dark.svg" width="200" height="64">
|
|
12
|
+
</picture>
|
|
13
|
+
|
|
14
|
+
<br/>
|
|
15
|
+
|
|
16
|
+
The indie design system for Next.js apps
|
|
17
|
+
|
|
18
|
+
[](https://www.npmjs.com/package/@studio-helga/once-ui-core)
|
|
19
|
+
[](./LICENSE.md)
|
|
20
|
+
[](https://www.npmjs.com/package/@studio-helga/once-ui-core)
|
|
21
|
+
[](https://discord.com/invite/5EyAQ4eNdS)
|
|
22
|
+
</div>
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
<br/>
|
|
27
|
+
|
|
28
|
+
## Documentation
|
|
29
|
+
|
|
30
|
+
Learn how to set up and build with Once UI at [docs.once-ui.com](https://docs.once-ui.com/once-ui/quick-start).
|
|
31
|
+
|
|
32
|
+
## Installation
|
|
33
|
+
|
|
34
|
+
```bash
|
|
35
|
+
npm install @studio-helga/once-ui-core
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
## Authors
|
|
39
|
+
|
|
40
|
+
Built and maintained by [**Lorant One**](https://lorant.one).
|
|
41
|
+
|
|
42
|
+
## Community
|
|
43
|
+
|
|
44
|
+
Join the [Design Engineers Club](https://discord.com/invite/5EyAQ4eNdS) for help, support and discussion.
|
|
45
|
+
|
|
46
|
+
Found a bug? Report it [here](https://github.com/once-ui-system/core/issues/new?labels=bug&template=bug_report.md). Got a feature request? Submit it [here](https://github.com/once-ui-system/core/issues/new?labels=feature%20request&template=feature_request.md).
|
|
47
|
+
|
|
48
|
+
## Contributing
|
|
49
|
+
|
|
50
|
+
Please read our [CONTRIBUTING.md](https://github.com/once-ui-system/core/blob/main/CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to Once UI.
|
|
51
|
+
|
|
52
|
+
## Sponsors
|
|
53
|
+
|
|
54
|
+
Once UI is an indie project. [Sponsor us](https://github.com/sponsors/once-ui-system) and get featured on our site!
|
package/dist/README.md
ADDED
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
<br/>
|
|
2
|
+
|
|
3
|
+
<div align="center">
|
|
4
|
+
<picture>
|
|
5
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://docs.once-ui.com/trademarks/icon-dark.svg" width="64" height="64">
|
|
6
|
+
<source media="(prefers-color-scheme: light)" srcset="https://docs.once-ui.com/trademarks/icon-light.svg" width="64" height="64">
|
|
7
|
+
<img alt="Once UI Logo" src="https://docs.once-ui.com/trademarks/icon-dark.svg" width="64" height="64">
|
|
8
|
+
</picture><picture>
|
|
9
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://docs.once-ui.com/trademarks/type-dark.svg" width="200" height="64">
|
|
10
|
+
<source media="(prefers-color-scheme: light)" srcset="https://docs.once-ui.com/trademarks/type-light.svg" width="200" height="64">
|
|
11
|
+
<img alt="Once UI Wordmark" src="https://docs.once-ui.com/trademarks/type-dark.svg" width="200" height="64">
|
|
12
|
+
</picture>
|
|
13
|
+
|
|
14
|
+
<br/>
|
|
15
|
+
|
|
16
|
+
The indie design system for Next.js apps
|
|
17
|
+
|
|
18
|
+
[](https://www.npmjs.com/package/@studio-helga/once-ui-core)
|
|
19
|
+
[](./LICENSE.md)
|
|
20
|
+
[](https://www.npmjs.com/package/@studio-helga/once-ui-core)
|
|
21
|
+
[](https://discord.com/invite/5EyAQ4eNdS)
|
|
22
|
+
</div>
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
<br/>
|
|
27
|
+
|
|
28
|
+
## Documentation
|
|
29
|
+
|
|
30
|
+
Learn how to set up and build with Once UI at [docs.once-ui.com](https://docs.once-ui.com/once-ui/quick-start).
|
|
31
|
+
|
|
32
|
+
## Installation
|
|
33
|
+
|
|
34
|
+
```bash
|
|
35
|
+
npm install @studio-helga/once-ui-core
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
## Authors
|
|
39
|
+
|
|
40
|
+
Built and maintained by [**Lorant One**](https://lorant.one).
|
|
41
|
+
|
|
42
|
+
## Community
|
|
43
|
+
|
|
44
|
+
Join the [Design Engineers Club](https://discord.com/invite/5EyAQ4eNdS) for help, support and discussion.
|
|
45
|
+
|
|
46
|
+
Found a bug? Report it [here](https://github.com/once-ui-system/core/issues/new?labels=bug&template=bug_report.md). Got a feature request? Submit it [here](https://github.com/once-ui-system/core/issues/new?labels=feature%20request&template=feature_request.md).
|
|
47
|
+
|
|
48
|
+
## Contributing
|
|
49
|
+
|
|
50
|
+
Please read our [CONTRIBUTING.md](https://github.com/once-ui-system/core/blob/main/CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to Once UI.
|
|
51
|
+
|
|
52
|
+
## Sponsors
|
|
53
|
+
|
|
54
|
+
Once UI is an indie project. [Sponsor us](https://github.com/sponsors/once-ui-system) and get featured on our site!
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Flex, Column, Row } from ".";
|
|
3
|
+
export interface AccordionHandle {
|
|
4
|
+
toggle: () => void;
|
|
5
|
+
open: () => void;
|
|
6
|
+
close: () => void;
|
|
7
|
+
}
|
|
8
|
+
interface AccordionProps extends Omit<React.ComponentProps<typeof Flex>, "title"> {
|
|
9
|
+
title: React.ReactNode;
|
|
10
|
+
children: React.ReactNode;
|
|
11
|
+
icon?: string;
|
|
12
|
+
iconRotation?: number;
|
|
13
|
+
size?: "s" | "m" | "l";
|
|
14
|
+
radius?: "xs" | "s" | "m" | "l" | "xl" | "full";
|
|
15
|
+
open?: boolean;
|
|
16
|
+
onToggle?: () => void;
|
|
17
|
+
className?: string;
|
|
18
|
+
style?: React.CSSProperties;
|
|
19
|
+
headerProps?: React.ComponentProps<typeof Row>;
|
|
20
|
+
contentProps?: React.ComponentProps<typeof Column>;
|
|
21
|
+
toggleOnHeaderClick?: boolean;
|
|
22
|
+
}
|
|
23
|
+
declare const Accordion: React.ForwardRefExoticComponent<Omit<AccordionProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
24
|
+
export { Accordion };
|
|
25
|
+
//# sourceMappingURL=Accordion.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../src/components/Accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,IAAI,EAAQ,MAAM,EAAQ,GAAG,EAAE,MAAM,GAAG,CAAC;AAIlD,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,UAAU,cAAe,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,OAAO,CAAC;IAC/E,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB,MAAM,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,MAAM,CAAC;IAChD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC;IAC/C,YAAY,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;IACnD,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED,QAAA,MAAM,SAAS,oGAiKd,CAAC;AAGF,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState, forwardRef, useImperativeHandle, useEffect, useCallback, useRef, } from "react";
|
|
4
|
+
import { Icon, Column, Grid, Row } from ".";
|
|
5
|
+
import styles from "./Accordion.module.scss";
|
|
6
|
+
import classNames from "classnames";
|
|
7
|
+
const Accordion = forwardRef(({ title, children, open = false, onToggle, iconRotation = 180, radius = "m", icon = "chevronDown", size = "m", className, style, headerProps, contentProps, toggleOnHeaderClick = true, ...rest }, ref) => {
|
|
8
|
+
const headerRef = useRef(null);
|
|
9
|
+
const [isOpen, setIsOpen] = useState(open);
|
|
10
|
+
useEffect(() => {
|
|
11
|
+
setIsOpen(open);
|
|
12
|
+
}, [open]);
|
|
13
|
+
const isAccordionOpen = onToggle ? open : isOpen;
|
|
14
|
+
const toggleAccordion = useCallback(() => {
|
|
15
|
+
if (onToggle) {
|
|
16
|
+
onToggle();
|
|
17
|
+
}
|
|
18
|
+
else {
|
|
19
|
+
setIsOpen((prev) => !prev);
|
|
20
|
+
}
|
|
21
|
+
}, [onToggle]);
|
|
22
|
+
useImperativeHandle(ref, () => {
|
|
23
|
+
const node = headerRef.current ?? document.createElement("div");
|
|
24
|
+
return Object.assign(node, {
|
|
25
|
+
toggle: toggleAccordion,
|
|
26
|
+
open: () => setIsOpen(true),
|
|
27
|
+
close: () => setIsOpen(false),
|
|
28
|
+
});
|
|
29
|
+
}, [toggleAccordion]);
|
|
30
|
+
const { className: headerClassName, style: headerStyle, onClick: headerOnClick, onKeyDown: headerOnKeyDown, ref: headerPropsRef, ...headerRest } = headerProps ?? {};
|
|
31
|
+
const { className: contentClassName, ...contentRest } = contentProps ?? {};
|
|
32
|
+
const setHeaderRef = useCallback((node) => {
|
|
33
|
+
headerRef.current = node;
|
|
34
|
+
if (typeof headerPropsRef === "function") {
|
|
35
|
+
headerPropsRef(node);
|
|
36
|
+
}
|
|
37
|
+
else if (headerPropsRef && "current" in headerPropsRef) {
|
|
38
|
+
headerPropsRef.current = node;
|
|
39
|
+
}
|
|
40
|
+
if (typeof ref === "function") {
|
|
41
|
+
ref(node);
|
|
42
|
+
}
|
|
43
|
+
else if (ref && "current" in ref) {
|
|
44
|
+
ref.current = node;
|
|
45
|
+
}
|
|
46
|
+
}, [headerPropsRef, ref]);
|
|
47
|
+
const handleHeaderClick = (e) => {
|
|
48
|
+
headerOnClick?.(e);
|
|
49
|
+
if (e.defaultPrevented || !toggleOnHeaderClick)
|
|
50
|
+
return;
|
|
51
|
+
toggleAccordion();
|
|
52
|
+
};
|
|
53
|
+
const handleHeaderKeyDown = (e) => {
|
|
54
|
+
headerOnKeyDown?.(e);
|
|
55
|
+
if (e.defaultPrevented || !toggleOnHeaderClick)
|
|
56
|
+
return;
|
|
57
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
58
|
+
e.preventDefault();
|
|
59
|
+
toggleAccordion();
|
|
60
|
+
}
|
|
61
|
+
};
|
|
62
|
+
const headerPaddingY = size === "s" ? "8" : size === "m" ? "12" : "16";
|
|
63
|
+
const headerPaddingX = size === "s" ? "12" : size === "m" ? "16" : "20";
|
|
64
|
+
const contentPaddingX = size === "s" ? "12" : size === "m" ? "16" : "20";
|
|
65
|
+
return (_jsxs(Column, { fillWidth: true, children: [_jsxs(Row, { ref: setHeaderRef, tabIndex: headerRest.tabIndex ?? 0, className: classNames(styles.accordion, className, headerClassName), style: { ...style, ...headerStyle }, cursor: "interactive", transition: "macro-medium", paddingY: headerPaddingY, paddingX: headerPaddingX, vertical: "center", horizontal: "between", onClick: handleHeaderClick, onKeyDown: handleHeaderKeyDown, "aria-expanded": isAccordionOpen, "aria-controls": "accordion-content", radius: radius, role: "button", ...headerRest, children: [_jsx(Row, { fillWidth: true, textVariant: "heading-strong-s", children: title }), _jsx(Icon, { name: icon, size: size === "s" ? "xs" : "s", onBackground: isAccordionOpen ? "neutral-strong" : "neutral-weak", style: {
|
|
66
|
+
display: "flex",
|
|
67
|
+
transform: isAccordionOpen ? `rotate(${iconRotation}deg)` : "rotate(0deg)",
|
|
68
|
+
transition: "var(--transition-micro-medium)",
|
|
69
|
+
} })] }), _jsx(Grid, { id: "accordion-content", fillWidth: true, transition: "macro-medium", style: {
|
|
70
|
+
gridTemplateRows: isAccordionOpen ? "1fr" : "0fr",
|
|
71
|
+
}, "aria-hidden": !isAccordionOpen, children: _jsx(Row, { fillWidth: true, minHeight: 0, overflow: "hidden", children: _jsx(Column, { fillWidth: true, className: contentClassName, paddingX: contentPaddingX, paddingTop: "8", paddingBottom: "16", ...contentRest, ...rest, children: children }) }) })] }));
|
|
72
|
+
});
|
|
73
|
+
Accordion.displayName = "Accordion";
|
|
74
|
+
export { Accordion };
|
|
75
|
+
//# sourceMappingURL=Accordion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/components/Accordion.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Flex } from ".";
|
|
3
|
+
export type AccordionItem = {
|
|
4
|
+
title: React.ReactNode;
|
|
5
|
+
content: React.ReactNode;
|
|
6
|
+
};
|
|
7
|
+
export interface AccordionGroupProps extends React.ComponentProps<typeof Flex> {
|
|
8
|
+
items: AccordionItem[];
|
|
9
|
+
size?: "s" | "m" | "l";
|
|
10
|
+
autoCollapse?: boolean;
|
|
11
|
+
className?: string;
|
|
12
|
+
style?: React.CSSProperties;
|
|
13
|
+
}
|
|
14
|
+
declare const AccordionGroup: React.FC<AccordionGroupProps>;
|
|
15
|
+
export { AccordionGroup };
|
|
16
|
+
//# sourceMappingURL=AccordionGroup.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionGroup.d.ts","sourceRoot":"","sources":["../../src/components/AccordionGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgC,MAAM,OAAO,CAAC;AACrD,OAAO,EAA2B,IAAI,EAAE,MAAM,GAAG,CAAC;AAElD,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC;IAC5E,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAuDjD,CAAC;AAGF,OAAO,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import React, { useState, useCallback } from "react";
|
|
4
|
+
import { Column, Accordion, Line } from ".";
|
|
5
|
+
const AccordionGroup = ({ items, size = "m", style, className, autoCollapse = true, ...rest }) => {
|
|
6
|
+
const [openAccordion, setOpenAccordion] = useState(null);
|
|
7
|
+
const handleAccordionToggle = useCallback((index) => {
|
|
8
|
+
if (autoCollapse) {
|
|
9
|
+
// If clicking the same accordion, close it
|
|
10
|
+
if (openAccordion === index) {
|
|
11
|
+
setOpenAccordion(null);
|
|
12
|
+
}
|
|
13
|
+
else {
|
|
14
|
+
// Otherwise, open the clicked accordion and close others
|
|
15
|
+
setOpenAccordion(index);
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
// If autoCollapse is false, let each accordion handle its own state
|
|
19
|
+
}, [autoCollapse, openAccordion]);
|
|
20
|
+
if (!items || items.length === 0) {
|
|
21
|
+
return null;
|
|
22
|
+
}
|
|
23
|
+
return (_jsx(Column, { fillWidth: true, radius: "m", border: "neutral-alpha-medium", overflow: "hidden", style: style, className: className || "", ...rest, children: items.map((item, index) => (_jsxs(React.Fragment, { children: [_jsx(Accordion, { title: item.title, size: size, open: autoCollapse ? openAccordion === index : undefined, onToggle: () => handleAccordionToggle(index), children: item.content }), index < items.length - 1 && _jsx(Line, { background: "neutral-alpha-medium" })] }, index))) }));
|
|
24
|
+
};
|
|
25
|
+
AccordionGroup.displayName = "AccordionGroup";
|
|
26
|
+
export { AccordionGroup };
|
|
27
|
+
//# sourceMappingURL=AccordionGroup.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionGroup.js","sourceRoot":"","sources":["../../src/components/AccordionGroup.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAQ,MAAM,GAAG,CAAC;AAelD,MAAM,cAAc,GAAkC,CAAC,EACrD,KAAK,EACL,IAAI,GAAG,GAAG,EACV,KAAK,EACL,SAAS,EACT,YAAY,GAAG,IAAI,EACnB,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAExE,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,KAAa,EAAE,EAAE;QAChB,IAAI,YAAY,EAAE,CAAC;YACjB,2CAA2C;YAC3C,IAAI,aAAa,KAAK,KAAK,EAAE,CAAC;gBAC5B,gBAAgB,CAAC,IAAI,CAAC,CAAC;YACzB,CAAC;iBAAM,CAAC;gBACN,yDAAyD;gBACzD,gBAAgB,CAAC,KAAK,CAAC,CAAC;YAC1B,CAAC;QACH,CAAC;QACD,oEAAoE;IACtE,CAAC,EACD,CAAC,YAAY,EAAE,aAAa,CAAC,CAC9B,CAAC;IAEF,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACjC,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,KAAC,MAAM,IACL,SAAS,QACT,MAAM,EAAC,GAAG,EACV,MAAM,EAAC,sBAAsB,EAC7B,QAAQ,EAAC,QAAQ,EACjB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,IAAI,EAAE,KACtB,IAAI,YAEP,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC1B,MAAC,KAAK,CAAC,QAAQ,eACb,KAAC,SAAS,IACR,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,aAAa,KAAK,KAAK,CAAC,CAAC,CAAC,SAAS,EACxD,QAAQ,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,KAAK,CAAC,YAE3C,IAAI,CAAC,OAAO,GACH,EACX,KAAK,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAC,IAAI,IAAC,UAAU,EAAC,sBAAsB,GAAG,KATpD,KAAK,CAUT,CAClB,CAAC,GACK,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import React, { ReactNode, CSSProperties } from "react";
|
|
2
|
+
import { Placement } from "@floating-ui/react-dom";
|
|
3
|
+
import { Flex } from ".";
|
|
4
|
+
import { SpacingToken } from "@/types";
|
|
5
|
+
type TriggerType = "hover" | "click" | "manual";
|
|
6
|
+
type EasingCurve = "linear" | "ease" | "ease-in" | "ease-out" | "ease-in-out" | "spring" | "bounce";
|
|
7
|
+
export interface AnimationProps extends React.ComponentProps<typeof Flex> {
|
|
8
|
+
trigger?: ReactNode;
|
|
9
|
+
children: ReactNode;
|
|
10
|
+
fade?: number;
|
|
11
|
+
scale?: number;
|
|
12
|
+
blur?: number;
|
|
13
|
+
slideUp?: number;
|
|
14
|
+
slideDown?: number;
|
|
15
|
+
slideLeft?: number;
|
|
16
|
+
slideRight?: number;
|
|
17
|
+
zoomIn?: number;
|
|
18
|
+
zoomOut?: number;
|
|
19
|
+
triggerType?: TriggerType;
|
|
20
|
+
active?: boolean;
|
|
21
|
+
delay?: number;
|
|
22
|
+
duration?: number;
|
|
23
|
+
easing?: EasingCurve;
|
|
24
|
+
transformOrigin?: string;
|
|
25
|
+
childrenPosition?: CSSProperties["position"];
|
|
26
|
+
reverse?: boolean;
|
|
27
|
+
touch?: "disable" | "enable" | "display";
|
|
28
|
+
portal?: boolean;
|
|
29
|
+
placement?: Placement;
|
|
30
|
+
offsetDistance?: SpacingToken;
|
|
31
|
+
}
|
|
32
|
+
declare const Animation: React.ForwardRefExoticComponent<Omit<AnimationProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
33
|
+
export { Animation };
|
|
34
|
+
//# sourceMappingURL=Animation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Animation.d.ts","sourceRoot":"","sources":["../../src/components/Animation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAIZ,SAAS,EAIT,aAAa,EACd,MAAM,OAAO,CAAC;AAEf,OAAO,EAKL,SAAS,EACV,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC;AACzB,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC,KAAK,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEhD,KAAK,WAAW,GACZ,QAAQ,GACR,MAAM,GACN,SAAS,GACT,UAAU,GACV,aAAa,GACb,QAAQ,GACR,QAAQ,CAAC;AAEb,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC;IACvE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;IAEzC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,cAAc,CAAC,EAAE,YAAY,CAAC;CAC/B;AAYD,QAAA,MAAM,SAAS,oGAsVd,CAAC;AAGF,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -0,0 +1,230 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState, useRef, useEffect, forwardRef, useImperativeHandle, useCallback, } from "react";
|
|
4
|
+
import { createPortal } from "react-dom";
|
|
5
|
+
import { useFloating, shift, flip, autoUpdate, } from "@floating-ui/react-dom";
|
|
6
|
+
import { Flex } from ".";
|
|
7
|
+
const easingCurves = {
|
|
8
|
+
linear: "linear",
|
|
9
|
+
ease: "ease",
|
|
10
|
+
"ease-in": "ease-in",
|
|
11
|
+
"ease-out": "ease-out",
|
|
12
|
+
"ease-in-out": "ease-in-out",
|
|
13
|
+
spring: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
|
|
14
|
+
bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
|
|
15
|
+
};
|
|
16
|
+
const Animation = forwardRef(({ trigger, children, fade, scale, blur, slideUp, slideDown, slideLeft, slideRight, zoomIn, zoomOut, triggerType = "manual", active: controlledActive, delay = 0, duration = 300, easing = "ease-out", transformOrigin = "center", childrenPosition = "absolute", reverse = false, touch = "enable", portal = false, placement = "top", offsetDistance = "8", ...flex }, ref) => {
|
|
17
|
+
const [internalActive, setInternalActive] = useState(false);
|
|
18
|
+
const [isClicked, setIsClicked] = useState(false);
|
|
19
|
+
const [mounted, setMounted] = useState(false);
|
|
20
|
+
const [isBrowser, setIsBrowser] = useState(false);
|
|
21
|
+
const [isPositioned, setIsPositioned] = useState(false);
|
|
22
|
+
const [isTouchDevice, setIsTouchDevice] = useState(false);
|
|
23
|
+
const wrapperRef = useRef(null);
|
|
24
|
+
const floatingRef = useRef(null);
|
|
25
|
+
const timeoutRef = useRef(null);
|
|
26
|
+
useImperativeHandle(ref, () => wrapperRef.current);
|
|
27
|
+
useEffect(() => {
|
|
28
|
+
setMounted(true);
|
|
29
|
+
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
30
|
+
if (portal) {
|
|
31
|
+
setIsBrowser(true);
|
|
32
|
+
}
|
|
33
|
+
}, [portal]);
|
|
34
|
+
const isControlled = controlledActive !== undefined;
|
|
35
|
+
const rawActive = isControlled ? controlledActive : internalActive;
|
|
36
|
+
// Determine if animation should be active based on touch mode
|
|
37
|
+
const isActive = (() => {
|
|
38
|
+
// If on touch device, handle based on touch prop
|
|
39
|
+
if (isTouchDevice && triggerType === "hover") {
|
|
40
|
+
if (touch === 'disable')
|
|
41
|
+
return false;
|
|
42
|
+
if (touch === 'display')
|
|
43
|
+
return true;
|
|
44
|
+
// touch === 'enable', fall through to normal logic
|
|
45
|
+
}
|
|
46
|
+
// For non-touch or when mounted, use the raw active state
|
|
47
|
+
if (!mounted && !isTouchDevice)
|
|
48
|
+
return false;
|
|
49
|
+
return rawActive;
|
|
50
|
+
})();
|
|
51
|
+
// Floating UI for portal positioning
|
|
52
|
+
const { x, y, strategy, placement: finalPlacement, refs: floatingRefs } = useFloating({
|
|
53
|
+
placement,
|
|
54
|
+
open: isActive,
|
|
55
|
+
middleware: [
|
|
56
|
+
flip(),
|
|
57
|
+
shift(),
|
|
58
|
+
],
|
|
59
|
+
whileElementsMounted: portal ? autoUpdate : undefined,
|
|
60
|
+
});
|
|
61
|
+
useEffect(() => {
|
|
62
|
+
if (portal && wrapperRef.current) {
|
|
63
|
+
floatingRefs.setReference(wrapperRef.current);
|
|
64
|
+
}
|
|
65
|
+
}, [portal, floatingRefs, mounted]);
|
|
66
|
+
useEffect(() => {
|
|
67
|
+
if (portal && isActive && mounted) {
|
|
68
|
+
setIsPositioned(false);
|
|
69
|
+
const timeoutId = setTimeout(() => {
|
|
70
|
+
if (floatingRef.current) {
|
|
71
|
+
floatingRefs.setFloating(floatingRef.current);
|
|
72
|
+
// Mark as positioned after setting the floating element
|
|
73
|
+
requestAnimationFrame(() => {
|
|
74
|
+
requestAnimationFrame(() => {
|
|
75
|
+
setIsPositioned(true);
|
|
76
|
+
});
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
}, 0);
|
|
80
|
+
return () => clearTimeout(timeoutId);
|
|
81
|
+
}
|
|
82
|
+
else {
|
|
83
|
+
setIsPositioned(false);
|
|
84
|
+
}
|
|
85
|
+
}, [portal, isActive, mounted, floatingRefs]);
|
|
86
|
+
const handleMouseEnter = useCallback(() => {
|
|
87
|
+
if (triggerType === "hover") {
|
|
88
|
+
if (delay > 0) {
|
|
89
|
+
timeoutRef.current = setTimeout(() => {
|
|
90
|
+
setInternalActive(true);
|
|
91
|
+
}, delay);
|
|
92
|
+
}
|
|
93
|
+
else {
|
|
94
|
+
setInternalActive(true);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
}, [triggerType, delay]);
|
|
98
|
+
const handleMouseLeave = useCallback(() => {
|
|
99
|
+
if (triggerType === "hover") {
|
|
100
|
+
if (timeoutRef.current) {
|
|
101
|
+
clearTimeout(timeoutRef.current);
|
|
102
|
+
timeoutRef.current = null;
|
|
103
|
+
}
|
|
104
|
+
setInternalActive(false);
|
|
105
|
+
}
|
|
106
|
+
}, [triggerType]);
|
|
107
|
+
const handleFocus = useCallback(() => {
|
|
108
|
+
if (triggerType === "hover") {
|
|
109
|
+
handleMouseEnter();
|
|
110
|
+
}
|
|
111
|
+
}, [triggerType, handleMouseEnter]);
|
|
112
|
+
const handleBlur = useCallback(() => {
|
|
113
|
+
if (triggerType === "hover") {
|
|
114
|
+
handleMouseLeave();
|
|
115
|
+
}
|
|
116
|
+
}, [triggerType, handleMouseLeave]);
|
|
117
|
+
const handleClick = useCallback(() => {
|
|
118
|
+
if (triggerType === "click") {
|
|
119
|
+
setIsClicked(!isClicked);
|
|
120
|
+
setInternalActive(!isClicked);
|
|
121
|
+
}
|
|
122
|
+
}, [triggerType, isClicked, setInternalActive]);
|
|
123
|
+
useEffect(() => {
|
|
124
|
+
return () => {
|
|
125
|
+
if (timeoutRef.current) {
|
|
126
|
+
clearTimeout(timeoutRef.current);
|
|
127
|
+
}
|
|
128
|
+
};
|
|
129
|
+
}, []);
|
|
130
|
+
const getAnimationStyle = () => {
|
|
131
|
+
// For portals, always use center origin for consistent animations
|
|
132
|
+
const calculatedTransformOrigin = portal ? 'center center' : transformOrigin;
|
|
133
|
+
// For portals, don't transition position (top/left) - only animate opacity, transform, filter
|
|
134
|
+
const transitionProps = portal
|
|
135
|
+
? `opacity ${duration}ms ${easingCurves[easing]}, transform ${duration}ms ${easingCurves[easing]}, filter ${duration}ms ${easingCurves[easing]}`
|
|
136
|
+
: `all ${duration}ms ${easingCurves[easing]}`;
|
|
137
|
+
const baseStyle = {
|
|
138
|
+
transition: transitionProps,
|
|
139
|
+
transformOrigin: calculatedTransformOrigin,
|
|
140
|
+
};
|
|
141
|
+
// For portals, animation should trigger based on isPositioned, not isActive
|
|
142
|
+
// For touch="display", wait until mounted to determine state
|
|
143
|
+
const effectiveActive = portal ? isPositioned : (touch === 'display' && !mounted ? false : isActive);
|
|
144
|
+
const shouldAnimate = reverse ? !effectiveActive : effectiveActive;
|
|
145
|
+
// Combine styles from multiple animations
|
|
146
|
+
let combinedStyle = { ...baseStyle };
|
|
147
|
+
const transforms = [];
|
|
148
|
+
if (fade !== undefined) {
|
|
149
|
+
combinedStyle.opacity = shouldAnimate ? 1 : fade;
|
|
150
|
+
}
|
|
151
|
+
if (scale !== undefined) {
|
|
152
|
+
transforms.push(shouldAnimate ? "scale(1)" : `scale(${scale})`);
|
|
153
|
+
if (combinedStyle.opacity === undefined) {
|
|
154
|
+
combinedStyle.opacity = shouldAnimate ? 1 : 0;
|
|
155
|
+
}
|
|
156
|
+
}
|
|
157
|
+
if (blur !== undefined) {
|
|
158
|
+
combinedStyle.filter = shouldAnimate ? "blur(0px)" : `blur(${blur}px)`;
|
|
159
|
+
if (combinedStyle.opacity === undefined) {
|
|
160
|
+
combinedStyle.opacity = shouldAnimate ? 1 : 0;
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
if (slideUp !== undefined) {
|
|
164
|
+
transforms.push(shouldAnimate ? "translateY(0)" : `translateY(${slideUp}rem)`);
|
|
165
|
+
if (combinedStyle.opacity === undefined) {
|
|
166
|
+
combinedStyle.opacity = shouldAnimate ? 1 : 0;
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
if (slideDown !== undefined) {
|
|
170
|
+
transforms.push(shouldAnimate ? "translateY(0)" : `translateY(-${slideDown}rem)`);
|
|
171
|
+
if (combinedStyle.opacity === undefined) {
|
|
172
|
+
combinedStyle.opacity = shouldAnimate ? 1 : 0;
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
if (slideLeft !== undefined) {
|
|
176
|
+
transforms.push(shouldAnimate ? "translateX(0)" : `translateX(${slideLeft}rem)`);
|
|
177
|
+
if (combinedStyle.opacity === undefined) {
|
|
178
|
+
combinedStyle.opacity = shouldAnimate ? 1 : 0;
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
if (slideRight !== undefined) {
|
|
182
|
+
transforms.push(shouldAnimate ? "translateX(0)" : `translateX(-${slideRight}rem)`);
|
|
183
|
+
if (combinedStyle.opacity === undefined) {
|
|
184
|
+
combinedStyle.opacity = shouldAnimate ? 1 : 0;
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
if (zoomIn !== undefined) {
|
|
188
|
+
transforms.push(shouldAnimate ? `scale(${zoomIn})` : "scale(1)");
|
|
189
|
+
if (combinedStyle.opacity === undefined) {
|
|
190
|
+
combinedStyle.opacity = shouldAnimate ? 1 : 0;
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
if (zoomOut !== undefined) {
|
|
194
|
+
transforms.push(shouldAnimate ? `scale(${zoomOut})` : "scale(1)");
|
|
195
|
+
if (combinedStyle.opacity === undefined) {
|
|
196
|
+
combinedStyle.opacity = shouldAnimate ? 1 : 0;
|
|
197
|
+
}
|
|
198
|
+
}
|
|
199
|
+
// Combine all transforms into a single transform property
|
|
200
|
+
if (transforms.length > 0) {
|
|
201
|
+
combinedStyle.transform = transforms.join(" ");
|
|
202
|
+
}
|
|
203
|
+
return combinedStyle;
|
|
204
|
+
};
|
|
205
|
+
const animationStyle = getAnimationStyle();
|
|
206
|
+
// If trigger is provided, wrap it with event handlers
|
|
207
|
+
if (trigger) {
|
|
208
|
+
// Portal mode: render content in portal
|
|
209
|
+
if (portal) {
|
|
210
|
+
return (_jsxs(_Fragment, { children: [_jsx(Flex, { ref: wrapperRef, onMouseEnter: triggerType === "hover" ? handleMouseEnter : undefined, onMouseLeave: triggerType === "hover" ? handleMouseLeave : undefined, onFocus: triggerType === "hover" ? handleFocus : undefined, onBlur: triggerType === "hover" ? handleBlur : undefined, onClick: triggerType === "click" ? handleClick : undefined, children: trigger }), isActive && isBrowser && createPortal(_jsx(Flex, { ref: floatingRef, zIndex: 10, paddingTop: finalPlacement.includes("bottom") ? offsetDistance : undefined, paddingBottom: finalPlacement.includes("top") ? offsetDistance : undefined, paddingLeft: finalPlacement.includes("right") ? offsetDistance : undefined, paddingRight: finalPlacement.includes("left") ? offsetDistance : undefined, style: {
|
|
211
|
+
position: strategy,
|
|
212
|
+
top: y ?? 0,
|
|
213
|
+
left: x ?? 0,
|
|
214
|
+
...animationStyle,
|
|
215
|
+
visibility: isPositioned ? 'visible' : 'hidden',
|
|
216
|
+
pointerEvents: isActive ? "auto" : "none",
|
|
217
|
+
}, onMouseEnter: triggerType === "hover" ? handleMouseEnter : undefined, onMouseLeave: triggerType === "hover" ? handleMouseLeave : undefined, "aria-hidden": !isActive, ...flex, children: children }), document.body)] }));
|
|
218
|
+
}
|
|
219
|
+
// Normal mode: absolute positioning
|
|
220
|
+
return (_jsxs(Flex, { ref: wrapperRef, onMouseLeave: triggerType === "hover" ? handleMouseLeave : undefined, ...flex, children: [_jsx(Flex, { onMouseEnter: triggerType === "hover" ? handleMouseEnter : undefined, onFocus: triggerType === "hover" ? handleFocus : undefined, onBlur: triggerType === "hover" ? handleBlur : undefined, onClick: triggerType === "click" ? handleClick : undefined, children: trigger }), _jsx(Flex, { position: childrenPosition, style: {
|
|
221
|
+
...animationStyle,
|
|
222
|
+
pointerEvents: isActive ? "auto" : "none",
|
|
223
|
+
}, onMouseEnter: triggerType === "hover" && isActive ? handleMouseEnter : undefined, "aria-hidden": !isActive, inert: !isActive ? true : undefined, children: children })] }));
|
|
224
|
+
}
|
|
225
|
+
// If no trigger, apply animation directly to children
|
|
226
|
+
return (_jsx(Flex, { ref: wrapperRef, onMouseEnter: triggerType === "hover" ? handleMouseEnter : undefined, onMouseLeave: triggerType === "hover" ? handleMouseLeave : undefined, onFocus: triggerType === "hover" ? handleFocus : undefined, onBlur: triggerType === "hover" ? handleBlur : undefined, onClick: triggerType === "click" ? handleClick : undefined, style: animationStyle, ...flex, children: children }));
|
|
227
|
+
});
|
|
228
|
+
Animation.displayName = "Animation";
|
|
229
|
+
export { Animation };
|
|
230
|
+
//# sourceMappingURL=Animation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Animation.js","sourceRoot":"","sources":["../../src/components/Animation.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Flex } from ".";
|
|
2
|
+
interface ArrowProps extends React.ComponentProps<typeof Flex> {
|
|
3
|
+
trigger: string;
|
|
4
|
+
scale?: number;
|
|
5
|
+
color?: "onBackground" | "onSolid";
|
|
6
|
+
style?: React.CSSProperties;
|
|
7
|
+
className?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const Arrow: React.FC<ArrowProps>;
|
|
10
|
+
export { Arrow };
|
|
11
|
+
//# sourceMappingURL=Arrow.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Arrow.d.ts","sourceRoot":"","sources":["../../src/components/Arrow.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC;AAEzB,UAAU,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC;IAC5D,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,cAAc,GAAG,SAAS,CAAC;IACnC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAyD/B,CAAC;AAGF,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useEffect, useRef } from "react";
|
|
4
|
+
import classNames from "classnames";
|
|
5
|
+
import styles from "./Arrow.module.scss";
|
|
6
|
+
import { Flex } from ".";
|
|
7
|
+
const Arrow = ({ trigger, scale = 0.8, color = "onBackground", style, className, ...flex }) => {
|
|
8
|
+
const ref = useRef(null);
|
|
9
|
+
useEffect(() => {
|
|
10
|
+
const triggerElement = document.querySelector(trigger);
|
|
11
|
+
if (triggerElement && ref.current) {
|
|
12
|
+
const handleMouseOver = () => {
|
|
13
|
+
ref.current?.classList.add(styles.active);
|
|
14
|
+
};
|
|
15
|
+
const handleMouseOut = () => {
|
|
16
|
+
ref.current?.classList.remove(styles.active);
|
|
17
|
+
};
|
|
18
|
+
triggerElement.addEventListener("mouseenter", handleMouseOver);
|
|
19
|
+
triggerElement.addEventListener("mouseleave", handleMouseOut);
|
|
20
|
+
return () => {
|
|
21
|
+
triggerElement.removeEventListener("mouseenter", handleMouseOver);
|
|
22
|
+
triggerElement.removeEventListener("mouseleave", handleMouseOut);
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
}, [trigger]);
|
|
26
|
+
return (_jsxs(Flex, { ref: ref, center: true, className: classNames(styles.arrowContainer, className), style: {
|
|
27
|
+
transform: `scale(${scale})`,
|
|
28
|
+
...style,
|
|
29
|
+
}, ...flex, children: [_jsx(Flex, { radius: "full", position: "absolute", className: classNames(styles.arrowHead, styles[color]), height: 0.0875 }), _jsx(Flex, { radius: "full", position: "absolute", className: classNames(styles.arrowHead, styles[color]), height: 0.0875 })] }));
|
|
30
|
+
};
|
|
31
|
+
Arrow.displayName = "Arrow";
|
|
32
|
+
export { Arrow };
|
|
33
|
+
//# sourceMappingURL=Arrow.js.map
|