diff --git a/src/components/toast-bar.tsx b/src/components/toast-bar.tsx index 6525f7f..54673df 100644 --- a/src/components/toast-bar.tsx +++ b/src/components/toast-bar.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import { styled, keyframes } from 'goober'; -import { Toast, ToastPosition, resolveValue, Renderable } from '../core/types'; +import { Toast, ToastPosition, Renderable } from '../core/types'; import { ToastIcon } from './toast-icon'; -import { prefersReducedMotion } from '../core/utils'; +import { prefersReducedMotion, resolveValue } from '../core/utils'; const enterAnimation = (factor: number) => ` 0% {transform: translate3d(0,${factor * -200}%,0) scale(.6); opacity:.5;} @@ -72,9 +72,9 @@ export const ToastBar: React.FC = React.memo( ({ toast, position, style, children }) => { const animationStyle: React.CSSProperties = toast?.height ? getAnimationStyle( - toast.position || position || 'top-center', - toast.visible - ) + toast.position || position || 'top-center', + toast.visible + ) : { opacity: 0 }; const icon = ; diff --git a/src/components/toaster.tsx b/src/components/toaster.tsx index 250cf5a..a1ef872 100644 --- a/src/components/toaster.tsx +++ b/src/components/toaster.tsx @@ -7,9 +7,8 @@ import { ToastPosition, DefaultToastOptions, Toast, - resolveValue, } from '../core/types'; -import { createRectRef, prefersReducedMotion } from '../core/utils'; +import { createRectRef, prefersReducedMotion, resolveValue } from '../core/utils'; setup(React.createElement); @@ -21,13 +20,13 @@ const getPositionStyle = ( const verticalStyle: React.CSSProperties = top ? { top: 0 } : { bottom: 0 }; const horizontalStyle: React.CSSProperties = position.includes('center') ? { - justifyContent: 'center', - } + justifyContent: 'center', + } : position.includes('right') - ? { + ? { justifyContent: 'flex-end', } - : {}; + : {}; return { left: 0, right: 0, @@ -100,8 +99,8 @@ export const Toaster: React.FC = ({ const ref = t.height ? undefined : createRectRef((rect) => { - handlers.updateHeight(t.id, rect.height); - }); + handlers.updateHeight(t.id, rect.height); + }); return (
; diff --git a/src/core/types.ts b/src/core/types.ts index 4ea02e4..995b37f 100644 --- a/src/core/types.ts +++ b/src/core/types.ts @@ -21,16 +21,6 @@ export type ValueOrFunction = | TValue | ValueFunction; -const isFunction = ( - valOrFunction: ValueOrFunction -): valOrFunction is ValueFunction => - typeof valOrFunction === 'function'; - -export const resolveValue = ( - valOrFunction: ValueOrFunction, - arg: TArg -): TValue => (isFunction(valOrFunction) ? valOrFunction(arg) : valOrFunction); - export interface Toast { type: ToastType; id: string; diff --git a/src/core/utils.ts b/src/core/utils.ts index 098159a..73024e5 100644 --- a/src/core/utils.ts +++ b/src/core/utils.ts @@ -1,3 +1,5 @@ +import { ValueFunction, ValueOrFunction } from "./types"; + export const genId = (() => { let count = 0; return () => { @@ -28,3 +30,13 @@ export const prefersReducedMotion = (() => { return shouldReduceMotion; }; })(); + +const isFunction = ( + valOrFunction: ValueOrFunction +): valOrFunction is ValueFunction => + typeof valOrFunction === 'function'; + +export const resolveValue = ( + valOrFunction: ValueOrFunction, + arg: TArg +): TValue => (isFunction(valOrFunction) ? valOrFunction(arg) : valOrFunction); diff --git a/src/index.tsx b/src/index.tsx index 01bb29d..0ef31e3 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -10,7 +10,7 @@ export { ToastBar } from './components/toast-bar'; export { ToastIcon } from './components/toast-icon'; export { Toaster } from './components/toaster'; export { useStore as useToasterStore } from './core/store'; -export { resolveValue } from './core/types'; +export { resolveValue } from './core/utils'; export type ToastOptions = _ToastOptions; export type ToastPosition = _ToastPosition;