kritzel-stencil 0.4.3 → 0.4.5

package/dist/components/p-BmyTdQGy.js

@@ -1 +1,1090 @@
-const o=[{light:"#000000",dark:"#ffffff",label:"Primary"},{light:"#ff5252",dark:"#ff5252"},{light:"#ffbc00",dark:"#ffbc00"},{light:"#00c853",dark:"#00c853"},{light:"#0000FF",dark:"#0000FF"},{light:"#d500f9",dark:"#d500f9"},{light:"#fafafa",dark:"#212121",label:"Background"},{light:"#a52714",dark:"#a52714"},{light:"#ee8100",dark:"#ee8100"},{light:"#558b2f",dark:"#558b2f"},{light:"#01579b",dark:"#01579b"},{light:"#8e24aa",dark:"#8e24aa"},{light:"#90a4ae",dark:"#607d8b",label:"Neutral"},{light:"#ff4081",dark:"#ff4081"},{light:"#ff6e40",dark:"#ff6e40"},{light:"#aeea00",dark:"#aeea00"},{light:"#304ffe",dark:"#304ffe"},{light:"#7c4dff",dark:"#7c4dff"},{light:"#cfd8dc",dark:"#455a64"},{light:"#f8bbd0",dark:"#ec407a"},{light:"#ffccbc",dark:"#ff7043"},{light:"#f0f4c3",dark:"#c0ca33"},{light:"#9fa8da",dark:"#5c6bc0"},{light:"#d1c4e9",dark:"#9575cd"}],r={name:"light",global:{borderColor:"#ebebeb",dividerColor:"#e0e0e0",focusColor:"#333333",focusRingColor:"#333333",iconColor:"currentColor",scrollbarThumbColor:"#ebebeb",textPrimary:"#000000",textSecondary:"#333333"},pillTabs:{background:"#f0f0f0",tabBackground:"transparent",tabBackgroundHover:"rgba(0, 0, 0, 0.05)",tabBackgroundSelected:"#ffffff",tabLabelMaxWidth:"10rem",tabShadowSelected:"0 1px 3px rgba(0, 0, 0, 0.1)",tabTextColor:"#666666",tabTextColorSelected:"#000000"},textInput:{background:"#ffffff",borderColor:"#dbdbdb",borderRadius:"6px",focusBorderColor:"#333333",hoverBorderColor:"#cccccc",labelColor:"#333333",placeholderColor:"#999999",selectionBackground:"#007AFF",selectionColor:"#ffffff",suffixBackground:"#f5f5f5",suffixColor:"#666666",textColor:"#333333"},selection:{borderColor:"#007AFF",boxBackgroundColor:"rgba(0, 122, 255, 0.2)",boxBorderColor:"rgba(0, 122, 255, 0.5)",handleColor:"#ffffff",handleStrokeColor:"#007AFF"},checkerboard:{colorDark:"#cccccc",colorLight:"#ffffff"},backToContent:{activeBackgroundColor:"hsl(0, 0%, 0%, 8.6%)",backgroundColor:"#ffffff",border:"1px solid #ebebeb",boxShadow:"0 0 3px rgba(0, 0, 0, 0.08)",color:"#000000",hoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)"},colorPalette:{circleBorderColor:"#dddcdc",hoverBackgroundColor:"#ebebeb",selectedBackgroundColor:"#ebebeb"},contextMenu:{backgroundColor:"#ffffff",border:"1px solid #ebebeb",boxShadow:"0 1px 6px rgba(0, 0, 0, 0.12)",dividerColor:"rgba(0, 0, 0, 0.1)",itemActiveBackgroundColor:"hsl(0, 0%, 0%, 8.6%)",itemColor:"#333333",itemDisabledColor:"#aaaaaa",itemHoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)"},controls:{backgroundColor:"#ffffff",border:"1px solid #ebebeb",boxShadow:"0 0 3px rgba(0, 0, 0, 0.08)",controlActiveBackgroundColor:"hsl(0, 0%, 0%, 8.6%)",controlColor:"#000000",controlHoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)",controlSelectedBackgroundColor:"#007AFF",controlSelectedColor:"#ffffff",separatorColor:"#ebebeb"},currentUserDialog:{emailColor:"#666666",nameColor:"#333333"},dialog:{backdropColor:"rgba(0, 0, 0, 0.4)",backgroundColor:"#ffffff",border:"1px solid #ebebeb",boxShadow:"0 4px 24px rgba(0, 0, 0, 0.15)",closeButtonActiveBackground:"hsl(0, 0%, 0%, 8.6%)",closeButtonBackground:"transparent",closeButtonColor:"#333333",closeButtonHoverBackground:"hsl(0, 0%, 0%, 4.3%)",closeButtonHoverColor:"#000000",fontFamily:"inherit",footerBorder:"1px solid #ebebeb",headerBorder:"1px solid #ebebeb",titleColor:"#000000"},loginDialog:{buttonActiveBackground:"#ebebeb",buttonBackground:"#ffffff",buttonBorderColor:"#e0e0e0",buttonHoverBackground:"#f5f5f5",buttonHoverBorderColor:"#cccccc",buttonTextColor:"#333333",spinnerActiveColor:"#333333",spinnerColor:"#cccccc",subtitleColor:"#666666"},dropdown:{accentColor:"#007bff",background:"#ffffff",borderColor:"#dbdbdb",borderRadius:"6px",hoverBorderColor:"#cccccc",hoverBackgroundColor:"#f0f0f0",menuBorderRadius:"6px",selectedBackgroundColor:"#007bff1a",textColor:"#333333"},engine:{backgroundColor:"#ffffff",loadingOverlayBackground:"rgba(255, 255, 255, 0.85)",loadingOverlayColor:"#333333",loadingOverlaySpinnerActiveColor:"#333333",loadingOverlaySpinnerColor:"#cccccc"},snap:{indicatorFill:"rgba(59, 130, 246, 0.3)",indicatorStroke:"#007bff",lineStroke:"rgba(0, 0, 0, 0.2)"},fontSize:{hoverBackgroundColor:"#ebebeb",selectedBackgroundColor:"#ebebeb",textColor:"#333333"},lineEndings:{hoverBackgroundColor:"#ebebeb",labelColor:"#666666",optionBackground:"#ffffff",selectedBackgroundColor:"#ebebeb"},masterDetail:{backButtonColor:"#333333",backgroundColor:"#ffffff",detailBackgroundColor:"#ffffff",detailFocusOutline:"2px solid #333333",menuBackgroundColor:"#ffffff",menuBorderRight:"1px solid #ebebeb",menuItemActiveBackgroundColor:"hsl(0, 0%, 0%, 8.6%)",menuItemBackgroundColor:"transparent",menuItemChevronColor:"#aaaaaa",menuItemColor:"#333333",menuItemDisabledColor:"#aaaaaa",menuItemFocusOutline:"2px solid #333333",menuItemHoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)",menuItemSelectedBackgroundColor:"#007AFF",menuItemSelectedColor:"#ffffff",menuItemSelectedHoverBackgroundColor:"#007AFF"},menu:{backgroundColor:"#ffffff",border:"1px solid #ebebeb",boxShadow:"0 0 3px rgba(0, 0, 0, 0.08)",itemButtonHoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)",itemChildOpenBackgroundColor:"hsl(0, 0%, 0%, 3%)",itemColor:"#333333",itemEditingBackgroundColor:"#f0f0f0",itemInputBorder:"1px solid #333333",itemInputBorderColorOnSelected:"#ffffff",itemInputCaretColor:"#333333",itemInputCaretColorOnSelected:"#ffffff",itemInputSelectionColor:"#007aff",itemInputSelectionColorOnSelected:"rgba(255, 255, 255, 0.55)",itemInputSelectionTextColor:"#ffffff",itemInputSelectionTextColorOnSelected:"#ffffff",itemOverlayBackgroundColor:"hsl(0, 0%, 0%, 4.3%)",itemSelectedBackgroundColor:"#007aff",itemSelectedColor:"#ffffff"},moreMenu:{backgroundColor:"#ffffff",border:"1px solid #ebebeb",borderRadius:"12px",boxShadow:"0 0 3px rgba(0, 0, 0, 0.08)",buttonActiveBackgroundColor:"hsl(0, 0%, 0%, 8.6%)",buttonColor:"#000000",buttonHoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)",innerBorderRadius:"12px"},notificationCard:{backgroundColor:"#ffffff",border:"1px solid #e5e7eb",borderRadius:"12px",boxShadow:"0 8px 20px rgba(15, 23, 42, 0.08)",color:"#111827",dismissButtonActiveBackgroundColor:"#e5e7eb",dismissButtonBackgroundColor:"transparent",dismissButtonBorderRadius:"6px",dismissButtonColor:"#4b5563",dismissButtonHoverBackgroundColor:"#f3f4f6",dismissButtonSize:"24px",errorPillBackgroundColor:"#fef2f2",errorPillColor:"#b91c1c",headerGap:"8px",headerMarginBottom:"8px",headerRightGap:"6px",infoPillBackgroundColor:"#eff6ff",infoPillColor:"#1d4ed8",maxWidth:"360px",messageColor:"inherit",messageFontSize:"14px",messageLineHeight:"1.45",padding:"12px 14px",pillBackgroundColor:"#eff6ff",pillBorderRadius:"999px",pillColor:"#1d4ed8",pillFontSize:"12px",pillFontWeight:"600",pillHeight:"22px",pillPadding:"0 8px",timestampColor:"#6b7280",timestampFontSize:"12px",warningPillBackgroundColor:"#fff7ed",warningPillColor:"#b45309"},numericInput:{focusBorderColor:"#333333",borderColor:"#dbdbdb",borderRadius:"6px",hoverBorderColor:"#cccccc",inputBackground:"#ffffff",labelColor:"#666666",selectionBackground:"#007AFF",selectionColor:"#ffffff",spinnerActiveBackground:"hsl(0, 0%, 0%, 8.6%)",spinnerBackground:"transparent",spinnerBorderRadius:"5px",spinnerColor:"#333333",spinnerHoverBackground:"hsl(0, 0%, 0%, 4.3%)",textColor:"#333333"},opacitySlider:{activeColor:"#007AFF",thumbBorderColor:"#007AFF",thumbColor:"#ffffff",trackColor:"#e0e0e0"},settings:{contentHeadingColor:"#000000",contentTextColor:"#333333",descriptionColor:"#666666",labelColor:"#333333",shortcutItemBg:"#f8f8f8",shortcutKeyBg:"#ffffff",shortcutKeyBorder:"#e0e0e0",shortcutKeyColor:"#555555"},shapeFill:{hoverBackgroundColor:"#ebebeb",optionBackground:"#ffffff",selectedBackgroundColor:"#ebebeb"},shareDialog:{borderColor:"#e5e5e5",copyButtonBackground:"#ffffff",copyButtonColor:"#666666",copyButtonHoverBackground:"#e8e8e8",copyButtonHoverColor:"#333333",copySuccessBackground:"#d4edda",copySuccessColor:"#28a745",descriptionColor:"#666666",inputBackground:"#f5f5f5",inputBorderColor:"#e0e0e0",inputTextColor:"#333333",labelColor:"#333333",revokeButtonBorderColor:"#dc3545",revokeButtonColor:"#dc3545",revokeButtonHoverBackground:"#dc3545",revokeButtonHoverColor:"#ffffff",selectionColor:"#cce5ff"},slideToggle:{thumbColor:"#fff",thumbSize:"18px",trackCheckedColor:"#007AFF",trackColor:"#ccc"},splitButton:{backgroundColor:"#ffffff",border:"1px solid #ebebeb",boxShadow:"0 0 3px rgba(0, 0, 0, 0.08)",color:"#000000",dividerBackgroundColor:"#ebebeb",hoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)"},strokeSize:{hoverBackgroundColor:"#ebebeb",selectedBackgroundColor:"#ebebeb"},tooltip:{backgroundColor:"#ffffff",border:"1px solid #ebebeb",boxShadow:"0 1px 6px rgba(0, 0, 0, 0.12)",color:"#000000"},utilityPanel:{backgroundColor:"#e2e2e2",buttonColor:"#333333",buttonHoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)",separatorColor:"hsl(0, 0%, 0%, 8%)"},watermark:{background:"rgba(255, 255, 255, 0.6)",boxShadow:"0 1px 2px rgba(0, 0, 0, 0.12)",color:"rgba(60, 60, 60, 0.75)"},zoomPanel:{backgroundColor:"#ffffff",border:"1px solid #ebebeb",borderRadius:"12px",boxShadow:"0 0 3px rgba(0, 0, 0, 0.08)",buttonActiveBackgroundColor:"hsl(0, 0%, 0%, 8.6%)",buttonBorderRadius:"8px",buttonHoverBackgroundColor:"hsl(0, 0%, 0%, 4.3%)",buttonSize:"32px",gap:"4px",iconColor:"#000000",padding:"4px"}},e={name:"dark",global:{borderColor:"#3a3a3a",dividerColor:"#3a3a3a",focusColor:"#ffffff",focusRingColor:"#ffffff",iconColor:"currentColor",scrollbarThumbColor:"#555555",textPrimary:"#ffffff",textSecondary:"#e0e0e0"},pillTabs:{background:"#3a3a3a",tabBackground:"transparent",tabBackgroundHover:"rgba(255, 255, 255, 0.08)",tabBackgroundSelected:"#2a2a2a",tabLabelMaxWidth:"10rem",tabShadowSelected:"0 1px 3px rgba(0, 0, 0, 0.3)",tabTextColor:"#999999",tabTextColorSelected:"#ffffff"},textInput:{background:"#1a1a1a",borderColor:"#4a4a4a",borderRadius:"6px",focusBorderColor:"#ffffff",hoverBorderColor:"#5a5a5a",labelColor:"#e0e0e0",placeholderColor:"#777777",selectionBackground:"#0A84FF",selectionColor:"#ffffff",suffixBackground:"#3a3a3a",suffixColor:"#aaaaaa",textColor:"#e0e0e0"},selection:{borderColor:"#0A84FF",boxBackgroundColor:"rgba(10, 132, 255, 0.2)",boxBorderColor:"rgba(10, 132, 255, 0.5)",handleColor:"#1a1a1a",handleStrokeColor:"#0A84FF"},checkerboard:{colorDark:"#4a4a4a",colorLight:"#3a3a3a"},backToContent:{activeBackgroundColor:"hsl(0, 0%, 100%, 12%)",backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",boxShadow:"0 0 6px rgba(0, 0, 0, 0.3)",color:"#ffffff",hoverBackgroundColor:"hsl(0, 0%, 100%, 8%)"},colorPalette:{circleBorderColor:"#4a4a4a",hoverBackgroundColor:"#3a3a3a",selectedBackgroundColor:"#3a3a3a"},contextMenu:{backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",boxShadow:"0 1px 8px rgba(0, 0, 0, 0.4)",dividerColor:"rgba(255, 255, 255, 0.1)",itemActiveBackgroundColor:"hsl(0, 0%, 100%, 12%)",itemColor:"#e0e0e0",itemDisabledColor:"#666666",itemHoverBackgroundColor:"hsl(0, 0%, 100%, 8%)"},controls:{backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",boxShadow:"0 0 6px rgba(0, 0, 0, 0.3)",controlActiveBackgroundColor:"hsl(0, 0%, 100%, 12%)",controlColor:"#ffffff",controlHoverBackgroundColor:"hsl(0, 0%, 100%, 8%)",controlSelectedBackgroundColor:"#0A84FF",controlSelectedColor:"#ffffff",separatorColor:"#3a3a3a"},currentUserDialog:{emailColor:"#999999",nameColor:"#ffffff"},dialog:{backdropColor:"rgba(0, 0, 0, 0.6)",backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",boxShadow:"0 4px 24px rgba(0, 0, 0, 0.5)",closeButtonActiveBackground:"hsl(0, 0%, 100%, 12%)",closeButtonBackground:"transparent",closeButtonColor:"#e0e0e0",closeButtonHoverBackground:"hsl(0, 0%, 100%, 8%)",closeButtonHoverColor:"#ffffff",footerBorder:"1px solid #3a3a3a",headerBorder:"1px solid #3a3a3a",titleColor:"#ffffff"},loginDialog:{buttonActiveBackground:"#444444",buttonBackground:"#2a2a2a",buttonBorderColor:"#4a4a4a",buttonHoverBackground:"#3a3a3a",buttonHoverBorderColor:"#5a5a5a",buttonTextColor:"#e0e0e0",spinnerActiveColor:"#ffffff",spinnerColor:"#555555",subtitleColor:"#999999"},dropdown:{accentColor:"#0A84FF",borderColor:"#4a4a4a",borderRadius:"6px",hoverBorderColor:"#5a5a5a",background:"#1a1a1a",hoverBackgroundColor:"#3a3a3a",menuBorderRadius:"6px",selectedBackgroundColor:"rgba(10, 132, 255, 0.2)",textColor:"#e0e0e0"},engine:{backgroundColor:"#1a1a1a",loadingOverlayBackground:"rgba(26, 26, 26, 0.85)",loadingOverlayColor:"#e0e0e0",loadingOverlaySpinnerActiveColor:"#e0e0e0",loadingOverlaySpinnerColor:"#555555"},snap:{indicatorFill:"rgba(10, 132, 255, 0.35)",indicatorStroke:"#0A84FF",lineStroke:"rgba(255, 255, 255, 0.35)"},fontSize:{hoverBackgroundColor:"#3a3a3a",selectedBackgroundColor:"#3a3a3a",textColor:"#e0e0e0"},lineEndings:{hoverBackgroundColor:"#3a3a3a",labelColor:"#999999",optionBackground:"#2a2a2a",selectedBackgroundColor:"#3a3a3a"},masterDetail:{backButtonColor:"#e0e0e0",backgroundColor:"#2a2a2a",detailBackgroundColor:"#2a2a2a",detailFocusOutline:"2px solid #ffffff",menuBackgroundColor:"#2a2a2a",menuBorderRight:"1px solid #3a3a3a",menuItemActiveBackgroundColor:"hsl(0, 0%, 100%, 12%)",menuItemBackgroundColor:"transparent",menuItemChevronColor:"#666666",menuItemColor:"#e0e0e0",menuItemDisabledColor:"#666666",menuItemFocusOutline:"2px solid #ffffff",menuItemHoverBackgroundColor:"hsl(0, 0%, 100%, 8%)",menuItemSelectedBackgroundColor:"#0A84FF",menuItemSelectedColor:"#ffffff",menuItemSelectedHoverBackgroundColor:"#0A84FF"},menu:{backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",boxShadow:"0 0 6px rgba(0, 0, 0, 0.3)",itemButtonHoverBackgroundColor:"hsl(0, 0%, 100%, 8%)",itemChildOpenBackgroundColor:"hsl(0, 0%, 100%, 6%)",itemColor:"#e0e0e0",itemEditingBackgroundColor:"#3a3a3a",itemInputBorder:"1px solid #ffffff",itemInputBorderColorOnSelected:"#ffffff",itemInputCaretColor:"#e0e0e0",itemInputCaretColorOnSelected:"#ffffff",itemInputSelectionColor:"#b0b0b0",itemInputSelectionColorOnSelected:"rgba(255, 255, 255, 0.35)",itemInputSelectionTextColor:"#ffffff",itemInputSelectionTextColorOnSelected:"#ffffff",itemOverlayBackgroundColor:"hsl(0, 0%, 100%, 8%)",itemSelectedBackgroundColor:"#0A84FF",itemSelectedColor:"#ffffff"},moreMenu:{backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",borderRadius:"12px",boxShadow:"0 0 6px rgba(0, 0, 0, 0.3)",buttonActiveBackgroundColor:"hsl(0, 0%, 100%, 12%)",buttonColor:"#ffffff",buttonHoverBackgroundColor:"hsl(0, 0%, 100%, 8%)",innerBorderRadius:"12px"},notificationCard:{backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",borderRadius:"12px",boxShadow:"0 8px 20px rgba(0, 0, 0, 0.35)",color:"#e0e0e0",dismissButtonActiveBackgroundColor:"hsl(0, 0%, 100%, 12%)",dismissButtonBackgroundColor:"transparent",dismissButtonBorderRadius:"6px",dismissButtonColor:"#c7c7c7",dismissButtonHoverBackgroundColor:"hsl(0, 0%, 100%, 8%)",dismissButtonSize:"24px",errorPillBackgroundColor:"#4d1f24",errorPillColor:"#ff9aa2",headerGap:"8px",headerMarginBottom:"8px",headerRightGap:"6px",infoPillBackgroundColor:"#1f2f4a",infoPillColor:"#8bb7ff",maxWidth:"360px",messageColor:"inherit",messageFontSize:"14px",messageLineHeight:"1.45",padding:"12px 14px",pillBackgroundColor:"#1f2f4a",pillBorderRadius:"999px",pillColor:"#8bb7ff",pillFontSize:"12px",pillFontWeight:"600",pillHeight:"22px",pillPadding:"0 8px",timestampColor:"#a0a0a0",timestampFontSize:"12px",warningPillBackgroundColor:"#4a341f",warningPillColor:"#ffd29a"},numericInput:{borderColor:"#4a4a4a",borderRadius:"6px",focusBorderColor:"#ffffff",hoverBorderColor:"#5a5a5a",inputBackground:"#1a1a1a",labelColor:"#999999",selectionBackground:"#0A84FF",selectionColor:"#ffffff",spinnerActiveBackground:"hsl(0, 0%, 100%, 12%)",spinnerBackground:"transparent",spinnerBorderRadius:"5px",spinnerColor:"#e0e0e0",spinnerHoverBackground:"hsl(0, 0%, 100%, 8%)",textColor:"#e0e0e0"},opacitySlider:{activeColor:"#0A84FF",thumbBorderColor:"#0A84FF",thumbColor:"#ffffff",trackColor:"#4a4a4a"},settings:{contentHeadingColor:"#ffffff",contentTextColor:"#e0e0e0",descriptionColor:"#999999",labelColor:"#e0e0e0",shortcutItemBg:"#3a3a3a",shortcutKeyBg:"#2a2a2a",shortcutKeyBorder:"#4a4a4a",shortcutKeyColor:"#e0e0e0"},shapeFill:{hoverBackgroundColor:"#3a3a3a",optionBackground:"#2a2a2a",selectedBackgroundColor:"#3a3a3a"},shareDialog:{labelColor:"#e0e0e0",descriptionColor:"#e0e0e0",inputBackground:"#1a1a1a",inputBorderColor:"#4a4a4a",inputTextColor:"#e0e0e0",selectionColor:"#0A84FF",copyButtonBackground:"#2a2a2a",copyButtonColor:"#e0e0e0",copyButtonHoverBackground:"#3a3a3a",copyButtonHoverColor:"#ffffff",copySuccessBackground:"#28a745",copySuccessColor:"#ffffff"},slideToggle:{thumbColor:"#ffffff",trackCheckedColor:"#0A84FF",trackColor:"#4a4a4a",transitionDuration:"0.2s"},splitButton:{backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",boxShadow:"0 0 6px rgba(0, 0, 0, 0.3)",color:"#ffffff",dividerBackgroundColor:"#3a3a3a",hoverBackgroundColor:"hsl(0, 0%, 100%, 8%)"},strokeSize:{hoverBackgroundColor:"#3a3a3a",selectedBackgroundColor:"#3a3a3a"},tooltip:{backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",boxShadow:"0 1px 8px rgba(0, 0, 0, 0.4)",color:"#ffffff"},utilityPanel:{backgroundColor:"#3a3a3a",buttonColor:"#e0e0e0",buttonHoverBackgroundColor:"hsl(0, 0%, 100%, 8%)",separatorColor:"hsl(0, 0%, 100%, 12%)"},watermark:{background:"rgba(40, 40, 40, 0.6)",boxShadow:"0 1px 2px rgba(0, 0, 0, 0.35)",color:"rgba(220, 220, 220, 0.8)"},zoomPanel:{backgroundColor:"#2a2a2a",border:"1px solid #3a3a3a",borderRadius:"12px",boxShadow:"0 0 3px rgba(0, 0, 0, 0.4)",buttonActiveBackgroundColor:"hsl(0, 0%, 100%, 12%)",buttonBorderRadius:"8px",buttonHoverBackgroundColor:"hsl(0, 0%, 100%, 8%)",buttonSize:"32px",gap:"4px",iconColor:"#e0e0e0",padding:"4px"}};class a{static camelToKebab(o){return o.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()}static flattenThemeToVariables(o,r="--kritzel"){const e=new Map,t=(o,r,l=!1)=>{for(const[n,f]of Object.entries(o)){if(l&&"name"===n)continue;const o=`${r}-${a.camelToKebab(n)}`;"object"==typeof f&&null!==f?t(f,o):"string"==typeof f&&e.set(o,f)}};return t(o,r,!0),e}static applyVariablesToElement(o,r){for(const[e,a]of r)o.style.setProperty(e,a)}static applyThemeToElement(o,r){const e=a.flattenThemeToVariables(r);a.applyVariablesToElement(o,e)}}const t="kritzel-settings",l="light";class n{_core;_currentTheme=l;_targetElement=null;_storageKey;_themeRegistry=new Map;constructor(o){this._core=o,this._storageKey=o.editorId?`${t}-${o.editorId}`:t,this._themeRegistry.set("light",r),this._themeRegistry.set("dark",e),this._currentTheme=this.getStoredTheme()}get currentTheme(){return this._currentTheme}setTargetElement(o){this._targetElement=o,this._targetElement&&this.applyTheme(this._currentTheme)}getTargetElement(){return this._targetElement}getThemeByName(o){return this._themeRegistry.get(o)??this._themeRegistry.values().next().value}registerThemes(o){0===o.length&&console.warn("[KritzelThemeManager] registerThemes called with an empty array. The theme registry will be empty."),this._themeRegistry.clear();for(const r of o)this._themeRegistry.set(r.name,r)}injectThemeEarly(o){let r=o;if(r||"undefined"==typeof document||(r=document.documentElement),!r)return;const e=this.getStoredTheme(),t=this.getThemeByName(e);a.applyThemeToElement(r,t)}getAllThemes(){return Array.from(this._themeRegistry.values())}getStoredTheme(){if("undefined"==typeof localStorage)return l;const o=localStorage.getItem(this._storageKey);if(!o)return l;try{const r=JSON.parse(o);if("string"==typeof r?.theme)return r.theme}catch{}return l}static getStoredTheme(){if("undefined"==typeof localStorage)return l;const o=localStorage.getItem(t);if(!o)return l;try{const r=JSON.parse(o);if("string"==typeof r?.theme)return r.theme}catch{}return l}setTheme(o){this._currentTheme=o,this._targetElement&&this.applyTheme(o)}isDarkTheme(){return"dark"===this._currentTheme}applyTheme(o){if(!this._targetElement)return;const r=this.getThemeByName(o);a.applyThemeToElement(this._targetElement,r)}cleanup(){this._targetElement=null}}class f{static resolveThemeColor(o,r){return o?function(o,r){return r in o&&o[r]?o[r]:o["dark"===r?"dark":"light"]}(o,r??n.getStoredTheme()):""}static applyOpacity(o,r,e){const a="string"==typeof o?o:this.resolveThemeColor(o,e);if(!a||r>=1)return a;const t=a.startsWith("#")?a.slice(1):a;let l,n,f;if(3===t.length)l=parseInt(t[0]+t[0],16),n=parseInt(t[1]+t[1],16),f=parseInt(t[2]+t[2],16);else{if(6!==t.length)return a;l=parseInt(t.substring(0,2),16),n=parseInt(t.substring(2,4),16),f=parseInt(t.substring(4,6),16)}return isNaN(l)||isNaN(n)||isNaN(f)?a:`rgba(${l}, ${n}, ${f}, ${r})`}static getContrastColor(o){const r=o.startsWith("#")?o.slice(1):o;let e,a,t;if(3===r.length)e=parseInt(r[0]+r[0],16),a=parseInt(r[1]+r[1],16),t=parseInt(r[2]+r[2],16);else{if(6!==r.length)return"#000000";e=parseInt(r.substring(0,2),16),a=parseInt(r.substring(2,4),16),t=parseInt(r.substring(4,6),16)}return isNaN(e)||isNaN(a)||isNaN(t)||.299*e+.587*a+.114*t>150?"#000000":"#ffffff"}static determineTextColor(o){const r="transparent"===o.light,e="transparent"===o.dark;return r&&e?{light:"#000000",dark:"#ffffff"}:{light:r?"#000000":this.getContrastColor(o.light),dark:e?"#ffffff":this.getContrastColor(o.dark)}}}export{o as D,n as K,a as T,f as a,e as d,r as l}
+/**
+ * Helper function to resolve a color value for a specific theme
+ */
+function resolveColor(color, theme) {
+    if (theme in color && color[theme]) {
+        return color[theme];
+    }
+    return color[theme === 'dark' ? 'dark' : 'light'];
+}
+/**
+ * Default color palette shared across all tool configurations.
+ * This ensures consistency in color options throughout the application.
+ * All colors support theme-specific variations.
+ */
+const DEFAULT_COLOR_PALETTE = [
+    { light: '#000000', dark: '#ffffff', label: 'Primary' },
+    { light: '#ff5252', dark: '#ff5252' },
+    { light: '#ffbc00', dark: '#ffbc00' },
+    { light: '#00c853', dark: '#00c853' },
+    { light: '#0000FF', dark: '#0000FF' },
+    { light: '#d500f9', dark: '#d500f9' },
+    { light: '#fafafa', dark: '#212121', label: 'Background' },
+    { light: '#a52714', dark: '#a52714' },
+    { light: '#ee8100', dark: '#ee8100' },
+    { light: '#558b2f', dark: '#558b2f' },
+    { light: '#01579b', dark: '#01579b' },
+    { light: '#8e24aa', dark: '#8e24aa' },
+    { light: '#90a4ae', dark: '#607d8b', label: 'Neutral' },
+    { light: '#ff4081', dark: '#ff4081' },
+    { light: '#ff6e40', dark: '#ff6e40' },
+    { light: '#aeea00', dark: '#aeea00' },
+    { light: '#304ffe', dark: '#304ffe' },
+    { light: '#7c4dff', dark: '#7c4dff' },
+    { light: '#cfd8dc', dark: '#455a64' },
+    { light: '#f8bbd0', dark: '#ec407a' },
+    { light: '#ffccbc', dark: '#ff7043' },
+    { light: '#f0f4c3', dark: '#c0ca33' },
+    { light: '#9fa8da', dark: '#5c6bc0' },
+    { light: '#d1c4e9', dark: '#9575cd' },
+];
+
+/**
+ * Light theme preset - the default theme
+ */
+const lightTheme = {
+    name: 'light',
+    global: {
+        borderColor: '#ebebeb',
+        dividerColor: '#e0e0e0',
+        focusColor: '#333333',
+        focusRingColor: '#333333',
+        iconColor: 'currentColor',
+        scrollbarThumbColor: '#ebebeb',
+        textPrimary: '#000000',
+        textSecondary: '#333333',
+    },
+    pillTabs: {
+        background: '#f0f0f0',
+        tabBackground: 'transparent',
+        tabBackgroundHover: 'rgba(0, 0, 0, 0.05)',
+        tabBackgroundSelected: '#ffffff',
+        tabLabelMaxWidth: '10rem',
+        tabShadowSelected: '0 1px 3px rgba(0, 0, 0, 0.1)',
+        tabTextColor: '#666666',
+        tabTextColorSelected: '#000000',
+    },
+    textInput: {
+        background: '#ffffff',
+        borderColor: '#dbdbdb',
+        borderRadius: '6px',
+        focusBorderColor: '#333333',
+        hoverBorderColor: '#cccccc',
+        labelColor: '#333333',
+        placeholderColor: '#999999',
+        selectionBackground: '#007AFF',
+        selectionColor: '#ffffff',
+        suffixBackground: '#f5f5f5',
+        suffixColor: '#666666',
+        textColor: '#333333',
+    },
+    selection: {
+        borderColor: '#007AFF',
+        boxBackgroundColor: 'rgba(0, 122, 255, 0.2)',
+        boxBorderColor: 'rgba(0, 122, 255, 0.5)',
+        handleColor: '#ffffff',
+        handleStrokeColor: '#007AFF'
+    },
+    checkerboard: {
+        colorDark: '#cccccc',
+        colorLight: '#ffffff',
+    },
+    backToContent: {
+        activeBackgroundColor: 'hsl(0, 0%, 0%, 8.6%)',
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        boxShadow: '0 0 3px rgba(0, 0, 0, 0.08)',
+        color: '#000000',
+        hoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+    },
+    colorPalette: {
+        circleBorderColor: '#dddcdc',
+        hoverBackgroundColor: '#ebebeb',
+        selectedBackgroundColor: '#ebebeb',
+    },
+    contextMenu: {
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        boxShadow: '0 1px 6px rgba(0, 0, 0, 0.12)',
+        dividerColor: 'rgba(0, 0, 0, 0.1)',
+        itemActiveBackgroundColor: 'hsl(0, 0%, 0%, 8.6%)',
+        itemColor: '#333333',
+        itemDisabledColor: '#aaaaaa',
+        itemHoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+    },
+    controls: {
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        boxShadow: '0 0 3px rgba(0, 0, 0, 0.08)',
+        controlActiveBackgroundColor: 'hsl(0, 0%, 0%, 8.6%)',
+        controlColor: '#000000',
+        controlHoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+        controlSelectedBackgroundColor: '#007AFF',
+        controlSelectedColor: '#ffffff',
+        separatorColor: '#ebebeb',
+    },
+    currentUserDialog: {
+        emailColor: '#666666',
+        nameColor: '#333333',
+    },
+    dialog: {
+        backdropColor: 'rgba(0, 0, 0, 0.4)',
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        boxShadow: '0 4px 24px rgba(0, 0, 0, 0.15)',
+        closeButtonActiveBackground: 'hsl(0, 0%, 0%, 8.6%)',
+        closeButtonBackground: 'transparent',
+        closeButtonColor: '#333333',
+        closeButtonHoverBackground: 'hsl(0, 0%, 0%, 4.3%)',
+        closeButtonHoverColor: '#000000',
+        fontFamily: 'inherit',
+        footerBorder: '1px solid #ebebeb',
+        headerBorder: '1px solid #ebebeb',
+        titleColor: '#000000',
+    },
+    loginDialog: {
+        buttonActiveBackground: '#ebebeb',
+        buttonBackground: '#ffffff',
+        buttonBorderColor: '#e0e0e0',
+        buttonHoverBackground: '#f5f5f5',
+        buttonHoverBorderColor: '#cccccc',
+        buttonTextColor: '#333333',
+        spinnerActiveColor: '#333333',
+        spinnerColor: '#cccccc',
+        subtitleColor: '#666666',
+    },
+    dropdown: {
+        accentColor: '#007bff',
+        background: '#ffffff',
+        borderColor: '#dbdbdb',
+        borderRadius: '6px',
+        hoverBorderColor: '#cccccc',
+        hoverBackgroundColor: '#f0f0f0',
+        menuBorderRadius: '6px',
+        selectedBackgroundColor: '#007bff1a',
+        textColor: '#333333',
+    },
+    engine: {
+        backgroundColor: '#ffffff',
+        loadingOverlayBackground: 'rgba(255, 255, 255, 0.85)',
+        loadingOverlayColor: '#333333',
+        loadingOverlaySpinnerActiveColor: '#333333',
+        loadingOverlaySpinnerColor: '#cccccc',
+    },
+    snap: {
+        indicatorFill: 'rgba(59, 130, 246, 0.3)',
+        indicatorStroke: '#007bff',
+        lineStroke: 'rgba(0, 0, 0, 0.2)',
+    },
+    fontSize: {
+        hoverBackgroundColor: '#ebebeb',
+        selectedBackgroundColor: '#ebebeb',
+        textColor: '#333333',
+    },
+    lineEndings: {
+        hoverBackgroundColor: '#ebebeb',
+        labelColor: '#666666',
+        optionBackground: '#ffffff',
+        selectedBackgroundColor: '#ebebeb',
+    },
+    masterDetail: {
+        backButtonColor: '#333333',
+        backgroundColor: '#ffffff',
+        detailBackgroundColor: '#ffffff',
+        detailFocusOutline: '2px solid #333333',
+        menuBackgroundColor: '#ffffff',
+        menuBorderRight: '1px solid #ebebeb',
+        menuItemActiveBackgroundColor: 'hsl(0, 0%, 0%, 8.6%)',
+        menuItemBackgroundColor: 'transparent',
+        menuItemChevronColor: '#aaaaaa',
+        menuItemColor: '#333333',
+        menuItemDisabledColor: '#aaaaaa',
+        menuItemFocusOutline: '2px solid #333333',
+        menuItemHoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+        menuItemSelectedBackgroundColor: '#007AFF',
+        menuItemSelectedColor: '#ffffff',
+        menuItemSelectedHoverBackgroundColor: '#007AFF',
+    },
+    menu: {
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        boxShadow: '0 0 3px rgba(0, 0, 0, 0.08)',
+        itemButtonHoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+        itemChildOpenBackgroundColor: 'hsl(0, 0%, 0%, 3%)',
+        itemColor: '#333333',
+        itemEditingBackgroundColor: '#f0f0f0',
+        itemInputBorder: '1px solid #333333',
+        itemInputBorderColorOnSelected: '#ffffff',
+        itemInputCaretColor: '#333333',
+        itemInputCaretColorOnSelected: '#ffffff',
+        itemInputSelectionColor: '#007aff',
+        itemInputSelectionColorOnSelected: 'rgba(255, 255, 255, 0.55)',
+        itemInputSelectionTextColor: '#ffffff',
+        itemInputSelectionTextColorOnSelected: '#ffffff',
+        itemOverlayBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+        itemSelectedBackgroundColor: '#007aff',
+        itemSelectedColor: '#ffffff',
+    },
+    moreMenu: {
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        borderRadius: '12px',
+        boxShadow: '0 0 3px rgba(0, 0, 0, 0.08)',
+        buttonActiveBackgroundColor: 'hsl(0, 0%, 0%, 8.6%)',
+        buttonColor: '#000000',
+        buttonHoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+        innerBorderRadius: '12px',
+    },
+    notificationCard: {
+        backgroundColor: '#ffffff',
+        border: '1px solid #e5e7eb',
+        borderRadius: '12px',
+        boxShadow: '0 8px 20px rgba(15, 23, 42, 0.08)',
+        color: '#111827',
+        dismissButtonActiveBackgroundColor: '#e5e7eb',
+        dismissButtonBackgroundColor: 'transparent',
+        dismissButtonBorderRadius: '6px',
+        dismissButtonColor: '#4b5563',
+        dismissButtonHoverBackgroundColor: '#f3f4f6',
+        dismissButtonSize: '24px',
+        errorPillBackgroundColor: '#fef2f2',
+        errorPillColor: '#b91c1c',
+        headerGap: '8px',
+        headerMarginBottom: '8px',
+        headerRightGap: '6px',
+        infoPillBackgroundColor: '#eff6ff',
+        infoPillColor: '#1d4ed8',
+        maxWidth: '360px',
+        messageColor: 'inherit',
+        messageFontSize: '14px',
+        messageLineHeight: '1.45',
+        padding: '12px 14px',
+        pillBackgroundColor: '#eff6ff',
+        pillBorderRadius: '999px',
+        pillColor: '#1d4ed8',
+        pillFontSize: '12px',
+        pillFontWeight: '600',
+        pillHeight: '22px',
+        pillPadding: '0 8px',
+        timestampColor: '#6b7280',
+        timestampFontSize: '12px',
+        warningPillBackgroundColor: '#fff7ed',
+        warningPillColor: '#b45309',
+    },
+    numericInput: {
+        focusBorderColor: '#333333',
+        borderColor: '#dbdbdb',
+        borderRadius: '6px',
+        hoverBorderColor: '#cccccc',
+        inputBackground: '#ffffff',
+        labelColor: '#666666',
+        selectionBackground: '#007AFF',
+        selectionColor: '#ffffff',
+        spinnerActiveBackground: 'hsl(0, 0%, 0%, 8.6%)',
+        spinnerBackground: 'transparent',
+        spinnerBorderRadius: '5px',
+        spinnerColor: '#333333',
+        spinnerHoverBackground: 'hsl(0, 0%, 0%, 4.3%)',
+        textColor: '#333333',
+    },
+    opacitySlider: {
+        activeColor: '#007AFF',
+        thumbBorderColor: '#007AFF',
+        thumbColor: '#ffffff',
+        trackColor: '#e0e0e0',
+    },
+    settings: {
+        contentHeadingColor: '#000000',
+        contentTextColor: '#333333',
+        descriptionColor: '#666666',
+        labelColor: '#333333',
+        shortcutItemBg: '#f8f8f8',
+        shortcutKeyBg: '#ffffff',
+        shortcutKeyBorder: '#e0e0e0',
+        shortcutKeyColor: '#555555',
+    },
+    shapeFill: {
+        hoverBackgroundColor: '#ebebeb',
+        optionBackground: '#ffffff',
+        selectedBackgroundColor: '#ebebeb',
+    },
+    shareDialog: {
+        borderColor: '#e5e5e5',
+        copyButtonBackground: '#ffffff',
+        copyButtonColor: '#666666',
+        copyButtonHoverBackground: '#e8e8e8',
+        copyButtonHoverColor: '#333333',
+        copySuccessBackground: '#d4edda',
+        copySuccessColor: '#28a745',
+        descriptionColor: '#666666',
+        inputBackground: '#f5f5f5',
+        inputBorderColor: '#e0e0e0',
+        inputTextColor: '#333333',
+        labelColor: '#333333',
+        revokeButtonBorderColor: '#dc3545',
+        revokeButtonColor: '#dc3545',
+        revokeButtonHoverBackground: '#dc3545',
+        revokeButtonHoverColor: '#ffffff',
+        selectionColor: '#cce5ff',
+    },
+    slideToggle: {
+        thumbColor: '#fff',
+        thumbSize: '18px',
+        trackCheckedColor: '#007AFF',
+        trackColor: '#ccc',
+    },
+    splitButton: {
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        boxShadow: '0 0 3px rgba(0, 0, 0, 0.08)',
+        color: '#000000',
+        dividerBackgroundColor: '#ebebeb',
+        hoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+    },
+    strokeSize: {
+        hoverBackgroundColor: '#ebebeb',
+        selectedBackgroundColor: '#ebebeb',
+    },
+    tooltip: {
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        boxShadow: '0 1px 6px rgba(0, 0, 0, 0.12)',
+        color: '#000000',
+    },
+    utilityPanel: {
+        backgroundColor: '#e2e2e2',
+        buttonColor: '#333333',
+        buttonHoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+        separatorColor: 'hsl(0, 0%, 0%, 8%)',
+    },
+    watermark: {
+        background: 'rgba(255, 255, 255, 0.6)',
+        boxShadow: '0 1px 2px rgba(0, 0, 0, 0.12)',
+        color: 'rgba(60, 60, 60, 0.75)',
+    },
+    zoomPanel: {
+        backgroundColor: '#ffffff',
+        border: '1px solid #ebebeb',
+        borderRadius: '12px',
+        boxShadow: '0 0 3px rgba(0, 0, 0, 0.08)',
+        buttonActiveBackgroundColor: 'hsl(0, 0%, 0%, 8.6%)',
+        buttonBorderRadius: '8px',
+        buttonHoverBackgroundColor: 'hsl(0, 0%, 0%, 4.3%)',
+        buttonSize: '32px',
+        gap: '4px',
+        iconColor: '#000000',
+        padding: '4px',
+    },
+};
+
+/**
+ * Dark theme preset
+ */
+const darkTheme = {
+    name: 'dark',
+    global: {
+        borderColor: '#3a3a3a',
+        dividerColor: '#3a3a3a',
+        focusColor: '#ffffff',
+        focusRingColor: '#ffffff',
+        iconColor: 'currentColor',
+        scrollbarThumbColor: '#555555',
+        textPrimary: '#ffffff',
+        textSecondary: '#e0e0e0',
+    },
+    pillTabs: {
+        background: '#3a3a3a',
+        tabBackground: 'transparent',
+        tabBackgroundHover: 'rgba(255, 255, 255, 0.08)',
+        tabBackgroundSelected: '#2a2a2a',
+        tabLabelMaxWidth: '10rem',
+        tabShadowSelected: '0 1px 3px rgba(0, 0, 0, 0.3)',
+        tabTextColor: '#999999',
+        tabTextColorSelected: '#ffffff',
+    },
+    textInput: {
+        background: '#1a1a1a',
+        borderColor: '#4a4a4a',
+        borderRadius: '6px',
+        focusBorderColor: '#ffffff',
+        hoverBorderColor: '#5a5a5a',
+        labelColor: '#e0e0e0',
+        placeholderColor: '#777777',
+        selectionBackground: '#0A84FF',
+        selectionColor: '#ffffff',
+        suffixBackground: '#3a3a3a',
+        suffixColor: '#aaaaaa',
+        textColor: '#e0e0e0',
+    },
+    selection: {
+        borderColor: '#0A84FF',
+        boxBackgroundColor: 'rgba(10, 132, 255, 0.2)',
+        boxBorderColor: 'rgba(10, 132, 255, 0.5)',
+        handleColor: '#1a1a1a',
+        handleStrokeColor: '#0A84FF'
+    },
+    checkerboard: {
+        colorDark: '#4a4a4a',
+        colorLight: '#3a3a3a',
+    },
+    backToContent: {
+        activeBackgroundColor: 'hsl(0, 0%, 100%, 12%)',
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        boxShadow: '0 0 6px rgba(0, 0, 0, 0.3)',
+        color: '#ffffff',
+        hoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+    },
+    colorPalette: {
+        circleBorderColor: '#4a4a4a',
+        hoverBackgroundColor: '#3a3a3a',
+        selectedBackgroundColor: '#3a3a3a',
+    },
+    contextMenu: {
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        boxShadow: '0 1px 8px rgba(0, 0, 0, 0.4)',
+        dividerColor: 'rgba(255, 255, 255, 0.1)',
+        itemActiveBackgroundColor: 'hsl(0, 0%, 100%, 12%)',
+        itemColor: '#e0e0e0',
+        itemDisabledColor: '#666666',
+        itemHoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+    },
+    controls: {
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        boxShadow: '0 0 6px rgba(0, 0, 0, 0.3)',
+        controlActiveBackgroundColor: 'hsl(0, 0%, 100%, 12%)',
+        controlColor: '#ffffff',
+        controlHoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+        controlSelectedBackgroundColor: '#0A84FF',
+        controlSelectedColor: '#ffffff',
+        separatorColor: '#3a3a3a',
+    },
+    currentUserDialog: {
+        emailColor: '#999999',
+        nameColor: '#ffffff',
+    },
+    dialog: {
+        backdropColor: 'rgba(0, 0, 0, 0.6)',
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        boxShadow: '0 4px 24px rgba(0, 0, 0, 0.5)',
+        closeButtonActiveBackground: 'hsl(0, 0%, 100%, 12%)',
+        closeButtonBackground: 'transparent',
+        closeButtonColor: '#e0e0e0',
+        closeButtonHoverBackground: 'hsl(0, 0%, 100%, 8%)',
+        closeButtonHoverColor: '#ffffff',
+        footerBorder: '1px solid #3a3a3a',
+        headerBorder: '1px solid #3a3a3a',
+        titleColor: '#ffffff',
+    },
+    loginDialog: {
+        buttonActiveBackground: '#444444',
+        buttonBackground: '#2a2a2a',
+        buttonBorderColor: '#4a4a4a',
+        buttonHoverBackground: '#3a3a3a',
+        buttonHoverBorderColor: '#5a5a5a',
+        buttonTextColor: '#e0e0e0',
+        spinnerActiveColor: '#ffffff',
+        spinnerColor: '#555555',
+        subtitleColor: '#999999',
+    },
+    dropdown: {
+        accentColor: '#0A84FF',
+        borderColor: '#4a4a4a',
+        borderRadius: '6px',
+        hoverBorderColor: '#5a5a5a',
+        background: '#1a1a1a',
+        hoverBackgroundColor: '#3a3a3a',
+        menuBorderRadius: '6px',
+        selectedBackgroundColor: 'rgba(10, 132, 255, 0.2)',
+        textColor: '#e0e0e0',
+    },
+    engine: {
+        backgroundColor: '#1a1a1a',
+        loadingOverlayBackground: 'rgba(26, 26, 26, 0.85)',
+        loadingOverlayColor: '#e0e0e0',
+        loadingOverlaySpinnerActiveColor: '#e0e0e0',
+        loadingOverlaySpinnerColor: '#555555',
+    },
+    snap: {
+        indicatorFill: 'rgba(10, 132, 255, 0.35)',
+        indicatorStroke: '#0A84FF',
+        lineStroke: 'rgba(255, 255, 255, 0.35)',
+    },
+    fontSize: {
+        hoverBackgroundColor: '#3a3a3a',
+        selectedBackgroundColor: '#3a3a3a',
+        textColor: '#e0e0e0',
+    },
+    lineEndings: {
+        hoverBackgroundColor: '#3a3a3a',
+        labelColor: '#999999',
+        optionBackground: '#2a2a2a',
+        selectedBackgroundColor: '#3a3a3a',
+    },
+    masterDetail: {
+        backButtonColor: '#e0e0e0',
+        backgroundColor: '#2a2a2a',
+        detailBackgroundColor: '#2a2a2a',
+        detailFocusOutline: '2px solid #ffffff',
+        menuBackgroundColor: '#2a2a2a',
+        menuBorderRight: '1px solid #3a3a3a',
+        menuItemActiveBackgroundColor: 'hsl(0, 0%, 100%, 12%)',
+        menuItemBackgroundColor: 'transparent',
+        menuItemChevronColor: '#666666',
+        menuItemColor: '#e0e0e0',
+        menuItemDisabledColor: '#666666',
+        menuItemFocusOutline: '2px solid #ffffff',
+        menuItemHoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+        menuItemSelectedBackgroundColor: '#0A84FF',
+        menuItemSelectedColor: '#ffffff',
+        menuItemSelectedHoverBackgroundColor: '#0A84FF',
+    },
+    menu: {
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        boxShadow: '0 0 6px rgba(0, 0, 0, 0.3)',
+        itemButtonHoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+        itemChildOpenBackgroundColor: 'hsl(0, 0%, 100%, 6%)',
+        itemColor: '#e0e0e0',
+        itemEditingBackgroundColor: '#3a3a3a',
+        itemInputBorder: '1px solid #ffffff',
+        itemInputBorderColorOnSelected: '#ffffff',
+        itemInputCaretColor: '#e0e0e0',
+        itemInputCaretColorOnSelected: '#ffffff',
+        itemInputSelectionColor: '#b0b0b0',
+        itemInputSelectionColorOnSelected: 'rgba(255, 255, 255, 0.35)',
+        itemInputSelectionTextColor: '#ffffff',
+        itemInputSelectionTextColorOnSelected: '#ffffff',
+        itemOverlayBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+        itemSelectedBackgroundColor: '#0A84FF',
+        itemSelectedColor: '#ffffff',
+    },
+    moreMenu: {
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        borderRadius: '12px',
+        boxShadow: '0 0 6px rgba(0, 0, 0, 0.3)',
+        buttonActiveBackgroundColor: 'hsl(0, 0%, 100%, 12%)',
+        buttonColor: '#ffffff',
+        buttonHoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+        innerBorderRadius: '12px',
+    },
+    notificationCard: {
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        borderRadius: '12px',
+        boxShadow: '0 8px 20px rgba(0, 0, 0, 0.35)',
+        color: '#e0e0e0',
+        dismissButtonActiveBackgroundColor: 'hsl(0, 0%, 100%, 12%)',
+        dismissButtonBackgroundColor: 'transparent',
+        dismissButtonBorderRadius: '6px',
+        dismissButtonColor: '#c7c7c7',
+        dismissButtonHoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+        dismissButtonSize: '24px',
+        errorPillBackgroundColor: '#4d1f24',
+        errorPillColor: '#ff9aa2',
+        headerGap: '8px',
+        headerMarginBottom: '8px',
+        headerRightGap: '6px',
+        infoPillBackgroundColor: '#1f2f4a',
+        infoPillColor: '#8bb7ff',
+        maxWidth: '360px',
+        messageColor: 'inherit',
+        messageFontSize: '14px',
+        messageLineHeight: '1.45',
+        padding: '12px 14px',
+        pillBackgroundColor: '#1f2f4a',
+        pillBorderRadius: '999px',
+        pillColor: '#8bb7ff',
+        pillFontSize: '12px',
+        pillFontWeight: '600',
+        pillHeight: '22px',
+        pillPadding: '0 8px',
+        timestampColor: '#a0a0a0',
+        timestampFontSize: '12px',
+        warningPillBackgroundColor: '#4a341f',
+        warningPillColor: '#ffd29a',
+    },
+    numericInput: {
+        borderColor: '#4a4a4a',
+        borderRadius: '6px',
+        focusBorderColor: '#ffffff',
+        hoverBorderColor: '#5a5a5a',
+        inputBackground: '#1a1a1a',
+        labelColor: '#999999',
+        selectionBackground: '#0A84FF',
+        selectionColor: '#ffffff',
+        spinnerActiveBackground: 'hsl(0, 0%, 100%, 12%)',
+        spinnerBackground: 'transparent',
+        spinnerBorderRadius: '5px',
+        spinnerColor: '#e0e0e0',
+        spinnerHoverBackground: 'hsl(0, 0%, 100%, 8%)',
+        textColor: '#e0e0e0',
+    },
+    opacitySlider: {
+        activeColor: '#0A84FF',
+        thumbBorderColor: '#0A84FF',
+        thumbColor: '#ffffff',
+        trackColor: '#4a4a4a',
+    },
+    settings: {
+        contentHeadingColor: '#ffffff',
+        contentTextColor: '#e0e0e0',
+        descriptionColor: '#999999',
+        labelColor: '#e0e0e0',
+        shortcutItemBg: '#3a3a3a',
+        shortcutKeyBg: '#2a2a2a',
+        shortcutKeyBorder: '#4a4a4a',
+        shortcutKeyColor: '#e0e0e0',
+    },
+    shapeFill: {
+        hoverBackgroundColor: '#3a3a3a',
+        optionBackground: '#2a2a2a',
+        selectedBackgroundColor: '#3a3a3a',
+    },
+    shareDialog: {
+        labelColor: '#e0e0e0',
+        descriptionColor: '#e0e0e0',
+        inputBackground: '#1a1a1a',
+        inputBorderColor: '#4a4a4a',
+        inputTextColor: '#e0e0e0',
+        selectionColor: '#0A84FF',
+        copyButtonBackground: '#2a2a2a',
+        copyButtonColor: '#e0e0e0',
+        copyButtonHoverBackground: '#3a3a3a',
+        copyButtonHoverColor: '#ffffff',
+        copySuccessBackground: '#28a745',
+        copySuccessColor: '#ffffff',
+    },
+    slideToggle: {
+        thumbColor: '#ffffff',
+        trackCheckedColor: '#0A84FF',
+        trackColor: '#4a4a4a',
+        transitionDuration: '0.2s',
+    },
+    splitButton: {
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        boxShadow: '0 0 6px rgba(0, 0, 0, 0.3)',
+        color: '#ffffff',
+        dividerBackgroundColor: '#3a3a3a',
+        hoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+    },
+    strokeSize: {
+        hoverBackgroundColor: '#3a3a3a',
+        selectedBackgroundColor: '#3a3a3a',
+    },
+    tooltip: {
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        boxShadow: '0 1px 8px rgba(0, 0, 0, 0.4)',
+        color: '#ffffff',
+    },
+    utilityPanel: {
+        backgroundColor: '#3a3a3a',
+        buttonColor: '#e0e0e0',
+        buttonHoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+        separatorColor: 'hsl(0, 0%, 100%, 12%)',
+    },
+    watermark: {
+        background: 'rgba(40, 40, 40, 0.6)',
+        boxShadow: '0 1px 2px rgba(0, 0, 0, 0.35)',
+        color: 'rgba(220, 220, 220, 0.8)',
+    },
+    zoomPanel: {
+        backgroundColor: '#2a2a2a',
+        border: '1px solid #3a3a3a',
+        borderRadius: '12px',
+        boxShadow: '0 0 3px rgba(0, 0, 0, 0.4)',
+        buttonActiveBackgroundColor: 'hsl(0, 0%, 100%, 12%)',
+        buttonBorderRadius: '8px',
+        buttonHoverBackgroundColor: 'hsl(0, 0%, 100%, 8%)',
+        buttonSize: '32px',
+        gap: '4px',
+        iconColor: '#e0e0e0',
+        padding: '4px',
+    },
+};
+
+class ThemeHelper {
+    /**
+     * Converts a camelCase string to kebab-case.
+     * @example ThemeHelper.camelToKebab('controlHoverBackgroundColor') → 'control-hover-background-color'
+     * @example ThemeHelper.camelToKebab('backgroundColor') → 'background-color'
+     * @example ThemeHelper.camelToKebab('gap') → 'gap'
+     */
+    static camelToKebab(str) {
+        return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+    }
+    /**
+     * Recursively flattens a theme object into a map of CSS variable names to values.
+     * Skips the 'name' property at the root level since it's the theme identifier, not a CSS value.
+     *
+     * @param theme - The theme object to flatten
+     * @param prefix - The CSS variable prefix (default: '--kritzel')
+     * @returns A Map of CSS variable names to their values
+     *
+     * @example
+     * ThemeHelper.flattenThemeToVariables(lightTheme)
+     * // Returns Map {
+     * //   '--kritzel-global-pointer-cursor' => 'pointer',
+     * //   '--kritzel-controls-gap' => '8px',
+     * //   ...
+     * // }
+     */
+    static flattenThemeToVariables(theme, prefix = '--kritzel') {
+        const variables = new Map();
+        const recurse = (obj, currentPrefix, isRoot = false) => {
+            for (const [key, value] of Object.entries(obj)) {
+                // Skip the 'name' property at the root level
+                if (isRoot && key === 'name') {
+                    continue;
+                }
+                const kebabKey = ThemeHelper.camelToKebab(key);
+                const variableName = `${currentPrefix}-${kebabKey}`;
+                if (typeof value === 'object' && value !== null) {
+                    recurse(value, variableName);
+                }
+                else if (typeof value === 'string') {
+                    variables.set(variableName, value);
+                }
+            }
+        };
+        recurse(theme, prefix, true);
+        return variables;
+    }
+    /**
+     * Applies a map of CSS variables to an HTML element.
+     *
+     * @param element - The target HTML element
+     * @param variables - A Map of CSS variable names to values
+     */
+    static applyVariablesToElement(element, variables) {
+        for (const [name, value] of variables) {
+            element.style.setProperty(name, value);
+        }
+    }
+    /**
+     * Convenience method that flattens a theme and applies it to an element in one call.
+     *
+     * @param element - The target HTML element
+     * @param theme - The theme object to apply
+     */
+    static applyThemeToElement(element, theme) {
+        const variables = ThemeHelper.flattenThemeToVariables(theme);
+        ThemeHelper.applyVariablesToElement(element, variables);
+    }
+}
+
+/** Key used to store the settings object in localStorage. */
+const SETTINGS_STORAGE_KEY = 'kritzel-settings';
+/** Default theme used when no stored preference exists. */
+const DEFAULT_THEME = 'light';
+/**
+ * Manages theme state and application across the Kritzel editor.
+ * Reads the persisted theme from the settings object in localStorage but does not write to it.
+ * Persistence is handled exclusively by the KritzelSettings component.
+ *
+ * The theme manager is responsible for:
+ * - Reading the stored theme preference from the settings object
+ * - Applying CSS custom properties to target elements
+ * - Switching between light and dark themes at runtime
+ */
+class KritzelThemeManager {
+    _core;
+    _currentTheme = DEFAULT_THEME;
+    _targetElement = null;
+    _storageKey;
+    _themeRegistry = new Map();
+    /**
+     * Creates a new KritzelThemeManager instance.
+     * Initializes the current theme from the settings object in localStorage or uses the default theme.
+     *
+     * @param core - The KritzelCore instance this manager belongs to
+     */
+    constructor(core) {
+        this._core = core;
+        this._storageKey = core.editorId ? `${SETTINGS_STORAGE_KEY}-${core.editorId}` : SETTINGS_STORAGE_KEY;
+        this._themeRegistry.set('light', lightTheme);
+        this._themeRegistry.set('dark', darkTheme);
+        this._currentTheme = this.getStoredTheme();
+    }
+    /**
+     * Gets the current active theme name.
+     *
+     * @returns The name of the currently active theme ('light' or 'dark')
+     */
+    get currentTheme() {
+        return this._currentTheme;
+    }
+    /**
+     * Sets the target element where theme CSS variables will be applied.
+     * If an element is provided, the current theme is immediately applied to it.
+     *
+     * @param element - The HTML element to apply theme styles to, or null to clear
+     */
+    setTargetElement(element) {
+        this._targetElement = element;
+        if (this._targetElement) {
+            this.applyTheme(this._currentTheme);
+        }
+    }
+    /**
+     * Gets the current target element where theme CSS variables are applied.
+     *
+     * @returns The current target HTML element, or null if none is set
+     */
+    getTargetElement() {
+        return this._targetElement;
+    }
+    /**
+     * Gets the theme configuration object by its name.
+     * Falls back to the first registered theme if the requested name is not found.
+     *
+     * @param themeName - The name of the theme to retrieve
+     * @returns The KritzelTheme object containing all theme CSS variable values
+     */
+    getThemeByName(themeName) {
+        return this._themeRegistry.get(themeName) ?? this._themeRegistry.values().next().value;
+    }
+    /**
+     * Registers the provided themes to this theme manager instance.
+     *
+     * @param themes - The complete list of themes to make available
+     */
+    registerThemes(themes) {
+        if (themes.length === 0) {
+            console.warn('[KritzelThemeManager] registerThemes called with an empty array. The theme registry will be empty.');
+        }
+        this._themeRegistry.clear();
+        for (const theme of themes) {
+            this._themeRegistry.set(theme.name, theme);
+        }
+    }
+    /**
+     * Pre-emptively applies the stored theme's CSS variables to the closest editor or document.
+     * This prevents a "Flash of Unstyled Content" (FOUC) while Stencil web components are hydrating.
+     *
+     * @param element - The HTML element to apply the theme to
+     */
+    injectThemeEarly(element) {
+        let targetElement = element;
+        if (!targetElement && typeof document !== 'undefined') {
+            targetElement = document.documentElement;
+        }
+        if (!targetElement)
+            return;
+        const themeName = this.getStoredTheme();
+        const theme = this.getThemeByName(themeName);
+        ThemeHelper.applyThemeToElement(targetElement, theme);
+    }
+    /**
+     * Gets all registered themes.
+     *
+     * @returns An array of all registered theme objects
+     */
+    getAllThemes() {
+        return Array.from(this._themeRegistry.values());
+    }
+    /**
+     * Gets the stored theme name from the settings object in localStorage using this instance's namespaced key.
+     *
+     * @returns The stored theme name if valid, or 'light' as the default
+     */
+    getStoredTheme() {
+        if (typeof localStorage === 'undefined') {
+            return DEFAULT_THEME;
+        }
+        const stored = localStorage.getItem(this._storageKey);
+        if (!stored) {
+            return DEFAULT_THEME;
+        }
+        try {
+            const parsed = JSON.parse(stored);
+            if (typeof parsed?.theme === 'string') {
+                return parsed.theme;
+            }
+        }
+        catch {
+            // Invalid JSON, use default
+        }
+        return DEFAULT_THEME;
+    }
+    /**
+     * Gets the stored theme from the default (non-namespaced) settings object in localStorage.
+     * Used by static utility helpers that don't have access to a core instance.
+     *
+     * @returns The stored theme name if valid, or 'light' as the default
+     */
+    static getStoredTheme() {
+        if (typeof localStorage === 'undefined') {
+            return DEFAULT_THEME;
+        }
+        const stored = localStorage.getItem(SETTINGS_STORAGE_KEY);
+        if (!stored) {
+            return DEFAULT_THEME;
+        }
+        try {
+            const parsed = JSON.parse(stored);
+            if (typeof parsed?.theme === 'string') {
+                return parsed.theme;
+            }
+        }
+        catch {
+            // Invalid JSON, use default
+        }
+        return DEFAULT_THEME;
+    }
+    /**
+     * Sets the current theme and applies it to the target element.
+     * Does not persist the theme — persistence is handled by the KritzelSettings component.
+     *
+     * @param themeName - The theme name to set ('light' or 'dark')
+     */
+    setTheme(themeName) {
+        this._currentTheme = themeName;
+        if (this._targetElement) {
+            this.applyTheme(themeName);
+        }
+    }
+    /**
+     * Checks if the current theme is the dark theme.
+     *
+     * @returns True if the current theme is 'dark', false otherwise
+     */
+    isDarkTheme() {
+        return this._currentTheme === 'dark';
+    }
+    /**
+     * Applies a theme to the target element by setting CSS custom properties.
+     * Uses the ThemeHelper utility to automatically derive CSS variable names
+     * from the theme interface structure and apply them to the element's style.
+     * Does nothing if no target element is set.
+     *
+     * @param themeName - The name of the theme to apply ('light' or 'dark')
+     */
+    applyTheme(themeName) {
+        if (!this._targetElement) {
+            return;
+        }
+        const theme = this.getThemeByName(themeName);
+        ThemeHelper.applyThemeToElement(this._targetElement, theme);
+    }
+    /**
+     * Cleans up the theme manager state by clearing the target element reference.
+     * Should be called when the manager is no longer needed to prevent memory leaks.
+     */
+    cleanup() {
+        this._targetElement = null;
+    }
+}
+
+class KritzelColorHelper {
+    /**
+     * Resolves a color value based on the current theme.
+     * Handles both simple string colors and theme-aware color objects.
+     * @param color - The color to resolve (string or ThemeAwareColor)
+     * @param theme - Optional theme to use. If not provided, uses current theme from ThemeManager
+     * @returns The resolved hex color string, or empty string if color is undefined
+     */
+    static resolveThemeColor(color, theme) {
+        if (!color) {
+            return '';
+        }
+        const currentTheme = theme ?? KritzelThemeManager.getStoredTheme();
+        return resolveColor(color, currentTheme);
+    }
+    /**
+     * Applies opacity to a theme-aware color and returns an rgba string.
+     * @param color - The theme-aware color object or a hex color string
+     * @param opacity - The opacity value between 0 and 1
+     * @param theme - Optional theme to use. If not provided, uses current theme from ThemeManager
+     * @returns The color as an rgba string, or the resolved hex if opacity is 1
+     */
+    static applyOpacity(color, opacity, theme) {
+        const hexColor = typeof color === 'string' ? color : this.resolveThemeColor(color, theme);
+        if (!hexColor || opacity >= 1)
+            return hexColor;
+        const sanitizedHex = hexColor.startsWith('#') ? hexColor.slice(1) : hexColor;
+        let r, g, b;
+        if (sanitizedHex.length === 3) {
+            r = parseInt(sanitizedHex[0] + sanitizedHex[0], 16);
+            g = parseInt(sanitizedHex[1] + sanitizedHex[1], 16);
+            b = parseInt(sanitizedHex[2] + sanitizedHex[2], 16);
+        }
+        else if (sanitizedHex.length === 6) {
+            r = parseInt(sanitizedHex.substring(0, 2), 16);
+            g = parseInt(sanitizedHex.substring(2, 4), 16);
+            b = parseInt(sanitizedHex.substring(4, 6), 16);
+        }
+        else {
+            return hexColor;
+        }
+        if (isNaN(r) || isNaN(g) || isNaN(b)) {
+            return hexColor;
+        }
+        return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+    }
+    /**
+     * Determines the appropriate contrast color (black or white) based on the luminance of the given hex color.
+     * Uses the relative luminance formula: 0.299*R + 0.587*G + 0.114*B
+     * @param hexColor - The hex color string (with or without #)
+     * @returns '#000000' for light backgrounds, '#ffffff' for dark backgrounds
+     */
+    static getContrastColor(hexColor) {
+        const sanitizedHex = hexColor.startsWith('#') ? hexColor.slice(1) : hexColor;
+        let r, g, b;
+        if (sanitizedHex.length === 3) {
+            r = parseInt(sanitizedHex[0] + sanitizedHex[0], 16);
+            g = parseInt(sanitizedHex[1] + sanitizedHex[1], 16);
+            b = parseInt(sanitizedHex[2] + sanitizedHex[2], 16);
+        }
+        else if (sanitizedHex.length === 6) {
+            r = parseInt(sanitizedHex.substring(0, 2), 16);
+            g = parseInt(sanitizedHex.substring(2, 4), 16);
+            b = parseInt(sanitizedHex.substring(4, 6), 16);
+        }
+        else {
+            // Default to black for invalid colors
+            return '#000000';
+        }
+        if (isNaN(r) || isNaN(g) || isNaN(b)) {
+            return '#000000';
+        }
+        // Calculate relative luminance
+        const luminance = 0.299 * r + 0.587 * g + 0.114 * b;
+        // Use threshold of 150 (midpoint) for balanced contrast
+        return luminance > 150 ? '#000000' : '#ffffff';
+    }
+    /**
+     * Determines the appropriate text color for both light and dark themes based on the fill color.
+     * Returns default theme-appropriate colors if the fill is transparent.
+     * @param fillColor - The theme-aware fill color
+     * @returns A theme-aware color object with appropriate text colors for both themes
+     */
+    static determineTextColor(fillColor) {
+        // Check if fillColor is transparent for both themes
+        const isTransparentLight = fillColor.light === 'transparent';
+        const isTransparentDark = fillColor.dark === 'transparent';
+        if (isTransparentLight && isTransparentDark) {
+            // Return default theme-appropriate colors for transparent fills
+            return { light: '#000000', dark: '#ffffff' };
+        }
+        // Determine text color for each theme based on fill brightness
+        const lightThemeTextColor = isTransparentLight
+            ? '#000000'
+            : this.getContrastColor(fillColor.light);
+        const darkThemeTextColor = isTransparentDark
+            ? '#ffffff'
+            : this.getContrastColor(fillColor.dark);
+        return {
+            light: lightThemeTextColor,
+            dark: darkThemeTextColor,
+        };
+    }
+}
+
+export { DEFAULT_COLOR_PALETTE as D, KritzelThemeManager as K, ThemeHelper as T, KritzelColorHelper as a, darkTheme as d, lightTheme as l };