@codeleap/web 3.25.0 → 3.25.3

package/src/components/TextInput/types.ts

@@ -1,85 +0,0 @@
-import { FormTypes, yup } from '@codeleap/common'
-import { TouchableProps } from '../Touchable'
-import { AppIcon, StyledProp } from '@codeleap/styles'
-import { InputBaseProps } from '../InputBase'
-import { HTMLProps } from '../../types'
-import { TextInputComposition } from './styles'
-
-type NativeTextInputProps = HTMLProps<'input'>
-
-export type TextInputProps =
-  Omit<InputBaseProps, 'style'> &
-  Omit<NativeTextInputProps, 'value' | 'crossOrigin' | 'ref' | 'style'> &
-  {
-    style?: StyledProp<TextInputComposition>
-    password?: boolean
-    validate?: FormTypes.ValidatorWithoutForm<string> | yup.SchemaOf<string>
-    debugName?: string
-    visibilityToggle?: boolean
-    value?: NativeTextInputProps['value']
-    multiline?: boolean
-    onPress?: TouchableProps['onPress']
-    onChangeText?: (textValue: string) => void
-    caretColor?: string
-    focused?: boolean
-    _error?: boolean
-    rows?: number
-    masking?: TextInputMaskingProps
-    visibleIcon?: AppIcon
-    hiddenIcon?: AppIcon
-  }
-
-export type InputRef = {
-  isTextInput?: boolean
-  focus: () => void
-  getInputRef: () => HTMLInputElement
-}
-
-type beforeMaskedValueChangeArgs = {
-  state: {
-    value: string | undefined
-    selection: {
-      start: number
-      end: number
-      length?: number
-    }
-  }
-  userInput: null | string
-}
-
-export type FormatChar = `[${string}]`
-
-export type MaskProps = {
-  obfuscated?: boolean
-  mask?: string
-  placeholder?: string
-  maskChar?: string
-  formatChars?: Record<string, FormatChar>
-  alwaysShowMask?: boolean
-  validator?: FormTypes.ValidatorFunctionWithoutForm
-  maskType?: 'BRL' | 'INTERNATIONAL'
-  getRawValue?: (value: any) => string
-}
-
-export type TextInputMaskTypeProp =
-  | 'credit-card'
-  | 'cpf'
-  | 'cnpj'
-  | 'zip-code'
-  | 'cel-phone'
-  | 'custom'
-
-export interface TextInputMaskingProps {
-  type: TextInputMaskTypeProp
-  options?: MaskProps
-  onChangeMask?: (
-    newState: beforeMaskedValueChangeArgs['state'],
-    oldState: beforeMaskedValueChangeArgs['state'],
-    userInput: beforeMaskedValueChangeArgs['userInput']
-  ) => beforeMaskedValueChangeArgs['state']
-  saveFormatted?: boolean
-}
-
-export type InputMaskProps = {
-  masking: TextInputMaskingProps
-}

package/src/components/Tooltip/types.ts

@@ -1,46 +0,0 @@
-import React from 'react'
-import {
-  TooltipProps as PrimitiveTooltipProps,
-  TooltipContentProps,
-  TooltipPortalProps,
-  TooltipArrowProps,
-  TooltipTriggerProps,
-  TooltipProviderProps,
-} from '@radix-ui/react-tooltip'
-import { AnyFunction, StylesOf } from '@codeleap/common'
-import { TooltipComposition } from './styles'
-import { ViewProps } from '../View'
-import { StyledProp } from '@codeleap/styles'
-
-type TooltipComponentProps = {
-  contentProps?: TooltipContentProps
-  portalProps?: TooltipPortalProps
-  arrowProps?: TooltipArrowProps
-  triggerProps?: TooltipTriggerProps
-  providerProps?: TooltipProviderProps
-}
-
-export type TooltipProps =
-  Omit<PrimitiveTooltipProps, 'style'> &
-  Omit<TooltipComponentProps, 'style'> &
-  {
-    toggle?: AnyFunction
-    visible?: boolean
-    content: React.ReactNode | ((props: TooltipProps & { variantsStyles: StylesOf<TooltipComposition> }) => JSX.Element)
-    triggerWrapper?: React.ElementType
-    triggerWrapperProps?: Partial<ViewProps>
-    style?: StyledProp<TooltipComposition>
-    side?: 'left' | 'right' | 'bottom' | 'top'
-    openOnPress?: boolean
-    openOnHover?: boolean
-    disabled?: boolean
-    delayDuration?: number
-    closeOnClickOutside?: boolean
-    onOpen?: AnyFunction
-    onClose?: AnyFunction
-    onValueChange?: (value: boolean) => void
-    onHover?: (hoverType: 'enter' | 'leave', value: boolean) => void
-    onPress?: (value: boolean) => void
-    children?: React.ReactNode
-    debugName?: string
-  }

package/src/components/Touchable/types.ts

@@ -1,22 +0,0 @@
-import { AnyFunction } from '@codeleap/common'
-import { ComponentPropsWithRef, ElementType } from 'react'
-import { TouchableComposition } from './styles'
-import { AnyRecord, StyledProp } from '@codeleap/styles'
-
-export type TouchableProps<T extends ElementType = 'button'> =
-  Omit<ComponentPropsWithRef<T>, 'style'> &
-  {
-    component?: ElementType<AnyRecord>
-    disabled?: boolean
-    propagate?: boolean
-    onPress?: AnyFunction
-    debugName: string
-    debugComponent?: string
-    style?: StyledProp<TouchableComposition>
-    debounce?: number
-    leadingDebounce?: boolean
-    setPressed?: (pressed: boolean) => void
-    analyticsEnabled?: boolean
-    analyticsName?: string
-    analyticsData?: Record<string, any>
-  }

package/src/lib/WebStyleRegistry.ts

@@ -1,51 +0,0 @@
-import { AnyStyledComponent, CodeleapStyleRegistry, ICSS, StylePersistor } from '@codeleap/styles'
-
-const persistor = new StylePersistor({
-  set(key, value) {
-    if (typeof window === 'undefined') return null
-    return localStorage?.setItem(key, value)
-  },
-  get(key) {
-    if (typeof window === 'undefined') return null
-    return localStorage?.getItem(key)
-  },
-  del(key) {
-    if (typeof window === 'undefined') return null
-    return localStorage?.removeItem(key)
-  },
-})
-
-let instance: WebStyleRegistry
-
-const components: CodeleapStyleRegistry['components'][string][] = []
-
-export class WebStyleRegistry extends CodeleapStyleRegistry {
-  constructor() {
-    super(persistor)
-
-    components.forEach((component) => {
-      this.registerComponent(component)
-    })
-
-    if (!instance) {
-      instance = this
-    }
-
-    return instance
-  }
-
-  createStyle(css: ICSS): ICSS {
-    return css
-  }
-
-  static get current() {
-    return instance
-  }
-
-  static registerComponent(component: AnyStyledComponent) {
-    components.push(component)
-    if (instance) {
-      instance.registerComponent(component)
-    }
-  }
-}

package/src/lib/hooks/useFileInput.ts

@@ -1,15 +0,0 @@
-import { useRef } from 'react'
-import { FileInputRef } from '../../components/FileInput/types'
-
-export const useFileInput = () => {
-  const inputRef = useRef<FileInputRef | null>(null)
-
-  const openFilePicker = () => {
-    return inputRef.current?.openFilePicker()
-  }
-
-  return {
-    openFilePicker,
-    ref: inputRef,
-  }
-}

package/src/lib/hooks/useInfiniteScroll.ts

@@ -1,77 +0,0 @@
-import React from 'react'
-import { AnyFunction, TypeGuards } from '@codeleap/common'
-import { LoadMoreItemsCallback, UseInfiniteLoaderOptions, useInfiniteLoader } from 'masonic'
-import { ListProps } from '../../components/List'
-import { GridProps } from '../../components/Grid'
-import { useRefresh } from './useRefresh'
-
-export type UseInfiniteScrollArgs<Item extends Element = any> = {
-    threshold?: number
-    onLoadMore?: AnyFunction
-    loadMoreOptions?: Partial<UseInfiniteLoaderOptions<Item>>
-  }
-
-export type UseInfiniteScrollProps<Item extends Element = any> =
-    Partial<ListProps> &
-    Partial<GridProps> &
-    UseInfiniteScrollArgs<Item>
-
-export type UseInfiniteScrollReturn<Item extends Element = any> = {
-    onLoadMore: LoadMoreItemsCallback<Item>
-    isRefresh: boolean
-    layoutProps: {
-      isEmpty: boolean
-      refreshing: boolean
-      scrollableRef: React.MutableRefObject<undefined>
-    }
-    onRefreshItems: AnyFunction
-  }
-
-export function useInfiniteScroll<Item extends Element = any>(props: UseInfiniteScrollProps<Item>): UseInfiniteScrollReturn<Item> {
-  const {
-    onRefresh,
-    data,
-    hasNextPage,
-    refresh: refreshEnabled,
-    fetchNextPage,
-    refreshThreshold,
-    refreshDebounce,
-    loadMoreOptions = {},
-    onLoadMore,
-    threshold = 16,
-  } = props
-
-  const infiniteLoader = useInfiniteLoader(
-    async (args) => {
-      if (hasNextPage) await fetchNextPage?.()
-      if (TypeGuards.isFunction(onLoadMore)) await onLoadMore?.(args)
-    },
-    {
-      isItemLoaded: (index, items) => !!items?.[index],
-      threshold: threshold,
-      ...loadMoreOptions,
-    },
-  )
-
-  const refreshHookReturn = useRefresh(
-    onRefresh,
-    {
-      threshold: refreshThreshold,
-      debounce: refreshDebounce,
-      enabled: refreshEnabled,
-    },
-  )
-
-  const isEmpty = React.useMemo(() => (!data || !data?.length), [data?.length])
-
-  return {
-    onLoadMore: infiniteLoader,
-    isRefresh: refreshHookReturn.refresh,
-    layoutProps: {
-      scrollableRef: refreshHookReturn.scrollableRef,
-      refreshing: refreshHookReturn.refresh,
-      isEmpty,
-    },
-    onRefreshItems: refreshHookReturn.refresher,
-  }
-}

package/src/lib/hooks/useRefresh.ts

@@ -1,87 +0,0 @@
-import React from 'react'
-import { AnyFunction, useEffect } from '@codeleap/common'
-
-type UseRefreshOptions = {
-    threshold: number
-    debounce: number
-    enabled: boolean
-  }
-
-const scrollDebounce = (func, delay) => {
-  const timerRef = React.useRef(null)
-
-  const scrollDebounce = (...args) => {
-    clearTimeout(timerRef.current)
-    timerRef.current = setTimeout(() => {
-      func(...args)
-    }, delay)
-  }
-
-  return scrollDebounce
-}
-
-export const useRefresh = (onRefresh = () => null, options: UseRefreshOptions) => {
-
-  const {
-    threshold,
-    debounce,
-    enabled,
-  } = options
-
-  const [refresh, setRefresh] = React.useState(false)
-
-  const pushToTopRef = React.useRef(0)
-
-  const refresher = React.useCallback(async (_onRefresh: AnyFunction) => {
-    setRefresh(true)
-    await _onRefresh?.()
-
-    setTimeout(() => {
-      setRefresh(false)
-      pushToTopRef.current = 0
-    }, 2500)
-  }, [])
-
-  const containerRef = React.useRef(null)
-
-  const onScroll = scrollDebounce(() => {
-    if (containerRef.current) {
-      const rect = containerRef.current?.getBoundingClientRect()
-      const scrollTop = window?.pageYOffset || document?.documentElement?.scrollTop
-
-      const containerTop = rect.top + scrollTop
-      const containerHeight = rect.height
-
-      const distanceFromTop = Math.max(0, scrollTop - containerTop)
-      const distanceFromBottom = Math.max(0, containerTop + containerHeight - scrollTop)
-
-      const totalDistance = containerHeight + distanceFromTop + distanceFromBottom
-      const percentage = (distanceFromTop / totalDistance) * 100
-
-      if (percentage < threshold) {
-        if (pushToTopRef.current === 2) {
-          refresher(onRefresh)
-        }
-
-        pushToTopRef.current = pushToTopRef.current + 1
-      }
-    }
-  }, debounce)
-
-  useEffect(() => {
-    if (enabled) {
-      window.addEventListener('scroll', onScroll)
-
-      return () => {
-        window.removeEventListener('scroll', onScroll)
-      }
-    }
-  }, [enabled])
-
-  return {
-    refresh,
-    scrollableRef: containerRef,
-    refresher,
-  }
-}
-

package/src/lib/hooks/useStylesFor.ts

@@ -1,13 +0,0 @@
-import { StyleProp, useStyleObserver } from '@codeleap/styles'
-import { useMemo } from 'react'
-import { WebStyleRegistry } from '../WebStyleRegistry'
-
-export const useStylesFor = <T = unknown>(componentName: string, style: StyleProp<T, string>): T => {
-  const styleObserver = useStyleObserver(style)
-
-  const styles = useMemo(() => {
-    return WebStyleRegistry.current.styleFor(componentName, style)
-  }, [styleObserver])
-
-  return styles
-}

package/src/lib/utils/cache.ts

@@ -1,9 +0,0 @@
-import createCache from '@emotion/cache'
-
-export const createCodeleapWebCache = () => {
-  return createCache({
-    key: 'codeleap-web',
-  })
-}
-
-export const codeleapWebCache = createCodeleapWebCache()