Skip to content

Commit

Permalink
feat: add sub layer props to button
Browse files Browse the repository at this point in the history
  • Loading branch information
lovrozagar committed Jul 11, 2024
1 parent c8bfa5b commit 176fe47
Show file tree
Hide file tree
Showing 15 changed files with 37 additions and 24 deletions.
15 changes: 15 additions & 0 deletions .todo
Original file line number Diff line number Diff line change
Expand Up @@ -16,3 +16,18 @@
- fix: combobox/select content, inspect and fix empty content
- refactor (imports): separate import from utils lib
- fix: combobox search (in new cmdk group list now must be used)
- fix: animation duration props being forwarded to components
- refactor: useReactLazy instead of custom import hooks to dynamically import components
- feat: badge
- feat: breadcrumbs
- feat: carousel
- feat: context menu
- feat: calendar
- feat: date picker
- feat: drawer
- feat: dropdown menu
- feat: hover card
- feat: otp input
- feat: menubar
- feat: pagination
- feat: resizeable
2 changes: 1 addition & 1 deletion src/components/accordion/types/accordion-content.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Simplify } from '@/components/_shared/types/simplify'
import React from 'react'

import { AsChildProp } from '@/components/_shared/types/as-child'
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'

type AccordionContentPrimitiveType = typeof AccordionContentPrimitive

Expand Down
8 changes: 5 additions & 3 deletions src/components/button/components/button.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
'use client'

import { polymorphic } from '@renderui/utils/polymorphic'
import { functionCallOrValue } from '@renderui/utils/function-call-or-value'
import { polymorphic } from '@renderui/utils/polymorphic'
import React from 'react'

import { useButton } from '@/components/button/hooks/use-button'
import { useLazyComponents } from '@/components/button/hooks/use-lazy-components'
import { ButtonProps, ButtonRef } from '@/components/button/types/button'

const Button = React.forwardRef<ButtonRef, ButtonProps>((props, ref) => {
const { buttonProps, rippleProps, loaderProps, utility } = useButton(props, ref)
const { buttonProps, subLayerProps, rippleProps, loaderProps, utility } = useButton(props, ref)
const { children } = buttonProps
const {
asChild,
Expand Down Expand Up @@ -64,7 +64,9 @@ const Button = React.forwardRef<ButtonRef, ButtonProps>((props, ref) => {
? loader ?? <LoaderComponent {...loaderProps} data-slot='loader' />
: null}
{functionCallOrValue(endContent, { isPressed, isKeyboardPressed })}
{RippleComponent ? <RippleComponent {...rippleProps} data-slot='ripple' /> : null}
{RippleComponent ? (
<RippleComponent {...subLayerProps} {...rippleProps} data-slot='ripple' />
) : null}
</>
)
}
Expand Down
2 changes: 2 additions & 0 deletions src/components/button/hooks/use-button.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ function useButton(props: ButtonProps, ref: React.ForwardedRef<ButtonRef>) {
loadingContent,
loaderProps,
loaderRef,
subLayerProps,
rippleProps,
rippleRef,
loader,
Expand Down Expand Up @@ -107,6 +108,7 @@ function useButton(props: ButtonProps, ref: React.ForwardedRef<ButtonRef>) {
...ariaComponentProps,
...restProps,
},
subLayerProps,
rippleProps: getRippleProps({ rippleRef, rippleProps, isLoading }),
loaderProps: mergedLoaderProps,
utility: {
Expand Down
2 changes: 2 additions & 0 deletions src/components/button/types/button.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import { buttonClasses } from '@/components/button/classes/button-classes'
import { LoaderProps, LoaderRef } from '@/components/loader'
import { RippleProps, RippleRef } from '@/components/ripple'
import { useLazyComponents } from '@/components/button/hooks/use-lazy-components'
import { SubLayerProps } from '@/components/sub-layer'

type ButtonRef = React.ElementRef<'button'>

Expand Down Expand Up @@ -48,6 +49,7 @@ type ButtonCustomProps = {
loaderProps?: LoaderProps
loaderRef?: React.Ref<LoaderRef>
loader?: React.ReactNode
subLayerProps?: SubLayerProps
rippleProps?: RippleProps
rippleRef?: React.Ref<RippleRef>
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/collapsible/types/collapsible-content.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { CollapsibleContent as CollapsibleContentPrimitive } from '@radix-ui/react-collapsible'
import { Simplify } from '@/components/_shared/types/simplify'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'

type CollapsibleContentPrimitiveType = typeof CollapsibleContentPrimitive

Expand Down
2 changes: 1 addition & 1 deletion src/components/dialog/types/dialog-content.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ import { Simplify } from '@/components/_shared/types/simplify'
import React from 'react'

import { CrossSmallIcon } from '@/components/_shared/components/icons/cross-small-icon'
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { ButtonProps } from '@/components/button'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'

type DialogContentPrimitiveType = typeof DialogContentPrimitive

Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { NavigationMenuContent as NavigationMenuContentPrimitive } from '@radix-ui/react-navigation-menu'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'
import React from 'react'

type NavigationMenuContentPrimitiveType = typeof NavigationMenuContentPrimitive
Expand Down
6 changes: 3 additions & 3 deletions src/components/navigation-menu/types/navigation-menu.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { Simplify } from '@/components/_shared/types/simplify'
import {
NavigationMenu as NavigationMenuPrimitive,
NavigationMenuIndicator as NavigationMenuIndicatorPrimitive,
NavigationMenuList as NavigationMenuListPrimitive,
NavigationMenu as NavigationMenuPrimitive,
NavigationMenuViewport as NavigationMenuViewportPrimitive,
} from '@radix-ui/react-navigation-menu'
import { Simplify } from '@/components/_shared/types/simplify'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'
import React from 'react'

type NavigationMenuPrimitiveType = typeof NavigationMenuPrimitive
Expand Down
2 changes: 1 addition & 1 deletion src/components/overlay/types/overlay.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { DialogOverlay as OverlayPrimitive } from '@radix-ui/react-dialog'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'

type OverlayPrimitiveType = typeof OverlayPrimitive

Expand Down
2 changes: 1 addition & 1 deletion src/components/popover/types/popover-content.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import {
PopoverArrow as PopoverArrowPrimitive,
PopoverContent as PopoverContentPrimitive,
} from '@radix-ui/react-popover'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'
import React from 'react'

type PopoverContentPrimitiveType = typeof PopoverContentPrimitive
Expand Down
2 changes: 1 addition & 1 deletion src/components/sheet/types/sheet-content.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,10 @@ import React from 'react'

import { CrossSmallIcon } from '@/components/_shared/components/icons/cross-small-icon'
import { NonNullableVariantProps } from '@/components/_shared/types/variants'
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { ButtonProps } from '@/components/button'
import { OverlayProps } from '@/components/overlay'
import { sheetClasses } from '@/components/sheet/classes/sheet-classes'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'

type SheetContentPrimitiveType = typeof SheetContentPrimitive

Expand Down
2 changes: 1 addition & 1 deletion src/components/skeleton/types/skeleton.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { Simplify } from '@/components/_shared/types/simplify'

import { AsChildProp } from '@/components/_shared/types/as-child'
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'

type SkeletonRef = React.ElementRef<'div'>

Expand Down
8 changes: 0 additions & 8 deletions src/components/text-area/components/text-area.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import React from 'react'
import { inputContainerClasses } from '@/components/_shared/classes/input-container-classes'
import { useControllableState } from '@/components/_shared/hooks/use-controllable-state'
import { Aria } from '@/components/aria'
import { buttonClasses } from '@/components/button'
import {
DEFAULT_TEXT_AREA_CLASSNAME,
DEFAULT_TEXT_AREA_CONTAINER_CLASSNAME,
Expand Down Expand Up @@ -59,13 +58,6 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>((props, ref) => {
data-required={isRequired}
data-slot='base'
className={cx(
buttonClasses({
variant,
hasDefaultHoverStyles: false,
hasDefaultPressedStyles: false,
hasLoaderOnLoading: false,
hasLowerOpacityOnLoading: false,
}),
inputContainerClasses({ variant }),
DEFAULT_TEXT_AREA_CONTAINER_CLASSNAME,
inputContainerClassName,
Expand Down
4 changes: 2 additions & 2 deletions src/components/tooltip/types/tooltip-content.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { AnimationStyleVariables } from '@/components/_shared/utils/get-animation-style-variables'
import { Simplify } from '@/components/_shared/types/simplify'
import {
TooltipArrow as TooltipArrowPrimitive,
TooltipContent as TooltipContentPrimitive,
} from '@radix-ui/react-tooltip'
import { Simplify } from '@/components/_shared/types/simplify'
import { AnimationStyleVariables } from '@renderui/utils/get-animation-style-variables'
import React from 'react'

type TooltipContentPrimitiveType = typeof TooltipContentPrimitive
Expand Down

0 comments on commit 176fe47

Please sign in to comment.