kempo-ui 0.4.20 → 0.4.21

package/dist/components/htmlEditorControls/AlignJustify.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as i}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.alignJustify()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_align_justify"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-align-justify",o);

package/dist/components/htmlEditorControls/AlignLeft.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as i}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.alignLeft()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_align_left"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-align-left",o);

package/dist/components/htmlEditorControls/AlignRight.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as i}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.alignRight()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_align_right"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-align-right",o);

package/dist/components/htmlEditorControls/Bold.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as o}from"../../lit-all.min.js";import"../Icon.js";export default class i extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,o`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.bold()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_bold"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-bold",i);

package/dist/components/htmlEditorControls/BulletList.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as i}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.unorderedList()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_list_bulleted"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-bullet-list",o);

package/dist/components/htmlEditorControls/CharacterCount.js

@@ -1,18 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as r}from"../../lit-all.min.js";export default class s extends t{static properties={count:{type:Number,state:!0}};constructor(){super(),this.count=0}connectedCallback(){super.connectedCallback(),this.editor&&(this.editor.addEventListener("ready",()=>{this.updateCount()}),this.editor.addEventListener("change",()=>{this.updateCount()}),setTimeout(()=>this.updateCount(),0))}updateCount=()=>{if(!this.editor)return;const t=(new DOMParser).parseFromString(this.editor.getValue(),"text/html").body.innerText||"";this.count=t.length};render(){return e`
-			<span class="character-count">
-				<slot name="label">Characters:</slot> ${this.count}
-			</span>
-		`}static styles=[t.styles,r`
-			:host {
-				display: inline-flex;
-				align-items: center;
-				padding: 0 0.5rem;
-				font-size: 0.875rem;
-				color: var(--text-color-secondary, #666);
-			}
-			.character-count {
-				display: flex;
-				align-items: center;
-				gap: 0.25rem;
-			}
-		`]}customElements.define("k-hec-character-count",s);

package/dist/components/htmlEditorControls/ClearFormatting.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as o}from"../../lit-all.min.js";import"../Icon.js";export default class i extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,o`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.removeFormat()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_clear"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-clear-formatting",i);

package/dist/components/htmlEditorControls/CodeBlock.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as o}from"../../lit-all.min.js";import"../Icon.js";export default class i extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,o`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.formatBlock(this.editor.isSelectionInCodeBlock()?"p":"pre")};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="code_blocks"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-code-block",i);

package/dist/components/htmlEditorControls/ControlGroup.js

@@ -1,12 +0,0 @@
-import t from"../ShadowComponent.js";import{html as e,css as i}from"../../lit-all.min.js";export default class s extends t{static properties={hidden:{type:Boolean,reflect:!0}};constructor(){super(),this.hidden=!1}connectedCallback(){super.connectedCallback(),this.hasAttribute("class")||this.setAttribute("class","b r mq"),this.addEventListener("control_visibility_change",this.checkVisibility)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("control_visibility_change",this.checkVisibility)}checkVisibility=t=>{if(t.target===this)return;const e=this.hidden;this.hidden=Array.from(this.children).every(t=>!0===t.hidden),this.hidden!==e&&this.dispatchEvent(new CustomEvent("control_visibility_change",{bubbles:!0}))};static styles=i`
-		:host {
-			display: inline-flex;
-		}
-		:host([hidden]) {
-			display: none !important;
-		}
-		::slotted(*) {
-			margin-top: -1px;
-			margin-bottom: -1px;
-		}
-	`;render(){return e`<slot></slot>`}}customElements.define("k-hec-group",s);

package/dist/components/htmlEditorControls/CreateLink.js

@@ -1,15 +0,0 @@
-import e from"./HtmlEditorControl.js";import{html as t,css as i}from"../../lit-all.min.js";import"../Icon.js";import o from"../Dialog.js";export default class l extends e{static properties={editorMode:{type:String,state:!0}};constructor(){super()}connectedCallback(){super.connectedCallback(),this.editor&&(this.editorMode=this.editor.mode,this.editor?.addEventListener("mode-changed",()=>{this.editor&&(this.editorMode=this.editor.mode)}))}handleClick=()=>{if(!this.editor)return;const e=this.editor.getSelectedText(),t=document.createElement("input");t.type="text",t.placeholder="https://example.com",t.style.cssText="padding: 0.5rem; border: 1px solid var(--border-color, #ccc); border-radius: 4px; font-size: 1rem;";const i=document.createElement("input");i.type="text",i.placeholder="Enter link text",i.value=e,i.style.cssText="padding: 0.5rem; border: 1px solid var(--border-color, #ccc); border-radius: 4px; font-size: 1rem;";const l=document.createElement("div");l.className="p",l.style.cssText="display: flex; flex-direction: column; gap: 1rem;",l.innerHTML='\n\t\t\t<div style="display: flex; flex-direction: column; gap: 0.5rem;">\n\t\t\t\t<label style="font-weight: bold;">URL</label>\n\t\t\t</div>\n\t\t\t<div style="display: flex; flex-direction: column; gap: 0.5rem;">\n\t\t\t\t<label style="font-weight: bold;">Link Text</label>\n\t\t\t</div>\n\t\t',l.children[0].appendChild(t),l.children[1].appendChild(i),o.create(l,{title:"Create Link",cancelText:"Cancel",confirmText:"Insert Link",confirmClasses:"success ml",confirmAction:o=>{const l=t.value.trim(),n=i.value.trim();l?!this.editor.selection||n&&n!==e?this.editor.createLinkWithText(l,n||l):this.editor.createLink(l):o.keepDialogOpen=!0}})};render(){return this.hidden="code"===this.editorMode,t`
-			<button
-				class="${this.buttonClasses}"
-				@click="${this.handleClick}"
-			>
-				<slot name="icon">
-					<k-icon name="link"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}static styles=[e.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`]}customElements.define("k-hec-create-link",l);

package/dist/components/htmlEditorControls/DropdownControl.js

@@ -1,57 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as o,css as e}from"../../lit-all.min.js";import"../Dropdown.js";import"../Icon.js";export default class n extends t{static properties={opened:{type:Boolean,reflect:!0},editorMode:{type:String,state:!0}};constructor(){super(),this.opened=!1}connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}updated(t){super.updated(t),t.has("editorMode")&&requestAnimationFrame(()=>{this.hidden="code"===this.editorMode&&!this.hasVisibleChildren()})}updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}hasVisibleChildren(){return Array.from(this.children).filter(t=>!t.hasAttribute("slot")).some(t=>{if(!1===t.hidden||void 0===t.hidden){return"none"!==window.getComputedStyle(t).display}return!1})}static styles=[t.styles,e`
-      :host {
-        display: inline-flex;
-      }
-      
-      k-dropdown {
-        display: inline-flex;
-      }
-      
-      /* Override fixed sizing for dropdown trigger */
-      button[slot="trigger"] {
-        width: auto !important;
-        height: auto !important;
-        min-width: 40px;
-        min-height: 40px;
-      }
-      
-      /* Style slotted items (not icon or label) */
-      ::slotted(:not([slot="icon"]):not([slot="label"])) {
-        display: block !important;
-      }
-      
-      ::slotted(:not([slot="icon"]):not([slot="label"])) .icon-btn,
-      ::slotted(:not([slot="icon"]):not([slot="label"])) button {
-        display: flex !important;
-        width: 100% !important;
-        height: auto !important;
-        justify-content: flex-start !important;
-        padding: 0.5rem 0.75rem !important;
-        margin: 0 !important;
-        border: none !important;
-        border-radius: 0 !important;
-        border-bottom: 1px solid var(--c_border) !important;
-      }
-      
-      ::slotted(:not([slot="icon"]):not([slot="label"]):last-of-type) .icon-btn,
-      ::slotted(:not([slot="icon"]):not([slot="label"]):last-of-type) button {
-        border-bottom: none !important;
-      }
-    `];handleToggle=()=>{this.opened=!this.opened};handleOpened=()=>{this.opened=!0};handleClosed=()=>{this.opened=!1};render(){return o`
-      <k-dropdown 
-        ?opened=${this.opened}
-        @opened=${this.handleOpened}
-        @closed=${this.handleClosed}
-      >
-        <button 
-          slot="trigger" 
-          class="${this.buttonClasses}"
-        >
-          <slot name="icon">
-            <k-icon name="arrow_drop_down"></k-icon>
-          </slot>
-          <slot name="label"></slot>
-        </button>
-        <slot></slot>
-      </k-dropdown>
-    `}}customElements.define("k-hec-dropdown",n);

package/dist/components/htmlEditorControls/FormatBlock.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as a}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0},tag:{type:String},label:{type:String}};static styles=[t.styles,a`
-			:host {
-				display: inline-flex;
-			}
-		`];constructor(){super(),this.tag="p",this.label=""}connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.formatBlock(this.tag)};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){this.hidden="code"===this.editorMode;this.label||this.getDefaultLabel();const t=this.getDefaultIcon();return e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="${t}"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}getDefaultLabel(){return{h1:"Heading 1",h2:"Heading 2",h3:"Heading 3",h4:"Heading 4",h5:"Heading 5",h6:"Heading 6",p:"Paragraph"}[this.tag]||this.tag.toUpperCase()}getDefaultIcon(){return{h1:"format_h1",h2:"format_h2",h3:"format_h3",h4:"format_h4",h5:"format_h5",h6:"format_h6",p:"format_paragraph"}[this.tag]||"format_paragraph"}}customElements.define("k-hec-format-block",o);

package/dist/components/htmlEditorControls/FormatCode.js

@@ -1 +0,0 @@
-import o from"../codeEditorControls/FormatCode.js";export default o;

package/dist/components/htmlEditorControls/HtmlEditorControl.js

@@ -1,44 +0,0 @@
-import t from"../ShadowComponent.js";import{html as e,css as n}from"../../lit-all.min.js";export default class o extends t{static properties={btnClass:{type:String,attribute:"btn-class"},groupBtnClass:{type:String,attribute:"group-btn-class"},groupLastBtnClass:{type:String,attribute:"group-last-btn-class"},hidden:{type:Boolean,reflect:!0}};constructor(){super(),this.btnClass="b r mq ph",this.groupBtnClass="br ph",this.groupLastBtnClass="ph",this.hidesInCodeMode=!0}connectedCallback(){super.connectedCallback();const t=this.editor;t&&(this.modeEditor=t,this.modeHandler=()=>{const t=this.hidesInCodeMode&&"code"===this.modeEditor.mode;this.hidden!==t&&(this.hidden=t,this.dispatchEvent(new CustomEvent("control_visibility_change",{bubbles:!0})))},t.addEventListener("mode-changed",this.modeHandler))}disconnectedCallback(){super.disconnectedCallback(),this.modeEditor?.removeEventListener("mode-changed",this.modeHandler),this.modeEditor=null,this.modeHandler=null}updated(t){super.updated(t),t.has("hidden")&&this.dispatchEvent(new CustomEvent("control_visibility_change",{bubbles:!0}))}get editor(){const t=t=>t?.tagName?.startsWith("K-HTML-EDITOR");let e=this.getRootNode();for(;e instanceof ShadowRoot;){const n=e.host;if(t(n))return n;e=n.getRootNode()}let n=this.parentElement;for(;n;){if(t(n))return n;n=n.parentElement}return null}get isInGroup(){const t=this.parentElement;return t&&"K-HEC-GROUP"===t.tagName}get isInDropdown(){const t=this.parentElement;return t&&"K-HEC-DROPDOWN"===t.tagName}get isLastInGroup(){if(!this.isInGroup)return!1;const t=this.parentElement,e=Array.from(t.children).filter(t=>t.tagName.startsWith("K-HEC-")&&"K-HEC-SPACER"!==t.tagName);return e[e.length-1]===this}get buttonClasses(){let t;return t=this.isInDropdown?"dropdown-item":this.isInGroup?this.isLastInGroup?this.groupLastBtnClass:this.groupBtnClass:this.btnClass,`no-btn icon-btn ${t}`.trim()}static styles=n`
-		:host {
-			display: inline-flex;
-		}
-		
-		:host([hidden]) {
-			display: none !important;
-		}
-		
-		.icon-btn {
-			display: inline-flex !important;
-			align-items: center;
-			justify-content: center;
-			width: 40px;
-			height: 40px;
-			gap: 0.5rem;
-		}
-		.icon-btn:disabled {
-			opacity: 0.6;
-		}
-		
-		.icon-btn:has(slot:not([name])) {
-			width: auto;
-			padding-left: 0.75rem;
-			padding-right: 0.75rem;
-		}
-		
-		/* Styles for controls in dropdown */
-		.icon-btn.dropdown-item {
-			display: flex !important;
-			width: 100% !important;
-			height: auto !important;
-			justify-content: flex-start !important;
-			padding: 0.5rem 0.75rem !important;
-			margin: 0 !important;
-			border: none !important;
-			border-radius: 0 !important;
-			border-bottom: 1px solid var(--c_border) !important;
-		}
-		
-		:host(:last-child) .icon-btn.dropdown-item {
-			border-bottom: none !important;
-		}
-	`}customElements.define("k-html-editor-control",o);

package/dist/components/htmlEditorControls/InlineCode.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as o}from"../../lit-all.min.js";import"../Icon.js";export default class i extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,o`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor?.inlineCode()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="code_blocks"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-inline-code",i);

package/dist/components/htmlEditorControls/InsertTable.js

@@ -1,15 +0,0 @@
-import e from"./HtmlEditorControl.js";import{html as t,css as l}from"../../lit-all.min.js";import"../Icon.js";import i from"../Dialog.js";export default class n extends e{static properties={editorMode:{type:String,state:!0}};constructor(){super()}connectedCallback(){super.connectedCallback(),this.editor&&(this.editorMode=this.editor.mode,this.editor?.addEventListener("mode-changed",()=>{this.editor&&(this.editorMode=this.editor.mode)}))}handleClick=()=>{if(!this.editor)return;const e=this.editor.getTableAtSelection(),t=!!e,l=e?.rows??3,n=e?.cols??3,o=e?.hasHeaders??!0,s=e?.cellData??null,r=document.createElement("input");r.type="number",r.min="1",r.max="20",r.value=l.toString(),r.style.cssText="padding: 0.5rem; border: 1px solid var(--border-color, #ccc); border-radius: 4px; font-size: 1rem;";const d=document.createElement("input");d.type="number",d.min="1",d.max="10",d.value=n.toString(),d.style.cssText="padding: 0.5rem; border: 1px solid var(--border-color, #ccc); border-radius: 4px; font-size: 1rem;";const c=document.createElement("input");c.type="checkbox",c.checked=o,c.id="table-headers-checkbox";const a=document.createElement("div");a.className="p",a.style.cssText="display: flex; flex-direction: column; gap: 1rem;",a.innerHTML='\n\t\t\t<div style="display: flex; flex-direction: column; gap: 0.5rem;">\n\t\t\t\t<label style="font-weight: bold;">Rows</label>\n\t\t\t</div>\n\t\t\t<div style="display: flex; flex-direction: column; gap: 0.5rem;">\n\t\t\t\t<label style="font-weight: bold;">Columns</label>\n\t\t\t</div>\n\t\t\t<div style="display: flex; align-items: center; gap: 0.5rem;">\n\t\t\t\t<label for="table-headers-checkbox" style="font-weight: bold;">Include Headers</label>\n\t\t\t</div>\n\t\t',a.children[0].appendChild(r),a.children[1].appendChild(d),a.children[2].insertBefore(c,a.children[2].firstChild),i.create(a,{title:t?"Edit Table":"Insert Table",cancelText:"Cancel",confirmText:t?"Update Table":"Insert Table",confirmClasses:"success",confirmAction:()=>{const l=parseInt(r.value)||3,i=parseInt(d.value)||3,n=c.checked;t&&this.editor.removeTableByKey(e.key),this.editor.insertTable(l,i,n,s)}})};render(){return this.hidden="code"===this.editorMode,t`
-			<button
-				class="${this.buttonClasses}"
-				@click="${this.handleClick}"
-			>
-				<slot name="icon">
-					<k-icon name="table"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}static styles=[e.styles,l`
-			:host {
-				display: inline-flex;
-			}
-		`]}customElements.define("k-hec-insert-table",n);

package/dist/components/htmlEditorControls/Italic.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as i}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.italic()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_italic"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-italic",o);

package/dist/components/htmlEditorControls/Mode.js

@@ -1,9 +0,0 @@
-import e from"./HtmlEditorControl.js";import{html as t,css as o}from"../../lit-all.min.js";import"../Icon.js";export default class s extends e{static properties={mode:{type:String,reflect:!0}};hidesInCodeMode=!1;connectedCallback(){super.connectedCallback(),this.updateMode(),this.editor?.addEventListener("mode-changed",()=>this.updateMode())}handleClick=()=>{this.editor&&this.editor.toggleMode()};updateMode(){this.editor&&(this.mode=this.editor.mode)}static styles=[e.styles,o`
-      :host {
-        display: inline-flex;
-      }
-    `];render(){const e="code"===this.mode?`${this.buttonClasses} bg-primary`:this.buttonClasses;return t`
-      <button class="${e}" @click="${this.handleClick}">
-        <k-icon name="code"></k-icon>
-      </button>
-    `}}customElements.define("k-hec-mode",s);

package/dist/components/htmlEditorControls/NumberList.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as i}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.orderedList()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_list_numbered"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-number-list",o);

package/dist/components/htmlEditorControls/Strikethrough.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as i}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.strikethrough()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="strikethrough_s"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-strikethrough",o);

package/dist/components/htmlEditorControls/TextBackgroundColor.js

@@ -1,97 +0,0 @@
-import o from"./DropdownControl.js";import{html as e,css as t}from"../../lit-all.min.js";import"../Icon.js";export default class r extends o{static properties={editorMode:{type:String,state:!0},colors:{type:String},disableRemove:{type:Boolean,attribute:"disable-remove"},disablePicker:{type:Boolean,attribute:"disable-picker"}};static styles=[o.styles,t`
-			.dropdown-content {
-				padding: 8px;
-				min-width: 200px;
-			}
-
-			.remove-btn {
-				width: 100%;
-				padding: 8px;
-				margin-bottom: 8px;
-				border: 1px solid var(--border-color, #ccc);
-				background: var(--background-color, white);
-				cursor: pointer;
-				border-radius: 4px;
-			}
-
-			.remove-btn:hover {
-				background: var(--hover-background-color, #f5f5f5);
-			}
-
-			.color-swatches {
-				display: grid;
-			grid-template-columns: repeat(6, 1fr);
-			}
-
-			.color-swatch {
-				width: 32px;
-				height: 32px;
-				border: 1px solid var(--border-color, #ccc);
-				cursor: pointer;
-				border-radius: 4px;
-			}
-
-			.color-swatch:hover {
-				border-color: var(--primary-color, #007acc);
-				box-shadow: 0 0 4px rgba(0, 122, 204, 0.3);
-			}
-
-			.picker-row {
-				display: flex;
-				align-items: center;
-				gap: 8px;
-			}
-
-			.picker-row label {
-				flex-shrink: 0;
-			}
-
-			.picker-row input[type="color"] {
-				flex: 1;
-				height: 32px;
-				border: 1px solid var(--border-color, #ccc);
-				border-radius: 4px;
-				cursor: pointer;
-			}
-		`];constructor(){super(),this.colors="#ffff00,#00ffff,#ff66ff,#99ff99,#ffcc99,#ff9999,#cccccc,#ffffff,#ffffcc,#ccffff,#ffccff,#ccffcc",this.disableRemove=!1,this.disablePicker=!1,this.icon="format_color_fill"}connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleRemove=o=>{this.editor&&this.editor.removeTextBackgroundColor(),this.opened=!1};handleSwatchClick=o=>{const e=o.target.style.backgroundColor;if(this.editor&&e){const o=e.match(/\d+/g),t=o?"#"+o.map(o=>parseInt(o).toString(16).padStart(2,"0")).join(""):e;this.editor.setTextBackgroundColor(t)}this.opened=!1};handlePickerChange=o=>{const e=o.target.value;this.editor&&e&&this.editor.setTextBackgroundColor(e),this.opened=!1};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}getColorArray(){return this.colors.split(",").map(o=>o.trim()).filter(o=>o)}render(){this.hidden="code"===this.editorMode;const o=this.getColorArray();return e`
-			<k-dropdown 
-				?opened=${this.opened}
-				@opened=${this.handleOpened}
-				@closed=${this.handleClosed}
-			>
-				<button 
-					slot="trigger" 
-					class="${this.buttonClasses}"
-				>
-					<k-icon name="format_color_fill"></k-icon>
-				</button>
-				
-				<div class="dropdown-content">
-					${this.disableRemove?"":e`
-						<button class="remove-btn" @click=${this.handleRemove}>
-							Remove Color
-						</button>
-					`}
-					
-					<div class="color-swatches">
-						${o.map(o=>e`
-							<button 
-								class="color-swatch" 
-								style="background-color: ${o}"
-								@click=${this.handleSwatchClick}
-							></button>
-						`)}
-					</div>
-
-					${this.disablePicker?"":e`
-						<div class="picker-row">
-							<label>Custom:</label>
-							<input 
-								type="color" 
-								@input=${this.handlePickerChange}
-							/>
-						</div>
-					`}
-				</div>
-			</k-dropdown>
-		`}}customElements.define("k-hec-text-background-color",r);

package/dist/components/htmlEditorControls/TextColor.js

@@ -1,97 +0,0 @@
-import e from"./DropdownControl.js";import{html as o,css as t}from"../../lit-all.min.js";import"../Icon.js";export default class r extends e{static properties={editorMode:{type:String,state:!0},colors:{type:String},disableRemove:{type:Boolean,attribute:"disable-remove"},disablePicker:{type:Boolean,attribute:"disable-picker"}};static styles=[e.styles,t`
-			.dropdown-content {
-				padding: 8px;
-				min-width: 200px;
-			}
-
-			.remove-btn {
-				width: 100%;
-				padding: 8px;
-				margin-bottom: 8px;
-				border: 1px solid var(--border-color, #ccc);
-				background: var(--background-color, white);
-				cursor: pointer;
-				border-radius: 4px;
-			}
-
-			.remove-btn:hover {
-				background: var(--hover-background-color, #f5f5f5);
-			}
-
-			.color-swatches {
-				display: grid;
-			grid-template-columns: repeat(6, 1fr);
-			}
-
-			.color-swatch {
-				width: 32px;
-				height: 32px;
-				border: 1px solid var(--border-color, #ccc);
-				cursor: pointer;
-				border-radius: 4px;
-			}
-
-			.color-swatch:hover {
-				border-color: var(--primary-color, #007acc);
-				box-shadow: 0 0 4px rgba(0, 122, 204, 0.3);
-			}
-
-			.picker-row {
-				display: flex;
-				align-items: center;
-				gap: 8px;
-			}
-
-			.picker-row label {
-				flex-shrink: 0;
-			}
-
-			.picker-row input[type="color"] {
-				flex: 1;
-				height: 32px;
-				border: 1px solid var(--border-color, #ccc);
-				border-radius: 4px;
-				cursor: pointer;
-			}
-		`];constructor(){super(),this.colors="#000000,#e60000,#ff9900,#ffff00,#008a00,#0066cc,#9933ff,#ffffff,#facccc,#ffebcc,#ffffcc,#cce8cc,#cce0f5,#ebd6ff",this.disableRemove=!1,this.disablePicker=!1,this.icon="format_color_text"}connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleRemove=e=>{this.editor&&this.editor.removeTextColor(),this.opened=!1};handleSwatchClick=e=>{const o=e.target.style.backgroundColor;if(this.editor&&o){const e=o.match(/\d+/g),t=e?"#"+e.map(e=>parseInt(e).toString(16).padStart(2,"0")).join(""):o;this.editor.setTextColor(t)}this.opened=!1};handlePickerChange=e=>{const o=e.target.value;this.editor&&o&&this.editor.setTextColor(o),this.opened=!1};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}getColorArray(){return this.colors.split(",").map(e=>e.trim()).filter(e=>e)}render(){this.hidden="code"===this.editorMode;const e=this.getColorArray();return o`
-			<k-dropdown 
-				?opened=${this.opened}
-				@opened=${this.handleOpened}
-				@closed=${this.handleClosed}
-			>
-				<button 
-					slot="trigger" 
-					class="${this.buttonClasses}"
-				>
-					<k-icon name="format_color_text"></k-icon>
-				</button>
-				
-				<div class="dropdown-content">
-					${this.disableRemove?"":o`
-						<button class="remove-btn" @click=${this.handleRemove}>
-							Remove Color
-						</button>
-					`}
-					
-					<div class="color-swatches">
-						${e.map(e=>o`
-							<button 
-								class="color-swatch" 
-								style="background-color: ${e}"
-								@click=${this.handleSwatchClick}
-							></button>
-						`)}
-					</div>
-
-					${this.disablePicker?"":o`
-						<div class="picker-row">
-							<label>Custom:</label>
-							<input 
-								type="color" 
-								@input=${this.handlePickerChange}
-							/>
-						</div>
-					`}
-				</div>
-			</k-dropdown>
-		`}}customElements.define("k-hec-text-color",r);

package/dist/components/htmlEditorControls/Underline.js

@@ -1,12 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as i}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{static properties={editorMode:{type:String,state:!0}};static styles=[t.styles,i`
-			:host {
-				display: inline-flex;
-			}
-		`];connectedCallback(){super.connectedCallback(),this.updateEditorMode(),this.editor?.addEventListener("mode-changed",()=>this.updateEditorMode())}handleClick=()=>{this.editor&&this.editor.underline()};updateEditorMode(){this.editor&&(this.editorMode=this.editor.mode)}render(){return this.hidden="code"===this.editorMode,e`
-			<button class="${this.buttonClasses}" @click="${this.handleClick}">
-				<slot name="icon">
-					<k-icon name="format_underlined"></k-icon>
-				</slot>
-				<slot></slot>
-			</button>
-		`}}customElements.define("k-hec-underline",o);

package/dist/components/htmlEditorControls/WordCount.js

@@ -1,18 +0,0 @@
-import t from"./HtmlEditorControl.js";import{html as e,css as s}from"../../lit-all.min.js";export default class r extends t{static properties={count:{type:Number,state:!0}};constructor(){super(),this.count=0}connectedCallback(){super.connectedCallback(),this.editor&&(this.editor.addEventListener("ready",()=>{this.updateCount()}),this.editor.addEventListener("change",()=>{this.updateCount()}),setTimeout(()=>this.updateCount(),0))}updateCount=()=>{if(!this.editor)return;const t=((new DOMParser).parseFromString(this.editor.getValue(),"text/html").body.innerText||"").trim().split(/\s+/).filter(t=>t.length>0);this.count=t.length};render(){return e`
-			<span class="word-count">
-				<slot name="label">Words:</slot> ${this.count}
-			</span>
-		`}static styles=[t.styles,s`
-			:host {
-				display: inline-flex;
-				align-items: center;
-				padding: 0 0.5rem;
-				font-size: 0.875rem;
-				color: var(--text-color-secondary, #666);
-			}
-			.word-count {
-				display: flex;
-				align-items: center;
-				gap: 0.25rem;
-			}
-		`]}customElements.define("k-hec-word-count",r);

package/dist/components/markdownEditorControls/Bold.js

@@ -1,11 +0,0 @@
-import t from"./MarkdownEditorControl.js";import{html as l}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{constructor(){super(),this.label="Bold (Cmd/Ctrl+B)"}command(){this.wrapSelection("**","**","bold text")}render(){return l`
-      <button
-        type="button"
-        class=${this.btnClass}
-        title=${this.label}
-        aria-label=${this.label}
-        @click=${this.handleClick}
-      >
-        <k-icon name="format_bold"></k-icon>
-      </button>
-    `}}customElements.define("k-md-bold",o);

package/dist/components/markdownEditorControls/BulletList.js

@@ -1,11 +0,0 @@
-import t from"./MarkdownEditorControl.js";import{html as l}from"../../lit-all.min.js";import"../Icon.js";export default class e extends t{constructor(){super(),this.label="Bulleted list"}command(){this.insertLinePrefix("- ")}render(){return l`
-      <button
-        type="button"
-        class=${this.btnClass}
-        title=${this.label}
-        aria-label=${this.label}
-        @click=${this.handleClick}
-      >
-        <k-icon name="format_list_bulleted"></k-icon>
-      </button>
-    `}}customElements.define("k-md-bullet-list",e);

package/dist/components/markdownEditorControls/Code.js

@@ -1,11 +0,0 @@
-import t from"./MarkdownEditorControl.js";import{html as e}from"../../lit-all.min.js";import"../Icon.js";export default class o extends t{constructor(){super(),this.label="Code"}command(){this.getSelection().text.includes("\n")?this.wrapSelection("```\n","\n```","code"):this.wrapSelection("`","`","code")}render(){return e`
-      <button
-        type="button"
-        class=${this.btnClass}
-        title=${this.label}
-        aria-label=${this.label}
-        @click=${this.handleClick}
-      >
-        <k-icon name="code"></k-icon>
-      </button>
-    `}}customElements.define("k-md-code",o);