@studiometa/ui 1.0.0-alpha.8 → 1.0.0-beta.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/{molecules/Accordion → Accordion}/Accordion.js.map +1 -1
- package/{molecules/Accordion → Accordion}/AccordionCore.js.map +1 -1
- package/{molecules/Accordion → Accordion}/AccordionItem.js.map +1 -1
- package/{molecules/Accordion → Accordion}/index.js.map +1 -1
- package/{atoms/Action → Action}/Action.js.map +1 -1
- package/{atoms/Action → Action}/ActionEvent.js.map +1 -1
- package/{atoms/Action → Action}/Target.js.map +1 -1
- package/{atoms/Action → Action}/index.js.map +1 -1
- package/{molecules/AnchorNav → AnchorNav}/AnchorNav.js.map +1 -1
- package/{molecules/AnchorNav → AnchorNav}/AnchorNavLink.d.ts +2 -2
- package/{molecules/AnchorNav → AnchorNav}/AnchorNavLink.js +2 -2
- package/AnchorNav/AnchorNavLink.js.map +7 -0
- package/{molecules/AnchorNav → AnchorNav}/AnchorNavTarget.js.map +1 -1
- package/{molecules/AnchorNav → AnchorNav}/index.js.map +1 -1
- package/{atoms/AnchorScrollTo → AnchorScrollTo}/AnchorScrollTo.js.map +1 -1
- package/{atoms/AnchorScrollTo → AnchorScrollTo}/index.js.map +1 -1
- package/{atoms/Button → Button}/Button.twig +1 -1
- package/{atoms/Button → Button}/StyledButton.twig +1 -1
- package/{atoms/Button → Button}/StyledButtonRounded.twig +1 -1
- package/{atoms/CircularMarquee → CircularMarquee}/CircularMarquee.js.map +1 -1
- package/{atoms/CircularMarquee → CircularMarquee}/CircularMarquee.twig +1 -1
- package/{atoms/CircularMarquee → CircularMarquee}/index.js.map +1 -1
- package/{atoms/Cursor → Cursor}/Cursor.js.map +1 -1
- package/{atoms/Cursor → Cursor}/index.js.map +1 -1
- package/{atoms/Data → Data}/DataBind.js.map +1 -1
- package/{atoms/Data → Data}/DataComputed.js +0 -1
- package/Data/DataComputed.js.map +7 -0
- package/Data/DataEffect.js.map +7 -0
- package/{atoms/Data → Data}/DataModel.js.map +1 -1
- package/{atoms/Data → Data}/index.js.map +1 -1
- package/{atoms/Data → Data}/utils.js.map +1 -1
- package/{primitives/Draggable → Draggable}/Draggable.js.map +1 -1
- package/{primitives/Draggable → Draggable}/index.js.map +1 -1
- package/{atoms/Figure/Figure.d.ts → Figure/AbstractFigure.d.ts} +4 -12
- package/{atoms/Figure/Figure.js → Figure/AbstractFigure.js} +11 -29
- package/Figure/AbstractFigure.js.map +7 -0
- package/Figure/AbstractFigureDynamic.d.ts +29 -0
- package/Figure/AbstractFigureDynamic.js +48 -0
- package/Figure/AbstractFigureDynamic.js.map +7 -0
- package/Figure/Figure.d.ts +18 -0
- package/Figure/Figure.js +20 -0
- package/Figure/Figure.js.map +7 -0
- package/Figure/FigureShopify.d.ts +23 -0
- package/Figure/FigureShopify.js +38 -0
- package/Figure/FigureShopify.js.map +7 -0
- package/{atoms/Figure → Figure}/FigureTwicpics.d.ts +3 -19
- package/{atoms/Figure → Figure}/FigureTwicpics.js +10 -32
- package/Figure/FigureTwicpics.js.map +7 -0
- package/{atoms/Figure → Figure}/FigureTwicpics.twig +1 -1
- package/{atoms/Figure → Figure}/index.d.ts +1 -0
- package/{atoms/Figure → Figure}/index.js +1 -0
- package/Figure/index.js.map +7 -0
- package/Figure/utils.d.ts +8 -0
- package/Figure/utils.js +15 -0
- package/Figure/utils.js.map +7 -0
- package/{atoms/FigureVideo → FigureVideo}/FigureVideo.d.ts +1 -1
- package/{atoms/FigureVideo → FigureVideo}/FigureVideo.js +2 -2
- package/FigureVideo/FigureVideo.js.map +7 -0
- package/{atoms/FigureVideo → FigureVideo}/FigureVideoTwicpics.js +1 -1
- package/FigureVideo/FigureVideoTwicpics.js.map +7 -0
- package/{atoms/FigureVideo → FigureVideo}/FigureVideoTwicpics.twig +1 -1
- package/{atoms/FigureVideo → FigureVideo}/index.js.map +1 -1
- package/{organisms/Frame → Frame}/Frame.js +1 -1
- package/{organisms/Frame → Frame}/Frame.js.map +3 -3
- package/{organisms/Frame → Frame}/FrameAnchor.js.map +1 -1
- package/{organisms/Frame → Frame}/FrameForm.js.map +1 -1
- package/{organisms/Frame → Frame}/FrameTarget.d.ts +2 -2
- package/{organisms/Frame → Frame}/FrameTarget.js +1 -1
- package/Frame/FrameTarget.js.map +7 -0
- package/{organisms/Frame → Frame}/index.js.map +1 -1
- package/{organisms/Hero → Hero}/Hero.twig +2 -2
- package/{atoms/Icon/IconInline.twig → Icon/Icon.twig} +5 -1
- package/{atoms/Icon/IconInlineImg.twig → Icon/IconImg.twig} +5 -1
- package/{molecules/IconList → IconList}/IconList.twig +4 -4
- package/{organisms/ImageGrid → ImageGrid}/ImageGrid.twig +1 -1
- package/{atoms/LargeText → LargeText}/LargeText.js.map +1 -1
- package/{atoms/LargeText → LargeText}/index.js.map +1 -1
- package/{atoms/LazyInclude → LazyInclude}/LazyInclude.js.map +1 -1
- package/{atoms/LazyInclude → LazyInclude}/index.js.map +1 -1
- package/{molecules/MapboxStaticMap → MapboxStaticMap}/MapboxStaticMap.twig +1 -1
- package/{molecules/Menu → Menu}/Menu.js.map +1 -1
- package/{molecules/Menu → Menu}/MenuBtn.js.map +1 -1
- package/{molecules/Menu → Menu}/MenuList.d.ts +2 -2
- package/{molecules/Menu → Menu}/MenuList.js +1 -1
- package/Menu/MenuList.js.map +7 -0
- package/{molecules/Menu → Menu}/index.js.map +1 -1
- package/{molecules/Modal → Modal}/Modal.d.ts +1 -1
- package/{molecules/Modal → Modal}/Modal.js.map +1 -1
- package/{molecules/Modal → Modal}/Modal.twig +2 -2
- package/{molecules/Modal → Modal}/ModalWithTransition.js.map +1 -1
- package/{molecules/Modal → Modal}/StyledModal.twig +3 -3
- package/{molecules/Modal → Modal}/index.js.map +1 -1
- package/{molecules/Panel → Panel}/Panel.js.map +1 -1
- package/{molecules/Panel → Panel}/Panel.twig +1 -1
- package/{molecules/Panel → Panel}/StyledPanel.twig +3 -3
- package/{molecules/Panel → Panel}/index.js.map +1 -1
- package/{atoms/Prefetch → Prefetch}/AbstractPrefetch.js.map +1 -1
- package/{atoms/Prefetch → Prefetch}/PrefetchWhenOver.js.map +1 -1
- package/{atoms/Prefetch → Prefetch}/PrefetchWhenVisible.js.map +1 -1
- package/{atoms/Prefetch → Prefetch}/index.js.map +1 -1
- package/{molecules/Reinsurance → Reinsurance}/Reinsurance.twig +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/AbstractScrollAnimation.js.map +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimation.js.map +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationChild.js.map +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationChildWithEase.d.ts +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationChildWithEase.js.map +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationParent.js.map +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationWithEase.d.ts +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationWithEase.js.map +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/animationScrollWithEase.js.map +1 -1
- package/{atoms/ScrollAnimation → ScrollAnimation}/index.js.map +1 -1
- package/{atoms/ScrollReveal → ScrollReveal}/ScrollReveal.d.ts +1 -1
- package/{atoms/ScrollReveal → ScrollReveal}/ScrollReveal.js +1 -1
- package/ScrollReveal/ScrollReveal.js.map +7 -0
- package/{atoms/ScrollReveal → ScrollReveal}/index.js.map +1 -1
- package/{primitives/Sentinel → Sentinel}/Sentinel.js.map +1 -1
- package/{primitives/Sentinel → Sentinel}/index.js.map +1 -1
- package/{molecules/Slider → Slider}/AbstractSliderChild.js.map +1 -1
- package/{molecules/Slider → Slider}/Slider.js.map +1 -1
- package/{molecules/Slider → Slider}/SliderBtn.js.map +1 -1
- package/{molecules/Slider → Slider}/SliderCount.js.map +1 -1
- package/{molecules/Slider → Slider}/SliderDots.d.ts +2 -3
- package/{molecules/Slider → Slider}/SliderDots.js +2 -2
- package/Slider/SliderDots.js.map +7 -0
- package/{molecules/Slider → Slider}/SliderDrag.js.map +1 -1
- package/{molecules/Slider → Slider}/SliderItem.js.map +1 -1
- package/{molecules/Slider → Slider}/SliderProgress.js.map +1 -1
- package/{molecules/Slider → Slider}/index.js.map +1 -1
- package/{molecules/Sticky → Sticky}/Sticky.d.ts +1 -1
- package/{molecules/Sticky → Sticky}/Sticky.js +1 -1
- package/Sticky/Sticky.js.map +7 -0
- package/{molecules/Sticky → Sticky}/index.js.map +1 -1
- package/{molecules/TableOfContent → TableOfContent}/TableOfContent.d.ts +1 -1
- package/{molecules/TableOfContent → TableOfContent}/TableOfContent.js +1 -1
- package/TableOfContent/TableOfContent.js.map +7 -0
- package/{molecules/TableOfContent → TableOfContent}/TableOfContentAnchor.d.ts +2 -2
- package/{molecules/TableOfContent → TableOfContent}/TableOfContentAnchor.js +2 -2
- package/TableOfContent/TableOfContentAnchor.js.map +7 -0
- package/{molecules/TableOfContent → TableOfContent}/index.js.map +1 -1
- package/{molecules/Tabs → Tabs}/Tabs.d.ts +1 -2
- package/{molecules/Tabs → Tabs}/Tabs.js +1 -1
- package/Tabs/Tabs.js.map +7 -0
- package/{molecules/Tabs → Tabs}/index.js.map +1 -1
- package/{primitives/Transition → Transition}/Transition.d.ts +1 -1
- package/{primitives/Transition → Transition}/Transition.js +1 -1
- package/Transition/Transition.js.map +7 -0
- package/{primitives/Transition → Transition}/index.js.map +1 -1
- package/decorators/withTransition.d.ts +1 -0
- package/decorators/withTransition.js +47 -23
- package/decorators/withTransition.js.map +2 -2
- package/index.d.ts +25 -4
- package/index.js +25 -4
- package/index.js.map +2 -2
- package/package.json +2 -2
- package/atoms/Data/DataComputed.js.map +0 -7
- package/atoms/Data/DataEffect.js.map +0 -7
- package/atoms/Figure/Figure.js.map +0 -7
- package/atoms/Figure/FigureTwicpics.js.map +0 -7
- package/atoms/Figure/index.js.map +0 -7
- package/atoms/FigureVideo/FigureVideo.js.map +0 -7
- package/atoms/FigureVideo/FigureVideoTwicpics.js.map +0 -7
- package/atoms/Icon/Icon.twig +0 -12
- package/atoms/ScrollReveal/ScrollReveal.js.map +0 -7
- package/atoms/index.d.ts +0 -12
- package/atoms/index.js +0 -13
- package/atoms/index.js.map +0 -7
- package/molecules/AnchorNav/AnchorNavLink.js.map +0 -7
- package/molecules/Menu/MenuList.js.map +0 -7
- package/molecules/Slider/SliderDots.js.map +0 -7
- package/molecules/Sticky/Sticky.js.map +0 -7
- package/molecules/TableOfContent/TableOfContent.js.map +0 -7
- package/molecules/TableOfContent/TableOfContentAnchor.js.map +0 -7
- package/molecules/Tabs/Tabs.js.map +0 -7
- package/molecules/index.d.ts +0 -9
- package/molecules/index.js +0 -10
- package/molecules/index.js.map +0 -7
- package/organisms/Frame/FrameTarget.js.map +0 -7
- package/organisms/index.d.ts +0 -1
- package/organisms/index.js +0 -2
- package/organisms/index.js.map +0 -7
- package/primitives/Transition/Transition.js.map +0 -7
- package/primitives/index.d.ts +0 -3
- package/primitives/index.js +0 -4
- package/primitives/index.js.map +0 -7
- /package/{molecules/Accordion → Accordion}/Accordion.d.ts +0 -0
- /package/{molecules/Accordion → Accordion}/Accordion.js +0 -0
- /package/{molecules/Accordion → Accordion}/Accordion.twig +0 -0
- /package/{molecules/Accordion → Accordion}/AccordionCore.d.ts +0 -0
- /package/{molecules/Accordion → Accordion}/AccordionCore.js +0 -0
- /package/{molecules/Accordion → Accordion}/AccordionItem.d.ts +0 -0
- /package/{molecules/Accordion → Accordion}/AccordionItem.js +0 -0
- /package/{molecules/Accordion → Accordion}/index.d.ts +0 -0
- /package/{molecules/Accordion → Accordion}/index.js +0 -0
- /package/{atoms/Action → Action}/Action.d.ts +0 -0
- /package/{atoms/Action → Action}/Action.js +0 -0
- /package/{atoms/Action → Action}/ActionEvent.d.ts +0 -0
- /package/{atoms/Action → Action}/ActionEvent.js +0 -0
- /package/{atoms/Action → Action}/Target.d.ts +0 -0
- /package/{atoms/Action → Action}/Target.js +0 -0
- /package/{atoms/Action → Action}/index.d.ts +0 -0
- /package/{atoms/Action → Action}/index.js +0 -0
- /package/{molecules/AnchorNav → AnchorNav}/AnchorNav.d.ts +0 -0
- /package/{molecules/AnchorNav → AnchorNav}/AnchorNav.js +0 -0
- /package/{molecules/AnchorNav → AnchorNav}/AnchorNavTarget.d.ts +0 -0
- /package/{molecules/AnchorNav → AnchorNav}/AnchorNavTarget.js +0 -0
- /package/{molecules/AnchorNav → AnchorNav}/index.d.ts +0 -0
- /package/{molecules/AnchorNav → AnchorNav}/index.js +0 -0
- /package/{atoms/AnchorScrollTo → AnchorScrollTo}/AnchorScrollTo.d.ts +0 -0
- /package/{atoms/AnchorScrollTo → AnchorScrollTo}/AnchorScrollTo.js +0 -0
- /package/{atoms/AnchorScrollTo → AnchorScrollTo}/index.d.ts +0 -0
- /package/{atoms/AnchorScrollTo → AnchorScrollTo}/index.js +0 -0
- /package/{atoms/CircularMarquee → CircularMarquee}/CircularMarquee.d.ts +0 -0
- /package/{atoms/CircularMarquee → CircularMarquee}/CircularMarquee.js +0 -0
- /package/{atoms/CircularMarquee → CircularMarquee}/index.d.ts +0 -0
- /package/{atoms/CircularMarquee → CircularMarquee}/index.js +0 -0
- /package/{atoms/Cursor → Cursor}/Cursor.d.ts +0 -0
- /package/{atoms/Cursor → Cursor}/Cursor.js +0 -0
- /package/{atoms/Cursor → Cursor}/Cursor.twig +0 -0
- /package/{atoms/Cursor → Cursor}/index.d.ts +0 -0
- /package/{atoms/Cursor → Cursor}/index.js +0 -0
- /package/{atoms/Data → Data}/DataBind.d.ts +0 -0
- /package/{atoms/Data → Data}/DataBind.js +0 -0
- /package/{atoms/Data → Data}/DataComputed.d.ts +0 -0
- /package/{atoms/Data → Data}/DataEffect.d.ts +0 -0
- /package/{atoms/Data → Data}/DataEffect.js +0 -0
- /package/{atoms/Data → Data}/DataModel.d.ts +0 -0
- /package/{atoms/Data → Data}/DataModel.js +0 -0
- /package/{atoms/Data → Data}/index.d.ts +0 -0
- /package/{atoms/Data → Data}/index.js +0 -0
- /package/{atoms/Data → Data}/utils.d.ts +0 -0
- /package/{atoms/Data → Data}/utils.js +0 -0
- /package/{primitives/Draggable → Draggable}/Draggable.d.ts +0 -0
- /package/{primitives/Draggable → Draggable}/Draggable.js +0 -0
- /package/{primitives/Draggable → Draggable}/index.d.ts +0 -0
- /package/{primitives/Draggable → Draggable}/index.js +0 -0
- /package/{atoms/Figure → Figure}/Figure.twig +0 -0
- /package/{atoms/FigureVideo → FigureVideo}/FigureVideo.twig +0 -0
- /package/{atoms/FigureVideo → FigureVideo}/FigureVideoTwicpics.d.ts +0 -0
- /package/{atoms/FigureVideo → FigureVideo}/index.d.ts +0 -0
- /package/{atoms/FigureVideo → FigureVideo}/index.js +0 -0
- /package/{organisms/Frame → Frame}/Frame.d.ts +0 -0
- /package/{organisms/Frame → Frame}/FrameAnchor.d.ts +0 -0
- /package/{organisms/Frame → Frame}/FrameAnchor.js +0 -0
- /package/{organisms/Frame → Frame}/FrameForm.d.ts +0 -0
- /package/{organisms/Frame → Frame}/FrameForm.js +0 -0
- /package/{organisms/Frame → Frame}/index.d.ts +0 -0
- /package/{organisms/Frame → Frame}/index.js +0 -0
- /package/{atoms/LargeText → LargeText}/LargeText.d.ts +0 -0
- /package/{atoms/LargeText → LargeText}/LargeText.js +0 -0
- /package/{atoms/LargeText → LargeText}/LargeText.twig +0 -0
- /package/{atoms/LargeText → LargeText}/index.d.ts +0 -0
- /package/{atoms/LargeText → LargeText}/index.js +0 -0
- /package/{atoms/LazyInclude → LazyInclude}/LazyInclude.d.ts +0 -0
- /package/{atoms/LazyInclude → LazyInclude}/LazyInclude.js +0 -0
- /package/{atoms/LazyInclude → LazyInclude}/index.d.ts +0 -0
- /package/{atoms/LazyInclude → LazyInclude}/index.js +0 -0
- /package/{molecules/Menu → Menu}/Menu.d.ts +0 -0
- /package/{molecules/Menu → Menu}/Menu.js +0 -0
- /package/{molecules/Menu → Menu}/MenuBtn.d.ts +0 -0
- /package/{molecules/Menu → Menu}/MenuBtn.js +0 -0
- /package/{molecules/Menu → Menu}/index.d.ts +0 -0
- /package/{molecules/Menu → Menu}/index.js +0 -0
- /package/{molecules/Modal → Modal}/Modal.js +0 -0
- /package/{molecules/Modal → Modal}/ModalWithTransition.d.ts +0 -0
- /package/{molecules/Modal → Modal}/ModalWithTransition.js +0 -0
- /package/{molecules/Modal → Modal}/index.d.ts +0 -0
- /package/{molecules/Modal → Modal}/index.js +0 -0
- /package/{molecules/Panel → Panel}/Panel.d.ts +0 -0
- /package/{molecules/Panel → Panel}/Panel.js +0 -0
- /package/{molecules/Panel → Panel}/index.d.ts +0 -0
- /package/{molecules/Panel → Panel}/index.js +0 -0
- /package/{atoms/Prefetch → Prefetch}/AbstractPrefetch.d.ts +0 -0
- /package/{atoms/Prefetch → Prefetch}/AbstractPrefetch.js +0 -0
- /package/{atoms/Prefetch → Prefetch}/PrefetchWhenOver.d.ts +0 -0
- /package/{atoms/Prefetch → Prefetch}/PrefetchWhenOver.js +0 -0
- /package/{atoms/Prefetch → Prefetch}/PrefetchWhenVisible.d.ts +0 -0
- /package/{atoms/Prefetch → Prefetch}/PrefetchWhenVisible.js +0 -0
- /package/{atoms/Prefetch → Prefetch}/index.d.ts +0 -0
- /package/{atoms/Prefetch → Prefetch}/index.js +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/AbstractScrollAnimation.d.ts +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/AbstractScrollAnimation.js +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimation.d.ts +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimation.js +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationChild.d.ts +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationChild.js +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationChildWithEase.js +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationParent.d.ts +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationParent.js +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/ScrollAnimationWithEase.js +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/animationScrollWithEase.d.ts +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/animationScrollWithEase.js +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/index.d.ts +0 -0
- /package/{atoms/ScrollAnimation → ScrollAnimation}/index.js +0 -0
- /package/{atoms/ScrollReveal → ScrollReveal}/index.d.ts +0 -0
- /package/{atoms/ScrollReveal → ScrollReveal}/index.js +0 -0
- /package/{primitives/Sentinel → Sentinel}/Sentinel.d.ts +0 -0
- /package/{primitives/Sentinel → Sentinel}/Sentinel.js +0 -0
- /package/{primitives/Sentinel → Sentinel}/index.d.ts +0 -0
- /package/{primitives/Sentinel → Sentinel}/index.js +0 -0
- /package/{molecules/Slider → Slider}/AbstractSliderChild.d.ts +0 -0
- /package/{molecules/Slider → Slider}/AbstractSliderChild.js +0 -0
- /package/{molecules/Slider → Slider}/Slider.d.ts +0 -0
- /package/{molecules/Slider → Slider}/Slider.js +0 -0
- /package/{molecules/Slider → Slider}/SliderBtn.d.ts +0 -0
- /package/{molecules/Slider → Slider}/SliderBtn.js +0 -0
- /package/{molecules/Slider → Slider}/SliderCount.d.ts +0 -0
- /package/{molecules/Slider → Slider}/SliderCount.js +0 -0
- /package/{molecules/Slider → Slider}/SliderDrag.d.ts +0 -0
- /package/{molecules/Slider → Slider}/SliderDrag.js +0 -0
- /package/{molecules/Slider → Slider}/SliderItem.d.ts +0 -0
- /package/{molecules/Slider → Slider}/SliderItem.js +0 -0
- /package/{molecules/Slider → Slider}/SliderProgress.d.ts +0 -0
- /package/{molecules/Slider → Slider}/SliderProgress.js +0 -0
- /package/{molecules/Slider → Slider}/index.d.ts +0 -0
- /package/{molecules/Slider → Slider}/index.js +0 -0
- /package/{molecules/Sticky → Sticky}/Sticky.twig +0 -0
- /package/{molecules/Sticky → Sticky}/index.d.ts +0 -0
- /package/{molecules/Sticky → Sticky}/index.js +0 -0
- /package/{molecules/TableOfContent → TableOfContent}/index.d.ts +0 -0
- /package/{molecules/TableOfContent → TableOfContent}/index.js +0 -0
- /package/{molecules/Tabs → Tabs}/Tabs.twig +0 -0
- /package/{molecules/Tabs → Tabs}/index.d.ts +0 -0
- /package/{molecules/Tabs → Tabs}/index.js +0 -0
- /package/{primitives/Transition → Transition}/index.d.ts +0 -0
- /package/{primitives/Transition → Transition}/index.js +0 -0
|
@@ -12,7 +12,11 @@
|
|
|
12
12
|
*/
|
|
13
13
|
#}
|
|
14
14
|
{%- set svg -%}
|
|
15
|
-
{
|
|
15
|
+
{% if ':' in name %}
|
|
16
|
+
{{ meta_icon(name) }}
|
|
17
|
+
{% else %}
|
|
18
|
+
{{ source('@svg/%s.svg'|format(name), ignore_missing = true) }}
|
|
19
|
+
{% endif %}
|
|
16
20
|
{%- endset -%}
|
|
17
21
|
|
|
18
22
|
{% if svg is not empty or not ignore_missing %}
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
{% for name, value in items %}
|
|
36
36
|
{%- set rendered_icon -%}
|
|
37
37
|
{%- block icon -%}
|
|
38
|
-
{%- include '@ui/
|
|
38
|
+
{%- include '@ui/Icon/Icon.twig' with {
|
|
39
39
|
name: name,
|
|
40
40
|
attr: icon_attributes,
|
|
41
41
|
ignore_missing: true
|
|
@@ -47,16 +47,16 @@
|
|
|
47
47
|
{% if value is iterable %}
|
|
48
48
|
{% set href = value.attr.href ?? value.href ?? null %}
|
|
49
49
|
{% set label = value.attr.label ?? value.label ?? (name|capitalize) %}
|
|
50
|
-
{% set title = value.attr.title ?? value.title %}
|
|
50
|
+
{% set title = value.attr.title ?? value.title ?? null %}
|
|
51
51
|
{% set tag = value.tag
|
|
52
52
|
?? (action_tag|default(href is defined and href is not null ? 'a' : 'button'))
|
|
53
53
|
%}
|
|
54
|
-
{% set current_attr = merge_html_attributes(value.attr ?? {}, action_attr) %}
|
|
54
|
+
{% set current_attr = merge_html_attributes(value.attr ?? {}, action_attr ?? {}) %}
|
|
55
55
|
{% else %}
|
|
56
56
|
{% set href = value %}
|
|
57
57
|
{% set label = name|capitalize %}
|
|
58
58
|
{% set tag = action_tag|default('a') %}
|
|
59
|
-
{% set current_attr = action_attr %}
|
|
59
|
+
{% set current_attr = action_attr ?? {} %}
|
|
60
60
|
{% endif %}
|
|
61
61
|
|
|
62
62
|
{% set action_attributes =
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/LargeText/LargeText.ts"],
|
|
4
4
|
"sourcesContent": ["import { Base, withMountWhenInView } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseInterface, ScrollServiceProps } from '@studiometa/js-toolkit';\nimport { damp, clamp, transform } from '@studiometa/js-toolkit/utils';\n\nexport interface LargeTextProps extends BaseProps {\n $refs: {\n target: HTMLElement;\n };\n $options: {\n skew: boolean;\n sensitivity: number;\n skewSensitivity: number;\n };\n}\n\n/**\n * Large text class.\n */\nexport class LargeText<T extends BaseProps = BaseProps>\n extends withMountWhenInView(Base, { rootMargin: '50%' })<T & LargeTextProps>\n implements BaseInterface\n{\n /**\n * Config.\n */\n static config = {\n name: 'LargeText',\n refs: ['target'],\n options: {\n skew: Boolean,\n sensitivity: {\n type: Number,\n default: 1,\n },\n skewSensitivity: {\n type: Number,\n default: 1,\n },\n },\n };\n\n /**\n * Translate X.\n */\n x = 0;\n\n /**\n * Scroll delta Y.\n */\n deltaY = 0;\n\n /**\n * Transform values.\n */\n transform = {\n skewX: 0,\n x: 0,\n };\n\n /**\n * Target width.\n */\n width = 0;\n\n /**\n * Set width on mount.\n */\n mounted() {\n this.width = this.$refs.target.clientWidth;\n }\n\n /**\n * Set width on resize.\n */\n resized() {\n this.width = this.$refs.target.clientWidth;\n }\n\n /**\n * Update delta scroll on scroll.\n */\n scrolled(props: ScrollServiceProps) {\n this.deltaY = props.delta.y;\n }\n\n /**\n * Update values on raf.\n */\n ticked() {\n this.x -= (Math.abs(this.deltaY) + 1) * this.$options.sensitivity;\n\n this.transform.x = damp(this.x, this.transform.x, 0.25);\n\n if (this.$options.skew) {\n this.transform.skewX = damp(\n clamp(this.deltaY * -1, -50, 50) * this.$options.skewSensitivity,\n this.transform.skewX,\n 0.25,\n );\n }\n\n if (this.x <= this.width * -1) {\n this.x = 0;\n this.transform.x += this.width;\n } else if (this.$options.sensitivity < 0 && this.x >= this.width) {\n this.x = 0;\n this.transform.x -= this.width;\n }\n\n return () => {\n transform(this.$refs.target, this.transform);\n };\n }\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,MAAM,2BAA2B;AAE1C,SAAS,MAAM,OAAO,iBAAiB;AAgBhC,MAAM,kBACH,oBAAoB,MAAM,EAAE,YAAY,MAAM,CAAC,EAEzD;AAAA;AAAA;AAAA;AAAA,EAIE,OAAO,SAAS;AAAA,IACd,MAAM;AAAA,IACN,MAAM,CAAC,QAAQ;AAAA,IACf,SAAS;AAAA,MACP,MAAM;AAAA,MACN,aAAa;AAAA,QACX,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,MACA,iBAAiB;AAAA,QACf,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI;AAAA;AAAA;AAAA;AAAA,EAKJ,SAAS;AAAA;AAAA;AAAA;AAAA,EAKT,YAAY;AAAA,IACV,OAAO;AAAA,IACP,GAAG;AAAA,EACL;AAAA;AAAA;AAAA;AAAA,EAKA,QAAQ;AAAA;AAAA;AAAA;AAAA,EAKR,UAAU;AACR,SAAK,QAAQ,KAAK,MAAM,OAAO;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA,EAKA,UAAU;AACR,SAAK,QAAQ,KAAK,MAAM,OAAO;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA,EAKA,SAAS,OAA2B;AAClC,SAAK,SAAS,MAAM,MAAM;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA,EAKA,SAAS;AACP,SAAK,MAAM,KAAK,IAAI,KAAK,MAAM,IAAI,KAAK,KAAK,SAAS;AAEtD,SAAK,UAAU,IAAI,KAAK,KAAK,GAAG,KAAK,UAAU,GAAG,IAAI;AAEtD,QAAI,KAAK,SAAS,MAAM;AACtB,WAAK,UAAU,QAAQ;AAAA,QACrB,MAAM,KAAK,SAAS,IAAI,KAAK,EAAE,IAAI,KAAK,SAAS;AAAA,QACjD,KAAK,UAAU;AAAA,QACf;AAAA,MACF;AAAA,IACF;AAEA,QAAI,KAAK,KAAK,KAAK,QAAQ,IAAI;AAC7B,WAAK,IAAI;AACT,WAAK,UAAU,KAAK,KAAK;AAAA,IAC3B,WAAW,KAAK,SAAS,cAAc,KAAK,KAAK,KAAK,KAAK,OAAO;AAChE,WAAK,IAAI;AACT,WAAK,UAAU,KAAK,KAAK;AAAA,IAC3B;AAEA,WAAO,MAAM;AACX,gBAAU,KAAK,MAAM,QAAQ,KAAK,SAAS;AAAA,IAC7C;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/LazyInclude/LazyInclude.ts"],
|
|
4
4
|
"sourcesContent": ["import { Base } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseInterface } from '@studiometa/js-toolkit';\n\nexport interface LazyIncludeProps extends BaseProps {\n $refs: {\n loading: HTMLElement;\n error: HTMLElement;\n };\n $options: {\n src: string;\n terminateOnLoad: boolean;\n };\n}\n\n/**\n * LazyInclude class.\n */\nexport class LazyInclude<T extends BaseProps = BaseProps>\n extends Base<T & LazyIncludeProps>\n implements BaseInterface\n{\n /**\n * Config.\n */\n static config = {\n name: 'LazyInclude',\n refs: ['loading', 'error'],\n emits: ['content', 'error', 'always'],\n options: {\n src: String,\n terminateOnLoad: Boolean,\n },\n };\n\n /**\n * Load the lazy content on mount.\n */\n mounted() {\n if (!this.$options.src) {\n this.$log('The `src` option is missing. Define it with the `data-option-src` attribute');\n return;\n }\n\n fetch(this.$options.src)\n .then((response) => response.text())\n .then((content) => {\n this.$emit('content', content);\n })\n .catch((error) => {\n this.$emit('error', error);\n })\n .finally(() => {\n this.$emit('always');\n });\n }\n\n /**\n * Set content.\n */\n onContent({ args: [content] }: { args: [string] }) {\n this.$refs.loading.style.display = 'none';\n this.$el.innerHTML = content;\n }\n\n /**\n * Set error.\n */\n onError() {\n this.$refs.error.style.display = 'block';\n }\n\n /**\n * Always.\n */\n onAlways() {\n if (this.$options.terminateOnLoad) {\n this.$terminate();\n }\n }\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,YAAY;AAiBd,MAAM,oBACH,KAEV;AAAA;AAAA;AAAA;AAAA,EAIE,OAAO,SAAS;AAAA,IACd,MAAM;AAAA,IACN,MAAM,CAAC,WAAW,OAAO;AAAA,IACzB,OAAO,CAAC,WAAW,SAAS,QAAQ;AAAA,IACpC,SAAS;AAAA,MACP,KAAK;AAAA,MACL,iBAAiB;AAAA,IACnB;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,UAAU;AACR,QAAI,CAAC,KAAK,SAAS,KAAK;AACtB,WAAK,KAAK,6EAA6E;AACvF;AAAA,IACF;AAEA,UAAM,KAAK,SAAS,GAAG,EACpB,KAAK,CAAC,aAAa,SAAS,KAAK,CAAC,EAClC,KAAK,CAAC,YAAY;AACjB,WAAK,MAAM,WAAW,OAAO;AAAA,IAC/B,CAAC,EACA,MAAM,CAAC,UAAU;AAChB,WAAK,MAAM,SAAS,KAAK;AAAA,IAC3B,CAAC,EACA,QAAQ,MAAM;AACb,WAAK,MAAM,QAAQ;AAAA,IACrB,CAAC;AAAA,EACL;AAAA;AAAA;AAAA;AAAA,EAKA,UAAU,EAAE,MAAM,CAAC,OAAO,EAAE,GAAuB;AACjD,SAAK,MAAM,QAAQ,MAAM,UAAU;AACnC,SAAK,IAAI,YAAY;AAAA,EACvB;AAAA;AAAA;AAAA;AAAA,EAKA,UAAU;AACR,SAAK,MAAM,MAAM,MAAM,UAAU;AAAA,EACnC;AAAA;AAAA;AAAA;AAAA,EAKA,WAAW;AACT,QAAI,KAAK,SAAS,iBAAiB;AACjC,WAAK,WAAW;AAAA,IAClB;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Menu/Menu.ts"],
|
|
4
4
|
"sourcesContent": ["import { Base, isDirectChild, getDirectChildren } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps, KeyServiceProps } from '@studiometa/js-toolkit';\nimport { nextTick } from '@studiometa/js-toolkit/utils';\nimport { MenuBtn } from './MenuBtn.js';\nimport { MenuList } from './MenuList.js';\n\nexport interface MenuProps extends BaseProps {\n $children: {\n // eslint-disable-next-line no-use-before-define\n Menu: Menu[];\n MenutBtn: MenuBtn[];\n MenuList: MenuList[];\n };\n $options: {\n mode: 'click' | 'hover';\n };\n}\n\n/**\n * Menu class.\n */\nexport class Menu<T extends BaseProps = BaseProps> extends Base<T & MenuProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'Menu',\n components: {\n MenuBtn,\n MenuList,\n Menu,\n },\n options: {\n mode: {\n type: String,\n default: 'click', // or 'hover'\n },\n },\n };\n\n /**\n * Get the first `MenuList` instance.\n */\n get menuList(): MenuList {\n return getDirectChildren<MenuList>(this, 'Menu', 'MenuList')[0];\n }\n\n /**\n * Get the first `MenuBtn` instance.\n */\n get menuBtn(): MenuBtn {\n return getDirectChildren<MenuBtn>(this, 'Menu', 'MenuBtn')[0];\n }\n\n /**\n * Test which mode to use.\n */\n get shouldReactOnClick(): boolean {\n return this.$options.mode === 'click';\n }\n\n /**\n * Wether the button or the items are hovered.\n */\n get isHover(): boolean {\n return this.menuBtn.isHover || this.menuList.isHover;\n }\n\n /**\n * Set attributes on mounted, destroy the component if it is missing required\n * child components.\n */\n mounted() {\n if (!this.menuBtn || !this.menuList) {\n return this.$destroy();\n }\n\n this.menuBtn.$el.setAttribute('aria-controls', this.$id);\n this.menuList.$el.setAttribute('id', this.$id);\n this.menuList.close();\n }\n\n /**\n * Keyboard management.\n */\n keyed({ ENTER, ESC, isUp }: KeyServiceProps) {\n if (!isUp) {\n return;\n }\n\n if (ESC) {\n this.close();\n return;\n }\n\n if (!this.shouldReactOnClick) {\n const hasFocusElementWithin = document.activeElement === this.menuBtn.$el;\n\n if (ENTER && hasFocusElementWithin) {\n this.toggle();\n }\n }\n }\n\n /**\n * Toggle menu items on button click.\n */\n onMenuBtnClick({ event, target }: { event: MouseEvent; target: MenuBtn }) {\n if (isDirectChild(this, 'Menu', 'MenuBtn', target) && this.shouldReactOnClick) {\n event.preventDefault();\n this.toggle();\n }\n }\n\n /**\n * Open menu items on button mouse enter.\n */\n onMenuBtnMouseenter({ target }: { target: MenuBtn }) {\n if (target === this.menuBtn && !this.shouldReactOnClick) {\n this.open();\n }\n }\n\n /**\n * Close menu items on button mouse leave.\n */\n onMenuBtnMouseleave() {\n if (this.shouldReactOnClick) {\n return;\n }\n\n nextTick(() => {\n if (!this.isHover) {\n this.close();\n }\n });\n }\n\n /**\n * Close menu items on button mouse leave.\n */\n onMenuListMouseleave() {\n if (this.shouldReactOnClick) {\n return;\n }\n\n nextTick(() => {\n if (!this.isHover) {\n this.close();\n }\n });\n }\n\n /**\n * Close other non-parent menu items on menu items open.\n */\n onMenuListItemsOpen({ target }: { target: MenuList }) {\n this.$children.MenuList.forEach((menuItem) => {\n if (!menuItem.$el.contains(target.$el)) {\n menuItem.close();\n }\n });\n }\n\n /**\n * Close the menu.\n */\n close() {\n this.menuList.close();\n }\n\n /**\n * Open the menu.\n */\n open() {\n this.menuList.open();\n }\n\n /**\n * Toggle the menu.\n */\n toggle() {\n this.menuList.toggle();\n }\n}\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Menu/MenuBtn.ts"],
|
|
4
4
|
"sourcesContent": ["import { Base } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\n\n/**\n * MenuBtn class.\n */\nexport class MenuBtn<T extends BaseProps = BaseProps> extends Base<T> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'MenuBtn',\n };\n\n /**\n * Wether the button is hovered or not.\n * @type {boolean}\n */\n isHover = false;\n\n /**\n * Dispatch the click event.\n * @param {MouseEvent} event\n * @returns {void}\n */\n onClick({ event }: { event: MouseEvent }) {\n event.stopPropagation();\n }\n\n /**\n * Dispatch the mouseenter event.\n * @param {MouseEvent} event\n * @returns {void}\n */\n onMouseenter({ event }: { event: MouseEvent }) {\n this.isHover = true;\n event.stopPropagation();\n }\n\n /**\n * Dispatch the mouseleave event.\n * @param {MouseEvent} event\n * @returns {void}\n */\n onMouseleave({ event }: { event: MouseEvent }) {\n this.isHover = false;\n event.stopPropagation();\n }\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,YAAY;AAMd,MAAM,gBAAiD,KAAQ;AAAA;AAAA;AAAA;AAAA,EAIpE,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,EACR;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOV,QAAQ,EAAE,MAAM,GAA0B;AACxC,UAAM,gBAAgB;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,aAAa,EAAE,MAAM,GAA0B;AAC7C,SAAK,UAAU;AACf,UAAM,gBAAgB;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,aAAa,EAAE,MAAM,GAA0B;AAC7C,SAAK,UAAU;AACf,UAAM,gBAAgB;AAAA,EACxB;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';
|
|
2
|
-
import { Transition } from '
|
|
2
|
+
import { Transition } from '../Transition/index.js';
|
|
3
3
|
export interface MenuListProps extends BaseProps {
|
|
4
4
|
$children: {
|
|
5
5
|
MenuList: MenuList[];
|
|
@@ -24,7 +24,7 @@ export declare class MenuList<T extends BaseProps = BaseProps> extends Transitio
|
|
|
24
24
|
/**
|
|
25
25
|
* Override `Transition` options.
|
|
26
26
|
*/
|
|
27
|
-
get $options(): import("@studiometa/js-toolkit
|
|
27
|
+
get $options(): import("@studiometa/js-toolkit").BaseOptions & (T & MenuListProps & import("../index.js").TransitionProps)["$options"];
|
|
28
28
|
/**
|
|
29
29
|
* Update tab indexes on mount.
|
|
30
30
|
*/
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/ui/Menu/MenuList.ts"],
|
|
4
|
+
"sourcesContent": ["import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { Transition } from '../Transition/index.js';\n\nconst FOCUSABLE_ELEMENTS = [\n 'a[href]:not([inert])',\n 'area[href]:not([inert])',\n 'input:not([disabled]):not([inert])',\n 'select:not([disabled]):not([inert])',\n 'textarea:not([disabled]):not([inert])',\n 'button:not([disabled]):not([inert])',\n 'iframe:not([inert])',\n 'audio:not([inert])',\n 'video:not([inert])',\n '[contenteditable]:not([inert])',\n '[tabindex]:not([inert])',\n].join(',');\n\nexport interface MenuListProps extends BaseProps {\n $children: {\n // eslint-disable-next-line no-use-before-define\n MenuList: MenuList[];\n };\n}\n\n/**\n * MenuList class.\n */\nexport class MenuList<T extends BaseProps = BaseProps> extends Transition<T & MenuListProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n ...Transition.config,\n name: 'MenuList',\n emits: ['items-open', 'items-close', 'items-mouseleave'],\n components: {\n MenuList,\n },\n };\n\n /**\n * Are the menu items visible?\n */\n isOpen = false;\n\n /**\n * Wether the component is hovered.\n */\n isHover = false;\n\n /**\n * Override `Transition` options.\n */\n // @ts-ignore\n get $options() {\n const options = super.$options;\n\n options.leaveKeep = true;\n options.enterKeep = true;\n\n return options;\n }\n\n /**\n * Update tab indexes on mount.\n */\n mounted() {\n this.__updateTabIndexes('close');\n }\n\n /**\n * Set hover state.\n */\n onMouseenter() {\n this.isHover = true;\n }\n\n /**\n * Unset hover state.\n */\n onMouseleave() {\n this.isHover = false;\n }\n\n /**\n * Display the menu items.\n */\n open() {\n if (this.isOpen) {\n return;\n }\n\n // @todo Remove event listener when the close method is called.\n const clickOutsideHandler = (event) => {\n if (!this.$el.contains(event.target)) {\n document.removeEventListener('click', clickOutsideHandler);\n this.close();\n }\n };\n document.addEventListener('click', clickOutsideHandler);\n\n this.__updateTabIndexes('open');\n this.$el.setAttribute('aria-hidden', 'false');\n this.isOpen = true;\n this.enter();\n this.$emit('items-open');\n }\n\n /**\n * Hide the menu items.\n */\n close() {\n if (!this.isOpen) {\n return;\n }\n\n // Close child menu items.\n this.$children.MenuList.forEach((menuItem) => {\n menuItem.close();\n });\n\n if (\n document.activeElement instanceof HTMLElement &&\n this.$el.contains(document.activeElement)\n ) {\n document.activeElement.blur();\n }\n\n this.$el.setAttribute('aria-hidden', 'true');\n this.__updateTabIndexes('close');\n this.isOpen = false;\n this.leave();\n this.$emit('items-close');\n }\n\n /**\n * Toggle the menu items.\n */\n toggle() {\n if (this.isOpen) {\n this.close();\n } else {\n this.open();\n }\n }\n\n /**\n * Update `tabindex` attribute of child focusable elements.\n * @private\n */\n __updateTabIndexes(mode: 'open' | 'close' = 'open') {\n const focusableItems = Array.from(this.$el.querySelectorAll(FOCUSABLE_ELEMENTS)).filter(\n (item) => this.__filterFocusableItems(item as HTMLElement),\n );\n\n focusableItems.forEach((item) => {\n if (mode === 'close') {\n item.setAttribute('tabindex', '-1');\n } else {\n item.removeAttribute('tabindex');\n }\n });\n }\n\n /**\n * Filter out items which are inside a child `MenuList` instance.\n * @private\n */\n __filterFocusableItems(item: HTMLElement): boolean {\n let ancestor = item.parentElement;\n\n // @ts-ignore\n while (ancestor && (!ancestor.__base__ || !ancestor.__base__.has(this.constructor))) {\n ancestor = ancestor.parentElement;\n }\n\n return ancestor === null || ancestor === this.$el;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Menu/index.ts"],
|
|
4
4
|
"sourcesContent": ["export * from './Menu.js';\nexport * from './MenuBtn.js';\nexport * from './MenuList.js';\n"],
|
|
5
5
|
"mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
@@ -78,7 +78,7 @@ export declare class Modal<T extends BaseProps = BaseProps> extends Base<T & Mod
|
|
|
78
78
|
/**
|
|
79
79
|
* Add the moved refs to `this.$refs` when using the `move` options.
|
|
80
80
|
*/
|
|
81
|
-
get $refs():
|
|
81
|
+
get $refs(): (T & ModalProps)["$refs"] & import("@studiometa/js-toolkit").BaseRefs;
|
|
82
82
|
/**
|
|
83
83
|
* Unbind all events on destroy.
|
|
84
84
|
*/
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Modal/Modal.ts"],
|
|
4
4
|
"sourcesContent": ["import { Base, KeyServiceProps } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';\nimport {\n transition,\n trapFocus as trap,\n untrapFocus as untrap,\n saveActiveElement,\n} from '@studiometa/js-toolkit/utils';\n\ntype ModalStates = Partial<\n Record<'open' | 'active' | 'closed', string | Partial<CSSStyleDeclaration>>\n>;\n// eslint-disable-next-line no-use-before-define\ntype ModalStylesOption = Partial<Record<keyof ModalProps['$refs'], ModalStates>>;\n\nexport interface ModalProps extends BaseProps {\n $refs: {\n close: HTMLElement[];\n container: HTMLElement;\n content: HTMLElement;\n modal: HTMLElement;\n open: HTMLElement[];\n overlay: HTMLElement;\n };\n $options: {\n /**\n * A selector where to move the modal to.\n */\n move: string;\n /**\n * A selector for the element to set the focus to when the modal opens.\n */\n autofocus: string;\n /**\n * Lock or allow scroll in the documentElement.\n */\n scrollLock: boolean;\n /**\n * The styles for the different state of the modal.\n */\n styles: ModalStylesOption;\n };\n}\n\n/**\n * Modal class.\n */\nexport class Modal<T extends BaseProps = BaseProps> extends Base<T & ModalProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'Modal',\n refs: ['close[]', 'container', 'content', 'modal', 'open[]', 'overlay'],\n emits: ['open', 'close'],\n options: {\n move: String,\n autofocus: { type: String, default: '[autofocus]' },\n styles: {\n type: Object,\n default: (): ModalStylesOption => ({\n modal: {\n closed: {\n opacity: '0',\n pointerEvents: 'none',\n visibility: 'hidden',\n },\n },\n }),\n },\n scrollLock: {\n type: Boolean,\n default: true,\n },\n },\n };\n\n /**\n * Wether the modal is open or not.\n */\n isOpen = false;\n\n /**\n * @private\n */\n __refsBackup: (T & ModalProps)['$refs'];\n\n /**\n * @private\n */\n __refModalPlaceholder: Comment;\n\n /**\n * @private\n */\n __refModalParentBackup: HTMLElement;\n\n /**\n * @private\n */\n __refModalUnbindGetRefFilter: () => void;\n\n /**\n * Open the modal on click on the `open` ref.\n */\n get onOpenClick() {\n return this.open;\n }\n\n /**\n * Close the modal on click on the `close` ref.\n */\n get onCloseClick() {\n return this.close;\n }\n\n /**\n * Close the modal on click on the `overlay` ref.\n * @returns {Function} The component's `close` method.\n */\n get onOverlayClick() {\n return this.close;\n }\n\n /**\n * Initialize the component's behaviours.\n */\n mounted() {\n this.isOpen = false;\n this.close();\n\n if (this.$options.move) {\n const target = document.querySelector(this.$options.move) || document.body;\n\n this.__refsBackup = this.$refs;\n this.__refModalPlaceholder = document.createComment('');\n this.__refModalParentBackup = this.$refs.modal.parentElement || this.$el;\n this.__refModalParentBackup.insertBefore(this.__refModalPlaceholder, this.$refs.modal);\n\n target.append(this.$refs.modal);\n }\n }\n\n /**\n * Add the moved refs to `this.$refs` when using the `move` options.\n */\n get $refs() {\n const $refs = super.$refs;\n\n if (this.$options.move && this.__refsBackup) {\n Object.entries(this.__refsBackup).forEach(([key, ref]) => {\n if (!$refs[key]) {\n // @ts-ignore\n $refs[key] = ref;\n }\n });\n }\n\n return $refs;\n }\n\n /**\n * Unbind all events on destroy.\n */\n destroyed() {\n this.close();\n\n if (this.$options.move && this.__refModalParentBackup) {\n this.__refModalParentBackup.insertBefore(this.$refs.modal, this.__refModalPlaceholder);\n this.__refModalPlaceholder.remove();\n delete this.__refModalPlaceholder;\n delete this.__refModalParentBackup;\n }\n\n return this;\n }\n\n /**\n * Close the modal on `ESC` and trap the tabulation.\n */\n keyed({ event, isUp, isDown, ESC }: KeyServiceProps) {\n if (!this.isOpen) {\n return;\n }\n\n if (isDown) {\n trap(this.$refs.modal, event);\n }\n\n if (ESC && isUp) {\n this.close();\n }\n }\n\n /**\n * Open the modal.\n */\n async open() {\n if (this.isOpen) {\n return Promise.resolve();\n }\n\n this.$refs.modal.setAttribute('aria-hidden', 'false');\n\n if (this.$options.scrollLock) {\n document.documentElement.style.overflow = 'hidden';\n }\n\n this.isOpen = true;\n this.$emit('open');\n\n /** @type {ModalRefs} */\n const refs = this.$refs;\n\n return Promise.all(\n Object.entries(this.$options.styles).map(\n ([refName, { open, active, closed } = { open: '', active: '', closed: '' }]) =>\n transition(\n refs[refName],\n {\n from: closed,\n active,\n to: open,\n },\n 'keep',\n ),\n ),\n ).then(() => {\n if (this.$options.autofocus && this.$refs.modal.querySelector(this.$options.autofocus)) {\n saveActiveElement();\n const autofocusElement = this.$refs.modal.querySelector(\n this.$options.autofocus,\n ) as HTMLElement;\n autofocusElement.focus();\n }\n return Promise.resolve();\n });\n }\n\n /**\n * Close the modal.\n */\n async close() {\n if (!this.isOpen) {\n return Promise.resolve();\n }\n\n this.$refs.modal.setAttribute('aria-hidden', 'true');\n\n if (this.$options.scrollLock) {\n document.documentElement.style.overflow = '';\n }\n\n this.isOpen = false;\n untrap();\n this.$emit('close');\n\n const refs = this.$refs;\n\n return Promise.all(\n Object.entries(this.$options.styles).map(\n ([refName, { open, active, closed } = { open: '', active: '', closed: '' }]) =>\n transition(\n refs[refName],\n {\n from: open,\n active,\n to: closed,\n },\n 'keep',\n ),\n ),\n ).then(() => Promise.resolve());\n }\n}\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": []
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
|
|
84
84
|
<div {{ html_attributes(attributes) }}>
|
|
85
85
|
{% block open %}
|
|
86
|
-
{% include '@ui/
|
|
86
|
+
{% include '@ui/Button/Button.twig' with {
|
|
87
87
|
label: 'Open',
|
|
88
88
|
attr: { data_ref: 'open[]' }
|
|
89
89
|
} %}
|
|
@@ -94,7 +94,7 @@
|
|
|
94
94
|
<div {{ html_attributes(container_attributes) }}>
|
|
95
95
|
{% block close %}
|
|
96
96
|
<div class="absolute top-0 right-0 m-2">
|
|
97
|
-
{% include '@ui/
|
|
97
|
+
{% include '@ui/Button/Button.twig' with {
|
|
98
98
|
label: 'Close',
|
|
99
99
|
attr: { data_ref: 'close[]' }
|
|
100
100
|
} %}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Modal/ModalWithTransition.ts"],
|
|
4
4
|
"sourcesContent": ["import type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';\nimport { Modal } from './Modal.js';\n\n/**\n * ModalWithTransition class.\n */\nexport class ModalWithTransition<T extends BaseProps = BaseProps> extends Modal<T> {\n /**\n * Modal options.\n */\n static config: BaseConfig = {\n name: 'ModalWithTransition',\n options: {\n styles: {\n type: Object,\n /**\n * @returns {ModalStylesOption}\n */\n default: () => ({\n modal: {\n closed: {\n opacity: '0',\n pointerEvents: 'none',\n },\n active: 'transition duration-500 ease-out-expo',\n },\n overlay: {\n closed: 'opacity-0',\n active: 'transition duration-500 ease-out-expo',\n },\n container: {\n closed: 'transform scale-95 opacity-0',\n active: 'transition duration-500 ease-out-expo',\n },\n }),\n },\n },\n };\n\n open() {\n this.$refs.modal.style.visibility = '';\n return super.open();\n }\n\n async close() {\n await super.close();\n this.$refs.modal.style.visibility = 'hidden';\n return Promise.resolve();\n }\n}\n"],
|
|
5
5
|
"mappings": "AACA,SAAS,aAAa;AAKf,MAAM,4BAA6D,MAAS;AAAA;AAAA;AAAA;AAAA,EAIjF,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,SAAS;AAAA,MACP,QAAQ;AAAA,QACN,MAAM;AAAA;AAAA;AAAA;AAAA,QAIN,SAAS,OAAO;AAAA,UACd,OAAO;AAAA,YACL,QAAQ;AAAA,cACN,SAAS;AAAA,cACT,eAAe;AAAA,YACjB;AAAA,YACA,QAAQ;AAAA,UACV;AAAA,UACA,SAAS;AAAA,YACP,QAAQ;AAAA,YACR,QAAQ;AAAA,UACV;AAAA,UACA,WAAW;AAAA,YACT,QAAQ;AAAA,YACR,QAAQ;AAAA,UACV;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,OAAO;AACL,SAAK,MAAM,MAAM,MAAM,aAAa;AACpC,WAAO,MAAM,KAAK;AAAA,EACpB;AAAA,EAEA,MAAM,QAAQ;AACZ,UAAM,MAAM,MAAM;AAClB,SAAK,MAAM,MAAM,MAAM,aAAa;AACpC,WAAO,QAAQ,QAAQ;AAAA,EACzB;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -23,10 +23,10 @@
|
|
|
23
23
|
*/
|
|
24
24
|
#}
|
|
25
25
|
|
|
26
|
-
{% extends '@ui/
|
|
26
|
+
{% extends '@ui/Modal/Modal.twig' %}
|
|
27
27
|
|
|
28
28
|
{% block open %}
|
|
29
|
-
{% include '@ui/
|
|
29
|
+
{% include '@ui/Button/StyledButton.twig' with {
|
|
30
30
|
label: 'Open',
|
|
31
31
|
attr: { data_ref: 'open[]' }
|
|
32
32
|
} %}
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
|
|
35
35
|
{% block close %}
|
|
36
36
|
<div class="absolute top-0 right-0 m-2">
|
|
37
|
-
{% include '@ui/
|
|
37
|
+
{% include '@ui/Button/StyledButton.twig' with {
|
|
38
38
|
label: 'Close',
|
|
39
39
|
attr: { data_ref: 'close[]' }
|
|
40
40
|
} %}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Modal/index.ts"],
|
|
4
4
|
"sourcesContent": ["export * from './Modal.js';\nexport * from './ModalWithTransition.js';\n"],
|
|
5
5
|
"mappings": "AAAA,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Panel/Panel.ts"],
|
|
4
4
|
"sourcesContent": ["import type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';\nimport { transition, matrix } from '@studiometa/js-toolkit/utils';\nimport { Modal } from '../Modal/index.js';\n\nexport interface PanelProps extends BaseProps {\n $options: {\n position: 'top' | 'right' | 'bottom' | 'left';\n };\n}\n\nconst DEFAULT_POSITION = 'left';\n\n/**\n * Panel class.\n */\nexport class Panel<T extends BaseProps = BaseProps> extends Modal<T & PanelProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'Panel',\n options: {\n position: {\n type: String,\n default: DEFAULT_POSITION,\n },\n },\n };\n\n static translateClasses = {\n top: '-translate-y-full',\n right: 'translate-x-full',\n bottom: 'translate-y-full',\n left: '-translate-x-full',\n };\n\n isClosing = false;\n\n /**\n * Get the translation class.\n * @returns {string}\n */\n get translateClass() {\n return (\n Panel.translateClasses[this.$options.position] ?? Panel.translateClasses[DEFAULT_POSITION]\n );\n }\n\n get containerOffset() {\n const { offsetTop, offsetLeft, offsetWidth, offsetHeight } = this.$refs.container;\n\n const store = {\n top: {\n translateY: (offsetTop + offsetHeight) * -1,\n },\n right: {\n translateX: window.innerWidth - offsetLeft + offsetWidth * 2,\n },\n bottom: {\n translateY: window.innerHeight - offsetTop + offsetHeight * 2,\n },\n left: {\n translateX: (offsetLeft + offsetWidth) * -1,\n },\n };\n\n return matrix(store[this.$options.position]);\n }\n\n /**\n * Animate before opening.\n * @this {PanelInterface}\n * @returns {Promise<void>}\n */\n async open() {\n if (this.isOpen) {\n return Promise.resolve();\n }\n\n this.$refs.modal.classList.remove('pointer-events-none');\n transition(\n this.$refs.container,\n {\n from: {\n transform: this.containerOffset,\n },\n to: {\n transform: 'none',\n },\n },\n 'keep',\n );\n transition(this.$refs.overlay, {\n from: 'opacity-0',\n });\n\n return super.open();\n }\n\n /**\n * Animate before closing.\n * @this {PanelInterface}\n * @returns {Promise<void>}\n */\n async close() {\n if (!this.isOpen || this.isClosing) {\n return Promise.resolve();\n }\n\n this.isClosing = true;\n\n this.$refs.modal.classList.add('pointer-events-none');\n await Promise.all([\n transition(\n this.$refs.container,\n {\n from: {\n transform: 'none',\n },\n to: {\n transform: this.containerOffset,\n },\n },\n 'keep',\n ),\n transition(\n this.$refs.overlay,\n {\n to: 'opacity-0',\n },\n 'keep',\n ),\n ]);\n\n this.isClosing = false;\n\n return super.close();\n }\n}\n"],
|
|
5
5
|
"mappings": "AACA,SAAS,YAAY,cAAc;AACnC,SAAS,aAAa;AAQtB,MAAM,mBAAmB;AAKlB,MAAM,cAA+C,MAAsB;AAAA;AAAA;AAAA;AAAA,EAIhF,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,SAAS;AAAA,MACP,UAAU;AAAA,QACR,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA,EAEA,OAAO,mBAAmB;AAAA,IACxB,KAAK;AAAA,IACL,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,EACR;AAAA,EAEA,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA,EAMZ,IAAI,iBAAiB;AACnB,WACE,MAAM,iBAAiB,KAAK,SAAS,QAAQ,KAAK,MAAM,iBAAiB,gBAAgB;AAAA,EAE7F;AAAA,EAEA,IAAI,kBAAkB;AACpB,UAAM,EAAE,WAAW,YAAY,aAAa,aAAa,IAAI,KAAK,MAAM;AAExE,UAAM,QAAQ;AAAA,MACZ,KAAK;AAAA,QACH,aAAa,YAAY,gBAAgB;AAAA,MAC3C;AAAA,MACA,OAAO;AAAA,QACL,YAAY,OAAO,aAAa,aAAa,cAAc;AAAA,MAC7D;AAAA,MACA,QAAQ;AAAA,QACN,YAAY,OAAO,cAAc,YAAY,eAAe;AAAA,MAC9D;AAAA,MACA,MAAM;AAAA,QACJ,aAAa,aAAa,eAAe;AAAA,MAC3C;AAAA,IACF;AAEA,WAAO,OAAO,MAAM,KAAK,SAAS,QAAQ,CAAC;AAAA,EAC7C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,MAAM,OAAO;AACX,QAAI,KAAK,QAAQ;AACf,aAAO,QAAQ,QAAQ;AAAA,IACzB;AAEA,SAAK,MAAM,MAAM,UAAU,OAAO,qBAAqB;AACvD;AAAA,MACE,KAAK,MAAM;AAAA,MACX;AAAA,QACE,MAAM;AAAA,UACJ,WAAW,KAAK;AAAA,QAClB;AAAA,QACA,IAAI;AAAA,UACF,WAAW;AAAA,QACb;AAAA,MACF;AAAA,MACA;AAAA,IACF;AACA,eAAW,KAAK,MAAM,SAAS;AAAA,MAC7B,MAAM;AAAA,IACR,CAAC;AAED,WAAO,MAAM,KAAK;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,MAAM,QAAQ;AACZ,QAAI,CAAC,KAAK,UAAU,KAAK,WAAW;AAClC,aAAO,QAAQ,QAAQ;AAAA,IACzB;AAEA,SAAK,YAAY;AAEjB,SAAK,MAAM,MAAM,UAAU,IAAI,qBAAqB;AACpD,UAAM,QAAQ,IAAI;AAAA,MAChB;AAAA,QACE,KAAK,MAAM;AAAA,QACX;AAAA,UACE,MAAM;AAAA,YACJ,WAAW;AAAA,UACb;AAAA,UACA,IAAI;AAAA,YACF,WAAW,KAAK;AAAA,UAClB;AAAA,QACF;AAAA,QACA;AAAA,MACF;AAAA,MACA;AAAA,QACE,KAAK,MAAM;AAAA,QACX;AAAA,UACE,IAAI;AAAA,QACN;AAAA,QACA;AAAA,MACF;AAAA,IACF,CAAC;AAED,SAAK,YAAY;AAEjB,WAAO,MAAM,MAAM;AAAA,EACrB;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -10,14 +10,14 @@
|
|
|
10
10
|
*/
|
|
11
11
|
#}
|
|
12
12
|
|
|
13
|
-
{% extends '@ui/
|
|
13
|
+
{% extends '@ui/Panel/Panel.twig' %}
|
|
14
14
|
|
|
15
15
|
{% set container_attr =
|
|
16
16
|
merge_html_attributes(container_attr ?? null, required = { class: 'bg-white' })
|
|
17
17
|
%}
|
|
18
18
|
|
|
19
19
|
{% block open %}
|
|
20
|
-
{% include '@ui/
|
|
20
|
+
{% include '@ui/Button/StyledButton.twig' with {
|
|
21
21
|
label: 'Open',
|
|
22
22
|
attr: { data_ref: 'open[]' }
|
|
23
23
|
} %}
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
|
|
26
26
|
{% block close %}
|
|
27
27
|
<div class="absolute top-0 right-0 m-2">
|
|
28
|
-
{% include '@ui/
|
|
28
|
+
{% include '@ui/Button/StyledButton.twig' with {
|
|
29
29
|
label: 'Close',
|
|
30
30
|
attr: { data_ref: 'close[]' }
|
|
31
31
|
} %}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Prefetch/AbstractPrefetch.ts"],
|
|
4
4
|
"sourcesContent": ["import { Base } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';\n\nexport interface AbstractPrefetchProps extends BaseProps {\n $el: HTMLAnchorElement;\n $options: {\n prefetch: boolean;\n };\n}\n\n/**\n * AbstractPrefetch class.\n */\nexport class AbstractPrefetch<T extends BaseProps = BaseProps> extends Base<\n T & AbstractPrefetchProps\n> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'AbstractPrefetch',\n options: {\n prefetch: {\n type: Boolean,\n default: true,\n },\n },\n };\n\n /**\n * Store prefetched URL.\n */\n static prefetchedUrls: Set<string> = new Set();\n\n /**\n * Is the given anchor prefetchable?\n */\n isPrefetchable(url: URL): boolean {\n if (!url || !url.href) {\n return false;\n }\n\n if (!this.$options.prefetch) {\n return false;\n }\n\n if (url.origin !== window.location.origin) {\n return false;\n }\n\n if (!['http:', 'https:'].includes(url.protocol)) {\n return false;\n }\n\n if (url.protocol === 'http:' && window.location.protocol === 'https:') {\n return false;\n }\n\n if (\n url.hash &&\n url.pathname + url.search === window.location.pathname + window.location.search\n ) {\n return false;\n }\n\n return true;\n }\n\n /**\n * Prefetch the given URL and terminate the component.\n */\n prefetch(url: URL) {\n if (AbstractPrefetch.prefetchedUrls.has(url.href)) {\n return;\n }\n\n if (!this.isPrefetchable(url)) {\n return;\n }\n\n const prefetcher = document.createElement('link');\n prefetcher.rel = 'prefetch';\n prefetcher.href = url.href;\n document.head.append(prefetcher);\n\n AbstractPrefetch.prefetchedUrls.add(url.href);\n\n this.$terminate();\n }\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,YAAY;AAad,MAAM,yBAA0D,KAErE;AAAA;AAAA;AAAA;AAAA,EAIA,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,SAAS;AAAA,MACP,UAAU;AAAA,QACR,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,OAAO,iBAA8B,oBAAI,IAAI;AAAA;AAAA;AAAA;AAAA,EAK7C,eAAe,KAAmB;AAChC,QAAI,CAAC,OAAO,CAAC,IAAI,MAAM;AACrB,aAAO;AAAA,IACT;AAEA,QAAI,CAAC,KAAK,SAAS,UAAU;AAC3B,aAAO;AAAA,IACT;AAEA,QAAI,IAAI,WAAW,OAAO,SAAS,QAAQ;AACzC,aAAO;AAAA,IACT;AAEA,QAAI,CAAC,CAAC,SAAS,QAAQ,EAAE,SAAS,IAAI,QAAQ,GAAG;AAC/C,aAAO;AAAA,IACT;AAEA,QAAI,IAAI,aAAa,WAAW,OAAO,SAAS,aAAa,UAAU;AACrE,aAAO;AAAA,IACT;AAEA,QACE,IAAI,QACJ,IAAI,WAAW,IAAI,WAAW,OAAO,SAAS,WAAW,OAAO,SAAS,QACzE;AACA,aAAO;AAAA,IACT;AAEA,WAAO;AAAA,EACT;AAAA;AAAA;AAAA;AAAA,EAKA,SAAS,KAAU;AACjB,QAAI,iBAAiB,eAAe,IAAI,IAAI,IAAI,GAAG;AACjD;AAAA,IACF;AAEA,QAAI,CAAC,KAAK,eAAe,GAAG,GAAG;AAC7B;AAAA,IACF;AAEA,UAAM,aAAa,SAAS,cAAc,MAAM;AAChD,eAAW,MAAM;AACjB,eAAW,OAAO,IAAI;AACtB,aAAS,KAAK,OAAO,UAAU;AAE/B,qBAAiB,eAAe,IAAI,IAAI,IAAI;AAE5C,SAAK,WAAW;AAAA,EAClB;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Prefetch/PrefetchWhenOver.ts"],
|
|
4
4
|
"sourcesContent": ["import type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';\nimport { AbstractPrefetch } from './AbstractPrefetch.js';\n\n/**\n * PrefetchWhenOver class.\n */\nexport class PrefetchWhenOver<T extends BaseProps = BaseProps> extends AbstractPrefetch<T> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n ...AbstractPrefetch.config,\n name: 'PrefetchWhenOver',\n };\n\n /**\n * Prefetch on mouseenter.\n */\n onMouseenter() {\n this.prefetch(new URL(this.$el.href));\n }\n}\n"],
|
|
5
5
|
"mappings": "AACA,SAAS,wBAAwB;AAK1B,MAAM,yBAA0D,iBAAoB;AAAA;AAAA;AAAA;AAAA,EAIzF,OAAO,SAAqB;AAAA,IAC1B,GAAG,iBAAiB;AAAA,IACpB,MAAM;AAAA,EACR;AAAA;AAAA;AAAA;AAAA,EAKA,eAAe;AACb,SAAK,SAAS,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAAA,EACtC;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Prefetch/PrefetchWhenVisible.ts"],
|
|
4
4
|
"sourcesContent": ["import { withMountWhenInView } from '@studiometa/js-toolkit';\nimport type { BaseConfig } from '@studiometa/js-toolkit';\nimport { AbstractPrefetch } from './AbstractPrefetch.js';\n\n/**\n * PrefetchWhenVisible class.\n */\nexport class PrefetchWhenVisible extends withMountWhenInView<AbstractPrefetch>(AbstractPrefetch) {\n /**\n * Config.\n */\n static config: BaseConfig = {\n ...AbstractPrefetch.config,\n name: 'PrefetchWhenVisible',\n };\n\n /**\n * Prefetch on mount.\n */\n mounted() {\n this.prefetch(new URL(this.$el.href));\n }\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,2BAA2B;AAEpC,SAAS,wBAAwB;AAK1B,MAAM,4BAA4B,oBAAsC,gBAAgB,EAAE;AAAA;AAAA;AAAA;AAAA,EAI/F,OAAO,SAAqB;AAAA,IAC1B,GAAG,iBAAiB;AAAA,IACpB,MAAM;AAAA,EACR;AAAA;AAAA;AAAA;AAAA,EAKA,UAAU;AACR,SAAK,SAAS,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAAA,EACtC;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/Prefetch/index.ts"],
|
|
4
4
|
"sourcesContent": ["export * from './AbstractPrefetch.js';\nexport * from './PrefetchWhenOver.js';\nexport * from './PrefetchWhenVisible.js';\n"],
|
|
5
5
|
"mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
<div {{ html_attributes(item_attributes) }}>
|
|
42
42
|
{% block icon %}
|
|
43
43
|
{% if item.icon %}
|
|
44
|
-
{% include '@ui/
|
|
44
|
+
{% include '@ui/Icon/IconImg.twig' with icon_attributes only %}
|
|
45
45
|
{% endif %}
|
|
46
46
|
{% endblock %}
|
|
47
47
|
{% block title %}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/ScrollAnimation/AbstractScrollAnimation.ts"],
|
|
4
4
|
"sourcesContent": ["import { Base, withFreezedOptions } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseConfig, ScrollInViewProps } from '@studiometa/js-toolkit';\nimport { map, clamp, animate } from '@studiometa/js-toolkit/utils';\nimport type { Keyframe } from '@studiometa/js-toolkit/utils';\n\nexport interface AbstractScrollAnimationProps extends BaseProps {\n $options: {\n playRange: [number, number];\n from: Keyframe;\n to: Keyframe;\n keyframes: Keyframe[];\n easing: [number, number, number, number];\n };\n}\n\n/**\n * AbstractScrollAnimation class.\n */\nexport class AbstractScrollAnimation<\n T extends BaseProps = BaseProps,\n> extends withFreezedOptions<Base>(Base)<T & AbstractScrollAnimationProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'AbstractScrollAnimation',\n options: {\n playRange: {\n type: Array,\n default: () => [0, 1],\n },\n from: {\n type: Object,\n default: () => ({}),\n },\n to: {\n type: Object,\n default: () => ({}),\n },\n keyframes: {\n type: Array,\n },\n easing: {\n type: Array,\n default: () => [0, 0, 1, 1],\n },\n },\n };\n\n /**\n * Get the target element for the animation.\n */\n get target() {\n return this.$el as HTMLElement;\n }\n\n /**\n * Lazily get animation.\n */\n get animation(): ReturnType<typeof animate> {\n let { keyframes } = this.$options;\n const { from, to } = this.$options;\n\n if (keyframes.length <= 0 && from && to) {\n keyframes = [from, to];\n }\n\n const animation = animate(this.target, keyframes, { easing: this.$options.easing });\n\n Object.defineProperty(this, 'animation', {\n value: animation,\n configurable: true,\n });\n\n return animation;\n }\n\n scrolledInView(props: ScrollInViewProps) {\n const progress = map(\n clamp(props.dampedProgress.y, this.$options.playRange[0], this.$options.playRange[1]),\n this.$options.playRange[0],\n this.$options.playRange[1],\n 0,\n 1,\n );\n\n this.render(progress);\n }\n\n /**\n * Render the animation for the given progress.\n */\n render(progress: number) {\n this.animation.progress(progress);\n }\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,MAAM,0BAA0B;AAEzC,SAAS,KAAK,OAAO,eAAe;AAgB7B,MAAM,gCAEH,mBAAyB,IAAI,EAAoC;AAAA;AAAA;AAAA;AAAA,EAIzE,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,SAAS;AAAA,MACP,WAAW;AAAA,QACT,MAAM;AAAA,QACN,SAAS,MAAM,CAAC,GAAG,CAAC;AAAA,MACtB;AAAA,MACA,MAAM;AAAA,QACJ,MAAM;AAAA,QACN,SAAS,OAAO,CAAC;AAAA,MACnB;AAAA,MACA,IAAI;AAAA,QACF,MAAM;AAAA,QACN,SAAS,OAAO,CAAC;AAAA,MACnB;AAAA,MACA,WAAW;AAAA,QACT,MAAM;AAAA,MACR;AAAA,MACA,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,SAAS,MAAM,CAAC,GAAG,GAAG,GAAG,CAAC;AAAA,MAC5B;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,SAAS;AACX,WAAO,KAAK;AAAA,EACd;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,YAAwC;AAC1C,QAAI,EAAE,UAAU,IAAI,KAAK;AACzB,UAAM,EAAE,MAAM,GAAG,IAAI,KAAK;AAE1B,QAAI,UAAU,UAAU,KAAK,QAAQ,IAAI;AACvC,kBAAY,CAAC,MAAM,EAAE;AAAA,IACvB;AAEA,UAAM,YAAY,QAAQ,KAAK,QAAQ,WAAW,EAAE,QAAQ,KAAK,SAAS,OAAO,CAAC;AAElF,WAAO,eAAe,MAAM,aAAa;AAAA,MACvC,OAAO;AAAA,MACP,cAAc;AAAA,IAChB,CAAC;AAED,WAAO;AAAA,EACT;AAAA,EAEA,eAAe,OAA0B;AACvC,UAAM,WAAW;AAAA,MACf,MAAM,MAAM,eAAe,GAAG,KAAK,SAAS,UAAU,CAAC,GAAG,KAAK,SAAS,UAAU,CAAC,CAAC;AAAA,MACpF,KAAK,SAAS,UAAU,CAAC;AAAA,MACzB,KAAK,SAAS,UAAU,CAAC;AAAA,MACzB;AAAA,MACA;AAAA,IACF;AAEA,SAAK,OAAO,QAAQ;AAAA,EACtB;AAAA;AAAA;AAAA;AAAA,EAKA,OAAO,UAAkB;AACvB,SAAK,UAAU,SAAS,QAAQ;AAAA,EAClC;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/ScrollAnimation/ScrollAnimation.ts"],
|
|
4
4
|
"sourcesContent": ["import { withScrolledInView } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { AbstractScrollAnimation } from './AbstractScrollAnimation.js';\n\nexport interface ScrollAnimationProps extends BaseProps {\n $refs: {\n target: HTMLElement;\n };\n}\n\n/**\n * ScrollAnimation class.\n */\nexport class ScrollAnimation<\n T extends BaseProps = BaseProps,\n> extends withScrolledInView<AbstractScrollAnimation>(AbstractScrollAnimation, {})<\n T & ScrollAnimationProps\n> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n ...AbstractScrollAnimation.config,\n name: 'ScrollAnimation',\n refs: ['target'],\n };\n\n /**\n * Use the `target` ref as animation target.\n */\n get target(): HTMLElement {\n return this.$refs.target;\n }\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,0BAA0B;AAEnC,SAAS,+BAA+B;AAWjC,MAAM,wBAEH,mBAA4C,yBAAyB,CAAC,CAAC,EAE/E;AAAA;AAAA;AAAA;AAAA,EAIA,OAAO,SAAqB;AAAA,IAC1B,GAAG,wBAAwB;AAAA,IAC3B,MAAM;AAAA,IACN,MAAM,CAAC,QAAQ;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,SAAsB;AACxB,WAAO,KAAK,MAAM;AAAA,EACpB;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/ScrollAnimation/ScrollAnimationChild.ts"],
|
|
4
4
|
"sourcesContent": ["import type {\n BaseConfig,\n BaseProps,\n ScrollInViewProps,\n WithScrolledInViewProps,\n} from '@studiometa/js-toolkit';\nimport { damp, clamp01 } from '@studiometa/js-toolkit/utils';\nimport { AbstractScrollAnimation } from './AbstractScrollAnimation.js';\n\nexport interface ScrollAnimationChildProps extends BaseProps {\n $options: WithScrolledInViewProps['$options'];\n}\n\nfunction updateProps(\n // eslint-disable-next-line no-use-before-define\n that: ScrollAnimationChild,\n props: ScrollInViewProps,\n dampFactor: number,\n dampPrecision: number,\n axis: 'x' | 'y' = 'x',\n) {\n that.dampedCurrent[axis] = damp(\n props.current[axis],\n that.dampedCurrent[axis],\n dampFactor,\n dampPrecision,\n );\n that.dampedProgress[axis] = clamp01(\n (that.dampedCurrent[axis] - props.start[axis]) / (props.end[axis] - props.start[axis]),\n );\n}\n\n/**\n * ScrollAnimationChild class.\n */\nexport class ScrollAnimationChild<T extends BaseProps = BaseProps> extends AbstractScrollAnimation<\n T & ScrollAnimationChildProps\n> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'ScrollAnimationChild',\n ...AbstractScrollAnimation.config,\n options: {\n ...AbstractScrollAnimation.config.options,\n dampFactor: {\n type: Number,\n default: 0.1,\n },\n dampPrecision: {\n type: Number,\n default: 0.001,\n },\n },\n };\n\n /**\n * Local damped current values.\n */\n dampedCurrent: ScrollInViewProps['dampedCurrent'] = {\n x: 0,\n y: 0,\n };\n\n /**\n * Local damped progress.\n */\n dampedProgress: ScrollInViewProps['dampedCurrent'] = {\n x: 0,\n y: 0,\n };\n\n /**\n * Compute local damped progress.\n */\n scrolledInView(props: ScrollInViewProps) {\n const { dampFactor, dampPrecision } = this.$options;\n\n updateProps(this, props, dampFactor, dampPrecision, 'x');\n updateProps(this, props, dampFactor, dampPrecision, 'y');\n\n props.dampedCurrent = this.dampedCurrent;\n props.dampedProgress = this.dampedProgress;\n\n super.scrolledInView(props);\n }\n}\n"],
|
|
5
5
|
"mappings": "AAMA,SAAS,MAAM,eAAe;AAC9B,SAAS,+BAA+B;AAMxC,SAAS,YAEP,MACA,OACA,YACA,eACA,OAAkB,KAClB;AACA,OAAK,cAAc,IAAI,IAAI;AAAA,IACzB,MAAM,QAAQ,IAAI;AAAA,IAClB,KAAK,cAAc,IAAI;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AACA,OAAK,eAAe,IAAI,IAAI;AAAA,KACzB,KAAK,cAAc,IAAI,IAAI,MAAM,MAAM,IAAI,MAAM,MAAM,IAAI,IAAI,IAAI,MAAM,MAAM,IAAI;AAAA,EACtF;AACF;AAKO,MAAM,6BAA8D,wBAEzE;AAAA;AAAA;AAAA;AAAA,EAIA,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,GAAG,wBAAwB;AAAA,IAC3B,SAAS;AAAA,MACP,GAAG,wBAAwB,OAAO;AAAA,MAClC,YAAY;AAAA,QACV,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,MACA,eAAe;AAAA,QACb,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,gBAAoD;AAAA,IAClD,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA;AAAA;AAAA;AAAA,EAKA,iBAAqD;AAAA,IACnD,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA;AAAA;AAAA;AAAA,EAKA,eAAe,OAA0B;AACvC,UAAM,EAAE,YAAY,cAAc,IAAI,KAAK;AAE3C,gBAAY,MAAM,OAAO,YAAY,eAAe,GAAG;AACvD,gBAAY,MAAM,OAAO,YAAY,eAAe,GAAG;AAEvD,UAAM,gBAAgB,KAAK;AAC3B,UAAM,iBAAiB,KAAK;AAE5B,UAAM,eAAe,KAAK;AAAA,EAC5B;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { BaseConfig } from '@studiometa/js-toolkit';
|
|
2
|
-
declare const ScrollAnimationChildWithEase_base: import("@studiometa/js-toolkit").BaseDecorator<import("./animationScrollWithEase.js").AnimationScrollWithEaseInterface, import("
|
|
2
|
+
declare const ScrollAnimationChildWithEase_base: import("@studiometa/js-toolkit").BaseDecorator<import("./animationScrollWithEase.js").AnimationScrollWithEaseInterface, import("./AbstractScrollAnimation.js").AbstractScrollAnimation<import("@studiometa/js-toolkit").BaseProps>, import("./animationScrollWithEase.js").AnimationScrollWithEaseProps>;
|
|
3
3
|
/**
|
|
4
4
|
* ScrollAnimationChild class.
|
|
5
5
|
*/
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/ScrollAnimation/ScrollAnimationChildWithEase.ts"],
|
|
4
4
|
"sourcesContent": ["import type { BaseConfig } from '@studiometa/js-toolkit';\nimport { ScrollAnimationChild } from './ScrollAnimationChild.js';\nimport { animationScrollWithEase } from './animationScrollWithEase.js';\n\n/**\n * ScrollAnimationChild class.\n */\nexport class ScrollAnimationChildWithEase extends animationScrollWithEase(ScrollAnimationChild) {\n /**\n * Config.\n */\n static config: BaseConfig = {\n ...ScrollAnimationChild.config,\n name: 'ScrollAnimationChildWithEase',\n };\n}\n"],
|
|
5
5
|
"mappings": "AACA,SAAS,4BAA4B;AACrC,SAAS,+BAA+B;AAKjC,MAAM,qCAAqC,wBAAwB,oBAAoB,EAAE;AAAA;AAAA;AAAA;AAAA,EAI9F,OAAO,SAAqB;AAAA,IAC1B,GAAG,qBAAqB;AAAA,IACxB,MAAM;AAAA,EACR;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/ScrollAnimation/ScrollAnimationParent.ts"],
|
|
4
4
|
"sourcesContent": ["import { Base, ScrollInViewProps, withScrolledInView } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { ScrollAnimationChild } from './ScrollAnimationChild.js';\n\nexport interface ScrollAnimationParentProps extends BaseProps {\n $children: {\n ScrollAnimationChild: ScrollAnimationChild[];\n };\n}\n\n/**\n * ScrollAnimationParent class.\n */\nexport class ScrollAnimationParent<T extends BaseProps = BaseProps> extends withScrolledInView(\n Base,\n {},\n)<T & ScrollAnimationParentProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'ScrollAnimationParent',\n components: {\n ScrollAnimationChild,\n },\n };\n\n /**\n * Scrolled in view hook.\n */\n scrolledInView(props: ScrollInViewProps) {\n this.$children.ScrollAnimationChild.forEach((child) => {\n child.scrolledInView(props);\n });\n }\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,MAAyB,0BAA0B;AAE5D,SAAS,4BAA4B;AAW9B,MAAM,8BAA+D;AAAA,EAC1E;AAAA,EACA,CAAC;AACH,EAAkC;AAAA;AAAA;AAAA;AAAA,EAIhC,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,YAAY;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,eAAe,OAA0B;AACvC,SAAK,UAAU,qBAAqB,QAAQ,CAAC,UAAU;AACrD,YAAM,eAAe,KAAK;AAAA,IAC5B,CAAC;AAAA,EACH;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
declare const ScrollAnimationWithEase_base: import("@studiometa/js-toolkit").BaseDecorator<import("./animationScrollWithEase.js").AnimationScrollWithEaseInterface, import("
|
|
1
|
+
declare const ScrollAnimationWithEase_base: import("@studiometa/js-toolkit").BaseDecorator<import("./animationScrollWithEase.js").AnimationScrollWithEaseInterface, import("./AbstractScrollAnimation.js").AbstractScrollAnimation<import("@studiometa/js-toolkit").BaseProps>, import("./animationScrollWithEase.js").AnimationScrollWithEaseProps>;
|
|
2
2
|
/**
|
|
3
3
|
* ScrollAnimation class.
|
|
4
4
|
*/
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/ScrollAnimation/ScrollAnimationWithEase.ts"],
|
|
4
4
|
"sourcesContent": ["import { ScrollAnimation } from './ScrollAnimation.js';\nimport { animationScrollWithEase } from './animationScrollWithEase.js';\n\n/**\n * ScrollAnimation class.\n */\nexport class ScrollAnimationWithEase extends animationScrollWithEase(ScrollAnimation) {\n /**\n * Config.\n */\n static config = {\n ...ScrollAnimation.config,\n name: 'ScrollAnimationWithEase',\n };\n}\n"],
|
|
5
5
|
"mappings": "AAAA,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AAKjC,MAAM,gCAAgC,wBAAwB,eAAe,EAAE;AAAA;AAAA;AAAA;AAAA,EAIpF,OAAO,SAAS;AAAA,IACd,GAAG,gBAAgB;AAAA,IACnB,MAAM;AAAA,EACR;AACF;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/ScrollAnimation/animationScrollWithEase.ts"],
|
|
4
4
|
"sourcesContent": ["import type { BaseConfig, BaseProps, BaseDecorator, BaseInterface } from '@studiometa/js-toolkit';\nimport { ease } from '@studiometa/js-toolkit/utils';\nimport type { AbstractScrollAnimation } from './AbstractScrollAnimation.js';\n\nconst regex = /ease([A-Z])/;\nconst eases = Object.fromEntries(\n Object.entries(ease)\n .filter(([name]) => name.startsWith('ease'))\n .map(([name, value]) => [name.replace(regex, (match, $1) => $1.toLowerCase()), value]),\n);\n\nexport interface AnimationScrollWithEaseProps extends BaseProps {\n $options: {\n ease: string;\n };\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface AnimationScrollWithEaseInterface extends BaseInterface {}\n\n/**\n * Extend a `ScrollAnimation` component to use easings.\n */\nexport function animationScrollWithEase<S extends AbstractScrollAnimation>(\n ScrollAnimation: typeof AbstractScrollAnimation,\n): BaseDecorator<AnimationScrollWithEaseInterface, S, AnimationScrollWithEaseProps> {\n class AnimationScrollWithEase extends ScrollAnimation<AnimationScrollWithEaseProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n ...ScrollAnimation.config,\n name: `${ScrollAnimation.config.name}WithEase`,\n options: {\n ...ScrollAnimation.config.options,\n ease: {\n type: String,\n default: 'outExpo',\n },\n },\n };\n\n /**\n * Eases the progress value.\n */\n render(progress: number) {\n if (typeof eases[this.$options.ease] === 'function') {\n // eslint-disable-next-line no-param-reassign\n progress = eases[this.$options.ease](progress);\n }\n\n super.render(progress);\n }\n }\n\n // @ts-ignore\n return AnimationScrollWithEase;\n}\n"],
|
|
5
5
|
"mappings": "AACA,SAAS,YAAY;AAGrB,MAAM,QAAQ;AACd,MAAM,QAAQ,OAAO;AAAA,EACnB,OAAO,QAAQ,IAAI,EAChB,OAAO,CAAC,CAAC,IAAI,MAAM,KAAK,WAAW,MAAM,CAAC,EAC1C,IAAI,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,KAAK,QAAQ,OAAO,CAAC,OAAO,OAAO,GAAG,YAAY,CAAC,GAAG,KAAK,CAAC;AACzF;AAcO,SAAS,wBACd,iBACkF;AAAA,EAClF,MAAM,gCAAgC,gBAA8C;AAAA;AAAA;AAAA;AAAA,IAIlF,OAAO,SAAqB;AAAA,MAC1B,GAAG,gBAAgB;AAAA,MACnB,MAAM,GAAG,gBAAgB,OAAO,IAAI;AAAA,MACpC,SAAS;AAAA,QACP,GAAG,gBAAgB,OAAO;AAAA,QAC1B,MAAM;AAAA,UACJ,MAAM;AAAA,UACN,SAAS;AAAA,QACX;AAAA,MACF;AAAA,IACF;AAAA;AAAA;AAAA;AAAA,IAKA,OAAO,UAAkB;AACvB,UAAI,OAAO,MAAM,KAAK,SAAS,IAAI,MAAM,YAAY;AAEnD,mBAAW,MAAM,KAAK,SAAS,IAAI,EAAE,QAAQ;AAAA,MAC/C;AAEA,YAAM,OAAO,QAAQ;AAAA,IACvB;AAAA,EACF;AAGA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
3
|
+
"sources": ["../../packages/ui/ScrollAnimation/index.ts"],
|
|
4
4
|
"sourcesContent": ["export * from './AbstractScrollAnimation.js';\nexport * from './animationScrollWithEase.js';\nexport * from './ScrollAnimation.js';\nexport * from './ScrollAnimationWithEase.js';\nexport * from './ScrollAnimationChild.js';\nexport * from './ScrollAnimationChildWithEase.js';\nexport * from './ScrollAnimationParent.js';\n"],
|
|
5
5
|
"mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ScrollServiceProps } from '@studiometa/js-toolkit';
|
|
2
2
|
import type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';
|
|
3
|
-
import { Transition } from '
|
|
3
|
+
import { Transition } from '../Transition/index.js';
|
|
4
4
|
export interface ScrollRevealProps extends BaseProps {
|
|
5
5
|
$refs: {
|
|
6
6
|
target?: HTMLElement;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/ui/ScrollReveal/ScrollReveal.ts"],
|
|
4
|
+
"sourcesContent": ["import { withMountWhenInView, useScroll, ScrollServiceProps } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';\nimport { Transition } from '../Transition/index.js';\n\nexport interface ScrollRevealProps extends BaseProps {\n $refs: {\n target?: HTMLElement;\n };\n $options: {\n repeat: boolean;\n };\n}\n\n/**\n * ScrollReveal class.\n */\nexport class ScrollReveal<T extends BaseProps = BaseProps> extends withMountWhenInView<Transition>(\n Transition,\n)<T & ScrollRevealProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n ...Transition.config,\n name: 'ScrollReveal',\n refs: ['target'],\n options: {\n ...Transition.config.options,\n enterKeep: {\n type: Boolean,\n default: true,\n },\n repeat: Boolean,\n intersectionObserver: {\n type: Object,\n default: () => ({ threshold: [0, 1] }),\n },\n },\n };\n\n /**\n * Vertical scroll direction.\n */\n static scrollDirectionY: ScrollServiceProps['direction']['y'] = 'NONE';\n\n /**\n * Get the transition target.\n */\n get target(): HTMLElement {\n return this.$refs.target ?? this.$el;\n }\n\n /**\n * Trigger the `enter` transition on mount.\n */\n mounted() {\n if (!this.$options.repeat) {\n this.enter();\n this.$terminate();\n return;\n }\n\n const scroll = useScroll();\n\n if (!scroll.has('ScrollRevealRepeat')) {\n scroll.add('ScrollRevealRepeat', (props) => {\n ScrollReveal.scrollDirectionY = props.direction.y;\n });\n }\n\n if (ScrollReveal.scrollDirectionY !== 'UP') {\n this.enter();\n }\n }\n}\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,qBAAqB,iBAAqC;AAEnE,SAAS,kBAAkB;AAcpB,MAAM,qBAAsD;AAAA,EACjE;AACF,EAAyB;AAAA;AAAA;AAAA;AAAA,EAIvB,OAAO,SAAqB;AAAA,IAC1B,GAAG,WAAW;AAAA,IACd,MAAM;AAAA,IACN,MAAM,CAAC,QAAQ;AAAA,IACf,SAAS;AAAA,MACP,GAAG,WAAW,OAAO;AAAA,MACrB,WAAW;AAAA,QACT,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,MACA,QAAQ;AAAA,MACR,sBAAsB;AAAA,QACpB,MAAM;AAAA,QACN,SAAS,OAAO,EAAE,WAAW,CAAC,GAAG,CAAC,EAAE;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,OAAO,mBAAyD;AAAA;AAAA;AAAA;AAAA,EAKhE,IAAI,SAAsB;AACxB,WAAO,KAAK,MAAM,UAAU,KAAK;AAAA,EACnC;AAAA;AAAA;AAAA;AAAA,EAKA,UAAU;AACR,QAAI,CAAC,KAAK,SAAS,QAAQ;AACzB,WAAK,MAAM;AACX,WAAK,WAAW;AAChB;AAAA,IACF;AAEA,UAAM,SAAS,UAAU;AAEzB,QAAI,CAAC,OAAO,IAAI,oBAAoB,GAAG;AACrC,aAAO,IAAI,sBAAsB,CAAC,UAAU;AAC1C,qBAAa,mBAAmB,MAAM,UAAU;AAAA,MAClD,CAAC;AAAA,IACH;AAEA,QAAI,aAAa,qBAAqB,MAAM;AAC1C,WAAK,MAAM;AAAA,IACb;AAAA,EACF;AACF;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|