@broxus/react-uikit 0.18.0 → 0.19.0

package/dist/esm/components/Overlay/index.scss

@@ -1,105 +0,0 @@
-// Name:            Overlay
-// Description:     Component to create content areas overlaying an image
-//
-// Component:       `uk-overlay`
-//
-// Adopted:         `uk-overlay-icon`
-//
-// Modifier:        `uk-overlay-default`
-//                  `uk-overlay-primary`
-//
-// ========================================================================
-
-
-// Variables
-// ========================================================================
-
-@import '../../styles/variables.scss';
-
-
-/* ========================================================================
-   Component: Overlay
- ========================================================================== */
-
-.uk-overlay {
-    padding: var(--overlay-padding-vertical) var(--overlay-padding-horizontal);
-    @if mixin-exists(hook-overlay) {
-        @include hook-overlay;
-    }
-}
-
-/*
- * Remove margin from the last-child
- */
-
-.uk-overlay > :last-child {
-    margin-bottom: 0;
-}
-
-
-/* Icon
- ========================================================================== */
-
-.uk-overlay-icon {
-    @if mixin-exists(hook-overlay-icon) {
-        @include hook-overlay-icon;
-    }
-}
-
-
-/* Style modifiers
- ========================================================================== */
-
-/*
- * Default
- */
-
-.uk-overlay-default {
-    background: var(--overlay-default-background);
-    @if mixin-exists(hook-overlay-default) {
-        @include hook-overlay-default;
-    }
-}
-
-/*
- * Primary
- */
-
-.uk-overlay-primary {
-    background: var(--overlay-primary-background);
-    @if mixin-exists(hook-overlay-primary) {
-        @include hook-overlay-primary;
-    }
-}
-
-// Color Mode
-@if $overlay-primary-color-mode == light {
-    .uk-overlay-primary {
-        @extend .uk-light !optional;
-    }
-}
-
-@if $overlay-primary-color-mode == dark {
-    .uk-overlay-primary {
-        @extend .uk-dark !optional;
-    }
-}
-
-
-// Hooks
-// ========================================================================
-
-@if mixin-exists(hook-overlay-misc) {
-    @include hook-overlay-misc;
-}
-
-
-// Vars
-// ========================================================================
-
-:root {
-    --overlay-padding-horizontal: var(--global-gutter);
-    --overlay-padding-vertical: var(--global-gutter);
-    --overlay-default-background: #{$overlay-default-background};
-    --overlay-primary-background: #{$overlay-primary-background};
-}

package/dist/esm/components/Spinner/index.scss

@@ -1,84 +0,0 @@
-// Name:            Spinner
-// Description:     Component to create a loading spinner
-//
-// Component:       `uk-spinner`
-//
-// ========================================================================
-
-
-// Variables
-// ========================================================================
-
-@import '../../styles/variables.scss';
-
-
-/* ========================================================================
-   Component: Spinner
- ========================================================================== */
-
-/*
- * Adopts `uk-icon`
- */
-
-.uk-spinner {
-    @if mixin-exists(hook-spinner) {
-        @include hook-spinner;
-    }
-}
-
-
-/* SVG
- ========================================================================== */
-
-.uk-spinner > * { animation: uk-spinner-rotate var(--spinner-duration) linear infinite; }
-
-@keyframes uk-spinner-rotate {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(270deg); }
-}
-
-/*
- * Circle
- */
-
-.uk-spinner > * > * {
-    animation: uk-spinner-dash var(--spinner-duration) var(--ease-in-out) infinite;
-    stroke-dasharray: $spinner-circumference;
-    stroke-dashoffset: 0;
-    stroke-linecap: round;
-    stroke-width: var(--spinner-stroke-width);
-    transform-origin: center;
-    will-change: auto;
-}
-
-@keyframes uk-spinner-dash {
-    0% { stroke-dashoffset: $spinner-circumference; }
-
-    50% {
-        stroke-dashoffset: ($spinner-circumference * 0.25);
-        transform: rotate(135deg);
-    }
-
-    100% {
-        stroke-dashoffset: $spinner-circumference;
-        transform: rotate(450deg);
-    }
-}
-
-
-// Hooks
-// ========================================================================
-
-@if mixin-exists(hook-spinner-misc) {
-    @include hook-spinner-misc;
-}
-
-
-// Vars
-// ========================================================================
-
-:root {
-    --spinner-size: #{$spinner-size};
-    --spinner-stroke-width: #{$spinner-stroke-width};
-    --spinner-duration: #{$spinner-duration};
-}

package/dist/esm/components/Switch/index.scss

@@ -1,205 +0,0 @@
-// Name:            Switch
-// Description:     Switch Selector
-//
-// Component:       `uk-switch`
-//
-// ========================================================================
-
-// Variables
-// ========================================================================
-
-@import '../../styles/variables.scss';
-
-/* ========================================================================
-   Component: Switch
- ========================================================================== */
-
-.uk-switch {
-    appearance: none;
-    background: var(--switch-background);
-    border: var(--switch-border-width) var(--switch-border-style) var(--switch-border);
-    border-radius: var(--switch-border-radius);
-    box-sizing: content-box;
-    color: inherit;
-    cursor: pointer;
-    display: inline-block;
-    font: inherit;
-    height: var(--switch-height);
-    line-height: var(--switch-height);
-    margin: 0;
-    min-width: var(--switch-width);
-    padding: 0;
-    position: relative;
-    transition: all var(--transition-medium-fast-duration);
-    user-select: none;
-    vertical-align: middle;
-
-    @if mixin-exists(hook-switch) {
-        @include hook-switch;
-    }
-}
-
-.uk-switch:not(.uk-switch-disabled):hover::after {
-    visibility: visible;
-}
-
-.uk-switch-handle {
-    height: calc(var(--switch-height) - var(--switch-handle-offset) * 2);
-    inset-inline-start: var(--switch-handle-offset);
-    position: absolute;
-    top: var(--switch-handle-offset);
-    transition: all var(--transition-medium-fast-duration) var(--ease-in-out);
-    width: calc(var(--switch-height) - var(--switch-handle-offset) * 2);
-    z-index: 10;
-
-    @if mixin-exists(hook-switch-handle) {
-        @include hook-switch-handle;
-    }
-}
-
-.uk-switch-handle::before {
-    background: var(--switch-handle-background);
-    border-radius: var(--switch-handle-border-radius);
-    bottom: 0;
-    content: '';
-    inset-inline: 0 0;
-    position: absolute;
-    top: 0;
-    transition: all var(--transition-medium-fast-duration) var(--ease-in-out);
-}
-
-
-/* Inner
- ========================================================================== */
-
-.uk-switch-inner {
-    border-radius: var(--switch-border-radius);
-    box-sizing: border-box;
-    display: block;
-    height: 100%;
-    overflow: hidden;
-    padding-inline: calc(var(--switch-height) + var(--switch-handle-offset)) calc((var(--switch-height) + var(--switch-handle-offset)) / 2.6666);
-    transition: padding-inline-start var(--transition-medium-fast-duration) var(--ease-in-out), padding-inline-end var(--transition-medium-fast-duration) var(--ease-in-out);
-}
-
-.uk-switch-inner-checked,
-.uk-switch-inner-unchecked {
-    display: block;
-    pointer-events: none;
-    transition: margin-inline-start var(--transition-medium-fast-duration) var(--ease-in-out), margin-inline-end var(--transition-medium-fast-duration) var(--ease-in-out);
-}
-
-.uk-switch-inner-checked {
-    margin-inline: calc(-100% + var(--switch-height) - ((var(--switch-height) + var(--switch-handle-offset)) * 2)) calc(100% - var(--switch-height) + ((var(--switch-height) + var(--switch-handle-offset)) * 2));
-}
-
-.uk-switch-inner-unchecked {
-    margin-inline: 0 0;
-    margin-top: calc(var(--switch-height) * -1);
-}
-
-
-/* States
- ========================================================================== */
-
-// Active state
-.uk-switch:not(.uk-switch-disabled):active .uk-switch-handle::before {
-    inset-inline: 0 -30%;
-}
-
-.uk-switch-checked:not(.uk-switch-disabled):active .uk-switch-handle::before {
-    inset-inline: -30% 0;
-}
-
-.uk-switch:not(.uk-switch-disabled, .uk-switch-checked):active .uk-switch-inner-unchecked {
-    margin-inline: calc(var(--switch-handle-offset) * 2) calc(var(--switch-handle-offset) * -2);
-}
-
-.uk-switch-checked:not(.uk-switch-disabled):active .uk-switch-inner-checked {
-    margin-inline: calc(var(--switch-handle-offset) * -2) calc(var(--switch-handle-offset) * 2);
-}
-
-// Checked state
-.uk-switch-checked {
-    background: var(--switch-checked-background);
-
-    @if mixin-exists(hook-switch-checked) {
-        @include hook-switch-checked;
-    }
-}
-
-.uk-switch-checked::after {
-    animation: uk-wave-effect 0.36s var(--ease-in-out);
-    animation-fill-mode: backwards;
-    border: var(--switch-border-width) solid var(--switch-checked-background);
-    border-radius: var(--switch-border-radius);
-    box-sizing: border-box;
-    content: '';
-    height: 100%;
-    left: 0;
-    position: absolute;
-    top: 0;
-    visibility: hidden;
-    width: 100%;
-}
-
-.uk-switch-checked .uk-switch-handle {
-    inset-inline-start: calc(100% - var(--switch-height) + var(--switch-handle-offset));
-
-    @if mixin-exists(hook-switch-checked-handle) {
-        @include hook-switch-checked-handle;
-    }
-}
-
-.uk-switch-checked .uk-switch-handle::before {
-    background: var(--switch-handle-checked-background);
-}
-
-.uk-switch-checked .uk-switch-inner {
-    padding-inline: calc((var(--switch-height) + var(--switch-handle-offset)) / 2.6666) calc(var(--switch-height) + var(--switch-handle-offset));
-}
-
-.uk-switch-checked .uk-switch-inner-checked {
-    margin-inline: 0 0;
-}
-
-.uk-switch-checked .uk-switch-inner-unchecked {
-    margin-inline: calc(100% - var(--switch-height) + ((var(--switch-height) + var(--switch-handle-offset)) * 2)) calc(-100% + var(--switch-height) - ((var(--switch-height) + var(--switch-handle-offset)) * 2));
-}
-
-// Disabled
-.uk-switch-disabled {
-    cursor: not-allowed;
-    opacity: 0.65;
-
-    @if mixin-exists(hook-switch-disabled) {
-        @include hook-switch-disabled;
-    }
-}
-
-
-/* Hooks
- ========================================================================== */
-
-@if mixin-exists(hook-switch-misc) {
-    @include hook-switch-misc;
-}
-
-
-/* Vars
- ========================================================================== */
-
-:root {
-    --switch-background: #{$switch-background};
-    --switch-border: var(--global-border);
-    --switch-border-style: var(--global-border-style);
-    --switch-border-width: var(--global-border-width);
-    --switch-checked-background: var(--global-success-background);
-    --switch-border-radius: #{$switch-border-radius};
-    --switch-height: #{$switch-height};
-    --switch-width: #{$switch-width};
-    --switch-handle-background: var(--global-background);
-    --switch-handle-checked-background: var(--global-background);
-    --switch-handle-border-radius: #{$switch-handle-border-radius};
-    --switch-handle-offset: #{$switch-handle-offset};
-}

package/dist/esm/styles/_import.components.scss

@@ -1,64 +0,0 @@
-// Base
-@import 'variables.scss';
-@import 'mixin.scss';
-@import 'base.scss';
-
-// Elements
-@import 'link.scss';
-@import 'heading.scss';
-@import 'divider.scss';
-@import 'list.scss';
-@import 'description-list.scss';
-
-// @import 'table.scss';
-@import 'icon.scss';
-@import 'form.scss'; // After: Icon
-@import 'control.scss'; // After: Icon
-@import 'button.scss';
-@import 'progress.scss';
-@import 'switch.scss';
-
-// Layout
-@import 'section.scss';
-@import 'container.scss';
-@import 'grid.scss';
-@import 'tile.scss';
-@import 'card.scss';
-
-// Common
-@import 'close.scss'; // After: Icon
-@import 'spinner.scss'; // After: Icon
-// @import 'totop.scss'; // After: Icon
-// @import 'marker.scss'; // After: Icon
-@import 'alert.scss'; // After: Close
-// @import 'placeholder.scss';
-@import 'badge.scss';
-@import 'label.scss';
-
-// @import 'overlay.scss'; // After: Icon
-@import 'article.scss'; // After: Subnav
-// @import 'comment.scss';
-// @import 'search.scss'; // After: Icon
-
-// Navs
-@import 'nav.scss';
-@import 'navbar.scss'; // After: Card, Grid, Nav, Icon, Search
-@import 'subnav.scss';
-@import 'breadcrumb.scss';
-
-// @import 'pagination.scss';
-@import 'tabs.scss';
-@import 'dotnav.scss';
-
-// @import 'thumbnav.scss';
-// @import 'iconnav.scss';
-
-// JavaScript
-@import 'accordion.scss'; // After: Card
-@import 'drop.scss'; // After: Card
-@import 'dropdown.scss'; // After: Card
-@import 'modal.scss'; // After: Close
-@import 'drawer.scss';
-@import 'date-picker.scss';
-
-// @import 'sticky.scss';

package/dist/esm/styles/_import.scss

@@ -1,93 +0,0 @@
-// Base
-@import 'variables.scss';
-@import 'mixin.scss';
-@import 'base.scss';
-
-// Elements
-@import 'link.scss';
-@import 'heading.scss';
-@import 'divider.scss';
-@import 'list.scss';
-@import 'description-list.scss';
-
-// @import 'table.scss';
-@import 'icon.scss';
-@import 'form.scss'; // After: Icon
-@import 'control.scss';
-@import 'button.scss';
-@import 'progress.scss';
-@import 'switch.scss';
-
-// Layout
-@import 'section.scss';
-@import 'container.scss';
-@import 'tile.scss';
-@import 'card.scss';
-
-// Common
-@import 'close.scss'; // After: Icon
-@import 'spinner.scss'; // After: Icon
-// @import 'totop.scss'; // After: Icon
-// @import 'marker.scss'; // After: Icon
-@import 'alert.scss'; // After: Close
-// @import 'placeholder.scss';
-@import 'badge.scss';
-@import 'label.scss';
-
-@import 'overlay.scss'; // After: Icon
-@import 'article.scss'; // After: Subnav
-// @import 'comment.scss';
-// @import 'search.scss'; // After: Icon
-
-// JavaScript
-@import 'accordion.scss'; // After: Card
-@import 'drop.scss'; // After: Card
-@import 'dropdown.scss'; // After: Card
-@import 'modal.scss'; // After: Close
-@import 'drawer.scss';
-@import 'date-picker.scss';
-
-// @import 'sticky.scss';
-// @import 'leader.scss';
-@import 'tooltip.scss';
-
-// @import 'sortable.scss';
-// @import 'countdown.scss';
-
-@import 'grid.scss';
-
-// Navs
-@import 'nav.scss';
-@import 'navbar.scss'; // After: Card, Grid, Nav, Icon, Search
-@import 'subnav.scss';
-@import 'breadcrumb.scss';
-
-// @import 'pagination.scss';
-@import 'tabs.scss';
-@import 'dotnav.scss';
-
-// @import 'thumbnav.scss';
-// @import 'iconnav.scss';
-
-// Utilities
-@import 'animation.scss';
-@import 'motion.scss';
-@import 'width.scss';
-@import 'height.scss';
-@import 'text.scss';
-@import 'column.scss';
-@import 'cover.scss';
-@import 'background.scss';
-@import 'align.scss';
-@import 'svg.scss';
-@import 'utility.scss';
-@import 'flex.scss'; // After: Utility
-@import 'margin.scss';
-@import 'padding.scss';
-@import 'position.scss';
-@import 'transition.scss';
-@import 'visibility.scss';
-@import 'inverse.scss';
-
-// Need to be loaded last
-@import 'print.scss';

package/dist/esm/styles/_import.utilities.scss

@@ -1,18 +0,0 @@
-// Utilities
-@import 'animation.scss';
-@import 'motion.scss';
-@import 'height.scss';
-@import 'text.scss';
-@import 'column.scss';
-@import 'background.scss';
-@import 'utility.scss';
-@import 'flex.scss'; // After: Utility
-@import 'margin.scss';
-@import 'padding.scss';
-@import 'position.scss';
-@import 'transition.scss';
-@import 'visibility.scss';
-@import 'inverse.scss';
-
-// Need to be loaded last
-@import 'print.scss';

package/dist/esm/styles/accordion.scss

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

package/dist/esm/styles/alert.scss

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

package/dist/esm/styles/align.scss

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