@coreui/react-pro 4.9.0-next.0 → 4.9.0

package/dist/props.d.ts

@@ -0,0 +1,8 @@
+import PropTypes from 'prop-types';
+import type { Placements, Triggers } from './types';
+export declare const colorPropType: PropTypes.Requireable<string>;
+export declare const gradientsPropType: PropTypes.Requireable<string>;
+export declare const placementPropType: PropTypes.Requireable<Placements>;
+export declare const shapePropType: PropTypes.Requireable<string>;
+export declare const textColorsPropType: PropTypes.Requireable<string>;
+export declare const triggerPropType: PropTypes.Requireable<Triggers>;

package/dist/types.d.ts

@@ -0,0 +1,7 @@
+export type Breakpoints = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+export type Colors = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light' | string;
+export type Gradients = 'primary-gradient' | 'secondary-gradient' | 'success-gradient' | 'danger-gradient' | 'warning-gradient' | 'info-gradient' | 'dark-gradient' | 'light-gradient';
+export type Placements = 'auto' | 'auto-start' | 'auto-end' | 'top-end' | 'top' | 'top-start' | 'bottom-end' | 'bottom' | 'bottom-start' | 'right-start' | 'right' | 'right-end' | 'left-start' | 'left' | 'left-end' | undefined;
+export type Shapes = 'rounded' | 'rounded-top' | 'rounded-end' | 'rounded-bottom' | 'rounded-start' | 'rounded-circle' | 'rounded-pill' | 'rounded-0' | 'rounded-1' | 'rounded-2' | 'rounded-3' | string;
+export type TextColors = Colors | 'white' | 'muted' | 'high-emphasis' | 'medium-emphasis' | 'disabled' | 'high-emphasis-inverse' | 'medium-emphasis-inverse' | 'disabled-inverse' | string;
+export type Triggers = 'hover' | 'focus' | 'click';

package/dist/utils/index.d.ts

@@ -1,5 +1,3 @@
-import getNextSibling from './getNextSibling';
-import getPreviousSibling from './getPreviousSibling';
 import isInViewport from './isInViewport';
 import isObjectInArray from './isObjectInArray';
-export { getNextSibling, getPreviousSibling, isInViewport, isObjectInArray };
+export { isInViewport, isObjectInArray };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/react-pro",
-  "version": "4.9.0-next.0",
+  "version": "4.9.0",
   "description": "UI Components Library for React.js",
   "keywords": [
     "react",
@@ -32,7 +32,9 @@
     "src/"
   ],
   "scripts": {
-    "build": "rollup -c --bundleConfigAsCjs"
+    "build": "rollup -c --bundleConfigAsCjs",
+    "test": "jest --coverage",
+    "test:update": "jest --coverage --updateSnapshot"
   },
   "devDependencies": {
     "@coreui/icons": "^3.0.0",
@@ -42,20 +44,23 @@
     "@rollup/plugin-node-resolve": "^15.0.1",
     "@rollup/plugin-typescript": "^11.0.0",
     "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^13.4.0",
-    "@types/react": "18.0.27",
-    "@types/react-dom": "^18.0.10",
+    "@testing-library/react": "^14.0.0",
+    "@types/react": "18.0.28",
+    "@types/react-dom": "^18.0.11",
     "@types/react-transition-group": "^4.4.5",
     "classnames": "^2.3.2",
     "date-fns": "^2.29.3",
+    "jest": "^29.5.0",
+    "jest-environment-jsdom": "^29.5.0",
     "prop-types": "^15.8.1",
     "react": "^18.2.0",
     "react-device-detect": "^2.2.2",
     "react-dom": "^18.2.0",
     "react-popper": "^2.3.0",
     "react-transition-group": "^4.4.5",
-    "rollup": "^3.14.0",
+    "rollup": "^3.19.1",
     "tslib": "^2.5.0",
+    "ts-jest": "^29.0.5",
     "typescript": "^4.9.5"
   },
   "peerDependencies": {

package/src/components/accordion/CAccordion.tsx

@@ -30,11 +30,15 @@ export interface CAccordionContextProps {
 export const CAccordionContext = createContext({} as CAccordionContextProps)
 
 export const CAccordion = forwardRef<HTMLDivElement, CAccordionProps>(
-  ({ children, activeItemKey = undefined, alwaysOpen = false, className, flush, ...rest }, ref) => {
+  ({ children, activeItemKey, alwaysOpen = false, className, flush, ...rest }, ref) => {
     const [_activeItemKey, setActiveKey] = useState(activeItemKey)
-    const _className = classNames('accordion', { 'accordion-flush': flush }, className)
+
     return (
-      <div className={_className} {...rest} ref={ref}>
+      <div
+        className={classNames('accordion', { 'accordion-flush': flush }, className)}
+        {...rest}
+        ref={ref}
+      >
         <CAccordionContext.Provider value={{ _activeItemKey, alwaysOpen, setActiveKey }}>
           {children}
         </CAccordionContext.Provider>

package/src/components/accordion/CAccordionBody.tsx

@@ -5,6 +5,7 @@ import classNames from 'classnames'
 import { CAccordionItemContext } from './CAccordionItem'
 
 import { CCollapse } from './../collapse/CCollapse'
+
 export interface CAccordionBodyProps extends HTMLAttributes<HTMLDivElement> {
   /**
    * A string of all className you want applied to the base component.
@@ -15,11 +16,10 @@ export interface CAccordionBodyProps extends HTMLAttributes<HTMLDivElement> {
 export const CAccordionBody = forwardRef<HTMLDivElement, CAccordionBodyProps>(
   ({ children, className, ...rest }, ref) => {
     const { visible } = useContext(CAccordionItemContext)
-    const _className = classNames('accordion-body', className)
 
     return (
       <CCollapse className="accordion-collapse" visible={visible}>
-        <div className={_className} {...rest} ref={ref}>
+        <div className={classNames('accordion-body', className)} {...rest} ref={ref}>
           {children}
         </div>
       </CCollapse>

package/src/components/accordion/CAccordionButton.tsx

@@ -15,12 +15,10 @@ export const CAccordionButton = forwardRef<HTMLButtonElement, CAccordionButtonPr
   ({ children, className, ...rest }, ref) => {
     const { visible, setVisible } = useContext(CAccordionItemContext)
 
-    const _className = classNames('accordion-button', { collapsed: !visible }, className)
-
     return (
       <button
         type="button"
-        className={_className}
+        className={classNames('accordion-button', { collapsed: !visible }, className)}
         aria-expanded={!visible}
         onClick={() => setVisible(!visible)}
         {...rest}

package/src/components/accordion/CAccordionCollapse.tsx

@@ -1,5 +1,6 @@
 import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
+
 import { CCollapse, CCollapseProps } from '../collapse/CCollapse'
 
 export const CAccordionCollapse = forwardRef<HTMLDivElement, Omit<CCollapseProps, 'horizontal'>>(

package/src/components/accordion/CAccordionHeader.tsx

@@ -13,10 +13,8 @@ export interface CAccordionHeaderProps extends HTMLAttributes<HTMLDivElement> {
 
 export const CAccordionHeader = forwardRef<HTMLDivElement, CAccordionHeaderProps>(
   ({ children, className, ...rest }, ref) => {
-    const _className = classNames('accordion-header', className)
-
     return (
-      <div className={_className} {...rest} ref={ref}>
+      <div className={classNames('accordion-header', className)} {...rest} ref={ref}>
         <CAccordionButton>{children}</CAccordionButton>
       </div>
     )

package/src/components/accordion/CAccordionItem.tsx

@@ -32,7 +32,7 @@ export interface CAccordionItemProps extends HTMLAttributes<HTMLDivElement> {
 
 export const CAccordionItem = forwardRef<HTMLDivElement, CAccordionItemProps>(
   ({ children, className, itemKey, ...rest }, ref) => {
-    const _itemKey = useRef(itemKey ? itemKey : Math.random().toString(36).substr(2, 9))
+    const _itemKey = useRef(itemKey ?? Math.random().toString(36).slice(2, 11))
 
     const { _activeItemKey, alwaysOpen, setActiveKey } = useContext(CAccordionContext)
     const [visible, setVisible] = useState(Boolean(_activeItemKey === _itemKey.current))
@@ -45,10 +45,8 @@ export const CAccordionItem = forwardRef<HTMLDivElement, CAccordionItemProps>(
       setVisible(Boolean(_activeItemKey === _itemKey.current))
     }, [_activeItemKey])
 
-    const _className = classNames('accordion-item', className)
-
     return (
-      <div className={_className} {...rest} ref={ref}>
+      <div className={classNames('accordion-item', className)} {...rest} ref={ref}>
         <CAccordionItemContext.Provider value={{ setVisible, visible }}>
           {children}
         </CAccordionItemContext.Provider>

package/src/components/accordion/__tests__/__snapshots__/CAccordionBody.spec.tsx.snap

@@ -3,7 +3,7 @@
 exports[`CAccordionBody customize 1`] = `
 <div>
   <div
-    class="accordion-collpase collapse"
+    class="accordion-collapse collapse"
   >
     <div
       class="accordion-body"
@@ -17,7 +17,7 @@ exports[`CAccordionBody customize 1`] = `
 exports[`loads and displays CAccordionBody component 1`] = `
 <div>
   <div
-    class="accordion-collpase collapse"
+    class="accordion-collapse collapse"
   >
     <div
       class="accordion-body"

package/src/components/alert/CAlert.tsx

@@ -3,10 +3,11 @@ import PropTypes from 'prop-types'
 import classNames from 'classnames'
 import { Transition } from 'react-transition-group'
 
-import { Colors, colorPropType } from '../Types'
 import { CCloseButton } from '../close-button/CCloseButton'
 
 import { useForkedRef } from '../../hooks'
+import { colorPropType } from '../../props'
+import type { Colors } from '../../types'
 
 export interface CAlertProps extends HTMLAttributes<HTMLDivElement> {
   /**
@@ -59,19 +60,6 @@ export const CAlert = forwardRef<HTMLDivElement, CAlertProps>(
       setVisible(visible)
     }, [visible])
 
-    const _className = classNames(
-      'alert',
-      variant === 'solid' ? `bg-${color} text-white` : `alert-${color}`,
-      {
-        'alert-dismissible fade': dismissible,
-      },
-      className,
-    )
-
-    const getTransitionClass = (state: string) => {
-      return state === 'entered' && 'show'
-    }
-
     return (
       <Transition
         in={_visible}
@@ -81,20 +69,25 @@ export const CAlert = forwardRef<HTMLDivElement, CAlertProps>(
         timeout={150}
         unmountOnExit
       >
-        {(state) => {
-          const transitionClass = getTransitionClass(state)
-          return (
-            <div
-              className={classNames(_className, transitionClass)}
-              role="alert"
-              {...rest}
-              ref={forkedRef}
-            >
-              {children}
-              {dismissible && <CCloseButton onClick={() => setVisible(false)} />}
-            </div>
-          )
-        }}
+        {(state) => (
+          <div
+            className={classNames(
+              'alert',
+              variant === 'solid' ? `bg-${color} text-white` : `alert-${color}`,
+              {
+                'alert-dismissible fade': dismissible,
+                show: state === 'entered',
+              },
+              className,
+            )}
+            role="alert"
+            {...rest}
+            ref={forkedRef}
+          >
+            {children}
+            {dismissible && <CCloseButton onClick={() => setVisible(false)} />}
+          </div>
+        )}
       </Transition>
     )
   },

package/src/components/alert/CAlertHeading.tsx

@@ -15,10 +15,8 @@ export interface CAlertHeadingProps extends HTMLAttributes<HTMLHeadingElement> {
 
 export const CAlertHeading = forwardRef<HTMLHeadingElement, CAlertHeadingProps>(
   ({ children, className, component: Component = 'h4', ...rest }, ref) => {
-    const _className = classNames('alert-heading', className)
-
     return (
-      <Component className={_className} {...rest} ref={ref}>
+      <Component className={classNames('alert-heading', className)} {...rest} ref={ref}>
         {children}
       </Component>
     )

package/src/components/alert/CAlertLink.tsx

@@ -13,10 +13,8 @@ export interface CAlertLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement>
 
 export const CAlertLink = forwardRef<HTMLAnchorElement, CAlertLinkProps>(
   ({ children, className, ...rest }, ref) => {
-    const _className = classNames('alert-link', className)
-
     return (
-      <CLink className={_className} {...rest} ref={ref}>
+      <CLink className={classNames('alert-link', className)} {...rest} ref={ref}>
         {children}
       </CLink>
     )

package/src/components/alert/__tests__/__snapshots__/CAlert.spec.tsx.snap

@@ -3,7 +3,7 @@
 exports[`CAlert customize 1`] = `
 <div>
   <div
-    class="alert bg-secondary text-white alert-dismissible fade bazinga show"
+    class="alert bg-secondary text-white alert-dismissible fade show bazinga"
     role="alert"
   >
     Test

package/src/components/avatar/CAvatar.tsx

@@ -2,14 +2,8 @@ import React, { forwardRef, HTMLAttributes } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
-import {
-  Colors,
-  Shapes,
-  TextColors,
-  colorPropType,
-  shapePropType,
-  textColorsPropType,
-} from '../Types'
+import { colorPropType, shapePropType, textColorsPropType } from '../../props'
+import type { Colors, Shapes, TextColors } from '../../types'
 
 export interface CAvatarProps extends HTMLAttributes<HTMLDivElement> {
   /**
@@ -52,20 +46,23 @@ export interface CAvatarProps extends HTMLAttributes<HTMLDivElement> {
 
 export const CAvatar = forwardRef<HTMLDivElement, CAvatarProps>(
   ({ children, className, color, shape, size, src, status, textColor, ...rest }, ref) => {
-    const _className = classNames(
-      'avatar',
-      {
-        [`bg-${color}`]: color,
-        [`avatar-${size}`]: size,
-        [`text-${textColor}`]: textColor,
-      },
-      shape,
-      className,
-    )
     const statusClassName = status && classNames('avatar-status', `bg-${status}`)
 
     return (
-      <div className={_className} {...rest} ref={ref}>
+      <div
+        className={classNames(
+          'avatar',
+          {
+            [`bg-${color}`]: color,
+            [`avatar-${size}`]: size,
+            [`text-${textColor}`]: textColor,
+          },
+          shape,
+          className,
+        )}
+        {...rest}
+        ref={ref}
+      >
         {src ? <img src={src} className="avatar-img" /> : children}
         {status && <span className={statusClassName}></span>}
       </div>

package/src/components/backdrop/CBackdrop.tsx

@@ -1,7 +1,7 @@
 import React, { forwardRef, HTMLAttributes, useRef } from 'react'
-import { Transition } from 'react-transition-group'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
+import { Transition } from 'react-transition-group'
 
 import { useForkedRef } from '../../hooks'
 
@@ -21,20 +21,17 @@ export const CBackdrop = forwardRef<HTMLDivElement, CBackdropProps>(
     const backdropRef = useRef<HTMLDivElement>(null)
     const forkedRef = useForkedRef(ref, backdropRef)
 
-    const _className = classNames(className, 'fade')
-
-    const getTransitionClass = (state: string) => {
-      return state === 'entered' && 'show'
-    }
-
     return (
       <Transition in={visible} mountOnEnter nodeRef={backdropRef} timeout={150} unmountOnExit>
-        {(state) => {
-          const transitionClass = getTransitionClass(state)
-          return (
-            <div className={classNames(_className, transitionClass)} {...rest} ref={forkedRef} />
-          )
-        }}
+        {(state) => (
+          <div
+            className={classNames(className, 'fade', {
+              show: state === 'entered',
+            })}
+            {...rest}
+            ref={forkedRef}
+          />
+        )}
       </Transition>
     )
   },

package/src/components/badge/CBadge.tsx

@@ -2,16 +2,8 @@ import React, { ElementType, forwardRef, HTMLAttributes } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
-import {
-  Colors,
-  Gradients,
-  Shapes,
-  TextColors,
-  colorPropType,
-  gradientsPropType,
-  shapePropType,
-  textColorsPropType,
-} from '../Types'
+import { colorPropType, gradientsPropType, shapePropType, textColorsPropType } from '../../props'
+import type { Colors, Gradients, Shapes, TextColors } from '../../types'
 
 export interface CBadgeProps extends HTMLAttributes<HTMLDivElement | HTMLSpanElement> {
   /**
@@ -64,24 +56,26 @@ export const CBadge = forwardRef<HTMLDivElement | HTMLSpanElement, CBadgeProps>(
     },
     ref,
   ) => {
-    const _className = classNames(
-      'badge',
-      {
-        [`bg-${color}`]: color,
-        'position-absolute translate-middle': position,
-        'top-0': position?.includes('top'),
-        'top-100': position?.includes('bottom'),
-        'start-100': position?.includes('end'),
-        'start-0': position?.includes('start'),
-        [`badge-${size}`]: size,
-        [`text-${textColor}`]: textColor,
-      },
-      shape,
-      className,
-    )
-
     return (
-      <Component className={_className} {...rest} ref={ref}>
+      <Component
+        className={classNames(
+          'badge',
+          {
+            [`bg-${color}`]: color,
+            'position-absolute translate-middle': position,
+            'top-0': position?.includes('top'),
+            'top-100': position?.includes('bottom'),
+            'start-100': position?.includes('end'),
+            'start-0': position?.includes('start'),
+            [`badge-${size}`]: size,
+            [`text-${textColor}`]: textColor,
+          },
+          shape,
+          className,
+        )}
+        {...rest}
+        ref={ref}
+      >
         {children}
       </Component>
     )

package/src/components/breadcrumb/CBreadcrumb.tsx

@@ -11,10 +11,9 @@ export interface CBreadcrumbProps extends HTMLAttributes<HTMLOListElement> {
 
 export const CBreadcrumb = forwardRef<HTMLOListElement, CBreadcrumbProps>(
   ({ children, className, ...rest }, ref) => {
-    const _className = classNames('breadcrumb', className)
     return (
       <nav aria-label="breadcrumb">
-        <ol className={_className} {...rest} ref={ref}>
+        <ol className={classNames('breadcrumb', className)} {...rest} ref={ref}>
           {children}
         </ol>
       </nav>

package/src/components/breadcrumb/CBreadcrumbItem.tsx

@@ -21,15 +21,19 @@ export interface CBreadcrumbItemProps extends HTMLAttributes<HTMLLIElement> {
 
 export const CBreadcrumbItem = forwardRef<HTMLLIElement, CBreadcrumbItemProps>(
   ({ children, active, className, href, ...rest }, ref) => {
-    const _className = classNames(
-      'breadcrumb-item',
-      {
-        active: active,
-      },
-      className,
-    )
     return (
-      <li className={_className} {...(active && { 'aria-current': 'page' })} {...rest} ref={ref}>
+      <li
+        className={classNames(
+          'breadcrumb-item',
+          {
+            active: active,
+          },
+          className,
+        )}
+        {...(active && { 'aria-current': 'page' })}
+        {...rest}
+        ref={ref}
+      >
         {href ? <CLink href={href}>{children}</CLink> : children}
       </li>
     )

package/src/components/button/CButton.tsx

@@ -2,9 +2,11 @@ import React, { ElementType, forwardRef } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
-import { Colors, Shapes, colorPropType } from '../Types'
 import { CLink, CLinkProps } from '../link/CLink'
 
+import { colorPropType } from '../../props'
+import type { Colors, Shapes } from '../../types'
+
 export interface CButtonProps extends Omit<CLinkProps, 'size'> {
   /**
    * Toggle the active state for the component.
@@ -72,19 +74,17 @@ export const CButton = forwardRef<HTMLButtonElement | HTMLAnchorElement, CButton
     },
     ref,
   ) => {
-    const _className = classNames(
-      'btn',
-      variant ? `btn-${variant}-${color}` : `btn-${color}`,
-      { [`btn-${size}`]: size },
-      shape,
-      className,
-    )
-
     return (
       <CLink
         component={rest.href ? 'a' : component}
         type={type}
-        className={_className}
+        className={classNames(
+          'btn',
+          variant ? `btn-${variant}-${color}` : `btn-${color}`,
+          { [`btn-${size}`]: size },
+          shape,
+          className,
+        )}
         {...rest}
         ref={ref}
       >

package/src/components/button-group/CButtonGroup.tsx

@@ -19,14 +19,16 @@ export interface CButtonGroupProps extends HTMLAttributes<HTMLDivElement> {
 
 export const CButtonGroup = forwardRef<HTMLDivElement, CButtonGroupProps>(
   ({ children, className, size, vertical, ...rest }, ref) => {
-    const _className = classNames(
-      vertical ? 'btn-group-vertical' : 'btn-group',
-      { [`btn-group-${size}`]: size },
-      className,
-    )
-
     return (
-      <div className={_className} {...rest} ref={ref}>
+      <div
+        className={classNames(
+          vertical ? 'btn-group-vertical' : 'btn-group',
+          { [`btn-group-${size}`]: size },
+          className,
+        )}
+        {...rest}
+        ref={ref}
+      >
         {children}
       </div>
     )

package/src/components/button-group/CButtonToolbar.tsx

@@ -11,10 +11,8 @@ export interface CButtonToolbarProps extends HTMLAttributes<HTMLDivElement> {
 
 export const CButtonToolbar = forwardRef<HTMLDivElement, CButtonToolbarProps>(
   ({ children, className, ...rest }, ref) => {
-    const _className = classNames('btn-toolbar', className)
-
     return (
-      <div className={_className} {...rest} ref={ref}>
+      <div className={classNames('btn-toolbar', className)} {...rest} ref={ref}>
         {children}
       </div>
     )

package/src/components/calendar/utils.ts

@@ -6,7 +6,7 @@ export const convertToLocalTime = (d: Date, locale: string, options = {}) =>
 
 export const createGroupsInArray = <T>(arr: T[], numberOfGroups: number): T[][] => {
   const perGroup = Math.ceil(arr.length / numberOfGroups)
-  return new Array(numberOfGroups)
+  return Array.from({ length: numberOfGroups })
     .fill('')
     .map((_, i) => arr.slice(i * perGroup, (i + 1) * perGroup))
 }
@@ -15,52 +15,6 @@ export const getCurrentYear = () => new Date().getFullYear()
 
 export const getCurrentMonth = () => new Date().getMonth()
 
-export const getLocalDateFromString = (string: string, locale: string, time?: boolean) => {
-  const date = new Date(2013, 11, 31, 17, 19, 22)
-  let regex = time ? date.toLocaleString(locale) : date.toLocaleDateString(locale)
-  regex = regex
-    .replace('2013', '(?<year>[0-9]{2,4})')
-    .replace('12', '(?<month>[0-9]{1,2})')
-    .replace('31', '(?<day>[0-9]{1,2})')
-
-  if (time) {
-    regex = regex
-      .replace('5', '(?<hour>[0-9]{1,2})')
-      .replace('17', '(?<hour>[0-9]{1,2})')
-      .replace('19', '(?<minute>[0-9]{1,2})')
-      .replace('22', '(?<second>[0-9]{1,2})')
-      .replace('PM', '(?<ampm>[A-Z]{2})')
-  }
-
-  const rgx = RegExp(`${regex}`)
-  const partials = string.match(rgx)
-
-  if (partials === null) return
-
-  const newDate =
-    partials.groups &&
-    (time
-      ? new Date(
-          Number(partials.groups['year']),
-          Number(partials.groups['month']) - 1,
-          Number(partials.groups['day']),
-          partials.groups['ampm']
-            ? partials.groups['ampm'] === 'PM'
-              ? Number(partials.groups['hour']) + 12
-              : Number(partials.groups['hour'])
-            : Number(partials.groups['hour']),
-          Number(partials.groups['minute']),
-          Number(partials.groups['second']),
-        )
-      : new Date(
-          Number(partials.groups['year']),
-          Number(partials.groups['month']) - 1,
-          Number(partials.groups['day']),
-        ))
-
-  return newDate
-}
-
 export const getMonthName = (month: number, locale: string) => {
   const d = new Date()
   d.setDate(1)
@@ -193,18 +147,16 @@ export const isDateDisabled = (
   let disabled
   if (dates) {
     dates.forEach((_date: Date | Date[]) => {
-      if (Array.isArray(_date)) {
-        if (isDateInRange(date, _date[0], _date[1])) {
-          disabled = true
-        }
+      if (Array.isArray(_date) && isDateInRange(date, _date[0], _date[1])) {
+        disabled = true
       }
-      if (_date instanceof Date) {
-        if (isSameDateAs(date, _date)) {
-          disabled = true
-        }
+
+      if (_date instanceof Date && isSameDateAs(date, _date)) {
+        disabled = true
       }
     })
   }
+
   if (min && date < min) {
     disabled = true
   }