@bigbluebutton/tldraw 2.0.0-alpha.19

package/dist-esm/lib/ui/hooks/useContextMenuSchema.mjs

@@ -0,0 +1,208 @@
+import { jsx } from "react/jsx-runtime";
+import { track, useEditor, useValue } from "@bigbluebutton/editor";
+import React, { useMemo } from "react";
+import {
+  compactMenuItems,
+  menuCustom,
+  menuGroup,
+  menuItem,
+  menuSubmenu,
+  showMenuPaste,
+  useAllowGroup,
+  useAllowUngroup,
+  useThreeStackableItems
+} from "./menuHelpers.mjs";
+import { useActions } from "./useActions.mjs";
+import { useHasLinkShapeSelected } from "./useHasLinkShapeSelected.mjs";
+import { useOnlyFlippableShape } from "./useOnlyFlippableShape.mjs";
+import { useShowAutoSizeToggle } from "./useShowAutoSizeToggle.mjs";
+const TLUiContextMenuSchemaContext = React.createContext(
+  {}
+);
+const TLUiContextMenuSchemaProvider = track(function TLUiContextMenuSchemaProvider2({
+  overrides,
+  children
+}) {
+  const editor = useEditor();
+  const actions = useActions();
+  const showAutoSizeToggle = useShowAutoSizeToggle();
+  const onlyFlippableShapeSelected = useOnlyFlippableShape();
+  const selectedShapes = editor.getSelectedShapes();
+  const selectedCount = selectedShapes.length;
+  const oneSelected = selectedCount > 0;
+  const twoSelected = selectedCount > 1;
+  const threeSelected = selectedCount > 2;
+  const threeStackableItems = useThreeStackableItems();
+  const atLeastOneShapeOnPage = useValue(
+    "atLeastOneShapeOnPage",
+    () => editor.getCurrentPageShapeIds().size > 0,
+    []
+  );
+  const isTransparentBg = useValue(
+    "isTransparentBg",
+    () => editor.getInstanceState().exportBackground,
+    []
+  );
+  const allowGroup = useAllowGroup();
+  const allowUngroup = useAllowUngroup();
+  const hasClipboardWrite = Boolean(window.navigator.clipboard?.write);
+  const showEditLink = useHasLinkShapeSelected();
+  const onlySelectedShape = editor.getOnlySelectedShape();
+  const allowRemoveFrame = oneSelected && selectedShapes.every((shape) => editor.isShapeOfType(shape, "frame"));
+  const allowFitFrameToContent = onlySelectedShape && editor.isShapeOfType(onlySelectedShape, "frame") && editor.getSortedChildIdsForParent(onlySelectedShape).length > 0;
+  const isShapeLocked = onlySelectedShape && editor.isShapeOrAncestorLocked(onlySelectedShape);
+  const contextTLUiMenuSchema = useMemo(() => {
+    let contextTLUiMenuSchema2 = compactMenuItems([
+      menuGroup(
+        "selection",
+        showAutoSizeToggle && menuItem(actions["toggle-auto-size"]),
+        showEditLink && !isShapeLocked && menuItem(actions["edit-link"]),
+        oneSelected && !isShapeLocked && menuItem(actions["duplicate"]),
+        allowGroup && !isShapeLocked && menuItem(actions["group"]),
+        allowUngroup && !isShapeLocked && menuItem(actions["ungroup"]),
+        allowRemoveFrame && !isShapeLocked && menuItem(actions["remove-frame"]),
+        allowFitFrameToContent && !isShapeLocked && menuItem(actions["fit-frame-to-content"]),
+        oneSelected && menuItem(actions["toggle-lock"])
+      ),
+      menuGroup(
+        "modify",
+        (twoSelected || onlyFlippableShapeSelected) && menuSubmenu(
+          "arrange",
+          "context-menu.arrange",
+          twoSelected && menuGroup(
+            "align",
+            menuItem(actions["align-left"]),
+            menuItem(actions["align-center-horizontal"]),
+            menuItem(actions["align-right"]),
+            menuItem(actions["align-top"]),
+            menuItem(actions["align-center-vertical"]),
+            menuItem(actions["align-bottom"])
+          ),
+          threeSelected && menuGroup(
+            "distribute",
+            menuItem(actions["distribute-horizontal"]),
+            menuItem(actions["distribute-vertical"])
+          ),
+          twoSelected && menuGroup(
+            "stretch",
+            menuItem(actions["stretch-horizontal"]),
+            menuItem(actions["stretch-vertical"])
+          ),
+          onlyFlippableShapeSelected && !isShapeLocked && menuGroup(
+            "flip",
+            menuItem(actions["flip-horizontal"]),
+            menuItem(actions["flip-vertical"])
+          ),
+          twoSelected && menuGroup(
+            "order",
+            menuItem(actions["pack"], { disabled: !twoSelected }),
+            threeStackableItems && menuItem(actions["stack-vertical"]),
+            threeStackableItems && menuItem(actions["stack-horizontal"])
+          )
+        ),
+        oneSelected && !isShapeLocked && menuSubmenu(
+          "reorder",
+          "context-menu.reorder",
+          menuGroup(
+            "reorder",
+            menuItem(actions["bring-to-front"]),
+            menuItem(actions["bring-forward"]),
+            menuItem(actions["send-backward"]),
+            menuItem(actions["send-to-back"])
+          )
+        ),
+        oneSelected && !isShapeLocked && menuCustom("MOVE_TO_PAGE_MENU", { readonlyOk: false })
+      ),
+      menuGroup(
+        "clipboard-group",
+        oneSelected && !isShapeLocked && menuItem(actions["cut"]),
+        oneSelected && menuItem(actions["copy"]),
+        showMenuPaste && menuItem(actions["paste"])
+      ),
+      atLeastOneShapeOnPage && menuGroup(
+        "conversions",
+        menuSubmenu(
+          "copy-as",
+          "context-menu.copy-as",
+          menuGroup(
+            "copy-as-group",
+            menuItem(actions["copy-as-svg"]),
+            hasClipboardWrite && menuItem(actions["copy-as-png"]),
+            menuItem(actions["copy-as-json"])
+          ),
+          menuGroup(
+            "export-bg",
+            menuItem(actions["toggle-transparent"], { checked: !isTransparentBg })
+          )
+        ),
+        menuSubmenu(
+          "export-as",
+          "context-menu.export-as",
+          menuGroup(
+            "export-as-group",
+            menuItem(actions["export-as-svg"]),
+            menuItem(actions["export-as-png"]),
+            menuItem(actions["export-as-json"])
+          ),
+          menuGroup(
+            "export-bg,",
+            menuItem(actions["toggle-transparent"], { checked: !isTransparentBg })
+          )
+        )
+      ),
+      atLeastOneShapeOnPage && menuGroup(
+        "set-selection-group",
+        menuItem(actions["select-all"]),
+        oneSelected && menuItem(actions["select-none"])
+      ),
+      oneSelected && !isShapeLocked && menuGroup("delete-group", menuItem(actions["delete"]))
+    ]);
+    if (overrides) {
+      contextTLUiMenuSchema2 = overrides(editor, contextTLUiMenuSchema2, {
+        actions,
+        oneSelected,
+        twoSelected,
+        threeSelected,
+        showAutoSizeToggle,
+        showUngroup: allowUngroup,
+        onlyFlippableShapeSelected
+      });
+    }
+    return contextTLUiMenuSchema2;
+  }, [
+    editor,
+    overrides,
+    actions,
+    oneSelected,
+    twoSelected,
+    threeSelected,
+    showAutoSizeToggle,
+    onlyFlippableShapeSelected,
+    atLeastOneShapeOnPage,
+    threeStackableItems,
+    allowGroup,
+    allowUngroup,
+    allowRemoveFrame,
+    allowFitFrameToContent,
+    hasClipboardWrite,
+    showEditLink,
+    // oneEmbedSelected,
+    // oneEmbeddableBookmarkSelected,
+    isTransparentBg,
+    isShapeLocked
+  ]);
+  return /* @__PURE__ */ jsx(TLUiContextMenuSchemaContext.Provider, { value: contextTLUiMenuSchema, children });
+});
+function useContextMenuSchema() {
+  const ctx = React.useContext(TLUiContextMenuSchemaContext);
+  if (!ctx) {
+    throw new Error("useContextMenuSchema must be used inside of a TLUiContextMenuSchemaProvider.");
+  }
+  return ctx;
+}
+export {
+  TLUiContextMenuSchemaContext,
+  TLUiContextMenuSchemaProvider,
+  useContextMenuSchema
+};
+//# sourceMappingURL=useContextMenuSchema.mjs.map

package/dist-esm/lib/ui/hooks/useContextMenuSchema.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useContextMenuSchema.tsx"],
+  "sourcesContent": ["import { Editor, TLFrameShape, track, useEditor, useValue } from '@bigbluebutton/editor'\nimport React, { useMemo } from 'react'\nimport {\n\tTLUiMenuSchema,\n\tcompactMenuItems,\n\tmenuCustom,\n\tmenuGroup,\n\tmenuItem,\n\tmenuSubmenu,\n\tshowMenuPaste,\n\tuseAllowGroup,\n\tuseAllowUngroup,\n\tuseThreeStackableItems,\n} from './menuHelpers'\nimport { useActions } from './useActions'\nimport { useHasLinkShapeSelected } from './useHasLinkShapeSelected'\nimport { useOnlyFlippableShape } from './useOnlyFlippableShape'\nimport { useShowAutoSizeToggle } from './useShowAutoSizeToggle'\n\n/** @public */\nexport type TLUiContextTTLUiMenuSchemaContextType = TLUiMenuSchema\n\n/** @internal */\nexport const TLUiContextMenuSchemaContext = React.createContext(\n\t{} as TLUiContextTTLUiMenuSchemaContextType\n)\n\n/** @public */\nexport type TLUiContextMenuSchemaProviderProps = {\n\toverrides?: (\n\t\teditor: Editor,\n\t\tschema: TLUiContextTTLUiMenuSchemaContextType,\n\t\thelpers: {\n\t\t\tactions: ReturnType<typeof useActions>\n\t\t\toneSelected: boolean\n\t\t\ttwoSelected: boolean\n\t\t\tthreeSelected: boolean\n\t\t\tshowAutoSizeToggle: boolean\n\t\t\tshowUngroup: boolean\n\t\t\tonlyFlippableShapeSelected: boolean\n\t\t}\n\t) => TLUiContextTTLUiMenuSchemaContextType\n\tchildren: any\n}\n\n/** @internal */\nexport const TLUiContextMenuSchemaProvider = track(function TLUiContextMenuSchemaProvider({\n\toverrides,\n\tchildren,\n}: TLUiContextMenuSchemaProviderProps) {\n\tconst editor = useEditor()\n\tconst actions = useActions()\n\n\tconst showAutoSizeToggle = useShowAutoSizeToggle()\n\n\tconst onlyFlippableShapeSelected = useOnlyFlippableShape()\n\n\tconst selectedShapes = editor.getSelectedShapes()\n\tconst selectedCount = selectedShapes.length\n\n\tconst oneSelected = selectedCount > 0\n\n\tconst twoSelected = selectedCount > 1\n\tconst threeSelected = selectedCount > 2\n\tconst threeStackableItems = useThreeStackableItems()\n\tconst atLeastOneShapeOnPage = useValue(\n\t\t'atLeastOneShapeOnPage',\n\t\t() => editor.getCurrentPageShapeIds().size > 0,\n\t\t[]\n\t)\n\tconst isTransparentBg = useValue(\n\t\t'isTransparentBg',\n\t\t() => editor.getInstanceState().exportBackground,\n\t\t[]\n\t)\n\tconst allowGroup = useAllowGroup()\n\tconst allowUngroup = useAllowUngroup()\n\tconst hasClipboardWrite = Boolean(window.navigator.clipboard?.write)\n\tconst showEditLink = useHasLinkShapeSelected()\n\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\tconst allowRemoveFrame =\n\t\toneSelected &&\n\t\tselectedShapes.every((shape) => editor.isShapeOfType<TLFrameShape>(shape, 'frame'))\n\tconst allowFitFrameToContent =\n\t\tonlySelectedShape &&\n\t\teditor.isShapeOfType<TLFrameShape>(onlySelectedShape, 'frame') &&\n\t\teditor.getSortedChildIdsForParent(onlySelectedShape).length > 0\n\tconst isShapeLocked = onlySelectedShape && editor.isShapeOrAncestorLocked(onlySelectedShape)\n\n\tconst contextTLUiMenuSchema = useMemo<TLUiMenuSchema>(() => {\n\t\tlet contextTLUiMenuSchema: TLUiContextTTLUiMenuSchemaContextType = compactMenuItems([\n\t\t\tmenuGroup(\n\t\t\t\t'selection',\n\t\t\t\tshowAutoSizeToggle && menuItem(actions['toggle-auto-size']),\n\t\t\t\tshowEditLink && !isShapeLocked && menuItem(actions['edit-link']),\n\t\t\t\toneSelected && !isShapeLocked && menuItem(actions['duplicate']),\n\t\t\t\tallowGroup && !isShapeLocked && menuItem(actions['group']),\n\t\t\t\tallowUngroup && !isShapeLocked && menuItem(actions['ungroup']),\n\t\t\t\tallowRemoveFrame && !isShapeLocked && menuItem(actions['remove-frame']),\n\t\t\t\tallowFitFrameToContent && !isShapeLocked && menuItem(actions['fit-frame-to-content']),\n\t\t\t\toneSelected && menuItem(actions['toggle-lock'])\n\t\t\t),\n\t\t\tmenuGroup(\n\t\t\t\t'modify',\n\t\t\t\t(twoSelected || onlyFlippableShapeSelected) &&\n\t\t\t\t\tmenuSubmenu(\n\t\t\t\t\t\t'arrange',\n\t\t\t\t\t\t'context-menu.arrange',\n\t\t\t\t\t\ttwoSelected &&\n\t\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t\t'align',\n\t\t\t\t\t\t\t\tmenuItem(actions['align-left']),\n\t\t\t\t\t\t\t\tmenuItem(actions['align-center-horizontal']),\n\t\t\t\t\t\t\t\tmenuItem(actions['align-right']),\n\t\t\t\t\t\t\t\tmenuItem(actions['align-top']),\n\t\t\t\t\t\t\t\tmenuItem(actions['align-center-vertical']),\n\t\t\t\t\t\t\t\tmenuItem(actions['align-bottom'])\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\tthreeSelected &&\n\t\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t\t'distribute',\n\t\t\t\t\t\t\t\tmenuItem(actions['distribute-horizontal']),\n\t\t\t\t\t\t\t\tmenuItem(actions['distribute-vertical'])\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\ttwoSelected &&\n\t\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t\t'stretch',\n\t\t\t\t\t\t\t\tmenuItem(actions['stretch-horizontal']),\n\t\t\t\t\t\t\t\tmenuItem(actions['stretch-vertical'])\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\tonlyFlippableShapeSelected &&\n\t\t\t\t\t\t\t!isShapeLocked &&\n\t\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t\t'flip',\n\t\t\t\t\t\t\t\tmenuItem(actions['flip-horizontal']),\n\t\t\t\t\t\t\t\tmenuItem(actions['flip-vertical'])\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\ttwoSelected &&\n\t\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t\t'order',\n\t\t\t\t\t\t\t\tmenuItem(actions['pack'], { disabled: !twoSelected }),\n\t\t\t\t\t\t\t\tthreeStackableItems && menuItem(actions['stack-vertical']),\n\t\t\t\t\t\t\t\tthreeStackableItems && menuItem(actions['stack-horizontal'])\n\t\t\t\t\t\t\t)\n\t\t\t\t\t),\n\t\t\t\toneSelected &&\n\t\t\t\t\t!isShapeLocked &&\n\t\t\t\t\tmenuSubmenu(\n\t\t\t\t\t\t'reorder',\n\t\t\t\t\t\t'context-menu.reorder',\n\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t'reorder',\n\t\t\t\t\t\t\tmenuItem(actions['bring-to-front']),\n\t\t\t\t\t\t\tmenuItem(actions['bring-forward']),\n\t\t\t\t\t\t\tmenuItem(actions['send-backward']),\n\t\t\t\t\t\t\tmenuItem(actions['send-to-back'])\n\t\t\t\t\t\t)\n\t\t\t\t\t),\n\t\t\t\toneSelected && !isShapeLocked && menuCustom('MOVE_TO_PAGE_MENU', { readonlyOk: false })\n\t\t\t),\n\t\t\tmenuGroup(\n\t\t\t\t'clipboard-group',\n\t\t\t\toneSelected && !isShapeLocked && menuItem(actions['cut']),\n\t\t\t\toneSelected && menuItem(actions['copy']),\n\t\t\t\tshowMenuPaste && menuItem(actions['paste'])\n\t\t\t),\n\t\t\tatLeastOneShapeOnPage &&\n\t\t\t\tmenuGroup(\n\t\t\t\t\t'conversions',\n\t\t\t\t\tmenuSubmenu(\n\t\t\t\t\t\t'copy-as',\n\t\t\t\t\t\t'context-menu.copy-as',\n\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t'copy-as-group',\n\t\t\t\t\t\t\tmenuItem(actions['copy-as-svg']),\n\t\t\t\t\t\t\thasClipboardWrite && menuItem(actions['copy-as-png']),\n\t\t\t\t\t\t\tmenuItem(actions['copy-as-json'])\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t'export-bg',\n\t\t\t\t\t\t\tmenuItem(actions['toggle-transparent'], { checked: !isTransparentBg })\n\t\t\t\t\t\t)\n\t\t\t\t\t),\n\t\t\t\t\tmenuSubmenu(\n\t\t\t\t\t\t'export-as',\n\t\t\t\t\t\t'context-menu.export-as',\n\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t'export-as-group',\n\t\t\t\t\t\t\tmenuItem(actions['export-as-svg']),\n\t\t\t\t\t\t\tmenuItem(actions['export-as-png']),\n\t\t\t\t\t\t\tmenuItem(actions['export-as-json'])\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmenuGroup(\n\t\t\t\t\t\t\t'export-bg,',\n\t\t\t\t\t\t\tmenuItem(actions['toggle-transparent'], { checked: !isTransparentBg })\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t),\n\t\t\tatLeastOneShapeOnPage &&\n\t\t\t\tmenuGroup(\n\t\t\t\t\t'set-selection-group',\n\t\t\t\t\tmenuItem(actions['select-all']),\n\t\t\t\t\toneSelected && menuItem(actions['select-none'])\n\t\t\t\t),\n\t\t\toneSelected && !isShapeLocked && menuGroup('delete-group', menuItem(actions['delete'])),\n\t\t])\n\n\t\tif (overrides) {\n\t\t\tcontextTLUiMenuSchema = overrides(editor, contextTLUiMenuSchema, {\n\t\t\t\tactions,\n\t\t\t\toneSelected,\n\t\t\t\ttwoSelected,\n\t\t\t\tthreeSelected,\n\t\t\t\tshowAutoSizeToggle,\n\t\t\t\tshowUngroup: allowUngroup,\n\t\t\t\tonlyFlippableShapeSelected,\n\t\t\t})\n\t\t}\n\n\t\treturn contextTLUiMenuSchema\n\t}, [\n\t\teditor,\n\t\toverrides,\n\t\tactions,\n\t\toneSelected,\n\t\ttwoSelected,\n\t\tthreeSelected,\n\t\tshowAutoSizeToggle,\n\t\tonlyFlippableShapeSelected,\n\t\tatLeastOneShapeOnPage,\n\t\tthreeStackableItems,\n\t\tallowGroup,\n\t\tallowUngroup,\n\t\tallowRemoveFrame,\n\t\tallowFitFrameToContent,\n\t\thasClipboardWrite,\n\t\tshowEditLink,\n\t\t// oneEmbedSelected,\n\t\t// oneEmbeddableBookmarkSelected,\n\t\tisTransparentBg,\n\t\tisShapeLocked,\n\t])\n\n\treturn (\n\t\t<TLUiContextMenuSchemaContext.Provider value={contextTLUiMenuSchema}>\n\t\t\t{children}\n\t\t</TLUiContextMenuSchemaContext.Provider>\n\t)\n})\n\n/** @public */\nexport function useContextMenuSchema(): TLUiMenuSchema {\n\tconst ctx = React.useContext(TLUiContextMenuSchemaContext)\n\n\tif (!ctx) {\n\t\tthrow new Error('useContextMenuSchema must be used inside of a TLUiContextMenuSchemaProvider.')\n\t}\n\n\treturn ctx\n}\n"],
+  "mappings": "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",
+  "names": ["TLUiContextMenuSchemaProvider", "contextTLUiMenuSchema"]
+}

package/dist-esm/lib/ui/hooks/useCopyAs.mjs

@@ -0,0 +1,27 @@
+import { useEditor } from "@bigbluebutton/editor";
+import { useCallback } from "react";
+import { copyAs } from "../../utils/export/copyAs.mjs";
+import { useToasts } from "./useToastsProvider.mjs";
+import { useTranslation } from "./useTranslation/useTranslation.mjs";
+function useCopyAs() {
+  const editor = useEditor();
+  const { addToast } = useToasts();
+  const msg = useTranslation();
+  return useCallback(
+    (ids, format = "svg") => {
+      copyAs(editor, ids, format).catch(() => {
+        addToast({
+          id: "copy-fail",
+          icon: "warning-triangle",
+          title: msg("toast.error.copy-fail.title"),
+          description: msg("toast.error.copy-fail.desc")
+        });
+      });
+    },
+    [editor, addToast, msg]
+  );
+}
+export {
+  useCopyAs
+};
+//# sourceMappingURL=useCopyAs.mjs.map

package/dist-esm/lib/ui/hooks/useCopyAs.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useCopyAs.ts"],
+  "sourcesContent": ["import { TLShapeId, useEditor } from '@bigbluebutton/editor'\nimport { useCallback } from 'react'\nimport { TLCopyType, copyAs } from '../../utils/export/copyAs'\nimport { useToasts } from './useToastsProvider'\nimport { useTranslation } from './useTranslation/useTranslation'\n\n/** @public */\nexport function useCopyAs() {\n\tconst editor = useEditor()\n\tconst { addToast } = useToasts()\n\tconst msg = useTranslation()\n\n\treturn useCallback(\n\t\t(ids: TLShapeId[], format: TLCopyType = 'svg') => {\n\t\t\tcopyAs(editor, ids, format).catch(() => {\n\t\t\t\taddToast({\n\t\t\t\t\tid: 'copy-fail',\n\t\t\t\t\ticon: 'warning-triangle',\n\t\t\t\t\ttitle: msg('toast.error.copy-fail.title'),\n\t\t\t\t\tdescription: msg('toast.error.copy-fail.desc'),\n\t\t\t\t})\n\t\t\t})\n\t\t},\n\t\t[editor, addToast, msg]\n\t)\n}\n"],
+  "mappings": "AAAA,SAAoB,iBAAiB;AACrC,SAAS,mBAAmB;AAC5B,SAAqB,cAAc;AACnC,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;AAGxB,SAAS,YAAY;AAC3B,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,SAAS,IAAI,UAAU;AAC/B,QAAM,MAAM,eAAe;AAE3B,SAAO;AAAA,IACN,CAAC,KAAkB,SAAqB,UAAU;AACjD,aAAO,QAAQ,KAAK,MAAM,EAAE,MAAM,MAAM;AACvC,iBAAS;AAAA,UACR,IAAI;AAAA,UACJ,MAAM;AAAA,UACN,OAAO,IAAI,6BAA6B;AAAA,UACxC,aAAa,IAAI,4BAA4B;AAAA,QAC9C,CAAC;AAAA,MACF,CAAC;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,UAAU,GAAG;AAAA,EACvB;AACD;",
+  "names": []
+}

package/dist-esm/lib/ui/hooks/useDialogsProvider.mjs

@@ -0,0 +1,88 @@
+import { jsx } from "react/jsx-runtime";
+import { uniqueId, useEditor } from "@bigbluebutton/editor";
+import { createContext, useCallback, useContext, useState } from "react";
+import { useUiEvents } from "./useEventsProvider.mjs";
+const DialogsContext = createContext({});
+function DialogsProvider({ children }) {
+  const editor = useEditor();
+  const trackEvent = useUiEvents();
+  const [dialogs, setDialogs] = useState([]);
+  const addDialog = useCallback(
+    (dialog) => {
+      const id = dialog.id ?? uniqueId();
+      setDialogs((d) => {
+        return [...d.filter((m) => m.id !== dialog.id), { ...dialog, id }];
+      });
+      trackEvent("open-menu", { source: "dialog", id });
+      editor.addOpenMenu(id);
+      return id;
+    },
+    [editor, trackEvent]
+  );
+  const updateDialog = useCallback(
+    (id, newDialogData) => {
+      setDialogs(
+        (d) => d.map((m) => {
+          if (m.id === id) {
+            return {
+              ...m,
+              ...newDialogData
+            };
+          }
+          return m;
+        })
+      );
+      trackEvent("open-menu", { source: "dialog", id });
+      editor.addOpenMenu(id);
+      return id;
+    },
+    [editor, trackEvent]
+  );
+  const removeDialog = useCallback(
+    (id) => {
+      setDialogs(
+        (d) => d.filter((m) => {
+          if (m.id === id) {
+            m.onClose?.();
+            return false;
+          }
+          return true;
+        })
+      );
+      trackEvent("close-menu", { source: "dialog", id });
+      editor.deleteOpenMenu(id);
+      return id;
+    },
+    [editor, trackEvent]
+  );
+  const clearDialogs = useCallback(() => {
+    setDialogs((d) => {
+      d.forEach((m) => {
+        m.onClose?.();
+        trackEvent("close-menu", { source: "dialog", id: m.id });
+        editor.deleteOpenMenu(m.id);
+      });
+      return [];
+    });
+  }, [editor, trackEvent]);
+  return /* @__PURE__ */ jsx(
+    DialogsContext.Provider,
+    {
+      value: { dialogs, addDialog, removeDialog, clearDialogs, updateDialog },
+      children
+    }
+  );
+}
+function useDialogs() {
+  const ctx = useContext(DialogsContext);
+  if (!ctx) {
+    throw new Error("useDialogs must be used within a DialogsProvider");
+  }
+  return ctx;
+}
+export {
+  DialogsContext,
+  DialogsProvider,
+  useDialogs
+};
+//# sourceMappingURL=useDialogsProvider.mjs.map

package/dist-esm/lib/ui/hooks/useDialogsProvider.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useDialogsProvider.tsx"],
+  "sourcesContent": ["import { Editor, uniqueId, useEditor } from '@bigbluebutton/editor'\nimport { createContext, useCallback, useContext, useState } from 'react'\nimport { useUiEvents } from './useEventsProvider'\n\n/** @public */\nexport interface TLUiDialogProps {\n\tonClose: () => void\n}\n\n/** @public */\nexport interface TLUiDialog {\n\tid: string\n\tonClose?: () => void\n\tcomponent: (props: TLUiDialogProps) => any\n}\n\n/** @public */\nexport type TLUiDialogsContextType = {\n\taddDialog: (dialog: Omit<TLUiDialog, 'id'> & { id?: string }) => string\n\tremoveDialog: (id: string) => string\n\tupdateDialog: (id: string, newDialogData: Partial<TLUiDialog>) => string\n\tclearDialogs: () => void\n\tdialogs: TLUiDialog[]\n}\n\n/** @internal */\nexport const DialogsContext = createContext({} as TLUiDialogsContextType)\n\n/** @internal */\nexport type DialogsProviderProps = {\n\toverrides?: (editor: Editor) => TLUiDialogsContextType\n\tchildren: any\n}\n\n/** @internal */\nexport function DialogsProvider({ children }: DialogsProviderProps) {\n\tconst editor = useEditor()\n\tconst trackEvent = useUiEvents()\n\n\tconst [dialogs, setDialogs] = useState<TLUiDialog[]>([])\n\n\tconst addDialog = useCallback(\n\t\t(dialog: Omit<TLUiDialog, 'id'> & { id?: string }) => {\n\t\t\tconst id = dialog.id ?? uniqueId()\n\t\t\tsetDialogs((d) => {\n\t\t\t\treturn [...d.filter((m) => m.id !== dialog.id), { ...dialog, id }]\n\t\t\t})\n\n\t\t\ttrackEvent('open-menu', { source: 'dialog', id })\n\t\t\teditor.addOpenMenu(id)\n\n\t\t\treturn id\n\t\t},\n\t\t[editor, trackEvent]\n\t)\n\n\tconst updateDialog = useCallback(\n\t\t(id: string, newDialogData: Partial<TLUiDialog>) => {\n\t\t\tsetDialogs((d) =>\n\t\t\t\td.map((m) => {\n\t\t\t\t\tif (m.id === id) {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...m,\n\t\t\t\t\t\t\t...newDialogData,\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\treturn m\n\t\t\t\t})\n\t\t\t)\n\n\t\t\ttrackEvent('open-menu', { source: 'dialog', id })\n\t\t\teditor.addOpenMenu(id)\n\n\t\t\treturn id\n\t\t},\n\t\t[editor, trackEvent]\n\t)\n\n\tconst removeDialog = useCallback(\n\t\t(id: string) => {\n\t\t\tsetDialogs((d) =>\n\t\t\t\td.filter((m) => {\n\t\t\t\t\tif (m.id === id) {\n\t\t\t\t\t\tm.onClose?.()\n\t\t\t\t\t\treturn false\n\t\t\t\t\t}\n\t\t\t\t\treturn true\n\t\t\t\t})\n\t\t\t)\n\n\t\t\ttrackEvent('close-menu', { source: 'dialog', id })\n\t\t\teditor.deleteOpenMenu(id)\n\n\t\t\treturn id\n\t\t},\n\t\t[editor, trackEvent]\n\t)\n\n\tconst clearDialogs = useCallback(() => {\n\t\tsetDialogs((d) => {\n\t\t\td.forEach((m) => {\n\t\t\t\tm.onClose?.()\n\t\t\t\ttrackEvent('close-menu', { source: 'dialog', id: m.id })\n\t\t\t\teditor.deleteOpenMenu(m.id)\n\t\t\t})\n\t\t\treturn []\n\t\t})\n\t}, [editor, trackEvent])\n\n\treturn (\n\t\t<DialogsContext.Provider\n\t\t\tvalue={{ dialogs, addDialog, removeDialog, clearDialogs, updateDialog }}\n\t\t>\n\t\t\t{children}\n\t\t</DialogsContext.Provider>\n\t)\n}\n\n/** @public */\nexport function useDialogs() {\n\tconst ctx = useContext(DialogsContext)\n\n\tif (!ctx) {\n\t\tthrow new Error('useDialogs must be used within a DialogsProvider')\n\t}\n\n\treturn ctx\n}\n"],
+  "mappings": "AA8GE;AA9GF,SAAiB,UAAU,iBAAiB;AAC5C,SAAS,eAAe,aAAa,YAAY,gBAAgB;AACjE,SAAS,mBAAmB;AAwBrB,MAAM,iBAAiB,cAAc,CAAC,CAA2B;AASjE,SAAS,gBAAgB,EAAE,SAAS,GAAyB;AACnE,QAAM,SAAS,UAAU;AACzB,QAAM,aAAa,YAAY;AAE/B,QAAM,CAAC,SAAS,UAAU,IAAI,SAAuB,CAAC,CAAC;AAEvD,QAAM,YAAY;AAAA,IACjB,CAAC,WAAqD;AACrD,YAAM,KAAK,OAAO,MAAM,SAAS;AACjC,iBAAW,CAAC,MAAM;AACjB,eAAO,CAAC,GAAG,EAAE,OAAO,CAAC,MAAM,EAAE,OAAO,OAAO,EAAE,GAAG,EAAE,GAAG,QAAQ,GAAG,CAAC;AAAA,MAClE,CAAC;AAED,iBAAW,aAAa,EAAE,QAAQ,UAAU,GAAG,CAAC;AAChD,aAAO,YAAY,EAAE;AAErB,aAAO;AAAA,IACR;AAAA,IACA,CAAC,QAAQ,UAAU;AAAA,EACpB;AAEA,QAAM,eAAe;AAAA,IACpB,CAAC,IAAY,kBAAuC;AACnD;AAAA,QAAW,CAAC,MACX,EAAE,IAAI,CAAC,MAAM;AACZ,cAAI,EAAE,OAAO,IAAI;AAChB,mBAAO;AAAA,cACN,GAAG;AAAA,cACH,GAAG;AAAA,YACJ;AAAA,UACD;AACA,iBAAO;AAAA,QACR,CAAC;AAAA,MACF;AAEA,iBAAW,aAAa,EAAE,QAAQ,UAAU,GAAG,CAAC;AAChD,aAAO,YAAY,EAAE;AAErB,aAAO;AAAA,IACR;AAAA,IACA,CAAC,QAAQ,UAAU;AAAA,EACpB;AAEA,QAAM,eAAe;AAAA,IACpB,CAAC,OAAe;AACf;AAAA,QAAW,CAAC,MACX,EAAE,OAAO,CAAC,MAAM;AACf,cAAI,EAAE,OAAO,IAAI;AAChB,cAAE,UAAU;AACZ,mBAAO;AAAA,UACR;AACA,iBAAO;AAAA,QACR,CAAC;AAAA,MACF;AAEA,iBAAW,cAAc,EAAE,QAAQ,UAAU,GAAG,CAAC;AACjD,aAAO,eAAe,EAAE;AAExB,aAAO;AAAA,IACR;AAAA,IACA,CAAC,QAAQ,UAAU;AAAA,EACpB;AAEA,QAAM,eAAe,YAAY,MAAM;AACtC,eAAW,CAAC,MAAM;AACjB,QAAE,QAAQ,CAAC,MAAM;AAChB,UAAE,UAAU;AACZ,mBAAW,cAAc,EAAE,QAAQ,UAAU,IAAI,EAAE,GAAG,CAAC;AACvD,eAAO,eAAe,EAAE,EAAE;AAAA,MAC3B,CAAC;AACD,aAAO,CAAC;AAAA,IACT,CAAC;AAAA,EACF,GAAG,CAAC,QAAQ,UAAU,CAAC;AAEvB,SACC;AAAA,IAAC,eAAe;AAAA,IAAf;AAAA,MACA,OAAO,EAAE,SAAS,WAAW,cAAc,cAAc,aAAa;AAAA,MAErE;AAAA;AAAA,EACF;AAEF;AAGO,SAAS,aAAa;AAC5B,QAAM,MAAM,WAAW,cAAc;AAErC,MAAI,CAAC,KAAK;AACT,UAAM,IAAI,MAAM,kDAAkD;AAAA,EACnE;AAEA,SAAO;AACR;",
+  "names": []
+}

package/dist-esm/lib/ui/hooks/useEditorEvents.mjs

@@ -0,0 +1,23 @@
+import { useEditor } from "@bigbluebutton/editor";
+import { useEffect } from "react";
+import { useToasts } from "./useToastsProvider.mjs";
+function useEditorEvents() {
+  const editor = useEditor();
+  const { addToast } = useToasts();
+  useEffect(() => {
+    function handleMaxShapes({ name, count }) {
+      addToast({
+        title: "Maximum Shapes Reached",
+        description: `You've reached the maximum number of shapes allowed on ${name} (${count}). Please delete some shapes or move to a different page to continue.`
+      });
+    }
+    editor.addListener("max-shapes", handleMaxShapes);
+    return () => {
+      editor.removeListener("max-shapes", handleMaxShapes);
+    };
+  }, [editor, addToast]);
+}
+export {
+  useEditorEvents
+};
+//# sourceMappingURL=useEditorEvents.mjs.map

package/dist-esm/lib/ui/hooks/useEditorEvents.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useEditorEvents.ts"],
+  "sourcesContent": ["import { useEditor } from '@bigbluebutton/editor'\nimport { useEffect } from 'react'\nimport { useToasts } from './useToastsProvider'\n\n/** @internal */\nexport function useEditorEvents() {\n\tconst editor = useEditor()\n\tconst { addToast } = useToasts()\n\n\tuseEffect(() => {\n\t\tfunction handleMaxShapes({ name, count }: { name: string; pageId: string; count: number }) {\n\t\t\taddToast({\n\t\t\t\ttitle: 'Maximum Shapes Reached',\n\t\t\t\tdescription: `You've reached the maximum number of shapes allowed on ${name} (${count}). Please delete some shapes or move to a different page to continue.`,\n\t\t\t})\n\t\t}\n\n\t\teditor.addListener('max-shapes', handleMaxShapes)\n\t\treturn () => {\n\t\t\teditor.removeListener('max-shapes', handleMaxShapes)\n\t\t}\n\t}, [editor, addToast])\n}\n"],
+  "mappings": "AAAA,SAAS,iBAAiB;AAC1B,SAAS,iBAAiB;AAC1B,SAAS,iBAAiB;AAGnB,SAAS,kBAAkB;AACjC,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,SAAS,IAAI,UAAU;AAE/B,YAAU,MAAM;AACf,aAAS,gBAAgB,EAAE,MAAM,MAAM,GAAoD;AAC1F,eAAS;AAAA,QACR,OAAO;AAAA,QACP,aAAa,0DAA0D,IAAI,KAAK,KAAK;AAAA,MACtF,CAAC;AAAA,IACF;AAEA,WAAO,YAAY,cAAc,eAAe;AAChD,WAAO,MAAM;AACZ,aAAO,eAAe,cAAc,eAAe;AAAA,IACpD;AAAA,EACD,GAAG,CAAC,QAAQ,QAAQ,CAAC;AACtB;",
+  "names": []
+}

package/dist-esm/lib/ui/hooks/useEventsProvider.mjs

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+const defaultEventHandler = () => void 0;
+const EventsContext = React.createContext({});
+function UiEventsProvider({ onEvent, children }) {
+  return /* @__PURE__ */ jsx(EventsContext.Provider, { value: onEvent ?? defaultEventHandler, children });
+}
+function useUiEvents() {
+  const eventHandler = React.useContext(EventsContext);
+  return eventHandler ?? defaultEventHandler;
+}
+export {
+  EventsContext,
+  UiEventsProvider,
+  useUiEvents
+};
+//# sourceMappingURL=useEventsProvider.mjs.map

package/dist-esm/lib/ui/hooks/useEventsProvider.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useEventsProvider.tsx"],
+  "sourcesContent": ["import * as React from 'react'\n\n/** @public */\nexport type TLUiEventSource =\n\t| 'menu'\n\t| 'context-menu'\n\t| 'zoom-menu'\n\t| 'navigation-zone'\n\t| 'quick-actions'\n\t| 'actions-menu'\n\t| 'kbd'\n\t| 'debug-panel'\n\t| 'page-menu'\n\t| 'share-menu'\n\t| 'export-menu'\n\t| 'toolbar'\n\t| 'people-menu'\n\t| 'dialog'\n\t| 'help-menu'\n\t| 'helper-buttons'\n\t| 'unknown'\n\n/** @public */\nexport interface TLUiEventMap {\n\t// Actions\n\tundo: null\n\tredo: null\n\t'group-shapes': null\n\t'ungroup-shapes': null\n\t'remove-frame': null\n\t'fit-frame-to-content': null\n\t'convert-to-embed': null\n\t'convert-to-bookmark': null\n\t'open-embed-link': null\n\t'toggle-auto-size': null\n\t'copy-as': { format: 'svg' | 'png' | 'json' }\n\t'export-as': { format: 'svg' | 'png' | 'json' }\n\t'edit-link': null\n\t'insert-embed': null\n\t'insert-media': null\n\t'align-shapes': {\n\t\toperation: 'left' | 'center-horizontal' | 'right' | 'top' | 'center-vertical' | 'bottom'\n\t}\n\t'duplicate-shapes': null\n\t'pack-shapes': null\n\t'stack-shapes': { operation: 'horizontal' | 'vertical' }\n\t'flip-shapes': { operation: 'horizontal' | 'vertical' }\n\t'distribute-shapes': { operation: 'horizontal' | 'vertical' }\n\t'stretch-shapes': { operation: 'horizontal' | 'vertical' }\n\t'reorder-shapes': {\n\t\toperation: 'toBack' | 'toFront' | 'forward' | 'backward'\n\t}\n\t'delete-shapes': null\n\t'select-all-shapes': null\n\t'select-none-shapes': null\n\t'rotate-ccw': null\n\t'rotate-cw': null\n\t'zoom-in': null\n\t'zoom-out': null\n\t'zoom-to-fit': null\n\t'zoom-to-selection': null\n\t'reset-zoom': null\n\t'zoom-into-view': null\n\t'zoom-to-content': null\n\t'open-menu': { id: string }\n\t'close-menu': { id: string }\n\t'create-new-project': null\n\t'save-project-to-file': null\n\t'open-file': null\n\t'select-tool': { id: string }\n\tprint: null\n\tcopy: null\n\tpaste: null\n\tcut: null\n\t'toggle-transparent': null\n\t'toggle-snap-mode': null\n\t'toggle-tool-lock': null\n\t'toggle-grid-mode': null\n\t'toggle-dark-mode': null\n\t'toggle-focus-mode': null\n\t'toggle-debug-mode': null\n\t'toggle-lock': null\n\t'toggle-reduce-motion': null\n\t'exit-pen-mode': null\n\t'stop-following': null\n\t'open-cursor-chat': null\n\t'zoom-tool': null\n\t'unlock-all': null\n}\n\ntype Join<T, K> = K extends null\n\t? { [R in keyof T]: T[R] }\n\t: { [R in keyof T]: T[R] } & { [R in keyof K]: K[R] }\n\n/** @public */\nexport type TLUiEventHandler<T extends keyof TLUiEventMap = keyof TLUiEventMap> = (\n\tname: T,\n\tdata: Join<{ source: TLUiEventSource }, TLUiEventMap[T]>\n) => void\n\n/** @internal */\nconst defaultEventHandler: TLUiEventHandler = () => void null\n\n/** @public */\nexport type TLUiEventContextType = TLUiEventHandler<keyof TLUiEventMap>\n\n/** @internal */\nexport const EventsContext = React.createContext<TLUiEventContextType>({} as TLUiEventContextType)\n\n/** @public */\nexport type EventsProviderProps = {\n\tonEvent?: TLUiEventHandler\n\tchildren: any\n}\n\n/** @public */\nexport function UiEventsProvider({ onEvent, children }: EventsProviderProps) {\n\treturn (\n\t\t<EventsContext.Provider value={onEvent ?? defaultEventHandler}>\n\t\t\t{children}\n\t\t</EventsContext.Provider>\n\t)\n}\n\n/** @public */\nexport function useUiEvents() {\n\tconst eventHandler = React.useContext(EventsContext)\n\treturn eventHandler ?? defaultEventHandler\n}\n"],
+  "mappings": "AAsHE;AAtHF,YAAY,WAAW;AAqGvB,MAAM,sBAAwC,MAAM;AAM7C,MAAM,gBAAgB,MAAM,cAAoC,CAAC,CAAyB;AAS1F,SAAS,iBAAiB,EAAE,SAAS,SAAS,GAAwB;AAC5E,SACC,oBAAC,cAAc,UAAd,EAAuB,OAAO,WAAW,qBACxC,UACF;AAEF;AAGO,SAAS,cAAc;AAC7B,QAAM,eAAe,MAAM,WAAW,aAAa;AACnD,SAAO,gBAAgB;AACxB;",
+  "names": []
+}

package/dist-esm/lib/ui/hooks/useExportAs.mjs

@@ -0,0 +1,31 @@
+import { useEditor } from "@bigbluebutton/editor";
+import { useCallback } from "react";
+import { exportAs } from "../../utils/export/exportAs.mjs";
+import { useToasts } from "./useToastsProvider.mjs";
+import { useTranslation } from "./useTranslation/useTranslation.mjs";
+function useExportAs() {
+  const editor = useEditor();
+  const { addToast } = useToasts();
+  const msg = useTranslation();
+  return useCallback(
+    (ids, format = "png") => {
+      exportAs(editor, ids, format, {
+        scale: 1,
+        background: editor.getInstanceState().exportBackground
+      }).catch((e) => {
+        console.error(e.message);
+        addToast({
+          id: "export-fail",
+          // icon: 'error',
+          title: msg("toast.error.export-fail.title"),
+          description: msg("toast.error.export-fail.desc")
+        });
+      });
+    },
+    [editor, addToast, msg]
+  );
+}
+export {
+  useExportAs
+};
+//# sourceMappingURL=useExportAs.mjs.map

package/dist-esm/lib/ui/hooks/useExportAs.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useExportAs.ts"],
+  "sourcesContent": ["import { TLShapeId, useEditor } from '@bigbluebutton/editor'\nimport { useCallback } from 'react'\nimport { TLExportType, exportAs } from '../../utils/export/exportAs'\nimport { useToasts } from './useToastsProvider'\nimport { useTranslation } from './useTranslation/useTranslation'\n\n/** @public */\nexport function useExportAs() {\n\tconst editor = useEditor()\n\tconst { addToast } = useToasts()\n\tconst msg = useTranslation()\n\n\treturn useCallback(\n\t\t(ids: TLShapeId[], format: TLExportType = 'png') => {\n\t\t\texportAs(editor, ids, format, {\n\t\t\t\tscale: 1,\n\t\t\t\tbackground: editor.getInstanceState().exportBackground,\n\t\t\t}).catch((e) => {\n\t\t\t\tconsole.error(e.message)\n\t\t\t\taddToast({\n\t\t\t\t\tid: 'export-fail',\n\t\t\t\t\t// icon: 'error',\n\t\t\t\t\ttitle: msg('toast.error.export-fail.title'),\n\t\t\t\t\tdescription: msg('toast.error.export-fail.desc'),\n\t\t\t\t})\n\t\t\t})\n\t\t},\n\t\t[editor, addToast, msg]\n\t)\n}\n"],
+  "mappings": "AAAA,SAAoB,iBAAiB;AACrC,SAAS,mBAAmB;AAC5B,SAAuB,gBAAgB;AACvC,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;AAGxB,SAAS,cAAc;AAC7B,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,SAAS,IAAI,UAAU;AAC/B,QAAM,MAAM,eAAe;AAE3B,SAAO;AAAA,IACN,CAAC,KAAkB,SAAuB,UAAU;AACnD,eAAS,QAAQ,KAAK,QAAQ;AAAA,QAC7B,OAAO;AAAA,QACP,YAAY,OAAO,iBAAiB,EAAE;AAAA,MACvC,CAAC,EAAE,MAAM,CAAC,MAAM;AACf,gBAAQ,MAAM,EAAE,OAAO;AACvB,iBAAS;AAAA,UACR,IAAI;AAAA;AAAA,UAEJ,OAAO,IAAI,+BAA+B;AAAA,UAC1C,aAAa,IAAI,8BAA8B;AAAA,QAChD,CAAC;AAAA,MACF,CAAC;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,UAAU,GAAG;AAAA,EACvB;AACD;",
+  "names": []
+}

package/dist-esm/lib/ui/hooks/useHasLinkShapeSelected.mjs

@@ -0,0 +1,16 @@
+import { useEditor, useValue } from "@bigbluebutton/editor";
+function useHasLinkShapeSelected() {
+  const editor = useEditor();
+  return useValue(
+    "hasLinkShapeSelected",
+    () => {
+      const selectedShapes = editor.getSelectedShapes();
+      return selectedShapes.length === 1 && "url" in selectedShapes[0].props && selectedShapes[0].type !== "embed";
+    },
+    [editor]
+  );
+}
+export {
+  useHasLinkShapeSelected
+};
+//# sourceMappingURL=useHasLinkShapeSelected.mjs.map

package/dist-esm/lib/ui/hooks/useHasLinkShapeSelected.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useHasLinkShapeSelected.ts"],
+  "sourcesContent": ["import { useEditor, useValue } from '@bigbluebutton/editor'\n\nexport function useHasLinkShapeSelected() {\n\tconst editor = useEditor()\n\treturn useValue(\n\t\t'hasLinkShapeSelected',\n\t\t() => {\n\t\t\tconst selectedShapes = editor.getSelectedShapes()\n\t\t\treturn (\n\t\t\t\tselectedShapes.length === 1 &&\n\t\t\t\t'url' in selectedShapes[0].props &&\n\t\t\t\tselectedShapes[0].type !== 'embed'\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n}\n"],
+  "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAE7B,SAAS,0BAA0B;AACzC,QAAM,SAAS,UAAU;AACzB,SAAO;AAAA,IACN;AAAA,IACA,MAAM;AACL,YAAM,iBAAiB,OAAO,kBAAkB;AAChD,aACC,eAAe,WAAW,KAC1B,SAAS,eAAe,CAAC,EAAE,SAC3B,eAAe,CAAC,EAAE,SAAS;AAAA,IAE7B;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AACD;",
+  "names": []
+}

package/dist-esm/lib/ui/hooks/useHelpMenuSchema.mjs

@@ -0,0 +1,73 @@
+import { jsx } from "react/jsx-runtime";
+import { compact, track, useEditor } from "@bigbluebutton/editor";
+import React, { useMemo } from "react";
+import { KeyboardShortcutsDialog } from "../components/KeyboardShortcutsDialog.mjs";
+import { menuCustom, menuGroup, menuItem } from "./menuHelpers.mjs";
+import { useActions } from "./useActions.mjs";
+import { useDialogs } from "./useDialogsProvider.mjs";
+import { useLanguages } from "./useTranslation/useLanguages.mjs";
+const HelpMenuSchemaContext = React.createContext({});
+const HelpMenuSchemaProvider = track(function HelpMenuSchemaProvider2({
+  overrides,
+  children
+}) {
+  const editor = useEditor();
+  const actions = useActions();
+  const selectedCount = editor.getSelectedShapeIds().length;
+  const oneSelected = selectedCount > 0;
+  const twoSelected = selectedCount > 1;
+  const threeSelected = selectedCount > 2;
+  const { languages, currentLanguage } = useLanguages();
+  const { addDialog } = useDialogs();
+  const helpTLUiMenuSchema = useMemo(() => {
+    const helpTLUiMenuSchema2 = compact([
+      menuGroup(
+        "top",
+        menuCustom("LANGUAGE_MENU", { readonlyOk: true }),
+        menuItem({
+          id: "keyboard-shortcuts",
+          label: "help-menu.keyboard-shortcuts",
+          readonlyOk: true,
+          onSelect() {
+            addDialog({ component: KeyboardShortcutsDialog });
+          }
+        })
+      )
+    ]);
+    if (overrides) {
+      return overrides(editor, helpTLUiMenuSchema2, {
+        actions,
+        currentLanguage,
+        languages,
+        oneSelected,
+        twoSelected,
+        threeSelected
+      });
+    }
+    return helpTLUiMenuSchema2;
+  }, [
+    editor,
+    overrides,
+    languages,
+    actions,
+    oneSelected,
+    twoSelected,
+    threeSelected,
+    currentLanguage,
+    addDialog
+  ]);
+  return /* @__PURE__ */ jsx(HelpMenuSchemaContext.Provider, { value: helpTLUiMenuSchema, children });
+});
+function useHelpMenuSchema() {
+  const ctx = React.useContext(HelpMenuSchemaContext);
+  if (!ctx) {
+    throw new Error("useHelpMenuSchema must be used inside of a helpTLUiMenuSchemaProvider.");
+  }
+  return ctx;
+}
+export {
+  HelpMenuSchemaContext,
+  HelpMenuSchemaProvider,
+  useHelpMenuSchema
+};
+//# sourceMappingURL=useHelpMenuSchema.mjs.map

package/dist-esm/lib/ui/hooks/useHelpMenuSchema.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useHelpMenuSchema.tsx"],
+  "sourcesContent": ["import { Editor, TLLanguage, compact, track, useEditor } from '@bigbluebutton/editor'\nimport React, { useMemo } from 'react'\nimport { KeyboardShortcutsDialog } from '../components/KeyboardShortcutsDialog'\nimport { TLUiMenuSchema, menuCustom, menuGroup, menuItem } from './menuHelpers'\nimport { useActions } from './useActions'\nimport { useDialogs } from './useDialogsProvider'\nimport { useLanguages } from './useTranslation/useLanguages'\n\n/** @public */\nexport type TLUiHelpMenuSchemaContextType = TLUiMenuSchema\n\n/** @internal */\nexport const HelpMenuSchemaContext = React.createContext({} as TLUiHelpMenuSchemaContextType)\n\n/** @public */\nexport type TLUiHelpMenuSchemaProviderProps = {\n\toverrides?: (\n\t\teditor: Editor,\n\t\tschema: TLUiHelpMenuSchemaContextType,\n\t\thelpers: {\n\t\t\tactions: ReturnType<typeof useActions>\n\t\t\tlanguages: readonly TLLanguage[]\n\t\t\tcurrentLanguage: string\n\t\t\toneSelected: boolean\n\t\t\ttwoSelected: boolean\n\t\t\tthreeSelected: boolean\n\t\t}\n\t) => TLUiHelpMenuSchemaContextType\n\tchildren: any\n}\n\n/** @internal */\nexport const HelpMenuSchemaProvider = track(function HelpMenuSchemaProvider({\n\toverrides,\n\tchildren,\n}: TLUiHelpMenuSchemaProviderProps) {\n\tconst editor = useEditor()\n\tconst actions = useActions()\n\n\tconst selectedCount = editor.getSelectedShapeIds().length\n\n\tconst oneSelected = selectedCount > 0\n\tconst twoSelected = selectedCount > 1\n\tconst threeSelected = selectedCount > 2\n\n\tconst { languages, currentLanguage } = useLanguages()\n\tconst { addDialog } = useDialogs()\n\n\tconst helpTLUiMenuSchema = useMemo<TLUiMenuSchema>(() => {\n\t\tconst helpTLUiMenuSchema = compact([\n\t\t\tmenuGroup(\n\t\t\t\t'top',\n\t\t\t\tmenuCustom('LANGUAGE_MENU', { readonlyOk: true }),\n\t\t\t\tmenuItem({\n\t\t\t\t\tid: 'keyboard-shortcuts',\n\t\t\t\t\tlabel: 'help-menu.keyboard-shortcuts',\n\t\t\t\t\treadonlyOk: true,\n\t\t\t\t\tonSelect() {\n\t\t\t\t\t\taddDialog({ component: KeyboardShortcutsDialog })\n\t\t\t\t\t},\n\t\t\t\t})\n\t\t\t),\n\t\t])\n\n\t\tif (overrides) {\n\t\t\treturn overrides(editor, helpTLUiMenuSchema, {\n\t\t\t\tactions,\n\t\t\t\tcurrentLanguage,\n\t\t\t\tlanguages,\n\t\t\t\toneSelected,\n\t\t\t\ttwoSelected,\n\t\t\t\tthreeSelected,\n\t\t\t})\n\t\t}\n\n\t\treturn helpTLUiMenuSchema\n\t}, [\n\t\teditor,\n\t\toverrides,\n\t\tlanguages,\n\t\tactions,\n\t\toneSelected,\n\t\ttwoSelected,\n\t\tthreeSelected,\n\t\tcurrentLanguage,\n\t\taddDialog,\n\t])\n\n\treturn (\n\t\t<HelpMenuSchemaContext.Provider value={helpTLUiMenuSchema}>\n\t\t\t{children}\n\t\t</HelpMenuSchemaContext.Provider>\n\t)\n})\n\n/** @public */\nexport function useHelpMenuSchema(): TLUiMenuSchema {\n\tconst ctx = React.useContext(HelpMenuSchemaContext)\n\n\tif (!ctx) {\n\t\tthrow new Error('useHelpMenuSchema must be used inside of a helpTLUiMenuSchemaProvider.')\n\t}\n\n\treturn ctx\n}\n"],
+  "mappings": "AAyFE;AAzFF,SAA6B,SAAS,OAAO,iBAAiB;AAC9D,OAAO,SAAS,eAAe;AAC/B,SAAS,+BAA+B;AACxC,SAAyB,YAAY,WAAW,gBAAgB;AAChE,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAMtB,MAAM,wBAAwB,MAAM,cAAc,CAAC,CAAkC;AAoBrF,MAAM,yBAAyB,MAAM,SAASA,wBAAuB;AAAA,EAC3E;AAAA,EACA;AACD,GAAoC;AACnC,QAAM,SAAS,UAAU;AACzB,QAAM,UAAU,WAAW;AAE3B,QAAM,gBAAgB,OAAO,oBAAoB,EAAE;AAEnD,QAAM,cAAc,gBAAgB;AACpC,QAAM,cAAc,gBAAgB;AACpC,QAAM,gBAAgB,gBAAgB;AAEtC,QAAM,EAAE,WAAW,gBAAgB,IAAI,aAAa;AACpD,QAAM,EAAE,UAAU,IAAI,WAAW;AAEjC,QAAM,qBAAqB,QAAwB,MAAM;AACxD,UAAMC,sBAAqB,QAAQ;AAAA,MAClC;AAAA,QACC;AAAA,QACA,WAAW,iBAAiB,EAAE,YAAY,KAAK,CAAC;AAAA,QAChD,SAAS;AAAA,UACR,IAAI;AAAA,UACJ,OAAO;AAAA,UACP,YAAY;AAAA,UACZ,WAAW;AACV,sBAAU,EAAE,WAAW,wBAAwB,CAAC;AAAA,UACjD;AAAA,QACD,CAAC;AAAA,MACF;AAAA,IACD,CAAC;AAED,QAAI,WAAW;AACd,aAAO,UAAU,QAAQA,qBAAoB;AAAA,QAC5C;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,CAAC;AAAA,IACF;AAEA,WAAOA;AAAA,EACR,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,SACC,oBAAC,sBAAsB,UAAtB,EAA+B,OAAO,oBACrC,UACF;AAEF,CAAC;AAGM,SAAS,oBAAoC;AACnD,QAAM,MAAM,MAAM,WAAW,qBAAqB;AAElD,MAAI,CAAC,KAAK;AACT,UAAM,IAAI,MAAM,wEAAwE;AAAA,EACzF;AAEA,SAAO;AACR;",
+  "names": ["HelpMenuSchemaProvider", "helpTLUiMenuSchema"]
+}

package/dist-esm/lib/ui/hooks/useHighDpiCanvas.mjs

@@ -0,0 +1,15 @@
+import { useLayoutEffect } from "react";
+function useHighDpiCanvas(ref, dpr) {
+  useLayoutEffect(() => {
+    const canvas = ref.current;
+    if (!canvas)
+      return;
+    const rect = canvas.getBoundingClientRect();
+    canvas.width = rect.width * dpr;
+    canvas.height = rect.height * dpr;
+  }, [ref, dpr]);
+}
+export {
+  useHighDpiCanvas
+};
+//# sourceMappingURL=useHighDpiCanvas.mjs.map

package/dist-esm/lib/ui/hooks/useHighDpiCanvas.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/hooks/useHighDpiCanvas.ts"],
+  "sourcesContent": ["import { useLayoutEffect } from 'react'\n\n/** @internal */\nexport function useHighDpiCanvas(ref: React.RefObject<HTMLCanvasElement>, dpr: number) {\n\t// Match the resolution of the client\n\tuseLayoutEffect(() => {\n\t\tconst canvas = ref.current\n\t\tif (!canvas) return\n\n\t\tconst rect = canvas.getBoundingClientRect()\n\t\tcanvas.width = rect.width * dpr\n\t\tcanvas.height = rect.height * dpr\n\t}, [ref, dpr])\n}\n"],
+  "mappings": "AAAA,SAAS,uBAAuB;AAGzB,SAAS,iBAAiB,KAAyC,KAAa;AAEtF,kBAAgB,MAAM;AACrB,UAAM,SAAS,IAAI;AACnB,QAAI,CAAC;AAAQ;AAEb,UAAM,OAAO,OAAO,sBAAsB;AAC1C,WAAO,QAAQ,KAAK,QAAQ;AAC5B,WAAO,SAAS,KAAK,SAAS;AAAA,EAC/B,GAAG,CAAC,KAAK,GAAG,CAAC;AACd;",
+  "names": []
+}