microboard-temp 0.14.43 → 0.14.45

package/dist/cjs/browser.js

@@ -649,6 +649,7 @@ __export(exports_browser, {
   sha256: () => sha256,
   semanticColor: () => semanticColor,
   selectionActions: () => selectionActions,
+  selectionActionSections: () => selectionActionSections,
   scalePatterns: () => scalePatterns,
   scaleElementBy: () => scaleElementBy,
   rgbToRgba: () => rgbToRgba,
@@ -661,6 +662,7 @@ __export(exports_browser, {
   renderLinkToHTML: () => renderLinkToHTML,
   relativeLuminance: () => relativeLuminance,
   registerToolOverlay: () => registerToolOverlay,
+  registerSelectionActionSection: () => registerSelectionActionSection,
   registerSelectionAction: () => registerSelectionAction,
   registerItemOverlay: () => registerItemOverlay,
   registerItem: () => registerItem,
@@ -683,6 +685,7 @@ __export(exports_browser, {
   matchesOverlayCondition: () => matchesOverlayCondition,
   listToolOverlays: () => listToolOverlays,
   listSelectionActions: () => listSelectionActions,
+  listSelectionActionSections: () => listSelectionActionSections,
   listRegisteredItemTypes: () => listRegisteredItemTypes,
   listCreateSurfaceEntries: () => listCreateSurfaceEntries,
   itemSchemas: () => itemSchemas2,
@@ -11786,6 +11789,7 @@ var itemOverlays = {};
 var toolOverlays = {};
 var dynamicOptionsResolvers = {};
 var selectionActions = {};
+var selectionActionSections = {};
 function registerItemOverlay(overlay) {
   itemOverlays[overlay.itemType] = overlay;
 }
@@ -11795,6 +11799,9 @@ function registerToolOverlay(overlay) {
 function registerSelectionAction(action) {
   selectionActions[action.id] = action;
 }
+function registerSelectionActionSection(section) {
+  selectionActionSections[section.id] = section;
+}
 function registerDynamicOptionsResolver(id, resolver) {
   dynamicOptionsResolvers[id] = resolver;
 }
@@ -11850,6 +11857,9 @@ function listCreateSurfaceEntries() {
 function listSelectionActions() {
   return Object.values(selectionActions);
 }
+function listSelectionActionSections() {
+  return Object.values(selectionActionSections);
+}
 function getSelectionOverlayActions(items) {
   return Object.values(selectionActions).filter((action) => action.isAvailable?.(items) ?? true);
 }
@@ -43627,7 +43637,7 @@ var addTextToolOverlay = {
   kind: "create",
   createsItemType: "RichText",
   family: "text",
-  icon: overlayAssetIcon("src/Items/RichText/icons/Text.icon.svg"),
+  icon: symbolIcon("AddText"),
   description: "Creates editable rich text. The current first pass has no pre-placement defaults on this tool.",
   launch: { kind: "activate-tool" },
   surface: {
@@ -50309,7 +50319,7 @@ var connectorOverlay = {
     {
       id: "connector.switchPointers",
       label: "Switch arrows",
-      icon: connectorAssetIcon("SwitchPointers"),
+      icon: symbolIcon("Switch"),
       target: "selection",
       invoke: { kind: "operation", class: "Connector", method: "switchPointers" }
     },
@@ -73913,52 +73923,89 @@ class Presence {
 function everyItemHasRichText(items) {
   return items.length > 0 && items.every((item) => !!item.getRichText?.());
 }
+registerSelectionActionSection({
+  id: "selectionTextSize",
+  label: "Text size",
+  actionIds: ["selection.text.fontSize"]
+});
+registerSelectionActionSection({
+  id: "selectionTextColors",
+  label: "Text colors",
+  actionIds: ["selection.text.color", "selection.text.highlight"]
+});
+registerSelectionActionSection({
+  id: "selectionArrange",
+  label: "Arrange",
+  actionIds: ["selection.bringToFront", "selection.sendToBack"]
+});
+registerSelectionActionSection({
+  id: "selectionActions",
+  label: "Actions",
+  actionIds: [
+    "selection.duplicate",
+    "selection.lock",
+    "selection.unlock",
+    "selection.delete"
+  ]
+});
 registerSelectionAction({
   id: "selection.delete",
   label: "Delete",
-  icon: overlayAssetIcon("src/Overlay/icons/Delete.icon.svg"),
+  icon: symbolIcon("Delete"),
   description: "Removes the selected items from the board.",
   invoke: { kind: "selectionMethod", methodName: "removeFromBoard" },
+  sectionId: "selectionActions",
+  order: 4,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.duplicate",
   label: "Duplicate",
-  icon: overlayAssetIcon("src/Overlay/icons/Duplicate.icon.svg"),
+  icon: symbolIcon("Duplicate"),
   description: "Duplicates the selected items.",
   invoke: { kind: "selectionMethod", methodName: "duplicate" },
+  sectionId: "selectionActions",
+  order: 1,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.lock",
   label: "Lock",
-  icon: overlayAssetIcon("src/Overlay/icons/Lock.icon.svg"),
+  icon: symbolIcon("unlock"),
   description: "Locks the selected items.",
   invoke: { kind: "selectionMethod", methodName: "lock" },
+  sectionId: "selectionActions",
+  order: 2,
   isAvailable: (items) => items.length > 0 && !items.some((item) => item.transformation.isLocked)
 });
 registerSelectionAction({
   id: "selection.unlock",
   label: "Unlock",
-  icon: overlayAssetIcon("src/Overlay/icons/Unlock.icon.svg"),
+  icon: symbolIcon("lock"),
   description: "Unlocks the selected items.",
   invoke: { kind: "selectionMethod", methodName: "unlock" },
+  sectionId: "selectionActions",
+  order: 2,
   isAvailable: (items) => items.some((item) => item.transformation.isLocked)
 });
 registerSelectionAction({
   id: "selection.bringToFront",
   label: "Bring to front",
-  icon: overlayAssetIcon("src/Overlay/icons/BringToFront.icon.svg"),
+  icon: symbolIcon("BringToFront"),
   description: "Moves the selection above overlapping items.",
   invoke: { kind: "selectionMethod", methodName: "bringToFront" },
+  sectionId: "selectionArrange",
+  order: 1,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.sendToBack",
   label: "Send to back",
-  icon: overlayAssetIcon("src/Overlay/icons/SendToBack.icon.svg"),
+  icon: symbolIcon("SendToBack"),
   description: "Moves the selection behind overlapping items.",
   invoke: { kind: "selectionMethod", methodName: "sendToBack" },
+  sectionId: "selectionArrange",
+  order: 2,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
@@ -73966,6 +74013,8 @@ registerSelectionAction({
   label: "Font size",
   icon: styleFontSizeIcon(),
   invoke: { kind: "selectionMethod", methodName: "setFontSize" },
+  sectionId: "selectionTextSize",
+  order: 1,
   controls: [
     {
       id: "fontSize",
@@ -73987,10 +74036,12 @@ registerSelectionAction({
 registerSelectionAction({
   id: "selection.text.color",
   label: "Text color",
-  icon: styleColorIcon({
+  icon: symbolIcon("TextColor", {
     swatch: { kind: "selectionProperty", property: "getFontColor" }
   }),
   invoke: { kind: "selectionMethod", methodName: "setFontColor" },
+  sectionId: "selectionTextColors",
+  order: 1,
   controls: [
     {
       id: "fontColor",
@@ -74008,11 +74059,12 @@ registerSelectionAction({
 registerSelectionAction({
   id: "selection.text.highlight",
   label: "Highlight",
-  icon: {
-    ...overlayAssetIcon("src/Items/Screen/icons/Background.icon.svg"),
-    state: { swatch: { kind: "selectionProperty", property: "getFontHighlight" } }
-  },
+  icon: symbolIcon("TextHighlight", {
+    swatch: { kind: "selectionProperty", property: "getFontHighlight" }
+  }),
   invoke: { kind: "selectionMethod", methodName: "setFontHighlight" },
+  sectionId: "selectionTextColors",
+  order: 2,
   controls: [
     {
       id: "fontHighlight",

package/dist/cjs/index.js

@@ -649,6 +649,7 @@ __export(exports_src, {
   sha256: () => sha256,
   semanticColor: () => semanticColor,
   selectionActions: () => selectionActions,
+  selectionActionSections: () => selectionActionSections,
   scalePatterns: () => scalePatterns,
   scaleElementBy: () => scaleElementBy,
   rgbToRgba: () => rgbToRgba,
@@ -661,6 +662,7 @@ __export(exports_src, {
   renderLinkToHTML: () => renderLinkToHTML,
   relativeLuminance: () => relativeLuminance,
   registerToolOverlay: () => registerToolOverlay,
+  registerSelectionActionSection: () => registerSelectionActionSection,
   registerSelectionAction: () => registerSelectionAction,
   registerItemOverlay: () => registerItemOverlay,
   registerItem: () => registerItem,
@@ -683,6 +685,7 @@ __export(exports_src, {
   matchesOverlayCondition: () => matchesOverlayCondition,
   listToolOverlays: () => listToolOverlays,
   listSelectionActions: () => listSelectionActions,
+  listSelectionActionSections: () => listSelectionActionSections,
   listRegisteredItemTypes: () => listRegisteredItemTypes,
   listCreateSurfaceEntries: () => listCreateSurfaceEntries,
   itemSchemas: () => itemSchemas2,
@@ -11786,6 +11789,7 @@ var itemOverlays = {};
 var toolOverlays = {};
 var dynamicOptionsResolvers = {};
 var selectionActions = {};
+var selectionActionSections = {};
 function registerItemOverlay(overlay) {
   itemOverlays[overlay.itemType] = overlay;
 }
@@ -11795,6 +11799,9 @@ function registerToolOverlay(overlay) {
 function registerSelectionAction(action) {
   selectionActions[action.id] = action;
 }
+function registerSelectionActionSection(section) {
+  selectionActionSections[section.id] = section;
+}
 function registerDynamicOptionsResolver(id, resolver) {
   dynamicOptionsResolvers[id] = resolver;
 }
@@ -11850,6 +11857,9 @@ function listCreateSurfaceEntries() {
 function listSelectionActions() {
   return Object.values(selectionActions);
 }
+function listSelectionActionSections() {
+  return Object.values(selectionActionSections);
+}
 function getSelectionOverlayActions(items) {
   return Object.values(selectionActions).filter((action) => action.isAvailable?.(items) ?? true);
 }
@@ -43627,7 +43637,7 @@ var addTextToolOverlay = {
   kind: "create",
   createsItemType: "RichText",
   family: "text",
-  icon: overlayAssetIcon("src/Items/RichText/icons/Text.icon.svg"),
+  icon: symbolIcon("AddText"),
   description: "Creates editable rich text. The current first pass has no pre-placement defaults on this tool.",
   launch: { kind: "activate-tool" },
   surface: {
@@ -50309,7 +50319,7 @@ var connectorOverlay = {
     {
       id: "connector.switchPointers",
       label: "Switch arrows",
-      icon: connectorAssetIcon("SwitchPointers"),
+      icon: symbolIcon("Switch"),
       target: "selection",
       invoke: { kind: "operation", class: "Connector", method: "switchPointers" }
     },
@@ -73913,52 +73923,89 @@ class Presence {
 function everyItemHasRichText(items) {
   return items.length > 0 && items.every((item) => !!item.getRichText?.());
 }
+registerSelectionActionSection({
+  id: "selectionTextSize",
+  label: "Text size",
+  actionIds: ["selection.text.fontSize"]
+});
+registerSelectionActionSection({
+  id: "selectionTextColors",
+  label: "Text colors",
+  actionIds: ["selection.text.color", "selection.text.highlight"]
+});
+registerSelectionActionSection({
+  id: "selectionArrange",
+  label: "Arrange",
+  actionIds: ["selection.bringToFront", "selection.sendToBack"]
+});
+registerSelectionActionSection({
+  id: "selectionActions",
+  label: "Actions",
+  actionIds: [
+    "selection.duplicate",
+    "selection.lock",
+    "selection.unlock",
+    "selection.delete"
+  ]
+});
 registerSelectionAction({
   id: "selection.delete",
   label: "Delete",
-  icon: overlayAssetIcon("src/Overlay/icons/Delete.icon.svg"),
+  icon: symbolIcon("Delete"),
   description: "Removes the selected items from the board.",
   invoke: { kind: "selectionMethod", methodName: "removeFromBoard" },
+  sectionId: "selectionActions",
+  order: 4,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.duplicate",
   label: "Duplicate",
-  icon: overlayAssetIcon("src/Overlay/icons/Duplicate.icon.svg"),
+  icon: symbolIcon("Duplicate"),
   description: "Duplicates the selected items.",
   invoke: { kind: "selectionMethod", methodName: "duplicate" },
+  sectionId: "selectionActions",
+  order: 1,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.lock",
   label: "Lock",
-  icon: overlayAssetIcon("src/Overlay/icons/Lock.icon.svg"),
+  icon: symbolIcon("unlock"),
   description: "Locks the selected items.",
   invoke: { kind: "selectionMethod", methodName: "lock" },
+  sectionId: "selectionActions",
+  order: 2,
   isAvailable: (items) => items.length > 0 && !items.some((item) => item.transformation.isLocked)
 });
 registerSelectionAction({
   id: "selection.unlock",
   label: "Unlock",
-  icon: overlayAssetIcon("src/Overlay/icons/Unlock.icon.svg"),
+  icon: symbolIcon("lock"),
   description: "Unlocks the selected items.",
   invoke: { kind: "selectionMethod", methodName: "unlock" },
+  sectionId: "selectionActions",
+  order: 2,
   isAvailable: (items) => items.some((item) => item.transformation.isLocked)
 });
 registerSelectionAction({
   id: "selection.bringToFront",
   label: "Bring to front",
-  icon: overlayAssetIcon("src/Overlay/icons/BringToFront.icon.svg"),
+  icon: symbolIcon("BringToFront"),
   description: "Moves the selection above overlapping items.",
   invoke: { kind: "selectionMethod", methodName: "bringToFront" },
+  sectionId: "selectionArrange",
+  order: 1,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.sendToBack",
   label: "Send to back",
-  icon: overlayAssetIcon("src/Overlay/icons/SendToBack.icon.svg"),
+  icon: symbolIcon("SendToBack"),
   description: "Moves the selection behind overlapping items.",
   invoke: { kind: "selectionMethod", methodName: "sendToBack" },
+  sectionId: "selectionArrange",
+  order: 2,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
@@ -73966,6 +74013,8 @@ registerSelectionAction({
   label: "Font size",
   icon: styleFontSizeIcon(),
   invoke: { kind: "selectionMethod", methodName: "setFontSize" },
+  sectionId: "selectionTextSize",
+  order: 1,
   controls: [
     {
       id: "fontSize",
@@ -73987,10 +74036,12 @@ registerSelectionAction({
 registerSelectionAction({
   id: "selection.text.color",
   label: "Text color",
-  icon: styleColorIcon({
+  icon: symbolIcon("TextColor", {
     swatch: { kind: "selectionProperty", property: "getFontColor" }
   }),
   invoke: { kind: "selectionMethod", methodName: "setFontColor" },
+  sectionId: "selectionTextColors",
+  order: 1,
   controls: [
     {
       id: "fontColor",
@@ -74008,11 +74059,12 @@ registerSelectionAction({
 registerSelectionAction({
   id: "selection.text.highlight",
   label: "Highlight",
-  icon: {
-    ...overlayAssetIcon("src/Items/Screen/icons/Background.icon.svg"),
-    state: { swatch: { kind: "selectionProperty", property: "getFontHighlight" } }
-  },
+  icon: symbolIcon("TextHighlight", {
+    swatch: { kind: "selectionProperty", property: "getFontHighlight" }
+  }),
   invoke: { kind: "selectionMethod", methodName: "setFontHighlight" },
+  sectionId: "selectionTextColors",
+  order: 2,
   controls: [
     {
       id: "fontHighlight",

package/dist/cjs/node.js

@@ -1686,6 +1686,7 @@ __export(exports_node, {
   sha256: () => sha256,
   semanticColor: () => semanticColor,
   selectionActions: () => selectionActions,
+  selectionActionSections: () => selectionActionSections,
   scalePatterns: () => scalePatterns,
   scaleElementBy: () => scaleElementBy,
   rgbToRgba: () => rgbToRgba,
@@ -1698,6 +1699,7 @@ __export(exports_node, {
   renderLinkToHTML: () => renderLinkToHTML,
   relativeLuminance: () => relativeLuminance,
   registerToolOverlay: () => registerToolOverlay,
+  registerSelectionActionSection: () => registerSelectionActionSection,
   registerSelectionAction: () => registerSelectionAction,
   registerItemOverlay: () => registerItemOverlay,
   registerItem: () => registerItem,
@@ -1720,6 +1722,7 @@ __export(exports_node, {
   matchesOverlayCondition: () => matchesOverlayCondition,
   listToolOverlays: () => listToolOverlays,
   listSelectionActions: () => listSelectionActions,
+  listSelectionActionSections: () => listSelectionActionSections,
   listRegisteredItemTypes: () => listRegisteredItemTypes,
   listCreateSurfaceEntries: () => listCreateSurfaceEntries,
   itemSchemas: () => itemSchemas2,
@@ -12822,6 +12825,7 @@ var itemOverlays = {};
 var toolOverlays = {};
 var dynamicOptionsResolvers = {};
 var selectionActions = {};
+var selectionActionSections = {};
 function registerItemOverlay(overlay) {
   itemOverlays[overlay.itemType] = overlay;
 }
@@ -12831,6 +12835,9 @@ function registerToolOverlay(overlay) {
 function registerSelectionAction(action) {
   selectionActions[action.id] = action;
 }
+function registerSelectionActionSection(section) {
+  selectionActionSections[section.id] = section;
+}
 function registerDynamicOptionsResolver(id, resolver) {
   dynamicOptionsResolvers[id] = resolver;
 }
@@ -12886,6 +12893,9 @@ function listCreateSurfaceEntries() {
 function listSelectionActions() {
   return Object.values(selectionActions);
 }
+function listSelectionActionSections() {
+  return Object.values(selectionActionSections);
+}
 function getSelectionOverlayActions(items) {
   return Object.values(selectionActions).filter((action) => action.isAvailable?.(items) ?? true);
 }
@@ -46166,7 +46176,7 @@ var addTextToolOverlay = {
   kind: "create",
   createsItemType: "RichText",
   family: "text",
-  icon: overlayAssetIcon("src/Items/RichText/icons/Text.icon.svg"),
+  icon: symbolIcon("AddText"),
   description: "Creates editable rich text. The current first pass has no pre-placement defaults on this tool.",
   launch: { kind: "activate-tool" },
   surface: {
@@ -52781,7 +52791,7 @@ var connectorOverlay = {
     {
       id: "connector.switchPointers",
       label: "Switch arrows",
-      icon: connectorAssetIcon("SwitchPointers"),
+      icon: symbolIcon("Switch"),
       target: "selection",
       invoke: { kind: "operation", class: "Connector", method: "switchPointers" }
     },
@@ -76386,52 +76396,89 @@ class Presence {
 function everyItemHasRichText(items) {
   return items.length > 0 && items.every((item) => !!item.getRichText?.());
 }
+registerSelectionActionSection({
+  id: "selectionTextSize",
+  label: "Text size",
+  actionIds: ["selection.text.fontSize"]
+});
+registerSelectionActionSection({
+  id: "selectionTextColors",
+  label: "Text colors",
+  actionIds: ["selection.text.color", "selection.text.highlight"]
+});
+registerSelectionActionSection({
+  id: "selectionArrange",
+  label: "Arrange",
+  actionIds: ["selection.bringToFront", "selection.sendToBack"]
+});
+registerSelectionActionSection({
+  id: "selectionActions",
+  label: "Actions",
+  actionIds: [
+    "selection.duplicate",
+    "selection.lock",
+    "selection.unlock",
+    "selection.delete"
+  ]
+});
 registerSelectionAction({
   id: "selection.delete",
   label: "Delete",
-  icon: overlayAssetIcon("src/Overlay/icons/Delete.icon.svg"),
+  icon: symbolIcon("Delete"),
   description: "Removes the selected items from the board.",
   invoke: { kind: "selectionMethod", methodName: "removeFromBoard" },
+  sectionId: "selectionActions",
+  order: 4,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.duplicate",
   label: "Duplicate",
-  icon: overlayAssetIcon("src/Overlay/icons/Duplicate.icon.svg"),
+  icon: symbolIcon("Duplicate"),
   description: "Duplicates the selected items.",
   invoke: { kind: "selectionMethod", methodName: "duplicate" },
+  sectionId: "selectionActions",
+  order: 1,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.lock",
   label: "Lock",
-  icon: overlayAssetIcon("src/Overlay/icons/Lock.icon.svg"),
+  icon: symbolIcon("unlock"),
   description: "Locks the selected items.",
   invoke: { kind: "selectionMethod", methodName: "lock" },
+  sectionId: "selectionActions",
+  order: 2,
   isAvailable: (items) => items.length > 0 && !items.some((item) => item.transformation.isLocked)
 });
 registerSelectionAction({
   id: "selection.unlock",
   label: "Unlock",
-  icon: overlayAssetIcon("src/Overlay/icons/Unlock.icon.svg"),
+  icon: symbolIcon("lock"),
   description: "Unlocks the selected items.",
   invoke: { kind: "selectionMethod", methodName: "unlock" },
+  sectionId: "selectionActions",
+  order: 2,
   isAvailable: (items) => items.some((item) => item.transformation.isLocked)
 });
 registerSelectionAction({
   id: "selection.bringToFront",
   label: "Bring to front",
-  icon: overlayAssetIcon("src/Overlay/icons/BringToFront.icon.svg"),
+  icon: symbolIcon("BringToFront"),
   description: "Moves the selection above overlapping items.",
   invoke: { kind: "selectionMethod", methodName: "bringToFront" },
+  sectionId: "selectionArrange",
+  order: 1,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
   id: "selection.sendToBack",
   label: "Send to back",
-  icon: overlayAssetIcon("src/Overlay/icons/SendToBack.icon.svg"),
+  icon: symbolIcon("SendToBack"),
   description: "Moves the selection behind overlapping items.",
   invoke: { kind: "selectionMethod", methodName: "sendToBack" },
+  sectionId: "selectionArrange",
+  order: 2,
   isAvailable: (items) => items.length > 0
 });
 registerSelectionAction({
@@ -76439,6 +76486,8 @@ registerSelectionAction({
   label: "Font size",
   icon: styleFontSizeIcon(),
   invoke: { kind: "selectionMethod", methodName: "setFontSize" },
+  sectionId: "selectionTextSize",
+  order: 1,
   controls: [
     {
       id: "fontSize",
@@ -76460,10 +76509,12 @@ registerSelectionAction({
 registerSelectionAction({
   id: "selection.text.color",
   label: "Text color",
-  icon: styleColorIcon({
+  icon: symbolIcon("TextColor", {
     swatch: { kind: "selectionProperty", property: "getFontColor" }
   }),
   invoke: { kind: "selectionMethod", methodName: "setFontColor" },
+  sectionId: "selectionTextColors",
+  order: 1,
   controls: [
     {
       id: "fontColor",
@@ -76481,11 +76532,12 @@ registerSelectionAction({
 registerSelectionAction({
   id: "selection.text.highlight",
   label: "Highlight",
-  icon: {
-    ...overlayAssetIcon("src/Items/Screen/icons/Background.icon.svg"),
-    state: { swatch: { kind: "selectionProperty", property: "getFontHighlight" } }
-  },
+  icon: symbolIcon("TextHighlight", {
+    swatch: { kind: "selectionProperty", property: "getFontHighlight" }
+  }),
   invoke: { kind: "selectionMethod", methodName: "setFontHighlight" },
+  sectionId: "selectionTextColors",
+  order: 2,
   controls: [
     {
       id: "fontHighlight",