feat(plasma-icons-native): Add all plasma icons

.github/workflows/publish-alpha.yml

@@ -125,6 +125,17 @@ jobs:
       - name: Publish themes packages
         run: npx lerna exec -- npm publish --tag alpha
 
+      # Подготовка и публикация пакетов с иконками
+
+      - name: Update lerna config with icons mode
+        run: MODE="icons" npm run set-lerna-packages
+
+      - name: Update packages version
+        run: npm run bump-version -- --conventional-prerelease --preid "alpha-$(git rev-parse --short HEAD)"
+
+      - name: Publish icons packages
+        run: npx lerna exec -- npm publish --tag alpha
+
       # Шаг отображающий актаульное состояние package файлов
 
       - name: Show diff

.github/workflows/publish-dev.yml

@@ -125,6 +125,17 @@ jobs:
       - name: Publish themes packages
         run: npx lerna exec -- npm publish --tag dev
 
+      # Подготовка и публикация пакетов с иконками
+
+      - name: Update lerna config with icons mode
+        run: MODE="icons" npm run set-lerna-packages
+
+      - name: Update packages version
+        run: npm run bump-version -- --conventional-prerelease --preid "dev-$(git rev-parse --short HEAD)"
+
+      - name: Publish icons packages
+        run: npx lerna exec -- npm publish --tag dev
+
       # Шаг отображающий актаульное состояние package файлов
 
       - name: Show diff

.github/workflows/publish-latest.yml

@@ -141,6 +141,17 @@ jobs:
       - name: Publish themes packages
         run: npx lerna exec -- npm publish
 
+      # Подготовка и публикация пакетов с иконками
+
+      - name: Update lerna config with icons mode
+        run: MODE="icons" npm run set-lerna-packages
+
+      - name: Update packages version
+        run: npm run bump-version
+
+      - name: Publish icons packages
+        run: npx lerna exec -- npm publish
+
       # Мастеровый шаг
       - name: Update lerna config with all mode
         run: MODE="all" npm run set-lerna-packages

README.md

@@ -20,7 +20,7 @@
 
 ### Директория `packages`
 
-Содержит утилитарные пакеты, необходимые для корректной работы дизайн системы.
+Содержит утилитарные пакеты, необходимые для корректной работы дизайн системы, а также набор иконок всех размеров. 
 
 ### Директория `themes`
 

core/core-components/platforms/mobile/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.8.0",
+  "version": "0.9.0",
   "name": "@salutejs/core-components",
   "description": "Core-components package for native platform on mobile.",
   "author": "Salute Frontend Team <[email protected]>",

core/core-components/platforms/tv/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.8.0",
+  "version": "0.9.0",
   "name": "@salutejs/core-components",
   "description": "Core-components package native platform on tv.",
   "author": "Salute Frontend Team <[email protected]>",

core/core-themes/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.8.0",
+  "version": "0.9.0",
   "name": "@salutejs/core-themes-native",
   "description": "Core-themes package for native platform.",
   "author": "Salute Frontend Team <[email protected]>",

libraries/plasma-b2c/platforms/mobile/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.8.0",
+  "version": "0.9.0",
   "name": "@salutejs/plasma-b2c",
   "description": "Plasma-b2c components library for native platform on mobile.",
   "author": "Salute Frontend Team <[email protected]>",
@@ -32,8 +32,8 @@
   "dependencies": {
     "@expo/metro-runtime": "^3.2.1",
     "@expo/vector-icons": "^14.0.0",
-    "@salutejs/core-components": "0.8.0",
-    "@salutejs/plasma-themes-native": "0.8.0",
+    "@salutejs/core-components": "0.9.0",
+    "@salutejs/plasma-themes-native": "0.9.0",
     "@types/react": "~18.2.45",
     "install": "^0.13.0",
     "react": "^18.2.0",
@@ -50,6 +50,7 @@
     "@react-native-community/datetimepicker": "8.0.1",
     "@react-native-community/slider": "4.5.2",
     "@react-native-tvos/config-tv": "^0.0.10",
+    "@salutejs/plasma-icons-native": "0.1.0",
     "@storybook/addon-ondevice-actions": "^7.6.16",
     "@storybook/addon-ondevice-controls": "^7.6.16",
     "@storybook/addon-ondevice-notes": "^7.6.19",

libraries/plasma-b2c/platforms/tv/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.8.0",
+  "version": "0.9.0",
   "name": "@salutejs/plasma-b2c",
   "description": "Plasma-b2c components library for native platform on tv.",
   "author": "Salute Frontend Team <[email protected]>",
@@ -38,8 +38,8 @@
     }
   },
   "dependencies": {
-    "@salutejs/core-components": "0.8.0",
-    "@salutejs/plasma-themes-native": "0.8.0",
+    "@salutejs/core-components": "0.9.0",
+    "@salutejs/plasma-themes-native": "0.9.0",
     "@types/react": "18.2.45",
     "install": "^0.13.0",
     "react": "^18.2.0",
@@ -56,6 +56,7 @@
     "@react-native-community/datetimepicker": "8.0.1",
     "@react-native-community/slider": "4.5.2",
     "@react-native-tvos/config-tv": "^0.0.10",
+    "@salutejs/plasma-icons-native": "0.1.0",
     "@storybook/addon-ondevice-actions": "^7.6.16",
     "@storybook/addon-ondevice-controls": "^7.6.16",
     "@storybook/addon-ondevice-notes": "^7.6.19",

libraries/plasma-b2c/src/components/Button/Button.stories.tsx

@@ -1,6 +1,6 @@
 import type { ComponentProps } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
-import { Text } from 'react-native';
+import { IconPlasma } from '@salutejs/plasma-icons-native';
 
 import { Button } from './Button';
 
@@ -110,8 +110,8 @@ const StoryDefault = (props: StoryButtonProps) => {
         <Button
             {...props}
             onPress={onPress}
-            contentLeft={props.showLeftContent && <Text style={{ color: 'red' }}>Left Content</Text>}
-            contentRight={props.showRightContent && <Text style={{ color: 'green' }}>Right Content</Text>}
+            contentLeft={props.showLeftContent && <IconPlasma />}
+            contentRight={props.showRightContent && <IconPlasma />}
         />
     );
 };

libraries/plasma-b2c/src/components/Cell/Cell.stories.tsx

@@ -1,7 +1,7 @@
 import { View, Text } from 'react-native';
 import type { ComponentProps } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
-import { Path, Svg } from 'react-native-svg';
+import { IconPlasma, IconShazam } from '@salutejs/plasma-icons-native';
 
 import { Checkbox } from '../Checkbox';
 import { Radiobox } from '../Radiobox';
@@ -79,38 +79,18 @@ const meta: Meta<CellProps> = {
 
 export default meta;
 
-interface IconSvgProps {
-    size?: number;
-    color?: string;
-}
-
-const PlasmaIcon: React.FC<IconSvgProps> = ({ size = 24, color }) => (
-    <Svg viewBox="0 0 24 24" fill="none" width={size} height={size} color={color}>
-        <Path
-            fillRule="evenodd"
-            clipRule="evenodd"
-            d="M12 3.5C7.30558 3.5 3.5 7.30558 3.5 12C3.5 14.0957 4.25846 16.0143 5.51587 17.4963C5.23619 16.745 5.08333 15.932 5.08333 15.0833C5.08333 11.2634 8.18003 8.16667 12 8.16667C15.82 8.16667 18.9167 11.2634 18.9167 15.0833C18.9167 15.932 18.7638 16.745 18.4841 17.4963C19.7415 16.0143 20.5 14.0957 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5ZM15.7427 18.999C16.7742 18.0128 17.4167 16.6231 17.4167 15.0833C17.4167 12.0918 14.9915 9.66667 12 9.66667C9.00846 9.66667 6.58333 12.0918 6.58333 15.0833C6.58333 16.6231 7.2258 18.0128 8.25728 18.999C8.19795 18.731 8.16667 18.4525 8.16667 18.1667C8.16667 16.0496 9.88291 14.3333 12 14.3333C14.1171 14.3333 15.8333 16.0496 15.8333 18.1667C15.8333 18.4525 15.802 18.731 15.7427 18.999ZM12 20.5C13.2887 20.5 14.3333 19.4553 14.3333 18.1667C14.3333 16.878 13.2887 15.8333 12 15.8333C10.7113 15.8333 9.66667 16.878 9.66667 18.1667C9.66667 19.4553 10.7113 20.5 12 20.5ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z"
-            fill="currentColor"
-        />
-    </Svg>
-);
-
-const ContentLeft = () => (
-    <View style={{ backgroundColor: 'red', opacity: 0.25, width: 22, height: 22, borderRadius: 50 }} />
-);
-
 const StoryDefault = (props: StoryCellProps) => {
     return (
         <View style={{ gap: 20 }}>
-            <Cell contentLeft={<ContentLeft />} contentRight={<PlasmaIcon />} {...props} />
-            <Cell contentLeft={<ContentLeft />} {...props} />
-            <Cell hasDisclosure contentLeft={<ContentLeft />} {...props} />
-            <Cell disclosureText="Disclosure" hasDisclosure contentLeft={<ContentLeft />} {...props} />
-            <Cell contentLeft={<ContentLeft />} contentRight={<Checkbox checked />} {...props} />
-            <Cell contentLeft={<ContentLeft />} contentRight={<Radiobox checked />} {...props} />
-            <Cell contentLeft={<ContentLeft />} contentRight={<Switch checked />} {...props} />
-            <Cell contentLeft={<ContentLeft />} contentRight={<Text>Plain text</Text>} {...props} />
-            <Cell contentLeft={<ContentLeft />} contentRight={<BodyM>BodyM</BodyM>} {...props} />
+            <Cell contentLeft={<IconShazam />} contentRight={<IconPlasma />} {...props} />
+            <Cell contentLeft={<IconShazam />} {...props} />
+            <Cell hasDisclosure contentLeft={<IconShazam />} {...props} />
+            <Cell disclosureText="Disclosure" hasDisclosure contentLeft={<IconShazam />} {...props} />
+            <Cell contentLeft={<IconShazam />} contentRight={<Checkbox checked />} {...props} />
+            <Cell contentLeft={<IconShazam />} contentRight={<Radiobox checked />} {...props} />
+            <Cell contentLeft={<IconShazam />} contentRight={<Switch checked />} {...props} />
+            <Cell contentLeft={<IconShazam />} contentRight={<Text>Plain text</Text>} {...props} />
+            <Cell contentLeft={<IconShazam />} contentRight={<BodyM>BodyM</BodyM>} {...props} />
         </View>
     );
 };