🐛 Fix schema and tooltip

frontend/src/app/main/ui/ds/buttons/icon_button.cljs

@@ -26,7 +26,7 @@
    [:tooltip-placement {:optional true}
     [:maybe [:enum "top" "bottom" "left" "right" "top-right" "bottom-right" "bottom-left" "top-left"]]]
    ;; Indicates that the button has a flyout menu, and should display an indicator
-   [:flyout-indicator {:optional true} :boolean]
+   [:flyout-indicator {:optional true} [:maybe :boolean]]
    [:variant {:optional true}
     [:maybe [:enum "primary" "secondary" "ghost" "destructive" "action"]]]])
 

frontend/src/app/main/ui/ds/buttons/icon_button.scss

@@ -16,6 +16,7 @@
 
   display: grid;
   place-content: center;
+  position: relative;
 }
 
 .icon-button-primary {
@@ -54,7 +55,7 @@
   position: absolute;
   inset-block-end: 4px;
   inset-inline-end: 4px;
-  stroke: var(--stroke-color);
+  stroke: currentcolor;
   fill: none;
   inline-size: $sz-6;
   block-size: $sz-6;

frontend/src/app/main/ui/ds/buttons/icon_button.stories.jsx

@@ -24,6 +24,7 @@ export default {
       options: iconList,
       control: { type: "select" },
     },
+    flyoutIndicator: { control: "boolean" },
     disabled: { control: "boolean" },
     variant: {
       options: ["primary", "secondary", "ghost", "destructive", "action"],
@@ -35,6 +36,7 @@ export default {
     variant: undefined,
     "aria-label": "Lorem ipsum",
     icon: "effects",
+    flyoutIndicator: false,
   },
   render: ({ ...args }) => <IconButton {...args} />,
 };
@@ -70,3 +72,10 @@ export const Destructive = {
     variant: "destructive",
   },
 };
+
+export const Flyout = {
+  args: {
+    variant: "ghost",
+    flyoutIndicator: true,
+  },
+};

frontend/src/app/main/ui/ds/tool_toolbar/tool_toolbar.cljs

@@ -73,12 +73,12 @@
   {::mf/wrap [mf/memo]}
   [{:keys [selected has-flyout title icon on-click aria-haspopup aria-expanded role data-tool]}]
   [:> icon-button* {:variant "ghost"
-                    :title title
                     :aria-haspopup aria-haspopup
                     :aria-expanded aria-expanded
                     :aria-pressed selected
                     :role role
                     :aria-label title
+                    :tooltip-placement "top"
                     :class (stl/css :main-toolbar-options-button)
                     :on-click on-click
                     :icon icon