@redocly/theme 0.9.3 → 0.9.5

package/lib/CopyButton/CopyButton.js

@@ -31,15 +31,19 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CopyButton = void 0;
 const react_1 = __importStar(require("react"));
+const copy_to_clipboard_1 = __importDefault(require("copy-to-clipboard"));
 const Button_1 = require("../Button");
 const CopyButton = ({ text, dataTestId = 'copy-button' }) => {
     const [title, setTitle] = (0, react_1.useState)('Copy');
     function write() {
         return __awaiter(this, void 0, void 0, function* () {
-            yield navigator.clipboard.writeText(text);
+            yield (0, copy_to_clipboard_1.default)(text);
             setTitle('Copied!');
             setTimeout(() => setTitle('Copy'), 1500);
         });

package/lib/ReferenceDocs/DevOnboardingTryItSecurity.js

@@ -88,7 +88,7 @@ function DevOnboardingTryItSecurity(props) {
     React.useEffect(() => {
         sessionStorage.setItem('redocly_onboarding:prevAppId', appId || '');
     }, [appId]);
-    if (!apiId) {
+    if (!apiId || !(userData === null || userData === void 0 ? void 0 : userData.isAuthenticated)) {
         return null;
     }
     const loadAppCredentials = (appId) => {

package/lib/Sidebar/FooterWrapper.js

@@ -11,7 +11,7 @@ exports.FooterWrapper = styled_components_1.default.div.attrs(() => ({
   margin: var(--sidebar-offset-top) 0 var(--sidebar-spacing-unit) var(--sidebar-offset-left);
   padding-top: var(--sidebar-spacing-unit);
   padding-right: var(--sidebar-spacing-unit);
-  border-top: solid 1px #daddde;
+  border-top: solid 1px var(--border-color);
 
   button {
     margin: 0;

package/lib/Sidebar/HeaderWrapper.js

@@ -10,6 +10,6 @@ exports.HeaderWrapper = styled_components_1.default.div.attrs(() => ({
 })) `
   margin: var(--sidebar-offset-top) 0 0 var(--sidebar-offset-left);
   padding-bottom: var(--sidebar-spacing-unit);
-  border-bottom: solid 1px #daddde;
+  border-bottom: solid 1px var(--border-color);
 `;
 //# sourceMappingURL=HeaderWrapper.js.map

package/lib/globalStyle.js

@@ -1889,8 +1889,8 @@ const lastUpdated = (0, styled_components_1.css) `
   --last-updated-line-height: var(--line-height-base);
 `;
 const tile = (0, styled_components_1.css) `
-  --wide-tile-background-color: var(--color-secondary-50);
-  --thin-tile-background-color: var(--color-secondary-50);
+  --wide-tile-background-color: var(--color-secondary-100);
+  --thin-tile-background-color: var(--color-secondary-100);
 `;
 const apiLogsTable = (0, styled_components_1.css) `
  --api-logs-row-hover-background-color: var(--color-secondary-300);

package/lib/ui/darkColors.js

@@ -53,7 +53,7 @@ exports.darkMode = (0, styled_components_1.css) `
   --panel-try-it-nested-body-background-color: #263041;
   --panel-try-it-tabs-active-background-color: #11151d;
   --panel-try-it-tabs-hover-background-color: #141a26;
-  --color-emphasis-100: #0065fb;
+  --color-emphasis-100: #16202e;
   --color-secondary-400: #696969;
   --color-emphasis-700: #fff;
   --color-emphasis-800: #fff;

package/lib/utils/ClipboardService.d.ts

@@ -1,5 +1,5 @@
 export declare class ClipboardService {
     static isSupported(): boolean;
-    static copyCustom(text: string): Promise<void>;
+    static copyCustom(text: string): boolean;
     static selectElement(element: HTMLDivElement | null): void;
 }

package/lib/utils/ClipboardService.js

@@ -1,12 +1,16 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ClipboardService = void 0;
+const copy_to_clipboard_1 = __importDefault(require("copy-to-clipboard"));
 class ClipboardService {
     static isSupported() {
         return typeof navigator !== 'undefined' && !!navigator.clipboard;
     }
     static copyCustom(text) {
-        return navigator.clipboard.writeText(text);
+        return (0, copy_to_clipboard_1.default)(text);
     }
     static selectElement(element) {
         if (!element) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.9.3",
+  "version": "0.9.5",
   "description": "Shared UI components lib",
   "author": "team@redocly.com",
   "license": "SEE LICENSE IN LICENSE",
@@ -99,6 +99,7 @@
     "zod": ">=3.19.1"
   },
   "dependencies": {
+    "copy-to-clipboard": "^3.3.3",
     "highlight-words-core": "^1.2.2",
     "hotkeys-js": "^3.10.1",
     "timeago.js": "^4.0.2"

package/src/CopyButton/CopyButton.tsx

@@ -1,4 +1,5 @@
 import React, { useState } from 'react';
+import copy from 'copy-to-clipboard';
 
 import { Button } from '@theme/Button';
 
@@ -11,7 +12,7 @@ export const CopyButton = ({ text, dataTestId = 'copy-button' }: CopyButtonProps
   const [title, setTitle] = useState('Copy');
 
   async function write() {
-    await navigator.clipboard.writeText(text);
+    await copy(text);
 
     setTitle('Copied!');
 

package/src/ReferenceDocs/DevOnboardingTryItSecurity.tsx

@@ -69,7 +69,7 @@ export function DevOnboardingTryItSecurity(props: TryItSecurityAppsProps) {
     sessionStorage.setItem('redocly_onboarding:prevAppId', appId || '');
   }, [appId]);
 
-  if (!apiId) {
+  if (!apiId || !userData?.isAuthenticated) {
     return null;
   }
 

package/src/Sidebar/FooterWrapper.tsx

@@ -6,7 +6,7 @@ export const FooterWrapper = styled.div.attrs(() => ({
   margin: var(--sidebar-offset-top) 0 var(--sidebar-spacing-unit) var(--sidebar-offset-left);
   padding-top: var(--sidebar-spacing-unit);
   padding-right: var(--sidebar-spacing-unit);
-  border-top: solid 1px #daddde;
+  border-top: solid 1px var(--border-color);
 
   button {
     margin: 0;

package/src/Sidebar/HeaderWrapper.tsx

@@ -5,5 +5,5 @@ export const HeaderWrapper = styled.div.attrs(() => ({
 }))`
   margin: var(--sidebar-offset-top) 0 0 var(--sidebar-offset-left);
   padding-bottom: var(--sidebar-spacing-unit);
-  border-bottom: solid 1px #daddde;
+  border-bottom: solid 1px var(--border-color);
 `;

package/src/globalStyle.ts

@@ -1913,8 +1913,8 @@ const lastUpdated = css`
 `;
 
 const tile = css`
-  --wide-tile-background-color: var(--color-secondary-50);
-  --thin-tile-background-color: var(--color-secondary-50);
+  --wide-tile-background-color: var(--color-secondary-100);
+  --thin-tile-background-color: var(--color-secondary-100);
 `;
 
 const apiLogsTable = css`

package/src/ui/darkColors.tsx

@@ -51,7 +51,7 @@ export const darkMode = css`
   --panel-try-it-nested-body-background-color: #263041;
   --panel-try-it-tabs-active-background-color: #11151d;
   --panel-try-it-tabs-hover-background-color: #141a26;
-  --color-emphasis-100: #0065fb;
+  --color-emphasis-100: #16202e;
   --color-secondary-400: #696969;
   --color-emphasis-700: #fff;
   --color-emphasis-800: #fff;

package/src/utils/ClipboardService.ts

@@ -1,10 +1,11 @@
+import copy from 'copy-to-clipboard';
 export class ClipboardService {
   static isSupported(): boolean {
     return typeof navigator !== 'undefined' && !!navigator.clipboard;
   }
 
-  static copyCustom(text: string): Promise<void> {
-    return navigator.clipboard.writeText(text);
+  static copyCustom(text: string): boolean {
+    return copy(text);
   }
 
   static selectElement(element: HTMLDivElement | null): void {