@ckeditor/ckeditor5-link 47.6.1-alpha.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.
 * Regular expression for URL validation - Copyright (c) 2010-2018 Diego Perini.
 
 Trademarks

package/ckeditor5-metadata.json

@@ -5,7 +5,7 @@
 			"className": "AutoLink",
 			"description": "Automatically turns plain text links in the document into active URLs as you write. Works for emails, too.",
 			"docs": "features/link.html#autolink-feature",
-			"path": "src/autolink.js",
+			"path": "src/autolink.ts",
 			"requires": [
 				"Link"
 			]
@@ -15,12 +15,12 @@
 			"className": "Link",
 			"description": "Brings support for inserting hyperlinks into the content and offers the UI to create and edit them.",
 			"docs": "features/link.html",
-			"path": "src/link.js",
+			"path": "src/link.ts",
 			"uiComponents": [
 				{
 					"type": "Button",
 					"name": "link",
-					"iconPath": "@ckeditor/ckeditor5-icons/theme/icons/link.svg"
+					"iconName": "IconLink"
 				}
 			],
 			"htmlOutput": [
@@ -52,7 +52,7 @@
 			"className": "LinkImage",
 			"description": "Allows adding clickable links to images for creating banners or referrers.",
 			"docs": "features/images/images-linking.html",
-			"path": "src/linkimage.js",
+			"path": "src/linkimage.ts",
 			"requires": [
 				"Link",
 				"ImageBlock"
@@ -61,10 +61,10 @@
 				{
 					"type": "Button",
 					"name": "linkImage",
-					"iconPath": "@ckeditor/ckeditor5-icons/theme/icons/link.svg",
 					"toolbars": [
 						"image.toolbar"
-					]
+					],
+					"iconName": "IconLink"
 				}
 			],
 			"htmlOutput": [

package/{src → dist}/autolink.d.ts

@@ -5,8 +5,8 @@
 /**
  * @module link/autolink
  */
-import { Plugin } from 'ckeditor5/src/core.js';
-import { Delete } from 'ckeditor5/src/typing.js';
+import { Plugin } from '@ckeditor/ckeditor5-core';
+import { Delete } from '@ckeditor/ckeditor5-typing';
 import { LinkEditing } from './linkediting.js';
 /**
  * The autolink plugin.

package/dist/index-editor.css

@@ -2,137 +2,213 @@
  * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
  */
+.ck .ck-link_selected{
+  background:var(--ck-color-link-selected-background);
+}
+
+.ck .ck-link_selected span.image-inline{
+  outline:var(--ck-widget-outline-thickness) solid var(--ck-color-link-selected-background);
+}
+
+.ck .ck-fake-link-selection{
+  background:var(--ck-color-link-fake-selection);
+}
+
+.ck .ck-fake-link-selection_collapsed{
+  border-right:1px solid var(--ck-color-base-text);
+  outline:1px solid #ffffff80;
+  height:100%;
+  margin-right:-1px;
+}
+
+:root{
+  --ck-link-bookmark-icon-size:calc(var(--ck-icon-size) * .7);
+}
+
+.ck.ck-toolbar.ck-link-toolbar > .ck-toolbar__items{
+  flex-wrap:nowrap;
+}
+
+a.ck.ck-button.ck-link-toolbar__preview{
+  padding:0 var(--ck-spacing-medium);
+  color:var(--ck-color-link-default);
+  cursor:pointer;
+  justify-content:center;
+}
+
+a.ck.ck-button.ck-link-toolbar__preview .ck.ck-button__label{
+  text-overflow:ellipsis;
+  max-width:var(--ck-input-width);
+}
+
+a.ck.ck-button.ck-link-toolbar__preview, a.ck.ck-button.ck-link-toolbar__preview:hover, a.ck.ck-button.ck-link-toolbar__preview:focus, a.ck.ck-button.ck-link-toolbar__preview:active{
+  background:none;
+}
+
+a.ck.ck-button.ck-link-toolbar__preview:active{
+  box-shadow:none;
+}
+
+a.ck.ck-button.ck-link-toolbar__preview:hover, a.ck.ck-button.ck-link-toolbar__preview:focus{
+  text-decoration:underline;
+}
+
+a.ck.ck-button.ck-link-toolbar__preview.ck-button_with-text .ck.ck-icon.ck-button__icon{
+  width:var(--ck-link-bookmark-icon-size);
+  height:var(--ck-link-bookmark-icon-size);
+}
+
+[dir="ltr"] :is(a.ck.ck-button.ck-link-toolbar__preview.ck-button_with-text .ck.ck-icon.ck-button__icon){
+  margin-right:var(--ck-spacing-tiny);
+  margin-left:var(--ck-spacing-small);
+}
+
+[dir="rtl"] :is(a.ck.ck-button.ck-link-toolbar__preview.ck-button_with-text .ck.ck-icon.ck-button__icon){
+  margin-left:var(--ck-spacing-tiny);
+  margin-right:var(--ck-spacing-small);
+}
+
+a.ck.ck-button.ck-link-toolbar__preview:has(.ck-icon){
+  padding-left:var(--ck-spacing-extra-tiny);
+}
+
 .ck.ck-link-toolbar__preview{
-	display:inline-block;
+  display:inline-block;
 }
 
 .ck.ck-link-toolbar__preview .ck-button__label{
-		overflow:hidden;
-	}
-
-.ck.ck-editor__editable figure.image > a::after, .ck.ck-editor__editable a span.image-inline::after{
-			display:block;
-			position:absolute;
-		}
-
-.ck-vertical-form .ck-button::after{
-		content:"";
-		width:0;
-		position:absolute;
-		right:-1px;
-		top:-1px;
-		bottom:-1px;
-		z-index:1;
-	}
-
-.ck-vertical-form .ck-button:focus::after{
-		display:none;
-	}
-
-@media screen and (max-width: 600px){
-			.ck.ck-responsive-form .ck-button::after{
-				content:"";
-				width:0;
-				position:absolute;
-				right:-1px;
-				top:-1px;
-				bottom:-1px;
-				z-index:1;
-			}
-
-			.ck.ck-responsive-form .ck-button:focus::after{
-				display:none;
-			}
-	}
+  overflow:hidden;
+}
 
 :root{
-	--ck-form-default-width:340px;
+  --ck-link-image-indicator-icon-size:20;
+  --ck-link-image-indicator-icon-is-visible:clamp(0px, 100% - 50px, 1px);
 }
 
-.ck.ck-form{
-	padding:0 0 var(--ck-spacing-large);
+:is(.ck.ck-editor__editable figure.image > a, .ck.ck-editor__editable a span.image-inline):after{
+  content:"";
+  top:min(var(--ck-spacing-medium), 6%);
+  right:min(var(--ck-spacing-medium), 6%);
+  width:calc(var(--ck-link-image-indicator-icon-is-visible) * var(--ck-link-image-indicator-icon-size));
+  height:calc(var(--ck-link-image-indicator-icon-is-visible) * var(--ck-link-image-indicator-icon-size));
+  background-color:#0006;
+  background-image:url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjAgMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTExLjA3NyAxNSAuOTkxLTEuNDE2YS43NS43NSAwIDEgMSAxLjIyOS44NmwtMS4xNDggMS42NGEuNzQ4Ljc0OCAwIDAgMS0uMjE3LjIwNiA1LjI1MSA1LjI1MSAwIDAgMS04LjUwMy01Ljk1NS43NDEuNzQxIDAgMCAxIC4xMi0uMjc0bDEuMTQ3LTEuNjM5YS43NS43NSAwIDEgMSAxLjIyOC44Nkw0LjkzMyAxMC43bC4wMDYuMDAzYTMuNzUgMy43NSAwIDAgMCA2LjEzMiA0LjI5NGwuMDA2LjAwNHptNS40OTQtNS4zMzVhLjc0OC43NDggMCAwIDEtLjEyLjI3NGwtMS4xNDcgMS42MzlhLjc1Ljc1IDAgMSAxLTEuMjI4LS44NmwuODYtMS4yM2EzLjc1IDMuNzUgMCAwIDAtNi4xNDQtNC4zMDFsLS44NiAxLjIyOWEuNzUuNzUgMCAwIDEtMS4yMjktLjg2bDEuMTQ4LTEuNjRhLjc0OC43NDggMCAwIDEgLjIxNy0uMjA2IDUuMjUxIDUuMjUxIDAgMCAxIDguNTAzIDUuOTU1em0tNC41NjMtMi41MzJhLjc1Ljc1IDAgMCAxIC4xODQgMS4wNDVsLTMuMTU1IDQuNTA1YS43NS43NSAwIDEgMS0xLjIyOS0uODZsMy4xNTUtNC41MDZhLjc1Ljc1IDAgMCAxIDEuMDQ1LS4xODR6Ii8+PC9zdmc+");
+  background-position:center;
+  background-repeat:no-repeat;
+  background-size:14px;
+  border-radius:100%;
+  display:block;
+  position:absolute;
+  overflow:hidden;
 }
 
-.ck.ck-form.ck-form_default-width{
-		width:var(--ck-form-default-width);
-	}
+:root{
+  --ck-link-panel-width:340px;
+  --ck-link-provider-list-item-text-height:calc(var(--ck-line-height-base) * var(--ck-font-size-base));
+  --ck-link-provider-list-item-height:calc(var(--ck-link-provider-list-item-text-height) + var(--ck-spacing-small) + var(--ck-spacing-small));
+}
 
-.ck.ck-form:focus{
-		outline:none;
-	}
+@media screen and (width <= 600px){
+  :root{
+    --ck-link-panel-width:300px;
+  }
+}
 
-.ck.ck-form .ck.ck-input-text,
-	.ck.ck-form .ck.ck-input-number{
-		min-width:100%;
-		width:0;
-	}
+.ck.ck-form.ck-link-form{
+  width:var(--ck-link-panel-width);
+  padding-bottom:0;
+}
 
-.ck.ck-form .ck.ck-dropdown{
-		min-width:100%;
-	}
+@media screen and (width <= 600px){
+  .ck.ck-form.ck-link-form.ck-responsive-form .ck-labeled-field-view{
+    margin:0;
+  }
+}
 
-.ck.ck-form .ck.ck-dropdown .ck-dropdown__button:not(:focus){
-				border:1px solid var(--ck-color-base-border);
-			}
+.ck.ck-form.ck-link-form .ck-link-form__providers-list{
+  border-top:1px solid var(--ck-color-base-border);
+  flex-direction:column;
+  display:flex;
+}
 
-.ck.ck-form .ck.ck-dropdown .ck-dropdown__button .ck-button__label{
-				width:100%;
-			}
+.ck.ck-form.ck-link-form .ck-link-form__providers-list:has(.ck-list__item:nth-child(n+5)){
+  max-height:calc(var(--ck-link-provider-list-item-height) * 4 + var(--ck-spacing-large) + 1px);
+  overflow:auto;
+}
 
-@media screen and (max-width: 600px){
+.ck.ck-form.ck-link-form .ck-link-form__providers-list .ck-link__button{
+  padding:var(--ck-spacing-small) var(--ck-spacing-large);
+  border-radius:0;
+}
 
-.ck.ck-form.ck-responsive-form .ck.ck-form__row.ck-form__row_with-submit{
-					flex-direction:column;
-					align-items:stretch;
-					padding:0;
-			}
-	}
+.ck.ck-form.ck-link-form .ck-link-form__providers-list .ck-link__button > .ck-button__label{
+  text-overflow:ellipsis;
+  flex-grow:1;
+  overflow:hidden;
+}
 
-@media screen and (max-width: 600px){
+.ck.ck-link-form .ck-link__items:empty{
+  display:none;
+}
 
-.ck.ck-form.ck-responsive-form .ck.ck-form__row.ck-form__row_with-submit > .ck{
-						margin:var(--ck-spacing-large) var(--ck-spacing-large) 0;
-				}
-	}
+:root{
+  --ck-link-properties-width:340px;
+}
 
-@media screen and (max-width: 600px){
+@media screen and (width <= 600px){
+  :root{
+    --ck-link-properties-width:300px;
+  }
+}
 
-.ck.ck-form.ck-responsive-form .ck.ck-form__row.ck-form__row_with-submit .ck-button_with-text{
-						justify-content:center;
-				}
-	}
+.ck.ck-link-properties{
+  width:var(--ck-link-properties-width);
+}
 
-@media screen and (max-width: 600px){
+:root{
+  --ck-link-providers-width:340px;
+  --ck-link-list-view-max-height:240px;
+  --ck-link-list-view-icon-size:calc(var(--ck-icon-size) * .8);
+}
 
-.ck.ck-form.ck-responsive-form .ck.ck-form__row.ck-form__row_large-bottom-padding{
-					padding-bottom:var(--ck-spacing-large);
-			}
-	}
+@media screen and (width <= 600px){
+  :root{
+    --ck-link-providers-width:300px;
+  }
+}
 
-[dir="ltr"] .ck.ck-form.ck-responsive-form > :not(:first-child){
-				margin-left:0;
-			}
+.ck.ck-link-providers{
+  width:var(--ck-link-providers-width);
+}
 
-[dir="rtl"] .ck.ck-form.ck-responsive-form > :not(:last-child){
-				margin-left:0;
-			}
-.ck.ck-link-form .ck-link-form__providers-list{
-		display:flex;
-		flex-direction:column;
-	}
-.ck.ck-link-form .ck-link-form__providers-list .ck-link__button > .ck-button__label{
-				flex-grow:1;
-			}
-.ck.ck-link-form .ck-link__items:empty{
-		display:none;
-	}
+.ck.ck-link-providers .ck-form__header__label{
+  text-overflow:ellipsis;
+  overflow:hidden;
+}
 
 .ck.ck-link-providers > .ck-link-providers__list{
-		overflow-x:hidden;
-		overflow-y:auto;
-		overscroll-behavior:contain;
-	}
+  max-height:min(var(--ck-link-list-view-max-height), 40vh);
+  overflow:hidden auto;
+}
 
 .ck.ck-link-providers > .ck-link-providers__list .ck-button > .ck-icon{
-				flex-shrink:0;
-			}
+  width:var(--ck-link-list-view-icon-size);
+  height:var(--ck-link-list-view-icon-size);
+  flex-shrink:0;
+}
+
+.ck.ck-link-providers > .ck-link-providers__list .ck-button > .ck-button__label{
+  text-overflow:ellipsis;
+  white-space:nowrap;
+  overflow:hidden;
+}
+
+.ck.ck-link-providers > .ck-link-providers__list{
+  overscroll-behavior:contain;
+}
+
+.ck.ck-link-providers .ck-link__empty-list-info{
+  padding:calc(2 * var(--ck-spacing-large)) var(--ck-spacing-medium);
+  text-align:center;
+  font-style:italic;
+}