@digigov/react-core 0.19.0 → 0.20.0-navlist.alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -34,6 +34,7 @@ var NavHorizontalListItemButton = /*#__PURE__*/_react["default"].forwardRef(func
34
34
  return /*#__PURE__*/_react["default"].createElement(_Button["default"], (0, _extends2["default"])({
35
35
  variant: "link",
36
36
  ref: ref,
37
+ "aria-selected": active,
37
38
  className: (0, _clsx["default"])(className, active === true && 'govgr-horizontal-nav__list-item-btn--active', true && 'govgr-horizontal-nav__list-item-btn')
38
39
  }, props), children, arrow && /*#__PURE__*/_react["default"].createElement(_ArrowIcon["default"], {
39
40
  direction: active ? 'up' : 'down'
@@ -1,10 +1,16 @@
1
1
  import React from 'react';
2
2
  import { BaseProps } from '@digigov/react-core/Base';
3
3
  export interface NavMenuProps extends BaseProps<'div'> {
4
+ /**
5
+ * active is optional.
6
+ * Exaclty one NavMenu should be active every time.
7
+ * This declares that this content is active and should depend of the 'selected' NavItem.
8
+ */
9
+ active?: boolean;
4
10
  }
5
11
  /**
6
12
  * NavMenu is the main menu component.
7
13
  * Inside this component must be NavMenuContainer component.
8
14
  */
9
- export declare const NavMenu: React.ForwardRefExoticComponent<Pick<NavMenuProps, "slot" | "style" | "title" | "as" | "className" | "color" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "margin" | "marginTop" | "marginBottom" | "marginLeft" | "marginRight" | "padding" | "paddingTop" | "paddingBottom" | "paddingLeft" | "paddingRight" | "printHidden"> & React.RefAttributes<HTMLDivElement>>;
15
+ export declare const NavMenu: React.ForwardRefExoticComponent<Pick<NavMenuProps, "slot" | "style" | "title" | "as" | "className" | "color" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "margin" | "marginTop" | "marginBottom" | "marginLeft" | "marginRight" | "padding" | "paddingTop" | "paddingBottom" | "paddingLeft" | "paddingRight" | "printHidden" | "active"> & React.RefAttributes<HTMLDivElement>>;
10
16
  export default NavMenu;
package/NavMenu/index.js CHANGED
@@ -17,20 +17,22 @@ var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
17
17
 
18
18
  var _clsx = _interopRequireDefault(require("clsx"));
19
19
 
20
- var _excluded = ["className", "children"];
20
+ var _excluded = ["active", "className", "children"];
21
21
 
22
22
  /**
23
23
  * NavMenu is the main menu component.
24
24
  * Inside this component must be NavMenuContainer component.
25
25
  */
26
26
  var NavMenu = /*#__PURE__*/_react["default"].forwardRef(function NavMenu(_ref, ref) {
27
- var className = _ref.className,
27
+ var active = _ref.active,
28
+ className = _ref.className,
28
29
  children = _ref.children,
29
30
  props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
30
31
  return /*#__PURE__*/_react["default"].createElement(_Base["default"], (0, _extends2["default"])({
31
32
  as: "div",
32
33
  ref: ref,
33
- className: (0, _clsx["default"])(className, true && 'govgr-nav-list__menu')
34
+ "aria-hidden": !active,
35
+ className: (0, _clsx["default"])(className, !active && 'govgr-nav-list__menu-hidden', true && 'govgr-nav-list__menu')
34
36
  }, props), children);
35
37
  });
36
38
 
@@ -20,6 +20,7 @@ export var NavHorizontalListItemButton = /*#__PURE__*/React.forwardRef(function
20
20
  return /*#__PURE__*/React.createElement(Button, _extends({
21
21
  variant: "link",
22
22
  ref: ref,
23
+ "aria-selected": active,
23
24
  className: clsx(className, active === true && 'govgr-horizontal-nav__list-item-btn--active', true && 'govgr-horizontal-nav__list-item-btn')
24
25
  }, props), children, arrow && /*#__PURE__*/React.createElement(ArrowIcon, {
25
26
  direction: active ? 'up' : 'down'
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["className", "children"];
3
+ var _excluded = ["active", "className", "children"];
4
4
  import React from 'react';
5
5
  import Base from '@digigov/react-core/Base';
6
6
  import clsx from 'clsx';
@@ -10,14 +10,16 @@ import clsx from 'clsx';
10
10
  * Inside this component must be NavMenuContainer component.
11
11
  */
12
12
  export var NavMenu = /*#__PURE__*/React.forwardRef(function NavMenu(_ref, ref) {
13
- var className = _ref.className,
13
+ var active = _ref.active,
14
+ className = _ref.className,
14
15
  children = _ref.children,
15
16
  props = _objectWithoutProperties(_ref, _excluded);
16
17
 
17
18
  return /*#__PURE__*/React.createElement(Base, _extends({
18
19
  as: "div",
19
20
  ref: ref,
20
- className: clsx(className, true && 'govgr-nav-list__menu')
21
+ "aria-hidden": !active,
22
+ className: clsx(className, !active && 'govgr-nav-list__menu-hidden', true && 'govgr-nav-list__menu')
21
23
  }, props), children);
22
24
  });
23
25
  export default NavMenu;
@@ -20,6 +20,7 @@ export var NavHorizontalListItemButton = /*#__PURE__*/React.forwardRef(function
20
20
  return /*#__PURE__*/React.createElement(Button, _extends({
21
21
  variant: "link",
22
22
  ref: ref,
23
+ "aria-selected": active,
23
24
  className: clsx(className, active === true && 'govgr-horizontal-nav__list-item-btn--active', true && 'govgr-horizontal-nav__list-item-btn')
24
25
  }, props), children, arrow && /*#__PURE__*/React.createElement(ArrowIcon, {
25
26
  direction: active ? 'up' : 'down'
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["className", "children"];
3
+ var _excluded = ["active", "className", "children"];
4
4
  import React from 'react';
5
5
  import Base from '@digigov/react-core/Base';
6
6
  import clsx from 'clsx';
@@ -10,14 +10,16 @@ import clsx from 'clsx';
10
10
  * Inside this component must be NavMenuContainer component.
11
11
  */
12
12
  export var NavMenu = /*#__PURE__*/React.forwardRef(function NavMenu(_ref, ref) {
13
- var className = _ref.className,
13
+ var active = _ref.active,
14
+ className = _ref.className,
14
15
  children = _ref.children,
15
16
  props = _objectWithoutProperties(_ref, _excluded);
16
17
 
17
18
  return /*#__PURE__*/React.createElement(Base, _extends({
18
19
  as: "div",
19
20
  ref: ref,
20
- className: clsx(className, true && 'govgr-nav-list__menu')
21
+ "aria-hidden": !active,
22
+ className: clsx(className, !active && 'govgr-nav-list__menu-hidden', true && 'govgr-nav-list__menu')
21
23
  }, props), children);
22
24
  });
23
25
  export default NavMenu;
package/esm/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license Digigov v0.19.0
1
+ /** @license Digigov v0.20.0-navlist.alpha.1
2
2
  *
3
3
  * This source code is licensed under the BSD-2-Clause license found in the
4
4
  * LICENSE file in the root directory of this source tree.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@digigov/react-core",
3
- "version": "0.19.0",
3
+ "version": "0.20.0-navlist.alpha.1",
4
4
  "description": "@digigov react core components",
5
5
  "author": "GRNET Developers <devs@lists.grnet.gr>",
6
6
  "license": "BSD-2-Clause",
@@ -11,11 +11,12 @@
11
11
  "directory": "dist"
12
12
  },
13
13
  "peerDependencies": {
14
- "@digigov/css": "0.30.0",
14
+ "@digigov/css": "0.30.1-navlist.alpha.1",
15
15
  "clsx": "1.1.1",
16
16
  "react": "^16.8.0 || ^17.0.0",
17
17
  "react-dom": "^16.8.0 || ^17.0.0"
18
18
  },
19
+ "dependencies": {},
19
20
  "private": false,
20
21
  "typings": "./index.d.ts"
21
22
  }
@@ -32,6 +32,7 @@ export const NavHorizontalListItemButton = React.forwardRef<
32
32
  <Button
33
33
  variant="link"
34
34
  ref={ref}
35
+ aria-selected={active}
35
36
  className={clsx(className, {
36
37
  'govgr-horizontal-nav__list-item-btn': true,
37
38
  'govgr-horizontal-nav__list-item-btn--active': active === true,
@@ -2,19 +2,28 @@ import React from 'react';
2
2
  import Base, { BaseProps } from '@digigov/react-core/Base';
3
3
  import clsx from 'clsx';
4
4
 
5
- export interface NavMenuProps extends BaseProps<'div'> {}
5
+ export interface NavMenuProps extends BaseProps<'div'> {
6
+ /**
7
+ * active is optional.
8
+ * Exaclty one NavMenu should be active every time.
9
+ * This declares that this content is active and should depend of the 'selected' NavItem.
10
+ */
11
+ active?: boolean;
12
+ }
6
13
  /**
7
14
  * NavMenu is the main menu component.
8
15
  * Inside this component must be NavMenuContainer component.
9
16
  */
10
17
  export const NavMenu = React.forwardRef<HTMLDivElement, NavMenuProps>(
11
- function NavMenu({ className, children, ...props }, ref) {
18
+ function NavMenu({ active, className, children, ...props }, ref) {
12
19
  return (
13
20
  <Base
14
21
  as="div"
15
22
  ref={ref}
23
+ aria-hidden={!active}
16
24
  className={clsx(className, {
17
25
  'govgr-nav-list__menu': true,
26
+ 'govgr-nav-list__menu-hidden': !active,
18
27
  })}
19
28
  {...props}
20
29
  >