Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@szhsin/react-accordion

Package Overview
Dependencies
Maintainers
1
Versions
29
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@szhsin/react-accordion - npm Package Compare versions

Comparing version 1.2.2 to 1.2.3

36

dist/cjs/index.js
'use strict';
var react = require('react');
var React = require('react');
var reactTransitionState = require('react-transition-state');

@@ -59,3 +59,3 @@ var jsxRuntime = require('react/jsx-runtime');

const ACCORDION_BTN_ATTR = `data-${ACCORDION_PREFIX}-btn`;
const AccordionContext = /*#__PURE__*/react.createContext({});
const AccordionContext = /*#__PURE__*/React.createContext({});

@@ -136,3 +136,3 @@ const bem = (block, element, modifiers) => (className, props) => {

const _excluded$3 = ["providerValue", "className"];
const ControlledAccordion = /*#__PURE__*/react.forwardRef((_ref, ref) => {
const ControlledAccordion = /*#__PURE__*/React.forwardRef((_ref, ref) => {
let {

@@ -157,3 +157,3 @@ providerValue,

const _excluded$2 = ["allowMultiple", "initialEntered", "mountOnEnter", "unmountOnExit", "transition", "transitionTimeout", "onStateChange"];
const Accordion = /*#__PURE__*/react.forwardRef((_ref, ref) => {
const Accordion = /*#__PURE__*/React.forwardRef((_ref, ref) => {
let {

@@ -187,7 +187,7 @@ allowMultiple,

const useIdShim = () => {
const [id, setId] = react.useState();
react.useEffect(() => setId(++current), []);
const [id, setId] = React.useState();
React.useEffect(() => setId(++current), []);
return id && `${ACCORDION_PREFIX}-${id}`;
};
const _useId = react.useId || useIdShim;
const useId = React.useId || useIdShim;

@@ -199,3 +199,3 @@ const useAccordionItem = ({

}) => {
const buttonId = _useId();
const buttonId = useId();
const panelId = buttonId && buttonId + '-';

@@ -220,3 +220,3 @@ const buttonProps = {

const useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? react.useLayoutEffect : react.useEffect;
const useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? React.useLayoutEffect : React.useEffect;

@@ -227,4 +227,4 @@ const useHeightTransition = ({

}) => {
const [height, setHeight] = react.useState();
const elementRef = react.useRef(null);
const [height, setHeight] = React.useState();
const elementRef = React.useRef(null);
useIsomorphicLayoutEffect(() => {

@@ -244,3 +244,3 @@ (status === 'preEnter' || status === 'preExit') && setHeight(elementRef.current.getBoundingClientRect().height);

function useMergeRef(refA, refB) {
return react.useMemo(() => {
return React.useMemo(() => {
if (!refA) return refB;

@@ -270,3 +270,3 @@ if (!refB) return refA;

const useAccordionContext = () => {
const context = react.useContext(AccordionContext);
const context = React.useContext(AccordionContext);
if (process.env.NODE_ENV !== 'production' && !context.stateMap) {

@@ -283,3 +283,3 @@ throw new Error('[React-Accordion] Cannot find a <AccordionProvider/> above this AccordionItem.');

} = {}) => {
const itemRef = react.useRef(null);
const itemRef = React.useRef(null);
const context = useAccordionContext();

@@ -293,3 +293,3 @@ const key = itemKey != null ? itemKey : itemRef.current;

} = context;
react.useEffect(() => {
React.useEffect(() => {
if (disabled) return;

@@ -305,3 +305,3 @@ const key = itemKey != null ? itemKey : itemRef.current;

state,
toggle: react.useCallback(toEnter => toggle(key, toEnter), [toggle, key])
toggle: React.useCallback(toEnter => toggle(key, toEnter), [toggle, key])
};

@@ -312,3 +312,3 @@ };

const withAccordionItem = WrappedItem => {
const WithAccordionItem = /*#__PURE__*/react.forwardRef((_ref, ref) => {
const WithAccordionItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
let {

@@ -333,3 +333,3 @@ itemKey,

const getRenderNode = (nodeOrFunc, props) => typeof nodeOrFunc === 'function' ? nodeOrFunc(props) : nodeOrFunc;
const WrappedItem = /*#__PURE__*/react.memo(_ref => {
const WrappedItem = /*#__PURE__*/React.memo(_ref => {
let {

@@ -336,0 +336,0 @@ forwardedRef,

import { ACCORDION_BTN_ATTR } from '../utils/constants.js';
import { useId as _useId } from './useId.js';
import { useId } from './useId.js';

@@ -9,3 +9,3 @@ const useAccordionItem = ({

}) => {
const buttonId = _useId();
const buttonId = useId();
const panelId = buttonId && buttonId + '-';

@@ -12,0 +12,0 @@ const buttonProps = {

@@ -1,2 +0,2 @@

import { useId, useState, useEffect } from 'react';
import React, { useState, useEffect } from 'react';
import { ACCORDION_PREFIX } from '../utils/constants.js';

@@ -10,4 +10,4 @@

};
const _useId = useId || useIdShim;
const useId = React.useId || useIdShim;
export { _useId as useId };
export { useId };
{
"name": "@szhsin/react-accordion",
"version": "1.2.2",
"version": "1.2.3",
"description": "The complete accordion solution for React.",

@@ -56,4 +56,4 @@ "author": "Zheng Song",

"devDependencies": {
"@babel/core": "^7.22.5",
"@babel/preset-env": "^7.22.5",
"@babel/core": "^7.22.9",
"@babel/preset-env": "^7.22.9",
"@babel/preset-react": "^7.22.5",

@@ -65,6 +65,6 @@ "@babel/preset-typescript": "^7.22.5",

"@testing-library/react": "^14.0.0",
"@types/jest": "^29.5.2",
"@types/jest": "^29.5.3",
"@types/react": "^18.2.14",
"@typescript-eslint/eslint-plugin": "^5.61.0",
"@typescript-eslint/parser": "^5.61.0",
"@typescript-eslint/parser": "^5.62.0",
"babel-plugin-pure-annotations": "^0.1.2",

@@ -77,3 +77,3 @@ "eslint": "^8.44.0",

"eslint-plugin-react-hooks-addons": "^0.3.1",
"jest": "^29.5.0",
"jest": "^29.6.1",
"jest-environment-jsdom": "^29.6.1",

@@ -80,0 +80,0 @@ "npm-run-all": "^4.1.5",

@@ -1,3 +0,3 @@

import { useId } from 'react';
declare const _useId: typeof useId;
export { _useId as useId };
import React from 'react';
declare const useId: typeof React.useId;
export { useId };
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc