@pega/cosmos-react-core 9.0.0-build.1.0 → 9.0.0-build.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/File/FileItem.d.ts.map +1 -1
- package/lib/components/File/FileItem.js +2 -2
- package/lib/components/File/FileItem.js.map +1 -1
- package/lib/components/IconPicker/IconPicker.d.ts +4 -4
- package/lib/components/IconPicker/IconPicker.d.ts.map +1 -1
- package/lib/components/IconPicker/IconPicker.js +19 -25
- package/lib/components/IconPicker/IconPicker.js.map +1 -1
- package/lib/components/PageTemplates/PageTemplates.d.ts.map +1 -1
- package/lib/components/PageTemplates/PageTemplates.js +27 -2
- package/lib/components/PageTemplates/PageTemplates.js.map +1 -1
- package/lib/components/Tree/Tree.js +1 -1
- package/lib/components/Tree/Tree.js.map +1 -1
- package/lib/hooks/useI18n.d.ts +3 -0
- package/lib/hooks/useI18n.d.ts.map +1 -1
- package/lib/i18n/default.d.ts +3 -0
- package/lib/i18n/default.d.ts.map +1 -1
- package/lib/i18n/default.js +3 -0
- package/lib/i18n/default.js.map +1 -1
- package/lib/i18n/i18n.d.ts +3 -0
- package/lib/i18n/i18n.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileItem.d.ts","sourceRoot":"","sources":["../../../src/components/File/FileItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAYlD,OAAO,KAAK,EAAE,+BAA+B,EAAE,SAAS,EAAU,MAAM,aAAa,CAAC;AAetF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAIpD,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,0BAA0B;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,wBAAwB;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,oIAAoI;IACpI,SAAS,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAC;IACzC,yCAAyC;IACzC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,8IAA8I;IAC9I,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC7C,yGAAyG;IACzG,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC3C,yFAAyF;IACzF,SAAS,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC9C;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,0IAA0I;IAC1I,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC/C,yGAAyG;IACzG,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC7C,yGAAyG;IACzG,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC3C,gIAAgI;IAChI,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oGAAoG;IACpG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AA+CD,eAAO,MAAM,cAAc;iBACZ,aAAa,CAAC,SAAS,CAAC;iBACxB,aAAa,CAAC,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"FileItem.d.ts","sourceRoot":"","sources":["../../../src/components/File/FileItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAYlD,OAAO,KAAK,EAAE,+BAA+B,EAAE,SAAS,EAAU,MAAM,aAAa,CAAC;AAetF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAIpD,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,0BAA0B;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,wBAAwB;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,oIAAoI;IACpI,SAAS,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAC;IACzC,yCAAyC;IACzC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,8IAA8I;IAC9I,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC7C,yGAAyG;IACzG,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC3C,yFAAyF;IACzF,SAAS,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC9C;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,0IAA0I;IAC1I,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC/C,yGAAyG;IACzG,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC7C,yGAAyG;IACzG,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC3C,gIAAgI;IAChI,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oGAAoG;IACpG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AA+CD,eAAO,MAAM,cAAc;iBACZ,aAAa,CAAC,SAAS,CAAC;iBACxB,aAAa,CAAC,UAAU,CAAC;SA2EvC,CAAC;AAIF,QAAA,MAAM,QAAQ,EAAE,+BAA+B,CAAC,aAAa,CAwL3D,CAAC;AAEH,eAAe,QAAQ,CAAC"}
|
|
@@ -60,9 +60,9 @@ const StyledActionsWrapper = styled.div(({ meta }) => {
|
|
|
60
60
|
`;
|
|
61
61
|
});
|
|
62
62
|
StyledActionsWrapper.defaultProps = defaultThemeProp;
|
|
63
|
-
export const StyledFileItem = styled.div(({ theme: { base: { palette,
|
|
63
|
+
export const StyledFileItem = styled.div(({ theme: { base: { palette, spacing, 'hit-area': { compact }, 'disabled-opacity': disabledOpacity }, components: { input, 'form-control': { ':disabled': { 'background-color': disabledBackgroundColor, 'border-color': disabledBorderColor } } } }, compactMode, isDisabled }) => {
|
|
64
64
|
return css `
|
|
65
|
-
border-radius: calc(
|
|
65
|
+
border-radius: calc(var(--container-border-radius) * 0.5);
|
|
66
66
|
border: 0.0625rem solid ${palette['border-line']};
|
|
67
67
|
background-color: ${palette['primary-background']};
|
|
68
68
|
height: ${input.height};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileItem.js","sourceRoot":"","sources":["../../../src/components/File/FileItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useState } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as openIcon from '../Icon/icons/open.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as previewIcon from '../Icon/icons/preview.icon';\nimport * as editIcon from '../Icon/icons/pencil.icon';\nimport * as downloadIcon from '../Icon/icons/download.icon';\nimport * as deleteIcon from '../Icon/icons/trash.icon';\nimport Text, { StyledText } from '../Text';\nimport Tooltip from '../Tooltip';\nimport type { ForwardRefForwardPropsComponent, BaseProps, Action } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Button, { StyledButton } from '../Button';\nimport { useI18n, useElement, useConfiguration, useConsolidatedRef } from '../../hooks';\nimport Actions from '../Actions';\nimport Progress from '../Progress';\nimport { StyledProgressRing } from '../Progress/Progress.styles';\nimport { formatNumber } from '../Number';\nimport Flex from '../Flex';\nimport { StyledIconShape } from '../Icon/Icon';\nimport { getActiveElement, getFocusables } from '../../utils';\nimport { ellipsisOverflow } from '../../styles/mixins';\n\nimport { getKindFromMimeType, getMimeTypeFromFile } from './utils';\nimport FileVisual, { StyledFileVisual } from './FileVisual';\nimport type { FileVisualProps } from './FileVisual';\n\nregisterIcon(openIcon, timesIcon, previewIcon, editIcon, downloadIcon, deleteIcon);\n\nexport interface FileItemProps extends BaseProps {\n /** Unique id for item. */\n id: string;\n /** Name of the file. */\n name: string;\n /** A string to be used as an image src for a attachment thumbnail. Falls back to a provided icon or the default attachment icon. */\n thumbnail?: FileVisualProps['thumbnail'];\n /** File extension. Use 'url' for link */\n format?: string;\n /**\n * Used for a smaller sized FileItem.\n * @default false\n */\n compact?: boolean;\n /** When passed, will render a single icon button for yet to be or in progress uploads. Use this action to trigger xhr request termination. */\n onCancel?: (id: FileItemProps['id']) => void;\n /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n onEdit?: (id: FileItemProps['id']) => void;\n /** When passed, will be called on click of the name. Passes file id as the parameter. */\n onPreview?: (id: FileItemProps['id']) => void;\n /**\n * Moves preview option to actions menu.\n * To be used only in compact mode of single file input when rendered in a table\n */\n previewFromActions?: boolean;\n /** When passed, will render a single icon button or within a MenuButton if other actions are defined. Passes file id as the parameter. */\n onDownload?: (id: FileItemProps['id']) => void;\n /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n onDelete?: (id: FileItemProps['id']) => void;\n /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n onOpen?: (id: FileItemProps['id']) => void;\n /** If the attachment is in an upload state, pass progress as a number between 0-100 representing the percentage of progress. */\n progress?: number;\n /** Set if there is an error uploading the file. Applies error styling to the meta string passed. */\n error?: string;\n /** Setting the disable state */\n disabled?: boolean;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledErrorIcon = styled(Icon)(({ theme }) => {\n return css`\n color: ${theme.base.palette.urgent};\n margin-inline-start: calc(0.5 * ${theme.base.spacing});\n `;\n});\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n\nconst titleEllipsisStyle = css`\n flex-shrink: 1;\n ${ellipsisOverflow}\n`;\n\nconst StyledPreviewTitle = styled(Button)`\n ${titleEllipsisStyle}\n`;\n\nconst StyledTextTitle = styled(Text)`\n ${titleEllipsisStyle}\n`;\n\nconst StyledMeta = styled(StyledText)<{ error: boolean }>(({ theme, error }) => {\n return css`\n /* min width to show percentage in full */\n min-width: 4ch;\n margin-inline-start: auto;\n ${titleEllipsisStyle}\n ${error &&\n css`\n color: ${theme.base.palette.urgent};\n `}\n `;\n});\n\nStyledMeta.defaultProps = defaultThemeProp;\n\nconst StyledActionsWrapper = styled.div<{ meta: boolean }>(({ meta }) => {\n return css`\n margin-inline-start: ${meta ? 'unset' : 'auto'};\n `;\n});\n\nStyledActionsWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledFileItem = styled.div<{\n compactMode: FileItemProps['compact'];\n isDisabled?: FileItemProps['disabled'];\n}>(\n ({\n theme: {\n base: {\n palette,\n 'border-radius': borderRadius,\n spacing,\n 'hit-area': { compact },\n 'disabled-opacity': disabledOpacity\n },\n components: {\n input,\n 'form-control': {\n ':disabled': {\n 'background-color': disabledBackgroundColor,\n 'border-color': disabledBorderColor\n },\n 'border-radius': formBorderRadius\n }\n }\n },\n compactMode,\n isDisabled\n }) => {\n return css`\n border-radius: calc(${borderRadius} * ${formBorderRadius});\n border: 0.0625rem solid ${palette['border-line']};\n background-color: ${palette['primary-background']};\n height: ${input.height};\n min-width: calc(${input.height} + 12ch + 1.5 * ${spacing} + ${compact});\n\n ${compactMode &&\n css`\n height: ${compact};\n min-width: calc(${compact} + 12ch + 2 * ${spacing});\n width: fit-content;\n max-width: 25ch;\n\n ${StyledPreviewTitle}, ${StyledTextTitle} {\n min-width: 12ch;\n max-width: calc(25ch - (${compact} + 2 * ${spacing}));\n }\n\n ${StyledActionsWrapper} > ${StyledButton} {\n min-height: 100%;\n min-width: 100%;\n margin-block: ${spacing};\n }\n `}\n\n > ${StyledProgressRing} {\n margin-inline-start: calc(0.5 * ${spacing});\n }\n\n > ${StyledFileVisual}, > ${StyledIconShape} {\n border-start-start-radius: inherit;\n border-end-start-radius: inherit;\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n width: ${input.height};\n flex-shrink: 0;\n\n ${compactMode &&\n css`\n height: ${compact};\n width: ${compact};\n `}\n }\n ${isDisabled &&\n css`\n background-color: ${disabledBackgroundColor};\n border-color: ${disabledBorderColor};\n opacity: ${disabledOpacity};\n `}\n `;\n }\n);\n\nStyledFileItem.defaultProps = defaultThemeProp;\n\nconst FileItem: ForwardRefForwardPropsComponent<FileItemProps> = forwardRef(function FileItem(\n props: PropsWithoutRef<FileItemProps>,\n ref: FileItemProps['ref']\n) {\n const {\n id,\n name,\n thumbnail,\n format,\n error,\n onCancel,\n onEdit,\n onPreview,\n onDownload,\n onDelete,\n onOpen,\n progress,\n compact = false,\n previewFromActions = false,\n disabled = false,\n ...restProps\n } = props;\n\n const [thumbnailError, setThumbnailError] = useState(false);\n const [textTarget, setTextTarget] = useElement();\n const [metaTarget, setMetaTarget] = useElement();\n const { locale } = useConfiguration();\n const t = useI18n();\n const uploading = typeof progress === 'number' && progress < 100;\n const itemRef = useConsolidatedRef(ref);\n\n const activeElement = getActiveElement();\n const activeElementInItem = itemRef.current?.contains(activeElement);\n\n let metaMessage;\n\n if (uploading) {\n metaMessage = formatNumber(progress, {\n locale,\n options: {\n style: 'unit',\n unit: 'percent',\n maximumFractionDigits: 0\n }\n });\n } else if (error) {\n metaMessage = error;\n }\n\n const definedActions: Action[] = [\n previewFromActions ? { onClick: onPreview, text: t('preview'), icon: 'preview' } : undefined,\n { onClick: onEdit, text: t('edit'), icon: 'pencil' },\n { onClick: onDownload, text: t('download'), icon: 'download' },\n { onClick: onDelete, text: t('delete'), icon: 'trash' },\n { onClick: onOpen, text: t('link_open_in_tab_text'), icon: 'open' }\n ].flatMap(action => {\n if (!action || !action.onClick) return [];\n\n const { text, icon, onClick } = action;\n return [\n {\n id: text,\n text,\n icon,\n onClick: () => {\n if (onClick) onClick(id);\n }\n }\n ];\n });\n\n let visual;\n let contextualLabel;\n\n if (uploading) {\n visual = <Progress variant='ring' placement='inline' value={progress} />;\n contextualLabel = t('uploading_file', [name]);\n } else if (error) {\n visual = <StyledErrorIcon name='warn-solid' />;\n contextualLabel = t('upload_failed', [name, error]);\n } else {\n visual = (\n <FileVisual\n type={\n format === 'url' ? 'link' : getKindFromMimeType(getMimeTypeFromFile(format ?? '') ?? '')\n }\n thumbnail={thumbnailError ? undefined : thumbnail}\n onThumbnailError={() => {\n setThumbnailError(true);\n }}\n />\n );\n contextualLabel = name;\n }\n\n useEffect(() => {\n if (!activeElement?.isConnected && activeElementInItem && itemRef.current) {\n getFocusables(itemRef.current)[0]?.focus();\n }\n }, [progress, error, onCancel, onDelete, onPreview, onEdit, onDownload]);\n\n return (\n <Flex\n as={StyledFileItem}\n container={{\n pad: [undefined, 0.5, undefined, undefined],\n alignItems: 'center',\n justify: 'start',\n gap: 1\n }}\n isDisabled={disabled}\n compactMode={compact}\n ref={itemRef}\n >\n {visual}\n\n {!previewFromActions && onPreview && !(error || uploading) ? (\n <Button\n {...restProps}\n as={StyledPreviewTitle}\n variant='link'\n ref={setTextTarget}\n onClick={() => {\n onPreview(id);\n }}\n aria-label={t('preview_file', [name])}\n disabled={disabled}\n >\n {name}\n {format === 'url' && <Icon name='open' />}\n </Button>\n ) : (\n <Text {...restProps} as={StyledTextTitle} ref={setTextTarget}>\n {name}\n </Text>\n )}\n {metaMessage && (\n <>\n <Text as={StyledMeta} variant='secondary' error={error && !uploading} ref={setMetaTarget}>\n {metaMessage}\n </Text>\n\n {metaTarget && (\n <Tooltip target={metaTarget} describeTarget={false} smart>\n {metaMessage}\n </Tooltip>\n )}\n </>\n )}\n\n {(error || uploading) && onCancel && (\n <StyledActionsWrapper meta={!!metaMessage}>\n <Button\n label={t('cancel')}\n aria-label={`${t('cancel')} - ${contextualLabel}`}\n variant='simple'\n compact\n icon\n onClick={() => onCancel(id)}\n >\n <Icon name='times' />\n </Button>\n </StyledActionsWrapper>\n )}\n\n {!(error || uploading) && !!definedActions.length && (\n <StyledActionsWrapper meta={!!metaMessage}>\n <Actions\n items={definedActions}\n compact\n iconOnly\n contextualLabel={name}\n disabled={disabled}\n />\n </StyledActionsWrapper>\n )}\n\n {textTarget && (\n <Tooltip target={textTarget} smart describeTarget={false}>\n {name}\n </Tooltip>\n )}\n </Flex>\n );\n});\n\nexport default FileItem;\n"]}
|
|
1
|
+
{"version":3,"file":"FileItem.js","sourceRoot":"","sources":["../../../src/components/File/FileItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useState } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as openIcon from '../Icon/icons/open.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as previewIcon from '../Icon/icons/preview.icon';\nimport * as editIcon from '../Icon/icons/pencil.icon';\nimport * as downloadIcon from '../Icon/icons/download.icon';\nimport * as deleteIcon from '../Icon/icons/trash.icon';\nimport Text, { StyledText } from '../Text';\nimport Tooltip from '../Tooltip';\nimport type { ForwardRefForwardPropsComponent, BaseProps, Action } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Button, { StyledButton } from '../Button';\nimport { useI18n, useElement, useConfiguration, useConsolidatedRef } from '../../hooks';\nimport Actions from '../Actions';\nimport Progress from '../Progress';\nimport { StyledProgressRing } from '../Progress/Progress.styles';\nimport { formatNumber } from '../Number';\nimport Flex from '../Flex';\nimport { StyledIconShape } from '../Icon/Icon';\nimport { getActiveElement, getFocusables } from '../../utils';\nimport { ellipsisOverflow } from '../../styles/mixins';\n\nimport { getKindFromMimeType, getMimeTypeFromFile } from './utils';\nimport FileVisual, { StyledFileVisual } from './FileVisual';\nimport type { FileVisualProps } from './FileVisual';\n\nregisterIcon(openIcon, timesIcon, previewIcon, editIcon, downloadIcon, deleteIcon);\n\nexport interface FileItemProps extends BaseProps {\n /** Unique id for item. */\n id: string;\n /** Name of the file. */\n name: string;\n /** A string to be used as an image src for a attachment thumbnail. Falls back to a provided icon or the default attachment icon. */\n thumbnail?: FileVisualProps['thumbnail'];\n /** File extension. Use 'url' for link */\n format?: string;\n /**\n * Used for a smaller sized FileItem.\n * @default false\n */\n compact?: boolean;\n /** When passed, will render a single icon button for yet to be or in progress uploads. Use this action to trigger xhr request termination. */\n onCancel?: (id: FileItemProps['id']) => void;\n /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n onEdit?: (id: FileItemProps['id']) => void;\n /** When passed, will be called on click of the name. Passes file id as the parameter. */\n onPreview?: (id: FileItemProps['id']) => void;\n /**\n * Moves preview option to actions menu.\n * To be used only in compact mode of single file input when rendered in a table\n */\n previewFromActions?: boolean;\n /** When passed, will render a single icon button or within a MenuButton if other actions are defined. Passes file id as the parameter. */\n onDownload?: (id: FileItemProps['id']) => void;\n /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n onDelete?: (id: FileItemProps['id']) => void;\n /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n onOpen?: (id: FileItemProps['id']) => void;\n /** If the attachment is in an upload state, pass progress as a number between 0-100 representing the percentage of progress. */\n progress?: number;\n /** Set if there is an error uploading the file. Applies error styling to the meta string passed. */\n error?: string;\n /** Setting the disable state */\n disabled?: boolean;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledErrorIcon = styled(Icon)(({ theme }) => {\n return css`\n color: ${theme.base.palette.urgent};\n margin-inline-start: calc(0.5 * ${theme.base.spacing});\n `;\n});\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n\nconst titleEllipsisStyle = css`\n flex-shrink: 1;\n ${ellipsisOverflow}\n`;\n\nconst StyledPreviewTitle = styled(Button)`\n ${titleEllipsisStyle}\n`;\n\nconst StyledTextTitle = styled(Text)`\n ${titleEllipsisStyle}\n`;\n\nconst StyledMeta = styled(StyledText)<{ error: boolean }>(({ theme, error }) => {\n return css`\n /* min width to show percentage in full */\n min-width: 4ch;\n margin-inline-start: auto;\n ${titleEllipsisStyle}\n ${error &&\n css`\n color: ${theme.base.palette.urgent};\n `}\n `;\n});\n\nStyledMeta.defaultProps = defaultThemeProp;\n\nconst StyledActionsWrapper = styled.div<{ meta: boolean }>(({ meta }) => {\n return css`\n margin-inline-start: ${meta ? 'unset' : 'auto'};\n `;\n});\n\nStyledActionsWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledFileItem = styled.div<{\n compactMode: FileItemProps['compact'];\n isDisabled?: FileItemProps['disabled'];\n}>(\n ({\n theme: {\n base: {\n palette,\n spacing,\n 'hit-area': { compact },\n 'disabled-opacity': disabledOpacity\n },\n components: {\n input,\n 'form-control': {\n ':disabled': {\n 'background-color': disabledBackgroundColor,\n 'border-color': disabledBorderColor\n }\n }\n }\n },\n compactMode,\n isDisabled\n }) => {\n return css`\n border-radius: calc(var(--container-border-radius) * 0.5);\n border: 0.0625rem solid ${palette['border-line']};\n background-color: ${palette['primary-background']};\n height: ${input.height};\n min-width: calc(${input.height} + 12ch + 1.5 * ${spacing} + ${compact});\n\n ${compactMode &&\n css`\n height: ${compact};\n min-width: calc(${compact} + 12ch + 2 * ${spacing});\n width: fit-content;\n max-width: 25ch;\n\n ${StyledPreviewTitle}, ${StyledTextTitle} {\n min-width: 12ch;\n max-width: calc(25ch - (${compact} + 2 * ${spacing}));\n }\n\n ${StyledActionsWrapper} > ${StyledButton} {\n min-height: 100%;\n min-width: 100%;\n margin-block: ${spacing};\n }\n `}\n\n > ${StyledProgressRing} {\n margin-inline-start: calc(0.5 * ${spacing});\n }\n\n > ${StyledFileVisual}, > ${StyledIconShape} {\n border-start-start-radius: inherit;\n border-end-start-radius: inherit;\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n width: ${input.height};\n flex-shrink: 0;\n\n ${compactMode &&\n css`\n height: ${compact};\n width: ${compact};\n `}\n }\n ${isDisabled &&\n css`\n background-color: ${disabledBackgroundColor};\n border-color: ${disabledBorderColor};\n opacity: ${disabledOpacity};\n `}\n `;\n }\n);\n\nStyledFileItem.defaultProps = defaultThemeProp;\n\nconst FileItem: ForwardRefForwardPropsComponent<FileItemProps> = forwardRef(function FileItem(\n props: PropsWithoutRef<FileItemProps>,\n ref: FileItemProps['ref']\n) {\n const {\n id,\n name,\n thumbnail,\n format,\n error,\n onCancel,\n onEdit,\n onPreview,\n onDownload,\n onDelete,\n onOpen,\n progress,\n compact = false,\n previewFromActions = false,\n disabled = false,\n ...restProps\n } = props;\n\n const [thumbnailError, setThumbnailError] = useState(false);\n const [textTarget, setTextTarget] = useElement();\n const [metaTarget, setMetaTarget] = useElement();\n const { locale } = useConfiguration();\n const t = useI18n();\n const uploading = typeof progress === 'number' && progress < 100;\n const itemRef = useConsolidatedRef(ref);\n\n const activeElement = getActiveElement();\n const activeElementInItem = itemRef.current?.contains(activeElement);\n\n let metaMessage;\n\n if (uploading) {\n metaMessage = formatNumber(progress, {\n locale,\n options: {\n style: 'unit',\n unit: 'percent',\n maximumFractionDigits: 0\n }\n });\n } else if (error) {\n metaMessage = error;\n }\n\n const definedActions: Action[] = [\n previewFromActions ? { onClick: onPreview, text: t('preview'), icon: 'preview' } : undefined,\n { onClick: onEdit, text: t('edit'), icon: 'pencil' },\n { onClick: onDownload, text: t('download'), icon: 'download' },\n { onClick: onDelete, text: t('delete'), icon: 'trash' },\n { onClick: onOpen, text: t('link_open_in_tab_text'), icon: 'open' }\n ].flatMap(action => {\n if (!action || !action.onClick) return [];\n\n const { text, icon, onClick } = action;\n return [\n {\n id: text,\n text,\n icon,\n onClick: () => {\n if (onClick) onClick(id);\n }\n }\n ];\n });\n\n let visual;\n let contextualLabel;\n\n if (uploading) {\n visual = <Progress variant='ring' placement='inline' value={progress} />;\n contextualLabel = t('uploading_file', [name]);\n } else if (error) {\n visual = <StyledErrorIcon name='warn-solid' />;\n contextualLabel = t('upload_failed', [name, error]);\n } else {\n visual = (\n <FileVisual\n type={\n format === 'url' ? 'link' : getKindFromMimeType(getMimeTypeFromFile(format ?? '') ?? '')\n }\n thumbnail={thumbnailError ? undefined : thumbnail}\n onThumbnailError={() => {\n setThumbnailError(true);\n }}\n />\n );\n contextualLabel = name;\n }\n\n useEffect(() => {\n if (!activeElement?.isConnected && activeElementInItem && itemRef.current) {\n getFocusables(itemRef.current)[0]?.focus();\n }\n }, [progress, error, onCancel, onDelete, onPreview, onEdit, onDownload]);\n\n return (\n <Flex\n as={StyledFileItem}\n container={{\n pad: [undefined, 0.5, undefined, undefined],\n alignItems: 'center',\n justify: 'start',\n gap: 1\n }}\n isDisabled={disabled}\n compactMode={compact}\n ref={itemRef}\n >\n {visual}\n\n {!previewFromActions && onPreview && !(error || uploading) ? (\n <Button\n {...restProps}\n as={StyledPreviewTitle}\n variant='link'\n ref={setTextTarget}\n onClick={() => {\n onPreview(id);\n }}\n aria-label={t('preview_file', [name])}\n disabled={disabled}\n >\n {name}\n {format === 'url' && <Icon name='open' />}\n </Button>\n ) : (\n <Text {...restProps} as={StyledTextTitle} ref={setTextTarget}>\n {name}\n </Text>\n )}\n {metaMessage && (\n <>\n <Text as={StyledMeta} variant='secondary' error={error && !uploading} ref={setMetaTarget}>\n {metaMessage}\n </Text>\n\n {metaTarget && (\n <Tooltip target={metaTarget} describeTarget={false} smart>\n {metaMessage}\n </Tooltip>\n )}\n </>\n )}\n\n {(error || uploading) && onCancel && (\n <StyledActionsWrapper meta={!!metaMessage}>\n <Button\n label={t('cancel')}\n aria-label={`${t('cancel')} - ${contextualLabel}`}\n variant='simple'\n compact\n icon\n onClick={() => onCancel(id)}\n >\n <Icon name='times' />\n </Button>\n </StyledActionsWrapper>\n )}\n\n {!(error || uploading) && !!definedActions.length && (\n <StyledActionsWrapper meta={!!metaMessage}>\n <Actions\n items={definedActions}\n compact\n iconOnly\n contextualLabel={name}\n disabled={disabled}\n />\n </StyledActionsWrapper>\n )}\n\n {textTarget && (\n <Tooltip target={textTarget} smart describeTarget={false}>\n {name}\n </Tooltip>\n )}\n </Flex>\n );\n});\n\nexport default FileItem;\n"]}
|
|
@@ -3,13 +3,13 @@ import type { ForwardProps } from '../../types';
|
|
|
3
3
|
import { type ComboBoxProps } from '../ComboBox';
|
|
4
4
|
import { type IconProps } from '../Icon';
|
|
5
5
|
import type { MenuProps } from '../Menu';
|
|
6
|
-
export interface IconPickerProps extends Pick<ComboBoxProps, 'id' | 'label' | 'labelHidden' | 'required' | 'disabled' | 'readOnly' | 'name' | 'status' | 'info' | 'placeholder' | 'autoFocus'>, Pick<MenuProps, 'scrollAt'> {
|
|
7
|
-
/** Default selection for the input. */
|
|
8
|
-
defaultSelection: string;
|
|
6
|
+
export interface IconPickerProps extends Pick<ComboBoxProps, 'id' | 'label' | 'labelHidden' | 'required' | 'disabled' | 'readOnly' | 'name' | 'status' | 'info' | 'placeholder' | 'autoFocus' | 'value'>, Pick<MenuProps, 'scrollAt'> {
|
|
9
7
|
/** Callback fired when input loses focus. */
|
|
10
8
|
onBlur?: (iconName: string) => void;
|
|
9
|
+
/** Current selection for the input. */
|
|
10
|
+
currentSelection: string;
|
|
11
11
|
/** Callback fired when user chooses icon from the list of icons. */
|
|
12
|
-
onSelect
|
|
12
|
+
onSelect: (iconName: string) => void;
|
|
13
13
|
/**
|
|
14
14
|
* The set of icons to pick from.
|
|
15
15
|
* @default 'budicon'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconPicker.d.ts","sourceRoot":"","sources":["../../../src/components/IconPicker/IconPicker.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAElF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAiB,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAa,EAGX,KAAK,SAAS,EACf,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,SAAS,EAAiB,MAAM,SAAS,CAAC;AAKxD,MAAM,WAAW,eACf,SAAQ,IAAI,CACR,aAAa,EACX,IAAI,GACJ,OAAO,GACP,aAAa,GACb,UAAU,GACV,UAAU,GACV,UAAU,GACV,MAAM,GACN,QAAQ,GACR,MAAM,GACN,aAAa,GACb,WAAW,
|
|
1
|
+
{"version":3,"file":"IconPicker.d.ts","sourceRoot":"","sources":["../../../src/components/IconPicker/IconPicker.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAElF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAiB,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAa,EAGX,KAAK,SAAS,EACf,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,SAAS,EAAiB,MAAM,SAAS,CAAC;AAKxD,MAAM,WAAW,eACf,SAAQ,IAAI,CACR,aAAa,EACX,IAAI,GACJ,OAAO,GACP,aAAa,GACb,UAAU,GACV,UAAU,GACV,UAAU,GACV,MAAM,GACN,QAAQ,GACR,MAAM,GACN,aAAa,GACb,WAAW,GACX,OAAO,CACV,EACD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IAC7B,6CAA6C;IAC7C,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,uCAAuC;IACvC,gBAAgB,EAAE,MAAM,CAAC;IACzB,oEAAoE;IACpE,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC;;;OAGG;IACH,GAAG,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC;CACxB;AAWD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CA+HjE,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -13,7 +13,7 @@ const getFilteredItems = (iconList, filterValue) => {
|
|
|
13
13
|
};
|
|
14
14
|
const pageSize = 20;
|
|
15
15
|
const IconPicker = forwardRef(function IconPicker(props, ref) {
|
|
16
|
-
const {
|
|
16
|
+
const { currentSelection, scrollAt, onSelect, onBlur, set = 'budicon', ...restProps } = props;
|
|
17
17
|
const iconList = useMemo(() => {
|
|
18
18
|
const icons = set === 'budicon' ? budIconNames : streamlineIconNames;
|
|
19
19
|
return icons.map(icon => {
|
|
@@ -28,22 +28,25 @@ const IconPicker = forwardRef(function IconPicker(props, ref) {
|
|
|
28
28
|
const [items, setItems] = useState(() => iconList.slice(0, pageSize));
|
|
29
29
|
const [isLoading, setIsLoading] = useState(false);
|
|
30
30
|
const [hasMore, setHasMore] = useState(true);
|
|
31
|
-
const [selectedIcon, setSelectedIcon] = useState(defaultSelection ?? '');
|
|
32
31
|
const [filterValue, setFilterValue] = useState('');
|
|
33
32
|
const t = useI18n();
|
|
34
33
|
const loadMoreTimeoutId = useRef();
|
|
35
34
|
const resetItems = useCallback(() => {
|
|
36
35
|
const filteredItems = getFilteredItems(iconList, filterValue);
|
|
37
|
-
setItems(menuHelpers.selectItem(filteredItems.slice(0, pageSize),
|
|
36
|
+
setItems(menuHelpers.selectItem(filteredItems.slice(0, pageSize), currentSelection, 'single-select'));
|
|
38
37
|
setHasMore(filteredItems.length > pageSize);
|
|
39
|
-
}, [filterValue,
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
38
|
+
}, [filterValue, currentSelection, iconList]);
|
|
39
|
+
const selectedItem = useMemo(() => currentSelection
|
|
40
|
+
? {
|
|
41
|
+
items: {
|
|
42
|
+
id: currentSelection,
|
|
43
|
+
text: currentSelection
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
: undefined, [currentSelection]);
|
|
44
47
|
useEffect(() => {
|
|
45
48
|
resetItems();
|
|
46
|
-
}, [filterValue,
|
|
49
|
+
}, [filterValue, currentSelection, iconList, set]);
|
|
47
50
|
useEffect(() => {
|
|
48
51
|
return () => {
|
|
49
52
|
if (loadMoreTimeoutId.current)
|
|
@@ -60,7 +63,7 @@ const IconPicker = forwardRef(function IconPicker(props, ref) {
|
|
|
60
63
|
setItems(prevItems => {
|
|
61
64
|
const newItems = menuHelpers.mapTree(getFilteredItems(iconList, filterValue).slice(prevItems.length, prevItems.length + pageSize), item => ({
|
|
62
65
|
...item,
|
|
63
|
-
selected: item.items ? undefined :
|
|
66
|
+
selected: item.items ? undefined : currentSelection === item.id
|
|
64
67
|
}));
|
|
65
68
|
if (newItems.length === 0)
|
|
66
69
|
setHasMore(false);
|
|
@@ -70,12 +73,11 @@ const IconPicker = forwardRef(function IconPicker(props, ref) {
|
|
|
70
73
|
}
|
|
71
74
|
}, [filterValue, isLoading]);
|
|
72
75
|
const selectItem = useCallback((iconName) => {
|
|
73
|
-
setSelectedIcon(iconName);
|
|
74
76
|
setFilterValue('');
|
|
75
|
-
onSelect
|
|
77
|
+
onSelect(iconName);
|
|
76
78
|
}, [onSelect]);
|
|
77
79
|
const clearSelection = useCallback(() => {
|
|
78
|
-
|
|
80
|
+
onSelect('');
|
|
79
81
|
setItems(cur => menuHelpers.mapTree(cur, item => {
|
|
80
82
|
return {
|
|
81
83
|
...item,
|
|
@@ -83,21 +85,13 @@ const IconPicker = forwardRef(function IconPicker(props, ref) {
|
|
|
83
85
|
};
|
|
84
86
|
}));
|
|
85
87
|
}, []);
|
|
86
|
-
return (_jsx(ComboBox, { ...restProps, ref: ref, selected:
|
|
87
|
-
? {
|
|
88
|
-
items: {
|
|
89
|
-
id: selectedIcon,
|
|
90
|
-
text: selectedIcon
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
: undefined, value: filterValue, onChange: (e) => {
|
|
88
|
+
return (_jsx(ComboBox, { ...restProps, ref: ref, selected: selectedItem, value: filterValue, onChange: (e) => {
|
|
94
89
|
if (!e.target.value)
|
|
95
90
|
clearSelection();
|
|
96
91
|
setFilterValue(e.target.value);
|
|
97
|
-
}, onBlur:
|
|
98
|
-
resetItems();
|
|
92
|
+
}, onBlur: selected => {
|
|
99
93
|
setFilterValue('');
|
|
100
|
-
onBlur?.(
|
|
94
|
+
onBlur?.(Array.isArray(selected) ? selected[0]?.id : selected?.id ?? currentSelection);
|
|
101
95
|
}, menu: {
|
|
102
96
|
items,
|
|
103
97
|
onItemClick: selectItem,
|
|
@@ -106,7 +100,7 @@ const IconPicker = forwardRef(function IconPicker(props, ref) {
|
|
|
106
100
|
emptyText: t('no_items'),
|
|
107
101
|
loading: isLoading,
|
|
108
102
|
loadMore: hasMore ? loadMore : undefined
|
|
109
|
-
}, visual:
|
|
103
|
+
}, visual: currentSelection ? _jsx(Icon, { set: set, name: currentSelection }) : undefined }));
|
|
110
104
|
});
|
|
111
105
|
export default IconPicker;
|
|
112
106
|
//# sourceMappingURL=IconPicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconPicker.js","sourceRoot":"","sources":["../../../src/components/IconPicker/IconPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useCallback, useRef, useEffect, useMemo } from 'react';\nimport type { FunctionComponent, ChangeEvent, PropsWithoutRef, Ref } from 'react';\n\nimport type { ForwardProps } from '../../types';\nimport ComboBox, { type ComboBoxProps } from '../ComboBox';\nimport Icon, {\n icons as budIconNames,\n streamlineIcons as streamlineIconNames,\n type IconProps\n} from '../Icon';\nimport type { MenuProps, MenuItemProps } from '../Menu';\nimport { menuHelpers } from '../Menu';\nimport { useI18n } from '../../hooks';\nimport { createStringMatcher } from '../../utils';\n\nexport interface IconPickerProps\n extends Pick<\n ComboBoxProps,\n | 'id'\n | 'label'\n | 'labelHidden'\n | 'required'\n | 'disabled'\n | 'readOnly'\n | 'name'\n | 'status'\n | 'info'\n | 'placeholder'\n | 'autoFocus'\n >,\n Pick<MenuProps, 'scrollAt'> {\n /** Default selection for the input. */\n defaultSelection: string;\n /** Callback fired when input loses focus. */\n onBlur?: (iconName: string) => void;\n /** Callback fired when user chooses icon from the list of icons. */\n onSelect?: (iconName: string) => void;\n /**\n * The set of icons to pick from.\n * @default 'budicon'\n */\n set?: IconProps['set'];\n}\n\nconst getFilteredItems = (iconList: MenuItemProps[], filterValue: string) => {\n if (!filterValue) return iconList;\n\n const regExp = createStringMatcher(filterValue);\n return iconList.filter(({ primary }) => regExp.test(primary));\n};\n\nconst pageSize = 20;\n\nconst IconPicker: FunctionComponent<IconPickerProps & ForwardProps> = forwardRef(\n function IconPicker(props: PropsWithoutRef<IconPickerProps>, ref: Ref<HTMLInputElement>) {\n const { defaultSelection, scrollAt, onSelect, onBlur, set = 'budicon', ...restProps } = props;\n\n const iconList: MenuItemProps[] = useMemo(() => {\n const icons = set === 'budicon' ? budIconNames : streamlineIconNames;\n return icons.map(icon => {\n return {\n id: icon,\n primary: icon,\n visual: <Icon set={set} name={icon} />,\n selected: false\n };\n });\n }, [set]);\n\n const [items, setItems] = useState<MenuProps['items']>(() => iconList.slice(0, pageSize));\n\n const [isLoading, setIsLoading] = useState(false);\n const [hasMore, setHasMore] = useState(true);\n const [selectedIcon, setSelectedIcon] = useState(defaultSelection ?? '');\n const [filterValue, setFilterValue] = useState('');\n const t = useI18n();\n const loadMoreTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n\n const resetItems = useCallback(() => {\n const filteredItems = getFilteredItems(iconList, filterValue);\n setItems(\n menuHelpers.selectItem(filteredItems.slice(0, pageSize), selectedIcon, 'single-select')\n );\n setHasMore(filteredItems.length > pageSize);\n }, [filterValue, selectedIcon]);\n\n useEffect(() => {\n setItems(iconList.slice(0, pageSize));\n setSelectedIcon(defaultSelection);\n }, [iconList]);\n\n useEffect(() => {\n resetItems();\n }, [filterValue, selectedIcon]);\n\n useEffect(() => {\n return () => {\n if (loadMoreTimeoutId.current) clearTimeout(loadMoreTimeoutId.current);\n };\n }, []);\n\n const loadMore = useCallback(() => {\n if (!isLoading) {\n setIsLoading(true);\n if (loadMoreTimeoutId.current) clearTimeout(loadMoreTimeoutId.current);\n loadMoreTimeoutId.current = setTimeout(() => {\n setIsLoading(false);\n setItems(prevItems => {\n const newItems = menuHelpers.mapTree(\n getFilteredItems(iconList, filterValue).slice(\n prevItems.length,\n prevItems.length + pageSize\n ),\n item => ({\n ...item,\n selected: item.items ? undefined : selectedIcon === item.id\n })\n );\n\n if (newItems.length === 0) setHasMore(false);\n\n return menuHelpers.appendTo(prevItems, newItems);\n });\n }, 500);\n }\n }, [filterValue, isLoading]);\n\n const selectItem = useCallback(\n (iconName: string) => {\n setSelectedIcon(iconName);\n setFilterValue('');\n onSelect?.(iconName);\n },\n [onSelect]\n );\n\n const clearSelection = useCallback(() => {\n setSelectedIcon('');\n setItems(cur =>\n menuHelpers.mapTree(cur, item => {\n return {\n ...item,\n selected: false\n };\n })\n );\n }, []);\n\n return (\n <ComboBox\n {...restProps}\n ref={ref}\n selected={\n selectedIcon\n ? {\n items: {\n id: selectedIcon,\n text: selectedIcon\n }\n }\n : undefined\n }\n value={filterValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n if (!e.target.value) clearSelection();\n setFilterValue(e.target.value);\n }}\n onBlur={() => {\n resetItems();\n setFilterValue('');\n onBlur?.(selectedIcon);\n }}\n menu={{\n items,\n onItemClick: selectItem,\n scrollAt,\n accent: filterValue ? createStringMatcher(filterValue) : undefined,\n emptyText: t('no_items'),\n loading: isLoading,\n loadMore: hasMore ? loadMore : undefined\n }}\n visual={selectedIcon ? <Icon set={set} name={selectedIcon} /> : undefined}\n />\n );\n }\n);\n\nexport default IconPicker;\n"]}
|
|
1
|
+
{"version":3,"file":"IconPicker.js","sourceRoot":"","sources":["../../../src/components/IconPicker/IconPicker.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAItF,OAAO,QAAQ,EAAE,EAAsB,MAAM,aAAa,CAAC;AAC3D,OAAO,IAAI,EAAE,EACX,KAAK,IAAI,YAAY,EACrB,eAAe,IAAI,mBAAmB,EAEvC,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAgClD,MAAM,gBAAgB,GAAG,CAAC,QAAyB,EAAE,WAAmB,EAAE,EAAE;IAC1E,IAAI,CAAC,WAAW;QAAE,OAAO,QAAQ,CAAC;IAElC,MAAM,MAAM,GAAG,mBAAmB,CAAC,WAAW,CAAC,CAAC;IAChD,OAAO,QAAQ,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;AAChE,CAAC,CAAC;AAEF,MAAM,QAAQ,GAAG,EAAE,CAAC;AAEpB,MAAM,UAAU,GAAsD,UAAU,CAC9E,SAAS,UAAU,CAAC,KAAuC,EAAE,GAA0B;IACrF,MAAM,EAAE,gBAAgB,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,GAAG,SAAS,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAE9F,MAAM,QAAQ,GAAoB,OAAO,CAAC,GAAG,EAAE;QAC7C,MAAM,KAAK,GAAG,GAAG,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,mBAAmB,CAAC;QACrE,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YACtB,OAAO;gBACL,EAAE,EAAE,IAAI;gBACR,OAAO,EAAE,IAAI;gBACb,MAAM,EAAE,KAAC,IAAI,IAAC,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,GAAI;gBACtC,QAAQ,EAAE,KAAK;aAChB,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAqB,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC1F,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,iBAAiB,GAAG,MAAM,EAAiC,CAAC;IAElE,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE;QAClC,MAAM,aAAa,GAAG,gBAAgB,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC9D,QAAQ,CACN,WAAW,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,EAAE,gBAAgB,EAAE,eAAe,CAAC,CAC5F,CAAC;QACF,UAAU,CAAC,aAAa,CAAC,MAAM,GAAG,QAAQ,CAAC,CAAC;IAC9C,CAAC,EAAE,CAAC,WAAW,EAAE,gBAAgB,EAAE,QAAQ,CAAC,CAAC,CAAC;IAE9C,MAAM,YAAY,GAAG,OAAO,CAC1B,GAAG,EAAE,CACH,gBAAgB;QACd,CAAC,CAAC;YACE,KAAK,EAAE;gBACL,EAAE,EAAE,gBAAgB;gBACpB,IAAI,EAAE,gBAAgB;aACvB;SACF;QACH,CAAC,CAAC,SAAS,EACf,CAAC,gBAAgB,CAAC,CACnB,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,EAAE,CAAC;IACf,CAAC,EAAE,CAAC,WAAW,EAAE,gBAAgB,EAAE,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC;IAEnD,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,IAAI,iBAAiB,CAAC,OAAO;gBAAE,YAAY,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC;QACzE,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;QAChC,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,YAAY,CAAC,IAAI,CAAC,CAAC;YACnB,IAAI,iBAAiB,CAAC,OAAO;gBAAE,YAAY,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC;YACvE,iBAAiB,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBAC1C,YAAY,CAAC,KAAK,CAAC,CAAC;gBACpB,QAAQ,CAAC,SAAS,CAAC,EAAE;oBACnB,MAAM,QAAQ,GAAG,WAAW,CAAC,OAAO,CAClC,gBAAgB,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,KAAK,CAC3C,SAAS,CAAC,MAAM,EAChB,SAAS,CAAC,MAAM,GAAG,QAAQ,CAC5B,EACD,IAAI,CAAC,EAAE,CAAC,CAAC;wBACP,GAAG,IAAI;wBACP,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,gBAAgB,KAAK,IAAI,CAAC,EAAE;qBAChE,CAAC,CACH,CAAC;oBAEF,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC;wBAAE,UAAU,CAAC,KAAK,CAAC,CAAC;oBAE7C,OAAO,WAAW,CAAC,QAAQ,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;gBACnD,CAAC,CAAC,CAAC;YACL,CAAC,EAAE,GAAG,CAAC,CAAC;QACV,CAAC;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC;IAE7B,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,QAAgB,EAAE,EAAE;QACnB,cAAc,CAAC,EAAE,CAAC,CAAC;QACnB,QAAQ,CAAC,QAAQ,CAAC,CAAC;IACrB,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE;QACtC,QAAQ,CAAC,EAAE,CAAC,CAAC;QACb,QAAQ,CAAC,GAAG,CAAC,EAAE,CACb,WAAW,CAAC,OAAO,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE;YAC9B,OAAO;gBACL,GAAG,IAAI;gBACP,QAAQ,EAAE,KAAK;aAChB,CAAC;QACJ,CAAC,CAAC,CACH,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,KAAC,QAAQ,OACH,SAAS,EACb,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,CAAC,CAAgC,EAAE,EAAE;YAC7C,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK;gBAAE,cAAc,EAAE,CAAC;YACtC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,EACD,MAAM,EAAE,QAAQ,CAAC,EAAE;YACjB,cAAc,CAAC,EAAE,CAAC,CAAC;YACnB,MAAM,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,IAAI,gBAAgB,CAAC,CAAC;QACzF,CAAC,EACD,IAAI,EAAE;YACJ,KAAK;YACL,WAAW,EAAE,UAAU;YACvB,QAAQ;YACR,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,mBAAmB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS;YAClE,SAAS,EAAE,CAAC,CAAC,UAAU,CAAC;YACxB,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;SACzC,EACD,MAAM,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,gBAAgB,GAAI,CAAC,CAAC,CAAC,SAAS,GACjF,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef, useState, useCallback, useRef, useEffect, useMemo } from 'react';\nimport type { FunctionComponent, ChangeEvent, PropsWithoutRef, Ref } from 'react';\n\nimport type { ForwardProps } from '../../types';\nimport ComboBox, { type ComboBoxProps } from '../ComboBox';\nimport Icon, {\n icons as budIconNames,\n streamlineIcons as streamlineIconNames,\n type IconProps\n} from '../Icon';\nimport type { MenuProps, MenuItemProps } from '../Menu';\nimport { menuHelpers } from '../Menu';\nimport { useI18n } from '../../hooks';\nimport { createStringMatcher } from '../../utils';\n\nexport interface IconPickerProps\n extends Pick<\n ComboBoxProps,\n | 'id'\n | 'label'\n | 'labelHidden'\n | 'required'\n | 'disabled'\n | 'readOnly'\n | 'name'\n | 'status'\n | 'info'\n | 'placeholder'\n | 'autoFocus'\n | 'value'\n >,\n Pick<MenuProps, 'scrollAt'> {\n /** Callback fired when input loses focus. */\n onBlur?: (iconName: string) => void;\n /** Current selection for the input. */\n currentSelection: string;\n /** Callback fired when user chooses icon from the list of icons. */\n onSelect: (iconName: string) => void;\n /**\n * The set of icons to pick from.\n * @default 'budicon'\n */\n set?: IconProps['set'];\n}\n\nconst getFilteredItems = (iconList: MenuItemProps[], filterValue: string) => {\n if (!filterValue) return iconList;\n\n const regExp = createStringMatcher(filterValue);\n return iconList.filter(({ primary }) => regExp.test(primary));\n};\n\nconst pageSize = 20;\n\nconst IconPicker: FunctionComponent<IconPickerProps & ForwardProps> = forwardRef(\n function IconPicker(props: PropsWithoutRef<IconPickerProps>, ref: Ref<HTMLInputElement>) {\n const { currentSelection, scrollAt, onSelect, onBlur, set = 'budicon', ...restProps } = props;\n\n const iconList: MenuItemProps[] = useMemo(() => {\n const icons = set === 'budicon' ? budIconNames : streamlineIconNames;\n return icons.map(icon => {\n return {\n id: icon,\n primary: icon,\n visual: <Icon set={set} name={icon} />,\n selected: false\n };\n });\n }, [set]);\n\n const [items, setItems] = useState<MenuProps['items']>(() => iconList.slice(0, pageSize));\n const [isLoading, setIsLoading] = useState(false);\n const [hasMore, setHasMore] = useState(true);\n const [filterValue, setFilterValue] = useState('');\n const t = useI18n();\n const loadMoreTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n\n const resetItems = useCallback(() => {\n const filteredItems = getFilteredItems(iconList, filterValue);\n setItems(\n menuHelpers.selectItem(filteredItems.slice(0, pageSize), currentSelection, 'single-select')\n );\n setHasMore(filteredItems.length > pageSize);\n }, [filterValue, currentSelection, iconList]);\n\n const selectedItem = useMemo(\n () =>\n currentSelection\n ? {\n items: {\n id: currentSelection,\n text: currentSelection\n }\n }\n : undefined,\n [currentSelection]\n );\n\n useEffect(() => {\n resetItems();\n }, [filterValue, currentSelection, iconList, set]);\n\n useEffect(() => {\n return () => {\n if (loadMoreTimeoutId.current) clearTimeout(loadMoreTimeoutId.current);\n };\n }, []);\n\n const loadMore = useCallback(() => {\n if (!isLoading) {\n setIsLoading(true);\n if (loadMoreTimeoutId.current) clearTimeout(loadMoreTimeoutId.current);\n loadMoreTimeoutId.current = setTimeout(() => {\n setIsLoading(false);\n setItems(prevItems => {\n const newItems = menuHelpers.mapTree(\n getFilteredItems(iconList, filterValue).slice(\n prevItems.length,\n prevItems.length + pageSize\n ),\n item => ({\n ...item,\n selected: item.items ? undefined : currentSelection === item.id\n })\n );\n\n if (newItems.length === 0) setHasMore(false);\n\n return menuHelpers.appendTo(prevItems, newItems);\n });\n }, 500);\n }\n }, [filterValue, isLoading]);\n\n const selectItem = useCallback(\n (iconName: string) => {\n setFilterValue('');\n onSelect(iconName);\n },\n [onSelect]\n );\n\n const clearSelection = useCallback(() => {\n onSelect('');\n setItems(cur =>\n menuHelpers.mapTree(cur, item => {\n return {\n ...item,\n selected: false\n };\n })\n );\n }, []);\n\n return (\n <ComboBox\n {...restProps}\n ref={ref}\n selected={selectedItem}\n value={filterValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n if (!e.target.value) clearSelection();\n setFilterValue(e.target.value);\n }}\n onBlur={selected => {\n setFilterValue('');\n onBlur?.(Array.isArray(selected) ? selected[0]?.id : selected?.id ?? currentSelection);\n }}\n menu={{\n items,\n onItemClick: selectItem,\n scrollAt,\n accent: filterValue ? createStringMatcher(filterValue) : undefined,\n emptyText: t('no_items'),\n loading: isLoading,\n loadMore: hasMore ? loadMore : undefined\n }}\n visual={currentSelection ? <Icon set={set} name={currentSelection} /> : undefined}\n />\n );\n }\n);\n\nexport default IconPicker;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageTemplates.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAmB,YAAY,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAgB3E,OAAO,KAAK,EACV,MAAM,EACN,SAAS,EACT,+BAA+B,EAC/B,cAAc,EACd,UAAU,EACX,MAAM,aAAa,CAAC;AAIrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAMvD,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,IAAI,EAAE,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"PageTemplates.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"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"}
|
|
@@ -14,8 +14,9 @@ import Icon from '../Icon';
|
|
|
14
14
|
import SummaryItem from '../SummaryItem';
|
|
15
15
|
import Tabs, { TabPanel } from '../Tabs';
|
|
16
16
|
import { StyledTabPanel } from '../Tabs/TabPanel';
|
|
17
|
-
import { StyledTabs, StylesAllTabsButtonWrapper } from '../Tabs/Tabs.styles';
|
|
17
|
+
import { StyledAllTabsWrapper, StyledTabs, StylesAllTabsButtonWrapper } from '../Tabs/Tabs.styles';
|
|
18
18
|
import Text from '../Text';
|
|
19
|
+
import { StyledMenuButton } from '../MenuButton/MenuButton';
|
|
19
20
|
export const StyledPageIcon = styled(Flex)(({ theme }) => {
|
|
20
21
|
const bgColor = theme.base.palette['brand-primary'];
|
|
21
22
|
const color = tryCatch(() => readableColor(bgColor));
|
|
@@ -31,6 +32,7 @@ StyledPageIcon.defaultProps = defaultThemeProp;
|
|
|
31
32
|
export const StyledPageHeader = styled.header(({ theme }) => {
|
|
32
33
|
const appBg = theme.base.palette['app-background'];
|
|
33
34
|
const appFg = theme.base.palette['app-foreground'];
|
|
35
|
+
const tabsDetached = theme.components.tabs.detached;
|
|
34
36
|
const color = calculateForegroundColor(appBg, appFg);
|
|
35
37
|
return css `
|
|
36
38
|
h1 {
|
|
@@ -49,6 +51,29 @@ export const StyledPageHeader = styled.header(({ theme }) => {
|
|
|
49
51
|
${StyledBanner}, ${StyledTabs}, ${StylesAllTabsButtonWrapper} {
|
|
50
52
|
margin-block-start: calc(2 * ${theme.base.spacing});
|
|
51
53
|
}
|
|
54
|
+
|
|
55
|
+
${tabsDetached &&
|
|
56
|
+
css `
|
|
57
|
+
${StyledAllTabsWrapper} {
|
|
58
|
+
margin-block-start: calc(2 * ${theme.base.spacing});
|
|
59
|
+
border-radius: var(--border-radius, ${theme.base['border-radius']});
|
|
60
|
+
border-end-start-radius: 0;
|
|
61
|
+
|
|
62
|
+
${StyledTabs} {
|
|
63
|
+
border-radius: unset;
|
|
64
|
+
border-start-end-radius: inherit;
|
|
65
|
+
margin-block-start: 0;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
${StylesAllTabsButtonWrapper} {
|
|
69
|
+
margin-block-start: 0;
|
|
70
|
+
|
|
71
|
+
${StyledMenuButton} {
|
|
72
|
+
border-start-start-radius: var(--border-radius, ${theme.base['border-radius']});
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
`}
|
|
52
77
|
`;
|
|
53
78
|
});
|
|
54
79
|
StyledPageHeader.defaultProps = defaultThemeProp;
|
|
@@ -206,7 +231,7 @@ const PageLayout = forwardRef(function PageLayout({ regions, cols = `repeat(${re
|
|
|
206
231
|
gap: 2
|
|
207
232
|
}, item: { grow: 1 }, scrollContent: scrollContent, as: StyledPageLayout, forwardedAs: as, ref: pageRef, minContentHeight: minContentHeight, children: [pageHeader, pageContent] }), (isMediumOrAbove || !tabs) && _jsx("div", { children: utilities })] }));
|
|
208
233
|
}
|
|
209
|
-
return (_jsxs(Flex, { ...restProps, as: StyledPageLayout, forwardedAs: as, container: { direction: 'column' }, children: [pageHeader, _jsxs(Flex, { container: { direction: 'column', pad: [2, 2, 0], gap: tabsDetached ? undefined : 2 }, children: [_jsx(Tabs, { tabs: pageTabs, onTabClick: handleTabChange, currentTabId: panel, ref: pageTabsRef }), pageTabs.map(tab => (_jsx(TabPanel, { tabId: tab.id, currentTabId: panel, tablistRef: pageTabsRef, children: _jsx(StylePageTabContent, { children: tab.content }) }, tab.id)))] })] }));
|
|
234
|
+
return (_jsxs(Flex, { ...restProps, as: StyledPageLayout, forwardedAs: as, ref: pageRef, container: { direction: 'column' }, children: [pageHeader, _jsxs(Flex, { container: { direction: 'column', pad: [2, 2, 0], gap: tabsDetached ? undefined : 2 }, children: [_jsx(Tabs, { tabs: pageTabs, onTabClick: handleTabChange, currentTabId: panel, ref: pageTabsRef }), pageTabs.map(tab => (_jsx(TabPanel, { tabId: tab.id, currentTabId: panel, tablistRef: pageTabsRef, children: _jsx(StylePageTabContent, { children: tab.content }) }, tab.id)))] })] }));
|
|
210
235
|
}
|
|
211
236
|
return (_jsxs(Flex, { ...restProps, container: {
|
|
212
237
|
direction: 'column',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageTemplates.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { PropsWithoutRef, ReactElement, ReactNode, Ref } from 'react';\nimport { forwardRef, useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n useBreakpoint,\n useConfiguration,\n useConsolidatedRef,\n useElement,\n useI18n,\n useScrollStick,\n useTheme\n} from '../../hooks';\nimport type { ScrollStickOptions } from '../../hooks/useScrollStick';\nimport { calculateForegroundColor, readableColor } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport type {\n AsProp,\n BaseProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp,\n OmitStrict\n} from '../../types';\nimport { focusHeadingOrContainer, tryCatch } from '../../utils';\nimport AppShellContext from '../AppShell/AppShellContext';\nimport { StyledBanner } from '../Banner/Banner';\nimport type { BreadcrumbsProps } from '../Breadcrumbs';\nimport Breadcrumbs, { StyledBreadcrumbs } from '../Breadcrumbs';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport Icon from '../Icon';\nimport SummaryItem from '../SummaryItem';\nimport type { Tab, TabsProps } from '../Tabs';\nimport Tabs, { TabPanel } from '../Tabs';\nimport { StyledTabPanel } from '../Tabs/TabPanel';\nimport { StyledTabs, StylesAllTabsButtonWrapper } from '../Tabs/Tabs.styles';\nimport Text from '../Text';\n\nexport interface PageTemplateProps extends BaseProps, AsProp, NoChildrenProp {\n title: string;\n icon?: string;\n actions?: ReactNode;\n banners?: ReactNode;\n path?: BreadcrumbsProps['path'];\n header?: ReactNode;\n utilities?: ReactNode;\n scrollContent?: boolean;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface TabbedPageTab extends Tab {\n content: ReactNode;\n /**\n * Determines layout spacing.\n * @default 'standard'\n */\n layout?: 'standard' | 'full-size';\n}\n\nexport interface TabbedPageProps extends OmitStrict<PageTemplateProps, 'forwardedAs'> {\n tabs: OmitStrict<TabsProps, 'tabs' | 'currentTabId'> & {\n tabs: TabbedPageTab[];\n } & (\n | { defaultTabId?: string; currentTabId?: never }\n | { defaultTabId?: never; currentTabId: string }\n );\n}\n\nexport interface DynamicLayoutPageProps extends OmitStrict<PageTemplateProps, 'scrollContent'> {\n a: ReactNode;\n}\n\nexport interface OneColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n}\n\nexport interface TwoColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface ThreeColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface FourColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n d: ReactNode;\n}\n\nexport interface WideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface NarrowWidePageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface WideWideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface NarrowWideWidePageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface NarrowWideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface PageLayoutProps extends PageTemplateProps {\n tabs?: ReactElement<typeof Tabs>;\n regions: ReactNode[];\n regionsRef?: Ref<HTMLDivElement>;\n cols?: string;\n padContent?: boolean;\n}\n\nexport const StyledPageIcon = styled(Flex)(({ theme }) => {\n const bgColor = theme.base.palette['brand-primary'];\n const color = tryCatch(() => readableColor(bgColor));\n return css`\n height: calc(4 * ${theme.base.spacing});\n width: calc(4 * ${theme.base.spacing});\n background: ${bgColor};\n color: ${color};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n `;\n});\n\nStyledPageIcon.defaultProps = defaultThemeProp;\n\nexport const StyledPageHeader = styled.header(({ theme }) => {\n const appBg = theme.base.palette['app-background'];\n const appFg = theme.base.palette['app-foreground'];\n const color = calculateForegroundColor(appBg, appFg);\n\n return css`\n h1 {\n color: ${color};\n }\n\n h1:focus-visible {\n outline: transparent;\n box-shadow: ${theme.base.shadow.focus};\n }\n\n ${StyledBreadcrumbs} {\n margin-block-end: ${theme.base.spacing};\n }\n\n ${StyledBanner}, ${StyledTabs}, ${StylesAllTabsButtonWrapper} {\n margin-block-start: calc(2 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledPageHeader.defaultProps = defaultThemeProp;\n\nexport const StyledRegion = styled.div<{ renderSingleRegion?: boolean }>(\n ({ renderSingleRegion }) => {\n if (renderSingleRegion) {\n return css`\n height: 100%;\n `;\n }\n }\n);\n\nStyledRegion.defaultProps = defaultThemeProp;\n\nexport const StyledRegions = styled.div<{ pad: boolean }>(({ pad, theme }) => {\n const spacing = theme.base.spacing;\n\n return css`\n flex-grow: 1;\n max-width: 100%;\n\n ${pad &&\n css`\n padding: 0 calc(2 * ${spacing}) calc(2 * ${spacing});\n `}\n [role='tabpanel'] & {\n padding: 0;\n }\n `;\n});\nStyledRegions.defaultProps = defaultThemeProp;\n\nexport const StyledContent = styled.div``;\nStyledContent.defaultProps = defaultThemeProp;\n\nexport const StyledScrollableTabPanel: typeof TabPanel = styled(TabPanel)(() => {\n return css`\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledScrollableTabPanel.defaultProps = defaultThemeProp;\n\nexport const StyledPageLayout = styled.div<{\n scrollContent: PageLayoutProps['scrollContent'];\n minContentHeight?: number;\n}>(\n ({\n theme: {\n base: {\n palette: { 'app-background': appBackground }\n }\n },\n scrollContent,\n minContentHeight\n }) => {\n const emptyContentHeight = minContentHeight ? `${minContentHeight}px` : undefined;\n\n return css`\n --content-height-in-view: ${emptyContentHeight};\n position: relative;\n min-height: inherit;\n background: ${appBackground};\n\n ${scrollContent &&\n css`\n ${StyledContent} {\n position: relative;\n }\n\n ${StyledRegions} {\n position: absolute;\n height: 100%;\n width: 100%;\n overflow: auto;\n }\n `}\n `;\n }\n);\n\nStyledPageLayout.defaultProps = defaultThemeProp;\n\nconst StyledPageLayoutWrapper = styled.div`\n height: 100%;\n`;\n\nconst StylePageTabContent = styled.div`\n ${StyledRegions} {\n padding: 0;\n }\n`;\n\nconst PageLayout: ForwardRefForwardPropsComponent<PageLayoutProps> = forwardRef(function PageLayout(\n {\n regions,\n cols = `repeat(${regions.length}, minmax(0, 1fr))`,\n title,\n icon,\n path,\n actions,\n banners,\n tabs,\n utilities,\n as,\n header,\n regionsRef,\n scrollContent = false,\n padContent = true,\n ...restProps\n }: PropsWithoutRef<PageLayoutProps>,\n ref: PageLayoutProps['ref']\n) {\n const t = useI18n();\n const [contentEl, setContentEl] = useElement<HTMLElement>();\n const isMediumOrAbove = useBreakpoint('md');\n const hasSideBySideColumns = regions.length > 1 && isMediumOrAbove;\n const { headerEl } = useContext(AppShellContext);\n const { loadedRef } = useConfiguration();\n const [panel, setPanel] = useState('content');\n const {\n components: {\n tabs: { detached: tabsDetached }\n }\n } = useTheme();\n\n const pageRef = useConsolidatedRef(ref);\n const pageTabsRef = useRef<HTMLElement>(null);\n const consolidatedRegionRef = useConsolidatedRef(regionsRef);\n const scrollStickOptions = useRef<ScrollStickOptions>({\n elements: []\n });\n\n scrollStickOptions.current.scrollContainer = scrollContent && contentEl ? contentEl : undefined;\n scrollStickOptions.current.offset = (headerEl?.offsetHeight ?? 0) + 16;\n\n useScrollStick(hasSideBySideColumns ? scrollStickOptions.current : undefined);\n\n const renderSingleRegion = regions?.length === 1;\n\n const [minContentHeight, setMinContentHeight] = useState<number | undefined>();\n\n useEffect(() => {\n if (!pageRef.current) return;\n\n if (loadedRef.current) {\n focusHeadingOrContainer(pageRef.current, title);\n } else {\n loadedRef.current = true;\n }\n }, [title]);\n\n useEffect(() => {\n if (consolidatedRegionRef.current) {\n const refElement = consolidatedRegionRef.current;\n const regionsPaddingBottomPixels = Number.parseInt(\n window.getComputedStyle(refElement).getPropertyValue('padding-bottom'),\n 10\n );\n\n const resizeObserver = new ResizeObserver(() => {\n const headerOffset = headerEl?.offsetHeight ?? 0;\n const emptyHeight =\n document.documentElement.offsetHeight -\n (headerOffset + refElement.offsetTop) -\n regionsPaddingBottomPixels;\n\n setMinContentHeight(emptyHeight);\n });\n\n resizeObserver.observe(refElement);\n\n return () => {\n resizeObserver.disconnect();\n };\n }\n }, [consolidatedRegionRef, headerEl]);\n\n const pageContent = (\n <Flex\n container\n item={{ grow: 1 }}\n as={StyledContent}\n ref={scrollContent ? setContentEl : undefined}\n >\n {renderSingleRegion && (\n <StyledRegions ref={consolidatedRegionRef} pad={padContent}>\n <Flex\n container={{\n direction: 'column',\n gap: 2\n }}\n as={StyledRegion}\n ref={(el: HTMLDivElement | null) => {\n if (el) {\n scrollStickOptions.current.elements[0] = el;\n }\n }}\n renderSingleRegion\n >\n {regions[0]}\n </Flex>\n </StyledRegions>\n )}\n\n {!renderSingleRegion && (\n <Grid\n container={{\n cols: 'minmax(0, 1fr)',\n alignItems: 'start',\n gap: 2,\n pad: [0, 2, 2]\n }}\n md={{ container: { cols } }}\n as={StyledRegions}\n ref={consolidatedRegionRef}\n >\n {regions.map((colItems, i) => {\n return (\n <Flex\n container={{\n direction: 'column',\n gap: 2\n }}\n as={StyledRegion}\n // eslint-disable-next-line react/no-array-index-key\n key={i}\n ref={(el: HTMLDivElement | null) => {\n if (el) {\n scrollStickOptions.current.elements[i] = el;\n }\n }}\n >\n {colItems}\n </Flex>\n );\n })}\n </Grid>\n )}\n </Flex>\n );\n\n const pageTabs = [\n { name: t('content'), id: 'content', content: pageContent },\n {\n name: t('agent'),\n id: 'agent',\n content: utilities\n }\n ];\n\n const pageHeader =\n !!path || !!icon || !!actions || !!title || !!banners || !!tabs || !!header ? (\n <Flex\n container={{ direction: 'column', pad: [2, 2, 0] }}\n item={{ grow: 0, shrink: 0 }}\n as={StyledPageHeader}\n >\n {path && path.length > 0 && <Breadcrumbs path={path} />}\n\n {header || (\n <SummaryItem\n visual={\n icon && (\n <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n <Icon name={icon} />\n </StyledPageIcon>\n )\n }\n primary={<Text variant='h1'>{title}</Text>}\n actions={actions}\n />\n )}\n\n {banners}\n {tabs}\n </Flex>\n ) : null;\n\n const handleTabChange = (id: string) => {\n setPanel(id);\n };\n\n if (utilities) {\n if (isMediumOrAbove || tabs) {\n return (\n <Flex container={{ gap: 2 }} as={StyledPageLayoutWrapper}>\n <Flex\n {...restProps}\n container={{\n direction: 'column',\n alignItems: 'stretch',\n gap: 2\n }}\n item={{ grow: 1 }}\n scrollContent={scrollContent}\n as={StyledPageLayout}\n forwardedAs={as}\n ref={pageRef}\n minContentHeight={minContentHeight}\n >\n {pageHeader}\n {pageContent}\n </Flex>\n {(isMediumOrAbove || !tabs) && <div>{utilities}</div>}\n </Flex>\n );\n }\n\n return (\n <Flex\n {...restProps}\n as={StyledPageLayout}\n forwardedAs={as}\n container={{ direction: 'column' }}\n >\n {pageHeader}\n <Flex\n container={{ direction: 'column', pad: [2, 2, 0], gap: tabsDetached ? undefined : 2 }}\n >\n <Tabs\n tabs={pageTabs}\n onTabClick={handleTabChange}\n currentTabId={panel}\n ref={pageTabsRef}\n />\n {pageTabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panel} tablistRef={pageTabsRef} key={tab.id}>\n <StylePageTabContent>{tab.content}</StylePageTabContent>\n </TabPanel>\n ))}\n </Flex>\n </Flex>\n );\n }\n return (\n <Flex\n {...restProps}\n container={{\n direction: 'column',\n alignItems: 'stretch',\n gap: 2\n }}\n item={{ grow: 1 }}\n scrollContent={scrollContent}\n as={StyledPageLayout}\n forwardedAs={as}\n ref={pageRef}\n minContentHeight={minContentHeight}\n >\n {pageHeader}\n {pageContent}\n </Flex>\n );\n});\n\nconst StyledTabbedPage = styled(PageLayout)<{ $layout?: TabbedPageTab['layout'] }>(({\n $layout = 'standard',\n theme: {\n base: {\n palette: { 'border-line': borderLine }\n },\n components: {\n tabs: { detached: tabsDetached }\n }\n }\n}) => {\n return css`\n gap: 0;\n\n ${tabsDetached &&\n css`\n ${StyledTabPanel} {\n border-block-end: none;\n box-shadow: 0 0.0625rem 0 ${borderLine};\n }\n `}\n\n ${$layout === 'full-size' &&\n css`\n ${StyledRegions} {\n padding: 0;\n\n ${StyledTabPanel} {\n padding-block-start: 0;\n }\n }\n `}\n `;\n});\n\nStyledTabbedPage.defaultProps = defaultThemeProp;\n\nexport const TabbedPage: ForwardRefForwardPropsComponent<TabbedPageProps> = forwardRef(\n function TabbedPage(\n { tabs: tabsProps, utilities, as, ...restProps }: PropsWithoutRef<TabbedPageProps>,\n ref: TabbedPageProps['ref']\n ) {\n const isMediumOrAbove = useBreakpoint('md');\n\n const { currentTabId } = tabsProps;\n\n const t = useI18n();\n\n const tabs = useMemo(() => {\n if (utilities && !isMediumOrAbove) {\n return {\n ...tabsProps,\n tabs: [...tabsProps.tabs, { id: 'agent', name: t('agent'), content: utilities }]\n };\n }\n return tabsProps;\n }, [tabsProps, utilities, isMediumOrAbove]);\n\n const [tabId, setTabId] = useState(tabs.defaultTabId || tabs.tabs[0]?.id);\n\n useEffect(() => {\n if (!currentTabId) {\n const activeTabId = tabs.defaultTabId || tabs.tabs[0]?.id;\n if (activeTabId && tabId === 'agent') setTabId(activeTabId);\n }\n }, [tabsProps, isMediumOrAbove]);\n\n const tabPanels = tabs.tabs.map(tab => {\n return (\n <Flex\n container={{ direction: 'column', gap: 2 }}\n as={TabPanel}\n tabId={tab.id}\n currentTabId={currentTabId ?? tabId}\n key={tab.id}\n >\n {tab.content}\n </Flex>\n );\n });\n\n return (\n <StyledTabbedPage\n {...restProps}\n utilities={utilities}\n tabs={\n <Tabs\n {...tabs}\n onTabClick={(id, e) => {\n if (!currentTabId) {\n setTabId(id);\n }\n tabs.onTabClick?.(id, e);\n }}\n currentTabId={currentTabId ?? tabId}\n />\n }\n regions={[<>{tabPanels}</>]}\n $layout={\n tabs.tabs.find(({ id }) => {\n const activeTabId = currentTabId ?? tabId;\n return id === activeTabId;\n })?.layout\n }\n forwardedAs={as}\n ref={ref}\n />\n );\n }\n);\n\nexport const DynamicLayoutPage: ForwardRefForwardPropsComponent<DynamicLayoutPageProps> =\n forwardRef(function DynamicLayoutPage(\n { a, ...restProps }: PropsWithoutRef<DynamicLayoutPageProps>,\n ref: DynamicLayoutPageProps['ref']\n ) {\n return <PageLayout regions={[a]} ref={ref} {...restProps} padContent={false} />;\n });\n\nexport const OneColumnPage: ForwardRefForwardPropsComponent<OneColumnPageProps> = forwardRef(\n function OneColumnPage(\n { a, ...restProps }: PropsWithoutRef<OneColumnPageProps>,\n ref: OneColumnPageProps['ref']\n ) {\n return <PageLayout regions={[a]} ref={ref} {...restProps} cols='minmax(0, 1fr)' />;\n }\n);\n\nexport const TwoColumnPage: ForwardRefForwardPropsComponent<TwoColumnPageProps> = forwardRef(\n function TwoColumnPage(\n { a, b, ...restProps }: PropsWithoutRef<TwoColumnPageProps>,\n ref: TwoColumnPageProps['ref']\n ) {\n return (\n <PageLayout regions={[a, b]} ref={ref} {...restProps} cols='repeat(2, minmax(0, 1fr))' />\n );\n }\n);\n\nexport const ThreeColumnPage: ForwardRefForwardPropsComponent<ThreeColumnPageProps> = forwardRef(\n function ThreeColumnPage(\n { a, b, c, ...restProps }: PropsWithoutRef<ThreeColumnPageProps>,\n ref: ThreeColumnPageProps['ref']\n ) {\n return (\n <PageLayout regions={[a, b, c]} ref={ref} {...restProps} cols='repeat(3, minmax(0, 1fr))' />\n );\n }\n);\n\nexport const FourColumnPage: ForwardRefForwardPropsComponent<FourColumnPageProps> = forwardRef(\n function FourColumnPage(\n { a, b, c, d, ...restProps }: PropsWithoutRef<FourColumnPageProps>,\n ref: FourColumnPageProps['ref']\n ) {\n return (\n <PageLayout\n regions={[a, b, c, d]}\n ref={ref}\n {...restProps}\n cols='repeat(4, minmax(0, 1fr))'\n />\n );\n }\n);\n\nexport const WideNarrowPage: ForwardRefForwardPropsComponent<WideNarrowPageProps> = forwardRef(\n function WideNarrowPage(\n { a, b, ...restProps }: PropsWithoutRef<WideNarrowPageProps>,\n ref: WideNarrowPageProps['ref']\n ) {\n return (\n <PageLayout regions={[a, b]} ref={ref} {...restProps} cols='minmax(0, 2fr) minmax(0, 1fr)' />\n );\n }\n);\n\nexport const NarrowWidePage: ForwardRefForwardPropsComponent<WideNarrowPageProps> = forwardRef(\n function NarrowWidePage(\n { a, b, ...restProps }: PropsWithoutRef<WideNarrowPageProps>,\n ref: NarrowWidePageProps['ref']\n ) {\n return (\n <PageLayout regions={[a, b]} ref={ref} {...restProps} cols='minmax(0, 1fr) minmax(0, 2fr)' />\n );\n }\n);\n\nexport const WideWideNarrowPage: ForwardRefForwardPropsComponent<WideWideNarrowPageProps> =\n forwardRef(function WideWideNarrowPage(\n { a, b, c, ...restProps }: PropsWithoutRef<WideWideNarrowPageProps>,\n ref: WideWideNarrowPageProps['ref']\n ) {\n return (\n <PageLayout\n regions={[a, b, c]}\n ref={ref}\n {...restProps}\n cols='repeat(2, minmax(0, 2fr)) minmax(0, 1fr)'\n />\n );\n });\n\nexport const NarrowWideWidePage: ForwardRefForwardPropsComponent<NarrowWideWidePageProps> =\n forwardRef(function NarrowWideWidePage(\n { a, b, c, ...restProps }: PropsWithoutRef<NarrowWideWidePageProps>,\n ref: NarrowWideWidePageProps['ref']\n ) {\n return (\n <PageLayout\n regions={[a, b, c]}\n ref={ref}\n {...restProps}\n cols='minmax(0, 1fr) repeat(2, minmax(0, 2fr))'\n />\n );\n });\n\nexport const NarrowWideNarrowPage: ForwardRefForwardPropsComponent<NarrowWideNarrowPageProps> =\n forwardRef(function NarrowWideNarrowPage(\n { a, b, c, ...restProps }: PropsWithoutRef<NarrowWideNarrowPageProps>,\n ref: NarrowWideNarrowPageProps['ref']\n ) {\n return (\n <PageLayout\n regions={[a, b, c]}\n ref={ref}\n {...restProps}\n cols='minmax(0, 1fr) minmax(0, 3fr) minmax(0, 1fr)'\n />\n );\n });\n"]}
|
|
1
|
+
{"version":3,"file":"PageTemplates.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { PropsWithoutRef, ReactElement, ReactNode, Ref } from 'react';\nimport { forwardRef, useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n useBreakpoint,\n useConfiguration,\n useConsolidatedRef,\n useElement,\n useI18n,\n useScrollStick,\n useTheme\n} from '../../hooks';\nimport type { ScrollStickOptions } from '../../hooks/useScrollStick';\nimport { calculateForegroundColor, readableColor } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport type {\n AsProp,\n BaseProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp,\n OmitStrict\n} from '../../types';\nimport { focusHeadingOrContainer, tryCatch } from '../../utils';\nimport AppShellContext from '../AppShell/AppShellContext';\nimport { StyledBanner } from '../Banner/Banner';\nimport type { BreadcrumbsProps } from '../Breadcrumbs';\nimport Breadcrumbs, { StyledBreadcrumbs } from '../Breadcrumbs';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport Icon from '../Icon';\nimport SummaryItem from '../SummaryItem';\nimport type { Tab, TabsProps } from '../Tabs';\nimport Tabs, { TabPanel } from '../Tabs';\nimport { StyledTabPanel } from '../Tabs/TabPanel';\nimport { StyledAllTabsWrapper, StyledTabs, StylesAllTabsButtonWrapper } from '../Tabs/Tabs.styles';\nimport Text from '../Text';\nimport { StyledMenuButton } from '../MenuButton/MenuButton';\n\nexport interface PageTemplateProps extends BaseProps, AsProp, NoChildrenProp {\n title: string;\n icon?: string;\n actions?: ReactNode;\n banners?: ReactNode;\n path?: BreadcrumbsProps['path'];\n header?: ReactNode;\n utilities?: ReactNode;\n scrollContent?: boolean;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface TabbedPageTab extends Tab {\n content: ReactNode;\n /**\n * Determines layout spacing.\n * @default 'standard'\n */\n layout?: 'standard' | 'full-size';\n}\n\nexport interface TabbedPageProps extends OmitStrict<PageTemplateProps, 'forwardedAs'> {\n tabs: OmitStrict<TabsProps, 'tabs' | 'currentTabId'> & {\n tabs: TabbedPageTab[];\n } & (\n | { defaultTabId?: string; currentTabId?: never }\n | { defaultTabId?: never; currentTabId: string }\n );\n}\n\nexport interface DynamicLayoutPageProps extends OmitStrict<PageTemplateProps, 'scrollContent'> {\n a: ReactNode;\n}\n\nexport interface OneColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n}\n\nexport interface TwoColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface ThreeColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface FourColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n d: ReactNode;\n}\n\nexport interface WideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface NarrowWidePageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface WideWideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface NarrowWideWidePageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface NarrowWideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface PageLayoutProps extends PageTemplateProps {\n tabs?: ReactElement<typeof Tabs>;\n regions: ReactNode[];\n regionsRef?: Ref<HTMLDivElement>;\n cols?: string;\n padContent?: boolean;\n}\n\nexport const StyledPageIcon = styled(Flex)(({ theme }) => {\n const bgColor = theme.base.palette['brand-primary'];\n const color = tryCatch(() => readableColor(bgColor));\n return css`\n height: calc(4 * ${theme.base.spacing});\n width: calc(4 * ${theme.base.spacing});\n background: ${bgColor};\n color: ${color};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n `;\n});\n\nStyledPageIcon.defaultProps = defaultThemeProp;\n\nexport const StyledPageHeader = styled.header(({ theme }) => {\n const appBg = theme.base.palette['app-background'];\n const appFg = theme.base.palette['app-foreground'];\n const tabsDetached = theme.components.tabs.detached;\n const color = calculateForegroundColor(appBg, appFg);\n\n return css`\n h1 {\n color: ${color};\n }\n\n h1:focus-visible {\n outline: transparent;\n box-shadow: ${theme.base.shadow.focus};\n }\n\n ${StyledBreadcrumbs} {\n margin-block-end: ${theme.base.spacing};\n }\n\n ${StyledBanner}, ${StyledTabs}, ${StylesAllTabsButtonWrapper} {\n margin-block-start: calc(2 * ${theme.base.spacing});\n }\n\n ${tabsDetached &&\n css`\n ${StyledAllTabsWrapper} {\n margin-block-start: calc(2 * ${theme.base.spacing});\n border-radius: var(--border-radius, ${theme.base['border-radius']});\n border-end-start-radius: 0;\n\n ${StyledTabs} {\n border-radius: unset;\n border-start-end-radius: inherit;\n margin-block-start: 0;\n }\n\n ${StylesAllTabsButtonWrapper} {\n margin-block-start: 0;\n\n ${StyledMenuButton} {\n border-start-start-radius: var(--border-radius, ${theme.base['border-radius']});\n }\n }\n }\n `}\n `;\n});\n\nStyledPageHeader.defaultProps = defaultThemeProp;\n\nexport const StyledRegion = styled.div<{ renderSingleRegion?: boolean }>(\n ({ renderSingleRegion }) => {\n if (renderSingleRegion) {\n return css`\n height: 100%;\n `;\n }\n }\n);\n\nStyledRegion.defaultProps = defaultThemeProp;\n\nexport const StyledRegions = styled.div<{ pad: boolean }>(({ pad, theme }) => {\n const spacing = theme.base.spacing;\n\n return css`\n flex-grow: 1;\n max-width: 100%;\n\n ${pad &&\n css`\n padding: 0 calc(2 * ${spacing}) calc(2 * ${spacing});\n `}\n [role='tabpanel'] & {\n padding: 0;\n }\n `;\n});\nStyledRegions.defaultProps = defaultThemeProp;\n\nexport const StyledContent = styled.div``;\nStyledContent.defaultProps = defaultThemeProp;\n\nexport const StyledScrollableTabPanel: typeof TabPanel = styled(TabPanel)(() => {\n return css`\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledScrollableTabPanel.defaultProps = defaultThemeProp;\n\nexport const StyledPageLayout = styled.div<{\n scrollContent: PageLayoutProps['scrollContent'];\n minContentHeight?: number;\n}>(\n ({\n theme: {\n base: {\n palette: { 'app-background': appBackground }\n }\n },\n scrollContent,\n minContentHeight\n }) => {\n const emptyContentHeight = minContentHeight ? `${minContentHeight}px` : undefined;\n\n return css`\n --content-height-in-view: ${emptyContentHeight};\n position: relative;\n min-height: inherit;\n background: ${appBackground};\n\n ${scrollContent &&\n css`\n ${StyledContent} {\n position: relative;\n }\n\n ${StyledRegions} {\n position: absolute;\n height: 100%;\n width: 100%;\n overflow: auto;\n }\n `}\n `;\n }\n);\n\nStyledPageLayout.defaultProps = defaultThemeProp;\n\nconst StyledPageLayoutWrapper = styled.div`\n height: 100%;\n`;\n\nconst StylePageTabContent = styled.div`\n ${StyledRegions} {\n padding: 0;\n }\n`;\n\nconst PageLayout: ForwardRefForwardPropsComponent<PageLayoutProps> = forwardRef(function PageLayout(\n {\n regions,\n cols = `repeat(${regions.length}, minmax(0, 1fr))`,\n title,\n icon,\n path,\n actions,\n banners,\n tabs,\n utilities,\n as,\n header,\n regionsRef,\n scrollContent = false,\n padContent = true,\n ...restProps\n }: PropsWithoutRef<PageLayoutProps>,\n ref: PageLayoutProps['ref']\n) {\n const t = useI18n();\n const [contentEl, setContentEl] = useElement<HTMLElement>();\n const isMediumOrAbove = useBreakpoint('md');\n const hasSideBySideColumns = regions.length > 1 && isMediumOrAbove;\n const { headerEl } = useContext(AppShellContext);\n const { loadedRef } = useConfiguration();\n const [panel, setPanel] = useState('content');\n const {\n components: {\n tabs: { detached: tabsDetached }\n }\n } = useTheme();\n\n const pageRef = useConsolidatedRef(ref);\n const pageTabsRef = useRef<HTMLElement>(null);\n const consolidatedRegionRef = useConsolidatedRef(regionsRef);\n const scrollStickOptions = useRef<ScrollStickOptions>({\n elements: []\n });\n\n scrollStickOptions.current.scrollContainer = scrollContent && contentEl ? contentEl : undefined;\n scrollStickOptions.current.offset = (headerEl?.offsetHeight ?? 0) + 16;\n\n useScrollStick(hasSideBySideColumns ? scrollStickOptions.current : undefined);\n\n const renderSingleRegion = regions?.length === 1;\n\n const [minContentHeight, setMinContentHeight] = useState<number | undefined>();\n\n useEffect(() => {\n if (!pageRef.current) return;\n\n if (loadedRef.current) {\n focusHeadingOrContainer(pageRef.current, title);\n } else {\n loadedRef.current = true;\n }\n }, [title]);\n\n useEffect(() => {\n if (consolidatedRegionRef.current) {\n const refElement = consolidatedRegionRef.current;\n const regionsPaddingBottomPixels = Number.parseInt(\n window.getComputedStyle(refElement).getPropertyValue('padding-bottom'),\n 10\n );\n\n const resizeObserver = new ResizeObserver(() => {\n const headerOffset = headerEl?.offsetHeight ?? 0;\n const emptyHeight =\n document.documentElement.offsetHeight -\n (headerOffset + refElement.offsetTop) -\n regionsPaddingBottomPixels;\n\n setMinContentHeight(emptyHeight);\n });\n\n resizeObserver.observe(refElement);\n\n return () => {\n resizeObserver.disconnect();\n };\n }\n }, [consolidatedRegionRef, headerEl]);\n\n const pageContent = (\n <Flex\n container\n item={{ grow: 1 }}\n as={StyledContent}\n ref={scrollContent ? setContentEl : undefined}\n >\n {renderSingleRegion && (\n <StyledRegions ref={consolidatedRegionRef} pad={padContent}>\n <Flex\n container={{\n direction: 'column',\n gap: 2\n }}\n as={StyledRegion}\n ref={(el: HTMLDivElement | null) => {\n if (el) {\n scrollStickOptions.current.elements[0] = el;\n }\n }}\n renderSingleRegion\n >\n {regions[0]}\n </Flex>\n </StyledRegions>\n )}\n\n {!renderSingleRegion && (\n <Grid\n container={{\n cols: 'minmax(0, 1fr)',\n alignItems: 'start',\n gap: 2,\n pad: [0, 2, 2]\n }}\n md={{ container: { cols } }}\n as={StyledRegions}\n ref={consolidatedRegionRef}\n >\n {regions.map((colItems, i) => {\n return (\n <Flex\n container={{\n direction: 'column',\n gap: 2\n }}\n as={StyledRegion}\n // eslint-disable-next-line react/no-array-index-key\n key={i}\n ref={(el: HTMLDivElement | null) => {\n if (el) {\n scrollStickOptions.current.elements[i] = el;\n }\n }}\n >\n {colItems}\n </Flex>\n );\n })}\n </Grid>\n )}\n </Flex>\n );\n\n const pageTabs = [\n { name: t('content'), id: 'content', content: pageContent },\n {\n name: t('agent'),\n id: 'agent',\n content: utilities\n }\n ];\n\n const pageHeader =\n !!path || !!icon || !!actions || !!title || !!banners || !!tabs || !!header ? (\n <Flex\n container={{ direction: 'column', pad: [2, 2, 0] }}\n item={{ grow: 0, shrink: 0 }}\n as={StyledPageHeader}\n >\n {path && path.length > 0 && <Breadcrumbs path={path} />}\n\n {header || (\n <SummaryItem\n visual={\n icon && (\n <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n <Icon name={icon} />\n </StyledPageIcon>\n )\n }\n primary={<Text variant='h1'>{title}</Text>}\n actions={actions}\n />\n )}\n\n {banners}\n {tabs}\n </Flex>\n ) : null;\n\n const handleTabChange = (id: string) => {\n setPanel(id);\n };\n\n if (utilities) {\n if (isMediumOrAbove || tabs) {\n return (\n <Flex container={{ gap: 2 }} as={StyledPageLayoutWrapper}>\n <Flex\n {...restProps}\n container={{\n direction: 'column',\n alignItems: 'stretch',\n gap: 2\n }}\n item={{ grow: 1 }}\n scrollContent={scrollContent}\n as={StyledPageLayout}\n forwardedAs={as}\n ref={pageRef}\n minContentHeight={minContentHeight}\n >\n {pageHeader}\n {pageContent}\n </Flex>\n {(isMediumOrAbove || !tabs) && <div>{utilities}</div>}\n </Flex>\n );\n }\n\n return (\n <Flex\n {...restProps}\n as={StyledPageLayout}\n forwardedAs={as}\n ref={pageRef}\n container={{ direction: 'column' }}\n >\n {pageHeader}\n <Flex\n container={{ direction: 'column', pad: [2, 2, 0], gap: tabsDetached ? undefined : 2 }}\n >\n <Tabs\n tabs={pageTabs}\n onTabClick={handleTabChange}\n currentTabId={panel}\n ref={pageTabsRef}\n />\n {pageTabs.map(tab => (\n <TabPanel tabId={tab.id} currentTabId={panel} tablistRef={pageTabsRef} key={tab.id}>\n <StylePageTabContent>{tab.content}</StylePageTabContent>\n </TabPanel>\n ))}\n </Flex>\n </Flex>\n );\n }\n\n return (\n <Flex\n {...restProps}\n container={{\n direction: 'column',\n alignItems: 'stretch',\n gap: 2\n }}\n item={{ grow: 1 }}\n scrollContent={scrollContent}\n as={StyledPageLayout}\n forwardedAs={as}\n ref={pageRef}\n minContentHeight={minContentHeight}\n >\n {pageHeader}\n {pageContent}\n </Flex>\n );\n});\n\nconst StyledTabbedPage = styled(PageLayout)<{ $layout?: TabbedPageTab['layout'] }>(({\n $layout = 'standard',\n theme: {\n base: {\n palette: { 'border-line': borderLine }\n },\n components: {\n tabs: { detached: tabsDetached }\n }\n }\n}) => {\n return css`\n gap: 0;\n\n ${tabsDetached &&\n css`\n ${StyledTabPanel} {\n border-block-end: none;\n box-shadow: 0 0.0625rem 0 ${borderLine};\n }\n `}\n\n ${$layout === 'full-size' &&\n css`\n ${StyledRegions} {\n padding: 0;\n\n ${StyledTabPanel} {\n padding-block-start: 0;\n }\n }\n `}\n `;\n});\n\nStyledTabbedPage.defaultProps = defaultThemeProp;\n\nexport const TabbedPage: ForwardRefForwardPropsComponent<TabbedPageProps> = forwardRef(\n function TabbedPage(\n { tabs: tabsProps, utilities, as, ...restProps }: PropsWithoutRef<TabbedPageProps>,\n ref: TabbedPageProps['ref']\n ) {\n const isMediumOrAbove = useBreakpoint('md');\n\n const { currentTabId } = tabsProps;\n\n const t = useI18n();\n\n const tabs = useMemo(() => {\n if (utilities && !isMediumOrAbove) {\n return {\n ...tabsProps,\n tabs: [...tabsProps.tabs, { id: 'agent', name: t('agent'), content: utilities }]\n };\n }\n return tabsProps;\n }, [tabsProps, utilities, isMediumOrAbove]);\n\n const [tabId, setTabId] = useState(tabs.defaultTabId || tabs.tabs[0]?.id);\n\n useEffect(() => {\n if (!currentTabId) {\n const activeTabId = tabs.defaultTabId || tabs.tabs[0]?.id;\n if (activeTabId && tabId === 'agent') setTabId(activeTabId);\n }\n }, [tabsProps, isMediumOrAbove]);\n\n const tabPanels = tabs.tabs.map(tab => {\n return (\n <Flex\n container={{ direction: 'column', gap: 2 }}\n as={TabPanel}\n tabId={tab.id}\n currentTabId={currentTabId ?? tabId}\n key={tab.id}\n >\n {tab.content}\n </Flex>\n );\n });\n\n return (\n <StyledTabbedPage\n {...restProps}\n utilities={utilities}\n tabs={\n <Tabs\n {...tabs}\n onTabClick={(id, e) => {\n if (!currentTabId) {\n setTabId(id);\n }\n tabs.onTabClick?.(id, e);\n }}\n currentTabId={currentTabId ?? tabId}\n />\n }\n regions={[<>{tabPanels}</>]}\n $layout={\n tabs.tabs.find(({ id }) => {\n const activeTabId = currentTabId ?? tabId;\n return id === activeTabId;\n })?.layout\n }\n forwardedAs={as}\n ref={ref}\n />\n );\n }\n);\n\nexport const DynamicLayoutPage: ForwardRefForwardPropsComponent<DynamicLayoutPageProps> =\n forwardRef(function DynamicLayoutPage(\n { a, ...restProps }: PropsWithoutRef<DynamicLayoutPageProps>,\n ref: DynamicLayoutPageProps['ref']\n ) {\n return <PageLayout regions={[a]} ref={ref} {...restProps} padContent={false} />;\n });\n\nexport const OneColumnPage: ForwardRefForwardPropsComponent<OneColumnPageProps> = forwardRef(\n function OneColumnPage(\n { a, ...restProps }: PropsWithoutRef<OneColumnPageProps>,\n ref: OneColumnPageProps['ref']\n ) {\n return <PageLayout regions={[a]} ref={ref} {...restProps} cols='minmax(0, 1fr)' />;\n }\n);\n\nexport const TwoColumnPage: ForwardRefForwardPropsComponent<TwoColumnPageProps> = forwardRef(\n function TwoColumnPage(\n { a, b, ...restProps }: PropsWithoutRef<TwoColumnPageProps>,\n ref: TwoColumnPageProps['ref']\n ) {\n return (\n <PageLayout regions={[a, b]} ref={ref} {...restProps} cols='repeat(2, minmax(0, 1fr))' />\n );\n }\n);\n\nexport const ThreeColumnPage: ForwardRefForwardPropsComponent<ThreeColumnPageProps> = forwardRef(\n function ThreeColumnPage(\n { a, b, c, ...restProps }: PropsWithoutRef<ThreeColumnPageProps>,\n ref: ThreeColumnPageProps['ref']\n ) {\n return (\n <PageLayout regions={[a, b, c]} ref={ref} {...restProps} cols='repeat(3, minmax(0, 1fr))' />\n );\n }\n);\n\nexport const FourColumnPage: ForwardRefForwardPropsComponent<FourColumnPageProps> = forwardRef(\n function FourColumnPage(\n { a, b, c, d, ...restProps }: PropsWithoutRef<FourColumnPageProps>,\n ref: FourColumnPageProps['ref']\n ) {\n return (\n <PageLayout\n regions={[a, b, c, d]}\n ref={ref}\n {...restProps}\n cols='repeat(4, minmax(0, 1fr))'\n />\n );\n }\n);\n\nexport const WideNarrowPage: ForwardRefForwardPropsComponent<WideNarrowPageProps> = forwardRef(\n function WideNarrowPage(\n { a, b, ...restProps }: PropsWithoutRef<WideNarrowPageProps>,\n ref: WideNarrowPageProps['ref']\n ) {\n return (\n <PageLayout regions={[a, b]} ref={ref} {...restProps} cols='minmax(0, 2fr) minmax(0, 1fr)' />\n );\n }\n);\n\nexport const NarrowWidePage: ForwardRefForwardPropsComponent<WideNarrowPageProps> = forwardRef(\n function NarrowWidePage(\n { a, b, ...restProps }: PropsWithoutRef<WideNarrowPageProps>,\n ref: NarrowWidePageProps['ref']\n ) {\n return (\n <PageLayout regions={[a, b]} ref={ref} {...restProps} cols='minmax(0, 1fr) minmax(0, 2fr)' />\n );\n }\n);\n\nexport const WideWideNarrowPage: ForwardRefForwardPropsComponent<WideWideNarrowPageProps> =\n forwardRef(function WideWideNarrowPage(\n { a, b, c, ...restProps }: PropsWithoutRef<WideWideNarrowPageProps>,\n ref: WideWideNarrowPageProps['ref']\n ) {\n return (\n <PageLayout\n regions={[a, b, c]}\n ref={ref}\n {...restProps}\n cols='repeat(2, minmax(0, 2fr)) minmax(0, 1fr)'\n />\n );\n });\n\nexport const NarrowWideWidePage: ForwardRefForwardPropsComponent<NarrowWideWidePageProps> =\n forwardRef(function NarrowWideWidePage(\n { a, b, c, ...restProps }: PropsWithoutRef<NarrowWideWidePageProps>,\n ref: NarrowWideWidePageProps['ref']\n ) {\n return (\n <PageLayout\n regions={[a, b, c]}\n ref={ref}\n {...restProps}\n cols='minmax(0, 1fr) repeat(2, minmax(0, 2fr))'\n />\n );\n });\n\nexport const NarrowWideNarrowPage: ForwardRefForwardPropsComponent<NarrowWideNarrowPageProps> =\n forwardRef(function NarrowWideNarrowPage(\n { a, b, c, ...restProps }: PropsWithoutRef<NarrowWideNarrowPageProps>,\n ref: NarrowWideNarrowPageProps['ref']\n ) {\n return (\n <PageLayout\n regions={[a, b, c]}\n ref={ref}\n {...restProps}\n cols='minmax(0, 1fr) minmax(0, 3fr) minmax(0, 1fr)'\n />\n );\n });\n"]}
|
|
@@ -22,7 +22,7 @@ const DefaultNodeRenderer = ({ data, subTree }) => {
|
|
|
22
22
|
};
|
|
23
23
|
let TreeList;
|
|
24
24
|
const TreeItem = ({ listItemProps, depth, nodes, nodeRenderer: NodeRenderer, ...restProps }) => {
|
|
25
|
-
return (_jsx(StyledTreeListItem, { ...listItemProps, children: _jsx(NodeRenderer, { ...restProps, depth: depth, nodes: nodes, subTree: nodes && _jsx(TreeList, { depth: depth + 1, nodes: nodes, nodeRenderer: NodeRenderer }) }) }));
|
|
25
|
+
return (_jsx(StyledTreeListItem, { ...listItemProps, role: 'none', children: _jsx(NodeRenderer, { ...restProps, depth: depth, nodes: nodes, subTree: nodes && _jsx(TreeList, { depth: depth + 1, nodes: nodes, nodeRenderer: NodeRenderer }) }) }));
|
|
26
26
|
};
|
|
27
27
|
TreeList = forwardRef(function TreeListFunction({ nodes, depth, nodeRenderer, ...restProps }, ref) {
|
|
28
28
|
const hasParentSibling = nodes.some(node => !!node.nodes);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tree.js","sourceRoot":"","sources":["../../../src/components/Tree/Tree.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAGvC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AA+BjD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,EAAE,CAAA,EAAE,CAAC;AAE9C,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,EAAE,CAAA;;;;;;;IAOnC,kBAAkB;;;CAGrB,CAAC;AAEF,MAAM,mBAAmB,GAA8B,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE;IAC3E,OAAO,CACL,8BACG,IAAI,EACJ,OAAO,IACP,CACJ,CAAC;AACJ,CAAC,CAAC;AAaF,IAAI,QAAsC,CAAC;AAE3C,MAAM,QAAQ,GAAG,CAAC,EAChB,aAAa,EACb,KAAK,EACL,KAAK,EACL,YAAY,EAAE,YAAY,EAC1B,GAAG,SAAS,EACE,EAAE,EAAE;IAClB,OAAO,CACL,KAAC,kBAAkB,OAAK,aAAa,
|
|
1
|
+
{"version":3,"file":"Tree.js","sourceRoot":"","sources":["../../../src/components/Tree/Tree.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAGvC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AA+BjD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,EAAE,CAAA,EAAE,CAAC;AAE9C,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,EAAE,CAAA;;;;;;;IAOnC,kBAAkB;;;CAGrB,CAAC;AAEF,MAAM,mBAAmB,GAA8B,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE;IAC3E,OAAO,CACL,8BACG,IAAI,EACJ,OAAO,IACP,CACJ,CAAC;AACJ,CAAC,CAAC;AAaF,IAAI,QAAsC,CAAC;AAE3C,MAAM,QAAQ,GAAG,CAAC,EAChB,aAAa,EACb,KAAK,EACL,KAAK,EACL,YAAY,EAAE,YAAY,EAC1B,GAAG,SAAS,EACE,EAAE,EAAE;IAClB,OAAO,CACL,KAAC,kBAAkB,OAAK,aAAa,EAAE,IAAI,EAAC,MAAM,YAChD,KAAC,YAAY,OACP,SAAS,EACb,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,KAAK,IAAI,KAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,YAAY,GAAI,GAC1F,GACiB,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,QAAQ,GAAG,UAAU,CAAC,SAAS,gBAAgB,CAC7C,EAAE,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,SAAS,EAAkC,EAC5E,GAAsB;IAEtB,MAAM,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC1D,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACxB,KAAC,cAAc,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,YAC1E,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACjB,eAAC,QAAQ,OACH,IAAI,EACR,GAAG,EAAE,IAAI,CAAC,EAAE,EACZ,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,gBAAgB,EAAE,gBAAgB,GAClC,CACH,CAAC,GACa,CAClB,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAiC,CAAC;AAEnC,MAAM,IAAI,GAAG,UAAU,CAAC,SAAS,IAAI,CACnC,EAAE,MAAM,EAAE,YAAY,GAAG,mBAAmB,EAAE,GAAG,SAAS,EAA8B,EACxF,GAAqB;IAErB,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;IAEnD,OAAO,CACL,KAAC,QAAQ,mBACM,OAAO,CAAC,IAAI,KACrB,SAAS,EACb,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,CAAC,EACR,YAAY,EAAE,YAAY,GAC1B,CACH,CAAC;AACJ,CAAC,CAA8F,CAAC;AAEhG,eAAe,WAAW,CAAC,IAAI,EAAE,cAAc,CAAC,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef, Ref, ComponentType, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport type { BaseProps, NoChildrenProp, ForwardProps, OmitStrict, TestIdProp } from '../../types';\nimport { useTestIds } from '../../hooks';\nimport { withTestIds } from '../../utils';\n\nimport { getTreeTestIds } from './Tree.test-ids';\n\nexport type TreeNode = {\n /** The id of the Node. Used as the key for the li element wrapping the Node. */\n id: string;\n /** Child nodes. */\n nodes?: TreeNode[];\n /** Props to apply to the li. */\n listItemProps?: ForwardProps;\n\n [key: string]: unknown;\n};\n\nexport interface TreeProps<T extends TreeNode = TreeNode>\n extends BaseProps,\n NoChildrenProp,\n TestIdProp {\n /** An array of ParentNodes and Nodes that compose the layout of the Tree. */\n nodes: T[];\n /** A function that allows custom styling and behavior for all Nodes. */\n nodeRenderer?: ComponentType<\n {\n depth: number;\n subTree?: ReactNode;\n hasParentSibling: TreeItemProps['hasParentSibling'];\n } & OmitStrict<T, 'listItemProps'>\n >;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLUListElement>;\n}\n\nexport const StyledTreeListItem = styled.li``;\n\nexport const StyledTreeList = styled.ul`\n &,\n & & {\n list-style: none;\n position: relative;\n }\n\n ${StyledTreeListItem} {\n position: relative;\n }\n`;\n\nconst DefaultNodeRenderer: TreeProps['nodeRenderer'] = ({ data, subTree }) => {\n return (\n <>\n {data}\n {subTree}\n </>\n );\n};\n\ninterface TreeItemProps extends TreeNode {\n nodeRenderer: NonNullable<TreeProps['nodeRenderer']>;\n depth: number;\n hasParentSibling: boolean;\n}\n\ninterface TreeListProps extends Pick<TreeProps, 'nodes' | 'ref'> {\n nodeRenderer: NonNullable<TreeProps['nodeRenderer']>;\n depth: number;\n}\n\nlet TreeList: ComponentType<TreeListProps>;\n\nconst TreeItem = ({\n listItemProps,\n depth,\n nodes,\n nodeRenderer: NodeRenderer,\n ...restProps\n}: TreeItemProps) => {\n return (\n <StyledTreeListItem {...listItemProps} role='none'>\n <NodeRenderer\n {...restProps}\n depth={depth}\n nodes={nodes}\n subTree={nodes && <TreeList depth={depth + 1} nodes={nodes} nodeRenderer={NodeRenderer} />}\n />\n </StyledTreeListItem>\n );\n};\n\nTreeList = forwardRef(function TreeListFunction(\n { nodes, depth, nodeRenderer, ...restProps }: PropsWithoutRef<TreeListProps>,\n ref?: TreeProps['ref']\n) {\n const hasParentSibling = nodes.some(node => !!node.nodes);\n return nodes.length > 0 ? (\n <StyledTreeList {...restProps} ref={ref} role={depth === 0 ? 'tree' : 'group'}>\n {nodes.map(node => (\n <TreeItem\n {...node}\n key={node.id}\n depth={depth}\n nodeRenderer={nodeRenderer}\n hasParentSibling={hasParentSibling}\n />\n ))}\n </StyledTreeList>\n ) : null;\n}) as ComponentType<TreeListProps>;\n\nconst Tree = forwardRef(function Tree(\n { testId, nodeRenderer = DefaultNodeRenderer, ...restProps }: PropsWithoutRef<TreeProps>,\n ref: TreeProps['ref']\n) {\n const testIds = useTestIds(testId, getTreeTestIds);\n\n return (\n <TreeList\n data-testid={testIds.root}\n {...restProps}\n ref={ref}\n depth={0}\n nodeRenderer={nodeRenderer}\n />\n );\n}) as <T extends TreeNode = TreeNode>(props: TreeProps<T> & ForwardProps) => JSX.Element | null;\n\nexport default withTestIds(Tree, getTreeTestIds);\n"]}
|