@creaditor/web-starterkit 1.0.10 → 1.0.12

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 (84) hide show
  1. package/dist/1142.creaditor.bundle.js +1 -1
  2. package/dist/1142.creaditor.bundle.js.gz +0 -0
  3. package/dist/1260.creaditor.bundle.js +86 -42
  4. package/dist/1260.creaditor.bundle.js.gz +0 -0
  5. package/dist/1271.creaditor.bundle.js +1 -1
  6. package/dist/1271.creaditor.bundle.js.gz +0 -0
  7. package/dist/1334.creaditor.bundle.js +2 -2
  8. package/dist/1334.creaditor.bundle.js.gz +0 -0
  9. package/dist/170.creaditor.bundle.js +21 -20
  10. package/dist/170.creaditor.bundle.js.gz +0 -0
  11. package/dist/2234.creaditor.bundle.js +121 -1
  12. package/dist/2234.creaditor.bundle.js.gz +0 -0
  13. package/dist/2765.creaditor.bundle.js +1 -1
  14. package/dist/2765.creaditor.bundle.js.gz +0 -0
  15. package/dist/2956.creaditor.bundle.js +1 -1
  16. package/dist/2956.creaditor.bundle.js.gz +0 -0
  17. package/dist/3418.creaditor.bundle.js +1 -1
  18. package/dist/3418.creaditor.bundle.js.gz +0 -0
  19. package/dist/3778.creaditor.bundle.js +1 -0
  20. package/dist/3778.creaditor.bundle.js.gz +0 -0
  21. package/dist/3792.creaditor.bundle.js +1 -0
  22. package/dist/3792.creaditor.bundle.js.gz +0 -0
  23. package/dist/4061.creaditor.bundle.js +1 -1
  24. package/dist/4061.creaditor.bundle.js.gz +0 -0
  25. package/dist/4288.creaditor.bundle.js +10 -10
  26. package/dist/4288.creaditor.bundle.js.gz +0 -0
  27. package/dist/453.creaditor.bundle.js +11 -111
  28. package/dist/453.creaditor.bundle.js.LICENSE.txt +5 -0
  29. package/dist/453.creaditor.bundle.js.gz +0 -0
  30. package/dist/4569.creaditor.bundle.js +3 -3
  31. package/dist/4569.creaditor.bundle.js.gz +0 -0
  32. package/dist/4639.creaditor.bundle.js +1 -1
  33. package/dist/4639.creaditor.bundle.js.gz +0 -0
  34. package/dist/4739.creaditor.bundle.js +1 -1
  35. package/dist/4739.creaditor.bundle.js.gz +0 -0
  36. package/dist/4762.creaditor.bundle.js +3 -3
  37. package/dist/4762.creaditor.bundle.js.gz +0 -0
  38. package/dist/4770.creaditor.bundle.js +3 -3
  39. package/dist/4770.creaditor.bundle.js.gz +0 -0
  40. package/dist/4970.creaditor.bundle.js +1316 -0
  41. package/dist/4970.creaditor.bundle.js.gz +0 -0
  42. package/dist/5119.creaditor.bundle.js +34 -1
  43. package/dist/5119.creaditor.bundle.js.gz +0 -0
  44. package/dist/5340.creaditor.bundle.js +30 -29
  45. package/dist/5340.creaditor.bundle.js.gz +0 -0
  46. package/dist/5884.creaditor.bundle.js +91 -0
  47. package/dist/5884.creaditor.bundle.js.gz +0 -0
  48. package/dist/5926.creaditor.bundle.js +9 -5
  49. package/dist/5926.creaditor.bundle.js.gz +0 -0
  50. package/dist/6151.creaditor.bundle.js +1 -1
  51. package/dist/6151.creaditor.bundle.js.gz +0 -0
  52. package/dist/638.creaditor.bundle.js +49 -20
  53. package/dist/638.creaditor.bundle.js.gz +0 -0
  54. package/dist/6713.creaditor.bundle.js +1 -1
  55. package/dist/6713.creaditor.bundle.js.gz +0 -0
  56. package/dist/6814.creaditor.bundle.js +1 -1
  57. package/dist/6814.creaditor.bundle.js.gz +0 -0
  58. package/dist/7209.creaditor.bundle.js +98 -56
  59. package/dist/7209.creaditor.bundle.js.gz +0 -0
  60. package/dist/752.creaditor.bundle.js +4 -4
  61. package/dist/752.creaditor.bundle.js.gz +0 -0
  62. package/dist/7564.creaditor.bundle.js +1 -1
  63. package/dist/7564.creaditor.bundle.js.gz +0 -0
  64. package/dist/7937.creaditor.bundle.js +20 -17
  65. package/dist/7937.creaditor.bundle.js.gz +0 -0
  66. package/dist/8250.creaditor.bundle.js +1 -1
  67. package/dist/8250.creaditor.bundle.js.gz +0 -0
  68. package/dist/8646.creaditor.bundle.js +20 -24
  69. package/dist/8646.creaditor.bundle.js.gz +0 -0
  70. package/dist/8654.creaditor.bundle.js +7 -7
  71. package/dist/8654.creaditor.bundle.js.gz +0 -0
  72. package/dist/9041.creaditor.bundle.js +13 -15
  73. package/dist/9041.creaditor.bundle.js.gz +0 -0
  74. package/dist/9431.creaditor.bundle.js +1 -1
  75. package/dist/9431.creaditor.bundle.js.gz +0 -0
  76. package/dist/9694.creaditor.bundle.js +1 -1
  77. package/dist/9694.creaditor.bundle.js.gz +0 -0
  78. package/dist/9994.creaditor.bundle.js +114 -0
  79. package/dist/9994.creaditor.bundle.js.gz +0 -0
  80. package/dist/creaditor.bundle.js +968 -583
  81. package/dist/creaditor.bundle.js.gz +0 -0
  82. package/dist/service-worker.js +1 -1
  83. package/dist/service-worker.js.gz +0 -0
  84. package/package.json +1 -1
@@ -1,4 +1,4 @@
1
- "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[7937],{67937(t,e,n){n.r(e),n.d(e,{EditorTabItem:()=>c});var i=n(59929);class c extends i.WF{constructor(){super()}focus(){const t=this.shadowRoot.querySelector(".tab-btn");t?t.focus():super.focus()}onClickItem(t){this.value=t,this.dispatchEvent(new UIEvent("change",{view:window,bubbles:!0,cancelable:!0}))}handleKeyDown(t){if("Enter"===t.key||" "===t.key)return t.preventDefault(),t.stopPropagation(),void this.onClickItem(this.icon);["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(t.key)&&(t.preventDefault(),t.stopPropagation(),this.dispatchEvent(new CustomEvent("arrow-navigation",{detail:{key:t.key,currentIcon:this.icon},bubbles:!0,cancelable:!0})))}factory(){let t="fill:currentColor;color:inherit;width:18px;height:18px;";switch(this.icon){case"box-shadow":return n.e(1456).then(n.bind(n,11456)),i.qy`<cdtr-box-shadow-icon iconStyle=${t}></cdtr-box-shadow-icon>`;case"design":return n.e(9162).then(n.bind(n,59162)),i.qy`<cdtr-design-icon iconStyle=${t}></cdtr-design-icon>`;case"text":case"typography":return n.e(9089).then(n.bind(n,59089)),i.qy`<cdtr-text-icon iconStyle=${t}></cdtr-text-icon>`;case"animations":return n.e(9184).then(n.bind(n,29184)),i.qy`<cdtr-animation-icon iconStyle=${t}></cdtr-animation-icon>`;case"settings":return n.e(4114).then(n.bind(n,84114)),i.qy`<cdtr-setting-icon iconStyle=${t}></cdtr-setting-icon>`;case"qr":return i.qy`<img style="width:16px;height:16px;" alt="qr" width="16" height="16" src="https://img.creaditor.ai/images/qr?link=https%3A%2F%2Fexample.com&size=20" />`;case"link":return n.e(5428).then(n.bind(n,85428)),i.qy`<cdtr-link-icon iconStyle=${t}></cdtr-link-icon>`;case"spacing":return n.e(365).then(n.bind(n,50365)),i.qy`<cdtr-spacing-icon iconStyle=${t}></cdtr-spacing-icon>`;case"background":case"image":case"giphy":return n.e(1452).then(n.bind(n,61452)),i.qy`<cdtr-background-icon iconStyle=${t}></cdtr-background-icon>`;case"video":return n.e(7759).then(n.bind(n,97759)),i.qy`<cdtr-video-icon iconStyle=${t}></cdtr-video-icon>`;case"list-check":return n.e(6459).then(n.bind(n,16459)),i.qy`<cdtr-list-check-icon iconStyle=${t}></cdtr-list-check-icon>`;case"time":return n.e(307).then(n.bind(n,307)),i.qy`<cdtr-time-icon iconStyle=${t}></cdtr-time-icon>`;case"icons":return i.qy`<cdtr-icon icon="emoji" .width=${18} .height=${18} color="currentColor"></cdtr-icon>`;case"modal":return i.qy`<cdtr-icon icon="page" .width=${18} .height=${18} color="currentColor"></cdtr-icon>`;case"list-settings":return n.e(8676).then(n.bind(n,48676)),i.qy`<cdtr-list-settings-icon iconStyle=${t}></cdtr-list-settings-icon>`;case"automations":return n.e(8305).then(n.bind(n,58305)),i.qy`<cdtr-automation-icon iconStyle=${t}></cdtr-automation-icon>`;case"ai":return i.qy`<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 20.25 21" preserveAspectRatio="xMidYMid meet">
1
+ "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[7937],{67937(t,e,n){n.r(e),n.d(e,{EditorTabItem:()=>o});var i=n(59929);class o extends i.WF{constructor(){super()}focus(){const t=this.shadowRoot.querySelector(".tab-btn");t?t.focus():super.focus()}onClickItem(t){this.value=t,this.dispatchEvent(new UIEvent("change",{view:window,bubbles:!0,cancelable:!0}))}handleKeyDown(t){if("Enter"===t.key||" "===t.key)return t.preventDefault(),t.stopPropagation(),void this.onClickItem(this.icon);["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(t.key)&&(t.preventDefault(),t.stopPropagation(),this.dispatchEvent(new CustomEvent("arrow-navigation",{detail:{key:t.key,currentIcon:this.icon},bubbles:!0,cancelable:!0})))}factory(){let t="fill:currentColor;color:inherit;width:18px;height:18px;";switch(this.icon){case"box-shadow":return n.e(1456).then(n.bind(n,11456)),i.qy`<cdtr-box-shadow-icon iconStyle=${t}></cdtr-box-shadow-icon>`;case"design":case"style":return n.e(9162).then(n.bind(n,59162)),i.qy`<cdtr-design-icon iconStyle=${t}></cdtr-design-icon>`;case"text":case"typography":return n.e(9089).then(n.bind(n,59089)),i.qy`<cdtr-text-icon iconStyle=${t}></cdtr-text-icon>`;case"animations":return n.e(9184).then(n.bind(n,29184)),i.qy`<cdtr-animation-icon iconStyle=${t}></cdtr-animation-icon>`;case"settings":return n.e(4114).then(n.bind(n,84114)),i.qy`<cdtr-setting-icon iconStyle=${t}></cdtr-setting-icon>`;case"qr":return i.qy`<img style="width:16px;height:16px;" alt="qr" width="16" height="16" src="https://img.creaditor.ai/images/qr?link=https%3A%2F%2Fexample.com&size=20" />`;case"link":return n.e(5428).then(n.bind(n,85428)),i.qy`<cdtr-link-icon iconStyle=${t}></cdtr-link-icon>`;case"spacing":return n.e(365).then(n.bind(n,50365)),i.qy`<cdtr-spacing-icon iconStyle=${t}></cdtr-spacing-icon>`;case"background":case"image":case"giphy":return n.e(1452).then(n.bind(n,61452)),i.qy`<cdtr-background-icon iconStyle=${t}></cdtr-background-icon>`;case"video":return n.e(7759).then(n.bind(n,97759)),i.qy`<cdtr-video-icon iconStyle=${t}></cdtr-video-icon>`;case"list-check":return n.e(6459).then(n.bind(n,16459)),i.qy`<cdtr-list-check-icon iconStyle=${t}></cdtr-list-check-icon>`;case"time":return n.e(307).then(n.bind(n,307)),i.qy`<cdtr-time-icon iconStyle=${t}></cdtr-time-icon>`;case"icons":return i.qy`<cdtr-icon icon="emoji" .width=${18} .height=${18} color="currentColor"></cdtr-icon>`;case"business":return i.qy`<cdtr-icon icon="business" .width=${18} .height=${18} color="currentColor"></cdtr-icon>`;case"modal":return i.qy`<cdtr-icon icon="page" .width=${18} .height=${18} color="currentColor"></cdtr-icon>`;case"popup":return i.qy`<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM19 20V4H5V20H19ZM7 6H11V10H7V6ZM7 12H17V14H7V12ZM7 16H17V18H7V16ZM13 7H17V9H13V7Z"></path></svg>`;case"list-settings":return n.e(8676).then(n.bind(n,48676)),i.qy`<cdtr-list-settings-icon iconStyle=${t}></cdtr-list-settings-icon>`;case"automations":return n.e(8305).then(n.bind(n,58305)),i.qy`<cdtr-automation-icon iconStyle=${t}></cdtr-automation-icon>`;case"ai":return i.qy`<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 20.25 21" preserveAspectRatio="xMidYMid meet">
2
2
  <defs><clippath id="ai-clip"><path d="M 0 0.375 L 19.527344 0.375 L 19.527344 19.902344 L 0 19.902344 Z" clip-rule="nonzero"></path></clippath></defs>
3
3
  <g clip-path="url(#ai-clip)"><path fill="#9747ff" d="M 12.316406 0.679688 C 12.160156 0.382812 11.734375 0.382812 11.574219 0.679688 L 11.132812 1.507812 C 11.09375 1.582031 11.035156 1.640625 10.960938 1.679688 L 10.128906 2.117188 C 9.828125 2.277344 9.828125 2.699219 10.128906 2.855469 L 10.960938 3.296875 C 11.035156 3.335938 11.09375 3.394531 11.132812 3.46875 L 11.574219 4.296875 C 11.734375 4.59375 12.160156 4.59375 12.316406 4.296875 L 12.757812 3.46875 C 12.800781 3.394531 12.859375 3.335938 12.933594 3.296875 L 13.765625 2.855469 C 14.0625 2.699219 14.0625 2.277344 13.765625 2.117188 L 12.933594 1.679688 C 12.859375 1.640625 12.800781 1.582031 12.757812 1.507812 Z M 15.167969 16.96875 L 16.875 17.617188 L 16.226562 15.917969 Z M 16.882812 13.496094 L 5.136719 1.816406 C 4.15625 0.839844 2.558594 0.839844 1.574219 1.816406 L 0.984375 2.40625 C 0 3.382812 0 4.96875 0.984375 5.949219 L 12.730469 17.625 C 12.929688 17.824219 13.273438 18.039062 13.542969 18.140625 L 17.152344 19.507812 C 18.167969 19.890625 19.164062 18.902344 18.777344 17.890625 L 17.402344 14.300781 C 17.300781 14.035156 17.085938 13.695312 16.882812 13.496094 Z M 15.316406 14.296875 L 5.730469 4.769531 L 3.953125 6.535156 L 13.535156 16.066406 Z M 3.949219 3 L 4.542969 3.585938 L 2.765625 5.355469 L 2.171875 4.765625 C 1.84375 4.441406 1.84375 3.910156 2.171875 3.585938 L 2.761719 3 C 3.089844 2.671875 3.621094 2.671875 3.949219 3 Z M 4.550781 12.996094 C 4.390625 12.699219 3.964844 12.699219 3.808594 12.996094 L 3 14.503906 C 2.960938 14.578125 2.902344 14.640625 2.828125 14.679688 L 1.308594 15.480469 C 1.011719 15.636719 1.011719 16.058594 1.308594 16.214844 L 2.828125 17.015625 C 2.902344 17.054688 2.960938 17.117188 3 17.191406 L 3.808594 18.699219 C 3.964844 18.996094 4.390625 18.996094 4.550781 18.699219 L 5.355469 17.191406 C 5.394531 17.117188 5.453125 17.054688 5.527344 17.015625 L 7.046875 16.214844 C 7.34375 16.058594 7.34375 15.636719 7.046875 15.480469 L 5.527344 14.679688 C 5.453125 14.640625 5.394531 14.578125 5.355469 14.503906 Z M 17.355469 5.480469 C 17.199219 5.183594 16.773438 5.183594 16.613281 5.480469 L 16.027344 6.582031 C 15.988281 6.65625 15.929688 6.714844 15.855469 6.753906 L 14.746094 7.335938 C 14.449219 7.496094 14.449219 7.917969 14.746094 8.074219 L 15.855469 8.660156 C 15.929688 8.699219 15.988281 8.757812 16.027344 8.832031 L 16.613281 9.933594 C 16.773438 10.230469 17.199219 10.230469 17.355469 9.933594 L 17.945312 8.832031 C 17.984375 8.757812 18.042969 8.699219 18.117188 8.660156 L 19.226562 8.074219 C 19.523438 7.917969 19.523438 7.496094 19.226562 7.335938 L 18.117188 6.753906 C 18.042969 6.714844 17.984375 6.65625 17.945312 6.582031 Z" fill-opacity="1" fill-rule="evenodd"></path></g>
4
4
  </svg>`;default:return null}}render(){return i.qy`
@@ -12,7 +12,7 @@
12
12
  <span class="icon">${this.factory()}</span>
13
13
  <span class="label"><lang-text text="${this.icon}"></lang-text></span>
14
14
  </button>
15
- `}}c.styles=i.AH`
15
+ `}}o.styles=i.AH`
16
16
  :host {
17
17
  display: block;
18
18
  direction: ltr;
@@ -24,19 +24,22 @@
24
24
  align-items: center;
25
25
  justify-content: center;
26
26
  gap: 3px;
27
- padding: 6px 2px;
27
+ padding: var(--space-2, 8px) var(--space-1, 4px);
28
28
  cursor: pointer;
29
29
  border: none;
30
30
  background: transparent;
31
31
  outline: none;
32
32
  position: relative;
33
- transition: background 0.15s ease;
33
+ transition: background var(--duration-fast, 120ms) var(--ease-default, ease);
34
+ }
35
+ .tab-btn:focus-visible {
36
+ box-shadow: var(--focus-ring-inset, inset 0 0 0 2px #6366f1);
34
37
  }
35
38
  .tab-btn:hover:not(.selected) {
36
- background: #eeeef0;
39
+ background: var(--color-bg-muted, #eeeef0);
37
40
  }
38
41
  .tab-btn.selected {
39
- background: color-mix(in srgb, var(--accent, #5B5FC7) 12%, transparent);
42
+ background: var(--color-primary-soft, rgba(99, 102, 241, 0.08));
40
43
  }
41
44
  .icon {
42
45
  display: flex;
@@ -44,21 +47,21 @@
44
47
  justify-content: center;
45
48
  --cdtr-icon-width: 18px;
46
49
  --cdtr-icon-height: 18px;
47
- opacity: 0.55;
48
- transition: opacity 0.15s ease, color 0.15s ease;
49
- color: #666;
50
+ opacity: 0.6;
51
+ transition: opacity var(--duration-fast, 120ms) var(--ease-default, ease), color var(--duration-fast, 120ms) var(--ease-default, ease);
52
+ color: var(--color-text-muted, #666);
50
53
  }
51
54
  .tab-btn:hover:not(.selected) .icon {
52
55
  opacity: 0.8;
53
- color: #444;
56
+ color: var(--color-text-secondary, #444);
54
57
  }
55
58
  .tab-btn.selected .icon {
56
59
  opacity: 1;
57
- color: var(--accent, #5B5FC7);
60
+ color: var(--color-primary, #6366f1);
58
61
  }
59
62
  .label {
60
- font-size: 9px;
61
- color: #888;
63
+ font-size: 10px;
64
+ color: var(--color-text-muted, #888);
62
65
  font-weight: 500;
63
66
  text-align: center;
64
67
  line-height: 1;
@@ -66,13 +69,13 @@
66
69
  overflow: hidden;
67
70
  text-overflow: ellipsis;
68
71
  white-space: nowrap;
69
- transition: color 0.15s ease;
72
+ transition: color var(--duration-fast, 120ms) var(--ease-default, ease);
70
73
  }
71
74
  .tab-btn.selected .label {
72
- color: var(--accent, #5B5FC7);
75
+ color: var(--color-primary, #6366f1);
73
76
  font-weight: 600;
74
77
  }
75
78
  .tab-btn:hover:not(.selected) .label {
76
- color: #444;
79
+ color: var(--color-text-secondary, #444);
77
80
  }
78
- `,c.properties={icon:{},labelMode:{},selected:{}},customElements.define("cdtr-editor-tab-item",c)}}]);
81
+ `,o.properties={icon:{},labelMode:{},selected:{}},customElements.define("cdtr-editor-tab-item",o)}}]);
Binary file
@@ -1 +1 @@
1
- "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[8250],{78250(e,t,o){o.d(t,{default:()=>l});const a=e=>{{const{component:t,commands:o,helpers:a}=e;return{select:e=>{let{changeTab:t,tab:o}=e},tabs:e=>{const t=[{text:"time"},{text:"design"}];return t.forEach(t=>t.selected=t.selected=t.text===e),t},layout:e=>{let{tab:a,changeTab:r,tabs:n}=e;const l=t.parent("col");return[{type:"datetime",value:t.props.date,active:"time"===a.text,onChange:e=>{const t=e.target.value;o.execCommand("date",t.toString())}},{type:"slider",title:"width",max:l.element.offsetWidth,min:100,value:parseFloat(t.props.containerWidth),active:"design"===a.text,onInput:e=>{const t=e.target.value;o.execCommand("containerWidth",t+"px")}},{type:"divider",active:"design"===a.text},{type:"heading",level:5,text:"numbers"},{type:"fontFamily",title:"font",value:t.props.numberFontFamily,onChange:e=>{const t=e.target.value;o.execCommand("numberFontFamily",t)}},{type:"slider",title:"size",max:100,min:10,value:parseFloat(t.props.numberSize),onInput:e=>{const t=e.target.value;o.execCommand("numberSize",t+"px")}},{type:"colorpicker",title:"color",value:t.props.numberColor,onChange:e=>{const t=e.target.value;o.execCommand("numberColor",t)}},{type:"divider"},{type:"heading",level:5,text:"labels"},{type:"checkbox",title:"counterTitle",checked:t.props.hasLabels,onChange:e=>{const t=e.target.checked;o.execCommand("hasLabels",t)}},{type:"fontFamily",title:"font",value:t.props.labelFontFamily,onChange:e=>{const t=e.target.value;o.execCommand("labelFontFamily",t)}},{type:"slider",title:"size",max:100,min:10,value:parseFloat(t.props.labelSize),onInput:e=>{const t=e.target.value;o.execCommand("labelSize",t+"px")}},{type:"colorpicker",title:"color",value:t.props.labelColor,onChange:e=>{const t=e.target.value;o.execCommand("labelColor",t)}},{type:"divider"},{type:"heading",level:5,text:"border"},{type:"colorpicker",title:"color",value:t.props.borderColor,onChange:e=>{const t=e.target.value;o.execCommand("borderColor",t)}},{type:"slider",title:"size",max:10,min:0,value:parseFloat(t.props.colBorderSize),onInput:e=>{const t=e.target.value;o.execCommand("colBorderSize",t+"px")}},{type:"borderpicker",title:"style",value:t.props.borderStyle,onChange:e=>{const t=e.target.value;o.execCommand("colBorderStyle",t)}},{type:"colorpicker",title:"background",value:t.props.colBg,onChange:e=>{const t=e.target.value;o.execCommand("colBg",t)}}]}}}};var r=o(52144);const n=e=>{let{helpers:t,template:o,countdown:a}=e;return{set:(e,t,o)=>{switch(t){case"containerWidth":case"numberFontFamily":case"colorpicker":case"labelSize":case"labelColor":case"colBg":case"numberSize":case"numberColor":case"colBorderSize":case"colBorderColor":case"hasLabels":case"colBorderSize":case"labelFontFamily":case"numberFontFamily":return a[t]=e[t]=o,!0;case"style":return e[t]=(0,r.A)(e[t],o),!0}}}};(function(e,t){try{const o=document.head.querySelector(`script[src="${e}"]`);if(o){const e=parseInt(o.dataset.requested,10)||1;return o.dataset.requested=String(e+1),void("function"==typeof t&&t())}const a=document.createElement("script");a.type=e.includes("?module")?"module":"text/javascript",a.dataset.loaded="false",a.async=!0,a.defer=!0,a.src=e,a.addEventListener("load",()=>{a.dataset.loaded="true",a.dataset.requested=String((parseInt(a.dataset.requested,10)||0)+1),"function"==typeof t&&t()},{once:!0}),a.addEventListener("error",()=>{a.dataset.error="true"},{once:!0}),document.head.appendChild(a)}catch(e){console.error("loadScript:",e)}})("https://unpkg.com/@creaditor/countdown@latest/dist/countdown-element.js?module");const l=()=>{const e="countdown";return{name:e,create:t=>{let{createElement:o,compose:r,helpers:l}=t;const{arrayToString:c,mergeDiff:s}=l,d=r.props,i=document.createElement("div"),p=document.createElement("countdown-element");return i.append(p),o({name:e,id:r.id,template:i,render:()=>{!function(){for(const e in d)if(Object.hasOwnProperty.call(d,e)){const t=d[e];p[e]=t}}(),s(p,{style:r.props.style})},defaultProps:{hasColons:!0,hasLabels:!0,data:"",language:"he",style:{},classList:[],containerWidth:"400px",containerBg:"transparent",containerRadius:"0",colBg:"transparent",colBorderStyle:"none",colBorderSize:"0",colBorderColor:"none",colBorderPadding:"0",colBorderRadius:"100px",numberSize:"30px",numberColor:"black",numberFontFamily:"Arial",labelSize:"14px",labelColor:"black",labelfontFamily:"Arial"},validator:n({template:i,helpers:l,countdown:p}),draggable:{group:"element"},droppable:{group:"element"},handleBar:!0,schema:r.schema,onSelect:e=>{p.classList.add(e)},onDeselect:e=>{p.classList.remove(e)},elementProps:r,remove:()=>{i.remove()},createEditor:a})}}}}}]);
1
+ "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[8250],{78250(e,t,o){o.d(t,{default:()=>l});const a=e=>{{const{component:t,commands:o,helpers:a}=e;return{select:e=>{let{changeTab:t,tab:o}=e},tabs:e=>{const t=[{text:"time"},{text:"style"}];return t.forEach(t=>t.selected=t.selected=t.text===e),t},layout:e=>{let{tab:a,changeTab:r,tabs:n}=e;const l=t.parent("col");return[{type:"datetime",value:t.props.date,active:"time"===a.text,onChange:e=>{const t=e.target.value;o.execCommand("date",t.toString())}},{type:"slider",title:"width",max:l.element.offsetWidth,min:100,value:parseFloat(t.props.containerWidth),active:"style"===a.text,onInput:e=>{const t=e.target.value;o.execCommand("containerWidth",t+"px")}},{type:"divider",active:"style"===a.text},{type:"heading",level:5,text:"numbers"},{type:"fontFamily",title:"font",value:t.props.numberFontFamily,onChange:e=>{const t=e.target.value;o.execCommand("numberFontFamily",t)}},{type:"slider",title:"size",max:100,min:10,value:parseFloat(t.props.numberSize),onInput:e=>{const t=e.target.value;o.execCommand("numberSize",t+"px")}},{type:"colorpicker",title:"color",value:t.props.numberColor,onChange:e=>{const t=e.target.value;o.execCommand("numberColor",t)}},{type:"divider"},{type:"heading",level:5,text:"labels"},{type:"checkbox",title:"counterTitle",checked:t.props.hasLabels,onChange:e=>{const t=e.target.checked;o.execCommand("hasLabels",t)}},{type:"fontFamily",title:"font",value:t.props.labelFontFamily,onChange:e=>{const t=e.target.value;o.execCommand("labelFontFamily",t)}},{type:"slider",title:"size",max:100,min:10,value:parseFloat(t.props.labelSize),onInput:e=>{const t=e.target.value;o.execCommand("labelSize",t+"px")}},{type:"colorpicker",title:"color",value:t.props.labelColor,onChange:e=>{const t=e.target.value;o.execCommand("labelColor",t)}},{type:"divider"},{type:"heading",level:5,text:"border"},{type:"colorpicker",title:"color",value:t.props.borderColor,onChange:e=>{const t=e.target.value;o.execCommand("borderColor",t)}},{type:"slider",title:"size",max:10,min:0,value:parseFloat(t.props.colBorderSize),onInput:e=>{const t=e.target.value;o.execCommand("colBorderSize",t+"px")}},{type:"borderpicker",title:"style",value:t.props.borderStyle,onChange:e=>{const t=e.target.value;o.execCommand("colBorderStyle",t)}},{type:"colorpicker",title:"background",value:t.props.colBg,onChange:e=>{const t=e.target.value;o.execCommand("colBg",t)}}]}}}};var r=o(52144);const n=e=>{let{helpers:t,template:o,countdown:a}=e;return{set:(e,t,o)=>{switch(t){case"containerWidth":case"numberFontFamily":case"colorpicker":case"labelSize":case"labelColor":case"colBg":case"numberSize":case"numberColor":case"colBorderSize":case"colBorderColor":case"hasLabels":case"colBorderSize":case"labelFontFamily":case"numberFontFamily":return a[t]=e[t]=o,!0;case"style":return e[t]=(0,r.A)(e[t],o),!0}}}};(function(e,t){try{const o=document.head.querySelector(`script[src="${e}"]`);if(o){const e=parseInt(o.dataset.requested,10)||1;return o.dataset.requested=String(e+1),void("function"==typeof t&&t())}const a=document.createElement("script");a.type=e.includes("?module")?"module":"text/javascript",a.dataset.loaded="false",a.async=!0,a.defer=!0,a.src=e,a.addEventListener("load",()=>{a.dataset.loaded="true",a.dataset.requested=String((parseInt(a.dataset.requested,10)||0)+1),"function"==typeof t&&t()},{once:!0}),a.addEventListener("error",()=>{a.dataset.error="true"},{once:!0}),document.head.appendChild(a)}catch(e){console.error("loadScript:",e)}})("https://unpkg.com/@creaditor/countdown@latest/dist/countdown-element.js?module");const l=()=>{const e="countdown";return{name:e,create:t=>{let{createElement:o,compose:r,helpers:l}=t;const{arrayToString:c,mergeDiff:s}=l,d=r.props,i=document.createElement("div"),p=document.createElement("countdown-element");return i.append(p),o({name:e,id:r.id,template:i,render:()=>{!function(){for(const e in d)if(Object.hasOwnProperty.call(d,e)){const t=d[e];p[e]=t}}(),s(p,{style:r.props.style})},defaultProps:{hasColons:!0,hasLabels:!0,data:"",language:"he",style:{},classList:[],containerWidth:"400px",containerBg:"transparent",containerRadius:"0",colBg:"transparent",colBorderStyle:"none",colBorderSize:"0",colBorderColor:"none",colBorderPadding:"0",colBorderRadius:"100px",numberSize:"30px",numberColor:"black",numberFontFamily:"Arial",labelSize:"14px",labelColor:"black",labelfontFamily:"Arial"},validator:n({template:i,helpers:l,countdown:p}),draggable:{group:"element"},droppable:{group:"element"},handleBar:!0,schema:r.schema,onSelect:e=>{p.classList.add(e)},onDeselect:e=>{p.classList.remove(e)},elementProps:r,remove:()=>{i.remove()},createEditor:a})}}}}}]);
Binary file
@@ -12,7 +12,7 @@
12
12
  <div class="header">
13
13
  <paper-button
14
14
  @click=${this.onClose}
15
- style="padding:6px;z-index:3;position:absolute;left:0;min-width:20px;"
15
+ style="padding:0;z-index:3;min-width:32px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:6px;margin-inline-start:8px;"
16
16
  >
17
17
  <cdtr-close-icon class="close-icon" icon="close">
18
18
  </cdtr-close-icon>
@@ -38,25 +38,30 @@
38
38
  display: none !important;
39
39
  }
40
40
  .header-text {
41
- margin: 12px;
42
- font-size: 18px;
43
- font-family: Arial;
41
+ margin: 0;
42
+ font-size: var(--text-lg, 16px);
43
+ font-weight: 600;
44
+ font-family: var(--font-sans, -apple-system, system-ui, 'Segoe UI', Roboto, sans-serif);
44
45
  text-align: right;
45
46
  display: block;
46
47
  width: 95%;
47
48
  position: absolute;
48
- top: 0;
49
+ top: 50%;
49
50
  left: 0;
51
+ transform: translateY(-50%);
52
+ padding: 0 var(--space-4, 16px);
50
53
  direction: var(--direction-locale);
54
+ box-sizing: border-box;
55
+ color: var(--color-text, #1a1a1f);
51
56
  }
52
57
  .drawer {
53
58
  width: ${500}px;
54
59
  height: 100vh;
55
- background: #fff;
60
+ background: var(--color-bg, #fff);
56
61
  position: absolute;
57
62
  right: 0;
58
- transition: width 0.28s cubic-bezier(0.4, 0, 0.2, 1);
59
- box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
63
+ transition: width 0.28s var(--ease-default, cubic-bezier(0.4, 0, 0.2, 1));
64
+ box-shadow: var(--shadow-lg, rgba(0, 0, 0, 0.24) 0px 3px 8px);
60
65
  -webkit-animation: slide-in 0.5s forwards;
61
66
  -webkit-animation-delay: 2s;
62
67
  animation: slide-in 0.5s forwards;
@@ -67,31 +72,22 @@
67
72
  animation: slide-out 0.5s forwards;
68
73
  }
69
74
  .header {
70
- min-height: 40px;
71
- margin: 1px;
75
+ height: 48px;
72
76
  width: 100%;
73
- padding: 4.4px 0;
74
- box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px,
75
- rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
77
+ border-bottom: 1px solid var(--color-border, #e8e8ec);
78
+ display: flex;
79
+ align-items: center;
80
+ position: relative;
81
+ box-sizing: border-box;
76
82
  }
77
83
  .body {
78
84
  width: 100%;
79
- height: 100vh;
85
+ height: calc(100vh - 48px);
80
86
  overflow: hidden;
81
87
  }
82
88
  .close-button {
83
89
  cursor: pointer;
84
90
  }
85
- .close-button:hover {
86
- -webkit-animation: rotate 0.5s forwards;
87
- -webkit-animation-delay: 2s;
88
- animation: rotate 0.5s forwards;
89
- }
90
- @keyframes rotate {
91
- 100% {
92
- transform: rotate(180deg);
93
- }
94
- }
95
91
  @-webkit-keyframes slide-in {
96
92
  100% {
97
93
  transform: rotate(180deg);
Binary file
@@ -82,7 +82,7 @@
82
82
  right: 0;
83
83
  height: fit-content;
84
84
  background: transparent;
85
- z-index: 110;
85
+ z-index: var(--z-dropdown, 100);
86
86
  display: flex;
87
87
  align-items: center;
88
88
  width: 24px;
@@ -91,17 +91,17 @@
91
91
  .wrapper {
92
92
  top: 0;
93
93
  right: 0;
94
- padding: 5px;
94
+ padding: var(--space-1, 4px);
95
95
  height: 100%;
96
- width: 25px;
97
- box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
96
+ width: 32px;
97
+ box-shadow: var(--shadow-sm);
98
98
  transform: translate(70%, 0);
99
- background: #fff;
100
- border-radius: 0.2rem;
99
+ background: var(--color-bg, #fff);
100
+ border-radius: var(--radius-sm, 6px);
101
101
  min-height: 90px;
102
102
  }
103
103
  paper-button {
104
- padding: 0.2rem;
104
+ padding: var(--space-1, 4px);
105
105
  min-width: auto;
106
106
  display: block;
107
107
  margin: auto;
Binary file
@@ -1,4 +1,4 @@
1
- "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9041],{19041(t,e,n){n.r(e),n.d(e,{ElementHandleBar:()=>p});var o=n(59929),i=n(86319),a=n(21421),s=n(36565),r=n(89531),l=n(83965),c=n(67549);const d=s.Ay;r.A,l.i,c.s;class p extends o.WF{constructor(){super(),this.animations=[],this.elementRef=(0,a._)(),this.canDisplayBar=!0;const t=i.M.get("config","editor","configure","editorProps");this.canDisplayBar=!t||!1!==t?.actionBar,this.selected=!1,this.connectWith=this.connectWith.bind(this),this.onRemove=this.onRemove.bind(this)}cloneElement(){let t,e=d.getComponent(this.for);const n=e?.closest("col");let o=0;n&&(o=n.children.length);const i="card"===e?.type||o<2?e.closest("col"):null;if(i&&(e=i),e&&(t=e.parent(),t)){let n=t.children.findIndex(t=>t===e.id);"col"===e.type&&(n+=1),"number"==typeof n&&d.cloneComponent({componentId:e.id,index:n,parentId:t.id})}}onRemove(){const t=i.M.get("components",this.for),e=t?.commands?.remove??t?.remove;"function"==typeof e&&e()}connectWith(){if(this.selected=!1,this.for){const t=d.components.find(t=>t.id===this.for);if(t){const e=t,n=e.closest("col");n&&(n.element.getBoundingClientRect(),e.element.getBoundingClientRect());const o=e.closest("card");if(o&&this.elementRef.value){const t=o.element.getBoundingClientRect(),n=e.element.getBoundingClientRect();if(parseInt(String(t.top))>=parseInt(String(n.top))-40){let e=0;t.right>n.right?e=t.right-n.right-100+"px":t.left<n.left&&(e=t.left-n.left+20+"px"),n.left+parseInt(String(e))<t.left&&(e=0),this.elementRef.value.style.transform=`translate(${e},${n.height+10}px)`}else this.elementRef.value.style.transform=""}else this.elementRef.value&&(this.elementRef.value.style.transform="");this.selected=!!e.element?.closest("[draggable-element]");const a=e.props;this.animations=a.interactions?.filter(t=>"animation"===t.type)??[],this.hasAnimations=this.animations.length>0,this.name=a.name||i.M.get("lang",e.type)}}}justifyContent(t){d.store().execCommand("justify",t,{find:"col"})}connectedCallback(){super.connectedCallback(),d.on("select",this.connectWith),d.on("update",this.connectWith),this.classList.add("ignore-cdtr-blur")}disconnectedCallback(){super.disconnectedCallback(),d.off("select",this.connectWith),d.off("update",this.connectWith)}render(){return this.style.display=this.selected?"":"none",o.qy`<cdtr-row
1
+ "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9041],{19041(t,e,n){n.r(e),n.d(e,{ElementHandleBar:()=>p});var o=n(59929),i=n(86319),a=n(21421),r=n(36565),s=n(89531),c=n(83965),l=n(67549);const d=r.Ay;s.A,c.i,l.s;class p extends o.WF{constructor(){super(),this.animations=[],this.elementRef=(0,a._)(),this.canDisplayBar=!0;const t=i.M.get("config","editor","configure","editorProps");this.canDisplayBar=!t||!1!==t?.actionBar,this.selected=!1,this.connectWith=this.connectWith.bind(this),this.onRemove=this.onRemove.bind(this)}cloneElement(){let t,e=d.getComponent(this.for);const n=e?.closest("col");let o=0;n&&(o=n.children.length);const i="card"===e?.type||o<2?e.closest("col"):null;if(i&&(e=i),e&&(t=e.parent(),t)){let n=t.children.findIndex(t=>t===e.id);"col"===e.type&&(n+=1),"number"==typeof n&&d.cloneComponent({componentId:e.id,index:n,parentId:t.id})}}onRemove(){const t=i.M.get("components",this.for),e=t?.commands?.remove??t?.remove;"function"==typeof e&&e()}connectWith(){if(this.selected=!1,this.for){const t=d.components.find(t=>t.id===this.for);if(t){const e=t;if("function"!=typeof e.closest)return;const n=e.closest("col");n&&(n.element.getBoundingClientRect(),e.element.getBoundingClientRect());const o=e.closest("card");if(o&&this.elementRef.value){const t=o.element.getBoundingClientRect(),n=e.element.getBoundingClientRect();if(parseInt(String(t.top))>=parseInt(String(n.top))-40){let e=0;t.right>n.right?e=t.right-n.right-100+"px":t.left<n.left&&(e=t.left-n.left+20+"px"),n.left+parseInt(String(e))<t.left&&(e=0),this.elementRef.value.style.transform=`translate(${e},${n.height+10}px)`}else this.elementRef.value.style.transform=""}else this.elementRef.value&&(this.elementRef.value.style.transform="");this.selected=!!e.element?.closest("[draggable-element]");const a=e.props;this.animations=a.interactions?.filter(t=>"animation"===t.type)??[],this.hasAnimations=this.animations.length>0,this.name=a.name||i.M.get("lang",e.type)}}}justifyContent(t){d.store().execCommand("justify",t,{find:"col"})}connectedCallback(){super.connectedCallback(),d.on("select",this.connectWith),d.on("update",this.connectWith),this.classList.add("ignore-cdtr-blur")}disconnectedCallback(){super.disconnectedCallback(),d.off("select",this.connectWith),d.off("update",this.connectWith)}render(){return this.style.display=this.selected?"":"none",o.qy`<cdtr-row
2
2
  ${(0,a.K)(this.elementRef)}
3
3
  class="bar"
4
4
  alignItems="center"
@@ -102,25 +102,24 @@
102
102
  }
103
103
  .bar {
104
104
  position: absolute;
105
- height: 30px;
105
+ height: 32px;
106
106
  background: transparent;
107
107
  min-width: 106px;
108
- z-index: 101;
108
+ z-index: var(--z-dropdown, 100);
109
109
  display: flex;
110
110
  align-items: center;
111
111
  font-family: var(--font-family);
112
112
  left: 0;
113
113
  top: -5px;
114
114
  transform: translate(0, -100%);
115
- padding: 0 0.4rem;
116
- background: #fff;
117
- font-size: 13px;
118
- border-radius: 3px;
119
- animation: fade_in 0.2s;
120
- color: black;
115
+ padding: 0 var(--space-1, 4px);
116
+ background: var(--color-bg, #fff);
117
+ font-size: var(--text-sm, 13px);
118
+ border-radius: var(--radius-sm, 6px);
119
+ animation: fade_in var(--duration-normal, 0.2s);
120
+ color: var(--color-text, #1a1a1f);
121
121
  width: auto;
122
- box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
123
- rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
122
+ box-shadow: var(--shadow-sm);
124
123
  }
125
124
  .bottom-bar {
126
125
  top: 100%;
@@ -133,13 +132,12 @@
133
132
  left: 101%;
134
133
  top: 0;
135
134
  background: var(--primary);
136
-
137
- padding: 5px 5px;
135
+ padding: var(--space-1, 4px);
138
136
  display: flex;
139
137
  align-items: center;
140
- border-radius: 3px;
138
+ border-radius: var(--radius-sm, 6px);
141
139
  overflow: hidden;
142
- z-index: 99;
140
+ z-index: var(--z-dropdown, 100);
143
141
  }
144
142
  @keyframes fade_up {
145
143
  from {
Binary file
@@ -1 +1 @@
1
- "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9431],{49431(e,t,a){a.d(t,{default:()=>s});const r=e=>{const{component:t,commands:a,helpers:r}=e,l=t.parent("col");return{select:e=>{let{changeTab:t,tab:a}=e;a.text||t("giphy")},tabs:e=>{const t=[{text:"giphy",selected:!0},{text:"design"},{text:"link"},{text:"settings"}];return e?(t.forEach(t=>t.selected=t.text===e),t):t},layout:e=>{let{tab:r}=e;return[{type:"giphy",active:()=>"giphy"===r.text,selectedSrc:t.props.src||"",onChange:e=>{const{src:t,alt:r}=e.detail||{};t&&a.execCommand("src",t),null!=r&&a.execCommand("alt",r)}},{type:"input",title:"altText",active:()=>"giphy"===r.text,value:t.props.alt||"",onChange:e=>{a.execCommand("alt",e.target.value)}},{type:"slider",title:"size",min:50,max:l?.element?.offsetWidth||600,active:()=>"design"===r.text,value:parseInt(t.props.style?.width,10)||200,onInput:e=>{const t=e.target.value;a.execCommand("style",{width:t+"px",height:"auto"})}},{type:"linkpicker",href:t.props.onClick?.link,protocol:t.props.onClick?.link?.protocol,target:t.props.onClick?.link?.target,autofocus:!0,active:()=>"link"===r.text,onChange:e=>{const t=e.target.value;a.execCommand("onClick",{link:t})}}]}}},l=e=>{let{helpers:t}=e;return{set:(e,a,r)=>{switch(a){case"src":case"alt":case"onClick":return e[a]=r,!0;case"style":if("object"==typeof r)return e[a]=t.deepMerge(e[a],r),!0}return!1}}},s=()=>{const e="giphy";return{name:e,create:t=>{const{createElement:a,compose:s,helpers:n}=t,{mergeDiff:o}=n,c=document.createElement("div"),i=document.createElement("img");c.appendChild(i);return a({name:e,id:s.id,template:c,defaultProps:{style:{height:"auto",width:"200px",maxWidth:"100%"},src:"",alt:""},draggable:{group:"element"},droppable:{group:"element"},render:()=>{o(i,{style:s.props.style}),o(i,{src:s.props.src||"",alt:s.props.alt||"GIF"})},resizeable:()=>c,handleBar:!0,validator:l({helpers:n}),schema:s.schema,onSelect:e=>c.classList.add(e),onDeselect:e=>c.classList.remove(e),elementProps:s,remove:()=>c.remove(),createEditor:r})}}}}}]);
1
+ "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9431],{49431(e,t,a){a.d(t,{default:()=>s});const l=e=>{const{component:t,commands:a,helpers:l}=e,r=t.parent("col");return{select:e=>{let{changeTab:t,tab:a}=e;a.text||t("giphy")},tabs:e=>{const t=[{text:"giphy",selected:!0},{text:"style"},{text:"link"},{text:"settings"}];return e?(t.forEach(t=>t.selected=t.text===e),t):t},layout:e=>{let{tab:l}=e;return[{type:"giphy",active:()=>"giphy"===l.text,selectedSrc:t.props.src||"",onChange:e=>{const{src:t,alt:l}=e.detail||{};t&&a.execCommand("src",t),null!=l&&a.execCommand("alt",l)}},{type:"input",title:"altText",active:()=>"giphy"===l.text,value:t.props.alt||"",onChange:e=>{a.execCommand("alt",e.target.value)}},{type:"slider",title:"size",min:50,max:r?.element?.offsetWidth||600,active:()=>"style"===l.text,value:parseInt(t.props.style?.width,10)||200,onInput:e=>{const t=e.target.value;a.execCommand("style",{width:t+"px",height:"auto"})}},{type:"linkpicker",href:t.props.onClick?.link,protocol:t.props.onClick?.link?.protocol,target:t.props.onClick?.link?.target,autofocus:!0,active:()=>"link"===l.text,onChange:e=>{const t=e.target.value;a.execCommand("onClick",{link:t})}}]}}},r=e=>{let{helpers:t}=e;return{set:(e,a,l)=>{switch(a){case"src":case"alt":case"onClick":return e[a]=l,!0;case"style":if("object"==typeof l)return e[a]=t.deepMerge(e[a],l),!0}return!1}}},s=()=>{const e="giphy";return{name:e,create:t=>{const{createElement:a,compose:s,helpers:n}=t,{mergeDiff:o}=n,c=document.createElement("div"),p=document.createElement("img");c.appendChild(p);return a({name:e,id:s.id,template:c,defaultProps:{style:{height:"auto",width:"200px",maxWidth:"100%"},src:"",alt:""},draggable:{group:"element"},droppable:{group:"element"},render:()=>{o(p,{style:s.props.style}),o(p,{src:s.props.src||"",alt:s.props.alt||"GIF"})},resizeable:()=>c,handleBar:!0,validator:r({helpers:n}),schema:s.schema,onSelect:e=>c.classList.add(e),onDeselect:e=>c.classList.remove(e),elementProps:s,remove:()=>c.remove(),createEditor:l})}}}}}]);
Binary file
@@ -1 +1 @@
1
- "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9694],{69694(e,n,t){t.d(n,{default:()=>b});const o=e=>{{const{component:n,commands:t}=e;return{select:e=>{let{changeTab:n,tab:t}=e;"design"!==t.text&&n("design")},tabs:e=>{const n=[{text:"design"}];return n.forEach(n=>n.selected=n.selected=n.text===e),n},layout:e=>{let{tab:o,changeTab:r,tabs:s}=e;return[{type:"slider",title:"height",unit:"px",value:parseFloat(n.props.size),min:10,max:900,onInput:e=>{const n=e.target.value;t.execCommand("size",n+"px")}}]}}}},r=()=>({set:(e,n,t)=>"size"===n&&(e[n]=t,!0)});var s=t(72591),a=t.n(s),i=t(88639),d=t.n(i),A=t(88128),c=t.n(A),l=t(30855),u=t.n(l),g=t(93051),C=t.n(g),p=t(30772),m={};m.setAttributes=u(),m.insert=c().bind(null,"head"),m.domAPI=d(),m.insertStyleElement=C();a()(p.A,m);const h=p.A&&p.A.locals?p.A.locals:void 0,b=()=>{const e="spacer";return{name:e,create:n=>{let{createElement:t,compose:s,helpers:a}=n;const i=document.createElement("div");i.classList.add(h.root);const d=t({name:e,id:s.id,template:i,defaultProps:{size:"200px"},draggable:{group:"element"},droppable:{group:"element"},handleBar:!0,render:e=>{i.style.height=s.props.size||"200px"},validator:r(),getRenderedHTML:()=>`<div style="height:${s.props.size}"></div>`,schema:s.schema,onSelect:e=>{i.classList.add(e)},onDeselect:e=>{i.classList.remove(e)},elementProps:s,remove:()=>{i.remove()},createEditor:o});return((e,n)=>{const t=document.createElement("div");t.classList.add(h.resizeBar),t.setAttribute("draggable","false"),e.appendChild(t);let o=!1,r=0,s=0;const a=t=>{if(!o)return;const a=t.clientY-r,i=Math.max(10,s+a)+"px";e.style.height=i,n.commands.execCommand("size",i)},i=()=>{o&&(o=!1,t.classList.remove(h.dragging),document.removeEventListener("mousemove",a),document.removeEventListener("mouseup",i))};t.addEventListener("mousedown",n=>{n.preventDefault(),n.stopPropagation(),o=!0,r=n.clientY,s=e.getBoundingClientRect().height,document.addEventListener("mousemove",a),document.addEventListener("mouseup",i),t.classList.add(h.dragging)})})(i,d),d}}}},30772(e,n,t){t.d(n,{A:()=>i});var o=t(82001),r=t.n(o),s=t(40935),a=t.n(s)()(r());a.push([e.id,'.aLJn5aW2t4h6fq41PEdv{\n width: 100%;\n position: relative;\n}\n.aLJn5aW2t4h6fq41PEdv::after{\n content: "";\n outline: 1px dashed rgba(57, 170, 193, 0.459);\n display: block;\n width: 100%;\n height: 100%;\n background-color: rgba(63, 115, 125, 0.005);\n}\n.pxoFCz5GGvHmLd86XtRD{\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 8px;\n cursor: ns-resize;\n z-index: 10;\n background-color: rgba(57, 170, 193, 0.1);\n transition: background-color 0.2s;\n}\n\n.pxoFCz5GGvHmLd86XtRD:hover{\n background-color: rgba(57, 170, 193, 0.6);\n}\n.pxoFCz5GGvHmLd86XtRD._0A7M5j1AiL_VBIzQGDK{\n background-color: rgba(57, 170, 193, 0.8);\n}',"",{version:3,sources:["webpack://./../web-editors/spacer-editor-component/lib/style.module.css"],names:[],mappings:"AAAA;IACI,WAAW;IACX,kBAAkB;AACtB;AACA;IACI,WAAW;IACX,6CAA6C;IAC7C,cAAc;IACd,WAAW;IACX,YAAY;IACZ,2CAA2C;AAC/C;AACA;IACI,kBAAkB;IAClB,SAAS;IACT,OAAO;IACP,WAAW;IACX,WAAW;IACX,iBAAiB;IACjB,WAAW;IACX,yCAAyC;IACzC,iCAAiC;AACrC;;AAEA;IACI,yCAAyC;AAC7C;AACA;IACI,yCAAyC;AAC7C",sourcesContent:['.root{\n width: 100%;\n position: relative;\n}\n.root::after{\n content: "";\n outline: 1px dashed rgba(57, 170, 193, 0.459);\n display: block;\n width: 100%;\n height: 100%;\n background-color: rgba(63, 115, 125, 0.005);\n}\n.resizeBar{\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 8px;\n cursor: ns-resize;\n z-index: 10;\n background-color: rgba(57, 170, 193, 0.1);\n transition: background-color 0.2s;\n}\n\n.resizeBar:hover{\n background-color: rgba(57, 170, 193, 0.6);\n}\n.resizeBar.dragging{\n background-color: rgba(57, 170, 193, 0.8);\n}'],sourceRoot:""}]),a.locals={root:"aLJn5aW2t4h6fq41PEdv",resizeBar:"pxoFCz5GGvHmLd86XtRD",dragging:"_0A7M5j1AiL_VBIzQGDK"};const i=a}}]);
1
+ "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9694],{69694(e,n,t){t.d(n,{default:()=>b});const o=e=>{{const{component:n,commands:t}=e;return{select:e=>{let{changeTab:n,tab:t}=e;"style"!==t.text&&n("style")},tabs:e=>{const n=[{text:"style"}];return n.forEach(n=>n.selected=n.selected=n.text===e),n},layout:e=>{let{tab:o,changeTab:r,tabs:s}=e;return[{type:"slider",title:"height",unit:"px",value:parseFloat(n.props.size),min:10,max:900,onInput:e=>{const n=e.target.value;t.execCommand("size",n+"px")}}]}}}},r=()=>({set:(e,n,t)=>"size"===n&&(e[n]=t,!0)});var s=t(72591),a=t.n(s),i=t(88639),d=t.n(i),A=t(88128),c=t.n(A),l=t(30855),u=t.n(l),C=t(93051),p=t.n(C),g=t(30772),m={};m.setAttributes=u(),m.insert=c().bind(null,"head"),m.domAPI=d(),m.insertStyleElement=p();a()(g.A,m);const h=g.A&&g.A.locals?g.A.locals:void 0,b=()=>{const e="spacer";return{name:e,create:n=>{let{createElement:t,compose:s,helpers:a}=n;const i=document.createElement("div");i.classList.add(h.root);const d=t({name:e,id:s.id,template:i,defaultProps:{size:"200px"},draggable:{group:"element"},droppable:{group:"element"},handleBar:!0,render:e=>{i.style.height=s.props.size||"200px"},validator:r(),getRenderedHTML:()=>`<div style="height:${s.props.size}"></div>`,schema:s.schema,onSelect:e=>{i.classList.add(e)},onDeselect:e=>{i.classList.remove(e)},elementProps:s,remove:()=>{i.remove()},createEditor:o});return((e,n)=>{const t=document.createElement("div");t.classList.add(h.resizeBar),t.setAttribute("draggable","false"),e.appendChild(t);let o=!1,r=0,s=0;const a=t=>{if(!o)return;const a=t.clientY-r,i=Math.max(10,s+a)+"px";e.style.height=i,n.commands.execCommand("size",i)},i=()=>{o&&(o=!1,t.classList.remove(h.dragging),document.removeEventListener("mousemove",a),document.removeEventListener("mouseup",i))};t.addEventListener("mousedown",n=>{n.preventDefault(),n.stopPropagation(),o=!0,r=n.clientY,s=e.getBoundingClientRect().height,document.addEventListener("mousemove",a),document.addEventListener("mouseup",i),t.classList.add(h.dragging)})})(i,d),d}}}},30772(e,n,t){t.d(n,{A:()=>i});var o=t(82001),r=t.n(o),s=t(40935),a=t.n(s)()(r());a.push([e.id,'.aLJn5aW2t4h6fq41PEdv{\n width: 100%;\n position: relative;\n}\n.aLJn5aW2t4h6fq41PEdv::after{\n content: "";\n outline: 1px dashed rgba(57, 170, 193, 0.459);\n display: block;\n width: 100%;\n height: 100%;\n background-color: rgba(63, 115, 125, 0.005);\n}\n.pxoFCz5GGvHmLd86XtRD{\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 8px;\n cursor: ns-resize;\n z-index: 10;\n background-color: rgba(57, 170, 193, 0.1);\n transition: background-color 0.2s;\n}\n\n.pxoFCz5GGvHmLd86XtRD:hover{\n background-color: rgba(57, 170, 193, 0.6);\n}\n.pxoFCz5GGvHmLd86XtRD._0A7M5j1AiL_VBIzQGDK{\n background-color: rgba(57, 170, 193, 0.8);\n}',"",{version:3,sources:["webpack://./../web-editors/spacer-editor-component/lib/style.module.css"],names:[],mappings:"AAAA;IACI,WAAW;IACX,kBAAkB;AACtB;AACA;IACI,WAAW;IACX,6CAA6C;IAC7C,cAAc;IACd,WAAW;IACX,YAAY;IACZ,2CAA2C;AAC/C;AACA;IACI,kBAAkB;IAClB,SAAS;IACT,OAAO;IACP,WAAW;IACX,WAAW;IACX,iBAAiB;IACjB,WAAW;IACX,yCAAyC;IACzC,iCAAiC;AACrC;;AAEA;IACI,yCAAyC;AAC7C;AACA;IACI,yCAAyC;AAC7C",sourcesContent:['.root{\n width: 100%;\n position: relative;\n}\n.root::after{\n content: "";\n outline: 1px dashed rgba(57, 170, 193, 0.459);\n display: block;\n width: 100%;\n height: 100%;\n background-color: rgba(63, 115, 125, 0.005);\n}\n.resizeBar{\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 8px;\n cursor: ns-resize;\n z-index: 10;\n background-color: rgba(57, 170, 193, 0.1);\n transition: background-color 0.2s;\n}\n\n.resizeBar:hover{\n background-color: rgba(57, 170, 193, 0.6);\n}\n.resizeBar.dragging{\n background-color: rgba(57, 170, 193, 0.8);\n}'],sourceRoot:""}]),a.locals={root:"aLJn5aW2t4h6fq41PEdv",resizeBar:"pxoFCz5GGvHmLd86XtRD",dragging:"_0A7M5j1AiL_VBIzQGDK"};const i=a}}]);
Binary file
@@ -0,0 +1,114 @@
1
+ "use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9994],{19994(p,x,r){r.r(x),r.d(x,{BoxShadowEditor:()=>m});var e=r(59088),t=r(36936),a=r(59929),o=r(49410),i=r(86319);const d=[{rule:"rgba(149, 157, 165, 0.2) 0px 8px 24px;"},{rule:"rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;"},{rule:"rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;"},{rule:"rgba(0, 0, 0, 0.35) 0px 5px 15px;"},{rule:"rgba(0, 0, 0, 0.16) 0px 1px 4px;"},{rule:"rgba(0, 0, 0, 0.24) 0px 3px 8px;"},{rule:"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;"},{rule:"rgba(0, 0, 0, 0.16) 0px 1px 4px, rgb(51, 51, 51) 0px 0px 0px 3px;"},{rule:"rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;"},{rule:"rgba(0, 0, 0, 0.1) 0px 4px 12px;"},{rule:"rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;"},{rule:"rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;"},{rule:"rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;"},{rule:"rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;"},{rule:"rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;"},{rule:"rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;"},{rule:"rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;"},{rule:"rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;"},{rule:"rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;"},{rule:"rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;"},{rule:"rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;"},{rule:"rgb(38, 57, 77) 0px 20px 30px -10px;"},{rule:"rgba(6, 24, 44, 0.4) 0px 0px 0px 2px, rgba(6, 24, 44, 0.65) 0px 4px 6px -1px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset;"},{rule:"rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;"},{rule:"rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;"},{rule:"rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px;"},{rule:"rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;"},{rule:"rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;"},{rule:"rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;"},{rule:"rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;"},{rule:"rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;"},{rule:"rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;"},{rule:"rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;"},{rule:"rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;"},{rule:"rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;"},{rule:"rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;"},{rule:"rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;"},{rule:"rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;"},{rule:"rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;"},{rule:"rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;"},{rule:"rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;"},{rule:"rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;"},{rule:"rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset;"},{rule:"rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;"},{rule:"rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;"},{rule:"rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;"},{rule:"rgba(0, 0, 0, 0.2) 0px 18px 50px -10px;"},{rule:"rgba(0, 0, 0, 0.1) 0px 10px 50px;"},{rule:"rgba(240, 46, 170, 0.4) -5px 5px, rgba(240, 46, 170, 0.3) -10px 10px, rgba(240, 46, 170, 0.2) -15px 15px, rgba(240, 46, 170, 0.1) -20px 20px, rgba(240, 46, 170, 0.05) -25px 25px;"},{rule:"rgba(240, 46, 170, 0.4) 0px 5px, rgba(240, 46, 170, 0.3) 0px 10px, rgba(240, 46, 170, 0.2) 0px 15px, rgba(240, 46, 170, 0.1) 0px 20px, rgba(240, 46, 170, 0.05) 0px 25px;"},{rule:"rgba(240, 46, 170, 0.4) 5px 5px, rgba(240, 46, 170, 0.3) 10px 10px, rgba(240, 46, 170, 0.2) 15px 15px, rgba(240, 46, 170, 0.1) 20px 20px, rgba(240, 46, 170, 0.05) 25px 25px;"}];function l(p){try{return function(p){const x=p.split(/ (?![^(]*\))/);let r="",e=0,t=0,a=0,o=0,i=!1;for(let p of x)p=p.trim(),"inset"===p?i=!0:p.endsWith("px")||p.endsWith("em")?0===t?t=parseFloat(p):0===e?e=parseFloat(p):0===a?a=parseFloat(p):0===o&&(o=parseFloat(p)):(p.includes("rgb")||p.includes("#"))&&(r=p);return[{color:r,offsetY:e,offsetX:t,blurRadius:a,spreadRadius:o,inset:i}]}(p)}catch(p){console.error(p)}}var s,n,b,g,u,c;const h=r(36565).Ay,w="#000 0px 0px 0px 0px",f={};let m=(s=(0,o.MZ)({type:String}),n=(0,o.MZ)({type:String}),(c=class extends a.WF{constructor(){super(),(0,e.A)(this,"value",g,this),(0,e.A)(this,"boxShadow",u,this),this.tabName=void 0,this.theme=void 0,this.onChangeBoxShadow=(p,x)=>{const r={color:f.color,offsetY:f.offsetY,offsetX:f.offsetX,blurRadius:f.blurRadius,spreadRadius:f.spreadRadius,inset:!!f.inset};if(void 0!==r[p]&&("string"==typeof x||"number"==typeof x||"boolean"==typeof x)){r[p]=x,f[p]=x;const e=`${r.offsetX}px ${r.offsetY}px ${r.blurRadius}px ${r.spreadRadius}px ${r.color} ${r.inset?"inset":""}`;this.changeBoxShadowValue(e)}},this.tabName="design",this.theme=i.M.get("theme"),this.removeBoxShadow=this.removeBoxShadow.bind(this),this.onChangeBoxShadow=this.onChangeBoxShadow.bind(this)}changeBoxShadowValue(p){h.store().execCommand("style",{boxShadow:p}),this.boxShadow=this.value=p}removeBoxShadow(){h.store().execCommand("style",{boxShadow:w}),this.boxShadow=this.value=w}connectedCallback(){super.connectedCallback(),r.e(1456).then(r.bind(r,11456)),r.e(5666).then(r.bind(r,35666))}disconnectedCallback(){super.disconnectedCallback()}createRenderRoot(){return this}changeTab(p){this.tabName=p.target.value}render(){if(void 0===this.value||this.value!==this.boxShadow){this.value||(this.value=w),this.boxShadow=this.value;const p=l(this.value);Array.isArray(p)&&p.length>0?(f.offsetX=p[0].offsetX,f.offsetY=p[0].offsetY,f.blurRadius=p[0].blurRadius,f.spreadRadius=p[0].spreadRadius,f.color=p[0].color,f.inset=p[0].inset):(f.offsetX=0,f.offsetY=0,f.blurRadius=0,f.spreadRadius=0,f.color="#000",f.inset=void 0)}return a.qy`
2
+ <cdtr-editor-container>
3
+ <cdtr-row alignItems="center" justify="space-between">
4
+ <cdtr-col>
5
+ <cdtr-title>
6
+ <lang-text text="box-shadow"></lang-text>
7
+ </cdtr-title>
8
+ </cdtr-col>
9
+ <cdtr-col sm="2">
10
+ ${this.boxShadow!==w?a.qy` <paper-button
11
+ style="min-width:40px;padding:0;"
12
+ @click=${this.removeBoxShadow}
13
+ ><cdtr-icon icon="x"></cdtr-icon
14
+ ></paper-button>`:null}
15
+ </cdtr-col>
16
+ <cdtr-col sm="3">
17
+ <cdtr-dropdown custom overflow maxHeight="900px" top=${200}>
18
+ <paper-button slot="trigger"
19
+ ><cdtr-box-shadow-icon
20
+ .iconStyle="box-shadow:${this.value};"
21
+ ></cdtr-box-shadow-icon
22
+ ></paper-button>
23
+ <div slot="content">
24
+ <div>
25
+ ${"design"===this.tabName?a.qy`
26
+ <cdtr-editor-container>
27
+ <h1 class="mb-2">
28
+ <lang-text
29
+ whiteSpace="break-spaces"
30
+ text="box-shadow"
31
+ ></lang-text>
32
+ </h1>
33
+ <cdtr-width-editor
34
+ text="horizontal_shadow_length"
35
+ unit="px"
36
+ max="200"
37
+ min="-200"
38
+ .value=${f.offsetX}
39
+ @input=${p=>this.onChangeBoxShadow("offsetX",p.target.value)}
40
+ ></cdtr-width-editor>
41
+ </cdtr-editor-container>
42
+ <cdtr-editor-container>
43
+ <cdtr-width-editor
44
+ text="vertical_shadow_length"
45
+ unit="px"
46
+ max="400"
47
+ min="-400"
48
+ .value=${f.offsetY}
49
+ @input=${p=>this.onChangeBoxShadow("offsetY",p.target.value)}
50
+ ></cdtr-width-editor>
51
+ </cdtr-editor-container>
52
+ <cdtr-editor-container>
53
+ <cdtr-width-editor
54
+ text="blur_radius"
55
+ unit="px"
56
+ max="400"
57
+ min="0"
58
+ .value=${f.blurRadius}
59
+ @input=${p=>this.onChangeBoxShadow("blurRadius",p.target.value)}
60
+ ></cdtr-width-editor>
61
+ </cdtr-editor-container>
62
+ <cdtr-editor-container>
63
+ <cdtr-width-editor
64
+ text="spread_radius"
65
+ unit="px"
66
+ max="200"
67
+ min="-200"
68
+ .value=${f.spreadRadius}
69
+ @input=${p=>this.onChangeBoxShadow("spreadRadius",p.target.value)}
70
+ ></cdtr-width-editor>
71
+ </cdtr-editor-container>
72
+ <cdtr-editor-container>
73
+ <cdtr-colorpicker-editor
74
+ @input=${p=>this.onChangeBoxShadow("color",p.target.value)}
75
+ .value=${f.color}
76
+ text="shadow_color"
77
+ ></cdtr-colorpicker-editor>
78
+ </cdtr-editor-container>
79
+
80
+ <cdtr-editor-container>
81
+ <cdtr-row justify="space-between" alignItems="center">
82
+ <cdtr-title
83
+ ><lang-text text="inset"></lang-text
84
+ ></cdtr-title>
85
+ <cdtr-toggle
86
+ @change=${p=>this.onChangeBoxShadow("inset",!p.target.checked)}
87
+ ></cdtr-toggle>
88
+ </cdtr-row>
89
+ </cdtr-editor-container>
90
+ `:null}
91
+ ${"gallery"===this.tabName?a.qy`<cdtr-row
92
+ style="overflow-y: auto;
93
+ max-height: 90vh;max-width:500px;"
94
+ justify="center"
95
+ spacing="10px"
96
+ >
97
+ ${d.map(p=>a.qy` <cdtr-col sm="5" style="height:120px;"
98
+ ><paper-button
99
+ @click=${()=>this.changeBoxShadowValue(p.rule)}
100
+ style="box-shadow:${p.rule};margin:0 25px;width:90%;height:90%;"
101
+ ></paper-button
102
+ ></cdtr-col>`)}
103
+ </cdtr-row>`:null}
104
+ </div>
105
+ </div>
106
+ </cdtr-dropdown>
107
+ </cdtr-col>
108
+ </cdtr-row>
109
+ </cdtr-editor-container>
110
+ `}}).styles=a.AH`
111
+ :host {
112
+ direction: var(--direction-locale);
113
+ }
114
+ `,b=c,g=(0,t.A)(b.prototype,"value",[s],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),u=(0,t.A)(b.prototype,"boxShadow",[n],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),b);customElements.define("cdtr-box-shadow-editor",m)}}]);
Binary file