@ckeditor/ckeditor5-widget 47.6.1 → 48.0.0-alpha.0

package/LICENSE.md

@@ -18,7 +18,7 @@ Where not otherwise indicated, all CKEditor 5 content is authored by CKSour
 
 The following libraries are included in CKEditor 5 under the [MIT license](https://opensource.org/licenses/MIT):
 
-* es-toolkit - Copyright (c) 2024 Viva Republica, Inc.
+* es-toolkit - Copyright (c) 2024 Viva Republica, Inc and Copyright OpenJS Foundation and other contributors.
 
 Trademarks
 ----------

package/dist/index-editor.css

@@ -3,184 +3,546 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
  */
 :root{
-	--ck-color-resizer:var(--ck-color-focus-border);
-	--ck-color-resizer-tooltip-background:hsl(0, 0%, 15%);
-	--ck-color-resizer-tooltip-text:hsl(0, 0%, 95%);
+  --ck-widget-outline-thickness:3px;
+  --ck-widget-handler-icon-size:16px;
+  --ck-widget-handler-animation-duration:.2s;
+  --ck-widget-handler-animation-curve:ease;
+  --ck-color-widget-blurred-border:#dedede;
+  --ck-color-widget-hover-border:#ffc83d;
+  --ck-color-widget-editable-focus-background:var(--ck-color-base-background);
+  --ck-color-widget-drag-handler-icon-color:var(--ck-color-base-background);
+  --ck-color-resizer:var(--ck-color-focus-border);
+  --ck-color-resizer-tooltip-background:#262626;
+  --ck-color-resizer-tooltip-text:#f2f2f2;
+  --ck-resizer-border-radius:var(--ck-border-radius);
+  --ck-resizer-tooltip-offset:10px;
+  --ck-resizer-tooltip-height:calc(var(--ck-spacing-small) * 2 + 10px);
+}
+
+.ck .ck-widget{
+  outline-width:var(--ck-widget-outline-thickness);
+  transition:outline-color var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
+  outline-style:solid;
+  outline-color:#0000;
+}
+
+@media (prefers-reduced-motion: reduce){
+  .ck .ck-widget{
+    transition:none;
+  }
+}
 
-	--ck-resizer-border-radius:var(--ck-border-radius);
-	--ck-resizer-tooltip-offset:10px;
-	--ck-resizer-tooltip-height:calc(var(--ck-spacing-small) * 2 + 10px);
+.ck .ck-widget.ck-widget_selected, .ck .ck-widget.ck-widget_selected:hover{
+  outline:var(--ck-widget-outline-thickness) solid var(--ck-color-focus-border);
+}
+
+.ck .ck-widget:hover{
+  outline-color:var(--ck-color-widget-hover-border);
 }
 
 .ck .ck-widget{
-	position:relative;
+  position:relative;
 }
 
-.ck .ck-widget.ck-widget_with-selection-handle{
-	position:relative;
+.ck .ck-editor__nested-editable{
+  border:1px solid #0000;
+}
+
+.ck .ck-editor__nested-editable.ck-editor__nested-editable_focused, .ck .ck-editor__nested-editable:focus{
+  box-shadow:var(--ck-inner-shadow), 0 0;
+}
+
+@media (forced-colors: none){
+  .ck .ck-editor__nested-editable.ck-editor__nested-editable_focused, .ck .ck-editor__nested-editable:focus{
+    background-color:var(--ck-color-widget-editable-focus-background);
+  }
+}
+
+:is(.ck .ck-editor__nested-editable.ck-editor__nested-editable_focused, .ck .ck-editor__nested-editable:focus):not(td, th){
+  border:var(--ck-focus-ring);
+  outline:none;
 }
 
 .ck .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle{
-		position:absolute;
-	}
+  box-sizing:border-box;
+  opacity:0;
+  transition:background-color var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve), visibility var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve), opacity var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
+  border-radius:var(--ck-border-radius) var(--ck-border-radius) 0 0;
+  left:calc(0px - var(--ck-widget-outline-thickness));
+  background-color:#0000;
+  padding:4px;
+  top:0;
+  transform:translateY(-100%);
+}
+
+@media (prefers-reduced-motion: reduce){
+  .ck .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle{
+    transition:none;
+  }
+}
+
+.ck .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle .ck-icon{
+  width:var(--ck-widget-handler-icon-size);
+  height:var(--ck-widget-handler-icon-size);
+  color:var(--ck-color-widget-drag-handler-icon-color);
+}
+
+.ck .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle .ck-icon .ck-icon__selected-indicator{
+  opacity:0;
+  transition:opacity .3s var(--ck-widget-handler-animation-curve);
+}
+
+@media (prefers-reduced-motion: reduce){
+  .ck .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle .ck-icon .ck-icon__selected-indicator{
+    transition:none;
+  }
+}
 
 .ck .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle .ck-icon{
-			display:block;
-		}
+  display:block;
+}
+
+.ck .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle:hover .ck-icon .ck-icon__selected-indicator{
+  opacity:1;
+}
+
+.ck .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle{
+  position:absolute;
+}
 
 .ck .ck-widget.ck-widget_with-selection-handle:hover > .ck-widget__selection-handle{
-		visibility:visible;
-	}
+  opacity:1;
+  background-color:var(--ck-color-widget-hover-border);
+  visibility:visible;
+}
 
-.ck .ck-widget.ck-widget_with-selection-handle.ck-widget_selected > .ck-widget__selection-handle{
-		visibility:visible;
-	}
+:is(.ck .ck-widget.ck-widget_with-selection-handle.ck-widget_selected, .ck .ck-widget.ck-widget_with-selection-handle.ck-widget_selected:hover) > .ck-widget__selection-handle{
+  opacity:1;
+  background-color:var(--ck-color-focus-border);
+  visibility:visible;
+}
+
+:is(.ck .ck-widget.ck-widget_with-selection-handle.ck-widget_selected, .ck .ck-widget.ck-widget_with-selection-handle.ck-widget_selected:hover) > .ck-widget__selection-handle .ck-icon .ck-icon__selected-indicator{
+  opacity:1;
+}
+
+.ck .ck-widget.ck-widget_with-selection-handle{
+  position:relative;
+}
+
+.ck[dir="rtl"] .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle{
+  left:auto;
+  right:calc(0px - var(--ck-widget-outline-thickness));
+}
+
+.ck.ck-editor__editable.ck-read-only .ck-widget{
+  transition:none;
+}
+
+.ck.ck-editor__editable.ck-read-only .ck-widget:not(.ck-widget_selected){
+  --ck-widget-outline-thickness:0px;
+}
+
+.ck.ck-editor__editable.ck-read-only .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle, .ck.ck-editor__editable.ck-read-only .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle:hover{
+  background:var(--ck-color-widget-blurred-border);
+}
+
+.ck .ck-widget:has(.ck-widget.table:hover){
+  outline-color:#0000;
+}
+
+.ck .ck-widget.ck-widget_with-selection-handle:has(.ck-widget.table:hover) > .ck-widget__selection-handle{
+  opacity:0;
+  visibility:hidden;
+}
+
+.ck.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected, .ck.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected:hover{
+  outline-color:var(--ck-color-widget-blurred-border);
+}
+
+:is(.ck.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected, .ck.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected:hover).ck-widget_with-selection-handle > .ck-widget__selection-handle, :is(.ck.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected, .ck.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected:hover).ck-widget_with-selection-handle > .ck-widget__selection-handle:hover{
+  background:var(--ck-color-widget-blurred-border);
+}
+
+.ck.ck-editor__editable:not(.ck-pagination-view) > .ck-widget.ck-widget_with-selection-handle:first-child, .ck.ck-editor__editable:not(.ck-pagination-view) blockquote > .ck-widget.ck-widget_with-selection-handle:first-child{
+  margin-top:calc(1em + var(--ck-widget-handler-icon-size));
+}
 
 .ck .ck-size-view{
-	background:var(--ck-color-resizer-tooltip-background);
-	color:var(--ck-color-resizer-tooltip-text);
-	border:1px solid var(--ck-color-resizer-tooltip-text);
-	border-radius:var(--ck-resizer-border-radius);
-	font-size:var(--ck-font-size-tiny);
-	display:block;
-	padding:0 var(--ck-spacing-small);
-	height:var(--ck-resizer-tooltip-height);
-	line-height:var(--ck-resizer-tooltip-height);
-}
-
-.ck .ck-size-view.ck-orientation-top-left,
-	.ck .ck-size-view.ck-orientation-top-right,
-	.ck .ck-size-view.ck-orientation-bottom-right,
-	.ck .ck-size-view.ck-orientation-bottom-left,
-	.ck .ck-size-view.ck-orientation-above-center{
-		position:absolute;
-	}
+  background:var(--ck-color-resizer-tooltip-background);
+  color:var(--ck-color-resizer-tooltip-text);
+  border:1px solid var(--ck-color-resizer-tooltip-text);
+  border-radius:var(--ck-resizer-border-radius);
+  font-size:var(--ck-font-size-tiny);
+  padding:0 var(--ck-spacing-small);
+  height:var(--ck-resizer-tooltip-height);
+  line-height:var(--ck-resizer-tooltip-height);
+  display:block;
+}
+
+.ck .ck-size-view.ck-orientation-top-left, .ck .ck-size-view.ck-orientation-top-right, .ck .ck-size-view.ck-orientation-bottom-right, .ck .ck-size-view.ck-orientation-bottom-left, .ck .ck-size-view.ck-orientation-above-center{
+  position:absolute;
+}
 
 .ck .ck-size-view.ck-orientation-top-left{
-		top:var(--ck-resizer-tooltip-offset);
-		left:var(--ck-resizer-tooltip-offset);
-	}
+  top:var(--ck-resizer-tooltip-offset);
+  left:var(--ck-resizer-tooltip-offset);
+}
 
 .ck .ck-size-view.ck-orientation-top-right{
-		top:var(--ck-resizer-tooltip-offset);
-		right:var(--ck-resizer-tooltip-offset);
-	}
+  top:var(--ck-resizer-tooltip-offset);
+  right:var(--ck-resizer-tooltip-offset);
+}
 
 .ck .ck-size-view.ck-orientation-bottom-right{
-		bottom:var(--ck-resizer-tooltip-offset);
-		right:var(--ck-resizer-tooltip-offset);
-	}
+  bottom:var(--ck-resizer-tooltip-offset);
+  right:var(--ck-resizer-tooltip-offset);
+}
 
 .ck .ck-size-view.ck-orientation-bottom-left{
-		bottom:var(--ck-resizer-tooltip-offset);
-		left:var(--ck-resizer-tooltip-offset);
-	}
+  bottom:var(--ck-resizer-tooltip-offset);
+  left:var(--ck-resizer-tooltip-offset);
+}
 
 .ck .ck-size-view.ck-orientation-above-center{
-		top:calc(var(--ck-resizer-tooltip-height) * -1);
-		left:50%;
-		transform:translate(-50%);
-	}
+  top:calc(var(--ck-resizer-tooltip-height) * -1);
+  left:50%;
+  transform:translate(-50%);
+}
 
-.ck .ck-widget_with-resizer{
-	position:relative;
+:root{
+  --ck-resizer-size:10px;
+  --ck-resizer-offset:calc(( var(--ck-resizer-size) / -2) - 2px);
+  --ck-resizer-border-width:1px;
 }
 
 .ck .ck-widget__resizer{
-	display:none;
-	position:absolute;
-	pointer-events:none;
+  outline:1px solid var(--ck-color-resizer);
+  pointer-events:none;
+  display:none;
+  position:absolute;
+  top:0;
+  left:0;
+}
+
+.ck .ck-widget__resizer__handle{
+  width:var(--ck-resizer-size);
+  height:var(--ck-resizer-size);
+  background:var(--ck-color-focus-border);
+  border:var(--ck-resizer-border-width) solid #fff;
+  border-radius:var(--ck-resizer-border-radius);
+  pointer-events:all;
+  position:absolute;
+}
 
-	left:0;
-	top:0;
+.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-top-left{
+  top:var(--ck-resizer-offset);
+  left:var(--ck-resizer-offset);
 }
 
-.ck-focused .ck-widget_with-resizer.ck-widget_selected > .ck-widget__resizer{
-		display:block;
-	}
+.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-top-right{
+  top:var(--ck-resizer-offset);
+  right:var(--ck-resizer-offset);
+}
 
-.ck .ck-widget__resizer__handle{
-	position:absolute;
-	pointer-events:all;
+.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-bottom-right{
+  bottom:var(--ck-resizer-offset);
+  right:var(--ck-resizer-offset);
 }
 
-.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-top-left,
-	.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-bottom-right{
-		cursor:nwse-resize;
-	}
+.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-bottom-left{
+  bottom:var(--ck-resizer-offset);
+  left:var(--ck-resizer-offset);
+}
+
+.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-top-left, .ck .ck-widget__resizer__handle.ck-widget__resizer__handle-bottom-right{
+  cursor:nwse-resize;
+}
+
+.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-top-right, .ck .ck-widget__resizer__handle.ck-widget__resizer__handle-bottom-left{
+  cursor:nesw-resize;
+}
+
+.ck .ck-widget_with-resizer{
+  position:relative;
+}
+
+.ck-focused .ck-widget_with-resizer.ck-widget_selected > .ck-widget__resizer{
+  display:block;
+}
 
-.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-top-right,
-	.ck .ck-widget__resizer__handle.ck-widget__resizer__handle-bottom-left{
-		cursor:nesw-resize;
-	}
+:root{
+  --ck-widget-type-around-button-size:20px;
+  --ck-color-widget-type-around-button-active:var(--ck-color-focus-border);
+  --ck-color-widget-type-around-button-hover:var(--ck-color-widget-hover-border);
+  --ck-color-widget-type-around-button-blurred-editable:var(--ck-color-widget-blurred-border);
+  --ck-color-widget-type-around-button-radar-start-alpha:0;
+  --ck-color-widget-type-around-button-radar-end-alpha:.3;
+  --ck-color-widget-type-around-button-icon:var(--ck-color-base-background);
+}
 
 .ck .ck-widget .ck-widget__type-around__button{
-		display:block;
-		position:absolute;
-		overflow:hidden;
-		z-index:var(--ck-z-default);
-	}
+  width:var(--ck-widget-type-around-button-size);
+  height:var(--ck-widget-type-around-button-size);
+  background:var(--ck-color-widget-type-around-button);
+  transition:opacity var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve), background var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
+  opacity:0;
+  pointer-events:none;
+  z-index:var(--ck-z-default);
+  border-radius:100px;
+  display:block;
+  position:absolute;
+  overflow:hidden;
+}
+
+@media (prefers-reduced-motion: reduce){
+  .ck .ck-widget .ck-widget__type-around__button{
+    transition:none;
+  }
+}
 
 .ck .ck-widget .ck-widget__type-around__button svg{
-			position:absolute;
-			top:50%;
-			left:50%;
-			z-index:calc(var(--ck-z-default) + 2);
-		}
+  width:10px;
+  height:8px;
+  margin-top:1px;
+  transition:transform .5s;
+  position:absolute;
+  top:50%;
+  left:50%;
+  transform:translate(-50%, -50%);
+}
 
-.ck .ck-widget .ck-widget__type-around__button.ck-widget__type-around__button_before{
-			top:calc(-0.5 * var(--ck-widget-outline-thickness));
-			left:min(10%, 30px);
+@media (prefers-reduced-motion: reduce){
+  .ck .ck-widget .ck-widget__type-around__button svg{
+    transition:none;
+  }
+}
+
+.ck .ck-widget .ck-widget__type-around__button svg *{
+  stroke-dasharray:10;
+  stroke-dashoffset:0;
+  fill:none;
+  stroke:var(--ck-color-widget-type-around-button-icon);
+  stroke-width:1.5px;
+  stroke-linecap:round;
+  stroke-linejoin:round;
+}
+
+.ck .ck-widget .ck-widget__type-around__button svg line{
+  stroke-dasharray:7;
+}
+
+.ck .ck-widget .ck-widget__type-around__button svg{
+  z-index:calc(var(--ck-z-default) + 2);
+}
+
+.ck .ck-widget .ck-widget__type-around__button:hover{
+  animation:1s infinite ck-widget-type-around-button-sonar;
+}
+
+.ck .ck-widget .ck-widget__type-around__button:hover svg polyline{
+  animation:2s linear ck-widget-type-around-arrow-dash;
+}
+
+.ck .ck-widget .ck-widget__type-around__button:hover svg line{
+  animation:2s linear ck-widget-type-around-arrow-tip-dash;
+}
+
+@media (prefers-reduced-motion: reduce){
+  .ck .ck-widget .ck-widget__type-around__button:hover{
+    animation:none;
+  }
+
+  .ck .ck-widget .ck-widget__type-around__button:hover svg polyline, .ck .ck-widget .ck-widget__type-around__button:hover svg line{
+    animation:none;
+  }
+}
 
-			transform:translateY(-50%);
-		}
+.ck .ck-widget .ck-widget__type-around__button.ck-widget__type-around__button_before{
+  top:calc(-.5 * var(--ck-widget-outline-thickness));
+  left:min(10%, 30px);
+  transform:translateY(-50%);
+}
 
 .ck .ck-widget .ck-widget__type-around__button.ck-widget__type-around__button_after{
-			bottom:calc(-0.5 * var(--ck-widget-outline-thickness));
-			right:min(10%, 30px);
+  bottom:calc(-.5 * var(--ck-widget-outline-thickness));
+  right:min(10%, 30px);
+  transform:translateY(50%);
+}
 
-			transform:translateY(50%);
-		}
+.ck .ck-widget:hover > .ck-widget__type-around > .ck-widget__type-around__button{
+  opacity:1;
+  pointer-events:auto;
+}
 
-.ck .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button::after, .ck .ck-widget > .ck-widget__type-around > .ck-widget__type-around__button:hover::after{
-			content:"";
-			display:block;
-			position:absolute;
-			top:1px;
-			left:1px;
-			z-index:calc(var(--ck-z-default) + 1);
-		}
+.ck .ck-widget:not(.ck-widget_selected) > .ck-widget__type-around > .ck-widget__type-around__button{
+  background:var(--ck-color-widget-type-around-button-hover);
+}
+
+.ck .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button, .ck .ck-widget > .ck-widget__type-around > .ck-widget__type-around__button:hover{
+  background:var(--ck-color-widget-type-around-button-active);
+}
+
+:is(.ck .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button, .ck .ck-widget > .ck-widget__type-around > .ck-widget__type-around__button:hover):after{
+  width:calc(var(--ck-widget-type-around-button-size) - 2px);
+  height:calc(var(--ck-widget-type-around-button-size) - 2px);
+  content:"";
+  z-index:calc(var(--ck-z-default) + 1);
+  background:linear-gradient(135deg, #fff0 0%, #ffffff4d 100%);
+  border-radius:100px;
+  display:block;
+  position:absolute;
+  top:1px;
+  left:1px;
+}
+
+.ck .ck-widget.ck-widget_selected.ck-widget_type-around_show-fake-caret_before, .ck .ck-widget.ck-widget_selected.ck-widget_type-around_show-fake-caret_after{
+  outline-color:#0000;
+}
+
+.ck .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button{
+  opacity:1;
+  pointer-events:auto;
+}
+
+.ck .ck-widget.ck-widget_with-selection-handle > .ck-widget__type-around > .ck-widget__type-around__button_before{
+  margin-left:20px;
+}
+
+.ck .ck-widget .ck-widget__type-around__fake-caret{
+  pointer-events:none;
+  background:var(--ck-color-base-text);
+  outline:1px solid #ffffff80;
+  height:1px;
+  animation:1s linear infinite forwards ck-widget-type-around-fake-caret-pulse;
+}
+
+:is(.ck .ck-widget.ck-widget_type-around_show-fake-caret_before, .ck .ck-widget.ck-widget_type-around_show-fake-caret_after).ck-widget_selected:hover{
+  outline-color:var(--ck-color-widget-hover-border);
+}
+
+:is(.ck .ck-widget.ck-widget_type-around_show-fake-caret_before, .ck .ck-widget.ck-widget_type-around_show-fake-caret_after) > .ck-widget__type-around > .ck-widget__type-around__button{
+  opacity:0;
+  pointer-events:none;
+}
+
+:is(:is(.ck .ck-widget.ck-widget_type-around_show-fake-caret_before, .ck .ck-widget.ck-widget_type-around_show-fake-caret_after).ck-widget_with-selection-handle.ck-widget_selected, :is(.ck .ck-widget.ck-widget_type-around_show-fake-caret_before, .ck .ck-widget.ck-widget_type-around_show-fake-caret_after).ck-widget_with-selection-handle.ck-widget_selected:hover) > .ck-widget__selection-handle{
+  opacity:0;
+}
+
+:is(.ck .ck-widget.ck-widget_type-around_show-fake-caret_before, .ck .ck-widget.ck-widget_type-around_show-fake-caret_after).ck-widget_selected.ck-widget_with-resizer > .ck-widget__resizer{
+  opacity:0;
+}
 
 .ck .ck-widget > .ck-widget__type-around > .ck-widget__type-around__fake-caret{
-		display:none;
-		position:absolute;
-		left:0;
-		right:0;
-	}
+  display:none;
+  position:absolute;
+  left:0;
+  right:0;
+}
 
 .ck .ck-widget:hover > .ck-widget__type-around > .ck-widget__type-around__fake-caret{
-		left:calc( -1 * var(--ck-widget-outline-thickness));
-		right:calc( -1 * var(--ck-widget-outline-thickness));
-	}
+  left:calc(-1 * var(--ck-widget-outline-thickness));
+  right:calc(-1 * var(--ck-widget-outline-thickness));
+}
 
 .ck .ck-widget.ck-widget_type-around_show-fake-caret_before > .ck-widget__type-around > .ck-widget__type-around__fake-caret{
-		top:calc( -1 * var(--ck-widget-outline-thickness) - 1px);
-		display:block;
-	}
+  top:calc(-1 * var(--ck-widget-outline-thickness) - 1px);
+  display:block;
+}
 
 .ck .ck-widget.ck-widget_type-around_show-fake-caret_after > .ck-widget__type-around > .ck-widget__type-around__fake-caret{
-		bottom:calc( -1 * var(--ck-widget-outline-thickness) - 1px);
-		display:block;
-	}
-.ck.ck-editor__editable.ck-read-only .ck-widget__type-around{
-	display:none;
+  bottom:calc(-1 * var(--ck-widget-outline-thickness) - 1px);
+  display:block;
 }
-.ck.ck-editor__editable.ck-widget__type-around_disabled .ck-widget__type-around{
-	display:none;
+
+.ck[dir="rtl"] .ck-widget.ck-widget_with-selection-handle .ck-widget__type-around > .ck-widget__type-around__button_before{
+  margin-left:0;
+  margin-right:20px;
+}
+
+:is(.ck-editor__nested-editable.ck-editor__editable_selected .ck-widget.ck-widget_selected, .ck-editor__nested-editable.ck-editor__editable_selected .ck-widget:hover) > .ck-widget__type-around > .ck-widget__type-around__button{
+  opacity:0;
+  pointer-events:none;
+}
+
+.ck .ck-widget:has(.ck-widget.table:hover) > .ck-widget__type-around > .ck-widget__type-around__button{
+  opacity:0;
+  pointer-events:none;
 }
+
+.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button:not(:hover){
+  background:var(--ck-color-widget-type-around-button-blurred-editable);
+}
+
+.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button:not(:hover) svg *{
+  stroke:#999;
+}
+
+@keyframes ck-widget-type-around-arrow-dash{
+  0%{
+    stroke-dashoffset:10px;
+  }
+
+  20%, 100%{
+    stroke-dashoffset:0;
+  }
+}
+
+@keyframes ck-widget-type-around-arrow-tip-dash{
+  0%, 20%{
+    stroke-dashoffset:7px;
+  }
+
+  40%, 100%{
+    stroke-dashoffset:0;
+  }
+}
+
+@keyframes ck-widget-type-around-button-sonar{
+  0%{
+    box-shadow:0 0 0 0 hsla(var(--ck-color-focus-border-coordinates), var(--ck-color-widget-type-around-button-radar-start-alpha));
+  }
+
+  50%{
+    box-shadow:0 0 0 5px hsla(var(--ck-color-focus-border-coordinates), var(--ck-color-widget-type-around-button-radar-end-alpha));
+  }
+
+  100%{
+    box-shadow:0 0 0 5px hsla(var(--ck-color-focus-border-coordinates), var(--ck-color-widget-type-around-button-radar-start-alpha));
+  }
+}
+
+@keyframes ck-widget-type-around-fake-caret-pulse{
+  0%{
+    opacity:1;
+  }
+
+  49%{
+    opacity:1;
+  }
+
+  50%{
+    opacity:0;
+  }
+
+  99%{
+    opacity:0;
+  }
+
+  100%{
+    opacity:1;
+  }
+}
+
+.ck.ck-editor__editable.ck-read-only .ck-widget__type-around, .ck.ck-editor__editable.ck-widget__type-around_disabled .ck-widget__type-around{
+  display:none;
+}
+
 .ck.ck-editor__editable.ck-restricted-editing_mode_restricted .ck-widget__type-around{
-		display:none;
-	}
+  display:none;
+}
+
 .ck.ck-editor__editable.ck-restricted-editing_mode_restricted div.restricted-editing-exception .ck-widget__type-around{
-		display:initial;
-	}
+  display:initial;
+}