@pega/cosmos-react-build 10.0.0-build.4.2 → 10.0.0-build.4.21
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.
- package/lib/components/AppShell/Header/AppHeader.d.ts.map +1 -1
- package/lib/components/AppShell/Header/AppHeader.js +1 -1
- package/lib/components/AppShell/Header/AppHeader.js.map +1 -1
- package/lib/components/AuthoringPanel/AuthoringPanel.styles.d.ts +2 -2
- package/lib/components/AuthoringPanel/AuthoringPanel.styles.d.ts.map +1 -1
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.d.ts.map +1 -1
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.js +76 -13
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.js.map +1 -1
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.styles.d.ts.map +1 -1
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.styles.js +0 -6
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.styles.js.map +1 -1
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.types.d.ts +9 -1
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.types.d.ts.map +1 -1
- package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.types.js.map +1 -1
- package/lib/components/ExpressionBuilder/CodeEditor/formatCSS.d.ts +3 -0
- package/lib/components/ExpressionBuilder/CodeEditor/formatCSS.d.ts.map +1 -0
- package/lib/components/ExpressionBuilder/CodeEditor/formatCSS.js +30 -0
- package/lib/components/ExpressionBuilder/CodeEditor/formatCSS.js.map +1 -0
- package/lib/components/ExpressionBuilder/ExpressionBuilder.styles.d.ts.map +1 -1
- package/lib/components/ExpressionBuilder/index.d.ts +1 -0
- package/lib/components/ExpressionBuilder/index.d.ts.map +1 -1
- package/lib/components/ExpressionBuilder/index.js +1 -0
- package/lib/components/ExpressionBuilder/index.js.map +1 -1
- package/lib/components/FieldReference/FieldReference.styles.d.ts.map +1 -1
- package/lib/components/FieldReference/FieldReference.types.d.ts +1 -3
- package/lib/components/FieldReference/FieldReference.types.d.ts.map +1 -1
- package/lib/components/FieldReference/FieldReference.types.js.map +1 -1
- package/lib/components/FieldReference/FieldReferenceDisplay.js +1 -1
- package/lib/components/FieldReference/FieldReferenceDisplay.js.map +1 -1
- package/lib/components/FieldReference/FieldReferenceInput.d.ts.map +1 -1
- package/lib/components/FieldReference/FieldReferenceInput.js +6 -1
- package/lib/components/FieldReference/FieldReferenceInput.js.map +1 -1
- package/lib/components/LifeCycle/LifeCycle.types.d.ts +11 -0
- package/lib/components/LifeCycle/LifeCycle.types.d.ts.map +1 -1
- package/package.json +5 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeEditor.styles.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { createGlobalStyle, css } from 'styled-components';\nimport { mix, transparentize } from 'polished';\n\nimport { defaultThemeProp, calculateFontSize, Flex, Icon } from '@pega/cosmos-react-core';\nimport { StyledFormField } from '@pega/cosmos-react-core/lib/components/FormField/FormField';\n\nimport type { CodeEditorProps, SuggestionType } from './CodeEditor.types';\n\nconst primaryBackground = 'primary-background';\nconst contentWidth = 'content-width';\n\nexport const StyledLoading = styled.div`\n font-size: 1.5rem;\n`;\n\nexport const StyledWarnIcon = styled(Icon)(({ theme }) => {\n return css`\n color: ${theme.base.palette.urgent};\n `;\n});\n\nStyledWarnIcon.defaultProps = defaultThemeProp;\n\nexport const StyledPopover = styled.div(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n font-size: ${fontSize.xxs};\n max-width: ${theme.base[contentWidth].sm};\n padding: ${theme.base.spacing};\n white-space: pre-line;\n word-break: break-word;\n pointer-events: none;\n `;\n});\n\nStyledPopover.defaultProps = defaultThemeProp;\n\nexport const StyledList = styled.div(({ theme }) => {\n return css`\n padding-inline-start: calc(0.25 * ${theme.base.spacing});\n `;\n});\nStyledList.defaultProps = defaultThemeProp;\n\nexport const StyledCodeEditor = styled(Flex)<\n Pick<CodeEditorProps, 'showEditorOnly' | 'editorConfigProps' | 'isSingleLine'> & {\n isLoading?: boolean;\n errors?: string;\n readOnly?: boolean;\n suggestions: SuggestionType[];\n }\n>(({\n theme: {\n base,\n components: {\n 'form-control': {\n 'background-color': formControlBgColor,\n ':read-only': { 'background-color': readOnlyBackgroundColor }\n },\n 'form-field': {\n error: { 'status-color': errorBackground }\n },\n input\n }\n },\n errors,\n readOnly,\n showEditorOnly,\n editorConfigProps,\n isSingleLine = false\n}) => {\n const jsonMode = editorConfigProps?.mode === 'application/json';\n\n return css`\n width: 100%;\n ${showEditorOnly &&\n css`\n max-height: 10rem;\n width: 27vw;\n `}\n position: relative;\n ${!showEditorOnly &&\n css`\n max-height: 100%;\n `}\n overflow-y: auto;\n ${StyledFormField} {\n flex-grow: 1;\n }\n\n /* PADDING */\n .react-codemirror2 {\n flex-grow: 1;\n ${isSingleLine\n ? css`\n min-height: ${input.height};\n & * {\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n }\n `\n : css`\n min-height: 3.75rem;\n `}\n overflow-y: auto;\n ${readOnly &&\n !jsonMode &&\n css`\n max-height: 5.625rem;\n `}\n }\n\n .CodeMirror-placeholder {\n opacity: ${base.transparency['transparent-3']};\n }\n\n .CodeMirror-lines {\n cursor: text;\n min-height: 0.063rem; /* prevents collapsing before first draw */\n padding: ${base.spacing} 0;\n }\n\n ${editorConfigProps?.theme === 'eclipse' &&\n css`\n .cm-s-eclipse {\n .cm-string {\n color: ${base.palette.pending};\n &.cm-property {\n color: ${base.palette['foreground-color']};\n }\n }\n .cm-operator {\n color: ${base.palette.info};\n }\n .cm-variable,\n .cm-variable-2,\n .cm-variable-3 {\n color: ${base.palette['foreground-color']};\n }\n .cm-atom,\n .cm-keyword {\n color: ${base.palette.warn};\n }\n .cm-number {\n color: ${base.palette.success};\n }\n }\n `}\n\n .CodeMirror-scrollbar-filler,\n .CodeMirror-gutter-filler {\n background-color: ${base.palette[\n 'primary-background'\n ]}; /* The little square between H and V scrollbars */\n }\n\n /* GUTTER */\n\n .CodeMirror-gutters {\n position: absolute;\n left: 0;\n top: 0;\n min-height: 100%;\n z-index: 3;\n border-right: 0.063rem solid ${base.palette['border-line']};\n background-color: ${base.palette['secondary-background']};\n white-space: nowrap;\n }\n .CodeMirror-linenumber {\n padding: 0 0.125rem 0 0.313rem;\n min-width: 1.25rem;\n text-align: right;\n color: ${transparentize(0.5, base.palette['foreground-color'])};\n white-space: nowrap;\n }\n\n .CodeMirror-guttermarker {\n color: ${base.palette['foreground-color']};\n }\n .CodeMirror-guttermarker-subtle {\n color: ${transparentize(0.5, base.palette['foreground-color'])};\n }\n\n /* CURSOR */\n\n .CodeMirror-cursor {\n position: absolute;\n pointer-events: none;\n border-left: 0.0625rem solid ${base.palette.interactive};\n border-right: none;\n width: 0;\n ${readOnly &&\n css`\n display: none;\n `}\n }\n\n /* Shown when moving in bi-directional text */\n .CodeMirror div.CodeMirror-secondarycursor {\n border-left: 0.063rem solid ${base.palette['secondary-background']};\n }\n .cm-fat-cursor-mark {\n background-color: rgba(20, 255, 20, 0.5);\n -webkit-animation: blink 1.06s steps(1) infinite;\n -moz-animation: blink 1.06s steps(1) infinite;\n animation: blink 1.06s steps(1) infinite;\n }\n .cm-animate-fat-cursor {\n width: auto;\n border: 0;\n -webkit-animation: blink 1.06s steps(1) infinite;\n -moz-animation: blink 1.06s steps(1) infinite;\n animation: blink 1.06s steps(1) infinite;\n background-color: #77ee77;\n }\n @-moz-keyframes blink {\n 50% {\n background-color: transparent;\n }\n }\n @-webkit-keyframes blink {\n 50% {\n background-color: transparent;\n }\n }\n @keyframes blink {\n 50% {\n background-color: transparent;\n }\n }\n\n .cm-tab {\n display: inline-block;\n text-decoration: inherit;\n }\n\n .CodeMirror-rulers {\n position: absolute;\n left: 0;\n right: 0;\n top: -3.125rem;\n bottom: 0;\n overflow: hidden;\n }\n .CodeMirror-ruler {\n border-left: 0.063rem solid ${base.palette['border-line']};\n top: 0;\n bottom: 0;\n position: absolute;\n }\n\n /* DEFAULT THEME */\n\n .cm-s-default .cm-header {\n color: blue;\n }\n .cm-negative {\n color: #dd4444;\n }\n .cm-positive {\n color: #229922;\n }\n .cm-strong {\n font-weight: bold;\n }\n .cm-s-default .cm-quote {\n color: #009900;\n }\n .cm-em {\n font-style: italic;\n }\n .cm-link {\n text-decoration: underline;\n }\n .cm-strikethrough {\n text-decoration: line-through;\n }\n\n .cm-s-default .cm-keyword {\n color: #770088;\n }\n .cm-s-default .cm-atom {\n color: #221199;\n }\n .cm-s-default .cm-number {\n color: #116644;\n }\n .cm-s-default .cm-def {\n color: #0000ff;\n }\n .cm-s-default .cm-variable-2 {\n color: #0055aa;\n }\n .cm-s-default .cm-variable-3,\n .cm-s-default .cm-type {\n color: #008855;\n }\n .cm-s-default .cm-comment {\n color: #aa5500;\n }\n .cm-s-default .cm-string {\n color: #aa1111;\n }\n .cm-s-default .cm-string-2 {\n color: #ff5500;\n }\n .cm-s-default .cm-meta {\n color: #555555;\n }\n .cm-s-default .cm-qualifier {\n color: #555555;\n }\n .cm-s-default .cm-builtin {\n color: #3300aa;\n }\n .cm-s-default .cm-bracket {\n color: ${base.palette.skeleton};\n }\n .cm-s-default .cm-tag {\n color: ${base.palette.info};\n }\n .cm-s-default .cm-attribute {\n color: ${base.palette.interactive};\n }\n .cm-s-default .cm-hr {\n color: ${base.palette['border-line']};\n }\n .cm-s-default .cm-link {\n color: ${base.palette.interactive};\n }\n\n .cm-s-default .cm-error {\n color: ${base.palette.urgent};\n }\n .cm-invalidchar {\n color: ${base.palette.urgent};\n }\n\n .CodeMirror-composing {\n border-bottom: 0.125rem solid;\n }\n\n /* Default styles for common addons */\n\n div.CodeMirror span.CodeMirror-matchingbracket {\n color: ${base.palette.success} !important;\n outline: 0.0625rem dotted ${base.palette.success};\n }\n div.CodeMirror span.CodeMirror-nonmatchingbracket {\n color: ${base.palette.urgent} !important;\n outline: 0.0625rem dotted ${base.palette.urgent};\n }\n .CodeMirror-matchingtag {\n background: ${transparentize(0.5, base.palette.warn)};\n }\n .CodeMirror-activeline-background {\n background: ${base.palette['secondary-background']};\n }\n\n /* STOP */\n\n /* The rest of this file contains styles related to the mechanics of\n the editor. You probably shouldn't touch them. */\n\n .CodeMirror-scroll {\n overflow: scroll !important;\n margin-bottom: -3.125rem;\n margin-right: -3.125rem;\n padding-bottom: 3.125rem;\n height: 100%;\n outline: none; /* Prevent dragging from highlighting the element */\n position: relative;\n }\n .CodeMirror-sizer {\n position: relative;\n border-right: 3.125rem solid transparent;\n }\n\n /* The fake, visible scrollbars. Used to force redraw during scrolling\n before actual scrolling happens, thus preventing shaking and\n flickering artifacts. */\n .CodeMirror-vscrollbar,\n .CodeMirror-hscrollbar,\n .CodeMirror-scrollbar-filler,\n .CodeMirror-gutter-filler {\n position: absolute;\n z-index: 6;\n display: none;\n }\n .CodeMirror-vscrollbar {\n right: 0;\n top: 0;\n overflow-x: hidden;\n overflow-y: scroll;\n }\n .CodeMirror-hscrollbar {\n bottom: 0;\n left: 0;\n overflow-y: hidden;\n overflow-x: scroll;\n }\n .CodeMirror-scrollbar-filler {\n right: 0;\n bottom: 0;\n }\n .CodeMirror-gutter-filler {\n left: 0;\n bottom: 0;\n }\n .CodeMirror-gutter {\n white-space: normal;\n height: 100%;\n display: inline-block;\n vertical-align: top;\n margin-bottom: -3.125rem;\n }\n .CodeMirror-gutter-wrapper {\n position: absolute;\n z-index: 4;\n background: none !important;\n border: none !important;\n }\n .CodeMirror-gutter-background {\n position: absolute;\n top: 0;\n bottom: 0;\n z-index: 4;\n }\n .CodeMirror-gutter-elt {\n position: absolute;\n cursor: default;\n z-index: 4;\n }\n .CodeMirror-gutter-wrapper ::selection {\n background-color: transparent;\n }\n .CodeMirror-gutter-wrapper ::-moz-selection {\n background-color: transparent;\n }\n\n .CodeMirror pre.CodeMirror-line,\n .CodeMirror pre.CodeMirror-line-like {\n /* Reset some styles that the rest of the page might have set */\n -moz-border-radius: 0;\n -webkit-border-radius: 0;\n border-radius: 0;\n border-width: 0;\n background: transparent;\n font-family: inherit;\n font-size: inherit;\n margin: 0;\n white-space: pre;\n word-wrap: normal;\n line-height: inherit;\n color: inherit;\n z-index: 2;\n position: relative;\n overflow: visible;\n -webkit-tap-highlight-color: transparent;\n -webkit-font-variant-ligatures: contextual;\n font-variant-ligatures: contextual;\n padding: 0 ${base.spacing};\n }\n .CodeMirror-wrap pre.CodeMirror-line,\n .CodeMirror-wrap pre.CodeMirror-line-like {\n word-wrap: break-word;\n white-space: pre-wrap;\n word-break: normal;\n }\n\n .CodeMirror-linebackground {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n z-index: 0;\n }\n\n .CodeMirror-linewidget {\n position: relative;\n z-index: 2;\n padding: 0.006rem; /* Force widget margins to stay inside of the container */\n }\n\n .CodeMirror-rtl pre {\n direction: rtl;\n }\n\n .CodeMirror-code {\n outline: none;\n }\n\n /* Force content-box sizing for the elements where we expect it */\n .CodeMirror-scroll,\n .CodeMirror-sizer,\n .CodeMirror-gutter,\n .CodeMirror-linenumber {\n -moz-box-sizing: content-box;\n box-sizing: content-box;\n }\n\n .CodeMirror-measure {\n position: absolute;\n width: 100%;\n height: 0;\n overflow: hidden;\n visibility: hidden;\n }\n\n .CodeMirror-measure pre {\n position: static;\n }\n\n div.CodeMirror-dragcursors {\n visibility: visible;\n }\n\n .CodeMirror-selected {\n background: ${transparentize(0.8, base.palette.interactive)};\n }\n .CodeMirror-focused .CodeMirror-selected {\n background: ${transparentize(0.8, base.palette.interactive)};\n }\n .CodeMirror-focused {\n border-color: ${base.palette.interactive} !important;\n }\n .CodeMirror:not(.CodeMirror-focused) .CodeMirror-cursors {\n visibility: hidden;\n }\n .CodeMirror-crosshair {\n cursor: crosshair;\n }\n .CodeMirror-line::selection,\n .CodeMirror-line > span::selection,\n .CodeMirror-line > span > span::selection {\n background: ${transparentize(0.8, base.palette.interactive)};\n }\n .CodeMirror-line::-moz-selection,\n .CodeMirror-line > span::-moz-selection,\n .CodeMirror-line > span > span::-moz-selection {\n background: ${transparentize(0.8, base.palette.interactive)};\n }\n\n .cm-searching {\n background-color: ${transparentize(0.5, base.palette['foreground-color'])};\n }\n\n /* Used to force a border model for a node */\n .cm-force-border {\n padding-right: 0.006rem;\n }\n\n /* See issue #2901 */\n .cm-tab-wrap-hack::after {\n content: '';\n }\n\n /* Help users use markselection to safely style text background */\n span.CodeMirror-selectedtext {\n background: none;\n }\n\n .CodeMirror {\n ${isSingleLine &&\n css`\n white-space: nowrap;\n height: auto;\n padding-inline-end: ${base.spacing};\n `}\n overflow: hidden;\n font-family: monospace;\n direction: ltr;\n position: relative;\n background-color: ${formControlBgColor};\n color: ${base.palette['foreground-color']};\n border: 0.0625rem solid ${base.palette['border-line']};\n border-radius: calc(0.5 * ${base['border-radius']});\n ${errors &&\n css`\n border-color: ${errorBackground};\n `}\n ${readOnly &&\n css`\n background-color: ${readOnlyBackgroundColor};\n `}\n }\n\n .cm-ex-context {\n color: ${base.palette.interactive};\n }\n .cm-ex-additional-operators {\n color: ${base.palette.interactive};\n }\n .cm-ex-operator {\n color: ${base.palette.warn};\n font-weight: bold;\n }\n .cm-ex-comment {\n color: ${transparentize(0.2, base.palette.info)};\n }\n .cm-ex-ruleName {\n color: ${base.palette.success};\n }\n .cm-ex-delimeter {\n color: ${base.palette['foreground-color']};\n }\n .cm-ex-constant {\n color: ${base.palette.pending};\n }\n .cm-ex-underline-error {\n text-decoration: underline;\n text-decoration-style: wavy;\n text-decoration-color: ${base.palette.urgent};\n }\n `;\n});\n\nStyledCodeEditor.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestions = createGlobalStyle<{\n isLoading?: boolean;\n suggestions: SuggestionType[];\n}>(({ theme: { base } = defaultThemeProp.theme, isLoading, suggestions }) => {\n const activeColor = mix(0.85, base.palette[primaryBackground], base.palette.interactive);\n\n const hoverColor = mix(0.95, base.palette[primaryBackground], base.palette.interactive);\n\n const fontSizes = calculateFontSize(base['font-size'], base['font-scale']);\n return css`\n .CodeMirror-hints {\n position: absolute;\n z-index: calc(${base['z-index'].backdrop} + 1);\n transition: height ${base.animation.speed} ${base.animation.timing.ease};\n border-radius: calc(0.5 * ${base['border-radius']});\n box-shadow: ${base.shadow.low};\n border: 0.0625rem solid ${base.palette['border-line']};\n background-color: ${base.palette[primaryBackground]};\n font-size: ${fontSizes.s};\n max-height: 12rem;\n overflow-y: auto;\n min-width: ${base[contentWidth].xs};\n }\n\n .CodeMirror-hint {\n width: calc(1.5 * ${base[contentWidth].xs});\n cursor: pointer;\n &:focus-within {\n background-color: ${activeColor};\n }\n\n &:hover:not([aria-disabled='true']) {\n background-color: ${hoverColor};\n }\n padding-inline: ${base.spacing};\n }\n\n body .CodeMirror-lint-tooltip {\n z-index: ${base['z-index'].tooltip};\n }\n\n ${!isLoading &&\n suggestions?.length > 0 &&\n css`\n li.CodeMirror-hint-active {\n background-color: ${activeColor};\n }\n `}\n `;\n});\n"]}
|
|
1
|
+
{"version":3,"file":"CodeEditor.styles.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { createGlobalStyle, css } from 'styled-components';\nimport { mix, transparentize } from 'polished';\n\nimport { defaultThemeProp, calculateFontSize, Flex, Icon } from '@pega/cosmos-react-core';\nimport { StyledFormField } from '@pega/cosmos-react-core/lib/components/FormField/FormField';\n\nimport type { CodeEditorProps, SuggestionType } from './CodeEditor.types';\n\nconst primaryBackground = 'primary-background';\nconst contentWidth = 'content-width';\n\nexport const StyledLoading = styled.div`\n font-size: 1.5rem;\n`;\n\nexport const StyledWarnIcon = styled(Icon)(({ theme }) => {\n return css`\n color: ${theme.base.palette.urgent};\n `;\n});\n\nStyledWarnIcon.defaultProps = defaultThemeProp;\n\nexport const StyledPopover = styled.div(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n font-size: ${fontSize.xxs};\n max-width: ${theme.base[contentWidth].sm};\n padding: ${theme.base.spacing};\n white-space: pre-line;\n word-break: break-word;\n pointer-events: none;\n `;\n});\n\nStyledPopover.defaultProps = defaultThemeProp;\n\nexport const StyledList = styled.div(({ theme }) => {\n return css`\n padding-inline-start: calc(0.25 * ${theme.base.spacing});\n `;\n});\nStyledList.defaultProps = defaultThemeProp;\n\nexport const StyledCodeEditor = styled(Flex)<\n Pick<CodeEditorProps, 'showEditorOnly' | 'editorConfigProps' | 'isSingleLine'> & {\n isLoading?: boolean;\n errors?: string;\n readOnly?: boolean;\n suggestions: SuggestionType[];\n }\n>(({\n theme: {\n base,\n components: {\n 'form-control': {\n 'background-color': formControlBgColor,\n ':read-only': { 'background-color': readOnlyBackgroundColor }\n },\n 'form-field': {\n error: { 'status-color': errorBackground }\n },\n input\n }\n },\n errors,\n readOnly,\n showEditorOnly,\n editorConfigProps,\n isSingleLine = false\n}) => {\n return css`\n width: 100%;\n ${showEditorOnly &&\n css`\n max-height: 10rem;\n width: 27vw;\n `}\n position: relative;\n ${!showEditorOnly &&\n css`\n max-height: 100%;\n `}\n overflow-y: auto;\n ${StyledFormField} {\n flex-grow: 1;\n }\n\n /* PADDING */\n .react-codemirror2 {\n flex-grow: 1;\n ${isSingleLine\n ? css`\n min-height: ${input.height};\n & * {\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n }\n `\n : css`\n min-height: 3.75rem;\n `}\n overflow-y: auto;\n }\n\n .CodeMirror-placeholder {\n opacity: ${base.transparency['transparent-3']};\n }\n\n .CodeMirror-lines {\n cursor: text;\n min-height: 0.063rem; /* prevents collapsing before first draw */\n padding: ${base.spacing} 0;\n }\n\n ${editorConfigProps?.theme === 'eclipse' &&\n css`\n .cm-s-eclipse {\n .cm-string {\n color: ${base.palette.pending};\n &.cm-property {\n color: ${base.palette['foreground-color']};\n }\n }\n .cm-operator {\n color: ${base.palette.info};\n }\n .cm-variable,\n .cm-variable-2,\n .cm-variable-3 {\n color: ${base.palette['foreground-color']};\n }\n .cm-atom,\n .cm-keyword {\n color: ${base.palette.warn};\n }\n .cm-number {\n color: ${base.palette.success};\n }\n }\n `}\n\n .CodeMirror-scrollbar-filler,\n .CodeMirror-gutter-filler {\n background-color: ${base.palette[\n 'primary-background'\n ]}; /* The little square between H and V scrollbars */\n }\n\n /* GUTTER */\n\n .CodeMirror-gutters {\n position: absolute;\n left: 0;\n top: 0;\n min-height: 100%;\n z-index: 3;\n border-right: 0.063rem solid ${base.palette['border-line']};\n background-color: ${base.palette['secondary-background']};\n white-space: nowrap;\n }\n .CodeMirror-linenumber {\n padding: 0 0.125rem 0 0.313rem;\n min-width: 1.25rem;\n text-align: right;\n color: ${transparentize(0.5, base.palette['foreground-color'])};\n white-space: nowrap;\n }\n\n .CodeMirror-guttermarker {\n color: ${base.palette['foreground-color']};\n }\n .CodeMirror-guttermarker-subtle {\n color: ${transparentize(0.5, base.palette['foreground-color'])};\n }\n\n /* CURSOR */\n\n .CodeMirror-cursor {\n position: absolute;\n pointer-events: none;\n border-left: 0.0625rem solid ${base.palette.interactive};\n border-right: none;\n width: 0;\n ${readOnly &&\n css`\n display: none;\n `}\n }\n\n /* Shown when moving in bi-directional text */\n .CodeMirror div.CodeMirror-secondarycursor {\n border-left: 0.063rem solid ${base.palette['secondary-background']};\n }\n .cm-fat-cursor-mark {\n background-color: rgba(20, 255, 20, 0.5);\n -webkit-animation: blink 1.06s steps(1) infinite;\n -moz-animation: blink 1.06s steps(1) infinite;\n animation: blink 1.06s steps(1) infinite;\n }\n .cm-animate-fat-cursor {\n width: auto;\n border: 0;\n -webkit-animation: blink 1.06s steps(1) infinite;\n -moz-animation: blink 1.06s steps(1) infinite;\n animation: blink 1.06s steps(1) infinite;\n background-color: #77ee77;\n }\n @-moz-keyframes blink {\n 50% {\n background-color: transparent;\n }\n }\n @-webkit-keyframes blink {\n 50% {\n background-color: transparent;\n }\n }\n @keyframes blink {\n 50% {\n background-color: transparent;\n }\n }\n\n .cm-tab {\n display: inline-block;\n text-decoration: inherit;\n }\n\n .CodeMirror-rulers {\n position: absolute;\n left: 0;\n right: 0;\n top: -3.125rem;\n bottom: 0;\n overflow: hidden;\n }\n .CodeMirror-ruler {\n border-left: 0.063rem solid ${base.palette['border-line']};\n top: 0;\n bottom: 0;\n position: absolute;\n }\n\n /* DEFAULT THEME */\n\n .cm-s-default .cm-header {\n color: blue;\n }\n .cm-negative {\n color: #dd4444;\n }\n .cm-positive {\n color: #229922;\n }\n .cm-strong {\n font-weight: bold;\n }\n .cm-s-default .cm-quote {\n color: #009900;\n }\n .cm-em {\n font-style: italic;\n }\n .cm-link {\n text-decoration: underline;\n }\n .cm-strikethrough {\n text-decoration: line-through;\n }\n\n .cm-s-default .cm-keyword {\n color: #770088;\n }\n .cm-s-default .cm-atom {\n color: #221199;\n }\n .cm-s-default .cm-number {\n color: #116644;\n }\n .cm-s-default .cm-def {\n color: #0000ff;\n }\n .cm-s-default .cm-variable-2 {\n color: #0055aa;\n }\n .cm-s-default .cm-variable-3,\n .cm-s-default .cm-type {\n color: #008855;\n }\n .cm-s-default .cm-comment {\n color: #aa5500;\n }\n .cm-s-default .cm-string {\n color: #aa1111;\n }\n .cm-s-default .cm-string-2 {\n color: #ff5500;\n }\n .cm-s-default .cm-meta {\n color: #555555;\n }\n .cm-s-default .cm-qualifier {\n color: #555555;\n }\n .cm-s-default .cm-builtin {\n color: #3300aa;\n }\n .cm-s-default .cm-bracket {\n color: ${base.palette.skeleton};\n }\n .cm-s-default .cm-tag {\n color: ${base.palette.info};\n }\n .cm-s-default .cm-attribute {\n color: ${base.palette.interactive};\n }\n .cm-s-default .cm-hr {\n color: ${base.palette['border-line']};\n }\n .cm-s-default .cm-link {\n color: ${base.palette.interactive};\n }\n\n .cm-s-default .cm-error {\n color: ${base.palette.urgent};\n }\n .cm-invalidchar {\n color: ${base.palette.urgent};\n }\n\n .CodeMirror-composing {\n border-bottom: 0.125rem solid;\n }\n\n /* Default styles for common addons */\n\n div.CodeMirror span.CodeMirror-matchingbracket {\n color: ${base.palette.success} !important;\n outline: 0.0625rem dotted ${base.palette.success};\n }\n div.CodeMirror span.CodeMirror-nonmatchingbracket {\n color: ${base.palette.urgent} !important;\n outline: 0.0625rem dotted ${base.palette.urgent};\n }\n .CodeMirror-matchingtag {\n background: ${transparentize(0.5, base.palette.warn)};\n }\n .CodeMirror-activeline-background {\n background: ${base.palette['secondary-background']};\n }\n\n /* STOP */\n\n /* The rest of this file contains styles related to the mechanics of\n the editor. You probably shouldn't touch them. */\n\n .CodeMirror-scroll {\n overflow: scroll !important;\n margin-bottom: -3.125rem;\n margin-right: -3.125rem;\n padding-bottom: 3.125rem;\n height: 100%;\n outline: none; /* Prevent dragging from highlighting the element */\n position: relative;\n }\n .CodeMirror-sizer {\n position: relative;\n border-right: 3.125rem solid transparent;\n }\n\n /* The fake, visible scrollbars. Used to force redraw during scrolling\n before actual scrolling happens, thus preventing shaking and\n flickering artifacts. */\n .CodeMirror-vscrollbar,\n .CodeMirror-hscrollbar,\n .CodeMirror-scrollbar-filler,\n .CodeMirror-gutter-filler {\n position: absolute;\n z-index: 6;\n display: none;\n }\n .CodeMirror-vscrollbar {\n right: 0;\n top: 0;\n overflow-x: hidden;\n overflow-y: scroll;\n }\n .CodeMirror-hscrollbar {\n bottom: 0;\n left: 0;\n overflow-y: hidden;\n overflow-x: scroll;\n }\n .CodeMirror-scrollbar-filler {\n right: 0;\n bottom: 0;\n }\n .CodeMirror-gutter-filler {\n left: 0;\n bottom: 0;\n }\n .CodeMirror-gutter {\n white-space: normal;\n height: 100%;\n display: inline-block;\n vertical-align: top;\n margin-bottom: -3.125rem;\n }\n .CodeMirror-gutter-wrapper {\n position: absolute;\n z-index: 4;\n background: none !important;\n border: none !important;\n }\n .CodeMirror-gutter-background {\n position: absolute;\n top: 0;\n bottom: 0;\n z-index: 4;\n }\n .CodeMirror-gutter-elt {\n position: absolute;\n cursor: default;\n z-index: 4;\n }\n .CodeMirror-gutter-wrapper ::selection {\n background-color: transparent;\n }\n .CodeMirror-gutter-wrapper ::-moz-selection {\n background-color: transparent;\n }\n\n .CodeMirror pre.CodeMirror-line,\n .CodeMirror pre.CodeMirror-line-like {\n /* Reset some styles that the rest of the page might have set */\n -moz-border-radius: 0;\n -webkit-border-radius: 0;\n border-radius: 0;\n border-width: 0;\n background: transparent;\n font-family: inherit;\n font-size: inherit;\n margin: 0;\n white-space: pre;\n word-wrap: normal;\n line-height: inherit;\n color: inherit;\n z-index: 2;\n position: relative;\n overflow: visible;\n -webkit-tap-highlight-color: transparent;\n -webkit-font-variant-ligatures: contextual;\n font-variant-ligatures: contextual;\n padding: 0 ${base.spacing};\n }\n .CodeMirror-wrap pre.CodeMirror-line,\n .CodeMirror-wrap pre.CodeMirror-line-like {\n word-wrap: break-word;\n white-space: pre-wrap;\n word-break: normal;\n }\n\n .CodeMirror-linebackground {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n z-index: 0;\n }\n\n .CodeMirror-linewidget {\n position: relative;\n z-index: 2;\n padding: 0.006rem; /* Force widget margins to stay inside of the container */\n }\n\n .CodeMirror-rtl pre {\n direction: rtl;\n }\n\n .CodeMirror-code {\n outline: none;\n }\n\n /* Force content-box sizing for the elements where we expect it */\n .CodeMirror-scroll,\n .CodeMirror-sizer,\n .CodeMirror-gutter,\n .CodeMirror-linenumber {\n -moz-box-sizing: content-box;\n box-sizing: content-box;\n }\n\n .CodeMirror-measure {\n position: absolute;\n width: 100%;\n height: 0;\n overflow: hidden;\n visibility: hidden;\n }\n\n .CodeMirror-measure pre {\n position: static;\n }\n\n div.CodeMirror-dragcursors {\n visibility: visible;\n }\n\n .CodeMirror-selected {\n background: ${transparentize(0.8, base.palette.interactive)};\n }\n .CodeMirror-focused .CodeMirror-selected {\n background: ${transparentize(0.8, base.palette.interactive)};\n }\n .CodeMirror-focused {\n border-color: ${base.palette.interactive} !important;\n }\n .CodeMirror:not(.CodeMirror-focused) .CodeMirror-cursors {\n visibility: hidden;\n }\n .CodeMirror-crosshair {\n cursor: crosshair;\n }\n .CodeMirror-line::selection,\n .CodeMirror-line > span::selection,\n .CodeMirror-line > span > span::selection {\n background: ${transparentize(0.8, base.palette.interactive)};\n }\n .CodeMirror-line::-moz-selection,\n .CodeMirror-line > span::-moz-selection,\n .CodeMirror-line > span > span::-moz-selection {\n background: ${transparentize(0.8, base.palette.interactive)};\n }\n\n .cm-searching {\n background-color: ${transparentize(0.5, base.palette['foreground-color'])};\n }\n\n /* Used to force a border model for a node */\n .cm-force-border {\n padding-right: 0.006rem;\n }\n\n /* See issue #2901 */\n .cm-tab-wrap-hack::after {\n content: '';\n }\n\n /* Help users use markselection to safely style text background */\n span.CodeMirror-selectedtext {\n background: none;\n }\n\n .CodeMirror {\n ${isSingleLine &&\n css`\n white-space: nowrap;\n height: auto;\n padding-inline-end: ${base.spacing};\n `}\n overflow: hidden;\n font-family: monospace;\n direction: ltr;\n position: relative;\n background-color: ${formControlBgColor};\n color: ${base.palette['foreground-color']};\n border: 0.0625rem solid ${base.palette['border-line']};\n border-radius: calc(0.5 * ${base['border-radius']});\n ${errors &&\n css`\n border-color: ${errorBackground};\n `}\n ${readOnly &&\n css`\n background-color: ${readOnlyBackgroundColor};\n `}\n }\n\n .cm-ex-context {\n color: ${base.palette.interactive};\n }\n .cm-ex-additional-operators {\n color: ${base.palette.interactive};\n }\n .cm-ex-operator {\n color: ${base.palette.warn};\n font-weight: bold;\n }\n .cm-ex-comment {\n color: ${transparentize(0.2, base.palette.info)};\n }\n .cm-ex-ruleName {\n color: ${base.palette.success};\n }\n .cm-ex-delimeter {\n color: ${base.palette['foreground-color']};\n }\n .cm-ex-constant {\n color: ${base.palette.pending};\n }\n .cm-ex-underline-error {\n text-decoration: underline;\n text-decoration-style: wavy;\n text-decoration-color: ${base.palette.urgent};\n }\n `;\n});\n\nStyledCodeEditor.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestions = createGlobalStyle<{\n isLoading?: boolean;\n suggestions: SuggestionType[];\n}>(({ theme: { base } = defaultThemeProp.theme, isLoading, suggestions }) => {\n const activeColor = mix(0.85, base.palette[primaryBackground], base.palette.interactive);\n\n const hoverColor = mix(0.95, base.palette[primaryBackground], base.palette.interactive);\n\n const fontSizes = calculateFontSize(base['font-size'], base['font-scale']);\n return css`\n .CodeMirror-hints {\n position: absolute;\n z-index: calc(${base['z-index'].backdrop} + 1);\n transition: height ${base.animation.speed} ${base.animation.timing.ease};\n border-radius: calc(0.5 * ${base['border-radius']});\n box-shadow: ${base.shadow.low};\n border: 0.0625rem solid ${base.palette['border-line']};\n background-color: ${base.palette[primaryBackground]};\n font-size: ${fontSizes.s};\n max-height: 12rem;\n overflow-y: auto;\n min-width: ${base[contentWidth].xs};\n }\n\n .CodeMirror-hint {\n width: calc(1.5 * ${base[contentWidth].xs});\n cursor: pointer;\n &:focus-within {\n background-color: ${activeColor};\n }\n\n &:hover:not([aria-disabled='true']) {\n background-color: ${hoverColor};\n }\n padding-inline: ${base.spacing};\n }\n\n body .CodeMirror-lint-tooltip {\n z-index: ${base['z-index'].tooltip};\n }\n\n ${!isLoading &&\n suggestions?.length > 0 &&\n css`\n li.CodeMirror-hint-active {\n background-color: ${activeColor};\n }\n `}\n `;\n});\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { Ref } from 'react';
|
|
2
2
|
import type { ShowHintOptions, EditorConfiguration, Position } from 'codemirror';
|
|
3
|
-
import type { DefaultSettableTheme, MenuItemProps, TestIdProp } from '@pega/cosmos-react-core';
|
|
3
|
+
import type { DefaultSettableTheme, MenuItemProps, TestIdProp, Action } from '@pega/cosmos-react-core';
|
|
4
4
|
export type AutoCompleteTriggerChar = '@' | '.' | ':' | '#' | '(' | ')' | '[' | ']';
|
|
5
5
|
export type SuggestionType = Pick<MenuItemProps, 'primary' | 'secondary' | 'id'>;
|
|
6
6
|
export interface CustomPositionProps {
|
|
@@ -24,6 +24,8 @@ export interface LintError {
|
|
|
24
24
|
export interface CodeEditorProps extends TestIdProp {
|
|
25
25
|
/** Default expression to set in the code editor */
|
|
26
26
|
defaultValue?: string;
|
|
27
|
+
/** Optional controlled expression value. When this prop changes, the editor content is updated to match. */
|
|
28
|
+
value?: string;
|
|
27
29
|
/** Compiled error message */
|
|
28
30
|
errors?: string;
|
|
29
31
|
/** Enable read only mode */
|
|
@@ -53,6 +55,12 @@ export interface CodeEditorProps extends TestIdProp {
|
|
|
53
55
|
showEditorOnly?: boolean;
|
|
54
56
|
/** Information to announce to screen reader users on focusing CodeEditor. */
|
|
55
57
|
'aria-describedby'?: string;
|
|
58
|
+
/** Called when the CSS format button is clicked. */
|
|
59
|
+
onFormat?: () => void;
|
|
60
|
+
/** Additional actions to render in the toolbar row */
|
|
61
|
+
actions?: Action[];
|
|
62
|
+
/** Label to display in the toolbar row */
|
|
63
|
+
label?: string;
|
|
56
64
|
}
|
|
57
65
|
export interface EditorHintOptions extends ShowHintOptions {
|
|
58
66
|
suggestions?: SuggestionType[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeEditor.types.d.ts","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,KAAK,EAAE,eAAe,EAAE,mBAAmB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEjF,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"CodeEditor.types.d.ts","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeEditor.types.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Ref } from 'react';\nimport type { ShowHintOptions, EditorConfiguration, Position } from 'codemirror';\n\nimport type {
|
|
1
|
+
{"version":3,"file":"CodeEditor.types.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Ref } from 'react';\nimport type { ShowHintOptions, EditorConfiguration, Position } from 'codemirror';\n\nimport type {\n DefaultSettableTheme,\n MenuItemProps,\n TestIdProp,\n Action\n} from '@pega/cosmos-react-core';\n\nexport type AutoCompleteTriggerChar = '@' | '.' | ':' | '#' | '(' | ')' | '[' | ']';\n\nexport type SuggestionType = Pick<MenuItemProps, 'primary' | 'secondary' | 'id'>;\n\nexport interface CustomPositionProps {\n start?: Position;\n end?: Position;\n}\n\nexport interface EditorState {\n getValue: () => string | undefined;\n insertText: (text: string, resetContent?: boolean, customPositions?: CustomPositionProps) => void;\n}\n\nexport type CursorPosition = Pick<Position, 'ch' | 'line'>;\n\nexport interface ErrorRange {\n line: number;\n ch: number;\n}\n\nexport interface LintError {\n from: Position;\n to: Position;\n message: string;\n}\n\nexport interface CodeEditorProps extends TestIdProp {\n /** Default expression to set in the code editor */\n defaultValue?: string;\n /** Optional controlled expression value. When this prop changes, the editor content is updated to match. */\n value?: string;\n /** Compiled error message */\n errors?: string;\n /** Enable read only mode */\n readOnly?: boolean;\n /** Fetches suggestion list for suggestions popover */\n fetchSuggestions?: (\n autoCompleteTrigger: AutoCompleteTriggerChar,\n cursorPosition: CursorPosition\n ) => Promise<SuggestionType[] | undefined>;\n /** characters which triggers suggestions */\n autoCompleteTriggers?: AutoCompleteTriggerChar[];\n /** Code editor configuration props */\n editorConfigProps?: EditorConfiguration;\n /** To show loader for intellisense popover */\n loading?: boolean;\n /** Called when editor loses the focus */\n onBlur?: (expression: string) => void;\n /** Called when editor content changes. */\n onChange?: (expression: string, errors?: LintError[], source?: string) => void;\n /** underlined error message */\n inLineErrors?: { start: ErrorRange; end: ErrorRange; messages: string[] }[];\n /** For single line code editor rendering */\n isSingleLine?: boolean;\n codeEditorHandle: Ref<EditorState>;\n ref?: Ref<HTMLDivElement>;\n showEditorOnly?: boolean;\n /** Information to announce to screen reader users on focusing CodeEditor. */\n 'aria-describedby'?: string;\n /** Called when the CSS format button is clicked. */\n onFormat?: () => void;\n /** Additional actions to render in the toolbar row */\n actions?: Action[];\n /** Label to display in the toolbar row */\n label?: string;\n}\n\nexport interface EditorHintOptions extends ShowHintOptions {\n suggestions?: SuggestionType[];\n loading?: boolean;\n triggerCharacterCursorPos?: Position;\n theme?: DefaultSettableTheme;\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"formatCSS.d.ts","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/formatCSS.ts"],"names":[],"mappings":"AAsBA,QAAA,MAAM,SAAS,GAAU,KAAK,MAAM,KAAG,OAAO,CAAC,MAAM,CAcpD,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
let formatterDepsPromise = null;
|
|
2
|
+
const loadFormatterDeps = async () => {
|
|
3
|
+
if (!formatterDepsPromise) {
|
|
4
|
+
formatterDepsPromise = Promise.all([
|
|
5
|
+
import('prettier/standalone'),
|
|
6
|
+
import('prettier/plugins/postcss')
|
|
7
|
+
]).then(([prettier, postcss]) => ({
|
|
8
|
+
prettier,
|
|
9
|
+
postcssPlugin: postcss
|
|
10
|
+
}));
|
|
11
|
+
}
|
|
12
|
+
return formatterDepsPromise;
|
|
13
|
+
};
|
|
14
|
+
const formatCSS = async (css) => {
|
|
15
|
+
if (!css.trim())
|
|
16
|
+
return '';
|
|
17
|
+
try {
|
|
18
|
+
const { prettier, postcssPlugin } = await loadFormatterDeps();
|
|
19
|
+
return await prettier.format(css, {
|
|
20
|
+
parser: 'css',
|
|
21
|
+
plugins: [postcssPlugin]
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
catch {
|
|
25
|
+
// Keep the editor usable even when partial/invalid CSS cannot be formatted.
|
|
26
|
+
return css;
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
export default formatCSS;
|
|
30
|
+
//# sourceMappingURL=formatCSS.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"formatCSS.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/formatCSS.ts"],"names":[],"mappings":"AAGA,IAAI,oBAAoB,GAGZ,IAAI,CAAC;AAEjB,MAAM,iBAAiB,GAAG,KAAK,IAAI,EAAE;IACnC,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC1B,oBAAoB,GAAG,OAAO,CAAC,GAAG,CAAC;YACjC,MAAM,CAAC,qBAAqB,CAAC;YAC7B,MAAM,CAAC,0BAA0B,CAAC;SACnC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,EAAE,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC;YAChC,QAAQ;YACR,aAAa,EAAE,OAAO;SACvB,CAAC,CAAC,CAAC;IACN,CAAC;IAED,OAAO,oBAAoB,CAAC;AAC9B,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,KAAK,EAAE,GAAW,EAAmB,EAAE;IACvD,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,CAAC;IAE3B,IAAI,CAAC;QACH,MAAM,EAAE,QAAQ,EAAE,aAAa,EAAE,GAAG,MAAM,iBAAiB,EAAE,CAAC;QAE9D,OAAO,MAAM,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE;YAChC,MAAM,EAAE,KAAK;YACb,OAAO,EAAE,CAAC,aAAa,CAAC;SACzB,CAAC,CAAC;IACL,CAAC;IAAC,MAAM,CAAC;QACP,4EAA4E;QAC5E,OAAO,GAAG,CAAC;IACb,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["type PrettierModule = typeof import('prettier/standalone');\ntype PostcssPluginModule = typeof import('prettier/plugins/postcss');\n\nlet formatterDepsPromise: Promise<{\n prettier: PrettierModule;\n postcssPlugin: PostcssPluginModule;\n}> | null = null;\n\nconst loadFormatterDeps = async () => {\n if (!formatterDepsPromise) {\n formatterDepsPromise = Promise.all([\n import('prettier/standalone'),\n import('prettier/plugins/postcss')\n ]).then(([prettier, postcss]) => ({\n prettier,\n postcssPlugin: postcss\n }));\n }\n\n return formatterDepsPromise;\n};\n\nconst formatCSS = async (css: string): Promise<string> => {\n if (!css.trim()) return '';\n\n try {\n const { prettier, postcssPlugin } = await loadFormatterDeps();\n\n return await prettier.format(css, {\n parser: 'css',\n plugins: [postcssPlugin]\n });\n } catch {\n // Keep the editor usable even when partial/invalid CSS cannot be formatted.\n return css;\n }\n};\n\nexport default formatCSS;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpressionBuilder.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.styles.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAKrE,eAAO,MAAM,iBAAiB;;yLAE7B,CAAC;AAEF,eAAO,MAAM,2BAA2B,6NAKtC,CAAC;AAIH,eAAO,MAAM,oBAAoB,iOAWhC,CAAC;AAIF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BACkC,OAAO;kLAuB3E,CAAC;AAGH,eAAO,MAAM,iBAAiB,6NAQ5B,CAAC;AAIH,eAAO,MAAM,sBAAsB;;mBAIjC,CAAC;AAIH,eAAO,MAAM,uBAAuB,6NAAe,CAAC;AAIpD,eAAO,MAAM,2BAA2B,6NAQtC,CAAC;AAIH,eAAO,MAAM,oBAAoB;cACrB,mBAAmB,CAAC,UAAU,CAAC;YAuBzC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yOAE7B,CAAC;AAEF,eAAO,MAAM,0BAA0B,6NAKtC,CAAC;AAEF,eAAO,MAAM,uBAAuB,6NAOnC,CAAC;AAIF,eAAO,MAAM,yBAAyB;oBAAgC,OAAO;YAW5E,CAAC;AAEF,eAAO,MAAM,sBAAsB,6NAElC,CAAC;AAEF,eAAO,MAAM,iBAAiB,6NAE7B,CAAC;AAEF,eAAO,MAAM,eAAe;
|
|
1
|
+
{"version":3,"file":"ExpressionBuilder.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.styles.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAKrE,eAAO,MAAM,iBAAiB;;yLAE7B,CAAC;AAEF,eAAO,MAAM,2BAA2B,6NAKtC,CAAC;AAIH,eAAO,MAAM,oBAAoB,iOAWhC,CAAC;AAIF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BACkC,OAAO;kLAuB3E,CAAC;AAGH,eAAO,MAAM,iBAAiB,6NAQ5B,CAAC;AAIH,eAAO,MAAM,sBAAsB;;mBAIjC,CAAC;AAIH,eAAO,MAAM,uBAAuB,6NAAe,CAAC;AAIpD,eAAO,MAAM,2BAA2B,6NAQtC,CAAC;AAIH,eAAO,MAAM,oBAAoB;cACrB,mBAAmB,CAAC,UAAU,CAAC;YAuBzC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yOAE7B,CAAC;AAEF,eAAO,MAAM,0BAA0B,6NAKtC,CAAC;AAEF,eAAO,MAAM,uBAAuB,6NAOnC,CAAC;AAIF,eAAO,MAAM,yBAAyB;oBAAgC,OAAO;YAW5E,CAAC;AAEF,eAAO,MAAM,sBAAsB,6NAElC,CAAC;AAEF,eAAO,MAAM,iBAAiB,6NAE7B,CAAC;AAEF,eAAO,MAAM,eAAe;2BAsBd,CAAC;iDAnBd,CAAC;AAEF,eAAO,MAAM,yBAAyB,6NASrC,CAAC;AAIF,eAAO,MAAM,kBAAkB,yOAE9B,CAAC;AAEF,eAAO,MAAM,wBAAwB;;yLAInC,CAAC"}
|
|
@@ -5,5 +5,6 @@ export { default as ExpressionItem } from './ExpressionItem';
|
|
|
5
5
|
export { default as ExpressionList } from './ExpressionList';
|
|
6
6
|
export { default as ExpressionDetails } from './ExpressionDetails';
|
|
7
7
|
export { default as CodeEditor } from './CodeEditor/CodeEditor';
|
|
8
|
+
export { default as formatCSS } from './CodeEditor/formatCSS';
|
|
8
9
|
export { default as ExpressionBuilderContext } from './ExpressionBuilderContext';
|
|
9
10
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,YAAY,EACV,mBAAmB,EACnB,mBAAmB,EACnB,sBAAsB,EACtB,WAAW,EACX,WAAW,EACZ,MAAM,2BAA2B,CAAC;AACnC,YAAY,EACV,WAAW,EACX,eAAe,EACf,uBAAuB,EACvB,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,SAAS,EACV,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,4BAA4B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,YAAY,EACV,mBAAmB,EACnB,mBAAmB,EACnB,sBAAsB,EACtB,WAAW,EACX,WAAW,EACZ,MAAM,2BAA2B,CAAC;AACnC,YAAY,EACV,WAAW,EACX,eAAe,EACf,uBAAuB,EACvB,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,SAAS,EACV,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,4BAA4B,CAAC"}
|
|
@@ -3,5 +3,6 @@ export { default as ExpressionItem } from './ExpressionItem';
|
|
|
3
3
|
export { default as ExpressionList } from './ExpressionList';
|
|
4
4
|
export { default as ExpressionDetails } from './ExpressionDetails';
|
|
5
5
|
export { default as CodeEditor } from './CodeEditor/CodeEditor';
|
|
6
|
+
export { default as formatCSS } from './CodeEditor/formatCSS';
|
|
6
7
|
export { default as ExpressionBuilderContext } from './ExpressionBuilderContext';
|
|
7
8
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAiB9C,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,4BAA4B,CAAC","sourcesContent":["export { default } from './ExpressionBuilder';\nexport type {\n ExpressionListProps,\n ExpressionItemProps,\n ExpressionBuilderProps,\n HandleValue,\n InputParams\n} from './ExpressionBuilder.types';\nexport type {\n EditorState,\n CodeEditorProps,\n AutoCompleteTriggerChar,\n SuggestionType,\n CursorPosition,\n CustomPositionProps,\n LintError\n} from './CodeEditor/CodeEditor.types';\nexport { default as ExpressionItem } from './ExpressionItem';\nexport { default as ExpressionList } from './ExpressionList';\nexport { default as ExpressionDetails } from './ExpressionDetails';\nexport { default as CodeEditor } from './CodeEditor/CodeEditor';\nexport { default as ExpressionBuilderContext } from './ExpressionBuilderContext';\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAiB9C,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,4BAA4B,CAAC","sourcesContent":["export { default } from './ExpressionBuilder';\nexport type {\n ExpressionListProps,\n ExpressionItemProps,\n ExpressionBuilderProps,\n HandleValue,\n InputParams\n} from './ExpressionBuilder.types';\nexport type {\n EditorState,\n CodeEditorProps,\n AutoCompleteTriggerChar,\n SuggestionType,\n CursorPosition,\n CustomPositionProps,\n LintError\n} from './CodeEditor/CodeEditor.types';\nexport { default as ExpressionItem } from './ExpressionItem';\nexport { default as ExpressionList } from './ExpressionList';\nexport { default as ExpressionDetails } from './ExpressionDetails';\nexport { default as CodeEditor } from './CodeEditor/CodeEditor';\nexport { default as formatCSS } from './CodeEditor/formatCSS';\nexport { default as ExpressionBuilderContext } from './ExpressionBuilderContext';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldReference.styles.d.ts","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReference.styles.ts"],"names":[],"mappings":"AA4BA,eAAO,MAAM,2BAA2B,6NAoDtC,CAAC;AAIH,eAAO,MAAM,+BAA+B,6NAqB1C,CAAC;AAIH,eAAO,MAAM,yBAAyB;;;mBAA8C,OAAO;YAwCzF,CAAC;AAIH,eAAO,MAAM,eAAe,6NAM1B,CAAC;AAIH,eAAO,MAAM,gBAAgB,6NAI3B,CAAC;AAIH,eAAO,MAAM,0BAA0B;;;;mBAcrC,CAAC;AAIH,eAAO,MAAM,wBAAwB,6NAyBnC,CAAC;AAIH,eAAO,MAAM,uBAAuB;;mBAEnC,CAAC;AAEF,eAAO,MAAM,iBAAiB,+NAU5B,CAAC;AAIH,eAAO,MAAM,oBAAoB;
|
|
1
|
+
{"version":3,"file":"FieldReference.styles.d.ts","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReference.styles.ts"],"names":[],"mappings":"AA4BA,eAAO,MAAM,2BAA2B,6NAoDtC,CAAC;AAIH,eAAO,MAAM,+BAA+B,6NAqB1C,CAAC;AAIH,eAAO,MAAM,yBAAyB;;;mBAA8C,OAAO;YAwCzF,CAAC;AAIH,eAAO,MAAM,eAAe,6NAM1B,CAAC;AAIH,eAAO,MAAM,gBAAgB,6NAI3B,CAAC;AAIH,eAAO,MAAM,0BAA0B;;;;mBAcrC,CAAC;AAIH,eAAO,MAAM,wBAAwB,6NAyBnC,CAAC;AAIH,eAAO,MAAM,uBAAuB;;mBAEnC,CAAC;AAEF,eAAO,MAAM,iBAAiB,+NAU5B,CAAC;AAIH,eAAO,MAAM,oBAAoB;2BAnG1B,CAAC;iDAyGN,CAAC"}
|
|
@@ -47,9 +47,7 @@ export interface FieldReferenceDisplayProps extends NoChildrenProp, TestIdProp {
|
|
|
47
47
|
/** The path to the field reference. */
|
|
48
48
|
fieldPath: [Context, ...Field[]] | Field[];
|
|
49
49
|
/** If defined, the fieldPath will render as a Link with these props forwarded. */
|
|
50
|
-
link?: Pick<LinkProps, 'href' | 'previewable' | 'onPreview' | 'target'
|
|
51
|
-
onClick?: (e: MouseEvent) => void;
|
|
52
|
-
};
|
|
50
|
+
link?: Pick<LinkProps, 'href' | 'previewable' | 'onPreview' | 'target' | 'onClick'>;
|
|
53
51
|
/** Pass an array of Action objects to append button(s) inline. */
|
|
54
52
|
actions?: Action[];
|
|
55
53
|
/** Data to render in a tooltip upon hover of the component. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldReference.types.d.ts","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReference.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,aAAa,IAAI,kBAAkB,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAElF,OAAO,KAAK,EACV,SAAS,EACT,aAAa,EACb,cAAc,EACd,UAAU,EACV,SAAS,EACT,gBAAgB,EAChB,uBAAuB,EACvB,MAAM,EACN,SAAS,EACT,UAAU,EACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wDAAwD,CAAC;AAElG,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,KAAK;IACpB,mCAAmC;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,6BAA6B;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,6BAA6B;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6CAA6C;IAC7C,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,4CAA4C;IAC5C,QAAQ,CAAC,EAAE;QACT,IAAI,EAAE,uBAAuB,CAAC,MAAM,CAAC,CAAC;QACtC,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;CACL;AAED,MAAM,WAAW,OAAO;IACtB,qCAAqC;IACrC,EAAE,EAAE,MAAM,CAAC;IACX,yBAAyB;IACzB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,UAAW,SAAQ,OAAO;IACzC,yCAAyC;IACzC,KAAK,EAAE,sBAAsB,EAAE,CAAC;IAChC,2GAA2G;IAC3G,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;CACtC;AAED,MAAM,WAAW,sBAAuB,SAAQ,KAAK;IACnD,0GAA0G;IAC1G,KAAK,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACjC,6GAA6G;IAC7G,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACrC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,0BAA2B,SAAQ,cAAc,EAAE,UAAU;IAC5E,uCAAuC;IACvC,SAAS,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC;IAC3C,kFAAkF;IAClF,IAAI,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,aAAa,GAAG,WAAW,GAAG,QAAQ,
|
|
1
|
+
{"version":3,"file":"FieldReference.types.d.ts","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReference.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,aAAa,IAAI,kBAAkB,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAElF,OAAO,KAAK,EACV,SAAS,EACT,aAAa,EACb,cAAc,EACd,UAAU,EACV,SAAS,EACT,gBAAgB,EAChB,uBAAuB,EACvB,MAAM,EACN,SAAS,EACT,UAAU,EACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wDAAwD,CAAC;AAElG,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,KAAK;IACpB,mCAAmC;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,6BAA6B;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,6BAA6B;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6CAA6C;IAC7C,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,4CAA4C;IAC5C,QAAQ,CAAC,EAAE;QACT,IAAI,EAAE,uBAAuB,CAAC,MAAM,CAAC,CAAC;QACtC,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;CACL;AAED,MAAM,WAAW,OAAO;IACtB,qCAAqC;IACrC,EAAE,EAAE,MAAM,CAAC;IACX,yBAAyB;IACzB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,UAAW,SAAQ,OAAO;IACzC,yCAAyC;IACzC,KAAK,EAAE,sBAAsB,EAAE,CAAC;IAChC,2GAA2G;IAC3G,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;CACtC;AAED,MAAM,WAAW,sBAAuB,SAAQ,KAAK;IACnD,0GAA0G;IAC1G,KAAK,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACjC,6GAA6G;IAC7G,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACrC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,0BAA2B,SAAQ,cAAc,EAAE,UAAU;IAC5E,uCAAuC;IACvC,SAAS,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC;IAC3C,kFAAkF;IAClF,IAAI,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,aAAa,GAAG,WAAW,GAAG,QAAQ,GAAG,SAAS,CAAC,CAAC;IACpF,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,uBAAuB,EAAE,CAAC;IACxC,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,uBACf,SAAQ,IAAI,CAAC,SAAS,EAAE,YAAY,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,aAAa,CAAC;IAC3F,6BAA6B;IAC7B,KAAK,EAAE,sBAAsB,EAAE,CAAC;IAChC,mDAAmD;IACnD,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mHAAmH;IACnH,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,uCAAuC;IACvC,UAAU,CAAC,EAAE,sBAAsB,GAAG,UAAU,CAAC;IACjD;;;SAGK;IACL,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,4BAA6B,SAAQ,UAAU;IAC9D,KAAK,EAAE,mBAAmB,CAAC,OAAO,CAAC,CAAC;IACpC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC;AAED,MAAM,WAAW,yBAAyB;IACxC,8CAA8C;IAC9C,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,+CAA+C;IAC/C,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AACD,MAAM,WAAW,mBACf,SAAQ,UAAU,CAAC,wBAAwB,EAAE,gBAAgB,CAAC;IAC9D;;;;OAIG;IACH,IAAI,EAAE,eAAe,GAAG,cAAc,CAAC;IACvC,cAAc,CAAC,EAAE,wBAAwB,CAAC,gBAAgB,CAAC,CAAC;CAC7D;AACD,MAAM,CAAC,OAAO,WAAW,wBACvB,SAAQ,cAAc,EACpB,UAAU,EACV,IAAI,CACF,gBAAgB,EACd,IAAI,GACJ,OAAO,GACP,aAAa,GACb,UAAU,GACV,UAAU,GACV,UAAU,GACV,QAAQ,GACR,MAAM,GACN,aAAa,GACb,gBAAgB,CACnB;IACH,iCAAiC;IACjC,IAAI,EAAE,uBAAuB,CAAC;IAC9B;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;SAGK;IACL,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;SAGK;IACL,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IACrD,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;IACnB,+DAA+D;IAC/D,gBAAgB,EAAE,CAAC,aAAa,EAAE,sBAAsB,EAAE,KAAK,IAAI,CAAC;IACpE,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6DAA6D;IAC7D,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,iIAAiI;IACjI,IAAI,CAAC,EAAE,0BAA0B,CAAC,MAAM,CAAC,CAAC;IAC1C,gHAAgH;IAChH,OAAO,CAAC,EAAE,0BAA0B,CAAC,SAAS,CAAC,CAAC;IAChD,iEAAiE;IACjE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;;;OAOG;IACH,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,2DAA2D;IAC3D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC,6BAA6B;IAC7B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB;;;OAGG;IACH,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,kBAAkB,KAAK,OAAO,GAAG,IAAI,CAAC;IACtD,4DAA4D;IAC5D,MAAM,CAAC,EAAE,GAAG,CAAC,yBAAyB,CAAC,CAAC;IACxC,iDAAiD;IACjD,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldReference.types.js","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReference.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Ref, KeyboardEvent as ReactKeyboardEvent, MouseEvent } from 'react';\n\nimport type {\n IconProps,\n MenuItemProps,\n NoChildrenProp,\n TestIdProp,\n MenuProps,\n FormControlProps,\n FieldValueListItemProps,\n Action,\n LinkProps,\n OmitStrict\n} from '@pega/cosmos-react-core';\nimport type { ParentMenuItemProps } from '@pega/cosmos-react-core/lib/components/Menu/Menu.types';\n\nexport interface Selected {\n id: string;\n text: string;\n}\n\nexport interface Field {\n /** The unique id for the field. */\n id: string;\n /** The name of the field. */\n name: string;\n /** The type of the field. */\n type?: string;\n /** Props forwarded to the Icon component. */\n icon?: IconProps;\n /** Additional data related to the field. */\n metadata?: {\n name: FieldValueListItemProps['name'];\n value: string;\n }[];\n}\n\nexport interface Context {\n /** The unique id for the context. */\n id: string;\n /** The context label. */\n name: string;\n}\n\nexport interface AltContext extends Context {\n /** Items associated with the context. */\n items: FieldReferenceMenuItem[];\n /** If true or false, the altContext will be selectable. If undefined, the altContext not be selectable. */\n selected?: MenuItemProps['selected'];\n}\n\nexport interface FieldReferenceMenuItem extends Field {\n /** A set of nested child items. If an empty array is provided, the item will still render as a parent. */\n items?: FieldReferenceMenuItem[];\n /** If true or false, the parent item will be selectable. If undefined, the parent will not be selectable. */\n selected?: MenuItemProps['selected'];\n /**\n * Corresponding field item from the source.\n * Useful if the `id` alone is not unique enough to identify the source\n */\n originalItem?: unknown;\n}\n\nexport interface FieldReferenceDisplayProps extends NoChildrenProp, TestIdProp {\n /** The path to the field reference. */\n fieldPath: [Context, ...Field[]] | Field[];\n /** If defined, the fieldPath will render as a Link with these props forwarded. */\n link?: Pick<LinkProps, 'href' | 'previewable' | 'onPreview' | 'target'
|
|
1
|
+
{"version":3,"file":"FieldReference.types.js","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReference.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Ref, KeyboardEvent as ReactKeyboardEvent, MouseEvent } from 'react';\n\nimport type {\n IconProps,\n MenuItemProps,\n NoChildrenProp,\n TestIdProp,\n MenuProps,\n FormControlProps,\n FieldValueListItemProps,\n Action,\n LinkProps,\n OmitStrict\n} from '@pega/cosmos-react-core';\nimport type { ParentMenuItemProps } from '@pega/cosmos-react-core/lib/components/Menu/Menu.types';\n\nexport interface Selected {\n id: string;\n text: string;\n}\n\nexport interface Field {\n /** The unique id for the field. */\n id: string;\n /** The name of the field. */\n name: string;\n /** The type of the field. */\n type?: string;\n /** Props forwarded to the Icon component. */\n icon?: IconProps;\n /** Additional data related to the field. */\n metadata?: {\n name: FieldValueListItemProps['name'];\n value: string;\n }[];\n}\n\nexport interface Context {\n /** The unique id for the context. */\n id: string;\n /** The context label. */\n name: string;\n}\n\nexport interface AltContext extends Context {\n /** Items associated with the context. */\n items: FieldReferenceMenuItem[];\n /** If true or false, the altContext will be selectable. If undefined, the altContext not be selectable. */\n selected?: MenuItemProps['selected'];\n}\n\nexport interface FieldReferenceMenuItem extends Field {\n /** A set of nested child items. If an empty array is provided, the item will still render as a parent. */\n items?: FieldReferenceMenuItem[];\n /** If true or false, the parent item will be selectable. If undefined, the parent will not be selectable. */\n selected?: MenuItemProps['selected'];\n /**\n * Corresponding field item from the source.\n * Useful if the `id` alone is not unique enough to identify the source\n */\n originalItem?: unknown;\n}\n\nexport interface FieldReferenceDisplayProps extends NoChildrenProp, TestIdProp {\n /** The path to the field reference. */\n fieldPath: [Context, ...Field[]] | Field[];\n /** If defined, the fieldPath will render as a Link with these props forwarded. */\n link?: Pick<LinkProps, 'href' | 'previewable' | 'onPreview' | 'target' | 'onClick'>;\n /** Pass an array of Action objects to append button(s) inline. */\n actions?: Action[];\n /** Data to render in a tooltip upon hover of the component. */\n tooltipData?: FieldValueListItemProps[];\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface FieldReferenceMenuProps\n extends Pick<MenuProps, 'itemLayout' | 'scrollAt' | 'loading' | 'loadMore' | 'onCreateNew'> {\n /** Menu items to display. */\n items: FieldReferenceMenuItem[];\n /** The current context that the menu is within. */\n currentContext?: Context;\n /** Menu items to display above the standard list. These should be items that are outside of the currentContext. */\n altContexts?: AltContext[];\n /** Parent menu item for drill-down. */\n parentItem?: FieldReferenceMenuItem | AltContext;\n /**\n * A custom label for the create new action.\n * @default 'Create new'\n * */\n createNewLabel?: string;\n}\n\nexport interface FieldReferencedMenuListProps extends TestIdProp {\n items: ParentMenuItemProps['items'];\n id?: string;\n parent?: { id: string; primary: string };\n ref?: Ref<HTMLFieldSetElement>;\n}\n\nexport interface FieldReferenceHandleValue {\n /** Used to open the menu programmatically. */\n openMenu: () => void;\n /** Used to close the menu programmatically. */\n closeMenu: () => void;\n}\nexport interface FieldReferenceProps\n extends OmitStrict<FieldReferenceInputProps, 'onFilterChange'> {\n /** Defines the use of FieldReferenceWrapper component\n * fieldPicker represents component usage for fieldReference\n * objectSelect represents component usage for ObjectSelect\n * @default Field\n */\n mode: 'object-select' | 'field-picker';\n onFilterChange?: FieldReferenceInputProps['onFilterChange'];\n}\nexport default interface FieldReferenceInputProps\n extends NoChildrenProp,\n TestIdProp,\n Pick<\n FormControlProps,\n | 'id'\n | 'label'\n | 'labelHidden'\n | 'required'\n | 'disabled'\n | 'readOnly'\n | 'status'\n | 'info'\n | 'placeholder'\n | 'additionalInfo'\n > {\n /** Props related to the menu. */\n menu: FieldReferenceMenuProps;\n /**\n * If true, tooltips will be shown when hovering over menu items and selected paths.\n * @default true\n */\n showTooltips?: boolean;\n /**\n * If true, the current context will be prepended to all field reference paths.\n * @default false\n * */\n showCurrentContext?: boolean;\n /**\n * If true, only a selected leaf node will be shown in the selected path.\n * @default true\n * */\n showPath?: boolean;\n /** Callback fired when an altContext item is clicked. */\n onAltContextClick?: (altContext: AltContext) => void;\n /** The current selection. */\n selected?: Field[];\n /** Callback fired when the selected field path is modified. */\n onSelectedChange: (selectedValue: FieldReferenceMenuItem[]) => void;\n /** The value of the search filter. */\n filterValue?: string;\n /** Callback fired when the filtering input value changes. */\n onFilterChange: (filterValue: string) => void;\n /** If defined, the selected fieldPath will render as a Link when the input is in a resting state, with these props forwarded. */\n link?: FieldReferenceDisplayProps['link'];\n /** Pass an array of Action objects to append button(s) inline when the input is in a selected resting state. */\n actions?: FieldReferenceDisplayProps['actions'];\n /** Callback fired when the Field Reference input gains focus. */\n onFocus?: () => void;\n /**\n * Callback fired when the Field Reference looses focus within its containing element.\n * This is not specific to the input element.\n * Note, behavior will be enhanced in an upcoming release and the input will be the only focusable element.\n */\n onBlur?: () => void;\n /**\n * Fired when the user clicks on the dropdown icon to initiate opening the menu.\n * If you want to offer default menu items without an input value, pass this function.\n * This function can be an appropriate time to fetch menu item data.\n * Remember to set the loading prop to true when fetching data for an empty list.\n *\n * @param open value defining whether the click opens or closes the menu\n */\n onDropdownButtonClick?: (open: boolean) => void;\n /** Fired when user clicks on the Field Reference input. */\n onClick?: (e: MouseEvent) => void;\n /** Fired when menu opens. */\n onMenuOpen?: () => void;\n /**\n * Fired before running default component onKeyDown handler.\n * Returning `false` from this function prevents default onKeyDown handling.\n */\n onKeyDown?: (e: ReactKeyboardEvent) => boolean | void;\n /** Ref that can be used to access the imperative handle. */\n handle?: Ref<FieldReferenceHandleValue>;\n /** Reference to the component's root element. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}
|
|
@@ -23,7 +23,7 @@ const FieldReferenceDisplay = forwardRef(function FieldReferenceDisplay({ testId
|
|
|
23
23
|
cols: type ? 'auto 1fr' : 'auto',
|
|
24
24
|
areas: type ? '"primary secondary"' : '"primary"'
|
|
25
25
|
}, children: [_jsxs(Flex, { container: { alignItems: 'center', colGap: 1 }, children: [icon && _jsx(Icon, { "data-testid": testIds.icon, ...icon, size: 's' }), link ? (_jsx(Link, { "data-testid": testIds.fieldPath, ref: setLinkEl, ...link, onClick: link.onClick
|
|
26
|
-
?
|
|
26
|
+
? e => {
|
|
27
27
|
link.onClick?.(e);
|
|
28
28
|
}
|
|
29
29
|
: undefined, children: fieldPath.map(field => field.name).join(' . ') })) : (_jsx(Text, { "data-testid": testIds.fieldPath, children: fieldPath.map(field => field.name).join(' . ') }))] }), type && (_jsx(Flex, { container: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldReferenceDisplay.js","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReferenceDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAGnC,OAAO,EACL,UAAU,EACV,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,WAAW,EACX,OAAO,EACP,OAAO,EACP,IAAI,EACJ,OAAO,EACP,UAAU,EACX,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,+BAA+B,EAAE,MAAM,2BAA2B,CAAC;AAC5E,OAAO,EACL,2BAA2B,EAC3B,+BAA+B,EAC/B,oBAAoB,EACrB,MAAM,yBAAyB,CAAC;AAEjC,MAAM,qBAAqB,GAAG,UAAU,CAAC,SAAS,qBAAqB,CACrE,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAA+C,EAC9F,GAAsC;IAEtC,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,+BAA+B,CAAC,CAAC;IACpE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAkB,CAAC;IAC/D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,UAAU,EAAqB,CAAC;IAE5D,MAAM,IAAI,GACR,CAAC,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,OAAO,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAE,EAAE,MAAM,CAAC;QACtD,CAAC,CAAE,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAY,CAAC,IAAI;QACnC,CAAC,CAAC,SAAS,CAAC;IAChB,MAAM,IAAI,GACR,CAAC,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,OAAO,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAE,EAAE,MAAM,CAAC;QACtD,CAAC,CAAE,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAY,CAAC,IAAI;QACnC,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,CACL,8BACE,KAAC,IAAI,IACH,EAAE,EAAE,2BAA2B,iBAClB,OAAO,CAAC,IAAI,EACzB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE;oBACT,OAAO,EAAE,SAAS;oBAClB,UAAU,EAAE,QAAQ;oBACpB,MAAM,EAAE,GAAG;iBACZ,YAEA,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAClB,8BACE,MAAC,IAAI,IACH,GAAG,EAAE,YAAY,EACjB,EAAE,EAAE,+BAA+B,EACnC,SAAS,EAAE;gCACT,UAAU,EAAE,QAAQ;gCACpB,GAAG,EAAE,CAAC;gCACN,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM;gCAChC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,WAAW;6BAClD,aAED,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,EAAE,aACjD,IAAI,IAAI,KAAC,IAAI,mBAAc,OAAO,CAAC,IAAI,KAAM,IAAI,EAAE,IAAI,EAAC,GAAG,GAAG,EAC9D,IAAI,CAAC,CAAC,CAAC,CACN,KAAC,IAAI,mBACU,OAAO,CAAC,SAAS,EAC9B,GAAG,EAAE,SAAS,KACV,IAAI,EACR,OAAO,EACL,IAAI,CAAC,OAAO;gDACV,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"FieldReferenceDisplay.js","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReferenceDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAGnC,OAAO,EACL,UAAU,EACV,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,WAAW,EACX,OAAO,EACP,OAAO,EACP,IAAI,EACJ,OAAO,EACP,UAAU,EACX,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,+BAA+B,EAAE,MAAM,2BAA2B,CAAC;AAC5E,OAAO,EACL,2BAA2B,EAC3B,+BAA+B,EAC/B,oBAAoB,EACrB,MAAM,yBAAyB,CAAC;AAEjC,MAAM,qBAAqB,GAAG,UAAU,CAAC,SAAS,qBAAqB,CACrE,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAA+C,EAC9F,GAAsC;IAEtC,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,+BAA+B,CAAC,CAAC;IACpE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAkB,CAAC;IAC/D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,UAAU,EAAqB,CAAC;IAE5D,MAAM,IAAI,GACR,CAAC,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,OAAO,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAE,EAAE,MAAM,CAAC;QACtD,CAAC,CAAE,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAY,CAAC,IAAI;QACnC,CAAC,CAAC,SAAS,CAAC;IAChB,MAAM,IAAI,GACR,CAAC,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,OAAO,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAE,EAAE,MAAM,CAAC;QACtD,CAAC,CAAE,SAAS,CAAC,EAAE,CAAC,CAAC,CAAC,CAAY,CAAC,IAAI;QACnC,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,CACL,8BACE,KAAC,IAAI,IACH,EAAE,EAAE,2BAA2B,iBAClB,OAAO,CAAC,IAAI,EACzB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE;oBACT,OAAO,EAAE,SAAS;oBAClB,UAAU,EAAE,QAAQ;oBACpB,MAAM,EAAE,GAAG;iBACZ,YAEA,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAClB,8BACE,MAAC,IAAI,IACH,GAAG,EAAE,YAAY,EACjB,EAAE,EAAE,+BAA+B,EACnC,SAAS,EAAE;gCACT,UAAU,EAAE,QAAQ;gCACpB,GAAG,EAAE,CAAC;gCACN,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM;gCAChC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,WAAW;6BAClD,aAED,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,EAAE,aACjD,IAAI,IAAI,KAAC,IAAI,mBAAc,OAAO,CAAC,IAAI,KAAM,IAAI,EAAE,IAAI,EAAC,GAAG,GAAG,EAC9D,IAAI,CAAC,CAAC,CAAC,CACN,KAAC,IAAI,mBACU,OAAO,CAAC,SAAS,EAC9B,GAAG,EAAE,SAAS,KACV,IAAI,EACR,OAAO,EACL,IAAI,CAAC,OAAO;gDACV,CAAC,CAAC,CAAC,CAAC,EAAE;oDACF,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;gDACpB,CAAC;gDACH,CAAC,CAAC,SAAS,YAGd,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,GAC1C,CACR,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,mBAAc,OAAO,CAAC,SAAS,YACjC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,GAC1C,CACR,IACI,EACN,IAAI,IAAI,CACP,KAAC,IAAI,IACH,SAAS,EAAE;wCACT,OAAO,EAAE,KAAK;qCACf,EACD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YAEjB,KAAC,IAAI,mBAAc,OAAO,CAAC,IAAI,EAAE,OAAO,EAAC,WAAW,YACjD,IAAI,GACA,GACF,CACR,IACI,EACN,OAAO,IAAI,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,GAAI,IACtC,CACJ,CAAC,CAAC,CAAC,CACF,KAAC,OAAO,KAAG,CACZ,GACI,EAEN,WAAW,IAAI,CACd,KAAC,OAAO,IAAC,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,MAAM,CAAC,EAAE,SAAS,EAAC,MAAM,EAAC,cAAc,kBACpF,KAAC,oBAAoB,IAAC,MAAM,EAAE,WAAW,GAAI,GACrC,CACX,IACA,CACJ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC,qBAAqB,EAAE,+BAA+B,CAAC,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef } from 'react';\n\nimport {\n useTestIds,\n Flex,\n Text,\n Icon,\n Grid,\n NoValue,\n withTestIds,\n hasProp,\n Actions,\n Link,\n Tooltip,\n useElement\n} from '@pega/cosmos-react-core';\n\nimport type { Field, FieldReferenceDisplayProps } from './FieldReference.types';\nimport { getFieldReferenceDisplayTestIds } from './FieldReference.test-ids';\nimport {\n StyledFieldReferenceDisplay,\n StyledFieldReferenceDisplayGrid,\n StyledFieldValueList\n} from './FieldReference.styles';\n\nconst FieldReferenceDisplay = forwardRef(function FieldReferenceDisplay(\n { testId, fieldPath, link, actions, tooltipData }: PropsWithoutRef<FieldReferenceDisplayProps>,\n ref: FieldReferenceDisplayProps['ref']\n) {\n const testIds = useTestIds(testId, getFieldReferenceDisplayTestIds);\n const [displayEl, setDisplayEl] = useElement<HTMLDivElement>();\n const [linkEl, setLinkEl] = useElement<HTMLAnchorElement>();\n\n const icon =\n !!fieldPath.at(-1) && hasProp(fieldPath.at(-1)!, 'icon')\n ? (fieldPath.at(-1)! as Field).icon\n : undefined;\n const type =\n !!fieldPath.at(-1) && hasProp(fieldPath.at(-1)!, 'type')\n ? (fieldPath.at(-1)! as Field).type\n : undefined;\n\n return (\n <>\n <Flex\n as={StyledFieldReferenceDisplay}\n data-testid={testIds.root}\n ref={ref}\n container={{\n justify: 'between',\n alignItems: 'center',\n colGap: 0.5\n }}\n >\n {fieldPath.length ? (\n <>\n <Grid\n ref={setDisplayEl}\n as={StyledFieldReferenceDisplayGrid}\n container={{\n alignItems: 'center',\n gap: 1,\n cols: type ? 'auto 1fr' : 'auto',\n areas: type ? '\"primary secondary\"' : '\"primary\"'\n }}\n >\n <Flex container={{ alignItems: 'center', colGap: 1 }}>\n {icon && <Icon data-testid={testIds.icon} {...icon} size='s' />}\n {link ? (\n <Link\n data-testid={testIds.fieldPath}\n ref={setLinkEl}\n {...link}\n onClick={\n link.onClick\n ? e => {\n link.onClick?.(e);\n }\n : undefined\n }\n >\n {fieldPath.map(field => field.name).join(' . ')}\n </Link>\n ) : (\n <Text data-testid={testIds.fieldPath}>\n {fieldPath.map(field => field.name).join(' . ')}\n </Text>\n )}\n </Flex>\n {type && (\n <Flex\n container={{\n justify: 'end'\n }}\n item={{ grow: 1 }}\n >\n <Text data-testid={testIds.type} variant='secondary'>\n {type}\n </Text>\n </Flex>\n )}\n </Grid>\n {actions && <Actions items={actions} />}\n </>\n ) : (\n <NoValue />\n )}\n </Flex>\n\n {tooltipData && (\n <Tooltip target={displayEl} ignoredElements={[linkEl]} hideDelay='none' describeTarget>\n <StyledFieldValueList fields={tooltipData} />\n </Tooltip>\n )}\n </>\n );\n});\n\nexport default withTestIds(FieldReferenceDisplay, getFieldReferenceDisplayTestIds);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldReferenceInput.d.ts","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReferenceInput.tsx"],"names":[],"mappings":"AA+CA,OAAO,KAAK,wBAAwB,MAAM,wBAAwB,CAAC;;;;
|
|
1
|
+
{"version":3,"file":"FieldReferenceInput.d.ts","sourceRoot":"","sources":["../../../src/components/FieldReference/FieldReferenceInput.tsx"],"names":[],"mappings":"AA+CA,OAAO,KAAK,wBAAwB,MAAM,wBAAwB,CAAC;;;;AA2qBnE,wBAA+E"}
|
|
@@ -26,6 +26,7 @@ const FieldReferenceInput = forwardRef(function FieldReferenceInput(props, ref)
|
|
|
26
26
|
const [showDot, setShowDot] = useState(false);
|
|
27
27
|
const [modifyingLeafItem, setModifyingLeafItem] = useState(false);
|
|
28
28
|
const [open, setOpen] = useState(false);
|
|
29
|
+
const [inputFocused, setInputFocused] = useState(false);
|
|
29
30
|
const menuRef = useRef(null);
|
|
30
31
|
const menuComponentId = `${id}-listbox`;
|
|
31
32
|
// Force a re-render to make sure useFocusWithin has valid elements to set listeners on.
|
|
@@ -335,7 +336,7 @@ const FieldReferenceInput = forwardRef(function FieldReferenceInput(props, ref)
|
|
|
335
336
|
if (open) {
|
|
336
337
|
return filterValue;
|
|
337
338
|
}
|
|
338
|
-
if (selected.length > 0) {
|
|
339
|
+
if (selected.length > 0 && !inputFocused) {
|
|
339
340
|
return selected.map(({ name }) => name).join('.');
|
|
340
341
|
}
|
|
341
342
|
return '';
|
|
@@ -366,6 +367,10 @@ const FieldReferenceInput = forwardRef(function FieldReferenceInput(props, ref)
|
|
|
366
367
|
setOpen(true);
|
|
367
368
|
toggleMenuDescendantsActive(true);
|
|
368
369
|
}
|
|
370
|
+
}, onFocus: () => {
|
|
371
|
+
setInputFocused(true);
|
|
372
|
+
}, onBlur: () => {
|
|
373
|
+
setInputFocused(false);
|
|
369
374
|
}, onClick: onInputClick, onKeyDown: onInputKeyDown, onKeyUp: onInputKeyUp, readOnly: readOnly, disabled: disabled, placeholder: !selected.length && !showDot ? placeholder : undefined, autoComplete: 'off', required: required })] }), dropdownButton] }), _jsx(Popover, { ref: popoverRef, show: open, target: containerRef.current, placement: 'bottom-start', modifiers: [fitToContent], strategy: 'fixed', onMouseDown: (e) => e.preventDefault(), onKeyDown: (e) => {
|
|
370
375
|
if (!inputRef.current)
|
|
371
376
|
return;
|