kritzel-stencil 0.3.46 → 0.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +2 -1
- package/dist/cjs/kritzel-active-users_47.cjs.entry.js +249 -68
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{schema.constants-fuAsi56H.js → schema.constants-IAt9YXDZ.js} +273 -32
- package/dist/cjs/stencil.cjs.js +1 -1
- package/dist/collection/classes/handlers/context-menu.handler.js +2 -3
- package/dist/collection/classes/managers/clipboard.manager.js +9 -3
- package/dist/collection/classes/objects/base-object.class.js +0 -1
- package/dist/collection/classes/objects/text.class.js +2 -1
- package/dist/collection/classes/registries/font-registry.class.js +161 -0
- package/dist/collection/classes/structures/object-map.structure.js +9 -0
- package/dist/collection/classes/tools/image-tool.class.js +19 -3
- package/dist/collection/classes/tools/text-tool.class.js +2 -0
- package/dist/collection/components/core/kritzel-awareness-cursors/kritzel-awareness-cursors.js +22 -7
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +138 -9
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +58 -13
- package/dist/collection/components/shared/kritzel-font-family/kritzel-font-family.js +31 -22
- package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js +10 -11
- package/dist/collection/components/ui/kritzel-tool-config/kritzel-tool-config.js +40 -5
- package/dist/collection/configs/default-text-tool.config.js +2 -0
- package/dist/collection/constants/text-tool-fonts.constants.js +18 -0
- package/dist/collection/constants/version.js +1 -1
- package/dist/collection/helpers/image-file.helper.js +6 -0
- package/dist/collection/index.js +2 -0
- package/dist/collection/interfaces/font.interface.js +1 -0
- package/dist/components/index.js +1 -1
- package/dist/components/kritzel-awareness-cursors.js +1 -1
- package/dist/components/kritzel-controls.js +1 -1
- package/dist/components/kritzel-cursor-trail.js +1 -1
- package/dist/components/kritzel-editor.js +1 -1
- package/dist/components/kritzel-engine.js +1 -1
- package/dist/components/kritzel-font-family.js +1 -1
- package/dist/components/kritzel-settings.js +1 -1
- package/dist/components/kritzel-tool-config.js +1 -1
- package/dist/components/p-BH4oJ7yX.js +9 -0
- package/dist/components/p-C38P-Vd0.js +1 -0
- package/dist/components/p-Cm33td2O.js +1 -0
- package/dist/components/{p-Bjy2t3_g.js → p-Co165PAZ.js} +1 -1
- package/dist/components/p-DJkKlUyZ.js +1 -0
- package/dist/components/p-JYj3Facr.js +1 -0
- package/dist/components/p-Ka7OWbnk.js +1 -0
- package/dist/components/p-djJSnjAX.js +1 -0
- package/dist/esm/index.js +2 -2
- package/dist/esm/kritzel-active-users_47.entry.js +249 -68
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{schema.constants-Cv5-yM39.js → schema.constants-rIkxAcpB.js} +271 -33
- package/dist/esm/stencil.js +1 -1
- package/dist/stencil/index.esm.js +1 -1
- package/dist/stencil/p-966ca4b5.entry.js +9 -0
- package/dist/stencil/p-rIkxAcpB.js +1 -0
- package/dist/stencil/stencil.esm.js +1 -1
- package/dist/types/classes/managers/clipboard.manager.d.ts +1 -0
- package/dist/types/classes/objects/base-object.class.d.ts +0 -1
- package/dist/types/classes/registries/font-registry.class.d.ts +19 -0
- package/dist/types/classes/structures/object-map.structure.d.ts +2 -2
- package/dist/types/classes/tools/image-tool.class.d.ts +9 -2
- package/dist/types/classes/tools/text-tool.class.d.ts +3 -0
- package/dist/types/components/core/kritzel-awareness-cursors/kritzel-awareness-cursors.d.ts +2 -0
- package/dist/types/components/core/kritzel-editor/kritzel-editor.d.ts +22 -0
- package/dist/types/components/core/kritzel-engine/kritzel-engine.d.ts +10 -0
- package/dist/types/components/shared/kritzel-font-family/kritzel-font-family.d.ts +4 -0
- package/dist/types/components/ui/kritzel-tool-config/kritzel-tool-config.d.ts +1 -0
- package/dist/types/components.d.ts +20 -2
- package/dist/types/constants/text-tool-fonts.constants.d.ts +3 -0
- package/dist/types/constants/version.d.ts +1 -1
- package/dist/types/helpers/image-file.helper.d.ts +3 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/interfaces/font.interface.d.ts +15 -0
- package/dist/types/interfaces/toolbar-control.interface.d.ts +2 -0
- package/package.json +1 -1
- package/dist/components/p-B4b6TDxp.js +0 -1
- package/dist/components/p-C2ocjA6D.js +0 -1
- package/dist/components/p-CwbZCXKh.js +0 -1
- package/dist/components/p-D2q_wTyG.js +0 -1
- package/dist/components/p-D8NvNMcU.js +0 -1
- package/dist/components/p-D8W6LE-c.js +0 -1
- package/dist/components/p-G9G9y5VE.js +0 -9
- package/dist/components/p-JhOYwUOj.js +0 -1
- package/dist/components/p-UEf2EN23.js +0 -1
- package/dist/stencil/p-56ea721b.entry.js +0 -9
- package/dist/stencil/p-Cv5-yM39.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as o}from"./p-Dhio9uis.js";export{s as setNonce}from"./p-Dhio9uis.js";import{g as t}from"./p-DQuL1Twl.js";(()=>{const o=import.meta.url,t={};return""!==o&&(t.resourcesUrl=new URL(".",o).href),e(t)})().then((async e=>(await t(),o(JSON.parse('[["p-56ea721b",[[512,"kritzel-editor",{"scaleMax":[1026,"scale-max"],"scaleMin":[1026,"scale-min"],"lockDrawingScale":[1028,"lock-drawing-scale"],"viewportBoundaryLeft":[1026,"viewport-boundary-left"],"viewportBoundaryRight":[1026,"viewport-boundary-right"],"viewportBoundaryTop":[1026,"viewport-boundary-top"],"viewportBoundaryBottom":[1026,"viewport-boundary-bottom"],"debugInfo":[1040],"user":[16],"activeUsers":[16],"controls":[16],"globalContextMenuItems":[16],"objectContextMenuItems":[16],"themes":[16],"theme":[1025],"licenseKey":[1,"license-key"],"locale":[1025],"locales":[16],"fallbackLocale":[1,"fallback-locale"],"customSvgIcons":[16],"isPanningEnabled":[1028,"is-panning-enabled"],"isZoomingEnabled":[1028,"is-zooming-enabled"],"isControlsVisible":[4,"is-controls-visible"],"isUtilityPanelVisible":[4,"is-utility-panel-visible"],"isWorkspaceManagerVisible":[4,"is-workspace-manager-visible"],"isMoreMenuVisible":[4,"is-more-menu-visible"],"isZoomPanelVisible":[4,"is-zoom-panel-visible"],"isObjectDistanceFadingActive":[4,"is-object-distance-fading-active"],"syncConfig":[16],"assetStorageConfig":[16],"cursorTarget":[16],"loginConfig":[16],"isLoading":[4,"is-loading"],"editorId":[1,"editor-id"],"activeWorkspaceId":[1,"active-workspace-id"],"isEngineReady":[32],"isControlsReady":[32],"isWorkspaceManagerReady":[32],"workspaces":[32],"activeWorkspace":[32],"isVirtualKeyboardOpen":[32],"undoState":[32],"isBackToContentButtonVisible":[32],"resolvedTerms":[32],"availableLocaleOptions":[32],"currentZoomPercent":[32],"shortcuts":[32],"currentIsPublic":[32],"isEditorVisible":[32],"activeNotification":[32],"isNotificationDismissing":[32],"getObjectById":[64],"addObject":[64],"addObjects":[64],"updateObject":[64],"removeObject":[64],"removeObjects":[64],"getSelectedObjects":[64],"selectObjects":[64],"selectAllObjectsInViewport":[64],"clearSelection":[64],"centerObjectInViewport":[64],"panToObject":[64],"backToContent":[64],"centerAllObjects":[64],"centerObjects":[64],"setViewport":[64],"panTo":[64],"zoomTo":[64],"zoomIn":[64],"zoomOut":[64],"getViewport":[64],"screenToWorld":[64],"worldToScreen":[64],"createWorkspace":[64],"updateWorkspace":[64],"deleteWorkspace":[64],"getWorkspaces":[64],"getActiveWorkspace":[64],"loadSharedWorkspace":[64],"reinitSync":[64],"registerTool":[64],"changeActiveTool":[64],"changeActiveToolByName":[64],"disable":[64],"enable":[64],"copy":[64],"cut":[64],"paste":[64],"delete":[64],"bringForward":[64],"sendBackward":[64],"bringToFront":[64],"sendToBack":[64],"alignObjects":[64],"group":[64],"ungroup":[64],"undo":[64],"redo":[64],"getScreenshot":[64],"exportViewportAsPng":[64],"exportViewportAsSvg":[64],"exportSelectedObjectsAsPng":[64],"exportSelectedObjectsAsSvg":[64],"downloadAsJson":[64],"importFromFile":[64],"loadObjectsFromJson":[64],"getObjectsTotalCount":[64],"getAllObjects":[64],"findObjects":[64],"getObjectsInViewport":[64],"hideContextMenu":[64],"openContextMenu":[64],"triggerSelectionChange":[64],"getDisplayableShortcuts":[64],"triggerNotification":[64],"openLoginDialog":[64],"setLoginLoading":[64],"setLocale":[64],"getLocale":[64],"getAvailableLocales":[64],"registerLocales":[64],"t":[64]},[[0,"dblclick","onTouchStart"]],{"isEngineReady":[{"onIsEngineReady":0}],"isControlsReady":[{"onIsControlsReady":0}],"workspaces":[{"onWorkspacesChange":0}],"activeWorkspace":[{"onActiveWorkspaceChange":0}],"activeWorkspaceId":[{"onActiveWorkspaceIdChange":0}],"theme":[{"onCurrentThemeChange":0}],"themes":[{"onThemesChange":0}],"locale":[{"onLocaleChange":0}]}],[513,"kritzel-controls",{"visible":[4],"controls":[16],"activeControl":[1040],"isUtilityPanelVisible":[4,"is-utility-panel-visible"],"undoState":[16],"theme":[1],"terms":[16],"firstConfig":[32],"isTouchDevice":[32],"selectedSubOptions":[32],"canScrollLeft":[32],"canScrollRight":[32],"needsScrolling":[32],"displayValues":[32],"internalControls":[32],"closeTooltip":[64]},[[8,"keydown","handleKeyDown"]],{"controls":[{"onControlsChange":0}],"theme":[{"onThemeChange":0}]}],[513,"kritzel-engine",{"workspace":[16],"editorId":[1,"editor-id"],"activeWorkspaceId":[1,"active-workspace-id"],"syncConfig":[16],"assetStorageConfig":[16],"user":[16],"globalContextMenuItems":[16],"objectContextMenuItems":[16],"scaleMax":[1026,"scale-max"],"scaleMin":[1026,"scale-min"],"cursorTarget":[16],"lockDrawingScale":[4,"lock-drawing-scale"],"isObjectDistanceFadingActive":[4,"is-object-distance-fading-active"],"theme":[1],"licenseKey":[1,"license-key"],"themes":[16],"locale":[1],"locales":[16],"fallbackLocale":[1,"fallback-locale"],"viewportBoundaryLeft":[2,"viewport-boundary-left"],"viewportBoundaryRight":[2,"viewport-boundary-right"],"viewportBoundaryTop":[2,"viewport-boundary-top"],"viewportBoundaryBottom":[2,"viewport-boundary-bottom"],"debugInfo":[16],"isPanningEnabled":[4,"is-panning-enabled"],"isZoomingEnabled":[4,"is-zooming-enabled"],"isLoading":[4,"is-loading"],"forceUpdate":[32],"isSyncing":[32],"triggerSelectionChange":[64],"registerTool":[64],"changeActiveTool":[64],"changeActiveToolByName":[64],"disable":[64],"enable":[64],"delete":[64],"copy":[64],"cut":[64],"paste":[64],"bringForward":[64],"sendBackward":[64],"bringToFront":[64],"sendToBack":[64],"alignObjects":[64],"group":[64],"ungroup":[64],"undo":[64],"redo":[64],"hideContextMenu":[64],"openContextMenu":[64],"getObjectById":[64],"getAllObjects":[64],"findObjects":[64],"getObjectsTotalCount":[64],"addObject":[64],"addObjects":[64],"updateObject":[64],"removeObject":[64],"removeObjects":[64],"getSelectedObjects":[64],"getDisplayableShortcuts":[64],"selectObjects":[64],"selectAllObjectsInViewport":[64],"clearSelection":[64],"centerObjectInViewport":[64],"panToObject":[64],"backToContent":[64],"centerAllObjects":[64],"centerObjects":[64],"setViewport":[64],"panTo":[64],"zoomTo":[64],"zoomIn":[64],"zoomOut":[64],"getViewport":[64],"screenToWorld":[64],"worldToScreen":[64],"getObjectsInViewport":[64],"getScreenshot":[64],"exportViewportAsPng":[64],"exportViewportAsSvg":[64],"getSelectedObjectsAsSvgString":[64],"exportSelectedObjectsAsSvg":[64],"getSelectedObjectsAsPngDataUrl":[64],"exportSelectedObjectsAsPng":[64],"exportAsJson":[64],"importFromJson":[64],"loadObjectsFromJson":[64],"downloadAsJson":[64],"importFromFile":[64],"createWorkspace":[64],"updateWorkspace":[64],"deleteWorkspace":[64],"getWorkspaces":[64],"getActiveWorkspace":[64],"getIsPublic":[64],"loadSharedWorkspace":[64],"reinitSync":[64],"saveSettings":[64],"loadSettings":[64],"registerLocales":[64],"setLocale":[64],"getLocale":[64],"getAvailableLocales":[64],"getAvailableLocaleOptions":[64],"t":[64],"getResolvedTerms":[64]},[[1,"wheel","handleWheel"],[0,"pointerdown","handlePointerDown"],[0,"pointermove","handlePointerMove"],[0,"pointerup","handlePointerUp"],[0,"pointercancel","handlePointerCancel"],[1,"pointerleave","handlePointerLeave"],[1,"longpress","handleLongPress"],[0,"contextmenu","handleContextMenu"],[9,"resize","handleResize"],[8,"keydown","handleKeyDown"],[8,"keyup","handleKeyUp"],[8,"copy","handleCopy"],[8,"cut","handleCut"],[8,"paste","handlePaste"],[4,"dblclick","preventDoubleTapZoomOnTouchDevices"]],{"workspace":[{"onWorkspaceChange":0}],"activeWorkspaceId":[{"onActiveWorkspaceIdChange":0}],"syncConfig":[{"onSyncConfigChange":0}],"assetStorageConfig":[{"onAssetStorageConfigChange":0}],"user":[{"onUserChange":0}],"globalContextMenuItems":[{"onGlobalContextMenuItemsChange":0}],"objectContextMenuItems":[{"onObjectContextMenuItemsChange":0}],"scaleMax":[{"validateScaleMax":0}],"scaleMin":[{"validateScaleMin":0}],"cursorTarget":[{"onCursorTargetChange":0}],"lockDrawingScale":[{"onLockDrawingScaleChange":0}],"isObjectDistanceFadingActive":[{"onIsObjectDistanceFadingActiveChange":0}],"theme":[{"onThemeChange":0}],"licenseKey":[{"onLicenseKeyChange":0}],"themes":[{"onThemesChange":0}],"locale":[{"onLocaleChange":0}],"locales":[{"onLocalesChange":0}],"fallbackLocale":[{"onFallbackLocaleChange":0}],"viewportBoundaryLeft":[{"onViewportBoundaryLeftChange":0}],"viewportBoundaryRight":[{"onViewportBoundaryRightChange":0}],"viewportBoundaryTop":[{"onViewportBoundaryTopChange":0}],"viewportBoundaryBottom":[{"onViewportBoundaryBottomChange":0}],"debugInfo":[{"onDebugInfoChange":0}],"isLoading":[{"onIsLoadingChange":0}]}],[513,"kritzel-settings",{"availableThemes":[16],"availableLocales":[16],"shortcuts":[16],"terms":[16],"settings":[16],"isDialogOpen":[32],"selectedCategoryId":[32],"scaleMin":[32],"scaleMax":[32],"lockDrawingScale":[32],"theme":[32],"locale":[32],"viewportBoundaryLeft":[32],"viewportBoundaryRight":[32],"viewportBoundaryTop":[32],"viewportBoundaryBottom":[32],"debugInfo":[32],"open":[64]},null,{"settings":[{"onSettingsPropChange":0}]}],[513,"kritzel-export",{"workspaceName":[1,"workspace-name"],"terms":[16],"isDialogOpen":[32],"previewUrl":[32],"isLoading":[32],"activeTab":[32],"exportFilename":[32],"viewportExportFormat":[32],"open":[64]}],[513,"kritzel-workspace-manager",{"visible":[4],"activeWorkspace":[1040],"workspaces":[16],"terms":[16],"childMenuAnchor":[32],"openChildMenuItem":[32],"newWorkspace":[32],"editingItemId":[32]},[[8,"wheel","handleWheel"]]],[513,"kritzel-more-menu",{"visible":[4],"items":[16],"icon":[1],"iconSize":[2,"icon-size"],"offsetY":[2,"offset-y"],"terms":[16],"menuAnchor":[32],"isTouchDevice":[32]}],[513,"kritzel-current-user-dialog",{"user":[16],"terms":[16],"isDialogOpen":[32],"open":[64],"close":[64]}],[513,"kritzel-share-dialog",{"isPublic":[4,"is-public"],"workspaceId":[1,"workspace-id"],"terms":[16],"isDialogOpen":[32],"internalIsPublic":[32],"copySuccess":[32],"qrCodeDataUrl":[32],"open":[64],"close":[64]},null,{"isPublic":[{"onIsPublicChange":0}],"workspaceId":[{"onWorkspaceIdChange":0}]}],[513,"kritzel-login-dialog",{"providers":[16],"dialogTitle":[1,"dialog-title"],"subtitle":[1],"isDialogOpen":[32],"loadingProvider":[32],"open":[64],"close":[64],"setLoading":[64]}],[513,"kritzel-active-users",{"users":[16],"avatarSize":[2,"avatar-size"],"maxVisible":[2,"max-visible"],"overlap":[2]}],[513,"kritzel-back-to-content",{"visible":[4],"text":[1]}],[513,"kritzel-current-user",{"user":[16],"avatarSize":[2,"avatar-size"],"terms":[16]}],[513,"kritzel-notification-card",{"notification":[16],"showTimestamp":[4,"show-timestamp"],"locale":[1]}],[513,"kritzel-zoom-panel",{"visible":[4],"disabled":[4],"zoomPercent":[2,"zoom-percent"],"terms":[16]}],[513,"kritzel-tool-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"],"theme":[1],"engine":[16],"terms":[16],"config":[32],"palette":[32],"sizes":[32],"currentOpacity":[32],"updateTrigger":[32]},null,{"tool":[{"handleToolChange":0}],"theme":[{"onThemeChange":0}],"engine":[{"handleEngineChange":0}]}],[513,"kritzel-split-button",{"buttonIcon":[1,"button-icon"],"dropdownIcon":[1,"dropdown-icon"],"items":[16],"mainButtonDisabled":[4,"main-button-disabled"],"menuButtonDisabled":[4,"menu-button-disabled"],"isMenuOpen":[32],"isTouchDevice":[32],"anchorElement":[32],"menuScrollTop":[32],"open":[64],"focusMenu":[64]}],[513,"kritzel-context-menu",{"items":[16],"objects":[16],"processedItems":[32],"openSubmenuPath":[32],"submenuPositions":[32]},[[9,"pointerdown","handleOutsideClick"]],{"items":[{"onItemsChanged":0}]}],[769,"kritzel-master-detail",{"items":[16],"selectedItemId":[1,"selected-item-id"],"focusedIndex":[32],"showMobileDetail":[32]},null,{"selectedItemId":[{"watchSelectedItemId":0}]}],[513,"kritzel-pill-tabs",{"tabs":[16],"value":[1025]}],[513,"kritzel-utility-panel",{"undoState":[16],"terms":[16]}],[513,"kritzel-awareness-cursors",{"core":[16],"showEdgeIndicators":[4,"show-edge-indicators"],"edgeIndicatorPadding":[2,"edge-indicator-padding"],"remoteCursors":[32],"objectVersion":[32]}],[769,"kritzel-button",{"variant":[1],"disabled":[4],"type":[1]}],[513,"kritzel-cursor-trail",{"core":[16],"cursorTrailPoints":[32],"isLeftButtonDown":[32]},[[9,"pointerdown","handleMouseDown"],[9,"pointermove","handlePointerMove"],[9,"pointerup","handlePointerUp"]]],[513,"kritzel-input",{"value":[1025],"label":[1],"placeholder":[1],"suffix":[1],"type":[1],"disabled":[4],"inputValue":[32]},null,{"value":[{"onValueChange":0}]}],[513,"kritzel-loading-overlay",{"visible":[4],"text":[1]}],[513,"kritzel-numeric-input",{"value":[1026],"min":[2],"max":[2],"step":[2],"label":[1],"placeholder":[1],"inputValue":[32]},null,{"value":[{"onValueChange":0}]}],[513,"kritzel-sync-indicator",{"visible":[4],"text":[1]}],[769,"kritzel-tooltip",{"isVisible":[1028,"is-visible"],"anchorElement":[16],"triggerElement":[16],"offsetY":[2,"offset-y"],"positionX":[32],"positionY":[32],"open":[64],"close":[64],"toggle":[64],"focusContent":[64]},[[4,"click","handleOutsideClick"],[6,"pointerdown","handleOutsidePointerDown"],[4,"kritzelTooltipCloseAll","handleCloseAll"],[9,"resize","handleWindowResize"]],{"triggerElement":[{"handleTriggerElementChange":0}],"isVisible":[{"handleVisibilityChange":0}]}],[513,"kritzel-watermark",{"core":[16],"label":[1]}],[513,"kritzel-color-palette",{"colors":[16],"selectedColor":[1040],"isExpanded":[4,"is-expanded"],"isOpaque":[4,"is-opaque"],"opacity":[2],"theme":[1]}],[513,"kritzel-font-family",{"fontOptions":[16],"selectedFontFamily":[1025,"selected-font-family"]}],[513,"kritzel-font-size",{"sizes":[16],"selectedSize":[1026,"selected-size"],"fontFamily":[1,"font-family"]}],[513,"kritzel-stroke-size",{"sizes":[16],"selectedSize":[1026,"selected-size"]}],[513,"kritzel-line-endings",{"styles":[16],"value":[1040]}],[513,"kritzel-opacity-slider",{"value":[1026],"min":[2],"max":[2],"step":[2],"previewColor":[1,"preview-color"]}],[513,"kritzel-shape-fill",{"value":[1025]}],[513,"kritzel-slide-toggle",{"checked":[1028],"disabled":[4],"label":[1]}],[513,"kritzel-avatar",{"user":[16],"name":[1],"size":[2],"color":[1],"imageError":[32]},null,{"user":[{"userChanged":0}],"profileImageUrl":[{"profileImageUrlChanged":0}]}],[513,"kritzel-font",{"fontFamily":[1,"font-family"],"size":[2],"color":[1]}],[513,"kritzel-color",{"value":[1],"theme":[1],"size":[2]}],[513,"kritzel-menu",{"items":[16],"parent":[16],"selectedIndex":[32],"setScrollTop":[64],"setFocus":[64]}],[513,"kritzel-menu-item",{"item":[16],"parent":[16],"isDirty":[32]},null,{"item":[{"onItemChange":0}]}],[769,"kritzel-dialog",{"isOpen":[516,"is-open"],"dialogTitle":[1,"dialog-title"],"closable":[4],"closeOnBackdrop":[4,"close-on-backdrop"],"closeOnEscape":[4,"close-on-escape"],"autoFocus":[4,"auto-focus"],"trapFocus":[4,"trap-focus"],"size":[1],"fullscreenOnMobile":[4,"fullscreen-on-mobile"],"contained":[516],"isAnimating":[32],"mobileLockedHeight":[32],"containerRect":[32],"containerBorderRadius":[32],"open":[64],"close":[64],"focusFirstElement":[64]},[[8,"keydown","handleKeyDown"],[9,"resize","handleWindowResize"],[8,"orientationchange","handleOrientationChange"]],{"isOpen":[{"handleIsOpenChange":0}]}],[769,"kritzel-portal",{"anchor":[16],"offsetX":[2,"offset-x"],"offsetY":[2,"offset-y"],"autoFocus":[4,"auto-focus"]},[[8,"kritzel-dismiss-menus","handleDismissMenus"],[8,"click","handleOutsideClick"],[6,"pointerdown","handleOutsidePointerDown"],[8,"keydown","handleKeyDown"],[11,"resize","handleResize"],[11,"scroll","handleWindowScroll"]],{"anchor":[{"anchorChanged":0}]}],[769,"kritzel-dropdown",{"options":[16],"value":[1],"width":[1],"selectStyles":[16],"forceOpenDirection":[1,"force-open-direction"],"internalValue":[32],"hasSuffixContent":[32],"hasPrefixContent":[32],"isOpen":[32],"focusedIndex":[32],"openDirection":[32]},[[4,"click","handleDocumentClick"],[4,"keydown","handleDocumentKeydown"]],{"options":[{"optionsChanged":0}],"value":[{"externalValueChanged":0}]}],[513,"kritzel-icon",{"name":[1],"label":[1],"size":[2]}]]],["p-fb32cd8f",[[513,"kritzel-brush-style",{"type":[1],"brushOptions":[16]}]]]]'),e))));
|
|
1
|
+
import{p as e,b as o}from"./p-Dhio9uis.js";export{s as setNonce}from"./p-Dhio9uis.js";import{g as t}from"./p-DQuL1Twl.js";(()=>{const o=import.meta.url,t={};return""!==o&&(t.resourcesUrl=new URL(".",o).href),e(t)})().then((async e=>(await t(),o(JSON.parse('[["p-966ca4b5",[[512,"kritzel-editor",{"scaleMax":[1026,"scale-max"],"scaleMin":[1026,"scale-min"],"lockDrawingScale":[1028,"lock-drawing-scale"],"viewportBoundaryLeft":[1026,"viewport-boundary-left"],"viewportBoundaryRight":[1026,"viewport-boundary-right"],"viewportBoundaryTop":[1026,"viewport-boundary-top"],"viewportBoundaryBottom":[1026,"viewport-boundary-bottom"],"debugInfo":[1040],"user":[16],"activeUsers":[16],"controls":[16],"globalContextMenuItems":[16],"objectContextMenuItems":[16],"themes":[16],"theme":[1025],"licenseKey":[1,"license-key"],"locale":[1025],"locales":[16],"fallbackLocale":[1,"fallback-locale"],"customSvgIcons":[16],"customFonts":[16],"isPanningEnabled":[1028,"is-panning-enabled"],"isZoomingEnabled":[1028,"is-zooming-enabled"],"isControlsVisible":[4,"is-controls-visible"],"isUtilityPanelVisible":[4,"is-utility-panel-visible"],"isWorkspaceManagerVisible":[4,"is-workspace-manager-visible"],"isMoreMenuVisible":[4,"is-more-menu-visible"],"isZoomPanelVisible":[4,"is-zoom-panel-visible"],"isObjectDistanceFadingActive":[4,"is-object-distance-fading-active"],"syncConfig":[16],"assetStorageConfig":[16],"cursorTarget":[16],"loginConfig":[16],"isLoading":[4,"is-loading"],"editorId":[1,"editor-id"],"activeWorkspaceId":[1,"active-workspace-id"],"isEngineReady":[32],"isControlsReady":[32],"isWorkspaceManagerReady":[32],"workspaces":[32],"activeWorkspace":[32],"isVirtualKeyboardOpen":[32],"undoState":[32],"isBackToContentButtonVisible":[32],"resolvedTerms":[32],"availableLocaleOptions":[32],"currentZoomPercent":[32],"shortcuts":[32],"currentIsPublic":[32],"isEditorVisible":[32],"activeNotification":[32],"isNotificationDismissing":[32],"normalizedControls":[32],"getObjectById":[64],"addObject":[64],"addObjects":[64],"updateObject":[64],"removeObject":[64],"removeObjects":[64],"getSelectedObjects":[64],"selectObjects":[64],"selectAllObjectsInViewport":[64],"clearSelection":[64],"centerObjectInViewport":[64],"panToObject":[64],"backToContent":[64],"centerAllObjects":[64],"centerObjects":[64],"setViewport":[64],"panTo":[64],"zoomTo":[64],"zoomIn":[64],"zoomOut":[64],"getViewport":[64],"screenToWorld":[64],"worldToScreen":[64],"createWorkspace":[64],"updateWorkspace":[64],"deleteWorkspace":[64],"getWorkspaces":[64],"getActiveWorkspace":[64],"loadSharedWorkspace":[64],"reinitSync":[64],"registerTool":[64],"changeActiveTool":[64],"changeActiveToolByName":[64],"disable":[64],"enable":[64],"copy":[64],"cut":[64],"paste":[64],"delete":[64],"bringForward":[64],"sendBackward":[64],"bringToFront":[64],"sendToBack":[64],"alignObjects":[64],"group":[64],"ungroup":[64],"undo":[64],"redo":[64],"getScreenshot":[64],"exportViewportAsPng":[64],"exportViewportAsSvg":[64],"exportSelectedObjectsAsPng":[64],"exportSelectedObjectsAsSvg":[64],"downloadAsJson":[64],"importFromFile":[64],"loadObjectsFromJson":[64],"getObjectsTotalCount":[64],"getAllObjects":[64],"findObjects":[64],"getObjectsInViewport":[64],"hideContextMenu":[64],"openContextMenu":[64],"triggerSelectionChange":[64],"getDisplayableShortcuts":[64],"triggerNotification":[64],"openLoginDialog":[64],"setLoginLoading":[64],"setLocale":[64],"getLocale":[64],"getAvailableLocales":[64],"registerLocales":[64],"registerFonts":[64],"t":[64]},[[0,"dblclick","onTouchStart"]],{"isEngineReady":[{"onIsEngineReady":0}],"isControlsReady":[{"onIsControlsReady":0}],"workspaces":[{"onWorkspacesChange":0}],"activeWorkspace":[{"onActiveWorkspaceChange":0}],"customFonts":[{"onCustomFontsChange":0}],"controls":[{"onControlsChange":0}],"activeWorkspaceId":[{"onActiveWorkspaceIdChange":0}],"theme":[{"onCurrentThemeChange":0}],"themes":[{"onThemesChange":0}],"locale":[{"onLocaleChange":0}]}],[513,"kritzel-controls",{"visible":[4],"controls":[16],"activeControl":[1040],"isUtilityPanelVisible":[4,"is-utility-panel-visible"],"undoState":[16],"theme":[1],"terms":[16],"firstConfig":[32],"isTouchDevice":[32],"selectedSubOptions":[32],"canScrollLeft":[32],"canScrollRight":[32],"needsScrolling":[32],"displayValues":[32],"internalControls":[32],"closeTooltip":[64]},[[8,"keydown","handleKeyDown"]],{"controls":[{"onControlsChange":0}],"theme":[{"onThemeChange":0}]}],[513,"kritzel-engine",{"workspace":[16],"editorId":[1,"editor-id"],"activeWorkspaceId":[1,"active-workspace-id"],"syncConfig":[16],"assetStorageConfig":[16],"user":[16],"globalContextMenuItems":[16],"objectContextMenuItems":[16],"scaleMax":[1026,"scale-max"],"scaleMin":[1026,"scale-min"],"cursorTarget":[16],"lockDrawingScale":[4,"lock-drawing-scale"],"isObjectDistanceFadingActive":[4,"is-object-distance-fading-active"],"theme":[1],"licenseKey":[1,"license-key"],"themes":[16],"locale":[1],"locales":[16],"fallbackLocale":[1,"fallback-locale"],"viewportBoundaryLeft":[2,"viewport-boundary-left"],"viewportBoundaryRight":[2,"viewport-boundary-right"],"viewportBoundaryTop":[2,"viewport-boundary-top"],"viewportBoundaryBottom":[2,"viewport-boundary-bottom"],"debugInfo":[16],"isPanningEnabled":[4,"is-panning-enabled"],"isZoomingEnabled":[4,"is-zooming-enabled"],"isLoading":[4,"is-loading"],"forceUpdate":[32],"isSyncing":[32],"triggerSelectionChange":[64],"registerTool":[64],"changeActiveTool":[64],"changeActiveToolByName":[64],"disable":[64],"enable":[64],"delete":[64],"copy":[64],"cut":[64],"paste":[64],"bringForward":[64],"sendBackward":[64],"bringToFront":[64],"sendToBack":[64],"alignObjects":[64],"group":[64],"ungroup":[64],"undo":[64],"redo":[64],"hideContextMenu":[64],"openContextMenu":[64],"getObjectById":[64],"getAllObjects":[64],"findObjects":[64],"getObjectsTotalCount":[64],"addObject":[64],"addObjects":[64],"updateObject":[64],"removeObject":[64],"removeObjects":[64],"getSelectedObjects":[64],"getDisplayableShortcuts":[64],"selectObjects":[64],"selectAllObjectsInViewport":[64],"clearSelection":[64],"centerObjectInViewport":[64],"panToObject":[64],"backToContent":[64],"centerAllObjects":[64],"centerObjects":[64],"setViewport":[64],"panTo":[64],"zoomTo":[64],"zoomIn":[64],"zoomOut":[64],"getViewport":[64],"screenToWorld":[64],"worldToScreen":[64],"getObjectsInViewport":[64],"getScreenshot":[64],"exportViewportAsPng":[64],"exportViewportAsSvg":[64],"getSelectedObjectsAsSvgString":[64],"exportSelectedObjectsAsSvg":[64],"getSelectedObjectsAsPngDataUrl":[64],"exportSelectedObjectsAsPng":[64],"exportAsJson":[64],"importFromJson":[64],"loadObjectsFromJson":[64],"downloadAsJson":[64],"importFromFile":[64],"createWorkspace":[64],"updateWorkspace":[64],"deleteWorkspace":[64],"getWorkspaces":[64],"getActiveWorkspace":[64],"getIsPublic":[64],"loadSharedWorkspace":[64],"reinitSync":[64],"saveSettings":[64],"loadSettings":[64],"registerLocales":[64],"setLocale":[64],"getLocale":[64],"getAvailableLocales":[64],"getAvailableLocaleOptions":[64],"t":[64],"getResolvedTerms":[64]},[[1,"wheel","handleWheel"],[0,"pointerdown","handlePointerDown"],[0,"pointermove","handlePointerMove"],[0,"pointerup","handlePointerUp"],[0,"pointercancel","handlePointerCancel"],[1,"pointerleave","handlePointerLeave"],[1,"longpress","handleLongPress"],[0,"contextmenu","handleContextMenu"],[9,"resize","handleResize"],[8,"keydown","handleKeyDown"],[8,"keyup","handleKeyUp"],[8,"copy","handleCopy"],[8,"cut","handleCut"],[8,"paste","handlePaste"],[4,"dblclick","preventDoubleTapZoomOnTouchDevices"]],{"workspace":[{"onWorkspaceChange":0}],"activeWorkspaceId":[{"onActiveWorkspaceIdChange":0}],"syncConfig":[{"onSyncConfigChange":0}],"assetStorageConfig":[{"onAssetStorageConfigChange":0}],"user":[{"onUserChange":0}],"globalContextMenuItems":[{"onGlobalContextMenuItemsChange":0}],"objectContextMenuItems":[{"onObjectContextMenuItemsChange":0}],"scaleMax":[{"validateScaleMax":0}],"scaleMin":[{"validateScaleMin":0}],"cursorTarget":[{"onCursorTargetChange":0}],"lockDrawingScale":[{"onLockDrawingScaleChange":0}],"isObjectDistanceFadingActive":[{"onIsObjectDistanceFadingActiveChange":0}],"theme":[{"onThemeChange":0}],"licenseKey":[{"onLicenseKeyChange":0}],"themes":[{"onThemesChange":0}],"locale":[{"onLocaleChange":0}],"locales":[{"onLocalesChange":0}],"fallbackLocale":[{"onFallbackLocaleChange":0}],"viewportBoundaryLeft":[{"onViewportBoundaryLeftChange":0}],"viewportBoundaryRight":[{"onViewportBoundaryRightChange":0}],"viewportBoundaryTop":[{"onViewportBoundaryTopChange":0}],"viewportBoundaryBottom":[{"onViewportBoundaryBottomChange":0}],"debugInfo":[{"onDebugInfoChange":0}],"isLoading":[{"onIsLoadingChange":0}]}],[513,"kritzel-settings",{"availableThemes":[16],"availableLocales":[16],"shortcuts":[16],"terms":[16],"settings":[16],"isDialogOpen":[32],"selectedCategoryId":[32],"scaleMin":[32],"scaleMax":[32],"lockDrawingScale":[32],"theme":[32],"locale":[32],"viewportBoundaryLeft":[32],"viewportBoundaryRight":[32],"viewportBoundaryTop":[32],"viewportBoundaryBottom":[32],"debugInfo":[32],"open":[64]},null,{"settings":[{"onSettingsPropChange":0}]}],[513,"kritzel-export",{"workspaceName":[1,"workspace-name"],"terms":[16],"isDialogOpen":[32],"previewUrl":[32],"isLoading":[32],"activeTab":[32],"exportFilename":[32],"viewportExportFormat":[32],"open":[64]}],[513,"kritzel-workspace-manager",{"visible":[4],"activeWorkspace":[1040],"workspaces":[16],"terms":[16],"childMenuAnchor":[32],"openChildMenuItem":[32],"newWorkspace":[32],"editingItemId":[32]},[[8,"wheel","handleWheel"]]],[513,"kritzel-more-menu",{"visible":[4],"items":[16],"icon":[1],"iconSize":[2,"icon-size"],"offsetY":[2,"offset-y"],"terms":[16],"menuAnchor":[32],"isTouchDevice":[32]}],[513,"kritzel-current-user-dialog",{"user":[16],"terms":[16],"isDialogOpen":[32],"open":[64],"close":[64]}],[513,"kritzel-share-dialog",{"isPublic":[4,"is-public"],"workspaceId":[1,"workspace-id"],"terms":[16],"isDialogOpen":[32],"internalIsPublic":[32],"copySuccess":[32],"qrCodeDataUrl":[32],"open":[64],"close":[64]},null,{"isPublic":[{"onIsPublicChange":0}],"workspaceId":[{"onWorkspaceIdChange":0}]}],[513,"kritzel-login-dialog",{"providers":[16],"dialogTitle":[1,"dialog-title"],"subtitle":[1],"isDialogOpen":[32],"loadingProvider":[32],"open":[64],"close":[64],"setLoading":[64]}],[513,"kritzel-active-users",{"users":[16],"avatarSize":[2,"avatar-size"],"maxVisible":[2,"max-visible"],"overlap":[2]}],[513,"kritzel-back-to-content",{"visible":[4],"text":[1]}],[513,"kritzel-current-user",{"user":[16],"avatarSize":[2,"avatar-size"],"terms":[16]}],[513,"kritzel-notification-card",{"notification":[16],"showTimestamp":[4,"show-timestamp"],"locale":[1]}],[513,"kritzel-zoom-panel",{"visible":[4],"disabled":[4],"zoomPercent":[2,"zoom-percent"],"terms":[16]}],[513,"kritzel-tool-config",{"tool":[1040],"isExpanded":[1028,"is-expanded"],"theme":[1],"engine":[16],"terms":[16],"config":[32],"palette":[32],"sizes":[32],"currentOpacity":[32],"updateTrigger":[32]},null,{"tool":[{"handleToolChange":0}],"theme":[{"onThemeChange":0}],"engine":[{"handleEngineChange":0}]}],[513,"kritzel-split-button",{"buttonIcon":[1,"button-icon"],"dropdownIcon":[1,"dropdown-icon"],"items":[16],"mainButtonDisabled":[4,"main-button-disabled"],"menuButtonDisabled":[4,"menu-button-disabled"],"isMenuOpen":[32],"isTouchDevice":[32],"anchorElement":[32],"menuScrollTop":[32],"open":[64],"focusMenu":[64]}],[513,"kritzel-context-menu",{"items":[16],"objects":[16],"processedItems":[32],"openSubmenuPath":[32],"submenuPositions":[32]},[[9,"pointerdown","handleOutsideClick"]],{"items":[{"onItemsChanged":0}]}],[769,"kritzel-master-detail",{"items":[16],"selectedItemId":[1,"selected-item-id"],"focusedIndex":[32],"showMobileDetail":[32]},null,{"selectedItemId":[{"watchSelectedItemId":0}]}],[513,"kritzel-pill-tabs",{"tabs":[16],"value":[1025]}],[513,"kritzel-utility-panel",{"undoState":[16],"terms":[16]}],[513,"kritzel-awareness-cursors",{"core":[16],"showEdgeIndicators":[4,"show-edge-indicators"],"edgeIndicatorPadding":[2,"edge-indicator-padding"],"remoteCursors":[32],"objectVersion":[32]}],[769,"kritzel-button",{"variant":[1],"disabled":[4],"type":[1]}],[513,"kritzel-cursor-trail",{"core":[16],"cursorTrailPoints":[32],"isLeftButtonDown":[32]},[[9,"pointerdown","handleMouseDown"],[9,"pointermove","handlePointerMove"],[9,"pointerup","handlePointerUp"]]],[513,"kritzel-input",{"value":[1025],"label":[1],"placeholder":[1],"suffix":[1],"type":[1],"disabled":[4],"inputValue":[32]},null,{"value":[{"onValueChange":0}]}],[513,"kritzel-loading-overlay",{"visible":[4],"text":[1]}],[513,"kritzel-numeric-input",{"value":[1026],"min":[2],"max":[2],"step":[2],"label":[1],"placeholder":[1],"inputValue":[32]},null,{"value":[{"onValueChange":0}]}],[513,"kritzel-sync-indicator",{"visible":[4],"text":[1]}],[769,"kritzel-tooltip",{"isVisible":[1028,"is-visible"],"anchorElement":[16],"triggerElement":[16],"offsetY":[2,"offset-y"],"positionX":[32],"positionY":[32],"open":[64],"close":[64],"toggle":[64],"focusContent":[64]},[[4,"click","handleOutsideClick"],[6,"pointerdown","handleOutsidePointerDown"],[4,"kritzelTooltipCloseAll","handleCloseAll"],[9,"resize","handleWindowResize"]],{"triggerElement":[{"handleTriggerElementChange":0}],"isVisible":[{"handleVisibilityChange":0}]}],[513,"kritzel-watermark",{"core":[16],"label":[1]}],[513,"kritzel-color-palette",{"colors":[16],"selectedColor":[1040],"isExpanded":[4,"is-expanded"],"isOpaque":[4,"is-opaque"],"opacity":[2],"theme":[1]}],[513,"kritzel-font-family",{"fontOptions":[16],"selectedFontFamily":[1025,"selected-font-family"]},null,{"fontOptions":[{"handleFontOptionsChange":0}]}],[513,"kritzel-font-size",{"sizes":[16],"selectedSize":[1026,"selected-size"],"fontFamily":[1,"font-family"]}],[513,"kritzel-stroke-size",{"sizes":[16],"selectedSize":[1026,"selected-size"]}],[513,"kritzel-line-endings",{"styles":[16],"value":[1040]}],[513,"kritzel-opacity-slider",{"value":[1026],"min":[2],"max":[2],"step":[2],"previewColor":[1,"preview-color"]}],[513,"kritzel-shape-fill",{"value":[1025]}],[513,"kritzel-slide-toggle",{"checked":[1028],"disabled":[4],"label":[1]}],[513,"kritzel-avatar",{"user":[16],"name":[1],"size":[2],"color":[1],"imageError":[32]},null,{"user":[{"userChanged":0}],"profileImageUrl":[{"profileImageUrlChanged":0}]}],[513,"kritzel-font",{"fontFamily":[1,"font-family"],"size":[2],"color":[1]}],[513,"kritzel-color",{"value":[1],"theme":[1],"size":[2]}],[513,"kritzel-menu",{"items":[16],"parent":[16],"selectedIndex":[32],"setScrollTop":[64],"setFocus":[64]}],[513,"kritzel-menu-item",{"item":[16],"parent":[16],"isDirty":[32]},null,{"item":[{"onItemChange":0}]}],[769,"kritzel-dialog",{"isOpen":[516,"is-open"],"dialogTitle":[1,"dialog-title"],"closable":[4],"closeOnBackdrop":[4,"close-on-backdrop"],"closeOnEscape":[4,"close-on-escape"],"autoFocus":[4,"auto-focus"],"trapFocus":[4,"trap-focus"],"size":[1],"fullscreenOnMobile":[4,"fullscreen-on-mobile"],"contained":[516],"isAnimating":[32],"mobileLockedHeight":[32],"containerRect":[32],"containerBorderRadius":[32],"open":[64],"close":[64],"focusFirstElement":[64]},[[8,"keydown","handleKeyDown"],[9,"resize","handleWindowResize"],[8,"orientationchange","handleOrientationChange"]],{"isOpen":[{"handleIsOpenChange":0}]}],[769,"kritzel-portal",{"anchor":[16],"offsetX":[2,"offset-x"],"offsetY":[2,"offset-y"],"autoFocus":[4,"auto-focus"]},[[8,"kritzel-dismiss-menus","handleDismissMenus"],[8,"click","handleOutsideClick"],[6,"pointerdown","handleOutsidePointerDown"],[8,"keydown","handleKeyDown"],[11,"resize","handleResize"],[11,"scroll","handleWindowScroll"]],{"anchor":[{"anchorChanged":0}]}],[769,"kritzel-dropdown",{"options":[16],"value":[1],"width":[1],"selectStyles":[16],"forceOpenDirection":[1,"force-open-direction"],"internalValue":[32],"hasSuffixContent":[32],"hasPrefixContent":[32],"isOpen":[32],"focusedIndex":[32],"openDirection":[32]},[[4,"click","handleDocumentClick"],[4,"keydown","handleDocumentKeydown"]],{"options":[{"optionsChanged":0}],"value":[{"externalValueChanged":0}]}],[513,"kritzel-icon",{"name":[1],"label":[1],"size":[2]}]]],["p-fb32cd8f",[[513,"kritzel-brush-style",{"type":[1],"brushOptions":[16]}]]]]'),e))));
|
|
@@ -61,6 +61,7 @@ export declare class KritzelClipboardManager {
|
|
|
61
61
|
cut(event?: ClipboardEvent): void;
|
|
62
62
|
private materializeKritzelObjects;
|
|
63
63
|
private materializeImageFiles;
|
|
64
|
+
private prepareImageFile;
|
|
64
65
|
private materializePlainText;
|
|
65
66
|
/**
|
|
66
67
|
* Pastes objects from clipboard with optional explicit world coordinates.
|
|
@@ -34,7 +34,6 @@ export declare class KritzelBaseObject<T extends Element = HTMLElement | SVGElem
|
|
|
34
34
|
markedForRemoval: boolean;
|
|
35
35
|
zIndex: number;
|
|
36
36
|
userId?: string;
|
|
37
|
-
/** Whether the object is currently visible on the canvas */
|
|
38
37
|
isVisible: boolean;
|
|
39
38
|
isSelected: boolean;
|
|
40
39
|
isHovered: boolean;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { KritzelFontMap, KritzelFontRegistration, KritzelRegisteredFont } from '../../interfaces/font.interface';
|
|
2
|
+
export declare class KritzelFontRegistry {
|
|
3
|
+
private static get _fonts();
|
|
4
|
+
private static getFontFaceSet;
|
|
5
|
+
private static toCssFontFace;
|
|
6
|
+
private static getRegisteredFontFamilies;
|
|
7
|
+
static register(key: string, registration: KritzelFontRegistration): void;
|
|
8
|
+
static registerFonts(fonts: KritzelFontMap): void;
|
|
9
|
+
private static injectFontStylesheets;
|
|
10
|
+
static waitForFonts(fonts: KritzelFontMap): Promise<void>;
|
|
11
|
+
static get(key: string): KritzelRegisteredFont | undefined;
|
|
12
|
+
static has(key: string): boolean;
|
|
13
|
+
static unregister(key: string): boolean;
|
|
14
|
+
static list(): KritzelRegisteredFont[];
|
|
15
|
+
static resolveCssFontFamily(fontFamily: string): string;
|
|
16
|
+
static toRegisteredFont(registration: KritzelFontRegistration): KritzelRegisteredFont;
|
|
17
|
+
private static emitChange;
|
|
18
|
+
static get changeEventName(): string;
|
|
19
|
+
}
|
|
@@ -118,13 +118,13 @@ export declare class KritzelObjectMap<T extends KritzelBaseObject<any>> {
|
|
|
118
118
|
* Registers a callback to be invoked when the awareness state changes.
|
|
119
119
|
* The callback receives the full awareness states map.
|
|
120
120
|
*/
|
|
121
|
-
onAwarenessChange(callback: (states: Map<number, Record<string, any>>) => void): void;
|
|
121
|
+
onAwarenessChange(callback: (states: Map<number, Record<string, any>>) => void): () => void;
|
|
122
122
|
/**
|
|
123
123
|
* Registers a callback to be invoked when remote object changes are received.
|
|
124
124
|
* Used by the awareness cursors component to re-derive cursor positions
|
|
125
125
|
* from the latest object data when a remote user is actively drawing.
|
|
126
126
|
*/
|
|
127
|
-
onObjectsChange(callback: () => void): void;
|
|
127
|
+
onObjectsChange(callback: () => void): () => void;
|
|
128
128
|
/**
|
|
129
129
|
* Returns the Yjs UndoManager instance for managing undo/redo operations.
|
|
130
130
|
* @returns The UndoManager instance, or `null` if not initialized
|
|
@@ -5,7 +5,8 @@ import { KritzelCore } from '../core/core.class';
|
|
|
5
5
|
*
|
|
6
6
|
* Flow:
|
|
7
7
|
* 1. User picks a file.
|
|
8
|
-
* 2.
|
|
8
|
+
* 2. Static images are compressed via `browser-image-compression` (bandwidth win).
|
|
9
|
+
* GIF files retain their original bytes so animation is preserved.
|
|
9
10
|
* 3. Intrinsic dimensions are measured from a temporary object URL.
|
|
10
11
|
* 4. Bytes are uploaded through the asset resolver (write-through:
|
|
11
12
|
* local IndexedDB immediately, remote providers in the background).
|
|
@@ -44,11 +45,17 @@ export declare class KritzelImageTool extends KritzelBaseTool {
|
|
|
44
45
|
private setupFileInput;
|
|
45
46
|
/**
|
|
46
47
|
* Handles the file selection event from the file input.
|
|
47
|
-
* Compresses each selected image
|
|
48
|
+
* Compresses each selected image if necessaryand places them as a batch on the canvas.
|
|
48
49
|
* Resets the file input value after processing.
|
|
49
50
|
* @param event - The change event from the file input element
|
|
50
51
|
*/
|
|
51
52
|
private handleFileSelect;
|
|
53
|
+
/**
|
|
54
|
+
* Prepares an image file for insertion by compressing it if necessary.
|
|
55
|
+
* @param file
|
|
56
|
+
* @returns
|
|
57
|
+
*/
|
|
58
|
+
private prepareImageFile;
|
|
52
59
|
/**
|
|
53
60
|
* Adds a batch of prepared images to the canvas store and switches
|
|
54
61
|
* to the selection tool. The first image is centered in the viewport;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { KritzelBaseTool } from './base-tool.class';
|
|
2
2
|
import { KritzelCore } from '../core/core.class';
|
|
3
3
|
import { ThemeAwareColor } from '../../constants/color-palette.constants';
|
|
4
|
+
import { KritzelFontRegistration } from '../../interfaces/font.interface';
|
|
4
5
|
/**
|
|
5
6
|
* Text tool for creating and editing text objects on the canvas.
|
|
6
7
|
* Clicking creates a new text object at the pointer position and enters edit mode.
|
|
@@ -33,6 +34,8 @@ export declare class KritzelTextTool extends KritzelBaseTool {
|
|
|
33
34
|
palette: ThemeAwareColor[];
|
|
34
35
|
/** Available font size presets for the text tool */
|
|
35
36
|
sizes: number[];
|
|
37
|
+
/** Optional custom font options supplied through tool config. */
|
|
38
|
+
availableFonts?: KritzelFontRegistration[];
|
|
36
39
|
/**
|
|
37
40
|
* Creates a new instance of KritzelTextTool.
|
|
38
41
|
* @param core - The KritzelCore instance that provides access to application state and functionality
|
|
@@ -8,6 +8,8 @@ export declare class KritzelAwarenessCursors {
|
|
|
8
8
|
objectVersion: number;
|
|
9
9
|
private cleanupIntervalId;
|
|
10
10
|
private objectChangeRafId;
|
|
11
|
+
private removeAwarenessChangeListener;
|
|
12
|
+
private removeObjectsChangeListener;
|
|
11
13
|
componentDidLoad(): void;
|
|
12
14
|
disconnectedCallback(): void;
|
|
13
15
|
private handleAwarenessChange;
|
|
@@ -22,6 +22,7 @@ import { IKritzelIsPublicChangedEvent } from '../../../interfaces/share.interfac
|
|
|
22
22
|
import { KritzelLoginConfig as KritzelLoginConfig } from '../../../interfaces/login-config.interface';
|
|
23
23
|
import { LoginEvent } from '../../../events/login.event';
|
|
24
24
|
import { KritzelNotification } from '../../../interfaces/notification.interface';
|
|
25
|
+
import { KritzelFontMap } from '../../../interfaces/font.interface';
|
|
25
26
|
export declare class KritzelEditor {
|
|
26
27
|
host: HTMLElement;
|
|
27
28
|
scaleMax: number;
|
|
@@ -48,6 +49,11 @@ export declare class KritzelEditor {
|
|
|
48
49
|
/** The locale used to resolve terms missing from the active locale. */
|
|
49
50
|
fallbackLocale: LocaleCode;
|
|
50
51
|
customSvgIcons: Record<string, string>;
|
|
52
|
+
/**
|
|
53
|
+
* Registers fonts for runtime usage (for example custom object rendering).
|
|
54
|
+
* Text-tool config tooltip options are controlled via controls[].config.availableFonts.
|
|
55
|
+
*/
|
|
56
|
+
customFonts: KritzelFontMap;
|
|
51
57
|
isPanningEnabled: boolean;
|
|
52
58
|
isZoomingEnabled: boolean;
|
|
53
59
|
isControlsVisible: boolean;
|
|
@@ -103,15 +109,20 @@ export declare class KritzelEditor {
|
|
|
103
109
|
isEditorVisible: boolean;
|
|
104
110
|
activeNotification?: KritzelNotification;
|
|
105
111
|
isNotificationDismissing: boolean;
|
|
112
|
+
normalizedControls: KritzelToolbarControl[];
|
|
106
113
|
private notificationDismissTimeout?;
|
|
107
114
|
private notificationDismissAnimationTimeout?;
|
|
108
115
|
private readonly notificationDisplayDurationMs;
|
|
109
116
|
private readonly notificationDismissAnimationDurationMs;
|
|
110
117
|
private isNotificationHovered;
|
|
118
|
+
private customFontsLoadVersion;
|
|
119
|
+
private customFontsReady;
|
|
111
120
|
onIsEngineReady(newValue: boolean): void;
|
|
112
121
|
onIsControlsReady(newValue: boolean): void;
|
|
113
122
|
onWorkspacesChange(newWorkspaces: KritzelWorkspace[]): void;
|
|
114
123
|
onActiveWorkspaceChange(): void;
|
|
124
|
+
onCustomFontsChange(newValue: KritzelFontMap): void;
|
|
125
|
+
onControlsChange(newValue: KritzelToolbarControl[]): void;
|
|
115
126
|
onActiveWorkspaceIdChange(newId?: string): void;
|
|
116
127
|
onCurrentThemeChange(): void;
|
|
117
128
|
onThemesChange(): void;
|
|
@@ -217,6 +228,8 @@ export declare class KritzelEditor {
|
|
|
217
228
|
loginDialogRef: HTMLKritzelLoginDialogElement;
|
|
218
229
|
currentUserDialogRef: HTMLKritzelCurrentUserDialogElement;
|
|
219
230
|
componentWillLoad(): void;
|
|
231
|
+
private isTextToolConfig;
|
|
232
|
+
private normalizeControls;
|
|
220
233
|
private applyTheme;
|
|
221
234
|
private resolveThemeObject;
|
|
222
235
|
componentDidLoad(): void;
|
|
@@ -270,6 +283,13 @@ export declare class KritzelEditor {
|
|
|
270
283
|
* @param locales - The locale definitions to register.
|
|
271
284
|
*/
|
|
272
285
|
registerLocales(locales: KritzelLocale[]): Promise<void>;
|
|
286
|
+
/**
|
|
287
|
+
* Registers custom fonts for the editor runtime.
|
|
288
|
+
* @param fonts - Mapping from font keys to family names or font definitions.
|
|
289
|
+
* @remarks This no longer controls the text-tool config tooltip font options.
|
|
290
|
+
* Configure tooltip fonts via controls[].config.availableFonts.
|
|
291
|
+
*/
|
|
292
|
+
registerFonts(fonts: KritzelFontMap): Promise<void>;
|
|
273
293
|
/**
|
|
274
294
|
* Resolves a term key to its translated string for the active locale.
|
|
275
295
|
* @param key - The term key to resolve.
|
|
@@ -282,6 +302,8 @@ export declare class KritzelEditor {
|
|
|
282
302
|
private get currentSettingsConfig();
|
|
283
303
|
private getContentObjects;
|
|
284
304
|
private registerCustomSvgIcons;
|
|
305
|
+
private registerCustomFonts;
|
|
306
|
+
private waitForCustomFontsReady;
|
|
285
307
|
private listenForMobileKeyboard;
|
|
286
308
|
private setOsSpecificCssVariables;
|
|
287
309
|
render(): any;
|
|
@@ -646,6 +646,16 @@ export declare class KritzelEngine {
|
|
|
646
646
|
private syncLoadingState;
|
|
647
647
|
private syncSyncingState;
|
|
648
648
|
private applyToolConfig;
|
|
649
|
+
private normalizeToolConfig;
|
|
650
|
+
private isTextToolConfig;
|
|
651
|
+
/** Built-in tool classes of this bundle keyed by their tool type. */
|
|
652
|
+
private static readonly BUILT_IN_TOOL_CLASSES;
|
|
653
|
+
/**
|
|
654
|
+
* Resolves a tool class to the internal built-in class when a foreign copy is passed.
|
|
655
|
+
* Classes from another compiled copy of the library (dual-package hazard, e.g. built-ins
|
|
656
|
+
* re-exported by a framework wrapper) would otherwise break `instanceof` checks.
|
|
657
|
+
*/
|
|
658
|
+
private resolveToolClass;
|
|
649
659
|
get isSelecting(): boolean;
|
|
650
660
|
get isSelectionActive(): boolean;
|
|
651
661
|
constructor();
|
|
@@ -2,12 +2,16 @@ import { EventEmitter } from '../../../stencil-public-runtime';
|
|
|
2
2
|
export interface FontOption {
|
|
3
3
|
value: string;
|
|
4
4
|
label: string;
|
|
5
|
+
cssFontFamily?: string;
|
|
5
6
|
}
|
|
6
7
|
export declare class KritzelFontFamily {
|
|
7
8
|
fontOptions: FontOption[];
|
|
8
9
|
selectedFontFamily: string;
|
|
9
10
|
fontFamilyChange: EventEmitter<string>;
|
|
11
|
+
handleFontOptionsChange(): void;
|
|
10
12
|
componentWillLoad(): void;
|
|
11
13
|
private handleDropdownValueChange;
|
|
14
|
+
private ensureValidSelectedFont;
|
|
15
|
+
private resolveFontOptions;
|
|
12
16
|
render(): any;
|
|
13
17
|
}
|
|
@@ -18,6 +18,7 @@ import { KritzelLocale, KritzelTermKey, KritzelTermVars, LocaleCode } from "./in
|
|
|
18
18
|
import { IKritzelDialogCloseEvent, KritzelDialogCloseReason } from "./interfaces/dialog.interface";
|
|
19
19
|
import { DropdownOption } from "./components/shared/kritzel-dropdown/kritzel-dropdown";
|
|
20
20
|
import { KritzelDebugInfo } from "./interfaces/debug-info.interface";
|
|
21
|
+
import { KritzelFontMap } from "./interfaces/font.interface";
|
|
21
22
|
import { KritzelSyncConfig } from "./interfaces/sync-config.interface";
|
|
22
23
|
import { KritzelAssetStorageConfig } from "./interfaces/asset-storage-config.interface";
|
|
23
24
|
import { KritzelLoginConfig, KritzelLoginProvider } from "./interfaces/login-config.interface";
|
|
@@ -59,6 +60,7 @@ export { KritzelLocale, KritzelTermKey, KritzelTermVars, LocaleCode } from "./in
|
|
|
59
60
|
export { IKritzelDialogCloseEvent, KritzelDialogCloseReason } from "./interfaces/dialog.interface";
|
|
60
61
|
export { DropdownOption } from "./components/shared/kritzel-dropdown/kritzel-dropdown";
|
|
61
62
|
export { KritzelDebugInfo } from "./interfaces/debug-info.interface";
|
|
63
|
+
export { KritzelFontMap } from "./interfaces/font.interface";
|
|
62
64
|
export { KritzelSyncConfig } from "./interfaces/sync-config.interface";
|
|
63
65
|
export { KritzelAssetStorageConfig } from "./interfaces/asset-storage-config.interface";
|
|
64
66
|
export { KritzelLoginConfig, KritzelLoginProvider } from "./interfaces/login-config.interface";
|
|
@@ -377,6 +379,11 @@ export namespace Components {
|
|
|
377
379
|
* The element to use as the target for the cursor. Defaults to the editor container if not set.
|
|
378
380
|
*/
|
|
379
381
|
"cursorTarget"?: HTMLElement;
|
|
382
|
+
/**
|
|
383
|
+
* Registers fonts for runtime usage (for example custom object rendering). Text-tool config tooltip options are controlled via controls[].config.availableFonts.
|
|
384
|
+
* @default {}
|
|
385
|
+
*/
|
|
386
|
+
"customFonts": KritzelFontMap;
|
|
380
387
|
/**
|
|
381
388
|
* @default {}
|
|
382
389
|
*/
|
|
@@ -500,6 +507,12 @@ export namespace Components {
|
|
|
500
507
|
"panToObject": (object: KritzelBaseObject) => Promise<void>;
|
|
501
508
|
"paste": (x: number, y: number) => Promise<void>;
|
|
502
509
|
"redo": () => Promise<void>;
|
|
510
|
+
/**
|
|
511
|
+
* Registers custom fonts for the editor runtime.
|
|
512
|
+
* @param fonts - Mapping from font keys to family names or font definitions.
|
|
513
|
+
* @remarks This no longer controls the text-tool config tooltip font options. Configure tooltip fonts via controls[].config.availableFonts.
|
|
514
|
+
*/
|
|
515
|
+
"registerFonts": (fonts: KritzelFontMap) => Promise<void>;
|
|
503
516
|
/**
|
|
504
517
|
* Registers additional locale definitions (with optional partial term overrides).
|
|
505
518
|
* @param locales - The locale definitions to register.
|
|
@@ -1136,7 +1149,7 @@ export namespace Components {
|
|
|
1136
1149
|
}
|
|
1137
1150
|
interface KritzelFontFamily {
|
|
1138
1151
|
/**
|
|
1139
|
-
* @default [
|
|
1152
|
+
* @default []
|
|
1140
1153
|
*/
|
|
1141
1154
|
"fontOptions": FontOption[];
|
|
1142
1155
|
"selectedFontFamily": string;
|
|
@@ -2892,6 +2905,11 @@ declare namespace LocalJSX {
|
|
|
2892
2905
|
* The element to use as the target for the cursor. Defaults to the editor container if not set.
|
|
2893
2906
|
*/
|
|
2894
2907
|
"cursorTarget"?: HTMLElement;
|
|
2908
|
+
/**
|
|
2909
|
+
* Registers fonts for runtime usage (for example custom object rendering). Text-tool config tooltip options are controlled via controls[].config.availableFonts.
|
|
2910
|
+
* @default {}
|
|
2911
|
+
*/
|
|
2912
|
+
"customFonts"?: KritzelFontMap;
|
|
2895
2913
|
/**
|
|
2896
2914
|
* @default {}
|
|
2897
2915
|
*/
|
|
@@ -3247,7 +3265,7 @@ declare namespace LocalJSX {
|
|
|
3247
3265
|
}
|
|
3248
3266
|
interface KritzelFontFamily {
|
|
3249
3267
|
/**
|
|
3250
|
-
* @default [
|
|
3268
|
+
* @default []
|
|
3251
3269
|
*/
|
|
3252
3270
|
"fontOptions"?: FontOption[];
|
|
3253
3271
|
"onFontFamilyChange"?: (event: KritzelFontFamilyCustomEvent<string>) => void;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { KritzelFontRegistration } from '../interfaces/font.interface';
|
|
2
|
+
export declare const DEFAULT_TEXT_TOOL_AVAILABLE_FONTS: KritzelFontRegistration[];
|
|
3
|
+
export declare const resolveTextToolAvailableFonts: (availableFonts?: KritzelFontRegistration[]) => KritzelFontRegistration[];
|
package/dist/types/index.d.ts
CHANGED
|
@@ -42,6 +42,7 @@ export * from './classes/managers/theme.manager';
|
|
|
42
42
|
export * from './classes/managers/localization.manager';
|
|
43
43
|
export * from './classes/managers/license.manager';
|
|
44
44
|
export * from './classes/registries/custom-element-renderer.registry';
|
|
45
|
+
export * from './classes/registries/font-registry.class';
|
|
45
46
|
export * from './interfaces/toolbar-control.interface';
|
|
46
47
|
export * from './interfaces/menu-item.interface';
|
|
47
48
|
export * from './interfaces/object-change-event.interface';
|
|
@@ -65,6 +66,7 @@ export * from './interfaces/engine-state.interface';
|
|
|
65
66
|
export * from './interfaces/debug-info.interface';
|
|
66
67
|
export * from './interfaces/bounding-box.interface';
|
|
67
68
|
export * from './interfaces/polygon.interface';
|
|
69
|
+
export * from './interfaces/font.interface';
|
|
68
70
|
export * from './configs/default-brush-tool.config';
|
|
69
71
|
export * from './configs/default-text-tool.config';
|
|
70
72
|
export * from './configs/default-line-tool.config';
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export interface KritzelFontDefinition {
|
|
2
|
+
family: string;
|
|
3
|
+
label?: string;
|
|
4
|
+
cssFontFamily?: string;
|
|
5
|
+
source?: string;
|
|
6
|
+
}
|
|
7
|
+
export type KritzelFontRegistration = string | KritzelFontDefinition;
|
|
8
|
+
export interface KritzelRegisteredFont {
|
|
9
|
+
key: string;
|
|
10
|
+
family: string;
|
|
11
|
+
label: string;
|
|
12
|
+
cssFontFamily: string;
|
|
13
|
+
source?: string;
|
|
14
|
+
}
|
|
15
|
+
export type KritzelFontMap = Record<string, KritzelFontRegistration>;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { KritzelBaseTool } from '../classes/tools/base-tool.class';
|
|
2
2
|
import { ShapeType } from '../enums/shape-type.enum';
|
|
3
3
|
import { ThemeAwareColor } from '../constants/color-palette.constants';
|
|
4
|
+
import { KritzelFontRegistration } from './font.interface';
|
|
4
5
|
export interface KritzelToolbarSubOption {
|
|
5
6
|
id: string;
|
|
6
7
|
icon: string;
|
|
@@ -22,6 +23,7 @@ export interface KritzelTextToolConfig {
|
|
|
22
23
|
size: number;
|
|
23
24
|
opacity?: number;
|
|
24
25
|
fontFamily: string;
|
|
26
|
+
availableFonts?: KritzelFontRegistration[];
|
|
25
27
|
palette: ThemeAwareColor[];
|
|
26
28
|
sizes?: number[];
|
|
27
29
|
}
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{p as t,H as e,h as s,d as i,t as o}from"./p-B43upypT.js";import{K as r}from"./p-D8W6LE-c.js";const n=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}core;cursorTrailPoints=[];isLeftButtonDown=!1;handleMouseDown(t){"mouse"===t.pointerType&&t.button===r.Left&&(this.isLeftButtonDown=!0,this.cursorTrailPoints=[]),"touch"===t.pointerType&&1===this.core.store.state.pointers.size&&(this.isLeftButtonDown=!0,this.cursorTrailPoints=[])}handlePointerMove(t){if(!this.isLeftButtonDown)return;const e=[{x:t.clientX,y:t.clientY,timestamp:Date.now()},...this.cursorTrailPoints];this.cursorTrailPoints=e.length>this.MAX_TRAIL_POINTS?e.slice(0,this.MAX_TRAIL_POINTS):e}handlePointerUp(t){"mouse"===t.pointerType&&t.button===r.Left&&(this.isLeftButtonDown=!1,this.cursorTrailPoints=[]),"touch"===t.pointerType&&0===this.core.store.state.pointers.size&&(this.isLeftButtonDown=!1,this.cursorTrailPoints=[])}trailCleanupIntervalId;TRAIL_DURATION_MS=100;MAX_TRAIL_POINTS=50;componentDidLoad(){this.trailCleanupIntervalId=window.setInterval((()=>{const t=Date.now(),e=this.cursorTrailPoints.filter((e=>t-e.timestamp<this.TRAIL_DURATION_MS));e.length!==this.cursorTrailPoints.length&&(this.cursorTrailPoints=e)}),50)}disconnectedCallback(){this.trailCleanupIntervalId&&window.clearInterval(this.trailCleanupIntervalId)}render(){return s(i,{key:"b427550b19a3e172cb25d05e34635121b82a61c5"},this.cursorTrailPoints.length>1&&s("svg",{key:"9685b563497e110f36c0feffbfde04ebeb38024b",class:"cursor-trail-svg",xmlns:"http://www.w3.org/2000/svg",style:{position:"absolute",left:"0",top:"0",width:"100%",height:"100%",pointerEvents:"none",opacity:"var(--kritzel-cursor-trail-opacity, 0.6)",zIndex:"9000"}},this.cursorTrailPoints.slice(1).map(((t,e)=>{const i=this.cursorTrailPoints[e],o=Date.now(),r=Math.max(0,Math.min(1,(o-t.timestamp)/this.TRAIL_DURATION_MS));if(r>=1)return null;const n=Math.max(2,15*(1-r));return s("line",{key:`trail-segment-${t.timestamp}`,x1:i.x.toString(),y1:i.y.toString(),x2:t.x.toString(),y2:t.y.toString(),stroke:"var(--kritzel-cursor-trail-color, rgb(228, 228, 228))","stroke-width":n.toString(),"stroke-linecap":"round"})}))))}static get style(){return":host{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:9000}"}},[513,"kritzel-cursor-trail",{core:[16],cursorTrailPoints:[32],isLeftButtonDown:[32]},[[9,"pointerdown","handleMouseDown"],[9,"pointermove","handlePointerMove"],[9,"pointerup","handlePointerUp"]]]);function h(){"undefined"!=typeof customElements&&["kritzel-cursor-trail"].forEach((t=>{"kritzel-cursor-trail"===t&&(customElements.get(o(t))||customElements.define(o(t),n))}))}export{n as K,h as d}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{p as t,H as o,c as e,h as r,d as i,t as l}from"./p-B43upypT.js";import{f as n,e as s}from"./p-D8NvNMcU.js";import{K as a}from"./p-jGOpkGDl.js";import{K as c,d}from"./p-D2q_wTyG.js";import{a as h}from"./p-BmyTdQGy.js";import{d as p}from"./p-CqLgB8JK.js";import{d as k}from"./p-Cymum41a.js";import{d as b}from"./p-Df3BwVGy.js";import{d as u}from"./p-B8Xi4Clg.js";import{d as f}from"./p-JhOYwUOj.js";import{d as g}from"./p-BI2ng9I_.js";import{d as z}from"./p-CdR76C4L.js";import{d as m}from"./p-CXpv9Rxe.js";import{d as v}from"./p-B6t5q-V4.js";import{d as y}from"./p-BFYtCsZu.js";import{d as x}from"./p-D82VaHce.js";import{d as w}from"./p-BTzlrIxe.js";import{d as C}from"./p-CsvMgk_f.js";const T=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.isControlsReady=e(this,"isControlsReady")}get host(){return this}visible=!0;controls=[];activeControl=null;isUtilityPanelVisible=!0;undoState=null;theme="light";terms={};isControlsReady;firstConfig=null;isTouchDevice=a.isTouchDevice();selectedSubOptions=new Map;canScrollLeft=!1;canScrollRight=!1;needsScrolling=!1;displayValues=null;internalControls=[];handleActiveToolChangeBound=this.handleActiveToolChange.bind(this);handleSelectionChangeBound=this.handleSelectionChange.bind(this);handleKeyDown(t){"Escape"===t.key&&(t.preventDefault(),this.closeTooltip(),this.kritzelEngine?.enable())}async handleActiveToolChange(t){this.activeControl=this.internalControls.find((o=>o.tool===t.detail))||null,this.activeControl?.tool&&this.updateDisplayValues(this.activeControl.tool),this.closeTooltip()}handleSelectionChange(){this.activeControl?.tool instanceof n&&this.updateDisplayValues(this.activeControl.tool)}async onControlsChange(){this.kritzelEngine&&await this.initializeTools()}onThemeChange(){this.activeControl?.tool&&this.updateDisplayValues(this.activeControl.tool)}async closeTooltip(){document.dispatchEvent(new CustomEvent("kritzelTooltipCloseAll"))}kritzelEngine=null;toolsScrollRef=null;configTriggerRef=null;get activeToolAsTextTool(){return this.activeControl?.tool}get activeToolAsBrushTool(){return this.activeControl?.tool}get activeToolAsLineTool(){return this.activeControl?.tool}get activeToolAsShapeTool(){return this.activeControl?.tool}handleDisplayValuesChange=t=>{const o=t.detail;this.displayValues&&this.displayValues.color===o.color&&this.displayValues.size===o.size&&this.displayValues.fontFamily===o.fontFamily||(this.displayValues=o)};updateDisplayValues(t){const o=c.getToolConfig(t);if(!o)return void(this.displayValues=null);const e=t[o.sizeProperty],r={color:h.applyOpacity(t[o.colorProperty],t[o.opacityProperty]??1,this.theme),size:e};t instanceof s&&(r.fontFamily=t.fontFamily),this.displayValues&&this.displayValues.color===r.color&&this.displayValues.size===r.size&&this.displayValues.fontFamily===r.fontFamily||(this.displayValues=r)}async componentWillLoad(){await this.initializeEngine(),await this.initializeTools(),this.isControlsReady.emit()}componentDidLoad(){this.updateScrollIndicators()}componentDidRender(){this.updateScrollIndicators()}disconnectedCallback(){this.kritzelEngine&&(this.kritzelEngine.removeEventListener("activeToolChange",this.handleActiveToolChangeBound),this.kritzelEngine.removeEventListener("objectsSelectionChange",this.handleSelectionChangeBound))}updateScrollIndicators(){if(!this.toolsScrollRef)return;const{scrollLeft:t,scrollWidth:o,clientWidth:e}=this.toolsScrollRef,r=t>2,i=t+e<o-2,l=o>e;this.canScrollLeft!==r&&(this.canScrollLeft=r),this.canScrollRight!==i&&(this.canScrollRight=i),this.needsScrolling!==l&&(this.needsScrolling=l)}handleToolsScroll=()=>{this.updateScrollIndicators()};async initializeEngine(){if(await customElements.whenDefined("kritzel-engine"),this.kritzelEngine=this.host.parentElement.querySelector("kritzel-engine"),!this.kritzelEngine)throw new Error("kritzel-engine not found in parent element.");this.kritzelEngine.addEventListener("activeToolChange",this.handleActiveToolChangeBound),this.kritzelEngine.addEventListener("objectsSelectionChange",this.handleSelectionChangeBound)}async initializeTools(){let t=!1;const o=this.controls.map((t=>({...t})));for(const e of o){if("tool"===e.type&&e.tool){let t=e.tool;"function"!=typeof t&&(t=t.constructor);const o=await this.kritzelEngine.registerTool(e.name,t,e.config);o&&(e.tool=o)}"tool"===e.type&&e.isDefault&&e.tool&&(await this.kritzelEngine.changeActiveTool(e.tool),this.activeControl=e,this.updateDisplayValues(e.tool),t=!0),"config"===e.type&&(null===this.firstConfig?this.firstConfig=e:console.warn("Only one config control is allowed. The first one will be used."))}if(this.internalControls=o,!t){const t=this.internalControls.find((t=>"tool"===t.type&&t.tool));t&&(await this.kritzelEngine.changeActiveTool(t.tool),this.activeControl=t,this.updateDisplayValues(t.tool))}}async handleControlClick(t){this.activeControl=t,"tool"===this.activeControl.type&&(this.updateDisplayValues(this.activeControl.tool),await this.kritzelEngine.changeActiveTool(this.activeControl.tool))}async handleToolChange(t){this.activeControl={...this.activeControl,tool:t.detail},await this.kritzelEngine.changeActiveTool(this.activeControl.tool)}getSelectedSubOption(t){if(t.subOptions?.length)return this.selectedSubOptions.get(t.name)||t.subOptions[0]}async selectSubOption(t,o){const e=new Map(this.selectedSubOptions);e.set(t.name,o),this.selectedSubOptions=e,t.tool&&"function"!=typeof t.tool&&(t.tool[o.toolProperty]=o.value),this.closeTooltip(),await this.handleControlClick(t)}render(){const t=null!==(this.activeControl?.tool?c.getToolConfig(this.activeControl.tool):null),o=this.internalControls.filter((t=>"tool"===t.type||"separator"===t.type)),e=this.internalControls.find((t=>"config"===t.type&&t.name===this.firstConfig?.name));return r(i,{key:"5a23a0a1baa407097b18b9bc43f41186c0c333b2",style:{display:this.visible?"":"none"},class:{mobile:this.isTouchDevice}},this.isUtilityPanelVisible&&r("kritzel-utility-panel",{key:"6d3878904bd13266be79cef0e0d1ee55d760b3da",style:{position:"absolute",bottom:"56px",left:"12px"},undoState:this.undoState,terms:this.terms,onUndo:()=>this.kritzelEngine?.undo(),onRedo:()=>this.kritzelEngine?.redo(),onDelete:()=>this.kritzelEngine?.delete()}),r("div",{key:"5e066964eba04ad9b0d1abf36f61b93464254f48",class:"kritzel-controls"},r("div",{key:"76e49fd459e0a312837ec0b5e552355395b8814e",class:{"scroll-indicator-left":!0,visible:this.canScrollLeft}}),r("div",{key:"d4cffe56418dae5c569a47fe2ffc3f810f221455",class:"kritzel-tools-scroll",ref:t=>this.toolsScrollRef=t,onScroll:this.handleToolsScroll},o.map((t=>{if(t.subOptions?.length){const o=this.getSelectedSubOption(t),e=this.activeControl?.name===t.name;return r("div",{class:{"kritzel-control-split":!0,selected:e},key:t.name,"data-testid":`tool-${t.name}`,ref:o=>{o&&(t._anchorRef=o)}},r("button",{class:"kritzel-control-main",onClick:()=>this.handleControlClick(t),"aria-label":o?.label,"data-testid":`tool-${t.name}-main`},r("kritzel-icon",{name:o?.icon||t.icon})),r("button",{class:{"kritzel-control-dropdown":!0,visible:e},ref:o=>{o&&(t._triggerRef=o)},"aria-label":`Select ${t.name} options`,"data-testid":`tool-${t.name}-dropdown`,tabIndex:e?0:-1},r("kritzel-icon",{name:"chevron-down",size:12})),r("kritzel-tooltip",{anchorElement:t._anchorRef,triggerElement:t._triggerRef},r("div",{class:"kritzel-submenu-content"},t.subOptions.map((e=>r("button",{class:{"kritzel-submenu-item":!0,active:e.id===o?.id},key:e.id,"data-testid":`suboption-${e.id}`,onClick:()=>this.selectSubOption(t,e)},r("kritzel-icon",{name:e.icon,size:20}),r("span",null,e.label)))))))}return"separator"===t.type?r("div",{class:"kritzel-control-separator",key:t.name}):r("button",{class:{"kritzel-control":!0,selected:this.activeControl?.name===t?.name},key:t.name,"data-testid":`tool-${t.name}`,onClick:()=>this.handleControlClick?.(t),"aria-label":t.name.charAt(0).toUpperCase()+t.name.slice(1)},r("kritzel-icon",{name:t.icon}))}))),r("div",{key:"49806e8e06b8756a097eeec53203a55586214a4a",class:{"scroll-indicator-right":!0,visible:this.canScrollRight&&!(e&&this.activeControl&&t)}}),e&&this.activeControl&&r("div",{class:{"kritzel-config-container":!0,visible:t},key:e.name},r("div",{key:"da0ec9cf776dee0872bbb7f0369a6a5a56ebb955",class:{"config-gradient-left":!0,visible:this.needsScrolling}}),r("kritzel-tooltip",{key:"c848a63392d4ed9a30f467512421fbea3096d876",anchorElement:this.host.shadowRoot?.querySelector(".kritzel-config-container"),triggerElement:this.configTriggerRef},r("kritzel-tool-config",{key:"c7ed50fbdfbdab1847fb8c5c6e73d0e743b45706",tool:this.activeControl.tool,theme:this.theme,engine:this.kritzelEngine,terms:this.terms,onToolChange:t=>this.handleToolChange?.(t),onDisplayValuesChange:this.handleDisplayValuesChange,style:{width:"100%",height:"100%"}})),r("div",{key:"de6c9801d3e9e89674b60b1c4e270b8520014aae",tabIndex:t?0:-1,class:"kritzel-config","data-testid":"tool-config",ref:t=>{t&&(this.configTriggerRef=t)},onKeyDown:t=>{"Enter"===t.key&&t.target.click()},style:{cursor:"pointer"}},this.displayValues&&r("div",{key:"140bbf567b0bbd2a2fe878536e93d8646a58b209",class:"color-container"},r("kritzel-color",{key:"eeb1d94fa41bbc177d39b4158ae3c4c1d692c0ec",value:this.displayValues.color,theme:this.theme,size:18,style:{borderRadius:"50%",border:"none"}}))))))}static get assetsDirs(){return["../assets"]}static get watchers(){return{controls:[{onControlsChange:0}],theme:[{onThemeChange:0}]}}static get style(){return":host{display:flex;flex-direction:column;user-select:none;max-width:100%;z-index:1}:host(.mobile){--kritzel-controls-control-hover-background-color:transparent;--kritzel-controls-control-active-background-color:transparent}.kritzel-controls{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--kritzel-controls-gap, 8px);height:100%;padding:var(--kritzel-controls-padding, 8px);background-color:var(--kritzel-controls-background-color, #ffffff);border-radius:var(--kritzel-controls-border-radius, 16px);box-shadow:var(--kritzel-controls-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-controls-border, 1px solid #ebebeb);z-index:1;position:relative;max-width:100%;overflow:hidden}.kritzel-tools-scroll{display:flex;flex-direction:row;align-items:center;gap:var(--kritzel-controls-gap, 8px);overflow-x:auto;overflow-y:hidden;flex:1 1 auto;min-width:0;padding:4px;margin:-4px;scrollbar-width:none;-ms-overflow-style:none}.kritzel-tools-scroll::-webkit-scrollbar{display:none}.scroll-indicator-left,.scroll-indicator-right{position:absolute;top:0;bottom:0;width:32px;pointer-events:none;opacity:0;transition:opacity 0.2s ease-out;z-index:1}.scroll-indicator-left{left:0;background:linear-gradient(to right, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:var(--kritzel-controls-border-radius, 16px) 0 0 var(--kritzel-controls-border-radius, 16px)}.scroll-indicator-right{right:0;background:linear-gradient(to left, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:0 var(--kritzel-controls-border-radius, 16px) var(--kritzel-controls-border-radius, 16px) 0}.scroll-indicator-left.visible,.scroll-indicator-right.visible{opacity:1}.kritzel-control{display:flex;justify-content:center;align-items:center;color:var(--kritzel-controls-control-color, #000000);border-radius:var(--kritzel-controls-control-border-radius, 12px);padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;font-weight:bold}.kritzel-control:focus,.kritzel-control:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control.selected,.kritzel-control.selected:hover,.kritzel-control.selected:active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control.selected:focus{background-color:var(--kritzel-controls-control-selected-background-color, #007bffe3) !important}.kritzel-control-separator{width:1px;height:24px;background-color:var(--kritzel-controls-separator-color, #ebebeb);margin:0 4px}.kritzel-control-split{position:relative;display:flex;align-items:center;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:var(--kritzel-controls-control-color, #000000)}.kritzel-control-split .kritzel-control-main{display:flex;justify-content:center;align-items:center;padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:inherit}.kritzel-control-split.selected .kritzel-control-main{border-radius:var(--kritzel-controls-control-border-radius, 12px) 0 0 var(--kritzel-controls-control-border-radius, 12px)}.kritzel-control-split .kritzel-control-dropdown{display:flex;justify-content:center;align-items:center;align-self:stretch;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:0 var(--kritzel-controls-control-border-radius, 12px) var(--kritzel-controls-control-border-radius, 12px) 0;color:inherit;width:0;padding:0;opacity:0;overflow:hidden;pointer-events:none;transition:width 0.15s ease-out, padding 0.15s ease-out, opacity 0.15s ease-out}.kritzel-control-split .kritzel-control-dropdown.visible{width:auto;padding:0 6px;opacity:1;pointer-events:auto}.kritzel-control-split .kritzel-control-main:focus,.kritzel-control-split .kritzel-control-main:hover,.kritzel-control-split .kritzel-control-dropdown:focus,.kritzel-control-split .kritzel-control-dropdown:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control-split .kritzel-control-main:active,.kritzel-control-split .kritzel-control-dropdown:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control-split.selected{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control-split.selected .kritzel-control-main:hover,.kritzel-control-split.selected .kritzel-control-dropdown:hover{background-color:rgba(255, 255, 255, 0.15)}.kritzel-submenu-content{display:flex;flex-direction:column;gap:var(--kritzel-submenu-gap, 4px);min-width:140px}.kritzel-submenu-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:8px;color:var(--kritzel-controls-control-color, #000000);font-size:14px;text-align:left;white-space:nowrap;-webkit-tap-highlight-color:transparent}.kritzel-submenu-item:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-submenu-item.active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF);color:var(--kritzel-controls-control-selected-color, #ffffff)}.kritzel-submenu-item.active:hover{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF)}.kritzel-config-container{position:relative;display:flex;justify-content:center;align-items:center;height:40px;box-sizing:border-box;-webkit-tap-highlight-color:transparent;flex-shrink:0;width:0;opacity:0;overflow:hidden;pointer-events:none;margin-left:calc(-1 * var(--kritzel-controls-gap, 8px));transition:width 0.2s ease-out, opacity 0.2s ease-out, margin-left 0.2s ease-out}.kritzel-config-container.visible{width:40px;opacity:1;pointer-events:auto;margin-left:0;overflow:visible}.config-gradient-left{position:absolute;top:0;bottom:0;left:-32px;width:32px;background:linear-gradient(to right, transparent, var(--kritzel-controls-background-color, #ffffff));pointer-events:none;z-index:1;opacity:0;transition:opacity 0.2s ease-out}.config-gradient-left.visible{opacity:1}.kritzel-config{display:flex;justify-content:center;align-items:center;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:50%}.color-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.font-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.no-config{height:24px;width:24px;border-radius:50%;border:1px dashed gray}kritzel-tooltip{z-index:10001}"}},[513,"kritzel-controls",{visible:[4],controls:[16],activeControl:[1040],isUtilityPanelVisible:[4,"is-utility-panel-visible"],undoState:[16],theme:[1],terms:[16],firstConfig:[32],isTouchDevice:[32],selectedSubOptions:[32],canScrollLeft:[32],canScrollRight:[32],needsScrolling:[32],displayValues:[32],internalControls:[32],closeTooltip:[64]},[[8,"keydown","handleKeyDown"]],{controls:[{onControlsChange:0}],theme:[{onThemeChange:0}]}]);function j(){"undefined"!=typeof customElements&&["kritzel-controls","kritzel-color","kritzel-color-palette","kritzel-dropdown","kritzel-font","kritzel-font-family","kritzel-font-size","kritzel-icon","kritzel-line-endings","kritzel-opacity-slider","kritzel-shape-fill","kritzel-stroke-size","kritzel-tool-config","kritzel-tooltip","kritzel-utility-panel"].forEach((t=>{switch(t){case"kritzel-controls":customElements.get(l(t))||customElements.define(l(t),T);break;case"kritzel-color":customElements.get(l(t))||p();break;case"kritzel-color-palette":customElements.get(l(t))||k();break;case"kritzel-dropdown":customElements.get(l(t))||b();break;case"kritzel-font":customElements.get(l(t))||u();break;case"kritzel-font-family":customElements.get(l(t))||f();break;case"kritzel-font-size":customElements.get(l(t))||g();break;case"kritzel-icon":customElements.get(l(t))||z();break;case"kritzel-line-endings":customElements.get(l(t))||m();break;case"kritzel-opacity-slider":customElements.get(l(t))||v();break;case"kritzel-shape-fill":customElements.get(l(t))||y();break;case"kritzel-stroke-size":customElements.get(l(t))||x();break;case"kritzel-tool-config":customElements.get(l(t))||d();break;case"kritzel-tooltip":customElements.get(l(t))||w();break;case"kritzel-utility-panel":customElements.get(l(t))||C()}}))}export{T as K,j as d}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{p as t,H as e,h as s,d as r,t as o}from"./p-B43upypT.js";import{a as n,b as i}from"./p-UEf2EN23.js";const a=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}core;showEdgeIndicators=!0;edgeIndicatorPadding=8;remoteCursors=new Map;objectVersion=0;cleanupIntervalId;objectChangeRafId=null;componentDidLoad(){this.core.store.objects?.onAwarenessChange((t=>{this.handleAwarenessChange(t)})),this.core.store.objects?.onObjectsChange((()=>{this.handleRemoteObjectChange()})),this.cleanupIntervalId=setInterval((()=>{this.cleanupStaleCursors()}),3e3)}disconnectedCallback(){this.cleanupIntervalId&&clearInterval(this.cleanupIntervalId),null!==this.objectChangeRafId&&cancelAnimationFrame(this.objectChangeRafId)}handleAwarenessChange(t){const e=this.core.store.objects?.localClientId,s=Date.now(),r=new Map(this.remoteCursors),o=new Set;t.forEach(((t,n)=>{if(n===e)return;if(!t.user)return;o.add(n);const i=t.user,a=t.cursor,l=t.activeObjectId||null,c=t.selectionBox||null,d=r.get(n);r.set(n,{clientId:n,user:i,cursor:a,activeObjectId:l,selectionBox:c,lastUpdated:s,lastCursorMove:!d||!d.cursor!=!a||a&&d.cursor&&(a.x!==d.cursor.x||a.y!==d.cursor.y)?s:d?.lastCursorMove??s})}));for(const t of r.keys())o.has(t)||r.delete(t);this.remoteCursors=r}cleanupStaleCursors(){const t=Date.now();let e=!1;const s=new Map(this.remoteCursors);for(const[r,o]of s)t-o.lastUpdated>3e4?(s.delete(r),e=!0):!e&&t-o.lastCursorMove>1e4&&(e=!0);e&&(this.remoteCursors=s)}isStale(t){return Date.now()-t.lastCursorMove>1e4}hasActiveDrawingCursors(){for(const t of this.remoteCursors.values())if(t.activeObjectId)return!0;return!1}handleRemoteObjectChange(){this.hasActiveDrawingCursors()&&null===this.objectChangeRafId&&(this.objectChangeRafId=requestAnimationFrame((()=>{this.objectChangeRafId=null,this.objectVersion++})))}getActiveObjectTip(t){const e=this.core.store.objects?.findById(t);if(!e)return null;if(e instanceof n&&!e.isCompleted){const t=e.points[e.points.length-1];return t?{x:(t[0]-e.x)/e.scale+e.translateX,y:(t[1]-e.y)/e.scale+e.translateY}:null}return e instanceof i&&!e.isCompleted?{x:(e.endX-e.x)/e.scale+e.translateX,y:(e.endY-e.y)/e.scale+e.translateY}:null}worldToScreen(t,e){const{scale:s,translateX:r,translateY:o}=this.core.store.state;return{x:t*s+r,y:e*s+o}}isInViewport(t,e){const{viewportWidth:s,viewportHeight:r}=this.core.store.state;return t>=0&&t<=s&&e>=0&&e<=r}clampToEdge(t,e){const{viewportWidth:s,viewportHeight:r}=this.core.store.state,o=this.edgeIndicatorPadding,n=Math.max(o,Math.min(s-o,t)),i=Math.max(o,Math.min(r-o,e)),a=n-o,l=s-o-n,c=i-o;let d="top";const h=Math.min(a,l,c,r-o-i);return d=h===a?"left":h===l?"right":h===c?"top":"bottom",{x:n,y:i,angle:Math.atan2(e-i,t-n),edge:d}}getUserDisplayName(t){return t.displayName?t.displayName:t.firstName||t.lastName?[t.firstName,t.lastName].filter(Boolean).join(" "):"Unknown"}getInitials(t){const e=t.trim().split(/\s+/);return 0===e.length||1===e.length&&e[0].length<=1?t:1===e.length?e[0][0].toUpperCase():(e[0][0]+e[e.length-1][0]).toUpperCase()}render(){const t=Array.from(this.remoteCursors.values());return s(r,{key:"5c695e3c5a012767b31bb1b756ef03e2a174f46e"},t.map((t=>{if(!t.cursor)return null;let e,s=!1;if(t.activeObjectId){const r=this.getActiveObjectTip(t.activeObjectId);r?(s=!0,e=this.worldToScreen(r.x,r.y)):e=this.worldToScreen(t.cursor.x,t.cursor.y)}else e=this.worldToScreen(t.cursor.x,t.cursor.y);const r=this.isInViewport(e.x,e.y),o=this.isStale(t),n=t.user.color||"#6B7280";return r?this.renderCursor(t,e.x,e.y,n,o,s):this.showEdgeIndicators?this.renderEdgeIndicator(t,e.x,e.y,n,o,s):null})),t.map((t=>{if(!t.selectionBox)return null;const e=t.user.color||"#6B7280",r=t.selectionBox,o=this.worldToScreen(r.x,r.y),{scale:n}=this.core.store.state;return s("div",{key:`selection-box-${t.clientId}`,class:"remote-selection-box",style:{transform:`translate(${o.x}px, ${o.y}px)`,width:r.width*n+"px",height:r.height*n+"px",backgroundColor:`color-mix(in srgb, ${e} 20%, transparent)`,borderColor:`color-mix(in srgb, ${e} 50%, transparent)`}})})))}renderCursor(t,e,r,o,n,i){return s("div",{key:`cursor-${t.clientId}`,class:{"awareness-cursor":!0,stale:n,"tracking-object":i},style:{transform:`translate(${e}px, ${r}px)`}},s("svg",{class:"cursor-arrow",width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},s("path",{d:"M5 3L19 12L12 13L9 20L5 3Z",fill:o,stroke:"#ffffff","stroke-width":"1.5","stroke-linejoin":"round"})),s("span",{class:"cursor-label",style:{backgroundColor:o}},this.getUserDisplayName(t.user)))}renderEdgeIndicator(t,e,r,o,n,i){const a=this.clampToEdge(e,r),l=180*a.angle/Math.PI+90;let c=0,d=0;"left"===a.edge?c=20:"right"===a.edge?c=-20:"top"===a.edge?d=20:"bottom"===a.edge&&(d=-20);const h=this.getUserDisplayName(t.user);return s("div",{key:`edge-${t.clientId}`,class:{"edge-indicator":!0,stale:n,"tracking-object":i},style:{transform:`translate(${a.x}px, ${a.y}px)`}},s("svg",{class:{"edge-arrow":!0,stale:n},width:"16",height:"16",viewBox:"0 0 16 16",style:{transform:`rotate(${l}deg)`}},s("path",{d:"M8 1L14 13H2L8 1Z",fill:o,stroke:"#ffffff","stroke-width":"1.5","stroke-linejoin":"round"})),s("span",{class:"edge-label",style:{backgroundColor:o,transform:`translate(${c}px, ${d}px)`}},this.getInitials(h)))}static get style(){return":host{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:1}.awareness-cursor{position:absolute;top:0;left:0;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out, opacity 300ms ease;will-change:transform}.awareness-cursor.stale{opacity:0}.awareness-cursor.tracking-object{transition-duration:0ms}.cursor-arrow{filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3))}.cursor-label{position:absolute;left:16px;top:16px;white-space:nowrap;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;font-size:var(--kritzel-awareness-cursor-label-font-size, 12px);color:var(--kritzel-awareness-cursor-label-text-color, #ffffff);padding:2px 8px;border-radius:4px;line-height:1.4;font-weight:500;pointer-events:none;user-select:none}.edge-indicator{position:absolute;top:-12px;left:-12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out, opacity 300ms ease;will-change:transform;pointer-events:auto;user-select:none;cursor:pointer}.edge-indicator.stale{opacity:0}.edge-indicator.tracking-object{transition-duration:0ms}.edge-arrow{position:absolute;filter:drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));transition:opacity 300ms ease}.edge-arrow.stale{opacity:0}.edge-label{position:absolute;white-space:nowrap;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;font-size:var(--kritzel-awareness-cursor-label-font-size, 12px);color:var(--kritzel-awareness-cursor-label-text-color, #ffffff);padding:2px 8px;border-radius:4px;line-height:1.4;font-weight:500;pointer-events:none;opacity:0;transform-origin:center;transition:opacity 150ms ease}.edge-indicator:hover .edge-label{opacity:1}.remote-selection-box{position:absolute;top:0;left:0;border-width:2px;border-style:solid;pointer-events:none;will-change:transform, width, height;transition:transform var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out, width var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out, height var(--kritzel-awareness-cursor-transition-duration, 100ms) ease-out}"}},[513,"kritzel-awareness-cursors",{core:[16],showEdgeIndicators:[4,"show-edge-indicators"],edgeIndicatorPadding:[2,"edge-indicator-padding"],remoteCursors:[32],objectVersion:[32]}]);function l(){"undefined"!=typeof customElements&&["kritzel-awareness-cursors"].forEach((t=>{"kritzel-awareness-cursors"===t&&(customElements.get(o(t))||customElements.define(o(t),a))}))}export{a as K,l as d}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{p as e,H as t,c as s,h as i,d as o,t as r}from"./p-B43upypT.js";import{f as n,e as a}from"./p-D8NvNMcU.js";import{a as l}from"./p-BmyTdQGy.js";import{d as h}from"./p-CqLgB8JK.js";import{d as p}from"./p-Cymum41a.js";import{d as c}from"./p-Df3BwVGy.js";import{d}from"./p-B8Xi4Clg.js";import{d as m}from"./p-JhOYwUOj.js";import{d as f}from"./p-BI2ng9I_.js";import{d as g}from"./p-CdR76C4L.js";import{d as u}from"./p-CXpv9Rxe.js";import{d as y}from"./p-B6t5q-V4.js";import{d as z}from"./p-BFYtCsZu.js";import{d as k}from"./p-D82VaHce.js";class C{static getToolConfig(e){switch(e?.toolType){case"selection":return"getToolConfig"in e&&"function"==typeof e.getToolConfig?e.getToolConfig():null;case"brush":return{type:"brush",colorProperty:"color",sizeProperty:"size",opacityProperty:"opacity",paletteSource:"palette",sizesSource:"sizes",controls:[{type:"stroke-size",propertyName:"size"}]};case"line":return{type:"line",colorProperty:"color",sizeProperty:"size",opacityProperty:"opacity",paletteSource:"palette",sizesSource:"sizes",controls:[{type:"stroke-size",propertyName:"size"},{type:"line-endings",propertyName:"arrows",additionalProps:{}}]};case"shape":return{type:"shape",colorProperty:"strokeColor",sizeProperty:"strokeWidth",opacityProperty:"opacity",paletteSource:"palette",sizesSource:"sizes",controls:[{type:"stroke-size",propertyName:"strokeWidth"},{type:"shape-fill",propertyName:"fillColor",additionalProps:{}}]};case"text":return{type:"text",colorProperty:"fontColor",sizeProperty:"fontSize",opacityProperty:"opacity",paletteSource:"palette",sizesSource:"sizes",controls:[{type:"font-size",propertyName:"fontSize",additionalProps:{}},{type:"font-family",propertyName:"fontFamily"}]};default:return null}}}const x=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.toolChange=s(this,"toolChange"),this.displayValuesChange=s(this,"displayValuesChange")}tool;handleToolChange(e,t){const s=C.getToolConfig(e);if(t&&e&&"shape"===s?.type){const i=C.getToolConfig(t);"shape"===i?.type&&[s.colorProperty,s.sizeProperty,s.opacityProperty,"fillColor"].forEach((s=>{s&&void 0!==t[s]&&(e[s]=t[s])}))}this.config=s,this.config&&(this.updatePalette(),this.updateSizes(),this.currentOpacity=e[this.config.opacityProperty]??1,this.emitDisplayValues())}isExpanded=!1;theme;engine;terms={};handleSelectionChangeBound=this.handleSelectionChange.bind(this);onThemeChange(){this.emitDisplayValues()}handleEngineChange(e,t){t&&t.removeEventListener("objectsSelectionChange",this.handleSelectionChangeBound),e&&e.addEventListener("objectsSelectionChange",this.handleSelectionChangeBound)}toolChange;displayValuesChange;config;palette=[];sizes=[];currentOpacity=1;updateTrigger=0;handleSelectionChange(){this.tool instanceof n&&(this.config=C.getToolConfig(this.tool),this.config&&(this.updatePalette(),this.updateSizes(),this.currentOpacity=this.tool[this.config.opacityProperty]??1,this.emitDisplayValues()))}disconnectedCallback(){this.engine&&this.engine.removeEventListener("objectsSelectionChange",this.handleSelectionChangeBound)}componentWillLoad(){this.config=C.getToolConfig(this.tool),this.config&&(this.updatePalette(),this.updateSizes(),this.currentOpacity=this.tool[this.config.opacityProperty]??1,this.emitDisplayValues()),this.engine&&this.engine.addEventListener("objectsSelectionChange",this.handleSelectionChangeBound)}emitDisplayValues(){if(!this.config)return;const e=this.tool[this.config.sizeProperty],t={color:l.applyOpacity(this.tool[this.config.colorProperty],this.currentOpacity,this.theme),size:e};this.tool instanceof a&&(t.fontFamily=this.tool.fontFamily),this.displayValuesChange.emit(t)}updatePalette(){this.config&&(this.palette="none"===this.config.paletteSource?[]:this.tool.palette||[])}updateSizes(){this.config&&(this.sizes="none"===this.config.sizesSource?[]:this.tool.sizes||[])}handleToggleExpand=()=>{this.isExpanded=!this.isExpanded};handleColorChange=e=>{if(this.tool[this.config.colorProperty]=e.detail,"shape"===this.config.type||"selection"===this.config.type){const t=this.tool;("string"==typeof t.fillColor?"transparent"===t.fillColor:"transparent"===t.fillColor.light&&"transparent"===t.fillColor.dark)||(t.fillColor=e.detail)}this.emitDisplayValues(),this.toolChange.emit(this.tool),this.updateTrigger++};handleSizeChange=e=>{this.tool[this.config.sizeProperty]=e.detail,this.emitDisplayValues(),this.toolChange.emit(this.tool),this.updateTrigger++};handleOpacityChange=e=>{this.tool[this.config.opacityProperty]=e.detail,this.currentOpacity=e.detail,this.emitDisplayValues(),this.toolChange.emit(this.tool)};handlePropertyChange=(e,t)=>{if("shape"!==this.config.type&&"selection"!==this.config.type||"fillColor"!==e)this.tool[e]=t,"fontFamily"===e&&this.emitDisplayValues();else{const e="filled"===t?this.tool[this.config.colorProperty]:{light:"transparent",dark:"transparent"};this.tool.fillColor=e,"filled"===t&&(this.tool[this.config.colorProperty]=e)}this.toolChange.emit(this.tool),this.updateTrigger++};getShapeFillValue(){const e=this.tool.fillColor;return("string"==typeof e?"transparent"===e:"transparent"===e.light&&"transparent"===e.dark)?"transparent":"filled"}renderControl(e){const t=this.tool[e.propertyName];switch(e.type){case"stroke-size":return i("kritzel-stroke-size",{key:e.type,sizes:this.sizes,selectedSize:t,onSizeChange:this.handleSizeChange});case"font-size":return i("kritzel-font-size",{key:e.type,sizes:this.sizes,selectedSize:t,fontFamily:this.tool.fontFamily,onSizeChange:this.handleSizeChange});case"line-endings":return i("kritzel-line-endings",{key:e.type,value:t,onValueChange:t=>this.handlePropertyChange(e.propertyName,t.detail)});case"shape-fill":return i("kritzel-shape-fill",{key:e.type,value:this.getShapeFillValue(),onValueChange:t=>this.handlePropertyChange(e.propertyName,t.detail)});case"font-family":return i("kritzel-font-family",{key:e.type,selectedFontFamily:t,onFontFamilyChange:t=>this.handlePropertyChange(e.propertyName,t.detail)});default:return null}}render(){if(!this.config)return null;const e=this.palette.length>6||"text"===this.config.type,t=this.palette.length>0,s=this.config.controls.find((e=>"stroke-size"===e.type||"font-size"===e.type)),r=this.config.controls.filter((e=>"stroke-size"!==e.type&&"font-size"!==e.type));return i(o,null,i("div",{style:{display:"flex",flexDirection:"row",gap:"8px",width:"100%"}},i("div",{style:{display:"flex",flexDirection:"column",gap:"12px",flex:"1"}},t&&i("kritzel-color-palette",{colors:this.palette,selectedColor:this.tool[this.config.colorProperty],isExpanded:this.isExpanded,isOpaque:!0,opacity:this.currentOpacity,theme:this.theme,onColorChange:this.handleColorChange}),s&&this.renderControl(s),i("kritzel-opacity-slider",{value:this.tool[this.config.opacityProperty],previewColor:this.tool[this.config.colorProperty],onValueChange:this.handleOpacityChange}),r.map((e=>[i("div",{class:"divider"}),this.renderControl(e)]))),e&&i("div",{style:{display:"flex",alignItems:"flex-start"}},i("button",{class:"expand-toggle",onClick:this.handleToggleExpand,title:this.isExpanded?this.terms["toolConfig.collapse"]??"Collapse":this.terms["toolConfig.expand"]??"Expand"},i("kritzel-icon",{name:this.isExpanded?"chevron-up":"chevron-down"})))))}static get watchers(){return{tool:[{handleToolChange:0}],theme:[{onThemeChange:0}],engine:[{handleEngineChange:0}]}}static get style(){return".expand-toggle{background:none;border:none;cursor:var(--kritzel-global-pointer-cursor, pointer);padding:0;margin:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;color:var(--kritzel-icon-color, currentColor);transition:transform 0.2s ease}.expand-toggle:hover{opacity:0.7}.expand-toggle:focus{outline:none}.expand-toggle:focus-visible{outline:2px solid var(--kritzel-focus-color, #007acc);outline-offset:2px}.expand-toggle:active{transform:scale(0.95)}.divider{height:1px;background-color:var(--kritzel-divider-color, #e0e0e0);margin:4px 0;width:100%}"}},[513,"kritzel-tool-config",{tool:[1040],isExpanded:[1028,"is-expanded"],theme:[1],engine:[16],terms:[16],config:[32],palette:[32],sizes:[32],currentOpacity:[32],updateTrigger:[32]},void 0,{tool:[{handleToolChange:0}],theme:[{onThemeChange:0}],engine:[{handleEngineChange:0}]}]);function b(){"undefined"!=typeof customElements&&["kritzel-tool-config","kritzel-color","kritzel-color-palette","kritzel-dropdown","kritzel-font","kritzel-font-family","kritzel-font-size","kritzel-icon","kritzel-line-endings","kritzel-opacity-slider","kritzel-shape-fill","kritzel-stroke-size"].forEach((e=>{switch(e){case"kritzel-tool-config":customElements.get(r(e))||customElements.define(r(e),x);break;case"kritzel-color":customElements.get(r(e))||h();break;case"kritzel-color-palette":customElements.get(r(e))||p();break;case"kritzel-dropdown":customElements.get(r(e))||c();break;case"kritzel-font":customElements.get(r(e))||d();break;case"kritzel-font-family":customElements.get(r(e))||m();break;case"kritzel-font-size":customElements.get(r(e))||f();break;case"kritzel-icon":customElements.get(r(e))||g();break;case"kritzel-line-endings":customElements.get(r(e))||u();break;case"kritzel-opacity-slider":customElements.get(r(e))||y();break;case"kritzel-shape-fill":customElements.get(r(e))||z();break;case"kritzel-stroke-size":customElements.get(r(e))||k()}}))}export{C as K,x as a,b as d}
|