@codeleap/web 3.22.0 → 3.22.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codeleap/web",
-  "version": "3.22.0",
+  "version": "3.22.2",
   "main": "src/index.ts",
   "repository": {
     "url": "https://github.com/codeleap-uk/internal-libs-monorepo.git",

package/src/components/Modal/index.tsx

@@ -386,6 +386,10 @@ export const Modal = (props) => {
         setIndex(visible, modalId.current)
       }, visible ? 0 : 500)
     }
+
+    return () => {
+      if (scrollLock) modalScrollLock(false, modalId.current)
+    }
   }, [visible])
 
   const content = <ModalContent {...props} visible={visible} toggle={toggle} id={modalId.current} />

package/src/components/Select/index.tsx

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react'
 import React, { useRef, forwardRef, useImperativeHandle } from 'react'
-import { FormTypes, useValidate, useState, TypeGuards, onUpdate, IconPlaceholder } from '@codeleap/common'
+import { FormTypes, useValidate, useState, TypeGuards, onUpdate, IconPlaceholder, useEffect } from '@codeleap/common'
 import _Select, { components, MenuListProps, MenuProps, MultiValueProps, NoticeProps } from 'react-select'
 import Async from 'react-select/async'
 import { useSelectStyles } from './styles'
@@ -241,6 +241,12 @@ export const Select = forwardRef<HTMLInputElement, SelectProps>(
 
     const [selectedOption, setSelectedOption] = hasSelectedOptionState ? [_selectedOption, _setSelectedOption] : useState(initialValue ?? value)
 
+    useEffect(() => {
+      if (loadInitialValue && !selectedOption && !!initialValue) {
+        setSelectedOption(initialValue)
+      }
+    }, [!!initialValue])
+
     const [_isFocused, setIsFocused] = useState(false)
     const [loadedOptions, setLoadedOptions] = useState(false)
     const [keyDownActive, setKeyDownActive] = useState(false)

package/src/components/Slider/index.tsx

@@ -21,7 +21,6 @@ import {
 export * from './styles'
 
 export type SliderProps = Partial<Omit<PrimitiveSliderProps, 'value' | 'onValueChange'>> & Pick<InputBaseProps, 'disabled' | 'debugName' | 'description' | 'label'> & {
-  debounce?: number | null
   indicatorLabel?: {
     order?: number[]
     separator?: string
@@ -44,7 +43,7 @@ export type TrackMarkProps = {
 }
 
 const DefaultSliderTrackMark = (props: TrackMarkProps) => {
-  const { index, content, style } = props
+  const { style } = props
 
   if (!TypeGuards.isString(props.content)) {
     return <React.Fragment>
@@ -65,8 +64,8 @@ export const Slider = (props: SliderProps) => {
   } = selectInputBaseProps(props)
 
   const {
-    debounce = null,
     onValueChange,
+    onValueCommit,
     value: _value,
     label,
     debugName,
@@ -82,7 +81,7 @@ export const Slider = (props: SliderProps) => {
     min = 0,
     indicatorLabel = null,
     description = null,
-    minStepsBetweenThumbs = 8,
+    minStepsBetweenThumbs = 0,
     step = 1,
     onPressThumbSetValue = false,
     onPressThumb = null,
@@ -91,6 +90,7 @@ export const Slider = (props: SliderProps) => {
 
   const isUniqueValue = !TypeGuards.isArray(_value)
   const value = isUniqueValue ? [_value] : _value
+
   const _defaultValue = TypeGuards.isArray(defaultSliderValue) ? defaultSliderValue : [defaultSliderValue]
 
   const defaultValueRef = useRef<PrimitiveSliderProps['defaultValue']>(_defaultValue)
@@ -104,34 +104,12 @@ export const Slider = (props: SliderProps) => {
 
   const SliderTrackMark = trackMarkComponent
 
-  const currentThumbRef = useRef(null)
-
   const handleChange: SliderProps['onValueChange'] = (newValue: Array<number>) => {
-    if (isUniqueValue) {
-      onValueChange(newValue?.[0])
-      return
-    }
-
-    const copyValue = [...value]
-
-    const i = currentThumbRef.current
-    const _newValue = newValue[currentThumbRef.current]
-
-    const hasLeftThumb = i !== 0
-    const hasRightThumb = i + 1 < newValue.length
-
-    const previousThumbValue = hasLeftThumb ? (copyValue[i - 1] + minStepsBetweenThumbs) : null
-    const nextThumbValue = hasRightThumb ? (copyValue[i + 1] - minStepsBetweenThumbs) : null
-
-    if (previousThumbValue && _newValue <= previousThumbValue) {
-      copyValue[i] = previousThumbValue
-    } else if (nextThumbValue && _newValue >= nextThumbValue) {
-      copyValue[i] = nextThumbValue
-    } else {
-      copyValue[i] = _newValue
-    }
+    onValueChange(isUniqueValue ? newValue?.[0] : newValue)
+  }
 
-    onValueChange(copyValue)
+  const handleValueCommit = (newValue: Array<number>) => {
+    onValueCommit?.(newValue)
   }
 
   const variantStyles = useDefaultComponentStyle<'u:Slider', typeof SliderPresets>('u:Slider', {
@@ -234,15 +212,15 @@ export const Slider = (props: SliderProps) => {
       <SliderContainer
         {...sliderProps}
         step={step}
-        minStepsBetweenThumbs={minStepsBetweenThumbs}
-        style={containerStyle}
-        defaultValue={defaultValue}
-        value={value}
-        onValueCommit={() => null}
-        onValueChange={handleChange}
         min={min}
         max={max}
         disabled={disabled}
+        defaultValue={defaultValue}
+        onValueCommit={handleValueCommit}
+        onValueChange={handleChange}
+        style={containerStyle}
+        value={value}
+        minStepsBetweenThumbs={minStepsBetweenThumbs}
       >
         <SliderTrack style={trackStyle}>
           <SliderRange style={selectedTrackStyle} />
@@ -256,10 +234,7 @@ export const Slider = (props: SliderProps) => {
             onClick={() => {
               if (onPressThumbSetValue) onValueChange?.(value)
               if (TypeGuards.isFunction(onPressThumb)) onPressThumb?.(value, i)
-
-              currentThumbRef.current = i
             }}
-            onMouseEnter={() => currentThumbRef.current = i}
           />
         ))}
       </SliderContainer>