@broxus/react-uikit 0.8.0 → 0.8.1

package/dist/cjs/components/Control/Checkbox/index.scss

@@ -86,20 +86,21 @@
 }
 
 .uk-checkbox-wrapper .uk-checkbox-inner::after {
-    border: var(--checkbox-border-width) solid var(--checkbox-checked-border);
+    border: var(--checkbox-checked-icon-border-width) solid var(--checkbox-checked-icon-color);
     border-left: 0;
     border-top: 0;
+    box-sizing: border-box;
     content: ' ';
     display: block;
-    height: calc(var(--checkbox-size) / 2.5);
-    left: 27.5%;
+    height: calc(var(--checkbox-size) / 2);
+    left: 28.5%;
     opacity: 0;
     position: absolute;
     top: 50%;
     transform: rotate(45deg) scale(0) translate(-50%, -50%);
     transition: all var(--transition-fast-duration) var(--ease-in-back),
         opacity var(--transition-fast-duration);
-    width: calc(var(--checkbox-size) / 6);
+    width: calc(var(--checkbox-size) / 4);
 }
 
 .uk-checkbox-wrapper .uk-checkbox-label {
@@ -314,6 +315,7 @@
     --checkbox-size: #{$checkbox-size};
     --checkbox-checked-background: var(--global-primary-background);
     --checkbox-checked-border: var(--global-primary-border);
+    --checkbox-checked-icon-border-width: #{$checkbox-checked-icon-border-width};
     --checkbox-checked-icon-color: var(--global-inverse-color);
     --checkbox-control-background: #{$checkbox-control-background};
     --checkbox-checked-control-background: #{$checkbox-checked-control-background};

package/dist/cjs/components/Section/index.d.ts

@@ -2,9 +2,9 @@ import * as React from 'react';
 import { type PolymorphicProps } from '../../components/Component';
 import './index.scss';
 export type SectionOwnProps = {
+    kind?: 'default' | 'muted' | 'primary' | 'secondary' | 'tertiary';
     preserveColor?: boolean;
     size?: 'xsmall' | 'small' | 'large' | 'xlarge';
-    type?: 'default' | 'muted' | 'primary' | 'secondary' | 'tertiary';
 };
 export type SectionProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<SectionOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, SectionOwnProps>;
 declare const defaultElement = "section";

package/dist/cjs/components/Section/index.js

@@ -35,11 +35,11 @@ require("./index.scss");
 const defaultElement = 'section';
 function Section(props) {
     const config = (0, ConfigProvider_1.useConfig)();
-    const { className, prefixCls = config.prefixCls, preserveColor, size, type, ...restProps } = props;
+    const { className, prefixCls = config.prefixCls, preserveColor, size, kind, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'section'), [config, prefixCls]);
     return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)(rootCls, {
             [`${rootCls}-${size}`]: size !== undefined,
-            [`${rootCls}-${type}`]: type !== undefined,
+            [`${rootCls}-${kind}`]: kind !== undefined,
             [`${prefixCls || config.prefixCls}-preserve-color`]: preserveColor,
         }, className), component: defaultElement, ...restProps }));
 }

package/dist/cjs/components/Tile/index.d.ts

@@ -2,10 +2,10 @@ import * as React from 'react';
 import { type PolymorphicProps } from '../../components/Component';
 import './index.scss';
 export type TileOwnProps = {
+    kind?: 'default' | 'muted' | 'primary' | 'secondary' | 'tertiary';
     prefixCls?: string;
     preserveColor?: boolean;
     size?: 'xsmall' | 'small' | 'large' | 'xlarge';
-    type?: 'default' | 'muted' | 'primary' | 'secondary' | 'tertiary';
 };
 export type TileProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<TileOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, TileOwnProps>;
 declare const defaultElement = "div";

package/dist/cjs/components/Tile/index.js

@@ -35,11 +35,11 @@ require("./index.scss");
 const defaultElement = 'div';
 function Tile(props) {
     const config = (0, ConfigProvider_1.useConfig)();
-    const { className, prefixCls = config.prefixCls, preserveColor, size, type, ...restProps } = props;
+    const { className, prefixCls = config.prefixCls, preserveColor, size, kind, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'tile'), [config, prefixCls]);
     return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)(rootCls, {
             [`${rootCls}-${size}`]: size !== undefined,
-            [`${rootCls}-${type}`]: type !== undefined,
+            [`${rootCls}-${kind}`]: kind !== undefined,
             [`${prefixCls || config.prefixCls}-preserve-color`]: preserveColor,
         }, className), component: defaultElement, ...restProps }));
 }

package/dist/cjs/styles/variables.scss

@@ -881,6 +881,7 @@ $checkbox-checked-control-padding:                              10px !default;
 $checkbox-disabled-background:                                  $control-disabled-background !default;
 $checkbox-disabled-border:                                      $control-disabled-border !default;
 $checkbox-disabled-icon-color:                                  $global-muted-color !default;
+$checkbox-checked-icon-border-width:                            2px !default;
 $checkbox-indeterminate-size:                                   $checkbox-size - 10px !default;