@zuilib/text-editor 0.7.0 → 0.7.2

package/dist/styles.css

@@ -378,19 +378,14 @@
   display: flex;
   gap: 0.125rem;
   padding: 0.125rem;
-  border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
-  border-radius: 0.5rem;
-  background: #ffffff;
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
+  border: 1px solid var(--border, color-mix(in srgb, currentColor 12%, transparent));
+  border-radius: var(--radius-md, 0.5rem);
+  background: var(--popover, #ffffff);
+  color: var(--popover-foreground, inherit);
+  box-shadow: var(--shadow-medium, 0 1px 4px rgba(0, 0, 0, 0.08));
   transform: translateY(-70%);
 }
 
-.dark .zui-table-settings {
-  background: #232329;
-  border-color: rgba(255, 255, 255, 0.1);
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
-}
-
 /*
  * Drawing canvas.
  *
@@ -653,31 +648,27 @@
   background: color-mix(in srgb, var(--zui-drawing-accent) 14%, transparent);
 }
 
-/* Contextual properties: a second row that expands under the tools */
+/*
+ * Properties: the color for the selection (or for the next shape when
+ * nothing is selected) plus contextual connector options. Inline in the
+ * tools row, so showing them never changes the row height, and only
+ * visible while the canvas is active (focused).
+ */
 .zui-drawing-props-host {
-  flex-basis: 100%;
-  display: flex;
-  max-height: 0;
-  overflow: hidden;
-  opacity: 0;
-  pointer-events: none;
-  transition:
-    max-height 0.18s ease,
-    opacity 0.18s ease;
+  display: none;
+  align-items: center;
 }
 
-.zui-drawing-props-host.is-visible {
-  max-height: 6rem;
-  opacity: 1;
-  pointer-events: auto;
+.zui-drawing-canvas:focus-within .zui-drawing-props-host {
+  display: flex;
 }
 
 .zui-drawing-props {
   display: flex;
-  flex-wrap: wrap;
   align-items: center;
   gap: 0.25rem;
-  padding: 0.25rem 0 0.125rem;
+  padding-left: 0.5rem;
+  border-left: 1px solid color-mix(in srgb, currentColor 15%, transparent);
 }
 
 .zui-drawing-props-group {
@@ -704,7 +695,7 @@
   height: 1rem;
   margin: 0 0.125rem;
   padding: 0;
-  border: 1px solid rgba(0, 0, 0, 0.18);
+  border: 2px solid rgba(0, 0, 0, 0.18);
   border-radius: 999px;
   cursor: pointer;
   transition:
@@ -722,16 +713,6 @@
     0 0 0 3.5px var(--zui-drawing-accent);
 }
 
-.zui-drawing-swatch.is-transparent {
-  background-image: linear-gradient(
-    45deg,
-    transparent 44%,
-    #e03131 44%,
-    #e03131 56%,
-    transparent 56%
-  );
-}
-
 /* Empty state */
 .zui-drawing-empty {
   position: absolute;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zuilib/text-editor",
-  "version": "0.7.0",
+  "version": "0.7.2",
   "description": "ZUI — A markdown editor component wrapping Lexical",
   "type": "module",
   "main": "./dist/index.js",