amis-ui 6.2.2 → 6.3.0

package/lib/themes/dark.css

@@ -3873,6 +3873,10 @@
   --inputTime-hover-bg-color: var(--colors-neutral-fill-10);
   --inputTime-active-color: var(--colors-neutral-text-2);
   --inputTime-active-bg-color: var(--colors-brand-10);
+  --signature-tool-height: 2.5rem;
+  --signature-tool-margin-top: 0.5rem;
+  --signature-placeholder-gap: 0.625rem;
+  --signature-placeholder-color: var(--colors-neutral-line-6);
   --steps-base-color: var(--colors-neutral-text-2);
   --steps-base-fontSize: var(--fonts-size-7);
   --steps-base-fontWeight: var(--fonts-weight-6);
@@ -5538,6 +5542,186 @@ div.CodeMirror-dragcursors {
 span.CodeMirror-selectedtext {
   background: none;
 }
+/*
+
+    Name:       Base16 Default Dark
+    Author:     Chris Kempson (http://chriskempson.com)
+
+    CodeMirror template by Jan T. Sott (https://github.com/idleberg/base16-codemirror)
+    Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16)
+
+*/
+.cm-s-base16-dark.CodeMirror {
+  background: #151515;
+  color: #e0e0e0;
+}
+.cm-s-base16-dark div.CodeMirror-selected {
+  background: #303030;
+}
+.cm-s-base16-dark .CodeMirror-line::-moz-selection, .cm-s-base16-dark .CodeMirror-line > span::-moz-selection, .cm-s-base16-dark .CodeMirror-line > span > span::-moz-selection {
+  background: rgba(48, 48, 48, 0.99);
+}
+.cm-s-base16-dark .CodeMirror-line::selection, .cm-s-base16-dark .CodeMirror-line > span::selection, .cm-s-base16-dark .CodeMirror-line > span > span::selection {
+  background: rgba(48, 48, 48, 0.99);
+}
+.cm-s-base16-dark .CodeMirror-line::-moz-selection, .cm-s-base16-dark .CodeMirror-line > span::-moz-selection, .cm-s-base16-dark .CodeMirror-line > span > span::-moz-selection {
+  background: rgba(48, 48, 48, 0.99);
+}
+.cm-s-base16-dark .CodeMirror-gutters {
+  background: #151515;
+  border-right: 0px;
+}
+.cm-s-base16-dark .CodeMirror-guttermarker {
+  color: #ac4142;
+}
+.cm-s-base16-dark .CodeMirror-guttermarker-subtle {
+  color: #505050;
+}
+.cm-s-base16-dark .CodeMirror-linenumber {
+  color: #505050;
+}
+.cm-s-base16-dark .CodeMirror-cursor {
+  border-left: 1px solid #b0b0b0;
+}
+.cm-s-base16-dark.cm-fat-cursor .CodeMirror-cursor {
+  background-color: rgba(142, 141, 136, 0.4588235294) !important;
+}
+.cm-s-base16-dark .cm-animate-fat-cursor {
+  background-color: rgba(142, 141, 136, 0.4588235294) !important;
+}
+.cm-s-base16-dark span.cm-comment {
+  color: #8f5536;
+}
+.cm-s-base16-dark span.cm-atom {
+  color: #aa759f;
+}
+.cm-s-base16-dark span.cm-number {
+  color: #aa759f;
+}
+.cm-s-base16-dark span.cm-property, .cm-s-base16-dark span.cm-attribute {
+  color: #90a959;
+}
+.cm-s-base16-dark span.cm-keyword {
+  color: #ac4142;
+}
+.cm-s-base16-dark span.cm-string {
+  color: #f4bf75;
+}
+.cm-s-base16-dark span.cm-variable {
+  color: #90a959;
+}
+.cm-s-base16-dark span.cm-variable-2 {
+  color: #6a9fb5;
+}
+.cm-s-base16-dark span.cm-def {
+  color: #d28445;
+}
+.cm-s-base16-dark span.cm-bracket {
+  color: #e0e0e0;
+}
+.cm-s-base16-dark span.cm-tag {
+  color: #ac4142;
+}
+.cm-s-base16-dark span.cm-link {
+  color: #aa759f;
+}
+.cm-s-base16-dark span.cm-error {
+  background: #ac4142;
+  color: #b0b0b0;
+}
+.cm-s-base16-dark .CodeMirror-activeline-background {
+  background: #202020;
+}
+.cm-s-base16-dark .CodeMirror-matchingbracket {
+  text-decoration: underline;
+  color: white !important;
+}
+/**
+    Name:       IDEA default theme
+    From IntelliJ IDEA by JetBrains
+ */
+.cm-s-idea span.cm-meta {
+  color: #808000;
+}
+.cm-s-idea span.cm-number {
+  color: #0000FF;
+}
+.cm-s-idea span.cm-keyword {
+  line-height: 1em;
+  font-weight: bold;
+  color: #000080;
+}
+.cm-s-idea span.cm-atom {
+  font-weight: bold;
+  color: #000080;
+}
+.cm-s-idea span.cm-def {
+  color: #000000;
+}
+.cm-s-idea span.cm-variable {
+  color: black;
+}
+.cm-s-idea span.cm-variable-2 {
+  color: black;
+}
+.cm-s-idea span.cm-variable-3, .cm-s-idea span.cm-type {
+  color: black;
+}
+.cm-s-idea span.cm-property {
+  color: black;
+}
+.cm-s-idea span.cm-operator {
+  color: black;
+}
+.cm-s-idea span.cm-comment {
+  color: #808080;
+}
+.cm-s-idea span.cm-string {
+  color: #008000;
+}
+.cm-s-idea span.cm-string-2 {
+  color: #008000;
+}
+.cm-s-idea span.cm-qualifier {
+  color: #555;
+}
+.cm-s-idea span.cm-error {
+  color: #FF0000;
+}
+.cm-s-idea span.cm-attribute {
+  color: #0000FF;
+}
+.cm-s-idea span.cm-tag {
+  color: #000080;
+}
+.cm-s-idea span.cm-link {
+  color: #0000FF;
+}
+.cm-s-idea .CodeMirror-activeline-background {
+  background: #FFFAE3;
+}
+.cm-s-idea span.cm-builtin {
+  color: #30a;
+}
+.cm-s-idea span.cm-bracket {
+  color: #cc7;
+}
+.cm-s-idea {
+  font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
+}
+.cm-s-idea .CodeMirror-matchingbracket {
+  outline: 1px solid grey;
+  color: black !important;
+}
+.CodeMirror-hints.idea {
+  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
+  color: #616569;
+  background-color: #ebf3fd !important;
+}
+.CodeMirror-hints.idea .CodeMirror-hint-active {
+  background-color: #a2b8c9 !important;
+  color: #5c6065 !important;
+}
 /*!
  * froala_editor v3.1.0 (https://www.froala.com/wysiwyg-editor)
  * License https://froala.com/wysiwyg-editor/terms/
@@ -14267,6 +14451,437 @@ body.video-react-full-window .video-react-fullscreen {
 .cropper-disabled .cropper-point {
   cursor: not-allowed;
 }
+/* 默认 CSS 样式，目前主要是 Excel 使用 */
+.ov-excel {
+  /* 从 office 365 中复制的默认字体 */
+  font-family: "Aptos Narrow", "Segoe UI", "Segoe UI Web (West European)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
+  display: flex;
+  flex-direction: column;
+  --bar-bg-color: #f5f5f5;
+  --bar-input-bg-color: #ffffff;
+  --active-sheet-color: #217346;
+}
+.excel-button {
+  height: 32px;
+  color: rgb(255, 255, 255);
+  padding: 0px 11px;
+  box-sizing: border-box;
+  border: 1px solid transparent;
+  display: inline-block;
+  text-decoration: none;
+  text-align: center;
+  cursor: pointer;
+  vertical-align: top;
+  border-radius: 2px;
+  font-size: 14px;
+  font-weight: 600;
+  position: relative;
+  margin-right: 4px;
+  width: 64px;
+}
+.excel-button-primary {
+  background-color: rgb(0, 120, 212);
+}
+/* Excel 工具栏，目前没编辑功能所以还没实现 */
+.ov-excel-toolbar {
+  height: 30px;
+  line-height: 30px;
+}
+.excel-checkbox-list-wrapper .excel-checkbox-list {
+  margin-top: 4px;
+}
+.excel-checkbox-container label {
+  cursor: pointer;
+  padding: 4px 0;
+  display: block;
+}
+.excel-checkbox-container label:hover {
+  background-color: #f6f6f6;
+}
+.excel-checkbox-container input {
+  vertical-align: middle;
+}
+.excel-checkbox-container span {
+  vertical-align: middle;
+}
+.excel-divider {
+  display: block;
+  height: 1px;
+  background-color: rgb(225, 223, 221);
+  margin: 2px 12px 2px;
+  color: rgb(200, 198, 196);
+  border-radius: 0.5px;
+}
+.excel-input {
+  display: inline-block;
+  box-sizing: border-box;
+  width: 100%;
+  border-radius: 4px;
+  padding: 4px 12px;
+  border: 1px solid rgb(209, 209, 209);
+}
+.excel-input-border-less {
+  display: block;
+  border: none;
+  width: 100%;
+  height: 100%;
+  padding: 0 2px;
+}
+.excel-input-border-less:focus {
+  outline: none;
+}
+.excel-select {
+  border-color: rgb(209, 209, 209);
+  border-radius: 4px;
+}
+/* Excel 公式栏 */
+.ov-excel-formula-bar {
+  height: 34px;
+  display: flex;
+  flex-direction: row;
+  background-color: var(--bar-bg-color);
+}
+.ov-excel-formula-bar__name-box {
+  text-align: center;
+  width: 64px;
+  margin: 4px 0 4px 4px;
+  padding: 0 4px;
+  line-height: 26px;
+  border: 1px solid #e1dfdd;
+  background-color: var(--bar-input-bg-color);
+}
+/* fx 按钮 */
+.ov-excel-formula-bar__function-button {
+  width: 30px;
+}
+/* fx 按钮右边的输入框 */
+.ov-excel-formula-bar__text-box {
+  margin: 4px;
+  line-height: 26px;
+  border: 1px solid #e1dfdd;
+  flex: 1;
+  padding: 0 4px;
+  background-color: var(--bar-input-bg-color);
+}
+/* Excel sheet 标签页 */
+.ov-excel-sheet-tab-bar {
+  height: 32px;
+  line-height: 32px;
+  display: flex;
+  flex-direction: row;
+  background-color: var(--bar-bg-color);
+}
+.ov-excel-sheet-tab-bar__nav {
+  display: flex;
+}
+.ov-excel-sheet-tab-bar__nav-icon {
+  height: 16px;
+  padding: 4px 4px;
+}
+.ov-excel-sheet-tab-bar__nav-icon svg {
+  height: 16px;
+  width: 16px;
+}
+.ov-excel-sheet-tab-bar__nav-icon svg path {
+  fill: #b1b1b1;
+}
+.ov-excel-sheet-tab-bar__nav-icon--enabled {
+  cursor: pointer;
+}
+.ov-excel-sheet-tab-bar__nav-icon--enabled svg path {
+  fill: #000000;
+}
+.ov-excel-sheet-tab-bar__menu {
+  position: relative;
+}
+.ov-excel-sheet-tab-bar__menu-icon {
+  cursor: pointer;
+  height: 16px;
+  padding: 4px 8px;
+}
+.ov-excel-sheet-tab-bar__menu-icon svg {
+  height: 16px;
+  width: 16px;
+}
+.ov-excel-sheet-tab-bar__menu-list {
+  background-color: #fff;
+  border-radius: 4px;
+  border: 1px solid rgb(199, 199, 199);
+  box-shadow: rgba(0, 0, 0, 0.133) 0px 3.2px 7.2px 0px, rgba(0, 0, 0, 0.11) 0px 0.6px 1.8px 0px;
+  display: none;
+  position: absolute;
+  bottom: 32px;
+  left: 0;
+  max-height: 400px;
+  overflow-x: hidden;
+  overflow-y: auto;
+  z-index: 15;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.ov-excel-sheet-tab-bar__menu-list-item {
+  padding: 4px 8px;
+  cursor: pointer;
+  white-space: nowrap;
+}
+.ov-excel-sheet-tab-bar__menu-list-item:hover {
+  background-color: #e1dfdd;
+}
+.ov-excel-sheet-tab-bar__menu-list-item--active {
+  background-color: #e1dfdd;
+}
+.ov-excel-sheet-tab-bar__list-container {
+  position: relative;
+  overflow: hidden;
+  flex: 1 1 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.ov-excel-sheet-tab-bar__list-container--enable-left-nav::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: 30px;
+  background-image: linear-gradient(to right, #dcdcdc, rgba(220, 220, 220, 0.1));
+}
+.ov-excel-sheet-tab-bar__list-container--enable-right-nav::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  width: 30px;
+  background-image: linear-gradient(to left, #dcdcdc, rgba(220, 220, 220, 0.1));
+}
+.ov-excel-sheet-tab-bar__list {
+  width: 0;
+  display: flex;
+  flex-direction: row;
+}
+.ov-excel-sheet-tab-bar__list-tab {
+  display: inline-block;
+  position: relative;
+  padding: 0 8px;
+  font-size: 14px;
+  margin: 4px 4px;
+  border-radius: 4px;
+  line-height: 24px;
+  white-space: nowrap;
+}
+.ov-excel-sheet-tab-bar__list-tab:hover {
+  cursor: pointer;
+  background-color: #e1dfdd;
+}
+.ov-excel-sheet-tab-bar__list-tab--active {
+  cursor: default;
+}
+.ov-excel-sheet-tab-bar__list-tab--active::before {
+  content: "";
+  position: absolute;
+  display: inline-block;
+  top: 0;
+  bottom: -4px;
+  left: 0;
+  right: 0;
+  color: transparent;
+  border-bottom: 3px solid var(--active-sheet-color);
+  padding-bottom: 5px;
+  width: calc(100% - 18px);
+  margin: auto;
+  transition: width 0.4s cubic-bezier(0.17, 0.17, 0, 1) 0s;
+}
+.ov-excel-sheet-tab-bar__status {
+  margin-left: 12px;
+  margin-right: 12px;
+}
+.ov-excel-sheet-tab-bar__status-text {
+  margin-right: 16px;
+}
+.ov-excel-sheet-tab-bar__zoom-level {
+  display: flex;
+  flex-direction: row;
+  padding: 0 8px;
+}
+.ov-excel-sheet-tab-bar__zoom-value {
+  margin: 0 8px;
+}
+.ov-excel-sheet-tab-bar__zoom-in,
+.ov-excel-sheet-tab-bar__zoom-out {
+  cursor: pointer;
+}
+/* Excel 内容区域，这个包含表头 */
+.ov-excel-content {
+  flex: 1;
+  position: relative;
+  overflow: hidden;
+  z-index: 1;
+}
+/** Excel 数据区域，不包含表头，目前这个区域主要是给 drawing 用 */
+.ov-excel-data {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  overflow: hidden;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  z-index: 2;
+}
+.ov-excel-canvas {
+  position: absolute;
+  left: 0;
+  top: 0;
+}
+.ov-excel-scrollbar-y {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 3;
+}
+.ov-excel-scrollbar-x {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 3;
+}
+.ov-excel-scrollbar-content-x {
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+.ov-excel-scrollbar-content-y {
+  overflow-x: hidden;
+}
+/** 缩放的控制界面 */
+.ov-excel-resize-box {
+  position: absolute;
+  border: 1px solid #4af;
+  z-index: 3;
+}
+.ov-excel-resize-box-control {
+  position: absolute;
+  width: 14px;
+  height: 14px;
+  border-radius: 50%;
+  border: 2px solid #fff;
+  box-sizing: border-box;
+  background: #4af;
+  border: 2px solid #fff;
+  z-index: 5;
+}
+.ov-excel-auto-filter-icon-container {
+  position: absolute;
+}
+.ov-excel-auto-filter-icon {
+  cursor: pointer;
+  position: absolute;
+  right: 2px;
+  top: 2px;
+  bottom: 2px;
+  z-index: 3;
+}
+.ov-excel-auto-filter-icon svg {
+  width: 100%;
+  height: 100%;
+}
+.ov-excel-auto-filter-menu {
+  position: absolute;
+  display: none;
+  flex-direction: column;
+  right: -240px;
+  width: 240px;
+  height: 440px;
+  border-radius: 4px;
+  box-shadow: rgba(0, 0, 0, 0.133) 0px 3.2px 7.2px 0px, rgba(0, 0, 0, 0.11) 0px 0.6px 1.8px 0px;
+  z-index: 4;
+  background-color: white;
+}
+.excel-auto-filter__menu-sort {
+  display: flex;
+  flex-direction: row;
+  -moz-column-gap: 4px;
+       column-gap: 4px;
+  padding: 8px;
+}
+.ov-excel-auto-filter__sort-button {
+  cursor: pointer;
+  flex: 1;
+  display: flex;
+  flex-direction: row;
+  line-height: 24px;
+  height: 24px;
+  padding: 2px;
+}
+.ov-excel-auto-filter__sort-button-text {
+  flex: 1;
+}
+.ov-excel-auto-filter__sort-button-icon {
+  height: 24px;
+  width: 24px;
+}
+.ov-excel-auto-filter__sort-button-icon svg {
+  height: 100%;
+  width: 100%;
+}
+.ov-excel-auto-filter__sort-button:hover {
+  background-color: #f5f5f5;
+}
+.ov-excel-auto-filter__sort-button-active {
+  background-color: #f5f5f5;
+}
+.ov-excel-auto-filter__menu-filter-filters {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+}
+.ov-excel-auto-filter__menu-filter-filters .excel-checkbox-list-wrapper {
+  display: flex;
+  flex-grow: 1;
+  flex-direction: column;
+  padding: 8px;
+  min-height: 0;
+}
+.ov-excel-auto-filter__menu-filter-filters .excel-checkbox-list {
+  flex-grow: 1;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+.ov-excel-auto-filter-menu__custom-filters {
+  display: flex;
+  flex-direction: column;
+  padding: 8px;
+}
+/** 单个规则 */
+.ov-excel-auto-filter-menu__custom-filters-item-input {
+  display: flex;
+  flex-direction: row;
+  margin-bottom: 4px;
+}
+.ov-excel-auto-filter-menu__custom-filters-item-input > select {
+  margin-right: 4px;
+}
+.ov-excel-auto-filter-menu__custom-filters .excel-radio-wrapper {
+  margin: 4px 0;
+  text-align: center;
+}
+.excel-cell-editor {
+  position: absolute;
+}
+.excel-chart {
+  position: absolute;
+  z-index: 10;
+}
+.excel-pic {
+  position: absolute;
+  z-index: 10;
+  overflow: hidden;
+}
 /*!
  * https://github.com/arqex/react-datetime
  */
@@ -19405,7 +20020,12 @@ input[type=button].dark-Button--block {
   padding: var(--Tabs-linkPadding);
   text-decoration: none;
   cursor: pointer;
-  display: block;
+  display: flex;
+  align-items: center;
+  max-width: 100%;
+  overflow: hidden;
+}
+.dark-Tabs-links > .dark-Tabs-link > a:first-child .dark-Tabs-link-text {
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
@@ -22021,6 +22641,7 @@ input[type=button].dark-Button--block {
 }
 .dark-CBGroup-body-wrapper {
   flex: 1;
+  min-width: 0;
 }
 .dark-CBGroup-body-collapse {
   text-align: center;
@@ -22042,6 +22663,7 @@ input[type=button].dark-Button--block {
 }
 .dark-CBGroup-body-wrapper {
   flex: 1;
+  min-width: 0;
 }
 .dark-CBGroup-toolbar {
   display: flex;
@@ -22181,6 +22803,8 @@ input[type=button].dark-Button--block {
   display: flex;
   flex-direction: row;
   align-items: center;
+  flex: 1;
+  min-width: 0;
 }
 .dark-CBGroupOrItem-body-item > .dark-CBGroupOrItem-dragbar {
   left: 0.625rem;
@@ -22255,11 +22879,22 @@ input[type=button].dark-Button--block {
 .dark-CBFunc-args > div {
   display: inline-block;
 }
+.dark-CBItem {
+  display: flex;
+  flex: 1;
+  min-width: 0;
+  flex-wrap: wrap;
+}
+.dark-CBItem > * {
+  flex-shrink: 0;
+}
 .dark-CBValue {
   position: relative;
   display: inline-block;
   vertical-align: middle;
   margin: 0.1875rem;
+  flex: 1;
+  min-width: 6.25rem;
 }
 .dark-CBFormula {
   position: relative;
@@ -22284,6 +22919,7 @@ input[type=button].dark-Button--block {
   width: 20px;
   text-align: center;
   display: inline-block;
+  align-self: center;
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
@@ -22894,6 +23530,9 @@ input[type=button].dark-Button--block {
 .dark-Crud2-selection, .dark-Crud2-toolbar, .dark-Crud2-body {
   margin-bottom: var(--gap-base);
 }
+.dark-Crud2 .dark-Table-render-wrapper {
+  position: relative;
+}
 .dark-Crud2-selectionLabel {
   display: inline-block;
   vertical-align: top;
@@ -23721,6 +24360,11 @@ input[type=button].dark-Button--block {
 .dark-Table-table > tbody > tr > td.dark-Table-primayCell > .dark-Spinner {
   vertical-align: middle;
 }
+.dark-Table-table > thead > tr > th.dark-Table-primayCell > [data-role=form-item],
+.dark-Table-table > tbody > tr > td.dark-Table-primayCell > [data-role=form-item] {
+  display: inline-block;
+  min-width: 10rem;
+}
 .dark-Table.is-mobile .dark-Table-table > tbody > tr:hover, .dark-Table.is-mobile .dark-Table-table > tbody > tr.is-hovered {
   background: var(--Table-bg);
   border-color: var(--Table-borderColor);
@@ -23788,7 +24432,7 @@ input[type=button].dark-Button--block {
   min-width: 20rem;
   max-width: 40rem;
 }
-.dark-TableCell-searchPopOver .dark-Panel {
+.dark-TableCell-searchPopOver > .dark-Panel {
   margin: 0;
 }
 .dark-TableCell-filterBtn {
@@ -27248,7 +27892,7 @@ input[type=button].dark-Button--block {
   width: 1rem;
   height: 1rem;
 }
-.dark-ImageGallery-title {
+.dark-ImageGallery-title, .dark-ImageGallery-caption {
   height: 1.125rem;
   vertical-align: top;
   line-height: 1.125rem;
@@ -27257,6 +27901,10 @@ input[type=button].dark-Button--block {
   text-align: center;
   margin-bottom: 18px;
 }
+.dark-ImageGallery-caption {
+  text-align: left;
+  margin-bottom: 4px;
+}
 .dark-ImageGallery-main {
   background: #000;
   flex-basis: 0;
@@ -27716,6 +28364,7 @@ input[type=button].dark-Button--block {
   border-color: var(--Form-input-onDisabled-borderColor);
 }
 .dark-InputBox-clear {
+  visibility: hidden;
   padding: var(--Form-input-clearBtn-padding);
   cursor: pointer;
   display: flex;
@@ -27728,6 +28377,7 @@ input[type=button].dark-Button--block {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-InputBox-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -27735,6 +28385,9 @@ input[type=button].dark-Button--block {
 .dark-InputBox-clear:active svg {
   fill: var(--Form-input-clearBtn-color-onActive);
 }
+.dark-InputBox.is-focused .dark-InputBox-clear, .dark-InputBox:hover .dark-InputBox-clear {
+  visibility: visible;
+}
 .dark-InputBox > svg {
   display: inline-block;
   width: 14px;
@@ -27800,6 +28453,7 @@ input[type=button].dark-Button--block {
   min-width: 80px;
   max-width: 150px;
   flex: 1;
+  display: flex;
 }
 .dark-JSONSchemaMember-key > span {
   display: flex;
@@ -27814,6 +28468,9 @@ input[type=button].dark-Button--block {
   align-items: center;
   color: var(--Form-input-color);
 }
+.dark-JSONSchemaMember-key > * {
+  flex: 1;
+}
 .dark-JSONSchemaMember-key.is-mobile > span {
   border-radius: 0;
   border: none;
@@ -27975,10 +28632,14 @@ input[type=button].dark-Button--block {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
-  gap: var(--gap-sm);
+  gap: var(--gap-xs);
+  font-size: var(--fonts-size-8);
   align-items: stretch;
   position: relative;
 }
+.dark-SchemaEditorItem--mini > button {
+  padding: 0 4px;
+}
 .dark-SchemaEditorItem + .dark-SchemaEditorItem {
   margin-top: var(--gap-sm);
 }
@@ -27986,12 +28647,12 @@ input[type=button].dark-Button--block {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
-  gap: var(--gap-sm);
+  gap: var(--gap-xs);
   align-items: flex-start;
   width: 100%;
 }
 .dark-SchemaEditor-itemsLabel {
-  margin-top: calc((var(--Form-input-height) - var(--Switch-height)) / 2);
+  line-height: 2rem;
 }
 .dark-SchemaEditor-caret {
   display: inline-block;
@@ -28025,6 +28686,56 @@ input[type=button].dark-Button--block {
 .dark-SchemaEditor-key > input, .dark-SchemaEditor-title > input, .dark-SchemaEditor-description > input {
   flex-basis: 0;
 }
+.dark-SchemaEditor-info {
+  display: flex;
+  background: var(--Form-input-bg);
+  border: var(--Form-input-borderWidth) solid var(--Form-input-borderColor);
+  border-radius: var(--Form-input-borderRadius);
+  line-height: var(--Form-input-lineHeight);
+  padding: var(--Form-input-paddingY) var(--Form-input-paddingX);
+  font-size: var(--Form-input-fontSize);
+  flex-wrap: wrap;
+  justify-content: flex-start;
+  flex: 1;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+}
+.dark-SchemaEditor-info input {
+  flex-basis: 1.875rem;
+  flex-grow: 1;
+  outline: none;
+  background: transparent;
+  border: none;
+  color: var(--Form-input-color);
+  width: 100%;
+}
+.dark-SchemaEditor-info input::-moz-placeholder {
+  color: var(--Form-input-placeholderColor);
+  -moz-user-select: none;
+       user-select: none;
+}
+.dark-SchemaEditor-info input::placeholder {
+  color: var(--Form-input-placeholderColor);
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.dark-SchemaEditor-info:hover {
+  border-color: var(--Form-input-onFocused-borderColor);
+}
+.dark-SchemaEditor-info--borderHalf {
+  border-left-color: transparent !important;
+  border-right-color: transparent !important;
+  border-top-color: transparent !important;
+}
+.dark-SchemaEditor-info--borderNone {
+  border-color: transparent !important;
+}
+.dark-SchemaEditor-typeLabel {
+  color: var(--Form-input-placeholderColor);
+}
 .dark-ResultBox {
   display: flex;
   background: var(--Form-input-bg);
@@ -28182,6 +28893,7 @@ input[type=button].dark-Button--block {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-ResultBox-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -28326,6 +29038,7 @@ input[type=button].dark-Button--block {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-ResultBox.is-mobile .dark-ResultBox-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -29797,6 +30510,7 @@ fieldset.dark-Collapse .dark-Collapse-header.is-mobile:hover {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-TextControl-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -29814,9 +30528,6 @@ fieldset.dark-Collapse .dark-Collapse-header.is-mobile:hover {
     display: inline-flex;
   }
 }
-.dark-TextControl .InputText-clear {
-  content: var(--input-clearable-icon);
-}
 .dark-TextControl-clear {
   padding: 0 var(--Form-input-clearBtn-padding);
 }
@@ -30134,6 +30845,9 @@ fieldset.dark-Collapse .dark-Collapse-header.is-mobile:hover {
   width: var(--input-password-invisible-icon-size);
   height: var(--input-password-invisible-icon-size);
 }
+.InputText-clear.icon {
+  content: var(--input-clearable-icon);
+}
 input.dark-TextControl-input-password {
   flex-basis: 0;
 }
@@ -30232,6 +30946,7 @@ input.dark-TextControl-input-password {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-TextareaControl-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -30320,6 +31035,7 @@ input.dark-TextControl-input-password {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-TextareaControl-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -32726,6 +33442,7 @@ input.dark-TextControl-input-password {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-LocationPicker-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -32916,6 +33633,7 @@ input.dark-TextControl-input-password {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-ColorPicker-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -33092,6 +33810,7 @@ input.dark-TextControl-input-password {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-DatePicker-toggler:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -33124,6 +33843,7 @@ input.dark-TextControl-input-password {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-DatePicker-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -33870,6 +34590,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-DateRangePicker-toggler:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -33902,6 +34623,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-DateRangePicker-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -35537,6 +36259,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-TreeSelect-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -35935,6 +36658,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
 }
 .dark-ComboTabs-addLink > a svg {
   margin-right: var(--gap-xs);
+  top: 0;
 }
 .dark-Combo-dragableTip {
   color: var(--text--muted-color);
@@ -36159,6 +36883,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-Picker-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -36327,6 +37052,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-Picker-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -36562,15 +37288,18 @@ td.rdtQuarter.rdtDisabled:hover > span {
   border-color: var(--Form-input-onError-borderColor);
   background: var(--Form-input-onError-bg);
 }
-.dark-TagControl-popover.dark-PopOver--leftBottomLeftTop > .dark-ListMenu {
+.dark-TagControl-popover.dark-PopOver--leftBottomLeftTop > .dark-ListMenu,
+.dark-ListMenu-popover.dark-PopOver--leftBottomLeftTop > .dark-ListMenu {
   border-top-left-radius: 0;
   border-top-right-radius: 0;
 }
-.dark-TagControl-popover.dark-PopOver--leftTopLeftBottom > .dark-ListMenu {
+.dark-TagControl-popover.dark-PopOver--leftTopLeftBottom > .dark-ListMenu,
+.dark-ListMenu-popover.dark-PopOver--leftTopLeftBottom > .dark-ListMenu {
   border-bottom-left-radius: 0;
   border-bottom-right-radius: 0;
 }
-.dark-TagControl-popover .dark-ListMenu {
+.dark-TagControl-popover .dark-ListMenu,
+.dark-ListMenu-popover .dark-ListMenu {
   padding: 0.25rem 0;
   max-height: var(--inputTag-popover-maxHeight);
   overflow: auto;
@@ -36578,7 +37307,8 @@ td.rdtQuarter.rdtDisabled:hover > span {
      -moz-user-select: none;
           user-select: none;
 }
-.dark-TagControl-popover .dark-ListMenu-item {
+.dark-TagControl-popover .dark-ListMenu-item,
+.dark-ListMenu-popover .dark-ListMenu-item {
   height: var(--inputTag-option-height);
   color: var(--inputTag-option-color);
   font-size: var(--inputTag-option-fontSize);
@@ -36587,7 +37317,8 @@ td.rdtQuarter.rdtDisabled:hover > span {
   padding: var(--inputTag-option-paddingTop) var(--inputTag-option-paddingRight) var(--inputTag-option-paddingBottom) var(--inputTag-option-paddingLeft);
   background: var(--inputTag-option-bg-color);
 }
-.dark-TagControl-popover .dark-ListMenu-item:hover {
+.dark-TagControl-popover .dark-ListMenu-item:hover,
+.dark-ListMenu-popover .dark-ListMenu-item:hover {
   color: var(--inputTag-option-hover-color);
   background: var(--inputTag-option-hover-bg-color);
 }
@@ -37445,6 +38176,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-IconPickerControl-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -37650,6 +38382,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   fill: var(--Form-input-clearBtn-color);
   width: var(--Form-input-clearBtn-size);
   height: var(--Form-input-clearBtn-size);
+  top: 0;
 }
 .dark-IconSelectControl-clear:hover svg {
   fill: var(--Form-input-clearBtn-color-onHover);
@@ -38556,6 +39289,14 @@ td.rdtQuarter.rdtDisabled:hover > span {
     display: none;
   }
 }
+.dark-Autofill-popOver {
+  border: none;
+  min-width: 20rem;
+  max-width: 40rem;
+}
+.dark-Autofill-popOver > .dark-Panel {
+  margin: 0;
+}
 .dark-UserSelect {
   position: relative;
 }
@@ -39464,6 +40205,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   overflow: visible;
   max-width: 100%;
   box-sizing: content-box;
+  min-height: 28.125rem;
   /* 变量列表 */
   /* 函数列表 */
 }
@@ -39471,8 +40213,55 @@ td.rdtQuarter.rdtDisabled:hover > span {
   flex: 1;
   height: 100%;
   max-width: 33.125rem;
+  min-width: 0;
   border-top: var(--Form-input-borderWidth) solid var(--Form-input-borderColor);
   border-bottom: var(--Form-input-borderWidth) solid var(--Form-input-borderColor);
+  display: flex;
+  flex-direction: column;
+}
+.dark-FormulaEditor-runPanel {
+  height: 12.5rem;
+  transition: height 0.1s ease-out;
+  border-top: 1px solid var(--Form-input-borderColor);
+  display: flex;
+  flex-wrap: nowrap;
+  flex-direction: row;
+}
+.dark-FormulaEditor-runPanel.in {
+  height: 0;
+  overflow: hidden;
+}
+.dark-FormulaEditor-runPanel-context, .dark-FormulaEditor-runPanel-result {
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+}
+.dark-FormulaEditor-runPanel-context > header, .dark-FormulaEditor-runPanel-result > header {
+  width: 100%;
+  height: 1.875rem;
+  line-height: 1.875rem;
+  padding: 0 0.625rem;
+  box-sizing: border-box;
+  background: var(--InputFormula-header-bgColor);
+  border-radius: var(--borderRadius) var(--borderRadius) 0 0;
+  border-bottom: none;
+  font-weight: 500;
+  margin: 0;
+}
+.dark-FormulaEditor-runPanel-context > div, .dark-FormulaEditor-runPanel-result > div {
+  flex: 1;
+  min-height: 0;
+  font-size: 12px;
+}
+.dark-FormulaEditor-runPanel-context {
+  border-right: 1px solid var(--Form-input-borderColor);
+}
+.dark-FormulaEditor-runPanel-result > div {
+  padding: 0 0.625rem;
+}
+.dark-FormulaEditor-runPanel-result.is-error {
+  color: var(--Form-input-onError-borderColor);
 }
 .dark-FormulaEditor-header {
   width: 100%;
@@ -39493,8 +40282,8 @@ td.rdtQuarter.rdtDisabled:hover > span {
   margin-right: 5px;
 }
 .dark-FormulaEditor-editor {
-  min-height: 12.5rem;
-  height: calc(100% - 35px);
+  flex: 1;
+  min-height: 0;
   padding: 0.3125rem;
   padding-right: 0;
 }
@@ -39853,24 +40642,6 @@ td.rdtQuarter.rdtDisabled:hover > span {
   overflow: hidden;
   background: var(--InputFormula-code-bgColor);
 }
-.dark-FormulaEditor .cm-field,
-.dark-FormulaEditor .cm-func {
-  border-radius: 3px;
-  color: #fff;
-  margin: 0 1px;
-  padding: 0 2px;
-}
-.dark-FormulaEditor .cm-field {
-  padding: 2px 5px;
-}
-.dark-FormulaEditor .cm-field {
-  background: #007bff;
-}
-.dark-FormulaEditor .cm-func {
-  color: #ae4597;
-  font-weight: bold;
-  line-height: 14px;
-}
 .dark-FormulaPicker {
   display: flex;
   flex-flow: row nowrap;
@@ -39887,8 +40658,9 @@ td.rdtQuarter.rdtDisabled:hover > span {
 }
 .dark-FormulaPicker-input {
   flex: 1;
+  min-width: 0;
   margin-right: 0.625rem;
-  padding-right: 0;
+  padding-right: 0.25rem;
   max-width: calc(100% - 2.625rem);
 }
 .dark-FormulaPicker-action {
@@ -39934,7 +40706,7 @@ td.rdtQuarter.rdtDisabled:hover > span {
   height: var(--Form-input-height);
 }
 .dark-FormulaPicker.is-input-group.dark-FormulaPicker--text {
-  padding: var(--Form-input-paddingY) var(--Form-input-paddingX);
+  padding: var(--Form-input-paddingY) var(--Form-input-paddingX) var(--Form-input-paddingY) 0.3125rem;
 }
 .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input {
   display: flex;
@@ -39951,13 +40723,27 @@ td.rdtQuarter.rdtDisabled:hover > span {
   outline: none;
   box-sizing: none;
 }
-.dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-number, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-select, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-boolean, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-date, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-time, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-datetime {
+.dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-select, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-number, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-boolean, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-date, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-time, .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-datetime {
   height: var(--InputFormula-input-schema-height);
   padding-left: var(--Form-input-paddingX);
 }
+.dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-number {
+  padding-left: 0;
+}
 .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-number .dark-Number-handler-wrap {
   height: unset; /* 避免调节器超出Input框 */
 }
+.dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-custom {
+  border: 0;
+  flex: 1;
+  min-width: 0;
+}
+.dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-custom > div {
+  border: 0;
+  padding: 0 0 0 var(--Form-input-paddingX);
+  align-items: center;
+  height: var(--InputFormula-input-schema-height);
+}
 .dark-FormulaPicker.is-input-group .dark-FormulaPicker-input-variable {
   border: none;
   min-height: unset;
@@ -39978,6 +40764,60 @@ td.rdtQuarter.rdtDisabled:hover > span {
   cursor: pointer;
   color: var(--colors-brand-5);
 }
+.dark-FormulaCodeEditor .cm-field,
+.dark-FormulaCodeEditor .cm-func {
+  border-radius: 3px;
+  color: #fff;
+}
+.dark-FormulaCodeEditor .cm-field {
+  padding: 2px 5px;
+}
+.dark-FormulaCodeEditor .cm-field {
+  background: #007bff;
+}
+.dark-FormulaCodeEditor .cm-func {
+  color: #ae4597;
+  font-weight: bold;
+  line-height: 14px;
+}
+.dark-FormulaCodeEditor .cm-error-token {
+  background-position: left bottom;
+  background-repeat: repeat-x;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9sJDw4cOCW1/KIAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAAHElEQVQI12NggIL/DAz/GdA5/xkY/qPKMDAwAADLZwf5rvm+LQAAAABJRU5ErkJggg==);
+}
+.dark-FormulaCodeEditor .CodeMirror-placeholder {
+  color: var(--Form-input-placeholderColor) !important;
+}
+.dark-FormulaCodeEditor .lint-error {
+  color: var(--Form-input-onError-borderColor);
+}
+.dark-FormulaCodeEditor--singleLine {
+  max-width: 100%;
+}
+.dark-FormulaCodeEditor--singleLine > .CodeMirror {
+  height: 21px;
+}
+.dark-FormulaCodeEditor--singleLine > .CodeMirror .CodeMirror-hscrollbar,
+.dark-FormulaCodeEditor--singleLine > .CodeMirror .CodeMirror-vscrollbar {
+  display: none !important;
+}
+.dark-FormulaCodeEditor--singleLine > .CodeMirror .CodeMirror-sizer {
+  min-height: 21px !important;
+  border-right-width: 0 !important;
+}
+.dark-FormulaCodeEditor--singleLine > .CodeMirror .CodeMirror-scroll {
+  height: 21px;
+  margin: 0;
+  padding: 0;
+  overflow: hidden !important;
+}
+.dark-FormulaCodeEditor--singleLine > .CodeMirror .CodeMirror-lines {
+  padding: 0;
+}
+.dark-InputBox > .dark-FormulaCodeEditor {
+  flex: 1;
+  min-width: 0;
+}
 .dark-Timeline-vertical {
   display: flex;
   flex-flow: column;
@@ -41327,6 +42167,140 @@ td.rdtQuarter.rdtDisabled:hover > span {
   overflow: hidden;
   white-space: nowrap;
 }
+.dark-PdfViewer {
+  position: relative;
+  width: 100%;
+  min-width: 300px;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  padding: 50px 0;
+}
+.dark-PdfViewer-Content {
+  width: -moz-max-content;
+  width: max-content;
+  max-width: 100%;
+}
+.dark-PdfViewer-Content.is-loaded {
+  box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 4px 0px;
+}
+.dark-PdfViewer-Loading {
+  width: 100%;
+  text-align: center;
+}
+.dark-PdfViewer-Tool {
+  position: absolute;
+  z-index: 10;
+  padding: 5px 15px;
+  bottom: 60px;
+  background-color: #444444;
+  border-radius: 10px;
+  color: #fff;
+  text-align: center;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.dark-PdfViewer-Tool .gap {
+  margin: 0 4px;
+}
+.dark-PdfViewer-Tool .icon {
+  cursor: pointer;
+  width: 20px;
+  margin: 0 10px;
+}
+.dark-PdfViewer-Tool .icon:hover {
+  color: var(--colors-brand-5);
+}
+.dark-PdfViewer-Tool .page-input {
+  width: 40px;
+}
+.dark-Signature {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+.dark-Signature-canvas {
+  border: 1px dashed #aaa;
+}
+.dark-Signature-Tool {
+  height: var(--signature-tool-height);
+  margin-top: var(--signature-tool-margin-top);
+}
+.dark-Signature-Tool .actions {
+  display: flex;
+  justify-content: space-between;
+}
+.dark-Signature-Tool .actions .left-actions button {
+  margin-right: 5px;
+}
+.dark-Signature-Tool .actions .right-actions button {
+  margin-left: 5px;
+}
+.dark-Signature-placeholder {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: var(--signature-tool-height);
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: var(--signature-placeholder-gap);
+  color: var(--signature-placeholder-color);
+}
+.dark-Signature-Embed {
+  display: flex;
+  gap: 10px;
+}
+.dark-Signature-Embed-Preview {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  margin-left: 10px;
+  height: 30px;
+  margin: 1px;
+  padding: 2px;
+  border: 1px dashed #aaa;
+}
+.dark-Signature-Embed-Preview .preview-close {
+  cursor: pointer;
+  font-size: 14px;
+  color: #aaa;
+}
+.dark-Signature-Embed-Preview .preview-close:hover {
+  color: #000;
+}
+.dark-Signature-Embed-Preview img {
+  height: 24px;
+}
+.dark-Signature-Embed-Body {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.dark-Signature.is-fullScreen, .dark-Signature-Embed-Body.is-fullScreen {
+  flex-direction: row-reverse;
+  justify-content: space-between;
+  align-items: stretch;
+}
+.dark-Signature.is-fullScreen .dark-Signature-Tool, .dark-Signature-Embed-Body.is-fullScreen .dark-Signature-Tool {
+  width: calc(var(--signature-tool-height) - var(--signature-tool-margin-top));
+  height: auto;
+  margin-top: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.dark-Signature.is-fullScreen .dark-Signature-Tool .actions, .dark-Signature-Embed-Body.is-fullScreen .dark-Signature-Tool .actions {
+  white-space: nowrap;
+  transform: rotate(90deg);
+}
 @media print {
   .pe-no-print {
     display: none !important;