@redocly/theme 0.70.0-next.9 → 0.70.1

package/src/icons/CookieIcon/CookieIcon.tsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M5 11.5C5.55228 11.5 6 11.0523 6 10.5C6 9.94771 5.55228 9.5 5 9.5C4.44772 9.5 4 9.94771 4 10.5C4 11.0523 4.44772 11.5 5 11.5Z" />
+    <path d="M11.5 11C12.0523 11 12.5 10.5523 12.5 10C12.5 9.44771 12.0523 9 11.5 9C10.9477 9 10.5 9.44771 10.5 10C10.5 10.5523 10.9477 11 11.5 11Z" />
+    <path d="M6.5 6C7.05228 6 7.5 5.55228 7.5 5C7.5 4.44772 7.05228 4 6.5 4C5.94772 4 5.5 4.44772 5.5 5C5.5 5.55228 5.94772 6 6.5 6Z" />
+    <path d="M7 8C7.27614 8 7.5 7.77614 7.5 7.5C7.5 7.22386 7.27614 7 7 7C6.72386 7 6.5 7.22386 6.5 7.5C6.5 7.77614 6.72386 8 7 8Z" />
+    <path d="M11.5 3.5C12.0523 3.5 12.5 3.05228 12.5 2.5C12.5 1.94772 12.0523 1.5 11.5 1.5C10.9477 1.5 10.5 1.94772 10.5 2.5C10.5 3.05228 10.9477 3.5 11.5 3.5Z" />
+    <path d="M14.5 2C14.7761 2 15 1.77614 15 1.5C15 1.22386 14.7761 1 14.5 1C14.2239 1 14 1.22386 14 1.5C14 1.77614 14.2239 2 14.5 2Z" />
+    <path d="M8 12C8.27614 12 8.5 11.7761 8.5 11.5C8.5 11.2239 8.27614 11 8 11C7.72386 11 7.5 11.2239 7.5 11.5C7.5 11.7761 7.72386 12 8 12Z" />
+    <path d="M8 15C4.15 15 1 11.85 1 8C1 4.15 4.15 1 8 1C8.05 1 8.1 1 8.15 1L8.85 1.05L8.7 1.65C8.65 1.85 8.6 2.1 8.6 2.3C8.6 3.7 9.7 4.8 11.1 4.8C11.6 4.8 12.1 4.65 12.55 4.35L13.2 5.1C13 5.3 12.9 5.55 12.9 5.8C12.9 6.45 13.55 7 14.25 6.75L14.85 6.5L14.95 7.15C15 7.45 15 7.75 15 8C15 11.85 11.85 15 8 15ZM7.65 2C4.5 2.2 2 4.8 2 8C2 11.3 4.7 14 8 14C11.3 14 14 11.3 14 8C14 7.95 14 7.85 14 7.8C12.85 7.85 11.9 6.95 11.9 5.8C11.9 5.75 11.9 5.75 11.9 5.7C11.65 5.75 11.4 5.8 11.1 5.8C9.15 5.8 7.6 4.25 7.6 2.3C7.6 2.2 7.6 2.1 7.65 2Z" />
+  </svg>
+);
+
+export const CookieIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/CookieIcon/CookieIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/CopyIcon/CopyIcon.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M5.16667 2.66667C5.16667 2.57462 5.24129 2.5 5.33333 2.5H12C12.092 2.5 12.1667 2.57462 12.1667 2.66667V10.6667C12.1667 10.7587 12.092 10.8333 12 10.8333H10H5.33333C5.24129 10.8333 5.16667 10.7587 5.16667 10.6667V4.66667V2.66667ZM4.16667 4.16667V2.66667C4.16667 2.02233 4.689 1.5 5.33333 1.5H12C12.6443 1.5 13.1667 2.02233 13.1667 2.66667V10.6667C13.1667 11.311 12.6443 11.8333 12 11.8333H10.5V13.3333C10.5 13.6428 10.3771 13.9395 10.1583 14.1583C9.9395 14.3771 9.64275 14.5 9.33333 14.5H2.66667C2.35725 14.5 2.0605 14.3771 1.84171 14.1583C1.62292 13.9395 1.5 13.6428 1.5 13.3333V5.33333C1.5 5.02391 1.62292 4.72717 1.84171 4.50838C2.0605 4.28958 2.35725 4.16667 2.66667 4.16667H4.16667ZM9.5 11.8333V13.3333C9.5 13.3775 9.48244 13.4199 9.45118 13.4512C9.41993 13.4824 9.37754 13.5 9.33333 13.5H2.66667C2.62246 13.5 2.58007 13.4824 2.54882 13.4512C2.51756 13.4199 2.5 13.3775 2.5 13.3333V5.33333C2.5 5.28913 2.51756 5.24674 2.54882 5.21548C2.58007 5.18423 2.62246 5.16667 2.66667 5.16667H4.16667V10.6667C4.16667 11.311 4.689 11.8333 5.33333 11.8333H9.5Z"
+    />
+  </svg>
+);
+
+export const CopyIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/CopyIcon/CopyIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/CopyLinkIcon/CopyLinkIcon.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M5.9737 9.50005C5.48436 9.50016 5.00598 9.35513 4.59907 9.08332C4.19217 8.81151 3.87501 8.42512 3.68773 7.97304C3.50045 7.52096 3.45145 7.02348 3.54693 6.54355C3.64242 6.06361 3.87809 5.62278 4.22415 5.2768L6.7768 2.72465C7.24077 2.26065 7.87006 1.99996 8.52624 1.99994C9.18241 1.99992 9.81172 2.26056 10.2757 2.72453C10.7397 3.1885 11.0004 3.81779 11.0004 4.47397C11.0005 5.13014 10.7398 5.75945 10.2759 6.22345L9.9997 6.49975L9.2918 5.7933L9.57065 5.51435C9.84599 5.23762 10.0004 4.86301 10 4.47263C9.99967 4.08224 9.84456 3.70793 9.5687 3.4317C9.28782 3.16364 8.91447 3.01408 8.5262 3.01408C8.13793 3.01408 7.76458 3.16364 7.4837 3.4317L4.93135 5.9837C4.79443 6.12056 4.68582 6.28305 4.61172 6.46189C4.53762 6.64073 4.49948 6.83242 4.49948 7.026C4.49948 7.21959 4.53762 7.41128 4.61172 7.59012C4.68582 7.76896 4.79443 7.93145 4.93135 8.0683C5.21223 8.33636 5.58558 8.48592 5.97385 8.48592C6.36212 8.48592 6.73547 8.33636 7.01635 8.0683L7.7235 8.77555C7.49421 9.00599 7.2215 9.18867 6.92115 9.31303C6.6208 9.43739 6.29878 9.50096 5.9737 9.50005Z" />
+    <path d="M9.9737 8.50005C9.48436 8.50016 9.00598 8.35513 8.59907 8.08332C8.19217 7.81151 7.87501 7.42512 7.68773 6.97304C7.50045 6.52096 7.45145 6.02348 7.54693 5.54355C7.64242 5.06361 7.87809 4.62278 8.22415 4.2768L8.50045 4.0005L9.2076 4.7078L8.9313 4.98395C8.79442 5.12081 8.68583 5.28329 8.61175 5.46212C8.53767 5.64095 8.49954 5.83261 8.49954 6.02618C8.49954 6.21974 8.53767 6.41141 8.61175 6.59024C8.68583 6.76906 8.79442 6.93154 8.9313 7.0684C9.21218 7.33646 9.58553 7.48602 9.9738 7.48602C10.3621 7.48602 10.7354 7.33646 11.0163 7.0684C11.1463 6.9384 13.3809 4.70375 13.5689 4.51615C13.8449 4.23954 14 3.86474 14 3.47398C14 3.08322 13.8449 2.70842 13.5689 2.4318C13.2881 2.16374 12.9147 2.01418 12.5265 2.01418C12.1382 2.01418 11.7648 2.16374 11.4839 2.4318L10.7768 1.72455C11.2409 1.26126 11.87 1.00118 12.5258 1.00147C13.1816 1.00175 13.8104 1.26239 14.2742 1.72609C14.7379 2.18979 14.9985 2.81863 14.9989 3.47442C14.9992 4.13021 14.7391 4.7593 14.2759 5.22345C14.0876 5.41145 11.8539 7.64485 11.724 7.7752C11.4946 8.00572 11.2218 8.18847 10.9214 8.31289C10.621 8.43731 10.2989 8.50092 9.9737 8.50005Z" />
+    <path d="M12 15.0001H2C1.73487 14.9998 1.48068 14.8943 1.2932 14.7069C1.10572 14.5194 1.00028 14.2652 1 14.0001V4.00005C1.00028 3.73492 1.10572 3.48073 1.2932 3.29325C1.48068 3.10578 1.73487 3.00033 2 3.00005H4V4.00005H2V14.0001H12V9.00005H13V14.0001C12.9997 14.2652 12.8943 14.5194 12.7068 14.7069C12.5193 14.8943 12.2651 14.9998 12 15.0001Z" />
+  </svg>
+);
+
+export const CopyLinkIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/CopyLinkIcon/CopyLinkIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/CubeIcon/CubeIcon.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+const Icon = (props: IconProps) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="currentColor"
+    {...props}
+  >
+    <path
+      d="M14.252 4.06812L8.25195 0.568119C8.17548 0.523507 8.08853 0.5 8 0.5C7.91147 0.5 7.82452 0.523507 7.74805 0.568119L1.74805 4.06812C1.67257 4.11215 1.60994 4.1752 1.56642 4.25099C1.5229 4.32677 1.5 4.41263 1.5 4.50002V11.5C1.5 11.5874 1.5229 11.6733 1.56642 11.7491C1.60994 11.8248 1.67257 11.8879 1.74805 11.9319L7.74805 15.4319C7.82452 15.4765 7.91147 15.5 8 15.5C8.08853 15.5 8.17548 15.4765 8.25195 15.4319L14.252 11.9319C14.3274 11.8879 14.3901 11.8248 14.4336 11.7491C14.4771 11.6733 14.5 11.5874 14.5 11.5V4.50002C14.5 4.41263 14.4771 4.32677 14.4336 4.25099C14.3901 4.1752 14.3274 4.11215 14.252 4.06812ZM8 1.57887L13.0078 4.50002L8 7.42117L2.9922 4.50002L8 1.57887ZM2.5 5.37062L7.5 8.28712V14.1294L2.5 11.2129V5.37062ZM8.5 14.1294V8.28712L13.5 5.37062V11.2129L8.5 14.1294Z"
+      fill="currentColor"
+    />
+  </svg>
+);
+
+export const CubeIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/CubeIcon/CubeIcon',
+})`
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/CursorIcon/CursorIcon.tsx

@@ -0,0 +1,35 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+const Icon = (props: IconProps) => (
+  <svg
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path d="M7.99956 15V8.0001L2 11.4999L7.99956 15Z" fill="#939393" />
+    <path d="M14 4.49979L7.99956 15V8.0001L14 4.49979Z" fill="#E3E3E3" />
+    <path d="M2 4.49979H14L7.99956 8.0001L2 4.49979Z" fill="white" />
+    <path d="M8.00025 1V4.49995L14 4.49979L8.00025 1Z" fill="#444444" />
+    <path
+      d="M2 4.49979L8.00025 4.49995V1L2 4.49979ZM13.9999 11.4998L10.9999 9.74987L7.99956 15L13.9999 11.4998Z"
+      fill="#939393"
+    />
+    <path
+      d="M14 4.49979L10.9999 9.74987L13.9999 11.4998L14 4.49979ZM7.99956 8.0001L2 11.4999V4.49979L7.99956 8.0001Z"
+      fill="#444444"
+    />
+  </svg>
+);
+
+export const CursorIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/CursorIcon/CursorIcon',
+})`
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/CurveAutoColonIcon/CurveAutoColonIcon.tsx

@@ -0,0 +1,26 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path
+      d="M4.74999 4.00001H10.05C10.1739 4.60703 10.5188 5.14642 11.0178 5.5136C11.5168 5.88079 12.1344 6.04962 12.7508 5.98735C13.3672 5.92508 13.9385 5.63615 14.354 5.17658C14.7694 4.71701 14.9995 4.11954 14.9995 3.50001C14.9995 2.88047 14.7694 2.283 14.354 1.82343C13.9385 1.36386 13.3672 1.07493 12.7508 1.01267C12.1344 0.950396 11.5168 1.11922 11.0178 1.48641C10.5188 1.85359 10.1739 2.39298 10.05 3.00001H4.74999C4.02065 3.00001 3.32117 3.28974 2.80545 3.80546C2.28972 4.32119 1.99999 5.02066 1.99999 5.75001C1.99999 6.47935 2.28972 7.17882 2.80545 7.69455C3.32117 8.21027 4.02065 8.50001 4.74999 8.50001H10.25C10.7141 8.50001 11.1592 8.68438 11.4874 9.01257C11.8156 9.34076 12 9.78588 12 10.25C12 10.7141 11.8156 11.1593 11.4874 11.4874C11.1592 11.8156 10.7141 12 10.25 12H5.94999C5.82609 11.393 5.4812 10.8536 4.9822 10.4864C4.4832 10.1192 3.86563 9.9504 3.24923 10.0127C2.63283 10.0749 2.06151 10.3639 1.64603 10.8234C1.23054 11.283 1.0005 11.8805 1.0005 12.5C1.0005 13.1195 1.23054 13.717 1.64603 14.1766C2.06151 14.6362 2.63283 14.9251 3.24923 14.9873C3.86563 15.0496 4.4832 14.8808 4.9822 14.5136C5.4812 14.1464 5.82609 13.607 5.94999 13H10.25C10.9793 13 11.6788 12.7103 12.1945 12.1945C12.7103 11.6788 13 10.9794 13 10.25C13 9.52066 12.7103 8.82119 12.1945 8.30546C11.6788 7.78974 10.9793 7.50001 10.25 7.50001H4.74999C4.28586 7.50001 3.84075 7.31563 3.51256 6.98744C3.18437 6.65925 2.99999 6.21413 2.99999 5.75001C2.99999 5.28588 3.18437 4.84076 3.51256 4.51257C3.84075 4.18438 4.28586 4.00001 4.74999 4.00001ZM12.5 2.00001C12.7967 2.00001 13.0867 2.08798 13.3333 2.2528C13.58 2.41762 13.7723 2.65189 13.8858 2.92598C13.9993 3.20007 14.029 3.50167 13.9712 3.79264C13.9133 4.08361 13.7704 4.35089 13.5607 4.56067C13.3509 4.77044 13.0836 4.91331 12.7926 4.97118C12.5017 5.02906 12.2001 4.99936 11.926 4.88582C11.6519 4.77229 11.4176 4.58003 11.2528 4.33336C11.088 4.08669 11 3.79668 11 3.50001C11 3.10218 11.158 2.72065 11.4393 2.43935C11.7206 2.15804 12.1022 2.00001 12.5 2.00001ZM3.49999 14C3.20332 14 2.91331 13.912 2.66664 13.7472C2.41996 13.5824 2.22771 13.3481 2.11417 13.074C2.00064 12.7999 1.97094 12.4983 2.02882 12.2074C2.08669 11.9164 2.22955 11.6491 2.43933 11.4393C2.64911 11.2296 2.91639 11.0867 3.20736 11.0288C3.49833 10.971 3.79993 11.0007 4.07402 11.1142C4.34811 11.2277 4.58238 11.42 4.7472 11.6667C4.91202 11.9133 4.99999 12.2033 4.99999 12.5C4.99999 12.8978 4.84196 13.2794 4.56065 13.5607C4.27935 13.842 3.89782 14 3.49999 14Z"
+      fill="#1A1C21"
+    />
+  </svg>
+);
+
+export const CurveAutoColonIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/CurveAutoColonIcon/CurveAutoColonIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DataFormatIcon/DataFormatIcon.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M13 5.5H9V6.5H13V5.5Z" />
+    <path d="M7 9.5H3V10.5H7V9.5Z" />
+    <path d="M5 8C4.60444 8 4.21776 7.8827 3.88886 7.66294C3.55996 7.44318 3.30362 7.13082 3.15224 6.76537C3.00087 6.39991 2.96126 5.99778 3.03843 5.60982C3.1156 5.22186 3.30608 4.86549 3.58579 4.58579C3.86549 4.30608 4.22186 4.1156 4.60982 4.03843C4.99778 3.96126 5.39991 4.00087 5.76537 4.15224C6.13082 4.30362 6.44318 4.55996 6.66294 4.88886C6.8827 5.21776 7 5.60444 7 6C6.9994 6.53025 6.7885 7.03861 6.41356 7.41356C6.03861 7.7885 5.53025 7.9994 5 8ZM5 5C4.80222 5 4.60888 5.05865 4.44443 5.16853C4.27998 5.27841 4.15181 5.43459 4.07612 5.61732C4.00043 5.80004 3.98063 6.00111 4.01921 6.19509C4.0578 6.38907 4.15304 6.56725 4.29289 6.70711C4.43275 6.84696 4.61093 6.9422 4.80491 6.98079C4.99889 7.01937 5.19996 6.99957 5.38268 6.92388C5.56541 6.84819 5.72159 6.72002 5.83147 6.55557C5.94135 6.39112 6 6.19778 6 6C5.99974 5.73486 5.89429 5.48066 5.70681 5.29319C5.51934 5.10571 5.26514 5.00026 5 5Z" />
+    <path d="M11 12C10.6044 12 10.2178 11.8827 9.88886 11.6629C9.55996 11.4432 9.30362 11.1308 9.15224 10.7654C9.00087 10.3999 8.96126 9.99778 9.03843 9.60982C9.1156 9.22186 9.30608 8.86549 9.58579 8.58579C9.86549 8.30608 10.2219 8.1156 10.6098 8.03843C10.9978 7.96126 11.3999 8.00087 11.7654 8.15224C12.1308 8.30362 12.4432 8.55996 12.6629 8.88886C12.8827 9.21776 13 9.60444 13 10C12.9994 10.5303 12.7885 11.0386 12.4136 11.4136C12.0386 11.7885 11.5303 11.9994 11 12ZM11 9C10.8022 9 10.6089 9.05865 10.4444 9.16853C10.28 9.27841 10.1518 9.43459 10.0761 9.61732C10.0004 9.80004 9.98063 10.0011 10.0192 10.1951C10.0578 10.3891 10.153 10.5673 10.2929 10.7071C10.4327 10.847 10.6109 10.9422 10.8049 10.9808C10.9989 11.0194 11.2 10.9996 11.3827 10.9239C11.5654 10.8482 11.7216 10.72 11.8315 10.5556C11.9414 10.3911 12 10.1978 12 10C11.9997 9.73487 11.8943 9.48066 11.7068 9.29319C11.5193 9.10571 11.2651 9.00027 11 9Z" />
+    <path d="M14 15H2C1.73487 14.9997 1.48068 14.8943 1.2932 14.7068C1.10572 14.5193 1.00028 14.2651 1 14V2C1.00028 1.73487 1.10572 1.48068 1.2932 1.2932C1.48068 1.10572 1.73487 1.00028 2 1H14C14.2651 1.00028 14.5193 1.10572 14.7068 1.2932C14.8943 1.48068 14.9997 1.73487 15 2V14C14.9997 14.2651 14.8943 14.5193 14.7068 14.7068C14.5193 14.8943 14.2651 14.9997 14 15ZM2 2V14H14V2H2Z" />
+  </svg>
+);
+
+export const DataFormatIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DataFormatIcon/DataFormatIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DataRefineryIcon/DataRefineryIcon.tsx

@@ -0,0 +1,34 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" {...props}>
+    <path
+      d="M3.0625 13.125C2.62985 13.125 2.20692 12.9967 1.84719 12.7563C1.48746 12.516 1.20708 12.1743 1.04151 11.7746C0.875948 11.3749 0.832628 10.9351 0.917033 10.5107C1.00144 10.0864 1.20978 9.69663 1.5157 9.3907C1.82163 9.08478 2.21141 8.87644 2.63574 8.79203C3.06007 8.70763 3.49991 8.75095 3.89962 8.91651C4.29933 9.08208 4.64097 9.36246 4.88134 9.72219C5.12171 10.0819 5.25 10.5049 5.25 10.9375C5.24932 11.5175 5.01863 12.0735 4.60854 12.4835C4.19845 12.8936 3.64245 13.1243 3.0625 13.125ZM3.0625 9.625C2.80291 9.625 2.54915 9.70198 2.33331 9.8462C2.11748 9.99042 1.94925 10.1954 1.84991 10.4352C1.75057 10.6751 1.72458 10.939 1.77522 11.1936C1.82586 11.4482 1.95087 11.682 2.13442 11.8656C2.31798 12.0491 2.55184 12.1741 2.80645 12.2248C3.06105 12.2754 3.32494 12.2494 3.56477 12.1501C3.8046 12.0508 4.00959 11.8825 4.1538 11.6667C4.29802 11.4508 4.375 11.1971 4.375 10.9375C4.37462 10.5895 4.23622 10.2559 3.99016 10.0098C3.7441 9.76379 3.41048 9.62538 3.0625 9.625Z"
+      fill="#3B3C45"
+    />
+    <path
+      d="M10.5 11.375H6.125V10.5H10.5V7.4375H3.5C3.26801 7.43726 3.04559 7.34499 2.88155 7.18095C2.71751 7.01691 2.62524 6.79449 2.625 6.5625V3.5C2.62524 3.26801 2.71751 3.04559 2.88155 2.88155C3.04559 2.71751 3.26801 2.62524 3.5 2.625H7.875V3.5H3.5V6.5625H10.5C10.732 6.56274 10.9544 6.65501 11.1185 6.81905C11.2825 6.98309 11.3748 7.20551 11.375 7.4375V10.5C11.3748 10.732 11.2825 10.9544 11.1185 11.1184C10.9544 11.2825 10.732 11.3748 10.5 11.375Z"
+      fill="#3B3C45"
+    />
+    <path
+      d="M12.25 5.25H9.625C9.39302 5.24973 9.17061 5.15746 9.00658 4.99342C8.84254 4.82939 8.75027 4.60698 8.75 4.375V1.75C8.75027 1.51802 8.84254 1.29561 9.00658 1.13158C9.17061 0.967539 9.39302 0.875266 9.625 0.875H12.25C12.482 0.875266 12.7044 0.967539 12.8684 1.13158C13.0325 1.29561 13.1247 1.51802 13.125 1.75V4.375C13.1247 4.60698 13.0325 4.82939 12.8684 4.99342C12.7044 5.15746 12.482 5.24973 12.25 5.25ZM9.625 1.75V4.375H12.25V1.75H9.625Z"
+      fill="#3B3C45"
+    />
+  </svg>
+);
+
+export const DataRefineryIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DataRefineryIcon/DataRefineryIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DatabaseIcon/DatabaseIcon.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M8 2.01318C5.35105 2.01318 2.5 2.63918 2.5 4.01318V13.0132C2.5 14.3872 5.35105 15.0132 8 15.0132C10.649 15.0132 13.5 14.3872 13.5 13.0132V4.01318C13.5 2.63918 10.649 2.01318 8 2.01318ZM8 3.01318C10.8988 3.01318 12.3974 3.73023 12.4984 4.01318C12.3974 4.29613 10.8988 5.01318 8 5.01318C5.07935 5.01318 3.5803 4.28538 3.5 4.02198V4.01953C3.5803 3.74098 5.07935 3.01318 8 3.01318ZM3.5 5.22703C4.56395 5.76073 6.3213 6.01318 8 6.01318C9.6787 6.01318 11.4361 5.76073 12.5 5.22703V7.00683C12.4197 7.28538 10.9207 8.01318 8 8.01318C5.07495 8.01318 3.57545 7.28318 3.5 7.01318V5.22703ZM3.5 8.22703C4.56395 8.76073 6.3213 9.01318 8 9.01318C9.6787 9.01318 11.4361 8.76073 12.5 8.22703V10.0068C12.4197 10.2854 10.9207 11.0132 8 11.0132C5.07495 11.0132 3.57545 10.2832 3.5 10.0132V8.22703ZM8 14.0132C5.07495 14.0132 3.57545 13.2832 3.5 13.0132V11.227C4.56395 11.7607 6.3213 12.0132 8 12.0132C9.6787 12.0132 11.4361 11.7607 12.5 11.227V13.0068C12.4197 13.2854 10.9207 14.0132 8 14.0132Z" />
+  </svg>
+);
+
+export const DatabaseIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DatabaseIcon/DatabaseIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DescSortIcon/DescSortIcon.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path
+      d="M9 11L9.707 10.293L11.5 12.086V2H12.5V12.086L14.293 10.293L15 11L12 14L9 11Z"
+      fill="#22242B"
+    />
+    <path d="M8 3H1V4H8V3Z" fill="#22242B" />
+    <path d="M8 6H3V7H8V6Z" fill="#22242B" />
+    <path d="M8 9H5V10H8V9Z" fill="#22242B" />
+  </svg>
+);
+
+export const DescSortIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DescSortIcon/DescSortIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DeselectIcon/DeselectIcon.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg
+    data-component-name="icons/DeselectIcon"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path d="M14.4966 10.5H9.49658V11.5H14.4966V10.5Z" fill="currentColor" />
+    <path d="M10.5 3.64746H1.5V4.64746H10.5V3.64746Z" fill="currentColor" />
+    <path d="M10.5 6.64746H1.5V7.64746H10.5V6.64746Z" fill="currentColor" />
+    <path d="M7.5 9.64746H1.5V10.6475H7.5V9.64746Z" fill="currentColor" />
+  </svg>
+);
+
+export const DeselectIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DeselectIcon/DeselectIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '1.3em'};
+  width: ${({ size }) => size || '1.3em'};
+  vertical-align: middle;
+`;

package/src/icons/DirectionRightIcon/DirectionRightIcon.tsx

@@ -0,0 +1,35 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M9.5 4L8.79295 4.70705L11.0859 7H5C4.73478 7 4.48043 7.10536 4.29289 7.29289C4.10536 7.48043 4 7.73478 4 8V14H5V8H11.0859L8.79295 10.2929L9.5 11L13 7.5L9.5 4Z"
+      fill="#1A1C21"
+    />
+    <path d="M5 2H4V6H5V2Z" fill="#1A1C21" />
+  </svg>
+);
+
+export const DirectionRightIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DirectionRightIcon/DirectionRightIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+  vertical-align: middle;
+`;

package/src/icons/DocumentAddIcon/DocumentAddIcon.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M15 11.9999H13V9.99993H12V11.9999H10V12.9999H12V14.9999H13V12.9999H15V11.9999Z" />
+    <path d="M8 13.9999H4V1.99993H8V4.99993C8.00077 5.26491 8.10637 5.51882 8.29374 5.70619C8.48111 5.89356 8.73502 5.99916 9 5.99993H12V7.99993H13V4.99993C13.0018 4.93421 12.9893 4.86889 12.9634 4.80847C12.9375 4.74804 12.8988 4.69395 12.85 4.64993L9.35 1.14993C9.30599 1.10109 9.2519 1.06239 9.19147 1.03649C9.13104 1.01059 9.06572 0.99812 9 0.999928H4C3.73502 1.00069 3.48111 1.1063 3.29374 1.29367C3.10637 1.48104 3.00077 1.73495 3 1.99993V13.9999C3.00077 14.2649 3.10637 14.5188 3.29374 14.7062C3.48111 14.8936 3.73502 14.9992 4 14.9999H8V13.9999ZM9 2.19993L11.8 4.99993H9V2.19993Z" />
+  </svg>
+);
+
+export const DocumentAddIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DocumentAddIcon/DocumentAddIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DocumentBlankIcon/DocumentBlankIcon.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M12.85 4.64993L9.35 1.14993C9.30601 1.10107 9.25192 1.06236 9.19149 1.03646C9.13106 1.01056 9.06572 0.998095 9 0.999933H4C3.73502 1.00071 3.48112 1.10632 3.29375 1.29369C3.10638 1.48105 3.00078 1.73496 3 1.99993V13.9999C3.00078 14.2649 3.10638 14.5188 3.29375 14.7062C3.48112 14.8935 3.73502 14.9992 4 14.9999H12C12.265 14.9992 12.5189 14.8935 12.7062 14.7062C12.8936 14.5188 12.9992 14.2649 13 13.9999V4.99993C13.0018 4.93421 12.9894 4.86887 12.9635 4.80844C12.9376 4.74801 12.8989 4.69393 12.85 4.64993ZM9 2.19993L11.8 4.99993H9V2.19993ZM12 13.9999H4V1.99993H8V4.99993C8.00078 5.26491 8.10638 5.51881 8.29375 5.70618C8.48112 5.89355 8.73502 5.99916 9 5.99993H12V13.9999Z" />
+  </svg>
+);
+
+export const DocumentBlankIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DocumentBlankIcon/DocumentBlankIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DocumentCssIcon/DocumentCssIcon.tsx

@@ -0,0 +1,36 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g id="iconCSS">
+      <path
+        id="Vector"
+        d="M3.33329 2L2.89996 4.22667H11.96L11.6666 5.66667H2.61329L2.17329 7.88667H11.2333L10.7266 10.4267L7.07329 11.6333L3.90662 10.4267L4.12662 9.33333H1.89996L1.37329 12L6.60662 14L12.64 12L13.44 7.98L13.6 7.17333L14.6266 2H3.33329Z"
+        fill="#3B3C45"
+      />
+    </g>
+  </svg>
+);
+
+export const DocumentCssIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DocumentCssIcon/DocumentCssIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DocumentCssIcon/index.ts

@@ -0,0 +1 @@
+export { DocumentCssIcon } from '@redocly/theme/icons/DocumentCssIcon/DocumentCssIcon';

package/src/icons/DocumentGraphqlIcon/DocumentGraphqlIcon.tsx

@@ -0,0 +1,64 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g id="iconGraphQL">
+      <g id="Vector">
+        <path
+          d="M3.01235 11.5921L2.50927 11.3017L8.11379 1.5947L8.61687 1.88514L3.01235 11.5921Z"
+          fill="#3B3C45"
+        />
+        <path d="M2.39407 10.5261H13.6027V11.1071H2.39407V10.5261Z" fill="#3B3C45" />
+        <path
+          d="M8.22231 14.0897L2.61591 10.8527L2.90631 10.3497L8.51275 13.5866L8.22231 14.0897ZM13.0926 5.6531L7.48623 2.41614L7.77667 1.91306L13.3831 5.15006L13.0926 5.6531Z"
+          fill="#3B3C45"
+        />
+        <path
+          d="M2.90787 5.65082L2.61743 5.14778L8.22383 1.91078L8.51427 2.41386L2.90787 5.65082Z"
+          fill="#3B3C45"
+        />
+        <path
+          d="M12.9893 11.5921L7.38483 1.88514L7.88791 1.5947L13.4924 11.3017L12.9893 11.5921ZM2.83827 4.76242H3.41923V11.2365H2.83827V4.76242ZM12.5809 4.76242H13.1618V11.2365H12.5809V4.76242Z"
+          fill="#3B3C45"
+        />
+        <path
+          d="M8.12355 13.844L7.86983 13.4045L12.7459 10.5892L12.9996 11.0286L8.12355 13.844Z"
+          fill="#3B3C45"
+        />
+        <path
+          d="M13.9316 11.4256C13.5957 12.01 12.8468 12.2095 12.2624 11.8735C11.678 11.5376 11.4785 10.7887 11.8145 10.2043C12.1504 9.6199 12.8993 9.42042 13.4837 9.75638C14.0716 10.0958 14.2711 10.8412 13.9316 11.4256ZM4.18219 5.79514C3.84623 6.37954 3.09735 6.57898 2.51291 6.24302C1.92851 5.9071 1.72907 5.15822 2.06503 4.57382C2.40095 3.98938 3.14983 3.7899 3.73423 4.12586C4.31867 4.4653 4.51815 5.2107 4.18219 5.79514ZM2.06851 11.4256C1.73251 10.8412 1.93203 10.0958 2.51639 9.75642C3.10079 9.42042 3.84623 9.6199 4.18567 10.2043C4.52159 10.7887 4.32215 11.5341 3.73775 11.8735C3.14987 12.2095 2.40443 12.01 2.06851 11.4256ZM11.818 5.79514C11.482 5.21074 11.6815 4.4653 12.2659 4.12586C12.8503 3.78994 13.5957 3.98938 13.9351 4.57378C14.2711 5.15818 14.0716 5.90358 13.4872 6.24302C12.9028 6.57902 12.1539 6.3795 11.818 5.79514ZM8.00003 14.8518C7.32463 14.8518 6.77871 14.3059 6.77871 13.6305C6.77871 12.9551 7.32463 12.4092 8.00003 12.4092C8.67543 12.4092 9.22131 12.9551 9.22131 13.6305C9.22131 14.3024 8.67543 14.8518 8.00003 14.8518ZM8.00003 3.59038C7.32463 3.59038 6.77871 3.04446 6.77871 2.3691C6.77871 1.69374 7.32463 1.14778 8.00003 1.14778C8.67543 1.14778 9.22131 1.6937 9.22131 2.3691C9.22131 3.0445 8.67543 3.59038 8.00003 3.59038Z"
+          fill="#3B3C45"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M8.00003 1.28384C7.39978 1.28384 6.91477 1.76888 6.91477 2.3691C6.91477 2.41502 6.91761 2.46026 6.92312 2.50467L7.41983 2.21788L7.19896 1.83534L7.93771 1.40884L8.00085 1.51819L8.06399 1.40884L8.80274 1.83534L8.58058 2.22011L9.07666 2.50653C9.08233 2.46153 9.08525 2.41566 9.08525 2.3691C9.08525 1.76884 8.60028 1.28384 8.00003 1.28384ZM9.32802 2.65166C9.34725 2.56053 9.35737 2.46602 9.35737 2.3691C9.35737 1.61856 8.75058 1.01172 8.00003 1.01172C7.24948 1.01172 6.64265 1.6186 6.64265 2.3691C6.64265 2.46538 6.65263 2.5593 6.67163 2.64987L4.03113 4.17443C3.96223 4.11247 3.88592 4.05662 3.80256 4.0082C3.15348 3.63506 2.32071 3.85596 1.94707 4.50601C1.57393 5.15509 1.79508 5.98734 2.4451 6.36098C2.52825 6.40878 2.6144 6.44682 2.70221 6.47547V9.52504C2.61565 9.55356 2.53068 9.59126 2.44857 9.63846C1.79955 10.0154 1.57714 10.844 1.95055 11.4934C2.32424 12.1435 3.15292 12.3645 3.80527 11.9917C3.88753 11.9439 3.96375 11.8884 4.03194 11.8274L6.6713 13.3513C6.65252 13.4414 6.64265 13.5348 6.64265 13.6305C6.64265 14.3811 7.24949 14.9878 8.00003 14.9878C8.75083 14.9878 9.35737 14.3773 9.35737 13.6305C9.35737 13.5203 9.34428 13.4131 9.31956 13.3105L11.9367 11.7994C12.0131 11.872 12.0992 11.9367 12.1946 11.9915C12.8436 12.3646 13.6758 12.1435 14.0495 11.4937C14.4267 10.8439 14.2044 10.0154 13.5517 9.63855C13.4697 9.59137 13.3845 9.55357 13.2979 9.52506V6.47551C13.3857 6.44686 13.4719 6.4088 13.555 6.36098C14.2041 5.98398 14.4265 5.15542 14.0531 4.50596C13.6761 3.85689 12.8476 3.63459 12.1981 4.0079C12.1142 4.05664 12.0369 4.11323 11.9676 4.1757L9.32802 2.65166ZM9.00523 2.77952L8.59101 2.54035L8.86841 3.02081C8.92375 2.94712 8.96992 2.86613 9.00523 2.77952ZM8.42845 2.80304L8.34942 2.66615L8.30986 2.68899L8.29013 2.72317L8.42845 2.80304ZM7.99827 2.55467L8.11066 2.48978L8.17912 2.3712L8.11966 2.26821L7.99827 2.19812L7.88461 2.26375L7.82257 2.3712L7.89361 2.49424L7.99827 2.55467ZM7.65099 2.66838L7.6944 2.69344L7.71028 2.72095L7.57582 2.79858L7.65099 2.66838ZM8.41294 1.96622L8.37683 1.90367L8.431 1.93494L8.41294 1.96622ZM8.17042 1.7845L8.16359 1.78056L8.15796 1.79031L8.15856 1.79135L8.17042 1.7845ZM7.83811 1.78056L7.84374 1.79031L7.84185 1.79358L7.8287 1.78599L7.83811 1.78056ZM7.62504 1.90357L7.5707 1.93494L7.58881 1.96632L7.62504 1.90357ZM7.41326 2.5359L6.99414 2.77789C7.02974 2.8656 7.07646 2.94757 7.13257 3.02205L7.41326 2.5359ZM6.91217 3.18175C6.85072 3.09957 6.79837 3.01016 6.75661 2.91503L4.21789 4.38083C4.27931 4.46462 4.3305 4.55469 4.37091 4.64899L6.91217 3.18175ZM4.13315 4.78627C4.09554 4.6908 4.04435 4.6003 3.98041 4.51794L3.55529 4.76339V5.11991L4.13315 4.78627ZM3.55529 5.43413L4.20192 5.06079C4.22785 5.28418 4.18488 5.51744 4.06423 5.72733C3.94346 5.93741 3.76245 6.09157 3.55529 6.1808V5.43413ZM3.28317 5.27702V4.92051L2.97433 5.09883V5.45534L3.28317 5.27702ZM3.2484 4.62636H2.70221V4.94172L2.43156 5.09798L2.70221 5.56673V6.18527C2.66101 6.16794 2.62044 6.14789 2.58072 6.12506C2.06194 5.82686 1.88421 5.16135 2.18299 4.64163C2.48114 4.1229 3.14647 3.94511 3.66614 4.24366C3.7061 4.26688 3.74404 4.29224 3.77988 4.3195L3.2484 4.62636ZM2.97433 6.5341V9.46563C3.07759 9.45406 3.18121 9.45452 3.28317 9.46645V6.53267C3.18122 6.54476 3.07759 6.54541 2.97433 6.5341ZM3.28317 6.25817C3.18161 6.27326 3.07759 6.27412 2.97433 6.25989V5.76956L3.28317 5.59125V6.25817ZM3.55529 6.47181C3.85901 6.37047 4.12815 6.16214 4.30015 5.86295C4.47176 5.56442 4.51762 5.22811 4.45405 4.91522L6.83232 3.54208L3.55529 9.21788V6.47181ZM3.28317 10.2334L3.20665 10.366L3.24843 10.3901H3.28317V10.2334ZM3.28317 10.7244L3.17551 10.6622H3.03561L2.97433 10.7683V10.9025L3.09291 10.971H3.21387L3.28317 10.851V10.7244ZM3.55529 10.971V10.9239L3.57366 10.8921L3.71035 10.971H3.55529ZM2.97433 10.2241L3.25544 9.73721C3.16269 9.72604 3.06819 9.72675 2.97433 9.73997V10.2241ZM2.70221 9.81561C2.66234 9.83256 2.62305 9.85206 2.58454 9.87418C2.06498 10.1761 1.88791 10.8385 2.18646 11.3578C2.48454 11.8764 3.14646 12.0545 3.66981 11.7557C3.7086 11.7331 3.74549 11.7085 3.78041 11.6822L3.28322 11.3951L3.06215 11.778L2.3234 11.3515L2.38598 11.2431H2.25801V10.3901H2.70221V9.81561ZM2.56878 10.6622H2.53013V10.7291L2.56878 10.6622ZM2.53013 10.9603V10.971H2.54309L2.54449 10.9686L2.53013 10.9603ZM2.69514 11.2519L2.7002 11.2431H2.70221V11.256L2.69514 11.2519ZM2.90421 11.3726L2.96255 11.4063L2.98199 11.3726H2.90421ZM3.56423 11.2431L3.98177 11.4842C4.03994 11.4098 4.08765 11.3286 4.1243 11.2431H3.56423ZM4.37302 11.3536C4.33237 11.4478 4.28096 11.5377 4.21933 11.6214L6.75599 13.086C6.79764 12.9908 6.84988 12.9013 6.91124 12.8191L4.37302 11.3536ZM7.14896 12.9563C7.0852 13.0368 7.03263 13.1265 6.99356 13.2231L7.91524 13.7553L7.68397 13.3547L7.76145 13.31L7.14896 12.9563ZM8.03357 13.1528L7.35202 12.7593C7.53275 12.6248 7.75694 12.5453 8.00003 12.5453C8.25618 12.5453 8.49133 12.6336 8.67676 12.7815L8.03357 13.1528ZM8.07781 13.4926L8.17335 13.6581L8.2689 13.6029L8.07781 13.4926ZM8.58409 13.7352L8.27211 14.2756L6.92292 13.4966C6.91754 13.5405 6.91477 13.5851 6.91477 13.6305C6.91477 14.2307 7.39977 14.7157 8.00003 14.7157C8.60003 14.7157 9.08525 14.2275 9.08525 13.6305C9.08525 13.5704 9.08038 13.5114 9.07103 13.454L8.58409 13.7352ZM9.22743 13.0495L11.7567 11.5891C11.7118 11.5242 11.673 11.4557 11.6403 11.3847L9.10863 12.8464C9.15383 12.9102 9.19364 12.9781 9.22743 13.0495ZM8.87168 12.9832C8.91833 13.0459 8.95836 13.114 8.99072 13.1862L8.54101 13.4458L8.30569 13.31L8.87168 12.9832ZM8.92613 12.6375C8.68374 12.4114 8.35826 12.2732 8.00003 12.2732C7.65449 12.2732 7.3394 12.4018 7.09997 12.6138L4.72591 11.2431H11.3412L8.92613 12.6375ZM11.8854 11.2431L11.8773 11.2478C11.9083 11.3197 11.9471 11.3883 11.9934 11.4524L12.3559 11.2431H11.8854ZM12.6759 11.3726L12.1853 11.6559C12.2301 11.6924 12.2785 11.7258 12.3302 11.7556C12.8499 12.0543 13.5155 11.8766 13.8137 11.3578C14.1151 10.8389 13.9387 10.1762 13.4157 9.87423C13.3771 9.85207 13.3378 9.83254 13.2979 9.81558V10.3901H13.7387V11.2431H13.6157L13.6783 11.3515L12.9395 11.778L12.7054 11.3726H12.6759ZM13.0196 11.3726L13.0391 11.4063L13.0974 11.3726H13.0196ZM13.2979 11.2569L13.3065 11.2519L13.3015 11.2431H13.2979V11.2569ZM13.4666 10.971H13.4586L13.2979 10.6926V10.6622H13.4666V10.971ZM13.0257 10.2213V9.73999C12.9324 9.72683 12.8383 9.72601 12.746 9.73691L13.0257 10.2213ZM12.7169 9.46634C12.8189 9.45451 12.9225 9.45411 13.0257 9.46569V6.53412C12.9225 6.54543 12.8189 6.54477 12.7169 6.53267V9.46634ZM12.7169 6.25817C12.8185 6.27326 12.9225 6.27413 13.0257 6.25992V5.77159L12.7169 5.5933V6.25817ZM12.4448 5.43618V6.18076C12.2377 6.09152 12.0567 5.93738 11.9359 5.72733C11.8156 5.51807 11.7726 5.28556 11.798 5.06275L12.4448 5.43618ZM12.7169 5.27907L13.0257 5.45736V5.10085L12.7169 4.92256V5.27907ZM13.2979 5.56977L13.5689 5.10026L13.2979 4.94375V4.62636H12.7481L12.2187 4.32068C12.255 4.29297 12.2935 4.26721 12.334 4.24365C12.8533 3.9454 13.5155 4.12244 13.8173 4.64191C14.1156 5.16112 13.9386 5.82335 13.4191 6.12523C13.3795 6.14801 13.339 6.16802 13.2979 6.18532V5.56977ZM11.7812 4.38229L9.24272 2.91663C9.20084 3.01171 9.14838 3.10105 9.08682 3.18316L11.6285 4.65067C11.6688 4.55631 11.7199 4.46617 11.7812 4.38229ZM11.8664 4.78798C11.9038 4.69244 11.9548 4.60185 12.0186 4.51938L12.4448 4.76544V5.12196L11.8664 4.78798ZM11.5458 4.91709C11.4827 5.22946 11.5288 5.56502 11.7 5.86295C11.872 6.16209 12.1411 6.37042 12.4448 6.47178V9.21516L9.17194 3.54653L11.5458 4.91709ZM8.64516 3.24238L8.16575 2.96559L8.40337 3.37716C8.49007 3.34252 8.57122 3.29704 8.64516 3.24238ZM8.5406 3.61483C8.63593 3.57348 8.72556 3.52152 8.808 3.46043L12.3345 9.56833C12.2402 9.60887 12.1501 9.66018 12.0665 9.72174L8.5406 3.61483ZM8.12932 3.44673L8.00084 3.22421L7.87226 3.44691C7.91416 3.4518 7.9568 3.45432 8.00003 3.45432C8.04379 3.45432 8.08693 3.45174 8.12932 3.44673ZM7.72671 3.699C7.81498 3.717 7.90639 3.72644 8.00003 3.72644C8.09419 3.72644 8.18608 3.71689 8.2748 3.69871L11.8605 9.90917C11.7993 9.97776 11.7442 10.0537 11.6966 10.1365C11.6494 10.2186 11.6117 10.3035 11.5832 10.3901H4.41701C4.3885 10.3035 4.35082 10.2186 4.30363 10.1365C4.25603 10.0545 4.20092 9.97885 4.14018 9.91085L7.72671 3.699ZM7.59801 3.37768L7.83851 2.96113L7.35336 3.24124C7.42809 3.29669 7.51021 3.34274 7.59801 3.37768ZM7.1932 3.46127C7.2757 3.52228 7.36539 3.57414 7.46076 3.61539L3.93426 9.72328C3.85064 9.66158 3.76074 9.61011 3.66656 9.56939L7.1932 3.46127ZM3.79708 9.96087C3.72245 9.90244 3.64106 9.85453 3.55529 9.81777V10.3797L3.79708 9.96087ZM3.86349 10.3901H4.12644C4.10949 10.3502 4.08997 10.3109 4.06784 10.2723C4.04544 10.2338 4.02107 10.1972 3.99491 10.1625L3.86349 10.3901ZM4.20207 10.6622H3.71975L4.20495 10.9423C4.216 10.8499 4.21525 10.7557 4.20207 10.6622ZM4.4756 10.971H11.5245C11.5126 10.869 11.5122 10.7654 11.5238 10.6622H4.47641C4.48798 10.7654 4.48753 10.8691 4.4756 10.971ZM11.7981 10.6622C11.7836 10.7654 11.7841 10.8694 11.7988 10.971H11.8125L12.3083 10.6848L12.2952 10.6622H11.7981ZM11.8738 10.3901H12.1381L12.0058 10.1609C11.9794 10.196 11.9549 10.2331 11.9325 10.2721C11.9103 10.3107 11.8907 10.3501 11.8738 10.3901ZM12.2037 9.95932L12.4448 10.377V9.81716C12.3592 9.85369 12.278 9.90129 12.2037 9.95932ZM12.7169 10.2307V10.3901H12.8089L12.7169 10.2307ZM12.9661 10.6622H12.9452L13.0257 10.8017V10.7656L12.9661 10.6622ZM12.8093 10.971L12.7169 10.8111V10.8483L12.7878 10.971H12.8093ZM12.4448 10.971V10.9212L12.3567 10.971H12.4448Z"
+          fill="#3B3C45"
+        />
+      </g>
+    </g>
+  </svg>
+);
+
+export const DocumentGraphqlIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DocumentGraphqlIcon/DocumentGraphqlIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DocumentGraphqlIcon/index.ts

@@ -0,0 +1 @@
+export { DocumentGraphqlIcon } from '@redocly/theme/icons/DocumentGraphqlIcon/DocumentGraphqlIcon';

package/src/icons/DocumentHtmlIcon/DocumentHtmlIcon.tsx

@@ -0,0 +1,36 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g id="iconHTML">
+      <path
+        id="Vector"
+        d="M8.00005 11.7067L10.7134 10.9533L11.08 6.88667H6.25338L6.13338 5.53333H11.2L11.3334 4.20667H4.66671L5.04005 8.21333H9.63338L9.48005 9.93333L8.00005 10.3333L6.52005 9.93333L6.42671 8.82667H5.09338L5.28671 10.9533L8.00005 11.7067ZM2.71338 2H13.2867L12.3334 12.8L8.00005 14L3.66671 12.8L2.71338 2Z"
+        fill="#3B3C45"
+      />
+    </g>
+  </svg>
+);
+
+export const DocumentHtmlIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DocumentHtmlIcon/DocumentHtmlIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DocumentHtmlIcon/index.ts

@@ -0,0 +1 @@
+export { DocumentHtmlIcon } from '@redocly/theme/icons/DocumentHtmlIcon/DocumentHtmlIcon';

package/src/icons/DocumentIcon/DocumentIcon.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path d="M12.85 4.65L9.35 1.15C9.25 1.05 9.15 1 9 1H4C3.45 1 3 1.45 3 2V14C3 14.55 3.45 15 4 15H12C12.55 15 13 14.55 13 14V5C13 4.85 12.95 4.75 12.85 4.65ZM9 2.2L11.8 5H9V2.2ZM12 14H4V2H8V5C8 5.55 8.45 6 9 6H12V14Z" />
+    <path d="M11 11H5V12H11V11Z" />
+    <path d="M11 8H5V9H11V8Z" />
+  </svg>
+);
+
+export const DocumentIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/DocumentIcon/DocumentIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/DocumentIcon/index.ts

@@ -0,0 +1 @@
+export { DocumentIcon } from '@redocly/theme/icons/DocumentIcon/DocumentIcon';