Merge branch 'master' into e.muhamethanov/7513/card-plain-mode

# Conflicts: # packages/vkui/src/components/Card/Readme.md
VKCOM · Nov 5, 2024 · 59557f4 · 59557f4
2 parents 6bce669 + 47187e8
commit 59557f4
Show file tree

Hide file tree

Showing 240 changed files with 2,543 additions and 2,912 deletions.
diff --git a/.github/dependabot.yml b/.github/dependabot.yml
@@ -77,6 +77,9 @@ updates:
         patterns:
           - '@swc/*'
           - 'swc-plugin-*'
+      rspack:
+        patterns:
+          - '@rspack/*'
     versioning-strategy: increase
     open-pull-requests-limit: 20
     reviewers:

diff --git a/README.md b/README.md
@@ -69,7 +69,7 @@ const Example = () => {
           <View activePanel="main">
             <Panel id="main">
               <PanelHeader>VKUI</PanelHeader>
-              <Group header={<Header mode="secondary">Items</Header>}>
+              <Group header={<Header size="s">Items</Header>}>
                 <SimpleCell>Hello</SimpleCell>
                 <SimpleCell>World</SimpleCell>
               </Group>

diff --git a/benchmark/package.json b/benchmark/package.json
@@ -9,24 +9,24 @@
     "runtime:start:ci": "yarn run -T playwright test --config runtime/playwright.config.ts"
   },
   "dependencies": {
-    "@playwright/test": "1.48.1",
-    "@swc/core": "^1.7.36",
+    "@playwright/test": "1.48.2",
+    "@swc/core": "^1.8.0",
     "@vkontakte/vkui": "workspace:packages/vkui",
     "cli-table3": "^0.6.1",
     "css-loader": "^6.10.0",
     "css-minimizer-webpack-plugin": "^7.0.0",
     "dotenv": "^16.4.5",
     "finalhandler": "1.3.1",
-    "html-webpack-plugin": "^5.6.2",
-    "mini-css-extract-plugin": "^2.9.1",
-    "playwright": "1.48.1",
+    "html-webpack-plugin": "^5.6.3",
+    "mini-css-extract-plugin": "^2.9.2",
+    "playwright": "1.48.2",
     "postcss": "^8.4.47",
     "postcss-modules": "^6.0.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "serve-static": "1.16.2",
     "swc-loader": "^0.2.6",
     "terser-webpack-plugin": "^5.3.10",
-    "webpack": "^5.95.0"
+    "webpack": "^5.96.1"
   }
 }
diff --git a/docs/CONTRIBUTING.md b/docs/CONTRIBUTING.md
@@ -42,7 +42,7 @@ git config blame.ignoreRevsFile .git-blame-ignore-revs
   > Не используем композицию, т.к. в ней нет необходимости,
   > а также в будущем она может усложнить переход на другое решение.
 
-- CSS-классы должны быть в формате camelCase: `elementNameModification`. [Гайд по написанию стилей](https://github.com/VKCOM/VKUI/blob/master/docs/CSS_GUIDE.md)
+- CSS-классы должны быть в формате camelCase: `elementNameModification`. [Гайд по написанию стилей](CSS_GUIDE.md)
 - Свойства `className` и `style` навешиваются на корневой элемент компонента
 - Свойства, не используемые в коде компонента, навешиваются на **главный** элемент компонента. По умолчанию главным является корневой элемент:
 
@@ -83,10 +83,10 @@ git config blame.ignoreRevsFile .git-blame-ignore-revs
 - Для цветов, скруглений, размеров, отступов и теней используются css-переменные из [vkui-tokens](https://github.com/VKCOM/vkui-tokens)
 - Для типографии используются компоненты [Typography](https://vkcom.github.io/VKUI/#!/Typography) там, где это возможно
 - Добавлен `export` компонента и его свойств в `packages/vkui/src/index.ts`
-- Компонент покрыт юнит- и скриншотными тестами. [Гайд по тестированию](https://github.com/VKCOM/VKUI/blob/master/docs/TESTING.md)
+- Компонент покрыт юнит- и скриншотными тестами. [Гайд по тестированию](TESTING.md)
 - Компонент корректно отображается на всех платформах, размерах и цветовых схемах. В styleguide для всех этих параметров есть переключатели
 - Код корректно работает на [поддерживаемых нами браузерах](https://github.com/VKCOM/VKUI#%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D1%8B)
-- Для поддержки адаптивности следует придерживаться [гайда по написанию адаптивных компонентов](https://github.com/VKCOM/VKUI/blob/master/docs/ADAPTIVITY_GUIDE.md)
+- Для поддержки адаптивности следует придерживаться [гайда по написанию адаптивных компонентов](ADAPTIVITY_GUIDE.md)
 - `a11y` (см. пример хорошего PR с внедрением доступности, на который можно равняться [#3337](https://github.com/VKCOM/VKUI/issues/3337)):
 
   - Компонент соответствует требованиям `a11y`

diff --git a/docs/MAINTAINERS.md b/docs/MAINTAINERS.md
@@ -2,7 +2,7 @@
 
 Данный документ содержит базовую информацию по сопровождению и процессам разработки и будет полезен в первую очередь
 сопровождающим (maintainers) репозитория **VKUI**. Информацию по правилам работы с кодом можно найти в
-[требованиях к разработке](https://github.com/VKCOM/VKUI/blob/master/docs/CONTRIBUTING.md).
+[требованиях к разработке](CONTRIBUTING.md).
 
 ## Глоссарий
 
@@ -101,9 +101,8 @@
 > ⚠️ Обратите внимание
 >
 > Несмотря на то, что черновой список изменений создаётся и обновляется автоматически при слиянии `Pull Request`, бывают случае,
-> когда нужно вручную добавить или отредактировать изменение. Тогда нужно учитывать, что ссылка на черновик меняется после каждого
-> его сохранения. Поэтому если вносить изменения одновременно с кем-то, то последний сохранивший документ получит ошибку, что он уже
-> неактуален. В этом случае, нужно будет открыть черновик по новой ссылке и снова внести свои изменения.
+> когда нужно вручную добавить или отредактировать изменение. Тогда нужно учитывать, что кто-то параллельно тоже может начать
+> редактировать черновик и тот, кто последний сохранит, затрёт изменение другого.
 >
 > Чтобы избежать таких неудобств, лучше всего сообщить коллегам в чате, что вы собираетесь вносить изменения, а после отписаться,
 > что вы закончили работы.
@@ -160,7 +159,7 @@
   дедупликацию зависимостей в ветке. Если безопасно вносить изменения в ветку напрямую, то можно отметить `push directly to the branch`,
   иначе будет создан `PR` с изменениями в выбранную ветку. Бывает полезно запускать эту автоматизацию после обновления
   зависимостей в ветке - у нас настроен [Dependabot](https://docs.github.com/en/code-security/getting-started/dependabot-quickstart-guide),
-  который [обновляет зависимости](https://github.com/VKCOM/VKUI/blob/master/.github/dependabot.yml) в начале каждой недели.
+  который [обновляет зависимости](../.github/dependabot.yml) в начале каждой недели.
 - [Update screenshots](https://github.com/VKCOM/VKUI/actions/workflows/update_screens.yml): данная автоматизация
   позволяет запускать обновление скриншотов в выбранной ветке вручную (если вы забыли это сделать локально, например),
   а так же отвечает за обновление скриншотов в `stable`-ветках в автоматическом режиме (потому что мы не дублируем

diff --git a/package.json b/package.json
@@ -11,24 +11,24 @@
   },
   "devDependencies": {
     "@csstools/postcss-global-data": "3.0.0",
-    "@playwright/experimental-ct-react": "1.48.1",
-    "@playwright/test": "1.48.1",
-    "@rspack/cli": "^v1.0.11",
-    "@rspack/core": "^v1.0.11",
+    "@playwright/experimental-ct-react": "1.48.2",
+    "@playwright/test": "1.48.2",
+    "@rspack/cli": "^v1.0.14",
+    "@rspack/core": "^v1.0.14",
     "@size-limit/file": "^11.1.6",
     "@size-limit/webpack": "^11.1.6",
     "@size-limit/webpack-css": "^11.1.6",
-    "@swc/cli": "^0.4.0",
-    "@swc/core": "1.7.36",
-    "@swc/jest": "^0.2.36",
+    "@swc/cli": "^0.5.0",
+    "@swc/core": "1.8.0",
+    "@swc/jest": "^0.2.37",
     "@testing-library/dom": "^10.4.0",
-    "@testing-library/jest-dom": "^6.6.2",
+    "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.5.2",
-    "@types/jest": "^29.5.13",
+    "@types/jest": "^29.5.14",
     "@types/jest-axe": "^3.5.9",
-    "@types/node": "^22.7.7",
-    "@types/react": "^18.3.11",
+    "@types/node": "^22.8.7",
+    "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
     "@types/webpack": "^5.28.5",
     "@typescript-eslint/eslint-plugin": "^7.5.0",
@@ -64,10 +64,10 @@
     "jest-environment-node": "^29.7.0",
     "jest-preset-stylelint": "^7.1.0",
     "lint-staged": "^15.2.10",
-    "mini-css-extract-plugin": "^2.9.1",
+    "mini-css-extract-plugin": "^2.9.2",
     "postcss": "^8.4.47",
     "postcss-cli": "^11.0.0",
-    "postcss-custom-media": "^11.0.3",
+    "postcss-custom-media": "^11.0.5",
     "postcss-gap-properties": "^6.0.0",
     "postcss-import": "^16.1.0",
     "postcss-loader": "^8.1.1",
@@ -94,7 +94,7 @@
     "ts-node": "^10.9.2",
     "typescript": "^5.6.3",
     "typescript-plugin-css-modules": "^5.1.0",
-    "webpack": "^5.95.0",
+    "webpack": "^5.96.1",
     "webpack-cli": "^5.1.4",
     "webpack-merge": "^6.0.1",
     "yargs": "^17.7.2"

diff --git a/packages/codemods/package.json b/packages/codemods/package.json
@@ -17,17 +17,17 @@
     "chalk": "^4.1.2",
     "commander": "^12.1.0",
     "cross-spawn": "^7.0.3",
-    "jscodeshift": "^17.0.0",
+    "jscodeshift": "^17.1.1",
     "prompts": "^2.4.2",
     "typescript": "^5.6.3"
   },
   "devDependencies": {
-    "@swc/core": "^1.7.36",
-    "@swc/jest": "^0.2.36",
+    "@swc/core": "^1.8.0",
+    "@swc/jest": "^0.2.37",
     "@types/cross-spawn": "^6.0.6",
-    "@types/jest": "^29.5.13",
+    "@types/jest": "^29.5.14",
     "@types/jscodeshift": "^0.12.0",
-    "@types/node": "^22.7.7",
+    "@types/node": "^22.8.7",
     "@types/prompts": "^2.4.9",
     "jest": "^29.7.0",
     "ts-node": "^10.9.2"

diff --git a/packages/codemods/src/transforms/v7/__testfixtures__/cell-button/basic.input.tsx b/packages/codemods/src/transforms/v7/__testfixtures__/cell-button/basic.input.tsx
@@ -33,6 +33,11 @@ const App = () => {
       <CellButton centered>
         Создать что-нибудь
       </CellButton>
+
+      {/* rename subhead -> overtitle */}
+      <CellButton centered subhead={"Subhead"}>
+        Создать что-нибудь
+      </CellButton>
     </React.Fragment>
   );
 };
diff --git a/packages/codemods/src/transforms/v7/__testfixtures__/cell/basic.input.tsx b/packages/codemods/src/transforms/v7/__testfixtures__/cell/basic.input.tsx
@@ -19,6 +19,15 @@ const App = () => {
       >
         Геолокация
       </Cell>
+
+      {/* rename subhead -> overtitle */}
+      <Cell
+        subhead={"Subhead"}
+        onClick={() => {}}
+        indicator="При использовании"
+      >
+        Геолокация
+      </Cell>
     </React.Fragment>
   );
 };
diff --git a/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx b/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx
@@ -12,16 +12,15 @@ const App = () => {
   return (
     <React.Fragment>
       {/* Проверка изменения size */}
-      <Header mode="primary" multiline size="large">
+      <Header multiline size="large">
         Кто может писать мне личные сообщения
       </Header>
-      <Header mode="secondary" multiline size="regular">
+      <Header multiline size="regular">
         Кто может писать мне личные сообщения
       </Header>
 
       {/* Проверка замены aside на after */}
       <Header
-        mode="primary"
         subtitle="SOHN — Conrad"
         subtitleComponent="h3"
         aside={
@@ -32,11 +31,49 @@ const App = () => {
         }
       />
       <Header
-        mode="primary"
         subtitle="SOHN — Conrad"
         subtitleComponent="h3"
         aside={aside}
       />
+
+      {/* Проверка удаления mode */}
+      {/* замена Large Primary на xl */}
+      <Header
+        mode="primary"
+        size="large"
+        subtitle="SOHN — Conrad"
+      />
+
+      {/* замена Large tertiary на m */}
+      <Header
+        mode="tertiary"
+        size="large"
+        subtitle="SOHN — Conrad"
+      />
+      {/* замена Regular tertiary на m */}
+      <Header
+        mode="tertiary"
+        size="regular"
+        subtitle="SOHN — Conrad"
+      />
+      {/* замена Regular primary на m */}
+      <Header
+        mode="primary"
+        size="regular"
+        subtitle="SOHN — Conrad"
+      />
+      {/* замена Large secondary на m */}
+      <Header
+        mode="secondary"
+        size="large"
+        subtitle="SOHN — Conrad"
+      />
+      {/* замена Regular secondary на s */}
+      <Header
+        mode="secondary"
+        size="regular"
+        subtitle="SOHN — Conrad"
+      />
     </React.Fragment>
   );
 };
diff --git a/packages/codemods/src/transforms/v7/__testfixtures__/simple-cell/basic.input.tsx b/packages/codemods/src/transforms/v7/__testfixtures__/simple-cell/basic.input.tsx
@@ -19,6 +19,16 @@ const App = () => {
       >
         Геолокация
       </SimpleCell>
+
+
+      {/* rename subhead -> overtitle */}
+      <SimpleCell
+        onClick={() => {}}
+        subhead={"Subhead"}
+        indicator="При использовании"
+      >
+        Геолокация
+      </SimpleCell>
     </React.Fragment>
   );
 };
diff --git a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/cell-button.ts.snap b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/cell-button.ts.snap
@@ -31,6 +31,10 @@ const App = () => {
       <CellButton centered>
         Создать что-нибудь
       </CellButton>
+      {/* rename subhead -> overtitle */}
+      <CellButton centered overTitle={"Subhead"}>
+        Создать что-нибудь
+      </CellButton>
     </React.Fragment>)
   );
 };"

diff --git a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/cell.ts.snap b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/cell.ts.snap
@@ -21,6 +21,14 @@ const App = () => {
       >
         Геолокация
       </Cell>
+      {/* rename subhead -> overtitle */}
+      <Cell
+        overTitle={"Subhead"}
+        onClick={() => {}}
+        indicator="При использовании"
+      >
+        Геолокация
+      </Cell>
     </React.Fragment>)
   );
 };"

diff --git a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/form-item.ts.snap b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/form-item.ts.snap
@@ -23,7 +23,7 @@ const App = () => {
       </FormItem>
       {/* test 2: should find TopLabel inside topNode prop */}
       <FormItem
-        topNode={
+        top={
           <FormItem.Top>
             <FormItem.TopLabel htmlFor="about">Дополнительная информация</FormItem.TopLabel>
             <FormItem.TopAside>0/100</FormItem.TopAside>

diff --git a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap
@@ -15,15 +15,14 @@ const App = () => {
   return (
     (<React.Fragment>
       {/* Проверка изменения size */}
-      <Header mode="primary" multiline size="l">
+      <Header multiline size="l">
         Кто может писать мне личные сообщения
       </Header>
-      <Header mode="secondary" multiline size="m">
+      <Header multiline size="m">
         Кто может писать мне личные сообщения
       </Header>
       {/* Проверка замены aside на after */}
       <Header
-        mode="primary"
         subtitle="SOHN — Conrad"
         subtitleComponent="h3"
         after={
@@ -34,11 +33,23 @@ const App = () => {
         }
       />
       <Header
-        mode="primary"
         subtitle="SOHN — Conrad"
         subtitleComponent="h3"
         after={aside}
       />
+      {/* Проверка удаления mode */}
+      {/* замена Large Primary на xl */}
+      <Header size="xl" subtitle="SOHN — Conrad" />
+      {/* замена Large tertiary на m */}
+      <Header size="m" subtitle="SOHN — Conrad" />
+      {/* замена Regular tertiary на m */}
+      <Header size="m" subtitle="SOHN — Conrad" />
+      {/* замена Regular primary на m */}
+      <Header size="m" subtitle="SOHN — Conrad" />
+      {/* замена Large secondary на m */}
+      <Header size="s" subtitle="SOHN — Conrad" />
+      {/* замена Regular secondary на s */}
+      <Header size="s" subtitle="SOHN — Conrad" />
     </React.Fragment>)
   );
 };"

diff --git a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/simple-cell.ts.snap b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/simple-cell.ts.snap
@@ -21,6 +21,14 @@ const App = () => {
       >
         Геолокация
       </SimpleCell>
+      {/* rename subhead -> overtitle */}
+      <SimpleCell
+        onClick={() => {}}
+        overTitle={"Subhead"}
+        indicator="При использовании"
+      >
+        Геолокация
+      </SimpleCell>
     </React.Fragment>)
   );
 };"