@cuby-ui/core 0.0.386 → 0.0.388

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@cuby-ui/core",
-  "version": "0.0.386",
+  "version": "0.0.388",
   "peerDependencies": {
     "@angular/common": ">=18.0.0",
     "@angular/core": ">=18.0.0",
     "@angular/elements": ">=18.0.0",
     "@angular/forms": ">=18.0.0",
-    "@cuby-ui/api": "^0.0.386",
-    "@cuby-ui/cdk": "^0.0.386",
-    "@cuby-ui/icons": "^0.0.386",
+    "@cuby-ui/api": "^0.0.388",
+    "@cuby-ui/cdk": "^0.0.388",
+    "@cuby-ui/icons": "^0.0.388",
     "@editorjs/editorjs": "2.29.1",
     "@editorjs/header": "^2.8.1",
     "@editorjs/list": "^1.9.0",

package/styles/fonts.scss

@@ -1,51 +1,55 @@
 @font-face {
-  font-family: Inter;
-  font-style: normal;
-  font-weight: 400;
-  src: url('../fonts/Inter-Regular.eot');
-  src: url('../fonts/Inter-Regular.eot?#iefix') format('embedded-opentype'),
-       url('../fonts/Inter-Regular.woff2') format('woff2'),
-       url('../fonts/Inter-Regular.woff') format('woff'),
-       url('../fonts/Inter-Regular.ttf') format('truetype'),
-       url('../fonts/Inter-Regular.svg#Inter-Regular') format('svg'),
-       url('../fonts/Inter-Regular.otf') format('otf');
+    font-family: Inter;
+    font-style: normal;
+    font-weight: 400;
+    src: url('../fonts/Inter-Regular.eot');
+    src:
+        url('../fonts/Inter-Regular.eot?#iefix') format('embedded-opentype'),
+        url('../fonts/Inter-Regular.woff2') format('woff2'),
+        url('../fonts/Inter-Regular.woff') format('woff'),
+        url('../fonts/Inter-Regular.ttf') format('truetype'),
+        url('../fonts/Inter-Regular.svg#Inter-Regular') format('svg'),
+        url('../fonts/Inter-Regular.otf') format('otf');
 }
 
 @font-face {
-  font-family: Inter;
-  font-style: normal;
-  font-weight: 500;
-  src: url('../fonts/Inter-Medium.eot');
-  src: url('../fonts/Inter-Medium.eot?#iefix') format('embedded-opentype'),
-       url('../fonts/Inter-Medium.woff2') format('woff2'),
-       url('../fonts/Inter-Medium.woff') format('woff'),
-       url('../fonts/Inter-Medium.ttf') format('truetype'),
-       url('../fonts/Inter-Medium.svg#Inter-Medium') format('svg'),
-       url('../fonts/Inter-Medium.otf') format('otf');
+    font-family: Inter;
+    font-style: normal;
+    font-weight: 500;
+    src: url('../fonts/Inter-Medium.eot');
+    src:
+        url('../fonts/Inter-Medium.eot?#iefix') format('embedded-opentype'),
+        url('../fonts/Inter-Medium.woff2') format('woff2'),
+        url('../fonts/Inter-Medium.woff') format('woff'),
+        url('../fonts/Inter-Medium.ttf') format('truetype'),
+        url('../fonts/Inter-Medium.svg#Inter-Medium') format('svg'),
+        url('../fonts/Inter-Medium.otf') format('otf');
 }
 
 @font-face {
-  font-family: Inter;
-  font-style: normal;
-  font-weight: 600;
-  src: url('../fonts/Inter-SemiBold.eot');
-  src: url('../fonts/Inter-SemiBold.eot?#iefix') format('embedded-opentype'),
-       url('../fonts/Inter-SemiBold.woff2') format('woff2'),
-       url('../fonts/Inter-SemiBold.woff') format('woff'),
-       url('../fonts/Inter-SemiBold.ttf') format('truetype'),
-       url('../fonts/Inter-SemiBold.svg#Inter-SemiBold') format('svg'),
-       url('../fonts/Inter-SemiBold.otf') format('otf');
+    font-family: Inter;
+    font-style: normal;
+    font-weight: 600;
+    src: url('../fonts/Inter-SemiBold.eot');
+    src:
+        url('../fonts/Inter-SemiBold.eot?#iefix') format('embedded-opentype'),
+        url('../fonts/Inter-SemiBold.woff2') format('woff2'),
+        url('../fonts/Inter-SemiBold.woff') format('woff'),
+        url('../fonts/Inter-SemiBold.ttf') format('truetype'),
+        url('../fonts/Inter-SemiBold.svg#Inter-SemiBold') format('svg'),
+        url('../fonts/Inter-SemiBold.otf') format('otf');
 }
 
 @font-face {
-  font-family: Inter;
-  font-style: normal;
-  font-weight: 700;
-  src: url('../fonts/Inter-Bold.eot');
-  src: url('../fonts/Inter-Bold.eot?#iefix') format('embedded-opentype'),
-       url('../fonts/Inter-Bold.woff2') format('woff2'),
-       url('../fonts/Inter-Bold.woff') format('woff'),
-       url('../fonts/Inter-Bold.ttf') format('truetype'),
-       url('../fonts/Inter-Bold.svg#Inter-Bold') format('svg'),
-       url('../fonts/Inter-Bold.otf') format('otf');
+    font-family: Inter;
+    font-style: normal;
+    font-weight: 700;
+    src: url('../fonts/Inter-Bold.eot');
+    src:
+        url('../fonts/Inter-Bold.eot?#iefix') format('embedded-opentype'),
+        url('../fonts/Inter-Bold.woff2') format('woff2'),
+        url('../fonts/Inter-Bold.woff') format('woff'),
+        url('../fonts/Inter-Bold.ttf') format('truetype'),
+        url('../fonts/Inter-Bold.svg#Inter-Bold') format('svg'),
+        url('../fonts/Inter-Bold.otf') format('otf');
 }

package/styles/mixins/buttons.scss

@@ -1,13 +1,13 @@
 @mixin cui-clear-button() {
-  padding: 0;
-  border: 0;
-  flex-shrink: 0;
-  outline: none;
-  cursor: pointer;
-  appearance: none;
-  color: inherit;
-  font: inherit;
-  background: inherit;
-  text-decoration: none;
-  -webkit-tap-highlight-color: transparent;
+    padding: 0;
+    border: 0;
+    flex-shrink: 0;
+    outline: none;
+    cursor: pointer;
+    appearance: none;
+    color: inherit;
+    font: inherit;
+    background: inherit;
+    text-decoration: none;
+    -webkit-tap-highlight-color: transparent;
 }

package/styles/mixins/flex.scss

@@ -1,21 +1,21 @@
 @mixin cui-flex($gap: 0, $direction: row) {
-  display: flex;
+    display: flex;
 
-  @if ($direction != row) {
-    flex-direction: $direction;
-  }
+    @if ($direction != row) {
+        flex-direction: $direction;
+    }
 
-  @if ($gap != 0) {
-    gap: $gap;
-  }
+    @if ($gap != 0) {
+        gap: $gap;
+    }
 }
 
 @mixin cui-flex-alignment($alignItems: stretch, $justifyContent: flex-start) {
-  @if ($alignItems != stretch) {
-    align-items: $alignItems;
-  }
+    @if ($alignItems != stretch) {
+        align-items: $alignItems;
+    }
 
-  @if ($justifyContent != flex-start) {
-    justify-content: $justifyContent;
-  }
+    @if ($justifyContent != flex-start) {
+        justify-content: $justifyContent;
+    }
 }

package/styles/mixins/inputs.scss

@@ -6,86 +6,86 @@
 @use './buttons' as buttons;
 
 @mixin cui-clear-input() {
-  padding: 0;
-  outline: none;
-  margin: 0;
-  border-width: 0;
-  appearance: none;
-  caret-color: currentColor;
-  background: none;
-  color: inherit;
-  font: inherit;
-  line-height: inherit;
+    padding: 0;
+    outline: none;
+    margin: 0;
+    border-width: 0;
+    appearance: none;
+    caret-color: currentColor;
+    background: none;
+    color: inherit;
+    font: inherit;
+    line-height: inherit;
 }
 
 @mixin cui-default-input() {
-  :host {
-    $border-width: 1px;
-
-    @include paddings.cui-padding(horizontal, 1.75, $border-width);
-    @include texts.cui-text-sm-regular();
-
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    border: $border-width solid colors.$cui-base-200;
-    border-radius: 8px;
-    cursor: text;
-    background: colors.$cui-input;
-    color: colors.$cui-base-900;
-    font-family: fonts.$cui-main-font;
-
-    &:hover {
-      border-color: colors.$cui-base-300;
+    :host {
+        $border-width: 1px;
+
+        @include paddings.cui-padding(horizontal, 1.75, $border-width);
+        @include texts.cui-text-sm-regular();
+
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        border: $border-width solid colors.$cui-base-200;
+        border-radius: 8px;
+        cursor: text;
+        background: colors.$cui-input;
+        color: colors.$cui-base-900;
+        font-family: fonts.$cui-main-font;
+
+        &:hover {
+            border-color: colors.$cui-base-300;
+        }
+
+        &:focus-within {
+            @include shadows.cui-shadow-focused();
+
+            border-color: colors.$cui-info;
+        }
+
+        &[data-size='sm'] {
+            @include paddings.cui-padding(vertical, 1, $border-width);
+        }
+
+        &[data-size='md'] {
+            @include paddings.cui-padding(vertical, 1.125, $border-width);
+        }
+
+        &._disabled {
+            cursor: not-allowed;
+            opacity: 0.5;
+            background: colors.$cui-base-50;
+            border-color: colors.$cui-base-200;
+        }
+
+        &._with-error {
+            border-color: colors.$cui-danger;
+
+            &:focus-within {
+                @include shadows.cui-shadow-error-focused();
+            }
+        }
     }
 
-    &:focus-within {
-      @include shadows.cui-shadow-focused();
+    .c-input {
+        @include cui-clear-input();
 
-      border-color: colors.$cui-info;
-    }
-
-    &[data-size='sm'] {
-      @include paddings.cui-padding(vertical, 1, $border-width);
-    }
-
-    &[data-size='md'] {
-      @include paddings.cui-padding(vertical, 1.125, $border-width);
-    }
-
-    &._disabled {
-      cursor: not-allowed;
-      opacity: 0.5;
-      background: colors.$cui-base-50;
-      border-color: colors.$cui-base-200;
-    }
+        width: 100%;
 
-    &._with-error {
-      border-color: colors.$cui-danger;
+        &:disabled {
+            cursor: not-allowed;
+        }
 
-      &:focus-within {
-        @include shadows.cui-shadow-error-focused();
-      }
+        &::placeholder {
+            color: colors.$cui-base-400;
+        }
     }
-  }
-
-  .c-input {
-    @include cui-clear-input();
-
-    width: 100%;
 
-    &:disabled {
-      cursor: not-allowed;
-    }
+    .c-button {
+        @include buttons.cui-clear-button();
 
-    &::placeholder {
-      color: colors.$cui-base-400;
+        display: flex;
     }
-  }
-
-  .c-button {
-    @include buttons.cui-clear-button();
-
-    display: flex;
-  }
 }

package/styles/mixins/lists.scss

@@ -11,7 +11,7 @@
 @mixin cui-line-between-items($offset, $style: solid, $width: 1px) {
     position: relative;
 
-    &>* {
+    & > * {
         z-index: 1;
     }
 

package/styles/mixins/paddings.scss

@@ -1,35 +1,35 @@
 $space: 8px;
 
 @mixin cui-padding($direction, $size, $offset: 0) {
-  $padding: $space * $size - $offset;
+    $padding: $space * $size - $offset;
 
-  @if ($direction == all) {
-    padding: $padding;
-  }
+    @if ($direction == all) {
+        padding: $padding;
+    }
 
-  @if ($direction == top) {
-    padding-top: $padding;
-  }
+    @if ($direction == top) {
+        padding-top: $padding;
+    }
 
-  @if ($direction == bottom) {
-    padding-bottom: $padding;
-  }
+    @if ($direction == bottom) {
+        padding-bottom: $padding;
+    }
 
-  @if ($direction == vertical) {
-    padding-top: $padding;
-    padding-bottom: $padding;
-  }
+    @if ($direction == vertical) {
+        padding-top: $padding;
+        padding-bottom: $padding;
+    }
 
-  @if ($direction == left) {
-    padding-left: $padding;
-  }
+    @if ($direction == left) {
+        padding-left: $padding;
+    }
 
-  @if ($direction == right) {
-    padding-right: $padding;
-  }
+    @if ($direction == right) {
+        padding-right: $padding;
+    }
 
-  @if ($direction == horizontal) {
-    padding-right: $padding;
-    padding-left: $padding;
-  }
+    @if ($direction == horizontal) {
+        padding-right: $padding;
+        padding-left: $padding;
+    }
 }

package/styles/mixins/shadows.scss

@@ -2,37 +2,41 @@
 // TODO: вынести все цвета в перемнные
 
 @mixin cui-shadow-10() {
-  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.04),
-              0 1px 4px 0 rgba(0, 0, 0, 0.04);
+    box-shadow:
+        0 1px 4px 0 rgba(0, 0, 0, 0.04),
+        0 1px 4px 0 rgba(0, 0, 0, 0.04);
 }
 
 @mixin cui-shadow-15() {
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06),
-              0 1px 3px 0 rgba(0, 0, 0, 0.10);
+    box-shadow:
+        0 1px 2px 0 rgba(0, 0, 0, 0.06),
+        0 1px 3px 0 rgba(0, 0, 0, 0.1);
 }
 
 @mixin cui-shadow-20() {
-  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.06),
-              0 4px 6px -1px rgba(0, 0, 0, 0.10);
+    box-shadow:
+        0 2px 4px -1px rgba(0, 0, 0, 0.06),
+        0 4px 6px -1px rgba(0, 0, 0, 0.1);
 }
 
 @mixin cui-shadow-25() {
-  box-shadow: 0 4px 6px -2px rgba(0, 0, 0, 0.05),
-              0 10px 15px -3px rgba(0, 0, 0, 0.10);
+    box-shadow:
+        0 4px 6px -2px rgba(0, 0, 0, 0.05),
+        0 10px 15px -3px rgba(0, 0, 0, 0.1);
 }
 
 @mixin cui-shadow-right() {
-  box-shadow: 5px 0 4px 0 rgba(0, 0, 0, 0.05);
+    box-shadow: 5px 0 4px 0 rgba(0, 0, 0, 0.05);
 }
 
 @mixin cui-shadow-left() {
-  box-shadow: -5px 0 4px 0 rgba(0, 0, 0, 0.05);
+    box-shadow: -5px 0 4px 0 rgba(0, 0, 0, 0.05);
 }
 
 @mixin cui-shadow-focused() {
-  box-shadow: 0 0 0 2px colors.$cui-focus;
+    box-shadow: 0 0 0 2px colors.$cui-focus;
 }
 
 @mixin cui-shadow-error-focused() {
-  box-shadow: 0 0 0 2px rgba(217, 45, 32, 0.25);
+    box-shadow: 0 0 0 2px rgba(217, 45, 32, 0.25);
 }