indicator-ui 0.1.121 → 0.1.123

package/dist/scss/ui/Buttons/styles/mixins/properties/warning-secondary-color.scss

@@ -42,4 +42,25 @@
   &:disabled, &.disabled {
     opacity: 0.5;
   }
+
+  @include darkTheme {
+    background-color: transparent;
+    border: 1px solid var(--error-600);
+
+    &:not(.disabled):not(:disabled) {
+      @include tablet-plus {
+        &:hover {
+          background-color: var(--error-950);
+          border: 1px solid var(--error-500);
+        }
+      }
+
+      @include tablet {
+        &:active {
+          background-color: var(--error-950);
+          border: 1px solid var(--error-500);
+        }
+      }
+    }
+  }
 }

package/dist/ts/src/hooks/index.d.ts

@@ -12,6 +12,7 @@ export * from './useSmartPosition';
 export * from './useSmartScroll';
 export * from './useInteractiveZone';
 export * from './useScrollIndicators';
+export * from './useLoading';
 export * from './ui-animations';
 export * from './modalWindows';
 export * from './controlsInput';

package/dist/ts/src/hooks/useLoading.d.ts

@@ -0,0 +1,17 @@
+type FunBaseType = (...args: any) => any;
+type PropsType<T extends FunBaseType> = [
+    fun: T,
+    initState?: boolean
+];
+type ActionsType = {
+    startLoading: () => void;
+    stopLoading: () => void;
+    getIsLoading: () => boolean;
+};
+type FunReturnType<T extends FunBaseType> = [
+    fun: T,
+    isLoading: boolean,
+    actions: ActionsType
+];
+export declare function useLoading<T extends FunBaseType>(...args: PropsType<T>): FunReturnType<T>;
+export {};

package/dist/ts/src/test/pages/{ButtonsPage.d.ts → ButtonsPage/ButtonsPage.d.ts}

@@ -1,2 +1,2 @@
-import './style.scss';
+import '../style.scss';
 export declare function ButtonsPage(): JSX.Element;

package/dist/ts/src/test/pages/index.d.ts

@@ -1,5 +1,5 @@
 export * from './HomePage';
-export * from './ButtonsPage';
+export * from './ButtonsPage/ButtonsPage';
 export * from './MicroButtonsPage';
 export * from './FieldsPage/FieldsPage';
 export * from './CheckboxMarkPage';

package/dist/ts/src/ui/Buttons/types/ButtonTypes.d.ts

@@ -1,7 +1,7 @@
 import React, { ReactElement, ReactNode } from "react";
 import { AsProps } from "../../../types";
 export type ButtonSizeType = 'small' | 'medium' | 'large' | 'ultra';
-export type ButtonHierarchyType = 'primary' | 'secondary-color' | 'secondary-gray' | 'tertiary-white' | 'tertiary-color' | 'tertiary-gray' | 'link-color' | 'link-black' | 'link-gray' | 'tab-active' | 'tab' | 'link-dark-theme';
+export type ButtonHierarchyType = 'primary' | 'secondary-color' | 'secondary-gray' | 'tertiary-white' | 'tertiary-color' | 'tertiary-gray' | 'link-color' | 'link-black' | 'link-gray' | 'tab-active' | 'tab';
 /**
  * Компонент кнопки
  */

package/dist/ts/src/ui/Tag/ui/FilterTag.d.ts

@@ -8,6 +8,6 @@ type PropsType<T extends React.ElementType> = AsProps<T, {
     onClose?: () => void;
     active?: boolean;
 }>;
-export declare const _FilterTag: <T extends React.ElementType = "button">(props: PropsType<T>, ref: React.Ref<RefType<T>>) => JSX.Element;
+export declare const _FilterTag: <T extends React.ElementType>(props: PropsType<T>, ref: React.Ref<RefType<T>>) => JSX.Element;
 export declare const FilterTag: <T extends React.ElementType = "button">(props: PropsType<T> & React.RefAttributes<RefType<T>>) => JSX.Element;
 export {};

package/docs/CSSVariables/CSSThemeCustomize.md

@@ -121,3 +121,64 @@
   - `--ui-checkbox-mark-active-focus-background-color`
   - `--ui-checkbox-mark-active-focus-border-color`
   - `--ui-checkbox-mark-active-focus-symbol-color`
+
+## Button
+- `--ui-button-radius`
+
+### Primary
+- ### base
+  - `--ui-button-primary-background-color`
+  - `--ui-button-primary-border-color`
+  - `--ui-button-primary-box-shadow`
+  - `--ui-button-primary-text-color`
+  - `--ui-button-primary-icon-color`
+- ### base hover
+  - `--ui-button-primary-hover-background-color`
+  - `--ui-button-primary-hover-border-color`
+  - `--ui-button-primary-hover-box-shadowr`
+  - `--ui-button-primary-hover-text-color`
+  - `--ui-button-primary-hover-icon-color`
+- ### disabled
+  - `--ui-button-primary-disabled-background-color`
+  - `--ui-button-primary-disabled-border-color`
+  - `--ui-button-primary-disabled-box-shadow`
+  - `--ui-button-primary-disabled-text-color`
+  - `--ui-button-primary-disabled-icon-color`
+### Secondary color
+- ### base
+  - `--ui-button-secondary-color-background-color`
+  - `--ui-button-secondary-color-border-color`
+  - `--ui-button-secondary-color-box-shadow`
+  - `--ui-button-secondary-color-text-color`
+  - `--ui-button-secondary-color-icon-color`
+- ### base hover
+  - `--ui-button-secondary-color-hover-background-color`
+  - `--ui-button-secondary-color-hover-border-color`
+  - `--ui-button-secondary-color-hover-box-shadowr`
+  - `--ui-button-secondary-color-hover-text-color`
+  - `--ui-button-secondary-color-hover-icon-color`
+- ### disabled
+  - `--ui-button-secondary-color-disabled-background-color`
+  - `--ui-button-secondary-color-disabled-border-color`
+  - `--ui-button-secondary-color-disabled-box-shadow`
+  - `--ui-button-secondary-color-disabled-text-color`
+  - `--ui-button-secondary-color-disabled-icon-color`
+### Secondary gray
+- ### base
+  - `--ui-button-secondary-gray-background-color`
+  - `--ui-button-secondary-gray-border-color`
+  - `--ui-button-secondary-gray-box-shadow`
+  - `--ui-button-secondary-gray-text-color`
+  - `--ui-button-secondary-gray-icon-color`
+- ### base hover
+  - `--ui-button-secondary-gray-hover-background-color`
+  - `--ui-button-secondary-gray-hover-border-color`
+  - `--ui-button-secondary-gray-hover-box-shadowr`
+  - `--ui-button-secondary-gray-hover-text-color`
+  - `--ui-button-secondary-gray-hover-icon-color`
+- ### disabled
+  - `--ui-button-secondary-gray-disabled-background-color`
+  - `--ui-button-secondary-gray-disabled-border-color`
+  - `--ui-button-secondary-gray-disabled-box-shadow`
+  - `--ui-button-secondary-gray-disabled-text-color`
+  - `--ui-button-secondary-gray-disabled-icon-color`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "indicator-ui",
-  "version": "0.1.121",
+  "version": "0.1.123",
   "main": "dist/index.js",
   "types": "dist/ts/src/index.d.ts",
   "style": "dist/index.css",

package/dist/scss/ui/Buttons/styles/mixins/properties/link-dark-theme.scss

@@ -1,52 +0,0 @@
-@use '../../../../../styles' as *;
-
-@mixin linkDarkThemeButton-hover-state {
-  .content {
-    .text, .textSecondary {
-      @include fnt-flex($color: var(--base-white));
-    }
-  }
-
-  .icon {
-    @include modify-svg($stroke: var(--base-white));
-  }
-}
-
-@mixin linkDarkTheme {
-  padding: 0 !important;
-  gap: 4px;
-
-  .loader {
-    @include modify-svg($stroke: var(--gray-iron-400));
-  }
-
-  .icon {
-    @include modify-svg($stroke: var(--gray-iron-400));
-  }
-
-  .content {
-    padding: 0 !important;
-
-    .text, .textSecondary {
-      @include fnt-flex($color: var(--gray-iron-400));
-    }
-  }
-
-  &:not(.disabled):not(:disabled) {
-    @include tablet-plus {
-      &:hover {
-        @include linkDarkThemeButton-hover-state;
-      }
-    }
-
-    @include tablet {
-      &:active {
-        @include linkDarkThemeButton-hover-state;
-      }
-    }
-  }
-
-  &:disabled, &.disabled {
-    opacity: 0.5;
-  }
-}