uikit 3.23.7 → 3.23.8-dev.ff7a25595

package/src/scss/components/card.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Card
 // Description:     Component to create boxed content containers
 //
@@ -47,7 +49,7 @@
 .uk-card {
     position: relative;
     box-sizing: border-box;
-    @if(mixin-exists(hook-card)) {@include hook-card();}
+    @if(meta.mixin-exists(hook-card)) {@include hook-card();}
 }
 
 
@@ -57,19 +59,19 @@
 .uk-card-body {
     display: flow-root;
     padding: $card-body-padding-vertical $card-body-padding-horizontal;
-    @if(mixin-exists(hook-card-body)) {@include hook-card-body();}
+    @if(meta.mixin-exists(hook-card-body)) {@include hook-card-body();}
 }
 
 .uk-card-header {
     display: flow-root;
     padding: $card-header-padding-vertical $card-header-padding-horizontal;
-    @if(mixin-exists(hook-card-header)) {@include hook-card-header();}
+    @if(meta.mixin-exists(hook-card-header)) {@include hook-card-header();}
 }
 
 .uk-card-footer {
     display: flow-root;
     padding: $card-footer-padding-vertical $card-footer-padding-horizontal;
-    @if(mixin-exists(hook-card-footer)) {@include hook-card-footer();}
+    @if(meta.mixin-exists(hook-card-footer)) {@include hook-card-footer();}
 }
 
 /* Desktop and bigger */
@@ -101,25 +103,25 @@
  */
 
 [class*="uk-card-media"] {
-    @if(mixin-exists(hook-card-media)) {@include hook-card-media();}
+    @if(meta.mixin-exists(hook-card-media)) {@include hook-card-media();}
 }
 
 .uk-card-media-top,
 .uk-grid-stack > .uk-card-media-left,
 .uk-grid-stack > .uk-card-media-right {
-    @if(mixin-exists(hook-card-media-top)) {@include hook-card-media-top();}
+    @if(meta.mixin-exists(hook-card-media-top)) {@include hook-card-media-top();}
 }
 
 .uk-card-media-bottom {
-    @if(mixin-exists(hook-card-media-bottom)) {@include hook-card-media-bottom();}
+    @if(meta.mixin-exists(hook-card-media-bottom)) {@include hook-card-media-bottom();}
 }
 
 :not(.uk-grid-stack) > .uk-card-media-left {
-    @if(mixin-exists(hook-card-media-left)) {@include hook-card-media-left();}
+    @if(meta.mixin-exists(hook-card-media-left)) {@include hook-card-media-left();}
 }
 
 :not(.uk-grid-stack) > .uk-card-media-right {
-    @if(mixin-exists(hook-card-media-right)) {@include hook-card-media-right();}
+    @if(meta.mixin-exists(hook-card-media-right)) {@include hook-card-media-right();}
 }
 
 
@@ -129,7 +131,7 @@
 .uk-card-title {
     font-size: $card-title-font-size;
     line-height: $card-title-line-height;
-    @if(mixin-exists(hook-card-title)) {@include hook-card-title();}
+    @if(meta.mixin-exists(hook-card-title)) {@include hook-card-title();}
 }
 
 
@@ -161,7 +163,7 @@
     justify-content: center;
     align-items: center;
     line-height: 0;
-    @if(mixin-exists(hook-card-badge)) {@include hook-card-badge();}
+    @if(meta.mixin-exists(hook-card-badge)) {@include hook-card-badge();}
 }
 
 /*
@@ -176,7 +178,7 @@
 
 .uk-card-hover:not(.uk-card-default):not(.uk-card-primary):not(.uk-card-secondary):hover {
     background-color: $card-hover-background;
-    @if(mixin-exists(hook-card-hover)) {@include hook-card-hover();}
+    @if(meta.mixin-exists(hook-card-hover)) {@include hook-card-hover();}
 }
 
 
@@ -192,25 +194,25 @@
     --uk-inverse: #{$card-default-color-mode};
     background-color: $card-default-background;
     color: $card-default-color;
-    @if(mixin-exists(hook-card-default)) {@include hook-card-default();}
+    @if(meta.mixin-exists(hook-card-default)) {@include hook-card-default();}
 }
 
 .uk-card-default .uk-card-title {
     color: $card-default-title-color;
-    @if(mixin-exists(hook-card-default-title)) {@include hook-card-default-title();}
+    @if(meta.mixin-exists(hook-card-default-title)) {@include hook-card-default-title();}
 }
 
 .uk-card-default.uk-card-hover:hover {
     background-color: $card-default-hover-background;
-    @if(mixin-exists(hook-card-default-hover)) {@include hook-card-default-hover();}
+    @if(meta.mixin-exists(hook-card-default-hover)) {@include hook-card-default-hover();}
 }
 
 .uk-card-default .uk-card-header {
-    @if(mixin-exists(hook-card-default-header)) {@include hook-card-default-header();}
+    @if(meta.mixin-exists(hook-card-default-header)) {@include hook-card-default-header();}
 }
 
 .uk-card-default .uk-card-footer {
-    @if(mixin-exists(hook-card-default-footer)) {@include hook-card-default-footer();}
+    @if(meta.mixin-exists(hook-card-default-footer)) {@include hook-card-default-footer();}
 }
 
 // Color Mode
@@ -227,17 +229,17 @@
     --uk-inverse: #{$card-primary-color-mode};
     background-color: $card-primary-background;
     color: $card-primary-color;
-    @if(mixin-exists(hook-card-primary)) {@include hook-card-primary();}
+    @if(meta.mixin-exists(hook-card-primary)) {@include hook-card-primary();}
 }
 
 .uk-card-primary .uk-card-title {
     color: $card-primary-title-color;
-    @if(mixin-exists(hook-card-primary-title)) {@include hook-card-primary-title();}
+    @if(meta.mixin-exists(hook-card-primary-title)) {@include hook-card-primary-title();}
 }
 
 .uk-card-primary.uk-card-hover:hover {
     background-color: $card-primary-hover-background;
-    @if(mixin-exists(hook-card-primary-hover)) {@include hook-card-primary-hover();}
+    @if(meta.mixin-exists(hook-card-primary-hover)) {@include hook-card-primary-hover();}
 }
 
 // Color Mode
@@ -254,17 +256,17 @@
     --uk-inverse: #{$card-secondary-color-mode};
     background-color: $card-secondary-background;
     color: $card-secondary-color;
-    @if(mixin-exists(hook-card-secondary)) {@include hook-card-secondary();}
+    @if(meta.mixin-exists(hook-card-secondary)) {@include hook-card-secondary();}
 }
 
 .uk-card-secondary .uk-card-title {
     color: $card-secondary-title-color;
-    @if(mixin-exists(hook-card-secondary-title)) {@include hook-card-secondary-title();}
+    @if(meta.mixin-exists(hook-card-secondary-title)) {@include hook-card-secondary-title();}
 }
 
 .uk-card-secondary.uk-card-hover:hover {
     background-color: $card-secondary-hover-background;
-    @if(mixin-exists(hook-card-secondary-hover)) {@include hook-card-secondary-hover();}
+    @if(meta.mixin-exists(hook-card-secondary-hover)) {@include hook-card-secondary-hover();}
 }
 
 // Color Mode
@@ -306,7 +308,7 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-card-misc)) {@include hook-card-misc();}
+@if(meta.mixin-exists(hook-card-misc)) {@include hook-card-misc();}
 
 // @mixin hook-card(){}
 // @mixin hook-card-body(){}

package/src/scss/components/close.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Close
 // Description:     Component to create a close button
 //
@@ -21,20 +23,20 @@
 
 .uk-close {
     color: $close-color;
-    @if(mixin-exists(hook-close)) {@include hook-close();}
+    @if(meta.mixin-exists(hook-close)) {@include hook-close();}
 }
 
 /* Hover */
 .uk-close:hover {
     color: $close-hover-color;
-    @if(mixin-exists(hook-close-hover)) {@include hook-close-hover();}
+    @if(meta.mixin-exists(hook-close-hover)) {@include hook-close-hover();}
 }
 
 
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-close-misc)) {@include hook-close-misc();}
+@if(meta.mixin-exists(hook-close-misc)) {@include hook-close-misc();}
 
 // @mixin hook-close(){}
 // @mixin hook-close-hover(){}

package/src/scss/components/column.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Column
 // Description:     Utilities for text columns
 //
@@ -122,7 +124,7 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-column-misc)) {@include hook-column-misc();}
+@if(meta.mixin-exists(hook-column-misc)) {@include hook-column-misc();}
 
 // @mixin hook-column-misc(){}
 

package/src/scss/components/comment.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Comment
 // Description:     Component to create nested comments
 //
@@ -28,7 +30,7 @@
  ========================================================================== */
 
 .uk-comment {
-    @if(mixin-exists(hook-comment)) {@include hook-comment();}
+    @if(meta.mixin-exists(hook-comment)) {@include hook-comment();}
 }
 
 
@@ -39,13 +41,13 @@
     display: flow-root;
     overflow-wrap: break-word;
     word-wrap: break-word;
-    @if(mixin-exists(hook-comment-body)) {@include hook-comment-body();}
+    @if(meta.mixin-exists(hook-comment-body)) {@include hook-comment-body();}
 }
 
 .uk-comment-header {
     display: flow-root;
     margin-bottom: $comment-header-margin-bottom;
-    @if(mixin-exists(hook-comment-header)) {@include hook-comment-header();}
+    @if(meta.mixin-exists(hook-comment-header)) {@include hook-comment-header();}
 }
 
 /*
@@ -62,7 +64,7 @@
 .uk-comment-title {
     font-size: $comment-title-font-size;
     line-height: $comment-title-line-height;
-    @if(mixin-exists(hook-comment-title)) {@include hook-comment-title();}
+    @if(meta.mixin-exists(hook-comment-title)) {@include hook-comment-title();}
 }
 
 
@@ -73,7 +75,7 @@
     font-size: $comment-meta-font-size;
     line-height: $comment-meta-line-height;
     color: $comment-meta-color;
-    @if(mixin-exists(hook-comment-meta)) {@include hook-comment-meta();}
+    @if(meta.mixin-exists(hook-comment-meta)) {@include hook-comment-meta();}
 }
 
 
@@ -81,7 +83,7 @@
  ========================================================================== */
 
 .uk-comment-avatar {
-    @if(mixin-exists(hook-comment-avatar)) {@include hook-comment-avatar();}
+    @if(meta.mixin-exists(hook-comment-avatar)) {@include hook-comment-avatar();}
 }
 
 
@@ -96,7 +98,7 @@
 /* Adjacent siblings */
 .uk-comment-list > :nth-child(n+2) {
     margin-top: $comment-list-margin-top;
-    @if(mixin-exists(hook-comment-list-adjacent)) {@include hook-comment-list-adjacent();}
+    @if(meta.mixin-exists(hook-comment-list-adjacent)) {@include hook-comment-list-adjacent();}
 }
 
 /*
@@ -108,7 +110,7 @@
     margin: $comment-list-margin-top 0 0 0;
     padding-left: $comment-list-padding-left;
     list-style: none;
-    @if(mixin-exists(hook-comment-list-sub)) {@include hook-comment-list-sub();}
+    @if(meta.mixin-exists(hook-comment-list-sub)) {@include hook-comment-list-sub();}
 }
 
 /* Tablet and bigger */
@@ -121,7 +123,7 @@
 /* Adjacent siblings */
 .uk-comment-list .uk-comment ~ ul > :nth-child(n+2) {
     margin-top: $comment-list-margin-top;
-    @if(mixin-exists(hook-comment-list-sub-adjacent)) {@include hook-comment-list-sub-adjacent();}
+    @if(meta.mixin-exists(hook-comment-list-sub-adjacent)) {@include hook-comment-list-sub-adjacent();}
 }
 
 
@@ -129,14 +131,14 @@
  ========================================================================== */
 
 .uk-comment-primary {
-    @if(mixin-exists(hook-comment-primary)) {@include hook-comment-primary();}
+    @if(meta.mixin-exists(hook-comment-primary)) {@include hook-comment-primary();}
 }
 
 
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-comment-misc)) {@include hook-comment-misc();}
+@if(meta.mixin-exists(hook-comment-misc)) {@include hook-comment-misc();}
 
 // @mixin hook-comment(){}
 // @mixin hook-comment-body(){}

package/src/scss/components/container.scss

@@ -1,3 +1,6 @@
+@use "sass:meta";
+@use "sass:string";
+
 // Name:            Container
 // Description:     Component to align and center your site and grid content
 //
@@ -104,10 +107,10 @@
 @media (min-width: $breakpoint-small) {
 
     .uk-container-expand-left.uk-container-xsmall,
-    .uk-container-expand-right.uk-container-xsmall { max-width: unquote('calc(50% + (#{$container-xsmall-max-width} / 2) - #{$container-padding-horizontal-s})'); }
+    .uk-container-expand-right.uk-container-xsmall { max-width: string.unquote('calc(50% + (#{$container-xsmall-max-width} / 2) - #{$container-padding-horizontal-s})'); }
 
     .uk-container-expand-left.uk-container-small,
-    .uk-container-expand-right.uk-container-small { max-width: unquote('calc(50% + (#{$container-small-max-width} / 2) - #{$container-padding-horizontal-s})'); }
+    .uk-container-expand-right.uk-container-small { max-width: string.unquote('calc(50% + (#{$container-small-max-width} / 2) - #{$container-padding-horizontal-s})'); }
 
 }
 
@@ -115,19 +118,19 @@
 @media (min-width: $breakpoint-medium) {
 
     .uk-container-expand-left,
-    .uk-container-expand-right { max-width: unquote('calc(50% + (#{$container-max-width} / 2) - #{$container-padding-horizontal-m})'); }
+    .uk-container-expand-right { max-width: string.unquote('calc(50% + (#{$container-max-width} / 2) - #{$container-padding-horizontal-m})'); }
 
     .uk-container-expand-left.uk-container-xsmall,
-    .uk-container-expand-right.uk-container-xsmall { max-width: unquote('calc(50% + (#{$container-xsmall-max-width} / 2) - #{$container-padding-horizontal-m})'); }
+    .uk-container-expand-right.uk-container-xsmall { max-width: string.unquote('calc(50% + (#{$container-xsmall-max-width} / 2) - #{$container-padding-horizontal-m})'); }
 
     .uk-container-expand-left.uk-container-small,
-    .uk-container-expand-right.uk-container-small { max-width: unquote('calc(50% + (#{$container-small-max-width} / 2) - #{$container-padding-horizontal-m})'); }
+    .uk-container-expand-right.uk-container-small { max-width: string.unquote('calc(50% + (#{$container-small-max-width} / 2) - #{$container-padding-horizontal-m})'); }
 
     .uk-container-expand-left.uk-container-large,
-    .uk-container-expand-right.uk-container-large { max-width: unquote('calc(50% + (#{$container-large-max-width} / 2) - #{$container-padding-horizontal-m})'); }
+    .uk-container-expand-right.uk-container-large { max-width: string.unquote('calc(50% + (#{$container-large-max-width} / 2) - #{$container-padding-horizontal-m})'); }
 
     .uk-container-expand-left.uk-container-xlarge,
-    .uk-container-expand-right.uk-container-xlarge { max-width: unquote('calc(50% + (#{$container-xlarge-max-width} / 2) - #{$container-padding-horizontal-m})'); }
+    .uk-container-expand-right.uk-container-xlarge { max-width: string.unquote('calc(50% + (#{$container-xlarge-max-width} / 2) - #{$container-padding-horizontal-m})'); }
 
 }
 
@@ -141,7 +144,7 @@
  */
 
 .uk-container-item-padding-remove-left,
-.uk-container-item-padding-remove-right { width: unquote('calc(100% + #{$container-padding-horizontal})'); }
+.uk-container-item-padding-remove-right { width: string.unquote('calc(100% + #{$container-padding-horizontal})'); }
 
 .uk-container-item-padding-remove-left { margin-left: (-$container-padding-horizontal); }
 .uk-container-item-padding-remove-right { margin-right: (-$container-padding-horizontal); }
@@ -150,7 +153,7 @@
 @media (min-width: $breakpoint-small) {
 
     .uk-container-item-padding-remove-left,
-    .uk-container-item-padding-remove-right { width: unquote('calc(100% + #{$container-padding-horizontal-s})'); }
+    .uk-container-item-padding-remove-right { width: string.unquote('calc(100% + #{$container-padding-horizontal-s})'); }
 
     .uk-container-item-padding-remove-left { margin-left: (-$container-padding-horizontal-s); }
     .uk-container-item-padding-remove-right { margin-right: (-$container-padding-horizontal-s); }
@@ -161,7 +164,7 @@
 @media (min-width: $breakpoint-medium) {
 
     .uk-container-item-padding-remove-left,
-    .uk-container-item-padding-remove-right { width: unquote('calc(100% + #{$container-padding-horizontal-m})'); }
+    .uk-container-item-padding-remove-right { width: string.unquote('calc(100% + #{$container-padding-horizontal-m})'); }
 
     .uk-container-item-padding-remove-left { margin-left: (-$container-padding-horizontal-m); }
     .uk-container-item-padding-remove-right { margin-right: (-$container-padding-horizontal-m); }
@@ -172,6 +175,6 @@
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-container-misc)) {@include hook-container-misc();}
+@if(meta.mixin-exists(hook-container-misc)) {@include hook-container-misc();}
 
 // @mixin hook-container-misc(){}

package/src/scss/components/countdown.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Countdown
 // Description:     Component to create countdown timers
 //
@@ -27,7 +29,7 @@ $countdown-separator-font-size-m:                3rem !default; // 48px
  ========================================================================== */
 
 .uk-countdown {
-    @if(mixin-exists(hook-countdown)) {@include hook-countdown();}
+    @if(meta.mixin-exists(hook-countdown)) {@include hook-countdown();}
 }
 
 
@@ -36,7 +38,7 @@ $countdown-separator-font-size-m:                3rem !default; // 48px
 
 .uk-countdown-number,
 .uk-countdown-separator {
-    @if(mixin-exists(hook-countdown-item)) {@include hook-countdown-item();}
+    @if(meta.mixin-exists(hook-countdown-item)) {@include hook-countdown-item();}
 }
 
 
@@ -55,7 +57,7 @@ $countdown-separator-font-size-m:                3rem !default; // 48px
     /* 2 */
     font-size: $countdown-number-font-size;
     line-height: $countdown-number-line-height;
-    @if(mixin-exists(hook-countdown-number)) {@include hook-countdown-number();}
+    @if(meta.mixin-exists(hook-countdown-number)) {@include hook-countdown-number();}
 }
 
 /* Phone landscape and bigger */
@@ -79,7 +81,7 @@ $countdown-separator-font-size-m:                3rem !default; // 48px
 .uk-countdown-separator {
     font-size: $countdown-separator-font-size;
     line-height: $countdown-separator-line-height;
-    @if(mixin-exists(hook-countdown-separator)) {@include hook-countdown-separator();}
+    @if(meta.mixin-exists(hook-countdown-separator)) {@include hook-countdown-separator();}
 }
 
 /* Phone landscape and bigger */
@@ -101,14 +103,14 @@ $countdown-separator-font-size-m:                3rem !default; // 48px
  ========================================================================== */
 
 .uk-countdown-label {
-    @if(mixin-exists(hook-countdown-label)) {@include hook-countdown-label();}
+    @if(meta.mixin-exists(hook-countdown-label)) {@include hook-countdown-label();}
 }
 
 
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-countdown-misc)) {@include hook-countdown-misc();}
+@if(meta.mixin-exists(hook-countdown-misc)) {@include hook-countdown-misc();}
 
 // @mixin hook-countdown(){}
 // @mixin hook-countdown-item(){}

package/src/scss/components/cover.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+
 // Name:            Cover
 // Description:     Utilities to let embedded content cover their container in a centered position
 //
@@ -71,6 +73,6 @@ iframe[data-uk-cover] { pointer-events: none; }
 // Hooks
 // ========================================================================
 
-@if(mixin-exists(hook-cover-misc)) {@include hook-cover-misc();}
+@if(meta.mixin-exists(hook-cover-misc)) {@include hook-cover-misc();}
 
 // @mixin hook-cover-misc(){}

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(){}