@pega/cosmos-react-condition-builder 3.0.0-dev.21.0 → 3.0.0-dev.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"PromotedFilters.d.ts","sourceRoot":"","sources":["../../../src/components/PromotedFilters/PromotedFilters.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAGL,YAAY,EAOb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,SAAS,EAAiB,MAAM,4CAA4C,CAAC;AAItF,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAO/D,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,oBAAoB,EAAE,SAAS,GAAG,WAAW,CAAC;IAC3F,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;CACtD;AA+GD,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,CAkHlF,CAAC;AAEF,eAAe,eAAe,CAAC"}
1
+ {"version":3,"file":"PromotedFilters.d.ts","sourceRoot":"","sources":["../../../src/components/PromotedFilters/PromotedFilters.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAMlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAGL,YAAY,EAQb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,SAAS,EAAiB,MAAM,4CAA4C,CAAC;AAItF,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAO/D,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,oBAAoB,EAAE,SAAS,GAAG,WAAW,CAAC;IAC3F,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;CACtD;AA8GD,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,CAkHlF,CAAC;AAEF,eAAe,eAAe,CAAC"}
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import { forwardRef, useCallback, useContext, useEffect, useRef, useState } from 'react';
3
- import { Button, Flex, Icon, Modal, ModalManagerContext, useBreakpoint, useI18n } from '@pega/cosmos-react-core';
2
+ import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';
3
+ import { Button, Flex, Icon, Modal, useModalManager, useBreakpoint, useI18n, useModalContext } from '@pega/cosmos-react-core';
4
4
  import { splitConditionForBuilder } from '../ConditionBuilder/core/utils';
5
5
  import ConditionInput from '../ConditionInput';
6
6
  import { StyledPromotedFilters, StyledClearAllButton, StyledTextWithEllipsis } from './PromotedFilters.styles';
@@ -39,8 +39,7 @@ const PromotedFiltersContent = forwardRef(({ filters, condition, onChange, orien
39
39
  });
40
40
  const FilterModal = ({ filters, condition, onApply }) => {
41
41
  const t = useI18n();
42
- const { ModalContext } = useContext(ModalManagerContext);
43
- const { dismiss } = useContext(ModalContext);
42
+ const { dismiss } = useModalContext();
44
43
  const [newCondition, setNewCondition] = useState(condition);
45
44
  const onApplyClick = useCallback(() => {
46
45
  onApply?.(newCondition);
@@ -54,7 +53,7 @@ const FilterModal = ({ filters, condition, onApply }) => {
54
53
  export const PromotedFilters = forwardRef(({ filters, condition, onChange, orientation = 'horizontal' }, ref) => {
55
54
  const t = useI18n();
56
55
  const isSmallOrAbove = useBreakpoint('sm');
57
- const { create } = useContext(ModalManagerContext);
56
+ const { create } = useModalManager();
58
57
  const modalMethods = useRef();
59
58
  // map of Conditions indexed by field name
60
59
  const conditionsCount = condition ? splitConditionForBuilder(condition).rows.length : undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"PromotedFilters.js","sourceRoot":"","sources":["../../../src/components/PromotedFilters/PromotedFilters.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState\n} from 'react';\n\nimport {\n Button,\n Flex,\n ForwardProps,\n Icon,\n Modal,\n ModalMethods,\n ModalManagerContext,\n useBreakpoint,\n useI18n\n} from '@pega/cosmos-react-core';\n\nimport { Condition, LeafCondition } from '../ConditionBuilder/ConditionBuilder.types';\nimport { splitConditionForBuilder } from '../ConditionBuilder/core/utils';\nimport ConditionInput from '../ConditionInput';\n\nimport { PromotedFiltersProps } from './PromotedFilters.types';\nimport {\n StyledPromotedFilters,\n StyledClearAllButton,\n StyledTextWithEllipsis\n} from './PromotedFilters.styles';\n\nexport interface FilterModalProps extends Pick<PromotedFiltersProps, 'filters' | 'condition'> {\n /** Callback fired on apply of any of the filters */\n onApply?: (condition: Condition | undefined) => void;\n}\n\nconst PromotedFiltersContent: FunctionComponent<PromotedFiltersProps & ForwardProps> = forwardRef(\n (\n {\n filters,\n condition,\n onChange,\n orientation: orientationProp = 'horizontal'\n }: PropsWithoutRef<PromotedFiltersProps>,\n ref: PromotedFiltersProps['ref']\n ) => {\n const isSmallOrAbove = useBreakpoint('sm');\n const orientation =\n isSmallOrAbove && orientationProp === 'horizontal' ? 'horizontal' : 'vertical';\n\n // map of Conditions indexed by field name\n const conditionsMap = condition\n ? splitConditionForBuilder(condition).rows.reduce(\n (result: { [key: string]: LeafCondition }, item) => {\n result[item.lhs.field] = item;\n return result;\n },\n {}\n )\n : {};\n\n const createUpdatedCondition = (key: string, newCondition?: LeafCondition) => {\n if (newCondition) {\n conditionsMap[key] = newCondition;\n } else {\n delete conditionsMap[key];\n }\n\n return {\n AND: Object.values(conditionsMap).map(c => {\n return { condition: c } as Condition;\n })\n };\n };\n\n return (\n <Flex\n container={{\n gap: 2,\n direction: orientation === 'vertical' ? 'column' : 'row',\n wrap: 'wrap'\n }}\n ref={ref}\n >\n {filters.map(({ field, mode, label }) => {\n return (\n <ConditionInput\n key={field.name}\n field={field}\n mode={mode}\n label={label ?? field.name}\n condition={conditionsMap[field.name]}\n flat={orientation === 'vertical'}\n onChange={(newCondition?: LeafCondition) => {\n onChange(createUpdatedCondition(field.name, newCondition));\n }}\n />\n );\n })}\n </Flex>\n );\n }\n);\n\nconst FilterModal = ({ filters, condition, onApply }: FilterModalProps) => {\n const t = useI18n();\n\n const { ModalContext } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n const [newCondition, setNewCondition] = useState<Condition | undefined>(condition);\n\n const onApplyClick = useCallback(() => {\n onApply?.(newCondition);\n dismiss();\n }, [newCondition, onApply]);\n\n const actions = (\n <Button variant='primary' onClick={onApplyClick}>\n {t('apply')}\n </Button>\n );\n\n return (\n <Modal heading={t('filters')} actions={actions} stretch>\n <Flex container={{ justify: 'end' }}>\n <StyledClearAllButton\n variant='simple'\n onClick={() => {\n setNewCondition(undefined);\n }}\n >\n {t('clear_all')}\n </StyledClearAllButton>\n </Flex>\n\n <PromotedFiltersContent\n filters={filters}\n condition={newCondition}\n onChange={setNewCondition}\n orientation='vertical'\n />\n </Modal>\n );\n};\n\nexport const PromotedFilters: FunctionComponent<PromotedFiltersProps & ForwardProps> = forwardRef(\n (\n {\n filters,\n condition,\n onChange,\n orientation = 'horizontal'\n }: PropsWithoutRef<PromotedFiltersProps>,\n ref: PromotedFiltersProps['ref']\n ) => {\n const t = useI18n();\n\n const isSmallOrAbove = useBreakpoint('sm');\n\n const { create } = useContext(ModalManagerContext);\n const modalMethods = useRef<ModalMethods<FilterModalProps>>();\n\n // map of Conditions indexed by field name\n const conditionsCount = condition ? splitConditionForBuilder(condition).rows.length : undefined;\n\n useEffect(() => {\n modalMethods.current?.update({\n filters,\n condition\n });\n }, [filters, condition]);\n\n const openFiltersModal = () => {\n modalMethods.current = create(FilterModal, {\n filters,\n condition,\n onApply: onChange\n });\n };\n\n return (\n <Flex\n as={StyledPromotedFilters}\n container={{\n alignItems: orientation === 'horizontal' && isSmallOrAbove ? 'start' : undefined,\n justify: 'between',\n direction: !isSmallOrAbove || orientation === 'horizontal' ? 'row' : 'column',\n pad: 2,\n gap: 2\n }}\n ref={ref}\n >\n {isSmallOrAbove ? (\n <>\n {orientation === 'vertical' && (\n <Flex\n container={{\n justify: 'between',\n alignItems: 'center',\n pad: [0, 0, 1, 0]\n }}\n >\n <StyledTextWithEllipsis variant='h3'>{t('filters')}</StyledTextWithEllipsis>\n <Button\n variant='simple'\n onClick={() => {\n onChange();\n }}\n >\n {t('clear_all')}\n </Button>\n </Flex>\n )}\n\n <PromotedFiltersContent\n filters={filters}\n onChange={onChange}\n condition={condition}\n orientation={orientation}\n ref={ref}\n />\n\n {orientation === 'horizontal' && (\n <div>\n <StyledClearAllButton\n variant='simple'\n onClick={() => {\n onChange();\n }}\n >\n {t('promoted_filters_clear_all_button_label')}\n </StyledClearAllButton>\n </div>\n )}\n </>\n ) : (\n <>\n <Button type='button' variant='text' onClick={openFiltersModal}>\n <Flex container={{ alignItems: 'center', gap: 0.5 }} forwardedAs='span'>\n <Icon name='filter' />\n <span>\n {t('filters')}\n {conditionsCount && `\\u00a0(${conditionsCount})`}\n </span>\n </Flex>\n </Button>\n <Button\n variant='simple'\n onClick={() => {\n onChange();\n }}\n >\n {t('clear_all')}\n </Button>\n </>\n )}\n </Flex>\n );\n }\n);\n\nexport default PromotedFilters;\n"]}
1
+ {"version":3,"file":"PromotedFilters.js","sourceRoot":"","sources":["../../../src/components/PromotedFilters/PromotedFilters.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useCallback,\n useEffect,\n useRef,\n useState\n} from 'react';\n\nimport {\n Button,\n Flex,\n ForwardProps,\n Icon,\n Modal,\n ModalMethods,\n useModalManager,\n useBreakpoint,\n useI18n,\n useModalContext\n} from '@pega/cosmos-react-core';\n\nimport { Condition, LeafCondition } from '../ConditionBuilder/ConditionBuilder.types';\nimport { splitConditionForBuilder } from '../ConditionBuilder/core/utils';\nimport ConditionInput from '../ConditionInput';\n\nimport { PromotedFiltersProps } from './PromotedFilters.types';\nimport {\n StyledPromotedFilters,\n StyledClearAllButton,\n StyledTextWithEllipsis\n} from './PromotedFilters.styles';\n\nexport interface FilterModalProps extends Pick<PromotedFiltersProps, 'filters' | 'condition'> {\n /** Callback fired on apply of any of the filters */\n onApply?: (condition: Condition | undefined) => void;\n}\n\nconst PromotedFiltersContent: FunctionComponent<PromotedFiltersProps & ForwardProps> = forwardRef(\n (\n {\n filters,\n condition,\n onChange,\n orientation: orientationProp = 'horizontal'\n }: PropsWithoutRef<PromotedFiltersProps>,\n ref: PromotedFiltersProps['ref']\n ) => {\n const isSmallOrAbove = useBreakpoint('sm');\n const orientation =\n isSmallOrAbove && orientationProp === 'horizontal' ? 'horizontal' : 'vertical';\n\n // map of Conditions indexed by field name\n const conditionsMap = condition\n ? splitConditionForBuilder(condition).rows.reduce(\n (result: { [key: string]: LeafCondition }, item) => {\n result[item.lhs.field] = item;\n return result;\n },\n {}\n )\n : {};\n\n const createUpdatedCondition = (key: string, newCondition?: LeafCondition) => {\n if (newCondition) {\n conditionsMap[key] = newCondition;\n } else {\n delete conditionsMap[key];\n }\n\n return {\n AND: Object.values(conditionsMap).map(c => {\n return { condition: c } as Condition;\n })\n };\n };\n\n return (\n <Flex\n container={{\n gap: 2,\n direction: orientation === 'vertical' ? 'column' : 'row',\n wrap: 'wrap'\n }}\n ref={ref}\n >\n {filters.map(({ field, mode, label }) => {\n return (\n <ConditionInput\n key={field.name}\n field={field}\n mode={mode}\n label={label ?? field.name}\n condition={conditionsMap[field.name]}\n flat={orientation === 'vertical'}\n onChange={(newCondition?: LeafCondition) => {\n onChange(createUpdatedCondition(field.name, newCondition));\n }}\n />\n );\n })}\n </Flex>\n );\n }\n);\n\nconst FilterModal = ({ filters, condition, onApply }: FilterModalProps) => {\n const t = useI18n();\n\n const { dismiss } = useModalContext();\n const [newCondition, setNewCondition] = useState<Condition | undefined>(condition);\n\n const onApplyClick = useCallback(() => {\n onApply?.(newCondition);\n dismiss();\n }, [newCondition, onApply]);\n\n const actions = (\n <Button variant='primary' onClick={onApplyClick}>\n {t('apply')}\n </Button>\n );\n\n return (\n <Modal heading={t('filters')} actions={actions} stretch>\n <Flex container={{ justify: 'end' }}>\n <StyledClearAllButton\n variant='simple'\n onClick={() => {\n setNewCondition(undefined);\n }}\n >\n {t('clear_all')}\n </StyledClearAllButton>\n </Flex>\n\n <PromotedFiltersContent\n filters={filters}\n condition={newCondition}\n onChange={setNewCondition}\n orientation='vertical'\n />\n </Modal>\n );\n};\n\nexport const PromotedFilters: FunctionComponent<PromotedFiltersProps & ForwardProps> = forwardRef(\n (\n {\n filters,\n condition,\n onChange,\n orientation = 'horizontal'\n }: PropsWithoutRef<PromotedFiltersProps>,\n ref: PromotedFiltersProps['ref']\n ) => {\n const t = useI18n();\n\n const isSmallOrAbove = useBreakpoint('sm');\n\n const { create } = useModalManager();\n const modalMethods = useRef<ModalMethods<FilterModalProps>>();\n\n // map of Conditions indexed by field name\n const conditionsCount = condition ? splitConditionForBuilder(condition).rows.length : undefined;\n\n useEffect(() => {\n modalMethods.current?.update({\n filters,\n condition\n });\n }, [filters, condition]);\n\n const openFiltersModal = () => {\n modalMethods.current = create(FilterModal, {\n filters,\n condition,\n onApply: onChange\n });\n };\n\n return (\n <Flex\n as={StyledPromotedFilters}\n container={{\n alignItems: orientation === 'horizontal' && isSmallOrAbove ? 'start' : undefined,\n justify: 'between',\n direction: !isSmallOrAbove || orientation === 'horizontal' ? 'row' : 'column',\n pad: 2,\n gap: 2\n }}\n ref={ref}\n >\n {isSmallOrAbove ? (\n <>\n {orientation === 'vertical' && (\n <Flex\n container={{\n justify: 'between',\n alignItems: 'center',\n pad: [0, 0, 1, 0]\n }}\n >\n <StyledTextWithEllipsis variant='h3'>{t('filters')}</StyledTextWithEllipsis>\n <Button\n variant='simple'\n onClick={() => {\n onChange();\n }}\n >\n {t('clear_all')}\n </Button>\n </Flex>\n )}\n\n <PromotedFiltersContent\n filters={filters}\n onChange={onChange}\n condition={condition}\n orientation={orientation}\n ref={ref}\n />\n\n {orientation === 'horizontal' && (\n <div>\n <StyledClearAllButton\n variant='simple'\n onClick={() => {\n onChange();\n }}\n >\n {t('promoted_filters_clear_all_button_label')}\n </StyledClearAllButton>\n </div>\n )}\n </>\n ) : (\n <>\n <Button type='button' variant='text' onClick={openFiltersModal}>\n <Flex container={{ alignItems: 'center', gap: 0.5 }} forwardedAs='span'>\n <Icon name='filter' />\n <span>\n {t('filters')}\n {conditionsCount && `\\u00a0(${conditionsCount})`}\n </span>\n </Flex>\n </Button>\n <Button\n variant='simple'\n onClick={() => {\n onChange();\n }}\n >\n {t('clear_all')}\n </Button>\n </>\n )}\n </Flex>\n );\n }\n);\n\nexport default PromotedFilters;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-condition-builder",
3
- "version": "3.0.0-dev.21.0",
3
+ "version": "3.0.0-dev.22.0",
4
4
  "author": "Pegasystems",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "repository": {
@@ -23,7 +23,7 @@
23
23
  "build": "tsc -b"
24
24
  },
25
25
  "dependencies": {
26
- "@pega/cosmos-react-core": "3.0.0-dev.21.0",
26
+ "@pega/cosmos-react-core": "3.0.0-dev.22.0",
27
27
  "@types/react": "^16.14.24 || ^17.0.38",
28
28
  "@types/react-dom": "^16.9.14 || ^17.0.11",
29
29
  "@types/styled-components": "^5.1.7",