@skbkontur/react-ui 1.6.10 → 1.6.11

package/components/FxInput/README.md

@@ -1,13 +1,13 @@
-```js
-let initialState = { auto: false };
-
-function handleChange(event) {
-  setState({ auto: false, value: event.target.value });
-}
-
-function handleRestore() {
-  setState({ auto: true, value: 'auto' });
-}
-
-<FxInput auto={state.auto} value={state.value} onChange={handleChange} onRestore={handleRestore} />;
-```
+```js
+let initialState = { auto: false };
+
+function handleChange(event) {
+  setState({ auto: false, value: event.target.value });
+}
+
+function handleRestore() {
+  setState({ auto: true, value: 'auto' });
+}
+
+<FxInput auto={state.auto} value={state.value} onChange={handleChange} onRestore={handleRestore} />;
+```

package/components/FxInput/index.js.flow

@@ -1,2 +1,2 @@
-/* @flow */
-export { default, FxInputProps } from './FxInput';
+/* @flow */
+export { default, FxInputProps } from './FxInput';

package/components/Gapped/Gapped.js.flow

@@ -1,13 +1,13 @@
-/* @flow */
-import * as CSS from 'csstype';
-
-export type GappedProps = {|
-  gap?: number,
-  verticalAlign?: CSS.VerticalAlignProperty<string | number>,
-  vertical?: boolean,
-  children: React$Node,
-|};
-
-declare class Gapped extends React$Component<GappedProps> {}
-
-export default Gapped;
+/* @flow */
+import * as CSS from 'csstype';
+
+export type GappedProps = {|
+  gap?: number,
+  verticalAlign?: CSS.VerticalAlignProperty<string | number>,
+  vertical?: boolean,
+  children: React$Node,
+|};
+
+declare class Gapped extends React$Component<GappedProps> {}
+
+export default Gapped;

package/components/Gapped/README.md

@@ -1,6 +1,6 @@
-```js
-<Gapped gap={20}>
-  <span>10</span>
-  <span>20</span>
-</Gapped>
-```
+```js
+<Gapped gap={20}>
+  <span>10</span>
+  <span>20</span>
+</Gapped>
+```

package/components/Gapped/index.js.flow

@@ -1,2 +1,2 @@
-/* @flow */
-export { default, GappedProps } from './Gapped';
+/* @flow */
+export { default, GappedProps } from './Gapped';

package/components/Group/Group.js.flow

@@ -1,14 +1,14 @@
-/* @flow */
-export type GroupProps = {|
-  width?: string | number,
-|};
-
-export type GroupChildProps = {|
-  mainInGroup?: boolean,
-  width?: string | number,
-  corners?: number,
-|};
-
-declare class Group extends React$Component<GroupProps> {}
-
-export default Group;
+/* @flow */
+export type GroupProps = {|
+  width?: string | number,
+|};
+
+export type GroupChildProps = {|
+  mainInGroup?: boolean,
+  width?: string | number,
+  corners?: number,
+|};
+
+declare class Group extends React$Component<GroupProps> {}
+
+export default Group;

package/components/Group/README.md

@@ -1,27 +1,27 @@
-```jsx
-const { default: UndoIcon } = require('@skbkontur/react-icons/Undo');
-const { default: FunctionIcon } = require('@skbkontur/react-icons/Function');
-const { default: Button } = require('../Button');
-const { default: Input } = require('../Input');
-
-let initialState = { auto: false };
-
-let auto = null;
-let icon = null;
-if (!state.auto) {
-  auto = (
-    <Button onClick={e => setState({ auto: true })}>
-      <UndoIcon />
-    </Button>
-  );
-} else {
-  icon = <FunctionIcon />;
-}
-
-<Group width={300}>
-  {auto}
-  <Input mainInGroup leftIcon={icon} onChange={e => setState({ auto: false })} />
-  <Button>Hey</Button>
-  <Button>Ma</Button>
-</Group>;
-```
+```jsx
+const { default: UndoIcon } = require('@skbkontur/react-icons/Undo');
+const { default: FunctionIcon } = require('@skbkontur/react-icons/Function');
+const { default: Button } = require('../Button');
+const { default: Input } = require('../Input');
+
+let initialState = { auto: false };
+
+let auto = null;
+let icon = null;
+if (!state.auto) {
+  auto = (
+    <Button onClick={e => setState({ auto: true })}>
+      <UndoIcon />
+    </Button>
+  );
+} else {
+  icon = <FunctionIcon />;
+}
+
+<Group width={300}>
+  {auto}
+  <Input mainInGroup leftIcon={icon} onChange={e => setState({ auto: false })} />
+  <Button>Hey</Button>
+  <Button>Ma</Button>
+</Group>;
+```

package/components/Group/index.js.flow

@@ -1,2 +1,2 @@
-/* @flow */
-export { default, GroupProps, GroupChildProps } from './Group';
+/* @flow */
+export { default, GroupProps, GroupChildProps } from './Group';

package/components/HideBodyVerticalScroll/HideBodyVerticalScroll.js.flow

@@ -1,7 +1,7 @@
-/* @flow */
-
-declare class HideBodyVerticalScroll extends React$Component<{||}> {
-  static hash: string;
-}
-
-export default HideBodyVerticalScroll;
+/* @flow */
+
+declare class HideBodyVerticalScroll extends React$Component<{||}> {
+  static hash: string;
+}
+
+export default HideBodyVerticalScroll;

package/components/HideBodyVerticalScroll/index.js.flow

@@ -1,2 +1,2 @@
-/* @flow */
-export { default } from './HideBodyVerticalScroll';
+/* @flow */
+export { default } from './HideBodyVerticalScroll';

package/components/Hint/Hint.js.flow

@@ -1,37 +1,37 @@
-/* @flow */
-export type HintProps = {|
-  children?: React$Node,
-  manual?: boolean,
-  maxWidth?: string | number,
-  opened?: boolean,
-  pos?:
-    | 'top'
-    | 'right'
-    | 'bottom'
-    | 'left'
-    | 'top left'
-    | 'top center'
-    | 'top right'
-    | 'bottom left'
-    | 'bottom center'
-    | 'bottom right'
-    | 'left top'
-    | 'left middle'
-    | 'left bottom'
-    | 'right top'
-    | 'right middle'
-    | 'right bottom',
-  text: React$Node,
-  disableAnimations?: boolean,
-  useWrapper?: boolean,
-  onMouseEnter?: (event: SyntheticMouseEvent<HTMLElement> | MouseEvent) => void,
-  onMouseLeave?: (event: SyntheticMouseEvent<HTMLElement> | MouseEvent) => void,
-|};
-
-export type HintState = {|
-  opened: boolean,
-|};
-
-declare class Hint extends React$Component<HintProps, HintState> {}
-
-export default Hint;
+/* @flow */
+export type HintProps = {|
+  children?: React$Node,
+  manual?: boolean,
+  maxWidth?: string | number,
+  opened?: boolean,
+  pos?:
+    | 'top'
+    | 'right'
+    | 'bottom'
+    | 'left'
+    | 'top left'
+    | 'top center'
+    | 'top right'
+    | 'bottom left'
+    | 'bottom center'
+    | 'bottom right'
+    | 'left top'
+    | 'left middle'
+    | 'left bottom'
+    | 'right top'
+    | 'right middle'
+    | 'right bottom',
+  text: React$Node,
+  disableAnimations?: boolean,
+  useWrapper?: boolean,
+  onMouseEnter?: (event: SyntheticMouseEvent<HTMLElement> | MouseEvent) => void,
+  onMouseLeave?: (event: SyntheticMouseEvent<HTMLElement> | MouseEvent) => void,
+|};
+
+export type HintState = {|
+  opened: boolean,
+|};
+
+declare class Hint extends React$Component<HintProps, HintState> {}
+
+export default Hint;

package/components/Hint/README.md

@@ -1,3 +1,3 @@
-```jsx
-<Hint text="World">Hello</Hint>
-```
+```jsx
+<Hint text="World">Hello</Hint>
+```

package/components/Hint/index.js.flow

@@ -1,2 +1,2 @@
-/* @flow */
-export { default, HintProps, HintState } from './Hint';
+/* @flow */
+export { default, HintProps, HintState } from './Hint';

package/components/Icon/20px/Icon.js.flow

@@ -1,27 +1,27 @@
-/* @flow */
-
-type MAP = {|
-  circle: string,
-  baseline: string,
-  warning: string,
-  ok: string,
-  gear: string,
-  user: string,
-  wait: string,
-  clear: string,
-  grid: string,
-  money: string,
-  'help-circle': string,
-  kebab: string,
-|};
-
-export type IconProps = {|
-  name: $Keys<MAP>,
-  color: string,
-|};
-
-declare class Icon extends React$Component<IconProps> {
-  static getAllNames(): string[];
-}
-
-export default Icon;
+/* @flow */
+
+type MAP = {|
+  circle: string,
+  baseline: string,
+  warning: string,
+  ok: string,
+  gear: string,
+  user: string,
+  wait: string,
+  clear: string,
+  grid: string,
+  money: string,
+  'help-circle': string,
+  kebab: string,
+|};
+
+export type IconProps = {|
+  name: $Keys<MAP>,
+  color: string,
+|};
+
+declare class Icon extends React$Component<IconProps> {
+  static getAllNames(): string[];
+}
+
+export default Icon;

package/components/Icon/20px/index.js.flow

@@ -1,2 +1,2 @@
-/* @flow */
-export { default, IconProps } from './Icon';
+/* @flow */
+export { default, IconProps } from './Icon';

package/components/Icon/README.md

@@ -1,64 +1,64 @@
-Для использования иконок необходимо установить пакет `@skbkontur/react-icons`
-
-<details><summary>Props</summary>
-
-```ts
-type IconProps = {
-  color?: string;
-  name: IconName;
-  size?: number | string;
-};
-
-type IconName =
-  | 'Menu'
-  | 'Add'
-  | 'ArchivePack'
-  | 'ArchiveUnpack'
-  | 'Attach'
-  | 'Baby'
-  | 'Backward'
-  | 'BarcodeScanner'
-  | 'Briefcase'
-  | 'Calculator'
-  | 'Calendar'
-  | 'Card'
-  | 'Certificate'
-  | 'Clear'
-  | ... 218 more ...
-  | 'Infiniti';
-```
-
-</details>
-
-Все иконки
-
-```jsx
-const { default: Gapped } = require('retail-ui/components/Gapped');
-const { default: Tooltip } = require('retail-ui/components/Tooltip');
-const { default: Icon } = require('@skbkontur/react-icons');
-
-<Gapped vertical>
-  <div>Имя показывается при наведении:</div>
-  <Gapped>
-    {Object.keys(Icon).map(name => (
-      <Tooltip key={name} render={() => name}>
-        <Icon name={name} />
-      </Tooltip>
-    ))}
-  </Gapped>
-</Gapped>;
-```
-
-Варианты использования иконок.
-Для уменьшения размера бандла рекомендуется использовать компонент с конкретной иконкой
-
-```jsx
-const { default: OkIcon } = require('@skbkontur/react-icons/Ok');
-const { default: Icon } = require('@skbkontur/react-icons');
-
-<Gapped gap={20}>
-  <OkIcon size={16} color="red" />
-  <Icon.Ok size={24} color="green" />
-  <Icon name="Ok" size={32} color="blue" />
-</Gapped>;
-```
+Для использования иконок необходимо установить пакет `@skbkontur/react-icons`
+
+<details><summary>Props</summary>
+
+```ts
+type IconProps = {
+  color?: string;
+  name: IconName;
+  size?: number | string;
+};
+
+type IconName =
+  | 'Menu'
+  | 'Add'
+  | 'ArchivePack'
+  | 'ArchiveUnpack'
+  | 'Attach'
+  | 'Baby'
+  | 'Backward'
+  | 'BarcodeScanner'
+  | 'Briefcase'
+  | 'Calculator'
+  | 'Calendar'
+  | 'Card'
+  | 'Certificate'
+  | 'Clear'
+  | ... 218 more ...
+  | 'Infiniti';
+```
+
+</details>
+
+Все иконки
+
+```jsx
+const { default: Gapped } = require('retail-ui/components/Gapped');
+const { default: Tooltip } = require('retail-ui/components/Tooltip');
+const { default: Icon } = require('@skbkontur/react-icons');
+
+<Gapped vertical>
+  <div>Имя показывается при наведении:</div>
+  <Gapped>
+    {Object.keys(Icon).map(name => (
+      <Tooltip key={name} render={() => name}>
+        <Icon name={name} />
+      </Tooltip>
+    ))}
+  </Gapped>
+</Gapped>;
+```
+
+Варианты использования иконок.
+Для уменьшения размера бандла рекомендуется использовать компонент с конкретной иконкой
+
+```jsx
+const { default: OkIcon } = require('@skbkontur/react-icons/Ok');
+const { default: Icon } = require('@skbkontur/react-icons');
+
+<Gapped gap={20}>
+  <OkIcon size={16} color="red" />
+  <Icon.Ok size={24} color="green" />
+  <Icon name="Ok" size={32} color="blue" />
+</Gapped>;
+```

package/components/IgnoreLayerClick/IgnoreLayerClick.js.flow

@@ -1,12 +1,12 @@
-/* @flow */
-export type IgnoreLayerClickProps = {|
-  children: React$Node,
-  active: boolean,
-|};
-
-declare class IgnoreLayerClick extends React$Component<IgnoreLayerClickProps> {
-  // eslint-disable-next-line flowtype/no-weak-types
-  render(): React$Element<any>;
-}
-
-export default IgnoreLayerClick;
+/* @flow */
+export type IgnoreLayerClickProps = {|
+  children: React$Node,
+  active: boolean,
+|};
+
+declare class IgnoreLayerClick extends React$Component<IgnoreLayerClickProps> {
+  // eslint-disable-next-line flowtype/no-weak-types
+  render(): React$Element<any>;
+}
+
+export default IgnoreLayerClick;

package/components/IgnoreLayerClick/index.js.flow

@@ -1,2 +1,2 @@
-/* @flow */
-export { default, IgnoreLayerClickProps } from './IgnoreLayerClick';
+/* @flow */
+export { default, IgnoreLayerClickProps } from './IgnoreLayerClick';

package/components/Input/Input.adapter.js.flow

@@ -1,9 +1,9 @@
-/* @flow */
-import Input from './Input.js';
-
-export type InputAdapter = {|
-  getValue(inst: Input): string | void,
-  setValue(inst: Input, value: string): void,
-|};
-
-export default Input;
+/* @flow */
+import Input from './Input.js';
+
+export type InputAdapter = {|
+  getValue(inst: Input): string | void,
+  setValue(inst: Input, value: string): void,
+|};
+
+export default Input;

package/components/Input/Input.js.flow

@@ -1,55 +1,55 @@
-/* @flow */
-import type { MouseEventHandler } from '../eventHandlers';
-
-export type InputSize = 'small' | 'medium' | 'large';
-export type InputAlign = 'left' | 'center' | 'right';
-export type InputType = 'password' | 'text';
-export type IconType = React$Node | (() => React$Node);
-
-export type InputProps = {
-  leftIcon?: IconType,
-  rightIcon?: IconType,
-  error?: boolean,
-  warning?: boolean,
-  borderless?: boolean,
-  align?: InputAlign,
-  mask?: ?string,
-  maskChar?: ?string,
-  formatChars?: {
-    [key: string]: string,
-  },
-  alwaysShowMask?: boolean,
-  size?: InputSize,
-  onChange?: (event: SyntheticKeyboardEvent<HTMLInputElement>, value: string) => void,
-  onMouseEnter?: MouseEventHandler<HTMLLabelElement>,
-  onMouseLeave?: MouseEventHandler<HTMLLabelElement>,
-  onMouseOver?: MouseEventHandler<HTMLLabelElement>,
-  type?: InputType,
-  value?: string,
-  capture?: boolean,
-  prefix?: React$Node,
-  suffix?: React$Node,
-  mainInGroup?: boolean,
-  selectAllOnFocus?: boolean,
-  onUnexpectedInput?: () => void,
-};
-
-export type InputVisibilityState = {|
-  blinking: boolean,
-  focused: boolean,
-|};
-
-export type InputState = {|
-  ...$Exact<InputVisibilityState>,
-  polyfillPlaceholder: boolean,
-|};
-
-declare class Input extends React$Component<InputProps, InputState> {
-  focus(): void;
-  blur(): void;
-  blink(): void;
-  setSelectionRange(start: number, end: number): void;
-  selectAll: () => void;
-}
-
-export default Input;
+/* @flow */
+import type { MouseEventHandler } from '../eventHandlers';
+
+export type InputSize = 'small' | 'medium' | 'large';
+export type InputAlign = 'left' | 'center' | 'right';
+export type InputType = 'password' | 'text';
+export type IconType = React$Node | (() => React$Node);
+
+export type InputProps = {
+  leftIcon?: IconType,
+  rightIcon?: IconType,
+  error?: boolean,
+  warning?: boolean,
+  borderless?: boolean,
+  align?: InputAlign,
+  mask?: ?string,
+  maskChar?: ?string,
+  formatChars?: {
+    [key: string]: string,
+  },
+  alwaysShowMask?: boolean,
+  size?: InputSize,
+  onChange?: (event: SyntheticKeyboardEvent<HTMLInputElement>, value: string) => void,
+  onMouseEnter?: MouseEventHandler<HTMLLabelElement>,
+  onMouseLeave?: MouseEventHandler<HTMLLabelElement>,
+  onMouseOver?: MouseEventHandler<HTMLLabelElement>,
+  type?: InputType,
+  value?: string,
+  capture?: boolean,
+  prefix?: React$Node,
+  suffix?: React$Node,
+  mainInGroup?: boolean,
+  selectAllOnFocus?: boolean,
+  onUnexpectedInput?: () => void,
+};
+
+export type InputVisibilityState = {|
+  blinking: boolean,
+  focused: boolean,
+|};
+
+export type InputState = {|
+  ...$Exact<InputVisibilityState>,
+  polyfillPlaceholder: boolean,
+|};
+
+declare class Input extends React$Component<InputProps, InputState> {
+  focus(): void;
+  blur(): void;
+  blink(): void;
+  setSelectionRange(start: number, end: number): void;
+  selectAll: () => void;
+}
+
+export default Input;

package/components/Input/README.md

@@ -1,13 +1,13 @@
-```jsx
-const SearchIcon = require('@skbkontur/react-icons/Search').default;
-
-<Input leftIcon={<SearchIcon />} />;
-```
-
-Пример с префиксом:
-
-```jsx
-const SearchIcon = require('@skbkontur/react-icons/Search').default;
-
-<Input width={400} prefix="https://kontur.ru/search?query=" rightIcon={<SearchIcon />} />;
-```
+```jsx
+const SearchIcon = require('@skbkontur/react-icons/Search').default;
+
+<Input leftIcon={<SearchIcon />} />;
+```
+
+Пример с префиксом:
+
+```jsx
+const SearchIcon = require('@skbkontur/react-icons/Search').default;
+
+<Input width={400} prefix="https://kontur.ru/search?query=" rightIcon={<SearchIcon />} />;
+```