@aquera/nile-elements 0.1.56 → 0.1.57-beta-1.0

package/src/nile-code-editor/nile-code-editor.ts

@@ -39,9 +39,7 @@ import { autocompletion,CompletionContext,CompletionResult } from '@codemirror/a
 import NileElement from '../internal/nile-element';
 import { basicSetup } from './extensionSetup';
 import { classMap } from 'lit/directives/class-map.js';
-import { Theme as DefaultTheme, customisedThemeCss } from './theme';
-import { keymap } from '@codemirror/view';
-import { acceptCompletion } from '@codemirror/autocomplete';
+import { Theme as DefaultTheme } from './theme';
 
 // Choose the appropriate mode for your use case
 
@@ -86,7 +84,7 @@ export class NileCodeEditor extends NileElement {
 
   @property({ type: Boolean, reflect: true , attribute: false }) disableSyntaxHighlighting: boolean = false;
 
-  @property({ type: Object,  attribute: false }) customThemeCSS: object | null = customisedThemeCss;
+  @property({ type: Object,  attribute: false }) customThemeCSS: object | null = null;
 
   @property({ type: Boolean, reflect: true , attribute: true }) lineNumbersMultiline: boolean = true;
 
@@ -102,8 +100,6 @@ export class NileCodeEditor extends NileElement {
 
   @property({ type: Boolean, reflect: true , attribute: true}) aboveCursor: boolean = false;
 
-  @property({ type: Boolean, reflect: true, attribute: true }) tabCompletion: boolean = false;
-
   public view: EditorView;
   public viewState:EditorState;
   private timeOut: any = null;
@@ -145,17 +141,6 @@ export class NileCodeEditor extends NileElement {
     }, false )
   }
 
-  getTabCompletionKeymap() {
-    return this.tabCompletion
-      ? keymap.of([
-          {
-            key: 'Tab',
-            run: acceptCompletion,
-          }
-        ])
-      : [];
-  }
-
   protected updated(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void{
     super.updated(changedProperties);
     if (changedProperties.has('value') && this.view.state.doc.toString()!=this.value) {
@@ -292,7 +277,6 @@ export class NileCodeEditor extends NileElement {
         autocompletion({aboveCursor: this.aboveCursor}),
         language,
         customThemeExtension,
-        this.getTabCompletionKeymap(),
         EditorView.updateListener.of((v: ViewUpdate) => {
           if (v.docChanged) {
             this.debounce ? this.emitAfterTimeout({ value: this.view.state.doc.toString() }) : this.emit('nile-change', { value: this.view.state.doc.toString() })
@@ -378,39 +362,7 @@ export class NileCodeEditor extends NileElement {
    */
   getTopLevelSuggestions(context: CompletionContext,textBeforeCursor:string){
     const baseMatch: any = textBeforeCursor.match(/([a-zA-Z_$][\w$]*)$/);
-    
-    if (!baseMatch) {
-      const trimmedText = textBeforeCursor.trim();
-      if (trimmedText === '') {
-        const optionsList = Object.keys(this.customAutoCompletions).filter(key => 
-          Object.keys(this.customAutoCompletions[key]).length
-        );
-        
-        const options = optionsList.map((key) => ({
-          label: key,
-          type: 'property',
-          apply: key,
-          boost: 999
-        }));
-        
-        if(this.customCompletionsPaths.length){
-          this.customCompletionsPaths.forEach(path => {
-            options.push({
-              label: ''+path,
-              type: 'property',
-              apply: ''+path,
-              boost: 998
-            });
-          });
-        }
-        
-        return {
-          from: context.pos,
-          options: options
-        };
-      }
-      return null;
-    }
+    if (!baseMatch) return null;
   
     const optionsList = Object.keys(this.customAutoCompletions).filter(key => 
       Object.keys(this.customAutoCompletions[key]).length && 
@@ -426,7 +378,7 @@ export class NileCodeEditor extends NileElement {
     if(this.customCompletionsPaths.length){
       this.customCompletionsPaths
       .filter(path=>path.toLocaleLowerCase().includes(textBeforeCursor.toLocaleLowerCase()))
-      .forEach(path=>{
+      .map(path=>{
         options.push({
           label: ''+path,
           type: 'property',
@@ -513,9 +465,9 @@ export class NileCodeEditor extends NileElement {
 
   getCustomThemeExtension(): Extension {
     if (this.customThemeCSS) {
-      return [EditorView.theme(this.customThemeCSS as { [selector: string]: StyleSpec }), EditorView.theme(customisedThemeCss)];
+      return EditorView.theme(this.customThemeCSS as { [selector: string]: StyleSpec });
     }
-    return [EditorView.theme(customisedThemeCss), EditorView.theme(DefaultTheme)];
+    return EditorView.theme(DefaultTheme);
   }
 
   restrictSingleLine() {
@@ -619,4 +571,3 @@ function convertToSingleLine(code: string) {
   // Remove line breaks and unnecessary whitespace
   return code.replace(/\s+/g, ' ').trim();
 }
-

package/src/nile-code-editor/theme.ts

@@ -36,115 +36,4 @@ export const CustomTheme = {
   ".cm-gutters": {
     fontFamily: 'inherit', // Ensure the gutter font matches
   },
-};
-
-export const customisedThemeCss = {
-  '.cm-tooltip-autocomplete': {
-    padding: '9px 12px',
-    backgroundColor: '#FFFFFF',
-    display: 'block',
-    fontSize: '14px',
-    background: 'white',
-    border: 'solid 1px #C7CED4',
-    borderRadius: '0.25rem',
-    paddingBlock: '0',
-    paddingInline: '0',
-    overscrollBehavior: 'none',
-    color: 'hsl(240 5.3% 26.1%)',
-  },
-  '.cm-tooltip.cm-completionInfo.cm-completionInfo-right': {
-    fontFamily: 'colfax-regular',
-    backgroundColor: '#FFFFFF',
-    color: 'hsl(240 5.3% 26.1%)',
-    padding: "6px 12px",
-    borderTopRightRadius: "0.25rem",
-    borderBottomRightRadius: "0.25rem",
-    border: 'solid 1px #C7CED4',
-    fontSize: '14px',
-  },
-  '.cm-tooltip.cm-tooltip-autocomplete > ul': {
-    fontFamily: 'colfax-regular',
-    fontWeight: '400',
-  },
-  '.cm-tooltip.cm-tooltip-autocomplete > ul > li': {
-    padding: '9px 12px'
-  },
-  '.cm-tooltip.cm-tooltip-autocomplete > ul > li:hover': {
-    backgroundColor: '#005ea61a',
-    color: 'rgb(0, 0, 0)',
-  },
-  '.cm-tooltip.cm-tooltip-autocomplete > ul > li[aria-selected="true"]': {
-    backgroundColor: '#005ea61a',
-    color: '#005EA6',
-  },
-  '.cm-tooltip.cm-tooltip-autocomplete > ul > li[aria-selected="true"]:hover': {
-    color: '#005EA6',
-  },
-  '.cm-completionIcon': {
-    display: 'block',
-    position: 'relative'
-  },
-  '.cm-completionIcon::after': {
-    display: 'block',
-    content: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik00LjM2MDExIDYuMjVMNi45ODUxMSAxLjc1TDkuNjEwMTEgNi4yNUg0LjM2MDExWk01LjY5NTExIDUuNUg4LjMxMjYxTDcuMDAwMTEgMy4yNUw1LjY5NTExIDUuNVoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNi4yNSAxMi4yNUgxLjc1VjcuNzVINi4yNVYxMi4yNVpNMi41IDExLjVINS41VjguNUgyLjVWMTEuNVoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNOC43NDk5NyAxMS44NzA4QzkuMTE5OTggMTIuMTE4IDkuNTU0OTkgMTIuMjUgMTAgMTIuMjVDMTAuNTk2NyAxMi4yNSAxMS4xNjkgMTIuMDEyOSAxMS41OTEgMTEuNTkxQzEyLjAxMjkgMTEuMTY5IDEyLjI1IDEwLjU5NjcgMTIuMjUgMTBDMTIuMjUgOS41NTQ5OSAxMi4xMTggOS4xMTk5OCAxMS44NzA4IDguNzQ5OTdDMTEuNjIzNiA4LjM3OTk2IDExLjI3MjIgOC4wOTE1NyAxMC44NjEgNy45MjEyN0MxMC40NDk5IDcuNzUwOTcgOS45OTc1MSA3LjcwNjQyIDkuNTYxMDUgNy43OTMyM0M5LjEyNDU5IDcuODgwMDUgOC43MjM2OCA4LjA5NDM0IDguNDA5MDEgOC40MDkwMUM4LjA5NDM0IDguNzIzNjggNy44ODAwNSA5LjEyNDU5IDcuNzkzMjMgOS41NjEwNUM3LjcwNjQyIDkuOTk3NTEgNy43NTA5NyAxMC40NDk5IDcuOTIxMjcgMTAuODYxQzguMDkxNTcgMTEuMjcyMiA4LjM3OTk2IDExLjYyMzYgOC43NDk5NyAxMS44NzA4Wk05LjE2NjY1IDguNzUyOEM5LjQxMzMyIDguNTg3OTggOS43MDMzMyA4LjUgMTAgOC41QzEwLjM5NzggOC41IDEwLjc3OTQgOC42NTgwNCAxMS4wNjA3IDguOTM5MzRDMTEuMzQyIDkuMjIwNjUgMTEuNSA5LjYwMjE4IDExLjUgMTBDMTEuNSAxMC4yOTY3IDExLjQxMiAxMC41ODY3IDExLjI0NzIgMTAuODMzNEMxMS4wODI0IDExLjA4IDEwLjg0ODEgMTEuMjcyMyAxMC41NzQgMTEuMzg1OEMxMC4yOTk5IDExLjQ5OTQgOS45OTgzNCAxMS41MjkxIDkuNzA3MzcgMTEuNDcxMkM5LjQxNjM5IDExLjQxMzMgOS4xNDkxMiAxMS4yNzA0IDguOTM5MzQgMTEuMDYwN0M4LjcyOTU2IDEwLjg1MDkgOC41ODY3IDEwLjU4MzYgOC41Mjg4MiAxMC4yOTI2QzguNDcwOTUgMTAuMDAxNyA4LjUwMDY1IDkuNzAwMDcgOC42MTQxOCA5LjQyNTk4QzguNzI3NzEgOS4xNTE4OSA4LjkxOTk3IDguOTE3NjIgOS4xNjY2NSA4Ljc1MjhaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K")',
-    position: 'absolute',
-    left: '0px',
-    top: '2px',
-    lineHeight: '0',
-    verticalAlign: 'middle'
-  },
-  '.cm-completionMatchedText' : {
-    textDecoration: 'none',
-  },
-  '.cm-completionIcon.cm-completionIcon-property::after': {
-    content: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuNjA1MjEgMTEuOTExVjcuODg0ODFMMS44MjU3NiA1LjkxNDYxVjkuOTQwODFMNS42MDUyMSAxMS45MTFaTTYuNDMwOTcgMTEuOTExTDEyLjE3NDIgOC42MDY3OVY0LjU4MDU5TDYuNDMwOTcgNy44ODQ4MVYxMS45MTFaTTYuMDE4MDkgNy4yMzE0MUwxMS44NzI1IDMuODY5OTlMNy45NjYwMyAxLjg1Njg5TDIuMTI3NDggNS4yMTgzMUw2LjAxODA5IDcuMjMxNDFaTTEgMTAuMzc2NFY0Ljk1NzYxTDcuOTgxOTEgMUwxMyAzLjYwOTI5VjkuMDI4MDlMNi4wMTgwOSAxM0wxIDEwLjM3NjRaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K")',
-    position: 'absolute',
-    left: '0px',
-    top: '2px',
-    lineHeight: '0',
-    verticalAlign: 'middle'
-  },
-  '.cm-completionIcon.cm-completionIcon-keyword::after': {
-    content: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuMTk5OTUgNC4wMTQ0OUM2LjE5OTk1IDMuNzkyNyA2LjI3ODE0IDMuNjAzMjkgNi40MzQ1IDMuNDQ2MjZDNi41OTA3NyAzLjI4OTE0IDYuNzc5MjcgMy4yMTA1OCA3IDMuMjEwNThDNy4yMjA3MyAzLjIxMDU4IDcuNDA5MjMgMy4yODkxNCA3LjU2NTUgMy40NDYyNkM3LjcyMTg2IDMuNjAzMjkgNy44MDAwNSAzLjc5MjcgNy44MDAwNSA0LjAxNDQ5QzcuODAwMDUgNC4yMzYyOCA3LjcyMTg2IDQuNDI1NjkgNy41NjU1IDQuNTgyNzJDNy40MDkyMyA0LjczOTg0IDcuMjIwNzMgNC44MTg0IDcgNC44MTg0QzYuNzc5MjcgNC44MTg0IDYuNTkwNzcgNC43Mzk4NCA2LjQzNDUgNC41ODI3MkM2LjI3ODE0IDQuNDI1NjkgNi4xOTk5NSA0LjIzNjI4IDYuMTk5OTUgNC4wMTQ0OVpNNi45MzM1OSAxM0w1LjAyNTE4IDEwLjk3OTFMNS44MTE1OSA5LjkwNjQ1TDUuMDE0NjggOC44MTA5NUw1Ljc0OSA3LjgwNzk1VjYuNzU2OTlDNS4yMzggNi41MDY4OCA0LjgxODc3IDYuMTQ3MSA0LjQ5MTMyIDUuNjc3NjdDNC4xNjM3NyA1LjIwODMyIDQgNC42NTM5MyA0IDQuMDE0NDlDNCAzLjE3ODI5IDQuMjkxOTUgMi40NjY4MiA0Ljg3NTg2IDEuODgwMDlDNS40NTk3NyAxLjI5MzM2IDYuMTY3ODIgMSA3IDFDNy44MzIxOCAxIDguNTQwMjMgMS4yOTMzNiA5LjEyNDE0IDEuODgwMDlDOS43MDgwNSAyLjQ2NjgyIDEwIDMuMTc4MjkgMTAgNC4wMTQ0OUMxMCA0LjYyMzA1IDkuODQ2NjggNS4xNjEwNSA5LjU0MDA1IDUuNjI4NDhDOS4yMzM0MSA2LjA5NTk5IDguODAzNzMgNi40NzIxNyA4LjI1MSA2Ljc1Njk5VjExLjY3NjFMNi45MzM1OSAxM1pNNC42ODUzNiA0LjAxNDQ5QzQuNjg1MzYgNC41NDc2IDQuODUzNTUgNS4wMjc4MiA1LjE4OTkxIDUuNDU1MTRDNS41MjYyNyA1Ljg4MjQ3IDUuOTQxMDUgNi4xNTQ4MiA2LjQzNDIzIDYuMjcyMjFWOC4wNDU4Mkw1Ljg2NTA1IDguODA5MTdMNi42NTkwOSA5LjkyMDg0TDUuOTAxNDUgMTAuOTI0TDYuOTQ4MzIgMTIuMDEzTDcuNTY1NzcgMTEuMzkyNlY2LjI3MjIxQzguMDg2MDUgNi4xMzE0NCA4LjUwNzU5IDUuODU3NTggOC44MzA0MSA1LjQ1MDYyQzkuMTUzMjMgNS4wNDM2NiA5LjMxNDY0IDQuNTY0OTUgOS4zMTQ2NCA0LjAxNDQ5QzkuMzE0NjQgMy4zNzA4NSA5LjA4OSAyLjgyMjMxIDguNjM3NzMgMi4zNjg4NUM4LjE4NjQ1IDEuOTE1NCA3LjY0MDU1IDEuNjg4NjcgNyAxLjY4ODY3QzYuMzU5NDUgMS42ODg2NyA1LjgxMzU1IDEuOTE1NCA1LjM2MjI3IDIuMzY4ODVDNC45MTEgMi44MjIzMSA0LjY4NTM2IDMuMzcwODUgNC42ODUzNiA0LjAxNDQ5WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==")',
-    position: 'absolute',
-    left: '0px',
-    top: '2px',
-    lineHeight: '0',
-    verticalAlign: 'middle'
-  },
-  '.cm-completionIcon.cm-completionIcon-variable::after': {
-    content: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuNjA1MjEgMTEuOTExVjcuODg0ODFMMS44MjU3NiA1LjkxNDYxVjkuOTQwODFMNS42MDUyMSAxMS45MTFaTTYuNDMwOTcgMTEuOTExTDEyLjE3NDIgOC42MDY3OVY0LjU4MDU5TDYuNDMwOTcgNy44ODQ4MVYxMS45MTFaTTYuMDE4MDkgNy4yMzE0MUwxMS44NzI1IDMuODY5OTlMNy45NjYwMyAxLjg1Njg5TDIuMTI3NDggNS4yMTgzMUw2LjAxODA5IDcuMjMxNDFaTTEgMTAuMzc2NFY0Ljk1NzYxTDcuOTgxOTEgMUwxMyAzLjYwOTI5VjkuMDI4MDlMNi4wMTgwOSAxM0wxIDEwLjM3NjRaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K")',
-    position: 'absolute',
-    left: '0px',
-    top: '2px',
-    lineHeight: '0',
-    verticalAlign: 'middle'
-  },
-  '.cm-completionIcon.cm-completionIcon-text::after': {
-    content: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuNjA1MjEgMTEuOTExVjcuODg0ODFMMS44MjU3NiA1LjkxNDYxVjkuOTQwODFMNS42MDUyMSAxMS45MTFaTTYuNDMwOTcgMTEuOTExTDEyLjE3NDIgOC42MDY3OVY0LjU4MDU5TDYuNDMwOTcgNy44ODQ4MVYxMS45MTFaTTYuMDE4MDkgNy4yMzE0MUwxMS44NzI1IDMuODY5OTlMNy45NjYwMyAxLjg1Njg5TDIuMTI3NDggNS4yMTgzMUw2LjAxODA5IDcuMjMxNDFaTTEgMTAuMzc2NFY0Ljk1NzYxTDcuOTgxOTEgMUwxMyAzLjYwOTI5VjkuMDI4MDlMNi4wMTgwOSAxM0wxIDEwLjM3NjRaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K")',
-    position: 'absolute',
-    left: '0px',
-    top: '2px',
-    lineHeight: '0',
-    verticalAlign: 'middle'
-  },
-  '.cm-completionIcon.cm-completionIcon-function::after': {
-    content: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNzE5ODMgNC4zNTY0NUwzLjMxODk0IDQuODA1NjZMMy4zNTgzNCA0Ljk3NTU5SDQuMzkwNjJDNC4xNzk4MyA2LjE4NDU3IDQuMDIyMjMgNy4yNzQ0MSAzLjcxOTgzIDguOTU0MUMzLjM1ODM0IDExLjA5NjcgMy4xNTA1IDExLjYyMyAzLjAyNzM4IDExLjgxNTRDMi45MTkwMyAxMi4wMDU5IDIuNzYzNCAxMi4xMDQ1IDIuNTUyNjEgMTIuMTA0NUMyLjMyMTEzIDEyLjEwNDUgMS45MDI1IDExLjkyMjkgMS42Nzc5MiAxMS43MTY4QzEuNTk3MTUgMTEuNjYyMSAxLjUwMTYxIDExLjY3NTggMS40MDAxNSAxMS43NDIyQzEuMTk3MjQgMTEuOTEyMSAxLjAwMDI0IDEyLjE3MzggMS4wMDAyNCAxMi40MDgyQzAuOTg4NDIgMTIuNzI0NiAxLjQxNDkzIDEzIDEuODIxNzMgMTNDMi4xODAyNyAxMyAyLjcwODI0IDEyLjc3NzMgMy4yNjM3OCAxMi4yNTM5QzQuMDIzMjIgMTEuNTQgNC41OTE1NiAxMC41NjA1IDUuMDY2MzMgOC40NDMzNkM1LjM3MTY5IDcuMDkxOCA1LjUxNTUgNi4yMTI4OSA1LjczMDIzIDQuOTc2NTZMNy4wMTI3IDQuODYxMzNMNy4yOTA0NyA0LjM1NjQ1SDUuODQ2NDZDNi4yMTk3NyAyLjAyODMyIDYuNTExMzMgMS42ODM1OSA2Ljg2OTg4IDEuNjgzNTlDNy4xMDgyNSAxLjY4MzU5IDcuMzg2MDIgMS44NjUyMyA3LjcwNTE2IDIuMjIyNjZDNy43OTk3MiAyLjM1MTU2IDcuOTQxNTYgMi4zMzc4OSA4LjA0OTkxIDIuMjVDOC4yMzIxNCAyLjE0MjU4IDguNDU2NzIgMS44NjcxOSA4LjQ3MTQ5IDEuNjE3MTlDOC40ODIzMyAxLjM0MTggOC4xNTEzNyAxIDcuNTgyMDMgMUM3LjA2NTg5IDEgNi4yNzQ5MyAxLjM0MTggNS42MTAwNiAyLjAxMzY3QzUuMDI2OTMgMi42MjU5OCA0LjcyMTU4IDMuMzkwNjIgNC41MTA3OSA0LjM1NjQ1SDMuNzE5ODNaTTcuODIzMzYgNS45MTUwNEM4LjIyMTMgNS4zODk2NSA4LjQ1OTY3IDUuMjE0ODQgOC41ODI4IDUuMjE0ODRDOC43MDk4NiA1LjIxNDg0IDguODExMzIgNS4zMzg4NyA5LjAyOSA2LjAzNjEzTDkuNDAxMzMgNy4yMjY1NkM4LjY4MTMgOC4zMTgzNiA4LjE1NDMyIDguOTI2NzYgNy44MzQxOSA4LjkyNjc2QzcuNzI3ODEgOC45MjY3NiA3LjYyMDQ1IDguODkzNTUgNy41NDQ2IDguODE5MzRDNy40Njk3NCA4Ljc0NTEyIDcuMzg3IDguNjgzNTkgNy4zMDYyMyA4LjY4MzU5QzcuMDQyMjUgOC42ODM1OSA2LjcxNTIzIDkuMDAwOTggNi43MDkzMiA5LjM5NDUzQzYuNzAzNDEgOS43OTU5IDYuOTg3MDkgMTAuMDgzIDcuMzU5NDIgMTAuMDgzQzcuOTk4NjkgMTAuMDgzIDguNTM5NDYgOS40NjA5NCA5LjU4MzU2IDcuODExNTJMOS44ODg5MSA4LjgzMjAzQzEwLjE1MDkgOS43MDg5OCAxMC40NTgyIDEwLjA4MyAxMC44NDI0IDEwLjA4M0MxMS4zMTcyIDEwLjA4MyAxMS45NTU0IDkuNjgxNjQgMTIuNjUxOCA4LjU5NjY4TDEyLjM2MDMgOC4yNjY2QzExLjk0MTcgOC43NjY2IDExLjY2MzkgOS4wMDA5OCAxMS40OTk0IDkuMDAwOThDMTEuMzE2MiA5LjAwMDk4IDExLjE1NTYgOC43MjM2MyAxMC45NDM4IDguMDQxOTlMMTAuNDk3NiA2LjYwMzUyQzEwLjc2MTYgNi4yMTc3NyAxMS4wMjE3IDUuODkzNTUgMTEuMjUwMiA1LjYzNDc3QzExLjUyMiA1LjMyNzE1IDExLjczMTkgNS4xOTYyOSAxMS44NzQ3IDUuMTk2MjlDMTEuOTk0OCA1LjE5NjI5IDEyLjA5OTMgNS4yNDcwNyAxMi4xNjQzIDUuMzE4MzZDMTIuMjUgNS40MTIxMSAxMi4zMDEyIDUuNDU2MDUgMTIuNDAyNiA1LjQ1NjA1QzEyLjYzMjEgNS40NTYwNSAxMi45ODY3IDUuMTY2OTkgMTIuOTk5NiA0Ljc4NDE4QzEzLjAxMTQgNC40Mjg3MSAxMi43ODg4IDQuMTI1OTggMTIuNDAyNiA0LjEyNTk4QzExLjgxOTUgNC4xMjU5OCAxMS4zMDUzIDQuNjI0MDIgMTAuMzE1NCA2LjA4MzAxTDEwLjExMTUgNS40NTcwM0M5LjgyNTg3IDQuNTc4MTIgOS42MzY3NSA0LjEyNTk4IDkuMjM4ODEgNC4xMjU5OEM4Ljc3NTg2IDQuMTI1OTggOC4xMzk1NSA0LjY5MDQzIDcuNTE3MDIgNS41ODQ5Nkw3LjgyMzM2IDUuOTE1MDRaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K")',
-    position: 'absolute',
-    left: '0px',
-    top: '2px',
-    lineHeight: '0',
-    verticalAlign: 'middle'
-  },
-  '.cm-completionIcon.cm-completionIcon-class::after': {
-    content: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuOTA2NjUgMTNMMS41IDEwVjRMNi45MDY2NSAxTDEyLjMxMzMgNFYxMEw2LjkwNjY1IDEzWk01LjE0ODk3IDUuNTA3MzJDNS4zNjUzNSA1LjI1NzQyIDUuNjI5MTQgNS4wNTkxOCA1Ljk0MDM0IDQuOTEyNTlDNi4yNTE2NSA0Ljc2NiA2LjU3Mzc1IDQuNjkyNzEgNi45MDY2NSA0LjY5MjcxQzcuMjM5NTQgNC42OTI3MSA3LjU2MTY0IDQuNzY2IDcuODcyOTYgNC45MTI1OUM4LjE4NDE1IDUuMDU5MTggOC40NDc5NCA1LjI1NzQyIDguNjY0MzIgNS41MDczMkwxMC45MjUzIDQuMjYyMjRMNi45MDY2NSAyLjAzMTc0TDIuODg3OTkgNC4yNjIyNEw1LjE0ODk3IDUuNTA3MzJaTTYuNDU4OTYgMTEuNzMzN1Y5LjI3ODJDNS45MjExNyA5LjE2Njg1IDUuNDc2ODEgOC44OTg0MSA1LjEyNTkgOC40NzI4OEM0Ljc3NDg3IDguMDQ3MjQgNC41OTkzNSA3LjU1NjI4IDQuNTk5MzUgN0M0LjU5OTM1IDYuODgzNDkgNC42MDU1NSA2Ljc2NDA1IDQuNjE3OTUgNi42NDE2OEM0LjYzMDIzIDYuNTE5NDMgNC42NjM3NSA2LjQwNTczIDQuNzE4NSA2LjMwMDU4TDIuMzk1MzcgNS4wMDQwMlY5LjQ3NTUyTDYuNDU4OTYgMTEuNzMzN1pNNi45MDY2NSA4LjQxMTkzQzcuMzA0MDUgOC40MTE5MyA3LjYzODcyIDguMjc1OTYgNy45MTA2NiA4LjAwNDAyQzguMTgyNiA3LjczMjA4IDguMzE4NTcgNy4zOTc0MSA4LjMxODU3IDdDOC4zMTg1NyA2LjYwMjU5IDguMTgyNiA2LjI2NzkyIDcuOTEwNjYgNS45OTU5OEM3LjYzODcyIDUuNzI0MDQgNy4zMDQwNSA1LjU4ODA3IDYuOTA2NjUgNS41ODgwN0M2LjUwOTI0IDUuNTg4MDcgNi4xNzQ1NyA1LjcyNDA0IDUuOTAyNjMgNS45OTU5OEM1LjYzMDY5IDYuMjY3OTIgNS40OTQ3MiA2LjYwMjU5IDUuNDk0NzIgN0M1LjQ5NDcyIDcuMzk3NDEgNS42MzA2OSA3LjczMjA4IDUuOTAyNjMgOC4wMDQwMkM2LjE3NDU3IDguMjc1OTYgNi41MDkyNCA4LjQxMTkzIDYuOTA2NjUgOC40MTE5M1pNNy4zNTQzMyAxMS43MzM3TDExLjQxNzkgOS40NzU1MlY1LjAwNDAyTDkuMDk0NzkgNi4zMDA1OEM5LjEzODA3IDYuNDA1NzMgOS4xNjg3MSA2LjUxOTQzIDkuMTg2NzQgNi42NDE2OEM5LjIwNDg3IDYuNzY0MDUgOS4yMTM5NCA2Ljg4MzQ5IDkuMjEzOTQgN0M5LjIxMzk0IDcuNTU2MjggOS4wMzg0MyA4LjA0NzI0IDguNjg3NCA4LjQ3Mjg4QzguMzM2NDggOC44OTg0MSA3Ljg5MjEzIDkuMTY2ODUgNy4zNTQzMyA5LjI3ODJWMTEuNzMzN1oiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo= ")',
-    position: 'absolute',
-    left: '0px',
-    top: '2px',
-    lineHeight: '0',
-    verticalAlign: 'middle'
-  },
-  '.cm-completionLabel': {
-    marginLeft: '18px',
-  }
 };

package/src/nile-empty-state/nile-empty-state.ts

@@ -52,20 +52,20 @@ export class NileEmptyState extends NileElement {
    */
   public render(): TemplateResult {
     return html`
-		<div part="container" class="${classMap({
+		<div class="${classMap({
       'empty-state': true,
       'empty-state--sm': this.size == 'sm',
       'empty-state--md': this.size == 'md',
       'empty-state--lg': this.size == 'lg'
     })}">
-      <div  part="body" class="${classMap({ 'empty-state__body': true })}">
+      <div class="${classMap({ 'empty-state__body': true })}">
 
         ${this.variant == 'content' ? html`
-        <div part="content-image" class="empty-state__body--content">
+        <div class="empty-state__body--content">
           
-          <div part="image" src="" class="${classMap({ 'empty-state__image': true, 'empty-state__image--grayscale':this.grayscale  })}"></div>
+          <div src="" class="${classMap({ 'empty-state__image': true, 'empty-state__image--grayscale':this.grayscale  })}"></div>
           ${!this.icon ? nothing : html`
-          <div part="icon-wrapper" class="empty-state__img__icon">
+          <div class="empty-state__img__icon">
             <nile-icon name="${this.icon}" color="white" size="${this.size == 'sm' ? 24 : this.size == 'md' ? 24 : 28}"></nile-icon>
           </div>`
           }
@@ -73,26 +73,26 @@ export class NileEmptyState extends NileElement {
         }
 				
 			  ${this.variant == 'tonal' ? html`
-				<div part="tonal-body" class="empty-state__body--tonal">
+				<div class="empty-state__body--tonal">
 					<nile-icon name="${this.icon}" size="40"></nile-icon>
 				</div>`: nothing
         }
 
 			  ${this.variant == 'flat' ? html`
-				<div part="flat-body" class="empty-state__body--flat">
+				<div class="empty-state__body--flat">
 					<span class="nile-flat-type-icon">
 						<nile-icon name="${this.icon}" size="${this.size == 'sm' ? 24 : this.size == 'md' ? 24 : 28}" variant="secondary"></nile-icon>
 					</span>
 				</div>`: nothing
         }
       
-        <div part="text-section" class="empty__state__text-section">
-          <div part="text" class="empty-state__text">${this.text}</div>
-          <div part="subtitle" class="empty-state__subtext">${this.subText}</div>
+        <div class="empty__state__text-section">
+          <div class="empty-state__text">${this.text}</div>
+          <div class="empty-state__subtext">${this.subText}</div>
         </div>
 			</div>
 
-			<div part="actions" class="empty-state-actions">
+			<div class="empty-state-actions">
 				<slot></slot>
 			</div>
 		</div>

package/src/nile-error-notification/nile-error-notification.ts

@@ -35,6 +35,7 @@ export class NileErrorNotification extends LitElement {
   @property({ type: String, reflect: true  }) errorMessage: string = '';
 
   @property({ type: String, reflect: true  }) color: string = '';
+  
   protected updated(_changedProperties: PropertyValues): void {
     if(_changedProperties.has('color')){
       this.style.setProperty('--indication-color',this.color)
@@ -51,7 +52,7 @@ export class NileErrorNotification extends LitElement {
    */
   public render(): TemplateResult {
     return html`
-      <div class="nile-error-notification" part="container">
+      <div class="nile-error-notification">
         <nile-icon
           name="info2"
           size="14"
@@ -59,9 +60,7 @@ export class NileErrorNotification extends LitElement {
           part="icon"
           color="var(--indication-color)"
         ></nile-icon>
-        <span part="message">
-          ${this.errorMessage}
-        </span>
+        ${this.errorMessage}
       </div>
     `;
   }

package/src/nile-icon/icons/svg/index.ts

@@ -32,7 +32,6 @@ export { default as arrowleft } from './arrowleft';
 export { default as arrowright } from './arrowright';
 export { default as arrowup } from './arrowup';
 export { default as attributemapanalysisicon } from './attribute-map-analysis-icon';
-export { default as attribute } from './attribute';
 export { default as attributemap } from './attributemap';
 export { default as automationdetails } from './automation-details';
 export { default as back } from './back';
@@ -61,7 +60,6 @@ export { default as checkdone01 } from './check-done-01';
 export { default as checkdone02 } from './check-done-02';
 export { default as chevronleftdouble } from './chevron-left-double';
 export { default as chevronup } from './chevron-up';
-export { default as class } from './class';
 export { default as clockcheck } from './clock-check';
 export { default as clockrewind } from './clock-rewind';
 export { default as clock } from './clock';
@@ -72,7 +70,6 @@ export { default as collapse1 } from './collapse-1';
 export { default as collapse } from './collapse';
 export { default as color } from './color';
 export { default as column02 } from './column-02';
-export { default as columnadd } from './column-add';
 export { default as columns03 } from './columns-03';
 export { default as combo1 } from './combo1';
 export { default as comment } from './comment';
@@ -176,7 +173,6 @@ export { default as fullunion } from './full-union';
 export { default as fullscreen } from './fullscreen';
 export { default as fullscreenexit } from './fullscreenexit';
 export { default as fullscreenshrink } from './fullscreenshrink';
-export { default as function } from './function';
 export { default as funnel02 } from './funnel-02';
 export { default as funnel } from './funnel';
 export { default as gateway } from './gateway';
@@ -225,7 +221,6 @@ export { default as intersection } from './intersection';
 export { default as js } from './js';
 export { default as keyperformanceindicator } from './key-performance-indicator';
 export { default as keyboard01 } from './keyboard-01';
-export { default as keyword } from './keyword';
 export { default as kill } from './kill';
 export { default as laptop01 } from './laptop-01';
 export { default as layersthree02 } from './layers-three-02';

package/src/nile-pagination/nile-pagination.css.ts

@@ -18,10 +18,14 @@ export const styles = css`
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: var(--nile-spacing-spacing-md) var(--nile-spacing-spacing-lg) ;
+    padding: var(--nile-spacing-spacing-md) var(--nile-spacing-spacing-lg);
+  }
+
+  .pagination-wrapper.v2 {
+    justify-content: flex-start;
+    gap: var(--nile-spacing-spacing-lg);
   }
 
- 
   .pagination-wrapper.v2 .pager-container {
     flex-direction: row;
     align-items: center;
@@ -37,79 +41,12 @@ export const styles = css`
     font-weight: var(--nile-font-weight-regular);
   }
 
- 
-  .pagination-wrapper.compact {
-    min-width: 324px;
-    justify-content: space-between;
-  }
-
-
-
-.pagination-wrapper.compact .range-text {
-  margin-right: var(--nile-spacing-spacing-md);
-  white-space: nowrap;
-}
-
-
-.pagination-wrapper.compact .pager-container {
-  gap: var(--nile-spacing-spacing-md);
-}
-
-
-  .pagination-wrapper.compact .pager-container {
-    display: flex;
-    align-items: center;
-    gap: var(--nile-spacing-spacing-md);
-  }
-
-  .pagination-wrapper.compact .page-size-dropdown ::part(base) {
-    min-width: 32px;
-    height: 32px;
-    padding: 0 6px;
-  }
-
-  .pagination-wrapper.compact .page-size-dropdown .chevron {
-    transition: transform 0.2s;
-  }
-  .pagination-wrapper.compact .page-size-dropdown .open .chevron {
-    transform: rotate(180deg);
-  }
-
-  .pagination-wrapper.compact ul.pagination:not(.compact-pagination) {
-    display: none;
-  }
-
-  .compact-pagination {
-    display: flex;
-    align-items: center;
-    gap: var(--nile-spacing-spacing-xs);
-    list-style: none;
-    margin: 0;
-    padding: 0;
-  }
-  .page-dropdown .current-page-btn {
-    padding: 2px;
-    font-size: var(--nile-font-size-small);
-  }
-
-  nile-button.current-page-btn::part(base){
-    min-width: 51px;
-  }
-
-  nile-button.current-page-btn::part(base):active {
-  min-width: 51px;
-}
-
   .pager-container {
     display: flex;
     align-items: center;
     gap: var(--nile-spacing-spacing-3xl);
   }
 
-.pagination-wrapper.compact .pager-container {
-  gap: var(--nile-spacing-xxs) !important;
-}
-
   .range-text {
     font-size: var(--nile-font-size-small);
     color: var(--nile-colors-dark-900);
@@ -138,48 +75,6 @@ export const styles = css`
     overflow-y: auto;
     width: 66px;
   }
-    .down-scroll-wrapper {
-    max-height: 150px;
-    overflow-y: auto;
-    width: 60px;
-  }
-
-
-    .compact-scroll-wrapper {
-    max-height: 160px;
-    overflow-y: auto;
-    width: 60px;
-  }
-  .compact-dropdown nile-menu {
-    overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
-    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
-  }
-  
-    .page-size-dropdown nile-menu {
-    overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
-    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
-  }
-
-      .compact-scroll-wrapper1 {
-    max-height: 164px;
-    overflow-y: auto;
-    width: 60px;
-  }
-
-  .compact-dropdown1 nile-menu {
-    overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
-    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
-  }
-  
-    .compact-dropdown1 nile-menu {
-    overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
-    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
-  }
-
 
   .ellipsis-dropdown nile-menu {
     overflow-y: auto;
@@ -187,64 +82,56 @@ export const styles = css`
     box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
   }
 
+ 
+
   .page-size-menu {
     max-height: 144px;
     overflow-y: auto;
   }
 
-.pagination-wrapper.fluid ul.pagination li:first-child {
-  margin-right: var(--nile-spacing-spacing-xs);
-}
-.pagination-wrapper.fluid ul.pagination li:last-child {
-  margin-left: var(--nile-spacing-spacing-md);
-}
-
+  ul.pagination li:first-child {
+    margin-right: var(--nile-spacing-spacing-xs);
+  }
+  ul.pagination li:last-child {
+    margin-left: var(--nile-spacing-spacing-md);
+  }
 
   .page-size-label {
     font-size: var(--nile-type-scale-3);
     color: var(--nile-colors-dark-500);
     margin-left: var(--nile-spacing-spacing-md);
     font-feature-settings: 'liga' off, 'clig' off;
-    font-weight: var(--nile-font-weight-regular); 
+    font-weight: var(--nile-font-weight-regular);
   }
 
   nile-button::part(base) {
-    min-width: 32px;
-    height: 32px;
-    padding: 0px 6px;
-    box-shadow: none;
-  }
+      min-width: 32px;
+  height: 32px;
+  padding: 0px 6px;
+  box-shadow: none;
+}
 
   nile-button::part(base):active {
-    min-width: 32px;
-    height: 32px;
-    padding: 0px 6px;
-    box-shadow: none;
-    border: none;
-  }
+  min-width: 32px;
+  height: 32px;
+  padding: 0px 6px;
+  box-shadow: none;
+  border:none;
+}
+ 
+ nile-button.down::part(base){
+  min-width: 62px;
+
+ }
+.page-size-dropdown .chevron {
+  transition: transform 0.2s;
+}
+.page-size-dropdown .open .chevron {
+  transform: rotate(180deg);
+}
+
 
-  nile-button.down::part(base) {
-    min-width: 62px;
-  }
 
-  nile-button.compactbtn:part(base){
-    background-color: red;
-  }
-  .page-size-dropdown .chevron {
-    transition: transform 0.2s;
-  }
-  .page-size-dropdown .open .chevron {
-    transform: rotate(180deg);
-  }
- 
-  .pagination-wrapper.compact .compact-dropdown .chevron,
-  .pagination-wrapper.compact .compact-dropdown1 .chevron {
-    transition: transform 0.2s;
-  }
-  .pagination-wrapper.compact .compact-dropdown .down.open .chevron,
-  .pagination-wrapper.compact .compact-dropdown1 .current-page-btn.open .chevron {
-    transform: rotate(180deg);
-  }
 
 
 `;