npm - @ember-eui/core - Versions diffs - 14.0.0 → 14.1.0 - Mend

@ember-eui/core 14.0.0 → 14.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1738) hide show

package/dist/components/eui-code-block.js CHANGED Viewed

@@ -10,6 +10,7 @@ import { modifier } from 'ember-modifier';
 import set from 'ember-set-helper/helpers/set';
 import style from 'ember-style-modifier/modifiers/style';
 import { not, eq, and, or } from 'ember-truth-helpers';
+import { highlightLanguage } from '../-private/language-loader.js';
 import EuiCodeBlockControls from './eui-code-block/controls.js';
 import FullScreenDisplay from './eui-code-block/full-screen-display.js';
 import EuiCodeBlockVirtualizedComponent from './eui-code-block/virtualized.js';
@@ -27,6 +28,13 @@ const fontSizeToRowHeightMap = {
   m: 21,
   l: 24
 };
+/**
+ * Multi-line code with syntax highlighting, optional copy button, line
+ * numbers and full screen view:
+ * `<EuiCodeBlock @language="js" @isCopyable={{true}}>{{this.code}}</EuiCodeBlock>`.
+ */
 const highlightTargetModifier = modifier((_e, _pos, {
   element: targetEle,
   language = 'text',
@@ -122,6 +130,10 @@ class EuiCodeBlockComponent extends Component {
   get language() {
     return checkSupportedLanguage(this.args.language || '');
   }
+  /** Plain text until the language has loaded. */
+  get highlightLanguage() {
+    return highlightLanguage(this.language);
+  }
   get transparentBackground() {
     return this.args.transparentBackground ?? false;
   }
@@ -234,7 +246,7 @@ class EuiCodeBlockComponent extends Component {
     this.wrapperRef = undefined;
   }
   static {
-    setComponentTemplate(precompileTemplate("{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{#if this.codeTarget}}\n  {{#in-element this.codeTarget}}\n    {{yield}}\n  {{/in-element}}\n{{/if}}\n<EuiInnerText as |setInnerTextRef innerText|>\n  {{#let (classNames \"euiCodeBlock\" (if (or this.showCopyButton this.showFullScreenButton) \"euiCodeBlock--hasControl\") (if (and this.showCopyButton this.showFullScreenButton) \"euiCodeBlock--hasBothControls\") (if this.lineNumbersConfig.show \"euiCodeBlock--hasLineNumbers\") @className) (classNames \"euiCodeBlock__pre\" (if (or (eq this.whiteSpace \"pre\") this.isVirtualized) \"euiCodeBlock__pre--whiteSpacePre\") (if (and (eq this.whiteSpace \"pre-wrap\") (not this.isVirtualized)) \"euiCodeBlock__pre--whiteSpacePreWrap\") (if this.isVirtualized \"euiCodeBlock__pre--isVirtualized\")) as |wrapperClasses preClasses|}}\n    <div class={{classNames wrapperClasses (if this.transparentBackground \"euiCodeBlock--transparentBackground\") componentName=\"EuiCodeBlock\" fontSize=this.fontSize paddingSize=this.paddingSize}} {{style this.optionalStyles}} {{highlightTargetModifier element=this.codeTarget language=this.language lineNumbersConfig=this.lineNumbersConfig onChange=this.updateCode}}>\n      {{#if this.isVirtualized}}\n        {{!--virtualized--}}\n        <VirtualizedCodeBlock class={{preClasses}} tabindex=\"0\" {{onKey \"Escape\" this.closeFullScreen}} @language={{this.language}} @data={{this.data.data}} @rowHeight={{this.rowHeight}} />\n      {{else}}\n        {{!--template-lint-disable--}}\n        <pre class={{preClasses}} {{style this.optionalStyles}} tabindex={{this.tabIndex}} {{didInsert (set this \"wrapperRef\")}} {{resizeObserver onResize=this.doesOverflow}} {{mutationObserver onMutation=this.doesOverflow observerOptions=(hash subtree=true childList=true)}} {{didInsert setInnerTextRef}}><code class=\"euiCodeBlock__code\" data-code-language={{this.language}} {{didInsert (set this \"code\")}} ...attributes></code></pre>\n\n      {{/if}}\n\n      <Controls @isFullScreen={{this.isFullScreen}} @showFullScreenButton={{this.showFullScreenButton}} @toggleFullScreen={{this.toggleFullScreen}} @showCopyButton={{this.showCopyButton}} @textToCopy={{textToCopyHelper isVirtualized=this.isVirtualized innerText=(cleanTextHelper innerText) element=this.data.element}} />\n\n      {{#if this.isFullScreen}}\n        <FullScreenDisplay class={{wrapperClasses}}>\n          {{#if this.isVirtualized}}\n            <VirtualizedCodeBlock class={{preClasses}} tabindex=\"0\" {{onKey \"Escape\" this.closeFullScreen}} @language={{this.language}} @data={{this.data.data}} @rowHeight={{fontSizeToRowHeightMap.l}} />\n          {{else}}\n            <pre class={{preClasses}} tabindex=\"0\" {{onKey \"Escape\" this.closeFullScreen}}><code class=\"euiCodeBlock__code\" data-code-language={{this.language}} {{didInsert (set this \"codeFullScreen\")}}></code></pre>\n          {{/if}}\n          <Controls @isFullScreen={{this.isFullScreen}} @showFullScreenButton={{this.showFullScreenButton}} @showCopyButton={{this.showCopyButton}} @toggleFullScreen={{this.toggleFullScreen}} @textToCopy={{textToCopyHelper isVirtualized=this.isVirtualized innerText=(cleanTextHelper innerText) element=this.data.element}} />\n        </FullScreenDisplay>\n      {{/if}}\n    </div>\n  {{/let}}\n</EuiInnerText>", {
+    setComponentTemplate(precompileTemplate("{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{!-- DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY --}}\n{{#if this.codeTarget}}\n  {{#in-element this.codeTarget}}\n    {{yield}}\n  {{/in-element}}\n{{/if}}\n<EuiInnerText as |setInnerTextRef innerText|>\n  {{#let (classNames \"euiCodeBlock\" (if (or this.showCopyButton this.showFullScreenButton) \"euiCodeBlock--hasControl\") (if (and this.showCopyButton this.showFullScreenButton) \"euiCodeBlock--hasBothControls\") (if this.lineNumbersConfig.show \"euiCodeBlock--hasLineNumbers\") @className) (classNames \"euiCodeBlock__pre\" (if (or (eq this.whiteSpace \"pre\") this.isVirtualized) \"euiCodeBlock__pre--whiteSpacePre\") (if (and (eq this.whiteSpace \"pre-wrap\") (not this.isVirtualized)) \"euiCodeBlock__pre--whiteSpacePreWrap\") (if this.isVirtualized \"euiCodeBlock__pre--isVirtualized\")) as |wrapperClasses preClasses|}}\n    <div class={{classNames wrapperClasses (if this.transparentBackground \"euiCodeBlock--transparentBackground\") componentName=\"EuiCodeBlock\" fontSize=this.fontSize paddingSize=this.paddingSize}} {{style this.optionalStyles}} {{highlightTargetModifier element=this.codeTarget language=this.highlightLanguage lineNumbersConfig=this.lineNumbersConfig onChange=this.updateCode}}>\n      {{#if this.isVirtualized}}\n        {{!--virtualized--}}\n        <VirtualizedCodeBlock class={{preClasses}} tabindex=\"0\" {{onKey \"Escape\" this.closeFullScreen}} @language={{this.language}} @data={{this.data.data}} @rowHeight={{this.rowHeight}} />\n      {{else}}\n        {{!--template-lint-disable--}}\n        <pre class={{preClasses}} {{style this.optionalStyles}} tabindex={{this.tabIndex}} {{didInsert (set this \"wrapperRef\")}} {{resizeObserver onResize=this.doesOverflow}} {{mutationObserver onMutation=this.doesOverflow observerOptions=(hash subtree=true childList=true)}} {{didInsert setInnerTextRef}}><code class=\"euiCodeBlock__code\" data-code-language={{this.language}} {{didInsert (set this \"code\")}} ...attributes></code></pre>\n\n      {{/if}}\n\n      <Controls @isFullScreen={{this.isFullScreen}} @showFullScreenButton={{this.showFullScreenButton}} @toggleFullScreen={{this.toggleFullScreen}} @showCopyButton={{this.showCopyButton}} @textToCopy={{textToCopyHelper isVirtualized=this.isVirtualized innerText=(cleanTextHelper innerText) element=this.data.element}} />\n\n      {{#if this.isFullScreen}}\n        <FullScreenDisplay class={{wrapperClasses}}>\n          {{#if this.isVirtualized}}\n            <VirtualizedCodeBlock class={{preClasses}} tabindex=\"0\" {{onKey \"Escape\" this.closeFullScreen}} @language={{this.language}} @data={{this.data.data}} @rowHeight={{fontSizeToRowHeightMap.l}} />\n          {{else}}\n            <pre class={{preClasses}} tabindex=\"0\" {{onKey \"Escape\" this.closeFullScreen}}><code class=\"euiCodeBlock__code\" data-code-language={{this.language}} {{didInsert (set this \"codeFullScreen\")}}></code></pre>\n          {{/if}}\n          <Controls @isFullScreen={{this.isFullScreen}} @showFullScreenButton={{this.showFullScreenButton}} @showCopyButton={{this.showCopyButton}} @toggleFullScreen={{this.toggleFullScreen}} @textToCopy={{textToCopyHelper isVirtualized=this.isVirtualized innerText=(cleanTextHelper innerText) element=this.data.element}} />\n        </FullScreenDisplay>\n      {{/if}}\n    </div>\n  {{/let}}\n</EuiInnerText>", {
       strictMode: true,
       scope: () => ({
         EuiInnerText: EuiImage,

package/dist/components/eui-code-block.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-code-block.js","sources":["../../src/components/eui-code-block.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { helper } from '@ember/component/helper';\nimport { hash } from '@ember/helper';\nimport { action } from '@ember/object';\nimport didInsert from '@ember/render-modifiers/modifiers/did-insert';\nimport { scheduleOnce } from '@ember/runloop';\nimport type Owner from '@ember/owner';\n\nimport onKey from 'ember-keyboard/modifiers/on-key';\nimport { modifier } from 'ember-modifier';\nimport set from 'ember-set-helper/helpers/set';\nimport style from 'ember-style-modifier/modifiers/style';\nimport { and, eq, not,or } from 'ember-truth-helpers';\n\nimport Controls from '../components/eui-code-block/controls.gts';\nimport FullScreenDisplay from '../components/eui-code-block/full-screen-display.gts';\nimport VirtualizedCodeBlock from '../components/eui-code-block/virtualized.gts';\nimport EuiInnerText from '../components/eui-inner-text.gts';\nimport classNames from '../helpers/class-names.ts';\nimport mutationObserver from '../modifiers/mutation-observer.ts';\nimport resizeObserver from '../modifiers/resize-observer.ts';\nimport {\n checkSupportedLanguage,\n getHtmlContent,\n highlightByLine\n} from '../utils/code/utils.ts';\n\nimport type { EuiCodeSharedProps } from '../utils/code/utils.ts';\nimport type { RefractorNode } from 'refractor';\n\ninterface LineNumbersConfig {\n start?: number;\n highlight?: string;\n show?: boolean;\n}\n\nexport type PaddingSize = 'none' \| 's' \| 'm' \| 'l';\nexport type FontSize = 's' \| 'm' \| 'l';\n\nconst fontSizeToRowHeightMap = {\n s: 18,\n m: 21,\n l: 24\n};\n\nexport type EuiCodeBlockArgs = EuiCodeSharedProps & {\n paddingSize?: PaddingSize;\n fontSize?: FontSize;\n\n /*\n Specify how `white-space` inside the element is handled.\n * `pre` respects line breaks/white space but doesn't force them to wrap the line\n * `pre-wrap` respects line breaks/white space but does force them to wrap the line when necessary.\n /\n whiteSpace?: 'pre' \| 'pre-wrap';\n\n /\n Displays an icon button to copy the code snippet to the clipboard.\n /\n isCopyable?: boolean;\n\n /\n Displays line numbers.\n * Optionally accepts a configuration object for setting the starting number and visual highlighting ranges:\n * `{ start: 100, highlight: '1, 5-10, 20-30, 40' }`\n /\n lineNumbers?: boolean \| LineNumbersConfig;\n\n /\n Sets the maximum container height.\n * Accepts a pixel value (`300`) or a percentage (`'100%'`)\n * Ensure the container has calcuable height when using a percentage\n /\n overflowHeight?: number \| string;\n\n /\n Renders code block lines virtually.\n * Useful for improving load times of large code blocks.\n \n When using this configuration, `overflowHeight` is required and\n * `whiteSpace` can only be `pre`.\n */\n isVirtualized?: boolean;\n};\n\nexport interface EuiCodeBlockSignature {\n Element: HTMLElement;\n Args: EuiCodeBlockArgs;\n Blocks: {\n default: [];\n };\n}\n\ninterface LineNumbersFinal {\n start: number;\n show: boolean;\n highlight?: string;\n}\n\nconst highlightTargetModifier = modifier(\n (\n _e,\n _pos: unknown[],\n {\n element: targetEle,\n language = 'text',\n lineNumbersConfig = { start: 1, show: false },\n onChange\n }: {\n element: Element \| undefined;\n language: EuiCodeSharedProps['language'];\n lineNumbersConfig: LineNumbersFinal;\n onChange: ({\n data,\n element\n }: {\n data: RefractorNode[];\n element: HTMLElement;\n }) => void;\n }\n ) => {\n let observer: undefined \| MutationObserver;\n\n const getHighlighedHtml = () => {\n const html = (targetEle?.textContent ? targetEle.textContent : '').trim();\n\n let data: RefractorNode[];\n\n if (typeof html !== 'string') {\n data = [];\n } else {\n data = highlightByLine(html, language, lineNumbersConfig);\n }\n\n return {\n data,\n element: getHtmlContent(data).element\n };\n };\n\n const setupObserver = () => {\n const newObserver = new MutationObserver((mutationsList) => {\n if (mutationsList.length) {\n onChange(getHighlighedHtml());\n }\n });\n\n if (targetEle) {\n onChange(getHighlighedHtml());\n newObserver.observe(targetEle, {\n characterData: true,\n subtree: true,\n childList: true\n });\n }\n\n return newObserver;\n };\n\n if (targetEle) {\n observer = setupObserver();\n }\n\n return () => {\n observer?.disconnect();\n };\n }\n);\n\nconst cleanTextHelper = helper(function ([text]: [string]) {\n return text?.replace(/[\\r\\n?]{2}\|\\n\\n/g, '\\n') \|\| '';\n});\n\nconst textToCopyHelper = helper(function (\n _pos,\n {\n isVirtualized,\n element,\n innerText\n }: {\n isVirtualized: boolean;\n element: HTMLElement \| undefined;\n innerText: string;\n }\n) {\n if (element) {\n return isVirtualized\n ? element.textContent\n ? element.textContent\n : ''\n : innerText;\n }\n\n return '';\n});\n\nexport default class EuiCodeBlockComponent extends Component<EuiCodeBlockSignature> {\n //fake element where yield writes to, so we can observe and clone a highlighted version to code and codeFullSceen\n @tracked codeTarget?: HTMLElement;\n //<code> Element for non fullscreen\n @tracked code?: HTMLElement;\n //<code> Element for fullscreen modal\n @tracked codeFullScreen?: HTMLElement;\n @tracked wrapperRef?: HTMLElement;\n @tracked tabIndex = 1;\n @tracked isFullScreen = false;\n @tracked data?: { data: RefractorNode[]; element: HTMLElement };\n\n get language() {\n return checkSupportedLanguage(this.args.language \|\| '');\n }\n\n get transparentBackground() {\n return this.args.transparentBackground ?? false;\n }\n\n get paddingSize() {\n return this.args.paddingSize ?? 'l';\n }\n\n get fontSize() {\n return this.args.fontSize ?? 's';\n }\n\n get isCopyable() {\n return this.args.isCopyable ?? false;\n }\n\n get whiteSpace() {\n return this.args.whiteSpace ?? 'pre-wrap';\n }\n\n get isVirtualized() {\n return !!(this.args.isVirtualized && Array.isArray(this.data?.data));\n }\n\n get lineNumbers() {\n return this.args.lineNumbers ?? false;\n }\n\n get lineNumbersConfig() {\n const { lineNumbers } = this;\n const config = typeof lineNumbers === 'object' ? lineNumbers : {};\n\n return lineNumbers\n ? { start: 1, show: true, ...config }\n : { start: 1, show: false };\n }\n\n get optionalStyles() {\n const overflowHeight = this.args.overflowHeight;\n\n if (overflowHeight) {\n const property =\n typeof overflowHeight === 'string' ? 'height' : 'maxHeight';\n\n return {\n [property]:\n typeof overflowHeight === 'string'\n ? overflowHeight\n : `${overflowHeight}px`\n };\n }\n\n return {};\n }\n\n get showCopyButton() {\n return this.isCopyable && true;\n }\n\n get rowHeight() {\n return fontSizeToRowHeightMap[this.fontSize];\n }\n\n get showFullScreenButton() {\n return !!this.args.overflowHeight;\n }\n\n constructor(owner: Owner, args: EuiCodeBlockArgs) {\n super(owner, args);\n this.codeTarget = document.createElement('div');\n }\n\n @action\n toggleFullScreen() {\n this.isFullScreen = !this.isFullScreen;\n }\n\n @action\n closeFullScreen(e: KeyboardEvent) {\n e.preventDefault();\n e.stopPropagation();\n this.isFullScreen = false;\n }\n\n @action\n doesOverflow() {\n if (!this.wrapperRef) return;\n\n const { clientWidth, clientHeight, scrollWidth, scrollHeight } =\n this.wrapperRef;\n const doesOverflow =\n scrollHeight > clientHeight \|\| scrollWidth > clientWidth;\n\n this.tabIndex = doesOverflow ? 0 : -1;\n }\n\n @action\n updateCode(resp: { data: RefractorNode[]; element: HTMLElement }) {\n const render = () => {\n const code = this.code;\n const codeFullScreen = this.codeFullScreen;\n\n if (code && !this.isFullScreen) {\n this.data = resp;\n code.innerHTML = resp.element.innerHTML;\n }\n\n if (codeFullScreen && this.isFullScreen) {\n this.data = resp;\n codeFullScreen.innerHTML = resp.element.innerHTML;\n }\n };\n\n scheduleOnce('afterRender', this, render);\n }\n\n willDestroy() {\n super.willDestroy();\n\n this.codeTarget = undefined;\n this.code = undefined;\n this.codeFullScreen = undefined;\n this.wrapperRef = undefined;\n }\n\n <template>\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{#if this.codeTarget}}\n {{#in-element this.codeTarget}}\n {{yield}}\n {{/in-element}}\n {{/if}}\n <EuiInnerText as \|setInnerTextRef innerText\|>\n {{#let\n (classNames\n \"euiCodeBlock\"\n (if\n (or this.showCopyButton this.showFullScreenButton)\n \"euiCodeBlock--hasControl\"\n )\n (if\n (and this.showCopyButton this.showFullScreenButton)\n \"euiCodeBlock--hasBothControls\"\n )\n (if this.lineNumbersConfig.show \"euiCodeBlock--hasLineNumbers\")\n @className\n )\n (classNames\n \"euiCodeBlock__pre\"\n (if\n (or (eq this.whiteSpace \"pre\") this.isVirtualized)\n \"euiCodeBlock__pre--whiteSpacePre\"\n )\n (if\n (and (eq this.whiteSpace \"pre-wrap\") (not this.isVirtualized))\n \"euiCodeBlock__pre--whiteSpacePreWrap\"\n )\n (if this.isVirtualized \"euiCodeBlock__pre--isVirtualized\")\n )\n as \|wrapperClasses preClasses\|\n }}\n <div\n class={{classNames\n wrapperClasses\n (if\n this.transparentBackground \"euiCodeBlock--transparentBackground\"\n )\n componentName=\"EuiCodeBlock\"\n fontSize=this.fontSize\n paddingSize=this.paddingSize\n }}\n {{style this.optionalStyles}}\n {{highlightTargetModifier\n element=this.codeTarget\n language=this.language\n lineNumbersConfig=this.lineNumbersConfig\n onChange=this.updateCode\n }}\n >\n {{#if this.isVirtualized}}\n {{!virtualized}}\n <VirtualizedCodeBlock\n class={{preClasses}}\n tabindex=\"0\"\n {{onKey \"Escape\" this.closeFullScreen}}\n @language={{this.language}}\n @data={{this.data.data}}\n @rowHeight={{this.rowHeight}}\n />\n {{else}}\n {{!template-lint-disable}}\n <pre\n class={{preClasses}}\n {{style this.optionalStyles}}\n tabindex={{this.tabIndex}}\n {{didInsert (set this \"wrapperRef\")}}\n {{resizeObserver onResize=this.doesOverflow}}\n {{mutationObserver\n onMutation=this.doesOverflow\n observerOptions=(hash subtree=true childList=true)\n }}\n {{didInsert setInnerTextRef}}\n ><code\n class=\"euiCodeBlock__code\"\n data-code-language={{this.language}}\n {{didInsert (set this \"code\")}}\n ...attributes\n ></code></pre>\n\n {{/if}}\n\n <Controls\n @isFullScreen={{this.isFullScreen}}\n @showFullScreenButton={{this.showFullScreenButton}}\n @toggleFullScreen={{this.toggleFullScreen}}\n @showCopyButton={{this.showCopyButton}}\n @textToCopy={{textToCopyHelper\n isVirtualized=this.isVirtualized\n innerText=(cleanTextHelper innerText)\n element=this.data.element\n }}\n />\n\n {{#if this.isFullScreen}}\n <FullScreenDisplay class={{wrapperClasses}}>\n {{#if this.isVirtualized}}\n <VirtualizedCodeBlock\n class={{preClasses}}\n tabindex=\"0\"\n {{onKey \"Escape\" this.closeFullScreen}}\n @language={{this.language}}\n @data={{this.data.data}}\n @rowHeight={{fontSizeToRowHeightMap.l}}\n />\n {{else}}\n <pre\n class={{preClasses}}\n tabindex=\"0\"\n {{onKey \"Escape\" this.closeFullScreen}}\n ><code\n class=\"euiCodeBlock__code\"\n data-code-language={{this.language}}\n {{didInsert (set this \"codeFullScreen\")}}\n ></code></pre>\n {{/if}}\n <Controls\n @isFullScreen={{this.isFullScreen}}\n @showFullScreenButton={{this.showFullScreenButton}}\n @showCopyButton={{this.showCopyButton}}\n @toggleFullScreen={{this.toggleFullScreen}}\n @textToCopy={{textToCopyHelper\n isVirtualized=this.isVirtualized\n innerText=(cleanTextHelper innerText)\n element=this.data.element\n }}\n />\n </FullScreenDisplay>\n {{/if}}\n </div>\n {{/let}}\n </EuiInnerText>\n </template>\n}\n"],"names":["fontSizeToRowHeightMap","s","m","l","highlightTargetModifier","modifier","_e","_pos","element","targetEle","language","lineNumbersConfig","start","show","onChange","observer","getHighlighedHtml","html","textContent","trim","data","highlightByLine","getHtmlContent","setupObserver","newObserver","MutationObserver","mutationsList","length","observe","characterData","subtree","childList","disconnect","cleanTextHelper","helper","text","replace","textToCopyHelper","isVirtualized","innerText","EuiCodeBlockComponent","Component","g","prototype","tracked","i","checkSupportedLanguage","args","transparentBackground","paddingSize","fontSize","isCopyable","whiteSpace","Array","isArray","lineNumbers","config","optionalStyles","overflowHeight","property","showCopyButton","rowHeight","showFullScreenButton","constructor","owner","codeTarget","document","createElement","toggleFullScreen","isFullScreen","n","action","closeFullScreen","e","preventDefault","stopPropagation","doesOverflow","wrapperRef","clientWidth","clientHeight","scrollWidth","scrollHeight","tabIndex","updateCode","resp","render","code","codeFullScreen","innerHTML","scheduleOnce","willDestroy","undefined","setComponentTemplate","precompileTemplate","strictMode","scope","EuiInnerText","classNames","or","and","eq","not","style","VirtualizedCodeBlock","onKey","didInsert","set","resizeObserver","mutationObserver","hash","Controls","FullScreenDisplay"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAwCA,MAAMA,sBAAyB,GAAA;AAC7BC,EAAAA,CAAG,EAAA,EAAA;AACHC,EAAAA,CAAG,EAAA,EAAA;AACHC,EAAAA,CAAG,EAAA;AACL,CAAA;AAwDA,MAAMC,uBAA0B,GAAAC,QAAA,CAC9B,CACEC,EAAA,EACAC,IAAa,EACb;AACEC,EAAAA,OAAA,EAASC,SAAS;AAClBC,EAAAA,QAAW,GAAA,MAAM;AACjBC,EAAAA,iBAAoB,GAAA;AAAEC,IAAAA,KAAO,EAAA,CAAA;AAAGC,IAAAA,IAAM,EAAA;GAAO;AAC7CC,EAAAA;AAYD,CAAA,KAAA;AAED,EAAA,IAAIC,QAAsB;EAE1B,MAAMC,iBAAoB,GAAAA,MAAA;AACxB,IAAA,MAAMC,IAAA,GAAO,CAACR,SAAW,EAAAS,WAAA,GAAcT,UAAUS,WAAW,GAAG,EAAE,EAAEC,IAAI,EAAA;AAEvE,IAAA,IAAIC,IAAM;AAEV,IAAA,IAAI,OAAOH,SAAS,QAAU,EAAA;AAC5BG,MAAAA,IAAA,GAAO,EAAE;AACX,KAAO,MAAA;MACLA,IAAO,GAAAC,eAAA,CAAgBJ,MAAMP,QAAU,EAAAC,iBAAA,CAAA;AACzC;IAEA,OAAO;MACLS,IAAA;AACAZ,MAAAA,OAAS,EAAAc,cAAA,CAAeF,MAAMZ;KAChC;GACF;EAEA,MAAMe,aAAgB,GAAAA,MAAA;AACpB,IAAA,MAAMC,WAAA,GAAc,IAAIC,gBAAA,CAAkBC,aAAA,IAAA;MACxC,IAAIA,aAAA,CAAcC,MAAM,EAAE;AACxBb,QAAAA,QAAS,CAAAE,iBAAA,EAAA,CAAA;AACX;AACF,KAAA,CAAA;AAEA,IAAA,IAAIP,SAAW,EAAA;AACbK,MAAAA,QAAS,CAAAE,iBAAA,EAAA,CAAA;AACTQ,MAAAA,WAAY,CAAAI,OAAO,CAACnB,SAAW,EAAA;AAC7BoB,QAAAA,aAAe,EAAA,IAAA;AACfC,QAAAA,OAAS,EAAA,IAAA;AACTC,QAAAA,SAAW,EAAA;AACb,OAAA,CAAA;AACF;AAEA,IAAA,OAAOP,WAAA;GACT;AAEA,EAAA,IAAIf,SAAW,EAAA;IACbM,QAAW,GAAAQ,aAAA,EAAA;AACb;AAEA,EAAA,OAAO,MAAA;IACLR,QAAU,EAAAiB,UAAA,EAAA;GACZ;AACF,CAAA,CAAA;AAGF,MAAMC,kBAAkBC,MAAO,CAAA,UAAU,CAACC,IAAA,CAAe,EAAA;EACvD,OAAOA,IAAA,EAAMC,OAAQ,CAAA,kBAAA,EAAoB,IAAS,CAAA,IAAA,EAAA;AACpD,CAAA,CAAA;AAEA,MAAMC,gBAAA,GAAmBH,MAAO,CAAA,UAC9B3B,IAAI,EACJ;EACE+B,aAAa;EACb9B,OAAO;AACP+B,EAAAA;AAKD,CAAA,EAAA;AAED,EAAA,IAAI/B,OAAS,EAAA;AACX,IAAA,OAAO8B,gBACH9B,OAAQ,CAAAU,WAAW,GACjBV,OAAQ,CAAAU,WAAW,GACnB,EACF,GAAAqB,SAAA;AACN;AAEA,EAAA,OAAO,EAAA;AACT,CAAA,CAAA;AAEe,MAAMC,8BAA8BC,SAAU,CAAA;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,YAAA,EAAA,CAE1DC,OAAA,CAAA,CAAA;AAAA;EAAA,WAAA,IAAAC,CAAA,CADD,IAAA,EAAA,YAAA,CAAA,EAAA,MAAA,EAAA;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,MAAA,EAAA,CAGCC,OAAA,CAAA,CAAA;AAAA;EAAA,KAAA,IAAAC,CAAA,CADD,IAAA,EAAA,MAAA,CAAA,EAAA,MAAA,EAAA;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,gBAAA,EAAA,CAGCC,OAAA,CAAA,CAAA;AAAA;EAAA,eAAA,IAAAC,CAAA,CADD,IAAA,EAAA,gBAAA,CAAA,EAAA,MAAA,EAAA;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,YAAA,EAAA,CAECC,OAAA,CAAA,CAAA;AAAA;EAAA,WAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,YAAA,CAAA,EAAA,MAAA;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,UAAA,EAAA,CACAC,OAAA,CAAA,EAAA,YAAA;AAAA,MAAA,OAAmB,CAAE;AAAA,KAAA,CAAA;AAAA;EAAA,SAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,UAAA,CAAA,EAAA,MAAA;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,cAAA,EAAA,CACrBC,OAAA,CAAA,EAAA,YAAA;AAAA,MAAA,OAAuB,KAAM;AAAA,KAAA,CAAA;AAAA;EAAA,aAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,cAAA,CAAA,EAAA,MAAA;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,MAAA,EAAA,CAC7BC,OAAA,CAAA,CAAA;AAAA;EAAA,KAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,MAAA,CAAA,EAAA,MAAA;EAED,IAAInC,QAAWA,GAAA;IACb,OAAOoC,uBAAuB,IAAI,CAACC,IAAI,CAACrC,QAAQ,IAAI,EAAA,CAAA;AACtD;EAEA,IAAIsC,qBAAwBA,GAAA;AAC1B,IAAA,OAAO,IAAI,CAACD,IAAI,CAACC,qBAAqB,IAAI,KAAA;AAC5C;EAEA,IAAIC,WAAcA,GAAA;AAChB,IAAA,OAAO,IAAI,CAACF,IAAI,CAACE,WAAW,IAAI,GAAA;AAClC;EAEA,IAAIC,QAAWA,GAAA;AACb,IAAA,OAAO,IAAI,CAACH,IAAI,CAACG,QAAQ,IAAI,GAAA;AAC/B;EAEA,IAAIC,UAAaA,GAAA;AACf,IAAA,OAAO,IAAI,CAACJ,IAAI,CAACI,UAAU,IAAI,KAAA;AACjC;EAEA,IAAIC,UAAaA,GAAA;AACf,IAAA,OAAO,IAAI,CAACL,IAAI,CAACK,UAAU,IAAI,UAAA;AACjC;EAEA,IAAId,aAAgBA,GAAA;AAClB,IAAA,OAAO,CAAC,EAAE,IAAI,CAACS,IAAI,CAACT,aAAa,IAAIe,KAAA,CAAMC,OAAO,CAAC,IAAI,CAAClC,IAAI,EAAEA,IAAK,CAAA,CAAA;AACrE;EAEA,IAAImC,WAAcA,GAAA;AAChB,IAAA,OAAO,IAAI,CAACR,IAAI,CAACQ,WAAW,IAAI,KAAA;AAClC;EAEA,IAAI5C,iBAAoBA,GAAA;IACtB,MAAM;AAAE4C,MAAAA;AAAa,KAAA,GAAG,IAAI;IAC5B,MAAMC,MAAS,GAAA,OAAOD,WAAgB,KAAA,QAAA,GAAWA,cAAc,EAAC;AAEhE,IAAA,OAAOA,WACH,GAAA;AAAE3C,MAAAA,KAAO,EAAA,CAAA;AAAGC,MAAAA,IAAM,EAAA,IAAA;MAAM,GAAG2C;AAAO,KAClC,GAAA;AAAE5C,MAAAA,KAAO,EAAA,CAAA;AAAGC,MAAAA,IAAM,EAAA;KAAM;AAC9B;EAEA,IAAI4C,cAAiBA,GAAA;AACnB,IAAA,MAAMC,cAAiB,GAAA,IAAI,CAACX,IAAI,CAACW,cAAc;AAE/C,IAAA,IAAIA,cAAgB,EAAA;MAClB,MAAMC,QACJ,GAAA,OAAOD,cAAmB,KAAA,QAAA,GAAW,QAAW,GAAA,WAAA;MAElD,OAAO;QACL,CAACC,QAAA,GACC,OAAOD,cAAA,KAAmB,WACtBA,cACA,GAAA,CAAA,EAAGA,cAAe,CAAA,EAAA;OAC1B;AACF;AAEA,IAAA,OAAO,EAAC;AACV;EAEA,IAAIE,cAAiBA,GAAA;AACnB,IAAA,OAAO,IAAI,CAACT,UAAU,IAAI,IAAA;AAC5B;EAEA,IAAIU,SAAYA,GAAA;AACd,IAAA,OAAO7D,sBAAsB,CAAC,IAAI,CAACkD,QAAQ,CAAC;AAC9C;EAEA,IAAIY,oBAAuBA,GAAA;AACzB,IAAA,OAAO,CAAC,CAAC,IAAI,CAACf,IAAI,CAACW,cAAc;AACnC;AAEAK,EAAAA,WAAAA,CAAYC,KAAY,EAAEjB,IAAsB,EAAE;AAChD,IAAA,KAAK,CAACiB,KAAO,EAAAjB,IAAA,CAAA;IACb,IAAI,CAACkB,UAAU,GAAGC,QAAA,CAASC,aAAa,CAAC,KAAA,CAAA;AAC3C;AAGAC,EAAAA,gBAAmBA,GAAA;AACjB,IAAA,IAAI,CAACC,YAAY,GAAG,CAAC,IAAI,CAACA,YAAY;AACxC;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAA3B,SAAA,EAAA,kBAAA,EAAA,CAHC4B,MAAA,CAAA,CAAA;AAAA;EAMDC,eAAgBA,CAAAC,CAAgB,EAAE;IAChCA,CAAA,CAAEC,cAAc,EAAA;IAChBD,CAAA,CAAEE,eAAe,EAAA;IACjB,IAAI,CAACN,YAAY,GAAG,KAAA;AACtB;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAA3B,SAAA,EAAA,iBAAA,EAAA,CALC4B,MAAA,CAAA,CAAA;AAAA;AAQDK,EAAAA,YAAeA,GAAA;AACb,IAAA,IAAI,CAAC,IAAI,CAACC,UAAU,EAAE;IAEtB,MAAM;MAAEC,WAAW;MAAEC,YAAY;MAAEC,WAAW;AAAEC,MAAAA;KAAc,GAC5D,IAAI,CAACJ,UAAU;IACjB,MAAMD,YAAA,GACJK,YAAe,GAAAF,YAAA,IAAgBC,WAAc,GAAAF,WAAA;IAE/C,IAAI,CAACI,QAAQ,GAAGN,YAAA,GAAe,IAAI,EAAC;AACtC;AAAA,EAAA;IAAAN,CAAA,CAAA,IAAA,CAAA3B,SAAA,EAAA,cAAA,EAAA,CAVC4B,MAAA,CAAA,CAAA;AAAA;EAaDY,UAAWA,CAAAC,IAAqD,EAAE;IAChE,MAAMC,MAAS,GAAAA,MAAA;AACb,MAAA,MAAMC,IAAA,GAAO,IAAI,CAACA,IAAI;AACtB,MAAA,MAAMC,cAAA,GAAiB,IAAI,CAACA,cAAc;AAE1C,MAAA,IAAID,IAAQ,IAAA,CAAC,IAAI,CAACjB,YAAY,EAAE;QAC9B,IAAI,CAACjD,IAAI,GAAGgE,IAAA;AACZE,QAAAA,IAAA,CAAKE,SAAS,GAAGJ,IAAK,CAAA5E,OAAO,CAACgF,SAAS;AACzC;AAEA,MAAA,IAAID,cAAkB,IAAA,IAAI,CAAClB,YAAY,EAAE;QACvC,IAAI,CAACjD,IAAI,GAAGgE,IAAA;AACZG,QAAAA,cAAA,CAAeC,SAAS,GAAGJ,IAAK,CAAA5E,OAAO,CAACgF,SAAS;AACnD;KACF;AAEAC,IAAAA,YAAa,CAAA,aAAA,EAAe,IAAI,EAAEJ,MAAA,CAAA;AACpC;AAAA,EAAA;IAAAf,CAAA,CAAA,IAAA,CAAA3B,SAAA,EAAA,YAAA,EAAA,CAlBC4B,MAAA,CAAA,CAAA;AAAA;AAoBDmB,EAAAA,WAAcA,GAAA;IACZ,KAAK,CAACA,WAAA,EAAA;IAEN,IAAI,CAACzB,UAAU,GAAG0B,SAAA;IAClB,IAAI,CAACL,IAAI,GAAGK,SAAA;IACZ,IAAI,CAACJ,cAAc,GAAGI,SAAA;IACtB,IAAI,CAACd,UAAU,GAAGc,SAAA;AACpB;AAEA,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAgJA,u0HAAA,EAAA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;sBAAAC,QAAA;QAAAC,UAAA;QAAAC,EAAA;QAAAC,GAAA;QAAAC,EAAA;QAAAC,GAAA;QAAAC,KAAA;QAAAlG,uBAAA;8BAAAmG,gCAAA;QAAAC,KAAA;QAAAC,SAAA;QAAAC,GAAA;wBAAAC,cAAA;QAAAC,gBAAA;QAAAC,IAAA;kBAAAC,oBAAA;QAAAzE,gBAAA;QAAAJ,eAAA;QAAA8E,iBAAA;AAAA/G,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;;;;"}
1	+ {"version":3,"file":"eui-code-block.js","sources":["../../src/components/eui-code-block.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { helper } from '@ember/component/helper';\nimport { hash } from '@ember/helper';\nimport { action } from '@ember/object';\nimport didInsert from '@ember/render-modifiers/modifiers/did-insert';\nimport { scheduleOnce } from '@ember/runloop';\nimport type Owner from '@ember/owner';\n\nimport onKey from 'ember-keyboard/modifiers/on-key';\nimport { modifier } from 'ember-modifier';\nimport set from 'ember-set-helper/helpers/set';\nimport style from 'ember-style-modifier/modifiers/style';\nimport { and, eq, not,or } from 'ember-truth-helpers';\n\nimport { highlightLanguage } from '../-private/language-loader.ts';\nimport Controls from '../components/eui-code-block/controls.gts';\nimport FullScreenDisplay from '../components/eui-code-block/full-screen-display.gts';\nimport VirtualizedCodeBlock from '../components/eui-code-block/virtualized.gts';\nimport EuiInnerText from '../components/eui-inner-text.gts';\nimport classNames from '../helpers/class-names.ts';\nimport mutationObserver from '../modifiers/mutation-observer.ts';\nimport resizeObserver from '../modifiers/resize-observer.ts';\nimport {\n checkSupportedLanguage,\n getHtmlContent,\n highlightByLine\n} from '../utils/code/utils.ts';\n\nimport type { EuiCodeSharedProps } from '../utils/code/utils.ts';\nimport type { RefractorNode } from 'refractor/core';\n\ninterface LineNumbersConfig {\n start?: number;\n highlight?: string;\n show?: boolean;\n}\n\nexport type PaddingSize = 'none' \| 's' \| 'm' \| 'l';\nexport type FontSize = 's' \| 'm' \| 'l';\n\nconst fontSizeToRowHeightMap = {\n s: 18,\n m: 21,\n l: 24\n};\n\nexport type EuiCodeBlockArgs = EuiCodeSharedProps & {\n /** Padding around the code: `'none'`, `'s'`, `'m'` or `'l'`. Defaults to `'l'`. /\n paddingSize?: PaddingSize;\n /* `'s'`, `'m'` or `'l'`. Defaults to `'s'`. /\n fontSize?: FontSize;\n\n /\n Specify how `white-space` inside the element is handled.\n * `pre` respects line breaks/white space but doesn't force them to wrap the line\n * `pre-wrap` respects line breaks/white space but does force them to wrap the line when necessary.\n * Defaults to `'pre-wrap'`.\n /\n whiteSpace?: 'pre' \| 'pre-wrap';\n\n /\n Displays an icon button to copy the code snippet to the clipboard.\n /\n isCopyable?: boolean;\n\n /\n Displays line numbers.\n * Optionally accepts a configuration object for setting the starting number and visual highlighting ranges:\n * `{ start: 100, highlight: '1, 5-10, 20-30, 40' }`\n /\n lineNumbers?: boolean \| LineNumbersConfig;\n\n /\n Sets the maximum container height.\n * Accepts a pixel value (`300`) or a percentage (`'100%'`)\n * Ensure the container has calcuable height when using a percentage\n /\n overflowHeight?: number \| string;\n\n /\n Renders code block lines virtually.\n * Useful for improving load times of large code blocks.\n \n When using this configuration, `overflowHeight` is required and\n * `whiteSpace` can only be `pre`.\n /\n isVirtualized?: boolean;\n};\n\n/\n Multi-line code with syntax highlighting, optional copy button, line\n * numbers and full screen view:\n * `<EuiCodeBlock @language=\"js\" @isCopyable={{true}}>{{this.code}}</EuiCodeBlock>`.\n /\nexport interface EuiCodeBlockSignature {\n Element: HTMLElement;\n Args: EuiCodeBlockArgs;\n Blocks: {\n /* The code, as text (e.g. a string from your component). /\n default: [];\n };\n}\n\ninterface LineNumbersFinal {\n start: number;\n show: boolean;\n highlight?: string;\n}\n\nconst highlightTargetModifier = modifier(\n (\n _e,\n _pos: unknown[],\n {\n element: targetEle,\n language = 'text',\n lineNumbersConfig = { start: 1, show: false },\n onChange\n }: {\n element: Element \| undefined;\n language: EuiCodeSharedProps['language'];\n lineNumbersConfig: LineNumbersFinal;\n onChange: ({\n data,\n element\n }: {\n data: RefractorNode[];\n element: HTMLElement;\n }) => void;\n }\n ) => {\n let observer: undefined \| MutationObserver;\n\n const getHighlighedHtml = () => {\n const html = (targetEle?.textContent ? targetEle.textContent : '').trim();\n\n let data: RefractorNode[];\n\n if (typeof html !== 'string') {\n data = [];\n } else {\n data = highlightByLine(html, language, lineNumbersConfig);\n }\n\n return {\n data,\n element: getHtmlContent(data).element\n };\n };\n\n const setupObserver = () => {\n const newObserver = new MutationObserver((mutationsList) => {\n if (mutationsList.length) {\n onChange(getHighlighedHtml());\n }\n });\n\n if (targetEle) {\n onChange(getHighlighedHtml());\n newObserver.observe(targetEle, {\n characterData: true,\n subtree: true,\n childList: true\n });\n }\n\n return newObserver;\n };\n\n if (targetEle) {\n observer = setupObserver();\n }\n\n return () => {\n observer?.disconnect();\n };\n }\n);\n\nconst cleanTextHelper = helper(function ([text]: [string]) {\n return text?.replace(/[\\r\\n?]{2}\|\\n\\n/g, '\\n') \|\| '';\n});\n\nconst textToCopyHelper = helper(function (\n _pos,\n {\n isVirtualized,\n element,\n innerText\n }: {\n isVirtualized: boolean;\n element: HTMLElement \| undefined;\n innerText: string;\n }\n) {\n if (element) {\n return isVirtualized\n ? element.textContent\n ? element.textContent\n : ''\n : innerText;\n }\n\n return '';\n});\n\nexport default class EuiCodeBlockComponent extends Component<EuiCodeBlockSignature> {\n //fake element where yield writes to, so we can observe and clone a highlighted version to code and codeFullSceen\n @tracked codeTarget?: HTMLElement;\n //<code> Element for non fullscreen\n @tracked code?: HTMLElement;\n //<code> Element for fullscreen modal\n @tracked codeFullScreen?: HTMLElement;\n @tracked wrapperRef?: HTMLElement;\n @tracked tabIndex = 1;\n @tracked isFullScreen = false;\n @tracked data?: { data: RefractorNode[]; element: HTMLElement };\n\n get language() {\n return checkSupportedLanguage(this.args.language \|\| '');\n }\n\n /* Plain text until the language has loaded. */\n get highlightLanguage() {\n return highlightLanguage(this.language);\n }\n\n get transparentBackground() {\n return this.args.transparentBackground ?? false;\n }\n\n get paddingSize() {\n return this.args.paddingSize ?? 'l';\n }\n\n get fontSize() {\n return this.args.fontSize ?? 's';\n }\n\n get isCopyable() {\n return this.args.isCopyable ?? false;\n }\n\n get whiteSpace() {\n return this.args.whiteSpace ?? 'pre-wrap';\n }\n\n get isVirtualized() {\n return !!(this.args.isVirtualized && Array.isArray(this.data?.data));\n }\n\n get lineNumbers() {\n return this.args.lineNumbers ?? false;\n }\n\n get lineNumbersConfig() {\n const { lineNumbers } = this;\n const config = typeof lineNumbers === 'object' ? lineNumbers : {};\n\n return lineNumbers\n ? { start: 1, show: true, ...config }\n : { start: 1, show: false };\n }\n\n get optionalStyles() {\n const overflowHeight = this.args.overflowHeight;\n\n if (overflowHeight) {\n const property =\n typeof overflowHeight === 'string' ? 'height' : 'maxHeight';\n\n return {\n [property]:\n typeof overflowHeight === 'string'\n ? overflowHeight\n : `${overflowHeight}px`\n };\n }\n\n return {};\n }\n\n get showCopyButton() {\n return this.isCopyable && true;\n }\n\n get rowHeight() {\n return fontSizeToRowHeightMap[this.fontSize];\n }\n\n get showFullScreenButton() {\n return !!this.args.overflowHeight;\n }\n\n constructor(owner: Owner, args: EuiCodeBlockArgs) {\n super(owner, args);\n this.codeTarget = document.createElement('div');\n }\n\n @action\n toggleFullScreen() {\n this.isFullScreen = !this.isFullScreen;\n }\n\n @action\n closeFullScreen(e: KeyboardEvent) {\n e.preventDefault();\n e.stopPropagation();\n this.isFullScreen = false;\n }\n\n @action\n doesOverflow() {\n if (!this.wrapperRef) return;\n\n const { clientWidth, clientHeight, scrollWidth, scrollHeight } =\n this.wrapperRef;\n const doesOverflow =\n scrollHeight > clientHeight \|\| scrollWidth > clientWidth;\n\n this.tabIndex = doesOverflow ? 0 : -1;\n }\n\n @action\n updateCode(resp: { data: RefractorNode[]; element: HTMLElement }) {\n const render = () => {\n const code = this.code;\n const codeFullScreen = this.codeFullScreen;\n\n if (code && !this.isFullScreen) {\n this.data = resp;\n code.innerHTML = resp.element.innerHTML;\n }\n\n if (codeFullScreen && this.isFullScreen) {\n this.data = resp;\n codeFullScreen.innerHTML = resp.element.innerHTML;\n }\n };\n\n scheduleOnce('afterRender', this, render);\n }\n\n willDestroy() {\n super.willDestroy();\n\n this.codeTarget = undefined;\n this.code = undefined;\n this.codeFullScreen = undefined;\n this.wrapperRef = undefined;\n }\n\n <template>\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{! DO NOT FORMAT AT ALL, PRE TAGS RESPECT WHITESPACE LITERALLY }}\n {{#if this.codeTarget}}\n {{#in-element this.codeTarget}}\n {{yield}}\n {{/in-element}}\n {{/if}}\n <EuiInnerText as \|setInnerTextRef innerText\|>\n {{#let\n (classNames\n \"euiCodeBlock\"\n (if\n (or this.showCopyButton this.showFullScreenButton)\n \"euiCodeBlock--hasControl\"\n )\n (if\n (and this.showCopyButton this.showFullScreenButton)\n \"euiCodeBlock--hasBothControls\"\n )\n (if this.lineNumbersConfig.show \"euiCodeBlock--hasLineNumbers\")\n @className\n )\n (classNames\n \"euiCodeBlock__pre\"\n (if\n (or (eq this.whiteSpace \"pre\") this.isVirtualized)\n \"euiCodeBlock__pre--whiteSpacePre\"\n )\n (if\n (and (eq this.whiteSpace \"pre-wrap\") (not this.isVirtualized))\n \"euiCodeBlock__pre--whiteSpacePreWrap\"\n )\n (if this.isVirtualized \"euiCodeBlock__pre--isVirtualized\")\n )\n as \|wrapperClasses preClasses\|\n }}\n <div\n class={{classNames\n wrapperClasses\n (if\n this.transparentBackground \"euiCodeBlock--transparentBackground\"\n )\n componentName=\"EuiCodeBlock\"\n fontSize=this.fontSize\n paddingSize=this.paddingSize\n }}\n {{style this.optionalStyles}}\n {{highlightTargetModifier\n element=this.codeTarget\n language=this.highlightLanguage\n lineNumbersConfig=this.lineNumbersConfig\n onChange=this.updateCode\n }}\n >\n {{#if this.isVirtualized}}\n {{!virtualized}}\n <VirtualizedCodeBlock\n class={{preClasses}}\n tabindex=\"0\"\n {{onKey \"Escape\" this.closeFullScreen}}\n @language={{this.language}}\n @data={{this.data.data}}\n @rowHeight={{this.rowHeight}}\n />\n {{else}}\n {{!template-lint-disable}}\n <pre\n class={{preClasses}}\n {{style this.optionalStyles}}\n tabindex={{this.tabIndex}}\n {{didInsert (set this \"wrapperRef\")}}\n {{resizeObserver onResize=this.doesOverflow}}\n {{mutationObserver\n onMutation=this.doesOverflow\n observerOptions=(hash subtree=true childList=true)\n }}\n {{didInsert setInnerTextRef}}\n ><code\n class=\"euiCodeBlock__code\"\n data-code-language={{this.language}}\n {{didInsert (set this \"code\")}}\n ...attributes\n ></code></pre>\n\n {{/if}}\n\n <Controls\n @isFullScreen={{this.isFullScreen}}\n @showFullScreenButton={{this.showFullScreenButton}}\n @toggleFullScreen={{this.toggleFullScreen}}\n @showCopyButton={{this.showCopyButton}}\n @textToCopy={{textToCopyHelper\n isVirtualized=this.isVirtualized\n innerText=(cleanTextHelper innerText)\n element=this.data.element\n }}\n />\n\n {{#if this.isFullScreen}}\n <FullScreenDisplay class={{wrapperClasses}}>\n {{#if this.isVirtualized}}\n <VirtualizedCodeBlock\n class={{preClasses}}\n tabindex=\"0\"\n {{onKey \"Escape\" this.closeFullScreen}}\n @language={{this.language}}\n @data={{this.data.data}}\n @rowHeight={{fontSizeToRowHeightMap.l}}\n />\n {{else}}\n <pre\n class={{preClasses}}\n tabindex=\"0\"\n {{onKey \"Escape\" this.closeFullScreen}}\n ><code\n class=\"euiCodeBlock__code\"\n data-code-language={{this.language}}\n {{didInsert (set this \"codeFullScreen\")}}\n ></code></pre>\n {{/if}}\n <Controls\n @isFullScreen={{this.isFullScreen}}\n @showFullScreenButton={{this.showFullScreenButton}}\n @showCopyButton={{this.showCopyButton}}\n @toggleFullScreen={{this.toggleFullScreen}}\n @textToCopy={{textToCopyHelper\n isVirtualized=this.isVirtualized\n innerText=(cleanTextHelper innerText)\n element=this.data.element\n }}\n />\n </FullScreenDisplay>\n {{/if}}\n </div>\n {{/let}}\n </EuiInnerText>\n </template>\n}\n"],"names":["fontSizeToRowHeightMap","s","m","l","highlightTargetModifier","modifier","_e","_pos","element","targetEle","language","lineNumbersConfig","start","show","onChange","observer","getHighlighedHtml","html","textContent","trim","data","highlightByLine","getHtmlContent","setupObserver","newObserver","MutationObserver","mutationsList","length","observe","characterData","subtree","childList","disconnect","cleanTextHelper","helper","text","replace","textToCopyHelper","isVirtualized","innerText","EuiCodeBlockComponent","Component","g","prototype","tracked","i","checkSupportedLanguage","args","highlightLanguage","transparentBackground","paddingSize","fontSize","isCopyable","whiteSpace","Array","isArray","lineNumbers","config","optionalStyles","overflowHeight","property","showCopyButton","rowHeight","showFullScreenButton","constructor","owner","codeTarget","document","createElement","toggleFullScreen","isFullScreen","n","action","closeFullScreen","e","preventDefault","stopPropagation","doesOverflow","wrapperRef","clientWidth","clientHeight","scrollWidth","scrollHeight","tabIndex","updateCode","resp","render","code","codeFullScreen","innerHTML","scheduleOnce","willDestroy","undefined","setComponentTemplate","precompileTemplate","strictMode","scope","EuiInnerText","classNames","or","and","eq","not","style","VirtualizedCodeBlock","onKey","didInsert","set","resizeObserver","mutationObserver","hash","Controls","FullScreenDisplay"],"mappings":"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"}

package/dist/components/eui-code.js CHANGED Viewed

@@ -5,9 +5,10 @@ import didInsert from '@ember/render-modifiers/modifiers/did-insert';
 import didUpdate from '@ember/render-modifiers/modifiers/did-update';
 import { scheduleOnce } from '@ember/runloop';
 import set from 'ember-set-helper/helpers/set';
-import { highlight } from 'refractor';
+import { highlight } from 'refractor/core';
 import argOrDefault from '../helpers/arg-or-default.js';
 import classNames from '../helpers/class-names.js';
+import { highlightLanguage } from '../-private/language-loader.js';
 import { checkSupportedLanguage, getHtmlContent } from '../utils/code/utils.js';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
@@ -31,6 +32,10 @@ class EuiCodeComponent extends Component {
   get language() {
     return checkSupportedLanguage(this.args.language || '');
   }
+  /** Plain text until the language has loaded. */
+  get highlightLanguage() {
+    return highlightLanguage(this.language);
+  }
   setupObserver() {
     this.observer?.disconnect();
     this.observer = new MutationObserver(mutationsList => {
@@ -52,7 +57,7 @@ class EuiCodeComponent extends Component {
       if (typeof html !== 'string') {
         data = [];
       } else {
-        data = highlight(html, this.language);
+        data = highlight(html, this.highlightLanguage);
       }
       const code = this.code;
       if (code) {
@@ -71,7 +76,7 @@ class EuiCodeComponent extends Component {
     this.code = undefined;
   }
   static {
-    setComponentTemplate(precompileTemplate("{{#if this.codeTarget}}\n  {{#in-element this.codeTarget}}\n    {{yield}}\n  {{/in-element}}\n{{/if}}\n<code class={{classNames \"euiCode\" (if @transparentBackground \"euiCode--transparentBackground\")}} data-code-language={{argOrDefault @language \"text\"}} {{didInsert (set this \"code\")}} {{didInsert this.update}} {{didUpdate this.update this.language}} {{didUpdate this.update this.language}} ...attributes></code>", {
+    setComponentTemplate(precompileTemplate("{{#if this.codeTarget}}\n  {{#in-element this.codeTarget}}\n    {{yield}}\n  {{/in-element}}\n{{/if}}\n<code class={{classNames \"euiCode\" (if @transparentBackground \"euiCode--transparentBackground\")}} data-code-language={{argOrDefault @language \"text\"}} {{didInsert (set this \"code\")}} {{didInsert this.update}} {{didUpdate this.update this.highlightLanguage}} ...attributes></code>", {
       strictMode: true,
       scope: () => ({
         classNames,

package/dist/components/eui-code.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-code.js","sources":["../../src/components/eui-code.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport didInsert from '@ember/render-modifiers/modifiers/did-insert';\nimport didUpdate from '@ember/render-modifiers/modifiers/did-update';\nimport { scheduleOnce } from '@ember/runloop';\nimport type Owner from '@ember/owner';\n\nimport set from 'ember-set-helper/helpers/set';\nimport { highlight } from 'refractor';\n\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport { checkSupportedLanguage,getHtmlContent } from '../utils/code/utils.ts';\n\nimport type { EuiCodeSharedProps } from '../utils/code/utils.ts';\nimport type { RefractorNode } from 'refractor';\n\nexport type EuiCodeArgs = EuiCodeSharedProps & {\n ~~//comments\~~n~~};\n\~~nexport interface EuiCodeSignature {\n Args: EuiCodeArgs;\n Blocks: {\n default: [];\n };\n Element: HTMLElement;\n}\n\nexport default class EuiCodeComponent extends Component<EuiCodeSignature> {\n @tracked codeTarget?: HTMLElement;\n @tracked code?: HTMLElement;\n observer: MutationObserver \| null = null;\n\n constructor(owner: Owner, args: EuiCodeArgs) {\n super(owner, args);\n this.codeTarget = document.createElement('div');\n this.setupObserver();\n }\n\n get language() {\n return checkSupportedLanguage(this.args.language \|\| '');\n }\n\n setupObserver() {\n this.observer?.disconnect();\n this.observer = new MutationObserver((mutationsList) => {\n if (mutationsList.length) this.update();\n });\n\n if (this.codeTarget) {\n this.update();\n this.observer.observe(this.codeTarget, {\n characterData: true,\n subtree: true,\n childList: true\n });\n }\n }\n\n @action\n update() {\n const render = () => {\n const html = (\n this.codeTarget?.textContent ? this.codeTarget.textContent : ''\n ).trim();\n\n let data: RefractorNode[];\n\n if (typeof html !== 'string') {\n data = [];\n } else {\n data = highlight(html, this.~~language~~);\n }\n\n const code = this.code;\n\n if (code) {\n code.innerHTML = getHtmlContent(data).element.innerHTML;\n }\n };\n\n scheduleOnce('afterRender', this, render);\n }\n\n willDestroy(): void {\n super.willDestroy();\n\n this.observer?.disconnect();\n this.codeTarget = undefined;\n this.code = undefined;\n }\n\n <template>\n {{#if this.codeTarget}}\n {{#in-element this.codeTarget}}\n {{yield}}\n {{/in-element}}\n {{/if}}\n <code\n class={{classNames\n \"euiCode\"\n (if @transparentBackground \"euiCode--transparentBackground\")\n }}\n data-code-language={{argOrDefault @language \"text\"}}\n {{didInsert (set this \"code\")}}\n {{didInsert this.update}}\n {{didUpdate this.update this.~~language~~}}\n ~~{{didUpdate this.update this.language}}\n~~ ...attributes\n ></code>\n </template>\n}\n"],"names":["EuiCodeComponent","Component","g","prototype","tracked","i","observer","constructor","owner","args","codeTarget","document","createElement","setupObserver","language","checkSupportedLanguage","disconnect","MutationObserver","mutationsList","length","update","observe","characterData","subtree","childList","render","html","textContent","trim","data","highlight","code","innerHTML","getHtmlContent","element","scheduleOnce","n","action","willDestroy","undefined","setComponentTemplate","precompileTemplate","strictMode","scope","classNames","argOrDefault","didInsert","set","didUpdate"],"mappings":"~~;;;;;;;;;;;;;;;AA8Be~~,MAAMA,yBAAyBC,~~SAAU~~,~~CAAA~~;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,YAAA,EAAA,CACrDC,OAAA,CAAA,CAAA;AAAA;EAAA,WAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,YAAA,CAAA,EAAA,MAAA;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,MAAA,EAAA,CACAC,OAAA,CAAA,CAAA;AAAA;EAAA,KAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,MAAA,CAAA,EAAA,MAAA;AACDC,EAAAA,~~QAAU~~,~~GAA0B~~,~~IAAK~~;~~AAEzCC~~,EAAAA,WAAAA,CAAYC,KAAY,EAAEC,IAAiB,EAAE;AAC3C,IAAA,KAAK,CAACD,~~KAAO~~,~~EAAAC~~,IAAA,CAAA;IACb,IAAI,CAACC,UAAU,GAAGC,QAAA,CAASC,aAAa,CAAC,KAAA,CAAA;IACzC,IAAI,CAACC,aAAa,EAAA;AACpB;EAEA,IAAIC,~~QAAWA~~,~~GAAA~~;IACb,OAAOC,uBAAuB,IAAI,CAACN,IAAI,CAACK,QAAQ,IAAI,EAAA,CAAA;AACtD;AAEAD,EAAAA,~~aAAgBA~~,~~GAAA~~;AACd,IAAA,IAAI,CAACP,QAAQ,~~EAAEU~~,UAAA,EAAA;AACf,IAAA,IAAI,~~CAACV~~,QAAQ,GAAG,~~IAAIW~~,iBAAkBC,aAAA,IAAA;MACpC,IAAIA,~~aAAc~~,~~CAAAC~~,MAAM,EAAE,IAAI,CAACC,MAAM,EAAA;AACvC,~~KAAA~~,CAAA;IAEA,IAAI,IAAI,~~CAACV~~,UAAU,EAAE;MACnB,IAAI,~~CAACU~~,MAAM,EAAA;MACX,IAAI,~~CAACd~~,QAAQ,~~CAACe~~,OAAO,CAAC,IAAI,~~CAACX~~,UAAU,EAAE;~~AACrCY~~,QAAAA,~~aAAe~~,~~EAAA~~,IAAA;AACfC,QAAAA,~~OAAS~~,~~EAAA~~,IAAA;AACTC,QAAAA,~~SAAW~~,~~EAAA~~;AACb,OAAA,CAAA;AACF;AACF;AAGAJ,EAAAA,~~MAASA~~,~~GAAA~~;IACP,MAAMK,~~MAAS~~,~~GAAAA~~,MAAA;AACb,MAAA,MAAMC,~~IAAO~~,~~GAAA~~,CACX,IAAI,~~CAAChB~~,UAAU,~~EAAEiB~~,WAAA,GAAc,IAAI,~~CAACjB~~,UAAU,~~CAACiB~~,WAAW,GAAG,EAC/D,EAAEC,IAAI,EAAA;AAEN,MAAA,IAAIC,IAAM;AAEV,MAAA,IAAI,OAAOH,SAAS,~~QAAU~~,~~EAAA~~;AAC5BG,QAAAA,IAAA,GAAO,EAAE;AACX,~~OAAO~~,~~MAAA~~;QACLA,IAAA,GAAOC,~~SAAU~~,~~CAAAJ~~,IAAA,EAAM,IAAI,~~CAACZ~~,~~QAAQ~~,CAAA;~~AACtC~~;AAEA,MAAA,~~MAAMiB~~,IAAA,GAAO,IAAI,CAACA,IAAI;AAEtB,MAAA,IAAIA,~~IAAM~~,~~EAAA~~;QACRA,IAAA,CAAKC,SAAS,GAAGC,cAAA,CAAeJ,~~IAAM~~,CAAA,~~CAAAK~~,OAAO,CAACF,SAAS;AACzD;~~KACF~~;AAEAG,IAAAA,~~YAAa~~,~~CAAA~~,aAAA,EAAe,IAAI,EAAEV,MAAA,CAAA;AACpC;AAAA,EAAA;IAAAW,CAAA,CAAA,IAAA,~~CAAAjC~~,SAAA,EAAA,QAAA,EAAA,~~CAvBCkC~~,MAAA,CAAA,CAAA;AAAA;AAyBDC,EAAAA,WAAAA,GAAoB;IAClB,KAAK,CAACA,WAAA,EAAA;AAEN,IAAA,IAAI,~~CAAChC~~,QAAQ,~~EAAEU~~,UAAA,EAAA;IACf,IAAI,~~CAACN~~,UAAU,~~GAAG6B~~,SAAA;IAClB,IAAI,CAACR,IAAI,GAAGQ,SAAA;AACd;AAEA,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,~~CAkBA~~,~~uaAAA~~,~~EAAA~~;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;QAAAC,UAAA;QAAAC,YAAA;QAAAC,SAAA;QAAAC,GAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ~~;;;;~~"}
1	+ {"version":3,"file":"eui-code.js","sources":["../../src/components/eui-code.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport didInsert from '@ember/render-modifiers/modifiers/did-insert';\nimport didUpdate from '@ember/render-modifiers/modifiers/did-update';\nimport { scheduleOnce } from '@ember/runloop';\nimport type Owner from '@ember/owner';\n\nimport set from 'ember-set-helper/helpers/set';\nimport { highlight } from 'refractor/core';\n\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport { highlightLanguage } from '../-private/language-loader.ts';\nimport { checkSupportedLanguage,getHtmlContent } from '../utils/code/utils.ts';\n\nimport type { EuiCodeSharedProps } from '../utils/code/utils.ts';\nimport type { RefractorNode } from 'refractor/core';\n\nexport type EuiCodeArgs = EuiCodeSharedProps;\n\n/*\n Inline code with syntax highlighting: `<EuiCode @language=\"js\">const a = 1;</EuiCode>`.\n * For multi-line code use EuiCodeBlock.\n /\nexport interface EuiCodeSignature {\n Args: EuiCodeArgs;\n Blocks: {\n /* The code, as text. /\n default: [];\n };\n Element: HTMLElement;\n}\n\nexport default class EuiCodeComponent extends Component<EuiCodeSignature> {\n @tracked codeTarget?: HTMLElement;\n @tracked code?: HTMLElement;\n observer: MutationObserver \| null = null;\n\n constructor(owner: Owner, args: EuiCodeArgs) {\n super(owner, args);\n this.codeTarget = document.createElement('div');\n this.setupObserver();\n }\n\n get language() {\n return checkSupportedLanguage(this.args.language \|\| '');\n }\n\n /* Plain text until the language has loaded. */\n get highlightLanguage() {\n return highlightLanguage(this.language);\n }\n\n setupObserver() {\n this.observer?.disconnect();\n this.observer = new MutationObserver((mutationsList) => {\n if (mutationsList.length) this.update();\n });\n\n if (this.codeTarget) {\n this.update();\n this.observer.observe(this.codeTarget, {\n characterData: true,\n subtree: true,\n childList: true\n });\n }\n }\n\n @action\n update() {\n const render = () => {\n const html = (\n this.codeTarget?.textContent ? this.codeTarget.textContent : ''\n ).trim();\n\n let data: RefractorNode[];\n\n if (typeof html !== 'string') {\n data = [];\n } else {\n data = highlight(html, this.highlightLanguage);\n }\n\n const code = this.code;\n\n if (code) {\n code.innerHTML = getHtmlContent(data).element.innerHTML;\n }\n };\n\n scheduleOnce('afterRender', this, render);\n }\n\n willDestroy(): void {\n super.willDestroy();\n\n this.observer?.disconnect();\n this.codeTarget = undefined;\n this.code = undefined;\n }\n\n <template>\n {{#if this.codeTarget}}\n {{#in-element this.codeTarget}}\n {{yield}}\n {{/in-element}}\n {{/if}}\n <code\n class={{classNames\n \"euiCode\"\n (if @transparentBackground \"euiCode--transparentBackground\")\n }}\n data-code-language={{argOrDefault @language \"text\"}}\n {{didInsert (set this \"code\")}}\n {{didInsert this.update}}\n {{didUpdate this.update this.highlightLanguage}}\n ...attributes\n ></code>\n </template>\n}\n"],"names":["EuiCodeComponent","Component","g","prototype","tracked","i","observer","constructor","owner","args","codeTarget","document","createElement","setupObserver","language","checkSupportedLanguage","highlightLanguage","disconnect","MutationObserver","mutationsList","length","update","observe","characterData","subtree","childList","render","html","textContent","trim","data","highlight","code","innerHTML","getHtmlContent","element","scheduleOnce","n","action","willDestroy","undefined","setComponentTemplate","precompileTemplate","strictMode","scope","classNames","argOrDefault","didInsert","set","didUpdate"],"mappings":"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"}

package/dist/components/eui-collapsible-nav-group.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { concat } from '@ember/helper';
 import { element } from 'ember-element-helper';
-import { notEq, and } from 'ember-truth-helpers';
+import { and, or } from 'ember-truth-helpers';
 import randomId from '../-private/random-id.js';
 import argOrDefault from '../helpers/arg-or-default.js';
 import classNames from '../helpers/class-names.js';
@@ -8,16 +8,16 @@ import EuiAccordionComponent from './eui-accordion.js';
 import EuiFlexGroup from './eui-flex-group.js';
 import EuiFlexItem from './eui-flex-item.js';
 import EuiIcon from './eui-icon.js';
-import EuiTitle from './eui-title.js';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 import templateOnly from '@ember/component/template-only';
-const EuiCollapsibleNavGroup = setComponentTemplate(precompileTemplate("{{#let (argOrDefault @id (randomId)) (argOrDefault @titleElement \"h3\") as |groupID titleElement|}}\n  {{#let (concat groupID \"__title\") as |titleID|}}\n    {{#if (and @isCollapsible (has-block \"title\"))}}\n      <EuiAccordion id={{groupID}} class={{classNames (if (has-block \"title\") \"euiCollapsibleNavGroup--withHeading\") componentName=\"EuiCollapsibleNavGroup\" backgroundColor=(argOrDefault @background \"none\")}} @buttonClassName=\"euiCollapsibleNavGroup__heading\" @initialIsOpen={{argOrDefault @initialIsOpen true}} @arrowDisplay=\"right\" ...attributes>\n        <:buttonContent>\n          <EuiFlexGroup @gutterSize=\"m\" @alignItems=\"center\" @responsive={{false}}>\n            {{#if @iconType}}\n              <EuiFlexItem @grow={{false}}>\n                <EuiIcon @type={{@iconType}} @size={{argOrDefault @iconSize \"l\"}} />\n              </EuiFlexItem>\n            {{/if}}\n            <EuiFlexItem>\n              <EuiTitle id={{concat groupID \"__title\"}} @tagName={{argOrDefault @titleTagName \"h3\"}} @size={{argOrDefault @titleSize \"xxs\"}}>\n                {{#if (notEq titleElement \"h3\")}}\n                  {{#let (element titleElement) as |TitleElement|}}\n                    <TitleElement id={{titleID}} class=\"euiCollapsibleNavGroup__title\">\n                      {{yield to=\"title\"}}\n                    </TitleElement>\n                  {{/let}}\n                {{else}}\n                  <h3 id={{titleID}} class=\"euiCollapsibleNavGroup__title\">\n                    {{yield to=\"title\"}}\n                  </h3>\n                {{/if}}\n              </EuiTitle>\n            </EuiFlexItem>\n          </EuiFlexGroup>\n        </:buttonContent>\n        <:content>\n          {{#if (has-block \"content\")}}\n            <div class=\"euiCollapsibleNavGroup__children\">\n              {{yield to=\"content\"}}\n            </div>\n          {{/if}}\n        </:content>\n      </EuiAccordion>\n    {{else}}\n      <div id={{groupID}} class={{classNames (if (has-block \"title\") \"euiCollapsibleNavGroup--withHeading\") componentName=\"EuiCollapsibleNavGroup\" backgroundColor=(argOrDefault @background \"none\")}} ...attributes>\n        {{#if (has-block \"title\")}}\n          <div class=\"euiCollapsibleNavGroup__heading\">\n            <EuiFlexGroup @gutterSize=\"m\" @alignItems=\"center\" @responsive={{false}}>\n              {{#if @iconType}}\n                <EuiFlexItem @grow={{false}}>\n                  <EuiIcon @type={{@iconType}} @size={{argOrDefault @iconSize \"l\"}} />\n                </EuiFlexItem>\n              {{/if}}\n              <EuiFlexItem>\n                <EuiTitle id={{concat groupID \"__title\"}} @tagName={{argOrDefault @titleTagName \"h3\"}} @size={{argOrDefault @titleSize \"xxs\"}}>\n                  {{#if (notEq titleElement \"h3\")}}\n                    {{#let (element titleElement) as |TitleElement|}}\n                      <TitleElement id={{titleID}} class=\"euiCollapsibleNavGroup__title\">\n                        {{yield to=\"title\"}}\n                      </TitleElement>\n                    {{/let}}\n                  {{else}}\n                    <h3 id={{titleID}} class=\"euiCollapsibleNavGroup__title\">\n                      {{yield to=\"title\"}}\n                    </h3>\n                  {{/if}}\n                </EuiTitle>\n              </EuiFlexItem>\n            </EuiFlexGroup>\n          </div>\n        {{/if}}\n        {{#if (has-block \"content\")}}\n          <div class=\"euiCollapsibleNavGroup__children\">\n            {{yield to=\"content\"}}\n          </div>\n        {{/if}}\n      </div>\n    {{/if}}\n  {{/let}}\n{{/let}}", {
+const EuiCollapsibleNavGroup = setComponentTemplate(precompileTemplate("{{#let (argOrDefault @id (randomId)) (or @titleElement @titleTagName \"h3\") as |groupID titleElement|}}\n  {{#let (concat groupID \"__title\") as |titleID|}}\n    {{#if (and @isCollapsible (has-block \"title\"))}}\n      <EuiAccordion id={{groupID}} class={{classNames (if (has-block \"title\") \"euiCollapsibleNavGroup--withHeading\") componentName=\"EuiCollapsibleNavGroup\" backgroundColor=(argOrDefault @background \"none\")}} @buttonClassName=\"euiCollapsibleNavGroup__heading\" @initialIsOpen={{argOrDefault @initialIsOpen true}} @arrowDisplay=\"right\" ...attributes>\n        <:buttonContent>\n          <EuiFlexGroup @gutterSize=\"m\" @alignItems=\"center\" @responsive={{false}}>\n            {{#if @iconType}}\n              <EuiFlexItem @grow={{false}}>\n                <EuiIcon @type={{@iconType}} @size={{argOrDefault @iconSize \"l\"}} />\n              </EuiFlexItem>\n            {{/if}}\n            <EuiFlexItem>\n              {{#let (element titleElement) as |TitleElement|}}\n                <TitleElement id={{titleID}} class={{classNames \"euiCollapsibleNavGroup__title\" componentName=\"EuiTitle\" size=(argOrDefault @titleSize \"xxs\")}}>\n                  {{yield to=\"title\"}}\n                </TitleElement>\n              {{/let}}\n            </EuiFlexItem>\n          </EuiFlexGroup>\n        </:buttonContent>\n        <:content>\n          {{#if (has-block \"content\")}}\n            <div class=\"euiCollapsibleNavGroup__children\">\n              {{yield to=\"content\"}}\n            </div>\n          {{/if}}\n        </:content>\n      </EuiAccordion>\n    {{else}}\n      <div id={{groupID}} class={{classNames (if (has-block \"title\") \"euiCollapsibleNavGroup--withHeading\") componentName=\"EuiCollapsibleNavGroup\" backgroundColor=(argOrDefault @background \"none\")}} ...attributes>\n        {{#if (has-block \"title\")}}\n          <div class=\"euiCollapsibleNavGroup__heading\">\n            <EuiFlexGroup @gutterSize=\"m\" @alignItems=\"center\" @responsive={{false}}>\n              {{#if @iconType}}\n                <EuiFlexItem @grow={{false}}>\n                  <EuiIcon @type={{@iconType}} @size={{argOrDefault @iconSize \"l\"}} />\n                </EuiFlexItem>\n              {{/if}}\n              <EuiFlexItem>\n                {{#let (element titleElement) as |TitleElement|}}\n                  <TitleElement id={{titleID}} class={{classNames \"euiCollapsibleNavGroup__title\" componentName=\"EuiTitle\" size=(argOrDefault @titleSize \"xxs\")}}>\n                    {{yield to=\"title\"}}\n                  </TitleElement>\n                {{/let}}\n              </EuiFlexItem>\n            </EuiFlexGroup>\n          </div>\n        {{/if}}\n        {{#if (has-block \"content\")}}\n          <div class=\"euiCollapsibleNavGroup__children\">\n            {{yield to=\"content\"}}\n          </div>\n        {{/if}}\n      </div>\n    {{/if}}\n  {{/let}}\n{{/let}}", {
   strictMode: true,
   scope: () => ({
     argOrDefault,
     randomId,
+    or,
     concat,
     and,
     EuiAccordion: EuiAccordionComponent,
@@ -25,8 +25,6 @@ const EuiCollapsibleNavGroup = setComponentTemplate(precompileTemplate("{{#let (
     EuiFlexGroup,
     EuiFlexItem,
     EuiIcon,
-    EuiTitle,
-    notEq,
     element
   })
 }), templateOnly());

package/dist/components/eui-collapsible-nav-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-collapsible-nav-group.js","sources":["../../src/components/eui-collapsible-nav-group.gts"],"sourcesContent":["import { concat } from '@ember/helper';\n\nimport { element } from 'ember-element-helper';\nimport { and, ~~notEq~~ } from 'ember-truth-helpers';\n\nimport randomId from '../-private/random-id.ts';\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport EuiAccordion from './eui-accordion.gts';\nimport EuiFlexGroup from './eui-flex-group.gts';\nimport EuiFlexItem from './eui-flex-item.gts';\nimport EuiIcon from './eui-icon.gts';\~~nimport EuiTitle from './eui-title.gts';\~~n\nimport type { EuiAccordionSignature } from './eui-accordion';\nimport type { EuiIconSignature } from './eui-icon';\nimport type { EuiTitleSignature } from './eui-title';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\nexport interface EuiCollapsibleNavGroupSignature {\n Element: EuiAccordionSignature['Element'];\n Args: {\n id?: string;\n titleElement?: string;\n isCollapsible?: boolean;\n initialIsOpen?: boolean;\n iconType?: EuiIconSignature['Args']['type'];\n iconSize?: EuiIconSignature['Args']['size'];\n titleTagName?: EuiTitleSignature['Args']['tagName'];\n titleSize?: EuiTitleSignature['Args']['size'];\n background?: string;\n };\n Blocks: {\n default: [];\n title: [];\n content: [];\n };\n}\n\nconst EuiCollapsibleNavGroup: TemplateOnlyComponent<EuiCollapsibleNavGroupSignature> =\n <template>\n {{#let\n (argOrDefault @id (randomId)) (~~argOrDefault~~ @titleElement \"h3\")\n as \|groupID titleElement\|\n }}\n {{#let (concat groupID \"__title\") as \|titleID\|}}\n {{#if (and @isCollapsible (has-block \"title\"))}}\n <EuiAccordion\n id={{groupID}}\n class={{classNames\n (if (has-block \"title\") \"euiCollapsibleNavGroup--withHeading\")\n componentName=\"EuiCollapsibleNavGroup\"\n backgroundColor=(argOrDefault @background \"none\")\n }}\n @buttonClassName=\"euiCollapsibleNavGroup__heading\"\n @initialIsOpen={{argOrDefault @initialIsOpen true}}\n @arrowDisplay=\"right\"\n ...attributes\n >\n <:buttonContent>\n <EuiFlexGroup\n @gutterSize=\"m\"\n @alignItems=\"center\"\n @responsive={{false}}\n >\n {{#if @iconType}}\n <EuiFlexItem @grow={{false}}>\n <EuiIcon\n @type={{@iconType}}\n @size={{argOrDefault @iconSize \"l\"}}\n />\n </EuiFlexItem>\n {{/if}}\n <EuiFlexItem>\n ~~<EuiTitle\n id=~~{{concat groupID \"__title\"}}\n @tagName={{argOrDefault @titleTagName \"h3\"}}\n @size={{argOrDefault @titleSize \"xxs\"}}\n >\n {{#~~if (notEq titleElement \"h3\")}}\n {{#~~let (element titleElement) as \|TitleElement\|}}\n <TitleElement\n id={{titleID}}\n class=\"euiCollapsibleNavGroup__title\"\n ~~>\n {{yield to~~=\"~~title~~\"}}\n ~~</TitleElement>\~~n ~~{{/let~~}}\n ~~{{else}}\~~n ~~<h3 id=~~{{~~titleID}} class=\"euiCollapsibleNavGroup__title\">\n {{~~yield to=\"title\"}}\n </h3>\n {{/if}}\n ~~</EuiTitle>\n~~ </EuiFlexItem>\n </EuiFlexGroup>\n </:buttonContent>\n <:content>\n {{#if (has-block \"content\")}}\n <div class=\"euiCollapsibleNavGroup__children\">\n {{yield to=\"content\"}}\n </div>\n {{/if}}\n </:content>\n </EuiAccordion>\n {{else}}\n <div\n id={{groupID}}\n class={{classNames\n (if (has-block \"title\") \"euiCollapsibleNavGroup--withHeading\")\n componentName=\"EuiCollapsibleNavGroup\"\n backgroundColor=(argOrDefault @background \"none\")\n }}\n ...attributes\n >\n {{#if (has-block \"title\")}}\n <div class=\"euiCollapsibleNavGroup__heading\">\n <EuiFlexGroup\n @gutterSize=\"m\"\n @alignItems=\"center\"\n @responsive={{false}}\n >\n {{#if @iconType}}\n <EuiFlexItem @grow={{false}}>\n <EuiIcon\n @type={{@iconType}}\n @size={{argOrDefault @iconSize \"l\"}}\n />\n </EuiFlexItem>\n {{/if}}\n <EuiFlexItem>\n ~~<EuiTitle\n id=~~{{concat groupID \"__title\"}}\n @tagName={{argOrDefault @titleTagName \"h3\"}}\n @size={{argOrDefault @titleSize \"xxs\"}}\n >\n {{#~~if (notEq titleElement \"h3\")}}\n {{#~~let (element titleElement) as \|TitleElement\|}}\n <TitleElement\n id={{titleID}}\n class=\"euiCollapsibleNavGroup__title\"\n ~~>\n {{yield to~~=\"~~title~~\"}}\n ~~</TitleElement>\n {{/let}}~~\~~n {{else}}~~\n ~~<h3\n id={{titleID~~}}\n ~~class=\"euiCollapsibleNavGroup__title\"\~~n ~~>\n~~ {{yield to=\"title\"}}\n </h3>\n {{/if}}\n ~~</EuiTitle>\n~~ </EuiFlexItem>\n </EuiFlexGroup>\n </div>\n {{/if}}\n {{#if (has-block \"content\")}}\n <div class=\"euiCollapsibleNavGroup__children\">\n {{yield to=\"content\"}}\n </div>\n {{/if}}\n </div>\n {{/if}}\n {{/let}}\n {{/let}}\n </template>;\n\nexport default EuiCollapsibleNavGroup;\n"],"names":["EuiCollapsibleNavGroup","setComponentTemplate","precompileTemplate","strictMode","scope","argOrDefault","randomId","concat","and","EuiAccordion","classNames","EuiFlexGroup","EuiFlexItem","EuiIcon","~~EuiTitle","notEq","~~element","templateOnly"],"mappings":"~~;;;;;;;;;;;;;;;AAuCA~~,MAAMA,~~sBACJ~~,GAAAC,oBAAA,~~CAAAC~~,kBAAA,~~CA+HA~~,~~imHAAA~~,~~EAAA~~;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,YAAA;IAAAC,QAAA;IAAAC,MAAA;IAAAC,GAAA;kBAAAC,qBAAA;IAAAC,UAAA;IAAAC,YAAA;IAAAC,WAAA;IAAAC,OAAA;~~IAAAC,QAAA;IAAAC,KAAA;~~AAAAC,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA~~;;;;~~"}
1	+ {"version":3,"file":"eui-collapsible-nav-group.js","sources":["../../src/components/eui-collapsible-nav-group.gts"],"sourcesContent":["import { concat } from '@ember/helper';\n\nimport { element } from 'ember-element-helper';\nimport { and, or } from 'ember-truth-helpers';\n\nimport randomId from '../-private/random-id.ts';\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport EuiAccordion from './eui-accordion.gts';\nimport EuiFlexGroup from './eui-flex-group.gts';\nimport EuiFlexItem from './eui-flex-item.gts';\nimport EuiIcon from './eui-icon.gts';\n\nimport type { EuiAccordionSignature } from './eui-accordion';\nimport type { EuiIconSignature } from './eui-icon';\nimport type { EuiTitleSignature } from './eui-title';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\nexport interface EuiCollapsibleNavGroupSignature {\n Element: EuiAccordionSignature['Element'];\n Args: {\n /** Id of the group. Defaults to a random id. /\n id?: string;\n /* Tag of the title, e.g. `'h2'` or `'div'`. Defaults to `'h3'`. /\n titleElement?: string;\n /\n Makes the group an accordion that opens and closes from its title\n * (needs a `<:title>` block).\n /\n isCollapsible?: boolean;\n /* Whether a collapsible group starts open. Defaults to `true`. /\n initialIsOpen?: boolean;\n /* Icon before the title; anything `EuiIcon`'s `@type` accepts. /\n iconType?: EuiIconSignature['Args']['type'];\n /* Size of the icon. Defaults to `'l'`. /\n iconSize?: EuiIconSignature['Args']['size'];\n /* Same as `@titleElement`, limited to `EuiTitle`'s tags. Defaults to `'h3'`. /\n titleTagName?: EuiTitleSignature['Args']['tagName'];\n /* Size of the title, any `EuiTitle` size. Defaults to `'xxs'`. /\n titleSize?: EuiTitleSignature['Args']['size'];\n /\n Background of the group: `'none'`, `'light'` or `'dark'`.\n * Defaults to `'none'`.\n /\n background?: string;\n };\n Blocks: {\n /* Unused, use `<:title>` and `<:content>`. /\n default: [];\n /* The group's title; without it the group has no heading. /\n title: [];\n /* The group's links, e.g. an `EuiListGroup`. */\n content: [];\n };\n}\n\nconst EuiCollapsibleNavGroup: TemplateOnlyComponent<EuiCollapsibleNavGroupSignature> =\n <template>\n {{#let\n (argOrDefault @id (randomId)) (or @titleElement @titleTagName \"h3\")\n as \|groupID titleElement\|\n }}\n {{#let (concat groupID \"__title\") as \|titleID\|}}\n {{#if (and @isCollapsible (has-block \"title\"))}}\n <EuiAccordion\n id={{groupID}}\n class={{classNames\n (if (has-block \"title\") \"euiCollapsibleNavGroup--withHeading\")\n componentName=\"EuiCollapsibleNavGroup\"\n backgroundColor=(argOrDefault @background \"none\")\n }}\n @buttonClassName=\"euiCollapsibleNavGroup__heading\"\n @initialIsOpen={{argOrDefault @initialIsOpen true}}\n @arrowDisplay=\"right\"\n ...attributes\n >\n <:buttonContent>\n <EuiFlexGroup\n @gutterSize=\"m\"\n @alignItems=\"center\"\n @responsive={{false}}\n >\n {{#if @iconType}}\n <EuiFlexItem @grow={{false}}>\n <EuiIcon\n @type={{@iconType}}\n @size={{argOrDefault @iconSize \"l\"}}\n />\n </EuiFlexItem>\n {{/if}}\n <EuiFlexItem>\n {{#let (element titleElement) as \|TitleElement\|}}\n <TitleElement\n id={{titleID}}\n class={{classNames\n \"euiCollapsibleNavGroup__title\"\n componentName=\"EuiTitle\"\n size=(argOrDefault @titleSize \"xxs\")\n }}\n >\n {{yield to=\"title\"}}\n </TitleElement>\n {{/let}}\n </EuiFlexItem>\n </EuiFlexGroup>\n </:buttonContent>\n <:content>\n {{#if (has-block \"content\")}}\n <div class=\"euiCollapsibleNavGroup__children\">\n {{yield to=\"content\"}}\n </div>\n {{/if}}\n </:content>\n </EuiAccordion>\n {{else}}\n <div\n id={{groupID}}\n class={{classNames\n (if (has-block \"title\") \"euiCollapsibleNavGroup--withHeading\")\n componentName=\"EuiCollapsibleNavGroup\"\n backgroundColor=(argOrDefault @background \"none\")\n }}\n ...attributes\n >\n {{#if (has-block \"title\")}}\n <div class=\"euiCollapsibleNavGroup__heading\">\n <EuiFlexGroup\n @gutterSize=\"m\"\n @alignItems=\"center\"\n @responsive={{false}}\n >\n {{#if @iconType}}\n <EuiFlexItem @grow={{false}}>\n <EuiIcon\n @type={{@iconType}}\n @size={{argOrDefault @iconSize \"l\"}}\n />\n </EuiFlexItem>\n {{/if}}\n <EuiFlexItem>\n {{#let (element titleElement) as \|TitleElement\|}}\n <TitleElement\n id={{titleID}}\n class={{classNames\n \"euiCollapsibleNavGroup__title\"\n componentName=\"EuiTitle\"\n size=(argOrDefault @titleSize \"xxs\")\n }}\n >\n {{yield to=\"title\"}}\n </TitleElement>\n {{/let}}\n </EuiFlexItem>\n </EuiFlexGroup>\n </div>\n {{/if}}\n {{#if (has-block \"content\")}}\n <div class=\"euiCollapsibleNavGroup__children\">\n {{yield to=\"content\"}}\n </div>\n {{/if}}\n </div>\n {{/if}}\n {{/let}}\n {{/let}}\n </template>;\n\nexport default EuiCollapsibleNavGroup;\n"],"names":["EuiCollapsibleNavGroup","setComponentTemplate","precompileTemplate","strictMode","scope","argOrDefault","randomId","or","concat","and","EuiAccordion","classNames","EuiFlexGroup","EuiFlexItem","EuiIcon","element","templateOnly"],"mappings":";;;;;;;;;;;;;;AAwDA,MAAMA,sBAA8C,GAAAC,oBAAA,CAClDC,kBAAA,CAAA,u3FAAA,EA4GA;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,YAAA;IAAAC,QAAA;IAAAC,EAAA;IAAAC,MAAA;IAAAC,GAAA;kBAAAC,qBAAA;IAAAC,UAAA;IAAAC,YAAA;IAAAC,WAAA;IAAAC,OAAA;AAAAC,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA;;"}

package/dist/components/eui-collapsible-nav.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-collapsible-nav.js","sources":["../../src/components/eui-collapsible-nav.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { throttle } from '@ember/runloop';\n\nimport { modifier as modBuilder } from 'ember-modifier';\nimport { and, not, or } from 'ember-truth-helpers';\n\nimport randomId from '../-private/random-id.ts';\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport { isWithinMinBreakpoint } from '../utils/breakpoint.ts';\nimport EuiFlyout from './eui-flyout.gts';\n\nimport type { EuiBreakpointSize } from '../utils/breakpoint.ts';\nimport type { EuiFlyoutSignature } from './eui-flyout';\nimport type { ModifierLike } from '@glint/template';\n\nexport type EuiCollapsibleNavArgs = {\n id?: string;\n /*\n ReactNode to render as this component's content\n /\n children?: Component;\n /\n Shows the navigation flyout\n /\n isOpen?: boolean;\n /\n Keeps navigation flyout visible and push `<body>` content via padding\n /\n isDocked?: boolean;\n /\n Named breakpoint or pixel value for customizing the minimum window width to enable docking\n /\n dockedBreakpoint?: EuiBreakpointSize \| number;\n /\n Keeps the display of toggle button when in docked state\n */\n showButtonIfDocked?: boolean;\n\n as: string;\n\n size?: EuiFlyoutSignature['Args']['size'];\n\n side?: 'left' \| 'right';\n\n role?: null \| string;\n\n ownFocus?: boolean;\n\n outsideClickCloses?: boolean;\n\n closeButtonPosition?: 'outside' \| 'inside';\n\n paddingSize?: string;\n\n onClose: EuiFlyoutSignature['Args']['onClose'];\n};\n\nconst triggerHandlersModifier = modBuilder(\n (\n element: Element,\n _pos,\n { flyoutID, isOpen }: { flyoutID: string; isOpen: boolean }\n ) => {\n element.setAttribute('aria-controls', flyoutID);\n element.setAttribute('aria-expanded', isOpen ? 'true' : 'false');\n element.setAttribute('aria-pressed', isOpen ? 'true' : 'false');\n\n const fn = (e: Event) => {\n e.stopImmediatePropagation();\n };\n\n element.addEventListener('touchend', fn);\n element.addEventListener('mouseup', fn, true);\n\n return () => {\n element.removeEventListener('touchend', fn);\n element.removeEventListener('mouseup', fn, true);\n };\n }\n);\n\nconst onWindowResizeModifier = modBuilder(\n (\n _ele: HTMLElement,\n _pos,\n {\n isDocked = false,\n functionToCallOnWindowResize\n }: { isDocked?: boolean; functionToCallOnWindowResize: () => void }\n ) => {\n if (isDocked) {\n window.addEventListener('resize', functionToCallOnWindowResize);\n }\n\n return () => {\n if (isDocked) {\n window.removeEventListener('resize', functionToCallOnWindowResize);\n }\n };\n }\n);\n\nexport interface EuiCollapsibleNavSignature {\n Element: EuiFlyoutSignature['Element'];\n Args: EuiCollapsibleNavArgs;\n Blocks: {\n default: [];\n button: [\n ModifierLike<{\n Element: Element;\n }>\n ];\n content: [];\n };\n}\nexport default class EuiCollapsibleNavComponent extends Component<EuiCollapsibleNavSignature> {\n @tracked windowIsLargeEnoughToPush = isWithinMinBreakpoint(\n typeof window === 'undefined' ? -Infinity : window.innerWidth,\n this.dockedBreakpoint\n );\n\n get isDocked() {\n return this.args.isDocked ?? false;\n }\n\n get navIsDocked() {\n return this.isDocked && this.windowIsLargeEnoughToPush;\n }\n\n get dockedBreakpoint() {\n return this.args.dockedBreakpoint ?? 'l';\n }\n\n get showButtonIfDocked() {\n return this.args.showButtonIfDocked ?? false;\n }\n\n get as() {\n return this.args.as ?? 'nav';\n }\n\n get size() {\n if (this.args.size && typeof this.args.size !== 'string') {\n return `${this.args.size}px`;\n }\n\n return this.args.size ?? '320px';\n }\n\n get side() {\n return this.args.side ?? 'left';\n }\n\n get role() {\n return this.args.role ?? null;\n }\n\n get ownFocus() {\n return this.args.ownFocus ?? true;\n }\n\n get outsideClickCloses() {\n return this.args.outsideClickCloses ?? true;\n }\n\n get closeButtonPosition() {\n return this.args.closeButtonPosition ?? 'outside';\n }\n\n get paddingSize() {\n return this.args.paddingSize ?? 'none';\n }\n\n @action\n functionToCallOnWindowResize() {\n throttle(() => {\n if (isWithinMinBreakpoint(window.innerWidth, this.dockedBreakpoint)) {\n this.windowIsLargeEnoughToPush = true;\n } else {\n this.windowIsLargeEnoughToPush = false;\n }\n }, 50);\n }\n\n <template>\n <span\n {{onWindowResizeModifier\n isDocked=this.isDocked\n functionToCallOnWindowResize=this.functionToCallOnWindowResize\n }}\n ></span>\n {{#let (argOrDefault @id (randomId)) as \|flyoutID\|}}\n\n {{#if (not (and this.navIsDocked (not this.showButtonIfDocked)))}}\n {{yield\n (modifier triggerHandlersModifier isOpen=@isOpen flyoutID=flyoutID)\n to=\"button\"\n }}\n {{/if}}\n\n {{#if (or @isOpen this.navIsDocked)}}\n <EuiFlyout\n id={{flyoutID}}\n class=\"euiCollapsibleNav\"\n @as={{this.as}}\n @size={{this.size}}\n @side={{this.side}}\n @role={{this.role}}\n @ownFocus={{this.ownFocus}}\n @outsideClickCloses={{this.outsideClickCloses}}\n @closeButtonPosition={{this.closeButtonPosition}}\n @paddingSize={{this.paddingSize}}\n @type={{if this.navIsDocked \"push\" \"overlay\"}}\n @hideCloseButton={{this.navIsDocked}}\n @pushMinBreakpoint={{this.dockedBreakpoint}}\n @onClose={{@onClose}}\n ...attributes\n >\n {{yield to=\"content\"}}\n </EuiFlyout>\n {{/if}}\n {{/let}}\n </template>\n}\n"],"names":["triggerHandlersModifier","modBuilder","element","_pos","flyoutID","isOpen","setAttribute","fn","e","stopImmediatePropagation","addEventListener","removeEventListener","onWindowResizeModifier","_ele","isDocked","functionToCallOnWindowResize","window","EuiCollapsibleNavComponent","Component","g","prototype","tracked","isWithinMinBreakpoint","Infinity","innerWidth","dockedBreakpoint","i","args","navIsDocked","windowIsLargeEnoughToPush","showButtonIfDocked","as","size","side","role","ownFocus","outsideClickCloses","closeButtonPosition","paddingSize","throttle","n","action","setComponentTemplate","precompileTemplate","strictMode","scope","argOrDefault","randomId","not","and","or","EuiFlyout"],"mappings":"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"}
1	+ {"version":3,"file":"eui-collapsible-nav.js","sources":["../../src/components/eui-collapsible-nav.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { throttle } from '@ember/runloop';\n\nimport { modifier as modBuilder } from 'ember-modifier';\nimport { and, not, or } from 'ember-truth-helpers';\n\nimport randomId from '../-private/random-id.ts';\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport { isWithinMinBreakpoint } from '../utils/breakpoint.ts';\nimport EuiFlyout from './eui-flyout.gts';\n\nimport type { EuiBreakpointSize } from '../utils/breakpoint.ts';\nimport type { EuiFlyoutSignature } from './eui-flyout';\nimport type { ModifierLike } from '@glint/template';\n\nexport type EuiCollapsibleNavArgs = {\n /** Id of the nav flyout, which the button controls. Defaults to a random id. /\n id?: string;\n /\n @deprecated Has no effect, use the `<:content>` block.\n /\n children?: Component;\n /\n Shows the navigation flyout. Toggle it from the `<:button>` block's\n * button and set it to `false` in `@onClose`.\n /\n isOpen?: boolean;\n /\n Keeps navigation flyout visible and push `<body>` content via padding,\n * on windows at least `@dockedBreakpoint` wide. Defaults to `false`.\n /\n isDocked?: boolean;\n /\n Named breakpoint (`'xs'`, `'s'`, `'m'`, `'l'`, `'xl'`) or pixel value:\n * the minimum window width for docking. Defaults to `'l'`.\n /\n dockedBreakpoint?: EuiBreakpointSize \| number;\n /\n Keeps the display of toggle button when in docked state.\n * Defaults to `false`.\n /\n showButtonIfDocked?: boolean;\n /* Tag of the flyout. Defaults to `'nav'`. /\n as: string;\n /* Width of the nav, a number in px or any CSS width. Defaults to `320px`. /\n size?: EuiFlyoutSignature['Args']['size'];\n /* Side of the window: `'left'` or `'right'`. Defaults to `'left'`. /\n side?: 'left' \| 'right';\n /* `role` of the flyout. Defaults to none (the `<nav>` is a landmark). /\n role?: null \| string;\n /* Traps focus in the open (not docked) nav. Defaults to `true`. /\n ownFocus?: boolean;\n /* Clicking outside the open nav calls `@onClose`. Defaults to `true`. /\n outsideClickCloses?: boolean;\n /\n Close button `'outside'` or `'inside'` the flyout (hidden while docked).\n * Defaults to `'outside'`.\n /\n closeButtonPosition?: 'outside' \| 'inside';\n /* Padding inside the nav, any `EuiFlyout` padding size. Defaults to `'none'`. /\n paddingSize?: string;\n /* Called to close the nav (close button, Escape, outside click). /\n onClose: EuiFlyoutSignature['Args']['onClose'];\n};\n\nconst triggerHandlersModifier = modBuilder(\n (\n element: Element,\n _pos,\n { flyoutID, isOpen }: { flyoutID: string; isOpen: boolean }\n ) => {\n element.setAttribute('aria-controls', flyoutID);\n element.setAttribute('aria-expanded', isOpen ? 'true' : 'false');\n element.setAttribute('aria-pressed', isOpen ? 'true' : 'false');\n\n const fn = (e: Event) => {\n e.stopImmediatePropagation();\n };\n\n element.addEventListener('touchend', fn);\n element.addEventListener('mouseup', fn, true);\n\n return () => {\n element.removeEventListener('touchend', fn);\n element.removeEventListener('mouseup', fn, true);\n };\n }\n);\n\nconst onWindowResizeModifier = modBuilder(\n (\n _ele: HTMLElement,\n _pos,\n {\n isDocked = false,\n functionToCallOnWindowResize\n }: { isDocked?: boolean; functionToCallOnWindowResize: () => void }\n ) => {\n if (isDocked) {\n window.addEventListener('resize', functionToCallOnWindowResize);\n }\n\n return () => {\n if (isDocked) {\n window.removeEventListener('resize', functionToCallOnWindowResize);\n }\n };\n }\n);\n\nexport interface EuiCollapsibleNavSignature {\n Element: EuiFlyoutSignature['Element'];\n Args: EuiCollapsibleNavArgs;\n Blocks: {\n /* Unused, use `<:button>` and `<:content>`. /\n default: [];\n /\n The toggle button, usually an `EuiHeaderSectionItemButton`. Apply the\n * yielded modifier to it for the `aria-controls` / `aria-expanded`\n * attributes: `<:button as \|navButton\|><EuiButton {{navButton}} …>`.\n * Hidden while docked unless `@showButtonIfDocked`.\n /\n button: [\n ModifierLike<{\n Element: Element;\n }>\n ];\n /* The navigation, e.g. `EuiCollapsibleNavGroup`s and `EuiListGroup`s. */\n content: [];\n };\n}\nexport default class EuiCollapsibleNavComponent extends Component<EuiCollapsibleNavSignature> {\n @tracked windowIsLargeEnoughToPush = isWithinMinBreakpoint(\n typeof window === 'undefined' ? -Infinity : window.innerWidth,\n this.dockedBreakpoint\n );\n\n get isDocked() {\n return this.args.isDocked ?? false;\n }\n\n get navIsDocked() {\n return this.isDocked && this.windowIsLargeEnoughToPush;\n }\n\n get dockedBreakpoint() {\n return this.args.dockedBreakpoint ?? 'l';\n }\n\n get showButtonIfDocked() {\n return this.args.showButtonIfDocked ?? false;\n }\n\n get as() {\n return this.args.as ?? 'nav';\n }\n\n get size() {\n if (this.args.size && typeof this.args.size !== 'string') {\n return `${this.args.size}px`;\n }\n\n return this.args.size ?? '320px';\n }\n\n get side() {\n return this.args.side ?? 'left';\n }\n\n get role() {\n return this.args.role ?? null;\n }\n\n get ownFocus() {\n return this.args.ownFocus ?? true;\n }\n\n get outsideClickCloses() {\n return this.args.outsideClickCloses ?? true;\n }\n\n get closeButtonPosition() {\n return this.args.closeButtonPosition ?? 'outside';\n }\n\n get paddingSize() {\n return this.args.paddingSize ?? 'none';\n }\n\n @action\n functionToCallOnWindowResize() {\n throttle(() => {\n if (isWithinMinBreakpoint(window.innerWidth, this.dockedBreakpoint)) {\n this.windowIsLargeEnoughToPush = true;\n } else {\n this.windowIsLargeEnoughToPush = false;\n }\n }, 50);\n }\n\n <template>\n <span\n {{onWindowResizeModifier\n isDocked=this.isDocked\n functionToCallOnWindowResize=this.functionToCallOnWindowResize\n }}\n ></span>\n {{#let (argOrDefault @id (randomId)) as \|flyoutID\|}}\n\n {{#if (not (and this.navIsDocked (not this.showButtonIfDocked)))}}\n {{yield\n (modifier triggerHandlersModifier isOpen=@isOpen flyoutID=flyoutID)\n to=\"button\"\n }}\n {{/if}}\n\n {{#if (or @isOpen this.navIsDocked)}}\n <EuiFlyout\n id={{flyoutID}}\n class=\"euiCollapsibleNav\"\n @as={{this.as}}\n @size={{this.size}}\n @side={{this.side}}\n @role={{this.role}}\n @ownFocus={{this.ownFocus}}\n @outsideClickCloses={{this.outsideClickCloses}}\n @closeButtonPosition={{this.closeButtonPosition}}\n @paddingSize={{this.paddingSize}}\n @type={{if this.navIsDocked \"push\" \"overlay\"}}\n @hideCloseButton={{this.navIsDocked}}\n @pushMinBreakpoint={{this.dockedBreakpoint}}\n @onClose={{@onClose}}\n ...attributes\n >\n {{yield to=\"content\"}}\n </EuiFlyout>\n {{/if}}\n {{/let}}\n </template>\n}\n"],"names":["triggerHandlersModifier","modBuilder","element","_pos","flyoutID","isOpen","setAttribute","fn","e","stopImmediatePropagation","addEventListener","removeEventListener","onWindowResizeModifier","_ele","isDocked","functionToCallOnWindowResize","window","EuiCollapsibleNavComponent","Component","g","prototype","tracked","isWithinMinBreakpoint","Infinity","innerWidth","dockedBreakpoint","i","args","navIsDocked","windowIsLargeEnoughToPush","showButtonIfDocked","as","size","side","role","ownFocus","outsideClickCloses","closeButtonPosition","paddingSize","throttle","n","action","setComponentTemplate","precompileTemplate","strictMode","scope","argOrDefault","randomId","not","and","or","EuiFlyout"],"mappings":"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"}

package/dist/components/eui-color-palette-display.js ADDED Viewed

@@ -0,0 +1,39 @@
+import { hash } from '@ember/helper';
+import { getFixedLinearGradient, getLinearGradient } from '../-private/color.js';
+import cssStyle from '../-private/css-style.js';
+import EuiScreenReaderOnly from './eui-screen-reader-only.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+import templateOnly from '@ember/component/template-only';
+const SIZES = {
+  xs: 'euiColorPaletteDisplay--sizeExtraSmall',
+  s: 'euiColorPaletteDisplay--sizeSmall',
+  m: 'euiColorPaletteDisplay--sizeMedium'
+};
+/**
+ * Shows a color palette as a bar: `'fixed'` blocks of solid color or a
+ * `'gradient'`, e.g. to preview the palette of a chart.
+ */
+function classes(size = 's') {
+  return `euiColorPaletteDisplay ${SIZES[size]}`;
+}
+function isGradient(type) {
+  return type === 'gradient';
+}
+const EuiColorPaletteDisplay = setComponentTemplate(precompileTemplate("{{#if (isGradient @type)}}\n  {{#if @title}}\n    <EuiScreenReaderOnly>{{@title}}</EuiScreenReaderOnly>\n  {{/if}}\n  <span class={{classes @size}} aria-hidden=\"true\" style={{cssStyle (hash background=(getLinearGradient @palette))}} ...attributes></span>\n{{else}}\n  <span class={{classes @size}} ...attributes>\n    {{#if @title}}\n      <EuiScreenReaderOnly>{{@title}}</EuiScreenReaderOnly>\n    {{/if}}\n    <span aria-hidden=\"true\" class=\"euiColorPaletteDisplayFixed__bleedArea\">\n      {{#each (getFixedLinearGradient @palette) as |item|}}\n        <span style={{cssStyle (hash backgroundColor=item.color width=item.width)}}></span>\n      {{/each}}\n    </span>\n  </span>\n{{/if}}", {
+  strictMode: true,
+  scope: () => ({
+    isGradient,
+    EuiScreenReaderOnly,
+    classes,
+    cssStyle,
+    hash,
+    getLinearGradient,
+    getFixedLinearGradient
+  })
+}), templateOnly());
+export { EuiColorPaletteDisplay as default };
+//# sourceMappingURL=eui-color-palette-display.js.map

package/dist/components/eui-color-palette-display.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"eui-color-palette-display.js","sources":["../../src/components/eui-color-palette-display.gts"],"sourcesContent":["import { hash } from '@ember/helper';\n\nimport { getFixedLinearGradient, getLinearGradient } from '../-private/color.ts';\nimport cssStyle from '../-private/css-style.ts';\nimport EuiScreenReaderOnly from './eui-screen-reader-only.gts';\n\nimport type { ColorStop } from '../-private/color.ts';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\nconst SIZES = {\n xs: 'euiColorPaletteDisplay--sizeExtraSmall',\n s: 'euiColorPaletteDisplay--sizeSmall',\n m: 'euiColorPaletteDisplay--sizeMedium'\n};\n\n/**\n * Shows a color palette as a bar: `'fixed'` blocks of solid color or a\n * `'gradient'`, e.g. to preview the palette of a chart.\n */\nexport interface EuiColorPaletteDisplaySignature {\n Element: HTMLSpanElement;\n Args: {\n /**\n * The colors: an array of colors (evenly spread), or of\n * `{ stop, color }` color stops.\n */\n palette: (string | ColorStop)[];\n /** `'fixed'` (solid blocks) or `'gradient'`. Defaults to `'fixed'`. */\n type?: 'fixed' | 'gradient';\n /** Height of the bar: `'xs'`, `'s'` or `'m'`. Defaults to `'s'`. */\n size?: 'xs' | 's' | 'm';\n /** Name of the palette, read by screen readers. */\n title?: string;\n };\n}\n\nfunction classes(size: keyof typeof SIZES = 's'): string {\n return `euiColorPaletteDisplay ${SIZES[size]}`;\n}\n\nfunction isGradient(type?: string): boolean {\n return type === 'gradient';\n}\n\nconst EuiColorPaletteDisplay: TemplateOnlyComponent<EuiColorPaletteDisplaySignature> =\n <template>\n {{#if (isGradient @type)}}\n {{#if @title}}\n <EuiScreenReaderOnly>{{@title}}</EuiScreenReaderOnly>\n {{/if}}\n <span\n class={{classes @size}}\n aria-hidden=\"true\"\n style={{cssStyle (hash background=(getLinearGradient @palette))}}\n ...attributes\n ></span>\n {{else}}\n <span class={{classes @size}} ...attributes>\n {{#if @title}}\n <EuiScreenReaderOnly>{{@title}}</EuiScreenReaderOnly>\n {{/if}}\n <span aria-hidden=\"true\" class=\"euiColorPaletteDisplayFixed__bleedArea\">\n {{#each (getFixedLinearGradient @palette) as |item|}}\n <span\n style={{cssStyle\n (hash backgroundColor=item.color width=item.width)\n }}\n ></span>\n {{/each}}\n </span>\n </span>\n {{/if}}\n </template>;\n\nexport default EuiColorPaletteDisplay;\n"],"names":["SIZES","xs","s","m","classes","size","isGradient","type","EuiColorPaletteDisplay","setComponentTemplate","precompileTemplate","strictMode","scope","EuiScreenReaderOnly","cssStyle","hash","getLinearGradient","getFixedLinearGradient","templateOnly"],"mappings":";;;;;;;;AASA,MAAMA,KAAA,GAAQ;AACZC,EAAAA,EAAA,EAAI,wCAAA;AACJC,EAAAA,CAAA,EAAG,mCAAA;AACHC,EAAAA,CAAA,EAAG;AACL,CAAA;AAEA;;;AAGC;;AAkBD,SAASC,OAAAA,CAAQC,IAAmB,GAAQ,GAAG,EAAS;AACtD,EAAA,OAAO,CAAA,uBAAA,EAA0BL,KAAK,CAACK,KAAK,CAAA,CAAE;AAChD;AAEA,SAASC,UAAAA,CAAWC,IAAa,EAAU;EACzC,OAAOA,IAAA,KAAS,UAAA;AAClB;AAEA,MAAMC,sBAA8C,GAAAC,oBAAA,CAClDC,kBAAA,CAAA,wrBAAA,EA2BA;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAN,UAAA;IAAAO,mBAAA;IAAAT,OAAA;IAAAU,QAAA;IAAAC,IAAA;IAAAC,iBAAA;AAAAC,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA;;"}

package/dist/components/eui-color-palette-picker.js ADDED Viewed

@@ -0,0 +1,48 @@
+import Component from '@glimmer/component';
+import EuiColorPaletteDisplay from './eui-color-palette-display.js';
+import EuiSuperSelect from './eui-super-select.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+/**
+ * A select of color palettes (e.g. for charts), showing each palette as a
+ * bar of colors. Built on `EuiSuperSelect`.
+ */
+class EuiColorPalettePicker extends Component {
+  get options() {
+    return this.args.palettes.map(palette => ({
+      value: String(palette.value),
+      inputDisplay: palette.title,
+      palette
+    }));
+  }
+  showTitleOnly = palette => palette.type === 'text' || this.args.selectionDisplay === 'title';
+  static {
+    setComponentTemplate(precompileTemplate("<EuiSuperSelect @options={{this.options}} @valueOfSelected={{@valueOfSelected}} @onChange={{@onChange}} @hasDividers={{true}} @compressed={{@compressed}} @fullWidth={{@fullWidth}} @isInvalid={{@isInvalid}} @isLoading={{@isLoading}} ...attributes>\n  <:inputDisplay as |option|>\n    {{#let (paletteOf option) as |palette|}}\n      {{#if (this.showTitleOnly palette)}}\n        {{palette.title}}\n      {{else}}\n        <EuiColorPaletteDisplay @type={{fixedOrGradient palette.type}} @palette={{paletteColors palette}} @title={{palette.title}} />\n      {{/if}}\n    {{/let}}\n  </:inputDisplay>\n  <:dropdownDisplay as |option|>\n    {{#let (paletteOf option) as |palette|}}\n      <div class=\"euiColorPalettePicker__item\">\n        {{#if (isText palette.type)}}\n          {{palette.title}}\n        {{else}}\n          {{#if palette.title}}\n            {{!-- the display's screen reader title names the option --}}\n            <div aria-hidden=\"true\" class=\"euiColorPalettePicker__itemTitle\">{{palette.title}}</div>\n          {{/if}}\n          <EuiColorPaletteDisplay @type={{fixedOrGradient palette.type}} @palette={{paletteColors palette}} @title={{palette.title}} />\n        {{/if}}\n      </div>\n    {{/let}}\n  </:dropdownDisplay>\n</EuiSuperSelect>", {
+      strictMode: true,
+      scope: () => ({
+        EuiSuperSelect,
+        paletteOf,
+        EuiColorPaletteDisplay,
+        fixedOrGradient,
+        paletteColors,
+        isText
+      })
+    }), this);
+  }
+}
+function paletteOf(option) {
+  return option.palette;
+}
+function paletteColors(palette) {
+  return palette.palette ?? [];
+}
+function fixedOrGradient(type) {
+  return type === 'gradient' ? 'gradient' : 'fixed';
+}
+function isText(type) {
+  return type === 'text';
+}
+export { EuiColorPalettePicker as default };
+//# sourceMappingURL=eui-color-palette-picker.js.map

package/dist/components/eui-color-palette-picker.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"eui-color-palette-picker.js","sources":["../../src/components/eui-color-palette-picker.gts"],"sourcesContent":["import Component from '@glimmer/component';\n\nimport EuiColorPaletteDisplay from './eui-color-palette-display.gts';\nimport EuiSuperSelect from './eui-super-select.gts';\n\nimport type { ColorStop } from '../-private/color.ts';\nimport type { EuiSuperSelectOption } from './eui-super-select';\n\nexport interface EuiColorPalettePickerPalette {\n /** The value passed to `@onChange` when chosen. */\n value: string;\n /** Name of the palette. */\n title?: string;\n /**\n * `'fixed'` (solid blocks), `'gradient'`, or `'text'` for an option\n * that is only its title (e.g. \"Custom\").\n */\n type: 'fixed' | 'gradient' | 'text';\n /** The colors or `{ stop, color }` stops (not for `'text'`). */\n palette?: (string | ColorStop)[];\n}\n\n/**\n * A select of color palettes (e.g. for charts), showing each palette as a\n * bar of colors. Built on `EuiSuperSelect`.\n */\nexport interface EuiColorPalettePickerSignature {\n Element: HTMLButtonElement;\n Args: {\n /** The palettes to choose from. */\n palettes: EuiColorPalettePickerPalette[];\n /** Value of the selected palette. */\n valueOfSelected?: string;\n /** Called with the chosen palette's value. */\n onChange: (value: string) => void;\n /**\n * Show the selected palette as its `'palette'` (colors) or its\n * `'title'`. Defaults to `'palette'`.\n */\n selectionDisplay?: 'palette' | 'title';\n /** Smaller, for dense forms. */\n compressed?: boolean;\n /** Takes the container's full width. */\n fullWidth?: boolean;\n /** Invalid look. */\n isInvalid?: boolean;\n /** Shows a spinner. */\n isLoading?: boolean;\n };\n}\n\ntype PaletteOption = EuiSuperSelectOption & { palette: EuiColorPalettePickerPalette };\n\nexport default class EuiColorPalettePicker extends Component<EuiColorPalettePickerSignature> {\n get options(): PaletteOption[] {\n return this.args.palettes.map((palette) => ({\n value: String(palette.value),\n inputDisplay: palette.title,\n palette\n }));\n }\n\n showTitleOnly = (palette: EuiColorPalettePickerPalette): boolean =>\n palette.type === 'text' || this.args.selectionDisplay === 'title';\n\n <template>\n <EuiSuperSelect\n @options={{this.options}}\n @valueOfSelected={{@valueOfSelected}}\n @onChange={{@onChange}}\n @hasDividers={{true}}\n @compressed={{@compressed}}\n @fullWidth={{@fullWidth}}\n @isInvalid={{@isInvalid}}\n @isLoading={{@isLoading}}\n ...attributes\n >\n <:inputDisplay as |option|>\n {{#let (paletteOf option) as |palette|}}\n {{#if (this.showTitleOnly palette)}}\n {{palette.title}}\n {{else}}\n <EuiColorPaletteDisplay\n @type={{fixedOrGradient palette.type}}\n @palette={{paletteColors palette}}\n @title={{palette.title}}\n />\n {{/if}}\n {{/let}}\n </:inputDisplay>\n <:dropdownDisplay as |option|>\n {{#let (paletteOf option) as |palette|}}\n <div class=\"euiColorPalettePicker__item\">\n {{#if (isText palette.type)}}\n {{palette.title}}\n {{else}}\n {{#if palette.title}}\n {{! the display's screen reader title names the option }}\n <div aria-hidden=\"true\" class=\"euiColorPalettePicker__itemTitle\">{{palette.title}}</div>\n {{/if}}\n <EuiColorPaletteDisplay\n @type={{fixedOrGradient palette.type}}\n @palette={{paletteColors palette}}\n @title={{palette.title}}\n />\n {{/if}}\n </div>\n {{/let}}\n </:dropdownDisplay>\n </EuiSuperSelect>\n </template>\n}\n\nfunction paletteOf(option: EuiSuperSelectOption<unknown>): EuiColorPalettePickerPalette {\n return (option as PaletteOption).palette;\n}\n\nfunction paletteColors(palette: EuiColorPalettePickerPalette): (string | ColorStop)[] {\n return palette.palette ?? [];\n}\n\nfunction fixedOrGradient(type: string): 'fixed' | 'gradient' {\n return type === 'gradient' ? 'gradient' : 'fixed';\n}\n\nfunction isText(type: string): boolean {\n return type === 'text';\n}\n"],"names":["EuiColorPalettePicker","Component","options","args","palettes","map","palette","value","String","inputDisplay","title","showTitleOnly","type","selectionDisplay","setComponentTemplate","precompileTemplate","strictMode","scope","EuiSuperSelect","paletteOf","EuiColorPaletteDisplay","fixedOrGradient","paletteColors","isText","option"],"mappings":";;;;;;AAsBA;;;AAGC;AA4Bc,MAAMA,8BAA8BC,SAAA,CAAU;EAC3D,IAAIC,UAA2B;IAC7B,OAAO,IAAI,CAACC,IAAI,CAACC,QAAQ,CAACC,GAAG,CAAEC,OAAA,KAAa;AAC1CC,MAAAA,KAAA,EAAOC,MAAA,CAAOF,QAAQC,KAAK,CAAA;MAC3BE,YAAA,EAAcH,QAAQI,KAAK;AAC3BJ,MAAAA;AACF,KAAC,CAAA,CAAA;AACH,EAAA;AAEAK,EAAAA,aAAA,GAAiBL,OAAS,IACxBA,OAAA,CAAQM,IAAI,KAAK,MAAA,IAAU,IAAI,CAACT,IAAI,CAACU,gBAAgB,KAAK,OAAA;AAE5D,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAAA,svCAAA,EA6CA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;QAAAC,cAAA;QAAAC,SAAA;QAAAC,sBAAA;QAAAC,eAAA;QAAAC,aAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;AAEA,SAASJ,SAAAA,CAAUK,MAAqC,EAAG;EACzD,OAAQA,MAAA,CAAyBlB,OAAO;AAC1C;AAEA,SAASgB,aAAAA,CAAchB,OAAqC,EAAa;AACvE,EAAA,OAAOA,OAAA,CAAQA,OAAO,IAAI,EAAE;AAC9B;AAEA,SAASe,eAAAA,CAAgBT,IAAY,EAAa;AAChD,EAAA,OAAOA,IAAA,KAAS,aAAa,UAAA,GAAa,OAAA;AAC5C;AAEA,SAASW,MAAAA,CAAOX,IAAY,EAAU;EACpC,OAAOA,IAAA,KAAS,MAAA;AAClB;;"}

package/dist/components/eui-color-picker-swatch.js ADDED Viewed

@@ -0,0 +1,35 @@
+import Component from '@glimmer/component';
+import { hash } from '@ember/helper';
+import { service } from '@ember/service';
+import { getChromaColor } from '../-private/color.js';
+import cssStyle from '../-private/css-style.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+import { g, i } from 'decorator-transforms/runtime-esm';
+class EuiColorPickerSwatch extends Component {
+  static {
+    g(this.prototype, "euiI18n", [service]);
+  }
+  #euiI18n = (i(this, "euiI18n"), void 0);
+  get background() {
+    return getChromaColor(this.args.color, true)?.css() ?? 'transparent';
+  }
+  get label() {
+    return this.euiI18n.lookupToken('euiColorPickerSwatch.ariaLabel', 'Select {color} as the color', {
+      color: this.args.color
+    });
+  }
+  static {
+    setComponentTemplate(precompileTemplate("<button type=\"button\" class=\"euiColorPickerSwatch\" aria-label={{this.label}} style={{cssStyle (hash background=this.background)}} ...attributes></button>", {
+      strictMode: true,
+      scope: () => ({
+        cssStyle,
+        hash
+      })
+    }), this);
+  }
+}
+export { EuiColorPickerSwatch as default };
+//# sourceMappingURL=eui-color-picker-swatch.js.map

package/dist/components/eui-color-picker-swatch.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"eui-color-picker-swatch.js","sources":["../../src/components/eui-color-picker-swatch.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { hash } from '@ember/helper';\nimport { service } from '@ember/service';\n\nimport { getChromaColor } from '../-private/color.ts';\nimport cssStyle from '../-private/css-style.ts';\n\nimport type EuiI18n from '../services/eui-i18n';\n\n/**\n * A button showing a color, to pick it; the swatches of `EuiColorPicker`.\n * Add `{{on \"click\" …}}` to handle the choice.\n */\nexport interface EuiColorPickerSwatchSignature {\n Element: HTMLButtonElement;\n Args: {\n /** The color: a hex string or `'r, g, b(, a)'`. */\n color?: string;\n };\n}\n\nexport default class EuiColorPickerSwatch extends Component<EuiColorPickerSwatchSignature> {\n @service declare euiI18n: EuiI18n;\n\n get background(): string {\n return getChromaColor(this.args.color, true)?.css() ?? 'transparent';\n }\n\n get label(): string {\n return this.euiI18n.lookupToken('euiColorPickerSwatch.ariaLabel', 'Select {color} as the color', {\n color: this.args.color\n });\n }\n\n <template>\n <button\n type=\"button\"\n class=\"euiColorPickerSwatch\"\n aria-label={{this.label}}\n style={{cssStyle (hash background=this.background)}}\n ...attributes\n ></button>\n </template>\n}\n"],"names":["EuiColorPickerSwatch","Component","g","prototype","service","i","background","getChromaColor","args","color","css","label","euiI18n","lookupToken","setComponentTemplate","precompileTemplate","strictMode","scope","cssStyle","hash"],"mappings":";;;;;;;;;AAqBe,MAAMA,6BAA6BC,SAAA,CAAU;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CACzDC,OAAA,CAAA,CAAA;AAAA;EAAA,QAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,SAAA,CAAA,EAAA,MAAA;EAED,IAAIC,UAAAA,GAAqB;AACvB,IAAA,OAAOC,cAAA,CAAe,IAAI,CAACC,IAAI,CAACC,KAAK,EAAE,OAAOC,GAAA,EAAA,IAAS,aAAA;AACzD,EAAA;EAEA,IAAIC,KAAAA,GAAgB;IAClB,OAAO,IAAI,CAACC,OAAO,CAACC,WAAW,CAAC,kCAAkC,6BAAA,EAA+B;AAC/FJ,MAAAA,KAAA,EAAO,IAAI,CAACD,IAAI,CAACC;AACnB,KAAA,CAAA;AACF,EAAA;AAEA,EAAA;IAAAK,oBAAA,CAAAC,kBAAA,CAAA,+JAAA,EAQA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;QAAAC,QAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;;"}