@aquera/nile-elements 2.0.9 → 2.0.10

package/dist/nile-code-editor/nile-code-editor.esm.js

@@ -17,4 +17,4 @@ import{__decorate as O}from"tslib";import{html as e}from"lit";import{query as t,
             <nile-form-error-message
               >${this.errorMessage}</nile-form-error-message
             >
-          `:""}`}createNewView(O=!0){this.view&&this.view.destroy(),this.createState(),this.view=new g({state:this.viewState,parent:this.codeEditor}),this.view.dom.addEventListener("keydown",(O=>{this.checkForSpaceKey(O),this.handleEscapeKey(O)}),!0),O&&this.emit("nile-after-update",{createNewView:this.createNewView,codeMirrorInstance:this.view},!1)}checkForSpaceKey(O){"Space"!==O.code||O.ctrlKey?this.isSpacePressed=!1:this.isSpacePressed=!0}closeCompletion(){this.view&&L(this.view)}handleEscapeKey(O){"Escape"===O.key&&this.view&&null!==B(this.view.state)&&(O.stopPropagation(),O.preventDefault(),L(this.view))}createState(){const O=this.lineNumbersComp.of(this.getLineNumbersExension()),e=this.readOnlyComp.of(this.getReadOnlyExtension()),t=this.restrictSingleLineComp.of(this.getSingleLineExtension()),i=this.placeholderComp.of(this.getPlaceholderExtension()),a=this.themeComp.of(this.getCustomThemeExtension()),r=this.defaultSyntaxHighlightingComp.of(this.getDefaultSyntaxHighlightingExtension()),l=this.autoCompleteStyleComp.of(this.getAutoCompleteStyleExtension()),s=this.getLanguageExtension(),n=this.customCompletionComp.of(FO.data.of({autocomplete:this.customAutocomplete}));return this.viewState=Y.create({doc:this.multiline?this.value:Ui(this.value),extensions:[D({highlightActiveLine:!1,foldGutter:this.enableFoldGutters,enableSearch:this.enableSearch}),O,e,t,n,i,r,this.autoCompletionComp.of(A({aboveCursor:this.aboveCursor})),s,this.darkThemeComp.of(this.getDarkThemeExtension()),a,l,this.getTabCompletionKeymap(),g.updateListener.of((O=>{O.docChanged&&(this.debounce?this.emitAfterTimeout({value:this.view.state.doc.toString()}):this.emit("nile-change",{value:this.view.state.doc.toString()}))})),g.domEventHandlers({focus:()=>this.dispatchEvent(new Event("nile-focus")),blur:()=>this.dispatchEvent(new Event("nile-blur"))})]}),this.viewState}getNestedSuggestions(O,e,t){if(!function(O){return/^([a-zA-Z_$][\w$]*)(\.[a-zA-Z_$][\w$]*|\[\s*(['"]?[a-zA-Z0-9_$]*['"]?)\s*\])*([\.\[])?$/.test(O)}(e)||![".","["].includes(e.at(-1)))return null;const i=function(O){const e=/([a-zA-Z_$][\w$]*)(\[(?:[^\]]+)\]|\.[a-zA-Z_$][\w$]*)*/g,t=[...O.matchAll(e)];if(t.length>0){const e=[t[0][1]],i=O.match(/\[(.*?)\]|\.(\w+)/g)||[];for(const O of i)O.startsWith("[")?e.push(O.slice(1,-1).replace(/['"]/g,"")):O.startsWith(".")&&e.push(O.slice(1));return e}return null}(e);if(!i)return null;const a=t.replace(/["'\[]/g,""),r=a!==t,l="["===e.at(-1);if("."===e.at(-1)&&r)return null;let s=(n=this.customAutoCompletions,i.reduce(((O,e)=>O&&"object"==typeof O?O[e]:null),n));var n;return s&&"object"==typeof s?(a&&(s=Object.fromEntries(Object.entries(s).filter((([O])=>O.toLowerCase().startsWith(a.toLowerCase()))))),{from:O.pos-a.length,options:Object.keys(s).map((O=>({label:O,type:"property",info:`Key of ${i[i.length-1]}`,apply:this.allowVariableInCustomSuggestion||!l||r?O:`'${O}'`,boost:999})))}):null}getTopLevelSuggestions(O,e){const t=e.match(/([a-zA-Z_$][\w$]*)$/);if(!t){if(""===e.trim()&&!this.isSpacePressed){const e=Object.keys(this.customAutoCompletions).filter((O=>Object.keys(this.customAutoCompletions[O]).length)).map((O=>({label:O,type:"property",apply:O,boost:999})));return this.customCompletionsPaths.length&&this.customCompletionsPaths.forEach((O=>{e.push({label:""+O,type:"property",apply:""+O,boost:998})})),{from:O.pos,options:e}}return null}const i=Object.keys(this.customAutoCompletions).filter((O=>Object.keys(this.customAutoCompletions[O]).length&&O.toLowerCase().startsWith(e.toLowerCase()))).map((O=>({label:O,type:"property",apply:O,boost:999})));return this.customCompletionsPaths.length&&this.customCompletionsPaths.filter((O=>O.toLocaleLowerCase().includes(e.toLocaleLowerCase()))).forEach((O=>{i.push({label:""+O,type:"property",apply:""+O,boost:998})})),{from:O.pos-t[1].length,options:i}}emitAfterTimeout(O){this.timeOut&&clearTimeout(this.timeOut),this.timeOut=setTimeout((()=>this.emit("nile-change",O,!1)),this.debounceTimeout)}focusAtPosition(O=this.view.state.doc.toString().length){this.view&&(this.view.dispatch({selection:{anchor:O}}),this.view.focus())}singleLineMultiLineToggle(){this.view.dispatch({changes:{from:0,to:this.view.state.doc.length,insert:this.multiline?this.value:Ui(this.value)}})}getLineNumbersExension(){return!this.multiline&&this.lineNumbers||this.multiline&&this.lineNumbersMultiline?T():[]}getLanguageExtension(){switch(this.language){case"sql":return function(O={}){let e=O.dialect||ze;return new m(e.language,[Ge(O),We(e,!!O.upperCaseKeywords)])}();case"json":return new m(Ce);case"html":return function(O={}){let e,t="";!1===O.matchClosingTags&&(t="noMatch"),!0===O.selfClosingTags&&(t=(t?t+" ":"")+"selfClosing"),(O.nestedLanguages&&O.nestedLanguages.length||O.nestedAttributes&&O.nestedAttributes.length)&&(e=ut((O.nestedLanguages||[]).concat(_i),(O.nestedAttributes||[]).concat(Ri)));let i=e?Yi.configure({wrap:e,dialect:t}):t?Ti.configure({dialect:t}):Ti;return new m(i,[Ti.data.of({autocomplete:vi(O)}),!1!==O.autoCloseTags?Vi:[],si().support,new m(Et,Et.data.of({autocomplete:zt})).support])}();default:return function(O={}){let e=O.jsx?O.typescript?te:ee:O.typescript?Oe:FO,t=O.typescript?MO.concat(re):EO.concat(ae);return new m(e,[FO.data.of({autocomplete:z(NO,E(t))}),FO.data.of({autocomplete:KO}),O.jsx?ne:[]])}()}}getReadOnlyExtension(){if(this.disabled)return[Y.readOnly.of(!0),g.editable.of(!1)];if(this.readonly){const O=[Y.readOnly.of(!0)];return this.hideReadOnlyCursor&&O.push(g.theme(K)),O}return[]}getSingleLineExtension(){return this.multiline?[]:Y.transactionFilter.of((O=>O.newDoc.lines>1?[]:O))}getPlaceholderExtension(){return this.placeholder?j(this.placeholder):[]}parseColor(O){const e=O.match(/^#([0-9a-f]{3,8})$/i)?.[1];if(e){const O=e.length<=4?e.slice(0,3).replace(/./g,(O=>O+O)):e.slice(0,6);return 6!==O.length?null:[0,2,4].map((e=>parseInt(O.slice(e,e+2),16)))}const t=O.match(/^rgba?\(([^)]+)\)$/i)?.[1].split(/[\s,/]+/).map(Number);return t&&t.length>=3&&t.slice(0,3).every((O=>!isNaN(O)))?[t[0],t[1],t[2]]:null}isDarkTheme(){const O=document.documentElement.getAttribute("data-theme");if("dark"===O)return!0;if("light"===O)return!1;const e=getComputedStyle(document.documentElement).getPropertyValue("--ng-colors-bg-primary").trim(),t=this.parseColor(e);return!!t&&(299*t[0]+587*t[1]+114*t[2])/1e3<128}getDarkThemeExtension(){return this.isDarkTheme()?[F,V()]:[]}getDefaultSyntaxHighlightingExtension(){if(this.disableSyntaxHighlighting)return[];const O=this.isDarkTheme()?H:W;return U(O,{fallback:!0})}getCustomThemeExtension(){return this.customThemeCSS?this.defaultFont?[g.theme(this.customThemeCSS),g.theme(N),g.theme(OO)]:[g.theme(this.customThemeCSS),g.theme(N)]:this.defaultFont?[g.theme(N),g.theme(OO)]:[g.theme(N)]}getAutoCompleteStyleExtension(O){if(this.autoCompleteStyle?.width){const e=(O||(this.codeEditor?this.codeEditor.getBoundingClientRect().width:300))*parseFloat(this.autoCompleteStyle.width.replace("%",""))/100,t=this.autoCompleteStyle.multiline?{overflow:"visible",textOverflow:"unset",whiteSpace:"normal",wordWrap:"break-word"}:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"};return[G({position:"fixed",tooltipSpace:()=>{const O=this.codeEditor.getBoundingClientRect();return{left:O.left,top:0,right:O.right,bottom:1e3}}}),g.theme({".cm-tooltip.cm-tooltip-autocomplete":{maxWidth:e-15+"px !important"},".cm-tooltip.cm-tooltip-autocomplete > ul > li":{...t,maxWidth:"100%"},".cm-tooltip.cm-tooltip-autocomplete > ul":{minWidth:"unset !important"}})]}return[]}updateAutocompleteWidth(O){this.view&&this.view.dispatch({effects:this.autoCompleteStyleComp.reconfigure(this.getAutoCompleteStyleExtension(O))})}restrictSingleLine(){return Y.transactionFilter.of((O=>O.newDoc.lines>1?[]:O))}};function Ui(O){return O?O.replace(/\s+/g," ").trim():""}O([t(".code__editor__container")],Wi.prototype,"codeEditor",void 0),O([i({type:String,reflect:!0,attribute:!0})],Wi.prototype,"value",void 0),O([i({type:String,reflect:!0,attribute:!0})],Wi.prototype,"expandIcon",void 0),O([i({type:String,reflect:!0,attribute:!0})],Wi.prototype,"placeholder",void 0),O([i({type:Object,reflect:!0,attribute:!0})],Wi.prototype,"customAutoCompletions",void 0),O([i({type:Array,reflect:!0,attribute:!0})],Wi.prototype,"customCompletionsPaths",void 0),O([i({type:String,reflect:!0,attribute:!0})],Wi.prototype,"language",void 0),O([i({type:String,reflect:!0,attribute:"error-message"})],Wi.prototype,"errorMessage",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"error",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"enableSearch",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"noborder",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"multiline",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"enableFoldGutters",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"allowVariableInCustomSuggestion",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"lineNumbers",void 0),O([i({type:Boolean,reflect:!0,attribute:!1})],Wi.prototype,"disableSyntaxHighlighting",void 0),O([i({type:Object,attribute:!1})],Wi.prototype,"customThemeCSS",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"lineNumbersMultiline",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"hasScroller",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"expandable",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"readonly",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"disabled",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"debounce",void 0),O([i({type:Number,reflect:!0,attribute:!0})],Wi.prototype,"debounceTimeout",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"aboveCursor",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"tabCompletion",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"defaultFont",void 0),O([i({type:Object,attribute:!1})],Wi.prototype,"autoCompleteStyle",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"hideReadOnlyCursor",void 0),Wi=O([a("nile-code-editor")],Wi);export{Wi as N};
+          `:""}`}createNewView(O=!0){this.view&&this.view.destroy(),this.createState(),this.view=new g({state:this.viewState,parent:this.codeEditor}),this.view.dom.addEventListener("keydown",(O=>{this.checkForSpaceKey(O),this.handleEscapeKey(O)}),!0),O&&this.emit("nile-after-update",{createNewView:this.createNewView,codeMirrorInstance:this.view},!1)}checkForSpaceKey(O){"Space"!==O.code||O.ctrlKey?this.isSpacePressed=!1:this.isSpacePressed=!0}closeCompletion(){this.view&&L(this.view)}handleEscapeKey(O){"Escape"===O.key&&this.view&&null!==B(this.view.state)&&(O.stopPropagation(),O.preventDefault(),L(this.view))}createState(){const O=this.lineNumbersComp.of(this.getLineNumbersExension()),e=this.readOnlyComp.of(this.getReadOnlyExtension()),t=this.restrictSingleLineComp.of(this.getSingleLineExtension()),i=this.placeholderComp.of(this.getPlaceholderExtension()),a=this.themeComp.of(this.getCustomThemeExtension()),r=this.defaultSyntaxHighlightingComp.of(this.getDefaultSyntaxHighlightingExtension()),l=this.autoCompleteStyleComp.of(this.getAutoCompleteStyleExtension()),s=this.getLanguageExtension(),n=this.customCompletionComp.of(FO.data.of({autocomplete:this.customAutocomplete}));return this.viewState=Y.create({doc:this.multiline?this.value:Ui(this.value),extensions:[D({highlightActiveLine:!1,foldGutter:this.enableFoldGutters,enableSearch:this.enableSearch}),O,e,t,n,i,r,this.autoCompletionComp.of(A({aboveCursor:this.aboveCursor})),s,this.darkThemeComp.of(this.getDarkThemeExtension()),a,l,this.getTabCompletionKeymap(),g.updateListener.of((O=>{O.docChanged&&(this.debounce?this.emitAfterTimeout({value:this.view.state.doc.toString()}):this.emit("nile-change",{value:this.view.state.doc.toString()}))})),g.domEventHandlers({focus:()=>this.dispatchEvent(new Event("nile-focus")),blur:()=>this.dispatchEvent(new Event("nile-blur"))})]}),this.viewState}getNestedSuggestions(O,e,t){if(!function(O){return/^([a-zA-Z_$][\w$]*)(\.[a-zA-Z_$][\w$]*|\[\s*(['"]?[a-zA-Z0-9_$]*['"]?)\s*\])*([\.\[])?$/.test(O)}(e)||![".","["].includes(e.at(-1)))return null;const i=function(O){const e=/([a-zA-Z_$][\w$]*)(\[(?:[^\]]+)\]|\.[a-zA-Z_$][\w$]*)*/g,t=[...O.matchAll(e)];if(t.length>0){const e=[t[0][1]],i=O.match(/\[(.*?)\]|\.(\w+)/g)||[];for(const O of i)O.startsWith("[")?e.push(O.slice(1,-1).replace(/['"]/g,"")):O.startsWith(".")&&e.push(O.slice(1));return e}return null}(e);if(!i)return null;const a=t.replace(/["'\[]/g,""),r=a!==t,l="["===e.at(-1);if("."===e.at(-1)&&r)return null;let s=(n=this.customAutoCompletions,i.reduce(((O,e)=>O&&"object"==typeof O?O[e]:null),n));var n;return s&&"object"==typeof s?(a&&(s=Object.fromEntries(Object.entries(s).filter((([O])=>O.toLowerCase().startsWith(a.toLowerCase()))))),{from:O.pos-a.length,options:Object.keys(s).map((O=>({label:O,type:"property",info:`Key of ${i[i.length-1]}`,apply:this.allowVariableInCustomSuggestion||!l||r?O:`'${O}'`,boost:999})))}):null}getTopLevelSuggestions(O,e){const t=e.match(/([a-zA-Z_$][\w$]*)$/);if(!t){if(""===e.trim()&&!this.isSpacePressed){const e=Object.keys(this.customAutoCompletions).filter((O=>Object.keys(this.customAutoCompletions[O]).length)).map((O=>({label:O,type:"property",apply:O,boost:999})));return this.customCompletionsPaths.length&&this.customCompletionsPaths.forEach((O=>{e.push({label:""+O,type:"property",apply:""+O,boost:998})})),{from:O.pos,options:e}}return null}const i=Object.keys(this.customAutoCompletions).filter((O=>Object.keys(this.customAutoCompletions[O]).length&&O.toLowerCase().startsWith(e.toLowerCase()))).map((O=>({label:O,type:"property",apply:O,boost:999})));return this.customCompletionsPaths.length&&this.customCompletionsPaths.filter((O=>O.toLocaleLowerCase().includes(e.toLocaleLowerCase()))).forEach((O=>{i.push({label:""+O,type:"property",apply:""+O,boost:998})})),{from:O.pos-t[1].length,options:i}}emitAfterTimeout(O){this.timeOut&&clearTimeout(this.timeOut),this.timeOut=setTimeout((()=>this.emit("nile-change",O,!1)),this.debounceTimeout)}focusAtPosition(O=this.view.state.doc.toString().length){this.view&&(this.view.dispatch({selection:{anchor:O}}),this.view.focus())}singleLineMultiLineToggle(){this.view.dispatch({changes:{from:0,to:this.view.state.doc.length,insert:this.multiline?this.value:Ui(this.value)}})}getLineNumbersExension(){return!this.multiline&&this.lineNumbers||this.multiline&&this.lineNumbersMultiline?T():[]}getLanguageExtension(){switch(this.language){case"sql":return function(O={}){let e=O.dialect||ze;return new m(e.language,[Ge(O),We(e,!!O.upperCaseKeywords)])}();case"json":return new m(Ce);case"html":return function(O={}){let e,t="";!1===O.matchClosingTags&&(t="noMatch"),!0===O.selfClosingTags&&(t=(t?t+" ":"")+"selfClosing"),(O.nestedLanguages&&O.nestedLanguages.length||O.nestedAttributes&&O.nestedAttributes.length)&&(e=ut((O.nestedLanguages||[]).concat(_i),(O.nestedAttributes||[]).concat(Ri)));let i=e?Yi.configure({wrap:e,dialect:t}):t?Ti.configure({dialect:t}):Ti;return new m(i,[Ti.data.of({autocomplete:vi(O)}),!1!==O.autoCloseTags?Vi:[],si().support,new m(Et,Et.data.of({autocomplete:zt})).support])}();default:return function(O={}){let e=O.jsx?O.typescript?te:ee:O.typescript?Oe:FO,t=O.typescript?MO.concat(re):EO.concat(ae);return new m(e,[FO.data.of({autocomplete:z(NO,E(t))}),FO.data.of({autocomplete:KO}),O.jsx?ne:[]])}()}}getReadOnlyExtension(){if(this.disabled)return[Y.readOnly.of(!0),g.editable.of(!1)];if(this.readonly){const O=[Y.readOnly.of(!0)];return this.hideReadOnlyCursor&&O.push(g.theme(K)),O}return[]}getSingleLineExtension(){return this.multiline?[]:Y.transactionFilter.of((O=>O.newDoc.lines>1?[]:O))}getPlaceholderExtension(){return this.placeholder?j(this.placeholder):[]}parseColor(O){const e=O.match(/^#([0-9a-f]{3,8})$/i)?.[1];if(e){const O=e.length<=4?e.slice(0,3).replace(/./g,(O=>O+O)):e.slice(0,6);return 6!==O.length?null:[0,2,4].map((e=>parseInt(O.slice(e,e+2),16)))}const t=O.match(/^rgba?\(([^)]+)\)$/i)?.[1].split(/[\s,/]+/).map(Number);return t&&t.length>=3&&t.slice(0,3).every((O=>!isNaN(O)))?[t[0],t[1],t[2]]:null}isDarkTheme(){const O=document.documentElement.getAttribute("data-theme");if("dark"===O)return!0;if("light"===O)return!1;const e=getComputedStyle(document.documentElement).getPropertyValue("--ng-colors-bg-primary").trim(),t=this.parseColor(e);return!!t&&(299*t[0]+587*t[1]+114*t[2])/1e3<128}getDarkThemeExtension(){return[V(),...this.isDarkTheme()?[F]:[]]}getDefaultSyntaxHighlightingExtension(){if(this.disableSyntaxHighlighting)return[];const O=this.isDarkTheme()?H:W;return U(O,{fallback:!0})}getCustomThemeExtension(){return this.customThemeCSS?this.defaultFont?[g.theme(this.customThemeCSS),g.theme(N),g.theme(OO)]:[g.theme(this.customThemeCSS),g.theme(N)]:this.defaultFont?[g.theme(N),g.theme(OO)]:[g.theme(N)]}getAutoCompleteStyleExtension(O){if(this.autoCompleteStyle?.width){const e=(O||(this.codeEditor?this.codeEditor.getBoundingClientRect().width:300))*parseFloat(this.autoCompleteStyle.width.replace("%",""))/100,t=this.autoCompleteStyle.multiline?{overflow:"visible",textOverflow:"unset",whiteSpace:"normal",wordWrap:"break-word"}:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"};return[G({position:"fixed",tooltipSpace:()=>{const O=this.codeEditor.getBoundingClientRect();return{left:O.left,top:0,right:O.right,bottom:1e3}}}),g.theme({".cm-tooltip.cm-tooltip-autocomplete":{maxWidth:e-15+"px !important"},".cm-tooltip.cm-tooltip-autocomplete > ul > li":{...t,maxWidth:"100%"},".cm-tooltip.cm-tooltip-autocomplete > ul":{minWidth:"unset !important"}})]}return[]}updateAutocompleteWidth(O){this.view&&this.view.dispatch({effects:this.autoCompleteStyleComp.reconfigure(this.getAutoCompleteStyleExtension(O))})}restrictSingleLine(){return Y.transactionFilter.of((O=>O.newDoc.lines>1?[]:O))}};function Ui(O){return O?O.replace(/\s+/g," ").trim():""}O([t(".code__editor__container")],Wi.prototype,"codeEditor",void 0),O([i({type:String,reflect:!0,attribute:!0})],Wi.prototype,"value",void 0),O([i({type:String,reflect:!0,attribute:!0})],Wi.prototype,"expandIcon",void 0),O([i({type:String,reflect:!0,attribute:!0})],Wi.prototype,"placeholder",void 0),O([i({type:Object,reflect:!0,attribute:!0})],Wi.prototype,"customAutoCompletions",void 0),O([i({type:Array,reflect:!0,attribute:!0})],Wi.prototype,"customCompletionsPaths",void 0),O([i({type:String,reflect:!0,attribute:!0})],Wi.prototype,"language",void 0),O([i({type:String,reflect:!0,attribute:"error-message"})],Wi.prototype,"errorMessage",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"error",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"enableSearch",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"noborder",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"multiline",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"enableFoldGutters",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"allowVariableInCustomSuggestion",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"lineNumbers",void 0),O([i({type:Boolean,reflect:!0,attribute:!1})],Wi.prototype,"disableSyntaxHighlighting",void 0),O([i({type:Object,attribute:!1})],Wi.prototype,"customThemeCSS",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"lineNumbersMultiline",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"hasScroller",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"expandable",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"readonly",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"disabled",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"debounce",void 0),O([i({type:Number,reflect:!0,attribute:!0})],Wi.prototype,"debounceTimeout",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"aboveCursor",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"tabCompletion",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"defaultFont",void 0),O([i({type:Object,attribute:!1})],Wi.prototype,"autoCompleteStyle",void 0),O([i({type:Boolean,reflect:!0,attribute:!0})],Wi.prototype,"hideReadOnlyCursor",void 0),Wi=O([a("nile-code-editor")],Wi);export{Wi as N};

package/dist/nile-menu-item/nile-menu-item.css.cjs.js

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var e,_templateObject,i;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){e=_lit.css;}],execute:function execute(){_export("s",i=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    box-sizing: border-box;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  :host *,\n  :host *::before,\n  :host *::after {\n    box-sizing: inherit;\n  }\n\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    display: block;\n  }\n\n  :host([inert]) {\n    display: none;\n  }\n\n  .menu-item {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    font-size: var(--nile-font-size-rem-large ,var(--ng-font-size-text-sm));\n    font-weight: var(--nile-font-weight-regular,var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-1-8,var(--ng-line-height-text-md));\n    letter-spacing: normal;\n    color: var(--nile-color-dark-1, var(--ng-colors-text-secondary-700));\n    min-height:40px;\n    transition: 150ms fill;\n    user-select: none;\n    white-space: nowrap;\n    cursor: pointer;\n    padding: var(--nile-spacing-none, var(--ng-spacing-md)) var(--nile-spacing-xl, var(--ng-spacing-xl));\n  }\n\n  .menu-item.menu-item--active {\n    background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n  }\n\n  .menu-item.menu-item--disabled {\n    outline: none;\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .menu-item .menu-item__label {\n    margin: auto var(--nile-spacing-none,var(--ng-spacing-none));\n    display: inline-flex;\n  }\n\n  .menu-item .menu-item__prefix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__prefix::slotted(*) {\n    margin-inline-end: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n  }\n\n  .menu-item .menu-item__suffix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__suffix::slotted(*) {\n    margin-inline-start: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n  }\n\n  :host(:focus-visible) {\n    outline: none;\n  }\n\n  :host(:hover:not([active], [aria-disabled='true'], :focus-visible)) .menu-item {\n    background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-secondary-hover));\n    color: var(--nile-colors-dark-900,var(--ng-colors-text-secondary-hover));\n  }\n\n  :host([active]:hover:not([aria-disabled='true'], :focus-visible)) .menu-item {\n    background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n  }\n\n  :host(:focus-visible) .menu-item {\n    outline: none;\n    background-color: var(--nile-colors-blue-500,var(--ng-colors-bg-active));\n    color: var(--nile-colors-white-base,var(--ng-colors-text-primary-900));\n    opacity: 1;\n  }\n\n  .menu-item .menu-item__check,\n  .menu-item .menu-item__chevron {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1.5em;\n    visibility: hidden;\n  }\n\n  .menu-item--checked .menu-item__check,\n  .menu-item--has-submenu .menu-item__chevron {\n    visibility: visible;\n  }\n\n  .menu-item .menu-item__checkbox {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    margin-inline-end: var(--nile-font-size-rem-xsmall, var(--ng-spacing-md));\n    pointer-events: none;\n  }\n  \n  @media (forced-colors: active) {\n    :host(:hover:not([aria-disabled='true'])) .menu-item,\n    :host(:focus-visible) .menu-item {\n      outline: dashed 1px SelectedItem;\n      outline-offset: -1px;\n    }\n  }\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var e,_templateObject,i;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){e=_lit.css;}],execute:function execute(){_export("s",i=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    box-sizing: border-box;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  :host *,\n  :host *::before,\n  :host *::after {\n    box-sizing: inherit;\n  }\n\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    display: block;\n  }\n\n  :host([inert]) {\n    display: none;\n  }\n\n  .menu-item {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    font-size: var(--nile-font-size-rem-large ,var(--ng-font-size-text-sm));\n    font-weight: var(--nile-font-weight-regular,var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-1-8,var(--ng-line-height-text-md));\n    letter-spacing: normal;\n    color: var(--nile-color-dark-1, var(--ng-colors-text-secondary-700));\n    min-height:40px;\n    transition: 150ms fill;\n    user-select: none;\n    white-space: nowrap;\n    cursor: pointer;\n    padding: var(--nile-spacing-none, var(--ng-spacing-md)) var(--nile-spacing-xl, var(--ng-spacing-xl));\n  }\n\n  .menu-item.menu-item--active {\n    background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n  }\n\n  .menu-item.menu-item--disabled {\n    outline: none;\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .menu-item .menu-item__label {\n    margin: auto var(--nile-spacing-none,var(--ng-spacing-none));\n    display: inline-flex;\n  }\n\n  .menu-item .menu-item__prefix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__prefix::slotted(*) {\n    margin-inline-end: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n  }\n\n  .menu-item .menu-item__suffix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__suffix::slotted(*) {\n    margin-inline-start: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n  }\n\n  :host(:focus-visible) {\n    outline: none;\n  }\n\n  :host(:hover:not([active], [aria-disabled='true'], :focus-visible)) .menu-item {\n    background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-primary-hover));\n    color: var(--nile-colors-dark-900,var(--ng-colors-text-secondary-hover));\n  }\n\n  :host([active]:hover:not([aria-disabled='true'], :focus-visible)) .menu-item {\n    background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n  }\n\n  :host(:focus-visible) .menu-item {\n    outline: none;\n    background-color: var(--nile-colors-blue-500,var(--ng-colors-bg-active));\n    color: var(--nile-colors-white-base,var(--ng-colors-text-primary-900));\n    opacity: 1;\n  }\n\n  .menu-item .menu-item__check,\n  .menu-item .menu-item__chevron {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1.5em;\n    visibility: hidden;\n  }\n\n  .menu-item--checked .menu-item__check,\n  .menu-item--has-submenu .menu-item__chevron {\n    visibility: visible;\n  }\n\n  .menu-item .menu-item__checkbox {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    margin-inline-end: var(--nile-font-size-rem-xsmall, var(--ng-spacing-md));\n    pointer-events: none;\n  }\n  \n  @media (forced-colors: active) {\n    :host(:hover:not([aria-disabled='true'])) .menu-item,\n    :host(:focus-visible) .menu-item {\n      outline: dashed 1px SelectedItem;\n      outline-offset: -1px;\n    }\n  }\n"]))));}};});
 //# sourceMappingURL=nile-menu-item.css.cjs.js.map

package/dist/nile-menu-item/nile-menu-item.css.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-menu-item.css.cjs.js","sources":["../../../src/nile-menu-item/nile-menu-item.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * MenuItem CSS\n */\nexport const styles = css`\n  :host {\n    box-sizing: border-box;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  :host *,\n  :host *::before,\n  :host *::after {\n    box-sizing: inherit;\n  }\n\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    display: block;\n  }\n\n  :host([inert]) {\n    display: none;\n  }\n\n  .menu-item {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    font-size: var(--nile-font-size-rem-large ,var(--ng-font-size-text-sm));\n    font-weight: var(--nile-font-weight-regular,var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-1-8,var(--ng-line-height-text-md));\n    letter-spacing: normal;\n    color: var(--nile-color-dark-1, var(--ng-colors-text-secondary-700));\n    min-height:40px;\n    transition: 150ms fill;\n    user-select: none;\n    white-space: nowrap;\n    cursor: pointer;\n    padding: var(--nile-spacing-none, var(--ng-spacing-md)) var(--nile-spacing-xl, var(--ng-spacing-xl));\n  }\n\n  .menu-item.menu-item--active {\n    background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n  }\n\n  .menu-item.menu-item--disabled {\n    outline: none;\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .menu-item .menu-item__label {\n    margin: auto var(--nile-spacing-none,var(--ng-spacing-none));\n    display: inline-flex;\n  }\n\n  .menu-item .menu-item__prefix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__prefix::slotted(*) {\n    margin-inline-end: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n  }\n\n  .menu-item .menu-item__suffix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__suffix::slotted(*) {\n    margin-inline-start: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n  }\n\n  :host(:focus-visible) {\n    outline: none;\n  }\n\n  :host(:hover:not([active], [aria-disabled='true'], :focus-visible)) .menu-item {\n    background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-secondary-hover));\n    color: var(--nile-colors-dark-900,var(--ng-colors-text-secondary-hover));\n  }\n\n  :host([active]:hover:not([aria-disabled='true'], :focus-visible)) .menu-item {\n    background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n  }\n\n  :host(:focus-visible) .menu-item {\n    outline: none;\n    background-color: var(--nile-colors-blue-500,var(--ng-colors-bg-active));\n    color: var(--nile-colors-white-base,var(--ng-colors-text-primary-900));\n    opacity: 1;\n  }\n\n  .menu-item .menu-item__check,\n  .menu-item .menu-item__chevron {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1.5em;\n    visibility: hidden;\n  }\n\n  .menu-item--checked .menu-item__check,\n  .menu-item--has-submenu .menu-item__chevron {\n    visibility: visible;\n  }\n\n  .menu-item .menu-item__checkbox {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    margin-inline-end: var(--nile-font-size-rem-xsmall, var(--ng-spacing-md));\n    pointer-events: none;\n  }\n  \n  @media (forced-colors: active) {\n    :host(:hover:not([aria-disabled='true'])) .menu-item,\n    :host(:focus-visible) .menu-item {\n      outline: dashed 1px SelectedItem;\n      outline-offset: -1px;\n    }\n  }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
+{"version":3,"file":"nile-menu-item.css.cjs.js","sources":["../../../src/nile-menu-item/nile-menu-item.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * MenuItem CSS\n */\nexport const styles = css`\n  :host {\n    box-sizing: border-box;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  :host *,\n  :host *::before,\n  :host *::after {\n    box-sizing: inherit;\n  }\n\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    display: block;\n  }\n\n  :host([inert]) {\n    display: none;\n  }\n\n  .menu-item {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    font-size: var(--nile-font-size-rem-large ,var(--ng-font-size-text-sm));\n    font-weight: var(--nile-font-weight-regular,var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-1-8,var(--ng-line-height-text-md));\n    letter-spacing: normal;\n    color: var(--nile-color-dark-1, var(--ng-colors-text-secondary-700));\n    min-height:40px;\n    transition: 150ms fill;\n    user-select: none;\n    white-space: nowrap;\n    cursor: pointer;\n    padding: var(--nile-spacing-none, var(--ng-spacing-md)) var(--nile-spacing-xl, var(--ng-spacing-xl));\n  }\n\n  .menu-item.menu-item--active {\n    background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n  }\n\n  .menu-item.menu-item--disabled {\n    outline: none;\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .menu-item .menu-item__label {\n    margin: auto var(--nile-spacing-none,var(--ng-spacing-none));\n    display: inline-flex;\n  }\n\n  .menu-item .menu-item__prefix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__prefix::slotted(*) {\n    margin-inline-end: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n  }\n\n  .menu-item .menu-item__suffix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__suffix::slotted(*) {\n    margin-inline-start: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n  }\n\n  :host(:focus-visible) {\n    outline: none;\n  }\n\n  :host(:hover:not([active], [aria-disabled='true'], :focus-visible)) .menu-item {\n    background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-primary-hover));\n    color: var(--nile-colors-dark-900,var(--ng-colors-text-secondary-hover));\n  }\n\n  :host([active]:hover:not([aria-disabled='true'], :focus-visible)) .menu-item {\n    background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n  }\n\n  :host(:focus-visible) .menu-item {\n    outline: none;\n    background-color: var(--nile-colors-blue-500,var(--ng-colors-bg-active));\n    color: var(--nile-colors-white-base,var(--ng-colors-text-primary-900));\n    opacity: 1;\n  }\n\n  .menu-item .menu-item__check,\n  .menu-item .menu-item__chevron {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1.5em;\n    visibility: hidden;\n  }\n\n  .menu-item--checked .menu-item__check,\n  .menu-item--has-submenu .menu-item__chevron {\n    visibility: visible;\n  }\n\n  .menu-item .menu-item__checkbox {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    margin-inline-end: var(--nile-font-size-rem-xsmall, var(--ng-spacing-md));\n    pointer-events: none;\n  }\n  \n  @media (forced-colors: active) {\n    :host(:hover:not([aria-disabled='true'])) .menu-item,\n    :host(:focus-visible) .menu-item {\n      outline: dashed 1px SelectedItem;\n      outline-offset: -1px;\n    }\n  }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-menu-item/nile-menu-item.css.esm.js

@@ -82,7 +82,7 @@ import{css as e}from"lit";const i=e`
   }
 
   :host(:hover:not([active], [aria-disabled='true'], :focus-visible)) .menu-item {
-    background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-secondary-hover));
+    background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-primary-hover));
     color: var(--nile-colors-dark-900,var(--ng-colors-text-secondary-hover));
   }
 

package/dist/nile-rich-text-editor/nile-rich-text-editor.css.cjs.js

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var r,_templateObject,e;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){r=_lit.css;}],execute:function execute(){_export("s",e=r(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  .editor { all: revert;\n  }\n  .rte-container .editor.safari {\n    -webkit-user-modify: read-write;\n  }\n\n  nile-rich-text-editor {\n    position: relative;\n    display: block;\n    font-family: inherit;\n  }\n\n\n  .rte-container {\n    width: 100%;\n    border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n    border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    box-sizing: border-box;\n  }\n\n \n  .rte-container nile-rte-toolbar {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px;\n  border-bottom: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n  border-radius: 8px 8px 0 0;\n  width: 100%;            \n  box-sizing: border-box; \n}\n\n  .rte-container .editor {\n    min-height: 160px;\n    width: 100%;\n    padding: 12px;\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border-radius: 0 0 8px 8px;\n    outline: none;\n    tab-size: 4;\n    -moz-tab-size: 4;\n    word-break: break-word;\n    box-sizing: border-box;\n    border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n  }\n\n  nile-rich-text-editor[disabled] .rte-container {\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    cursor: not-allowed !important;\n    background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n  }\n\n  nile-rich-text-editor[disabled] .rte-container nile-rte-toolbar {\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    cursor: not-allowed !important;\n  }  \n\n  nile-rich-text-editor[disabled] .rte-container .editor {\n    background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n    pointer-events: none;\n    user-select: none;\n    -webkit-user-select: none;\n    -webkit-user-modify: read-only;\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n  }\n\nnile-rte-preview {\n  display: block;\n  width: 100%;\n  margin-top: 16px;       \n  padding: 12px;\n  border: 1px dashed var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n  background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n  box-sizing: border-box;\n  word-wrap: break-word;\n}\n\n  nile-rich-text-editor[disabled] nile-rte-preview {\n  background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n  cursor: not-allowed ;\n  border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n  user-select: none;\n  -webkit-user-select: none;\n  color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n}\n\n  nile-rte-toolbar-item nile-button::part(base) {\n    width: 32px;\n    height: 32px;\n    padding: 0px 6px;\n    border: none;\n  }\n\n  nile-rte-toolbar-item > button,\n  nile-rte-toolbar button {\n    border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border-radius: var(--nile-radius-radius-lg, var(--ng-radius-md));\n    cursor: pointer;\n  }\n\n  nile-rte-toolbar-item > button nile-icon { pointer-events: none; }\n\n  nile-rte-toolbar-item > button.active {\n    border-color: #2563eb;\n    background: var(--nile-colors-white-base);\n  }\n\n  .editor p { margin: 1em 0; }\n  .editor h1, .preview h1 {\n    font-size: 2em;\n    margin: 0.67em 0;\n    font-weight: bold;\n  }\n  .editor h2, .preview h2 {\n    font-size: 1.5em;\n    margin: 0.83em 0;\n    font-weight: bold;\n  }\n  .editor h3 { font-size: 1.17em; }\n  .editor h4 { font-size: 1em; }\n  .editor h5 { font-size: 0.83em; }\n  .editor h6 { font-size: 0.67em; }\n\n\n  .editor.single-line {\n    min-height: 50px;\n    max-height: 50px;\n    line-height: 1.2;\n    overflow-x: auto;\n    white-space: nowrap;\n    padding: 0px 12px 0px 12px;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n  nile-rte-preview.single-line {\n    min-height: 50px;\n    max-height: 50px;\n    line-height: 1.2;\n    padding: 0px 12px 0px 12px;\n    overflow-x: auto;\n    white-space: nowrap;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n  nile-rte-divider { \n  margin: 0 4px;\n  display: inline-block;\n  height: 24px;\n  width: 1px;\n  background: var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  }\n \n  .editor ul,\n  .editor ol {\n    list-style-position: outside;\n    padding-inline-start: 24px;\n  }\n\n\n \n \n\n  nile-rte-toolbar-item  nile-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-toolbar-item nile-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));  \n}\n\nnile-rte-link nile-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-link nile-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));\n}\n\n.editor a {\n  color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-tertiary-600));\n  cursor: pointer;\n  text-decoration: none;\n}\n\n.editor a:hover {\n  text-decoration: none;\n}\n\nnile-rich-text-editor[disabled] .editor a {\n  color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.editor figure.rte-image,\nnile-rte-preview figure.rte-image {\n  margin: 1em 0;\n  width: fit-content;\n  max-width: 100%;\n}\n\n.editor > figure.rte-image:first-child,\nnile-rte-preview > figure.rte-image:first-child {\n  margin-top: 0;\n}\n\n.editor figure.rte-image[data-align='center'],\nnile-rte-preview figure.rte-image[data-align='center'] {\n  margin-left: auto;\n  margin-right: auto;\n}\n\n.editor figure.rte-image[data-align='right'],\nnile-rte-preview figure.rte-image[data-align='right'] {\n  margin-left: auto;\n}\n\n.editor figure.rte-image[data-align='justify'],\nnile-rte-preview figure.rte-image[data-align='justify'] {\n  width: 100%;\n}\n\n.editor figure.rte-image[data-align='justify'] img,\nnile-rte-preview figure.rte-image[data-align='justify'] img {\n  width: 100%;\n}\n\n.editor figure.rte-image img,\nnile-rte-preview figure.rte-image img {\n  max-width: 100%;\n  height: auto;\n  display: block;\n  border-radius: var(--nile-radius-radius-lg, var(--ng-radius-md));\n}\n\n.editor figure.rte-image figcaption,\nnile-rte-preview figure.rte-image figcaption {\n  margin-top: 6px;\n  font-size: 0.875em;\n  color: var(--nile-colors-neutral-600, var(--ng-colors-text-secondary));\n}\n\n.editor figure.rte-image {\n  cursor: pointer;\n}\n\n.editor figure.rte-image:hover img {\n  outline: 2px solid var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n  outline-offset: 2px;\n}\n\nnile-rte-image nile-button.rte-image-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-image nile-button.rte-image-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));\n}\n\nnile-rich-text-editor[disabled] .editor figure.rte-image {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.editor.empty::before {\n  content: attr(data-placeholder);\n  color: var(--nile-colors-neutral-500, var(--ng-colors-text-secondary));\n  position: absolute;\n  font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n  pointer-events: none;\n  user-select: none;\n  padding-top: 16px;\n  opacity: 0.7;\n}\n\n\n\n \n\n\n\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var r,_templateObject,e;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){r=_lit.css;}],execute:function execute(){_export("s",e=r(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  .editor { all: revert;\n  }\n  .rte-container .editor.safari {\n    -webkit-user-modify: read-write;\n  }\n\n  nile-rich-text-editor {\n    position: relative;\n    display: block;\n    font-family: inherit;\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n  }\n\n\n  .rte-container {\n    width: 100%;\n    border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n    border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    box-sizing: border-box;\n  }\n\n \n  .rte-container nile-rte-toolbar {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px;\n  border-bottom: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n  border-radius: 8px 8px 0 0;\n  width: 100%;            \n  box-sizing: border-box; \n}\n\n  .rte-container .editor {\n    min-height: 160px;\n    width: 100%;\n    padding: 12px;\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    border-radius: 0 0 8px 8px;\n    outline: none;\n    tab-size: 4;\n    -moz-tab-size: 4;\n    word-break: break-word;\n    box-sizing: border-box;\n    border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n  }\n\n  nile-rich-text-editor[disabled] .rte-container {\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    cursor: not-allowed !important;\n    background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n  }\n\n  nile-rich-text-editor[disabled] .rte-container nile-rte-toolbar {\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    cursor: not-allowed !important;\n  }  \n\n  nile-rich-text-editor[disabled] .rte-container .editor {\n    background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n    pointer-events: none;\n    user-select: none;\n    -webkit-user-select: none;\n    -webkit-user-modify: read-only;\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n  }\n\nnile-rte-preview {\n  display: block;\n  width: 100%;\n  margin-top: 16px;       \n  padding: 12px;\n  border: 1px dashed var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n  background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n  box-sizing: border-box;\n  word-wrap: break-word;\n  color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n}\n\n  nile-rich-text-editor[disabled] nile-rte-preview {\n  background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n  cursor: not-allowed ;\n  border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n  user-select: none;\n  -webkit-user-select: none;\n  color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n}\n\n  nile-rte-toolbar-item nile-button::part(base) {\n    width: 32px;\n    height: 32px;\n    padding: 0px 6px;\n    border: none;\n  }\n\n  nile-rte-toolbar-item > button,\n  nile-rte-toolbar button {\n    border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border-radius: var(--nile-radius-radius-lg, var(--ng-radius-md));\n    cursor: pointer;\n  }\n\n  nile-rte-toolbar-item > button nile-icon { pointer-events: none; }\n\n  nile-rte-toolbar-item > button.active {\n    border-color: #2563eb;\n    background: var(--nile-colors-white-base);\n  }\n\n  .editor p { margin: 1em 0; }\n  .editor h1, .preview h1 {\n    font-size: 2em;\n    margin: 0.67em 0;\n    font-weight: bold;\n  }\n  .editor h2, .preview h2 {\n    font-size: 1.5em;\n    margin: 0.83em 0;\n    font-weight: bold;\n  }\n  .editor h3 { font-size: 1.17em; }\n  .editor h4 { font-size: 1em; }\n  .editor h5 { font-size: 0.83em; }\n  .editor h6 { font-size: 0.67em; }\n\n\n  .editor.single-line {\n    min-height: 50px;\n    max-height: 50px;\n    line-height: 1.2;\n    overflow-x: auto;\n    white-space: nowrap;\n    padding: 0px 12px 0px 12px;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n  nile-rte-preview.single-line {\n    min-height: 50px;\n    max-height: 50px;\n    line-height: 1.2;\n    padding: 0px 12px 0px 12px;\n    overflow-x: auto;\n    white-space: nowrap;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n  nile-rte-divider { \n  margin: 0 4px;\n  display: inline-block;\n  height: 24px;\n  width: 1px;\n  background: var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  }\n \n  .editor ul,\n  .editor ol {\n    list-style-position: outside;\n    padding-inline-start: 24px;\n  }\n\n\n \n \n\n  nile-rte-toolbar-item  nile-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-toolbar-item nile-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));  \n}\n\nnile-rte-link nile-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-link nile-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));\n}\n\n.editor a {\n  color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-tertiary-600));\n  cursor: pointer;\n  text-decoration: none;\n}\n\n.editor a:hover {\n  text-decoration: none;\n}\n\nnile-rich-text-editor[disabled] .editor a {\n  color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.editor figure.rte-image,\nnile-rte-preview figure.rte-image {\n  margin: 1em 0;\n  width: fit-content;\n  max-width: 100%;\n}\n\n.editor > figure.rte-image:first-child,\nnile-rte-preview > figure.rte-image:first-child {\n  margin-top: 0;\n}\n\n.editor figure.rte-image[data-align='center'],\nnile-rte-preview figure.rte-image[data-align='center'] {\n  margin-left: auto;\n  margin-right: auto;\n}\n\n.editor figure.rte-image[data-align='right'],\nnile-rte-preview figure.rte-image[data-align='right'] {\n  margin-left: auto;\n}\n\n.editor figure.rte-image[data-align='justify'],\nnile-rte-preview figure.rte-image[data-align='justify'] {\n  width: 100%;\n}\n\n.editor figure.rte-image[data-align='justify'] img,\nnile-rte-preview figure.rte-image[data-align='justify'] img {\n  width: 100%;\n}\n\n.editor figure.rte-image img,\nnile-rte-preview figure.rte-image img {\n  max-width: 100%;\n  height: auto;\n  display: block;\n  border-radius: var(--nile-radius-radius-lg, var(--ng-radius-md));\n}\n\n.editor figure.rte-image figcaption,\nnile-rte-preview figure.rte-image figcaption {\n  margin-top: 6px;\n  font-size: 0.875em;\n  color: var(--nile-colors-neutral-600, var(--ng-colors-text-tertiary-600));\n}\n\n.editor figure.rte-image {\n  cursor: pointer;\n}\n\n.editor figure.rte-image:hover img {\n  outline: 2px solid var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n  outline-offset: 2px;\n}\n\nnile-rte-image nile-button.rte-image-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-image nile-button.rte-image-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));\n}\n\nnile-rich-text-editor[disabled] .editor figure.rte-image {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.editor.empty::before {\n  content: attr(data-placeholder);\n  color: var(--nile-colors-neutral-500, var(--ng-colors-text-placeholder));\n  position: absolute;\n  font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n  pointer-events: none;\n  user-select: none;\n  padding-top: 16px;\n  opacity: 0.7;\n}\n\n\n\n \n\n\n\n"]))));}};});
 //# sourceMappingURL=nile-rich-text-editor.css.cjs.js.map

package/dist/nile-rich-text-editor/nile-rich-text-editor.css.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-rich-text-editor.css.cjs.js","sources":["../../../src/nile-rich-text-editor/nile-rich-text-editor.css.ts"],"sourcesContent":[" \nimport { css } from 'lit';\n\nexport const styles = css`\n  .editor { all: revert;\n  }\n  .rte-container .editor.safari {\n    -webkit-user-modify: read-write;\n  }\n\n  nile-rich-text-editor {\n    position: relative;\n    display: block;\n    font-family: inherit;\n  }\n\n\n  .rte-container {\n    width: 100%;\n    border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n    border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    box-sizing: border-box;\n  }\n\n \n  .rte-container nile-rte-toolbar {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px;\n  border-bottom: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n  border-radius: 8px 8px 0 0;\n  width: 100%;            \n  box-sizing: border-box; \n}\n\n  .rte-container .editor {\n    min-height: 160px;\n    width: 100%;\n    padding: 12px;\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border-radius: 0 0 8px 8px;\n    outline: none;\n    tab-size: 4;\n    -moz-tab-size: 4;\n    word-break: break-word;\n    box-sizing: border-box;\n    border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n  }\n\n  nile-rich-text-editor[disabled] .rte-container {\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    cursor: not-allowed !important;\n    background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n  }\n\n  nile-rich-text-editor[disabled] .rte-container nile-rte-toolbar {\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    cursor: not-allowed !important;\n  }  \n\n  nile-rich-text-editor[disabled] .rte-container .editor {\n    background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n    pointer-events: none;\n    user-select: none;\n    -webkit-user-select: none;\n    -webkit-user-modify: read-only;\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n  }\n\nnile-rte-preview {\n  display: block;\n  width: 100%;\n  margin-top: 16px;       \n  padding: 12px;\n  border: 1px dashed var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n  background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n  box-sizing: border-box;\n  word-wrap: break-word;\n}\n\n  nile-rich-text-editor[disabled] nile-rte-preview {\n  background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n  cursor: not-allowed ;\n  border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n  user-select: none;\n  -webkit-user-select: none;\n  color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n}\n\n  nile-rte-toolbar-item nile-button::part(base) {\n    width: 32px;\n    height: 32px;\n    padding: 0px 6px;\n    border: none;\n  }\n\n  nile-rte-toolbar-item > button,\n  nile-rte-toolbar button {\n    border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border-radius: var(--nile-radius-radius-lg, var(--ng-radius-md));\n    cursor: pointer;\n  }\n\n  nile-rte-toolbar-item > button nile-icon { pointer-events: none; }\n\n  nile-rte-toolbar-item > button.active {\n    border-color: #2563eb;\n    background: var(--nile-colors-white-base);\n  }\n\n  .editor p { margin: 1em 0; }\n  .editor h1, .preview h1 {\n    font-size: 2em;\n    margin: 0.67em 0;\n    font-weight: bold;\n  }\n  .editor h2, .preview h2 {\n    font-size: 1.5em;\n    margin: 0.83em 0;\n    font-weight: bold;\n  }\n  .editor h3 { font-size: 1.17em; }\n  .editor h4 { font-size: 1em; }\n  .editor h5 { font-size: 0.83em; }\n  .editor h6 { font-size: 0.67em; }\n\n\n  .editor.single-line {\n    min-height: 50px;\n    max-height: 50px;\n    line-height: 1.2;\n    overflow-x: auto;\n    white-space: nowrap;\n    padding: 0px 12px 0px 12px;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n  nile-rte-preview.single-line {\n    min-height: 50px;\n    max-height: 50px;\n    line-height: 1.2;\n    padding: 0px 12px 0px 12px;\n    overflow-x: auto;\n    white-space: nowrap;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n  nile-rte-divider { \n  margin: 0 4px;\n  display: inline-block;\n  height: 24px;\n  width: 1px;\n  background: var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  }\n \n  .editor ul,\n  .editor ol {\n    list-style-position: outside;\n    padding-inline-start: 24px;\n  }\n\n\n \n \n\n  nile-rte-toolbar-item  nile-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-toolbar-item nile-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));  \n}\n\nnile-rte-link nile-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-link nile-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));\n}\n\n.editor a {\n  color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-tertiary-600));\n  cursor: pointer;\n  text-decoration: none;\n}\n\n.editor a:hover {\n  text-decoration: none;\n}\n\nnile-rich-text-editor[disabled] .editor a {\n  color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.editor figure.rte-image,\nnile-rte-preview figure.rte-image {\n  margin: 1em 0;\n  width: fit-content;\n  max-width: 100%;\n}\n\n.editor > figure.rte-image:first-child,\nnile-rte-preview > figure.rte-image:first-child {\n  margin-top: 0;\n}\n\n.editor figure.rte-image[data-align='center'],\nnile-rte-preview figure.rte-image[data-align='center'] {\n  margin-left: auto;\n  margin-right: auto;\n}\n\n.editor figure.rte-image[data-align='right'],\nnile-rte-preview figure.rte-image[data-align='right'] {\n  margin-left: auto;\n}\n\n.editor figure.rte-image[data-align='justify'],\nnile-rte-preview figure.rte-image[data-align='justify'] {\n  width: 100%;\n}\n\n.editor figure.rte-image[data-align='justify'] img,\nnile-rte-preview figure.rte-image[data-align='justify'] img {\n  width: 100%;\n}\n\n.editor figure.rte-image img,\nnile-rte-preview figure.rte-image img {\n  max-width: 100%;\n  height: auto;\n  display: block;\n  border-radius: var(--nile-radius-radius-lg, var(--ng-radius-md));\n}\n\n.editor figure.rte-image figcaption,\nnile-rte-preview figure.rte-image figcaption {\n  margin-top: 6px;\n  font-size: 0.875em;\n  color: var(--nile-colors-neutral-600, var(--ng-colors-text-secondary));\n}\n\n.editor figure.rte-image {\n  cursor: pointer;\n}\n\n.editor figure.rte-image:hover img {\n  outline: 2px solid var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n  outline-offset: 2px;\n}\n\nnile-rte-image nile-button.rte-image-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-image nile-button.rte-image-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));\n}\n\nnile-rich-text-editor[disabled] .editor figure.rte-image {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.editor.empty::before {\n  content: attr(data-placeholder);\n  color: var(--nile-colors-neutral-500, var(--ng-colors-text-secondary));\n  position: absolute;\n  font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n  pointer-events: none;\n  user-select: none;\n  padding-top: 16px;\n  opacity: 0.7;\n}\n\n\n\n \n\n\n\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAGaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
+{"version":3,"file":"nile-rich-text-editor.css.cjs.js","sources":["../../../src/nile-rich-text-editor/nile-rich-text-editor.css.ts"],"sourcesContent":[" \nimport { css } from 'lit';\n\nexport const styles = css`\n  .editor { all: revert;\n  }\n  .rte-container .editor.safari {\n    -webkit-user-modify: read-write;\n  }\n\n  nile-rich-text-editor {\n    position: relative;\n    display: block;\n    font-family: inherit;\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n  }\n\n\n  .rte-container {\n    width: 100%;\n    border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n    border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    box-sizing: border-box;\n  }\n\n \n  .rte-container nile-rte-toolbar {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px;\n  border-bottom: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n  border-radius: 8px 8px 0 0;\n  width: 100%;            \n  box-sizing: border-box; \n}\n\n  .rte-container .editor {\n    min-height: 160px;\n    width: 100%;\n    padding: 12px;\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    border-radius: 0 0 8px 8px;\n    outline: none;\n    tab-size: 4;\n    -moz-tab-size: 4;\n    word-break: break-word;\n    box-sizing: border-box;\n    border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n  }\n\n  nile-rich-text-editor[disabled] .rte-container {\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    cursor: not-allowed !important;\n    background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n  }\n\n  nile-rich-text-editor[disabled] .rte-container nile-rte-toolbar {\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    cursor: not-allowed !important;\n  }  \n\n  nile-rich-text-editor[disabled] .rte-container .editor {\n    background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n    pointer-events: none;\n    user-select: none;\n    -webkit-user-select: none;\n    -webkit-user-modify: read-only;\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n  }\n\nnile-rte-preview {\n  display: block;\n  width: 100%;\n  margin-top: 16px;       \n  padding: 12px;\n  border: 1px dashed var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  border-radius: var(--nile-radius-radius-xl, var(--ng-radius-md));\n  background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n  box-sizing: border-box;\n  word-wrap: break-word;\n  color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n}\n\n  nile-rich-text-editor[disabled] nile-rte-preview {\n  background: var(--nile-colors-dark-200, var(--ng-colors-bg-disabled-subtle));\n  cursor: not-allowed ;\n  border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled));\n  user-select: none;\n  -webkit-user-select: none;\n  color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n}\n\n  nile-rte-toolbar-item nile-button::part(base) {\n    width: 32px;\n    height: 32px;\n    padding: 0px 6px;\n    border: none;\n  }\n\n  nile-rte-toolbar-item > button,\n  nile-rte-toolbar button {\n    border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n    background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border-radius: var(--nile-radius-radius-lg, var(--ng-radius-md));\n    cursor: pointer;\n  }\n\n  nile-rte-toolbar-item > button nile-icon { pointer-events: none; }\n\n  nile-rte-toolbar-item > button.active {\n    border-color: #2563eb;\n    background: var(--nile-colors-white-base);\n  }\n\n  .editor p { margin: 1em 0; }\n  .editor h1, .preview h1 {\n    font-size: 2em;\n    margin: 0.67em 0;\n    font-weight: bold;\n  }\n  .editor h2, .preview h2 {\n    font-size: 1.5em;\n    margin: 0.83em 0;\n    font-weight: bold;\n  }\n  .editor h3 { font-size: 1.17em; }\n  .editor h4 { font-size: 1em; }\n  .editor h5 { font-size: 0.83em; }\n  .editor h6 { font-size: 0.67em; }\n\n\n  .editor.single-line {\n    min-height: 50px;\n    max-height: 50px;\n    line-height: 1.2;\n    overflow-x: auto;\n    white-space: nowrap;\n    padding: 0px 12px 0px 12px;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n  nile-rte-preview.single-line {\n    min-height: 50px;\n    max-height: 50px;\n    line-height: 1.2;\n    padding: 0px 12px 0px 12px;\n    overflow-x: auto;\n    white-space: nowrap;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n  nile-rte-divider { \n  margin: 0 4px;\n  display: inline-block;\n  height: 24px;\n  width: 1px;\n  background: var(--nile-colors-neutral-400, var(--ng-colors-border-neutral));\n  }\n \n  .editor ul,\n  .editor ol {\n    list-style-position: outside;\n    padding-inline-start: 24px;\n  }\n\n\n \n \n\n  nile-rte-toolbar-item  nile-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-toolbar-item nile-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));  \n}\n\nnile-rte-link nile-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-link nile-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));\n}\n\n.editor a {\n  color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-tertiary-600));\n  cursor: pointer;\n  text-decoration: none;\n}\n\n.editor a:hover {\n  text-decoration: none;\n}\n\nnile-rich-text-editor[disabled] .editor a {\n  color: var(--nile-colors-dark-500, var(--ng-colors-text-disabled));\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.editor figure.rte-image,\nnile-rte-preview figure.rte-image {\n  margin: 1em 0;\n  width: fit-content;\n  max-width: 100%;\n}\n\n.editor > figure.rte-image:first-child,\nnile-rte-preview > figure.rte-image:first-child {\n  margin-top: 0;\n}\n\n.editor figure.rte-image[data-align='center'],\nnile-rte-preview figure.rte-image[data-align='center'] {\n  margin-left: auto;\n  margin-right: auto;\n}\n\n.editor figure.rte-image[data-align='right'],\nnile-rte-preview figure.rte-image[data-align='right'] {\n  margin-left: auto;\n}\n\n.editor figure.rte-image[data-align='justify'],\nnile-rte-preview figure.rte-image[data-align='justify'] {\n  width: 100%;\n}\n\n.editor figure.rte-image[data-align='justify'] img,\nnile-rte-preview figure.rte-image[data-align='justify'] img {\n  width: 100%;\n}\n\n.editor figure.rte-image img,\nnile-rte-preview figure.rte-image img {\n  max-width: 100%;\n  height: auto;\n  display: block;\n  border-radius: var(--nile-radius-radius-lg, var(--ng-radius-md));\n}\n\n.editor figure.rte-image figcaption,\nnile-rte-preview figure.rte-image figcaption {\n  margin-top: 6px;\n  font-size: 0.875em;\n  color: var(--nile-colors-neutral-600, var(--ng-colors-text-tertiary-600));\n}\n\n.editor figure.rte-image {\n  cursor: pointer;\n}\n\n.editor figure.rte-image:hover img {\n  outline: 2px solid var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n  outline-offset: 2px;\n}\n\nnile-rte-image nile-button.rte-image-button[data-active]::part(base) {\n  background-color: var(--nile-colors-primary-400, var(--ng-componentcolors-utility-blue-400));\n}\n\nnile-rte-image nile-button.rte-image-button[data-active]::part(base):hover {\n  background-color: var(--nile-colors-primary-500, var(--ng-componentcolors-utility-blue-500));\n}\n\nnile-rich-text-editor[disabled] .editor figure.rte-image {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.editor.empty::before {\n  content: attr(data-placeholder);\n  color: var(--nile-colors-neutral-500, var(--ng-colors-text-placeholder));\n  position: absolute;\n  font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n  pointer-events: none;\n  user-select: none;\n  padding-top: 16px;\n  opacity: 0.7;\n}\n\n\n\n \n\n\n\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAGaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-rich-text-editor/nile-rich-text-editor.css.esm.js

@@ -9,6 +9,7 @@ import{css as r}from"lit";const e=r`
     position: relative;
     display: block;
     font-family: inherit;
+    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
   }
 
 
@@ -38,6 +39,7 @@ import{css as r}from"lit";const e=r`
     width: 100%;
     padding: 12px;
     background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
+    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
     border-radius: 0 0 8px 8px;
     outline: none;
     tab-size: 4;
@@ -78,6 +80,7 @@ nile-rte-preview {
   background: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
   box-sizing: border-box;
   word-wrap: break-word;
+  color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
 }
 
   nile-rich-text-editor[disabled] nile-rte-preview {
@@ -243,7 +246,7 @@ nile-rte-preview figure.rte-image img {
 nile-rte-preview figure.rte-image figcaption {
   margin-top: 6px;
   font-size: 0.875em;
-  color: var(--nile-colors-neutral-600, var(--ng-colors-text-secondary));
+  color: var(--nile-colors-neutral-600, var(--ng-colors-text-tertiary-600));
 }
 
 .editor figure.rte-image {
@@ -270,7 +273,7 @@ nile-rich-text-editor[disabled] .editor figure.rte-image {
 
 .editor.empty::before {
   content: attr(data-placeholder);
-  color: var(--nile-colors-neutral-500, var(--ng-colors-text-secondary));
+  color: var(--nile-colors-neutral-500, var(--ng-colors-text-placeholder));
   position: absolute;
   font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));
   pointer-events: none;

package/dist/nile-toast/nile-toast.css.cjs.js

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var r,_templateObject,a;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){r=_lit.css;}],execute:function execute(){_export("s",a=r(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    display: contents;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n    /* For better DX, we'll reset the margin here so the base part can inherit it */\n    margin: var(--nile-spacing-none);\n  }\n\n  .alert {\n    max-width: 100%;\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    align-items: flex-start;\n    border: solid 2px;\n    border-radius: var(--nile-radius-md, var(--ng-radius-xl));\n    margin: inherit;\n    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    gap: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    width: max-content;\n    min-width: 400px;\n  }\n\n  .alert:not(.alert--has-icon) .alert__icon,\n  .alert:not(.alert--closable) .alert__close-button {\n    display: none;\n  }\n\n  .alert__prefix-icon-container {\n    background-color: var(--nile-colors-red-500);\n    border-radius: var(--nile-radius-sm);\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .alert__icon {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    font-size: var(--nile-type-scale-1);\n  }\n\n  .alert--success {\n    border: 1px solid var(--nile-toast-color-border-success, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-success, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--success .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-success, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--info {\n    border: 1px solid var(--nile-toast-color-border-info, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-info, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--info .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-info, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--warning {\n    border: 1px solid var(--nile-toast-color-border-warning, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-warning, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--warning .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-warning, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--error {\n    border: 1px solid var(--nile-toast-color-border-error, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-error, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--error .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-error, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--gray {\n    border: 1px solid var(--nile-toast-color-border-gray, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-gray, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--gray .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-gray, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--black {\n    border: 1px solid var(--nile-toast-color-border-black);\n    background: var(--nile-toast-color-background-black);\n    box-shadow: var(--nile-toast-color-box-black);\n  }\n\n  .alert--black .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-black);\n  }\n\n  .alert__message {\n    flex: 1 1 auto;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    align-items: flex-start;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-dark-900);\n    gap: var(--nile-spacing-sm, var(--ng-spacing-sm));\n  }\n\n  .alert__message--title {\n    font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-semiboldibold));\n    color:var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n  }\n\n  .alert__message--content {\n    font-weight:var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n    color:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n  }\n\n  .alert__message--content-only {\n  }\n\n  .alert__close-button {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .alert__tags {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .alert__tag {\n    height: 24px;\n    display: flex;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n    border: 1px solid var(--nile-colors-neutral-400);\n    background: var(--nile-colors-white-base);\n  }\n\n  .alert__tag-content {\n    border-left: 1px solid var(--nile-colors-neutral-400);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-sm, var(--ng-spacing-sm));\n\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));\n    font-family:  var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .alert__tag-image {\n    height: 24px;\n    width: 24px;\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-xs, var(--ng-radius-xs));\n  }\n\n  .alert__prefix-img {\n    height: 24px;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n  }\n\n  .alert--no-content{\n    align-items:center ;\n  }\n\n  [hidden] {\n    display: none;\n  }\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var r,_templateObject,a;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){r=_lit.css;}],execute:function execute(){_export("s",a=r(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    display: contents;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n    /* For better DX, we'll reset the margin here so the base part can inherit it */\n    margin: var(--nile-spacing-none);\n  }\n\n  .alert {\n    max-width: 100%;\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    align-items: flex-start;\n    border: solid 2px;\n    border-radius: var(--nile-radius-md, var(--ng-radius-xl));\n    margin: inherit;\n    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    gap: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    width: max-content;\n    min-width: 400px;\n  }\n\n  .alert:not(.alert--has-icon) .alert__icon,\n  .alert:not(.alert--closable) .alert__close-button {\n    display: none;\n  }\n\n  .alert__prefix-icon-container {\n    background-color: var(--nile-colors-red-500);\n    border-radius: var(--nile-radius-sm);\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .alert__icon {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    font-size: var(--nile-type-scale-1);\n  }\n\n  .alert--success {\n    border: 1px solid var(--nile-toast-color-border-success, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-success, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--success .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-success, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--info {\n    border: 1px solid var(--nile-toast-color-border-info, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-info, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--info .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-info, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--warning {\n    border: 1px solid var(--nile-toast-color-border-warning, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-warning, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--warning .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-warning, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--error {\n    border: 1px solid var(--nile-toast-color-border-error, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-error, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--error .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-error, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--gray {\n    border: 1px solid var(--nile-toast-color-border-gray, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-gray, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--gray .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-gray, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--black {\n    border: 1px solid var(--nile-toast-color-border-black);\n    background: var(--nile-toast-color-background-black);\n    box-shadow: var(--nile-toast-color-box-black);\n  }\n\n  .alert--black .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-black);\n  }\n\n  .alert__message {\n    flex: 1 1 auto;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    align-items: flex-start;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-dark-900);\n    gap: var(--nile-spacing-sm, var(--ng-spacing-sm));\n  }\n\n  .alert__message--title {\n    font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-semiboldibold));\n    color:var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n  }\n\n  .alert__message--content {\n    font-weight:var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n    color:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n  }\n\n  .alert__message--content-only {\n  }\n\n  .alert__close-button {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .alert__tags {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .alert__tag {\n    height: 24px;\n    display: flex;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n    border: 1px solid var(--nile-colors-neutral-400);\n    background: var(--nile-colors-white-base);\n  }\n\n  .alert__tag-content {\n    border-left: 1px solid var(--nile-colors-neutral-400);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-sm, var(--ng-spacing-sm));\n\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));\n    font-family:  var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .alert__tag-image {\n    height: 24px;\n    width: 24px;\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-xs, var(--ng-radius-xs));\n  }\n\n  .alert__prefix-img {\n    height: 24px;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n  }\n\n  .alert--no-content{\n    align-items:center ;\n  }\n\n  [hidden] {\n    display: none;\n  }\n"]))));}};});
 //# sourceMappingURL=nile-toast.css.cjs.js.map

package/dist/nile-toast/nile-toast.css.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-toast.css.cjs.js","sources":["../../../src/nile-toast/nile-toast.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * Toast CSS\n */\nexport const styles = css`\n  :host {\n    display: contents;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n    /* For better DX, we'll reset the margin here so the base part can inherit it */\n    margin: var(--nile-spacing-none);\n  }\n\n  .alert {\n    max-width: 100%;\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    align-items: flex-start;\n    border: solid 2px;\n    border-radius: var(--nile-radius-md, var(--ng-radius-xl));\n    margin: inherit;\n    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    gap: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    width: max-content;\n    min-width: 400px;\n  }\n\n  .alert:not(.alert--has-icon) .alert__icon,\n  .alert:not(.alert--closable) .alert__close-button {\n    display: none;\n  }\n\n  .alert__prefix-icon-container {\n    background-color: var(--nile-colors-red-500);\n    border-radius: var(--nile-radius-sm);\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .alert__icon {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    font-size: var(--nile-type-scale-1);\n  }\n\n  .alert--success {\n    border: 1px solid var(--nile-toast-color-border-success, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-success, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--success .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-success, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--info {\n    border: 1px solid var(--nile-toast-color-border-info, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-info, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--info .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-info, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--warning {\n    border: 1px solid var(--nile-toast-color-border-warning, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-warning, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--warning .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-warning, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--error {\n    border: 1px solid var(--nile-toast-color-border-error, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-error, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--error .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-error, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--gray {\n    border: 1px solid var(--nile-toast-color-border-gray, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-gray, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--gray .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-gray, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--black {\n    border: 1px solid var(--nile-toast-color-border-black);\n    background: var(--nile-toast-color-background-black);\n    box-shadow: var(--nile-toast-color-box-black);\n  }\n\n  .alert--black .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-black);\n  }\n\n  .alert__message {\n    flex: 1 1 auto;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    align-items: flex-start;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-dark-900);\n    gap: var(--nile-spacing-sm, var(--ng-spacing-sm));\n  }\n\n  .alert__message--title {\n    font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-semiboldibold));\n    color:var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n  }\n\n  .alert__message--content {\n    font-weight:var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n    color:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n  }\n\n  .alert__message--content-only {\n  }\n\n  .alert__close-button {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .alert__tags {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .alert__tag {\n    height: 24px;\n    display: flex;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n    border: 1px solid var(--nile-colors-neutral-400);\n    background: var(--nile-colors-white-base);\n  }\n\n  .alert__tag-content {\n    border-left: 1px solid var(--nile-colors-neutral-400);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-sm, var(--ng-spacing-sm));\n\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));\n    font-family:  var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .alert__tag-image {\n    height: 24px;\n    width: 24px;\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-xs, var(--ng-radius-xs));\n  }\n\n  .alert__prefix-img {\n    height: 24px;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n  }\n\n  .alert--no-content{\n    align-items:center ;\n  }\n\n  [hidden] {\n    display: none;\n  }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
+{"version":3,"file":"nile-toast.css.cjs.js","sources":["../../../src/nile-toast/nile-toast.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * Toast CSS\n */\nexport const styles = css`\n  :host {\n    display: contents;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n    /* For better DX, we'll reset the margin here so the base part can inherit it */\n    margin: var(--nile-spacing-none);\n  }\n\n  .alert {\n    max-width: 100%;\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    align-items: flex-start;\n    border: solid 2px;\n    border-radius: var(--nile-radius-md, var(--ng-radius-xl));\n    margin: inherit;\n    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    gap: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    width: max-content;\n    min-width: 400px;\n  }\n\n  .alert:not(.alert--has-icon) .alert__icon,\n  .alert:not(.alert--closable) .alert__close-button {\n    display: none;\n  }\n\n  .alert__prefix-icon-container {\n    background-color: var(--nile-colors-red-500);\n    border-radius: var(--nile-radius-sm);\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .alert__icon {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    font-size: var(--nile-type-scale-1);\n  }\n\n  .alert--success {\n    border: 1px solid var(--nile-toast-color-border-success, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-success, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--success .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-success, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--info {\n    border: 1px solid var(--nile-toast-color-border-info, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-info, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--info .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-info, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--warning {\n    border: 1px solid var(--nile-toast-color-border-warning, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-warning, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--warning .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-warning, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--error {\n    border: 1px solid var(--nile-toast-color-border-error, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-error, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--error .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-error, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--gray {\n    border: 1px solid var(--nile-toast-color-border-gray, var(--ng-colors-border-primary));\n    background: var(--nile-toast-color-background-gray, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--gray .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-gray, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--black {\n    border: 1px solid var(--nile-toast-color-border-black);\n    background: var(--nile-toast-color-background-black);\n    box-shadow: var(--nile-toast-color-box-black);\n  }\n\n  .alert--black .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-black);\n  }\n\n  .alert__message {\n    flex: 1 1 auto;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    align-items: flex-start;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-dark-900);\n    gap: var(--nile-spacing-sm, var(--ng-spacing-sm));\n  }\n\n  .alert__message--title {\n    font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-semiboldibold));\n    color:var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n  }\n\n  .alert__message--content {\n    font-weight:var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n    color:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n  }\n\n  .alert__message--content-only {\n  }\n\n  .alert__close-button {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .alert__tags {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .alert__tag {\n    height: 24px;\n    display: flex;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n    border: 1px solid var(--nile-colors-neutral-400);\n    background: var(--nile-colors-white-base);\n  }\n\n  .alert__tag-content {\n    border-left: 1px solid var(--nile-colors-neutral-400);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-sm, var(--ng-spacing-sm));\n\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));\n    font-family:  var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-semibold));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .alert__tag-image {\n    height: 24px;\n    width: 24px;\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-xs, var(--ng-radius-xs));\n  }\n\n  .alert__prefix-img {\n    height: 24px;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n  }\n\n  .alert--no-content{\n    align-items:center ;\n  }\n\n  [hidden] {\n    display: none;\n  }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-toast/nile-toast.css.esm.js

@@ -46,7 +46,7 @@ import{css as r}from"lit";const a=r`
   }
 
   .alert--success {
-    border: 1px solid var(--nile-toast-color-border-success, var(--ng-colors-border-secondary-alt));
+    border: 1px solid var(--nile-toast-color-border-success, var(--ng-colors-border-primary));
     background: var(--nile-toast-color-background-success, var(--ng-colors-bg-primary-alt));
     box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));
   }
@@ -56,7 +56,7 @@ import{css as r}from"lit";const a=r`
   }
 
   .alert--info {
-    border: 1px solid var(--nile-toast-color-border-info, var(--ng-colors-border-secondary-alt));
+    border: 1px solid var(--nile-toast-color-border-info, var(--ng-colors-border-primary));
     background: var(--nile-toast-color-background-info, var(--ng-colors-bg-primary-alt));
     box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));
   }
@@ -66,7 +66,7 @@ import{css as r}from"lit";const a=r`
   }
 
   .alert--warning {
-    border: 1px solid var(--nile-toast-color-border-warning, var(--ng-colors-border-secondary-alt));
+    border: 1px solid var(--nile-toast-color-border-warning, var(--ng-colors-border-primary));
     background: var(--nile-toast-color-background-warning, var(--ng-colors-bg-primary-alt));
     box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));
   }
@@ -76,7 +76,7 @@ import{css as r}from"lit";const a=r`
   }
 
   .alert--error {
-    border: 1px solid var(--nile-toast-color-border-error, var(--ng-colors-border-secondary-alt));
+    border: 1px solid var(--nile-toast-color-border-error, var(--ng-colors-border-primary));
     background: var(--nile-toast-color-background-error, var(--ng-colors-bg-primary-alt));
     box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));
   }
@@ -86,7 +86,7 @@ import{css as r}from"lit";const a=r`
   }
 
   .alert--gray {
-    border: 1px solid var(--nile-toast-color-border-gray, var(--ng-colors-border-secondary-alt));
+    border: 1px solid var(--nile-toast-color-border-gray, var(--ng-colors-border-primary));
     background: var(--nile-toast-color-background-gray, var(--ng-colors-bg-primary-alt));
     box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));
   }

package/dist/src/nile-badge/nile-badge.css.js

@@ -142,7 +142,7 @@ export const styles = css `
     color: var(--nile-badge-color-font-gray, var(--ng-componentcolors-utility-gray-700));
     border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));
     border-style: solid;
-    border-color: var(--nile-badge-color-border-color-gray, var(--ng-componentcolors-utility-gray-200));
+    border-color: var(--nile-badge-color-border-color-gray, var(--ng-componentcolors-utility-gray-300));
     background: var(--nile-badge-color-background-gray, var(--ng-componentcolors-utility-gray-50));
   }
 
@@ -191,7 +191,7 @@ export const styles = css `
   }
 
   .badge--gray.badge--pill-outline {
-    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-gray, var(--ng-componentcolors-utility-gray-200));
+    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-gray, var(--ng-componentcolors-utility-gray-300));
   }
 
 

package/dist/src/nile-badge/nile-badge.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-badge.css.js","sourceRoot":"","sources":["../../../src/nile-badge/nile-badge.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgMxB,CAAC;AACF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * Tag CSS\n */\nexport const styles = css`\n  :host {\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .badge {\n    padding: var(--nile-spacing-xxs, var(--ng-spacing-xxs)) var(--nile-spacing-sm, var(--ng-spacing-md-alt));\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-full));\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    height: var(--nile-height-22px, var(--ng-height-24px));\n  }\n\n  .badge__content {\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-2, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-medium));\n    line-height: var(--nile-type-scale-5, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .badge--primary {\n    background: var(--nile-badge-color-background-primary, var(--ng-componentcolors-utility-brand-50));\n    color: var(--nile-badge-color-font-primary, var(--ng-componentcolors-utility-brand-700));\n  }\n\n  .badge--normal {\n    background: var(--nile-badge-color-background-normal, var(--ng-componentcolors-utility-gray-50));\n  }\n\n  .badge--info {\n    background: var(--nile-badge-color-background-info, var(--ng-componentcolors-utility-blue-light-50));\n  }\n\n  /* for v2 */\n\n    .badge--pill-outline {\n    background: transparent ;\n  }\n  .badge--pink {\n    color: var(--nile-badge-color-font-pink, var(--ng-componentcolors-utility-pink-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-pink, var(--ng-componentcolors-utility-pink-200));\n    background: var(--nile-badge-color-background-pink, var(--ng-componentcolors-utility-pink-50));\n  }\n\n  .badge--orange {\n    color: var(--nile-badge-color-font-orange, var(--ng-componentcolors-utility-orange-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-orange, var(--ng-componentcolors-utility-orange-dark-200));\n    background: var(--nile-badge-color-background-orange, var(--ng-componentcolors-utility-orange-dark-50));\n  }\n\n  .badge--purple {\n    color: var(--nile-badge-color-font-purple, var(--ng-componentcolors-utility-purple-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-purple, var(--ng-componentcolors-utility-purple-200));\n    background: var(--nile-badge-color-background-purple, var(--ng-componentcolors-utility-purple-50));\n  }\n\n  .badge--indigo {\n    color: var(--nile-badge-color-font-indigo, var(--ng-componentcolors-utility-indigo-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-indigo, var(--ng-componentcolors-utility-indigo-200));\n    background: var(--nile-badge-color-background-indigo, var(--ng-componentcolors-utility-indigo-50));\n  }\n\n  .badge--blue {\n    color: var(--nile-badge-color-font-blue, var(--ng-componentcolors-utility-blue-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-blue, var(--ng-componentcolors-utility-blue-200));\n    background: var(--nile-badge-color-background-blue, var(--ng-componentcolors-utility-blue-50));\n  }\n  .badge--blue-light {\n    color:var(--nile-badge-color-font-bluelight, var(--ng-componentcolors-utility-blue-light-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-bluelight, var(--ng-componentcolors-utility-blue-light-200));\n    background: var(--nile-badge-color-background-bluelight, var(--ng-componentcolors-utility-blue-light-50));\n  }\n\n  .badge--gray-blue {\n    color: var(--nile-badge-color-font-grayblue, var(--ng-componentcolors-utility-gray-blue-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-grayblue, var(--ng-componentcolors-utility-gray-blue-200));\n    background: var(--nile-badge-color-background-grayblue, var(--ng-componentcolors-utility-gray-blue-50));\n  }\n\n  .badge--success {\n    color: var(--nile-badge-color-font-success, var(--ng-componentcolors-utility-success-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-success, var(--ng-componentcolors-utility-success-200));\n    background: var(--nile-badge-color-background-success, var(--ng-componentcolors-utility-success-50));\n  }\n  .badge--warning {\n    color: var(--nile-badge-color-font-warning, var(--ng-componentcolors-utility-warning-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-warning, var(--ng-componentcolors-utility-warning-200));\n    background: var(--nile-badge-color-background-warning, var(--ng-componentcolors-utility-warning-50));\n  }\n\n  .badge--error {\n    color: var(--nile-badge-color-font-error, var(--ng-componentcolors-utility-error-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-error, var(--ng-componentcolors-utility-error-200));\n    background: var(--nile-badge-color-background-error, var(--ng-componentcolors-utility-error-50));\n  }\n\n  .badge--brand {\n    color: var(--nile-badge-color-font-brand, var(--ng-componentcolors-utility-brand-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-brand, var(--ng-componentcolors-utility-brand-200));\n    background: var(--nile-badge-color-background-brand, var(--ng-componentcolors-utility-brand-50));\n  }\n\n  .badge--gray {\n    color: var(--nile-badge-color-font-gray, var(--ng-componentcolors-utility-gray-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-gray, var(--ng-componentcolors-utility-gray-200));\n    background: var(--nile-badge-color-background-gray, var(--ng-componentcolors-utility-gray-50));\n  }\n\n  .badge--pink.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-pink, var(--ng-componentcolors-utility-pink-200));\n  }\n\n  .badge--orange.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-orange, var(--ng-componentcolors-utility-orange-dark-200));\n  }\n\n  .badge--purple.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-purple, var(--ng-componentcolors-utility-purple-200));\n  }\n\n  .badge--indigo.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-indigo, var(--ng-componentcolors-utility-indigo-200));\n  }\n\n  .badge--blue.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-blue, var(--ng-componentcolors-utility-blue-200));\n  }\n\n  .badge--blue-light.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-bluelight,  var(--ng-componentcolors-utility-blue-light-200));\n  }\n\n  .badge--gray-blue.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-gray, var(--ng-componentcolors-utility-gray-blue-200));\n  }\n\n  .badge--success.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-success, var(--ng-componentcolors-utility-success-200));\n  }\n\n  .badge--warning.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-warning, var(--ng-componentcolors-utility-warning-200));\n  }\n\n  .badge--error.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-error, var(--ng-componentcolors-utility-error-200));\n  }\n\n  .badge--brand.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-brand, var(--ng-componentcolors-utility-brand-200));\n  }\n\n  .badge--gray.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-gray, var(--ng-componentcolors-utility-gray-200));\n  }\n\n\n\n  .badge--rounded {\n    padding: var(--nile-spacing-xxs, var(--ng-spacing-xxs)) var(--nile-spacing-md, var(--ng-spacing-md-alt));\n    border-radius: var(--nile-radius-full, var(--ng-radius-full));\n  }\n`;\nexport default [styles];\n\n"]}
+{"version":3,"file":"nile-badge.css.js","sourceRoot":"","sources":["../../../src/nile-badge/nile-badge.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgMxB,CAAC;AACF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * Tag CSS\n */\nexport const styles = css`\n  :host {\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .badge {\n    padding: var(--nile-spacing-xxs, var(--ng-spacing-xxs)) var(--nile-spacing-sm, var(--ng-spacing-md-alt));\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-full));\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    height: var(--nile-height-22px, var(--ng-height-24px));\n  }\n\n  .badge__content {\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-2, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-medium));\n    line-height: var(--nile-type-scale-5, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .badge--primary {\n    background: var(--nile-badge-color-background-primary, var(--ng-componentcolors-utility-brand-50));\n    color: var(--nile-badge-color-font-primary, var(--ng-componentcolors-utility-brand-700));\n  }\n\n  .badge--normal {\n    background: var(--nile-badge-color-background-normal, var(--ng-componentcolors-utility-gray-50));\n  }\n\n  .badge--info {\n    background: var(--nile-badge-color-background-info, var(--ng-componentcolors-utility-blue-light-50));\n  }\n\n  /* for v2 */\n\n    .badge--pill-outline {\n    background: transparent ;\n  }\n  .badge--pink {\n    color: var(--nile-badge-color-font-pink, var(--ng-componentcolors-utility-pink-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-pink, var(--ng-componentcolors-utility-pink-200));\n    background: var(--nile-badge-color-background-pink, var(--ng-componentcolors-utility-pink-50));\n  }\n\n  .badge--orange {\n    color: var(--nile-badge-color-font-orange, var(--ng-componentcolors-utility-orange-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-orange, var(--ng-componentcolors-utility-orange-dark-200));\n    background: var(--nile-badge-color-background-orange, var(--ng-componentcolors-utility-orange-dark-50));\n  }\n\n  .badge--purple {\n    color: var(--nile-badge-color-font-purple, var(--ng-componentcolors-utility-purple-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-purple, var(--ng-componentcolors-utility-purple-200));\n    background: var(--nile-badge-color-background-purple, var(--ng-componentcolors-utility-purple-50));\n  }\n\n  .badge--indigo {\n    color: var(--nile-badge-color-font-indigo, var(--ng-componentcolors-utility-indigo-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-indigo, var(--ng-componentcolors-utility-indigo-200));\n    background: var(--nile-badge-color-background-indigo, var(--ng-componentcolors-utility-indigo-50));\n  }\n\n  .badge--blue {\n    color: var(--nile-badge-color-font-blue, var(--ng-componentcolors-utility-blue-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-blue, var(--ng-componentcolors-utility-blue-200));\n    background: var(--nile-badge-color-background-blue, var(--ng-componentcolors-utility-blue-50));\n  }\n  .badge--blue-light {\n    color:var(--nile-badge-color-font-bluelight, var(--ng-componentcolors-utility-blue-light-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-bluelight, var(--ng-componentcolors-utility-blue-light-200));\n    background: var(--nile-badge-color-background-bluelight, var(--ng-componentcolors-utility-blue-light-50));\n  }\n\n  .badge--gray-blue {\n    color: var(--nile-badge-color-font-grayblue, var(--ng-componentcolors-utility-gray-blue-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-grayblue, var(--ng-componentcolors-utility-gray-blue-200));\n    background: var(--nile-badge-color-background-grayblue, var(--ng-componentcolors-utility-gray-blue-50));\n  }\n\n  .badge--success {\n    color: var(--nile-badge-color-font-success, var(--ng-componentcolors-utility-success-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-success, var(--ng-componentcolors-utility-success-200));\n    background: var(--nile-badge-color-background-success, var(--ng-componentcolors-utility-success-50));\n  }\n  .badge--warning {\n    color: var(--nile-badge-color-font-warning, var(--ng-componentcolors-utility-warning-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-warning, var(--ng-componentcolors-utility-warning-200));\n    background: var(--nile-badge-color-background-warning, var(--ng-componentcolors-utility-warning-50));\n  }\n\n  .badge--error {\n    color: var(--nile-badge-color-font-error, var(--ng-componentcolors-utility-error-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-error, var(--ng-componentcolors-utility-error-200));\n    background: var(--nile-badge-color-background-error, var(--ng-componentcolors-utility-error-50));\n  }\n\n  .badge--brand {\n    color: var(--nile-badge-color-font-brand, var(--ng-componentcolors-utility-brand-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-brand, var(--ng-componentcolors-utility-brand-200));\n    background: var(--nile-badge-color-background-brand, var(--ng-componentcolors-utility-brand-50));\n  }\n\n  .badge--gray {\n    color: var(--nile-badge-color-font-gray, var(--ng-componentcolors-utility-gray-700));\n    border-width: var(--nile-badge-color-border-width, var(--ng-border-width-1));\n    border-style: solid;\n    border-color: var(--nile-badge-color-border-color-gray, var(--ng-componentcolors-utility-gray-300));\n    background: var(--nile-badge-color-background-gray, var(--ng-componentcolors-utility-gray-50));\n  }\n\n  .badge--pink.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-pink, var(--ng-componentcolors-utility-pink-200));\n  }\n\n  .badge--orange.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-orange, var(--ng-componentcolors-utility-orange-dark-200));\n  }\n\n  .badge--purple.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-purple, var(--ng-componentcolors-utility-purple-200));\n  }\n\n  .badge--indigo.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-indigo, var(--ng-componentcolors-utility-indigo-200));\n  }\n\n  .badge--blue.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-blue, var(--ng-componentcolors-utility-blue-200));\n  }\n\n  .badge--blue-light.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-bluelight,  var(--ng-componentcolors-utility-blue-light-200));\n  }\n\n  .badge--gray-blue.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-gray, var(--ng-componentcolors-utility-gray-blue-200));\n  }\n\n  .badge--success.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-success, var(--ng-componentcolors-utility-success-200));\n  }\n\n  .badge--warning.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-warning, var(--ng-componentcolors-utility-warning-200));\n  }\n\n  .badge--error.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-error, var(--ng-componentcolors-utility-error-200));\n  }\n\n  .badge--brand.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-brand, var(--ng-componentcolors-utility-brand-200));\n  }\n\n  .badge--gray.badge--pill-outline {\n    border: var(--nile-badge-color-border-width-pill-outline, var(--ng-border-width-1)) solid var(--nile-badge-color-pill-outline-gray, var(--ng-componentcolors-utility-gray-300));\n  }\n\n\n\n  .badge--rounded {\n    padding: var(--nile-spacing-xxs, var(--ng-spacing-xxs)) var(--nile-spacing-md, var(--ng-spacing-md-alt));\n    border-radius: var(--nile-radius-full, var(--ng-radius-full));\n  }\n`;\nexport default [styles];\n\n"]}

package/dist/src/nile-button-toggle/nile-button-toggle.css.js

@@ -72,12 +72,12 @@ export const styles = css `
 
   .nile-button-toggle__active {
     background-color: var( --nile-colors-neutral-500, var(--ng-colors-bg-brand-primary) );
-    color: var(--nile-colors-dark-900, var(--ng-colors-bg-brand-solid));
+    color: var(--nile-colors-dark-900, var(--ng-colors-text-brand-primary-900));
   }
 
   .nile-button-toggle__active:hover {
     background-color: var(--nile-colors-neutral-500, var(--ng-colors-bg-brand-primary));
-    color: var(--nile-colors-dark-900, var(--ng-colors-bg-brand-solid));
+    color: var(--nile-colors-dark-900, var(--ng-colors-text-brand-primary-900));
   }
 
   .nile-button-toggle__disabled {

package/dist/src/nile-button-toggle/nile-button-toggle.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-button-toggle.css.js","sourceRoot":"","sources":["../../../src/nile-button-toggle/nile-button-toggle.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2ExB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * ButtonToggle CSS\n */\nexport const styles = css`\n  :host {\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .nile-button-toggle {\n    display: flex;\n    padding: var(--nile-spacing-sm, var(--ng-spacing-md))\n      var(--nile-spacing-xl, var(--ng-spacing-xl))\n      var(--nile-spacing-sm, var(--ng-spacing-md))\n      var(--nile-spacing-14px, var(--ng-spacing-xl));\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n    cursor: pointer;\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-md));\n    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-semibold));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n    text-align: center;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n    justify-content: center;\n    align-items: center;\n    gap: var(--nile-spacing-md, var(--ng-spacing-md));\n    height: 40px;\n    box-sizing: border-box;\n  }\n\n  .nile-button-toggle:hover {\n    background: var(--nile-colors-neutral-100, var(--ng-colors-bg-secondary-hover));\n  }\n\n  .nile-button-toggle:active {\n    background: var(--nile-colors-neutral-400, var(--ng-colors-bg-primary-hover));\n  }\n\n  .nile-button-toggle__initial {\n    border-radius: \n    var(--nile-radius-radius-xs, var(--ng-radius-md)) \n    var(--nile-radius-radius-none, var(--ng-radius-none)) \n    var(--nile-radius-radius-none, var(--ng-radius-none)) \n    var(--nile-radius-radius-xs, var(--ng-radius-md));\n  }\n\n  .nile-button-toggle__end {\n    border-radius: \n    var(--nile-radius-radius-none, var(--ng-radius-none))\n    var(--nile-radius-radius-xs, var(--ng-radius-md))\n    var(--nile-radius-radius-xs, var(--ng-radius-md))\n    var(--nile-radius-radius-none, var(--ng-radius-none));\n    border-left: var(--nile-radius-radius-none, var(--ng-radius-none));\n  }\n\n  .nile-button-toggle__middle {\n    border-width: 1px 1px 1px 0;\n    border-style: solid;\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n    border-radius: var(--nile-radius-radius-none, var(--ng-radius-none));\n  }\n\n  .nile-button-toggle__active {\n    background-color: var( --nile-colors-neutral-500, var(--ng-colors-bg-brand-primary) );\n    color: var(--nile-colors-dark-900, var(--ng-colors-bg-brand-solid));\n  }\n\n  .nile-button-toggle__active:hover {\n    background-color: var(--nile-colors-neutral-500, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-dark-900, var(--ng-colors-bg-brand-solid));\n  }\n\n  .nile-button-toggle__disabled {\n    cursor: not-allowed;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-button-toggle.css.js","sourceRoot":"","sources":["../../../src/nile-button-toggle/nile-button-toggle.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2ExB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit';\n\n/**\n * ButtonToggle CSS\n */\nexport const styles = css`\n  :host {\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .nile-button-toggle {\n    display: flex;\n    padding: var(--nile-spacing-sm, var(--ng-spacing-md))\n      var(--nile-spacing-xl, var(--ng-spacing-xl))\n      var(--nile-spacing-sm, var(--ng-spacing-md))\n      var(--nile-spacing-14px, var(--ng-spacing-xl));\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n    cursor: pointer;\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-md));\n    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-semibold));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n    text-align: center;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n    justify-content: center;\n    align-items: center;\n    gap: var(--nile-spacing-md, var(--ng-spacing-md));\n    height: 40px;\n    box-sizing: border-box;\n  }\n\n  .nile-button-toggle:hover {\n    background: var(--nile-colors-neutral-100, var(--ng-colors-bg-secondary-hover));\n  }\n\n  .nile-button-toggle:active {\n    background: var(--nile-colors-neutral-400, var(--ng-colors-bg-primary-hover));\n  }\n\n  .nile-button-toggle__initial {\n    border-radius: \n    var(--nile-radius-radius-xs, var(--ng-radius-md)) \n    var(--nile-radius-radius-none, var(--ng-radius-none)) \n    var(--nile-radius-radius-none, var(--ng-radius-none)) \n    var(--nile-radius-radius-xs, var(--ng-radius-md));\n  }\n\n  .nile-button-toggle__end {\n    border-radius: \n    var(--nile-radius-radius-none, var(--ng-radius-none))\n    var(--nile-radius-radius-xs, var(--ng-radius-md))\n    var(--nile-radius-radius-xs, var(--ng-radius-md))\n    var(--nile-radius-radius-none, var(--ng-radius-none));\n    border-left: var(--nile-radius-radius-none, var(--ng-radius-none));\n  }\n\n  .nile-button-toggle__middle {\n    border-width: 1px 1px 1px 0;\n    border-style: solid;\n    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n    border-radius: var(--nile-radius-radius-none, var(--ng-radius-none));\n  }\n\n  .nile-button-toggle__active {\n    background-color: var( --nile-colors-neutral-500, var(--ng-colors-bg-brand-primary) );\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-brand-primary-900));\n  }\n\n  .nile-button-toggle__active:hover {\n    background-color: var(--nile-colors-neutral-500, var(--ng-colors-bg-brand-primary));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-brand-primary-900));\n  }\n\n  .nile-button-toggle__disabled {\n    cursor: not-allowed;\n  }\n`;\n\nexport default [styles];\n"]}

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

@@ -138,7 +138,7 @@ export declare class NileCodeEditor extends NileElement {
      * paints a dark editor theme over a light page.
      */
     private isDarkTheme;
-    /** Applied in dark only so light is untouched.*/
+    /** One Dark in dark mode; light keeps CodeMirror's own active-line highlight. */
     getDarkThemeExtension(): Extension;
     getDefaultSyntaxHighlightingExtension(): Extension;
     getCustomThemeExtension(): Extension;

package/dist/src/nile-code-editor/nile-code-editor.js

@@ -567,9 +567,9 @@ let NileCodeEditor = class NileCodeEditor extends NileElement {
         // Rec. 601 luma; the surface is dark if the page background is dark.
         return (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000 < 128;
     }
-    /** Applied in dark only so light is untouched.*/
+    /** One Dark in dark mode; light keeps CodeMirror's own active-line highlight. */
     getDarkThemeExtension() {
-        return this.isDarkTheme() ? [oneDarkTheme, highlightActiveLine()] : [];
+        return [highlightActiveLine(), ...(this.isDarkTheme() ? [oneDarkTheme] : [])];
     }
     getDefaultSyntaxHighlightingExtension() {
         if (this.disableSyntaxHighlighting)