fomantic-ui 2.9.1-beta.20 → 2.9.1-beta.22

package/examples/.eslintrc.js

@@ -0,0 +1,6 @@
+module.exports = {
+    globals: {
+        jQuery: false,
+        $: true,
+    },
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fomantic-ui",
-  "version": "2.9.1-beta.20+d4987bf",
+  "version": "2.9.1-beta.22+6a42d01",
   "description": "Fomantic empowers designers and developers by creating a shared vocabulary for UI.",
   "keywords": [
     "fomantic-ui",
@@ -26,14 +26,14 @@
   "scripts": {
     "build": "gulp build",
     "changelog": "auto-changelog -p",
-    "lint": "eslint --ext .js . && stylelint \"**/*.{css,less}\"",
-    "lint-fix": "eslint --ext .js . --fix && stylelint \"**/*.{css,less}\" --fix"
+    "lint": "eslint --ext .js . && stylelint \"**/*.{css,less,overrides,variables}\"",
+    "lint-fix": "eslint --ext .js . --fix && stylelint \"**/*.{css,less,overrides,variables}\" --fix"
   },
   "dependencies": {
     "@actions/core": "^1.6.0",
     "@octokit/core": "^3.6.0",
     "@octokit/rest": "^16.16.0",
-    "better-console": "1.0.1",
+    "better-console": "^1.0.1",
     "browserslist": "^4.19.1",
     "del": "^6.1.1",
     "extend": "^3.0.2",
@@ -46,7 +46,7 @@
     "gulp-concat-css": "^3.1.0",
     "gulp-concat-filenames": "^1.2.0",
     "gulp-copy": "^4.0.0",
-    "gulp-dedupe": "0.0.2",
+    "gulp-dedupe": "^0.0.2",
     "gulp-flatten": "^0.4.0",
     "gulp-git": "^2.9.0",
     "gulp-header": "^2.0.5",
@@ -75,7 +75,8 @@
   "devDependencies": {
     "all-contributors-cli": "^6.7.0",
     "auto-changelog": "^2.4.0",
-    "eslint": "^8.28.0",
+    "eslint": "^8.29.0",
+    "eslint-plugin-import": "^2.26.0",
     "node-fetch": "^2.6.0",
     "postcss": "^8.4.19",
     "postcss-less": "^6.0.0",

package/src/_site/collections/menu.overrides

@@ -1,3 +1,3 @@
 /*******************************
          Site Overrides
-*******************************/
+*******************************/

package/src/_site/elements/flag.variables

@@ -1,3 +1,3 @@
-/*-------------------
+/* -------------------
    Flag Variables
---------------------*/
+-------------------- */

package/src/_site/globals/site.variables

@@ -1,3 +1,3 @@
 /*******************************
      User Global Variables
-*******************************/
+*******************************/

package/src/definitions/behaviors/api.js

@@ -157,11 +157,6 @@
                 },
                 write: {
                     cachedResponse: function (url, response) {
-                        if (response && response === '') {
-                            module.debug('Response empty, not caching', response);
-
-                            return;
-                        }
                         if (window.Storage === undefined) {
                             module.error(error.noStorage);
 

package/src/definitions/behaviors/visibility.js

@@ -246,8 +246,8 @@
                     ;
                     while (imagesLength--) {
                         cacheImage = document.createElement('img');
-                        cacheImage.onload = handleLoad;
-                        cacheImage.onerror = handleLoad;
+                        cacheImage.addEventListener('load', handleLoad);
+                        cacheImage.addEventListener('error', handleLoad);
                         cacheImage.src = images[imagesLength];
                         cache.push(cacheImage);
                     }

package/src/definitions/collections/breadcrumb.less

@@ -43,7 +43,6 @@
     display: inline-block;
     opacity: @dividerOpacity;
     margin: 0 @dividerSpacing 0;
-
     font-size: @dividerSize;
     color: @dividerColor;
     vertical-align: @dividerVerticalAlign;

package/src/definitions/collections/form.less

@@ -123,11 +123,9 @@
     outline: none;
     -webkit-appearance: none;
     -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
-
     line-height: @inputLineHeight;
     padding: @inputPadding;
     font-size: @inputFontSize;
-
     background: @inputBackground;
     border: @inputBorder;
     color: @inputColor;
@@ -152,7 +150,6 @@
     margin: 0;
     -webkit-appearance: none;
     -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
-
     padding: @textAreaPadding;
     background: @textAreaBackground;
     border: @textAreaBorder;
@@ -796,15 +793,12 @@
         content: '';
         top: 50%;
         left: 50%;
-
         margin: @loaderMargin;
         width: @loaderSize;
         height: @loaderSize;
-
         animation: loader @loaderSpeed infinite linear;
         border: @loaderLineWidth solid @loaderLineColor;
         border-radius: @circularRadius;
-
         box-shadow: 0 0 0 1px transparent;
         visibility: visible;
         z-index: @loaderLineZIndex;
@@ -1119,10 +1113,8 @@
     .ui.form .inline.field > select {
         display: inline-block;
         width: auto;
-
         margin-top: 0;
         margin-bottom: 0;
-
         vertical-align: middle;
         font-size: @inlineInputSize;
     }

package/src/definitions/collections/grid.less

@@ -66,7 +66,6 @@
 .ui.grid > .row > .column {
     position: relative;
     display: inline-block;
-
     width: @oneWide;
     padding-left: (@gutterWidth / 2);
     padding-right: (@gutterWidth / 2);
@@ -1096,10 +1095,8 @@
             content: "";
             top: 0;
             left: 0;
-
             width: e(%("calc(100%% - %d)", @gutterWidth));
             height: 1px;
-
             margin: 0 (@gutterWidth / 2);
             box-shadow: @verticallyDividedBorder;
         }

package/src/definitions/collections/menu.less

@@ -82,7 +82,6 @@
     -webkit-tap-highlight-color: transparent;
     flex: 0 0 auto;
     user-select: none;
-
     background: @itemBackground;
     padding: @itemVerticalPadding @itemHorizontalPadding;
     text-transform: @itemTextTransform;
@@ -102,7 +101,6 @@
     top: 0;
     right: 0;
     height: 100%;
-
     width: @dividerSize;
     background: @dividerBackground;
 }
@@ -292,6 +290,7 @@
             /* IE needs 0, all others support max-content to show dropdown icon inline, so keep both settings! */
             min-width: 0;
         }
+
         min-width: max-content;
         margin: 0 0 0 @dropdownMenuDistance;
         box-shadow: @dropdownVerticalMenuBoxShadow;
@@ -643,7 +642,6 @@ Floated Menu / Item
     .ui.tabular.menu .item {
         background: transparent;
         border-bottom: none;
-
         border-left: @tabularBorderWidth solid transparent;
         border-right: @tabularBorderWidth solid transparent;
         border-top: @tabularOppositeBorderWidth solid transparent;
@@ -968,7 +966,6 @@ Floated Menu / Item
             border-bottom-style: solid;
             border-radius: 0;
             align-self: flex-end;
-
             margin: 0 0 -@secondaryPointingBorderWidth;
             padding: @secondaryPointingItemVerticalPadding @secondaryPointingItemHorizontalPadding;
             border-bottom-width: @secondaryPointingBorderWidth;
@@ -1094,7 +1091,6 @@ Floated Menu / Item
         border-radius: 0;
         box-shadow: none;
         border: none;
-
         margin: @textMenuMargin;
     }
     .ui.text.menu .item {
@@ -1596,6 +1592,7 @@ Floated Menu / Item
                 /* IE hack to make dropdown icons appear inline */
                 display: -ms-inline-flexbox !important;
             }
+
             display: inline-block;
         }
     }
@@ -1764,15 +1761,12 @@ Floated Menu / Item
         left: 50%;
         transform: translateX(-50%) translateY(-50%) rotate(45deg);
         background: none;
-
         margin: (@arrowBorderWidth / 2) 0 0;
         width: @arrowSize;
         height: @arrowSize;
-
         border: none;
         border-bottom: @arrowBorder;
         border-right: @arrowBorder;
-
         z-index: @arrowZIndex;
         transition: @arrowTransition;
     }
@@ -1783,10 +1777,8 @@ Floated Menu / Item
             right: 0;
             bottom: auto;
             left: auto;
-
             transform: translateX(50%) translateY(-50%) rotate(45deg);
             margin: 0 -(@arrowBorderWidth / 2) 0 0;
-
             border: none;
             border-top: @arrowBorder;
             border-right: @arrowBorder;

package/src/definitions/collections/message.less

@@ -296,7 +296,7 @@
             text           : @positiveTextColor;
             invertedText   : @positiveBorderColor;
         };
-        @negative: { // stylelint-disable-line indentation
+        @negative: {
             background     : @negativeBackgroundColor;
             header         : @negativeHeaderColor;
             boxShadow      : @negativeBoxShadow;
@@ -304,7 +304,7 @@
             text           : @negativeTextColor;
             invertedText   : @negativeBorderColor;
         };
-        @info: { // stylelint-disable-line indentation
+        @info: {
             background     : @infoBackgroundColor;
             header         : @infoHeaderColor;
             boxShadow      : @infoBoxShadow;
@@ -312,7 +312,7 @@
             text           : @infoTextColor;
             invertedText   : @formInfoLabelBackground;
         };
-        @warning: { // stylelint-disable-line indentation
+        @warning: {
             background     : @warningBackgroundColor;
             header         : @warningHeaderColor;
             boxShadow      : @warningBoxShadow;
@@ -320,7 +320,7 @@
             text           : @warningTextColor;
             invertedText   : @formWarningLabelBackground;
         };
-        @error: { // stylelint-disable-line indentation
+        @error: {
             background     : @errorBackgroundColor;
             header         : @errorHeaderColor;
             boxShadow      : @errorBoxShadow;
@@ -328,7 +328,7 @@
             text           : @errorTextColor;
             invertedText   : @formErrorLabelBackground;
         };
-        @success: { // stylelint-disable-line indentation
+        @success: {
             background     : @successBackgroundColor;
             header         : @successHeaderColor;
             boxShadow      : @successBoxShadow;

package/src/definitions/elements/button.less

@@ -24,20 +24,15 @@
 .ui.button {
     cursor: pointer;
     display: inline-block;
-
     min-height: 1em;
-
     outline: none;
     border: none;
     vertical-align: @verticalAlign;
     background: @background;
     color: @textColor;
-
     font-family: @fontFamily;
-
     margin: 0 @horizontalMargin @verticalMargin 0;
     padding: @verticalPadding @horizontalPadding (@verticalPadding + @shadowOffset);
-
     text-transform: @textTransform;
     text-shadow: @textShadow;
     font-weight: @fontWeight;
@@ -45,14 +40,11 @@
     font-style: normal;
     text-align: center;
     text-decoration: none;
-
     border-radius: @borderRadius;
     box-shadow: @boxShadow;
-
     user-select: none;
     transition: @transition;
     will-change: @willChange;
-
     -webkit-tap-highlight-color: @tapColor;
 }
 
@@ -142,11 +134,9 @@
         content: '';
         top: 50%;
         left: 50%;
-
         margin: @loaderMargin;
         width: @loaderSize;
         height: @loaderSize;
-
         border-radius: @circularRadius;
         border: @loaderLineWidth solid @invertedLoaderFillColor;
     }
@@ -155,17 +145,13 @@
         content: '';
         top: 50%;
         left: 50%;
-
         margin: @loaderMargin;
         width: @loaderSize;
         height: @loaderSize;
-
         border-radius: @circularRadius;
-
         animation: loader @loaderSpeed infinite linear;
         border: @loaderLineWidth solid currentColor;
         color: @invertedLoaderLineColor;
-
         box-shadow: 0 0 0 1px transparent;
     }
     .ui.ui.ui.loading.button .label {
@@ -1018,7 +1004,6 @@
         text-align: center;
         animation: none;
         padding: @verticalPadding 0 @verticalPadding 0;
-
         margin: @labeledIconMargin;
         width: @labeledIconWidth;
         background-color: @labeledIconBackgroundColor;
@@ -1135,25 +1120,19 @@
         position: absolute;
         text-align: center;
         border-radius: @circularRadius;
-
         content: @orText;
         top: 50%;
         left: 50%;
         background-color: @orBackgroundColor;
         text-shadow: @orTextShadow;
-
         margin-top: @orVerticalOffset;
         margin-left: @orHorizontalOffset;
-
         width: @orCircleSize;
         height: @orCircleSize;
-
         line-height: @orLineHeight;
         color: @orTextColor;
-
         font-style: @orTextStyle;
         font-weight: @orTextWeight;
-
         box-shadow: @orBoxShadow;
     }
 
@@ -1199,7 +1178,6 @@
         display: inline-block;
         border-left: none;
         text-align: right;
-
         padding-right: @attachedHorizontalPadding;
         border-radius: @borderRadius 0 0 @borderRadius;
     }

package/src/definitions/elements/divider.less

@@ -23,15 +23,12 @@
 
 .ui.divider {
     margin: @margin;
-
     line-height: 1;
     height: 0;
-
     font-weight: @fontWeight;
     text-transform: @textTransform;
     letter-spacing: @letterSpacing;
     color: @color;
-
     user-select: none;
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
@@ -63,7 +60,6 @@
     .ui.horizontal.divider {
         display: table;
         white-space: nowrap;
-
         height: auto;
         margin: @horizontalMargin;
         line-height: 1;
@@ -98,12 +94,10 @@
         z-index: 2;
         top: 50%;
         left: 50%;
-
         margin: 0;
         padding: 0;
         width: auto;
         height: 50%;
-
         line-height: 0;
         text-align: center;
         transform: translateX(-50%);
@@ -115,10 +109,8 @@
         left: 50%;
         content: '';
         z-index: 3;
-
         border-left: @shadowWidth @borderStyle @shadowColor;
         border-right: @highlightWidth @borderStyle @highlightColor;
-
         width: 0;
         height: @verticalDividerHeight;
     }

package/src/definitions/elements/emoji.less

@@ -23,7 +23,6 @@
 
 em[data-emoji] {
     opacity: @opacity;
-
     speak: none;
     backface-visibility: hidden;
 }

package/src/definitions/elements/icon.less

@@ -33,18 +33,14 @@
 i.icon {
     display: inline-block;
     opacity: @opacity;
-
     margin: 0 @distanceFromText 0 0;
-
     width: @width;
     height: @height;
-
     font-family: @fontName;
     font-style: normal;
     font-weight: @normal;
     text-decoration: inherit;
     text-align: center;
-
     speak: none;
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
@@ -137,10 +133,8 @@ i.emphasized.icons:not(.disabled) {
     i.circular.icon {
         border-radius: 500em !important;
         line-height: 1 !important;
-
         padding: @circularPadding !important;
         box-shadow: @circularShadow;
-
         width: @circularSize !important;
         height: @circularSize !important;
         &.colored when (@variationIconColored) {
@@ -286,7 +280,6 @@ i.emphasized.icons:not(.disabled) {
     i.bordered.icon {
         line-height: 1;
         vertical-align: baseline;
-
         width: @borderedSize;
         height: @borderedSize;
         padding: @borderedVerticalPadding @borderedHorizontalPadding !important;
@@ -633,7 +626,6 @@ and ((@variationIconBordered) or (@variationIconCircular)) {
         top: 50%;
         transform: translateY(-50%);
         text-align: center;
-
         color: @duotoneSecondaryColor;
         opacity: @duotoneSecondaryOpacity;
     }

package/src/definitions/elements/image.less

@@ -196,11 +196,9 @@ img.ui.image {
     .ui.avatar.image svg,
     .ui.avatar.image {
         margin-right: @avatarMargin;
-
         display: inline-block;
         width: @avatarSize;
         height: @avatarSize;
-
         -webkit-border-radius: @circularRadius;
         -moz-border-radius: @circularRadius;
         border-radius: @circularRadius;

package/src/definitions/elements/input.less

@@ -40,15 +40,12 @@
     -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
     text-align: @textAlign;
     line-height: @lineHeight;
-
     font-family: @inputFont;
-
     background: @background;
     border: @border;
     color: @inputColor;
     border-radius: @borderRadius;
     transition: @transition;
-
     box-shadow: @boxShadow;
     &:not([type="color"]) {
         padding: @padding;
@@ -119,11 +116,9 @@
         content: '';
         top: 50%;
         left: 50%;
-
         margin: @loaderMargin;
         width: @loaderSize;
         height: @loaderSize;
-
         border-radius: @circularRadius;
         border: @loaderLineWidth solid @loaderFillColor;
     }
@@ -132,16 +127,12 @@
         content: '';
         top: 50%;
         left: 50%;
-
         margin: @loaderMargin;
         width: @loaderSize;
         height: @loaderSize;
-
         animation: loader @loaderSpeed infinite linear;
-
         border: @loaderLineWidth solid @loaderLineColor;
         border-radius: @circularRadius;
-
         box-shadow: 0 0 0 1px transparent;
     }
 }
@@ -293,7 +284,6 @@
         right: 0;
         margin: 0;
         height: 100%;
-
         width: @iconWidth;
         opacity: @iconOpacity;
         border-radius: 0 @borderRadius @borderRadius 0;