@entur/menu 4.0.10 → 4.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -0
- package/dist/PaginationPage.d.ts +2 -0
- package/dist/menu.cjs.development.js +39 -23
- package/dist/menu.cjs.development.js.map +1 -1
- package/dist/menu.cjs.production.min.js +1 -1
- package/dist/menu.cjs.production.min.js.map +1 -1
- package/dist/menu.esm.js +39 -23
- package/dist/menu.esm.js.map +1 -1
- package/dist/styles.css +61 -51
- package/package.json +7 -7
|
@@ -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 = () => {},\n defaultValue,\n}: UseControllablePropType<T>): [T, Function] {\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) => {\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 () => {};\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: <E extends React.ElementType = typeof defaultElementBaseItem>(\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: <E extends React.ElementType = typeof defaultElementItem>(\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 /** 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 onClick,\n 'aria-label': ariaLabel,\n}) => (\n <button\n className={classNames(\n 'eds-pagination__page',\n { 'eds-pagination__page--selected': selected },\n className,\n )}\n disabled={selected}\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>\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 from 'react';\nimport classNames from 'classnames';\nimport { LeftArrowIcon, RightArrowIcon } from '@entur/icons';\nimport { PaginationPage } from './PaginationPage';\nimport './Pagination.scss';\nimport { Menu, MenuList, MenuButton } from '@reach/menu-button';\nimport { DownArrowIcon, UpArrowIcon } from '@entur/icons';\nimport { PaginationInput } from './PaginationInput';\nimport { Label } from '@entur/typography';\nimport { OverflowMenuItem } from './OverflowMenu';\nimport { useContrast } from '@entur/layout';\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 if (pageCount < 1) {\n return null;\n }\n\n const isFirstPostSelected = currentPage === 1;\n const isLastPostSelected = currentPage === pageCount;\n const showLeadingEllipsis = currentPage > 5 && pageCount > 7;\n const showTrailingEllipsis = pageCount - currentPage > 4 && pageCount > 7;\n\n let entries: Array<number | '…'> = Array(pageCount)\n .fill(null)\n .map((_, i) => i + 1);\n\n if (showLeadingEllipsis) {\n entries = [\n 1,\n '…',\n currentPage - 2,\n currentPage - 1,\n currentPage,\n ...entries.slice(currentPage),\n ];\n }\n if (showTrailingEllipsis) {\n const currentPageIndex = entries.indexOf(currentPage);\n entries = [\n ...entries.slice(0, currentPageIndex),\n currentPage,\n currentPage + 1,\n currentPage + 2,\n '…',\n pageCount,\n ];\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 {!isFirstPostSelected && !hidePrevButton && (\n <PaginationPage\n onClick={() => onPageChange(currentPage - 1)}\n aria-label={previousPageLabel}\n >\n <LeftArrowIcon />\n </PaginationPage>\n )}\n {entries.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 {!isLastPostSelected && !hideNextButton && (\n <PaginationPage\n onClick={() => onPageChange(currentPage + 1)}\n aria-label={nextPageLabel}\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","isFirstPostSelected","isLastPostSelected","showLeadingEllipsis","showTrailingEllipsis","entries","Array","fill","_","i","slice","currentPageIndex","indexOf","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 = () => {},\n defaultValue,\n}: UseControllablePropType<T>): [T, Function] {\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) => {\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 () => {};\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: <E extends React.ElementType = typeof defaultElementBaseItem>(\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: <E extends React.ElementType = typeof defaultElementItem>(\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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"}
|
package/dist/menu.esm.js
CHANGED
|
@@ -5,8 +5,8 @@ import { RightArrowIcon, MenuIcon, LeftArrowIcon, VerticalDotsIcon, UpArrowIcon,
|
|
|
5
5
|
import { ExpandArrow, BaseExpand } from '@entur/expand';
|
|
6
6
|
import { Menu, MenuButton, MenuList, MenuItem, MenuLink } from '@reach/menu-button';
|
|
7
7
|
import { Label } from '@entur/typography';
|
|
8
|
-
import { IconButton } from '@entur/button';
|
|
9
8
|
import { useContrast, Contrast } from '@entur/layout';
|
|
9
|
+
import { IconButton } from '@entur/button';
|
|
10
10
|
|
|
11
11
|
var BreadcrumbNavigation = function BreadcrumbNavigation(_ref) {
|
|
12
12
|
var _ref$ariaLabel = _ref['aria-label'],
|
|
@@ -369,13 +369,16 @@ var PaginationPage = function PaginationPage(_ref) {
|
|
|
369
369
|
var children = _ref.children,
|
|
370
370
|
className = _ref.className,
|
|
371
371
|
selected = _ref.selected,
|
|
372
|
+
disabled = _ref.disabled,
|
|
372
373
|
onClick = _ref.onClick,
|
|
373
374
|
ariaLabel = _ref['aria-label'];
|
|
374
375
|
return React.createElement("button", {
|
|
375
376
|
className: classNames('eds-pagination__page', {
|
|
376
377
|
'eds-pagination__page--selected': selected
|
|
378
|
+
}, {
|
|
379
|
+
'eds-pagination__page--disabled': disabled
|
|
377
380
|
}, className),
|
|
378
|
-
disabled: selected,
|
|
381
|
+
disabled: selected || disabled,
|
|
379
382
|
type: "button",
|
|
380
383
|
onClick: onClick,
|
|
381
384
|
"aria-label": ariaLabel,
|
|
@@ -433,7 +436,9 @@ var PaginationInput = function PaginationInput(_ref) {
|
|
|
433
436
|
onSubmit: handleSubmit,
|
|
434
437
|
noValidate: true,
|
|
435
438
|
"aria-label": "form"
|
|
436
|
-
}, React.createElement("label",
|
|
439
|
+
}, React.createElement("label", {
|
|
440
|
+
className: "eds-pagination__input-wrapper"
|
|
441
|
+
}, React.createElement("span", {
|
|
437
442
|
className: "eds-pagination__input-label"
|
|
438
443
|
}, label), React.createElement("input", {
|
|
439
444
|
type: "number",
|
|
@@ -546,25 +551,34 @@ var Pagination = function Pagination(_ref) {
|
|
|
546
551
|
|
|
547
552
|
var isContrast = useContrast();
|
|
548
553
|
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
554
|
+
var _useState = useState([]),
|
|
555
|
+
listedEntries = _useState[0],
|
|
556
|
+
setListedEntries = _useState[1];
|
|
552
557
|
|
|
553
558
|
var isFirstPostSelected = currentPage === 1;
|
|
554
559
|
var isLastPostSelected = currentPage === pageCount;
|
|
555
|
-
var
|
|
556
|
-
var
|
|
557
|
-
var
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
560
|
+
var noEllipsis = pageCount <= 7;
|
|
561
|
+
var onlyLeadingEllipsis = !noEllipsis && currentPage < 5;
|
|
562
|
+
var onlyTrailingEllipsis = !noEllipsis && pageCount - currentPage <= 3;
|
|
563
|
+
useEffect(function () {
|
|
564
|
+
if (pageCount < 1) return;
|
|
565
|
+
|
|
566
|
+
if (noEllipsis) {
|
|
567
|
+
setListedEntries(Array(pageCount).fill(null).map(function (_, i) {
|
|
568
|
+
return i + 1;
|
|
569
|
+
}));
|
|
570
|
+
} else if (onlyLeadingEllipsis) {
|
|
571
|
+
setListedEntries([1, 2, 3, 4, 5, '…', pageCount]);
|
|
572
|
+
} else if (onlyTrailingEllipsis) {
|
|
573
|
+
setListedEntries([1, '…', pageCount - 4, pageCount - 3, pageCount - 2, pageCount - 1, pageCount]);
|
|
574
|
+
} else {
|
|
575
|
+
// leading and trailing ellipsis
|
|
576
|
+
setListedEntries([1, '…', currentPage - 1, currentPage, currentPage + 1, '…', pageCount]);
|
|
577
|
+
}
|
|
578
|
+
}, [noEllipsis, onlyLeadingEllipsis, onlyTrailingEllipsis, currentPage, pageCount]);
|
|
564
579
|
|
|
565
|
-
if (
|
|
566
|
-
|
|
567
|
-
entries = [].concat(entries.slice(0, currentPageIndex), [currentPage, currentPage + 1, currentPage + 2, '…', pageCount]);
|
|
580
|
+
if (pageCount < 1) {
|
|
581
|
+
return null;
|
|
568
582
|
}
|
|
569
583
|
|
|
570
584
|
return React.createElement("div", _extends({
|
|
@@ -593,12 +607,13 @@ var Pagination = function Pagination(_ref) {
|
|
|
593
607
|
className: "eds-pagination__results-label"
|
|
594
608
|
}, showingResultsLabel((currentPage - 1) * resultsPerPage + 1, currentPage * resultsPerPage > numberOfResults ? numberOfResults : currentPage * resultsPerPage, numberOfResults))), React.createElement("div", {
|
|
595
609
|
className: "eds-pagination__controls"
|
|
596
|
-
}, !
|
|
610
|
+
}, !hidePrevButton && React.createElement(PaginationPage, {
|
|
597
611
|
onClick: function onClick() {
|
|
598
612
|
return onPageChange(currentPage - 1);
|
|
599
613
|
},
|
|
600
|
-
"aria-label": previousPageLabel
|
|
601
|
-
|
|
614
|
+
"aria-label": previousPageLabel,
|
|
615
|
+
disabled: isFirstPostSelected
|
|
616
|
+
}, React.createElement(LeftArrowIcon, null)), listedEntries.map(function (entry, index) {
|
|
602
617
|
return entry === '…' ? React.createElement(Ellipsis, {
|
|
603
618
|
key: "ellipsis-" + index
|
|
604
619
|
}) : React.createElement(PaginationPage, {
|
|
@@ -609,11 +624,12 @@ var Pagination = function Pagination(_ref) {
|
|
|
609
624
|
"aria-label": pageLabel(entry),
|
|
610
625
|
key: entry
|
|
611
626
|
}, entry);
|
|
612
|
-
}), !
|
|
627
|
+
}), !hideNextButton && React.createElement(PaginationPage, {
|
|
613
628
|
onClick: function onClick() {
|
|
614
629
|
return onPageChange(currentPage + 1);
|
|
615
630
|
},
|
|
616
|
-
"aria-label": nextPageLabel
|
|
631
|
+
"aria-label": nextPageLabel,
|
|
632
|
+
disabled: isLastPostSelected
|
|
617
633
|
}, React.createElement(RightArrowIcon, null)), showInput && React.createElement(PaginationInput, {
|
|
618
634
|
pageCount: pageCount,
|
|
619
635
|
currentPage: currentPage,
|