Feat/live edit storybook docs

.prettierignore

@@ -0,0 +1 @@
+__testfixtures__

.storybook/blocks/example/LiveExample.tsx

@@ -2,7 +2,6 @@ import React, { FC, useState } from 'react';
 import { LiveProvider, LiveEditor, LivePreview } from 'react-live';
 import { ActionBar } from '@storybook/components';
 import { PrismTheme } from 'prism-react-renderer';
-
 import { ErrorSection } from './ErrorSection';
 import globalScope from './utils/scope';
 
@@ -45,10 +44,16 @@ export const LiveExample: FC<LiveExampleProps> = ({
         },
     ];
 
+    const code2 = code
+        .split('\n')
+        .filter(line => line.startsWith('//') === false)
+        .join('\n')
+        .trim();
+
     return (
         <LiveProvider
             code={code}
-            noInline={code.startsWith('<') === false}
+            noInline={code2.startsWith('<') === false && code2.startsWith('//') === false}
             theme={theme}
             scope={{
                 ...globalScope,

.storybook/blocks/example/index.module.css

@@ -46,9 +46,10 @@
     & button {
         justify-content: center;
         min-width: 110px;
-        transition: 0.2s ease;
+        transition: box-shadow 0.2s ease;
 
         &:focus {
+            @mixin focus-outline;
             box-shadow: none;
         }
 

.storybook/blocks/example/utils/scope.ts

@@ -1,6 +1,8 @@
 import { ComponentType } from 'react';
 import * as grid from '../../grid';
 import * as glyph from '@alfalab/icons-glyph';
+import * as dateUtils from 'date-fns';
+import * as knobs from '@storybook/addon-knobs';
 
 const req = require.context(
     '../../../../packages',
@@ -12,11 +14,14 @@ const isComponent = (component: any) =>
     ['function', 'object'].some(t => typeof component === t) &&
     ['displayName', '$$typeof'].some(p => p in component);
 
+const isComponentsMap = (component: any) =>
+    component && Object.values(component).some(isComponent)
+
 const components = req.keys().reduce((acc: Record<string, ComponentType<unknown>>, key) => {
     Object.entries(req(key)).forEach(([componentName, component]: [string, any]) => {
-        if (isComponent(component)) {
+        // if (isComponent(component) || isComponentsMap(component)) {
             acc[componentName] = component;
-        }
+        // }
     });
 
     return acc;
@@ -26,4 +31,6 @@ export default {
     ...components,
     ...grid,
     ...glyph,
+    ...dateUtils,
+    ...knobs,
 };

.storybook/main.js

@@ -19,7 +19,7 @@ const addPackagesDir = config => {
 };
 
 module.exports = {
-    stories: ['../packages/**/*.stories.@(ts|md)x'],
+    stories: ['../packages/**/*.stories.@(ts|md)x', '../docs/**/*.stories.@(ts|md)x'],
     addons: [
         '@storybook/addon-knobs',
         '@storybook/addon-docs',

CHANGELOG.md

@@ -1,3 +1,94 @@
+## [18.2.1](https://github.com/alfa-laboratory/core-components/compare/v18.2.0...v18.2.1) (2021-07-02)
+
+
+### Bug Fixes
+
+* **base-modal:** resubscribe observer when content node changed ([2fef06e](https://github.com/alfa-laboratory/core-components/commit/2fef06eea01354f58663a5f4470606123d31f9d4))
+
+# [18.2.0](https://github.com/alfa-laboratory/core-components/compare/v18.1.0...v18.2.0) (2021-06-30)
+
+
+### Bug Fixes
+
+* **dark-theme-styles-injector:** fix rendering passed styles ([#723](https://github.com/alfa-laboratory/core-components/issues/723)) ([882841c](https://github.com/alfa-laboratory/core-components/commit/882841c1c43d5570652ab3fcc199958060b92c57))
+
+
+### Features
+
+* **calendar-range:** pass props to render calendar in popper ([#702](https://github.com/alfa-laboratory/core-components/issues/702)) ([4369e46](https://github.com/alfa-laboratory/core-components/commit/4369e462116dc1d240f95f811be67639b10dedb6))
+
+# [18.1.0](https://github.com/alfa-laboratory/core-components/compare/v18.0.0...v18.1.0) (2021-06-29)
+
+
+### Features
+
+* **password-input:** add password input (PDS-233) ([#691](https://github.com/alfa-laboratory/core-components/issues/691)) ([d872e4d](https://github.com/alfa-laboratory/core-components/commit/d872e4dd18fd5db472864fbc2676749b812da00f))
+
+# [18.0.0](https://github.com/alfa-laboratory/core-components/compare/v17.6.0...v18.0.0) (2021-06-28)
+
+
+### Bug Fixes
+
+* **base-modal:** fix has scroll bug ([#712](https://github.com/alfa-laboratory/core-components/issues/712)) ([a6749a1](https://github.com/alfa-laboratory/core-components/commit/a6749a149d511b28cc59aaec188d59c380c64243))
+* **space:** remove last element margin ([#713](https://github.com/alfa-laboratory/core-components/issues/713)) ([bc36cf7](https://github.com/alfa-laboratory/core-components/commit/bc36cf7db35cbd7c5d36c178a50bbd27d2f11b0c))
+* **typography:** add missing weight styles ([#719](https://github.com/alfa-laboratory/core-components/issues/719)) ([6b855aa](https://github.com/alfa-laboratory/core-components/commit/6b855aa97eff918e0e16f957c4c05bb7f2d8f4fe))
+
+
+### Features
+
+* **bottom-sheet:** new component (PDS-228) ([#645](https://github.com/alfa-laboratory/core-components/issues/645)) ([1f7391d](https://github.com/alfa-laboratory/core-components/commit/1f7391df16a270d8a3a28b8ebaf98d0ed0928bc8)), closes [#642](https://github.com/alfa-laboratory/core-components/issues/642) [#642](https://github.com/alfa-laboratory/core-components/issues/642) [#646](https://github.com/alfa-laboratory/core-components/issues/646) [#646](https://github.com/alfa-laboratory/core-components/issues/646) [#634](https://github.com/alfa-laboratory/core-components/issues/634) [#635](https://github.com/alfa-laboratory/core-components/issues/635) [#634](https://github.com/alfa-laboratory/core-components/issues/634) [#635](https://github.com/alfa-laboratory/core-components/issues/635) [#648](https://github.com/alfa-laboratory/core-components/issues/648) [#647](https://github.com/alfa-laboratory/core-components/issues/647) [#630](https://github.com/alfa-laboratory/core-components/issues/630) [#648](https://github.com/alfa-laboratory/core-components/issues/648) [#630](https://github.com/alfa-laboratory/core-components/issues/630) [#669](https://github.com/alfa-laboratory/core-components/issues/669)
+* **confirmation:** add property for change retry button text ([#720](https://github.com/alfa-laboratory/core-components/issues/720)) ([c0f7688](https://github.com/alfa-laboratory/core-components/commit/c0f76888cffff8ad4169769bc4615429663352a5))
+* **skeleton:** add display var, change default to block ([#718](https://github.com/alfa-laboratory/core-components/issues/718)) ([27aaa60](https://github.com/alfa-laboratory/core-components/commit/27aaa605a958d932a52904556ac2fe1dd59356af))
+
+
+### BREAKING CHANGES
+
+* **skeleton:** inline-block changes to block
+* **confirmation:** buttonRetryText renamed to buttonReturnText
+
+Co-authored-by: Alexander Soldatov <aesoldatov@alfabank.ru>
+
+# [17.6.0](https://github.com/alfa-laboratory/core-components/compare/v17.5.1...v17.6.0) (2021-06-22)
+
+
+### Bug Fixes
+
+* **intl-phone-input:** format input value ([#703](https://github.com/alfa-laboratory/core-components/issues/703)) ([b5e91ed](https://github.com/alfa-laboratory/core-components/commit/b5e91edf03867f5dc93fab78425f7c1a128afd9b))
+
+
+### Features
+
+* **dark-theme-styles-injector:** add prop for selector ([#709](https://github.com/alfa-laboratory/core-components/issues/709)) ([f74cdc7](https://github.com/alfa-laboratory/core-components/commit/f74cdc7b312321fcb111f1c64f21714ee403e513))
+* **slider-input:** design updates ([#673](https://github.com/alfa-laboratory/core-components/issues/673)) ([794e3cc](https://github.com/alfa-laboratory/core-components/commit/794e3cc99a3b61ec4faa630469dae7e49a56ee0a))
+* **textarea:** add value counter ([#695](https://github.com/alfa-laboratory/core-components/issues/695)) ([cbc6bd3](https://github.com/alfa-laboratory/core-components/commit/cbc6bd3eaa48e3df2791d23e156c7c664d67ff49))
+
+## [17.5.1](https://github.com/alfa-laboratory/core-components/compare/v17.5.0...v17.5.1) (2021-06-21)
+
+
+### Bug Fixes
+
+* **calendar-with-skeleton:** ref & six weeks height issues ([#705](https://github.com/alfa-laboratory/core-components/issues/705)) ([907ebe1](https://github.com/alfa-laboratory/core-components/commit/907ebe18641ee2e7e91fc4622527404c20867a54))
+
+# [17.5.0](https://github.com/alfa-laboratory/core-components/compare/v17.4.2...v17.5.0) (2021-06-17)
+
+
+### Bug Fixes
+
+* **select:** fix checkmark position on click theme ([#699](https://github.com/alfa-laboratory/core-components/issues/699)) ([0a3bab5](https://github.com/alfa-laboratory/core-components/commit/0a3bab52278b4db8f327a8bf5da97cfb5acecc6a))
+
+
+### Features
+
+* **notification:** add null autoCloseDelay ([#698](https://github.com/alfa-laboratory/core-components/issues/698)) ([6c2f0e0](https://github.com/alfa-laboratory/core-components/commit/6c2f0e083ec94797e8193b19d8bbafd042a5c2a5))
+* **select:** add useSelectWithLoading preset ([#693](https://github.com/alfa-laboratory/core-components/issues/693)) ([12d542f](https://github.com/alfa-laboratory/core-components/commit/12d542f11dddcd022c1ba895e4105115be0b98b2))
+
+## [17.4.2](https://github.com/alfa-laboratory/core-components/compare/v17.4.1...v17.4.2) (2021-06-09)
+
+
+### Bug Fixes
+
+* **skeleton:** remove vars that purge kills ([886d1b2](https://github.com/alfa-laboratory/core-components/commit/886d1b24b144d9d277821d3264f71a93c7a1b146))
+
 ## [17.4.1](https://github.com/alfa-laboratory/core-components/compare/v17.4.0...v17.4.1) (2021-06-08)
 
 

bin/build-themes.js

@@ -91,7 +91,7 @@ const processPostCss = async (content, cssFile) =>
         fs.writeFileSync(`../css/colors/${path.basename(file)}`, css);
         fs.writeFileSync(
             `../css/colors/${path.basename(file).replace(/\.css$/, '.js')}`,
-            `module.exports = \`${css}\``,
+            `module.exports = \`${vars}\``,
         );
     });
 

bin/build.sh

@@ -14,6 +14,7 @@ echo "start build on $CONCURRENCY parallel process"
 lerna exec --concurrency $CONCURRENCY \
     --ignore @alfalab/core-components-vars \
     --ignore @alfalab/core-components-themes \
+    --ignore @alfalab/core-components-codemod \
     -- $(pwd)/bin/rollup.sh
 
 # собираю css пакеты

docs/12.migrations.stories.mdx

@@ -0,0 +1,6 @@
+import { Description } from '@storybook/addon-docs/blocks';
+import migrationsReadme from '../packages/codemod/README.md';
+
+<Meta title='Гайдлайны/Миграция со старых компонентов' />
+
+<Description>{migrationsReadme}</Description>

jest.codemod.config.js

@@ -0,0 +1 @@
+module.exports = {};

jest.config.js

@@ -19,6 +19,7 @@ module.exports = {
         '\\.css$': 'identity-obj-proxy',
     },
     testMatch: ['**/*.test.ts?(x)', '!**/*.screenshots.test.ts?(x)'],
+    testPathIgnorePatterns: ['codemod'],
     coverageReporters: ['lcov', 'text', 'text-summary', 'clover'],
     coveragePathIgnorePatterns: ['index.ts'],
 };

lerna.json

@@ -9,7 +9,8 @@
             "ignoreChanges": [
                 "*.stories.*",
                 "**/__snapshots__/**",
-                "*.test.*"
+                "*.test.*",
+                "**/codemod/**"
             ]
 
         }

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components",
-    "version": "17.4.1",
+    "version": "18.2.1",
     "private": true,
     "workspaces": [
         "packages/*"
@@ -27,6 +27,7 @@
         "lint:js": "eslint ./packages --ext .ts,.tsx,.js,.jsx",
         "test": "jest --watchAll=false --env=jsdom-sixteen",
         "test:screenshots": "jest --config=jest.screenshots.config.js",
+        "test:codemod": "jest --config=jest.codemod.config.js packages/codemod/",
         "format": "prettier --write \"./{packages,bin}/**/*.{ts,tsx,js,jsx,css,json}\"",
         "clean": "rimraf packages/*/{tsconfig.tsbuildinfo,dist} && rimraf {dist,build}",
         "cm": "git-cz",
@@ -170,7 +171,7 @@
         "raw-loader": "^4.0.1",
         "react-docgen-typescript-loader": "^3.6.0",
         "react-github-btn": "^1.2.0",
-        "react-live": "^2.2.3",
+        "react-live": "^2.3.0",
         "react-scripts": "^3.3.1",
         "replace-in-file": "^5.0.2",
         "rimraf": "^3.0.2",

packages/alert/src/docs/Component.stories.mdx

@@ -4,11 +4,11 @@ import { Container, Row, Col } from 'storybook/blocks/grid';
 import { Tabs } from 'storybook/blocks/tabs';
 import { ComponentHeader } from 'storybook/blocks/component-header';
 
-import { Alert } from '../Component';
 import { Button } from '../../../button/src';
-import Description from './description.mdx'
 
+import { Alert } from '../Component';
 import { name, version } from '../../package.json';
+import Description from './description.mdx'
 
 <Meta
     title='Компоненты/Alert'
@@ -46,7 +46,7 @@ import { name, version } from '../../package.json';
 import { Alert } from '@alfalab/core-components-alert';
 ```
 
-<Tabs 
+<Tabs
     description={<Description />}
     props={<Props of={Alert} />}
 />

packages/alert/src/docs/description.mdx

@@ -1,7 +1,5 @@
 Информирует пользователя о чем-либо. Может использоваться как сообщение, комментарий или предупреждение от системы.
 
 ```tsx live
-<Container>
-    <Alert>Вам одобрено. Согласитесь на предложение</Alert>
-</Container>
+<Alert>Вам одобрено. Согласитесь на предложение</Alert>
 ```

packages/amount-input/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.0.20](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-amount-input@4.0.19...@alfalab/core-components-amount-input@4.0.20) (2021-06-22)
+
+**Note:** Version bump only for package @alfalab/core-components-amount-input
+
+
+
+
+
 ## [4.0.19](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-amount-input@4.0.18...@alfalab/core-components-amount-input@4.0.19) (2021-05-31)
 
 **Note:** Version bump only for package @alfalab/core-components-amount-input

packages/amount-input/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-amount-input",
-    "version": "4.0.19",
+    "version": "4.0.20",
     "description": "",
     "keywords": [],
     "license": "MIT",
@@ -19,8 +19,8 @@
         "react": "^16.9.0 || ^17.0.1"
     },
     "dependencies": {
-        "@alfalab/core-components-input": "^6.1.3",
-        "@alfalab/core-components-with-suffix": "^2.4.18",
+        "@alfalab/core-components-input": "^6.2.0",
+        "@alfalab/core-components-with-suffix": "^2.4.19",
         "@alfalab/data": "^0.4.0",
         "@alfalab/utils": "^1.1.1",
         "classnames": "^2.2.6"

packages/amount-input/src/docs/Component.stories.mdx

@@ -1,17 +1,15 @@
-import Icon from '@alfalab/icons-glyph/StarMIcon';
-import { Meta, Story, Preview, Props } from '@storybook/addon-docs/blocks';
+import { Meta, Story, Props } from '@storybook/addon-docs/blocks';
 import { text, select, boolean, number } from '@storybook/addon-knobs';
 import { action } from '@storybook/addon-actions';
-import { Container, Row, Col } from 'storybook/blocks/grid';
+import Icon from '@alfalab/icons-glyph/StarMIcon';
 import { ComponentHeader } from 'storybook/blocks/component-header';
 import { CssVars } from 'storybook/blocks/css-vars';
 import { Tabs } from 'storybook/blocks/tabs';
 
-import Description from './description.mdx';
-import styles from '!!raw-loader!../index.module.css';
-
 import { AmountInput } from '../Component';
 import { name, version } from '../../package.json';
+import Description from './description.mdx';
+import styles from '!!raw-loader!../index.module.css';
 
 <Meta
     title='Компоненты/AmountInput'