@itcase/ui 1.2.5 → 1.2.6

package/dist/css/components/DadataHintField/DadataHintField.css

@@ -1,4 +1,4 @@
-.react-dadata__container{position:relative}.react-dadata__input{border:1px solid #ccc;border-radius:4px;box-sizing:border-box;display:block;font-size:16px;height:38px;outline:none;padding:0 10px;width:100%}.react-dadata__input:focus{border-color:#007cd6;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 0 3px rgba(0,124,214,.3)}.react-dadata__suggestions{background-color:#fff;border-radius:4px;box-shadow:0 1px 6px 3px rgba(0,0,0,.1);left:0;list-style:none;margin:0;overflow:hidden;padding:0;position:absolute;right:0;text-align:left;top:calc(100% + 8px);z-index:10}.react-dadata__suggestion-note{color:#828282;font-size:14px;padding:10px 10px 5px}.react-dadata__suggestion{background:none;border:none;box-sizing:border-box;cursor:pointer;display:block;font-size:15px;padding:7px 10px;text-align:left;width:100%}.react-dadata__suggestion--line-through{text-decoration:line-through}.react-dadata__suggestion-subtitle{color:#777;font-size:14px;margin-top:4px}.react-dadata__suggestion-subtitle-item{display:inline-block;margin-bottom:4px;margin-right:16px}.react-dadata__suggestion-subtitle-item:last-child{margin-right:0}.react-dadata__suggestion--current{background-color:rgba(0,124,214,.15)}.react-dadata__suggestion:hover{background-color:rgba(0,124,214,.1)}.react-dadata mark{background:none}.react-dadata--highlighted{color:#0094ff}.react-dadata {
+.react-dadata__container{position:relative}.react-dadata__input{box-sizing:border-box;border:1px solid #ccc;border-radius:4px;outline:none;width:100%;height:38px;padding:0 10px;font-size:16px;display:block}.react-dadata__input:focus{border-color:#007cd6;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 0 3px rgba(0,124,214,.3)}.react-dadata__suggestions{z-index:10;text-align:left;background-color:#fff;border-radius:4px;margin:0;padding:0;list-style:none;position:absolute;top:calc(100% + 8px);left:0;right:0;overflow:hidden;box-shadow:0 1px 6px 3px rgba(0,0,0,.1)}.react-dadata__suggestion-note{color:#828282;padding:10px 10px 5px;font-size:14px}.react-dadata__suggestion{cursor:pointer;box-sizing:border-box;text-align:left;background:0 0;border:none;width:100%;padding:7px 10px;font-size:15px;display:block}.react-dadata__suggestion--line-through{text-decoration:line-through}.react-dadata__suggestion-subtitle{color:#777;margin-top:4px;font-size:14px}.react-dadata__suggestion-subtitle-item{margin-bottom:4px;margin-right:16px;display:inline-block}.react-dadata__suggestion-subtitle-item:last-child{margin-right:0}.react-dadata__suggestion--current{background-color:rgba(0,124,214,.15)}.react-dadata__suggestion:hover{background-color:rgba(0,124,214,.1)}.react-dadata mark{background:0 0}.react-dadata--highlighted{color:#0094ff}.react-dadata {
   &__container {
     width: 100%;
     ^&__input {

package/dist/css/components/Swiper/Swiper.css

@@ -1,5 +1,5 @@
 /**
- * Swiper 11.1.10
+ * Swiper 11.1.12
  * Most modern mobile touch slider and framework with hardware accelerated transitions
  * https://swiperjs.com
  *
@@ -7,7 +7,7 @@
  *
  * Released under the MIT License
  *
- * Released on: August 21, 2024
+ * Released on: September 1, 2024
  */
 
 /* FONT_START */
@@ -760,7 +760,7 @@ button.swiper-pagination-bullet {
   pointer-events: auto;
 }
 
-.swiper-cube {
+.swiper.swiper-cube {
   overflow: visible;
 }
 
@@ -834,7 +834,7 @@ button.swiper-pagination-bullet {
 
 /* Cube slide shadows end */
 
-.swiper-flip {
+.swiper.swiper-flip {
   overflow: visible;
 }
 
@@ -874,7 +874,7 @@ button.swiper-pagination-bullet {
   transition-property: transform, opacity, height;
 }
 
-.swiper-cards {
+.swiper.swiper-cards {
   overflow: visible;
 }
 

package/dist/css/mixins/mixin.css

@@ -0,0 +1,73 @@
+/* stylelint-disable length-zero-no-unit */
+
+@define-mixin h1 $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 32px, 48px, $minLetterSpacing, 80px, 96px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h2 $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 24px, 28px, $minLetterSpacing, 56px, 64px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h3 $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 24px, 28px, $minLetterSpacing, 40px, 48px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h4 $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 22px, 24px, $minLetterSpacing, 22px, 24px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h5 $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 16px, 24px, $minLetterSpacing, 16px, 24px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h6 $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 14px, 20px, $minLetterSpacing, 14px, 20px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin p $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 14px, 20px, $minLetterSpacing, 18px, 28px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-xs $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 9px, 12px, $minLetterSpacing, 9px, 12px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-s $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 10px, 12px, $minLetterSpacing, 10px, 12px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-m $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 12px, 18px, $minLetterSpacing, 12px, 18px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-l $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 14px, 20px, $minLetterSpacing, 14px, 20px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-xl $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 16px, 24px, $minLetterSpacing, 16px, 24px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-xxl $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 16px, 24px, $minLetterSpacing, 16px, 24px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-gradient-primary {
+  color: transparent;
+  background: linear-gradient(90deg, hsla(266, 100%, 64%, 1) 0%, hsla(213, 79%, 68%, 1) 50%);
+  background-clip: text;
+  text-fill-color: transparent;
+}

package/dist/css/mixins/mixin_animation.css

@@ -0,0 +1,8 @@
+@define-mixin disableAnimation {
+  transform: translate(0, 0);
+  opacity: 100%;
+}
+
+@define-mixin easing $ease: easeInSine, $type: all, $time: 0.2s {
+  transition: $type $time $ease;
+}

package/dist/css/mixins/mixin_dark-light.css

@@ -0,0 +1,16 @@
+@define-mixin dark {
+  @media (prefers-color-scheme: dark) {
+    & {
+      @mixin-content;
+    }
+  }
+}
+
+@define-mixin light {
+  @media (prefers-color-scheme: light) {
+    & {
+      @mixin-content;
+    }
+  }
+  @mixin-content;
+}

package/dist/css/mixins/mixin_elevation.css

@@ -0,0 +1,33 @@
+/* stylelint-disable length-zero-no-unit */
+
+@define-mixin elevation-1 {
+  box-shadow: var(--elevation-1);
+}
+
+@define-mixin elevation-2 {
+  box-shadow: var(--elevation-2);
+}
+
+@define-mixin elevation-4 {
+  box-shadow: var(--elevation-4);
+}
+
+@define-mixin elevation-6 {
+  box-shadow: var(--elevation-6);
+}
+
+@define-mixin elevation-8 {
+  box-shadow: var(--elevation-8);
+}
+
+@define-mixin elevation-12 {
+  box-shadow: var(--elevation-12);
+}
+
+@define-mixin elevation-16 {
+  box-shadow: var(--elevation-16);
+}
+
+@define-mixin elevation-24 {
+  box-shadow: var(--elevation-24);
+}

package/dist/css/{styles → mixins}/mixin_fill-gradient.css

@@ -15,7 +15,7 @@
 }
 
 @define-mixin fill-gradient_surface-primary-diagonal-left {
-  background: linear-gradient(to bottom, hsla(0, 0%, 0%, 0) 0%,hsla(0,0%,0%,0.65) 100%);
+  background: linear-gradient(to bottom, hsla(0, 0%, 0%, 0) 0%, hsla(0,0%,0%,0.65) 100%);
 }
 
 @define-mixin fill-gradient_surface-primary-diagonal-right {

package/dist/css/mixins/mixin_typography.css

@@ -0,0 +1,70 @@
+@define-mixin h1-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, var(--typography-h1-min), var(--typography-h1-max), $minLetterSpacing,
+    var(--typography-h1-min-line-height), var(--typography-h1-max-line-height), $maxLetterSpacing,
+    var(--typography-h1-font);
+}
+
+@define-mixin h2-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 26px, 32px, $minLetterSpacing, 46px, 58px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h3-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 18px, 24px, $minLetterSpacing, 32px, 40px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h4-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 16px, 18px, $minLetterSpacing, 24px, 30px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h5-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 14px, 16px, $minLetterSpacing, 18px, 26px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin h6-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 12px, 18px, $minLetterSpacing, 16px, 24px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin p-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 12px, 16px, $minLetterSpacing, 16px, 24px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-xxl-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 24px, 28px, $minLetterSpacing, 24px, 28px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-xl-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 20px, 24px, $minLetterSpacing, 20px, 24px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-l-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 18px, 24px, $minLetterSpacing, 18px, 24px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-m-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 16px, 18px, $minLetterSpacing, 16px, 20px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-s-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 14px, 18px, $minLetterSpacing, 14px, 18px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-xs-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 12px, 16px, $minLetterSpacing, 12px, 16px, $maxLetterSpacing,
+    var(--font-primary);
+}
+
+@define-mixin text-xxs-new $weight: normal, $minLetterSpacing: 0px, $maxLetterSpacing: 0px {
+  @mixin font $weight, 10px, 14px, $minLetterSpacing, 10px, 14px, $maxLetterSpacing,
+    var(--font-primary);
+}

package/dist/css/{styles/mixin_global.css → mixins/mixin_utils.css}

@@ -14,36 +14,6 @@
   }
 }
 
-@define-mixin dark {
-  @media (prefers-color-scheme: dark) {
-    & {
-      @mixin-content;
-    }
-  }
-}
-
-@define-mixin light {
-  @media (prefers-color-scheme: light) {
-    & {
-      @mixin-content;
-    }
-  }
-  @mixin-content;
-}
-
-@define-mixin disableAnimation {
-  transform: translate(0, 0);
-  opacity: 100%;
-}
-
-@define-mixin easing $ease: easeInSine, $type: all, $time: 0.2s {
-  transition: $type $time $ease;
-}
-
-@define-mixin easing $ease: easeInSine, $type: all, $time: 0.2s {
-  transition: $type $time $ease;
-}
-
 @define-mixin word-wrap {
   overflow-wrap: break-word;
   word-wrap: break-word;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.2.5",
+  "version": "1.2.6",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -69,9 +69,9 @@
   "scripts": {
     "build": "npm run build-js && npm run build-css",
     "build-js": "rm -rf dist && NODE_ENV=production rollup -c",
-    "build-css": "rm -rf dist/css && postcss 'src/components/**/!(css)/*.css' 'src/styles/!(.css)/**/*.css' 'src/styles/{mediaqueries,mixin_global,mixin_elevation,mixin_fill-gradient}.css' --base src --dir dist/css/ --env production",
+    "build-css": "rm -rf dist/css && postcss 'src/components/**/!(css)/*.css' 'src/styles/!(.css)/**/*.css' 'src/styles/mediaqueries.css' 'src/mixins/**/*.css' --base src --dir dist/css/ --env production",
     "dev-js": "rollup -c -w",
-    "dev-css": "postcss 'src/components/**/!(css)/*.css' 'src/styles/!(.css)/**/*.css' 'src/styles/{mediaqueries,mixin_global,mixin_elevation,mixin_fill-gradient}.css' --base src --dir dist/css/ --env production -w --verbose",
+    "dev-css": "postcss 'src/components/**/!(css)/*.css' 'src/styles/!(.css)/**/*.css' 'src/styles/mediaqueries.css' 'src/mixins/**/*.css' --base src --dir dist/css/ --env production -w --verbose",
     "prepare": "husky",
     "prepack": "npm run build",
     "semantic-release": "semantic-release",
@@ -90,7 +90,7 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@itcase/common": "^1.2.8",
+    "@itcase/common": "^1.2.9",
     "clsx": "^2.1.1",
     "html5-boilerplate": "^9.0.1",
     "js-cookie": "^3.0.5",
@@ -99,7 +99,7 @@
     "prop-types": "^15.8.1",
     "rc-slider": "^11.1.5",
     "react": "^18.3.1",
-    "react-dadata": "^2.23.1",
+    "react-dadata": "^2.23.3",
     "react-date-range": "^2.0.1",
     "react-datepicker": "^7.3.0",
     "react-dom": "^18.3.1",
@@ -112,18 +112,18 @@
     "react-scroll": "^1.9.0",
     "react-scrollbars-custom": "^4.1.1",
     "react-select": "^5.8.0",
-    "swiper": "^11.1.10",
+    "swiper": "^11.1.12",
     "uuid": "^10.0.0"
   },
   "devDependencies": {
-    "@itcase/lint": "^1.0.10",
     "@babel/core": "^7.25.2",
     "@babel/eslint-parser": "^7.25.1",
     "@babel/eslint-plugin": "^7.25.1",
-    "@babel/preset-env": "^7.25.3",
+    "@babel/preset-env": "^7.25.4",
     "@babel/preset-react": "^7.24.7",
-    "@commitlint/cli": "^19.4.0",
-    "@commitlint/config-conventional": "^19.2.2",
+    "@commitlint/cli": "^19.4.1",
+    "@commitlint/config-conventional": "^19.4.1",
+    "@itcase/lint": "^1.0.13",
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^26.0.1",
     "@rollup/plugin-json": "^6.1.0",
@@ -144,11 +144,11 @@
     "babel-plugin-react-docgen": "^4.2.1",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "conventional-changelog-conventionalcommits": "^8.0.0",
-    "eslint": "9.9.0",
+    "eslint": "9.10.0",
     "husky": "^9.1.5",
-    "lint-staged": "^15.2.9",
-    "npm": "^10.8.2",
-    "postcss": "^8.4.41",
+    "lint-staged": "^15.2.10",
+    "npm": "^10.8.3",
+    "postcss": "^8.4.45",
     "postcss-aspect-ratio-polyfill": "^2.0.0",
     "postcss-cli": "^11.0.0",
     "postcss-combine-duplicated-selectors": "^10.0.3",
@@ -161,23 +161,23 @@
     "postcss-hexrgba": "^2.1.0",
     "postcss-import": "^16.1.0",
     "postcss-import-ext-glob": "^2.1.1",
-    "postcss-mixins": "^10.0.1",
+    "postcss-mixins": "^11.0.1",
     "postcss-nested": "^6.2.0",
     "postcss-nested-ancestors": "^3.0.0",
-    "postcss-normalize": "^10.0.1",
+    "postcss-normalize": "^13.0.0",
     "postcss-prepend-imports": "^1.0.1",
-    "postcss-preset-env": "^10.0.2",
+    "postcss-preset-env": "^10.0.3",
     "postcss-pxtorem": "^6.1.0",
     "postcss-responsive-type": "github:ITCase/postcss-responsive-type",
     "postcss-sort-media-queries": "^5.2.0",
-    "prettier": "3.3.3",
-    "rollup": "^4.21.0",
+    "prettier": "^3.3.3",
+    "rollup": "^4.21.2",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.1.1",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-preserve-directives": "^1.1.1",
-    "semantic-release": "^24.1.0",
-    "stylelint": "^16.8.2",
-    "typescript": "^5.5.4"
+    "semantic-release": "^24.1.1",
+    "stylelint": "^16.9.0",
+    "typescript": "^5.6.2"
   }
 }

package/dist/css/styles/mixin_elevation.css

@@ -1,33 +0,0 @@
-/* stylelint-disable length-zero-no-unit */
-
-@define-mixin elevation-1 {
-  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.24);
-}
-
-@define-mixin elevation-2 {
-  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.24);
-}
-
-@define-mixin elevation-4 {
-  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.24);
-}
-
-@define-mixin elevation-6 {
-  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.24);
-}
-
-@define-mixin elevation-8 {
-  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.16);
-}
-
-@define-mixin elevation-12 {
-  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.16)
-}
-
-@define-mixin elevation-16 {
-  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.16);
-}
-
-@define-mixin elevation-24 {
-  box-shadow: 0px 16px 24px rgba(0, 0, 0, 0.12);
-}