mce 0.12.5 → 0.13.1

package/dist/index.css

@@ -205,6 +205,156 @@
   border-style: solid;
   border-width: 2px;
   color: rgba(var(--mce-theme-primary), 1);
+}.mce-btn {
+  padding: 4px;
+  border-radius: 4px;
+  height: 24px;
+  width: 24px;
+  font-size: 12px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}.mce-layer {
+  position: relative;
+  flex: none;
+  display: flex;
+  align-items: center;
+  height: 32px;
+  font-size: 12px;
+  padding-left: var(--indent-padding, 0);
+  width: 100%;
+  min-width: max-content;
+  border-radius: 4px;
+}
+.mce-layer:before {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 4px;
+  bottom: 4px;
+  background-color: var(--underlay-color, transparent);
+  pointer-events: none;
+  border-radius: inherit;
+}
+.mce-layer:after {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 4px;
+  bottom: 4px;
+  background-color: var(--overlay-color, transparent);
+  pointer-events: none;
+  border-radius: inherit;
+}
+.mce-layer--root {
+  margin-bottom: 4px;
+  font-weight: bold;
+}
+.mce-layer--root .mce-layer__thumbnail {
+  display: none;
+}
+.mce-layer--hover {
+  --overlay-color: rgba(var(--mce-theme-on-background), var(--mce-hover-opacity));
+}
+.mce-layer--active:before {
+  top: 0;
+  bottom: 0;
+  border-radius: 0;
+}
+.mce-layer--first:before {
+  border-top-left-radius: 4px;
+  border-top-right-radius: 4px;
+  top: 4px;
+}
+.mce-layer--last:before {
+  border-bottom-left-radius: 4px;
+  border-bottom-right-radius: 4px;
+  bottom: 4px;
+}
+.mce-layer--active {
+  --underlay-color: rgba(var(--mce-theme-primary), calc(var(--mce-activated-opacity) * 3));
+}
+.mce-layer--active:hover {
+  --overlay-color: rgba(var(--mce-theme-primary), var(--mce-hover-opacity));
+}
+.mce-layer--open .mce-layer__expand .mce-icon {
+  transform: rotate(90deg);
+}
+.mce-layer__expand {
+  display: flex;
+  align-items: center;
+  width: 16px;
+  height: 100%;
+  flex: none;
+}
+.mce-layer__content {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  height: 100%;
+}
+.mce-layer__thumbnail {
+  display: flex;
+  align-items: center;
+  width: 12px;
+  height: 100%;
+  font-size: 12px;
+  overflow: hidden;
+  margin-right: 4px;
+}
+.mce-layer__name {
+  position: relative;
+  flex: 1;
+}
+.mce-layer__input {
+  position: absolute;
+  left: 0;
+  top: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  border: none;
+  outline: 1px solid rgb(var(--mce-theme-primary));
+  font-size: inherit;
+  font-weight: inherit;
+  border-radius: 2px;
+}
+.mce-layer__action {
+  flex: none;
+  display: flex;
+  align-items: center;
+}
+.mce-btn--hide {
+  opacity: 0;
+}
+.mce-btn:hover {
+  background-color: rgb(var(--mce-theme-background));
+}
+.mce-btn + .mce-btn {
+  margin-left: -4px;
+}.mce-layers {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  min-width: auto;
+  overflow: auto;
+  background-color: rgb(var(--mce-theme-surface));
+}
+.mce-layers__wrapper {
+  padding: 8px;
+  width: max-content;
+  min-width: 100%;
+}
+.mce-layers .mce-layer__expand {
+  opacity: 0;
+}
+.mce-layers .mce-layer--root:hover .mce-layer__expand {
+  opacity: 1;
+}
+.mce-layers:hover .mce-layer:not(.mce-layer--root) .mce-layer__expand {
+  opacity: 1;
 }.mce-tooltip {
   background: rgb(var(--mce-theme-surface-variant));
   color: rgb(var(--mce-theme-on-surface-variant));
@@ -303,7 +453,6 @@
 }.mce-transformable {
   left: 0;
   top: 0;
-  color: rgb(var(--mce-theme-primary));
 }
 .mce-transformable__svg {
   position: absolute;
@@ -313,6 +462,7 @@
   height: 100%;
   overflow: visible;
   pointer-events: none;
+  color: rgb(var(--mce-theme-primary));
 }
 .mce-transformable__box {
   stroke: currentColor;
@@ -363,6 +513,34 @@
   border-width: 1px;
   border-style: solid;
   color: rgba(var(--mce-theme-primary), 1);
+}.mce-float-panel {
+  position: absolute;
+  pointer-events: auto !important;
+}
+.mce-float-panel__card {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  border-radius: 12px;
+  background-color: rgb(var(--mce-theme-surface));
+  box-shadow: var(--mce-shadow);
+  overflow: hidden;
+}
+.mce-float-panel__title {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px;
+  font-size: 12px;
+  font-weight: bold;
+  border-bottom: 1px solid rgba(var(--mce-border-color), var(--mce-border-opacity));
+}
+.mce-float-panel__content {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow-y: auto;
 }.mce-layout {
   --mce-scrollbar-offset: 0px;
   display: flex;
@@ -825,105 +1003,6 @@
   width: 100%;
   height: 100%;
   display: block;
-}.mce-layer-item {
-  flex: none;
-  display: flex;
-  align-items: center;
-  height: 24px;
-  font-size: 12px;
-  border-radius: 4px;
-  padding-left: var(--indent-padding, 0);
-  width: 100%;
-  min-width: max-content;
-}
-.mce-layer-item:hover {
-  background-color: rgba(var(--mce-theme-on-background), var(--mce-hover-opacity));
-}
-.mce-layer-item__expand {
-  display: flex;
-  align-items: center;
-  width: 16px;
-  height: 100%;
-  opacity: 0;
-  flex: none;
-}
-.mce-layer-item__content {
-  flex: 1;
-  display: flex;
-  align-items: center;
-  height: 100%;
-}
-.mce-layer-item__thumbnail {
-  display: flex;
-  align-items: center;
-  width: 12px;
-  height: 100%;
-  font-size: 12px;
-  overflow: hidden;
-}
-.mce-layer-item__name {
-  padding: 0 8px;
-}
-.mce-layer-item__name-input {
-  border: none;
-  padding: 0;
-  outline: none;
-  font-size: inherit;
-  font-weight: inherit;
-}
-.mce-layer {
-  flex: none;
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  border-radius: 4px;
-  width: 100%;
-  min-width: max-content;
-}
-.mce-layer--active {
-  background-color: rgba(var(--mce-theme-primary), var(--mce-activated-opacity));
-}
-.mce-layer--opened .mce-layer-item__expand .mce-icon {
-  transform: rotate(90deg);
-}
-.mce-layers {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  width: 100%;
-  height: 100%;
-  min-width: auto;
-  padding: 8px;
-  overflow: auto;
-  background-color: rgb(var(--mce-theme-surface));
-}
-.mce-layers:hover .mce-layer-item__expand {
-  opacity: 1;
-}
-.mce-layers__action {
-  position: absolute;
-  padding-right: 8px;
-  height: 24px;
-  display: flex;
-  align-items: center;
-  background-color: rgb(var(--mce-theme-surface));
-}
-.mce-btn {
-  padding: 4px;
-  border-radius: 4px;
-  height: 24px;
-  width: 24px;
-  font-size: 12px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.mce-btn:hover {
-  background-color: rgb(var(--mce-theme-background));
-}
-.mce-btn + .mce-btn {
-  margin-left: -4px;
 }.mce-dialog > * {
   box-shadow: var(--mce-shadow);
 }