@broxus/react-uikit 0.18.0 → 0.19.0

package/dist/esm/styles/modal.scss

@@ -1 +0,0 @@
-@import '../components/Modal/index.scss';

package/dist/esm/styles/motion.scss

@@ -1,624 +0,0 @@
-// Name:            Motion
-// Description:     Utilities for keyframe motions
-//
-// Component:       `uk-motion-*`
-//
-// Modifiers:       `uk-motion-collapse`
-//                  `uk-motion-scale-up`
-//                  `uk-motion-scale-down`
-//                  `uk-motion-scale-left`
-//                  `uk-motion-scale-right`
-//                  `uk-motion-zoom-in`
-//                  `uk-motion-zoom-out`
-//
-// ========================================================================
-
-
-// Variables
-// ========================================================================
-
-@import 'variables.scss';
-
-
-/* Motions
- ========================================================================== */
-
-/*
- * Noop
- */
-
-.uk-motion-noop {
-    transition: all var(--transition-medium-fast-duration) var(--ease-in-out);
-}
-
-
-/*
- * Collapse
- */
-
-.uk-motion-collapse {
-    overflow: hidden;
-    transition: height var(--transition-medium-fast-duration) var(--ease-in-out),
-        opacity var(--transition-medium-fast-duration) var(--ease-in-out);
-}
-
-/*
- * Zoom
- */
-
-.uk-motion-zoom {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-    transform-origin: 0 0;
-    will-change: opacity, transform;
-
-    &-appear,
-    &-enter {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-circ);
-        opacity: 0;
-        transform: scale(0);
-
-        &-active {
-            animation-name: uk-scale-zoom-in;
-            animation-play-state: running;
-        }
-
-        &-prepare { transform: none; }
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-out-circ);
-
-        &-active {
-            animation-name: uk-scale-zoom-out;
-            animation-play-state: running;
-        }
-    }
-}
-
-
-/*
- * Fade
- */
-
-.uk-motion-fade {
-    animation-duration: var(--animation-fade-duration);
-    animation-fill-mode: both;
-    will-change: opacity;
-
-    &-appear,
-    &-enter {
-        animation-timing-function: linear;
-        opacity: 0;
-
-        &-active {
-            animation-name: uk-fade;
-            animation-play-state: running;
-        }
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: linear;
-
-        &-active {
-            animation-direction: reverse;
-            animation-name: uk-fade;
-            animation-play-state: running;
-            pointer-events: none;
-        }
-    }
-}
-
-
-/*
- * Scale Up
- */
-
-.uk-motion-scale-up {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-    will-change: opacity, transform;
-
-    &-appear,
-    &-enter {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-quint);
-        opacity: 0;
-
-        &-active {
-            animation-name: uk-scale-up-in;
-            animation-play-state: running;
-        }
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-quint);
-
-        &-active {
-            animation-name: uk-scale-up-out;
-            animation-play-state: running;
-            pointer-events: none;
-        }
-    }
-}
-
-/*
- * Scale Down
- */
-
-.uk-motion-scale-down {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-    will-change: opacity, transform;
-
-    &-appear,
-    &-enter {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-quint);
-        opacity: 0;
-
-        &-active {
-            animation-name: uk-scale-down-in;
-            animation-play-state: running;
-        }
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-quint);
-
-        &-active {
-            animation-name: uk-scale-down-out;
-            animation-play-state: running;
-            pointer-events: none;
-        }
-    }
-}
-
-/*
- * Scale Left
- */
-
-.uk-motion-scale-left {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-    will-change: opacity, transform;
-
-    &-appear,
-    &-enter {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-quint);
-        opacity: 0;
-
-        &-active {
-            animation-name: uk-scale-left-in;
-            animation-play-state: running;
-        }
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-quint);
-
-        &-active {
-            animation-name: uk-scale-left-out;
-            animation-play-state: running;
-            pointer-events: none;
-        }
-    }
-}
-
-/*
- * Scale Right
- */
-
-.uk-motion-scale-right {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-    will-change: opacity, transform;
-
-    &-appear,
-    &-enter {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-quint);
-        opacity: 0;
-
-        &-active {
-            animation-name: uk-scale-right-in;
-            animation-play-state: running;
-        }
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-quint);
-
-        &-active {
-            animation-name: uk-scale-right-out;
-            animation-play-state: running;
-            pointer-events: none;
-        }
-    }
-}
-
-
-/*
- * Slide Top Small
- */
-
-.uk-motion-slide-top-small {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-
-    &-enter,
-    &-appear {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-quint);
-        opacity: 0;
-    }
-
-    &-enter-active,
-    &-appear-active {
-        animation-name: uk-slide-top-small-in;
-        animation-play-state: running;
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-quint);
-    }
-
-    &-leave-active {
-        animation-name: uk-slide-top-small-out;
-        animation-play-state: running;
-        pointer-events: none;
-    }
-}
-
-/*
- * Slide Bottom Small
- */
-
-.uk-motion-slide-bottom-small {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-
-    &-enter,
-    &-appear {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-quint);
-        opacity: 0;
-    }
-
-    &-enter-active,
-    &-appear-active {
-        animation-name: uk-slide-bottom-small-in;
-        animation-play-state: running;
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-quint);
-    }
-
-    &-leave-active {
-        animation-name: uk-slide-bottom-small-out;
-        animation-play-state: running;
-        pointer-events: none;
-    }
-}
-
-/*
- * Slide Left Small
- */
-
-.uk-motion-slide-left-small {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-
-    &-enter,
-    &-appear {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-quint);
-        opacity: 0;
-    }
-
-    &-enter-active,
-    &-appear-active {
-        animation-name: uk-slide-left-small-in;
-        animation-play-state: running;
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-quint);
-    }
-
-    &-leave-active {
-        animation-name: uk-slide-left-small-out;
-        animation-play-state: running;
-        pointer-events: none;
-    }
-}
-
-/*
- * Slide Right Small
- */
-
-.uk-motion-slide-right-small {
-    animation-duration: var(--animation-medium-fast-duration);
-    animation-fill-mode: both;
-
-    &-enter,
-    &-appear {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-out-quint);
-        opacity: 0;
-    }
-
-    &-enter-active,
-    &-appear-active {
-        animation-name: uk-slide-right-small-in;
-        animation-play-state: running;
-    }
-
-    &-leave {
-        animation-play-state: paused;
-        animation-timing-function: var(--ease-in-quint);
-    }
-
-    &-leave-active {
-        animation-name: uk-slide-right-small-out;
-        animation-play-state: running;
-        pointer-events: none;
-    }
-}
-
-
-/* Keyframes used by motion classes
- ========================================================================== */
-
-@keyframes uk-slide-top-small-in {
-    0% {
-        opacity: 0;
-        transform: translateY(unquote('calc(var(--animation-slide-small-translate) * -1)'));
-    }
-
-    100% {
-        opacity: 1;
-        transform: translateY(0);
-    }
-}
-
-@keyframes uk-slide-top-small-out {
-    0% {
-        opacity: 1;
-        transform: translateY(0);
-    }
-
-    100% {
-        opacity: 0;
-        transform: translateY(unquote('calc(var(--animation-slide-small-translate) * -1)'));
-    }
-}
-
-@keyframes uk-slide-bottom-small-in {
-    0% {
-        opacity: 0;
-        transform: translateY(var(--animation-slide-small-translate));
-    }
-
-    100% {
-        opacity: 1;
-        transform: translateY(0);
-    }
-}
-
-@keyframes uk-slide-bottom-small-out {
-    0% {
-        opacity: 1;
-        transform: translateY(0);
-    }
-
-    100% {
-        opacity: 0;
-        transform: translateY(var(--animation-slide-small-translate));
-    }
-}
-
-@keyframes uk-slide-left-small-in {
-    0% {
-        opacity: 0;
-        transform: translateX(unquote('calc(var(--animation-slide-small-translate) * -1)'));
-    }
-
-    100% {
-        opacity: 1;
-        transform: translateX(0);
-    }
-}
-
-@keyframes uk-slide-left-small-out {
-    0% {
-        opacity: 1;
-        transform: translateX(0);
-    }
-
-    100% {
-        opacity: 0;
-        transform: translateX(unquote('calc(var(--animation-slide-small-translate) * -1)'));
-    }
-}
-
-@keyframes uk-slide-right-small-in {
-    0% {
-        opacity: 0;
-        transform: translateX(var(--animation-slide-small-translate));
-    }
-
-    100% {
-        opacity: 1;
-        transform: translateX(0);
-    }
-}
-
-@keyframes uk-slide-right-small-out {
-    0% {
-        opacity: 1;
-        transform: translateX(0);
-    }
-
-    100% {
-        opacity: 0;
-        transform: translateX(var(--animation-slide-small-translate));
-    }
-}
-
-@keyframes uk-scale-up-in {
-    0% {
-        opacity: 0;
-        transform: scaleY(0.8);
-        transform-origin: 0 0;
-    }
-
-    100% {
-        opacity: 1;
-        transform: scaleY(1);
-        transform-origin: 0 0;
-    }
-}
-
-@keyframes uk-scale-up-out {
-    0% {
-        opacity: 1;
-        transform: scaleY(1);
-        transform-origin: 0 0;
-    }
-
-    100% {
-        opacity: 0;
-        transform: scaleY(0.8);
-        transform-origin: 0 0;
-    }
-}
-
-@keyframes uk-scale-down-in {
-    0% {
-        opacity: 0;
-        transform: scaleY(0.8);
-        transform-origin: 100% 100%;
-    }
-
-    100% {
-        opacity: 1;
-        transform: scaleY(1);
-        transform-origin: 100% 100%;
-    }
-}
-
-@keyframes uk-scale-down-out {
-    0% {
-        opacity: 1;
-        transform: scaleY(1);
-        transform-origin: 100% 100%;
-    }
-
-    100% {
-        opacity: 0;
-        transform: scaleY(0.8);
-        transform-origin: 100% 100%;
-    }
-}
-
-@keyframes uk-scale-left-in {
-    0% {
-        opacity: 0;
-        transform: scaleX(0.8);
-        transform-origin: 0 0;
-    }
-
-    100% {
-        opacity: 1;
-        transform: scaleX(1);
-        transform-origin: 0 0;
-    }
-}
-
-@keyframes uk-scale-left-out {
-    0% {
-        opacity: 1;
-        transform: scaleX(1);
-        transform-origin: 0 0;
-    }
-
-    100% {
-        opacity: 0;
-        transform: scaleX(0.8);
-        transform-origin: 0 0;
-    }
-}
-
-@keyframes uk-scale-right-in {
-    0% {
-        opacity: 0;
-        transform: scaleX(0.8);
-        transform-origin: 100% 0;
-    }
-
-    100% {
-        opacity: 1;
-        transform: scaleX(1);
-        transform-origin: 100% 0;
-    }
-}
-
-@keyframes uk-scale-right-out {
-    0% {
-        opacity: 1;
-        transform: scaleX(1);
-        transform-origin: 100% 0;
-    }
-
-    100% {
-        opacity: 0;
-        transform: scaleX(0.8);
-        transform-origin: 100% 0;
-    }
-}
-
-@keyframes uk-scale-zoom-in {
-    0% {
-        opacity: 0;
-        transform: scale(0.8);
-    }
-
-    100% {
-        opacity: 1;
-        transform: scale(1);
-    }
-}
-
-@keyframes uk-scale-zoom-out {
-    0% {
-        transform: scale(1);
-    }
-
-    100% {
-        opacity: 0;
-        transform: scale(0.8);
-    }
-}
-
-@keyframes uk-noop {
-    0% {
-        font-size: 0;
-    }
-
-    100% {
-        font-size: 1rem;
-    }
-}

package/dist/esm/styles/nav.scss

@@ -1 +0,0 @@
-@import '../components/Nav/index.scss';

package/dist/esm/styles/navbar.scss

@@ -1 +0,0 @@
-@import '../components/Navbar/index.scss';

package/dist/esm/styles/overlay.scss

@@ -1 +0,0 @@
-@import '../components/Overlay/index.scss';

package/dist/esm/styles/placeholder.scss

@@ -1,54 +0,0 @@
-// Name:            Placeholder
-// Description:     Component to create placeholder boxes
-//
-// Component:       `uk-placeholder`
-//
-// ========================================================================
-
-
-// Variables
-// ========================================================================
-
-@import 'variables.scss';
-
-
-/* ========================================================================
-   Component: Placeholder
- ========================================================================== */
-
-.uk-placeholder {
-    background: var(--placeholder-background);
-    margin-bottom: var(--placeholder-margin-vertical);
-    padding: var(--placeholder-padding-vertical) var(--placeholder-padding-horizontal);
-    @if mixin-exists(hook-placeholder) {
-        @include hook-placeholder;
-    }
-}
-
-/* Add margin if adjacent element */
-* + .uk-placeholder { margin-top: var(--placeholder-margin-vertical); }
-
-/*
- * Remove margin from the last-child
- */
-
-.uk-placeholder > :last-child { margin-bottom: 0; }
-
-
-// Hooks
-// ========================================================================
-
-@if mixin-exists(hook-placeholder-misc) {
-    @include hook-placeholder-misc;
-}
-
-
-// Vars
-// ========================================================================
-
-:root {
-    --placeholder-margin-vertical: var(--global-margin);
-    --placeholder-padding-vertical: var(--global-gutter);
-    --placeholder-padding-horizontal: var(--global-gutter);
-    --placeholder-background: var(--global-muted-background);
-}