{"version":3,"file":"Decision.mjs","sources":["../../src/decision/Decision.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { Size, Breakpoint, SizeSmall, SizeMedium } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport NavigationOption from '../navigationOption';\nimport Tile from '../tile';\n\ninterface DecisionOption {\n  'aria-label'?: string;\n  description?: React.ReactNode;\n  disabled?: boolean;\n  href?: string;\n  target?: React.HTMLAttributeAnchorTarget;\n  media: {\n    block: React.ReactNode;\n    list: React.ReactNode;\n  };\n  onClick?: (event?: React.MouseEvent<HTMLElement>) => void;\n  title: React.ReactNode;\n}\n\nexport enum DecisionPresentation {\n  LIST = 'LIST',\n  LIST_BLOCK = 'LIST_BLOCK',\n  LIST_BLOCK_GRID = 'LIST_BLOCK_GRID',\n}\n\nexport enum DecisionType {\n  NAVIGATION = 'NAVIGATION',\n}\n\nexport interface DecisionProps {\n  /**  A list of elements to be rendered */\n  options: readonly DecisionOption[];\n  /**  Handles the display mode of the component */\n  presentation?: `${DecisionPresentation}`;\n  /** Size currently affects only Tile dimension */\n  size?: SizeSmall | SizeMedium;\n  /** Decide which kind of element type needs to be rendered ex: Navigation Options or in the future Radio or Checkbox Options */\n  type?: `${DecisionType}`;\n\n  /** Display media in a circle in list presentation */\n  showMediaCircleInList?: boolean;\n\n  /** Sets navigation options to be aligned with the parent container */\n  isContainerAligned?: boolean;\n}\n\nconst Decision = ({\n  options,\n  presentation = DecisionPresentation.LIST,\n  size = Size.MEDIUM,\n  type = DecisionType.NAVIGATION,\n  showMediaCircleInList = true,\n  isContainerAligned = false,\n}: DecisionProps) => {\n  const screenXs = useScreenSize(Breakpoint.EXTRA_SMALL);\n  const screenSm = useScreenSize(Breakpoint.SMALL);\n\n  if (type === DecisionType.NAVIGATION) {\n    const renderedOptions = options.map(\n      (\n        {\n          'aria-label': ariaLabel,\n          title,\n          description,\n          disabled,\n          href,\n          target,\n          media: { list },\n          onClick,\n        },\n        key,\n      ) => (\n        <NavigationOption\n          // eslint-disable-next-line react/no-array-index-key\n          key={`nav-${key}`}\n          aria-label={ariaLabel}\n          complex={false}\n          content={description}\n          disabled={disabled}\n          href={href}\n          target={target}\n          media={list}\n          showMediaAtAllSizes\n          showMediaCircle={showMediaCircleInList}\n          isContainerAligned={isContainerAligned}\n          title={title}\n          onClick={onClick}\n        />\n      ),\n    );\n\n    if (\n      presentation === DecisionPresentation.LIST_BLOCK ||\n      presentation === DecisionPresentation.LIST_BLOCK_GRID\n    ) {\n      const isSmall = size === Size.SMALL;\n      const breakpoint = isSmall ? screenXs : screenSm;\n\n      const isGrid = presentation === DecisionPresentation.LIST_BLOCK_GRID;\n\n      return (\n        <div\n          className={clsx(\n            'np-decision d-flex',\n            {\n              'np-decision--small': isSmall,\n              'np-decision--grid': isGrid,\n            },\n            breakpoint ? isGrid && 'flex-wrap' : 'flex-column',\n          )}\n        >\n          {breakpoint\n            ? options.map(\n                (\n                  {\n                    'aria-label': ariaLabel,\n                    description,\n                    disabled,\n                    href,\n                    target,\n                    media: { block },\n                    onClick,\n                    title,\n                  },\n                  key,\n                ) => (\n                  <Tile\n                    // eslint-disable-next-line react/no-array-index-key\n                    key={`tile-${key}`}\n                    className={clsx(`np-decision__tile${isSmall ? '--small' : ''}`, {\n                      'np-decision__tile--fixed-width': isGrid,\n                    })}\n                    aria-label={ariaLabel}\n                    description={description}\n                    disabled={disabled}\n                    href={href}\n                    target={target}\n                    media={block}\n                    size={isSmall ? Size.SMALL : Size.MEDIUM}\n                    title={title}\n                    onClick={onClick}\n                  />\n                ),\n              )\n            : renderedOptions}\n        </div>\n      );\n    }\n    // LIST\n    return <>{renderedOptions}</>;\n  }\n  return null;\n};\n\nexport default Decision;\n"],"names":["DecisionPresentation","DecisionType","Decision","options","presentation","LIST","size","Size","MEDIUM","type","NAVIGATION","showMediaCircleInList","isContainerAligned","screenXs","useScreenSize","Breakpoint","EXTRA_SMALL","screenSm","SMALL","renderedOptions","map","ariaLabel","title","description","disabled","href","target","media","list","onClick","key","_jsx","NavigationOption","complex","content","showMediaAtAllSizes","showMediaCircle","LIST_BLOCK","LIST_BLOCK_GRID","isSmall","breakpoint","isGrid","className","clsx","children","block","Tile","_Fragment"],"mappings":"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"}