@epam/uui 4.10.1 → 4.11.0-alpha.1

package/assets/styles/controlLayout.scss

@@ -5,6 +5,22 @@
         @include text-size($size, $borderWidth);
     }
 
+    &:global(.uui-button-box), &:global(.uui-input-box) {
+        min-height: $size;
+        border-width: $borderWidth;
+    }
+}
+
+@mixin control-box-layout($size, $borderWidth) {
+    min-width: $size;
+    padding-left: 5px;
+    padding-right: 5px;
+
+    :global(.uui-caption), :global(.uui-input) {
+        padding-left: 6px;
+        padding-right: 6px;
+    }
+
     &:global(.uui-button-box), &:global(.uui-input-box) {
         min-height: $size;
         border-width: $borderWidth;

package/assets/styles/effects.scss

@@ -1,4 +1,4 @@
-@mixin panel-shadow() { box-shadow: var(--panel-shadow); }
+@mixin panel-shadow() { box-shadow: var(--uui-panel-shadow); }
 
 @mixin panel-top-shadow() { box-shadow: inset 0 10px 5px -10px rgba(51, 51, 51, 0.2); }
 
@@ -6,4 +6,5 @@
 
 @mixin dnd-ghost-shadow() { box-shadow: 0 6px 18px 0 rgba(29,30,38,0.05), 0 3px 12px 0 rgba(29,30,38,0.05); }
 
-@mixin control-focus-effect($name) { box-shadow: 0 0 0 2px fade-out($name, 0.6); } // TODO: design?
+//@mixin control-focus-effect($name) { box-shadow: 0 0 0 2px fade-out($name, 0.6); } // TODO: design?
+@mixin control-focus-effect() { box-shadow: 0 0 0 2px rgba(0, 137 ,204, 0.40); }

package/assets/styles/inputs.scss

@@ -1,43 +1,43 @@
 @mixin disabled-input() {
     &.mode-form {
-        @include input-colors(var(--input-bg-disabled-color), var(--input-text-disabled-color), var(--input-border-disabled-color));
+        @include input-colors(var(--uui-control-bg-disabled), var(--uui-control-text-disabled), var(--uui-control-border-disabled));
         cursor: default;
         pointer-events: none;
 
         &:hover, &:active, &:focus {
-            @include input-colors(var(--input-bg-disabled-color), var(--input-text-disabled-color), var(--input-border-disabled-color));
+            @include input-colors(var(--uui-control-bg-disabled), var(--uui-control-text-disabled), var(--uui-control-border-disabled));
             box-shadow: none;
         }
 
         &::placeholder {
-            color: var(--input-placeholder-disabled-color);
+            color: var(--uui-control-placeholder-disabled);
         }
     }
 
     &.mode-cell {
-        @include input-colors(transparent, var(--input-text-disabled-color), transparent);
+        @include input-colors(transparent, var(--uui-control-text-disabled), transparent);
         cursor: default;
         pointer-events: none;
 
         &:hover, &:active, &:focus {
-            @include input-colors(transparent, var(--input-text-disabled-color), transparent);
+            @include input-colors(transparent, var(--uui-control-text-disabled), transparent);
             box-shadow: none;
         }
 
         &::placeholder {
-            color: var(--input-placeholder-disabled-color);
+            color: var(--uui-control-placeholder-disabled);
         }
     }
 }
 
 @mixin readonly-input() {
     &.mode-form {
-        background-color: var(--input-bg-readonly-color);
-        border-color: var(--input-border-readonly-color);
+        background-color: var(--uui-control-bg-readonly);
+        border-color: var(--uui-control-border-readonly);
         pointer-events: none;
 
         &:hover {
-            border-color: var(--input-border-readonly-color);
+            border-color: var(--uui-control-border-readonly);
         }
     }
 
@@ -64,7 +64,7 @@
         color: $fg;
 
         &::placeholder {
-            color: var(--input-placeholder-disabled-color);
+            color: var(--uui-control-placeholder-disabled);
         }
     }
 }

package/assets/styles/prettifyScrollBar.scss

@@ -1,6 +1,14 @@
 @mixin prettifyCustomScroll() {
+    :global(.uui-shadow-top)::before {
+        background: var(--scroll-bars-shadow);
+    }
+
+    :global(.uui-shadow-bottom)::after {
+        background: var(--scroll-bars-shadow);
+    }
+
     :global(.uui-thumb-vertical), :global(.uui-thumb-horizontal) {
-        background: var(--scroll-bars-bg-color);
+        background: var(--uui-scroll-bars-bg);
         border-radius: 1.5px;
 
         &:hover {
@@ -9,7 +17,7 @@
 
         &:active {
             border-radius: 3px;
-            background: var(--scroll-bars-bg-color-active);
+            background: var(--uui-scroll-bars-bg-active);
         }
     }
 

package/assets/styles/typography-mixins.scss

@@ -0,0 +1,159 @@
+@mixin overflow-ellipsis() {
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+@mixin typography-header() {
+    :global(.hero-header), h1, h2, h3, h4, h5, h6 {
+        margin: 0;
+    }
+
+    :global(.hero-header) {
+        font-family: var(--font-promo);
+        margin: 30px 0;
+        font-size: 66px;
+        line-height: 72px;
+    }
+
+    :global(.hero-header), :global(.promo-header) {
+        color: var(--uui-text-brand);
+        text-align: center;
+    }
+
+    :global(.promo-header), h1, h2, h3 {
+        font-family: var(--font-primary);
+    }
+
+    :global(.promo-header) {
+        text-transform: uppercase;
+    }
+
+    h4, h5, h6 {
+        font-family: var(--font-semibold);
+    }
+
+    h1, h2, h3, h4, h5, h6 {
+        margin-bottom: 0.5em;
+        margin-top: 1.2em;
+        line-height: 1.35em;
+    }
+
+    h1 {
+        font-size: 36px;
+    }
+
+    h2 {
+        font-size: 30px;
+        letter-spacing: 0.1px;
+
+        &:global(.promo-header) {
+            letter-spacing: 2px;
+        }
+    }
+
+    h3 {
+        font-size: 24px;
+    }
+
+    h4 {
+        font-size: 18px;
+        letter-spacing: 0.1px;
+    }
+
+    h5 {
+        font-size: 16px;
+    }
+
+    h6 {
+        font-size: 14px;
+    }
+}
+
+@mixin typography-inline() {
+    b, strong {
+        font-family: var(--font-semibold);
+    }
+
+    i, em {
+        font-family: var(--font-italic);
+    }
+
+    a {
+        display: inline-flex;
+        align-items: center;
+        color: var(--uui-primary);
+
+        &:visited {
+            color: #5214CC;
+
+            &:hover {
+                color: #3F0F9E;
+            }
+        }
+
+        &:hover {
+            text-decoration: underline;
+            color: var(--uui-primary-dark);
+        }
+    }
+
+    code {
+        padding: 0.125em 0.25em;
+        color: var(--uui-text-primary);
+        background-color: var(--uui-secondary-light);
+        font-family: var(--font-mono);
+        white-space: pre-wrap;
+        word-wrap: normal;
+    }
+}
+
+@mixin typography-block() {
+    ol, ul {
+        padding: 0;
+    }
+
+    li {
+        margin-left: 1.25em;
+        line-height: 1.5;
+    }
+
+    pre {
+        padding: 1.25em;
+        color: var(--gray10);
+        background-color: var(--uui-secondary-darkest);
+        font-family: monospace;
+        white-space: pre-wrap;
+        word-wrap: normal;
+    }
+
+    img {
+        max-width: 100%;
+    }
+
+    figure {
+        margin: 0;
+
+        figcaption {
+            font-size: 0.9em;
+            opacity: 0.9;
+            text-align: center;
+        }
+    }
+
+    p {
+        margin: 0.5em 0;
+        line-height: 1.5;
+    }
+}
+
+@mixin typography-12() {
+    font-size: 12px;
+}
+
+@mixin typography-14() {
+    font-size: 14px;
+}
+
+@mixin typography-16() {
+    font-size: 16px;
+}

package/assets/styles/typography.scss

@@ -1,4 +1,39 @@
+@forward "typography-mixins";
+@use "typography-mixins" as *;
+
 @mixin overflow-ellipsis() {
     overflow: hidden;
     text-overflow: ellipsis;
+}
+
+:local(.typography-header) {
+    @include typography-header();
+}
+
+:local(.typography-block) {
+    @include typography-block();
+}
+
+:local(.typography-inline) {
+    @include typography-inline();
+}
+
+:local(.typography-16) {
+    @include typography-16();
+}
+
+:local(.typography-14) {
+    @include typography-14();
+}
+
+:local(.typography-12) {
+    @include typography-12();
+}
+
+:local(.typography-promo) {
+    font-family: var(--font-regular);
+    color: var(--uui-text-primary);
+    composes: typography-header;
+    composes: typography-block;
+    composes: typography-inline;
 }

package/assets/styles/variables/widgets/badge.scss

@@ -1,51 +1,51 @@
-:global(.badge-color-info) {
-    --badge-bg-color: var(--info-color);
-    --badge-bg-color-hover: var(--info-active-color);
+:global(.badge-info) {
+    --uui-badge-bg: var(--uui-info);
+    --uui-badge-bg-hover: var(--uui-info-active);
     //--bg-color-semitransparent: #{lighten(#008ACE, 50%)};
     //--border-color-semitransparent: #{lighten($blue, 40%)};
-    --badge-caption-color-solid: white;
-    //--caption-color-semitransparent: #{darken($blue, 10%)};
-    //--caption-color-semitransparent-hover: #{darken($blue, 20%)};
-    //--caption-color-transparent: #{$gray80};
-    --badge-count-bg-color: white;
-    --badge-count-color: var(--text-secondary-color);
+    --uui-badge-caption-solid: white;
+    //--uui-caption-semitransparent: #{darken($blue, 10%)};
+    //--uui-caption-semitransparent-hover: #{darken($blue, 20%)};
+    //--uui-caption-transparent: #{$gray80};
+    --uui-badge-count-bg: white;
+    --uui-badge-count: var(--uui-text-secondary);
 }
 
-:global(.badge-color-success) {
-    --badge-bg-color: var(--success-color);
-    --badge-bg-color-hover: var(--success-active-color);
+:global(.badge-success) {
+    --uui-badge-bg: var(--uui-success);
+    --uui-badge-bg-hover: var(--uui-success-active);
     //--bg-color-semitransparent: #{$cyan-lightest};
     //--border-color-semitransparent: #{$cyan-light};
-    --badge-caption-color-solid: white;
-    //--caption-color-semitransparent: #{$cyan-dark};
-    //--caption-color-semitransparent-hover: #{$cyan-darkest};
-    //--caption-color-transparent: #{$gray80};
-    --badge-count-bg-color: white;
-    --badge-count-color: var(--text-secondary-color);
+    --uui-badge-caption-solid: white;
+    //--uui-caption-semitransparent: #{$cyan-dark};
+    //--uui-caption-semitransparent-hover: #{$cyan-darkest};
+    //--uui-caption-transparent: #{$gray80};
+    --uui-badge-count-bg: white;
+    --uui-badge-count: var(--uui-text-secondary);
 }
 
-:global(.badge-color-warning) {
-    --badge-bg-color: var(--warning-color);
-    --badge-bg-color-hover: var(--warning-active-color);
+:global(.badge-warning) {
+    --uui-badge-bg: var(--uui-warning);
+    --uui-badge-bg-hover: var(--uui-warning-active);
     //--bg-color-semitransparent: #{lighten($green, 50%)};
     //--border-color-semitransparent: #{lighten($green, 40%)};
-    --badge-caption-color-solid: white;
-    //--caption-color-semitransparent: #{darken($green, 10%)};
-    //--caption-color-semitransparent-hover: #{darken($green, 20%)};
-    //--caption-color-transparent: #{$gray80};
-    --badge-count-bg-color: white;
-    --badge-count-color: var(--text-secondary-color);
+    --uui-badge-caption-solid: white;
+    //--uui-caption-semitransparent: #{darken($green, 10%)};
+    //--uui-caption-semitransparent-hover: #{darken($green, 20%)};
+    //--uui-caption-transparent: #{$gray80};
+    --uui-badge-count-bg: white;
+    --uui-badge-count: var(--uui-text-secondary);
 }
 
-:global(.badge-color-error) {
-    --badge-bg-color: var(--error-color);
-    --badge-bg-color-hover: var(--error-active-color);
+:global(.badge-error) {
+    --uui-badge-bg: var(--uui-error);
+    --uui-badge-bg-hover: var(--uui-error-active);
     //--bg-color-semitransparent: #{lighten($amber, 40%)};
     //--border-color-semitransparent: #{lighten($amber, 30%)};
-    --badge-caption-color-solid: var(--text-primary-color);
-    //--caption-color-semitransparent: #995A00;
-    //--caption-color-semitransparent-hover: #804000;
-    //--caption-color-transparent: #{$gray80};
-    --badge-count-bg-color: white;
-    --badge-count-color: var(--text-secondary-color);
+    --uui-badge-caption-solid: var(--uui-text-primary);
+    //--uui-caption-semitransparent: #995A00;
+    //--uui-caption-semitransparent-hover: #804000;
+    //--uui-caption-transparent: #{$gray80};
+    --uui-badge-count-bg: white;
+    --uui-badge-count: var(--uui-text-secondary);
 }

package/components/buttons/Button/Button.d.ts

@@ -0,0 +1,13 @@
+import { ButtonProps as uuiButtonProps } from '@epam/uui-components';
+import { ControlSize, ButtonMode } from '../../types';
+export type ButtonColor = 'accent' | 'primary' | 'secondary' | 'negative';
+export declare const allButtonColors: ButtonColor[];
+export interface ButtonMods {
+    size?: ControlSize | '18';
+    mode?: ButtonMode;
+    color?: ButtonColor;
+}
+export type ButtonProps = ButtonMods & uuiButtonProps;
+export declare function applyButtonMods(mods: ButtonProps): string[];
+export declare const Button: (props: uuiButtonProps & ButtonMods & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+//# sourceMappingURL=Button.d.ts.map

package/components/buttons/Button/Button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../components/buttons/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,WAAW,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAE1F,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAItD,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAC1E,eAAO,MAAM,eAAe,EAAE,WAAW,EAAmD,CAAC;AAI7F,MAAM,WAAW,UAAU;IACvB,IAAI,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;CACvB;AAED,MAAM,MAAM,WAAW,GAAG,UAAU,GAAG,cAAc,CAAC;AAEtD,wBAAgB,eAAe,CAAC,IAAI,EAAE,WAAW,YAOhD;AAED,eAAO,MAAM,MAAM,qKAOlB,CAAC"}

package/components/buttons/Button/Button.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Button.test.d.ts.map

package/components/buttons/Button/Button.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.test.d.ts","sourceRoot":"","sources":["../../../../components/buttons/Button/Button.test.tsx"],"names":[],"mappings":""}

package/components/buttons/Button/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Button';
+//# sourceMappingURL=index.d.ts.map

package/components/buttons/Button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/buttons/Button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/components/buttons/IconButton.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
 import { IconButtonBaseProps } from '@epam/uui-components';
-import '../../assets/styles/variables/buttons/iconButton.scss';
 export type IconColor = 'info' | 'success' | 'warning' | 'error' | 'secondary' | 'default';
 export declare const allIconColors: IconColor[];
 export interface IconButtonMods {
@@ -8,5 +6,5 @@ export interface IconButtonMods {
 }
 export interface IconButtonProps extends IconButtonBaseProps, IconButtonMods {
 }
-export declare const IconButton: import("react").ForwardRefExoticComponent<IconButtonProps & IconButtonMods & import("react").RefAttributes<any>>;
+export declare const IconButton: (props: IconButtonProps & IconButtonMods & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 //# sourceMappingURL=IconButton.d.ts.map

package/components/buttons/IconButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../components/buttons/IconButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,mBAAmB,EAA+B,MAAM,sBAAsB,CAAC;AAExF,OAAO,uDAAuD,CAAC;AAG/D,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,SAAS,CAAC;AAC3F,eAAO,MAAM,aAAa,EAAE,SAAS,EAAoE,CAAC;AAE1G,MAAM,WAAW,cAAc;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,eAAgB,SAAQ,mBAAmB,EAAE,cAAc;CAAI;AAShF,eAAO,MAAM,UAAU,kHAAgF,CAAC"}
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../components/buttons/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAA+B,MAAM,sBAAsB,CAAC;AAIxF,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,SAAS,CAAC;AAC3F,eAAO,MAAM,aAAa,EAAE,SAAS,EAAoE,CAAC;AAE1G,MAAM,WAAW,cAAc;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,eAAgB,SAAQ,mBAAmB,EAAE,cAAc;CAAG;AAS/E,eAAO,MAAM,UAAU,0KAAgF,CAAC"}

package/components/buttons/LinkButton.d.ts

@@ -1,9 +1,8 @@
-/// <reference types="react" />
-import { ButtonProps } from '@epam/uui-components';
 import * as types from '../types';
-import '../../assets/styles/variables/buttons/linkButton.scss';
+import { ButtonProps } from '@epam/uui-components';
 export interface LinkButtonMods {
     size?: types.ControlSize | '42';
 }
-export declare const LinkButton: import("react").ForwardRefExoticComponent<Pick<ButtonProps & LinkButtonMods, "isDisabled" | "onClick" | "link" | "caption" | "dropdownIcon" | "dropdownIconPosition" | "countPosition" | "count" | "cx" | "href" | "isLinkActive" | "target" | "icon" | "iconPosition" | "onIconClick" | "clickAnalyticsEvent" | "tabIndex" | "rawProps" | "onClear" | "isOpen" | "isDropdown" | "toggleDropdownOpening" | "isInteractedOutside" | "placeholder" | "size" | "forwardedRef" | "clearIcon" | "captionCX"> & import("react").RefAttributes<any>>;
+export type LinkButtonProps = LinkButtonMods & ButtonProps;
+export declare const LinkButton: (props: ButtonProps & LinkButtonMods & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 //# sourceMappingURL=LinkButton.d.ts.map

package/components/buttons/LinkButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LinkButton.d.ts","sourceRoot":"","sources":["../../../components/buttons/LinkButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAU,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAG3D,OAAO,KAAK,KAAK,MAAM,UAAU,CAAC;AAElC,OAAO,uDAAuD,CAAC;AAI/D,MAAM,WAAW,cAAc;IAC3B,IAAI,CAAC,EAAE,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC;CACnC;AAWD,eAAO,MAAM,UAAU,+gBAGpB,CAAC"}
+{"version":3,"file":"LinkButton.d.ts","sourceRoot":"","sources":["../../../components/buttons/LinkButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,UAAU,CAAC;AAElC,OAAO,EAAU,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAO3D,MAAM,WAAW,cAAc;IAC3B,IAAI,CAAC,EAAE,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC;CACnC;AAED,MAAM,MAAM,eAAe,GAAG,cAAc,GAAG,WAAW,CAAC;AAU3D,eAAO,MAAM,UAAU,sKAGpB,CAAC"}

package/components/buttons/TabButton.d.ts

@@ -1,9 +1,8 @@
-/// <reference types="react" />
 import { ButtonProps } from '@epam/uui-components';
-import '../../assets/styles/variables/buttons/tabButton.scss';
 export interface TabButtonMods {
     size?: '36' | '48' | '60';
     withNotify?: boolean;
 }
-export declare const TabButton: import("react").ForwardRefExoticComponent<Pick<ButtonProps & TabButtonMods, "isDisabled" | "onClick" | "link" | "caption" | "dropdownIcon" | "dropdownIconPosition" | "countPosition" | "count" | "cx" | "href" | "isLinkActive" | "target" | "icon" | "iconPosition" | "onIconClick" | "clickAnalyticsEvent" | "tabIndex" | "rawProps" | "onClear" | "isOpen" | "isDropdown" | "toggleDropdownOpening" | "isInteractedOutside" | "placeholder" | "forwardedRef" | "clearIcon" | "captionCX" | keyof TabButtonMods> & import("react").RefAttributes<any>>;
+export type TabButtonProps = TabButtonMods & ButtonProps;
+export declare const TabButton: (props: ButtonProps & TabButtonMods & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 //# sourceMappingURL=TabButton.d.ts.map

package/components/buttons/TabButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabButton.d.ts","sourceRoot":"","sources":["../../../components/buttons/TabButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAU,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAI3D,OAAO,sDAAsD,CAAC;AAG9D,MAAM,WAAW,aAAa;IAC1B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AAYD,eAAO,MAAM,SAAS,2hBAMnB,CAAC"}
+{"version":3,"file":"TabButton.d.ts","sourceRoot":"","sources":["../../../components/buttons/TabButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAM3D,MAAM,WAAW,aAAa;IAC1B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,MAAM,MAAM,cAAc,GAAG,aAAa,GAAG,WAAW,CAAC;AAWzD,eAAO,MAAM,SAAS,qKAMnB,CAAC"}

package/components/buttons/VerticalTabButton.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
 import { ButtonProps } from '@epam/uui-components';
 import { TabButtonMods } from './TabButton';
-export declare const VerticalTabButton: import("react").ForwardRefExoticComponent<Pick<ButtonProps & TabButtonMods, "isDisabled" | "onClick" | "link" | "caption" | "dropdownIcon" | "dropdownIconPosition" | "countPosition" | "count" | "cx" | "href" | "isLinkActive" | "target" | "icon" | "iconPosition" | "onIconClick" | "clickAnalyticsEvent" | "tabIndex" | "rawProps" | "onClear" | "isOpen" | "isDropdown" | "toggleDropdownOpening" | "isInteractedOutside" | "placeholder" | "forwardedRef" | "clearIcon" | "captionCX" | keyof TabButtonMods> & import("react").RefAttributes<any>>;
+export type VerticalTabButtonProps = ButtonProps & TabButtonMods;
+export declare const VerticalTabButton: (props: ButtonProps & TabButtonMods & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 //# sourceMappingURL=VerticalTabButton.d.ts.map

package/components/buttons/VerticalTabButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalTabButton.d.ts","sourceRoot":"","sources":["../../../components/buttons/VerticalTabButton.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAa,aAAa,EAAE,MAAM,aAAa,CAAC;AAQvD,eAAO,MAAM,iBAAiB,2hBAA+E,CAAC"}
+{"version":3,"file":"VerticalTabButton.d.ts","sourceRoot":"","sources":["../../../components/buttons/VerticalTabButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAa,aAAa,EAAE,MAAM,aAAa,CAAC;AAQvD,MAAM,MAAM,sBAAsB,GAAG,WAAW,GAAG,aAAa,CAAC;AAEjE,eAAO,MAAM,iBAAiB,qKAA0E,CAAC"}

package/components/buttons/index.d.ts

@@ -1,4 +1,4 @@
-export * from './Button';
+export * from './Button/Button';
 export * from './IconButton';
 export * from './LinkButton';
 export * from './TabButton';

package/components/buttons/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/buttons/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/buttons/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC"}

package/components/datePickers/Calendar.d.ts

@@ -0,0 +1,5 @@
+import { CalendarProps } from '@epam/uui-components';
+import { Dayjs } from 'dayjs';
+export declare function applyDateSelectionMods(): string[];
+export declare const Calendar: (props: CalendarProps<Dayjs> & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+//# sourceMappingURL=Calendar.d.ts.map

package/components/datePickers/Calendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../../components/datePickers/Calendar.tsx"],"names":[],"mappings":"AACA,OAAO,EAA2B,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAE9E,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAE9B,wBAAgB,sBAAsB,aAIrC;AAED,eAAO,MAAM,QAAQ,8JAAsE,CAAC"}

package/components/datePickers/CalendarPresets.d.ts

@@ -0,0 +1,4 @@
+import { CalendarPresetsProps } from '@epam/uui-components';
+export declare function applyCalendarPresetsMods(): string[];
+export declare const CalendarPresets: (props: CalendarPresetsProps & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+//# sourceMappingURL=CalendarPresets.d.ts.map

package/components/datePickers/CalendarPresets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarPresets.d.ts","sourceRoot":"","sources":["../../../components/datePickers/CalendarPresets.tsx"],"names":[],"mappings":"AACA,OAAO,EAAyC,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAGnG,wBAAgB,wBAAwB,aAIvC;AAED,eAAO,MAAM,eAAe,8JAA2F,CAAC"}

package/components/datePickers/DatePicker.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { cx, DatePickerCoreProps, IDropdownToggler, DropdownBodyProps } from "@epam/uui-core";
+import { BaseDatePicker } from "@epam/uui-components";
+import { SizeMod, IHasEditMode } from "../types";
+export interface DatePickerProps extends DatePickerCoreProps, SizeMod, IHasEditMode {
+}
+export declare class DatePicker extends BaseDatePicker<DatePickerProps> {
+    renderInput: (props: IDropdownToggler & {
+        cx: any;
+    }) => JSX.Element;
+    renderBody(props: DropdownBodyProps): JSX.Element;
+}
+//# sourceMappingURL=DatePicker.d.ts.map

package/components/datePickers/DatePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../components/datePickers/DatePicker.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,mBAAmB,EAAE,gBAAgB,EAAU,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACtG,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAY,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAQ3D,MAAM,WAAW,eAAgB,SAAQ,mBAAmB,EAAE,OAAO,EAAE,YAAY;CAAG;AAEtF,qBAAa,UAAW,SAAQ,cAAc,CAAC,eAAe,CAAC;IAC3D,WAAW,UAAW,gBAAgB,GAAG;QAAC,IAAI,GAAG,CAAA;KAAC,iBAwBjD;IAED,UAAU,CAAC,KAAK,EAAE,iBAAiB;CAgBtC"}

package/components/datePickers/DatePickerBody.d.ts

@@ -0,0 +1,4 @@
+import { DatePickerBodyProps } from '@epam/uui-components';
+export declare function applyDatePickerBodyMods(): string[];
+export declare const DatePickerBody: (props: DatePickerBodyProps & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+//# sourceMappingURL=DatePickerBody.d.ts.map

package/components/datePickers/DatePickerBody.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePickerBody.d.ts","sourceRoot":"","sources":["../../../components/datePickers/DatePickerBody.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAuC,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAIhG,wBAAgB,uBAAuB,aAKtC;AAED,eAAO,MAAM,cAAc,6JAI1B,CAAC"}

package/components/datePickers/RangeDatePicker.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { IDropdownToggler, BaseRangeDatePickerProps, DropdownBodyProps } from "@epam/uui-core";
+import { BaseRangeDatePicker } from '@epam/uui-components';
+import { SizeMod } from '../index';
+export interface RangeDatePickerProps extends BaseRangeDatePickerProps, SizeMod {
+    getPlaceholder?(type: InputType): string;
+}
+export type InputType = 'from' | 'to';
+export declare class RangeDatePicker extends BaseRangeDatePicker<RangeDatePickerProps> {
+    renderBody(props: DropdownBodyProps): JSX.Element;
+    renderInput: (props: IDropdownToggler) => JSX.Element;
+}
+//# sourceMappingURL=RangeDatePicker.d.ts.map

package/components/datePickers/RangeDatePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RangeDatePicker.d.ts","sourceRoot":"","sources":["../../../components/datePickers/RangeDatePicker.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,gBAAgB,EAAU,wBAAwB,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACvG,OAAO,EAAwB,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AACjF,OAAO,EAA8B,OAAO,EAAuB,MAAM,UAAU,CAAC;AAMpF,MAAM,WAAW,oBAAqB,SAAQ,wBAAwB,EAAE,OAAO;IAC3E,cAAc,CAAC,CAAC,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;CAC5C;AAED,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,IAAI,CAAC;AAGtC,qBAAa,eAAgB,SAAQ,mBAAmB,CAAC,oBAAoB,CAAC;IAC1E,UAAU,CAAC,KAAK,EAAE,iBAAiB;IAsBnC,WAAW,UAAW,gBAAgB,iBAgDrC;CACJ"}

package/components/datePickers/RangeDatePickerBody.d.ts

@@ -0,0 +1,4 @@
+import { RangeDatePickerValue, RangeDatePickerBodyProps } from '@epam/uui-components';
+export declare function applyRangeDatePickerBodyMods(): string[];
+export declare const RangeDatePickerBody: (props: RangeDatePickerBodyProps<RangeDatePickerValue> & import("react").RefAttributes<any>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+//# sourceMappingURL=RangeDatePickerBody.d.ts.map

package/components/datePickers/RangeDatePickerBody.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RangeDatePickerBody.d.ts","sourceRoot":"","sources":["../../../components/datePickers/RangeDatePickerBody.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAiD,oBAAoB,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAIrI,wBAAgB,4BAA4B,aAO3C;AAED,eAAO,MAAM,mBAAmB,wLAI/B,CAAC"}

package/components/datePickers/index.d.ts

@@ -0,0 +1,6 @@
+export * from './DatePicker';
+export * from './DatePickerBody';
+export * from './Calendar';
+export * from './RangeDatePicker';
+export * from './RangeDatePickerBody';
+//# sourceMappingURL=index.d.ts.map

package/components/datePickers/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/datePickers/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC"}

package/components/dnd/DropMarker.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { DndActorRenderParams, IHasCX } from '@epam/uui-core';
+export interface DropMarkerProps extends DndActorRenderParams, IHasCX {
+    enableBlocker?: boolean;
+}
+export declare class DropMarker extends React.Component<DropMarkerProps> {
+    render(): JSX.Element;
+}
+//# sourceMappingURL=DropMarker.d.ts.map