@scalar/api-client-react 2.0.33 → 2.0.35

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # @scalar/api-client-react
 
+## 2.0.35
+
+## 2.0.34
+
 ## 2.0.33
 
 ## 2.0.32

package/dist/style.css

@@ -102,8 +102,13 @@
   :root {
     --scalar-border-width: .5px;
     --scalar-radius: 3px;
-    --scalar-radius-lg: 6px;
-    --scalar-radius-xl: 8px;
+    --scalar-radius-max: 20px;
+    --scalar-radius-md: min(var(--scalar-radius), var(--scalar-radius-max));
+    --scalar-radius-lg: min(calc(var(--scalar-radius) * 2), var(--scalar-radius-max));
+    --scalar-radius-xl: min(calc(var(--scalar-radius) * 8 / 3), var(--scalar-radius-max));
+    --scalar-radius-2xl: min(calc(var(--scalar-radius) * 4), var(--scalar-radius-max));
+    --scalar-radius-3xl: min(calc(var(--scalar-radius) * 16 / 3), var(--scalar-radius-max));
+    --scalar-radius-full: calc(var(--scalar-radius) * 9999);
     --scalar-font: "Inter", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
     "Noto Color Emoji";
     --scalar-font-code: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
@@ -431,7 +436,7 @@
   list-style: none;
 }
 :where(.scalar-app) input:where(:not([type="button"], [type="reset"], [type="submit"])), :where(.scalar-app) select, :where(.scalar-app) textarea {
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
   border-width: 1px;
 }
 :where(.scalar-app) input, :where(.scalar-app) select, :where(.scalar-app) textarea {
@@ -459,7 +464,6 @@
   background-clip: text !important;
 }
 :where(.scalar-app) :focus-visible {
-  border-radius: var(--scalar-radius);
   outline-style: solid;
 }
 :where(.scalar-app) button:focus-visible, :where(.scalar-app) [role="button"]:focus-visible {
@@ -852,7 +856,7 @@
   display: block;
 }
 .scalar-app .markdown img {
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
   max-width: 100%;
   display: inline-block;
   overflow: hidden;
@@ -901,7 +905,7 @@
 .scalar-app .markdown table {
   table-layout: fixed;
   border: var(--scalar-border-width) solid var(--scalar-border-color);
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
   border-spacing: 0;
   width: max-content;
   max-width: 100%;
@@ -959,10 +963,10 @@
   border-left-color: #0000;
 }
 .scalar-app .markdown th:first-of-type {
-  border-top-left-radius: var(--scalar-radius);
+  border-top-left-radius: var(--scalar-radius-md);
 }
 .scalar-app .markdown th:last-of-type {
-  border-top-right-radius: var(--scalar-radius);
+  border-top-right-radius: var(--scalar-radius-md);
 }
 .scalar-app .markdown tr > [align="left"] {
   text-align: left;
@@ -992,13 +996,13 @@
   width: calc(100% - calc(var(--markdown-spacing-md) * 2));
 }
 .scalar-app .markdown summary {
+  border-radius: var(--scalar-radius);
   min-height: 40px;
   font-weight: var(--scalar-semibold);
   line-height: var(--markdown-line-height);
   cursor: pointer;
   -webkit-user-select: none;
   user-select: none;
-  border-radius: 2.5px;
   align-items: flex-start;
   gap: 8px;
   padding: 7px 14px;
@@ -1099,7 +1103,7 @@
   background-color: var(--scalar-background-2);
   box-shadow: 0 0 0 var(--scalar-border-width) var(--scalar-border-color);
   font-size: var(--scalar-micro);
-  border-radius: 2px;
+  border-radius: var(--scalar-radius-md);
   padding: 0 3px;
 }
 .scalar-app .markdown .hljs {
@@ -1162,7 +1166,7 @@
   opacity: 1;
 }
 .scalar-app .markdown .markdown-alert {
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
   background-color: var(--scalar-background-2);
   align-items: stretch;
 }
@@ -1463,7 +1467,7 @@
 :where(body) > .scalar-tooltip:before {
   content: "";
   z-index: calc(1 * -1);
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
   background-color: var(--scalar-tooltip-background);
   --tw-backdrop-blur: blur(8px);
   -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
@@ -1595,19 +1599,19 @@
 .scalar-virtual-text-search-input[data-v-95edadbb]::-webkit-search-cancel-button {
   display: none;
 }
-.scalar-virtual-text[data-v-b50a85e1]:focus {
+.scalar-virtual-text[data-v-77b9d685]:focus {
   outline: none;
 }
-.scalar-virtual-text-highlight[data-v-b50a85e1] {
+.scalar-virtual-text-highlight[data-v-77b9d685] {
   background: var(--scalar-background-accent);
   color: inherit;
-  border-radius: 2px;
+  border-radius: var(--scalar-radius);
   padding: 1px 0;
 }
-.scalar-virtual-text-highlight-active[data-v-b50a85e1] {
+.scalar-virtual-text-highlight-active[data-v-77b9d685] {
   background: var(--scalar-color-accent);
   color: var(--scalar-background-1);
-  border-radius: 2px;
+  border-radius: var(--scalar-radius);
 }
 .sidebar-heading-type[data-v-bdef8365] {
   text-transform: uppercase;
@@ -2758,19 +2762,25 @@
   border-radius: 0 !important;
 }
 .scalar-app .rounded {
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
+}
+.scalar-app .rounded-2xl {
+  border-radius: var(--scalar-radius-2xl);
+}
+.scalar-app .rounded-3xl {
+  border-radius: var(--scalar-radius-3xl);
 }
 .scalar-app .rounded-\[inherit\] {
   border-radius: inherit;
 }
 .scalar-app .rounded-full {
-  border-radius: 9999px;
+  border-radius: var(--scalar-radius-full);
 }
 .scalar-app .rounded-lg {
   border-radius: var(--scalar-radius-lg);
 }
 .scalar-app .rounded-md {
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
 }
 .scalar-app .rounded-none {
   border-radius: 0;
@@ -2782,8 +2792,8 @@
   border-radius: var(--scalar-radius-xl);
 }
 .scalar-app .rounded-t {
-  border-top-left-radius: var(--scalar-radius);
-  border-top-right-radius: var(--scalar-radius);
+  border-top-left-radius: var(--scalar-radius-md);
+  border-top-right-radius: var(--scalar-radius-md);
 }
 .scalar-app .rounded-t-lg {
   border-top-left-radius: var(--scalar-radius-lg);
@@ -2794,8 +2804,8 @@
   border-top-right-radius: var(--scalar-radius-xl);
 }
 .scalar-app .rounded-b {
-  border-bottom-right-radius: var(--scalar-radius);
-  border-bottom-left-radius: var(--scalar-radius);
+  border-bottom-right-radius: var(--scalar-radius-md);
+  border-bottom-left-radius: var(--scalar-radius-md);
 }
 .scalar-app .rounded-b-lg {
   border-bottom-right-radius: var(--scalar-radius-lg);
@@ -3602,6 +3612,10 @@
   --tw-shadow: 0 0 #0000;
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
 }
+.scalar-app .ring {
+  --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+}
 .scalar-app .outline {
   outline-style: var(--tw-outline-style);
   outline-width: 1px;
@@ -3786,7 +3800,7 @@
   gap: 4px;
 }
 :is(.scalar-app .\*\:rounded > *) {
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
 }
 :is(.scalar-app .\*\:rounded-none > *) {
   border-radius: 0;
@@ -4039,7 +4053,7 @@
 }
 .scalar-app .after\:rounded:after {
   content: var(--tw-content);
-  border-radius: var(--scalar-radius);
+  border-radius: var(--scalar-radius-md);
 }
 .scalar-app .after\:bg-blue:after {
   content: var(--tw-content);
@@ -4058,8 +4072,8 @@
   border-top-right-radius: inherit;
 }
 :is(.scalar-app .\*\:first\:rounded-l > *):first-child {
-  border-top-left-radius: var(--scalar-radius);
-  border-bottom-left-radius: var(--scalar-radius);
+  border-top-left-radius: var(--scalar-radius-md);
+  border-bottom-left-radius: var(--scalar-radius-md);
 }
 :is(.scalar-app .\*\:first\:border-t-0 > *):first-child, :is(.scalar-app .first\:\*\:border-t-0:first-child > *) {
   border-top-style: var(--tw-border-style);
@@ -4078,8 +4092,8 @@
   border-right-width: 0;
 }
 :is(.scalar-app .\*\:last\:rounded-r > *):last-child {
-  border-top-right-radius: var(--scalar-radius);
-  border-bottom-right-radius: var(--scalar-radius);
+  border-top-right-radius: var(--scalar-radius-md);
+  border-bottom-right-radius: var(--scalar-radius-md);
 }
 .scalar-app .last-of-type\:first-of-type\:border-b-0:last-of-type:first-of-type {
   border-bottom-style: var(--tw-border-style);
@@ -4924,23 +4938,23 @@ to {
 /*
    Deep styling for customizing Codemirror
   */
-[data-v-d6fb2049] .cm-editor {
+[data-v-dfc591f4] .cm-editor {
   height: 100%;
   outline: none;
   padding: 0;
   background: transparent;
 }
-[data-v-d6fb2049] .cm-placeholder {
+[data-v-dfc591f4] .cm-placeholder {
   color: var(--scalar-color-3);
 }
-[data-v-d6fb2049] .cm-content {
+[data-v-dfc591f4] .cm-content {
   font-family: var(--scalar-font-code);
   font-size: var(--scalar-small);
   max-height: 20px;
   padding: 8px 0;
 }
 /* Tooltip helper */
-[data-v-d6fb2049] .cm-tooltip {
+[data-v-dfc591f4] .cm-tooltip {
   background: transparent !important;
   filter: brightness(var(--scalar-lifted-brightness));
   border-radius: var(--scalar-radius);
@@ -4949,43 +4963,43 @@ to {
   outline: none !important;
   overflow: hidden !important;
 }
-[data-v-d6fb2049] .cm-tooltip-autocomplete ul li {
+[data-v-dfc591f4] .cm-tooltip-autocomplete ul li {
   padding: 3px 6px !important;
 }
-[data-v-d6fb2049] .cm-completionIcon-type:after {
+[data-v-dfc591f4] .cm-completionIcon-type:after {
   color: var(--scalar-color-3) !important;
 }
-[data-v-d6fb2049] .cm-tooltip-autocomplete ul li[aria-selected] {
+[data-v-dfc591f4] .cm-tooltip-autocomplete ul li[aria-selected] {
   background: var(--scalar-background-2) !important;
   color: var(--scalar-color-1) !important;
 }
-[data-v-d6fb2049] .cm-tooltip-autocomplete ul {
+[data-v-dfc591f4] .cm-tooltip-autocomplete ul {
   padding: 6px !important;
   position: relative;
 }
-[data-v-d6fb2049] .cm-tooltip-autocomplete ul li:hover {
+[data-v-dfc591f4] .cm-tooltip-autocomplete ul li:hover {
   border-radius: 3px;
   color: var(--scalar-color-1) !important;
   background: var(--scalar-background-3) !important;
 }
 /* Disable active line highlighting */
-[data-v-d6fb2049] .cm-activeLine,[data-v-d6fb2049] .cm-activeLineGutter {
+[data-v-dfc591f4] .cm-activeLine,[data-v-dfc591f4] .cm-activeLineGutter {
   background-color: transparent;
 }
 /* Color selection matching */
-[data-v-d6fb2049] .cm-selectionMatch,[data-v-d6fb2049] .cm-matchingBracket {
+[data-v-dfc591f4] .cm-selectionMatch,[data-v-dfc591f4] .cm-matchingBracket {
   border-radius: var(--scalar-radius);
   background: var(--scalar-background-4) !important;
 }
 /* Color Picker Swatches */
-[data-v-d6fb2049] .cm-css-color-picker-wrapper {
+[data-v-dfc591f4] .cm-css-color-picker-wrapper {
   display: inline-flex;
   outline: 1px solid var(--scalar-background-3);
   border-radius: 3px;
   overflow: hidden;
 }
 /* Number gutter */
-[data-v-d6fb2049] .cm-gutters {
+[data-v-dfc591f4] .cm-gutters {
   background-color: transparent;
   border-right: none;
   color: var(--scalar-color-3);
@@ -4993,7 +5007,7 @@ to {
   line-height: 22px;
   border-radius: 0 0 0 3px;
 }
-[data-v-d6fb2049] .cm-gutters:before {
+[data-v-dfc591f4] .cm-gutters:before {
   content: '';
   position: absolute;
   top: 2px;
@@ -5003,7 +5017,7 @@ to {
   border-radius: var(--scalar-radius) 0 0 var(--scalar-radius);
   background-color: var(--scalar-background-1);
 }
-[data-v-d6fb2049] .cm-gutterElement {
+[data-v-dfc591f4] .cm-gutterElement {
   font-family: var(--scalar-font-code) !important;
   padding-left: 0px !important;
   padding-right: 6px !important;
@@ -5012,16 +5026,16 @@ to {
   justify-content: flex-end;
   position: relative;
 }
-[data-v-d6fb2049] .cm-lineNumbers .cm-gutterElement {
+[data-v-dfc591f4] .cm-lineNumbers .cm-gutterElement {
   min-width: fit-content;
 }
-[data-v-d6fb2049] .cm-gutter + .cm-gutter :not(.cm-foldGutter) .cm-gutterElement {
+[data-v-dfc591f4] .cm-gutter + .cm-gutter :not(.cm-foldGutter) .cm-gutterElement {
   padding-left: 0 !important;
 }
-[data-v-d6fb2049] .cm-scroller {
+[data-v-dfc591f4] .cm-scroller {
   overflow: auto;
 }
-.line-wrapping[data-v-d6fb2049]:focus-within .cm-content {
+.line-wrapping[data-v-dfc591f4]:focus-within .cm-content {
   display: inline-table;
   min-height: fit-content;
   padding: 3px 6px;
@@ -5031,9 +5045,8 @@ to {
 .cm-pill {
   color: var(--scalar-color-1) !important;
   padding: 0px 9px;
-  border-radius: 3px;
   display: inline-block;
-  border-radius: 30px;
+  border-radius: var(--scalar-radius-full);
   font-size: var(--scalar-small);
 }
 .light-mode .cm-pill {
@@ -5271,13 +5284,13 @@ to {
 .context-bar-group:has(:focus-visible) .context-bar-group-hover\:hidden[data-v-07ff8fc3] {
   display: none;
 }
-.code-input-lite[data-v-1974e80d] {
+.code-input-lite[data-v-f03d0c9d] {
   /* Flex so the editor centres vertically in whatever height the cell gives us.
      Font properties inherit so we adopt the surrounding typography. */
   display: flex;
   align-items: center;
 }
-.code-input-lite__editor[data-v-1974e80d] {
+.code-input-lite__editor[data-v-f03d0c9d] {
   /* Everything font-related inherits from the surrounding context. */
   font: inherit;
   letter-spacing: inherit;
@@ -5299,14 +5312,14 @@ to {
   /* Positioning context for the absolutely positioned placeholder. */
   position: relative;
 }
-.code-input-lite__editor[data-v-1974e80d]::-webkit-scrollbar {
+.code-input-lite__editor[data-v-f03d0c9d]::-webkit-scrollbar {
   display: none;
 }
 /* Absolute so the placeholder does not occupy flow space inside the
    contenteditable; otherwise the caret would land after it on focus.
    `pointer-events: none` lets clicks fall through to focus the editor.
    Hidden on focus so it never renders on top of the text caret. */
-.code-input-lite--empty .code-input-lite__editor[data-v-1974e80d]:not(:focus)::before {
+.code-input-lite--empty .code-input-lite__editor[data-v-f03d0c9d]:not(:focus)::before {
   content: attr(data-placeholder);
   color: var(--scalar-color-3);
   pointer-events: none;
@@ -5317,14 +5330,14 @@ to {
   display: flex;
   align-items: center;
 }
-.code-input-lite--error .code-input-lite__editor[data-v-1974e80d] {
+.code-input-lite--error .code-input-lite__editor[data-v-f03d0c9d] {
   outline: 1px solid var(--scalar-color-red);
 }
 /* Pill styling. Each pill is `<span contenteditable="false">name</span>` —
    an atomic widget; the caret lands before or after it, never inside. */
 .scalar-pill {
   color: var(--scalar-color-2);
-  border-radius: 30px;
+  border-radius: var(--scalar-radius-full);
   display: inline-block;
   font-family: var(--scalar-font-code);
   font-size: 0.9em;

package/package.json

@@ -19,7 +19,7 @@
     "testing",
     "react"
   ],
-  "version": "2.0.33",
+  "version": "2.0.35",
   "engines": {
     "node": ">=22"
   },
@@ -39,10 +39,10 @@
     "CHANGELOG.md"
   ],
   "dependencies": {
-    "@scalar/api-client": "3.13.4",
-    "@scalar/blocks": "0.1.5",
-    "@scalar/helpers": "0.9.0",
-    "@scalar/workspace-store": "0.55.4"
+    "@scalar/api-client": "3.13.6",
+    "@scalar/blocks": "0.1.7",
+    "@scalar/helpers": "0.9.1",
+    "@scalar/workspace-store": "0.55.5"
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.1",