kritzel-stencil 0.0.77 → 0.0.78

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.
Files changed (76) hide show
  1. package/dist/cjs/index-BUKRdCPx.js +2 -6
  2. package/dist/cjs/{kritzel-brush-style_18.cjs.entry.js → kritzel-brush-style_19.cjs.entry.js} +36 -21
  3. package/dist/cjs/kritzel-brush-style_19.cjs.entry.js.map +1 -0
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/stencil.cjs.js +1 -1
  6. package/dist/collection/components/core/kritzel-editor/kritzel-editor.css +17 -1
  7. package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +3 -1
  8. package/dist/collection/components/core/kritzel-editor/kritzel-editor.js.map +1 -1
  9. package/dist/collection/components/shared/kritzel-color/kritzel-color.js +2 -2
  10. package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.js +1 -1
  11. package/dist/collection/components/shared/kritzel-font/kritzel-font.js +1 -1
  12. package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.js +1 -1
  13. package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.js +1 -1
  14. package/dist/collection/components/shared/kritzel-tooltip/kritzel-tooltip.js +4 -4
  15. package/dist/collection/components/ui/kritzel-control-brush-config/kritzel-control-brush-config.js +2 -2
  16. package/dist/collection/components/ui/kritzel-control-text-config/kritzel-control-text-config.js +2 -2
  17. package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js +2 -2
  18. package/dist/collection/components/ui/kritzel-dummy/kritzel-dummy.js +1 -1
  19. package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.js +1 -1
  20. package/dist/components/kritzel-color-palette.js +1 -1
  21. package/dist/components/kritzel-color.js +1 -1
  22. package/dist/components/kritzel-control-brush-config.js +1 -1
  23. package/dist/components/kritzel-control-text-config.js +1 -1
  24. package/dist/components/kritzel-controls.js +1 -1
  25. package/dist/components/kritzel-dummy.js +1 -28
  26. package/dist/components/kritzel-dummy.js.map +1 -1
  27. package/dist/components/kritzel-editor.js +33 -25
  28. package/dist/components/kritzel-editor.js.map +1 -1
  29. package/dist/components/kritzel-font-size.js +1 -1
  30. package/dist/components/kritzel-font.js +1 -1
  31. package/dist/components/kritzel-stroke-size.js +1 -1
  32. package/dist/components/kritzel-tooltip.js +1 -1
  33. package/dist/components/kritzel-utility-panel.js +1 -1
  34. package/dist/components/p-9_JiL_wH.js +33 -0
  35. package/dist/components/p-9_JiL_wH.js.map +1 -0
  36. package/dist/components/{p-Dd-jVt1z.js → p-B17z0dHf.js} +4 -4
  37. package/dist/components/{p-Dd-jVt1z.js.map → p-B17z0dHf.js.map} +1 -1
  38. package/dist/components/{p-CtzUAFH7.js → p-BfOHORuS.js} +8 -8
  39. package/dist/components/{p-CtzUAFH7.js.map → p-BfOHORuS.js.map} +1 -1
  40. package/dist/components/{p-CW800wxH.js → p-BzT7WSFX.js} +7 -7
  41. package/dist/components/{p-CW800wxH.js.map → p-BzT7WSFX.js.map} +1 -1
  42. package/dist/components/{p-RyhiTey9.js → p-C25_uk1W.js} +4 -4
  43. package/dist/components/{p-RyhiTey9.js.map → p-C25_uk1W.js.map} +1 -1
  44. package/dist/components/{p-ub68lkC1.js → p-CCcFfkWG.js} +3 -3
  45. package/dist/components/{p-ub68lkC1.js.map → p-CCcFfkWG.js.map} +1 -1
  46. package/dist/components/{p-D4WPb8MT.js → p-Clp62syd.js} +4 -4
  47. package/dist/components/{p-D4WPb8MT.js.map → p-Clp62syd.js.map} +1 -1
  48. package/dist/components/{p-BrDtPpFQ.js → p-CmwVLwvI.js} +13 -13
  49. package/dist/components/{p-BrDtPpFQ.js.map → p-CmwVLwvI.js.map} +1 -1
  50. package/dist/components/{p-DkKI-ulw.js → p-DBL15JoO.js} +3 -3
  51. package/dist/components/{p-DkKI-ulw.js.map → p-DBL15JoO.js.map} +1 -1
  52. package/dist/components/{p-CwiXaI-9.js → p-DqnnZDDT.js} +4 -4
  53. package/dist/components/{p-CwiXaI-9.js.map → p-DqnnZDDT.js.map} +1 -1
  54. package/dist/components/{p-Vgp7wvdA.js → p-rxaqUiJC.js} +6 -6
  55. package/dist/components/{p-Vgp7wvdA.js.map → p-rxaqUiJC.js.map} +1 -1
  56. package/dist/esm/index-CvjcGi0O.js +2 -6
  57. package/dist/esm/{kritzel-brush-style_18.entry.js → kritzel-brush-style_19.entry.js} +36 -22
  58. package/dist/esm/kritzel-brush-style_19.entry.js.map +1 -0
  59. package/dist/esm/loader.js +1 -1
  60. package/dist/esm/stencil.js +1 -1
  61. package/dist/stencil/p-400de083.entry.js +2 -0
  62. package/dist/stencil/p-400de083.entry.js.map +1 -0
  63. package/dist/stencil/stencil.esm.js +1 -1
  64. package/package.json +1 -1
  65. package/dist/cjs/kritzel-brush-style_18.cjs.entry.js.map +0 -1
  66. package/dist/cjs/kritzel-dummy.cjs.entry.js +0 -20
  67. package/dist/cjs/kritzel-dummy.cjs.entry.js.map +0 -1
  68. package/dist/cjs/kritzel-dummy.entry.cjs.js.map +0 -1
  69. package/dist/esm/kritzel-brush-style_18.entry.js.map +0 -1
  70. package/dist/esm/kritzel-dummy.entry.js +0 -18
  71. package/dist/esm/kritzel-dummy.entry.js.map +0 -1
  72. package/dist/stencil/kritzel-dummy.entry.esm.js.map +0 -1
  73. package/dist/stencil/p-37925d25.entry.js +0 -2
  74. package/dist/stencil/p-37925d25.entry.js.map +0 -1
  75. package/dist/stencil/p-529e82a7.entry.js +0 -2
  76. package/dist/stencil/p-529e82a7.entry.js.map +0 -1
@@ -90,14 +90,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
90
90
  }
91
91
  switch(bundleId) {
92
92
 
93
- case 'kritzel-dummy.cjs':
93
+ case 'kritzel-brush-style_19.cjs':
94
94
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
95
95
  /* webpackMode: "lazy" */
96
- './kritzel-dummy.cjs.entry.js')); }).then(processMod, consoleError);
97
- case 'kritzel-brush-style_18.cjs':
98
- return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
99
- /* webpackMode: "lazy" */
100
- './kritzel-brush-style_18.cjs.entry.js')); }).then(processMod, consoleError);
96
+ './kritzel-brush-style_19.cjs.entry.js')); }).then(processMod, consoleError);
101
97
  }
102
98
  }
103
99
  return (function (t) { return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(t)); }); })(
@@ -60,13 +60,13 @@ const KritzelColor = class {
60
60
  }
61
61
  render() {
62
62
  const isColorVeryLight = this.isLightColor(this.value);
63
- return (index.h(index.Host, { key: 'e913815994a30d97f92781e742c4a13de19e59fe' }, index.h("div", { key: 'e0cc40b10dcb298f5b86be7d4283d6bffbd08c2c', class: "checkerboard-bg", style: {
63
+ return (index.h(index.Host, { key: '6771c3aac90292a82070af08b995fdf297061bc1' }, index.h("div", { key: '4bb3e10fee1566db56f8a727dc858351e8a4184f', class: "checkerboard-bg", style: {
64
64
  width: `${this.size}px`,
65
65
  height: `${this.size}px`,
66
66
  borderRadius: '50%',
67
67
  display: 'inline-block',
68
68
  position: 'relative',
69
- } }, index.h("div", { key: '5e0a092a6d3463d852a1760d125fba04494e0d90', class: {
69
+ } }, index.h("div", { key: '290f49b17b686482057d3492752217e35af85d81', class: {
70
70
  'color-circle': true,
71
71
  'white': isColorVeryLight,
72
72
  }, style: {
@@ -108,7 +108,7 @@ const KritzelColorPalette = class {
108
108
  render() {
109
109
  const displayedColors = this.isExpanded ? this.colors : this.colors.slice(0, 6);
110
110
  const expandedHeight = this.isExpanded ? this.calculateHeight() : '32px';
111
- return (index.h(index.Host, { key: '0f0d176e1c8b199a973dbdb23b84e4a8d4d57f59' }, index.h("div", { key: '1d4707cdb30752d21a5058dbbef5fb32934bd3bd', class: {
111
+ return (index.h(index.Host, { key: 'e3e89140f833e336a3e0c299c1e9c9d4cad21fdb' }, index.h("div", { key: '019b62ab59cf468fc497ba0f6b429b844bcc4584', class: {
112
112
  'color-grid': true,
113
113
  'expanded': this.isExpanded,
114
114
  }, style: {
@@ -175,14 +175,14 @@ const KritzelControlBrushConfig = class {
175
175
  this.toolChange.emit(this.tool);
176
176
  }
177
177
  render() {
178
- return (index.h(index.Host, { key: '1658cc6062f9a62c11a7011e36bd5f892653f691' }, index.h("div", { key: 'bfafd20ebc6f7541e6a0952b555e3aefd0524086', style: {
178
+ return (index.h(index.Host, { key: '57c18e06633951d2d82006d5b28cf863e9414bf4' }, index.h("div", { key: '6e4666f8efb3f1c9f1b1c8362119d2eababcc314', style: {
179
179
  display: 'flex',
180
180
  flexDirection: 'row',
181
181
  alignItems: 'center',
182
182
  justifyContent: 'flex-start',
183
183
  width: '100%',
184
184
  gap: '8px',
185
- } }, index.h("kritzel-brush-style", { key: '6530b0fbee10db66f6dfd0e482e2a95279f303eb', type: this.tool.type, onTypeChange: event => this.handleTypeChange(event) }), index.h("button", { key: 'f16a4c5aefb298228d29576d6bf8a0632301169d', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand', style: this.palette.length > 6 ? { visibillity: 'visible' } : { visibility: 'hidden' } }, index.h("kritzel-icon", { key: '138726189ee12b0d15dedfdbd07019701712ea3b', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), index.h("kritzel-color-palette", { key: 'ca15a07a28ad955d49289299265e1b62da508cfd', colors: this.palette, selectedColor: this.tool.color, isExpanded: this.isExpanded, isOpaque: true, onColorChange: color => this.handleColorChange(color) }), index.h("kritzel-stroke-size", { key: '1017df7a36bad69af055fe08e685a1be3ff48b4b', selectedSize: this.tool.size, onSizeChange: event => this.handleSizeChange(event) })));
185
+ } }, index.h("kritzel-brush-style", { key: 'b52b7f8d0a64c0f973fbfbf35aad04c4b17b2b57', type: this.tool.type, onTypeChange: event => this.handleTypeChange(event) }), index.h("button", { key: 'e74f649d44e94e45668aa335935e4c3e05888a85', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand', style: this.palette.length > 6 ? { visibillity: 'visible' } : { visibility: 'hidden' } }, index.h("kritzel-icon", { key: '457c7b47b45ac62e696e69459b9674d8679e6736', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), index.h("kritzel-color-palette", { key: '3914791059ff9215c082315a4c52170b88cb0908', colors: this.palette, selectedColor: this.tool.color, isExpanded: this.isExpanded, isOpaque: true, onColorChange: color => this.handleColorChange(color) }), index.h("kritzel-stroke-size", { key: '51e8a2080cf27e08b060f099ed4696b352e3d10c', selectedSize: this.tool.size, onSizeChange: event => this.handleSizeChange(event) })));
186
186
  }
187
187
  static get watchers() { return {
188
188
  "tool": ["handleToolChange"]
@@ -214,14 +214,14 @@ const KritzelControlTextConfig = class {
214
214
  this.toolChange.emit(this.tool);
215
215
  }
216
216
  render() {
217
- return (index.h(index.Host, { key: '27d47c47987fb7644313a4face4a7023dfbe454d' }, index.h("div", { key: '835b8072267da18b39a5c02a6c989e1f7b81e9a5', style: {
217
+ return (index.h(index.Host, { key: 'dd94cc7171046d9683c5e320a2fef2c5598d6e2a' }, index.h("div", { key: 'c19e1cddc78ffa51e1117db01edc83e89db51158', style: {
218
218
  display: 'flex',
219
219
  flexDirection: 'row',
220
220
  alignItems: 'center',
221
221
  justifyContent: 'flex-start',
222
222
  width: '100%',
223
223
  gap: '8px',
224
- } }, index.h("kritzel-font-family", { key: 'b7a0bde2e9cf53c9ae7c3a32b424825ca9f757c4', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), index.h("button", { key: '41aba583656195c4825a15ddc12c5e1efed0d8d2', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand' }, index.h("kritzel-icon", { key: '5ff979420066703b5d5e886d12f89687392006e3', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), index.h("kritzel-color-palette", { key: '30fbcc05f80b15fba7f1f5ac6413732d0149ee9b', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), index.h("kritzel-font-size", { key: '2a0d3c4578316b37bc1a25b6e065ecf565eca2b3', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
224
+ } }, index.h("kritzel-font-family", { key: '17dc46439b2e578da30a04551dfa5a47e0fd6328', selectedFontFamily: this.tool.fontFamily, onFontFamilyChange: event => this.handleFamilyChange(event) }), index.h("button", { key: '412b5b812c63d9c067ae43042a457185b8e6af48', class: "expand-toggle", onClick: () => this.handleToggleExpand(), title: this.isExpanded ? 'Collapse' : 'Expand' }, index.h("kritzel-icon", { key: '6b9d098076145e4bb7b500f782baf9df713b666a', name: this.isExpanded ? 'chevron-up' : 'chevron-down' }))), index.h("kritzel-color-palette", { key: '6f58506e220ec54c1c934e38e65bc30d52bfb406', colors: this.tool.palette, selectedColor: this.tool.fontColor, isExpanded: this.isExpanded, onColorChange: event => this.handleColorChange(event) }), index.h("kritzel-font-size", { key: '2d595ab0d6abb342503ad00e439efa577e3f1f49', selectedSize: this.tool.fontSize, fontFamily: this.tool.fontFamily, onSizeChange: event => this.handleSizeChange(event) })));
225
225
  }
226
226
  };
227
227
  KritzelControlTextConfig.style = kritzelControlTextConfigCss;
@@ -3134,11 +3134,11 @@ const KritzelControls = class {
3134
3134
  render() {
3135
3135
  var _a, _b;
3136
3136
  const hasNoConfig = ((_a = this.activeControl) === null || _a === void 0 ? void 0 : _a.config) === undefined || ((_b = this.activeControl) === null || _b === void 0 ? void 0 : _b.config) === null;
3137
- return (index.h(index.Host, { key: '843ec6f6887dc821fe5de4373fa074320973750f' }, index.h("kritzel-utility-panel", { key: '80da8761a8d0fd9df9ddbc65f935a631e834f33a', style: {
3137
+ return (index.h(index.Host, { key: 'b2ccafa0e74d1a036f1bfd0fb994bd5aa746401d' }, index.h("kritzel-utility-panel", { key: '585a8058b22015956b11df13614e8acf721be969', style: {
3138
3138
  position: 'absolute',
3139
3139
  bottom: '56px',
3140
3140
  left: '12px',
3141
- }, onUndo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.undo(); }, onRedo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.redo(); }, onDelete: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.delete(); } }), index.h("div", { key: 'fdb54d5e8098a738bf8f8391ee683b3615ec5530', class: "kritzel-controls" }, this.controls.map(control => {
3141
+ }, onUndo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.undo(); }, onRedo: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.redo(); }, onDelete: () => { var _a; return (_a = this.kritzelEngine) === null || _a === void 0 ? void 0 : _a.delete(); } }), index.h("div", { key: '56238089b382ba65f6951ee841bdb1cd36159b31', class: "kritzel-controls" }, this.controls.map(control => {
3142
3142
  var _a, _b, _c, _d, _e, _f, _g, _h;
3143
3143
  if (control.type === 'tool') {
3144
3144
  return (index.h("button", { class: {
@@ -3354,6 +3354,18 @@ const KritzelDropdown = class {
3354
3354
  };
3355
3355
  KritzelDropdown.style = kritzelDropdownCss;
3356
3356
 
3357
+ const kritzelDummyCss = ":host{display:block}";
3358
+
3359
+ const KritzelDummy = class {
3360
+ constructor(hostRef) {
3361
+ index.registerInstance(this, hostRef);
3362
+ }
3363
+ render() {
3364
+ return (index.h(index.Host, { key: 'aff3d5d844af503ead3cd02a1a62f26c885587ef' }, "Dummy Component Works!"));
3365
+ }
3366
+ };
3367
+ KritzelDummy.style = kritzelDummyCss;
3368
+
3357
3369
  class KritzelIconRegistry {
3358
3370
  static register(name, svgContent) {
3359
3371
  if (this.registry.has(name)) {
@@ -4793,7 +4805,7 @@ const DEFAULT_KRITZEL_CONTROLS = [
4793
4805
  },
4794
4806
  ];
4795
4807
 
4796
- const kritzelEditorCss = ":host{display:flex;margin:0;position:relative;overflow:hidden;width:100%;height:100%;align-items:center;justify-content:center;touch-action:manipulation;user-select:none;--kritzel-primary-color:blue;--kritzel-selection-box-background-color:rgba(0, 0, 255, 0.2);--kritzel-selection-box-border-color:rgba(0, 0, 255, 0.5);--kritzel-selection-border-color:var(--kritzel-primary-color);--kritzel-selection-border-width:2px;--kritzel-selection-border-style:solid;--kritzel-selection-handle-size:6px;--kritzel-selection-handle-color:#000000;--kritzel-context-menu-background-color:#ffffff;--kritzel-context-menu-border-radius:8px;--kritzel-context-menu-box-shadow:0 1px 6px rgba(0, 0, 0, 0.12);--kritzel-context-menu-border:1px solid hsl(0, 0%, 0%, 4.3%);--kritzel-context-menu-padding:4px;--kritzel-context-menu-item-gap:8px;--kritzel-context-menu-item-padding:8px;--kritzel-context-menu-item-border-radius:8px;--kritzel-context-menu-item-color:#333333;--kritzel-context-menu-item-font-size:14px;--kritzel-context-menu-item-hover-background-color:hsl(0, 0%, 0%, 4.3%);--kritzel-context-menu-item-active-background-color:hsl(0, 0%, 0%, 8.6%);--kritzel-context-menu-item-disabled-color:#aaaaaa;--kritzel-controls-box-shadow:0 0 3px rgba(0, 0, 0, 0.08);--kritzel-controls-border:1px solid hsl(0, 0%, 0%, 4.3%);--kritzel-controls-border-radius:8px;--kritzel-controls-background-color:#ffffff;--kritzel-controls-padding:8px;--kritzel-controls-gap:8px;--kritzel-controls-control-color:#000;--kritzel-controls-control-border-radius:8px;--kritzel-controls-control-padding:8px;--kritzel-controls-control-hover-background-color:hsl(0, 0%, 0%, 4.3%);--kritzel-controls-control-active-background-color:hsl(0, 0%, 0%, 8.6%);--kritzel-controls-control-selected-background-color:var(--kritzel-primary-color);--kritzel-controls-control-selected-color:#ffffff;--kritzel-controls-divider-width:1px;--kritzel-controls-divider-height:24px;--kritzel-controls-divider-background-color:hsl(0, 0%, 0%, 4.3%);--kritzel-controls-tooltip-background-color:#fff;--kritzel-controls-tooltip-color:#000;--kritzel-controls-tooltip-border-radius:8px;--kritzel-controls-tooltip-padding:8px;--kritzel-controls-tooltip-box-shadow:0 1px 6px rgba(0, 0, 0, 0.12);--kritzel-color-palette-hover-background-color:#f0f0f0;--kritzel-color-palette-circle-border-color:#dddcdc;--kritzel-color-palette-selected-border-color:var(--kritzel-primary-color);--kritzel-color-palette-selected-background-color:#f0f0f0;--kritzel-color-palette-expand-toggle-color:#666;--kritzel-color-palette-expand-toggle-hover-color:#333;--kritzel-stroke-size-hover-background-color:#f0f0f0;--kritzel-stroke-size-selected-border-color:var(--kritzel-primary-color);--kritzel-stroke-size-selected-background-color:#f0f0f0;--kritzel-stroke-size-circle-color:#000;--kritzel-cursor-trail-color:rgb(228, 228, 228);--kritzel-cursor-trail-opacity:0.6;--kritzel-engine-background-color:#ffffff}kritzel-controls{position:absolute;left:50%;transform:translateX(-50%);bottom:16px}";
4808
+ const kritzelEditorCss = ":host{display:flex;margin:0;position:relative;overflow:hidden;width:100%;height:100%;align-items:center;justify-content:center;touch-action:manipulation;user-select:none;--kritzel-primary-color:blue;--kritzel-selection-box-background-color:rgba(0, 0, 255, 0.2);--kritzel-selection-box-border-color:rgba(0, 0, 255, 0.5);--kritzel-selection-border-color:var(--kritzel-primary-color);--kritzel-selection-border-width:2px;--kritzel-selection-border-style:solid;--kritzel-selection-handle-size:6px;--kritzel-selection-handle-color:#000000;--kritzel-context-menu-background-color:#ffffff;--kritzel-context-menu-border-radius:8px;--kritzel-context-menu-box-shadow:0 1px 6px rgba(0, 0, 0, 0.12);--kritzel-context-menu-border:1px solid hsl(0, 0%, 0%, 4.3%);--kritzel-context-menu-padding:4px;--kritzel-context-menu-item-gap:8px;--kritzel-context-menu-item-padding:8px;--kritzel-context-menu-item-border-radius:8px;--kritzel-context-menu-item-color:#333333;--kritzel-context-menu-item-font-size:14px;--kritzel-context-menu-item-hover-background-color:hsl(0, 0%, 0%, 4.3%);--kritzel-context-menu-item-active-background-color:hsl(0, 0%, 0%, 8.6%);--kritzel-context-menu-item-disabled-color:#aaaaaa;--kritzel-controls-box-shadow:0 0 3px rgba(0, 0, 0, 0.08);--kritzel-controls-border:1px solid hsl(0, 0%, 0%, 4.3%);--kritzel-controls-border-radius:8px;--kritzel-controls-background-color:#ffffff;--kritzel-controls-padding:8px;--kritzel-controls-gap:8px;--kritzel-controls-control-color:#000;--kritzel-controls-control-border-radius:8px;--kritzel-controls-control-padding:8px;--kritzel-controls-control-hover-background-color:hsl(0, 0%, 0%, 4.3%);--kritzel-controls-control-active-background-color:hsl(0, 0%, 0%, 8.6%);--kritzel-controls-control-selected-background-color:var(--kritzel-primary-color);--kritzel-controls-control-selected-color:#ffffff;--kritzel-controls-divider-width:1px;--kritzel-controls-divider-height:24px;--kritzel-controls-divider-background-color:hsl(0, 0%, 0%, 4.3%);--kritzel-controls-tooltip-background-color:#fff;--kritzel-controls-tooltip-color:#000;--kritzel-controls-tooltip-border-radius:8px;--kritzel-controls-tooltip-padding:8px;--kritzel-controls-tooltip-box-shadow:0 1px 6px rgba(0, 0, 0, 0.12);--kritzel-color-palette-hover-background-color:#f0f0f0;--kritzel-color-palette-circle-border-color:#dddcdc;--kritzel-color-palette-selected-border-color:var(--kritzel-primary-color);--kritzel-color-palette-selected-background-color:#f0f0f0;--kritzel-color-palette-expand-toggle-color:#666;--kritzel-color-palette-expand-toggle-hover-color:#333;--kritzel-stroke-size-hover-background-color:#f0f0f0;--kritzel-stroke-size-selected-border-color:var(--kritzel-primary-color);--kritzel-stroke-size-selected-background-color:#f0f0f0;--kritzel-stroke-size-circle-color:#000;--kritzel-cursor-trail-color:rgb(228, 228, 228);--kritzel-cursor-trail-opacity:0.6;--kritzel-engine-background-color:#ffffff}.dummy-top{position:absolute;left:50%;transform:translateX(-50%);top:16px;z-index:1}.dummy-bottom{position:absolute;left:50%;transform:translateX(-50%);bottom:16px;z-index:1}kritzel-controls{position:absolute;left:50%;transform:translateX(-50%);bottom:16px}";
4797
4809
 
4798
4810
  const KritzelEditor = class {
4799
4811
  constructor(hostRef) {
@@ -4830,7 +4842,9 @@ const KritzelEditor = class {
4830
4842
  }
4831
4843
  }
4832
4844
  render() {
4833
- return (index.h(index.Host, { key: '37e291c25a636b65cc751799cfe57de216a14990' }, index.h("kritzel-engine", { key: '05dca9a3b7a0dd6e7d1eaffe76d08fdea79aabd3', onEngineReady: () => this.handleEngineReady() }), index.h("kritzel-controls", { key: 'c9910ea63798225605e4d8e292f78edb416eb4e7', controls: this.controls, onControlsReady: () => this.handleControlsReady(), style: this.hideControls ? { display: 'none' } : {} })));
4845
+ return (index.h(index.Host, { key: '37e291c25a636b65cc751799cfe57de216a14990' }, index.h("kritzel-dummy", { key: '5b3b3e9c6baf1885a85f749f674ca257fa9f109e', class: "dummy-top" }), index.h("kritzel-engine", { key: '11ec65ad0858d842c472b829667c1be7086d92b1', onEngineReady: () => this.handleEngineReady() }), index.h("kritzel-dummy", { key: 'c3e3586692f5f8340aa34cd8b04e7ac1fbd7401b', class: "dummy-bottom" }), index.h("kritzel-controls", { key: '3f999492eeabe6e3179027753138099d387aa541', controls: this.controls, onControlsReady: () => this.handleControlsReady(), style: {
4846
+ visibility: 'hidden'
4847
+ } })));
4834
4848
  }
4835
4849
  };
4836
4850
  KritzelEditor.style = kritzelEditorCss;
@@ -6079,7 +6093,7 @@ const KritzelFont = class {
6079
6093
  this.color = '#000000';
6080
6094
  }
6081
6095
  render() {
6082
- return (index.h(index.Host, { key: '6f25832892d8042464751360cc9e2307193f5407' }, index.h("div", { key: '3d2ec48a6a3b3e347c8cc1ab6f129bfacd984776', class: "font-preview", style: {
6096
+ return (index.h(index.Host, { key: '4e952fbcaea52c332a72cda1ba6fc060696aa107' }, index.h("div", { key: 'db371b9552eceb53470b2bbd964c9c31578bb7e1', class: "font-preview", style: {
6083
6097
  fontFamily: this.fontFamily,
6084
6098
  fontSize: `${this.size}px`,
6085
6099
  color: this.color
@@ -6144,7 +6158,7 @@ const KritzelFontSize = class {
6144
6158
  this.sizeChange.emit(size);
6145
6159
  }
6146
6160
  render() {
6147
- return (index.h(index.Host, { key: '20ad8f22858732c62838693c7b135dc92dbc5910' }, this.sizes.map(size => (index.h("div", { class: {
6161
+ return (index.h(index.Host, { key: '2cd69fb4d291f46121f2f05acd44153d4fe51801' }, this.sizes.map(size => (index.h("div", { class: {
6148
6162
  'size-container': true,
6149
6163
  'selected': this.selectedSize === size,
6150
6164
  }, onClick: () => this.handleSizeClick(size) }, index.h("kritzel-font", { fontFamily: this.fontFamily, size: size }))))));
@@ -6188,7 +6202,7 @@ const KritzelStrokeSize = class {
6188
6202
  this.sizeChange.emit(size);
6189
6203
  }
6190
6204
  render() {
6191
- return (index.h(index.Host, { key: '2e2a4d38920e25e1e60788deabe4912b510d0b10' }, this.sizes.map(size => (index.h("div", { class: {
6205
+ return (index.h(index.Host, { key: '9738591d397c522c72d9744bbb7e0ff7f6976175' }, this.sizes.map(size => (index.h("div", { class: {
6192
6206
  'size-container': true,
6193
6207
  'selected': this.selectedSize === size,
6194
6208
  }, onClick: () => this.handleSizeClick(size) }, index.h("kritzel-color", { value: '#000000', size: size }))))));
@@ -6237,23 +6251,23 @@ const KritzelTooltip = class {
6237
6251
  }
6238
6252
  }
6239
6253
  render() {
6240
- return (index.h(index.Host, { key: '30db4852719464fcb9c6964c34992e87a364caa3', style: {
6254
+ return (index.h(index.Host, { key: 'a8c55d66efd76aeea390e7a5bdb05dbdb1e35bd2', style: {
6241
6255
  position: 'fixed',
6242
6256
  zIndex: '9999',
6243
6257
  transition: 'opacity 0.3s ease-in-out, transform 0.3s ease-in-out',
6244
6258
  visibility: this.isVisible ? 'visible' : 'hidden',
6245
6259
  left: !this.isMobileView ? `${this.positionX}px` : '50%',
6246
6260
  marginBottom: `${this.offsetY + this.arrowSize}px`,
6247
- } }, index.h("div", { key: '3f270c9bdb1a5282f67034618123a5d61f9f8b40', class: "tooltip-content", onClick: event => event.stopPropagation() }, index.h("slot", { key: 'bd4a11782eb2e263f21a8ab57ad64eb4fd4fe7ec' }), index.h("div", { key: '4ede173979b8e0335fb3a012b662a694dc09ea28', class: "tooltip-arrow-wrapper", style: {
6261
+ } }, index.h("div", { key: '5d3ad02c4885e9ee3dc55a7358357bb224ae102e', class: "tooltip-content", onClick: event => event.stopPropagation() }, index.h("slot", { key: '767fb0dbf8fa9a63d184f601d28536fbff677a02' }), index.h("div", { key: '30c0bdd69f56cab6b94fb0f4290de370d990c500', class: "tooltip-arrow-wrapper", style: {
6248
6262
  position: 'fixed',
6249
6263
  left: this.arrowOffset,
6250
6264
  bottom: `-${this.arrowSize * 2}px`,
6251
- } }, index.h("div", { key: '8bf67c5383b53ac908b1d0865cf2ffe9cadf3fd6', class: "tooltip-arrow", style: {
6265
+ } }, index.h("div", { key: '2d2197a52e69477308ae7591446b4ca20635e0bc', class: "tooltip-arrow", style: {
6252
6266
  borderLeft: `${this.arrowSize}px solid transparent`,
6253
6267
  borderRight: `${this.arrowSize}px solid transparent`,
6254
6268
  borderTop: `${this.arrowSize}px solid var(--kritzel-controls-tooltip-background-color)`,
6255
6269
  filter: 'drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2))',
6256
- } }), index.h("div", { key: '0991da16ce655de3f9a798b1da9ddb3e8e399487', class: "tooltip-arrow-rect", style: {
6270
+ } }), index.h("div", { key: 'fa932ba1b6b242455c85fbf13b51c58c53ad3e9a', class: "tooltip-arrow-rect", style: {
6257
6271
  position: 'relative',
6258
6272
  width: `${this.arrowSize * 2}px`,
6259
6273
  height: `${this.arrowSize}px`,
@@ -6287,7 +6301,7 @@ const KritzelUtilityPanel = class {
6287
6301
  this.redo.emit();
6288
6302
  }
6289
6303
  render() {
6290
- return (index.h(index.Host, { key: 'f381fac2cb032ca19c6945ef4f39673ea0bd0cc5' }, index.h("button", { key: '1f7200672970baf1d0cfcaa116fa3f8f9a39832a', class: "utility-button", onClick: event => this.handleUndo(event) }, index.h("kritzel-icon", { key: '755d9201d80d8db086f07b38e90a01a06e980b50', name: "undo" })), index.h("button", { key: '06e4d5c2956f23245c3d48f21c15d54e8bef8119', class: "utility-button", onClick: event => this.handleRedo(event) }, index.h("kritzel-icon", { key: '13eb6b31c45b67ac399fc7c84b941ddce04c5c86', name: "redo" })), index.h("div", { key: '7f03a576a37649db679b93604c2654d29cc81da4', class: "utility-separator" }), index.h("button", { key: '0c40613e9f6a049cec872d71e9f948d685ec1dbe', class: "utility-button" }, index.h("kritzel-icon", { key: '8cba73bcb02ef8b7c182ba2fd16d98d6855f1c1b', name: "delete", onClick: () => this.delete.emit() }))));
6304
+ return (index.h(index.Host, { key: '41a059b44da75d93169ad9c3ab9e7094a178ce6a' }, index.h("button", { key: 'cb6ce47be3b7b8efa863658b45339c084c006558', class: "utility-button", onClick: event => this.handleUndo(event) }, index.h("kritzel-icon", { key: '2cd0e214a354603a0b6d3c5a20414e5592b57c72', name: "undo" })), index.h("button", { key: '3a2c931d270d1173603722eb6f0be7450905225d', class: "utility-button", onClick: event => this.handleRedo(event) }, index.h("kritzel-icon", { key: '647ee8f80f8ee7991278ae09c824c2d41939b799', name: "redo" })), index.h("div", { key: 'cc8aab4de10a3c7997e8b65682fa5fed4a0e9ee7', class: "utility-separator" }), index.h("button", { key: '8e1f513af08407fafc4d2cfe48dc781120942ebd', class: "utility-button" }, index.h("kritzel-icon", { key: '4758c3bdcbb2a273424982ce4c1a05575199c130', name: "delete", onClick: () => this.delete.emit() }))));
6291
6305
  }
6292
6306
  };
6293
6307
  KritzelUtilityPanel.style = kritzelUtilityPanelCss;
@@ -6301,6 +6315,7 @@ exports.kritzel_control_text_config = KritzelControlTextConfig;
6301
6315
  exports.kritzel_controls = KritzelControls;
6302
6316
  exports.kritzel_cursor_trail = KritzelCursorTrail;
6303
6317
  exports.kritzel_dropdown = KritzelDropdown;
6318
+ exports.kritzel_dummy = KritzelDummy;
6304
6319
  exports.kritzel_editor = KritzelEditor;
6305
6320
  exports.kritzel_engine = KritzelEngine;
6306
6321
  exports.kritzel_font = KritzelFont;
@@ -6310,6 +6325,6 @@ exports.kritzel_icon = KritzelIcon;
6310
6325
  exports.kritzel_stroke_size = KritzelStrokeSize;
6311
6326
  exports.kritzel_tooltip = KritzelTooltip;
6312
6327
  exports.kritzel_utility_panel = KritzelUtilityPanel;
6313
- //# sourceMappingURL=kritzel-brush-style.kritzel-color.kritzel-color-palette.kritzel-context-menu.kritzel-control-brush-config.kritzel-control-text-config.kritzel-controls.kritzel-cursor-trail.kritzel-dropdown.kritzel-editor.kritzel-engine.kritzel-font.kritzel-font-family.kritzel-font-size.kritzel-icon.kritzel-stroke-size.kritzel-tooltip.kritzel-utility-panel.entry.cjs.js.map
6328
+ //# sourceMappingURL=kritzel-brush-style.kritzel-color.kritzel-color-palette.kritzel-context-menu.kritzel-control-brush-config.kritzel-control-text-config.kritzel-controls.kritzel-cursor-trail.kritzel-dropdown.kritzel-dummy.kritzel-editor.kritzel-engine.kritzel-font.kritzel-font-family.kritzel-font-size.kritzel-icon.kritzel-stroke-size.kritzel-tooltip.kritzel-utility-panel.entry.cjs.js.map
6314
6329
 
6315
- //# sourceMappingURL=kritzel-brush-style_18.cjs.entry.js.map
6330
+ //# sourceMappingURL=kritzel-brush-style_19.cjs.entry.js.map