@broxus/react-uikit 0.6.4 → 0.6.5

package/dist/cjs/components/Drawer/index.scss

@@ -530,6 +530,43 @@
 }
 
 
+/* Close
+ * Adopts `uk-close`
+ ========================================================================== */
+
+.uk-drawer-close {
+    --icon-size: 24px;
+
+    box-sizing: content-box;
+    padding: var(--drawer-close-padding);
+    position: absolute;
+    right: var(--drawer-close-position);
+    top: var(--drawer-close-position);
+    z-index: var(--drawer-z-index);
+    @if mixin-exists(hook-drawer-close) {
+        @include hook-drawer-close;
+    }
+}
+
+/*
+ * Remove margin from adjacent element
+ */
+
+.uk-drawer-close:first-child + * {
+    margin-top: 0;
+}
+
+/*
+ * Hover
+ */
+
+.uk-drawer-close:hover {
+    @if mixin-exists(hook-drawer-close-hover) {
+        @include hook-drawer-close-hover;
+    }
+}
+
+
 // Vars
 // ========================================================================
 
@@ -543,4 +580,6 @@
     --drawer-mask-background: #{$drawer-mask-background};
     --drawer-z-index: calc(var(--global-z-index) + 30);
     --drawer-transition-duration: var(--transition-medium-fast-duration);
+    --drawer-close-position: var(--global-small-margin);
+    --drawer-close-padding: #{$drawer-close-padding};
 }

package/dist/cjs/components/Modal/index.scss

@@ -371,6 +371,6 @@
     --modal-close-padding: #{$modal-close-padding};
     --modal-close-outside-position: #{$modal-close-outside-position};
     --modal-close-outside-translate: #{$modal-close-outside-translate};
-    --modal-close-outside-color: lighten($global-inverse-color, 20%);
+    --modal-close-outside-color: #{$modal-close-outside-color};
     --modal-close-outside-hover-color: var(--global-inverse-color);
 }

package/dist/cjs/styles/variables.scss

@@ -688,6 +688,9 @@ $drawer-mask-background:                                        rgb(0 0 0 / 30%)
 $drawer-mask-background:                                        rgb(0 0 0 / 30%) !default;
 $drawer-z-index:                                                $global-z-index + 30 !default;
 $drawer-transition-duration:                                    $transition-medium-fast-duration !default;
+$drawer-close-position:                                         $global-small-margin !default;
+$drawer-close-padding:                                          5px !default;
+
 
 // Drop
 // ========================================================================

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

@@ -530,6 +530,43 @@
 }
 
 
+/* Close
+ * Adopts `uk-close`
+ ========================================================================== */
+
+.uk-drawer-close {
+    --icon-size: 24px;
+
+    box-sizing: content-box;
+    padding: var(--drawer-close-padding);
+    position: absolute;
+    right: var(--drawer-close-position);
+    top: var(--drawer-close-position);
+    z-index: var(--drawer-z-index);
+    @if mixin-exists(hook-drawer-close) {
+        @include hook-drawer-close;
+    }
+}
+
+/*
+ * Remove margin from adjacent element
+ */
+
+.uk-drawer-close:first-child + * {
+    margin-top: 0;
+}
+
+/*
+ * Hover
+ */
+
+.uk-drawer-close:hover {
+    @if mixin-exists(hook-drawer-close-hover) {
+        @include hook-drawer-close-hover;
+    }
+}
+
+
 // Vars
 // ========================================================================
 
@@ -543,4 +580,6 @@
     --drawer-mask-background: #{$drawer-mask-background};
     --drawer-z-index: calc(var(--global-z-index) + 30);
     --drawer-transition-duration: var(--transition-medium-fast-duration);
+    --drawer-close-position: var(--global-small-margin);
+    --drawer-close-padding: #{$drawer-close-padding};
 }

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

@@ -371,6 +371,6 @@
     --modal-close-padding: #{$modal-close-padding};
     --modal-close-outside-position: #{$modal-close-outside-position};
     --modal-close-outside-translate: #{$modal-close-outside-translate};
-    --modal-close-outside-color: lighten($global-inverse-color, 20%);
+    --modal-close-outside-color: #{$modal-close-outside-color};
     --modal-close-outside-hover-color: var(--global-inverse-color);
 }

package/dist/esm/styles/variables.scss

@@ -688,6 +688,9 @@ $drawer-mask-background:                                        rgb(0 0 0 / 30%)
 $drawer-mask-background:                                        rgb(0 0 0 / 30%) !default;
 $drawer-z-index:                                                $global-z-index + 30 !default;
 $drawer-transition-duration:                                    $transition-medium-fast-duration !default;
+$drawer-close-position:                                         $global-small-margin !default;
+$drawer-close-padding:                                          5px !default;
+
 
 // Drop
 // ========================================================================

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@broxus/react-uikit",
-    "version": "0.6.4",
+    "version": "0.6.5",
     "description": "React-based UIkit library",
     "license": "AGPL-3.0",
     "keywords": [
@@ -78,5 +78,5 @@
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
     },
-    "gitHead": "82d58886de1fec6f7bc630598c08b298b226c050"
+    "gitHead": "6d604d6e17dafee0974734ebcaa6667a3d340253"
 }