@pega/cosmos-react-build 9.0.0-build.6.14 → 9.0.0-build.6.16

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 (31) hide show
  1. package/lib/components/DynamicInput/BooleanControl.d.ts +1 -1
  2. package/lib/components/DynamicInput/BooleanControl.d.ts.map +1 -1
  3. package/lib/components/DynamicInput/BooleanControl.js.map +1 -1
  4. package/lib/components/DynamicInput/ConstantControl.d.ts +2 -2
  5. package/lib/components/DynamicInput/ConstantControl.d.ts.map +1 -1
  6. package/lib/components/DynamicInput/ConstantControl.js.map +1 -1
  7. package/lib/components/DynamicInput/DynamicInput.styles.d.ts +0 -1
  8. package/lib/components/DynamicInput/DynamicInput.styles.d.ts.map +1 -1
  9. package/lib/components/DynamicInput/DynamicInput.styles.js +49 -43
  10. package/lib/components/DynamicInput/DynamicInput.styles.js.map +1 -1
  11. package/lib/components/Expression/Expression.d.ts +1 -1
  12. package/lib/components/Expression/Expression.d.ts.map +1 -1
  13. package/lib/components/Expression/Expression.js +8 -7
  14. package/lib/components/Expression/Expression.js.map +1 -1
  15. package/lib/components/Expression/Expression.styles.d.ts +5 -1
  16. package/lib/components/Expression/Expression.styles.d.ts.map +1 -1
  17. package/lib/components/Expression/Expression.styles.js +15 -3
  18. package/lib/components/Expression/Expression.styles.js.map +1 -1
  19. package/lib/components/Expression/Expression.test-ids.d.ts +1 -1
  20. package/lib/components/Expression/Expression.test-ids.d.ts.map +1 -1
  21. package/lib/components/Expression/Expression.test-ids.js +2 -1
  22. package/lib/components/Expression/Expression.test-ids.js.map +1 -1
  23. package/lib/components/Expression/ExpressionBuilderModal.d.ts +6 -0
  24. package/lib/components/Expression/ExpressionBuilderModal.d.ts.map +1 -0
  25. package/lib/components/Expression/ExpressionBuilderModal.js +53 -0
  26. package/lib/components/Expression/ExpressionBuilderModal.js.map +1 -0
  27. package/lib/components/ObjectSelect/useCreateModal.d.ts +6 -2
  28. package/lib/components/ObjectSelect/useCreateModal.d.ts.map +1 -1
  29. package/lib/components/ObjectSelect/useCreateModal.js +7 -4
  30. package/lib/components/ObjectSelect/useCreateModal.js.map +1 -1
  31. package/package.json +4 -4
@@ -1,7 +1,7 @@
1
1
  import type { FC } from 'react';
2
2
  import type { ComboBoxProps } from '@pega/cosmos-react-core';
3
3
  import type { ConstantBooleanConfig } from './ConstantControl';
4
- type BooleanControlProps = ConstantBooleanConfig['props'] & Pick<ComboBoxProps, 'required'>;
4
+ type BooleanControlProps = ConstantBooleanConfig['props'] & Pick<ComboBoxProps, 'required' | 'disabled' | 'status' | 'readOnly'>;
5
5
  declare const BooleanControl: FC<BooleanControlProps>;
6
6
  export default BooleanControl;
7
7
  //# sourceMappingURL=BooleanControl.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BooleanControl.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicInput/BooleanControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAG7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAE/D,KAAK,mBAAmB,GAAG,qBAAqB,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC;AAE5F,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAqC3C,CAAC;AAEF,eAAe,cAAc,CAAC"}
1
+ {"version":3,"file":"BooleanControl.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicInput/BooleanControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAG7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAE/D,KAAK,mBAAmB,GAAG,qBAAqB,CAAC,OAAO,CAAC,GACvD,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC,CAAC;AAEvE,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAqC3C,CAAC;AAEF,eAAe,cAAc,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"BooleanControl.js","sourceRoot":"","sources":["../../../src/components/DynamicInput/BooleanControl.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAM5D,MAAM,cAAc,GAA4B,CAAC,EAC/C,aAAa,EACb,KAAK,EACL,QAAQ,EACR,EAAE,EACF,QAAQ,EACR,GAAG,SAAS,EACQ,EAAE,EAAE;IACxB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,SAAS,GACb,aAAa,KAAK,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;IAEzF,MAAM,KAAK,GAAG;QACZ,EAAE,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,KAAK,IAAI,EAAE;QAC/D,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE;KACzD,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,OACH,SAAS,EACb,QAAQ,EAAE;YACR,KAAK,EAAE;gBACL,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE;gBAC9C,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO;aAC3D;SACF,EACD,IAAI,EAAE;YACJ,IAAI,EAAE,eAAe;YACrB,KAAK;YACL,WAAW,EAAE,MAAM,CAAC,EAAE;gBACpB,QAAQ,CAAC,MAAM,KAAK,MAAM,CAAC,CAAC;YAC9B,CAAC;SACF,EACD,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import type { FC } from 'react';\n\nimport type { ComboBoxProps } from '@pega/cosmos-react-core';\nimport { ComboBox, useI18n } from '@pega/cosmos-react-core';\n\nimport type { ConstantBooleanConfig } from './ConstantControl';\n\ntype BooleanControlProps = ConstantBooleanConfig['props'] & Pick<ComboBoxProps, 'required'>;\n\nconst BooleanControl: FC<BooleanControlProps> = ({\n booleanLabels,\n value,\n onChange,\n id,\n required,\n ...restProps\n}: BooleanControlProps) => {\n const t = useI18n();\n const primaries =\n booleanLabels === 'always|never' ? [t('always'), t('never')] : [t('true'), t('false')];\n\n const items = [\n { id: 'true', primary: primaries[0], selected: value === true },\n { id: 'false', primary: primaries[1], selected: !value }\n ];\n\n return (\n <ComboBox\n {...restProps}\n selected={{\n items: {\n id: value === true ? items[0].id : items[1].id,\n text: value === true ? items[0].primary : items[1].primary\n }\n }}\n menu={{\n mode: 'single-select',\n items,\n onItemClick: itemId => {\n onChange(itemId === 'true');\n }\n }}\n id={id}\n required={required}\n />\n );\n};\n\nexport default BooleanControl;\n"]}
1
+ {"version":3,"file":"BooleanControl.js","sourceRoot":"","sources":["../../../src/components/DynamicInput/BooleanControl.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAO5D,MAAM,cAAc,GAA4B,CAAC,EAC/C,aAAa,EACb,KAAK,EACL,QAAQ,EACR,EAAE,EACF,QAAQ,EACR,GAAG,SAAS,EACQ,EAAE,EAAE;IACxB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,SAAS,GACb,aAAa,KAAK,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;IAEzF,MAAM,KAAK,GAAG;QACZ,EAAE,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,KAAK,IAAI,EAAE;QAC/D,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE;KACzD,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,OACH,SAAS,EACb,QAAQ,EAAE;YACR,KAAK,EAAE;gBACL,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE;gBAC9C,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO;aAC3D;SACF,EACD,IAAI,EAAE;YACJ,IAAI,EAAE,eAAe;YACrB,KAAK;YACL,WAAW,EAAE,MAAM,CAAC,EAAE;gBACpB,QAAQ,CAAC,MAAM,KAAK,MAAM,CAAC,CAAC;YAC9B,CAAC;SACF,EACD,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import type { FC } from 'react';\n\nimport type { ComboBoxProps } from '@pega/cosmos-react-core';\nimport { ComboBox, useI18n } from '@pega/cosmos-react-core';\n\nimport type { ConstantBooleanConfig } from './ConstantControl';\n\ntype BooleanControlProps = ConstantBooleanConfig['props'] &\n Pick<ComboBoxProps, 'required' | 'disabled' | 'status' | 'readOnly'>;\n\nconst BooleanControl: FC<BooleanControlProps> = ({\n booleanLabels,\n value,\n onChange,\n id,\n required,\n ...restProps\n}: BooleanControlProps) => {\n const t = useI18n();\n const primaries =\n booleanLabels === 'always|never' ? [t('always'), t('never')] : [t('true'), t('false')];\n\n const items = [\n { id: 'true', primary: primaries[0], selected: value === true },\n { id: 'false', primary: primaries[1], selected: !value }\n ];\n\n return (\n <ComboBox\n {...restProps}\n selected={{\n items: {\n id: value === true ? items[0].id : items[1].id,\n text: value === true ? items[0].primary : items[1].primary\n }\n }}\n menu={{\n mode: 'single-select',\n items,\n onItemClick: itemId => {\n onChange(itemId === 'true');\n }\n }}\n id={id}\n required={required}\n />\n );\n};\n\nexport default BooleanControl;\n"]}
@@ -1,5 +1,5 @@
1
1
  import type { ComboBoxProps, CurrencyInputProps, DateInputProps, DateTimeInputProps, FormControlProps, InputProps, NumberInputProps, OmitStrict, PhoneInputProps, TextAreaProps, TimeInputProps } from '@pega/cosmos-react-core';
2
- export type FormControlPropsToOmit = keyof Pick<FormControlProps, 'label' | 'labelHidden' | 'additionalInfo' | 'info' | 'required' | 'status' | 'readOnly' | 'disabled'>;
2
+ export type FormControlPropsToOmit = keyof Pick<FormControlProps, 'label' | 'labelHidden' | 'additionalInfo' | 'info' | 'required'>;
3
3
  type ConstantTextConfig = {
4
4
  format: 'Text';
5
5
  props: OmitStrict<InputProps, FormControlPropsToOmit | 'onChange'> & {
@@ -54,7 +54,7 @@ type ConstantPhoneConfig = {
54
54
  props: OmitStrict<PhoneInputProps, FormControlPropsToOmit | 'showCountryCode'>;
55
55
  };
56
56
  export type ConstantControlConfig = ConstantTextConfig | ConstantDecimalConfig | ConstantIntegerConfig | ConstantPercentageConfig | ConstantTextAreaConfig | ConstantDateConfig | ConstantDateTimeConfig | ConstantTimeConfig | ConstantBooleanConfig | ConstantCurrencyConfig | ConstantPhoneConfig;
57
- declare const ConstantControl: ({ format, props, required, "data-testid": testId, id: inputUid }: Pick<FormControlProps, "id" | "required"> & {
57
+ declare const ConstantControl: ({ format, props, required, "data-testid": testId, id: inputUid }: Pick<FormControlProps, "id" | "required" | "disabled" | "status" | "readOnly"> & {
58
58
  "data-testid"?: string;
59
59
  } & ConstantControlConfig) => JSX.Element | null;
60
60
  export default ConstantControl;
@@ -1 +1 @@
1
- {"version":3,"file":"ConstantControl.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicInput/ConstantControl.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ConstantControl.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicInput/ConstantControl.tsx"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"ConstantControl.js","sourceRoot":"","sources":["../../../src/components/DynamicInput/ConstantControl.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { ChangeEvent } from 'react';\n\nimport {\n CurrencyInput,\n DateInput,\n DateTimeInput,\n Input,\n NumberInput,\n PhoneInput,\n TextArea,\n TimeInput\n} from '@pega/cosmos-react-core';\nimport type {\n ComboBoxProps,\n CurrencyInputProps,\n DateInputProps,\n DateTimeInputProps,\n FormControlProps,\n InputProps,\n NumberInputProps,\n OmitStrict,\n PhoneInputProps,\n TextAreaProps,\n TimeInputProps\n} from '@pega/cosmos-react-core';\n\nimport BooleanControl from './BooleanControl';\n\nexport type FormControlPropsToOmit = keyof Pick<\n FormControlProps,\n | 'label'\n | 'labelHidden'\n | 'additionalInfo'\n | 'info'\n | 'required'\n | 'status'\n | 'readOnly'\n | 'disabled'\n>;\n\ntype ConstantTextConfig = {\n format: 'Text';\n props: OmitStrict<InputProps, FormControlPropsToOmit | 'onChange'> & {\n onChange: (value: string | undefined) => void;\n };\n};\n\ntype ConstantDecimalConfig = {\n format: 'Decimal';\n props: OmitStrict<NumberInputProps, FormControlPropsToOmit>;\n};\n\ntype ConstantIntegerConfig = {\n format: 'Integer';\n props: OmitStrict<\n NumberInputProps,\n FormControlPropsToOmit | 'showGroupSeparators' | 'showDecimal'\n >;\n};\n\ntype ConstantPercentageConfig = {\n format: 'Percentage';\n props: OmitStrict<\n NumberInputProps,\n FormControlPropsToOmit | 'showGroupSeparators' | 'numberOfDecimals' | 'unit'\n >;\n};\n\ntype ConstantTextAreaConfig = {\n format: 'Text (paragraph)';\n props: OmitStrict<TextAreaProps, FormControlPropsToOmit | 'onChange'> & {\n onChange: (value: string | undefined) => void;\n };\n};\n\ntype ConstantDateConfig = {\n format: 'Date';\n props: OmitStrict<DateInputProps, FormControlPropsToOmit>;\n};\n\ntype ConstantDateTimeConfig = {\n format: 'DateTime';\n props: OmitStrict<DateTimeInputProps, FormControlPropsToOmit>;\n};\n\ntype ConstantTimeConfig = {\n format: 'Time';\n props: OmitStrict<TimeInputProps, FormControlPropsToOmit>;\n};\n\nexport type BooleanLabels = 'true|false' | 'always|never';\n\nexport type ConstantBooleanConfig = {\n format: 'Boolean';\n props: OmitStrict<ComboBoxProps, FormControlPropsToOmit | 'value' | 'onChange'> & {\n value?: boolean;\n onChange: (value: boolean) => void;\n booleanLabels?: BooleanLabels;\n };\n};\n\ntype ConstantCurrencyConfig = {\n format: 'Currency';\n props: OmitStrict<CurrencyInputProps, FormControlPropsToOmit>;\n};\n\ntype ConstantPhoneConfig = {\n format: 'Phone';\n props: OmitStrict<PhoneInputProps, FormControlPropsToOmit | 'showCountryCode'>;\n};\n\nexport type ConstantControlConfig =\n | ConstantTextConfig\n | ConstantDecimalConfig\n | ConstantIntegerConfig\n | ConstantPercentageConfig\n | ConstantTextAreaConfig\n | ConstantDateConfig\n | ConstantDateTimeConfig\n | ConstantTimeConfig\n | ConstantBooleanConfig\n | ConstantCurrencyConfig\n | ConstantPhoneConfig;\n\nconst ConstantControl = ({\n format,\n props,\n required,\n 'data-testid': testId,\n id: inputUid\n}: Pick<FormControlProps, 'id' | 'required'> & {\n 'data-testid'?: string;\n} & ConstantControlConfig) => {\n let control: JSX.Element | null = null;\n\n const { value } = props;\n // Note: This is just a typeguard for the value prop.\n if (typeof value === 'string' || value === undefined) {\n if (format === 'Text') {\n control = (\n <Input\n {...props}\n data-testid={testId}\n id={inputUid}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n props.onChange(e.target.value);\n }}\n required={required}\n />\n );\n }\n\n if (format === 'Text (paragraph)') {\n control = (\n <TextArea\n {...props}\n data-testid={testId}\n id={inputUid}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => {\n props.onChange(e.target.value);\n }}\n required={required}\n />\n );\n }\n\n if (format === 'Currency') {\n control = <CurrencyInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n if (format === 'Percentage') {\n control = (\n <NumberInput\n {...props}\n data-testid={testId}\n id={inputUid}\n showGroupSeparators={false}\n numberOfDecimals={undefined}\n unit='percent'\n required={required}\n />\n );\n }\n\n if (format === 'Integer') {\n control = (\n <NumberInput\n {...props}\n data-testid={testId}\n id={inputUid}\n showGroupSeparators={false}\n // Note: Getting single occurrence of callback when '.' is entered w/o showDecimal = false.\n showDecimal={false}\n required={required}\n />\n );\n }\n\n if (format === 'Decimal') {\n control = <NumberInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n if (format === 'Phone') {\n control = (\n <PhoneInput\n {...props}\n data-testid={testId}\n id={inputUid}\n required={required}\n showCountryCode\n />\n );\n }\n }\n\n if (format === 'Boolean') {\n control = <BooleanControl {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n // Note: This is just a typeguard for the value prop.\n if (\n typeof value === 'string' ||\n typeof value === 'number' ||\n value instanceof Date ||\n value === undefined\n ) {\n if (format === 'DateTime') {\n control = <DateTimeInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n if (format === 'Date') {\n control = <DateInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n if (format === 'Time') {\n control = <TimeInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n }\n return control;\n};\n\nexport default ConstantControl;\n"]}
1
+ {"version":3,"file":"ConstantControl.js","sourceRoot":"","sources":["../../../src/components/DynamicInput/ConstantControl.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { ChangeEvent } from 'react';\n\nimport {\n CurrencyInput,\n DateInput,\n DateTimeInput,\n Input,\n NumberInput,\n PhoneInput,\n TextArea,\n TimeInput\n} from '@pega/cosmos-react-core';\nimport type {\n ComboBoxProps,\n CurrencyInputProps,\n DateInputProps,\n DateTimeInputProps,\n FormControlProps,\n InputProps,\n NumberInputProps,\n OmitStrict,\n PhoneInputProps,\n TextAreaProps,\n TimeInputProps\n} from '@pega/cosmos-react-core';\n\nimport BooleanControl from './BooleanControl';\n\nexport type FormControlPropsToOmit = keyof Pick<\n FormControlProps,\n 'label' | 'labelHidden' | 'additionalInfo' | 'info' | 'required'\n>;\n\ntype ConstantTextConfig = {\n format: 'Text';\n props: OmitStrict<InputProps, FormControlPropsToOmit | 'onChange'> & {\n onChange: (value: string | undefined) => void;\n };\n};\n\ntype ConstantDecimalConfig = {\n format: 'Decimal';\n props: OmitStrict<NumberInputProps, FormControlPropsToOmit>;\n};\n\ntype ConstantIntegerConfig = {\n format: 'Integer';\n props: OmitStrict<\n NumberInputProps,\n FormControlPropsToOmit | 'showGroupSeparators' | 'showDecimal'\n >;\n};\n\ntype ConstantPercentageConfig = {\n format: 'Percentage';\n props: OmitStrict<\n NumberInputProps,\n FormControlPropsToOmit | 'showGroupSeparators' | 'numberOfDecimals' | 'unit'\n >;\n};\n\ntype ConstantTextAreaConfig = {\n format: 'Text (paragraph)';\n props: OmitStrict<TextAreaProps, FormControlPropsToOmit | 'onChange'> & {\n onChange: (value: string | undefined) => void;\n };\n};\n\ntype ConstantDateConfig = {\n format: 'Date';\n props: OmitStrict<DateInputProps, FormControlPropsToOmit>;\n};\n\ntype ConstantDateTimeConfig = {\n format: 'DateTime';\n props: OmitStrict<DateTimeInputProps, FormControlPropsToOmit>;\n};\n\ntype ConstantTimeConfig = {\n format: 'Time';\n props: OmitStrict<TimeInputProps, FormControlPropsToOmit>;\n};\n\nexport type BooleanLabels = 'true|false' | 'always|never';\n\nexport type ConstantBooleanConfig = {\n format: 'Boolean';\n props: OmitStrict<ComboBoxProps, FormControlPropsToOmit | 'value' | 'onChange'> & {\n value?: boolean;\n onChange: (value: boolean) => void;\n booleanLabels?: BooleanLabels;\n };\n};\n\ntype ConstantCurrencyConfig = {\n format: 'Currency';\n props: OmitStrict<CurrencyInputProps, FormControlPropsToOmit>;\n};\n\ntype ConstantPhoneConfig = {\n format: 'Phone';\n props: OmitStrict<PhoneInputProps, FormControlPropsToOmit | 'showCountryCode'>;\n};\n\nexport type ConstantControlConfig =\n | ConstantTextConfig\n | ConstantDecimalConfig\n | ConstantIntegerConfig\n | ConstantPercentageConfig\n | ConstantTextAreaConfig\n | ConstantDateConfig\n | ConstantDateTimeConfig\n | ConstantTimeConfig\n | ConstantBooleanConfig\n | ConstantCurrencyConfig\n | ConstantPhoneConfig;\n\nconst ConstantControl = ({\n format,\n props,\n required,\n 'data-testid': testId,\n id: inputUid\n}: Pick<FormControlProps, 'id' | 'required' | 'disabled' | 'status' | 'readOnly'> & {\n 'data-testid'?: string;\n} & ConstantControlConfig) => {\n let control: JSX.Element | null = null;\n\n const { value } = props;\n // Note: This is just a typeguard for the value prop.\n if (typeof value === 'string' || value === undefined) {\n if (format === 'Text') {\n control = (\n <Input\n {...props}\n data-testid={testId}\n id={inputUid}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n props.onChange(e.target.value);\n }}\n required={required}\n />\n );\n }\n\n if (format === 'Text (paragraph)') {\n control = (\n <TextArea\n {...props}\n data-testid={testId}\n id={inputUid}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => {\n props.onChange(e.target.value);\n }}\n required={required}\n />\n );\n }\n\n if (format === 'Currency') {\n control = <CurrencyInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n if (format === 'Percentage') {\n control = (\n <NumberInput\n {...props}\n data-testid={testId}\n id={inputUid}\n showGroupSeparators={false}\n numberOfDecimals={undefined}\n unit='percent'\n required={required}\n />\n );\n }\n\n if (format === 'Integer') {\n control = (\n <NumberInput\n {...props}\n data-testid={testId}\n id={inputUid}\n showGroupSeparators={false}\n // Note: Getting single occurrence of callback when '.' is entered w/o showDecimal = false.\n showDecimal={false}\n required={required}\n />\n );\n }\n\n if (format === 'Decimal') {\n control = <NumberInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n if (format === 'Phone') {\n control = (\n <PhoneInput\n {...props}\n data-testid={testId}\n id={inputUid}\n required={required}\n showCountryCode\n />\n );\n }\n }\n\n if (format === 'Boolean') {\n control = <BooleanControl {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n // Note: This is just a typeguard for the value prop.\n if (\n typeof value === 'string' ||\n typeof value === 'number' ||\n value instanceof Date ||\n value === undefined\n ) {\n if (format === 'DateTime') {\n control = <DateTimeInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n if (format === 'Date') {\n control = <DateInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n\n if (format === 'Time') {\n control = <TimeInput {...props} data-testid={testId} id={inputUid} required={required} />;\n }\n }\n return control;\n};\n\nexport default ConstantControl;\n"]}
@@ -1,4 +1,3 @@
1
- export declare const StyledExpressionBuilderButton: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").ButtonProps>, import("styled-components").DefaultTheme, {}, never>;
2
1
  export declare const StyledExpressionControl: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").FlexProps>, import("styled-components").DefaultTheme, {}, never>;
3
2
  export declare const StyledDynamicInput: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
4
3
  //# sourceMappingURL=DynamicInput.styles.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"DynamicInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicInput/DynamicInput.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,6BAA6B,oNAAmB,CAAC;AAC9D,eAAO,MAAM,uBAAuB,kNAAiB,CAAC;AAEtD,eAAO,MAAM,kBAAkB,yGAqD7B,CAAC"}
1
+ {"version":3,"file":"DynamicInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicInput/DynamicInput.styles.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,uBAAuB,kNAAiB,CAAC;AAEtD,eAAO,MAAM,kBAAkB,yGAsE9B,CAAC"}
@@ -1,61 +1,67 @@
1
1
  import styled, { css } from 'styled-components';
2
- import { Button, Flex, StyledFormControl, defaultThemeProp } from '@pega/cosmos-react-core';
2
+ import { Flex, StyledFormControl, StyledGrid, defaultThemeProp } from '@pega/cosmos-react-core';
3
3
  import { StyledMenuButton } from '@pega/cosmos-react-core/lib/components/MenuButton/MenuButton';
4
- export const StyledExpressionBuilderButton = styled(Button) ``;
4
+ import { StyledContentWrapper, StyledInputTree } from '../ObjectSelect/InputTree/InputTree.styles';
5
+ import { StyledFieldReferenceInput, StyledFieldReferencePicker } from '../FieldReference/FieldReference.styles';
5
6
  export const StyledExpressionControl = styled(Flex) ``;
6
- export const StyledDynamicInput = styled.div(({ theme }) => {
7
+ export const StyledDynamicInput = styled.div(({ theme: { base: { palette: { 'foreground-color': foregroundColor }, 'content-width': contentWidth }, components: { 'form-control': { 'border-color': formControlBorderColor } } } }) => {
7
8
  return css `
8
- display: flex;
9
+ display: flex;
9
10
 
10
- ${StyledFormControl} {
11
- border-start-start-radius: 0;
12
- border-end-start-radius: 0;
13
- width: 100%;
14
- }
11
+ ${StyledInputTree} {
12
+ margin-inline-start: -2.5rem;
13
+ }
15
14
 
16
- ${StyledExpressionControl} {
17
- position: relative;
18
- z-index: 1;
15
+ ${StyledFieldReferencePicker} > ${StyledFieldReferenceInput} > ${StyledGrid} {
16
+ padding: 0;
17
+ }
19
18
 
20
- .react-codemirror2 {
21
- min-height: 0;
19
+ ${StyledContentWrapper} {
20
+ padding-block-start: 0;
22
21
  }
23
22
 
24
- .CodeMirror,
25
- .CodeMirror-wrap {
26
- border-color: ${theme.components['form-control']['border-color']};
23
+ ${StyledFormControl} {
27
24
  border-start-start-radius: 0;
28
25
  border-end-start-radius: 0;
26
+ width: 100%;
29
27
  }
30
28
 
31
- ${StyledExpressionBuilderButton} {
32
- position: absolute;
33
- z-index: 2;
34
- inset-block-start: 0.0625rem;
35
- inset-inline-end: 0.0625rem;
36
- border-start-start-radius: 0;
37
- border-end-start-radius: 0;
29
+ ${StyledExpressionControl} {
30
+ position: relative;
31
+ z-index: 1;
32
+
33
+ .react-codemirror2 {
34
+ min-height: 0;
35
+ }
36
+
37
+ .CodeMirror,
38
+ .CodeMirror-wrap {
39
+ border-color: ${formControlBorderColor};
40
+ border-start-start-radius: 0;
41
+ border-end-start-radius: 0;
42
+ }
43
+ }
44
+
45
+ ${StyledMenuButton} {
46
+ z-index: 0;
47
+ border-inline-end: 0;
48
+ border-color: ${formControlBorderColor};
49
+ border-start-end-radius: 0;
50
+ border-end-end-radius: 0;
51
+ align-self: flex-start;
52
+ color: ${foregroundColor};
53
+ &:focus {
54
+ z-index: 2;
55
+ }
38
56
  }
39
- }
40
-
41
- ${StyledMenuButton} {
42
- z-index: 0;
43
- border-inline-end: 0;
44
- border-color: ${theme.components['form-control']['border-color']};
45
- border-start-end-radius: 0;
46
- border-end-end-radius: 0;
47
- color: ${theme.base.palette['foreground-color']};
48
- &:focus {
49
- z-index: 2;
57
+
58
+ ${StyledMenuButton} + * {
59
+ flex-grow: 1;
60
+ z-index: 1;
61
+ width: 100%;
62
+ min-width: ${contentWidth.xs};
50
63
  }
51
- }
52
-
53
- ${StyledMenuButton} + * {
54
- flex-grow: 1;
55
- z-index: 1;
56
- min-width: ${theme.base['content-width'].xs};
57
- }
58
- `;
64
+ `;
59
65
  });
60
66
  StyledDynamicInput.defaultProps = defaultThemeProp;
61
67
  //# sourceMappingURL=DynamicInput.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DynamicInput.styles.js","sourceRoot":"","sources":["../../../src/components/DynamicInput/DynamicInput.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC5F,OAAO,EAAE,gBAAgB,EAAE,MAAM,8DAA8D,CAAC;AAEhG,MAAM,CAAC,MAAM,6BAA6B,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA,EAAE,CAAC;AAC9D,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA,EAAE,CAAC;AAEtD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACzD,OAAO,GAAG,CAAA;;;MAGN,iBAAiB;;;;;;MAMjB,uBAAuB;;;;;;;;;;wBAUL,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;;;;;QAKhE,6BAA6B;;;;;;;;;;MAU/B,gBAAgB;;;sBAGA,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;;;eAGvD,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC;;;;;;MAM/C,gBAAgB;;;mBAGH,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;;GAE9C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { Button, Flex, StyledFormControl, defaultThemeProp } from '@pega/cosmos-react-core';\nimport { StyledMenuButton } from '@pega/cosmos-react-core/lib/components/MenuButton/MenuButton';\n\nexport const StyledExpressionBuilderButton = styled(Button)``;\nexport const StyledExpressionControl = styled(Flex)``;\n\nexport const StyledDynamicInput = styled.div(({ theme }) => {\n return css`\n display: flex;\n\n ${StyledFormControl} {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n width: 100%;\n }\n\n ${StyledExpressionControl} {\n position: relative;\n z-index: 1;\n\n .react-codemirror2 {\n min-height: 0;\n }\n\n .CodeMirror,\n .CodeMirror-wrap {\n border-color: ${theme.components['form-control']['border-color']};\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n\n ${StyledExpressionBuilderButton} {\n position: absolute;\n z-index: 2;\n inset-block-start: 0.0625rem;\n inset-inline-end: 0.0625rem;\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n }\n\n ${StyledMenuButton} {\n z-index: 0;\n border-inline-end: 0;\n border-color: ${theme.components['form-control']['border-color']};\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n color: ${theme.base.palette['foreground-color']};\n &:focus {\n z-index: 2;\n }\n }\n\n ${StyledMenuButton} + * {\n flex-grow: 1;\n z-index: 1;\n min-width: ${theme.base['content-width'].xs};\n }\n `;\n});\n\nStyledDynamicInput.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"DynamicInput.styles.js","sourceRoot":"","sources":["../../../src/components/DynamicInput/DynamicInput.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAChG,OAAO,EAAE,gBAAgB,EAAE,MAAM,8DAA8D,CAAC;AAEhG,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,4CAA4C,CAAC;AACnG,OAAO,EACL,yBAAyB,EACzB,0BAA0B,EAC3B,MAAM,yCAAyC,CAAC;AAEjD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA,EAAE,CAAC;AAEtD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAC1C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,kBAAkB,EAAE,eAAe,EAAE,EAChD,eAAe,EAAE,YAAY,EAC9B,EACD,UAAU,EAAE,EACV,cAAc,EAAE,EAAE,cAAc,EAAE,sBAAsB,EAAE,EAC3D,EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;QAGN,eAAe;;;;QAIf,0BAA0B,MAAM,yBAAyB,MAAM,UAAU;;;;QAIzE,oBAAoB;;;;QAIpB,iBAAiB;;;;;;QAMjB,uBAAuB;;;;;;;;;;0BAUL,sBAAsB;;;;;;QAMxC,gBAAgB;;;wBAGA,sBAAsB;;;;iBAI7B,eAAe;;;;;;QAMxB,gBAAgB;;;;qBAIH,YAAY,CAAC,EAAE;;KAE/B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { Flex, StyledFormControl, StyledGrid, defaultThemeProp } from '@pega/cosmos-react-core';\nimport { StyledMenuButton } from '@pega/cosmos-react-core/lib/components/MenuButton/MenuButton';\n\nimport { StyledContentWrapper, StyledInputTree } from '../ObjectSelect/InputTree/InputTree.styles';\nimport {\n StyledFieldReferenceInput,\n StyledFieldReferencePicker\n} from '../FieldReference/FieldReference.styles';\n\nexport const StyledExpressionControl = styled(Flex)``;\n\nexport const StyledDynamicInput = styled.div(\n ({\n theme: {\n base: {\n palette: { 'foreground-color': foregroundColor },\n 'content-width': contentWidth\n },\n components: {\n 'form-control': { 'border-color': formControlBorderColor }\n }\n }\n }) => {\n return css`\n display: flex;\n\n ${StyledInputTree} {\n margin-inline-start: -2.5rem;\n }\n\n ${StyledFieldReferencePicker} > ${StyledFieldReferenceInput} > ${StyledGrid} {\n padding: 0;\n }\n\n ${StyledContentWrapper} {\n padding-block-start: 0;\n }\n\n ${StyledFormControl} {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n width: 100%;\n }\n\n ${StyledExpressionControl} {\n position: relative;\n z-index: 1;\n\n .react-codemirror2 {\n min-height: 0;\n }\n\n .CodeMirror,\n .CodeMirror-wrap {\n border-color: ${formControlBorderColor};\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n }\n\n ${StyledMenuButton} {\n z-index: 0;\n border-inline-end: 0;\n border-color: ${formControlBorderColor};\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n align-self: flex-start;\n color: ${foregroundColor};\n &:focus {\n z-index: 2;\n }\n }\n\n ${StyledMenuButton} + * {\n flex-grow: 1;\n z-index: 1;\n width: 100%;\n min-width: ${contentWidth.xs};\n }\n `;\n }\n);\n\nStyledDynamicInput.defaultProps = defaultThemeProp;\n"]}
@@ -1,6 +1,6 @@
1
1
  import type { ExpressionProps } from './Expression.types';
2
2
  declare const _default: import("react").ForwardRefExoticComponent<Omit<ExpressionProps, "ref"> & import("react").RefAttributes<import("./Expression.types").ExpressionRefInterface>> & {
3
- getTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["expression-input", "expression-menu-popover", "expression-builder-error-banner"]>;
3
+ getTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["expression-input", "expression-menu-popover", "expression-builder-error-banner", "progress-builder"]>;
4
4
  };
5
5
  export default _default;
6
6
  //# sourceMappingURL=Expression.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Expression.d.ts","sourceRoot":"","sources":["../../../src/components/Expression/Expression.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;;;;AAwH1D,wBAA6D"}
1
+ {"version":3,"file":"Expression.d.ts","sourceRoot":"","sources":["../../../src/components/Expression/Expression.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;;;;AAwI1D,wBAA6D"}
@@ -1,9 +1,10 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useRef, useImperativeHandle, forwardRef } from 'react';
3
3
  import { useTestIds, withTestIds, FormField, StyledFormControl, useI18n } from '@pega/cosmos-react-core';
4
4
  import { getExpressionTestIds } from './Expression.test-ids';
5
5
  import { StyledCodeEditor, StyledFlex } from './Expression.styles';
6
- const Expression = forwardRef(({ testId, label, labelHidden, readOnly, required, value, status, info, placeholder, additionalInfo, disabled, hideFormField = false, editorInput: { fetchSuggestions, handle, loading, onChange, onBlur, inLineErrors }, id, ...restProps }, ref) => {
6
+ import ExpressionBuilderModal from './ExpressionBuilderModal';
7
+ const Expression = forwardRef(({ testId, label, labelHidden, readOnly, required, value, status, info, placeholder, additionalInfo, disabled, showExpBuilderIcon, onExpBuilderShowHandler, showExpressionBuilder, expressionBuilder, hideFormField = false, editorInput: { fetchSuggestions, handle, loading, onChange, onBlur, inLineErrors }, id, ...restProps }, ref) => {
7
8
  const textElRef = useRef(null);
8
9
  const popOverReference = useRef(null);
9
10
  const codeEditorHandle = useRef(null);
@@ -25,11 +26,11 @@ const Expression = forwardRef(({ testId, label, labelHidden, readOnly, required,
25
26
  getPopOverRef: () => popOverReference.current,
26
27
  getExpressionRef: () => expressionRef.current
27
28
  }), []);
28
- const Comp = (_jsx(StyledFormControl, { container: true, as: StyledFlex, status: status, readOnly: readOnly, disabled: disabled, ref: expressionRef, "data-testid": testIds.root, children: _jsx(StyledCodeEditor, { testId: testIds.expressionInput, isSingleLine: true, fetchSuggestions: fetchSuggestions, codeEditorHandle: codeEditorHandle, defaultValue: value, loading: loading, readOnly: readOnly, onChange: onChange, onBlur: onBlur, inLineErrors: inLineErrors, autoCompleteTriggers: ['.', '@', '#', ':', '(', ')'], editorConfigProps: {
29
- mode: 'expression',
30
- readOnly,
31
- placeholder
32
- }, "aria-label": t('expression_input') }) }));
29
+ const Comp = (_jsxs(StyledFormControl, { container: true, inline: true, as: StyledFlex, status: status, readOnly: readOnly, disabled: disabled, ref: expressionRef, "data-testid": testIds.root, children: [_jsx(StyledCodeEditor, { testId: testIds.expressionInput, isSingleLine: true, fetchSuggestions: fetchSuggestions, codeEditorHandle: codeEditorHandle, defaultValue: value, loading: loading, readOnly: readOnly, onChange: onChange, onBlur: onBlur, inLineErrors: inLineErrors, autoCompleteTriggers: ['.', '@', '#', ':', '(', ')'], editorConfigProps: {
30
+ mode: 'expression',
31
+ readOnly,
32
+ placeholder
33
+ }, "aria-label": t('expression_input') }), showExpBuilderIcon && (_jsx(ExpressionBuilderModal, { testId: testId, expressionBuilder: expressionBuilder, showExpressionBuilder: showExpressionBuilder, readOnly: readOnly, disabled: disabled, onExpBuilderShowHandler: onExpBuilderShowHandler }))] }));
33
34
  return !hideFormField ? (_jsx(FormField, { ...restProps, label: label, labelHidden: labelHidden, required: required, readOnly: readOnly, status: status, info: info, disabled: disabled, additionalInfo: additionalInfo, id: id, children: Comp })) : (Comp);
34
35
  });
35
36
  export default withTestIds(Expression, getExpressionTestIds);
@@ -1 +1 @@
1
- {"version":3,"file":"Expression.js","sourceRoot":"","sources":["../../../src/components/Expression/Expression.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useImperativeHandle, forwardRef, type PropsWithoutRef } from 'react';\n\nimport {\n useTestIds,\n withTestIds,\n FormField,\n StyledFormControl,\n useI18n\n} from '@pega/cosmos-react-core';\n\nimport type { EditorState, CustomPositionProps } from '../ExpressionBuilder';\n\nimport { getExpressionTestIds } from './Expression.test-ids';\nimport type { ExpressionProps } from './Expression.types';\nimport { StyledCodeEditor, StyledFlex } from './Expression.styles';\n\nconst Expression = forwardRef(\n (\n {\n testId,\n label,\n labelHidden,\n readOnly,\n required,\n value,\n status,\n info,\n placeholder,\n additionalInfo,\n disabled,\n hideFormField = false,\n editorInput: { fetchSuggestions, handle, loading, onChange, onBlur, inLineErrors },\n id,\n ...restProps\n }: PropsWithoutRef<ExpressionProps>,\n ref: ExpressionProps['ref']\n ) => {\n const textElRef = useRef<HTMLInputElement>(null);\n const popOverReference = useRef<HTMLDivElement>(null);\n const codeEditorHandle = useRef<EditorState>(null);\n const expressionRef = useRef<HTMLDivElement>(null);\n const t = useI18n();\n\n const testIds = useTestIds(testId, getExpressionTestIds);\n\n const getExpression = () => {\n return codeEditorHandle.current?.getValue() || '';\n };\n\n const insertExpression = (\n expression: string,\n replaceContent?: boolean,\n customCursorPosition?: CustomPositionProps\n ) => {\n return codeEditorHandle.current?.insertText(\n expression ?? '',\n replaceContent ?? true,\n customCursorPosition\n );\n };\n\n useImperativeHandle(\n handle,\n () => ({\n getExpression,\n insertExpression\n }),\n [getExpression]\n );\n\n useImperativeHandle(\n ref,\n () => ({\n getTextElRef: () => textElRef.current,\n getPopOverRef: () => popOverReference.current,\n getExpressionRef: () => expressionRef.current\n }),\n []\n );\n\n const Comp = (\n <StyledFormControl\n container\n as={StyledFlex}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n ref={expressionRef}\n data-testid={testIds.root}\n >\n <StyledCodeEditor\n testId={testIds.expressionInput}\n isSingleLine\n fetchSuggestions={fetchSuggestions}\n codeEditorHandle={codeEditorHandle}\n defaultValue={value}\n loading={loading}\n readOnly={readOnly}\n onChange={onChange}\n onBlur={onBlur}\n inLineErrors={inLineErrors}\n autoCompleteTriggers={['.', '@', '#', ':', '(', ')']}\n editorConfigProps={{\n mode: 'expression',\n readOnly,\n placeholder\n }}\n aria-label={t('expression_input')}\n />\n </StyledFormControl>\n );\n\n return !hideFormField ? (\n <FormField\n {...restProps}\n label={label}\n labelHidden={labelHidden}\n required={required}\n readOnly={readOnly}\n status={status}\n info={info}\n disabled={disabled}\n additionalInfo={additionalInfo}\n id={id}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default withTestIds(Expression, getExpressionTestIds);\n"]}
1
+ {"version":3,"file":"Expression.js","sourceRoot":"","sources":["../../../src/components/Expression/Expression.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useImperativeHandle, forwardRef, type PropsWithoutRef } from 'react';\n\nimport {\n useTestIds,\n withTestIds,\n FormField,\n StyledFormControl,\n useI18n\n} from '@pega/cosmos-react-core';\n\nimport type { EditorState, CustomPositionProps } from '../ExpressionBuilder';\n\nimport { getExpressionTestIds } from './Expression.test-ids';\nimport type { ExpressionProps } from './Expression.types';\nimport { StyledCodeEditor, StyledFlex } from './Expression.styles';\nimport ExpressionBuilderModal from './ExpressionBuilderModal';\n\nconst Expression = forwardRef(\n (\n {\n testId,\n label,\n labelHidden,\n readOnly,\n required,\n value,\n status,\n info,\n placeholder,\n additionalInfo,\n disabled,\n showExpBuilderIcon,\n onExpBuilderShowHandler,\n showExpressionBuilder,\n expressionBuilder,\n hideFormField = false,\n editorInput: { fetchSuggestions, handle, loading, onChange, onBlur, inLineErrors },\n id,\n ...restProps\n }: PropsWithoutRef<ExpressionProps>,\n ref: ExpressionProps['ref']\n ) => {\n const textElRef = useRef<HTMLInputElement>(null);\n const popOverReference = useRef<HTMLDivElement>(null);\n const codeEditorHandle = useRef<EditorState>(null);\n const expressionRef = useRef<HTMLDivElement>(null);\n const t = useI18n();\n\n const testIds = useTestIds(testId, getExpressionTestIds);\n\n const getExpression = () => {\n return codeEditorHandle.current?.getValue() || '';\n };\n\n const insertExpression = (\n expression: string,\n replaceContent?: boolean,\n customCursorPosition?: CustomPositionProps\n ) => {\n return codeEditorHandle.current?.insertText(\n expression ?? '',\n replaceContent ?? true,\n customCursorPosition\n );\n };\n\n useImperativeHandle(\n handle,\n () => ({\n getExpression,\n insertExpression\n }),\n [getExpression]\n );\n\n useImperativeHandle(\n ref,\n () => ({\n getTextElRef: () => textElRef.current,\n getPopOverRef: () => popOverReference.current,\n getExpressionRef: () => expressionRef.current\n }),\n []\n );\n\n const Comp = (\n <StyledFormControl\n container\n inline\n as={StyledFlex}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n ref={expressionRef}\n data-testid={testIds.root}\n >\n <StyledCodeEditor\n testId={testIds.expressionInput}\n isSingleLine\n fetchSuggestions={fetchSuggestions}\n codeEditorHandle={codeEditorHandle}\n defaultValue={value}\n loading={loading}\n readOnly={readOnly}\n onChange={onChange}\n onBlur={onBlur}\n inLineErrors={inLineErrors}\n autoCompleteTriggers={['.', '@', '#', ':', '(', ')']}\n editorConfigProps={{\n mode: 'expression',\n readOnly,\n placeholder\n }}\n aria-label={t('expression_input')}\n />\n {showExpBuilderIcon && (\n <ExpressionBuilderModal\n testId={testId}\n expressionBuilder={expressionBuilder}\n showExpressionBuilder={showExpressionBuilder}\n readOnly={readOnly}\n disabled={disabled}\n onExpBuilderShowHandler={onExpBuilderShowHandler}\n />\n )}\n </StyledFormControl>\n );\n\n return !hideFormField ? (\n <FormField\n {...restProps}\n label={label}\n labelHidden={labelHidden}\n required={required}\n readOnly={readOnly}\n status={status}\n info={info}\n disabled={disabled}\n additionalInfo={additionalInfo}\n id={id}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default withTestIds(Expression, getExpressionTestIds);\n"]}
@@ -1,4 +1,8 @@
1
- export declare const StyledFlex: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
1
+ export declare const StyledFlex: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").FlexProps>, import("styled-components").DefaultTheme, {}, never>;
2
+ export declare const StyledModalContainer: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").FlexProps>, import("styled-components").DefaultTheme, {}, never>;
3
+ export declare const StyledExpressionBuilder: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("../ExpressionBuilder").ExpressionBuilderProps> & {
4
+ getTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["search", "explanation", "explain", "clear", "insert", "generate", "generated-expression", "describe-expression"]>;
5
+ }, import("styled-components").DefaultTheme, {}, never>;
2
6
  export declare const StyledCodeEditor: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("../ExpressionBuilder").CodeEditorProps> & {
3
7
  getTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["error-popover", "error-message"]>;
4
8
  }, import("styled-components").DefaultTheme, {
@@ -1 +1 @@
1
- {"version":3,"file":"Expression.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Expression/Expression.styles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,UAAU,yGA8BrB,CAAC;AAIH,eAAO,MAAM,gBAAgB;;;mBAAuC,OAAO;SAqBzE,CAAC"}
1
+ {"version":3,"file":"Expression.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Expression/Expression.styles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,UAAU,kNA8BrB,CAAC;AAIH,eAAO,MAAM,oBAAoB,kNAQ/B,CAAC;AAEH,eAAO,MAAM,uBAAuB;;uDAEnC,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;mBAAuC,OAAO;SAqBzE,CAAC"}
@@ -1,9 +1,9 @@
1
1
  import styled, { css } from 'styled-components';
2
- import { defaultThemeProp } from '@pega/cosmos-react-core';
3
- import { CodeEditor } from '../ExpressionBuilder';
2
+ import { defaultThemeProp, Flex } from '@pega/cosmos-react-core';
3
+ import ExpressionBuilder, { CodeEditor } from '../ExpressionBuilder';
4
4
  const iconWidth = '3.75';
5
5
  const height = '3.75';
6
- export const StyledFlex = styled('div')(({ theme: { components: { 'form-control': { ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow } } }, base: { spacing } } }) => {
6
+ export const StyledFlex = styled(Flex)(({ theme: { components: { 'form-control': { ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow } } }, base: { spacing } } }) => {
7
7
  return css `
8
8
  &:focus-within {
9
9
  border-color: ${focusBorderColor};
@@ -26,6 +26,18 @@ export const StyledFlex = styled('div')(({ theme: { components: { 'form-control'
26
26
  `;
27
27
  });
28
28
  StyledFlex.defaultProps = defaultThemeProp;
29
+ export const StyledModalContainer = styled(Flex)(({ showEditorOnly }) => {
30
+ return css `
31
+ height: 30rem;
32
+ ${!showEditorOnly &&
33
+ css `
34
+ width: 72.5rem;
35
+ `}
36
+ `;
37
+ });
38
+ export const StyledExpressionBuilder = styled(ExpressionBuilder) `
39
+ padding-inline: 0;
40
+ `;
29
41
  export const StyledCodeEditor = styled(CodeEditor)(({ theme: { base: { spacing } }, isSingleLine }) => {
30
42
  return css `
31
43
  ${isSingleLine &&
@@ -1 +1 @@
1
- {"version":3,"file":"Expression.styles.js","sourceRoot":"","sources":["../../../src/components/Expression/Expression.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,MAAM,SAAS,GAAG,MAAM,CAAC;AACzB,MAAM,MAAM,GAAG,MAAM,CAAC;AACtB,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EACvC,KAAK,EAAE,EACL,UAAU,EAAE,EACV,cAAc,EAAE,EACd,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,EAAE,EACrE,EACF,EACD,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;sBAEU,gBAAgB;oBAClB,MAAM;;;;qBAIL,OAAO,MAAM,MAAM;yBACf,OAAO,MAAM,MAAM;;;oBAGxB,OAAO,MAAM,SAAS;wBAClB,OAAO,MAAM,SAAS;;;;;;;GAO3C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,CAA6B,CAAC,EAC9E,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACD,YAAY,EACb,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;MACN,YAAY;QACd,GAAG,CAAA;;;;;;2BAMoB,OAAO,MAAM,MAAM;;;uBAGvB,OAAO,MAAM,MAAM;;KAErC;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nimport { CodeEditor } from '../ExpressionBuilder';\n\nconst iconWidth = '3.75';\nconst height = '3.75';\nexport const StyledFlex = styled('div')(({\n theme: {\n components: {\n 'form-control': {\n ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow }\n }\n },\n base: { spacing }\n }\n}) => {\n return css`\n &:focus-within {\n border-color: ${focusBorderColor};\n box-shadow: ${shadow};\n }\n & > input,\n & > button {\n height: calc(${spacing} * ${height});\n min-height: calc(${spacing} * ${height});\n }\n & > button {\n width: calc(${spacing} * ${iconWidth});\n min-width: calc(${spacing} * ${iconWidth});\n }\n & > input,\n & > input:focus:not([disabled]) {\n border: none;\n box-shadow: none;\n }\n `;\n});\n\nStyledFlex.defaultProps = defaultThemeProp;\n\nexport const StyledCodeEditor = styled(CodeEditor)<{ isSingleLine?: boolean }>(({\n theme: {\n base: { spacing }\n },\n isSingleLine\n}) => {\n return css`\n ${isSingleLine &&\n css`\n .CodeMirror {\n border: none;\n }\n .react-codemirror2,\n .CodeMirror-lines {\n min-height: calc(${spacing} * ${height});\n }\n .CodeMirror-lines {\n height: calc(${spacing} * ${height});\n }\n `}\n `;\n});\n\nStyledCodeEditor.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"Expression.styles.js","sourceRoot":"","sources":["../../../src/components/Expression/Expression.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAEjE,OAAO,iBAAiB,EAAE,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAErE,MAAM,SAAS,GAAG,MAAM,CAAC;AACzB,MAAM,MAAM,GAAG,MAAM,CAAC;AACtB,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EACtC,KAAK,EAAE,EACL,UAAU,EAAE,EACV,cAAc,EAAE,EACd,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,EAAE,EACrE,EACF,EACD,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;sBAEU,gBAAgB;oBAClB,MAAM;;;;qBAIL,OAAO,MAAM,MAAM;yBACf,OAAO,MAAM,MAAM;;;oBAGxB,OAAO,MAAM,SAAS;wBAClB,OAAO,MAAM,SAAS;;;;;;;GAO3C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,EAAE,EAAE;IACtE,OAAO,GAAG,CAAA;;MAEN,CAAC,cAAc;QACjB,GAAG,CAAA;;KAEF;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAA;;CAE/D,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,CAA6B,CAAC,EAC9E,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACD,YAAY,EACb,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;MACN,YAAY;QACd,GAAG,CAAA;;;;;;2BAMoB,OAAO,MAAM,MAAM;;;uBAGvB,OAAO,MAAM,MAAM;;KAErC;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, Flex } from '@pega/cosmos-react-core';\n\nimport ExpressionBuilder, { CodeEditor } from '../ExpressionBuilder';\n\nconst iconWidth = '3.75';\nconst height = '3.75';\nexport const StyledFlex = styled(Flex)(({\n theme: {\n components: {\n 'form-control': {\n ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow }\n }\n },\n base: { spacing }\n }\n}) => {\n return css`\n &:focus-within {\n border-color: ${focusBorderColor};\n box-shadow: ${shadow};\n }\n & > input,\n & > button {\n height: calc(${spacing} * ${height});\n min-height: calc(${spacing} * ${height});\n }\n & > button {\n width: calc(${spacing} * ${iconWidth});\n min-width: calc(${spacing} * ${iconWidth});\n }\n & > input,\n & > input:focus:not([disabled]) {\n border: none;\n box-shadow: none;\n }\n `;\n});\n\nStyledFlex.defaultProps = defaultThemeProp;\n\nexport const StyledModalContainer = styled(Flex)(({ showEditorOnly }) => {\n return css`\n height: 30rem;\n ${!showEditorOnly &&\n css`\n width: 72.5rem;\n `}\n `;\n});\n\nexport const StyledExpressionBuilder = styled(ExpressionBuilder)`\n padding-inline: 0;\n`;\n\nexport const StyledCodeEditor = styled(CodeEditor)<{ isSingleLine?: boolean }>(({\n theme: {\n base: { spacing }\n },\n isSingleLine\n}) => {\n return css`\n ${isSingleLine &&\n css`\n .CodeMirror {\n border: none;\n }\n .react-codemirror2,\n .CodeMirror-lines {\n min-height: calc(${spacing} * ${height});\n }\n .CodeMirror-lines {\n height: calc(${spacing} * ${height});\n }\n `}\n `;\n});\n\nStyledCodeEditor.defaultProps = defaultThemeProp;\n"]}
@@ -1,3 +1,3 @@
1
- export declare const getExpressionTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["expression-input", "expression-menu-popover", "expression-builder-error-banner"]>;
1
+ export declare const getExpressionTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["expression-input", "expression-menu-popover", "expression-builder-error-banner", "progress-builder"]>;
2
2
  export declare const getExpressionBuilderGearTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["expression-builder-modal", "open-expression-builder", "expression-modal-cancel", "expression-modal-submit"]>;
3
3
  //# sourceMappingURL=Expression.test-ids.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Expression.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/Expression/Expression.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,oBAAoB,uNAItB,CAAC;AAEZ,eAAO,MAAM,+BAA+B,kPAKjC,CAAC"}
1
+ {"version":3,"file":"Expression.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/Expression/Expression.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,oBAAoB,2OAKtB,CAAC;AAEZ,eAAO,MAAM,+BAA+B,kPAKjC,CAAC"}
@@ -2,7 +2,8 @@ import { createTestIds } from '@pega/cosmos-react-core';
2
2
  export const getExpressionTestIds = createTestIds('expression', [
3
3
  'expression-input',
4
4
  'expression-menu-popover',
5
- 'expression-builder-error-banner'
5
+ 'expression-builder-error-banner',
6
+ 'progress-builder'
6
7
  ]);
7
8
  export const getExpressionBuilderGearTestIds = createTestIds('expression-builder-gear', [
8
9
  'expression-builder-modal',
@@ -1 +1 @@
1
- {"version":3,"file":"Expression.test-ids.js","sourceRoot":"","sources":["../../../src/components/Expression/Expression.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAC,YAAY,EAAE;IAC9D,kBAAkB;IAClB,yBAAyB;IACzB,iCAAiC;CACzB,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,+BAA+B,GAAG,aAAa,CAAC,yBAAyB,EAAE;IACtF,0BAA0B;IAC1B,yBAAyB;IACzB,yBAAyB;IACzB,yBAAyB;CACjB,CAAC,CAAC","sourcesContent":["import { createTestIds } from '@pega/cosmos-react-core';\n\nexport const getExpressionTestIds = createTestIds('expression', [\n 'expression-input',\n 'expression-menu-popover',\n 'expression-builder-error-banner'\n] as const);\n\nexport const getExpressionBuilderGearTestIds = createTestIds('expression-builder-gear', [\n 'expression-builder-modal',\n 'open-expression-builder',\n 'expression-modal-cancel',\n 'expression-modal-submit'\n] as const);\n"]}
1
+ {"version":3,"file":"Expression.test-ids.js","sourceRoot":"","sources":["../../../src/components/Expression/Expression.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAC,YAAY,EAAE;IAC9D,kBAAkB;IAClB,yBAAyB;IACzB,iCAAiC;IACjC,kBAAkB;CACV,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,+BAA+B,GAAG,aAAa,CAAC,yBAAyB,EAAE;IACtF,0BAA0B;IAC1B,yBAAyB;IACzB,yBAAyB;IACzB,yBAAyB;CACjB,CAAC,CAAC","sourcesContent":["import { createTestIds } from '@pega/cosmos-react-core';\n\nexport const getExpressionTestIds = createTestIds('expression', [\n 'expression-input',\n 'expression-menu-popover',\n 'expression-builder-error-banner',\n 'progress-builder'\n] as const);\n\nexport const getExpressionBuilderGearTestIds = createTestIds('expression-builder-gear', [\n 'expression-builder-modal',\n 'open-expression-builder',\n 'expression-modal-cancel',\n 'expression-modal-submit'\n] as const);\n"]}
@@ -0,0 +1,6 @@
1
+ import type { ExpressionBuilderLayoutInterface } from './Expression.types';
2
+ declare const _default: (({ showExpressionBuilder, onExpBuilderShowHandler, readOnly, disabled, testId, expressionBuilder }: ExpressionBuilderLayoutInterface) => import("react/jsx-runtime").JSX.Element) & {
3
+ getTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["expression-builder-modal", "open-expression-builder", "expression-modal-cancel", "expression-modal-submit"]>;
4
+ };
5
+ export default _default;
6
+ //# sourceMappingURL=ExpressionBuilderModal.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ExpressionBuilderModal.d.ts","sourceRoot":"","sources":["../../../src/components/Expression/ExpressionBuilderModal.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EACV,gCAAgC,EAEjC,MAAM,oBAAoB,CAAC;6HA6GzB,gCAAgC;;;AAyBnC,wBAAoF"}
@@ -0,0 +1,53 @@
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useEffect, useState } from 'react';
3
+ import { Button, Icon, Banner, useTestIds, Progress, withTestIds, useI18n, registerIcon } from '@pega/cosmos-react-core';
4
+ import * as CodeSearch from '@pega/cosmos-react-core/lib/components/Icon/streamline-icons/code-search.icon';
5
+ import useCreateModal from '../ObjectSelect/useCreateModal';
6
+ import { getExpressionTestIds, getExpressionBuilderGearTestIds } from './Expression.test-ids';
7
+ import { StyledModalContainer, StyledExpressionBuilder } from './Expression.styles';
8
+ registerIcon(CodeSearch);
9
+ const ExpModal = (props) => {
10
+ const { showEditorOnly, loading, onChange, errors, defaultValue, handle, fetchSuggestions, inLineErrors, expBuilderRef, readOnly, list, search, expBuilderErrorBanner, ...restProps } = props;
11
+ const testIds = useTestIds(restProps.testId, getExpressionTestIds);
12
+ return (_jsx(StyledModalContainer, { container: { direction: 'column', colGap: 1 }, showEditorOnly: props.showEditorOnly, children: loading ? (_jsx(Progress, { placement: 'local', "data-testid": testIds.progressBuilder })) : (_jsxs(_Fragment, { children: [expBuilderErrorBanner && (_jsx(Banner, { variant: expBuilderErrorBanner.variant, onDismiss: expBuilderErrorBanner.onDismiss, messages: expBuilderErrorBanner.messages, "data-testId": testIds.expressionBuilderErrorBanner })), _jsx(StyledExpressionBuilder, { testId: testIds.root, ...restProps, loading: restProps.codeEditorLoading, list: list, readOnly: readOnly, onChange: onChange, search: search, errors: errors, defaultValue: defaultValue, handle: handle, fetchSuggestions: fetchSuggestions, showEditorOnly: showEditorOnly, inLineErrors: inLineErrors, ref: expBuilderRef })] })) }));
13
+ };
14
+ const ExpModalWrapper = (props) => {
15
+ const t = useI18n();
16
+ const { testId } = props;
17
+ const [showModal, setShowModal] = useState(true);
18
+ const testIds = useTestIds(testId, getExpressionBuilderGearTestIds);
19
+ const dismiss = (close) => {
20
+ close();
21
+ setShowModal(false);
22
+ };
23
+ const { renderModal } = useCreateModal({
24
+ renderer: ExpModal,
25
+ onSubmit: ({ close }) => props.onSubmit({ close: () => dismiss(close) }),
26
+ onDismiss: ({ close }) => {
27
+ props.onDismiss({ close: () => dismiss(close) });
28
+ },
29
+ heading: t('expression_builder'),
30
+ autoWidth: true,
31
+ testId: testIds.expressionBuilderModal,
32
+ formActionSubmitTestId: testIds.expressionModalSubmit,
33
+ formActionCancelTestId: testIds.expressionModalCancel
34
+ });
35
+ useEffect(() => {
36
+ if (showModal && props.list && props.search) {
37
+ renderModal({
38
+ rendererProps: {
39
+ ...props,
40
+ testId: props.testId ?? testIds.root
41
+ }
42
+ });
43
+ }
44
+ }, [props, showModal]);
45
+ return null;
46
+ };
47
+ const ExpressionBuilderModal = ({ showExpressionBuilder, onExpBuilderShowHandler, readOnly, disabled, testId, expressionBuilder }) => {
48
+ const t = useI18n();
49
+ const testIds = useTestIds(testId, getExpressionBuilderGearTestIds);
50
+ return (_jsxs(_Fragment, { children: [!readOnly && (_jsx(Button, { disabled: disabled, icon: true, variant: 'simple', label: t('open_expression_builder'), "aria-label": t('open_expression_builder'), onClick: onExpBuilderShowHandler, "data-testid": testIds.openExpressionBuilder, children: _jsx(Icon, { name: 'code-search', set: 'streamline' }) })), showExpressionBuilder && expressionBuilder && (_jsx(ExpModalWrapper, { testId: testId, ...expressionBuilder, readOnly: readOnly || disabled }))] }));
51
+ };
52
+ export default withTestIds(ExpressionBuilderModal, getExpressionBuilderGearTestIds);
53
+ //# sourceMappingURL=ExpressionBuilderModal.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ExpressionBuilderModal.js","sourceRoot":"","sources":["../../../src/components/Expression/ExpressionBuilderModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useState } from 'react';\n\nimport {\n Button,\n Icon,\n Banner,\n useTestIds,\n Progress,\n withTestIds,\n useI18n,\n registerIcon\n} from '@pega/cosmos-react-core';\nimport type { OmitStrict } from '@pega/cosmos-react-core';\nimport * as CodeSearch from '@pega/cosmos-react-core/lib/components/Icon/streamline-icons/code-search.icon';\n\nimport useCreateModal from '../ObjectSelect/useCreateModal';\n\nimport type {\n ExpressionBuilderLayoutInterface,\n ExpressionBuilderWrapperProps\n} from './Expression.types';\nimport { getExpressionTestIds, getExpressionBuilderGearTestIds } from './Expression.test-ids';\nimport { StyledModalContainer, StyledExpressionBuilder } from './Expression.styles';\n\nregisterIcon(CodeSearch);\n\nconst ExpModal = (props: OmitStrict<ExpressionBuilderWrapperProps, 'onSubmit' | 'onDismiss'>) => {\n const {\n showEditorOnly,\n loading,\n onChange,\n errors,\n defaultValue,\n handle,\n fetchSuggestions,\n inLineErrors,\n expBuilderRef,\n readOnly,\n list,\n search,\n expBuilderErrorBanner,\n ...restProps\n } = props;\n const testIds = useTestIds(restProps.testId, getExpressionTestIds);\n\n return (\n <StyledModalContainer\n container={{ direction: 'column', colGap: 1 }}\n showEditorOnly={props.showEditorOnly}\n >\n {loading ? (\n <Progress placement='local' data-testid={testIds.progressBuilder} />\n ) : (\n <>\n {expBuilderErrorBanner && (\n <Banner\n variant={expBuilderErrorBanner.variant}\n onDismiss={expBuilderErrorBanner.onDismiss}\n messages={expBuilderErrorBanner.messages}\n data-testId={testIds.expressionBuilderErrorBanner}\n />\n )}\n <StyledExpressionBuilder\n testId={testIds.root}\n {...restProps}\n loading={restProps.codeEditorLoading}\n list={list}\n readOnly={readOnly}\n onChange={onChange}\n search={search}\n errors={errors}\n defaultValue={defaultValue}\n handle={handle}\n fetchSuggestions={fetchSuggestions}\n showEditorOnly={showEditorOnly}\n inLineErrors={inLineErrors}\n ref={expBuilderRef}\n />\n </>\n )}\n </StyledModalContainer>\n );\n};\n\nconst ExpModalWrapper = (props: ExpressionBuilderWrapperProps) => {\n const t = useI18n();\n const { testId } = props;\n const [showModal, setShowModal] = useState(true);\n const testIds = useTestIds(testId, getExpressionBuilderGearTestIds);\n\n const dismiss = (close: () => void) => {\n close();\n setShowModal(false);\n };\n\n const { renderModal } = useCreateModal({\n renderer: ExpModal,\n onSubmit: ({ close }) => props.onSubmit({ close: () => dismiss(close) }),\n onDismiss: ({ close }) => {\n props.onDismiss({ close: () => dismiss(close) });\n },\n heading: t('expression_builder'),\n autoWidth: true,\n testId: testIds.expressionBuilderModal,\n formActionSubmitTestId: testIds.expressionModalSubmit,\n formActionCancelTestId: testIds.expressionModalCancel\n });\n\n useEffect(() => {\n if (showModal && props.list && props.search) {\n renderModal({\n rendererProps: {\n ...props,\n testId: props.testId ?? testIds.root\n }\n });\n }\n }, [props, showModal]);\n\n return null;\n};\n\nconst ExpressionBuilderModal = ({\n showExpressionBuilder,\n onExpBuilderShowHandler,\n readOnly,\n disabled,\n testId,\n expressionBuilder\n}: ExpressionBuilderLayoutInterface) => {\n const t = useI18n();\n const testIds = useTestIds(testId, getExpressionBuilderGearTestIds);\n return (\n <>\n {!readOnly && (\n <Button\n disabled={disabled}\n icon\n variant='simple'\n label={t('open_expression_builder')}\n aria-label={t('open_expression_builder')}\n onClick={onExpBuilderShowHandler}\n data-testid={testIds.openExpressionBuilder}\n >\n <Icon name='code-search' set='streamline' />\n </Button>\n )}\n {showExpressionBuilder && expressionBuilder && (\n <ExpModalWrapper testId={testId} {...expressionBuilder} readOnly={readOnly || disabled} />\n )}\n </>\n );\n};\n\nexport default withTestIds(ExpressionBuilderModal, getExpressionBuilderGearTestIds);\n"]}
@@ -1,6 +1,6 @@
1
1
  import type { ComponentType } from 'react';
2
- import type { ModalProps } from '@pega/cosmos-react-core';
3
- export interface UseCreateModalConfig<P extends object = object> {
2
+ import type { ModalProps, TestIdProp } from '@pega/cosmos-react-core';
3
+ export interface UseCreateModalConfig<P extends object = object> extends TestIdProp, Pick<ModalProps, 'autoWidth' | 'center'> {
4
4
  /**
5
5
  * Heading for the Modal.
6
6
  * @default 'Create new'
@@ -20,6 +20,10 @@ export interface UseCreateModalConfig<P extends object = object> {
20
20
  onBeforeOpen?: ModalProps['onBeforeOpen'];
21
21
  /** Called after the modal closes. */
22
22
  onAfterClose?: ModalProps['onAfterClose'];
23
+ /** formactions Submit testId of modal */
24
+ formActionSubmitTestId?: TestIdProp['testId'];
25
+ /** formactions Cancel testId of modal */
26
+ formActionCancelTestId?: TestIdProp['testId'];
23
27
  }
24
28
  export interface CreateModalActionProps<P extends object = object> {
25
29
  loading?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"useCreateModal.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectSelect/useCreateModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAa,aAAa,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,KAAK,EAA4B,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEpF,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC7D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8CAA8C;IAC9C,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC3B,yCAAyC;IACzC,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACrD,yCAAyC;IACzC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACtD,qCAAqC;IACrC,YAAY,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;IAC1C,qCAAqC;IACrC,YAAY,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;CAC3C;AAED,MAAM,WAAW,sBAAsB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC/D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,CAAC,CAAC;CAClB;AAED,QAAA,MAAM,cAAc,GAAI,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,QAAQ,oBAAoB,CAAC,CAAC,CAAC,GAAG,SAAS;8CAgBjC,sBAAsB,CAAC,CAAC,CAAC;CA0ErF,CAAC;AAEF,eAAe,cAAc,CAAC"}
1
+ {"version":3,"file":"useCreateModal.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectSelect/useCreateModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAa,aAAa,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,KAAK,EAA4B,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEhG,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,CAC7D,SAAQ,UAAU,EAChB,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,QAAQ,CAAC;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8CAA8C;IAC9C,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC3B,yCAAyC;IACzC,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACrD,yCAAyC;IACzC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACtD,qCAAqC;IACrC,YAAY,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;IAC1C,qCAAqC;IACrC,YAAY,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,CAAC;IAC1C,yCAAyC;IACzC,sBAAsB,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAC9C,yCAAyC;IACzC,sBAAsB,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;CAC/C;AAED,MAAM,WAAW,sBAAsB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC/D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,CAAC,CAAC;CAClB;AAED,QAAA,MAAM,cAAc,GAAI,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,QAAQ,oBAAoB,CAAC,CAAC,CAAC,GAAG,SAAS;8CAqBjC,sBAAsB,CAAC,CAAC,CAAC;CA+ErF,CAAC;AAEF,eAAe,cAAc,CAAC"}
@@ -7,7 +7,7 @@ const useCreateModal = (config) => {
7
7
  const modalMethods = useRef();
8
8
  const { create: createModal } = useModalManager();
9
9
  if (config) {
10
- const { renderer: Renderer, onSubmit, onDismiss, onBeforeOpen, onAfterClose, heading = t('create_new') } = config;
10
+ const { renderer: Renderer, autoWidth, center, testId, formActionCancelTestId, formActionSubmitTestId, onSubmit, onDismiss, onBeforeOpen, onAfterClose, heading = t('create_new') } = config;
11
11
  const renderModal = ({ rendererProps, loading = false }) => {
12
12
  const modalContent = _jsx(Renderer, { ...rendererProps });
13
13
  let formActions = null;
@@ -16,9 +16,9 @@ const useCreateModal = (config) => {
16
16
  modalMethods.current?.dismiss();
17
17
  modalMethods.current = undefined;
18
18
  };
19
- formActions = (_jsxs(_Fragment, { children: [_jsx(Button, { disabled: loading, onClick: () => {
19
+ formActions = (_jsxs(_Fragment, { children: [_jsx(Button, { "data-testid": formActionCancelTestId, disabled: loading, onClick: () => {
20
20
  onDismiss({ close });
21
- }, children: t('cancel') }), _jsx(Button, { disabled: loading, type: 'submit', variant: 'primary', onClick: () => {
21
+ }, children: t('cancel') }), _jsx(Button, { "data-testid": formActionSubmitTestId, disabled: loading, type: 'submit', variant: 'primary', onClick: () => {
22
22
  submittingRef.current = true;
23
23
  onSubmit({ close });
24
24
  }, children: t('submit') })] }));
@@ -37,12 +37,15 @@ const useCreateModal = (config) => {
37
37
  else {
38
38
  modalMethods.current = createModal(Modal, {
39
39
  ...modalProps,
40
+ autoWidth,
41
+ center,
40
42
  heading,
41
43
  onBeforeOpen,
42
44
  onAfterClose: () => {
43
45
  onAfterClose?.();
44
46
  submittingRef.current = false;
45
- }
47
+ },
48
+ 'data-testid': testId
46
49
  }, {
47
50
  dismissible: false
48
51
  });
@@ -1 +1 @@
1
- {"version":3,"file":"useCreateModal.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/useCreateModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef } from 'react';\nimport type { ReactNode, ComponentType } from 'react';\n\nimport { Button, Modal, useModalManager, useI18n } from '@pega/cosmos-react-core';\nimport type { ModalMethods, OmitStrict, ModalProps } from '@pega/cosmos-react-core';\n\nexport interface UseCreateModalConfig<P extends object = object> {\n /**\n * Heading for the Modal.\n * @default 'Create new'\n */\n heading?: string;\n /** A component to render the add new form. */\n renderer: ComponentType<P>;\n /** Called when a user submits a form. */\n onSubmit: ({ close }: { close: () => void }) => void;\n /** Called when a user cancels a form. */\n onDismiss: ({ close }: { close: () => void }) => void;\n /** Called before the modal opens. */\n onBeforeOpen?: ModalProps['onBeforeOpen'];\n /** Called after the modal closes. */\n onAfterClose?: ModalProps['onAfterClose'];\n}\n\nexport interface CreateModalActionProps<P extends object = object> {\n loading?: boolean;\n rendererProps: P;\n}\n\nconst useCreateModal = <P extends object = object>(config: UseCreateModalConfig<P> | undefined) => {\n const t = useI18n();\n\n const submittingRef = useRef(false);\n const modalMethods = useRef<ModalMethods>();\n const { create: createModal } = useModalManager();\n\n if (config) {\n const {\n renderer: Renderer,\n onSubmit,\n onDismiss,\n onBeforeOpen,\n onAfterClose,\n heading = t('create_new')\n } = config;\n const renderModal = ({ rendererProps, loading = false }: CreateModalActionProps<P>) => {\n const modalContent: ReactNode = <Renderer {...rendererProps} />;\n\n let formActions: ReactNode = null;\n\n if (!loading || submittingRef.current) {\n const close = () => {\n modalMethods.current?.dismiss();\n modalMethods.current = undefined;\n };\n\n formActions = (\n <>\n <Button\n disabled={loading}\n onClick={() => {\n onDismiss({ close });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n disabled={loading}\n type='submit'\n variant='primary'\n onClick={() => {\n submittingRef.current = true;\n onSubmit({ close });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress: loading\n ? { message: submittingRef.current ? t('submitting') : t('loading') }\n : undefined,\n children: modalContent,\n actions: formActions,\n onRequestDismiss: loading && submittingRef.current ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else {\n modalMethods.current = createModal(\n Modal,\n {\n ...modalProps,\n heading,\n onBeforeOpen,\n onAfterClose: () => {\n onAfterClose?.();\n submittingRef.current = false;\n }\n },\n {\n dismissible: false\n }\n );\n }\n };\n\n return {\n renderModal\n };\n }\n\n return {\n renderModal: () => {}\n };\n};\n\nexport default useCreateModal;\n"]}
1
+ {"version":3,"file":"useCreateModal.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/useCreateModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef } from 'react';\nimport type { ReactNode, ComponentType } from 'react';\n\nimport { Button, Modal, useModalManager, useI18n } from '@pega/cosmos-react-core';\nimport type { ModalMethods, OmitStrict, ModalProps, TestIdProp } from '@pega/cosmos-react-core';\n\nexport interface UseCreateModalConfig<P extends object = object>\n extends TestIdProp,\n Pick<ModalProps, 'autoWidth' | 'center'> {\n /**\n * Heading for the Modal.\n * @default 'Create new'\n */\n heading?: string;\n /** A component to render the add new form. */\n renderer: ComponentType<P>;\n /** Called when a user submits a form. */\n onSubmit: ({ close }: { close: () => void }) => void;\n /** Called when a user cancels a form. */\n onDismiss: ({ close }: { close: () => void }) => void;\n /** Called before the modal opens. */\n onBeforeOpen?: ModalProps['onBeforeOpen'];\n /** Called after the modal closes. */\n onAfterClose?: ModalProps['onAfterClose'];\n /** formactions Submit testId of modal */\n formActionSubmitTestId?: TestIdProp['testId'];\n /** formactions Cancel testId of modal */\n formActionCancelTestId?: TestIdProp['testId'];\n}\n\nexport interface CreateModalActionProps<P extends object = object> {\n loading?: boolean;\n rendererProps: P;\n}\n\nconst useCreateModal = <P extends object = object>(config: UseCreateModalConfig<P> | undefined) => {\n const t = useI18n();\n\n const submittingRef = useRef(false);\n const modalMethods = useRef<ModalMethods>();\n const { create: createModal } = useModalManager();\n\n if (config) {\n const {\n renderer: Renderer,\n autoWidth,\n center,\n testId,\n formActionCancelTestId,\n formActionSubmitTestId,\n onSubmit,\n onDismiss,\n onBeforeOpen,\n onAfterClose,\n heading = t('create_new')\n } = config;\n const renderModal = ({ rendererProps, loading = false }: CreateModalActionProps<P>) => {\n const modalContent: ReactNode = <Renderer {...rendererProps} />;\n\n let formActions: ReactNode = null;\n\n if (!loading || submittingRef.current) {\n const close = () => {\n modalMethods.current?.dismiss();\n modalMethods.current = undefined;\n };\n\n formActions = (\n <>\n <Button\n data-testid={formActionCancelTestId}\n disabled={loading}\n onClick={() => {\n onDismiss({ close });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n data-testid={formActionSubmitTestId}\n disabled={loading}\n type='submit'\n variant='primary'\n onClick={() => {\n submittingRef.current = true;\n onSubmit({ close });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress: loading\n ? { message: submittingRef.current ? t('submitting') : t('loading') }\n : undefined,\n children: modalContent,\n actions: formActions,\n onRequestDismiss: loading && submittingRef.current ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else {\n modalMethods.current = createModal(\n Modal,\n {\n ...modalProps,\n autoWidth,\n center,\n heading,\n onBeforeOpen,\n onAfterClose: () => {\n onAfterClose?.();\n submittingRef.current = false;\n },\n 'data-testid': testId\n },\n {\n dismissible: false\n }\n );\n }\n };\n\n return {\n renderModal\n };\n }\n\n return {\n renderModal: () => {}\n };\n};\n\nexport default useCreateModal;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-build",
3
- "version": "9.0.0-build.6.14",
3
+ "version": "9.0.0-build.6.16",
4
4
  "license": "SEE LICENSE IN LICENSE",
5
5
  "author": "Pegasystems",
6
6
  "sideEffects": false,
@@ -14,9 +14,9 @@
14
14
  "build": "tsc -b tsconfig.build.json"
15
15
  },
16
16
  "dependencies": {
17
- "@pega/cosmos-react-core": "9.0.0-build.6.14",
18
- "@pega/cosmos-react-dnd": "9.0.0-build.6.14",
19
- "@pega/cosmos-react-rte": "9.0.0-build.6.14",
17
+ "@pega/cosmos-react-core": "9.0.0-build.6.16",
18
+ "@pega/cosmos-react-dnd": "9.0.0-build.6.16",
19
+ "@pega/cosmos-react-rte": "9.0.0-build.6.16",
20
20
  "@types/codemirror": "^5.60.15",
21
21
  "@types/dagre": "^0.7.46",
22
22
  "@types/react": "^17.0.62 || ^18.3.3",