blue-react 9.1.4 → 9.1.6

package/dist/style.scss

@@ -1,5 +1,5 @@
 /*!
- * Blue React v9.1.4-alpha2 (https://bruegmann.github.io/blue-react)
+ * Blue React v9.1.6-alpha2 (https://bruegmann.github.io/blue-react)
  * Licensed under GNU General Public License v3.0 (https://github.com/bruegmann/blue-react/blob/master/LICENSE).
 */
 

package/dist/styles/_tooltips.scss

@@ -53,16 +53,13 @@
         text-align: center;
 
         min-width: 3em;
-        max-width: 21em;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
+        max-width: var(--bs-tooltip-max-width, 21em);
 
-        padding: 1ch 1.5ch;
-        border-radius: 0.3em;
+        padding: var(--bs-tooltip-padding-y, 1ch) var(--bs-tooltip-padding-x, 1.5ch);
+        border-radius: var(--bs-tooltip-border-radius, 0.3em);
         box-shadow: 0 1em 2em -0.5em rgba(0, 0, 0, 0.35);
-        background: #353539;
-        color: #fff;
+        background: var(--bs-tooltip-bg, #353539);
+        color: var(--bs-tooltip-color, #fff);
         z-index: 1000;
     }
     // show the [data-tooltip]
@@ -76,7 +73,7 @@
     &::before {
         bottom: 100%;
         border-bottom-width: 0;
-        border-top-color: #353539;
+        border-top-color: var(--bs-tooltip-bg, #353539);
     }
     &::after {
         bottom: calc(100% + 5px);
@@ -92,7 +89,7 @@
     &::before {
         top: 100%;
         border-top-width: 0;
-        border-bottom-color: #353539;
+        border-bottom-color: var(--bs-tooltip-bg, #353539);
     }
     &::after {
         top: calc(100% + 5px);
@@ -129,7 +126,7 @@
     &::before {
         top: 50%;
         border-right-width: 0;
-        border-left-color: #353539;
+        border-left-color: var(--bs-tooltip-bg, #353539);
         left: calc(0em - 5px);
         transform: translate(0.5em, -50%);
     }
@@ -144,7 +141,7 @@
     &::before {
         top: 50%;
         border-left-width: 0;
-        border-right-color: #353539;
+        border-right-color: var(--bs-tooltip-bg, #353539);
         right: calc(0em - 5px);
         transform: translate(-0.5em, -50%);
     }

package/dist/styles/mixins/_sidebar.scss

@@ -12,7 +12,7 @@
         display: flex;
     }
 
-    .blue-menu-item-label {
+    .blue-sidebar .blue-menu-item-label {
         display: inline-block;
     }
     .blue-sidebar {
@@ -38,11 +38,11 @@
         left: $bla-sidebar-width;
     }
 
-    .blue-menu-item-dropdown-caret.blue-caret {
+    .blue-sidebar .blue-menu-item-dropdown-caret.blue-caret {
         display: flex;
     }
 
-    .blue-menu-item-dropdown {
+    .blue-sidebar .blue-menu-item-dropdown {
         .blue-menu-item {
             width: 100%;
         }

package/dist/types/components/Caret.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import { CSSProperties } from "react";
 export interface CaretProps {
     /**
      * Indicates if open or not.
@@ -9,8 +9,9 @@ export interface CaretProps {
      */
     mirrored?: boolean;
     className?: string;
+    style?: CSSProperties;
 }
 /**
  * Caret icon component.
  */
-export default function Caret({ open, mirrored, className }: CaretProps): JSX.Element;
+export default function Caret({ open, mirrored, className, style }: CaretProps): JSX.Element;

package/dist/types/components/MenuItem.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { CSSProperties } from "react";
 export interface MenuItemProps {
     /**
      * Sets `to` prop, e.g. when you use the `NavLink` component from React Router.
@@ -34,6 +34,14 @@ export interface MenuItemProps {
      * Addition to class name of label wrapper element
      */
     labelClassName?: string;
+    /**
+     * Addition to class name of caret
+     */
+    caretClassName?: string;
+    /**
+     * Addition to style of caret
+     */
+    caretStyle?: CSSProperties;
     /**
      * Should be set as active.
      */
@@ -50,6 +58,10 @@ export interface MenuItemProps {
      * Extends class name of the dropdown menu.
      */
     dropdownClassName?: string;
+    /**
+     * Extends style of the dropdown menu.
+     */
+    dropdownStyle?: CSSProperties;
     /**
      * Set children to create a nested `MenuItem` as a dropdown.
      */

package/dist/types/components/Outside.d.ts

@@ -1,4 +1,4 @@
-import { MutableRefObject } from "react";
+import { CSSProperties, MutableRefObject } from "react";
 /**
  * Hook that alerts clicks outside of the passed ref
  */
@@ -7,8 +7,9 @@ export interface OutsideProps {
     children: any;
     className?: string;
     onClickOutside?: (event: MouseEvent) => void;
+    style?: CSSProperties;
 }
 /**
  * Component that fires an event if you click outside of it
  */
-export default function Outside({ children, className, onClickOutside }: OutsideProps): JSX.Element;
+export default function Outside({ children, className, onClickOutside, style }: OutsideProps): JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "blue-react",
-    "version": "9.1.4",
+    "version": "9.1.6",
     "description": "Blue React Components",
     "license": "LGPL-3.0-or-later",
     "main": "index.js",