@entur/menu 4.1.7 → 4.1.10

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 (12) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/dist/CollapsibleSideNavigation.d.ts +8 -0
  3. package/dist/Pagination.d.ts +4 -0
  4. package/dist/PaginationPage.d.ts +1 -0
  5. package/dist/menu.cjs.development.js +33 -10
  6. package/dist/menu.cjs.development.js.map +1 -1
  7. package/dist/menu.cjs.production.min.js +1 -1
  8. package/dist/menu.cjs.production.min.js.map +1 -1
  9. package/dist/menu.esm.js +34 -11
  10. package/dist/menu.esm.js.map +1 -1
  11. package/dist/styles.css +256 -256
  12. package/package.json +9 -8
package/dist/menu.cjs.production.min.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"menu.cjs.production.min.js","sources":["../src/SideNavigation.tsx","../src/useControllableProp.ts","../src/CollapsibleSideNavigation.tsx","../src/useShowDelayedLabel.ts","../src/SideNavigationItem.tsx","../src/PaginationPage.tsx","../src/PaginationInput.tsx","../src/OverflowMenu.tsx","../src/Pagination.tsx","../src/index.tsx","../src/BreadcrumbItem.tsx","../src/BreadcrumbNavigation.tsx","../src/SideNavigationGroup.tsx","../src/Stepper.tsx","../src/TopNavigationItem.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport './SideNavigation.scss';\n\nexport type SideNavigationProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelse på menyen\n * @default 'medium'\n */\n size?: 'small' | 'medium';\n [key: string]: any;\n};\n\ntype InternalMarker = {\n __IS_ENTUR_MENU__: boolean;\n};\n\nexport const SideNavigation: React.FC<SideNavigationProps> & InternalMarker = ({\n className,\n children,\n size = 'medium',\n ...rest\n}) => {\n if (!children || !React.Children.count(children)) {\n return null;\n }\n return (\n <ul\n className={classNames(\n 'eds-side-navigation',\n { 'eds-side-navigation--small': size === 'small' },\n className,\n )}\n {...rest}\n >\n {children}\n </ul>\n );\n};\n\n/** This is required to check that the Menu */\nSideNavigation.__IS_ENTUR_MENU__ = true;\n","import { useState, useEffect } from 'react';\nexport type UseControllablePropType<T> = {\n prop?: T;\n updater?: (value?: T) => void;\n defaultValue: T;\n};\nexport function useControllableProp<T>({\n prop,\n updater = () => undefined,\n defaultValue,\n}: UseControllablePropType<T>): [T, (arg: T) => void] {\n const [internalState, setInternalState] = useState<T>(defaultValue);\n useEffect(() => {\n if (prop !== undefined) {\n setInternalState(prop);\n }\n }, [prop]);\n return prop === undefined\n ? [internalState, setInternalState]\n : [prop, updater];\n}\n","import React from 'react';\nimport { SideNavigationProps } from './SideNavigation';\nimport { useControllableProp } from './useControllableProp';\nimport classNames from 'classnames';\nimport { LeftArrowIcon, MenuIcon } from '@entur/icons';\n\ntype CollapsibleSideNavigationProps = SideNavigationProps & {\n /**Tilstand til menyen\n * @default false\n */\n collapsed?: boolean;\n /** Kalles når menyen åpnes eller lukkes */\n onCollapseToggle?: (e: any) => void;\n /** Posisjonen til Collapsible-knappen, målt fra toppen (som CSS-enhet)\n * @default 50%\n */\n collapsibleButtonPosition?: string;\n};\n\nexport const CollapsibleSideNavigation: React.FC<CollapsibleSideNavigationProps> =\n ({\n className,\n children,\n size,\n collapsed: collapsible,\n onCollapseToggle,\n collapsibleButtonPosition = '50%',\n ...rest\n }) => {\n const [collapsedMenu, setCollapsedMenu] = useControllableProp({\n prop: collapsible,\n defaultValue: false,\n updater: onCollapseToggle,\n });\n\n return (\n <SideNavigationContext.Provider\n value={{\n isCollapsed: collapsedMenu,\n }}\n >\n <ul\n className={classNames(\n 'eds-side-navigation',\n { 'eds-side-navigation--small': size === 'small' },\n { 'eds-side-navigation--collapsed': collapsedMenu },\n className,\n )}\n {...rest}\n >\n {children}\n <button\n className=\"eds-side-navigation__collapse-button\"\n onClick={() => setCollapsedMenu(!collapsedMenu)}\n style={{ top: `${collapsibleButtonPosition}` }}\n >\n {collapsedMenu ? <MenuIcon /> : <LeftArrowIcon />}\n </button>\n </ul>\n </SideNavigationContext.Provider>\n );\n };\n\nconst SideNavigationContext = React.createContext<{\n isCollapsed: boolean;\n}>({\n isCollapsed: false,\n});\n\nexport const useSideNavigationContext: () => { isCollapsed: boolean } = () => {\n const context = React.useContext(SideNavigationContext);\n if (!context) {\n console.error(\n 'Error reading SideNavigationContext. Please contact maintainer of @entur/menu',\n );\n }\n return context;\n};\n","import { useEffect, useState } from 'react';\n\nexport const useShowDelayedLabel = (isCollapsed: boolean): [boolean] => {\n const [showLabel, setShowLabel] = useState(true);\n const hideDelay = 50;\n const showDelay = 200;\n useEffect(() => {\n if (isCollapsed) {\n setTimeout(() => {\n setShowLabel(false);\n }, hideDelay);\n }\n if (!isCollapsed) {\n setTimeout(() => {\n setShowLabel(true);\n }, showDelay);\n }\n return () => undefined;\n }, [isCollapsed]);\n return [showLabel];\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { useSideNavigationContext } from './CollapsibleSideNavigation';\nimport { useShowDelayedLabel } from './useShowDelayedLabel';\nimport { PolymorphicPropsWithoutRef } from '@entur/utils';\n\nfunction isActiveRecursively(child: any): boolean {\n if (!child.props) {\n return false;\n }\n if (child.props.active) {\n return true;\n }\n if (!child.props.children) {\n return false;\n }\n\n return React.Children.toArray(child.props.children).some(child =>\n isActiveRecursively(child),\n );\n}\n\ntype BaseSideNavigationItemOwnProps = {\n active?: boolean;\n as?: 'a' | 'button' | React.ElementType;\n className?: string;\n icon?: React.ReactNode;\n children: React.ReactNode;\n subMenu?: React.ReactNode;\n [key: string]: any;\n};\n\nexport type BaseSideNavigationItemProps<\n E extends React.ElementType = typeof defaultElementBaseItem,\n> = PolymorphicPropsWithoutRef<BaseSideNavigationItemOwnProps, E>;\n\nconst defaultElementBaseItem = 'a';\n\nconst BaseSideNavigationItem: <\n E extends React.ElementType = typeof defaultElementBaseItem,\n>(\n props: BaseSideNavigationItemProps<E>,\n) => React.ReactElement | null = React.forwardRef(\n <E extends React.ElementType = typeof defaultElementBaseItem>(\n {\n className,\n active = false,\n subMenu,\n icon,\n children,\n as,\n ...rest\n }: BaseSideNavigationItemProps<E>,\n ref: typeof rest.ref,\n ) => {\n const Element: React.ElementType = as || defaultElementBaseItem;\n const { isCollapsed } = useSideNavigationContext();\n const [showLabel] = useShowDelayedLabel(isCollapsed);\n return (\n <li className={classNames('eds-side-navigation__item', className)}>\n <Element\n className={classNames('eds-side-navigation__click-target', {\n 'eds-side-navigation__click-target--active': active,\n })}\n ref={ref}\n {...rest}\n >\n {icon}\n {showLabel && children}\n </Element>\n {subMenu}\n </li>\n );\n },\n);\n\ntype DisabledSideNavigationItemProps = {\n children: React.ReactNode;\n [key: string]: any;\n};\nconst DisabledSideNavigationItem = React.forwardRef<\n HTMLButtonElement,\n DisabledSideNavigationItemProps\n>(({ children, ...rest }, ref: React.Ref<HTMLButtonElement>) => (\n <BaseSideNavigationItem\n as=\"button\"\n disabled={true}\n aria-disabled={true}\n ref={ref}\n {...rest}\n >\n {children}\n </BaseSideNavigationItem>\n));\n\nexport type SideNavigationItemOwnProps = {\n /** Om meny-elementet er det som er aktivt */\n active?: boolean;\n /** HTML-elementet eller React-komponenten som rendres */\n as?: 'a' | 'button' | React.ElementType;\n /** Ekstra klassenavn */\n className?: string;\n /** Om meny-elementet er deaktivert */\n disabled?: boolean;\n /** Callback for når man klikker på meny-elementet */\n onClick?: (e: React.MouseEvent) => any;\n /** Sett til true om du vil tvinge alle sub-menus til å rendre barna sine. Typisk for å vise søkeresultater */\n forceExpandSubMenus?: boolean;\n icon?: React.ReactNode;\n [key: string]: any;\n};\n\nexport type SideNavigationItemProps<\n E extends React.ElementType = typeof defaultElementItem,\n> = PolymorphicPropsWithoutRef<SideNavigationItemOwnProps, E>;\n\nconst defaultElementItem = 'a';\n\nexport const SideNavigationItem: <\n E extends React.ElementType = typeof defaultElementItem,\n>(\n props: SideNavigationItemProps<E>,\n) => React.ReactElement | null = React.forwardRef(\n <E extends React.ElementType = typeof defaultElementItem>(\n {\n active,\n disabled,\n children,\n forceExpandSubMenus,\n as,\n ...rest\n }: SideNavigationItemProps<E>,\n ref: typeof rest.ref,\n ) => {\n const Element: React.ElementType = as || defaultElementItem;\n const childrenArray = React.Children.toArray(children);\n const subMenu = childrenArray.find(\n (child: any) => child && child.type && child.type.__IS_ENTUR_MENU__,\n );\n const label = subMenu\n ? childrenArray.filter(child => child !== subMenu)\n : children;\n\n if (disabled) {\n return (\n <DisabledSideNavigationItem ref={ref} {...rest}>\n {label}\n </DisabledSideNavigationItem>\n );\n }\n\n if (!subMenu) {\n return (\n <BaseSideNavigationItem\n as={Element}\n active={active}\n ref={ref}\n {...rest}\n >\n {label}\n </BaseSideNavigationItem>\n );\n }\n\n const isExpanded =\n forceExpandSubMenus ||\n isActiveRecursively({ props: { children, active } });\n\n return (\n <BaseSideNavigationItem\n active={active}\n subMenu={isExpanded && subMenu}\n aria-expanded={isExpanded}\n as={Element}\n ref={ref}\n {...rest}\n >\n {label}\n </BaseSideNavigationItem>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type PaginationPageProps = {\n /** Sidenummeret som er aktivt nå */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Viser siden som aktiv */\n selected?: boolean;\n /** Viser knappen som inaktiv */\n disabled?: boolean;\n /** Callback for når man trykker på siden */\n onClick: () => void;\n /** Tekst for skjermlesere */\n 'aria-label': string;\n};\nexport const PaginationPage: React.FC<PaginationPageProps> = ({\n children,\n className,\n selected,\n disabled,\n onClick,\n 'aria-label': ariaLabel,\n}) => (\n <button\n className={classNames(\n 'eds-pagination__page',\n { 'eds-pagination__page--selected': selected },\n { 'eds-pagination__page--disabled': disabled },\n className,\n )}\n disabled={selected || disabled}\n type=\"button\"\n onClick={onClick}\n aria-label={ariaLabel}\n aria-current={selected ? 'page' : false}\n >\n {children}\n </button>\n);\n","import React from 'react';\n\nexport type PaginationInputProps = {\n currentPage: number;\n label?: string;\n onPageChange: (pageNumber: number) => void;\n pageCount: number;\n};\n\nexport const PaginationInput: React.FC<PaginationInputProps> = ({\n currentPage,\n pageCount,\n label = 'Gå til side',\n onPageChange,\n}) => {\n const [input, setInput] = React.useState(String(currentPage));\n // If the currentPage prop changes, we want to reset the input field\n React.useEffect(() => {\n setInput(String(currentPage));\n }, [currentPage]);\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n e.stopPropagation();\n let pageNumber = Number(input);\n if (pageNumber === currentPage) {\n return;\n }\n if (Number.isNaN(pageNumber)) {\n pageNumber = currentPage;\n setInput(String(currentPage));\n return;\n }\n if (pageNumber > pageCount) {\n pageNumber = pageCount;\n setInput(String(pageCount));\n } else if (pageNumber < 1) {\n pageNumber = 1;\n setInput(String(1));\n }\n onPageChange(pageNumber);\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n setInput(e.target.value);\n };\n\n return (\n <form onSubmit={handleSubmit} noValidate aria-label=\"form\">\n <label className=\"eds-pagination__input-wrapper\">\n <span className=\"eds-pagination__input-label\">{label}</span>\n <input\n type=\"number\"\n max={pageCount}\n className=\"eds-pagination__input-field\"\n value={input}\n onChange={handleChange}\n />\n </label>\n </form>\n );\n};\n","import React, { cloneElement } from 'react';\nimport {\n Menu,\n MenuButton,\n MenuItem,\n MenuLink,\n MenuList,\n} from '@reach/menu-button';\nimport type {\n MenuButtonProps,\n MenuItemProps,\n MenuLinkProps,\n} from '@reach/menu-button';\nimport { IconButton } from '@entur/button';\nimport { VerticalDotsIcon } from '@entur/icons';\nimport { Contrast, useContrast } from '@entur/layout';\nimport classNames from 'classnames';\nimport type * as Polymorphic from '@reach/utils/polymorphic';\nimport './OverflowMenu.scss';\n\nexport type OverflowMenuProps = {\n /** Menypunkter (OverflowMenuItem eller OverflowMenuLink) */\n children: React.ReactNode;\n /** Knapp som skal åpne OverflowMenu\n * @default IconButton med VerticalDotsIcon\n */\n button?: React.ReactElement;\n /** Ekstra klassenavn */\n className?: string;\n /** Posisjoneringen av OverflowMenu-lista\n * @default 'right'\n */\n position?: 'right' | 'left';\n} & MenuButtonProps;\n\nexport const OverflowMenu: React.FC<OverflowMenuProps> = ({\n children,\n className,\n button,\n position = 'right',\n ...rest\n}) => {\n return (\n <div>\n <Menu>\n {!button ? (\n <IconButton\n as={MenuButton}\n className={classNames(className, 'eds-overflow-menu__menu-button')}\n {...rest}\n >\n <VerticalDotsIcon />\n </IconButton>\n ) : (\n cloneElement(button, {\n as: MenuButton,\n className: classNames(className, 'eds-overflow-menu__menu-button'),\n ...rest,\n })\n )}\n {useContrast() ? (\n <Contrast\n className={classNames('eds-overflow-menu__menu-list')}\n as={MenuList}\n portal={false}\n >\n {[children]}\n </Contrast>\n ) : (\n <MenuList\n className={classNames('eds-overflow-menu__menu-list', {\n 'eds-overflow-menu__menu-list--left': position === 'left',\n })}\n portal={false}\n >\n {[children]}\n </MenuList>\n )}\n </Menu>\n </div>\n );\n};\n\nexport type OverflowMenuItemProps = {\n /** Innholdet til OverflowMenuItem */\n children: React.ReactNode;\n /** HTML-elementet eller React-komponenten som lager elementet\n * @default \"button\"\n */\n as?: 'button' | React.ElementType;\n /** Ekstra klassenavn */\n className?: string;\n /** Det som skjer når elementet er valgt, enten ved museklikk eller Enter-klikk */\n onSelect: () => void;\n} & MenuItemProps;\n\nexport const OverflowMenuItem = React.forwardRef(\n ({ children, className, onSelect, disabled, as = 'div', ...rest }, ref) => {\n return (\n <MenuItem\n className={classNames(\n 'eds-overflow-menu__item',\n { 'eds-overflow-menu__item--disabled': disabled },\n className,\n )}\n onSelect={onSelect}\n disabled={disabled}\n ref={ref}\n as={as}\n {...rest}\n >\n {children}\n </MenuItem>\n );\n },\n) as Polymorphic.ForwardRefComponent<'div', OverflowMenuItemProps>;\n\nexport type OverflowMenuLinkProps = {\n /** Innholdet til OverflowMenuLink */\n children: React.ReactNode;\n /** HTML-elementet eller React-komponenten som lager elementet\n * @default \"a\"\n */\n as?: string | React.ReactElement;\n /** Ekstra klassenavn */\n className?: string;\n /** Det som skjer når elementet er valgt, enten ved museklikk eller Enter-klikk */\n onSelect: () => void;\n} & MenuLinkProps;\n\nexport const OverflowMenuLink = React.forwardRef(\n ({ children, as = 'a', className, onSelect, disabled, ...rest }, ref) => {\n return (\n <MenuLink\n as={as}\n className={classNames(\n 'eds-overflow-menu__item',\n { 'eds-overflow-menu__item--disabled': disabled },\n className,\n )}\n onSelect={onSelect}\n disabled={disabled}\n ref={ref}\n {...rest}\n >\n {children}\n </MenuLink>\n );\n },\n) as Polymorphic.ForwardRefComponent<'a', OverflowMenuLinkProps>;\n","import React, { useEffect, useState } from 'react';\nimport classNames from 'classnames';\nimport { Menu, MenuList, MenuButton } from '@reach/menu-button';\n\nimport {\n LeftArrowIcon,\n RightArrowIcon,\n DownArrowIcon,\n UpArrowIcon,\n} from '@entur/icons';\nimport { Label } from '@entur/typography';\nimport { useContrast } from '@entur/layout';\n\nimport { PaginationPage } from './PaginationPage';\nimport { PaginationInput } from './PaginationInput';\nimport { OverflowMenuItem } from './OverflowMenu';\n\nimport './Pagination.scss';\n\nexport type PaginationProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Sidenummeret som er aktivt nå (1-indeksert) */\n currentPage: number;\n /** Callback for når man ønsker å gå til en ny side */\n onPageChange: (requestedPage: number) => void;\n /** Antall sider totalt */\n pageCount: number;\n /**\n * Hva som blir lest opp når brukere av skjermlesere navigerer til \"forrige side knappen\"\n * @default \"Gå til forrige side\"\n */\n previousPageLabel?: string;\n /**\n * Hva som blir lest opp når brukere av skjermlesere navigerer til \"neste side knappen\"\n * @default \"Gå til neste side\"\n */\n nextPageLabel?: string;\n /**\n * Hva som blir lest opp når brukere av skjermlesere navigerer til \"forrige side knappen\"\n * @default pageNumber => `Gå til side ${pageNumber}`,\n */\n pageLabel?: (pageNumber: number) => string;\n /** Vis et felt til høyre for pagineringen hvor man kan angi siden man\n * ønsker å vise i et tekstfelt.\n *\n * @default false\n */\n showInput?: boolean;\n /** Label som vises til venstre for input-feltet som vises om `showInput` er true\n * @default \"Gå til side\"\n */\n inputLabel?: string;\n\n /** Hvor mange resultater man har totalt */\n nubmerOfResults?: number;\n /** Hvor mange resultater som vises per side */\n resultsPerPage?: number;\n /**\n * @default [10,25,50]\n */\n resultsPerPageOptions?: number[];\n /** Callback for når resultater per side oppdateres */\n onResultsPerPageChange?: (e: number) => void;\n /** Brukes for å skjule \"neste side\"-knappen\n * @default false\n */\n hideNextButton?: boolean;\n /** Brukes for å skjule \"forrige side\"-knappen\n * @default false\n */\n hidePrevButton?: boolean;\n /** Teksten som vises for hvilke resultater av sideantallet man viser.\n * @default `Viser resultat ${minPage} - ${maxPage} av ${pageCount}`\n */\n showingResultsLabel?: (\n minPage: number,\n maxPage: number,\n pageCount: number,\n ) => string;\n /** Teksten som vises før \"resultsPerPage\"-velgeren\n * @default \"Vis\"\n */\n showNumberOfResultsLabel?: string;\n [key: string]: any;\n};\n\nexport const Pagination: React.FC<PaginationProps> = ({\n className,\n currentPage,\n inputLabel,\n onPageChange,\n pageCount,\n pageLabel = pageNumber => `Gå til side ${pageNumber}`,\n previousPageLabel = 'Gå til forrige side',\n showInput,\n\n numberOfResults,\n resultsPerPage,\n resultsPerPageOptions = [10, 25, 50],\n onResultsPerPageChange,\n\n showNumberOfResultsLabel = 'Vis',\n nextPageLabel = 'Gå til neste side',\n showingResultsLabel = (minPage, maxPage, pageCount) =>\n `Viser resultat ${minPage} - ${maxPage} av ${pageCount}`,\n hideNextButton = false,\n hidePrevButton = false,\n ...rest\n}) => {\n const isContrast = useContrast();\n const [listedEntries, setListedEntries] = useState<Array<number | '…'>>([]);\n\n const isFirstPostSelected = currentPage === 1;\n const isLastPostSelected = currentPage === pageCount;\n const noEllipsis = pageCount <= 7;\n const onlyLeadingEllipsis = !noEllipsis && currentPage < 5;\n const onlyTrailingEllipsis = !noEllipsis && pageCount - currentPage <= 3;\n\n useEffect(() => {\n if (pageCount < 1) return;\n if (noEllipsis) {\n setListedEntries(\n Array(pageCount)\n .fill(null)\n .map((_, i) => i + 1),\n );\n } else if (onlyLeadingEllipsis) {\n setListedEntries([1, 2, 3, 4, 5, '…', pageCount]);\n } else if (onlyTrailingEllipsis) {\n setListedEntries([\n 1,\n '…',\n pageCount - 4,\n pageCount - 3,\n pageCount - 2,\n pageCount - 1,\n pageCount,\n ]);\n } else {\n // leading and trailing ellipsis\n setListedEntries([\n 1,\n '…',\n currentPage - 1,\n currentPage,\n currentPage + 1,\n '…',\n pageCount,\n ]);\n }\n }, [\n noEllipsis,\n onlyLeadingEllipsis,\n onlyTrailingEllipsis,\n currentPage,\n pageCount,\n ]);\n\n if (pageCount < 1) {\n return null;\n }\n\n return (\n <div className={classNames('eds-pagination', className)} {...rest}>\n {resultsPerPage && numberOfResults && (\n <div className=\"eds-pagination__results\">\n {onResultsPerPageChange && (\n <Menu>\n {({ isOpen }) => (\n <>\n <Label>{showNumberOfResultsLabel}</Label>\n <MenuButton\n className={classNames('eds-pagination-menu__menu-button', {\n 'eds-pagination-menu__menu-button--open': isOpen,\n })}\n >\n {resultsPerPage}\n {isOpen ? <UpArrowIcon /> : <DownArrowIcon />}\n </MenuButton>\n <MenuList\n className={classNames(\n 'eds-pagination-menu__menu-list',\n 'eds-overflow-menu__menu-list',\n { 'eds-contrast': isContrast },\n )}\n >\n {resultsPerPageOptions.map(\n (option: number, key: number) => (\n <OverflowMenuItem\n key={key}\n onSelect={() => onResultsPerPageChange(option)}\n >\n {option}\n </OverflowMenuItem>\n ),\n )}\n </MenuList>\n </>\n )}\n </Menu>\n )}\n <Label className=\"eds-pagination__results-label\">\n {showingResultsLabel(\n (currentPage - 1) * resultsPerPage + 1,\n currentPage * resultsPerPage > numberOfResults\n ? numberOfResults\n : currentPage * resultsPerPage,\n numberOfResults,\n )}\n </Label>\n </div>\n )}\n <div className=\"eds-pagination__controls\">\n {!hidePrevButton && (\n <PaginationPage\n onClick={() => onPageChange(currentPage - 1)}\n aria-label={previousPageLabel}\n disabled={isFirstPostSelected}\n >\n <LeftArrowIcon />\n </PaginationPage>\n )}\n {listedEntries.map((entry, index) =>\n entry === '…' ? (\n <Ellipsis key={`ellipsis-${index}`} />\n ) : (\n <PaginationPage\n selected={entry === currentPage}\n onClick={() => onPageChange(entry)}\n aria-label={pageLabel(entry)}\n key={entry}\n >\n {entry}\n </PaginationPage>\n ),\n )}\n {!hideNextButton && (\n <PaginationPage\n onClick={() => onPageChange(currentPage + 1)}\n aria-label={nextPageLabel}\n disabled={isLastPostSelected}\n >\n <RightArrowIcon />\n </PaginationPage>\n )}\n {showInput && (\n <PaginationInput\n pageCount={pageCount}\n currentPage={currentPage}\n onPageChange={onPageChange}\n label={inputLabel}\n />\n )}\n </div>\n </div>\n );\n};\n\nconst Ellipsis: React.FC = () => (\n <span className=\"eds-pagination__ellipsis\" aria-hidden=\"true\">\n …\n </span>\n);\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles(\n 'menu',\n 'expand',\n 'icons',\n 'typography',\n 'button',\n 'layout',\n);\n\nexport * from './BreadcrumbNavigation';\nexport * from './BreadcrumbItem';\nexport * from './SideNavigation';\nexport * from './SideNavigationItem';\nexport * from './SideNavigationGroup';\nexport * from './TopNavigationItem';\nexport * from './Pagination';\nexport * from './Stepper';\nexport * from './OverflowMenu';\nexport * from './CollapsibleSideNavigation';\n","import React from 'react';\nimport classNames from 'classnames';\nimport { RightArrowIcon } from '@entur/icons';\nimport './BreadcrumbNavigation.scss';\nimport { PolymorphicPropsWithoutRef } from '@entur/utils';\n\nexport type BreadcrumbItemOwnProps = {\n /** Komponenten som rendres\n * @default \"a\"\n */\n as?: 'a' | React.ElementType;\n /** Teksten som vises */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** True om sist i listen. Settes automatisk av BreadcrumbNavigation-komponenten */\n isCurrent?: boolean;\n};\n\nexport type BreadcrumbItemProps<\n E extends React.ElementType = typeof defaultElement,\n> = PolymorphicPropsWithoutRef<BreadcrumbItemOwnProps, E>;\n\nconst defaultElement = 'a';\n\nexport const BreadcrumbItem = <\n E extends React.ElementType = typeof defaultElement,\n>({\n className,\n isCurrent,\n as,\n ...rest\n}: BreadcrumbItemProps<E>): JSX.Element => {\n const Element: React.ElementType = as || defaultElement;\n return (\n <>\n <li className={classNames('eds-breadcrumb__item', className)}>\n <Element\n aria-current={isCurrent ? 'page' : undefined}\n className={classNames('eds-breadcrumb__link', {\n 'eds-breadcrumb__link--current': isCurrent,\n })}\n {...rest}\n />\n </li>\n {!isCurrent && (\n <RightArrowIcon\n className=\"eds-breadcrumb__separator\"\n inline\n role=\"presentation\"\n />\n )}\n </>\n );\n};\n","import React from 'react';\nimport './BreadcrumbNavigation.scss';\n\nexport type BreadcrumbNavigationProps = {\n /** Label for brødsmulestien.\n * @default 'Brødsmulesti'\n */\n 'aria-label'?: string;\n /** En liste med BreadcrumbItem-er */\n children: React.ReactElement[];\n};\n\nexport const BreadcrumbNavigation: React.FC<BreadcrumbNavigationProps> = ({\n 'aria-label': ariaLabel = 'Brødsmulesti',\n children,\n}) => {\n return (\n <nav aria-label={ariaLabel}>\n <ol className=\"eds-breadcrumbs\">\n {React.Children.map(children, (child, index) =>\n React.cloneElement(child, {\n isCurrent: index + 1 === React.Children.count(children),\n }),\n )}\n </ol>\n </nav>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { BaseExpand, ExpandArrow } from '@entur/expand';\nimport { useSideNavigationContext } from './CollapsibleSideNavigation';\nimport { useShowDelayedLabel } from './useShowDelayedLabel';\nimport { useControllableProp } from './useControllableProp';\n\nexport type SideNavigationGroupProps = {\n /** Skal menygruppen være ekspandert by default? Kun relevant om komponenten ikke er kontrollert\n * @default false\n */\n defaultOpen?: boolean;\n /** Er menyen åpen? */\n open?: boolean;\n /** Kalles når menygruppen åpnes eller lukkes */\n onToggle?: (e?: boolean) => void;\n /** Ekstra klassenavn */\n className?: string;\n /** Menyen som skal grupperes */\n children: React.ReactNode;\n /** Overskriften til menyen */\n title: React.ReactNode;\n icon?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const SideNavigationGroup: React.FC<SideNavigationGroupProps> = ({\n defaultOpen = false,\n open,\n onToggle,\n className,\n children,\n title,\n icon,\n ...rest\n}) => {\n const [isOpen, setOpen] = useControllableProp({\n prop: open,\n updater: onToggle,\n defaultValue: defaultOpen,\n });\n const { isCollapsed } = useSideNavigationContext();\n\n const [showLabel] = useShowDelayedLabel(isCollapsed);\n\n return (\n <div\n className={classNames('eds-side-navigation-group', className)}\n {...rest}\n >\n <button\n onClick={() => setOpen(!isOpen)}\n type=\"button\"\n className=\"eds-side-navigation-group__trigger\"\n >\n <span>\n {icon && (\n <span className=\"eds-side-navigation-group__trigger-icon\">\n {icon}\n </span>\n )}\n {showLabel && title}\n </span>\n {showLabel && (\n <ExpandArrow\n open={isOpen}\n className=\"eds-side-navigation-group__expand-icon\"\n />\n )}\n </button>\n <BaseExpand open={isOpen}>{children}</BaseExpand>\n </div>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { Label } from '@entur/typography';\n\nimport './Stepper.scss';\n\nexport type StepperProps = {\n /** Det nåværende steget. */\n activeIndex: number;\n /** Oppdater state ved klikk. */\n onStepClick: (index: number) => void;\n /** Liste av steg. */\n steps: string[];\n /** Ekstra klassenavn. */\n className?: string;\n /** Om stepperen skal være et interaktivt-navigasjonselement eller ikke\n * @default false\n */\n interactive?: boolean;\n /** Om stepper skal vise indeksering av hvilket trinn man er på\n * @default true\n */\n showStepperIndex?: boolean;\n as?: 'button' | React.ElementType;\n [key: string]: any;\n};\n\nexport const Stepper: React.FC<StepperProps> = ({\n className,\n onStepClick,\n steps,\n activeIndex,\n interactive = false,\n showStepperIndex = true,\n ...rest\n}) => {\n const Element = interactive ? 'button' : 'div';\n return (\n <div className={classNames('eds-stepper', className)} {...rest}>\n {steps.map((step, i) => {\n const isActive = i === activeIndex;\n const hasBeenActive = activeIndex > i;\n const props = interactive ? { onClick: () => onStepClick(i) } : {};\n return (\n <Element\n key={step}\n className={classNames('eds-stepper__item__container', {\n 'eds-stepper__item__container--non-interactive': !interactive,\n })}\n {...props}\n >\n <div\n className={classNames(\n 'eds-stepper__item__square',\n { 'eds-stepper__item__square--active': isActive },\n { 'eds-stepper__item__square--inactive': activeIndex < i },\n { 'eds-stepper__item__square--has-been': hasBeenActive },\n )}\n ></div>\n <Label\n className={classNames(\n 'eds-stepper__item__label',\n {\n 'eds-stepper__item__label--has-been': hasBeenActive,\n },\n {\n 'eds-stepper__item__label--active': isActive,\n },\n )}\n >\n {showStepperIndex && i + 1 + '.'} {step}\n </Label>\n </Element>\n );\n })}\n </div>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport './TopNavigationItem.scss';\nimport { PolymorphicPropsWithoutRef } from '@entur/utils';\n\nexport type TopNavigationItemOwnProps = {\n /** Om komponenten vises som valgt eller ikke\n * @default false\n */\n active?: boolean;\n /** Tekste som vises */\n children: React.ReactNode;\n /** HTML-elementet eller React-komponenten som lager komponenten\n * @default 'a'\n */\n as?: 'a' | React.ElementType;\n /** Ekstra klassenavn */\n className?: string;\n};\n\nexport type TopNavigationItemProps<\n E extends React.ElementType = typeof defaultElement,\n> = PolymorphicPropsWithoutRef<TopNavigationItemOwnProps, E>;\n\nconst defaultElement = 'a';\n\nexport const TopNavigationItem = <\n E extends React.ElementType = typeof defaultElement,\n>({\n active = false,\n className,\n as,\n ...rest\n}: TopNavigationItemProps<E>): JSX.Element => {\n const Element: React.ElementType = as || defaultElement;\n return (\n <Element\n className={classNames([\n 'eds-top-navigation-item',\n className,\n { 'eds-top-navigation-item--active': active },\n ])}\n {...rest}\n />\n );\n};\n"],"names":["SideNavigation","className","children","size","rest","React","Children","count","classNames","useControllableProp","prop","updater","useState","defaultValue","internalState","setInternalState","useEffect","undefined","__IS_ENTUR_MENU__","SideNavigationContext","createContext","isCollapsed","useSideNavigationContext","context","useContext","console","error","useShowDelayedLabel","showLabel","setShowLabel","setTimeout","isActiveRecursively","child","props","active","toArray","some","BaseSideNavigationItem","forwardRef","ref","subMenu","icon","as","Element","DisabledSideNavigationItem","disabled","SideNavigationItem","forceExpandSubMenus","childrenArray","find","type","label","filter","isExpanded","PaginationPage","selected","onClick","ariaLabel","PaginationInput","currentPage","pageCount","onPageChange","String","input","setInput","onSubmit","e","preventDefault","stopPropagation","pageNumber","Number","isNaN","noValidate","max","value","onChange","target","OverflowMenuItem","onSelect","MenuItem","OverflowMenuLink","MenuLink","Ellipsis","warnAboutMissingStyles","isCurrent","RightArrowIcon","inline","role","map","index","cloneElement","collapsible","collapsed","onCollapseToggle","collapsibleButtonPosition","collapsedMenu","setCollapsedMenu","Provider","style","top","MenuIcon","LeftArrowIcon","button","position","Menu","MenuButton","IconButton","VerticalDotsIcon","useContrast","Contrast","MenuList","portal","inputLabel","pageLabel","previousPageLabel","showInput","numberOfResults","resultsPerPage","resultsPerPageOptions","onResultsPerPageChange","showNumberOfResultsLabel","nextPageLabel","showingResultsLabel","minPage","maxPage","hideNextButton","hidePrevButton","isContrast","listedEntries","setListedEntries","isFirstPostSelected","isLastPostSelected","noEllipsis","onlyLeadingEllipsis","onlyTrailingEllipsis","Array","fill","_","i","isOpen","Label","UpArrowIcon","DownArrowIcon","option","key","entry","defaultOpen","open","onToggle","title","setOpen","ExpandArrow","BaseExpand","onStepClick","steps","activeIndex","interactive","showStepperIndex","step","isActive","hasBeenActive"],"mappings":"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"}
1
+ {"version":3,"file":"menu.cjs.production.min.js","sources":["../src/SideNavigation.tsx","../src/useControllableProp.ts","../src/CollapsibleSideNavigation.tsx","../src/useShowDelayedLabel.ts","../src/SideNavigationItem.tsx","../src/PaginationPage.tsx","../src/PaginationInput.tsx","../src/OverflowMenu.tsx","../src/Pagination.tsx","../src/index.tsx","../src/BreadcrumbItem.tsx","../src/BreadcrumbNavigation.tsx","../src/SideNavigationGroup.tsx","../src/Stepper.tsx","../src/TopNavigationItem.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport './SideNavigation.scss';\n\nexport type SideNavigationProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelse på menyen\n * @default 'medium'\n */\n size?: 'small' | 'medium';\n [key: string]: any;\n};\n\ntype InternalMarker = {\n __IS_ENTUR_MENU__: boolean;\n};\n\nexport const SideNavigation: React.FC<SideNavigationProps> & InternalMarker = ({\n className,\n children,\n size = 'medium',\n ...rest\n}) => {\n if (!children || !React.Children.count(children)) {\n return null;\n }\n return (\n <ul\n className={classNames(\n 'eds-side-navigation',\n { 'eds-side-navigation--small': size === 'small' },\n className,\n )}\n {...rest}\n >\n {children}\n </ul>\n );\n};\n\n/** This is required to check that the Menu */\nSideNavigation.__IS_ENTUR_MENU__ = true;\n","import { useState, useEffect } from 'react';\nexport type UseControllablePropType<T> = {\n prop?: T;\n updater?: (value?: T) => void;\n defaultValue: T;\n};\nexport function useControllableProp<T>({\n prop,\n updater = () => undefined,\n defaultValue,\n}: UseControllablePropType<T>): [T, (arg: T) => void] {\n const [internalState, setInternalState] = useState<T>(defaultValue);\n useEffect(() => {\n if (prop !== undefined) {\n setInternalState(prop);\n }\n }, [prop]);\n return prop === undefined\n ? [internalState, setInternalState]\n : [prop, updater];\n}\n","import React from 'react';\nimport { SideNavigationProps } from './SideNavigation';\nimport { useControllableProp } from './useControllableProp';\nimport classNames from 'classnames';\nimport { LeftArrowIcon, MenuIcon } from '@entur/icons';\n\ntype CollapsibleSideNavigationProps = SideNavigationProps & {\n /**Tilstand til menyen\n * @default false\n */\n collapsed?: boolean;\n /** Kalles når menyen åpnes eller lukkes */\n onCollapseToggle?: (e: any) => void;\n /** Posisjonen til Collapsible-knappen, målt fra toppen (som CSS-enhet)\n * @default 50%\n */\n collapsibleButtonPosition?: string;\n /** Aria-label for knappen som åpner menyen\n * @default \"Åpne sidemeny\"\n */\n openSideMenuAriaLabel?: string;\n /** Aria-label for knappen som lukker menyen\n * @default \"Lukk sidemeny\"\n */\n closeSideMenuAriaLabel?: string;\n};\n\nexport const CollapsibleSideNavigation: React.FC<CollapsibleSideNavigationProps> =\n ({\n className,\n children,\n size,\n collapsed: collapsible,\n onCollapseToggle,\n collapsibleButtonPosition = '50%',\n openSideMenuAriaLabel = 'Åpne sidemeny',\n closeSideMenuAriaLabel = 'Lukk sidemeny',\n ...rest\n }) => {\n const [collapsedMenu, setCollapsedMenu] = useControllableProp({\n prop: collapsible,\n defaultValue: false,\n updater: onCollapseToggle,\n });\n\n return (\n <SideNavigationContext.Provider\n value={{\n isCollapsed: collapsedMenu,\n }}\n >\n <ul\n className={classNames(\n 'eds-side-navigation',\n { 'eds-side-navigation--small': size === 'small' },\n { 'eds-side-navigation--collapsed': collapsedMenu },\n className,\n )}\n {...rest}\n >\n {children}\n <button\n className=\"eds-side-navigation__collapse-button\"\n onClick={() => setCollapsedMenu(!collapsedMenu)}\n style={{ top: `${collapsibleButtonPosition}` }}\n >\n {collapsedMenu ? (\n <MenuIcon aria-label={openSideMenuAriaLabel} />\n ) : (\n <LeftArrowIcon aria-label={closeSideMenuAriaLabel} />\n )}\n </button>\n </ul>\n </SideNavigationContext.Provider>\n );\n };\n\nconst SideNavigationContext = React.createContext<{\n isCollapsed: boolean;\n}>({\n isCollapsed: false,\n});\n\nexport const useSideNavigationContext: () => { isCollapsed: boolean } = () => {\n const context = React.useContext(SideNavigationContext);\n if (!context) {\n console.error(\n 'Error reading SideNavigationContext. Please contact maintainer of @entur/menu',\n );\n }\n return context;\n};\n","import { useEffect, useState } from 'react';\n\nexport const useShowDelayedLabel = (isCollapsed: boolean): [boolean] => {\n const [showLabel, setShowLabel] = useState(true);\n const hideDelay = 50;\n const showDelay = 200;\n useEffect(() => {\n if (isCollapsed) {\n setTimeout(() => {\n setShowLabel(false);\n }, hideDelay);\n }\n if (!isCollapsed) {\n setTimeout(() => {\n setShowLabel(true);\n }, showDelay);\n }\n return () => undefined;\n }, [isCollapsed]);\n return [showLabel];\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { useSideNavigationContext } from './CollapsibleSideNavigation';\nimport { useShowDelayedLabel } from './useShowDelayedLabel';\nimport { PolymorphicPropsWithoutRef } from '@entur/utils';\n\nfunction isActiveRecursively(child: any): boolean {\n if (!child.props) {\n return false;\n }\n if (child.props.active) {\n return true;\n }\n if (!child.props.children) {\n return false;\n }\n\n return React.Children.toArray(child.props.children).some(child =>\n isActiveRecursively(child),\n );\n}\n\ntype BaseSideNavigationItemOwnProps = {\n active?: boolean;\n as?: 'a' | 'button' | React.ElementType;\n className?: string;\n icon?: React.ReactNode;\n children: React.ReactNode;\n subMenu?: React.ReactNode;\n [key: string]: any;\n};\n\nexport type BaseSideNavigationItemProps<\n E extends React.ElementType = typeof defaultElementBaseItem,\n> = PolymorphicPropsWithoutRef<BaseSideNavigationItemOwnProps, E>;\n\nconst defaultElementBaseItem = 'a';\n\nconst BaseSideNavigationItem: <\n E extends React.ElementType = typeof defaultElementBaseItem,\n>(\n props: BaseSideNavigationItemProps<E>,\n) => React.ReactElement | null = React.forwardRef(\n <E extends React.ElementType = typeof defaultElementBaseItem>(\n {\n className,\n active = false,\n subMenu,\n icon,\n children,\n as,\n ...rest\n }: BaseSideNavigationItemProps<E>,\n ref: typeof rest.ref,\n ) => {\n const Element: React.ElementType = as || defaultElementBaseItem;\n const { isCollapsed } = useSideNavigationContext();\n const [showLabel] = useShowDelayedLabel(isCollapsed);\n return (\n <li className={classNames('eds-side-navigation__item', className)}>\n <Element\n className={classNames('eds-side-navigation__click-target', {\n 'eds-side-navigation__click-target--active': active,\n })}\n aria-label={icon ? children : undefined}\n aria-current={active ? 'page' : undefined}\n ref={ref}\n {...rest}\n >\n {icon}\n {showLabel && children}\n </Element>\n {subMenu}\n </li>\n );\n },\n);\n\ntype DisabledSideNavigationItemProps = {\n children: React.ReactNode;\n [key: string]: any;\n};\nconst DisabledSideNavigationItem = React.forwardRef<\n HTMLButtonElement,\n DisabledSideNavigationItemProps\n>(({ children, ...rest }, ref: React.Ref<HTMLButtonElement>) => (\n <BaseSideNavigationItem\n as=\"button\"\n disabled={true}\n aria-disabled={true}\n ref={ref}\n {...rest}\n >\n {children}\n </BaseSideNavigationItem>\n));\n\nexport type SideNavigationItemOwnProps = {\n /** Om meny-elementet er det som er aktivt */\n active?: boolean;\n /** HTML-elementet eller React-komponenten som rendres */\n as?: 'a' | 'button' | React.ElementType;\n /** Ekstra klassenavn */\n className?: string;\n /** Om meny-elementet er deaktivert */\n disabled?: boolean;\n /** Callback for når man klikker på meny-elementet */\n onClick?: (e: React.MouseEvent) => any;\n /** Sett til true om du vil tvinge alle sub-menus til å rendre barna sine. Typisk for å vise søkeresultater */\n forceExpandSubMenus?: boolean;\n icon?: React.ReactNode;\n [key: string]: any;\n};\n\nexport type SideNavigationItemProps<\n E extends React.ElementType = typeof defaultElementItem,\n> = PolymorphicPropsWithoutRef<SideNavigationItemOwnProps, E>;\n\nconst defaultElementItem = 'a';\n\nexport const SideNavigationItem: <\n E extends React.ElementType = typeof defaultElementItem,\n>(\n props: SideNavigationItemProps<E>,\n) => React.ReactElement | null = React.forwardRef(\n <E extends React.ElementType = typeof defaultElementItem>(\n {\n active,\n disabled,\n children,\n forceExpandSubMenus,\n as,\n ...rest\n }: SideNavigationItemProps<E>,\n ref: typeof rest.ref,\n ) => {\n const Element: React.ElementType = as || defaultElementItem;\n const childrenArray = React.Children.toArray(children);\n const subMenu = childrenArray.find(\n (child: any) => child && child.type && child.type.__IS_ENTUR_MENU__,\n );\n const label = subMenu\n ? childrenArray.filter(child => child !== subMenu)\n : children;\n\n if (disabled) {\n return (\n <DisabledSideNavigationItem ref={ref} {...rest}>\n {label}\n </DisabledSideNavigationItem>\n );\n }\n\n if (!subMenu) {\n return (\n <BaseSideNavigationItem\n as={Element}\n active={active}\n ref={ref}\n {...rest}\n >\n {label}\n </BaseSideNavigationItem>\n );\n }\n\n const isExpanded =\n forceExpandSubMenus ||\n isActiveRecursively({ props: { children, active } });\n\n return (\n <BaseSideNavigationItem\n active={active}\n subMenu={isExpanded && subMenu}\n aria-expanded={isExpanded}\n as={Element}\n ref={ref}\n {...rest}\n >\n {label}\n </BaseSideNavigationItem>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type PaginationPageProps = {\n /** Sidenummeret som er aktivt nå */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Viser siden som aktiv */\n selected?: boolean;\n /** Viser knappen som inaktiv */\n disabled?: boolean;\n /** Callback for når man trykker på siden */\n onClick: () => void;\n /** Tekst for skjermlesere */\n 'aria-label': string;\n 'aria-describedby'?: string;\n};\nexport const PaginationPage: React.FC<PaginationPageProps> = ({\n children,\n className,\n selected,\n disabled,\n onClick,\n 'aria-label': ariaLabel,\n 'aria-describedby': ariaDescribedby,\n}) => (\n <button\n className={classNames(\n 'eds-pagination__page',\n { 'eds-pagination__page--selected': selected },\n { 'eds-pagination__page--disabled': disabled },\n className,\n )}\n disabled={selected || disabled}\n type=\"button\"\n onClick={onClick}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedby}\n aria-current={selected ? 'page' : false}\n >\n {children}\n </button>\n);\n","import React from 'react';\n\nexport type PaginationInputProps = {\n currentPage: number;\n label?: string;\n onPageChange: (pageNumber: number) => void;\n pageCount: number;\n};\n\nexport const PaginationInput: React.FC<PaginationInputProps> = ({\n currentPage,\n pageCount,\n label = 'Gå til side',\n onPageChange,\n}) => {\n const [input, setInput] = React.useState(String(currentPage));\n // If the currentPage prop changes, we want to reset the input field\n React.useEffect(() => {\n setInput(String(currentPage));\n }, [currentPage]);\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n e.stopPropagation();\n let pageNumber = Number(input);\n if (pageNumber === currentPage) {\n return;\n }\n if (Number.isNaN(pageNumber)) {\n pageNumber = currentPage;\n setInput(String(currentPage));\n return;\n }\n if (pageNumber > pageCount) {\n pageNumber = pageCount;\n setInput(String(pageCount));\n } else if (pageNumber < 1) {\n pageNumber = 1;\n setInput(String(1));\n }\n onPageChange(pageNumber);\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n setInput(e.target.value);\n };\n\n return (\n <form onSubmit={handleSubmit} noValidate aria-label=\"form\">\n <label className=\"eds-pagination__input-wrapper\">\n <span className=\"eds-pagination__input-label\">{label}</span>\n <input\n type=\"number\"\n max={pageCount}\n className=\"eds-pagination__input-field\"\n value={input}\n onChange={handleChange}\n />\n </label>\n </form>\n );\n};\n","import React, { cloneElement } from 'react';\nimport {\n Menu,\n MenuButton,\n MenuItem,\n MenuLink,\n MenuList,\n} from '@reach/menu-button';\nimport type {\n MenuButtonProps,\n MenuItemProps,\n MenuLinkProps,\n} from '@reach/menu-button';\nimport { IconButton } from '@entur/button';\nimport { VerticalDotsIcon } from '@entur/icons';\nimport { Contrast, useContrast } from '@entur/layout';\nimport classNames from 'classnames';\nimport type * as Polymorphic from '@reach/utils/polymorphic';\nimport './OverflowMenu.scss';\n\nexport type OverflowMenuProps = {\n /** Menypunkter (OverflowMenuItem eller OverflowMenuLink) */\n children: React.ReactNode;\n /** Knapp som skal åpne OverflowMenu\n * @default IconButton med VerticalDotsIcon\n */\n button?: React.ReactElement;\n /** Ekstra klassenavn */\n className?: string;\n /** Posisjoneringen av OverflowMenu-lista\n * @default 'right'\n */\n position?: 'right' | 'left';\n} & MenuButtonProps;\n\nexport const OverflowMenu: React.FC<OverflowMenuProps> = ({\n children,\n className,\n button,\n position = 'right',\n ...rest\n}) => {\n return (\n <div>\n <Menu>\n {!button ? (\n <IconButton\n as={MenuButton}\n className={classNames(className, 'eds-overflow-menu__menu-button')}\n {...rest}\n >\n <VerticalDotsIcon />\n </IconButton>\n ) : (\n cloneElement(button, {\n as: MenuButton,\n className: classNames(className, 'eds-overflow-menu__menu-button'),\n ...rest,\n })\n )}\n {useContrast() ? (\n <Contrast\n className={classNames('eds-overflow-menu__menu-list')}\n as={MenuList}\n portal={false}\n >\n {[children]}\n </Contrast>\n ) : (\n <MenuList\n className={classNames('eds-overflow-menu__menu-list', {\n 'eds-overflow-menu__menu-list--left': position === 'left',\n })}\n portal={false}\n >\n {[children]}\n </MenuList>\n )}\n </Menu>\n </div>\n );\n};\n\nexport type OverflowMenuItemProps = {\n /** Innholdet til OverflowMenuItem */\n children: React.ReactNode;\n /** HTML-elementet eller React-komponenten som lager elementet\n * @default \"button\"\n */\n as?: 'button' | React.ElementType;\n /** Ekstra klassenavn */\n className?: string;\n /** Det som skjer når elementet er valgt, enten ved museklikk eller Enter-klikk */\n onSelect: () => void;\n} & MenuItemProps;\n\nexport const OverflowMenuItem = React.forwardRef(\n ({ children, className, onSelect, disabled, as = 'div', ...rest }, ref) => {\n return (\n <MenuItem\n className={classNames(\n 'eds-overflow-menu__item',\n { 'eds-overflow-menu__item--disabled': disabled },\n className,\n )}\n onSelect={onSelect}\n disabled={disabled}\n ref={ref}\n as={as}\n {...rest}\n >\n {children}\n </MenuItem>\n );\n },\n) as Polymorphic.ForwardRefComponent<'div', OverflowMenuItemProps>;\n\nexport type OverflowMenuLinkProps = {\n /** Innholdet til OverflowMenuLink */\n children: React.ReactNode;\n /** HTML-elementet eller React-komponenten som lager elementet\n * @default \"a\"\n */\n as?: string | React.ReactElement;\n /** Ekstra klassenavn */\n className?: string;\n /** Det som skjer når elementet er valgt, enten ved museklikk eller Enter-klikk */\n onSelect: () => void;\n} & MenuLinkProps;\n\nexport const OverflowMenuLink = React.forwardRef(\n ({ children, as = 'a', className, onSelect, disabled, ...rest }, ref) => {\n return (\n <MenuLink\n as={as}\n className={classNames(\n 'eds-overflow-menu__item',\n { 'eds-overflow-menu__item--disabled': disabled },\n className,\n )}\n onSelect={onSelect}\n disabled={disabled}\n ref={ref}\n {...rest}\n >\n {children}\n </MenuLink>\n );\n },\n) as Polymorphic.ForwardRefComponent<'a', OverflowMenuLinkProps>;\n","import React, { useEffect, useState } from 'react';\nimport classNames from 'classnames';\nimport { Menu, MenuList, MenuButton } from '@reach/menu-button';\n\nimport {\n LeftArrowIcon,\n RightArrowIcon,\n DownArrowIcon,\n UpArrowIcon,\n} from '@entur/icons';\nimport { VisuallyHidden } from '@entur/a11y';\nimport { useContrast } from '@entur/layout';\nimport { Label } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nimport { PaginationPage } from './PaginationPage';\nimport { PaginationInput } from './PaginationInput';\nimport { OverflowMenuItem } from './OverflowMenu';\n\nimport './Pagination.scss';\n\nexport type PaginationProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Sidenummeret som er aktivt nå (1-indeksert) */\n currentPage: number;\n /** Callback for når man ønsker å gå til en ny side */\n onPageChange: (requestedPage: number) => void;\n /** Antall sider totalt */\n pageCount: number;\n /**\n * Hva som blir lest opp når brukere av skjermlesere navigerer til \"forrige side knappen\"\n * @default \"Gå til forrige side\"\n */\n previousPageLabel?: string;\n /**\n * Hva som blir lest opp når brukere av skjermlesere navigerer til \"neste side knappen\"\n * @default \"Gå til neste side\"\n */\n nextPageLabel?: string;\n /**\n * Hva som blir lest opp når brukere av skjermlesere navigerer til \"forrige side knappen\"\n * @default pageNumber => `Gå til side ${pageNumber}`,\n */\n pageLabel?: (pageNumber: number) => string;\n /**\n * @default \"Nåværende side:\"\n */\n currentPageLabelForScreenreader?: string;\n /** Vis et felt til høyre for pagineringen hvor man kan angi siden man\n * ønsker å vise i et tekstfelt.\n *\n * @default false\n */\n showInput?: boolean;\n /** Label som vises til venstre for input-feltet som vises om `showInput` er true\n * @default \"Gå til side\"\n */\n inputLabel?: string;\n\n /** Hvor mange resultater man har totalt */\n nubmerOfResults?: number;\n /** Hvor mange resultater som vises per side */\n resultsPerPage?: number;\n /**\n * @default [10,25,50]\n */\n resultsPerPageOptions?: number[];\n /** Callback for når resultater per side oppdateres */\n onResultsPerPageChange?: (e: number) => void;\n /** Brukes for å skjule \"neste side\"-knappen\n * @default false\n */\n hideNextButton?: boolean;\n /** Brukes for å skjule \"forrige side\"-knappen\n * @default false\n */\n hidePrevButton?: boolean;\n /** Teksten som vises for hvilke resultater av sideantallet man viser.\n * @default `Viser resultat ${minPage} - ${maxPage} av ${pageCount}`\n */\n showingResultsLabel?: (\n minPage: number,\n maxPage: number,\n pageCount: number,\n ) => string;\n /** Teksten som vises før \"resultsPerPage\"-velgeren\n * @default \"Vis\"\n */\n showNumberOfResultsLabel?: string;\n [key: string]: any;\n};\n\nexport const Pagination: React.FC<PaginationProps> = ({\n className,\n currentPage,\n inputLabel,\n onPageChange,\n pageCount,\n pageLabel = pageNumber => `Gå til side ${pageNumber}`,\n previousPageLabel = 'Gå til forrige side',\n currentPageLabelForScreenreader = 'Nåværende side:',\n showInput,\n\n numberOfResults,\n resultsPerPage,\n resultsPerPageOptions = [10, 25, 50],\n onResultsPerPageChange,\n\n showNumberOfResultsLabel = 'Vis',\n nextPageLabel = 'Gå til neste side',\n showingResultsLabel = (minPage, maxPage, pageCount) =>\n `Viser resultat ${minPage} - ${maxPage} av ${pageCount}`,\n hideNextButton = false,\n hidePrevButton = false,\n ...rest\n}) => {\n const isContrast = useContrast();\n const [listedEntries, setListedEntries] = useState<Array<number | '…'>>([]);\n const paginationId = useRandomId('eds-pagination');\n\n const isFirstPostSelected = currentPage === 1;\n const isLastPostSelected = currentPage === pageCount;\n const noEllipsis = pageCount <= 7;\n const onlyLeadingEllipsis = !noEllipsis && currentPage < 5;\n const onlyTrailingEllipsis = !noEllipsis && pageCount - currentPage <= 3;\n\n useEffect(() => {\n if (pageCount < 1) return;\n if (noEllipsis) {\n setListedEntries(\n Array(pageCount)\n .fill(null)\n .map((_, i) => i + 1),\n );\n } else if (onlyLeadingEllipsis) {\n setListedEntries([1, 2, 3, 4, 5, '…', pageCount]);\n } else if (onlyTrailingEllipsis) {\n setListedEntries([\n 1,\n '…',\n pageCount - 4,\n pageCount - 3,\n pageCount - 2,\n pageCount - 1,\n pageCount,\n ]);\n } else {\n // leading and trailing ellipsis\n setListedEntries([\n 1,\n '…',\n currentPage - 1,\n currentPage,\n currentPage + 1,\n '…',\n pageCount,\n ]);\n }\n }, [\n noEllipsis,\n onlyLeadingEllipsis,\n onlyTrailingEllipsis,\n currentPage,\n pageCount,\n ]);\n\n if (pageCount < 1) {\n return null;\n }\n\n return (\n <div className={classNames('eds-pagination', className)} {...rest}>\n {resultsPerPage && numberOfResults && (\n <div className=\"eds-pagination__results\">\n {onResultsPerPageChange && (\n <Menu>\n {({ isOpen }) => (\n <>\n <Label>{showNumberOfResultsLabel}</Label>\n <MenuButton\n className={classNames('eds-pagination-menu__menu-button', {\n 'eds-pagination-menu__menu-button--open': isOpen,\n })}\n >\n <VisuallyHidden>{showNumberOfResultsLabel} </VisuallyHidden>\n {resultsPerPage}\n {isOpen ? <UpArrowIcon /> : <DownArrowIcon />}\n </MenuButton>\n <MenuList\n className={classNames(\n 'eds-pagination-menu__menu-list',\n 'eds-overflow-menu__menu-list',\n { 'eds-contrast': isContrast },\n )}\n >\n {resultsPerPageOptions.map(\n (option: number, key: number) => (\n <OverflowMenuItem\n key={key}\n onSelect={() => onResultsPerPageChange(option)}\n >\n {option}\n </OverflowMenuItem>\n ),\n )}\n </MenuList>\n </>\n )}\n </Menu>\n )}\n <Label className=\"eds-pagination__results-label\">\n {showingResultsLabel(\n (currentPage - 1) * resultsPerPage + 1,\n currentPage * resultsPerPage > numberOfResults\n ? numberOfResults\n : currentPage * resultsPerPage,\n numberOfResults,\n )}\n </Label>\n </div>\n )}\n <div className=\"eds-pagination__controls\">\n {!hidePrevButton && (\n <PaginationPage\n onClick={() => onPageChange(currentPage - 1)}\n aria-label={previousPageLabel}\n aria-describedby={paginationId}\n disabled={isFirstPostSelected}\n >\n <LeftArrowIcon />\n </PaginationPage>\n )}\n {listedEntries.map((entry, index) =>\n entry === '…' ? (\n <Ellipsis key={`ellipsis-${index}`} />\n ) : (\n <PaginationPage\n selected={entry === currentPage}\n onClick={() => onPageChange(entry)}\n aria-label={pageLabel(entry)}\n key={entry}\n >\n {entry}\n </PaginationPage>\n ),\n )}\n {!hideNextButton && (\n <PaginationPage\n onClick={() => onPageChange(currentPage + 1)}\n aria-label={nextPageLabel}\n aria-describedby={paginationId}\n disabled={isLastPostSelected}\n >\n <RightArrowIcon />\n </PaginationPage>\n )}\n {showInput && (\n <PaginationInput\n pageCount={pageCount}\n currentPage={currentPage}\n onPageChange={onPageChange}\n label={inputLabel}\n />\n )}\n </div>\n <VisuallyHidden id={paginationId}>\n {currentPageLabelForScreenreader} {currentPage}\n </VisuallyHidden>\n </div>\n );\n};\n\nconst Ellipsis: React.FC = () => (\n <span className=\"eds-pagination__ellipsis\" aria-hidden=\"true\">\n …\n </span>\n);\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles(\n 'menu',\n 'expand',\n 'icons',\n 'typography',\n 'button',\n 'layout',\n);\n\nexport * from './BreadcrumbNavigation';\nexport * from './BreadcrumbItem';\nexport * from './SideNavigation';\nexport * from './SideNavigationItem';\nexport * from './SideNavigationGroup';\nexport * from './TopNavigationItem';\nexport * from './Pagination';\nexport * from './Stepper';\nexport * from './OverflowMenu';\nexport * from './CollapsibleSideNavigation';\n","import React from 'react';\nimport classNames from 'classnames';\nimport { RightArrowIcon } from '@entur/icons';\nimport './BreadcrumbNavigation.scss';\nimport { PolymorphicPropsWithoutRef } from '@entur/utils';\n\nexport type BreadcrumbItemOwnProps = {\n /** Komponenten som rendres\n * @default \"a\"\n */\n as?: 'a' | React.ElementType;\n /** Teksten som vises */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** True om sist i listen. Settes automatisk av BreadcrumbNavigation-komponenten */\n isCurrent?: boolean;\n};\n\nexport type BreadcrumbItemProps<\n E extends React.ElementType = typeof defaultElement,\n> = PolymorphicPropsWithoutRef<BreadcrumbItemOwnProps, E>;\n\nconst defaultElement = 'a';\n\nexport const BreadcrumbItem = <\n E extends React.ElementType = typeof defaultElement,\n>({\n className,\n isCurrent,\n as,\n ...rest\n}: BreadcrumbItemProps<E>): JSX.Element => {\n const Element: React.ElementType = as || defaultElement;\n return (\n <>\n <li className={classNames('eds-breadcrumb__item', className)}>\n <Element\n aria-current={isCurrent ? 'page' : undefined}\n className={classNames('eds-breadcrumb__link', {\n 'eds-breadcrumb__link--current': isCurrent,\n })}\n {...rest}\n />\n </li>\n {!isCurrent && (\n <RightArrowIcon\n className=\"eds-breadcrumb__separator\"\n inline\n role=\"presentation\"\n />\n )}\n </>\n );\n};\n","import React from 'react';\nimport './BreadcrumbNavigation.scss';\n\nexport type BreadcrumbNavigationProps = {\n /** Label for brødsmulestien.\n * @default 'Brødsmulesti'\n */\n 'aria-label'?: string;\n /** En liste med BreadcrumbItem-er */\n children: React.ReactElement[];\n};\n\nexport const BreadcrumbNavigation: React.FC<BreadcrumbNavigationProps> = ({\n 'aria-label': ariaLabel = 'Brødsmulesti',\n children,\n}) => {\n return (\n <nav aria-label={ariaLabel}>\n <ol className=\"eds-breadcrumbs\">\n {React.Children.map(children, (child, index) =>\n React.cloneElement(child, {\n isCurrent: index + 1 === React.Children.count(children),\n }),\n )}\n </ol>\n </nav>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { BaseExpand, ExpandArrow } from '@entur/expand';\nimport { useSideNavigationContext } from './CollapsibleSideNavigation';\nimport { useShowDelayedLabel } from './useShowDelayedLabel';\nimport { useControllableProp } from './useControllableProp';\n\nexport type SideNavigationGroupProps = {\n /** Skal menygruppen være ekspandert by default? Kun relevant om komponenten ikke er kontrollert\n * @default false\n */\n defaultOpen?: boolean;\n /** Er menyen åpen? */\n open?: boolean;\n /** Kalles når menygruppen åpnes eller lukkes */\n onToggle?: (e?: boolean) => void;\n /** Ekstra klassenavn */\n className?: string;\n /** Menyen som skal grupperes */\n children: React.ReactNode;\n /** Overskriften til menyen */\n title: React.ReactNode;\n icon?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const SideNavigationGroup: React.FC<SideNavigationGroupProps> = ({\n defaultOpen = false,\n open,\n onToggle,\n className,\n children,\n title,\n icon,\n ...rest\n}) => {\n const [isOpen, setOpen] = useControllableProp({\n prop: open,\n updater: onToggle,\n defaultValue: defaultOpen,\n });\n const { isCollapsed } = useSideNavigationContext();\n\n const [showLabel] = useShowDelayedLabel(isCollapsed);\n\n return (\n <div\n className={classNames('eds-side-navigation-group', className)}\n {...rest}\n >\n <button\n onClick={() => setOpen(!isOpen)}\n type=\"button\"\n className=\"eds-side-navigation-group__trigger\"\n aria-label={`${title}, utvidbar meny, ${isOpen ? 'åpen' : 'lukket'}`}\n >\n <span>\n {icon && (\n <span className=\"eds-side-navigation-group__trigger-icon\">\n {icon}\n </span>\n )}\n {showLabel && title}\n </span>\n {showLabel && (\n <ExpandArrow\n open={isOpen}\n className=\"eds-side-navigation-group__expand-icon\"\n />\n )}\n </button>\n <BaseExpand open={isOpen}>{children}</BaseExpand>\n </div>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { Label } from '@entur/typography';\n\nimport './Stepper.scss';\n\nexport type StepperProps = {\n /** Det nåværende steget. */\n activeIndex: number;\n /** Oppdater state ved klikk. */\n onStepClick: (index: number) => void;\n /** Liste av steg. */\n steps: string[];\n /** Ekstra klassenavn. */\n className?: string;\n /** Om stepperen skal være et interaktivt-navigasjonselement eller ikke\n * @default false\n */\n interactive?: boolean;\n /** Om stepper skal vise indeksering av hvilket trinn man er på\n * @default true\n */\n showStepperIndex?: boolean;\n as?: 'button' | React.ElementType;\n [key: string]: any;\n};\n\nexport const Stepper: React.FC<StepperProps> = ({\n className,\n onStepClick,\n steps,\n activeIndex,\n interactive = false,\n showStepperIndex = true,\n ...rest\n}) => {\n const Element = interactive ? 'button' : 'div';\n return (\n <div className={classNames('eds-stepper', className)} {...rest}>\n {steps.map((step, i) => {\n const isActive = i === activeIndex;\n const hasBeenActive = activeIndex > i;\n const props = interactive ? { onClick: () => onStepClick(i) } : {};\n return (\n <Element\n key={step}\n className={classNames('eds-stepper__item__container', {\n 'eds-stepper__item__container--non-interactive': !interactive,\n })}\n aria-current={isActive ? 'step' : undefined}\n aria-label={`Steg ${i + 1} av ${steps.length}, ${step} ${\n hasBeenActive ? ', fullført' : ''\n }`}\n {...props}\n >\n <div\n className={classNames(\n 'eds-stepper__item__square',\n { 'eds-stepper__item__square--active': isActive },\n { 'eds-stepper__item__square--inactive': activeIndex < i },\n { 'eds-stepper__item__square--has-been': hasBeenActive },\n )}\n />\n <Label\n className={classNames(\n 'eds-stepper__item__label',\n {\n 'eds-stepper__item__label--has-been': hasBeenActive,\n },\n {\n 'eds-stepper__item__label--active': isActive,\n },\n )}\n >\n {showStepperIndex && i + 1 + '. ' + step}\n </Label>\n </Element>\n );\n })}\n </div>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport './TopNavigationItem.scss';\nimport { PolymorphicPropsWithoutRef } from '@entur/utils';\n\nexport type TopNavigationItemOwnProps = {\n /** Om komponenten vises som valgt eller ikke\n * @default false\n */\n active?: boolean;\n /** Tekste som vises */\n children: React.ReactNode;\n /** HTML-elementet eller React-komponenten som lager komponenten\n * @default 'a'\n */\n as?: 'a' | React.ElementType;\n /** Ekstra klassenavn */\n className?: string;\n};\n\nexport type TopNavigationItemProps<\n E extends React.ElementType = typeof defaultElement,\n> = PolymorphicPropsWithoutRef<TopNavigationItemOwnProps, E>;\n\nconst defaultElement = 'a';\n\nexport const TopNavigationItem = <\n E extends React.ElementType = typeof defaultElement,\n>({\n active = false,\n className,\n as,\n ...rest\n}: TopNavigationItemProps<E>): JSX.Element => {\n const Element: React.ElementType = as || defaultElement;\n return (\n <Element\n className={classNames([\n 'eds-top-navigation-item',\n className,\n { 'eds-top-navigation-item--active': active },\n ])}\n {...rest}\n />\n );\n};\n"],"names":["SideNavigation","className","children","size","rest","React","Children","count","classNames","useControllableProp","prop","updater","useState","defaultValue","internalState","setInternalState","useEffect","undefined","__IS_ENTUR_MENU__","SideNavigationContext","createContext","isCollapsed","useSideNavigationContext","context","useContext","console","error","useShowDelayedLabel","showLabel","setShowLabel","setTimeout","isActiveRecursively","child","props","active","toArray","some","BaseSideNavigationItem","forwardRef","ref","subMenu","icon","as","Element","DisabledSideNavigationItem","disabled","SideNavigationItem","forceExpandSubMenus","childrenArray","find","type","label","filter","isExpanded","PaginationPage","selected","onClick","ariaLabel","ariaDescribedby","PaginationInput","currentPage","pageCount","onPageChange","String","input","setInput","onSubmit","e","preventDefault","stopPropagation","pageNumber","Number","isNaN","noValidate","max","value","onChange","target","OverflowMenuItem","onSelect","MenuItem","OverflowMenuLink","MenuLink","Ellipsis","warnAboutMissingStyles","isCurrent","RightArrowIcon","inline","role","map","index","cloneElement","collapsible","collapsed","onCollapseToggle","collapsibleButtonPosition","openSideMenuAriaLabel","closeSideMenuAriaLabel","collapsedMenu","setCollapsedMenu","Provider","style","top","MenuIcon","LeftArrowIcon","button","position","Menu","MenuButton","IconButton","VerticalDotsIcon","useContrast","Contrast","MenuList","portal","inputLabel","pageLabel","previousPageLabel","currentPageLabelForScreenreader","showInput","numberOfResults","resultsPerPage","resultsPerPageOptions","onResultsPerPageChange","showNumberOfResultsLabel","nextPageLabel","showingResultsLabel","minPage","maxPage","hideNextButton","hidePrevButton","isContrast","listedEntries","setListedEntries","paginationId","useRandomId","isFirstPostSelected","isLastPostSelected","noEllipsis","onlyLeadingEllipsis","onlyTrailingEllipsis","Array","fill","_","i","isOpen","Label","VisuallyHidden","UpArrowIcon","DownArrowIcon","option","key","entry","id","defaultOpen","open","onToggle","title","setOpen","ExpandArrow","BaseExpand","onStepClick","steps","activeIndex","interactive","showStepperIndex","step","isActive","hasBeenActive","length"],"mappings":"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"}
package/dist/menu.esm.js CHANGED
@@ -1,11 +1,12 @@
1
- import { warnAboutMissingStyles } from '@entur/utils';
1
+ import { useRandomId, warnAboutMissingStyles } from '@entur/utils';
2
2
  import React, { useState, useEffect, cloneElement } from 'react';
3
3
  import classNames from 'classnames';
4
4
  import { RightArrowIcon, MenuIcon, LeftArrowIcon, VerticalDotsIcon, UpArrowIcon, DownArrowIcon } from '@entur/icons';
5
5
  import { ExpandArrow, BaseExpand } from '@entur/expand';
6
6
  import { Menu, MenuButton, MenuList, MenuItem, MenuLink } from '@reach/menu-button';
7
- import { Label } from '@entur/typography';
7
+ import { VisuallyHidden } from '@entur/a11y';
8
8
  import { useContrast, Contrast } from '@entur/layout';
9
+ import { Label } from '@entur/typography';
9
10
  import { IconButton } from '@entur/button';
10
11
 
11
12
  var BreadcrumbNavigation = function BreadcrumbNavigation(_ref) {
@@ -121,7 +122,7 @@ function useControllableProp(_ref) {
121
122
  return prop === undefined ? [internalState, setInternalState] : [prop, updater];
122
123
  }
123
124
 
124
- var _excluded$6 = ["className", "children", "size", "collapsed", "onCollapseToggle", "collapsibleButtonPosition"];
125
+ var _excluded$6 = ["className", "children", "size", "collapsed", "onCollapseToggle", "collapsibleButtonPosition", "openSideMenuAriaLabel", "closeSideMenuAriaLabel"];
125
126
  var CollapsibleSideNavigation = function CollapsibleSideNavigation(_ref) {
126
127
  var className = _ref.className,
127
128
  children = _ref.children,
@@ -130,6 +131,10 @@ var CollapsibleSideNavigation = function CollapsibleSideNavigation(_ref) {
130
131
  onCollapseToggle = _ref.onCollapseToggle,
131
132
  _ref$collapsibleButto = _ref.collapsibleButtonPosition,
132
133
  collapsibleButtonPosition = _ref$collapsibleButto === void 0 ? '50%' : _ref$collapsibleButto,
134
+ _ref$openSideMenuAria = _ref.openSideMenuAriaLabel,
135
+ openSideMenuAriaLabel = _ref$openSideMenuAria === void 0 ? 'Åpne sidemeny' : _ref$openSideMenuAria,
136
+ _ref$closeSideMenuAri = _ref.closeSideMenuAriaLabel,
137
+ closeSideMenuAriaLabel = _ref$closeSideMenuAri === void 0 ? 'Lukk sidemeny' : _ref$closeSideMenuAri,
133
138
  rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
134
139
 
135
140
  var _useControllableProp = useControllableProp({
@@ -158,7 +163,11 @@ var CollapsibleSideNavigation = function CollapsibleSideNavigation(_ref) {
158
163
  style: {
159
164
  top: "" + collapsibleButtonPosition
160
165
  }
161
- }, collapsedMenu ? React.createElement(MenuIcon, null) : React.createElement(LeftArrowIcon, null))));
166
+ }, collapsedMenu ? React.createElement(MenuIcon, {
167
+ "aria-label": openSideMenuAriaLabel
168
+ }) : React.createElement(LeftArrowIcon, {
169
+ "aria-label": closeSideMenuAriaLabel
170
+ }))));
162
171
  };
163
172
  var SideNavigationContext = /*#__PURE__*/React.createContext({
164
173
  isCollapsed: false
@@ -247,6 +256,8 @@ var BaseSideNavigationItem = /*#__PURE__*/React.forwardRef(function (_ref, ref)
247
256
  className: classNames('eds-side-navigation__click-target', {
248
257
  'eds-side-navigation__click-target--active': active
249
258
  }),
259
+ "aria-label": icon ? children : undefined,
260
+ "aria-current": active ? 'page' : undefined,
250
261
  ref: ref
251
262
  }, rest), icon, showLabel && children), subMenu);
252
263
  });
@@ -341,7 +352,8 @@ var SideNavigationGroup = function SideNavigationGroup(_ref) {
341
352
  return setOpen(!isOpen);
342
353
  },
343
354
  type: "button",
344
- className: "eds-side-navigation-group__trigger"
355
+ className: "eds-side-navigation-group__trigger",
356
+ "aria-label": title + ", utvidbar meny, " + (isOpen ? 'åpen' : 'lukket')
345
357
  }, React.createElement("span", null, icon && React.createElement("span", {
346
358
  className: "eds-side-navigation-group__trigger-icon"
347
359
  }, icon), showLabel && title), showLabel && React.createElement(ExpandArrow, {
@@ -375,7 +387,8 @@ var PaginationPage = function PaginationPage(_ref) {
375
387
  selected = _ref.selected,
376
388
  disabled = _ref.disabled,
377
389
  onClick = _ref.onClick,
378
- ariaLabel = _ref['aria-label'];
390
+ ariaLabel = _ref['aria-label'],
391
+ ariaDescribedby = _ref['aria-describedby'];
379
392
  return React.createElement("button", {
380
393
  className: classNames('eds-pagination__page', {
381
394
  'eds-pagination__page--selected': selected
@@ -386,6 +399,7 @@ var PaginationPage = function PaginationPage(_ref) {
386
399
  type: "button",
387
400
  onClick: onClick,
388
401
  "aria-label": ariaLabel,
402
+ "aria-describedby": ariaDescribedby,
389
403
  "aria-current": selected ? 'page' : false
390
404
  }, children);
391
405
  };
@@ -520,7 +534,7 @@ var OverflowMenuLink = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
520
534
  }, rest), children);
521
535
  });
522
536
 
523
- var _excluded$1 = ["className", "currentPage", "inputLabel", "onPageChange", "pageCount", "pageLabel", "previousPageLabel", "showInput", "numberOfResults", "resultsPerPage", "resultsPerPageOptions", "onResultsPerPageChange", "showNumberOfResultsLabel", "nextPageLabel", "showingResultsLabel", "hideNextButton", "hidePrevButton"];
537
+ var _excluded$1 = ["className", "currentPage", "inputLabel", "onPageChange", "pageCount", "pageLabel", "previousPageLabel", "currentPageLabelForScreenreader", "showInput", "numberOfResults", "resultsPerPage", "resultsPerPageOptions", "onResultsPerPageChange", "showNumberOfResultsLabel", "nextPageLabel", "showingResultsLabel", "hideNextButton", "hidePrevButton"];
524
538
  var Pagination = function Pagination(_ref) {
525
539
  var className = _ref.className,
526
540
  currentPage = _ref.currentPage,
@@ -533,6 +547,8 @@ var Pagination = function Pagination(_ref) {
533
547
  } : _ref$pageLabel,
534
548
  _ref$previousPageLabe = _ref.previousPageLabel,
535
549
  previousPageLabel = _ref$previousPageLabe === void 0 ? 'Gå til forrige side' : _ref$previousPageLabe,
550
+ _ref$currentPageLabel = _ref.currentPageLabelForScreenreader,
551
+ currentPageLabelForScreenreader = _ref$currentPageLabel === void 0 ? 'Nåværende side:' : _ref$currentPageLabel,
536
552
  showInput = _ref.showInput,
537
553
  numberOfResults = _ref.numberOfResults,
538
554
  resultsPerPage = _ref.resultsPerPage,
@@ -559,6 +575,7 @@ var Pagination = function Pagination(_ref) {
559
575
  listedEntries = _useState[0],
560
576
  setListedEntries = _useState[1];
561
577
 
578
+ var paginationId = useRandomId('eds-pagination');
562
579
  var isFirstPostSelected = currentPage === 1;
563
580
  var isLastPostSelected = currentPage === pageCount;
564
581
  var noEllipsis = pageCount <= 7;
@@ -595,7 +612,7 @@ var Pagination = function Pagination(_ref) {
595
612
  className: classNames('eds-pagination-menu__menu-button', {
596
613
  'eds-pagination-menu__menu-button--open': isOpen
597
614
  })
598
- }, resultsPerPage, isOpen ? React.createElement(UpArrowIcon, null) : React.createElement(DownArrowIcon, null)), React.createElement(MenuList, {
615
+ }, React.createElement(VisuallyHidden, null, showNumberOfResultsLabel, " "), resultsPerPage, isOpen ? React.createElement(UpArrowIcon, null) : React.createElement(DownArrowIcon, null)), React.createElement(MenuList, {
599
616
  className: classNames('eds-pagination-menu__menu-list', 'eds-overflow-menu__menu-list', {
600
617
  'eds-contrast': isContrast
601
618
  })
@@ -616,6 +633,7 @@ var Pagination = function Pagination(_ref) {
616
633
  return onPageChange(currentPage - 1);
617
634
  },
618
635
  "aria-label": previousPageLabel,
636
+ "aria-describedby": paginationId,
619
637
  disabled: isFirstPostSelected
620
638
  }, React.createElement(LeftArrowIcon, null)), listedEntries.map(function (entry, index) {
621
639
  return entry === '…' ? React.createElement(Ellipsis, {
@@ -633,13 +651,16 @@ var Pagination = function Pagination(_ref) {
633
651
  return onPageChange(currentPage + 1);
634
652
  },
635
653
  "aria-label": nextPageLabel,
654
+ "aria-describedby": paginationId,
636
655
  disabled: isLastPostSelected
637
656
  }, React.createElement(RightArrowIcon, null)), showInput && React.createElement(PaginationInput, {
638
657
  pageCount: pageCount,
639
658
  currentPage: currentPage,
640
659
  onPageChange: onPageChange,
641
660
  label: inputLabel
642
- })));
661
+ })), React.createElement(VisuallyHidden, {
662
+ id: paginationId
663
+ }, currentPageLabelForScreenreader, " ", currentPage));
643
664
  };
644
665
 
645
666
  var Ellipsis = function Ellipsis() {
@@ -676,7 +697,9 @@ var Stepper = function Stepper(_ref) {
676
697
  key: step,
677
698
  className: classNames('eds-stepper__item__container', {
678
699
  'eds-stepper__item__container--non-interactive': !interactive
679
- })
700
+ }),
701
+ "aria-current": isActive ? 'step' : undefined,
702
+ "aria-label": "Steg " + (i + 1) + " av " + steps.length + ", " + step + " " + (hasBeenActive ? ', fullført' : '')
680
703
  }, props), React.createElement("div", {
681
704
  className: classNames('eds-stepper__item__square', {
682
705
  'eds-stepper__item__square--active': isActive
@@ -691,7 +714,7 @@ var Stepper = function Stepper(_ref) {
691
714
  }, {
692
715
  'eds-stepper__item__label--active': isActive
693
716
  })
694
- }, showStepperIndex && i + 1 + '.', " ", step));
717
+ }, showStepperIndex && i + 1 + '. ' + step));
695
718
  }));
696
719
  };
697
720