Merge pull request #12 from fortanix/fix/add-components-missing-export

Fix/add components missing export
fortanix · Oct 29, 2024 · 42da881 · 42da881
2 parents a52217f + 2097289
commit 42da881
Show file tree

Hide file tree

Showing 11 changed files with 69 additions and 24 deletions.
diff --git a/.idea/.gitignore b/.idea/.gitignore
diff --git a/.idea/baklava.iml b/.idea/baklava.iml
diff --git a/.idea/material_theme_project_new.xml b/.idea/material_theme_project_new.xml
diff --git a/.idea/modules.xml b/.idea/modules.xml
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
diff --git a/app/lib.ts b/app/lib.ts
@@ -29,12 +29,14 @@ export { Spinner } from '../src/components/graphics/Spinner/Spinner.tsx';
 
 export { PropertyList } from '../src/components/lists/PropertyList/PropertyList.tsx';
 
-export { Tabs } from '../src/components/navigations/Tabs/Tabs.tsx';
+export { Tab, Tabs } from '../src/components/navigations/Tabs/Tabs.tsx';
+export { Stepper } from '../src/components/navigations/Stepper/Stepper.tsx';
 
 export { DropdownMenu } from '../src/components/overlays/DropdownMenu/DropdownMenu.tsx';
 export { Modal } from '../src/components/overlays/Modal/Modal.tsx';
 export { type ToastContent, ToastContainer, ToastMessage } from '../src/components/overlays/Toast/Toast.tsx';
 export { Tooltip } from '../src/components/overlays/Tooltip/Tooltip.tsx';
+export { TooltipProvider } from '../src/components/overlays/Tooltip/TooltipProvider.tsx';
 
 // Layouts
 

diff --git a/src/components/actions/Button/Button.module.scss b/src/components/actions/Button/Button.module.scss
@@ -32,11 +32,6 @@
     /* letter-spacing: 0.1ch; */
     text-transform: uppercase;
 
-    @media (prefers-reduced-motion: no-preference) {
-      transition: none 150ms ease-in-out;
-      transition-property: border, background, color;
-    }
-
     /* Tertiary (default) */
     border-color: transparent;
     background-color: transparent;
@@ -72,6 +67,11 @@
       --bk-button-color-contrast: #{bk.$theme-button-primary-text-non-active};
       cursor: not-allowed;
     }
+
+    @media (prefers-reduced-motion: no-preference) {
+      transition: none 150ms ease-in-out;
+      transition-property: border, background, color;
+    }
 
     /* & > :global(.icon) { font-size: 1.2rem; } */
 

diff --git a/src/components/overlays/Modal/Modal.module.scss b/src/components/overlays/Modal/Modal.module.scss
@@ -87,6 +87,15 @@
       flex: 1; /* Make sure we cover all available space */
       overflow: auto;
     }
+
+    transition:
+      opacity 1ms ease-out,
+      scale 1ms ease-out,
+      overlay 1ms ease-out allow-discrete,
+      display 1ms ease-out allow-discrete;
+    opacity: 0;
+    scale: 0.98 0.98;
+    transition-duration: 200ms; /* Exit transition duration */
 
     /* Variant: slide out */
     --modal-slide-out-inset: var(--bk-sizing-3);
@@ -129,15 +138,6 @@
 
     /* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog#animating_dialogs */
 
-    opacity: 0;
-    scale: 0.98 0.98;
-    transition:
-      opacity 1ms ease-out,
-      scale 1ms ease-out,
-      overlay 1ms ease-out allow-discrete,
-      display 1ms ease-out allow-discrete;
-    transition-duration: 200ms; /* Exit transition duration */
-
     &:modal {
       display: flex;
       opacity: 1;

diff --git a/src/components/overlays/Toast/Toast.stories.tsx b/src/components/overlays/Toast/Toast.stories.tsx
@@ -12,11 +12,11 @@ import { Button } from '../../actions/Button/Button.tsx';
 import { notify, CopyActionButton, ToastMessage, ToastContainer } from './Toast.tsx';
 
 
-type ToastArg = React.ComponentProps<typeof ToastMessage>;
+type ToastArg = React.ComponentProps<typeof ToastContainer>;
 type Story = StoryObj<ToastArg>;
 
 export default {
-  component: ToastMessage,
+  component: ToastContainer,
   parameters: {
     layout: 'centered',
   },

diff --git a/src/layouts/AppLayout/AppLayout.module.scss b/src/layouts/AppLayout/AppLayout.module.scss
@@ -19,12 +19,7 @@
 
     --bk-app-layout-sidebar-width-open: 220px;
     --bk-app-layout-sidebar-width: var(--bk-app-layout-sidebar-width-open);
-
-    //&:has([slot='sidebar']:hover) { --bk-app-layout-sidebar-width: 80px; } // TEST
-    @media (prefers-reduced-motion: no-preference) {
-      transition: grid 300ms;
-    }
-
+
     /* Note: do not use vw/vh, because we may want to show the layout in a container (e.g. story) */
     min-width: 100cqw;
     min-height: 100cqh;
@@ -106,5 +101,10 @@
         'footer' max-content
         / 1fr;
     }
+
+    //&:has([slot='sidebar']:hover) { --bk-app-layout-sidebar-width: 80px; } // TEST
+    @media (prefers-reduced-motion: no-preference) {
+      transition: grid 300ms;
+    }
   }
 }
diff --git a/src/styling/variables.scss b/src/styling/variables.scss
@@ -47,7 +47,7 @@ $color-blackberry-100: #777392 !default;
 $color-blackberry-200: #5f5a7c !default;
 $color-blackberry-300: #484266 !default;
 $color-blackberry-400: #332b50 !default;
-$color-blackberry-500: #2d294b !default;
+$color-blackberry-500: #39355c !default;
 $color-blackberry-600: #262645 !default;
 $color-blackberry-700: #202440 !default;
 $color-blackberry-800: #1a1c37 !default;