uikit 3.23.7 → 3.23.8-dev.65e3f4fda

package/src/scss/components/description-list.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Description list
 // Description:     Styles for description lists
 //
@@ -24,7 +26,7 @@
 
 .uk-description-list > dt {
     color: $description-list-term-color;
-    @if(mixin-exists(hook-description-list-term)) {@include hook-description-list-term();}
+    @if(meta.mixin-exists(hook-description-list-term)) {@include hook-description-list-term();}
 }
 
 .uk-description-list > dt:nth-child(n+2) {
@@ -36,7 +38,7 @@
  */
 
 .uk-description-list > dd {
-    @if(mixin-exists(hook-description-list-description)) {@include hook-description-list-description();}
+    @if(meta.mixin-exists(hook-description-list-description)) {@include hook-description-list-description();}
 }
 
 
@@ -51,14 +53,14 @@
     margin-top: $description-list-divider-term-margin-top;
     padding-top: $description-list-divider-term-margin-top;
     border-top: $description-list-divider-term-border-width solid $description-list-divider-term-border;
-    @if(mixin-exists(hook-description-list-divider-term)) {@include hook-description-list-divider-term();}
+    @if(meta.mixin-exists(hook-description-list-divider-term)) {@include hook-description-list-divider-term();}
 }
 
 
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-description-list-misc)) {@include hook-description-list-misc();}
+@if(meta.mixin-exists(hook-description-list-misc)) {@include hook-description-list-misc();}
 
 // @mixin hook-description-list-term(){}
 // @mixin hook-description-list-description(){}

package/src/scss/components/divider.scss

@@ -1,3 +1,6 @@
+@use "sass:meta";
+@use "sass:string";
+
 // Name:            Divider
 // Description:     Styles for dividers
 //
@@ -46,7 +49,7 @@
     @include svg-fill($internal-divider-icon-image, "#000", $divider-icon-color);
     background-repeat: no-repeat;
     background-position: 50% 50%;
-    @if(mixin-exists(hook-divider-icon)) {@include hook-divider-icon();}
+    @if(meta.mixin-exists(hook-divider-icon)) {@include hook-divider-icon();}
 }
 
 .uk-divider-icon::before,
@@ -54,21 +57,21 @@
     content: "";
     position: absolute;
     top: $divider-icon-line-top;
-    max-width: unquote('calc(50% - (#{$divider-icon-width} / 2))');
+    max-width: string.unquote('calc(50% - (#{$divider-icon-width} / 2))');
     border-bottom: $divider-icon-line-border-width solid $divider-icon-line-border;
-    @if(mixin-exists(hook-divider-icon-line)) {@include hook-divider-icon-line();}
+    @if(meta.mixin-exists(hook-divider-icon-line)) {@include hook-divider-icon-line();}
 }
 
 .uk-divider-icon::before {
-    right: unquote('calc(50% + (#{$divider-icon-width} / 2))');
+    right: string.unquote('calc(50% + (#{$divider-icon-width} / 2))');
     width: $divider-icon-line-width;
-    @if(mixin-exists(hook-divider-icon-line-left)) {@include hook-divider-icon-line-left();}
+    @if(meta.mixin-exists(hook-divider-icon-line-left)) {@include hook-divider-icon-line-left();}
 }
 
 .uk-divider-icon::after {
-    left: unquote('calc(50% + (#{$divider-icon-width} / 2))');
+    left: string.unquote('calc(50% + (#{$divider-icon-width} / 2))');
     width: $divider-icon-line-width;
-    @if(mixin-exists(hook-divider-icon-line-right)) {@include hook-divider-icon-line-right();}
+    @if(meta.mixin-exists(hook-divider-icon-line-right)) {@include hook-divider-icon-line-right();}
 }
 
 
@@ -91,7 +94,7 @@
     max-width: 100%;
     border-top: $divider-small-border-width solid $divider-small-border;
     vertical-align: top;
-    @if(mixin-exists(hook-divider-small)) {@include hook-divider-small();}
+    @if(meta.mixin-exists(hook-divider-small)) {@include hook-divider-small();}
 }
 
 
@@ -104,14 +107,14 @@
     margin-left: auto;
     margin-right: auto;
     border-left: $divider-vertical-border-width solid $divider-vertical-border;
-    @if(mixin-exists(hook-divider-vertical)) {@include hook-divider-vertical();}
+    @if(meta.mixin-exists(hook-divider-vertical)) {@include hook-divider-vertical();}
 }
 
 
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-divider-misc)) {@include hook-divider-misc();}
+@if(meta.mixin-exists(hook-divider-misc)) {@include hook-divider-misc();}
 
 // @mixin hook-divider-icon(){}
 // @mixin hook-divider-icon-line(){}

package/src/scss/components/dotnav.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Dotnav
 // Description:     Component to create dot navigations
 //
@@ -37,7 +39,7 @@
     list-style: none;
     /* 3 */
     margin-left: (-$dotnav-margin-horizontal);
-    @if(mixin-exists(hook-dotnav)) {@include hook-dotnav();}
+    @if(meta.mixin-exists(hook-dotnav)) {@include hook-dotnav();}
 }
 
 /*
@@ -72,25 +74,25 @@
     text-indent: 100%;
     overflow: hidden;
     white-space: nowrap;
-    @if(mixin-exists(hook-dotnav-item)) {@include hook-dotnav-item();}
+    @if(meta.mixin-exists(hook-dotnav-item)) {@include hook-dotnav-item();}
 }
 
 /* Hover */
 .uk-dotnav > * > :hover {
     background-color: $dotnav-item-hover-background;
-    @if(mixin-exists(hook-dotnav-item-hover)) {@include hook-dotnav-item-hover();}
+    @if(meta.mixin-exists(hook-dotnav-item-hover)) {@include hook-dotnav-item-hover();}
 }
 
 /* OnClick */
 .uk-dotnav > * > :active {
     background-color: $dotnav-item-onclick-background;
-    @if(mixin-exists(hook-dotnav-item-onclick)) {@include hook-dotnav-item-onclick();}
+    @if(meta.mixin-exists(hook-dotnav-item-onclick)) {@include hook-dotnav-item-onclick();}
 }
 
 /* Active */
 .uk-dotnav > .uk-active > * {
     background-color: $dotnav-item-active-background;
-    @if(mixin-exists(hook-dotnav-item-active)) {@include hook-dotnav-item-active();}
+    @if(meta.mixin-exists(hook-dotnav-item-active)) {@include hook-dotnav-item-active();}
 }
 
 
@@ -120,7 +122,7 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-dotnav-misc)) {@include hook-dotnav-misc();}
+@if(meta.mixin-exists(hook-dotnav-misc)) {@include hook-dotnav-misc();}
 
 // @mixin hook-dotnav(){}
 // @mixin hook-dotnav-item(){}

package/src/scss/components/drop.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Drop
 // Description:     Component to position any element next to any other element.
 //
@@ -68,6 +70,6 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-drop-misc)) {@include hook-drop-misc();}
+@if(meta.mixin-exists(hook-drop-misc)) {@include hook-drop-misc();}
 
 // @mixin hook-drop-misc(){}

package/src/scss/components/dropbar.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Dropbar
 // Description:     Component to create a dropbar based on Drop component
 //
@@ -39,7 +41,7 @@
     padding: $dropbar-padding-top $dropbar-padding-horizontal $dropbar-padding-bottom $dropbar-padding-horizontal;
     background: $dropbar-background;
     color: $dropbar-color;
-    @if(mixin-exists(hook-dropbar)) {@include hook-dropbar();}
+    @if(meta.mixin-exists(hook-dropbar)) {@include hook-dropbar();}
 }
 
 /*
@@ -92,26 +94,26 @@
  ========================================================================== */
 
 .uk-dropbar-top {
-    @if(mixin-exists(hook-dropbar-top)) {@include hook-dropbar-top();}
+    @if(meta.mixin-exists(hook-dropbar-top)) {@include hook-dropbar-top();}
 }
 
 .uk-dropbar-bottom {
-    @if(mixin-exists(hook-dropbar-bottom)) {@include hook-dropbar-bottom();}
+    @if(meta.mixin-exists(hook-dropbar-bottom)) {@include hook-dropbar-bottom();}
 }
 
 .uk-dropbar-left {
-    @if(mixin-exists(hook-dropbar-left)) {@include hook-dropbar-left();}
+    @if(meta.mixin-exists(hook-dropbar-left)) {@include hook-dropbar-left();}
 }
 
 .uk-dropbar-right {
-    @if(mixin-exists(hook-dropbar-right)) {@include hook-dropbar-right();}
+    @if(meta.mixin-exists(hook-dropbar-right)) {@include hook-dropbar-right();}
 }
 
 
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-dropbar-misc)) {@include hook-dropbar-misc();}
+@if(meta.mixin-exists(hook-dropbar-misc)) {@include hook-dropbar-misc();}
 
 // @mixin hook-dropbar(){}
 // @mixin hook-dropbar-top(){}

package/src/scss/components/dropdown.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Dropdown
 // Description:     Component to create a dropdown based on Drop component
 //
@@ -44,7 +46,7 @@
     padding: $dropdown-padding;
     background: $dropdown-background;
     color: $dropdown-color;
-    @if(mixin-exists(hook-dropdown)) {@include hook-dropdown();}
+    @if(meta.mixin-exists(hook-dropdown)) {@include hook-dropdown();}
 }
 
 /*
@@ -88,7 +90,7 @@
     /* 3 */
     padding: $dropdown-dropbar-padding-top 0 $dropdown-dropbar-padding-bottom 0;
     --uk-position-viewport-offset: #{$dropdown-dropbar-viewport-margin};
-    @if(mixin-exists(hook-dropdown-dropbar)) {@include hook-dropdown-dropbar();}
+    @if(meta.mixin-exists(hook-dropdown-dropbar)) {@include hook-dropdown-dropbar();}
 }
 
 /* Phone landscape and bigger */
@@ -108,7 +110,7 @@
 .uk-dropdown-dropbar-large {
     padding-top: $dropdown-dropbar-large-padding-top;
     padding-bottom: $dropdown-dropbar-large-padding-bottom;
-    @if(mixin-exists(hook-dropdown-dropbar-large)) {@include hook-dropdown-dropbar-large();}
+    @if(meta.mixin-exists(hook-dropdown-dropbar-large)) {@include hook-dropdown-dropbar-large();}
 }
 
 
@@ -117,7 +119,7 @@
  ========================================================================== */
 
 .uk-dropdown-nav {
-    @if(mixin-exists(hook-dropdown-nav)) {@include hook-dropdown-nav();}
+    @if(meta.mixin-exists(hook-dropdown-nav)) {@include hook-dropdown-nav();}
 }
 
 /*
@@ -126,14 +128,14 @@
 
 .uk-dropdown-nav > li > a {
     color: $dropdown-nav-item-color;
-    @if(mixin-exists(hook-dropdown-nav-item)) {@include hook-dropdown-nav-item();}
+    @if(meta.mixin-exists(hook-dropdown-nav-item)) {@include hook-dropdown-nav-item();}
 }
 
 /* Hover + Active */
 .uk-dropdown-nav > li > a:hover,
 .uk-dropdown-nav > li.uk-active > a {
     color: $dropdown-nav-item-hover-color;
-    @if(mixin-exists(hook-dropdown-nav-item-hover)) {@include hook-dropdown-nav-item-hover();}
+    @if(meta.mixin-exists(hook-dropdown-nav-item-hover)) {@include hook-dropdown-nav-item-hover();}
 }
 
 /*
@@ -142,7 +144,7 @@
 
 .uk-dropdown-nav .uk-nav-subtitle {
     font-size: $dropdown-nav-subtitle-font-size;
-    @if(mixin-exists(hook-dropdown-nav-subtitle)) {@include hook-dropdown-nav-subtitle();}
+    @if(meta.mixin-exists(hook-dropdown-nav-subtitle)) {@include hook-dropdown-nav-subtitle();}
 }
 
 /*
@@ -151,7 +153,7 @@
 
 .uk-dropdown-nav .uk-nav-header {
     color: $dropdown-nav-header-color;
-    @if(mixin-exists(hook-dropdown-nav-header)) {@include hook-dropdown-nav-header();}
+    @if(meta.mixin-exists(hook-dropdown-nav-header)) {@include hook-dropdown-nav-header();}
 }
 
 /*
@@ -160,7 +162,7 @@
 
 .uk-dropdown-nav .uk-nav-divider {
     border-top: $dropdown-nav-divider-border-width solid $dropdown-nav-divider-border;
-    @if(mixin-exists(hook-dropdown-nav-divider)) {@include hook-dropdown-nav-divider();}
+    @if(meta.mixin-exists(hook-dropdown-nav-divider)) {@include hook-dropdown-nav-divider();}
 }
 
 /*
@@ -176,7 +178,7 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-dropdown-misc)) {@include hook-dropdown-misc();}
+@if(meta.mixin-exists(hook-dropdown-misc)) {@include hook-dropdown-misc();}
 
 // @mixin hook-dropdown(){}
 // @mixin hook-dropdown-dropbar(){}

package/src/scss/components/dropnav.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Dropnav
 // Description:     Component to create dropdown/dropbar menus based on Drop component
 //
@@ -37,6 +39,6 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-dropnav-misc)) {@include hook-dropnav-misc();}
+@if(meta.mixin-exists(hook-dropnav-misc)) {@include hook-dropnav-misc();}
 
 // @mixin hook-dropnav-misc(){}

package/src/scss/components/flex.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Flex
 // Description:     Utilities for layouts based on flexbox
 //
@@ -303,6 +305,6 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-flex-misc)) {@include hook-flex-misc();}
+@if(meta.mixin-exists(hook-flex-misc)) {@include hook-flex-misc();}
 
 // @mixin hook-flex-misc(){}

package/src/scss/components/form-range.scss

@@ -1,3 +1,6 @@
+@use "sass:meta";
+@use "sass:math";
+
 // Name:            Form Range
 // Description:     Styles for the range input type
 //
@@ -41,7 +44,7 @@
     width: 100%;
     /* 7 */
     background: transparent;
-    @if(mixin-exists(hook-form-range)) {@include hook-form-range();}
+    @if(meta.mixin-exists(hook-form-range)) {@include hook-form-range();}
 }
 
 /* Focus */
@@ -65,26 +68,26 @@
 .uk-range::-webkit-slider-runnable-track {
     height: $form-range-track-height;
     background: $form-range-track-background;
-    @if(mixin-exists(hook-form-range-track)) {@include hook-form-range-track();}
+    @if(meta.mixin-exists(hook-form-range-track)) {@include hook-form-range-track();}
 }
 
 .uk-range:focus::-webkit-slider-runnable-track,
 /* 1 */
 .uk-range:active::-webkit-slider-runnable-track {
     background: $form-range-track-focus-background;
-    @if(mixin-exists(hook-form-range-track-focus)) {@include hook-form-range-track-focus();}
+    @if(meta.mixin-exists(hook-form-range-track-focus)) {@include hook-form-range-track-focus();}
 }
 
 /* Firefox */
 .uk-range::-moz-range-track {
     height: $form-range-track-height;
     background: $form-range-track-background;
-    @if(mixin-exists(hook-form-range-track)) {@include hook-form-range-track();}
+    @if(meta.mixin-exists(hook-form-range-track)) {@include hook-form-range-track();}
 }
 
 .uk-range:focus::-moz-range-track {
     background: $form-range-track-focus-background;
-    @if(mixin-exists(hook-form-range-track-focus)) {@include hook-form-range-track-focus();}
+    @if(meta.mixin-exists(hook-form-range-track-focus)) {@include hook-form-range-track-focus();}
 }
 
 /*
@@ -97,13 +100,13 @@
 .uk-range::-webkit-slider-thumb {
     /* 1 */
     -webkit-appearance: none;
-    margin-top: (floor(($form-range-thumb-height * 0.5)) * -1);
+    margin-top: (math.floor(($form-range-thumb-height * 0.5)) * -1);
     /* 2 */
     height: $form-range-thumb-height;
     width: $form-range-thumb-width;
     border-radius: $form-range-thumb-border-radius;
     background: $form-range-thumb-background;
-    @if(mixin-exists(hook-form-range-thumb)) {@include hook-form-range-thumb();}
+    @if(meta.mixin-exists(hook-form-range-thumb)) {@include hook-form-range-thumb();}
 }
 
 /* Firefox */
@@ -113,17 +116,17 @@
     /* 2 */
     height: $form-range-thumb-height;
     width: $form-range-thumb-width;
-    margin-top: (floor(($form-range-thumb-height * 0.5)) * -1);
+    margin-top: (math.floor(($form-range-thumb-height * 0.5)) * -1);
     border-radius: $form-range-thumb-border-radius;
     background: $form-range-thumb-background;
-    @if(mixin-exists(hook-form-range-thumb)) {@include hook-form-range-thumb();}
+    @if(meta.mixin-exists(hook-form-range-thumb)) {@include hook-form-range-thumb();}
 }
 
 
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-form-range-misc)) {@include hook-form-range-misc();}
+@if(meta.mixin-exists(hook-form-range-misc)) {@include hook-form-range-misc();}
 
 // @mixin hook-form-range(){}
 // @mixin hook-form-range-track(){}

package/src/scss/components/form.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Form
 // Description:     Styles for forms
 //
@@ -206,7 +208,7 @@
     padding: 0 $form-padding-horizontal;
     background: $form-background;
     color: $form-color;
-    @if(mixin-exists(hook-form)) {@include hook-form();}
+    @if(meta.mixin-exists(hook-form)) {@include hook-form();}
 }
 
 /*
@@ -222,7 +224,7 @@
     vertical-align: middle;
     /* 1 */
     display: inline-block;
-    @if(mixin-exists(hook-form-single-line)) {@include hook-form-single-line();}
+    @if(meta.mixin-exists(hook-form-single-line)) {@include hook-form-single-line();}
 }
 
 /* 2 */
@@ -239,7 +241,7 @@
     padding-top: $form-padding-vertical;
     padding-bottom: $form-padding-vertical;
     vertical-align: top;
-    @if(mixin-exists(hook-form-multi-line)) {@include hook-form-multi-line();}
+    @if(meta.mixin-exists(hook-form-multi-line)) {@include hook-form-multi-line();}
 }
 
 .uk-select[multiple],
@@ -252,7 +254,7 @@
     outline: none;
     background-color: $form-focus-background;
     color: $form-focus-color;
-    @if(mixin-exists(hook-form-focus)) {@include hook-form-focus();}
+    @if(meta.mixin-exists(hook-form-focus)) {@include hook-form-focus();}
 }
 
 /* Disabled */
@@ -261,7 +263,7 @@
 .uk-textarea:disabled {
     background-color: $form-disabled-background;
     color: $form-disabled-color;
-    @if(mixin-exists(hook-form-disabled)) {@include hook-form-disabled();}
+    @if(meta.mixin-exists(hook-form-disabled)) {@include hook-form-disabled();}
 }
 
 /*
@@ -327,7 +329,7 @@ textarea.uk-form-large,
 .uk-form-danger,
 .uk-form-danger:focus {
     color: $form-danger-color;
-    @if(mixin-exists(hook-form-danger)) {@include hook-form-danger();}
+    @if(meta.mixin-exists(hook-form-danger)) {@include hook-form-danger();}
 }
 
 /*
@@ -337,7 +339,7 @@ textarea.uk-form-large,
 .uk-form-success,
 .uk-form-success:focus {
     color: $form-success-color;
-    @if(mixin-exists(hook-form-success)) {@include hook-form-success();}
+    @if(meta.mixin-exists(hook-form-success)) {@include hook-form-success();}
 }
 
 /*
@@ -346,11 +348,11 @@ textarea.uk-form-large,
 
 .uk-form-blank {
     background: none;
-    @if(mixin-exists(hook-form-blank)) {@include hook-form-blank();}
+    @if(meta.mixin-exists(hook-form-blank)) {@include hook-form-blank();}
 }
 
 .uk-form-blank:focus {
-    @if(mixin-exists(hook-form-blank-focus)) {@include hook-form-blank-focus();}
+    @if(meta.mixin-exists(hook-form-blank-focus)) {@include hook-form-blank-focus();}
 }
 
 
@@ -454,7 +456,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
     /* 6 */
     background-repeat: no-repeat;
     background-position: 50% 50%;
-    @if(mixin-exists(hook-form-radio)) {@include hook-form-radio();}
+    @if(meta.mixin-exists(hook-form-radio)) {@include hook-form-radio();}
 }
 
 .uk-radio { border-radius: 50%; }
@@ -464,7 +466,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
 .uk-checkbox:focus {
     background-color: $form-radio-focus-background;
     outline: none;
-    @if(mixin-exists(hook-form-radio-focus)) {@include hook-form-radio-focus();}
+    @if(meta.mixin-exists(hook-form-radio-focus)) {@include hook-form-radio-focus();}
 }
 
 /*
@@ -475,7 +477,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
 .uk-checkbox:checked,
 .uk-checkbox:indeterminate {
     background-color: $form-radio-checked-background;
-    @if(mixin-exists(hook-form-radio-checked)) {@include hook-form-radio-checked();}
+    @if(meta.mixin-exists(hook-form-radio-checked)) {@include hook-form-radio-checked();}
 }
 
 /* Focus */
@@ -483,7 +485,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
 .uk-checkbox:checked:focus,
 .uk-checkbox:indeterminate:focus {
     background-color: $form-radio-checked-focus-background;
-    @if(mixin-exists(hook-form-radio-checked-focus)) {@include hook-form-radio-checked-focus();}
+    @if(meta.mixin-exists(hook-form-radio-checked-focus)) {@include hook-form-radio-checked-focus();}
 }
 
 /*
@@ -501,7 +503,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
 .uk-radio:disabled,
 .uk-checkbox:disabled {
     background-color: $form-radio-disabled-background;
-    @if(mixin-exists(hook-form-radio-disabled)) {@include hook-form-radio-disabled();}
+    @if(meta.mixin-exists(hook-form-radio-disabled)) {@include hook-form-radio-disabled();}
 }
 
 .uk-radio:disabled:checked { @include svg-fill($internal-form-radio-image, "#000", $form-radio-disabled-icon-color); }
@@ -530,7 +532,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
     /* 4 */
     font-size: $form-legend-font-size;
     line-height: $form-legend-line-height;
-    @if(mixin-exists(hook-form-legend)) {@include hook-form-legend();}
+    @if(meta.mixin-exists(hook-form-legend)) {@include hook-form-legend();}
 }
 
 
@@ -593,7 +595,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
  ========================================================================== */
 
 .uk-form-label {
-    @if(mixin-exists(hook-form-label)) {@include hook-form-label();}
+    @if(meta.mixin-exists(hook-form-label)) {@include hook-form-label();}
 }
 
 
@@ -607,7 +609,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
 .uk-form-stacked .uk-form-label {
     display: block;
     margin-bottom: $form-stacked-margin-bottom;
-    @if(mixin-exists(hook-form-stacked-label)) {@include hook-form-stacked-label();}
+    @if(meta.mixin-exists(hook-form-stacked-label)) {@include hook-form-stacked-label();}
 }
 
 /*
@@ -621,7 +623,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
     .uk-form-horizontal .uk-form-label {
         display: block;
         margin-bottom: $form-stacked-margin-bottom;
-        @if(mixin-exists(hook-form-stacked-label)) {@include hook-form-stacked-label();}
+        @if(meta.mixin-exists(hook-form-stacked-label)) {@include hook-form-stacked-label();}
     }
 
 }
@@ -633,7 +635,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
         width: $form-horizontal-label-width;
         margin-top: $form-horizontal-label-margin-top;
         float: left;
-        @if(mixin-exists(hook-form-horizontal-label)) {@include hook-form-horizontal-label();}
+        @if(meta.mixin-exists(hook-form-horizontal-label)) {@include hook-form-horizontal-label();}
     }
 
     .uk-form-horizontal .uk-form-controls { margin-left: $form-horizontal-controls-margin-left; }
@@ -668,7 +670,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
     align-items: center;
     /* 4 */
     color: $form-icon-color;
-    @if(mixin-exists(hook-form-icon)) {@include hook-form-icon();}
+    @if(meta.mixin-exists(hook-form-icon)) {@include hook-form-icon();}
 }
 
 /*
@@ -704,7 +706,7 @@ select.uk-form-width-xsmall { width: ($form-width-xsmall + 25px); }
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-form-misc)) {@include hook-form-misc();}
+@if(meta.mixin-exists(hook-form-misc)) {@include hook-form-misc();}
 
 // @mixin hook-form(){}
 // @mixin hook-form-single-line(){}

package/src/scss/components/grid.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Grid
 // Description:     Component to create responsive, fluid and nestable grids
 //
@@ -193,7 +195,7 @@
     top: 0;
     bottom: 0;
     border-left: $grid-divider-border-width solid $grid-divider-border;
-    @if(mixin-exists(hook-grid-divider-horizontal)) {@include hook-grid-divider-horizontal();}
+    @if(meta.mixin-exists(hook-grid-divider-horizontal)) {@include hook-grid-divider-horizontal();}
 }
 
 /* Vertical */
@@ -203,7 +205,7 @@
     left: 0;
     right: 0;
     border-top: $grid-divider-border-width solid $grid-divider-border;
-    @if(mixin-exists(hook-grid-divider-vertical)) {@include hook-grid-divider-vertical();}
+    @if(meta.mixin-exists(hook-grid-divider-vertical)) {@include hook-grid-divider-vertical();}
 }
 
 /*
@@ -375,7 +377,7 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-grid-misc)) {@include hook-grid-misc();}
+@if(meta.mixin-exists(hook-grid-misc)) {@include hook-grid-misc();}
 
 // @mixin hook-grid-divider-horizontal(){}
 // @mixin hook-grid-divider-vertical(){}