@redocly/theme 0.81.2-rc.2 → 0.82.2-rc.1

package/lib/components/CodeBlock/variables.js

@@ -36,7 +36,7 @@ exports.code = (0, styled_components_1.css) `
   --code-block-bg-color: var(--layer-color); // @presenter Color
   --code-block-padding: var(--spacing-xs) 0 var(--spacing-xs) var(--spacing-sm);
   --code-block-margin: 0;
-  --code-block-max-height: calc(100vh - 260px); // Where 260 is combined value of navbar, code block heading, controls height and paddings
+  --code-block-max-height: calc(100vh - 300px); // Where 300 is combined value of navbar, code block heading, controls height and paddings
   --code-block-word-break: initial;
 
   /**

package/lib/components/Dropdown/Dropdown.js

@@ -53,7 +53,7 @@ function Dropdown({ children, className, active, trigger, triggerEvent = 'click'
     };
     (0, hooks_1.useOutsideClick)(dropdownRef, handleClose);
     const triggerChild = react_1.default.Children.only(trigger);
-    const dropdownTrigger = (0, react_1.cloneElement)(triggerChild, Object.assign(Object.assign({ onClick: triggerEvent === 'click' ? handleToggle : undefined, icon: withArrow ? isOpen ? react_1.default.createElement(ChevronUpIcon_1.ChevronUpIcon, null) : react_1.default.createElement(ChevronDownIcon_1.ChevronDownIcon, null) : undefined, iconPosition: withArrow ? 'right' : undefined, tabIndex: 0 }, triggerChild.props), { onKeyDown: triggerEvent === 'click' ? handleKeyDown : undefined }));
+    const dropdownTrigger = (0, react_1.cloneElement)(triggerChild, Object.assign(Object.assign(Object.assign(Object.assign({ onClick: triggerEvent === 'click' ? handleToggle : undefined, icon: withArrow ? isOpen ? react_1.default.createElement(ChevronUpIcon_1.ChevronUpIcon, null) : react_1.default.createElement(ChevronDownIcon_1.ChevronDownIcon, null) : undefined }, (withArrow ? { iconPosition: 'right' } : {})), { tabIndex: 0 }), triggerChild.props), { onKeyDown: triggerEvent === 'click' ? handleKeyDown : undefined }));
     return (react_1.default.createElement(DropdownWrapper, Object.assign({ "data-component-name": "Dropdown/Dropdown", "data-testid": "dropdown" }, dataAttributes, { className: className, ref: dropdownRef, onPointerEnter: triggerEvent === 'hover' ? handleOpen : undefined, onPointerLeave: triggerEvent === 'hover' ? handleClose : undefined }),
         dropdownTrigger,
         isOpen && (react_1.default.createElement(ChildrenWrapper, { placement: placement, alignment: alignment, onClick: closeOnClick ? handleClose : undefined }, children))));

package/lib/core/styles/global.js

@@ -956,26 +956,18 @@ const pages = (0, styled_components_1.css) `
   // @tokens End
 `;
 const error = (0, styled_components_1.css) `
-  --error-bubble-padding: var(--spacing-md);
-  --error-bubble-bottom: var(--spacing-xl);
-  --error-bubble-left: var(--spacing-xl);
-  --error-bubble-max-width: 20%;
-  --error-bubble-mobile-max-width: 50%;
-  --error-bubble-text-overflow: ellipsis;
-  --error-bubble-gap: var(--spacing-base);
+  --error-bubble-padding: var(--spacing-sm);
+  --error-bubble-gap: var(--spacing-xxs);
   --error-bubble-font-family: var(--font-family-base);
+  --error-bubble-font-size: var(--font-size-base);
   --error-bubble-z-index: var(--z-index-popover);
+  --error-bubble-bg-color: var(--color-raspberry-1);
+  --error-bubble-bg-color-hover: var(--color-raspberry-2);
+  --error-bubble-bg-color-pressed: var(--color-raspberry-3);
+  --error-bubble-content-color: var(--color-raspberry-6);
+  --error-bubble-content-color-hover: var(--color-raspberry-6);
+  --error-bubble-content-color-pressed: var(--color-raspberry-6);
 
-  --error-card-border-radius: calc(var(--spacing-xxs) * 1.5);
-  --error-card-bg-color: var(--bg-color-raised);
-  --error-card-padding: var(--spacing-xs) var(--spacing-base);
-  --error-card-text-color: var(--text-color-primary);
-  --error-card-font-size: var(--font-size-base);
-  --error-card-font-style: normal;
-  --error-card-font-weight: var(--font-weight-regular);
-  --error-card-line-height: var(--line-height-base);
-  --error-card-box-shadow: var(--bg-raised-shadow);
-  --error-card-icon-margin: 0 var(--spacing-xs) 0 0;
 
   --detailed-error-overlay-bg-color: #4f4f4f;
   --detailed-error-overlay-opacity: 0.9;

package/lib/core/types/search.d.ts

@@ -1,3 +1,4 @@
+import type { REDOCLY_ROUTE_RBAC } from '@redocly/config';
 import type { ProductConfig } from '../../config';
 export type OperationParameter = {
     name: string | string[];
@@ -22,4 +23,8 @@ export type SearchDocument = {
     'redocly::teams-rbac'?: {
         [x: string]: string;
     };
+    [REDOCLY_ROUTE_RBAC]?: {
+        slug?: string;
+        fsPath?: string;
+    };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.81.2-rc.2",
+  "version": "0.82.2-rc.1",
   "description": "Shared UI components lib",
   "keywords": [
     "theme",
@@ -98,7 +98,7 @@
     "timeago.js": "^4.0.2",
     "i18next": "^22.4.12",
     "nprogress": "^0.2.0",
-    "@redocly/config": "0.4.0"
+    "@redocly/config": "0.5.0"
   },
   "scripts": {
     "start": "npm-run-all --parallel storybook storybook:tokens:watch",

package/src/components/CodeBlock/variables.ts

@@ -34,7 +34,7 @@ export const code = css`
   --code-block-bg-color: var(--layer-color); // @presenter Color
   --code-block-padding: var(--spacing-xs) 0 var(--spacing-xs) var(--spacing-sm);
   --code-block-margin: 0;
-  --code-block-max-height: calc(100vh - 260px); // Where 260 is combined value of navbar, code block heading, controls height and paddings
+  --code-block-max-height: calc(100vh - 300px); // Where 300 is combined value of navbar, code block heading, controls height and paddings
   --code-block-word-break: initial;
 
   /**

package/src/components/Dropdown/Dropdown.tsx

@@ -63,7 +63,7 @@ export function Dropdown({
   const dropdownTrigger = cloneElement(triggerChild, {
     onClick: triggerEvent === 'click' ? handleToggle : undefined,
     icon: withArrow ? isOpen ? <ChevronUpIcon /> : <ChevronDownIcon /> : undefined,
-    iconPosition: withArrow ? 'right' : undefined,
+    ...(withArrow ? { iconPosition: 'right' } : {}),
     tabIndex: 0,
     ...triggerChild.props,
     onKeyDown: triggerEvent === 'click' ? handleKeyDown : undefined,

package/src/core/styles/global.ts

@@ -970,26 +970,18 @@ const pages = css`
 `;
 
 const error = css`
-  --error-bubble-padding: var(--spacing-md);
-  --error-bubble-bottom: var(--spacing-xl);
-  --error-bubble-left: var(--spacing-xl);
-  --error-bubble-max-width: 20%;
-  --error-bubble-mobile-max-width: 50%;
-  --error-bubble-text-overflow: ellipsis;
-  --error-bubble-gap: var(--spacing-base);
+  --error-bubble-padding: var(--spacing-sm);
+  --error-bubble-gap: var(--spacing-xxs);
   --error-bubble-font-family: var(--font-family-base);
+  --error-bubble-font-size: var(--font-size-base);
   --error-bubble-z-index: var(--z-index-popover);
+  --error-bubble-bg-color: var(--color-raspberry-1);
+  --error-bubble-bg-color-hover: var(--color-raspberry-2);
+  --error-bubble-bg-color-pressed: var(--color-raspberry-3);
+  --error-bubble-content-color: var(--color-raspberry-6);
+  --error-bubble-content-color-hover: var(--color-raspberry-6);
+  --error-bubble-content-color-pressed: var(--color-raspberry-6);
 
-  --error-card-border-radius: calc(var(--spacing-xxs) * 1.5);
-  --error-card-bg-color: var(--bg-color-raised);
-  --error-card-padding: var(--spacing-xs) var(--spacing-base);
-  --error-card-text-color: var(--text-color-primary);
-  --error-card-font-size: var(--font-size-base);
-  --error-card-font-style: normal;
-  --error-card-font-weight: var(--font-weight-regular);
-  --error-card-line-height: var(--line-height-base);
-  --error-card-box-shadow: var(--bg-raised-shadow);
-  --error-card-icon-margin: 0 var(--spacing-xs) 0 0;
 
   --detailed-error-overlay-bg-color: #4f4f4f;
   --detailed-error-overlay-opacity: 0.9;

package/src/core/types/search.ts

@@ -1,3 +1,4 @@
+import type { REDOCLY_ROUTE_RBAC } from '@redocly/config';
 import type { ProductConfig } from '@redocly/theme/config';
 
 export type OperationParameter = {
@@ -22,4 +23,5 @@ export type SearchDocument = {
   isDefaultVersion?: boolean;
   product?: ProductConfig;
   'redocly::teams-rbac'?: { [x: string]: string };
+  [REDOCLY_ROUTE_RBAC]?: { slug?: string; fsPath?: string };
 };