Skip to content
Snippets Groups Projects
Commit aa9e8a76 authored by Luhur Abdi Rizal's avatar Luhur Abdi Rizal Committed by Edouard Cunibil
Browse files

Issue #3416534 by el7cosmos, duaelfr, james.williams: Use built-in... 

Issue #3416534 by el7cosmos, duaelfr, james.williams: Use built-in CollapsibleView instead of DetailsView
parent 73e84157
No related branches found
No related tags found
1 merge request!18Use built-in CollapsibleView instead of DetailsView
Pipeline #474118 failed
Stage: build
Stage: validate
Stage: test
Hide whitespace changes
Inline Side-by-side
js/build/editorAdvancedLink.js
+ 1
− 1
View file @ aa9e8a76
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.CKEditor5=t():(e.CKEditor5=e.CKEditor5||{},e.CKEditor5.editorAdvancedLink=t())}(self,(()=>(()=>{var e={"./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./js/ckeditor5_plugins/editorAdvancedLink/src/details/details.css":(e,t,r)=>{"use strict";r.d(t,{Z:()=>a});var i=r("./node_modules/css-loader/dist/runtime/noSourceMaps.js"),s=r.n(i),n=r("./node_modules/css-loader/dist/runtime/api.js"),o=r.n(n)()(s());o.push([e.id,".ck.ck-form__details>summary{cursor:pointer}.ck.ck-form__details>summary:focus-visible{border:var(--ck-focus-ring);box-shadow:var(--ck-focus-outer-shadow),0 0}",""]);const a=o},"./node_modules/css-loader/dist/runtime/api.js":e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var r="",i=void 0!==t[5];return t[4]&&(r+="@supports (".concat(t[4],") {")),t[2]&&(r+="@media ".concat(t[2]," {")),i&&(r+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),r+=e(t),i&&(r+="}"),t[2]&&(r+="}"),t[4]&&(r+="}"),r})).join("")},t.i=function(e,r,i,s,n){"string"==typeof e&&(e=[[null,e,void 0]]);var o={};if(i)for(var a=0;a<this.length;a++){var l=this[a][0];null!=l&&(o[l]=!0)}for(var c=0;c<e.length;c++){var d=[].concat(e[c]);i&&o[d[0]]||(void 0!==n&&(void 0===d[5]||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=n),r&&(d[2]?(d[1]="@media ".concat(d[2]," {").concat(d[1],"}"),d[2]=r):d[2]=r),s&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=s):d[4]="".concat(s)),t.push(d))}},t}},"./node_modules/css-loader/dist/runtime/noSourceMaps.js":e=>{"use strict";e.exports=function(e){return e[1]}},"./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":(e,t,r)=>{"use strict";var i,s=function(){return void 0===i&&(i=Boolean(window&&document&&document.all&&!window.atob)),i},n=function(){var e={};return function(t){if(void 0===e[t]){var r=document.querySelector(t);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}e[t]=r}return e[t]}}(),o=[];function a(e){for(var t=-1,r=0;r<o.length;r++)if(o[r].identifier===e){t=r;break}return t}function l(e,t){for(var r={},i=[],s=0;s<e.length;s++){var n=e[s],l=t.base?n[0]+t.base:n[0],c=r[l]||0,d="".concat(l," ").concat(c);r[l]=c+1;var u=a(d),m={css:n[1],media:n[2],sourceMap:n[3]};-1!==u?(o[u].references++,o[u].updater(m)):o.push({identifier:d,updater:g(m,t),references:1}),i.push(d)}return i}function c(e){var t=document.createElement("style"),i=e.attributes||{};if(void 0===i.nonce){var s=r.nc;s&&(i.nonce=s)}if(Object.keys(i).forEach((function(e){t.setAttribute(e,i[e])})),"function"==typeof e.insert)e.insert(t);else{var o=n(e.insert||"head");if(!o)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");o.appendChild(t)}return t}var d,u=(d=[],function(e,t){return d[e]=t,d.filter(Boolean).join("\n")});function m(e,t,r,i){var s=r?"":i.media?"@media ".concat(i.media," {").concat(i.css,"}"):i.css;if(e.styleSheet)e.styleSheet.cssText=u(t,s);else{var n=document.createTextNode(s),o=e.childNodes;o[t]&&e.removeChild(o[t]),o.length?e.insertBefore(n,o[t]):e.appendChild(n)}}function h(e,t,r){var i=r.css,s=r.media,n=r.sourceMap;if(s?e.setAttribute("media",s):e.removeAttribute("media"),n&&"undefined"!=typeof btoa&&(i+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(n))))," */")),e.styleSheet)e.styleSheet.cssText=i;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(i))}}var f=null,p=0;function g(e,t){var r,i,s;if(t.singleton){var n=p++;r=f||(f=c(t)),i=m.bind(null,r,n,!1),s=m.bind(null,r,n,!0)}else r=c(t),i=h.bind(null,r,t),s=function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(r)};return i(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;i(e=t)}else s()}}e.exports=function(e,t){(t=t||{}).singleton||"boolean"==typeof t.singleton||(t.singleton=s());var r=l(e=e||[],t);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var i=0;i<r.length;i++){var s=a(r[i]);o[s].references--}for(var n=l(e,t),c=0;c<r.length;c++){var d=a(r[c]);0===o[d].references&&(o[d].updater(),o.splice(d,1))}r=n}}}},"ckeditor5/src/core.js":(e,t,r)=>{e.exports=r("dll-reference CKEditor5.dll")("./src/core.js")},"ckeditor5/src/typing.js":(e,t,r)=>{e.exports=r("dll-reference CKEditor5.dll")("./src/typing.js")},"ckeditor5/src/ui.js":(e,t,r)=>{e.exports=r("dll-reference CKEditor5.dll")("./src/ui.js")},"dll-reference CKEditor5.dll":e=>{"use strict";e.exports=CKEditor5.dll}},t={};function r(i){var s=t[i];if(void 0!==s)return s.exports;var n=t[i]={id:i,exports:{}};return e[i](n,n.exports,r),n.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var i in t)r.o(t,i)&&!r.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.nc=void 0;var i={};return(()=>{"use strict";r.d(i,{default:()=>p});var e=r("ckeditor5/src/core.js"),t=r("ckeditor5/src/typing.js");const s={linkTitle:{label:Drupal.t("Title"),viewAttribute:"title"},linkAriaLabel:{label:Drupal.t("ARIA label"),viewAttribute:"aria-label",group:"advanced"},linkClass:{label:Drupal.t("CSS classes"),viewAttribute:"class",group:"advanced"},linkId:{label:Drupal.t("ID"),viewAttribute:"id",group:"advanced"},linkRel:{label:Drupal.t("Link relationship"),viewAttribute:"rel",group:"advanced"}},n={advanced:{label:Drupal.t("Advanced")}};class o extends e.Plugin{static get pluginName(){return"EditorAdvancedLinkEditing"}init(){const e=this.editor.config.get("editorAdvancedLink");if(!e.options)return void(this.enabledModelNames=[]);const t=Object.values(e.options);this.enabledModelNames=Object.keys(s).filter((e=>t.includes(s[e].viewAttribute))),this.enabledModelNames.forEach((e=>{this._allowAndConvertExtraAttribute(e,s[e].viewAttribute),this._removeExtraAttributeOnUnlinkCommandExecute(e),this._refreshExtraAttributeValue(e)})),this._addExtraAttributeOnLinkCommandExecute(Object.keys(s))}_allowAndConvertExtraAttribute(e,t){const{editor:r}=this;r.model.schema.extend("$text",{allowAttributes:e}),r.conversion.for("downcast").attributeToElement({model:e,view:(e,{writer:r})=>{const i=r.createAttributeElement("a",{[t]:e},{priority:5});return r.setCustomProperty("link",!0,i),i}}),r.conversion.for("upcast").elementToAttribute({view:{name:"a",attributes:{[t]:!0}},model:{key:e,value:e=>e.getAttribute(t)}})}_addExtraAttributeOnLinkCommandExecute(e){const{editor:t}=this,r=t.commands.get("link");let i=!1;r.on("execute",((r,s)=>{if(s.length<3)return;if(i)return void(i=!1);r.stop(),i=!0;const n=s[s.length-1],{model:o}=this.editor,{selection:a}=o.document;o.change((r=>{t.execute("link",...s);const i=a.getFirstPosition();e.forEach((e=>{if(a.isCollapsed){const t=i.textNode||i.nodeBefore;n[e]?r.setAttribute(e,n[e],r.createRangeOn(t)):r.removeAttribute(e,r.createRangeOn(t)),r.removeSelectionAttribute(e)}else{const t=o.schema.getValidRanges(a.getRanges(),e);for(const i of t)n[e]?r.setAttribute(e,n[e],i):r.removeAttribute(e,i)}}))}))}),{priority:"high"})}_removeExtraAttributeOnUnlinkCommandExecute(e){const{editor:r}=this,i=r.commands.get("unlink"),{model:s}=this.editor,{selection:n}=s.document;let o=!1;i.on("execute",(i=>{o||(i.stop(),s.change((()=>{o=!0,r.execute("unlink"),o=!1,s.change((r=>{let i;i=n.isCollapsed?[(0,t.findAttributeRange)(n.getFirstPosition(),e,n.getAttribute(e),s)]:s.schema.getValidRanges(n.getRanges(),e);for(const t of i)r.removeAttribute(e,t)}))})))}),{priority:"high"})}_refreshExtraAttributeValue(e){const{editor:t}=this,r=t.commands.get("link"),{model:i}=this.editor,{selection:s}=i.document;r.set(e,null),i.document.on("change",(()=>{r[e]=s.getAttribute(e)}))}}var a=r("ckeditor5/src/ui.js"),l=r("./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),c=r.n(l),d=r("./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./js/ckeditor5_plugins/editorAdvancedLink/src/details/details.css"),u={injectType:"singletonStyleTag",attributes:{"data-cke":!0},insert:"head",singleton:!0};c()(d.Z,u);d.Z.locals;class m extends a.View{constructor(e,t={}){super(e);const r=this.bindTemplate;this.set("isFocused",!1),this.set("label",t.label||""),this.set("class",t.class||null),this.children=this.createCollection(),this.setTemplate({tag:"details",attributes:{class:["ck","ck-form__details",r.if("isFocused","ck-form__details--focused"),r.to("class")]},children:this.children}),this.summary=new a.View(e),this.summary.setTemplate({tag:"summary",attributes:{class:["ck","ck-form__details__summary"]},children:[{text:r.to("label")}]}),this.children.add(this.summary)}render(){super.render(),this.element.addEventListener("toggle",this.onToggle.bind(this))}focus(){this.summary.element.focus()}onToggle(e){if(e.target.open){const e=this.parent._focusables.getIndex(this);Object.values(this.children._items).slice(1).reverse().forEach((t=>{this.parent._focusables.add(t,e+1),this.parent.focusTracker.add(t.element)}))}else Object.values(this.children._items).slice(1).forEach((e=>{this.parent._focusables.remove(e),this.parent.focusTracker.remove(e.element)}))}}class h extends e.Plugin{init(){this.groups={},this.editor.plugins.get("LinkUI")._createViews&&this.editor.plugins.get("LinkUI")._createViews(),this._changeFormToVertical(),this._addExtraFormFields()}_addExtraFormFields(){const{editor:e}=this;e.plugins.get("ContextualBalloon").on("set:visibleView",((t,r,i,n)=>{const o=e.plugins.get("LinkUI").formView;if(i===n||i!==o)return;const{enabledModelNames:a}=e.plugins.get("EditorAdvancedLinkEditing");a.reverse().forEach((e=>{this._createExtraFormField(e,s[e])})),this._handleExtraFormFieldSubmit(a),this._addGroupsToFormView(),this._moveTargetDecoratorToAdvancedGroup()}))}_changeFormToVertical(){this.editor.plugins.get("LinkUI").formView.extendTemplate({attributes:{class:["ck-vertical-form","ck-link-form_layout-vertical"]}})}_createExtraFormField(e,t){const{editor:r}=this,{locale:i}=r,s=r.plugins.get("LinkUI").formView,n=r.commands.get("link");if(void 0===s[e]){const r=t.group?this._getGroup(t.group):s,o=new a.LabeledFieldView(i,a.createLabeledInputText);o.label=t.label,r.children.add(o,1),t.group||(s._focusables.add(o,1),s.focusTracker.add(o.element)),s[e]=o,s[e].fieldView.bind("value").to(n,e),s[e].fieldView.element.value=n[e]||""}}_addGroupsToFormView(){if(0===Object.entries(this.groups).length)return;const{editor:e}=this,t=e.plugins.get("LinkUI").formView;Object.values(this.groups).reverse().forEach((e=>{e.added||(t.children.add(e,2),e.parent=t,t._focusables.add(e,2),t.focusTracker.add(e.element),e.added=!0)}));[t.children.find((e=>e.template.attributes.class.indexOf("ck-button-save")>-1)),t.children.find((e=>e.template.attributes.class.indexOf("ck-button-cancel")>-1))].forEach(((e,r)=>{t.children.remove(e),t._focusables.remove(e),t.focusTracker.remove(e.element),t.children.add(e,3+r),t._focusables.add(e,3+r),t.focusTracker.add(e.element)}))}_getGroup(e){if(!this.groups[e]){const{editor:t}=this,{locale:r}=t;this.groups[e]=new m(r,{label:n[e].label})}return this.groups[e]}_moveTargetDecoratorToAdvancedGroup(){const{editor:e}=this,t=e.plugins.get("LinkUI").formView;t.targetMoved||(t._manualDecoratorSwitches._items.forEach((e=>{e.label===Drupal.t("Open in new window")&&this._getGroup("advanced").children.add(e)})),t.targetMoved=!0)}_handleExtraFormFieldSubmit(e){const{editor:t}=this,r=t.plugins.get("LinkUI").formView,i=t.commands.get("link");this.listenTo(r,"submit",(()=>{const t=e.reduce(((e,t)=>(e[t]=r[t].fieldView.element.value,e)),{});i.once("execute",((e,r)=>{if(r.length<3)r.push(t);else{if(3!==r.length)throw Error("The link command has more than 3 arguments.");Object.assign(r[2],t)}}),{priority:"highest"})}),{priority:"high"})}}class f extends e.Plugin{static get requires(){return[o,h]}static get pluginName(){return"EditorAdvancedLink"}}const p={EditorAdvancedLink:f}})(),i=i.default})()));
\ No newline at end of file
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.CKEditor5=t():(e.CKEditor5=e.CKEditor5||{},e.CKEditor5.editorAdvancedLink=t())}(self,(()=>(()=>{var e={"ckeditor5/src/core.js":(e,t,i)=>{e.exports=i("dll-reference CKEditor5.dll")("./src/core.js")},"ckeditor5/src/typing.js":(e,t,i)=>{e.exports=i("dll-reference CKEditor5.dll")("./src/typing.js")},"ckeditor5/src/ui.js":(e,t,i)=>{e.exports=i("dll-reference CKEditor5.dll")("./src/ui.js")},"dll-reference CKEditor5.dll":e=>{"use strict";e.exports=CKEditor5.dll}},t={};function i(r){var o=t[r];if(void 0!==o)return o.exports;var n=t[r]={exports:{}};return e[r](n,n.exports,i),n.exports}i.d=(e,t)=>{for(var r in t)i.o(t,r)&&!i.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var r={};return(()=>{"use strict";i.d(r,{default:()=>c});var e=i("ckeditor5/src/core.js"),t=i("ckeditor5/src/typing.js");const o={linkTitle:{label:Drupal.t("Title"),viewAttribute:"title"},linkAriaLabel:{label:Drupal.t("ARIA label"),viewAttribute:"aria-label",group:"advanced"},linkClass:{label:Drupal.t("CSS classes"),viewAttribute:"class",group:"advanced"},linkId:{label:Drupal.t("ID"),viewAttribute:"id",group:"advanced"},linkRel:{label:Drupal.t("Link relationship"),viewAttribute:"rel",group:"advanced"}},n={advanced:{label:Drupal.t("Advanced")}};class s extends e.Plugin{static get pluginName(){return"EditorAdvancedLinkEditing"}init(){const e=this.editor.config.get("editorAdvancedLink");if(!e.options)return void(this.enabledModelNames=[]);const t=Object.values(e.options);this.enabledModelNames=Object.keys(o).filter((e=>t.includes(o[e].viewAttribute))),this.enabledModelNames.forEach((e=>{this._allowAndConvertExtraAttribute(e,o[e].viewAttribute),this._removeExtraAttributeOnUnlinkCommandExecute(e),this._refreshExtraAttributeValue(e)})),this._addExtraAttributeOnLinkCommandExecute(Object.keys(o))}_allowAndConvertExtraAttribute(e,t){const{editor:i}=this;i.model.schema.extend("$text",{allowAttributes:e}),i.conversion.for("downcast").attributeToElement({model:e,view:(e,{writer:i})=>{const r=i.createAttributeElement("a",{[t]:e},{priority:5});return i.setCustomProperty("link",!0,r),r}}),i.conversion.for("upcast").elementToAttribute({view:{name:"a",attributes:{[t]:!0}},model:{key:e,value:e=>e.getAttribute(t)}})}_addExtraAttributeOnLinkCommandExecute(e){const{editor:t}=this,i=t.commands.get("link");let r=!1;i.on("execute",((i,o)=>{if(o.length<3)return;if(r)return void(r=!1);i.stop(),r=!0;const n=o[o.length-1],{model:s}=this.editor,{selection:a}=s.document;s.change((i=>{t.execute("link",...o);const r=a.getFirstPosition();e.forEach((e=>{if(a.isCollapsed){const t=r.textNode||r.nodeBefore;n[e]?i.setAttribute(e,n[e],i.createRangeOn(t)):i.removeAttribute(e,i.createRangeOn(t)),i.removeSelectionAttribute(e)}else{const t=s.schema.getValidRanges(a.getRanges(),e);for(const r of t)n[e]?i.setAttribute(e,n[e],r):i.removeAttribute(e,r)}}))}))}),{priority:"high"})}_removeExtraAttributeOnUnlinkCommandExecute(e){const{editor:i}=this,r=i.commands.get("unlink"),{model:o}=this.editor,{selection:n}=o.document;let s=!1;r.on("execute",(r=>{s||(r.stop(),o.change((()=>{s=!0,i.execute("unlink"),s=!1,o.change((i=>{let r;r=n.isCollapsed?[(0,t.findAttributeRange)(n.getFirstPosition(),e,n.getAttribute(e),o)]:o.schema.getValidRanges(n.getRanges(),e);for(const t of r)i.removeAttribute(e,t)}))})))}),{priority:"high"})}_refreshExtraAttributeValue(e){const{editor:t}=this,i=t.commands.get("link"),{model:r}=this.editor,{selection:o}=r.document;i.set(e,null),r.document.on("change",(()=>{i[e]=o.getAttribute(e)}))}}var a=i("ckeditor5/src/ui.js");class l extends e.Plugin{init(){this.groups={},this.editor.plugins.get("LinkUI")._createViews&&this.editor.plugins.get("LinkUI")._createViews(),this._changeFormToVertical(),this._addExtraFormFields()}_addExtraFormFields(){const{editor:e}=this;e.plugins.get("ContextualBalloon").on("set:visibleView",((t,i,r,n)=>{const s=e.plugins.get("LinkUI").formView;if(r===n||r!==s)return;const{enabledModelNames:a}=e.plugins.get("EditorAdvancedLinkEditing");a.reverse().forEach((e=>{this._createExtraFormField(e,o[e])})),this._handleExtraFormFieldSubmit(a),this._addGroupsToFormView(),this._moveTargetDecoratorToAdvancedGroup()}))}_changeFormToVertical(){this.editor.plugins.get("LinkUI").formView.extendTemplate({attributes:{class:["ck-vertical-form","ck-link-form_layout-vertical"]}})}_createExtraFormField(e,t){const{editor:i}=this,{locale:r}=i,o=i.plugins.get("LinkUI").formView,n=i.commands.get("link");if(void 0===o[e]){const i=t.group?this._getGroup(t.group):o,s=new a.LabeledFieldView(r,a.createLabeledInputText);s.label=t.label,i.children.add(s,i===o?1:0),t.group||(o._focusables.add(s,1),o.focusTracker.add(s.element)),o[e]=s,o[e].fieldView.bind("value").to(n,e),o[e].fieldView.element.value=n[e]||""}}_addGroupsToFormView(){if(0===Object.entries(this.groups).length)return;const{editor:e}=this,t=e.plugins.get("LinkUI").formView;Object.values(this.groups).reverse().forEach((e=>{e.added||(t.children.add(e,2),e.parent=t,t._focusables.add(e,2),t.focusTracker.add(e.element),e.added=!0)}));[t.children.find((e=>e.template.attributes.class.indexOf("ck-button-save")>-1)),t.children.find((e=>e.template.attributes.class.indexOf("ck-button-cancel")>-1))].forEach(((e,i)=>{t.children.remove(e),t._focusables.remove(e),t.focusTracker.remove(e.element),t.children.add(e,3+i),t._focusables.add(e,3+i),t.focusTracker.add(e.element)}))}_getGroup(e){if(!this.groups[e]){const{editor:t}=this,{locale:i}=t,r=new a.CollapsibleView(i);r.label=n[e].label,r.set("isCollapsed",!0),this.groups[e]=r}return this.groups[e]}_moveTargetDecoratorToAdvancedGroup(){const{editor:e}=this,t=e.plugins.get("LinkUI").formView;t.targetMoved||(t._manualDecoratorSwitches._items.forEach((e=>{e.label===Drupal.t("Open in new window")&&this._getGroup("advanced").children.add(e)})),t.targetMoved=!0)}_handleExtraFormFieldSubmit(e){const{editor:t}=this,i=t.plugins.get("LinkUI").formView,r=t.commands.get("link");this.listenTo(i,"submit",(()=>{const t=e.reduce(((e,t)=>(e[t]=i[t].fieldView.element.value,e)),{});r.once("execute",((e,i)=>{if(i.length<3)i.push(t);else{if(3!==i.length)throw Error("The link command has more than 3 arguments.");Object.assign(i[2],t)}}),{priority:"highest"})}),{priority:"high"})}}class d extends e.Plugin{static get requires(){return[s,l]}static get pluginName(){return"EditorAdvancedLink"}}const c={EditorAdvancedLink:d}})(),r=r.default})()));
\ No newline at end of file
js/ckeditor5_plugins/editorAdvancedLink/src/details/details.css deleted 100644 → 0
+ 0
− 10
View file @ 73e84157
.ck.ck-form__details {
& > summary {
cursor: pointer;
&:focus-visible {
border: var(--ck-focus-ring);
box-shadow: var(--ck-focus-outer-shadow), 0 0;
}
}
}
js/ckeditor5_plugins/editorAdvancedLink/src/details/detailsview.js deleted 100644 → 0
+ 0
− 115
View file @ 73e84157
/**
* @module ui/details/detailsview
*/
// eslint-disable-next-line import/no-extraneous-dependencies
import { View } from 'ckeditor5/src/ui';
import './details.css';
/**
* The class component representing a details element. It should be used in more
* advanced forms to group fields.
*
* @extends module:ui/view~View
*/
export default class DetailsView extends View {
/**
* Creates an instance of the details class.
*
* @param {module:utils/locale~Locale} locale The locale instance.
* @param {Object} options The options.
* @param {String} options.label The summary label.
* @param {String} [options.class] An additional class.
*/
constructor(locale, options = {}) {
super(locale);
const bind = this.bindTemplate;
/**
* An observable flag set to `true` when {@link #fieldView} is currently
* focused by the user (`false` otherwise).
*
* @readonly
* @observable
* @member {Boolean} #isFocused
* @default false
*/
this.set( 'isFocused', false );
/**
* The label of the details element.
*
* @observable
* @member {String} #label
*/
this.set('label', options.label || '');
/**
* An additional CSS class added to the {@link #element}.
*
* @observable
* @member {String} #class
*/
this.set('class', options.class || null);
/**
* A collection of items.
*
* @readonly
* @member {module:ui/viewcollection~ViewCollection}
*/
this.children = this.createCollection();
this.setTemplate({
tag: 'details',
attributes: {
class: [
'ck',
'ck-form__details',
bind.if( 'isFocused', 'ck-form__details--focused' ),
bind.to('class'),
],
},
children: this.children,
});
this.summary = new View(locale);
this.summary.setTemplate({
tag: 'summary',
attributes: {
class: ['ck', 'ck-form__details__summary'],
},
children: [{ text: bind.to('label') }],
});
this.children.add(this.summary);
}
render() {
super.render();
this.element.addEventListener('toggle', this.onToggle.bind(this));
}
focus() {
this.summary.element.focus();
}
onToggle(evt) {
if (evt.target.open) {
const groupIndex = this.parent._focusables.getIndex(this);
Object.values(this.children._items).slice(1).reverse().forEach((child) => {
this.parent._focusables.add(child, groupIndex+1);
this.parent.focusTracker.add(child.element);
});
}
else {
Object.values(this.children._items).slice(1).forEach((child) => {
this.parent._focusables.remove(child);
this.parent.focusTracker.remove(child.element);
});
}
}
}
js/ckeditor5_plugins/editorAdvancedLink/src/editoradvancedlinkui.js
+ 10
− 6
View file @ aa9e8a76
// eslint-disable-next-line import/no-extraneous-dependencies
import { Plugin } from 'ckeditor5/src/core';
// eslint-disable-next-line import/no-extraneous-dependencies
import { LabeledFieldView, createLabeledInputText } from 'ckeditor5/src/ui';
import {
LabeledFieldView,
createLabeledInputText,
CollapsibleView,
} from 'ckeditor5/src/ui';
import { additionalFormElements, additionalFormGroups } from './utils';
import DetailsView from './details/detailsview';
export default class EditorAdvancedLinkUi extends Plugin {
init() {
......@@ -73,7 +76,7 @@ export default class EditorAdvancedLinkUi extends Plugin {
createLabeledInputText,
);
extraFieldView.label = options.label;
fieldParent.children.add(extraFieldView, 1);
fieldParent.children.add(extraFieldView, fieldParent === linkFormView ? 1 : 0);
if (!options.group) {
linkFormView._focusables.add(extraFieldView, 1);
......@@ -131,9 +134,10 @@ export default class EditorAdvancedLinkUi extends Plugin {
const { editor } = this;
const { locale } = editor;
this.groups[groupName] = new DetailsView(locale, {
label: additionalFormGroups[groupName].label,
});
const group = new CollapsibleView(locale);
group.label = additionalFormGroups[groupName].label;
group.set('isCollapsed', true);
this.groups[groupName] = group;
}
return this.groups[groupName];
}
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment