@tetacom/ng-components 1.4.4 → 1.4.7

package/locale/teta-localisation.d.ts

@@ -30,20 +30,7 @@ export interface TetaLocalisation {
     notSelected: string;
     yes: string;
     no: string;
-    months: [
-        string,
-        string,
-        string,
-        string,
-        string,
-        string,
-        string,
-        string,
-        string,
-        string,
-        string,
-        string
-    ];
+    months: [string, string, string, string, string, string, string, string, string, string, string, string];
     days: [string, string, string, string, string, string, string];
     daysShort: [string, string, string, string, string, string, string];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tetacom/ng-components",
-  "version": "1.4.4",
+  "version": "1.4.7",
   "peerDependencies": {
     "@angular/common": "^18.2.1",
     "@angular/core": "^18.2.1"

package/style/assembly-library.scss

@@ -1,41 +1,41 @@
-@import "./accordion.scss";
-@import "./skeleton.scss";
-@import "./badge.scss";
-@import "./border.scss";
-@import "./button.scss";
-@import "./checkbox.scss";
-@import "./chips.scss";
-@import "./color.scss";
-@import "./datepicker.scss";
-@import "./drag.scss";
-@import "./dropdown.scss";
-@import "./font.scss";
-@import "./hint.scss";
-@import "./icon.scss";
-@import "./input.scss";
-@import "./layout.scss";
-@import "./library.scss";
-@import "./list.scss";
-@import "./loader.scss";
-@import "./message.scss";
-@import "./modal.scss";
-@import "./navigation.scss";
-@import "./progress.scss";
-@import "./radio.scss";
-@import "./resize-panel.scss";
-@import "./scroll.scss";
-@import "./select.scss";
-@import "./shadow.scss";
-@import "./sidebar.scss";
-@import "./sizing.scss";
-@import "./spacing.scss";
-@import "./switch.scss";
-@import "./table.scss";
-@import "./tabs.scss";
-@import "./tag.scss";
-@import "./toggle.scss";
-@import "./toolbar.scss";
-@import "./tooltip.scss";
-@import "./tree.scss";
-@import "./bottombar.scss";
-@import "./divider.scss";
+@import './accordion.scss';
+@import './skeleton.scss';
+@import './badge.scss';
+@import './border.scss';
+@import './button.scss';
+@import './checkbox.scss';
+@import './chips.scss';
+@import './color.scss';
+@import './datepicker.scss';
+@import './drag.scss';
+@import './dropdown.scss';
+@import './font.scss';
+@import './hint.scss';
+@import './icon.scss';
+@import './input.scss';
+@import './layout.scss';
+@import './library.scss';
+@import './list.scss';
+@import './loader.scss';
+@import './message.scss';
+@import './modal.scss';
+@import './navigation.scss';
+@import './progress.scss';
+@import './radio.scss';
+@import './resize-panel.scss';
+@import './scroll.scss';
+@import './select.scss';
+@import './shadow.scss';
+@import './sidebar.scss';
+@import './sizing.scss';
+@import './spacing.scss';
+@import './switch.scss';
+@import './table.scss';
+@import './tabs.scss';
+@import './tag.scss';
+@import './toggle.scss';
+@import './toolbar.scss';
+@import './tooltip.scss';
+@import './tree.scss';
+@import './bottombar.scss';
+@import './divider.scss';

package/style/assembly-presets.scss

@@ -1,4 +1,4 @@
-@import "./presets/color-presets.scss";
-@import "./presets/font-presets.scss";
-@import "./presets/spacing-presets.scss";
-@import "./presets/layout-presets.scss";
+@import './presets/color-presets.scss';
+@import './presets/font-presets.scss';
+@import './presets/spacing-presets.scss';
+@import './presets/layout-presets.scss';

package/style/assembly.scss

@@ -1,4 +1,4 @@
-@import "./reset.scss";
+@import './reset.scss';
 
-@import "./assembly-presets.scss";
-@import "./assembly-library.scss";
+@import './assembly-presets.scss';
+@import './assembly-library.scss';

package/style/border.scss

@@ -1,4 +1,4 @@
-@import "./common.scss";
+@import './common.scss';
 
 .border {
   border-style: solid;
@@ -11,7 +11,7 @@
   }
   @for $radius from 0 through 12 {
     &-radius-#{$radius} {
-      border-radius: 1px * $radius!important;
+      border-radius: 1px * $radius !important;
     }
   }
 

package/style/color.scss

@@ -1,7 +1,6 @@
-@use "sass:map";
-@import "./util/color-util.scss";
+@use 'sass:map';
+@import './util/color-util.scss';
 
 .bg-transparent {
   background-color: transparent;
 }
-

package/style/datepicker.scss

@@ -1,9 +1,9 @@
-@import "util/font-util.scss";
-@import "util/shadow-util.scss";
-@import "util/color-util.scss";
-@import "presets/view-types.scss";
+@import 'util/font-util.scss';
+@import 'util/shadow-util.scss';
+@import 'util/color-util.scss';
+@import 'presets/view-types.scss';
 
-.daterange{
+.daterange {
   display: inline-flex;
   width: 200px;
   min-width: 0;
@@ -17,8 +17,8 @@
 
   @include getView('base');
 
-  &-time{
-   width: 160px;
+  &-time {
+    width: 160px;
   }
 
   &-wide {
@@ -67,7 +67,8 @@
     border-radius: 0;
   }
 
-  &:focus &-head, &_open &-head {
+  &:focus &-head,
+  &_open &-head {
     border-color: var(--color-primary-50);
   }
 
@@ -124,8 +125,6 @@
         background-color: var(--color-primary-50);
       }
     }
-
-
   }
 
   &-content {

package/style/divider.scss

@@ -9,7 +9,8 @@
     letter-spacing: 1.5px;
   }
 
-  div:first-child, div:last-child {
+  div:first-child,
+  div:last-child {
     flex-grow: 1;
   }
 }

package/style/drag.scss

@@ -1,4 +1,4 @@
-@import "util/color-util";
+@import 'util/color-util';
 
 .drop-direction {
   position: absolute;

package/style/dropdown.scss

@@ -1,6 +1,6 @@
-@import "util/color-util";
-@import "util/shadow-util";
-@import "presets/view-types.scss";
+@import 'util/color-util';
+@import 'util/shadow-util';
+@import 'presets/view-types.scss';
 
 .dropdown {
   border: solid 1px var(--color-text-5);
@@ -9,7 +9,7 @@
   z-index: 1050;
   box-shadow: var(--shadow-2);
   background: var(--color-global-bgcard);
-  animation: fadeInFromNone .5s ease-out;
+  animation: fadeInFromNone 0.5s ease-out;
 
   @include getView('base');
 
@@ -39,4 +39,3 @@
     opacity: 1;
   }
 }
-

package/style/font.scss

@@ -1,7 +1,7 @@
-@import "util/font-util.scss";
+@import 'util/font-util.scss';
 
 @each $fontName, $font in $fonts {
   .font-#{$fontName} {
-    @include getFontDescription($font)
+    @include getFontDescription($font);
   }
 }

package/style/hint.scss

@@ -1,6 +1,6 @@
-@import "util/shadow-util.scss";
-@import "util/color-util.scss";
-@import "presets/view-types.scss";
+@import 'util/shadow-util.scss';
+@import 'util/color-util.scss';
+@import 'presets/view-types.scss';
 .hint {
   box-shadow: var(--shadow-1);
   padding: 8px;

package/style/input.scss

@@ -1,6 +1,6 @@
-@import "util/color-util.scss";
-@import "util/font-util.scss";
-@import "presets/view-types.scss";
+@import 'util/color-util.scss';
+@import 'util/font-util.scss';
+@import 'presets/view-types.scss';
 
 .form-container {
   display: flex;
@@ -30,11 +30,13 @@
   background: var(--color-global-bgcard);
 }
 
-.text-field, .input, .textarea {
+.text-field,
+.input,
+.textarea {
   padding: 6px 8px;
   border: solid 1px var(--color-text-5);
   background-color: var(--color-text-5);
-  background-clip:padding-box;
+  background-clip: padding-box;
   color: var(--color-text-90);
   @include getFont($fonts, 'body-3');
   display: flex;
@@ -47,7 +49,6 @@
 
   @include getView('field');
 
-
   &_invalid {
     border-color: var(--color-red-50);
   }
@@ -62,7 +63,8 @@
     color: var(--color-text-40);
   }
 
-  &:focus-within, &:focus {
+  &:focus-within,
+  &:focus {
     border-color: var(--color-primary-50);
   }
 
@@ -76,7 +78,9 @@
     }
   }
 
-  &:disabled, &[disabled], &_disabled {
+  &:disabled,
+  &[disabled],
+  &_disabled {
     border: 0;
     background: var(--color-text-5);
     color: var(--color-text-20);
@@ -104,7 +108,8 @@
   }
 }
 
-.text-field, .input {
+.text-field,
+.input {
   height: 28px;
 }
 

package/style/layout.scss

@@ -1,8 +1,8 @@
-@use "sass:math";
-@import "util/color-util";
+@use 'sass:math';
+@import 'util/color-util';
 
 @function widthCol($n) {
-  @return math.div(100%, $columns-count) * $n
+  @return math.div(100%, $columns-count) * $n;
 }
 
 body {
@@ -37,10 +37,10 @@ body {
     }
   }
 }
- .row-reverse{
-   display: flex;
-   flex-direction: row-reverse;
- }
+.row-reverse {
+  display: flex;
+  flex-direction: row-reverse;
+}
 
 .column {
   display: flex;
@@ -138,5 +138,5 @@ body {
   border: solid 0;
   border-radius: 4px;
   overflow: hidden;
-  background: var(--color-global-bgcard)
+  background: var(--color-global-bgcard);
 }

package/style/list.scss

@@ -1,8 +1,8 @@
-@import "util/color-util.scss";
-@import "util/font-util.scss";
+@import 'util/color-util.scss';
+@import 'util/font-util.scss';
 
 .list {
-  padding: 8px 0;
+  padding: 8px;
   display: inline-flex;
   flex-direction: column;
   border-radius: 8px;
@@ -16,6 +16,7 @@
     min-height: 28px;
     display: inline-flex;
     align-items: center;
+    border-radius: 8px;
     padding: 0 8px;
     white-space: nowrap;
     background-color: transparent;

package/style/loader.scss

@@ -1,4 +1,4 @@
-@import "util/color-util.scss";
+@import 'util/color-util.scss';
 
 .loader {
   position: fixed;

package/style/message.scss

@@ -1,4 +1,4 @@
-@import "util/shadow-util.scss";
+@import 'util/shadow-util.scss';
 
 .message {
   position: relative;
@@ -13,9 +13,9 @@
   color: var(--color-text-90);
 
   @each $paletteName, $palette in map-get($themes, nth(map-keys($themes), 1)) {
-    &#{'-'+$paletteName}::before {
+    &#{'-' + $paletteName}::before {
       background: getColorVar($paletteName, '50');
-      content: " ";
+      content: ' ';
       position: absolute;
       top: 0;
       left: 0;

package/style/navigation.scss

@@ -1,6 +1,6 @@
-@import "util/color-util.scss";
-@import "util/font-util.scss";
-@import "presets/view-types.scss";
+@import 'util/color-util.scss';
+@import 'util/font-util.scss';
+@import 'presets/view-types.scss';
 
 .navigation {
   &-item {
@@ -15,14 +15,14 @@
   @include getView('base');
 
   @each $paletteName, $palette in map-get($themes, nth(map-keys($themes), 1)) {
-    &#{'-'+$paletteName} {
+    &#{'-' + $paletteName} {
       background: getColorVar($paletteName, '50');
     }
-    &#{'-'+$paletteName} &-item:hover {
+    &#{'-' + $paletteName} &-item:hover {
       background: getColorVar($paletteName, '40');
       cursor: pointer;
     }
-    &#{'-'+$paletteName} &-item_active {
+    &#{'-' + $paletteName} &-item_active {
       background: getColorVar($paletteName, '30');
     }
   }

package/style/presets/color-presets.scss

@@ -1,7 +1,7 @@
 @use '@tetacom/themes/src/tatneft/presets.scss' as tatneft;
 @use '@tetacom/themes/src/base/presets.scss' as base;
-@import "@tetacom/themes/src/global.tokens.css";
-@import "@tetacom/themes/src/util.scss";
+@import '@tetacom/themes/src/global.tokens.css';
+@import '@tetacom/themes/src/util.scss';
 
 $themes: map-collect('themes', tatneft.$presets, base.$presets);
 $shadows: map-collect('shadow', tatneft.$presets, base.$presets);

package/style/presets/view-types.scss

@@ -8,7 +8,7 @@
   }
 
   &_circle {
-    border-radius: var(--radius-#{$tokenType}-circle)
+    border-radius: var(--radius-#{$tokenType}-circle);
   }
 
   &_rounded {

package/style/progress.scss

@@ -1,4 +1,4 @@
-@import "util/color-util.scss";
+@import 'util/color-util.scss';
 
 .progress {
   width: 100%;
@@ -22,7 +22,8 @@
     background: var(--color-primary-50);
   }
 
-  &:hover &-slider, &-slider_visible {
+  &:hover &-slider,
+  &-slider_visible {
     cursor: grab;
   }
 }

package/style/radio.scss

@@ -1,5 +1,5 @@
-@import "util/font-util.scss";
-@import "util/color-util.scss";
+@import 'util/font-util.scss';
+@import 'util/color-util.scss';
 
 .radio {
   display: grid;
@@ -12,7 +12,6 @@
     align-items: center;
     @include getFont($fonts, 'body-3');
 
-
     &_disabled {
       filter: grayscale(50%);
       color: var(--color-text-40);
@@ -40,7 +39,6 @@
       background-color: var(--color-text-5);
       color: var(--color-text-40);
       border: solid 1px var(--color-text-30);
-
     }
 
     &-small-icon {

package/style/reset.scss

@@ -2,7 +2,9 @@ html {
   font-size: 10px;
 }
 
-*, *::after, *::before {
+*,
+*::after,
+*::before {
   box-sizing: border-box;
   padding: 0;
   margin: 0;

package/style/resize-panel.scss

@@ -1,4 +1,4 @@
-@import "util/color-util.scss";
+@import 'util/color-util.scss';
 
 .resize {
   &-panel {
@@ -13,11 +13,14 @@
     fill: var(--color-text-20);
     z-index: 10;
 
-    &_active, &:hover {
+    &_active,
+    &:hover {
       fill: var(--color-text-90);
     }
 
-    &_left, &_right, &_vertical {
+    &_left,
+    &_right,
+    &_vertical {
       height: 100%;
       top: 0;
     }
@@ -30,7 +33,8 @@
       left: 100%;
     }
 
-    &_top, &_bottom {
+    &_top,
+    &_bottom {
       width: 100%;
       left: 0;
     }
@@ -45,11 +49,13 @@
   }
 
   &-drag {
-    &_horizontal:hover, &_horizontal#{&}_active {
+    &_horizontal:hover,
+    &_horizontal#{&}_active {
       cursor: row-resize;
     }
 
-    &_vertical:hover, &_vertical#{&}_active {
+    &_vertical:hover,
+    &_vertical#{&}_active {
       cursor: col-resize;
     }
   }

package/style/scroll.scss

@@ -1,4 +1,4 @@
-@import "util/color-util.scss";
+@import 'util/color-util.scss';
 
 ::-webkit-scrollbar-button {
   width: 4px;

package/style/select.scss

@@ -1,6 +1,6 @@
-@import "util/color-util.scss";
-@import "util/font-util.scss";
-@import "presets/view-types.scss";
+@import 'util/color-util.scss';
+@import 'util/font-util.scss';
+@import 'presets/view-types.scss';
 
 .select {
   display: inline-flex;
@@ -72,7 +72,8 @@
     }
   }
 
-  &:focus:not(&_disabled) &-head, &_open &-head {
+  &:focus:not(&_disabled) &-head,
+  &_open &-head {
     border-color: var(--color-primary-50);
   }
 

package/style/shadow.scss

@@ -1,3 +1,3 @@
-@use "sass:map";
-@use "sass:list";
-@import "util/shadow-util.scss";
+@use 'sass:map';
+@use 'sass:list';
+@import 'util/shadow-util.scss';

package/style/sidebar.scss

@@ -1,5 +1,5 @@
-@import "util/shadow-util.scss";
-@import "util/color-util.scss";
+@import 'util/shadow-util.scss';
+@import 'util/color-util.scss';
 
 .sidebar {
   position: fixed;

package/style/sizing.scss

@@ -1,4 +1,4 @@
-@import "common.scss";
+@import 'common.scss';
 
 @for $i from 0 through $spacingLength {
   .height-#{$i} {

package/style/skeleton.scss

@@ -1,4 +1,4 @@
-@import "util/color-util.scss";
+@import 'util/color-util.scss';
 
 .skeleton-pulse {
   height: 100%;
@@ -9,11 +9,10 @@
 
   @keyframes pulse {
     0% {
-      background-position: 0% 0%
+      background-position: 0% 0%;
     }
     100% {
-      background-position: -135% 0%
+      background-position: -135% 0%;
     }
   }
-
 }

package/style/spacing.scss

@@ -1,4 +1,4 @@
-@import "common.scss";
+@import 'common.scss';
 
 $spacingTypes: margin, padding;
 

package/style/switch.scss

@@ -1,5 +1,5 @@
-@import "util/font-util.scss";
-@import "util/color-util.scss";
+@import 'util/font-util.scss';
+@import 'util/color-util.scss';
 
 .switch {
   display: inline-flex;
@@ -38,4 +38,3 @@
     }
   }
 }
-