indicator-ui 1.1.96 → 1.1.98

package/dist/index.js

@@ -25819,7 +25819,8 @@ function kK(r) {
   const { close: S, toggle: x, register: E, isOpen: k } = Fs({
     modalRef: C,
     anchorRef: v,
-    offset: 4
+    offset: 4,
+    flip: !0
   });
   Ln(() => {
     const K = n?.[0];
@@ -26034,7 +26035,8 @@ function FK() {
   const { open: t, close: n, isOpen: i, isOpenRef: o, register: s } = Fs({
     modalRef: r,
     anchorRef: e,
-    offset: 4
+    offset: 4,
+    flip: !0
   });
   return {
     isOpen: i,
@@ -26562,7 +26564,8 @@ function rX(r) {
     modalRef: o,
     anchorRef: t,
     offset: 4,
-    align: "start"
+    align: "start",
+    flip: !0
   }), d = T((g) => {
     const y = e(g);
     if (!y) return;
@@ -26924,7 +26927,8 @@ function pX(r) {
     modalRef: o,
     anchorRef: e,
     offset: 4,
-    align: "start"
+    align: "start",
+    flip: !0
   }), h = T((C) => {
     const S = n(C);
     if (!S) return;
@@ -27401,7 +27405,8 @@ function EX(r) {
     modalRef: s,
     anchorRef: e,
     offset: 4,
-    align: "start"
+    align: "start",
+    flip: !0
   }), p = T((k) => {
     const I = n(k);
     if (!I) return;
@@ -27869,7 +27874,8 @@ function OX(r) {
     modalRef: o,
     anchorRef: e,
     offset: 4,
-    align: "start"
+    align: "start",
+    flip: !0
   }), d = T((g) => {
     const y = n(g);
     if (!y) return;

package/dist/styles/index.scss

@@ -1,3 +1,431 @@
-@forward "mixins";
-@forward "colors";
-@forward "adaptive";
+$golos-ui: var(--golos-ui);
+$golos-text: var(--golos);
+
+@mixin fnt(
+  $size: 16,
+  $line-height: 24,
+  $color: black,
+  $weight: 400,
+  $family: var(--golos-ui),
+  $stretch: normal,
+  $style: normal,
+  $variant: normal,
+  $units: px,
+) {
+  & {
+    font-size: #{$size}#{$units};
+    line-height: #{$line-height}#{$units};
+    color: $color;
+    font-weight: $weight;
+    font-family: $family;
+    font-stretch: $stretch;
+    font-style: $style;
+    font-variant: $variant;
+  }
+}
+
+@mixin fnt-flex(
+  $size: null,
+  $line-height: null,
+  $color: null,
+  $weight: null,
+  $family: null,
+  $stretch: null,
+  $style: null,
+  $variant: null,
+  $units: px,
+) {
+  & {
+    @if ($size != null) {
+      font-size: #{$size}#{$units};
+    }
+    @if ($line-height != null) {
+      line-height: #{$line-height}#{$units};
+    }
+    @if ($weight != null) {
+      font-weight: $weight;
+    }
+    @if ($color != null) {
+      color: $color;
+    }
+    @if ($family != null) {
+      font-family: $family;
+    }
+    @if ($stretch != null) {
+      font-stretch: $stretch;
+    }
+    @if ($style != null) {
+      font-style: $style;
+    }
+    @if ($variant != null) {
+      font-variant: $variant;
+    }
+  }
+}
+
+@mixin modify-flex($direction: null, $justify-content: null, $align-items: null) {
+  & {
+    display: flex;
+
+    @if ($direction != null) {
+      flex-direction: $direction;
+    }
+
+    @if ($justify-content != null) {
+      justify-content: $justify-content;
+    }
+
+    @if ($align-items != null) {
+      align-items: $align-items;
+    }
+    @content;
+  }
+}
+@mixin simple-modify-svg($stroke: null, $fill: null, $stroke-width: null, $transition: null) {
+  & {
+    * {
+      @if ($stroke != null) {
+        stroke: $stroke;
+      }
+
+      @if ($fill != null) {
+        fill: $fill;
+      }
+
+      @if ($stroke-width != null) {
+        stroke-width: $stroke-width;
+      }
+      @if ($transition != null) {
+        transition: $transition;
+      }
+    }
+
+    & {
+      @content;
+    }
+  }
+}
+
+@mixin modify-svg($stroke: null, $fill: null, $stroke-width: null, $transition: null) {
+  & > svg {
+    @include simple-modify-svg($stroke: $stroke, $fill: $fill, $stroke-width: $stroke-width) {
+      @content;
+    }
+  }
+}
+@mixin centerInsideContent {
+  & {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+}
+@mixin changeSvg($stroke: null, $fill: null, $width: null, $height: null, $flex: null) {
+  & {
+    svg {
+      @if ($width != null) {
+        width: #{$width}px;
+      }
+      @if ($height != null) {
+        height: #{$height}px;
+      }
+
+      @if ($flex != null) {
+        flex: $flex;
+      }
+
+      * {
+        @if ($stroke != null) {
+          stroke: $stroke;
+        }
+
+        @if ($fill != null) {
+          fill: $fill;
+        }
+      }
+    }
+  }
+}
+@mixin darkTheme() {
+  [data-theme="dark"] & {
+    @content;
+  }
+}
+@mixin hideScrollbar() {
+  & {
+    scrollbar-width: none; /* Firefox */
+    -ms-overflow-style: none; /* IE 10+ */
+
+    &::-webkit-scrollbar {
+      display: none; /* Chrome, Safari, Opera */
+    }
+  }
+}
+
+@mixin hoverIsAvailable {
+  @media (hover: hover) {
+    @content;
+  }
+}
+@mixin property-color(
+  $component,
+  $prefix: null,
+  $property,
+  $name: null,
+  $color,
+) {
+  $css-prefix: null;
+  @if ($prefix != null) {
+    $css-prefix: '-#{$prefix}-';
+  } @else {
+    $css-prefix: '-'
+  }
+  @if ($name == null) {
+    $name: $property
+  }
+
+  & {
+    #{$property}: var(--ui-#{$component}#{$css-prefix}#{$name}, $color);
+  }
+}
+$base-white: #FFFFFF !default;
+$base-black: #000000 !default;
+
+$gray-25: #FCFCFD !default;
+$gray-50: #F9FAFB !default;
+$gray-100: #F2F4F7 !default;
+$gray-200: #EAECF0 !default;
+$gray-300: #D0D5DD !default;
+$gray-400: #98A2B3 !default;
+$gray-500: #667085 !default;
+$gray-600: #475467 !default;
+$gray-700: #344054 !default;
+$gray-800: #1D2939 !default;
+$gray-900: #101828 !default;
+$gray-950: #0C111D !default;
+
+$primary-25: #FCFAFF !default;
+$primary-50: #F9F5FF !default;
+$primary-100: #F4EBFF !default;
+$primary-200: #E9D7FE !default;
+$primary-300: #D6BBFB !default;
+$primary-400: #B692F6 !default;
+$primary-500: #9E77ED !default;
+$primary-600: #7F56D9 !default;
+$primary-700: #6941C6 !default;
+$primary-800: #53389E !default;
+$primary-900: #42307D !default;
+$primary-950: #2C1C5F !default;
+
+$error-25: #FFFBFA !default;
+$error-50: #FEF3F2 !default;
+$error-100: #FEE4E2 !default;
+$error-200: #FECDCA !default;
+$error-300: #FDA29B !default;
+$error-400: #F97066 !default;
+$error-500: #F04438 !default;
+$error-600: #D92D20 !default;
+$error-700: #B42318 !default;
+$error-800: #912018 !default;
+$error-900: #7A271A !default;
+$error-950: #55160C !default;
+
+$warning-25: #FFFCF5 !default;
+$warning-50: #FFFAEB !default;
+$warning-100: #FEF0C7 !default;
+$warning-200: #FEDF89 !default;
+$warning-300: #FEC84B !default;
+$warning-400: #FDB022 !default;
+$warning-500: #F79009 !default;
+$warning-600: #DC6803 !default;
+$warning-700: #B54708 !default;
+$warning-800: #93370D !default;
+$warning-900: #7A2E0E !default;
+$warning-950: #4E1D09 !default;
+
+$blue-dark-25: var(--blue-dark-25) !default;
+$blue-dark-50: var(--blue-dark-50) !default;
+$blue-dark-100: var(--blue-dark-100) !default;
+$blue-dark-200: var(--blue-dark-200) !default;
+$blue-dark-300: var(--blue-dark-300) !default;
+$blue-dark-400: var(--blue-dark-400) !default;
+$blue-dark-500: var(--blue-dark-500) !default;
+$blue-dark-600: var(--blue-dark-600) !default;
+$blue-dark-700: var(--blue-dark-700) !default;
+$blue-dark-800: var(--blue-dark-800) !default;
+$blue-dark-900: var(--blue-dark-900) !default;
+$blue-dark-950: var(--blue-dark-950) !default;
+
+$tablet-width: 1024;
+
+$mobile: 480px;
+$tablet: 768px;
+$laptop: 1024px;
+$desktop: 1280px;
+$wide: 1440px;
+
+// НАДО СНЕСТИ ============================================================
+@mixin tablet-plus {
+  @media only screen and (min-width: #{$tablet-width}px) {
+    @content;
+  }
+}
+
+// НАДО СНЕСТИ ============================================================
+
+
+// НОВЫЕ !!!
+// ---------------- 📱 Mobile ----------------
+@mixin mobile-less { // меньше чем mobile
+  @media (max-width: #{$mobile - 1}) {
+    @content;
+  }
+}
+
+@mixin mobile-less-equal { // до и включая mobile
+  @media (max-width: #{$mobile}) {
+    @content;
+  }
+}
+
+@mixin mobile-more { // больше чем mobile
+  @media (min-width: #{$mobile + 1}) {
+    @content;
+  }
+}
+
+@mixin mobile-more-equal { // от mobile и выше
+  @media (min-width: #{$mobile}) {
+    @content;
+  }
+}
+
+@mixin mobile { // только mobile (0 - tablet-1)
+  @media (max-width: #{$tablet - 1}) {
+    @content;
+  }
+}
+
+// ---------------- 💻 Tablet ----------------
+@mixin tablet-less {
+  @media (max-width: #{$tablet - 1}) {
+    @content;
+  }
+}
+
+@mixin tablet-less-equal {
+  @media (max-width: #{$tablet}) {
+    @content;
+  }
+}
+
+@mixin tablet-more {
+  @media (min-width: #{$tablet + 1}) {
+    @content;
+  }
+}
+
+@mixin tablet-more-equal {
+  @media (min-width: #{$tablet}) {
+    @content;
+  }
+}
+
+@mixin tablet { // только tablet (от mobile до desktop-1)
+  @media (min-width: #{$mobile + 1}) and (max-width: #{$desktop - 1}) {
+    @content;
+  }
+}
+
+// ---------------- 🖥 Laptop ----------------
+@mixin laptop-less {
+  @media (max-width: #{$laptop - 1}) {
+    @content;
+  }
+}
+
+@mixin laptop-less-equal {
+  @media (max-width: #{$laptop}) {
+    @content;
+  }
+}
+
+@mixin laptop-more {
+  @media (min-width: #{$laptop + 1}) {
+    @content;
+  }
+}
+
+@mixin laptop-more-equal {
+  @media (min-width: #{$laptop}) {
+    @content;
+  }
+}
+
+@mixin laptop { // только laptop (от tablet до desktop-1)
+  @media (min-width: #{$tablet + 1}) and (max-width: #{$desktop - 1}) {
+    @content;
+  }
+}
+
+// ---------------- 🖥 Desktop ----------------
+@mixin desktop-less {
+  @media (max-width: #{$desktop - 1}) {
+    @content;
+  }
+}
+
+@mixin desktop-less-equal {
+  @media (max-width: #{$desktop}) {
+    @content;
+  }
+}
+
+@mixin desktop-more {
+  @media (min-width: #{$desktop + 1}) {
+    @content;
+  }
+}
+
+@mixin desktop-more-equal {
+  @media (min-width: #{$desktop}) {
+    @content;
+  }
+}
+
+@mixin desktop { // только desktop (от desktop до wide-1)
+  @media (min-width: #{$desktop}) and (max-width: #{$wide - 1}) {
+    @content;
+  }
+}
+
+// ---------------- 🖥️ Wide ----------------
+@mixin wide-less {
+  @media (max-width: #{$wide - 1}) {
+    @content;
+  }
+}
+
+@mixin wide-less-equal {
+  @media (max-width: #{$wide}) {
+    @content;
+  }
+}
+
+@mixin wide-more {
+  @media (min-width: #{$wide + 1}) {
+    @content;
+  }
+}
+
+@mixin wide-more-equal {
+  @media (min-width: #{$wide}) {
+    @content;
+  }
+}
+
+@mixin wide { // только wide (от wide и выше)
+  @media (min-width: #{$wide}) {
+    @content;
+  }
+}

package/package.json

@@ -11,7 +11,7 @@
     "react-components",
     "ui-kit"
   ],
-  "version": "1.1.96",
+  "version": "1.1.98",
   "exports": {
     ".": {
       "types": "./dist/types/index.d.ts",

package/dist/styles/adaptive/index.scss

@@ -1,173 +0,0 @@
-$tablet-width: 1024;
-
-$mobile: 480px;
-$tablet: 768px;
-$laptop: 1024px;
-$desktop: 1280px;
-$wide: 1440px;
-
-// НАДО СНЕСТИ ============================================================
-@mixin tablet-plus {
-  @media only screen and (min-width: #{$tablet-width}px) {
-    @content;
-  }
-}
-
-// НАДО СНЕСТИ ============================================================
-
-
-// НОВЫЕ !!!
-// ---------------- 📱 Mobile ----------------
-@mixin mobile-less { // меньше чем mobile
-  @media (max-width: #{$mobile - 1}) {
-    @content;
-  }
-}
-
-@mixin mobile-less-equal { // до и включая mobile
-  @media (max-width: #{$mobile}) {
-    @content;
-  }
-}
-
-@mixin mobile-more { // больше чем mobile
-  @media (min-width: #{$mobile + 1}) {
-    @content;
-  }
-}
-
-@mixin mobile-more-equal { // от mobile и выше
-  @media (min-width: #{$mobile}) {
-    @content;
-  }
-}
-
-@mixin mobile { // только mobile (0 - tablet-1)
-  @media (max-width: #{$tablet - 1}) {
-    @content;
-  }
-}
-
-// ---------------- 💻 Tablet ----------------
-@mixin tablet-less {
-  @media (max-width: #{$tablet - 1}) {
-    @content;
-  }
-}
-
-@mixin tablet-less-equal {
-  @media (max-width: #{$tablet}) {
-    @content;
-  }
-}
-
-@mixin tablet-more {
-  @media (min-width: #{$tablet + 1}) {
-    @content;
-  }
-}
-
-@mixin tablet-more-equal {
-  @media (min-width: #{$tablet}) {
-    @content;
-  }
-}
-
-@mixin tablet { // только tablet (от mobile до desktop-1)
-  @media (min-width: #{$mobile + 1}) and (max-width: #{$desktop - 1}) {
-    @content;
-  }
-}
-
-// ---------------- 🖥 Laptop ----------------
-@mixin laptop-less {
-  @media (max-width: #{$laptop - 1}) {
-    @content;
-  }
-}
-
-@mixin laptop-less-equal {
-  @media (max-width: #{$laptop}) {
-    @content;
-  }
-}
-
-@mixin laptop-more {
-  @media (min-width: #{$laptop + 1}) {
-    @content;
-  }
-}
-
-@mixin laptop-more-equal {
-  @media (min-width: #{$laptop}) {
-    @content;
-  }
-}
-
-@mixin laptop { // только laptop (от tablet до desktop-1)
-  @media (min-width: #{$tablet + 1}) and (max-width: #{$desktop - 1}) {
-    @content;
-  }
-}
-
-// ---------------- 🖥 Desktop ----------------
-@mixin desktop-less {
-  @media (max-width: #{$desktop - 1}) {
-    @content;
-  }
-}
-
-@mixin desktop-less-equal {
-  @media (max-width: #{$desktop}) {
-    @content;
-  }
-}
-
-@mixin desktop-more {
-  @media (min-width: #{$desktop + 1}) {
-    @content;
-  }
-}
-
-@mixin desktop-more-equal {
-  @media (min-width: #{$desktop}) {
-    @content;
-  }
-}
-
-@mixin desktop { // только desktop (от desktop до wide-1)
-  @media (min-width: #{$desktop}) and (max-width: #{$wide - 1}) {
-    @content;
-  }
-}
-
-// ---------------- 🖥️ Wide ----------------
-@mixin wide-less {
-  @media (max-width: #{$wide - 1}) {
-    @content;
-  }
-}
-
-@mixin wide-less-equal {
-  @media (max-width: #{$wide}) {
-    @content;
-  }
-}
-
-@mixin wide-more {
-  @media (min-width: #{$wide + 1}) {
-    @content;
-  }
-}
-
-@mixin wide-more-equal {
-  @media (min-width: #{$wide}) {
-    @content;
-  }
-}
-
-@mixin wide { // только wide (от wide и выше)
-  @media (min-width: #{$wide}) {
-    @content;
-  }
-}

package/dist/styles/colors/css-variables/fonts.css

@@ -1,4 +0,0 @@
-:root {
-    --golos-ui: 'Golos UI', sans-serif;
-    --golos: 'Golos Text', sans-serif;
-}

package/dist/styles/colors/css-variables/index.css

@@ -1,4 +0,0 @@
-@import './primary-var.css';
-@import './secondary-var.css';
-@import './fonts.css';
-@import './main-colors.css';

package/dist/styles/colors/css-variables/main-colors.css

@@ -1,37 +0,0 @@
-:root {
-    /*BACKGROUND COLOR*/
-    --background-primary: #FFFFFF;
-    --background-secondary: #F9FAFB;
-    --background-tretiary: #F2F4F7;
-    --background-quaternary: #EAECF0;
-
-    /*TEXT COLOR*/
-    --text-buttons: #FFFFFF;
-    --text-secondary: #344054;
-    --text-tretiary: #667085;
-    --text-quaternary: #98A2B3;
-
-    /*ICONS COLOR*/
-    --icons-light: #EAECF0;
-    --icons-white: #FFFFFF;
-    --icons-primary: #667085;
-    --icons-secondary: #98A2B3;
-    --icons-tretiary: #D0D5DD;
-    --icons-quaternary: #EAECF0;
-
-    /*BORDER COLOR*/
-    --border-primary: #D0D5DD;
-    --border-secondary: #EAECF0;
-    --border-tretiary: #F2F4F7;
-
-    /*ELEMENTS COLOR*/
-    --elements-modals: #FFFFFF;
-    --elements-input: #FFFFFF;
-    --elements-button: #FFFFFF;
-
-    /*TABS COLOR*/
-    --tabs-active: #FFFFFF;
-    --tabs-active-hover: #F9FAFB;
-    --tabs-default: #F2F4F7;
-    --tabs-default-hover: #EAECF0;
-}