@pega/cosmos-react-work 5.0.0-dev.4.9 → 5.0.0-dev.6.0

package/lib/components/Stages/Stages.types.d.ts

@@ -0,0 +1,38 @@
+import type { ReactNode, Ref } from 'react';
+import type { BaseProps, NoChildrenProp } from '@pega/cosmos-react-core';
+export interface StepProps {
+    /** Step name - either text or link. */
+    name: ReactNode;
+    /** Flag determining whether step has been completed. */
+    completed: boolean;
+    /** Unique step identifier. */
+    id: string;
+}
+export interface StageProps {
+    /** Stage name. */
+    name: string;
+    /** Unique identifier. */
+    id: string;
+    /** Date of completion. Accepts date object, ISO string or timestamp. */
+    date?: Date | string | number;
+    /** Flag determining whether the stage is completed. */
+    completed: boolean;
+    /** Steps data defined in this stage. The stage is treated as not loaded if undefined. */
+    steps?: StepProps[];
+}
+export interface StagesProps extends BaseProps, NoChildrenProp {
+    /** List of objects describing each stage and their state. */
+    stages: StageProps[];
+    /** Current stage id. */
+    current: string;
+    /** Case title (label) */
+    caseTitle?: string;
+    /**
+     * Callback invoked when stage details are requested to show.
+     * @param stages stages' ids requested to load details for.
+     */
+    onLoadStage?: (stages: StageProps['id'][]) => void;
+    /** Ref to the stages container. */
+    ref?: Ref<HTMLDivElement>;
+}
+//# sourceMappingURL=Stages.types.d.ts.map

package/lib/components/Stages/Stages.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stages.types.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/Stages.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAEzE,MAAM,WAAW,SAAS;IACxB,uCAAuC;IACvC,IAAI,EAAE,SAAS,CAAC;IAChB,wDAAwD;IACxD,SAAS,EAAE,OAAO,CAAC;IACnB,8BAA8B;IAC9B,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,UAAU;IACzB,kBAAkB;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,yBAAyB;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,wEAAwE;IACxE,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC;IAC9B,uDAAuD;IACvD,SAAS,EAAE,OAAO,CAAC;IACnB,yFAAyF;IACzF,KAAK,CAAC,EAAE,SAAS,EAAE,CAAC;CACrB;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,cAAc;IAC5D,6DAA6D;IAC7D,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,wBAAwB;IACxB,OAAO,EAAE,MAAM,CAAC;IAChB,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC;IACnD,mCAAmC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}

package/lib/components/Stages/Stages.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Stages.types.js.map

package/lib/components/Stages/Stages.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stages.types.js","sourceRoot":"","sources":["../../../src/components/Stages/Stages.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode, Ref } from 'react';\n\nimport type { BaseProps, NoChildrenProp } from '@pega/cosmos-react-core';\n\nexport interface StepProps {\n  /** Step name - either text or link. */\n  name: ReactNode;\n  /** Flag determining whether step has been completed. */\n  completed: boolean;\n  /** Unique step identifier. */\n  id: string;\n}\n\nexport interface StageProps {\n  /** Stage name. */\n  name: string;\n  /** Unique identifier. */\n  id: string;\n  /** Date of completion. Accepts date object, ISO string or timestamp. */\n  date?: Date | string | number;\n  /** Flag determining whether the stage is completed. */\n  completed: boolean;\n  /** Steps data defined in this stage. The stage is treated as not loaded if undefined. */\n  steps?: StepProps[];\n}\n\nexport interface StagesProps extends BaseProps, NoChildrenProp {\n  /** List of objects describing each stage and their state. */\n  stages: StageProps[];\n  /** Current stage id. */\n  current: string;\n  /** Case title (label) */\n  caseTitle?: string;\n  /**\n   * Callback invoked when stage details are requested to show.\n   * @param stages stages' ids requested to load details for.\n   */\n  onLoadStage?: (stages: StageProps['id'][]) => void;\n  /** Ref to the stages container. */\n  ref?: Ref<HTMLDivElement>;\n}\n"]}

package/lib/components/Stages/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './Stages';
+export type { StagesProps } from './Stages.types';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/Stages/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/lib/components/Stages/index.js

@@ -0,0 +1,2 @@
+export { default } from './Stages';
+//# sourceMappingURL=index.js.map

package/lib/components/Stages/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Stages/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { default } from './Stages';\nexport type { StagesProps } from './Stages.types';\n"]}

package/lib/components/Stakeholders/StakeholderForm.d.ts

@@ -0,0 +1,7 @@
+import type { StakeholdersProps } from './Stakeholders.types';
+interface FormProps extends Pick<StakeholdersProps['form'], 'roles' | 'currentRole' | 'renderer' | 'rendererProps'> {
+    setSelectedRoleNameRef: (selectedRoleName?: string | undefined) => void;
+}
+declare const _default: ({ roles, currentRole, renderer: Renderer, rendererProps, setSelectedRoleNameRef }: FormProps) => JSX.Element;
+export default _default;
+//# sourceMappingURL=StakeholderForm.d.ts.map

package/lib/components/Stakeholders/StakeholderForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StakeholderForm.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/StakeholderForm.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAQ,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEpE,UAAU,SACR,SAAQ,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,aAAa,GAAG,UAAU,GAAG,eAAe,CAAC;IAC/F,sBAAsB,EAAE,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CACzE;4GAQE,SAAS;AANZ,wBA0FE"}

package/lib/components/Stakeholders/StakeholderForm.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { ComboBox, RadioButtonGroup, RadioButton, Flex, useI18n, Input, getFocusables } from '@pega/cosmos-react-core';
+export default ({ roles, currentRole, renderer: Renderer, rendererProps, setSelectedRoleNameRef }) => {
+    const contentRef = useRef(null);
+    const t = useI18n();
+    const [selectedRoleName, setSelectedRoleName] = useState(() => {
+        if (roles) {
+            return (currentRole ? roles.find(role => role.name === currentRole.name) : roles[0])?.name;
+        }
+    });
+    let control = null;
+    if (roles) {
+        const label = t('stakeholders_role');
+        if (roles.length > 3) {
+            const items = roles.map(role => {
+                return {
+                    id: role.name,
+                    primary: role.name,
+                    selected: role.name === selectedRoleName
+                };
+            });
+            const selected = items.find(item => item.selected);
+            control = (_jsx(ComboBox, { label: label, selected: selected ? { items: { id: selected.id, text: selected.primary } } : undefined, menu: {
+                    mode: 'single-select',
+                    items,
+                    onItemClick: setSelectedRoleName
+                } }));
+        }
+        else {
+            control = (_jsx(RadioButtonGroup, { label: label, name: 'role', inline: true, onChange: e => {
+                    setSelectedRoleName(e.target.value);
+                }, children: roles.map(role => (_jsx(RadioButton, { label: role.name, value: role.name, checked: role.name === selectedRoleName }, role.name))) }));
+        }
+    }
+    else if (currentRole) {
+        control = (_jsx(Input, { readOnly: true, label: t('stakeholders_role'), value: currentRole.name, info: currentRole.description }));
+    }
+    useEffect(() => {
+        getFocusables(contentRef)[0]?.focus();
+    }, []);
+    useEffect(() => {
+        if (!roles)
+            return;
+        setSelectedRoleNameRef(selectedRoleName);
+    }, [selectedRoleName]);
+    return (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, ref: contentRef, children: [control, _jsx(Renderer, { ...rendererProps, selectedRoleName: selectedRoleName })] }));
+};
+//# sourceMappingURL=StakeholderForm.js.map

package/lib/components/Stakeholders/StakeholderForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StakeholderForm.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/StakeholderForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport {\n  ComboBox,\n  RadioButtonGroup,\n  RadioButton,\n  Flex,\n  useI18n,\n  Input,\n  getFocusables\n} from '@pega/cosmos-react-core';\n\nimport type { Role, StakeholdersProps } from './Stakeholders.types';\n\ninterface FormProps\n  extends Pick<StakeholdersProps['form'], 'roles' | 'currentRole' | 'renderer' | 'rendererProps'> {\n  setSelectedRoleNameRef: (selectedRoleName?: string | undefined) => void;\n}\n\nexport default ({\n  roles,\n  currentRole,\n  renderer: Renderer,\n  rendererProps,\n  setSelectedRoleNameRef\n}: FormProps) => {\n  const contentRef = useRef<HTMLElement>(null);\n  const t = useI18n();\n\n  const [selectedRoleName, setSelectedRoleName] = useState<Role['name'] | undefined>(() => {\n    if (roles) {\n      return (currentRole ? roles.find(role => role.name === currentRole.name) : roles[0])?.name;\n    }\n  });\n\n  let control: JSX.Element | null = null;\n\n  if (roles) {\n    const label = t('stakeholders_role');\n\n    if (roles.length > 3) {\n      const items = roles.map(role => {\n        return {\n          id: role.name,\n          primary: role.name,\n          selected: role.name === selectedRoleName\n        };\n      });\n\n      const selected = items.find(item => item.selected);\n\n      control = (\n        <ComboBox\n          label={label}\n          selected={selected ? { items: { id: selected.id, text: selected.primary } } : undefined}\n          menu={{\n            mode: 'single-select',\n            items,\n            onItemClick: setSelectedRoleName\n          }}\n        />\n      );\n    } else {\n      control = (\n        <RadioButtonGroup\n          label={label}\n          name='role'\n          inline\n          onChange={e => {\n            setSelectedRoleName(e.target.value);\n          }}\n        >\n          {roles.map(role => (\n            <RadioButton\n              key={role.name}\n              label={role.name}\n              value={role.name}\n              checked={role.name === selectedRoleName}\n            />\n          ))}\n        </RadioButtonGroup>\n      );\n    }\n  } else if (currentRole) {\n    control = (\n      <Input\n        readOnly\n        label={t('stakeholders_role')}\n        value={currentRole.name}\n        info={currentRole.description}\n      />\n    );\n  }\n\n  useEffect(() => {\n    getFocusables(contentRef)[0]?.focus();\n  }, []);\n\n  useEffect(() => {\n    if (!roles) return;\n    setSelectedRoleNameRef(selectedRoleName);\n  }, [selectedRoleName]);\n\n  return (\n    <Flex container={{ direction: 'column', gap: 2 }} ref={contentRef}>\n      {control}\n      <Renderer {...rendererProps} selectedRoleName={selectedRoleName} />\n    </Flex>\n  );\n};\n"]}

package/lib/components/Stakeholders/Stakeholders.d.ts

@@ -0,0 +1,6 @@
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { StakeholdersProps } from './Stakeholders.types';
+declare const Stakeholders: FunctionComponent<StakeholdersProps & ForwardProps>;
+export default Stakeholders;
+//# sourceMappingURL=Stakeholders.d.ts.map

package/lib/components/Stakeholders/Stakeholders.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stakeholders.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAA8B,MAAM,OAAO,CAAC;AAiB3E,OAAO,KAAK,EAEV,YAAY,EAIb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAQ,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAmBpE,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,CA0UrE,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/Stakeholders/Stakeholders.js

@@ -0,0 +1,220 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useRef, useEffect, useMemo, useState, useCallback } from 'react';
+import styled from 'styled-components';
+import { SummaryList, useI18n, Button, ViewAll, Modal, Popover, Flex, Text, useModalManager, useOuterEvent, Progress, useAfterInitialEffect } from '@pega/cosmos-react-core';
+import StakeholderForm from './StakeholderForm';
+const StyledStakeholders = styled(SummaryList) ``;
+const StyledEditFormWrap = styled.div `
+  position: relative;
+  min-height: 8rem;
+
+  &[aria-busy='true'] > :nth-child(2) {
+    visibility: hidden;
+  }
+`;
+const StyledPopover = styled(Popover) `
+  width: 40ch;
+  min-height: 12rem;
+`;
+const Stakeholders = forwardRef(function Stakeholders({ items: itemsProp, count, loading, onAddNew, form, onViewAll, viewAll, error, ...restProps }, ref) {
+    const { create: createModal } = useModalManager();
+    const t = useI18n();
+    const modalMethods = useRef();
+    const [mode, setMode] = useState();
+    const [editing, setEditing] = useState(false);
+    const [viewAllSearchValue, setViewAllSearchValue] = useState('');
+    const popoverRef = useRef(null);
+    const progressMsgRef = useRef(t('loading'));
+    // Why? Don't think this should trigger a re-render. We just need the value when we invoke callback props.
+    const selectedRoleNameRef = useRef();
+    // Setter for the ref. Avoids a re-render.
+    const setSelectedRoleNameRef = useCallback((selectedRoleName) => {
+        selectedRoleNameRef.current = selectedRoleName;
+    }, []);
+    const [popoverTarget, setPopoverTarget] = useState(null);
+    const itemElsRef = useRef({
+        itemEls: [],
+        viewAllItemEls: []
+    });
+    // This function merges the pre-defined actions(add & edit) to the item object.
+    const mergeItemActions = (items) => {
+        return items.map(({ onEdit, onRemove, ...rest }, i) => {
+            let itemActions = [];
+            const elArray = itemElsRef.current[mode === 'viewAll' ? 'viewAllItemEls' : 'itemEls'];
+            if (onEdit) {
+                itemActions = [
+                    {
+                        id: 'edit',
+                        text: t('edit'),
+                        icon: 'pencil',
+                        onClick: () => {
+                            setEditing(true);
+                            setPopoverTarget({
+                                portal: elArray[i],
+                                button: elArray[i].querySelector('button[aria-haspopup="menu"]')
+                            });
+                            onEdit?.();
+                        }
+                    }
+                ];
+            }
+            if (onRemove) {
+                itemActions = [
+                    ...itemActions,
+                    {
+                        id: 'remove',
+                        text: t('remove'),
+                        icon: 'trash',
+                        onClick: () => {
+                            onRemove?.();
+                        }
+                    }
+                ];
+            }
+            return {
+                ...rest,
+                ref: (el) => {
+                    elArray[i] = el;
+                },
+                actions: itemActions
+            };
+        });
+    };
+    const closePopover = () => {
+        if (!popoverTarget || (form.loading && progressMsgRef.current === t('submitting')))
+            return;
+        popoverTarget.button?.focus();
+        setPopoverTarget(null);
+        setEditing(false);
+        progressMsgRef.current = t('loading');
+    };
+    let formContent = null;
+    if ((mode === 'add' || editing) &&
+        (!form.loading || progressMsgRef.current === t('submitting'))) {
+        formContent = (_jsx(StakeholderForm, { roles: form.roles, currentRole: form.currentRole, renderer: form.renderer, rendererProps: form.rendererProps, setSelectedRoleNameRef: setSelectedRoleNameRef }));
+    }
+    // Actions used for add and edit both in the modal and the popover.
+    let formActions = null;
+    if ((mode === 'add' || editing) &&
+        (!form.loading || progressMsgRef.current === t('submitting'))) {
+        const closeForm = () => {
+            if (mode === 'add') {
+                modalMethods.current?.dismiss();
+            }
+            else {
+                closePopover();
+            }
+        };
+        formActions = (_jsxs(_Fragment, { children: [_jsx(Button, { disabled: form.loading, onClick: () => {
+                        form.onDismiss({ closeForm });
+                    }, children: t('cancel') }), _jsx(Button, { disabled: form.loading, type: 'submit', variant: 'primary', onClick: () => {
+                        progressMsgRef.current = t('submitting');
+                        form.onSubmit({
+                            selectedRoleName: selectedRoleNameRef.current,
+                            closeForm
+                        });
+                    }, children: t('submit') })] }));
+    }
+    let editPopover = null;
+    if (popoverTarget) {
+        editPopover = (_jsx(StyledPopover, { ref: popoverRef, target: popoverTarget.button, placement: 'auto', role: 'dialog', children: _jsxs(Flex, { container: { direction: 'column', gap: 2, pad: 2 }, children: [_jsx(Text, { variant: 'h3', children: t('edit_stakeholder') }), _jsxs(StyledEditFormWrap, { "aria-busy": form.loading ? 'true' : 'false', children: [_jsx(Progress, { placement: 'local', visible: form.loading, message: progressMsgRef.current }), (!form.loading || progressMsgRef.current === t('submitting')) && (_jsx(StakeholderForm, { roles: form.roles, currentRole: form.currentRole, renderer: form.renderer, rendererProps: form.rendererProps, setSelectedRoleNameRef: setSelectedRoleNameRef }))] }), formActions && _jsx(Flex, { container: { justify: 'between' }, children: formActions })] }) }));
+    }
+    // Content for the modal either for adding new or viewing all.
+    let modalContent = null;
+    if (mode === 'add')
+        modalContent = formContent;
+    if (!viewAll.loading && (mode === 'viewAll' || (editing && modalMethods.current))) {
+        modalContent = (_jsxs(_Fragment, { children: [_jsx(ViewAll, { items: mergeItemActions(viewAll.items), actions: [
+                        {
+                            id: 'addStakeHolder',
+                            text: 'Add new',
+                            onClick: () => {
+                                setMode('add');
+                                onAddNew?.();
+                            }
+                        }
+                    ], searchInputProps: viewAll.onSearch
+                        ? {
+                            value: viewAllSearchValue,
+                            onSearchChange: (value) => {
+                                setViewAllSearchValue(value);
+                                viewAll?.onSearch?.(value);
+                            }
+                        }
+                        : undefined }), editPopover] }));
+    }
+    useEffect(() => {
+        if (!mode) {
+            modalMethods.current = undefined;
+            return;
+        }
+        const modalProps = {
+            progress: (mode === 'add' && form.loading) || viewAll.loading
+                ? { message: progressMsgRef.current }
+                : undefined,
+            count: mode === 'viewAll' ? count : undefined,
+            children: modalContent,
+            actions: mode === 'add' ? formActions : undefined,
+            onRequestDismiss: form.loading && progressMsgRef.current === t('submitting') ? () => false : undefined
+        };
+        if (modalMethods.current) {
+            modalMethods.current.update(modalProps);
+        }
+        else if (mode === 'add' || mode === 'viewAll') {
+            modalMethods.current = createModal(Modal, {
+                ...modalProps,
+                heading: mode === 'add' ? t('add_stakeholders') : t('view_stakeholders'),
+                onAfterClose: () => {
+                    if (mode === 'add') {
+                        form.onAfterClose?.();
+                    }
+                    else {
+                        setViewAllSearchValue('');
+                        viewAll.onAfterClose?.();
+                    }
+                    progressMsgRef.current = t('loading');
+                    setMode(undefined);
+                }
+            });
+        }
+    }, [mode, modalContent, form.loading, formActions, count, viewAll.loading]);
+    // Using mousedown instead of click since drag selecting an input's value within the popover, then releasing outside the popover triggers outer click.
+    useOuterEvent('mousedown', [popoverRef], closePopover);
+    const onKeydown = (e) => {
+        if (e.key === 'Escape') {
+            closePopover();
+        }
+    };
+    useEffect(() => {
+        if (!popoverTarget)
+            return;
+        document.addEventListener('keydown', onKeydown);
+        return () => {
+            document.removeEventListener('keydown', onKeydown);
+        };
+    }, [popoverTarget]);
+    useAfterInitialEffect(() => {
+        if (!popoverTarget)
+            form.onAfterClose?.();
+    }, [popoverTarget]);
+    return (_jsxs(_Fragment, { children: [_jsx(StyledStakeholders, { ...restProps, ref: ref, icon: 'person', name: t('view_stakeholders'), headingTag: 'h3', loading: loading, count: count, error: error, items: useMemo(() => mergeItemActions(itemsProp.slice(0, 3)), [mergeItemActions, itemsProp]), actions: onAddNew
+                    ? [
+                        {
+                            text: t('add'),
+                            id: 'add_new',
+                            icon: 'plus',
+                            onClick() {
+                                setMode('add');
+                                onAddNew?.();
+                            }
+                        }
+                    ]
+                    : undefined, onViewAll: onViewAll && count && count > 3
+                    ? () => {
+                        setMode('viewAll');
+                        onViewAll?.();
+                    }
+                    : undefined }), editPopover && mode !== 'viewAll' ? editPopover : null] }));
+});
+export default Stakeholders;
+//# sourceMappingURL=Stakeholders.js.map

package/lib/components/Stakeholders/Stakeholders.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stakeholders.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect, useMemo, useState, useCallback } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport {\n  SummaryList,\n  useI18n,\n  Button,\n  ViewAll,\n  Modal,\n  Popover,\n  Flex,\n  Text,\n  useModalManager,\n  useOuterEvent,\n  Progress,\n  useAfterInitialEffect\n} from '@pega/cosmos-react-core';\nimport type {\n  Action,\n  ForwardProps,\n  ModalMethods,\n  ModalProps,\n  OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport type { Role, StakeholdersProps } from './Stakeholders.types';\nimport StakeholderForm from './StakeholderForm';\n\nconst StyledStakeholders = styled(SummaryList)``;\n\nconst StyledEditFormWrap = styled.div`\n  position: relative;\n  min-height: 8rem;\n\n  &[aria-busy='true'] > :nth-child(2) {\n    visibility: hidden;\n  }\n`;\n\nconst StyledPopover = styled(Popover)`\n  width: 40ch;\n  min-height: 12rem;\n`;\n\nconst Stakeholders: FunctionComponent<StakeholdersProps & ForwardProps> = forwardRef(\n  function Stakeholders(\n    {\n      items: itemsProp,\n      count,\n      loading,\n      onAddNew,\n      form,\n      onViewAll,\n      viewAll,\n      error,\n      ...restProps\n    }: PropsWithoutRef<StakeholdersProps>,\n    ref: StakeholdersProps['ref']\n  ) {\n    const { create: createModal } = useModalManager();\n    const t = useI18n();\n    const modalMethods = useRef<ModalMethods>();\n    const [mode, setMode] = useState<undefined | 'add' | 'viewAll'>();\n    const [editing, setEditing] = useState(false);\n    const [viewAllSearchValue, setViewAllSearchValue] = useState('');\n    const popoverRef = useRef<HTMLDivElement>(null);\n    const progressMsgRef = useRef(t('loading'));\n\n    // Why? Don't think this should trigger a re-render. We just need the value when we invoke callback props.\n    const selectedRoleNameRef = useRef<Role['name'] | undefined>();\n    // Setter for the ref. Avoids a re-render.\n    const setSelectedRoleNameRef = useCallback((selectedRoleName?: Role['name']) => {\n      selectedRoleNameRef.current = selectedRoleName;\n    }, []);\n\n    const [popoverTarget, setPopoverTarget] = useState<{\n      portal: HTMLLIElement;\n      button: HTMLButtonElement | null;\n    } | null>(null);\n\n    const itemElsRef = useRef<{ itemEls: HTMLLIElement[]; viewAllItemEls: HTMLLIElement[] }>({\n      itemEls: [],\n      viewAllItemEls: []\n    });\n\n    // This function merges the pre-defined actions(add & edit) to the item object.\n    const mergeItemActions = (\n      items: StakeholdersProps['items'] | NonNullable<StakeholdersProps['viewAll']>['items']\n    ) => {\n      return items.map(({ onEdit, onRemove, ...rest }, i) => {\n        let itemActions: Action[] = [];\n        const elArray = itemElsRef.current[mode === 'viewAll' ? 'viewAllItemEls' : 'itemEls'];\n\n        if (onEdit) {\n          itemActions = [\n            {\n              id: 'edit',\n              text: t('edit'),\n              icon: 'pencil',\n              onClick: () => {\n                setEditing(true);\n                setPopoverTarget({\n                  portal: elArray[i],\n                  button: elArray[i].querySelector<HTMLButtonElement>(\n                    'button[aria-haspopup=\"menu\"]'\n                  )\n                });\n\n                onEdit?.();\n              }\n            }\n          ];\n        }\n\n        if (onRemove) {\n          itemActions = [\n            ...itemActions,\n            {\n              id: 'remove',\n              text: t('remove'),\n              icon: 'trash',\n              onClick: () => {\n                onRemove?.();\n              }\n            }\n          ];\n        }\n\n        return {\n          ...rest,\n          ref: (el: HTMLLIElement) => {\n            elArray[i] = el;\n          },\n          actions: itemActions\n        };\n      });\n    };\n\n    const closePopover = () => {\n      if (!popoverTarget || (form.loading && progressMsgRef.current === t('submitting'))) return;\n      popoverTarget.button?.focus();\n      setPopoverTarget(null);\n      setEditing(false);\n      progressMsgRef.current = t('loading');\n    };\n\n    let formContent: ReactNode = null;\n    if (\n      (mode === 'add' || editing) &&\n      (!form.loading || progressMsgRef.current === t('submitting'))\n    ) {\n      formContent = (\n        <StakeholderForm\n          roles={form.roles}\n          currentRole={form.currentRole}\n          renderer={form.renderer}\n          rendererProps={form.rendererProps}\n          setSelectedRoleNameRef={setSelectedRoleNameRef}\n        />\n      );\n    }\n\n    // Actions used for add and edit both in the modal and the popover.\n    let formActions: ReactNode = null;\n    if (\n      (mode === 'add' || editing) &&\n      (!form.loading || progressMsgRef.current === t('submitting'))\n    ) {\n      const closeForm = () => {\n        if (mode === 'add') {\n          modalMethods.current?.dismiss();\n        } else {\n          closePopover();\n        }\n      };\n\n      formActions = (\n        <>\n          <Button\n            disabled={form.loading}\n            onClick={() => {\n              form.onDismiss({ closeForm });\n            }}\n          >\n            {t('cancel')}\n          </Button>\n          <Button\n            disabled={form.loading}\n            type='submit'\n            variant='primary'\n            onClick={() => {\n              progressMsgRef.current = t('submitting');\n              form.onSubmit({\n                selectedRoleName: selectedRoleNameRef.current,\n                closeForm\n              });\n            }}\n          >\n            {t('submit')}\n          </Button>\n        </>\n      );\n    }\n\n    let editPopover: ReactNode = null;\n    if (popoverTarget) {\n      editPopover = (\n        <StyledPopover\n          ref={popoverRef}\n          target={popoverTarget.button}\n          placement='auto'\n          role='dialog'\n        >\n          <Flex container={{ direction: 'column', gap: 2, pad: 2 }}>\n            <Text variant='h3'>{t('edit_stakeholder')}</Text>\n            <StyledEditFormWrap aria-busy={form.loading ? 'true' : 'false'}>\n              <Progress placement='local' visible={form.loading} message={progressMsgRef.current} />\n              {(!form.loading || progressMsgRef.current === t('submitting')) && (\n                <StakeholderForm\n                  roles={form.roles}\n                  currentRole={form.currentRole}\n                  renderer={form.renderer}\n                  rendererProps={form.rendererProps}\n                  setSelectedRoleNameRef={setSelectedRoleNameRef}\n                />\n              )}\n            </StyledEditFormWrap>\n            {formActions && <Flex container={{ justify: 'between' }}>{formActions}</Flex>}\n          </Flex>\n        </StyledPopover>\n      );\n    }\n\n    // Content for the modal either for adding new or viewing all.\n    let modalContent: ReactNode = null;\n    if (mode === 'add') modalContent = formContent;\n\n    if (!viewAll.loading && (mode === 'viewAll' || (editing && modalMethods.current))) {\n      modalContent = (\n        <>\n          <ViewAll\n            items={mergeItemActions(viewAll.items)}\n            actions={[\n              {\n                id: 'addStakeHolder',\n                text: 'Add new',\n                onClick: () => {\n                  setMode('add');\n                  onAddNew?.();\n                }\n              }\n            ]}\n            searchInputProps={\n              viewAll.onSearch\n                ? {\n                    value: viewAllSearchValue,\n                    onSearchChange: (value: string) => {\n                      setViewAllSearchValue(value);\n                      viewAll?.onSearch?.(value);\n                    }\n                  }\n                : undefined\n            }\n          />\n          {/* Edit popover triggered from a modal must be rendered within modal content to render in correct DOM position. */}\n          {editPopover}\n        </>\n      );\n    }\n\n    useEffect(() => {\n      if (!mode) {\n        modalMethods.current = undefined;\n        return;\n      }\n\n      const modalProps: OmitStrict<ModalProps, 'heading'> = {\n        progress:\n          (mode === 'add' && form.loading) || viewAll.loading\n            ? { message: progressMsgRef.current }\n            : undefined,\n        count: mode === 'viewAll' ? count : undefined,\n        children: modalContent,\n        actions: mode === 'add' ? formActions : undefined,\n        onRequestDismiss:\n          form.loading && progressMsgRef.current === t('submitting') ? () => false : undefined\n      };\n\n      if (modalMethods.current) {\n        modalMethods.current.update(modalProps);\n      } else if (mode === 'add' || mode === 'viewAll') {\n        modalMethods.current = createModal(Modal, {\n          ...modalProps,\n          heading: mode === 'add' ? t('add_stakeholders') : t('view_stakeholders'),\n          onAfterClose: () => {\n            if (mode === 'add') {\n              form.onAfterClose?.();\n            } else {\n              setViewAllSearchValue('');\n              viewAll.onAfterClose?.();\n            }\n\n            progressMsgRef.current = t('loading');\n            setMode(undefined);\n          }\n        });\n      }\n    }, [mode, modalContent, form.loading, formActions, count, viewAll.loading]);\n\n    // Using mousedown instead of click since drag selecting an input's value within the popover, then releasing outside the popover triggers outer click.\n    useOuterEvent('mousedown', [popoverRef], closePopover);\n\n    const onKeydown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        closePopover();\n      }\n    };\n\n    useEffect(() => {\n      if (!popoverTarget) return;\n      document.addEventListener('keydown', onKeydown);\n      return () => {\n        document.removeEventListener('keydown', onKeydown);\n      };\n    }, [popoverTarget]);\n\n    useAfterInitialEffect(() => {\n      if (!popoverTarget) form.onAfterClose?.();\n    }, [popoverTarget]);\n\n    return (\n      <>\n        <StyledStakeholders\n          {...restProps}\n          ref={ref}\n          icon='person'\n          name={t('view_stakeholders')}\n          headingTag='h3'\n          loading={loading}\n          count={count}\n          error={error}\n          items={useMemo(\n            () => mergeItemActions(itemsProp.slice(0, 3)),\n            [mergeItemActions, itemsProp]\n          )}\n          actions={\n            onAddNew\n              ? [\n                  {\n                    text: t('add'),\n                    id: 'add_new',\n                    icon: 'plus',\n                    onClick() {\n                      setMode('add');\n                      onAddNew?.();\n                    }\n                  }\n                ]\n              : undefined\n          }\n          onViewAll={\n            onViewAll && count && count > 3\n              ? () => {\n                  setMode('viewAll');\n                  onViewAll?.();\n                }\n              : undefined\n          }\n        />\n        {/* When edit is opened outside of the view all modal. */}\n        {editPopover && mode !== 'viewAll' ? editPopover : null}\n      </>\n    );\n  }\n);\n\nexport default Stakeholders;\n"]}

package/lib/components/Stakeholders/Stakeholders.types.d.ts

@@ -0,0 +1,75 @@
+import type { ComponentType } from 'react';
+import type { SummaryListProps, ForwardProps, NoChildrenProp, SummaryListItem } from '@pega/cosmos-react-core';
+export type Role = {
+    name: string;
+    description: string;
+};
+/** A simple extension of a SummaryListItem. Pass onEdit and or onRemove to render either action for a stakeholder. */
+export interface Stakeholder extends SummaryListItem, ForwardProps {
+    onEdit?: () => void;
+    onRemove?: () => void;
+}
+export interface StakeholdersProps extends NoChildrenProp, Pick<SummaryListProps, 'count' | 'loading' | 'error' | 'ref'> {
+    /**
+     * The initial array of stakeholders presented in the default state of the widget.
+     * This array will be sliced internally to the first three items but recommend only passing up to that length as a best practice.
+     */
+    items: Stakeholder[];
+    /** Called when a user opens the add form. */
+    onAddNew?: () => void;
+    /**
+     * Data and a component required to render a form for both add and edit.
+     * If there are roles, the renderer is passed the currently selected role.
+     */
+    form: {
+        /** Indicates the form is in a loading state either initially or after add/edit is submitted. */
+        loading?: boolean;
+        /** An array of available roles a stakeholder may be assigned. */
+        roles?: Role[];
+        /** Use this when onAdd or onEdit is invoked to indicate to the component which role option to select. */
+        currentRole?: Role;
+        /**
+         * A component to render the main portion of the add/edit stakeholder form.
+         * This may be a simple function and will be pass a prop when the selected role changes.
+         */
+        renderer: ComponentType<{
+            selectedRoleName?: Role['name'];
+        }>;
+        /** A props object that will be passed to the form renderer. */
+        rendererProps?: {
+            [key: string]: unknown;
+        };
+        /**
+         * Called when a user submits the form.
+         * The name of the currently selected role will be passed along with a function to close the form on an arg object.
+         * closeForm will close the modal or popover the form is preseneted in.
+         * closeForm can be call once validations and requests have resolved.
+         */
+        onSubmit: ({ selectedRoleName, closeForm }: {
+            selectedRoleName: Role['name'] | undefined;
+            closeForm: () => void;
+        }) => void;
+        /**
+         * Called when a user cancels a form.
+         * A function to close the form will be passed on an arg object.
+         */
+        onDismiss: ({ closeForm }: {
+            closeForm: () => void;
+        }) => void;
+        /** Called after the modal or popover transitions and un-mounts as a result of a closeForm call or user dismissal. */
+        onAfterClose?: () => void;
+    };
+    /** Called when a user opens the view all modal. */
+    onViewAll?: () => void;
+    viewAll: {
+        /** Indicates the view all list is in a loading state while data is fetched. */
+        loading?: boolean;
+        /** Pass a full or filtered list of stakeholder items. Filter based on search input. */
+        items: StakeholdersProps['items'];
+        /** Called when a user enters a view all search. Return a filtered array to viewAll['items'] with matching stakeholders. */
+        onSearch?: (value: string) => void;
+        /** Called after the modal or popover transitions and un-mounts as a result of a closeForm call or user dismissal. */
+        onAfterClose?: () => void;
+    };
+}
+//# sourceMappingURL=Stakeholders.types.d.ts.map

package/lib/components/Stakeholders/Stakeholders.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stakeholders.types.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,KAAK,EACV,gBAAgB,EAChB,YAAY,EACZ,cAAc,EACd,eAAe,EAChB,MAAM,yBAAyB,CAAC;AAEjC,MAAM,MAAM,IAAI,GAAG;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,sHAAsH;AACtH,MAAM,WAAW,WAAY,SAAQ,eAAe,EAAE,YAAY;IAChE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,iBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,KAAK,CAAC;IAC/D;;;OAGG;IACH,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,IAAI,EAAE;QACJ,gGAAgG;QAChG,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,iEAAiE;QACjE,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;QACf,yGAAyG;QACzG,WAAW,CAAC,EAAE,IAAI,CAAC;QACnB;;;WAGG;QACH,QAAQ,EAAE,aAAa,CAAC;YAAE,gBAAgB,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAA;SAAE,CAAC,CAAC;QAC7D,+DAA+D;QAC/D,aAAa,CAAC,EAAE;YACd,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;SACxB,CAAC;QACF;;;;;WAKG;QACH,QAAQ,EAAE,CAAC,EACT,gBAAgB,EAChB,SAAS,EACV,EAAE;YACD,gBAAgB,EAAE,IAAI,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;YAC3C,SAAS,EAAE,MAAM,IAAI,CAAC;SACvB,KAAK,IAAI,CAAC;QACX;;;WAGG;QACH,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE;YAAE,SAAS,EAAE,MAAM,IAAI,CAAA;SAAE,KAAK,IAAI,CAAC;QAC9D,qHAAqH;QACrH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;KAC3B,CAAC;IACF,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,EAAE;QACP,+EAA+E;QAC/E,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,uFAAuF;QACvF,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;QAClC,2HAA2H;QAC3H,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;QACnC,qHAAqH;QACrH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;KAC3B,CAAC;CACH"}

package/lib/components/Stakeholders/Stakeholders.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Stakeholders.types.js.map

package/lib/components/Stakeholders/Stakeholders.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stakeholders.types.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentType } from 'react';\n\nimport type {\n  SummaryListProps,\n  ForwardProps,\n  NoChildrenProp,\n  SummaryListItem\n} from '@pega/cosmos-react-core';\n\nexport type Role = {\n  name: string;\n  description: string;\n};\n\n/** A simple extension of a SummaryListItem. Pass onEdit and or onRemove to render either action for a stakeholder. */\nexport interface Stakeholder extends SummaryListItem, ForwardProps {\n  onEdit?: () => void;\n  onRemove?: () => void;\n}\n\nexport interface StakeholdersProps\n  extends NoChildrenProp,\n    Pick<SummaryListProps, 'count' | 'loading' | 'error' | 'ref'> {\n  /**\n   * The initial array of stakeholders presented in the default state of the widget.\n   * This array will be sliced internally to the first three items but recommend only passing up to that length as a best practice.\n   */\n  items: Stakeholder[];\n  /** Called when a user opens the add form. */\n  onAddNew?: () => void;\n  /**\n   * Data and a component required to render a form for both add and edit.\n   * If there are roles, the renderer is passed the currently selected role.\n   */\n  form: {\n    /** Indicates the form is in a loading state either initially or after add/edit is submitted. */\n    loading?: boolean;\n    /** An array of available roles a stakeholder may be assigned. */\n    roles?: Role[];\n    /** Use this when onAdd or onEdit is invoked to indicate to the component which role option to select. */\n    currentRole?: Role;\n    /**\n     * A component to render the main portion of the add/edit stakeholder form.\n     * This may be a simple function and will be pass a prop when the selected role changes.\n     */\n    renderer: ComponentType<{ selectedRoleName?: Role['name'] }>;\n    /** A props object that will be passed to the form renderer. */\n    rendererProps?: {\n      [key: string]: unknown;\n    };\n    /**\n     * Called when a user submits the form.\n     * The name of the currently selected role will be passed along with a function to close the form on an arg object.\n     * closeForm will close the modal or popover the form is preseneted in.\n     * closeForm can be call once validations and requests have resolved.\n     */\n    onSubmit: ({\n      selectedRoleName,\n      closeForm\n    }: {\n      selectedRoleName: Role['name'] | undefined;\n      closeForm: () => void;\n    }) => void;\n    /**\n     * Called when a user cancels a form.\n     * A function to close the form will be passed on an arg object.\n     */\n    onDismiss: ({ closeForm }: { closeForm: () => void }) => void;\n    /** Called after the modal or popover transitions and un-mounts as a result of a closeForm call or user dismissal. */\n    onAfterClose?: () => void;\n  };\n  /** Called when a user opens the view all modal. */\n  onViewAll?: () => void;\n  viewAll: {\n    /** Indicates the view all list is in a loading state while data is fetched. */\n    loading?: boolean;\n    /** Pass a full or filtered list of stakeholder items. Filter based on search input. */\n    items: StakeholdersProps['items'];\n    /** Called when a user enters a view all search. Return a filtered array to viewAll['items'] with matching stakeholders. */\n    onSearch?: (value: string) => void;\n    /** Called after the modal or popover transitions and un-mounts as a result of a closeForm call or user dismissal. */\n    onAfterClose?: () => void;\n  };\n}\n"]}

package/lib/components/Stakeholders/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './Stakeholders';
+export type { StakeholdersProps, Role, Stakeholder } from './Stakeholders.types';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/Stakeholders/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,YAAY,EAAE,iBAAiB,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC"}

package/lib/components/Stakeholders/index.js

@@ -0,0 +1,2 @@
+export { default } from './Stakeholders';
+//# sourceMappingURL=index.js.map

package/lib/components/Stakeholders/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC","sourcesContent":["export { default } from './Stakeholders';\nexport type { StakeholdersProps, Role, Stakeholder } from './Stakeholders.types';\n"]}

package/lib/components/Tags/Tags.d.ts

@@ -0,0 +1,34 @@
+import type { FunctionComponent, Ref } from 'react';
+import type { BaseProps, ForwardProps, ErrorStateProps, NoChildrenProp } from '@pega/cosmos-react-core';
+export interface SelectedTag {
+    text: string;
+    newTag?: boolean;
+}
+export interface TagsProps extends BaseProps, NoChildrenProp {
+    /** A list of tags. */
+    tags: string[];
+    /**
+     * A list of available tags to add from.
+     * @default []
+     */
+    availableTags?: string[];
+    /** If true, a loading indicator will render in place of the tags list. */
+    loading?: boolean;
+    /** If defined, an error message will render in the component and actions will be disabled. */
+    error?: boolean | string | ErrorStateProps;
+    /** Callback triggered when a search query is changed in the Edit tags modal. */
+    onSearch?: (filterValue: string) => void;
+    /** Callback triggered when a tag is clicked. */
+    onTagClick?: (tag: string) => void;
+    /** Callback triggered when modified tags are submitted from the modal. */
+    onEditTags?: (tags: SelectedTag[]) => Promise<void>;
+    /** Ref for the Tags card. */
+    ref?: Ref<HTMLElement>;
+}
+export declare const StyledTags: import("styled-components").StyledComponent<"article", import("styled-components").DefaultTheme, {
+    isLoading?: boolean | undefined;
+    viewAll?: boolean | undefined;
+}, never>;
+declare const Tags: FunctionComponent<TagsProps & ForwardProps>;
+export default Tags;
+//# sourceMappingURL=Tags.d.ts.map

package/lib/components/Tags/Tags.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tags.d.ts","sourceRoot":"","sources":["../../../src/components/Tags/Tags.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAIV,iBAAiB,EAEjB,GAAG,EACJ,MAAM,OAAO,CAAC;AA6Bf,OAAO,KAAK,EACV,SAAS,EACT,YAAY,EAGZ,eAAe,EACf,cAAc,EACf,MAAM,yBAAyB,CAAC;AASjC,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,cAAc;IAC1D,sBAAsB;IACtB,IAAI,EAAE,MAAM,EAAE,CAAC;IACf;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,0EAA0E;IAC1E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,8FAA8F;IAC9F,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,eAAe,CAAC;IAC3C,gFAAgF;IAChF,QAAQ,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,gDAAgD;IAChD,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,0EAA0E;IAC1E,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,EAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpD,6BAA6B;IAC7B,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AASD,eAAO,MAAM,UAAU;;;SA4BtB,CAAC;AAoMF,QAAA,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,GAAG,YAAY,CA8HpD,CAAC;AAEH,eAAe,IAAI,CAAC"}