npm - @foxford/ui - Versions diffs - 2.59.0 → 2.61.0 - Mend

@foxford/ui 2.59.0 → 2.61.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (318) hide show

package/components/Chip/style.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"style.mjs","sources":["../../../../src/components/Chip/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport type { CSSColor } from 'shared/types'\nimport type { StyledChipProps, ChipPalette } from './types'\n\nconst shouldForwardChipProp = createShouldForwardProp(\n (propKey) => !['outline', 'black', 'active', 'cursor'].includes(propKey)\n)\n\nconst template = (palette: ChipPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n border-color: ${palette.borderColor};\n &:hover {\n color: ${palette.colorHover};\n background-color: ${palette.backgroundColorHover};\n border-color: ${palette.borderColorHover};\n }\n &:disabled {\n color: ${palette.colorDisabled};\n background-color: ${palette.backgroundColorDisabled};\n border-color: ${palette.borderColorDisabled};\n }\n`\n\nconst COLOR_SCHEMA = {\n default: {\n primary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-100'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-onmain-contrast']\n : props.theme.colors['bg-onmain-tertiary'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-contrast']).lighten(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(11).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n },\n secondary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-brand-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-brand-primary-100'],\n borderColor: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-400'],\n colorHover: props.active\n ? props.theme.colors['content-brand-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-100']).lighten(2).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-400'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-onmain-secondary']\n : props.theme.colors['bg-onmain-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-onmain-contrast']\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-secondary']).lighten(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(11).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-onmain-contrast']\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n },\n outline: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-brand-primary-500'] : props.theme.colors.transparent,\n borderColor: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor)\n : props.theme.colors['content-oncolor-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active ? props.theme.colors.transparent : props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-onmain-contrast'] : props.theme.colors.transparent,\n borderColor: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-contrast']).lighten(11).toString() as CSSColor)\n : props.theme.colors['content-oncolor-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active ? props.theme.colors.transparent : props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n },\n },\n contrast: {\n primary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-primary']\n : props.theme.colors['bg-brand-primary-100'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-primary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n },\n secondary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-secondary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorHover: props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-secondary']).setAlpha(0.5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-secondary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorHover: props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-secondary']).setAlpha(0.5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n },\n outline: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-oncolor-primary'] : props.theme.colors.transparent,\n borderColor: props.active ? props.theme.colors.transparent : props.theme.colors['border-oncolor-default'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : props.theme.colors['content-onmain-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-default'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-oncolor-disabled']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-oncolor-primary'] : props.theme.colors.transparent,\n borderColor: props.active ? props.theme.colors.transparent : props.theme.colors['border-oncolor-default'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : props.theme.colors['content-onmain-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-default'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-oncolor-disabled']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n },\n },\n}\n\nexport const Content = styled.span`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n text-align: start;\n`\n\nexport const Root = styled.div.withConfig<StyledChipProps>({\n shouldForwardProp: shouldForwardChipProp,\n})`\n ${(props) => {\n let cursor = 'default'\n\n if (props.as === 'button') cursor = 'pointer'\n if (props.as === 'button' && props.disabled) cursor = 'not-allowed'\n if (props.cursor) cursor = props.cursor\n\n return `\n box-sizing: border-box;\n appearance: none;\n margin: 0;\n display: inline-flex;\n align-items: center;\n border: 1px solid transparent;\n flex-shrink: 0;\n cursor: ${cursor};\n transition-property: background-color;\n transition-duration: 250ms;\n\n & > *:not(:last-child) {\n margin-right: 6px;\n }\n\n & > ${Content}:first-child {\n margin-left: 6px;\n }\n & > ${Content}:last-child {\n margin-right: 6px;\n }\n `\n }}\n\n ${(props) => {\n const schema = props.contrast ? COLOR_SCHEMA.contrast : COLOR_SCHEMA.default\n\n let schemaVariant = schema.primary\n\n if (props.secondary) schemaVariant = schema.secondary\n if (props.outline) schemaVariant = schema.outline\n\n return props.black ? schemaVariant.black : schemaVariant.default\n }}\n\n ${focus}\n ${responsiveSize}\n ${responsiveMargin}\n`\n"],"names":["shouldForwardChipProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","borderColor","colorHover","backgroundColorHover","borderColorHover","colorDisabled","backgroundColorDisabled","borderColorDisabled","COLOR_SCHEMA","default","primary","css","props","active","theme","colors","transparent","tinycolor","lighten","toString","darken","black","secondary","outline","contrast","setAlpha","Content","styled","span","withConfig","displayName","componentId","Root","div","shouldForwardProp","cursor","as","disabled","schema","schemaVariant","focus","responsiveSize","responsiveMargin"],"mappings":"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"}
1	+ {"version":3,"file":"style.mjs","sources":["../../../../src/components/Chip/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport type { CSSColor } from 'shared/types'\nimport type { StyledChipProps, ChipPalette } from './types'\n\nconst shouldForwardChipProp = createShouldForwardProp(\n (propKey) => !['outline', 'black', 'active', 'cursor'].includes(propKey)\n)\n\nconst template = (palette: ChipPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n border-color: ${palette.borderColor};\n &:hover {\n color: ${palette.colorHover};\n background-color: ${palette.backgroundColorHover};\n border-color: ${palette.borderColorHover};\n }\n &:disabled {\n color: ${palette.colorDisabled};\n background-color: ${palette.backgroundColorDisabled};\n border-color: ${palette.borderColorDisabled};\n }\n`\n\nconst COLOR_SCHEMA = {\n default: {\n primary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-100'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-onmain-contrast']\n : props.theme.colors['bg-onmain-tertiary'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-contrast']).lighten(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(11).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n },\n secondary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-brand-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-brand-primary-100'],\n borderColor: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-400'],\n colorHover: props.active\n ? props.theme.colors['content-brand-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-100']).lighten(2).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-400'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-onmain-secondary']\n : props.theme.colors['bg-onmain-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-onmain-contrast']\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-secondary']).lighten(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(11).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-onmain-contrast']\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n },\n outline: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-brand-primary-500'] : props.theme.colors.transparent,\n borderColor: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor)\n : props.theme.colors['content-oncolor-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active ? props.theme.colors.transparent : props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-onmain-contrast'] : props.theme.colors.transparent,\n borderColor: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-contrast']).lighten(11).toString() as CSSColor)\n : props.theme.colors['content-oncolor-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active ? props.theme.colors.transparent : props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n },\n },\n contrast: {\n primary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-primary']\n : props.theme.colors['bg-brand-primary-100'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-primary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n },\n secondary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-secondary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorHover: props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-secondary']).setAlpha(0.5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-secondary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorHover: props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-secondary']).setAlpha(0.5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n },\n outline: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-oncolor-primary'] : props.theme.colors.transparent,\n borderColor: props.active ? props.theme.colors.transparent : props.theme.colors['border-oncolor-default'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : props.theme.colors['content-onmain-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-default'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-oncolor-disabled']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-oncolor-primary'] : props.theme.colors.transparent,\n borderColor: props.active ? props.theme.colors.transparent : props.theme.colors['border-oncolor-default'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : props.theme.colors['content-onmain-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-default'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-oncolor-disabled']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n },\n },\n}\n\nexport const Content = styled.span`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n text-align: start;\n`\n\nexport const Root = styled.div.withConfig<StyledChipProps>({\n shouldForwardProp: shouldForwardChipProp,\n})`\n ${(props) => {\n let cursor = 'default'\n\n if (props.as === 'button') cursor = 'pointer'\n if (props.as === 'button' && props.disabled) cursor = 'not-allowed'\n if (props.cursor) cursor = props.cursor\n\n return `\n box-sizing: border-box;\n appearance: none;\n margin: 0;\n display: inline-flex;\n align-items: center;\n border: 1px solid transparent;\n flex-shrink: 0;\n cursor: ${cursor};\n transition-property: background-color;\n transition-duration: 250ms;\n\n & > *:not(:last-child) {\n margin-right: 6px;\n }\n\n & > ${Content}:first-child {\n margin-left: 6px;\n }\n & > ${Content}:last-child {\n margin-right: 6px;\n }\n `\n }}\n\n ${(props) => {\n const schema = props.contrast ? COLOR_SCHEMA.contrast : COLOR_SCHEMA.default\n\n let schemaVariant = schema.primary\n\n if (props.secondary) schemaVariant = schema.secondary\n if (props.outline) schemaVariant = schema.outline\n\n return props.black ? schemaVariant.black : schemaVariant.default\n }}\n\n ${focus}\n ${responsiveSize}\n ${responsiveMargin}\n`\n"],"names":["shouldForwardChipProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","borderColor","colorHover","backgroundColorHover","borderColorHover","colorDisabled","backgroundColorDisabled","borderColorDisabled","COLOR_SCHEMA","default","primary","css","props","active","theme","colors","transparent","tinycolor","lighten","toString","darken","black","secondary","outline","contrast","setAlpha","Content","styled","span","withConfig","displayName","componentId","Root","div","shouldForwardProp","cursor","as","disabled","schema","schemaVariant","focus","responsiveSize","responsiveMargin"],"mappings":"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"}

package/components/Container/Container.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var style=require('./style.js');var require$$0=require('react/jsx-runtime');function Container(e){return require$$0.jsx(style.Root,{...e})}Container.displayName='Container',exports.Container=Container;
+'use strict';var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');function Container(e){return jsxRuntime.jsx(style.Root,{...e})}Container.displayName='Container',exports.Container=Container;
 //# sourceMappingURL=Container.js.map

package/components/ContextMenu/ContextMenu.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var Item=require('./Item.js');var style=require('./style.js');var tooltipStyles=require('./tooltip-styles.js');var require$$0=require('react/jsx-runtime');var ContextMenu_Multilevel=require('../ContextMenu.Multilevel/ContextMenu.Multilevel.js');var Tooltip=require('../Tooltip/Tooltip.js');exports.ContextMenu=class ContextMenu extends React.PureComponent{static Item=Item.ContextMenuItem;static MultiLevel=ContextMenu_Multilevel.ContextMenuMultiLevel;static displayName='ContextMenu';static defaultProps={tooltipProps:{event:'click',placement:'left-start',offset:2,showCloseButton:!1,styles:tooltipStyles.tooltipStyles},hideOverlay:!1};constructor(e){super(e),this.state={isOpen:this.props.isOpen||!1}}getOpen=()=>{const{isOpen:e}=this.props;return e!==void 0?e:this.state.isOpen||!1};openMenu=e=>{this.setState({isOpen:!0});const{onOpen:t}=this.props;t&&t(e)};closeMenu=e=>{this.setState({isOpen:!1});const{onClose:t}=this.props;t&&t(e)};toggleMenu=e=>{const{openMenu:t,closeMenu:s}=this;const o=this.getOpen();return e.persist(),e.preventDefault(),e.stopPropagation(),o?s(e):t(e),!1};render(){const{className:e,tooltipProps:t={},trigger:s,children:o,hideOverlay:i}=this.props;const n=this.getOpen();return o&&(t.content=o),require$$0.jsx(style.Root,{className:e,isOpen:n,onClick:this.toggleMenu,hideOverlay:i,children:require$$0.jsx(Tooltip.Tooltip,{...t,open:n,children:require$$0.jsx("div",{onClick:this.closeMenu,children:s&&React.cloneElement(s,{active:n})})})})}};
+'use strict';var React=require('react');var Item=require('./Item.js');var style=require('./style.js');var tooltipStyles=require('./tooltip-styles.js');var jsxRuntime=require('react/jsx-runtime');var ContextMenu_Multilevel=require('../ContextMenu.Multilevel/ContextMenu.Multilevel.js');var Tooltip=require('../Tooltip/Tooltip.js');exports.ContextMenu=class ContextMenu extends React.PureComponent{static Item=Item.ContextMenuItem;static MultiLevel=ContextMenu_Multilevel.ContextMenuMultiLevel;static displayName='ContextMenu';static defaultProps={tooltipProps:{event:'click',placement:'left-start',offset:2,showCloseButton:!1,styles:tooltipStyles.tooltipStyles},hideOverlay:!1};constructor(e){super(e),this.state={isOpen:this.props.isOpen||!1}}getOpen=()=>{const{isOpen:e}=this.props;return e!==void 0?e:this.state.isOpen||!1};openMenu=e=>{this.setState({isOpen:!0});const{onOpen:t}=this.props;t&&t(e)};closeMenu=e=>{this.setState({isOpen:!1});const{onClose:t}=this.props;t&&t(e)};toggleMenu=e=>{const{openMenu:t,closeMenu:s}=this;const n=this.getOpen();return e.persist(),e.preventDefault(),e.stopPropagation(),n?s(e):t(e),!1};render(){const{className:e,tooltipProps:t={},trigger:s,children:n,hideOverlay:o}=this.props;const i=this.getOpen();return n&&(t.content=n),jsxRuntime.jsx(style.Root,{className:e,isOpen:i,onClick:this.toggleMenu,hideOverlay:o,children:jsxRuntime.jsx(Tooltip.Tooltip,{...t,open:i,children:jsxRuntime.jsx("div",{onClick:this.closeMenu,children:s&&React.cloneElement(s,{active:i})})})})}};
 //# sourceMappingURL=ContextMenu.js.map

package/components/ContextMenu/Item.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Text=require('../Text/Text.js');const disabledHandler=e=>(e.preventDefault(),e.preventDefault(),e.stopPropagation(),!1);function ContextMenuItem({children:e,id:t,content:r,active:s,disabled:i,onClick:n,className:a,style:l}){return require$$0.jsxs(style.RootItem,{style:l,className:a,active:s,disabled:i,onClick:i?disabledHandler:n,"data-id":t,children:[e,require$$0.jsx(Text.Text,{size:"s",lineHeight:"s",color:colors.DefaultColorNames.mineShaft,children:r})]})}ContextMenuItem.displayName='ContextMenu.Item',exports.ContextMenuItem=ContextMenuItem;
+'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Text=require('../Text/Text.js');const disabledHandler=e=>(e.preventDefault(),e.preventDefault(),e.stopPropagation(),!1);function ContextMenuItem({children:e,id:t,content:s,active:n,disabled:r,onClick:i,className:a,style:l}){return jsxRuntime.jsxs(style.RootItem,{style:l,className:a,active:n,disabled:r,onClick:r?disabledHandler:i,"data-id":t,children:[e,jsxRuntime.jsx(Text.Text,{size:"s",lineHeight:"s",color:colors.DefaultColorNames.mineShaft,children:s})]})}ContextMenuItem.displayName='ContextMenu.Item',exports.ContextMenuItem=ContextMenuItem;
 //# sourceMappingURL=Item.js.map

package/components/ContextMenu.Multilevel/ContextMenu.Multilevel.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var ContextMenu=require('../ContextMenu/ContextMenu.js');var Heading=require('./Heading.js');var SubHeading=require('./SubHeading.js');var Controls=require('./Controls.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Spacer=require('../Spacer/Spacer.js');exports.ContextMenuMultiLevel=class ContextMenuMultiLevel extends React.PureComponent{static displayName='ContextMenu.MultiLevel';static defaultProps={config:{}};constructor(e){super(e),this.state={selectedItems:[]}}componentWillUnmount(){clearTimeout(this.resetTimeout)}onSelectItem=e=>{const{id:t,level:n}=e;const{selectedItems:r}=this.state;const i=[...r.slice(0,n),t];this.setState({selectedItems:i}),typeof this.props.onSelectItem=='function'&&this.props.onSelectItem(e,n)};getCurrentConfig=()=>{const{config:e}=this.props;const{selectedItems:t}=this.state;if(!e)return null;if(!t.length)return e;try{return t.reduce(((e,t)=>e.items&&e.items.find((e=>e.id===t))?.config||{}),e)}catch(e){return null}};reset=()=>{this.resetTimeout=setTimeout((()=>this.setState({selectedItems:[]})),200)};itemOnClickHandler=e=>{const t=this.getCurrentConfig();if(!t)throw new Error('Config not found');const{items:n=[]}=t;const{currentTarget:r}=e;const{id:i=null}=r.dataset;if(i===null)throw new Error('Data-id for item not found');const s=n.find((e=>`${e.id}`===i));if(!s)throw new Error('Item not found');(s.config||s.preventClosing)&&(e.preventDefault(),e.stopPropagation()),s.config&&this.onSelectItem(s),typeof s.onClick=='function'&&s.onClick(s)};render(){const{children:e,className:t,tooltipProps:n,isOpen:r,trigger:i,...s}=this.props;const{selectedItems:o}=this.state;const c=this.getCurrentConfig();const{config:l,onSelectItem:u,...a}=s;return require$$0.jsxs(ContextMenu.ContextMenu,{className:t,tooltipProps:n,isOpen:r,onClose:this.reset,trigger:i,...a,children:[e,require$$0.jsxs(require$$0.Fragment,{children:[require$$0.jsx(Spacer.Spacer,{top:9}),c?.heading?require$$0.jsx(Heading.Heading,{content:c.heading}):null,c?.subheading?require$$0.jsx(SubHeading.SubHeading,{content:c.subheading}):null,c?.items?require$$0.jsx(style.MultilevelItems,{children:c.items.map((e=>require$$0.jsx(ContextMenu.ContextMenu.Item,{id:e.id,content:e.content,active:e.level&&Boolean(o[e.level]===e.id)||e.active,onClick:this.itemOnClickHandler},e.id)))}):null,c?.controls?require$$0.jsx(Controls.Controls,{...c.controls}):require$$0.jsx(Spacer.Spacer,{top:9})]})]})}};
+'use strict';var React=require('react');var ContextMenu=require('../ContextMenu/ContextMenu.js');var Heading=require('./Heading.js');var SubHeading=require('./SubHeading.js');var Controls=require('./Controls.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Spacer=require('../Spacer/Spacer.js');exports.ContextMenuMultiLevel=class ContextMenuMultiLevel extends React.PureComponent{static displayName='ContextMenu.MultiLevel';static defaultProps={config:{}};constructor(e){super(e),this.state={selectedItems:[]}}componentWillUnmount(){clearTimeout(this.resetTimeout)}onSelectItem=e=>{const{id:t,level:n}=e;const{selectedItems:s}=this.state;const i=[...s.slice(0,n),t];this.setState({selectedItems:i}),typeof this.props.onSelectItem=='function'&&this.props.onSelectItem(e,n)};getCurrentConfig=()=>{const{config:e}=this.props;const{selectedItems:t}=this.state;if(!e)return null;if(!t.length)return e;try{return t.reduce(((e,t)=>e.items&&e.items.find((e=>e.id===t))?.config||{}),e)}catch(e){return null}};reset=()=>{this.resetTimeout=setTimeout((()=>this.setState({selectedItems:[]})),200)};itemOnClickHandler=e=>{const t=this.getCurrentConfig();if(!t)throw new Error('Config not found');const{items:n=[]}=t;const{currentTarget:s}=e;const{id:i=null}=s.dataset;if(i===null)throw new Error('Data-id for item not found');const o=n.find((e=>`${e.id}`===i));if(!o)throw new Error('Item not found');(o.config||o.preventClosing)&&(e.preventDefault(),e.stopPropagation()),o.config&&this.onSelectItem(o),typeof o.onClick=='function'&&o.onClick(o)};render(){const{children:e,className:t,tooltipProps:n,isOpen:s,trigger:i,...o}=this.props;const{selectedItems:r}=this.state;const c=this.getCurrentConfig();const{config:l,onSelectItem:u,...a}=o;return jsxRuntime.jsxs(ContextMenu.ContextMenu,{className:t,tooltipProps:n,isOpen:s,onClose:this.reset,trigger:i,...a,children:[e,jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(Spacer.Spacer,{top:9}),c?.heading?jsxRuntime.jsx(Heading.Heading,{content:c.heading}):null,c?.subheading?jsxRuntime.jsx(SubHeading.SubHeading,{content:c.subheading}):null,c?.items?jsxRuntime.jsx(style.MultilevelItems,{children:c.items.map((e=>jsxRuntime.jsx(ContextMenu.ContextMenu.Item,{id:e.id,content:e.content,active:e.level&&Boolean(r[e.level]===e.id)||e.active,onClick:this.itemOnClickHandler},e.id)))}):null,c?.controls?jsxRuntime.jsx(Controls.Controls,{...c.controls}):jsxRuntime.jsx(Spacer.Spacer,{top:9})]})]})}};
 //# sourceMappingURL=ContextMenu.Multilevel.js.map

package/components/ContextMenu.Multilevel/Controls.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.Controls=({cancel:e,confirm:r,className:l,style:o})=>require$$0.jsxs(style.ControlsRoot,{className:l,style:o,children:[e?require$$0.jsx(style.ControlsItem,{className:"cancel",role:"button",onClick:e.onClick,children:require$$0.jsx(Text.Text,{size:"m",lineHeight:"s",color:e.color||colors.DefaultColorNames.silver,children:e.content})}):null,r?require$$0.jsx(style.ControlsItem,{className:"confirm",role:"button",onClick:r.onClick,children:require$$0.jsx(Text.Text,{size:"m",lineHeight:"s",color:r.color||colors.DefaultColorNames.accent,children:r.content})}):null]});
+'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.Controls=({cancel:e,confirm:s,className:l,style:t})=>jsxRuntime.jsxs(style.ControlsRoot,{className:l,style:t,children:[e?jsxRuntime.jsx(style.ControlsItem,{className:"cancel",role:"button",onClick:e.onClick,children:jsxRuntime.jsx(Text.Text,{size:"m",lineHeight:"s",color:e.color||colors.DefaultColorNames.silver,children:e.content})}):null,s?jsxRuntime.jsx(style.ControlsItem,{className:"confirm",role:"button",onClick:s.onClick,children:jsxRuntime.jsx(Text.Text,{size:"m",lineHeight:"s",color:s.color||colors.DefaultColorNames.accent,children:s.content})}):null]});
 //# sourceMappingURL=Controls.js.map

package/components/ContextMenu.Multilevel/Heading.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.Heading=({children:e,content:r})=>require$$0.jsxs(style.HeadingRoot,{children:[e,require$$0.jsx(Text.Text,{size:"s",lineHeight:"s",weight:"bold",color:colors.DefaultColorNames.mineShaft,children:r})]});
+'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.Heading=({children:e,content:r})=>jsxRuntime.jsxs(style.HeadingRoot,{children:[e,jsxRuntime.jsx(Text.Text,{size:"s",lineHeight:"s",weight:"bold",color:colors.DefaultColorNames.mineShaft,children:r})]});
 //# sourceMappingURL=Heading.js.map

package/components/ContextMenu.Multilevel/SubHeading.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.SubHeading=({children:e,content:r})=>require$$0.jsxs(style.SubHeadingRoot,{children:[e,require$$0.jsx(Text.Text,{size:"s",lineHeight:"s",color:colors.DefaultColorNames.mineShaft,children:r})]});
+'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.SubHeading=({children:e,content:r})=>jsxRuntime.jsxs(style.SubHeadingRoot,{children:[e,jsxRuntime.jsx(Text.Text,{size:"s",lineHeight:"s",color:colors.DefaultColorNames.mineShaft,children:r})]});
 //# sourceMappingURL=SubHeading.js.map

package/components/Dialog/Dialog.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var ReactModal=require('react-modal');var ramda=require('ramda');var withMergedProps=require('../../hocs/withMergedProps.js');var withTranslation=require('../../hocs/withTranslation.js');var constants$1=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var DialogComponent=require('../DialogComponent/DialogComponent.js');var constants=require('../DialogComponent/constants.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ReactModal__default=_interopDefault(ReactModal);const TranslationDialogComponent=withTranslation.withTranslation(React.forwardRef(((e,o)=>{const{positions:n={},translated:a,...r}=e;const s=a?{}:ramda.mergeDeepLeft(n,constants$1.POSITIONS);return require$$0.jsx(style.PositionedDialogComponent,{...r,positions:s,ref:o})})));const Dialog=Object.assign(withMergedProps.withMergedProps((e=>{const{size:o="s",position:n="center",role:a="dialog",open:r,preventScrollAfterClose:s,closeTimeoutMS:t,portalClassName:l,className:i,bodyOpenClassName:c,htmlOpenClassName:u,overlayClassName:d,shouldCloseOnOverlayClick:p,shouldCloseOnEsc:C,shouldReturnFocusAfterClose:m,parentSelector:g,overlayRef:D,contentRef:f,palette:v,overlayBlur:y,overlayDisabled:M,zIndex:h,onAfterOpen:w,onAfterClose:N,onRequestClose:O,...q}=e;const R=q.draggable||M;return require$$0.jsx(ReactModal__default.default,{isOpen:r,ariaHideApp:!1,preventScroll:s,closeTimeoutMS:t,portalClassName:l,className:i,bodyOpenClassName:c,htmlOpenClassName:u,overlayClassName:d,shouldCloseOnOverlayClick:p,shouldCloseOnEsc:C,shouldReturnFocusAfterClose:m,parentSelector:g,overlayRef:D,contentRef:f,onAfterOpen:w,onAfterClose:N,onRequestClose:O,contentElement:e=>{const{ref:r,className:s,tabIndex:t,onKeyDown:l,onMouseDown:i,onMouseUp:c,onClick:u}=e;return require$$0.jsx(TranslationDialogComponent,{...q,ref:r,size:o,role:a,className:s,tabIndex:t,position:n,"aria-modal":!q.draggable&&!M,palette:{color:v.color,backgroundColor:v.backgroundColor,shadowColor:v.shadowColor},zIndex:R?h:void 0,onKeyDown:e=>{q.onKeyDown&&q.onKeyDown(e),l&&l(e)},onMouseDown:e=>{q.onMouseDown&&q.onMouseDown(e),i&&i(e)},onMouseUp:e=>{q.onMouseUp&&q.onMouseUp(e),c&&c(e)},onClick:e=>{q.onClick&&q.onClick(e),u&&u(e)}})},overlayElement:(e,o)=>{const{ref:n,className:a,onClick:r,onMouseDown:s}=e;return R?o:require$$0.jsx(style.DialogOverlay,{ref:n,className:a,blur:y,palette:{backgroundColor:v.overlayBackgroundColor},zIndex:h,onClick:r,onMouseDown:s,children:o})}})}),{sizes:e=>e.fancy?constants.SIZES_FANCY:constants.SIZES,displayName:"Dialog"}),{Component:DialogComponent.DialogComponent});exports.COMPONENT_NAME="Dialog",exports.Dialog=Dialog;
+'use strict';var React=require('react');var ReactModal=require('react-modal');var ramda=require('ramda');var withMergedProps=require('../../hocs/withMergedProps.js');var withTranslation=require('../../hocs/withTranslation.js');var constants$1=require('./constants.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var DialogComponent=require('../DialogComponent/DialogComponent.js');var constants=require('../DialogComponent/constants.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ReactModal__default=_interopDefault(ReactModal);const TranslationDialogComponent=withTranslation.withTranslation(React.forwardRef(((e,o)=>{const{positions:n={},translated:a,...s}=e;const t=a?{}:ramda.mergeDeepLeft(n,constants$1.POSITIONS);return jsxRuntime.jsx(style.PositionedDialogComponent,{...s,positions:t,ref:o})})));const Dialog=Object.assign(withMergedProps.withMergedProps((e=>{const{size:o="s",position:n="center",role:a="dialog",open:s,preventScrollAfterClose:t,closeTimeoutMS:r,portalClassName:l,className:i,bodyOpenClassName:c,htmlOpenClassName:u,overlayClassName:d,shouldCloseOnOverlayClick:p,shouldCloseOnEsc:C,shouldReturnFocusAfterClose:m,parentSelector:g,overlayRef:D,contentRef:f,palette:v,overlayBlur:y,overlayDisabled:M,zIndex:h,onAfterOpen:w,onAfterClose:N,onRequestClose:R,...O}=e;const j=O.draggable||M;return jsxRuntime.jsx(ReactModal__default.default,{isOpen:s,ariaHideApp:!1,preventScroll:t,closeTimeoutMS:r,portalClassName:l,className:i,bodyOpenClassName:c,htmlOpenClassName:u,overlayClassName:d,shouldCloseOnOverlayClick:p,shouldCloseOnEsc:C,shouldReturnFocusAfterClose:m,parentSelector:g,overlayRef:D,contentRef:f,onAfterOpen:w,onAfterClose:N,onRequestClose:R,contentElement:e=>{const{ref:s,className:t,tabIndex:r,onKeyDown:l,onMouseDown:i,onMouseUp:c,onClick:u}=e;return jsxRuntime.jsx(TranslationDialogComponent,{...O,ref:s,size:o,role:a,className:t,tabIndex:r,position:n,"aria-modal":!O.draggable&&!M,palette:{color:v.color,backgroundColor:v.backgroundColor,shadowColor:v.shadowColor},zIndex:j?h:void 0,onKeyDown:e=>{O.onKeyDown&&O.onKeyDown(e),l&&l(e)},onMouseDown:e=>{O.onMouseDown&&O.onMouseDown(e),i&&i(e)},onMouseUp:e=>{O.onMouseUp&&O.onMouseUp(e),c&&c(e)},onClick:e=>{O.onClick&&O.onClick(e),u&&u(e)}})},overlayElement:(e,o)=>{const{ref:n,className:a,onClick:s,onMouseDown:t}=e;return j?o:jsxRuntime.jsx(style.DialogOverlay,{ref:n,className:a,blur:y,palette:{backgroundColor:v.overlayBackgroundColor},zIndex:h,onClick:s,onMouseDown:t,children:o})}})}),{sizes:e=>e.fancy?constants.SIZES_FANCY:constants.SIZES,displayName:"Dialog"}),{Component:DialogComponent.DialogComponent});exports.COMPONENT_NAME="Dialog",exports.Dialog=Dialog;
 //# sourceMappingURL=Dialog.js.map

package/components/Dialog/Dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport ReactModal from 'react-modal'\nimport { mergeDeepLeft } from 'ramda'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { withTranslation } from 'hocs/withTranslation'\nimport { DialogComponent, SIZES, SIZES_FANCY } from 'components/DialogComponent'\nimport { POSITIONS } from './constants'\nimport * as Styled from './style'\nimport type { DialogProps, TranslationDialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'Dialog'\n\nconst TranslationDialogComponent = withTranslation<HTMLDivElement, TranslationDialogComponentProps>(\n forwardRef((props, ref) => {\n const { positions = {}, translated, ...restProps } = props\n\n const dialogPositions = translated ? {} : mergeDeepLeft(positions, POSITIONS)\n\n return <Styled.PositionedDialogComponent {...restProps} positions={dialogPositions} ref={ref} />\n })\n)\n\n/*\n \n * Компонент поддерживает все атрибуты \\<div\\> ~~элемента и пропсы \"react-modal\" [v3.16.1](https://reactcommunity.org/react-modal).\~~n \n Поддерживаются пропсы определения размеров и позиции в зависимости от ширины вьюпорта.\n \n Получить доступ к компоненту, не подключенному к ~~\"react-modal\",~~ можно через Dialog.Component.\n \n Полный интерфейс Dialog можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dialog/types.ts), интерфейс Dialog.Component [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n \n /\nconst Dialog: React.ForwardRefExoticComponent<DialogProps> & { Component: typeof DialogComponent } = Object.assign(\n withMergedProps<DialogProps, HTMLDivElement>(\n (props) => {\n const {\n size = 's',\n position = 'center',\n role = 'dialog',\n open,\n preventScrollAfterClose,\n closeTimeoutMS,\n portalClassName,\n className,\n bodyOpenClassName,\n htmlOpenClassName,\n overlayClassName,\n shouldCloseOnOverlayClick,\n shouldCloseOnEsc,\n shouldReturnFocusAfterClose,\n parentSelector,\n overlayRef,\n contentRef,\n palette,\n overlayBlur,\n overlayDisabled,\n zIndex,\n onAfterOpen,\n onAfterClose,\n onRequestClose,\n ...dialogProps\n } = props\n\n const overlayElementDisabled = dialogProps.draggable \|\| overlayDisabled\n\n return (\n <ReactModal\n isOpen={open}\n ariaHideApp={false}\n preventScroll={preventScrollAfterClose}\n closeTimeoutMS={closeTimeoutMS}\n portalClassName={portalClassName}\n className={className}\n bodyOpenClassName={bodyOpenClassName}\n htmlOpenClassName={htmlOpenClassName}\n overlayClassName={overlayClassName}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEsc={shouldCloseOnEsc}\n shouldReturnFocusAfterClose={shouldReturnFocusAfterClose}\n parentSelector={parentSelector}\n overlayRef={overlayRef}\n contentRef={contentRef}\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onRequestClose={onRequestClose}\n contentElement={(contentProps) => {\n const { ref, className, tabIndex, onKeyDown, onMouseDown, onMouseUp, onClick } = contentProps\n\n return (\n <TranslationDialogComponent\n {...dialogProps}\n ref={ref}\n size={size}\n role={role}\n className={className}\n tabIndex={tabIndex}\n position={position}\n aria-modal={!dialogProps.draggable && !overlayDisabled}\n palette={{\n color: palette.color,\n backgroundColor: palette.backgroundColor,\n shadowColor: palette.shadowColor,\n }}\n zIndex={overlayElementDisabled ? zIndex : undefined}\n onKeyDown={(evt) => {\n if (dialogProps.onKeyDown) dialogProps.onKeyDown(evt)\n if (onKeyDown) onKeyDown(evt)\n }}\n onMouseDown={(evt) => {\n if (dialogProps.onMouseDown) dialogProps.onMouseDown(evt)\n if (onMouseDown) onMouseDown(evt)\n }}\n onMouseUp={(evt) => {\n if (dialogProps.onMouseUp) dialogProps.onMouseUp(evt)\n if (onMouseUp) onMouseUp(evt)\n }}\n onClick={(evt) => {\n if (dialogProps.onClick) dialogProps.onClick(evt)\n if (onClick) onClick(evt)\n }}\n />\n )\n }}\n overlayElement={(overlayProps, contentElement) => {\n const { ref, className, onClick, onMouseDown } = overlayProps\n\n return overlayElementDisabled ? (\n contentElement\n ) : (\n <Styled.DialogOverlay\n ref={ref}\n className={className}\n blur={overlayBlur}\n palette={{\n backgroundColor: palette.overlayBackgroundColor,\n }}\n zIndex={zIndex}\n onClick={onClick}\n onMouseDown={onMouseDown}\n >\n {contentElement}\n </Styled.DialogOverlay>\n )\n }}\n />\n )\n },\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Component: DialogComponent,\n }\n)\n\nexport { Dialog }\n\nexport { COMPONENT_NAME }\n"],"names":["TranslationDialogComponent","withTranslation","forwardRef","props","ref","positions","translated","restProps","dialogPositions","mergeDeepLeft","POSITIONS","_jsx","Styled","Dialog","Object","assign","withMergedProps","size","position","role","open","preventScrollAfterClose","closeTimeoutMS","portalClassName","className","bodyOpenClassName","htmlOpenClassName","overlayClassName","shouldCloseOnOverlayClick","shouldCloseOnEsc","shouldReturnFocusAfterClose","parentSelector","overlayRef","contentRef","palette","overlayBlur","overlayDisabled","zIndex","onAfterOpen","onAfterClose","onRequestClose","dialogProps","overlayElementDisabled","draggable","ReactModal","isOpen","ariaHideApp","preventScroll","contentElement","contentProps","tabIndex","onKeyDown","onMouseDown","onMouseUp","onClick","color","backgroundColor","shadowColor","undefined","evt","overlayElement","overlayProps","jsx","blur","overlayBackgroundColor","children","sizes","fancy","SIZES_FANCY","SIZES","displayName","Component","DialogComponent"],"mappings":"4kBAYA,MAAMA,2BAA6BC,gBAAAA,gBACjCC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,UAAEA,EAAY,CAAE,EAAAC,WAAEA,KAAeC,GAAcJ,EAErD,MAAMK,EAAkBF,EAAa,CAAA,EAAKG,MAAAA,cAAcJ,EAAWK,YAAAA,WAEnE,OAAOC,WAAAA,IAACC,MAAAA,0BAAgC,IAAKL,EAAWF,UAAWG,EAAiBJ,IAAKA,GAAO,~~KAe9FS~~,MAAAA,OAA+FC,OAAOC,OAC1GC,gBAAAA,iBACGb,IACC,MAAMc,KACJA,EAAO,IAAGC,SACVA,EAAW,SAAQC,KACnBA,EAAO,SAAQC,KACfA,EAAIC,wBACJA,EAAuBC,eACvBA,EAAcC,gBACdA,EAAeC,UACfA,EAASC,kBACTA,EAAiBC,kBACjBA,EAAiBC,iBACjBA,EAAgBC,0BAChBA,EAAyBC,iBACzBA,EAAgBC,4BAChBA,EAA2BC,eAC3BA,EAAcC,WACdA,EAAUC,WACVA,EAAUC,QACVA,EAAOC,YACPA,EAAWC,gBACXA,EAAeC,OACfA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,eACZA,KACGC,GACDtC,EAEJ,MAAMuC,EAAyBD,EAAYE,WAAaP,EAExD,OACEzB,WAAAA,IAACiC,oBAAAA,QAAU,CACTC,OAAQzB,EACR0B,aAAa,EACbC,cAAe1B,EACfC,eAAgBA,EAChBC,gBAAiBA,EACjBC,UAAWA,EACXC,kBAAmBA,EACnBC,kBAAmBA,EACnBC,iBAAkBA,EAClBC,0BAA2BA,EAC3BC,iBAAkBA,EAClBC,4BAA6BA,EAC7BC,eAAgBA,EAChBC,WAAYA,EACZC,WAAYA,EACZK,YAAaA,EACbC,aAAcA,EACdC,eAAgBA,EAChBQ,eAAiBC,IACf,MAAM7C,IAAEA,EAAGoB,UAAEA,EAAS0B,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,UAAEA,EAASC,QAAEA,GAAYL,EAEjF,OACEtC,WAAAA,IAACX,2BAA0B,IACrByC,EACJrC,IAAKA,EACLa,KAAMA,EACNE,KAAMA,EACNK,UAAWA,EACX0B,SAAUA,EACVhC,SAAUA,EACV,cAAauB,EAAYE,YAAcP,EACvCF,QAAS,CACPqB,MAAOrB,EAAQqB,MACfC,gBAAiBtB,EAAQsB,gBACzBC,YAAavB,EAAQuB,aAEvBpB,OAAQK,EAAyBL,OAASqB,EAC1CP,UAAYQ,IACNlB,EAAYU,WAAWV,EAAYU,UAAUQ,GAC7CR,GAAWA,EAAUQ,EAAI,EAE/BP,YAAcO,IACRlB,EAAYW,aAAaX,EAAYW,YAAYO,GACjDP,GAAaA,EAAYO,EAAI,EAEnCN,UAAYM,IACNlB,EAAYY,WAAWZ,EAAYY,UAAUM,GAC7CN,GAAWA,EAAUM,EAAI,EAE/BL,QAAUK,IACJlB,EAAYa,SAASb,EAAYa,QAAQK,GACzCL,GAASA,EAAQK,EAAI,GAE3B,EAGNC,eAAgBA,CAACC,EAAcb,KAC7B,MAAM5C,IAAEA,EAAGoB,UAAEA,EAAS8B,QAAEA,EAAOF,YAAEA,GAAgBS,EAEjD,OAAOnB,EACLM,EAEArC,WAAAmD,IAAClD,oBAAoB,CACnBR,IAAKA,EACLoB,UAAWA,EACXuC,KAAM5B,EACND,QAAS,CACPsB,gBAAiBtB,EAAQ8B,wBAE3B3B,OAAQA,EACRiB,QAASA,EACTF,YAAaA,EAAYa,SAExBjB,GAEJ,GAEH,GAGN,CACEkB,MAAQ/D,GAAWA,EAAMgE,MAAQC,UAAWA,YAAGC,UAAMA,MACrDC,~~YA5IiB~~,~~WA+IrB~~,CACEC,UAAWC,gBAAAA,~~yCAhJQ~~"}
1	+ {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport ReactModal from 'react-modal'\nimport { mergeDeepLeft } from 'ramda'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { withTranslation } from 'hocs/withTranslation'\nimport { DialogComponent, SIZES, SIZES_FANCY } from 'components/DialogComponent'\nimport { POSITIONS } from './constants'\nimport * as Styled from './style'\nimport type { DialogProps, TranslationDialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'Dialog'\n\nconst TranslationDialogComponent = withTranslation<HTMLDivElement, TranslationDialogComponentProps>(\n forwardRef((props, ref) => {\n const { positions = {}, translated, ...restProps } = props\n\n const dialogPositions = translated ? {} : mergeDeepLeft(positions, POSITIONS)\n\n return <Styled.PositionedDialogComponent {...restProps} positions={dialogPositions} ref={ref} />\n })\n)\n\n/*\n \n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n \n Поддерживаются пропсы определения размеров и позиции в зависимости от ширины вьюпорта.\n \n Компонент основан на [\"react-modal\"](https://www.npmjs.com/package/react-modal).\n \n Получить доступ к компоненту, не подключенному к библиотеке, можно через Dialog.Component.\n \n Полный интерфейс Dialog можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dialog/types.ts), интерфейс Dialog.Component [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n \n /\nconst Dialog: React.ForwardRefExoticComponent<DialogProps> & { Component: typeof DialogComponent } = Object.assign(\n withMergedProps<DialogProps, HTMLDivElement>(\n (props) => {\n const {\n size = 's',\n position = 'center',\n role = 'dialog',\n open,\n preventScrollAfterClose,\n closeTimeoutMS,\n portalClassName,\n className,\n bodyOpenClassName,\n htmlOpenClassName,\n overlayClassName,\n shouldCloseOnOverlayClick,\n shouldCloseOnEsc,\n shouldReturnFocusAfterClose,\n parentSelector,\n overlayRef,\n contentRef,\n palette,\n overlayBlur,\n overlayDisabled,\n zIndex,\n onAfterOpen,\n onAfterClose,\n onRequestClose,\n ...dialogProps\n } = props\n\n const overlayElementDisabled = dialogProps.draggable \|\| overlayDisabled\n\n return (\n <ReactModal\n isOpen={open}\n ariaHideApp={false}\n preventScroll={preventScrollAfterClose}\n closeTimeoutMS={closeTimeoutMS}\n portalClassName={portalClassName}\n className={className}\n bodyOpenClassName={bodyOpenClassName}\n htmlOpenClassName={htmlOpenClassName}\n overlayClassName={overlayClassName}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEsc={shouldCloseOnEsc}\n shouldReturnFocusAfterClose={shouldReturnFocusAfterClose}\n parentSelector={parentSelector}\n overlayRef={overlayRef}\n contentRef={contentRef}\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onRequestClose={onRequestClose}\n contentElement={(contentProps) => {\n const { ref, className, tabIndex, onKeyDown, onMouseDown, onMouseUp, onClick } = contentProps\n\n return (\n <TranslationDialogComponent\n {...dialogProps}\n ref={ref}\n size={size}\n role={role}\n className={className}\n tabIndex={tabIndex}\n position={position}\n aria-modal={!dialogProps.draggable && !overlayDisabled}\n palette={{\n color: palette.color,\n backgroundColor: palette.backgroundColor,\n shadowColor: palette.shadowColor,\n }}\n zIndex={overlayElementDisabled ? zIndex : undefined}\n onKeyDown={(evt) => {\n if (dialogProps.onKeyDown) dialogProps.onKeyDown(evt)\n if (onKeyDown) onKeyDown(evt)\n }}\n onMouseDown={(evt) => {\n if (dialogProps.onMouseDown) dialogProps.onMouseDown(evt)\n if (onMouseDown) onMouseDown(evt)\n }}\n onMouseUp={(evt) => {\n if (dialogProps.onMouseUp) dialogProps.onMouseUp(evt)\n if (onMouseUp) onMouseUp(evt)\n }}\n onClick={(evt) => {\n if (dialogProps.onClick) dialogProps.onClick(evt)\n if (onClick) onClick(evt)\n }}\n />\n )\n }}\n overlayElement={(overlayProps, contentElement) => {\n const { ref, className, onClick, onMouseDown } = overlayProps\n\n return overlayElementDisabled ? (\n contentElement\n ) : (\n <Styled.DialogOverlay\n ref={ref}\n className={className}\n blur={overlayBlur}\n palette={{\n backgroundColor: palette.overlayBackgroundColor,\n }}\n zIndex={zIndex}\n onClick={onClick}\n onMouseDown={onMouseDown}\n >\n {contentElement}\n </Styled.DialogOverlay>\n )\n }}\n />\n )\n },\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Component: DialogComponent,\n }\n)\n\nexport { Dialog }\n\nexport { COMPONENT_NAME }\n"],"names":["TranslationDialogComponent","withTranslation","forwardRef","props","ref","positions","translated","restProps","dialogPositions","mergeDeepLeft","POSITIONS","_jsx","Styled","Dialog","Object","assign","withMergedProps","size","position","role","open","preventScrollAfterClose","closeTimeoutMS","portalClassName","className","bodyOpenClassName","htmlOpenClassName","overlayClassName","shouldCloseOnOverlayClick","shouldCloseOnEsc","shouldReturnFocusAfterClose","parentSelector","overlayRef","contentRef","palette","overlayBlur","overlayDisabled","zIndex","onAfterOpen","onAfterClose","onRequestClose","dialogProps","overlayElementDisabled","draggable","ReactModal","isOpen","ariaHideApp","preventScroll","contentElement","contentProps","tabIndex","onKeyDown","onMouseDown","onMouseUp","onClick","color","backgroundColor","shadowColor","undefined","evt","overlayElement","overlayProps","jsx","blur","overlayBackgroundColor","children","sizes","fancy","SIZES_FANCY","SIZES","displayName","Component","DialogComponent"],"mappings":"4kBAYA,MAAMA,2BAA6BC,gBAAAA,gBACjCC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,UAAEA,EAAY,CAAE,EAAAC,WAAEA,KAAeC,GAAcJ,EAErD,MAAMK,EAAkBF,EAAa,CAAA,EAAKG,MAAAA,cAAcJ,EAAWK,YAAAA,WAEnE,OAAOC,WAAAA,IAACC,MAAAA,0BAAgC,IAAKL,EAAWF,UAAWG,EAAiBJ,IAAKA,GAAO,KAiB9FS,MAAAA,OAA+FC,OAAOC,OAC1GC,gBAAAA,iBACGb,IACC,MAAMc,KACJA,EAAO,IAAGC,SACVA,EAAW,SAAQC,KACnBA,EAAO,SAAQC,KACfA,EAAIC,wBACJA,EAAuBC,eACvBA,EAAcC,gBACdA,EAAeC,UACfA,EAASC,kBACTA,EAAiBC,kBACjBA,EAAiBC,iBACjBA,EAAgBC,0BAChBA,EAAyBC,iBACzBA,EAAgBC,4BAChBA,EAA2BC,eAC3BA,EAAcC,WACdA,EAAUC,WACVA,EAAUC,QACVA,EAAOC,YACPA,EAAWC,gBACXA,EAAeC,OACfA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,eACZA,KACGC,GACDtC,EAEJ,MAAMuC,EAAyBD,EAAYE,WAAaP,EAExD,OACEzB,WAAAA,IAACiC,oBAAAA,QAAU,CACTC,OAAQzB,EACR0B,aAAa,EACbC,cAAe1B,EACfC,eAAgBA,EAChBC,gBAAiBA,EACjBC,UAAWA,EACXC,kBAAmBA,EACnBC,kBAAmBA,EACnBC,iBAAkBA,EAClBC,0BAA2BA,EAC3BC,iBAAkBA,EAClBC,4BAA6BA,EAC7BC,eAAgBA,EAChBC,WAAYA,EACZC,WAAYA,EACZK,YAAaA,EACbC,aAAcA,EACdC,eAAgBA,EAChBQ,eAAiBC,IACf,MAAM7C,IAAEA,EAAGoB,UAAEA,EAAS0B,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,UAAEA,EAASC,QAAEA,GAAYL,EAEjF,OACEtC,WAAAA,IAACX,2BAA0B,IACrByC,EACJrC,IAAKA,EACLa,KAAMA,EACNE,KAAMA,EACNK,UAAWA,EACX0B,SAAUA,EACVhC,SAAUA,EACV,cAAauB,EAAYE,YAAcP,EACvCF,QAAS,CACPqB,MAAOrB,EAAQqB,MACfC,gBAAiBtB,EAAQsB,gBACzBC,YAAavB,EAAQuB,aAEvBpB,OAAQK,EAAyBL,OAASqB,EAC1CP,UAAYQ,IACNlB,EAAYU,WAAWV,EAAYU,UAAUQ,GAC7CR,GAAWA,EAAUQ,EAAI,EAE/BP,YAAcO,IACRlB,EAAYW,aAAaX,EAAYW,YAAYO,GACjDP,GAAaA,EAAYO,EAAI,EAEnCN,UAAYM,IACNlB,EAAYY,WAAWZ,EAAYY,UAAUM,GAC7CN,GAAWA,EAAUM,EAAI,EAE/BL,QAAUK,IACJlB,EAAYa,SAASb,EAAYa,QAAQK,GACzCL,GAASA,EAAQK,EAAI,GAE3B,EAGNC,eAAgBA,CAACC,EAAcb,KAC7B,MAAM5C,IAAEA,EAAGoB,UAAEA,EAAS8B,QAAEA,EAAOF,YAAEA,GAAgBS,EAEjD,OAAOnB,EACLM,EAEArC,WAAAmD,IAAClD,oBAAoB,CACnBR,IAAKA,EACLoB,UAAWA,EACXuC,KAAM5B,EACND,QAAS,CACPsB,gBAAiBtB,EAAQ8B,wBAE3B3B,OAAQA,EACRiB,QAASA,EACTF,YAAaA,EAAYa,SAExBjB,GAEJ,GAEH,GAGN,CACEkB,MAAQ/D,GAAWA,EAAMgE,MAAQC,UAAWA,YAAGC,UAAMA,MACrDC,YA9IiB,WAiJrB,CACEC,UAAWC,gBAAAA,yCAlJQ"}

package/components/Dialog/Dialog.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.mjs","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport ReactModal from 'react-modal'\nimport { mergeDeepLeft } from 'ramda'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { withTranslation } from 'hocs/withTranslation'\nimport { DialogComponent, SIZES, SIZES_FANCY } from 'components/DialogComponent'\nimport { POSITIONS } from './constants'\nimport * as Styled from './style'\nimport type { DialogProps, TranslationDialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'Dialog'\n\nconst TranslationDialogComponent = withTranslation<HTMLDivElement, TranslationDialogComponentProps>(\n forwardRef((props, ref) => {\n const { positions = {}, translated, ...restProps } = props\n\n const dialogPositions = translated ? {} : mergeDeepLeft(positions, POSITIONS)\n\n return <Styled.PositionedDialogComponent {...restProps} positions={dialogPositions} ref={ref} />\n })\n)\n\n/*\n \n * Компонент поддерживает все атрибуты \\<div\\> ~~элемента и пропсы \"react-modal\" [v3.16.1](https://reactcommunity.org/react-modal).\~~n \n Поддерживаются пропсы определения размеров и позиции в зависимости от ширины вьюпорта.\n \n Получить доступ к компоненту, не подключенному к ~~\"react-modal\",~~ можно через Dialog.Component.\n \n Полный интерфейс Dialog можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dialog/types.ts), интерфейс Dialog.Component [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n \n /\nconst Dialog: React.ForwardRefExoticComponent<DialogProps> & { Component: typeof DialogComponent } = Object.assign(\n withMergedProps<DialogProps, HTMLDivElement>(\n (props) => {\n const {\n size = 's',\n position = 'center',\n role = 'dialog',\n open,\n preventScrollAfterClose,\n closeTimeoutMS,\n portalClassName,\n className,\n bodyOpenClassName,\n htmlOpenClassName,\n overlayClassName,\n shouldCloseOnOverlayClick,\n shouldCloseOnEsc,\n shouldReturnFocusAfterClose,\n parentSelector,\n overlayRef,\n contentRef,\n palette,\n overlayBlur,\n overlayDisabled,\n zIndex,\n onAfterOpen,\n onAfterClose,\n onRequestClose,\n ...dialogProps\n } = props\n\n const overlayElementDisabled = dialogProps.draggable \|\| overlayDisabled\n\n return (\n <ReactModal\n isOpen={open}\n ariaHideApp={false}\n preventScroll={preventScrollAfterClose}\n closeTimeoutMS={closeTimeoutMS}\n portalClassName={portalClassName}\n className={className}\n bodyOpenClassName={bodyOpenClassName}\n htmlOpenClassName={htmlOpenClassName}\n overlayClassName={overlayClassName}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEsc={shouldCloseOnEsc}\n shouldReturnFocusAfterClose={shouldReturnFocusAfterClose}\n parentSelector={parentSelector}\n overlayRef={overlayRef}\n contentRef={contentRef}\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onRequestClose={onRequestClose}\n contentElement={(contentProps) => {\n const { ref, className, tabIndex, onKeyDown, onMouseDown, onMouseUp, onClick } = contentProps\n\n return (\n <TranslationDialogComponent\n {...dialogProps}\n ref={ref}\n size={size}\n role={role}\n className={className}\n tabIndex={tabIndex}\n position={position}\n aria-modal={!dialogProps.draggable && !overlayDisabled}\n palette={{\n color: palette.color,\n backgroundColor: palette.backgroundColor,\n shadowColor: palette.shadowColor,\n }}\n zIndex={overlayElementDisabled ? zIndex : undefined}\n onKeyDown={(evt) => {\n if (dialogProps.onKeyDown) dialogProps.onKeyDown(evt)\n if (onKeyDown) onKeyDown(evt)\n }}\n onMouseDown={(evt) => {\n if (dialogProps.onMouseDown) dialogProps.onMouseDown(evt)\n if (onMouseDown) onMouseDown(evt)\n }}\n onMouseUp={(evt) => {\n if (dialogProps.onMouseUp) dialogProps.onMouseUp(evt)\n if (onMouseUp) onMouseUp(evt)\n }}\n onClick={(evt) => {\n if (dialogProps.onClick) dialogProps.onClick(evt)\n if (onClick) onClick(evt)\n }}\n />\n )\n }}\n overlayElement={(overlayProps, contentElement) => {\n const { ref, className, onClick, onMouseDown } = overlayProps\n\n return overlayElementDisabled ? (\n contentElement\n ) : (\n <Styled.DialogOverlay\n ref={ref}\n className={className}\n blur={overlayBlur}\n palette={{\n backgroundColor: palette.overlayBackgroundColor,\n }}\n zIndex={zIndex}\n onClick={onClick}\n onMouseDown={onMouseDown}\n >\n {contentElement}\n </Styled.DialogOverlay>\n )\n }}\n />\n )\n },\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Component: DialogComponent,\n }\n)\n\nexport { Dialog }\n\nexport { COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","TranslationDialogComponent","withTranslation","forwardRef","props","ref","positions","translated","restProps","dialogPositions","mergeDeepLeft","POSITIONS","_jsx","Styled","Dialog","Object","assign","withMergedProps","size","position","role","open","preventScrollAfterClose","closeTimeoutMS","portalClassName","className","bodyOpenClassName","htmlOpenClassName","overlayClassName","shouldCloseOnOverlayClick","shouldCloseOnEsc","shouldReturnFocusAfterClose","parentSelector","overlayRef","contentRef","palette","overlayBlur","overlayDisabled","zIndex","onAfterOpen","onAfterClose","onRequestClose","dialogProps","overlayElementDisabled","draggable","ReactModal","isOpen","ariaHideApp","preventScroll","contentElement","contentProps","tabIndex","onKeyDown","onMouseDown","onMouseUp","onClick","color","backgroundColor","shadowColor","undefined","evt","overlayElement","overlayProps","blur","overlayBackgroundColor","children","sizes","fancy","SIZES_FANCY","SIZES","displayName","Component","DialogComponent"],"mappings":"0eAUMA,MAAAA,eAAiB,SAEvB,MAAMC,2BAA6BC,gBACjCC,YAAW,CAACC,EAAOC,KACjB,MAAMC,UAAEA,EAAY,CAAE,EAAAC,WAAEA,KAAeC,GAAcJ,EAErD,MAAMK,EAAkBF,EAAa,CAAA,EAAKG,cAAcJ,EAAWK,WAEnE,OAAOC,IAACC,0BAAgC,IAAKL,EAAWF,UAAWG,EAAiBJ,IAAKA,GAAO,~~KAe9FS~~,MAAAA,OAA+FC,OAAOC,OAC1GC,iBACGb,IACC,MAAMc,KACJA,EAAO,IAAGC,SACVA,EAAW,SAAQC,KACnBA,EAAO,SAAQC,KACfA,EAAIC,wBACJA,EAAuBC,eACvBA,EAAcC,gBACdA,EAAeC,UACfA,EAASC,kBACTA,EAAiBC,kBACjBA,EAAiBC,iBACjBA,EAAgBC,0BAChBA,EAAyBC,iBACzBA,EAAgBC,4BAChBA,EAA2BC,eAC3BA,EAAcC,WACdA,EAAUC,WACVA,EAAUC,QACVA,EAAOC,YACPA,EAAWC,gBACXA,EAAeC,OACfA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,eACZA,KACGC,GACDtC,EAEJ,MAAMuC,EAAyBD,EAAYE,WAAaP,EAExD,OACEzB,IAACiC,WAAU,CACTC,OAAQzB,EACR0B,aAAa,EACbC,cAAe1B,EACfC,eAAgBA,EAChBC,gBAAiBA,EACjBC,UAAWA,EACXC,kBAAmBA,EACnBC,kBAAmBA,EACnBC,iBAAkBA,EAClBC,0BAA2BA,EAC3BC,iBAAkBA,EAClBC,4BAA6BA,EAC7BC,eAAgBA,EAChBC,WAAYA,EACZC,WAAYA,EACZK,YAAaA,EACbC,aAAcA,EACdC,eAAgBA,EAChBQ,eAAiBC,IACf,MAAM7C,IAAEA,EAAGoB,UAAEA,EAAS0B,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,UAAEA,EAASC,QAAEA,GAAYL,EAEjF,OACEtC,IAACX,2BAA0B,IACrByC,EACJrC,IAAKA,EACLa,KAAMA,EACNE,KAAMA,EACNK,UAAWA,EACX0B,SAAUA,EACVhC,SAAUA,EACV,cAAauB,EAAYE,YAAcP,EACvCF,QAAS,CACPqB,MAAOrB,EAAQqB,MACfC,gBAAiBtB,EAAQsB,gBACzBC,YAAavB,EAAQuB,aAEvBpB,OAAQK,EAAyBL,OAASqB,EAC1CP,UAAYQ,IACNlB,EAAYU,WAAWV,EAAYU,UAAUQ,GAC7CR,GAAWA,EAAUQ,EAAI,EAE/BP,YAAcO,IACRlB,EAAYW,aAAaX,EAAYW,YAAYO,GACjDP,GAAaA,EAAYO,EAAI,EAEnCN,UAAYM,IACNlB,EAAYY,WAAWZ,EAAYY,UAAUM,GAC7CN,GAAWA,EAAUM,EAAI,EAE/BL,QAAUK,IACJlB,EAAYa,SAASb,EAAYa,QAAQK,GACzCL,GAASA,EAAQK,EAAI,GAE3B,EAGNC,eAAgBA,CAACC,EAAcb,KAC7B,MAAM5C,IAAEA,EAAGoB,UAAEA,EAAS8B,QAAEA,EAAOF,YAAEA,GAAgBS,EAEjD,OAAOnB,EACLM,EAEArC,IAACC,cAAoB,CACnBR,IAAKA,EACLoB,UAAWA,EACXsC,KAAM3B,EACND,QAAS,CACPsB,gBAAiBtB,EAAQ6B,wBAE3B1B,OAAQA,EACRiB,QAASA,EACTF,YAAaA,EAAYY,SAExBhB,GAEJ,GAEH,GAGN,CACEiB,MAAQ9D,GAAWA,EAAM+D,MAAQC,YAAcC,MAC/CC,~~YA5IiB~~,~~WA+IrB~~,CACEC,UAAWC"}
1	+ {"version":3,"file":"Dialog.mjs","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport ReactModal from 'react-modal'\nimport { mergeDeepLeft } from 'ramda'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { withTranslation } from 'hocs/withTranslation'\nimport { DialogComponent, SIZES, SIZES_FANCY } from 'components/DialogComponent'\nimport { POSITIONS } from './constants'\nimport * as Styled from './style'\nimport type { DialogProps, TranslationDialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'Dialog'\n\nconst TranslationDialogComponent = withTranslation<HTMLDivElement, TranslationDialogComponentProps>(\n forwardRef((props, ref) => {\n const { positions = {}, translated, ...restProps } = props\n\n const dialogPositions = translated ? {} : mergeDeepLeft(positions, POSITIONS)\n\n return <Styled.PositionedDialogComponent {...restProps} positions={dialogPositions} ref={ref} />\n })\n)\n\n/*\n \n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n \n Поддерживаются пропсы определения размеров и позиции в зависимости от ширины вьюпорта.\n \n Компонент основан на [\"react-modal\"](https://www.npmjs.com/package/react-modal).\n \n Получить доступ к компоненту, не подключенному к библиотеке, можно через Dialog.Component.\n \n Полный интерфейс Dialog можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dialog/types.ts), интерфейс Dialog.Component [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n \n /\nconst Dialog: React.ForwardRefExoticComponent<DialogProps> & { Component: typeof DialogComponent } = Object.assign(\n withMergedProps<DialogProps, HTMLDivElement>(\n (props) => {\n const {\n size = 's',\n position = 'center',\n role = 'dialog',\n open,\n preventScrollAfterClose,\n closeTimeoutMS,\n portalClassName,\n className,\n bodyOpenClassName,\n htmlOpenClassName,\n overlayClassName,\n shouldCloseOnOverlayClick,\n shouldCloseOnEsc,\n shouldReturnFocusAfterClose,\n parentSelector,\n overlayRef,\n contentRef,\n palette,\n overlayBlur,\n overlayDisabled,\n zIndex,\n onAfterOpen,\n onAfterClose,\n onRequestClose,\n ...dialogProps\n } = props\n\n const overlayElementDisabled = dialogProps.draggable \|\| overlayDisabled\n\n return (\n <ReactModal\n isOpen={open}\n ariaHideApp={false}\n preventScroll={preventScrollAfterClose}\n closeTimeoutMS={closeTimeoutMS}\n portalClassName={portalClassName}\n className={className}\n bodyOpenClassName={bodyOpenClassName}\n htmlOpenClassName={htmlOpenClassName}\n overlayClassName={overlayClassName}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEsc={shouldCloseOnEsc}\n shouldReturnFocusAfterClose={shouldReturnFocusAfterClose}\n parentSelector={parentSelector}\n overlayRef={overlayRef}\n contentRef={contentRef}\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onRequestClose={onRequestClose}\n contentElement={(contentProps) => {\n const { ref, className, tabIndex, onKeyDown, onMouseDown, onMouseUp, onClick } = contentProps\n\n return (\n <TranslationDialogComponent\n {...dialogProps}\n ref={ref}\n size={size}\n role={role}\n className={className}\n tabIndex={tabIndex}\n position={position}\n aria-modal={!dialogProps.draggable && !overlayDisabled}\n palette={{\n color: palette.color,\n backgroundColor: palette.backgroundColor,\n shadowColor: palette.shadowColor,\n }}\n zIndex={overlayElementDisabled ? zIndex : undefined}\n onKeyDown={(evt) => {\n if (dialogProps.onKeyDown) dialogProps.onKeyDown(evt)\n if (onKeyDown) onKeyDown(evt)\n }}\n onMouseDown={(evt) => {\n if (dialogProps.onMouseDown) dialogProps.onMouseDown(evt)\n if (onMouseDown) onMouseDown(evt)\n }}\n onMouseUp={(evt) => {\n if (dialogProps.onMouseUp) dialogProps.onMouseUp(evt)\n if (onMouseUp) onMouseUp(evt)\n }}\n onClick={(evt) => {\n if (dialogProps.onClick) dialogProps.onClick(evt)\n if (onClick) onClick(evt)\n }}\n />\n )\n }}\n overlayElement={(overlayProps, contentElement) => {\n const { ref, className, onClick, onMouseDown } = overlayProps\n\n return overlayElementDisabled ? (\n contentElement\n ) : (\n <Styled.DialogOverlay\n ref={ref}\n className={className}\n blur={overlayBlur}\n palette={{\n backgroundColor: palette.overlayBackgroundColor,\n }}\n zIndex={zIndex}\n onClick={onClick}\n onMouseDown={onMouseDown}\n >\n {contentElement}\n </Styled.DialogOverlay>\n )\n }}\n />\n )\n },\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Component: DialogComponent,\n }\n)\n\nexport { Dialog }\n\nexport { COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","TranslationDialogComponent","withTranslation","forwardRef","props","ref","positions","translated","restProps","dialogPositions","mergeDeepLeft","POSITIONS","_jsx","Styled","Dialog","Object","assign","withMergedProps","size","position","role","open","preventScrollAfterClose","closeTimeoutMS","portalClassName","className","bodyOpenClassName","htmlOpenClassName","overlayClassName","shouldCloseOnOverlayClick","shouldCloseOnEsc","shouldReturnFocusAfterClose","parentSelector","overlayRef","contentRef","palette","overlayBlur","overlayDisabled","zIndex","onAfterOpen","onAfterClose","onRequestClose","dialogProps","overlayElementDisabled","draggable","ReactModal","isOpen","ariaHideApp","preventScroll","contentElement","contentProps","tabIndex","onKeyDown","onMouseDown","onMouseUp","onClick","color","backgroundColor","shadowColor","undefined","evt","overlayElement","overlayProps","blur","overlayBackgroundColor","children","sizes","fancy","SIZES_FANCY","SIZES","displayName","Component","DialogComponent"],"mappings":"0eAUMA,MAAAA,eAAiB,SAEvB,MAAMC,2BAA6BC,gBACjCC,YAAW,CAACC,EAAOC,KACjB,MAAMC,UAAEA,EAAY,CAAE,EAAAC,WAAEA,KAAeC,GAAcJ,EAErD,MAAMK,EAAkBF,EAAa,CAAA,EAAKG,cAAcJ,EAAWK,WAEnE,OAAOC,IAACC,0BAAgC,IAAKL,EAAWF,UAAWG,EAAiBJ,IAAKA,GAAO,KAiB9FS,MAAAA,OAA+FC,OAAOC,OAC1GC,iBACGb,IACC,MAAMc,KACJA,EAAO,IAAGC,SACVA,EAAW,SAAQC,KACnBA,EAAO,SAAQC,KACfA,EAAIC,wBACJA,EAAuBC,eACvBA,EAAcC,gBACdA,EAAeC,UACfA,EAASC,kBACTA,EAAiBC,kBACjBA,EAAiBC,iBACjBA,EAAgBC,0BAChBA,EAAyBC,iBACzBA,EAAgBC,4BAChBA,EAA2BC,eAC3BA,EAAcC,WACdA,EAAUC,WACVA,EAAUC,QACVA,EAAOC,YACPA,EAAWC,gBACXA,EAAeC,OACfA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,eACZA,KACGC,GACDtC,EAEJ,MAAMuC,EAAyBD,EAAYE,WAAaP,EAExD,OACEzB,IAACiC,WAAU,CACTC,OAAQzB,EACR0B,aAAa,EACbC,cAAe1B,EACfC,eAAgBA,EAChBC,gBAAiBA,EACjBC,UAAWA,EACXC,kBAAmBA,EACnBC,kBAAmBA,EACnBC,iBAAkBA,EAClBC,0BAA2BA,EAC3BC,iBAAkBA,EAClBC,4BAA6BA,EAC7BC,eAAgBA,EAChBC,WAAYA,EACZC,WAAYA,EACZK,YAAaA,EACbC,aAAcA,EACdC,eAAgBA,EAChBQ,eAAiBC,IACf,MAAM7C,IAAEA,EAAGoB,UAAEA,EAAS0B,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,UAAEA,EAASC,QAAEA,GAAYL,EAEjF,OACEtC,IAACX,2BAA0B,IACrByC,EACJrC,IAAKA,EACLa,KAAMA,EACNE,KAAMA,EACNK,UAAWA,EACX0B,SAAUA,EACVhC,SAAUA,EACV,cAAauB,EAAYE,YAAcP,EACvCF,QAAS,CACPqB,MAAOrB,EAAQqB,MACfC,gBAAiBtB,EAAQsB,gBACzBC,YAAavB,EAAQuB,aAEvBpB,OAAQK,EAAyBL,OAASqB,EAC1CP,UAAYQ,IACNlB,EAAYU,WAAWV,EAAYU,UAAUQ,GAC7CR,GAAWA,EAAUQ,EAAI,EAE/BP,YAAcO,IACRlB,EAAYW,aAAaX,EAAYW,YAAYO,GACjDP,GAAaA,EAAYO,EAAI,EAEnCN,UAAYM,IACNlB,EAAYY,WAAWZ,EAAYY,UAAUM,GAC7CN,GAAWA,EAAUM,EAAI,EAE/BL,QAAUK,IACJlB,EAAYa,SAASb,EAAYa,QAAQK,GACzCL,GAASA,EAAQK,EAAI,GAE3B,EAGNC,eAAgBA,CAACC,EAAcb,KAC7B,MAAM5C,IAAEA,EAAGoB,UAAEA,EAAS8B,QAAEA,EAAOF,YAAEA,GAAgBS,EAEjD,OAAOnB,EACLM,EAEArC,IAACC,cAAoB,CACnBR,IAAKA,EACLoB,UAAWA,EACXsC,KAAM3B,EACND,QAAS,CACPsB,gBAAiBtB,EAAQ6B,wBAE3B1B,OAAQA,EACRiB,QAASA,EACTF,YAAaA,EAAYY,SAExBhB,GAEJ,GAEH,GAGN,CACEiB,MAAQ9D,GAAWA,EAAM+D,MAAQC,YAAcC,MAC/CC,YA9IiB,WAiJrB,CACEC,UAAWC"}

package/components/DialogComponent/DialogComponent.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var ResizeObserver=require('../../external/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.js');var withMergedProps=require('../../hocs/withMergedProps.js');var constants$1=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var DialogContainer=require('./DialogContainer.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var utils=require('./utils.js');var constants=require('./constants.js');var require$$0=require('react/jsx-runtime');var Visibility=require('../Visibility/Visibility.js');var Spacer=require('../Spacer/Spacer.js');var Icon=require('../Icon/Icon.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');var Button=require('../Button/Button.js');const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:i="s",iconButtonProps:t={},captionProps:s={},titleProps:n={},subtitleProps:o={},draggingIconProps:a={},imgSrc:l={},skeletonProps:c={},fancy:d,floats:u,children:$,caption:y,title:g,subtitle:x,controls:p,imgLandscapePositionRight:S,imgPortraitPositionBottom:q,className:j,backgroundClassName:h,scrollFadingDisabled:b,draggable:I,loading:m,sizeXXS:z,sizeXS:T,sizeS:v,sizeM:k,sizeL:P,sizeXL:B,onGrab:w,onNudge:C,...R}=e;const D={size:i,sizeXXS:z,sizeXS:T,sizeS:v,sizeM:k,sizeL:P,sizeXL:B};const E=utils.getCommonSizeProps(D);const f=d?j:dom.concatClassNames(j,h);const[M,L]=React.useState(null);const[V,_]=React.useState(null);const A=React.useRef(null);const N=React.useCallback((e=>{e.scrollHeight===e.clientHeight?(L(null),_(null)):(L(e.scrollTop<=0),_(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return React.useLayoutEffect((()=>{const e=A.current;return!b&&e&&(e[resizeHandlerSymbol]=N,resizeObserver.observe(e)),()=>{e&&resizeObserver.unobserve(e)}}),[N,b]),require$$0.jsxs(style.Root,{...R,...D,className:f,fancy:d,ref:r,children:[u&&u(E),d&&require$$0.jsx(style.FancyBackground,{className:h}),d&&t.onClick&&require$$0.jsx(style.PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...t}),(I||l.portrait&&!q||d)&&require$$0.jsxs(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_PORTRAIT,children:[d&&require$$0.jsx(Spacer.Spacer,{top:96}),I&&require$$0.jsx(style.DraggingHandle,{onPointerDown:w,children:require$$0.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:C,children:require$$0.jsx(Icon.Icon,{icon:require$$0.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!q&&require$$0.jsx(style.MediaPortraitContainer,{top:!d,children:require$$0.jsxs(style.MediaPortrait,{children:[require$$0.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.portrait})]})})]}),l.landscape&&!S&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:require$$0.jsxs(style.MediaLandscape,{children:[require$$0.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.landscape})]})}),!d&&t.onClick&&require$$0.jsx(style.PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...t}),require$$0.jsxs(DialogContainer.DialogContainer,{...D,fancy:d,children:[I&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE,children:require$$0.jsx(style.DraggingHandle,{onPointerDown:w,children:require$$0.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:C,children:require$$0.jsx(Icon.Icon,{icon:require$$0.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})})}),!b&&require$$0.jsx(style.Fading,{visible:M===!1}),require$$0.jsx(style.ScrollableContent,{ref:A,tabIndex:0,onScroll:e=>{b||N(e.currentTarget)},onKeyDown:e=>{constants$1.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants$1.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:require$$0.jsxs(require$$0.Fragment,m?{children:[require$$0.jsx(Skeleton.Skeleton,{children:require$$0.jsx(Text.Text,{appearance:"heading",marginBottom:"1.5em",sizes:constants.SIZES_TITLE,...E,...n})}),require$$0.jsx(Skeleton.Skeleton,{width:"90%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,...E,...o})}),require$$0.jsx(Skeleton.Skeleton,{width:"70%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,...E,...o})}),require$$0.jsx(Skeleton.Skeleton,{width:"50%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,...E,...o})})]}:{children:[y&&require$$0.jsx(Text.Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_CAPTION,...E,...s,children:y}),g&&require$$0.jsx(Text.Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:constants.SIZES_TITLE,...E,...n,children:g}),x&&require$$0.jsx(Text.Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,...E,...o,children:x}),typeof $=='function'?$(E):$]})}),!b&&require$$0.jsx(style.Fading,{visible:V===!1,after:!0}),p&&require$$0.jsx(style.Controls,{children:m?require$$0.jsx(Skeleton.Skeleton,{borderRadius:48,...c,children:require$$0.jsx(Button.Button,{preset:"brand",...E})}):p(E)})]}),l.landscape&&S&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:require$$0.jsxs(style.MediaLandscape,{right:!0,children:[require$$0.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.landscape})]})}),l.portrait&&q&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_PORTRAIT,children:require$$0.jsx(style.MediaPortraitContainer,{bottom:!0,children:require$$0.jsxs(style.MediaPortrait,{children:[require$$0.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?constants.SIZES_FANCY:constants.SIZES,displayName:'DialogComponent'});exports.SIZES=constants.SIZES,exports.SIZES_FANCY=constants.SIZES_FANCY,exports.DialogComponent=DialogComponent;
+'use strict';var React=require('react');var ResizeObserver=require('resize-observer-polyfill');var withMergedProps=require('../../hocs/withMergedProps.js');var constants$1=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var DialogContainer=require('./DialogContainer.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var utils=require('./utils.js');var constants=require('./constants.js');var jsxRuntime=require('react/jsx-runtime');var Visibility=require('../Visibility/Visibility.js');var Spacer=require('../Spacer/Spacer.js');var Icon=require('../Icon/Icon.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');var Button=require('../Button/Button.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ResizeObserver__default=_interopDefault(ResizeObserver);const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver__default.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:s="s",iconButtonProps:i={},captionProps:n={},titleProps:r={},subtitleProps:o={},draggingIconProps:a={},imgSrc:l={},skeletonProps:c={},fancy:x,floats:d,children:u,caption:j,title:m,subtitle:R,controls:g,imgLandscapePositionRight:y,imgPortraitPositionBottom:p,className:S,backgroundClassName:h,scrollFadingDisabled:b,draggable:I,loading:z,sizeXXS:T,sizeXS:v,sizeS:k,sizeM:P,sizeL:B,sizeXL:f,onGrab:D,onNudge:w,...C}=e;const E={size:s,sizeXXS:T,sizeXS:v,sizeS:k,sizeM:P,sizeL:B,sizeXL:f};const _=utils.getCommonSizeProps(E);const M=x?S:dom.concatClassNames(S,h);const[L,V]=React.useState(null);const[q,A]=React.useState(null);const N=React.useRef(null);const Z=React.useCallback((e=>{e.scrollHeight===e.clientHeight?(V(null),A(null)):(V(e.scrollTop<=0),A(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return React.useLayoutEffect((()=>{const e=N.current;return!b&&e&&(e[resizeHandlerSymbol]=Z,resizeObserver.observe(e)),()=>{e&&resizeObserver.unobserve(e)}}),[Z,b]),jsxRuntime.jsxs(style.Root,{...C,...E,className:M,fancy:x,ref:t,children:[d&&d(_),x&&jsxRuntime.jsx(style.FancyBackground,{className:h}),x&&i.onClick&&jsxRuntime.jsx(style.PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...i}),(I||l.portrait&&!p||x)&&jsxRuntime.jsxs(Visibility.Visibility,{...E,sizes:constants.VISIBILITY_PORTRAIT,children:[x&&jsxRuntime.jsx(Spacer.Spacer,{top:96}),I&&jsxRuntime.jsx(style.DraggingHandle,{onPointerDown:D,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!p&&jsxRuntime.jsx(style.MediaPortraitContainer,{top:!x,children:jsxRuntime.jsxs(style.MediaPortrait,{children:[jsxRuntime.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsxRuntime.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsxRuntime.jsx(style.Media,{src:l.portrait})]})})]}),l.landscape&&!y&&jsxRuntime.jsx(Visibility.Visibility,{...E,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:jsxRuntime.jsxs(style.MediaLandscape,{children:[jsxRuntime.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsxRuntime.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsxRuntime.jsx(style.Media,{src:l.landscape})]})}),!x&&i.onClick&&jsxRuntime.jsx(style.PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...i}),jsxRuntime.jsxs(DialogContainer.DialogContainer,{...E,fancy:x,children:[I&&jsxRuntime.jsx(Visibility.Visibility,{...E,sizes:constants.VISIBILITY_LANDSCAPE,children:jsxRuntime.jsx(style.DraggingHandle,{onPointerDown:D,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})})}),!b&&jsxRuntime.jsx(style.Fading,{visible:L===!1}),jsxRuntime.jsx(style.ScrollableContent,{ref:N,tabIndex:0,onScroll:e=>{b||Z(e.currentTarget)},onKeyDown:e=>{constants$1.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants$1.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxRuntime.jsxs(jsxRuntime.Fragment,z?{children:[jsxRuntime.jsx(Skeleton.Skeleton,{children:jsxRuntime.jsx(Text.Text,{appearance:"heading",marginBottom:"1.5em",sizes:constants.SIZES_TITLE,..._,...r})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"90%",children:jsxRuntime.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,..._,...o})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"70%",children:jsxRuntime.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,..._,...o})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"50%",children:jsxRuntime.jsx(Text.Text,{appearance:"body",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,..._,...o})})]}:{children:[j&&jsxRuntime.jsx(Text.Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_CAPTION,..._,...n,children:j}),m&&jsxRuntime.jsx(Text.Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:constants.SIZES_TITLE,..._,...r,children:m}),R&&jsxRuntime.jsx(Text.Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,..._,...o,children:R}),typeof u=='function'?u(_):u]})}),!b&&jsxRuntime.jsx(style.Fading,{visible:q===!1,after:!0}),g&&jsxRuntime.jsx(style.Controls,{children:z?jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:48,...c,children:jsxRuntime.jsx(Button.Button,{preset:"brand",..._})}):g(_)})]}),l.landscape&&y&&jsxRuntime.jsx(Visibility.Visibility,{...E,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:jsxRuntime.jsxs(style.MediaLandscape,{right:!0,children:[jsxRuntime.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsxRuntime.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsxRuntime.jsx(style.Media,{src:l.landscape})]})}),l.portrait&&p&&jsxRuntime.jsx(Visibility.Visibility,{...E,sizes:constants.VISIBILITY_PORTRAIT,children:jsxRuntime.jsx(style.MediaPortraitContainer,{bottom:!0,children:jsxRuntime.jsxs(style.MediaPortrait,{children:[jsxRuntime.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsxRuntime.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsxRuntime.jsx(style.Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?constants.SIZES_FANCY:constants.SIZES,displayName:'DialogComponent'});exports.SIZES=constants.SIZES,exports.SIZES_FANCY=constants.SIZES_FANCY,exports.DialogComponent=DialogComponent;
 //# sourceMappingURL=DialogComponent.js.map

package/components/DialogComponent/DialogComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Visibility } from 'components/Visibility'\nimport { Skeleton } from 'components/Skeleton'\nimport { Button } from 'components/Button'\nimport { Spacer } from 'components/Spacer'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport { DialogContainer } from './DialogContainer'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport { getCommonSizeProps } from './utils'\nimport {\n SIZES,\n SIZES_FANCY,\n SIZES_CAPTION,\n SIZES_TITLE,\n SIZES_SUBTITLE,\n VISIBILITY_PORTRAIT,\n VISIBILITY_LANDSCAPE,\n VISIBILITY_LANDSCAPE_MEDIA,\n} from './constants'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n entry.target[resizeHandlerSymbol](entry.target)\n }\n })\n})\n\n/*\n \n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n \n Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n \n Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n \n Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n */\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n DialogComponentProps,\n HTMLDivElement\n>(\n forwardRef((props, ref) => {\n const {\n size = 's',\n iconButtonProps = {},\n captionProps = {},\n titleProps = {},\n subtitleProps = {},\n draggingIconProps = {},\n imgSrc = {},\n skeletonProps = {},\n fancy,\n floats,\n children,\n caption,\n title,\n subtitle,\n controls,\n imgLandscapePositionRight,\n imgPortraitPositionBottom,\n className,\n backgroundClassName,\n scrollFadingDisabled,\n draggable,\n loading,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n onGrab,\n onNudge,\n ...restProps\n } = props\n\n const dialogSizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const sizeProps = getCommonSizeProps(dialogSizeProps)\n\n const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n const scrollable = useRef<HTMLDivElement \| null>(null)\n\n const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n if (e.scrollHeight === e.clientHeight) {\n setScrollTop(null)\n setScrollBottom(null)\n } else {\n setScrollTop(e.scrollTop <= 0)\n setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n }\n }, [])\n\n useLayoutEffect(() => {\n const observerTarget = scrollable.current\n\n if (!scrollFadingDisabled && observerTarget) {\n observerTarget[resizeHandlerSymbol] = handleScrollThresholds\n resizeObserver.observe(observerTarget)\n }\n\n return () => {\n if (observerTarget) {\n resizeObserver.unobserve(observerTarget)\n }\n }\n }, [handleScrollThresholds, scrollFadingDisabled])\n\n return (\n <Styled.Root {...restProps} {...dialogSizeProps} className={rootClassName} fancy={fancy} ref={ref}>\n {floats && floats(sizeProps)}\n {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n {fancy && iconButtonProps.onClick && (\n <Styled.PositionedIconButton\n secondary\n size='xxl'\n icon='close'\n inset={{ top: 0, right: 0 }}\n {...iconButtonProps}\n />\n )}\n {(draggable \|\| (imgSrc.portrait && !imgPortraitPositionBottom) \|\| fancy) && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n {fancy && <Spacer top={96} />}\n {draggable && (\n <Styled.DraggingHandle onPointerDown={onGrab}>\n <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n </Styled.DraggingIconContainer>\n </Styled.DraggingHandle>\n )}\n {imgSrc.portrait && !imgPortraitPositionBottom && (\n <Styled.MediaPortraitContainer top={!fancy}>\n <Styled.MediaPortrait>\n <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.portrait} />\n )}\n </Styled.MediaPortrait>\n </Styled.MediaPortraitContainer>\n )}\n </Visibility>\n )}\n {imgSrc.landscape && !imgLandscapePositionRight && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n <Styled.MediaLandscape>\n <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.landscape} />\n )}\n </Styled.MediaLandscape>\n </Visibility>\n )}\n {!fancy && iconButtonProps.onClick && (\n <Styled.PositionedIconButton size='l' icon='close' inset={{ top: 8, right: 8 }} {...iconButtonProps} />\n )}\n <DialogContainer {...dialogSizeProps} fancy={fancy}>\n {draggable && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE}>\n <Styled.DraggingHandle onPointerDown={onGrab}>\n <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n </Styled.DraggingIconContainer>\n </Styled.DraggingHandle>\n </Visibility>\n )}\n {!scrollFadingDisabled && <Styled.Fading visible={scrollTop === false} />}\n <Styled.ScrollableContent\n ref={scrollable}\n tabIndex={0}\n onScroll={(evt) => {\n if (!scrollFadingDisabled) {\n handleScrollThresholds(evt.currentTarget)\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.ArrowUp.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, -13)\n } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, 13)\n }\n }}\n >\n {loading ? (\n <>\n <Skeleton>\n <Text appearance='heading' marginBottom='1.5em' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n </Skeleton>\n <Skeleton width='90%'>\n <Text\n appearance='body'\n marginBottom='0.4em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n <Skeleton width='70%'>\n <Text\n appearance='body'\n marginBottom='0.4em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n <Skeleton width='50%'>\n <Text\n appearance='body'\n marginBottom='0.8em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n </>\n ) : (\n <>\n {caption && (\n <Text\n appearance='body'\n color='content-onmain-tertiary'\n wordBreak='break-word'\n marginBottom='0.8em'\n sizes={SIZES_CAPTION}\n {...sizeProps}\n {...captionProps}\n >\n {caption}\n </Text>\n )}\n {title && (\n <Text\n as='h2'\n appearance='heading'\n color='content-onmain-primary'\n wordBreak='break-word'\n marginBottom='0.5em'\n sizes={SIZES_TITLE}\n {...sizeProps}\n {...titleProps}\n >\n {title}\n </Text>\n )}\n {subtitle && (\n <Text\n as='p'\n appearance='body'\n color='content-onmain-primary'\n wordBreak='break-word'\n marginBottom='0.8em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n >\n {subtitle}\n </Text>\n )}\n {typeof children === 'function' ? children(sizeProps) : children}\n </>\n )}\n </Styled.ScrollableContent>\n {!scrollFadingDisabled && <Styled.Fading visible={scrollBottom === false} after />}\n {controls && (\n <Styled.Controls>\n {loading ? (\n <Skeleton borderRadius={48} {...skeletonProps}>\n <Button preset='brand' {...sizeProps} />\n </Skeleton>\n ) : (\n controls(sizeProps)\n )}\n </Styled.Controls>\n )}\n </DialogContainer>\n {imgSrc.landscape && imgLandscapePositionRight && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n <Styled.MediaLandscape right>\n <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.landscape} />\n )}\n </Styled.MediaLandscape>\n </Visibility>\n )}\n {imgSrc.portrait && imgPortraitPositionBottom && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n <Styled.MediaPortraitContainer bottom>\n <Styled.MediaPortrait>\n <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.portrait} />\n )}\n </Styled.MediaPortrait>\n </Styled.MediaPortraitContainer>\n </Visibility>\n )}\n </Styled.Root>\n )\n }),\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { DialogComponent }\n\nexport { SIZES, SIZES_FANCY }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","iconButtonProps","captionProps","titleProps","subtitleProps","draggingIconProps","imgSrc","skeletonProps","fancy","floats","children","caption","title","subtitle","controls","imgLandscapePositionRight","imgPortraitPositionBottom","className","backgroundClassName","scrollFadingDisabled","draggable","loading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","onGrab","onNudge","restProps","dialogSizeProps","sizeProps","getCommonSizeProps","rootClassName","concatClassNames","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","scrollable","useRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observerTarget","current","observe","unobserve","_jsxs","Styled","_jsx","jsx","onClick","secondary","icon","inset","top","right","portrait","jsxs","Visibility","sizes","VISIBILITY_PORTRAIT","Spacer","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","color","orientation","aspectRatio","width","height","borderRadius","src","landscape","VISIBILITY_LANDSCAPE_MEDIA","DialogContainer","VISIBILITY_LANDSCAPE","visible","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","_Fragment","Skeleton","Text","appearance","marginBottom","SIZES_TITLE","SIZES_SUBTITLE","wordBreak","SIZES_CAPTION","as","after","Button","preset","bottom","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
1	+ {"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Visibility } from 'components/Visibility'\nimport { Skeleton } from 'components/Skeleton'\nimport { Button } from 'components/Button'\nimport { Spacer } from 'components/Spacer'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport { DialogContainer } from './DialogContainer'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport { getCommonSizeProps } from './utils'\nimport {\n SIZES,\n SIZES_FANCY,\n SIZES_CAPTION,\n SIZES_TITLE,\n SIZES_SUBTITLE,\n VISIBILITY_PORTRAIT,\n VISIBILITY_LANDSCAPE,\n VISIBILITY_LANDSCAPE_MEDIA,\n} from './constants'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n entry.target[resizeHandlerSymbol](entry.target)\n }\n })\n})\n\n/*\n \n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n \n Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n \n Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n \n Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n */\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n DialogComponentProps,\n HTMLDivElement\n>(\n forwardRef((props, ref) => {\n const {\n size = 's',\n iconButtonProps = {},\n captionProps = {},\n titleProps = {},\n subtitleProps = {},\n draggingIconProps = {},\n imgSrc = {},\n skeletonProps = {},\n fancy,\n floats,\n children,\n caption,\n title,\n subtitle,\n controls,\n imgLandscapePositionRight,\n imgPortraitPositionBottom,\n className,\n backgroundClassName,\n scrollFadingDisabled,\n draggable,\n loading,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n onGrab,\n onNudge,\n ...restProps\n } = props\n\n const dialogSizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const sizeProps = getCommonSizeProps(dialogSizeProps)\n\n const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n const scrollable = useRef<HTMLDivElement \| null>(null)\n\n const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n if (e.scrollHeight === e.clientHeight) {\n setScrollTop(null)\n setScrollBottom(null)\n } else {\n setScrollTop(e.scrollTop <= 0)\n setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n }\n }, [])\n\n useLayoutEffect(() => {\n const observerTarget = scrollable.current\n\n if (!scrollFadingDisabled && observerTarget) {\n observerTarget[resizeHandlerSymbol] = handleScrollThresholds\n resizeObserver.observe(observerTarget)\n }\n\n return () => {\n if (observerTarget) {\n resizeObserver.unobserve(observerTarget)\n }\n }\n }, [handleScrollThresholds, scrollFadingDisabled])\n\n return (\n <Styled.Root {...restProps} {...dialogSizeProps} className={rootClassName} fancy={fancy} ref={ref}>\n {floats && floats(sizeProps)}\n {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n {fancy && iconButtonProps.onClick && (\n <Styled.PositionedIconButton\n secondary\n size='xxl'\n icon='close'\n inset={{ top: 0, right: 0 }}\n {...iconButtonProps}\n />\n )}\n {(draggable \|\| (imgSrc.portrait && !imgPortraitPositionBottom) \|\| fancy) && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n {fancy && <Spacer top={96} />}\n {draggable && (\n <Styled.DraggingHandle onPointerDown={onGrab}>\n <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n </Styled.DraggingIconContainer>\n </Styled.DraggingHandle>\n )}\n {imgSrc.portrait && !imgPortraitPositionBottom && (\n <Styled.MediaPortraitContainer top={!fancy}>\n <Styled.MediaPortrait>\n <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.portrait} />\n )}\n </Styled.MediaPortrait>\n </Styled.MediaPortraitContainer>\n )}\n </Visibility>\n )}\n {imgSrc.landscape && !imgLandscapePositionRight && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n <Styled.MediaLandscape>\n <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.landscape} />\n )}\n </Styled.MediaLandscape>\n </Visibility>\n )}\n {!fancy && iconButtonProps.onClick && (\n <Styled.PositionedIconButton size='l' icon='close' inset={{ top: 8, right: 8 }} {...iconButtonProps} />\n )}\n <DialogContainer {...dialogSizeProps} fancy={fancy}>\n {draggable && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE}>\n <Styled.DraggingHandle onPointerDown={onGrab}>\n <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n </Styled.DraggingIconContainer>\n </Styled.DraggingHandle>\n </Visibility>\n )}\n {!scrollFadingDisabled && <Styled.Fading visible={scrollTop === false} />}\n <Styled.ScrollableContent\n ref={scrollable}\n tabIndex={0}\n onScroll={(evt) => {\n if (!scrollFadingDisabled) {\n handleScrollThresholds(evt.currentTarget)\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.ArrowUp.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, -13)\n } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, 13)\n }\n }}\n >\n {loading ? (\n <>\n <Skeleton>\n <Text appearance='heading' marginBottom='1.5em' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n </Skeleton>\n <Skeleton width='90%'>\n <Text\n appearance='body'\n marginBottom='0.4em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n <Skeleton width='70%'>\n <Text\n appearance='body'\n marginBottom='0.4em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n <Skeleton width='50%'>\n <Text\n appearance='body'\n marginBottom='0.8em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n </>\n ) : (\n <>\n {caption && (\n <Text\n appearance='body'\n color='content-onmain-tertiary'\n wordBreak='break-word'\n marginBottom='0.8em'\n sizes={SIZES_CAPTION}\n {...sizeProps}\n {...captionProps}\n >\n {caption}\n </Text>\n )}\n {title && (\n <Text\n as='h2'\n appearance='heading'\n color='content-onmain-primary'\n wordBreak='break-word'\n marginBottom='0.5em'\n sizes={SIZES_TITLE}\n {...sizeProps}\n {...titleProps}\n >\n {title}\n </Text>\n )}\n {subtitle && (\n <Text\n as='p'\n appearance='body'\n color='content-onmain-primary'\n wordBreak='break-word'\n marginBottom='0.8em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n >\n {subtitle}\n </Text>\n )}\n {typeof children === 'function' ? children(sizeProps) : children}\n </>\n )}\n </Styled.ScrollableContent>\n {!scrollFadingDisabled && <Styled.Fading visible={scrollBottom === false} after />}\n {controls && (\n <Styled.Controls>\n {loading ? (\n <Skeleton borderRadius={48} {...skeletonProps}>\n <Button preset='brand' {...sizeProps} />\n </Skeleton>\n ) : (\n controls(sizeProps)\n )}\n </Styled.Controls>\n )}\n </DialogContainer>\n {imgSrc.landscape && imgLandscapePositionRight && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n <Styled.MediaLandscape right>\n <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.landscape} />\n )}\n </Styled.MediaLandscape>\n </Visibility>\n )}\n {imgSrc.portrait && imgPortraitPositionBottom && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n <Styled.MediaPortraitContainer bottom>\n <Styled.MediaPortrait>\n <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.portrait} />\n )}\n </Styled.MediaPortrait>\n </Styled.MediaPortraitContainer>\n </Visibility>\n )}\n </Styled.Root>\n )\n }),\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { DialogComponent }\n\nexport { SIZES, SIZES_FANCY }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","iconButtonProps","captionProps","titleProps","subtitleProps","draggingIconProps","imgSrc","skeletonProps","fancy","floats","children","caption","title","subtitle","controls","imgLandscapePositionRight","imgPortraitPositionBottom","className","backgroundClassName","scrollFadingDisabled","draggable","loading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","onGrab","onNudge","restProps","dialogSizeProps","sizeProps","getCommonSizeProps","rootClassName","concatClassNames","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","scrollable","useRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observerTarget","current","observe","unobserve","_jsxs","Styled","_jsx","jsx","onClick","secondary","icon","inset","top","right","portrait","jsxs","Visibility","sizes","VISIBILITY_PORTRAIT","Spacer","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","color","orientation","aspectRatio","width","height","borderRadius","src","landscape","VISIBILITY_LANDSCAPE_MEDIA","DialogContainer","VISIBILITY_LANDSCAPE","visible","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","_Fragment","Skeleton","Text","appearance","marginBottom","SIZES_TITLE","SIZES_SUBTITLE","wordBreak","SIZES_CAPTION","as","after","Button","preset","bottom","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}

package/components/DialogComponent/DialogComponent.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{forwardRef,useState,useRef,useCallback,useLayoutEffect}from'react';import ResizeObserver from'../../external/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import{DialogContainer}from'./DialogContainer.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,PositionedIconButton,DraggingHandle,DraggingIconContainer,MediaPortraitContainer,MediaPortrait,Placeholder,MediaSkeleton,Media,MediaLandscape,Fading,ScrollableContent,Controls}from'./style.mjs';import{getCommonSizeProps}from'./utils.mjs';import{SIZES_FANCY,SIZES,VISIBILITY_PORTRAIT,VISIBILITY_LANDSCAPE_MEDIA,VISIBILITY_LANDSCAPE,SIZES_TITLE,SIZES_SUBTITLE,SIZES_CAPTION}from'./constants.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Visibility}from'../Visibility/Visibility.mjs';import{Spacer}from'../Spacer/Spacer.mjs';import{Icon}from'../Icon/Icon.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';import{Button}from'../Button/Button.mjs';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps(forwardRef(((e,o)=>{const{size:r="s",iconButtonProps:i={},captionProps:t={},titleProps:s={},subtitleProps:n={},draggingIconProps:a={},imgSrc:l={},skeletonProps:c={},fancy:d,floats:m,children:p,caption:g,title:S,subtitle:I,controls:x,imgLandscapePositionRight:j,imgPortraitPositionBottom:h,className:b,backgroundClassName:y,scrollFadingDisabled:u,draggable:T,loading:z,sizeXXS:f,sizeXS:P,sizeS:B,sizeM:C,sizeL:E,sizeXL:k,onGrab:D,onNudge:L,...M}=e;const w={size:r,sizeXXS:f,sizeXS:P,sizeS:B,sizeM:C,sizeL:E,sizeXL:k};const R=getCommonSizeProps(w);const _=d?b:concatClassNames(b,y);const[A,v]=useState(null);const[N,V]=useState(null);const Z=useRef(null);const F=useCallback((e=>{e.scrollHeight===e.clientHeight?(v(null),V(null)):(v(e.scrollTop<=0),V(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return useLayoutEffect((()=>{const e=Z.current;return!u&&e&&(e[resizeHandlerSymbol]=F,resizeObserver.observe(e)),()=>{e&&resizeObserver.unobserve(e)}}),[F,u]),jsxs(Root,{...M,...w,className:_,fancy:d,ref:o,children:[m&&m(R),d&&jsx(FancyBackground,{className:y}),d&&i.onClick&&jsx(PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...i}),(T||l.portrait&&!h||d)&&jsxs(Visibility,{...w,sizes:VISIBILITY_PORTRAIT,children:[d&&jsx(Spacer,{top:96}),T&&jsx(DraggingHandle,{onPointerDown:D,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:L,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!h&&jsx(MediaPortraitContainer,{top:!d,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.portrait})]})})]}),l.landscape&&!j&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.landscape})]})}),!d&&i.onClick&&jsx(PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...i}),jsxs(DialogContainer,{...w,fancy:d,children:[T&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE,children:jsx(DraggingHandle,{onPointerDown:D,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:L,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})})}),!u&&jsx(Fading,{visible:A===!1}),jsx(ScrollableContent,{ref:Z,tabIndex:0,onScroll:e=>{u||F(e.currentTarget)},onKeyDown:e=>{keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxs(Fragment,z?{children:[jsx(Skeleton,{children:jsx(Text,{appearance:"heading",marginBottom:"1.5em",sizes:SIZES_TITLE,...R,...s})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...R,...n})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...R,...n})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{appearance:"body",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...R,...n})})]}:{children:[g&&jsx(Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_CAPTION,...R,...t,children:g}),S&&jsx(Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:SIZES_TITLE,...R,...s,children:S}),I&&jsx(Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...R,...n,children:I}),typeof p=='function'?p(R):p]})}),!u&&jsx(Fading,{visible:N===!1,after:!0}),x&&jsx(Controls,{children:z?jsx(Skeleton,{borderRadius:48,...c,children:jsx(Button,{preset:"brand",...R})}):x(R)})]}),l.landscape&&j&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{right:!0,children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.landscape})]})}),l.portrait&&h&&jsx(Visibility,{...w,sizes:VISIBILITY_PORTRAIT,children:jsx(MediaPortraitContainer,{bottom:!0,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent,SIZES,SIZES_FANCY};
+import{forwardRef,useState,useRef,useCallback,useLayoutEffect}from'react';import ResizeObserver from'resize-observer-polyfill';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import{DialogContainer}from'./DialogContainer.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,PositionedIconButton,DraggingHandle,DraggingIconContainer,MediaPortraitContainer,MediaPortrait,Placeholder,MediaSkeleton,Media,MediaLandscape,Fading,ScrollableContent,Controls}from'./style.mjs';import{getCommonSizeProps}from'./utils.mjs';import{SIZES_FANCY,SIZES,VISIBILITY_PORTRAIT,VISIBILITY_LANDSCAPE_MEDIA,VISIBILITY_LANDSCAPE,SIZES_TITLE,SIZES_SUBTITLE,SIZES_CAPTION}from'./constants.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Visibility}from'../Visibility/Visibility.mjs';import{Spacer}from'../Spacer/Spacer.mjs';import{Icon}from'../Icon/Icon.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';import{Button}from'../Button/Button.mjs';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps(forwardRef(((e,o)=>{const{size:i="s",iconButtonProps:r={},captionProps:t={},titleProps:s={},subtitleProps:n={},draggingIconProps:a={},imgSrc:l={},skeletonProps:c={},fancy:d,floats:m,children:g,caption:p,title:S,subtitle:I,controls:x,imgLandscapePositionRight:j,imgPortraitPositionBottom:h,className:b,backgroundClassName:y,scrollFadingDisabled:u,draggable:T,loading:z,sizeXXS:f,sizeXS:P,sizeS:B,sizeM:C,sizeL:E,sizeXL:k,onGrab:D,onNudge:L,...M}=e;const w={size:i,sizeXXS:f,sizeXS:P,sizeS:B,sizeM:C,sizeL:E,sizeXL:k};const R=getCommonSizeProps(w);const _=d?b:concatClassNames(b,y);const[A,v]=useState(null);const[N,V]=useState(null);const Z=useRef(null);const F=useCallback((e=>{e.scrollHeight===e.clientHeight?(v(null),V(null)):(v(e.scrollTop<=0),V(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return useLayoutEffect((()=>{const e=Z.current;return!u&&e&&(e[resizeHandlerSymbol]=F,resizeObserver.observe(e)),()=>{e&&resizeObserver.unobserve(e)}}),[F,u]),jsxs(Root,{...M,...w,className:_,fancy:d,ref:o,children:[m&&m(R),d&&jsx(FancyBackground,{className:y}),d&&r.onClick&&jsx(PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...r}),(T||l.portrait&&!h||d)&&jsxs(Visibility,{...w,sizes:VISIBILITY_PORTRAIT,children:[d&&jsx(Spacer,{top:96}),T&&jsx(DraggingHandle,{onPointerDown:D,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:L,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!h&&jsx(MediaPortraitContainer,{top:!d,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.portrait})]})})]}),l.landscape&&!j&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.landscape})]})}),!d&&r.onClick&&jsx(PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...r}),jsxs(DialogContainer,{...w,fancy:d,children:[T&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE,children:jsx(DraggingHandle,{onPointerDown:D,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:L,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})})}),!u&&jsx(Fading,{visible:A===!1}),jsx(ScrollableContent,{ref:Z,tabIndex:0,onScroll:e=>{u||F(e.currentTarget)},onKeyDown:e=>{keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxs(Fragment,z?{children:[jsx(Skeleton,{children:jsx(Text,{appearance:"heading",marginBottom:"1.5em",sizes:SIZES_TITLE,...R,...s})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...R,...n})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...R,...n})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{appearance:"body",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...R,...n})})]}:{children:[p&&jsx(Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_CAPTION,...R,...t,children:p}),S&&jsx(Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:SIZES_TITLE,...R,...s,children:S}),I&&jsx(Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...R,...n,children:I}),typeof g=='function'?g(R):g]})}),!u&&jsx(Fading,{visible:N===!1,after:!0}),x&&jsx(Controls,{children:z?jsx(Skeleton,{borderRadius:48,...c,children:jsx(Button,{preset:"brand",...R})}):x(R)})]}),l.landscape&&j&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{right:!0,children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.landscape})]})}),l.portrait&&h&&jsx(Visibility,{...w,sizes:VISIBILITY_PORTRAIT,children:jsx(MediaPortraitContainer,{bottom:!0,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent,SIZES,SIZES_FANCY};
 //# sourceMappingURL=DialogComponent.mjs.map