feat(info): add notice appearance

cft-group · Apr 21, 2021 · d1578c4 · d1578c4
1 parent 4903871
commit d1578c4
Show file tree

Hide file tree

Showing 5 changed files with 34 additions and 15 deletions.
diff --git a/package.json b/package.json
@@ -19,8 +19,8 @@
     }
   },
   "dependencies": {
-    "@elephas/core": "^1.7.0",
-    "@elephas/layout": "^1.7.0",
+    "@elephas/core": "^1.10.0",
+    "@elephas/layout": "^1.10.0",
     "mime": "^2.4.6",
     "react": "^16.11.0",
     "react-dom": "^16.11.0"

diff --git a/src/packages/core/src/info/Info.stories.mdx b/src/packages/core/src/info/Info.stories.mdx
@@ -8,6 +8,12 @@ import { Info } from '.';
 
 <Props of={Info} />
 
+<Preview>
+  <Story name="notice">
+    <Info appearance="notice">Заявка зарегистрирована в 15:32.</Info>
+  </Story>
+</Preview>
+
 <Preview>
   <Story name="warning">
     <Info appearance="warning">Для регистрации заявки требуется электронная подпись.</Info>

diff --git a/src/packages/core/src/info/Info.tsx b/src/packages/core/src/info/Info.tsx
@@ -15,23 +15,36 @@ export function Info(props: InfoProps) {
   const infoClassNames = classNames({
     [`${className}`]: className,
     _e_info: true,
+    _e_info_notice: appearance === 'notice',
     _e_info_error: appearance === 'error',
     _e_info_warning: appearance === 'warning',
     '_e_info_fixed-width': fixedWidth,
   });
 
-  const icon = appearance === 'warning'
-    ? (
+  let icon;
+
+  if (appearance === 'warning') {
+    icon = (
       <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
         {/* eslint-disable-next-line max-len */}
         <path fillRule="evenodd" clipRule="evenodd" d="M19.53 20.5037C21.07 20.5037 22.03 18.8337 21.26 17.5037L13.73 4.49375C12.96 3.16375 11.04 3.16375 10.27 4.49375L2.74 17.5037C1.97 18.8337 2.93 20.5037 4.47 20.5037H19.53ZM12 13.5037C11.45 13.5037 11 13.0537 11 12.5037V10.5037C11 9.95375 11.45 9.50375 12 9.50375C12.55 9.50375 13 9.95375 13 10.5037V12.5037C13 13.0537 12.55 13.5037 12 13.5037ZM11 15.5037V17.5037H13V15.5037H11Z" />
       </svg>
-    ) : (
+    );
+  } else if (appearance === 'error') {
+    icon = (
       <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
         {/* eslint-disable-next-line max-len */}
         <path fillRule="evenodd" clipRule="evenodd" d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM12 13C11.45 13 11 12.55 11 12V8C11 7.45 11.45 7 12 7C12.55 7 13 7.45 13 8V12C13 12.55 12.55 13 12 13ZM11 15V17H13V15H11Z" />
       </svg>
     );
+  } else {
+    icon = (
+      <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+        {/* eslint-disable-next-line max-len */}
+        <path fillRule="evenodd" clipRule="evenodd" d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM12 17C11.45 17 11 16.55 11 16V12C11 11.45 11.45 11 12 11C12.55 11 13 11.45 13 12V16C13 16.55 12.55 17 12 17ZM11 9H13V7H11V9Z" />
+      </svg>
+    );
+  }
 
   return (
     <div className={infoClassNames} {...rest}>

diff --git a/src/packages/core/src/info/types.ts b/src/packages/core/src/info/types.ts
@@ -5,7 +5,7 @@ export interface InfoProps extends CommonAttributes {
   /**
    * Visual appearance.
    */
-  appearance: 'warning' | 'error';
+  appearance: 'notice' | 'warning' | 'error';
 
   /**
    * Info contents.

diff --git a/yarn.lock b/yarn.lock
@@ -1299,17 +1299,17 @@
   resolved "https://registry.yarnpkg.com/@commitlint/types/-/types-9.1.2.tgz#d05f66db03e3a3638a654e8badf2deb489eb220d"
   integrity sha512-r3fwVbVH+M8W0qYlBBZFsUwKe6NT5qvz+EmU7sr8VeN1cQ63z+3cfXyTo7WGGEMEgKiT0jboNAK3b1FZp8k9LQ==
 
-"@elephas/core@1.9.0", "@elephas/core@^1.7.0":
-  version "1.9.0"
-  resolved "https://registry.yarnpkg.com/@elephas/core/-/core-1.9.0.tgz#ff48555bc31ab395d94ce66f2f7bf150c300cd50"
-  integrity sha512-HVKDgxzlQFimzl60PawTc1cbxJNWlq1rVapD6krbNXuvBOi9yhfayyjaip+lAQlDvnDiyuzRlucjMr5qwSqFXQ==
+"@elephas/core@1.10.0", "@elephas/core@^1.10.0":
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/@elephas/core/-/core-1.10.0.tgz#8f278e45827e3ba7e6de7a2370090c42144ccabb"
+  integrity sha512-TqmlTpG3LinPPWZSTDIbFjKaX7yTjFEPy626QGp9ovb5/23Ijh2n6edQwgM90msGnG/kKmN371fKsunHzHw7kg==
 
-"@elephas/layout@^1.7.0":
-  version "1.9.0"
-  resolved "https://registry.yarnpkg.com/@elephas/layout/-/layout-1.9.0.tgz#baff85327716a9dfea21f623b36a2dcee4cfe2c8"
-  integrity sha512-JUN7O6SsC3qs3S7lKPH04knfTKlVOCLl8hu+q6tgEOdLk7TILk0/7+sUgmmsdjRnXOjZi7eg8EXrfaxc2t9glg==
+"@elephas/layout@^1.10.0":
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/@elephas/layout/-/layout-1.10.0.tgz#934831a6b73d5b519dfae5f0379d5e8cc5725725"
+  integrity sha512-OmgLAt+ldFLdM+A6MGIAs0GN4AuIGAauVmInz6NC8i320SssurUATnoD3czZ8bVGgpqCaxEDkGlWrv/Q4XV9Dw==
   dependencies:
-    "@elephas/core" "1.9.0"
+    "@elephas/core" "1.10.0"
 
 "@emotion/cache@^10.0.27":
   version "10.0.29"