@react-aria/landmark - npm Package Compare versions

Comparing version 3.0.0-alpha.0 to 3.0.0-alpha.1

dist/main.js

 var $8Ore6$react = require("react");
 var $8Ore6$reactariautils = require("@react-aria/utils");
 
-function $parcel$exportWildcard(dest, source) {
-  Object.keys(source).forEach(function(key) {
-    if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
-      return;
-    }
-
-    Object.defineProperty(dest, key, {
-      enumerable: true,
-      get: function get() {
-        return source[key];
-      }
-    });
-  });
-
-  return dest;
-}
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
-var $202c109aedff6705$exports = {};
 
-$parcel$export($202c109aedff6705$exports, "useLandmark", () => $202c109aedff6705$export$4cc632584fd87fae);
+$parcel$export(module.exports, "useLandmark", () => $202c109aedff6705$export$4cc632584fd87fae);
 
@@ -299,5 +282,4 @@
 
-$parcel$exportWildcard(module.exports, $202c109aedff6705$exports);
 
 
 //# sourceMappingURL=main.js.map

dist/module.js

 import {useState as $TvsbU$useState, useCallback as $TvsbU$useCallback, useEffect as $TvsbU$useEffect} from "react";
 import {useLayoutEffect as $TvsbU$useLayoutEffect} from "@react-aria/utils";
 
-function $parcel$export(e, n, v, s) {
-  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
-}
-var $a86207c5d7f7e1fb$exports = {};
 
-$parcel$export($a86207c5d7f7e1fb$exports, "useLandmark", () => $a86207c5d7f7e1fb$export$4cc632584fd87fae);
 
-
 class $a86207c5d7f7e1fb$var$LandmarkManager {
@@ -13,0 +7,0 @@ static getInstance() {

dist/types.d.ts

@@ -1,3 +0,3 @@
-import { AriaLabelingProps } from "@react-types/shared";
-import { HTMLAttributes, MutableRefObject } from "react";
+import { AriaLabelingProps, DOMAttributes, FocusableElement } from "@react-types/shared";
+import { MutableRefObject } from "react";
 export type AriaLandmarkRole = 'main' | 'region' | 'search' | 'navigation' | 'form' | 'banner' | 'contentinfo' | 'complementary';
@@ -7,4 +7,4 @@ export interface AriaLandmarkProps extends AriaLabelingProps {
 }
-interface LandmarkAria {
-    landmarkProps: HTMLAttributes<HTMLElement>;
+export interface LandmarkAria {
+    landmarkProps: DOMAttributes;
 }
@@ -16,4 +16,4 @@ /**
  */
-export function useLandmark(props: AriaLandmarkProps, ref: MutableRefObject<HTMLElement>): LandmarkAria;
+export function useLandmark(props: AriaLandmarkProps, ref: MutableRefObject<FocusableElement>): LandmarkAria;
 
 //# sourceMappingURL=types.d.ts.map

package.json

 {
   "name": "@react-aria/landmark",
-  "version": "3.0.0-alpha.0",
+  "version": "3.0.0-alpha.1",
   "description": "Spectrum UI components in React",
@@ -21,5 +21,5 @@ "license": "Apache-2.0",
     "@babel/runtime": "^7.6.2",
-    "@react-aria/focus": "^3.6.1",
-    "@react-aria/utils": "^3.13.1",
-    "@react-types/shared": "^3.13.1"
+    "@react-aria/focus": "^3.7.0",
+    "@react-aria/utils": "^3.13.2",
+    "@react-types/shared": "^3.14.0"
   },
@@ -32,3 +32,3 @@ "peerDependencies": {
   },
-  "gitHead": "715c3f563ccf8c2e0102d3e18403d9db21a05a71"
+  "gitHead": "cd7c0ec917122c7612f653c22f8ed558f8b66ecd"
 }

src/index.ts

@@ -13,2 +13,3 @@ /*
 
-export * from './useLandmark';
+export type {AriaLandmarkRole, AriaLandmarkProps, LandmarkAria} from './useLandmark';
+export {useLandmark} from './useLandmark';

src/useLandmark.ts

@@ -13,4 +13,4 @@ /*
 
-import {AriaLabelingProps} from '@react-types/shared';
-import {HTMLAttributes, MutableRefObject, useCallback, useEffect, useState} from 'react';
+import {AriaLabelingProps, DOMAttributes, FocusableElement} from '@react-types/shared';
+import {MutableRefObject, useCallback, useEffect, useState} from 'react';
 import {useLayoutEffect} from '@react-aria/utils';
@@ -24,11 +24,11 @@
 
-interface LandmarkAria {
-  landmarkProps: HTMLAttributes<HTMLElement>
+export interface LandmarkAria {
+  landmarkProps: DOMAttributes
 }
 
 type Landmark = {
-  ref: MutableRefObject<HTMLElement>,
+  ref: MutableRefObject<Element>,
   role: AriaLandmarkRole,
   label?: string,
-  lastFocused?: HTMLElement,
+  lastFocused?: FocusableElement,
   focus: () => void,
@@ -71,3 +71,3 @@ blur: () => void
 
-  private focusLandmark(landmark: HTMLElement) {
+  private focusLandmark(landmark: Element) {
     this.landmarks.find(l => l.ref.current === landmark)?.focus();
@@ -135,3 +135,3 @@ }
 
-  public removeLandmark(ref: MutableRefObject<HTMLElement>) {
+  public removeLandmark(ref: MutableRefObject<Element>) {
     this.landmarks = this.landmarks.filter(landmark => landmark.ref !== ref);
@@ -176,3 +176,3 @@ if (this.landmarks.length === 0) {
    */
-  private closestLandmark(element: HTMLElement) {
+  private closestLandmark(element: Element) {
     let landmarkMap = new Map(this.landmarks.map(l => [l.ref.current, l]));
@@ -192,3 +192,3 @@ let currentElement = element;
    */
-  public getNextLandmark(element: HTMLElement, {backward}: {backward?: boolean }) {
+  public getNextLandmark(element: Element, {backward}: {backward?: boolean }) {
     if (this.landmarks.length === 0) {
@@ -225,3 +225,3 @@ return undefined;
       let backward = e.shiftKey;
-      let nextLandmark = this.getNextLandmark(e.target as HTMLElement, {backward});
+      let nextLandmark = this.getNextLandmark(e.target as Element, {backward});
 
@@ -263,7 +263,7 @@ // If no landmarks, return
   public focusinHandler(e: FocusEvent) {
-    let currentLandmark = this.closestLandmark(e.target as HTMLElement);
+    let currentLandmark = this.closestLandmark(e.target as Element);
     if (currentLandmark && currentLandmark.ref.current !== e.target) {
-      this.updateLandmark({ref: currentLandmark.ref, lastFocused: e.target as HTMLElement});
+      this.updateLandmark({ref: currentLandmark.ref, lastFocused: e.target as FocusableElement});
     }
-    let previousFocusedElement = e.relatedTarget as HTMLElement;
+    let previousFocusedElement = e.relatedTarget as Element;
     if (previousFocusedElement) {
@@ -281,3 +281,3 @@ let closestPreviousLandmark = this.closestLandmark(previousFocusedElement);
   public focusoutHandler(e: FocusEvent) {
-    let previousFocusedElement = e.target as HTMLElement;
+    let previousFocusedElement = e.target as Element;
     let nextFocusedElement = e.relatedTarget;
@@ -300,3 +300,3 @@ // the === document seems to be a jest thing for focus to go there on generic blur event such as landmark.blur();
  */
-export function useLandmark(props: AriaLandmarkProps, ref: MutableRefObject<HTMLElement>): LandmarkAria {
+export function useLandmark(props: AriaLandmarkProps, ref: MutableRefObject<FocusableElement>): LandmarkAria {
   const {
@@ -303,0 +303,0 @@ role,

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

92660

decreased by-0.42%

Lines of code

869

decreased by-2.25%

Dependency changes

• Updated@react-aria/focus@^3.7.0

• Updated@react-aria/utils@^3.13.2

• Updated@react-types/shared@^3.14.0