fomantic-ui 2.10.0-beta.8 → 2.10.0-beta.81

package/src/definitions/modules/popup.less

@@ -237,18 +237,12 @@
                 /* Top Center (default) */
                 [data-tooltip]:not([data-position])::after,
                 [data-position="top center"][data-tooltip]::after {
-                    top: auto;
-                    right: auto;
-                    left: 50%;
-                    bottom: 100%;
+                    inset: auto auto 100% 50%;
                     margin-bottom: @tooltipDistanceAway;
                 }
                 [data-tooltip]:not([data-position])::before,
                 [data-position="top center"][data-tooltip]::before {
-                    top: auto;
-                    right: auto;
-                    bottom: 100%;
-                    left: 50%;
+                    inset: auto auto 100% 50%;
                     background: @tooltipArrowTopBackground;
                     margin-left: @tooltipArrowHorizontalOffset;
                     margin-bottom: -@tooltipArrowVerticalOffset;
@@ -257,17 +251,11 @@
             & when (@variationPopupLeft) {
                 /* Top Left */
                 [data-position="top left"][data-tooltip]::after {
-                    top: auto;
-                    right: auto;
-                    left: 0;
-                    bottom: 100%;
+                    inset: auto auto 100% 0;
                     margin-bottom: @tooltipDistanceAway;
                 }
                 [data-position="top left"][data-tooltip]::before {
-                    top: auto;
-                    right: auto;
-                    bottom: 100%;
-                    left: @arrowDistanceFromEdge;
+                    inset: auto auto 100% @arrowDistanceFromEdge;
                     margin-left: @tooltipArrowHorizontalOffset;
                     margin-bottom: -@tooltipArrowVerticalOffset;
                 }
@@ -275,17 +263,11 @@
             & when (@variationPopupRight) {
                 /* Top Right */
                 [data-position="top right"][data-tooltip]::after {
-                    top: auto;
-                    left: auto;
-                    right: 0;
-                    bottom: 100%;
+                    inset: auto 0 100% auto;
                     margin-bottom: @tooltipDistanceAway;
                 }
                 [data-position="top right"][data-tooltip]::before {
-                    top: auto;
-                    left: auto;
-                    bottom: 100%;
-                    right: @arrowDistanceFromEdge;
+                    inset: auto @arrowDistanceFromEdge 100% auto;
                     margin-left: @tooltipArrowHorizontalOffset;
                     margin-bottom: -@tooltipArrowVerticalOffset;
                 }
@@ -300,17 +282,11 @@
             & when (@variationPopupCenter) {
                 /* Bottom Center */
                 [data-position="bottom center"][data-tooltip]::after {
-                    bottom: auto;
-                    right: auto;
-                    left: 50%;
-                    top: 100%;
+                    inset: 100% auto auto 50%;
                     margin-top: @tooltipDistanceAway;
                 }
                 [data-position="bottom center"][data-tooltip]::before {
-                    bottom: auto;
-                    right: auto;
-                    top: 100%;
-                    left: 50%;
+                    inset: 100% auto auto 50%;
                     margin-left: @tooltipArrowHorizontalOffset;
                     margin-top: -@arrowOffset;
                 }
@@ -323,10 +299,7 @@
                     margin-top: @tooltipDistanceAway;
                 }
                 [data-position="bottom left"][data-tooltip]::before {
-                    bottom: auto;
-                    right: auto;
-                    top: 100%;
-                    left: @arrowDistanceFromEdge;
+                    inset: 100% auto auto @arrowDistanceFromEdge;
                     margin-left: @tooltipArrowHorizontalOffset;
                     margin-top: -@tooltipArrowVerticalOffset;
                 }
@@ -339,10 +312,7 @@
                     margin-top: @tooltipDistanceAway;
                 }
                 [data-position="bottom right"][data-tooltip]::before {
-                    bottom: auto;
-                    left: auto;
-                    top: 100%;
-                    right: @arrowDistanceFromEdge;
+                    inset: 100% @arrowDistanceFromEdge auto auto;
                     margin-left: @tooltipArrowVerticalOffset;
                     margin-top: -@tooltipArrowHorizontalOffset;
                 }
@@ -548,10 +518,7 @@
     /* --- Below --- */
     .ui.bottom.center.popup::before {
         margin-left: @arrowOffset;
-        top: @arrowOffset;
-        left: 50%;
-        right: auto;
-        bottom: auto;
+        inset: @arrowOffset auto auto 50%;
         box-shadow: @bottomArrowBoxShadow;
     }
 
@@ -561,10 +528,7 @@
 
     /* rtl:rename */
     .ui.bottom.left.popup::before {
-        top: @arrowOffset;
-        left: @arrowDistanceFromEdge;
-        right: auto;
-        bottom: auto;
+        inset: @arrowOffset auto auto @arrowDistanceFromEdge;
         margin-left: 0;
         box-shadow: @bottomArrowBoxShadow;
     }
@@ -575,10 +539,7 @@
 
     /* rtl:rename */
     .ui.bottom.right.popup::before {
-        top: @arrowOffset;
-        right: @arrowDistanceFromEdge;
-        bottom: auto;
-        left: auto;
+        inset: @arrowOffset @arrowDistanceFromEdge auto auto;
         margin-left: 0;
         box-shadow: @bottomArrowBoxShadow;
     }
@@ -588,10 +549,7 @@
     /* --- Above --- */
     & when (@variationPopupCenter) {
         .ui.top.center.popup::before {
-            top: auto;
-            right: auto;
-            bottom: @arrowOffset;
-            left: 50%;
+            inset: auto auto @arrowOffset 50%;
             margin-left: @arrowOffset;
         }
     }
@@ -602,10 +560,7 @@
 
         /* rtl:rename */
         .ui.top.left.popup::before {
-            bottom: @arrowOffset;
-            left: @arrowDistanceFromEdge;
-            top: auto;
-            right: auto;
+            inset: auto auto @arrowOffset @arrowDistanceFromEdge;
             margin-left: 0;
         }
     }
@@ -616,10 +571,7 @@
 
         /* rtl:rename */
         .ui.top.right.popup::before {
-            bottom: @arrowOffset;
-            right: @arrowDistanceFromEdge;
-            top: auto;
-            left: auto;
+            inset: auto @arrowDistanceFromEdge @arrowOffset auto;
             margin-left: 0;
         }
     }
@@ -631,10 +583,7 @@
     /* rtl:rename */
     & when (@variationPopupLeft) {
         .ui.left.center.popup::before {
-            top: 50%;
-            right: @arrowOffset;
-            bottom: auto;
-            left: auto;
+            inset: 50% @arrowOffset auto auto;
             margin-top: @arrowOffset;
             box-shadow: @leftArrowBoxShadow;
         }
@@ -644,10 +593,7 @@
 
         /* rtl:rename */
         .ui.right.center.popup::before {
-            top: 50%;
-            left: @arrowOffset;
-            bottom: auto;
-            right: auto;
+            inset: 50% auto auto @arrowOffset;
             margin-top: @arrowOffset;
             box-shadow: @rightArrowBoxShadow;
         }
@@ -932,5 +878,4 @@
     });
 }
 
-// stylelint-disable no-invalid-position-at-import-rule
 @import (multiple, optional) "../../overrides.less";

package/src/definitions/modules/progress.js

@@ -19,43 +19,42 @@
         ? window
         : globalThis;
 
-    $.fn.progress = function (parameters) {
-        let $allModules = $(this);
+    $.fn.progress = function (...args) {
+        const $allModules = $(this);
 
         let time = Date.now();
         let performance = [];
 
-        let query = arguments[0];
-        let methodInvoked = typeof query === 'string';
-        let queryArguments = [].slice.call(arguments, 1);
+        const parameters = args[0];
+        const methodInvoked = typeof parameters === 'string';
+        const queryArguments = args.slice(1);
 
         let returnedValue;
 
         $allModules.each(function () {
-            let settings = $.isPlainObject(parameters)
+            const settings = $.isPlainObject(parameters)
                 ? $.extend(true, {}, $.fn.progress.settings, parameters)
                 : $.extend({}, $.fn.progress.settings);
 
-            let className = settings.className;
-            let metadata = settings.metadata;
-            let namespace = settings.namespace;
-            let selector = settings.selector;
-            let error = settings.error;
+            const className = settings.className;
+            const metadata = settings.metadata;
+            const namespace = settings.namespace;
+            const selector = settings.selector;
+            const error = settings.error;
 
-            let eventNamespace = '.' + namespace;
-            let moduleNamespace = 'module-' + namespace;
+            const eventNamespace = '.' + namespace;
+            const moduleNamespace = 'module-' + namespace;
 
-            let $module = $(this);
-            let $bars = $(this).find(selector.bar);
-            let $progresses = $(this).find(selector.progress);
-            let $label = $(this).find(selector.label);
+            const $module = $(this);
+            const $bars = $(this).find(selector.bar);
+            const $progresses = $(this).find(selector.progress);
+            const $label = $(this).find(selector.label);
 
-            let element = this;
+            const element = this;
             let instance = $module.data(moduleNamespace);
 
             let animating = false;
-            let module;
-            module = {
+            const module = {
                 helper: {
                     sum: function (nums) {
                         return Array.isArray(nums) ? nums.reduce(function (left, right) {
@@ -92,7 +91,7 @@
                             if (ratio > 1) {
                                 break;
                             }
-                            precision = Math.pow(10, precisionPower++);
+                            precision = 10 ** precisionPower++;
                         }
 
                         return precision;
@@ -100,7 +99,7 @@
                     forceArray: function (element) {
                         return Array.isArray(element)
                             ? element
-                            : (!isNaN(element)
+                            : (!Number.isNaN(Number(element))
                                 ? [element]
                                 : (typeof element === 'string' ? element.split(',') : [])); // eslint-disable-line unicorn/no-nested-ternary
                     },
@@ -146,7 +145,7 @@
 
                 read: {
                     metadata: function () {
-                        let data = {
+                        const data = {
                             percent: module.helper.forceArray($module.data(metadata.percent)),
                             total: $module.data(metadata.total),
                             value: module.helper.forceArray($module.data(metadata.value)),
@@ -212,7 +211,7 @@
                     module.set.progress(newValue);
                 },
                 decrement: function (decrementValue) {
-                    let total = module.get.total();
+                    const total = module.get.total();
                     let startValue;
                     let newValue;
                     if (total) {
@@ -240,20 +239,15 @@
                 },
 
                 get: {
-                    text: function (templateText, index) {
-                        if (!index) {
-                            index = 0;
-                        }
-
-                        let value = module.get.value(index);
-                        let total = module.get.total();
-                        let percent = animating
+                    text: function (templateText = '', index = 0) {
+                        const value = module.get.value(index);
+                        const total = module.get.total();
+                        const percent = animating
                             ? module.get.displayPercent(index)
                             : module.get.percent(index);
-                        let left = total !== false
+                        const left = total !== false
                             ? Math.max(0, total - value)
                             : 100 - percent;
-                        templateText = templateText || '';
                         templateText = templateText
                             .replace('{value}', value)
                             .replace('{total}', total || 0)
@@ -310,11 +304,11 @@
 
                     // gets current displayed percentage (if animating values, this is the intermediary value)
                     displayPercent: function (index) {
-                        let $bar = $($bars[index]);
-                        let barWidth = $bar.width();
-                        let totalWidth = $module.width();
-                        let minDisplay = parseInt($bar.css('min-width'), 10);
-                        let displayPercent = barWidth > minDisplay
+                        const $bar = $($bars[index]);
+                        const barWidth = $bar.width();
+                        const totalWidth = $module.width();
+                        const minDisplay = Number.parseInt($bar.css('min-width'), 10);
+                        const displayPercent = barWidth > minDisplay
                             ? (barWidth / totalWidth) * 100
                             : module.percent;
 
@@ -406,12 +400,12 @@
                         values = module.helper.forceArray(values);
                         let firstNonZeroIndex = -1;
                         let lastNonZeroIndex = -1;
-                        let valuesSum = module.helper.sum(values);
-                        let barCounts = $bars.length;
-                        let isMultiple = barCounts > 1;
-                        let percents = values.map(function (value, index) {
-                            let allZero = index === barCounts - 1 && valuesSum === 0;
-                            let $bar = $($bars[index]);
+                        const valuesSum = module.helper.sum(values);
+                        const barCounts = $bars.length;
+                        const isMultiple = barCounts > 1;
+                        const percents = values.map(function (value, index) {
+                            const allZero = index === barCounts - 1 && valuesSum === 0;
+                            const $bar = $($bars[index]);
                             if (value === 0 && isMultiple && !allZero) {
                                 $bar.css('display', 'none');
                             } else {
@@ -428,22 +422,21 @@
                                 });
                             }
 
-                            return parseFloat(value);
+                            return Number.parseFloat(value);
                         });
-                        values.forEach(function (_, index) {
-                            let $bar = $($bars[index]);
+                        for (const [index, _] of values.entries()) {
+                            const $bar = $($bars[index]);
                             $bar.css({
                                 borderTopLeftRadius: index === firstNonZeroIndex ? '' : '0',
                                 borderBottomLeftRadius: index === firstNonZeroIndex ? '' : '0',
                                 borderTopRightRadius: index === lastNonZeroIndex ? '' : '0',
                                 borderBottomRightRadius: index === lastNonZeroIndex ? '' : '0',
                             });
-                        });
+                        }
                         $module
                             .attr('data-percent', percents);
                     },
-                    duration: function (duration) {
-                        duration = duration || settings.duration;
+                    duration: function (duration = settings.duration) {
                         duration = typeof duration === 'number'
                             ? duration + 'ms'
                             : duration;
@@ -463,10 +456,10 @@
                                 ? Math.max(0, Math.min(100, percent))
                                 : percent;
                         });
-                        let hasTotal = module.has.total();
-                        let totalPercent = module.helper.sum(percents);
-                        let isMultipleValues = percents.length > 1 && hasTotal;
-                        let sumTotal = module.helper.sum(module.helper.forceArray(module.value));
+                        const hasTotal = module.has.total();
+                        const totalPercent = module.helper.sum(percents);
+                        const isMultipleValues = percents.length > 1 && hasTotal;
+                        const sumTotal = module.helper.sum(module.helper.forceArray(module.value));
                         if (isMultipleValues && sumTotal > module.total) {
                             // Sum values instead of percents to avoid precision issues when summing floats
                             module.error(error.sumExceedsTotal, sumTotal, module.total);
@@ -476,14 +469,14 @@
                         } else if (totalPercent < 0) {
                             module.error(error.tooLow, totalPercent);
                         } else {
-                            let autoPrecision = settings.precision > 0
+                            const autoPrecision = settings.precision > 0
                                 ? settings.precision
                                 : (isMultipleValues
                                     ? module.helper.derivePrecision(Math.min.apply(null, module.value), module.total)
                                     : 0);
 
                             // round display percentage
-                            let roundedPercents = percents.map(function (percent) {
+                            const roundedPercents = percents.map(function (percent) {
                                 return autoPrecision > 0
                                     ? Math.round(percent * (10 * autoPrecision)) / (10 * autoPrecision)
                                     : Math.round(percent);
@@ -502,7 +495,7 @@
                         settings.onChange.call(element, percents, module.value, module.total);
                     },
                     labelInterval: function () {
-                        let animationCallback = function () {
+                        const animationCallback = function () {
                             module.verbose('Bar finished animating, removing continuous label updates');
                             clearInterval(module.interval);
                             animating = false;
@@ -512,7 +505,7 @@
                         module.bind.transitionEnd(animationCallback);
                         animating = true;
                         module.interval = setInterval(function () {
-                            let isInDOM = $.contains(document.documentElement, element);
+                            const isInDOM = document.documentElement.contains(element);
                             if (!isInDOM) {
                                 clearInterval(module.interval);
                                 animating = false;
@@ -532,10 +525,7 @@
                             $label.text(text);
                         }
                     },
-                    state: function (percent) {
-                        percent = percent !== undefined
-                            ? percent
-                            : module.helper.sum(module.percent);
+                    state: function (percent = module.helper.sum(module.percent)) {
                         if (percent === 100) {
                             if (settings.autoSuccess && $bars.length === 1 && !(module.is.warning() || module.is.error() || module.is.success())) {
                                 module.set.success();
@@ -558,7 +548,7 @@
                     },
                     barLabel: function (text) {
                         $progresses.each(function (index, element) {
-                            let $progress = $(element);
+                            const $progress = $(element);
                             if (text !== undefined) {
                                 $progress.text(module.get.text(text, index));
                             } else if (settings.label === 'ratio' && module.has.total()) {
@@ -570,8 +560,7 @@
                             }
                         });
                     },
-                    active: function (text) {
-                        text = text || settings.text.active;
+                    active: function (text = settings.text.active) {
                         module.debug('Setting active state');
                         if (settings.showActivity && !module.is.active()) {
                             $module.addClass(className.active);
@@ -587,8 +576,7 @@
                             settings.onActive.call(element, module.value, module.total);
                         });
                     },
-                    success: function (text, keepState) {
-                        text = text || settings.text.success || settings.text.active;
+                    success: function (text = settings.text.success || settings.text.active, keepState = false) {
                         module.debug('Setting success state');
                         $module.addClass(className.success);
                         module.remove.active();
@@ -606,8 +594,7 @@
                             settings.onSuccess.call(element, module.total);
                         });
                     },
-                    warning: function (text, keepState) {
-                        text = text || settings.text.warning;
+                    warning: function (text = settings.text.warning, keepState = false) {
                         module.debug('Setting warning state');
                         $module.addClass(className.warning);
                         module.remove.active();
@@ -622,8 +609,7 @@
                             settings.onWarning.call(element, module.value, module.total);
                         });
                     },
-                    error: function (text, keepState) {
-                        text = text || settings.text.error;
+                    error: function (text = settings.text.error, keepState = false) {
                         module.debug('Setting error state');
                         $module.addClass(className.error);
                         module.remove.active();
@@ -661,7 +647,7 @@
 
                 update: {
                     toNextValue: function () {
-                        let nextValue = module.nextValue;
+                        const nextValue = module.nextValue;
                         if (nextValue) {
                             module.debug('Update interval complete using last updated value', nextValue);
                             module.update.progress(nextValue);
@@ -669,11 +655,11 @@
                         }
                     },
                     progress: function (values) {
-                        let hasTotal = module.has.total();
+                        const hasTotal = module.has.total();
                         if (hasTotal) {
                             module.set.value(values);
                         }
-                        let percentCompletes = module.helper.forceArray(values).map(function (value) {
+                        const percentCompletes = module.helper.forceArray(values).map(function (value) {
                             let percentComplete;
                             value = module.get.numericValue(value);
                             if (value === false) {
@@ -717,30 +703,30 @@
                         return module[name];
                     }
                 },
-                debug: function () {
+                debug: function (...args) {
                     if (!settings.silent && settings.debug) {
                         if (settings.performance) {
-                            module.performance.log(arguments);
+                            module.performance.log(args);
                         } else {
                             module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
-                            module.debug.apply(console, arguments);
+                            module.debug.apply(console, args);
                         }
                     }
                 },
-                verbose: function () {
+                verbose: function (...args) {
                     if (!settings.silent && settings.verbose && settings.debug) {
                         if (settings.performance) {
-                            module.performance.log(arguments);
+                            module.performance.log(args);
                         } else {
                             module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
-                            module.verbose.apply(console, arguments);
+                            module.verbose.apply(console, args);
                         }
                     }
                 },
-                error: function () {
+                error: function (...args) {
                     if (!settings.silent) {
                         module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
-                        module.error.apply(console, arguments);
+                        module.error.apply(console, args);
                     }
                 },
                 performance: {
@@ -755,7 +741,7 @@
                             time = currentTime;
                             performance.push({
                                 Name: message[0],
-                                Arguments: [].slice.call(message, 1) || '',
+                                Arguments: message.slice(1),
                                 Element: element,
                                 'Execution Time': executionTime,
                             });
@@ -776,30 +762,22 @@
                         title += ' ' + totalTime + 'ms';
                         if (performance.length > 0) {
                             console.groupCollapsed(title);
-                            if (console.table) {
-                                console.table(performance);
-                            } else {
-                                $.each(performance, function (index, data) {
-                                    console.log(data.Name + ': ' + data['Execution Time'] + 'ms');
-                                });
-                            }
+                            console.table(performance);
                             console.groupEnd();
                         }
                         performance = [];
                     },
                 },
-                invoke: function (query, passedArguments, context) {
+                invoke: function (query, passedArguments = queryArguments, context = element) {
                     let object = instance;
                     let maxDepth;
                     let found;
                     let response;
-                    passedArguments = passedArguments || queryArguments;
-                    context = context || element;
                     if (typeof query === 'string' && object !== undefined) {
                         query = query.split(/[ .]/);
                         maxDepth = query.length - 1;
                         $.each(query, function (depth, value) {
-                            let camelCaseValue = depth !== maxDepth
+                            const camelCaseValue = depth !== maxDepth
                                 ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
                                 : query;
                             if ($.isPlainObject(object[camelCaseValue]) && (depth !== maxDepth)) {
@@ -842,7 +820,7 @@
                 if (instance === undefined) {
                     module.initialize();
                 }
-                module.invoke(query);
+                module.invoke(parameters);
             } else {
                 if (instance !== undefined) {
                     instance.invoke('destroy');

package/src/definitions/modules/progress.less

@@ -91,10 +91,7 @@
     position: @progressPosition;
     width: @progressWidth;
     font-size: @progressSize;
-    top: @progressTop;
-    right: @progressRight;
-    left: @progressLeft;
-    bottom: @progressBottom;
+    inset: @progressTop @progressRight @progressBottom @progressLeft;
     color: @progressColor;
     text-shadow: @progressTextShadow;
     margin-top: @progressOffset;
@@ -117,10 +114,7 @@
     position: absolute;
     width: @labelWidth;
     font-size: @labelSize;
-    top: @labelTop;
-    right: @labelRight;
-    left: @labelLeft;
-    bottom: @labelBottom;
+    inset: @labelTop @labelRight @labelBottom @labelLeft;
     color: @labelColor;
     font-weight: @labelFontWeight;
     text-shadow: @labelTextShadow;
@@ -352,10 +346,7 @@
         content: "";
         opacity: 0;
         position: absolute;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
+        inset: 0;
         background: @activePulseColor;
         border-radius: @barBorderRadius;
         animation: progress-active @activePulseDuration @defaultEasing infinite;
@@ -668,5 +659,4 @@
     }
 }
 
-// stylelint-disable no-invalid-position-at-import-rule
 @import (multiple, optional) "../../overrides.less";