@mantine-vue/code-highlight 3.4.0 → 3.6.0

package/styles.css

@@ -353,4 +353,566 @@
   padding-bottom: 0;
   gap: var(--mantine-spacing-xs);
 }
+._root_z2quo_1 {
+  --jv-radius: var(--mantine-radius-sm);
+  --jv-fz: calc(0.8125rem * var(--mantine-scale));
+  --jv-indent: calc(1rem * var(--mantine-scale));
+
+  position: relative;
+  direction: ltr;
+  font-family: var(--mantine-font-family-monospace);
+  font-size: var(--jv-fz);
+  line-height: 1.55;
+  border-radius: var(--jv-radius);
+}
+
+  :where([data-mantine-color-scheme='light']) ._root_z2quo_1 {
+    background-color: var(--mantine-color-gray-0);
+}
+
+  :where([data-mantine-color-scheme='dark']) ._root_z2quo_1 {
+    background-color: var(--mantine-color-dark-8);
+}
+
+  ._root_z2quo_1[data-with-border] {
+    border: calc(0.0625rem * var(--mantine-scale)) solid;
+  }
+
+  :where([data-mantine-color-scheme='light']) ._root_z2quo_1[data-with-border] {
+      border-color: var(--mantine-color-gray-3);
+}
+
+  :where([data-mantine-color-scheme='dark']) ._root_z2quo_1[data-with-border] {
+      border-color: var(--mantine-color-dark-4);
+}
+
+._controls_z2quo_34 {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--mantine-spacing-xs);
+  padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
+  border-bottom: calc(0.0625rem * var(--mantine-scale)) solid;
+}
+
+._copyAllButton_z2quo_41 ~ ._controls_z2quo_34 {
+    padding-right: calc(44px + var(--mantine-spacing-xs));
+  }
+
+:where([data-mantine-color-scheme='light']) ._controls_z2quo_34 {
+    border-color: var(--mantine-color-gray-3);
+}
+
+:where([data-mantine-color-scheme='dark']) ._controls_z2quo_34 {
+    border-color: var(--mantine-color-dark-4);
+}
+
+._control_z2quo_34 {
+  font-size: var(--mantine-font-size-xs);
+  white-space: nowrap;
+  padding: calc(0.125rem * var(--mantine-scale)) calc(0.5rem * var(--mantine-scale));
+  border-radius: var(--mantine-radius-sm);
+}
+
+:where([data-mantine-color-scheme='light']) ._control_z2quo_34 {
+    background-color: var(--mantine-color-gray-1);
+    color: var(--mantine-color-gray-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._control_z2quo_34 {
+    background-color: var(--mantine-color-dark-6);
+    color: var(--mantine-color-dark-1);
+}
+
+@media (hover: hover) {
+    :where([data-mantine-color-scheme='light']) ._control_z2quo_34:hover {
+      background-color: var(--mantine-color-gray-2);
+  }
+
+    :where([data-mantine-color-scheme='dark']) ._control_z2quo_34:hover {
+      background-color: var(--mantine-color-dark-5);
+  }
+}
+
+@media (hover: none) {
+    :where([data-mantine-color-scheme='light']) ._control_z2quo_34:active {
+      background-color: var(--mantine-color-gray-2);
+  }
+
+    :where([data-mantine-color-scheme='dark']) ._control_z2quo_34:active {
+      background-color: var(--mantine-color-dark-5);
+  }
+}
+
+._scrollarea_z2quo_81 {
+  max-width: 100%;
+}
+
+._content_z2quo_85 {
+  padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
+  overflow: hidden;
+}
+
+._wrapper_z2quo_89 > ._content_z2quo_85 {
+    flex: 1;
+    min-width: min-content;
+  }
+
+._lineNumbers_z2quo_95 {
+  display: flex;
+  flex-direction: column;
+  user-select: none;
+  text-align: right;
+  padding: var(--mantine-spacing-xs) var(--mantine-spacing-xs);
+  padding-left: var(--mantine-spacing-sm);
+  margin-right: var(--mantine-spacing-xs);
+  border-right: calc(0.0625rem * var(--mantine-scale)) solid;
+  box-sizing: content-box;
+  min-width: 2ch;
+}
+
+:where([data-mantine-color-scheme='light']) ._lineNumbers_z2quo_95 {
+    color: var(--mantine-color-gray-7);
+    border-color: var(--mantine-color-gray-3);
+}
+
+:where([data-mantine-color-scheme='dark']) ._lineNumbers_z2quo_95 {
+    color: var(--mantine-color-dark-2);
+    border-color: var(--mantine-color-dark-4);
+}
+
+._lineNumbers_z2quo_95 > div {
+    padding: calc(0.0625rem * var(--mantine-scale)) 0;
+    line-height: 1.55;
+    display: flex;
+    align-items: flex-start;
+    justify-content: flex-end;
+    box-sizing: border-box;
+  }
+
+._wrapper_z2quo_89 {
+  display: flex;
+  align-items: stretch;
+}
+
+._node_z2quo_132 {
+  position: relative;
+}
+
+._node_z2quo_132[data-highlight] > ._row_z2quo_135 {
+    position: relative;
+  }
+
+._node_z2quo_132[data-highlight] > ._row_z2quo_135 > * {
+      z-index: 1;
+    }
+
+._node_z2quo_132[data-highlight] > ._row_z2quo_135 > :not(._toggle_z2quo_142) {
+      position: relative;
+    }
+
+._node_z2quo_132[data-highlight] > ._row_z2quo_135::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: calc(-62.5rem * var(--mantine-scale));
+      right: calc(-62.5rem * var(--mantine-scale));
+      z-index: 0;
+      pointer-events: none;
+    }
+
+:where([data-mantine-color-scheme='light']) ._node_z2quo_132[data-highlight='added'] > ._row_z2quo_135::before {
+      background-color: var(--mantine-color-green-1);
+}
+
+:where([data-mantine-color-scheme='dark']) ._node_z2quo_132[data-highlight='added'] > ._row_z2quo_135::before {
+      background-color: rgba(64, 192, 87, 0.15);
+}
+
+:where([data-mantine-color-scheme='light']) ._node_z2quo_132[data-highlight='removed'] > ._row_z2quo_135::before {
+      background-color: var(--mantine-color-red-1);
+}
+
+:where([data-mantine-color-scheme='dark']) ._node_z2quo_132[data-highlight='removed'] > ._row_z2quo_135::before {
+      background-color: rgba(250, 82, 82, 0.15);
+}
+
+._row_z2quo_135 {
+  display: flex;
+  align-items: flex-start;
+  gap: calc(0.375rem * var(--mantine-scale));
+  min-height: calc(1.5rem * var(--mantine-scale));
+  padding: calc(0.0625rem * var(--mantine-scale)) calc(0.25rem * var(--mantine-scale));
+  border-radius: var(--mantine-radius-sm);
+  width: 100%;
+  text-align: left;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+._row_z2quo_135:focus-visible {
+    outline: 2px solid var(--mantine-primary-color-filled);
+    outline-offset: calc(-0.125rem * var(--mantine-scale));
+  }
+
+._row_z2quo_135 ._copyButton_z2quo_197 {
+    opacity: 0;
+    transition: opacity 100ms ease;
+  }
+
+._row_z2quo_135:focus-within ._copyButton_z2quo_197 {
+    opacity: 1;
+  }
+
+@media (hover: hover) {
+      ._row_z2quo_135[data-hoverable]:hover ._copyButton_z2quo_197 {
+        opacity: 1;
+      }
+}
+
+@media (hover: none) {
+      ._row_z2quo_135[data-hoverable]:active ._copyButton_z2quo_197 {
+        opacity: 1;
+      }
+}
+
+._row_z2quo_135[data-hoverable]:not([data-root]) {
+    cursor: default;
+  }
+
+@media (hover: hover) {
+      :where([data-mantine-color-scheme='light']) ._row_z2quo_135[data-hoverable]:not([data-root]):hover {
+        background-color: var(--mantine-color-gray-1);
+  }
+
+      :where([data-mantine-color-scheme='dark']) ._row_z2quo_135[data-hoverable]:not([data-root]):hover {
+        background-color: var(--mantine-color-dark-6);
+  }
+}
+
+@media (hover: none) {
+      :where([data-mantine-color-scheme='light']) ._row_z2quo_135[data-hoverable]:not([data-root]):active {
+        background-color: var(--mantine-color-gray-1);
+  }
+
+      :where([data-mantine-color-scheme='dark']) ._row_z2quo_135[data-hoverable]:not([data-root]):active {
+        background-color: var(--mantine-color-dark-6);
+  }
+}
+
+._toggle_z2quo_142 {
+  position: absolute;
+  left: calc(var(--mantine-spacing-sm) * -1 - 4px);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: calc(1rem * var(--mantine-scale));
+  height: calc(1.5rem * var(--mantine-scale));
+  flex-shrink: 0;
+  cursor: pointer;
+}
+
+:where([data-mantine-color-scheme='light']) ._toggle_z2quo_142 {
+    color: var(--mantine-color-gray-6);
+}
+
+:where([data-mantine-color-scheme='dark']) ._toggle_z2quo_142 {
+    color: var(--mantine-color-dark-3);
+}
+
+._toggle_z2quo_142[data-expanded] {
+    transform: rotate(90deg);
+  }
+
+:where([data-mantine-color-scheme='light']) ._key_z2quo_253 {
+    color: var(--mantine-color-violet-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._key_z2quo_253 {
+    color: var(--mantine-color-violet-4);
+}
+
+._key_z2quo_253 {
+
+  white-space: nowrap;
+  line-height: 1.55;
+}
+
+._value_z2quo_266 {
+  white-space: pre;
+  line-height: 1.55;
+}
+
+._value_z2quo_266[data-wrap] {
+    min-width: 20ch;
+    white-space: pre-wrap;
+    overflow-wrap: anywhere;
+  }
+
+:where([data-mantine-color-scheme='light']) ._value_z2quo_266[data-value-type='string'] {
+      color: var(--mantine-color-teal-8);
+}
+
+:where([data-mantine-color-scheme='dark']) ._value_z2quo_266[data-value-type='string'] {
+      color: var(--mantine-color-teal-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._value_z2quo_266[data-value-type='number'] {
+      color: var(--mantine-color-blue-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._value_z2quo_266[data-value-type='number'] {
+      color: var(--mantine-color-blue-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._value_z2quo_266[data-value-type='boolean'] {
+      color: var(--mantine-color-orange-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._value_z2quo_266[data-value-type='boolean'] {
+      color: var(--mantine-color-orange-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._value_z2quo_266[data-value-type='null'], :where([data-mantine-color-scheme='light']) ._value_z2quo_266[data-value-type='undefined'] {
+      color: var(--mantine-color-red-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._value_z2quo_266[data-value-type='null'], :where([data-mantine-color-scheme='dark']) ._value_z2quo_266[data-value-type='undefined'] {
+      color: var(--mantine-color-red-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._value_z2quo_266[data-value-type='bigint'] {
+      color: var(--mantine-color-blue-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._value_z2quo_266[data-value-type='bigint'] {
+      color: var(--mantine-color-blue-4);
+}
+
+._value_z2quo_266[data-value-type='circular'] {
+    font-style: italic;
+  }
+
+:where([data-mantine-color-scheme='light']) ._value_z2quo_266[data-value-type='circular'] {
+      color: var(--mantine-color-gray-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._value_z2quo_266[data-value-type='circular'] {
+      color: var(--mantine-color-dark-2);
+}
+
+:where([data-mantine-color-scheme='light']) ._bracket_z2quo_340 {
+    color: var(--mantine-color-gray-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._bracket_z2quo_340 {
+    color: var(--mantine-color-dark-2);
+}
+
+._type_z2quo_350 {
+  font-size: calc(var(--jv-fz) * 0.85);
+  padding: 0 calc(0.25rem * var(--mantine-scale));
+  border-radius: var(--mantine-radius-xs);
+  white-space: nowrap;
+  flex-shrink: 0;
+  align-self: center;
+}
+
+:where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='string'] {
+      background-color: var(--mantine-color-teal-0);
+      color: var(--mantine-color-teal-8);
+}
+
+:where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='string'] {
+      background-color: rgba(18, 184, 134, 0.15);
+      color: var(--mantine-color-teal-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='number'], :where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='bigint'] {
+      background-color: var(--mantine-color-blue-0);
+      color: var(--mantine-color-blue-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='number'], :where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='bigint'] {
+      background-color: rgba(34, 139, 230, 0.15);
+      color: var(--mantine-color-blue-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='boolean'] {
+      background-color: var(--mantine-color-orange-0);
+      color: var(--mantine-color-orange-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='boolean'] {
+      background-color: rgba(253, 126, 20, 0.15);
+      color: var(--mantine-color-orange-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='null'], :where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='undefined'] {
+      background-color: var(--mantine-color-red-0);
+      color: var(--mantine-color-red-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='null'], :where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='undefined'] {
+      background-color: rgba(250, 82, 82, 0.15);
+      color: var(--mantine-color-red-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='circular'] {
+      background-color: var(--mantine-color-gray-1);
+      color: var(--mantine-color-gray-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='circular'] {
+      background-color: var(--mantine-color-dark-6);
+      color: var(--mantine-color-dark-2);
+}
+
+:where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='array'] {
+      background-color: var(--mantine-color-cyan-0);
+      color: var(--mantine-color-cyan-8);
+}
+
+:where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='array'] {
+      background-color: rgba(21, 170, 191, 0.15);
+      color: var(--mantine-color-cyan-4);
+}
+
+:where([data-mantine-color-scheme='light']) ._type_z2quo_350[data-value-type='object'] {
+      background-color: var(--mantine-color-grape-0);
+      color: var(--mantine-color-grape-8);
+}
+
+:where([data-mantine-color-scheme='dark']) ._type_z2quo_350[data-value-type='object'] {
+      background-color: rgba(190, 75, 219, 0.15);
+      color: var(--mantine-color-grape-4);
+}
+
+._size_z2quo_445 {
+  font-size: calc(var(--jv-fz) * 0.85);
+  white-space: nowrap;
+  flex-shrink: 0;
+  align-self: center;
+}
+
+:where([data-mantine-color-scheme='light']) ._size_z2quo_445 {
+    color: var(--mantine-color-gray-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._size_z2quo_445 {
+    color: var(--mantine-color-dark-3);
+}
+
+:where([data-mantine-color-scheme='light']) ._ellipsis_z2quo_460 {
+    color: var(--mantine-color-gray-7);
+}
+
+:where([data-mantine-color-scheme='dark']) ._ellipsis_z2quo_460 {
+    color: var(--mantine-color-dark-3);
+}
+
+._ellipsis_z2quo_460[data-clickable] {
+    font-size: calc(var(--jv-fz) * 0.85);
+    cursor: pointer;
+    text-decoration: underline;
+    text-decoration-style: dotted;
+    white-space: nowrap;
+    flex-shrink: 0;
+  }
+
+@media (hover: hover) {
+
+  ._ellipsis_z2quo_460[data-clickable]:hover {
+      text-decoration-style: solid;
+  }
+}
+
+@media (hover: none) {
+
+  ._ellipsis_z2quo_460[data-clickable]:active {
+      text-decoration-style: solid;
+  }
+}
+
+._copyButton_z2quo_197 {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: calc(1.25rem * var(--mantine-scale));
+  height: calc(1.25rem * var(--mantine-scale));
+  flex-shrink: 0;
+  cursor: pointer;
+  border-radius: var(--mantine-radius-xs);
+}
+
+:where([data-mantine-color-scheme='light']) ._copyButton_z2quo_197 {
+    color: var(--mantine-color-gray-6);
+}
+
+:where([data-mantine-color-scheme='dark']) ._copyButton_z2quo_197 {
+    color: var(--mantine-color-dark-3);
+}
+
+@media (hover: hover) {
+    :where([data-mantine-color-scheme='light']) ._copyButton_z2quo_197:hover {
+      color: var(--mantine-color-gray-7);
+      background-color: var(--mantine-color-gray-2);
+  }
+
+    :where([data-mantine-color-scheme='dark']) ._copyButton_z2quo_197:hover {
+      color: var(--mantine-color-dark-1);
+      background-color: var(--mantine-color-dark-5);
+  }
+}
+
+@media (hover: none) {
+    :where([data-mantine-color-scheme='light']) ._copyButton_z2quo_197:active {
+      color: var(--mantine-color-gray-7);
+      background-color: var(--mantine-color-gray-2);
+  }
+
+    :where([data-mantine-color-scheme='dark']) ._copyButton_z2quo_197:active {
+      color: var(--mantine-color-dark-1);
+      background-color: var(--mantine-color-dark-5);
+  }
+}
+
+._copyAllButton_z2quo_41 {
+  position: absolute;
+  top: calc(0.5rem * var(--mantine-scale));
+  right: calc(0.5rem * var(--mantine-scale));
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: calc(1.75rem * var(--mantine-scale));
+  height: calc(1.75rem * var(--mantine-scale));
+  border-radius: var(--mantine-radius-sm);
+  opacity: 0.5;
+}
+
+:where([data-mantine-color-scheme='light']) ._copyAllButton_z2quo_41 {
+    color: var(--mantine-color-gray-7);
+    background-color: var(--mantine-color-gray-0);
+}
+
+:where([data-mantine-color-scheme='dark']) ._copyAllButton_z2quo_41 {
+    color: var(--mantine-color-dark-1);
+    background-color: var(--mantine-color-dark-8);
+}
+
+@media (hover: hover) {
+
+  ._copyAllButton_z2quo_41:hover {
+    opacity: 1;
+  }
+}
+
+@media (hover: none) {
+
+  ._copyAllButton_z2quo_41:active {
+    opacity: 1;
+  }
+}
 /*$vite$:1*/